@font-face {
  font-family: "Slight";
  src: url("./slight-regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --bg: #F7E7CE;           /* Champán */
  --bg-soft: #EBD3B9;      /* Beige cálido */
  --text: #442C2A;         /* Café oscuro */
  --accent: #C9644A;       /* Terracota */
  --accent-dark: #A97155;  /* Canela suave */
  --olive: #8A9A7B;        /* Verde oliva */
  --gold: #D4AF37;         /* Dorado suave */

  --white: #ffffff;
  --shadow: 0 10px 30px rgba(68, 44, 42, 0.12);
  --radius: 24px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}



img {
  width: 100%;
  display: block;
  border-radius: 18px;
  object-fit: cover;
}

a {
  text-decoration: none;
}

.hidden {
  display: none;
}

.container {
  width: min(92%, 1100px);
  margin: 0 auto;
}

.section {
  padding: 80px 0;
}

/* ===== ALTERNATING SECTION COLORS (RESTORED PATTERN) ===== */
.site > section:nth-of-type(odd) {
  background: var(--bg);
}

.site > section:nth-of-type(even) {
  background: var(--bg-soft);
}

.section--soft {
  background: var(--bg-soft);
}

.section-title {

  font-family: "Antic Didone", serif;

  font-size: clamp(3rem, 6vw, 4.5rem);

  text-align: center;

  margin-bottom: 50px;

  font-weight: 400;

}

.tag {
  text-transform: uppercase;
  letter-spacing: 4px;
  font-size: 0.85rem;
  color: var(--accent-dark);
  margin-bottom: 10px;
}

.btn {
  display: inline-block;
  background: var(--accent);
  color: var(--white);
  padding: 16px 34px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  font-weight: 600;
  letter-spacing: 0.5px;
  transition: transform 0.25s ease, background 0.25s ease;
  margin: 12px;
}

.btn:hover {
  transform: translateY(-2px);
  background: var(--accent-dark);
}

.btn--light {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(8px);
}

.btn--dark {
  background: var(--olive);
}

.card {
  background: var(--white);
  padding: 32px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-align: center;
  max-width: 760px;
  margin: 0 auto;
}

.card__big {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 12px;
}

.note {
  margin-top: 10px;
  color: var(--accent-dark);
}



/* Intro pantalla completa */
.intro {
  position: fixed;
  inset: 0;
  z-index: 999;
  overflow: hidden;
  display: grid;
  place-items: center;
  text-align: center;
  color: white;
  isolation: isolate;
}

.intro .tag {
  font-family: "Poppins", sans-serif;
  letter-spacing: 6px;
  font-size: 0.95rem;
  font-weight: 500;
  text-transform: uppercase;
}

.intro .names {
  font-family: "Antic Didone", serif;
  font-size: clamp(4.5rem, 10vw, 8rem);
  line-height: 1.05;
  letter-spacing: 3px;
  text-shadow: 0 4px 20px rgba(0,0,0,0.25);
}

.hero__text {
  font-family: "Antic Didone", serif;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 300;
  line-height: 1.1;
}
.intro .hero__date {
  font-family: "Poppins", sans-serif;
  font-size: 1.15rem;
  font-weight: 400;
  letter-spacing: 1px;
}

.intro .hero__date {
  margin-top: 16px;
  font-weight: 600;
}

.intro .btn {
  margin-top: 28px;
  font-size: 1rem;
  padding: 18px 38px;
  letter-spacing: 1px;
}

/* Fondo principal */
.intro::before,
.intro::after {
  content: "";
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: opacity 2s ease-in-out, transform 8s ease;
  z-index: -1;
}

/* Imagen visible */
.intro::before {
  opacity: 1;
}

/* Imagen que entra */
.intro::after {
  opacity: 0;
}

/* Cuando se abre */
.intro.hide {
  transform: translateY(-100%);
  opacity: 0;
}

/* Indicador animado */
.scroll-indicator {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
}

.scroll-indicator span {
  display: block;
  width: 26px;
  height: 40px;
  border: 2px solid white;
  border-radius: 20px;
  position: relative;
}

.scroll-indicator span::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  width: 6px;
  height: 6px;
  background: white;
  border-radius: 50%;
  transform: translateX(-50%);
  animation: scrollAnim 1.6s infinite;
}

@keyframes scrollAnim {
  0% { opacity: 0; transform: translate(-50%, 0); }
  50% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, 14px); }
}

/* Contenido */
.site {
  position: relative;
  z-index: 1;
  opacity: 0;
  transition: opacity 1.2s ease, transform 1.2s ease;
}

.site.show {
  opacity: 1;
}

/* Music button */
.music-btn {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: none;
  background: var(--text);
  color: var(--white);
  font-size: 1.2rem;
  cursor: pointer;
  z-index: 1000;
  box-shadow: var(--shadow);
}

/* Hero */
.hero {
  min-height: 100vh;
  display: grid;
  place-items: center;
  text-align: center;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Capas del fondo */
.hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: opacity 2s ease-in-out, transform 8s ease;
  z-index: -1;
}




.hero__date {
  font-size: 1.05rem;
}



.hero__date {
  margin-top: 10px;
  font-weight: 600;
  color: var(--accent-dark);
}


/* Gallery */

/* Locations */
.locations .container {
  display: grid;
  gap: 22px;
}

.location-card {
  background: var(--white);
  padding: 30px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-align: center;
}

.location-card h4 {
  font-size: 1.4rem;
  margin-bottom: 10px;
  font-family: "Antic Didone", serif;
  color: var(--accent);
}

/* Mentions */
.mentions__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.mention {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px;
  text-align: center;
}

.mention span {
  display: block;
  font-family: "Antic Didone", serif;
  font-size: 1.6rem;       /* un poco más grande */
  color: var(--accent-dark);
  margin-bottom: 8px;
  letter-spacing: 0.12em;  /* más elegante */
  font-weight: 500;
}

.parents-names span:not(.parents-and) {
  font-family: "Antic Didone", serif;
  font-size: 1.5rem;
  letter-spacing: 0.1em;
  color: var(--text) !important;
}
/* RSVP */
.rsvp {
  text-align: center;
  background: inherit;
  color: var(--text);
}

.rsvp .section-title,
.rsvp .rsvp__text,
.rsvp p,
.rsvp h1,
.rsvp h2,
.rsvp h3,
.rsvp h4 {
  color: var(--text);
}

.rsvp__text {
  margin-bottom: 18px;
}

/* Footer */
.footer {
  padding: 30px 20px 50px;
  text-align: center;
  color: var(--accent-dark);
}

