/* ═══════════════════════════════════════
   OPENRIDGE AI — v2 Rebrand
   Establishment firm. Navy-dominant. Inter + GT Sectra-inspired serif.
   ═══════════════════════════════════════ */

:root {
  /* NEW TYPE PAIRING: Serif display + clean sans body */
  --ff-head: 'Fraunces', 'Playfair Display', Georgia, serif;
  --ff-body: 'Inter Tight', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --ff-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* SURFACES — navy-dominant, ivory accent */
  --ivory: #F4F1EA;
  --ivory-2: #EAE5DA;
  --paper: #FBF9F4;
  --navy-950: #081423;       /* primary dark */
  --navy-900: #0C1B2E;
  --navy-800: #13263D;
  --navy-700: #1D3350;
  --navy-600: #2C4766;
  --navy-500: #4A6482;
  --navy-400: #7A8FA8;
  --navy-300: #AEBCCD;
  --navy-200: #D4DCE6;
  --navy-100: #E8ECF2;

  /* ACCENTS — restrained */
  --gold: #C9A84C;
  --gold-lt: #E2C06A;
  --teal: #1F8A80;
  --copper: #B8632C;

  /* TEXT */
  --text-ink: #0A1220;
  --text-body: #2C3E55;
  --text-mute: #5E728A;
  --text-faint: #8B9AAF;

  /* BORDERS */
  --rule: rgba(8, 20, 35, 0.10);
  --rule-strong: rgba(8, 20, 35, 0.22);
  --rule-dark: rgba(255, 255, 255, 0.10);
  --rule-dark-strong: rgba(255, 255, 255, 0.18);

  --container-w: 1280px;
  --section-y: 64px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--ff-body);
  background: var(--ivory);
  color: var(--text-body);
  font-size: 15px;
  line-height: 1.6;
  font-weight: 400;
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
}

.container { max-width: var(--container-w); margin: 0 auto; padding: 0 48px; }
section { padding: var(--section-y) 0; }

/* ── TYPE ── */
h1, h2, h3, h4 { text-wrap: balance; font-family: var(--ff-head); color: var(--text-ink); letter-spacing: -0.02em; }
h1 {
  font-size: clamp(48px, 6.2vw, 92px);
  font-weight: 400;
  line-height: 0.98;
  margin-bottom: 32px;
  font-variation-settings: "opsz" 144, "SOFT" 30;
}
/* ── Title identity (site-wide): upright + blue highlight band, gold text ── */
h1 em, h2 em, h3 em {
  font-style: normal;
  font-weight: 400;
  color: var(--gold-lt);
  background: linear-gradient(transparent 32%, var(--navy-900) 32%);
  padding: 0 0.08em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
/* dark/navy sections: lift the band with a mid-blue — add class .on-dark to the section */
.on-dark h1 em, .on-dark h2 em, .on-dark h3 em {
  background: linear-gradient(transparent 32%, var(--navy-600) 32%);
}
/* ── Citation source links (site-wide) ── */
.cite a, .gap-src a, .src a {
  color: inherit; text-decoration: none;
  border-bottom: 1px solid currentColor; opacity: 0.8;
  transition: color 0.18s ease, opacity 0.18s ease;
}
.cite a:hover, .cite a:focus-visible,
.gap-src a:hover, .gap-src a:focus-visible,
.src a:hover, .src a:focus-visible { color: var(--gold); opacity: 1; outline: none; }
/* ── Emphasis anchors ── */
strong { font-weight: 600; }
h2 {
  font-size: clamp(32px, 3.8vw, 56px);
  font-weight: 400;
  line-height: 1.02;
  margin-bottom: 24px;
  font-variation-settings: "opsz" 96, "SOFT" 30;
}
h2 em { font-style: italic; font-weight: 400; color: var(--gold); }
h3 { font-size: 24px; font-weight: 500; line-height: 1.2; margin-bottom: 12px; }
h4 { font-size: 17px; font-weight: 500; line-height: 1.3; margin-bottom: 10px; }

.eyebrow {
  font-family: var(--ff-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-mute);
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
}
.eyebrow .no {
  color: var(--navy-800);
  font-weight: 600;
}
.eyebrow::before {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--navy-800);
}

.lead {
  font-size: 19px;
  line-height: 1.55;
  color: var(--text-body);
  font-weight: 400;
  max-width: 680px;
}

.body-sm { font-size: 14px; line-height: 1.65; color: var(--text-body); }

/* ── BUTTONS ── */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 15px 26px;
  font-family: var(--ff-body);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-decoration: none;
  border-radius: 0;
  border: 1px solid transparent;
  transition: all 0.2s ease;
  cursor: pointer;
}
.btn-dark { background: var(--navy-950); color: var(--ivory); }
.btn-dark:hover { background: var(--navy-800); }
.btn-dark .arrow { transition: transform 0.22s ease; display: inline-block; }
.btn-dark:hover .arrow { transform: translateX(4px); }
.btn-light { background: transparent; color: var(--navy-950); border-color: var(--navy-950); }
.btn-light:hover { background: var(--navy-950); color: var(--ivory); }
.btn-gold { background: var(--gold); color: var(--navy-950); }
.btn-gold:hover { background: var(--gold-lt); }

.link-u {
  color: var(--navy-950); text-decoration: none;
  border-bottom: 1px solid var(--navy-950);
  padding-bottom: 2px;
  font-weight: 500;
  transition: color .2s;
}
.link-u:hover { color: var(--gold); border-bottom-color: var(--gold); }

/* ── NAV ── */
nav {
  position: sticky; top: 0; z-index: 100;
  background: rgba(244, 241, 234, 0.88);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--rule);
  padding: 0 48px;
  height: 76px;
  display: flex; align-items: center; gap: 40px;
}
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.logo-img {
  height: 40px;
  width: auto;
  display: block;
}
.nav-links { display: flex; gap: 32px; margin-left: 32px; }
.nav-links a {
  font-size: 14px; color: var(--text-body); text-decoration: none;
  font-weight: 500; transition: color .2s;
}
.nav-links a:hover { color: var(--navy-950); }
.nav-right { margin-left: auto; display: flex; align-items: center; gap: 20px; }
.nav-phone {
  font-family: var(--ff-mono); font-size: 12px; color: var(--text-mute);
  text-decoration: none; letter-spacing: 0.04em;
}
.nav-cta {
  background: var(--navy-950); color: var(--ivory);
  padding: 10px 18px; font-size: 13px; font-weight: 500;
  text-decoration: none; transition: background .2s;
}
.nav-cta:hover { background: var(--navy-800); }
.nav-toggle { display: none; background: none; border: none; cursor: pointer; }
.nav-toggle span { display: block; width: 22px; height: 1.5px; background: var(--navy-950); margin: 5px 0; }

