/* ─────────────────────────────────────────────────────────────
   PAGES.CSS — Reusable inner-page cinematic component kit
   Loaded by every inner page (methodology, case-studies, about,
   partners, privacy) alongside slashing.css.
   Light = argument · Dark bands = proof. Mobile-first responsive.
   ───────────────────────────────────────────────────────────── */

:root {
  /* dark canvas (mirrors home.css; pages never load both) */
  --ink:        #0A0C10;
  --ink-2:      #0E1116;
  --ink-3:      #141821;
  --ink-line:   rgba(255,255,255,0.07);
  --ink-line-2: rgba(255,255,255,0.12);
  --ink-text:   #E8EBF1;
  --ink-soft:   #AEB6C4;
  --ink-muted:  #6B7585;
  --glow-red:   rgba(200,16,46,0.45);
  --glow-green: rgba(34,197,94,0.40);
  --glow-blue:  rgba(0,163,224,0.40);
  --ease-expo:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-weighted: cubic-bezier(0.65, 0, 0.20, 1);

  /* fluid rhythm */
  --pad-x:   clamp(22px, 5vw, 56px);
  --gap-col: clamp(32px, 4.5vw, 64px);
  --maxw:    1240px;
}

/* ── NAV: inverts over dark bands ── */
nav.site-nav {
  transition: background 0.5s var(--ease-weighted), border-color 0.5s var(--ease-weighted);
}
nav.site-nav.is-dark { background: rgba(10,12,16,0.72); border-bottom-color: var(--ink-line); }
nav.site-nav.is-dark .nav-logo { color: #fff; }
nav.site-nav.is-dark .nav-link { color: var(--ink-soft); }
nav.site-nav.is-dark .nav-link:hover { color: #fff; }
nav.site-nav.is-dark .nav-link.active { color: var(--blue); }

/* ── scroll progress rail ── */
.scroll-rail { position: fixed; top: 64px; left: 0; height: 2px; width: 100%; z-index: 101; pointer-events: none; }
.scroll-rail__fill { height: 100%; width: 0%; background: linear-gradient(90deg, var(--red), var(--blue)); box-shadow: 0 0 12px var(--glow-red); transition: width 0.1s linear; }

/* ───────────────────────────────────────────
   PAGE HERO (light, cinematic)
   ─────────────────────────────────────────── */
.phero {
  position: relative;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: clamp(120px, 16vh, 168px) var(--pad-x) clamp(48px, 7vw, 84px);
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  align-items: end;
  gap: var(--gap-col);
}
.phero--solo { grid-template-columns: 1fr; }

.phero__kicker {
  font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 3.5px;
  color: var(--red); text-transform: uppercase;
  display: flex; align-items: center; gap: 14px; margin-bottom: 26px;
}
.phero__kicker::before { content: ''; width: 34px; height: 1px; background: var(--red); transform-origin: left; transform: scaleX(0); animation: ruleDraw 0.9s var(--ease-expo) 0.2s forwards; }
@keyframes ruleDraw { to { transform: scaleX(1); } }

.phero__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(52px, 8vw, 104px); line-height: 0.86; letter-spacing: 1px;
  color: var(--black);
}
.phero__title .accent { color: var(--red); }
.phero__title .accent-blue { color: var(--blue); }
.phero__title .ln { display: block; overflow: hidden; }
.phero__title .ln > span { display: block; transform: translateY(110%); animation: lineRise 1s var(--ease-expo) forwards; }
.phero__title .ln:nth-child(1) > span { animation-delay: 0.10s; }
.phero__title .ln:nth-child(2) > span { animation-delay: 0.18s; }
.phero__title .ln:nth-child(3) > span { animation-delay: 0.26s; }
.phero__title .ln:nth-child(4) > span { animation-delay: 0.34s; }
@keyframes lineRise { to { transform: translateY(0); } }

.phero__intro {
  font-size: clamp(15px, 1.5vw, 17px); font-weight: 300; color: var(--text-secondary);
  line-height: 1.78; max-width: 520px;
  opacity: 0; animation: softIn 1s var(--ease-expo) 0.5s forwards;
}
.phero__intro strong { color: var(--black); font-weight: 500; }
@keyframes softIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* ───────────────────────────────────────────
   BANDS (section shells) — light & dark
   ─────────────────────────────────────────── */
.band { position: relative; z-index: 1; padding: clamp(56px, 8vw, 100px) 0; }
.band__inner { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--pad-x); position: relative; z-index: 1; }
.band + .band { border-top: 1px solid var(--border); }

