/* ==========================================================================
   AZTECH METAL - PÁGINA DE EVENTO
   Una página por concierto, en formato de revista: portada con el cartel,
   ficha de datos duros pegada arriba, texto sobre la banda y enlaces a las
   fuentes originales.

   Se carga después de grafico.css y agenda.css, así que hereda las
   variables de color y las tipografías del resto del sitio.
   ========================================================================== */

.ev-main { padding-bottom: 5rem; }

/* ----------------------------- Portada ----------------------------- */
.ev-hero {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: clamp(320px, 46vw, 520px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: #08080a;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* La imagen se duplica: una desenfocada que rellena el ancho y otra nítida
   centrada. Así un cartel vertical no se recorta ni deja franjas negras. */
.ev-hero-fondo {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: blur(38px) saturate(0.5) brightness(0.32);
  transform: scale(1.15);
}
.ev-hero-fondo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(5, 4, 4, 0.96) 4%, rgba(5, 4, 4, 0.35) 55%, rgba(5, 4, 4, 0.7) 100%);
}

.ev-hero-inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 4vw, 3rem) clamp(1.6rem, 3vw, 2.4rem);
  display: grid;
  grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
  gap: clamp(1.2rem, 3vw, 2.6rem);
  align-items: end;
}

.ev-cartel {
  display: block;
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.7);
  background: #0b0b0e;
}

.ev-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gx-red, #FF2A24);
  margin-bottom: 0.7rem;
}
.ev-kicker span { color: rgba(255, 255, 255, 0.55); }

.ev-title {
  font-family: var(--font-headline, 'Barlow Condensed', sans-serif);
  font-size: clamp(2.2rem, 5.6vw, 4.4rem);
  font-weight: 800;
  line-height: 0.94;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 0.7rem;
  text-wrap: balance;
}
.ev-title em { font-style: normal; color: var(--gx-red, #FF2A24); }

.ev-stand {
  font-size: clamp(0.98rem, 1.5vw, 1.12rem);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.76);
  margin: 0;
  max-width: 62ch;
}

.ev-credito {
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.38);
  margin: 0.55rem 0 0;
}

/* ----------------------------- Cuerpo ----------------------------- */
.ev-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3.2rem) clamp(1rem, 4vw, 3rem) 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 330px);
  gap: clamp(1.6rem, 4vw, 3.2rem);
  align-items: start;
}

