/* ════════════════════════════════════════════════════════════════
   CortexaForge Landing — component + section styles (responsive)
   Builds on tokens.css. Ports the editorial prototype to clean,
   fluid CSS (the prototype used fixed-pixel inline styles).
   ════════════════════════════════════════════════════════════════ */

/* ─────────── Layout primitives ─────────── */
.container { max-width:1480px; margin:0 auto; padding-inline:var(--edge); }
.section { padding-block: clamp(48px, 5.5vw, 84px); position:relative; }
.hairline-top { border-top:1px solid rgba(244,239,230,0.08); }

/* ─────────── Eyebrow / section number ─────────── */
.eyebrow {
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--cf-forge-ember); display:inline-flex; align-items:center; gap:10px; margin:0;
}
.eyebrow::before { content:''; width:24px; height:1px; background:currentColor; display:inline-block; }
.eyebrow.no-rule::before { display:none; }
.eyebrow.muted { color:var(--cf-mist); }
.section-num { font-family:var(--font-mono); font-size:12px; letter-spacing:0.18em; color:var(--cf-mist); }
.kicker { font-family:var(--font-mono); font-size:10px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cf-forge-ember); }
.kicker.mist { color:var(--cf-mist); }
.kicker.harbour { color:var(--cf-harbour); }

/* ─────────── Display type (fluid) ─────────── */
.display-xl { font-family:var(--font-display); font-weight:600; font-size:clamp(44px,8.5vw,108px); line-height:1.0;  letter-spacing:-0.025em; margin:0; }
.display-l  { font-family:var(--font-display); font-weight:600; font-size:clamp(34px,6vw,80px);    line-height:1.04; letter-spacing:-0.02em;  margin:0; }
.display-m  { font-family:var(--font-display); font-weight:600; font-size:clamp(30px,4.6vw,60px);  line-height:1.08; letter-spacing:-0.015em; margin:0; }
.display-s  { font-family:var(--font-display); font-weight:600; font-size:clamp(26px,3.4vw,44px);  line-height:1.12; letter-spacing:-0.01em;  margin:0; }
.display-xl em, .display-l em, .display-m em, .display-s em { font-style:italic; color:var(--cf-forge-ember); }
em.bone { color:var(--cf-bone) !important; }

.lead { font-size:clamp(16px,1.4vw,20px); line-height:1.7; color:var(--cf-mist); }
.serif-lead { font-family:var(--font-display); font-style:italic; font-weight:400; font-size:clamp(19px,2.2vw,26px); line-height:1.45; color:var(--cf-mist); }

/* ─────────── Buttons ─────────── */
.btn {
  display:inline-flex; align-items:center; gap:12px; padding:16px 30px; border-radius:8px;
  font-family:var(--font-body); font-size:15px; font-weight:500; letter-spacing:0.01em;
  cursor:pointer; border:1px solid transparent; white-space:nowrap;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.btn-primary { background:var(--cf-forge-ember); color:#fff; box-shadow:0 8px 32px rgba(241,59,31,0.35); }
.btn-primary:hover { background:var(--accent-hover); transform:translateY(-2px); box-shadow:0 14px 40px rgba(241,59,31,0.45); }
.btn-ghost { background:transparent; color:var(--cf-bone); border-color:rgba(244,239,230,0.25); }
.btn-ghost:hover { border-color:var(--cf-bone); background:rgba(244,239,230,0.05); }
.on-light .btn-ghost { color:var(--cf-basalt); border-color:rgba(19,46,63,0.25); }
.on-light .btn-ghost:hover { border-color:var(--cf-basalt); background:rgba(19,46,63,0.04); }
.btn:disabled { opacity:.55; pointer-events:none; }
.btn-arrow { display:inline-block; transition:transform .25s ease; }
.btn:hover .btn-arrow { transform:translateX(4px); }

.link-underline {
  position:relative; display:inline-flex; gap:8px; align-items:center;
  font-family:var(--font-body); font-size:14px; font-weight:500; color:var(--cf-forge-ember); cursor:pointer;
}
.link-underline::after { content:''; position:absolute; left:0; bottom:-3px; width:100%; height:1px; background:currentColor; transform-origin:left; transition:transform .35s ease; }
.link-underline:hover::after { transform:scaleX(0.4); }
.link-underline:focus-visible { outline:none; }
.link-underline:focus-visible::after { transform:scaleX(1); height:2px; }

/* ─────────── Ember dot ─────────── */
.ember-dot { width:8px; height:8px; border-radius:50%; background:var(--cf-forge-ember); display:inline-block; vertical-align:middle; animation:pulse-ember 2.4s ease-in-out infinite; }
@keyframes pulse-ember { 0%,100%{ transform:scale(1); opacity:1; box-shadow:0 0 0 0 rgba(241,59,31,0.5);} 50%{ transform:scale(1.08); opacity:.85; box-shadow:0 0 24px 4px rgba(241,59,31,0.18);} }

/* ─────────── Scroll reveal ─────────── */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1); will-change:opacity,transform; }
.reveal.in { opacity:1; transform:translateY(0); }
.reveal[data-delay="1"]{ transition-delay:.10s; } .reveal[data-delay="2"]{ transition-delay:.20s; }
.reveal[data-delay="3"]{ transition-delay:.30s; } .reveal[data-delay="4"]{ transition-delay:.40s; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }

