/* ==========================================================================
   NoSoloSalsa · sistema visual del curso 2026/27
   Sacado de los carteles: papel crema, tinta negra, oro y brochazo.
   ========================================================================== */

:root {
  --papel:    #EFE7E1;
  --papel-2:  #F8F3EF;
  --tinta:    #141110;
  --tinta-2:  #3E362F;
  --tinta-3:  #5C5049;
  --oro:      #C89313;
  --oro-txt:  #8A6410;
  --linea:    #DCCFC4;
  --negro:    #0B0908;
  --negro-2:  #2A211B;
  --crema-os: #B6AAA1;
  --fuego:    #D95902;
  --neon:     #F5E663;

  /* color por nivel, el mismo del cuadrante de horarios */
  --n-bp1: #3B6519;  --n-bp2: #E1920F;  --n-bp3: #542699;
  --n-bsm: #D95902;  --n-bsa: #C51015;
  --n-sp1: #1A80CA;  --n-sp2: #0147A6;  --n-sme: #002484;
  --n-urb: #8A8A8A;  --n-tel: #A97D4E;  --n-est: #C867B0;

  --ancho: 1180px;
  --display: Anton, Impact, "Arial Narrow", sans-serif;
  --mano: "Kaushan Script", cursive;
  --texto: Archivo, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--texto);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, video { max-width: 100%; height: auto; display: block; }

a { color: var(--oro-txt); text-decoration: none; }
a:hover { color: var(--tinta); }
a:focus-visible, button:focus-visible { outline: 3px solid var(--oro); outline-offset: 3px; }