/* ── HERO — big editorial masthead with full-width mountain canvas ── */
.hero {
  background: var(--ivory);
  padding: 72px 0 0;
  position: relative;
}
.hero-inner {
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 0 48px;
}
.hero-headline {
  max-width: 1100px;
  margin-bottom: 64px;
}
.hero-headline h1 {
  font-size: clamp(52px, 7.5vw, 128px);
  line-height: 0.94;
  letter-spacing: -0.035em;
  font-weight: 400;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  margin-bottom: 72px;
  align-items: start;
}
.hero-sub {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 26px;
  line-height: 1.3;
  color: var(--navy-800);
  font-weight: 400;
  max-width: 640px;
}
.hero-side {
  padding-top: 12px;
}
.hero-side-label {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-bottom: 14px;
}
.hero-side-body {
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-body);
  margin-bottom: 28px;
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* Full-width animated mountain canvas */
.hero-canvas {
  position: relative;
  width: 100%;
  height: clamp(340px, 48vw, 620px);
  background: var(--navy-950);
  overflow: hidden;
  margin-bottom: 0;
}
.hero-canvas-sky {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 30%, rgba(201, 168, 76, 0.15) 0%, transparent 55%),
    radial-gradient(ellipse 100% 70% at 20% 80%, rgba(31, 138, 128, 0.08) 0%, transparent 60%),
    linear-gradient(180deg, #0A1726 0%, #081423 60%, #050E18 100%);
}
.hero-canvas-stars {
  position: absolute; inset: 0;
  background-image: radial-gradient(circle at 10% 20%, rgba(255,255,255,0.8) 0, rgba(255,255,255,0) 1px),
                    radial-gradient(circle at 30% 15%, rgba(255,255,255,0.6) 0, rgba(255,255,255,0) 1px),
                    radial-gradient(circle at 55% 8%, rgba(255,255,255,0.7) 0, rgba(255,255,255,0) 1px),
                    radial-gradient(circle at 75% 22%, rgba(255,255,255,0.5) 0, rgba(255,255,255,0) 1px),
                    radial-gradient(circle at 88% 12%, rgba(255,255,255,0.7) 0, rgba(255,255,255,0) 1px),
                    radial-gradient(circle at 18% 34%, rgba(255,255,255,0.4) 0, rgba(255,255,255,0) 1px),
                    radial-gradient(circle at 62% 28%, rgba(255,255,255,0.5) 0, rgba(255,255,255,0) 1px);
  background-size: 100% 100%;
  opacity: 0.9;
}
.hero-canvas-rule {
  position: absolute;
  left: 48px; right: 48px;
  bottom: 18%;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(201,168,76,0.4) 20%, rgba(201,168,76,0.6) 50%, rgba(201,168,76,0.4) 80%, transparent);
}
#pixel-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.hero-canvas-meta {
  position: absolute;
  top: 24px; left: 48px; right: 48px;
  display: flex; justify-content: space-between;
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(244, 241, 234, 0.45);
  z-index: 3;
}
.hero-canvas-meta em {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 13px;
  color: var(--gold-lt);
  text-transform: none;
  letter-spacing: 0;
}
.hero-canvas-footer {
  position: absolute;
  bottom: 24px; left: 48px; right: 48px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
  z-index: 3;
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(244, 241, 234, 0.55);
}
.hero-canvas-footer .cf-val {
  display: block;
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 18px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--gold-lt);
  margin-bottom: 4px;
  font-weight: 400;
}

/* ── TICKER ── */
.ticker {
  background: var(--navy-950);
  border-top: 1px solid var(--rule-dark);
  padding: 20px 0;
  overflow: hidden;
  color: var(--ivory);
}
.ticker-inner {
  display: flex; align-items: center;
  font-family: var(--ff-mono);
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.6);
  white-space: nowrap;
  animation: ticker-scroll 40s linear infinite;
}
.ticker-item { padding: 0 40px; display: inline-flex; align-items: center; gap: 14px; }
.ticker-item em {
  font-family: var(--ff-head); font-style: italic;
  color: var(--gold-lt); text-transform: none; letter-spacing: 0;
  font-size: 14px;
}
.ticker-dot { width: 3px; height: 3px; background: var(--gold); border-radius: 50%; }
@keyframes ticker-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ── DATA BAND ── reports-as-design ── */
.data-band {
  background: var(--navy-950);
  color: var(--ivory);
  padding: 120px 0;
  position: relative;
}
.data-band-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: end;
  margin-bottom: 72px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule-dark);
}
.data-band-head .eyebrow { color: rgba(244,241,234,0.55); }
.data-band-head .eyebrow::before { background: var(--gold); }
.data-band-head .eyebrow .no { color: var(--gold-lt); }
.data-band h2 { color: var(--ivory); margin: 0; max-width: 760px; }
.data-band h2 em { color: var(--gold-lt); }
.data-band-fig {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.4);
  text-align: right;
}
.data-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule-dark-strong);
  border-bottom: 1px solid var(--rule-dark-strong);
}
.data-cell {
  padding: 56px 40px 48px;
  border-right: 1px solid var(--rule-dark);
  position: relative;
}
.data-cell:last-child { border-right: none; }
.data-cell-tag {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 28px;
  display: flex;
  justify-content: space-between;
}
.data-cell-num {
  font-family: var(--ff-head);
  font-size: clamp(80px, 10vw, 160px);
  font-weight: 400;
  color: var(--ivory);
  line-height: 0.88;
  letter-spacing: -0.05em;
  margin-bottom: 32px;
  font-variation-settings: "opsz" 144, "SOFT" 30;
}
.data-cell-num sup {
  font-size: 0.42em;
  vertical-align: super;
  color: var(--gold-lt);
  font-style: italic;
  font-weight: 400;
  margin-left: 4px;
}
.data-cell-desc {
  font-size: 15px;
  color: rgba(244,241,234,0.75);
  line-height: 1.55;
  margin-bottom: 24px;
  max-width: 280px;
}
.data-cell-src {
  font-family: var(--ff-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.4);
  padding-top: 16px;
  border-top: 1px solid var(--rule-dark);
}
.data-cell-delta {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 14px;
  color: var(--gold-lt);
}

/* ── WHAT WE DO — report-style pillars ── */
.practice { background: var(--ivory); padding: var(--section-y) 0; }
.practice-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: start;
  margin-bottom: 80px;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--rule-strong);
}
.practice-head h2 { max-width: 560px; }
.practice-head-aside {
  padding-top: 24px;
}
.practice-head-aside .lead {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 22px;
  line-height: 1.35;
  color: var(--navy-800);
  font-weight: 400;
}

.pillar {
  display: grid;
  grid-template-columns: 200px 1.2fr 1fr;
  gap: 64px;
  padding: 80px 0;
  border-bottom: 1px solid var(--rule);
  text-decoration: none;
  color: inherit;
  transition: background 0.3s ease;
  position: relative;
}
.pillar:last-of-type { border-bottom: 1px solid var(--rule-strong); }
.pillar:hover { background: var(--paper); }
.pillar-num-col {
  display: flex; flex-direction: column; gap: 16px;
  padding-top: 8px;
}
.pillar-chap {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--text-mute);
}
.pillar-big-num {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 128px;
  font-weight: 400;
  color: var(--navy-950);
  line-height: 0.85;
  letter-spacing: -0.04em;
}
.pillar[data-p="01"] .pillar-big-num { color: var(--gold); }
.pillar[data-p="02"] .pillar-big-num { color: var(--navy-800); }
.pillar-kicker {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-top: 8px;
}
.pillar-title {
  font-family: var(--ff-head);
  font-size: clamp(28px, 2.8vw, 44px);
  font-weight: 400;
  color: var(--navy-950);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: 28px;
  max-width: 540px;
}
.pillar-title em { font-style: italic; color: var(--gold); font-weight: 400; }
.pillar-body {
  font-size: 16px;
  color: var(--text-body);
  line-height: 1.65;
  margin-bottom: 32px;
  max-width: 500px;
}
.pillar-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; }
.pillar-tag {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 6px 12px;
  border: 1px solid var(--rule-strong);
  color: var(--text-body);
}
.pillar-link {
  font-family: var(--ff-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--navy-950);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--navy-950);
  padding-bottom: 3px;
  text-decoration: none;
}
.pillar-side-col { padding-top: 12px; }
.pillar-side-label {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--rule);
}
.pillar-side-inline {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-body);
}