/* Responsive */
@media (max-width: 900px) {
  .countdown__grid,
  .mentions__grid,


  .timeline__item {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

@media (max-width: 640px) {
  .section {
    padding: 60px 0;
  }

  .countdown__grid,
  .mentions__grid,


  .card,
  .location-card,
  .timeline__item {
    padding: 22px;
  }
}


.gallery-actions {
  margin-top: 26px;
  display: flex;
  justify-content: center;
}

/* Modal */
.gallery-modal {
  position: fixed;
  inset: 0;

  background: rgba(20,16,13,0.92);

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 40px 20px;

  overflow-y: auto;
  overflow-x: hidden;

  z-index: 999999;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transition: opacity .35s ease;
}



.gallery-modal.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.gallery-modal__content {
  position: relative;

  width: 100%;
  max-width: 1000px;

  margin: auto;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  overflow: visible;
}

.gallery-modal__content img {
  width: auto;
  max-width: 100%;

  height: auto;
  max-height: 90vh;

  object-fit: contain;

  border-radius: 18px;

  background: #fff;

  display: block;
}

.gallery-modal__content p {
  color: #fff;
  margin-top: 14px;
  font-size: 1.1rem;
}

.gallery-modal__close {
  position: fixed;

  top: 18px;
  right: 18px;

  width: 64px;
  height: 64px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: rgba(0,0,0,.9);
  color: #fff;

  border: 3px solid #fff;
  border-radius: 50%;

  font-size: 42px;
  font-weight: bold;
  line-height: 1;

  cursor: pointer;

  z-index: 99999999;

  opacity: 1 !important;
  visibility: visible !important;
}

.gallery-modal__nav {
  position: fixed !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  width: 58px;
  height: 58px;

  border-radius: 50%;
  border: none;

  background: rgba(0, 0, 0, 0.65);
  color: #fff;

  font-size: 1.7rem;
  cursor: pointer;

  z-index: 99999 !important;

  display: flex;
  align-items: center;
  justify-content: center;

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.gallery-modal__nav--left {
  left: 18px !important;
}

.gallery-modal__nav--right {
  right: 18px !important;
}

.gallery-thumbs {
  margin-top: 18px;
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}

.gallery-thumbs img {
  width: 74px;
  height: 74px;
  object-fit: cover;
  border-radius: 10px;
  cursor: pointer;
  opacity: 0.65;
  border: 2px solid transparent;
  transition: 0.25s ease;
  position: relative;
z-index: 1;
}

.gallery-thumbs img.active-thumb {
  opacity: 1;
  border-color: #fff;
  transform: scale(1.05);
}

.intro__label {
  font-family: "Poppins", sans-serif;
  letter-spacing: 6px;
  font-size: 0.95rem;
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 24px;
}

.intro h1 {
  font-family: "Antic Didone", serif;
  font-size: clamp(5rem, 11vw, 8.5rem);
  line-height: 1.05;
  letter-spacing: 3px;
  font-weight: 400;
  text-shadow: 0 4px 20px rgba(0,0,0,0.25);
}

.intro h1 span {
  font-size: 0.9em;
}


/* ===== PINTEREST EDITORIAL TIMELINE ===== */

.timeline {
  position: relative;
  padding: 4rem 0;
  background: #f8f5f1;
  overflow: hidden;
}

.timeline::before {
  content: "";
  position: absolute;
  top: 220px;
  bottom: 120px;
  left: 50%;
  width: 1px;
  background: rgba(201, 100, 74, 0.35);
  transform: translateX(-50%);
}

.timeline-header {
  text-align: center;
  margin-bottom: 1rem;
}

.timeline-tag {
  letter-spacing: 0.35rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  color: var(--accent);
  margin-bottom: 1rem;
}

.timeline-divider {
  margin-bottom: 1.5rem;
  color: var(--gold);
  font-size: 1rem;
}

.timeline-subtitle {
  max-width: 500px;
  margin: auto;
  color: var(--accent-dark);
  line-height: 1.8;
}

.timeline-vertical {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
}

.timeline-event {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.timeline-event__dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--accent);
  margin-bottom: 2rem;
  box-shadow: 0 0 0 8px rgba(201,100,74,0.15);
}

.timeline-event__image {
  position: relative;
  margin-bottom: 1rem;
}

.timeline-event__image::before {
  content: "";
  position: absolute;
  inset: -12px;
  border: 1px solid rgba(180,138,100,0.25);
  z-index: 0;
}

.timeline-event__image img {
  width: 260px;
  height: 340px;
  object-fit: cover;
  position: relative;
  z-index: 1;
  background: white;
  padding: 10px;
  box-shadow: 0 15px 35px rgba(0,0,0,0.08);
}

.timeline-event__hour {
  font-size: 1.5rem;
  letter-spacing: 0.25rem;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 1rem;
}

.timeline-event__content h4 {
  font-family: "Antic Didone", serif;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0.6rem;
  color: #2f2a26;
}

.timeline-event__content p {
  color: #6e655d;
  font-size: 0.95rem;
  letter-spacing: 0.04rem;
}

.timeline-event__icon {
  margin-bottom: 1.5rem;
  font-size: 1.2rem;
  opacity: 0.7;
}

.timeline-event:nth-child(even) .timeline-event__image {
  order: 2;
}

.timeline-event:nth-child(even) .timeline-event__content {
  order: 1;
}

@media (max-width: 768px) {
  .timeline::before {
    left: 50%;
  }

  .timeline-event__image img {
    width: 210px;
    height: 280px;
  }

  .timeline-event__content h4 {
    font-size: 1.6rem;
  }
}

.timeline-event__icon {
  margin-bottom: 0.8rem;
}

.timeline-event__icon img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  filter: grayscale(20%);
  opacity: 0.75;
}

/* ===== TITULO EDITORIAL ===== */

.names {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  text-transform: uppercase;

  font-family: "Antic Didone", serif;

  line-height: 1;

  color: #1f1a17;

  margin-bottom: 20px;
}

.hero .names {
  color: #1f1a17;
}

.intro .names {
  color: #fff;
}

/* nombres */
.top-name,
.bottom-name {
  font-size: clamp(3.5rem, 8vw, 7rem);

  font-weight: 400;

  letter-spacing: clamp(0.4rem, 1.4vw, 1.2rem);
}

/* centro */
.middle {
  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1.8rem;

  font-family: "Antic Didone", serif;

  font-size: clamp(2.8rem, 5vw, 4.5rem);

  text-transform: lowercase;

  margin: 0.2rem 0;
}

.hero .middle {
  color: var(--accent-dark);
}

.hero .middle .line {
  background: var(--accent-dark);
}

.intro .middle {
  color: #fff;
}

.intro .middle .line {
  background: #fff;
}

/* lineas */
.middle .line {
  width: clamp(90px, 18vw, 220px);

  height: 1px;

  background: currentColor;

  opacity: 0.7;
}

/* responsive */
@media (max-width: 640px) {
  .top-name,
  .bottom-name {
    font-size: clamp(2.8rem, 13vw, 4.2rem);

    letter-spacing: 0.35rem;
  }

  .middle {
    gap: 1rem;

    font-size: 2.4rem;
  }

  .middle .line {
    width: 70px;
  }
}

/* Colores correctos para títulos principales */
.intro .names,
.intro .top-name,
.intro .bottom-name,
.intro .middle {
  color: #fff !important;
}

.intro .middle .line {
  background: #fff !important;
}

.hero .names,
.hero .top-name,
.hero .bottom-name {
  color: #1f1a17 !important;
}

.hero .middle {
  color: var(--accent) !important;
}

.hero .middle .line {
  background: var(--accent) !important;
}

/* Fecha principal más grande */
.hero__date,
.intro__date {
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-family: "Antic Didone", serif;
}

/* Fecha más grande en pantalla de desliza para abrir */
.intro .hero__date,
.intro .intro__date,
.intro__content .hero__date,
.intro__content .intro__date {
  font-size: clamp(2.4rem, 5vw, 3.8rem) !important;

  line-height: 1.2;

  letter-spacing: 0.18rem;

  font-weight: 500 !important;
}

/* Nombre estilizado en la invitación abierta */
.hero .names .top-name,
.hero .names .bottom-name {
  font-family: "Antic Didone", serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.35rem !important;
  font-size: clamp(4rem, 9vw, 7rem) !important;
  font-weight: 500 !important;
}

.hero .names .middle {
  font-family: "Antic Didone", serif !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  letter-spacing: 0.3rem !important;
  text-transform: uppercase !important;
}


/* Nombres en minúscula solo en pantalla de desliza para abrir */
.intro .names,
.intro .top-name,
.intro .bottom-name {
  text-transform: none !important;
}

.intro .top-name,
.intro .bottom-name {
  font-family: "Antic Didone", serif !important;
  letter-spacing: 0.05rem !important;
}

/* SOLO para "Nuestra Boda" */
.hero .tag {
  display: block;

  width: fit-content;

  margin: 0 auto 24px;

  text-align: center;

  font-size: clamp(1.15rem, 2.8vw, 1.65rem);

  letter-spacing: 0.42rem;

  font-weight: 500;

  text-transform: uppercase;

  color: var(--accent-dark);
}


/* Quitar líneas SOLO en la invitación abierta */
.hero .middle .line {
  display: none !important;
}


/* =========================
   COUNTDOWN REDISEÑADO
   ESTILO EDITORIAL OLIVA
========================= */

.countdown__grid {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: clamp(0.6rem, 2vw, 1.4rem);
  flex-wrap: nowrap !important;
  padding: 10px 0;
}

/* cada bloque tipo cápsula */
.countdown__item {
  position: relative;
  min-width: 90px;
  padding: 12px 16px;
  border-radius: 14px;

  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(10px);

  border: 1px solid rgba(138, 154, 123, 0.35); /* oliva */

  box-shadow: 0 10px 25px rgba(0,0,0,0.06);

  text-align: center;
  transition: transform .25s ease, box-shadow .25s ease;
}

.countdown__item:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 35px rgba(0,0,0,0.10);
}

/* número */
.countdown__item span {
  display: block;
  font-family: "Antic Didone", serif !important;
  font-size: clamp(1.8rem, 4vw, 3.2rem) !important;
  font-weight: 500;
  color: var(--accent-dark);
  line-height: 1;
  letter-spacing: 0.05em;
}

/* etiqueta */
.countdown__item small {
  display: block;
  margin-top: 6px;
  font-family: "Manrope", sans-serif !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.18rem;
  text-transform: uppercase;
  color: var(--text);
  opacity: 0.75;
}

/* móvil */
@media (max-width: 640px) {
  .countdown__item {
    min-width: 70px;
    padding: 10px 10px;
  }

  .countdown__item span {
    font-size: 1.6rem !important;
  }

  .countdown__item small {
    font-size: 0.6rem !important;
  }
}


@media (max-width: 640px) {
  .countdown__grid {
    gap: 0.7rem;
  }

  .countdown__item span {
    font-size: clamp(1.8rem, 10vw, 3rem) !important;
  }

  .countdown__item small {
    font-size: 0.68rem !important;
    letter-spacing: 0.04rem !important;
  }
}

/* =====================================
   RECUADROS COMPARTIDOS (COUNTDOWN STYLE REUSABLE)
   Dress Code, Ubicaciones, Padres y Padrinos, Mesa de regalos
===================================== */

.info-card {
  position: relative;
  min-width: 90px;
  padding: 12px 16px;
  border-radius: 14px;

  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(10px);

  border: 1px solid rgba(138, 154, 123, 0.35);

  box-shadow: 0 10px 25px rgba(0,0,0,0.06);

  text-align: center;
  transition: transform .25s ease, box-shadow .25s ease;
}

.info-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 35px rgba(0,0,0,0.10);
}

.info-card span {
  display: block;
  font-family: "Antic Didone", serif !important;
  font-size: clamp(1.4rem, 3vw, 2.2rem) !important;
  font-weight: 500;
  color: var(--accent-dark);
  line-height: 1;
}

.info-card small {
  display: block;
  margin-top: 6px;
  font-family: "Manrope", sans-serif !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.18rem;
  text-transform: uppercase;
  color: var(--text);
  opacity: 0.75;
}

