/* ============================================================
   MAGOS — hoja de estilo
   Lo único que necesitás tocar está acá abajo, en :root
   ============================================================ */
:root{
  /* --- IMÁGENES ---
     Las fotos del hero se listan en el script, al final del archivo.
     Acá abajo va solo la foto del cierre. --- */
  --fondo1: url('FONDO1.jpg');

  /* --- Encuadre del hero.
     OJO: hoy no hace nada, porque las fotos están en `contain`
     (ver .capa más abajo). Vuelve a funcionar si las pasás a `cover`. --- */
  --hero-focus: 34%;

  /* --- Logo del hero: probá entre 160px y 320px --- */
  --logo-hero: 200px;
  --logo-giro: -2.5deg;

  /* --- Paleta --- */
  --tinta:#0B0A0C;
  --carbon:#141216;
  --hueso:#EFE9DC;
  --rosa:#D80A4B;
  --rosa-tinta:#A80638;
  --gris:#8A858F;

  --max:1160px;
  --borde:1px solid rgba(239,233,220,.13);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--tinta);
  color:var(--hueso);
  font-family:'Archivo',system-ui,sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit}

.wrap{width:min(var(--max),calc(100% - 44px));margin-inline:auto}

/* grano: le saca el brillo de plástico a las fotos */
.grano{
  position:fixed;inset:0;z-index:60;pointer-events:none;
  opacity:.22;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='.5'/></svg>");
}

/* ---------------- nav ---------------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:50;
  background:linear-gradient(to bottom,rgba(11,10,12,.72),rgba(11,10,12,0));
}
/* el desenfoque se va apagando hacia abajo, sin borde duro */
.nav::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  backdrop-filter:blur(16px) saturate(115%);
  -webkit-backdrop-filter:blur(16px) saturate(115%);
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 42%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0,#000 42%,transparent 100%);
}
.nav-in{position:relative;z-index:1}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:78px;gap:18px}
.marca{display:block;line-height:0}
.marca img{
  display:block;height:34px;width:auto;
  filter:drop-shadow(0 0 12px rgba(216,10,75,.5));
}
.menu{display:flex;align-items:center;gap:26px}
.menu a{
  font-family:'IBM Plex Mono',monospace;font-size:12px;
  letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  color:var(--gris);padding-bottom:3px;border-bottom:1px solid transparent;
  transition:color .18s ease,border-color .18s ease;
}
.menu a:hover,.menu a:focus-visible{color:var(--hueso);border-color:var(--rosa)}

/* ---------------- hero ---------------- */
.hero{
  position:relative;min-height:100svh;
  display:grid;align-items:end;overflow:hidden;
}
.hero-fotos{position:absolute;inset:0;z-index:0}
.capa{
  position:absolute;inset:-24% 0;z-index:0;
  background-size:contain;background-position:center center;
  background-color:#101013;
  will-change:transform;
}
/* corte seco entre fotos: nada de fundido */
.hero .capa{background-image:var(--img);opacity:0}
.hero .capa.activa{opacity:1}

.hero::after{
  content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(to top,var(--tinta) 2%,rgba(11,10,12,.72) 38%,rgba(11,10,12,.15) 78%);
}
.hero-in{position:relative;z-index:3;padding:150px 0 clamp(52px,9vh,96px)}

.rotulo{
  font-family:'IBM Plex Mono',monospace;font-size:12px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gris);
}
.hero h1{margin:0;line-height:0;display:flex;justify-content:flex-end}
.logo-glitch{
  position:relative;display:inline-block;line-height:0;
  transform:rotate(var(--logo-giro));transform-origin:right bottom;
}
.logo-glitch img{
  display:block;width:min(56vw,var(--logo-hero));height:auto;
  filter:drop-shadow(0 0 32px rgba(216,10,75,.4)) drop-shadow(0 12px 30px rgba(0,0,0,.8));
}
/* dos copias del logo que solo aparecen durante la falla */
.logo-glitch::before,
.logo-glitch::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:url('logo.png') center/contain no-repeat;
  opacity:0;
}
.logo-glitch::before{filter:hue-rotate(158deg) saturate(2.4) brightness(1.2)}
.logo-glitch::after{filter:hue-rotate(-24deg) saturate(1.8)}

