/* =============================================
BODA OLGA & VICTOR — style.css
Paleta: marfil / salvia / oro suave / arena
Fuentes: Cormorant Garamond (display) + Jost (body)
============================================= */

:root {
--ivory: hsl(51, 23%, 96%);
--cream: hsl(51, 18%, 92%);
--cream-deep: hsl(40, 10%, 86%);
--sage: hsl(213, 18%, 58%);
--sage-dark: hsl(218, 12%, 38%);
--sage-light: hsl(210, 18%, 78%);
--gold: hsl(33, 22%, 48%);
--gold-soft: hsl(40, 14%, 68%);
--sand: hsl(36, 20%, 88%);
--text-main: hsl(218, 10%, 28%);
--text-muted: hsl(33, 8%, 46%);
--text-faint: hsl(33, 6%, 68%);
--border: hsl(40, 12%, 80%);
--gradient-pearl: linear-gradient(135deg, hsl(51,23%,97%) 0%, hsl(51,14%,91%) 35%, hsl(213,18%,84%) 65%, hsl(51,23%,96%) 100%);
--gradient-pearl-soft: linear-gradient(160deg, hsl(51 28% 97% / .97) 0%, hsl(36 25% 91% / .85) 50%, hsl(40 18% 95% / .97) 100%);
--gradient-sage: linear-gradient(135deg, hsl(213,18%,55%), hsl(218,10%,42%));
--shadow-soft: 0 1px 3px hsl(33 8% 40% / .06), 0 10px 30px -16px hsl(218 8% 35% / .14);
--shadow-elegant: 0 2px 6px hsl(33 8% 40% / .07), 0 24px 60px -28px hsl(218 8% 35% / .20);
--shadow-emboss: inset 1px 1px 2px hsl(51 30% 99% / .90), inset -1px -1px 2px hsl(33 8% 55% / .22), 0 1px 2px hsl(218 8% 35% / .07), 0 12px 28px -16px hsl(218 8% 35% / .16);
--font-display: 'Cormorant Garamond', Georgia, serif;
--font-body: 'Jost', 'Helvetica Neue', sans-serif;
--text-xs: clamp(0.75rem, 0.7rem + 0.2vw, 0.875rem);
--text-sm: clamp(0.875rem, 0.82rem + 0.22vw, 1rem);
--text-base: clamp(1rem, 0.94rem + 0.22vw, 1.125rem);
--text-lg: clamp(1.125rem, 1rem + 0.55vw, 1.5rem);
--text-xl: clamp(1.5rem, 1.2rem + 1vw, 2.25rem);
--text-2xl: clamp(2rem, 1.2rem + 2.2vw, 3.25rem);
--text-3xl: clamp(2.5rem, 1rem + 3.8vw, 4.5rem);
--text-hero: clamp(3.5rem, 1rem + 7vw, 7rem);
--sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem;
--sp-6: 1.5rem; --sp-8: 2rem; --sp-10: 2.5rem; --sp-12: 3rem;
--sp-16: 4rem; --sp-20: 5rem; --sp-24: 6rem;
--radius-sm: .375rem; --radius-md: .625rem; --radius-lg: 1rem;
--radius-xl: 1.5rem; --radius-full: 9999px;
--ease-smooth: all .65s cubic-bezier(.4,0,.2,1);
--ease-bounce: all .5s cubic-bezier(.68,-.55,.265,1.55);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; scroll-padding-top:5rem; overflow-x:hidden; }
body {
font-family: var(--font-body);
font-size: var(--text-base);
color: var(--text-main);
background-color: var(--ivory);
background-image:
  radial-gradient(ellipse at top left, hsl(210 35% 95% / .50), transparent 55%),
  radial-gradient(ellipse at bottom right, hsl(36 45% 96% / .55), transparent 60%),
  url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.28'/%3E%3C/svg%3E");
background-blend-mode: soft-light, soft-light, overlay;
background-size: auto, auto, 320px;
background-attachment: fixed;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
line-height: 1.7;
}
img,video,svg { display:block; max-width:100%; height:auto; }
ul,ol { list-style:none; }
input,button,textarea,select { font:inherit; color:inherit; }
h1,h2,h3,h4,h5,h6 { font-family:var(--font-display); font-weight:300; line-height:1.2; letter-spacing:.01em; }
p { text-wrap:pretty; max-width:68ch; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; background:none; border:none; }
::selection { background:hsl(213 18% 58% / .25); color:var(--text-main); }
:focus-visible { outline:2px solid var(--sage); outline-offset:3px; border-radius:var(--radius-sm); }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* UTILIDADES */
.container { max-width:1100px; margin-inline:auto; padding-inline:var(--sp-6); }
.container--narrow { max-width:720px; margin-inline:auto; padding-inline:var(--sp-6); }
.section-pad { padding-block:clamp(var(--sp-12), 8vw, var(--sp-24)); }
.text-center { text-align:center; }
.text-center p { margin-inline:auto; }
.eyebrow { display:block; font-family:var(--font-body); font-size:var(--text-xs); font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--sage); margin-bottom:var(--sp-3); }
.section-title { font-size:var(--text-2xl); font-style:italic; color:var(--text-main); margin-bottom:var(--sp-6); }
.section-intro { font-size:var(--text-base); color:var(--text-muted); margin-bottom:var(--sp-10); }

