/* =====================================================================
   Casa Zoe v2 · estilos (21/10/2026)
   Todos los colores, letras, tamaños y tiempos salen de identidad.css (no se escriben aquí).
   Sin JavaScript todo se ve: los estados escondidos solo existen con html.js-listo.
   ===================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
body { margin: 0; background: var(--c-fondo); color: var(--c-tinta); font: var(--peso-texto) var(--t-texto)/1.65 var(--f-texto); -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, video, svg { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; color: inherit; }
h1, h2, h3, h4 { font-family: var(--f-titulo); font-weight: var(--peso-titulo); letter-spacing: var(--espacio-titulo); line-height: 1.02; margin: 0; }
p { margin: 0 0 1em; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saltar { position: fixed; left: 12px; top: -60px; z-index: 100; background: var(--c-tinta); color: var(--c-fondo); padding: 10px 16px; border-radius: var(--radio-pildora); }
.saltar:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--c-arena); outline-offset: 3px; }

.envoltura { width: 100%; max-width: var(--ancho); margin-inline: auto; padding-inline: var(--margen); }
.seccion { padding-block: var(--aire); position: relative; }
.noche { background: var(--c-noche); color: var(--c-claro-sobre-noche); }
.papel { background: var(--c-papel); }

/* ---------- Letras ---------- */
.etiqueta { font: var(--peso-etiqueta) var(--t-etiqueta)/1.4 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; margin: 0 0 1.4em; display: flex; align-items: center; gap: .9em; color: var(--c-tinta-suave); }
.etiqueta::before { content: ""; width: 28px; height: 1px; background: currentColor; opacity: .7; }
.noche .etiqueta, .clara .etiqueta, .etiqueta.clara { color: var(--c-arena); }
.gigante, .enorme, .grande { font-family: var(--f-titulo); font-weight: var(--peso-gigante); text-transform: uppercase; letter-spacing: var(--espacio-gigante); line-height: var(--interlinea-gigante); }
.gigante { font-size: var(--t-gigante); padding-top: .08em; }
.enorme, .grande { padding-top: .06em; }
.enorme { font-size: var(--t-enorme); }
.grande { font-size: var(--t-grande); }
.medio { font-size: var(--t-medio); line-height: 1.18; font-family: var(--f-titulo); font-weight: var(--peso-ligero); }
.frase { font: var(--peso-ligero) var(--t-frase)/1.12 var(--f-titulo); letter-spacing: var(--espacio-titulo); margin: 0; text-wrap: balance; }
.frase a { text-decoration: none; font-weight: var(--peso-titulo); background: linear-gradient(currentColor, currentColor) 0 100% / 100% 2px no-repeat; transition: background-size .3s var(--curva); }
.frase a:hover { background-size: 0 2px; background-position: 100% 100%; }
.gigante + .lead, .enorme + .lead, .grande + .lead { margin-top: 1.1em; }
.lead { font-size: clamp(18px, 1.35vw, 21px); line-height: 1.6; max-width: 38em; color: var(--c-tinta-suave); }
.noche .lead, .clara .lead { color: var(--c-suave-sobre-noche); }
.cita { margin: 0; font: var(--peso-ligero) var(--t-chico)/1.45 var(--f-titulo); max-width: 34em; }
.cita cite { display: block; margin-top: .9em; font: var(--peso-etiqueta) var(--t-etiqueta)/1.4 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; font-style: normal; opacity: .75; }
.credito { font-size: 13px; color: var(--c-tinta-suave); margin-top: 1.4em; max-width: 60em; }
.noche .credito { color: var(--c-suave-sobre-noche); }
.credito a { text-underline-offset: 3px; }

/* ---------- Botones (píldoras) ---------- */
.boton { display: inline-flex; align-items: center; justify-content: center; gap: .7em; min-height: 52px; padding: 0 26px; border-radius: var(--radio-pildora); border: 1.5px solid currentColor; background: transparent; color: inherit; font: var(--peso-fuerte) 13px/1 var(--f-titulo); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: transform .25s var(--curva), background-color .25s, color .25s, border-color .25s; }
.boton:hover { transform: translateY(-2px); }
.boton--lleno { background: var(--c-tinta); border-color: var(--c-tinta); color: var(--c-fondo); }
.noche .boton--lleno, .clara .boton--lleno { background: var(--c-arena); border-color: var(--c-arena); color: var(--c-noche); }
.boton .flecha { transition: transform .25s var(--curva); }
.boton:hover .flecha { transform: translateX(4px); }
.boton[aria-disabled="true"] { opacity: .45; cursor: not-allowed; transform: none; }
.botones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 2.2em; }

/* ---------- Encabezado: píldoras de vidrio ---------- */
.cab { position: fixed; inset: 0 0 auto; z-index: 50; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px var(--margen) 0; pointer-events: none; }
.cab > * { pointer-events: auto; }
.pildora { background: var(--c-vidrio); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); border: 1px solid rgb(var(--rgb-luz) / .5); box-shadow: 0 8px 30px rgb(var(--rgb-sombra) / .12); border-radius: var(--radio-pildora); color: var(--c-tinta); }
.cab-logo { display: block; padding: 6px 22px; border-radius: 18px; transition: padding .35s var(--curva); }
.cab-logo img { height: 64px; width: auto; transition: height .35s var(--curva); }
.cab.compacta .cab-logo { padding: 4px 16px; }
.cab.compacta .cab-logo img { height: 48px; }
.cab-nav { display: flex; align-items: center; gap: 2px; padding: 5px; margin-top: 10px; }
.cab-nav a { text-decoration: none; font: var(--peso-etiqueta) 13px/1 var(--f-titulo); letter-spacing: .14em; text-transform: uppercase; padding: 13px 18px; border-radius: var(--radio-pildora); transition: background-color .2s, color .2s; }
.cab-nav a:hover { background: rgb(var(--rgb-tinta) / .07); }
.cab-nav a[aria-current] { background: var(--c-tinta); color: var(--c-fondo); }
.cab-acciones { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.cab-acciones .boton { min-height: 46px; padding: 0 22px; }
.cab-acciones .boton--lleno { background: var(--c-arena); border-color: var(--c-arena); color: var(--c-noche); box-shadow: 0 8px 30px rgb(var(--rgb-sombra) / .14); }
.cab-musica, .cab-menu { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 46px; min-width: 46px; padding: 0 14px; cursor: pointer; font: var(--peso-fuerte) 13px/1 var(--f-titulo); letter-spacing: .14em; text-transform: uppercase; }
.cab-musica svg { width: 18px; height: 18px; }
.cab-musica[aria-pressed="false"] .onda { opacity: 0; }
.cab-musica[aria-pressed="false"]::after { content: ""; position: absolute; width: 22px; height: 1.5px; background: currentColor; transform: rotate(-45deg); }
.cab-musica { position: relative; }
.cab-menu { display: none; }
.hamb { width: 20px; display: grid; gap: 5px; }
.hamb i { display: block; height: 1.5px; background: currentColor; transition: transform var(--t-menu) var(--curva), width var(--t-menu) var(--curva); }
.hamb i:last-child { width: 13px; justify-self: end; }
.menu-abierto .hamb i:first-child { transform: translateY(3.25px) rotate(45deg); }
.menu-abierto .hamb i:last-child { width: 20px; transform: translateY(-3.25px) rotate(-45deg); }

@media (max-width: 1023px) {
  .cab-nav { display: none; }
  .cab-menu { display: inline-flex; }
  .cab-logo { padding: 4px 14px; border-radius: 14px; }
  .cab-logo img { height: 50px; }
  .cab.compacta .cab-logo img { height: 42px; }
  .cab-acciones { margin-top: 6px; gap: 6px; }
  .cab-acciones .boton { min-height: 44px; padding: 0 16px; }
  .cab-musica, .cab-menu { height: 44px; }
}
@media (max-width: 380px) { .cab-menu .txt { display: none; } .cab-acciones .boton { padding: 0 13px; letter-spacing: .1em; } .cab { padding-inline: 12px; } }

/* ---------- Menú de pantalla completa (celular) ---------- */
.menu { display: none; }
.js-listo .menu { display: flex; position: fixed; inset: 0; z-index: 45; flex-direction: column; justify-content: space-between; background: var(--c-noche); color: var(--c-claro-sobre-noche); padding: 120px var(--margen) 0; overflow: hidden auto;
  visibility: hidden; clip-path: inset(0 0 100% 0); transition: clip-path var(--t-menu) var(--curva), visibility 0s linear var(--t-menu); }
.menu-abierto .menu { visibility: visible; clip-path: inset(0 0 0 0); transition: clip-path var(--t-menu) var(--curva), visibility 0s; }
.menu-enlaces { display: grid; gap: 2px; }
.menu-enlaces a { font: var(--peso-gigante) clamp(40px, 11vw, 64px)/1.02 var(--f-titulo); letter-spacing: var(--espacio-gigante); text-transform: uppercase; text-decoration: none; display: flex; align-items: baseline; gap: 14px;
  opacity: 0; transform: translateY(18px) scaleX(1.18); transform-origin: left; filter: blur(3px); color: var(--c-suave-sobre-noche);
  transition: opacity .5s var(--curva), transform .5s var(--curva), filter .5s var(--curva), color .5s; transition-delay: 0s; }
.menu-enlaces a small { font: var(--peso-etiqueta) 12px/1 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); color: var(--c-arena); transform: translateY(-1.2em); }
.menu-enlaces a[aria-current] { color: var(--c-arena); }
.menu-abierto .menu-enlaces a { opacity: 1; transform: none; filter: none; color: var(--c-claro-sobre-noche); transition-delay: calc(140ms + var(--i) * 70ms); }
.menu-abierto .menu-enlaces a[aria-current] { color: var(--c-arena); }
.menu-pie { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 34px 0 18px; font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: .16em; text-transform: uppercase; opacity: 0; transition: opacity .4s ease .1s; }
.menu-abierto .menu-pie { opacity: 1; transition-delay: .55s; }
.menu-pie a { text-decoration: none; color: var(--c-suave-sobre-noche); }
.menu-nombre { width: max-content; font: var(--peso-gigante) 17vw/.8 var(--f-titulo); letter-spacing: -.04em; text-transform: uppercase; white-space: nowrap; color: var(--c-claro-sobre-noche); margin: 0 -.02em -.06em; transform: translateY(40%); transition: transform .7s var(--curva); }
.menu-abierto .menu-nombre { transform: none; transition-delay: .3s; }
.menu-abierto { overflow: hidden; }
@media (min-width: 1024px) { .js-listo .menu { display: none; } }

