/* ===========================================================================
   Invitaciones — estilos base (landing pública + plantillas)
   Las plantillas definen sus colores vía variables CSS (--bg, --text, etc.)
   =========================================================================== */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

/* ── Landing pública ──────────────────────────────────────────────────────*/
.pub-body { margin:0; font-family:'Montserrat',system-ui,sans-serif; color:#3d2b2b; background:#fffaf6; }
.pub-foot { text-align:center; padding:28px 16px; color:#b9a7a7; font-size:.8rem; }
/* ===========================================================================
   Photo booth
   =========================================================================== */
.booth-body { margin:0; background:#0c0a0b; color:#fff; font-family:'Montserrat',system-ui,sans-serif; }
/* Layout tipo app de cámara: header + foto + tira de marcos + controles, todo a pantalla */
.booth-main { display:flex; flex-direction:column; align-items:center; min-height:100svh; max-width:560px; margin:0 auto; padding:8px 12px 14px; box-sizing:border-box; }
.booth-head { text-align:center; padding:6px 10px 8px; flex:0 0 auto; }
.booth-head h1 { font-family:'Cormorant Garamond',Georgia,serif; font-size:1.35rem; margin:0; line-height:1.1; }
.booth-head p { margin:3px 0 0; color:rgba(255,255,255,.6); font-size:.8rem; }
/* La foto se ajusta a la altura disponible manteniendo 4:5 (se reserva sitio para marcos+botones) */
.booth-stage { position:relative; width:min(100%, calc((100svh - 250px) * 0.8)); aspect-ratio:4/5; background:#000; border-radius:16px; overflow:hidden; flex:0 0 auto; }
.booth-stage video, .booth-stage #bthResult { width:100%; height:100%; object-fit:cover; display:block; }
.booth-stage video { transform:scaleX(-1); } /* espejo selfie */
.booth-loading { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:rgba(255,255,255,.7); font-size:.9rem; padding:18px; }
.booth-loading span { font-size:.78rem; opacity:.7; margin-top:8px; }
.booth-frames { display:flex; gap:9px; overflow-x:auto; padding:12px 2px 8px; scrollbar-width:none; max-width:100%; flex:0 0 auto; }
.booth-frames::-webkit-scrollbar { display:none; }
.booth-frame { flex:0 0 auto; background:none; border:2.5px solid transparent; border-radius:9px; padding:2px; cursor:pointer; line-height:0; }
.booth-frame canvas { width:48px; height:60px; border-radius:6px; }
.booth-frame.on { border-color:var(--bth-accent,#b76e79); }
.booth-controls { display:flex; flex-direction:column; align-items:center; gap:14px; flex:0 0 auto; width:100%; }
#bthControlsCam { flex-direction:row; justify-content:center; align-items:center; gap:40px; }
.booth-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; background:rgba(255,255,255,.14); color:#fff; border:none; border-radius:999px; padding:13px 22px; font-size:1rem; font-weight:600; cursor:pointer; text-decoration:none; }
.booth-btn.ghost { width:60px; height:60px; padding:0; font-size:1.6rem; }
.booth-btn.big { width:84px; height:84px; border-radius:50%; background:#fff; border:6px solid var(--bth-accent,#b76e79); box-shadow:0 0 0 4px rgba(255,255,255,.15); }
.booth-btn.big:active { transform:scale(.93); }
.booth-btn.primary { background:var(--bth-accent,#b76e79); }
.booth-input { width:100%; max-width:320px; padding:11px 14px; border-radius:10px; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08); color:#fff; font-size:16px; text-align:center; }
.booth-input::placeholder { color:rgba(255,255,255,.45); }
.booth-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.booth-msg { color:var(--bth-accent,#b76e79); font-weight:600; min-height:1.2em; margin:4px 0 0; text-align:center; }
.booth-album-link { text-align:center; margin-top:22px; }
.booth-album-link a { color:rgba(255,255,255,.8); }
.booth-album { max-width:920px; margin:0 auto; padding:10px 14px 40px; }
.booth-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; }
.booth-cell { position:relative; display:block; border-radius:10px; overflow:hidden; }
.booth-cell img { width:100%; aspect-ratio:4/5; object-fit:cover; display:block; }
.booth-dl { position:absolute; bottom:6px; right:6px; background:rgba(0,0,0,.55); color:#fff; border-radius:50%; width:30px; height:30px; display:flex; align-items:center; justify-content:center; }

/* Botón flotante de WhatsApp (landing) */
.wa-float { position:fixed; right:18px; bottom:18px; z-index:60; width:56px; height:56px; border-radius:50%; background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 20px rgba(0,0,0,.3); text-decoration:none; transition:transform .2s; }
.wa-float:hover { transform:scale(1.08); }
.wa-float svg { width:32px; height:32px; }
@media(max-width:560px){ .wa-float { width:52px; height:52px; right:14px; bottom:14px; } .wa-float svg { width:29px; height:29px; } }
.home-hero { padding:90px 20px 60px; text-align:center; background:linear-gradient(160deg,#fff6f0,#fbe9e7); }
.home-hero-inner { max-width:680px; margin:0 auto; }
.home-eyebrow { text-transform:uppercase; letter-spacing:.25em; font-size:.72rem; color:#b76e79; margin:0 0 14px; }
.home-title { font-family:'Cormorant Garamond',serif; font-size:2.6rem; line-height:1.15; color:#3d2b2b; margin:0 0 16px; }
.home-sub { font-size:1.05rem; color:#6b5b5b; margin:0 0 28px; }
.home-cta { display:inline-block; background:#b76e79; color:#fff; text-decoration:none; padding:13px 28px; border-radius:999px; font-weight:600; }
.home-cta:hover { background:#a25b66; }
.home-note { font-size:.8rem; color:#9a8a8a; margin-top:14px; }
.home-steps { max-width:900px; margin:48px auto; padding:0 20px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:22px; }
.home-step { text-align:center; }
.home-step span { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:50%; background:#b76e79; color:#fff; font-weight:700; margin-bottom:12px; }
.home-step h3 { font-family:'Cormorant Garamond',serif; font-size:1.3rem; margin:0 0 6px; color:#3d2b2b; }
.home-step p { font-size:.9rem; color:#6b5b5b; margin:0; }
@media(max-width:640px){ .home-title{ font-size:2rem; } }
.home-note a { color:#b76e79; font-weight:600; }
/* Contacto / cotización */
.home-contact { background:linear-gradient(160deg,#fff6f0,#fbe9e7); padding:60px 20px 72px; }
.home-contact-inner { max-width:640px; margin:0 auto; text-align:center; }
.home-contact-title { font-family:'Cormorant Garamond',serif; font-size:2rem; color:#3d2b2b; margin:0 0 8px; }
.home-contact-sub { color:#6b5b5b; margin:0 0 24px; }
.home-form { background:#fff; border-radius:16px; padding:26px 22px; box-shadow:0 16px 40px rgba(0,0,0,.08); text-align:left; }
.home-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.home-form label { display:block; font-size:.82rem; color:#6b5b5b; font-weight:600; margin-bottom:14px; }
.home-form input, .home-form textarea { width:100%; margin-top:5px; padding:12px 13px; border:1px solid #e2d6d0; border-radius:10px; font-family:inherit; font-size:16px; box-sizing:border-box; }
.home-form-btn { border:none; cursor:pointer; width:100%; margin-top:4px; }
.home-alert { border-radius:10px; padding:13px 16px; margin-bottom:18px; font-size:.92rem; }
.home-alert.ok { background:rgba(16,185,129,.12); color:#067a57; border:1px solid rgba(16,185,129,.4); }
.home-alert.err { background:rgba(239,68,68,.1); color:#b91c1c; border:1px solid rgba(239,68,68,.4); }
@media(max-width:560px){ .home-form-grid{ grid-template-columns:1fr; } .home-contact-title{ font-size:1.6rem; } }
/* Landing por ciudad (SEO local) */
.ciudad-h2 { font-family:'Cormorant Garamond',serif; font-size:2rem; color:#3d2b2b; text-align:center; margin:0 0 28px; }
.ciudad-feats { max-width:960px; margin:56px auto; padding:0 20px; }
.ciudad-feats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:22px; }
.ciudad-feat { background:#fff; border:1px solid #f0e6e0; border-radius:14px; padding:24px 20px; text-align:center; box-shadow:0 6px 18px rgba(0,0,0,.05); }
.ciudad-feat-ico { display:inline-flex; color:#b76e79; margin-bottom:10px; }
.ciudad-feat-ico svg { width:34px; height:34px; }
.ciudad-feat h3 { font-family:'Cormorant Garamond',serif; font-size:1.3rem; margin:0 0 6px; color:#3d2b2b; }
.ciudad-feat p { font-size:.92rem; color:#6b5b5b; margin:0; line-height:1.6; }
.ciudad-faq { max-width:720px; margin:56px auto; padding:0 20px; }
.ciudad-faq-item { background:#fff; border:1px solid #f0e6e0; border-radius:12px; padding:4px 18px; margin-bottom:12px; }
.ciudad-faq-item summary { cursor:pointer; font-weight:600; color:#3d2b2b; padding:14px 0; font-size:1rem; list-style:none; }
.ciudad-faq-item summary::-webkit-details-marker { display:none; }
.ciudad-faq-item summary::after { content:'+'; float:right; color:#b76e79; font-size:1.3rem; line-height:1; }
.ciudad-faq-item[open] summary::after { content:'−'; }
.ciudad-faq-item p { margin:0 0 16px; color:#6b5b5b; line-height:1.7; font-size:.95rem; }
.ciudad-cta { text-align:center; background:linear-gradient(160deg,#fff6f0,#fbe9e7); padding:56px 20px; }
.ciudad-cta p { font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:#3d2b2b; max-width:560px; margin:0 auto 22px; }

/* ── Base de las plantillas de invitación ─────────────────────────────────*/
.inv { margin:0; font-family:var(--font-body); color:var(--text); background:var(--bg); line-height:1.7; }
.inv-section { max-width:760px; margin:0 auto; padding:64px 22px; text-align:center; }
.inv-hero { min-height:100vh; min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:40px 22px; position:relative; background-size:cover; background-position:center; }
.inv-hero.has-photo::before { content:''; position:absolute; inset:0; background:var(--hero-overlay,rgba(0,0,0,.35)); }
.inv-hero > * { position:relative; z-index:1; }
.inv-hero.has-photo { color:#fff; }
.inv-eyebrow { text-transform:uppercase; letter-spacing:.3em; font-size:.75rem; opacity:.85; margin:0 0 18px; }
.inv-names { font-family:var(--font-heading); font-size:clamp(2.6rem,9vw,5rem); line-height:1.05; margin:0; font-weight:600; }
.inv-amp { color:var(--accent); font-style:italic; }
.inv-date { margin-top:18px; font-size:1.05rem; letter-spacing:.08em; }
.inv-h2 { font-family:var(--font-heading); font-size:2rem; color:var(--text); margin:0 0 10px; }
.inv-divider { width:60px; height:2px; background:var(--accent); margin:14px auto 28px; border:0; }
.inv-msg { font-size:1.05rem; color:var(--muted); max-width:560px; margin:0 auto; }

.inv-countdown { display:flex; gap:18px; justify-content:center; margin-top:26px; }
.inv-cd-box { background:var(--card); color:var(--text); border-radius:12px; padding:14px 10px; min-width:72px; box-shadow:0 4px 18px rgba(0,0,0,.08); }
.inv-cd-num { font-family:var(--font-heading); font-size:2rem; font-weight:700; line-height:1; }
.inv-cd-lbl { font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); margin-top:4px; }

.inv-cards { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:10px; }
.inv-card { background:var(--card); border:1px solid rgba(0,0,0,.06); border-radius:14px; padding:26px 20px; }
.inv-card h3 { font-family:var(--font-heading); font-size:1.5rem; margin:0 0 8px; color:var(--text); }
.inv-card p { margin:4px 0; color:var(--muted); font-size:.95rem; }
.inv-btn { display:inline-block; margin-top:12px; background:var(--accent); color:#fff; text-decoration:none; padding:9px 18px; border-radius:999px; font-size:.82rem; font-weight:600; }
.inv-btn:hover { opacity:.9; }

.inv-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:10px; }
.inv-gallery img { width:100%; height:200px; object-fit:cover; border-radius:8px; cursor:pointer; }
@media(max-width:640px){ .inv-gallery{ grid-template-columns:repeat(2,1fr);} .inv-gallery img{ height:140px; } .inv-cards{ grid-template-columns:1fr; } }

.inv-gifts { list-style:none; padding:0; margin:16px 0 0; display:flex; flex-direction:column; gap:10px; align-items:center; }
.inv-gifts a { color:var(--accent); font-weight:600; text-decoration:none; }

/* ── Mesa de regalos: tienda ──────────────────────────────────────────────── */
.inv-shop { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; margin-top:8px; }
.inv-prod { background:var(--card); border:1px solid rgba(0,0,0,.07); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 8px 24px rgba(0,0,0,.06); text-align:left; }
.inv-prod-img { aspect-ratio:4/3; background:#f3ecea; }
.inv-prod-img img { width:100%; height:100%; object-fit:cover; display:block; }
.inv-prod-body { padding:16px 16px 18px; display:flex; flex-direction:column; gap:6px; flex:1; }
.inv-prod-name { font-family:var(--font-heading); font-size:1.25rem; margin:0; color:var(--text); }
.inv-prod-desc { font-size:.85rem; color:var(--muted); margin:0; }
.inv-prod-price { font-size:1.05rem; font-weight:700; color:var(--accent); margin:4px 0 10px; }
.inv-prod .inv-btn { margin-top:auto; align-self:flex-start; }
.inv-prod.is-taken { opacity:.62; }
.inv-prod-taken { margin-top:auto; display:inline-block; font-size:.85rem; font-weight:600; color:var(--muted); background:rgba(0,0,0,.05); border-radius:999px; padding:7px 14px; }

/* Modal de regalo */
.inv-gift-modal { position:fixed; inset:0; background:rgba(0,0,0,.62); display:none; align-items:center; justify-content:center; z-index:60; padding:18px; }
.inv-gift-modal.open { display:flex; }
.inv-gift-card { background:var(--card); color:var(--text); border-radius:18px; max-width:440px; width:100%; padding:28px 24px; position:relative; max-height:90dvh; overflow-y:auto; text-align:left; }
.inv-gift-close { position:absolute; top:12px; right:14px; background:none; border:none; font-size:1.6rem; line-height:1; color:var(--muted); cursor:pointer; }
.inv-gift-title { font-family:var(--font-heading); font-size:1.5rem; margin:0 0 4px; color:var(--text); }
.inv-gift-price { color:var(--accent); font-weight:700; margin:0 0 14px; }
.inv-gift-card label { display:block; font-size:.82rem; color:var(--muted); margin:12px 0 4px; }
.inv-gift-card input, .inv-gift-card textarea { width:100%; padding:12px 13px; border:1px solid rgba(0,0,0,.15); border-radius:10px; font-family:inherit; font-size:16px; background:#fff; color:#333; box-sizing:border-box; }
.inv-gift-err { color:#b91c1c; font-size:.85rem; margin:10px 0 0; min-height:1em; }
.inv-gift-pay-intro { font-size:.95rem; color:var(--muted); margin:0 0 14px; }
.inv-bank { display:flex; flex-direction:column; gap:8px; }
.inv-bank-row { display:flex; align-items:center; gap:10px; background:rgba(0,0,0,.04); border-radius:10px; padding:10px 12px; }
.inv-bank-lbl { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); min-width:64px; }
.inv-bank-val { font-weight:600; flex:1; word-break:break-all; }
.inv-copy { background:var(--accent); color:#fff; border:none; border-radius:8px; padding:6px 12px; font-size:.74rem; font-weight:600; cursor:pointer; white-space:nowrap; }
@media(max-width:480px){ .inv-shop { grid-template-columns:1fr 1fr; gap:12px; } .inv-prod-name{ font-size:1.05rem; } }

/* Mesa de regalos clickeable: la tarjeta entera invita al clic */
.inv-prod:not(.is-taken){ cursor:pointer; transition:transform .25s ease, box-shadow .25s ease; }
.inv-prod:not(.is-taken):hover{ transform:translateY(-5px); box-shadow:0 16px 36px rgba(0,0,0,.14); }
.inv-prod:not(.is-taken):hover .inv-gift-btn{ background:var(--accent2,var(--accent)); }
.inv-gift-btn{ cursor:pointer; }

/* ===========================================================================
   Iconos de sección, papás, padrinos, itinerario, no niños, textos intro
   =========================================================================== */
.inv-ico { width:30px; height:30px; display:inline-block; vertical-align:middle; }
.inv-sec-ico { color:var(--accent); display:flex; justify-content:center; margin-bottom:10px; }
.inv-sec-ico .inv-ico { width:38px; height:38px; }
.inv-card-ico { display:inline-flex; align-items:center; color:var(--accent); margin-right:8px; }
.inv-card-ico .inv-ico { width:22px; height:22px; }
.inv-intro { margin-bottom:26px !important; font-style:italic; }
.inv-dresscode { margin-top:24px; color:var(--muted); display:flex; align-items:center; justify-content:center; gap:8px; }
.inv-dresscode .inv-ico { width:22px; height:22px; color:var(--accent); }

/* Saludo personalizado (link de invitado) */
.inv-saludo { font-family:var(--font-heading); font-size:1.5rem; font-style:italic; margin:0 0 12px; opacity:.95; }

/* Papás en el hero */
.inv-padres { margin-top:22px; }
.inv-padres-lbl { font-size:.72rem; text-transform:uppercase; letter-spacing:.18em; opacity:.8; margin:0 0 6px; }
.inv-padres p { margin:2px 0; font-size:1rem; }

/* Padrinos */
.inv-padrinos { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px; margin-top:10px; }
.inv-padrino { background:var(--card); border:1px solid rgba(0,0,0,.06); border-radius:14px; padding:18px 16px; }
.inv-padrino-rol { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--accent); margin-bottom:4px; }
.inv-padrino-nom { display:block; font-family:var(--font-heading); font-size:1.2rem; color:var(--text); }

/* Itinerario / minuto a minuto */
.inv-timeline { max-width:480px; margin:10px auto 0; display:flex; flex-direction:column; }
.inv-tl-item { display:flex; gap:16px; align-items:flex-start; padding:0 0 26px; position:relative; }
.inv-tl-item:not(:last-child)::before { content:''; position:absolute; left:23px; top:40px; bottom:0; width:2px; background:rgba(0,0,0,.08); }
.inv-tl-ico { flex-shrink:0; width:48px; height:48px; border-radius:50%; background:var(--card); border:2px solid var(--accent); color:var(--accent); display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.06); }
.inv-tl-ico .inv-ico { width:24px; height:24px; }
.inv-tl-body { text-align:left; padding-top:4px; }
.inv-tl-hora { display:block; font-family:var(--font-heading); font-size:1.25rem; color:var(--accent); line-height:1.1; }
.inv-tl-tit { display:block; color:var(--text); font-size:1rem; }

/* No niños */
.inv-noninos .inv-sec-ico { color:var(--accent); }

.inv-form { max-width:480px; margin:18px auto 0; text-align:left; }
.inv-form label { display:block; font-size:.82rem; color:var(--muted); margin:12px 0 4px; }
/* font-size 16px evita el zoom automático de iOS al enfocar un campo */
.inv-form input, .inv-form textarea, .inv-form select { width:100%; padding:12px 13px; border:1px solid rgba(0,0,0,.15); border-radius:10px; font-family:inherit; font-size:16px; background:#fff; color:#333; }
.inv-radio { display:flex; gap:18px; margin-top:6px; }
.inv-radio label { display:flex; align-items:center; gap:6px; margin:0; color:var(--text); }
.inv-submit { margin-top:20px; width:100%; background:var(--accent); color:#fff; border:none; border-radius:999px; padding:14px; font-size:1rem; font-weight:700; cursor:pointer; }
.inv-alert { background:rgba(16,185,129,.12); color:#067a57; border:1px solid rgba(16,185,129,.4); border-radius:10px; padding:12px 14px; margin:12px 0; font-size:.9rem; text-align:center; }
.inv-alert.err { background:rgba(239,68,68,.1); color:#b91c1c; border-color:rgba(239,68,68,.4); }
.inv-foot { text-align:center; padding:40px 20px; color:var(--muted); font-size:.85rem; }

/* Botón flotante de música */
.inv-music { position:fixed; right:16px; bottom:16px; z-index:55; width:50px; height:50px; border-radius:50%; border:none; background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(0,0,0,.28); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.inv-music svg { width:24px; height:24px; }
.inv-music.playing { animation:invMusicPulse 1.8s ease-in-out infinite; }
@keyframes invMusicPulse { 0%,100% { transform:scale(1); box-shadow:0 6px 18px rgba(0,0,0,.28); } 50% { transform:scale(1.08); box-shadow:0 6px 26px var(--accent); } }
@media (prefers-reduced-motion: reduce){ .inv-music.playing { animation:none; } }

/* Lightbox */
.inv-lb { position:fixed; inset:0; background:rgba(0,0,0,.9); display:none; align-items:center; justify-content:center; z-index:50; padding:20px; }
.inv-lb.open { display:flex; }
.inv-lb img { max-width:100%; max-height:90vh; max-height:90dvh; border-radius:8px; }

/* ===========================================================================
   Efectos — reveal al scroll, parallax, Ken Burns y microinteracciones.
   Configurables por invitación desde el editor (config_json → efectos).
   Todo el movimiento respeta prefers-reduced-motion.
   =========================================================================== */

/* Parallax del hero: la foto va en una capa interna que se desplaza con el scroll */
.inv-hero.is-parallax { overflow:hidden; }
.inv-hero.is-parallax > .inv-hero-bg {
    position:absolute; left:0; right:0; top:-12%; height:124%;
    background-size:cover; background-position:center; z-index:0; will-change:transform;
}
.inv-hero.is-parallax.has-photo::before { z-index:1; }

/* Video de fondo del hero: cubre el header, el overlay (::before) queda encima */
.inv-hero.has-video { overflow:hidden; }
.inv-hero-video {
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; z-index:0; pointer-events:none;
}
.inv-hero.has-video.has-photo::before { z-index:1; }

@media (prefers-reduced-motion: no-preference) {
    /* Efectos de entrada (reveal). Estado inicial oculto → .fx-in al entrar en viewport */
    [data-fx] {
        opacity:0;
        transition:opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1), filter .9s ease;
        will-change:opacity, transform;
    }
    [data-fx="fade-up"]    { transform:translateY(42px); }
    [data-fx="fade-left"]  { transform:translateX(-48px); }
    [data-fx="fade-right"] { transform:translateX(48px); }
    [data-fx="zoom"]       { transform:scale(.9); }
    [data-fx="blur"]       { filter:blur(14px); }
    [data-fx].fx-in        { opacity:1; transform:none; filter:none; }

    /* Ken Burns: zoom lento y continuo en las fotos de la galería */
    .fx-kenburns .inv-gallery img,
    .fx-kenburns .inv-zz-photo img { animation:invKenburns 16s ease-in-out infinite alternate; }
    @keyframes invKenburns { from { transform:scale(1); } to { transform:scale(1.12); } }
}

/* Microinteracciones (hover/sombra/zoom suaves) — sólo si están activadas */
.fx-micro .inv-btn,
.fx-micro .inv-submit { transition:transform .25s ease, box-shadow .25s ease, opacity .25s ease; }
.fx-micro .inv-btn:hover,
.fx-micro .inv-submit:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.18); }
.fx-micro .inv-card { transition:transform .3s ease, box-shadow .3s ease; }
.fx-micro .inv-card:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(0,0,0,.12); }
.fx-micro .inv-cd-box { transition:transform .3s ease, box-shadow .3s ease; }
.fx-micro .inv-cd-box:hover { transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.14); }
.fx-micro .inv-gallery img { transition:transform .4s ease, filter .4s ease; }
.fx-micro .inv-gallery img:hover { transform:scale(1.05); filter:saturate(1.08); }

/* ── Galería scrollytelling (zigzag): foto a un lado, texto al otro ───────── */
.inv-zz { display:flex; flex-direction:column; gap:72px; margin-top:24px; }
.inv-zz-item { display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center; text-align:left; }
.inv-zz-item.rev .inv-zz-photo { order:2; }
.inv-zz-item.no-text { grid-template-columns:1fr; max-width:680px; margin:0 auto; }
.inv-zz-photo { border-radius:16px; overflow:hidden; box-shadow:0 20px 44px rgba(0,0,0,.16); }
.inv-zz-photo img { width:100%; max-height:540px; object-fit:cover; display:block; }
.inv-zz-text p { font-family:var(--font-heading); font-size:1.3rem; line-height:1.6; color:var(--text); margin:0; }
.inv-zz-cta { margin-top:52px; }
@media (max-width:680px) {
    .inv-zz { gap:48px; }
    .inv-zz-item, .inv-zz-item.rev { grid-template-columns:1fr; gap:18px; text-align:center; }
    .inv-zz-item.rev .inv-zz-photo { order:0; }
    .inv-zz-text p { font-size:1.12rem; }
}

/* ── Galería en carrusel ──────────────────────────────────────────────────── */
.inv-carousel { position:relative; margin-top:8px; }
.inv-car-track { display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:6px 4px 12px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.inv-car-track::-webkit-scrollbar { display:none; }
.inv-car-slide { flex:0 0 78%; max-width:560px; scroll-snap-align:center; margin:0; border-radius:16px; overflow:hidden; box-shadow:0 16px 40px rgba(0,0,0,.16); position:relative; background:var(--card); }
.inv-car-slide img { width:100%; height:60vh; max-height:560px; object-fit:cover; display:block; cursor:zoom-in; }
.inv-car-slide figcaption { position:absolute; left:0; right:0; bottom:0; padding:32px 16px 14px; color:#fff; font-size:.95rem; text-align:left; background:linear-gradient(transparent, rgba(0,0,0,.6)); }
.inv-car-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:42px; height:42px; border-radius:50%; border:none; background:rgba(255,255,255,.92); color:#333; font-size:1.7rem; line-height:1; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.18); display:flex; align-items:center; justify-content:center; }
.inv-car-nav.prev { left:6px; } .inv-car-nav.next { right:6px; }
.inv-car-dots { display:flex; gap:8px; justify-content:center; margin-top:8px; flex-wrap:wrap; }
.inv-car-dot { width:9px; height:9px; border-radius:50%; border:none; background:rgba(0,0,0,.18); cursor:pointer; padding:0; transition:background .2s; }
.inv-car-dot.on { background:var(--accent); }
@media(max-width:640px){ .inv-car-slide { flex-basis:86%; } .inv-car-slide img { height:48vh; } .inv-car-nav{ width:36px; height:36px; font-size:1.4rem; } }

/* ── Página de galería completa ──────────────────────────────────────────── */
.inv-galeria-head { text-align:center; padding:56px 22px 8px; }
.inv-galeria-sub { font-family:var(--font-heading); font-size:1.4rem; color:var(--accent); margin:6px 0 0; }
.inv-back { display:inline-block; color:var(--muted); text-decoration:none; font-size:.85rem; letter-spacing:.04em; margin-bottom:18px; }
.inv-back:hover { color:var(--accent); }
.inv-gallery-full { grid-template-columns:repeat(3,1fr); }
@media(max-width:640px){ .inv-gallery-full { grid-template-columns:repeat(2,1fr); } }

/* ===========================================================================
   Optimización móvil (invitación pública)
   =========================================================================== */
/* La cuenta regresiva (4 cajas) se desborda en pantallas angostas: que las
   cajas se repartan el ancho en vez de tener min-width fijo. */
@media (max-width:560px) {
    .inv-countdown { gap:8px; }
    .inv-cd-box { min-width:0; flex:1 1 0; padding:12px 4px; }
    .inv-cd-num { font-size:1.6rem; }
    .inv-cd-lbl { font-size:.6rem; letter-spacing:.05em; }
}
@media (max-width:480px) {
    .inv-section { padding:48px 18px; }
    .inv-h2 { font-size:1.6rem; }
    .inv-msg { font-size:1rem; }
    /* objetivos táctiles ≥44px */
    .inv-btn { padding:12px 22px; font-size:.85rem; }
    .inv-card { padding:22px 16px; }
    .inv-foot { padding:32px 18px; }
}