/* ============================================================
   GoKonfirma — invitacion.css  v2.0
   Diseño moderno, profesional y responsivo de invitaciones.
   ============================================================ */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;scroll-behavior:smooth;}
:root{
  --bg:#FBF7F1; --bg2:#FFFFFF; --accent:#B98E5E; --accent2:#D8A7A0;
  --ink:#43362A; --ink2:#6B5B4A; --ft-display:'Cormorant Garamond',serif; --ft-body:'Jost',sans-serif;
  --radius:20px; --shadow:0 8px 40px -12px rgba(0,0,0,.12);
  --tone-accent-bg:#7A8371; --tone-beige-bg:#E7DAC4;
  --paper-tex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
body{font-family:var(--ft-body);background:var(--bg);color:var(--ink2);-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative;}
body.dark{background:var(--bg);}

/* ── Fondo decorativo ──────────────────────────────────────── */
#gk-fondo-layer{position:fixed;inset:0;pointer-events:none;z-index:0;}

/* ── Portada ────────────────────────────────────────────────── */
.cover{
  min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  padding:60px 24px 80px;
  text-align:center;
  background:linear-gradient(170deg,var(--bg) 0%,var(--bg2) 55%,var(--bg) 100%);
  position:relative;overflow:hidden;
}
.cover::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% 0%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%);
  pointer-events:none;
}
.cover-inner{max-width:600px;position:relative;z-index:2;}
.cover .eyebrow{font:700 .68rem/1 var(--ft-body);letter-spacing:.38em;text-transform:uppercase;color:var(--accent);margin:0 0 22px;}
.cover-h{
  font-family:var(--ft-display);
  font-size:clamp(2.8rem,10vw,5.5rem);
  line-height:1.04;letter-spacing:-.025em;
  color:var(--ink);margin:0 0 22px;
  word-break:break-word;
}
.cover-meta{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:6px;}
.cover-date,.cover-lugar{
  font:500 .98rem/1.3 var(--ft-body);
  color:var(--ink2);margin:0;
  display:flex;align-items:center;gap:8px;
}
.cover-date i,.cover-lugar i{color:var(--accent);font-size:.85rem;}
/* Fecha editorial: día grande entre líneas */
.fecha-ed{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:14px;}
.fecha-ed .fe-l{display:block;height:1px;width:clamp(48px,16vw,84px);background:color-mix(in srgb,var(--ink) 55%,transparent);}
.fecha-ed .fe-day{
  font-family:var(--ft-display);
  font-size:clamp(2.6rem,9vw,3.8rem);
  font-weight:500;color:var(--ink);line-height:1;
}
.fe-mes{
  font:500 .78rem/1.4 var(--ft-body);
  letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;
  color:var(--ink2);margin:10px 0 0;
}

/* Ornamento decorativo */
.orn{display:flex;align-items:center;justify-content:center;gap:0;margin:16px auto;}
.orn span{display:block;height:1px;width:40px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.45;}

/* ── Secciones genéricas — cards apiladas estilo papelería ──── */
.sec{
  padding:64px 26px;
  max-width:720px;
  margin:0 auto;
  text-align:center;
  position:relative;
  min-height:80px;
}
/* Diseño final v5: sin "cuadro" — el contenido flota sobre un halo
   difuminado transparente que se funde con el fondo (sin bordes visibles).
   Los efectos explícitos sec-ef-* del organizador restauran su caja. */