/* ---------- Páginas (un solo archivo; cambio de página sin recargar) ---------- */
.js-listo .pagina:not(.activa) { display: none; }
html.js:not(.js-listo)[data-inicial="inicio"] .pagina:not(#inicio),
html.js:not(.js-listo)[data-inicial="eventos"] .pagina:not(#eventos),
html.js:not(.js-listo)[data-inicial="herederos"] .pagina:not(#herederos),
html.js:not(.js-listo)[data-inicial="dona"] .pagina:not(#dona),
html.js:not(.js-listo)[data-inicial="contacto"] .pagina:not(#contacto) { display: none; }
.pagina.entra { animation: pagina-entra var(--t-pagina) var(--curva) both; }
@keyframes pagina-entra { from { opacity: .55; transform: translateY(8px); } }

/* ---------- Aparición al bajar (12 px, 0.45 s) y cascada (60 ms) ---------- */
.js-listo .rv:not(.visto), .js-listo [data-cascada]:not(.visto) > * { opacity: 0; transform: translateY(var(--sube)); }
.js-listo .rv, .js-listo [data-cascada] > * { transition: opacity var(--t-aparece) var(--curva), transform var(--t-aparece) var(--curva); transition-delay: var(--d, 0ms); }

/* ---------- Video (reproductor propio, sin «imagen en imagen») ---------- */
.vid { position: relative; overflow: hidden; background: var(--c-negro); border-radius: var(--radio); isolation: isolate; }
.vid video { width: 100%; height: 100%; object-fit: cover; }
video[data-mz-deco] { pointer-events: none; }
.vid-capa { position: absolute; inset: 0; z-index: 2; cursor: pointer; background: none; border: 0; padding: 0; }
.vid-jugar { position: absolute; z-index: 3; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%; border: 0; display: grid; place-items: center; cursor: pointer;
  background: var(--c-vidrio); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: var(--c-tinta); box-shadow: 0 10px 40px rgb(var(--rgb-sombra) / .3); transition: transform .3s var(--curva), opacity .3s; }
.vid-jugar svg { width: 30px; height: 30px; margin-left: 4px; }
.vid-jugar:hover { transform: scale(1.06); }
.vid.sonando .vid-jugar, .vid.corriendo .vid-jugar { opacity: 0; pointer-events: none; transform: scale(.9); }
.vid-sonido { position: absolute; z-index: 4; left: 14px; bottom: 14px; display: none; align-items: center; gap: 10px; min-height: 46px; padding: 0 18px 0 14px; border-radius: var(--radio-pildora); border: 0; cursor: pointer;
  background: var(--c-vidrio); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: var(--c-tinta); font: var(--peso-fuerte) 12px/1 var(--f-titulo); letter-spacing: .14em; text-transform: uppercase; box-shadow: 0 8px 26px rgb(var(--rgb-sombra) / .25); animation: llama 2.4s var(--curva) 1s 3; }
.vid-sonido svg { width: 18px; height: 18px; }
.vid.mudo.corriendo .vid-sonido, .sin-gesto .vid.mudo[data-video="prota"] .vid-sonido { display: inline-flex; }   /* si el navegador ya deja sonar, no aparece */
.portada .vid-sonido { min-height: 60px; padding: 0 26px 0 22px; font-size: 14px; gap: 12px; }
.portada .vid-sonido svg { width: 22px; height: 22px; }
@keyframes llama { 50% { box-shadow: 0 0 0 9px rgb(var(--rgb-arena) / .45), 0 8px 26px rgb(var(--rgb-sombra) / .25); } }
.vid-barra { position: absolute; z-index: 4; right: 12px; bottom: 12px; display: flex; gap: 8px; }   /* siempre visible: silenciar y pausar */
.vid-barra button { width: 42px; height: 42px; border-radius: 50%; border: 0; display: grid; place-items: center; cursor: pointer; background: rgb(var(--rgb-noche) / .55); color: var(--c-blanco); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.vid-barra svg { width: 18px; height: 18px; }
.vid-progreso { position: absolute; z-index: 3; left: 0; right: 0; bottom: 0; height: 3px; background: rgb(var(--rgb-luz) / .18); }
.vid-progreso i { display: block; height: 100%; width: 100%; background: var(--c-arena); transform-origin: left; transform: scaleX(var(--p, 0)); }
.vid-cap { margin-top: 12px; font: var(--peso-etiqueta) 12px/1.5 var(--f-etiqueta); letter-spacing: .16em; text-transform: uppercase; color: var(--c-tinta-suave); }
.noche .vid-cap { color: var(--c-suave-sobre-noche); }

/* ---------- INICIO · portada de video ---------- */
.portada { position: relative; height: 100vh; height: 100svh; min-height: 560px; background: var(--c-noche); color: var(--c-blanco); overflow: hidden; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.portada-paisaje { position: absolute; inset: 0; z-index: 0; }
.portada-paisaje img { width: 100%; height: 100%; object-fit: cover; }
.portada::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(rgb(var(--rgb-noche) / .5), rgb(var(--rgb-noche) / .38) 45%, rgb(var(--rgb-noche) / .62)); pointer-events: none; }
.portada-video { position: relative; z-index: 2; grid-column: 2; height: 100svh; height: 100vh; aspect-ratio: 9 / 16; margin: 0; }
@supports (height: 100svh) { .portada-video { height: 100svh; } }
.portada-video .vid { position: absolute; inset: 0; border-radius: 0; box-shadow: 0 0 120px rgb(var(--rgb-sombra) / .5); }
.portada-nombre { display: contents; }
.portada-nombre span { position: relative; z-index: 2; font: var(--peso-gigante) clamp(56px, 11.2vw, 210px)/.8 var(--f-titulo); letter-spacing: var(--espacio-gigante); text-transform: uppercase; align-self: center; padding-inline: 3vw; text-shadow: 0 4px 60px rgb(var(--rgb-sombra) / .35); }
.portada-nombre .izq { grid-column: 1; grid-row: 1; justify-self: end; }
.portada-nombre .der { grid-column: 3; grid-row: 1; justify-self: start; }
.portada-info { position: absolute; z-index: 3; left: var(--margen); bottom: clamp(24px, 5vh, 56px); max-width: calc(50% - 22svh); }
.portada-info .etiqueta { color: var(--c-arena); margin-bottom: 1em; }
.portada-info p { color: rgb(var(--rgb-luz) / .82); font-size: 15px; margin: 0; }
.portada-acciones { position: absolute; z-index: 3; right: var(--margen); bottom: clamp(24px, 5vh, 56px); display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; max-width: calc(50% - 30svh); }
.portada-acciones .boton { color: var(--c-blanco); }
.portada-acciones .boton--lleno { color: var(--c-noche); }
.portada-baja { position: absolute; z-index: 3; left: 50%; bottom: 18px; transform: translateX(-50%); width: 44px; height: 44px; display: grid; place-items: center; color: var(--c-blanco); border-radius: 50%; }
.portada-baja svg { width: 22px; height: 22px; animation: baja 2s var(--curva) infinite; }
@keyframes baja { 0% { transform: translateY(-6px); opacity: 0; } 40% { opacity: 1; } 100% { transform: translateY(8px); opacity: 0; } }
.portada .vid-sonido { left: 50%; transform: translateX(-50%); bottom: 64px; white-space: nowrap; }

@media (max-width: 1023px), (max-aspect-ratio: 5/4) {
  .portada { display: block; }
  .portada-paisaje { display: none; }
  .portada-video { position: absolute; inset: 0; height: auto; aspect-ratio: auto; }
  .portada-video .vid { box-shadow: none; }
  .portada::after { z-index: 2; background: linear-gradient(to top, rgb(var(--rgb-sombra) / .78) 0%, rgb(var(--rgb-sombra) / .25) 24%, transparent 42%), linear-gradient(to bottom, rgb(var(--rgb-sombra) / .35), transparent 22%); }
  .portada-nombre { display: block; position: absolute; z-index: 3; left: var(--margen); right: var(--margen); bottom: 84px; }
  .portada-nombre span { display: inline; padding: 0; font-size: clamp(52px, 15vw, 120px); }
  .portada-nombre .izq::after { content: " "; }
  .portada-info { left: var(--margen); right: var(--margen); bottom: calc(84px + min(15vw, 120px) * .9 + 24px); max-width: none; }
  .portada-info .etiqueta { margin: 0; }
  .portada-info p:not(.etiqueta) { display: none; }
  .portada-acciones { display: none; }
  .portada .vid-sonido { left: 50%; right: auto; transform: translateX(-50%); bottom: 18px; }
  .portada .vid-barra { right: var(--margen); bottom: auto; top: 50%; flex-direction: column; transform: translateY(-50%); }
  .portada-baja { display: none; }
}

/* ---------- INICIO · frase grande ---------- */
.frase-sec { min-height: 100svh; display: flex; align-items: center; }
.frase-sec .frase { max-width: 17em; }
.frase-sec .cita { margin-top: clamp(40px, 6vw, 88px); padding-left: 22px; border-left: 2px solid var(--c-arena); }

/* ---------- Renglones con flecha (Eventos en Inicio y en Eventos) ---------- */
.renglones { list-style: none; margin: clamp(32px, 5vw, 64px) 0 0; padding: 0; border-top: 1px solid var(--c-linea-noche); }
.renglones li { border-bottom: 1px solid var(--c-linea-noche); }
.renglon { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: clamp(14px, 3vw, 44px); padding: clamp(22px, 3.4vw, 44px) 0; text-decoration: none; }
.renglon-num { font: var(--peso-etiqueta) 13px/1 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); color: var(--c-suave-sobre-noche); }
.renglon-nombre { display: block; font: var(--peso-gigante) var(--t-grande)/.9 var(--f-titulo); letter-spacing: var(--espacio-gigante); text-transform: uppercase; transition: color .35s, transform .45s var(--curva); }
.renglon-desc { display: block; margin-top: 12px; font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; color: var(--c-suave-sobre-noche); }
.renglon-flecha { width: clamp(40px, 5vw, 64px); height: clamp(40px, 5vw, 64px); border: 1px solid var(--c-linea-noche); border-radius: 50%; display: grid; place-items: center; transition: background-color .3s, color .3s, transform .45s var(--curva); }
.renglon-flecha svg { width: 40%; height: 40%; }
.renglon-foto { position: absolute; right: 12%; top: 50%; width: clamp(240px, 23vw, 360px); height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radio); opacity: 0; transform: translateY(-50%) rotate(4deg) scale(.9); transition: opacity .35s var(--curva), transform .5s var(--curva); pointer-events: none; z-index: 2; box-shadow: 0 30px 60px rgb(var(--rgb-sombra) / .45); }
.renglon:hover .renglon-nombre { color: var(--ev, var(--c-arena)); transform: translateX(10px); }
.renglon:hover .renglon-flecha { background: var(--ev, var(--c-arena)); color: var(--c-noche); border-color: transparent; transform: rotate(-45deg); }
@media (hover: hover) and (min-width: 1024px) { .renglon:hover .renglon-foto { opacity: 1; transform: translateY(-50%) rotate(-3deg) scale(1); } }
@media (max-width: 1023px) { .renglon-foto { display: none; } }

/* ---------- INICIO · entradas (una idea por pantalla) ---------- */
.entrada { min-height: 100svh; display: flex; align-items: center; }
.entrada .envoltura { position: relative; z-index: 2; }
.entrada-foto { position: relative; overflow: hidden; color: var(--c-blanco); align-items: flex-end; padding-block: 140px clamp(48px, 8vw, 110px); }
.entrada-foto > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.entrada-foto::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgb(var(--rgb-velo) / .86) 0%, rgb(var(--rgb-velo) / .55) 42%, rgb(var(--rgb-velo) / 0) 72%), linear-gradient(to top, rgb(var(--rgb-velo) / .7), transparent 50%); }
.entrada-foto .lead { color: rgb(var(--rgb-luz) / .84); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 1.6em 0 0; padding: 0; list-style: none; }
.chips li { padding: 10px 16px; border-radius: var(--radio-pildora); border: 1px solid currentColor; font: var(--peso-etiqueta) 12px/1 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; }
.chips .destacado { background: var(--c-arena); border-color: var(--c-arena); color: var(--c-noche); }
@media (max-width: 767px) {
  .entrada-foto { padding-top: 62svh; }
  .entrada-foto::before { background: linear-gradient(to top, rgb(var(--rgb-velo) / .94) 0%, rgb(var(--rgb-velo) / .78) 38%, rgb(var(--rgb-velo) / 0) 62%); }
}

.dona-entrada { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.contador { display: flex; align-items: baseline; gap: 14px; margin: 1.6em 0 .2em; font-family: var(--f-titulo); }
.contador b { font-weight: var(--peso-gigante); font-size: clamp(56px, 7vw, 112px); line-height: .9; letter-spacing: var(--espacio-gigante); color: var(--c-donada); }
.contador span { font-size: var(--t-chico); color: var(--c-tinta-suave); }
@media (max-width: 899px) { .dona-entrada { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Plano de la sede (Llena la sede) ---------- */
.sede { position: relative; }
.sede svg { width: 100%; height: auto; overflow: visible; }
.sede .muros { fill: none; stroke: var(--c-arena); stroke-width: 2; }
.sede .esc { fill: var(--c-arena-clara); }
.sede .pulpito { fill: var(--c-arena); }
.sede .pasillo { stroke: var(--c-arena); stroke-width: 1; stroke-dasharray: 3 5; }
.sede .puerta { fill: var(--c-fondo); }
.sede .rot, .sede .fila { font: var(--peso-fuerte) 11px var(--f-etiqueta); letter-spacing: .2em; fill: var(--c-tinta-suave); }
.sede .fila { letter-spacing: 0; font-size: 10px; }
.sede .silla { fill: transparent; stroke: var(--c-arena); stroke-width: 1.6px; cursor: pointer; transition: fill .45s var(--curva), stroke .45s; transition-delay: var(--retraso, 0s); }
.sede .silla:hover { stroke: var(--c-tinta); }
.sede .silla.llena { fill: var(--c-donada); stroke: var(--c-donada); }
.sede-leyenda { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 14px; font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: .12em; text-transform: uppercase; color: var(--c-tinta-suave); }
.sede-leyenda i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 8px; vertical-align: -1px; border: 1.6px solid var(--c-arena); }
.sede-leyenda .l-llena i { background: var(--c-donada); border-color: var(--c-donada); }
.globo { position: fixed; z-index: 60; pointer-events: none; padding: 10px 14px; border-radius: 10px; background: var(--c-tinta); color: var(--c-fondo); font: var(--peso-etiqueta) 13px/1.3 var(--f-texto); box-shadow: 0 10px 30px rgb(var(--rgb-sombra) / .25); transform: translate(-50%, calc(-100% - 12px)); opacity: 0; transition: opacity .15s; white-space: nowrap; }
.globo.ver { opacity: 1; }

/* ---------- Ficha (Visítanos) ---------- */
.ficha { background: var(--c-papel); border-radius: var(--radio); padding: clamp(24px, 3.4vw, 48px); }
.ficha-fila { display: grid; grid-template-columns: 11em 1fr; gap: 6px 24px; padding: 22px 0; border-top: 1px solid var(--c-linea); }
.ficha-fila:first-child { border-top: 0; padding-top: 0; }
.ficha-fila dt { font: var(--peso-etiqueta) 12px/1.6 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; color: var(--c-tinta-suave); }
.ficha-fila dd { margin: 0; font: var(--peso-texto) var(--t-chico)/1.4 var(--f-titulo); }
.ficha-fila dd a { text-underline-offset: 4px; }
.ficha-fila dd .boton { margin-top: 14px; font-size: 12px; min-height: 44px; }
.ficha-fila .nota { display: block; font: var(--peso-texto) 14px/1.5 var(--f-texto); color: var(--c-tinta-suave); margin-top: 6px; }
@media (max-width: 640px) { .ficha-fila { grid-template-columns: minmax(0, 1fr); } }
.visita-mini { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
@media (max-width: 899px) { .visita-mini { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Pie con el nombre enorme ---------- */
.pie { background: var(--c-noche); color: var(--c-claro-sobre-noche); padding-top: clamp(64px, 8vw, 120px); overflow: hidden; }
.pie-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px 28px; }
.pie-cols p { margin: 0 0 .6em; color: var(--c-suave-sobre-noche); font-size: 15px; }
.pie-cols a { color: var(--c-claro-sobre-noche); text-decoration: none; display: inline-block; margin-bottom: .5em; font-size: 15px; }
.pie-cols a:hover { color: var(--c-arena); }
.pie-cols .etiqueta { color: var(--c-arena); }
.pie-nombre { display: block; width: max-content; margin-inline: auto; font: var(--peso-gigante) 16.2vw/.78 var(--f-titulo); letter-spacing: -.045em; text-transform: uppercase; white-space: nowrap; text-align: center; margin-top: clamp(48px, 7vw, 100px); transform: translateY(8%); color: var(--c-claro-sobre-noche); }
.pie-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-block: 18px 22px; border-top: 1px solid var(--c-linea-noche); font: var(--peso-etiqueta) 11px/1.5 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-suave-sobre-noche); position: relative; z-index: 1; background: var(--c-noche); }
@media (max-width: 899px) { .pie-cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .pie-cols { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Galería «una foto a la vez» ---------- */
.hojear { position: relative; }
.hojear-escena { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 14px; }
.hojear figure { margin: 0; }
.hojear img { width: 100%; height: auto; border-radius: var(--radio); }
.hojear figcaption { font: var(--peso-etiqueta) 11px/1.4 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; margin-top: 8px; color: var(--c-tinta-suave); }
.noche .hojear figcaption { color: var(--c-suave-sobre-noche); }
.hojear-fondo, .hojear-info { display: none; }
.js-listo .hojear.vivo { height: calc(var(--n) * var(--paso-hojear, 34svh) + 100svh); }
.js-listo .hojear.vivo .hojear-escena { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; grid-template-columns: 1fr; overflow: hidden; }
.js-listo .hojear.vivo figure { grid-area: 1 / 1; position: relative; z-index: var(--z); opacity: 0; transform: translateY(36px) scale(.94) rotate(var(--giro)); transition: opacity .45s var(--curva), transform .6s var(--curva); cursor: zoom-in; }
.js-listo .hojear.vivo figure.ver { opacity: 1; transform: rotate(var(--giro)); }
.js-listo .hojear.vivo figure.atras { transform: rotate(var(--giro)) scale(.97); }
.js-listo .hojear.vivo img { width: auto; height: auto; max-width: min(76vw, 760px); max-height: 66svh; box-shadow: 0 30px 70px rgb(var(--rgb-sombra) / .28); background: var(--c-noche-2); }
.js-listo .hojear.vivo figcaption { display: none; }
.js-listo .hojear.vivo .hojear-fondo { display: block; position: absolute; inset: 0; display: grid; place-items: center; z-index: 0; pointer-events: none; font: var(--peso-gigante) clamp(60px, 16vw, 300px)/.82 var(--f-titulo); letter-spacing: var(--espacio-gigante); text-transform: uppercase; text-align: center; color: var(--ev, var(--c-arena)); opacity: .14; padding-inline: 2vw; }
.js-listo .hojear.vivo .hojear-info { display: flex; position: absolute; z-index: 200; left: var(--margen); right: var(--margen); bottom: clamp(18px, 4vh, 40px); justify-content: space-between; align-items: flex-end; gap: 16px; font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: .16em; text-transform: uppercase; }
.hojear-cuenta b { font: var(--peso-gigante) clamp(28px, 3vw, 44px)/1 var(--f-titulo); letter-spacing: -.02em; margin-right: 6px; }
.hojear-pie { max-width: 60%; text-align: right; opacity: .8; }
@media (max-width: 767px) { .js-listo .hojear.vivo { --paso-hojear: 30svh; } .js-listo .hojear.vivo img { max-width: 86vw; max-height: 58svh; } }

/* ---------- Fila de fotos que se arrastra (sin recortar) ---------- */
.fila { display: flex; gap: clamp(10px, 1.4vw, 18px); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; padding: 4px var(--margen) 18px; margin-inline: calc(var(--margen) * -1); scrollbar-width: thin; scrollbar-color: var(--c-linea-noche) transparent; cursor: grab; }
.fila.arrastrando { cursor: grabbing; scroll-snap-type: none; }
.fila figure { margin: 0; flex: 0 0 auto; scroll-snap-align: start; }
.fila img { height: var(--alto-fila, clamp(220px, 26vw, 380px)); width: auto; border-radius: var(--radio); background: var(--c-noche-2); cursor: zoom-in; -webkit-user-drag: none; user-select: none; }
.fila figcaption { font: var(--peso-etiqueta) 11px/1.4 var(--f-etiqueta); letter-spacing: .12em; text-transform: uppercase; margin-top: 10px; max-width: 30ch; color: var(--c-suave-sobre-noche); }
.fila--chica { --alto-fila: clamp(150px, 15vw, 220px); }

/* ---------- Visor (foto grande) ---------- */
.visor { border: 0; padding: 0; margin: 0; width: 100vw; height: 100vh; max-width: none; max-height: none; background: rgb(var(--rgb-velo) / .96); color: var(--c-blanco); }
.visor::backdrop { background: rgb(var(--rgb-velo) / .9); }
.visor[open] { display: grid; grid-template-rows: 1fr auto; }
.visor figure { margin: 0; display: grid; place-items: center; padding: 64px 70px 10px; min-height: 0; }
.visor img { max-width: 100%; max-height: calc(100vh - 150px); width: auto; height: auto; object-fit: contain; border-radius: var(--radio); }
.visor figcaption { padding: 14px var(--margen) 26px; text-align: center; font: var(--peso-etiqueta) 12px/1.5 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-suave-sobre-noche); }
.visor button { position: absolute; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgb(var(--rgb-luz) / .3); background: rgb(var(--rgb-luz) / .08); color: var(--c-blanco); cursor: pointer; display: grid; place-items: center; }
.visor button svg { width: 20px; height: 20px; }
.visor-cerrar { top: 16px; right: 16px; }
.visor-ant { left: 12px; top: 50%; margin-top: -26px; }
.visor-sig { right: 12px; top: 50%; margin-top: -26px; }
@media (max-width: 767px) { .visor figure { padding: 70px 8px 6px; } .visor-ant, .visor-sig { top: auto; bottom: 14px; margin: 0; } }

/* ---------- Aviso de música ---------- */
.aviso { position: fixed; z-index: 70; left: 50%; bottom: 22px; transform: translate(-50%, calc(100% + 40px)); visibility: hidden; max-width: calc(100vw - 32px); padding: 14px 20px; border-radius: 14px; background: var(--c-tinta); color: var(--c-fondo); font: var(--peso-etiqueta) 14px/1.4 var(--f-texto); box-shadow: 0 14px 40px rgb(var(--rgb-sombra) / .3); transition: transform .5s var(--curva), visibility 0s linear .5s; text-align: center; }
.aviso.ver { transform: translate(-50%, 0); visibility: visible; transition: transform .5s var(--curva), visibility 0s; }

/* ---------- EVENTOS · la fiesta ---------- */
.pagina--noche { background: var(--c-noche); color: var(--c-claro-sobre-noche); }
.ev-portada { position: relative; min-height: 100svh; display: flex; align-items: flex-end; overflow: hidden; padding-block: 150px clamp(40px, 7vw, 96px); }
.ev-mosaico { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 1fr; gap: 4px; z-index: 0; animation: mosaico 26s ease-in-out infinite alternate; }
.ev-mosaico img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); }
.ev-portada::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, var(--c-noche) 4%, rgb(var(--rgb-noche) / .62) 46%, rgb(var(--rgb-noche) / .5)); }
@keyframes mosaico { to { transform: scale(1.06); } }
.ev-portada .envoltura { position: relative; z-index: 2; }
.ev-portada .gigante { color: var(--c-arena); margin-left: -.04em; }
.ev-portada .lead { color: rgb(var(--rgb-claro) / .86); margin-top: 1.2em; }
@media (max-width: 767px) { .ev-mosaico { grid-template-columns: repeat(2, 1fr); } .ev-mosaico img:nth-child(n+9) { display: none; } }

.cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--c-linea-noche); }
.cifra { padding: clamp(24px, 3vw, 40px) clamp(10px, 1.6vw, 24px) 0 0; }
.cifra b { display: block; font: var(--peso-gigante) clamp(64px, 9vw, 150px)/.85 var(--f-titulo); letter-spacing: var(--espacio-gigante); color: var(--ev, var(--c-arena)); }
.cifra b small { font-size: .32em; letter-spacing: 0; margin-left: .15em; }
.cifra span { display: block; margin-top: 14px; font: var(--peso-etiqueta) 12px/1.5 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-suave-sobre-noche); }
@media (max-width: 767px) { .cifras { grid-template-columns: 1fr 1fr; gap: 0 14px; } }