.card-elegant {
border-radius:var(--radius-lg);
border:1px solid hsl(51 30% 99% / .60);
padding:clamp(var(--sp-6), 3vw, var(--sp-10));
background:var(--gradient-pearl-soft);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
box-shadow:var(--shadow-emboss);
transition:var(--ease-smooth);
}
.card-elegant:hover { box-shadow:var(--shadow-elegant),inset 1px 1px 2px hsl(51 30% 99% / .90); transform:translateY(-2px); border-color:hsl(51 30% 99% / .85); }

/* BOTONES */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2); padding:.75em 2em; border-radius:var(--radius-full); font-family:var(--font-body); font-size:var(--text-sm); font-weight:500; letter-spacing:.06em; cursor:pointer; transition:var(--ease-smooth); text-decoration:none; border:1px solid transparent; white-space:nowrap; }
.btn--primary { background:var(--gradient-sage); color:white; border-color:var(--sage-dark); box-shadow:0 2px 8px hsl(218 18% 35% / .20); }
.btn--primary:hover { background:linear-gradient(135deg,hsl(213,18%,48%),hsl(218,10%,34%)); box-shadow:0 4px 16px hsl(218 18% 35% / .28); transform:translateY(-1px); }
.btn--outline { background:transparent; color:white; border:1px solid rgba(255,255,255,.6); }
.btn--outline:hover { background:rgba(255,255,255,.12); border-color:white; }
.btn--ghost { background:transparent; color:var(--sage-dark); border:1px solid var(--border); }
.btn--ghost:hover { background:var(--cream); border-color:var(--sage-light); }
.btn--sm { padding:.5em 1.4em; font-size:var(--text-xs); }
.btn--full { width:100%; }

