:root{font-family:'DM Sans',Arial,sans-serif;color:#e8edf6;background:#070b14;font-synthesis:none;--ink:#070b14;--paper:#e8edf6;--muted:#9aa8bc;--line:#304057;--cyan:#79e5e8;--violet:#a99bff;--lime:#d4f791}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;overflow-x:hidden}
a{color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
.skip{position:absolute;left:-999px;top:8px;background:var(--paper);color:var(--ink);padding:12px;z-index:100}
.skip:focus{left:10px}
.site-header{position:relative;z-index:20;min-height:74px;padding:0 clamp(20px,4vw,72px);display:flex;align-items:center;gap:40px;border-bottom:1px solid #ffffff1b;background:#070b14cc;backdrop-filter:blur(20px)}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:800 1.15rem 'Manrope',sans-serif;letter-spacing:-.05em;white-space:nowrap}
.brand img{border-radius:50%}
.site-header nav{display:flex;gap:clamp(15px,2.5vw,34px);margin:auto}
.site-header nav a,.header-link{font-size:.86rem;text-decoration:none;color:#bec9d9;white-space:nowrap}
.site-header nav a:hover,.header-link:hover{color:var(--cyan)}
.header-link{border:1px solid #8392aa65;padding:10px 14px;border-radius:4px}
.header-link span{margin-left:10px}
.section-shell{width:min(100% - 48px,1440px);margin:auto}
.hero{position:relative;isolation:isolate;min-height:min(820px,calc(100svh - 74px));display:grid;grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);align-items:center;padding:80px max(24px,calc((100vw - 1440px)/2)) 76px;overflow:hidden;background:radial-gradient(circle at 74% 48%,#18254d 0,#0b1426 30%,#070b14 67%)}
.hero:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 55%,#438ab716,transparent 35%),linear-gradient(110deg,transparent 42%,#7de0f308 50%,transparent 58%);pointer-events:none}
.hero-grid{position:absolute;inset:0;opacity:.34;background-image:linear-gradient(#6d8cbd13 1px,transparent 1px),linear-gradient(90deg,#6d8cbd13 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(90deg,transparent 10%,#000 70%)}
.hero-copy{position:relative;z-index:4;max-width:710px;padding-left:clamp(0px,2vw,24px)}
.eyebrow,.kicker,.section-index,.section-tag,.scene-caption,.scene-label,.scroll-cue{font:700 .73rem/1.5 'Space Mono',monospace;letter-spacing:.13em}
.eyebrow{color:var(--cyan);display:flex;align-items:center;gap:12px}
.pulse{width:9px;height:9px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 6px #79e5e823,0 0 20px var(--cyan)}
h1,h2,h3,p{margin-top:0}
.hero h1{font-family:'Manrope',sans-serif;font-weight:800;letter-spacing:-.075em}
.hero h1{font-size:clamp(3.7rem,6.2vw,7.8rem);line-height:.98;margin:26px 0 28px}
.hero h1 em{font-style:normal;color:var(--cyan)}
.hero-lede{font-size:clamp(1.05rem,1.45vw,1.32rem);line-height:1.7;color:#c8d4e4;max-width:600px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:51px;padding:12px 20px;border:1px solid #8ca5c369;border-radius:4px;text-decoration:none;font-size:.9rem;font-weight:700;transition:transform .2s,background .2s,border-color .2s}
.button:hover{transform:translateY(-3px)}
.button.primary{background:var(--cyan);color:#06212c;border-color:var(--cyan)}
.button.primary:hover{background:#b3f6f2}
.button.ghost:hover{background:#a2d7ea13;border-color:var(--cyan)}
.hero-note{max-width:540px;margin:24px 0 0;font-size:.78rem;line-height:1.6;color:#97a9bc}
.scene{position:relative;z-index:2;height:min(640px,65vw);min-height:500px;perspective:1100px;transform-style:preserve-3d}
.scene-halo{position:absolute;width:64%;aspect-ratio:1;left:18%;top:16%;border-radius:50%;background:radial-gradient(circle,#7fe1f828,#8c78ff17 42%,transparent 70%);filter:blur(30px)}
.scene-ring{position:absolute;left:10%;top:18%;width:80%;height:66%;border:1px solid #7ae0e770;border-radius:50%;box-shadow:0 0 30px #7ae0e72b,inset 0 0 30px #7ae0e716;transform:rotate(-24deg) rotateX(70deg);animation:ring 16s linear infinite}
.ring-b{left:22%;top:8%;width:56%;height:84%;border-color:#bca8ff70;transform:rotate(26deg) rotateY(70deg);animation:ring2 22s linear infinite}
.scene-depth{position:absolute;left:50%;top:50%;width:min(34vw,350px);height:min(34vw,350px);min-width:250px;min-height:250px;transform:translate(-50%,-50%);transform-style:preserve-3d}
.decision-cube{position:absolute;inset:0;transform-style:preserve-3d;animation:cube 22s ease-in-out infinite}
.cube-face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:28px;background:linear-gradient(135deg,#092d45cc,#11164cca 56%,#2a2250c7);border:1px solid #9ceaf1b8;box-shadow:inset 0 0 55px #79e5e825,0 0 22px #89dee924;backdrop-filter:blur(6px)}
.cube-face span{color:#8be8ee;font:700 .65rem 'Space Mono',monospace;letter-spacing:.14em}
.cube-face strong{font:800 clamp(1.15rem,2vw,2rem)/1.15 'Manrope',sans-serif;letter-spacing:-.05em;max-width:230px}
.cube-face.front{transform:translateZ(175px)}
.cube-face.back{transform:rotateY(180deg) translateZ(175px)}
.cube-face.right{transform:rotateY(90deg) translateZ(175px)}
.cube-face.left{transform:rotateY(-90deg) translateZ(175px)}
.cube-face.top{transform:rotateX(90deg) translateZ(175px);background:linear-gradient(130deg,#87dfe835,#a594e82c)}
.cube-face.bottom{transform:rotateX(-90deg) translateZ(175px);background:#0b123ab0}
.scene-label{position:absolute;color:#b8cbe1;font-size:.57rem;white-space:nowrap}
.scene-label span{color:var(--cyan)}
.label-one{left:4%;top:18%}
.label-two{right:1%;top:42%}
.label-three{left:5%;bottom:18%}
.scene-caption{position:absolute;left:8%;right:8%;bottom:1%;display:flex;justify-content:space-between;gap:8px;color:#a6bfd0;font-size:.55rem;border-top:1px solid #9ddcf342;padding-top:12px}
.scroll-cue{position:absolute;left:max(24px,calc((100vw - 1440px)/2));bottom:18px;color:#9db3c6;text-decoration:none;font-size:.6rem}
.scroll-cue span{margin-left:8px;color:var(--cyan)}
@keyframes cube{0%,100%{transform:rotateX(-18deg) rotateY(-26deg)}25%{transform:rotateX(-12deg) rotateY(64deg)}50%{transform:rotateX(12deg) rotateY(150deg)}75%{transform:rotateX(-19deg) rotateY(245deg)}}
@keyframes ring{to{transform:rotate(336deg) rotateX(70deg)}}
@keyframes ring2{to{transform:rotate(386deg) rotateY(70deg)}}
.section-top{display:flex;align-items:center;gap:18px;padding-top:40px;color:#93a7ba}
.section-index{color:var(--cyan);white-space:nowrap}
.section-tag{white-space:nowrap}
.section-rule{height:1px;flex:1;background:#41536c77}
.kicker{color:var(--cyan);margin-bottom:20px}
.text-link{display:inline-block;margin-top:10px;color:var(--cyan);text-underline-offset:4px}
.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:30px max(24px,calc((100vw - 1440px)/2));border-top:1px solid #354b63;color:#94a6b8;font-size:.78rem}
.footer p{margin:0}
@media(max-width:1200px){.hero h1{font-size:clamp(3.6rem,6.2vw,6.5rem)}
.scene-depth{transform:translate(-50%,-50%) scale(.76)}}
@media(max-width:800px){.site-header{gap:12px;padding-inline:20px;min-height:66px}
.site-header nav{gap:14px;margin-left:auto;margin-right:0}
.site-header nav a{font-size:.78rem}
.header-link{display:none}
.hero{display:block;min-height:auto;padding:76px 24px 80px}
.hero-copy{padding:0}
.hero h1{font-size:clamp(3.5rem,11vw,6.5rem)}
.scene{height:440px;min-height:0;margin-top:35px}
.scene-depth{width:300px;height:300px;min-width:300px;min-height:300px;transform:translate(-50%,-50%) scale(.68)}
.scroll-cue{left:24px}
.section-shell{width:min(100% - 40px,1440px)}}
@media(max-width:600px){.site-header{flex-wrap:wrap;padding-block:12px}
.site-header nav{width:100%;order:2;justify-content:space-between;overflow-x:auto}
.site-header nav a{font-size:.8rem}
.hero{padding-top:55px}
.hero h1{font-size:clamp(3.1rem,12vw,5rem)}
.scene{height:330px;margin-top:12px}
.scene-depth{transform:translate(-50%,-50%) scale(.5)}
.scene-ring{top:15%;height:70%}
.label-one{left:0;top:6%}
.label-two{right:0;top:28%}
.label-three{bottom:12%}
.scene-caption{font-size:.45rem}
.hero-actions .button{width:100%}
.section-top{gap:10px}
.section-index,.section-tag{font-size:.59rem}
.footer{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.decision-cube,.scene-ring{animation:none!important}
.button{transition:none}
.button:hover{transform:none}}
@media(prefers-contrast:more){.hero-note{color:#edf4ff}}