.ev-destacado { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: clamp(32px, 6vw, 96px); align-items: center; }
.ev-destacado .vid { aspect-ratio: 9 / 16; max-height: 82svh; margin-inline: auto; }
@media (max-width: 899px) { .ev-destacado { grid-template-columns: minmax(0, 1fr); } .ev-destacado .vid { width: min(100%, 420px); } }

.ev { --ev: var(--c-arena); padding-block: var(--aire) 0; border-top: 1px solid var(--c-linea-noche); }
.ev--reyes { --ev: var(--c-ev-reyes); }
.ev--herederos { --ev: var(--c-ev-herederos); }
.ev--reborn { --ev: var(--c-ev-reborn); }
.ev-cab { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.ev-num { font: var(--peso-etiqueta) 13px/1 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); color: var(--ev); margin-bottom: 18px; display: block; }
.ev-titulo { font: var(--peso-gigante) clamp(56px, 12.6vw, 230px)/.8 var(--f-titulo); letter-spacing: var(--espacio-gigante); text-transform: uppercase; color: var(--ev); margin-left: -.05em; overflow-wrap: break-word; }
.ev-titulo--largo { font-size: clamp(50px, 10.6vw, 196px); }
.ev-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); margin-top: clamp(28px, 4vw, 56px); align-items: start; }
.ev-intro .medio { color: var(--c-claro-sobre-noche); font-family: var(--f-titulo); font-weight: var(--peso-ligero); }
.ev-intro p { color: var(--c-suave-sobre-noche); }
.ev-intro .chips { color: var(--ev); margin-top: 0; }
@media (max-width: 899px) { .ev-intro { grid-template-columns: minmax(0, 1fr); } }

.ev--reborn .edicion { scroll-margin-top: 200px; }
.edicion { padding-block: clamp(56px, 8vw, 120px) 0; }
.edicion-cab { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px clamp(20px, 4vw, 56px); align-items: end; margin-bottom: clamp(24px, 3vw, 40px); }
.edicion-anio { font: var(--peso-gigante) clamp(72px, 12vw, 200px)/.78 var(--f-titulo); letter-spacing: -.05em; color: transparent; -webkit-text-stroke: 1.5px var(--ev); }
.edicion-cab h3 { font-size: var(--t-medio); text-transform: uppercase; letter-spacing: .02em; }
.edicion-cab .meta { margin: .8em 0 0; font: var(--peso-etiqueta) 12px/1.6 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-suave-sobre-noche); }
.edicion-cab .meta span + span::before { content: "·"; margin: 0 .7em; }
.edicion-frase { font-size: 17px; color: var(--c-suave-sobre-noche); max-width: 44em; margin: 1em 0 0; }
.edicion .cita { margin: clamp(20px, 3vw, 36px) 0 clamp(24px, 3vw, 40px); padding-left: 20px; border-left: 2px solid var(--ev); color: var(--c-claro-sobre-noche); }
@media (max-width: 640px) { .edicion-cab { grid-template-columns: minmax(0, 1fr); } }
.sub-tit { font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; color: var(--ev, var(--c-arena)); margin: clamp(30px, 4vw, 48px) 0 16px; }
.videos-fila { display: grid; gap: clamp(48px, 7vw, 110px); }   /* un video por pantalla, en zigzag: al bajar suena el siguiente */
.videos-fila figure { margin: 0; display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: clamp(22px, 4vw, 64px); align-items: center; }
.videos-fila figure:nth-child(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 400px); }
.videos-fila figure:nth-child(even) .vid { order: 2; }
.videos-fila .vid { aspect-ratio: 9 / 16; width: 100%; max-height: 80svh; margin-inline: auto; }
.videos-fila .vid--ancho { aspect-ratio: 16 / 9; max-height: none; }
.videos-fila figure:has(.vid--ancho) { grid-template-columns: minmax(0, 760px) minmax(0, 1fr); }
.vid-texto .vid-cap { margin-top: 0; font-size: 13px; color: var(--ev, var(--c-arena)); }
@media (max-width: 767px) { .videos-fila figure, .videos-fila figure:nth-child(even), .videos-fila figure:has(.vid--ancho) { grid-template-columns: minmax(0, 1fr); } .videos-fila figure:nth-child(even) .vid { order: 0; } .videos-fila .vid { width: min(100%, 360px); } .videos-fila .vid--ancho { width: 100%; } }
.videos-fila .cita { font-size: var(--t-chico); margin: 14px 0 0; padding: 0; border: 0; color: var(--c-claro-sobre-noche); }
.linea-anios { --k: 0; --cy: 26px; position: sticky; top: 84px; z-index: 20; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: 760px; margin: clamp(36px, 5vw, 64px) auto 0; padding: 10px 8px 8px; border-radius: 22px; background: rgb(var(--rgb-noche) / .82); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid var(--c-linea-noche); }
.linea-anios::before { content: ""; position: absolute; left: 10%; right: 10%; top: calc(10px + var(--cy)); height: 1px; background: rgb(var(--rgb-arena) / .42); }
.linea-luz { position: absolute; left: 10%; top: calc(9px + var(--cy)); width: calc(var(--k) * 20%); height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--c-arena-clara), var(--c-arena)); box-shadow: 0 0 16px rgb(var(--rgb-arena) / .7); pointer-events: none; transition: width .8s var(--curva); }
.anio { position: relative; z-index: 1; display: grid; justify-items: center; gap: 3px; min-height: 44px; text-decoration: none; color: rgb(var(--rgb-claro) / .74); -webkit-tap-highlight-color: transparent; }
.aros-caja { display: grid; place-items: center; height: calc(var(--cy) * 2); }
.aros { display: block; width: 2.9rem; height: auto; overflow: visible; transition: transform .8s var(--curva), filter .4s; }
.aros .f { fill: var(--c-noche); }
.aros .a { fill: none; stroke: rgb(var(--rgb-arena) / .62); stroke-width: 1.7; transition: stroke .4s, fill .4s; }
.anio-mayor .aros { width: 3.5rem; }
.anio-n { font: var(--peso-etiqueta) clamp(17px, 1.8vw, 22px)/1.1 var(--f-titulo); transition: color .3s; }
.anio-mayor .anio-n { font-size: clamp(20px, 2.3vw, 28px); }
.anio-f { font: var(--peso-etiqueta) 10px/1.2 var(--f-etiqueta); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; color: rgb(var(--rgb-claro) / .5); }
.anio.activa { color: var(--c-blanco); }
.anio.activa .anio-n { color: var(--c-arena); }
.anio.activa .aros { transform: rotate(-24deg) scale(1.14); filter: drop-shadow(0 0 10px rgb(var(--rgb-arena) / .55)); }
.anio.activa .aros .a { fill: rgb(var(--rgb-arena) / .2); stroke: var(--c-arena); stroke-width: 2.1; }
@media (hover: hover) { .anio:hover .aros { transform: rotate(-12deg); } .anio.activa:hover .aros { transform: rotate(-30deg) scale(1.16); } }
@media (max-width: 1023px) { .linea-anios { top: 82px; --cy: 20px; } .aros { width: 2.3rem; } .anio-mayor .aros { width: 2.8rem; } }
@media (max-width: 640px) { .anio-f { display: none; } .linea-anios { padding-inline: 2px; } }
.recuerdos { padding-block: clamp(48px, 7vw, 100px) 0; }
.ev-fin { height: var(--aire); }