/* NAV */
.nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:var(--sp-4) var(--sp-6); transition:background .4s ease,box-shadow .4s ease; }
.nav.scrolled { background:hsl(51 23% 96% / .92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-shadow:0 1px 0 var(--border),var(--shadow-soft); }
.nav__inner { max-width:1100px; margin-inline:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-8); }
.nav__logo { font-family:var(--font-display); font-size:var(--text-lg); font-style:italic; font-weight:400; color:white; transition:color .3s; letter-spacing:.05em; flex-shrink:0; }
.nav.scrolled .nav__logo { color:var(--sage-dark); }
.nav__links { display:flex; align-items:center; gap:var(--sp-6); flex-wrap:wrap; }
.nav__links a { font-size:var(--text-sm); font-weight:400; letter-spacing:.04em; color:rgba(255,255,255,.85); transition:color .3s; padding:var(--sp-1) 0; border-bottom:1px solid transparent; }
.nav.scrolled .nav__links a { color:var(--text-muted); }
.nav__links a:hover { color:white; border-bottom-color:rgba(255,255,255,.5); }
.nav.scrolled .nav__links a:hover { color:var(--sage-dark); border-bottom-color:var(--sage); }
.nav__cta { padding:.45em 1.2em !important; border-radius:var(--radius-full) !important; border:1px solid rgba(255,255,255,.5) !important; color:white !important; }
.nav.scrolled .nav__cta { border-color:var(--sage) !important; color:var(--sage-dark) !important; }
.nav__cta:hover { background:rgba(255,255,255,.15) !important; }
.nav.scrolled .nav__cta:hover { background:var(--sand) !important; }
.nav__toggle { display:none; flex-direction:column; gap:5px; padding:var(--sp-2); z-index:1000; }
.nav__toggle span { display:block; width:24px; height:2px; background:white; border-radius:2px; transition:var(--ease-smooth); }
.nav.scrolled .nav__toggle span { background:var(--text-main); }
@media (max-width:768px) {
  .nav__toggle { display:flex; }
  .nav__links { position:fixed; top:0; left:0; width:100vw; height:100vh; height:100dvh; background:hsl(51 23% 96% / .98); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); flex-direction:column; justify-content:center; align-items:center; gap:var(--sp-6); transform:translateX(100%); transition:transform .4s cubic-bezier(.4,0,.2,1); z-index:999; overflow-y:auto; }
  .nav__links.open { transform:translateX(0); }
  .nav__links a { font-size:var(--text-lg); color:var(--text-main) !important; font-family:var(--font-display); font-style:italic; }
  .nav__cta { border-color:var(--sage) !important; color:var(--sage-dark) !important; }
}

/* HERO */
.hero { position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden;
background: linear-gradient(180deg,hsl(213 18% 28% / .55) 0%,hsl(218 10% 20% / .4) 60%,hsl(218 10% 15% / .6) 100%), url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=1800&q=80') center/cover no-repeat; }
.hero__video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero__overlay { position:absolute; inset:0; background:linear-gradient(to bottom,hsl(213 18% 22% / .15) 0%,hsl(213 18% 22% / .05) 40%,hsl(33 12% 10% / .40) 100%); }
.hero__content { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:var(--sp-4); padding:var(--sp-8); animation:fadeUp 1.2s cubic-bezier(.4,0,.2,1) both; }
.hero__eyebrow { font-family:var(--font-body); font-size:var(--text-sm); font-weight:400; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.75); margin:0; }
.hero__title { font-size:var(--text-hero); font-weight:300; font-style:italic; color:white; line-height:1; letter-spacing:-.01em; text-shadow:0 2px 24px hsl(0 0% 0% / .18); margin:0; }
.hero__amp { color:hsl(51 60% 90%); margin-inline:.12em; }
.hero__place { font-family:var(--font-body); font-size:var(--text-sm); letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.70); margin:0; }
.hero__scroll { position:absolute; bottom:var(--sp-8); left:50%; transform:translateX(-50%); z-index:1; }
.hero__scroll span { display:block; width:1px; height:48px; background:linear-gradient(to bottom,transparent,rgba(255,255,255,.6)); margin-inline:auto; animation:scrollLine 3s ease-in-out infinite; }
@keyframes scrollLine { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }

/* COUNTDOWN */
.countdown { background:linear-gradient(135deg,var(--cream) 0%,var(--sand) 100%); border-top:1px solid var(--border); border-bottom:1px solid var(--border); text-align:center; padding-block:clamp(var(--sp-10),6vw,var(--sp-16)); }
.countdown__grid { display:flex; align-items:center; justify-content:center; gap:clamp(var(--sp-4),4vw,var(--sp-10)); flex-wrap:wrap; margin-top:var(--sp-6); }
.countdown__item { display:flex; flex-direction:column; align-items:center; min-width:80px; }
.countdown__num { font-family:var(--font-display); font-size:var(--text-3xl); font-weight:300; color:var(--sage-dark); line-height:1; letter-spacing:-.02em; min-width:2ch; text-align:center; font-variant-numeric:tabular-nums; }
.countdown__label { font-size:var(--text-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin-top:var(--sp-2); }
.countdown__sep { font-family:var(--font-display); font-size:var(--text-2xl); color:var(--gold-soft); padding-bottom:.8em; font-weight:300; }
@media (max-width:480px) { .countdown__sep { display:none; } }

/* LETTER */
.letter { text-align:center; background:var(--ivory); }
.letter__heading { font-size:var(--text-xl); font-style:italic; color:var(--text-main); margin-bottom:var(--sp-6); }
.letter__body { font-size:var(--text-base); color:var(--text-muted); line-height:1.9; margin-bottom:var(--sp-4); margin-inline:auto; }
.letter__body--italic { font-family:var(--font-display); font-style:italic; font-size:var(--text-lg); color:var(--text-main); }
.letter__sig { font-family:var(--font-display); font-size:var(--text-xl); font-style:italic; color:var(--sage); margin-top:var(--sp-8); }

/* HISTORIA-CARTA */
.historia-texto { background:var(--ivory); }
.historia-carta { max-width:680px; margin-inline:auto; text-align:center; }
.historia-carta__body { font-size:var(--text-base); color:var(--text-muted); line-height:1.9; margin-bottom:var(--sp-4); margin-inline:auto; }
.historia-carta__sig { font-family:var(--font-display); font-size:var(--text-xl); font-style:italic; color:var(--sage); margin-top:var(--sp-6); }

/* TIMELINE */
.historia { background:var(--cream); }
.timeline { display:flex; flex-direction:column; gap:var(--sp-8); margin-top:var(--sp-10); position:relative; }
.timeline::before { content:''; position:absolute; left:50%; top:0; bottom:0; width:1px; background:linear-gradient(to bottom,transparent,var(--border) 10%,var(--border) 90%,transparent); transform:translateX(-50%); }
.timeline__item { display:grid; grid-template-columns:1fr auto 1fr; gap:var(--sp-6); align-items:start; }
.timeline__item--right { direction:rtl; }
.timeline__item--right>* { direction:ltr; }
.timeline__year { font-family:var(--font-display); font-size:var(--text-xl); font-style:italic; font-weight:300; color:var(--gold); text-align:right; padding-top:.5em; letter-spacing:.02em; }
.timeline__item--right .timeline__year { text-align:left; grid-column:3; }
.timeline__card { grid-column:1; }
.timeline__item--right .timeline__card { grid-column:1; }
.timeline__item::after { content:''; width:10px; height:10px; background:var(--sage); border-radius:50%; border:2px solid var(--cream); box-shadow:0 0 0 3px var(--sage-light); margin-top:1.6em; justify-self:center; }
.timeline__card h3 { font-size:var(--text-lg); font-style:italic; margin-bottom:var(--sp-3); color:var(--text-main); }
.timeline__card p { font-size:var(--text-sm); color:var(--text-muted); line-height:1.8; }
@media (max-width:640px) {
  .timeline::before { left:var(--sp-4); }
  .timeline__item,.timeline__item--right { grid-template-columns:auto 1fr; direction:ltr; gap:var(--sp-4); }
  .timeline__year { display:none; }
  .timeline__item::after { grid-column:1; grid-row:1; margin-top:1.4em; justify-self:start; }
  .timeline__card,.timeline__item--right .timeline__card { grid-column:2; }
}

/* GALLERY */
.gallery { position:relative; overflow:hidden; border-radius:var(--radius-md); margin-top:var(--sp-4); background:var(--cream-deep); aspect-ratio:4/3; touch-action:manipulation; }
.gallery__track { position:relative; width:100%; height:100%; }
.gallery__track img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:var(--radius-md); opacity:0; transition:opacity 0.6s ease; pointer-events:none; cursor:zoom-in; }
.gallery__track img.gallery__active { opacity:1; pointer-events:auto; cursor:zoom-in; }
.gallery__dots { position:absolute; bottom:var(--sp-3); left:50%; transform:translateX(-50%); display:flex; gap:var(--sp-2); z-index:2; }
.gallery__dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,0.5); cursor:pointer; transition:background 0.3s,transform 0.3s; border:none; padding:0; }
.gallery__dot.active { background:white; transform:scale(1.3); }

