:root{
  --bg:#F1EFF7; --surface:#FFFFFF; --surface-2:#E8E5F2; --ink:#1E1A33; --muted:#6B6585;
  --line:#DCD8EA; --accent:#5B3FD6; --glow:#9B7BFF;
  color-scheme:light; box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#14111F; --surface:#1D1930; --surface-2:#262140; --ink:#F1EEFA; --muted:#A39DBD;
    --line:#2E2946; --accent:#A994FF; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#14111F; --surface:#1D1930; --surface-2:#262140; --ink:#F1EEFA; --muted:#A39DBD;
  --line:#2E2946; --accent:#A994FF; color-scheme:dark;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Unbounded,"Arial Black",system-ui,sans-serif;line-height:1.1;margin:0;letter-spacing:-.01em}
button,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;padding:56px 0 40px}
.brand{font-family:Unbounded,system-ui,sans-serif;font-weight:700;font-size:15px;color:var(--muted);margin-bottom:28px;display:flex;align-items:center;gap:10px}
.brand i{width:10px;height:10px;border-radius:50%;background:var(--glow);box-shadow:0 0 12px var(--glow);transition:background .5s,box-shadow .5s}
.hero h1{font-size:clamp(34px,6vw,62px);font-weight:800}
.hero p{color:var(--muted);font-size:18px;max-width:46ch;margin:20px 0 28px}
.cta{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--bg);border:0;border-radius:999px;padding:14px 24px;font-weight:700;cursor:pointer;text-decoration:none}
.cta.alt{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.trust{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px;color:var(--muted);font-size:14px}
.trust b{display:block;color:var(--ink);font-size:15px}
.rig{display:flex;justify-content:center}
.rig svg{width:min(100%,340px);height:auto;filter:drop-shadow(0 30px 60px color-mix(in srgb,var(--glow) 35%,transparent))}

.fan{transform-box:fill-box;transform-origin:center;animation:spin 2.4s linear infinite}
.fan:nth-of-type(2n){animation-duration:2.1s}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.fan{animation:none}html{scroll-behavior:auto}}

section{padding:44px 0}
.sec-h{font-size:clamp(24px,3.4vw,34px);margin-bottom:8px}
.sec-p{color:var(--muted);margin:0 0 26px;max-width:60ch}

.tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.tier{position:relative;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:12px 14px 14px;cursor:pointer;transition:border-color .2s,transform .2s}
.tier:hover{transform:translateY(-2px)}
.tier[aria-pressed="true"]{border-color:var(--tc)}
.tier .thumb{height:96px;display:flex;justify-content:center;margin-bottom:8px}
.tier .thumb svg{height:100%;width:auto}
.tier h3{font-size:16px;font-weight:700}
.tier .for{color:var(--muted);font-size:13px;margin:4px 0 10px;min-height:2.6em}
.tier .pr{font-weight:700;font-size:17px}
.badge{position:absolute;top:-10px;right:12px;background:var(--tc);color:#14111F;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px}

.detail{display:grid;grid-template-columns:.9fr 1.1fr;gap:20px;margin-top:20px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px}
.preview{display:flex;justify-content:center;padding:6px 0 18px}
.preview svg{width:min(100%,260px);height:auto;filter:drop-shadow(0 24px 40px color-mix(in srgb,var(--tc) 30%,transparent))}
.colors{display:flex;gap:10px}
.colors button{flex:1;border:1.5px solid var(--line);background:transparent;border-radius:12px;padding:10px;cursor:pointer;font-weight:600;font-size:14px;display:flex;align-items:center;gap:8px;justify-content:center}
.colors button[aria-pressed="true"]{border-color:var(--ink)}
.sw{width:14px;height:14px;border-radius:50%;border:1px solid var(--muted)}
.bigprice{display:flex;justify-content:space-between;align-items:baseline;margin:20px 0 6px}
.bigprice span{color:var(--muted);font-size:14px}
.bigprice b{font-family:Unbounded,system-ui,sans-serif;font-size:30px}
.incl{list-style:none;padding:0;margin:14px 0 0;font-size:14px}
.incl li{padding:5px 0 5px 24px;position:relative}
.incl li::before{content:"";position:absolute;left:2px;top:11px;width:10px;height:6px;border-left:2px solid var(--tc);border-bottom:2px solid var(--tc);transform:rotate(-45deg)}
.detail h3{font-size:24px;margin-bottom:6px}
.detail .lead{color:var(--muted);margin:0 0 18px}
.spec{list-style:none;padding:0;margin:0 0 18px}
.spec li{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:15px}
.spec li span{color:var(--muted);font-size:13px;padding-top:2px}
.uses{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;padding:0;list-style:none}
.uses li{background:var(--surface-2);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600}
.meter{margin:6px 0 12px}
.meter div{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:6px}
.bar{height:8px;border-radius:4px;background:var(--surface-2);overflow:hidden}
.bar i{display:block;height:100%;background:var(--tc);border-radius:4px;transition:width .5s}

.extras{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.group h4{font-family:Unbounded,system-ui,sans-serif;font-size:14px;margin:0 0 12px;font-weight:700}
.opt{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:8px;cursor:pointer;transition:border-color .2s}
.opt:has(input:checked){border-color:var(--accent)}
.opt.off{opacity:.45;cursor:not-allowed}
.opt input{margin:4px 0 0;accent-color:var(--accent);width:18px;height:18px;flex:none}
.opt .t{flex:1;font-weight:600;font-size:15px}
.opt .t small{display:block;font-weight:500;color:var(--muted);font-size:13px;margin-top:2px}
.opt .p{font-weight:700;font-size:14px;white-space:nowrap}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;counter-reset:s;padding:0;margin:0;list-style:none}
.steps li{counter-increment:s;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px}
.steps li::before{content:counter(s);display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--bg);font-family:Unbounded,system-ui,sans-serif;font-size:13px;font-weight:700;margin-bottom:12px}
.steps b{display:block;margin-bottom:4px}
.steps p{margin:0;color:var(--muted);font-size:14px}

