@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#eaf1f7; --muted:#8e9bab; --line:rgba(195,220,241,.16); --blue:#80d2ff; --night:#07111f; }
* { box-sizing:border-box; }
html { min-height:100%; background:var(--night); }
body { min-height:100vh; margin:0; color:var(--ink); font-family:Manrope,Arial,sans-serif; background:radial-gradient(ellipse 70% 55% at 72% 41%,#173358 0%,#0b192b 38%,#07111f 72%); overflow-x:hidden; }
.page-noise { position:fixed; inset:0; opacity:.035; z-index:1; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.orb { position:fixed; border-radius:50%; filter:blur(2px); opacity:.28; pointer-events:none; }
.orb-one { width:31vw; height:31vw; right:-12vw; top:-12vw; background:radial-gradient(circle at 50% 50%,#3b8bbb 0,transparent 68%); }
.orb-two { width:25vw; height:25vw; left:-13vw; bottom:-14vw; background:radial-gradient(circle,#19668f 0,transparent 69%); }
.shell { position:relative; z-index:2; width:min(1400px,100%); min-height:100vh; padding:29px clamp(24px,5vw,88px) 25px; margin:auto; display:flex; flex-direction:column; }
.nav { display:flex; align-items:center; justify-content:space-between; gap:24px; animation:reveal .7s both; }
.brand { display:flex; gap:11px; align-items:center; text-decoration:none; color:#fff; letter-spacing:-1.4px; font-size:22px; font-weight:800; }
.brand span span { color:#79c9f4; font-weight:500; }
.brand-mark { width:30px; height:30px; display:grid; grid-template-columns:repeat(3,1fr); gap:3px; transform:skewY(-17deg); }
.brand-mark i { display:block; background:linear-gradient(150deg,#b5ebff,#338dbc); border-radius:1px; box-shadow:0 0 10px #65cfff55; }.brand-mark i:nth-child(2){transform:translateY(6px)}.brand-mark i:nth-child(3){transform:translateY(12px)}
.nav-actions { display:flex; align-items:center; padding:4px; gap:3px; border:1px solid #b8ddf125; border-radius:8px; background:#02091444; backdrop-filter:blur(13px); }.nav-entry { color:#bccbd5; padding:9px 12px; border-radius:5px; text-decoration:none; font-size:10px; font-weight:700; white-space:nowrap; letter-spacing:-.015em; transition:.25s; }.nav-entry span { color:#70bfeb; font:9px 'DM Mono',monospace; margin-right:6px; }.nav-entry:hover { color:#f4fbff; background:#a9e5ff19; box-shadow:inset 0 0 0 1px #a9e5ff25; }
.hero { min-height:calc(100vh - 165px); flex:1; display:grid; grid-template-columns:1fr 1fr; align-items:center; position:relative; }
.hero-copy { position:relative; z-index:3; padding:72px 0 60px; animation:reveal .8s .13s both; }.eyebrow { font:500 10px 'DM Mono',monospace; letter-spacing:.17em; color:#90b1c8; margin:0 0 19px; }.eyebrow span { display:inline-block; width:23px; height:1px; background:#8ed5fa; vertical-align:middle; margin-right:9px; }
h1 { font-size:clamp(44px,5.2vw,78px); line-height:.99; letter-spacing:-.07em; margin:0; max-width:640px; font-weight:700; } h1 em { font-family:'Playfair Display',serif; letter-spacing:-.065em; color:#9bdbfc; font-weight:600; }
.intro { max-width:460px; color:#a9b8c6; font-size:15px; line-height:1.85; margin:28px 0 21px; }.capabilities { display:flex; gap:10px; align-items:center; font:500 9px 'DM Mono',monospace; letter-spacing:.12em; color:#80b8d7; }.capabilities i { height:3px; width:3px; border-radius:50%; background:#d9b06d; }
.floating-modules { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:1; animation:reveal 1s .25s both; }.module { position:absolute; display:block; width:clamp(116px,15vw,235px); filter:drop-shadow(0 18px 22px #02091355); will-change:transform; }.module-one { width:clamp(180px,23vw,356px); right:-2%; top:3%; animation:drift-one 13s ease-in-out infinite; }.module-two { width:clamp(108px,13vw,195px); right:32%; top:11%; opacity:.9; animation:drift-two 11s ease-in-out -3s infinite; }.module-three { width:clamp(140px,18vw,270px); right:7%; bottom:-5%; animation:drift-three 15s ease-in-out -6s infinite; }.module-four { width:clamp(100px,12vw,176px); right:41%; bottom:5%; opacity:.86; animation:drift-four 12s ease-in-out -4s infinite; }.module-five { width:clamp(112px,14vw,205px); right:21%; top:43%; opacity:.92; animation:drift-five 14s ease-in-out -8s infinite; }
footer { display:flex; justify-content:space-between; align-items:center; margin-top:24px; color:#6e8798; font:10px 'DM Mono',monospace; letter-spacing:.04em; }.status i { display:inline-block; width:6px; height:6px; background:#72d9ae; border-radius:50%; margin-right:6px; box-shadow:0 0 9px #72d9ae; }footer a { color:#91cce8; text-decoration:none; } footer a b { margin-left:6px; font-size:15px; transition:.2s; } footer a:hover b { margin-left:10px; }
@keyframes drift-one { 50% { transform:translate(-11px,18px) rotate(3deg); }}@keyframes drift-two { 50% { transform:translate(13px,-14px) rotate(-5deg) scale(1.04); }}@keyframes drift-three { 50% { transform:translate(-17px,-16px) rotate(-3deg); }}@keyframes drift-four { 50% { transform:translate(10px,16px) rotate(6deg); }}@keyframes drift-five { 50% { transform:translate(16px,-10px) rotate(-4deg) scale(.96); }}@keyframes reveal { from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:760px) { .shell{padding:20px 20px 20px}.nav{align-items:flex-start}.nav-actions{max-width:246px;flex-wrap:wrap;justify-content:flex-end}.nav-entry{padding:6px 7px;font-size:9px}.nav-entry span{font-size:8px;margin-right:3px}.hero{grid-template-columns:1fr;min-height:590px;align-items:start}.hero-copy{padding:58px 0 0}.floating-modules{opacity:.66}.module-one{width:280px;right:-50px;top:31%}.module-two{right:37%;top:34%}.module-three{width:208px;right:-38px;bottom:-4%}.module-four{display:none}.module-five{right:37%;top:61%}.intro{font-size:14px;max-width:330px}footer{margin-top:17px}.status{display:none} }
@media (max-width:360px) {h1{font-size:42px}.hero{min-height:550px}.core-stage{top:55%}}