/* Invitación: base y secciones. Los colores y letras vienen de cada diseño (variables --iv-*). */
:root {
  --iv-bg: #f5f2ea; --iv-paper: #fbf9f4; --iv-ink: #3b4134; --iv-muted: #6f7566; --iv-accent: #7d8b6a; --iv-accent2: #a9b597; --iv-band: #7d8b6a;
  --iv-display: 'Cormorant Garamond', Georgia, serif; --iv-script: 'Pinyon Script', cursive; --iv-body: 'Cormorant Garamond', Georgia, serif;
  --iv-sans: 'Jost', 'Helvetica Neue', Arial, sans-serif;
  --iv-w: 480px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: color-mix(in srgb, var(--iv-bg) 82%, #000 8%); color: var(--iv-ink); font: 400 19px/1.6 var(--iv-body); -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--iv-accent); outline-offset: 3px; }

.iv { max-width: var(--iv-w); margin: 0 auto; background: var(--iv-paper); min-height: 100svh; overflow: hidden; box-shadow: 0 0 60px -24px rgba(0, 0, 0, .35); }
.is-embed body { background: var(--iv-paper); }
.is-embed .iv { box-shadow: none; }
.is-embed .iv-back, .is-published .iv-back { display: none; }
.is-embed body::-webkit-scrollbar { display: none; }
.is-embed { scrollbar-width: none; }

.iv-back { position: fixed; top: 12px; left: 12px; z-index: 20; font: 500 .8rem var(--iv-sans); text-decoration: none; padding: .55em 1em; background: rgba(255, 255, 255, .92); color: #2a2422; box-shadow: 0 4px 14px -6px rgba(0, 0, 0, .3); }

/* Elementos comunes */
.iv-sec { position: relative; padding: 64px 32px; text-align: center; }
.iv-sec + .iv-sec { border-top: 1px solid color-mix(in srgb, var(--iv-accent) 22%, transparent); }
.iv-head { margin-bottom: 26px; }
.iv-head__script { margin: 0; font-family: var(--iv-script); font-size: 2rem; line-height: 1; color: var(--iv-accent); }
.iv-head__title { margin: 2px 0 0; font-family: var(--iv-display); font-weight: 500; font-size: 1.7rem; letter-spacing: .14em; text-transform: uppercase; line-height: 1.2; }
.iv-kicker { margin: 0; font-family: var(--iv-sans); font-size: .72rem; letter-spacing: .32em; text-transform: uppercase; }
.iv-note { margin: 0 auto 12px; max-width: 26em; color: var(--iv-muted); }
.iv-icon { width: 30px; height: 30px; color: var(--iv-accent); margin: 0 auto; }
.iv-icon--sm { width: 16px; height: 16px; margin: 0; }
.iv-icon--lg { width: 40px; height: 40px; margin-bottom: 14px; }
.iv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; padding: .8em 1.6em; border: 1px solid var(--iv-accent); background: var(--iv-accent); color: #fff; font: 500 .78rem var(--iv-sans); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: filter .2s, background .2s; }
.iv-btn:hover { filter: brightness(1.06); }
.iv-btn--ghost { background: transparent; color: var(--iv-ink); }
.iv-btn--ghost:hover { background: color-mix(in srgb, var(--iv-accent) 12%, transparent); }
.iv-orn { position: absolute; pointer-events: none; }
.iv-orn svg { width: 100%; height: auto; }
.iv-orn.is-flip { transform: scale(-1, -1); }

/* Presentación */
.iv-sec--intro { padding-top: 80px; }
.iv-orn--intro { width: 120px; top: -20px; right: -26px; opacity: .8; transform: rotate(160deg); }
.iv-message { max-width: 22em; margin: 0 auto 30px; font-size: 1.15rem; font-style: italic; }
.iv-monogram { display: flex; justify-content: center; align-items: center; gap: 18px; margin-bottom: 22px; font-family: var(--iv-display); }
.iv-monogram b { font-weight: 400; font-size: 3.6rem; line-height: 1; }
.iv-monogram__bar { width: 1px; height: 60px; background: var(--iv-accent); }
.iv-longdate { margin: 10px 0 0; font-size: 1.05rem; color: var(--iv-muted); }

/* Invitado */
.iv-sec--guest { padding: 44px 32px; }
.iv-guest { padding: 26px 20px; border: 1px solid var(--iv-accent); outline: 1px solid var(--iv-accent); outline-offset: -7px; }
.iv-guest__for { margin: 8px 0 0; font: .74rem var(--iv-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--iv-muted); }
.iv-guest__name { margin: 4px 0; font-family: var(--iv-display); font-size: 1.7rem; line-height: 1.2; }
.iv-guest__passes, .iv-guest__table { margin: 0; color: var(--iv-accent); font-weight: 600; }

/* Cuenta regresiva */
.iv-sec--countdown { background: var(--iv-band); color: #fff; }
.iv-count__title { margin: 0 0 14px; font: .78rem var(--iv-sans); letter-spacing: .34em; text-transform: uppercase; opacity: .9; }
.iv-count { display: flex; justify-content: center; gap: 6px; font-family: var(--iv-display); }
.iv-count span { display: flex; flex-direction: column; min-width: 70px; }
.iv-count span + span::before { content: ':'; position: absolute; translate: -10px 2px; font-size: 2.2rem; opacity: .6; }
.iv-count b { font-weight: 400; font-size: 2.8rem; line-height: 1; }
.iv-count small { font: .62rem var(--iv-sans); letter-spacing: .2em; text-transform: uppercase; opacity: .85; margin-top: 6px; }

/* Calendario */
.iv-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px 0; max-width: 300px; margin: 0 auto; font-family: var(--iv-display); }
.iv-cal__dow { font: .68rem var(--iv-sans); letter-spacing: .1em; color: var(--iv-muted); padding-bottom: 6px; }
.iv-cal__day { position: relative; padding: 6px 0; font-size: 1.05rem; }
.iv-cal__day.is-day { color: #fff; z-index: 0; font-weight: 600; }
.iv-cal__day.is-day::before { content: '♥'; position: absolute; inset: -4px 0 0; z-index: -1; display: grid; place-items: center; font-size: 2.3rem; line-height: 1; color: var(--iv-accent); }
.iv-cal__note { margin: 16px 0 4px; color: var(--iv-muted); }

/* Galería e historia */
.iv-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.iv-gallery img { width: 100%; height: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.iv-gallery img:first-child { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
.iv-gallery--2 img:first-child { grid-column: auto; aspect-ratio: 3 / 4; }
.iv-story__photo { margin: -64px -32px 34px; }
.iv-story__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.iv-story__text { max-width: 24em; margin: 0 auto 22px; }
.iv-quote { margin: 0 auto; max-width: 20em; font-family: var(--iv-script); font-size: 1.7rem; line-height: 1.25; color: var(--iv-accent); }
.iv-family p { margin: 0 0 6px; font-size: 1.15rem; }
.iv-family + .iv-head { margin-top: 30px; }
.iv-family__padrinos { margin: 0; font-size: 1.15rem; }

/* Itinerario */
.iv-timeline { list-style: none; padding: 0; margin: 0 auto; max-width: 300px; position: relative; text-align: left; }
.iv-timeline::before { content: ''; position: absolute; left: 25px; top: 10px; bottom: 10px; width: 1px; background: color-mix(in srgb, var(--iv-accent) 60%, transparent); }
.iv-timeline li { display: grid; grid-template-columns: 52px 1fr; gap: 18px; align-items: center; padding: 10px 0; }
.iv-timeline__icon { position: relative; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--iv-accent); background: var(--iv-paper); }
.iv-timeline__icon .iv-icon { width: 26px; height: 26px; }
.iv-timeline time { font: 500 .8rem var(--iv-sans); letter-spacing: .14em; color: var(--iv-accent); }
.iv-timeline p { margin: 0; font-size: 1.15rem; line-height: 1.3; }

/* Lugares, vestimenta, regalos */
.iv-place + .iv-place { margin-top: 40px; padding-top: 34px; border-top: 1px dashed color-mix(in srgb, var(--iv-accent) 45%, transparent); }
.iv-place__icon .iv-icon { width: 36px; height: 36px; }
.iv-place__kind { margin: 10px 0 0; font: .72rem var(--iv-sans); letter-spacing: .24em; text-transform: uppercase; color: var(--iv-muted); }
.iv-place__name { margin: 4px 0 2px; font-family: var(--iv-display); font-weight: 500; font-size: 1.5rem; }
.iv-place__addr, .iv-place__time { margin: 0; color: var(--iv-muted); }
.iv-dress__icons { display: flex; justify-content: center; gap: 6px; margin-bottom: 8px; }
.iv-dress__icons .iv-icon { width: 38px; height: 38px; margin: 0; }
.iv-dress__code { margin: 0 0 8px; font-family: var(--iv-display); font-size: 1.6rem; }
.iv-palette { display: flex; justify-content: center; gap: 10px; margin-top: 18px; }
.iv-palette span { width: 30px; height: 30px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.iv-gifts { list-style: none; padding: 0; margin: 14px auto 0; max-width: 22em; }
.iv-gifts li { padding: 12px 0; border-top: 1px solid color-mix(in srgb, var(--iv-accent) 25%, transparent); }
.iv-hashtag { margin: 0; font-family: var(--iv-display); font-size: 1.9rem; color: var(--iv-accent); word-break: break-word; }

/* Formularios */
.iv-form { display: grid; gap: 14px; text-align: left; max-width: 340px; margin: 0 auto; font-family: var(--iv-sans); font-size: .92rem; }
.iv-field { display: grid; gap: 6px; }
.iv-field > span { font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--iv-muted); }
.iv-form input[type="text"], .iv-form select, .iv-form textarea { font: inherit; color: var(--iv-ink); padding: .75em .85em; border: 1px solid color-mix(in srgb, var(--iv-accent) 45%, transparent); background: color-mix(in srgb, var(--iv-paper) 80%, #fff); border-radius: 0; }
.iv-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.iv-choice label { position: relative; }
.iv-choice input { position: absolute; opacity: 0; }
.iv-choice span { display: block; text-align: center; padding: .8em .4em; border: 1px solid color-mix(in srgb, var(--iv-accent) 45%, transparent); cursor: pointer; }
.iv-choice input:checked + span { background: var(--iv-accent); border-color: var(--iv-accent); color: #fff; }
.iv-choice input:focus-visible + span { outline: 2px solid var(--iv-accent); outline-offset: 2px; }
.iv-form__error { min-height: 1.2em; margin: 0; font-size: .84rem; color: #a0362e; }
.iv-form .iv-btn { margin-top: 0; width: 100%; }

/* Música y cierre */
.iv-player { display: flex; align-items: center; gap: 14px; max-width: 300px; margin: 0 auto; padding: 12px 16px; border: 1px solid color-mix(in srgb, var(--iv-accent) 40%, transparent); }
.iv-player__btn { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--iv-accent); color: #fff; cursor: pointer; flex: none; }
.iv-player__btn .iv-icon { width: 20px; height: 20px; color: #fff; }
.iv-player__info { flex: 1; display: grid; gap: 8px; text-align: left; font-family: var(--iv-sans); font-size: .9rem; }
.iv-player__bar { height: 3px; background: color-mix(in srgb, var(--iv-accent) 25%, transparent); }
.iv-player__bar i { display: block; width: 35%; height: 100%; background: var(--iv-accent); }
.iv-sec--closing { padding-bottom: 90px; }
.iv-closing__photo { margin: -64px -32px 36px; }
.iv-closing__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.iv-orn--closing { width: 110px; left: -30px; bottom: -10px; opacity: .8; }
.iv-sec--closing .iv-head__script { font-size: 2.6rem; }
.iv-closing__names { margin: 8px 0 0; font: .78rem var(--iv-sans); letter-spacing: .3em; text-transform: uppercase; }

/* Diseños oscuros */
[data-dark="true"] .iv-btn { color: #1b1712; }
[data-dark="true"] .iv-btn--ghost { color: var(--iv-ink); }
[data-dark="true"] .iv-sec--countdown { color: #1b1712; }
[data-dark="true"] .iv-cal__day.is-day { color: #1b1712; }
[data-dark="true"] .iv-choice input:checked + span { color: #1b1712; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
.iv-missing { margin: 0; padding: 40vh 32px 0; text-align: center; font-size: 1.2rem; color: var(--iv-muted); }
.iv-form__ok { margin: 0; padding: 18px; text-align: center; border: 1px solid var(--iv-accent); color: var(--iv-ink); font-family: var(--iv-sans); font-size: .95rem; }