.order{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{margin-bottom:14px}
.field label{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.field input,.field textarea{width:100%;background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-size:16px}
.field textarea{min-height:90px;resize:vertical}
.sum-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:15px}
.sum-row.sub{color:var(--muted);font-size:14px;padding:3px 0 3px 12px}
.sum-sep{border-top:1px solid var(--line);margin:10px 0}
.total{font-family:Unbounded,system-ui,sans-serif;font-size:28px;font-weight:700}
.actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.actions .cta{justify-content:center}
.wa{background:#1FAF5A;color:#fff}
.note{font-size:13px;color:var(--muted);margin-top:14px}
.toast{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom,0px));transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:999px;font-weight:600;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:30}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.rec{display:inline-block;background:var(--accent);color:var(--bg);font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;margin-left:6px;vertical-align:2px}
.nudge{display:flex;gap:12px;align-items:center;justify-content:space-between;background:var(--surface-2);border-radius:14px;padding:12px 14px;margin-top:12px;font-size:14px}
.nudge b{display:block;font-size:15px}
.nudge .cta{padding:10px 16px;flex:none}
.dock{display:none}
footer{padding:30px 0 110px;color:var(--muted);font-size:13px;text-align:center}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:34px}
  .rig{order:-1}.rig svg{width:min(62%,220px)}
  .tiers{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:14px 20px 6px;margin:0 -20px}
  .tier{min-width:170px;scroll-snap-align:start}
  .detail,.order{grid-template-columns:1fr}
  .extras{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;align-items:center;justify-content:space-between;gap:12px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px))}
  .dock small{display:block;color:var(--muted);font-size:12px}
  .dock b{font-family:Unbounded,system-ui,sans-serif;font-size:19px}
  .dock .cta{padding:12px 20px}
}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

.mini{margin:0 0 12px;padding-left:20px;color:var(--muted);font-size:15px}.mini li{padding:3px 0}
a.cta{justify-content:center}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.form-grid .full{grid-column:1/-1}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}
.code{letter-spacing:.4em;font-size:26px;text-align:center;font-family:Unbounded,system-ui,sans-serif}
.err{color:#C2294B;font-size:14px;min-height:1.3em;margin:6px 0}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:6px 0 14px}.chk input{margin-top:4px;width:18px;height:18px;accent-color:var(--accent);flex:none}
.back{display:inline-block;margin-bottom:18px;color:var(--muted);text-decoration:none;font-size:14px}
.ok-ico{width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--bg);display:grid;place-items:center;font-size:28px;margin-bottom:14px}
.nl{max-width:520px}.ok{color:var(--accent);font-weight:600;margin:0 0 12px}