.ev-texto h2 {
  font-family: var(--font-headline, 'Barlow Condensed', sans-serif);
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  color: #fff;
  margin: 2.6rem 0 0.9rem;
  padding-left: 0.85rem;
  border-left: 3px solid var(--gx-red, #FF2A24);
}
.ev-texto h2:first-child { margin-top: 0; }

.ev-texto p {
  font-size: 1.02rem;
  line-height: 1.78;
  color: rgba(255, 255, 255, 0.74);
  margin: 0 0 1.1rem;
  max-width: 68ch;
}
.ev-texto strong { color: #fff; font-weight: 600; }
.ev-texto a { color: var(--gx-red, #FF2A24); text-underline-offset: 3px; }
.ev-texto a:hover { color: #fff; }

/* Discografía: lista de dos columnas con el año en tipografía de datos. */
.ev-discos {
  list-style: none;
  margin: 1.2rem 0 0.5rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.ev-discos li {
  background: var(--gx-panel, #101014);
  padding: 0.8rem 1rem;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.78);
  font-variant-numeric: tabular-nums;
}

.ev-dato {
  background: var(--gx-panel, #101014);
  border-left: 3px solid var(--gx-red, #FF2A24);
  padding: 1.15rem 1.3rem;
  margin: 2rem 0;
}
.ev-dato b {
  display: block;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gx-red, #FF2A24);
  margin-bottom: 0.45rem;
}
.ev-dato p { margin: 0; max-width: none; }

/* -------------------------- Ficha lateral -------------------------- */
.ev-aside { position: sticky; top: 5.5rem; display: grid; gap: 1rem; }
@media (max-width: 900px) { .ev-aside { position: static; } }

.ev-panel {
  background: var(--gx-panel, #101014);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.ev-panel-head {
  padding: 0.75rem 1.1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
}

.ev-datos { list-style: none; margin: 0; padding: 0; }
.ev-datos li {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 0.7rem;
  padding: 0.7rem 1.1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  font-size: 0.92rem;
  line-height: 1.45;
}
.ev-datos li:last-child { border-bottom: 0; }
.ev-datos dt, .ev-datos .ev-k {
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.42);
  padding-top: 0.16rem;
}
.ev-datos .ev-v { color: rgba(255, 255, 255, 0.86); font-variant-numeric: tabular-nums; }

.ev-cta {
  display: block;
  padding: 0.95rem 1.1rem;
  background: var(--gx-red, #FF2A24);
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: background 0.18s ease, transform 0.18s ease;
}
.ev-cta:hover { background: #fff; color: #0a0a0c; }
.ev-cta:active { transform: translateY(1px); }
/* Cuando no hay botón de compra ("Boletos por anunciar", "Taquilla del Circo
   Volador", "Entrada libre", "Evento concluido"): la misma caja que el botón,
   apagada. Nunca tuvo estilo y salía como texto suelto fuera del panel. */
.ev-pasado-cta {
  display: block;
  margin: 0 1rem 1rem;
  padding: 0.9rem 1.1rem;
  border: 1px dashed rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.03);
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ev-enlaces { list-style: none; margin: 0; padding: 0; }
.ev-enlaces li { border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.ev-enlaces li:last-child { border-bottom: 0; }
.ev-enlaces a {
  display: block;
  padding: 0.75rem 1.1rem;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
}
.ev-enlaces a:hover { color: #fff; background: rgba(255, 255, 255, 0.04); }
.ev-enlaces small {
  display: block;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.35);
  margin-top: 0.15rem;
}

.ev-aviso {
  font-size: 0.82rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.5);
  padding: 0.95rem 1.1rem;
}
.ev-aviso a { color: var(--gx-red, #FF2A24); }

/* --------------------------- Otras fechas --------------------------- */
.ev-otras { list-style: none; margin: 0; padding: 0; }
.ev-otras li { border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.ev-otras li:last-child { border-bottom: 0; }
.ev-otras a {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 0.8rem;
  align-items: center;
  padding: 0.8rem 1.1rem;
  text-decoration: none;
}
.ev-otras a:hover { background: rgba(255, 255, 255, 0.04); }
.ev-otras .ev-f {
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gx-red, #FF2A24);
  text-align: center;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
}
.ev-otras .ev-f b { display: block; font-size: 1.15rem; color: #fff; }
.ev-otras .ev-n { font-size: 0.92rem; color: rgba(255, 255, 255, 0.82); line-height: 1.3; }
.ev-otras .ev-s {
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.45);
  display: block;
  margin-top: 0.15rem;
}

/* --------------------------- Pie del texto --------------------------- */
.ev-fuentes {
  max-width: 1280px;
  margin: 3rem auto 0;
  padding: 1.6rem clamp(1rem, 4vw, 3rem) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.ev-fuentes h3 {
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  margin: 0 0 0.7rem;
}
.ev-fuentes p { font-size: 0.88rem; line-height: 1.65; color: rgba(255, 255, 255, 0.55); margin: 0 0 0.5rem; }
.ev-fuentes a { color: var(--gx-red, #FF2A24); }

.ev-volver {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
  margin: 2rem 0 0;
}
.ev-volver:hover { color: var(--gx-red, #FF2A24); }

/* ----------------------------- Angosto ----------------------------- */
@media (max-width: 900px) {
  .ev-hero-inner { grid-template-columns: minmax(0, 1fr); }
  .ev-cartel { max-width: 260px; }
  .ev-wrap { grid-template-columns: minmax(0, 1fr); }
}

/* Boton de compra junto a cada fecha de la barra lateral de una nota. */
.ev-otras-con-compra { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0.5rem; }
.ev-otras-con-compra > a:first-child { min-width: 0; }
.ev-otras-compra {
  margin-right: 0.6rem;
  padding: 0.38rem 0.6rem;
  background: var(--neon-crimson, #FF2A24);
  color: #fff;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}
.ev-otras-compra:hover { filter: brightness(1.12); }
.ev-otras-pendiente {
  margin-right: 0.6rem;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.58rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  white-space: nowrap;
}

/* ===================================================== EL LUGAR, ETIQUETA
   El recinto de cada ficha lleva a su página (recinto-*.html), con todas
   sus fechas. En la portada del evento va como etiqueta, bajo el titular. */
.ev-lugar {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.9rem;
  padding: 0.5rem 0.85rem 0.5rem 0.65rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(5, 4, 4, 0.55);
  color: #fff;
  font-family: var(--font-data, 'Barlow', sans-serif);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: border-color 0.2s, background-color 0.2s;
}
.ev-lugar svg { width: 16px; height: 16px; fill: none; stroke: var(--gx-red, #FF2A24); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ev-lugar i { font-style: normal; font-weight: 500; letter-spacing: 0.04em; text-transform: none; color: rgba(255, 255, 255, 0.55); }
.ev-lugar:hover { border-color: var(--gx-red, #FF2A24); background: rgba(255, 42, 36, 0.1); }
.ev-lugar:focus-visible { outline: 2px solid var(--gx-red, #FF2A24); outline-offset: 3px; }
.ev-datos .ev-v a { color: #fff; text-decoration: underline; text-decoration-color: var(--gx-red, #FF2A24); text-underline-offset: 3px; }
.ev-datos .ev-v a:hover { color: var(--gx-red, #FF2A24); }

/* ========================================================= PÁGINA DE RECINTO */
/* Los carteles de sus próximas fechas, en abanico: la sala no tiene un cartel
   propio y sin ellos la portada se quedaba vacía. */
.rc-hero .ev-hero-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: end; }
.rc-hero .ev-hero-inner > :last-child { order: -1; }
.rc-carteles { display: flex; justify-content: flex-end; align-items: flex-end; min-height: 200px; }
.rc-carteles img {
  width: 30%; max-width: 170px; aspect-ratio: 3 / 4; object-fit: contain; display: block; margin-left: -4%;
  border: 1px solid rgba(255, 255, 255, 0.16); box-shadow: 0 18px 44px rgba(0, 0, 0, 0.75); background: #0b0b0e;
}
.rc-carteles img:first-child { margin-left: 0; }
.rc-carteles img:nth-child(odd) { transform: translateY(-10px); }
@media (max-width: 860px) {
  .rc-hero .ev-hero-inner { grid-template-columns: minmax(0, 1fr); }
  .rc-hero .ev-hero-inner > :last-child { order: 0; }
  .rc-carteles { justify-content: flex-start; min-height: 0; }
  .rc-carteles img { width: 24%; }
}
.rc-fechas { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 0.8rem; }
.rc-fecha {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  padding: 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.02);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.2s, background-color 0.2s;
}
.ev-texto .rc-fecha { color: inherit; }
.rc-fecha:hover { border-color: var(--gx-red, #FF2A24); background: rgba(255, 42, 36, 0.06); }
.rc-fecha img { width: 92px; height: 92px; object-fit: contain; display: block; background: #0b0b0e; } /* el cartel completo, sin cortar */
.rc-fecha-texto { display: grid; gap: 0.2rem; min-width: 0; }
.rc-fecha-texto i {
  font-style: normal; font-family: var(--font-data, 'Barlow', sans-serif); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--gx-red, #FF2A24);
}
.rc-fecha-texto b { font-family: var(--font-display, 'Bebas Neue', sans-serif); font-weight: 400; font-size: 1.6rem; line-height: 1; letter-spacing: 0.03em; color: #fff; }
.rc-fecha-texto small { font-size: 0.86rem; line-height: 1.45; color: rgba(255, 255, 255, 0.62); }
.rc-fecha-texto em { font-style: normal; font-family: var(--font-data, 'Barlow', sans-serif); font-size: 0.8rem; font-weight: 600; color: rgba(255, 255, 255, 0.86); }
.rc-pasadas { margin-top: 1rem; border: 1px solid rgba(255, 255, 255, 0.07); }
.rc-mapa { padding: 0; line-height: 0; overflow: hidden; }
.rc-mapa iframe { display: block; width: 100%; height: 260px; border: 0; filter: grayscale(0.4) contrast(1.05); background: #111; }
@media (max-width: 560px) {
  .rc-fecha { grid-template-columns: 72px minmax(0, 1fr); gap: 0.8rem; }
  .rc-fecha img { width: 72px; height: 72px; }
  .rc-fecha-texto b { font-size: 1.35rem; }
}

/* ======================================================= RECINTO INSIGNIA
   La página completa de un recinto (hoy, el Dragón Rojo): portada con su
   logo y cifras, su evento especial, la cartelera en grande, la historia,
   sus marcas y cómo llegar. Lo escribe mainInsignia() en generar-eventos.js. */
.ri-main { padding-bottom: 3rem; }
.ri-hero { position: relative; isolation: isolate; overflow: hidden; padding: clamp(3rem, 7vw, 6rem) clamp(1rem, 4vw, 3rem) 0; }
.ri-hero::before { content: ""; position: absolute; inset: -4%; z-index: -2; background: var(--fondo) center 70% / cover no-repeat; }
.ri-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to bottom, rgba(5, 4, 4, .45), rgba(5, 4, 4, .7) 55%, #0a0a0c 98%), linear-gradient(90deg, rgba(5, 4, 4, .7), transparent 60%); }
.ri-hero-inner { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.ri-logo { display: block; width: 100%; height: auto; filter: drop-shadow(0 0 30px rgba(255, 59, 52, .4)); }
.ri-t { margin: .5rem 0 .4rem; font: 400 clamp(3rem, 7vw, 6rem)/.9 var(--font-display); letter-spacing: .02em; text-transform: uppercase; color: #fff; }
.ri-t em, .ri-h2 em { font-style: normal; color: var(--gx-red, #FF2A24); }
.ri-lema { margin: 0; max-width: 40ch; font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.5; color: rgba(255, 255, 255, .8); }
.ri-acciones { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.4rem; }
.ri-btn {
  display: inline-flex; align-items: center; justify-content: center; padding: .85rem 1.3rem; white-space: nowrap; text-decoration: none;
  font: 700 .72rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .12em; text-transform: uppercase;
}
.ri-btn--hueco { border: 1px solid rgba(255, 255, 255, .32); color: #fff; transition: border-color .2s, background-color .2s; }
.ri-btn--hueco:hover { border-color: #fff; background: rgba(255, 255, 255, .06); }
.ri-btn--apagado { border: 1px dashed rgba(255, 255, 255, .2); color: rgba(255, 255, 255, .45); }
.ri-cifras {
  list-style: none; max-width: 1280px; margin: clamp(2.2rem, 5vw, 3.6rem) auto 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid rgba(255, 255, 255, .12);
}
.ri-cifras li { display: grid; gap: .25rem; padding: 1.2rem 1.1rem; }
.ri-cifras li + li { border-left: 1px solid rgba(255, 255, 255, .1); }
.ri-cifras b { font: 400 clamp(2.6rem, 4.6vw, 3.8rem)/1 var(--font-display); color: #fff; }
.ri-cifras span { font: 600 .68rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }

/* El evento especial: los dos dragones y el logo del aniversario. */
.ri-aniv {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 480px) minmax(0, 1fr); align-items: end;
  max-width: 1280px; margin: clamp(2.6rem, 5vw, 4rem) auto 0; padding: 1.4rem 1rem 0; overflow: hidden;
  color: #fff; text-decoration: none; border: 1px solid rgba(255, 255, 255, .1);
  background: radial-gradient(55% 90% at 12% 85%, rgba(60, 155, 255, .28), transparent 70%), radial-gradient(55% 90% at 88% 85%, rgba(255, 59, 52, .3), transparent 70%), #0b0909;
}
.ri-aniv-dragon { display: block; width: 100%; max-width: 250px; height: auto; transition: transform .8s cubic-bezier(.16, 1, .3, 1); }
.ri-aniv-dragon--azul { justify-self: end; filter: drop-shadow(0 0 26px rgba(60, 155, 255, .5)); }
.ri-aniv-dragon--rojo { justify-self: start; filter: drop-shadow(0 0 26px rgba(255, 59, 52, .5)); }
.ri-aniv:hover .ri-aniv-dragon--azul { transform: translateX(14px); }
.ri-aniv:hover .ri-aniv-dragon--rojo { transform: translateX(-14px); }
.ri-aniv-texto { display: grid; justify-items: center; gap: .9rem; padding-bottom: 1.8rem; text-align: center; }
.ri-aniv-logo { width: min(300px, 80%); height: auto; filter: drop-shadow(0 0 18px rgba(255, 110, 20, .45)); }
.ri-aniv-p { max-width: 40ch; color: rgba(255, 255, 255, .8); line-height: 1.5; }

.ri-seccion { max-width: 1280px; margin: clamp(2.8rem, 6vw, 4.5rem) auto 0; padding: 0 clamp(1rem, 4vw, 3rem); }
.ri-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.3rem; }
.ri-h2 { margin: 0; font: 400 clamp(2rem, 3.4vw, 2.8rem)/1 var(--font-display); letter-spacing: .03em; text-transform: uppercase; color: #fff; }
.ri-ver { font: 700 .72rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .14em; text-transform: uppercase; color: var(--gx-red, #FF2A24); text-decoration: none; }
.ri-ver:hover { color: #fff; }

/* La cartelera en grande: el cartel completo, nunca cortado. */
.ri-carteles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.4rem 1.1rem; }
.ri-cartel { display: flex; flex-direction: column; background: #121014; border: 1px solid rgba(255, 255, 255, .08); transition: transform .35s cubic-bezier(.16, 1, .3, 1), border-color .25s, box-shadow .35s; }
.ri-cartel:hover { transform: translateY(-5px); border-color: rgba(255, 42, 36, .55); box-shadow: 0 24px 44px -20px rgba(0, 0, 0, .9); }
.ri-cartel-cara { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; isolation: isolate; background: #141012; }
.ri-cartel-cara::before { content: ""; position: absolute; inset: -30px; z-index: -1; background: var(--src) center / cover no-repeat; filter: blur(22px) brightness(.5) saturate(1.25); }
.ri-cartel-cara img { display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .8s cubic-bezier(.16, 1, .3, 1); }
.ri-cartel:hover .ri-cartel-cara img { transform: scale(1.04); }
.ri-cartel-fecha { position: absolute; left: .6rem; top: .6rem; display: grid; justify-items: center; min-width: 3.1rem; padding: .4rem .5rem .34rem; line-height: 1; background: var(--red-fill, #D91F26); color: #fff; }
.ri-cartel-fecha b { font: 400 1.8rem/1 var(--font-display); }
.ri-cartel-fecha i { font: 700 .58rem var(--font-data, 'Barlow', sans-serif); font-style: normal; letter-spacing: .14em; text-transform: uppercase; }
.ri-cartel-gratis { position: absolute; right: .6rem; top: .6rem; padding: .28rem .5rem; background: #F0EBE3; color: #111; font: 700 .6rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .12em; text-transform: uppercase; }
.ri-cartel-pie { flex: 1; display: grid; align-content: start; gap: .3rem; padding: .9rem .9rem 1rem; }
.ri-cartel-pie p { margin: 0; }
.ri-cartel-cuando { font: 700 .64rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .12em; text-transform: uppercase; color: var(--gx-red, #FF2A24); }
.ri-cartel-t { font: 400 1.6rem/1.02 var(--font-display); letter-spacing: .03em; text-transform: uppercase; color: #fff; }
.ri-cartel-precio { font: 700 .8rem var(--font-data, 'Barlow', sans-serif); color: #fff; }
.ri-cartel-botones { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .5rem; }
.ri-cartel-botones .ri-btn { padding: .55rem .8rem; font-size: .62rem; }

.ri-historia { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 2.4rem; align-items: start; }
.ri-historia p { max-width: 62ch; margin: 1rem 0 0; font-size: 1.02rem; line-height: 1.7; color: rgba(255, 255, 255, .78); }
.ri-redes { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.ri-redes a {
  display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.2rem; color: #fff; text-decoration: none;
  border: 1px solid rgba(255, 42, 36, .35); background: rgba(255, 42, 36, .04);
  transition: border-color .2s, background-color .2s, transform .25s cubic-bezier(.16, 1, .3, 1);
}
.ri-redes a:hover { border-color: var(--gx-red, #FF2A24); background: rgba(255, 42, 36, .1); transform: translateX(4px); }
.ri-redes svg { flex: none; width: 30px; height: 30px; fill: none; stroke: var(--gx-red, #FF2A24); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ri-redes span { display: grid; font-size: .9rem; color: rgba(255, 255, 255, .62); }
.ri-redes b { font: 400 1.4rem/1 var(--font-display); letter-spacing: .05em; color: #fff; }

.ri-marcas { text-align: center; }
.ri-logos { list-style: none; margin: 1.6rem 0 0; padding: 1.8rem; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.8rem; align-items: center; border: 1px solid rgba(255, 255, 255, .08); background: rgba(255, 255, 255, .02); }
.ri-logos img { display: block; max-width: 100%; max-height: 100px; margin: 0 auto; opacity: .85; transition: opacity .2s, transform .3s cubic-bezier(.16, 1, .3, 1); }
.ri-logos li:hover img { opacity: 1; transform: scale(1.06); }

.ri-llegar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 2rem; align-items: stretch; }
.ri-direccion { margin: 1rem 0 1.3rem; font-style: normal; font-size: 1.2rem; line-height: 1.55; color: #fff; }
.ri-mapa { display: block; width: 100%; min-height: 340px; border: 0; filter: grayscale(.4) contrast(1.05); background: #111; }

.ri-foro {
  max-width: 1280px; margin: clamp(2.8rem, 6vw, 4.5rem) auto 0; padding: 1.6rem clamp(1rem, 4vw, 3rem);
  display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 2rem; border-top: 1px solid rgba(255, 255, 255, .1);
}
.ri-foro-t { margin: 0; font: 400 1.6rem/1 var(--font-display); letter-spacing: .03em; text-transform: uppercase; color: #fff; }
.ri-foro p:not(.ri-foro-t) { flex: 1 1 320px; margin: 0; color: rgba(255, 255, 255, .62); }

@media (prefers-reduced-motion: no-preference) {
  .ri-hero::before { animation: ri-acerca 22s ease-in-out infinite alternate; }
}
@keyframes ri-acerca { from { transform: scale(1); } to { transform: scale(1.1) translateY(-2%); } }

@media (max-width: 860px) {
  .ri-hero-inner { grid-template-columns: minmax(0, 1fr); }
  .ri-logo { max-width: 230px; }
  .ri-cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ri-cifras li:nth-child(3) { border-left: 0; }
  .ri-cifras li:nth-child(n + 3) { border-top: 1px solid rgba(255, 255, 255, .1); }
  .ri-aniv { grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr) minmax(0, 1fr); padding-inline: .4rem; }
  .ri-historia, .ri-llegar { grid-template-columns: minmax(0, 1fr); }
  .ri-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 1.2rem; }
}
@media (max-width: 560px) {
  .ri-carteles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem .6rem; }
  .ri-cartel-t { font-size: 1.25rem; }
  .ri-cartel-pie { padding: .7rem .65rem .8rem; }
}

/* ---------------------------------------------------------------------------
   PLAYERAS RELACIONADAS (tools/playeras-relacionadas.js)
   Al final de cada ficha de concierto (a todo lo ancho) y de cada nota
   (dentro del texto). Tres diseños de la familia que le va al género.
   Los "reset" son por las notas: el estilo de prosa le pone viñetas, márgenes
   y subrayado a todo lo que hay dentro. */
.pr-tienda {
  position: relative; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 2fr); gap: 1.4rem 2rem; align-items: center;
  margin: 2.6rem 0 0; padding: 1.6rem; background: linear-gradient(120deg, rgba(217, 31, 38, .14), rgba(16, 16, 20, .9) 45%); border: 1px solid rgba(255, 59, 52, .28); border-left: 3px solid var(--neon-crimson, #FF3B34);
}
/* En la ficha va fuera de la rejilla, alineado con el texto de arriba y de abajo. */
.ev-main > .pr-tienda { box-sizing: border-box; width: min(1184px, 100% - 2 * clamp(1rem, 4vw, 3rem)); margin: 3rem auto 0; }
.pr-tienda-cab { display: grid; gap: .5rem; justify-items: start; }
.pr-tienda .pr-tienda-kicker { margin: 0; font: 800 .66rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .18em; text-transform: uppercase; color: var(--neon-crimson, #FF3B34); }
.pr-tienda .pr-tienda-t { margin: 0; padding: 0; border: 0; font: 400 clamp(1.7rem, 2.6vw, 2.3rem)/.95 var(--font-display); letter-spacing: .02em; text-transform: uppercase; color: #fff; }
.pr-tienda .pr-tienda-txt { margin: 0; font-size: .92rem; line-height: 1.55; color: rgba(240, 235, 227, .75); }
.pr-tienda .pr-tienda-txt b { color: #fff; }
.pr-tienda .pr-tienda-ver { display: inline-flex; align-items: center; margin-top: .3rem; padding: .7rem 1.1rem; background: var(--red-fill, #D91F26); color: #fff; text-decoration: none; font: 700 .7rem var(--font-data, 'Barlow', sans-serif); letter-spacing: .14em; text-transform: uppercase; transition: background-color .2s; }
.pr-tienda .pr-tienda-ver:hover { background: var(--red-fill-hover, #F0272F); }
.pr-tienda .pr-tienda-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.pr-tienda .pr-tienda-lista li { margin: 0; padding: 0; }
.pr-tienda .pr-tienda-lista li::before, .pr-tienda .pr-tienda-lista li::marker { content: none; display: none; }
.pr-tienda .pr-tienda-item { display: grid; gap: .3rem; color: #fff; text-decoration: none; transition: transform .35s cubic-bezier(.16, 1, .3, 1); }
.pr-tienda .pr-tienda-item:hover { transform: translateY(-4px); }
.pr-tienda .pr-tienda-foto { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: #141016; border: 1px solid rgba(255, 255, 255, .1); }
.pr-tienda .pr-tienda-foto img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; transition: transform .8s cubic-bezier(.16, 1, .3, 1); }
.pr-tienda .pr-tienda-item:hover img { transform: scale(1.05); }
.pr-tienda .pr-tienda-item b { font: 400 1.15rem/1 var(--font-display); letter-spacing: .02em; text-transform: uppercase; }
.pr-tienda .pr-tienda-item span:last-child { font: 700 .74rem var(--font-data, 'Barlow', sans-serif); color: rgba(240, 235, 227, .7); }
.pr-tienda .pr-tienda-item:focus-visible, .pr-tienda .pr-tienda-ver:focus-visible { outline: 2px solid var(--neon-crimson, #FF3B34); outline-offset: 3px; }
/* En la nota (columna angosta) el texto va arriba y las tres abajo. */
.nt-cuerpo .pr-tienda { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 760px) {
  .pr-tienda { grid-template-columns: minmax(0, 1fr); padding: 1.2rem; }
  .pr-tienda .pr-tienda-lista { gap: .5rem; }
  .pr-tienda .pr-tienda-item b { font-size: .95rem; }
}