/* EVENTO — SCHEDULE */
.evento { background:var(--ivory); }
.schedule { display:flex; flex-direction:column; gap:0; max-width:560px; margin-inline:auto; }
.schedule__item { display:grid; grid-template-columns:72px 1px 1fr; gap:0 var(--sp-6); align-items:start; padding-bottom:var(--sp-8); }
.schedule__item:last-child { padding-bottom:0; }
.schedule__time { font-family:var(--font-display); font-size:var(--text-lg); font-style:italic; color:var(--gold); text-align:right; padding-top:.1em; font-variant-numeric:tabular-nums; }
.schedule__line { background:var(--border); position:relative; align-self:stretch; }
.schedule__line::before { content:''; position:absolute; top:.5em; left:50%; transform:translateX(-50%); width:8px; height:8px; background:var(--sage-light); border-radius:50%; border:2px solid var(--ivory); box-shadow:0 0 0 2px var(--sage-light); }
.schedule__content { padding-top:.1em; }
.schedule__content h4 { font-family:var(--font-display); font-size:var(--text-lg); font-style:italic; font-weight:300; color:var(--text-main); margin-bottom:var(--sp-1); }
.schedule__content p { font-size:var(--text-sm); color:var(--text-muted); }
.schedule__badge { display:inline-block; font-family:var(--font-body); font-size:var(--text-xs); font-style:normal; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); background:hsl(33 22% 48% / .12); border:1px solid hsl(33 22% 48% / .3); border-radius:var(--radius-full); padding:.15em .7em; margin-left:var(--sp-2); vertical-align:middle; }
.schedule__item--tentative .schedule__time { color:var(--gold-soft); }

/* UBICACIÓN */
.ubicacion { background:var(--cream); }
.ubicacion__layout { display:grid; grid-template-columns:1fr 1.4fr; gap:var(--sp-8); align-items:start; margin-top:var(--sp-8); }
.ubicacion__img-wrap { position:sticky; top:5rem; }
.ubicacion__img { width:100%; height:auto; border-radius:var(--radius-lg); box-shadow:var(--shadow-elegant); object-fit:contain; display:block; }
.ubicacion__map-wrap { display:flex; flex-direction:column; gap:var(--sp-4); }
.ubicacion__map { width:100%; height:380px; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); border:0; }
.ubicacion__info { display:flex; flex-direction:column; gap:var(--sp-3); }
.ubicacion__address { font-family:var(--font-display); font-style:italic; font-size:var(--text-lg); color:var(--text-main); }
@media (max-width:768px) {
  .ubicacion__layout { grid-template-columns:1fr; }
  .ubicacion__img-wrap { position:static; }
  .ubicacion__img { max-height:none; object-fit:contain; }
  .ubicacion__map { height:280px; }
}

/* LLEGAR */
.llegar { background:var(--ivory); }
.transport-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:var(--sp-6); margin-top:var(--sp-2); }
.transport-card { text-align:center; }
.transport-card__icon { font-size:2.5rem; margin-bottom:var(--sp-4); line-height:1; }
.transport-card h3 { font-size:var(--text-lg); font-style:italic; margin-bottom:var(--sp-3); color:var(--text-main); }
.transport-card p { font-size:var(--text-sm); color:var(--text-muted); line-height:1.8; margin-inline:auto; }

/* CEREMONIA SIN MÓVILES */
.moviles { background:var(--ivory); }
.moviles__card { max-width:640px; margin-inline:auto; }
.moviles__icon { font-size:3rem; margin-bottom:var(--sp-4); line-height:1; }
.moviles__title { font-size:var(--text-xl); font-style:italic; color:var(--text-main); margin-bottom:var(--sp-6); }
.moviles__body { font-size:var(--text-base); color:var(--text-muted); line-height:1.9; margin-bottom:var(--sp-4); margin-inline:auto; }

