*{box-sizing:border-box}
html:focus-within{scroll-behavior:smooth}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#f6f6f9;background:#0b0b0f}
img{max-width:100%;height:auto;display:block}
button,a{-webkit-tap-highlight-color:transparent}
.sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;border:0;padding:0;margin:0}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}
:root{--card:rgba(255,255,255,.05);--stroke:rgba(255,255,255,.14);--text:#f2f2f7;--muted:#b8b8c6;--magenta:#ff00ff;--cyan:#00ffff;--green:#39ff14}
.container{width:min(1000px,92vw);padding-inline:clamp(12px,2vw,20px)}
body.landing{min-height:100vh;display:grid;place-items:center;background:radial-gradient(60% 60% at 50% 40%, rgba(255,0,255,.14), transparent 60%),radial-gradient(40% 40% at 60% 55%, rgba(0,255,255,.12), transparent 70%),#0d0d12}
.logo-button{background:none;border:none;padding:0;cursor:pointer;display:block;margin-inline:auto;filter:drop-shadow(0 0 14px var(--magenta));transition:transform .6s ease,opacity .6s ease,filter .6s ease}
.logo-button:focus-visible{outline:2px dashed var(--cyan);outline-offset:6px}
#logo{width:clamp(180px,28vw,320px)}
.choose-text{text-align:center;margin:clamp(8px,2vw,16px) 0 clamp(10px,2.4vw,22px);letter-spacing:.08em;font-size:clamp(16px,2.4vw,24px);opacity:0;transition:opacity .6s ease}
.campaigns{display:grid;gap:clamp(12px,2.4vw,24px);grid-template-columns:repeat(1,minmax(0,1fr));opacity:0;pointer-events:none;transition:opacity .8s ease}
.campaigns.active{opacity:1;pointer-events:auto}
@media (min-width:640px){.campaigns{grid-template-columns:repeat(2,1fr)}}
@media (min-width:960px){.campaigns{grid-template-columns:repeat(3,1fr)}}
.campaign-card{text-decoration:none;color:var(--text);background:var(--card);border:1px solid var(--stroke);border-radius:16px;overflow:hidden;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.campaign-card img{aspect-ratio:2/3;object-fit:cover}
.campaign-card h3{margin:10px 12px 14px;font-size:clamp(16px,2vw,18px)}
.campaign-card:hover,.campaign-card:focus-visible{transform:translateY(-3px);border-color:rgba(255,255,255,.24);box-shadow:0 16px 34px rgba(0,0,0,.45)}
.page-header{padding-block:clamp(12px,2vw,20px)}
.top-nav{display:flex;align-items:left;gap:12px}
.brand{margin:0;font-size:clamp(22px,3vw,32px)}
.back{display:inline-block;padding:10px 14px;border-radius:12px;border:1px solid var(--stroke);color:var(--text);text-decoration:none;background:var(--card)}
.back:focus-visible{outline:2px dashed var(--cyan);outline-offset:4px}
.hero-wrap{margin:clamp(8px,2vw,14px) auto}
.hero{width:min(600px,80vw);height:auto;border-radius:16px;border:1px solid var(--stroke)}
.products{display:grid;gap:clamp(14px,2.4vw,22px);grid-template-columns:repeat(1,minmax(0,1fr));margin-bottom:56px}
@media (min-width:860px){.products{grid-template-columns:repeat(1,1fr)}}
.product-card{background:rgba(0,0,0,.35);border:1px solid var(--stroke);border-radius:16px;overflow:clip;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.product-card:focus-within,.product-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.22);box-shadow:0 18px 34px rgba(0,0,0,.45)}
.product-top{display:grid;grid-template-columns:1fr;align-items:left;gap:14px;padding:14px}
.product-top img{width:100%;max-width:420px;margin-inline:auto;border-radius:12px}
.product-title{margin:0;font-size:clamp(18px,2.4vw,24px);text-align:left}
.reveal{max-height:0;opacity:0;padding:0 16px;overflow:hidden;transition:max-height .35s ease,opacity .35s ease,padding .35s ease}
.product-card:hover .reveal,.product-card:focus-within .reveal{max-height:260px;opacity:1;padding:0 16px 16px}
.product-desc{color:var(--text);opacity:.9;line-height:1.55}
.price{font-weight:700;margin-top:8px}
.btn-primary{margin-top:10px;display:inline-block;padding:10px 14px;border-radius:12px;border:1px solid var(--stroke);color:var(--text);background:var(--card);cursor:pointer}
.btn-primary:focus-visible{outline:2px dashed var(--magenta);outline-offset:3px}
body.bassskin{background:linear-gradient(135deg,#e709db 20%, #000000 80%) fixed}
body.sukimod{background:linear-gradient(135deg,#0654c7 20%, #000000 80%) fixed}
body.hardsignal{background:linear-gradient(135deg,#6009d9 20%, #000000 80%) fixed}
.site-footer{padding:18px 0 40px;text-align:center;color:var(--muted);font-size:14px}