.band--dark {
  background: var(--ink); color: var(--ink-text);
  border-top: none !important; overflow: hidden;
}
.band--dark::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: linear-gradient(to right, var(--ink-line) 1px, transparent 1px),
                    linear-gradient(to bottom, var(--ink-line) 1px, transparent 1px);
  background-size: 80px 80px;
  -webkit-mask-image: radial-gradient(100% 75% at 50% 30%, #000 18%, transparent 78%);
  mask-image: radial-gradient(100% 75% at 50% 30%, #000 18%, transparent 78%);
  opacity: 0.6;
}
/* seams between light↔dark */
.seam-down { height: clamp(80px,12vw,130px); background: linear-gradient(180deg, var(--white), var(--ink)); position: relative; z-index: 1; }
.seam-up   { height: clamp(70px,10vw,110px); background: linear-gradient(180deg, var(--ink), var(--white)); position: relative; z-index: 1; }
.seam-down::before { content:''; position:absolute; left:var(--pad-x); right:var(--pad-x); top:50%; height:1px; background:linear-gradient(90deg,transparent,var(--red),var(--blue),transparent); opacity:0; transform:scaleX(0.2); transition:opacity 1s var(--ease-expo), transform 1.4s var(--ease-expo); }
.seam-down.lit::before { opacity:0.9; transform:scaleX(1); }

/* ── headings inside bands ── */
.kicker { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 3.5px; text-transform: uppercase; color: var(--red); margin-bottom: 16px; display: flex; align-items: center; gap: 12px; }
.kicker.blue { color: var(--blue); }
.band--dark .kicker { color: var(--blue); }
.kicker::before { content: ''; width: 28px; height: 1px; background: currentColor; }

.h-sec { font-family: 'Bebas Neue', sans-serif; font-size: clamp(34px, 4.4vw, 60px); letter-spacing: 1.5px; line-height: 0.94; color: var(--black); margin-bottom: 26px; }
.band--dark .h-sec { color: #fff; }
.h-sec .accent { color: var(--red); }

.prose { font-size: clamp(14.5px, 1.4vw, 16px); font-weight: 300; color: var(--text-secondary); line-height: 1.85; max-width: 560px; }
.prose strong { color: var(--black); font-weight: 500; }
.band--dark .prose { color: var(--ink-soft); }
.band--dark .prose strong { color: #fff; }
.prose p { margin-bottom: 1.15em; }
.prose p:last-child { margin-bottom: 0; }

/* big index numeral that ghosts behind a section */
.ghost-no { position: absolute; top: clamp(-10px,-1vw,0px); right: var(--pad-x); font-family: 'Bebas Neue', sans-serif; font-size: clamp(90px, 14vw, 200px); line-height: 1; color: rgba(13,15,18,0.045); pointer-events: none; z-index: 0; }
.band--dark .ghost-no { color: rgba(255,255,255,0.035); }

/* ───────────────────────────────────────────
   SPLIT — text + visual, fully responsive
   ─────────────────────────────────────────── */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-col); align-items: center; }
.split--text-lead { grid-template-columns: 1.05fr 0.95fr; }
.split--reverse .split__visual { order: -1; }
.split__visual { min-width: 0; }

/* ───────────────────────────────────────────
   FIGURE — photo / media frame with caption
   ─────────────────────────────────────────── */
.figure { position: relative; border: 1px solid var(--border); border-top: 2px solid var(--blue); background: var(--surface2); overflow: hidden; }
.band--dark .figure { border-color: var(--ink-line-2); background: var(--ink-2); }
.figure__media { display: block; width: 100%; height: auto; }
.figure__media.cover { height: clamp(220px, 34vw, 320px); object-fit: cover; }
.figure__ratio { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.figure__ratio > iframe, .figure__ratio > img, .figure__ratio > video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.figure__overlay { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 22px; background: linear-gradient(transparent, rgba(8,10,13,0.96) 75%); }
.figure__overlay .t { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 2px; color: #fff; text-transform: uppercase; }
.figure__cap { padding: 13px 16px; background: var(--surface3); border-top: 1px solid var(--border); }
.band--dark .figure__cap { background: var(--ink-3); border-top-color: var(--ink-line); }
.figure__cap .lab { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 2px; color: var(--blue); text-transform: uppercase; }
.figure__cap .txt { font-family: 'DM Mono', monospace; font-size: 10px; color: var(--muted); margin-top: 4px; line-height: 1.5; }

/* placeholder frame — a deliberate slot for David to drop real imagery */
.figure--slot { border-top-color: var(--muted); }
.figure__slot { display: grid; place-items: center; gap: 10px; min-height: clamp(200px, 30vw, 280px); text-align: center; padding: 28px; background:
  repeating-linear-gradient(45deg, transparent 0 14px, rgba(107,117,133,0.05) 14px 15px); }
.figure__slot .ic { font-family: 'Bebas Neue', sans-serif; font-size: 30px; letter-spacing: 2px; color: var(--muted); }
.figure__slot .hint { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 1.5px; color: var(--muted); text-transform: uppercase; }

/* ───────────────────────────────────────────
   EXHIBIT — dark data panel (charts live here)
   ─────────────────────────────────────────── */
.exhibit { background: var(--ink); border: 1px solid var(--ink-line-2); border-top: 2px solid var(--red); box-shadow: 0 30px 70px -34px rgba(0,0,0,0.5); overflow: hidden; }
.band--dark .exhibit { background: var(--ink-2); }
.exhibit__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 20px; background: var(--ink-2); border-bottom: 1px solid var(--ink-line); }
.band--dark .exhibit__head { background: var(--ink-3); }
.exhibit__title { font-family: 'DM Mono', monospace; font-size: 10.5px; letter-spacing: 2px; text-transform: uppercase; color: var(--ink-soft); }
.exhibit__tag { font-family: 'DM Mono', monospace; font-size: 9.5px; letter-spacing: 1.5px; color: var(--blue); white-space: nowrap; }
.exhibit__body { padding: clamp(18px, 3vw, 26px); }
.exhibit__svg { width: 100%; height: auto; display: block; }
.exhibit__foot { padding: 12px 20px; border-top: 1px solid var(--ink-line); font-family: 'DM Mono', monospace; font-size: 10px; color: var(--ink-muted); line-height: 1.6; }
.exhibit__foot .pos { color: var(--green); }
.exhibit__foot .neg { color: var(--red); }

/* ───────────────────────────────────────────
   BAR CHART (animated horizontal bars)
   ─────────────────────────────────────────── */
.barset { display: grid; gap: 16px; }
.bar__lab { display: flex; justify-content: space-between; align-items: baseline; font-family: 'DM Mono', monospace; font-size: 11px; color: var(--ink-soft); margin-bottom: 6px; }
.bar__lab .n { color: #fff; font-size: 13px; }
.bar__track { height: 12px; background: var(--ink-3); border: 1px solid var(--ink-line); position: relative; overflow: hidden; }
/* filled by default (no-JS safe); JS empties it then fills on reveal */
.bar__fill { position: absolute; top: 0; bottom: 0; left: 0; right: calc(100% - var(--w)); }
.js .bar__fill[data-bar] { right: 100%; transition: right 1.2s var(--ease-expo); }
.js .is-in .bar__fill[data-bar] { right: calc(100% - var(--w)); }
.bar__fill.red   { background: linear-gradient(90deg, var(--red-dim), var(--red)); box-shadow: 0 0 16px var(--glow-red); }
.bar__fill.green { background: linear-gradient(90deg, #16a34a, var(--green)); box-shadow: 0 0 16px var(--glow-green); }
.bar__fill.blue  { background: linear-gradient(90deg, var(--blue-dim), var(--blue)); box-shadow: 0 0 16px var(--glow-blue); }
.bar__fill.grey  { background: linear-gradient(90deg, #3a4150, #5a6577); }

/* ───────────────────────────────────────────
   NOTE CARD (elevated principle/insight card)
   ─────────────────────────────────────────── */
.cards { display: grid; gap: 16px; }
.note { background: var(--surface2); border: 1px solid var(--border); border-left: 2px solid var(--blue); padding: 24px 26px; }
.band--dark .note { background: var(--ink-2); border-color: var(--ink-line); }
.note__tag { font-family: 'DM Mono', monospace; font-size: 9.5px; letter-spacing: 2px; text-transform: uppercase; color: var(--blue); margin-bottom: 8px; }
.note__title { font-family: 'Bebas Neue', sans-serif; font-size: 19px; letter-spacing: 0.5px; color: var(--black); margin-bottom: 10px; line-height: 1.05; }
.band--dark .note__title { color: #fff; }
.note__body { font-size: 13px; font-weight: 300; color: var(--muted); line-height: 1.7; }
.note__body strong { color: var(--black); font-weight: 500; }
.band--dark .note__body { color: var(--ink-soft); }
.band--dark .note__body strong { color: #fff; }

/* ───────────────────────────────────────────
   METRIC CALLOUTS (big numbers)
   ─────────────────────────────────────────── */
.metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; background: var(--ink-line); border: 1px solid var(--ink-line); }
.metric { background: var(--ink-2); padding: 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.metric__lab { font-family: 'DM Mono', monospace; font-size: 9.5px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--ink-muted); }
.metric__val { font-family: 'Bebas Neue', sans-serif; font-size: clamp(30px, 4vw, 42px); letter-spacing: 1px; color: #fff; line-height: 1; }
.metric__val .u { font-size: 0.45em; color: var(--ink-soft); margin-left: 4px; }
.metric__val.red { color: #fff; text-shadow: 0 0 18px var(--glow-red); }

/* architecture dimension list */
.dims { display: grid; gap: 2px; background: var(--ink-line); border: 1px solid var(--ink-line); }
.dim { background: var(--ink-2); padding: 16px 18px; }
.dim__no { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 2px; color: var(--red); margin-bottom: 5px; }
.dim__no.blue { color: var(--blue); }
.dim__txt { font-size: 12.5px; color: var(--ink-soft); font-weight: 300; line-height: 1.6; }

/* ── inline CTA link (arrow) ── */
.link-arrow { font-family: 'DM Mono', monospace; font-size: clamp(12px,1.4vw,14px); letter-spacing: 2px; color: var(--red); text-decoration: none; text-transform: uppercase; border-bottom: 1px solid rgba(200,16,46,0.4); padding-bottom: 4px; transition: color 0.2s, border-color 0.2s; }
.link-arrow:hover { color: var(--black); border-color: var(--red); }
.band--dark .link-arrow:hover { color: #fff; }

/* ───────────────────────────────────────────
   CASE STUDIES
   ─────────────────────────────────────────── */
/* index grid of case cards — responsive */
.cs-index { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1px; background: var(--border); border: 1px solid var(--border); }
.csx { display: block; text-decoration: none; background: var(--surface); padding: 26px; border-top: 2px solid var(--csx, var(--red)); transition: background 0.2s var(--ease-weighted), transform 0.2s var(--ease-weighted); }
.csx:hover { background: var(--surface2); transform: translateY(-2px); }
.csx__no { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--csx, var(--red)); margin-bottom: 12px; }
.csx__title { font-family: 'Bebas Neue', sans-serif; font-size: 22px; letter-spacing: 1px; color: var(--black); margin-bottom: 8px; line-height: 1; }
.csx__desc { font-size: 12px; color: var(--muted); line-height: 1.7; font-weight: 300; margin-bottom: 16px; }
.csx__read { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 1px; color: var(--csx, var(--red)); }

/* 2-column profile table variant (stays 2-up even on mobile — label+value reads fine) */
.trade-2col .trade-header, .trade-2col .trade-row { grid-template-columns: 1.5fr 1fr; }
.trade-cell.r, .trade-header-cell.r { text-align: right; }

/* accent tokens per case */
.cs-red    { --csx: var(--red); }
.cs-green  { --csx: var(--green); }
.cs-blue   { --csx: var(--blue); }

/* exhibit accent variants */
.exhibit.green { border-top-color: var(--green); }
.exhibit.blue  { border-top-color: var(--blue); }

/* coda — the closing verdict / compounding block */
.coda { margin-top: 40px; background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--csx, var(--red)); padding: clamp(26px, 5vw, 48px); }
.coda__kicker { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--csx, var(--red)); margin-bottom: 16px; }
.coda__title { font-family: 'Bebas Neue', sans-serif; font-size: clamp(26px, 4vw, 34px); letter-spacing: 1.5px; color: var(--black); margin-bottom: 24px; line-height: 1.02; }
.coda__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)); gap: 1px; background: var(--border); margin-bottom: 30px; }
.coda__cell { background: var(--surface2); padding: 24px; }
.coda__cell .l { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; display: block; }
.coda__cell .l.red { color: var(--red); } .coda__cell .l.green { color: var(--green); } .coda__cell .l.blue { color: var(--blue); }
.coda__cell .n { font-family: 'Bebas Neue', sans-serif; font-size: clamp(26px, 4vw, 36px); line-height: 1; margin-bottom: 8px; color: var(--black); display: block; }
.coda__cell .n.red { color: var(--red); } .coda__cell .n.green { color: var(--green); } .coda__cell .n.blue { color: var(--blue); }
.coda__cell .d { font-size: 12px; color: var(--muted); line-height: 1.7; font-weight: 300; }
.coda__cell .d strong { color: var(--black); font-weight: 500; }
.coda__text { font-size: clamp(14px, 1.5vw, 15px); color: var(--text-secondary); line-height: 1.9; font-weight: 300; max-width: 800px; }
.coda__text strong { color: var(--black); font-weight: 500; }
.coda__text p { margin-bottom: 1.1em; } .coda__text p:last-child { margin-bottom: 0; }

/* ───────────────────────────────────────────
   NARRATIVE PAGES (about, etc.)
   ─────────────────────────────────────────── */
.pullq { border-left: 2px solid var(--red); padding: 6px 0 6px 24px; margin: 30px 0 4px; }
.pullq__t { font-family: 'Bebas Neue', sans-serif; font-size: clamp(23px, 3.2vw, 33px); letter-spacing: 1px; line-height: 1.12; color: var(--black); }
.pullq__t .accent { color: var(--red); }
.band--dark .pullq__t { color: #fff; }

/* big centered statement inside a dark band */
.statement { text-align: center; max-width: 1000px; margin: 0 auto; }
.statement__t { font-family: 'Bebas Neue', sans-serif; font-size: clamp(34px, 5.6vw, 74px); letter-spacing: 2px; line-height: 1.02; color: #fff; }
.statement__t .accent { color: var(--red); }
.statement__by { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--ink-soft); margin-top: 28px; }
.statement__by span { color: var(--ink-muted); }

/* feature cards (identity grid) */
.feat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1px; background: var(--border); border: 1px solid var(--border); }
.feat { background: var(--surface2); padding: 30px 28px; border-top: 2px solid var(--blue); }
.feat__icon { font-family: 'Bebas Neue', sans-serif; font-size: 26px; letter-spacing: 2px; color: var(--red); margin-bottom: 14px; }
.feat__title { font-family: 'Bebas Neue', sans-serif; font-size: 20px; letter-spacing: 0.5px; color: var(--black); margin-bottom: 10px; }
.feat__body { font-size: 13px; color: var(--muted); line-height: 1.7; font-weight: 300; }
.feat__body strong { color: var(--black); font-weight: 500; }

/* prose-wide variant for full-bleed intro paragraphs */
.prose--wide { max-width: 760px; }

/* ───────────────────────────────────────────
   PARTNERS
   ─────────────────────────────────────────── */
/* request form */
.field { margin-bottom: 14px; }
.field__lab { display: block; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.band--dark .field__lab { color: var(--ink-muted); }
.field__in { width: 100%; background: var(--surface); border: 1px solid var(--border); color: var(--black); font-family: 'DM Mono', monospace; font-size: 13px; padding: 12px 14px; outline: none; transition: border-color 0.2s; }
.band--dark .field__in { background: var(--ink-3); border-color: var(--ink-line); color: #fff; }
.field__in:focus { border-color: var(--red); }
.formcard { background: var(--surface2); border: 1px solid var(--border); border-top: 2px solid var(--red); padding: 26px; }
.band--dark .formcard { background: var(--ink-2); border-color: var(--ink-line-2); }
.formcard__lab { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--red); margin-bottom: 18px; }
.formcard__note { font-size: 11px; color: var(--muted); line-height: 1.6; margin-top: 14px; font-weight: 300; }
.btn-full { width: 100%; text-align: center; }

/* what-you-get mini cards */
.getgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--border); border: 1px solid var(--border); margin-top: 16px; }
.getc { background: var(--surface2); padding: 20px; }
.getc__n { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 2px; color: var(--red); margin-bottom: 8px; }
.getc__t { font-family: 'Bebas Neue', sans-serif; font-size: 17px; letter-spacing: 0.5px; color: var(--black); margin-bottom: 8px; line-height: 1; }
.getc__b { font-size: 12px; color: var(--muted); line-height: 1.6; font-weight: 300; }
.getc__b strong { color: var(--black); font-weight: 500; }

/* category header */
.cathead { display: grid; grid-template-columns: auto 1fr; gap: clamp(16px, 3vw, 28px); align-items: start; margin-bottom: 36px; }
.cathead__no { font-family: 'Bebas Neue', sans-serif; font-size: clamp(44px, 7vw, 84px); line-height: 0.85; color: rgba(13,15,18,0.10); }
.band--dark .cathead__no { color: rgba(255,255,255,0.13); }
.cathead__lab { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--blue); }
.cathead__title { font-family: 'Bebas Neue', sans-serif; font-size: clamp(30px, 4vw, 48px); letter-spacing: 1.5px; line-height: 0.95; color: var(--black); margin: 8px 0 16px; }
.band--dark .cathead__title { color: #fff; }
.cathead__desc { font-size: 15px; color: var(--text-secondary); line-height: 1.8; font-weight: 300; max-width: 640px; }
.band--dark .cathead__desc { color: var(--ink-soft); }
.cathead__desc strong { color: var(--black); font-weight: 500; }
.band--dark .cathead__desc strong { color: #fff; }

/* partner cards */
.pgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 1px; background: var(--border); border: 1px solid var(--border); }
.band--dark .pgrid { background: var(--ink-line); border-color: var(--ink-line); }
.pcard { background: var(--surface2); padding: 28px; border-top: 2px solid var(--blue); }
.band--dark .pcard { background: var(--ink-2); }
.pcard.green-top { border-top-color: var(--green); }
.pcard__status { display: inline-block; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; padding: 3px 9px; margin-bottom: 14px; border: 1px solid; }
.pstatus-target { color: var(--blue); border-color: rgba(0,163,224,0.3); background: rgba(0,163,224,0.07); }
.pstatus-build { color: var(--green); border-color: rgba(34,197,94,0.3); background: rgba(34,197,94,0.07); }
.pcard__name { font-family: 'Bebas Neue', sans-serif; font-size: 26px; letter-spacing: 1px; color: var(--black); line-height: 1; margin-bottom: 5px; }
.band--dark .pcard__name { color: #fff; }
.pcard__type { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 1px; color: var(--muted); text-transform: uppercase; margin-bottom: 14px; }
.pcard__desc { font-size: 13px; color: var(--muted); line-height: 1.7; font-weight: 300; margin-bottom: 16px; }
.pcard__desc strong { color: var(--black); font-weight: 500; }
.band--dark .pcard__desc { color: var(--ink-soft); } .band--dark .pcard__desc strong { color: #fff; }
.pcard__val { border-top: 1px solid var(--border); padding-top: 14px; }
.band--dark .pcard__val { border-top-color: var(--ink-line); }
.pcard__val .l { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--blue); display: block; margin-bottom: 6px; }
.pcard__val .t { font-size: 12px; color: var(--muted); line-height: 1.6; font-weight: 300; }
.band--dark .pcard__val .t { color: var(--ink-soft); }

/* pipeline list (dark instrument) */
.pipeline { border: 1px solid var(--ink-line); }
.pipe { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--ink-line); background: var(--ink-2); }
.pipe:last-child { border-bottom: none; }
.pipe__no { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--ink-muted); }
.pipe__name { font-size: 13.5px; color: #fff; font-weight: 500; }
.pipe__name span { display: block; font-family: 'DM Mono', monospace; font-size: 10px; color: var(--ink-muted); font-weight: 400; margin-top: 3px; letter-spacing: 0.3px; }
.pipe__st { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; padding: 3px 9px; border: 1px solid; white-space: nowrap; }
.pipe-live { color: var(--green); border-color: rgba(34,197,94,0.3); background: rgba(34,197,94,0.07); }
.pipe-planned { color: var(--ink-muted); border-color: var(--ink-line-2); }

@media (max-width: 520px) {
  .getgrid { grid-template-columns: 1fr; }
  .cathead { grid-template-columns: 1fr; gap: 8px; }
}

/* ───────────────────────────────────────────
   LEGAL (privacy)
   ─────────────────────────────────────────── */
.legal { background: var(--surface2); border: 1px solid var(--border); border-left: 3px solid var(--red); padding: clamp(26px, 4vw, 40px); margin-bottom: 22px; }
.legal__lab { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--red); margin-bottom: 18px; }
.legal__t { font-size: 15px; color: var(--text-secondary); line-height: 1.9; font-weight: 300; }
.legal__t strong { color: var(--black); font-weight: 500; }
.legal__t a { color: var(--blue); text-decoration: none; }
.legal__t a:hover { text-decoration: underline; }
.legal-contact { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 1px; color: var(--muted); margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--border); }
.legal-contact a { color: var(--blue); text-decoration: none; }
.legal-contact a:hover { text-decoration: underline; }

/* ───────────────────────────────────────────
   REVEAL — staggered, weighted
   ─────────────────────────────────────────── */
.js [data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity 0.8s var(--ease-expo), transform 0.8s var(--ease-expo); }
[data-reveal].is-in { opacity: 1; transform: none; }
.js [data-stagger] > * { opacity: 0; transform: translateY(22px); transition: opacity 0.7s var(--ease-expo), transform 0.7s var(--ease-expo); }
[data-stagger].is-in > * { opacity: 1; transform: none; }
[data-stagger].is-in > *:nth-child(2) { transition-delay: 0.08s; }
[data-stagger].is-in > *:nth-child(3) { transition-delay: 0.16s; }
[data-stagger].is-in > *:nth-child(4) { transition-delay: 0.24s; }
[data-stagger].is-in > *:nth-child(5) { transition-delay: 0.32s; }
[data-stagger].is-in > *:nth-child(6) { transition-delay: 0.40s; }

/* ───────────────────────────────────────────
   RESPONSIVE
   ─────────────────────────────────────────── */
@media (max-width: 960px) {
  .phero { grid-template-columns: 1fr; align-items: start; gap: 36px; }
  .split, .split--text-lead { grid-template-columns: 1fr; gap: 36px; }
  .split--reverse .split__visual { order: 0; }   /* visual returns below text on mobile */
  .prose { max-width: none; }
}
@media (max-width: 860px) {
  nav.site-nav .nav-links { display: none; }       /* clean landing-page nav on small screens */
  nav.site-nav { padding: 0 20px; }
}
@media (max-width: 520px) {
  .metrics { grid-template-columns: 1fr 1fr; }
  .figure__media.cover { height: 200px; }
}

/* ───────────────────────────────────────────
   REDUCED MOTION
   ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .phero__kicker::before { animation: none; transform: scaleX(1); }
  .phero__title .ln > span, .phero__intro { animation: none !important; opacity: 1 !important; transform: none !important; }
  [data-reveal], [data-stagger] > * { transition: none !important; opacity: 1 !important; transform: none !important; }
  .bar__fill { transition: none !important; }
  .seam-down.lit::before { transition: none; }
  .scroll-rail__fill { transition: none; }
}