/* FAQ */
.faq { background:var(--cream); }
.faq__list { display:flex; flex-direction:column; gap:var(--sp-2); margin-top:var(--sp-2); }
.faq__item { border:1px solid var(--border); border-radius:var(--radius-md); background:var(--cream); overflow:hidden; transition:box-shadow .3s; }
.faq__item[open] { box-shadow:var(--shadow-soft); }
.faq__q { padding:var(--sp-4) var(--sp-6); font-size:var(--text-base); font-weight:400; color:var(--text-main); cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); transition:background .25s; user-select:none; }
.faq__q::-webkit-details-marker { display:none; }
.faq__q::after { content:'+'; font-size:var(--text-lg); font-weight:300; color:var(--sage); flex-shrink:0; transition:transform .3s; line-height:1; }
details[open] .faq__q::after { transform:rotate(45deg); }
.faq__q:hover { background:var(--sand); }
.faq__a { padding:0 var(--sp-6) var(--sp-5); font-size:var(--text-sm); color:var(--text-muted); line-height:1.85; max-width:100%; }
.faq__link { color:var(--sage-dark); text-decoration:underline; text-underline-offset:3px; }
.faq__link:hover { color:var(--sage); }

/* RSVP */
.rsvp { background:var(--ivory); }
.rsvp-form { display:flex; flex-direction:column; gap:var(--sp-6); }
.form-group { display:flex; flex-direction:column; gap:var(--sp-2); }
.form-label { font-size:var(--text-sm); font-weight:500; color:var(--text-main); letter-spacing:.02em; }
.form-input { padding:.75em 1em; border:1px solid var(--border); border-radius:var(--radius-md); background:hsl(51 23% 99%); font-size:var(--text-sm); color:var(--text-main); transition:border-color .25s,box-shadow .25s; width:100%; }
.form-input:focus { outline:none; border-color:var(--sage); box-shadow:0 0 0 3px hsl(213 18% 58% / .15); }
.form-textarea { resize:vertical; min-height:100px; }
.radio-group { display:flex; flex-wrap:wrap; gap:var(--sp-3); }
.radio-label { display:flex; align-items:center; gap:var(--sp-2); cursor:pointer; font-size:var(--text-sm); color:var(--text-muted); padding:.5em .9em; border:none; border-radius:var(--radius-full); transition:var(--ease-smooth); }
.radio-label:has(input:checked) { background:transparent; border:none; color:var(--text-main); font-weight:500; }
.radio-label input { accent-color:var(--sage); }
.checkbox-group { display:flex; flex-wrap:wrap; gap:var(--sp-3); }
.checkbox-label { display:flex; align-items:center; gap:var(--sp-2); cursor:pointer; font-size:var(--text-sm); color:var(--text-muted); padding:.5em .9em; border:1px solid var(--border); border-radius:var(--radius-full); transition:var(--ease-smooth); }
.checkbox-label:has(input:checked) { background:hsl(213 18% 58% / .12); border-color:var(--sage); color:var(--sage-dark); }
.checkbox-label input { accent-color:var(--sage); }
.form-error { color:hsl(0 60% 45%); font-size:var(--text-sm); padding:var(--sp-3) var(--sp-4); background:hsl(0 60% 45% / .08); border:1px solid hsl(0 60% 45% / .2); border-radius:var(--radius-md); }
.rsvp-success { text-align:center; padding:var(--sp-12); }
.rsvp-success__icon { font-size:3rem; margin-bottom:var(--sp-4); }
.rsvp-success h3 { font-size:var(--text-xl); font-style:italic; margin-bottom:var(--sp-3); }
.rsvp-success p { font-size:var(--text-sm); color:var(--text-muted); margin-inline:auto; }
fieldset { border: none; padding: 0; margin: 0; }
#guestNamesGroup[hidden],#kidsDetailGroup[hidden] { display:none; }

/* EL REGALO */
.regalo { background:var(--cream); }
.regalo__label { font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint); margin-bottom:var(--sp-1) !important; }
.regalo__iban { font-family:var(--font-display); font-size:var(--text-xl); font-style:italic; color:var(--text-main); letter-spacing:.04em; margin-bottom:var(--sp-1) !important; }
.regalo__titular { font-size:var(--text-sm); color:var(--text-muted); margin-bottom:var(--sp-4) !important; }

