/* Home — "Orbit" */

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:stretch; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-img{ position:absolute; inset:-4%; }
.hero-img img{ width:100%; height:100%; object-fit:cover; object-position:50% 70%; }
.hero-img.grade::before{ background:linear-gradient(180deg,rgba(5,5,9,.55) 0%,rgba(5,5,9,.1) 35%,rgba(5,5,9,.35) 70%,var(--ink-0) 100%); }
.hero-glow{ position:absolute; width:70vmax; height:70vmax; left:50%; top:30%; margin:-35vmax 0 0 -35vmax; border-radius:50%;
  background:radial-gradient(circle,rgba(92,99,217,.35),rgba(141,79,198,.12) 40%,transparent 65%); mix-blend-mode:screen; pointer-events:none; }
.hero-vignette{ position:absolute; inset:0; background:radial-gradient(120% 90% at 50% 40%,transparent 50%,rgba(5,5,9,.8)); }
.hero-wrap{ position:relative; z-index:2; display:flex; flex-direction:column; justify-content:space-between; padding-top:calc(var(--nav-h) + 40px); padding-bottom:96px; min-height:100svh; }
.hero-top{ display:flex; justify-content:space-between; gap:20px; }
.hero-coords{ color:var(--dim); }
.hero-title{ margin:6vh 0 4vh; display:flex; flex-direction:column; }
.ht-line{ display:block; will-change:transform; }
.ht-line.l2{ padding-left:12vw; }
.ht-line.l3{ align-self:flex-end; text-align:right; }
.hero-title .serif{ font-size:1.06em; line-height:.8; }
.hero-foot{ display:grid; grid-template-columns:1fr auto; gap:40px; align-items:end; }
.hero-copy .lead{ color:var(--bone-2); opacity:.86; }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-top:30px; }
.hero-core{ width:320px; padding:20px 22px; border-radius:20px; background:rgba(9,9,26,.5); border:1px solid var(--line-2); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); font-size:.86rem; }
.hc-title{ display:flex; align-items:center; gap:10px; font-size:.66rem; color:var(--fog); margin-bottom:12px; }
.hc-title i{ width:6px; height:6px; border-radius:50%; background:#5fd38d; animation:pulse 2s infinite; }
.hc-row{ display:flex; justify-content:space-between; padding:7px 0; border-top:1px solid var(--line); color:var(--fog); }
.hc-row b{ font-family:var(--f-mono); font-weight:500; color:var(--bone); font-variant-numeric:tabular-nums; }
.hc-spark{ width:100%; height:34px; margin-top:10px; }
.hc-spark path{ fill:none; stroke:url(#lg); stroke:var(--accent-2); stroke-width:1.2; opacity:.8; }
.hero-cue{ position:absolute; left:50%; bottom:34px; transform:translateX(-50%); }
@media (max-width:900px){
  .hero-foot{ grid-template-columns:1fr; }
  .hero-core{ display:none; }
  .ht-line.l2{ padding-left:0; }
  .hero-cue{ display:none; }
  .hero-coords{ display:none; }
}

/* ---------- Manifesto ---------- */
.manifesto{ overflow:hidden; padding:clamp(140px,18vw,260px) 0; }
.manifesto .wrap{ position:relative; z-index:2; }
.manifesto-text{ margin-top:36px; font-family:var(--f-display); font-weight:500; font-size:clamp(2rem,4.6vw,4.6rem); line-height:1.04; letter-spacing:-.03em; max-width:20ch; max-width:none; width:min(100%,1180px); }
.manifesto-text .serif{ color:var(--accent-2); }
.m-float{ position:absolute; z-index:1; border-radius:18px; opacity:.85; }
/* Photos live in a right-hand lane the text never enters, so they can drift freely */
.m-float.f1{ width:clamp(140px,16vw,260px); aspect-ratio:3/4; right:6vw; top:6%; }
.m-float.f2{ width:clamp(160px,19vw,300px); aspect-ratio:4/3; right:2.5vw; bottom:2%; opacity:.6; }
@media (min-width:901px){ .manifesto-text{ width:min(100%,1080px,56vw); font-size:clamp(2rem,4.2vw,4.4rem); } }
@media (max-width:900px){ .m-float{ opacity:.35; } .m-float.f2{ right:auto; left:-3vw; } }

/* ---------- Core sequence ---------- */
.core-seq{ position:relative; height:100vh; }
.core-stage{ position:relative; height:100vh; overflow:hidden; display:grid; place-items:center; }
.core-mask{ position:absolute; inset:0; clip-path:circle(16vmin at 50% 50%); will-change:clip-path; }
.core-img{ position:absolute; inset:0; }
.core-img img{ width:100%; height:100%; object-fit:cover; transform:scale(1.3); }
.core-img::after{ opacity:.6; }
.core-stage::after{ content:""; position:absolute; inset:0; background:radial-gradient(60% 60% at 50% 50%,rgba(5,5,9,.25),rgba(5,5,9,.7)); pointer-events:none; }
.core-ring{ position:absolute; width:min(86vmin,760px); height:auto; z-index:2; overflow:visible; }
.core-ring circle{ fill:none; }
.ring-a{ stroke:var(--line-2); stroke-dasharray:2 8; }
.ring-b{ stroke:var(--line); }
.core-ring .node{ fill:var(--bone); }
.core-ring .node-halo{ fill:none; stroke:var(--accent-2); stroke-width:1; opacity:.5; }
.core-lines{ position:relative; z-index:3; width:100%; font-size:clamp(2.2rem,min(7.5vw,13svh),8rem); text-align:center; }
.core-line{ word-spacing:.16em; position:absolute; left:0; right:0; top:0; font-size:inherit; line-height:1; padding:0 var(--gutter); }
.core-line .serif{ color:var(--accent-2); }
.core-meter{ position:absolute; bottom:44px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:14px; font-size:.7rem; color:var(--fog); z-index:3; }
.cm-bar{ width:120px; height:1px; background:var(--line-2); position:relative; overflow:hidden; }
.cm-bar i{ position:absolute; inset:0; background:var(--bone); transform:scaleX(0); transform-origin:left; }

/* ---------- Capabilities (horizontal) ---------- */
.caps{ position:relative; }
.caps-pin{ position:relative; min-height:100vh; display:flex; flex-direction:column; justify-content:center; gap:clamp(18px,4vh,60px); padding:calc(var(--nav-h) + 6px) 0 clamp(24px,5vh,60px); overflow:hidden; }
.caps-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:40px; }
.caps-head .h2{ margin-top:18px; max-width:17ch; font-size:clamp(2rem,min(4.4vw,8svh),4.6rem); }
.caps-meta{ display:grid; gap:14px; justify-items:end; flex-shrink:0; }
.caps-group{ display:flex; gap:6px; padding:5px; border:1px solid var(--line-2); border-radius:999px; font-size:.66rem; }
.caps-group span{ padding:7px 14px; border-radius:999px; color:var(--dim); transition:all .5s var(--ease); }
.caps-group span.cg-on{ background:var(--bone); color:var(--ink-0); }
.caps-count{ font-size:.8rem; color:var(--fog); }
.caps-count b{ color:var(--bone); font-weight:500; }
.caps-prog{ width:200px; height:1px; background:var(--line-2); position:relative; }
.caps-prog i{ position:absolute; inset:0; background:var(--grad); transform:scaleX(0); transform-origin:left; }
.caps-track{ display:flex; gap:18px; padding:0 var(--gutter); width:max-content; will-change:transform; }
.cap{ position:relative; width:clamp(280px,24vw,360px); min-height:min(420px,50vh); flex-shrink:0; padding:clamp(20px,3.2vh,30px) 28px; border-radius:24px; background:linear-gradient(180deg,rgba(23,21,47,.85),rgba(12,11,28,.85)); border:1px solid var(--line); display:flex; flex-direction:column; transition:border-color .5s, translate .6s var(--ease); }
.cap:hover{ border-color:var(--line-2); translate:0 -8px; }
.cap-n{ position:absolute; top:26px; right:26px; font-size:.7rem; color:var(--dim); }
.cap-ico{ width:clamp(44px,6.5vh,58px); height:clamp(44px,6.5vh,58px); border-radius:16px; display:grid; place-items:center; color:var(--accent-2); background:var(--grad-soft); border:1px solid var(--line); margin-bottom:auto; }
.cap-ico svg{ width:28px; }
.cap h3{ margin:clamp(16px,4.5vh,60px) 0 10px; }
.cap p{ color:var(--fog); font-size:.95rem; margin-bottom:16px; }
.cap-divider{ position:relative; width:clamp(320px,34vw,520px); flex-shrink:0; border-radius:24px; overflow:hidden; }
.cap-divider .media{ position:absolute; inset:0; border-radius:0; }
.cap-divider .media img{ transform:scale(1.15); }
.cd-copy{ position:absolute; left:28px; right:28px; bottom:28px; z-index:3; display:grid; gap:10px; }
.cd-copy .h2{ font-size:clamp(2.4rem,4vw,3.8rem); }
.cap-end{ width:10vw; flex-shrink:0; }
@media (max-width:900px){
  .caps-head{ flex-direction:column; align-items:flex-start; }
  .caps-meta{ justify-items:start; }
  .caps-track{ width:auto; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:12px; -webkit-overflow-scrolling:touch; }
  .cap, .cap-divider{ scroll-snap-align:start; }
  .cap-divider{ min-height:420px; }
  .caps-count, .caps-prog{ display:none; }
}

/* ---------- Stacking services ---------- */
.stack{ position:relative; }
.stack-card{
  position:sticky; top:calc(var(--nav-h) + 10px + var(--i) * 14px);
  display:grid; grid-template-columns:1.15fr 1fr; min-height:min(76vh,720px); margin-bottom:6vh;
  border-radius:30px; overflow:hidden; background:var(--ink-2); border:1px solid var(--line);
  transform-origin:50% 0%; will-change:transform;
}
.stack-card:last-child{ margin-bottom:0; }
.sc-media{ border-radius:0; }
.stack-card .sc-media.grade::after{ mix-blend-mode:normal; opacity:.55; }
.sc-media img{ position:absolute; inset:0; scale:1.12; transition:scale 1.6s var(--ease); }
.stack-card:hover .sc-media img{ scale:1.04; }
.sc-copy{ position:relative; padding:clamp(28px,4vw,64px); display:flex; flex-direction:column; justify-content:flex-end; gap:22px;
  background:radial-gradient(90% 70% at 100% 0%,var(--glow),transparent 60%), linear-gradient(180deg,var(--ink-2),var(--ink-1)); }
.sc-n{ position:absolute; top:clamp(28px,4vw,56px); left:clamp(28px,4vw,64px); font-size:.72rem; color:var(--fog); }
.sc-copy .h1{ font-size:clamp(2.6rem,5vw,5.4rem); }
.sc-copy .serif{ color:var(--accent-2); }
.stack-card .shade{ position:absolute; inset:0; background:var(--ink-0); opacity:0; pointer-events:none; z-index:5; }
@media (max-width:900px){
  .stack-card{ grid-template-columns:1fr; grid-template-rows:42vh auto; position:relative; top:auto; }
  .sc-n{ position:static; }
  .sc-copy{ justify-content:flex-start; }
}

/* ---------- Mission ---------- */
.mission{ overflow:hidden; }
.mission-bg{ position:absolute; inset:0; border-radius:0; opacity:.38; }
.mission-bg::before{ background:linear-gradient(180deg,var(--ink-0),rgba(5,5,9,.3) 30%,rgba(5,5,9,.3) 70%,var(--ink-0)); }
.mission .wrap{ position:relative; z-index:2; }
.orbit{ position:relative; }
.orbit-svg{ position:absolute; left:0; right:0; top:0; width:100%; height:260px; overflow:visible; }
.orbit-track{ fill:none; stroke:var(--line-2); stroke-width:1; stroke-dasharray:3 7; vector-effect:non-scaling-stroke; }
.orbit-fill{ fill:none; stroke:url(#lg); stroke:var(--accent-2); stroke-width:1.6; vector-effect:non-scaling-stroke; }
.bays{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; padding-top:290px; }
.bay{ padding:28px 24px 30px; border-radius:22px; border:1px solid var(--line); background:rgba(12,11,30,.82); transition:border-color .6s, background .6s, transform .8s var(--ease); }
.bay.is-on{ border-color:var(--line-2); background:linear-gradient(180deg,rgba(92,99,217,.18),rgba(9,9,26,.6)); transform:translateY(-10px); }
.bay-tag{ font-size:.66rem; color:var(--dim); transition:color .5s; }
.bay.is-on .bay-tag{ color:var(--accent-2); }
.bay-ico{ width:50px; height:50px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--line-2); margin:26px 0 22px; color:var(--fog); transition:all .6s; }
.bay.is-on .bay-ico{ background:var(--grad); border-color:transparent; color:#fff; box-shadow:0 0 30px var(--glow); }
.bay-ico svg{ width:22px; }
.bay p{ color:var(--fog); margin-top:12px; font-size:.95rem; }
.bays .bay:nth-child(odd){ margin-top:-60px; }
.orbit-ship-el{ position:absolute; left:-7px; top:-7px; width:14px; height:14px; border-radius:50%; background:#fff; box-shadow:0 0 0 5px rgba(198,179,255,.18),0 0 24px 4px var(--accent-2); z-index:3; pointer-events:none; }
@media (max-width:980px){
  .orbit-svg, .orbit-ship-el{ display:none; }
  .bays{ grid-template-columns:1fr 1fr; padding-top:0; }
  .bays .bay:nth-child(odd){ margin-top:0; }
}
@media (max-width:600px){ .bays{ grid-template-columns:1fr; } }

/* ---------- Products marquees ---------- */
.products{ overflow:hidden; }
.products-head{ display:grid; gap:24px; margin-bottom:70px; }
.products-head .h2{ max-width:16ch; }
.pm-row{ --gap:36px; padding:18px 0; border-top:1px solid var(--line); }
.pm-row.alt{ border-bottom:1px solid var(--line); }
.pm-item{ font-family:var(--f-display); font-weight:500; font-size:clamp(2.4rem,6vw,6rem); letter-spacing:-.04em; line-height:1.1; }
.pm-item.serif{ font-family:var(--f-serif); font-style:italic; font-weight:400; color:var(--accent-2); letter-spacing:-.02em; }
.pm-row.alt .pm-item{ -webkit-text-stroke:1px rgba(243,241,236,.5); color:transparent; }
.pm-row.alt .pm-item.serif{ -webkit-text-stroke:0; color:var(--accent-2); }
.pm-star{ width:clamp(28px,3.4vw,52px); aspect-ratio:1; align-self:center; background:url(../../logo-mark.png) center/contain no-repeat; animation:spin 9s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ---------- Why (light bento) ---------- */
.bento{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:minmax(240px,auto); gap:16px; }
.bc{ position:relative; border-radius:24px; padding:30px; background:#fff; border:1px solid rgba(5,5,9,.08); display:flex; flex-direction:column; justify-content:flex-end; gap:12px; overflow:hidden; transition:box-shadow .6s var(--ease); }
.bc:hover{ box-shadow:0 30px 60px -30px rgba(23,21,47,.35); }
.bc .mono{ font-size:.7rem; color:#8c8aa3; margin-bottom:auto; padding-bottom:18px; }
.bc p{ color:#4c4a62; }
.b1{ grid-column:span 2; }
.b5, .b6{ grid-column:span 2; }
.b2{ grid-column:span 2; grid-row:span 2; color:var(--bone); padding:0; }
.b2 .media{ position:absolute; inset:0; border-radius:0; }
.bc-over{ position:relative; z-index:3; padding:30px; display:grid; gap:12px; margin-top:auto; }
.bc-over .mono{ position:static; color:var(--fog); }
.b2 p{ color:var(--bone-2); }
.b4.dark{ background:var(--ink-1); color:var(--bone); border-color:transparent; background-image:radial-gradient(80% 80% at 100% 0%,rgba(141,79,198,.45),transparent 60%),radial-gradient(70% 70% at 0% 100%,rgba(42,143,224,.35),transparent 60%); }
.b4.dark p{ color:var(--fog); }
.b4.dark .mono{ color:var(--fog); }
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px; }
.stat{ border-top:1px solid rgba(5,5,9,.15); padding:26px 0 0; }
.stat b{ display:block; font-family:var(--f-display); font-weight:500; font-size:clamp(3.4rem,7vw,7rem); line-height:.9; letter-spacing:-.05em; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat span{ display:block; margin-top:10px; color:#4c4a62; }
@media (max-width:980px){
  .bento{ grid-template-columns:1fr 1fr; }
  .b1,.b2,.b5,.b6{ grid-column:span 2; } .b2{ grid-row:auto; min-height:380px; }
  .stats{ grid-template-columns:1fr 1fr; }
}
@media (max-width:600px){ .bento{ grid-template-columns:1fr; } .b1,.b2,.b5,.b6{ grid-column:auto; } }

/* ---------- Roadmap teaser ---------- */
.rmt{ position:relative; height:100vh; }
.rmt-frame{ position:relative; height:100vh; overflow:hidden; clip-path:inset(14% 12% 14% 12% round 40px); will-change:clip-path; }
.rmt-img{ position:absolute; inset:0; }
.rmt-img img{ width:100%; height:100%; object-fit:cover; transform:scale(1.3); }
.rmt-img.grade::before{ background:linear-gradient(90deg,rgba(5,5,9,.85),rgba(5,5,9,.25) 70%); }
.rmt-copy{ position:relative; z-index:3; height:100%; display:flex; flex-direction:column; justify-content:center; gap:26px; }
.rmt-copy .h1{ max-width:14ch; }
.rmt-copy .serif{ color:var(--accent-2); }
.rmt-stages{ display:flex; flex-wrap:wrap; gap:8px; font-size:.66rem; }
.rmt-stages span{ padding:8px 12px; border:1px solid var(--line-2); border-radius:999px; color:var(--fog); background:rgba(5,5,9,.45); }
.rmt-copy .btn{ align-self:flex-start; }

/* ---------- Free tools teaser ---------- */
.tt-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.tt-card{ position:relative; display:flex; flex-direction:column; border-radius:30px; overflow:hidden; background:var(--ink-2); border:1px solid var(--line-2); transform-style:preserve-3d; }
.tt-img{ height:clamp(220px,32vh,340px); border-radius:0; }
.tt-copy{ padding:clamp(24px,3vw,40px); display:flex; flex-direction:column; gap:14px; flex:1;
  background:radial-gradient(90% 80% at 100% 0%,var(--glow),transparent 60%),linear-gradient(180deg,var(--ink-2),var(--ink-1)); }
.tt-copy .mono{ font-size:.66rem; color:var(--accent-2); }
.tt-copy .h2{ font-size:clamp(2.2rem,4vw,3.8rem); }
.tt-copy .serif{ color:var(--accent-2); }
.tt-copy p{ color:var(--fog); max-width:46ch; }
.tt-copy .link-arrow{ margin-top:auto; padding-top:10px; }
@media (max-width:860px){ .tt-grid{ grid-template-columns:1fr; } }