/* ─────────── Cards on dark ─────────── */
.card-dark {
  background:linear-gradient(180deg, rgba(244,239,230,0.04) 0%, rgba(244,239,230,0.015) 100%);
  border:1px solid rgba(244,239,230,0.08); border-radius:14px; padding:36px 32px; position:relative;
  transition:border-color .3s ease, transform .3s ease;
}
.card-dark:hover { border-color:rgba(241,59,31,0.4); transform:translateY(-3px); }

/* ════════════════════════ TOP NAV ════════════════════════ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:80;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--edge); transition:background .3s ease, backdrop-filter .3s ease, padding .3s ease, border-color .3s ease;
  border-bottom:1px solid transparent;
}
.nav.scrolled { background:rgba(19,46,63,0.82); backdrop-filter:blur(12px); border-bottom-color:rgba(244,239,230,0.08); padding-block:12px; }
.nav-brand { display:flex; align-items:center; gap:12px; }
.nav-brand img { height:32px; width:auto; }
.nav-brand .wordmark { font-size:19px; }
.nav-links { display:flex; gap:30px; font-size:14px; font-weight:500; }
.nav-links a { color:var(--cf-bone); opacity:.82; transition:opacity .2s ease; }
.nav-links a:hover { opacity:1; }
.nav-cta { display:flex; align-items:center; gap:14px; }
.nav .btn { padding:12px 20px; font-size:13.5px; }
.nav-toggle { display:none; background:none; border:0; cursor:pointer; width:40px; height:40px; flex-direction:column; justify-content:center; gap:5px; }
.nav-toggle span { display:block; height:2px; width:22px; background:var(--cf-bone); transition:transform .3s ease, opacity .3s ease; }
.nav.open .nav-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav.open .nav-toggle span:nth-child(2){ opacity:0; }
.nav.open .nav-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ════════════════════════ HERO ════════════════════════ */
.hero { position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; background:var(--cf-basalt); }
.hero-media { position:absolute; inset:0; z-index:0; }
.hero-media img { position:absolute; inset:-8% 0; width:100%; height:116%; object-fit:cover; object-position:center; }
.hero-wash { position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(19,46,63,0.35) 0%, rgba(19,46,63,0.55) 50%, rgba(19,46,63,0.88) 100%); pointer-events:none; }
.hero-grid { position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:linear-gradient(rgba(241,59,31,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(241,59,31,0.05) 1px,transparent 1px);
  background-size:64px 64px; }
.hero-inner { position:relative; z-index:2; width:100%; padding:0 var(--edge) clamp(72px,12vh,120px); max-width:1480px; margin:0 auto; }
.hero h1 { margin:28px 0 30px; max-width:16ch; }
.hero .serif-lead { max-width:62ch; margin:0 0 44px; }
.hero-actions { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.hero-note { font-family:var(--font-mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--cf-mist); display:inline-flex; align-items:center; gap:10px; }
.scroll-cue { position:absolute; left:var(--edge); bottom:30px; z-index:2; font-family:var(--font-mono); font-size:10px; letter-spacing:0.3em; text-transform:uppercase; color:var(--cf-mist); }

/* ════════════════════════ PROOF ════════════════════════ */
.proof { padding-block:30px; }
.proof-grid { display:grid; grid-template-columns:260px 1fr; gap:56px; align-items:center; }
.proof-label { font-family:var(--font-mono); font-size:10px; letter-spacing:0.24em; text-transform:uppercase; color:var(--cf-mist); display:flex; align-items:center; gap:10px; }
.proof-names { display:flex; justify-content:space-between; gap:28px 40px; flex-wrap:wrap; }
.proof-names span { font-family:var(--font-display); font-style:italic; font-weight:500; font-size:19px; color:var(--cf-bone); opacity:.55; white-space:nowrap; }
.placeholder-flag { font-family:var(--font-mono); font-size:9px; letter-spacing:0.18em; text-transform:uppercase; color:var(--cf-harbour); border:1px dashed rgba(83,123,133,0.5); border-radius:100px; padding:3px 10px; }

/* ════════════════════════ PROBLEM ════════════════════════ */
.problem { background:var(--cf-basalt); }
.problem-top { display:grid; grid-template-columns:1fr 1.4fr; gap:clamp(40px,6vw,96px); align-items:start; }
.q-list { list-style:none; counter-reset:q; padding:0; margin:36px 0 0; }
.q-list li { display:grid; grid-template-columns:48px 1fr; gap:20px; padding:20px 0; border-top:1px solid rgba(244,239,230,0.10); }
.q-list .qn { font-family:var(--font-mono); font-size:11px; letter-spacing:0.2em; color:var(--cf-forge-ember); }
.q-list .qt { font-family:var(--font-display); font-style:italic; font-size:clamp(18px,2vw,22px); line-height:1.4; color:var(--cf-bone); }
.evidence { margin-top:clamp(64px,9vw,120px); padding-top:48px; border-top:1px solid rgba(244,239,230,0.12); }
.evidence-head { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:44px; flex-wrap:wrap; }
.stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(32px,4vw,56px); }
.stat { border-top:2px solid var(--cf-forge-ember); padding-top:26px; }
.stat .num { font-family:var(--font-display); font-weight:600; font-size:clamp(64px,8vw,108px); line-height:.9; letter-spacing:-0.03em; color:var(--cf-forge-ember); }
.stat .desc { font-family:var(--font-display); font-style:italic; font-size:clamp(18px,1.8vw,22px); line-height:1.35; color:var(--cf-bone); margin:24px 0 16px; }
.stat .src { font-family:var(--font-mono); font-size:10px; letter-spacing:0.16em; text-transform:uppercase; color:var(--cf-mist); }

/* ════════════════════════ INSIGHT (pull quote on image) ════════════════════════ */
.insight { position:relative; min-height:600px; display:flex; align-items:center; overflow:hidden; }
.insight-media { position:absolute; inset:0; z-index:0; }
.insight-media img { position:absolute; inset:-8% 0; width:100%; height:116%; object-fit:cover; }
.insight-wash { position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(19,46,63,0.55) 0%, rgba(19,46,63,0.85) 100%); }
.insight-inner { position:relative; z-index:2; }
.insight blockquote { margin:36px 0 0; border-left:2px solid var(--cf-forge-ember); padding-left:clamp(24px,4vw,56px); }
.insight blockquote p { font-family:var(--font-display); font-style:italic; font-weight:500; font-size:clamp(28px,4.4vw,56px); line-height:1.2; letter-spacing:-0.01em; color:var(--cf-bone); margin:0; text-wrap:pretty; }
.insight blockquote footer { margin-top:36px; font-family:var(--font-mono); font-size:12px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cf-mist); }

