:root{--bg:#12061f;--bg2:#2a0845;--pink:#ff2e88;--cyan:#00f0ff;--yellow:#ffe500;--ink:#000;--text:#fff;--muted:#cbb9de}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:400 17px/1.55 Inter,system-ui,sans-serif;min-height:100vh;
  box-shadow:inset 0 0 0 6px var(--ink),inset 0 0 0 10px var(--yellow)}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px clamp(16px,4vw,48px)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:400 20px 'Russo One',sans-serif;white-space:nowrap}
.brand img{border-radius:50%;border:3px solid var(--ink)}
.brand b{color:var(--cyan);font-weight:400}
nav{display:flex;gap:clamp(12px,3vw,28px);font:400 15px 'Russo One',sans-serif}
nav a{text-decoration:none;color:var(--muted)}
nav a:hover{color:var(--yellow)}
main{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,48px)}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(20px,5vw,56px) 0 clamp(40px,7vw,80px)}
.tag{display:inline-flex;border:5px solid var(--ink);transform:skewX(-8deg);font:400 clamp(15px,2vw,20px) 'Russo One',sans-serif;margin-bottom:22px}
.tag span{padding:7px 16px;background:var(--pink)}
.tag span+span{background:var(--ink);color:var(--yellow)}
h1{font:400 clamp(44px,7.4vw,92px)/.95 Bangers,'Russo One',sans-serif;letter-spacing:.02em;text-transform:uppercase;text-wrap:balance;
  text-shadow:4px 4px 0 var(--ink)}
h1 em{font-style:normal;color:var(--cyan)}
.lead{color:var(--muted);max-width:52ch;margin:22px 0 26px;font-size:clamp(16px,1.6vw,19px)}
.count{display:flex;gap:10px;margin-bottom:28px;flex-wrap:wrap}
.count div{background:var(--ink);border:3px solid var(--yellow);min-width:74px;padding:8px 10px;text-align:center;transform:skewX(-8deg)}
.count b{display:block;font:400 30px 'Russo One',sans-serif;color:var(--yellow);font-variant-numeric:tabular-nums}
.count span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cta{display:flex;gap:16px 14px;flex-wrap:wrap}
.btn{font:400 17px 'Russo One',sans-serif;text-decoration:none;color:var(--ink);background:var(--yellow);border:4px solid var(--ink);
  padding:11px 20px;transform:skewX(-8deg);box-shadow:6px 6px 0 var(--pink);transition:transform .12s,box-shadow .12s}
.btn:hover,.btn:focus-visible{transform:skewX(-8deg) translate(-2px,-2px);box-shadow:8px 8px 0 var(--pink)}
.btn{display:inline-flex;align-items:center;gap:9px}.btn svg{width:22px;height:22px;flex:none;--icbg:var(--yellow)}
.btn.tt{background:var(--cyan)}.btn.ig{background:#fff}.btn.xx{background:var(--ink);color:#fff;border-color:#fff}.btn.fb{background:var(--pink);color:#fff;box-shadow:6px 6px 0 var(--cyan)}.btn.fb:hover,.btn.fb:focus-visible{box-shadow:8px 8px 0 var(--cyan)}
.hero-art img{border:6px solid var(--ink);outline:4px solid var(--pink);outline-offset:-10px;box-shadow:12px 12px 0 var(--yellow);
  aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;width:100%}
.block{padding:clamp(28px,5vw,56px) 0}
h2{margin-bottom:18px}
.strip{display:inline-block;font:400 clamp(24px,3.4vw,38px) Bangers,sans-serif;letter-spacing:.04em;background:var(--yellow);color:var(--ink);
  border:5px solid var(--ink);padding:4px 22px 0;transform:rotate(-2deg) skewX(-8deg);box-shadow:6px 6px 0 var(--pink)}
.strip.pink{background:var(--pink);color:#fff;box-shadow:6px 6px 0 var(--cyan)}
.strip.cyan{background:var(--cyan);box-shadow:6px 6px 0 var(--yellow)}
.sub{color:var(--muted);margin:6px 0 22px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.clip{position:relative;aspect-ratio:9/16;background:linear-gradient(160deg,#3a0f5c,#12061f 60%,#5a1640);border:4px solid var(--ink);
  box-shadow:inset 0 0 0 3px var(--yellow);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:14px;text-decoration:none}
.clip iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.clip .n{align-self:flex-start;font:400 13px 'Russo One',sans-serif;background:var(--ink);color:var(--yellow);padding:3px 8px;transform:skewX(-8deg)}
.clip .t{font:400 20px/1.05 'Russo One',sans-serif;text-transform:uppercase;text-shadow:2px 2px 0 var(--ink)}
.clip.soon .t{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.cards article{background:var(--bg2);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:20px}
.cards h3{font:400 22px 'Russo One',sans-serif;color:var(--yellow);margin-bottom:8px}
.cards p{color:var(--muted)}
.channels{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:14px}
.channels a{display:flex;align-items:center;gap:12px;text-decoration:none;background:var(--ink);
  border:3px solid var(--cyan);padding:16px 18px;transition:border-color .12s,transform .12s}
.channels a:hover,.channels a:focus-visible{border-color:var(--yellow);transform:translateY(-2px)}
.channels b{font:400 20px 'Russo One',sans-serif}
.channels span{color:var(--muted);font-size:14px;margin-left:auto}
.channels svg{width:26px;height:26px;flex:none;color:var(--cyan);--icbg:#000}
footer{max-width:1180px;margin:0 auto;padding:36px clamp(16px,4vw,48px) 44px;color:var(--muted);font-size:13px}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
@media (max-width:780px){
  .hero{grid-template-columns:1fr}
  .hero-art{order:-1;max-width:340px}
  nav a:nth-child(2){display:none}
  .brand span{font-size:17px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.channels a{transition:none}}