:root{--bg:#080b12;--panel:#111827;--panel2:#172033;--text:#f8fafc;--muted:#aab4c5;--brand:#7c3aed;--brand2:#06b6d4;--ok:#22c55e;--warn:#f59e0b;--border:rgba(255,255,255,.12);--shadow:0 24px 80px rgba(0,0,0,.38)}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial;background:radial-gradient(circle at top left,#1a2350 0,#080b12 36%,#05070b 100%);color:var(--text)}a{color:inherit;text-decoration:none}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 5vw;background:rgba(8,11,18,.76);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}.brand{font-size:22px;font-weight:900;letter-spacing:-.04em}.brand span{color:var(--brand2);margin-right:8px}nav{display:flex;gap:22px;color:var(--muted);font-weight:650}.ghost,.btn{border:1px solid var(--border);border-radius:999px;padding:12px 18px;background:rgba(255,255,255,.06);color:var(--text);cursor:pointer}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center;padding:72px 5vw 36px}.hero h1{font-size:clamp(38px,6vw,78px);line-height:.92;margin:12px 0;letter-spacing:-.07em}.hero p{font-size:20px;color:var(--muted);line-height:1.6;max-width:760px}.eyebrow{color:#67e8f9;text-transform:uppercase;font-size:12px;letter-spacing:.22em;font-weight:900}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.primary{background:linear-gradient(135deg,var(--brand),var(--brand2));border:0;font-weight:850}.secondary{background:rgba(255,255,255,.08)}.player-card{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.04));padding:14px;border:1px solid var(--border);border-radius:30px;box-shadow:var(--shadow)}video{width:100%;border-radius:20px;aspect-ratio:16/9;background:#000}.player-meta{display:flex;justify-content:space-between;align-items:center;padding:14px 6px 2px}.player-meta p{margin:5px 0 0;color:var(--muted)}.badge{display:inline-flex;border-radius:999px;padding:6px 10px;background:rgba(6,182,212,.18);color:#a5f3fc;border:1px solid rgba(6,182,212,.28);font-size:12px;font-weight:850}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:18px 5vw 42px}.stats article,.plan,.card,.architecture .flow div{background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:22px;padding:22px}.stats strong{display:block;font-size:28px}.stats span{color:var(--muted)}.section{padding:56px 5vw}.section h2{font-size:clamp(28px,4vw,48px);margin:8px 0 22px;letter-spacing:-.05em}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px}input{width:min(430px,100%);padding:14px 18px;border-radius:18px;border:1px solid var(--border);background:rgba(255,255,255,.06);color:var(--text);outline:none}.chips{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 24px}.chip{border:1px solid var(--border);background:rgba(255,255,255,.05);color:var(--muted);border-radius:999px;padding:10px 14px;cursor:pointer;font-weight:750}.chip.active{background:#fff;color:#0f172a}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.card{overflow:hidden;padding:0;cursor:pointer;transition:.2s}.card:hover{transform:translateY(-5px);border-color:rgba(103,232,249,.5)}.poster{height:230px;background:linear-gradient(135deg,#312e81,#0891b2);display:flex;align-items:end;padding:16px;font-size:42px}.card-body{padding:16px}.card h3{margin:0 0 8px}.meta{display:flex;gap:7px;flex-wrap:wrap;color:var(--muted);font-size:13px}.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.plan strong{font-size:38px}.plan.hot{background:linear-gradient(180deg,rgba(124,58,237,.34),rgba(6,182,212,.12));border-color:rgba(103,232,249,.35)}.plan li{margin:10px 0;color:var(--muted)}.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.flow span{display:block;color:var(--muted);margin-top:6px}.warning{margin-top:18px;border:1px solid rgba(245,158,11,.35);background:rgba(245,158,11,.12);border-radius:20px;padding:18px;color:#fde68a}.cinema{--bg:#000;background:#000}@media(max-width:1000px){.hero,.grid,.plan-grid,.flow{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr 1fr}.section-head{align-items:start;flex-direction:column}}@media(max-width:640px){nav{display:none}.hero,.grid,.plan-grid,.flow,.stats{grid-template-columns:1fr}.hero{padding-top:44px}.poster{height:190px}}
