/* Under Music Chile · undermusic.cl
   Un solo acento (cian de la marca), titulares condensados, vidrio solo en los cantos.
   Con «menos movimiento» todo queda en su estado final. */

@font-face{font-family:'Big Shoulders Display';font-style:normal;font-weight:600 800;font-display:swap;src:url(../fonts/big-shoulders-display.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/manrope.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url(../fonts/jetbrains-mono.woff2) format('woff2')}

:root{
  --negro:#010809;
  --negro-2:#041217;
  --negro-3:#072029;
  --tinta:#F4FFFF;
  --tinta-2:rgba(244,255,255,.76);
  --tinta-3:rgba(244,255,255,.6);
  --cian:#00F5F5;
  --turquesa:#00CFCF;
  --linea:rgba(244,255,255,.1);
  --linea-cian:rgba(0,245,245,.24);
  --f-display:'Big Shoulders Display','Arial Narrow','Roboto Condensed',Impact,sans-serif;
  --f-texto:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-suave:cubic-bezier(.16,1,.3,1);
  --ease-cortina:cubic-bezier(.76,0,.24,1);
  --ancho:1240px;
  --margen:clamp(16px,4.2vw,48px);
  --alto-nav:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{color-scheme:dark;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:var(--alto-nav)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--negro);color:var(--tinta);font:400 1rem/1.6 var(--f-texto);overflow-x:clip;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html.mini-activo body{padding-bottom:96px}
img,video,canvas,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button{font:inherit;color:inherit}
p{margin:0 0 1em}
:focus-visible{outline:2px solid var(--cian);outline-offset:3px}
::selection{background:var(--cian);color:var(--negro)}
main{display:block}
main:focus{outline:none}

/* Grano de película, solo en pantallas grandes (estático, no anima) */
@media (min-width:800px){
  body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.045;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
}

.saltar{position:absolute;left:12px;top:-80px;z-index:300;background:var(--cian);color:var(--negro);padding:12px 18px;border-radius:999px;font-weight:700;text-decoration:none;transition:top .2s}
.saltar:focus{top:12px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
html:not(.js) .requiere-js{display:none!important}
html.js .sin-js{display:none!important}

/* ── Bloques comunes ───────────────────────────────────────────────── */
.contenedor{width:min(100% - 2*var(--margen),var(--ancho));margin-inline:auto}
.seccion{position:relative;padding-block:clamp(76px,10vw,140px)}
.seccion--borde{border-top:1px solid var(--linea)}
.rotulo{display:flex;align-items:center;gap:10px;margin:0 0 18px;font:500 .72rem/1.3 var(--f-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--cian)}
.rotulo::before{content:"";flex:none;width:18px;height:1px;background:currentColor;opacity:.7}
.titulo-seccion{margin:0 0 20px;font:700 clamp(2.75rem,1.1rem + 6.4vw,6.2rem)/.88 var(--f-display);text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
.acento{color:var(--cian);text-shadow:0 0 28px rgba(0,245,245,.42)}
.bajada{margin:0;max-width:56ch;color:var(--tinta-2);font-size:clamp(1rem,.95rem + .3vw,1.15rem)}
.cabeza{display:grid;gap:4px;margin-bottom:clamp(36px,5vw,64px)}
@media (min-width:1024px){.cabeza--dividida{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;column-gap:56px}.cabeza--dividida .bajada{margin-bottom:12px}}
.acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(32px,4vw,48px)}
.nota{margin:22px 0 0;color:var(--tinta-3);font-size:.86rem}

.boton{--alto:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--alto);padding:0 26px;border-radius:999px;border:1px solid transparent;font:700 .95rem/1.1 var(--f-texto);letter-spacing:.01em;text-decoration:none;cursor:pointer;
  transition:transform .25s var(--ease),background-color .25s,box-shadow .3s,border-color .25s,color .25s}
.boton:active{transform:scale(.97)}
.boton svg{flex:none;width:18px;height:18px}
.boton--primario{background:var(--cian);color:var(--negro);box-shadow:0 0 0 1px rgba(0,245,245,.4),0 12px 40px -10px rgba(0,245,245,.6),inset 0 1px 0 rgba(255,255,255,.55)}
.boton--primario:hover{background:#6bfdfd;box-shadow:0 0 0 1px rgba(0,245,245,.6),0 16px 50px -8px rgba(0,245,245,.75),inset 0 1px 0 rgba(255,255,255,.55)}
.boton--fantasma{background:rgba(244,255,255,.04);border-color:rgba(244,255,255,.24);color:var(--tinta);-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2)}
.boton--fantasma:hover{border-color:var(--cian);color:var(--cian)}
.boton--chico{--alto:42px;padding:0 18px;font-size:.86rem}
.boton .icono-pausa{display:none}
.boton[aria-pressed="true"] .icono-play{display:none}
.boton[aria-pressed="true"] .icono-pausa{display:block}

/* ── Navegación ────────────────────────────────────────────────────── */
.nav{position:fixed;inset:0 0 auto;z-index:100;border-bottom:1px solid transparent;transition:background-color .35s,border-color .35s}
.nav--solida{background:rgba(1,8,9,.74);border-color:var(--linea);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.nav--solida{background:rgba(1,8,9,.96)}}
.nav__barra{width:min(100% - 2*var(--margen),var(--ancho));height:var(--alto-nav);margin-inline:auto;display:flex;align-items:center;gap:20px}
.nav__marca{display:flex;align-items:center;gap:10px;margin-right:auto;text-decoration:none;min-width:0}
.nav__marca img{width:auto;height:34px;filter:drop-shadow(0 0 10px rgba(0,245,245,.35))}
.nav__nombre{font:800 1.18rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.nav__links{display:none;gap:2px}
.nav__links a{padding:10px 14px;border-radius:999px;color:var(--tinta-2);font:600 .9rem/1 var(--f-texto);text-decoration:none;transition:color .2s,background-color .2s}
.nav__links a:hover{color:var(--tinta);background:rgba(244,255,255,.06)}
.nav__links a[aria-current="page"]{color:var(--cian)}
.nav__acciones{display:flex;align-items:center;gap:6px}
.nav__icono,.nav__menu{width:42px;height:42px;display:grid;place-items:center;flex:none;padding:0;border-radius:999px;border:1px solid var(--linea);background:rgba(1,8,9,.3);color:var(--tinta);text-decoration:none;cursor:pointer;transition:border-color .2s,color .2s}
.nav__icono:hover,.nav__menu:hover{border-color:var(--cian);color:var(--cian)}
.nav__icono svg,.nav__menu svg{width:19px;height:19px}
@media (min-width:920px){.nav__links{display:flex}.nav__menu{display:none}}
@media (max-width:359px){.nav__nombre{display:none}}
html:not(.js) .nav__barra{flex-wrap:wrap;height:auto;min-height:var(--alto-nav);padding-block:12px}
html:not(.js) .nav__links{display:flex;flex-wrap:wrap;order:3;width:100%}

.menu{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--negro);color:var(--tinta);overflow:auto}
.menu::backdrop{background:transparent}
.menu[open]{display:flex;flex-direction:column}
@media (prefers-reduced-motion:no-preference){
  .menu[open]{animation:menu-abrir .6s var(--ease-cortina)}
  .menu[open] li{animation:menu-item .6s var(--ease) both;animation-delay:calc(var(--i,0)*60ms + 160ms)}
}
@keyframes menu-abrir{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes menu-item{from{opacity:0;transform:translateY(18px)}}
html:has(.menu[open]),html:has(.visor[open]){overflow:hidden}
.menu__cabeza{display:flex;align-items:center;justify-content:space-between;height:var(--alto-nav);padding-inline:var(--margen);border-bottom:1px solid var(--linea)}
.menu__cabeza p{margin:0;font:500 .72rem/1 var(--f-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--cian)}
.menu ol{list-style:none;margin:0;padding:20px var(--margen);display:grid;counter-reset:m}
.menu li a{display:flex;align-items:baseline;gap:16px;padding:14px 0;border-bottom:1px solid var(--linea);font:700 clamp(2.4rem,11vw,3.6rem)/1 var(--f-display);text-transform:uppercase;text-decoration:none}
.menu li a::before{counter-increment:m;content:"0" counter(m);font:500 .75rem/1 var(--f-mono);letter-spacing:.1em;color:var(--cian)}
.menu li a[aria-current="page"]{color:var(--cian)}
.menu__redes{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding:24px var(--margen) calc(24px + env(safe-area-inset-bottom))}

/* ── Hero ──────────────────────────────────────────────────────────── */
.hero{position:relative;isolation:isolate;overflow:clip;min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center;padding:calc(var(--alto-nav) + 20px) var(--margen) 112px}
.hero__fondo{position:absolute;inset:0;z-index:-1;background:var(--negro) url(/assets/video/hero-movil.webp) center/cover no-repeat}
@media (min-width:700px) and (min-aspect-ratio:3/4){.hero__fondo{background-image:url(/assets/video/hero-1280.webp)}}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s var(--ease)}
.hero__video.lista{opacity:1}
.hero__velo{position:absolute;inset:0;background:
  radial-gradient(ellipse 52% 46% at 50% 46%,rgba(1,8,9,.66),rgba(1,8,9,.28) 62%,rgba(1,8,9,0) 100%),
  linear-gradient(180deg,rgba(1,8,9,.6) 0%,rgba(1,8,9,0) 20%,rgba(1,8,9,0) 52%,rgba(1,8,9,.78) 84%,var(--negro) 100%)}
.hero__contenido{position:relative;display:grid;justify-items:center;max-width:900px}
.hero__badge{display:inline-flex;align-items:center;gap:10px;margin-bottom:clamp(6px,1.6vh,18px);padding:8px 14px 8px 12px;border-radius:999px;border:1px solid var(--linea-cian);background:rgba(1,8,9,.76);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font:500 .7rem/1.25 var(--f-mono);letter-spacing:.15em;text-transform:uppercase;color:var(--tinta);text-decoration:none;transition:border-color .2s}
.hero__badge:hover{border-color:var(--cian)}
.punto{flex:none;width:8px;height:8px;border-radius:50%;background:var(--cian);box-shadow:0 0 12px var(--cian)}
@media (prefers-reduced-motion:no-preference){.punto{animation:punto-latido 1.6s var(--ease) 3}}
@keyframes punto-latido{50%{box-shadow:0 0 0 7px rgba(0,245,245,0),0 0 12px var(--cian)}}
.hero__logo{width:min(74vw,540px,52svh);height:auto;-webkit-mask-image:linear-gradient(180deg,#000 92%,transparent 100%);mask-image:linear-gradient(180deg,#000 92%,transparent 100%)}
.hero__titulo{max-width:34ch;margin:clamp(2px,1vh,12px) 0 14px;font:700 clamp(1.45rem,.9rem + 2vw,2.3rem)/1.02 var(--f-display);text-transform:uppercase;letter-spacing:.01em;text-wrap:balance;text-shadow:0 2px 24px rgba(1,8,9,.95)}
.hero__bajada{max-width:46ch;margin:0 auto 26px;color:var(--tinta);font-size:clamp(.98rem,.92rem + .3vw,1.12rem);text-shadow:0 1px 18px rgba(1,8,9,1)}
.hero__acciones{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.hero__micro{margin:16px 0 0;text-wrap:balance;font:500 .7rem/1.5 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
.hero__generos{position:absolute;left:0;right:0;bottom:30px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 0;margin:0;padding:0 72px;list-style:none;font:500 .68rem/1 var(--f-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-3)}
.hero__generos li+li::before{content:"/";margin:0 14px;color:var(--cian);opacity:.65}
.hero__pausa{position:absolute;right:var(--margen);bottom:20px;width:42px;height:42px;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid var(--linea);background:rgba(1,8,9,.45);color:var(--tinta-2);cursor:pointer;transition:border-color .2s,color .2s}
.hero__pausa:hover{border-color:var(--cian);color:var(--cian)}
.hero__pausa svg{width:16px;height:16px}
.hero__pausa .icono-play{display:none}
.hero__pausa[aria-pressed="true"] .icono-play{display:block}
.hero__pausa[aria-pressed="true"] .icono-pausa{display:none}
@media (max-width:640px){.hero__generos{display:none}.hero{padding-bottom:84px}
  .hero__velo{background:radial-gradient(ellipse 95% 62% at 50% 58%,rgba(1,8,9,.74),rgba(1,8,9,.4) 65%,rgba(1,8,9,.1) 100%),linear-gradient(180deg,rgba(1,8,9,.6) 0%,rgba(1,8,9,0) 18%,rgba(1,8,9,0) 60%,rgba(1,8,9,.8) 88%,var(--negro) 100%)}}
@media (prefers-reduced-motion:no-preference){
  .js .hero [data-entrada]{opacity:0;transform:translateY(16px);filter:blur(6px);animation:hero-entrada .9s var(--ease-suave) forwards;animation-delay:calc(var(--d,0)*1ms)}
  .js .hero .hero__logo[data-entrada]{transform:scale(.965)}
}
@media (prefers-reduced-motion:no-preference) and (max-width:700px){.js .hero [data-entrada]{filter:blur(3px)}}
@keyframes hero-entrada{to{opacity:1;transform:none;filter:none}}

/* ── Aparecer al hacer scroll ─────────────────────────────────────── */
@media (prefers-reduced-motion:no-preference){
  .js .revelar{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0)*90ms)}
  .js .revelar.visible{opacity:1;transform:none}
}

/* ── La cabina (reproductor) ──────────────────────────────────────── */
.cabina__grid{display:grid;gap:clamp(22px,3vw,36px)}
@media (min-width:1024px){.cabina__grid{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);align-items:start}}
.deck{--brillo:0;position:relative;padding:clamp(12px,1.8vw,18px);border-radius:24px;border:1px solid var(--linea);background:linear-gradient(180deg,rgba(7,32,41,.6),rgba(1,8,9,.7));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 80px -40px rgba(0,245,245,.35)}
.deck::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 1px var(--cian),0 0 70px -6px rgba(0,245,245,.55);opacity:calc(var(--brillo)*.85);will-change:opacity}
@media (min-width:1024px){.deck{position:sticky;top:calc(var(--alto-nav) + 20px)}}
.deck__portada{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:16px;background:var(--negro-2)}
.deck__portada img{width:100%;height:100%;object-fit:cover}
.deck__portada::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,8,9,0) 22%,rgba(1,8,9,.6) 60%,rgba(1,8,9,.94) 100%)}
.deck__eq{position:absolute;left:0;right:0;bottom:0;z-index:1;width:100%;height:56%}
.deck__info{display:grid;gap:8px;margin:20px 6px 4px}
.deck__estado{margin:0}
.deck__titulo{margin:0;font:700 clamp(2.3rem,1.3rem + 3.4vw,3.8rem)/.9 var(--f-display);text-transform:uppercase;letter-spacing:.005em}
.deck__titulo a{text-decoration:none}
.deck__titulo a:hover{color:var(--cian)}
.deck__meta{margin:0;color:var(--tinta-2);font:500 .78rem/1.45 var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.deck__progreso{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:18px 6px 10px;color:var(--tinta-2);font:500 .78rem/1 var(--f-mono);font-variant-numeric:tabular-nums}
.deck__controles{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 6px 6px}
.deck__controles .boton{margin-left:auto}

.barra{--p:0%;-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:0;background:transparent;cursor:pointer}
.barra::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--cian) var(--p),rgba(244,255,255,.16) var(--p));transition:box-shadow .4s}
.barra::-moz-range-track{height:4px;border-radius:4px;background:rgba(244,255,255,.16)}
.barra::-moz-range-progress{height:4px;border-radius:4px;background:var(--cian)}
.barra::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;border:0;border-radius:50%;background:var(--tinta);box-shadow:0 0 0 4px rgba(0,245,245,.22),0 0 16px rgba(0,245,245,.8)}
.barra::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--tinta);box-shadow:0 0 0 4px rgba(0,245,245,.22),0 0 16px rgba(0,245,245,.8)}
.um-sonando .barra::-webkit-slider-runnable-track{box-shadow:0 0 14px rgba(0,245,245,.6)}
.um-sonando .barra::-moz-range-progress{box-shadow:0 0 14px rgba(0,245,245,.6)}

