.scroll-hero{--sh-bg:#232733;--sh-accent:#4f8cff;--sh-accent-2:#7ee0ff;--sh-text:#fff;--sh-font-display:"Space Grotesk","Inter",sans-serif;--sh-ring-size:44vmin;--sh-subject-height:78%;position:relative;height:300vh;background:var(--sh-bg);color:var(--sh-text);isolation:isolate}
.scroll-hero__sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.scroll-hero__stage{position:absolute;inset:0;background-color:var(--sh-bg);background-size:cover;background-position:center;overflow:hidden}
.scroll-hero__media{position:absolute;inset:0;will-change:transform,filter}
.scroll-hero__img{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.1s ease}
.scroll-hero__img.is-ready{opacity:1}
.scroll-hero__img--back{object-fit:cover;transform:scale(1.18);filter:blur(34px) brightness(0.38) saturate(1.25)}
.scroll-hero__img--main{object-fit:contain;object-position:center 46%;filter:brightness(0.86) contrast(1.06) saturate(1.04);-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 13%,#000 87%,rgba(0,0,0,0) 100%),linear-gradient(to bottom,#000 0%,#000 58%,rgba(0,0,0,0) 94%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 13%,#000 87%,rgba(0,0,0,0) 100%),linear-gradient(to bottom,#000 0%,#000 58%,rgba(0,0,0,0) 94%);mask-composite:intersect}
.scroll-hero__img--main.is-ready{opacity:1}
.scroll-hero__glow{position:absolute;left:50%;top:44%;width:62vmin;height:62vmin;transform:translate(-50%,-50%);border-radius:50%;opacity:0.3;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle at center,rgba(126,224,255,0.4) 0%,rgba(79,140,255,0.2) 40%,rgba(79,140,255,0) 72%);will-change:transform,opacity}
.scroll-hero__rings{position:absolute;left:50%;top:63%;width:var(--sh-ring-size);height:var(--sh-ring-size);transform:translate(-50%,-50%);perspective:1100px;pointer-events:none;mix-blend-mode:screen;opacity:0.18;will-change:transform,opacity}
.scroll-hero__ring{position:absolute;inset:0;border-radius:50%;-webkit-mask:radial-gradient(closest-side,transparent calc(100% - 2px),#000 calc(100% - 2px));mask:radial-gradient(closest-side,transparent calc(100% - 2px),#000 calc(100% - 2px));filter:drop-shadow(0 0 10px rgba(79,140,255,0.5))}
.scroll-hero__ring--a{background:conic-gradient(from 0deg,rgba(126,224,255,0) 0deg,rgba(126,224,255,0.85) 55deg,rgba(79,140,255,0.7) 130deg,rgba(79,140,255,0) 210deg,rgba(79,140,255,0) 360deg)}
.scroll-hero__ring--b{inset:11%;background:conic-gradient(from 140deg,rgba(79,140,255,0) 0deg,rgba(79,140,255,0.75) 70deg,rgba(126,224,255,0.55) 150deg,rgba(126,224,255,0) 235deg,rgba(126,224,255,0) 360deg)}
.scroll-hero__ring--c{inset:-13%;background:conic-gradient(from 260deg,rgba(126,224,255,0) 0deg,rgba(126,224,255,0.55) 45deg,rgba(79,140,255,0.35) 120deg,rgba(79,140,255,0) 195deg,rgba(79,140,255,0) 360deg)}
@media (prefers-reduced-motion:no-preference){.scroll-hero__ring--a{animation:sh-orbit-a 18s linear infinite}.scroll-hero__ring--b{animation:sh-orbit-b 26s linear infinite}.scroll-hero__ring--c{animation:sh-orbit-c 34s linear infinite}.scroll-hero__glow{animation:sh-breathe 7.5s ease-in-out infinite}.scroll-hero__grain{animation:sh-grain 0.9s steps(4) infinite}}
@keyframes sh-orbit-a{from{transform:rotateX(76deg) rotateZ(0deg)}to{transform:rotateX(76deg) rotateZ(360deg)}}
@keyframes sh-orbit-b{from{transform:rotateX(70deg) rotateZ(360deg)}to{transform:rotateX(70deg) rotateZ(0deg)}}
@keyframes sh-orbit-c{from{transform:rotateX(82deg) rotateZ(120deg)}to{transform:rotateX(82deg) rotateZ(480deg)}}
@keyframes sh-breathe{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.1)}}
@keyframes sh-grain{0%{transform:translate(0,0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,-1%)}100%{transform:translate(2%,1%)}}
.scroll-hero__particles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen;opacity:0.5}
.scroll-hero__scanlines{position:absolute;inset:0;pointer-events:none;opacity:0.07;background-image:repeating-linear-gradient(to bottom,rgba(255,255,255,0.05) 0px,rgba(255,255,255,0.05) 1px,rgba(0,0,0,0) 1px,rgba(0,0,0,0) 3px)}
.scroll-hero__grain{position:absolute;inset:-6%;pointer-events:none;opacity:0.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E")}
.scroll-hero__vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 72% 72% at 50% 46%,rgba(0,0,0,0) 30%,rgba(14,17,24,0.72) 100%)}
.scroll-hero__scrim{position:absolute;left:0;right:0;bottom:0;height:58%;pointer-events:none;background:linear-gradient(to bottom,rgba(20,23,32,0) 0%,rgba(20,23,32,0.45) 46%,rgba(20,23,32,0.78) 100%)}
.scroll-hero__fade{position:absolute;left:0;right:0;bottom:0;height:38%;pointer-events:none;opacity:0.25;background:linear-gradient(to bottom,rgba(35,39,51,0) 0%,rgba(35,39,51,0.7) 55%,#232733 100%)}
.scroll-hero__texts{position:absolute;left:0;right:0;bottom:clamp(72px,15vh,150px);padding:0 24px;pointer-events:none;text-align:center}
.scroll-hero__text{position:absolute;left:0;right:0;bottom:0;max-width:22ch;margin:0 auto;font-family:var(--sh-font-display);font-size:clamp(30px,4.6vw,62px);font-weight:700;line-height:1.12;letter-spacing:-0.02em;color:var(--sh-text);opacity:0;text-wrap:balance;text-shadow:0 4px 34px rgba(0,0,0,0.75);will-change:transform,opacity}
.scroll-hero__text .sh-word{display:inline-block}
.scroll-hero__text .sh-char{display:inline-block;will-change:transform,opacity}
.scroll-hero__cue{position:absolute;right:clamp(18px,4vw,48px);bottom:clamp(18px,4vw,42px);display:flex;align-items:center;gap:10px;font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:0.32em;text-transform:uppercase;color:rgba(255,255,255,0.45);pointer-events:none}
.scroll-hero__cue-line{display:block;width:1px;height:42px;background:linear-gradient(to bottom,rgba(126,224,255,0.8),rgba(126,224,255,0))}
@media (prefers-reduced-motion:no-preference){.scroll-hero__cue-line{animation:sh-cue 2.2s ease-in-out infinite;transform-origin:top center}}
@keyframes sh-cue{0%,100%{transform:scaleY(0.35);opacity:0.4}50%{transform:scaleY(1);opacity:1}}
@media (max-width:768px){.scroll-hero{--sh-ring-size:56vmin}.scroll-hero__img--main{object-position:center 42%;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 7%,#000 93%,rgba(0,0,0,0) 100%),linear-gradient(to bottom,#000 0%,#000 62%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 7%,#000 93%,rgba(0,0,0,0) 100%),linear-gradient(to bottom,#000 0%,#000 62%,rgba(0,0,0,0) 96%)}.scroll-hero__text{max-width:13ch}.scroll-hero__texts{bottom:clamp(80px,18vh,160px)}}
.scroll-hero.is-static{height:auto}
.scroll-hero.is-static .scroll-hero__sticky{position:relative;height:auto;min-height:100vh;display:flex;align-items:center}
.scroll-hero.is-static .scroll-hero__media{transform:none;filter:none}
.scroll-hero.is-static .scroll-hero__particles,.scroll-hero.is-static .scroll-hero__grain,.scroll-hero.is-static .scroll-hero__cue{display:none}
.scroll-hero.is-static .scroll-hero__fade{opacity:1}
.scroll-hero.is-static .scroll-hero__texts{position:relative;left:auto;right:auto;bottom:auto;display:flex;flex-direction:column;align-items:center;gap:clamp(16px,3vw,28px);width:100%;padding:clamp(80px,14vh,160px) 24px}
.scroll-hero.is-static .scroll-hero__text{position:relative;left:auto;right:auto;bottom:auto;opacity:1;max-width:24ch;font-size:clamp(26px,4.5vw,54px)}
.site-hero{--hero-bg:#232733;--hero-accent:#4f8cff;--hero-accent-2:#7ee0ff;--hero-text:#f3f6ff;--hero-text-dim:#a8b1c7;--hero-line:rgba(255,255,255,0.09);--hero-surface:rgba(255,255,255,0.04);--hero-font-display:"Space Grotesk","Inter",sans-serif;--hero-font-body:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;position:relative;display:flex;align-items:center;min-height:100vh;min-height:100svh;padding:calc(var(--nav-height,72px) + 72px) 24px 96px;overflow:hidden;background:var(--hero-bg);color:var(--hero-text);font-family:var(--hero-font-body);isolation:isolate}
.site-hero__glow{position:absolute;border-radius:50%;filter:blur(110px);opacity:0.5;pointer-events:none;z-index:0}
.site-hero__glow--a{top:-18%;right:-6%;width:46vw;max-width:620px;aspect-ratio:1;background:radial-gradient(circle,rgba(79,140,255,0.55),transparent 70%)}
.site-hero__glow--b{bottom:-22%;left:-10%;width:40vw;max-width:540px;aspect-ratio:1;background:radial-gradient(circle,rgba(126,224,255,0.32),transparent 70%)}
.site-hero__grid{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(var(--hero-line) 1px,transparent 1px),linear-gradient(90deg,var(--hero-line) 1px,transparent 1px);background-size:68px 68px;mask-image:radial-gradient(ellipse 80% 65% at 50% 40%,#000 20%,transparent 78%);-webkit-mask-image:radial-gradient(ellipse 80% 65% at 50% 40%,#000 20%,transparent 78%);opacity:0.55}
.site-hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,0.95fr);align-items:center;gap:72px;width:100%;max-width:var(--max-width,1200px);margin:0 auto}
.site-hero__content{max-width:620px}
.site-hero__eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 24px;padding:7px 16px 7px 12px;border:1px solid var(--hero-line);border-radius:999px;background:var(--hero-surface);font-family:var(--hero-font-body);font-size:0.75rem;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:var(--hero-text-dim)}
.site-hero__dot{width:8px;height:8px;border-radius:50%;background:var(--hero-accent-2);box-shadow:0 0 0 4px rgba(126,224,255,0.16)}
@media (prefers-reduced-motion:no-preference){.site-hero__dot{animation:site-hero-pulse 2.4s ease-in-out infinite}}
@keyframes site-hero-pulse{0%,100%{box-shadow:0 0 0 3px rgba(126,224,255,0.18)}50%{box-shadow:0 0 0 8px rgba(126,224,255,0.03)}}
.site-hero__title{margin:0 0 20px;font-family:var(--hero-font-display);font-size:clamp(2.5rem,6.4vw,4.5rem);font-weight:700;line-height:1.06;letter-spacing:-0.03em;color:var(--hero-text)}
.site-hero__title .site-hero-line{display:block;overflow:hidden}
.site-hero__title .site-hero-word{display:inline-block;will-change:transform}
.site-hero__title-accent,.site-hero__title-accent .site-hero-word{background:linear-gradient(100deg,var(--hero-accent) 0%,var(--hero-accent-2) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.site-hero__role{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-family:var(--font-mono,monospace);font-size:clamp(0.95rem,1.5vw,1.15rem);color:var(--hero-accent-2)}
.site-hero__role-arrow{color:var(--hero-accent)}
.site-hero__cursor{color:var(--hero-accent)}
@media (prefers-reduced-motion:no-preference){.site-hero__cursor{animation:site-hero-blink 1.1s step-end infinite}}
@keyframes site-hero-blink{0%,100%{opacity:1}50%{opacity:0}}
.site-hero__text{max-width:540px;margin:0 0 36px;padding-left:18px;border-left:2px solid rgba(79,140,255,0.35);font-size:clamp(1rem,1.25vw,1.0625rem);line-height:1.75;color:var(--hero-text-dim)}
.site-hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:40px}
.site-hero__btn{position:relative;display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border:1px solid transparent;border-radius:999px;font-family:var(--hero-font-body);font-size:0.9375rem;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;will-change:transform;transition:background-color 0.3s ease,border-color 0.3s ease,color 0.3s ease,box-shadow 0.3s ease}
.site-hero__btn span,.site-hero__btn i{position:relative;z-index:1;display:inline-block}
.site-hero__btn:focus-visible{outline:2px solid var(--hero-accent-2);outline-offset:3px}
.site-hero__btn--primary{background:linear-gradient(120deg,var(--hero-accent),#6ea4ff);color:#0d1220;box-shadow:0 14px 34px rgba(79,140,255,0.32)}
.site-hero__btn--primary:hover{box-shadow:0 18px 44px rgba(79,140,255,0.46)}
.site-hero__btn--outline{border-color:rgba(126,224,255,0.4);background:var(--hero-surface);color:var(--hero-text)}
.site-hero__btn--outline:hover{border-color:var(--hero-accent-2);background:rgba(126,224,255,0.1)}
.site-hero__btn--ghost{border-color:var(--hero-line);color:var(--hero-text-dim)}
.site-hero__btn--ghost:hover{border-color:var(--hero-line);background:var(--hero-surface);color:var(--hero-text)}
.site-hero__meta{display:flex;flex-wrap:wrap;gap:10px 28px;padding-top:26px;border-top:1px solid var(--hero-line);font-size:0.8125rem;letter-spacing:0.04em;color:var(--hero-text-dim)}
.site-hero__meta span{display:inline-flex;align-items:center;gap:8px}
.site-hero__meta i{color:var(--hero-accent)}
.site-hero__visual{position:relative;aspect-ratio:1;width:100%;max-width:560px;margin-left:auto}
.site-hero__stage{position:absolute;inset:-12%}
.site-hero__stage canvas{display:block;width:100%;height:100%}
.site-hero__fallback{position:absolute;inset:12%;border:1px solid rgba(79,140,255,0.28);border-radius:50%;background:radial-gradient(circle at 40% 35%,rgba(126,224,255,0.22),rgba(79,140,255,0.06) 55%,transparent 72%);transition:opacity 0.6s ease}
.site-hero__fallback::after{content:"";position:absolute;inset:18%;border:1px solid rgba(126,224,255,0.22);border-radius:50%}
.site-hero__visual.is-webgl-ready .site-hero__fallback{opacity:0}
.site-hero__badge{position:absolute;z-index:2;display:flex;flex-direction:column;gap:4px;padding:12px 16px;border:1px solid var(--hero-line);border-radius:14px;background:rgba(24,28,40,0.72);backdrop-filter:blur(10px);font-size:0.6875rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--hero-text-dim)}
.site-hero__badge strong{font-family:var(--hero-font-display);font-size:1.05rem;letter-spacing:-0.01em;color:var(--hero-text)}
.site-hero__badge--latency{top:6%;left:-4%}
.site-hero__badge--uptime{right:-2%;bottom:10%}
.site-hero__scroll{position:absolute;bottom:28px;left:50%;z-index:2;display:flex;align-items:center;gap:10px;transform:translateX(-50%);font-size:0.6875rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--hero-text-dim)}
@media (prefers-reduced-motion:no-preference){.site-hero__scroll i{animation:site-hero-nudge 1.8s ease-in-out infinite}}
@keyframes site-hero-nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.site-hero.is-pre-anim .site-hero__eyebrow,.site-hero.is-pre-anim .site-hero__role,.site-hero.is-pre-anim .site-hero__text,.site-hero.is-pre-anim .site-hero__actions,.site-hero.is-pre-anim .site-hero__meta,.site-hero.is-pre-anim .site-hero__visual,.site-hero.is-pre-anim .site-hero__scroll{opacity:0}
.site-hero.is-pre-anim .site-hero__title{opacity:0}
.site-hero.is-pre-anim.is-split-ready .site-hero__title{opacity:1}
[data-theme="light"] .site-hero{--hero-bg:#eef1f8;--hero-text:#141a2b;--hero-text-dim:#4b5670;--hero-line:rgba(20,26,43,0.1);--hero-surface:rgba(20,26,43,0.03);--hero-accent:#2f6fe4}
[data-theme="light"] .site-hero .site-hero__glow{opacity:0.3}
[data-theme="light"] .site-hero .site-hero__badge{background:rgba(255,255,255,0.8)}
[data-theme="light"] .site-hero .site-hero__btn--primary{color:#fff}
@media (max-width:1100px){.site-hero__inner{gap:48px}}
@media (max-width:980px){.site-hero{padding:calc(var(--nav-height,72px) + 48px) 20px 80px;text-align:center}.site-hero__inner{grid-template-columns:minmax(0,1fr);gap:40px}.site-hero__content{order:2;max-width:680px;margin:0 auto}.site-hero__visual{order:1;max-width:380px;margin:0 auto}.site-hero__text{margin-left:auto;margin-right:auto;padding-left:0;border-left:0}.site-hero__actions,.site-hero__meta,.site-hero__role{justify-content:center}.site-hero__meta{justify-content:center}.site-hero__scroll{display:none}}
@media (max-width:600px){.site-hero__title{font-size:2.5rem}.site-hero__visual{max-width:290px}.site-hero__badge{padding:9px 12px;font-size:0.625rem}.site-hero__badge strong{font-size:0.875rem}.site-hero__actions .site-hero__btn{flex:1 1 100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.site-hero .site-hero__btn,.site-hero .site-hero-word{transition:none !important;transform:none !important}}