:root{
  --ink:#171321;
  --ink-2:#282238;
  --lilac:#9c86cf;
  --lilac-soft:#d5c8ef;
  --blue:#8ac5e2;
  --ivory:#fffaf4;
  --paper:#f7f1ed;
  --taxi:#ffd95c;
  --muted:#766e80;
  --line:rgba(37,29,53,.14);
  --serif:"Bodoni MT",Didot,"Baskerville",Georgia,serif;
  --script:"Allison","Kunstler Script","French Script MT","Snell Roundhand",cursive;
  --sans:Inter,"Avenir Next","Segoe UI",Arial,sans-serif;
  --gutter:clamp(1.25rem,5vw,4rem);
  --content:72rem;
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;min-width:0;overflow-x:hidden;background:var(--ivory);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.6}
body.invitation-locked{height:100svh;overflow:hidden}
body::before{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.035;background-image:repeating-radial-gradient(circle at 30% 20%,#181220 0 1px,transparent 1px 4px);mix-blend-mode:multiply}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{color:inherit}
::selection{background:var(--lilac-soft);color:var(--ink)}
:focus-visible{outline:3px solid var(--taxi);outline-offset:4px}
.skip-link{position:fixed;top:1rem;left:1rem;z-index:20000;padding:.7rem 1rem;background:#fff;color:#000;transform:translateY(-180%);transition:transform .2s}
.skip-link:focus{transform:none}

.page-transition{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;pointer-events:none;background:linear-gradient(145deg,#171321 0 48%,#2b2140 48% 52%,#8ac5e2 52% 53%,#171321 53%);color:#fff;clip-path:inset(0 0 100% 0)}
.page-transition span{display:grid;place-items:center;width:5.5rem;aspect-ratio:1;overflow:hidden;border:1px solid rgba(255,255,255,.55);border-radius:50%;box-shadow:0 0 0 .55rem rgba(255,255,255,.035);opacity:0}
.page-transition span img{width:76%;height:76%;object-fit:contain;filter:drop-shadow(0 0 .7rem rgba(213,190,255,.42))}
.transition-active .page-transition{animation:curtainSweep 1.9s cubic-bezier(.76,0,.24,1) both}
.transition-active .page-transition span{animation:transitionMark 1.9s ease both}
.scroll-progress{position:fixed;z-index:9000;left:0;top:0;width:100%;height:3px;pointer-events:none;background:linear-gradient(90deg,var(--lilac),var(--blue),var(--taxi));transform:scaleX(var(--scroll-progress,0));transform-origin:left center;box-shadow:0 0 .8rem rgba(168,216,241,.42)}

.opening{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;min-height:100svh;padding:calc(1.25rem + env(safe-area-inset-top)) var(--gutter) calc(1.25rem + env(safe-area-inset-bottom));overflow:hidden;background:var(--ink);color:#fff;isolation:isolate;transition:opacity .8s ease,visibility .8s ease}
.opening.is-open{opacity:0;visibility:hidden;pointer-events:none}
.opening__photo{position:absolute;inset:-4%;z-index:-3;background:url("images/brooklyn-bridge-night.webp") 58% 50%/cover no-repeat;filter:saturate(.75) hue-rotate(8deg);animation:slowZoom 22s ease-in-out infinite alternate}
.opening__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,10,21,.48),rgba(20,15,30,.77)),linear-gradient(110deg,rgba(123,97,184,.3),transparent 50%,rgba(72,154,197,.22))}
.city-glow{position:absolute;z-index:-1;border-radius:50%;filter:blur(30px);opacity:.65;animation:glow 5s ease-in-out infinite alternate}
.city-glow--one{top:8%;left:4%;width:8rem;height:8rem;background:rgba(184,158,245,.3)}
.city-glow--two{right:3%;bottom:14%;width:10rem;height:10rem;background:rgba(97,186,226,.22);animation-delay:-2s}
.opening__content{width:min(32rem,100%);text-align:center;position:relative}
.opening__route,.opening__eyebrow,.envelope,.opening__name,.opening__copy,.opening .button{animation:openingRise .85s cubic-bezier(.2,.75,.2,1) both}
.opening__eyebrow{animation-delay:.08s}.envelope{animation-delay:.16s}.opening__name{animation-delay:.26s}.opening__copy{animation-delay:.34s}.opening .button{animation-delay:.42s}
.opening__route{display:flex;align-items:center;justify-content:center;gap:.75rem;margin:0 0 .6rem;font-size:.65rem;font-weight:700;letter-spacing:.3em}
.opening__route i{width:4rem;height:1px;background:rgba(255,255,255,.45);position:relative}
.opening__route i::after{content:"";position:absolute;right:0;top:-2px;border-left:5px solid rgba(255,255,255,.65);border-top:2px solid transparent;border-bottom:2px solid transparent}
.opening__eyebrow{margin:0 0 1.5rem;color:rgba(255,255,255,.7);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase}
.opening__name{margin:.75rem 0 -.35rem;font-family:var(--script);font-size:clamp(4.7rem,20vw,7.4rem);font-weight:400;line-height:.82;letter-spacing:.01em}
.opening__copy{margin:0 0 1.2rem;color:rgba(255,255,255,.68);font-family:var(--serif);font-size:1rem;font-style:italic;letter-spacing:.06em}
.envelope{position:relative;width:min(20rem,82vw);aspect-ratio:1.45;margin:0 auto;perspective:1000px;filter:drop-shadow(0 2rem 2.4rem rgba(3,2,8,.44))}
.envelope__back{position:absolute;inset:0;border-radius:.25rem;background:linear-gradient(145deg,#e8deef,#b7d4e6)}
.envelope__letter{position:absolute;z-index:1;left:7%;right:7%;top:5%;height:82%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(90,76,119,.16);background:linear-gradient(145deg,#fff,#f0e8f3);color:var(--ink);transition:transform 1.05s cubic-bezier(.2,.75,.1,1);box-shadow:0 .4rem 1.5rem rgba(30,20,50,.15)}
.envelope__letter::before,.envelope__letter::after{content:"";position:absolute;inset:.55rem;border:1px solid rgba(123,97,184,.22)}
.envelope__letter::after{inset:.85rem;border-color:rgba(95,165,210,.18)}
.envelope__letter span{position:relative;z-index:1;font-size:.6rem;letter-spacing:.25em;text-transform:uppercase}
.envelope__letter strong{position:relative;z-index:1;margin:.2rem 0;font-family:var(--serif);font-size:2.1rem;font-style:italic;font-weight:500}
.envelope__letter small{position:relative;z-index:1;font-size:.58rem;letter-spacing:.25em}
.envelope__pocket{position:absolute;inset:0;z-index:2;border-radius:.25rem;background:linear-gradient(145deg,#c8b9e3,#a6cde2);clip-path:polygon(0 32%,50% 72%,100% 32%,100% 100%,0 100%)}
.envelope__pocket::after{content:"";position:absolute;inset:0;background:linear-gradient(35deg,rgba(255,255,255,.2),transparent 60%)}
.envelope__flap{position:absolute;inset:0;z-index:4;clip-path:polygon(0 0,100% 0,50% 62%);background:linear-gradient(160deg,#e9def1,#bbd9ea);transform-origin:50% 0;backface-visibility:hidden;transition:transform .95s cubic-bezier(.2,.7,.2,1)}
.wax-seal{position:absolute;z-index:5;left:50%;top:49%;display:grid;place-items:center;width:4.4rem;aspect-ratio:1;overflow:hidden;border:.28rem double rgba(233,222,255,.62);border-radius:50%;background:radial-gradient(circle at 35% 28%,#725895,#2e223f 74%);box-shadow:0 .7rem 1.5rem rgba(29,19,51,.42),0 0 1.15rem rgba(198,170,244,.2),inset 0 0 0 .15rem rgba(255,255,255,.1);transform:translate(-50%,-50%);transition:opacity .35s,transform .45s}
.wax-seal img{width:78%;height:78%;object-fit:contain;filter:drop-shadow(0 .08rem .18rem rgba(42,27,70,.4))}
.opening.is-opening .envelope__flap{z-index:0;transform:rotateX(180deg)}
.opening.is-opening .wax-seal{opacity:0;transform:translate(-50%,-70%) scale(.6)}
.opening.is-opening .envelope__letter{transform:translateY(-52%);transition-delay:.48s}

.button{position:relative;min-height:3.35rem;display:inline-flex;align-items:center;justify-content:center;gap:.75rem;padding:.85rem 1.45rem;overflow:hidden;border:1px solid transparent;border-radius:100vmax;cursor:pointer;font-size:.7rem;font-weight:750;letter-spacing:.14em;text-transform:uppercase;transition:transform .25s,background .25s,border-color .25s,color .25s}
.button::after{content:"";position:absolute;inset:-100% -40%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.38) 50%,transparent 58%);transform:translateX(-65%);transition:transform .65s ease}
.button:hover::after{transform:translateX(65%)}
.button>span,.button>svg{position:relative;z-index:1}
.button:hover{transform:translateY(-2px)}
.button svg{width:1.15rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.button--light{border-color:rgba(255,255,255,.38);background:rgba(255,255,255,.12);color:#fff;backdrop-filter:blur(12px)}
.button--light:hover{background:#fff;color:var(--ink)}
.button--ink{background:var(--ink);color:#fff}
.button--accent{border-color:rgba(255,255,255,.16);background:var(--taxi);color:var(--ink)}

.hero{position:relative;min-height:100svh;display:grid;place-items:end center;overflow:hidden;padding:calc(5rem + env(safe-area-inset-top)) var(--gutter) calc(4.5rem + env(safe-area-inset-bottom));background:var(--ink);color:#fff;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;background-image:radial-gradient(circle at 12% 28%,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 77% 17%,#d9ccf4 0 1px,transparent 1.8px),radial-gradient(circle at 88% 49%,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 34% 13%,#a8d8f1 0 1px,transparent 1.8px);animation:twinkle 4.6s ease-in-out infinite alternate}
.hero__photo{position:absolute;inset:-6%;z-index:-3;background:url("images/brooklyn-bridge-night.webp") 60% center/cover no-repeat;filter:saturate(.72) hue-rotate(8deg);will-change:transform;transform:translate3d(0,var(--parallax-y,0),0) scale(1.08)}
.hero__wash{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(13,10,21,.28),rgba(13,10,21,.43) 42%,rgba(13,10,21,.9)),radial-gradient(circle at 60% 30%,rgba(137,112,193,.2),transparent 42%)}
.hero__wash::after{content:"";position:absolute;inset:-30% -65%;background:linear-gradient(110deg,transparent 42%,rgba(200,226,244,.08) 49%,rgba(255,255,255,.15) 50%,rgba(202,183,238,.07) 52%,transparent 59%);transform:translateX(-32%);animation:lightSweep 9s ease-in-out infinite}
.skyline-line{position:absolute;inset:auto 0 0;z-index:-1;height:9rem;opacity:.45;background:linear-gradient(180deg,transparent,rgba(11,9,17,.86)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 160'%3E%3Cpath fill='%23100d19' d='M0 160V115h38V68h34v47h23V87h35v28h27V35h31v80h42V59h28v56h34V15h37v100h25V73h32v42h39V44h31v71h29V8h42v107h34V64h28v51h40V25h30v90h28V52h44v63h25V39h31v76h46V9h36v106h28V61h33v54h37v-8h34v53H0Z'/%3E%3C/svg%3E") center bottom/cover no-repeat}
.hero__content{width:min(44rem,100%);text-align:center}
.route-badge{width:min(18rem,78vw);display:flex;align-items:center;justify-content:space-between;margin:0 auto 1.5rem;padding:.55rem .85rem;border:1px solid rgba(255,255,255,.24);border-radius:.25rem;background:rgba(17,13,27,.24);backdrop-filter:blur(8px);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase}
.route-badge b{position:relative;padding:.25rem .45rem;background:var(--taxi);color:var(--ink);box-shadow:0 0 1.2rem rgba(255,217,92,.22)}
.route-badge b::before{content:"";position:absolute;left:-.62rem;top:50%;width:.32rem;aspect-ratio:1;border-radius:50%;background:var(--taxi);transform:translateY(-50%);box-shadow:0 0 .75rem var(--taxi)}
.hero__kicker{margin:0;font-size:.65rem;letter-spacing:.29em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.hero__name{position:relative;margin:.15rem auto -1.15rem;width:fit-content;max-width:100%;padding-inline:.15em;font-family:var(--script);font-size:clamp(7.2rem,29vw,13rem);font-weight:400;line-height:.76;letter-spacing:.005em;text-shadow:0 1rem 2.5rem rgba(0,0,0,.25)}
.hero__name::after{content:"";position:absolute;left:13%;right:4%;bottom:.04em;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.72) 16% 82%,transparent);transform:scaleX(0);transform-origin:left;animation:signatureStroke 1.4s cubic-bezier(.2,.8,.2,1) forwards 1.25s}
.hero__fifteen{margin:0;font-family:var(--serif);font-size:clamp(1.2rem,4vw,1.8rem);font-style:italic;letter-spacing:.1em}
.hero__rule{display:flex;align-items:center;gap:.8rem;width:min(19rem,75vw);margin:1.2rem auto}
.hero__rule::before,.hero__rule::after{content:"";height:1px;flex:1;background:rgba(255,255,255,.34)}
.hero__rule span{display:grid;place-items:center;width:2.35rem;aspect-ratio:1;overflow:hidden;border:1px solid rgba(255,255,255,.5);border-radius:50%}
.hero__rule span img{width:76%;height:76%;object-fit:contain;filter:drop-shadow(0 0 .2rem rgba(213,190,255,.35))}
.hero__date{display:flex;align-items:center;justify-content:center;gap:1rem;margin:.5rem 0;font-family:var(--serif)}
.hero__date span{font-size:clamp(2rem,7vw,3.6rem);line-height:1}
.hero__date i{font-size:1.1rem;font-weight:400}
.hero__venue{margin:.7rem 0 2.8rem;color:rgba(255,255,255,.78);font-size:.67rem;letter-spacing:.19em;text-transform:uppercase}
.hero__scroll{display:inline-flex;flex-direction:column;align-items:center;gap:.55rem;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.hero__scroll i{display:block;width:1px;height:2.25rem;background:linear-gradient(#fff,transparent);animation:scrollLine 1.8s ease-in-out infinite}

.city-marquee{position:relative;z-index:5;overflow:hidden;border-top:3px solid var(--taxi);border-bottom:1px solid rgba(255,255,255,.12);background:#0d0a13;color:#fff}
.city-marquee__track{width:max-content;display:flex;align-items:center;gap:1.7rem;min-height:3.65rem;padding-inline:1rem;font-family:var(--serif);font-size:.74rem;font-style:italic;letter-spacing:.08em;animation:marquee 26s linear infinite}
.city-marquee__track span{display:flex;align-items:center;gap:.6rem;white-space:nowrap}
.city-marquee__track b{display:grid;place-items:center;width:1.7rem;aspect-ratio:1;border-radius:50%;background:var(--lilac);color:#fff;font-family:var(--sans);font-size:.56rem;font-style:normal;letter-spacing:0;box-shadow:0 0 0 .18rem rgba(156,134,207,.18)}
.city-marquee__track i{color:var(--taxi);font-style:normal}

.section{position:relative;padding:clamp(5rem,11vw,9rem) var(--gutter);overflow:hidden}
.section::before{content:"";position:absolute;z-index:2;left:50%;top:0;width:min(8rem,30vw);height:1px;background:linear-gradient(90deg,transparent,var(--lilac),transparent);transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform 1.2s ease .15s}
.section:has(.is-visible)::before{transform:translateX(-50%) scaleX(1)}
.section__inner{position:relative;z-index:1;width:min(var(--content),100%);margin:auto}
.section__inner--narrow{max-width:50rem}
.section-heading{max-width:43rem;margin:0 auto 3.5rem;text-align:center}
.section-heading::after{content:"";display:block;width:4.2rem;height:.6rem;margin:1.7rem auto 0;background:linear-gradient(90deg,transparent 0 40%,var(--lilac) 40% 47%,transparent 47% 53%,var(--lilac) 53% 60%,transparent 60%);transform:skewX(-22deg);opacity:.6}
.section-heading>p:last-child{max-width:35rem;margin:1.2rem auto 0;color:var(--muted)}
.eyebrow{margin:0 0 1rem;color:#755eaa;font-size:.64rem;font-weight:750;letter-spacing:.27em;text-transform:uppercase}
.eyebrow--light{color:var(--lilac-soft)}
.display-title{margin:0;font-family:var(--serif);font-size:clamp(3rem,10vw,6.6rem);font-weight:500;line-height:.86;letter-spacing:-.035em}
.display-title em{color:#8069b3;font-weight:400}
.is-visible .display-title em{background:linear-gradient(100deg,#8069b3 25%,#bda9e5 48%,#8069b3 72%);background-size:220% auto;background-clip:text;-webkit-background-clip:text;color:transparent;animation:titleSheen 3.8s ease 1 .35s}
.display-title--light{color:#fff}
.display-title--light em{color:#cab9ee}
.lead{max-width:39rem;margin:2rem auto 0;color:var(--muted);font-family:var(--serif);font-size:clamp(1.25rem,4vw,1.7rem);line-height:1.6}

.intro{background:radial-gradient(circle at 10% 15%,rgba(199,183,238,.35),transparent 24%),radial-gradient(circle at 90% 80%,rgba(168,216,241,.35),transparent 23%),var(--ivory);text-align:center}
.intro::after{content:"";position:absolute;right:-2rem;top:2rem;width:10rem;height:10rem;border:1px solid rgba(123,97,184,.14);transform:rotate(45deg)}
.monogram{display:grid;place-items:center;width:5.8rem;aspect-ratio:1;margin:2.4rem auto 1.4rem;overflow:hidden;border:1px solid rgba(123,97,184,.3);border-radius:50%;box-shadow:inset 0 0 0 .45rem var(--ivory),inset 0 0 0 .5rem rgba(123,97,184,.15),0 .8rem 2.4rem rgba(77,58,113,.1);background:linear-gradient(135deg,rgba(213,200,239,.65),rgba(168,216,241,.4));color:#725b9f}
.monogram img{width:78%;height:78%;object-fit:contain;filter:drop-shadow(0 .1rem .22rem rgba(77,58,113,.24))}
.parents-copy{margin:0;color:var(--muted);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase}
.parents{margin:1rem 0;font-family:var(--serif);font-size:clamp(1.65rem,5vw,2.5rem);font-style:italic;line-height:1.25}
.parents span{color:#9179bc;font-size:1.2rem}
.invitation-line{display:inline-block;margin:1rem 0 0;padding-top:1.1rem;border-top:1px solid var(--line);font-family:var(--serif);font-size:1.05rem;font-style:italic;color:var(--muted)}

.editorial-photo{position:relative;min-height:min(90svh,52rem);display:grid;place-items:end start;overflow:hidden;margin:0;background:var(--ink);color:#fff;isolation:isolate}
.editorial-photo__image{position:absolute;inset:-8%;z-index:-3;background:url("images/brooklyn-bridge-night.webp") 55% center/cover no-repeat;filter:saturate(.65) hue-rotate(5deg);transform:translate3d(0,var(--parallax-y,0),0) scale(1.12)}
.editorial-photo__overlay{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(14,11,22,.9),rgba(14,11,22,.15) 70%),linear-gradient(0deg,rgba(14,11,22,.65),transparent 55%)}
.editorial-photo__copy{width:min(42rem,100%);padding:clamp(3rem,10vw,7rem) var(--gutter)}
.editorial-photo__copy h2{margin:.4rem 0;font-family:var(--serif);font-size:clamp(4rem,15vw,8rem);font-weight:500;line-height:.82}
.editorial-photo__copy>p:last-child{max-width:27rem;color:rgba(255,255,255,.72);font-family:var(--serif);font-size:1.2rem;font-style:italic}
.vertical-note{position:absolute;right:.65rem;top:50%;font-size:.52rem;letter-spacing:.22em;writing-mode:vertical-rl;color:rgba(255,255,255,.55);transform:translateY(-50%)}

.countdown{background:linear-gradient(145deg,#f9f5ef,#efe7f4)}
.countdown .section__inner{text-align:center}
.countdown__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;max-width:48rem;margin:3rem auto 0}
.countdown__grid div{position:relative;padding:1.25rem .25rem;background:rgba(255,255,255,.55);border:1px solid rgba(82,66,111,.12)}
.countdown__grid div::after{content:"";position:absolute;inset:.3rem;border:1px solid rgba(82,66,111,.07);pointer-events:none}
.countdown__grid strong{display:block;font-family:var(--serif);font-size:clamp(2rem,8vw,4.7rem);font-weight:500;line-height:1}
.countdown__grid strong.is-ticking{animation:numberTick .5s cubic-bezier(.2,.75,.2,1)}
.countdown__grid span{display:block;margin-top:.6rem;color:var(--muted);font-size:.52rem;letter-spacing:.14em;text-transform:uppercase}
.countdown__date{margin:2rem 0 0;color:#715d93;font-family:var(--serif);font-size:1.2rem;font-style:italic}

.section--ink{background:var(--ink);color:#fff}
.program__lights{position:absolute;inset:0;background:radial-gradient(circle at 15% 15%,rgba(139,106,201,.23),transparent 25%),radial-gradient(circle at 85% 75%,rgba(82,166,208,.17),transparent 26%)}
.program__lights::before{content:"";position:absolute;inset:0;opacity:.24;background-image:radial-gradient(circle,#ffd95c 0 1px,transparent 2px);background-size:53px 53px;mask-image:linear-gradient(90deg,transparent,#000,transparent)}
.program .section-heading>p:last-child,.rsvp .section-heading>p:last-child{color:rgba(255,255,255,.6)}
.program__list{position:relative;max-width:55rem;margin:auto;padding:0;list-style:none}
.program__list::before{content:"";position:absolute;left:5.08rem;top:2rem;bottom:2rem;width:1px;background:linear-gradient(transparent,rgba(199,183,238,.32) 10% 90%,transparent)}
.program__item{position:relative;display:grid;grid-template-columns:3.1rem 4.3rem 1fr;gap:1rem;align-items:center;padding:1.35rem 0;border-top:1px solid rgba(255,255,255,.13)}
.program__item:last-child{border-bottom:1px solid rgba(255,255,255,.13)}
.program__number{color:rgba(255,255,255,.3);font-family:var(--serif);font-size:1.2rem;font-style:italic}
.program__icon{position:relative;z-index:1;display:grid;place-items:center;width:4rem;aspect-ratio:1;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.17),rgba(166,140,216,.11) 58%,rgba(255,255,255,.03));color:#eee7ff;box-shadow:0 0 0 .38rem rgba(255,255,255,.025),0 .65rem 1.5rem rgba(0,0,0,.22);transition:transform .35s,box-shadow .35s,color .35s}
.program__icon::before{content:"";position:absolute;inset:-.38rem;border:1px dashed rgba(199,183,238,.2);border-radius:50%;animation:iconOrbit 16s linear infinite}
.program__icon::after{content:"";position:absolute;inset:.32rem;border:1px solid rgba(255,255,255,.1);border-radius:50%;box-shadow:inset 0 0 1.2rem rgba(168,216,241,.06);pointer-events:none}
.program__icon svg{position:relative;z-index:1;width:2.15rem;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.program__item:nth-child(2) .program__icon,.program__item:nth-child(4) .program__icon{color:#a8d8f1}
.program__item:nth-child(4) .program__icon{box-shadow:0 0 0 .38rem rgba(255,255,255,.025),0 0 1.6rem rgba(255,217,92,.12)}
.program__item:hover .program__icon{color:var(--taxi);transform:translateY(-.2rem) rotate(-3deg);box-shadow:0 0 0 .38rem rgba(255,217,92,.06),0 1rem 2rem rgba(0,0,0,.28)}
.program__item.is-visible .program__icon svg{animation:iconArrival .75s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--reveal-delay,0ms) + 180ms)}
.program__item time{color:var(--taxi);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase}
.program__item h3{margin:.05rem 0;font-family:var(--serif);font-size:clamp(1.8rem,5vw,2.8rem);font-weight:500;line-height:1.1}
.program__item p{margin:0;color:rgba(255,255,255,.55);font-family:var(--serif);font-style:italic}

.dress{background:radial-gradient(circle at 100% 0,rgba(168,216,241,.42),transparent 30%),var(--ivory)}
.dress__card{position:relative;display:grid;grid-template-columns:minmax(8rem,16rem) 1fr;align-items:center;gap:clamp(1.5rem,5vw,4rem);max-width:49rem;margin:auto;padding:clamp(1.4rem,4vw,2.5rem);border:1px solid var(--line);background:rgba(255,255,255,.62);box-shadow:0 1.5rem 4rem rgba(52,43,70,.08)}
.dress__card::before,.dress__card::after{content:"";position:absolute;width:2.8rem;height:2.8rem;border-color:rgba(123,97,184,.34);pointer-events:none}
.dress__card::before{left:.65rem;top:.65rem;border-left:1px solid rgba(123,97,184,.34);border-top:1px solid rgba(123,97,184,.34)}
.dress__card::after{right:.65rem;bottom:.65rem;border-right:1px solid rgba(123,97,184,.34);border-bottom:1px solid rgba(123,97,184,.34)}
.dress__art{position:relative;display:grid;place-items:center;min-height:20rem;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 50% 34%,rgba(213,200,239,.24),transparent 32%),linear-gradient(160deg,#171321,#51416f 58%,#24384e);color:#f3ebff}
.dress__art::before{content:"";position:absolute;inset:1rem;border:1px solid rgba(255,255,255,.13);clip-path:polygon(0 0,36% 0,50% 10%,64% 0,100% 0,100% 100%,64% 100%,50% 90%,36% 100%,0 100%)}
.dress__art::after{content:"";position:absolute;z-index:-1;left:50%;bottom:-5rem;width:17rem;aspect-ratio:1;border:1px solid rgba(168,216,241,.14);border-radius:50%;transform:translateX(-50%);box-shadow:0 0 4rem rgba(156,134,207,.18)}
.dress__art svg{width:min(15rem,88%);fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 .7rem rgba(213,200,239,.18))}
.dress-icon__sparkles{stroke:#ffd95c;opacity:.85}.dress-icon__suit{stroke:#bfe6f8}.dress-icon__gown{stroke:#f0e8ff}.dress-icon__floor{stroke:#bfa8ec;opacity:.5}
.dress__card.is-visible .dress__art svg path,.dress__card.is-visible .dress__art svg circle{stroke-dasharray:620;stroke-dashoffset:620;animation:lineDraw 2.4s ease forwards .3s}
.dress__card.is-visible .dress__art .dress-icon__suit path{animation-delay:.55s}.dress__card.is-visible .dress__art .dress-icon__sparkles path{animation-delay:1.1s}
.dress__card span{color:var(--muted);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase}
.dress__card strong{display:block;margin:.4rem 0;font-family:var(--serif);font-size:clamp(2.5rem,8vw,4.8rem);font-weight:500;line-height:1}
.dress__card p{margin:0;color:var(--muted);font-family:var(--serif);font-style:italic}
.dress__card .dress__reserved{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line);font-family:var(--sans);font-size:.72rem;font-style:normal;letter-spacing:.08em;text-transform:uppercase}
.dress__reserved b{color:#597ba0;font-weight:800}
.notice{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center;max-width:49rem;margin:1rem auto 0;padding:1.2rem 1.4rem;background:#efe9f7;border-left:3px solid var(--lilac)}
.notice--text{grid-template-columns:1fr;text-align:center}
.notice__icon{display:grid;place-items:center;width:3.1rem;aspect-ratio:1;border:1px solid #8c74b7;border-radius:50%;font-family:var(--serif);font-size:.9rem}
.notice strong{font-family:var(--serif);font-size:1.15rem;font-style:italic}
.notice p{margin:.15rem 0 0;color:var(--muted);font-size:.82rem}

.section--soft{background:linear-gradient(180deg,#f3edf7,#edf5f7)}
.gallery__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(.75rem,2vw,1.25rem)}
.postcard{position:relative;min-height:21rem;margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.78);background:#171321;box-shadow:0 1.2rem 3.2rem rgba(34,25,48,.16),inset 0 0 0 1px rgba(24,19,35,.14);transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.postcard--wide{grid-column:1/-1;min-height:17rem}
.postcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1),filter .5s;filter:saturate(.94) contrast(1.04)}
.postcard:first-child img{object-position:54% 50%}
.postcard:hover{z-index:2;transform:translateY(-.35rem) rotate(.25deg);box-shadow:0 1.8rem 3.6rem rgba(46,36,62,.2)}
.postcard:nth-child(even):hover{transform:translateY(-.35rem) rotate(-.25deg)}
.postcard:hover img{transform:scale(1.045);filter:saturate(1.04) contrast(1.08)}
.js .reveal.motion-card.is-visible{transform:perspective(900px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transition:opacity .8s ease,transform .28s ease,box-shadow .45s ease}
.js .postcard.reveal.motion-card.is-visible:hover{transform:perspective(900px) translateY(-.4rem) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));box-shadow:0 1.8rem 3.6rem rgba(46,36,62,.2)}
.postcard.is-visible::before{animation:frameGlow 3.5s ease-in-out infinite alternate}
.postcard::before{content:"";position:absolute;inset:.58rem;z-index:2;border:1px solid rgba(255,255,255,.3);box-shadow:inset 0 0 2rem rgba(168,216,241,.04);pointer-events:none}
.postcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,9,20,.06) 28%,rgba(12,9,20,.18) 52%,rgba(12,9,20,.94) 100%)}
.postcard figcaption{position:absolute;z-index:3;inset:auto 0 0;padding:1.25rem;color:#fff;text-shadow:0 .15rem .7rem rgba(0,0,0,.45)}
.postcard figcaption span{float:right;display:grid;place-items:center;width:1.65rem;aspect-ratio:1;border:1px solid rgba(255,255,255,.24);border-radius:50%;color:rgba(255,255,255,.72);font-family:var(--serif);font-size:.7rem;font-style:italic}
.postcard figcaption strong{display:block;font-family:var(--serif);font-size:1.35rem;font-weight:500}
.postcard figcaption small{display:block;color:rgba(255,255,255,.58);font-size:.52rem;letter-spacing:.17em;text-transform:uppercase}

.location{min-height:47rem;display:grid;align-items:center;background:#d8e7ed}
.location__map{position:absolute;inset:0;overflow:hidden;background:linear-gradient(145deg,#c8d8de,#eff1ec)}
.location__map::before{content:"";position:absolute;inset:0;opacity:.35;background-image:linear-gradient(30deg,transparent 48%,#8ea2a7 49%,#8ea2a7 50%,transparent 51%),linear-gradient(120deg,transparent 48%,#a7b6b8 49%,#a7b6b8 50%,transparent 51%);background-size:8rem 8rem}
.map-line{position:absolute;height:.45rem;border-radius:100%;background:rgba(255,255,255,.72);box-shadow:0 0 0 1px rgba(70,87,91,.12);transform-origin:left center}
.map-line--one{top:24%;left:-8%;width:90%;transform:rotate(18deg)}
.map-line--two{top:62%;left:10%;width:110%;transform:rotate(-13deg)}
.map-line--three{top:5%;left:62%;width:85%;transform:rotate(74deg)}
.map-dot{position:absolute;width:1rem;aspect-ratio:1;border:.25rem solid #fff;border-radius:50%;background:var(--lilac);box-shadow:0 .4rem 1rem rgba(39,31,54,.22)}
.map-dot--one{top:27%;left:23%}.map-dot--two{right:13%;bottom:24%;background:var(--taxi)}
.location__card{max-width:33rem;margin:auto;padding:clamp(2rem,7vw,4rem);text-align:center;background:rgba(255,250,244,.9);border:1px solid rgba(255,255,255,.8);box-shadow:0 2rem 5rem rgba(40,53,58,.18);backdrop-filter:blur(10px)}
.location__pin{position:relative;display:grid;place-items:center;width:4rem;aspect-ratio:1;margin:0 auto 1.25rem;border-radius:50%;background:var(--ink);color:#fff;box-shadow:0 0 0 .45rem rgba(23,19,33,.07)}
.location__pin::before{content:"";position:absolute;inset:-.7rem;border:1px solid rgba(123,97,184,.25);border-radius:50%;animation:pinPulse 2.8s ease-out infinite}
.location__pin svg{width:2rem;fill:none;stroke:currentColor;stroke-width:1.6}
.location__card h2{margin:0;font-family:var(--serif);font-size:clamp(2.5rem,8vw,4.6rem);font-weight:500;line-height:.9}
.location__card>p:not(.eyebrow,.location__time){margin:1.2rem auto;color:var(--muted);font-family:var(--serif);font-style:italic;line-height:1.7}
.location__time{display:flex;align-items:center;justify-content:center;gap:.8rem;margin:1.4rem 0 1.8rem;padding:.9rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase}
.location__time strong{color:#70599c}

.rsvp{isolation:isolate}
.rsvp__glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 20% 10%,rgba(133,100,190,.25),transparent 28%),radial-gradient(circle at 90% 88%,rgba(85,164,202,.17),transparent 26%)}
.rsvp__form{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-width:45rem;margin:auto;padding:clamp(1.1rem,3vw,2rem);border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.025);box-shadow:inset 0 0 0 .35rem rgba(255,255,255,.018)}
.rsvp__form::before,.rsvp__form::after{content:"";position:absolute;top:50%;width:1.2rem;aspect-ratio:1;border-radius:50%;background:var(--ink);transform:translateY(-50%)}
.rsvp__form::before{left:-.65rem}.rsvp__form::after{right:-.65rem}
.field{display:flex;flex-direction:column;gap:.45rem}
.field--full{grid-column:1/-1}
.field label{color:rgba(255,255,255,.72);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase}
.field label span{float:right;color:rgba(255,255,255,.35)}
.field input,.field select,.field textarea{width:100%;min-height:3.45rem;border:1px solid rgba(255,255,255,.18);border-radius:0;background:rgba(255,255,255,.055);color:#fff;padding:.85rem 1rem;outline:none;transition:border-color .2s,background .2s}
.field textarea{resize:vertical}
.field select{color-scheme:dark}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--lilac-soft);background:rgba(255,255,255,.08)}
.rsvp__form .button{width:100%;margin-top:.35rem}
.form-status{min-height:1.5rem;margin:0;text-align:center;color:var(--taxi);font-family:var(--serif);font-style:italic}
.rsvp__note{max-width:37rem;margin:1.4rem auto 0;text-align:center;color:rgba(255,255,255,.43);font-size:.72rem}

.closing{position:relative;min-height:100svh;display:grid;place-items:center;padding:5rem var(--gutter);overflow:hidden;background:var(--ink);color:#fff;isolation:isolate}
.closing__photo{position:absolute;inset:-7%;z-index:-3;background:url("images/brooklyn-bridge-night.webp") 58% center/cover no-repeat;filter:saturate(.6) hue-rotate(8deg);transform:translate3d(0,var(--parallax-y,0),0) scale(1.12)}
.closing::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(15,11,23,.64),rgba(15,11,23,.82)),radial-gradient(circle at 50% 40%,rgba(139,108,196,.26),transparent 35%)}
.closing__content{text-align:center}
.closing__content h2{position:relative;width:fit-content;max-width:100%;margin:.15rem auto -1.1rem;padding-inline:.18em;font-family:var(--script);font-size:clamp(7.4rem,29vw,13rem);font-weight:400;line-height:.78;letter-spacing:.005em}
.closing__content h2::after{content:"";position:absolute;left:12%;right:3%;bottom:.03em;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7) 16% 82%,transparent);transform:scaleX(0);transform-origin:left}
.closing__content.is-visible h2::after{animation:signatureStroke 1.4s cubic-bezier(.2,.8,.2,1) forwards .55s}
.closing__content>p:not(.eyebrow){font-family:var(--serif);font-size:1.15rem;font-style:italic;color:rgba(255,255,255,.68)}
.closing__date{display:flex;justify-content:center;gap:.6rem;margin-top:2rem;font-family:var(--serif);font-size:1.3rem;letter-spacing:.15em}
.closing__date i{color:var(--taxi)}
.closing__skyline{width:min(26rem,80vw);margin:3rem auto 0;fill:rgba(255,255,255,.24)}
.closing__content.is-visible .closing__skyline{animation:skylineArrival 1.4s cubic-bezier(.2,.8,.2,1) both .35s,skylineGlow 4s ease-in-out infinite alternate 1.8s}

.footer{padding:2rem var(--gutter) calc(2rem + env(safe-area-inset-bottom));text-align:center;background:#0d0a13;color:rgba(255,255,255,.48);font-size:.65rem}
.footer p{margin:.4rem auto;max-width:42rem}
.footer summary{cursor:pointer;color:rgba(255,255,255,.65)}
.floating-actions{position:fixed;z-index:500;right:calc(1rem + env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom));display:flex;align-items:center;gap:.55rem}
.icon-button,.floating-rsvp{height:3rem;border-radius:100vmax;box-shadow:0 .7rem 1.7rem rgba(18,14,27,.2);backdrop-filter:blur(12px)}
.icon-button{display:grid;place-items:center;width:3rem;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.85);color:var(--ink)}
.icon-button:disabled{opacity:.55;cursor:not-allowed}
.icon-button.is-playing{animation:musicPulse 1.8s ease-in-out infinite}
.icon-button.is-playing svg{filter:drop-shadow(0 0 .25rem currentColor)}
@keyframes musicPulse{50%{transform:translateY(-2px) scale(1.06);box-shadow:0 .7rem 2rem rgba(67,174,214,.38)}}
.icon-button svg{width:1.1rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.floating-rsvp{display:flex;align-items:center;padding:0 1.1rem;background:var(--taxi);color:var(--ink);font-size:.62rem;font-weight:800;letter-spacing:.13em}
.floating-rsvp svg{width:1rem;margin-right:.45rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.toast{position:fixed;z-index:20000;left:50%;bottom:calc(5.2rem + env(safe-area-inset-bottom));width:min(27rem,calc(100% - 2rem));padding:.9rem 1rem;transform:translate(-50%,1rem);border:1px solid rgba(255,255,255,.16);background:rgba(23,19,33,.94);color:#fff;text-align:center;font-size:.8rem;opacity:0;visibility:hidden;transition:.25s;box-shadow:0 1rem 2rem rgba(0,0,0,.3)}
.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}

.js .reveal{opacity:0;transform:translateY(2.5rem) scale(.985);transition:opacity .85s ease var(--reveal-delay,0ms),transform .9s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
.js .reveal.is-visible{opacity:1;transform:none}

@keyframes openingRise{from{opacity:0;transform:translateY(1.2rem) scale(.98)}to{opacity:1;transform:none}}
@keyframes curtainSweep{0%{clip-path:inset(0 0 100% 0)}38%,62%{clip-path:inset(0)}100%{clip-path:inset(100% 0 0 0)}}
@keyframes transitionMark{0%,22%,82%,100%{opacity:0;transform:scale(.7) rotate(-8deg)}42%,62%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes slowZoom{from{transform:scale(1)}to{transform:scale(1.08)}}
@keyframes glow{from{opacity:.35;transform:scale(.9)}to{opacity:.7;transform:scale(1.12)}}
@keyframes twinkle{0%{opacity:.22;filter:drop-shadow(0 0 0 transparent)}100%{opacity:.68;filter:drop-shadow(0 0 5px rgba(255,255,255,.7))}}
@keyframes scrollLine{0%{opacity:0;transform:scaleY(.2);transform-origin:top}40%{opacity:1}100%{opacity:0;transform:translateY(1rem);transform-origin:bottom}}
@keyframes lightSweep{0%,15%{transform:translateX(-34%);opacity:0}35%,55%{opacity:1}75%,100%{transform:translateX(34%);opacity:0}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes iconOrbit{to{transform:rotate(360deg)}}
@keyframes iconArrival{0%{opacity:0;transform:scale(.45) rotate(-18deg)}65%{transform:scale(1.12) rotate(4deg)}100%{opacity:1;transform:none}}
@keyframes numberTick{0%{opacity:.2;transform:translateY(-.35rem) scale(.9)}55%{transform:translateY(.08rem) scale(1.06)}100%{opacity:1;transform:none}}
@keyframes titleSheen{from{background-position:180% center}to{background-position:-30% center}}
@keyframes signatureStroke{0%{opacity:0;transform:scaleX(0) translateX(-8%)}35%{opacity:1}100%{opacity:.9;transform:scaleX(1) translateX(0)}}
@keyframes lineDraw{to{stroke-dashoffset:0}}
@keyframes frameGlow{from{border-color:rgba(255,255,255,.2)}to{border-color:rgba(213,200,239,.7)}}
@keyframes pinPulse{0%{opacity:.55;transform:scale(.82)}75%,100%{opacity:0;transform:scale(1.35)}}
@keyframes skylineArrival{from{opacity:0;transform:translateY(2.5rem) scaleX(.8)}to{opacity:1;transform:none}}
@keyframes skylineGlow{from{filter:drop-shadow(0 0 0 rgba(168,216,241,0))}to{filter:drop-shadow(0 -.35rem .75rem rgba(168,216,241,.35))}}

@media (min-width:44rem){
  .opening__eyebrow{margin-bottom:2rem}
  .hero{place-items:center}
  .hero__venue{margin-bottom:2rem}
  .program__item{grid-template-columns:4rem 5.5rem 1fr;padding:1.7rem 1rem}
  .program__list::before{left:7.38rem}
  .program__icon{width:4.8rem}
  .gallery__grid{grid-template-columns:repeat(3,1fr);gap:1rem}
  .postcard{min-height:28rem}
  .postcard--wide{grid-column:span 2;min-height:28rem}
  .postcard--wide:last-child{grid-column:2/4}
  .postcard figcaption{padding:1.4rem}
}

@media (max-width:32rem){
  .opening{padding-left:1rem;padding-right:1rem}
  .envelope{width:min(18rem,84vw)}
  .envelope__letter strong{font-size:1.75rem}
  .hero__name{font-size:clamp(6.3rem,31vw,7.2rem);padding-inline:.08em}
  .closing__content h2{font-size:clamp(6.5rem,31vw,7.4rem);padding-inline:.08em}
  .countdown__grid{gap:.3rem}
  .countdown__grid div{padding:1rem .1rem}
  .countdown__grid span{font-size:.45rem;letter-spacing:.08em}
  .program__item{grid-template-columns:2.2rem 3.6rem 1fr;gap:.7rem}
  .program__list::before{left:4.02rem}
  .program__icon{width:3.4rem}
  .program__item p{font-size:.82rem}
  .dress__card{grid-template-columns:1fr}
  .dress__art{min-height:13rem}
  .gallery__grid{grid-template-columns:1fr}
  .postcard,.postcard--wide{grid-column:auto;min-height:29rem}
  .postcard--wide:first-child{min-height:19rem}
  .rsvp__form{grid-template-columns:1fr}
  .field,.field--full{grid-column:auto}
  .floating-rsvp{padding-inline:.78rem;font-size:.57rem;letter-spacing:.08em}
  .floating-rsvp svg{margin-right:.35rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .parallax-layer{transform:none!important}
  .city-marquee__track{animation:none}
  .js .reveal{opacity:1;transform:none}
}