/* ---------- HEREDEROS ---------- */
.her-portada { position: relative; min-height: 100svh; display: flex; align-items: flex-end; color: var(--c-blanco); overflow: hidden; padding-block: 150px clamp(40px, 7vw, 96px); background: var(--c-noche); }
.her-portada > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 74% 38%; transform: scale(1.08); }
.her-portada::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgb(var(--rgb-velo) / .88), rgb(var(--rgb-velo) / .4) 52%, rgb(var(--rgb-velo) / .1)), linear-gradient(to top, rgb(var(--rgb-velo) / .8), transparent 55%); }
.her-portada .envoltura { position: relative; z-index: 2; }
.her-portada .gigante { margin-left: -.05em; }
.her-portada .lead { color: rgb(var(--rgb-luz) / .86); margin-top: 1.4em; }
@media (max-width: 767px) {
  .her-portada { padding-top: 56svh; }
  .her-portada > img { height: 70svh; object-position: 68% 30%; transform: none; }
  .her-portada::before { background: linear-gradient(to top, var(--c-noche) 32%, rgb(var(--rgb-noche) / .55) 52%, rgb(var(--rgb-noche) / 0) 72%); }
}
.her-hijos { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.trio { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.trio img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radio); aspect-ratio: 4 / 5; }
.trio figure { margin: 0; }
.trio figure:first-child { grid-row: span 2; }
.trio figure:first-child img { aspect-ratio: auto; height: 100%; }
@media (max-width: 899px) { .her-hijos { grid-template-columns: minmax(0, 1fr); } }
.horario { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); }
.horario > div:last-child { max-width: 46em; }
.horario .gigante { color: var(--c-arena); }
.horario-dato { font: var(--peso-ligero) var(--t-frase)/1.05 var(--f-titulo); margin: .2em 0 0; }
@media (max-width: 899px) { .horario { grid-template-columns: minmax(0, 1fr); } }
.video-ancho .vid { aspect-ratio: 16 / 9; }
.mosaico { columns: 4 240px; column-gap: 14px; margin-top: 28px; }
.mosaico figure { margin: 0 0 14px; break-inside: avoid; }
.mosaico img { width: 100%; height: auto; border-radius: var(--radio); cursor: zoom-in; }
.mosaico figcaption { font: var(--peso-etiqueta) 11px/1.4 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; margin-top: 8px; color: var(--c-tinta-suave); }
details.todas > summary { list-style: none; cursor: pointer; display: inline-flex; }
details.todas > summary::-webkit-details-marker { display: none; }
.tarjetas3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); margin-top: clamp(28px, 4vw, 56px); }
.tarjeta-foto { position: relative; display: block; overflow: hidden; border-radius: var(--radio); aspect-ratio: 4 / 3; color: var(--c-blanco); text-decoration: none; background: var(--c-noche); }
.tarjeta-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--curva); }
.tarjeta-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(var(--rgb-velo) / .78), transparent 55%); }
.tarjeta-foto span { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 18px; font: var(--peso-gigante) clamp(24px, 2.4vw, 36px)/1 var(--f-titulo); text-transform: uppercase; letter-spacing: -.01em; }
.tarjeta-foto span small { display: block; font: var(--peso-etiqueta) 11px/1.4 var(--f-etiqueta); letter-spacing: .16em; margin-bottom: 8px; color: var(--c-arena); }
.tarjeta-foto:hover img { transform: scale(1.05); }
@media (max-width: 767px) { .tarjetas3 { grid-template-columns: minmax(0, 1fr); } .tarjeta-foto { aspect-ratio: 4 / 3; } }
.banda-foto { position: relative; min-height: 88svh; display: flex; align-items: flex-end; color: var(--c-blanco); overflow: hidden; padding-block: 120px clamp(40px, 7vw, 96px); }
.banda-foto > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.banda-foto::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgb(var(--rgb-velo) / .86), rgb(var(--rgb-velo) / .2) 70%); }
.banda-foto .envoltura { position: relative; z-index: 2; }
.banda-foto .gigante { color: var(--c-ev-reborn); margin-left: -.05em; }
.banda-foto .lead { color: rgb(var(--rgb-luz) / .86); }

/* ---------- DONA ---------- */
.dona-portada { position: relative; min-height: 100svh; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: stretch; }
.dona-portada-texto { padding: 160px var(--margen) clamp(48px, 7vw, 96px); display: flex; flex-direction: column; justify-content: flex-end; }
.dona-portada-foto { position: relative; overflow: hidden; }
.dona-portada-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
@media (max-width: 899px) { .dona-portada { grid-template-columns: minmax(0, 1fr); } .dona-portada-foto { order: -1; height: 46svh; } .dona-portada-texto { padding-top: 40px; } }
.cifras-silla { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: clamp(26px, 3vw, 44px); margin-top: clamp(28px, 4vw, 48px); }
.cifras-silla--una { grid-template-columns: minmax(0, 1fr); margin-top: 0; }
.cifra-silla { padding: 18px 0 0; border-top: 2px solid var(--c-tinta); }
.cifra-silla b { display: block; font: var(--peso-gigante) clamp(44px, 4.6vw, 76px)/.95 var(--f-titulo); letter-spacing: -.02em; white-space: nowrap; }
.cifra-silla b small { font-size: .38em; letter-spacing: .02em; margin-left: .1em; color: var(--c-tinta-suave); }
.cifra-silla:nth-child(2) b > span { color: var(--c-donada); }
.cifras-silla--una .cifra-silla b > span { color: var(--c-donada); }
.cifra-silla > span { display: block; margin-top: 12px; font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: .16em; text-transform: uppercase; color: var(--c-tinta-suave); }
@media (max-width: 560px) { .cifras-silla { grid-template-columns: minmax(0, 1fr); gap: 26px; } }
.destino { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.destino-modelo { background: radial-gradient(ellipse at 50% 85%, var(--c-arena-clara), transparent 62%); border-radius: var(--radio); padding: clamp(18px, 3vw, 40px); }
.destino-modelo img { width: 100%; height: auto; filter: drop-shadow(0 24px 24px rgb(var(--rgb-sombra) / .22)); }
.destino-modelo figcaption { text-align: center; font: var(--peso-etiqueta) 12px/1.5 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-tinta-suave); margin-top: 12px; }
@media (max-width: 899px) { .destino { grid-template-columns: minmax(0, 1fr); } }
.sede-grande { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
@media (max-width: 899px) { .sede-grande { grid-template-columns: minmax(0, 1fr); } }
.gracias { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.gracias li { padding: 9px 14px; border-radius: var(--radio-pildora); background: var(--c-papel); font: var(--peso-etiqueta) 14px/1 var(--f-titulo); }
.donar { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); }
@media (max-width: 899px) { .donar { grid-template-columns: minmax(0, 1fr); } }
.pasos { list-style: none; margin: 28px 0 0; padding: 0; counter-reset: paso; }
.pasos li { counter-increment: paso; display: grid; grid-template-columns: 56px 1fr; gap: 14px; padding: 18px 0; border-top: 1px solid var(--c-linea); font-size: 17px; }
.pasos li::before { content: counter(paso, decimal-leading-zero); font: var(--peso-gigante) 30px/1 var(--f-titulo); color: var(--c-arena); }
.montos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.monto { position: relative; text-align: left; padding: 22px 18px 18px; border-radius: var(--radio); background: var(--c-papel); border: 1.5px solid transparent; cursor: pointer; transition: border-color .2s, transform .25s var(--curva); }
.monto:hover { transform: translateY(-2px); }
.monto[aria-checked="true"] { border-color: var(--c-tinta); }
.monto b { display: block; font: var(--peso-gigante) 30px/1 var(--f-titulo); letter-spacing: -.02em; }
.monto > span:not(.sello) { display: block; margin-top: 8px; font: var(--peso-etiqueta) 12px/1.3 var(--f-etiqueta); letter-spacing: .12em; text-transform: uppercase; color: var(--c-tinta-suave); }
.monto .sello { position: absolute; top: -9px; left: 14px; padding: 4px 9px; border-radius: var(--radio-pildora); background: var(--c-arena); color: var(--c-noche); font-size: 10px; margin: 0; letter-spacing: .14em; }
.monto-libre { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.monto-libre label { display: flex; align-items: center; gap: 6px; font: var(--peso-etiqueta) 22px/1 var(--f-titulo); }
.monto-libre input { width: 6em; min-width: 0; font: var(--peso-etiqueta) 22px/1 var(--f-titulo); border: 0; border-bottom: 1.5px solid var(--c-linea); background: transparent; padding: 6px 2px; color: inherit; }
.campo { margin-top: 26px; }
.campo label { display: block; font: var(--peso-etiqueta) 12px/1.4 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-tinta-suave); margin-bottom: 8px; }
.campo input[type=text] { width: 100%; font: var(--peso-texto) 19px/1.3 var(--f-texto); padding: 14px 16px; border-radius: var(--radio); border: 1.5px solid var(--c-linea); background: var(--c-papel); color: inherit; }
.campo input[type=text]:disabled { opacity: .5; }
.check { display: inline-flex; align-items: center; gap: 10px; margin-top: 12px; font-size: 15px; cursor: pointer; }
.check input { width: 20px; height: 20px; accent-color: var(--c-tinta); }
.error { color: var(--c-error); font-size: 14px; margin: 8px 0 0; }
.nota { font-size: 14px; color: var(--c-tinta-suave); margin: 10px 0 0; }
.elegido { margin: 26px 0 0; font: var(--peso-texto) var(--t-chico)/1.3 var(--f-titulo); }
.formas { display: grid; gap: 10px; margin-top: 18px; }
.forma { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; padding: 20px; border-radius: var(--radio); background: var(--c-papel); border: 1.5px solid var(--c-linea); text-decoration: none; text-align: left; cursor: pointer; width: 100%; color: inherit; transition: transform .25s var(--curva), border-color .2s; }
.forma:hover { transform: translateY(-2px); }
.forma--principal { border-color: var(--c-tinta); }
.forma[aria-disabled="true"] { cursor: not-allowed; opacity: .62; transform: none; }
.forma-ico { width: 52px; height: 52px; border-radius: 12px; display: grid; place-items: center; background: var(--c-fondo); font: var(--peso-texto-fuerte) 12px/1 var(--f-titulo); letter-spacing: .06em; }
.forma b { display: block; font: var(--peso-etiqueta) 19px/1.2 var(--f-titulo); }
.forma small { display: block; color: var(--c-tinta-suave); font-size: 14px; margin-top: 4px; }
.forma .sello { display: inline-block; padding: 3px 8px; border-radius: var(--radio-pildora); background: var(--c-arena); color: var(--c-noche); font: var(--peso-fuerte) 10px/1.3 var(--f-etiqueta); letter-spacing: .12em; text-transform: uppercase; margin-bottom: 6px; }
.forma-estado { font: var(--peso-fuerte) 11px/1 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; padding: 9px 12px; border-radius: var(--radio-pildora); border: 1px solid var(--c-linea); white-space: nowrap; }
.caja-spei { margin-top: 10px; padding: 22px; border-radius: var(--radio); background: var(--c-papel); border: 1.5px dashed var(--c-tinta); }
.caja-spei dl { display: grid; grid-template-columns: 9em 1fr; gap: 10px 16px; margin: 0; }
.caja-spei dt { font: var(--peso-etiqueta) 12px/1.6 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; color: var(--c-tinta-suave); }
.caja-spei dd { margin: 0; font: var(--peso-etiqueta) 18px/1.4 var(--f-titulo); }
.pronto { margin-top: 18px; padding: 16px 18px; border-radius: var(--radio); background: var(--c-arena-clara); font: var(--peso-etiqueta) 15px/1.4 var(--f-texto); }
.donar-listo .pronto { display: none; }
.wa { margin-top: 20px; }
.desde { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: clamp(28px, 4vw, 48px); }
.desde > div { background: var(--c-noche-2); border-radius: var(--radio); padding: clamp(22px, 3vw, 40px); }
.desde h3 { font: var(--peso-gigante) clamp(30px, 3.4vw, 52px)/1 var(--f-titulo); text-transform: uppercase; color: var(--c-arena); }
.desde .medio { margin: .4em 0 1em; color: var(--c-claro-sobre-noche); }
.desde p { color: var(--c-suave-sobre-noche); }
@media (max-width: 767px) { .desde { grid-template-columns: minmax(0, 1fr); } .montos { grid-template-columns: 1fr 1fr; } .monto:first-child { grid-column: span 2; } }

/* ---------- CONTACTO / VISÍTANOS ---------- */
.vis-portada { padding: 170px 0 clamp(40px, 6vw, 80px); }
.vis-ficha { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(20px, 3vw, 40px); align-items: stretch; }
.vis-ficha figure { margin: 0; position: relative; min-height: 420px; }
.vis-ficha figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--radio); }
@media (max-width: 899px) { .vis-ficha { grid-template-columns: minmax(0, 1fr); } .vis-ficha figure { min-height: 300px; } }
.redes3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.red { display: block; padding: clamp(22px, 3vw, 36px); border-radius: var(--radio); background: var(--c-noche-2); color: var(--c-claro-sobre-noche); text-decoration: none; transition: transform .25s var(--curva); }
.red:hover { transform: translateY(-3px); }
.red small { display: block; font: var(--peso-etiqueta) 11px/1.4 var(--f-etiqueta); letter-spacing: .16em; text-transform: uppercase; color: var(--c-arena); margin-bottom: 14px; }
.red b { display: block; font: var(--peso-gigante) clamp(24px, 2.4vw, 36px)/1 var(--f-titulo); text-transform: uppercase; letter-spacing: -.01em; }
.red span { display: block; margin-top: 10px; color: var(--c-suave-sobre-noche); font-size: 15px; }
@media (max-width: 767px) { .redes3 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Movimiento reducido: todo quieto y visible ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
  .js-listo .rv:not(.visto), .js-listo [data-cascada]:not(.visto) > * { opacity: 1; transform: none; }
  .menu-enlaces a, .menu-pie, .menu-nombre { opacity: 1 !important; transform: none !important; filter: none !important; }
}
html.quieto .rv, html.quieto [data-cascada] > * { opacity: 1 !important; transform: none !important; }

/* ---------- Ajustes de celular angosto ---------- */
@media (max-width: 480px) {
  .boton { white-space: normal; text-align: center; line-height: 1.25; padding-block: 12px; }
  .forma { gap: 12px; padding: 16px 14px; grid-template-columns: auto minmax(0, 1fr); }
  .forma-estado { grid-column: 2; justify-self: start; }
  .forma-ico { width: 44px; height: 44px; }
  .caja-spei dl { grid-template-columns: minmax(0, 1fr); }
}
.ev-cartel { margin: clamp(24px, 3vw, 40px) 0 0; width: min(100%, 300px); transform: rotate(-2deg); transition: transform .5s var(--curva); }
.ev-cartel:hover { transform: rotate(0) scale(1.02); }
.ev-cartel img { width: 100%; height: auto; border-radius: var(--radio); box-shadow: 0 30px 60px rgb(var(--rgb-sombra) / .5); }

/* =====================================================================
   22/10 · Galerías A (arco), B (carrusel con años) y C (diapositiva central). Fondo negro, títulos en Jost.
   ===================================================================== */
/* ---------- A · arco de fotos alrededor del título (Inicio) ---------- */
.arco { position: relative; min-height: 100svh; overflow: hidden; display: grid; place-items: center; padding-block: 0; }
.arco-fotos { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 120px var(--margen) 0; }
.arco-foto { margin: 0; width: 110px; aspect-ratio: 1; }
.arco-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radio-galeria); box-shadow: 0 14px 34px rgb(var(--rgb-sombra) / .6); }
.arco-centro { position: relative; z-index: 2; text-align: center; max-width: 640px; padding: 40px var(--margen) 120px; }
.arco-centro .etiqueta { justify-content: center; }
.arco-centro .lead { margin-inline: auto; }
.arco-girar { display: none; }
.arco.vivo { display: block; }
.arco.vivo .arco-fotos { position: absolute; inset: 0; display: block; padding: 0; }
.arco.vivo .arco-foto { position: absolute; left: 0; top: 0; width: var(--t, 124px); transform: translate(var(--x), var(--y)) rotate(var(--rot)); opacity: var(--op, 1);
  transition: transform .9s var(--curva), opacity .5s ease; will-change: transform; }
