/* ============================================================
   Beach Intelligence - "The Continuous Dive"
   Deep Ocean Dusk · AI-lab grade · original build by Claude
   ============================================================ */

:root{
  /* Brand V3 palette: Deep sea #0C2D3F · Sun gold #F2B33C · Seafoam #28B0A6 · Sand #E7D7B8 · Slate #4C5B66 · Sea-mist #EEF4F4 */
  --ink:#081f2a; --ink-2:#0C2D3F; --ink-3:#123a4d; --abyss:#05151d;
  --sand:#EEF4F4; --sand-dim:rgba(238,244,244,.75); --sand-faint:rgba(238,244,244,.5);
  --aqua:#41d0c4; --aqua-deep:#28B0A6; --coral:#F2B33C; --sun:#f7c766; --steel:#8aa0ad;
  --warm:#E7D7B8; --slate:#4C5B66;
  --line:rgba(238,244,244,.14); --line-soft:rgba(238,244,244,.07);
  --glass:rgba(12,45,63,.55); --glass-2:rgba(8,31,42,.5);
  --maxw:1080px; --pad:clamp(20px,5vw,72px); --r:18px;
  --serif:"Manrope",system-ui,sans-serif;
  --sans:"Manrope",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans); background:var(--ink); color:var(--sand);
  line-height:1.55; overflow-x:hidden; -webkit-font-smoothing:antialiased; position:relative;
}
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.34;
  background:
    linear-gradient(rgba(238,244,244,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(238,244,244,.03) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(80% 70% at 58% 36%, #000 0%, transparent 70%);
}
em{ font-style:italic; }
::selection{ background:rgba(95,230,203,.28); color:#fff; }

/* ---------- fixed ocean + atmosphere ---------- */
.ocean-fallback{
  position:fixed; inset:0; z-index:-2;
  background:
    radial-gradient(120% 85% at 78% 8%, rgba(255,122,83,.16), transparent 55%),
    radial-gradient(120% 90% at 28% 0%, rgba(95,230,203,.14), transparent 58%),
    radial-gradient(140% 120% at 50% 120%, rgba(43,181,156,.12), transparent 60%),
    linear-gradient(180deg,#08171f,#050f15 60%,#04101c);
}
#ocean{ position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; display:block; pointer-events:none;
  transform:translateZ(0); will-change:transform; backface-visibility:hidden; }
.no-webgl #ocean{ display:none; }
.grain{
  position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
.surface-flash{
  position:fixed; inset:0; z-index:60; pointer-events:none; opacity:0;
  background:radial-gradient(120% 80% at 50% 30%, rgba(255,236,200,.95), rgba(255,205,150,.5) 40%, transparent 75%);
}

/* ---------- custom cursor ---------- */
.cursor{
  display:none;   /* removed: the white follower washed out text over bright water. The cursor-tracked WATER light (shader u_mouse) stays. */
  position:fixed; top:0; left:0; z-index:9999; pointer-events:none; width:13px; height:13px; border-radius:50%;
  background:radial-gradient(circle,var(--aqua),transparent 70%); transform:translate(-50%,-50%);
  border:1px solid rgba(65,208,196,.55);
  box-shadow:0 0 18px rgba(65,208,196,.24);
  transition:width .25s var(--ease),height .25s var(--ease),background .25s,border-color .25s,box-shadow .25s;
  mix-blend-mode:normal; will-change:transform;
}
.cursor.grow{
  width:52px; height:52px;
  background:radial-gradient(circle,rgba(65,208,196,.42) 0 3px,rgba(65,208,196,.08) 4px,rgba(65,208,196,0) 62%);
  border-color:rgba(238,244,244,.45);
  box-shadow:0 0 0 1px rgba(5,15,21,.18),0 0 24px rgba(65,208,196,.22);
}

/* ---------- boot / decompression preloader ---------- */
.boot{
  position:fixed; inset:0; z-index:3000; display:grid; place-items:center; pointer-events:none;
  background:radial-gradient(120% 100% at 50% 30%, #07151d, #04101c 70%, #03090f);
  transition:opacity .7s var(--ease), visibility .7s;
  animation:bootSafety .6s ease 4.6s forwards; /* fail-safe if JS never hides it */
}
.boot.gone{ opacity:0; visibility:hidden; pointer-events:none; }
@keyframes bootSafety{ to{ opacity:0; visibility:hidden; pointer-events:none; } }
.boot-inner{ width:min(80vw,360px); text-align:left; }
.boot-line{ font-family:var(--mono); font-size:.82rem; letter-spacing:.18em; text-transform:uppercase; color:var(--aqua); }
.boot-caret{ color:var(--coral); margin-right:.5em; }
.boot-dots::after{ content:""; animation:dots 1.4s steps(4) infinite; }
@keyframes dots{ 0%{content:"";}25%{content:".";}50%{content:"..";}75%{content:"...";}100%{content:"";} }
.boot-bar{ margin:18px 0 10px; height:2px; background:var(--line); overflow:hidden; }
.boot-bar #bootBar{ display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:left; background:linear-gradient(90deg,var(--aqua),var(--coral)); }
.boot-depth{ font-family:var(--mono); font-size:.74rem; letter-spacing:.2em; color:var(--sand-faint); }

/* ---------- HUD telemetry ---------- */
.hud{ position:fixed; left:clamp(12px,2.4vw,30px); top:50%; transform:translateY(-50%); z-index:50; pointer-events:none;
  display:flex; flex-direction:column; gap:14px; align-items:flex-start; font-family:var(--mono);
  text-shadow:0 1px 10px rgba(3,16,22,.7), 0 0 2px rgba(3,16,22,.6); }
.hud-depth{ font-size:.78rem; letter-spacing:.12em; color:var(--sand); }
.hud-depth b{ color:var(--aqua); font-weight:500; font-size:1rem; text-shadow:0 1px 12px rgba(3,16,22,.85), 0 0 8px rgba(40,176,166,.5); }
.hud-depth span{ margin-left:.25em; color:var(--sand-dim); }
.hud-rail{ width:2px; height:120px; background:rgba(238,244,244,.28); position:relative; overflow:hidden; box-shadow:0 0 8px rgba(3,16,22,.5); }
.hud-rail #depthFill{ position:absolute; inset:0; transform:scaleY(0); transform-origin:top; background:linear-gradient(180deg,var(--coral),var(--aqua) 45%,var(--aqua-deep)); }
.hud-tele{ font-size:.62rem; letter-spacing:.14em; line-height:1.7; color:var(--sand-dim); }
.hud-tele b{ color:var(--sand); font-weight:500; }
.hud-tele b.ok{ color:var(--aqua); }

/* ---------- right rail section index ---------- */
.rail{ position:fixed; right:clamp(12px,2.4vw,30px); top:50%; transform:translateY(-50%); z-index:50;
  display:flex; flex-direction:column; gap:14px; align-items:flex-end; }
.rail a{ display:flex; align-items:center; gap:10px; text-decoration:none; font-family:var(--mono); font-size:.66rem; letter-spacing:.12em; color:var(--sand); transition:color .3s, text-shadow .3s;
  text-shadow:0 1px 10px rgba(3,16,22,.7), 0 0 2px rgba(3,16,22,.6); }
.rail a span{ opacity:.82; }
.rail a i{ font-style:normal; max-width:0; overflow:hidden; white-space:nowrap; opacity:0; transition:max-width .4s var(--ease), opacity .3s; text-transform:uppercase; }
.rail a::after{ content:""; width:18px; height:1px; background:currentColor; opacity:.85; transition:width .3s; box-shadow:0 1px 6px rgba(3,16,22,.6); }
.rail a.on{ color:var(--aqua); text-shadow:0 1px 12px rgba(3,16,22,.85), 0 0 8px rgba(40,176,166,.5); }
.rail a.on span{ opacity:1; }
.rail a.on i{ max-width:120px; opacity:1; }
.rail a.on::after{ width:30px; }

/* ---------- nav ---------- */
.nav{ position:fixed; inset:0 0 auto 0; z-index:100; display:flex; align-items:center; gap:24px; padding:20px var(--pad);
  transition:background .4s var(--ease),padding .4s var(--ease),border-color .4s; border-bottom:1px solid transparent; }
.nav.scrolled{ background:rgba(5,15,21,.6); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%); border-bottom:1px solid var(--line); padding-top:14px; padding-bottom:14px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--sand); margin-right:auto; }
.brand-mark{ display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:rgba(12,33,43,.55); border:1px solid var(--line); box-shadow:inset 0 0 18px rgba(95,230,203,.12); }
.brand-name{ font-family:var(--serif); font-weight:600; font-size:1.06rem; }
.nav-links{ display:flex; gap:30px; }
.nav-links a{ color:var(--sand-dim); text-decoration:none; font-size:.92rem; font-weight:500; position:relative; transition:color .25s; }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:-6px; height:1.5px; width:0; background:var(--aqua); transition:width .3s var(--ease); }
.nav-links a:hover{ color:var(--sand); } .nav-links a:hover::after{ width:100%; }

/* ---------- buttons ---------- */
.btn{ --bg:transparent; --fg:var(--sand); display:inline-flex; align-items:center; gap:.55em; font-family:var(--sans); font-weight:600; font-size:.95rem;
  padding:.85em 1.4em; border-radius:100px; text-decoration:none; color:var(--fg); background:var(--bg); border:1px solid var(--line);
  transition:background .3s,color .3s,border-color .3s,box-shadow .3s,transform .2s; white-space:nowrap; will-change:transform; }
.btn .arrow{ transition:transform .3s var(--ease); } .btn:hover .arrow{ transform:translateX(4px); }
.btn-sm{ padding:.6em 1.1em; font-size:.86rem; }
.btn-lg{ padding:1.05em 1.8em; font-size:1.05rem; }
.btn-primary{ --bg:linear-gradient(120deg,var(--aqua),var(--aqua-deep)); --fg:#042019; border-color:transparent; box-shadow:0 8px 30px -8px rgba(95,230,203,.5); }
.btn-primary:hover{ box-shadow:0 14px 44px -8px rgba(95,230,203,.66); filter:brightness(1.05); }
.btn-ghost:hover{ background:rgba(243,234,215,.06); border-color:var(--sand-faint); }
.nav-toggle{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; }
.nav-toggle span{ display:block; width:24px; height:2px; background:var(--sand); transition:transform .3s var(--ease),opacity .3s; }
.nav-toggle[aria-expanded="true"] span:first-child{ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:last-child{ transform:translateY(-7px) rotate(-45deg); }

/* ---------- shared type ---------- */
.eyebrow,.kicker{ font-family:var(--mono); font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; color:var(--aqua); font-weight:500; }
.kicker{ color:var(--coral); margin-bottom:1.1rem; }
.eyebrow .dot{ color:var(--sand-faint); margin:0 .35em; }
.w{ display:inline-block; will-change:transform,opacity,filter; }

/* ---------- hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:center; padding:140px var(--pad) 90px; max-width:var(--maxw); margin:0 auto; }
.hero-inner{ max-width:980px; position:relative; z-index:2; }
.eyebrow{ margin-bottom:1.6rem; }
.hero-title{ font-family:var(--serif); font-weight:500; font-size:clamp(3.1rem,9.6vw,8.6rem); line-height:.93; letter-spacing:-.02em; margin-bottom:1.7rem; }
.hero-title .line{ display:block; }
.hero-title .accent em{ font-weight:400; background:linear-gradient(115deg,var(--sand) 6%,var(--aqua) 48%,var(--coral) 96%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
/* when the accent line is split into word spans, the gradient must live on each word */
.hero-title .accent .w{ background:linear-gradient(115deg,var(--sand) 6%,var(--aqua) 50%,var(--coral) 98%); background-size:220% 100%; background-position:0% 50%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.hero-sub{ font-size:clamp(1.05rem,1.7vw,1.3rem); color:var(--sand-dim); max-width:56ch; line-height:1.6; text-shadow:0 2px 30px rgba(2,8,12,.6); }
.hero-cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:2.4rem; }
.hero-meta{ display:flex; align-items:center; gap:.7em; margin-top:2.6rem; font-size:.9rem; color:var(--sand-dim); }
.hero-meta strong{ color:var(--sand); font-weight:600; }
.pulse{ width:9px; height:9px; border-radius:50%; background:var(--aqua); box-shadow:0 0 0 0 rgba(95,230,203,.7); animation:pulse 2.4s infinite; }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(95,230,203,.6);}70%{box-shadow:0 0 0 12px rgba(95,230,203,0);}100%{box-shadow:0 0 0 0 rgba(95,230,203,0);} }
.scroll-cue{ position:absolute; left:var(--pad); bottom:34px; display:flex; align-items:center; gap:12px; color:var(--sand-faint); text-decoration:none; font-family:var(--mono); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; }
.scroll-line{ width:60px; height:1px; background:linear-gradient(90deg,var(--sand-faint),transparent); position:relative; overflow:hidden; }
.scroll-line::after{ content:""; position:absolute; left:-30%; top:0; width:30%; height:100%; background:var(--aqua); animation:slide 2.4s var(--ease) infinite; }
@keyframes slide{ 0%{left:-30%;}100%{left:110%;} }

/* ---------- marquee ---------- */
.marquee{ border-block:1px solid var(--line); overflow:hidden; padding:18px 0; background:rgba(8,23,31,.4); backdrop-filter:blur(6px); }
.marquee-track{ display:flex; width:max-content; animation:marq 40s linear infinite; }
.marquee-track span{ font-family:var(--serif); font-size:1.5rem; font-style:italic; color:var(--sand-dim); padding:0 1.2rem; white-space:nowrap; }
.marquee-track i{ color:var(--coral); align-self:center; font-style:normal; font-size:.8rem; }
@keyframes marq{ to{ transform:translateX(-50%); } }

/* ---------- glass ---------- */
.glass{ background:linear-gradient(180deg,var(--glass),var(--glass-2)); backdrop-filter:blur(16px) saturate(130%); -webkit-backdrop-filter:blur(16px) saturate(130%); border:1px solid var(--line); border-radius:var(--r); }

/* ---------- hero console ---------- */
.hero-console{
  position:relative; z-index:2; right:auto; bottom:auto;
  width:min(100%,620px); margin:30px 0 0; padding:18px; color:var(--sand-dim);
  box-shadow:0 28px 70px -42px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.05);
}
.hero-console::before{
  content:""; position:absolute; inset:10px; border-radius:calc(var(--r) - 6px); pointer-events:none;
  background:linear-gradient(120deg,rgba(65,208,196,.08),transparent 42%,rgba(242,179,60,.06));
}
.hero-console>*{ position:relative; z-index:1; }
.console-top{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:14px; border-bottom:1px solid var(--line-soft); font-family:var(--mono); font-size:.63rem; letter-spacing:.16em; text-transform:uppercase; }
.console-top span{ color:var(--aqua); }
.console-top b{ color:var(--warm); font-weight:500; white-space:nowrap; }
.console-flow{ display:grid; grid-template-columns:auto 1fr auto 1fr auto; gap:10px; align-items:center; margin:17px 0 16px; font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--sand); }
.console-flow i{ display:block; height:1px; background:linear-gradient(90deg,var(--aqua),transparent); opacity:.8; }
.console-list{ list-style:none; display:grid; gap:10px; font-size:.9rem; }
.console-list li{ display:flex; align-items:center; gap:10px; }
.console-list li span{ width:7px; height:7px; border-radius:50%; background:var(--aqua); box-shadow:0 0 0 5px rgba(65,208,196,.1); flex:none; }