/* ════════════════════════ MANIFESTO ════════════════════════ */
.manifesto { background:var(--cf-basalt); }
.manifesto-grid { display:grid; grid-template-columns:1fr 2fr; gap:clamp(40px,7vw,96px); align-items:start; }
.manifesto-aside { position:sticky; top:120px; }
.manifesto-thesis { font-family:var(--font-display); font-weight:500; font-size:clamp(30px,5vw,60px); line-height:1.1; letter-spacing:-0.018em; color:var(--cf-bone); margin:0; text-wrap:pretty; }
.manifesto-thesis em { font-style:italic; color:var(--cf-forge-ember); }
.manifesto p.body { font-size:clamp(16px,1.4vw,19px); line-height:1.7; color:var(--cf-mist); max-width:720px; margin:40px 0 0; }
.manifesto p.body em { color:var(--cf-bone); font-style:italic; }

/* ════════════════════════ METHOD (flywheel + phases) ════════════════════════ */
.method { background:var(--cf-basalt); }
.method-intro { display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(40px,7vw,96px); align-items:center; margin-bottom:clamp(40px,5vw,72px); }
.flywheel-card { background:rgba(244,239,230,0.025); border:1px solid rgba(244,239,230,0.10); border-radius:12px; padding:clamp(20px,3vw,36px); }
.flywheel-head { display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid rgba(244,239,230,0.10); flex-wrap:wrap; }
.flywheel-wrap { position:relative; width:100%; max-width:460px; margin:0 auto; aspect-ratio:1; }
.phase-row { display:grid; grid-template-columns:1.1fr 1fr; background:rgba(244,239,230,0.02); border-top:1px solid rgba(244,239,230,0.08); border-bottom:1px solid rgba(244,239,230,0.08); margin-bottom:16px; scroll-margin-top:90px; }
.phase-row:nth-child(even) .phase-media { order:2; }
.phase-row:nth-child(even) .phase-body { order:1; }
.phase-media { position:relative; min-height:420px; overflow:hidden; }
.phase-media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.phase-media .ltr { position:absolute; top:28px; left:28px; font-family:var(--font-display); font-weight:700; font-size:clamp(90px,12vw,140px); line-height:1; color:rgba(244,239,230,0.95); letter-spacing:-0.04em; text-shadow:0 2px 24px rgba(0,0,0,0.5); }
.phase-body { padding:clamp(40px,5vw,72px); display:flex; flex-direction:column; justify-content:center; }
.phase-body h3 { font-family:var(--font-display); font-weight:600; font-size:clamp(40px,5vw,64px); line-height:1; color:var(--cf-bone); margin:20px 0 16px; letter-spacing:-0.015em; }
.phase-body .line { font-family:var(--font-display); font-style:italic; font-size:clamp(18px,1.8vw,22px); line-height:1.45; color:var(--cf-bone); margin:0 0 24px; max-width:540px; }
.phase-body .desc { font-size:16px; line-height:1.7; color:var(--cf-mist); margin:0 0 28px; max-width:540px; }
.phase-sci-label { font-family:var(--font-mono); font-size:10px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cf-harbour); margin-bottom:8px; }
.phase-sci { font-size:13px; line-height:1.6; color:var(--cf-mist); }
.phase-foot { padding-top:18px; border-top:1px solid rgba(244,239,230,0.10); margin-top:20px; }