.arco.vivo .arco-foto.salta { transition: none; }
.arco.vivo:not(.listo) .arco-foto { transform: translate(var(--cx0), var(--cy0)) rotate(0) scale(.4); opacity: 0; }
.arco.vivo.listo .arco-foto { transition-delay: calc(var(--orden, 0) * 60ms), 0s; }
.arco.vivo.girado .arco-foto { transition-delay: 0s; }
.arco.vivo .arco-centro { position: absolute; left: 50%; top: var(--centro-y, 58%); transform: translate(-50%, -50%); width: min(640px, 100%); padding: 0 var(--margen); }
.arco.vivo .arco-girar { display: grid; place-items: center; position: absolute; z-index: 3; right: var(--margen); top: var(--girar-y, 47%); width: 72px; height: 72px; border-radius: 50%; border: 1px solid var(--c-linea-noche); background: var(--c-noche-2); color: var(--c-claro-sobre-noche); cursor: pointer; transition: transform .35s var(--curva), background-color .25s; }
.arco-girar svg { width: 26px; height: 26px; }
.arco-girar:hover { transform: rotate(-20deg); background: var(--c-arena); color: var(--c-noche); }
@media (max-width: 767px) { .arco.vivo .arco-girar { width: 56px; height: 56px; top: auto; bottom: 26px; right: 50%; transform: translateX(50%); } .arco.vivo .arco-girar:hover { transform: translateX(50%) rotate(-20deg); } }

/* ---------- C · diapositiva central con laterales asomando (Congreso Herederos) ---------- */
.cs { position: relative; margin-top: clamp(32px, 4vw, 56px); outline: none; }
.cs:focus-visible { outline: 2px solid var(--c-arena); outline-offset: 6px; }
.cs-pista { list-style: none; margin: 0; padding: 0 var(--margen); display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; }
.cs-item { flex: 0 0 min(86vw, 760px); scroll-snap-align: center; }
.cs-item figure { position: relative; margin: 0; aspect-ratio: 3 / 2; border-radius: var(--radio-galeria); overflow: hidden; }
.cs-item img { width: 100%; height: 100%; object-fit: cover; }
.cs-item figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 60px 24px 22px; text-align: center; background: linear-gradient(to top, rgb(var(--rgb-velo) / .82), transparent); color: var(--c-blanco); }
.cs-item figcaption b { display: block; font: var(--peso-fuerte) clamp(22px, 2.4vw, 32px)/1.1 var(--f-titulo); text-transform: uppercase; letter-spacing: .01em; }
.cs-item figcaption span { font: var(--peso-texto) 15px/1.4 var(--f-texto); opacity: .9; }
.cs-ant, .cs-sig, .cs-puntos { display: none; }
.cs.vivo .cs-pista { display: block; position: relative; overflow: hidden; height: var(--alto-cs, 520px); padding: 0; touch-action: pan-y; }
.cs.vivo .cs-item { position: absolute; left: 50%; top: 50%; width: var(--ancho-cs, 760px); transform: translate(-50%, -50%) translateX(var(--x, 0px)) scale(var(--s, 1)); opacity: var(--op, 1); z-index: var(--z, 1); transition: transform .6s var(--curva), opacity .5s ease; }
.cs.vivo .cs-item:not(.centro) { cursor: pointer; }
.cs.vivo .cs-item:not(.centro) figcaption { opacity: 0; }
.cs.vivo .cs-item.centro figure { box-shadow: 0 30px 80px rgb(var(--rgb-sombra) / .6); }
.cs.vivo .cs-ant, .cs.vivo .cs-sig { display: grid; place-items: center; position: absolute; z-index: 20; top: 50%; width: 52px; height: 52px; margin-top: -26px; border-radius: 50%; border: 0; background: var(--c-blanco); color: var(--c-noche); cursor: pointer; box-shadow: 0 8px 24px rgb(var(--rgb-sombra) / .4); transition: transform .25s var(--curva); }
.cs.vivo .cs-ant:hover, .cs.vivo .cs-sig:hover { transform: scale(1.08); }
.cs-ant svg, .cs-sig svg { width: 22px; height: 22px; }
.cs.vivo .cs-ant { left: calc(50% - var(--ancho-cs, 760px) / 2 - 26px); }
.cs.vivo .cs-sig { right: calc(50% - var(--ancho-cs, 760px) / 2 - 26px); }
.cs.vivo .cs-puntos { display: flex; justify-content: center; gap: 10px; margin-top: 22px; }
.cs-punto { width: 11px; height: 11px; padding: 0; border-radius: 50%; border: 1px solid var(--c-blanco); background: transparent; cursor: pointer; }
.cs-punto[aria-current="true"] { background: var(--c-blanco); }
@media (max-width: 767px) { .cs.vivo .cs-ant { left: 6px; } .cs.vivo .cs-sig { right: 6px; } }

/* ---------- Bloques nuevos de Inicio y Eventos ---------- */
.franja-sillas-caja { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
@media (max-width: 899px) { .franja-sillas-caja { grid-template-columns: minmax(0, 1fr); } }
.franja-sillas .cifras-silla { margin-top: 0; }
.ficha-una { font: var(--peso-texto) var(--t-chico)/1.45 var(--f-titulo); margin: 0; }
.ev-portada--carteles { min-height: auto; padding-top: 170px; }
.ev-carteles { display: flex; flex-wrap: wrap; gap: clamp(14px, 3vw, 36px); margin-top: clamp(32px, 5vw, 64px); }
.ev-carteles .ev-cartel { width: clamp(150px, 22vw, 290px); margin: 0; }
.ev-carteles .ev-cartel:nth-child(2) { transform: rotate(2deg) translateY(18px); }
.ev-carteles .ev-cartel:nth-child(3) { transform: rotate(-1deg); }
.edicion--txt { padding-block: clamp(40px, 6vw, 80px) 0; }
.edicion--txt .boton { margin-top: 16px; color: var(--c-claro-sobre-noche); }
.trio { grid-template-columns: 1fr 1fr; }
.trio figure:first-child { grid-row: auto; grid-column: span 2; }
.trio figure:first-child img { aspect-ratio: 3 / 2; height: auto; }
.trio img { aspect-ratio: 1; }
.mosaico { margin-top: clamp(24px, 4vw, 48px); }
@media (prefers-reduced-motion: reduce) { .arco.vivo:not(.listo) .arco-foto { transform: translate(var(--x), var(--y)) rotate(var(--rot)); opacity: var(--op, 1); } }
.her-bloque { min-height: 100svh; display: flex; align-items: center; }
.her-bloque-caja { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 88px); align-items: center; }
.her-bloque-foto { margin: 0; order: 2; }
.her-bloque-foto img { width: 100%; height: auto; max-height: 78svh; object-fit: cover; aspect-ratio: 4 / 5; border-radius: var(--radio-galeria); }
.her-bloque .gigante { font-size: clamp(56px, 9.5vw, 170px); }
@media (max-width: 899px) { .her-bloque-caja { grid-template-columns: minmax(0, 1fr); } .her-bloque-foto { order: 0; } .her-bloque-foto img { max-height: 56svh; } }
.pie-cols--corto { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 560px) { .pie-cols--corto { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.arco-centro h2 { font-size: clamp(40px, 4.8vw, 76px); }

/* ---------- 22/10 · Portada elegida: negro, video a la derecha (maqueta negro-der) ---------- */
.portada2 { position: relative; min-height: 100svh; display: flex; align-items: center; padding-block: 110px 48px; }
.portada2-caja { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(32px, 5vw, 96px); align-items: center; }
.portada2-texto .etiqueta { color: var(--c-arena); }
.portada2-texto .etiqueta::before { width: 40px; }
.portada2-nombre { font: var(--peso-fuerte) clamp(72px, 10.4vw, 160px)/.9 var(--f-titulo); letter-spacing: -.01em; text-transform: uppercase; margin: .15em 0 0; color: var(--c-blanco); }
.portada2-nombre span { display: block; }
.portada2-texto .lead { margin-top: 1.6em; max-width: 30em; }
.portada2-cita { margin: clamp(32px, 6vh, 64px) 0 0; padding-left: 16px; border-left: 2px solid var(--c-arena); max-width: 38em; font: var(--peso-texto) 15px/1.6 var(--f-texto); color: var(--c-suave-sobre-noche); }
.portada2-cita cite { font-style: normal; }
.portada2-video { position: relative; margin: 0; height: min(82svh, 760px); aspect-ratio: 9 / 16; }
.portada2-video .vid { position: absolute; inset: 0; border-radius: var(--radio-galeria); box-shadow: 0 30px 70px rgb(var(--rgb-sombra) / .5); }
.portada2-etiqueta { position: absolute; z-index: 5; left: 16px; right: 16px; top: 14px; display: flex; align-items: center; gap: 10px; color: var(--c-blanco); font: var(--peso-etiqueta) 11px/1.3 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; text-shadow: 0 1px 8px rgb(var(--rgb-sombra) / .6); pointer-events: none; }
.portada2-etiqueta .aros-caja { height: 22px; }
.portada2-etiqueta .aros { width: 2.2rem; }
.portada2-etiqueta .aros .f { fill: transparent; }
.portada2-etiqueta .aros .a { stroke: var(--c-arena); }
.portada2 .vid-sonido { left: 50%; transform: translateX(-50%); bottom: 30px; min-height: 52px; white-space: nowrap; background: rgb(var(--rgb-luz) / .92); }
.portada2 .vid-barra { top: 52px; bottom: auto; right: 12px; flex-direction: column; }
@media (max-width: 899px) {
  .portada2 { padding-top: 92px; align-items: flex-start; }
  .portada2-caja { grid-template-columns: minmax(0, 1fr); gap: 34px; }
  .portada2-video { order: -1; height: auto; width: min(100%, 440px); justify-self: center; aspect-ratio: 9 / 16; max-height: 80svh; }
  .portada2-nombre { font-size: clamp(72px, 24vw, 120px); }
}
.cs-pista img, .arco img { -webkit-user-drag: none; user-select: none; }

/* ---------- 22/10 · Títulos enormes junto a foto o video: el tamaño se ajusta al ancho de SU columna (nunca se meten bajo la foto) ---------- */
.cq { container-type: inline-size; min-width: 0; }
.cq .gigante { font-size: clamp(44px, 15cqi, 280px); }
.cq .enorme { font-size: clamp(40px, 14cqi, 168px); }
.cq .grande { font-size: clamp(32px, 12cqi, 104px); }
.cq .portada2-nombre { font-size: clamp(64px, 30cqi, 170px); }
.her-bloque .cq .gigante { font-size: clamp(44px, 15cqi, 170px); }
.her-bloque-foto, .portada2-video, .dona-portada-foto, .trio, .destino-modelo { min-width: 0; }

/* ---------- REBORN · selector de años con los aros de Herederos (pestañas; restaurado de la versión 1) ---------- */
.linea-anios { --k: 0; --cy: 26px; position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: 760px; margin: clamp(40px, 6vw, 72px) auto 0; padding: 10px 8px 8px; }
.linea-anios::before { content: ""; position: absolute; left: 10%; right: 10%; top: calc(10px + var(--cy)); height: 1px; background: rgb(var(--rgb-arena) / .42); }
.linea-luz { position: absolute; left: 10%; top: calc(9px + var(--cy)); width: calc(var(--k) * 20%); height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--c-arena-clara), var(--c-arena)); box-shadow: 0 0 16px rgb(var(--rgb-arena) / .7); pointer-events: none; transition: width .8s var(--curva); }
.anio { position: relative; z-index: 1; display: grid; justify-items: center; gap: 3px; min-height: 44px; padding: 0; border: 0; background: none; cursor: pointer; color: rgb(var(--rgb-claro) / .74); -webkit-tap-highlight-color: transparent; font: inherit; }
.anio:focus-visible { outline: 2px solid var(--c-arena); outline-offset: 4px; border-radius: 12px; }
.aros-caja { display: grid; place-items: center; height: calc(var(--cy, 26px) * 2); }
.aros { display: block; width: 2.9rem; height: auto; overflow: visible; transition: transform .8s var(--curva), filter .4s; }
.aros .f { fill: var(--c-noche); }
.aros .a { fill: none; stroke: rgb(var(--rgb-arena) / .62); stroke-width: 1.7; transition: stroke .4s, fill .4s; }
.anio-mayor .aros { width: 3.5rem; }
.anio-n { font: var(--peso-etiqueta) clamp(17px, 1.8vw, 22px)/1.1 var(--f-titulo); transition: color .3s; }
.anio-mayor .anio-n { font-size: clamp(20px, 2.3vw, 28px); }
.anio-f { font: var(--peso-etiqueta) 10px/1.2 var(--f-etiqueta); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; color: rgb(var(--rgb-claro) / .5); }
.anio.activa { color: var(--c-blanco); }
.anio.activa .anio-n { color: var(--c-arena); }
.anio.activa .aros { transform: rotate(-24deg) scale(1.14); filter: drop-shadow(0 0 10px rgb(var(--rgb-arena) / .55)); }
.anio.activa .aros .a { fill: rgb(var(--rgb-arena) / .2); stroke: var(--c-arena); stroke-width: 2.1; }
@media (hover: hover) { .anio:hover .aros { transform: rotate(-12deg); } .anio.activa:hover .aros { transform: rotate(-30deg) scale(1.16); } }
@media (max-width: 1023px) { .linea-anios { --cy: 20px; } .aros { width: 2.3rem; } .anio-mayor .aros { width: 2.8rem; } }
@media (max-width: 640px) { .anio-f { display: none; } .linea-anios { padding-inline: 2px; } }
.js-listo .anio-panel[data-oculto] { display: none; }
.anio-panel.entra { animation: pagina-entra .35s var(--curva) both; }
.portada2-etiqueta .aros .f { fill: transparent; }