.sec-deco{
  max-width:min(560px,calc(100% - 32px));
  margin:20px auto;
  padding:52px 28px 46px;
  background:transparent;
  border-radius:30px;
  box-shadow:none;
  overflow:visible;
  isolation:isolate;
}
.sec-deco::before{
  /* Halo generoso: opaco hasta ~68% del radio y se desvanece hasta el
     100%, así secciones altas (p.ej. vestimenta con icono+hint) no
     terminan en un corte duro — antes el 82% dejaba una franja sin
     cubrir en cards con mucho contenido vertical. */
  content:'';position:absolute;inset:-16% -14%;z-index:-1;
  background:color-mix(in srgb,var(--halo,var(--bg2)) 88%,transparent);
  filter:blur(16px);
  -webkit-mask-image:radial-gradient(78% 78% at 50% 50%,#000 68%,transparent 100%);
  mask-image:radial-gradient(78% 78% at 50% 50%,#000 68%,transparent 100%);
  pointer-events:none;
}
.sec-deco[class*="sec-ef-"]{overflow:hidden;box-shadow:0 18px 50px -22px rgba(0,0,0,.18);}
.sec-deco[class*="sec-ef-"]::before{inset:0;filter:none;-webkit-mask-image:none;mask-image:none;background:transparent;background-image:var(--paper-tex);background-size:260px 260px;opacity:.16;mix-blend-mode:overlay;}
.sec-deco > *{position:relative;}
/* Formas */
.sec-shape-arch{border-radius:999px 999px 30px 30px;padding-top:74px;}
.sec-shape-dome{border-radius:50% 50% 30px 30px / 26% 26% 30px 30px;padding-top:66px;}
.sec-shape-banner{border-radius:14px;}
.sec-shape-ribbon{
  border-radius:0;
  max-width:min(600px,calc(100% - 16px));
  clip-path:polygon(2.5% 0%,97.5% 0%,100% 9%,100% 91%,97.5% 100%,2.5% 100%,0% 91%,0% 9%);
  box-shadow:none;
}
/* Tonos */
.sec-tone-beige{background:transparent;--halo:var(--tone-beige-bg);}
.sec-tone-accent{
  background:transparent;
  --halo:var(--tone-accent-bg);
  --ink:#FFFDF8;
  --ink2:rgba(255,252,245,.85);
  --accent:#EFE3CC;
  --accent2:#E8D9BE;
  --bg2:rgba(255,255,255,.10);
  color:var(--ink2);
}
.sec-h{
  font-family:var(--ft-display);
  font-size:clamp(1.2rem,3.8vw,1.6rem);
  color:var(--ink);
  margin:0 0 10px;
  letter-spacing:.32em;
  text-indent:.32em;
  text-transform:uppercase;
  font-weight:500;
  line-height:1.3;
}
body.ft-script .sec-h{text-transform:none;letter-spacing:.05em;text-indent:0;font-size:clamp(1.8rem,5vw,2.3rem);}
.sec-deco .orn{display:none;}
/* Line-art decorativo */
.la{display:block;margin:6px auto 14px;color:var(--ink);opacity:.75;}
.la-couple{width:min(150px,44vw);}
.la-garments{width:min(140px,40vw);}
.la-gifts{width:min(140px,40vw);}
.sec-tone-accent .la{color:var(--accent);opacity:.95;}
.sec p{font-size:1.04rem;line-height:1.72;color:var(--ink2);margin:0 0 14px;}
.sec .link,.sec a.link{color:var(--accent);font-weight:600;text-decoration:underline;}

/* Quote bienvenida */
.sec-quote{position:relative;padding:10px 10px;max-width:480px;margin:0 auto;}
.sec-qi{font-size:1.1rem;color:var(--accent);opacity:.35;}
.sec-qi-r{display:block;text-align:right;margin-top:4px;}
.sec-quote p{font-size:1.08rem;line-height:1.75;color:var(--ink2);margin:8px 0;}

/* Botones */
.btn-pill{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--accent);color:#fff;
  padding:13px 28px;border-radius:99px;border:0;
  font:600 .95rem/1 var(--ft-body);cursor:pointer;
  text-decoration:none;
  box-shadow:0 6px 20px -6px color-mix(in srgb,var(--accent) 60%,transparent);
  transition:opacity .2s,transform .15s;
}
.btn-pill:hover{opacity:.88;transform:translateY(-1px);}
.btn-outline{
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:var(--ink);
  padding:11px 26px;border-radius:99px;
  border:1px solid color-mix(in srgb,var(--ink) 45%,transparent);
  font:500 .74rem/1 var(--ft-body);cursor:pointer;
  letter-spacing:.22em;text-indent:.1em;text-transform:uppercase;
  text-decoration:none;
  transition:background .2s,color .2s,border-color .2s;
}
.btn-outline:hover{background:var(--ink);color:var(--bg2);border-color:var(--ink);}

/* Info card genérica */
.info-card{
  background:var(--bg2);border:1px solid color-mix(in srgb,var(--ink) 8%,transparent);
  border-radius:var(--radius);padding:24px 22px;
  display:flex;align-items:flex-start;gap:16px;
  max-width:480px;margin:0 auto;text-align:left;
  box-shadow:var(--shadow);
}
.info-ic{font-size:1.3rem;color:var(--accent);margin-top:2px;flex-shrink:0;}

/* ── Banner Reservado ───────────────────────────────────────── */
.reserved-banner{padding:32px 22px;}
.rsv-card{
  display:inline-flex;flex-direction:column;align-items:center;
  max-width:340px;width:100%;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,transparent),color-mix(in srgb,var(--accent2) 8%,transparent));
  border:1.5px dashed color-mix(in srgb,var(--accent) 50%,transparent);
  border-radius:24px;padding:28px 24px;position:relative;
  box-shadow:var(--shadow);
}
.rsv-badge{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  background:var(--accent);color:#fff;
  font:700 .62rem/1 var(--ft-body);letter-spacing:.24em;text-transform:uppercase;
  padding:6px 14px;border-radius:99px;white-space:nowrap;
}
.rsv-hola{margin:8px 0 10px;font:400 .95rem/1.4 var(--ft-body);color:var(--ink2);}
.rsv-hola strong{color:var(--ink);font-weight:700;}
.rsv-label{margin:0;font:500 1rem/1 var(--ft-body);color:var(--ink2);}
.rsv-num{font-family:var(--ft-display);font-size:3.2rem;font-weight:700;color:var(--accent);line-height:1;margin:6px 0;}
.rsv-word{margin:0;font:500 .92rem/1.4 var(--ft-body);color:var(--ink2);}

/* ── Cuenta regresiva — estilo máquina de escribir ──────────── */
.cd-sub{
  font:500 .82rem/1.4 var(--ft-body);
  letter-spacing:.26em;text-indent:.26em;text-transform:uppercase;
  color:var(--ink2);margin:0 0 18px;
}
.cd-wrap{max-width:520px;margin:0 auto;}
.cd-grid{display:flex;align-items:flex-start;justify-content:center;gap:clamp(6px,2.4vw,16px);}
.cd-cell{flex:0 1 auto;min-width:0;}
.cd-num{
  font-family:'Courier New',Courier,monospace;
  font-size:clamp(1.7rem,7.4vw,2.6rem);
  font-weight:700;color:var(--ink);
  line-height:1;display:block;letter-spacing:.04em;
}
.cd-lbl{font:600 .58rem/1 var(--ft-body);text-transform:uppercase;letter-spacing:.16em;color:var(--ink2);margin-top:8px;}
.cd-sep{
  font-family:'Courier New',Courier,monospace;
  font-size:clamp(1.7rem,7.4vw,2.6rem);font-weight:700;
  color:var(--ink);opacity:.65;line-height:1;
}

/* ── Ubicación — card centrada estilo papelería ─────────────── */
.loc-card{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  max-width:420px;margin:0 auto;text-align:center;
}
.loc-nombre{
  font:500 1.05rem/1.4 var(--ft-body);
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);margin:0;
}
.loc-dir{font:400 .92rem/1.6 var(--ft-body);color:var(--ink2);margin:0 0 14px;}

/* Segundo evento: nombre con tipografía display, distinta del label
   tracked de arriba (sec-h) — ver docs/57 */
.evento2-nombre{
  font-family:var(--ft-display);
  font-size:clamp(1.4rem,4vw,2rem);
  font-weight:500;font-style:italic;
  text-transform:none;letter-spacing:0;
  color:var(--ink);margin:0 0 10px;
  line-height:1.25;
}

