/* Réplica del sitio de Wix. Todas las medidas salen del sitio en vivo:
   escritorio = lienzo de 1265 px (1 unidad = 1 px a ≥1265 px de ancho, se reduce en pantallas menores);
   móvil (≤768 px) = lienzo móvil de Wix de 320 px escalado al ancho del teléfono. */

@font-face {
  font-family: "Abigail";
  src: url("fonts/abigail.woff2") format("woff2");
  font-display: swap;
}

@font-face {
  font-family: "Memories";
  src: url("fonts/memories.woff") format("woff");
  font-display: swap;
}

:root {
  --cream: #FCF8EB;
  --white: #FFFFFF;
  --header: #FBFBFB;
  --peach: #F4E6D0;
  --accent: #D5A785;
  --ink: #332D2B;
  --muted: #595959;
  --quote: #83807F;
  --hover: #B2B4C5;
  --gt-blue: #2293DC;
  --mx-red: #CA241D;

  --f-script: "Memories", "Snell Roundhand", "Segoe Script", cursive;
  --f-lux: "Luxurious Script", "Snell Roundhand", "Segoe Script", cursive;
  --f-body: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --f-mono: "Abigail", "Fraunces", Georgia, serif;

  --k: min(1px, 100vw / 1265);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: var(--f-body);
  font-weight: 300;
  overflow-x: clip;
}
img { display: block; max-width: none; }
main, .footer { overflow-x: clip; }  /* los giros 3D de entrada no deben ensanchar la página */
h1, h2, h3, p, ul, blockquote { margin: 0; font-weight: 400; }
h1, h2, h3 { text-wrap: balance; }
b { font-weight: 600; }
a { color: inherit; }
.script { font-family: var(--f-script); font-weight: 400; }
.lux { font-family: var(--f-lux); font-weight: 400; }
.justify { text-align: justify; }
.only-mobile { display: none !important; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ---------- Botones (estados hover tomados de Wix) ---------- */
.btn {
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--ink);
  border-radius: 50px;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
  transition: border-color .4s, background-color .4s, color .4s;
}
.btn--rsvp {
  width: calc(252 * var(--k)); height: calc(71 * var(--k));
  background: var(--cream);
  font-family: var(--f-mono); font-size: calc(22 * var(--k)); line-height: 1.5;
}
.btn--clear { background: transparent; }
.btn--explora {
  width: calc(133 * var(--k)); height: calc(45 * var(--k));
  background: var(--cream);
  font-family: var(--f-lux); font-size: calc(36 * var(--k)); line-height: 1.5;
}
.btn--rsvp:hover, .btn--explora:hover { background: var(--hover); border-color: var(--cream); color: var(--cream); }
.btn--gift {
  position: relative;
  width: calc(270 * var(--k)); height: calc(74 * var(--k));
  background: transparent;
  font-family: var(--f-lux); font-size: calc(45 * var(--k)); line-height: 1.5;
}
.btn--gift:hover { background: var(--accent); border-color: var(--accent); color: var(--cream); }

/* ---------- Encabezado ---------- */
.topbar {
  height: calc(95 * var(--k));
  background: var(--header);
  display: flex; align-items: center; justify-content: center;
}
.monogram { font-family: var(--f-mono); font-weight: 400; font-size: calc(40 * var(--k)); line-height: 1.1; }

/* ---------- Portada (fondo con parallax, ver script) ---------- */
.hero { position: relative; height: calc(1026 * var(--k)); overflow: hidden; }
.hero__img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; will-change: transform; }
.hero__names {
  position: absolute; left: 0; right: 0; top: calc(341 * var(--k));
  font-family: var(--f-script); font-weight: 400;
  font-size: calc(152 * var(--k)); line-height: 1.1;
  color: var(--white);
  text-align: center; white-space: nowrap;
  text-shadow: 1px 1px 1px rgba(255, 255, 255, .6), -1px -1px 1px rgba(0, 0, 0, .6);
}
.hero__rsvp { position: absolute; left: 0; right: 0; margin: 0 auto; top: calc(794 * var(--k)); }

