/* ================================================================
   CRIS LANDING — ONE INTELLIGENCE LAYER
   Loaded after landing-base.css (shared tokens).
   Rules: no inline styles, no !important, no media queries.
          Range overrides live in landing-responsive.css.
          Tree connectors are an SVG drawn by modules/landing-intelligence.js (hidden
          below 992px where the map stacks).
   ================================================================ */

/* ── 1. SECTION ── */
.plx-intel {
  background: var(--bg-banner);
  overflow: hidden;
  padding: var(--sp-64) 0;
  position: relative;
}
.plx-intel::before {
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
}
.plx-intel .container-xl { position: relative; z-index: var(--z-1); }

/* ── 2. TOP ROW: HEAD + SOURCES ── */
.plx-intel-flow { position: relative; }
.plx-intel-lines {
  height: 100%;
  inset: 0;
  overflow: visible;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: var(--z-2);
}
.plx-intel-link { fill: none; stroke-width: 1px; }
.plx-intel-link-in { stroke: var(--cyan-a78); }
.plx-intel-link-out { stroke: var(--lime-a80); }
.plx-intel-link-src { stroke: var(--green-a85); }
.plx-intel-dot-in { fill: var(--cyan); }
.plx-intel-dot-out { fill: var(--lime); }
.plx-intel-dot-src { fill: var(--green); }
.plx-intel-top { margin-bottom: var(--sp-64); }
.plx-intel-head { margin-bottom: var(--sp-40); max-width: var(--size-640); }
.plx-intel-eyebrow {
  color: var(--green);
  font-size: var(--fs-12);
  font-weight: 600;
  letter-spacing: .2em;
  margin-bottom: var(--sp-14);
  text-transform: uppercase;
}
.plx-intel-title {
  color: var(--t1);
  font-size: var(--fs-36);
  font-weight: 800;
  letter-spacing: -.02em;
  margin: 0 0 var(--sp-20);
}
.plx-intel-lead { color: var(--t2); font-size: var(--fs-14); margin: 0; }

.plx-intel-sources {
  display: grid;
  gap: var(--sp-12);
  grid-template-columns: repeat(5, minmax(0, 1fr));
  list-style: none;
  margin: 0 auto;
  max-width: var(--size-960);
  padding: 0;
}
.plx-intel-source {
  align-items: center;
  background: var(--bg-card);
  border: 1px solid var(--green-bd);
  border-radius: var(--br-inner);
  display: flex;
  flex-direction: column;
  gap: var(--sp-10);
  padding: var(--sp-20) var(--sp-8);
  position: relative;
  text-align: center;
  transition: background var(--t-default), border-color var(--t-default), transform var(--t-default);
}
.plx-intel-source:hover { background: var(--green-a05); border-color: var(--lime-bd); transform: translateY(-3px); }
.plx-intel-source i { color: var(--cyan); font-size: var(--size-28); }
.plx-intel-source-name { color: var(--t1); font-size: var(--fs-12); font-weight: 500; }

/* ── 3. MAP: PANEL | CORE | PANEL ── */
.plx-intel-map {
  align-items: stretch;
  display: grid;
  gap: var(--sp-64);
  grid-template-columns: minmax(0, 1fr) minmax(0, var(--size-420)) minmax(0, 1fr);
  margin-bottom: var(--sp-40);
}
.plx-intel-panel {
  background: var(--bg-card);
  border: 1px solid var(--green-bd);
  border-radius: var(--br-inner);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--sp-64) var(--sp-20) var(--sp-32);
  position: relative;
}
.plx-intel-panel-title {
  color: var(--t3);
  font-size: var(--fs-12);
  font-weight: 600;
  left: var(--sp-20);
  letter-spacing: .2em;
  margin: 0;
  position: absolute;
  text-transform: uppercase;
  top: var(--sp-16);
}
.plx-intel-list {
  display: grid;
  flex: 1 1 auto;
  gap: var(--sp-8);
  grid-auto-rows: 1fr;
  list-style: none;
  margin: 0;
  padding: 0;
}
.plx-intel-item {
  align-items: center;
  background: var(--bg-subtle);
  border: 1px solid var(--cyan-bd);
  border-radius: var(--br-inner);
  display: flex;
  gap: var(--sp-14);
  padding: var(--sp-6) var(--sp-14);
  position: relative;
  transition: background var(--t-default), border-color var(--t-default);
}
.plx-intel-item:hover { background: var(--bg-mid); border-color: var(--lime-bd); }
.plx-intel-item > i:first-child { color: var(--cyan); flex: 0 0 auto; font-size: var(--size-24); }
.plx-intel-item-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: var(--sp-2); min-width: 0; }
.plx-intel-item-name { color: var(--t1); font-size: var(--fs-12); font-weight: 600; }
.plx-intel-item-desc { color: var(--t4); font-size: var(--fs-12); }
.plx-intel-item-go { color: var(--t3); flex: 0 0 auto; font-size: var(--fs-12); }


/* ── 4. CORE: STACKED SLABS ── */
.plx-intel-core {
  border: 1px solid transparent;
  display: grid;
  filter: drop-shadow(0 0 var(--sp-24) var(--green-bd));
  gap: var(--sp-8);
  grid-auto-rows: 1fr;
  list-style: none;
  margin: 0;
  padding: var(--sp-64) 0 var(--sp-32);
}
.plx-intel-layer {
  align-items: center;
  background: linear-gradient(180deg, var(--green-bd), var(--bg-alt));
  border: 1px solid var(--green);
  border-radius: var(--br-inner);
  color: var(--t1);
  display: flex;
  font-size: var(--fs-12);
  font-weight: 500;
  justify-content: center;
  letter-spacing: .2em;
  padding: 0 var(--sp-12);
  text-align: center;
  text-transform: uppercase;
}
.plx-intel-layer:nth-child(even) { background: linear-gradient(180deg, var(--lime-bd), var(--green-bg)); }

/* ── 5. OUTCOMES ── */
.plx-intel-outcomes {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
.plx-intel-outcome {
  align-items: center;
  display: flex;
  gap: var(--sp-14);
  padding: 0 var(--sp-20);
}
.plx-intel-outcome + .plx-intel-outcome { border-left: 1px solid var(--border-md); }
.plx-intel-outcome i { color: var(--green); flex: 0 0 auto; font-size: var(--size-32); }
.plx-intel-outcome:nth-child(even) i { color: var(--cyan); }
.plx-intel-outcome-text { color: var(--t1); font-size: var(--fs-12); font-weight: 500; }

/* ── Banner image (replaces the built flow diagram) ── */
.plx-intel-banner     { display: block; }
.plx-intel-banner-img { display: block; height: auto; width: 100%; }
