{} *{} {} #IE-warning { display: none; position: fixed; width: 100%; height: 100%; z-index: 9999; background: white; } .IE-warning-message { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; } :root{ --bg:#0b0b0f; --card:#12121a; --muted:#9aa0a6; --text:#f7f7fb; --brand:#7c5cff; --brand-2:#ff5fa2; --accent:#22d3ee; --success:#22c55e; --warning:#f59e0b; --radius:18px; --shadow:0 10px 30px rgba(0,0,0,.35); --max:1120px; } *{box-sizing:border-box} html,body{margin:0;background:radial-gradient(1200px 600px at 80% -10%, rgba(124,92,255,.25), transparent 60%), linear-gradient(180deg, #0b0b0f 0%, #0a0a12 100%); color:var(--text); font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; line-height:1.5} a{color:var(--accent); text-decoration:none} img{max-width:100%; height:auto; display:block} .container{max-width:var(--max); margin-inline:auto; padding: clamp(16px, 3vw, 28px)} .btn{display:inline-flex; align-items:center; gap:.6rem; padding:.95rem 1.25rem; border-radius:12px; background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; border:0; font-weight:700; letter-spacing:.2px; box-shadow:var(--shadow); transition:transform .15s ease, box-shadow .15s ease} .btn:hover{transform:translateY(-2px); box-shadow:0 14px 40px rgba(124,92,255,.35)} .btn.secondary{background:transparent; border:1px solid #2b2b38; color:var(--text)} .pill{display:inline-block; background:linear-gradient(135deg, rgba(124,92,255,.15), rgba(34,211,238,.15)); border:1px solid rgba(255,255,255,.08); padding:.35rem .7rem; border-radius:999px; color:var(--accent); font-weight:600} .grid{display:grid; gap:clamp(16px,2.4vw,28px)} .card{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); padding: clamp(16px, 2.4vw, 24px); box-shadow:var(--shadow)} .section{padding: clamp(40px, 8vw, 90px) 0} .center{text-align:center} .muted{color:var(--muted)} .headline{font-size:clamp(28px, 5vw, 54px); line-height:1.05; letter-spacing:-.02em; margin:0 0 8px} .subhead{font-size:clamp(16px, 2.4vw, 20px); color:#d9d9e6; margin:0 0 16px} header.nav{position:sticky; top:0; z-index:50; backdrop-filter:saturate(120%) blur(8px); background:rgba(10,10,18,.6); border-bottom:1px solid rgba(255,255,255,.06)} .nav-inner{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0} .logo{display:flex; align-items:center; gap:.6rem; font-weight:800; letter-spacing:.4px} .logo-dot{width:10px; height:10px; border-radius:50%; background:linear-gradient(135deg,var(--brand),var(--brand-2))} .hero{display:grid; gap:28px; grid-template-columns: 1.1fr .9fr; align-items:center} @media (max-width:980px){.hero{grid-template-columns:1fr} header.nav{position:static}} .tagline{display:flex; gap:.6rem; align-items:center; flex-wrap:wrap} .badge{display:inline-flex; align-items:center; gap:.4rem; font-size:13px; color:#c9c9d6} .badge svg{opacity:.8} .glass{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:12px 16px} .hero-shot{position:relative; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.08)} .hero-shot::after{content:""; position:absolute; inset:0; background: radial-gradient(350px 120px at 20% 0%, rgba(124,92,255,.25), transparent 50%)} .kpis{grid-template-columns:repeat(4,1fr)} @media (max-width:820px){.kpis{grid-template-columns:repeat(2,1fr)}} .kpi h3{margin:0; font-size:clamp(22px,3vw,30px)} .kpi p{margin:.25rem 0 0; color:var(--muted); font-size:14px} .benefits{grid-template-columns:repeat(3,1fr)} @media (max-width:980px){.benefits{grid-template-columns:1fr}} .benefit h4{margin:.2rem 0 .4rem} .video{aspect-ratio:16/9; background:#0e0e14; border-radius:18px; border:1px dashed rgba(255,255,255,.18); display:grid; place-items:center; color:#a1a1b2} .features{grid-template-columns:1.2fr .8fr} @media (max-width:980px){.features{grid-template-columns:1fr}} .offer{display:grid; grid-template-columns:1fr .9fr; gap:28px; align-items:center} @media (max-width:980px){.offer{grid-template-columns:1fr}} .price{font-size:clamp(28px, 4vw, 42px); font-weight:800} .strike{color:#a1a1b2; text-decoration:line-through; margin-right:.6rem; font-weight:600} .testimonials{grid-template-columns:repeat(3,1fr)} @media (max-width:980px){.testimonials{grid-template-columns:1fr}} .avatar{width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--brand),var(--brand-2))} details.faq{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:16px 18px} details.faq > summary{cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px; font-weight:600} details.faq > summary::-webkit-details-marker{display:none} footer{border-top:1px solid rgba(255,255,255,.08); color:#a7a7b6} .stack{display:flex; gap:10px; flex-wrap:wrap; align-items:center} .inline-form{display:flex; gap:10px; flex-wrap:wrap} .input{background:#0e0e16; border:1px solid rgba(255,255,255,.12); color:var(--text); padding:.9rem 1rem; border-radius:12px; min-width:240px} .notice{font-size:12px; color:#a1a1b2; margin-top:.5rem} /* Utility */ .mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-4{margin-top:1.5rem}.mt-6{margin-top:2rem}.mt-8{margin-top:3rem} .row{display:flex; gap:12px; align-items:center} .chip{padding:.25rem .6rem; border-radius:999px; border:1px solid rgba(255,255,255,.12); color:#cfcfe4; font-size:12px}