/* ---------- Proverbio ---------- */
.quote { height: calc(248 * var(--k)); padding-top: calc(32 * var(--k)); background: var(--cream); }
.quote blockquote { width: calc(955 * var(--k)); margin: 0 auto; color: var(--quote); font-family: var(--f-lux); text-align: center; }
.quote p { font-size: calc(52 * var(--k)); line-height: calc(45 * var(--k)); white-space: nowrap; }
.quote cite { display: block; margin-top: calc(9 * var(--k)); font-style: normal; font-size: calc(40 * var(--k)); line-height: calc(48 * var(--k)); }

/* ---------- Padres e invitación ---------- */
.parents { background: var(--white); padding: calc(105 * var(--k)) 0 calc(212 * var(--k)); text-align: center; }
.parents__title { font-size: calc(69 * var(--k)); line-height: 1.1; }
.parents__grid {
  display: grid;
  grid-template-columns: repeat(2, calc(360 * var(--k)));
  column-gap: calc(156 * var(--k));
  justify-content: center;
  padding-right: calc(26 * var(--k));
  margin-top: calc(93 * var(--k));
  font-weight: 500;
  font-size: calc(22 * var(--k)); line-height: 1.4; letter-spacing: .05em;
  text-transform: uppercase;
}
.parents__rings { width: calc(135 * var(--k)); height: calc(69 * var(--k)); margin: calc(54 * var(--k)) auto 0; }
.parents__invite { margin-top: calc(67 * var(--k)); font-size: calc(69 * var(--k)); line-height: .8; }
.parents__date {
  margin-top: calc(77 * var(--k));
  font-weight: 500; font-size: calc(50 * var(--k)); line-height: 1.6; letter-spacing: .11em;
  text-transform: uppercase;
}

/* ---------- Programa ---------- */
.schedule { display: flow-root; background: var(--cream); padding-bottom: calc(126 * var(--k)); }
/* Las tres pinturas: separadas, cada una sobre su columna (misma rejilla que el programa). */
.paintings, .schedule__grid {
  display: grid;
  grid-template-columns: repeat(3, calc(340 * var(--k)));
  column-gap: calc(23 * var(--k));
  justify-content: center;
}
.paintings { margin-top: calc(-41 * var(--k)); }
.paintings img { width: 100%; height: calc(458 * var(--k)); object-fit: cover; }

.schedule__grid {
  margin-top: calc(24 * var(--k));
  text-align: center;
}
.event { display: flex; flex-direction: column; align-items: center; min-height: calc(305 * var(--k)); }
.event__icon { height: calc(52 * var(--k)); display: flex; align-items: flex-end; justify-content: center; }
.event__icon--hearts img { width: calc(39 * var(--k)); height: calc(38 * var(--k)); }
.event__icon--hearts img + img { margin-left: calc(-5 * var(--k)); }
.event__icon--hat { margin-left: calc(19 * var(--k)); }
.event__hat { width: calc(50 * var(--k)); height: calc(42 * var(--k)); }
.event__mini-heart { width: calc(25 * var(--k)); height: calc(22 * var(--k)); align-self: flex-start; margin-top: calc(-6 * var(--k)); }
.event__cutlery { width: calc(49 * var(--k)); height: calc(50 * var(--k)); }
.event__title { font-size: calc(65 * var(--k)); line-height: 1.1; }
.event__meta { margin-top: auto; }
.event__note { font-family: var(--f-lux); font-size: calc(35 * var(--k)); line-height: 1.1; }
.event__time, .event__place {
  font-weight: 600;
  font-size: calc(25 * var(--k)); line-height: 1.1; letter-spacing: .05em;
  font-variant-numeric: tabular-nums;
}
.event__place { text-transform: uppercase; }
.schedule__cta { display: flex; justify-content: center; }