/* ════════════════════════ PRINCIPLES (science) ════════════════════════ */
.principles { background:var(--cf-cinder); }
.principles-head { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(40px,6vw,96px); margin-bottom:clamp(56px,8vw,96px); align-items:end; }
.principles-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(244,239,230,0.12); }
.principle { padding:44px 34px 52px; border-right:1px solid rgba(244,239,230,0.12); border-bottom:1px solid rgba(244,239,230,0.12); }
.principles-grid .principle:nth-child(3n) { border-right:none; }
.principle .pn { font-family:var(--font-mono); font-size:11px; letter-spacing:0.22em; color:var(--cf-forge-ember); margin-bottom:22px; }
.principle h3 { font-family:var(--font-display); font-weight:600; font-size:clamp(24px,2.4vw,30px); line-height:1.2; color:var(--cf-bone); margin:0 0 16px; letter-spacing:-0.012em; }
.principle p { font-size:15px; line-height:1.7; color:var(--cf-mist); margin:0; }

/* ════════════════════════ SERVICES ════════════════════════ */
.services { background:var(--cf-cinder); }
.services-head { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); margin:28px 0 64px; align-items:end; }
.services-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.service .srv-top { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:22px; }
.service .dur { font-family:var(--font-mono); font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--cf-mist); }
.service h3 { font-family:var(--font-display); font-weight:600; font-size:clamp(24px,2.4vw,32px); line-height:1.15; color:var(--cf-bone); margin:0 0 16px; letter-spacing:-0.01em; }
.service p { font-size:15px; line-height:1.65; color:var(--cf-mist); margin:0 0 28px; }
.service .srv-foot { display:flex; justify-content:flex-end; align-items:center; padding-top:22px; border-top:1px solid rgba(244,239,230,0.10); }

/* ════════════════════════ MATURITY (light) ════════════════════════ */
.maturity { background:var(--cf-bone); color:var(--cf-basalt); }
.maturity-head { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); margin-bottom:72px; align-items:end; }
.maturity-head .topline { border-top:2px solid var(--cf-basalt); padding-top:24px; }
.maturity-head h2 { font-family:var(--font-display); font-weight:600; font-size:clamp(34px,5vw,64px); line-height:1.05; letter-spacing:-0.018em; color:var(--cf-basalt); margin:24px 0 0; }
.maturity-head h2 em { color:var(--cf-forge-ember); font-style:italic; }
.maturity-head p { font-size:17px; line-height:1.7; color:var(--cf-basalt); margin:0; max-width:540px; }
.levels { display:grid; grid-template-columns:repeat(4,1fr); position:relative; }
.levels::before { content:''; position:absolute; top:56px; left:24px; right:24px; height:2px; background:linear-gradient(90deg, rgba(19,46,63,0.15) 0%, var(--cf-forge-ember) 100%); }
.level { padding:0 24px; position:relative; }
.level .dot { width:18px; height:18px; border-radius:50%; background:var(--cf-bone); border:2px solid var(--cf-basalt); position:relative; top:48px; margin-bottom:64px; }
.level:last-child .dot { background:var(--cf-forge-ember); border-color:var(--cf-forge-ember); box-shadow:0 0 0 6px rgba(241,59,31,0.15); }
.level .lv { font-family:var(--font-mono); font-size:11px; letter-spacing:0.22em; color:var(--cf-harbour); margin-bottom:12px; }
.level h3 { font-family:var(--font-display); font-weight:600; font-size:clamp(24px,2.4vw,32px); line-height:1.1; color:var(--cf-basalt); margin:0 0 16px; letter-spacing:-0.01em; }
.level p { font-size:14px; line-height:1.65; color:var(--cf-basalt); margin:0; }

/* ════════════════════════ DIFFERENTIATORS ════════════════════════ */
.diff { background:var(--cf-basalt); }
.diff-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:clamp(40px,6vw,96px); align-items:start; }
.diff-aside { position:sticky; top:120px; }
.diff-aside p { font-size:16px; line-height:1.7; color:var(--cf-mist); margin-top:24px; max-width:420px; }
.diff-list { display:flex; flex-direction:column; gap:20px; }
.diff-card { display:grid; grid-template-columns:56px 1fr; gap:24px; align-items:start; }
.diff-card.star { border-color:rgba(241,59,31,0.40); background:linear-gradient(180deg, rgba(241,59,31,0.06) 0%, rgba(241,59,31,0.015) 100%); }
.diff-card .dnum { font-family:var(--font-display); font-weight:600; font-size:28px; color:var(--cf-bone); }
.diff-card.star .dnum { color:var(--cf-forge-ember); }
.diff-card h3 { font-family:var(--font-display); font-weight:600; font-size:clamp(22px,2.2vw,28px); color:var(--cf-bone); margin:0 0 12px; line-height:1.2; }
.diff-card p { font-size:15px; line-height:1.7; color:var(--cf-mist); margin:0; }
.diff-star-tag { position:absolute; top:18px; right:22px; font-family:var(--font-mono); font-size:10px; letter-spacing:0.22em; color:var(--cf-forge-ember); }