.logo-glitch.falla img{animation:falla-base .2s steps(2,end)}
.logo-glitch.falla::before{animation:falla-a .2s steps(1,end)}
.logo-glitch.falla::after{animation:falla-b .2s steps(1,end)}

@keyframes falla-base{
  0%  {transform:translate3d(5px,0,0) skewX(-4deg)}
  40% {transform:translate3d(-4px,1px,0) skewX(3deg)}
  70% {transform:translate3d(2px,-1px,0)}
  100%{transform:none}
}
@keyframes falla-a{
  0%  {opacity:.9;clip-path:inset(14% 0 56% 0);transform:translate3d(-13px,-2px,0)}
  40% {opacity:.9;clip-path:inset(44% 0 30% 0);transform:translate3d(9px,1px,0)}
  70% {opacity:.7;clip-path:inset(6% 0 78% 0);transform:translate3d(-6px,0,0)}
  100%{opacity:0;transform:none}
}
@keyframes falla-b{
  0%  {opacity:.85;clip-path:inset(62% 0 12% 0);transform:translate3d(11px,2px,0)}
  40% {opacity:.85;clip-path:inset(24% 0 60% 0);transform:translate3d(-8px,-1px,0)}
  70% {opacity:.6;clip-path:inset(76% 0 4% 0);transform:translate3d(5px,1px,0)}
  100%{opacity:0;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .logo-glitch.falla img,
  .logo-glitch.falla::before,
  .logo-glitch.falla::after{animation:none}
}
.hero-pie{
  margin-top:26px;display:flex;flex-wrap:wrap;gap:12px 30px;align-items:baseline;
  border-top:var(--borde);padding-top:22px;
}
.hero-pie span{font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.1em;color:var(--gris)}
.hero-pie strong{font-weight:600;color:var(--hueso);letter-spacing:.02em}

/* ---------------- cinta roja ---------------- */
.cinta{background:var(--rosa);color:var(--tinta);overflow:hidden;padding:13px 0}
.cinta-pista{display:flex;width:max-content;animation:corre 26s linear infinite}
.cinta-pista span{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:22px;letter-spacing:.2em;text-transform:uppercase;
  padding-right:44px;white-space:nowrap;
}
@keyframes corre{to{transform:translateX(-50%)}}

/* ---------------- bloques oscuros ---------------- */
.bloque{position:relative;overflow:hidden;padding:clamp(88px,14vh,150px) 0;scroll-margin-top:60px}
.bloque .capa{background-position:center;opacity:.5}
#seguir .capa{background-image:var(--fondo1)}
.bloque::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:radial-gradient(120% 90% at 50% 40%,rgba(11,10,12,.62),var(--tinta) 76%);
}
.bloque .wrap{position:relative;z-index:2}

/* ---------------- single ---------------- */
.single-grid{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);
  gap:clamp(36px,6vw,84px);align-items:center;
}
.portada{
  display:block;width:100%;max-width:470px;aspect-ratio:1;
  object-fit:cover;background:#141216;
  transform:rotate(1.6deg);
  box-shadow:0 40px 92px rgba(0,0,0,.7);
  transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.portada:hover{transform:rotate(0deg) scale(1.015)}
.portada-pie{
  margin:20px 0 0;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#6E6971;
}
.titulo-single{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:900;margin:14px 0 0;
  font-size:clamp(56px,8.6vw,124px);line-height:.82;letter-spacing:-.015em;
}
.bajada{
  margin:22px 0 0;max-width:46ch;color:#C4BFB6;
  font-size:clamp(16px,1.7vw,19px);line-height:1.6;
}
.reloj{
  display:flex;gap:clamp(16px,3.4vw,42px);
  margin-top:36px;flex-wrap:wrap;
}
.reloj .u{display:flex;flex-direction:column;align-items:center;gap:8px}
.reloj .n{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:clamp(50px,8vw,92px);line-height:.9;
  color:var(--rosa);font-variant-numeric:tabular-nums;
}
.reloj .l{
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gris);
}
.salio{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:clamp(28px,4vw,46px);color:var(--rosa);
  margin-top:38px;letter-spacing:.02em;
}