/* ---------- stats ---------- */
.stats{ max-width:var(--maxw); margin:0 auto; padding:70px var(--pad); }
.stats-inner{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; padding:38px clamp(20px,3vw,46px); }
.stat{ padding:0 26px; border-left:1px solid var(--line); }
.stat:first-child{ border-left:0; }
.stat-num{ font-family:var(--serif); font-weight:500; font-size:clamp(2.4rem,4.6vw,3.8rem); line-height:1; letter-spacing:-.02em; color:var(--sand); font-variant-numeric:tabular-nums; }
.stat-label{ margin-top:.7rem; font-size:.84rem; color:var(--sand-dim); }

/* ---------- fit band ---------- */
.fit{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad) clamp(60px,8vw,110px); }
.fit-inner{ border-top:1px solid var(--line); border-bottom:1px solid var(--line-soft); padding:clamp(28px,4vw,44px) 0; display:grid; grid-template-columns:minmax(260px,.9fr) 1.5fr; gap:clamp(26px,5vw,72px); align-items:start; }
.fit-label{ font-family:var(--serif); font-size:clamp(1.28rem,2.4vw,1.8rem); line-height:1.22; letter-spacing:-.01em; color:var(--sand); max-width:18ch; }
.fit-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.fit-list span{ min-height:96px; display:flex; align-items:flex-end; padding:18px; border:1px solid var(--line); border-radius:14px; color:var(--sand-dim); background:linear-gradient(180deg,rgba(243,234,215,.04),rgba(5,15,21,.18)); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }

/* ---------- sections ---------- */
.section{ max-width:var(--maxw); margin:0 auto; padding:clamp(70px,11vw,150px) var(--pad); }
.section-head{ max-width:760px; margin-bottom:clamp(40px,6vw,72px); }
.section-title{ font-family:var(--serif); font-weight:500; font-size:clamp(2.2rem,5.2vw,4rem); line-height:1.03; letter-spacing:-.02em; margin-top:.6rem; text-shadow:0 2px 30px rgba(2,8,12,.5); }
.section-title em{ color:var(--aqua); font-weight:400; }
.section-lede{ margin-top:1.3rem; font-size:1.1rem; color:var(--sand-dim); max-width:60ch; text-shadow:0 1px 20px rgba(2,8,12,.5); }
.muted{ color:var(--sand-faint); }

/* cards */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.card{ position:relative; padding:32px 28px 30px; overflow:hidden; transform-style:preserve-3d; transition:transform .4s var(--ease),border-color .4s,box-shadow .4s; }
.card::before{ content:""; position:absolute; inset:0; border-radius:var(--r); padding:1px; background:linear-gradient(135deg,var(--aqua),transparent 38%,transparent 72%,var(--aqua-deep)); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; transition:opacity .4s; }
.card:hover{ box-shadow:0 30px 60px -30px rgba(0,0,0,.6),0 0 34px -22px rgba(65,208,196,.55); border-color:rgba(238,244,244,.22); }
.card:hover::before{ opacity:1; }
.card-no{ font-family:var(--mono); font-size:.78rem; color:var(--aqua); letter-spacing:.1em; }
.card-no{ display:inline-flex; align-items:center; min-height:24px; padding:.18rem .55rem; border:1px solid rgba(65,208,196,.2); border-radius:999px; background:rgba(65,208,196,.06); }
.card h3{ font-family:var(--serif); font-weight:600; font-size:1.4rem; margin:1.1rem 0 .7rem; letter-spacing:-.01em; }
.card p{ color:var(--sand-dim); font-size:.97rem; line-height:1.6; }