/* CIERRE VISUAL */
.cierre {
  text-align: center;
  padding-block: var(--sp-8);
  background: var(--cream);
}
.cierre__img {
  width: min(860px, 90%);
  height: auto;
  display: inline-block;
  mix-blend-mode: multiply;
  border-radius: var(--radius-xl);
  -webkit-mask-image: radial-gradient(ellipse 96% 92% at 50% 50%, black 60%, transparent 100%);
  mask-image: radial-gradient(ellipse 96% 92% at 50% 50%, black 60%, transparent 100%);
}

/* FOOTER */
.footer { background:var(--cream); border-top:1px solid var(--border); text-align:center; padding-block:clamp(var(--sp-10),6vw,var(--sp-16)); }
.footer__names { font-family:var(--font-display); font-size:var(--text-xl); font-style:italic; font-weight:300; color:var(--text-main); margin-bottom:var(--sp-2); }
.footer__date { font-size:var(--text-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin-bottom:var(--sp-2); }
.footer__copy { font-family:var(--font-display); font-style:italic; font-size:var(--text-base); color:var(--text-muted); }

/* LIGHTBOX */
.lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: hsl(218 20% 8% / .95);
  align-items: center;
  justify-content: center;
}
.lightbox.active { display: flex; }
.lightbox__img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: var(--radius-md);
  box-shadow: 0 8px 40px hsl(0 0% 0% / .5);
}
.lightbox__close,
.lightbox__prev,
.lightbox__next {
  position: absolute;
  background: hsl(0 0% 100% / .15);
  border: 1px solid hsl(0 0% 100% / .25);
  color: white;
  border-radius: var(--radius-full);
  width: 44px;
  height: 44px;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s;
}
.lightbox__close:hover,
.lightbox__prev:hover,
.lightbox__next:hover { background: hsl(0 0% 100% / .28); }
.lightbox__close { top: var(--sp-4); right: var(--sp-4); }
.lightbox__prev  { left: var(--sp-4);  top: 50%; transform: translateY(-50%); }
.lightbox__next  { right: var(--sp-4); top: 50%; transform: translateY(-50%); }

/* SCROLL REVEAL */
.reveal { opacity:0; transform:translateY(20px); transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1); }
.reveal.visible { opacity:1; transform:none; }

/* ==============================================
   SOBRE · v4 — solapa correcta + paper + flash
============================================== */

body.env-locked { overflow: hidden; }

#env-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: hsl(218 38% 12%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.10'/%3E%3C/svg%3E");
  background-size: 300px;
  perspective: 1400px;
  transition: opacity 1.2s cubic-bezier(.4,0,.2,1);
}

#env-overlay.fade-out {
  opacity: 0;
  pointer-events: none;
}

.env-hint {
  font-family: var(--font-display);
  font-size: clamp(1rem, 2.5vw, 1.45rem);
  font-style: italic;
  color: hsl(51 23% 88% / .80);
  letter-spacing: .04em;
  margin-bottom: clamp(1.2rem, 2.5vw, 2rem);
  opacity: 0;
  animation: envFadeUp 1.2s cubic-bezier(.4,0,.2,1) .6s forwards;
}

.env-scene {
  position: relative;
  width: min(500px, 86vw);
  aspect-ratio: 1.65 / 1;
  cursor: pointer;
  opacity: 0;
  animation: envFadeUp 1.2s cubic-bezier(.4,0,.2,1) 1s forwards;
  filter:
    drop-shadow(0 28px 55px hsl(218 60% 4% / .70))
    drop-shadow(0 6px 14px hsl(218 60% 4% / .45));
}

.env-body {
  position: absolute;
  inset: 0;
  border-radius: 5px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.13'/%3E%3C/svg%3E"),
    linear-gradient(160deg, hsl(218 42% 24%) 0%, hsl(218 40% 18%) 55%, hsl(220 44% 14%) 100%);
  background-size: 300px, 100%;
  background-blend-mode: overlay, normal;
  overflow: hidden;
}

.env-body::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to bottom right, hsl(218 50% 12% / .55) 49.5%, transparent 50%),
    linear-gradient(to bottom left,  hsl(218 50% 12% / .55) 49.5%, transparent 50%);
  background-size: 50% 100%, 50% 100%;
  background-position: left, right;
  background-repeat: no-repeat;
}