/* Bridge */
.bridge {
  margin: 32px auto;
  max-width: 900px;
  padding: 56px 64px;
  background: var(--navy-950);
  color: var(--ivory);
  position: relative;
}
.bridge::before {
  content: '§';
  position: absolute;
  top: 32px; left: 32px;
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 32px;
  color: var(--gold);
}
.bridge h2 {
  font-size: clamp(24px, 2.4vw, 36px);
  color: var(--ivory);
  margin-bottom: 18px;
  padding-left: 48px;
}
.bridge h2 em { color: var(--gold-lt); }
.bridge p {
  font-size: 16px;
  color: rgba(244,241,234,0.72);
  line-height: 1.7;
  padding-left: 48px;
  max-width: 700px;
}

.audit-inline {
  text-align: center;
  padding: 80px 0 0;
  border-top: 1px solid var(--rule);
  margin-top: 64px;
}
.audit-inline p {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 22px;
  color: var(--navy-800);
  max-width: 600px;
  margin: 0 auto 28px;
  line-height: 1.4;
}

/* ── TWO PROBLEMS QUIET BAND ── */
.two-problems {
  background: var(--paper);
  padding: 100px 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.two-problems-inner {
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 0 48px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 96px;
  align-items: start;
}
.two-problems h2 { margin: 0; }
.two-problems-body p {
  font-size: 16px;
  color: var(--text-body);
  line-height: 1.75;
  margin-bottom: 20px;
}

/* ── PROCESS ── */
.process {
  background: var(--ivory);
  padding: var(--section-y) 0;
}
.process-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 72px;
  align-items: end;
  margin-bottom: 80px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule-strong);
}
.process-head .lead { font-family: var(--ff-head); font-style: italic; max-width: 420px; color: var(--navy-800); font-size: 20px; line-height: 1.4; }
.process-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
}
.p-step {
  padding: 56px 40px 40px 0;
  border-right: 1px solid var(--rule);
  position: relative;
}
.p-step:last-child { border-right: none; padding-right: 0; }
.p-step:not(:first-child) { padding-left: 40px; }
.p-step-marker {
  display: flex;
  align-items: baseline;
  gap: 20px;
  margin-bottom: 32px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--rule);
}
.p-step-n {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 64px;
  font-weight: 400;
  color: var(--gold);
  line-height: 0.9;
  letter-spacing: -0.03em;
}
.p-step-k {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-mute);
}
.p-step-title {
  font-family: var(--ff-head);
  font-size: 28px;
  font-weight: 500;
  color: var(--navy-950);
  margin-bottom: 14px;
  letter-spacing: -0.01em;
}
.p-step-body {
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.65;
  margin-bottom: 24px;
}
.p-step-meta {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-mute);
  padding-top: 20px;
  border-top: 1px solid var(--rule);
}
.process-cta { text-align: center; margin-top: 72px; }

/* ── CORNERSTONE — navy essay ── */
.cornerstone {
  background: var(--navy-950);
  color: var(--ivory);
  padding: var(--section-y) 0;
  position: relative;
}
.cornerstone::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 15% 0%, rgba(201,168,76,0.08) 0%, transparent 55%);
  pointer-events: none;
}
.cornerstone-head {
  position: relative;
  max-width: 1100px;
  margin-bottom: 80px;
}
.cornerstone .eyebrow { color: var(--gold); }
.cornerstone .eyebrow::before { background: var(--gold); }
.cornerstone h2 { color: var(--ivory); max-width: 1000px; font-size: clamp(36px, 4.8vw, 72px); }
.cornerstone h2 em { color: var(--gold-lt); }
.cornerstone-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 96px;
  position: relative;
}
.cornerstone-body p {
  font-size: 17px;
  color: rgba(244,241,234,0.82);
  line-height: 1.75;
  margin-bottom: 24px;
  max-width: 580px;
}
.cornerstone-body p:first-of-type {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 22px;
  line-height: 1.5;
  color: var(--ivory);
}
.cs-quote {
  font-family: var(--ff-head);
  font-size: 28px;
  font-style: italic;
  line-height: 1.35;
  color: var(--ivory);
  margin-bottom: 40px;
  position: relative;
  padding: 32px 0;
  border-top: 1px solid var(--gold);
  border-bottom: 1px solid var(--rule-dark);
}
.cs-quote::before {
  content: '"';
  font-family: var(--ff-head);
  font-size: 120px;
  color: var(--gold);
  opacity: 0.2;
  position: absolute;
  top: -20px; left: -10px;
  line-height: 1;
}
.cs-attr {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.5);
  margin-top: 16px;
}
.cs-industries-label {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}
.cs-industries {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1px solid var(--rule-dark);
}
.cs-industries span {
  padding: 14px 0;
  border-bottom: 1px solid var(--rule-dark);
  font-size: 14px;
  color: rgba(244,241,234,0.8);
  display: flex;
  align-items: center;
  gap: 12px;
}
.cs-industries span::before {
  content: '';
  width: 6px; height: 6px;
  background: var(--gold);
  flex-shrink: 0;
}

/* ── FOUNDERS ── */
.founders { background: var(--ivory); padding: var(--section-y) 0; }
.founders-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 72px;
  align-items: end;
  margin-bottom: 72px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule-strong);
}
.founders-head-aside {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 20px;
  color: var(--navy-800);
  max-width: 380px;
  line-height: 1.4;
}
.founder-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1px solid var(--rule);
}
.founder {
  padding: 56px 40px 40px 0;
  border-right: 1px solid var(--rule);
}
.founder:last-child { border-right: none; padding-right: 0; padding-left: 40px; }
.founder-head {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--rule);
}
.founder-photo {
  width: 96px; height: 96px;
  border-radius: 50%;
  filter: grayscale(100%);
  border: 1px solid var(--rule-strong);
  object-fit: cover;
}
.founder-meta-kicker {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-bottom: 8px;
}
.founder-name {
  font-family: var(--ff-head);
  font-size: 32px;
  color: var(--navy-950);
  font-weight: 500;
  line-height: 1.05;
  margin-bottom: 6px;
  letter-spacing: -0.01em;
}
.founder-role {
  font-size: 14px;
  color: var(--text-body);
  font-style: italic;
  font-family: var(--ff-head);
}
.founder-bio {
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.7;
  margin-bottom: 24px;
}
.founder-lead {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 17px;
  color: var(--navy-800);
  line-height: 1.5;
  padding-top: 24px;
  border-top: 1px solid var(--rule);
}
.founders-closing {
  margin-top: 64px;
  padding-top: 40px;
  border-top: 1px solid var(--rule-strong);
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 24px;
  color: var(--navy-800);
  line-height: 1.4;
  max-width: 900px;
}