/* ════════════════════════ FOUNDER ════════════════════════ */
.founder { background:var(--cf-basalt); }
.founder-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:clamp(40px,6vw,96px); align-items:start; }
.founder-portrait { aspect-ratio:4/5; border-radius:4px; border:1px solid rgba(244,239,230,0.12); position:relative; overflow:hidden; background:linear-gradient(180deg, rgba(244,239,230,0.08), rgba(244,239,230,0.02)); }
.founder-portrait img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.85; filter:grayscale(.2); }
.founder-portrait .pwash { position:absolute; inset:0; background:linear-gradient(180deg, rgba(19,46,63,0.10), rgba(19,46,63,0.55)); }
.founder-portrait .ptag { position:absolute; left:24px; bottom:24px; font-family:var(--font-mono); font-size:10px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cf-bone); }
.founder-cap { margin-top:24px; font-family:var(--font-mono); font-size:10px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cf-mist); }
.founder-letter { font-size:clamp(16px,1.5vw,18px); line-height:1.75; color:var(--cf-bone); max-width:720px; }
.founder-letter p { margin:0 0 24px; }
.founder-letter em { font-family:var(--font-display); font-style:italic; color:var(--cf-mist); }
.founder-sign { margin-top:48px; padding-top:28px; border-top:1px solid rgba(244,239,230,0.12); display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.founder-sign .name { font-family:var(--font-display); font-style:italic; font-size:28px; color:var(--cf-bone); line-height:1; }

/* ════════════════════════ SUB-BRANDS ════════════════════════ */
.brands { background:var(--cf-basalt); position:relative; overflow:hidden; }
.brands-deco { position:absolute; top:30px; right:-120px; width:480px; max-width:42vw; opacity:.20; mix-blend-mode:screen; pointer-events:none; z-index:0; }
.brands > .container { position:relative; z-index:1; }
.brands-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:64px; }
.brand-card { padding:44px 36px; min-height:360px; display:flex; flex-direction:column; }
.brand-role { font-family:var(--font-mono); font-size:10px; letter-spacing:0.24em; text-transform:uppercase; color:var(--cf-harbour); margin-bottom:18px; }
.brand-lockup { display:flex; align-items:baseline; gap:6px; margin-bottom:20px; flex-wrap:wrap; }
.brand-lockup .nm { font-family:var(--font-display); font-style:italic; font-weight:500; font-size:30px; color:var(--cf-bone); }
.brand-tag { font-family:var(--font-display); font-style:italic; font-size:19px; line-height:1.4; color:var(--cf-forge-ember); margin-bottom:20px; }
.brand-card p { font-size:14px; line-height:1.7; color:var(--cf-mist); margin:0 0 24px; }
.brand-card .link-underline { margin-top:auto; }

/* ════════════════════════ INSIGHTS (articles) ════════════════════════ */
.insights { background:var(--cf-basalt); }
.insights-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:64px; flex-wrap:wrap; }
.articles { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.article { border-top:1px solid rgba(244,239,230,0.18); padding-top:26px; }
.article-meta { display:flex; justify-content:space-between; margin-bottom:20px; font-family:var(--font-mono); font-size:10px; letter-spacing:0.2em; text-transform:uppercase; }
.article-meta .tag { color:var(--cf-forge-ember); } .article-meta .date { color:var(--cf-mist); }
.article h3 { font-family:var(--font-display); font-weight:600; font-size:clamp(22px,2.2vw,28px); line-height:1.18; color:var(--cf-bone); margin:0 0 18px; }
.article p { font-size:15px; line-height:1.65; color:var(--cf-mist); margin:0 0 28px; }
.article-foot { display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--cf-mist); }
.article-foot .read { color:var(--cf-forge-ember); }

/* ════════════════════════ FAQ ════════════════════════ */
.faq { background:var(--cf-basalt); }
.faq-grid { display:grid; grid-template-columns:1fr 1.6fr; gap:clamp(40px,6vw,96px); align-items:start; }
.faq-aside { position:sticky; top:120px; }
.faq-aside p { font-size:16px; line-height:1.7; color:var(--cf-mist); margin:28px 0 20px; max-width:380px; }
.faq-item { border-bottom:1px solid rgba(244,239,230,0.18); }
.faq-item:first-child { border-top:1px solid rgba(244,239,230,0.18); }
.faq-q { width:100%; text-align:left; background:transparent; border:0; cursor:pointer; padding:30px 0; display:grid; grid-template-columns:56px 1fr 40px; gap:20px; align-items:center; color:inherit; }
.faq-q .qn { font-family:var(--font-mono); font-size:11px; letter-spacing:0.22em; color:var(--cf-forge-ember); }
.faq-q .qt { font-family:var(--font-display); font-weight:500; font-size:clamp(20px,2vw,26px); line-height:1.25; color:var(--cf-bone); letter-spacing:-0.008em; }
.faq-q .qx { font-family:var(--font-display); font-size:32px; color:var(--cf-forge-ember); text-align:right; transition:transform .3s ease; }
.faq-item.open .qx { transform:rotate(45deg); }
.faq-a { display:grid; grid-template-columns:56px 1fr 40px; gap:20px; max-height:0; overflow:hidden; transition:max-height .5s ease, padding .4s ease; }
.faq-item.open .faq-a { max-height:480px; padding-bottom:34px; }
.faq-a p { grid-column:2; margin:0; font-size:16px; line-height:1.75; color:var(--cf-mist); max-width:720px; }