.env-border {
  position: absolute;
  inset: 0;
  border-radius: 5px;
  border: 1px solid hsl(218 55% 38% / .55);
  box-shadow:
    inset 0 1px 0 hsl(218 60% 60% / .22),
    inset 0 -1px 0 hsl(218 60% 8% / .45);
  pointer-events: none;
  z-index: 30;
}

.env-flap-wrap {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 58%;
  z-index: 20;
  transform-origin: 50% 0%;
  transform-style: preserve-3d;
  transition: transform 2.2s cubic-bezier(.4,0,.12,1);
}

.env-flap-front {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
  border-radius: 5px 5px 0 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.13'/%3E%3C/svg%3E"),
    linear-gradient(170deg, hsl(218 42% 28%) 0%, hsl(220 42% 18%) 100%);
  background-size: 300px, 100%;
  background-blend-mode: overlay, normal;
}

.env-flap-front::after {
  content: '';
  position: absolute;
  inset: 0;
  clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
  background: linear-gradient(170deg, hsl(218 50% 30% / .0) 0%, hsl(218 50% 10% / .5) 100%);
}

.env-flap-back {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: rotateX(180deg);
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  border-radius: 5px 5px 0 0;
  background: linear-gradient(160deg, hsl(51 22% 93%) 0%, hsl(40 14% 85%) 100%);
}

.env-shell {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 25;
  pointer-events: none;
  transition:
    opacity 1.0s cubic-bezier(.4,0,.2,1) .3s,
    transform 2.2s cubic-bezier(.4,0,.12,1) 0s;
}

.env-shell svg {
  width: clamp(36px, 6.5vw, 54px);
  filter: drop-shadow(0 3px 8px hsl(218 60% 4% / .45));
}

.env-scene.opening .env-flap-wrap {
  transform: rotateX(-190deg);
}

.env-scene.opening .env-shell {
  opacity: 0;
  transform: translateX(-50%) translateY(-20%);
}

.env-paper {
  position: absolute;
  left: 8%; right: 8%;
  bottom: 6%;
  height: 85%;
  border-radius: 3px;
  background: linear-gradient(160deg, hsl(51 22% 97%) 0%, hsl(40 14% 92%) 100%);
  box-shadow:
    0 2px 12px hsl(218 40% 8% / .35),
    0 0 0 1px hsl(40 14% 78% / .5);
  z-index: 35;
  transform: translateY(40%);
  opacity: 0;
  transition:
    transform 2.0s cubic-bezier(.4,0,.15,1) 1.4s,
    opacity 0.6s cubic-bezier(.4,0,.2,1) 1.4s;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: .4rem;
  overflow: hidden;
}

.env-paper::before {
  content: '';
  position: absolute;
  inset: 12% 15%;
  border: 1px solid hsl(33 22% 72% / .5);
  border-radius: 2px;
}

.env-paper-names {
  font-family: var(--font-display);
  font-size: clamp(.8rem, 2vw, 1.1rem);
  font-style: italic;
  font-weight: 300;
  color: hsl(218 10% 38%);
  letter-spacing: .04em;
  position: relative;
  z-index: 1;
}

.env-paper-date {
  font-family: var(--font-body);
  font-size: clamp(.55rem, 1.2vw, .72rem);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: hsl(33 22% 58%);
  position: relative;
  z-index: 1;
}

.env-scene.opening .env-paper {
  transform: translateY(-28%);
  opacity: 1;
}

#env-flash {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: white;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.55s cubic-bezier(.4,0,.2,1);
}
#env-flash.flash-in  { opacity: 1; }
#env-flash.flash-out { opacity: 0; }

.env-prompt {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-top: clamp(1.2rem, 2.5vw, 2rem);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: hsl(33 22% 65%);
  cursor: pointer;
  opacity: 0;
  animation: envFadeUp 1.2s cubic-bezier(.4,0,.2,1) 1.5s forwards;
}

.env-prompt-arrow { animation: envArrow 1.8s ease-in-out infinite; }

@keyframes envFadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes envArrow {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(7px); }
}