@media (max-width: 640px) {
  .info-card {
    min-width: 70px;
    padding: 10px 10px;
  }

  .info-card span {
    font-size: 1.4rem !important;
  }

  .info-card small {
    font-size: 0.6rem !important;
  }
}

/* Título del contador */
.countdown-title {
  display: flex;
  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 0.35rem;

  text-align: center;

  line-height: 1 !important;
}

/* Texto principal */
.countdown-title {
  font-family: "Antic Didone", serif !important;

  font-size: clamp(3.5rem, 7vw, 5.8rem) !important;

  font-weight: 400;

  color: var(--accent-dark);
}

/* Solo faltan */
.countdown-title span {
  display: block;

  font-family: "Poppins", sans-serif !important;

  font-size: clamp(0.85rem, 2vw, 1.05rem) !important;

  font-weight: 400;

  letter-spacing: 0.18rem;

  text-transform: uppercase;

  opacity: 0.75;

  margin-top: -0.2rem;
}

/* Texto debajo del contador */
.countdown-message {
  margin-top: 1.8rem;

  text-align: center;


  font-size: clamp(1rem, 2vw, 2rem);

  font-weight: 400;

  line-height: 1;

  color: var(--accent-dark);
}


/* Reducir espacio antes del título "Itinerario" */
.timeline {
  padding-top: 1.5rem !important;
}

.timeline-header {
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important;
}

/* ===== ENCABEZADO GALERIA ===== */

.gallery-heading {
  text-align: center;

  margin: 0 auto 2.5rem;
}

.gallery-heading p {
  font-family: "Antic Didone", serif;

  font-size: clamp(2rem, 5vw, 3rem);

  font-weight: 400;

  line-height: 1;

  color: var(--accent-dark);

  margin-bottom: 1rem;
}

/* lineas */
.gallery-heading__divider {
  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1rem;

  width: min(78vw, 520px);

  margin: 0 auto;
}

.gallery-heading__divider span:not(.gallery-heading__icon) {
  flex: 1;

  height: 1px;

  background: var(--accent-dark);

  opacity: 0.6;
}

/* icono polaroid */
.gallery-heading__icon {
  position: relative;

  width: 34px;

  height: 28px;

  border: 2px solid var(--accent-dark);

  border-radius: 4px;

  transform: rotate(-4deg);
}

.gallery-heading__icon::before {
  content: "";

  position: absolute;

  width: 8px;

  height: 8px;

  border: 2px solid var(--accent-dark);

  border-radius: 50%;

  top: 4px;

  right: 5px;
}

.gallery-heading__icon::after {
  content: "";

  position: absolute;

  left: 5px;

  right: 5px;

  bottom: 5px;

  height: 8px;

  border-left: 2px solid var(--accent-dark);

  border-bottom: 2px solid var(--accent-dark);

  transform: skewX(-28deg);
}

/* responsive */
@media (max-width: 640px) {
  .gallery-heading {
    margin-bottom: 1.8rem;
  }

  .gallery-heading__divider {
    width: min(86vw, 340px);

    gap: 0.7rem;
  }

  .gallery-heading__icon {
    width: 28px;

    height: 23px;
  }
}

/* ===== DRESS CODE ICONOS ===== */

.dresscode-heading {
  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1rem;

  width: min(78vw, 520px);

  margin: 0 auto 2rem;
}

/* líneas */
.dresscode-heading span {
  flex: 1;

  height: 1px;

  background: var(--accent-dark);

  opacity: 0.6;
}
.dresscode-icon-img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  border-radius: 0;
  opacity: 0.85;
}

/* responsive */
@media (max-width: 640px) {
  .dresscode-heading {
    width: min(88vw, 360px);

    gap: 0.7rem;
  }

  .dress-man {
    transform: scale(0.9);
  }

  .dress-woman {
    transform: scale(0.9);
  }
}

/* ===== UBICACIONES ICONO ===== */

.locations-heading {
  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1rem;

  width: min(78vw, 520px);

  margin: 0 auto 2rem;
}

/* lineas */
.locations-heading span {
  flex: 1;

  height: 1px;

  background: var(--accent-dark);

  opacity: 0.6;
}

/* icono */
.locations-icon-img {
  width: 44px;

  height: 44px;

  object-fit: contain;

  opacity: 0.9;
}

/* responsive */
@media (max-width: 640px) {
  .locations-heading {
    width: min(86vw, 340px);

    gap: 0.7rem;
  }

  .locations-icon-img {
    width: 38px;

    height: 38px;
  }
}


.parents-and {
  color: var(--accent-dark) !important;
}


/* Reducir separación entre títulos, logos y contenido */
.gallery-heading {
  margin-bottom: 1.1rem !important;
}

.gallery-heading p {
  margin-bottom: 0.45rem !important;
}

.gallery-heading__divider {
  margin-bottom: 0 !important;
}

.dresscode-heading,
.locations-heading {
  margin-top: -0.8rem !important;
  margin-bottom: 1rem !important;
}

.section-title + .dresscode-heading,
.section-title + .locations-heading {
  margin-top: -1.8rem !important;
}

@media (max-width: 640px) {
  .gallery-heading {
    margin-bottom: 0.9rem !important;
  }

  .gallery-heading p {
    margin-bottom: 0.35rem !important;
  }

  .dresscode-heading,
  .locations-heading {
    margin-top: -1rem !important;
    margin-bottom: 0.8rem !important;
  }

  .section-title + .dresscode-heading,
  .section-title + .locations-heading {
    margin-top: -1.5rem !important;
  }
}



/* ===== FIX ESPACIO BLANCO FINAL ===== */
html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

body {
  display: block;
}

.site {
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}

.site > section:last-of-type {
  margin-bottom: 0 !important;
  padding-bottom: 2rem !important;
}

.footer {
  display: block;
  margin: 0 !important;
  padding: 24px 20px 18px !important;
}

/* El modal no debe generar altura cuando está cerrado */
.gallery-modal:not(.show) {
  display: none !important;
}

.gallery-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: auto !important;
}



/* ===== EFECTO APARICION AL HACER SCROLL ===== */

.reveal {
  opacity: 0;
  transform: translateY(30px) scale(0.92);
  filter: blur(6px);
  transition:
    opacity 0.9s ease,
    transform 0.9s ease,
    filter 0.9s ease;
  will-change: opacity, transform, filter;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

/* variaciones opcionales */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.25s; }
.reveal-delay-3 { transition-delay: 0.4s; }


/* ===== REVEAL DESDE LA IZQUIERDA ===== */
.reveal-left {
  opacity: 0;
  transform: translateX(-80px) scale(0.95);
  filter: blur(6px);
  transition: all 0.9s ease;
}

.reveal-left.active {
  opacity: 1;
  transform: translateX(0) scale(1);
  filter: blur(0);
}

/* ===== REVEAL DESDE LA DERECHA ===== */
.reveal-right {
  opacity: 0;
  transform: translateX(80px) scale(0.95);
  filter: blur(6px);
  transition: all 0.9s ease;
}

.reveal-right.active {
  opacity: 1;
  transform: translateX(0) scale(1);
  filter: blur(0);
}

/* ===== DIVISOR RSVP ===== */

.rsvp-divider {
  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1rem;

  width: min(78vw, 520px);

  margin: 0 auto 2rem;
}

/* líneas */
.rsvp-divider span {
  flex: 1;

  height: 1px;

  background: var(--accent-dark);

  opacity: 0.6;
}

/* corazón */
.rsvp-heart {
  width: 42px;

  height: 42px;

  object-fit: contain;

  opacity: 0.95;
}

/* responsive */
@media (max-width: 640px) {
  .rsvp-divider {
    width: min(86vw, 340px);

    gap: 0.7rem;
  }

  .rsvp-heart {
    width: 36px;

    height: 36px;
  }
}

.section-title {
  color: var(--text);
  position: relative;
}



.btn {
  background: var(--accent);
  text-transform: uppercase;
letter-spacing: 2px;
}

.btn:hover {
  background: var(--accent-dark);
}





/* ===== REDISEÑO VOGUE ===== */

body{
    font-family:"Manrope",sans-serif;
}

.section-title,
.gallery-heading p,
.countdown-title,
.quote__text,
.hero .top-name,
.hero .bottom-name,
.intro h1{
    font-family:"Antic Didone",serif !important;
}

.section-title{
    text-transform:uppercase;
    letter-spacing:.15em;
    font-size:clamp(2rem,4vw,3.2rem)!important;
}

.quote__text{
    font-style:italic;
    font-size:clamp(1.8rem,4vw,3rem)!important;
    line-height:1.5;
}

.countdown-title{
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:clamp(2rem,4vw,3.2rem)!important;
}

.hero .top-name,
.hero .bottom-name{
    letter-spacing:.45rem!important;
    font-weight:500!important;
}

.hero .middle{
    font-family:"Manrope",sans-serif!important;
    letter-spacing:.35rem!important;
    font-size:1rem!important;
}



.card,
.location-card,
.mention{
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(12px);
    border-radius:12px!important;
}

.timeline-event__image img{
    border-radius:0!important;
    padding:14px!important;
    box-shadow:0 25px 60px rgba(0,0,0,.12)!important;
}





.rsvp,
section.rsvp,
.rsvp.section,
.rsvp.section--soft {
  background-image: none !important;
  color: var(--text);
}

.rsvp::before,
.rsvp::after{
    display:none !important;
    content:none !important;
}

.section-title::before,
.section-title::after{
    content:"";
}