/* ---------- 22/10 · Cabecera de Eventos: foto a sangre, título enorme y 3 tarjetas grandes (Vous / Elevation) ---------- */
.ev-cabecera { position: relative; min-height: min(92svh, 860px); display: flex; align-items: flex-end; overflow: hidden; padding-block: 150px clamp(110px, 12vw, 190px); }
.ev-cabecera-foto { position: absolute; inset: 0; z-index: 0; }
.ev-cabecera-foto img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); animation: cabecera-lenta 22s ease-in-out infinite alternate; }
@keyframes cabecera-lenta { to { transform: scale(1); } }
.ev-cabecera::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, var(--c-noche) 0%, rgb(var(--rgb-noche) / .78) 32%, rgb(var(--rgb-noche) / .35) 65%, rgb(var(--rgb-noche) / .55) 100%); }
.ev-cabecera-texto { position: relative; z-index: 2; }
.ev-cabecera .gigante { color: var(--c-blanco); margin-left: -.05em; }
.ev-cabecera .etiqueta { color: var(--c-arena); }
.ev-cabecera-lista { margin: 1.4em 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; font: var(--peso-etiqueta) 13px/1.4 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; color: rgb(var(--rgb-claro) / .85); }
.ev-cabecera-lista i { width: 5px; height: 5px; border-radius: 50%; background: var(--c-arena); }
.ev-tarjetas-sec { position: relative; z-index: 3; margin-top: clamp(-150px, -9vw, -80px); }
.ev-tarjetas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.ev-tarjeta { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--radio-galeria); background: var(--c-noche-2); color: var(--c-blanco); text-decoration: none; box-shadow: 0 30px 60px rgb(var(--rgb-sombra) / .45); transition: transform .5s var(--curva), box-shadow .5s var(--curva); }
.ev-tarjeta img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--curva), filter .5s; }
.ev-tarjeta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(var(--rgb-velo) / .9) 0%, rgb(var(--rgb-velo) / .35) 45%, transparent 70%); }
.ev-tarjeta::before { content: ""; position: absolute; z-index: 2; left: 0; right: 0; top: 0; height: 4px; background: var(--ev); transform: scaleX(.18); transform-origin: left; transition: transform .6s var(--curva); }
.ev-tarjeta-txt { position: absolute; z-index: 2; left: clamp(18px, 2vw, 28px); right: clamp(18px, 2vw, 28px); bottom: clamp(18px, 2vw, 28px); display: grid; gap: 8px; }
.ev-tarjeta-txt small { font: var(--peso-etiqueta) 11px/1.3 var(--f-etiqueta); letter-spacing: var(--espacio-etiqueta); text-transform: uppercase; color: var(--ev); }
.ev-tarjeta-txt b { font: var(--peso-gigante) clamp(28px, 2.9vw, 46px)/.95 var(--f-titulo); letter-spacing: -.01em; text-transform: uppercase; }
.ev-tarjeta-txt > span { font: var(--peso-texto) 14px/1.4 var(--f-texto); color: rgb(var(--rgb-claro) / .85); }
.ev-tarjeta-txt em { font: var(--peso-fuerte) 12px/1 var(--f-titulo); font-style: normal; letter-spacing: .16em; text-transform: uppercase; margin-top: 6px; }
.ev-tarjeta-txt em span { display: inline-block; transition: transform .35s var(--curva); }
.ev-tarjeta:hover { transform: translateY(-6px); box-shadow: 0 40px 80px rgb(var(--rgb-sombra) / .55); }
.ev-tarjeta:hover img { transform: scale(1.06); }
.ev-tarjeta:hover::before { transform: scaleX(1); }
.ev-tarjeta:hover .ev-tarjeta-txt em span { transform: translateX(6px); }
.ev-tarjeta:focus-visible { outline: 2px solid var(--ev); outline-offset: 4px; }
@media (max-width: 899px) { .ev-tarjetas { grid-template-columns: minmax(0, 1fr); } .ev-tarjeta { aspect-ratio: 4 / 3; } .ev-cabecera { min-height: 78svh; } }
@media (prefers-reduced-motion: reduce) { .ev-cabecera-foto img { animation: none; transform: none; } }

/* ---------- 22/10 · Pulido general: mismo aire y retícula en todas las páginas ---------- */
.ev { padding-block: clamp(96px, 11vw, 160px) 0; }
.ev:first-of-type { border-top: 0; }
.edicion { padding-block: clamp(48px, 6vw, 88px) 0; }
.edicion-cab { margin-bottom: clamp(20px, 2.4vw, 32px); }
.fila { margin-top: 4px; }
.recuerdos { padding-block: clamp(48px, 6vw, 88px) 0; }
.reborn-anios { margin-top: clamp(16px, 2vw, 24px); }
.seccion + .seccion.noche, .noche + .seccion:not(.noche):not(.papel) { border-top: 0; }

/* ---------- 22/10 · Bloques de evento: texto de lectura cómoda (20–24 px, 60–70 caracteres) ---------- */
.ev-intro { grid-template-columns: minmax(0, 1fr); gap: 22px; }
.ev-intro .medio { font: var(--peso-texto) clamp(19px, 1.55vw, 23px)/1.6 var(--f-texto); max-width: 64ch; color: var(--c-claro-sobre-noche); }
.ev-intro .chips { margin-top: 0; }
.cifra b small.antes { font-size: .26em; margin: 0 .2em 0 0; letter-spacing: .08em; text-transform: uppercase; }
.sede .silla.llena { fill: var(--c-donada); stroke: var(--c-donada); }
.cab-nav, .cab-logo, .cab-musica, .cab-menu { -webkit-backdrop-filter: blur(22px) saturate(1.4); backdrop-filter: blur(22px) saturate(1.4); }

/* ---------- 22/10 · Un solo acento (arena): sobre fondo claro las cifras van en tinta y el acento queda en la raya ---------- */
.cifra-silla:nth-child(2) b > span, .cifras-silla--una .cifra-silla b > span { color: var(--c-tinta); }
.cifra-silla:nth-child(2) { border-top-color: var(--c-arena); border-top-width: 4px; }
.sede .silla { stroke: rgb(var(--rgb-tinta) / .32); }
.sede .silla.llena { fill: var(--c-arena); stroke: rgb(var(--rgb-tinta) / .55); }
.sede-leyenda i { border-color: rgb(var(--rgb-tinta) / .32); }
.sede-leyenda .l-llena i { background: var(--c-arena); border-color: rgb(var(--rgb-tinta) / .55); }
.error { font-weight: var(--peso-texto-fuerte); }
.error::before { content: "⚠ "; }
/* ---------- 22/10 · Al bajar, el encabezado lleva una banda a todo lo ancho (casi sólida) para que nada se vea encimado ---------- */
.cab::before { content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: 0; height: calc(100% + 14px); background: var(--cab-fondo, rgb(var(--rgb-noche) / .9)); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 1px 0 var(--c-linea-noche); opacity: 0; transition: opacity .35s ease; pointer-events: none; }
.cab.compacta::before { opacity: 1; }
.cab { isolation: isolate; }
/* 22/10: la banda del menú es NEGRA en todo el sitio (antes era clara en Herederos, Dona y Visítanos) */
.cifra b { font-size: clamp(54px, 6.6vw, 118px); white-space: nowrap; }
.cifras { grid-template-columns: repeat(4, minmax(0, auto)); justify-content: space-between; gap: 0 clamp(16px, 3vw, 48px); }
@media (max-width: 767px) { .cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.linea-anios { top: auto !important; position: relative; }

/* =====================================================================
   22/10 · Vuelta de las 10:00 (Brayan)
   ===================================================================== */
/* ---------- Cabecera de Eventos sin atajos: foto a sangre con paralaje suave y flecha que invita a bajar ---------- */
.ev-cabecera { min-height: 100svh; padding-bottom: clamp(90px, 12vh, 150px); }
.ev-cabecera-foto img { animation: none; transform: translateY(calc(var(--p, 0) * 60px)) scale(1.1); transition: transform .1s linear; }
.ev-cabecera-texto .gigante { font-size: clamp(72px, 17vw, 300px); }
.ev-cabecera-baja { position: absolute; z-index: 3; left: 50%; bottom: 28px; transform: translateX(-50%); width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgb(var(--rgb-luz) / .35); border-radius: 50%; color: var(--c-arena); }
.ev-cabecera-baja svg { width: 20px; height: 20px; animation: baja 2s var(--curva) infinite; }
#eventos-cifras { padding-top: clamp(72px, 9vw, 120px); }

/* ---------- Bloques de evento en dos columnas: título enorme de un lado y texto del otro ---------- */
.ev-dos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 96px); align-items: center; }
.ev-dos-titulo { position: relative; }
.ev-dos .ev-titulo { margin: 0; transform: translateY(calc((.5 - var(--p, .5)) * 46px)); }
.ev-dos .ev-num { margin-bottom: 14px; }
.ev-dos-texto .medio { font: var(--peso-texto) clamp(19px, 1.5vw, 23px)/1.6 var(--f-texto); max-width: 62ch; color: var(--c-claro-sobre-noche); margin: 0 0 1.1em; }
.ev-dos-texto .chips { color: var(--c-arena); margin: 0; }
.ev-dos-nota { margin: 1.1em 0 0; color: var(--c-suave-sobre-noche); }
/* REBORN: letra por letra, de abajo hacia arriba, con una raya dorada que crece al bajar */
.ev-dos--reborn .ev-titulo { font-size: clamp(64px, 23cqi, 250px); line-height: .82; letter-spacing: -.04em; color: var(--c-arena); }
.letras span { display: inline-block; transition: transform .9s var(--curva), opacity .6s ease; transition-delay: calc(var(--i) * 70ms + 80ms); }
.js-listo .letras:not(.visto) span { opacity: 0; transform: translateY(.45em) rotate(7deg); }
.js-listo .letras.rv:not(.visto) { opacity: 1; transform: none; }
.ev-dos-raya { display: block; height: 3px; margin-top: 18px; background: linear-gradient(90deg, var(--c-arena), rgb(var(--rgb-arena) / 0)); transform-origin: left; transform: scaleX(calc(.15 + var(--p, 0) * .85)); }
/* Rey de Reyes: el título va a la DERECHA, una palabra por renglón que entra desde la derecha; el texto lleva raya dorada */
.ev-dos--reyes .ev-dos-titulo { order: 2; text-align: right; }
.ev-dos--reyes .ev-num { justify-content: flex-end; display: flex; }
.ev-dos--reyes .ev-titulo { font-size: clamp(60px, 25cqi, 230px); line-height: .84; letter-spacing: -.03em; color: var(--c-claro-sobre-noche); }
.palabras span { display: block; transition: transform 1s var(--curva), opacity .7s ease, color .6s; transition-delay: calc(var(--i) * 120ms + 80ms); }
.palabras span:nth-child(2) { color: var(--c-arena); font-weight: var(--peso-ligero); }
.js-listo .palabras:not(.visto) span { opacity: 0; transform: translateX(.6em); }
.js-listo .palabras.rv:not(.visto) { opacity: 1; transform: none; }
.ev-dos--reyes .ev-dos-texto { border-left: 2px solid var(--c-arena); padding-left: clamp(18px, 2vw, 32px); }
@media (max-width: 899px) {
  .ev-dos { grid-template-columns: minmax(0, 1fr); }
  .ev-dos--reyes .ev-dos-titulo { order: 0; text-align: left; }
  .ev-dos--reyes .ev-num { justify-content: flex-start; }
  .ev-dos .ev-titulo { transform: none; }
}

/* ---------- Tiras de «Más recuerdos» que se mueven solas (marquee continuo) ---------- */
.fila[data-marquee] { scroll-snap-type: none; scrollbar-width: none; }
.fila[data-marquee]::-webkit-scrollbar { display: none; }
.fila[data-marquee] figure { scroll-snap-align: none; }

/* ---------- Fotos de Herederos: mosaico de tamaños distintos, cascada, zoom suave y brillo dorado ---------- */
.mosaico-v { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: clamp(64px, 6.4vw, 104px); grid-auto-flow: dense; gap: clamp(8px, 1vw, 14px); margin-top: clamp(28px, 4vw, 56px); }
.mosaico-v figure { position: relative; margin: 0; overflow: hidden; border-radius: var(--radio-galeria); grid-column: span 3; grid-row: span 2; cursor: zoom-in; background: var(--c-noche-2); transition: box-shadow .5s var(--curva), transform .5s var(--curva); }
.mosaico-v figure:nth-child(8n+1) { grid-column: span 6; grid-row: span 4; }
.mosaico-v figure:nth-child(8n+6), .mosaico-v figure:nth-child(8n+7), .mosaico-v figure:nth-child(8n) { grid-column: span 4; grid-row: span 3; }
.mosaico-v figure:last-child:nth-child(8n+1) { grid-column: span 12; grid-row: span 5; }
.mosaico-v img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; transition: transform .9s var(--curva), filter .6s; }
.mosaico-v figcaption { position: absolute; left: 12px; right: 12px; bottom: 10px; margin: 0; color: var(--c-blanco); font: var(--peso-etiqueta) 11px/1.3 var(--f-etiqueta); letter-spacing: .14em; text-transform: uppercase; opacity: 0; transform: translateY(6px); transition: opacity .4s, transform .4s var(--curva); text-shadow: 0 1px 8px rgb(var(--rgb-sombra) / .7); }
.mosaico-v figure::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 0 var(--c-arena); background: linear-gradient(to top, rgb(var(--rgb-velo) / .55), transparent 45%); opacity: 0; transition: opacity .45s, box-shadow .45s; pointer-events: none; }
.mosaico-v figure:hover, .mosaico-v figure:focus-within { box-shadow: 0 0 0 2px var(--c-arena), 0 0 42px rgb(var(--rgb-arena) / .38); transform: translateY(-3px); }
.mosaico-v figure:hover img { transform: scale(1.06); filter: brightness(1.06); }
.mosaico-v figure:hover::after, .mosaico-v figure:hover figcaption { opacity: 1; transform: none; }
@media (max-width: 767px) {
  .mosaico-v { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: 58px; }
  .mosaico-v figure, .mosaico-v figure:nth-child(8n+6), .mosaico-v figure:nth-child(8n+7), .mosaico-v figure:nth-child(8n) { grid-column: span 3; grid-row: span 3; }
  .mosaico-v figure:nth-child(4n+1) { grid-column: span 6; grid-row: span 4; }
  .mosaico-v figcaption { opacity: 1; transform: none; }
}

/* ---------- Visor GRANDE para todas las fotos ampliables: casi toda la pantalla, foto completa ---------- */
.visor { background: rgb(var(--rgb-velo) / .94); }
.visor::backdrop { background: rgb(var(--rgb-velo) / .7); }
.visor[open] { display: grid; place-items: center; grid-template-rows: none; }
.visor figure { padding: 0; display: grid; place-items: center; width: 100vw; height: 100vh; }
.visor img { width: 92vw; height: 90vh; max-width: none; max-height: none; object-fit: contain; border-radius: 0; cursor: default; }
.visor figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px var(--margen) 16px; background: linear-gradient(to top, rgb(var(--rgb-velo) / .85), transparent); pointer-events: none; }
.visor button { z-index: 2; background: rgb(var(--rgb-noche) / .6); }
@media (max-width: 767px) { .visor img { width: 96vw; height: 80vh; } .visor-ant, .visor-sig { bottom: 54px; } }
.her-bloque--pagina { padding-top: clamp(120px, 14vh, 170px); }
.her-bloque--pagina .medio { font: var(--peso-texto) clamp(19px, 1.5vw, 23px)/1.6 var(--f-texto); max-width: 34ch; color: var(--c-claro-sobre-noche); margin-top: 1em; }