/* ── WHY NOW ── */
.why-now {
  background: var(--paper);
  padding: var(--section-y) 0;
}
.why-now-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 72px;
  align-items: end;
  margin-bottom: 72px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule-strong);
}
.why-now-head .lead {
  font-family: var(--ff-head);
  font-style: italic;
  color: var(--navy-800);
  max-width: 440px;
  font-size: 20px;
  line-height: 1.4;
}
.problem-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1px solid var(--rule);
}
.problem {
  padding: 32px 40px 32px 0;
  border-right: 1px solid var(--rule);
}
.problem:last-child { border-right: none; padding-left: 40px; padding-right: 0; }
.problem-kicker {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 24px;
}
.problem-title {
  font-family: var(--ff-head);
  font-size: clamp(24px, 2.4vw, 34px);
  color: var(--navy-950);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin-bottom: 28px;
  max-width: 480px;
}
.problem-body {
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.7;
}
.problem-body strong {
  color: var(--navy-950);
  font-weight: 600;
}

/* Window track — redesigned like a chart */
.window-track {
  margin-top: 72px;
  padding: 48px;
  background: var(--navy-950);
  color: var(--ivory);
}
.wt-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--rule-dark);
  margin-bottom: 48px;
}
.wt-title {
  font-family: var(--ff-head);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ivory);
}
.wt-note {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.45);
}
.wt-bar {
  position: relative;
  height: 2px;
  background: rgba(244,241,234,0.15);
  margin: 64px 0 24px;
}
.wt-fill {
  height: 100%;
  background: var(--gold);
  width: 33%;
}
.wt-needle {
  position: absolute;
  top: -8px;
  left: 33%;
  width: 1px; height: 18px;
  background: var(--gold);
}
.wt-needle::after {
  content: '';
  position: absolute;
  top: -4px; left: -3px;
  width: 7px; height: 7px;
  background: var(--gold);
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(201,168,76,0.2);
}
.wt-needle-label {
  position: absolute;
  top: -44px;
  left: -30px;
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-lt);
  white-space: nowrap;
}
.wt-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 20px;
}
.wt-step {
  font-family: var(--ff-mono);
  font-size: 11px;
  color: rgba(244,241,234,0.6);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.wt-step em {
  display: block;
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 13px;
  color: var(--ivory);
  text-transform: none;
  letter-spacing: 0;
  margin-bottom: 4px;
}

/* ── APPLICATIONS ── */
.applications {
  background: var(--ivory);
  padding: var(--section-y) 0;
}
.app-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 72px;
  align-items: end;
  margin-bottom: 72px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule-strong);
}
.app-head .lead {
  font-family: var(--ff-head);
  font-style: italic;
  color: var(--navy-800);
  max-width: 440px;
  font-size: 20px;
  line-height: 1.4;
}
.app-list { border-top: 1px solid var(--rule); }
.app {
  display: grid;
  grid-template-columns: 200px 1.4fr 1fr;
  gap: 64px;
  padding: 56px 0;
  border-bottom: 1px solid var(--rule);
  align-items: start;
  transition: background 0.3s;
}
.app:last-child { border-bottom: 1px solid var(--rule-strong); }
.app:hover { background: var(--paper); }
.app-n {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 72px;
  font-weight: 400;
  line-height: 0.9;
  letter-spacing: -0.04em;
}
.app[data-a="forest"] .app-n { color: var(--teal); }
.app[data-a="navy"] .app-n { color: var(--navy-950); }
.app[data-a="gold"] .app-n { color: var(--gold); }
.app-n-label {
  display: block;
  font-family: var(--ff-mono);
  font-style: normal;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-top: 16px;
}
.app-title {
  font-family: var(--ff-head);
  font-size: clamp(22px, 2.2vw, 32px);
  color: var(--navy-950);
  font-weight: 400;
  letter-spacing: -0.015em;
  line-height: 1.2;
  margin-bottom: 20px;
}
.app-body {
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.7;
  max-width: 620px;
}
.app-meta {
  padding-top: 8px;
}
.app-meta-label {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-bottom: 12px;
}
.app-meta-val {
  font-family: var(--ff-head);
  font-size: 18px;
  font-style: italic;
  color: var(--navy-800);
  margin-bottom: 8px;
}
.app-meta-dur {
  font-family: var(--ff-mono);
  font-size: 12px;
  color: var(--text-body);
  letter-spacing: 0.06em;
}

/* ── FAQ ── */
.faq {
  background: var(--paper);
  padding: var(--section-y) 0;
}
.faq-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: start;
  margin-bottom: 64px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--rule-strong);
}
.faq-head .lead {
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 20px;
  color: var(--navy-800);
  line-height: 1.4;
  max-width: 420px;
}
.faq-list {}
.faq-item {
  padding: 36px 0;
  border-bottom: 1px solid var(--rule);
  display: grid;
  grid-template-columns: 64px 1fr 200px;
  gap: 32px;
  align-items: start;
}
.faq-item:first-child { border-top: 1px solid var(--rule); }
.faq-n {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  color: var(--gold);
  padding-top: 4px;
}
.faq-q {
  font-family: var(--ff-head);
  font-size: 24px;
  font-weight: 500;
  color: var(--navy-950);
  margin-bottom: 16px;
  line-height: 1.25;
  letter-spacing: -0.015em;
  max-width: 640px;
}
.faq-a {
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.7;
  max-width: 640px;
}
.faq-topic {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-mute);
  text-align: right;
  padding-top: 4px;
}
.faq-t2 { margin-top: 80px; max-width: 900px; }
.faq-t2-label {
  font-family: var(--ff-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-mute);
  margin-bottom: 28px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--rule-strong);
}
.faq-item-sm {
  padding: 24px 0;
  border-bottom: 1px solid var(--rule);
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 48px;
  align-items: start;
}
.faq-q-sm {
  font-family: var(--ff-head);
  font-size: 18px;
  font-weight: 500;
  color: var(--navy-950);
  line-height: 1.3;
  letter-spacing: -0.01em;
}
.faq-a-sm {
  font-size: 14px;
  color: var(--text-body);
  line-height: 1.65;
}