.section::after{
    content:"";
    display:block;
    width:90px;
    height:1px;
    background:rgba(201,100,74,.35);
    margin:60px auto 0;
}

/* =====================================
GALERÍA TIPO CINTA FOTOGRÁFICA VERTICAL
===================================== */

.film-gallery{
display:flex;
flex-direction:column;
align-items:center;
gap:20px;
}

.film-frame{
width:min(420px,85vw);
height:650px;
position:relative;
overflow:hidden;
}

.film-strip{
position:relative;
width:100%;
height:100%;
}

.film-slide{
position:absolute;
inset:0;

display:flex;
justify-content:center;
align-items:center;

opacity:0;

transform:translateY(120px) scale(.92);

transition:
opacity .7s ease,
transform .7s ease;
}

.film-slide.active{
opacity:1;
transform:translateY(0) scale(1);
}

.film-slide img{
width:100%;
height:100%;

object-fit:cover;

border-left:18px solid #1f1a17;
border-right:18px solid #1f1a17;
border-top:12px solid #1f1a17;
border-bottom:12px solid #1f1a17;

border-radius:0;

box-shadow:
0 25px 60px rgba(0,0,0,.18);
}

/* perforaciones película */

.film-slide::before,
.film-slide::after{
content: "";

position:absolute;

top:0;
bottom:0;

width:14px;

z-index:2;

background:
repeating-linear-gradient(
to bottom,
transparent 0 22px,
#f7e7ce 22px 38px
);
}

.film-slide::before{
left:2px;
}

.film-slide::after{
right:2px;
}

/* botones */

.film-nav{
width:58px;
height:58px;

border:none;
border-radius:50%;

background:#fff;

color:var(--accent);

font-size:1.4rem;

cursor:pointer;

box-shadow:0 10px 30px rgba(0,0,0,.12);

transition:.25s ease;
}

.film-nav:hover{
transform:scale(1.08);
}

.film-nav:active{
transform:scale(.95);
}

/* móvil */

@media(max-width:768px){

.film-frame{
height:500px;
}

.film-nav{
width:50px;
height:50px;
}

}

.section {
  position: relative;
}

.section::before,
.section::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 60px;
  background: var(--olive);
  opacity: 0.25;
}

.section::before {
  top: 30px;
  left: 18px;
}

.section::after {
  bottom: 30px;
  right: 18px;
}

.card,
.location-card,
.mention {
  border: 1px solid rgba(138, 154, 123, 0.25); /* oliva */
  position: relative;
}

.card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 35px;
  height: 2px;
  background: var(--olive);
  opacity: 0.6;
}

/*.section-title::after {
  content: "❧ ❧ ❧ ❧ ❧ ❧ ❧";
  display: block;
  margin: 8px auto 0;
  text-align: center;
  font-size: 1.6rem;
  color: var(--olive);
  letter-spacing: 0.25rem;
  opacity: 0.85;
}*/

.btn:hover {
  box-shadow: 0 0 0 2px rgba(138, 154, 123, 0.25);
}

.rsvp {
  position: relative;
}

.rsvp::before {
  content: "";
  position: absolute;
  left: 0;
  top: 20%;
  width: 3px;
  height: 60%;
  background: var(--olive);
  opacity: 0.2;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(
    circle at 20% 20%,
    rgba(138,154,123,0.04),
    transparent 40%
  );
  z-index: 0;
}

.hero .tag {
  display: inline-block;
  padding: 6px 18px;
  border-radius: 30px;
  background: rgba(247, 231, 206, 0.85); /* champán suave */
  color: var(--text) !important;
  letter-spacing: 0.35rem;
  font-weight: 600;
  text-transform: uppercase;
  backdrop-filter: blur(6px);
}

.hero__date {
  color: var(--text) !important;
  background: rgba(255,255,255,0.65);
  display: inline-block;
  padding: 6px 14px;
  border-radius: 12px;
  backdrop-filter: blur(6px);
}
.info-grid{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:20px;
}

.info-card{
  background: var(--white);
  padding: 28px 22px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-align:center;
  min-width: 220px;
  border: 1px solid rgba(201,100,74,0.12);
}

.info-card span{
  display:block;
  font-size: 1.4rem;
  font-family: "Antic Didone", serif;
  color: var(--accent-dark);
}

.info-card small{
  display:block;
  margin-top:6px;
  font-size:0.85rem;
  letter-spacing:1px;
  text-transform:uppercase;
  color: var(--text);
}


/* ===== MENSAJES NOVIOS ===== */

.couple-message {
  display: grid;
  grid-template-columns: 35% 65%;
  overflow: hidden;
  margin-top: 2rem;

  border-radius: 24px;
  background: rgba(255,255,255,.45);
  box-shadow: 0 15px 40px rgba(0,0,0,.08);
}

.couple-message__image {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2rem;
}

.couple-message__image img {
  width: 100%;
  max-width: 280px;
  height: 420px;
  object-fit: cover;
  display: block;
  border-radius: 18px;
  box-shadow: 0 15px 35px rgba(0,0,0,.12);
}