.control{width:48px;height:48px;display:grid;place-items:center;flex:none;padding:0;border-radius:50%;border:1px solid var(--linea);background:rgba(244,255,255,.03);color:var(--tinta);cursor:pointer;transition:border-color .2s,color .2s,transform .2s var(--ease),background-color .2s}
.control:hover{border-color:var(--cian);color:var(--cian)}
.control:active{transform:scale(.94)}
.control svg{width:20px;height:20px}
.control--play{width:64px;height:64px;border:0;background:var(--cian);color:var(--negro);box-shadow:0 0 34px rgba(0,245,245,.45)}
.control--play:hover{color:var(--negro);background:#6bfdfd}
.control--play svg{width:26px;height:26px}
.control .icono-pausa{display:none}
.control[aria-pressed="true"] .icono-play{display:none}
.control[aria-pressed="true"] .icono-pausa{display:block}

.temas{list-style:none;margin:0;padding:0;border-top:1px solid var(--linea)}
.tema{position:relative;display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 8px;border-bottom:1px solid var(--linea);transition:background-color .2s}
@media (hover:hover){.tema:hover{background:rgba(0,245,245,.035)}}
.tema__play{position:relative;width:46px;height:46px;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid var(--linea);background:transparent;color:var(--tinta);cursor:pointer;transition:border-color .2s,background-color .2s,color .2s}
.tema__play:hover{border-color:var(--cian);color:var(--cian)}
.tema__play svg{width:18px;height:18px}
.tema__play .icono-pausa{display:none}
.tema__n{font:500 .8rem/1 var(--f-mono);color:var(--tinta-3);text-align:center}
.tema__texto{min-width:0}
.tema__titulo{display:block;overflow:hidden;font:700 1.4rem/1.05 var(--f-display);letter-spacing:.01em;text-transform:uppercase;text-decoration:none;white-space:nowrap;text-overflow:ellipsis}
.tema__titulo:hover{color:var(--cian)}
.tema__genero{display:block;overflow:hidden;margin-top:5px;color:var(--tinta-3);font:500 .7rem/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis}
.tema__datos{color:var(--tinta-2);font:500 .78rem/1 var(--f-mono);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.tema__datos small{display:block;margin-top:6px;color:var(--tinta-3);font-size:.68rem;letter-spacing:.08em}
.tema.cargado .tema__titulo{color:var(--cian)}
.tema.cargado .tema__play{border-color:var(--cian)}
.tema.sonando .tema__play{background:var(--cian);border-color:var(--cian);color:var(--negro)}
.tema.sonando .tema__play .icono-play{display:none}
.tema.sonando .tema__play .icono-pausa{display:block}
.cabina__lista .nota{margin-top:18px}

/* ── Tarjetas (lanzamientos y sesiones) ──────────────────────────── */
.rejilla{display:grid;gap:clamp(22px,2.4vw,30px) clamp(16px,2vw,24px);grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr))}
@media (min-width:1100px){
  .rejilla--destacada{grid-template-columns:repeat(4,minmax(0,1fr))}
  .rejilla--destacada .tarjeta:first-child{grid-column:span 2;grid-row:span 2}
  .rejilla--destacada .tarjeta:first-child .tarjeta__imagen{flex:1;aspect-ratio:auto;min-height:320px}
  .rejilla--destacada .tarjeta:first-child .tarjeta__titulo{font-size:clamp(2.2rem,1rem + 2vw,3rem)}
}
.tarjeta{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0;scroll-margin-top:24px}
.tarjeta__imagen{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:14px;border:1px solid var(--linea);background:var(--negro-2);transition:border-color .35s,box-shadow .35s}
.tarjeta__imagen img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.tarjeta:focus-within .tarjeta__imagen{border-color:var(--cian);box-shadow:0 0 0 1px var(--cian),0 0 40px -4px rgba(0,245,245,.5)}
@media (hover:hover){.tarjeta:hover .tarjeta__imagen{border-color:var(--cian);box-shadow:0 0 0 1px var(--cian),0 0 40px -4px rgba(0,245,245,.5)}}
@media (prefers-reduced-motion:no-preference) and (hover:hover){.tarjeta:hover .tarjeta__imagen img{transform:scale(1.06)}}
.tarjeta__ver{position:absolute;right:12px;bottom:12px;z-index:2;width:48px;height:48px;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid rgba(244,255,255,.36);background:rgba(1,8,9,.55);color:var(--tinta);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background-color .25s,color .25s,border-color .25s,transform .25s var(--ease)}
.tarjeta__ver:hover{background:var(--cian);border-color:var(--cian);color:var(--negro);transform:scale(1.06)}
.tarjeta__ver svg{width:18px;height:18px;margin-left:2px}
.tarjeta__cuerpo{display:grid;gap:7px}
.tarjeta__meta{display:grid;gap:5px;margin:0;color:var(--tinta-3);font:500 .7rem/1.3 var(--f-mono);letter-spacing:.13em;text-transform:uppercase}
.tarjeta__meta span:first-child{color:var(--cian)}
.tarjeta__titulo{margin:0;font:700 1.65rem/1 var(--f-display);text-transform:uppercase;letter-spacing:.005em;text-wrap:balance}
.tarjeta__titulo a{text-decoration:none}
.tarjeta__titulo a::after{content:"";position:absolute;inset:0;z-index:1}
.tarjeta__titulo a:focus-visible{outline:none}
.tarjeta:has(.tarjeta__titulo a:focus-visible) .tarjeta__imagen{outline:2px solid var(--cian);outline-offset:3px}
.tarjeta__texto{margin:0;color:var(--tinta-2);font-size:.95rem}
.etiqueta{position:absolute;left:12px;top:12px;z-index:2;padding:6px 10px;border-radius:999px;background:var(--cian);color:var(--negro);font:500 .64rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}