/* ════════════════════════ FINAL CTA ════════════════════════ */
.finalcta { position:relative; overflow:hidden; background:var(--cf-cinder); padding-block:clamp(120px,16vw,200px); }
.finalcta-media { position:absolute; inset:0; z-index:0; }
.finalcta-media img { position:absolute; inset:-8% 0; width:100%; height:116%; object-fit:cover; opacity:.55; }
.finalcta-wash { position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(62,35,2,0.65) 0%, rgba(19,46,63,0.85) 100%); }
.finalcta-inner { position:relative; z-index:2; max-width:1100px; }
.finalcta h2 { margin:28px 0 30px; }
.finalcta .serif-lead { max-width:700px; margin:0 0 44px; color:var(--cf-mist); }
.finalcta-actions { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }

/* ════════════════════════ FOOTER ════════════════════════ */
.footer { background:var(--cf-basalt); border-top:1px solid rgba(244,239,230,0.10); padding:72px var(--edge) 44px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:48px; margin-bottom:52px; }
.footer-brand .lockup { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.footer-brand .lockup img { height:38px; }
.footer-brand .tagline { font-family:var(--font-display); font-style:italic; font-size:18px; line-height:1.5; max-width:320px; color:var(--cf-mist); }
.footer-col-title { font-family:var(--font-mono); font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cf-mist); margin-bottom:18px; }
.footer-col a { display:block; font-size:14px; margin-bottom:10px; color:var(--cf-bone); opacity:.75; transition:opacity .2s ease; }
.footer-col a:hover { opacity:1; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding-top:32px; border-top:1px solid rgba(244,239,230,0.08); font-family:var(--font-mono); font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--cf-mist); }
.footer-bottom .links { display:flex; gap:28px; }