/* ── CTA BAND ── */
.cta-band {
  background: var(--navy-950);
  color: var(--ivory);
  padding: 140px 0;
  position: relative;
  overflow: hidden;
}
.cta-band::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(201,168,76,0.12) 0%, transparent 55%),
    radial-gradient(ellipse at 0% 100%, rgba(31,138,128,0.06) 0%, transparent 55%);
  pointer-events: none;
}
.cta-inner {
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 0 48px;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 96px;
  align-items: center;
  position: relative;
}
.cta-band .eyebrow { color: var(--gold); }
.cta-band .eyebrow::before { background: var(--gold); }
.cta-band h2 {
  color: var(--ivory);
  margin-bottom: 32px;
  font-size: clamp(40px, 4.8vw, 72px);
}
.cta-band h2 em { color: var(--gold-lt); }
.cta-band p {
  font-size: 17px;
  color: rgba(244,241,234,0.75);
  line-height: 1.65;
  max-width: 580px;
}
.cta-actions { display: flex; flex-direction: column; gap: 12px; }
.cta-btn-1 {
  background: var(--gold);
  color: var(--navy-950);
  padding: 20px 28px;
  text-align: center;
  text-decoration: none;
  font-family: var(--ff-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: background .2s;
}
.cta-btn-1:hover { background: var(--gold-lt); }
.cta-btn-2 {
  border: 1px solid rgba(244,241,234,0.3);
  color: var(--ivory);
  padding: 19px 28px;
  text-align: center;
  text-decoration: none;
  font-family: var(--ff-body);
  font-size: 14px;
  font-weight: 500;
  transition: all .2s;
}
.cta-btn-2:hover { border-color: var(--gold); color: var(--gold-lt); }
.cta-phone {
  font-family: var(--ff-mono);
  font-size: 12px;
  color: rgba(244,241,234,0.5);
  text-align: center;
  margin-top: 12px;
  letter-spacing: 0.06em;
}
.cta-phone a { color: var(--ivory); text-decoration: none; }
.cta-phone a:hover { color: var(--gold-lt); }

/* ── FOOTER ── */
footer {
  background: var(--navy-950);
  color: rgba(244,241,234,0.55);
  padding: 80px 0 32px;
  border-top: 1px solid var(--rule-dark);
}
.footer-masthead {
  max-width: var(--container-w);
  margin: 0 auto 72px;
  padding: 0 48px 48px;
  border-bottom: 1px solid var(--rule-dark);
}
.footer-logo {
  height: 72px;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
  opacity: 0.95;
}
.footer-tag {
  margin-top: 24px;
  font-family: var(--ff-head);
  font-style: italic;
  font-size: 22px;
  color: rgba(244,241,234,0.65);
  max-width: 640px;
  line-height: 1.4;
}
.footer-inner {
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 0 48px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 64px;
  margin-bottom: 48px;
}
.footer-block-head {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 24px;
}
.footer-loc {
  font-family: var(--ff-mono);
  font-size: 12px;
  color: rgba(244,241,234,0.55);
  letter-spacing: 0.06em;
  line-height: 1.6;
}
.footer-col a {
  display: block;
  font-size: 14px;
  color: rgba(244,241,234,0.55);
  text-decoration: none;
  margin-bottom: 12px;
  transition: color .2s;
}
.footer-col a:hover { color: var(--gold-lt); }
.footer-bottom {
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 24px 48px 0;
  border-top: 1px solid var(--rule-dark);
  display: flex;
  justify-content: space-between;
  font-family: var(--ff-mono);
  font-size: 11px;
  color: rgba(244,241,234,0.4);
  letter-spacing: 0.06em;
}
.footer-bottom a { color: rgba(244,241,234,0.55); text-decoration: none; }

/* ── TWEAKS ── */
#tweaks-panel {
  position: fixed; right: 20px; bottom: 20px;
  width: 300px;
  background: var(--ivory);
  border: 1px solid var(--rule-strong);
  box-shadow: 0 20px 60px rgba(8,20,35,0.25);
  z-index: 9999;
  display: none;
}
#tweaks-panel.open { display: block; }
.tweaks-h {
  background: var(--navy-950);
  color: var(--ivory);
  padding: 14px 18px;
  display: flex; justify-content: space-between; align-items: center;
}
.tweaks-h h4 {
  font-family: var(--ff-head); font-style: italic;
  color: var(--ivory); font-size: 16px; margin: 0;
}
.tweaks-close {
  background: none; border: none; color: var(--ivory);
  font-size: 18px; cursor: pointer;
}
.tweaks-b { padding: 16px; }
.tweak-r { margin-bottom: 16px; }
.tweak-r:last-child { margin-bottom: 0; }
.tweak-l {
  font-family: var(--ff-mono); font-size: 10px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--text-mute); margin-bottom: 8px; display: block;
}
.tweak-c { display: flex; gap: 6px; flex-wrap: wrap; }
.tweak-chip {
  padding: 7px 12px; font-size: 12px; font-weight: 500;
  border: 1px solid var(--rule-strong);
  background: var(--paper);
  color: var(--text-body);
  cursor: pointer; transition: all .15s;
}
.tweak-chip:hover { border-color: var(--navy-950); }
.tweak-chip.active {
  background: var(--navy-950); color: var(--ivory);
  border-color: var(--navy-950);
}

/* Tweak: accent teal instead of gold */
body[data-accent="teal"] h1 em,
body[data-accent="teal"] h2 em,
body[data-accent="teal"] .pillar-title em,
body[data-accent="teal"] .bridge h2 em,
body[data-accent="teal"] .data-band h2 em,
body[data-accent="teal"] .cornerstone h2 em,
body[data-accent="teal"] .cta-band h2 em { color: var(--teal); }
body[data-accent="teal"] .pillar[data-p="01"] .pillar-big-num,
body[data-accent="teal"] .app[data-a="gold"] .app-n,
body[data-accent="teal"] .p-step-n { color: var(--teal); }
body[data-accent="teal"] .btn-gold,
body[data-accent="teal"] .cta-btn-1 { background: var(--teal); color: var(--ivory); }
body[data-accent="teal"] .hero-canvas-meta em { color: var(--teal); }
body[data-accent="teal"] .hero-canvas-footer .cf-val { color: var(--teal); }

/* Tweak: surface bias — cream-heavy reduces obsidian bands */
body[data-surface="cream"] .data-band { background: var(--navy-900); }
body[data-surface="navy"] { background: var(--navy-950); color: var(--ivory); }
body[data-surface="navy"] .practice,
body[data-surface="navy"] .founders,
body[data-surface="navy"] .process,
body[data-surface="navy"] .applications { background: var(--navy-900); }
body[data-surface="navy"] .practice h2,
body[data-surface="navy"] .founders h2,
body[data-surface="navy"] .process h2,
body[data-surface="navy"] .applications h2,
body[data-surface="navy"] .pillar-title,
body[data-surface="navy"] .p-step-title,
body[data-surface="navy"] .founder-name,
body[data-surface="navy"] .app-title { color: var(--ivory); }
body[data-surface="navy"] .pillar-big-num { color: var(--gold); }
body[data-surface="navy"] .pillar-body,
body[data-surface="navy"] .p-step-body,
body[data-surface="navy"] .founder-bio,
body[data-surface="navy"] .app-body { color: rgba(244,241,234,0.75); }
body[data-surface="navy"] nav { background: rgba(8,20,35,0.85); border-bottom-color: var(--rule-dark); }
body[data-surface="navy"] .nav-links a { color: var(--ivory); }
body[data-surface="navy"] .logo-img { filter: brightness(0) invert(1); }
body[data-surface="navy"] .nav-phone { color: rgba(244,241,234,0.65); }
body[data-surface="navy"] .hero { background: var(--navy-950); }
body[data-surface="navy"] .hero h1,
body[data-surface="navy"] .hero-sub { color: var(--ivory); }
body[data-surface="navy"] .two-problems { background: var(--navy-900); border-color: var(--rule-dark); }
body[data-surface="navy"] .two-problems h2 { color: var(--ivory); }
body[data-surface="navy"] .two-problems-body p { color: rgba(244,241,234,0.75); }
body[data-surface="navy"] .why-now,
body[data-surface="navy"] .faq { background: var(--navy-900); }
body[data-surface="navy"] .problem-title, body[data-surface="navy"] .faq-q { color: var(--ivory); }
body[data-surface="navy"] .problem-body, body[data-surface="navy"] .faq-a { color: rgba(244,241,234,0.75); }

