
:root{
  --bg:#080b12;
  --bg2:#0d111b;
  --panel:#111826;
  --panel2:#151f30;
  --text:#f6f8ff;
  --muted:#98a3b8;
  --line:rgba(255,255,255,.09);
  --cyan:#ff2b45;
  --purple:#7c3aed;
  --pink:#e11d48;
  --green:#7c3aed;
  --shadow:0 28px 80px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:
  radial-gradient(circle at 15% 5%,rgba(255,43,69,.08),transparent 28%),
  radial-gradient(circle at 85% 20%,rgba(139,92,246,.10),transparent 28%),
  var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
.noise{pointer-events:none;position:fixed;inset:0;opacity:.025;z-index:999;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
.topbar{height:78px;display:flex;align-items:center;gap:30px;padding:0 max(24px,calc((100vw - 1240px)/2));position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(8,11,18,.72);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:1.5px;white-space:nowrap}
.brand b{color:var(--cyan)}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:linear-gradient(135deg,var(--cyan),var(--purple));color:#071018;font-weight:1000;border-radius:7px;box-shadow:0 0 28px rgba(255,43,69,.25);clip-path:polygon(0 0,80% 0,100% 20%,100% 100%,20% 100%,0 80%)}
.nav{display:flex;gap:26px;margin-left:auto}
.nav a{font-size:14px;color:#b9c2d3;position:relative}
.nav a:hover,.nav a.active{color:white}
.nav a.active:after{content:"";position:absolute;height:2px;left:0;right:0;bottom:-10px;background:linear-gradient(90deg,var(--cyan),var(--purple))}
.btn{border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:10px;padding:15px 20px;font-weight:800;transition:.2s transform,.2s filter,.2s background;position:relative;overflow:hidden}
.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn-primary{background:linear-gradient(135deg,var(--cyan),#a855f7 50%,var(--purple));color:#071018;box-shadow:0 12px 40px rgba(255,43,69,.18)}
.btn-secondary{background:#151d2b;color:white;border:1px solid var(--line)}
.btn-outline{background:transparent;color:white;border:1px solid var(--line)}
.btn-small{padding:10px 16px;font-size:13px}
.btn-icon{font-size:22px}
.btn small{display:block;font-size:9px;letter-spacing:1.3px;opacity:.7;text-align:left}
.btn strong{display:block;font-size:14px}
.full{width:100%}
.menu-btn{display:none;background:none;color:white;border:0;font-size:26px;margin-left:auto}
.hero{min-height:100vh;display:flex;align-items:center;padding:130px max(24px,calc((100vw - 1240px)/2)) 90px;position:relative;overflow:hidden}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.hero-content{width:62%;position:relative;z-index:2}
.eyebrow,.kicker{font-size:12px;font-weight:900;letter-spacing:2.2px;color:var(--cyan)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(255,43,69,.18);background:rgba(255,43,69,.04);border-radius:6px}
.live-dot{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 14px var(--green)}
.hero h1,.store-hero h1{font-size:clamp(58px,7.4vw,108px);line-height:.86;letter-spacing:-5px;margin:25px 0 28px;font-weight:1000}
.hero h1 span,.section h2 span,.cta h2 span,.store-hero h1 span{background:linear-gradient(90deg,var(--cyan),#c084fc,var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{max-width:670px;color:#b2bdd0;font-size:18px;line-height:1.7}
.hero-actions{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap}
.status-card{display:flex;align-items:center;gap:24px;margin-top:34px;padding:17px 20px;background:rgba(16,23,36,.72);border:1px solid var(--line);border-radius:12px;width:max-content;max-width:100%;backdrop-filter:blur(10px)}
.status-card>div:not(.status-separator){min-width:100px}
.status-label{display:block;color:#68758b;font-size:9px;font-weight:900;letter-spacing:1.5px;margin-bottom:4px}
.status-card strong{font-size:14px}
.status-separator{width:1px;height:30px;background:var(--line)}
.muted{color:#68758b}
.hero-art{position:absolute;right:4%;top:19%;width:34vw;height:62vh;min-width:360px}
.hero-badge{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%) rotate(-7deg);display:grid;place-items:center;width:260px;height:300px;font-size:190px;font-weight:1000;color:#071018;background:linear-gradient(145deg,var(--cyan),#9333ea 52%,var(--purple));clip-path:polygon(10% 0,90% 0,100% 10%,100% 90%,90% 100%,10% 100%,0 90%,0 10%);box-shadow:0 0 100px rgba(255,43,69,.14)}
.sword{position:absolute;right:0;bottom:3%;font-size:150px;transform:rotate(-20deg);filter:drop-shadow(0 20px 30px #000);z-index:3}
.block{position:absolute;width:90px;height:90px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(145deg,#192233,#0f1622);box-shadow:var(--shadow);transform:rotate(18deg)}
.block:before,.block:after{content:"";position:absolute;background:linear-gradient(145deg,rgba(255,43,69,.12),transparent);inset:10px}
.block-a{left:0;top:16%}.block-b{right:0;top:2%;width:65px;height:65px;transform:rotate(42deg)}.block-c{left:7%;bottom:5%;width:60px;height:60px;transform:rotate(-14deg)}
.orb{position:absolute;border-radius:50%;filter:blur(10px);opacity:.5}.orb-1{width:450px;height:450px;background:rgba(255,43,69,.06);right:10%;top:14%}.orb-2{width:360px;height:360px;background:rgba(139,92,246,.07);right:1%;bottom:4%}
.scroll-hint{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:2px;color:#566276}
.section{padding:110px max(24px,calc((100vw - 1240px)/2))}
.section-dark{background:rgba(255,255,255,.018);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{max-width:800px;margin-bottom:50px}.section-head.compact{max-width:700px}
.section h2,.cta h2{font-size:clamp(38px,5vw,64px);line-height:1.02;letter-spacing:-2.4px;margin:12px 0 18px}
.section-head p,.lead{color:#9da9bd;line-height:1.8;font-size:17px}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.feature-card{position:relative;min-height:255px;padding:28px;background:linear-gradient(180deg,rgba(21,31,48,.9),rgba(12,17,27,.92));border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:.25s transform,.25s border-color}
.feature-card:hover{transform:translateY(-5px);border-color:rgba(255,43,69,.22)}
.feature-card.featured{background:linear-gradient(155deg,rgba(255,43,69,.10),rgba(17,24,38,.94) 55%)}
.feature-icon{font-size:34px}.feature-card h3{font-size:22px;margin:34px 0 10px}.feature-card p{color:#8f9cb1;line-height:1.65;font-size:14px}.card-number{position:absolute;right:20px;top:18px;color:#2c3748;font-size:12px;font-weight:900}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center}
.steps{margin-top:38px;display:grid;gap:16px}
.step{display:flex;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.step>span{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,43,69,.2);border-radius:8px;color:var(--cyan);font-weight:900}.step b,.step small{display:block}.step small{color:#768398;margin-top:4px}
.rank-preview{position:relative;display:grid;gap:12px}.rank-glow{position:absolute;width:300px;height:300px;background:rgba(139,92,246,.13);filter:blur(70px);top:20%;left:20%}
.rank-card{position:relative;padding:26px 28px;border-radius:14px;background:#121a29;border:1px solid var(--line);box-shadow:var(--shadow);transition:.2s transform}.rank-card:hover{transform:translateX(-6px)}
.rank-card h3{font-size:30px;margin:7px 0}.rank-card p{color:#8c98aa;margin:0}.rank-label{font-size:9px;letter-spacing:1.8px;color:#66748a;font-weight:900}.vip{margin-left:60px}.elite{margin-right:35px;background:linear-gradient(90deg,rgba(255,43,69,.08),#121a29)}.mythic{margin-left:30px;background:linear-gradient(90deg,rgba(139,92,246,.12),#121a29)}
.cta{padding:70px max(24px,calc((100vw - 1240px)/2));background:linear-gradient(120deg,rgba(255,43,69,.08),rgba(139,92,246,.10)),#0c111b;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{font-size:44px;margin-bottom:0}
.faq{display:grid;gap:12px;max-width:900px}.faq details{padding:20px 22px;background:#101725;border:1px solid var(--line);border-radius:12px}.faq summary{font-weight:800;cursor:pointer}.faq p{color:#93a0b5;line-height:1.7}.faq a{color:var(--cyan)}
footer{padding:42px max(24px,calc((100vw - 1240px)/2));display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:30px;color:#66748a;font-size:12px}footer p{text-align:center}.footer-links{display:flex;gap:18px}.footer-links a:hover{color:white}
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,120px);background:#18060b;color:#ffd9df;padding:12px 18px;border-radius:10px;font-weight:900;z-index:500;transition:.25s transform;box-shadow:var(--shadow)}.toast.show{transform:translate(-50%,0)}
.store-main{padding-top:78px}.store-hero{padding:100px max(24px,calc((100vw - 1240px)/2)) 80px;min-height:530px;display:flex;align-items:center;background:
radial-gradient(circle at 80% 30%,rgba(139,92,246,.16),transparent 30%),
radial-gradient(circle at 15% 15%,rgba(255,43,69,.10),transparent 25%)}
.store-hero-content{max-width:900px}.store-hero h1{font-size:clamp(48px,7vw,86px);margin-top:18px}.store-hero p{color:#9eabc0;font-size:18px;max-width:700px;line-height:1.7}
.store-note{margin-top:28px;padding:16px 18px;background:rgba(255,255,255,.035);border:1px solid var(--line);border-left:3px solid var(--cyan);border-radius:10px;color:#aab5c7;font-size:14px;max-width:760px}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}.price-card{position:relative;padding:26px;background:#111826;border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column}.price-card.popular{border-color:rgba(255,43,69,.35);box-shadow:0 0 55px rgba(255,43,69,.07)}.mythic-card{background:linear-gradient(180deg,rgba(139,92,246,.12),#111826 45%)}
.popular-badge{position:absolute;right:16px;top:16px;font-size:9px;font-weight:1000;letter-spacing:1.5px;background:var(--cyan);color:#071018;padding:6px 8px;border-radius:6px}.rank-pill{font-size:9px;letter-spacing:2px;color:var(--cyan);font-weight:1000}.price-top h3{font-size:36px;margin:12px 0 7px}.price-top p{color:#8f9caf;line-height:1.55;min-height:66px}.price-card ul{list-style:none;padding:0;margin:20px 0 30px;display:grid;gap:11px;color:#bac4d3;font-size:14px;flex:1}.price-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:20px 0}.price-row span{color:#6c788c;font-size:12px}.price-row strong{color:white}
.shop-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.shop-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:22px;background:#111826;border:1px solid var(--line);border-radius:14px}.shop-card>span{font-size:32px}.shop-card h3{margin:0 0 6px}.shop-card p{margin:0;color:#8290a4;font-size:13px}.mini-buy{background:#182235;border:1px solid var(--line);color:white;border-radius:8px;padding:9px 13px;font-weight:800;cursor:pointer}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.66);backdrop-filter:blur(8px);display:none;place-items:center;z-index:1000;padding:20px}.modal.open{display:grid}.modal-box{position:relative;max-width:470px;background:#111826;border:1px solid var(--line);border-radius:16px;padding:30px;box-shadow:var(--shadow)}.modal-box h3{font-size:30px;margin:12px 0}.modal-box p{color:#93a0b5;line-height:1.65}.modal-close{position:absolute;right:14px;top:10px;background:none;border:0;color:#7f8da3;font-size:28px;cursor:pointer}
@media(max-width:980px){
  .nav{display:none;position:absolute;top:78px;left:16px;right:16px;padding:18px;background:#0e1522;border:1px solid var(--line);border-radius:14px;flex-direction:column}
  .nav.open{display:flex}.menu-btn{display:block}.topbar>.btn{display:none}
  .hero{min-height:auto;padding-top:140px;padding-bottom:100px}.hero-content{width:100%}.hero-art{opacity:.16;right:-15%;top:22%}.hero h1{font-size:70px}
  .feature-grid{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr;gap:50px}.rank-preview{max-width:650px}.pricing-grid{grid-template-columns:1fr}.shop-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .topbar{height:70px;padding:0 18px}.store-main{padding-top:70px}.brand{font-size:14px}.hero{padding:118px 20px 82px}.hero h1,.store-hero h1{font-size:50px;letter-spacing:-3px}.hero-sub,.store-hero p{font-size:16px}.hero-art{display:none}
  .hero-actions{display:grid}.hero-actions .btn{width:100%}.status-card{width:100%;gap:12px;justify-content:space-between}.status-card>div:not(.status-separator){min-width:0}.status-card strong{font-size:12px}
  .section{padding:78px 20px}.section h2{font-size:42px}.feature-grid{grid-template-columns:1fr}.feature-card{min-height:220px}.vip,.elite,.mythic{margin-left:0;margin-right:0}
  .cta{padding:55px 20px}.cta-inner{align-items:flex-start;flex-direction:column}.cta h2{font-size:38px}.cta .btn{width:100%}
  footer{padding:36px 20px;grid-template-columns:1fr;text-align:center}footer .brand{justify-content:center}footer p{text-align:center}.footer-links{justify-content:center}
  .store-hero{padding:76px 20px 60px}.shop-card{grid-template-columns:auto 1fr}.shop-card .mini-buy{grid-column:1/-1}.price-card{padding:22px}
}