.couple-message__content {
  padding: 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.couple-message__content h4 {
  font-family: "Antic Didone", serif;
  font-size: 2.5rem;
  margin-bottom: 1rem;
  color: var(--text);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.couple-message__content p {
  font-family: "Antic Didone", serif;
  font-size: 1.35rem;
  line-height: 1.9;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: rgba(68, 44, 42, 0.9);
  text-align: justify;
  text-justify: inter-word;
}

.message-signature {
  margin-top: 1.5rem;
  font-family: "Antic Didone", serif;
  font-size: 3.5rem;
  font-weight: 400;
  color: #7e885c;
}

.couple-message--reverse .couple-message__image {
  order: 2;
}

.couple-message--reverse .couple-message__content {
  order: 1;
}

/* MOBILE */

@media (max-width: 768px) {

  .couple-message,
  .couple-message--reverse {
    grid-template-columns: 1fr;
  }

  .couple-message__image,
  .couple-message--reverse .couple-message__image {
    order: 1;
  }

  .couple-message__content,
  .couple-message--reverse .couple-message__content {
    order: 2;
    padding: 2rem 1.5rem;
  }

  .couple-message__image img {
    max-width: 220px;
    height: 320px;
  }

  .couple-message__content h4 {
    font-size: 2rem;
  }

  .message-signature {
    font-size: 3rem;
  }
}
/* ===== RSVP FORM ===== */

.rsvp-form {
  max-width: 700px;
  margin: 2rem auto 0;
  text-align: left;
}

.form-group {
  margin-bottom: 1.25rem;
}

.form-group label {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600;
}

.form-group input,
.form-group select {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 12px;
  font-size: 1rem;
  font-family: inherit;
  background: #fff;
}

.form-group small {
  display: block;
  margin-top: .35rem;
  color: #7e885c;
}

#attendanceFields.hidden {
  display: none;
}
/* ===== Nueva dirección visual: editorial botánica en terracota y mantequilla ===== */
:root {
  --bg: #FFE288;
  --bg-soft: #F0A599;
  --text: #3F0013;
  --accent: #AB482D;
  --accent-dark: #5F5420;
  --olive: #889063;
  --gold: #EA785B;
  --white: #fff9ec;
  --shadow: 0 18px 48px rgba(63, 0, 19, .13);
  --radius: 4px;
  --ink: #3F0013;
  --paper: #fff9ec;
}

html { background: var(--bg); }
body {
  color: var(--ink);
  background: var(--bg);
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  letter-spacing: .015em;
}
::selection { color: var(--paper); background: var(--accent); }
.site > section:nth-of-type(odd) { background: var(--bg); }
.site > section:nth-of-type(even) { background: #F0A599; }
.section--soft { background: #F0A599; }
.section { padding: clamp(62px, 8vw, 112px) 0; }
.container { width: min(90%, 1080px); }

.section-title {
  color: var(--accent);
  font: 400 clamp(2.25rem, 5vw, 4rem)/1.05 "Antic Didone", serif;
  letter-spacing: .015em;
  margin-bottom: clamp(30px, 5vw, 54px);
}
.tag, .intro__label, .timeline-tag {
  color: var(--accent);
  font: 600 .7rem/1.5 "DM Sans", sans-serif;
  letter-spacing: .32em;
  text-transform: uppercase;
}

/* Apertura cinematográfica y cálida */
.intro { color: var(--bg); background: var(--text); }
.intro::after { content: ""; position: absolute; inset: 16px; border: 1px solid rgba(255,226,136,.64); z-index: 1; pointer-events: none; }
.intro__content { position: relative; z-index: 2; padding: 30px; animation: invitation-arrive 1.1s cubic-bezier(.2,.7,.2,1) both; }
@keyframes invitation-arrive { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
.intro__label { color: var(--bg); letter-spacing: .38em; }
.intro .names, .intro h1 { font-family: "Antic Didone", serif; text-shadow: 0 5px 30px rgba(63,0,19,.35); }
.intro .top-name, .intro .bottom-name { font-family: "Antic Didone", serif !important; font-size: clamp(4.5rem, 10vw, 8rem) !important; letter-spacing: 0.05rem !important; line-height: 1.05; text-transform: none !important; }
.intro .middle { font: italic 400 clamp(2rem,4vw,3.4rem)/1 "Antic Didone", serif; color: var(--bg) !important; }
.intro .middle .line { background: var(--bg) !important; opacity: .7; }
.intro__date { margin-top: 22px; color: var(--bg); font: 400 clamp(1rem,2vw,1.3rem)/1.5 "DM Sans", sans-serif !important; letter-spacing: .18em !important; text-transform: uppercase; }
.scroll-indicator span { border-color: var(--bg); }
.scroll-indicator span::before { background: var(--bg); }
.intro.hide { transition: transform 1.25s cubic-bezier(.7,0,.2,1), opacity 1s ease; }

.hero { min-height: min(900px, 100svh); background: var(--text); }
.hero::after { content:""; position:absolute; inset:18px; border:1px solid rgba(255,226,136,.72); pointer-events:none; z-index:0; }
.hero .container { position:relative; z-index:1; padding:80px 18px; }
.hero-bg { filter: saturate(.76) sepia(.15); }
.hero .tag { color: var(--bg); font-size:.72rem; letter-spacing:.38em; }
.hero .names, .hero .names .top-name, .hero .names .bottom-name { color: var(--paper) !important; }
.hero .names .top-name, .hero .names .bottom-name { font: 400 clamp(3.6rem, 9vw, 7rem)/.98 "Antic Didone", serif !important; letter-spacing:.08em !important; }
.hero .names .middle { color: var(--bg) !important; font: italic 400 clamp(1.8rem,3vw,2.6rem)/1 "Antic Didone",serif !important; }
.hero__text { max-width: 650px; margin: 28px auto 0; color: var(--paper); font: italic 400 clamp(1.45rem,3vw,2.2rem)/1.35 "Antic Didone",serif; }
.hero__date { margin-top:22px; color:var(--bg); font:600 .8rem/1.5 "DM Sans",sans-serif; letter-spacing:.24em; text-transform:uppercase; }

/* Tarjetas, datos y bloques */
.info-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:20px; align-items:stretch; }
.mention, .location-card, .card, .countdown__item {
  color:var(--ink); background:rgba(255,249,236,.76); border:1px solid rgba(63,0,19,.16);
  border-radius:var(--radius); box-shadow:0 12px 32px rgba(63,0,19,.08); backdrop-filter:blur(8px);
}
.mention, .location-card { padding:clamp(24px,4vw,38px); transition:transform .35s ease, box-shadow .35s ease; }
.mention:hover, .location-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); }
.mention > span { color:var(--accent); font:600 .68rem/1.5 "DM Sans",sans-serif; letter-spacing:.19em; text-transform:uppercase; }
.parents-names span:not(.parents-and) { color:var(--text)!important; font:400 1.5rem/1.35 "Antic Didone",serif; letter-spacing:0; }
.parents-names .parents-and { color:var(--gold); font:italic 1.3rem "Antic Didone",serif; }
.mention p, .location-card p, .couple-message__content p, .timeline-subtitle, .rsvp__text { line-height:1.8; }
.location-card h4 { color:var(--accent); font:400 2rem/1.1 "Antic Didone",serif; }
.card__big { color:var(--accent); font:500 1.45rem/1.35 "Antic Didone",serif; }
.note { color:var(--accent-dark); }
.btn { color:var(--paper); background:var(--accent); border:1px solid var(--accent); border-radius:0; padding:14px 24px; font:600 .72rem/1.3 "DM Sans",sans-serif; letter-spacing:.15em; text-transform:uppercase; transition:background .25s, color .25s, transform .25s, box-shadow .25s; }
.btn:hover { color:var(--text); background:var(--bg); border-color:var(--accent); transform:translateY(-3px); box-shadow:0 10px 22px rgba(63,0,19,.14); }
.btn--dark { background:var(--text); border-color:var(--text); }

/* Contador e mensajes */
.countdown-title { color:var(--accent)!important; font:400 clamp(2.5rem,5vw,4.2rem)/1.1 "Antic Didone",serif!important; }
.countdown-title span { color:var(--accent-dark); font:600 .68rem/1.5 "DM Sans",sans-serif!important; letter-spacing:.28em; }
.countdown__grid { gap:clamp(8px,2vw,22px); }
.countdown__item { min-width:clamp(66px,12vw,112px); padding:18px 14px; border-color:rgba(171,72,45,.28); border-radius:2px; background:var(--paper); box-shadow:5px 5px 0 rgba(171,72,45,.14); }
.countdown__item span { color:var(--accent); font:400 clamp(1.7rem,4vw,3rem)/1 "Antic Didone",serif!important; }
.countdown__item small { color:var(--text); font:600 .61rem/1.4 "DM Sans",sans-serif!important; letter-spacing:.14em; }
.countdown-message { color:var(--accent-dark); font:italic 1rem "Antic Didone",serif; }
.couple-message { gap:clamp(24px,5vw,62px); align-items:center; }
.couple-message__image img { border-radius:2px; box-shadow:12px 12px 0 rgba(171,72,45,.18); }
.couple-message__content { border-left:1px solid rgba(171,72,45,.38); padding:clamp(20px,4vw,38px); background:rgba(255,249,236,.45); }
.couple-message--reverse .couple-message__content { border-left:0; border-right:1px solid rgba(171,72,45,.38); }
.message-signature { color:var(--accent); font:400 2.7rem/1.2 "Antic Didone",serif; }
.couple-message__content p { color:var(--text); font:400 1rem/1.9 "Antic Didone",serif; }

/* Itinerario */
.timeline-header { margin-bottom:2rem; }
.timeline-divider { color:var(--accent); }
.timeline-divider span { display:inline-block; width:70px; height:1px; vertical-align:middle; background:rgba(171,72,45,.45); }
.timeline-subtitle { color:var(--accent-dark); font:italic 400 1rem/1.8 "Antic Didone",serif; }
.timeline-vertical { max-width:650px; margin:auto; gap:0; }
.timeline-vertical::before { content:""; position:absolute; top:0; bottom:0; left:50%; width:1px; background:rgba(171,72,45,.35); }
.timeline-event { min-height:150px; display:grid; grid-template-columns:1fr 56px 1fr; align-items:center; text-align:left; gap:22px; }
.timeline-event__dot { grid-column:2; grid-row:1; justify-self:center; z-index:1; width:12px; height:12px; margin:0; background:var(--accent); box-shadow:0 0 0 7px rgba(234,120,91,.2); }
.timeline-event__icon { grid-column:1; grid-row:1; justify-self:end; margin:0; }
.timeline-event__icon img { width:58px; height:58px; object-fit:contain; filter:sepia(.4) saturate(.8); opacity:.8; }
.timeline-event__content { grid-column:3; grid-row:1; }
.timeline-event__hour { color:var(--accent); font:600 .7rem/1.5 "DM Sans",sans-serif; letter-spacing:.2em; }
.timeline-event__content h4 { color:var(--text); font:400 1.8rem/1.2 "Antic Didone",serif; }
.timeline-event:nth-child(even) .timeline-event__icon { grid-column:3; justify-self:start; }
.timeline-event:nth-child(even) .timeline-event__content { grid-column:1; grid-row:1; text-align:right; }

/* Galería y detalles */
.gallery-heading p { color:var(--accent-dark); font:italic 1rem "Antic Didone",serif; letter-spacing:.08em; }
.film-frame { border:1px solid rgba(63,0,19,.28); background:var(--paper); box-shadow:10px 10px 0 rgba(171,72,45,.18); }
.film-slide img { border-radius:0; }
.film-nav { color:var(--paper); background:var(--accent); border:1px solid var(--paper); box-shadow:0 5px 15px rgba(63,0,19,.15); transition:transform .25s, background .25s; }
.film-nav:hover { background:var(--text); transform:scale(1.06); }
.gallery-modal { background:rgba(63,0,19,.96); }
.gallery-modal__content img { border:8px solid var(--paper); border-radius:0; }
.gallery-modal__close, .gallery-modal__nav { color:var(--bg); background:rgba(63,0,19,.82); border:1px solid rgba(255,226,136,.7); }
.gallery-thumbs img.active-thumb { border-color:var(--bg); }
.dresscode-heading, .locations-heading, .rsvp-divider, .gallery-heading__divider { color:var(--accent); }
.dresscode-icon-img, .locations-icon-img, .rsvp-heart { filter:sepia(.5) saturate(.8); }

/* Confirmación */
.rsvp-form { max-width:650px; margin:32px auto 0; padding:clamp(22px,5vw,46px); text-align:left; background:rgba(255,249,236,.72); border:1px solid rgba(63,0,19,.17); box-shadow:var(--shadow); }
.form-group { margin-bottom:20px; }
.form-group label { display:block; margin-bottom:8px; color:var(--accent-dark); font:600 .68rem/1.5 "DM Sans",sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.form-group input, .form-group select { width:100%; min-height:48px; padding:12px 14px; color:var(--text); background:var(--paper); border:1px solid rgba(63,0,19,.24); border-radius:0; font:400 .95rem "DM Sans",sans-serif; outline:none; transition:border-color .2s, box-shadow .2s; }
.form-group input:focus, .form-group select:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(234,120,91,.18); }
.form-group small { display:block; margin-top:6px; color:var(--accent-dark); }
.rsvp .section-title, .rsvp .rsvp__text { color:var(--text); }
.rsvp__text { max-width:650px; margin:0 auto; font:italic 1rem/1.8 "Antic Didone",serif; }
.footer { color:var(--paper); background:var(--text); padding:32px 20px; font:italic .95rem "Antic Didone",serif; }
.music-btn { color:var(--bg); background:var(--text); border:1px solid rgba(255,226,136,.65); box-shadow:0 8px 24px rgba(63,0,19,.22); transition:transform .25s, background .25s; }
.music-btn:hover { transform:rotate(-8deg) scale(1.06); background:var(--accent); }

/* Entradas más suaves al desplazarse */
.reveal { transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal-left, .reveal-right { transform:translateY(24px); }
.reveal.active { transform:translateY(0); }

@media (max-width:640px) {
  .intro::after, .hero::after { inset:10px; }
  .hero .container { padding:60px 16px; }
  .hero .names .top-name, .hero .names .bottom-name { letter-spacing:.04em!important; }
  .countdown__grid { flex-wrap:wrap!important; }
  .timeline-event { grid-template-columns:1fr 32px 1fr; gap:12px; min-height:125px; }
  .timeline-event__icon img { width:42px; height:42px; }
  .timeline-event__content h4 { font-size:1.5rem; }
  .timeline-event__hour { font-size:.62rem; letter-spacing:.1em; }
  .couple-message, .couple-message--reverse { display:flex; flex-direction:column; }
  .couple-message__content, .couple-message--reverse .couple-message__content { border:0; border-top:1px solid rgba(171,72,45,.38); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}

/* ===== Composición tipo revista: bloques asimétricos y fotografía protagonista ===== */
.gifts.section:not(:has(.timeline-vertical)) .container,
.gallery .container { position:relative; }
.gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .section-title { max-width:520px; margin:0 auto 46px; }
.gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .info-grid { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; }
.gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention:nth-child(2) { margin-top:52px; }
.gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention:nth-child(3) { margin-top:104px; }
.gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention { min-height:235px; display:flex; flex-direction:column; justify-content:center; }
.gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention::before { content:"✳"; margin-bottom:18px; color:var(--gold); font-size:1.2rem; }

/* Los mensajes alternan como páginas enfrentadas de un álbum */
.quote .section-title { text-align:left; max-width:1080px; margin-left:auto; margin-right:auto; }
.couple-message { grid-template-columns:minmax(230px, .85fr) minmax(0,1.15fr); overflow:visible; background:transparent; box-shadow:none; margin:50px 0 82px; }
.couple-message__image { padding:0; position:relative; }
.couple-message__image::after { content:""; position:absolute; inset:18px -18px -18px 18px; border:1px solid var(--accent); opacity:.48; pointer-events:none; }
.couple-message__image img { position:relative; z-index:1; width:100%; max-width:340px; height:430px; box-shadow:none; }
.couple-message__content { position:relative; z-index:2; margin-left:-26px; padding:36px 34px; background:var(--paper); box-shadow:0 18px 42px rgba(63,0,19,.1); border:0; }
.couple-message--reverse { grid-template-columns:minmax(0,1.15fr) minmax(230px,.85fr); }
.couple-message--reverse .couple-message__image { grid-column:2; grid-row:1; }
.couple-message--reverse .couple-message__image::after { inset:18px 18px -18px -18px; }
.couple-message--reverse .couple-message__content { grid-column:1; grid-row:1; margin:0 -26px 0 0; border:0; text-align:right; }

/* Itinerario en tarjeta panorámica dentro de la secuencia existente */
.countdown.section:has(.timeline-vertical) { overflow:hidden; }
.countdown.section:has(.timeline-vertical)::before { content:""; position:absolute; inset:24px; width:auto; height:auto; border:1px solid rgba(255,249,236,.65); background:transparent; opacity:1; pointer-events:none; }
.countdown.section:has(.timeline-vertical) .container { position:relative; z-index:1; }
.countdown.section:has(.timeline-vertical) .timeline-header { max-width:580px; margin:0 auto 40px; }
.countdown.section:has(.timeline-vertical) .timeline-vertical { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); max-width:100%; gap:12px; }
.countdown.section:has(.timeline-vertical) .timeline-vertical::before { top:50px; bottom:auto; left:10%; right:10%; width:auto; height:1px; }
.countdown.section:has(.timeline-vertical) .timeline-event { min-height:190px; display:flex; flex-direction:column; justify-content:flex-start; gap:12px; padding:24px 14px; background:rgba(255,249,236,.72); border:1px solid rgba(63,0,19,.12); }
.countdown.section:has(.timeline-vertical) .timeline-event__dot { order:0; margin:22px 0 5px; }
.countdown.section:has(.timeline-vertical) .timeline-event__icon { order:1; }
.countdown.section:has(.timeline-vertical) .timeline-event__content { order:2; text-align:center; }

/* Galería como diapositiva editorial de gran formato */
.gallery .container { display:grid; grid-template-columns:minmax(190px,.58fr) minmax(0,1.42fr); grid-template-rows:auto 1fr auto; column-gap:clamp(24px,6vw,80px); align-items:center; }
.gallery .section-title { grid-column:1; grid-row:1; margin:0 0 18px; text-align:left; font-size:clamp(3rem,7vw,5.7rem); }
.gallery-heading { grid-column:1; grid-row:2; align-self:start; text-align:left; }
.gallery-heading p { font-size:1.25rem; }
.gallery-heading__divider { justify-content:flex-start; margin-top:20px; }
.film-gallery { grid-column:2; grid-row:1 / 3; display:grid; grid-template-columns:1fr auto; align-items:center; gap:16px; }
.film-frame { width:100%; height:clamp(410px,57vw,650px); border:0; background:transparent; box-shadow:none; overflow:visible; }
.film-strip { perspective:1200px; }
.film-slide { padding:0 18px 18px 0; transform:translateX(48px) rotateY(-12deg) scale(.94); opacity:0; filter:blur(8px) saturate(.7); }
.film-slide.active { transform:translateX(0) rotateY(0) scale(1); opacity:1; filter:blur(0) saturate(1); z-index:2; }
.film-slide img { border:0; box-shadow:16px 16px 0 var(--accent), 0 24px 50px rgba(63,0,19,.18); }
.film-slide::before, .film-slide::after { display:none; }
.film-slide.active.enter-from-right { animation:slide-editorial-in-right .78s cubic-bezier(.2,.8,.2,1) both; }
.film-slide.active.enter-from-left { animation:slide-editorial-in-left .78s cubic-bezier(.2,.8,.2,1) both; }
@keyframes slide-editorial-in-right { from { opacity:0; transform:translateX(90px) rotateY(-18deg) scale(.88); clip-path:inset(0 0 0 24%); filter:blur(10px); } to { opacity:1; transform:translateX(0) rotateY(0) scale(1); clip-path:inset(0); filter:blur(0); } }
@keyframes slide-editorial-in-left { from { opacity:0; transform:translateX(-90px) rotateY(18deg) scale(.88); clip-path:inset(0 24% 0 0); filter:blur(10px); } to { opacity:1; transform:translateX(0) rotateY(0) scale(1); clip-path:inset(0); filter:blur(0); } }
.film-nav { width:46px; height:46px; border-radius:50%; font-size:1.05rem; }
.film-nav--up { grid-row:1; }
.film-nav--down { grid-row:2; }
.gallery-actions { grid-column:1 / -1; grid-row:3; justify-content:flex-start; margin-top:34px; }

/* Secciones con ritmo de color alternado y detalles tipográficos */
.site > section { overflow:hidden; }
.site > section:nth-of-type(even) .section-title { color:var(--text); }
.section::before, .section::after { pointer-events:none; }
.reveal-left, .reveal-right { transform:translateY(28px) scale(.985); }
.reveal.active { transform:translateY(0) scale(1); }

@media (max-width:760px) {
  .gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .info-grid { grid-template-columns:1fr; gap:14px; }
  .gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention:nth-child(2),
  .gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention:nth-child(3) { margin-top:0; }
  .gifts.section:not(:has(.timeline-vertical)):has(.parents-names) .mention { min-height:0; }
  .couple-message, .couple-message--reverse { grid-template-columns:1fr 1fr; margin:38px 0 60px; }
  .couple-message__image img { height:310px; }
  .couple-message__content { margin-left:-30px; padding:22px 20px; }
  .couple-message--reverse .couple-message__content { margin-right:-30px; }
  .countdown.section:has(.timeline-vertical) .timeline-vertical { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .countdown.section:has(.timeline-vertical) .timeline-vertical::before { display:none; }
  .gallery .container { grid-template-columns:1fr; grid-template-rows:auto auto auto auto; }
  .gallery .section-title { grid-column:1; grid-row:1; }
  .gallery-heading { grid-column:1; grid-row:2; margin-bottom:20px; }
  .film-gallery { grid-column:1; grid-row:3; grid-template-columns:1fr auto; }
  .film-frame { height:min(125vw,580px); }
  .gallery-actions { grid-column:1; grid-row:4; justify-content:center; }
}
@media (max-width:480px) {
  .couple-message, .couple-message--reverse { grid-template-columns:1fr; }
  .couple-message__image, .couple-message--reverse .couple-message__image { grid-column:1; grid-row:1; max-width:260px; margin:auto; }
  .couple-message__image img { height:320px; }
  .couple-message__content, .couple-message--reverse .couple-message__content { grid-column:1; grid-row:2; margin:-18px 0 0; text-align:left; }
  .countdown.section:has(.timeline-vertical) .timeline-event { min-height:160px; padding:18px 8px; }
  .countdown.section:has(.timeline-vertical) .timeline-event__icon img { width:36px; height:36px; }
  .countdown.section:has(.timeline-vertical) .timeline-event__content h4 { font-size:1.35rem; }
}
@media (prefers-reduced-motion: reduce) {
  .film-slide.active.enter-from-right, .film-slide.active.enter-from-left { animation:none; }
}
.film-frame { grid-column:1; grid-row:1 / 3; }
.film-nav--up, .film-nav--down { grid-column:2; }

/* ===== Ornamentos de papelería, filetes y motivos botánicos ===== */
:root {
  --ornament: rgba(171,72,45,.44);
  --ornament-light: rgba(255,249,236,.74);
}

body::before {
  background:
    radial-gradient(ellipse at 10% 12%, rgba(136,144,99,.10), transparent 24%),
    radial-gradient(ellipse at 88% 68%, rgba(234,120,91,.08), transparent 28%),
    radial-gradient(circle at 1px 1px, rgba(63,0,19,.035) 1px, transparent 1.6px);
  background-size:auto, auto, 18px 18px;
}

/* Portada con marco doble, sello floral y filete ornamental */
.intro::after {
  inset:18px;
  border:1px solid rgba(255,226,136,.72);
  outline:1px solid rgba(255,226,136,.28);
  outline-offset:7px;
}
.intro__content { max-width:900px; }
.intro__content::before, .intro__content::after {
  position:absolute;
  left:50%;
  color:var(--bg);
  font:400 1.15rem/1 "Antic Didone",serif;
  letter-spacing:.55em;
  transform:translateX(-50%);
  opacity:.9;
  pointer-events:none;
}
.intro__content::before { content:"—  ✦  —"; top:-34px; }
.intro__content::after { content:"❧"; bottom:-42px; font-size:2rem; letter-spacing:0; }
.intro__label { display:inline-block; padding:7px 17px; border-top:1px solid rgba(255,226,136,.45); border-bottom:1px solid rgba(255,226,136,.45); }
.scroll-indicator { bottom:48px; }

.hero::after { inset:22px; outline:1px solid rgba(255,226,136,.35); outline-offset:8px; }
.hero .container::before, .hero .container::after {
  position:absolute;
  left:50%;
  z-index:2;
  color:var(--bg);
  font:400 1.25rem/1 "Antic Didone",serif;
  letter-spacing:.5em;
  transform:translateX(-50%);
  pointer-events:none;
}
.hero .container::before { content:"✦  ❧  ✦"; top:26px; }
.hero .container::after { content:"❧"; bottom:24px; font-size:2rem; letter-spacing:0; }
.hero .tag { padding:9px 22px; border-radius:0; border-top:1px solid rgba(255,226,136,.7); border-bottom:1px solid rgba(255,226,136,.7); background:rgba(63,0,19,.32); color:var(--bg)!important; }
.hero__date { padding:8px 18px; border-radius:0; border-top:1px solid rgba(255,226,136,.55); border-bottom:1px solid rgba(255,226,136,.55); background:rgba(63,0,19,.28); color:var(--bg)!important; }

/* Títulos como encabezados de una invitación impresa */
.section-title { position:relative; }
.section-title::after {
  content:"✦  ❧  ✦";
  display:block;
  width:max-content;
  height:auto;
  margin:16px auto 0;
  color:var(--gold);
  background:none;
  font:400 .86rem/1 "Antic Didone",serif;
  letter-spacing:.22em;
  opacity:.9;
}
.gallery .section-title::after, .quote .section-title::after { margin-left:0; }
.timeline-header .section-title::after { margin-left:auto; margin-right:auto; }

/* Filetes decorativos en tarjetas, sin tapar texto ni botones */
.mention, .location-card, .rsvp-form, .countdown__item {
  background-image:
    linear-gradient(var(--ornament),var(--ornament)),
    linear-gradient(var(--ornament),var(--ornament)),
    linear-gradient(var(--ornament),var(--ornament)),
    linear-gradient(var(--ornament),var(--ornament));
  background-repeat:no-repeat;
  background-size:18px 1px, 1px 18px, 18px 1px, 1px 18px;
  background-position:10px 10px, 10px 10px, calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) calc(100% - 10px);
}
.location-card::before, .mention::after {
  content:"✦";
  position:absolute;
  top:15px;
  right:17px;
  color:var(--gold);
  font-size:.76rem;
  opacity:.85;
}
.mention { position:relative; }
.location-card { position:relative; }
.countdown__item { border-radius:0; box-shadow:5px 5px 0 rgba(171,72,45,.13); }

/* El álbum lleva una esquina doblada y un borde interior */
.film-frame::before {
  content:"";
  position:absolute;
  z-index:4;
  inset:10px 28px 28px 10px;
  border:1px solid rgba(255,249,236,.7);
  pointer-events:none;
}
.film-frame::after {
  content:"H & M   ·   13 II 2027";
  position:absolute;
  right:2px;
  bottom:0;
  z-index:5;
  color:var(--text);
  font:600 .55rem/1 "DM Sans",sans-serif;
  letter-spacing:.2em;
  writing-mode:vertical-rl;
}
.film-slide img { box-shadow:16px 16px 0 var(--accent), 0 24px 50px rgba(63,0,19,.18); }
.gallery-heading__divider span { background:var(--ornament); }

/* Fotos de los mensajes con passepartout de álbum */
.couple-message__image img { outline:8px solid var(--paper); outline-offset:-8px; }
.couple-message__image::before {
  content:"";
  position:absolute;
  z-index:2;
  left:-10px;
  top:-10px;
  width:42px;
  height:42px;
  border-top:1px solid var(--accent);
  border-left:1px solid var(--accent);
}
.couple-message--reverse .couple-message__image::before { left:auto; right:-10px; border-left:0; border-right:1px solid var(--accent); }
.message-signature::after { content:"  ❧"; color:var(--gold); font:400 1.4rem "Antic Didone",serif; }

/* Itinerario: conectores de medallón */
.countdown.section:has(.timeline-vertical) .timeline-event { position:relative; border-color:rgba(171,72,45,.24); box-shadow:0 9px 24px rgba(63,0,19,.06); }
.countdown.section:has(.timeline-vertical) .timeline-event::after {
  content:"✦";
  position:absolute;
  top:10px;
  right:12px;
  color:var(--gold);
  font-size:.75rem;
}
.countdown.section:has(.timeline-vertical) .timeline-event__dot { border:3px solid var(--paper); box-sizing:content-box; }

/* Pequeños detalles de interacción */
.btn { position:relative; overflow:hidden; }
.btn::after {
  content:"";
  position:absolute;
  top:-40%;
  left:-70%;
  width:35%;
  height:180%;
  background:rgba(255,249,236,.22);
  transform:rotate(22deg);
  transition:left .5s ease;
}
.btn:hover::after { left:140%; }
.music-btn { outline:1px solid rgba(255,226,136,.42); outline-offset:4px; }

@media (max-width:760px) {
  .hero::after { inset:12px; outline-offset:4px; }
  .hero .container::before { top:16px; }
  .hero .container::after { bottom:10px; }
  .film-frame::after { right:-2px; }
}
@media (max-width:480px) {
  .intro::after { inset:12px; outline-offset:4px; }
  .intro__content::before { top:-24px; }
  .intro__content::after { bottom:-32px; }
  .section-title::after { margin-top:12px; }
}

/* ===== Fondos con textura y marcas de agua para evitar superficies vacías ===== */
:root { --paper-grain: rgba(63,0,19,.035); }

.gifts.section:has(.parents-names),
.quote.section,
.dresscode.section,
.locations.section,
.rsvp.section {
  background-image:
    radial-gradient(ellipse at 50% 48%, rgba(255,249,236,.28), transparent 58%),
    radial-gradient(circle at 1px 1px, var(--paper-grain) .8px, transparent 1.25px);
  background-size:auto, 16px 16px;
}

/* Ilustración botánica lineal en las esquinas: tono bajo para dejar respirar el contenido */
.gifts.section:has(.parents-names),
.quote.section,
.locations.section {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='190' height='230' viewBox='0 0 190 230' fill='none'%3E%3Cg stroke='%235F5420' stroke-opacity='.17' stroke-width='1.3' stroke-linecap='round'%3E%3Cpath d='M12 218C42 177 49 140 60 104 72 66 104 36 158 11'/%3E%3Cpath d='M48 153C25 150 13 134 12 116c23-1 39 8 44 26M60 108C39 101 32 84 36 66c21 5 33 18 32 36M84 69C71 50 76 32 88 19c16 15 20 31 10 47M104 45c4-22 19-32 38-34 1 21-7 36-27 43M40 174c-19-3-30-16-31-33 18-1 31 6 38 21'/%3E%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='190' height='230' viewBox='0 0 190 230' fill='none'%3E%3Cg stroke='%23AB482D' stroke-opacity='.14' stroke-width='1.3' stroke-linecap='round'%3E%3Cpath d='M12 218C42 177 49 140 60 104 72 66 104 36 158 11'/%3E%3Cpath d='M48 153C25 150 13 134 12 116c23-1 39 8 44 26M60 108C39 101 32 84 36 66c21 5 33 18 32 36M84 69C71 50 76 32 88 19c16 15 20 31 10 47M104 45c4-22 19-32 38-34 1 21-7 36-27 43M40 174c-19-3-30-16-31-33 18-1 31 6 38 21'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(ellipse at 50% 48%, rgba(255,249,236,.25), transparent 58%),
    radial-gradient(circle at 1px 1px, var(--paper-grain) .8px, transparent 1.25px);
  background-repeat:no-repeat,no-repeat,no-repeat,repeat;
  background-position:left 12px top 14px,right 12px bottom 14px,center,0 0;
  background-size:clamp(100px,15vw,190px),clamp(100px,15vw,190px),auto,16px 16px;
}

/* Monogramas de fondo integrados como grandes marcas de agua */
.countdown.section:has(.countdown__grid):not(:has(.timeline-vertical)) {
  background-image:
    radial-gradient(circle at 50% 54%, rgba(255,249,236,.68), transparent 50%),
    radial-gradient(circle at 1px 1px, rgba(63,0,19,.04) .8px, transparent 1.25px);
  background-size:auto,18px 18px;
}
.countdown.section:has(.countdown__grid):not(:has(.timeline-vertical)) .container { isolation:isolate; }
.countdown.section:has(.countdown__grid):not(:has(.timeline-vertical)) .container::before {
  content:"13";
  position:absolute;
  z-index:-1;
  top:-.65em;
  left:50%;
  transform:translateX(-50%);
  color:var(--accent);
  opacity:.075;
  font:400 clamp(15rem,42vw,32rem)/1 "Antic Didone",serif;
  pointer-events:none;
}
.dresscode.section .container { isolation:isolate; }
.dresscode.section .container::before {
  content:"H  ·  M";
  position:absolute;
  z-index:-1;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) rotate(-8deg);
  color:var(--olive);
  opacity:.08;
  white-space:nowrap;
  font:400 clamp(5rem,17vw,13rem)/1 "Antic Didone",serif;
  letter-spacing:.12em;
  pointer-events:none;
}
.rsvp.section {
  background-image:
    radial-gradient(ellipse at 50% 0%, rgba(255,249,236,.58), transparent 60%),
    radial-gradient(circle at 1px 1px, var(--paper-grain) .8px, transparent 1.25px);
  background-size:auto,16px 16px;
}

@media (max-width:640px) {
  .gifts.section:has(.parents-names), .quote.section, .locations.section {
    background-size:84px,84px,auto,18px 18px;
    background-position:left 4px top 8px,right 4px bottom 8px,center,0 0;
  }
  .countdown.section:has(.countdown__grid):not(:has(.timeline-vertical)) .container::before { top:-.35em; }
}

/* Texto principal de la invitación en negro */
.hero .names,
.hero .names .top-name,
.hero .names .bottom-name,
.hero .names .middle,
.hero .hero__text {
  color: #442C2A !important;
}
.hero .names .middle .line { background: #000 !important; }

/* ===== Dos pausas editoriales para las frases de fe ===== */
.faith-note.section {
  position:relative;
  overflow:hidden;
  padding:clamp(54px,7vw,86px) 0;
  color:var(--paper);
  background-color:var(--accent);
  background-image:
    radial-gradient(circle at 1px 1px, rgba(255,249,236,.08) .8px, transparent 1.3px),
    linear-gradient(135deg, rgba(63,0,19,.12), transparent 55%);
  background-size:18px 18px, auto;
}
.faith-note.section::before {
  content:"";
  position:absolute;
  inset:14px 18px;
  width:auto;
  height:auto;
  border:1px solid rgba(255,249,236,.38);
  opacity:1;
  pointer-events:none;
}
.faith-note.section::after { display:none; }
.faith-note__inner {
  position:relative;
  z-index:1;
  max-width:850px;
  text-align:center;
}
.faith-note__inner p {
  margin:16px auto;
  color:var(--paper);
  font:italic 400 clamp(1.35rem,3vw,2.15rem)/1.65 "Antic Didone",serif;
  text-wrap:balance;
}
.faith-note__ornament { display:block; color:var(--bg); font:400 1rem/1 "Antic Didone",serif; letter-spacing:.25em; }
.faith-note__ornament:last-child { font-size:2rem; letter-spacing:0; margin-top:8px; }

.scripture-note.section {
  position:relative;
  overflow:hidden;
  padding:clamp(58px,8vw,100px) 0;
  background-color:var(--bg);
  background-image:
    radial-gradient(ellipse at 50% 50%, rgba(255,249,236,.58), transparent 65%),
    radial-gradient(circle at 1px 1px, rgba(63,0,19,.045) .8px, transparent 1.3px);
  background-size:auto,18px 18px;
}
.scripture-note.section::before {
  content:"";
  position:absolute;
  inset:24px clamp(18px,7vw,100px);
  width:auto;
  height:auto;
  border:1px solid rgba(171,72,45,.4);
  opacity:1;
  pointer-events:none;
}
.scripture-note.section::after { display:none; }
.scripture-note__inner {
  position:relative;
  max-width:820px;
  padding:clamp(28px,5vw,58px);
  text-align:center;
  background:rgba(255,249,236,.56);
  border-top:1px solid rgba(171,72,45,.3);
  border-bottom:1px solid rgba(171,72,45,.3);
}
.scripture-note__mark {
  display:block;
  height:.72em;
  color:var(--gold);
  font:400 clamp(5rem,12vw,8rem)/.9 "Antic Didone",serif;
}
.scripture-note blockquote {
  margin:8px auto 18px;
  color:var(--text);
  font:italic 400 clamp(1.55rem,3.4vw,2.65rem)/1.4 "Antic Didone",serif;
  text-wrap:balance;
}
.scripture-note__reference {
  color:var(--accent);
  font:600 .72rem/1.5 "DM Sans",sans-serif;
  letter-spacing:.25em;
  text-transform:uppercase;
}
.scripture-note__ornament { display:block; margin-top:24px; color:var(--olive); font:400 .9rem/1 "Antic Didone",serif; letter-spacing:.3em; }

@media (max-width:640px) {
  .faith-note.section::before { inset:10px; }
  .scripture-note.section::before { inset:12px 10px; }
  .scripture-note__inner { padding:30px 18px; }
}

/* Centrar el encabezado de la galería sobre las fotografías */
.gallery .section-title {
  grid-column:1 / -1;
  grid-row:1;
  width:100%;
  margin:0 0 14px;
  text-align:center;
}
.gallery-heading {
  grid-column:1 / -1;
  grid-row:2;
  width:100%;
  margin-bottom:24px;
  text-align:center;
}
.gallery-heading__divider { justify-content:center; }
.film-gallery { grid-column:1 / -1; grid-row:3; }
.gallery-actions { grid-column:1 / -1; grid-row:4; justify-content:center; }
@media (max-width:760px) {
  .gallery .section-title { grid-column:1; grid-row:1; }
  .gallery-heading { grid-column:1; grid-row:2; }
  .film-gallery { grid-column:1; grid-row:3; }
  .gallery-actions { grid-column:1; grid-row:4; }
}

/* Centrar también los adornos tipográficos del encabezado de Galería */
.gallery .section-title::after {
  margin-left:auto;
  margin-right:auto;
}
.gallery-heading__divider {
  margin-left:auto;
  margin-right:auto;
  justify-content:center;
}
.gallery-heading__divider img.locations-icon-img {
  flex:0 0 44px;
  width:44px;
  height:44px;
}


/* Slight solo en los nombres de la pantalla de apertura. */
.intro h1.names > span.top-name,
.intro h1.names > span.middle,
.intro h1.names > span.bottom-name {
  font-family: "Slight", cursive !important;
}
.hero h2.names > span.top-name,
.hero h2.names > span.middle,
.hero h2.names > span.bottom-name {
  font-family: "Antic Didone", serif !important;
}

/* Recupera la distribución original en columna para el h2 del hero. */
.hero h2.names > span.top-name,
.hero h2.names > span.bottom-name {
  font-size: clamp(3rem, 7.5vw, 5.5rem) !important;
  letter-spacing: 0 !important;
  line-height: .98;
}
.hero h2.names > span.middle {
  align-self: center;
  margin: .2rem 0;
  font-size: clamp(1.5rem, 3.2vw, 2.3rem) !important;
  line-height: 1;
}
.hero__text { font-family: "Antic Didone", serif !important; font-style: normal; }


/* Marco fino y motivos florales como ornamento alternativo a los fondos. */
.ornament-section {
  position: relative;
  isolation: isolate;
}
.ornament-section > .section-ornament {
  position: absolute;
  z-index: 0;
  inset: 18px;
  border: 1px solid rgba(171, 72, 45, .3);
  pointer-events: none;
}
.ornament-section > .container {
  position: relative;
  z-index: 1;
}
.section-ornament::before,
.section-ornament::after {
  position: absolute;
  font: 400 3rem/1 "Antic Didone", serif;
  text-shadow: 0 2px 8px rgba(68, 44, 42, .16);
  pointer-events: none;
}
.section-ornament::before {
  content: "✿";
  top: -.62em;
  left: -.5em;
  color: var(--accent);
}
.section-ornament::after {
  content: "❀";
  right: -.5em;
  bottom: -.62em;
  color: var(--gold);
  transform: rotate(18deg);
}
/* Usa las flores sobre los marcos existentes en estas pausas. */
.hero .section-ornament,
.faith-note .section-ornament,
.scripture-note .section-ornament {
  border: 0;
}
.section-title::after {
  content: "❀  ✿  ❀";
  color: var(--gold);
  font: 400 1.45rem/1 "Antic Didone", serif;
  letter-spacing: .24em;
  opacity: 1;
}
@media (max-width: 640px) {
  .ornament-section > .section-ornament { inset: 10px; }
  .section-ornament::before,
  .section-ornament::after { font-size: 2rem; }
  .section-title::after { font-size: 1.2rem; }
}