/* ---------- Secciones a dos columnas ---------- */
.split { display: grid; }
.split--60 { grid-template-columns: minmax(0, 60fr) minmax(0, 40fr); }
.split--50 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Guatemala y México */
.cultures__text { background: var(--white); padding: calc(66 * var(--k)) 0 calc(120 * var(--k)) calc(82 * var(--k)); }
.cultures__flags { display: flex; justify-content: center; gap: calc(35 * var(--k)); margin-left: calc(-48 * var(--k)); }
.cultures__flags img { width: calc(79 * var(--k)); height: calc(52 * var(--k)); object-fit: contain; }
.cultures__title { margin-top: calc(21 * var(--k)); font-size: calc(80 * var(--k)); line-height: 1.1; white-space: nowrap; }
.cultures__title .gt { color: var(--gt-blue); }
.cultures__title .mx { color: var(--mx-red); }
.cultures__prose { width: calc(598 * var(--k)); margin: calc(88 * var(--k)) 0 0 calc(49 * var(--k)); font-size: calc(24 * var(--k)); line-height: 1.2; }
.cultures__prose p + p { margin-top: 1.2em; }
.cultures__media { background: var(--peach); padding-top: calc(66 * var(--k)); padding-left: 1px; }
.cultures__media img { width: calc(448 * var(--k)); height: calc(489 * var(--k)); object-fit: cover; }

/* Alojamiento */
.lodging__text { position: relative; background: var(--cream); padding: calc(40 * var(--k)) 0 calc(141 * var(--k)) calc(86 * var(--k)); color: var(--muted); }
.lodging__title { font-size: calc(90 * var(--k)); line-height: 1.1; }
.lodging__lead { margin-top: calc(69 * var(--k)); font-size: calc(25 * var(--k)); line-height: 1.2; }
.bullets {
  list-style: none;
  width: calc(584 * var(--k));
  margin-top: calc(22 * var(--k));
  padding: 0 0 0 calc(43 * var(--k));
  color: var(--ink);
  font-size: calc(24 * var(--k)); line-height: 1.2;
}
.bullets li { position: relative; }
.bullets li::before {
  content: "";
  position: absolute; left: -.7em; top: .5em;
  width: .26em; height: .26em; border-radius: 50%;
  background: currentColor;
}
.stay { margin-top: calc(75 * var(--k)); }
.stay + .stay { margin-top: calc(67 * var(--k)); }
.stay__title { font-size: calc(65 * var(--k)); line-height: 1.1; white-space: nowrap; }
.stay--hilton .stay__title { letter-spacing: .05em; }
@media (min-width: 769px) { .stay--cabin .stay__title { font-size: calc(58 * var(--k)); } }
.stay p { margin-top: calc(42 * var(--k)); font-size: calc(25 * var(--k)); line-height: 1.2; }
.stay .btn--explora { margin-top: calc(38 * var(--k)); }
.stay--cabin .btn--explora { margin-left: calc(5 * var(--k)); }
.lodging__media { background: var(--peach); display: flex; justify-content: center; padding-top: calc(354 * var(--k)); }
.lodging__media img { width: calc(370 * var(--k)); height: calc(710 * var(--k)); }

/* Regalos (la pintura hace paneo horizontal, ver script) */
.gifts__media { position: relative; overflow: hidden; }
.gifts__img { position: absolute; left: 0; top: 0; width: 120%; height: 100%; object-fit: cover; will-change: transform; transform: translateX(-8.33%); }
.gifts__text { background: var(--cream); padding: calc(149 * var(--k)) 0 calc(77 * var(--k)) calc(61 * var(--k)); }
.gifts__title { font-size: calc(90 * var(--k)); line-height: 1.1; }
.gifts__prose { width: calc(383 * var(--k)); margin-top: calc(74 * var(--k)); font-size: calc(25 * var(--k)); line-height: 1.2; }
.gifts__prose p + p { margin-top: 1.2em; }
.gifts__buttons { width: calc(383 * var(--k)); display: flex; flex-direction: column; align-items: center; gap: calc(55 * var(--k)); margin-top: calc(56 * var(--k)); }
.badge {
  position: absolute; left: 0; right: 0; top: calc(63 * var(--k));
  width: calc(142 * var(--k)); height: calc(25 * var(--k)); margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50px;
  background: var(--accent);
  color: var(--ink);
  font-family: var(--f-body); font-weight: 600;
  font-size: calc(12 * var(--k)); line-height: .9;
  text-align: center; white-space: normal;
  padding: 0 calc(3 * var(--k));
}

