/* ═════════ VALENTINA & MATEO — editorial luxury v2 ═════════ */
:root{
  --bg:#F5F0E8; --paper:#FCF9F3; --ink:#2D2926; --body:#57504A;
  --muted:#7A6652; --accent:#B49A72; --accent-deep:#8C7355;
  --line:#E3D6C1; --gold-soft:#D9C6A5;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Inter',sans-serif;font-weight:300;line-height:1.75;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.locked{overflow:hidden;height:100svh}
img{display:block;max-width:100%}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.05;margin:0;letter-spacing:.01em}
h2{font-size:clamp(2.1rem,8.5vw,3.1rem);text-align:center}
h2 em{font-style:italic;font-weight:400;color:var(--muted)}
.script{font-family:'Great Vibes',cursive;font-weight:400}
.center{text-align:center}.muted{color:var(--body)}.reveal{opacity:0;transform:translateY(28px);transition:opacity 1.2s cubic-bezier(.2,.6,.2,1),transform 1.2s cubic-bezier(.2,.6,.2,1)}
.reveal.visible{opacity:1;transform:none}

/* grain */
.grain{position:fixed;inset:0;z-index:80;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 .7 0 0 0 0 .62 0 0 0 0 .5 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ── ENVELOPE ── */
.envelope{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem;
background:radial-gradient(1000px 500px at 50% -10%,#EFE3D2,#D9CABD 60%,#C9B69A);
transition:opacity 1s ease,visibility 1s}
.envelope.hide{opacity:0;visibility:hidden}
.envelope.hide .envelope-card{transform:translateY(26px) scale(.985)}
.envelope-card{position:relative;width:min(92vw,430px);background:var(--paper);border-radius:4px;text-align:center;
padding:3.2rem 1.8rem 2.2rem;box-shadow:0 40px 100px rgba(45,41,38,.35),inset 0 0 0 1px #fff,inset 0 0 0 6px var(--paper),inset 0 0 0 7px var(--line);
transition:transform 1s ease;animation:cardIn 1.4s cubic-bezier(.2,.7,.2,1) both;overflow:hidden}
@keyframes cardIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.flora{position:absolute;width:96px;opacity:.9;pointer-events:none}
.flora-tl{top:6px;left:6px}.flora-tr{top:6px;right:6px;transform:scaleX(-1)}
.seal-wrap{position:relative;width:74px;height:74px;margin:-8px auto 1rem}
.seal{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#9A7F5E,#6E5A43);color:#F5EEDF;display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:1.25rem;letter-spacing:.1em;box-shadow:0 8px 20px rgba(110,90,67,.45),inset 0 2px 4px rgba(255,255,255,.25)}
.seal span{font-size:.7rem;margin:0 .2rem;opacity:.8}
.seal-ring{position:absolute;inset:-7px;border:1px solid var(--accent);border-radius:50%;opacity:.6;animation:spin 24s linear infinite}
.seal-ring::before{content:"✦";position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--paper);padding:0 4px;color:var(--accent);font-size:.7rem}
@keyframes spin{to{transform:rotate(360deg)}}
.env-eyebrow{letter-spacing:.3em;text-transform:uppercase;font-size:.6rem;color:var(--muted);margin:0}
.env-names{font-size:2.9rem;line-height:1.05;margin:.6rem 0}
.env-names span{display:block}
.env-names .script{font-size:3rem;color:var(--accent);line-height:.9;margin:.1rem 0}
.divider{display:flex;align-items:center;gap:.8rem;max-width:230px;margin:1.1rem auto}
.divider span{height:1px;background:linear-gradient(90deg,transparent,var(--accent));flex:1}
.divider span:last-child{background:linear-gradient(90deg,var(--accent),transparent)}
.divider em{color:var(--accent);font-style:normal;font-size:.85rem}
.env-date{letter-spacing:.22em;font-size:.68rem;font-weight:500}
.env-sub{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--muted);margin:.4rem 0 0}
.btn-open{margin-top:1.3rem;display:inline-flex;align-items:center;gap:.7rem;background:var(--ink);color:var(--bg);border:0;border-radius:999px;padding:1rem 1.6rem 1rem 2rem;font-family:'Cormorant Garamond',serif;font-size:1.2rem;letter-spacing:.04em;cursor:pointer;transition:transform .3s,box-shadow .3s}
.btn-open:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(45,41,38,.3)}
.btn-open i{font-style:normal;background:var(--accent);color:#fff;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.env-hint{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#A89880;margin-top:.9rem}

/* ── TOPBAR ── */
.topbar{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:.7rem 1rem;background:rgba(245,240,232,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .8s}
body.open .topbar{opacity:1;pointer-events:auto}
.mono{font-family:'Cormorant Garamond',serif;font-size:1rem;letter-spacing:.3em}
.top-rsvp{text-decoration:none;color:var(--bg);background:var(--ink);padding:.45rem 1rem;border-radius:999px;letter-spacing:.18em}

/* ── HERO ── */
.hero{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:5rem 1.2rem 3rem;position:relative;overflow:hidden}
.eyebrow{letter-spacing:.34em;text-transform:uppercase;font-size:.62rem;color:var(--muted);font-weight:500}
.eyebrow.light,.divider.light em{color:var(--gold-soft)}
.arch-wrap{position:relative;margin:1.4rem auto .5rem}
.arch-offset{position:absolute;inset:10px -10px -10px 10px;border:1px solid var(--accent);border-radius:170px 170px 14px 14px;opacity:.55}
.arch{width:min(76vw,320px);aspect-ratio:3/4.1;overflow:hidden;border-radius:160px 160px 12px 12px;border:1px solid #fff;box-shadow:0 30px 70px rgba(122,102,82,.28);position:relative;background:#E9DCC7}
.arch img{width:100%;height:112%;object-fit:cover;will-change:transform}
.arch-caption{margin-top:.6rem;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:.85rem;color:#A89880;letter-spacing:.06em}
.couple{font-size:clamp(3.2rem,13vw,5.2rem);margin-top:.6rem}
.couple span{display:block}
.couple .amp{font-size:clamp(2.6rem,9vw,3.6rem);color:var(--accent);line-height:.9;margin:.1rem 0}
.hero-date{letter-spacing:.26em;font-size:.7rem;font-weight:600;margin:.4rem 0 0}
.hero-phrase{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.25rem;color:var(--muted);margin:.8rem 0 0;max-width:32ch}
.hero-meta{display:flex;gap:.6rem;align-items:center;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:#A89880;margin-top:.7rem}
.scroll-cue{margin-top:1.6rem;text-decoration:none;color:var(--muted);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:.5rem}
.scroll-cue span{width:22px;height:36px;border:1px solid var(--accent);border-radius:12px;position:relative;display:block}
.scroll-cue span::after{content:"";position:absolute;top:7px;left:50%;width:3px;height:8px;margin-left:-1.5px;border-radius:3px;background:var(--accent);animation:wheel 1.8s ease infinite}
@keyframes wheel{0%{opacity:1;transform:translateY(0)}70%{opacity:0;transform:translateY(10px)}100%{opacity:0}}
.petals i{position:absolute;top:-20px;width:10px;height:12px;background:radial-gradient(ellipse,#E9CFC0,#D9B9A6);border-radius:60% 40% 60% 40%;opacity:0;animation:fall 9s linear infinite}
.petals i:nth-child(1){left:12%}.petals i:nth-child(2){left:30%;animation-delay:2s}.petals i:nth-child(3){left:52%;animation-delay:4s}.petals i:nth-child(4){left:68%;animation-delay:1s}.petals i:nth-child(5){left:82%;animation-delay:5.5s}.petals i:nth-child(6){left:44%;animation-delay:7s}
@keyframes fall{0%{opacity:0;transform:translateY(0) rotate(0)}10%{opacity:.7}100%{opacity:0;transform:translateY(105vh) rotate(320deg)}}

/* marquee */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:var(--paper);padding:.55rem 0}
.marquee-track{white-space:nowrap;font-family:'Cormorant Garamond',serif;letter-spacing:.3em;font-size:.72rem;text-transform:uppercase;color:var(--muted);animation:mq 22s linear infinite;display:inline-block;padding-left:100%}
@keyframes mq{to{transform:translateX(-50%)}}

/* ── SECTIONS ── */
.section{max-width:700px;margin:0 auto;padding:3.6rem 1.2rem}
.label{text-align:center;letter-spacing:.3em;text-transform:uppercase;font-size:.6rem;color:var(--accent);font-weight:600;margin:0 0 .8rem}
.dropcap{color:var(--body);font-size:1.02rem;max-width:58ch;margin:1rem auto 0}
.dropcap span{font-family:'Cormorant Garamond',serif;font-size:3.2rem;float:left;line-height:.85;padding-right:.4rem;color:var(--ink)}
.story-grid{display:grid;gap:.7rem;margin-top:1.4rem}
@media(min-width:640px){.story-grid{grid-template-columns:repeat(3,1fr)}}
.story-card{background:var(--paper);border:1px solid var(--line);border-top:2px solid var(--accent);padding:1.1rem;font-size:.88rem;color:var(--body)}
.story-card strong{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--accent-deep);display:block}
.quote{text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.35rem;margin:1.8rem auto 0;max-width:30ch;color:var(--ink)}
.quote cite{display:block;font-family:'Inter';font-style:normal;font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin-top:.6rem}

/* date */
.date-section{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);max-width:none}
.date-section>*{max-width:700px;margin-left:auto;margin-right:auto}
.big-date{display:flex;align-items:center;justify-content:center;gap:1.1rem;text-align:center}
.big-date span{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.big-date strong{font-family:'Cormorant Garamond',serif;font-size:clamp(4.5rem,20vw,7rem);line-height:1;font-weight:500}
.countdown{display:flex;align-items:flex-start;justify-content:center;gap:.4rem;margin:1.4rem auto 0}
.countdown div{text-align:center;min-width:64px}
.countdown span{font-family:'Cormorant Garamond',serif;font-size:2.3rem;line-height:1;display:block;font-variant-numeric:tabular-nums}
.countdown small{letter-spacing:.24em;text-transform:uppercase;font-size:.58rem;color:var(--muted)}
.countdown-done{grid-column:1/-1;border-top:2px solid var(--accent);border-bottom:2px solid var(--accent);background:var(--paper);padding:1.2rem 1.4rem;text-align:center}
.countdown-done p{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.3rem;color:var(--muted);margin:0}
.countdown i{font-style:normal;color:var(--accent);font-size:1.6rem;margin-top:.3rem}
.btn-outline{display:inline-block;margin-top:1.3rem;border:1px solid var(--muted);color:var(--ink);text-decoration:none;padding:.75rem 1.6rem;border-radius:999px;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase}

/* places */
.places{display:grid;gap:1rem;margin-top:1.4rem}
@media(min-width:660px){.places{grid-template-columns:1fr 1fr}.section{max-width:820px}}
.place{background:var(--paper);border:1px solid var(--line);overflow:hidden}
.place-photo{aspect-ratio:16/10;overflow:hidden}
.place-photo img{width:100%;height:100%;object-fit:cover;filter:sepia(.25);transition:transform 1.6s ease}
.place:hover .place-photo img{transform:scale(1.05)}
.place-kicker{letter-spacing:.26em;text-transform:uppercase;font-size:.6rem;color:var(--accent);font-weight:600;padding:1.1rem 1.2rem 0}
.place h3{font-size:1.9rem;padding:.2rem 1.2rem}
.place .muted{padding:0 1.2rem;font-size:.9rem}
.place-row{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.2rem 1.3rem;border-top:1px solid var(--line);margin-top:1rem}
.link{color:var(--accent-deep);font-size:.82rem;text-decoration:none;border-bottom:1px solid var(--accent);font-weight:500}
.tag{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:.25rem .7rem;color:var(--muted)}
.map{margin-top:1rem;border:1px solid var(--line);position:relative;overflow:hidden;background:#EDE4D3}
.map iframe{width:100%;height:250px;border:0;filter:sepia(.35) saturate(.85);display:block}
.map-card{position:absolute;left:10px;bottom:10px;background:rgba(252,249,243,.94);border:1px solid var(--line);padding:.6rem .9rem;font-size:.78rem}
.map-card strong{font-family:'Cormorant Garamond',serif;font-size:1rem;display:block}

/* timeline */
.timeline-section{max-width:560px}
.timeline{list-style:none;padding:0;margin:1.6rem 0 0;position:relative}
.timeline::before{content:"";position:absolute;left:52px;top:8px;bottom:8px;width:1px;background:var(--line)}
.timeline li{display:grid;grid-template-columns:74px 1fr;gap:.4rem;padding:.9rem 0;position:relative}
.timeline .t{font-family:'Cormorant Garamond',serif;font-size:1.35rem;color:var(--accent-deep);padding-top:.1rem}
.timeline li::before{content:"";position:absolute;left:49px;top:22px;width:7px;height:7px;border-radius:50%;background:var(--bg);border:1.5px solid var(--accent)}
.timeline strong{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:600}
.timeline p{margin:.15rem 0 0;font-size:.88rem;color:var(--body)}

/* dress */
.dress-grid{display:grid;gap:.8rem;margin-top:1.3rem}
@media(min-width:600px){.dress-grid{grid-template-columns:1fr 1fr}}
.dress-card{background:var(--paper);border:1px solid var(--line);text-align:center;padding:1.6rem 1.2rem;position:relative}
.dress-card::after{content:"";position:absolute;top:8px;left:8px;right:8px;bottom:8px;border:1px solid var(--line);pointer-events:none}
.dress-icon{font-size:1.4rem;color:var(--accent)}
.dress-card h3{font-size:1.5rem;margin:.3rem 0}
.dress-card p{font-size:.88rem;color:var(--body)}
.swatches{display:flex;gap:.45rem;justify-content:center;margin-top:.7rem}
.swatches i{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.avoid{text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--muted);margin-top:1.2rem}

/* gallery */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:.55rem;margin-top:1.3rem}
.gallery figure{margin:0;position:relative;overflow:hidden;background:#E9DCC7;cursor:zoom-in}
.gallery img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4;transition:transform 1.4s ease;filter:sepia(.12)}
.gallery figure:hover img{transform:scale(1.06)}
.gallery .wide{grid-column:1/-1}.gallery .wide img{aspect-ratio:16/10}
.gallery .tall img{aspect-ratio:3/4.4}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:.85rem;color:#fff;background:linear-gradient(transparent,rgba(45,41,38,.7));padding:1.2rem .7rem .5rem}

/* rsvp */
.rsvp-section{background:var(--ink);color:var(--bg);max-width:none}
.rsvp-section>*{max-width:560px;margin-left:auto;margin-right:auto}
.rsvp-section h2{color:var(--bg)}.rsvp-section .muted{color:#CFC3B3}.rsvp-section .label{color:var(--gold-soft)}
.rsvp{display:grid;gap:.9rem;margin-top:1.4rem}
.rsvp label{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:#B9AC97;display:grid;gap:.4rem}
.rsvp input,.rsvp textarea{background:transparent;border:0;border-bottom:1px solid #5A5248;color:var(--bg);padding:.7rem .1rem;font-family:'Cormorant Garamond',serif;font-size:1.15rem;letter-spacing:.01em;width:100%}
.rsvp input:focus,.rsvp textarea:focus{outline:none;border-color:var(--accent)}
.rsvp input::placeholder,.rsvp textarea::placeholder{color:#7A7268;font-style:italic}
.attend{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.pill{border:1px solid #5A5248;border-radius:999px;padding:.7rem;text-align:center;cursor:pointer;transition:all .3s;display:block}
.pill:has(input:checked){background:var(--accent);border-color:var(--accent);color:#fff}
.pill input{display:none}.pill span{font-size:.68rem;letter-spacing:.14em}
.row2{display:grid;gap:.9rem;grid-template-columns:1fr 1fr}
.rsvp button{background:var(--accent);color:#fff;border:0;border-radius:999px;padding:1rem;font-family:'Cormorant Garamond',serif;font-size:1.2rem;letter-spacing:.05em;cursor:pointer;margin-top:.4rem}
.rsvp-ok{text-align:center;border:1px solid var(--gold-soft);padding:2rem 1.2rem;margin-top:1.4rem}
.rsvp-ok span{font-size:1.6rem;color:var(--gold-soft)}.rsvp-ok h3{font-size:2rem;color:var(--bg)}

/* guestbook */
.guestbook{display:grid;gap:.6rem;max-width:480px;margin:1.3rem auto 0}
.guestbook input,.guestbook textarea{border:1px solid var(--line);background:var(--paper);padding:.9rem 1rem;font-family:'Cormorant Garamond',serif;font-size:1.05rem;width:100%}
.guestbook button{background:transparent;border:1px solid var(--ink);border-radius:999px;padding:.8rem;letter-spacing:.18em;text-transform:uppercase;font-size:.68rem;cursor:pointer}
.messages{display:grid;gap:.6rem;margin-top:1.2rem;max-width:520px;margin-left:auto;margin-right:auto}
.msg{background:var(--paper);border:1px solid var(--line);padding:1rem 1.1rem;position:relative}
.msg::before{content:"“";font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--accent);position:absolute;top:2px;left:10px}
.msg p{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.05rem;margin:.6rem 0 .3rem}
.msg strong{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* closing */
.closing{position:relative;color:#F7F1E6;text-align:center;overflow:hidden;background:var(--ink)}
.close-photo{position:absolute;inset:0}.close-photo img{width:100%;height:100%;object-fit:cover;opacity:.35}
.close-inner{position:relative;padding:4.5rem 1.2rem 4rem}
.close-inner h2{font-size:clamp(2.6rem,11vw,4rem);color:#F7F1E6}
.close-inner .gold{color:var(--gold-soft);font-size:3rem;display:block;line-height:.9}
.close-date{letter-spacing:.3em;font-size:.65rem;margin-top:1rem;color:var(--gold-soft)}
.mono-seal{display:inline-block;margin-top:1.2rem;border:1px solid var(--gold-soft);border-radius:50%;width:64px;height:64px;line-height:64px;font-family:'Cormorant Garamond',serif;letter-spacing:.2em;color:var(--gold-soft)}
.divider.light span{background:linear-gradient(90deg,transparent,var(--gold-soft))}.divider.light span:last-child{background:linear-gradient(90deg,var(--gold-soft),transparent)}

/* lightbox */
.lightbox[hidden]{display:none!important}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(20,17,15,.92);display:flex;align-items:center;justify-content:center;padding:1rem}
.lightbox img{max-width:94vw;max-height:86vh;border:6px solid #fff}
.lightbox button{position:absolute;top:14px;right:14px;background:none;border:1px solid #fff;color:#fff;width:40px;height:40px;border-radius:50%;cursor:pointer}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.petals,.marquee-track{display:none}}
