/* Aria · Retrato editorial — theme exclusivo v5.
 *
 * La v5 es la v4 vestida con lo que la familia pidió a partir de un mock: iconos
 * de línea por sección, botones de oro con su icono, horas de sede en oro,
 * marco fino en las fotos de sede, cruz sobre la bendición y frases de cierre.
 * La portada y la pausa tras el contador se funden en vino; el cuerpo conserva
 * el papel claro. La caligrafía y las rosas se limitan a esas dos piezas.
 *
 * La v4 es la v3 con tres añadidos que pidió la familia: la foto de cada sede,
 * el calendario del mes en el cierre y el archivo de calendario para iPhone.
 * El color, la estructura y el ritmo **no cambian**: se probó invertir el papel
 * a guinda oscuro y la pieza perdía el aire que la hace editorial.
 *
 * v3: pantalla completa en escritorio (cada franja pinta su fondo de orilla a
 * orilla y el texto vive en `.aria-inner`), todo sobre el eje central, números
 * serif de trazo moderno y movimiento sutil.
 *
 * Un solo sistema: papel claro y una franja apenas más cálida, una tinta, serif
 * editorial para nombre y títulos, sans legible para el resto, y un ornamento
 * (la línea con rombo). Sin sombras ni tarjetas; los velos de las fotos
 * reservan espacio al texto.
 */
@font-face {
  font-family: AriaScript;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/pinyon-script-latin.woff2') format('woff2');
}
@font-face {
  font-family: EventoSerif;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/cormorant-garamond-italic-latin.woff2') format('woff2');
}

/* Tokens. Se declaran también en el artículo porque la vista previa no pone la
   paleta en el body: las variables --event-* llegan ahí en línea. */