/* ── Vestimenta / Detalles ──────────────────────────────────── */
.vest-lbl{
  font:600 .72rem/1 var(--ft-body);
  letter-spacing:.28em;text-indent:.28em;text-transform:uppercase;
  color:var(--ink);margin:6px 0 6px;
}
.vest-val{
  font:400 1.02rem/1.5 var(--ft-body);
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink2);margin:0 0 10px;
}
.vest-hint{font:400 .85rem/1.55 var(--ft-body);color:var(--ink2);margin:8px 0 0;opacity:.85;}

/* ── RSVP ───────────────────────────────────────────────────── */
.sec-rsvp{}
.rsvp-msg-p{font-size:1.02rem;line-height:1.65;color:var(--ink2);margin:0 0 20px;}
.rsvp-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:8px;}
.btn-rsvp{
  padding:14px 28px;border-radius:99px;border:1px solid transparent;
  font:500 .78rem/1 var(--ft-body);cursor:pointer;
  letter-spacing:.18em;text-indent:.09em;text-transform:uppercase;
  min-width:152px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  transition:opacity .2s,transform .15s;
}
.btn-rsvp:hover:not(:disabled){opacity:.85;transform:translateY(-1px);}
.btn-rsvp:disabled{opacity:.45;cursor:not-allowed;}
.btn-rsvp--si{background:var(--ink);color:var(--bg2);box-shadow:0 6px 20px -8px color-mix(in srgb,var(--ink) 45%,transparent);}
.btn-rsvp--no{background:transparent;color:var(--ink);border-color:color-mix(in srgb,var(--ink) 40%,transparent);}
.rsvp-ok{
  margin-top:18px;padding:14px 22px;border-radius:16px;
  background:color-mix(in srgb,var(--accent) 10%,transparent);
  color:var(--accent);font-weight:600;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.rsvp-done{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 22px;border-radius:16px;font-weight:600;
}
.rsvp-done--si{background:#E7F8EE;color:#1A7A3D;}
.rsvp-done--no{background:#FEF0F0;color:#C02020;}
.rsvp-info{
  background:color-mix(in srgb,var(--accent) 8%,transparent);
  border-radius:16px;padding:20px 18px;
  display:flex;align-items:flex-start;gap:14px;text-align:left;max-width:420px;margin:0 auto;
}
.rsvp-info-ic{color:var(--accent);font-size:1.1rem;margin-top:2px;flex-shrink:0;}
.rsvp-info p{margin:0;font-size:.95rem;line-height:1.55;color:var(--ink2);}

/* ── Libro de visitas ───────────────────────────────────────── */
.libro-intro{margin:0 0 18px;font-size:.98rem;color:var(--ink2);}
.sec-libro .libro-form{max-width:480px;margin:0 auto 20px;display:flex;flex-direction:column;gap:10px;}
.sec-libro .libro-form input,.sec-libro .libro-form textarea{
  width:100%;padding:13px 16px;
  border-radius:14px;border:1.5px solid color-mix(in srgb,var(--ink) 12%,transparent);
  font:15px var(--ft-body);background:var(--bg2);color:var(--ink);
  transition:border-color .2s;
}
.sec-libro .libro-form input:focus,.sec-libro .libro-form textarea:focus{
  outline:none;border-color:var(--accent);
}
.sec-libro .libro-form textarea{resize:vertical;min-height:80px;}
.sec-libro .libro-form .btn-pill{align-self:center;}
.libro-ok{background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent);padding:13px 18px;border-radius:14px;text-align:center;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;}
.libro-list{display:grid;gap:12px;margin-top:22px;}
.libro-card{background:var(--bg2);border:1px solid color-mix(in srgb,var(--ink) 8%,transparent);border-radius:16px;padding:16px 18px;text-align:left;box-shadow:var(--shadow);}
.lc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.lc-name{color:var(--accent);font-weight:700;font-size:.95rem;}
.lc-time{color:var(--ink2);font-size:.75rem;opacity:.55;}
.libro-card p{margin:0;color:var(--ink);font-size:.95rem;line-height:1.55;}

/* ── Mesa de regalos ────────────────────────────────────────── */
.regalo-card{
  max-width:420px;margin:0 auto;
  background:var(--bg2);border-radius:var(--radius);
  border:1px solid color-mix(in srgb,var(--ink) 8%,transparent);
  overflow:hidden;box-shadow:var(--shadow);
  text-align:left;
}
.regalo-header{
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 14%,var(--bg)),color-mix(in srgb,var(--accent2) 8%,var(--bg)));
  padding:18px 22px;display:flex;align-items:center;gap:12px;
  font:700 .95rem/1 var(--ft-display);color:var(--ink);font-size:1.05rem;
  border-bottom:1px solid color-mix(in srgb,var(--ink) 8%,transparent);
}
.regalo-header i{color:var(--accent);font-size:1.15rem;}
/* En cards de tono acento la cabecera hereda el vidrio translúcido */
.sec-tone-accent .regalo-card{border-color:rgba(255,255,255,.22);}
.sec-tone-accent .regalo-header{
  background:rgba(255,255,255,.12);
  color:var(--ink);
  border-bottom-color:rgba(255,255,255,.18);
}
.sec-tone-accent .rc-codigo{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:var(--ink);}
.regalo-body{padding:20px 22px;display:flex;flex-direction:column;gap:14px;}
.regalo-body p{margin:0;font-size:.97rem;line-height:1.6;color:var(--ink2);}
.rc-row{display:flex;flex-direction:column;gap:4px;}
.rc-lbl{font:600 .72rem/1 var(--ft-body);text-transform:uppercase;letter-spacing:.15em;color:var(--ink2);opacity:.65;}
.rc-val{font:500 .98rem/1.4 var(--ft-body);color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.rc-mono{font-family:'Courier New',monospace;font-size:.92rem;letter-spacing:.05em;word-break:break-all;}
.rc-tienda{font:700 1.25rem/1 var(--ft-display);color:var(--ink);margin:0;}
.rc-codigo-wrap{display:flex;flex-direction:column;gap:6px;}
.rc-codigo{
  font:700 1.4rem/1 'Courier New',monospace;
  color:var(--accent);letter-spacing:.08em;
  background:color-mix(in srgb,var(--accent) 8%,transparent);
  padding:12px 16px;border-radius:12px;
  display:flex;align-items:center;justify-content:space-between;
  border:1.5px dashed color-mix(in srgb,var(--accent) 35%,transparent);
}
.copy-btn{
  background:transparent;border:0;cursor:pointer;
  color:var(--ink2);padding:4px 6px;border-radius:8px;
  transition:color .2s,background .2s;flex-shrink:0;
}
.copy-btn:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);}
.copy-btn.copied{color:var(--accent);}

