/* ==========================================================================
   RedRiver One — tokens (mirrors redriver.one/styleguide v1.1)
   ========================================================================== */
:root{
  --color-heat-50:#fff5ef; --color-heat-80:#fa8a5b; --color-heat-100:#f26625;
  --color-heat-120:#eb3424; --color-heat-dark:#b53d0f;
  --color-accent-black:#0a0a0a; --color-accent-black-soft:#141414;
  --color-background-base:#fdfdfd; --color-background-darker:#f9f9f9; --color-background-lighter:#fff;
  --color-border-faint:#ededed; --color-border-muted:#dbdbdb; --color-border-strong:#c8c8c8; --color-border-dark:#1f1f1f;
  --color-green-100:#42c366; --color-blue-100:#2a6dfb; --color-purple-100:#9061ff; --color-yellow-100:#ecb730;
  --black-alpha-4:#0a0a0a0a; --black-alpha-7:#0a0a0a12; --black-alpha-16:#0a0a0a29; --black-alpha-32:#0a0a0a52;
  --black-alpha-48:#0a0a0a9e; --black-alpha-56:#0a0a0ab3; --black-alpha-64:#0a0a0ac2; --black-alpha-72:#0a0a0ad1;
  --white-alpha-4:#ffffff0a; --white-alpha-7:#ffffff12; --white-alpha-16:#ffffff29; --white-alpha-32:#ffffff52;
  --white-alpha-48:#ffffff7a; --white-alpha-64:#ffffffa3; --white-alpha-72:#ffffffb8;
  --radius-6:6px; --radius-8:8px; --radius-10:10px; --radius-12:12px; --radius-16:16px; --radius-20:20px;
  --font-display:"Inter Tight","Inter",ui-sans-serif,system-ui,sans-serif;
  --font-sans:"Inter",ui-sans-serif,system-ui,-apple-system,sans-serif;
  --font-serif:"Instrument Serif","Cormorant Garamond",Georgia,serif;
  --font-mono:"JetBrains Mono","Geist Mono",ui-monospace,"SF Mono",monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --nav-h:68px;
}
@property --hf-angle{syntax:"<angle>";inherits:false;initial-value:0deg}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--color-background-base);color:var(--color-accent-black);font-family:var(--font-sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
section[id]{scroll-margin-top:90px}
::selection{background:var(--color-heat-100);color:#fff}
:focus-visible{outline:2px solid var(--color-heat-100);outline-offset:2px;border-radius:4px}

/* ---------- layout ---------- */
.cmw-container{width:100%;max-width:1240px;margin-inline:auto;padding-inline:1rem;position:relative}
@media (min-width:1024px){.cmw-container{padding-inline:3.5rem}}
.section-pad{padding-block:clamp(4rem,9vw,8rem)}

/* ---------- type ---------- */
.text-title-h1{font-family:var(--font-display);letter-spacing:-.04em;font-size:clamp(2.5rem,6.4vw,5.4rem);font-weight:600;line-height:.98;margin:0}
.text-title-h2{font-family:var(--font-display);letter-spacing:-.035em;font-size:clamp(2rem,4.4vw,3.6rem);font-weight:600;line-height:1.02;margin:0}
.text-title-h3{font-family:var(--font-display);letter-spacing:-.03em;font-size:clamp(1.5rem,2.4vw,2rem);font-weight:600;line-height:1.1;margin:0}
.text-title-h4{font-family:var(--font-display);letter-spacing:-.02em;font-size:1.2rem;font-weight:600;line-height:1.25;margin:0}
.text-body-x-large{color:var(--color-accent-black-soft);font-size:clamp(1.05rem,.98rem + .5vw,1.22rem);line-height:1.6}
.text-body-large{font-size:1.02rem;line-height:1.65;color:var(--black-alpha-72)}
.text-body-medium{font-size:.93rem;line-height:1.6;color:var(--black-alpha-72)}
.text-body-small{font-size:.84rem;line-height:1.55;color:var(--black-alpha-64)}
.text-mono-small{font-family:var(--font-mono);letter-spacing:-.005em;font-size:.78rem}
.text-mono-x-small{font-family:var(--font-mono);letter-spacing:.04em;font-size:.7rem;text-transform:uppercase}
.serif-italic{font-family:var(--font-serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.text-heat{color:var(--color-heat-100)}
.text-heat-soft{color:var(--color-heat-80)}
.muted{color:var(--black-alpha-56)}
.outline-text{-webkit-text-stroke:1.5px currentColor;color:transparent}

/* ---------- eyebrow / chips ---------- */
.fc-eyebrow{font-family:var(--font-mono);color:var(--color-heat-100);display:inline-flex;align-items:center;gap:.6rem;font-size:.74rem;letter-spacing:.02em;text-transform:uppercase}
.fc-eyebrow::before{content:"";background:currentColor;width:1.4rem;height:1px}
.fc-chip{font-family:var(--font-mono);color:var(--black-alpha-72);background:var(--black-alpha-4);border:1px solid var(--color-border-faint);border-radius:var(--radius-8);display:inline-flex;align-items:center;gap:.45rem;padding:.34rem .7rem;font-size:.72rem;line-height:1.3}
.fc-chip-heat{color:var(--color-heat-100);background:var(--color-heat-50);border-color:#f266252e}
.fc-chip-dark{color:var(--white-alpha-72);background:var(--white-alpha-4);border-color:var(--white-alpha-16)}
.fc-chip-dot{background:currentColor;border-radius:99px;width:6px;height:6px;flex-shrink:0}
.fc-chip-dot.pulse{animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 #f2662566}50%{box-shadow:0 0 0 5px #f2662500}}

/* ---------- buttons ---------- */
.fc-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:44px;padding:0 1.15rem;border-radius:var(--radius-10);border:1px solid transparent;font-size:.87rem;font-weight:500;letter-spacing:-.005em;white-space:nowrap;transition:transform .1s,background .18s,color .18s,border-color .18s,box-shadow .18s}
.fc-btn:active{transform:scale(.98)}
.fc-btn svg{width:15px;height:15px;transition:transform .25s var(--ease)}
.fc-btn:hover svg{transform:translate(2px,-2px)}
.fc-btn .arrow-r{transition:transform .25s var(--ease)}
.fc-btn:hover .arrow-r{transform:translateX(3px)}
.fc-btn-primary{background:var(--color-accent-black);color:#fff;box-shadow:inset 0 1px #ffffff14,0 1px 2px #0a0a0a1f}
.fc-btn-primary:hover{background:#1a1a1a}
.fc-btn-heat{background:var(--color-heat-100);color:#fff;box-shadow:inset 0 1px #ffffff2e,0 1px 2px #f266254d,0 4px 16px #f2662533}
.fc-btn-heat:hover{background:var(--color-heat-120)}
.fc-btn-ghost{color:var(--color-accent-black);border-color:var(--color-border-muted);background:transparent}
.fc-btn-ghost:hover{background:var(--black-alpha-4);border-color:var(--color-border-strong)}
.fc-btn-ghost-on-dark{color:#fff;border-color:var(--white-alpha-16);background:transparent}
.fc-btn-ghost-on-dark:hover{background:var(--white-alpha-7);border-color:var(--white-alpha-32)}
.fc-btn-lg{height:52px;padding:0 1.5rem;border-radius:var(--radius-12);font-size:.93rem}
.link-arrow{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;color:var(--color-accent-black)}
.link-arrow span{transition:transform .25s var(--ease)}
.link-arrow:hover span{transform:translateX(4px)}
.link-arrow:hover{color:var(--color-heat-100)}

/* ---------- reveal & split ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .08em .2em;margin:0 -.08em -.2em}
.split .w > span{display:inline-block;transform:translateY(105%);transition:transform .9s var(--ease);transition-delay:calc(var(--i) * 45ms)}
.split.in .w > span{transform:none}

/* ==========================================================================
   NAV
   ========================================================================== */
.progress{position:fixed;top:0;left:0;height:2px;width:100%;background:var(--color-heat-100);transform-origin:0 50%;transform:scaleX(0);z-index:60}
.nav{position:fixed;inset:0 0 auto 0;height:var(--nav-h);z-index:50;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
.nav.scrolled{background:#fdfdfdd9;backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border-bottom-color:var(--color-border-faint)}
.nav .cmw-container{height:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.wordmark{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-display);font-weight:700;font-size:1.12rem;letter-spacing:-.035em}
.wordmark .mark{width:30px;height:30px;flex-shrink:0}
.wordmark .mark img{width:100%;height:100%;display:block}
.wordmark .one{font-family:var(--font-serif);font-style:italic;font-weight:400;color:var(--color-heat-100);font-size:1.28rem;margin-left:.1rem}
.nav-links{display:flex;gap:.15rem}
.fc-nav-link{color:var(--black-alpha-72);border-radius:var(--radius-8);display:inline-flex;align-items:center;padding:.5rem .85rem;font-size:.86rem;font-weight:500;transition:background .18s,color .18s}
.fc-nav-link:hover{background:var(--black-alpha-4);color:var(--color-accent-black)}
.fc-nav-link.is-active{color:var(--color-accent-black);background:var(--black-alpha-4)}
.nav-cta{display:flex;align-items:center;gap:.5rem}
.menu-btn{display:none;width:42px;height:42px;border-radius:10px;border:1px solid var(--color-border-muted);background:#fff;align-items:center;justify-content:center}
.menu-btn span{display:block;width:16px;height:1.5px;background:var(--color-accent-black);position:relative;transition:transform .3s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--color-accent-black);transition:transform .3s,top .3s}
.menu-btn span::before{top:-5px}.menu-btn span::after{top:5px}
.nav.open .menu-btn span{background:transparent}
.nav.open .menu-btn span::before{top:0;transform:rotate(45deg)}
.nav.open .menu-btn span::after{top:0;transform:rotate(-45deg)}
.mobile-menu{display:none}
@media (max-width:1023px){
  .nav-links{display:none}
  .nav-cta .fc-btn{display:none}
  .menu-btn{display:inline-flex}
  .mobile-menu{display:block;position:fixed;inset:var(--nav-h) 0 auto 0;background:#fdfdfdf5;backdrop-filter:blur(14px);border-bottom:1px solid var(--color-border-faint);padding:1rem;transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s var(--ease);z-index:49}
  .nav.open + .mobile-menu{opacity:1;transform:none;pointer-events:auto}
  .mobile-menu a.fc-nav-link{display:flex;padding:.85rem .6rem;font-size:1rem;border-bottom:1px solid var(--color-border-faint);border-radius:0}
  .mobile-menu .fc-btn{width:100%;margin-top:1rem}
}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{position:relative;padding-top:calc(var(--nav-h) + clamp(1.25rem,3vw,2.25rem));padding-bottom:clamp(3rem,6vw,5rem);overflow:hidden}
.hero-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.hero-bg .grid{position:absolute;inset:0;background-image:linear-gradient(var(--black-alpha-4) 1px,transparent 1px),linear-gradient(90deg,var(--black-alpha-4) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 75% 65% at 50% 35%,#000 25%,transparent 78%);-webkit-mask-image:radial-gradient(ellipse 75% 65% at 50% 35%,#000 25%,transparent 78%)}
.hero-bg .glow{position:absolute;width:780px;height:780px;right:-220px;top:-260px;border-radius:50%;background:radial-gradient(circle,#f2662524 0%,#fa8a5b10 35%,transparent 65%);filter:blur(10px)}
.hero .cmw-container{z-index:1}
.hero-head{text-align:center;max-width:52rem;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.hero-head .fc-chip{margin-bottom:1.35rem;font-size:.66rem}
.hero-title{font-family:var(--font-display);font-weight:600;letter-spacing:-.045em;line-height:.98;font-size:clamp(2.1rem,4.6vw,3.7rem);margin:0}
.hero-sub{display:block;font-family:var(--font-serif);font-style:italic;font-weight:400;letter-spacing:-.02em;color:var(--color-heat-100);font-size:clamp(1.7rem,3.7vw,3rem);line-height:1.08;margin-top:.25rem}
.hero-head .lead{margin:1.25rem auto 1.75rem;max-width:36rem;font-size:clamp(.95rem,.9rem + .25vw,1.05rem);line-height:1.6;color:var(--black-alpha-72)}
.hero-head .lead strong{color:var(--color-accent-black);font-weight:600}
.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}
.fc-btn-md{height:46px;padding:0 1.25rem;border-radius:var(--radius-12);font-size:.88rem}

.hero-stage{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:1.5rem;align-items:stretch;margin-top:clamp(2.5rem,5vw,4rem);position:relative}
.hero-stage > *{min-width:0}
.hero-stage .plus{position:absolute;width:13px;height:13px;color:var(--black-alpha-32);pointer-events:none}
.hero-stage .plus::before,.hero-stage .plus::after{content:"";position:absolute;background:currentColor}
.hero-stage .plus::before{left:6px;top:0;width:1px;height:13px}
.hero-stage .plus::after{top:6px;left:0;height:1px;width:13px}
.hero-stage .p1{left:-22px;top:-22px}.hero-stage .p2{right:-22px;top:-22px}.hero-stage .p3{left:-22px;bottom:-22px}.hero-stage .p4{right:-22px;bottom:-22px}

/* hero-frame (styleguide signature) */
.hero-frame{border-radius:calc(var(--radius-16) + 4px);padding:2px;position:relative;
  background:conic-gradient(from var(--hf-angle), var(--color-heat-100) 0deg, var(--color-heat-80) 90deg, transparent 180deg, var(--color-heat-120) 270deg, var(--color-heat-100) 360deg);
  animation:hf-spin 6s linear infinite;box-shadow:0 14px 40px -18px #f2662559,0 40px 100px -40px #0f0f0f40;transition:transform .5s var(--ease),box-shadow .6s var(--ease)}
.hero-frame:hover{transform:translateY(-3px);box-shadow:0 22px 60px -20px #f2662580,0 40px 100px -30px #0f0f0f47}
@keyframes hf-spin{to{--hf-angle:360deg}}
.hero-frame-inner{border-radius:calc(var(--radius-16) + 2px);background:#fff;overflow:hidden;position:relative;height:100%}
.hero-media{position:relative;height:100%;margin:0;background:#fff;display:flex;align-items:center}
.hero-media img{width:100%;height:auto;display:block;transition:transform 1.2s var(--ease)}
.hero-frame:hover .hero-media img{transform:scale(1.015)}
.hero-zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.hero-zoom:focus-visible{outline-offset:-5px;border-radius:var(--radius-16)}
.zoom-hint{position:absolute;right:14px;top:14px;display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .7rem;border-radius:8px;background:#ffffffe6;backdrop-filter:blur(6px);border:1px solid var(--color-border-faint);font-family:var(--font-mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;color:var(--black-alpha-72);transition:background .25s,color .25s,border-color .25s,transform .4s var(--ease)}
.zoom-hint svg{width:12px;height:12px;color:var(--color-heat-100);transition:color .25s}
.hero-zoom:hover .zoom-hint,.hero-zoom:focus-visible .zoom-hint{background:var(--color-accent-black);border-color:var(--color-accent-black);color:#fff;transform:translateY(-1px)}
.hero-zoom:hover .zoom-hint svg,.hero-zoom:focus-visible .zoom-hint svg{color:var(--color-heat-80)}
.media-tag{pointer-events:none;position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .7rem;border-radius:8px;background:#ffffffe6;backdrop-filter:blur(6px);border:1px solid var(--color-border-faint);font-family:var(--font-mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;color:var(--black-alpha-72)}

/* project console (right of the hero image) */
.console{background:#fff;border:1px solid var(--color-border-faint);border-radius:calc(var(--radius-16) + 4px);display:flex;flex-direction:column;overflow:hidden;position:relative;box-shadow:0 30px 70px -40px #0a0a0a40,0 2px 6px -2px #0a0a0a0d}
/* console wears the same animated frame as the image, half a turn out of phase */
.console-frame{animation-delay:-3s}
.console-frame > .console{height:100%;border:0;border-radius:calc(var(--radius-16) + 2px);box-shadow:none}
.console::after{content:"";position:absolute;right:-120px;top:-120px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,#f266251c,transparent 65%);pointer-events:none}
.console-head{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.1rem;border-bottom:1px solid var(--color-border-faint);background:var(--color-background-darker)}
.console-dots{display:flex;gap:6px}
.console-dots i{width:8px;height:8px;border-radius:50%;background:var(--color-border-muted)}
.console-dots i:first-child{background:var(--color-heat-100)}
.console-body{padding:1.15rem 1.2rem 1.1rem;display:flex;flex-direction:column;flex:1;position:relative;z-index:1}
.console-title{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:1.1rem}
.console-title h3{font-family:var(--font-display);font-size:1.05rem;letter-spacing:-.025em;font-weight:600;margin:.3rem 0 0;line-height:1.2}
.console-title .fc-chip{font-size:.64rem;padding:.28rem .55rem;white-space:nowrap}
.stage-rail{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-bottom:.5rem}
.stage-rail i{height:4px;border-radius:4px;background:var(--color-border-faint);position:relative;overflow:hidden}
.stage-rail i.done{background:var(--color-accent-black)}
.stage-rail i.now{background:var(--color-heat-50)}
.stage-rail i.now::after{content:"";position:absolute;inset:0;background:var(--color-heat-100);transform-origin:0 50%;animation:fill 2.8s linear forwards}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.stage-labels{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-bottom:1.1rem}
.stage-labels span{font-family:var(--font-mono);font-size:.6rem;color:var(--black-alpha-48);transition:color .3s}
.stage-labels span.on{color:var(--color-heat-100);font-weight:500}
.stage-labels span.done{color:var(--color-accent-black)}
.console-panel{border:1px solid var(--color-border-faint);border-radius:var(--radius-12);padding:.95rem 1rem;flex:1;background:linear-gradient(180deg,#fff,var(--color-background-darker))}
.console-panel .q{font-family:var(--font-mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-heat-100);display:flex;align-items:center;gap:.45rem}
.console-panel .headline{font-family:var(--font-display);font-weight:600;font-size:.95rem;letter-spacing:-.02em;margin:.4rem 0 .75rem;line-height:1.32}
.console-checks{display:grid;gap:.45rem;margin:0;padding:0;list-style:none}
.console-checks li{display:flex;align-items:center;gap:.55rem;font-size:.8rem;color:var(--black-alpha-72);opacity:0;transform:translateX(-6px);animation:rowin .5s var(--ease) forwards}
.console-checks li:nth-child(2){animation-delay:.12s}.console-checks li:nth-child(3){animation-delay:.24s}
@keyframes rowin{to{opacity:1;transform:none}}
.console-checks .tick{width:16px;height:16px;border-radius:5px;display:grid;place-items:center;background:var(--color-heat-50);color:var(--color-heat-100);flex-shrink:0}
.console-checks .tick svg{width:10px;height:10px}
.console-meta{display:grid;grid-template-columns:repeat(3,1fr);margin-top:.9rem;border:1px solid var(--color-border-faint);border-radius:var(--radius-10);overflow:hidden}
.console-meta div{padding:.6rem .7rem;border-right:1px solid var(--color-border-faint)}
.console-meta div:last-child{border-right:0}
.console-meta b{display:block;font-family:var(--font-display);font-size:1.1rem;font-weight:600;letter-spacing:-.03em;line-height:1.1}
.console-meta span{font-family:var(--font-mono);font-size:.56rem;text-transform:uppercase;letter-spacing:.04em;color:var(--black-alpha-56)}
.console-foot{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin-top:.9rem}
.avatars{display:flex}
.avatars span{width:26px;height:26px;border-radius:50%;border:2px solid #fff;margin-left:-8px;display:grid;place-items:center;font-family:var(--font-mono);font-size:.52rem;font-weight:500;color:#fff;background:var(--color-accent-black)}
.avatars span:first-child{margin-left:0;background:var(--color-heat-100)}
.avatars span:nth-child(3){background:#3a3a3a}.avatars span:nth-child(4){background:var(--color-heat-dark)}
.avatars span:nth-child(5){background:var(--color-background-darker);color:var(--black-alpha-72);box-shadow:inset 0 0 0 1px var(--color-border-muted)}

/* hero image modal — the <dialog> itself is the dimmed backdrop */
.lightbox{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:clamp(1rem,3vw,2.5rem);border:0;background:#0a0a0a00;display:none;align-items:center;justify-content:center;overflow:auto;cursor:zoom-out;transition:background .35s var(--ease),backdrop-filter .35s var(--ease)}
.lightbox[open]{display:flex}
.lightbox::backdrop{background:transparent}
.lightbox.open{background:#0a0a0ad1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.lightbox img{width:auto;height:auto;max-width:min(100%,1672px);max-height:100%;border-radius:var(--radius-16);background:#fff;box-shadow:0 40px 120px -30px #000;cursor:default;opacity:0;transform:translateY(14px) scale(.95);transition:opacity .3s var(--ease),transform .5s var(--ease)}
.lightbox.open img{opacity:1;transform:none}
.lightbox-close{position:fixed;top:clamp(.75rem,2vw,1.5rem);right:clamp(.75rem,2vw,1.5rem);z-index:1;width:44px;height:44px;border-radius:12px;border:1px solid var(--white-alpha-16);background:#141414cc;color:#fff;display:grid;place-items:center;opacity:0;transform:scale(.85);transition:opacity .3s,transform .4s var(--ease),background .2s,border-color .2s}
.lightbox-close svg{width:18px;height:18px}
.lightbox.open .lightbox-close{opacity:1;transform:none}
.lightbox-close:hover{background:var(--color-heat-100);border-color:var(--color-heat-100)}
html.modal-open{overflow:hidden}

/* lifecycle timeline under hero (active step is driven by the hero console cycle) */
.flowline{margin-top:clamp(3rem,6vw,4.5rem);display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--color-border-faint);border-radius:var(--radius-16);background:#fff;overflow:hidden;position:relative;box-shadow:0 30px 70px -50px #0a0a0a47}
.fl-rail{position:absolute;top:calc(1.25rem + 20px);left:calc(1.2rem + 21px);right:calc(100% / 6 - 1.2rem - 21px);height:2px;border-radius:2px;background:var(--color-border-faint);z-index:1;pointer-events:none;opacity:0;transition:opacity .6s .8s}
.flowline.in .fl-rail{opacity:1}
.fl-rail i{position:absolute;inset:0;border-radius:2px;background:linear-gradient(90deg,var(--color-accent-black),var(--color-heat-100));transform-origin:0 50%;transform:scaleX(0);transition:transform .9s var(--ease)}
.fl-step{position:relative;padding:1.25rem 1.2rem 1.35rem;border-right:1px solid var(--color-border-faint);display:flex;flex-direction:column;align-items:flex-start;opacity:0;transform:translateY(12px);transition:opacity .7s var(--ease) calc(var(--k) * 70ms),transform .7s var(--ease) calc(var(--k) * 70ms)}
.flowline.in .fl-step{opacity:1;transform:none}
.fl-step:last-of-type{border-right:0}
.fl-step::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--color-heat-50),#fff5ef00 88%);opacity:0;transition:opacity .5s var(--ease)}
.fl-step:hover::before{opacity:.65}
.fl-step.is-active::before{opacity:1}
.fl-step > span{position:relative}
.fl-node{z-index:2;width:42px;height:42px;border-radius:12px;background:#fff;border:1px solid var(--color-border-muted);display:grid;place-items:center;color:var(--black-alpha-56);transition:background .45s var(--ease),border-color .45s var(--ease),color .45s var(--ease),box-shadow .45s var(--ease),transform .55s var(--ease)}
.fl-node svg{width:18px;height:18px}
.fl-step.is-done .fl-node{background:var(--color-accent-black);border-color:var(--color-accent-black);color:#fff}
.fl-step.is-active .fl-node{background:var(--color-heat-100);border-color:var(--color-heat-100);color:#fff;transform:scale(1.07);box-shadow:0 0 0 5px #f266251f,0 10px 20px -10px #f26625b3}
.fl-step:hover .fl-node{transform:translateY(-2px) scale(1.07)}
.fl-num{font-family:var(--font-mono);font-size:.66rem;color:var(--black-alpha-48);margin-top:1rem;transition:color .3s}
.fl-name{font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;font-size:1.04rem;line-height:1.25;margin-top:.15rem;transition:color .3s}
.fl-q{font-size:.76rem;line-height:1.4;color:var(--black-alpha-56);margin-top:.3rem}
.fl-step.is-active .fl-num,.fl-step.is-active .fl-name,.fl-step:hover .fl-name{color:var(--color-heat-100)}
.fl-step > .fl-go{position:absolute;top:1.25rem;right:1.1rem;width:14px;height:14px;color:var(--color-heat-100);opacity:0;transform:translate(-4px,4px);transition:opacity .3s,transform .4s var(--ease)}
.fl-go svg{width:14px;height:14px}
.fl-step:hover .fl-go,.fl-step:focus-visible .fl-go{opacity:1;transform:none}
.fl-step > .fl-timer{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--color-heat-100);transform-origin:0 50%;transform:scaleX(0)}
.fl-step.is-active .fl-timer{animation:fill 2.8s linear forwards}
.flowline.paused .fl-step.is-active .fl-timer{animation:none;transform:scaleX(1)}

/* structures band — flipping headline word + tiles on one clock */
.structs{border-block:1px solid var(--color-border-faint);background:var(--color-background-darker);padding-block:clamp(2.25rem,4.5vw,3.5rem)}
.structs-grid{display:grid;grid-template-columns:minmax(0,23rem) minmax(0,1fr);gap:2rem clamp(2rem,4vw,4rem);align-items:center}
.structs-line{font-family:var(--font-display);font-weight:600;letter-spacing:-.035em;font-size:clamp(1.75rem,2.8vw,2.5rem);line-height:1.1;color:var(--color-accent-black);margin:1.1rem 0 1rem}
.structs-word{display:block;position:relative;height:1.3em;overflow:hidden;font-family:var(--font-serif);font-style:italic;font-weight:400;letter-spacing:-.01em;line-height:1.3;color:var(--color-heat-100);white-space:nowrap}
.structs-word span{position:absolute;left:0;top:0;transition:transform .65s var(--ease),opacity .45s var(--ease)}
.structs-word span.enter{transform:translateY(100%);opacity:0}
.structs-word span.leave{transform:translateY(-100%);opacity:0}
.structs-count{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.04em;color:var(--black-alpha-48)}
.structs-count b{font-weight:500;color:var(--color-heat-100)}
.structs-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem}
.st-tile{position:relative;display:flex;flex-direction:column;gap:.75rem;min-height:108px;padding:.85rem .85rem 1rem;background:#fff;border:1px solid var(--color-border-faint);border-radius:var(--radius-12);overflow:hidden;transition:border-color .35s,transform .5s var(--ease),box-shadow .5s var(--ease)}
.st-tile .ic{width:32px;height:32px;border-radius:9px;background:var(--color-heat-50);display:grid;place-items:center;color:var(--color-heat-100);flex-shrink:0;transition:background .35s,color .35s,transform .5s var(--ease)}
.st-tile .ic svg{width:15px;height:15px}
.st-tile b{font-family:var(--font-display);font-weight:600;font-size:.84rem;letter-spacing:-.015em;line-height:1.22;color:var(--black-alpha-64);transition:color .3s}
.st-tile .n{position:absolute;top:.85rem;right:.85rem;font-family:var(--font-mono);font-size:.6rem;color:var(--black-alpha-32);transition:color .3s}
.st-tile::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--color-heat-100);transform-origin:0 50%;transform:scaleX(0)}
.st-tile.is-active{border-color:#f2662580;transform:translateY(-4px);box-shadow:0 18px 32px -22px #f26625b3}
.st-tile.is-active .ic{background:var(--color-heat-100);color:#fff;transform:rotate(-6deg)}
.st-tile.is-active b{color:var(--color-accent-black)}
.st-tile.is-active .n{color:var(--color-heat-100)}
.st-tile.is-active::after{animation:fill 2.4s linear forwards}
.structs.paused .st-tile.is-active::after{animation:none;transform:scaleX(1)}

/* ==========================================================================
   SECTION HEAD
   ========================================================================== */
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:2rem 4rem;align-items:end;margin-bottom:clamp(2.5rem,5vw,4rem)}
.sec-head .fc-eyebrow{margin-bottom:1.25rem}
.sec-head p{margin:0;max-width:34rem}
.sec-head.single{grid-template-columns:1fr;max-width:52rem}

/* ==========================================================================
   01 POSITION
   ========================================================================== */
.position-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.position-copy p{margin:0 0 1.1rem}
.position-copy .pull{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.5rem,2.4vw,1.95rem);line-height:1.25;letter-spacing:-.01em;color:var(--color-accent-black);margin:1.75rem 0;padding-left:1.25rem;border-left:2px solid var(--color-heat-100)}
.sys-board{position:relative;height:560px;border:1px solid var(--color-border-faint);border-radius:var(--radius-20);background:var(--color-background-darker);overflow:hidden}
.sys-board::before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--black-alpha-16) 1px,transparent 1px);background-size:18px 18px;opacity:.6}
.sys-board::after{content:"";position:absolute;left:50%;top:56%;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,#f2662526,transparent 62%);transform:translate(-50%,-50%) scale(.6);opacity:0;transition:opacity .9s,transform 1.2s var(--ease);pointer-events:none}
.sys-board.coord::after{opacity:1;transform:translate(-50%,-50%)}
.sys-toggle{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:5;display:inline-flex;padding:4px;border-radius:10px;background:#fff;border:1px solid var(--color-border-faint);box-shadow:0 4px 14px -8px #0a0a0a26}
.sys-toggle button{border:0;background:transparent;padding:.45rem .9rem;border-radius:7px;font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:var(--black-alpha-56);transition:background .25s,color .25s}
.sys-toggle button[aria-pressed="true"]{background:var(--color-accent-black);color:#fff}
/* nodes: left/top/rotation are set per frame by the board script (scattered → orbit) */
.sys-node{position:absolute;left:50%;top:50%;width:140px;padding:.75rem .6rem .7rem;background:#fff;border:1px dashed var(--color-border-strong);border-radius:14px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;transform:translate(-50%,-50%);transition:border-color .5s,box-shadow .5s;z-index:3}
.sys-node .ic{width:34px;height:34px;border-radius:10px;background:var(--black-alpha-4);display:grid;place-items:center;color:var(--black-alpha-64);flex-shrink:0;transition:background .5s,color .5s,transform .5s var(--ease)}
.sys-node .ic svg{width:16px;height:16px}
.sys-node b{display:block;font-family:var(--font-display);font-size:.86rem;font-weight:600;letter-spacing:-.01em;line-height:1.2}
.sys-node small{display:block;margin-top:.2rem;font-family:var(--font-mono);font-size:.56rem;line-height:1.4;color:var(--black-alpha-56);text-transform:uppercase;letter-spacing:.04em}
.sys-wires{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.sys-wires line,.sys-wires ellipse{fill:none}
.sys-wires .chain{stroke:var(--color-border-strong);stroke-width:1.5;stroke-dasharray:4 6}
.sys-wires .gap circle{fill:#fff;stroke:var(--color-heat-120);stroke-width:1.2}
.sys-wires .gap path{fill:none;stroke:var(--color-heat-120);stroke-width:1.4;stroke-linecap:round}
.sys-wires .orbit{stroke:#f2662566;stroke-width:1.2;stroke-dasharray:3 7;animation:sys-orbit 1.8s linear infinite}
.sys-wires .spoke{stroke:#f2662559;stroke-width:1.5;stroke-linecap:round;transition:stroke .3s,stroke-width .3s}
.sys-wires .spoke.hot{stroke:var(--color-heat-100);stroke-width:2.2}
.sys-wires .flow{stroke:var(--color-heat-100);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:2 18;animation:sys-flow 1.2s linear infinite}
@keyframes sys-orbit{to{stroke-dashoffset:-20}}
@keyframes sys-flow{to{stroke-dashoffset:-20}}
.sys-hub{position:absolute;left:50%;top:56%;width:104px;height:104px;transform:translate(-50%,-50%) scale(.5);opacity:0;transition:opacity .5s,transform .9s var(--ease);z-index:2;pointer-events:none}
.sys-hub .core{position:absolute;inset:0;border-radius:50%;background:var(--color-accent-black);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;box-shadow:0 0 0 6px #fff,0 0 0 7px var(--color-border-faint),0 22px 44px -16px #0a0a0a99}
.sys-hub .core img{width:28px;height:28px}
.sys-hub .core em{font-style:normal;font-family:var(--font-display);font-size:.66rem;font-weight:600;letter-spacing:0;line-height:1}
.sys-hub .core em b{font-family:var(--font-serif);font-style:italic;font-weight:400;font-size:.82rem;color:var(--color-heat-100);margin-left:.14rem}
.sys-hub .ring{position:absolute;inset:0;border-radius:50%;border:1px solid var(--color-heat-100);opacity:0}
@keyframes sys-ring{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.2);opacity:0}}
.sys-status{position:absolute;left:0;right:0;bottom:14px;padding-inline:1rem;text-align:center;font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--black-alpha-48);z-index:4;transition:color .4s}
/* coordinated */
.sys-board.coord .sys-node{border-style:solid;border-color:var(--color-border-faint);box-shadow:0 12px 26px -16px #0a0a0a59}
.sys-board.coord .sys-node .ic{background:var(--color-heat-50);color:var(--color-heat-100)}
.sys-board.coord .sys-node:hover{border-color:var(--color-heat-100);box-shadow:0 16px 30px -16px #f2662580}
.sys-board.coord .sys-node:hover .ic{background:var(--color-heat-100);color:#fff;transform:rotate(-6deg)}
.sys-board.coord .sys-hub{opacity:1;transform:translate(-50%,-50%);transition-delay:.35s}
.sys-board.coord .sys-hub .ring{animation:sys-ring 2.8s ease-out infinite}
.sys-board.coord .sys-hub .ring.r2{animation-delay:1.4s}
.sys-board.coord .sys-status{color:var(--color-heat-100)}

.equation{margin-top:clamp(3rem,6vw,5rem);border-radius:var(--radius-20);background:var(--color-accent-black);color:#fff;padding:clamp(1.75rem,4vw,3rem);display:grid;grid-template-columns:auto 1fr;gap:2rem 3rem;align-items:center;position:relative;overflow:hidden}
.equation::after{content:"";position:absolute;right:-120px;bottom:-160px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#f2662540,transparent 65%)}
.equation::before{content:"";position:absolute;left:-140px;top:-180px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,#f2662533,transparent 65%);pointer-events:none}
.equation > *{position:relative;z-index:1}
.equation h3{font-family:var(--font-display);font-weight:600;font-size:clamp(1.9rem,3.6vw,3rem);letter-spacing:-.04em;line-height:1;margin:1rem 0 0}
/* the payoff word: oversized serif, heat gradient, and an underline that draws in with the band */
.eq-mark{position:relative;display:inline-block;margin-top:.06em;padding-bottom:.2em}
.eq-mark .serif-italic{display:inline-block;font-size:1.32em;line-height:1;padding-right:.06em;background:linear-gradient(100deg,#ffc3a3,var(--color-heat-80) 35%,var(--color-heat-100) 70%,var(--color-heat-120));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px #f2662559)}
.eq-mark svg{position:absolute;left:0;bottom:0;width:100%;height:.3em;overflow:visible;clip-path:inset(-60% 100% -60% 0);transition:clip-path 1.1s var(--ease) .55s}
.eq-mark path{fill:none;stroke:var(--color-heat-100);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}
.equation.in .eq-mark svg{clip-path:inset(-60% -3% -60% 0)}
.eq-terms{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;position:relative;z-index:1}
.eq-terms .t{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border:1px solid var(--white-alpha-16);border-radius:10px;font-family:var(--font-display);font-size:.95rem;font-weight:500;letter-spacing:-.01em;background:var(--white-alpha-4)}
.eq-terms .t svg{width:16px;height:16px;flex-shrink:0;color:var(--color-heat-80)}
.eq-terms .t.result svg{color:#fff}
.eq-terms .op{font-family:var(--font-mono);color:var(--color-heat-80);font-size:.9rem}
.eq-terms .t.result{background:var(--color-heat-100);border-color:var(--color-heat-100);color:#fff}

/* ==========================================================================
   02 LIFECYCLE
   ========================================================================== */
.lifecycle{background:var(--color-background-darker);border-block:1px solid var(--color-border-faint)}
.lc-grid{display:grid;grid-template-columns:280px 1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.lc-rail{position:sticky;top:calc(var(--nav-h) + 32px)}
/* "now" readout above the timeline */
.lc-now{padding:1rem 1.1rem 1.1rem;margin-bottom:1.1rem;border:1px solid var(--color-border-faint);border-radius:var(--radius-12);background:#fff;box-shadow:0 18px 40px -34px #0a0a0a59}
.lc-now-top{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--black-alpha-48)}
.lc-count b{font-family:var(--font-display);font-size:1.5rem;font-weight:600;letter-spacing:-.04em;line-height:1;color:var(--color-heat-100);margin-right:.3rem}
.lc-q{font-family:var(--font-serif);font-style:italic;font-size:1.28rem;line-height:1.15;white-space:nowrap;color:var(--color-accent-black);margin:.3rem 0 .9rem}
.lc-meter{display:block;height:3px;border-radius:3px;background:var(--color-border-faint);overflow:hidden}
.lc-meter i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,var(--color-heat-80),var(--color-heat-100) 60%,var(--color-heat-120));transform-origin:0 50%;transform:scaleX(.1667)}
/* timeline: the fill follows the scroll continuously (height set by script), nodes light up as it passes */
.lc-rail ol{list-style:none;margin:0;padding:0;position:relative}
.lc-rail ol::before{content:"";position:absolute;left:16px;top:23px;bottom:23px;width:2px;border-radius:2px;background:var(--color-border-muted)}
.lc-rail .bar{position:absolute;left:16px;top:23px;width:2px;border-radius:2px;background:linear-gradient(var(--color-heat-120),var(--color-heat-100));height:0}
.lc-rail .bar::after{content:"";position:absolute;left:50%;bottom:-4px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--color-heat-100);box-shadow:0 0 0 4px #f2662526,0 0 14px #f26625b3}
.lc-rail li a{display:flex;align-items:center;gap:.85rem;height:46px;position:relative}
.lc-rail .dot{width:34px;height:34px;border-radius:11px;background:#fff;border:1px solid var(--color-border-muted);display:grid;place-items:center;color:var(--black-alpha-48);position:relative;z-index:1;flex-shrink:0;transition:background .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease),transform .5s var(--ease),box-shadow .4s var(--ease)}
.lc-rail .dot svg{width:16px;height:16px}
.lc-rail .dot::after{content:"";position:absolute;right:-5px;bottom:-5px;width:14px;height:14px;border-radius:50%;background:var(--color-heat-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/8px no-repeat;box-shadow:0 0 0 2px var(--color-background-darker);transform:scale(0);transition:transform .45s var(--ease)}
.lc-rail .lbl{flex:1;font-family:var(--font-display);font-weight:500;font-size:1rem;letter-spacing:-.015em;color:var(--black-alpha-56);transition:color .3s,transform .5s var(--ease)}
.lc-rail .no{font-family:var(--font-mono);font-size:.62rem;color:var(--black-alpha-32);transition:color .3s}
.lc-rail li.done .dot{background:var(--color-heat-50);border-color:#f2662559;color:var(--color-heat-100)}
.lc-rail li.done .dot::after{transform:scale(1)}
.lc-rail li.done .lbl{color:var(--black-alpha-72)}
.lc-rail li.active .dot{background:var(--color-heat-100);border-color:var(--color-heat-100);color:#fff;transform:scale(1.12) rotate(-6deg);box-shadow:0 10px 20px -10px #f26625cc}
.lc-rail li.active .dot::before{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1px solid var(--color-heat-100);animation:lc-ring 2.4s ease-out infinite;pointer-events:none}
@keyframes lc-ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.75);opacity:0}}
.lc-rail li.active .lbl{color:var(--color-accent-black);font-weight:600;transform:translateX(3px)}
.lc-rail li.active .no{color:var(--color-heat-100)}
.lc-rail li a:hover .lbl{color:var(--color-accent-black)}
.lc-rail li:not(.active) a:hover .dot{border-color:var(--color-heat-100);color:var(--color-heat-100)}
.lc-rail .rail-cta{margin-top:1.75rem;padding:1.1rem;border:1px solid var(--color-border-faint);border-radius:var(--radius-12);background:#fff}
.lc-rail .rail-cta p{margin:.35rem 0 .9rem;font-size:.85rem;color:var(--black-alpha-64);line-height:1.5}
.lc-rail .rail-cta .fc-btn{width:100%}

.stage{background:#fff;border:1px solid var(--color-border-faint);border-radius:var(--radius-20);padding:clamp(1.5rem,3.5vw,2.75rem);margin-bottom:1.25rem;position:relative;overflow:hidden;transition:border-color .4s,box-shadow .4s}
.stage.active{border-color:var(--color-border-muted);box-shadow:0 24px 60px -40px #0a0a0a40}
.stage::after{content:"";position:absolute;inset:0;z-index:2;background:var(--color-accent-black);opacity:var(--dim,0);pointer-events:none}
/* 3D reveal where the deck is off (small screens): the card folds up from its bottom edge */
.stage.reveal{transform:perspective(1200px) rotateX(14deg) translateY(36px) scale(.97);transform-origin:50% 100%}
.stage.reveal.in{transform:none}
/* stacked deck (desktop): each card pins and the next one folds up over it.
   Script sets top / transform / clip-path per card — see "lifecycle" in main.js */
.lc-stages{position:relative}
.stage-anchor{display:block;height:0;scroll-margin-top:calc(var(--nav-h) + 28px + var(--k,0) * 12px)}
.lc-stages.is-stack .stage{position:sticky;top:calc(var(--nav-h) + 28px);opacity:1;transform:none;transform-origin:50% 0;transition:border-color .4s,box-shadow .4s;will-change:transform;box-shadow:0 -14px 30px -22px #0a0a0a38}
.lc-stages.is-stack .stage.active{box-shadow:0 -14px 30px -22px #0a0a0a38,0 24px 60px -40px #0a0a0a40}
.stage-rail-accent{position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--color-heat-100),var(--color-heat-80));opacity:.25;transition:opacity .4s}
.stage.active .stage-rail-accent{opacity:1}
.stage-top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem}
.stage-num{font-family:var(--font-display);font-size:clamp(3rem,6vw,4.6rem);font-weight:600;letter-spacing:-.05em;line-height:.85;color:var(--color-heat-100)}
.stage-icon{width:48px;height:48px;border-radius:12px;background:var(--color-heat-50);color:var(--color-heat-100);display:grid;place-items:center}
.stage-icon svg{width:22px;height:22px}
.stage h3{margin:.75rem 0 1rem}
.stage .intro{max-width:44rem;margin:0 0 1.5rem}
.stage-visual{margin:0 0 1.5rem;border:1px solid var(--color-border-faint);border-radius:var(--radius-12);overflow:hidden;background:#fff}
.stage-visual img{width:100%;height:auto;transition:transform 1.2s var(--ease)}
.stage-visual:hover img{transform:scale(1.02)}
.stage-cols{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}
.box{border:1px solid var(--color-border-faint);border-radius:var(--radius-12);padding:1.2rem 1.25rem;background:var(--color-background-darker)}
.box h4{font-family:var(--font-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-heat-100);font-weight:500;margin:0 0 .85rem}
.list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.list li{display:flex;gap:.65rem;align-items:flex-start;font-size:.9rem;line-height:1.45;color:var(--black-alpha-72)}
.list li::before{content:"";width:5px;height:5px;margin-top:.5em;border-radius:1px;background:var(--color-heat-100);flex-shrink:0;transform:rotate(45deg)}
.list.two{grid-template-columns:1fr 1fr;column-gap:1.5rem}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chips .fc-chip{font-size:.74rem;padding:.42rem .75rem;transition:border-color .2s,color .2s,background .2s}
.chips .fc-chip:hover{border-color:#f2662566;color:var(--color-heat-100);background:var(--color-heat-50)}
.chain{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:1.5rem 0}
.chain span{font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;padding:.45rem .7rem;border-radius:8px;background:var(--color-accent-black);color:#fff}
.chain span.last{background:var(--color-heat-100)}
.chain i{font-style:normal;color:var(--black-alpha-32);font-size:.8rem}
.asks{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:1.5rem 0}
.asks div{padding:1rem 1.1rem;border-radius:12px;border:1px solid var(--color-border-faint);background:var(--color-background-darker);display:flex;gap:.75rem;font-family:var(--font-display);font-size:1rem;font-weight:500;letter-spacing:-.015em;line-height:1.35}
.asks b{font-family:var(--font-mono);font-weight:500;font-size:.68rem;color:var(--color-heat-100);padding-top:.2rem}
.statement{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.25rem,2vw,1.55rem);line-height:1.35;color:var(--color-accent-black);margin:1.5rem 0;padding:1.1rem 1.3rem;border-radius:12px;background:var(--color-heat-50);border:1px solid #f266252e}
.stage-foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;margin-top:1.75rem;padding-top:1.25rem;border-top:1px dashed var(--color-border-muted)}
.disclaimer{flex:1 1 320px;max-width:30rem;font-size:.78rem;color:var(--black-alpha-56);display:flex;gap:.5rem;align-items:flex-start;line-height:1.5}
.disclaimer svg{width:14px;height:14px;flex-shrink:0;margin-top:.15rem}
.tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}
.tech-grid .list.two{grid-template-columns:1fr}
.tech-grid .box p{margin:0;font-size:.9rem;color:var(--black-alpha-72);line-height:1.55}

/* ==========================================================================
   03 SYSTEM (dark)
   ========================================================================== */
.dark{background:var(--color-accent-black);color:#fff;position:relative;overflow:hidden}
.dark .text-body-large,.dark .text-body-medium,.dark .text-body-x-large{color:var(--white-alpha-72)}
.dark .fc-eyebrow{color:var(--color-heat-80)}
.dark-glow{position:absolute;width:900px;height:900px;border-radius:50%;background:radial-gradient(circle,#f266251f,transparent 60%);left:-300px;top:-300px;pointer-events:none}
.matrix-wrap{border:1px solid var(--color-border-dark);border-radius:var(--radius-20);overflow:hidden;background:var(--color-accent-black-soft);position:relative}
.matrix-scroll{overflow-x:auto}
.matrix{width:100%;border-collapse:collapse;min-width:760px}
.matrix th,.matrix td{padding:1.05rem 1.1rem;border-bottom:1px solid var(--color-border-dark);text-align:center;vertical-align:middle}
.matrix thead th{font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--white-alpha-64);font-weight:500;background:#0f0f0f}
.matrix thead th.us{color:#fff;background:var(--color-heat-100)}
.matrix tbody th{text-align:left;font-weight:400}
.matrix tbody th b{display:block;font-family:var(--font-display);font-size:1rem;font-weight:600;letter-spacing:-.015em;color:#fff}
.matrix tbody th small{display:block;font-size:.8rem;color:var(--white-alpha-48);margin-top:.15rem;line-height:1.4}
.matrix td.us{background:#f266250f}
.matrix tr:last-child th,.matrix tr:last-child td{border-bottom:0}
.m{display:inline-block;width:12px;height:12px;border-radius:50%;border:1.5px solid var(--white-alpha-16)}
.m.full{background:#fff;border-color:#fff}
.m.half{background:linear-gradient(90deg,#fff 50%,transparent 50%);border-color:#fff}
.m.heat{background:var(--color-heat-100);border-color:var(--color-heat-100);box-shadow:0 0 0 4px #f2662526}
.matrix-legend{display:flex;gap:1.5rem;flex-wrap:wrap;padding:1rem 1.1rem;border-top:1px solid var(--color-border-dark);font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--white-alpha-48)}
.matrix-legend span{display:inline-flex;align-items:center;gap:.5rem}
.matrix-legend .m{width:10px;height:10px}

/* ==========================================================================
   04 SOLUTIONS
   ========================================================================== */
.sol-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.manifesto-card{border:1px solid var(--color-border-faint);border-radius:var(--radius-16);background:#fff;display:flex;flex-direction:column;padding:1.75rem 1.5rem 1.4rem 1.75rem;position:relative;overflow:hidden;transition:border-color .45s,transform .5s var(--ease),box-shadow .5s}
.manifesto-card-rail{position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--color-heat-100),var(--color-heat-80));opacity:.35;transition:opacity .4s,width .4s}
.manifesto-card:hover{border-color:var(--color-heat-100);transform:translateY(-4px);box-shadow:0 22px 50px -28px #f2662559,0 4px 18px -10px #0a0a0a14}
.manifesto-card:hover .manifesto-card-rail{opacity:1;width:4px}
.manifesto-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.25rem}
.manifesto-card-num{font-family:var(--font-display);letter-spacing:-.04em;color:var(--color-heat-100);font-size:2.1rem;font-weight:600;line-height:1}
.manifesto-card-glyph{width:26px;height:26px;color:var(--black-alpha-48);transition:color .4s,transform .5s var(--ease)}
.manifesto-card:hover .manifesto-card-glyph{color:var(--color-heat-100);transform:rotate(-8deg) scale(1.08)}
.manifesto-card h3{margin:0 0 .6rem}
.manifesto-card p{flex:1;margin:0}
.manifesto-card-foot{display:flex;justify-content:space-between;align-items:center;margin-top:1.5rem;padding-top:1rem;border-top:1px dashed var(--color-border-muted)}
.manifesto-card.feature{background:linear-gradient(140deg,var(--color-heat-100) 0%,var(--color-heat-120) 100%);color:#fff;border-color:transparent}
.manifesto-card.feature .manifesto-card-rail{display:none}
.manifesto-card.feature .manifesto-card-num,.manifesto-card.feature .manifesto-card-glyph{color:#fff}
.manifesto-card.feature p{color:#ffffffe0}
.manifesto-card.feature .manifesto-card-foot{border-top-color:#ffffff59}
.manifesto-card.feature .link-arrow,.manifesto-card.feature .text-mono-x-small{color:#fff}
.manifesto-card.feature:hover{box-shadow:0 26px 60px -28px #f26625a6}

/* ==========================================================================
   05 AUDIENCE
   ========================================================================== */
.aud-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:1rem;align-items:stretch}
.aud-list{display:flex;flex-direction:column;border:1px solid var(--color-border-faint);border-radius:var(--radius-20);background:#fff;overflow:hidden}
.aud-list button{display:flex;align-items:center;gap:.9rem;padding:1rem 1.25rem;border:0;border-bottom:1px solid var(--color-border-faint);background:transparent;text-align:left;transition:background .25s;position:relative}
.aud-list button:last-child{border-bottom:0}
.aud-list button .n{font-family:var(--font-mono);font-size:.66rem;color:var(--black-alpha-48);width:1.4rem}
.aud-list button .t{font-family:var(--font-display);font-weight:500;font-size:1.02rem;letter-spacing:-.015em;flex:1;color:var(--black-alpha-72);transition:color .2s}
.aud-list button .a{opacity:0;transform:translateX(-6px);transition:all .3s var(--ease);color:var(--color-heat-100)}
.aud-list button:hover{background:var(--color-background-darker)}
.aud-list button[aria-selected="true"]{background:var(--color-heat-50)}
.aud-list button[aria-selected="true"] .t{color:var(--color-accent-black);font-weight:600}
.aud-list button[aria-selected="true"] .n{color:var(--color-heat-100)}
.aud-list button[aria-selected="true"] .a{opacity:1;transform:none}
.aud-list button[aria-selected="true"]::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--color-heat-100)}
.aud-panel{border-radius:var(--radius-20);background:var(--color-accent-black);color:#fff;padding:clamp(1.5rem,3.5vw,2.75rem);display:flex;flex-direction:column;position:relative;overflow:hidden}
.aud-panel::after{content:"";position:absolute;right:-160px;top:-160px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,#f2662538,transparent 65%);pointer-events:none}
.aud-panel > *{position:relative;z-index:1}
.aud-panel .who{font-family:var(--font-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-heat-80)}
.aud-panel h3{font-family:var(--font-display);font-size:clamp(1.75rem,3.2vw,2.6rem);font-weight:600;letter-spacing:-.035em;line-height:1.05;margin:.75rem 0 1rem}
.aud-panel p{color:var(--white-alpha-72);margin:0 0 1.75rem;max-width:34rem;font-size:1.02rem}
.aud-panel h4{font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--white-alpha-48);font-weight:500;margin:0 0 .75rem}
.aud-stages{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:1.75rem}
.aud-stages span{padding:.7rem .35rem;border-radius:9px;border:1px solid var(--white-alpha-16);text-align:center;font-family:var(--font-mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.03em;color:var(--white-alpha-48);transition:all .4s var(--ease)}
.aud-stages span.on{background:var(--color-heat-100);border-color:var(--color-heat-100);color:#fff}
.aud-sols{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:2rem}
.aud-panel .fc-btn{align-self:flex-start;margin-top:auto}
.fade-swap{animation:swap .5s var(--ease)}
@keyframes swap{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ==========================================================================
   06 WHY
   ========================================================================== */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--color-border-faint);border-radius:var(--radius-20);overflow:hidden;background:#fff}
.why-grid > *{padding:clamp(1.5rem,3vw,2.25rem);border-right:1px solid var(--color-border-faint);border-bottom:1px solid var(--color-border-faint);position:relative;transition:background .35s}
.why-grid > :nth-child(3n){border-right:0}
.why-grid > :nth-last-child(-n+3){border-bottom:0}
.why-grid .tile:hover{background:var(--color-background-darker)}
.why-grid .tile .ic{width:40px;height:40px;border-radius:10px;border:1px solid var(--color-border-faint);display:grid;place-items:center;color:var(--color-heat-100);margin-bottom:2.5rem;background:#fff;transition:transform .5s var(--ease),background .3s,color .3s}
.why-grid .tile:hover .ic{background:var(--color-heat-100);color:#fff;transform:rotate(-6deg)}
.why-grid .tile .ic svg{width:18px;height:18px}
.why-grid .tile h3{margin:0 0 .55rem}
.why-grid .tile p{margin:0}
.why-grid .tile .idx{position:absolute;top:1.4rem;right:1.5rem;font-family:var(--font-mono);font-size:.66rem;color:var(--black-alpha-32)}
.why-grid .lead-tile{background:var(--color-background-darker);display:flex;flex-direction:column;justify-content:space-between;gap:2rem}
.why-grid .lead-tile h3{font-family:var(--font-display);font-size:clamp(1.5rem,2.4vw,2rem);font-weight:600;letter-spacing:-.03em;line-height:1.1;margin:0}

/* ==========================================================================
   07 ECOSYSTEM
   ========================================================================== */
.eco{border:1px solid var(--color-border-faint);border-radius:var(--radius-20);background:var(--color-background-darker);padding:clamp(1.75rem,4vw,3.25rem) clamp(1rem,3vw,2.5rem);position:relative;overflow:hidden}
.eco::before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--black-alpha-16) 1px,transparent 1px);background-size:20px 20px;opacity:.5;pointer-events:none}
.eco > *{position:relative}
.eco-row{display:flex;justify-content:center;flex-wrap:wrap;gap:.6rem}
.eco-node{background:#fff;border:1px solid var(--color-border-faint);border-radius:12px;padding:.75rem 1rem;font-family:var(--font-display);font-weight:600;font-size:.92rem;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:.55rem;box-shadow:0 6px 16px -12px #0a0a0a33;transition:transform .35s var(--ease),border-color .3s}
.eco-node:hover{transform:translateY(-3px);border-color:var(--color-heat-100)}
.eco-node svg{width:16px;height:16px;color:var(--color-heat-100)}
.eco-v{width:2px;height:48px;margin:0 auto;background:repeating-linear-gradient(to bottom,var(--color-heat-100) 0 6px,transparent 6px 12px);background-size:2px 24px;animation:flow 1s linear infinite}
@keyframes flow{to{background-position:0 24px}}
.eco-hub{max-width:620px;margin:0 auto;background:var(--color-accent-black);color:#fff;border-radius:var(--radius-16);padding:1.5rem 1.5rem 1.25rem;text-align:center;box-shadow:0 30px 60px -30px #0a0a0a80;position:relative;overflow:hidden}
.eco-hub::after{content:"";position:absolute;inset:auto -60px -120px auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,#f2662550,transparent 65%)}
.eco-hub .wordmark{color:#fff;font-size:1.35rem;justify-content:center}
.eco-hub .wordmark .one{font-size:1.5rem}
.eco-hub .pills{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem;position:relative;z-index:1}
.eco-hub .pills span{font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;padding:.45rem .8rem;border-radius:8px;border:1px solid var(--white-alpha-16);background:var(--white-alpha-4)}
.eco-bus{position:relative;height:28px;max-width:88%;margin:0 auto;border-top:2px dashed #f2662599;border-left:2px dashed #f2662599;border-right:2px dashed #f2662599;border-radius:12px 12px 0 0}
.eco-bus.up{border-top:0;border-bottom:2px dashed #f2662599;border-radius:0 0 12px 12px}
.eco-partners .eco-node{font-size:.84rem;padding:.65rem .85rem}
.eco-result{display:flex;justify-content:center}
.eco-result .eco-node{background:linear-gradient(140deg,var(--color-heat-100),var(--color-heat-120));color:#fff;border:0;font-size:1.05rem;padding:1rem 1.5rem}
.eco-result .eco-node svg{color:#fff}
.eco-label{text-align:center;font-family:var(--font-mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.06em;color:var(--black-alpha-48);margin-bottom:.75rem}
.eco-caption{text-align:center;max-width:38rem;margin:2rem auto 0}

/* ==========================================================================
   CONTACT
   ========================================================================== */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:start;position:relative;z-index:1}
.contact-copy h2 .serif-italic{color:var(--color-heat-80)}
.tell{list-style:none;margin:2rem 0;padding:0;display:grid;gap:0;border-top:1px solid var(--color-border-dark)}
.tell li{display:flex;gap:1rem;align-items:center;padding:.95rem 0;border-bottom:1px solid var(--color-border-dark);font-family:var(--font-display);font-size:1.08rem;letter-spacing:-.015em;color:var(--white-alpha-72)}
.tell li b{font-family:var(--font-mono);font-weight:500;font-size:.68rem;color:var(--color-heat-80);width:1.6rem}
.principle{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.3;color:#fff;margin:0}
.form-card{background:#fff;color:var(--color-accent-black);border-radius:var(--radius-20);padding:clamp(1.5rem,3.5vw,2.5rem);box-shadow:0 40px 100px -40px #000}
.form-card h3{margin:0 0 .35rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem}
.field{display:flex;flex-direction:column;gap:.4rem}
.field.full{grid-column:1/-1}
.field label,.field .lab{font-size:.78rem;font-weight:500;color:var(--black-alpha-72)}
.field label .req{color:var(--color-heat-100)}
.input{height:46px;border:1px solid var(--color-border-muted);border-radius:var(--radius-10);padding:0 .9rem;font:inherit;font-size:.92rem;background:#fff;color:var(--color-accent-black);transition:border-color .18s,box-shadow .18s;width:100%}
textarea.input{height:auto;min-height:92px;padding:.75rem .9rem;resize:vertical;line-height:1.5}
select.input{appearance:none;-webkit-appearance:none;background-image:url("../img/chevron-down.svg");background-repeat:no-repeat;background-position:right .9rem center;padding-right:2.4rem}
.input:hover{border-color:var(--color-border-strong)}
.input:focus{outline:none;border-color:var(--color-heat-100);box-shadow:0 0 0 3px #f266251f}
.input.err{border-color:var(--color-heat-120);box-shadow:0 0 0 3px #eb34241a}
.err-msg{font-size:.74rem;color:var(--color-heat-120);display:none}
.field.has-err .err-msg{display:block}
.seg{display:flex;flex-wrap:wrap;gap:.4rem}
.seg button{border:1px solid var(--color-border-muted);background:#fff;border-radius:99px;padding:.5rem .85rem;font-size:.8rem;color:var(--black-alpha-72);transition:all .2s}
.seg button:hover{border-color:var(--color-border-strong);color:var(--color-accent-black)}
.seg button[aria-pressed="true"]{background:var(--color-accent-black);border-color:var(--color-accent-black);color:#fff}
.form-submit{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1.5rem;padding-top:1.25rem;border-top:1px dashed var(--color-border-muted)}
.form-submit small{font-size:.76rem;color:var(--black-alpha-56);max-width:18rem;line-height:1.45}
.success{display:none;text-align:center;padding:2.5rem 1rem}
.success .ok{width:56px;height:56px;border-radius:50%;background:var(--color-heat-50);color:var(--color-heat-100);display:grid;place-items:center;margin:0 auto 1.25rem}
.success .ok svg{width:24px;height:24px}
.form-card.sent form{display:none}
.form-card.sent .success{display:block;animation:swap .6s var(--ease)}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.footer{background:var(--color-accent-black);color:#fff;border-top:1px solid var(--color-border-dark);padding-top:clamp(3rem,6vw,5rem)}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem;padding-bottom:3rem}
.footer .wordmark{color:#fff}
.footer p{color:var(--white-alpha-48);font-size:.88rem;max-width:22rem;margin:1rem 0 0}
.footer h5{font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--white-alpha-48);font-weight:500;margin:0 0 1rem}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.footer ul a{font-size:.88rem;color:var(--white-alpha-72);transition:color .2s}
.footer ul a:hover{color:var(--color-heat-80)}
.footer-big{font-family:var(--font-display);font-weight:600;letter-spacing:-.05em;font-size:clamp(3rem,11.5vw,10.5rem);line-height:.85;color:transparent;-webkit-text-stroke:1px #ffffff26;white-space:nowrap;padding-bottom:1.5rem;user-select:none;text-align:center}
.footer-big em{font-family:var(--font-serif);font-weight:400;-webkit-text-stroke:0;color:var(--color-heat-100);padding-left:.05em}
.footer-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1.25rem 0 1.75rem;border-top:1px solid var(--color-border-dark);font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--white-alpha-48)}
.footer p.footer-legal{font-size:.76rem;color:var(--white-alpha-32);margin:0;padding-bottom:1.75rem;max-width:62rem;line-height:1.55}

/* ==========================================================================
   CARD BEAM — a heat comet travels the card edge (same --hf-angle clock as the hero frame).
   Panels run it continuously; repeated cards only while active / hovered.
   ========================================================================== */
.sys-board,.eco,.why-grid,.matrix-wrap,.aud-panel,.equation,.form-card,.stage.active,.manifesto-card:not(.feature):hover{
  --beam-bg:#fff;--beam-rest:var(--color-border-faint);
  border:1px solid transparent;
  background:linear-gradient(var(--beam-bg),var(--beam-bg)) padding-box,
    conic-gradient(from var(--hf-angle),var(--beam-rest) 0deg,var(--beam-rest) 235deg,var(--color-heat-80) 300deg,var(--color-heat-100) 338deg,var(--color-heat-120) 356deg,var(--beam-rest) 360deg) border-box;
  animation:hf-spin 7s linear infinite}
.sys-board,.eco{--beam-bg:var(--color-background-darker)}
.matrix-wrap{--beam-bg:var(--color-accent-black-soft);--beam-rest:var(--color-border-dark)}
.aud-panel,.equation{--beam-bg:var(--color-accent-black);--beam-rest:var(--white-alpha-16)}
.form-card{--beam-rest:#fff}
.stage.active{--beam-rest:var(--color-border-muted)}
.manifesto-card:not(.feature):hover{--beam-rest:#f2662566;animation-duration:3.2s}
.equation,.why-grid{animation-delay:-2.3s}
.matrix-wrap,.eco{animation-delay:-4.6s}
.aud-panel.fade-swap{animation:swap .5s var(--ease),hf-spin 7s linear infinite}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1100px){
  .sol-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1023px){
  .position-grid,.contact-grid,.aud-grid{grid-template-columns:1fr}
  .structs-grid{grid-template-columns:minmax(0,1fr)}
  .hero-stage{grid-template-columns:1fr}
  .hero-stage .plus{display:none}
  .console-frame{max-width:560px;width:100%;margin-inline:auto}
  .sec-head{grid-template-columns:1fr;gap:1.25rem}
  .lc-grid{grid-template-columns:minmax(0,1fr)}
  .lc-grid > *,.aud-grid > *,.contact-grid > *,.position-grid > *{min-width:0}
  .lc-rail{position:sticky;top:var(--nav-h);z-index:20;margin-inline:-1rem;padding:.6rem 1rem;background:#f9f9f9f2;backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border-faint)}
  .lc-rail ol{display:flex;gap:.35rem;overflow-x:auto;scrollbar-width:none}
  .lc-rail ol::-webkit-scrollbar{display:none}
  .lc-rail ol::before,.lc-rail .bar,.lc-rail .rail-cta,.lc-rail .lc-now,.lc-rail .no,.lc-rail .dot::after{display:none}
  .lc-rail li a{height:auto;padding:.3rem .7rem .3rem .3rem;border-radius:99px;border:1px solid var(--color-border-faint);background:#fff;gap:.5rem}
  .lc-rail .dot{width:24px;height:24px;border-radius:50%}
  .lc-rail .dot svg{width:12px;height:12px}
  .lc-rail li.active .dot{transform:none}
  .lc-rail li.active .lbl{transform:none}
  .stage-anchor{scroll-margin-top:calc(var(--nav-h) + 68px)}
  .lc-rail .lbl{font-size:.82rem;white-space:nowrap}
  .lc-rail li.active a{border-color:var(--color-heat-100)}
  .equation{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr 1fr}
  .why-grid > *{border-right:1px solid var(--color-border-faint)!important;border-bottom:1px solid var(--color-border-faint)!important}
  .why-grid > :nth-child(2n){border-right:0!important}
  .why-grid > :nth-last-child(-n+2){border-bottom:0!important}
  .footer-top{grid-template-columns:1fr 1fr}
  .footer-top > :first-child{grid-column:1/-1}
}
@media (max-width:720px){
  .media-tag{display:none}
  .zoom-hint{right:10px;top:10px;padding:.35rem;font-size:0;gap:0}
  .lightbox{justify-content:flex-start;padding:4.25rem 1rem 1rem}
  .lightbox img{max-width:none;height:min(62vh,420px);flex-shrink:0}
  .flowline{grid-template-columns:repeat(3,1fr)}
  .fl-step{padding:1rem .85rem 1.1rem}
  .fl-step:nth-of-type(3){border-right:0}
  .fl-step:nth-of-type(-n+3){border-bottom:1px solid var(--color-border-faint)}
  .fl-rail,.fl-q,.fl-step > .fl-go{display:none}
  .fl-name{font-size:.95rem}
  .structs-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-tile{min-height:0;flex-direction:row;align-items:center;gap:.6rem;padding:.65rem .7rem}
  .st-tile .n{display:none}
  .stage-cols,.tech-grid,.asks,.list.two{grid-template-columns:1fr}
  .sol-grid,.why-grid{grid-template-columns:1fr}
  .why-grid > *{border-right:0!important;border-bottom:1px solid var(--color-border-faint)!important}
  .why-grid > :last-child{border-bottom:0!important}
  .form-grid{grid-template-columns:1fr}
  .aud-stages{grid-template-columns:repeat(3,1fr)}
  .eco-bus{display:none}
  .sys-board{height:470px}
  .sys-node{width:106px;padding:.6rem .4rem;gap:.4rem;border-radius:12px}
  .sys-node .ic{width:28px;height:28px;border-radius:8px}
  .sys-node b{font-size:.76rem}
  .sys-node small{display:none}
  .sys-hub{width:76px;height:76px}
  .sys-hub .core img{width:22px;height:22px}
  .sys-hub .core em{font-size:.5rem}.sys-hub .core em b{font-size:.62rem}
}
@media (max-width:420px){
  .stage-labels span{font-size:.5rem}
  .hero-actions .fc-btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  .stage.reveal{transform:none}
  .split .w > span{transform:none}
  .hero-frame{animation:none}
  .fl-step{opacity:1;transform:none}
  .fl-rail{opacity:1}
}