/* ---------- 22/10 · «Zoe Center ↗»: discreto, hasta la derecha del encabezado (después de DONA); en celular, última opción del menú ---------- */
.cab-zc { font: var(--peso-etiqueta) 11px/1 var(--f-etiqueta); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; white-space: nowrap; color: rgb(var(--rgb-claro) / .55); padding: 10px 2px 10px 6px; transition: color .25s; }
.cab-zc:hover, .cab-zc:focus-visible { color: var(--c-arena); }
.cab-zc:focus-visible { outline: 2px solid var(--c-arena); outline-offset: 3px; border-radius: 4px; }
html[data-pagina="contacto"] .cab:not(.compacta) .cab-zc { color: rgb(var(--rgb-tinta) / .55); }
html[data-pagina="contacto"] .cab:not(.compacta) .cab-zc:hover { color: var(--c-tinta); }
@media (max-width: 1023px) { .cab-zc { display: none; } }
.menu-enlaces .menu-zc { font: var(--peso-etiqueta) 13px/1 var(--f-etiqueta); letter-spacing: .18em; color: rgb(var(--rgb-claro) / .5); margin-top: 22px; text-transform: uppercase; }
.menu-abierto .menu-enlaces .menu-zc { color: rgb(var(--rgb-claro) / .5); }

/* silla a medias (22/10): se rellena según lo aportado y lleva orilla punteada */
.sede .silla.parcial { fill: var(--c-arena); fill-opacity: max(.18, var(--avance, .3)); stroke: var(--c-arena); stroke-dasharray: 3 2; }

/* =====================================================================
   22/10 · IDENTIDAD OFICIAL de Casa Zoe + diseño «atrevido» aprobado por Brayan (maquetas en _maqueta-identidad/)
   Colores y letras salen de identidad.css. Herederos («.her-propio») conserva su estilo propio.
   ===================================================================== */
/* ---------- SIN CURVAS: nada redondeado (solo los aros de Herederos, que son SVG, y los puntos pequeños) ---------- */
*, *::before, *::after { border-radius: 0 !important; }
.cs-punto, .ev-cabecera-lista i, .punto { border-radius: 50% !important; }

/* ---------- Letras: títulos como están escritos (Herederos los sigue llevando en mayúsculas) ---------- */
.gigante, .enorme, .grande, .ev-titulo, .renglon-nombre, .menu-enlaces a, .menu-nombre, .pie-nombre, .desde h3, .red b, .tarjeta-foto span, .cs-item figcaption b, .edicion-cab h3, .monto b { text-transform: var(--mayus-titulo); }
.cifra b, .cifra-silla b, .monto b, .desde h3, .red b, .edicion-anio, .horario-dato, .menu-enlaces a, .menu-nombre, .pie-nombre, .elegido { font-weight: var(--peso-gigante); }
.her-propio { font-family: var(--f-texto); color: var(--c-tinta); }
#herederos.her-propio { background: var(--c-fondo); }
.etiqueta { color: var(--c-etiqueta); font-weight: var(--peso-etiqueta); }
.etiqueta::before { display: var(--etiqueta-raya, none); }
.medio { font-weight: var(--peso-ligero); }

/* ---------- Botones rectos: Inter en mayúsculas espaciadas; lleno en rojo arcilla ---------- */
.boton { font: var(--peso-fuerte) 12px/1 var(--f-boton); letter-spacing: .22em; min-height: 54px; padding: 0 30px; }
.boton--lleno { background: var(--c-acento); border-color: var(--c-acento); color: var(--c-fondo); }
.noche .boton--lleno, .clara .boton--lleno { background: var(--c-claro-sobre-noche); border-color: var(--c-claro-sobre-noche); color: var(--c-noche); }
.her-propio .boton--lleno { background: var(--c-tinta); border-color: var(--c-tinta); color: var(--c-fondo); }
.her-propio .noche .boton--lleno, .her-propio.noche .boton--lleno, .her-propio .clara .boton--lleno { background: var(--c-arena); border-color: var(--c-arena); color: var(--c-noche); }
.chips li { font: var(--peso-etiqueta) 10.5px/1 var(--f-etiqueta); letter-spacing: .2em; padding: 10px 14px; border-width: 1.5px; }
.her-propio .chips li { font-size: 12px; letter-spacing: .14em; padding: 10px 16px; border-width: 1px; }

/* ---------- Encabezado: barra plana (logo · menú al centro · ♪ · Dona · Zoe Center) ---------- */
.cab { --cab-tinta: var(--c-tinta); height: var(--alto-cab); align-items: center; padding: 0 var(--margen); color: var(--cab-tinta); }
.cab::before { height: 100%; background: var(--cab-banda, rgb(240 235 216 / .97)); box-shadow: 0 1px 0 var(--c-linea); }
html[data-pagina="inicio"] .cab:not(.compacta)::before { opacity: 1; }
.cab .pildora { background: none; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; color: var(--cab-tinta); }
.cab .cab-logo { padding: 5px 10px; background: var(--zc-sweet-corn); }   /* el logo NO se toca: sobre fondo oscuro va en placa crema */
.cab-logo img, .cab.compacta .cab-logo img { height: 50px; }
.cab.compacta .cab-logo { padding: 5px 10px; }
.cab-nav { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; padding: 0; gap: clamp(24px, 3vw, 44px); }
.cab-nav a { font: 600 12px/1 var(--f-texto); letter-spacing: .26em; padding: 9px 0 7px; border-bottom: 2px solid transparent; }
.cab-nav a:hover { background: none; border-bottom-color: currentColor; }
.cab-nav a[aria-current] { background: none; color: inherit; border-bottom-color: currentColor; }
.cab-acciones { margin: 0; gap: clamp(10px, 1.4vw, 22px); }
.cab-acciones .boton { min-height: 44px; padding: 0 24px; }
.cab-acciones .boton--lleno { background: var(--zc-chili-oil); border-color: var(--zc-chili-oil); color: var(--zc-sweet-corn); box-shadow: none; }
.cab-musica, .cab-menu { height: 44px; color: var(--cab-tinta); }
.cab-menu { border: 1.5px solid currentColor !important; font: 700 11px/1 var(--f-texto); letter-spacing: .2em; }
.cab-zc, html[data-pagina="contacto"] .cab:not(.compacta) .cab-zc { color: var(--cab-tinta); opacity: .6; font: 600 10.5px/1 var(--f-texto); letter-spacing: .2em; }
.cab-zc:hover, .cab-zc:focus-visible, html[data-pagina="contacto"] .cab:not(.compacta) .cab-zc:hover { color: var(--cab-tinta); opacity: 1; }
html[data-pagina="eventos"] .cab:not(.compacta), html[data-pagina="herederos"] .cab, .menu-abierto .cab { --cab-tinta: var(--zc-sweet-corn); }
html[data-pagina="herederos"] .cab { --cab-banda: rgb(13 13 12 / .92); }
html[data-pagina="herederos"] .cab::before { box-shadow: 0 1px 0 rgb(237 233 225 / .16); }
.menu-abierto .cab::before { opacity: 0; }
@media (max-width: 1023px) {
  .cab-logo img, .cab.compacta .cab-logo img { height: 42px; }
  .cab .cab-logo, .cab.compacta .cab-logo { padding: 4px 8px; }
  .cab-acciones .boton { min-height: 40px; padding: 0 16px; }
  .cab-musica, .cab-menu { height: 40px; }
}
@media (max-width: 380px) { .cab-acciones { gap: 6px; } .cab-acciones .boton { padding: 0 12px; letter-spacing: .14em; } }

/* ---------- Menú del celular: rojo arcilla, Didot ---------- */
.js-listo .menu { padding-top: calc(var(--alto-cab) + 40px); }
.menu-enlaces a { font-weight: 400; letter-spacing: -.01em; }
.menu-enlaces a small { font: 700 11px/1 var(--f-texto); letter-spacing: .28em; }

/* ---------- Duotono (Visítanos y cabecera de Eventos) ---------- */
.duo { position: relative; overflow: hidden; }
.duo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.1); }
.duo::after { content: ""; position: absolute; inset: 0; mix-blend-mode: multiply; background: var(--duo-c); pointer-events: none; }
.duo--azul { --duo-c: var(--zc-baby-blue); }
.duo--naranja { --duo-c: var(--zc-burnt-orange); }
.duo--rojo { --duo-c: var(--zc-chili-oil); }

/* ---------- INICIO · portada (maqueta «naturaleza»): crema, «Casa Zoe» en Didot y el video del bosque de orilla a orilla ---------- */
.portada3 { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) min(40vw, calc((100svh - var(--alto-cab)) * .64)); grid-template-rows: minmax(0, 1fr) auto; min-height: 100svh; padding-top: var(--alto-cab); background: var(--c-fondo); color: var(--c-tinta); }
.portada3-texto { grid-column: 1; grid-row: 1; align-self: center; padding: clamp(32px, 6vh, 72px) clamp(24px, 4vw, 64px) clamp(32px, 5vh, 56px) max(var(--margen), 8.3vw); }
.portada3-nombre { font: 400 clamp(64px, 21cqi, 160px)/.9 var(--f-titulo); letter-spacing: -.01em; margin: .3em 0 .32em; color: var(--c-tinta); }
.portada3-nombre span { display: block; }
.portada3-texto .lead { font-size: clamp(18px, 1.45vw, 21px); margin: 0; max-width: 32em; }
.portada3-texto .botones { gap: 6px; margin-top: 2.2em; }
.portada3 .portada2-cita { margin-top: clamp(32px, 7vh, 64px); border-left-color: var(--zc-burnt-orange); color: var(--c-tinta-suave); max-width: 34em; }
.portada3-video { grid-column: 2; grid-row: 1 / span 2; position: relative; margin: 0; min-height: 0; min-width: 0; }
.portada3-video .vid { position: absolute; inset: 0; box-shadow: none; }
.portada3-franja { grid-column: 1; grid-row: 2; position: relative; height: clamp(90px, 15vh, 150px); overflow: hidden; }
.portada3-franja img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.portada3 .portada2-etiqueta { left: 22px; top: 20px; }
.portada3 .vid-sonido { left: 0; right: 0; bottom: 0; transform: none; justify-content: center; min-height: 58px; padding: 0 16px; background: var(--zc-tinta); color: var(--zc-sweet-corn); box-shadow: none; animation: none; font: 700 11px/1 var(--f-texto); letter-spacing: .24em; white-space: nowrap; }
.portada3 .vid-barra { top: 58px; bottom: auto; right: 12px; flex-direction: column; }
@media (max-width: 899px) {
  .portada3 { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; min-height: 0; }
  .portada3-video { grid-column: 1; grid-row: 1; height: min(177.78vw, calc(100svh - var(--alto-cab) - 32px)); }
  .portada3-texto { grid-row: 2; padding: 40px var(--margen) 44px; }
  .portada3-franja { grid-row: 3; height: 110px; }
}

/* ---------- INICIO · arco sobre rojo arcilla ---------- */
.arco-centro h2 { font-weight: 400; }

/* ---------- INICIO · «Llena la sede»: la sala de 120 sillas como gráfico grande sobre verde olivo ---------- */
.sala-sec { background: var(--zc-green-olive); color: var(--zc-sweet-corn); padding-block: clamp(64px, 9vw, 120px); overflow: hidden; }
.sala { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); gap: clamp(4px, .7vw, 10px); }
.sala .silla { aspect-ratio: 1; border: 1.5px solid rgb(240 235 216 / .4); cursor: pointer; transition: background-color .45s var(--curva), border-color .45s; transition-delay: var(--retraso, 0s); }
.sala .silla:hover { border-color: var(--zc-sweet-corn); }
.sala .silla.llena { background: var(--zc-burnt-orange); border-color: var(--zc-burnt-orange); }
.sala .silla.parcial { background: rgb(199 103 52 / max(.25, var(--avance, .3))); border: 1.5px dashed var(--zc-burnt-orange); }
.sala-pie { display: grid; grid-template-columns: minmax(0, 480px) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: end; margin-top: clamp(48px, 7vw, 110px); }
.sala-caja { background: var(--zc-sweet-corn); color: var(--c-tinta); padding: clamp(28px, 3vw, 40px) clamp(24px, 3vw, 44px) clamp(32px, 3.2vw, 44px); }
.sala-caja .grande { font-size: clamp(38px, 13cqi, 64px); line-height: 1; padding: 0; }
.sala-caja .lead { font-size: 16px; margin-top: .9em; }
.sala-cuenta { margin: 1.2em 0 0; font: 700 11px/1.4 var(--f-texto); letter-spacing: .22em; text-transform: uppercase; color: var(--c-tinta-suave); }
.sala-cuenta b { font: 400 30px/1 var(--f-titulo); letter-spacing: 0; color: var(--zc-chili-oil); margin-right: .2em; }
.sala-caja .botones { margin-top: 1.6em; }
.sala-precio { margin: 0; justify-self: end; text-align: right; color: var(--zc-sweet-corn); }
.sala-precio b { display: block; font: 400 clamp(96px, 19vw, 300px)/.8 var(--f-titulo); letter-spacing: -.02em; white-space: nowrap; }
.sala-precio span { display: block; margin-top: 18px; font: 700 11px/1.4 var(--f-texto); letter-spacing: .28em; text-transform: uppercase; }
@media (max-width: 767px) {
  .sala { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 5px; }
  .sala-pie { grid-template-columns: minmax(0, 1fr); }
  .sala-precio { justify-self: start; text-align: left; }
  .sala-precio b { font-size: clamp(88px, 30vw, 150px); }
}

/* ---------- Visítanos: paisaje en duotono azul, «Visítanos» enorme en contorno y la dirección en rojo arcilla ---------- */
.vis-atrevido { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: min(100svh, 980px); padding: calc(var(--alto-cab) + clamp(28px, 5vw, 64px)) 0 0; overflow: hidden; background: var(--zc-baby-blue); color: var(--c-tinta); }
.vis-atrevido > .duo { position: absolute; inset: 0; z-index: 0; }
.vis-out { position: relative; z-index: 2; margin: 0 0 0 calc(var(--margen) - .05em); font: 400 clamp(60px, 17vw, 260px)/.88 var(--f-titulo); letter-spacing: -.01em; white-space: nowrap; color: transparent; -webkit-text-stroke: 2px var(--zc-tinta); padding-top: .04em; }
.vis-caja { position: relative; z-index: 2; width: min(560px, calc(100% - 2 * var(--margen))); margin: clamp(56px, 12vh, 160px) 0 0 var(--margen); padding: clamp(28px, 3.4vw, 48px) clamp(24px, 3.8vw, 56px) clamp(32px, 3.8vw, 56px); background: var(--zc-chili-oil); color: var(--zc-sweet-corn); }
.vis-caja .etiqueta { color: var(--zc-sweet-corn); }
.vis-dir { margin: .1em 0 0; font: 400 clamp(22px, 2.1vw, 30px)/1.25 var(--f-titulo); }
.vis-caja .botones { margin-top: 1.8em; }
.vis-caja .boton--lleno { background: var(--zc-sweet-corn); border-color: var(--zc-sweet-corn); color: var(--zc-chili-oil); }
.vis-caja .boton:not(.boton--lleno) { color: var(--zc-sweet-corn); }
.vis-atrevido--pagina { min-height: min(84svh, 820px); justify-content: flex-end; padding-bottom: clamp(48px, 7vw, 96px); }
.vis-atrevido--pagina .envoltura { position: relative; z-index: 2; }
.vis-atrevido--pagina .vis-out { margin-left: -.05em; }
.vis-atrevido--pagina .etiqueta { color: var(--zc-chili-oil); }
.vis-atrevido--pagina .lead { color: var(--c-tinta); font-size: clamp(18px, 1.5vw, 22px); }
#contacto-ficha { padding-top: clamp(48px, 7vw, 96px) !important; }
@media (max-width: 767px) { .vis-out { -webkit-text-stroke-width: 1.5px; } .vis-atrevido { min-height: 0; } .vis-caja { margin-top: 64px; } }