/* ---------------- botones ---------------- */
.boton{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:0 30px;margin-top:40px;
  background:var(--hueso);color:var(--tinta);
  text-decoration:none;border:1px solid var(--hueso);
  font-family:'IBM Plex Mono',monospace;font-size:13px;
  letter-spacing:.14em;text-transform:uppercase;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.boton:hover,.boton:focus-visible{background:transparent;color:var(--hueso);transform:translateY(-2px)}
.boton.oscuro{background:var(--tinta);color:var(--hueso);border-color:var(--tinta)}
.boton.oscuro:hover,.boton.oscuro:focus-visible{background:transparent;color:var(--tinta)}

/* ---------------- fechas: el afiche pegado ---------------- */
#fechas{padding:clamp(88px,14vh,150px) 0;scroll-margin-top:60px}
.afiche-marco{
  max-width:960px;margin-inline:auto;
  filter:drop-shadow(0 26px 52px rgba(0,0,0,.66));
}
.afiche{
  position:relative;
  background-color:var(--hueso);color:#141216;
  padding:clamp(40px,5.5vw,68px) clamp(24px,4.5vw,58px) clamp(36px,4.5vw,56px);
  transform:rotate(-1.2deg);
  /* borde superior e inferior rasgados, como arrancado de la pared */
  clip-path:polygon(
    0% 1.0%, 7% 0.2%, 14% 1.3%, 21% 0.4%, 29% 1.1%, 36% 0.3%, 44% 1.4%,
    52% 0.5%, 60% 1.2%, 68% 0.2%, 76% 1.3%, 84% 0.6%, 92% 1.1%, 100% 0.3%,
    100% 98.9%, 93% 99.8%, 85% 98.6%, 77% 99.7%, 69% 98.8%, 61% 99.8%,
    53% 98.7%, 45% 99.6%, 37% 98.9%, 29% 99.7%, 21% 98.7%, 13% 99.6%,
    6% 98.8%, 0% 99.8%
  );
  background-image:
    /* fibra del papel */
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4'/></filter><rect width='220' height='220' filter='url(%23f)' opacity='.32'/></svg>"),
    /* arruga diagonal donde el papel no apoyó */
    linear-gradient(103deg,transparent 38%,rgba(20,18,22,.045) 39.4%,rgba(255,255,255,.5) 40.2%,transparent 42%),
    /* humedad del engrudo */
    radial-gradient(56% 38% at 10% 92%,rgba(146,112,66,.13),transparent 72%),
    radial-gradient(42% 30% at 90% 8%,rgba(126,98,60,.11),transparent 72%),
    radial-gradient(30% 22% at 68% 58%,rgba(146,112,66,.07),transparent 74%);
  box-shadow:inset 0 0 46px rgba(120,94,58,.17);
}

.afiche-rot{
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.24em;text-transform:uppercase;color:#7A7469;
}
.afiche h2{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:900;margin:10px 0 30px;
  font-size:clamp(56px,10.5vw,132px);line-height:.8;letter-spacing:-.02em;
  /* registro corrido de imprenta: la tinta magenta quedó mal alineada */
  text-shadow:3px -3px 0 rgba(216,10,75,.42);
}
.lista{border-top:2px solid #141216}
.fila{
  display:grid;grid-template-columns:150px 1fr auto;
  gap:10px 24px;align-items:center;
  padding:20px 12px;border-bottom:1px solid rgba(20,18,22,.22);
  text-decoration:none;color:inherit;
  transition:background .16s ease,padding .16s ease;
}
a.fila:hover,a.fila:focus-visible{background:#141216;color:var(--hueso);padding-inline:20px 12px}
a.fila:hover .lugar,a.fila:focus-visible .lugar{color:rgba(239,233,220,.66)}
a.fila:hover .accion,a.fila:focus-visible .accion{color:var(--hueso);border-color:var(--hueso)}
.dia{
  font-family:'IBM Plex Mono',monospace;font-size:14px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:500;
}
.ciudad{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:clamp(26px,3.6vw,42px);line-height:1;letter-spacing:-.01em;
}
.lugar{display:block;font-size:14px;color:#6E6961;letter-spacing:.02em;margin-top:5px;transition:color .16s ease}
.acc-flyer{display:flex;align-items:center;gap:16px}
.mini{
  display:block;width:46px;height:auto;flex:none;
  transform:rotate(2.5deg);
  box-shadow:0 4px 12px rgba(0,0,0,.34);
  transition:transform .2s ease;
}
a.fila:hover .mini,a.fila:focus-visible .mini{transform:rotate(0) scale(1.06)}
.accion{
  font-family:'IBM Plex Mono',monospace;font-size:12px;
  letter-spacing:.16em;text-transform:uppercase;
  border-bottom:1px solid var(--rosa-tinta);color:var(--rosa-tinta);padding-bottom:3px;
  transition:color .16s ease,border-color .16s ease;
}
.fila.agotado{opacity:.42}
.fila.agotado .accion{color:#6E6961;border-color:transparent}
.vacio{padding:34px 12px;font-size:17px;color:#6E6961}
.nota{
  margin-top:26px;font-family:'IBM Plex Mono',monospace;
  font-size:12px;letter-spacing:.08em;color:#7A7469;
}
.nota a{color:#141216}

/* ---------------- cierre ---------------- */
#seguir{text-align:center}
#seguir .arroba{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:900;margin:16px 0 0;
  font-size:clamp(50px,11vw,158px);line-height:.85;letter-spacing:-.02em;
  text-decoration:none;display:inline-block;
}
#seguir .arroba:hover,#seguir .arroba:focus-visible{color:var(--rosa)}

footer{padding:46px 0;border-top:var(--borde)}
.pie-titulo{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;margin:0 0 16px;
  font-size:clamp(22px,2.6vw,32px);line-height:1;letter-spacing:-.01em;
  color:#A29DA8;
}
.pie-bio{
  margin:0 0 30px;max-width:60ch;
  color:#7B7681;font-size:14px;line-height:1.7;
}
.pie-rot{
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.24em;text-transform:uppercase;color:#5E5A63;
  margin:0 0 16px;font-weight:400;
}
.formacion{
  list-style:none;margin:0 0 36px;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:16px 26px;max-width:820px;
}
.formacion li{
  border-top:1px solid rgba(239,233,220,.12);padding-top:12px;
}
.formacion .instr{
  display:block;font-family:'IBM Plex Mono',monospace;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#5E5A63;
}
.formacion .quien{
  display:block;margin-top:6px;
  font-size:16px;font-weight:600;color:#A29DA8;letter-spacing:.01em;
}
.pie{
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:#5E5A63;
  border-top:var(--borde);padding-top:24px;
}

/* ---------------- entrada en escena ---------------- */
.sube{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.sube.entro{opacity:1;transform:none}
.sube.d1{transition-delay:.1s}
.sube.d2{transition-delay:.2s}

/* ---------------- visor de flyers ---------------- */
.visor{
  position:fixed;inset:0;z-index:90;display:none;
  place-items:center;padding:clamp(18px,4vw,44px);
  background:rgba(6,5,7,.92);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.visor.abierto{display:grid;animation:asoma .28s ease}
@keyframes asoma{from{opacity:0}to{opacity:1}}
.visor-caja{margin:0;display:grid;gap:16px;justify-items:center}
.visor img{
  display:block;max-width:min(90vw,600px);max-height:78vh;
  width:auto;height:auto;
  box-shadow:0 44px 110px rgba(0,0,0,.75);
}
.visor-pie{
  margin:0;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#7C7783;
}
.visor-cerrar{
  position:absolute;top:16px;right:18px;
  background:none;border:1px solid rgba(239,233,220,.3);color:var(--hueso);
  width:44px;height:44px;border-radius:50%;cursor:pointer;
  font-size:20px;line-height:1;
  transition:background .18s ease,color .18s ease;
}
.visor-cerrar:hover{background:var(--hueso);color:var(--tinta)}

/* texto que leen buscadores y lectores de pantalla, invisible en la página */
.solo-lectores{
  position:absolute;width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

:focus-visible{outline:2px solid var(--rosa);outline-offset:3px}

/* ---------------- mobile ---------------- */
@media (max-width:820px){
  .wrap{width:min(var(--max),calc(100% - 26px))}
  .nav-in{height:66px}
  .marca img{height:30px}
  .menu{gap:16px}
  .menu a.oculta{display:none}
  .hero-in{padding-top:120px}
  .afiche{transform:rotate(-.7deg);padding:34px 20px}
  .fila{grid-template-columns:1fr;gap:6px;padding:20px 6px}
  a.fila:hover,a.fila:focus-visible{padding-inline:6px}
  .accion{justify-self:start;margin-top:8px}
  .acc-flyer{margin-top:12px}
  .mini{width:40px}
  .reloj{gap:18px}
  .single-grid{grid-template-columns:1fr;gap:34px}
  .portada{max-width:340px;margin-inline:auto;transform:rotate(1.2deg)}
  .portada-pie{text-align:center}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .cinta-pista{animation:none}
  .sube{opacity:1;transform:none;transition:none}
  .capa{transform:none !important}
}

/* ============================================================
   ARCHIVO DE SHOWS
   Estilos de: bloque "Del archivo" en la home,
   página /shows/ y fichas de cada fecha.
   ============================================================ */

/* ---------------- bloque del archivo en la home ---------------- */
.archivo-lista{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:clamp(20px,3vw,34px);margin-top:8px;
}
.tarjeta{
  display:block;text-decoration:none;color:inherit;
  border-top:1px solid rgba(239,233,220,.16);padding-top:18px;
}
.tarjeta-foto{
  display:block;width:100%;aspect-ratio:4/3;object-fit:cover;
  background:#141216;filter:grayscale(.55) contrast(1.05);
  transition:filter .35s ease,transform .35s ease;
}
.tarjeta:hover .tarjeta-foto,.tarjeta:focus-visible .tarjeta-foto{
  filter:none;transform:scale(1.014);
}
.tarjeta-fecha{
  display:block;margin-top:16px;
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gris);
}
.tarjeta-lugar{
  display:block;margin-top:8px;
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:clamp(28px,3.4vw,40px);line-height:1;
}
.tarjeta-pie{
  display:block;margin-top:8px;font-size:14px;color:#7B7681;line-height:1.5;
}
.tarjeta:hover .tarjeta-lugar,.tarjeta:focus-visible .tarjeta-lugar{color:var(--rosa)}

.mas{display:flex;justify-content:flex-start;margin-top:48px}

/* ---------------- página de archivo ---------------- */
.archivo-cabeza{padding:150px 0 clamp(40px,7vh,72px);border-bottom:var(--borde)}
.archivo-cabeza h1{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:900;margin:14px 0 0;
  font-size:clamp(60px,11vw,150px);line-height:.84;letter-spacing:-.02em;
}
.archivo-intro{
  margin:24px 0 0;max-width:54ch;color:#B0ABB5;
  font-size:clamp(16px,1.7vw,19px);line-height:1.6;
}
.archivo-cuerpo{padding:clamp(56px,8vh,90px) 0 clamp(80px,12vh,130px)}
.anio{
  font-family:'IBM Plex Mono',monospace;font-size:12px;
  letter-spacing:.24em;color:var(--gris);margin:0 0 26px;
}

/* ---------------- ficha de show ---------------- */
.show-cabeza{padding:140px 0 clamp(34px,5vh,58px)}
.show-volver{
  display:inline-block;text-decoration:none;
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gris);
  border-bottom:1px solid transparent;padding-bottom:3px;
  transition:color .18s ease,border-color .18s ease;
}
.show-volver:hover,.show-volver:focus-visible{color:var(--hueso);border-color:var(--rosa)}
.show-cabeza h1{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:900;margin:26px 0 0;
  font-size:clamp(62px,13vw,180px);line-height:.8;letter-spacing:-.025em;
}
.show-meta{
  margin:24px 0 0;padding-top:20px;border-top:var(--borde);
  font-family:'IBM Plex Mono',monospace;font-size:13px;
  letter-spacing:.08em;color:var(--gris);line-height:1.9;
}
.show-meta b{color:var(--hueso);font-weight:500}

/* foto de apertura, a sangre */
.show-portada{
  display:block;width:100%;height:auto;
  aspect-ratio:16/9;object-fit:cover;background:#141216;
}

/* reseña + flyer */
.show-relato{
  display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,.45fr);
  gap:clamp(32px,5vw,72px);align-items:start;
  padding:clamp(56px,8vh,96px) 0;
}
.resena p{
  margin:0 0 22px;max-width:58ch;
  font-size:clamp(17px,1.85vw,20px);line-height:1.68;color:#CFCAD3;
}
.resena p:last-child{margin-bottom:0}
.resena p.destacada{
  color:var(--hueso);
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:700;font-size:clamp(26px,3.2vw,38px);line-height:1.12;
  letter-spacing:-.01em;max-width:20ch;
}
.flyer-chico{
  display:block;width:100%;max-width:280px;height:auto;
  transform:rotate(1.8deg);
  box-shadow:0 22px 52px rgba(0,0,0,.66);
  transition:transform .4s cubic-bezier(.2,.7,.2,1);
}
.flyer-chico:hover{transform:rotate(0) scale(1.03)}
.flyer-pie{
  margin:16px 0 0;font-family:'IBM Plex Mono',monospace;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#6E6971;
}

/* galería */
.galeria{
  display:grid;grid-template-columns:repeat(6,1fr);
  gap:clamp(8px,1.2vw,16px);
}
.galeria img{
  display:block;width:100%;height:100%;object-fit:cover;
  background:#141216;cursor:zoom-in;
  transition:opacity .25s ease;
}
.galeria img:hover{opacity:.86}
.g-ancha{grid-column:span 4;aspect-ratio:3/2}
.g-alta{grid-column:span 2;aspect-ratio:2/3}
.g-media{grid-column:span 3;aspect-ratio:4/3}
.g-chica{grid-column:span 2;aspect-ratio:1}
.credito{
  margin:20px 0 0;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#5E5A63;
}
.credito a{color:#8A858F}

/* setlist: papel pegado al piso del escenario */
.setlist-zona{padding:clamp(64px,10vh,110px) 0}
.setlist-marco{
  max-width:620px;
  filter:drop-shadow(0 22px 46px rgba(0,0,0,.62));
}
.setlist{
  background-color:var(--hueso);color:#141216;
  padding:clamp(30px,4vw,46px) clamp(24px,3.4vw,40px);
  transform:rotate(-1deg);
  clip-path:polygon(
    0% 0.8%, 9% 0.1%, 18% 1.1%, 27% 0.3%, 36% 1.0%, 45% 0.2%, 54% 1.2%,
    63% 0.4%, 72% 1.0%, 81% 0.2%, 90% 1.1%, 100% 0.4%,
    100% 99.2%, 91% 99.9%, 82% 98.8%, 73% 99.8%, 64% 98.9%, 55% 99.9%,
    46% 98.8%, 37% 99.7%, 28% 99.0%, 19% 99.8%, 10% 98.9%, 0% 99.7%
  );
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4'/></filter><rect width='200' height='200' filter='url(%23f)' opacity='.28'/></svg>"),
    radial-gradient(48% 34% at 88% 90%,rgba(146,112,66,.12),transparent 74%);
  box-shadow:inset 0 0 38px rgba(120,94,58,.15);
}
.setlist h2{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:900;margin:0 0 22px;
  font-size:clamp(40px,6vw,64px);line-height:.85;letter-spacing:-.02em;
  text-shadow:2px -2px 0 rgba(216,10,75,.38);
}
.setlist ol{margin:0;padding:0;list-style:none;counter-reset:tema}
.setlist li{
  counter-increment:tema;
  display:grid;grid-template-columns:30px 1fr;gap:12px;
  padding:11px 0;border-bottom:1px solid rgba(20,18,22,.16);
}
.setlist li::before{
  content:counter(tema,decimal-leading-zero);
  font-family:'IBM Plex Mono',monospace;font-size:12px;
  color:#8B8478;padding-top:4px;
}
.tema{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:clamp(21px,2.6vw,27px);line-height:1.05;
  text-transform:uppercase;letter-spacing:-.005em;
}
.detalle{
  display:block;margin-top:4px;
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.06em;color:#6E6961;line-height:1.5;
}
.detalle a{color:var(--rosa-tinta)}
.setlist-nota{
  margin:22px 0 0;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.06em;color:#8B8478;line-height:1.6;
}

/* invitados y links */
.datos{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:clamp(28px,4vw,56px);
  padding:clamp(52px,8vh,86px) 0;border-top:var(--borde);
}
.datos h2{
  font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:400;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gris);
  margin:0 0 20px;
}
.datos ul{margin:0;padding:0;list-style:none}
.datos li{
  padding:14px 0;border-top:1px solid rgba(239,233,220,.1);
  font-size:15px;line-height:1.55;color:#B0ABB5;
}
.datos li strong{display:block;color:var(--hueso);font-weight:600;font-size:17px}
.datos li a{color:#8A858F}
.datos li a:hover{color:var(--rosa)}

/* anterior / siguiente */
.saltos{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
  padding:clamp(40px,6vh,68px) 0 clamp(70px,10vh,110px);
  border-top:var(--borde);
}
.salto{
  text-decoration:none;color:inherit;display:block;
  transition:color .18s ease;
}
.salto.der{text-align:right}
.salto span{
  display:block;font-family:'IBM Plex Mono',monospace;
  font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#5E5A63;
}
.salto b{
  display:block;margin-top:10px;
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:clamp(22px,3vw,32px);line-height:1;
}
.salto:hover b,.salto:focus-visible b{color:var(--rosa)}
.salto.vacio{opacity:.3;pointer-events:none}

@media (max-width:820px){
  .show-cabeza{padding-top:110px}
  .show-relato{grid-template-columns:1fr;gap:38px;padding:44px 0}
  .flyer-chico{max-width:220px;transform:rotate(1.4deg)}
  .galeria{grid-template-columns:repeat(2,1fr);gap:8px}
  .g-ancha,.g-media{grid-column:span 2;aspect-ratio:3/2}
  .g-alta{grid-column:span 1;aspect-ratio:2/3}
  .g-chica{grid-column:span 1;aspect-ratio:1}
  .setlist{transform:rotate(-.6deg)}
  .archivo-cabeza{padding-top:110px}
  .saltos{gap:14px}
}
.g-full{grid-column:span 6;aspect-ratio:16/9}
@media (max-width:820px){.g-full{grid-column:span 2}}

/* ---------------- adelantos del single ---------------- */
.adelantos{
  margin:44px 0 0;padding:0;list-style:none;
  max-width:440px;border-top:1px solid rgba(239,233,220,.14);
}
.adelantos a{
  display:flex;align-items:baseline;gap:16px;
  padding:15px 0;text-decoration:none;
  border-bottom:1px solid rgba(239,233,220,.09);
  transition:color .18s ease,padding-left .18s ease;
}
.adelantos a:hover,.adelantos a:focus-visible{color:var(--rosa);padding-left:8px}
.adelantos .num{
  font-family:'Big Shoulders Display',Impact,sans-serif;
  font-weight:800;font-size:20px;line-height:1;color:var(--rosa);
  flex:none;width:26px;
}
.adelantos .que{
  font-family:'IBM Plex Mono',monospace;font-size:13px;
  letter-spacing:.06em;color:#B0ABB5;flex:1;
}
.adelantos a:hover .que,.adelantos a:focus-visible .que{color:var(--hueso)}
.adelantos .flecha{font-size:12px;color:#5E5A63}