.contenedor { max-width: var(--ancho); margin: 0 auto; padding: 0 40px; }
.oculto-visual {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.oculto-visual:focus {
  position: fixed; left: 16px; top: 16px; z-index: 999;
  width: auto; height: auto; clip: auto; overflow: visible;
  background: var(--oro); color: var(--tinta); padding: 14px 22px; border-radius: 2px;
  font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 13px;
}

/* ---------- tipografía ---------- */
h1, h2, h3, .display {
  font-family: var(--display); font-weight: 400;
  text-transform: uppercase; letter-spacing: .01em;
  text-wrap: balance; margin: 0;
}
h1 { font-size: clamp(2.6rem, 5.4vw, 4rem); line-height: .94; }
h2 { font-size: clamp(1.9rem, 3.6vw, 2.5rem); line-height: 1.02; }
h3 { font-size: 1.3rem; line-height: 1.1; }

.antetitulo {
  font-size: 12px; font-weight: 700; letter-spacing: .24em;
  text-transform: uppercase; color: var(--oro-txt); margin: 0 0 14px;
}
.mano { font-family: var(--mano); color: var(--oro-txt); line-height: 1.25; }
.entradilla { font-size: 1.05rem; color: var(--tinta-3); max-width: 62ch; margin: 0 0 40px; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

/* el brochazo: un solo gesto por pantalla */
.brocha {
  display: inline-block; padding: 0 .16em;
  background: url(../brocha.png) center / 100% 84% no-repeat;
}

/* ---------- borde pintado entre secciones ---------- */
.seccion { position: relative; padding: 84px 0 92px; }
.seccion--papel  { background: var(--papel); }
.seccion--claro  { background: var(--papel-2); }
.seccion--negro  { background: var(--negro); color: #F1E9E3; }
.seccion--negro h2, .seccion--negro h3 { color: #F1E9E3; }
.seccion--negro .antetitulo { color: #F0A73C; }
.seccion--negro .entradilla { color: var(--crema-os); }

.borde {
  position: absolute; top: -46px; left: 0; width: 100%; height: 48px;
  display: block; pointer-events: none; z-index: 2;
  background-position: center; background-repeat: no-repeat; background-size: 100% 100%;
}
.borde--papel { background-image: url(../borde-crema.png); }
.borde--claro { background-image: url(../borde-claro.png); }
.borde--negro { background-image: url(../borde-negro.png); }
.borde--giro  { transform: scaleX(-1); }

/* ---------- botones ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-family: var(--texto); font-weight: 700; font-size: 13px;
  letter-spacing: .1em; text-transform: uppercase;
  padding: 17px 28px; border: 2px solid transparent; border-radius: 2px;
  cursor: pointer; transition: transform .18s ease, background .18s ease, color .18s ease;
}
.btn:hover { transform: translateY(-3px); }
.btn--tinta { background: var(--tinta); color: var(--papel); }
.btn--tinta:hover { color: var(--papel); }
.btn--oro   { background: var(--oro); color: var(--tinta); }
.btn--oro:hover { color: var(--tinta); }
.btn--linea { background: none; color: var(--tinta); border-color: var(--tinta); padding: 15px 26px; }
.btn--linea:hover { background: var(--tinta); color: var(--papel); }
.btn--claro { background: none; color: #F1E9E3; border-color: rgba(241, 233, 227, .55); padding: 15px 26px; }
.btn--claro:hover { background: #F1E9E3; color: var(--negro); }
.btn--fuego { background: var(--fuego); color: #fff; }
.btn--fuego:hover { color: #fff; }

.enlace-filete {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--tinta); border-bottom: 2px solid var(--oro); padding-bottom: 3px;
}
.enlace-filete:hover { color: var(--oro-txt); }

.botonera { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- barra en diagonal ---------- */
.barra-sitio { position: relative; z-index: 20; }
.barra {
  position: relative; z-index: 20; width: 100%;
  display: flex; align-items: stretch; background: var(--tinta); min-height: 92px;
  transition: min-height .3s ease;
}
.barra--fija {
  position: fixed; top: 0; left: 0; right: 0; min-height: 72px;
  box-shadow: 0 12px 30px -20px rgba(0, 0, 0, .9);
  animation: bajar .45s cubic-bezier(.2, .78, .25, 1) both;
}
.barra--fija .barra__marca img { height: 46px; }
.barra--fija .barra__marca { padding: 0 20px 0 32px; }
.barra__bloque { display: flex; align-items: stretch; flex: none; }
.barra__marca {
  background: var(--oro); display: flex; align-items: center;
  padding: 0 26px 0 40px; flex: none;
}
.barra__marca img { height: 58px; width: auto; transition: height .3s ease; }
.barra__corte { width: 58px; flex: none; display: block; margin-left: -1px; align-self: stretch; height: auto; }
.barra__dcha {
  flex: 1; display: flex; align-items: center; justify-content: flex-end;
  gap: 30px; padding: 0 40px 0 8px;
}
.menu { display: flex; align-items: center; gap: 28px; }
.menu a {
  font-family: var(--display); font-size: 17px; letter-spacing: .05em;
  text-transform: uppercase; color: var(--crema-os); padding-bottom: 2px;
  border-bottom: 4px solid transparent;
}
.menu a:hover { color: #F1E9E3; }
.menu a[aria-current="page"] { color: #F1E9E3; border-bottom-color: var(--oro); }
.barra__tel { white-space: nowrap; }
.barra__tel svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.hamburguesa { display: none; background: none; border: 0; padding: 0; width: 46px; height: 46px; }
.hamburguesa svg { width: 26px; height: 26px; margin: 0 auto; fill: none; stroke: #F1E9E3; stroke-width: 2; stroke-linecap: round; }

/* la barra se monta sola al cargar */
@keyframes bajar { from { transform: translateY(-100%); } to { transform: none; } }
@keyframes entra-marca { from { transform: translateX(-102%); } to { transform: none; } }
@keyframes entra-pieza { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.barra__bloque { animation: entra-marca .72s cubic-bezier(.2, .8, .25, 1) both; }
.menu a { animation: entra-pieza .5s both; }
.menu a { animation-delay: .30s; }
.menu a:nth-child(1) { animation-delay: 0.30s; }
.menu a:nth-child(2) { animation-delay: 0.36s; }
.menu a:nth-child(3) { animation-delay: 0.42s; }
.menu a:nth-child(4) { animation-delay: 0.48s; }
.menu a:nth-child(5) { animation-delay: 0.54s; }
.menu a:nth-child(6) { animation-delay: 0.60s; }
.menu a:nth-child(7) { animation-delay: 0.66s; }
.menu a:nth-child(8) { animation-delay: 0.72s; }
.menu a:nth-child(9) { animation-delay: 0.78s; }
.menu a:nth-child(10) { animation-delay: 0.84s; }
.menu a:nth-child(11) { animation-delay: 0.90s; }
.menu a:nth-child(12) { animation-delay: 0.96s; }
.barra__tel { animation: entra-pieza .5s .66s both; }
.barra--fija .barra__bloque, .barra--fija .menu a, .barra--fija .barra__tel { animation: none; }

/* el filete dorado del menú crece desde la izquierda */
.menu a { position: relative; border-bottom: 0; padding-bottom: 6px; }
.menu a::after {
  content: ; position: absolute; left: 0; bottom: 0; height: 4px; width: 100%;
  background: var(--oro); transform: scaleX(0); transform-origin: left;
  transition: transform .28s cubic-bezier(.2, .78, .25, 1);
}
.menu a:hover::after, .menu a[aria-current="page"]::after { transform: scaleX(1); }

/* ---------- héroe con vídeo: se ve entero, sin recortar ---------- */
.heroe { position: relative; background: var(--negro); }
.heroe video, .heroe img.heroe__fondo {
  display: block; width: 100%; height: auto;
}
.heroe__velo {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(11, 9, 8, .92) 0%, rgba(11, 9, 8, .35) 42%, rgba(11, 9, 8, .12) 100%);
}
.heroe__texto { position: absolute; left: 0; right: 0; bottom: 0; padding-bottom: 46px; }
.heroe__velo { pointer-events: none; }
.heroe .antetitulo { color: var(--oro); }
.heroe__claim {
  font-family: var(--mano); font-size: clamp(1.9rem, 4.4vw, 3rem); color: #F7EFE7;
  margin: 0 0 22px; line-height: 1.1; text-shadow: 0 2px 24px rgba(0, 0, 0, .6);
}

/* cabecera de las páginas interiores: foto grande, virada y con filo pintado */
.cabecera { position: relative; background: var(--negro); color: #F1E9E3; overflow: hidden; }
.cabecera picture { position: absolute; inset: 0; }
.cabecera img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .62; }
.cabecera::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(to top, rgba(11, 9, 8, .97) 4%, rgba(11, 9, 8, .55) 46%, rgba(11, 9, 8, .3) 100%),
    radial-gradient(ellipse at 14% 96%, rgba(200, 147, 19, .22), transparent 58%);
}
.cabecera__filo {
  position: absolute; left: 0; bottom: -1px; width: 100%; height: 46px; z-index: 3;
  background: url(../borde-crema.png) center / 100% 100% no-repeat;
}
.cabecera--claro .cabecera__filo { background-image: url(../borde-claro.png); }
.cabecera--negro .cabecera__filo { background-image: url(../borde-negro.png); }
/* si debajo viene el negro, el calor del congreso sube hasta la foto */
.cabecera--negro::after {
  background:
    linear-gradient(to top, rgba(11, 9, 8, .99) 2%, rgba(120, 44, 6, .55) 22%, rgba(11, 9, 8, .58) 48%, rgba(11, 9, 8, .3) 100%),
    radial-gradient(ellipse at 50% 108%, rgba(217, 89, 2, .55), transparent 62%);
}
.cabecera__int { position: relative; z-index: 2; padding: clamp(96px, 12vw, 152px) 0 clamp(84px, 10vw, 124px); }
.cabecera h1 { color: #F7EFE7; font-size: clamp(2.9rem, 6.6vw, 5.2rem); text-shadow: 0 4px 30px rgba(0, 0, 0, .55); }
.cabecera .antetitulo { color: var(--oro); }
.cabecera p { color: #D9CEC5; max-width: 58ch; margin: 20px 0 0; font-size: 1.08rem; }

/* ---------- ticker ---------- */
.ticker { position: relative; background: var(--oro); overflow: hidden; padding: 15px 0; }
.ticker__tira {
  display: flex; width: max-content; align-items: center;
  will-change: transform; backface-visibility: hidden;
  animation: desfile 34s linear infinite;
}
.ticker__tira:hover { animation-play-state: paused; }
.ticker span {
  font-family: var(--display); font-size: 22px; letter-spacing: .04em;
  text-transform: uppercase; color: var(--tinta); white-space: nowrap;
}
.ticker .sep { opacity: .45; }
.ticker .txt { padding: 0 26px; }

/* ---------- carrusel de niveles ---------- */
.carrusel { position: relative; background: var(--negro); }
.carrusel__pista {
  display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; -ms-overflow-style: none;
}
.carrusel__pista::-webkit-scrollbar { display: none; }
.nivel {
  position: relative; flex: none; width: 232px; height: 412px;
  display: block; overflow: hidden; scroll-snap-align: start;
}
.nivel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .75, .3, 1); }
.nivel:hover img { transform: scale(1.07); }
.nivel__velo {
  position: absolute; left: 0; right: 0; top: 0; height: 132px;
  background: linear-gradient(to bottom, rgba(11, 9, 8, .88) 0%, rgba(11, 9, 8, .45) 55%, rgba(11, 9, 8, 0) 100%);
}
.nivel__txt { position: absolute; left: 0; right: 0; top: 0; padding: 15px 16px; }
.nivel__estilo { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 4px; }
.nivel__nombre { display: block; font-family: var(--display); font-size: 21px; line-height: 1; text-transform: uppercase; color: #F7EFE7; }
.nivel__barra { position: absolute; left: 0; right: 0; bottom: 0; height: 6px; transition: height .3s ease; }
.nivel:hover .nivel__barra { height: 13px; }

.carrusel__flecha {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 46px; height: 46px; border-radius: 50%; border: 0;
  display: grid; place-items: center; cursor: pointer; z-index: 3;
}
.carrusel__flecha svg { width: 20px; height: 20px; fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.carrusel__flecha--izq { left: 18px; background: rgba(11, 9, 8, .72); border: 1px solid rgba(247, 239, 231, .35); }
.carrusel__flecha--izq svg { stroke: #F7EFE7; }
.carrusel__flecha--der { right: 18px; background: var(--oro); animation: latir 3.2s ease-in-out infinite; }
.carrusel__flecha--der svg { stroke: var(--tinta); }

/* ---------- rejillas ---------- */
.rejilla { display: grid; gap: 22px; }
.rejilla--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rejilla--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
/* la fila de carteles se reparte sola y se centra, haya los que haya */
.rejilla--carteles { grid-template-columns: repeat(auto-fit, minmax(150px, 240px)); justify-content: center; gap: 16px; }
@media (max-width: 620px) { .rejilla--carteles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
.dos-columnas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.dos-columnas--ancha-izq { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: end; }

.cabeza-seccion { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; margin-bottom: 38px; }

/* ---------- cifras ---------- */
.cifras { display: flex; flex-direction: column; gap: 18px; }
.cifra { border-top: 1px solid var(--linea); padding-top: 14px; }
.cifra:first-child { border-top: 3px solid var(--tinta); }
.cifra b { display: block; font-family: var(--display); font-size: 42px; line-height: 1; font-weight: 400; }
.cifra span { font-size: 14px; color: var(--tinta-3); }

/* ---------- carteles y fotos ---------- */
.cartel { display: block; overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }
.cartel img { transition: transform .6s cubic-bezier(.2, .75, .3, 1); width: 100%; height: auto; }
.cartel:hover { transform: translateY(-7px); box-shadow: 0 14px 32px -16px rgba(20, 17, 16, .55); }
.cartel:hover img { transform: scale(1.05); }
/* el cartel de la propia pagina de estilo no lleva a ningun sitio: ni margen de figure ni gesto de enlace */
figure.cartel { margin: 0; }
figure.cartel:hover { transform: none; box-shadow: none; }
figure.cartel:hover img { transform: none; }
.foto { display: block; overflow: hidden; }
.foto img { transition: transform .8s cubic-bezier(.2, .75, .3, 1); width: 100%; height: auto; }
.foto:hover img { transform: scale(1.05); }

/* ---------- opiniones ---------- */
.cita { margin: 0; border-top: 2px solid var(--tinta); padding-top: 22px; display: flex; flex-direction: column; gap: 16px; }
.cita blockquote { margin: 0; font-size: 15.5px; line-height: 1.65; color: var(--tinta-2); }
.cita figcaption { font-family: var(--mano); font-size: 21px; color: var(--oro-txt); margin-top: auto; }
.estrellas { display: flex; gap: 3px; }
.estrellas svg { width: 17px; height: 17px; fill: var(--oro); }

/* ---------- listas y preguntas ---------- */
.lista-filas { display: flex; flex-direction: column; }
.fila {
  display: flex; align-items: baseline; justify-content: space-between; gap: 20px;
  padding: 13px 8px; border-bottom: 1px solid var(--linea);
  transition: background .2s ease, padding-left .2s ease;
}
.fila:last-child { border-bottom: 0; }
.fila:hover { background: var(--papel-2); padding-left: 16px; }
.fila b { font-family: var(--mano); font-size: 24px; color: var(--tinta); font-weight: 400; }
.fila span { font-size: 13px; color: var(--tinta-3); text-align: right; }

.preguntas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 34px; }
.pregunta h3 { font-size: 19px; margin-bottom: 8px; }
.pregunta p { font-size: 15px; line-height: 1.6; color: var(--tinta-2); margin: 0; }

/* ---------- contacto ---------- */
.dato { display: flex; align-items: flex-start; gap: 16px; }
.dato__icono { width: 30px; flex: none; padding-top: 2px; }
.dato__icono svg { width: 26px; height: 26px; fill: none; stroke: var(--oro); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.dato dt { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); margin-bottom: 3px; }
.dato dd { margin: 0; font-size: 16px; color: var(--tinta); line-height: 1.5; }
.datos { display: flex; flex-direction: column; gap: 18px; margin: 0; }

/* ---------- congreso ---------- */
.brasa {
  position: absolute; left: 50%; top: -140px; width: min(1100px, 96%); height: 620px;
  transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(217, 89, 2, .4) 0%, rgba(217, 89, 2, 0) 68%);
  animation: arder 5.5s ease-in-out infinite;
}
.fuego-fecha { font-family: var(--display); font-size: 25px; color: var(--neon); text-shadow: 0 0 16px rgba(245, 230, 99, .5); margin: 0 0 12px; letter-spacing: .04em; }
.fuego-titulo { font-size: clamp(2.4rem, 4.6vw, 3.4rem); color: #F7DFAE; text-shadow: 0 0 24px rgba(217, 89, 2, .55); line-height: .94; }
.fuego-cifras { display: flex; gap: 28px; flex-wrap: wrap; margin: 26px 0 30px; }
.fuego-cifras div b { display: block; font-family: var(--display); font-size: 30px; font-weight: 400; color: #F1E9E3; }
.fuego-cifras div span { font-size: 13px; color: var(--crema-os); }
.fuego-cifras .raya { width: 1px; background: var(--negro-2); }
.desfile-artistas { position: relative; margin-top: 54px; padding: 22px 0; border-top: 1px solid var(--negro-2); overflow: hidden; }
.desfile-artistas .tira {
  display: flex; width: max-content; gap: 0;
  will-change: transform; backface-visibility: hidden;
  animation: desfile 48s linear infinite;
}
.desfile-artistas .tira:hover { animation-play-state: paused; }
.desfile-artistas .tira > span { display: flex; gap: 14px; padding-right: 14px; }
.desfile-artistas img { height: 132px; width: auto; }

/* ---------- pie ---------- */
.pie { position: relative; background: var(--negro); color: var(--crema-os); padding: 64px 0 58px; font-size: 14px; }
.pie__int { display: flex; align-items: flex-start; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.pie img { height: 54px; width: auto; }
.pie__cols { display: flex; gap: 56px; flex-wrap: wrap; line-height: 1.9; }
.pie__cols > div { display: flex; flex-direction: column; }
.pie h4 { font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #8C7F76; margin: 0 0 8px; }
.pie a, .pie span { color: var(--crema-os); }
.pie a:hover { color: var(--oro); }
.pie__legal { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--negro-2); display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; font-size: 13px; }

/* ---------- animaciones ---------- */
@keyframes subir  { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }
@keyframes desfile { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes latir  { 0%, 100% { transform: translateY(-50%) scale(1); } 50% { transform: translateY(-50%) scale(1.09); } }
@keyframes arder  { 0%, 100% { opacity: .45; } 50% { opacity: .95; } }
@keyframes pintar { from { background-size: 0% 84%; } to { background-size: 100% 84%; } }

/* aparecen al llegar con el scroll: nss.js pone .visible */
.an { opacity: 0; }
.an.visible { animation: subir .85s cubic-bezier(.2, .75, .3, 1) both; }
.an.visible .brocha, .brocha.visible { animation: pintar .9s .35s cubic-bezier(.2, .75, .3, 1) both; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .an { opacity: 1; }
  .brocha { background-size: 100% 84%; }
}

/* ---------- pantallas medianas ---------- */
@media (max-width: 1000px) {
  .contenedor { padding: 0 28px; }
  .seccion { padding: 64px 0 70px; }
  .dos-columnas, .dos-columnas--ancha-izq { grid-template-columns: 1fr; gap: 34px; align-items: start; }
  .rejilla--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rejilla--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .preguntas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cifras { flex-direction: row; gap: 24px; }
  .cifra { flex: 1; }
}

/* ---------- móvil ---------- */
@media (max-width: 700px) {
  body { font-size: 16px; }
  .contenedor { padding: 0 20px; }
  .seccion { padding: 52px 0 58px; }
  .borde { top: -26px; height: 28px; }

  .barra { min-height: 74px; }
  .barra__marca { padding: 0 14px 0 20px; }
  .barra__marca img { height: 44px; }
  .barra__corte { width: 42px; }
  .barra__dcha { padding: 0 14px 0 4px; }
  .menu, .barra__tel { display: none; }
  .hamburguesa { display: block; }
  .barra--abierta .menu {
    display: flex; position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--tinta); padding: 8px 20px 20px; z-index: 30;
  }
  .barra--abierta .menu a { padding: 14px 0; border-bottom: 1px solid var(--negro-2); }

  .heroe__velo { display: none; }
  .heroe__texto { position: static; background: var(--negro); padding: 26px 0 34px; }
  .heroe__claim { text-shadow: none; }
  .botonera .btn { width: 100%; }

  .nivel { width: 168px; height: 298px; }
  .nivel__nombre { font-size: 16px; }
  .carrusel__flecha--izq { display: none; }

  .ticker span { font-size: 17px; }
  .ticker .txt { padding: 0 18px; }

  .rejilla--2, .rejilla--3 { grid-template-columns: 1fr; }
  .rejilla--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .preguntas { grid-template-columns: 1fr; gap: 22px; }
  .cifras { gap: 16px; }
  .cifra b { font-size: 30px; }
  .cifra span { font-size: 12.5px; }
  .cabeza-seccion { margin-bottom: 26px; }
  .pie__cols { gap: 32px; }
  .desfile-artistas img { height: 104px; }
}

/* ---------- escalera de niveles (páginas de estilo) ---------- */
.escalera { display: flex; flex-direction: column; }
.peldano {
  display: grid; grid-template-columns: 6px minmax(0, 1fr) 210px;
  gap: 0 26px; padding: 26px 0; border-top: 1px solid var(--linea);
}
.peldano:first-child { border-top: 2px solid var(--tinta); }
.peldano__color { border-radius: 3px; }
.peldano h3 { font-size: 1.45rem; margin-bottom: 8px; }
.peldano p { font-size: 15.5px; color: var(--tinta-2); margin: 0; max-width: 56ch; }
.peldano__quien { font-family: var(--mano); font-size: 21px; color: var(--oro-txt); display: block; margin-bottom: 6px; }
.peldano__horas { font-size: 14px; color: var(--tinta-3); line-height: 1.7; }
.peldano__horas b { font-weight: 700; color: var(--tinta-2); font-variant-numeric: tabular-nums; }

/* ---------- galería ---------- */
.galeria { columns: 3; column-gap: 16px; }
.galeria a { display: block; margin-bottom: 16px; break-inside: avoid; overflow: hidden; }
.galeria img { width: 100%; height: auto; transition: transform .7s cubic-bezier(.2, .75, .3, 1); }
.galeria a:hover img { transform: scale(1.05); }

/* ---------- listado de eventos ---------- */
.evento { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 32px; padding: 30px 0; border-top: 1px solid var(--linea); align-items: start; }
.evento:first-of-type { border-top: 2px solid var(--tinta); }
.evento__fecha { font-family: var(--display); font-size: 1.5rem; line-height: 1.1; }
.evento__fecha span { display: block; font-family: var(--texto); font-size: 13px; font-weight: 700; letter-spacing: .12em; color: var(--tinta-3); text-transform: uppercase; margin-top: 4px; }
.evento h3 { margin-bottom: 8px; }
.evento p { font-size: 15.5px; color: var(--tinta-2); margin: 0; max-width: 62ch; }

/* ---------- formulario ---------- */
.formulario { display: grid; gap: 18px; max-width: 520px; }
.campo { display: flex; flex-direction: column; gap: 7px; }
.campo label { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); }
.campo input, .campo textarea, .campo select {
  font-family: var(--texto); font-size: 16px; color: var(--tinta);
  background: transparent; border: 0; border-bottom: 2px solid var(--linea);
  padding: 10px 2px; transition: border-color .2s ease;
}
.campo input:focus, .campo textarea:focus, .campo select:focus { outline: 0; border-bottom-color: var(--oro); }
.campo textarea { resize: vertical; min-height: 110px; }

/* ---------- texto legal ---------- */
.legal { max-width: 74ch; }
.legal h2 { font-size: 1.5rem; margin: 40px 0 14px; }
.legal h2:first-child { margin-top: 0; }
.legal p, .legal li { color: var(--tinta-2); font-size: 16px; }
.legal ul { padding-left: 20px; }

@media (max-width: 1000px) {
  .galeria { columns: 2; }
  .peldano { grid-template-columns: 6px minmax(0, 1fr); }
  .peldano > div { grid-column: 2; }
  .peldano__horas { margin-top: 10px; }
}
@media (max-width: 700px) {
  .galeria { columns: 1; }
  .evento { grid-template-columns: 1fr; gap: 12px; }
}

/* ---------- tarjetas grandes de estilo (página de clases) ---------- */
.rejilla--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* cinco estilos ya no caben en cuatro columnas: se reparten y se centran */
.rejilla--estilos { grid-template-columns: repeat(auto-fit, minmax(210px, 300px)); justify-content: center; }
.rejilla--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.estilo-carta { position: relative; display: block; overflow: hidden; aspect-ratio: 58 / 100; }
.estilo-carta img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .75, .3, 1); }
.estilo-carta:hover img { transform: scale(1.06); }
.estilo-carta__velo { position: absolute; inset: 0; background: linear-gradient(to top, rgba(11, 9, 8, .92) 12%, rgba(11, 9, 8, .25) 62%, rgba(11, 9, 8, 0) 100%); }
.estilo-carta__txt { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 20px 26px; }
.estilo-carta__txt b { display: block; font-family: var(--display); font-weight: 400; font-size: 1.5rem; text-transform: uppercase; color: #F7EFE7; line-height: 1; margin-bottom: 8px; }
.estilo-carta__txt span { display: block; font-size: 13.5px; color: #DCD1C7; line-height: 1.5; }
.estilo-carta__barra { position: absolute; left: 0; right: 0; bottom: 0; height: 6px; transition: height .3s ease; }
.estilo-carta:hover .estilo-carta__barra { height: 13px; }

/* ---------- rejilla de artistas del congreso ---------- */
.artista figcaption { font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: 15px; color: #F1E9E3; margin-top: 12px; letter-spacing: .03em; }
.artista img { transition: transform .6s cubic-bezier(.2, .75, .3, 1); }
.artista:hover img { transform: scale(1.04); }

@media (max-width: 1000px) {
  .rejilla--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rejilla--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .rejilla--4 { grid-template-columns: 1fr; }
  .rejilla--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

/* ---------- temporada de eventos, mes a mes ---------- */
.temporada { display: flex; flex-direction: column; }
.mes { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 40px; padding: 34px 0; border-top: 1px solid var(--linea); }
.mes:first-child { border-top: 2px solid var(--tinta); }
.mes__nombre { font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: 1.9rem; line-height: 1; color: var(--tinta); margin: 0; }
.mes__nombre small { display: block; font-family: var(--texto); font-size: 12px; font-weight: 700; letter-spacing: .16em; color: var(--tinta-3); margin-top: 6px; }
.mes__lista { display: flex; flex-direction: column; gap: 26px; }

.cita-evento { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 26px; align-items: start; }
.cita-evento--sin-foto { grid-template-columns: minmax(0, 1fr); }
.cita-evento__foto { display: block; overflow: hidden; aspect-ratio: 3 / 2; }
.cita-evento__foto--cartel { aspect-ratio: 3 / 4; }
.cita-evento__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .75, .3, 1); }
.cita-evento:hover .cita-evento__foto img { transform: scale(1.06); }
.cita-evento h3 { font-size: 1.35rem; margin-bottom: 8px; }
.cita-evento__dia { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--oro-txt); margin: 0 0 6px; }
.cita-evento p { font-size: 15.5px; color: var(--tinta-2); margin: 0; max-width: 58ch; }
.cita-evento__precio { display: inline-block; font-family: var(--display); font-weight: 400; font-size: 1.15rem; color: var(--tinta); margin-top: 12px; border-bottom: 3px solid var(--oro); padding-bottom: 2px; }
.cita-evento--pendiente h3, .cita-evento--pendiente .cita-evento__dia { color: var(--tinta-3); }
.por-confirmar { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); border-bottom: 2px dotted var(--linea); padding-bottom: 2px; display: inline-block; margin-top: 10px; }

@media (max-width: 1000px) {
  .mes { grid-template-columns: 1fr; gap: 20px; }
  .mes__nombre small { display: inline; margin-left: 12px; }
}
@media (max-width: 700px) {
  .cita-evento { grid-template-columns: 1fr; gap: 14px; }
  .cita-evento__foto { aspect-ratio: 16 / 9; }
}

/* ==========================================================================
   El congreso · diseño propio
   El único sitio de la web donde manda el negro, el fuego y el neón.
   ========================================================================== */
.congreso { background: #080605; color: #F1E9E3; }
.congreso h1, .congreso h2, .congreso h3 { color: #F7EFE7; }
.congreso p { color: var(--crema-os); }
.congreso .antetitulo { color: #F0A73C; }

/* héroe: el cartel a un lado y el titular en neón al otro */
.cg-heroe { position: relative; overflow: hidden; padding: 70px 0 84px; }
.cg-heroe::before {
  content: ""; position: absolute; left: 50%; top: -120px; width: min(1100px, 120%); height: 620px;
  transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(217, 89, 2, .45) 0%, rgba(217, 89, 2, .10) 45%, rgba(217, 89, 2, 0) 70%);
  animation: arder 6s ease-in-out infinite;
}
.cg-heroe::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background:
    repeating-linear-gradient(90deg, rgba(255, 138, 30, .07) 0 2px, transparent 2px 5px),
    radial-gradient(circle at 12% 22%, rgba(245, 230, 99, .13), transparent 26%),
    radial-gradient(circle at 88% 34%, rgba(217, 89, 2, .16), transparent 28%);
}
.cg-heroe__int { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 56px; align-items: center; }
.cg-cartel { position: relative; }
.cg-cartel img { width: 100%; box-shadow: 0 30px 70px -30px rgba(217, 89, 2, .8), 0 0 0 1px rgba(247, 223, 174, .18); }
.cg-cartel::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(217, 89, 2, .7), transparent 72%);
  filter: blur(26px); animation: arder 5s ease-in-out infinite;
}

.cg-fecha {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--display); font-size: clamp(1.4rem, 2.6vw, 2.1rem); letter-spacing: .06em;
  color: var(--neon); text-shadow: 0 0 10px rgba(245, 230, 99, .75), 0 0 34px rgba(245, 230, 99, .35);
  margin: 0 0 18px;
}
.cg-fecha b { font-weight: 400; }
.cg-fecha i { width: 8px; height: 8px; background: var(--neon); border-radius: 50%; box-shadow: 0 0 12px var(--neon); }
.cg-titulo {
  font-family: var(--display); font-weight: 400; text-transform: uppercase;
  font-size: clamp(3rem, 7.4vw, 6.2rem); line-height: .86; margin: 0;
  color: #FFF3DC;
  text-shadow: 0 0 6px rgba(255, 243, 220, .5), 0 0 30px rgba(217, 89, 2, .85), 0 6px 0 rgba(0, 0, 0, .55);
}
.cg-titulo em { display: block; font-style: normal; font-size: .42em; letter-spacing: .18em; color: var(--fuego); text-shadow: 0 0 22px rgba(217, 89, 2, .9); margin-top: 14px; }
.cg-sede { font-family: var(--mano); font-size: 1.6rem; color: #F7DFAE; margin: 22px 0 0; }

/* cifras grandes del pase */
.cg-precios { display: flex; gap: 0; flex-wrap: wrap; margin: 34px 0 32px; }
.cg-precio { padding: 0 30px; border-left: 1px solid rgba(247, 223, 174, .22); }
.cg-precio:first-child { padding-left: 0; border-left: 0; }
.cg-precio b { display: block; font-family: var(--display); font-weight: 400; font-size: 2.6rem; line-height: 1; color: #FFF3DC; }
.cg-precio span { display: block; font-size: 13px; color: var(--crema-os); margin-top: 6px; max-width: 20ch; }

/* desfile de nombres en neón */
.cg-nombres { border-top: 1px solid rgba(247, 223, 174, .16); border-bottom: 1px solid rgba(247, 223, 174, .16); padding: 18px 0; overflow: hidden; background: rgba(217, 89, 2, .07); }
.cg-nombres .tira { display: flex; width: max-content; will-change: transform; backface-visibility: hidden; animation: desfile 44s linear infinite; }
.cg-nombres .tira:hover { animation-play-state: paused; }
.cg-nombres span { font-family: var(--display); font-size: 1.5rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; color: #F7DFAE; }
.cg-nombres .n { padding: 0 26px; }
.cg-nombres .s { color: var(--fuego); }

/* rejilla de artistas */
.cg-artistas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.cg-artista { position: relative; display: block; overflow: hidden; }
.cg-artista img { width: 100%; transition: transform .7s cubic-bezier(.2, .75, .3, 1), filter .5s ease; filter: saturate(.85); }
.cg-artista:hover img { transform: scale(1.05); filter: saturate(1.15); }
.cg-artista figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 14px;
  background: linear-gradient(to top, rgba(8, 6, 5, .95), rgba(8, 6, 5, 0));
  font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: 14px;
  letter-spacing: .04em; color: #FFF3DC;
}

/* lo que incluye */
.cg-incluye { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; }
.cg-incluye > div { border-top: 2px solid var(--fuego); padding-top: 20px; }
.cg-incluye h3 { font-size: 1.2rem; margin-bottom: 10px; }
.cg-incluye p { font-size: 15px; margin: 0; }

/* tabla de pases sin cajas */
.cg-pases { display: flex; flex-direction: column; }
.cg-pase { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: baseline; padding: 22px 0; border-top: 1px solid rgba(247, 223, 174, .16); }
.cg-pase:first-child { border-top: 2px solid #F7DFAE; }
.cg-pase h3 { font-size: 1.25rem; margin-bottom: 6px; }
.cg-pase p { font-size: 14.5px; margin: 0; max-width: 52ch; }
.cg-pase b { font-family: var(--display); font-weight: 400; font-size: 2rem; color: var(--neon); text-shadow: 0 0 16px rgba(245, 230, 99, .4); white-space: nowrap; }

.cg-nota { font-size: 13px; color: #9C8E85; margin-top: 26px; max-width: 70ch; }

@media (max-width: 1000px) {
  .cg-heroe__int { grid-template-columns: 1fr; gap: 36px; }
  .cg-cartel { max-width: 340px; }
  .cg-artistas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cg-incluye { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 700px) {
  .cg-heroe { padding: 44px 0 56px; }
  .cg-artistas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .cg-precios { gap: 20px 0; }
  .cg-precio { padding: 0 18px 0 0; border-left: 0; }
  .cg-precio b { font-size: 2rem; }
  .cg-nombres span { font-size: 1.15rem; }
  .cg-pase { grid-template-columns: 1fr; gap: 8px; }
}

/* ---------- cajas doradas: lo práctico, bien remarcado ---------- */
.destacados { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.dorada {
  position: relative; overflow: hidden; border-radius: 2px;
  background: linear-gradient(160deg, #E0AE2C 0%, var(--oro) 42%, #A87A0C 100%);
  color: var(--tinta);
  padding: 26px 24px 28px; display: flex; flex-direction: column; gap: 12px;
  transition: transform .25s ease, box-shadow .25s ease;
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 222, .55),
    inset 0 -1px 0 rgba(20, 17, 16, .28),
    inset 0 -40px 46px -34px rgba(20, 17, 16, .55),
    inset 0 44px 40px -40px rgba(255, 246, 222, .35),
    0 2px 0 rgba(20, 17, 16, .12);
}
/* el brillo que cruza el metal */
.dorada::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(112deg, transparent 34%, rgba(255, 250, 235, .3) 46%, transparent 56%);
  opacity: .8; transition: transform .6s cubic-bezier(.2, .75, .3, 1);
}
.dorada > * { position: relative; z-index: 1; }
a.dorada:hover {
  transform: translateY(-5px); color: var(--tinta);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 222, .7),
    inset 0 -1px 0 rgba(20, 17, 16, .3),
    inset 0 -46px 50px -34px rgba(20, 17, 16, .48),
    inset 0 48px 44px -40px rgba(255, 246, 222, .45),
    0 20px 36px -18px rgba(20, 17, 16, .55);
}
a.dorada:hover::after { transform: translateX(38%); }
.dorada__icono { width: 30px; height: 30px; flex: none; }
.dorada__icono svg { width: 30px; height: 30px; fill: none; stroke: var(--tinta); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dorada dt, .dorada__rotulo {
  font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(20, 17, 16, .62); margin: 0;
}
.dorada dd, .dorada__valor { overflow-wrap: anywhere;
  margin: 0; font-family: var(--display); font-weight: 400; text-transform: uppercase;
  font-size: 1.35rem; line-height: 1.1; color: var(--tinta); letter-spacing: .01em;
}
.dorada__pie { font-size: 13.5px; color: rgba(20, 17, 16, .72); margin: auto 0 0; line-height: 1.5; }
.dorada--tinta {
  background: linear-gradient(160deg, #24201D 0%, var(--tinta) 46%, #050403 100%);
  color: var(--papel);
  box-shadow:
    inset 0 1px 0 rgba(247, 239, 231, .16),
    inset 0 -1px 0 rgba(0, 0, 0, .6),
    inset 0 -40px 46px -34px rgba(0, 0, 0, .7),
    inset 0 0 0 1px rgba(200, 147, 19, .22),
    0 2px 0 rgba(20, 17, 16, .3);
}
.dorada--tinta::after { background: linear-gradient(112deg, transparent 34%, rgba(200, 147, 19, .16) 46%, transparent 56%); }
a.dorada--tinta:hover {
  box-shadow:
    inset 0 1px 0 rgba(247, 239, 231, .22),
    inset 0 -1px 0 rgba(0, 0, 0, .6),
    inset 0 -46px 50px -34px rgba(0, 0, 0, .62),
    inset 0 0 0 1px rgba(200, 147, 19, .4),
    0 20px 36px -18px rgba(0, 0, 0, .7);
}
.dorada--tinta .dorada__icono svg { stroke: var(--oro); }
.dorada--tinta dt, .dorada--tinta .dorada__rotulo { color: rgba(239, 231, 225, .58); }
.dorada--tinta dd, .dorada--tinta .dorada__valor { color: var(--papel); }
.dorada--tinta .dorada__pie { color: rgba(239, 231, 225, .72); }
a.dorada--tinta:hover { color: var(--papel); }

/* la cifra suelta, en grande */
.cifra-sola { display: flex; align-items: baseline; gap: 20px; }
.cifra-sola b { font-family: var(--display); font-weight: 400; font-size: clamp(4.5rem, 11vw, 8rem); line-height: .85; color: var(--tinta); }
.cifra-sola span { font-size: 1.05rem; color: var(--tinta-3); max-width: 14ch; line-height: 1.4; }

@media (max-width: 1000px) { .destacados { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .destacados { grid-template-columns: 1fr; gap: 12px; } .cifra-sola b { font-size: 4.5rem; } }

/* el congreso destaca en el menú */
.menu a.menu__fuego { color: #F0A73C; }
.menu a.menu__fuego:hover, .menu a.menu__fuego[aria-current="page"] { color: #FFD08A; }
.menu a.menu__fuego::after { background: var(--fuego); }

/* ---------- carteles del curso: el ancho se ajusta a cuántos hay ---------- */
.carteles-curso { display: grid; gap: 20px; justify-content: center; }
.carteles-curso--1 { grid-template-columns: minmax(0, 400px); }
.carteles-curso--2 { grid-template-columns: repeat(2, minmax(0, 340px)); }
.carteles-curso--3 { grid-template-columns: repeat(3, minmax(0, 320px)); }
.carteles-curso--4 { grid-template-columns: repeat(4, minmax(0, 280px)); }
@media (max-width: 900px) {
  .carteles-curso--3, .carteles-curso--4 { grid-template-columns: repeat(2, minmax(0, 300px)); }
}
@media (max-width: 620px) {
  .carteles-curso { grid-template-columns: minmax(0, 320px) !important; }
}

/* ---------- cuadrante semanal: una columna por dia, con los colores del cartel ---------- */
#horario { scroll-margin-top: 116px; }   /* que la barra de arriba no tape los dias */
.cuadrante { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; margin-top: 34px; align-items: start; }
.cuadrante__dia { display: flex; flex-direction: column; gap: 10px; }
.cuadrante__dia h3 { margin: 0 0 2px; font-size: 13px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--oro-txt); text-align: center; padding-bottom: 8px; border-bottom: 2px solid rgba(20, 17, 16, .14); }
.clase { display: flex; flex-direction: column; gap: 3px; padding: 11px 12px 12px; text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease; }
.clase:hover { transform: translateY(-3px); box-shadow: 0 10px 22px -12px rgba(20, 17, 16, .6); }
.clase__hora { font-size: 12.5px; font-weight: 700; letter-spacing: .03em; font-variant-numeric: tabular-nums; opacity: .9; }
.clase b { font-size: 14px; line-height: 1.28; }
.clase__quien { font-size: 12.5px; line-height: 1.3; }
@media (max-width: 1080px) { .cuadrante { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 14px; } }
@media (max-width: 620px)  { .cuadrante { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 10px; } }
@media (max-width: 400px)  { .cuadrante { grid-template-columns: minmax(0, 1fr); } }
.enlace-oro { color: var(--oro-txt); text-decoration: underline; text-underline-offset: 3px; }
.enlace-oro:hover { color: var(--tinta); }

/* ---------- tarifas ---------- */
#tarifas { scroll-margin-top: 116px; }
.visualmente-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tabla-tarifas { margin-top: 30px; overflow-x: auto; }
.tabla-tarifas table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.tabla-tarifas th, .tabla-tarifas td { text-align: left; padding: 13px 14px; }
.tabla-tarifas thead th { font-family: var(--tipo-titulo, inherit); font-size: 12px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--oro-txt); border-bottom: 2px solid var(--tinta); padding-bottom: 10px; }
.tabla-tarifas tbody tr { border-bottom: 1px solid rgba(20, 17, 16, .12); }
.tabla-tarifas tbody th { font-weight: 700; color: var(--tinta); font-size: 15px; white-space: nowrap; }
.tabla-tarifas tbody td { color: var(--tinta-2); font-size: 15px; }
.tabla-tarifas tbody td:nth-last-child(-n+3) { font-weight: 700; color: var(--tinta); }
.tarifa__punto { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 9px; vertical-align: .06em; }
.tarifa__plana th, .tarifa__plana td { background: rgba(200, 147, 19, .16); }
.tarifa__plana th { color: var(--oro-txt); }
.condiciones { margin: 0; padding: 0; list-style: none; display: grid; gap: 11px; max-width: 78ch; }
.condiciones li { position: relative; padding-left: 20px; font-size: 14.5px; line-height: 1.6; color: var(--tinta-2); }
.condiciones li::before { content: ""; position: absolute; left: 0; top: .62em; width: 7px; height: 2px; background: var(--oro); }

/* en movil la tabla no cabe: cada fila pasa a ser una ficha */
@media (max-width: 720px) {
  .tarifas-abajo { grid-template-columns: minmax(0, 1fr) !important; gap: 34px !important; }
  .tabla-tarifas { overflow-x: visible; }
  .tabla-tarifas thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .tabla-tarifas table, .tabla-tarifas tbody, .tabla-tarifas tr, .tabla-tarifas th, .tabla-tarifas td { display: block; width: auto; }
  .tabla-tarifas tbody tr { border: 0; border-top: 2px solid var(--tinta); padding: 14px 0 4px; }
  .tabla-tarifas tbody th { padding: 0 0 8px; font-size: 16px; white-space: normal; }
  .tabla-tarifas tbody td { padding: 4px 0; display: flex; justify-content: space-between; gap: 18px; }
  .tabla-tarifas tbody td::before { content: attr(data-r); color: var(--tinta-3); font-weight: 400; font-size: 13.5px; }
  .tarifa__plana th, .tarifa__plana td { background: none; }
  .tarifa__plana { background: rgba(200, 147, 19, .16); padding: 14px 14px 8px !important; }
}

/* ---------- cierre de contacto: banda oscura, que se vea que es el contacto ---------- */
.cierre { position: relative; background: var(--tinta); color: var(--papel); overflow: hidden; }
.cierre::before {
  content: ""; position: absolute; left: 50%; top: -160px; width: min(900px, 110%); height: 480px;
  transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(200, 147, 19, .22) 0%, rgba(200, 147, 19, 0) 68%);
}
.cierre__int { position: relative; padding: 78px 0 84px; }
.cierre h2 { color: var(--papel); }
.cierre p { color: #C7BAB0; }
.cierre .brocha { color: var(--tinta); }
.cierre__datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 46px; padding-top: 34px; border-top: 1px solid #2A211B; }
.cierre__dato dt { font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--oro); margin-bottom: 8px; }
.cierre__dato dd { margin: 0; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: 1.3rem; line-height: 1.2; color: var(--papel); }
.cierre__dato dd a { color: var(--papel); }
.cierre__dato dd a:hover { color: var(--oro); }
.cierre__dato small { display: block; font-family: var(--texto); font-size: 13.5px; text-transform: none; letter-spacing: 0; color: #A2958B; margin-top: 6px; }
@media (max-width: 900px) { .cierre__datos { grid-template-columns: 1fr; gap: 22px; } }

/* ---------- Google: nota, reseñas y mapa ---------- */
.google { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 28px; align-items: stretch; }
.google__nota {
  background: linear-gradient(160deg, #24201D 0%, var(--tinta) 46%, #050403 100%);
  color: var(--papel); border-radius: 2px; padding: 30px 28px 32px;
  display: flex; flex-direction: column;
  box-shadow: inset 0 1px 0 rgba(247, 239, 231, .16), inset 0 0 0 1px rgba(200, 147, 19, .22);
}
.google__nota .antetitulo { color: var(--oro); }
.google__cifra { font-family: var(--display); font-weight: 400; font-size: 4.6rem; line-height: .9; margin: 0 0 10px; color: var(--papel); }
.google__nota .estrellas svg { width: 20px; height: 20px; fill: var(--oro); }
.google__pie { font-size: 14px; color: #A2958B; margin: 12px 0 0; }
.google__nota .btn--linea { color: var(--papel); border-color: rgba(247, 239, 231, .45); }
.google__nota .btn--linea:hover { background: var(--papel); color: var(--tinta); }
.google__mapa { position: relative; min-height: 380px; overflow: hidden; border-radius: 2px; }
.google__mapa iframe { position: absolute; inset: 0; width: 100%; height: 100%; filter: grayscale(.25) contrast(1.04); }

/* el sello de la nota, en la cabecera de la sección de opiniones */
.google__sello {
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
  border-right: 3px solid var(--oro); padding-right: 18px; color: var(--tinta);
}
.google__sello b { font-family: var(--display); font-weight: 400; font-size: 2.8rem; line-height: 1; }
.google__sello .estrellas svg { width: 15px; height: 15px; }
.google__sello small { font-size: 12.5px; color: var(--tinta-3); }
.google__sello:hover { color: var(--tinta); border-right-color: var(--tinta); }

@media (max-width: 900px) {
  .google { grid-template-columns: 1fr; }
  .google__mapa { min-height: 300px; }
  .google__sello { align-items: flex-start; border-right: 0; border-left: 3px solid var(--oro); padding: 0 0 0 16px; }
}

/* ---------- vídeo de la sala ---------- */
.video-sala { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: var(--negro); }
.video-sala video { width: 100%; height: 100%; object-fit: cover; }

/* ==========================================================================
   La caída: una escena fija y las piezas pasando por encima al bajar.
   Sin animación por JavaScript: es scroll normal sobre un elemento sticky.
   ========================================================================== */
.caida { position: relative; background: var(--negro); color: #F1E9E3; }
.caida__pila { position: relative; }

/* la escena que se queda quieta */
.caida__fijo {
  position: sticky; top: 0; height: 100vh; z-index: 1;
  display: grid; place-items: center; overflow: hidden;
}
.caida__brasa {
  position: absolute; left: 50%; top: 50%; width: min(1200px, 130%); height: 130%;
  transform: translate(-50%, -50%); pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(200, 147, 19, .16) 0%, rgba(200, 147, 19, 0) 62%);
}
.caida--fuego .caida__brasa { background: radial-gradient(ellipse at center, rgba(217, 89, 2, .32) 0%, rgba(217, 89, 2, 0) 62%); }
.caida__titulo { position: relative; text-align: center; max-width: 30ch; padding: 0 24px; }
.caida__titulo h2 { color: #F7EFE7; font-size: clamp(2rem, 4.4vw, 3.4rem); }
.caida__titulo p { color: var(--crema-os); margin-top: 16px; font-size: 1rem; max-width: 44ch; margin-left: auto; margin-right: auto; }
.caida__titulo .antetitulo { color: var(--oro); }
.caida--fuego .caida__titulo .antetitulo { color: #F0A73C; }

/* cada paso aporta su trozo de scroll y lleva una pieza colocada a su aire */
.caida__paso { position: relative; height: 82vh; z-index: 2; pointer-events: none; }
.caida__pieza {
  position: absolute; margin: 0;
  width: clamp(136px, 15vw, 230px); aspect-ratio: 9 / 16;
  overflow: hidden; border-radius: 2px;
  box-shadow: 0 34px 70px -26px rgba(0, 0, 0, .95), 0 0 0 1px rgba(247, 239, 231, .14);
}
.caida__pieza video, .caida__pieza img { width: 100%; height: 100%; object-fit: cover; }
.caida__pieza figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 12px;
  background: linear-gradient(to top, rgba(11, 9, 8, .92), rgba(11, 9, 8, 0));
  font-family: var(--display); font-weight: 400; text-transform: uppercase;
  font-size: 13px; letter-spacing: .05em; color: #F7EFE7;
}
/* dispersas, como en la referencia: alternando lado y altura */
.caida__paso--1 .caida__pieza { right: 8%;  top: 5%;  transform: rotate(5deg); }
.caida__paso--2 .caida__pieza { left: 7%;   top: 28%; transform: rotate(-6deg); }
.caida__paso--3 .caida__pieza { right: 11%; top: 44%; transform: rotate(3deg); }

@media (max-width: 900px) {
  .caida__paso { height: 70vh; }
  .caida__pieza { width: clamp(120px, 34vw, 200px); }
  .caida__paso--1 .caida__pieza { right: 5%;  top: 4%; }
  .caida__paso--2 .caida__pieza { left: 4%;   top: 22%; }
  .caida__paso--3 .caida__pieza { right: 12%; top: 2%; }
  .caida__titulo { max-width: 24ch; }
}
@media (prefers-reduced-motion: reduce) {
  .caida__fijo { position: static; height: auto; padding: 70px 0; }
  .caida__paso { height: auto; padding: 14px 0; display: flex; justify-content: center; }
  .caida__pieza { position: static; transform: none !important; }
}

/* ==========================================================================
   El congreso · diseño propio
   El único sitio de la web donde manda el negro, el fuego y el neón.
   ========================================================================== */
.congreso { background: #080605; color: #F1E9E3; }
.congreso h1, .congreso h2, .congreso h3 { color: #F7EFE7; }
.congreso p { color: var(--crema-os); }
.congreso .antetitulo { color: #F0A73C; }

/* héroe: el cartel a un lado y el titular en neón al otro */
.cg-heroe { position: relative; overflow: hidden; padding: 70px 0 84px; }
.cg-heroe::before {
  content: ""; position: absolute; left: 50%; top: -120px; width: min(1100px, 120%); height: 620px;
  transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(217, 89, 2, .45) 0%, rgba(217, 89, 2, .10) 45%, rgba(217, 89, 2, 0) 70%);
  animation: arder 6s ease-in-out infinite;
}
.cg-heroe::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background:
    repeating-linear-gradient(90deg, rgba(255, 138, 30, .07) 0 2px, transparent 2px 5px),
    radial-gradient(circle at 12% 22%, rgba(245, 230, 99, .13), transparent 26%),
    radial-gradient(circle at 88% 34%, rgba(217, 89, 2, .16), transparent 28%);
}
.cg-heroe__int { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 56px; align-items: center; }
.cg-cartel { position: relative; }
.cg-cartel img { width: 100%; box-shadow: 0 30px 70px -30px rgba(217, 89, 2, .8), 0 0 0 1px rgba(247, 223, 174, .18); }
.cg-cartel::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(217, 89, 2, .7), transparent 72%);
  filter: blur(26px); animation: arder 5s ease-in-out infinite;
}

.cg-fecha {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--display); font-size: clamp(1.4rem, 2.6vw, 2.1rem); letter-spacing: .06em;
  color: var(--neon); text-shadow: 0 0 10px rgba(245, 230, 99, .75), 0 0 34px rgba(245, 230, 99, .35);
  margin: 0 0 18px;
}
.cg-fecha b { font-weight: 400; }
.cg-fecha i { width: 8px; height: 8px; background: var(--neon); border-radius: 50%; box-shadow: 0 0 12px var(--neon); }
.cg-titulo {
  font-family: var(--display); font-weight: 400; text-transform: uppercase;
  font-size: clamp(3rem, 7.4vw, 6.2rem); line-height: .86; margin: 0;
  color: #FFF3DC;
  text-shadow: 0 0 6px rgba(255, 243, 220, .5), 0 0 30px rgba(217, 89, 2, .85), 0 6px 0 rgba(0, 0, 0, .55);
}
.cg-titulo em { display: block; font-style: normal; font-size: .42em; letter-spacing: .18em; color: var(--fuego); text-shadow: 0 0 22px rgba(217, 89, 2, .9); margin-top: 14px; }
.cg-sede { font-family: var(--mano); font-size: 1.6rem; color: #F7DFAE; margin: 22px 0 0; }

/* cifras grandes del pase */
.cg-precios { display: flex; gap: 0; flex-wrap: wrap; margin: 34px 0 32px; }
.cg-precio { padding: 0 30px; border-left: 1px solid rgba(247, 223, 174, .22); }
.cg-precio:first-child { padding-left: 0; border-left: 0; }
.cg-precio b { display: block; font-family: var(--display); font-weight: 400; font-size: 2.6rem; line-height: 1; color: #FFF3DC; }
.cg-precio span { display: block; font-size: 13px; color: var(--crema-os); margin-top: 6px; max-width: 20ch; }

/* desfile de nombres en neón */
.cg-nombres { border-top: 1px solid rgba(247, 223, 174, .16); border-bottom: 1px solid rgba(247, 223, 174, .16); padding: 18px 0; overflow: hidden; background: rgba(217, 89, 2, .07); }
.cg-nombres .tira { display: flex; width: max-content; will-change: transform; backface-visibility: hidden; animation: desfile 44s linear infinite; }
.cg-nombres .tira:hover { animation-play-state: paused; }
.cg-nombres span { font-family: var(--display); font-size: 1.5rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; color: #F7DFAE; }
.cg-nombres .n { padding: 0 26px; }
.cg-nombres .s { color: var(--fuego); }

/* rejilla de artistas */
.cg-artistas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.cg-artista { position: relative; display: block; overflow: hidden; }
.cg-artista img { width: 100%; transition: transform .7s cubic-bezier(.2, .75, .3, 1), filter .5s ease; filter: saturate(.85); }
.cg-artista:hover img { transform: scale(1.05); filter: saturate(1.15); }
.cg-artista figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 14px;
  background: linear-gradient(to top, rgba(8, 6, 5, .95), rgba(8, 6, 5, 0));
  font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: 14px;
  letter-spacing: .04em; color: #FFF3DC;
}

/* lo que incluye */
.cg-incluye { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; }
.cg-incluye > div { border-top: 2px solid var(--fuego); padding-top: 20px; }
.cg-incluye h3 { font-size: 1.2rem; margin-bottom: 10px; }
.cg-incluye p { font-size: 15px; margin: 0; }

/* tabla de pases sin cajas */
.cg-pases { display: flex; flex-direction: column; }
.cg-pase { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: baseline; padding: 22px 0; border-top: 1px solid rgba(247, 223, 174, .16); }
.cg-pase:first-child { border-top: 2px solid #F7DFAE; }
.cg-pase h3 { font-size: 1.25rem; margin-bottom: 6px; }
.cg-pase p { font-size: 14.5px; margin: 0; max-width: 52ch; }
.cg-pase b { font-family: var(--display); font-weight: 400; font-size: 2rem; color: var(--neon); text-shadow: 0 0 16px rgba(245, 230, 99, .4); white-space: nowrap; }

.cg-nota { font-size: 13px; color: #9C8E85; margin-top: 26px; max-width: 70ch; }

@media (max-width: 1000px) {
  .cg-heroe__int { grid-template-columns: 1fr; gap: 36px; }
  .cg-cartel { max-width: 340px; }
  .cg-artistas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cg-incluye { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 700px) {
  .cg-heroe { padding: 44px 0 56px; }
  .cg-artistas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .cg-precios { gap: 20px 0; }
  .cg-precio { padding: 0 18px 0 0; border-left: 0; }
  .cg-precio b { font-size: 2rem; }
  .cg-nombres span { font-size: 1.15rem; }
  .cg-pase { grid-template-columns: 1fr; gap: 8px; }
}

/* ---------- cajas doradas: lo práctico, bien remarcado ---------- */
.destacados { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.dorada {
  position: relative; overflow: hidden; border-radius: 2px;
  background: linear-gradient(160deg, #E0AE2C 0%, var(--oro) 42%, #A87A0C 100%);
  color: var(--tinta);
  padding: 26px 24px 28px; display: flex; flex-direction: column; gap: 12px;
  transition: transform .25s ease, box-shadow .25s ease;
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 222, .55),
    inset 0 -1px 0 rgba(20, 17, 16, .28),
    inset 0 -40px 46px -34px rgba(20, 17, 16, .55),
    inset 0 44px 40px -40px rgba(255, 246, 222, .35),
    0 2px 0 rgba(20, 17, 16, .12);
}
/* el brillo que cruza el metal */
.dorada::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(112deg, transparent 34%, rgba(255, 250, 235, .3) 46%, transparent 56%);
  opacity: .8; transition: transform .6s cubic-bezier(.2, .75, .3, 1);
}
.dorada > * { position: relative; z-index: 1; }
a.dorada:hover {
  transform: translateY(-5px); color: var(--tinta);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 222, .7),
    inset 0 -1px 0 rgba(20, 17, 16, .3),
    inset 0 -46px 50px -34px rgba(20, 17, 16, .48),
    inset 0 48px 44px -40px rgba(255, 246, 222, .45),
    0 20px 36px -18px rgba(20, 17, 16, .55);
}
a.dorada:hover::after { transform: translateX(38%); }
.dorada__icono { width: 30px; height: 30px; flex: none; }
.dorada__icono svg { width: 30px; height: 30px; fill: none; stroke: var(--tinta); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dorada dt, .dorada__rotulo {
  font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(20, 17, 16, .62); margin: 0;
}
.dorada dd, .dorada__valor { overflow-wrap: anywhere;
  margin: 0; font-family: var(--display); font-weight: 400; text-transform: uppercase;
  font-size: 1.35rem; line-height: 1.1; color: var(--tinta); letter-spacing: .01em;
}
.dorada__pie { font-size: 13.5px; color: rgba(20, 17, 16, .72); margin: auto 0 0; line-height: 1.5; }
.dorada--tinta {
  background: linear-gradient(160deg, #24201D 0%, var(--tinta) 46%, #050403 100%);
  color: var(--papel);
  box-shadow:
    inset 0 1px 0 rgba(247, 239, 231, .16),
    inset 0 -1px 0 rgba(0, 0, 0, .6),
    inset 0 -40px 46px -34px rgba(0, 0, 0, .7),
    inset 0 0 0 1px rgba(200, 147, 19, .22),
    0 2px 0 rgba(20, 17, 16, .3);
}
.dorada--tinta::after { background: linear-gradient(112deg, transparent 34%, rgba(200, 147, 19, .16) 46%, transparent 56%); }
a.dorada--tinta:hover {
  box-shadow:
    inset 0 1px 0 rgba(247, 239, 231, .22),
    inset 0 -1px 0 rgba(0, 0, 0, .6),
    inset 0 -46px 50px -34px rgba(0, 0, 0, .62),
    inset 0 0 0 1px rgba(200, 147, 19, .4),
    0 20px 36px -18px rgba(0, 0, 0, .7);
}
.dorada--tinta .dorada__icono svg { stroke: var(--oro); }
.dorada--tinta dt, .dorada--tinta .dorada__rotulo { color: rgba(239, 231, 225, .58); }
.dorada--tinta dd, .dorada--tinta .dorada__valor { color: var(--papel); }
.dorada--tinta .dorada__pie { color: rgba(239, 231, 225, .72); }
a.dorada--tinta:hover { color: var(--papel); }

/* la cifra suelta, en grande */
.cifra-sola { display: flex; align-items: baseline; gap: 20px; }
.cifra-sola b { font-family: var(--display); font-weight: 400; font-size: clamp(4.5rem, 11vw, 8rem); line-height: .85; color: var(--tinta); }
.cifra-sola span { font-size: 1.05rem; color: var(--tinta-3); max-width: 14ch; line-height: 1.4; }

@media (max-width: 1000px) { .destacados { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .destacados { grid-template-columns: 1fr; gap: 12px; } .cifra-sola b { font-size: 4.5rem; } }

/* el congreso destaca en el menú */
.menu a.menu__fuego { color: #F0A73C; }
.menu a.menu__fuego:hover, .menu a.menu__fuego[aria-current="page"] { color: #FFD08A; }
.menu a.menu__fuego::after { background: var(--fuego); }

/* ---------- carteles del curso: el ancho se ajusta a cuántos hay ---------- */
.carteles-curso { display: grid; gap: 20px; justify-content: center; }
.carteles-curso--1 { grid-template-columns: minmax(0, 400px); }
.carteles-curso--2 { grid-template-columns: repeat(2, minmax(0, 340px)); }
.carteles-curso--3 { grid-template-columns: repeat(3, minmax(0, 320px)); }
.carteles-curso--4 { grid-template-columns: repeat(4, minmax(0, 280px)); }
@media (max-width: 900px) {
  .carteles-curso--3, .carteles-curso--4 { grid-template-columns: repeat(2, minmax(0, 300px)); }
}
@media (max-width: 620px) {
  .carteles-curso { grid-template-columns: minmax(0, 320px) !important; }
}

/* ---------- cierre de contacto: banda oscura, que se vea que es el contacto ---------- */
.cierre { position: relative; background: var(--tinta); color: var(--papel); overflow: hidden; }
.cierre::before {
  content: ""; position: absolute; left: 50%; top: -160px; width: min(900px, 110%); height: 480px;
  transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(200, 147, 19, .22) 0%, rgba(200, 147, 19, 0) 68%);
}
.cierre__int { position: relative; padding: 78px 0 84px; }
.cierre h2 { color: var(--papel); }
.cierre p { color: #C7BAB0; }
.cierre .brocha { color: var(--tinta); }
.cierre__datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 46px; padding-top: 34px; border-top: 1px solid #2A211B; }
.cierre__dato dt { font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--oro); margin-bottom: 8px; }
.cierre__dato dd { margin: 0; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: 1.3rem; line-height: 1.2; color: var(--papel); }
.cierre__dato dd a { color: var(--papel); }
.cierre__dato dd a:hover { color: var(--oro); }
.cierre__dato small { display: block; font-family: var(--texto); font-size: 13.5px; text-transform: none; letter-spacing: 0; color: #A2958B; margin-top: 6px; }
@media (max-width: 900px) { .cierre__datos { grid-template-columns: 1fr; gap: 22px; } }

/* ---------- Google: nota, reseñas y mapa ---------- */
.google { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 28px; align-items: stretch; }
.google__nota {
  background: linear-gradient(160deg, #24201D 0%, var(--tinta) 46%, #050403 100%);
  color: var(--papel); border-radius: 2px; padding: 30px 28px 32px;
  display: flex; flex-direction: column;
  box-shadow: inset 0 1px 0 rgba(247, 239, 231, .16), inset 0 0 0 1px rgba(200, 147, 19, .22);
}
.google__nota .antetitulo { color: var(--oro); }
.google__cifra { font-family: var(--display); font-weight: 400; font-size: 4.6rem; line-height: .9; margin: 0 0 10px; color: var(--papel); }
.google__nota .estrellas svg { width: 20px; height: 20px; fill: var(--oro); }
.google__pie { font-size: 14px; color: #A2958B; margin: 12px 0 0; }
.google__nota .btn--linea { color: var(--papel); border-color: rgba(247, 239, 231, .45); }
.google__nota .btn--linea:hover { background: var(--papel); color: var(--tinta); }
.google__mapa { position: relative; min-height: 380px; overflow: hidden; border-radius: 2px; }
.google__mapa iframe { position: absolute; inset: 0; width: 100%; height: 100%; filter: grayscale(.25) contrast(1.04); }

/* el sello de la nota, en la cabecera de la sección de opiniones */
.google__sello {
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
  border-right: 3px solid var(--oro); padding-right: 18px; color: var(--tinta);
}
.google__sello b { font-family: var(--display); font-weight: 400; font-size: 2.8rem; line-height: 1; }
.google__sello .estrellas svg { width: 15px; height: 15px; }
.google__sello small { font-size: 12.5px; color: var(--tinta-3); }
.google__sello:hover { color: var(--tinta); border-right-color: var(--tinta); }

@media (max-width: 900px) {
  .google { grid-template-columns: 1fr; }
  .google__mapa { min-height: 300px; }
  .google__sello { align-items: flex-start; border-right: 0; border-left: 3px solid var(--oro); padding: 0 0 0 16px; }
}

/* ---------- vídeo de la sala ---------- */
.video-sala { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: var(--negro); }
.video-sala video { width: 100%; height: 100%; object-fit: cover; }


/* ==========================================================================
   Arreglos de móvil
   ========================================================================== */
@media (max-width: 1000px) {
  /* los anchos de columna escritos en el HTML no pueden ganar aquí:
     si no, la columna de texto colapsa a cero */
  .dos-columnas, .dos-columnas--ancha-izq { grid-template-columns: 1fr !important; }
  .cg-heroe__int { grid-template-columns: 1fr !important; }
}

@media (max-width: 700px) {
  /* el padding vertical del hero lo borraba .contenedor de la media query */
  .cabecera .cabecera__int { padding: 84px 20px 96px; }
  .cierre .cierre__int { padding: 64px 20px 70px; }

  /* zonas de pulsación: nada por debajo de 44 px */
  .pie__cols a { display: block; padding: 9px 0; }
  .pie__legal a { display: inline-block; padding: 12px 0; }
  .enlace-filete { padding: 14px 0 10px; }
  .campo input, .campo select, .campo textarea { padding: 14px 2px; }
  .cierre__dato dd a { display: inline-block; padding: 11px 0; }
  .legal a, .caida__titulo a, main p > a { padding: 6px 0; display: inline-block; }

  /* la etiqueta del carrusel, legible */
  .nivel__estilo { font-size: 11px; letter-spacing: .12em; }

  /* el cartel del congreso, contenido */
  .cg-cartel { max-width: 320px; margin-left: auto; margin-right: auto; }
}

/* ---------- con nueve enlaces la barra va justa: se aprieta antes de partirse ---------- */
.menu { flex-wrap: nowrap; }
@media (max-width: 1500px) {
  .menu { gap: 17px; }
  .menu a { font-size: 15px; letter-spacing: .03em; }
  .barra { gap: 20px; padding-right: 24px; }
}
@media (max-width: 1240px) {
  .menu, .barra__tel { display: none; }
  .hamburguesa { display: block; }
  .barra--abierta .menu {
    display: flex; position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--tinta); padding: 8px 20px 20px; z-index: 30;
  }
  .barra--abierta .menu a { padding: 14px 0; font-size: 17px; border-bottom: 1px solid var(--negro-2); }
}

/* ---------- la bolita de WhatsApp, siempre abajo a la derecha ---------- */
.wasap {
  position: fixed; right: 22px; bottom: 22px; z-index: 40;
  width: 58px; height: 58px; border-radius: 50%; background: #25D366;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 26px -8px rgba(11, 9, 8, .55), inset 0 1px 0 rgba(255, 255, 255, .35);
  transition: transform .25s ease, box-shadow .25s ease;
}
.wasap svg { width: 32px; height: 32px; fill: #fff; }
.wasap:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 16px 30px -10px rgba(11, 9, 8, .6); }
.wasap:focus-visible { outline: 3px solid var(--oro); outline-offset: 3px; }
/* el aro que late, para que se vea sin dar la lata */
.wasap::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid #25D366; animation: latido 2.8s ease-out 6; will-change: transform, opacity;
}
@keyframes latido {
  0%   { transform: scale(1); opacity: .7; }
  70%  { transform: scale(1.55); opacity: 0; }
  100% { transform: scale(1.55); opacity: 0; }
}
/* la etiqueta solo asoma en escritorio, al pasar por encima */
.wasap__globo {
  position: absolute; right: 70px; white-space: nowrap;
  background: var(--tinta); color: var(--papel-2);
  font-size: 13.5px; padding: 8px 13px; border-radius: 2px;
  opacity: 0; transform: translateX(6px); pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
}
.wasap:hover .wasap__globo { opacity: 1; transform: translateX(0); }
@media (max-width: 700px) {
  .wasap { right: 16px; bottom: 16px; width: 54px; height: 54px; }
  .wasap svg { width: 29px; height: 29px; }
  .wasap__globo { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .wasap::before { animation: none; }
}

/* ---------- musica: apagada de entrada, se enciende si la quieren ---------- */
.musica {
  position: fixed; right: 26px; bottom: 92px; z-index: 40;
  width: 50px; height: 50px; border-radius: 50%; border: 0; padding: 0;
  background: linear-gradient(160deg, #E0AE2C 0%, var(--oro) 45%, #A87A0C 100%);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px -8px rgba(11, 9, 8, .55), inset 0 1px 0 rgba(255, 246, 222, .5);
  transition: transform .25s ease, box-shadow .25s ease;
}
.musica svg { width: 25px; height: 25px; fill: none; stroke: var(--tinta); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.musica svg path:first-child { fill: var(--tinta); }
.musica:hover { transform: translateY(-3px); box-shadow: 0 14px 26px -10px rgba(11, 9, 8, .6); }
.musica:focus-visible { outline: 3px solid var(--tinta); outline-offset: 3px; }
.musica .musica__on { display: none; }
.musica[aria-pressed="true"] .musica__on { display: block; }
.musica[aria-pressed="true"] .musica__off { display: none; }
@media (max-width: 700px) {
  .musica { right: 19px; bottom: 80px; width: 46px; height: 46px; }
  .musica svg { width: 22px; height: 22px; }
}