/* process (pinned dive) */
.process{ position:relative; max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }
.process-pin{ min-height:100svh; display:flex; flex-direction:column; justify-content:center; padding:120px 0; gap:30px; }
.process-head{ max-width:760px; }
.process-line{ display:flex; align-items:center; gap:14px; font-family:var(--mono); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--aqua); }
.process-line::before{ content:""; width:40px; height:1px; background:var(--coral); }
.phases{ list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.phase{
  position:relative; padding:28px 22px 24px;
  border:1px solid var(--line-soft); border-top-color:var(--line);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(238,244,244,.045),rgba(5,15,21,.14));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.phase-ghost{ display:none; }
.phase::after{ content:""; position:absolute; top:-1px; left:0; width:38px; height:2px; background:var(--coral); }
.phase-no{ font-family:var(--mono); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--aqua); }
.phase h3{ font-family:var(--serif); font-weight:500; font-size:1.4rem; margin:1rem 0 .6rem; }
.phase p{ color:var(--sand-dim); font-size:.95rem; }
.phase em{ color:var(--sand); }

/* pull-quote */
.quote-band{ border-block:1px solid var(--line); background:radial-gradient(80% 140% at 50% 50%,rgba(4,16,28,.5),transparent 70%); text-align:center; }
.quote-band blockquote{ max-width:980px; margin:0 auto; padding:clamp(64px,9vw,120px) var(--pad) 1.4rem; font-family:var(--serif); font-weight:400; font-size:clamp(1.7rem,4vw,3rem); line-height:1.2; letter-spacing:-.015em; }
.quote-band em{ color:var(--coral); }
.quote-depth{ font-family:var(--mono); font-size:.7rem; letter-spacing:.2em; color:var(--sand-faint); padding-bottom:clamp(48px,7vw,90px); text-transform:uppercase; }