/* Álbum */
.album-cta{display:flex;flex-direction:column;align-items:center;gap:14px;}
.album-ic{font-size:2.2rem;color:var(--accent);opacity:.6;}
.album-ok{background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent);padding:13px 18px;border-radius:14px;text-align:center;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;}
.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:22px;}
.album-ph{aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:var(--bg2);box-shadow:var(--shadow);}
.album-ph img{width:100%;height:100%;object-fit:cover;display:block;}

/* FAQ */
.faq-list{display:grid;gap:10px;text-align:left;max-width:480px;margin:0 auto;}
.faq-item{display:flex;align-items:flex-start;gap:12px;background:var(--bg2);border-radius:14px;padding:14px 16px;border:1px solid color-mix(in srgb,var(--ink) 7%,transparent);}
.faq-ic{color:var(--accent);font-size:1rem;flex-shrink:0;margin-top:2px;}
.faq-item p{margin:0;font-size:.95rem;line-height:1.55;color:var(--ink2);}

/* Itinerario — timeline horizontal (≤5 hitos) */
.tl-h{
  display:flex;justify-content:center;align-items:flex-start;
  gap:clamp(4px,1.6vw,10px);
  position:relative;margin-top:20px;
}
.tl-h::before{
  content:'';position:absolute;top:57px;left:4%;right:4%;height:1px;
  background:color-mix(in srgb,var(--ink) 55%,transparent);
}
.tl-h-item{
  flex:1 1 0;max-width:130px;min-width:0;
  display:flex;flex-direction:column;align-items:center;
  position:relative;
}
.tl-h-ic{
  height:38px;display:flex;align-items:flex-end;justify-content:center;
  color:var(--ink);font-size:1.35rem;opacity:.85;
}
.tl-h-stem{
  display:block;width:1px;height:14px;margin-top:2px;
  background-image:linear-gradient(to bottom,color-mix(in srgb,var(--ink) 55%,transparent) 55%,transparent 55%);
  background-size:1px 4px;
}
.tl-h-dot{
  display:block;width:7px;height:7px;border-radius:50%;
  background:var(--ink);margin-top:-1px;position:relative;z-index:1;
}
.tl-h-hora{
  font:700 .78rem/1.2 var(--ft-body);
  color:var(--ink);margin-top:10px;letter-spacing:.04em;
}
.tl-h-tit{
  font:400 .74rem/1.35 var(--ft-body);
  color:var(--ink2);margin-top:3px;
  overflow-wrap:break-word;max-width:100%;
}
.tl-h-desc{
  font:400 .64rem/1.35 var(--ft-body);
  color:var(--ink2);opacity:.75;margin-top:2px;
  overflow-wrap:break-word;max-width:100%;
}

/* Regalos — intro y cierre */
.reg-intro{
  font:400 .92rem/1.7 var(--ft-body);
  letter-spacing:.06em;text-transform:uppercase;font-size:.78rem;
  color:var(--ink2);max-width:340px;margin:0 auto 18px;
}
.reg-gracias{
  font:500 .8rem/1.4 var(--ft-body);
  letter-spacing:.22em;text-indent:.22em;text-transform:uppercase;
  color:var(--ink);margin:18px 0 0;
}

/* Itinerario — timeline */
.timeline{list-style:none;padding:0;margin:20px auto 0;display:flex;flex-direction:column;gap:0;max-width:420px;text-align:left;}
.tl-item{display:flex;align-items:flex-start;gap:16px;padding-bottom:0;position:relative;margin-bottom:8px;}
.tl-item:not(:last-child){padding-bottom:0;}
.tl-item:not(:last-child)::before{
  content:'';position:absolute;left:19px;top:40px;bottom:-8px;width:2px;
  background:linear-gradient(to bottom,color-mix(in srgb,var(--accent) 35%,transparent),color-mix(in srgb,var(--accent) 10%,transparent));
}
.tl-dot{
  flex-shrink:0;width:40px;height:40px;border-radius:50%;margin-top:4px;
  background:color-mix(in srgb,var(--accent) 10%,transparent);
  border:2px solid color-mix(in srgb,var(--accent) 28%,transparent);
  display:grid;place-items:center;color:var(--accent);font-size:.88rem;
  box-shadow:0 4px 14px -6px color-mix(in srgb,var(--accent) 30%,transparent);
}
.tl-body{flex:1;min-width:0;background:transparent;border-radius:14px;padding:8px 4px 12px;border:none;box-shadow:none;margin-bottom:8px;border-bottom:1px solid color-mix(in srgb,var(--accent) 18%,transparent);}
.tl-hora{display:block;font:700 .7rem/1 var(--ft-body);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);opacity:.85;margin-bottom:4px;}
.tl-titulo{display:block;font:600 1.02rem/1.3 var(--ft-body);color:var(--ink);}
.tl-desc{font:400 .9rem/1.55 var(--ft-body);color:var(--ink2);margin:5px 0 0;opacity:.82;}