/* ════════════════════════ MODAL (white-paper / contact) ════════════════════════ */
.modal { position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:24px; }
.modal.open { display:flex; }
.modal-backdrop { position:absolute; inset:0; background:rgba(8,18,25,0.72); backdrop-filter:blur(4px); }
.modal-card { position:relative; z-index:1; width:100%; max-width:520px; background:#10283a; border:1px solid rgba(244,239,230,0.12); border-radius:18px; padding:clamp(24px,4vw,40px); max-height:calc(100dvh - 48px); overflow-y:auto; }
.modal-close { position:absolute; top:16px; right:16px; width:38px; height:38px; border-radius:50%; border:1px solid rgba(244,239,230,0.18); background:transparent; color:var(--cf-bone); cursor:pointer; font-size:18px; line-height:1; }
.modal-close:hover { border-color:var(--cf-forge-ember); color:var(--cf-forge-ember); }
.modal h2 { font-family:var(--font-display); font-weight:600; font-size:28px; color:var(--cf-bone); margin:0 0 8px; }
.modal .modal-sub { font-size:14px; line-height:1.6; color:var(--cf-mist); margin:0 0 22px; }
.field { margin-bottom:16px; }
.field label { display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:0.18em; text-transform:uppercase; color:var(--cf-mist); margin-bottom:8px; }
.field input, .field textarea { width:100%; font-family:var(--font-body); font-size:15px; color:var(--cf-bone); background:rgba(19,46,63,0.6); border:1px solid rgba(244,239,230,0.16); border-radius:8px; padding:12px 14px; transition:border-color .25s ease; }
.field input:focus, .field textarea:focus { outline:none; border-color:var(--cf-forge-ember); }
.field textarea { resize:vertical; min-height:90px; }
.hp-field { position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
.modal-foot { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:4px; }
.form-status { font-family:var(--font-mono); font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--cf-mist); min-height:1em; }
.form-status.error { font-family:var(--font-body); font-size:12.5px; letter-spacing:0; text-transform:none; color:var(--cf-forge-ember); }
.privacy-note { font-family:var(--font-body); font-size:12px; line-height:1.5; color:var(--cf-mist); opacity:.8; margin:16px 0 0; }
.consent { display:flex; flex-direction:column; gap:10px; margin:14px 0 4px; }
.consent[hidden] { display:none; }
.consent-line { display:flex; gap:10px; align-items:flex-start; font-family:var(--font-body); font-size:12.5px; line-height:1.5; color:var(--cf-mist); cursor:pointer; }
.consent-line input[type="checkbox"] { margin-top:2px; flex:0 0 auto; width:16px; height:16px; accent-color:var(--cf-forge-ember); cursor:pointer; }
.consent-line a { color:inherit; text-decoration:underline; }
#m-turnstile { margin:14px 0 2px; }
#m-turnstile:empty { margin:0; }
.btn.is-loading .btn-arrow { display:none; }
.btn.is-loading::after { content:''; width:14px; height:14px; margin-left:4px; border-radius:50%; border:2px solid rgba(255,255,255,0.45); border-top-color:#fff; display:inline-block; animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.modal-thanks { text-align:center; padding:8px 4px; }
.modal-thanks .mk { color:var(--cf-forge-ember); font-size:40px; line-height:1; margin-bottom:14px; }
.modal-thanks h2 { margin-bottom:10px; }
.modal-thanks p { font-size:15px; line-height:1.6; color:var(--cf-mist); margin:0 auto; max-width:34ch; }

/* ════════════════════════ FORGE BACKGROUND MOTIF (fixed) ════════════════════════ */
.forge-bg { position:fixed; inset:0; z-index:0; pointer-events:none; background:var(--cf-basalt); overflow:hidden; }
.forge-bg::before { content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(241,59,31,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(241,59,31,0.05) 1px, transparent 1px);
  background-size:var(--grid-size) var(--grid-size); }
.fg-glow { position:absolute; border-radius:50%; }
.fg-glow.ember-tr  { top:-12%; right:-10%; width:620px; height:620px; background:radial-gradient(circle, rgba(241,59,31,0.16) 0%, transparent 70%); }
.fg-glow.harbour-bl{ bottom:-8%; left:-12%; width:520px; height:520px; background:radial-gradient(circle, rgba(83,123,133,0.13) 0%, transparent 70%); }
.fg-glow.ember-ml  { top:42%; left:-9%; width:440px; height:440px; background:radial-gradient(circle, rgba(241,59,31,0.07) 0%, transparent 70%); }
.fg-glow.harbour-mr{ top:64%; right:-9%; width:480px; height:480px; background:radial-gradient(circle, rgba(83,123,133,0.08) 0%, transparent 70%); }
/* lift real content above the fixed motif (NOT the modal — it must stay position:fixed) */
body > nav, body > main, body > footer { position:relative; z-index:1; }
/* let the motif show through the plain dark sections (cinder/bone sections stay solid for contrast) */
.proof, .problem, .manifesto, .method, .diff, .founder, .brands, .insights, .faq { background:transparent !important; }

/* ════════════════════════ CLIENT MARQUEE ════════════════════════ */
.proof .container { padding-block:8px; }
.proof-head { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.marquee { overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.marquee-track { display:flex; gap:46px; width:max-content; animation:marquee 60s linear infinite; }
.marquee:hover .marquee-track { animation-play-state:paused; }
.marquee-track span { font-family:var(--font-display); font-style:italic; font-weight:500; font-size:21px; color:var(--cf-bone); opacity:.5; white-space:nowrap; }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquee-track { animation:none; flex-wrap:wrap; width:auto; row-gap:14px; } .marquee { mask-image:none; -webkit-mask-image:none; } }

/* ════════════════════════ SUB-BRAND ACCENTS ════════════════════════ */
.brand-card { border-top:3px solid var(--bac, rgba(244,239,230,0.08)); }
.brand-card:hover { border-color:var(--bac-hover, var(--bac, rgba(241,59,31,0.4))); box-shadow:0 18px 48px rgba(0,0,0,0.35); }
.brand-card .brand-role { color:var(--bac-text, var(--cf-harbour)); }
.brand-card .brand-tag  { color:var(--bac-text, var(--cf-forge-ember)); }
.brand-card .link-underline { color:var(--bac-text, var(--cf-forge-ember)); }
.brand-audience { font-family:var(--font-mono); font-size:10px; letter-spacing:0.18em; text-transform:uppercase; color:var(--cf-mist); margin-top:18px; padding-top:16px; border-top:1px solid rgba(244,239,230,0.10); }
/* clickable insight cards */
.articles article { cursor:pointer; }
.articles article h3 { transition:color .25s ease; }
.articles article:hover h3 { color:var(--cf-forge-ember); }

/* founder real photo (full tone, no placeholder wash) */
.founder-portrait.has-photo img { opacity:1; filter:none; object-position:center 15%; }
.founder-portrait.has-photo .pwash { display:none; }

/* ════════════════════════ FORGE MOTIF on the brown (cinder) sections ════════════════════════ */
.principles, .services { position:relative; overflow:hidden; }
.principles > .container, .services > .container { position:relative; z-index:1; }
.principles::before, .services::before { content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(241,59,31,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(241,59,31,0.05) 1px, transparent 1px);
  background-size:var(--grid-size) var(--grid-size); }
.principles::after, .services::after { content:''; position:absolute; z-index:0; pointer-events:none; border-radius:50%;
  top:-12%; right:-8%; width:560px; height:560px; background:radial-gradient(circle, rgba(241,59,31,0.15) 0%, transparent 70%); }
.brown-glow { position:absolute; z-index:0; pointer-events:none; border-radius:50%; bottom:-10%; left:-8%; width:460px; height:460px; background:radial-gradient(circle, rgba(83,123,133,0.10) 0%, transparent 70%); }

/* ════════════════════════ CORTEXA MOTIF (light bone + basalt grid + ember glow) ════════════════════════ */
/* Maturity (already bone) — layer the basalt grid + ember glows */
.maturity { position:relative; overflow:hidden; }
.maturity::before { content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(19,46,63,0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(19,46,63,0.07) 1px, transparent 1px);
  background-size:var(--grid-size) var(--grid-size); }
.maturity::after { content:''; position:absolute; z-index:0; pointer-events:none; border-radius:50%;
  top:-10%; right:-6%; width:560px; height:560px; background:radial-gradient(circle, rgba(241,59,31,0.18) 0%, transparent 70%); }
.maturity > .container { position:relative; z-index:1; }
.cortexa-glow2 { position:absolute; z-index:0; pointer-events:none; border-radius:50%; bottom:-10%; left:-7%; width:440px; height:440px; background:radial-gradient(circle, rgba(241,59,31,0.10) 0%, transparent 70%); }

/* Evidence Base → light bone panel with the same Cortexa motif (breaks up the dark) */
.evidence { background:var(--cf-bone); color:var(--cf-basalt); border-radius:18px; border-top:0 !important;
  padding:clamp(36px,4.5vw,60px); position:relative; overflow:hidden; }
.evidence::before { content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(19,46,63,0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(19,46,63,0.07) 1px, transparent 1px);
  background-size:var(--grid-size) var(--grid-size); }
.evidence::after { content:''; position:absolute; z-index:0; pointer-events:none; border-radius:50%;
  top:-26%; right:-6%; width:480px; height:480px; background:radial-gradient(circle, rgba(241,59,31,0.18) 0%, transparent 70%); }
.evidence > * { position:relative; z-index:1; }
.evidence .kicker { color:var(--cf-harbour); }
.evidence .kicker.mist { color:var(--cf-harbour); }
.evidence .stat { border-top-color:var(--cf-forge-ember); }
.evidence .stat .num { color:var(--cf-forge-ember); }
.evidence .stat .desc { color:var(--cf-basalt); }
.evidence .stat .src { color:var(--cf-harbour); }

/* ════════════════════════ RESPONSIVE ════════════════════════ */
@media (max-width:1024px) {
  .nav-links { display:none; }
  .nav-toggle { display:flex; }
  .nav.open { background:rgba(19,46,63,0.96); backdrop-filter:blur(12px); flex-wrap:wrap; }
  .nav.open .nav-links { display:flex; flex-direction:column; width:100%; gap:4px; order:3; padding:16px 0 8px; }
  .nav.open .nav-links a { padding:10px 0; font-size:16px; }
  .nav .nav-cta .btn { display:none; }
  .nav.open .nav-cta { order:4; width:100%; }
  .nav.open .nav-cta .btn { display:inline-flex; width:100%; justify-content:center; }

  .proof-grid { grid-template-columns:1fr; gap:24px; }
  .problem-top, .manifesto-grid, .method-intro, .principles-head, .services-head,
  .maturity-head, .diff-grid, .founder-grid, .faq-grid, .insights-head { grid-template-columns:1fr; }
  .manifesto-aside, .diff-aside, .faq-aside { position:static; }
  .stat-grid { grid-template-columns:1fr; gap:40px; }
  .principles-grid { grid-template-columns:1fr 1fr; }
  .principles-grid .principle:nth-child(3n) { border-right:1px solid rgba(244,239,230,0.12); }
  .principles-grid .principle:nth-child(2n) { border-right:none; }
  .services-grid, .brands-grid, .articles, .levels { grid-template-columns:1fr 1fr; }
  .levels::before { display:none; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:36px; }
  .phase-media { min-height:300px; }
}

@media (max-width:680px) {
  .hero { align-items:flex-end; }
  .hero-actions .btn, .finalcta-actions .btn { width:100%; justify-content:center; }
  .proof-names { gap:14px 24px; }
  .principles-grid, .services-grid, .brands-grid, .articles, .levels { grid-template-columns:1fr; }
  .principles-grid .principle { border-right:none !important; }
  .phase-row, .phase-row:nth-child(even) .phase-media, .phase-row:nth-child(even) .phase-body { grid-template-columns:1fr; }
  .phase-row { display:flex; flex-direction:column; }
  .phase-row:nth-child(even) .phase-media { order:0; }
  .phase-row:nth-child(even) .phase-body { order:0; }
  .footer-grid { grid-template-columns:1fr; gap:28px; }
  .footer-bottom { flex-direction:column; align-items:flex-start; gap:14px; }
  .faq-q { grid-template-columns:40px 1fr 28px; gap:12px; }
  .faq-a { grid-template-columns:40px 1fr 28px; gap:12px; }
  .diff-card { grid-template-columns:44px 1fr; gap:16px; }
}