/* proof */
.proof-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.proof{ padding:34px 30px; transition:transform .4s var(--ease),border-color .4s; }
.proof:hover{ border-color:var(--sand-faint); }
.proof-metric{ font-family:var(--serif); font-weight:600; font-size:clamp(2.6rem,5vw,3.6rem); line-height:1; font-variant-numeric:tabular-nums; background:linear-gradient(120deg,var(--aqua),var(--sun)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.proof h3{ font-family:var(--serif); font-weight:500; font-size:1.25rem; margin:1rem 0 .6rem; }
.proof p{ color:var(--sand-dim); font-size:.95rem; line-height:1.6; }
.proof-tag{ display:inline-block; margin-top:1.3rem; font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; color:var(--aqua); border:1px solid var(--line); padding:.35em .8em; border-radius:100px; }

/* cta */
.cta{ position:relative; }
.cta-inner{ max-width:880px; margin:0 auto; padding:clamp(56px,7vw,96px) var(--pad); text-align:center; }
.cta-inner h2{ font-family:var(--serif); font-weight:500; font-size:clamp(2.6rem,7vw,5.6rem); line-height:1; letter-spacing:-.025em; margin:1rem 0; text-shadow:0 2px 40px rgba(2,8,12,.5); }
.cta-inner h2 em{ background:linear-gradient(115deg,var(--aqua),var(--coral)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; font-weight:400; }
/* when split into word spans, the gradient must live on each word */
.cta-inner h2 em .w{ background:linear-gradient(115deg,var(--aqua),var(--coral)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.cta-sub{ font-size:1.15rem; color:var(--sand-dim); max-width:54ch; margin:0 auto 2.4rem; text-shadow:0 1px 20px rgba(2,8,12,.5); }
.cta-actions{ display:flex; justify-content:center; }
.cta-fine{ margin-top:1.8rem; font-family:var(--mono); font-size:.74rem; letter-spacing:.08em; color:var(--sand-faint); }

/* footer */
.footer{ position:relative; border-top:1px solid var(--line); padding:60px var(--pad) 44px; max-width:var(--maxw); margin:0 auto; }
.footer-top{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-bottom:34px; border-bottom:1px solid var(--line-soft); }
.footer-tag{ font-family:var(--serif); font-style:italic; color:var(--sand-dim); font-size:1.1rem; }
.footer-bottom{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-top:26px; }
.footer-bottom nav{ display:flex; gap:26px; }
.footer-bottom a{ color:var(--sand-dim); text-decoration:none; font-size:.9rem; transition:color .25s; }
.footer-bottom a:hover{ color:var(--aqua); }
.copy{ font-family:var(--mono); font-size:.74rem; color:var(--sand-faint); }
.copy-sys{ color:var(--sand-faint); }
@media (max-width:680px){ .copy-sys{ display:block; margin-top:5px; white-space:nowrap; } }

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .hud,.rail{ display:none; }
  .cards,.proof-grid{ grid-template-columns:repeat(2,1fr); }
  .phases{ grid-template-columns:repeat(2,1fr); gap:40px 24px; }
  .process-pin{ min-height:auto; padding:90px 0; }
  .fit-inner{ grid-template-columns:1fr; }
  .fit-label{ max-width:34ch; }
}
/* HUD + rail are edge ornaments - content is now a centered 1080 column, leaving gutters for them.
   Hide only on tablet/mobile where there's no room. */
@media (max-width:1200px){
  .hud,.rail{ display:none; }
}
/* drop the rail's expanding label (it reached furthest into the content) */
.rail a i{ display:none; }
/* slim the HUD so it fits the gutter without crowding the content column */
.hud{ left:clamp(10px,1.8vw,22px); gap:10px; }
.hud-depth{ font-size:.66rem; }
.hud-depth b{ font-size:.82rem; }
.hud-rail{ height:88px; }
.hud-tele{ font-size:.52rem; line-height:1.6; }
@media (max-width:680px){
  .cursor{ display:none; }
  .stats-inner{ grid-template-columns:1fr 1fr; gap:30px 0; }
  .cards,.proof-grid,.phases{ grid-template-columns:1fr; }
  .fit-list{ grid-template-columns:1fr; }
  .scroll-cue{ display:none; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .boot{ display:none !important; }
  .marquee-track{ animation:none; transform:none; }
  .scroll-line::after,.pulse{ animation:none; }
  .reveal,.w,.phase{ opacity:1 !important; transform:none !important; filter:none !important; }
}

/* ============================================================
   REVIEW FIXES (post adversarial review)
   ============================================================ */
html{ -webkit-tap-highlight-color:transparent; }
:target,[id]{ scroll-margin-top:88px; }

/* keyboard focus visibility (WCAG 2.4.7) */
:focus-visible{ outline:2px solid var(--aqua); outline-offset:3px; border-radius:6px; }
a:focus-visible,button:focus-visible,.btn:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(5,15,21,.92),0 0 0 5px var(--aqua); border-radius:100px; }

/* skip link (WCAG 2.4.1) */
.skip{ position:absolute; left:-9999px; top:0; z-index:4000; }
.skip:focus{ left:16px; top:16px; padding:.7em 1.1em; background:var(--ink-2); color:var(--sand); border-radius:8px; box-shadow:0 0 0 2px var(--aqua); font-family:var(--mono); font-size:.8rem; }

/* gradient headlines: route aqua->coral THROUGH warm sun so the midtone never greys out.
   Use background-IMAGE (not the `background` shorthand, which would reset background-clip). */
.hero-title .accent em,.hero-title .accent .w,
.cta-inner h2 em,.cta-inner h2 em .w{ background-image:linear-gradient(115deg,var(--aqua) 0%,var(--sun) 46%,var(--coral) 100%); }
/* visible fallback if background-clip:text is unsupported/stripped */
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .hero-title .accent em,.hero-title .accent .w,.proof-metric,
  .cta-inner h2 em,.cta-inner h2 em .w{ color:var(--aqua); -webkit-text-fill-color:var(--aqua); }
}

/* coral discipline - demote structural coral to teal; keep coral for hero accent, pulse, quote, CTA */
.marquee-track i{ color:var(--aqua-deep); }
.process-line::before{ background:var(--aqua-deep); }
.phase::after{ background:var(--aqua-deep); }

/* GSAP owns these transforms - don't double-ease via CSS transition; don't pin will-change forever */
.card{ transition:border-color .4s var(--ease),box-shadow .4s var(--ease); }
.btn{ transition:background .3s,color .3s,border-color .3s,box-shadow .3s; will-change:auto; }
.w{ will-change:auto; }

/* proof cards: match the capability card hover language */
.proof{ position:relative; overflow:hidden; }
.proof::before{ content:""; position:absolute; inset:0; border-radius:var(--r); padding:1px; background:linear-gradient(135deg,var(--aqua),transparent 40%,transparent 72%,var(--sun)); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; transition:opacity .4s; }
.proof:hover::before{ opacity:1; }
.proof:hover{ box-shadow:0 30px 60px -30px rgba(0,0,0,.6); }

/* stats: more stature, stronger dividers, less void */
.stats{ padding-block:clamp(48px,8vw,90px); }
.stats-inner{ padding:clamp(48px,6vw,64px) clamp(24px,3vw,52px); }
.stat{ border-left:1px solid rgba(243,234,215,.22); }
.stat-num{ font-size:clamp(2.8rem,5vw,4.2rem); }

/* glass: lighter blur, opaque fallback where backdrop-filter is unavailable */
.glass{ backdrop-filter:blur(12px) saturate(122%); -webkit-backdrop-filter:blur(12px) saturate(122%); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :root{ --glass:rgba(7,20,27,.92); --glass-2:rgba(5,15,21,.9); }
  .nav.scrolled{ background:rgba(5,15,21,.94); }
  .marquee{ background:rgba(8,23,31,.9); }
}

/* full-screen fallbacks for old engines without svh */
.process-pin{ min-height:100vh; min-height:100svh; }
.hero{ min-height:94vh; min-height:94svh; padding-top:118px; padding-bottom:62px; }
.hero-title{ font-size:clamp(3rem,8.3vw,7.8rem); margin-bottom:1.35rem; }
.hero-cta{ margin-top:2rem; }
.hero-meta{ margin-top:1.9rem; }

/* CTA surface-breach: flip copy to ink + adapt nav so the climax stays legible on daylight */
.cta-sub,.cta-fine,.cta-inner h2{ transition:color .6s ease; }
body.breached .cta-inner h2{ color:var(--ink-2); text-shadow:none; }
body.breached .cta-sub,body.breached .cta-fine{ color:rgba(8,23,31,.82); }
body.breached .cta-inner h2 em,body.breached .cta-inner h2 em .w{ background:linear-gradient(115deg,#0c4a3f,#b23f1f); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
body.breached .nav.scrolled{ background:rgba(243,234,215,.6); border-bottom-color:rgba(5,15,21,.2); }
body.breached .nav.scrolled .nav-links a,body.breached .nav.scrolled .brand-name{ color:var(--ink-2); }
body.breached .nav .nav-links a,
body.breached .nav .btn-sm,
body.breached .nav .brand-name{ color:var(--ink-2); text-shadow:0 1px 14px rgba(238,244,244,.65); }
body.breached .nav .btn-sm{ border-color:rgba(5,15,21,.18); background:rgba(238,244,244,.38); }
body.breached .nav .nav-links a::after{ background:#0c4a3f; }
body.breached .nav-toggle span{ background:var(--ink-2); }
/* breach: next-steps strip + footer become a light-theme (dark ink on the daylight surface) */
.cta-next li,.footer-tag,.footer-bottom a,.copy{ transition:color .6s ease,border-color .6s ease; }
body.breached .cta-next li{ color:var(--ink-2); }
body.breached .cta-next span{ color:#0c4a3f; border-color:rgba(5,15,21,.28); }
body.breached .footer{ border-top-color:rgba(5,15,21,.16); }
body.breached .footer-top{ border-bottom-color:rgba(5,15,21,.1); }
body.breached .footer-tag{ color:var(--ink-2); }
body.breached .footer .brand-name{ color:var(--ink-2); }
body.breached .footer-bottom a{ color:rgba(8,23,31,.82); }
body.breached .footer-bottom a:hover{ color:#042019; }
body.breached .copy{ color:rgba(8,23,31,.62); }
body.breached .rail a{ color:rgba(8,23,31,.72); text-shadow:0 1px 8px rgba(238,244,244,.8); }
body.breached .rail a.on{ color:#0c4a3f; text-shadow:0 1px 8px rgba(238,244,244,.9); }
body.breached .hud{ text-shadow:0 1px 8px rgba(238,244,244,.8); }
body.breached .hud-depth{ color:rgba(8,23,31,.72); }
body.breached .hud-depth b{ color:#0c4a3f; text-shadow:0 1px 8px rgba(238,244,244,.9); }
body.breached .hud-tele{ color:rgba(8,23,31,.62); }
body.breached .hud-tele b{ color:rgba(8,23,31,.82); }

/* mobile-nav breakpoint raised to 900px; safe-area + scroll + a11y visibility toggle */
.nav-cta{ display:none; }
.nav-foot{ display:none; }
@media (max-width:900px){
  /* keep brand + close button painted ABOVE the sheet */
  .brand{ position:relative; z-index:102; }
  .nav-toggle{ display:flex; position:relative; z-index:102; }
  .nav .btn-sm{ display:none; }
  .nav{ padding-left:max(var(--pad),env(safe-area-inset-left)); padding-right:max(var(--pad),env(safe-area-inset-right)); }

  /* full-screen SOLID sheet - no transparency / backdrop-filter dependence (fixes iOS bleed-through) */
  .nav-links{ position:fixed; inset:0; z-index:101;
    display:flex; flex-direction:column; align-items:flex-start; gap:2px;
    background:#06151d;
    padding:max(108px,calc(env(safe-area-inset-top) + 86px)) max(var(--pad),env(safe-area-inset-left)) max(34px,env(safe-area-inset-bottom)) max(var(--pad),env(safe-area-inset-right));
    transform:translateY(-100%); opacity:0; visibility:hidden;
    transition:transform .5s var(--ease), opacity .4s var(--ease), visibility .5s;
    overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .nav-links.open{ transform:translateY(0); opacity:1; visibility:visible; }
  .nav-links a{ font-size:1.85rem; line-height:1.25; font-family:var(--serif); font-weight:600; color:var(--sand); padding:11px 0; opacity:0; transform:translateY(12px); }
  .nav-links.open a{ opacity:1; transform:none; transition:opacity .4s var(--ease), transform .5s var(--ease); }
  .nav-links.open a:nth-child(1){ transition-delay:.08s; } .nav-links.open a:nth-child(2){ transition-delay:.13s; }
  .nav-links.open a:nth-child(3){ transition-delay:.18s; } .nav-links.open a:nth-child(4){ transition-delay:.23s; }
  .nav-links.open a:nth-child(5){ transition-delay:.28s; }
  .nav-links a::after{ display:none; }
  .nav-links .nav-cta{
    display:inline-flex; align-items:center; justify-content:center; gap:.55em;
    width:min(100%,240px); min-height:50px; margin-top:24px; padding:.9rem 1.25rem;
    align-self:flex-start; font-family:var(--sans); font-size:1rem; line-height:1;
    font-weight:700; color:#042019; white-space:nowrap;
  }
  .nav-links.open .nav-cta{ transition-delay:.33s; }
  .nav-foot{ display:block; margin-top:auto; padding-top:30px; font-family:var(--mono); font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--sand-faint); }
  .nav-foot b{ color:var(--aqua); font-weight:500; }
  body.nav-open{ overflow:hidden; }
  /* FIX: the scrolled nav's backdrop-filter creates a containing block, which makes the
     fixed full-screen menu anchor to the nav bar instead of the viewport (the menu collapses
     into the top bar when opened while scrolled down). Drop the filter while the menu is open. */
  body.nav-open .nav{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
}

/* coarse / mobile: cheaper compositing + bigger glass alpha to keep contrast with less blur */
@media (pointer:coarse){
  :root{ --glass:rgba(7,20,27,.74); --glass-2:rgba(5,15,21,.7); }
  .glass{ backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); }
  .marquee{ backdrop-filter:none; -webkit-backdrop-filter:none; }
}

@media (max-width:680px){
  .hero{ padding-top:110px; }
  .hero-title{ font-size:clamp(2rem,10vw,3.2rem); line-height:.98; }
  .footer-bottom a{ padding:10px 0; display:inline-block; }
  .footer-bottom nav{ gap:20px 24px; flex-wrap:wrap; }
  .stat{ border-left:0; padding:0; }
  .stats-inner{ grid-template-columns:1fr; }
  .stat-num{ font-size:clamp(2.4rem,12vw,3.3rem); }
  .fit-list span{ min-height:78px; }
  .marquee-track span{ font-size:1.1rem; padding:0 .8rem; }
}

/* ============================================================
   REFINEMENT v2 (post copy/conversion critique)
   ============================================================ */
/* Principles band - replaces the faux-metric stats band. Statements, not numbers. */
.principles .stats-inner{ align-items:start; }
.stat-k{ font-family:var(--serif); font-weight:600; font-size:clamp(1.22rem,2vw,1.55rem); line-height:1.12; letter-spacing:-.01em; color:var(--sand); }
.principles .stat-label{ margin-top:.65rem; color:var(--sand-dim); }
@media (max-width:680px){ .principles .stat{ padding:0 0 6px; } }

/* 8 capability cards → clean 4×2 on desktop (falls to 2-col / 1-col via existing rules) */
@media (min-width:1025px){ .cards-8{ grid-template-columns:repeat(4,1fr); } }

/* Use-case cards - category as a quiet mono eyebrow, not a giant faux-metric */
.proof-eyebrow{ font-family:var(--mono); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--aqua); margin-bottom:.5rem; }
.proof h3{ margin-top:0; }

/* Founders section */
.founders-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.founder{ padding:30px 30px 26px; }
.founder-top{ display:flex; align-items:center; gap:18px; margin-bottom:18px; }
.founder-avatar{ flex:none; width:64px; height:64px; border-radius:50%; display:grid; place-items:center; font-family:var(--serif); font-weight:600; font-size:1.3rem; color:#042019; background:linear-gradient(135deg,var(--aqua),var(--sun)); letter-spacing:.02em; }
.founder-photo{ flex:none; width:64px; height:64px; border-radius:50%; object-fit:cover; border:1px solid var(--line); }
.founder h3{ font-family:var(--serif); font-weight:600; font-size:1.3rem; letter-spacing:-.01em; }
.founder h3 .pe{ color:var(--aqua); font-weight:500; }
.founder-role{ font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--aqua); margin-top:.35rem; }
.founder-bio{ color:var(--sand-dim); font-size:.98rem; line-height:1.62; }
.founder-link{ display:inline-flex; align-items:center; gap:.4em; margin-top:1.2rem; font-family:var(--mono); font-size:.78rem; letter-spacing:.06em; color:var(--aqua); text-decoration:none; }
.founder-link:hover{ text-decoration:underline; }
@media (max-width:760px){ .founders-grid{ grid-template-columns:1fr; } }

/* What-happens-next strip in the contact section */
.cta-next{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 26px; margin:2.1rem auto .2rem; max-width:760px; }
.cta-next li{ display:flex; align-items:center; gap:.6em; font-size:.92rem; color:var(--sand-dim); }
.cta-next span{ font-family:var(--mono); font-size:.72rem; color:var(--aqua); border:1px solid var(--line); border-radius:100px; padding:.25em .6em; }
@media (max-width:680px){ .cta-next{ flex-direction:column; align-items:flex-start; text-align:left; gap:12px; } }

/* Real v3 brand mark in nav + footer; swap reversed(dark)→primary(light) on the breach */
.brand-logo{ height:66px; width:auto; display:block; flex:none; transition:height .4s var(--ease),filter .4s var(--ease); filter:drop-shadow(0 2px 14px rgba(3,16,22,.45)); }
.nav.scrolled .brand-logo{ height:54px; }
.footer .brand-logo{ height:60px; }
.brand-logo--pri{ display:none; }
body.breached .brand-logo--rev{ display:none; }
body.breached .brand-logo--pri{ display:block; }
/* tighten footer top gap so the surfaced section doesn't feel empty */
.footer{ padding-top:48px; }

/* ============================================================
   BRAND V3 ALIGNMENT + FANCIER (enhancement workshop) - 2026-06-16
   INTERACTION BUDGET: tilt on .card only; sheen on .glass only; no new effect categories.
   Headroom below the gaud ceiling is the premium signal.
   ============================================================ */
em{ font-style:normal; }            /* brand is a clean Manrope sans - accents use color, not slant */
.footer-tag{ font-style:normal; }
/* Manrope display weights (no serif now) */
.hero-title,.cta-inner h2{ font-weight:700; letter-spacing:-.03em; }
.section-title,.quote-band blockquote{ font-weight:600; letter-spacing:-.025em; }
.card h3,.phase h3,.founder h3,.proof h3,.fit-label,.stat-k{ font-weight:600; }

/* Flagship: cursor-tracked specular sheen on glass (seafoam-tinted, screen-blended, invisible until lit) */
.glass{ position:relative; }
.glass::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:0; z-index:0; mix-blend-mode:screen; transition:opacity .4s var(--ease); background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%), rgba(65,208,196,.10), rgba(65,208,196,0) 60%); }
.glass.lit::after{ opacity:1; }
.card>*,.proof>*,.founder>*,.stats-inner>*{ position:relative; z-index:1; }

/* Nav depth-progress thread (horizontal twin of the depth HUD; mobile's only descent cue) */
.nav::after{ content:""; position:absolute; left:0; bottom:-1px; height:1.5px; width:100%; transform:scaleX(var(--p,0)); transform-origin:left; background:linear-gradient(90deg,var(--coral),var(--aqua) 45%,var(--aqua-deep)); opacity:0; transition:opacity .5s var(--ease); }
.nav.scrolled::after{ opacity:.9; }
body.breached .nav::after{ opacity:.8; }

/* Top-nav active-section sync (reuses the hover underline) */
.nav-links a.is-active{ color:var(--sand); }
.nav-links a.is-active::after{ width:100%; }

/* Crisp press for non-magnetic buttons (magnetic ones get a GSAP press) */
.btn:not([data-magnetic]):active{ transform:scale(.97); filter:brightness(.96); transition-duration:.08s; }

/* Process: un-pinned + all phases readable on the living water (local scrim, no global darken) */
.process-pin{ min-height:auto; padding:clamp(64px,9vw,120px) 0; gap:28px; position:relative; }
.process-pin::before{ content:""; position:absolute; inset:-30px -4vw; z-index:0; pointer-events:none; border-radius:28px; background:radial-gradient(110% 82% at 32% 48%, rgba(5,20,28,.58), rgba(5,20,28,.14) 60%, transparent 80%); }
.process-pin>*{ position:relative; z-index:1; }
.phase h3{ text-shadow:0 2px 18px rgba(2,8,12,.6); }
.phase p{ text-shadow:0 1px 14px rgba(2,8,12,.66); }
.phase-no{ text-shadow:0 1px 12px rgba(2,8,12,.5); }

/* breach: keep the (now laptop-visible) depth HUD legible on the daylight surface */
body.breached .hud-depth{ color:rgba(8,23,31,.72); }
body.breached .hud-depth b{ color:#0c4a3f; }
body.breached .hud-depth span{ color:rgba(8,23,31,.5); }
body.breached .hud-tele{ color:rgba(8,23,31,.6); }
body.breached .hud-tele b,body.breached .hud-tele b.ok{ color:#0c4a3f; }
body.breached .hud-rail{ background:rgba(5,21,28,.18); }

/* ============================================================
   FANCIER PASS - depth-reactive instruments + tactile feedback.
   All GPU-cheap (transform/opacity/filter); seafoam-only accents
   (gold stays the sun); degrades fully under reduced motion.
   ============================================================ */
/* hero: sunlight sweep across the accent words */
@keyframes sunSweep{ 0%{ background-position:0% 50%; } 100%{ background-position:200% 50%; } }
.hero-title.lit-sweep .accent .w{ animation:sunSweep 7s var(--ease) infinite alternate; }

/* hero: cinematic eyebrow rule-draw on the boot handoff */
@property --rule{ syntax:'<length>'; inherits:true; initial-value:0px; }
#hero .eyebrow::before{ content:""; display:inline-block; width:var(--rule,0px); height:1px; background:var(--aqua-deep); vertical-align:middle; margin-right:.8em; transition:width .7s var(--ease); }
#hero .eyebrow.drawn{ --rule:30px; }

/* HUD: sonar ping on section-cross */
.hud-depth{ position:relative; }
.hud-ping{ position:absolute; left:0; top:50%; width:12px; height:12px; margin:0; border:1.5px solid var(--aqua); border-radius:50%; transform:translate(-4px,-50%) scale(.25); opacity:0; pointer-events:none; }
@keyframes hudPing{ 0%{ transform:translate(-4px,-50%) scale(.25); opacity:.6; } 100%{ transform:translate(-4px,-50%) scale(3); opacity:0; } }
.hud-ping.go{ animation:hudPing .9s var(--ease); }

/* HUD: velocity-reactive rail edge + jolt synced to the pressure pulse */
.hud-rail{ position:relative; }
.rail-edge{ position:absolute; left:0; right:0; top:0; height:2px; transform:translateY(-50%); background:var(--aqua); opacity:0; box-shadow:0 0 8px rgba(65,208,196,.6); pointer-events:none; will-change:top,opacity; }
@keyframes railCharge{ 0%{ filter:brightness(1); } 28%{ filter:brightness(1.6); } 100%{ filter:brightness(1); } }
.hud.jolt .hud-rail{ animation:railCharge .7s var(--ease); }

/* shared sonar ripple - clipboard flourish + magnetic primary-button press */
.btn{ position:relative; overflow:hidden; }
@keyframes sonar{ from{ transform:translate(-50%,-50%) scale(0); opacity:.5; } to{ transform:translate(-50%,-50%) scale(1); opacity:0; } }
.btn .ripple{ position:absolute; left:var(--rx,50%); top:var(--ry,50%); width:max(180px,140%); aspect-ratio:1; border-radius:50%; pointer-events:none; background:radial-gradient(circle,rgba(65,208,196,.45),rgba(65,208,196,0) 60%); animation:sonar .6s var(--ease) forwards; }
.btn.copied .arrow{ display:none; }

/* thermocline seams: a caustic line draws in once on scroll-enter */
.fit-inner, .quote-band{ position:relative; }
.fit-inner::after, .quote-band::after{ content:""; position:absolute; left:0; right:0; top:0; height:1px; background:linear-gradient(90deg,transparent,var(--aqua-deep) 20%,var(--aqua) 50%,var(--aqua-deep) 80%,transparent); opacity:0; transform:scaleX(.2); transform-origin:center; filter:blur(.4px); pointer-events:none; }
@keyframes seamDraw{ to{ transform:scaleX(1); opacity:.5; } }
.fit-inner.seam-in::after, .quote-band.seam-in::after{ animation:seamDraw .7s var(--ease) forwards; }

/* CSS-only hover/affordance polish */
.card h3{ transition:transform .4s var(--ease); }
.card:hover h3{ transform:translateY(-2px); }
.card-no{ transition:letter-spacing .4s var(--ease); }
.card:hover .card-no{ letter-spacing:.16em; }
.card-no::after{ content:""; display:inline-block; width:0; height:1px; margin-left:.5em; vertical-align:middle; background:var(--aqua); transition:width .4s var(--ease); }
.card:hover .card-no::after{ width:18px; }
.footer-bottom a, .founder-link{ position:relative; }
.footer-bottom a::after, .founder-link::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:1.5px; background:var(--aqua); transform:scaleX(0); transform-origin:right; transition:transform .34s var(--ease); }
.footer-bottom a:hover::after, .footer-bottom a:focus-visible::after, .founder-link:hover::after, .founder-link:focus-visible::after{ transform:scaleX(1); transform-origin:left; }
.founder-link:hover{ text-decoration:none; }
.founder-link .arrow{ display:inline-block; transition:transform .3s var(--ease); }
.founder-link:hover .arrow{ transform:translate(2px,-2px); }
.btn-primary:active .arrow{ transform:translateX(7px); opacity:.6; }
.scroll-cue:hover span:first-child{ color:var(--sand); }
body.breached .footer-bottom a::after{ background:var(--aqua-deep); }

/* reduced-motion / no-lib safety for the fancier pass */
@media (prefers-reduced-motion:reduce){
  .hero-title.lit-sweep .accent .w{ animation:none; }
  #hero .eyebrow::before{ width:30px; }
  .hud-ping, .rail-edge{ display:none; }
  .fit-inner::after, .quote-band::after{ opacity:.3; transform:none; }
}

/* ============================================================
   MULTI-PAGE - inner-page headers, cross-page nav state, CTA strip
   ============================================================ */
/* inner-page hero header (Capabilities / Process / Work / About / Contact) */
.page-hero{ max-width:var(--maxw); margin:0 auto; padding:clamp(150px,20vh,230px) var(--pad) clamp(36px,6vw,64px); }
.page-hero{ position:relative; }
.page-hero .kicker{ margin-bottom:1.1rem; }
.page-hero h1{ font-family:var(--serif); font-weight:500; font-size:clamp(2.6rem,7vw,5.6rem); line-height:.98; letter-spacing:-.022em; margin-bottom:1.4rem; }
.page-hero h1 em{ font-style:normal; color:var(--aqua); }
.page-hero .lede{ font-size:clamp(1.06rem,1.7vw,1.32rem); color:var(--sand-dim); max-width:62ch; line-height:1.62; text-shadow:0 2px 30px rgba(2,8,12,.5); }
.page-hero .scroll-line{ display:inline-block; width:64px; height:1px; background:linear-gradient(90deg,var(--aqua),transparent); margin-top:2.2rem; }

/* current-page indicators */
.nav-links a[aria-current="page"]{ color:var(--sand); }
.nav-links a[aria-current="page"]::after{ width:100%; }
.footer-bottom a[aria-current="page"]{ color:var(--aqua); }

/* bottom CTA strip shared across inner pages */
.cta-strip{ position:relative; max-width:var(--maxw); margin:0 auto; padding:clamp(56px,8vw,104px) var(--pad) clamp(80px,11vw,130px); text-align:center; }
.cta-strip::before{ content:""; position:absolute; left:var(--pad); right:var(--pad); top:0; height:1px; background:linear-gradient(90deg,transparent,var(--aqua-deep) 50%,transparent); opacity:.4; }
.cta-strip .kicker{ justify-content:center; margin-bottom:1rem; }
.cta-strip h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.9rem,4.4vw,3.2rem); line-height:1.02; letter-spacing:-.015em; margin-bottom:1.1rem; }
.cta-strip h2 em{ font-style:normal; color:var(--aqua); }
.cta-strip p{ color:var(--sand-dim); max-width:50ch; margin:0 auto 2rem; line-height:1.6; }
.cta-strip .cta-row{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* featured-capabilities grid on home (4 across on desktop) + "explore all" link */
@media (min-width:1025px){ .cards-4{ grid-template-columns:repeat(4,1fr); } }
.section-more{ margin-top:clamp(28px,4vw,46px); }

/* standalone contact page: surfacing moment centered in the viewport, clear of the fixed nav */
.cta-page{ min-height:90vh; display:flex; align-items:center; }
.cta-page .cta-inner{ padding-top:clamp(116px,16vh,170px); padding-bottom:clamp(60px,9vw,110px); }

@media (max-width:1180px){
  .hero-console{ position:relative; right:auto; bottom:auto; width:100%; max-width:620px; margin:30px 0 0; }
  .hero{ justify-content:center; }
}