/* ── Galería ─────────────────────────────────────────────────── */
.sec-gal{max-width:1080px;padding-left:16px;padding-right:16px;}
.sec-gal .sec-h{margin-bottom:8px;}
.gal{display:grid;gap:8px;margin-top:20px;}
.gal img{width:100%;height:100%;object-fit:cover;display:block;border-radius:10px;transition:opacity .3s;}
.galp{display:block;aspect-ratio:1/1;overflow:hidden;border-radius:10px;background:var(--bg2);}
.gal-mosaico{grid-template-columns:repeat(3,1fr);}
.gal-duo    {grid-template-columns:repeat(2,1fr);}
.gal-tira   {grid-template-columns:repeat(5,1fr);} .gal-tira .galp{aspect-ratio:3/4;}
.gal-collage{grid-template-columns:repeat(4,1fr);} .gal-collage .galp:nth-child(3n){grid-column:span 2;grid-row:span 2;aspect-ratio:1;}
.gal-carrusel{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:8px;} .gal-carrusel .galp{flex:0 0 75%;scroll-snap-align:center;aspect-ratio:4/3;}
.gal-revista{grid-template-columns:repeat(6,1fr);} .gal-revista .galp:first-child{grid-column:span 4;grid-row:span 2;aspect-ratio:4/3;}
.gal-destacada{grid-template-columns:1fr;} .gal-destacada .galp{aspect-ratio:16/10;}
.gal-polaroid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));} .gal-polaroid .galp{background:#fff;padding:8px 8px 22px;box-shadow:0 6px 22px -10px rgba(0,0,0,.2);transform:rotate(-1.5deg);}
.gal-circular .galp{border-radius:50%;aspect-ratio:1;}
.gal-historia{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));} .gal-historia .galp{aspect-ratio:9/16;border-radius:18px;}
.gal-rejilla{grid-template-columns:repeat(4,1fr);}
@media(max-width:560px){
  .gal-mosaico,.gal-collage,.gal-revista,.gal-rejilla{grid-template-columns:repeat(2,1fr);}
  .gal-tira{grid-template-columns:repeat(3,1fr);}
  .gal-carrusel .galp{flex:0 0 85%;}
}

/* ── Imágenes sueltas ───────────────────────────────────────── */
.ph-img{margin:24px auto;display:block;}
.ph-img img{width:100%;height:auto;display:block;border-radius:16px;}
.sz-card  {max-width:min(86%,640px);}
.sz-wide  {max-width:96%;}
.sz-full  {max-width:100%;border-radius:0;} .sz-full img{border-radius:0;}
.sz-custom{max-width:var(--iw,70%);}
.al-left  {margin-left:18px;margin-right:auto;}
.al-right {margin-right:18px;margin-left:auto;}
.al-center{margin-left:auto;margin-right:auto;}

/* ── Botón flotante de música ───────────────────────────────── */
.mus-btn{
  position:fixed;right:16px;bottom:16px;z-index:70;
  width:52px;height:52px;border-radius:50%;
  background:var(--accent);color:#fff;border:0;
  display:grid;place-items:center;font-size:17px;
  box-shadow:0 10px 28px -8px color-mix(in srgb,var(--accent) 65%,transparent);
  cursor:pointer;transition:transform .2s;
}
.mus-btn:hover{transform:scale(1.08);}
.mus-btn.on{animation:musp 1.6s ease-out infinite;}
@keyframes musp{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 35%,transparent);}100%{box-shadow:0 0 0 18px transparent;}}

/* ── Efectos de scroll ──────────────────────────────────────── */
[data-el]{transition:opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1), filter .9s ease;}
.sfx-fade:not(.rev)  {opacity:0;}
.sfx-fade.rev        {opacity:1;}
.sfx-up:not(.rev)    {opacity:0; transform:translateY(44px);}  .sfx-up.rev    {opacity:1; transform:none;}
.sfx-down:not(.rev)  {opacity:0; transform:translateY(-44px);} .sfx-down.rev  {opacity:1; transform:none;}
.sfx-left:not(.rev)  {opacity:0; transform:translateX(-54px);} .sfx-left.rev  {opacity:1; transform:none;}
.sfx-right:not(.rev) {opacity:0; transform:translateX(54px);}  .sfx-right.rev {opacity:1; transform:none;}
.sfx-zoomin:not(.rev){opacity:0; transform:scale(.9);}  .sfx-zoomin.rev  {opacity:1; transform:none;}
.sfx-zoomout:not(.rev){opacity:0; transform:scale(1.1);} .sfx-zoomout.rev {opacity:1; transform:none;}
.sfx-flip:not(.rev)  {opacity:0; transform:rotateY(45deg);} .sfx-flip.rev   {opacity:1; transform:none;}
.sfx-blur:not(.rev)  {opacity:0; filter:blur(10px);}  .sfx-blur.rev   {opacity:1; filter:none;}
.sfx-curtain:not(.rev){opacity:0; clip-path:inset(50% 0 50% 0);} .sfx-curtain.rev{opacity:1;clip-path:inset(0 0 0 0);}
.sfx-reveal:not(.rev){opacity:0; transform:translateY(22px); filter:blur(5px);} .sfx-reveal.rev{opacity:1;transform:none;filter:none;}
.sfx-rotate:not(.rev){opacity:0; transform:rotate(-6deg) scale(.95);} .sfx-rotate.rev{opacity:1;transform:none;}
.sfx-skew:not(.rev)  {opacity:0; transform:skewY(-4deg) translateY(22px);} .sfx-skew.rev{opacity:1;transform:none;}
.sfx-bounce:not(.rev){opacity:0; transform:translateY(40px);} .sfx-bounce.rev{opacity:1;transform:none;transition:transform 1s cubic-bezier(.34,1.56,.64,1), opacity .9s ease;}
.sfx-parallax{transform:translateY(calc(var(--prog,0) * -30px));}
.sfx-flotar{will-change:transform;}
.sfx-none{opacity:1!important;transform:none!important;filter:none!important;}

/* ── Image-sequence scrubbing — pantalla completa + crossfade ── */
.scrub-track{position:relative;height:240vh;}
.scrub-pin{position:sticky;top:0;height:100svh;overflow:hidden;background:#000;}
.scrub-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;
  will-change:opacity,transform;
}

/* ── Footer ─────────────────────────────────────────────────── */
.inv-foot{
  padding:48px 22px 72px;
  text-align:center;
  color:var(--ink2);font:500 .8rem/1.5 var(--ft-body);
  opacity:.6;
  background:linear-gradient(0deg,var(--bg),transparent);
}
.inv-foot a{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--ink) 18%,transparent);}