/* Indicaciones especiales */
.notes__title { background: var(--cream); padding: calc(102 * var(--k)) 0 calc(100 * var(--k)) calc(71 * var(--k)); color: var(--muted); }
.notes__title .script { font-size: calc(60 * var(--k)); line-height: 1.3; }
.notes__dress { background: var(--peach); padding: calc(102 * var(--k)) calc(40 * var(--k)) calc(203 * var(--k)) calc(20% + 61 * var(--k)); color: var(--muted); } /* alineado con el texto de Regalos: su columna empieza al 60 % (= 20 % de esta mitad) + 61 */
.notes__dress .script { font-size: calc(60 * var(--k)); line-height: 1.3; }
.notes__dress p { width: calc(383 * var(--k)); margin: calc(40 * var(--k)) 0 0; font-size: calc(22 * var(--k)); line-height: 1.2; }

/* ---------- Pie ---------- */
.footer { height: calc(120 * var(--k)); background: var(--accent); color: var(--cream); padding: calc(16 * var(--k)) 0 0; text-align: center; }
.footer .monogram { display: inline-block; font-size: calc(60 * var(--k)); }

/* ---------- Movimientos de entrada (valores de Wix) ---------- */
@keyframes w-fade { from { opacity: 0; } }
@keyframes w-drop { from { transform: scale(1.2); } }
@keyframes w-expand { from { transform: scale(.8); } }
@keyframes w-float { from { opacity: 0; transform: translateY(60px); } }
@keyframes w-fold {
  from { transform: translateY(-50%) perspective(800px) rotateX(-90deg) translateY(50%); }
  to   { transform: translateY(-50%) perspective(800px) rotateX(0deg) translateY(50%); }
}
.m-wait { opacity: 0; }
.m-in.m-fade { animation: w-fade 1.2s cubic-bezier(.445, .05, .55, .95) both; }
.m-in.m-drop { animation: w-fade .96s cubic-bezier(.25, .46, .45, .94) both, w-drop 1.2s cubic-bezier(.645, .045, .355, 1) both; }
.m-in.m-expand { animation: w-fade 1.2s linear both, w-expand 1.2s cubic-bezier(.645, .045, .355, 1) both; }
.m-in.m-float { animation: w-float 1.2s cubic-bezier(.445, .05, .55, .95) both; }
.m-in.m-fold { animation: w-fade 1.2s cubic-bezier(.25, .46, .45, .94) both, w-fold 1.2s cubic-bezier(.175, .885, .32, 1.275) both; }
@media (prefers-reduced-motion: reduce) {
  .m-wait { opacity: 1; }
  .m-in { animation: none !important; }
}

/* =====================================================================
   Móvil: diseño móvil de Wix (lienzo de 320 px) escalado al teléfono
   ===================================================================== */
