:root { color-scheme:dark; --bg:#10151f; --surface:#1b2433; --surface2:#222e42; --line:#344155; --text:#ecf2ff; --muted:#aab7cc; --cyan:#8ce8f3; --violet:#a482ff; }
* { box-sizing:border-box; }
html { font-family:"Segoe UI",system-ui,sans-serif; }
body { margin:0; color:var(--text); background:radial-gradient(circle at 90% 0%,#1b2c48 0,transparent 42%),var(--bg); min-height:100vh; }
a { color:inherit; }
button,input { font:inherit; }
.site-nav { display:flex; align-items:center; justify-content:flex-end; gap:16px; min-height:62px; padding:10px max(20px,calc((100vw - 1160px)/2)); border-bottom:1px solid var(--line); background:#10151fe8; }
.site-mark { display:inline-flex; align-items:center; gap:10px; white-space:nowrap; text-decoration:none; font-size:14px; font-weight:700; letter-spacing:.09em; }
.site-mark b { color:var(--cyan); font-weight:400; }
.site-symbol { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; background:linear-gradient(135deg,#7d4eff,#1ec4d8); font-size:23px; }
.site-nav-links { display:flex; flex-wrap:wrap; gap:4px; }
.site-nav-links a { padding:9px 13px; border-radius:8px; color:#b5bfd3; text-decoration:none; font-size:14px; font-weight:600; }
.site-nav-links a:hover,.site-nav-links a.selected { color:white; background:#263149; }
main { max-width:1160px; margin:auto; padding:62px 20px 100px; }
.eyebrow { margin:0 0 14px; color:var(--cyan); font-size:13px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
h1 { margin:0; max-width:850px; font-size:clamp(36px,5vw,64px); line-height:1.08; letter-spacing:-.045em; }
.lead { max-width:650px; margin:24px 0 0; color:var(--muted); font-size:19px; line-height:1.55; }
.layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:20px; margin-top:48px; }
.card { padding:30px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(155deg,#202c40,#182130); box-shadow:0 24px 64px #0002; }
.card h2 { margin:0 0 14px; font-size:25px; letter-spacing:-.025em; }
.card p { color:var(--muted); line-height:1.55; }
.status { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid #566078; border-radius:999px; background:#293249; color:#cbd5e8; font-size:14px; font-weight:600; }
.status::before { content:""; width:8px; height:8px; border-radius:50%; background:#c5ad7f; }
.steps { margin:24px 0 0; padding:0; list-style:none; counter-reset:step; }
.steps li { display:flex; gap:17px; padding:18px 0; border-top:1px solid var(--line); line-height:1.5; counter-increment:step; }
.steps li::before { content:counter(step,decimal-leading-zero); color:var(--cyan); font-weight:700; }
.cta { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 18px; border:1px solid transparent; border-radius:10px; background:var(--cyan); color:#0b1723; text-decoration:none; font-weight:700; cursor:pointer; }
.cta:hover { filter:brightness(1.08); }
.cta.secondary { background:transparent; border-color:#52617b; color:var(--text); }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.note { margin-top:17px; color:var(--muted); font-size:14px; }
.shop-visual { position:relative; display:grid; place-items:center; min-height:260px; margin:-30px -30px 28px; overflow:hidden; border-radius:20px 20px 0 0; background:radial-gradient(circle at center,#5832ae 0,#263b64 38%,#121c2f 77%); }
.shop-visual span { color:white; font-size:clamp(58px,10vw,110px); font-weight:800; letter-spacing:-.12em; text-shadow:0 0 55px #86dfff9c; transform:translateX(-.06em); }
.shop-visual::after { content:""; position:absolute; inset:12%; border:1px solid #ad9aff55; border-radius:50%; box-shadow:0 0 55px #755dff66,inset 0 0 55px #755dff44; }
.shop-message { min-height:calc(100dvh - 62px); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:32px 20px; }
.shop-message h1 { font-size:clamp(35px,5vw,62px); }
.shop-message p { margin:20px 0 0; max-width:650px; font-size:clamp(18px,2.3vw,25px); line-height:1.45; color:var(--muted); }
@media(max-width:760px) { .site-nav { padding:10px 20px; } .site-nav-links a { padding:8px; } main { padding-top:44px; } .layout { grid-template-columns:1fr; margin-top:34px; } .card { padding:22px; } .shop-visual { margin:-22px -22px 22px; } }