/* ── Efectos visuales por sección ──────────────────────────── */
.sec-ef-glass{
  background:color-mix(in srgb,var(--bg2) 70%,transparent) !important;
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border:1px solid color-mix(in srgb,var(--accent) 14%,transparent);
  border-radius:28px;
  box-shadow:0 8px 40px -12px color-mix(in srgb,var(--accent) 18%,transparent);
  margin:0 auto 4px;
  max-width:680px;
}
.sec-ef-bevel{
  background:var(--bg2);
  border-radius:22px;
  box-shadow:inset 0 2px 4px color-mix(in srgb,#fff 60%,transparent),
             inset 0 -2px 4px color-mix(in srgb,var(--accent) 12%,transparent),
             0 6px 28px -8px rgba(0,0,0,.10);
  border:1px solid color-mix(in srgb,var(--bg2) 80%,transparent);
  max-width:680px;margin:0 auto 4px;
}
.sec-ef-raised{
  background:var(--bg2);
  border-radius:24px;
  box-shadow:0 20px 60px -20px color-mix(in srgb,var(--accent) 22%,transparent),
             0 4px 16px -6px rgba(0,0,0,.08);
  border:1px solid color-mix(in srgb,var(--accent) 8%,transparent);
  transform:translateY(0);
  transition:transform .35s ease,box-shadow .35s ease;
  max-width:680px;margin:0 auto 4px;
}
.sec-ef-raised:hover{
  transform:translateY(-4px);
  box-shadow:0 28px 70px -24px color-mix(in srgb,var(--accent) 30%,transparent),0 6px 22px -8px rgba(0,0,0,.10);
}
.sec-ef-glow{
  position:relative;overflow:hidden;
  border-radius:24px;max-width:680px;margin:0 auto 4px;
}
.sec-ef-glow::before{
  content:'';position:absolute;inset:-2px;border-radius:26px;
  background:radial-gradient(ellipse 80% 50% at 50% 0%,color-mix(in srgb,var(--accent) 40%,transparent),transparent 70%);
  pointer-events:none;z-index:0;
}
.sec-ef-glow>*{position:relative;z-index:1;}
.sec-ef-gradient{
  border-radius:22px;
  border:2px solid transparent;
  background:linear-gradient(var(--bg2),var(--bg2)) padding-box,
             linear-gradient(135deg,var(--accent),var(--accent2)) border-box;
  max-width:680px;margin:0 auto 4px;
}
.sec-ef-frosted{
  background:color-mix(in srgb,var(--bg2) 55%,transparent) !important;
  backdrop-filter:blur(24px) saturate(1.6) brightness(1.08);
  -webkit-backdrop-filter:blur(24px) saturate(1.6) brightness(1.08);
  border:1px solid color-mix(in srgb,#fff 30%,transparent);
  border-radius:28px;
  box-shadow:0 2px 24px -6px rgba(0,0,0,.08),inset 0 1px 0 color-mix(in srgb,#fff 50%,transparent);
  max-width:680px;margin:0 auto 4px;
}
.sec-ef-outline{
  border-radius:20px;
  border:2px solid color-mix(in srgb,var(--accent) 40%,transparent);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 6%,transparent);
  max-width:680px;margin:0 auto 4px;
}

/* ════════════ Módulo Sobre — apertura real v4.0 ════════════ */
.sobre-overlay{
  position:fixed;inset:0;z-index:9999;
  cursor:pointer;overflow:hidden;
  background:var(--sb-interior,#8C8877);
  transition:opacity .7s ease,transform .7s ease;
}
.sobre-overlay.sobre-st4{opacity:0;transform:scale(1.035);pointer-events:none;}
.sobre-overlay.sobre-rm{opacity:0;pointer-events:none;transition:opacity .5s ease;}
.sobre-scene{position:relative;width:100%;height:100%;perspective:1300px;}

/* Capas del sobre (vista trasera: solapa, laterales y fondo se unen al centro) */
.sobre-base,.sobre-carta,.sobre-lado,.sobre-fondo-flap,.sobre-flap{position:absolute;}
.sobre-base::after,.sobre-lado::after,.sobre-fondo-flap::after,.sobre-flap::after{
  content:'';position:absolute;inset:0;
  background-image:var(--sb-tex);background-size:260px 260px;
  opacity:.3;mix-blend-mode:overlay;pointer-events:none;
}
.sobre-base{
  inset:0;z-index:0;background:var(--sb-interior);
}
.sobre-base::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(120% 90% at 50% 32%,transparent 35%,rgba(0,0,0,.3) 100%);
}
/* Carta interior — asoma cuando se abre la solapa y sube en la etapa 3 */
.sobre-carta{
  left:7%;right:7%;top:11%;bottom:33%;z-index:1;
  background:#FDFBF5;
  border-radius:14px 14px 10px 10px;
  box-shadow:0 -8px 34px -14px rgba(0,0,0,.4);
  transform:translateY(36%);
  transition:transform .95s cubic-bezier(.23,1,.32,1);
}
.sobre-carta::before{
  content:'';position:absolute;left:14%;right:14%;top:12%;height:1px;
  background:rgba(0,0,0,.07);
  box-shadow:0 14px 0 rgba(0,0,0,.06),0 28px 0 rgba(0,0,0,.05),0 42px 0 rgba(0,0,0,.04);
}
.sobre-st3 .sobre-carta{transform:translateY(-16%);}
.sobre-lado{
  inset:0;z-index:2;background:var(--sb-lado,var(--sb-bg));
  filter:drop-shadow(0 0 8px rgba(0,0,0,.10));
}
.sobre-lado-i{clip-path:polygon(0 0,50% 50%,0 100%);}
.sobre-lado-d{clip-path:polygon(100% 0,50% 50%,100% 100%);}
.sobre-fondo-flap{
  inset:0;z-index:3;background:var(--sb-fondo,var(--sb-bg));
  clip-path:polygon(0 100%,50% 50%,100% 100%);
  filter:drop-shadow(0 -3px 10px rgba(0,0,0,.14));
}
/* Solapa superior — pivota sobre el borde superior de la pantalla */
.sobre-flap{
  inset:0;z-index:4;background:var(--sb-flap,var(--sb-bg));
  clip-path:polygon(0 0,100% 0,50% 50%);
  transform-origin:50% 0;
  transform:rotateX(0deg);
  transition:transform .85s cubic-bezier(.77,0,.175,1);
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.22));
  will-change:transform;
}
.sobre-st2 .sobre-flap{transform:rotateX(180deg);}
.sobre-decor{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;opacity:.5;
}

