:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
--bg:#f1f6ff;--hero1:#e3eeff;--hero2:#f1f6ff;--card:#fff;--text:#0f1b3d;--muted:#5b6788;--brand:#1769ff;--brand-d:#0f4fcc;--line:#dde6f6;--dark:#0a1634;--sh:rgba(15,27,61,.12)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#070d20;--hero1:#0c1736;--hero2:#070d20;--card:#111c3d;--text:#eaf1ff;--muted:#93a1c9;--brand:#4d8dff;--brand-d:#2f63c7;--line:#223259;--dark:#050a18;--sh:rgba(0,0,0,.5)}}
:root[data-theme="dark"]{--bg:#070d20;--hero1:#0c1736;--hero2:#070d20;--card:#111c3d;--text:#eaf1ff;--muted:#93a1c9;--brand:#4d8dff;--brand-d:#2f63c7;--line:#223259;--dark:#050a18;--sh:rgba(0,0,0,.5)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:Poppins,Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5;overflow-x:hidden}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
header,section,.main,footer{position:relative;z-index:1}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
header{background:var(--dark);color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.35)}
nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;flex-wrap:wrap}
.logo{font-weight:800;font-size:21px}.logo span{color:var(--accent,#4d8dff)}
.links{display:flex;gap:22px;font-size:13px;font-weight:500;flex-wrap:wrap}.links span{padding:6px 0;opacity:.8}.links .on{opacity:1;border-bottom:2px solid var(--accent,#4d8dff)}
.nr{display:flex;gap:10px;align-items:center}.sb{background:color-mix(in srgb,var(--brand) 22%,var(--dark));border-radius:8px;padding:8px 14px;font-size:12px;color:#9fb0dd;min-width:150px}
.btn{background:var(--brand);color:var(--on-brand,#fff);border:0;padding:12px 22px;border-radius:12px;font-weight:600;font-size:14px;cursor:pointer;box-shadow:0 5px 0 var(--brand-d),0 14px 24px color-mix(in srgb,var(--brand) 35%,transparent);transition:transform .1s,box-shadow .1s}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--brand-d),0 4px 8px color-mix(in srgb,var(--brand) 30%,transparent)}
.btn.o{background:var(--card);color:var(--brand);border:1.5px solid var(--brand);box-shadow:0 5px 0 var(--line),0 14px 24px var(--sh)}
.hero{background:linear-gradient(180deg,var(--hero1),var(--hero2));overflow:hidden}
#c{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;min-height:520px;gap:10px}
.eye{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--brand)}
h1{font-size:clamp(32px,5vw,50px);line-height:1.12;margin:10px 0 14px;text-shadow:0 6px 18px var(--sh)}h1 em{font-style:normal;color:var(--brand)}
.hero p{color:var(--muted);margin:0 0 24px;max-width:460px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.quote{margin-top:26px;font-size:14px;color:var(--muted);background:var(--card);border:1px solid var(--line);border-left:4px solid var(--brand);padding:10px 14px;border-radius:12px;max-width:460px;min-height:46px;transition:opacity .4s;box-shadow:0 14px 30px var(--sh)}
.stage{position:relative;height:520px}
.fl{position:absolute;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:9px 14px;font-size:12px;font-weight:700;box-shadow:0 18px 36px var(--sh);will-change:transform}
.note{background:#fff;color:#1a2547;border-radius:4px;text-align:center;line-height:1.5;padding:10px 14px;font-size:11px}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;transform-style:preserve-3d;transition:transform .12s ease-out,box-shadow .25s;box-shadow:0 2px 0 var(--line),0 16px 30px var(--sh),0 40px 60px -28px color-mix(in srgb,var(--brand) 35%,transparent)}
.card:hover{box-shadow:0 2px 0 var(--line),0 24px 44px var(--sh),0 50px 80px -24px color-mix(in srgb,var(--brand) 50%,transparent)}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .2s;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.4),transparent 55%)}
.card:hover::after{opacity:1}
.tile{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:22px;font-weight:700;color:#fff;transform:translateZ(46px);background:linear-gradient(145deg,color-mix(in srgb,var(--c) 65%,#fff),var(--c));box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 12px 20px color-mix(in srgb,var(--c) 50%,transparent)}
.card h3{margin:14px 0 6px;font-size:17px;transform:translateZ(26px)}.card p{margin:0 0 14px;color:var(--muted);font-size:13px;transform:translateZ(12px)}
.card a{color:var(--brand);font-weight:600;font-size:13px;display:inline-block;transform:translateZ(20px)}
.main{padding-bottom:10px}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:36px}
.grid6{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.grid6 .card{padding:16px}.grid6 .tile{width:40px;height:40px;font-size:18px}.grid6 h3{font-size:14px}.grid6 p{font-size:11px;margin-bottom:8px}
.sec{display:flex;justify-content:space-between;align-items:center;margin:48px 0 16px}.sec h2{margin:0;font-size:21px}.sec a{color:var(--brand);font-size:13px;font-weight:600}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px;text-align:center;margin-top:44px}
.stats>div{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:0 14px 30px var(--sh)}
.stats b{display:block;font-size:30px;color:var(--brand)}.stats span{font-size:12px;color:var(--muted)}
.bar{margin:44px 0;background:linear-gradient(110deg,var(--dark),color-mix(in srgb,var(--brand) 45%,var(--dark)));color:#fff;border-radius:20px;padding:26px 30px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;box-shadow:0 30px 60px -20px rgba(10,22,52,.7)}
.bar h3{margin:0 0 4px;font-size:20px}.bar p{margin:0;font-size:13px;color:#b9c8f0}
.rk{font-size:44px;display:inline-block;animation:fly 2.6s ease-in-out infinite}
@keyframes fly{0%,100%{transform:translate(0,0) rotate(-6deg)}50%{transform:translate(8px,-12px) rotate(4deg)}}
.rv{opacity:0;transform:perspective(1000px) rotateX(28deg) translateY(50px) scale(.96);transform-origin:50% 100%;transition:opacity .7s,transform .8s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rk{animation:none}.rv{opacity:1;transform:none;transition:none}}
footer{background:var(--dark);color:#b9c8f0;font-size:12px}footer .wrap{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;flex-wrap:wrap;gap:10px}
@media(max-width:820px){.hero .wrap{grid-template-columns:1fr;min-height:640px;align-items:start;padding-top:24px}.stage{display:none}.links{display:none}}