/* ── En vivo ──────────────────────────────────────────────────────── */
.en-vivo{background:radial-gradient(ellipse 70% 50% at 85% 0%,rgba(0,207,207,.08),transparent 70%)}
.lineup{display:flex;flex-wrap:wrap;align-items:baseline;gap:.08em 0;margin:0 0 clamp(44px,6vw,80px);padding:0;list-style:none;font:800 clamp(2.2rem,.9rem + 5.4vw,5.6rem)/.96 var(--f-display);text-transform:uppercase;letter-spacing:-.005em}
.lineup li:not(:last-child)::after{content:"/";margin:0 .32em;color:var(--cian);font-weight:600;opacity:.7}
.lineup a{text-decoration:none;transition:color .25s,text-shadow .25s}
.lineup a:hover,.lineup a:focus-visible{color:var(--cian);text-shadow:0 0 30px rgba(0,245,245,.55)}
.mosaico{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense;margin:0}
.mosaico figure{position:relative;margin:0;overflow:hidden;border-radius:14px;border:1px solid var(--linea);background:var(--negro-2)}
.mosaico img{width:100%;height:100%;object-fit:cover}
.mosaico .horizontal{grid-column:span 2;aspect-ratio:3/2}
.mosaico .vertical{aspect-ratio:9/16}
@media (min-width:900px){
  .mosaico{grid-template-columns:1fr 1.34fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));aspect-ratio:2.05/1}
  .mosaico .vertical{grid-row:span 2;aspect-ratio:auto}
  .mosaico .horizontal{grid-column:auto;aspect-ratio:auto}
  .mosaico figure:nth-child(1){grid-column:1}
  .mosaico figure:nth-child(2),.mosaico figure:nth-child(3){grid-column:2}
  .mosaico figure:nth-child(4){grid-column:3;grid-row:1/span 2}
}
.credito{margin:12px 0 0;color:var(--tinta-3);font:500 .7rem/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}