/* Monograma entrelazado sobre la solapa */
.sobre-mono{
  position:absolute;left:0;right:0;top:8%;
  display:flex;flex-direction:column;align-items:center;gap:14px;
  text-align:center;backface-visibility:hidden;
}
.sobre-ini{
  display:flex;align-items:flex-start;
  line-height:.95;font-weight:400;
  text-shadow:0 2px 12px rgba(0,0,0,.18);
  max-width:88%;
}
.sobre-ini b{font-weight:inherit;display:block;}
/* Monograma clásico: exactamente 2 letras entrelazadas (look tradicional) */
.sobre-ini.ini-classic{letter-spacing:0;}
.sobre-ini.ini-classic b:nth-child(even){margin-left:-.24em;transform:translateY(.16em);font-size:.92em;}
/* Fila espaciada: 1 letra o 3+ (texto libre, "D&G", nombres) — sin encimarse,
   se envuelve y encoge en pantallas angostas. */
.sobre-ini.ini-row{
  flex-wrap:wrap;justify-content:center;align-items:baseline;
  letter-spacing:.03em;row-gap:.08em;
}
.sobre-ini.ini-row b{display:inline-block;margin:0 .05em;}
@media(max-width:400px){.sobre-ini.ini-row{letter-spacing:.01em;}}
.sobre-ini-dots{display:flex;gap:10px;align-items:center;opacity:.8;}
.sobre-ini-dots i{width:3px;height:3px;border-radius:50%;background:currentColor;}
.sobre-ini-dots i:nth-child(3){width:6.5px;height:6.5px;}

/* Sello de cera — en la punta de la solapa (centro) */
.sobre-sello{
  position:absolute;left:50%;top:50%;z-index:6;
  transform:translate(-50%,-50%);
  will-change:transform,opacity;
}
.sobre-sello svg{
  display:block;
  width:clamp(92px,26vw,150px);height:auto;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.35));
}
.sobre-st1 .sobre-sello{animation:sello-break .42s cubic-bezier(.23,1,.32,1) forwards;}
@keyframes sello-break{
  0%  {transform:translate(-50%,-50%) scale(1) rotate(0deg);opacity:1;}
  32% {transform:translate(-50%,-50%) scale(1.12) rotate(-5deg);opacity:1;}
  100%{transform:translate(-50%,-52%) scale(1.4) rotate(7deg);opacity:0;}
}

/* Nombre del invitado bajo el sello */
.sobre-guest-name{
  position:absolute;left:24px;right:24px;top:63.5%;z-index:5;
  font:300 1.1rem/1.5 var(--ft-display,'Cormorant Garamond',serif);
  letter-spacing:.04em;text-align:center;
  transition:opacity .3s ease;
}
.sobre-st2 .sobre-guest-name{opacity:0;}
.sobre-para-txt{
  display:block;
  font:400 .72rem/1 Inter,sans-serif;
  letter-spacing:.2em;text-transform:uppercase;
  opacity:.65;margin-bottom:4px;
}

/* Hint de apertura */
.sobre-tap{
  position:absolute;bottom:max(26px,5vh);left:0;right:0;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  pointer-events:none;z-index:7;
  transition:opacity .3s ease;
}
.sobre-st1 .sobre-tap{opacity:0;}
.sobre-tap-icon{
  width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;
  animation:sobre-pulse 2.2s ease-in-out infinite;
}
.sobre-tap-txt{
  font:400 .88rem/1 Inter,system-ui,sans-serif;
  margin:0;letter-spacing:.04em;
}
@keyframes sobre-pulse{
  0%,100%{transform:scale(1);opacity:.65;}
  50%{transform:scale(1.14);opacity:1;}
}
/* ── Variantes de animación de apertura (sobre-anim-*) ─────── */
.sobre-lado,.sobre-fondo-flap{transition:transform .85s cubic-bezier(.77,0,.175,1);}

/* Cortinas: las cuatro solapas se abren hacia afuera */
.sobre-anim-cortinas.sobre-st2 .sobre-lado-i{transform:translateX(-104%);}
.sobre-anim-cortinas.sobre-st2 .sobre-lado-d{transform:translateX(104%);}
.sobre-anim-cortinas.sobre-st2 .sobre-fondo-flap{transform:translateY(104%);}

/* Deslizante: el sobre baja completo revelando la invitación */
.sobre-anim-deslizante{transition:opacity .55s ease,transform 1.05s cubic-bezier(.7,0,.3,1);}
.sobre-anim-deslizante.sobre-st2 .sobre-flap{transform:none;}
.sobre-anim-deslizante.sobre-st3{transform:translateY(103%);}
.sobre-anim-deslizante.sobre-st3 .sobre-carta{transform:translateY(36%);}
.sobre-anim-deslizante.sobre-st4{transform:translateY(103%);opacity:0;}

/* Giro 3D: el sobre gira sobre su eje y se desvanece */
.sobre-anim-giro{transition:opacity .7s ease .25s,transform 1.05s cubic-bezier(.77,0,.175,1);}
.sobre-anim-giro.sobre-st2 .sobre-flap{transform:none;}
.sobre-anim-giro.sobre-st3{transform:perspective(1400px) rotateY(102deg) scale(.92);opacity:0;}
.sobre-anim-giro.sobre-st3 .sobre-carta{transform:translateY(36%);}
.sobre-anim-giro.sobre-st4{transform:perspective(1400px) rotateY(102deg) scale(.92);opacity:0;}

