:root{
      --bg:#050609;--panel:rgba(10,12,18,.72);--panel2:rgba(255,255,255,.045);
      --gold:#f9c531;--gold2:#d4a83b;--gold3:#9d760d;--text:#f8fafc;--muted:#aab4c3;
      --line:rgba(249,197,49,.18);--green:#22c55e;--shadow:0 26px 80px rgba(0,0,0,.48);
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{
      min-height:100vh;font-family:Inter,system-ui,sans-serif;color:var(--text);overflow-x:hidden;
      background:
        radial-gradient(circle at 12% 0%,rgba(249,197,49,.16),transparent 28rem),
        radial-gradient(circle at 92% 12%,rgba(255,255,255,.075),transparent 26rem),
        radial-gradient(circle at 50% 110%,rgba(249,197,49,.09),transparent 30rem),
        linear-gradient(180deg,rgba(3,4,7,.50),rgba(5,6,9,.88)),
        url('../images/spg2.jpg') center/cover fixed no-repeat,#050609;
    }
    body::before{
      content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
      background:linear-gradient(180deg,rgba(5,6,8,.42),rgba(5,6,8,.76)),radial-gradient(circle at 50% 0%,rgba(249,197,49,.16),transparent 42%);
    }
    body::after{
      content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
      background-image:linear-gradient(rgba(249,197,49,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(249,197,49,.035) 1px,transparent 1px);
      background-size:46px 46px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 78%);
    }
    a{text-decoration:none;color:inherit}
    img{max-width:100%;height:auto;display:block;user-select:none;-webkit-user-drag:none}
    .container{width:min(1180px,calc(100% - 32px));margin-inline:auto}
    .glass{
      border:1px solid var(--line);border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.028)),var(--panel);
      box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);
    }

    .brand-wrap{display:inline-flex;align-items:center;gap:14px;min-width:0}
    .brand-mark{width:68px;height:68px;flex:0 0 68px;display:grid;place-items:center;filter:drop-shadow(0 12px 24px rgba(0,0,0,.34))}
    .brand-mark img{width:100%;height:100%;object-fit:contain}
    .brand-mark.logo-fallback{border-radius:18px;background:linear-gradient(145deg,#5d430f,#b8860b 55%,#f0d582);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 18px 34px rgba(0,0,0,.28)}
    .brand-mark.logo-fallback::before{content:'CG';color:#fff;font-family:Oxanium,Inter,sans-serif;font-size:22px;font-weight:900;letter-spacing:-.05em}
    .brand-copy{display:grid;gap:3px;line-height:.82;font-family:Oxanium,Inter,sans-serif;min-width:0}
    .brand-line{display:inline-block;overflow:hidden;white-space:nowrap;font-weight:900;text-transform:uppercase;line-height:.88}
    .brand-line.top{color:var(--gold2);font-size:clamp(22px,3vw,38px);text-shadow:0 2px 0 rgba(96,62,8,.95),0 7px 16px rgba(0,0,0,.32)}
    .brand-line.bottom{color:#fff;margin-top:4px;font-size:clamp(29px,4vw,50px);text-shadow:0 2px 0 rgba(80,80,80,.95),0 8px 18px rgba(0,0,0,.34)}
    .site-header .brand-line{max-width:0}
    .site-header .brand-line.top{animation:typeTop 5.8s steps(9,end) infinite}
    .site-header .brand-line.bottom{animation:typeBottom 5.8s steps(6,end) infinite}
    .site-header .brand-line.bottom::after{content:"";display:inline-block;width:3px;height:.78em;margin-left:5px;vertical-align:-.05em;border-radius:999px;background:#fff;animation:blink .72s steps(1,end) infinite}
    @keyframes typeTop{0%,6%{max-width:0}24%,80%{max-width:13ch}98%,100%{max-width:0}}
    @keyframes typeBottom{0%,24%{max-width:0}42%,60%{max-width:9ch}76%,100%{max-width:0}}
    @keyframes blink{0%,48%{opacity:1}49%,100%{opacity:0}}

    .site-header{position:sticky;top:0;z-index:200;min-height:86px;display:flex;align-items:center;border-bottom:1px solid rgba(249,197,49,.14);background:linear-gradient(180deg,rgba(7,8,12,.92),rgba(5,6,9,.86));box-shadow:0 22px 60px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.05);backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%)}
    .header-inner{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:14px}
    .menu-btn{width:58px;height:58px;border-radius:20px;border:1px solid rgba(249,197,49,.22);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(184,134,11,.05));color:#f6f0e6;font-size:24px;display:grid;place-items:center;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 12px 28px rgba(0,0,0,.24)}

    .side-overlay{position:fixed;inset:0;z-index:300;display:none;background:rgba(0,0,0,.42);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
    .side-overlay.show{display:block}
    .side-menu{position:fixed;top:22px;right:-430px;z-index:301;width:min(410px,calc(100% - 22px));height:auto;max-height:calc(100vh - 150px);overflow-y:auto;padding-bottom:14px;border-radius:16px;border:1px solid rgba(255,179,0,1);background:rgba(255,179,0,.14);box-shadow:0 4px 30px rgba(0,0,0,.1);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);transition:right .34s cubic-bezier(.22,1,.36,1)}
    .side-menu.open{right:10px}
    .side-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px;border-bottom:1px solid rgba(255,179,0,.42)}
    .side-brand-static{display:inline-flex;align-items:center;gap:10px;min-width:0;max-width:calc(100% - 102px);overflow:hidden;flex:1 1 auto}
    .side-brand-static .brand-mark{width:48px;height:48px;flex:0 0 48px}
    .side-brand-static .brand-copy{display:grid;gap:3px;overflow:hidden}
    .side-brand-static .brand-line{width:auto;max-width:none;animation:none!important;letter-spacing:.045em}
    .side-brand-static .brand-line.top{font-size:16px;color:var(--gold2)}
    .side-brand-static .brand-line.bottom{font-size:20px;color:#fff;margin-top:2px}
    .side-brand-static .brand-line.bottom::after{display:none!important}
    .side-close{min-width:86px;width:86px;height:42px;border-radius:16px;border:1px solid rgba(255,179,0,1);background:rgba(255,179,0,.14);color:#f6f0e6;font-size:11px;font-weight:950;letter-spacing:.18em;cursor:pointer}
    .side-body{padding:12px 14px 2px}
    .account-card{margin-bottom:10px;padding:10px;border-radius:18px;border:1px solid rgba(212,168,59,.24);background:linear-gradient(180deg,rgba(18,18,17,.94),rgba(8,8,10,.98))}
    .account-top{display:flex;align-items:center;gap:9px;margin-bottom:9px}
    .account-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#f2d77c,#d4a83b);color:#0b0d10}
    .account-name{display:block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-size:14px;font-weight:900}
    .account-type{display:inline-flex;margin-top:4px;padding:4px 9px;border-radius:999px;color:#fff;font-size:10px;font-weight:950}
    .account-type.reseller{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
    .account-type.user{background:linear-gradient(135deg,#22c55e,#15803d)}
    .account-balance{min-height:38px;padding:0 10px;border-radius:13px;display:flex;align-items:center;justify-content:space-between;background:rgba(0,0,0,.44);border:1px solid rgba(39,209,127,.20);color:#9aa091;font-size:12px;font-weight:900;text-transform:uppercase}
    .account-balance strong{color:#5bf197;font-size:15px;text-transform:none}
    .side-nav{display:grid;gap:8px}
    .side-link{min-height:46px;display:flex;align-items:center;gap:12px;padding:0 13px;border-radius:15px;background:rgba(8,9,12,.62);border:1px solid rgba(255,179,0,.46);color:#f6f0e6;font-size:13px;font-weight:900}
    .side-link i{width:34px;height:34px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,rgba(255,179,0,.88),rgba(143,103,0,.88));color:#fff;flex:0 0 34px}
    .side-link:hover{background:rgba(18,19,22,.78);border-color:rgba(255,179,0,.78)}
    .side-actions{display:grid;gap:9px;margin-top:12px}
    .side-cta,.side-login-link{min-height:46px;border-radius:16px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:13px;font-weight:950}
    .side-cta{border:0;background:linear-gradient(135deg,#f7dfa0,#f9c531 40%,#c7940e);color:#08090d;box-shadow:0 18px 34px rgba(249,197,49,.18),inset 0 1px 0 rgba(255,255,255,.35);cursor:pointer}
    .side-login-link{background:rgba(5,6,10,.44);border:1px solid rgba(249,197,49,.18);color:#fff}

    .page-loader{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:18px;background:radial-gradient(circle at 15% 0%,rgba(249,197,49,.18),transparent 20rem),linear-gradient(180deg,rgba(5,6,10,.94),rgba(5,6,10,.98));transition:opacity .42s ease,visibility .42s ease}
    .page-loader.hide{opacity:0;visibility:hidden;pointer-events:none}
    .loader-card{width:min(430px,100%);padding:28px 22px 24px;border-radius:28px;border:1px solid rgba(249,197,49,.24);background:radial-gradient(circle at top left,rgba(249,197,49,.14),transparent 16rem),linear-gradient(180deg,rgba(17,19,27,.94),rgba(8,10,14,.97));box-shadow:0 34px 90px rgba(0,0,0,.58);text-align:center}
    .loader-brand{justify-content:center;margin-bottom:16px}
    .loader-brand .brand-mark{width:54px;height:54px;flex-basis:54px}
    .loader-brand .brand-line{max-width:none!important;animation:none!important}
    .loader-brand .brand-line.top{font-size:18px}
    .loader-brand .brand-line.bottom{font-size:23px}
    .loader-badge{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;padding:9px 14px;border-radius:999px;background:rgba(249,197,49,.10);border:1px solid rgba(249,197,49,.18);color:var(--gold);font-size:11px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}
    .loader-copy{max-width:320px;margin:0 auto;color:#cbd5e1;font-size:13px;line-height:1.7;font-weight:700}
    .loader-progress{width:min(280px,100%);height:10px;margin:18px auto 0;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08);border:1px solid rgba(249,197,49,.12)}
    .loader-progress span{display:block;width:42%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8f6700,#f9c531,#f7dfa0);animation:loaderBar 1.15s ease-in-out infinite}
    .loader-note{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:9px;color:#fef3c7;font-size:12px;font-weight:850}
    .loader-note i{color:#ef4444;animation:blink .9s steps(1,end) infinite}
    @keyframes loaderBar{0%{transform:translateX(-110%)}100%{transform:translateX(310%)}}

    .hero{padding:42px 0 18px}
    .hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:22px;align-items:stretch}
    .hero-card{position:relative;overflow:hidden;min-height:430px;padding:42px 34px;display:flex;flex-direction:column;justify-content:center}
    .hero-card::after{content:"";position:absolute;inset:-1px;pointer-events:none;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.05) 42%,transparent 68%),radial-gradient(circle at 82% 12%,rgba(249,197,49,.16),transparent 22rem)}
    .hero-card>*{position:relative;z-index:1}
    .kicker{width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:9px;margin-bottom:18px;padding:10px 15px;border-radius:999px;background:rgba(249,197,49,.11);border:1px solid rgba(249,197,49,.20);color:var(--gold);font-size:12px;font-weight:950;letter-spacing:.16em;text-transform:uppercase}
    .hero h1{font-family:Oxanium,Inter,sans-serif;font-size:clamp(38px,6vw,70px);line-height:1.02;letter-spacing:.01em;max-width:760px;margin-bottom:18px}
    .hero h1 span,.section-title span{color:var(--gold);text-shadow:0 10px 22px rgba(0,0,0,.25)}
    .hero p{max-width:680px;color:#d6dbe6;font-size:15px;line-height:1.82;font-weight:720}
    .premium-pills{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 4px}
    .premium-pills span{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 13px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(249,197,49,.14);color:#f6f0e6;font-size:12px;font-weight:900}
    .premium-pills i{color:var(--gold)}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
    .btn{min-height:54px;padding:0 22px;border-radius:18px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(249,197,49,.18);font-weight:950;cursor:pointer;font-family:inherit;font-size:14px}
    .btn.gold{background:linear-gradient(135deg,#f7dfa0,#f9c531 40%,#c7940e);color:#08090d;box-shadow:0 18px 34px rgba(249,197,49,.18),inset 0 1px 0 rgba(255,255,255,.35)}
    .btn.dark{background:rgba(5,6,10,.44);border-color:rgba(249,197,49,.18);color:#fff}

    .premium-showcase{position:relative;overflow:hidden;padding:24px;min-height:430px;display:flex;flex-direction:column;justify-content:space-between}
    .showcase-glow{position:absolute;width:230px;height:230px;right:-70px;top:-80px;border-radius:50%;background:radial-gradient(circle,rgba(249,197,49,.22),transparent 68%);pointer-events:none}
    .showcase-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px}
    .showcase-brand{display:flex;align-items:center;gap:12px;min-width:0}
    .showcase-icon{width:48px;height:48px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,#f7dfa0,#f9c531 46%,#9d760d);color:#090a0d;box-shadow:0 14px 28px rgba(249,197,49,.18)}
    .showcase-brand strong{display:block;color:#fff;font-weight:950;font-size:15px}
    .showcase-brand small{display:block;color:#99a4b4;font-size:10px;font-weight:900;letter-spacing:.13em}
    .showcase-status{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border-radius:999px;background:rgba(34,197,94,.10);border:1px solid rgba(34,197,94,.22);color:#bbf7d0;font-size:11px;font-weight:950;white-space:nowrap}
    .showcase-status i{font-size:7px;color:var(--green);filter:drop-shadow(0 0 6px rgba(34,197,94,.85))}
    .showcase-balance{position:relative;z-index:1;margin:22px 0;padding:22px;border-radius:26px;border:1px solid rgba(249,197,49,.18);background:radial-gradient(circle at 10% 0%,rgba(249,197,49,.12),transparent 14rem),rgba(0,0,0,.24)}
    .showcase-balance span{display:block;margin-bottom:8px;color:#aab4c3;font-size:12px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
    .showcase-balance strong{display:block;color:#f7dfa0;font-size:clamp(27px,5vw,38px);font-family:Oxanium,Inter,sans-serif;letter-spacing:.04em}
    .metric-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;position:relative;z-index:1}
    .metric{min-height:105px;padding:15px;border-radius:22px;background:rgba(255,255,255,.045);border:1px solid rgba(249,197,49,.13);display:flex;flex-direction:column;justify-content:center}
    .metric i{color:var(--gold);font-size:18px;margin-bottom:10px}
    .metric strong{font-size:18px}
    .metric span{margin-top:3px;color:#aab4c3;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}

    .section{padding:34px 0 0}
    .section-head{margin-bottom:16px}
    .section-title{font-family:Oxanium,Inter,sans-serif;font-size:clamp(28px,5vw,44px);line-height:1.08;letter-spacing:.035em;margin-bottom:8px}
    .section-sub{max-width:680px;color:#aeb8c8;font-size:14px;line-height:1.75;font-weight:720}
    .benefit-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
    .benefit,.step{position:relative;overflow:hidden;padding:22px;border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.022)),rgba(8,10,15,.68);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
    .benefit:hover,.step:hover{transform:translateY(-4px);border-color:rgba(249,197,49,.30);box-shadow:0 28px 70px rgba(0,0,0,.48),0 0 0 1px rgba(249,197,49,.05) inset}
    .benefit-icon,.step-num{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#f7dfa0,#f9c531 48%,#9d760d);color:#090a0d;box-shadow:0 16px 30px rgba(249,197,49,.16);font-size:21px;margin-bottom:16px}
    .benefit h3,.step h3{font-size:16px;font-weight:950;margin-bottom:8px}
    .benefit p,.step p{color:#aab4c3;font-size:12.5px;line-height:1.65;font-weight:700}
    .steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
    .step-num{width:36px;height:36px;border-radius:999px;font-size:15px;font-weight:950}

    .cgo-showcase-grid{display:grid;gap:22px}
    .cgo-showcase-box{position:relative;overflow:hidden;padding:clamp(18px,3vw,28px)}
    .cgo-showcase-box::before{content:"";position:absolute;inset:-1px;pointer-events:none;background:radial-gradient(circle at 14% 8%,rgba(249,197,49,.16),transparent 24rem),linear-gradient(120deg,transparent,rgba(255,255,255,.035),transparent)}
    .cgo-showcase-box>*{position:relative;z-index:1}
    .cgo-games-window{overflow:hidden;width:100%;border-radius:26px}
    .cgo-games-track,.cgo-payment-grid{display:grid;gap:16px;width:100%;align-items:stretch}
    .cgo-games-track{grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/4);transition:transform .38s cubic-bezier(.22,.78,.22,1);will-change:transform}
    .cgo-games-track.no-transition{transition:none!important}
    .cgo-payment-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
    .cgo-showcase-card{min-width:0;min-height:220px;padding:20px 10px 18px;border-radius:30px;border:1px solid rgba(255,255,255,.10);background:radial-gradient(circle at 24% 12%,rgba(249,197,49,.13),transparent 8rem),linear-gradient(180deg,rgba(255,255,255,.078),rgba(255,255,255,.028));display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 30px rgba(0,0,0,.24);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
    .cgo-showcase-card:hover{transform:translateY(-3px);border-color:rgba(249,197,49,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 22px 42px rgba(0,0,0,.32)}
    .cgo-showcase-logo{width:82px;height:82px;border-radius:22px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));box-shadow:inset 0 1px 0 rgba(255,255,255,.10);flex:0 0 82px}
    .cgo-showcase-logo img{width:62px;height:62px;border-radius:18px;object-fit:cover;object-position:center;filter:drop-shadow(0 8px 18px rgba(0,0,0,.18))}
    .cgo-showcase-card.game .cgo-showcase-logo img{width:100%;height:100%;border-radius:22px;object-fit:cover}
    .cgo-showcase-card.payment .cgo-showcase-logo img{object-fit:contain;border-radius:12px}
    .cgo-showcase-name{width:100%;min-height:48px;margin-top:14px;color:#fff;font:900 12px/1.22 Inter,system-ui,sans-serif;letter-spacing:.025em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;overflow:hidden}
    .cgo-showcase-tag{margin-top:auto;color:#f2d77c;font:900 10px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 6px 16px rgba(184,134,11,.18)}

    .contact-modal{position:fixed;inset:0;z-index:700;display:none;align-items:center;justify-content:center;padding:18px}
    .contact-modal.show{display:flex}
    .contact-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
    .contact-card{position:relative;width:min(430px,100%);overflow:hidden;border-radius:32px;border:1px solid rgba(249,197,49,.26);background:radial-gradient(circle at 14% 0%,rgba(249,197,49,.20),transparent 18rem),linear-gradient(180deg,rgba(18,20,28,.95),rgba(7,8,12,.98));box-shadow:0 38px 110px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.08)}
    .contact-head{padding:22px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;border-bottom:1px solid rgba(249,197,49,.15)}
    .contact-kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:8px;color:var(--gold);font-size:11px;font-weight:950;letter-spacing:.14em;text-transform:uppercase}
    .contact-head h3{font-family:Oxanium,Inter,sans-serif;font-size:25px;line-height:1.05}
    .contact-close{width:42px;height:42px;border-radius:14px;border:1px solid rgba(249,197,49,.22);background:rgba(249,197,49,.08);color:var(--gold);cursor:pointer}
    .contact-body{padding:20px 22px 22px}
    .contact-body p{margin-bottom:16px;color:#cbd5e1;font-size:13px;line-height:1.7;font-weight:650}
    .contact-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .contact-btn{min-height:52px;border-radius:17px;display:flex;align-items:center;justify-content:center;gap:9px;color:#fff;font-size:13px;font-weight:950;border:1px solid rgba(255,255,255,.12)}
    .contact-btn.tg{background:linear-gradient(135deg,#229ED9,#136fa0)}
    .contact-btn.wa{background:linear-gradient(135deg,#25D366,#128C7E)}
    .login-note{display:flex;align-items:center;gap:9px;margin-top:12px;padding:12px;border-radius:16px;background:rgba(249,197,49,.07);border:1px solid rgba(249,197,49,.14);color:#fef3c7;font-size:12px;font-weight:850;line-height:1.5}
    footer{padding:30px 0 40px;margin-top:16px;border-top:1px solid rgba(249,197,49,.08);color:#7e8a98;text-align:center;font-size:12px;font-weight:750}

    html,body,img,a,button,.glass,.side-menu{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
    img,svg,canvas,video{pointer-events:none;-webkit-user-drag:none;user-drag:none}
    input,textarea{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}
    @media print{body{display:none!important}}

    @media(max-width:900px){
      .hero-grid{grid-template-columns:1fr}
      .hero-card,.premium-showcase{min-height:auto}
      .benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
    }
    @media(max-width:640px){
      .container{width:min(100% - 24px,1180px)}
      .site-header,.header-inner{min-height:76px}
      .brand-mark{width:54px;height:54px;flex-basis:54px}
      .brand-wrap{gap:10px}
      .brand-line.top{font-size:clamp(15px,5vw,22px)}
      .brand-line.bottom{font-size:clamp(19px,6.8vw,28px)}
      .menu-btn{width:58px;height:58px;border-radius:20px}
      .side-menu{top:14px;max-height:calc(100vh - 90px)}
      .side-brand-static{gap:8px;max-width:calc(100% - 94px)}
      .side-brand-static .brand-mark{width:44px;height:44px;flex-basis:44px}
      .side-brand-static .brand-line.top{font-size:14px}
      .side-brand-static .brand-line.bottom{font-size:17px}
      .side-close{min-width:80px;width:80px;height:40px}
      .hero{padding-top:26px}
      .hero-card{padding:30px 20px;border-radius:30px}
      .hero h1{font-size:clamp(36px,10vw,48px);line-height:1.06}
      .hero p{font-size:13.5px;line-height:1.85}
      .premium-pills{gap:8px;margin-top:18px}
      .premium-pills span{min-height:34px;padding:0 11px;font-size:10.5px}
      .premium-showcase{padding:18px;border-radius:30px}
      .showcase-top{align-items:flex-start}
      .showcase-status{font-size:10px;padding:7px 9px}
      .showcase-balance{padding:18px;border-radius:22px}
      .metric{min-height:94px;padding:12px;border-radius:18px}
      .metric strong{font-size:16px}
      .benefit-grid,.steps{grid-template-columns:1fr}
      .cgo-showcase-grid{gap:18px}
      .cgo-showcase-box{padding:16px;border-radius:24px}
      .cgo-games-track,.cgo-payment-grid{gap:10px}
      .cgo-games-track{grid-auto-columns:calc((100% - 30px)/4)}
      .cgo-showcase-card{min-height:145px;padding:14px 6px 12px;border-radius:22px}
      .cgo-showcase-logo{width:58px;height:58px;border-radius:16px;flex-basis:58px}
      .cgo-showcase-logo img{width:46px;height:46px;border-radius:13px}
      .cgo-showcase-card.game .cgo-showcase-logo img{border-radius:16px}
      .cgo-showcase-name{min-height:44px;margin-top:10px;font-size:10px;letter-spacing:.015em;line-height:1.18}
      .cgo-showcase-tag{font-size:8px;letter-spacing:.10em}
      .cgo-payment-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
      .cgo-payment-grid .cgo-showcase-card.payment{min-height:118px;padding:10px 3px 9px;border-radius:18px}
      .cgo-payment-grid .payment .cgo-showcase-logo{width:42px;height:42px;flex-basis:42px;border-radius:14px}
      .cgo-payment-grid .payment .cgo-showcase-logo img{width:34px;height:34px;border-radius:10px;object-fit:contain}
      .cgo-payment-grid .payment .cgo-showcase-name{min-height:28px;margin-top:8px;font-size:8.2px;line-height:1.12}
      .cgo-payment-grid .payment .cgo-showcase-tag{font-size:6.8px;letter-spacing:.08em}
      .contact-actions{grid-template-columns:1fr}
      .btn{width:100%}
    }
    @media(max-width:380px){
      .cgo-games-track{grid-auto-columns:calc((100% - 20px)/3)}
      .cgo-payment-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
      .cgo-payment-grid .cgo-showcase-card.payment{min-height:108px;padding:9px 2px 8px;border-radius:16px}
      .cgo-payment-grid .payment .cgo-showcase-logo{width:38px;height:38px;flex-basis:38px}
      .cgo-payment-grid .payment .cgo-showcase-logo img{width:30px;height:30px}
      .cgo-payment-grid .payment .cgo-showcase-name{font-size:7.2px}
      .cgo-payment-grid .payment .cgo-showcase-tag{font-size:6.2px}
    }
    @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

    /* CLEAN LITE: Neumorphism + Liquid Glass, optimized */
    :root{
      --bg:#07101e;--bg2:#101a2d;--text:#f7fbff;--muted:#b9c5d6;
      --gold:#ffd66b;--gold2:#ffbd39;--line:rgba(255,255,255,.13);
      --soft:0 14px 34px rgba(0,0,0,.34),inset 1px 1px 0 rgba(255,255,255,.14);
      --neumo:-6px -6px 14px rgba(255,255,255,.04),9px 10px 20px rgba(0,0,0,.32);
    }
    body{
      background:
        radial-gradient(circle at 14% 12%,rgba(117,164,255,.22),transparent 23rem),
        radial-gradient(circle at 86% 14%,rgba(126,232,255,.15),transparent 20rem),
        radial-gradient(circle at 50% 105%,rgba(255,214,107,.16),transparent 28rem),
        linear-gradient(145deg,#07101e,#101a2d 70%,#121d31)!important;
      background-attachment:scroll!important;color:var(--text);
    }
    body::before{
      background:linear-gradient(125deg,rgba(255,255,255,.035),transparent 34%,rgba(255,214,107,.05),transparent 70%)!important;
      filter:none!important;
    }
    body::after{opacity:.42!important;background-size:34px 34px!important}

    .glass,.site-header,.side-menu,.loader-card,.contact-card,.hero-card,.premium-showcase,
    .benefit,.step,.cgo-showcase-box,.cgo-showcase-card,
    .account-card,.side-link,.side-login-link,.login-note{
      background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035)),rgba(10,18,32,.48)!important;
      border:1px solid var(--line)!important;box-shadow:var(--soft),var(--neumo)!important;
      backdrop-filter:blur(10px) saturate(130%)!important;-webkit-backdrop-filter:blur(10px) saturate(130%)!important;
    }
    .site-header{background:linear-gradient(180deg,rgba(12,20,35,.82),rgba(12,20,35,.58))!important;box-shadow:0 10px 26px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.12)!important}
    .hero-grid{align-items:start!important}
    .premium-showcase{min-height:0!important;height:auto!important;align-self:start!important;justify-content:flex-start!important;gap:14px!important;padding:20px!important}
    .showcase-balance{margin:0!important;padding:18px!important}
    .metric-list{margin-top:0!important;gap:10px!important}
    .showcase-glow{width:160px!important;height:160px!important;opacity:.45!important}

    .btn,.menu-btn,.side-close,.side-cta,.side-login-link,.contact-close,.contact-btn{
      background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.04)),rgba(10,18,32,.5)!important;
      border:1px solid var(--line)!important;box-shadow:var(--neumo),inset 1px 1px 0 rgba(255,255,255,.13)!important;
      transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
    }
    .btn.gold,.side-cta,.showcase-icon,.benefit-icon,.step-num,.account-icon,.side-link i,.brand-mark.logo-fallback{
      color:#07101e!important;background:linear-gradient(145deg,#fff0b8,#ffd66b 48%,#ffb62f)!important;
      border-color:rgba(255,235,180,.38)!important;
    }
    .btn:hover,.menu-btn:hover,.side-close:hover,.side-cta:hover,.side-login-link:hover,.contact-close:hover,.contact-btn:hover,
    .benefit:hover,.step:hover,.cgo-showcase-card:hover,.metric:hover{
      transform:translateY(-2px)!important;box-shadow:-5px -5px 12px rgba(255,255,255,.04),8px 10px 20px rgba(0,0,0,.32),inset 1px 1px 0 rgba(255,255,255,.14)!important;
    }
    .section-title,.hero h1,.benefit h3,.step h3,.metric strong,.showcase-brand strong,.contact-head h3,.cgo-showcase-name{color:var(--text)!important}
    .hero p,.section-sub,.benefit p,.step p,.contact-body p,footer{color:var(--muted)!important}
    .brand-line.top,.section-title span,.hero h1 span,.kicker,.loader-badge,.contact-kicker,.cgo-showcase-tag{color:var(--gold2)!important}
    
    @media(max-width:640px){
      .glass,.hero-card,.premium-showcase,.cgo-showcase-box{border-radius:26px!important}
      .premium-showcase{padding:16px!important;gap:12px!important}
      .showcase-balance{padding:16px!important}
            .glass,.site-header,.side-menu,.loader-card,.contact-card,.hero-card,.premium-showcase,
      .benefit,.step,.cgo-showcase-box,.cgo-showcase-card,
      .account-card,.side-link,.side-login-link,.login-note{backdrop-filter:blur(7px) saturate(115%)!important;-webkit-backdrop-filter:blur(7px) saturate(115%)!important;box-shadow:0 10px 22px rgba(0,0,0,.28),inset 1px 1px 0 rgba(255,255,255,.10)!important}
      .btn:hover,.menu-btn:hover,.side-close:hover,.side-cta:hover,.side-login-link:hover,.contact-close:hover,.contact-btn:hover,
      .benefit:hover,.step:hover,.cgo-showcase-card:hover,.metric:hover{transform:none!important}
    }

  
    /* Clean professional reseller page refinement */
    .hero{padding:54px 0 30px}
    .hero-grid{align-items:stretch}
    .hero-card{display:flex;flex-direction:column;justify-content:center}
    .hero-card>p{max-width:620px}
    .clean-benefit-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .premium-showcase{min-height:355px;padding:25px}
    .showcase-status{white-space:nowrap}
    .showcase-preview{position:relative;z-index:1;margin-top:28px;padding:20px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(0,0,0,.16))}
    .preview-label{color:var(--gold);font-size:10px;font-weight:950;letter-spacing:.15em}
    .showcase-preview h3{margin-top:10px;color:#fff;font-size:22px;line-height:1.17;letter-spacing:-.03em}
    .showcase-preview p{margin-top:9px;color:#aab4c3;font-size:12px;line-height:1.65;font-weight:700}
    .preview-list{display:grid;gap:9px;margin-top:17px}
    .preview-list div{display:flex;align-items:center;gap:9px;color:#e7e0d4;font-size:12px;font-weight:850}
    .preview-list i{width:28px;height:28px;display:grid;place-items:center;border-radius:10px;background:rgba(249,197,49,.11);border:1px solid rgba(249,197,49,.18);color:var(--gold)}
    .reseller-requirements{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:18px;align-items:stretch}
    .requirements-card,.application-ready{position:relative;overflow:hidden;padding:24px}
    .requirements-card::before{content:"";position:absolute;width:250px;height:250px;right:-116px;top:-120px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(249,197,49,.15),transparent 68%)}
    .requirements-card>*{position:relative;z-index:1}
    .requirements-kicker{display:inline-flex;align-items:center;gap:8px;min-height:31px;padding:0 11px;border-radius:999px;border:1px solid rgba(249,197,49,.24);background:rgba(249,197,49,.09);color:var(--gold);font-size:10px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}
    .requirements-card h3,.application-ready h3{margin-top:14px;color:#fff;font-size:22px;line-height:1.18;font-family:Oxanium,Inter,sans-serif}
    .requirements-card>p,.application-ready>p{margin-top:9px;color:var(--muted);font-size:13px;line-height:1.7}
    .requirement-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:19px;list-style:none}
    .requirement-list li{min-height:104px;display:flex;align-items:flex-start;gap:11px;padding:14px;border-radius:17px;border:1px solid rgba(255,255,255,.075);background:rgba(4,5,8,.35)}
    .requirement-list i{width:31px;height:31px;display:grid;place-items:center;flex:0 0 31px;border-radius:11px;color:#101116;background:linear-gradient(135deg,#f7dfa0,#f9c531 48%,#c7940e);box-shadow:inset 0 1px 0 rgba(255,255,255,.40);font-size:12px}
    .requirement-list strong{display:block;color:#fff;font-size:12px;font-weight:900;line-height:1.35}
    .requirement-list span{display:block;margin-top:4px;color:var(--muted);font-size:11px;line-height:1.48}
    .application-ready{display:flex;flex-direction:column;border-color:rgba(249,197,49,.28)!important;background:radial-gradient(circle at 95% 8%,rgba(249,197,49,.15),transparent 13rem),rgba(10,12,18,.72)}
    .ready-icon{width:50px;height:50px;display:grid;place-items:center;border-radius:18px;color:#0c0d10;background:linear-gradient(135deg,#f9e7a7,var(--gold));box-shadow:0 16px 31px rgba(249,197,49,.16),inset 0 1px 0 rgba(255,255,255,.48);font-size:19px}
    .ready-list{display:grid;gap:10px;margin:18px 0 20px;list-style:none}
    .ready-list li{display:flex;align-items:flex-start;gap:9px;color:#d5d9e0;font-size:12px;font-weight:750;line-height:1.5}
    .ready-list i{width:18px;color:#5bf197;padding-top:1px;text-align:center}
    .application-note{margin-top:auto;padding:12px;border-radius:14px;border:1px solid rgba(116,167,255,.16);background:rgba(116,167,255,.055);color:#cbd9f7;font-size:11px;line-height:1.55}
    .application-note i{color:#a9c4ff;margin-right:6px}
    .application-ready .btn{width:100%;margin-top:14px}
    @media(max-width:900px){
      .clean-benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .reseller-requirements{grid-template-columns:1fr}
    }
    @media(max-width:620px){
      .hero{padding-top:34px}
      .premium-showcase{min-height:auto}
      .showcase-preview{margin-top:20px}
      .clean-benefit-grid,.requirement-list{grid-template-columns:1fr}
      .requirements-card,.application-ready{padding:19px}
      .requirements-card h3,.application-ready h3{font-size:20px}
      .requirement-list li{min-height:0}
    }



:root { --bg: #050609; --panel: rgba(10,12,18,.72); --panel2: rgba(255,255,255,.045); --gold: #f9c531; --gold2: #d4a83b; --gold3: #9d760d; --text: #f8fafc; --muted: #aab4c3; --line: rgba(249,197,49,.18); --green: #22c55e; --shadow: 0 26px 80px rgba(0,0,0,.48); }
* { box-sizing: border-box; margin: 0px; padding: 0px; }
html { scroll-behavior: smooth; }
body { min-height: 100vh; font-family: Inter, system-ui, sans-serif; color: var(--text); overflow-x: hidden; background: radial-gradient(circle at 12% 0%, rgba(249, 197, 49, 0.16), transparent 28rem), radial-gradient(circle at 92% 12%, rgba(255, 255, 255, 0.075), transparent 26rem), radial-gradient(circle at 50% 110%, rgba(249, 197, 49, 0.09), transparent 30rem), linear-gradient(rgba(3, 4, 7, 0.5), rgba(5, 6, 9, 0.88)), url("../images/spg2.jpg") center center / cover no-repeat fixed, rgb(5, 6, 9); }
body::before { content: ""; position: fixed; inset: 0px; z-index: -1; pointer-events: none; background: linear-gradient(rgba(5, 6, 8, 0.42), rgba(5, 6, 8, 0.76)), radial-gradient(circle at 50% 0%, rgba(249, 197, 49, 0.16), transparent 42%); }
body::after { content: ""; position: fixed; inset: 0px; z-index: -1; pointer-events: none; background-image: linear-gradient(rgba(249, 197, 49, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(249, 197, 49, 0.035) 1px, transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(rgba(0, 0, 0, 0.72), transparent 78%); }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; user-select: none; -webkit-user-drag: none; }
.container { width: min(1180px, 100% - 32px); margin-inline: auto; }
.glass { border: 1px solid var(--line); border-radius: 34px; background: linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.028)),var(--panel); box-shadow: var(--shadow),inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter: blur(18px) saturate(150%); }
.brand-wrap { display: inline-flex; align-items: center; gap: 14px; min-width: 0px; }
.brand-mark { width: 68px; height: 68px; flex: 0 0 68px; display: grid; place-items: center; filter: drop-shadow(rgba(0, 0, 0, 0.34) 0px 12px 24px); }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.brand-mark.logo-fallback { border-radius: 18px; background: linear-gradient(145deg, rgb(93, 67, 15), rgb(184, 134, 11) 55%, rgb(240, 213, 130)); box-shadow: rgba(255, 255, 255, 0.22) 0px 1px 0px inset, rgba(0, 0, 0, 0.28) 0px 18px 34px; }
.brand-mark.logo-fallback::before { content: "CG"; color: rgb(255, 255, 255); font-family: Oxanium, Inter, sans-serif; font-size: 22px; font-weight: 900; letter-spacing: -0.05em; }
.brand-copy { display: grid; gap: 3px; line-height: 0.82; font-family: Oxanium, Inter, sans-serif; min-width: 0px; }
.brand-line { display: inline-block; overflow: hidden; white-space: nowrap; font-weight: 900; text-transform: uppercase; line-height: 0.88; }
.brand-line.top { color: var(--gold2); font-size: clamp(22px, 3vw, 38px); text-shadow: rgba(96, 62, 8, 0.95) 0px 2px 0px, rgba(0, 0, 0, 0.32) 0px 7px 16px; }
.brand-line.bottom { color: rgb(255, 255, 255); margin-top: 4px; font-size: clamp(29px, 4vw, 50px); text-shadow: rgba(80, 80, 80, 0.95) 0px 2px 0px, rgba(0, 0, 0, 0.34) 0px 8px 18px; }
.site-header .brand-line { max-width: 0px; }
.site-header .brand-line.top { animation: 5.8s steps(9) 0s infinite normal none running typeTop; }
.site-header .brand-line.bottom { animation: 5.8s steps(6) 0s infinite normal none running typeBottom; }
.site-header .brand-line.bottom::after { content: ""; display: inline-block; width: 3px; height: 0.78em; margin-left: 5px; vertical-align: -0.05em; border-radius: 999px; background: rgb(255, 255, 255); animation: 0.72s steps(1) 0s infinite normal none running blink; }
@keyframes typeTop { 
  0%, 6% { max-width: 0px; }
  24%, 80% { max-width: 13ch; }
  98%, 100% { max-width: 0px; }
}
@keyframes typeBottom { 
  0%, 24% { max-width: 0px; }
  42%, 60% { max-width: 9ch; }
  76%, 100% { max-width: 0px; }
}
@keyframes blink { 
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}
.site-header { position: sticky; top: 0px; z-index: 200; min-height: 86px; display: flex; align-items: center; border-bottom: 1px solid rgba(249, 197, 49, 0.14); background: linear-gradient(rgba(7, 8, 12, 0.92), rgba(5, 6, 9, 0.86)); box-shadow: rgba(0, 0, 0, 0.36) 0px 22px 60px, rgba(255, 255, 255, 0.05) 0px 1px 0px inset; backdrop-filter: blur(18px) saturate(130%); }
.header-inner { min-height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.menu-btn { width: 58px; height: 58px; border-radius: 20px; border: 1px solid rgba(249, 197, 49, 0.22); background: linear-gradient(rgba(255, 255, 255, 0.09), rgba(184, 134, 11, 0.05)); color: rgb(246, 240, 230); font-size: 24px; display: grid; place-items: center; cursor: pointer; box-shadow: rgba(255, 255, 255, 0.09) 0px 1px 0px inset, rgba(0, 0, 0, 0.24) 0px 12px 28px; }
.side-overlay { position: fixed; inset: 0px; z-index: 300; display: none; background: rgba(0, 0, 0, 0.42); backdrop-filter: blur(2px); }
.side-overlay.show { display: block; }
.side-menu { position: fixed; top: 22px; right: -430px; z-index: 301; width: min(410px, 100% - 22px); height: auto; max-height: calc(-150px + 100vh); overflow-y: auto; padding-bottom: 14px; border-radius: 16px; border: 1px solid rgb(255, 179, 0); background: rgba(255, 179, 0, 0.14); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 30px; backdrop-filter: blur(2px); transition: right 0.34s cubic-bezier(0.22, 1, 0.36, 1); }
.side-menu.open { right: 10px; }
.side-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px; border-bottom: 1px solid rgba(255, 179, 0, 0.42); }
.side-brand-static { display: inline-flex; align-items: center; gap: 10px; min-width: 0px; max-width: calc(100% - 102px); overflow: hidden; flex: 1 1 auto; }
.side-brand-static .brand-mark { width: 48px; height: 48px; flex: 0 0 48px; }
.side-brand-static .brand-copy { display: grid; gap: 3px; overflow: hidden; }
.side-brand-static .brand-line { width: auto; max-width: none; letter-spacing: 0.045em; animation: auto ease 0s 1 normal none running none !important; }
.side-brand-static .brand-line.top { font-size: 16px; color: var(--gold2); }
.side-brand-static .brand-line.bottom { font-size: 20px; color: rgb(255, 255, 255); margin-top: 2px; }
.side-brand-static .brand-line.bottom::after { display: none !important; }
.side-close { min-width: 86px; width: 86px; height: 42px; border-radius: 16px; border: 1px solid rgb(255, 179, 0); background: rgba(255, 179, 0, 0.14); color: rgb(246, 240, 230); font-size: 11px; font-weight: 950; letter-spacing: 0.18em; cursor: pointer; }
.side-body { padding: 12px 14px 2px; }
.account-card { margin-bottom: 10px; padding: 10px; border-radius: 18px; border: 1px solid rgba(212, 168, 59, 0.24); background: linear-gradient(rgba(18, 18, 17, 0.94), rgba(8, 8, 10, 0.98)); }
.account-top { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.account-icon { width: 38px; height: 38px; border-radius: 13px; display: grid; place-items: center; background: linear-gradient(135deg, rgb(242, 215, 124), rgb(212, 168, 59)); color: rgb(11, 13, 16); }
.account-name { display: block; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgb(255, 255, 255); font-size: 14px; font-weight: 900; }
.account-type { display: inline-flex; margin-top: 4px; padding: 4px 9px; border-radius: 999px; color: rgb(255, 255, 255); font-size: 10px; font-weight: 950; }
.account-type.reseller { background: linear-gradient(135deg, rgb(59, 130, 246), rgb(29, 78, 216)); }
.account-type.user { background: linear-gradient(135deg, rgb(34, 197, 94), rgb(21, 128, 61)); }
.account-balance { min-height: 38px; padding: 0px 10px; border-radius: 13px; display: flex; align-items: center; justify-content: space-between; background: rgba(0, 0, 0, 0.44); border: 1px solid rgba(39, 209, 127, 0.2); color: rgb(154, 160, 145); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.account-balance strong { color: rgb(91, 241, 151); font-size: 15px; text-transform: none; }
.side-nav { display: grid; gap: 8px; }
.side-link { min-height: 46px; display: flex; align-items: center; gap: 12px; padding: 0px 13px; border-radius: 15px; background: rgba(8, 9, 12, 0.62); border: 1px solid rgba(255, 179, 0, 0.46); color: rgb(246, 240, 230); font-size: 13px; font-weight: 900; }
.side-link i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 13px; background: linear-gradient(135deg, rgba(255, 179, 0, 0.88), rgba(143, 103, 0, 0.88)); color: rgb(255, 255, 255); flex: 0 0 34px; }
.side-link:hover { background: rgba(18, 19, 22, 0.78); border-color: rgba(255, 179, 0, 0.78); }
.side-actions { display: grid; gap: 9px; margin-top: 12px; }
.side-cta, .side-login-link { min-height: 46px; border-radius: 16px; display: flex; align-items: center; justify-content: center; gap: 9px; font-size: 13px; font-weight: 950; }
.side-cta { border: 0px; background: linear-gradient(135deg, rgb(247, 223, 160), rgb(249, 197, 49) 40%, rgb(199, 148, 14)); color: rgb(8, 9, 13); box-shadow: rgba(249, 197, 49, 0.18) 0px 18px 34px, rgba(255, 255, 255, 0.35) 0px 1px 0px inset; cursor: pointer; }
.side-login-link { background: rgba(5, 6, 10, 0.44); border: 1px solid rgba(249, 197, 49, 0.18); color: rgb(255, 255, 255); }
.page-loader { position: fixed; inset: 0px; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 18px; background: radial-gradient(circle at 15% 0%, rgba(249, 197, 49, 0.18), transparent 20rem), linear-gradient(rgba(5, 6, 10, 0.94), rgba(5, 6, 10, 0.98)); transition: opacity 0.42s, visibility 0.42s; }
.page-loader.hide { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-card { width: min(430px, 100%); padding: 28px 22px 24px; border-radius: 28px; border: 1px solid rgba(249, 197, 49, 0.24); background: radial-gradient(circle at left top, rgba(249, 197, 49, 0.14), transparent 16rem), linear-gradient(rgba(17, 19, 27, 0.94), rgba(8, 10, 14, 0.97)); box-shadow: rgba(0, 0, 0, 0.58) 0px 34px 90px; text-align: center; }
.loader-brand { justify-content: center; margin-bottom: 16px; }
.loader-brand .brand-mark { width: 54px; height: 54px; flex-basis: 54px; }
.loader-brand .brand-line { max-width: none !important; animation: auto ease 0s 1 normal none running none !important; }
.loader-brand .brand-line.top { font-size: 18px; }
.loader-brand .brand-line.bottom { font-size: 23px; }
.loader-badge { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 9px 14px; border-radius: 999px; background: rgba(249, 197, 49, 0.1); border: 1px solid rgba(249, 197, 49, 0.18); color: var(--gold); font-size: 11px; font-weight: 950; letter-spacing: 0.12em; text-transform: uppercase; }
.loader-copy { max-width: 320px; margin: 0px auto; color: rgb(203, 213, 225); font-size: 13px; line-height: 1.7; font-weight: 700; }
.loader-progress { width: min(280px, 100%); height: 10px; margin: 18px auto 0px; border-radius: 999px; overflow: hidden; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(249, 197, 49, 0.12); }
.loader-progress span { display: block; width: 42%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgb(143, 103, 0), rgb(249, 197, 49), rgb(247, 223, 160)); animation: 1.15s ease-in-out 0s infinite normal none running loaderBar; }
.loader-note { margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 9px; color: rgb(254, 243, 199); font-size: 12px; font-weight: 850; }
.loader-note i { color: rgb(239, 68, 68); animation: 0.9s steps(1) 0s infinite normal none running blink; }
@keyframes loaderBar { 
  0% { transform: translateX(-110%); }
  100% { transform: translateX(310%); }
}
.hero { padding: 42px 0px 18px; }
.hero-grid { display: grid; grid-template-columns: minmax(0px, 1.08fr) minmax(320px, 0.92fr); gap: 22px; align-items: stretch; }
.hero-card { position: relative; overflow: hidden; min-height: 430px; padding: 42px 34px; display: flex; flex-direction: column; justify-content: center; }
.hero-card::after { content: ""; position: absolute; inset: -1px; pointer-events: none; background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.05) 42%, transparent 68%), radial-gradient(circle at 82% 12%, rgba(249, 197, 49, 0.16), transparent 22rem); }
.hero-card > * { position: relative; z-index: 1; }
.kicker { width: max-content; max-width: 100%; display: inline-flex; align-items: center; gap: 9px; margin-bottom: 18px; padding: 10px 15px; border-radius: 999px; background: rgba(249, 197, 49, 0.11); border: 1px solid rgba(249, 197, 49, 0.2); color: var(--gold); font-size: 12px; font-weight: 950; letter-spacing: 0.16em; text-transform: uppercase; }
.hero h1 { font-family: Oxanium, Inter, sans-serif; font-size: clamp(38px, 6vw, 70px); line-height: 1.02; letter-spacing: 0.01em; max-width: 760px; margin-bottom: 18px; }
.hero h1 span, .section-title span { color: var(--gold); text-shadow: rgba(0, 0, 0, 0.25) 0px 10px 22px; }
.hero p { max-width: 680px; color: rgb(214, 219, 230); font-size: 15px; line-height: 1.82; font-weight: 720; }
.premium-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0px 4px; }
.premium-pills span { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0px 13px; border-radius: 999px; background: rgba(255, 255, 255, 0.043); border: 1px solid rgba(249, 197, 49, 0.14); color: rgb(246, 240, 230); font-size: 12px; font-weight: 900; }
.premium-pills i { color: var(--gold); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.btn { min-height: 54px; padding: 0px 22px; border-radius: 18px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid rgba(249, 197, 49, 0.18); font-weight: 950; cursor: pointer; font-family: inherit; font-size: 14px; }
.btn.gold { background: linear-gradient(135deg, rgb(247, 223, 160), rgb(249, 197, 49) 40%, rgb(199, 148, 14)); color: rgb(8, 9, 13); box-shadow: rgba(249, 197, 49, 0.18) 0px 18px 34px, rgba(255, 255, 255, 0.35) 0px 1px 0px inset; }
.btn.dark { background: rgba(5, 6, 10, 0.44); border-color: rgba(249, 197, 49, 0.18); color: rgb(255, 255, 255); }
.premium-showcase { position: relative; overflow: hidden; padding: 24px; min-height: 430px; display: flex; flex-direction: column; justify-content: space-between; }
.showcase-glow { position: absolute; width: 230px; height: 230px; right: -70px; top: -80px; border-radius: 50%; background: radial-gradient(circle, rgba(249, 197, 49, 0.22), transparent 68%); pointer-events: none; }
.showcase-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.showcase-brand { display: flex; align-items: center; gap: 12px; min-width: 0px; }
.showcase-icon { width: 48px; height: 48px; border-radius: 17px; display: grid; place-items: center; background: linear-gradient(135deg, rgb(247, 223, 160), rgb(249, 197, 49) 46%, rgb(157, 118, 13)); color: rgb(9, 10, 13); box-shadow: rgba(249, 197, 49, 0.18) 0px 14px 28px; }
.showcase-brand strong { display: block; color: rgb(255, 255, 255); font-weight: 950; font-size: 15px; }
.showcase-brand small { display: block; color: rgb(153, 164, 180); font-size: 10px; font-weight: 900; letter-spacing: 0.13em; }
.showcase-status { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border-radius: 999px; background: rgba(34, 197, 94, 0.1); border: 1px solid rgba(34, 197, 94, 0.22); color: rgb(187, 247, 208); font-size: 11px; font-weight: 950; white-space: nowrap; }
.showcase-status i { font-size: 7px; color: var(--green); filter: drop-shadow(rgba(34, 197, 94, 0.85) 0px 0px 6px); }
.showcase-balance { position: relative; z-index: 1; margin: 22px 0px; padding: 22px; border-radius: 26px; border: 1px solid rgba(249, 197, 49, 0.18); background: radial-gradient(circle at 10% 0%, rgba(249, 197, 49, 0.12), transparent 14rem), rgba(0, 0, 0, 0.24); }
.showcase-balance span { display: block; margin-bottom: 8px; color: rgb(170, 180, 195); font-size: 12px; font-weight: 900; letter-spacing: 0.09em; text-transform: uppercase; }
.showcase-balance strong { display: block; color: rgb(247, 223, 160); font-size: clamp(27px, 5vw, 38px); font-family: Oxanium, Inter, sans-serif; letter-spacing: 0.04em; }
.metric-list { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; position: relative; z-index: 1; }
.metric { min-height: 105px; padding: 15px; border-radius: 22px; background: rgba(255, 255, 255, 0.043); border: 1px solid rgba(249, 197, 49, 0.13); display: flex; flex-direction: column; justify-content: center; }
.metric i { color: var(--gold); font-size: 18px; margin-bottom: 10px; }
.metric strong { font-size: 18px; }
.metric span { margin-top: 3px; color: rgb(170, 180, 195); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; }
.section { padding: 34px 0px 0px; }
.section-head { margin-bottom: 16px; }
.section-title { font-family: Oxanium, Inter, sans-serif; font-size: clamp(28px, 5vw, 44px); line-height: 1.08; letter-spacing: 0.035em; margin-bottom: 8px; }
.section-sub { max-width: 680px; color: rgb(174, 184, 200); font-size: 14px; line-height: 1.75; font-weight: 720; }
.benefit-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 13px; }
.benefit, .step { position: relative; overflow: hidden; padding: 22px; border-radius: 26px; background: linear-gradient(rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.024)), rgba(8, 10, 15, 0.68); transition: transform 0.22s, border-color 0.22s, box-shadow 0.22s; }
.benefit:hover, .step:hover { transform: translateY(-4px); border-color: rgba(249, 197, 49, 0.3); box-shadow: rgba(0, 0, 0, 0.48) 0px 28px 70px, rgba(249, 197, 49, 0.05) 0px 0px 0px 1px inset; }
.benefit-icon, .step-num { width: 52px; height: 52px; border-radius: 18px; display: grid; place-items: center; background: linear-gradient(135deg, rgb(247, 223, 160), rgb(249, 197, 49) 48%, rgb(157, 118, 13)); color: rgb(9, 10, 13); box-shadow: rgba(249, 197, 49, 0.16) 0px 16px 30px; font-size: 21px; margin-bottom: 16px; }
.benefit h3, .step h3 { font-size: 16px; font-weight: 950; margin-bottom: 8px; }
.benefit p, .step p { color: rgb(170, 180, 195); font-size: 12.5px; line-height: 1.65; font-weight: 700; }
.steps { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 13px; }
.step-num { width: 36px; height: 36px; border-radius: 999px; font-size: 15px; font-weight: 950; }
.cgo-showcase-grid { display: grid; gap: 22px; }
.cgo-showcase-box { position: relative; overflow: hidden; padding: clamp(18px, 3vw, 28px); }
.cgo-showcase-box::before { content: ""; position: absolute; inset: -1px; pointer-events: none; background: radial-gradient(circle at 14% 8%, rgba(249, 197, 49, 0.16), transparent 24rem), linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.035), transparent); }
.cgo-showcase-box > * { position: relative; z-index: 1; }
.cgo-games-window { overflow: hidden; width: 100%; border-radius: 26px; }
.cgo-games-track, .cgo-payment-grid { display: grid; gap: 16px; width: 100%; align-items: stretch; }
.cgo-games-track { grid-auto-flow: column; grid-auto-columns: calc(25% - 12px); transition: transform 0.38s cubic-bezier(0.22, 0.78, 0.22, 1); will-change: transform; }
.cgo-games-track.no-transition { transition: none !important; }
.cgo-payment-grid { grid-template-columns: repeat(4, minmax(0px, 1fr)); }
.cgo-showcase-card { min-width: 0px; min-height: 220px; padding: 20px 10px 18px; border-radius: 30px; border: 1px solid rgba(255, 255, 255, 0.1); background: radial-gradient(circle at 24% 12%, rgba(249, 197, 49, 0.13), transparent 8rem), linear-gradient(rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.027)); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset, rgba(0, 0, 0, 0.24) 0px 16px 30px; transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s; }
.cgo-showcase-card:hover { transform: translateY(-3px); border-color: rgba(249, 197, 49, 0.28); box-shadow: rgba(255, 255, 255, 0.09) 0px 1px 0px inset, rgba(0, 0, 0, 0.32) 0px 22px 42px; }
.cgo-showcase-logo { width: 82px; height: 82px; border-radius: 22px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; flex: 0 0 82px; }
.cgo-showcase-logo img { width: 62px; height: 62px; border-radius: 18px; object-fit: cover; object-position: center center; filter: drop-shadow(rgba(0, 0, 0, 0.18) 0px 8px 18px); }
.cgo-showcase-card.game .cgo-showcase-logo img { width: 100%; height: 100%; border-radius: 22px; object-fit: cover; }
.cgo-showcase-card.payment .cgo-showcase-logo img { object-fit: contain; border-radius: 12px; }
.cgo-showcase-name { width: 100%; min-height: 48px; margin-top: 14px; color: rgb(255, 255, 255); font: 900 12px / 1.22 Inter, system-ui, sans-serif; letter-spacing: 0.025em; text-transform: uppercase; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.cgo-showcase-tag { margin-top: auto; color: rgb(242, 215, 124); font: 900 10px / 1 Inter, system-ui, sans-serif; letter-spacing: 0.12em; text-transform: uppercase; text-shadow: rgba(184, 134, 11, 0.18) 0px 6px 16px; }
.contact-modal { position: fixed; inset: 0px; z-index: 700; display: none; align-items: center; justify-content: center; padding: 18px; }
.contact-modal.show { display: flex; }
.contact-backdrop { position: absolute; inset: 0px; background: rgba(0, 0, 0, 0.68); backdrop-filter: blur(12px); }
.contact-card { position: relative; width: min(430px, 100%); overflow: hidden; border-radius: 32px; border: 1px solid rgba(249, 197, 49, 0.26); background: radial-gradient(circle at 14% 0%, rgba(249, 197, 49, 0.2), transparent 18rem), linear-gradient(rgba(18, 20, 28, 0.95), rgba(7, 8, 12, 0.98)); box-shadow: rgba(0, 0, 0, 0.72) 0px 38px 110px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset; }
.contact-head { padding: 22px; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; border-bottom: 1px solid rgba(249, 197, 49, 0.15); }
.contact-kicker { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 8px; color: var(--gold); font-size: 11px; font-weight: 950; letter-spacing: 0.14em; text-transform: uppercase; }
.contact-head h3 { font-family: Oxanium, Inter, sans-serif; font-size: 25px; line-height: 1.05; }
.contact-close { width: 42px; height: 42px; border-radius: 14px; border: 1px solid rgba(249, 197, 49, 0.22); background: rgba(249, 197, 49, 0.08); color: var(--gold); cursor: pointer; }
.contact-body { padding: 20px 22px 22px; }
.contact-body p { margin-bottom: 16px; color: rgb(203, 213, 225); font-size: 13px; line-height: 1.7; font-weight: 650; }
.contact-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.contact-btn { min-height: 52px; border-radius: 17px; display: flex; align-items: center; justify-content: center; gap: 9px; color: rgb(255, 255, 255); font-size: 13px; font-weight: 950; border: 1px solid rgba(255, 255, 255, 0.12); }
.contact-btn.tg { background: linear-gradient(135deg, rgb(34, 158, 217), rgb(19, 111, 160)); }
.contact-btn.wa { background: linear-gradient(135deg, rgb(37, 211, 102), rgb(18, 140, 126)); }
.login-note { display: flex; align-items: center; gap: 9px; margin-top: 12px; padding: 12px; border-radius: 16px; background: rgba(249, 197, 49, 0.07); border: 1px solid rgba(249, 197, 49, 0.14); color: rgb(254, 243, 199); font-size: 12px; font-weight: 850; line-height: 1.5; }
footer { padding: 30px 0px 40px; margin-top: 16px; border-top: 1px solid rgba(249, 197, 49, 0.08); color: rgb(126, 138, 152); text-align: center; font-size: 12px; font-weight: 750; }
html, body, img, a, button, .glass, .side-menu { user-select: none; }
img, svg, canvas, video { pointer-events: none; -webkit-user-drag: none; }
input, textarea { user-select: text; }
@media print {
  body { display: none !important; }
}
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-card, .premium-showcase { min-height: auto; }
  .benefit-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .steps { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 640px) {
  .container { width: min(100% - 24px, 1180px); }
  .site-header, .header-inner { min-height: 76px; }
  .brand-mark { width: 54px; height: 54px; flex-basis: 54px; }
  .brand-wrap { gap: 10px; }
  .brand-line.top { font-size: clamp(15px, 5vw, 22px); }
  .brand-line.bottom { font-size: clamp(19px, 6.8vw, 28px); }
  .menu-btn { width: 58px; height: 58px; border-radius: 20px; }
  .side-menu { top: 14px; max-height: calc(-90px + 100vh); }
  .side-brand-static { gap: 8px; max-width: calc(100% - 94px); }
  .side-brand-static .brand-mark { width: 44px; height: 44px; flex-basis: 44px; }
  .side-brand-static .brand-line.top { font-size: 14px; }
  .side-brand-static .brand-line.bottom { font-size: 17px; }
  .side-close { min-width: 80px; width: 80px; height: 40px; }
  .hero { padding-top: 26px; }
  .hero-card { padding: 30px 20px; border-radius: 30px; }
  .hero h1 { font-size: clamp(36px, 10vw, 48px); line-height: 1.06; }
  .hero p { font-size: 13.5px; line-height: 1.85; }
  .premium-pills { gap: 8px; margin-top: 18px; }
  .premium-pills span { min-height: 34px; padding: 0px 11px; font-size: 10.5px; }
  .premium-showcase { padding: 18px; border-radius: 30px; }
  .showcase-top { align-items: flex-start; }
  .showcase-status { font-size: 10px; padding: 7px 9px; }
  .showcase-balance { padding: 18px; border-radius: 22px; }
  .metric { min-height: 94px; padding: 12px; border-radius: 18px; }
  .metric strong { font-size: 16px; }
  .benefit-grid, .steps { grid-template-columns: 1fr; }
  .cgo-showcase-grid { gap: 18px; }
  .cgo-showcase-box { padding: 16px; border-radius: 24px; }
  .cgo-games-track, .cgo-payment-grid { gap: 10px; }
  .cgo-games-track { grid-auto-columns: calc(25% - 7.5px); }
  .cgo-showcase-card { min-height: 145px; padding: 14px 6px 12px; border-radius: 22px; }
  .cgo-showcase-logo { width: 58px; height: 58px; border-radius: 16px; flex-basis: 58px; }
  .cgo-showcase-logo img { width: 46px; height: 46px; border-radius: 13px; }
  .cgo-showcase-card.game .cgo-showcase-logo img { border-radius: 16px; }
  .cgo-showcase-name { min-height: 44px; margin-top: 10px; font-size: 10px; letter-spacing: 0.015em; line-height: 1.18; }
  .cgo-showcase-tag { font-size: 8px; letter-spacing: 0.1em; }
  .cgo-payment-grid { grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 8px; }
  .cgo-payment-grid .cgo-showcase-card.payment { min-height: 118px; padding: 10px 3px 9px; border-radius: 18px; }
  .cgo-payment-grid .payment .cgo-showcase-logo { width: 42px; height: 42px; flex-basis: 42px; border-radius: 14px; }
  .cgo-payment-grid .payment .cgo-showcase-logo img { width: 34px; height: 34px; border-radius: 10px; object-fit: contain; }
  .cgo-payment-grid .payment .cgo-showcase-name { min-height: 28px; margin-top: 8px; font-size: 8.2px; line-height: 1.12; }
  .cgo-payment-grid .payment .cgo-showcase-tag { font-size: 6.8px; letter-spacing: 0.08em; }
  .contact-actions { grid-template-columns: 1fr; }
  .btn { width: 100%; }
}
@media (max-width: 380px) {
  .cgo-games-track { grid-auto-columns: calc(33.3333% - 6.66667px); }
  .cgo-payment-grid { grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 6px; }
  .cgo-payment-grid .cgo-showcase-card.payment { min-height: 108px; padding: 9px 2px 8px; border-radius: 16px; }
  .cgo-payment-grid .payment .cgo-showcase-logo { width: 38px; height: 38px; flex-basis: 38px; }
  .cgo-payment-grid .payment .cgo-showcase-logo img { width: 30px; height: 30px; }
  .cgo-payment-grid .payment .cgo-showcase-name { font-size: 7.2px; }
  .cgo-payment-grid .payment .cgo-showcase-tag { font-size: 6.2px; }
}
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
:root { --bg: #07101e; --bg2: #101a2d; --text: #f7fbff; --muted: #b9c5d6; --gold: #ffd66b; --gold2: #ffbd39; --line: rgba(255,255,255,.13); --soft: 0 14px 34px rgba(0,0,0,.34),inset 1px 1px 0 rgba(255,255,255,.14); --neumo: -6px -6px 14px rgba(255,255,255,.04),9px 10px 20px rgba(0,0,0,.32); }
body { color: var(--text); background: radial-gradient(circle at 14% 12%, rgba(117, 164, 255, 0.22), transparent 23rem) scroll, radial-gradient(circle at 86% 14%, rgba(126, 232, 255, 0.15), transparent 20rem), radial-gradient(circle at 50% 105%, rgba(255, 214, 107, 0.16), transparent 28rem), linear-gradient(145deg, rgb(7, 16, 30), rgb(16, 26, 45) 70%, rgb(18, 29, 49)) !important; }
body::before { background: linear-gradient(125deg, rgba(255, 255, 255, 0.035), transparent 34%, rgba(255, 214, 107, 0.05), transparent 70%) !important; filter: none !important; }
body::after { opacity: 0.42 !important; background-size: 34px 34px !important; }
.glass, .site-header, .side-menu, .loader-card, .contact-card, .hero-card, .premium-showcase, .benefit, .step, .cgo-showcase-box, .cgo-showcase-card, .account-card, .side-link, .side-login-link, .login-note { background: linear-gradient(145deg, rgba(255, 255, 255, 0.106), rgba(255, 255, 255, 0.035)), rgba(10, 18, 32, 0.48) !important; border: 1px solid var(--line) !important; box-shadow: var(--soft),var(--neumo) !important; backdrop-filter: blur(10px) saturate(130%) !important; }
.site-header { background: linear-gradient(rgba(12, 20, 35, 0.82), rgba(12, 20, 35, 0.58)) !important; box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 26px, rgba(255, 255, 255, 0.12) 0px 1px 0px inset !important; }
.hero-grid { align-items: start !important; }
.premium-showcase { min-height: 0px !important; height: auto !important; align-self: start !important; justify-content: flex-start !important; gap: 14px !important; padding: 20px !important; }
.showcase-balance { margin: 0px !important; padding: 18px !important; }
.metric-list { margin-top: 0px !important; gap: 10px !important; }
.showcase-glow { width: 160px !important; height: 160px !important; opacity: 0.45 !important; }
.btn, .menu-btn, .side-close, .side-cta, .side-login-link, .contact-close, .contact-btn { background: linear-gradient(145deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.04)), rgba(10, 18, 32, 0.5) !important; border: 1px solid var(--line) !important; box-shadow: var(--neumo),inset 1px 1px 0 rgba(255,255,255,.13) !important; transition: transform 0.18s, box-shadow 0.18s, border-color 0.18s !important; }
.btn.gold, .side-cta, .showcase-icon, .benefit-icon, .step-num, .account-icon, .side-link i, .brand-mark.logo-fallback { color: rgb(7, 16, 30) !important; background: linear-gradient(145deg, rgb(255, 240, 184), rgb(255, 214, 107) 48%, rgb(255, 182, 47)) !important; border-color: rgba(255, 235, 180, 0.38) !important; }
.btn:hover, .menu-btn:hover, .side-close:hover, .side-cta:hover, .side-login-link:hover, .contact-close:hover, .contact-btn:hover, .benefit:hover, .step:hover, .cgo-showcase-card:hover, .metric:hover { transform: translateY(-2px) !important; box-shadow: rgba(255, 255, 255, 0.04) -5px -5px 12px, rgba(0, 0, 0, 0.32) 8px 10px 20px, rgba(255, 255, 255, 0.14) 1px 1px 0px inset !important; }
.section-title, .hero h1, .benefit h3, .step h3, .metric strong, .showcase-brand strong, .contact-head h3, .cgo-showcase-name { color: var(--text) !important; }
.hero p, .section-sub, .benefit p, .step p, .contact-body p, footer { color: var(--muted) !important; }
.brand-line.top, .section-title span, .hero h1 span, .kicker, .loader-badge, .contact-kicker, .cgo-showcase-tag { color: var(--gold2) !important; }
@media (max-width: 640px) {
  .glass, .hero-card, .premium-showcase, .cgo-showcase-box { border-radius: 26px !important; }
  .premium-showcase { padding: 16px !important; gap: 12px !important; }
  .showcase-balance { padding: 16px !important; }
  .glass, .site-header, .side-menu, .loader-card, .contact-card, .hero-card, .premium-showcase, .benefit, .step, .cgo-showcase-box, .cgo-showcase-card, .account-card, .side-link, .side-login-link, .login-note { backdrop-filter: blur(7px) saturate(115%) !important; box-shadow: rgba(0, 0, 0, 0.28) 0px 10px 22px, rgba(255, 255, 255, 0.1) 1px 1px 0px inset !important; }
  .btn:hover, .menu-btn:hover, .side-close:hover, .side-cta:hover, .side-login-link:hover, .contact-close:hover, .contact-btn:hover, .benefit:hover, .step:hover, .cgo-showcase-card:hover, .metric:hover { transform: none !important; }
}
.hero { padding: 54px 0px 30px; }
.hero-grid { align-items: stretch; }
.hero-card { display: flex; flex-direction: column; justify-content: center; }
.hero-card > p { max-width: 620px; }
.clean-benefit-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
.premium-showcase { min-height: 355px; padding: 25px; }
.showcase-status { white-space: nowrap; }
.showcase-preview { position: relative; z-index: 1; margin-top: 28px; padding: 20px; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 22px; background: linear-gradient(rgba(255, 255, 255, 0.055), rgba(0, 0, 0, 0.16)); }
.preview-label { color: var(--gold); font-size: 10px; font-weight: 950; letter-spacing: 0.15em; }
.showcase-preview h3 { margin-top: 10px; color: rgb(255, 255, 255); font-size: 22px; line-height: 1.17; letter-spacing: -0.03em; }
.showcase-preview p { margin-top: 9px; color: rgb(170, 180, 195); font-size: 12px; line-height: 1.65; font-weight: 700; }
.preview-list { display: grid; gap: 9px; margin-top: 17px; }
.preview-list div { display: flex; align-items: center; gap: 9px; color: rgb(231, 224, 212); font-size: 12px; font-weight: 850; }
.preview-list i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 10px; background: rgba(249, 197, 49, 0.11); border: 1px solid rgba(249, 197, 49, 0.18); color: var(--gold); }
.reseller-requirements { display: grid; grid-template-columns: minmax(0px, 1.35fr) minmax(280px, 0.65fr); gap: 18px; align-items: stretch; }
.requirements-card, .application-ready { position: relative; overflow: hidden; padding: 24px; }
.requirements-card::before { content: ""; position: absolute; width: 250px; height: 250px; right: -116px; top: -120px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(249, 197, 49, 0.15), transparent 68%); }
.requirements-card > * { position: relative; z-index: 1; }
.requirements-kicker { display: inline-flex; align-items: center; gap: 8px; min-height: 31px; padding: 0px 11px; border-radius: 999px; border: 1px solid rgba(249, 197, 49, 0.24); background: rgba(249, 197, 49, 0.09); color: var(--gold); font-size: 10px; font-weight: 950; letter-spacing: 0.12em; text-transform: uppercase; }
.requirements-card h3, .application-ready h3 { margin-top: 14px; color: rgb(255, 255, 255); font-size: 22px; line-height: 1.18; font-family: Oxanium, Inter, sans-serif; }
.requirements-card > p, .application-ready > p { margin-top: 9px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.requirement-list { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; margin-top: 19px; list-style: none; }
.requirement-list li { min-height: 104px; display: flex; align-items: flex-start; gap: 11px; padding: 14px; border-radius: 17px; border: 1px solid rgba(255, 255, 255, 0.075); background: rgba(4, 5, 8, 0.35); }
.requirement-list i { width: 31px; height: 31px; display: grid; place-items: center; flex: 0 0 31px; border-radius: 11px; color: rgb(16, 17, 22); background: linear-gradient(135deg, rgb(247, 223, 160), rgb(249, 197, 49) 48%, rgb(199, 148, 14)); box-shadow: rgba(255, 255, 255, 0.4) 0px 1px 0px inset; font-size: 12px; }
.requirement-list strong { display: block; color: rgb(255, 255, 255); font-size: 12px; font-weight: 900; line-height: 1.35; }
.requirement-list span { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.48; }
.application-ready { display: flex; flex-direction: column; background: radial-gradient(circle at 95% 8%, rgba(249, 197, 49, 0.15), transparent 13rem), rgba(10, 12, 18, 0.72); border-color: rgba(249, 197, 49, 0.28) !important; }
.ready-icon { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 18px; color: rgb(12, 13, 16); background: linear-gradient(135deg,#f9e7a7,var(--gold)); box-shadow: rgba(249, 197, 49, 0.16) 0px 16px 31px, rgba(255, 255, 255, 0.48) 0px 1px 0px inset; font-size: 19px; }
.ready-list { display: grid; gap: 10px; margin: 18px 0px 20px; list-style: none; }
.ready-list li { display: flex; align-items: flex-start; gap: 9px; color: rgb(213, 217, 224); font-size: 12px; font-weight: 750; line-height: 1.5; }
.ready-list i { width: 18px; color: rgb(91, 241, 151); padding-top: 1px; text-align: center; }
.application-note { margin-top: auto; padding: 12px; border-radius: 14px; border: 1px solid rgba(116, 167, 255, 0.16); background: rgba(116, 167, 255, 0.055); color: rgb(203, 217, 247); font-size: 11px; line-height: 1.55; }
.application-note i { color: rgb(169, 196, 255); margin-right: 6px; }
.application-ready .btn { width: 100%; margin-top: 14px; }
@media (max-width: 900px) {
  .clean-benefit-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .reseller-requirements { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .hero { padding-top: 34px; }
  .premium-showcase { min-height: auto; }
  .showcase-preview { margin-top: 20px; }
  .clean-benefit-grid, .requirement-list { grid-template-columns: 1fr; }
  .requirements-card, .application-ready { padding: 19px; }
  .requirements-card h3, .application-ready h3 { font-size: 20px; }
  .requirement-list li { min-height: 0px; }
}