/* ── FOR INVESTORS — LP tearsheet ── */
.investors {
  background: var(--navy-950);
  color: var(--ivory);
  padding: var(--section-y) 0;
  border-top: 1px solid var(--rule-dark);
}
.inv-grid {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 72px;
  align-items: start;
}
.inv-rail {
  border-right: 1px solid var(--rule-dark);
  padding-right: 40px;
  position: sticky;
  top: 100px;
}
.inv-rail-label {
  font-family: var(--ff-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.45);
  margin: 18px 0 28px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rule-dark);
}
.inv-facts { display: block; }
.inv-facts > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 11px 0;
  border-bottom: 1px solid var(--rule-dark);
}
.inv-facts dt {
  font-family: var(--ff-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.5);
}
.inv-facts dd {
  font-family: var(--ff-mono);
  font-size: 13px;
  color: var(--gold-lt);
  text-align: right;
}
.inv-rail-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 28px;
  font-family: var(--ff-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--ivory);
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 4px;
  transition: color .2s;
}
.inv-rail-cta:hover { color: var(--gold-lt); }

.inv-main h2 {
  color: var(--ivory);
  max-width: 700px;
  margin-top: 24px;
}
.inv-main h2 em { color: var(--gold-lt); }
.inv-thesis {
  font-family: var(--ff-body);
  font-size: 16px;
  line-height: 1.65;
  color: rgba(244,241,234,0.78);
  max-width: 680px;
  margin-bottom: 40px;
}
.inv-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule-dark-strong);
  border-bottom: 1px solid var(--rule-dark-strong);
  margin-bottom: 40px;
}
.inv-metric {
  padding: 24px 24px 24px 0;
  border-right: 1px solid var(--rule-dark);
}
.inv-metric:last-child { border-right: none; }
.inv-metric:not(:first-child) { padding-left: 24px; }
.inv-metric-n {
  font-family: var(--ff-head);
  font-size: clamp(26px, 2.4vw, 36px);
  font-weight: 400;
  color: var(--gold);
  letter-spacing: -0.01em;
  line-height: 1;
}
.inv-metric-n sup {
  font-size: 0.4em;
  vertical-align: super;
  color: rgba(244,241,234,0.5);
}
.inv-metric-l {
  font-family: var(--ff-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(244,241,234,0.5);
  margin-top: 12px;
}
.inv-points {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 48px;
}
.inv-point {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 14px;
  padding: 18px 0;
  border-top: 1px solid var(--rule-dark);
  font-family: var(--ff-body);
  font-size: 14.5px;
  line-height: 1.55;
  color: rgba(244,241,234,0.78);
}
.inv-point-n {
  font-family: var(--ff-mono);
  font-size: 12px;
  color: var(--gold);
  letter-spacing: 0.12em;
  padding-top: 2px;
}
.inv-point strong { color: var(--ivory); font-weight: 600; }
.inv-foot {
  margin-top: 32px;
  font-family: var(--ff-mono);
  font-size: 11px;
  line-height: 1.6;
  color: rgba(244,241,234,0.4);
  max-width: 720px;
}
.inv-foot sup { color: var(--gold); }
body[data-accent="teal"] .inv-metric-n,
body[data-accent="teal"] .inv-facts dd,
body[data-accent="teal"] .inv-point-n,
body[data-accent="teal"] .inv-main h2 em { color: var(--teal); }
body[data-accent="teal"] .inv-rail-cta { border-bottom-color: var(--teal); }

/* Density */
body[data-density="tight"] { --section-y: 48px; }
body[data-density="airy"] { --section-y: 96px; }

/* ── NEW COMPACT STRUCTURE ── */
/* Section 1: data + solutions side-by-side */
.sig { background: var(--ivory); padding: var(--section-y) 0; border-bottom: 1px solid var(--rule); }
.sig-grid { display: grid; grid-template-columns: 280px 1fr; gap: 64px; align-items: start; }
.sig-data { border-right: 1px solid var(--rule); padding-right: 40px; position: sticky; top: 100px; }
.sig-data .eyebrow { margin-bottom: 24px; }
.sig-stat { padding: 20px 0; border-bottom: 1px solid var(--rule); }
.sig-stat:last-child { border-bottom: none; }
.sig-num { font-family: var(--ff-head); font-size: 56px; font-weight: 400; line-height: 1; color: var(--navy-950); letter-spacing: -0.02em; }
.sig-num sup { font-size: 28px; vertical-align: super; color: var(--gold); margin-left: 2px; }
.sig-desc { font-family: var(--ff-body); font-size: 14px; color: var(--text-body); line-height: 1.4; margin-top: 8px; }
.sig-src { font-family: var(--ff-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-mute); margin-top: 6px; }

.sig-main h2 { margin-top: 4px; }
.sig-lead { margin-top: 12px; margin-bottom: 32px; max-width: 520px; }
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 28px; }
.duo-card {
  display: block; padding: 28px 28px 32px;
  background: var(--paper);
  border: 1px solid var(--rule); text-decoration: none;
  transition: border-color .2s, background .2s;
}
.duo-card:hover { border-color: var(--navy-950); background: var(--ivory); }
.duo-num { font-family: var(--ff-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--gold); }
.duo-kicker { font-family: var(--ff-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-mute); margin-top: 4px; }
.duo-title { font-family: var(--ff-head); font-size: 24px; font-weight: 400; line-height: 1.2; color: var(--navy-950); margin: 14px 0 10px; letter-spacing: -0.01em; }
.duo-title em { font-style: italic; color: var(--gold); }
.duo-body { font-family: var(--ff-body); font-size: 14.5px; color: var(--text-body); line-height: 1.5; }
.sig-cta {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 22px;
  background: var(--navy-950); color: var(--ivory);
  font-family: var(--ff-body); font-size: 13px; font-weight: 500;
  letter-spacing: 0.02em; text-decoration: none;
  transition: background .2s;
}
.sig-cta:hover { background: var(--gold); color: var(--navy-950); }

/* Section 2: How + Why Now */
.howwhy { padding: 0; }
.howwhy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.howwhy-col { padding: var(--section-y) 48px; }
.howwhy-col:first-child { background: var(--paper); border-right: 1px solid var(--rule); }
.howwhy-col-dark { background: var(--navy-950); color: var(--ivory); }
.howwhy-col h2 { margin-top: 6px; margin-bottom: 28px; max-width: 420px; }
.howwhy-col-dark h2 { color: var(--ivory); }
.eyebrow-light { color: var(--gold); }
.phase-list { list-style: none; padding: 0; margin: 0; }
.phase-list li {
  display: grid; grid-template-columns: 48px 1fr; gap: 16px;
  padding: 18px 0; border-top: 1px solid var(--rule);
  font-family: var(--ff-body); font-size: 15px; line-height: 1.5; color: var(--text-body);
}
.phase-list li:last-child { border-bottom: 1px solid var(--rule); }
.phase-n { font-family: var(--ff-mono); font-size: 14px; color: var(--gold); letter-spacing: 0.1em; }
.phase-list strong { font-weight: 600; color: var(--navy-950); }