/* Zoom: la cámara entra al sobre */
.sobre-anim-zoom{transition:opacity .65s ease .4s,transform 1.15s cubic-bezier(.7,0,.3,1);}
.sobre-anim-zoom.sobre-st2 .sobre-flap{transform:none;}
.sobre-anim-zoom.sobre-st3{transform:scale(2.7);opacity:0;}
.sobre-anim-zoom.sobre-st3 .sobre-carta{transform:translateY(36%);}
.sobre-anim-zoom.sobre-st4{transform:scale(2.7);opacity:0;}

/* Desvanecer: fundido suave sin movimiento */
.sobre-anim-desvanecer{transition:opacity 1.05s ease;}
.sobre-anim-desvanecer.sobre-st2 .sobre-flap{transform:none;}
.sobre-anim-desvanecer.sobre-st3{opacity:0;}
.sobre-anim-desvanecer.sobre-st3 .sobre-carta{transform:translateY(36%);}
.sobre-anim-desvanecer.sobre-st4{opacity:0;transform:none;}

/* Carta afuera: la carta se extrae hacia arriba y el sobre se retira */
.sobre-anim-carta .sobre-carta{transition:transform 1.15s cubic-bezier(.23,1,.32,1);}
.sobre-anim-carta.sobre-st3 .sobre-carta{transform:translateY(-85%);}
.sobre-anim-carta.sobre-st4 .sobre-carta{transform:translateY(-165%);}

/* Caída: el sobre se suelta con la solapa abierta y cae girando levemente */
.sobre-anim-caida{transition:opacity .55s ease .35s,transform 1.05s cubic-bezier(.45,0,.8,.4);}
.sobre-anim-caida.sobre-st3{transform:translateY(114%) rotate(7deg);}
.sobre-anim-caida.sobre-st3 .sobre-carta{transform:translateY(36%);}
.sobre-anim-caida.sobre-st4{transform:translateY(114%) rotate(7deg);opacity:0;}

/* Volteo: gira de cara (rotateY) y se desliza hacia abajo */
.sobre-anim-volteo{transition:opacity .5s ease,transform .85s cubic-bezier(.77,0,.175,1);}
.sobre-anim-volteo.sobre-st2 .sobre-flap{transform:none;}
.sobre-anim-volteo.sobre-st2{transform:perspective(1400px) rotateY(180deg);}
.sobre-anim-volteo.sobre-st3{transform:perspective(1400px) rotateY(180deg) translateY(103%);}
.sobre-anim-volteo.sobre-st3 .sobre-carta{transform:translateY(36%);}
.sobre-anim-volteo.sobre-st4{transform:perspective(1400px) rotateY(180deg) translateY(103%);opacity:0;}

@media (prefers-reduced-motion: reduce){
  .sobre-flap,.sobre-carta,.sobre-overlay,.sobre-lado,.sobre-fondo-flap{transition-duration:.01s;}
  .sobre-st1 .sobre-sello{animation-duration:.01s;}
  .sobre-tap-icon{animation:none;}
}

/* ── Responsivo móvil ───────────────────────────────────────── */
@media(max-width:480px){
  .sec{padding:48px 20px;}
  .sec-deco{padding:44px 22px 40px;}
  .sec-shape-arch{padding-top:64px;}
  .sec-shape-dome{padding-top:56px;}
  .cover{padding:54px 20px 70px;}
  .cover-h{font-size:clamp(2.4rem,9.5vw,3.6rem);}
  .rsvp-row{flex-direction:column;align-items:center;}
  .btn-rsvp{width:100%;max-width:280px;}
  .regalo-card{border-radius:16px;}
  .rc-codigo{font-size:1.1rem;}
  .tl-h-ic{font-size:1.1rem;}
}

/* ── Confirmación abierta (docs/55) ── */
.orsvp{display:flex;flex-direction:column;gap:10px;max-width:380px;margin:0 auto;text-align:left;}
.orsvp input{padding:13px 16px;border:1px solid color-mix(in srgb,var(--ink) 18%,transparent);border-radius:12px;background:color-mix(in srgb,var(--bg2) 70%,transparent);color:var(--ink);font:500 15px/1 var(--ft-body);outline:0;}
.orsvp input:focus{border-color:var(--accent);}
.orsvp-l{font:600 .78rem/1 var(--ft-body);color:var(--ink2);margin-top:2px;}
/* Selector de acompañantes: stepper +/- (en vez de una fila de botones que
   se veía tosca y no escalaba bien con máximos grandes). */
.orsvp-stepper{display:inline-flex;align-items:center;gap:18px;align-self:center;margin:2px 0 4px;padding:6px;border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);border-radius:99px;}
.orsvp-st-btn{width:38px;height:38px;border-radius:50%;border:none;background:var(--accent);color:#fff;font-size:.85rem;display:grid;place-items:center;cursor:pointer;transition:opacity .15s,transform .15s;}
.orsvp-st-btn:hover:not(:disabled){transform:scale(1.06);}
.orsvp-st-btn:disabled{opacity:.32;cursor:not-allowed;}
.orsvp-st-val{min-width:2ch;text-align:center;font:700 1.3rem/1 var(--ft-display);color:var(--ink);}
.orsvp .btn-rsvp{justify-content:center;}

/* ── Animaciones de la cuenta regresiva (docs/55 P4) ── */
.cd-num{display:inline-block;}
.cd-anim-flip .cd-num.cdt{animation:cdFlip .5s cubic-bezier(.22,.61,.36,1);}
.cd-anim-fade .cd-num.cdt{animation:cdFade .45s ease;}
.cd-anim-slide .cd-num.cdt{animation:cdSlide .45s cubic-bezier(.22,.61,.36,1);}
@keyframes cdFlip{0%{transform:rotateX(90deg);opacity:0;}100%{transform:rotateX(0);opacity:1;}}
@keyframes cdFade{0%{opacity:0;}100%{opacity:1;}}
@keyframes cdSlide{0%{transform:translateY(-60%);opacity:0;}100%{transform:none;opacity:1;}}
@media (prefers-reduced-motion: reduce){.cd-num.cdt{animation:none!important;}}