[data-evento-theme='aria-xv'],
[data-evento-theme='aria-xv'] .aria-experience {
  --aria-ink: var(--event-text, #2b1a1e);
  --aria-tint: var(--event-primary, #7a1b2e);
  --aria-paper: var(--event-background, #ffffff);
  --aria-paper-2: color-mix(in srgb, var(--aria-tint) 4%, var(--aria-paper));
  --aria-muted: color-mix(in srgb, var(--aria-ink) 70%, var(--aria-paper));
  --aria-line: color-mix(in srgb, var(--aria-ink) 14%, transparent);
  /* Fondo neutro del control de música sobre la fotografía. */
  --aria-scrim: 0 0 0;
  /* El oro de la paleta, que hasta la v4 se declaraba sin leerse. Sobre papel
     claro el oro puro da 2,4:1: sirve de relleno y de trazo, nunca de letra.
     Para escribir en oro (las horas, su «p.m.», los iconos) se oscurece con la
     tinta hasta 4,6:1 sobre la franja alterna: al 72 % pasaba sólo a tamaño
     grande y el «p.m.» pequeño quedaba en 3,7:1. */
  --aria-gold: var(--event-accent, #c9a227);
  --aria-gold-ink: color-mix(in srgb, var(--aria-gold) 60%, var(--aria-ink));
  /* El guinda sobre oro no toma la tinta del cuerpo: en Guinda nocturno esa
     tinta es clara. Conserva contraste tanto sobre champán como al pasar a oro. */
  --aria-gold-fill: color-mix(in srgb, var(--aria-gold) 78%, #ffffff);
  --aria-on-gold: #230b11;
  --aria-serif: EventoSerif, 'Cormorant Garamond', Georgia, serif;
  --aria-script: AriaScript, var(--aria-serif);
  --aria-wine: color-mix(in srgb, var(--aria-tint) 42%, #16070a);
  --aria-champagne: #ead3a8;
  --aria-sans: Manrope, system-ui, sans-serif;
  /* Una escala por función, compartida entre invitación y pantallas de invitado. */
  --aria-title-size: clamp(2.2rem, 8.5vw, 3.2rem);
  --aria-heading-size: clamp(1.9rem, 7.5vw, 2.6rem);
  --aria-prose-size: clamp(1.3rem, 5vw, 1.55rem);
  --aria-label-size: 0.75rem;
  --aria-action-size: 0.75rem;
  --aria-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --aria-column: 44rem;
  --aria-hero-focus: 50% 40%;
  --aria-gutter: clamp(1.5rem, 6vw, 3rem);
  accent-color: var(--aria-tint);
}

/* Página */
[data-evento-theme='aria-xv'].event-page {
  background: var(--aria-paper-2);
}
[data-evento-theme='aria-xv'].event-page main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
[data-evento-theme='aria-xv'] .aria-experience {
  position: relative;
  width: 100%;
  overflow: clip;
  background: var(--aria-paper);
  color: var(--aria-ink);
  font: 400 1rem/1.7 var(--aria-sans);
  -webkit-font-smoothing: antialiased;
}
[data-evento-theme='aria-xv'] .aria-experience :where(h1, h2, h3, p, ul, ol, figure, blockquote) {
  margin: 0;
}
/* La hoja del panel (`styles.css`, en la página del enlace personal) pinta cada
   `li` como tarjeta; aquí las listas vuelven a ser texto. */
[data-evento-theme='aria-xv'] .aria-experience :where(ul, ol) {
  display: block;
  gap: 0;
  padding: 0;
  list-style: none;
}
[data-evento-theme='aria-xv'] .aria-experience :where(li) {
  display: block;
  gap: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
}
[data-evento-theme='aria-xv'] .aria-experience a:not(.aria-button) {
  color: var(--aria-tint);
}
[data-evento-theme='aria-xv'] .aria-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
[data-evento-theme='aria-xv'] :focus-visible {
  outline: 2px solid var(--aria-tint);
  outline-offset: 4px;
}

/* Componentes */
[data-evento-theme='aria-xv'] .aria-label {
  color: var(--aria-tint);
  font: 600 var(--aria-label-size) / 1.5 var(--aria-sans);
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .aria-title {
  color: var(--aria-ink);
  font: 400 var(--aria-title-size) / 1.15 var(--aria-serif);
  letter-spacing: -0.01em;
  text-wrap: balance;
}
[data-evento-theme='aria-xv'] .aria-text {
  max-width: 32rem;
  color: var(--aria-ink);
  font-size: 1rem;
  line-height: 1.7;
  text-wrap: pretty;
}

/* Texto que escribe la familia. `pre-line` conserva los saltos sueltos dentro
   de un párrafo y colapsa la sangría, así que el formato es el que se tecleó y
   no el del editor. Va en su propia clase: aplicado a `.aria-text` haría
   visibles los saltos con que está escrito el código de las secciones. */
[data-evento-theme='aria-xv'] .aria-prose {
  white-space: pre-line;
}
/* Los enlaces de dentro de un texto se tocan con el dedo: 22 px de alto es la
   mitad de lo que necesita un pulgar. */
[data-evento-theme='aria-xv'] .aria-text a {
  display: inline-block;
  padding-block: 0.6rem;
}
[data-evento-theme='aria-xv'] .aria-prose + .aria-prose {
  /* El contenedor ya pone su `gap`; esto sólo lo completa hasta 1.4rem, para
     que dos párrafos se separen igual en la cita, en un bloque o en una
     opción de regalo. Antes sumaba y daban 2.4, 1.7 y 1.4rem. */
  margin-top: 0;
}
[data-evento-theme='aria-xv'] .aria-quote,
[data-evento-theme='aria-xv'] .aria-block,
[data-evento-theme='aria-xv'] .aria-option {
  row-gap: 1.4rem;
}
[data-evento-theme='aria-xv'] .aria-section {
  background: var(--aria-paper);
}
/* Dos secciones del mismo papel seguidas se leen como una sola: entre Detalles
   y Galería son 14rem de blanco continuo sin nada que marque el corte. Un
   filete lo separa sólo donde hace falta; donde el fondo ya cambia, no aparece. */
[data-evento-theme='aria-xv']
  .aria-section:not(.aria-section-alt)
  + .aria-section:not(.aria-section-alt),
[data-evento-theme='aria-xv'] .aria-section-alt + .aria-section-alt {
  border-top: 1px solid var(--aria-line);
}
[data-evento-theme='aria-xv'] .aria-section-alt {
  background: var(--aria-paper-2);
}
[data-evento-theme='aria-xv'] .aria-inner {
  display: grid;
  justify-items: center;
  gap: 1rem;
  width: 100%;
  max-width: calc(var(--aria-column) + 2 * var(--aria-gutter));
  margin-inline: auto;
  padding: clamp(4.5rem, 14vw, 7rem) var(--aria-gutter);
  text-align: center;
}
[data-evento-theme='aria-xv'] .aria-rule {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: min(14rem, 100%);
  /* Más que el pequeño: este separa secciones. Antes eran 1.5rem contra los
     1.75rem del pequeño, y el corte menor abría más aire que el mayor. */
  margin: 2.5rem auto;
  color: var(--aria-tint);
}
[data-evento-theme='aria-xv'] .aria-rule::before,
[data-evento-theme='aria-xv'] .aria-rule::after {
  flex: 1;
  height: 1px;
  background: var(--aria-line);
  content: '';
}
[data-evento-theme='aria-xv'] .aria-rule span {
  width: 6px;
  height: 6px;
  border: 1px solid currentColor;
  rotate: 45deg;
}
[data-evento-theme='aria-xv'] .aria-rule-small {
  width: min(8rem, 100%);
  margin: 1.75rem auto;
}
[data-evento-theme='aria-xv'] .aria-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0 1.6rem;
  border: 1px solid var(--aria-tint);
  border-radius: 2px;
  background: var(--aria-tint);
  color: var(--aria-paper);
  font: 600 var(--aria-action-size) / 1.4 var(--aria-sans);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.3s,
    color 0.3s;
}
[data-evento-theme='aria-xv'] .aria-button:hover {
  background: color-mix(in srgb, var(--aria-tint) 85%, var(--aria-ink));
}
[data-evento-theme='aria-xv'] .aria-button-quiet {
  border-color: color-mix(in srgb, var(--aria-tint) 45%, transparent);
  background: transparent;
  color: var(--aria-tint);
}
[data-evento-theme='aria-xv'] .aria-button-quiet:hover {
  border-color: var(--aria-tint);
  background: transparent;
}
[data-evento-theme='aria-xv'] .aria-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

/* Velo de apertura: sólo existe cuando el html lo pidió. */
[data-evento-theme='aria-xv'] .aria-veil {
  display: none;
}
html[data-aria-velo='pendiente'] [data-evento-theme='aria-xv'] .aria-veil {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: grid;
  place-content: center;
  gap: 1.1rem;
  background: var(--aria-paper);
  color: var(--aria-ink);
  text-align: center;
  pointer-events: none;
  animation: aria-veil 2.1s var(--aria-ease) 0.1s both;
}
html[data-aria-velo='pendiente'] [data-evento-theme='aria-xv'] .aria-veil > * {
  animation: aria-rise 1s var(--aria-ease) both;
}
[data-evento-theme='aria-xv'] .aria-veil-name {
  font: italic 400 clamp(4.5rem, 22vw, 8rem) / 1 var(--aria-serif);
  /* Sin esto un nombre largo tocaba los dos bordes de la pantalla. */
  padding-inline: var(--aria-gutter);
}
[data-evento-theme='aria-xv'] .aria-veil-sign {
  font: 400 1.05rem/1 var(--aria-serif);
  letter-spacing: 0.3em;
}

/* Portada */
[data-evento-theme='aria-xv'] .aria-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  align-content: end;
  min-height: max(46rem, 100svh);
  padding: 20rem var(--aria-gutter) 5.5rem;
  background: var(--aria-wine);
  text-align: center;
}
[data-evento-theme='aria-xv'] .aria-hero-plain {
  align-content: center;
  padding-top: 5rem;
  background: var(--aria-paper-2);
}
[data-evento-theme='aria-xv'] .aria-hero-photo {
  color: #fff9ee;
}
[data-evento-theme='aria-xv'] .aria-hero-scene {
  position: absolute;
  inset: 0 0 auto;
  z-index: -2;
  height: 83%;
  overflow: hidden;
}
[data-evento-theme='aria-xv'] .aria-hero-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--aria-hero-focus);
}
/* El vino queda bajo el texto; la parte alta conserva la luz de la foto. */
[data-evento-theme='aria-xv'] .aria-hero-photo::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    to bottom,
    transparent 36%,
    color-mix(in srgb, var(--aria-wine) 28%, transparent) 52%,
    var(--aria-wine) 78%
  );
  content: '';
}
[data-evento-theme='aria-xv'] .aria-hero-text {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 0.85rem;
  width: 100%;
  max-width: 52rem;
  margin-inline: auto;
}
[data-evento-theme='aria-xv'] .aria-hero-photo::before,
[data-evento-theme='aria-xv'] .aria-interlude::before {
  position: absolute;
  bottom: 0;
  left: 0;
  width: clamp(8rem, 20vw, 16rem);
  aspect-ratio: 1;
  background: url('./rosas-ornamento.webp') left bottom / contain no-repeat;
  opacity: 0.45;
  pointer-events: none;
  content: '';
}
[data-evento-theme='aria-xv'] .aria-hero-photo::before {
  z-index: 0;
}
[data-evento-theme='aria-xv'] .aria-hero-photo .aria-label {
  color: #fff9ee;
}
[data-evento-theme='aria-xv'] .aria-hero-name {
  display: grid;
  max-width: 100%;
  font: 400 clamp(5.5rem, 24vw, 8rem) / 1 var(--aria-serif);
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}
[data-evento-theme='aria-xv'] .aria-hero-name .aria-name {
  padding-inline: 0.14em;
  font-family: var(--aria-script);
  font-style: normal;
  line-height: 1.1;
}
[data-evento-theme='aria-xv'] .aria-hero-photo .aria-name {
  color: var(--aria-champagne);
}
[data-evento-theme='aria-xv'] .aria-surname {
  margin-top: 0.1em;
  font-size: 0.25em;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .aria-hero-date {
  max-width: 24rem;
  font: 500 0.78rem/1.8 var(--aria-sans);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-wrap: balance;
}
[data-evento-theme='aria-xv'] .aria-hero-rule,
[data-evento-theme='aria-xv'] .aria-interlude-rule {
  width: 6rem;
  height: 1px;
  margin-top: 0.6rem;
  background: currentColor;
  opacity: 0.6;
}
[data-evento-theme='aria-xv'] .aria-hero-photo .aria-hero-rule {
  color: var(--aria-champagne);
}
[data-evento-theme='aria-xv'] .aria-scroll-cue {
  position: absolute;
  bottom: 1.1rem;
  left: 50%;
  display: grid;
  justify-items: center;
  gap: 0.5rem;
  /* 0.62rem eran 9.9 px, y además va sobre una fotografía. */
  font: 600 var(--aria-label-size) / 1 var(--aria-sans);
  letter-spacing: 0.3em;
  text-transform: uppercase;
  opacity: 0.8;
  translate: -50%;
}
[data-evento-theme='aria-xv'] .aria-scroll-cue::after {
  width: 1px;
  height: 1.5rem;
  background: currentColor;
  transform-origin: top;
  content: '';
}
[data-evento-theme='aria-xv'] .aria-scroll-cue.is-gone {
  opacity: 0;
  transition: opacity 0.6s var(--aria-ease);
}
[data-evento-theme='aria-xv'] .aria-music {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid currentColor;
  border-radius: 50%;
  background: rgb(var(--aria-scrim) / 0.3);
  color: inherit;
  cursor: pointer;
}
[data-evento-theme='aria-xv'] .aria-hero-plain .aria-music {
  background: transparent;
}

/* Cuenta regresiva */
[data-evento-theme='aria-xv'] .aria-countdown {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  width: 100%;
  max-width: 26rem;
  margin-top: 0.5rem;
}
[data-evento-theme='aria-xv'] .aria-countdown-unit {
  display: grid;
  justify-items: center;
  gap: 0.4rem;
}
[data-evento-theme='aria-xv'] .aria-countdown-unit + .aria-countdown-unit {
  border-left: 1px solid var(--aria-line);
}
[data-evento-theme='aria-xv'] .aria-countdown-value {
  /* Tabulares: son los únicos dígitos que cambian cada segundo y con cifras
     proporcionales el número se movía dentro de su celda al pasar de 11 a 10. */
  color: var(--aria-ink);
  font: 400 clamp(2.4rem, 11vw, 3.6rem) / 1 var(--aria-serif);
}
[data-evento-theme='aria-xv'] .aria-countdown-label {
  color: var(--aria-muted);
  font: 600 var(--aria-label-size) / 1.5 var(--aria-sans);
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
/* A 320 px, el espaciado amplio pegaba «minutos» a «segundos». Se conserva
   el tamaño legible y se deja que las cuatro columnas tengan el mismo ancho. */
@media (max-width: 23rem) {
  [data-evento-theme='aria-xv'] .aria-countdown-label {
    letter-spacing: 0;
  }
}
[data-evento-theme='aria-xv'] .aria-countdown-done {
  display: none;
  grid-column: 1 / -1;
  font: italic 400 clamp(1.8rem, 7vw, 2.6rem) / 1.2 var(--aria-serif);
}
[data-evento-theme='aria-xv'] .aria-countdown.is-done .aria-countdown-unit {
  display: none;
}
[data-evento-theme='aria-xv'] .aria-countdown.is-done .aria-countdown-done {
  display: block;
}

/* Familia y carta personal */
[data-evento-theme='aria-xv'] .aria-family .aria-inner {
  gap: 1.75rem;
}
[data-evento-theme='aria-xv'] .aria-family .aria-rule-small {
  /* Separa papás de padrinos dentro del mismo bloque: el corte más leve de
     todos, pero 0.25rem lo dejaba pegado a los nombres. */
  margin: 1rem auto;
}
[data-evento-theme='aria-xv'] .aria-family-group {
  display: grid;
  justify-items: center;
  gap: 0.9rem;
}
[data-evento-theme='aria-xv'] .aria-names {
  display: grid;
  gap: 0.5rem;
  color: var(--aria-ink);
  font: 500 clamp(1.35rem, 5.5vw, 1.7rem) / 1.25 var(--aria-serif);
}
[data-evento-theme='aria-xv'] .aria-personal .aria-inner {
  /* Reducido, no amputado: el `Rule` que cierra la sección va fuera del inner
     y aporta su propio margen, pero a cero el botón quedaba contra el filo. */
  padding-bottom: 1.5rem;
}
[data-evento-theme='aria-xv'] .aria-personal-seats {
  font: 400 1.35rem/1.2 var(--aria-serif);
  color: var(--aria-tint);
}

/* Pausas fotográficas: el retrato se queda quieto y el papel sube sobre él. */
[data-evento-theme='aria-xv'] .aria-photo {
  position: relative;
}
[data-evento-theme='aria-xv'] .aria-photo-img {
  position: sticky;
  top: 0;
  display: block;
  width: 100%;
  height: 100svh;
  object-fit: cover;
  object-position: 50% 25%;
}
[data-evento-theme='aria-xv'] .aria-photo-text {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 1rem;
  padding: clamp(4.5rem, 14vw, 7rem) var(--aria-gutter);
  background: var(--aria-paper);
  text-align: center;
}
[data-evento-theme='aria-xv'] .aria-photo-empty .aria-photo-text {
  background: var(--aria-paper-2);
}
[data-evento-theme='aria-xv'] .aria-quote {
  display: grid;
  justify-items: center;
  gap: 1.5rem;
  max-width: 30rem;
}
[data-evento-theme='aria-xv'] .aria-quote p {
  font: italic 400 clamp(1.6rem, 6.5vw, 2.3rem) / 1.3 var(--aria-serif);
  text-wrap: balance;
}
/* Una cita se abre una vez y se cierra una vez. Con las comillas en cada
   párrafo, una bienvenida de tres párrafos salía como tres citas seguidas. */
[data-evento-theme='aria-xv'] .aria-quote p:first-of-type::before {
  content: '“';
}
[data-evento-theme='aria-xv'] .aria-quote p:last-of-type::after {
  content: '”';
}
[data-evento-theme='aria-xv'] .aria-quote p + p {
  margin-top: 0.4rem;
}
/* La firma es un nombre, no un rótulo: a tamaño de etiqueta se perdía bajo la
   cita. La familia pidió verla un poco más grande. */
[data-evento-theme='aria-xv'] .aria-quote footer {
  font-size: 0.86rem;
}
[data-evento-theme='aria-xv'] .aria-photo-still {
  aspect-ratio: 4 / 5;
  overflow: hidden;
}
[data-evento-theme='aria-xv'] .aria-photo-still .aria-photo-img {
  position: static;
  height: 100%;
}

/* Pausa tras el contador: la foto tiene su propio espacio, sin repetir portada.
   La imagen floral del theme es decorativa y cede ante una foto editorial. */
[data-evento-theme='aria-xv'] .aria-interlude {
  isolation: isolate;
  display: grid;
  align-items: end;
  min-height: 38rem;
  background: var(--aria-wine);
  color: #fff9ee;
  overflow: hidden;
}
[data-evento-theme='aria-xv'] .aria-interlude .aria-interlude-img {
  position: relative;
  grid-area: 1 / 1;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  align-self: start;
  object-fit: cover;
  object-position: 50% 35%;
  mask-image: linear-gradient(#000 55%, transparent 100%);
}
[data-evento-theme='aria-xv'] .aria-interlude-caption {
  z-index: 1;
  grid-area: 1 / 1;
  display: grid;
  justify-items: center;
  gap: 0.75rem;
  padding: 16rem var(--aria-gutter) 3.5rem;
  text-align: center;
}
[data-evento-theme='aria-xv'] .aria-interlude-title {
  color: var(--aria-champagne);
  font: 400 clamp(3.4rem, 14vw, 5rem) / 1.3 var(--aria-script);
}
[data-evento-theme='aria-xv'] .aria-interlude .aria-motto {
  max-width: 26rem;
  margin: 0;
  color: #fff9ee;
  font-size: var(--aria-label-size);
  line-height: 1.9;
  text-wrap: balance;
}
[data-evento-theme='aria-xv'] .aria-interlude::before {
  z-index: 1;
  right: 0;
  left: auto;
  scale: -1 1;
  opacity: 0.3;
}
[data-evento-theme='aria-xv'] .aria-interlude-rule {
  color: var(--aria-champagne);
}

/* Sedes */
[data-evento-theme='aria-xv'] .aria-venues .aria-inner,
[data-evento-theme='aria-xv'] .aria-stay .aria-inner,
[data-evento-theme='aria-xv'] .aria-details .aria-inner {
  gap: 0;
}
[data-evento-theme='aria-xv'] .aria-venue,
[data-evento-theme='aria-xv'] .aria-block {
  display: grid;
  justify-items: center;
  gap: 0.8rem;
  width: 100%;
}
[data-evento-theme='aria-xv'] :is(.aria-venues, .aria-stay, .aria-details) .aria-rule-small {
  margin: 2.75rem auto;
}
/* Foto del lugar, opcional. Banda contenida con recorte alto: las fotos de
   fachada llegan horizontales, con cielo de sobra arriba y la entrada abajo.
   Sin marco ni sombra, como el resto del sistema. */
[data-evento-theme='aria-xv'] .aria-venue-photo {
  width: 100%;
  max-width: 34rem;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 16 / 10;
}
[data-evento-theme='aria-xv'] .aria-venue-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 58%;
}
[data-evento-theme='aria-xv'] .aria-venue-name {
  color: var(--aria-ink);
  font: 400 var(--aria-heading-size) / 1.15 var(--aria-serif);
  text-wrap: balance;
}
[data-evento-theme='aria-xv'] .aria-venue-time {
  color: var(--aria-tint);
  font: 400 clamp(1.5rem, 6vw, 2rem) / 1 var(--aria-serif);
}
[data-evento-theme='aria-xv'] .aria-venue-time span,
[data-evento-theme='aria-xv'] .aria-schedule-time span {
  font-size: 0.6em;
  letter-spacing: 0.08em;
}
[data-evento-theme='aria-xv'] .aria-venue-address {
  max-width: 26rem;
}

/* Itinerario sobre el eje central: hora a la izquierda, rombo, momento a la derecha. */
[data-evento-theme='aria-xv'] .aria-schedule {
  display: grid;
  gap: 1.1rem;
  /* Se ajusta a su contenido y se centra: con momentos cortos el bloque queda
     en el eje, como antes; con momentos largos crece hasta el tope y el texto
     envuelve en vez de partirse en cinco líneas. */
  width: fit-content;
  max-width: min(100%, 40rem);
  margin: 1rem auto 0;
}
[data-evento-theme='aria-xv'] .aria-schedule-row {
  display: grid;
  /* La hora toma lo que necesita —no más de 7rem— y el resto es del momento.
     Con `1fr auto 1fr` el texto se quedaba con la mitad del ancho aunque la
     hora ocupara un tercio de su columna: «Brindis y primer baile» se partía
     en cinco líneas y el rombo quedaba flotando arriba. */
  grid-template-columns: max-content auto minmax(0, 1fr);
  column-gap: 1.25rem;
  align-items: center;
}
[data-evento-theme='aria-xv'] .aria-schedule-row::after {
  grid-row: 1;
  grid-column: 2;
  width: 5px;
  height: 5px;
  border: 1px solid var(--aria-tint);
  rotate: 45deg;
  content: '';
}
[data-evento-theme='aria-xv'] .aria-schedule-time {
  grid-column: 1;
  color: var(--aria-tint);
  font: 400 1.5rem/1 var(--aria-serif);
  text-align: right;
  white-space: nowrap;
}
[data-evento-theme='aria-xv'] .aria-schedule-label {
  grid-column: 3;
  font: 500 1.05rem/1.4 var(--aria-sans);
  text-align: left;
}

/* Opciones centradas: estacionamiento y regalos, con la misma voz que las sedes. */
[data-evento-theme='aria-xv'] .aria-options {
  display: grid;
  justify-items: center;
  width: 100%;
  margin-top: 0.5rem;
}
[data-evento-theme='aria-xv'] .aria-option {
  display: grid;
  justify-items: center;
  gap: 0.5rem;
  width: 100%;
}
[data-evento-theme='aria-xv'] :is(.aria-parking, .aria-details) .aria-option .aria-rule-small {
  margin: 1.75rem auto;
}
[data-evento-theme='aria-xv'] .aria-option-name {
  font: 500 clamp(1.35rem, 5vw, 1.6rem) / 1.25 var(--aria-serif);
  text-wrap: balance;
}
[data-evento-theme='aria-xv'] .aria-option .aria-button {
  margin-top: 0.25rem;
}

/* Detalles */
[data-evento-theme='aria-xv'] .aria-dress {
  max-width: 30rem;
  font: 400 var(--aria-heading-size) / 1.15 var(--aria-serif);
  text-wrap: balance;
}
/* Dos peldaños y no uno: con un único corte, «Formal» y «Formal, de preferencia
   evitando el color vino» —39 y 41 caracteres— se veían radicalmente distintos,
   con una caída del 38 % de golpe. */
[data-evento-theme='aria-xv'] .aria-dress-medium {
  font-size: clamp(1.6rem, 6vw, 2rem);
  line-height: 1.25;
}
[data-evento-theme='aria-xv'] .aria-dress-long {
  font-size: clamp(1.3rem, 5vw, 1.6rem);
  line-height: 1.4;
}
[data-evento-theme='aria-xv'] .aria-code strong {
  color: var(--aria-tint);
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* Galería y visor */
[data-evento-theme='aria-xv'] .aria-gallery .aria-inner {
  padding-bottom: 2rem;
}
/* Masonry por columnas: cada foto conserva su proporción y la columna la
   apila. La proporción llega en el atributo `style` de cada foto; 4:5 es la
   de respaldo cuando no se conocen sus medidas. */
[data-evento-theme='aria-xv'] .aria-gallery-grid {
  --aria-gallery-gap: 0.5rem;
  columns: 2;
  column-gap: var(--aria-gallery-gap);
  max-width: 90rem;
  margin-inline: auto;
  /* El mismo margen que el resto: a 0.5rem las fotos quedaban a 8 px del
     borde mientras el título, 40 px más arriba, arrancaba a 24. */
  padding: 0 var(--aria-gutter) 3.5rem;
}
[data-evento-theme='aria-xv'] .aria-gallery-grid[data-columns='1'] {
  columns: 1;
  max-width: calc(var(--aria-column) + 2 * var(--aria-gutter));
}
[data-evento-theme='aria-xv'] .aria-gallery-grid li {
  break-inside: avoid;
  margin-bottom: var(--aria-gallery-gap);
}
/* Cuadrícula por filas para fotos de la misma proporción: se lee de izquierda
   a derecha, como avanza el visor, y la fila incompleta se centra. En el
   teléfono, con dos columnas, la foto sobrante cierra a todo el ancho. */
[data-evento-theme='aria-xv'] .aria-gallery-grid[data-layout='grid'] {
  --aria-gallery-columns: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--aria-gallery-gap);
  columns: auto;
}
[data-evento-theme='aria-xv'] .aria-gallery-grid[data-layout='grid'][data-columns='1'] {
  --aria-gallery-columns: 1;
}
[data-evento-theme='aria-xv'] .aria-gallery-grid[data-layout='grid'] li {
  flex: 0 0
    calc(
      (100% - (var(--aria-gallery-columns) - 1) * var(--aria-gallery-gap)) /
        var(--aria-gallery-columns)
    );
  margin-bottom: 0;
}
[data-evento-theme='aria-xv'] .aria-gallery-grid[data-layout='grid'] li:last-child:nth-child(odd) {
  flex-basis: 100%;
}
[data-evento-theme='aria-xv'] .aria-gallery-item {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: var(--aria-paper-2);
  cursor: zoom-in;
}
[data-evento-theme='aria-xv'] .aria-gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: scale 0.9s var(--aria-ease);
}
[data-evento-theme='aria-xv'] .aria-gallery-item:hover img {
  scale: 1.03;
}
[data-evento-theme='aria-xv'] .aria-lightbox {
  width: 100vw;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  border: 0;
  background: var(--aria-ink);
}
[data-evento-theme='aria-xv'] .aria-lightbox[open] {
  display: grid;
  place-items: center;
}
[data-evento-theme='aria-xv'] .aria-lightbox::backdrop {
  background: rgb(0 0 0 / 0.85);
}
[data-evento-theme='aria-xv'] .aria-lightbox img {
  max-width: 100vw;
  max-height: 100dvh;
  object-fit: contain;
}
[data-evento-theme='aria-xv'] .aria-lightbox-top {
  position: absolute;
  inset: 1rem 1rem auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
}
[data-evento-theme='aria-xv'] .aria-lightbox-count {
  margin: 0 auto 0 0;
  color: var(--aria-paper);
  font: 500 var(--aria-label-size) / 1 var(--aria-sans);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}
[data-evento-theme='aria-xv'] .aria-lightbox-close {
  border-color: var(--aria-paper);
  background: var(--aria-paper);
  color: var(--aria-ink);
}
/* Flechas a los lados, sobre la foto: en el teléfono la foto ocupa el ancho
   completo y no queda margen donde ponerlas. Un velo detrás del trazo las
   separa de fotos claras. */
[data-evento-theme='aria-xv'] .aria-lightbox-nav {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgb(0 0 0 / 0.35);
  color: var(--aria-paper);
  cursor: pointer;
  transition: background 0.2s ease;
}
[data-evento-theme='aria-xv'] .aria-lightbox-nav:is(:hover, :focus-visible) {
  background: rgb(0 0 0 / 0.6);
}
[data-evento-theme='aria-xv'] .aria-lightbox-nav:focus-visible {
  outline: 2px solid var(--aria-paper);
  outline-offset: 2px;
}
[data-evento-theme='aria-xv'] .aria-lightbox-nav svg {
  width: 1.25rem;
  height: 1.25rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
[data-evento-theme='aria-xv'] .aria-lightbox-prev {
  left: 0.75rem;
}
[data-evento-theme='aria-xv'] .aria-lightbox-next {
  right: 0.75rem;
}

/* Cierre */
[data-evento-theme='aria-xv'] .aria-footer .aria-inner {
  gap: 0.75rem;
  padding-top: 2rem;
}

/* Calendario del mes. Números en serif con cifras de altura uniforme
   —Cormorant trae por defecto las de estilo antiguo, que en una rejilla
   bailan— y el día del evento en un círculo fino, como en los calendarios
   impresos. El círculo no es la única señal: la celda lleva
   `aria-current="date"`. */
[data-evento-theme='aria-xv'] .aria-calendar {
  margin: 0 auto 2rem;
  border-collapse: collapse;
  color: var(--aria-muted);
  font: 400 1rem/1 var(--aria-serif);
  font-variant-numeric: lining-nums tabular-nums;
}
[data-evento-theme='aria-xv'] .aria-calendar-month {
  padding-bottom: 1rem;
  color: var(--aria-ink);
  font: 600 var(--aria-label-size) / 1.5 var(--aria-sans);
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .aria-calendar th {
  padding: 0 0 0.6rem;
  color: var(--aria-tint);
  /* Las iniciales de los días son información, no adorno: a 0.62rem (9.9 px)
     no se leían. */
  font: 600 var(--aria-label-size) / 1 var(--aria-sans);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .aria-calendar :is(th, td) {
  width: 2.5rem;
  height: 2.2rem;
  text-align: center;
}
[data-evento-theme='aria-xv'] .aria-calendar-on {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--aria-tint);
  border-radius: 50%;
  color: var(--aria-ink);
}
[data-evento-theme='aria-xv'] .aria-footer .aria-rule {
  margin-bottom: 2rem;
}
[data-evento-theme='aria-xv'] .aria-footer-name {
  font: italic 400 clamp(2.6rem, 11vw, 4rem) / 1 var(--aria-serif);
}
[data-evento-theme='aria-xv'] .aria-footer .aria-button {
  margin-top: 1.25rem;
}

/* Firma de Clikify (ADR-074): la voz de las etiquetas, más baja y sin color
   propio. Queda al final, separada del cierre de la familia. */
[data-evento-theme='aria-xv'] .aria-credit {
  margin: 3.5rem 0 0;
  font: 500 0.68rem / 1.5 var(--aria-sans);
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .aria-credit a {
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  min-height: 44px;
  color: var(--aria-tint);
  opacity: 0.7;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
[data-evento-theme='aria-xv'] .aria-credit a:is(:hover, :focus-visible) {
  opacity: 1;
}
[data-evento-theme='aria-xv'] .aria-credit span {
  font-weight: 700;
  letter-spacing: 0.14em;
}

/* Compartir (lo pinta la página, fuera del artículo) */
[data-evento-theme='aria-xv'] .xv-share {
  gap: 0.6rem;
  padding: 2.5rem var(--aria-gutter) 3.5rem;
  border-top: 1px solid var(--aria-line);
  background: var(--aria-paper);
  color: var(--aria-ink);
}
[data-evento-theme='aria-xv'] .xv-share button {
  min-height: 3rem;
  padding: 0 1.6rem;
  border: 1px solid var(--aria-tint);
  border-radius: 2px;
  background: var(--aria-tint);
  color: var(--aria-paper);
  font: 600 var(--aria-action-size) / 1.4 var(--aria-sans);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .xv-share :is(.secondary, a) {
  border: 0;
  background: transparent;
  color: var(--aria-tint);
  font: 600 var(--aria-action-size) / 1.4 var(--aria-sans);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
}
[data-evento-theme='aria-xv'] .xv-share p {
  color: var(--aria-muted);
  font-size: 0.85rem;
}

/* Formulario de respuesta (lo pinta la página del enlace personal) */
[data-evento-theme='aria-xv'] .xv-rsvp {
  max-width: none;
  margin: 0;
  padding: clamp(4rem, 12vw, 6rem) var(--aria-gutter);
  background: var(--aria-paper-2);
  color: var(--aria-ink);
  font-family: var(--aria-sans);
  text-align: center;
}
[data-evento-theme='aria-xv'] .xv-rsvp .xv-eyebrow {
  color: var(--aria-tint);
  font: 600 var(--aria-label-size) / 1.5 var(--aria-sans);
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .xv-rsvp-hint {
  margin: 0.5rem 0 2rem;
  color: var(--aria-muted);
  opacity: 1;
}
[data-evento-theme='aria-xv'] .xv-rsvp .rsvp-card {
  gap: 1.25rem;
  max-width: 30rem;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--aria-ink);
  box-shadow: none;
  text-align: left;
}
[data-evento-theme='aria-xv'] .rsvp-card :where(h1, h2) {
  color: var(--aria-ink);
  font: 400 var(--aria-title-size) / 1.15 var(--aria-serif);
  text-align: center;
}
[data-evento-theme='aria-xv'] .rsvp-card > .rsvp-hint {
  text-align: center;
}
[data-evento-theme='aria-xv'] .rsvp-hint {
  color: var(--aria-muted);
}
[data-evento-theme='aria-xv'] .rsvp-card label {
  font-weight: 600;
}
[data-evento-theme='aria-xv'] .rsvp-choice .choice {
  border: 1px solid var(--aria-line);
  border-radius: 2px;
  background: var(--aria-paper);
}
[data-evento-theme='aria-xv'] .rsvp-choice .choice-on {
  border-color: var(--aria-tint);
  background: var(--aria-paper);
  box-shadow: inset 0 0 0 1px var(--aria-tint);
}
[data-evento-theme='aria-xv'] .rsvp-card :where(select, textarea, input) {
  width: 100%;
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--aria-line);
  border-radius: 2px;
  background: var(--aria-paper);
  color: inherit;
  font: inherit;
  font-weight: 400;
}
[data-evento-theme='aria-xv'] .rsvp-card button:not(.link) {
  min-height: 3rem;
  padding: 0 1.6rem;
  border: 1px solid var(--aria-tint);
  border-radius: 2px;
  background: var(--aria-tint);
  color: var(--aria-paper);
  font: 600 var(--aria-action-size) / 1.4 var(--aria-sans);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
[data-evento-theme='aria-xv'] .rsvp-card button:disabled {
  opacity: 0.5;
}
[data-evento-theme='aria-xv'] .rsvp-note {
  border-left: 2px solid var(--aria-tint);
  border-radius: 0;
  background: var(--aria-paper);
  color: var(--aria-ink);
}
[data-evento-theme='aria-xv'] .rsvp-note-error {
  border-left-color: #a32020;
}
[data-evento-theme='aria-xv'] .rsvp-legal {
  border-top: 1px solid var(--aria-line);
  color: var(--aria-muted);
}
[data-evento-theme='aria-xv'] :is(.rsvp-card, .rsvp-legal, .rsvp-hint) a {
  color: var(--aria-tint);
}

/* Pase y álbum: sólo la paleta y la voz tipográfica. */
.pass-page[data-evento-theme='aria-xv'] {
  background: var(--aria-paper-2);
  font-family: var(--aria-sans);
}
.pass-page[data-evento-theme='aria-xv'] .pass-card {
  border: 1px solid var(--aria-line);
  /* 2 px como todo lo demás: la hoja base lo pinta con 20 px y esquinas de
     panel, que en esta invitación se leen como de otra aplicación. */
  border-radius: 2px;
  background: var(--aria-paper);
  color: var(--aria-ink);
  box-shadow: none;
}
.pass-page[data-evento-theme='aria-xv'] .pass-event {
  color: var(--aria-tint);
  letter-spacing: 0.2em;
}
.pass-page[data-evento-theme='aria-xv'] .pass-card h1 {
  color: var(--aria-ink);
  font: italic 400 clamp(2.6rem, 12vw, 4rem) / 1 var(--aria-serif);
}
.pass-page[data-evento-theme='aria-xv'] .pass-count {
  color: var(--aria-tint);
  font: 400 1.4rem/1.2 var(--aria-serif);
}
.pass-page[data-evento-theme='aria-xv'] .pass-qr {
  border-color: var(--aria-line);
  border-radius: 2px;
  background: white;
}
.pass-page[data-evento-theme='aria-xv'] a {
  color: var(--aria-tint);
}
.album-page[data-evento-theme='aria-xv'] {
  background: var(--aria-paper-2);
}
.album-page[data-evento-theme='aria-xv'] main {
  border: 1px solid var(--aria-line);
  border-radius: 2px;
  background: var(--aria-paper);
  color: var(--aria-ink);
  font-family: var(--aria-sans);
  box-shadow: none;
}
.album-page[data-evento-theme='aria-xv'] .album-head {
  padding-block: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--aria-line);
}
.album-page[data-evento-theme='aria-xv'] .guest-head-aria :is(.aria-footer-name, .aria-label) {
  margin: 0;
}
.album-page[data-evento-theme='aria-xv'] .album-head h1 {
  color: var(--aria-ink);
  font: 400 var(--aria-title-size) / 1.15 var(--aria-serif);
}
.album-page[data-evento-theme='aria-xv'] :is(.album-gallery-block h2, .album-upload h2) {
  color: var(--aria-ink);
  font: 400 var(--aria-heading-size) / 1.15 var(--aria-serif);
}
.album-page[data-evento-theme='aria-xv'] .album-head .eyebrow {
  color: var(--aria-tint);
  font-size: var(--aria-label-size);
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
.album-page[data-evento-theme='aria-xv'] :is(.album-upload, .album-empty) {
  border: 1px solid var(--aria-line);
  border-radius: 2px;
  background: var(--aria-paper);
}
.album-page[data-evento-theme='aria-xv'] :is(.album-picker span, .album-retry-all) {
  border-color: var(--aria-tint);
  border-radius: 2px;
  background: var(--aria-tint);
  color: var(--aria-paper);
}
.album-page[data-evento-theme='aria-xv'] .album-gallery button {
  border-radius: 2px;
}
.album-page[data-evento-theme='aria-xv'] .album-window {
  border-color: var(--aria-line);
}
.album-page[data-evento-theme='aria-xv'] .album-window-icon {
  color: var(--aria-gold-ink);
}
.album-page[data-evento-theme='aria-xv'] .album-window h2 {
  color: var(--aria-ink);
  font: 400 clamp(1.6rem, 5.5vw, 2rem) / 1.25 var(--aria-serif);
}
.album-page[data-evento-theme='aria-xv'] .album-window time {
  color: var(--aria-gold-ink);
}
.album-page[data-evento-theme='aria-xv'] .album-picker input:not(:disabled) + span {
  background: var(--aria-gold-fill);
  color: var(--aria-on-gold);
}
.album-page[data-evento-theme='aria-xv'] .album-picker input:disabled + span {
  background: var(--aria-paper-2);
  color: var(--aria-ink);
  border-color: var(--aria-line);
  cursor: not-allowed;
}
.album-page[data-evento-theme='aria-xv'] .album-field input {
  border-radius: 2px;
  border-color: var(--aria-line);
}

/* Cormorant trae números de estilo antiguo: «12» se leía «I 2». Va después de
   los componentes porque el atajo `font:` restablece `font-variant-numeric`. */
[data-evento-theme='aria-xv']
  :is(
    .aria-venue-time,
    .aria-schedule-time,
    .aria-countdown-value,
    .aria-veil-sign,
    .aria-personal-seats
  ) {
  font-variant-numeric: lining-nums;
}
[data-evento-theme='aria-xv'] .aria-countdown-value {
  font-variant-numeric: lining-nums tabular-nums;
}

/* Movimiento */
@media (prefers-reduced-motion: no-preference) {
  html[data-aria-velo='pendiente'] {
    --aria-veil-delay: 1.3s;
  }
  html[data-aria-motion='ok'] [data-evento-theme='aria-xv'] .aria-hero-text > * {
    animation: aria-rise 1.1s var(--aria-ease) var(--aria-veil-delay, 0s) both;
  }
  html[data-aria-motion='ok'] [data-evento-theme='aria-xv'] .aria-hero-text > :nth-child(2) {
    animation-delay: calc(var(--aria-veil-delay, 0s) + 0.15s);
  }
  html[data-aria-motion='ok'] [data-evento-theme='aria-xv'] .aria-hero-text > :nth-child(3) {
    animation-delay: calc(var(--aria-veil-delay, 0s) + 0.3s);
  }
  html[data-aria-motion='ok'] [data-evento-theme='aria-xv'] .aria-hero-img {
    animation: aria-settle 10s cubic-bezier(0.25, 0.1, 0.25, 1) var(--aria-veil-delay, 0s) both;
  }
  html[data-aria-motion='ok'] [data-evento-theme='aria-xv'] .aria-scroll-cue {
    animation: aria-rise 1.1s var(--aria-ease) calc(var(--aria-veil-delay, 0s) + 0.9s) both;
  }
  [data-evento-theme='aria-xv'] .aria-will-reveal {
    opacity: 0;
    translate: 0 0.75rem;
    transition:
      opacity 0.9s var(--aria-ease),
      translate 0.9s var(--aria-ease);
  }
  [data-evento-theme='aria-xv'] .aria-will-reveal.is-visible {
    opacity: 1;
    translate: 0;
  }
  html[data-aria-motion='ok'] [data-evento-theme='aria-xv'] .aria-scroll-cue::after {
    animation: aria-cue 2.4s var(--aria-ease) 2.5s infinite;
  }
  /* La cifra que cambia baja y se asienta. */
  [data-evento-theme='aria-xv'] .aria-countdown-value.is-tick {
    animation: aria-tick 0.35s var(--aria-ease);
  }
  /* El rombo se dibuja: las dos líneas crecen desde el centro. */
  [data-evento-theme='aria-xv'] .aria-will-reveal .aria-rule::before,
  [data-evento-theme='aria-xv'] .aria-will-reveal .aria-rule::after {
    scale: 0 1;
    transition: scale 1.1s var(--aria-ease) 0.2s;
  }
  [data-evento-theme='aria-xv'] .aria-will-reveal .aria-rule::before {
    transform-origin: right;
  }
  [data-evento-theme='aria-xv'] .aria-will-reveal .aria-rule::after {
    transform-origin: left;
  }
  [data-evento-theme='aria-xv'] .aria-will-reveal.is-visible .aria-rule::before,
  [data-evento-theme='aria-xv'] .aria-will-reveal.is-visible .aria-rule::after {
    scale: 1 1;
  }
  /* Aparición escalonada de nombres, momentos del día y fotos. */
  [data-evento-theme='aria-xv']
    .aria-will-reveal
    :is(.aria-names > li, .aria-schedule-row, .aria-gallery-grid > li) {
    opacity: 0;
    translate: 0 0.5rem;
    transition:
      opacity 0.8s var(--aria-ease) var(--aria-stagger, 0s),
      translate 0.8s var(--aria-ease) var(--aria-stagger, 0s);
  }
  [data-evento-theme='aria-xv']
    .aria-will-reveal.is-visible
    :is(.aria-names > li, .aria-schedule-row, .aria-gallery-grid > li) {
    opacity: 1;
    translate: 0;
  }
  [data-evento-theme='aria-xv']
    :is(.aria-names, .aria-schedule, .aria-gallery-grid)
    > :nth-child(2) {
    --aria-stagger: 0.1s;
  }
  [data-evento-theme='aria-xv']
    :is(.aria-names, .aria-schedule, .aria-gallery-grid)
    > :nth-child(3) {
    --aria-stagger: 0.2s;
  }
  [data-evento-theme='aria-xv']
    :is(.aria-names, .aria-schedule, .aria-gallery-grid)
    > :nth-child(4) {
    --aria-stagger: 0.3s;
  }
  [data-evento-theme='aria-xv']
    :is(.aria-names, .aria-schedule, .aria-gallery-grid)
    > :nth-child(5) {
    --aria-stagger: 0.4s;
  }
  [data-evento-theme='aria-xv']
    :is(.aria-names, .aria-schedule, .aria-gallery-grid)
    > :nth-child(n + 6) {
    --aria-stagger: 0.5s;
  }
  /* Las fotos se asientan con un leve zoom al entrar; no se desvanecen. */
  [data-evento-theme='aria-xv'] img.aria-will-zoom,
  [data-evento-theme='aria-xv'] .aria-will-zoom img {
    scale: 1.04;
    transition: scale 1.8s var(--aria-ease);
  }
  [data-evento-theme='aria-xv'] img.aria-will-zoom.is-visible,
  [data-evento-theme='aria-xv'] .aria-will-zoom.is-visible img {
    scale: 1;
  }
  [data-evento-theme='aria-xv'] .aria-music.is-playing svg {
    animation: aria-pulse 1.6s ease-in-out infinite;
  }
  @keyframes aria-rise {
    from {
      opacity: 0;
      translate: 0 0.75rem;
    }
  }
  @keyframes aria-settle {
    from {
      scale: 1.06;
    }
  }
  @keyframes aria-veil {
    0%,
    55% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      visibility: hidden;
    }
  }
  @keyframes aria-tick {
    from {
      opacity: 0.2;
      translate: 0 -0.25em;
    }
  }
  @keyframes aria-cue {
    0% {
      scale: 1 0;
      opacity: 1;
    }
    60% {
      scale: 1 1;
      opacity: 1;
    }
    100% {
      scale: 1 1;
      opacity: 0;
    }
  }
  @keyframes aria-pulse {
    50% {
      scale: 0.85;
    }
  }
}

/* Escritorio: pantalla completa. Los fondos y las fotos van de orilla a orilla;
   el texto se queda en la columna de `.aria-inner`. */
@media (min-width: 48rem) {
  [data-evento-theme='aria-xv'],
  [data-evento-theme='aria-xv'] .aria-experience {
    --aria-label-size: 0.8rem;
    --aria-action-size: 0.8rem;
  }
  /* El retrato completo ocupa el centro; sus bordes se funden con el vino.
     No ampliarlo con cover: cortaba el vestido y ponía el título en el rostro. */
  [data-evento-theme='aria-xv'] .aria-hero {
    padding-bottom: 5.5rem;
  }
  [data-evento-theme='aria-xv'] .aria-hero-scene {
    left: 50%;
    right: auto;
    width: min(100%, 75svh);
    height: 100%;
    translate: -50%;
    mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);
  }
  [data-evento-theme='aria-xv'] .aria-hero-img {
    object-fit: contain;
    object-position: top center;
    animation: none;
  }
  [data-evento-theme='aria-xv'] .aria-hero-photo::after {
    background: linear-gradient(
      to bottom,
      transparent 40%,
      color-mix(in srgb, var(--aria-wine) 65%, transparent) 56%,
      var(--aria-wine) 88%
    );
  }
  [data-evento-theme='aria-xv'] .aria-hero-name {
    /* El mínimo coincide con el máximo móvil para evitar saltos de tamaño. */
    font-size: clamp(8rem, 11vw, 10rem);
  }
  [data-evento-theme='aria-xv'] .aria-veil-name {
    /* El velo acompaña al nombre: sin esto se quedaba en 8rem mientras el
       nombre llegaba a 9.5, y el velo se disolvía en algo más pequeño que él. */
    font-size: clamp(7rem, 12vw, 10.5rem);
  }
  [data-evento-theme='aria-xv'] .aria-photo-still {
    /* Conserva la forma vertical del móvil. Con `height: 88svh` a todo el
       ancho, la caja pasaba de 0.8 a 1.82 de proporción: la misma foto se veía
       entera en el teléfono y decapitada en el portátil. Aquí manda el alto y
       el ancho lo sigue, así que la foto deja de ir a sangre y se centra: es el
       precio de que se vea completa. */
    height: 88svh;
    width: auto;
    margin-inline: auto;
  }
  /* El cuerpo crece con la pantalla. Antes sólo escalaban los títulos: la
     relación entre el nombre de la portada y el texto corriente pasaba de 4,6×
     en el teléfono a 9,5× en el portátil, y las direcciones y los botones
     quedaban diminutos bajo títulos enormes. */
  [data-evento-theme='aria-xv'] .aria-text,
  [data-evento-theme='aria-xv'] .aria-calendar {
    font-size: 1.1rem;
  }
  [data-evento-theme='aria-xv'] .aria-quote footer {
    font-size: 0.95rem;
  }
  [data-evento-theme='aria-xv'] .aria-button {
    min-height: 3.25rem;
    padding-inline: 1.9rem;
  }
  [data-evento-theme='aria-xv'] .aria-schedule-label {
    font-size: 1.15rem;
  }
  [data-evento-theme='aria-xv'] .aria-schedule-time {
    font-size: 1.7rem;
  }
  [data-evento-theme='aria-xv'] .aria-gallery-grid {
    --aria-gallery-gap: 0.75rem;
    padding-inline: var(--aria-gutter);
  }
  [data-evento-theme='aria-xv'] .aria-gallery-grid[data-columns='3'] {
    columns: 3;
  }
  [data-evento-theme='aria-xv'] .aria-gallery-grid[data-layout='grid'][data-columns='3'] {
    --aria-gallery-columns: 3;
    columns: auto;
  }
  /* En escritorio la sobrante conserva su ancho y la fila se centra: a todo
     el ancho, una foto vertical ocuparía más de una pantalla. */
  [data-evento-theme='aria-xv']
    .aria-gallery-grid[data-layout='grid']
    li:last-child:nth-child(odd) {
    flex-basis: calc(
      (100% - (var(--aria-gallery-columns) - 1) * var(--aria-gallery-gap)) /
        var(--aria-gallery-columns)
    );
  }
  /* Dos columnas a todo lo ancho harían cada foto enorme. */
  [data-evento-theme='aria-xv'] .aria-gallery-grid[data-columns='2'] {
    max-width: calc(64rem + 2 * var(--aria-gutter));
  }
  [data-evento-theme='aria-xv'] .aria-lightbox-prev {
    left: 1.5rem;
  }
  [data-evento-theme='aria-xv'] .aria-lightbox-next {
    right: 1.5rem;
  }
  [data-evento-theme='aria-xv'] .aria-interlude {
    min-height: 44rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
  }
  [data-evento-theme='aria-xv'] .aria-interlude .aria-interlude-img {
    justify-self: center;
    width: auto;
    max-width: 100%;
    height: 44rem;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center;
    mask-image: linear-gradient(to right, transparent, #000 8%, #000 82%, transparent);
  }
  [data-evento-theme='aria-xv'] .aria-interlude-floral .aria-interlude-img {
    width: 100%;
    object-fit: cover;
  }
  [data-evento-theme='aria-xv'] .aria-interlude-caption {
    grid-area: 1 / 2;
    padding: 4rem var(--aria-gutter);
  }
}

/* ——— v5: lo que la familia pidió a partir de su mock ———
   Iconos de línea en oro junto al rótulo de cada sección, «Cómo llegar» en oro
   con su icono, la hora de las sedes en oro, un filo de oro en las fotos de sede,
   la cruz sobre la bendición y las frases de la cuenta regresiva. El papel sigue
   claro y el vino sigue siendo la tinta: el oro acompaña, no manda. */
[data-evento-theme='aria-xv'] .aria-icon {
  flex: none;
  width: 1.25rem;
  height: 1.25rem;
}
[data-evento-theme='aria-xv'] .aria-label-icon {
  display: grid;
  justify-items: center;
  gap: 0.7rem;
}
[data-evento-theme='aria-xv'] .aria-label-icon .aria-icon {
  width: 2rem;
  height: 2rem;
  color: var(--aria-gold-ink);
}
[data-evento-theme='aria-xv'] .aria-button .aria-icon {
  width: 1.05rem;
  height: 1.05rem;
  margin-right: 0.6rem;
  stroke-width: 1.5;
}
[data-evento-theme='aria-xv'] .aria-button-gold {
  border-color: var(--aria-gold-fill);
  background: var(--aria-gold-fill);
  color: var(--aria-on-gold);
}
[data-evento-theme='aria-xv'] .aria-button-gold:hover {
  border-color: var(--aria-gold);
  background: var(--aria-gold);
}
/* El secundario deja el vino: junto a un botón de oro, el borde vino hacía dos
   acentos en el mismo bloque. Borde de oro y letra en tinta, que sobre papel
   pasa AA a tamaño de botón; el oro como letra no llegaría. */
[data-evento-theme='aria-xv'] .aria-button-quiet {
  border-color: var(--aria-gold);
  color: var(--aria-ink);
}
[data-evento-theme='aria-xv'] .aria-button-quiet:hover {
  border-color: var(--aria-gold-ink);
  background: color-mix(in srgb, var(--aria-gold) 8%, transparent);
}
[data-evento-theme='aria-xv'] .aria-venue-time {
  color: var(--aria-gold-ink);
}
[data-evento-theme='aria-xv'] .aria-venue-photo {
  padding: 5px;
  border: 1px solid var(--aria-gold);
}
[data-evento-theme='aria-xv'] .aria-icon-cross {
  width: 2.25rem;
  height: 2.25rem;
  color: var(--aria-gold-ink);
}
[data-evento-theme='aria-xv'] .aria-family-title-rest {
  display: block;
}
[data-evento-theme='aria-xv'] .aria-countdown-lead {
  max-width: 24rem;
  margin-bottom: 1.5rem;
  font: italic 400 var(--aria-prose-size) / 1.45 var(--aria-serif);
}
[data-evento-theme='aria-xv'] .aria-motto {
  margin-top: 1.5rem;
  color: var(--aria-muted);
  font: 500 var(--aria-label-size) / 1.6 var(--aria-sans);
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
/* Los dos encabezados dorados comparten familia, escala y ritmo. La caligrafía
   permanece reservada al nombre de portada y «Mis XV años» del interludio. */
[data-evento-theme='aria-xv'] :is(.aria-countdown-title, .aria-quote-title) {
  color: var(--aria-gold-ink);
  font: italic 400 var(--aria-heading-size) / 1.15 var(--aria-serif);
  letter-spacing: normal;
  text-wrap: balance;
}
[data-evento-theme='aria-xv'] .aria-quote-long p {
  font-size: var(--aria-prose-size);
  line-height: 1.45;
}
/* El filete y las horas pasan al oro: con iconos y botones en oro, el rombo
   vino y las horas del itinerario en vino hacían dos acentos para la misma
   función. El vino queda para los rótulos, el botón principal y el día marcado. */
[data-evento-theme='aria-xv'] .aria-rule {
  color: var(--aria-gold-ink);
}
[data-evento-theme='aria-xv'] .aria-rule::before,
[data-evento-theme='aria-xv'] .aria-rule::after {
  background: color-mix(in srgb, var(--aria-gold) 45%, transparent);
}
[data-evento-theme='aria-xv'] .aria-schedule-time {
  color: var(--aria-gold-ink);
}
[data-evento-theme='aria-xv'] .aria-schedule-row::after {
  border-color: var(--aria-gold-ink);
}
/* La foto de sede cierra con su filo de oro; el icono pegado a él se leía como
   parte del marco. */
[data-evento-theme='aria-xv'] .aria-venue-photo + .aria-label-icon {
  margin-top: 0.75rem;
}