.cifras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:0 0 clamp(44px,6vw,72px);padding:0;list-style:none;border:1px solid var(--linea);border-radius:18px;overflow:hidden;background:var(--linea)}
@media (min-width:800px){.cifras{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cifras li{display:grid;gap:6px;padding:clamp(18px,2.4vw,28px);background:var(--negro)}
.cifras strong{font:700 clamp(2.4rem,1.6rem + 2.4vw,3.6rem)/.9 var(--f-display);color:var(--tinta);text-transform:uppercase}
.cifras span{color:var(--tinta-3);font:500 .7rem/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}

/* ── Síguenos ─────────────────────────────────────────────────────── */
.redes{display:grid;gap:16px}
@media (min-width:800px){.redes{grid-template-columns:repeat(2,minmax(0,1fr))}}
.red{position:relative;display:grid;gap:10px;padding:clamp(24px,3vw,36px);border-radius:22px;border:1px solid var(--linea);background:linear-gradient(160deg,rgba(7,32,41,.65),rgba(1,8,9,.4));text-decoration:none;overflow:hidden;transition:border-color .3s,transform .35s var(--ease),box-shadow .35s}
@media (hover:hover){.red:hover{border-color:var(--cian);transform:translateY(-3px);box-shadow:0 24px 60px -30px rgba(0,245,245,.5)}}
.red svg.red__logo{width:38px;height:38px;color:var(--cian)}
.red__nombre{font:700 clamp(2.2rem,1.6rem + 1.8vw,3rem)/1 var(--f-display);text-transform:uppercase}
.red__usuario{color:var(--cian);font:500 .8rem/1 var(--f-mono);letter-spacing:.08em}
.red__texto{margin:0;color:var(--tinta-2)}
.red__flecha{position:absolute;top:clamp(22px,3vw,34px);right:clamp(22px,3vw,34px);width:44px;height:44px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--linea);transition:background-color .3s,color .3s,border-color .3s,transform .3s var(--ease)}
.red__flecha svg{width:18px;height:18px}
@media (hover:hover){.red:hover .red__flecha{background:var(--cian);border-color:var(--cian);color:var(--negro);transform:rotate(45deg)}}

/* ── Fichas (lanzamiento, sesiones, nosotros) ────────────────────── */
.pagina{padding-top:calc(var(--alto-nav) + clamp(28px,5vw,64px))}
.migas{margin-bottom:26px;font:500 .7rem/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
.migas ol{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.migas li+li::before{content:"/";margin-right:8px;color:var(--cian)}
.migas a{color:var(--tinta-2);text-decoration:none}
.migas a:hover{color:var(--cian)}
.titulo-pagina{margin:0 0 20px;font:800 clamp(3.2rem,1.3rem + 8vw,8rem)/.84 var(--f-display);text-transform:uppercase;letter-spacing:-.01em;text-wrap:balance}
.ficha__grid{display:grid;gap:clamp(28px,4vw,64px)}
@media (min-width:1024px){.ficha__grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start}}
.ficha__media{position:relative}
@media (min-width:1024px){.ficha__media{position:sticky;top:calc(var(--alto-nav) + 24px)}}
.fachada{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;padding:0;border-radius:18px;border:1px solid var(--linea);background:#000;color:var(--tinta);cursor:pointer;transition:border-color .3s,box-shadow .3s}
@media (hover:hover){.fachada:hover{border-color:var(--cian);box-shadow:0 0 0 1px var(--cian),0 0 50px -8px rgba(0,245,245,.45)}}
.fachada img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
@media (prefers-reduced-motion:no-preference) and (hover:hover){.fachada:hover img{transform:scale(1.03)}}
.fachada__play{position:absolute;inset:0;margin:auto;width:86px;height:86px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(244,255,255,.45);background:rgba(1,8,9,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background-color .3s,color .3s,transform .3s var(--ease)}
.fachada__play svg{width:30px;height:30px;margin-left:4px}
@media (hover:hover){.fachada:hover .fachada__play{background:var(--cian);color:var(--negro);transform:scale(1.06)}}
.fachada.activa{cursor:default}
.fachada iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ficha__nota{margin:12px 0 0;color:var(--tinta-3);font-size:.8rem}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px;padding:0;list-style:none}
.chip{padding:9px 13px;border-radius:999px;border:1px solid var(--linea-cian);color:var(--tinta);font:500 .7rem/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}
.prosa p{max-width:62ch;margin:0 0 16px;color:var(--tinta-2)}
.prosa p:first-child{color:var(--tinta);font-size:clamp(1.05rem,1rem + .3vw,1.22rem)}
.prosa h2{margin:clamp(40px,5vw,56px) 0 14px;font:700 clamp(2rem,1.4rem + 2.2vw,3rem)/.95 var(--f-display);text-transform:uppercase}
.prosa a{color:var(--cian)}
.prosa ul{margin:0 0 16px;padding-left:1.2em;color:var(--tinta-2);max-width:62ch}
.prosa li{margin-bottom:6px}
.vecinos{display:grid;gap:12px;margin-top:clamp(32px,4vw,48px)}
@media (min-width:640px){.vecinos{grid-template-columns:1fr 1fr}}
.vecino{display:grid;gap:6px;padding:18px 20px;border-radius:16px;border:1px solid var(--linea);text-decoration:none;transition:border-color .25s,background-color .25s}
@media (hover:hover){.vecino:hover{border-color:var(--cian);background:rgba(0,245,245,.04)}}
.vecino span{color:var(--tinta-3);font:500 .68rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.vecino strong{font:700 1.6rem/1 var(--f-display);text-transform:uppercase}
.vecino--siguiente{text-align:right}
.grupo-sesion{margin-top:clamp(48px,6vw,80px)}
.grupo-sesion:first-of-type{margin-top:0}
.grupo-sesion>h2{display:flex;align-items:baseline;gap:16px;margin:0 0 22px;padding-bottom:14px;border-bottom:1px solid var(--linea);font:700 clamp(2rem,1.4rem + 2vw,3rem)/1 var(--f-display);text-transform:uppercase}
.grupo-sesion>h2 small{color:var(--cian);font:500 .72rem/1 var(--f-mono);letter-spacing:.16em}
.legal{max-width:760px}
.legal h2{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.2rem)}
.error{min-height:80vh;display:grid;align-content:center}

/* ── Pie ──────────────────────────────────────────────────────────── */
.pie{position:relative;overflow:clip;padding:clamp(56px,8vw,96px) 0 calc(28px + env(safe-area-inset-bottom));border-top:1px solid var(--linea)}
.pie__lema{margin:0 0 clamp(40px,6vw,72px);font:800 min(14.2vw,12.6rem)/.8 var(--f-display);text-align:center;text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(0,245,245,.42);user-select:none}
@supports not (-webkit-text-stroke:1px black){.pie__lema{color:rgba(0,245,245,.12)}}
.pie__grid{display:grid;gap:36px}
@media (min-width:800px){.pie__grid{grid-template-columns:1.5fr 1fr 1fr}}
.pie__marca img{width:auto;height:48px;margin-bottom:16px;filter:drop-shadow(0 0 12px rgba(0,245,245,.35))}
.pie__marca p{max-width:36ch;color:var(--tinta-2)}
.pie h2{margin:0 0 16px;color:var(--cian);font:500 .72rem/1 var(--f-mono);letter-spacing:.2em;text-transform:uppercase}
.pie ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.pie ul a{color:var(--tinta-2);text-decoration:none;transition:color .2s}
.pie ul a:hover{color:var(--tinta);text-decoration:underline;text-underline-offset:4px}
.pie__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;margin-top:52px;padding-top:22px;border-top:1px solid var(--linea);color:var(--tinta-3);font-size:.84rem}
.pie__legal p{margin:0}
.pie__legal a{color:var(--tinta-2)}

/* ── Mini reproductor (persistente) ──────────────────────────────── */
.mini{position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));z-index:95;width:min(100% - 20px,760px);display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:12px;padding:9px 10px 9px 9px;border-radius:18px;border:1px solid var(--linea-cian);background:rgba(3,18,23,.86);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 20px 60px -20px rgba(0,0,0,.85),0 0 40px -12px rgba(0,245,245,.3);transform:translate(-50%,calc(100% + 40px));transition:transform .55s var(--ease-suave)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.mini{background:rgba(3,18,23,.98)}}
.mini.visible{transform:translate(-50%,0)}
.mini[hidden]{display:none}
.mini__progreso{position:absolute;left:16px;right:16px;top:-1px;height:2px;overflow:hidden;border-radius:2px;background:rgba(244,255,255,.1)}
.mini__progreso span{display:block;width:100%;height:100%;background:var(--cian);box-shadow:0 0 10px var(--cian);transform:scaleX(var(--p,0));transform-origin:left}
.mini__portada{width:64px;height:36px;border-radius:8px;object-fit:cover;background:var(--negro-2)}
.mini__info{min-width:0}
.mini__titulo{display:block;overflow:hidden;font:700 1.08rem/1.1 var(--f-display);letter-spacing:.02em;text-transform:uppercase;text-decoration:none;white-space:nowrap;text-overflow:ellipsis}
.mini__titulo:hover{color:var(--cian)}
.mini__genero{display:block;overflow:hidden;color:var(--tinta-3);font:500 .64rem/1.4 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis}
.mini__eq{width:44px;height:24px}
.mini__controles{display:flex;align-items:center;gap:4px}
.mini .control{width:40px;height:40px}
.mini .control--play{width:46px;height:46px}
.mini .control--play svg{width:20px;height:20px}
.mini__cerrar{width:34px;height:34px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:var(--tinta-3);cursor:pointer}
.mini__cerrar:hover{color:var(--tinta);background:rgba(244,255,255,.08)}
.mini__cerrar svg{width:16px;height:16px}
@media (max-width:560px){.mini{grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px}.mini__eq,.mini .control--prev{display:none}}

