:root{--night:#17271F;--forest:#22392C;--cream:#F8F4EA;--paper:#FFFDF6;--honey:#E3C98B;--gold:#C9A66B;--clay:#A5472F}
.serif,.display,h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif}
.amp{font-style:italic;color:var(--gold);font-weight:500}
html{scroll-behavior:auto}
body{background:var(--cream)}
.nav{background:rgba(255,253,246,.86)}
.nav-mark{font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;line-height:28px;font-weight:600}
.btn{border-radius:999px;padding:12px 24px}
.btn.gold{background:var(--honey);color:var(--night)}
.btn.ghost{border-radius:999px}
/* envelope */
.env{position:fixed;inset:0;z-index:90;background:var(--night);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;padding:24px;transition:opacity .9s var(--ease);perspective:1400px}
.env.gone{opacity:0;pointer-events:none}
.env p{color:rgba(248,244,234,.82);font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;line-height:32px;text-align:center;transition:opacity .4s var(--ease)}
.env.open p,.env.open .env-skip{opacity:0}
.envelope{position:relative;width:min(560px,88vw);aspect-ratio:7/5}
.env-back{position:absolute;inset:0;background:#E9DFC8;border-radius:8px}
.env-card{position:absolute;left:5%;right:5%;top:6%;bottom:6%;background:var(--paper);border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:transform 1s var(--ease) .55s}
.env-card b{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(30px,6vw,48px);line-height:1.1;font-weight:500;color:var(--ink)}
.env-card span{color:var(--muted);margin-top:8px}
.env.open .env-card{transform:translateY(-46%)}
.env-front{position:absolute;inset:0;background:#F1E8D4;border-radius:8px;clip-path:polygon(0 0,50% 58%,100% 0,100% 100%,0 100%)}
.env-flap{position:absolute;left:0;right:0;top:0;height:62%;background:#E2D5B8;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .8s var(--ease);z-index:3}
.env.open .env-flap{transform:rotateX(180deg);z-index:0}
.seal{position:absolute;left:50%;top:62%;width:96px;height:96px;margin:-48px 0 0 -48px;border:0;border-radius:50%;background:var(--clay);color:#FBE9DD;cursor:pointer;z-index:4;font-family:'Cormorant Garamond',Georgia,serif;font-size:30px;line-height:36px;font-weight:600;box-shadow:inset 0 0 0 6px rgba(255,255,255,.14),0 8px 24px rgba(0,0,0,.35);transition:transform .4s var(--ease),opacity .3s var(--ease);animation:pulse 2.4s var(--ease) infinite}
.seal:hover{transform:scale(1.06)}
.env.open .seal{opacity:0;transform:scale(.7);animation:none}
@keyframes pulse{50%{transform:scale(1.05)}}
.env-skip{background:none;border:0;color:rgba(248,244,234,.7);cursor:pointer;text-decoration:underline;text-underline-offset:4px;padding:8px;transition:opacity .4s var(--ease)}
/* hero stage */
.stage{height:240vh;background:var(--night)}
.pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--night);color:var(--cream)}
.stars,#petals{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.moon{position:absolute;left:50%;top:50%;width:min(76vh,76vw);height:min(76vh,76vw);margin:calc(min(76vh,76vw)/-2) 0 0 calc(min(76vh,76vw)/-2);border-radius:50%;background:var(--cream);will-change:transform}
.arch{position:absolute;left:50%;bottom:0;height:90%;width:auto;max-width:none;transform-origin:50% 56%;margin-left:calc(-.4327*90vh);will-change:transform,opacity}
.names{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:0 32px;will-change:transform,opacity}
.names span{font-family:'Cormorant Garamond',Georgia,serif;font-size:min(9.2vw,136px);line-height:1;font-weight:500;letter-spacing:-.01em}
.names .a{justify-self:start;padding-left:min(5vw,96px)}
.names .b{justify-self:end;padding-right:min(3vw,48px)}
.vow{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);width:min(320px,74vw);text-align:center;color:var(--ink);will-change:opacity}
.vow .amp{display:block;font-size:96px;line-height:80px}
.vow .date{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;line-height:32px;font-weight:600;margin-top:8px}
.vow .place{color:var(--muted);font-size:14px;line-height:20px}
.vow .count{justify-content:center;margin:16px 0}
.vow .count b{font-family:'Cormorant Garamond',Georgia,serif;font-size:30px;line-height:36px}
.vow .count span{display:block}
.mob-names{display:none}
.cue{position:absolute;left:32px;bottom:32px;font-size:14px;line-height:20px;color:rgba(248,244,234,.75)}
/* tagline */
.tag{padding:96px 32px 128px;background:var(--cream)}
.tag p{max-width:960px;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(48px,7.4vw,104px);line-height:1.04;font-weight:500}
/* story */
.chapters{height:340vh;background:#F1E4CC}
.chap-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.track{display:flex;width:300vw;height:100%;will-change:transform}
.chap{width:100vw;height:100%;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:96px max(32px,calc(50vw - 608px)) 64px;position:relative;overflow:hidden}
.chap:nth-child(1){background:#F1E4CC}.chap:nth-child(2){background:#DDE3CF}.chap:nth-child(3){background:#F3D9CB}
.chap img{width:100%;max-height:70vh;object-fit:contain}
.chap .yr{position:absolute;right:24px;bottom:-32px;font-family:'Cormorant Garamond',Georgia,serif;font-size:min(26vw,320px);line-height:1;font-weight:500;color:rgba(36,51,43,.07);pointer-events:none}
.chap .k{color:var(--clay);font-weight:600;font-size:14px;line-height:20px}
.chap h3{font-size:clamp(48px,6vw,84px);line-height:1;font-weight:500;margin:8px 0 16px}
.chap p{font-size:20px;line-height:32px;max-width:480px}
/* details */
.where{padding:96px 0;background:var(--cream)}
.big{font-size:clamp(48px,7vw,96px);line-height:1;font-weight:500}
.where .big{text-align:center;margin-bottom:16px}
.where .sub,.prog .sub{text-align:center}
.arches{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:960px;margin:48px auto 0}
.archcard{background:var(--forest);color:var(--cream);border-radius:999px 999px 24px 24px;padding:12px}
.archcard>div{border-radius:999px 999px 12px 12px;box-shadow:inset 0 0 0 1px var(--gold);padding:112px 40px 40px;text-align:center;height:100%}
.archcard:nth-child(2){background:var(--clay)}
.archcard .t{font-family:'Cormorant Garamond',Georgia,serif;font-size:60px;line-height:60px;color:var(--honey);font-weight:500}
.archcard .l{font-size:14px;line-height:20px;font-weight:600;margin-bottom:8px;opacity:.85}
.archcard h3{font-size:36px;line-height:40px;font-weight:500;margin-top:16px}
.archcard p{margin-top:12px;opacity:.88}
.archcard .row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:24px}
.archcard .btn{background:var(--paper);color:var(--night)}
.archcard .btn.ghost{background:transparent;color:var(--cream);box-shadow:inset 0 0 0 1px rgba(248,244,234,.5)}
/* day */
.day{background:var(--night);color:var(--cream);padding:96px 0}
.day .big{text-align:center}
.day .sub{text-align:center;color:rgba(248,244,234,.8);margin-top:12px}
.line{position:relative;max-width:960px;margin:64px auto 0;list-style:none}
.line:before,.line .fill{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:rgba(248,244,234,.18)}
.line .fill{background:var(--gold);transform-origin:top;transform:scaleY(0)}
.line .lamp{position:absolute;left:50%;top:0;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:var(--honey);box-shadow:0 0 0 8px rgba(227,201,139,.2),0 0 40px 12px rgba(227,201,139,.4)}
.line li.it{display:grid;grid-template-columns:1fr 1fr;gap:96px;padding:24px 0}
.it .tm{font-family:'Cormorant Garamond',Georgia,serif;font-size:48px;line-height:48px;color:var(--honey);font-weight:500;text-align:right}
.it .ds{font-size:20px;line-height:28px;align-self:center}
.it:nth-child(even) .tm{order:2;text-align:left}
.it:nth-child(even) .ds{order:1;text-align:right}
/* program */
.prog{background:var(--clay);color:#FFF3EA;padding:96px 0;text-align:center}
.prog .big{color:#FFF3EA}
.prog .sub{margin-top:12px;opacity:.85}
.rolls{max-width:880px;margin:64px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:48px 32px}
.roll.full{grid-column:1/-1}
.roll h3{font-family:'Manrope',sans-serif;font-size:14px;line-height:20px;font-weight:600;color:var(--honey);margin-bottom:12px}
.roll p{font-family:'Cormorant Garamond',Georgia,serif;font-size:30px;line-height:40px;font-weight:500}
/* attire */
.wear{background:#DDE3CF;padding:96px 0}
.wear-in{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:end}
.wear p{font-size:18px;line-height:28px;margin-top:16px}
.tall{display:flex;gap:16px;align-items:flex-end}
.tall div{flex:1;border-radius:999px 999px 8px 8px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:16px;font-weight:600;font-size:14px;line-height:20px;box-shadow:inset 0 0 0 1px var(--line)}
.tall div:nth-child(1){height:280px}.tall div:nth-child(2){height:360px}.tall div:nth-child(3){height:320px}.tall div:nth-child(4){height:400px}
/* faq */
.ask{background:var(--cream);padding:96px 0}
.ask .big{text-align:center;margin-bottom:48px}
.faq summary{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;line-height:32px;font-weight:600;padding:24px 0}
/* rsvp */
.reply{background:var(--forest);color:var(--cream);padding:96px 0;position:relative;overflow:hidden}
.reply .rsvp-grid{align-items:center;position:relative}
.reply .big{color:var(--cream)}
.reply .lead{color:rgba(248,244,234,.85);margin-top:16px}
.reply .card{color:var(--ink);background:var(--paper);border-radius:16px;box-shadow:inset 0 0 0 8px var(--paper),inset 0 0 0 9px var(--gold),0 24px 64px rgba(0,0,0,.3);padding:48px}
.reply .sprig{position:absolute;left:-48px;bottom:-48px;width:400px;max-width:none;opacity:.95;pointer-events:none}
.reply .btn.lg{background:var(--clay)}
.petal{position:fixed;top:-24px;width:16px;height:16px;border-radius:80% 0 80% 0;background:#FFFDF6;box-shadow:inset 0 0 0 1px #D9CFB8;z-index:80;pointer-events:none;animation:fall var(--t) cubic-bezier(.22,1,.36,1) forwards}
@keyframes fall{to{transform:translate(var(--x),110vh) rotate(var(--r));opacity:.2}}
footer{background:var(--night);color:rgba(248,244,234,.75);max-width:none;padding:48px 16px 64px}
footer .mono{font-family:'Cormorant Garamond',Georgia,serif;font-size:48px;line-height:48px;color:var(--cream);margin-bottom:16px}
/* no pin: phones and reduced motion */
@media (max-width:900px){
.names{display:none}.mob-names{display:block;font-family:'Cormorant Garamond',Georgia,serif;font-size:60px;line-height:56px;font-weight:500}
.vow{top:58%;width:min(240px,58vw)}.vow .amp{font-size:48px;line-height:44px;display:block}.arch{height:auto;width:min(116vw,86vh);bottom:0;margin-left:calc(min(116vw,86vh)/-2)}.moon{top:56%}.vow .date{font-size:20px;line-height:28px}.vow .count{margin:8px 0;gap:12px}.vow .count b{font-size:24px;line-height:28px}.vow .btn{padding:8px 16px}.vow .place{display:none}.cue{display:none}
.chapters{height:auto}.chap-pin{position:static;height:auto;overflow:visible}.track{display:block;width:auto;transform:none!important}.chap{width:auto;height:auto;min-height:0;grid-template-columns:1fr;padding:64px 16px;gap:24px}.chap p{font-size:18px;line-height:28px}
.arches,.rolls,.wear-in{grid-template-columns:1fr}.archcard>div{padding:96px 24px 32px}.wear-in{gap:32px;align-items:start}.tall div:nth-child(n){height:auto;min-height:200px}.tall div:nth-child(2){min-height:240px}.tall div:nth-child(4){min-height:280px}
.line:before,.line .fill{left:8px}.line .lamp{left:8px}.line li.it{grid-template-columns:1fr;gap:4px;padding:16px 0 16px 40px}.it .tm,.it:nth-child(even) .tm{font-size:36px;line-height:40px;order:0;text-align:left}.it .ds,.it:nth-child(even) .ds{order:0;text-align:left;font-size:18px;line-height:28px}
.where,.day,.prog,.wear,.ask,.reply{padding:64px 0}.tag{padding:64px 16px 80px}.reply .card{padding:32px 24px}.reply .sprig{display:none}.stage{height:190vh}
}
@media (max-width:760px){.btn.lg{padding:12px 24px}}
@media (prefers-reduced-motion:reduce){.stage{height:auto}.pin{position:relative}.chapters{height:auto}.chap-pin{position:static;height:auto}.track{display:block;width:auto}.chap{width:auto;height:auto}.seal{animation:none}}

/* v3: script names, florals, colour, extras */
.names span{font-family:'Pinyon Script',cursive;font-size:min(7.6vw,116px);line-height:1.2;font-weight:400;letter-spacing:0}
.names .a{justify-self:center;padding:0 40% 0 0}
.names .b{justify-self:center;padding:0 0 0 40%}
.names{grid-template-columns:1fr 1fr;padding:0}
.vow{top:62%}
.vow .amp{font-size:72px;line-height:64px}
.vow .date{margin-top:0}
.vow .count{margin:8px 0 16px}
.mnames{display:none;position:absolute;left:0;right:0;top:88px;text-align:center;font-family:'Pinyon Script',cursive;font-size:60px;line-height:64px;color:var(--cream)}
.mnames span{color:var(--honey)}
.script{font-family:'Pinyon Script',cursive;font-weight:400;font-size:clamp(64px,8vw,112px);line-height:1.05}
footer .mono{font-family:'Pinyon Script',cursive;font-size:60px;line-height:72px}
.tag{position:relative;overflow:hidden}
.fl{position:absolute;width:min(30vw,340px);pointer-events:none}
.fl.tl{left:0;top:0;transform:scale(1,-1)}
.fl.br{right:0;bottom:0;transform:scale(-1,1)}
.fl.tr{right:0;top:0;transform:scale(-1,-1)}
.where{position:relative;overflow:hidden}
.stay{background:#F3D9CB;padding:96px 0;text-align:center}
.spots{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px;text-align:left}
.spot{padding:32px;border-radius:24px;min-height:320px;display:flex;flex-direction:column;justify-content:flex-end}
.spot .l{font-size:14px;line-height:20px;font-weight:600;opacity:.85}
.spot h3{font-size:48px;line-height:48px;font-weight:500;margin:8px 0 12px}
.play{background:var(--honey);padding:96px 0;text-align:center}
.play .sub{color:var(--ink)}
.pl{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px;text-align:left;align-items:start}
.pcard{background:var(--paper);border-radius:24px;padding:32px}
.pcard h3{font-size:36px;line-height:40px;font-weight:500;margin-bottom:24px}
.vote{position:relative;display:flex;justify-content:space-between;width:100%;border:0;background:#EFE9DA;border-radius:8px;padding:12px;margin-bottom:8px;cursor:pointer;overflow:hidden;text-align:left;transition:transform .3s var(--ease)}
.vote:active{transform:scale(.98)}
.vote i{position:absolute;left:0;top:0;bottom:0;width:100%;background:#C9D4B8;transform-origin:left;transition:transform .7s var(--ease)}
.vote span{position:relative}
.vote.mine{box-shadow:inset 0 0 0 2px var(--green)}
#adv input,#adv textarea{margin-bottom:8px}
#adv.bad .err{display:block}
.notes{display:flex;flex-direction:column;gap:8px;margin-top:24px;max-height:320px;overflow:auto}
.note-card{background:#F3D9CB;padding:12px 16px;border-radius:8px}
.note-card:nth-child(3n+2){background:#DDE3CF}.note-card:nth-child(3n){background:#F1E4CC}
.note-card b{display:block;font-size:12px;line-height:16px;font-weight:600;margin-top:4px}
.roll small{display:block;font-size:14px;line-height:20px;opacity:.85;margin-top:4px}
@media (max-width:1180px),(max-aspect-ratio:13/10){.names{display:none}.mnames{display:block}.vow .amp{display:none}}
@media (max-width:900px){.fl{width:40vw}.mnames{top:88px;font-size:64px;line-height:64px}.arch{width:104vw;height:auto;margin-left:-52vw}.moon{width:76vw;height:76vw;margin:0 0 0 -38vw;top:auto;bottom:30vw}.vow{top:auto;bottom:21vw;transform:translateX(-50%);width:42vw;min-width:164px}.vow .date{font-size:18px;line-height:24px}.vow .count{gap:8px;margin:4px 0 8px}.vow .count b{font-size:20px;line-height:24px}.vow .count span{font-size:12px;line-height:16px}.vow .btn{padding:8px 12px;font-size:12px;line-height:16px;white-space:nowrap}.stay,.play{padding:64px 0}.spots,.pl{grid-template-columns:1fr}.spot{min-height:240px}.pcard{padding:24px}}

.wear .big{line-height:1.05}
.where .sub,.stay .sub,.play .sub{margin-top:12px}
.big{padding-bottom:4px}
.tag{padding:128px 32px}
.tag p{font-size:clamp(40px,5.6vw,84px);line-height:1.1;position:relative}
.tag .fl{width:min(20vw,260px)}
@media (max-width:900px){.wear-in{grid-template-columns:1fr;gap:32px;align-items:start}.tag{padding:64px 16px}.tag .fl,.where .fl{display:none}.mnames{top:96px;font-size:72px;line-height:72px}.vow{bottom:25vw}}
@media (max-height:700px) and (max-width:900px){.mnames{top:80px;font-size:56px;line-height:56px}}