:root{
  --ivory:#fff9f4; --blush:#f8e1dd; --blush-d:#f0c4c0; --rose:#d4868e; --rose-d:#b9636c;
  --gold:#c9a15b; --gold-l:#e8d1a0; --ink:#4a3535; --muted:#8a7373;
  --script:'Great Vibes',cursive; --serif:'Cormorant Garamond',serif; --sans:'Montserrat',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--ivory);font-weight:300;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
body.locked{overflow:hidden;height:100vh;height:100dvh}
img{max-width:100%}
a{color:inherit;text-decoration:none}
.script{font-family:var(--script);font-weight:400}
.container.narrow{max-width:760px}
.section-pad{padding:90px 0}
.bg-blush{background:linear-gradient(180deg,var(--blush),#fdeeea)}
.eyebrow{letter-spacing:.35em;text-transform:uppercase;font-size:.72rem;color:var(--gold);margin-bottom:.8rem;font-weight:500}
.eyebrow.dark{color:var(--rose-d)}
.h-xl{font-size:clamp(2.6rem,7vw,4.2rem);color:var(--rose-d);margin:0 0 .5rem;line-height:1.1}
.section-head{margin-bottom:3rem}
.muted{color:var(--muted)}
.lead-text{font-family:var(--serif);font-size:1.4rem;line-height:1.7;color:var(--ink)}
.flower-ico{width:70px;opacity:.9;margin-bottom:.8rem}
.btn-rose{background:linear-gradient(135deg,var(--rose),var(--rose-d));color:#fff;border:0;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;font-weight:500;padding-top:.8rem;padding-bottom:.8rem;box-shadow:0 8px 20px rgba(185,99,108,.3);transition:.3s}
.btn-rose:hover{color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(185,99,108,.4)}
.btn-ghost{border:1px solid #fff;color:#fff;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;padding-top:.8rem;padding-bottom:.8rem;background:rgba(255,255,255,.08);backdrop-filter:blur(4px)}
.btn-ghost:hover{background:#fff;color:var(--rose-d)}
.btn-ghost-dark{border:1px solid var(--gold);color:var(--gold)}
.btn-ghost-dark:hover{background:var(--gold);color:#fff}

/* ================= INTRO (full-screen sage envelope) ================= */
#intro{--ay:54%;--sage:#8d8b72;position:fixed;inset:0;z-index:9999;overflow:hidden;cursor:pointer;perspective:1600px;
  background:radial-gradient(circle at 50% 50%,#f1efe4,#dcdac8);transition:opacity 1s ease,transform 1s ease}
#intro.hide{opacity:0;transform:scale(1.12);pointer-events:none}
#petals{display:none}
.fw{position:absolute;inset:0;filter:drop-shadow(0 0 7px rgba(70,70,40,.28));will-change:transform;backface-visibility:hidden;pointer-events:none}
.fl{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .45 0 0 0 0 .35 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(var(--ang,180deg),var(--c1),var(--c2))}
.f-top{z-index:5;transform-origin:50% 0;transition:transform 1.1s cubic-bezier(.6,0,.3,1)}
.f-top .fl{clip-path:polygon(0 0,100% 0,50% var(--ay));--c1:#e3e2d2;--c2:#d9d8c6}
.f-bottom{z-index:4;transition:transform 1.1s cubic-bezier(.6,0,.3,1) .35s}
.f-bottom .fl{clip-path:polygon(0 100%,100% 100%,50% var(--ay));--c1:#dedccd;--c2:#e6e5d9;--ang:0deg}
.f-left{z-index:3;transition:transform 1.1s cubic-bezier(.6,0,.3,1) .35s}
.f-left .fl{clip-path:polygon(0 0,50% var(--ay),0 100%);--c1:#d3d1bf;--c2:#dad8c7;--ang:90deg}
.f-right{z-index:3;transition:transform 1.1s cubic-bezier(.6,0,.3,1) .35s}
.f-right .fl{clip-path:polygon(100% 0,50% var(--ay),100% 100%);--c1:#d3d1bf;--c2:#dad8c7;--ang:270deg}
#intro.open .f-top{transform:rotateX(100deg);transition:transform 1.5s cubic-bezier(.45,0,.2,1)}
#intro.open .f-left{transform:translate(-104%,6%) rotate(-5deg);transition:transform 1.4s cubic-bezier(.5,0,.2,1) .3s}
#intro.open .f-right{transform:translate(104%,-6%) rotate(-5deg);transition:transform 1.4s cubic-bezier(.5,0,.2,1) .3s}
#intro.open .f-bottom{transform:translateY(104%);transition:transform 1.4s cubic-bezier(.5,0,.2,1) .3s}
.fl-text{position:absolute;left:0;right:0;text-align:center;padding:0 16px}
.fl-top-text{top:9%}
.fl-top-text h1{font-family:'Playfair Display',serif;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);font-size:clamp(1.05rem,3.4vw,2rem);margin:0;animation:fadeDown 1.4s ease both}
.fl-bottom-text{bottom:7%}
.news{font-size:clamp(1.5rem,5vw,2.1rem);color:#9b9980;margin:0 0 .4rem;animation:fadeUp 1.6s .4s ease both}
.tap{font-size:clamp(.7rem,2.2vw,.9rem);letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin:0;font-weight:500;animation:blink 1.8s infinite}
@keyframes fadeDown{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes blink{50%{opacity:.4}}
.vine{position:absolute;bottom:0;height:74vh;width:calc(74vh*.283);max-width:260px;opacity:.9}
.vine-l{left:10px}.vine-r{right:10px;transform:scaleX(-1)}
.vine-svg{width:100%;height:100%;overflow:visible}
.vine-svg path,.vine-svg ellipse{fill:none;stroke:#8c9a78;stroke-width:1.3;stroke-linecap:round}
.vine-svg .leaf{fill:rgba(140,154,120,.2)}
.vine-svg .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:drawLine 3s .5s ease forwards}
.vine-svg .rose{animation-delay:1.6s;animation-duration:1.8s}
@keyframes drawLine{to{stroke-dashoffset:0}}
.inv-stage{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;overflow:hidden}
#intro.open .inv-wrap{position:relative;display:flex;flex-direction:column;align-items:center;width:min(92vw,560px);max-height:100vh;max-height:100dvh;padding:2vh 0;
  opacity:0;transform:translateY(40px) scale(.94);transition:opacity 1s .7s,transform 1.2s .7s cubic-bezier(.2,.9,.3,1)}
#intro.open .inv-wrap{opacity:1;transform:none}
#intro.zoom .inv-wrap{transform:scale(1.6);transition:transform 1s cubic-bezier(.6,0,.2,1)}
.inv-card{width:100%;background:linear-gradient(180deg,#fffdfa,#faf3ea);border-radius:4px;text-align:center;padding:clamp(22px,4.5vh,40px) clamp(14px,5vw,34px);box-shadow:0 20px 60px rgba(30,25,10,.35);color:#4a3b33;font-family:var(--sans)}
.ic-top{letter-spacing:.12em;text-transform:uppercase;font-size:clamp(.62rem,2.4vw,.85rem);margin:0 0 .5rem;font-weight:400}
.ic-name{font-family:'Playfair Display',serif;font-weight:400;letter-spacing:.22em;font-size:clamp(1.9rem,8vw,3rem);margin:0;color:#4a3b33;padding-left:.22em}
.ic-amp{display:flex;align-items:center;justify-content:center;gap:12px;margin:.2rem 0}
.ic-amp i{width:min(110px,22vw);height:1px;background:linear-gradient(90deg,transparent,#c9b48a)}
.ic-amp i:last-child{transform:scaleX(-1)}
.ic-amp span{font-family:'Playfair Display',serif;color:#b5975a;font-size:1.6rem}
.ic-req{font-size:clamp(.58rem,2.1vw,.72rem);letter-spacing:.1em;text-transform:uppercase;line-height:1.8;margin:.9rem 0 .7rem}
.ic-date{display:flex;justify-content:center;align-items:center;margin:.3rem 0 1rem}
.ic-date div{padding:0 clamp(10px,3.6vw,24px);display:flex;flex-direction:column;gap:2px}
.ic-date div+div{border-left:1px solid #cdbf9f}
.ic-date small{font-size:.6rem;letter-spacing:.12em}
.ic-date b{font-family:'Playfair Display',serif;font-weight:400;font-size:clamp(1.2rem,5vw,1.9rem);line-height:1.15}
.ic-rule{display:flex;align-items:center;gap:8px;margin:0 0 1rem}
.ic-rule i{flex:1;height:1px;background:#d6c9ab}
.ic-rule em{width:6px;height:6px;background:#b5975a;transform:rotate(45deg)}
.ic-venue{letter-spacing:.1em;font-weight:500;font-size:clamp(.78rem,3vw,.95rem);margin:0 0 .4rem}
.ic-addr{font-size:clamp(.74rem,2.6vw,.88rem);margin:0 0 .5rem;color:#5a4b43}
.ic-love{color:#a0705e;font-size:1.7rem;margin:.2rem 0 .3rem}
.ic-foot{font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:#85766c;margin:0}
.ic-btnrow{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:20px;width:100%}
.ic-btn{background:#fbf8f2;border:1px solid #b5975a;color:#3d3029;border-radius:40px;padding:14px clamp(20px,6vw,38px);letter-spacing:.1em;text-transform:uppercase;font-size:clamp(.68rem,2.6vw,.82rem);font-weight:500;font-family:var(--sans);cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.2);transition:.3s;white-space:nowrap}
.ic-btn:hover{background:#fff;transform:translateY(-2px)}
.sprig-l,.sprig-r{width:clamp(44px,14vw,88px);flex:none;filter:drop-shadow(0 1px 3px rgba(0,0,0,.3))}
.sprig-r{transform:scaleX(-1)}
.ic-skip{background:none;border:0;color:#fff;margin-top:10px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;opacity:.9;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.seal{position:absolute;left:50%;top:var(--ay);transform:translate(-50%,-50%);z-index:8;width:clamp(96px,12vw,130px);aspect-ratio:1;border:0;background:none;padding:0;cursor:pointer;transition:transform .5s,opacity .5s;filter:drop-shadow(0 6px 10px rgba(60,50,30,.4));animation:sealbob 2.4s ease-in-out infinite}
.seal img{width:100%;height:100%;display:block;pointer-events:none}
.seal-ring{display:none;position:absolute;inset:6px;border-radius:50%;border:1.5px solid rgba(160,140,100,.45);box-shadow:inset 0 1px 2px rgba(255,255,255,.7)}
.sprig{width:58%;position:relative}
.seal:hover{transform:translate(-50%,-50%) scale(1.07)}
.seal.pop{animation:none;transform:translate(-50%,-50%) scale(1.6);opacity:0}
@keyframes sealbob{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.06)}}
@keyframes sealpulse{0%{box-shadow:0 0 0 0 rgba(183,168,138,.7),0 5px 12px rgba(90,80,50,.4)}70%{box-shadow:0 0 0 22px rgba(183,168,138,0),0 5px 12px rgba(90,80,50,.4)}100%{box-shadow:0 0 0 0 rgba(183,168,138,0),0 5px 12px rgba(90,80,50,.4)}}
#flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;transition:opacity .5s;z-index:20}
#flash.on{opacity:.9}
@media(max-width:600px){.vine{height:56vh;width:calc(56vh*.283)}}
#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:10000}
#hearts{position:fixed;inset:0;pointer-events:none;z-index:9990;overflow:hidden}
.heart-float{position:absolute;bottom:-40px;color:var(--rose);opacity:.85;animation:rise linear forwards;user-select:none}
@keyframes rise{to{transform:translateY(-115vh) translateX(var(--dx)) rotate(var(--rot));opacity:0}}

/* ================= SITE ================= */
#site{opacity:0;transition:opacity 1.2s ease}
body.ready #site{opacity:1}
.topbar{position:fixed;top:0;left:0;right:0;z-index:900;padding:18px 0;transition:.4s;color:#fff}
.topbar.scrolled{background:rgba(255,249,244,.92);backdrop-filter:blur(10px);padding:10px 0;color:var(--ink);box-shadow:0 2px 20px rgba(0,0,0,.06)}
.topbar nav a{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:400}
.topbar nav a:not(.btn):hover{color:var(--gold)}
.brand{font-size:2rem;line-height:1}
.brand i{font-style:normal;color:var(--gold)}
.burger{background:none;border:0;width:34px;height:26px;position:relative;padding:0}
.burger span{position:absolute;left:4px;right:4px;height:2px;background:currentColor;transition:.3s}
.burger span:first-child{top:8px}.burger span:last-child{top:16px}
.burger.on span:first-child{transform:translateY(4px) rotate(45deg)}
.burger.on span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;z-index:850;background:rgba(255,249,244,.98);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4rem;
  transform:translateY(-100%);transition:transform .5s cubic-bezier(.7,0,.2,1)}
.mobile-menu.show{transform:none}
.mobile-menu a{font-family:var(--script);font-size:2.4rem;color:var(--rose-d)}
body.menu-open .topbar{color:var(--ink)}

.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden}
.hero-swiper,.hero-swiper .swiper-slide{position:absolute;inset:0;width:100%;height:100%}
.hero-swiper .swiper-slide{background-size:cover;background-position:center;transform:scale(1.08);transition:transform 8s ease-out}
.hero-swiper .swiper-slide-active{transform:scale(1)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(60,25,30,.55),rgba(60,25,30,.35) 45%,rgba(60,25,30,.7))}
.hero-content{position:relative;z-index:2;padding:100px 16px 70px;max-width:900px}
.hero h1{font-size:clamp(3.4rem,13vw,8rem);line-height:1.05;margin:.2rem 0;text-shadow:0 4px 30px rgba(0,0,0,.35)}
.hero h1 em{font-style:normal;color:var(--gold-l);font-size:.6em;display:inline-block;margin:0 .1em}
.hero .eyebrow{color:var(--gold-l)}
.hero-date{font-family:var(--serif);font-size:clamp(1.1rem,3.5vw,1.6rem);letter-spacing:.12em;margin-bottom:1.6rem}
.countdown{display:flex;justify-content:center;gap:clamp(8px,3vw,22px);margin-bottom:2rem}
.countdown div{width:clamp(66px,19vw,96px);padding:14px 4px;border:1px solid rgba(255,255,255,.4);border-radius:14px;background:rgba(255,255,255,.12);backdrop-filter:blur(6px)}
.countdown b{display:block;font-family:var(--serif);font-size:clamp(1.6rem,6vw,2.5rem);font-weight:500;line-height:1}
.countdown span{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;opacity:.85}
.hero-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.scroll-down{position:absolute;bottom:22px;left:50%;width:24px;height:40px;border:2px solid rgba(255,255,255,.7);border-radius:14px;transform:translateX(-50%);z-index:2}
.scroll-down span{position:absolute;left:50%;top:7px;width:4px;height:8px;background:#fff;border-radius:2px;transform:translateX(-50%);animation:scrollDot 1.6s infinite}
@keyframes scrollDot{0%{opacity:1;top:7px}100%{opacity:0;top:20px}}

.reveal{opacity:0;transform:translateY(30px)}
body.ready .reveal{animation:revealUp 1s cubic-bezier(.2,.7,.2,1) forwards}
body.ready .d1{animation-delay:.2s}body.ready .d2{animation-delay:.4s}body.ready .d3{animation-delay:.6s}body.ready .d4{animation-delay:.8s}
@keyframes revealUp{to{opacity:1;transform:none}}
[data-wow]{opacity:0;transform:translateY(40px);transition:opacity 1s ease,transform 1s ease}
[data-wow].in{opacity:1;transform:none}

.person{text-align:center}
.person-img{width:min(260px,70vw);aspect-ratio:1;margin:0 auto 1.2rem;border-radius:50%;padding:8px;background:linear-gradient(135deg,var(--gold),var(--gold-l),var(--rose));box-shadow:0 15px 40px rgba(185,99,108,.25)}
.person-img img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:5px solid var(--ivory)}
.person h3{font-size:2.6rem;color:var(--rose-d);margin:0}
.role{letter-spacing:.3em;text-transform:uppercase;font-size:.68rem;color:var(--gold);font-weight:500}
.person p:last-child{max-width:340px;margin:0 auto;color:var(--muted)}
.beat{animation:beat 1.4s infinite}
@keyframes beat{0%,100%{transform:scale(1)}25%{transform:scale(1.15)}50%{transform:scale(1)}}


.event{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(185,99,108,.15);height:100%;transition:transform .4s}
.event:hover{transform:translateY(-8px)}
.event img{width:100%;height:210px;object-fit:cover}
.event-body{padding:24px;text-align:center}
.event-body h3{font-size:2.2rem;color:var(--rose-d);margin:0}
.event .time{color:var(--gold);letter-spacing:.15em;font-weight:500;margin:.3rem 0 .6rem}
.event p{margin:.15rem 0}

.gallery{columns:3;column-gap:14px}
.gallery a{display:block;margin-bottom:14px;overflow:hidden;border-radius:12px;position:relative}
.gallery img{width:100%;display:block;transition:transform .7s}
.gallery a:hover img{transform:scale(1.08)}
.gallery a::after{content:"+";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:3rem;color:#fff;background:rgba(185,99,108,.45);opacity:0;transition:.4s}
.gallery a:hover::after{opacity:1}

.map-wrap{border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(0,0,0,.12);border:6px solid #fff}
.map-wrap iframe{width:100%;height:380px;border:0;display:block}

.rsvp-form{background:#fff;padding:34px;border-radius:20px;box-shadow:0 18px 50px rgba(185,99,108,.18);border:1px solid var(--gold-l)}
.rsvp-form input,.rsvp-form select,.rsvp-form textarea{width:100%;padding:14px 16px;border:1px solid #ecd9d4;border-radius:12px;margin-bottom:16px;font-family:var(--sans);background:var(--ivory);font-size:.95rem;color:var(--ink)}
.rsvp-form input:focus,.rsvp-form select:focus,.rsvp-form textarea:focus{outline:none;border-color:var(--rose)}
.rsvp-form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-note{text-align:center;margin:14px 0 0;color:var(--rose-d);min-height:1.2em}

.foot{padding:60px 16px 100px;background:linear-gradient(180deg,#fdeeea,var(--blush-d));}
.foot-names{font-size:3.4rem;color:var(--rose-d)}
.small-muted{color:var(--muted);font-size:.8rem;letter-spacing:.15em}

.fab{position:fixed;right:14px;bottom:18px;z-index:800;display:flex;flex-direction:column;gap:10px;opacity:0;pointer-events:none;transition:opacity .6s}
body.ready .fab{opacity:1;pointer-events:auto}
.fab button{width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:var(--rose-d);font-size:1.15rem;box-shadow:0 6px 18px rgba(0,0,0,.2);cursor:pointer;transition:.3s}
.fab button:hover{transform:scale(1.1);background:var(--rose);color:#fff}
.fab button.on{background:var(--rose);color:#fff;animation:spin 3s linear infinite}
@keyframes spin{to{box-shadow:0 0 0 8px rgba(212,134,142,.25)}}

@media(max-width:767px){
  .section-pad{padding:64px 0}
  .gallery{columns:2;column-gap:10px}
  .rsvp-form{padding:22px}
  .rsvp-form .two{grid-template-columns:1fr}
  .map-wrap iframe{height:300px}
  .lead-text{font-size:1.2rem}
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

@media(max-width:480px){
  .env{height:calc(var(--w)*.78)}
  .env-card{top:5%;bottom:5%}
  .card-inner{padding:14px 6px}
  .card-small{font-size:.72rem}
}

/* ===== Our Story (WedLock-style) ===== */
.timeline{position:relative;max-width:1100px;margin:auto}
.timeline:after{content:"";position:absolute;left:50%;top:0;width:2px;height:100%;background:rgba(201,161,91,.35);transform:translateX(-50%)}
.story-row{display:flex;align-items:center;padding:3rem 0;position:relative;z-index:1}
.story-row.img-right{flex-direction:row-reverse}
.s-col{flex:1;min-width:0}
.s-img{padding:0 45px 0 0}
.story-row.img-right .s-img{padding:0 0 0 45px}
.s-text{position:relative;padding:45px 0 0 45px;border-top:1px solid rgba(201,161,91,.3)}
.story-row.img-right .s-text{padding:45px 45px 0 0;text-align:right}
.img-holder{max-height:350px;overflow:hidden;position:relative;box-shadow:0 14px 34px rgba(0,0,0,.14)}
.img-holder img{width:100%;display:block;transition:.3s ease-in}
.img-holder:before{content:"";position:absolute;left:4%;top:3%;width:92%;height:94%;border:1px solid #fff;z-index:1;pointer-events:none}
.img-holder:hover img{transform:scale(1.2) rotate(5deg)}
.s-text .heart{position:absolute;left:-25px;top:-25px;width:50px;height:50px;line-height:46px;text-align:center;border-radius:50%;border:2px solid var(--rose);background:var(--blush);color:var(--rose-d);font-size:1.2rem}
.story-row.img-right .s-text .heart{left:auto;right:-25px}
.story-text h3{font-family:var(--script);font-weight:400;font-size:2.8rem;color:var(--rose-d);margin:0 0 .2rem}
.story-text .date{color:var(--gold);letter-spacing:.25em;font-size:.72rem;text-transform:uppercase;font-weight:500}
.story-text p{font-family:var(--serif);font-size:1.25rem;color:var(--muted);line-height:1.6;margin-top:.6rem}
[data-anim]{opacity:0}
[data-anim].in{animation-duration:1.5s;animation-fill-mode:both;animation-timing-function:ease-out;opacity:1}
[data-anim="slideL"].in{animation-name:slideInLeftS}
[data-anim="slideR"].in{animation-name:slideInRightS}
@keyframes slideInLeftS{from{opacity:0;transform:translate3d(-100%,0,0)}to{opacity:1;transform:none}}
@keyframes slideInRightS{from{opacity:0;transform:translate3d(100%,0,0)}to{opacity:1;transform:none}}
.story-row{overflow:hidden}
@media(max-width:767px){
  .timeline:after,.s-text .heart{display:none}
  .story-row,.story-row.img-right{flex-direction:column;padding:2rem 0;gap:1rem}
  .s-img,.story-row.img-right .s-img{padding:0;width:100%}
  .s-text,.story-row.img-right .s-text{padding:24px 0 0;text-align:center}
}
@media(min-width:992px){.mobile-menu{display:none}}




/* photo revealed behind the opening flaps, then melts into the sage background */
.inv-bg{position:absolute;inset:-4%;background:url(../img/intro-bg.jpg) center/cover;transform:scale(1.15);opacity:1;transition:opacity 1.2s ease,transform 5s ease-out}
.inv-bg::after{content:"";position:absolute;inset:0;background:rgba(40,35,20,.15)}
#intro.open .inv-bg{transform:scale(1)}
#intro.settle .inv-bg{opacity:0}
/* card: grows in softly, floats gently (never looks frozen), then zooms toward you */
.inv-wrap{transform:translateY(30px) scale(.6);transition:opacity 1s .5s,transform 1.4s .5s cubic-bezier(.2,.9,.3,1)}
#intro.open .inv-wrap{opacity:1;transform:none}
#intro.open:not(.zoom) .inv-card{animation:cardFloat 3.2s 2s ease-in-out infinite}
@keyframes cardFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.ic-btn{animation:btnGlow 2s 2s ease-in-out infinite}
@keyframes btnGlow{0%,100%{box-shadow:0 6px 18px rgba(0,0,0,.2)}50%{box-shadow:0 6px 18px rgba(0,0,0,.2),0 0 0 8px rgba(181,151,90,.22)}}
#intro.zoom .inv-wrap{opacity:0;transform:scale(1.45);transition:opacity .9s .15s ease-in,transform 1.1s cubic-bezier(.55,0,.25,1)}
#intro.zoom .inv-card,#intro.zoom .ic-btn{animation:none}

/* ================= SMOOTHNESS PASS ================= */
:root{--ease:cubic-bezier(.22,.61,.36,1)}
[data-wow]{transition:opacity 1.1s var(--ease),transform 1.1s var(--ease);will-change:opacity,transform}
[data-wow].in{will-change:auto}
.reveal{will-change:opacity,transform}
.fw,.inv-wrap,.seal,.inv-card{will-change:transform}
.fw{transform:translateZ(0)}
.gallery a,.event,.person-img{transform:translateZ(0)}
.img-holder img{transition:transform .8s var(--ease)}
[data-anim]{will-change:transform,opacity}
[data-anim].in{animation-duration:1.4s;animation-timing-function:var(--ease);will-change:auto}
@keyframes fadeUpS{from{opacity:0;transform:translate3d(0,46px,0)}to{opacity:1;transform:none}}
@keyframes zoomInS{from{opacity:0;transform:scale(1.12)}to{opacity:1;transform:none}}

/* ===== Our Story on phones: no sideways slide (causes jump/overflow) – smooth rise + soft zoom instead ===== */
@media(max-width:767px){
  .img-holder{max-height:none;aspect-ratio:4/3}
  .img-holder img{height:100%;object-fit:cover}
  .img-holder:hover img{transform:none}
  .fw{filter:drop-shadow(0 0 3px rgba(70,70,40,.25))}
}
@media(hover:none){.gallery a:hover img,.img-holder:hover img{transform:none}}

/* Our story on phones: same slide-in animation as PC (sideways clipped inside each row so the page never scrolls sideways) */
@media(max-width:767px){
  .story-row{overflow:hidden}
  [data-anim="slideL"].in{animation-name:slideInLeftS;animation-duration:1.3s}
  [data-anim="slideR"].in{animation-name:slideInRightS;animation-duration:1.3s}
  .s-text .story-text[data-anim].in{animation-delay:.25s}
}

/* replay support: elements re-entering while scrolling up come down from above */
[data-wow].up{transform:translate3d(0,-40px,0)}
[data-anim]:not(.in){animation:none}

/* intro card extras */
.ic-event{font-size:clamp(2.2rem,9vw,3.4rem);color:#8c4a54;margin:.1rem 0 .3rem;line-height:1}
.ic-top{line-height:1.7}

[hidden]{display:none!important}

/* ===== Hero: sage colour background (same as the opening) instead of photo ===== */
.hero{background:linear-gradient(180deg,#f8e1dd,#fdeeea);color:var(--ink)}
.hero-swiper,.hero-overlay{display:none}
.hero .eyebrow{color:var(--gold)}
.hero h1{color:var(--rose-d);text-shadow:none}
.hero h1 em{color:var(--gold)}
.hero-date{color:#6b5a52}
.countdown div{background:rgba(255,255,255,.7);border-color:rgba(201,161,91,.45);color:var(--ink);backdrop-filter:none}
.countdown span{opacity:.75}
.hero .btn-ghost{border-color:var(--rose-d);color:var(--rose-d);background:transparent;backdrop-filter:none}
.hero .btn-ghost:hover{background:var(--rose-d);color:#fff}
.scroll-down{border-color:rgba(185,99,108,.7)}
.scroll-down span{background:var(--rose-d)}
.topbar:not(.scrolled){color:var(--ink)}

section[id]{scroll-margin-top:56px}