/* Propuesta A · Azul y blanco cal (Menorca, Grecia). El mar a pantalla completa, con olas que se mueven. */
.tema-a {
  --cal: #ffffff;
  --arena: #eef5f8;
  --arena-2: #f4e9d6;
  --terracota: #1f5fa8;
  --terracota-text: #174a85;
  --oliva: #1e7486;
  --mar: #0d3b66;
  --tinta: #10263d;
  --texto: #2c3e50;
  --linea: rgba(13, 59, 102, 0.14);
}
.tema-a .label { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='6' viewBox='0 0 24 6'%3E%3Cpath d='M0 3c3 0 3-2.5 6-2.5S9 3 12 3s3-2.5 6-2.5S21 3 24 3' fill='none' stroke='%231f5fa8' stroke-width='1.3'/%3E%3C/svg%3E"); }
.tema-a .wave { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='14' viewBox='0 0 48 14'%3E%3Cpath d='M0 7c6 0 6-6 12-6s6 6 12 6 6-6 12-6 6 6 12 6' fill='none' stroke='%231e7486' stroke-width='1.4'/%3E%3C/svg%3E"); }
.tema-a .rsvp .label { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='6' viewBox='0 0 24 6'%3E%3Cpath d='M0 3c3 0 3-2.5 6-2.5S9 3 12 3s3-2.5 6-2.5S21 3 24 3' fill='none' stroke='%23f4e9d6' stroke-width='1.3'/%3E%3C/svg%3E"); }

/* Portada: cielo blanco y mar profundo */
.sea {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: calc(100svh - 6rem);
  overflow: hidden;
  text-align: center;
  background: var(--cal);
}
.sea__sky {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 3rem var(--gutter) 2rem;
}
.sea__sun {
  width: 4.5rem;
  aspect-ratio: 1;
  margin-bottom: 1.5rem;
  border-radius: 50%;
  border: 1.5px solid var(--terracota);
}
.sea__kicker { margin: 0 0 0.6rem; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: var(--oliva); }
.sea__names { margin: 0; font: 400 clamp(3.4rem, 17vw, 7rem)/0.95 var(--display); color: var(--mar); }
.sea__names span { display: block; font-size: 0.45em; color: var(--terracota); }
.sea__date { margin: 1.25rem 0 0.2rem; font: 400 1.35rem/1.2 var(--display); color: var(--tinta); }
.sea__place { margin: 0; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--oliva); }

.sea__water {
  position: relative;
  height: clamp(15rem, 38svh, 22rem);
  background: var(--mar);
  color: #fff;
}
/* Tres capas de olas que se desplazan a distinta velocidad */
.sea__wave {
  position: absolute;
  left: 0;
  width: 200%;
  height: 3.5rem;
  background-repeat: repeat-x;
  background-size: 50% 100%;
  animation: oleaje 14s linear infinite;
}
.sea__wave--1 { top: -3.4rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath d='M0 30 C150 0 300 60 450 30 S750 0 900 30 S1050 60 1200 30 V60 H0Z' fill='%235fa8d3'/%3E%3C/svg%3E"); animation-duration: 18s; }
.sea__wave--2 { top: -2.4rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath d='M0 30 C200 60 400 0 600 30 S1000 60 1200 30 V60 H0Z' fill='%232a77b5'/%3E%3C/svg%3E"); animation-duration: 11s; animation-direction: reverse; }
.sea__wave--3 { top: -1.4rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath d='M0 30 C150 0 300 60 450 30 S750 0 900 30 S1050 60 1200 30 V60 H0Z' fill='%230d3b66'/%3E%3C/svg%3E"); animation-duration: 8s; }
@keyframes oleaje { to { transform: translateX(-50%); } }

.sea__water .countdown { position: relative; z-index: 1; padding-top: 3.5rem; }
.sea__water .countdown div + div { border-color: rgba(255, 255, 255, 0.25); }
.sea__water .countdown strong { color: #fff; }
.sea__water .countdown span { color: rgba(255, 255, 255, 0.8); }

/* Botones y confirmación en azul */
.tema-a .rsvp { background: var(--mar); }
.tema-a .section--sand { background: var(--arena); }

@media (prefers-reduced-motion: reduce) { .sea__wave { animation: none; } }

/* Ajustes tras revisarla en el móvil */
.tema-a .nav { background: rgba(255, 255, 255, 0.95); }
.sea__water { height: auto; padding-bottom: 3rem; }
.sea__wave { will-change: transform; }
.sea__sky { flex: none; padding: 3.5rem var(--gutter) 4.5rem; }
.sea__water { flex: 1; min-height: 12rem; }