@media (max-width: 768px) {
  :root { --k: calc(100vw / 320); }
  img.only-mobile { display: block !important; }
  .schedule__cta.only-mobile { display: flex !important; }
  .only-desktop { display: none !important; }

  .topbar { height: calc(93 * var(--k)); align-items: flex-start; padding-top: calc(46 * var(--k)); }
  .monogram { font-size: calc(33 * var(--k)); }

  .hero { height: calc(212 * var(--k)); }
  .hero__img { transform: none !important; }
  .hero__names { top: calc(86 * var(--k)); font-size: calc(36 * var(--k)); }
  .hero__rsvp { top: calc(179 * var(--k)); width: calc(78 * var(--k)); height: calc(21 * var(--k)); font-size: calc(9.53 * var(--k)); }

  .quote { height: calc(73 * var(--k)); margin-top: calc(3 * var(--k)); padding-top: calc(15 * var(--k)); }
  .quote blockquote { width: calc(293 * var(--k)); }
  .quote p { font-size: calc(15 * var(--k)); line-height: calc(13 * var(--k)); }
  .quote cite { margin-top: 0; font-size: calc(13 * var(--k)); line-height: calc(15.6 * var(--k)); }

  .parents { padding: calc(20 * var(--k)) 0 calc(60 * var(--k)); }
  .parents__title { font-size: calc(24 * var(--k)); line-height: calc(24.2 * var(--k)); }
  .parents__grid {
    grid-template-columns: repeat(2, calc(127 * var(--k)));
    column-gap: calc(17 * var(--k));
    justify-content: start;
    padding: 0 0 0 calc(20 * var(--k));
    margin-top: calc(11 * var(--k));
    font-size: calc(7 * var(--k)); line-height: calc(9.8 * var(--k));
  }
  .parents__rings { width: calc(37 * var(--k)); height: calc(19 * var(--k)); margin-top: calc(36 * var(--k)); }
  .parents__invite { margin-top: calc(31 * var(--k)); font-size: calc(24 * var(--k)); line-height: calc(17.6 * var(--k)); }
  .parents__date { margin-top: calc(33 * var(--k)); font-size: calc(22 * var(--k)); line-height: calc(36 * var(--k)); }

  .schedule { padding-bottom: calc(25 * var(--k)); }
  .schedule__grid { display: block; margin-top: calc(-15 * var(--k)); }
  .event { min-height: 0; }
  .event__painting { width: calc(250 * var(--k)); height: calc(272 * var(--k)); object-fit: cover; }
  .event--2 .event__painting { margin-top: calc(41 * var(--k)); }
  .event--3 .event__painting { margin-top: calc(95 * var(--k)); height: calc(275 * var(--k)); }
  .event__icon { height: auto; }
  .event--1 .event__icon { margin-top: calc(20 * var(--k)); }
  .event__icon--hearts img { width: calc(22 * var(--k)); height: calc(21 * var(--k)); }
  .event__icon--hearts img + img { margin-left: calc(-3 * var(--k)); }
  .event__icon--hat { margin: calc(23 * var(--k)) 0 0 calc(10 * var(--k)); }
  .event__hat { width: calc(32 * var(--k)); height: calc(28 * var(--k)); margin-top: calc(12 * var(--k)); }
  .event__mini-heart { width: calc(14 * var(--k)); height: calc(12 * var(--k)); margin: 0 0 0 calc(-4 * var(--k)); }
  .event--3 .event__icon { margin-top: calc(20 * var(--k)); }
  .event__cutlery { width: calc(26 * var(--k)); height: calc(27 * var(--k)); }
  .event__title { font-size: calc(49 * var(--k)); line-height: calc(53.9 * var(--k)); }
  .event--1 .event__title { margin-top: calc(11 * var(--k)); }
  .event--2 .event__title { margin-top: calc(18 * var(--k)); }
  .event--3 .event__title { margin-top: calc(20 * var(--k)); }
  .event__meta { margin-top: calc(34 * var(--k)); }
  .event--2 .event__meta { margin-top: calc(47 * var(--k)); }
  .event--3 .event__meta { margin-top: calc(45 * var(--k)); }
  .event__note { font-size: calc(22 * var(--k)); line-height: calc(24.2 * var(--k)); margin-bottom: calc(2 * var(--k)); }
  .event__time, .event__place { font-size: calc(19 * var(--k)); line-height: calc(20.9 * var(--k)); }
  .schedule__cta { margin-top: calc(68 * var(--k)); }
  .btn--rsvp.btn--clear { width: calc(133 * var(--k)); height: calc(35 * var(--k)); font-size: calc(16.53 * var(--k)); }

  .split--60, .split--50 { grid-template-columns: minmax(0, 1fr); }

  .cultures__text { padding: calc(38 * var(--k)) calc(20 * var(--k)) calc(21 * var(--k)); }
  .cultures__flags { gap: calc(7 * var(--k)); margin-left: 0; }
  .cultures__flags img { width: calc(34 * var(--k)); height: calc(23 * var(--k)); }
  .cultures__title { margin-top: calc(21 * var(--k)); font-size: calc(33 * var(--k)); line-height: calc(36.3 * var(--k)); text-align: center; }
  .cultures__prose { width: calc(275 * var(--k)); margin: calc(11 * var(--k)) 0 0; font-size: calc(14 * var(--k)); line-height: calc(16.8 * var(--k)); }
  .cultures__media { padding: calc(39 * var(--k)) calc(20 * var(--k)) calc(38 * var(--k)); }
  .cultures__media img { width: calc(280 * var(--k)); height: calc(308 * var(--k)); }

  .lodging__text { padding: calc(51 * var(--k)) calc(20 * var(--k)) calc(39 * var(--k)); }
  .lodging__mini { position: absolute; left: calc(239 * var(--k)); top: calc(-27 * var(--k)); width: calc(66 * var(--k)); height: calc(127 * var(--k)); }
  .lodging__title { font-size: calc(43 * var(--k)); line-height: calc(47.3 * var(--k)); }
  .lodging__lead { margin-top: calc(12 * var(--k)); font-size: calc(15 * var(--k)); line-height: calc(18 * var(--k)); }
  .bullets { width: calc(280 * var(--k)); margin-top: calc(9 * var(--k)); padding-left: calc(23 * var(--k)); font-size: calc(13 * var(--k)); line-height: calc(15.6 * var(--k)); }
  .stay { margin-top: calc(44 * var(--k)); }
  .stay.stay--reserva { margin-top: calc(40 * var(--k)); }
  .stay.stay--cabin { margin-top: calc(43 * var(--k)); }
  .stay__title { font-size: calc(29 * var(--k)); line-height: calc(31.9 * var(--k)); white-space: normal; }
  .stay--reserva .stay__title, .stay--cabin .stay__title { padding-left: calc(5 * var(--k)); width: calc(270 * var(--k)); }
  .stay--reserva .stay__title { font-size: calc(30 * var(--k)); line-height: calc(33 * var(--k)); }
  .stay p { margin-top: calc(18 * var(--k)); font-size: calc(15 * var(--k)); line-height: calc(18 * var(--k)); }
  .stay--reserva p { margin-top: calc(10 * var(--k)); }
  .stay--cabin p { margin-top: 0; }
  .stay .btn--explora, .stay--cabin .btn--explora { width: calc(120 * var(--k)); height: calc(42 * var(--k)); margin: calc(18 * var(--k)) auto 0; font-size: calc(23.1 * var(--k)); }
  .stay--reserva .btn--explora { margin-top: calc(17 * var(--k)); }

  .gifts__media { height: calc(213 * var(--k)); }
  .gifts__img { width: 100%; transform: none !important; }
  .gifts__text { padding: calc(38 * var(--k)) calc(20 * var(--k)) calc(29 * var(--k)); }
  .gifts__title { font-size: calc(36 * var(--k)); line-height: calc(39.6 * var(--k)); }
  .gifts__prose { width: calc(280 * var(--k)); margin-top: calc(10 * var(--k)); font-size: calc(14 * var(--k)); line-height: calc(16.8 * var(--k)); }
  .gifts__prose p + p { margin-top: calc(16.8 * var(--k)); }
  .gifts__buttons { width: calc(280 * var(--k)); margin: calc(9 * var(--k)) 0 0; gap: calc(30 * var(--k)); }
  .btn--gift { width: calc(135 * var(--k)); height: calc(42 * var(--k)); font-size: calc(25.5 * var(--k)); }
  .badge { top: calc(36 * var(--k)); width: calc(142 * var(--k)); height: calc(21 * var(--k)); font-size: calc(8 * var(--k)); white-space: nowrap; padding: 0; }


  .notes__title { padding: calc(20 * var(--k)) 0 calc(46 * var(--k)) calc(29 * var(--k)); }
  .notes__title .script { font-size: calc(30 * var(--k)); line-height: calc(39 * var(--k)); }
  .notes__dress { padding: calc(19 * var(--k)) calc(20 * var(--k)) calc(63 * var(--k)); }
  .notes__dress .script { font-size: calc(30 * var(--k)); line-height: calc(39 * var(--k)); }
  .notes__dress p { width: calc(280 * var(--k)); margin: calc(10 * var(--k)) 0 0; font-size: calc(15 * var(--k)); line-height: calc(18 * var(--k)); }

  .footer { height: calc(47 * var(--k)); padding: calc(20 * var(--k)) 0 0; text-align: center; }
  .footer .monogram { font-size: calc(24 * var(--k)); line-height: 1; }
}