/* ── Visor de video ──────────────────────────────────────────────── */
.visor{width:min(100% - 20px,1120px);max-width:none;max-height:calc(100% - 20px);padding:0;overflow:hidden;border:1px solid var(--linea-cian);border-radius:18px;background:var(--negro);color:var(--tinta);box-shadow:0 40px 120px rgba(0,0,0,.85),0 0 70px -12px rgba(0,245,245,.35)}
.visor::backdrop{background:rgba(1,8,9,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
@media (prefers-reduced-motion:no-preference){.visor[open]{animation:visor-abrir .45s var(--ease-suave)}}
@keyframes visor-abrir{from{opacity:0;transform:translateY(16px) scale(.98)}}
.visor__marco{aspect-ratio:16/9;background:#000}
.visor__marco iframe{display:block;width:100%;height:100%;border:0}
.visor__pie{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 16px 6px}
.visor__titulo{margin:0 auto 0 0;font:700 1.35rem/1.1 var(--f-display);text-transform:uppercase}
.visor__nota{margin:0;padding:0 16px 14px;color:var(--tinta-3);font-size:.78rem}

/* ── Aviso flotante ──────────────────────────────────────────────── */
.aviso{position:fixed;left:50%;top:calc(var(--alto-nav) + 12px);z-index:120;max-width:calc(100% - 32px);padding:12px 18px;border-radius:999px;border:1px solid var(--linea-cian);background:rgba(3,18,23,.95);color:var(--tinta);font-size:.9rem;box-shadow:0 12px 40px rgba(0,0,0,.6);transform:translate(-50%,-12px);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s var(--ease)}
.aviso.visible{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media print{.nav,.mini,.hero__fondo,.pie__lema,body::after{display:none!important}body{background:#fff;color:#000}}

/* ── Preguntas frecuentes ────────────────────────────────────────── */
.faq{display:grid;gap:1px;overflow:hidden;border:1px solid var(--linea);border-radius:20px;background:var(--linea)}
@media (min-width:900px){.faq{grid-template-columns:repeat(2,minmax(0,1fr))}.faq__item:last-child:nth-child(odd){grid-column:1/-1}}
.faq__item{padding:clamp(22px,3vw,34px);background:var(--negro)}
.faq__item h3{margin:0 0 12px;font:700 clamp(1.45rem,1.2rem + .9vw,1.9rem)/1.05 var(--f-display);text-transform:uppercase;text-wrap:balance}
.faq__item p{margin:0;max-width:62ch;color:var(--tinta-2)}