/* ---------- EVENTOS · cabecera: 3 columnas en duotono y «Eventos» enorme cruzando (solo informativa, sin enlaces) ---------- */
.ev-cab3 { position: relative; height: 100svh; min-height: 560px; overflow: hidden; background: var(--zc-tinta); color: var(--zc-sweet-corn); }
.ev-cols { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ev-col { position: relative; overflow: hidden; }
.ev-col .duo { position: absolute; inset: 0; }
.ev-col::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgb(34 33 30 / .5), rgb(34 33 30 / 0) 42%); pointer-events: none; }
.ev-col-n { position: absolute; z-index: 2; left: clamp(20px, 2.8vw, 40px); top: calc(var(--alto-cab) + 36px); font: 700 11px/1 var(--f-texto); letter-spacing: .3em; }
.ev-col-nom { position: absolute; z-index: 2; left: clamp(20px, 2.8vw, 40px); right: clamp(14px, 2vw, 28px); bottom: clamp(28px, 5vh, 52px); margin: 0; font: 400 clamp(40px, 5.6vw, 82px)/.9 var(--f-titulo); }
.ev-cab3-titulo { position: absolute; z-index: 3; left: 0; right: 0; top: 46%; transform: translateY(-50%); margin: 0; text-align: center; font: 400 clamp(64px, 16vw, 260px)/.8 var(--f-titulo); letter-spacing: -.01em; color: var(--zc-sweet-corn); pointer-events: none; text-shadow: 0 2px 40px rgb(34 33 30 / .25); }
@media (max-width: 767px) {
  .ev-cols { top: var(--alto-cab); grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(3, minmax(0, 1fr)); }
  .ev-col-n { top: 16px; left: 16px; }
  .ev-col-nom { left: 16px; right: 16px; bottom: 14px; font-size: clamp(32px, 9.4vw, 52px); }
  .ev-col-nom br { display: none; }
  .ev-cab3-titulo { top: calc(50% + var(--alto-cab) / 2); font-size: clamp(64px, 22vw, 130px); }
}
#eventos-cifras { padding-block: clamp(72px, 9vw, 120px); background: var(--c-fondo); color: var(--c-tinta); }
.cifras { border-top-color: var(--c-linea); }
.cifra b { color: var(--ev, var(--c-tinta)); }
.cifra span { color: var(--c-tinta-suave); }

/* ---------- EVENTOS · REBORN: la palabra con el bosque DENTRO de las letras, el paisaje a la derecha y la barra de años en negro ---------- */
.ev--reborn { --c-noche: var(--zc-burnt-orange); --c-arena: var(--zc-sweet-corn); --rgb-arena: 240 235 216; --c-suave-sobre-noche: var(--zc-sweet-corn); --ev: var(--zc-sweet-corn); padding-top: 0; border-top: 0; }
.rb-hero { display: grid; grid-template-columns: minmax(0, 1fr) clamp(300px, 29vw, 560px); min-height: min(84svh, 900px); }
.rb-izq { display: flex; flex-direction: column; justify-content: center; gap: clamp(28px, 6vh, 80px); padding: clamp(72px, 9vw, 120px) clamp(24px, 4vw, 64px) clamp(48px, 6vw, 80px) var(--margen); }
.rb-palabra { margin: 0 0 0 -.03em; font: 400 clamp(64px, 23cqi, 260px)/.86 var(--f-titulo); letter-spacing: -.02em; color: var(--zc-sweet-corn); background-size: cover; background-position: 50% 45%; padding-top: .04em; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) { .rb-palabra { -webkit-background-clip: text; background-clip: text; color: transparent; } }
.rb-texto { max-width: 640px; }
.rb-texto .medio { font: 400 clamp(17px, 1.35vw, 19px)/1.6 var(--f-texto); color: var(--zc-sweet-corn); margin: 0 0 1.4em; }
.rb-foto { position: relative; margin: 0; min-width: 0; }
.rb-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ev--reborn .reborn-anios { margin-top: 0; }
.ev--reborn .linea-anios { max-width: none; margin: 0; padding: 0; gap: 0; background: var(--zc-tinta); border: 0; }
.ev--reborn .linea-anios::before, .ev--reborn .linea-luz { display: none; }
.ev--reborn .anio { min-height: clamp(96px, 10.4vw, 150px); align-content: center; gap: 4px; color: rgb(240 235 216 / .55); border-right: 1px solid rgb(240 235 216 / .1); }
.ev--reborn .anio:last-child { border-right: 0; }
.ev--reborn .anio-n, .ev--reborn .anio-mayor .anio-n { font: 700 clamp(18px, 2vw, 28px)/1.1 var(--f-texto); color: inherit; }
.ev--reborn .anio-f { color: inherit; font: 700 10px/1.2 var(--f-texto); letter-spacing: .14em; }
.ev--reborn .anio.activa { background: var(--zc-sweet-corn); color: var(--zc-burnt-orange); }
.ev--reborn .anio.activa .anio-n { color: var(--zc-burnt-orange); }
.ev--reborn .aros .f { fill: transparent; }
.ev--reborn .aros .a { stroke: currentColor; }
.ev--reborn .anio.activa .aros { filter: none; }
.ev--reborn .anio.activa .aros .a { stroke: var(--zc-burnt-orange); fill: rgb(199 103 52 / .12); }
.ev--reborn .anio:focus-visible { outline: 2px solid var(--zc-sweet-corn); outline-offset: -6px; }
.ev--reborn .anio-panel { padding-bottom: 8px; }
@media (max-width: 899px) {
  .rb-hero { grid-template-columns: minmax(0, 1fr); }
  .rb-foto { height: 52svh; order: 2; }
  .rb-izq { padding-top: clamp(56px, 12vw, 96px); }
}

/* ---------- EVENTOS · Rey de Reyes: rojo arcilla, el título dos veces (sólido y en contorno) y fotos que se salen de la retícula ---------- */
.ev--reyes { --ev: var(--zc-sand); border-top: 0; }
.rr-hero { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); column-gap: clamp(24px, 3vw, 48px); row-gap: clamp(28px, 4vw, 64px); align-items: start; }
.rr-izq { grid-column: 1; grid-row: 1; padding-top: clamp(0px, 1.6vw, 24px); }
.rr-titulo { margin: 0; font: 400 clamp(44px, 14cqi, 150px)/.8 var(--f-titulo); letter-spacing: -.01em; color: var(--zc-sweet-corn); }
.rr-l1, .rr-l2 { display: block; white-space: nowrap; }
.rr-l2 { margin: .22em 0 0 .6em; color: transparent; -webkit-text-stroke: 1.5px var(--zc-sweet-corn); }
.rr-f1 { grid-column: 2; grid-row: 1 / span 2; margin: clamp(0px, 2vw, 28px) 0 0; position: relative; z-index: 1; }
.rr-f1 img { width: 100%; height: auto; aspect-ratio: 380 / 470; object-fit: cover; cursor: zoom-in; }
.rr-abajo { grid-column: 1; grid-row: 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); gap: clamp(24px, 3vw, 48px); align-items: end; }
.rr-texto .medio { font: 400 clamp(16px, 1.25vw, 18px)/1.65 var(--f-texto); color: var(--zc-pristine); margin: 0 0 1.2em; max-width: 60ch; }
.rr-texto .ev-dos-nota { color: var(--c-suave-sobre-noche); margin: 1.1em 0 0; }
.rr-f2 { position: relative; z-index: 2; margin: 0 calc(-1 * clamp(24px, 3vw, 48px) - clamp(16px, 3vw, 44px)) 0 0; outline: 14px solid var(--zc-chili-oil); }
.rr-f2 img { width: 100%; height: auto; aspect-ratio: 300 / 220; object-fit: cover; cursor: zoom-in; }
@media (max-width: 899px) {
  .rr-hero { grid-template-columns: minmax(0, 1fr); }
  .rr-izq, .rr-f1, .rr-abajo { grid-column: 1; grid-row: auto; }
  .rr-f1 { width: 78%; justify-self: end; margin: 0; }
  .rr-abajo { grid-template-columns: minmax(0, 1fr); }
  .rr-f2 { order: -1; width: 62%; margin: calc(-1 * clamp(80px, 22vw, 180px)) 0 8px 0; outline-width: 10px; }
}
.ev-fin { background: var(--zc-chili-oil); }

/* ---------- DONA · la sala de la sede sobre verde olivo, sillas cuadradas ---------- */
.oliva { --c-noche: var(--zc-green-olive); --c-arena: var(--zc-sweet-corn); }
.oliva .sede .muros { stroke: rgb(240 235 216 / .6); }
.oliva .sede .esc { fill: rgb(240 235 216 / .18); }
.oliva .sede .pulpito { fill: var(--zc-sand); }
.oliva .sede .pasillo { stroke: rgb(240 235 216 / .45); }
.oliva .sede .puerta { fill: var(--zc-green-olive); }
.oliva .sede .rot, .oliva .sede .fila { fill: rgb(240 235 216 / .85); }
.oliva .sede .silla { fill: transparent; stroke: rgb(240 235 216 / .5); }
.oliva .sede .silla:hover { stroke: var(--zc-sweet-corn); }
.oliva .sede .silla.llena { fill: var(--zc-burnt-orange); stroke: var(--zc-burnt-orange); }
.oliva .sede .silla.parcial { fill: var(--zc-burnt-orange); stroke: var(--zc-burnt-orange); }
.oliva .sede-leyenda { color: rgb(240 235 216 / .88); }
.oliva .sede-leyenda i { border-color: rgb(240 235 216 / .5); }
.oliva .sede-leyenda .l-llena i { background: var(--zc-burnt-orange); border-color: var(--zc-burnt-orange); }
.oliva .gracias li { background: var(--zc-sweet-corn); color: var(--c-tinta); }
.oliva [data-gracias-tit] { color: var(--zc-sweet-corn) !important; }
.pronto { border: 1px solid var(--c-linea); }

/* ---------- Pie: papel, nombre enorme en rojo arcilla ---------- */
.pie { background: var(--c-papel); color: var(--c-tinta); border-top: 1px solid var(--c-linea); }
.pie-cols p { color: var(--c-tinta-suave); }
.pie-cols a { color: var(--c-tinta); }
.pie-cols a:hover { color: var(--zc-chili-oil); }
.pie-cols .etiqueta { color: var(--zc-chili-oil); }
.pie-nombre { color: var(--zc-chili-oil); letter-spacing: -.02em; }
.pie-legal { background: var(--c-papel); border-top-color: var(--c-linea); color: var(--c-tinta-suave); }
/* ajustes tras la primera revisión (22/10) */
.vis-caja .boton { padding: 0 22px; }
.vis-caja .botones { gap: 10px; }
.vis-atrevido:not(.vis-atrevido--pagina) .vis-caja { margin-top: clamp(40px, 8vh, 110px); }
.vis-atrevido--pagina { justify-content: flex-start; padding-top: calc(var(--alto-cab) + clamp(40px, 8vh, 96px)); min-height: min(78svh, 760px); }
.vis-atrevido--pagina .duo img { object-position: 50% 30% !important; }
.vis-caja--nota { margin: clamp(32px, 6vh, 64px) 0 0; width: auto; max-width: 560px; display: inline-block; font: 400 clamp(20px, 1.8vw, 26px)/1.3 var(--f-titulo); }
.rr-f2 { margin-right: calc(-1 * clamp(24px, 3vw, 48px) - 12px); }
.vis-atrevido--pagina .etiqueta { color: var(--zc-sweet-corn); }
.vis-atrevido--pagina .vis-out { -webkit-text-stroke-color: var(--zc-sweet-corn); }

/* ---------- 22/10 (Brayan) · Las sillas vuelven a su diseño anterior (plano con escenario, filas y pasillo) con los colores de la identidad ---------- */
.sede .muros { stroke: rgb(34 33 30 / .45); }
.sede .esc { fill: rgb(34 33 30 / .07); }
.sede .pulpito { fill: var(--zc-sand); }
.sede .pasillo { stroke: rgb(34 33 30 / .3); }
.sede .puerta { fill: var(--c-papel); }
.sede .rot, .sede .fila { fill: var(--c-tinta-suave); }
.sede .silla { fill: transparent; stroke: rgb(34 33 30 / .38); }
.sede .silla:hover { stroke: var(--c-tinta); }
.sede .silla.llena { fill: var(--zc-chili-oil); stroke: var(--zc-chili-oil); }
.sede .silla.parcial { fill: var(--zc-chili-oil); fill-opacity: max(.18, var(--avance, .3)); stroke: var(--zc-chili-oil); stroke-dasharray: 3 2; }
.sede-leyenda i { border-color: rgb(34 33 30 / .38); }
.sede-leyenda .l-llena i { background: var(--zc-chili-oil); border-color: var(--zc-chili-oil); }
.papel .gracias li { background: var(--c-fondo); }
.cifra-silla:nth-child(2) { border-top-color: var(--zc-chili-oil); }
#inicio-dona .cifras-silla { margin-top: clamp(24px, 3vw, 40px); }

/* ---------- 22/10 (Brayan) · Herederos del Inicio: texto claro sobre negro, como en la página Herederos ---------- */
.her-propio.noche, .her-propio .noche { color: var(--c-claro-sobre-noche); }
.portada3 .portada2-etiqueta { left: clamp(118px, 27%, 170px); } /* 22/10: deja libre el logo de Herederos que trae el video */
@media (max-width: 899px) { .portada3 .portada2-etiqueta { left: 74px; right: 16px; white-space: normal; } }
@media (max-width: 767px) { .cifras { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* 22/10: quedan 3 cifras (sin «desde 2022») */
.rb-texto { max-width: 780px; } .rb-texto .medio { font-size: clamp(19px, 1.75vw, 26px); line-height: 1.55; } .rb-texto .etiqueta { font-size: 13px; } /* 22/10: descripción de REBORN más grande */