*{box-sizing:border-box}
:root{color-scheme:dark;--bg:#080b10;--cyan:#05b9ff;--green:#00a85a;--muted:#c8d0d9}
html{min-height:100%;background:var(--bg)}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 42%,#071a2b 0%,#080b10 54%);color:#f3f6fa;font-family:Arial,Helvetica,sans-serif}
.hero{width:min(100% - 36px,760px);margin:0 auto;padding:42px 0 50px;text-align:center}
.eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid #00aeea;border-radius:30px;padding:8px 17px;color:#12c4ff;font-size:12px;font-weight:800;letter-spacing:4px}
.eyebrow span{width:6px;height:6px;border-radius:50%;background:#10c5ff;box-shadow:0 0 12px #10c5ff}
h1{max-width:690px;margin:28px auto 0;font-size:clamp(36px,7.1vw,64px);line-height:1.02;font-weight:900;letter-spacing:-2.6px;color:#d8e4ef}
h1 em{font-style:normal;color:#08baff;text-shadow:0 0 20px #009de9}
h1 strong{display:block;margin-top:10px;color:#ff3157}
.intro{margin:40px auto 36px;color:#d0d1d5;font-size:17px;line-height:1.65}
.visual{width:min(100%,448px);margin:0 auto 48px;border-radius:19px;overflow:hidden;box-shadow:0 0 30px #0079c955}
.visual img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:#06162b}
.offer{width:min(100%,448px);margin:0 auto;padding:31px 32px 24px;border:1px solid #075079;border-radius:19px;background:#111315;box-shadow:0 0 28px #00aaff35}
.old-price{margin:0 0 8px;color:#d4d4d4;font-size:14px;text-decoration:line-through}
.access{margin:0;color:#d6d6d6;font-size:15px}
.price{margin:10px 0 34px;color:#09baff;font-size:clamp(48px,10vw,60px);font-weight:900;letter-spacing:-2px;text-shadow:0 0 18px #009fe8a8}
#buy-button,.dialog-action{width:100%;border:0;border-radius:14px;background:var(--green);color:white;padding:19px 16px;font-size:18px;font-weight:900;letter-spacing:.3px;cursor:pointer;transition:filter .2s,transform .2s}
#buy-button:hover,.dialog-action:hover{filter:brightness(1.12);transform:translateY(-1px)}
.secure{margin:16px 0 0;color:#89939d;font-size:12px}
.secure span{color:#00c879;margin-right:5px}
footer{padding:0 16px 24px;text-align:center;color:#69737e;font-size:12px}
dialog{width:min(calc(100% - 32px),420px);border:1px solid #075079;border-radius:18px;background:#10151c;color:#eef5fb;padding:30px;box-shadow:0 0 40px #009fe855;text-align:center}
dialog::backdrop{background:#000b}
.dialog-icon{font-size:32px;color:#08baff}
dialog h2{margin:12px 0;font-size:22px}
dialog p{color:#c1cbd5;line-height:1.6;font-size:14px}
.close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#cbd5df;font-size:28px;cursor:pointer}
.dialog-action{margin-top:12px;padding:14px}
@media(max-width:520px){.hero{padding-top:28px}.eyebrow{font-size:10px;letter-spacing:2.5px}h1{letter-spacing:-1.5px}.intro{font-size:15px;margin:28px auto}.desktop{display:none}.visual{margin-bottom:30px}.offer{padding:27px 20px 22px}}