.trap {
  padding: 18px 0;
  border-top: 1px solid var(--rule-dark);
  font-family: var(--ff-body); font-size: 15px; line-height: 1.5;
  color: rgba(244,241,234,0.82);
}
.trap:last-of-type { border-bottom: 1px solid var(--rule-dark); }
.trap-k {
  display: block;
  font-family: var(--ff-mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 6px;
}
.trap strong { color: var(--ivory); font-weight: 600; }

.window-track-mini { margin-top: 28px; }
.wtm-bar {
  position: relative; height: 4px; background: rgba(244,241,234,0.12);
  overflow: visible;
}
.wtm-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 40%; background: var(--gold); }
.wtm-needle {
  position: absolute; left: 40%; top: -6px; width: 2px; height: 16px; background: var(--ivory);
}
.wtm-steps {
  display: grid; grid-template-columns: repeat(4, 1fr);
  margin-top: 14px;
  font-family: var(--ff-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(244,241,234,0.5);
}
.wtm-now { color: var(--gold); font-weight: 600; }

/* Section 3: About combined */
.about { background: var(--ivory); padding: var(--section-y) 0; border-top: 1px solid var(--rule); }
.about-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: start; }
.about-founders h2 { margin-top: 6px; margin-bottom: 24px; max-width: 480px; }
.founder-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 24px; }
.founder-mini { display: flex; align-items: center; gap: 14px; }
.founder-photo-sm { width: 56px; height: 56px; border-radius: 50%; filter: grayscale(100%); border: 1px solid var(--rule-strong); object-fit: cover; }
.founder-name-sm { font-family: var(--ff-head); font-size: 18px; color: var(--navy-950); }
.founder-role-sm { font-family: var(--ff-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-mute); margin-top: 2px; }
.about-blurb {
  font-family: var(--ff-head); font-size: 18px; font-style: italic; color: var(--navy-800);
  line-height: 1.45; padding: 18px 0;
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  margin-bottom: 18px;
}
.cs-industries-inline {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.cs-industries-inline span {
  font-family: var(--ff-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 6px 10px; border: 1px solid var(--rule); color: var(--text-body);
}

.about-apps { border-left: 1px solid var(--rule); padding-left: 48px; }
.about-apps .eyebrow { margin-bottom: 20px; }
.app-mini {
  display: grid; grid-template-columns: 32px 1fr; gap: 14px;
  padding: 16px 0; border-top: 1px solid var(--rule);
  font-family: var(--ff-body); font-size: 14.5px; line-height: 1.5; color: var(--text-body);
}
.app-mini:last-child { border-bottom: 1px solid var(--rule); }
.app-mini-n { font-family: var(--ff-mono); font-size: 12px; color: var(--gold); letter-spacing: 0.14em; padding-top: 2px; }
.app-mini strong { font-weight: 600; color: var(--navy-950); }

/* FAQ compact 2-col */
.faq-compact {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px;
  border-top: 1px solid var(--rule);
}
.faq-mini { padding: 18px 0; border-bottom: 1px solid var(--rule); }
.faq-q-mini { font-family: var(--ff-head); font-size: 17px; color: var(--navy-950); margin-bottom: 6px; }
.faq-a-mini { font-family: var(--ff-body); font-size: 14px; color: var(--text-body); line-height: 1.5; }

/* surface: navy-dominant recolor */
body[data-surface="navy"] .sig,
body[data-surface="navy"] .about { background: var(--navy-900); color: var(--ivory); }
body[data-surface="navy"] .sig-num,
body[data-surface="navy"] .duo-title,
body[data-surface="navy"] .founder-name-sm,
body[data-surface="navy"] .faq-q-mini,
body[data-surface="navy"] .about-blurb,
body[data-surface="navy"] .app-mini strong,
body[data-surface="navy"] .phase-list strong { color: var(--ivory); }
body[data-surface="navy"] .duo-card { background: var(--navy-800); border-color: var(--rule-dark); }
body[data-surface="navy"] .duo-card:hover { background: var(--navy-900); border-color: var(--gold); }
body[data-surface="navy"] .duo-body,
body[data-surface="navy"] .sig-desc,
body[data-surface="navy"] .app-mini,
body[data-surface="navy"] .faq-a-mini,
body[data-surface="navy"] .phase-list li { color: rgba(244,241,234,0.78); }

@media (max-width: 960px) {
  :root { --section-y: 48px; }
  .sig-grid, .howwhy-grid, .about-grid, .faq-compact { grid-template-columns: 1fr; gap: 32px; }
  .inv-grid { grid-template-columns: 1fr; gap: 32px; }
  .inv-rail { border-right: none; border-bottom: 1px solid var(--rule-dark); padding-right: 0; padding-bottom: 24px; position: static; }
  .inv-metrics { grid-template-columns: 1fr 1fr; }
  .inv-metric { border-bottom: 1px solid var(--rule-dark); padding: 20px 16px 20px 0; }
  .inv-points { grid-template-columns: 1fr; }
  .sig-data { border-right: none; border-bottom: 1px solid var(--rule); padding-right: 0; padding-bottom: 24px; position: static; }
  .howwhy-col { padding: 48px 24px; }
  .howwhy-col:first-child { border-right: none; border-bottom: 1px solid var(--rule); }
  .about-apps { border-left: none; padding-left: 0; border-top: 1px solid var(--rule); padding-top: 32px; }
  .duo, .founder-duo { grid-template-columns: 1fr; }
  .container, .two-problems-inner, .hero-inner, .cta-inner, .footer-inner, .footer-masthead, .footer-bottom { padding-left: 24px; padding-right: 24px; }
  nav { padding: 0 24px; }
  .nav-links, .nav-phone { display: none; }
  .nav-toggle { display: block; margin-left: auto; }
  .hero-grid, .practice-head, .process-head, .founders-head, .why-now-head, .app-head, .faq-head, .two-problems-inner, .data-band-head, .cornerstone-grid, .cta-inner { grid-template-columns: 1fr; gap: 32px; }
  .hero-headline h1 { font-size: clamp(44px, 10vw, 72px); }
  .hero-canvas { height: 360px; }
  .hero-canvas-footer { grid-template-columns: 1fr; gap: 8px; bottom: 16px; left: 24px; right: 24px; }
  .hero-canvas-meta { left: 24px; right: 24px; }
  .data-grid, .process-grid, .founder-grid, .problem-grid, .cs-industries { grid-template-columns: 1fr; }
  .data-cell, .p-step, .founder, .problem { border-right: none; border-bottom: 1px solid var(--rule); padding: 40px 0; }
  .data-cell { border-right: none; border-bottom: 1px solid var(--rule-dark); }
  .pillar, .app { grid-template-columns: 1fr; gap: 24px; padding: 48px 0; }
  .bridge { padding: 36px 24px; }
  .bridge h2, .bridge p { padding-left: 0; }
  .bridge::before { position: static; margin-bottom: 12px; display: block; }
  .faq-item { grid-template-columns: 1fr; gap: 8px; }
  .faq-topic { text-align: left; }
  .faq-item-sm { grid-template-columns: 1fr; gap: 12px; }
  .footer-inner { grid-template-columns: 1fr 1fr; }
  .footer-bottom { flex-direction: column; gap: 12px; }
  #tweaks-panel { right: 12px; bottom: 12px; width: calc(100% - 24px); max-width: 320px; }
}

/* ═══════════════════════════════════════
   Framed pixel mountain — KEPT from v1 site
   (grafted into the v2 full-width hero band)
   ═══════════════════════════════════════ */
.mountain-visual { position:relative; width:100%; aspect-ratio:5/4;
  background:var(--ivory-2); border:1px solid var(--rule); overflow:hidden; }
.mv-frame { position:absolute; inset:16px; border:1px solid var(--rule); overflow:hidden;
  background:linear-gradient(180deg,#E9E4D6 0%,#DDD7C7 55%,#D3CCBB 100%); }
.mv-sun { position:absolute; width:120px; height:120px; right:14%; top:18%;
  background:radial-gradient(circle, rgba(201,168,76,.55) 0%, rgba(201,168,76,.18) 40%, rgba(201,168,76,0) 72%);
  border-radius:50%; animation:mv-drift 14s ease-in-out infinite alternate; }
@keyframes mv-drift { 0%{transform:translate(0,0);opacity:.7} 100%{transform:translate(-12px,-8px);opacity:.95} }
.mv-mountain { position:absolute; bottom:0; left:0; right:0; }
.mv-m1 { height:62%; fill:#13263D; opacity:.16; }
.mv-m2 { height:52%; fill:#13263D; opacity:.34; }
.mv-m3 { height:42%; fill:#13263D; opacity:.66; }
.mv-m4 { height:32%; fill:#13263D; opacity:1; }
.mv-pixels { position:absolute; top:0; right:0; width:58%; height:72%; display:grid;
  grid-template-columns:repeat(16,1fr); grid-template-rows:repeat(16,1fr); gap:2px; pointer-events:none;
  -webkit-mask-image:linear-gradient(225deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.5) 45%, rgba(0,0,0,0) 75%);
  mask-image:linear-gradient(225deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.5) 45%, rgba(0,0,0,0) 75%); }
.mv-pixels span { background:#13263D; opacity:0; animation:mv-pix 6s ease-in-out infinite; }
@keyframes mv-pix { 0%,100%{opacity:0} 50%{opacity:.5} }
.mv-grid-lines { position:absolute; inset:0;
  background-image:linear-gradient(to right, rgba(15,32,52,.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(15,32,52,.04) 1px, transparent 1px);
  background-size:40px 40px; pointer-events:none; }
.mv-label { position:absolute; bottom:22px; left:24px; right:24px; font-family:var(--ff-body);
  font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:rgba(10,18,32,.55); z-index:2; }
/* Center the framed box within the full-width hero band */
.hero-canvas .mountain-visual { position:absolute; left:50%; top:53%; transform:translate(-50%,-50%);
  width:min(900px,86%); height:70%; aspect-ratio:auto; z-index:1;
  box-shadow:0 34px 90px -34px rgba(0,0,0,.65); }
.hero-canvas-meta, .hero-canvas-footer { z-index:3; }
@media (max-width:640px){ .hero-canvas .mountain-visual { height:62%; width:92%; } }

/* ═══════════════════════════════════════
   ADI — Agentic Discoverability Index
   Shared signature module (gauge + bands + sparkline)
   ═══════════════════════════════════════ */
.adi { background:var(--navy-950); color:var(--ivory); border:1px solid var(--rule-dark-strong);
  border-radius:2px; padding:24px 26px 22px; max-width:380px; font-family:var(--ff-body); }
.adi-head { display:flex; flex-direction:column; gap:2px; margin-bottom:6px; }
.adi-title { font-family:var(--ff-head); font-size:16px; letter-spacing:-0.01em; color:var(--ivory); }
.adi-sub { font-family:var(--ff-mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--navy-300); }
.adi-gauge { position:relative; display:flex; flex-direction:column; align-items:center; margin:6px 0 2px; }
.adi-gauge-svg { width:100%; max-width:260px; height:auto; overflow:visible; }
.adi-track { fill:none; stroke:rgba(255,255,255,0.10); stroke-width:13; stroke-linecap:round; }
.adi-val { fill:none; stroke:var(--gold); stroke-width:13; stroke-linecap:round; }
.adi-val.b-invisible { stroke:#B8632C; }
.adi-val.b-emerging { stroke:var(--gold); }
.adi-val.b-default { stroke:#1F8A80; }
.adi-tip { fill:var(--ivory); stroke:var(--navy-950); stroke-width:2; }
.adi-readout { position:absolute; bottom:2px; left:0; right:0; text-align:center; }
.adi-score { font-family:var(--ff-head); font-size:46px; line-height:1; color:var(--ivory); font-weight:500; }
.adi-score span { font-family:var(--ff-mono); font-size:14px; color:var(--navy-300); margin-left:2px; }
.adi-bandlabel { font-family:var(--ff-mono); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; margin-top:4px; }
.adi-bandlabel.b-invisible { color:#E08A55; }
.adi-bandlabel.b-emerging { color:var(--gold-lt); }
.adi-bandlabel.b-default { color:#5BC2B6; }
.adi-scale { display:flex; justify-content:space-between; gap:6px; margin-top:14px;
  font-family:var(--ff-mono); font-size:9px; letter-spacing:0.04em; text-transform:uppercase; }
.adi-scale span { flex:1; text-align:center; padding:5px 2px; border-top:2px solid; color:var(--navy-300); }
.adi-scale .b-invisible { border-color:#B8632C; }
.adi-scale .b-emerging { border-color:var(--gold); }
.adi-scale .b-default { border-color:#1F8A80; }
.adi-trend { display:flex; align-items:center; gap:12px; margin-top:16px; padding-top:14px; border-top:1px solid var(--rule-dark); }
.adi-trend-label { font-family:var(--ff-mono); font-size:9.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--navy-300); white-space:nowrap; }
.adi-spark-svg { flex:1; height:36px; }
.adi-spark-svg polyline { fill:none; stroke:var(--gold-lt); stroke-width:1.6; vector-effect:non-scaling-stroke; }
.adi-spark-svg circle { fill:var(--gold-lt); }

/* Shared: source-citation slot + data-vs-projection treatments + disclaimer
   (available to all pages; used heavily on Data + Investors) */
.cite { font-family:var(--ff-mono); font-size:10px; letter-spacing:0.04em; color:var(--text-faint); }
.cite sup { color:var(--gold); font-size:9px; }
.is-projection { position:relative; }
.is-projection::after { content:'PROJECTION'; font-family:var(--ff-mono); font-size:8px; letter-spacing:0.12em;
  color:var(--copper); border:1px solid rgba(184,99,44,0.4); padding:1px 4px; border-radius:2px; margin-left:8px; vertical-align:middle; }
.disclaimer { font-family:var(--ff-mono); font-size:10.5px; line-height:1.7; color:var(--text-faint);
  border-top:1px solid var(--rule); padding-top:18px; margin-top:8px; }
.representative-tag { display:inline-block; font-family:var(--ff-mono); font-size:9px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--text-mute); border:1px solid var(--rule-strong); padding:2px 7px; border-radius:2px; }

/* Fix: footer sits on --navy-950; the black wordmark logo was invisible.
   Invert it to white (same technique as the nav logo on navy surfaces). */
.footer-logo { filter: brightness(0) invert(1); }

/* Fix: mobile hamburger now opens the menu (the .nav-links.open rule was missing,
   so toggling the class did nothing against the mobile display:none). */
@media (max-width: 960px) {
  .nav-links.open {
    display: flex; flex-direction: column; align-items: flex-start;
    position: absolute; top: 100%; left: 0; right: 0; margin: 0;
    padding: 18px 24px; gap: 16px; z-index: 300;
    background: var(--ivory); border-bottom: 1px solid var(--rule);
    box-shadow: 0 24px 40px -24px rgba(8,20,35,0.45);
  }
  .nav-links.open a { font-size: 16px; }
}
body[data-surface="navy"] .nav-links.open { background: var(--navy-950); border-bottom-color: var(--rule-dark); }
