@font-face{font-family:Unbounded;font-weight:200 900;font-display:swap;src:url(/fonts/unbounded-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:100 1000;font-display:swap;src:url(/fonts/dm-sans-latin-wght-normal.woff2) format("woff2")}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip}
body{margin:0;background:#120E1A;color:#EDE8F5;font:400 1.05rem/1.6 "DM Sans",system-ui,sans-serif}
a{color:inherit}
:focus-visible{outline:3px solid #FFB627;outline-offset:3px}
.wrap{max-width:1100px;margin:0 auto;padding:0 clamp(16px,4vw,36px)}
.hero{padding:clamp(4rem,10vw,8rem) 0 3rem;background:radial-gradient(60rem 30rem at 85% 0%,rgba(255,77,109,.25),transparent 60%),radial-gradient(50rem 30rem at 0% 100%,rgba(76,201,240,.18),transparent 60%)}
.kick{font-weight:700;color:#FFB627;margin:0 0 1rem}
h1{font:900 clamp(4.5rem,17vw,13rem)/.86 Unbounded,sans-serif;letter-spacing:-.05em;margin:0;text-transform:uppercase}
.sub{font-size:1.3rem;color:#B9AFCB;margin:1.6rem 0 0}
.rels{display:grid;gap:1.4rem;padding-bottom:4rem}
.rel{display:grid;grid-template-columns:200px 1fr;gap:2rem;align-items:center;padding:2rem;border-radius:28px;background:#1B1526;border:1px solid rgba(255,255,255,.07)}
.disc{width:200px;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#0c0912 0 2px,#17111f 2px 4px);display:grid;place-items:center;box-shadow:0 20px 40px -20px #000}
.disc span{width:38%;aspect-ratio:1;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 8px rgba(0,0,0,.18)}
.disc span::after{content:"";display:block;width:12%;aspect-ratio:1;border-radius:50%;background:#120E1A;margin:44% auto}
.rel:hover .disc{animation:spin 2.2s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.rel h2{font:800 clamp(1.8rem,4vw,2.8rem)/1 Unbounded,sans-serif;margin:0 0 .3rem;color:var(--c)}
.by{margin:0 0 1.2rem;color:#B9AFCB}
.listen{margin:0 0 .6rem;font-weight:700;font-size:.9rem;color:#8F86A2}
.plats{display:flex;flex-wrap:wrap;gap:.5rem}
.plats a{padding:.6rem 1rem;border-radius:999px;border:1px solid rgba(255,255,255,.18);text-decoration:none;font-weight:700;font-size:.95rem;transition:background .2s,color .2s,border-color .2s}
.plats a:hover{background:var(--c);border-color:var(--c);color:#120E1A}
@media (max-width:640px){.rel{grid-template-columns:1fr;text-align:left}.disc{width:140px}}
footer{padding:2rem clamp(16px,4vw,36px) 3rem;color:#8F86A2;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;border-top:1px solid rgba(255,255,255,.08)}
.social{display:flex;flex-wrap:wrap;gap:1.2rem}.social a{font-weight:700;color:#EDE8F5;text-decoration:none}.social a:hover{color:#FFB627}
footer p{margin:0}
@media (prefers-reduced-motion:reduce){.rel:hover .disc{animation:none}}