/* Lotus Invites – Photo engine (slideshow designs) */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body.pp{margin:0;background:var(--paper);color:var(--paperink);font-family:var(--fb);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.pp.is-intro{overflow:hidden;height:100vh;height:100svh}
p{margin:0}h1,h2,h3{margin:0;font-weight:inherit}img{display:block;max-width:100%}button{font:inherit;cursor:pointer}a{color:inherit}
[hidden]{display:none!important}
.d-crimson{--fs:"Allura",cursive;--fb:"Inter",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-ivory{--fs:"Parisienne",cursive;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.scr{font-family:var(--fs);font-weight:400}

/* ---------- monogram ---------- */
.mono{color:var(--gold);overflow:visible}
.mono .mt{font-family:var(--fd);font-size:30px;fill:currentColor;font-weight:500}
.mono .mt2{font-family:var(--fs);font-size:34px}
.mono .mc{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.4s ease .3s forwards}
.mono .ml ellipse{opacity:0;animation:fadein .5s forwards;animation-delay:calc(1.2s + var(--i,0) * .05s)}
.mono .mt{opacity:0;animation:fadein 1.2s 1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fadein{to{opacity:1}}

/* ---------- first page ---------- */
#intro{position:fixed;inset:0;z-index:50;display:grid;place-items:center;overflow:hidden;background:var(--bg);color:#fff}
.ibg{position:absolute;inset:-4%;background:radial-gradient(ellipse at 30% 30%,#3a1418,#14080a 70%) center/cover;animation:kb 22s ease-in-out infinite alternate}
.no-photos .ibg{background:radial-gradient(ellipse at 30% 20%,color-mix(in srgb,var(--acc) 45%,#000),#120607 70%)}
@keyframes kb{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.14) translate(-2%,-1.5%)}}
.iveil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,4,5,.72),rgba(10,4,5,.55) 40%,rgba(60,6,12,.8))}
.ic{position:relative;z-index:2;width:min(92vw,420px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:20px 8px}
.ic>*{opacity:0;transform:translateY(18px);animation:up 1s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.2s + var(--k) * .18s)}
.ic>:nth-child(1){--k:0}.ic>:nth-child(2){--k:2}.ic>:nth-child(3){--k:3}.ic>:nth-child(4){--k:4}.ic>:nth-child(5){--k:5}
@keyframes up{to{opacity:1;transform:none}}
.im{width:86px}
.yai{display:flex;flex-direction:column;align-items:center;gap:8px;font:500 11px var(--fb);letter-spacing:.42em;text-transform:uppercase;color:var(--acc)}
.yai i{width:44px;height:1px;background:var(--acc)}
.d-ivory .yai{color:#F3D9DD}.d-ivory .yai i{background:#F3D9DD}
.ipp{display:flex;align-items:flex-start;gap:clamp(18px,6vw,34px)}
.ipc{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.ipf{display:grid;place-items:center;width:clamp(78px,22vw,96px);aspect-ratio:.82;border-radius:10px;overflow:hidden;border:2px solid var(--acc);box-shadow:0 0 0 4px rgba(255,255,255,.08),0 14px 30px -12px rgba(0,0,0,.7);background:linear-gradient(135deg,var(--acc),var(--acc2))}
.ipf img{width:100%;height:100%;object-fit:cover}
.ipf b{font:400 44px var(--fs);color:#fff}
.ipn{font:400 clamp(24px,7vw,30px)/1.1 var(--fs);color:#fff;white-space:nowrap}
.ipr{font:500 10px var(--fb);letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.iph{width:20px;margin-top:clamp(30px,9vw,38px);fill:var(--acc);animation:beat 1.4s ease-in-out infinite}
.iph svg{width:100%}
@keyframes beat{0%,60%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(.95)}45%{transform:scale(1.15)}}
.icard{width:min(100%,300px);padding:20px 16px;border-radius:12px;background:rgba(30,12,14,.55);border:1px solid color-mix(in srgb,var(--acc) 45%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.d-ivory .icard{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35)}
.ict{font:500 10.5px var(--fb);letter-spacing:.24em;text-transform:uppercase;color:var(--acc)}
.d-ivory .ict{color:#F3D9DD}
.icd{font:600 17px var(--fb);margin-top:10px}
.ici{font-size:13px;color:rgba(255,255,255,.75);margin-top:4px}
.icl{display:block;width:24px;height:1px;background:var(--acc);margin:12px auto}
.icv{font-size:12.5px;color:rgba(255,255,255,.72)}
.open-btn{position:relative;overflow:hidden;width:min(100%,250px);padding:15px 20px;border:0;border-radius:8px;background:var(--acc);color:#fff;font:700 13px var(--fb);letter-spacing:.14em;text-transform:uppercase;box-shadow:0 14px 30px -12px var(--acc)}
.d-ivory .open-btn{border-radius:999px;background:linear-gradient(120deg,var(--acc),var(--acc2))}
.open-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);transform:translateX(-120%);animation:sheen 3s 2.4s ease-in-out infinite}
.open-btn::after{content:"";position:absolute;inset:-5px;border-radius:12px;border:2px solid var(--acc);opacity:0;animation:pulse 2.4s 2.4s ease-out infinite}
@keyframes sheen{60%,100%{transform:translateX(120%)}}
@keyframes pulse{0%{transform:scale(.92);opacity:.8}100%{transform:scale(1.15);opacity:0}}
.open-btn span{position:relative}
/* ivory: arched photo window on the first page */
.d-ivory #intro{background:#2A1F1D}
.d-ivory .iveil{background:linear-gradient(180deg,rgba(40,24,22,.35),rgba(40,24,22,.6) 55%,rgba(60,30,34,.85))}
.d-ivory .ic::before{content:"";position:absolute;inset:-14px -6px;z-index:-1;border-radius:220px 220px 22px 22px;border:1px solid rgba(255,255,255,.4);background:rgba(43,26,24,.38);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.d-ivory .ic{padding-top:46px}
/* opening transition */
body.opening #intro .ic{transition:transform 1s cubic-bezier(.6,0,.4,1),opacity .8s;transform:scale(1.12);opacity:0}
body.opening #intro{transition:opacity 1.1s .5s;opacity:0}
body.opening .ibg{transition:transform 1.6s;transform:scale(1.3)}
.d-ivory.opening #intro{transition:clip-path 1.4s cubic-bezier(.7,0,.2,1) .2s;clip-path:circle(0 at 50% 50%);opacity:1}
.d-ivory #intro{clip-path:circle(150% at 50% 50%)}

/* ---------- main ---------- */
#inv{opacity:0;transition:opacity 1s}
.is-open #inv{opacity:1}
.nav{position:fixed;top:10px;left:50%;z-index:40;transform:translate(-50%,-90px);display:flex;gap:2px;padding:5px;border-radius:999px;background:rgba(20,10,12,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);max-width:calc(100vw - 20px);overflow-x:auto;scrollbar-width:none;transition:transform .9s cubic-bezier(.2,.8,.2,1) 1.8s}
.nav::-webkit-scrollbar{display:none}
.is-open .nav{transform:translate(-50%,0)}
.nav a{white-space:nowrap;padding:8px 13px;border-radius:999px;font:600 10.5px var(--fb);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:#fff;transition:background .25s}
.nav a:hover,.nav a.on{background:var(--acc)}
.m-ribbon~#inv .nav{top:40px}

/* ---------- hero slideshow ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;overflow:hidden;color:#fff;background:#120607}
.ss{position:absolute;inset:0}
.sl{position:absolute;inset:0;background:center 30%/cover no-repeat;opacity:0;transition:opacity 1.8s ease;will-change:transform,opacity}
.sl.on{opacity:1}
/* Ken Burns (crimson) – each slide zooms & pans in its own direction */
.d-crimson .sl.on{animation:kbz 8s ease-out both}
.d-crimson .sl:nth-child(even).on{animation-name:kbz2}
.d-crimson .sl:nth-child(3n).on{animation-name:kbz3}
@keyframes kbz{from{transform:scale(1.18) translate(2%,1%)}to{transform:scale(1.02) translate(0,0)}}
@keyframes kbz2{from{transform:scale(1) translate(-1%,0)}to{transform:scale(1.16) translate(2%,-2%)}}
@keyframes kbz3{from{transform:scale(1.2) translate(0,-3%)}to{transform:scale(1.04) translate(0,1%)}}
/* glide (ivory) – slides glide in from the side with a soft zoom */
.d-ivory .sl{transition:opacity 1.6s ease,transform 1.6s cubic-bezier(.6,0,.2,1),clip-path 1.6s cubic-bezier(.6,0,.2,1);clip-path:inset(0 0 0 100%)}
.d-ivory .sl.on{clip-path:inset(0 0 0 0);transform:scale(1.06);animation:glz 8s ease-out both}
.d-ivory .sl.out{clip-path:inset(0 100% 0 0);opacity:1}
@keyframes glz{from{transform:scale(1.14)}to{transform:scale(1.02)}}
.sl.art{background:radial-gradient(ellipse at 30% 30%,color-mix(in srgb,var(--acc) 70%,#000),#1a0a0c 70%)}
.sl.art.a2{background:radial-gradient(ellipse at 70% 40%,color-mix(in srgb,var(--acc2) 60%,#000),#160a08 70%)}
.sl.art.a3{background:radial-gradient(ellipse at 50% 80%,color-mix(in srgb,var(--acc) 50%,var(--acc2)),#140808 70%)}
.hveil{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 70%,rgba(0,0,0,.25),rgba(0,0,0,.55) 75%),linear-gradient(180deg,rgba(0,0,0,.35),transparent 30%,transparent 55%,rgba(0,0,0,.55))}
.d-ivory .hveil{background:radial-gradient(ellipse at 50% 65%,rgba(40,20,22,.2),rgba(40,20,22,.5) 75%),linear-gradient(180deg,rgba(40,20,22,.3),transparent 35%,rgba(40,20,22,.55))}
.hero-in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;width:min(94vw,760px);padding:90px 0 80px;margin-top:22vh}
.hm{width:clamp(70px,16vw,96px)}
.wgm{font:500 clamp(11px,2.8vw,13px) var(--fb);letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.85);margin-top:10px}
.hero .nm{font:400 calc(var(--nk,1) * clamp(46px,12vw,92px))/1.15 var(--fs);margin:6px 0 22px;text-shadow:0 4px 24px rgba(0,0,0,.45);white-space:nowrap}
.nm .amp{font-size:.8em}
.nw{display:inline-block;clip-path:inset(0 100% 0 0);padding:0 .12em}
.is-open .nw{animation:write 1.6s cubic-bezier(.6,0,.3,1) forwards}
.is-open .nw:last-child{animation-delay:1.1s}
.nm .amp{opacity:0;display:inline-block}
.is-open .nm .amp{animation:ampin .8s 1s ease forwards}
@keyframes write{to{clip-path:inset(0 -10% 0 -10%)}}
@keyframes ampin{from{opacity:0;transform:scale(.3) rotate(-30deg)}to{opacity:1;transform:none}}
.hero-in>.hm,.hero-in>.wgm,.hero-in>.cd{opacity:0;transform:translateY(16px);transition:opacity 1s,transform 1s}
.is-open .hero-in>.hm{opacity:1;transform:none;transition-delay:.2s}
.is-open .hero-in>.wgm{opacity:1;transform:none;transition-delay:.5s}
.is-open .hero-in>.cd{opacity:1;transform:none;transition-delay:2s}
.cd{display:flex;gap:clamp(10px,3.4vw,26px);justify-content:center}
.cdu{position:relative;width:clamp(66px,19vw,104px);aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,rgba(190,110,100,.65),rgba(110,40,40,.55));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.d-ivory .cdu{border-radius:999px 999px 14px 14px;aspect-ratio:.82;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4)}
.cdu svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.cdu .rt{fill:none;stroke:rgba(255,255,255,.18);stroke-width:2}
.cdu .rp{fill:none;stroke:var(--gold);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p,0));transition:stroke-dashoffset .9s ease}
.d-ivory .cdu svg{display:none}
.cdu b{position:relative;font:700 clamp(22px,6.4vw,38px)/1 var(--fb);font-variant-numeric:tabular-nums}
.d-ivory .cdu b{font-weight:400;font-family:var(--fd);font-size:clamp(26px,7vw,42px)}
.cdu span{position:relative;font:600 clamp(7.5px,2vw,10px) var(--fb);letter-spacing:.16em;text-transform:uppercase;margin-top:4px;opacity:.9}
.tk{animation:tk .5s ease}
@keyframes tk{from{transform:translateY(-40%);opacity:0}}
.cd-note{font:400 clamp(28px,8vw,42px) var(--fs)}
.ssd{position:absolute;bottom:72px;left:50%;transform:translateX(-50%);z-index:2;display:flex;gap:7px}
.ssd i{width:7px;height:7px;border-radius:5px;background:rgba(255,255,255,.45);transition:all .5s}
.ssd i.on{width:24px;background:#fff}
.scroll-hint{position:absolute;bottom:22px;left:50%;z-index:2;width:24px;height:38px;margin-left:-12px;border:2px solid rgba(255,255,255,.7);border-radius:14px}
.scroll-hint span{position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:sh 1.8s infinite}
@keyframes sh{to{transform:translateY(12px);opacity:0}}

/* ---------- sections ---------- */
.sec{position:relative;width:min(92vw,1080px);margin:0 auto;padding:clamp(64px,10vh,100px) 0;text-align:center}
.k{font:500 clamp(10.5px,2.7vw,13px) var(--fb);letter-spacing:.32em;text-transform:uppercase;color:var(--acc)}
.h2{font-size:clamp(44px,11vw,76px);line-height:1.15;margin:4px 0 34px;color:var(--paperink)}
.verse{font:500 italic clamp(19px,5vw,26px)/1.6 var(--fd);max-width:640px;margin:16px auto 0;color:var(--paperink)}
.verse .w{display:inline-block;opacity:0;transform:translateY(8px);transition:all .6s;transition-delay:calc(var(--i) * .05s)}
.verse.in .w{opacity:1;transform:none}
/* couple */
.couple{position:relative;overflow:hidden}
.cbg{position:absolute;inset:0;background:center/cover;opacity:.12;filter:grayscale(1) blur(2px)}
.couple::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--paper),color-mix(in srgb,var(--paper) 80%,transparent) 30%,color-mix(in srgb,var(--paper) 80%,transparent) 70%,var(--paper));z-index:0}
.couple .sec{z-index:1}
.cpl{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,4vw,50px);align-items:start}
.pc{display:flex;flex-direction:column;align-items:center;gap:8px}
.pf{position:relative;width:min(100%,300px);aspect-ratio:.82;padding:10px}
.pfi{position:relative;display:grid;place-items:center;width:100%;height:100%;overflow:hidden;border-radius:6px;background:linear-gradient(140deg,var(--acc),var(--acc2));z-index:1}
.pfi img{width:100%;height:100%;object-fit:cover;transform:scale(1.15);transition:transform 2s cubic-bezier(.2,.8,.2,1)}
.pc.in .pfi img{transform:none}
.pfi b{font:400 clamp(70px,18vw,120px) var(--fs);color:#fff}
.pfo{position:absolute;inset:0;border:2px solid var(--gold);border-radius:12px;transform:rotate(-2deg);transition:transform 1s}
.pfo::after{content:"";position:absolute;inset:-7px;border:1px solid var(--gold);border-radius:16px;transform:rotate(3deg)}
.pc:hover .pfo{transform:rotate(1deg)}
.pc.in .pfo{animation:frm 1.6s cubic-bezier(.2,.8,.2,1)}
@keyframes frm{from{transform:rotate(-14deg) scale(.9);opacity:0}}
.pc .role{font:500 11px var(--fb);letter-spacing:.28em;text-transform:uppercase;color:var(--acc);margin-top:12px}
.pc h3{font:500 clamp(22px,5.5vw,30px) var(--fb);color:var(--paperink)}
.d-ivory .pc h3{font-family:var(--fd);font-size:clamp(26px,6.4vw,36px)}
.par,.adr{font-size:clamp(13px,3.4vw,15.5px);color:var(--mut);max-width:380px}
.cillu{align-self:center;width:clamp(110px,22vw,230px);color:var(--acc)}
.illu{width:100%;height:auto}
.illu path,.illu circle{stroke-dasharray:1;stroke-dashoffset:1}
.cillu.in .illu path,.cillu.in .illu circle{animation:draw 2.6s ease forwards}
.cillu.in .illu :nth-child(2){animation-delay:.3s}.cillu.in .illu :nth-child(3){animation-delay:.6s}.cillu.in .illu :nth-child(4){animation-delay:.9s}.cillu.in .illu :nth-child(5){animation-delay:1.2s}.cillu.in .illu :nth-child(6){animation-delay:1.5s}.cillu.in .illu :nth-child(7){animation-delay:1.8s}.cillu.in .illu :nth-child(8){animation-delay:2.1s}
.cillu.in .illu{animation:float 5s 3s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px)}}
@media (max-width:640px){.cpl{grid-template-columns:1fr;justify-items:center}.cillu{order:0;width:120px;margin:6px 0}.pc.pc1{order:2}.pf{width:min(78vw,280px)}}
/* marquee strip */
.strip{overflow:hidden;background:var(--paperink);color:var(--paper);padding:14px 0;transform:rotate(-1.5deg);margin:10px -10px}
.d-ivory .strip{background:var(--gold);color:#fff}
.strip>div{display:flex;width:max-content;animation:mq 34s linear infinite}
.strip span{display:flex;align-items:center}
.strip b{font:400 clamp(20px,5vw,28px) var(--fs);white-space:nowrap;padding:0 18px}
.strip i{width:14px;fill:var(--acc)}
.d-ivory .strip i{fill:#fff}
.strip i svg{width:100%;display:block}
@keyframes mq{to{transform:translateX(-50%)}}
/* when & where (coloured band) */
.when{position:relative;background:var(--band);color:#fff;margin-top:40px}
.wave{position:absolute;left:0;width:100%;height:40px;top:-39px;fill:var(--band)}
.wave.b{top:auto;bottom:-39px}
.when .k{color:rgba(255,255,255,.85)}
.when .h2{color:#fff}
.evs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:26px 30px;text-align:left}
.ev{position:relative;display:flex;align-items:center;gap:18px;padding:20px 18px 20px 0;margin-left:70px;border-radius:12px;background:rgba(255,255,255,.22);min-height:170px}
.ev .evi{flex:none;position:relative;width:150px;height:150px;margin-left:-70px;border-radius:50%;background:#fff;border:6px solid #fff;color:var(--band);display:grid;place-items:center;box-shadow:0 14px 30px -14px rgba(0,0,0,.5)}
.ev.alt{flex-direction:row-reverse;margin:0 70px 0 0;padding:20px 0 20px 18px}
.ev.alt .evi{margin:0 -70px 0 0}
.evi svg{width:66%;height:auto}
.ev.in .evi svg path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.4s ease .3s forwards}
.evdate{position:absolute;bottom:-6px;right:-6px;width:56px;height:56px;border-radius:50%;background:var(--paperink);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font:600 10px var(--fb);letter-spacing:.12em;text-transform:uppercase;border:3px solid #fff}
.evdate b{font-size:20px;letter-spacing:0;line-height:1}
.evb{display:flex;flex-direction:column;gap:5px;min-width:0}
.evb h3{font:700 clamp(20px,5vw,24px) var(--fb)}
.d-ivory .evb h3{font:400 clamp(30px,7vw,38px) var(--fs)}
.evt{font-weight:700;font-size:15px}
.evn,.evv{font-size:15px;opacity:.95}
.evbt{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
@media (max-width:520px){.ev,.ev.alt{flex-direction:column;align-items:center;text-align:center;margin:60px 0 0;padding:84px 16px 22px}.ev .evi,.ev.alt .evi{position:absolute;top:-64px;margin:0;width:128px;height:128px}.evbt{justify-content:center}}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 24px;border-radius:999px;border:1.5px solid var(--acc);background:var(--acc);color:#fff;font:600 14px var(--fb);text-decoration:none;transition:transform .25s,box-shadow .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px -12px rgba(0,0,0,.4)}
.btn.ghost{background:transparent;color:var(--acc)}
.btn.w{background:#fff;color:var(--band);border-color:#fff}
.btn.wg{background:transparent;color:#fff;border-color:rgba(255,255,255,.8)}
.btn.wa{background:#25D366;border-color:#25D366}
/* gallery / video / misc */
.gl{display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}
.gl-1{grid-template-columns:1fr;max-width:460px;margin:0 auto}.gl-2{grid-template-columns:1fr 1fr}
.gi{padding:0;border:0;border-radius:10px;overflow:hidden;aspect-ratio:.8;background:#ddd}
.gi:nth-child(2){transform:translateY(24px)}
.gi img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.gi:hover img{transform:scale(1.07)}
.vid{position:relative;max-width:820px;margin:0 auto;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#111}
.vid img{width:100%;height:100%;object-fit:cover;opacity:.85}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vplay{position:absolute;left:50%;top:50%;width:74px;height:74px;margin:-37px 0 0 -37px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--acc);display:grid;place-items:center;animation:vp 2.2s infinite}
.vplay svg{width:30px;height:30px;margin-left:4px}
@keyframes vp{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}100%{box-shadow:0 0 0 22px rgba(255,255,255,0)}}
.lnk-act{margin-top:20px}.lnk-sub{margin:-18px 0 20px;color:var(--mut)}
.live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#E53935;margin-right:4px;vertical-align:middle;animation:pulse2 1.6s infinite}
@keyframes pulse2{0%{box-shadow:0 0 0 0 rgba(229,57,53,.6)}100%{box-shadow:0 0 0 10px rgba(229,57,53,0)}}
.card-img{max-width:520px;margin:20px auto 0;border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.sh-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
/* footer */
.foot{position:relative;overflow:hidden;color:#fff;text-align:center;padding:90px 16px 120px;background:#120607}
.fbg{position:absolute;inset:0;background:center/cover;opacity:.35;animation:kb 20s ease-in-out infinite alternate}
.foot::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.4),rgba(40,0,6,.7));z-index:1}
.fin{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:6px}
.fm{width:80px}
.ty{font-size:clamp(56px,14vw,96px);line-height:1}
.ft-sub{opacity:.8}
.ft-n{font:600 15px var(--fb);letter-spacing:.2em;text-transform:uppercase;margin-top:12px}
.ft-n span{color:var(--acc);display:inline-block;animation:beat 1.4s infinite}
.ft-d{opacity:.7;letter-spacing:.3em}
/* reveal */
[data-a]{opacity:0;transform:translateY(34px);transition:opacity 1s,transform 1s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
[data-a].in{opacity:1;transform:none}
/* music, lightbox, toast */
.mus{position:fixed;right:16px;bottom:16px;z-index:60;width:50px;height:50px;border-radius:50%;border:0;background:var(--acc);color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.5)}
.mus svg{width:22px;height:22px}.mus.on svg{animation:spin 4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.lb{position:fixed;inset:0;z-index:80;background:rgba(10,6,8,.55);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:center}
.lb img{max-width:92vw;max-height:82vh;border-radius:10px;box-shadow:0 30px 70px -20px rgba(0,0,0,.7)}
.lb img.z{animation:lz .45s}.lb img.l{animation:ll .45s}.lb img.r{animation:lr .45s}
@keyframes lz{from{transform:scale(.85);opacity:0}}@keyframes ll{from{transform:translateX(-40px);opacity:0}}@keyframes lr{from{transform:translateX(40px);opacity:0}}
.lb button{position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(0,0,0,.38);color:#fff;font-size:26px}
.lb-x{top:14px;right:14px;font-size:18px!important}.lb-p{left:12px;top:50%;margin-top:-24px}.lb-n{right:12px;top:50%;margin-top:-24px}
.lb-c{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#fff;font-size:13px;letter-spacing:.2em}
.toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);z-index:90;background:rgba(20,20,20,.9);color:#fff;padding:10px 18px;border-radius:999px;font-size:14px}
.m-ribbon{position:fixed;top:10px;left:50%;z-index:95;transform:translateX(-50%);padding:5px 14px;border-radius:99px;background:rgba(0,0,0,.72);color:#fff;font:600 11px/1.4 system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;pointer-events:none;white-space:nowrap}
@media (max-width:320px){.m-ribbon{top:30px;font-size:9px}}
canvas.fx{position:fixed;inset:0;width:100%;height:100%;z-index:45;pointer-events:none}
/* hero text sits low so faces in the photos stay visible */
.hero{align-items:end}
.hero-in{margin-top:0;padding:120px 0 120px}
@media (min-width:900px){.evs{grid-template-columns:repeat(auto-fit,minmax(420px,560px));justify-content:center}}

/* ======================================================================
   ETERNAL LOVE  (d-eternal) – wine & champagne gold, hearts everywhere
   ====================================================================== */
.d-eternal{--fs:"Pinyon Script",cursive;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-eternal .iveil{background:radial-gradient(ellipse at 50% 45%,rgba(60,8,24,.45),rgba(20,4,10,.85) 75%)}
.d-eternal .yai{color:var(--gold)}.d-eternal .yai i{background:var(--gold)}
.d-eternal .ipf{border-color:var(--gold);border-radius:14px}
.d-eternal .icard{background:rgba(60,10,26,.5);border-color:rgba(232,195,158,.45);border-radius:20px}
.d-eternal .ict{color:var(--gold)}
.d-eternal .open-btn{border-radius:999px;background:linear-gradient(120deg,#B3264F,#E0567A 50%,#E8C39E)}
.d-eternal .open-btn::after{border-radius:999px}
.ihearts{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.ihearts i{position:absolute;bottom:-60px;left:calc(6% + var(--j) * 11%);width:calc(14px + (var(--j) % 3) * 10px);fill:color-mix(in srgb,var(--acc) 70%,transparent);opacity:.7;animation:hrise calc(9s + var(--j) * 1.3s) linear infinite;animation-delay:calc(var(--j) * -1.7s)}
.ihearts i svg{width:100%;display:block}
@keyframes hrise{0%{transform:translateY(0) rotate(-10deg)}50%{transform:translate(18px,-55vh) rotate(10deg)}100%{transform:translate(-10px,-110vh) rotate(-8deg);opacity:0}}
/* the invitation opens through a growing heart */
.d-eternal #intro{-webkit-mask:linear-gradient(#000,#000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 92'%3E%3Cpath d='M50 86C22 66 4 50 4 30A22 22 0 0 1 50 20A22 22 0 0 1 96 30C96 50 78 66 50 86Z'/%3E%3C/svg%3E") center 55%/0 0 no-repeat;-webkit-mask-composite:xor;mask:linear-gradient(#000,#000),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 92'%3E%3Cpath d='M50 86C22 66 4 50 4 30A22 22 0 0 1 50 20A22 22 0 0 1 96 30C96 50 78 66 50 86Z'/%3E%3C/svg%3E") center 55%/0 0 no-repeat;mask-composite:exclude}
.d-eternal.opening #intro{opacity:1;transition:-webkit-mask-size 1.5s cubic-bezier(.6,0,.3,1) .2s,mask-size 1.5s cubic-bezier(.6,0,.3,1) .2s;-webkit-mask-size:auto,320vmax 320vmax;mask-size:auto,320vmax 320vmax}
/* slideshow: soft blur-in crossfade */
.d-eternal .sl{transition:opacity 2s ease,filter 2s ease;filter:blur(14px)}
.d-eternal .sl.on{filter:none;animation:kbz 9s ease-out both}
.d-eternal .hveil{background:radial-gradient(ellipse at 50% 70%,rgba(60,8,24,.25),rgba(30,4,12,.62) 78%),linear-gradient(180deg,rgba(30,4,12,.35),transparent 35%,rgba(30,4,12,.6))}
.d-eternal .hero .nm{color:#FFF1F4;text-shadow:0 0 30px rgba(224,86,122,.55),0 4px 20px rgba(0,0,0,.4)}
.cdh{position:absolute;inset:-4%;fill:rgba(179,38,79,.55);filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));animation:beat 2.4s ease-in-out infinite}
.cdh svg{width:100%;height:100%}
.d-eternal .cdu{border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;padding-bottom:12%}
.d-eternal .cdu svg:not(.cdh svg){display:none}
.d-eternal .cdu>svg{display:none}
.d-eternal .cdu:nth-child(2) .cdh{animation-delay:-.6s}.d-eternal .cdu:nth-child(3) .cdh{animation-delay:-1.2s}.d-eternal .cdu:nth-child(4) .cdh{animation-delay:-1.8s}
.d-eternal .strip{background:linear-gradient(90deg,#7A1534,#B3264F,#7A1534)}
.d-eternal .pfo{border-color:var(--acc)}.d-eternal .pfo::after{border-color:var(--gold)}
.d-eternal .when{background:linear-gradient(180deg,#7A1534,#4E0D22)}
.d-eternal .wave{fill:#7A1534}.d-eternal .wave.b{fill:#4E0D22}
.d-eternal .btn.w{color:#7A1534}
.d-eternal .evb h3{font:400 clamp(32px,8vw,42px) var(--fs)}
.d-eternal .foot::before{background:linear-gradient(180deg,rgba(30,4,12,.4),rgba(70,8,30,.8))}

/* ---------- love quotes that change with every photo ---------- */
.quote{min-height:2.6em;max-width:560px;margin:-8px 0 22px;font:500 italic clamp(16px,4.2vw,21px)/1.35 var(--fd);color:rgba(255,255,255,.92);text-shadow:0 2px 10px rgba(0,0,0,.5)}
.quote span{display:inline-block;transition:opacity .8s,transform .8s,filter .8s}
.quote.sw span{opacity:0;transform:translateY(10px);filter:blur(6px)}
.quote::before,.quote::after{content:"\201C";font-size:1.4em;color:var(--gold);vertical-align:-.25em;margin-right:4px}
.quote::after{content:"\201D";margin:0 0 0 4px}
.hero-in>.quote{opacity:0;transition:opacity 1s 1.8s}
.is-open .hero-in>.quote{opacity:1}

/* ======================================================================
   GOLDEN HOUR  (d-golden) – warm sunset, polaroids, golden bokeh
   ====================================================================== */
.d-golden{--fs:"Sacramento",cursive;--fb:"Poppins",system-ui,sans-serif;--fd:"Playfair Display",serif}
.d-golden .iveil{background:linear-gradient(180deg,rgba(43,23,9,.55),rgba(43,23,9,.62) 45%,rgba(120,50,10,.78))}
.d-golden .yai{color:#F7D79B}.d-golden .yai i{background:#F7D79B}
.d-golden .ipf{border:5px solid #fff;border-radius:3px;box-shadow:0 14px 30px -12px rgba(0,0,0,.7)}
.d-golden .ipc:first-child .ipf{transform:rotate(-5deg)}.d-golden .ipc:last-child .ipf{transform:rotate(5deg)}
.d-golden .iph{fill:#F2C46D}
.d-golden .icard{background:rgba(255,248,238,.12);border-color:rgba(247,215,155,.5);border-radius:16px}
.d-golden .ict{color:#F7D79B}
.d-golden .open-btn{border-radius:999px;background:linear-gradient(120deg,#C8692A,#E9A23B 55%,#F2C46D);color:#3D2412}
.d-golden .open-btn::after{border-radius:999px;border-color:#F2C46D}
.pstack{position:absolute;left:50%;top:50%;width:min(70vw,330px);aspect-ratio:.8;transform:translate(-50%,-50%);z-index:1;opacity:.55}
.pstack i{position:absolute;inset:0;background:center/cover;border:10px solid #fff;border-bottom-width:38px;box-shadow:0 20px 40px -14px rgba(0,0,0,.6);transform:rotate(calc(-12deg + var(--j) * 12deg)) translate(calc(-30px + var(--j) * 30px),calc(var(--j) * -8px));animation:pfan 1.4s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--j) * .15s)}
@keyframes pfan{from{transform:rotate(0) translate(0,40px);opacity:0}}
.d-golden.opening .pstack i{transition:transform 1.2s cubic-bezier(.6,0,.4,1),opacity 1s;transform:translate(calc(-120vw + var(--j) * 120vw),-40vh) rotate(calc(-40deg + var(--j) * 40deg));opacity:0}
.d-golden.opening #intro{transition:opacity 1s .7s}
/* blurred dreamy background + sharp polaroid photo */
.d-golden .ss .sl{filter:blur(18px) saturate(1.2) brightness(.8);transform:scale(1.15)!important;animation:none!important}
.d-golden .hveil{background:radial-gradient(ellipse at 50% 35%,rgba(255,180,90,.18),rgba(43,23,9,.55) 75%),linear-gradient(180deg,rgba(43,23,9,.25),transparent 40%,rgba(43,23,9,.7))}
.pol{position:absolute;left:50%;top:clamp(70px,11vh,110px);z-index:2;width:min(64vw,300px);transform:translateX(-50%) rotate(-3deg);background:#FFFDF8;padding:10px 10px 0;box-shadow:0 30px 60px -20px rgba(0,0,0,.7);opacity:0;transition:opacity 1s .3s,transform 1.2s cubic-bezier(.2,.8,.2,1) .3s}
.is-open .pol{opacity:1;animation:polsway 7s ease-in-out 2s infinite alternate}
@keyframes polsway{from{transform:translateX(-50%) rotate(-3deg)}to{transform:translateX(-50%) rotate(2deg)}}
.pol-in{position:relative;aspect-ratio:.86;overflow:hidden;background:#3a2414}
.pl{position:absolute;inset:0;background:center 30%/cover;opacity:0;transition:opacity 1.4s ease}
.pl.on{opacity:1;animation:kbz 7s ease-out both}
.pl.art{background:radial-gradient(ellipse at 40% 35%,#F2C46D,#C8692A 60%,#5A2E10)}
.pol-cap{font:400 clamp(26px,7vw,34px)/1.6 var(--fs);color:#5A3418;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pol::before{content:"";position:absolute;top:-14px;left:50%;width:90px;height:26px;margin-left:-45px;background:rgba(242,196,109,.75);transform:rotate(-4deg);z-index:2}
.d-golden .hero{align-items:end}
.d-golden .hero-in{padding-top:calc(min(64vw,300px) * 1.35 + 110px);padding-bottom:110px}
.d-golden .hm{display:none}
.d-golden .hero .nm{color:#FFF4DE}
.d-golden .cdu{border-radius:6px;aspect-ratio:.86;background:rgba(255,248,238,.14);border:1px solid rgba(247,215,155,.55)}
.d-golden .cdu svg{display:none}
.d-golden .cdu b{font-family:var(--fd);font-weight:500}
.d-golden .strip{background:linear-gradient(90deg,#C8692A,#E9A23B,#C8692A);color:#fff}
.d-golden .strip i{fill:#fff}
.d-golden .pf{padding:12px 12px 46px;background:#fff;box-shadow:0 24px 44px -24px rgba(61,36,18,.6)}
.d-golden .pc0 .pf{transform:rotate(-3deg)}.d-golden .pc1 .pf{transform:rotate(3deg)}
.d-golden .pfo{display:none}
.d-golden .pfi{border-radius:0}
.d-golden .when{background:linear-gradient(160deg,#C8692A,#E08A3A 55%,#D9822B)}
.d-golden .wave{fill:#C8692A}.d-golden .wave.b{fill:#D9822B}
.d-golden .btn.w{color:#A2501C}
.d-golden .evb h3{font:400 clamp(34px,8vw,44px) var(--fs)}
.d-golden .gi{border:8px solid #fff;border-bottom-width:26px;border-radius:2px;box-shadow:0 16px 30px -18px rgba(0,0,0,.5)}
.d-golden .gi:nth-child(odd){transform:rotate(-2deg)}.d-golden .gi:nth-child(even){transform:rotate(2deg) translateY(18px)}
.d-golden .foot::before{background:linear-gradient(180deg,rgba(43,23,9,.35),rgba(120,50,10,.75))}
@media (min-width:900px){.pol{top:90px;width:280px}.d-golden .hero-in{padding-top:500px}}
.d-eternal .hero .nm .amp{font-family:var(--fd);font-style:italic;font-size:.6em;color:var(--gold)}
.d-golden .pstack{opacity:.28;width:min(80vw,360px)}
.d-golden .ic{background:radial-gradient(ellipse at center,rgba(43,23,9,.55),transparent 75%)}
.quote{display:flex;align-items:flex-start;justify-content:center;gap:4px}
.quote::before,.quote::after{flex:none}

/* ======================================================================
   1.19.1 – smooth on phones (GPU-friendly: only transform & opacity move)
   ====================================================================== */
.ibg,.sl,.pl{background-image:var(--im);background-size:cover;background-repeat:no-repeat}
.ibg{background-position:center}
.no-photos .ibg{background-image:radial-gradient(ellipse at 30% 20%,#5a1a24,#120607 70%)}
.sl,.pl,.ibg,.fbg,.pol,.pstack i,.hopen,.ihearts i{will-change:transform,opacity;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(0)}
.nw{-webkit-clip-path:inset(0 100% 0 0)}
.is-open .nw{-webkit-animation:write 1.6s cubic-bezier(.6,0,.3,1) forwards}
@-webkit-keyframes write{to{-webkit-clip-path:inset(0 -10% 0 -10%)}}
/* fallbacks for older phone browsers (no color-mix) */
.sl.art{background:radial-gradient(ellipse at 30% 30%,#6a1420,#1a0a0c 70%)}
.sl.art.a2{background:radial-gradient(ellipse at 70% 40%,#5a3a20,#160a08 70%)}
.sl.art.a3{background:radial-gradient(ellipse at 50% 80%,#7a3a32,#140808 70%)}
.ihearts i{fill:var(--acc);opacity:.45}
.couple::before{background:linear-gradient(180deg,var(--paper),rgba(255,255,255,0) 30%,rgba(255,255,255,0) 70%,var(--paper))}
.cbg{opacity:.08}

/* Ivory: glide with transform instead of clip-path */
.d-ivory .sl{clip-path:none;transition:opacity 1.6s ease,transform 1.6s cubic-bezier(.6,0,.2,1);transform:translate3d(12%,0,0) scale(1.08);opacity:0}
.d-ivory .sl.on{transform:translate3d(0,0,0) scale(1.04);opacity:1;animation:none}
.d-ivory .sl.out{transform:translate3d(-12%,0,0) scale(1.08);opacity:0}
.d-ivory #intro,.d-ivory.opening #intro{clip-path:none}
.d-ivory.opening #intro{transition:opacity 1.1s ease .35s,transform 1.4s cubic-bezier(.6,0,.3,1) .2s;opacity:0;transform:scale(1.08)}

/* Eternal: heart opening = a heart scaling up (no mask animation), slides fade + soft zoom (no blur filter) */
.d-eternal #intro,.d-eternal.opening #intro{-webkit-mask:none;mask:none}
.d-eternal.opening #intro{transition:opacity .9s ease .75s;opacity:0}
.hopen{position:absolute;left:50%;top:55%;z-index:5;width:60px;margin:-28px 0 0 -30px;fill:#FFE6EC;opacity:0;pointer-events:none}
.hopen svg{width:100%;display:block}
.d-eternal.opening .hopen{animation:hopen 1.5s cubic-bezier(.6,0,.3,1) forwards}
@keyframes hopen{0%{opacity:0;transform:scale(.2)}25%{opacity:1;transform:scale(1.3)}100%{opacity:1;transform:scale(60)}}
.d-eternal .sl{filter:none;transition:opacity 2s ease;transform:scale(1.12)}
.d-eternal .sl.on{animation:kbz 9s ease-out both}
.quote.sw span{filter:none}

/* Golden: blurred backdrop is a small, pre-softened copy (no live blur filter while animating) */
.d-golden .ss .sl{filter:none;background-image:var(--ims);transform:scale(1.25)!important;transition:opacity 1.6s ease}
.d-golden .ss::after{content:"";position:absolute;inset:0;-webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);background:rgba(43,23,9,.25)}
.d-golden.opening .pstack i{transition:transform 1.1s cubic-bezier(.6,0,.4,1),opacity .9s}

/* phones: lighter images, no glass blur, no off-screen loops */
/* golden: backdrop is a tiny stretched copy made by JS = naturally soft, no blur filter needed */
.d-golden .ss .sl{filter:none!important}
.d-golden .ss .sl.soft{filter:brightness(.88) saturate(1.15)!important}
.d-golden .ss::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(43,23,9,.28)}
.d-golden .ss .sl:not(.soft){filter:blur(14px)!important}
.d-ivory .sl{z-index:0}.d-ivory .sl.out{opacity:1;z-index:1;transform:translate3d(-6%,0,0) scale(1.06)}.d-ivory .sl.on{z-index:2}

/* ======================================================================
   1.19.2 – phone-smooth rebuild of the photo designs
   ====================================================================== */
/* photos are real <img> elements (decoded before they are shown) */
.ibg img,.sl img,.pl img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block}
.ibg,.sl,.pl{background-image:none}
.no-photos .ibg{background-image:radial-gradient(ellipse at 30% 20%,#5a1a24,#120607 70%)}
.sl.art{background:radial-gradient(ellipse at 30% 30%,#6a1420,#1a0a0c 70%)}
.d-golden .ss .sl img{display:none}
.d-golden .ss .sl.soft{background-size:cover;background-position:center}
.d-golden .ss .sl:not(.soft) img{display:block;filter:blur(10px)}
/* only the visible slides become GPU layers (saves phone memory) */
.sl,.pl{will-change:auto;visibility:hidden}
.sl.on,.sl.out,.pl.on{visibility:visible;will-change:transform,opacity}
/* the zoom keeps running while a slide fades out = no jump */
.d-crimson .sl.on,.d-crimson .sl.out{animation:kbz 8s ease-out both}
.d-crimson .sl:nth-child(even).on,.d-crimson .sl:nth-child(even).out{animation-name:kbz2}
.d-crimson .sl:nth-child(3n).on,.d-crimson .sl:nth-child(3n).out{animation-name:kbz3}
.d-eternal .sl.on,.d-eternal .sl.out{animation:kbz 9s ease-out both}
.d-eternal .sl.out{opacity:0}
.sl.out{z-index:1}.sl.on{z-index:2}
@keyframes kbz{from{transform:scale(1.14) translate3d(1.5%,1%,0)}to{transform:scale(1.02) translate3d(0,0,0)}}
@keyframes kbz2{from{transform:scale(1.02) translate3d(-1%,0,0)}to{transform:scale(1.13) translate3d(1.5%,-1.5%,0)}}
@keyframes kbz3{from{transform:scale(1.15) translate3d(0,-2%,0)}to{transform:scale(1.03) translate3d(0,1%,0)}}
/* CSS particles (phones) – transform/opacity only, no repainting */
.cfx{display:none;position:fixed;inset:0;z-index:45;pointer-events:none;overflow:hidden}

.cfx i{position:absolute;top:-30px;left:calc(4% + var(--q) * 12%);width:12px;height:16px;opacity:.75;will-change:transform;animation:cfall calc(9s + var(--q) * 1.4s) linear infinite;animation-delay:calc(var(--q) * -1.9s)}
.d-crimson .cfx i{background:#D7263D;border-radius:80% 0 80% 0}
.d-crimson .cfx i:nth-child(3n){background:#F28B9C}
.d-ivory .cfx i,.d-golden .cfx i{width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 10px 3px rgba(255,236,200,.8);animation-name:cfloat}
.d-golden .cfx i{width:18px;height:18px;background:rgba(255,200,110,.45);box-shadow:0 0 18px 8px rgba(255,190,100,.35)}
.d-eternal .cfx i{top:auto;bottom:-30px;width:18px;height:18px;fill:#E0567A;opacity:.55;animation-name:crise}
.d-eternal .cfx i:nth-child(2n){fill:#E8C39E;width:12px;height:12px}
.cfx i svg{width:100%;height:100%;display:block}
@keyframes cfall{0%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(24px,55vh,0) rotate(160deg)}100%{transform:translate3d(-12px,112vh,0) rotate(320deg)}}
@keyframes crise{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(18px,-55vh,0)}100%{transform:translate3d(-10px,-112vh,0)}}
@keyframes cfloat{0%,100%{transform:translate3d(0,20vh,0) scale(.4);opacity:0}50%{transform:translate3d(14px,45vh,0) scale(1);opacity:.9}}
.d-ivory .cfx i:nth-child(odd),.d-golden .cfx i:nth-child(odd){animation-name:cfloat2}
@keyframes cfloat2{0%,100%{transform:translate3d(0,62vh,0) scale(.4);opacity:0}50%{transform:translate3d(-14px,78vh,0) scale(1);opacity:.9}}

/* ---------- phones: keep everything on the GPU, nothing repaints per frame ---------- */
@keyframes nwin{to{opacity:1;transform:none}}
.mob .lb{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(10,6,8,.88)}
.pol,.mob .pol{transform:translate3d(-50%,0,0) rotate(-3deg)}

/* ======================================================================
   1.20 – four new photo designs (scoped; older designs untouched)
   ====================================================================== */
.d-velvet.is-open .cfx,.d-starlit.is-open .cfx,.d-film.is-open .cfx,.d-blossom.is-open .cfx{display:block}

/* ---------------------------------------------------------------- VELVET ROSE */
.d-velvet{--fs:"Alex Brush",cursive;--fb:"Lato",system-ui,sans-serif;--fd:"Cinzel",serif}
.d-velvet .iveil{background:radial-gradient(ellipse at 50% 40%,rgba(30,0,4,.35),rgba(20,0,3,.85) 75%)}
.curt{position:absolute;top:0;bottom:0;width:52%;z-index:4;will-change:transform;transition:transform 1.6s cubic-bezier(.7,0,.25,1) .1s;
  background:repeating-linear-gradient(90deg,#5A0410 0,#9B0C20 4.5%,#C8142C 7%,#8A0A1C 10%,#4A030D 12.5%);box-shadow:inset 0 -80px 120px -40px rgba(0,0,0,.6)}
.curt::after{content:"";position:absolute;left:0;right:0;top:0;height:44px;background:linear-gradient(#D4AF37,#8C6A1A);box-shadow:0 6px 16px rgba(0,0,0,.5)}
.curt.l{left:0;transform-origin:0 0}.curt.r{right:0;transform-origin:100% 0}
.d-velvet .curt.l{transform:translate3d(-78%,0,0)}.d-velvet .curt.r{transform:translate3d(78%,0,0)}
.rope{position:absolute;top:46%;width:14px;height:46px;border-radius:7px;background:linear-gradient(#F3D57A,#B8902A);box-shadow:0 4px 8px rgba(0,0,0,.4)}
.curt.l .rope{right:4px}.curt.r .rope{left:4px}
.spot{position:absolute;left:50%;top:-10%;width:140vmin;height:140vmin;margin-left:-70vmin;z-index:1;background:radial-gradient(ellipse at 50% 30%,rgba(255,236,200,.22),transparent 55%);pointer-events:none;animation:spotsw 6s ease-in-out infinite alternate}
@keyframes spotsw{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
.d-velvet .ic{z-index:3}
.d-velvet .yai{color:#F3D57A}.d-velvet .yai i{background:#F3D57A}
.d-velvet .ipf{border:3px solid #D4AF37;border-radius:4px;box-shadow:0 0 0 5px rgba(212,175,55,.18),0 18px 30px -12px rgba(0,0,0,.8)}
.d-velvet .icard{background:rgba(40,2,8,.78);border:1px solid rgba(212,175,55,.55);border-radius:4px;box-shadow:inset 0 0 0 5px rgba(40,2,8,.78),inset 0 0 0 6px rgba(212,175,55,.35)}
.d-velvet .ict{color:#F3D57A;font-family:var(--fd)}
.d-velvet .open-btn{border-radius:2px;background:linear-gradient(180deg,#F3D57A,#B8902A);color:#3A0610;letter-spacing:.24em}
.d-velvet .open-btn::after{border-color:#D4AF37;border-radius:4px}
/* opening: curtains swing closed for a beat, then part fully */
.d-velvet.opening .curt.l{transform:translate3d(-100%,0,0) scaleX(.6);transition-delay:.15s}
.d-velvet.opening .curt.r{transform:translate3d(100%,0,0) scaleX(.6);transition-delay:.15s}
.d-velvet.opening #intro .ic{transition:opacity .6s,transform 1s;opacity:0;transform:scale(.92)}
.d-velvet.opening #intro{transition:opacity .9s ease 1s;opacity:0}
/* hero: gold-framed slideshow on velvet */
.d-velvet .hero{background:#1A0306}
.d-velvet .ss{inset:clamp(70px,12vh,110px) clamp(16px,6vw,90px) auto;height:min(58vh,560px);border:3px solid #D4AF37;box-shadow:0 0 0 8px rgba(26,3,6,1),0 0 0 9px rgba(212,175,55,.45),0 30px 60px -20px rgba(0,0,0,.8);overflow:hidden}
.d-velvet .hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#3A020A 0,#5E0614 3%,#3A020A 6%);opacity:.9}
.d-velvet .hveil{background:linear-gradient(180deg,transparent 50%,rgba(26,3,6,.9) 75%)}
.d-velvet .sl.on,.d-velvet .sl.out{animation:kbz 8s ease-out both}
.d-velvet .hero-in{padding-top:calc(min(58vh,560px) + 70px);padding-bottom:110px}
.d-velvet .hm{display:none}
.d-velvet .wgm{font-family:var(--fd);color:#F3D57A}
.d-velvet .hero .nm{color:#FFF4E0}
.d-velvet .cdu{border-radius:2px;transform:rotate(45deg);width:clamp(54px,15vw,84px);background:rgba(60,4,12,.85);border:1px solid #D4AF37;margin:12px 6px}
.d-velvet .cdu>*{transform:rotate(-45deg)}
.d-velvet .cdu svg{display:none}
.d-velvet .cdu b{font-family:var(--fd);font-size:clamp(18px,5vw,30px);color:#F3D57A}
.d-velvet .cdu span{font-size:clamp(6.5px,1.7vw,8.5px)}
.d-velvet .cfx i{background:#C8102E;border-radius:80% 0 80% 0;width:13px;height:17px}
.d-velvet .cfx i:nth-child(3n){background:#8E0E1F}
.d-velvet .strip{background:linear-gradient(90deg,#8E0E1F,#C8102E,#8E0E1F)}
.d-velvet .when{background:linear-gradient(180deg,#8E0E1F,#5A0612)}
.d-velvet .wave{fill:#8E0E1F}.d-velvet .wave.b{fill:#5A0612}
.d-velvet .btn.w{color:#8E0E1F}
.d-velvet .evb h3,.d-velvet .h2{font-family:var(--fs)}
.d-velvet .pfo{border-color:#D4AF37}
.d-velvet .ft-n span{color:#D4AF37}

/* ---------------------------------------------------------------- STARLIT PROMISE */
.d-starlit{--fs:"Pinyon Script",cursive;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-starlit #intro{background:radial-gradient(ellipse at 50% 110%,#3A2E7A,#151640 45%,#070B24 80%)}
.d-starlit .ibg{opacity:.18}
.d-starlit .iveil{background:linear-gradient(180deg,rgba(7,11,36,.4),rgba(7,11,36,.75))}
.sky{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.sky i{position:absolute;left:calc((var(--q) * 37 + 7) % 100 * 1%);top:calc((var(--q) * 53 + 11) % 100 * 1%);width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 6px 1px rgba(255,255,255,.8);animation:twk calc(2s + var(--q) % 5 * .6s) ease-in-out infinite;animation-delay:calc(var(--q) * -.31s)}
.sky i:nth-child(4n){width:3px;height:3px;background:#F6D9A8}
@keyframes twk{50%{opacity:.15;transform:scale(.4)}}
.shoot{position:absolute;top:12%;left:80%;width:120px;height:2px;background:linear-gradient(90deg,#fff,transparent);transform:rotate(-24deg);opacity:0;animation:shoot 6s ease-in 1.5s infinite}
.shoot.s2{top:34%;left:95%;animation-delay:4.2s;animation-duration:8s}
@keyframes shoot{0%{opacity:0;transform:rotate(-24deg) translate3d(0,0,0)}4%{opacity:1}14%{opacity:0;transform:rotate(-24deg) translate3d(-60vw,0,0)}100%{opacity:0;transform:rotate(-24deg) translate3d(-60vw,0,0)}}
.cnst{position:absolute;left:50%;top:6%;width:min(70vw,320px);margin-left:min(-35vw,-160px);z-index:2;opacity:.55}
.cnst path{animation:draw 3.2s ease .4s forwards}
.cnst circle{fill:#F6D9A8;opacity:0;animation:fadein .4s forwards,twk 3s ease-in-out infinite;animation-delay:calc(.3s + var(--q) * .3s),calc(3.5s + var(--q) * .2s)}
.d-starlit .ic{z-index:3;margin-top:12vh}
.d-starlit .im{display:none}
.d-starlit .yai{color:#F6D9A8}.d-starlit .yai i{background:#F6D9A8}
.d-starlit .ipf{border:2px solid rgba(246,217,168,.8);border-radius:6px;box-shadow:0 0 30px -4px rgba(185,167,255,.7)}
.d-starlit .ipn{font-family:var(--fs)}
.d-starlit .iph{fill:#F6D9A8}
.d-starlit .icard{background:rgba(20,22,70,.65);border:1px solid rgba(185,167,255,.4);border-radius:18px}
.d-starlit .ict{color:#B9A7FF}
.d-starlit .open-btn{border-radius:999px;background:linear-gradient(120deg,#6E5BD6,#B9A7FF 60%,#F6D9A8);color:#120F3A}
.d-starlit .open-btn::after{border-radius:999px;border-color:#B9A7FF}
/* opening: warp through the stars */
.d-starlit.opening .sky i{transition:transform 1.4s cubic-bezier(.6,0,.4,1),opacity 1.4s;transform:scale(14,1) translate3d(calc((var(--q) % 2 * 2 - 1) * 30px),0,0);opacity:0}
.d-starlit.opening .cnst{transition:transform 1.3s cubic-bezier(.6,0,.4,1),opacity 1s;transform:scale(3);opacity:0}
.d-starlit.opening #intro .ic{transition:transform 1.2s cubic-bezier(.6,0,.4,1),opacity .8s;transform:scale(.6);opacity:0}
.d-starlit.opening #intro{transition:opacity 1s ease .9s;opacity:0}
/* hero: moon-round photo window in a starry sky */
.d-starlit .hero{background:radial-gradient(ellipse at 50% 100%,#3A2E7A,#151640 45%,#070B24 80%)}
.sky.hs{z-index:0}
.d-starlit .ss{left:50%;right:auto;top:clamp(76px,11vh,110px);bottom:auto;width:min(78vw,400px);aspect-ratio:1;margin-left:min(-39vw,-200px);border-radius:50%;overflow:hidden;z-index:1;box-shadow:0 0 0 2px rgba(246,217,168,.8),0 0 60px 10px rgba(185,167,255,.35)}
.moonring{position:absolute;left:50%;top:calc(clamp(76px,11vh,110px) - 14px);width:calc(min(78vw,400px) + 28px);aspect-ratio:1;margin-left:calc(min(-39vw,-200px) - 14px);border-radius:50%;border:1px dashed rgba(246,217,168,.6);z-index:1;animation:spin 60s linear infinite}
.moonring::after{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#F6D9A8;box-shadow:0 0 12px 4px rgba(246,217,168,.8)}
.d-starlit .sl{transition:opacity 1.6s ease,transform 1.6s cubic-bezier(.3,.7,.2,1);transform:scale(1.35)}
.d-starlit .sl.on{transform:scale(1)}
.d-starlit .sl.out{transform:scale(.85);opacity:0}
.d-starlit .hveil{background:linear-gradient(180deg,transparent 55%,rgba(7,11,36,.7))}
.d-starlit .hero-in{padding-top:calc(min(78vw,400px) + 120px);padding-bottom:110px}
.d-starlit .hm{display:none}
.d-starlit .hero .nm{font-family:var(--fs);color:#FFF;text-shadow:0 0 22px rgba(185,167,255,.8)}
.d-starlit .wgm{color:#F6D9A8}
.d-starlit .cdu{background:radial-gradient(circle at 35% 30%,rgba(185,167,255,.45),rgba(30,30,90,.75));box-shadow:0 0 24px -4px rgba(185,167,255,.6)}
.d-starlit .cdu .rp{stroke:#F6D9A8}
.d-starlit .cdu b{font-family:var(--fd);font-weight:600}
.d-starlit .cfx i{width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 8px 2px rgba(246,217,168,.9);animation-name:cfloat}
.d-starlit .cfx i:nth-child(odd){animation-name:cfloat2}
.d-starlit .strip{background:linear-gradient(90deg,#2A2466,#6E5BD6,#2A2466)}
.d-starlit .when{background:linear-gradient(180deg,#2A2466,#151640)}
.d-starlit .wave{fill:#2A2466}.d-starlit .wave.b{fill:#151640}
.d-starlit .btn.w{color:#2A2466}
.d-starlit .evb h3,.d-starlit .h2{font-family:var(--fs)}
.d-starlit .foot::before{background:linear-gradient(180deg,rgba(7,11,36,.4),rgba(21,22,64,.85))}

/* ---------------------------------------------------------------- OUR LOVE FILM */
.d-film{--fs:"DM Serif Display",serif;--fb:"Inter",system-ui,sans-serif;--fd:"Oswald",sans-serif}
.d-film #intro{background:#0B0B0B}
.d-film .ibg{opacity:.35;filter:grayscale(.4) sepia(.25)}
.d-film .iveil{background:radial-gradient(ellipse at center,rgba(0,0,0,.2),rgba(0,0,0,.85) 80%)}
.sprk{position:absolute;top:0;bottom:0;width:30px;z-index:2;background:#000;
  background-image:linear-gradient(#0B0B0B 0,#0B0B0B 100%),radial-gradient(circle,transparent 0,transparent 0);overflow:hidden}
.sprk::before{content:"";position:absolute;left:7px;right:7px;top:-40px;bottom:-40px;background:repeating-linear-gradient(180deg,#F6F1E7 0 14px,transparent 14px 28px);border-radius:3px;opacity:.85;animation:sprk 1.2s linear infinite}
.sprk.l{left:0}.sprk.r{right:0}
@keyframes sprk{to{transform:translate3d(0,28px,0)}}
.grain{position:absolute;inset:-50%;z-index:2;pointer-events:none;opacity:.12;background-image:radial-gradient(rgba(255,255,255,.7) 1px,transparent 1.4px),radial-gradient(rgba(255,255,255,.5) 1px,transparent 1.4px);background-size:7px 9px,11px 13px;animation:grn .5s steps(4) infinite}
@keyframes grn{0%{transform:translate3d(0,0,0)}25%{transform:translate3d(-3%,2%,0)}50%{transform:translate3d(2%,-3%,0)}75%{transform:translate3d(-2%,-1%,0)}}
.d-film .ic{z-index:3}
.d-film .im{display:none}
.d-film .yai{color:#E8B04B;font-family:var(--fd);letter-spacing:.5em}.d-film .yai i{background:#E8B04B}
.d-film .ipf{border:6px solid #F6F1E7;border-bottom-width:20px;border-radius:2px;filter:sepia(.15)}
.d-film .ipn{font-family:var(--fs);font-style:italic;font-size:clamp(24px,6.6vw,30px)}
.d-film .iph{fill:#C2412D}
.d-film .icard{background:rgba(20,18,14,.85);border:1px solid rgba(232,176,75,.5);border-radius:2px}
.d-film .ict{color:#E8B04B;font-family:var(--fd);letter-spacing:.3em}
.d-film .icd{font-family:var(--fd);font-weight:500;letter-spacing:.06em}
.d-film .open-btn{border-radius:2px;background:#E8B04B;color:#111;font-family:var(--fd);letter-spacing:.3em;font-weight:500}
.d-film .open-btn::after{border-radius:4px;border-color:#E8B04B}
.d-film .open-btn span::before{content:"▶  "}
/* film leader 3-2-1 */
.leader{position:absolute;inset:0;z-index:6;display:none;place-items:center;background:radial-gradient(circle,#BFB7A6,#6E675B 70%,#2A2722)}
.d-film.opening .leader{display:grid;animation:fadein .2s both,ldout .5s ease 1.6s forwards}
@keyframes ldout{to{opacity:0;transform:scale(1.4)}}
.lring{position:absolute;width:min(70vw,340px);aspect-ratio:1;border-radius:50%;border:4px solid #1B1712;box-shadow:inset 0 0 0 14px rgba(27,23,18,.15),inset 0 0 0 16px #1B1712}
.lring::before,.lring::after{content:"";position:absolute;background:#1B1712}
.lring::before{left:50%;top:-30%;bottom:-30%;width:2px}
.lring::after{top:50%;left:-30%;right:-30%;height:2px}
.lhand{position:absolute;width:min(70vw,340px);aspect-ratio:1;border-radius:50%;background:conic-gradient(rgba(27,23,18,.35) 0 90deg,transparent 90deg)}
.d-film.opening .lhand{animation:spin .55s linear 3}
.leader b{position:relative;font:600 min(40vw,190px)/1 var(--fd);color:#1B1712}
.leader span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}
.d-film.opening .leader span:nth-child(1){animation:ldn .55s 0s both}
.d-film.opening .leader span:nth-child(2){animation:ldn .55s .55s both}
.d-film.opening .leader span:nth-child(3){animation:ldn .55s 1.1s both}
@keyframes ldn{0%,100%{opacity:0}10%,90%{opacity:1}}
.d-film.opening #intro .ic{opacity:0;transition:opacity .2s}
.d-film.opening #intro{transition:opacity .5s ease 2.1s;opacity:0}
/* hero: letterboxed film frame */
.d-film .hero{background:#0B0B0B}
.d-film .ss{left:30px;right:30px;top:clamp(70px,10vh,100px);bottom:auto;aspect-ratio:4/5;max-height:62vh;margin:0 auto;max-width:560px;overflow:hidden;border:2px solid #222;box-shadow:0 0 0 1px #000}
.d-film .sprk{z-index:1}
.d-film .grain{z-index:3;opacity:.08}
.d-film .hveil{background:linear-gradient(180deg,transparent 45%,#0B0B0B 70%)}
.d-film .sl{transition:opacity .25s linear}
.d-film .sl.on{animation:filmin 6s ease-out both}
.d-film .sl.out{animation:filmout .5s ease both}
@keyframes filmin{0%{transform:translate3d(0,-6%,0) scale(1.1);opacity:0;filter:brightness(2)}6%{opacity:1;filter:brightness(1.4)}12%{filter:none}100%{transform:translate3d(0,0,0) scale(1.02)}}
@keyframes filmout{to{transform:translate3d(0,8%,0);opacity:0}}
.fcap{position:absolute;z-index:3;left:0;right:0;top:calc(min(62vh,(100vw - 60px) * 1.25) + clamp(70px,10vh,100px) + 22px);text-align:center;font:500 11px var(--fd);letter-spacing:.5em;text-transform:uppercase;color:#E8B04B;opacity:0;transition:opacity 1s 1.2s}
.is-open .fcap{opacity:1}
.d-film .hero-in{padding-top:calc(min(62vh,(100vw - 60px) * 1.25) + 120px);padding-bottom:110px;z-index:4}
.d-film .hm,.d-film .wgm{display:none}
.d-film .hero .nm{font-family:var(--fs);font-style:italic;color:#F6F1E7;font-size:calc(var(--nk,1) * clamp(40px,11vw,80px))}
.d-film .nm .amp{color:#E8B04B}
.d-film .quote{font-family:var(--fs)}
.d-film .cdu{border-radius:2px;aspect-ratio:.86;background:#1B1712;border:1px solid #333;overflow:hidden;padding-top:12px}
.d-film .cdu::before{content:"";position:absolute;left:0;right:0;top:0;height:12px;background:repeating-linear-gradient(-45deg,#F6F1E7 0 8px,#111 8px 16px)}
.d-film .cdu svg{display:none}
.d-film .cdu b{font-family:var(--fd);font-weight:500;color:#E8B04B}
.d-film .cfx i{width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(232,176,75,.25),transparent 70%);animation-name:cfloat}
.d-film .cfx i:nth-child(n+5){display:none}
.d-film .strip{background:#111;color:#E8B04B;border-top:6px dashed #F6F1E7;border-bottom:6px dashed #F6F1E7}
.d-film .strip b{font-family:var(--fd);font-size:clamp(16px,4vw,20px);letter-spacing:.3em;text-transform:uppercase}
.d-film .strip i{fill:#C2412D}
.d-film .when{background:#1B1712}
.d-film .wave{fill:#1B1712}
.d-film .btn.w{color:#1B1712;background:#E8B04B;border-color:#E8B04B}
.d-film .evb h3,.d-film .h2{font-family:var(--fs);font-style:italic}
.d-film .h2{font-size:clamp(36px,9vw,60px)}
.d-film .k{font-family:var(--fd);letter-spacing:.5em;color:#C2412D}
.d-film .pf{background:#fff;padding:12px 12px 40px}
.d-film .pfo{display:none}
.d-film .pfi{border-radius:0;filter:sepia(.1)}

/* ---------------------------------------------------------------- CHERRY BLOSSOM */
.d-blossom{--fs:"Dancing Script",cursive;--fb:"Quicksand",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-blossom #intro{background:linear-gradient(180deg,#FFF4F7,#FFE3EA)}
.d-blossom .ibg{opacity:.22}
.d-blossom .iveil{background:linear-gradient(180deg,rgba(255,244,247,.55),rgba(255,227,234,.75))}
.branch{position:absolute;width:min(62vw,340px);z-index:2;pointer-events:none}
.branch svg{width:100%;height:auto;display:block}
.branch.l{left:-4%;top:-2%}
.branch.r{right:-4%;bottom:-2%;transform:rotate(180deg)}
.branch .bl{transform-box:fill-box;transform-origin:center;animation:bloom .8s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(.3s + var(--q) * .12s)}
@keyframes bloom{from{transform:scale(0) rotate(-40deg);opacity:0}}
.branch svg{animation:sway 5s ease-in-out infinite alternate;transform-origin:0 0}
@keyframes sway{to{transform:rotate(2deg)}}
.d-blossom #intro .ic{z-index:3;color:#4A2233}
.d-blossom .ic{background:rgba(255,255,255,.82);border-radius:26px;padding:24px 14px;box-shadow:0 30px 60px -30px rgba(231,115,143,.6);transform-origin:50% 0}
.d-blossom .mono{color:#D9A6B3}
.d-blossom .yai{color:#E7738F}.d-blossom .yai i{background:#E7738F}
.d-blossom .ipf{border:4px solid #fff;border-radius:14px;box-shadow:0 12px 24px -10px rgba(231,115,143,.6)}
.d-blossom .ipn{color:#4A2233}.d-blossom .ipr{color:#8C6A76}
.d-blossom .icard{background:#FFF0F4;border:1px dashed #E7A3B4;border-radius:18px;color:#4A2233}
.d-blossom .ict{color:#E7738F}.d-blossom .ici,.d-blossom .icv{color:#8C6A76}
.d-blossom .open-btn{border-radius:999px;background:linear-gradient(120deg,#E7738F,#B98BD8)}
.d-blossom .open-btn::after{border-radius:999px}
/* opening: card unfolds upward, branches drift away */
.d-blossom.opening #intro .ic{transition:transform 1.1s cubic-bezier(.6,0,.4,1),opacity .9s .3s;transform:perspective(900px) rotateX(70deg) translate3d(0,-30%,0);opacity:0}
.d-blossom.opening .branch.l{transition:transform 1.2s cubic-bezier(.6,0,.4,1);transform:translate3d(-60%,-40%,0)}
.d-blossom.opening .branch.r{transition:transform 1.2s cubic-bezier(.6,0,.4,1);transform:rotate(180deg) translate3d(-60%,-40%,0)}
.d-blossom.opening #intro{transition:opacity .8s ease .8s;opacity:0}
/* hero: stacked photo cards that fly off one by one */
.d-blossom .hero{background:linear-gradient(180deg,#FFE9EF,#FFF7F9);color:#4A2233}
.d-blossom .ss{left:50%;right:auto;top:clamp(80px,12vh,120px);bottom:auto;width:min(72vw,360px);aspect-ratio:.8;margin-left:min(-36vw,-180px);overflow:visible}
.d-blossom .ss::before,.d-blossom .ss::after{content:"";position:absolute;inset:0;background:#fff;border-radius:18px;box-shadow:0 18px 40px -20px rgba(231,115,143,.6)}
.d-blossom .ss::before{transform:rotate(-6deg) translate3d(-10px,6px,0)}
.d-blossom .ss::after{transform:rotate(5deg) translate3d(10px,4px,0)}
.d-blossom .sl{border-radius:18px;overflow:hidden;border:8px solid #fff;z-index:1;box-shadow:0 24px 44px -20px rgba(74,34,51,.5);transition:opacity .01s 1.2s;opacity:0;transform:rotate(-1.5deg)}
.d-blossom .sl.on{opacity:1;z-index:2;transition:none;animation:stin .9s cubic-bezier(.2,.8,.2,1) both}
.d-blossom .sl.out{opacity:1;z-index:3;animation:stout 1.1s cubic-bezier(.6,0,.4,1) forwards}
@keyframes stin{from{transform:scale(.92) rotate(3deg)}to{transform:rotate(-1.5deg)}}
@keyframes stout{to{transform:translate3d(-130%,-6%,0) rotate(-24deg);opacity:0}}
.d-blossom .hveil{display:none}
.d-blossom .branch.hb{display:none}
.d-blossom .hero-in{padding-top:calc(min(72vw,360px) * 1.25 + 130px);padding-bottom:110px;color:#4A2233}
.d-blossom .hm{display:none}
.d-blossom .wgm{color:#E7738F}
.d-blossom .hero .nm{color:#4A2233;text-shadow:none;font-weight:600}
.d-blossom .nm .amp{color:#E7738F}
.d-blossom .quote{color:#8C6A76;text-shadow:none}
.d-blossom .quote::before,.d-blossom .quote::after{color:#E7738F}
.d-blossom .cdu{border-radius:50% 0 50% 50%;transform:rotate(45deg);background:linear-gradient(135deg,#FFD3DE,#F3A7BC);box-shadow:0 12px 20px -10px rgba(231,115,143,.6);width:clamp(54px,15vw,82px);margin:10px 6px}
.d-blossom .cdu>*{transform:rotate(-45deg)}
.d-blossom .cdu svg{display:none}
.d-blossom .cdu b{color:#fff;font-size:clamp(18px,5vw,30px)}
.d-blossom .cdu span{color:#fff;font-size:clamp(6px,1.6vw,8px)}
.d-blossom .ssd i{background:rgba(231,115,143,.35)}.d-blossom .ssd i.on{background:#E7738F}
.d-blossom .scroll-hint{border-color:#E7738F}.d-blossom .scroll-hint span{background:#E7738F}
.d-blossom .nav{background:rgba(255,255,255,.88)}.d-blossom .nav a{color:#4A2233}.d-blossom .nav a.on,.d-blossom .nav a:hover{color:#fff}
.d-blossom .cfx i{background:#F8B7C8;border-radius:150% 0 150% 0;width:12px;height:12px;opacity:.85}
.d-blossom .cfx i:nth-child(2n){background:#FFE3EA}
.d-blossom .strip{background:linear-gradient(90deg,#E7738F,#B98BD8)}
.d-blossom .when{background:linear-gradient(160deg,#E7738F,#C98BB8)}
.d-blossom .wave{fill:#E7738F}.d-blossom .wave.b{fill:#C98BB8}
.d-blossom .btn.w{color:#C2506D}
.d-blossom .pf{background:#fff;padding:10px;border-radius:20px;box-shadow:0 20px 40px -20px rgba(231,115,143,.6)}
.d-blossom .pfo{display:none}.d-blossom .pfi{border-radius:14px}
.d-blossom .foot::before{background:linear-gradient(180deg,rgba(74,34,51,.25),rgba(231,115,143,.7))}
/* phones: keep the light versions of the heavy bits */
.d-velvet .ss{height:min(52vh,540px)}
.d-velvet .hero-in{padding-top:calc(min(52vh,540px) + 96px)}
.cnst{top:3%;width:min(52vw,230px);margin-left:min(-26vw,-115px)}
.d-starlit .ic{margin-top:min(30vw,150px)}
@media (min-width:900px){.d-velvet .ss{left:50%;right:auto;width:min(46vh,440px);margin-left:min(-23vh,-220px)}}
.d-starlit .ss{margin-left:calc(min(78vw,400px) / -2)}
.moonring{margin-left:calc(min(78vw,400px) / -2 - 14px)}
.d-blossom .ss{margin-left:calc(min(72vw,360px) / -2)}
.d-velvet .hero-in{padding-top:calc(min(52vh,540px) + clamp(70px,12vh,110px) + 34px)}
@media (min-width:900px){.d-velvet .ss{margin-left:calc(min(46vh,440px) / -2)}}
.cnst{margin-left:calc(min(52vw,230px) / -2)}

/* ======================================================================
   1.21 – four Christian photo designs (scoped; older designs untouched)
   ====================================================================== */
.d-sagewc .cfx,.d-twilight .cfx,.d-maroon .cfx,.d-grace .cfx{display:block;z-index:55}
.hero-in>.cdcap,.hero-in>.dstrip{opacity:0;transform:translateY(16px);transition:opacity 1s,transform 1s}
.is-open .hero-in>.dstrip{opacity:1;transform:none;transition-delay:1.5s}
.is-open .hero-in>.cdcap{opacity:1;transform:none;transition-delay:1.8s}
.cdcap{margin:0 0 12px}
.chh{position:absolute;inset:0;pointer-events:none}
.chh i{position:absolute;bottom:18%;left:calc(14% + var(--j) * 17%);width:12px;fill:var(--acc2);opacity:0;will-change:transform,opacity}
.chh i svg{width:100%;display:block}
.chh i:nth-child(2n){width:17px}.chh i:nth-child(3){width:14px}
.cillu.in .chh i{animation:chh 4.6s ease-in infinite;animation-delay:calc(2s + var(--j) * .9s)}
@keyframes chh{0%{opacity:0;transform:translate3d(0,0,0) scale(.6)}20%{opacity:.9}100%{opacity:0;transform:translate3d(12px,-130px,0) scale(1.15)}}
.cillu{position:relative}
.lfl{position:absolute;pointer-events:none;z-index:1}
.lfl svg,.wcl svg,.hle svg{width:100%;height:auto;display:block}
/* butterflies: two wings that flap in 3D (GPU only) */
.bf,.d-sagewc .cfx i{width:42px;height:34px;-webkit-perspective:160px;perspective:160px;background:linear-gradient(#5B4636,#5B4636) 50% 60%/2px 62% no-repeat}
.bf::before,.bf::after,.d-sagewc .cfx i::before,.d-sagewc .cfx i::after{content:"";position:absolute;top:0;width:50%;height:100%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 24'%3E%3Cpath d='M20 11C16 2 7-1 3 2S1 13 20 12z' fill='%23E3A7A2'/%3E%3Cpath d='M20 12C12 13 5 17 6 21s9 1 14-8z' fill='%23F2C9C4'/%3E%3Ccircle cx='9' cy='6' r='1.6' fill='%23fff' opacity='.7'/%3E%3Cpath d='M20 11C16 4 9 1 5 3' fill='none' stroke='%23B9706B' stroke-width='.6'/%3E%3C/svg%3E") center/contain no-repeat;will-change:transform;-webkit-backface-visibility:visible}
.bf::before,.d-sagewc .cfx i::before{left:0;transform-origin:100% 50%;animation:flapL .26s ease-in-out infinite alternate}
.bf::after,.d-sagewc .cfx i::after{left:0;transform-origin:100% 50%;animation:flapR .26s ease-in-out infinite alternate}
.bf:nth-child(2n)::before,.bf:nth-child(2n)::after,.d-sagewc .cfx i:nth-child(2n)::before,.d-sagewc .cfx i:nth-child(2n)::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 24'%3E%3Cpath d='M20 11C16 2 7-1 3 2S1 13 20 12z' fill='%239DB59A'/%3E%3Cpath d='M20 12C12 13 5 17 6 21s9 1 14-8z' fill='%23C9D8C2'/%3E%3Ccircle cx='9' cy='6' r='1.6' fill='%23fff' opacity='.7'/%3E%3Cpath d='M20 11C16 4 9 1 5 3' fill='none' stroke='%236F8F6C' stroke-width='.6'/%3E%3C/svg%3E")}
.bf:nth-child(3n)::before,.bf:nth-child(3n)::after,.d-sagewc .cfx i:nth-child(3n)::before,.d-sagewc .cfx i:nth-child(3n)::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 24'%3E%3Cpath d='M20 11C16 2 7-1 3 2S1 13 20 12z' fill='%23E8C98E'/%3E%3Cpath d='M20 12C12 13 5 17 6 21s9 1 14-8z' fill='%23F4E2BC'/%3E%3Ccircle cx='9' cy='6' r='1.6' fill='%23fff' opacity='.7'/%3E%3Cpath d='M20 11C16 4 9 1 5 3' fill='none' stroke='%23A9874A' stroke-width='.6'/%3E%3C/svg%3E")}
@keyframes flapL{from{transform:rotateY(0)}to{transform:rotateY(72deg)}}
@keyframes flapR{from{transform:rotateY(180deg)}to{transform:rotateY(108deg)}}

/* ---------------------------------------------------------------- SAGE GARDEN */
.d-sagewc{--fs:"Petit Formal Script",cursive;--fb:"Mulish",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-sagewc #intro{background:radial-gradient(ellipse at 30% 20%,#FFFFFF,#F4F1EA 55%,#ECE8DD);color:#2F3E2E}
.d-sagewc .ibg,.d-sagewc .iveil{display:none}
.wcl{position:absolute;z-index:2;width:min(58vw,300px);pointer-events:none}
.wcl.tl{left:-7%;top:-4%}
.wcl.br{right:-7%;bottom:-4%;transform:rotate(180deg)}
.wcl svg{transform-origin:0 0;animation:sway 6s ease-in-out infinite alternate}
#intro .wcl .lf{transform-box:fill-box;transform-origin:center;animation:lfin .9s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(.2s + var(--q) * .07s)}
@keyframes lfin{from{transform:scale(0) rotate(-30deg);opacity:0}}
.d-sagewc .ic{z-index:3;width:min(90vw,400px);gap:12px;padding:26px 16px 24px;background:rgba(255,255,255,.78);border:1px solid rgba(126,159,124,.45);border-radius:4px;outline:1px solid rgba(126,159,124,.28);outline-offset:-9px;box-shadow:0 30px 60px -34px rgba(47,62,46,.5)}
.d-sagewc .im{display:none}
.bmo{display:flex;align-items:center;justify-content:center;gap:6px;font:500 clamp(48px,13vw,64px)/1 var(--fd);color:#2F3E2E;letter-spacing:.02em}
.bmo i{font:400 .62em var(--fs);color:var(--acc2);font-style:normal;margin:0 2px}
.bmo span{display:inline-block;animation:bmoL 1.3s cubic-bezier(.2,.8,.2,1) .5s both}
.bmo span:last-child{animation-name:bmoR}
.bmo i{display:inline-block;animation:ampin 1s ease 1.1s both}
@keyframes bmoL{from{opacity:0;transform:translate3d(-24px,0,0)}}
@keyframes bmoR{from{opacity:0;transform:translate3d(24px,0,0)}}
.d-sagewc .yai{color:var(--acc);letter-spacing:.34em}.d-sagewc .yai i{background:var(--acc)}
.d-sagewc .ipf{border:3px solid #fff;border-radius:3px;box-shadow:0 0 0 1px rgba(126,159,124,.7),0 14px 26px -14px rgba(47,62,46,.6);background:linear-gradient(135deg,#9DB59A,#E3A7A2)}
.d-sagewc .ipn{color:#2F3E2E;font-size:clamp(19px,5.4vw,25px)}
.d-sagewc .ipr{color:#6E7A6B}
.d-sagewc .iph{fill:var(--acc2)}
.d-sagewc .icard{background:none;border:0;border-top:1px solid rgba(126,159,124,.4);border-bottom:1px solid rgba(126,159,124,.4);border-radius:0;padding:12px 8px;-webkit-backdrop-filter:none;backdrop-filter:none}
.d-sagewc .ict{color:var(--acc)}
.d-sagewc .icd{display:none}
.d-sagewc .ici,.d-sagewc .icv{color:#6E7A6B}
.d-sagewc .icl{background:var(--acc2)}
.dstrip{display:flex;align-items:center;justify-content:center;gap:10px;color:#2F3E2E}
.dstrip span{font:600 11px var(--fb);letter-spacing:.3em;text-transform:uppercase;padding:7px 4px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;min-width:78px}
.dstrip b{font:500 clamp(34px,9vw,44px)/1 var(--fd);color:var(--acc);font-variant-numeric:lining-nums}
.d-sagewc .ic>:nth-child(6){--k:6}.d-sagewc .ic>:nth-child(7){--k:7}
.d-sagewc .open-btn{border-radius:999px;background:var(--acc);letter-spacing:.2em}
.d-sagewc .open-btn::after{border-radius:999px;border-color:var(--acc)}
/* opening: leaves sweep away and a flutter of butterflies takes off */
.bburst{position:absolute;left:50%;top:56%;z-index:5;width:0;height:0;pointer-events:none}
.bburst .bf{position:absolute;left:-21px;top:-17px;opacity:0}
.bburst .bf:nth-child(1){--x:-38vw;--y:-40vh}.bburst .bf:nth-child(2){--x:36vw;--y:-44vh}.bburst .bf:nth-child(3){--x:-46vw;--y:6vh}.bburst .bf:nth-child(4){--x:44vw;--y:-6vh}.bburst .bf:nth-child(5){--x:-20vw;--y:-56vh}.bburst .bf:nth-child(6){--x:18vw;--y:-58vh}.bburst .bf:nth-child(7){--x:4vw;--y:-34vh}
.d-sagewc.opening .bburst .bf{animation:bout 1.7s cubic-bezier(.3,.6,.4,1) forwards;animation-delay:calc(var(--q) * .07s)}
@keyframes bout{0%{opacity:0;transform:translate3d(0,0,0) scale(.4) rotate(0)}14%{opacity:1}80%{opacity:1}100%{opacity:0;transform:translate3d(var(--x),var(--y),0) scale(1.4) rotate(18deg)}}
.d-sagewc.opening #intro .ic{transition:transform 1s cubic-bezier(.6,0,.4,1),opacity .8s;transform:translate3d(0,-5%,0) scale(.95);opacity:0}
.d-sagewc.opening .wcl.tl{transition:transform 1.3s cubic-bezier(.6,0,.4,1);transform:translate3d(-70%,-60%,0)}
.d-sagewc.opening .wcl.br{transition:transform 1.3s cubic-bezier(.6,0,.4,1);transform:rotate(180deg) translate3d(-70%,-60%,0)}
.d-sagewc.opening #intro{transition:opacity .9s ease .85s;opacity:0}
/* hero: framed photo slideshow on watercolour paper */
.d-sagewc .hero{background:radial-gradient(ellipse at 50% 20%,#FFFFFF,#F6F3EC 60%,#EEEADF);color:#2F3E2E}
.d-sagewc .ss{left:50%;right:auto;top:clamp(80px,12vh,118px);bottom:auto;width:min(74vw,380px);aspect-ratio:.8;margin-left:calc(min(74vw,380px) / -2);overflow:hidden;border:8px solid #fff;border-radius:2px;box-shadow:0 0 0 1px rgba(126,159,124,.55),0 30px 50px -28px rgba(47,62,46,.6);z-index:1}
.d-sagewc .sl{transition:opacity 1.4s ease,transform 1.7s cubic-bezier(.3,.7,.2,1);transform:translate3d(0,9%,0) scale(1.1);opacity:0}
.d-sagewc .sl.on{transform:translate3d(0,0,0) scale(1);opacity:1}
.d-sagewc .sl.out{transform:translate3d(0,-5%,0) scale(1.04);opacity:1}
.d-sagewc .sl.art{background:linear-gradient(140deg,#B9CDB3,#E3A7A2)}
.d-sagewc .hveil{display:none}
.wcl.hl{left:calc(50% - min(74vw,380px) / 2 - min(14vw,64px));top:calc(clamp(80px,12vh,118px) - min(14vw,64px));width:min(40vw,200px)}
.wcl.hr{left:calc(50% + min(74vw,380px) / 2 - min(40vw,200px) + min(14vw,64px));top:calc(clamp(80px,12vh,118px) + min(74vw,380px) * 1.25 - min(40vw,200px) + min(14vw,64px));width:min(40vw,200px);transform:rotate(180deg)}
.hero .wcl .lf{opacity:0;transform-box:fill-box;transform-origin:center}
.is-open .hero .wcl .lf{animation:lfin .9s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(.6s + var(--q) * .07s);opacity:1}
.d-sagewc .hero-in{padding-top:calc(min(74vw,380px) * 1.25 + clamp(80px,12vh,118px) + 34px);padding-bottom:110px}
.d-sagewc .hm{display:none}
.d-sagewc .wgm{color:var(--acc);font-weight:600}
.d-sagewc .hero .nm{color:#2F3E2E;text-shadow:none;font-size:calc(var(--nk,1) * clamp(34px,9.4vw,70px));margin:10px 0 16px}
.d-sagewc .nm .amp{color:var(--acc2)}
.d-sagewc .quote{color:#6E7A6B;text-shadow:none}
.d-sagewc .quote::before,.d-sagewc .quote::after{color:var(--acc2)}
.dstrip.hd{margin:0 0 22px}
.d-sagewc .cdcap{font:400 clamp(17px,4.6vw,22px) var(--fs);color:#2F3E2E}
.d-sagewc .cdcap b{font-weight:400;color:var(--acc)}
.d-sagewc .cd{gap:0;background:linear-gradient(135deg,#7E9F7C,#6F8F6C);border-radius:16px;padding:12px 4px;box-shadow:0 20px 34px -20px rgba(47,62,46,.7)}
.d-sagewc .cdu{width:clamp(66px,19vw,104px);aspect-ratio:auto;padding:4px 0;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-right:1px solid rgba(255,255,255,.35)}
.d-sagewc .cdu:last-child{border-right:0}
.d-sagewc .cdu svg{display:none}
.d-sagewc .cdu b{font-family:var(--fd);font-weight:600;color:#fff;font-variant-numeric:lining-nums tabular-nums}
.d-sagewc .cdu span{color:rgba(255,255,255,.85)}
.d-sagewc .cd-note{color:var(--acc)}
.d-sagewc .ssd i{background:rgba(126,159,124,.35)}.d-sagewc .ssd i.on{background:var(--acc)}
.d-sagewc .scroll-hint{border-color:var(--acc)}.d-sagewc .scroll-hint span{background:var(--acc)}
.d-sagewc .nav{background:rgba(255,255,255,.9);border-color:rgba(126,159,124,.3)}.d-sagewc .nav a{color:#2F3E2E}.d-sagewc .nav a.on,.d-sagewc .nav a:hover{color:#fff}
/* butterflies drifting across the page */
.d-sagewc .cfx i{position:absolute;top:0;left:0;opacity:.95;animation:bwander calc(17s + var(--q) * 2.2s) linear infinite;animation-delay:calc(var(--q) * -3.4s)}
.d-sagewc .cfx i:nth-child(2n){animation-name:bwander2}
.d-sagewc .cfx i:nth-child(n+6){display:none}
@keyframes bwander{0%{transform:translate3d(-12vw,82vh,0) rotate(18deg)}25%{transform:translate3d(22vw,58vh,0) rotate(-8deg)}50%{transform:translate3d(46vw,66vh,0) rotate(14deg)}75%{transform:translate3d(72vw,38vh,0) rotate(-6deg)}100%{transform:translate3d(112vw,22vh,0) rotate(10deg)}}
@keyframes bwander2{0%{transform:translate3d(112vw,70vh,0) rotate(-16deg)}25%{transform:translate3d(76vw,40vh,0) rotate(8deg)}50%{transform:translate3d(52vw,52vh,0) rotate(-14deg)}75%{transform:translate3d(24vw,24vh,0) rotate(6deg)}100%{transform:translate3d(-12vw,12vh,0) rotate(-10deg)}}
/* couple */
.lfl.cl,.lfl.cr{width:min(34vw,200px);opacity:.75}
.lfl.cl{left:-30px;top:20px}
.lfl.cr{right:-30px;bottom:20px;transform:rotate(180deg)}
.d-sagewc .h2{color:#2F3E2E}
.d-sagewc .pf{background:#fff;padding:10px;box-shadow:0 0 0 1px rgba(126,159,124,.5),0 26px 40px -26px rgba(47,62,46,.6)}
.d-sagewc .pfo{display:none}
.d-sagewc .pfi{border-radius:0}
.d-sagewc .pc h3{font-family:var(--fs);font-size:clamp(24px,6vw,32px)}
.d-sagewc .cillu{color:var(--acc)}
.d-sagewc .strip{background:var(--acc);color:#fff}
.d-sagewc .strip b{font-size:clamp(18px,4.6vw,24px)}
.d-sagewc .strip i{fill:#F2C9C4}
/* when & where: ivory cards between wavy blush rules */
.d-sagewc .when{background:#F1EEE5;color:#2F3E2E}
.d-sagewc .wave{fill:#F1EEE5}
.d-sagewc .when .k{color:var(--acc)}.d-sagewc .when .h2{color:#2F3E2E}
.wrule{display:block;width:min(80%,520px);height:16px;margin:-10px auto 34px;fill:none;stroke:var(--acc2);stroke-width:2.2}
.evs+.wrule{margin:40px auto 0}
.d-sagewc .ev{background:#fff;border:1px solid rgba(126,159,124,.35);box-shadow:0 20px 40px -30px rgba(47,62,46,.5)}
.d-sagewc .ev .evi{background:#F5F7F1;border-color:#fff;color:var(--acc);box-shadow:0 0 0 1px rgba(126,159,124,.4)}
.d-sagewc .evdate{background:var(--acc)}
.d-sagewc .evb h3{font:400 clamp(24px,6vw,30px) var(--fs);color:#2F3E2E}
.d-sagewc .btn.w{background:var(--acc);color:#fff;border-color:var(--acc)}
.d-sagewc .btn.wg{color:var(--acc);border-color:var(--acc)}
.d-sagewc .foot::before{background:linear-gradient(180deg,rgba(47,62,46,.4),rgba(84,112,82,.85))}
.d-sagewc .ft-n span{color:#F2C9C4}

/* ---------------------------------------------------------------- LAVENDER TWILIGHT */
.d-twilight{--fs:"Alex Brush",cursive;--fb:"Josefin Sans",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-twilight #intro{background:#1E1033}
.d-twilight .ibg{animation:none;transform:scale(1.08)}
.d-twilight .ibg img{filter:blur(3px) saturate(1.1)}
.d-twilight .iveil{background:radial-gradient(ellipse at 50% 30%,rgba(120,70,160,.25),rgba(30,16,51,.75) 70%),linear-gradient(180deg,rgba(30,16,51,.45),rgba(30,16,51,.85))}
.d-twilight .ic{z-index:3;width:min(90vw,400px);gap:12px;padding:26px 18px 24px;border-radius:26px;background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.35);box-shadow:0 30px 60px -24px rgba(10,0,30,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.d-twilight .im,.d-twilight .yai{display:none}
.stdh{font:700 clamp(24px,7vw,32px)/1 var(--fb);letter-spacing:.24em;text-transform:uppercase;color:#fff}
.stdh em{font:400 1.25em var(--fs);letter-spacing:0;text-transform:none;color:var(--acc2);display:inline-block;transform:translateY(.08em);animation:ampin 1s ease 1s both}
.d-twilight .ipf{border:2px solid rgba(255,255,255,.85);border-radius:14px;box-shadow:0 0 0 5px rgba(255,255,255,.08),0 14px 30px -12px rgba(0,0,0,.7)}
.d-twilight .ipn{font-size:clamp(28px,8vw,34px);color:#fff}
.d-twilight .iph{fill:var(--acc2)}
.d-twilight .icard{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);border-radius:16px;-webkit-backdrop-filter:none;backdrop-filter:none}
.d-twilight .ict{color:var(--acc2)}
.d-twilight .icl{background:var(--acc2)}
.d-twilight .open-btn{border-radius:999px;background:#fff;color:#2A1840;box-shadow:0 14px 30px -12px rgba(243,193,217,.8)}
.d-twilight .open-btn span::after{content:" \2665";color:#C46A9A}
.d-twilight .open-btn::after{border-radius:999px;border-color:#fff}
.tglow{position:absolute;left:50%;top:50%;z-index:4;width:70vmax;height:70vmax;margin:-35vmax 0 0 -35vmax;border-radius:50%;background:radial-gradient(circle,rgba(255,236,246,.95),rgba(243,193,217,.55) 30%,rgba(185,138,214,.2) 55%,transparent 70%);opacity:0;pointer-events:none}
.d-twilight.opening .tglow{animation:tglow 1.6s ease-out forwards}
@keyframes tglow{0%{opacity:0;transform:scale(.15)}35%{opacity:1}100%{opacity:0;transform:scale(2.6)}}
.d-twilight.opening #intro .ic{transition:transform 1.1s cubic-bezier(.6,0,.3,1),opacity .7s ease .35s;transform:perspective(900px) rotateY(-100deg) scale(.8);opacity:0}
.d-twilight.opening #intro{transition:opacity .9s ease .95s;opacity:0}
/* hero: dreamy full-screen slideshow */
.d-twilight .hero{background:#1E1033}
.d-twilight .sl{transition:opacity 1.8s ease,transform 7s cubic-bezier(.2,.6,.3,1);transform:scale(1.2) rotate(1.2deg);opacity:0}
.d-twilight .sl.on{transform:scale(1.03) rotate(0);opacity:1}
.d-twilight .sl.out{transform:scale(1) rotate(0);opacity:1}
.d-twilight .hveil{background:linear-gradient(180deg,rgba(30,16,51,.45) 0,rgba(30,16,51,.05) 20%,rgba(30,16,51,.32) 34%,rgba(30,16,51,.78) 48%,rgba(24,12,42,.94) 100%)}
.d-twilight .hm{display:none}
.d-twilight .wgm{font-weight:600;letter-spacing:.32em}
.d-twilight .hero .nm{color:#fff;text-shadow:0 0 26px rgba(243,193,217,.65),0 4px 20px rgba(0,0,0,.4)}
.d-twilight .nm .amp{color:var(--acc2)}
.d-twilight .cdu{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.55);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 0 30px -8px rgba(243,193,217,.6)}
.d-twilight .cdu .rt{stroke:rgba(255,255,255,.12)}.d-twilight .cdu .rp{stroke:var(--acc2)}
.d-twilight .cdu b{font-weight:600}
.d-twilight .cfx i{background:#F3C1D9;border-radius:80% 0 80% 0;width:12px;height:15px;opacity:.9;animation-name:ptum}
.d-twilight .cfx i:nth-child(2n){background:#D9B8EE}
.d-twilight .cfx i:nth-child(3n){background:#fff;opacity:.75}
@keyframes ptum{0%{transform:translate3d(0,0,0) rotate(0) rotateX(0)}50%{transform:translate3d(30px,55vh,0) rotate(180deg) rotateX(180deg)}100%{transform:translate3d(-14px,112vh,0) rotate(360deg) rotateX(360deg)}}
/* couple */
.d-twilight .cbg{opacity:.1;filter:blur(1px)}
.d-twilight .pfo{transform:none;border:1px solid var(--gold);border-radius:4px}
.d-twilight .pfo::after{transform:none;inset:-7px;border:1px solid var(--gold);border-radius:6px}
.d-twilight .pc:hover .pfo{transform:none}
.d-twilight .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
@keyframes tfr{from{transform:scale(.86);opacity:0}}
.d-twilight .pfi{border-radius:2px}
.d-twilight .pc h3{font:400 clamp(32px,8vw,42px) var(--fs)}
.d-twilight .cillu{color:#A77BC6}
/* LOVE • HAPPINESS • FOREVER photo marquee */
.pstrip{overflow:hidden;background:#fff;color:#2A1840;padding:16px 0;border-top:1px solid rgba(42,24,64,.08);border-bottom:1px solid rgba(42,24,64,.08)}
.pstrip>div{display:flex;width:max-content;animation:mq 30s linear infinite}
.pstrip span{display:flex;align-items:center}
.pstrip b{font:700 clamp(24px,6.4vw,38px)/1 var(--fb);letter-spacing:.04em;text-transform:uppercase;padding:0 18px;white-space:nowrap}
.pstrip b:nth-of-type(2n){color:#8E6A9E}
.pp-ph{display:block;flex:none;width:clamp(64px,16vw,96px);height:clamp(38px,9.5vw,56px);border-radius:14px;overflow:hidden;box-shadow:0 6px 14px -6px rgba(42,24,64,.5)}
.pp-ph img{width:100%;height:100%;object-fit:cover}
.pp-h{display:block;width:22px;fill:var(--acc)}
.pp-h svg{width:100%;display:block}
/* when & where: mauve band, venue photo overlapping the card */
.d-twilight .when{background:linear-gradient(180deg,#8E6A9E,#6B4C7E)}
.d-twilight .wave{fill:#8E6A9E}.d-twilight .wave.b{fill:#6B4C7E}
.d-twilight .ev{background:rgba(255,255,255,.18);border-radius:22px}
.d-twilight .ev .evi{border-radius:20px;color:#8E6A9E}
.evp{width:100%;height:100%;object-fit:cover;border-radius:14px}
@media (max-width:520px){.d-twilight .ev,.d-twilight .ev.alt{padding-top:100px}}
.d-twilight .evdate{background:#2A1840}
.d-twilight .evb h3{font:400 clamp(34px,8vw,42px) var(--fs)}
.d-twilight .btn.w{color:#6B4C7E}
.d-twilight .h2.scr,.d-twilight .ty{font-family:var(--fs)}
.d-twilight .foot::before{background:linear-gradient(180deg,rgba(30,16,51,.4),rgba(70,40,100,.85))}
.d-twilight .ft-n span{color:var(--acc2)}

/* ---------------------------------------------------------------- BLESSED BEGINNING (maroon) */
.d-maroon{--fs:"Pinyon Script",cursive;--fb:"Lora",Georgia,serif;--fd:"Cinzel",serif}
.d-maroon .iveil{background:linear-gradient(180deg,rgba(58,10,18,.8),rgba(58,10,18,.62) 45%,rgba(36,5,10,.94))}
.swf{position:absolute;inset:14px;z-index:2;border:2px dotted rgba(216,178,106,.85);border-radius:8px;pointer-events:none;animation:swfin 1.4s cubic-bezier(.2,.8,.2,1) .1s both}
.swf i{position:absolute;width:clamp(50px,13vw,70px);color:#D8B26A}
.swf i svg{width:100%;display:block}
.swf .tl{top:-9px;left:-9px}.swf .tr{top:-9px;right:-9px;transform:rotate(90deg)}.swf .br{bottom:-9px;right:-9px;transform:rotate(180deg)}.swf .bl{bottom:-9px;left:-9px;transform:rotate(270deg)}
@keyframes swfin{from{opacity:0;transform:scale(.96)}}
.rays{position:absolute;left:50%;top:40%;z-index:1;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;background:repeating-conic-gradient(from 0deg,rgba(231,194,125,.05) 0 5deg,transparent 5deg 15deg);border-radius:50%;animation:spin 80s linear infinite;pointer-events:none}
.fringe{position:absolute;left:0;right:0;bottom:0;height:16px;z-index:4;background:radial-gradient(circle at 10px 16px,#D8B26A 9px,transparent 10px) 0 0/20px 16px repeat-x;opacity:0;transition:opacity .3s}
.d-maroon .ic{z-index:3}
.d-maroon .im{display:none}
.hle{display:block;width:clamp(70px,20vw,92px);color:#D8B26A}
#intro .hle .illu path{animation:draw 2.4s ease forwards}
#intro .hle .illu path:nth-child(2){animation-delay:.4s}#intro .hle .illu path:nth-child(3){animation-delay:.8s}#intro .hle .illu path:nth-child(4){animation-delay:1.1s}#intro .hle .illu path:nth-child(5){animation-delay:1.4s}
.d-maroon .yai{color:#E7C27D}.d-maroon .yai i{background:#E7C27D}
.d-maroon .ipf{border:2px solid #D8B26A;border-radius:4px;box-shadow:0 0 0 4px rgba(216,178,106,.16),0 16px 30px -12px rgba(0,0,0,.8)}
.d-maroon .iph{fill:#D8B26A}
.d-maroon .icard{background:rgba(58,10,18,.65);border:1px solid rgba(216,178,106,.55);border-radius:6px}
.d-maroon .ict{color:#E7C27D;font-family:var(--fd)}
.d-maroon .icl{background:#D8B26A}
.d-maroon .open-btn{border-radius:999px;background:linear-gradient(180deg,#F0D49A,#C2964A);color:#3A0A12;font-family:var(--fd);letter-spacing:.2em;box-shadow:0 14px 30px -12px rgba(216,178,106,.7)}
.d-maroon .open-btn::after{border-radius:999px;border-color:#D8B26A}
/* opening: the page lifts like a curtain with a golden scalloped hem */
.d-maroon.opening .hle{animation:beat 1s ease}
.d-maroon.opening .fringe{opacity:1}
.d-maroon.opening .ibg{transform:none}
.d-maroon.opening #intro .ic{opacity:1;transform:none}
.d-maroon.opening #intro{opacity:1;transition:transform 1.3s cubic-bezier(.7,0,.25,1) .45s;transform:translate3d(0,-104%,0)}
/* hero: full photo, slides drop in like a panel, dotted swirl frame */
.d-maroon .hero{background:#3A0A12}
.d-maroon .sl{opacity:1;transform:translate3d(0,-100%,0);transition:transform 1.5s cubic-bezier(.7,0,.2,1)}
.d-maroon .sl.on{transform:translate3d(0,0,0)}
.d-maroon .sl.out{transform:translate3d(0,22%,0)}
.d-maroon .sl.on img,.d-maroon .sl.out img{animation:kbz 8s ease-out both}
.swf.hs{z-index:2;inset:12px}
.d-maroon .hveil{background:linear-gradient(180deg,rgba(58,10,18,.45) 0,rgba(58,10,18,.08) 18%,rgba(58,10,18,.4) 32%,rgba(40,6,12,.84) 46%,rgba(36,5,10,.96) 100%)}
.d-maroon .hm{display:none}
.d-maroon .hero-in{z-index:3}
.d-maroon .mono{color:#D8B26A}
.d-maroon .wgm{font-family:var(--fd);color:#E7C27D;letter-spacing:.24em}
.d-maroon .hero .nm{color:#FFF6EA}
.d-maroon .nm .amp{color:#E7C27D}
.d-maroon .cdcap{font:400 clamp(20px,5.4vw,28px)/1.25 var(--fs);color:#E7C27D;max-width:88vw}
.d-maroon .cd{gap:clamp(6px,2.4vw,14px);padding:10px clamp(10px,3vw,18px);border-radius:999px;background:rgba(255,249,242,.12);border:1px solid rgba(216,178,106,.65)}
.d-maroon .cdu{width:clamp(58px,15.5vw,82px);background:#FFF9F2;color:#3A0A12;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 8px 18px -8px rgba(0,0,0,.6)}
.d-maroon .cdu .rt{stroke:rgba(139,30,45,.15)}.d-maroon .cdu .rp{stroke:#8B1E2D}
.d-maroon .cdu b{font-family:var(--fd);font-weight:600;font-size:clamp(18px,5.4vw,30px);color:#3A0A12}
.d-maroon .cdu span{color:#8B1E2D;font-size:clamp(6.5px,1.8vw,9px)}
.d-maroon .cfx i{top:auto;bottom:-30px;width:16px;height:16px;fill:#D8B26A;opacity:.6;animation-name:crise}
.d-maroon .cfx i:nth-child(2n){fill:#C2414F;width:12px;height:12px}
/* couple */
.hle.ch{position:absolute;left:50%;top:26px;width:64px;margin-left:-32px;z-index:2;color:#8B1E2D}
.hle.ch.in .illu path{animation:draw 2.4s ease forwards}
.d-maroon .couple .sec{padding-top:110px}
.d-maroon .k{color:#8B1E2D}
.d-maroon .h2{color:#3A0A12}
.d-maroon .when .h2{color:#FFF6EA}
.d-maroon .verse,.d-maroon .quote{font-family:var(--fb);font-style:italic;font-weight:400}
.d-maroon .pfo{transform:none;border:2px solid var(--gold);border-radius:4px}
.d-maroon .pfo::after{transform:none;inset:-8px;border:2px dotted var(--gold);border-radius:8px}
.d-maroon .pc:hover .pfo{transform:none}
.d-maroon .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-maroon .pfi{border-radius:2px}
.d-maroon .pc .role{color:#8B1E2D;font-family:var(--fd)}
.d-maroon .pc h3{font:400 clamp(34px,8.4vw,44px) var(--fs);color:#3A0A12}
.d-maroon .cillu{color:#8B1E2D}
.d-maroon .strip{background:linear-gradient(90deg,#6E1422,#8B1E2D,#6E1422);color:#F0D49A}
.d-maroon .strip i{fill:#D8B26A}
/* when & where: cream venue cards with dotted borders */
.d-maroon .when{background:linear-gradient(180deg,#6E1422,#3A0A12)}
.d-maroon .wave{fill:#6E1422}.d-maroon .wave.b{fill:#3A0A12}
.d-maroon .when .k{color:#E7C27D}
.d-maroon .ev{background:#FFF9F2;color:#3A0A12;border:2px dotted #D8B26A}
.d-maroon .ev .evi{color:#8B1E2D;border-color:#FFF9F2;box-shadow:0 0 0 2px #D8B26A,0 14px 30px -14px rgba(0,0,0,.5)}
.d-maroon .evdate{background:#8B1E2D}
.d-maroon .evb h3{font:400 clamp(32px,8vw,40px) var(--fs);color:#8B1E2D}
.d-maroon .btn{background:#8B1E2D;border-color:#8B1E2D}
.d-maroon .btn.w{background:#8B1E2D;color:#fff;border-color:#8B1E2D}
.d-maroon .btn.wg{color:#8B1E2D;border-color:#8B1E2D;background:transparent}
.d-maroon .btn.ghost{background:transparent;color:#8B1E2D}
.d-maroon .btn.wa{background:#25D366;border-color:#25D366}
.d-maroon .foot::before{background:linear-gradient(180deg,rgba(58,10,18,.45),rgba(90,14,26,.88))}
.d-maroon .ft-n span{color:#D8B26A}

/* ---------------------------------------------------------------- PURE GRACE (ivory & sage minimal) */
.d-grace{--fs:"Cormorant Garamond",serif;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-grace .scr{font-style:italic;font-weight:500}
.d-grace #intro{background:transparent;color:#3A3A33}
.d-grace .ibg,.d-grace .iveil{display:none}
.gate{position:absolute;top:0;bottom:0;width:50.5%;z-index:1;overflow:hidden;background:#FAF6EF;will-change:transform}
.gate.l{left:0;box-shadow:inset -14px 0 22px -18px rgba(58,58,51,.35)}
.gate.r{right:0;box-shadow:inset 14px 0 22px -18px rgba(58,58,51,.35)}
.blob{position:absolute;width:80vmin;height:80vmin;border-radius:50%;will-change:transform;animation:blobm 12s ease-in-out infinite alternate}
.blob.b1{left:-30vmin;top:-26vmin;background:radial-gradient(circle at 45% 50%,rgba(143,165,138,.42),rgba(143,165,138,.16) 45%,rgba(143,165,138,0) 70%)}
.blob.b2{left:-24vmin;bottom:-30vmin;background:radial-gradient(circle at 50% 45%,rgba(227,185,168,.45),rgba(227,185,168,.16) 45%,rgba(227,185,168,0) 70%);animation-delay:-4s}
.blob.b3{right:-28vmin;top:-30vmin;background:radial-gradient(circle at 50% 55%,rgba(227,185,168,.42),rgba(227,185,168,.15) 45%,rgba(227,185,168,0) 70%);animation-delay:-7s}
.blob.b4{right:-26vmin;bottom:-26vmin;background:radial-gradient(circle at 45% 45%,rgba(143,165,138,.4),rgba(143,165,138,.15) 45%,rgba(143,165,138,0) 70%);animation-delay:-2s}
@keyframes blobm{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(4vmin,3vmin,0) scale(1.12)}}
.gate .lfl{width:min(30vw,150px);color:var(--acc)}
.gate.l .lfl{left:6px;bottom:4%}
.gate.r .lfl{right:6px;top:4%;transform:rotate(180deg)}
#intro .lfl path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 3s ease forwards}
#intro .lfl path:nth-child(2){animation-delay:.6s}#intro .lfl path:nth-child(3){animation-delay:1.1s}#intro .lfl path:nth-child(4){animation-delay:1.5s}
.d-grace .ic{z-index:3;width:min(88vw,400px);gap:12px;padding:24px 16px 24px;background:#FFFDF8;border:1px solid rgba(195,165,116,.55);border-radius:2px;box-shadow:0 0 0 7px #FFFDF8,0 0 0 8px rgba(195,165,116,.4),0 34px 60px -30px rgba(58,58,51,.4)}
.d-grace .im{width:74px}
.d-grace .yai{color:var(--acc)}.d-grace .yai i{background:var(--acc)}
.d-grace .ipf{border:1px solid var(--gold);padding:4px;border-radius:0;background:#fff;box-shadow:0 12px 24px -14px rgba(58,58,51,.5)}
.d-grace .ipf img{border-radius:0}
.d-grace .ipf.noimg{background:linear-gradient(140deg,#B8C9B3,#E3B9A8)}
.d-grace .ipn{font:italic 500 clamp(26px,7.4vw,32px)/1.1 var(--fd);color:#3A3A33}
.d-grace .ipr{color:#7A786E}
.d-grace .iph{fill:var(--acc2)}
.d-grace .icard{background:none;border:0;border-top:1px solid rgba(195,165,116,.5);border-radius:0;padding:14px 4px 2px;-webkit-backdrop-filter:none;backdrop-filter:none}
.d-grace .ict{color:var(--acc)}
.d-grace .icd{font:500 21px var(--fd);color:#3A3A33;font-variant-numeric:lining-nums}
.d-grace .ici,.d-grace .icv{color:#7A786E}
.d-grace .icl{background:var(--gold)}
.d-grace .open-btn{border-radius:2px;background:var(--acc);letter-spacing:.24em;font-weight:500}
.d-grace .open-btn::after{border-radius:4px;border-color:var(--acc)}
/* wax seal that breaks before the gates open */
.seal{position:absolute;left:50%;top:50%;z-index:6;width:96px;height:96px;margin:-48px 0 0 -48px;opacity:0;transform:scale(.3);pointer-events:none}
.sh{position:absolute;top:0;bottom:0;width:50%;overflow:hidden}
.sh.l{left:0}.sh.r{right:0}
.sh b{position:absolute;top:0;width:96px;height:96px;border-radius:50%;display:grid;place-items:center;font:italic 500 32px var(--fd);letter-spacing:.04em;color:#F4F1E6;background:radial-gradient(circle at 35% 30%,#AFC4A9,#7F977B 55%,#5D775A);box-shadow:inset 0 0 0 7px rgba(255,255,255,.1),inset 0 0 0 9px rgba(0,0,0,.08),inset 0 -8px 14px rgba(0,0,0,.25),0 8px 18px -6px rgba(0,0,0,.4)}
.sh.l b{left:0}.sh.r b{right:0}
.d-grace.opening #intro{opacity:1;transition:none}
.d-grace.opening #intro .ic{transition:transform .7s cubic-bezier(.6,0,.4,1),opacity .5s;transform:scale(.94);opacity:0}
.d-grace.opening .seal{animation:sealin .5s cubic-bezier(.3,1.5,.5,1) .3s forwards}
@keyframes sealin{to{opacity:1;transform:scale(1)}}
.d-grace.opening .sh.l{animation:shl .75s cubic-bezier(.6,0,.4,1) 1s forwards}
.d-grace.opening .sh.r{animation:shr .75s cubic-bezier(.6,0,.4,1) 1s forwards}
@keyframes shl{to{transform:translate3d(-70px,40px,0) rotate(-38deg);opacity:0}}
@keyframes shr{to{transform:translate3d(70px,40px,0) rotate(38deg);opacity:0}}
.d-grace.opening .gate.l{transition:transform 1.1s cubic-bezier(.7,0,.2,1) .95s;transform:translate3d(-101%,0,0)}
.d-grace.opening .gate.r{transition:transform 1.1s cubic-bezier(.7,0,.2,1) .95s;transform:translate3d(101%,0,0)}
/* hero: framed carousel on ivory with watercolour blooms */
.d-grace .hero{background:#FCFAF5;color:#3A3A33}
.hblobs{position:absolute;left:50%;top:clamp(60px,9vh,100px);width:min(96vw,520px);aspect-ratio:.9;margin-left:calc(min(96vw,520px) / -2);pointer-events:none}
.hblobs .blob{width:62%;height:auto;aspect-ratio:1}
.hblobs .b1{left:-8%;top:-4%;background:radial-gradient(circle,rgba(143,165,138,.45),rgba(143,165,138,.15) 45%,rgba(143,165,138,0) 70%)}
.hblobs .b2{right:-10%;top:28%;left:auto;bottom:auto;background:radial-gradient(circle,rgba(227,185,168,.5),rgba(227,185,168,.16) 45%,rgba(227,185,168,0) 70%);animation-delay:-5s}
.hblobs .b3{left:10%;bottom:-6%;top:auto;right:auto;background:radial-gradient(circle,rgba(195,165,116,.32),rgba(195,165,116,.1) 45%,rgba(195,165,116,0) 70%);animation-delay:-8s}
.d-grace .ss{left:50%;right:auto;top:clamp(90px,13vh,130px);bottom:auto;width:min(70vw,340px);aspect-ratio:.78;margin-left:calc(min(70vw,340px) / -2);overflow:hidden;border:10px solid #fff;box-shadow:0 0 0 1px rgba(195,165,116,.55),0 26px 50px -26px rgba(58,58,51,.5);z-index:1}
.d-grace .sl{opacity:1;transform:translate3d(100%,0,0);transition:transform 1.4s cubic-bezier(.7,0,.2,1)}
.d-grace .sl.on{transform:translate3d(0,0,0)}
.d-grace .sl.out{transform:translate3d(-100%,0,0)}
.d-grace .sl img{transition:transform 1.4s cubic-bezier(.7,0,.2,1);transform:scale(1.18) translate3d(-8%,0,0)}
.d-grace .sl.on img{transform:scale(1.06) translate3d(0,0,0)}
.d-grace .sl.out img{transform:scale(1.18) translate3d(8%,0,0)}
.d-grace .sl.art{background:linear-gradient(140deg,#C9D6C4,#EED3C7)}
.d-grace .hveil{display:none}
.lfl.hl,.lfl.hr{top:calc(clamp(90px,13vh,130px) + min(70vw,340px) * .55);width:min(28vw,130px);color:var(--acc);z-index:0}
.lfl.hl{left:calc(50% - min(70vw,340px) / 2 - min(20vw,96px))}
.lfl.hr{left:calc(50% + min(70vw,340px) / 2 + min(20vw,96px) - min(28vw,130px));transform:scaleX(-1)}
.hero .lfl path{stroke-dasharray:1;stroke-dashoffset:1}
.is-open .hero .lfl path{animation:draw 3s ease .8s forwards}
.is-open .hero .lfl path:nth-child(2){animation-delay:1.3s}.is-open .hero .lfl path:nth-child(3){animation-delay:1.7s}
.d-grace .hero-in{padding-top:calc(min(70vw,340px) / .78 + clamp(90px,13vh,130px) + 36px);padding-bottom:110px}
.d-grace .hm{display:none}
.d-grace .wgm{color:var(--acc);font-weight:500;letter-spacing:.34em}
.d-grace .hero .nm{font:italic 500 calc(var(--nk,1) * clamp(44px,11.5vw,86px))/1.12 var(--fd);color:#3A3A33;text-shadow:none}
.d-grace .nm .amp{color:var(--gold)}
.d-grace .quote{color:#7A786E;text-shadow:none}
.d-grace .quote::before,.d-grace .quote::after{color:var(--gold)}
.d-grace .cdcap{font:italic 400 clamp(18px,4.8vw,22px) var(--fd);color:#7A786E}
.d-grace .cd{gap:0}
.d-grace .cdu{width:clamp(66px,19vw,104px);aspect-ratio:auto;padding:4px 0;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-right:1px solid rgba(195,165,116,.55)}
.d-grace .cdu:last-child{border-right:0}
.d-grace .cdu svg{display:none}
.d-grace .cdu b{font:500 clamp(34px,9.4vw,54px)/1 var(--fd);color:#3A3A33;font-variant-numeric:lining-nums tabular-nums}
.d-grace .cdu span{color:var(--acc)}
.d-grace .cd-note{color:var(--acc)}
.d-grace .ssd i{background:rgba(143,165,138,.35)}.d-grace .ssd i.on{background:var(--acc)}
.d-grace .scroll-hint{border-color:var(--acc)}.d-grace .scroll-hint span{background:var(--acc)}
.d-grace .nav{background:rgba(255,255,255,.92);border-color:rgba(195,165,116,.35)}.d-grace .nav a{color:#3A3A33}.d-grace .nav a.on,.d-grace .nav a:hover{color:#fff}
/* doves gliding across */
.d-grace .cfx i{top:0;left:0;width:54px;height:35px;opacity:1;filter:drop-shadow(0 3px 4px rgba(58,58,51,.18));background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 26'%3E%3Cpath d='M3 17c5 1 9-1 13-1 6 0 9-7 15-7 2 0 4 1 5 2l-3 1c-2 7-9 11-17 11-6 0-10-2-13-6z' fill='%23fff' stroke='%23889385' stroke-width='1'/%3E%3Cpath d='M36 11l3 .5-3 1z' fill='%23C3A574'/%3E%3Ccircle cx='32.5' cy='11.2' r='.8' fill='%235F6A5C'/%3E%3C/svg%3E") center/contain no-repeat;animation:dfly calc(15s + var(--q) * 2.5s) linear infinite;animation-delay:calc(var(--q) * -4.1s)}
.d-grace .cfx i::before{content:"";position:absolute;left:16px;top:-12px;width:24px;height:23px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 17'%3E%3Cpath d='M2 16C4 8 10 2 17 1c-1 6-6 13-15 15z' fill='%23fff' stroke='%23889385' stroke-width='1'/%3E%3Cpath d='M6 12c2-3 5-6 9-8' fill='none' stroke='%23C9D1C5' stroke-width='.7'/%3E%3C/svg%3E") center/contain no-repeat;transform-origin:10% 100%;animation:dflap .42s ease-in-out infinite alternate;will-change:transform}
.d-grace .cfx i:nth-child(n+5){display:none}
.d-grace .cfx i:nth-child(1){--y0:14vh}.d-grace .cfx i:nth-child(2){--y0:34vh}.d-grace .cfx i:nth-child(3){--y0:58vh}.d-grace .cfx i:nth-child(4){--y0:24vh}
@keyframes dfly{0%{transform:translate3d(-14vw,var(--y0),0)}25%{transform:translate3d(22vw,calc(var(--y0) - 4vh),0)}50%{transform:translate3d(50vw,calc(var(--y0) + 2vh),0)}75%{transform:translate3d(78vw,calc(var(--y0) - 5vh),0)}100%{transform:translate3d(114vw,var(--y0),0)}}
@keyframes dflap{from{transform:rotate(-18deg)}to{transform:rotate(62deg) scaleY(.75)}}
/* couple */
.d-grace .lfl.cl,.d-grace .lfl.cr{color:var(--acc);width:min(26vw,150px);opacity:.8}
.d-grace .h2{color:#3A3A33}
.d-grace .pf{background:#fff;padding:10px;box-shadow:0 26px 44px -28px rgba(58,58,51,.5)}
.d-grace .pfo{transform:none;inset:-8px;border:1px solid var(--gold);border-radius:0}
.d-grace .pfo::after{display:none}
.d-grace .pc:hover .pfo{transform:none}
.d-grace .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-grace .pfi{border-radius:0}
.d-grace .pc h3{font:italic 500 clamp(30px,7.4vw,40px) var(--fd)}
.d-grace .cillu{color:var(--acc)}
.d-grace .strip{background:#F1EDE3;color:#3A3A33;transform:none;margin:10px 0;border-top:1px solid rgba(195,165,116,.4);border-bottom:1px solid rgba(195,165,116,.4)}
.d-grace .strip b{font-family:var(--fd);font-style:italic;font-weight:500}
.d-grace .strip i{fill:var(--acc2)}
/* when & where: illustration on top, sage label bar */
.d-grace .when{background:#F3EFE6;color:#3A3A33}
.d-grace .wave{fill:#F3EFE6}
.d-grace .when .k{color:var(--acc)}.d-grace .when .h2{color:#3A3A33}
.d-grace .ev,.d-grace .ev.alt{flex-direction:column;align-items:stretch;gap:0;text-align:center;margin:0;padding:0 0 24px;min-height:0;background:#fff;border:1px solid rgba(195,165,116,.45);border-radius:2px;overflow:hidden;box-shadow:0 24px 40px -30px rgba(58,58,51,.45)}
.d-grace .ev .evi,.d-grace .ev.alt .evi{position:relative;top:0;width:auto;height:150px;margin:0;border:0;border-radius:0;background:#F8F5EE;color:var(--acc);box-shadow:none}
.d-grace .evi svg{width:110px}
.d-grace .evdate{bottom:12px;right:14px;background:var(--gold)}
.d-grace .evb{padding:0 18px}
.d-grace .evb h3{margin:0 -18px 12px;padding:10px;background:var(--acc);color:#fff;font:italic 500 clamp(26px,6.4vw,30px) var(--fd)}
.d-grace .evbt{justify-content:center}
.d-grace .btn{border-radius:2px}
.d-grace .btn.w{background:var(--acc);color:#fff;border-color:var(--acc)}
.d-grace .btn.wg{color:var(--acc);border-color:var(--acc)}
.d-grace .btn.ghost{background:transparent;color:var(--acc)}
.d-grace .btn.wa{background:#25D366;border-color:#25D366}
.d-grace .foot::before{background:linear-gradient(180deg,rgba(58,58,51,.35),rgba(110,130,105,.85))}
.d-grace .ft-n span{color:#F2D3C6}
.d-twilight .ss,.d-maroon .ss{z-index:0}
.d-twilight .hveil,.d-maroon .hveil{z-index:1}
/* 1.21.1 – Christian photo designs: hold the first-page animations until the page is ready (phones) */
.lw #intro *,.lw #intro *::before,.lw #intro *::after,.lw .cfx i,.lw .cfx i::before,.lw .cfx i::after{animation-play-state:paused!important}
.lw #intro>*,.lw .cfx{visibility:hidden}
.lw #intro::after{content:"";position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;opacity:.45;animation:spin .9s linear infinite}

/* ======================================================================
   1.26 – seven more photo designs (varieties; scoped, older designs untouched)
   ====================================================================== */
.d-lilac .cfx,.d-blush .cfx,.d-scarlet .cfx,.d-locket .cfx,.d-lantern .cfx,.d-royal .cfx,.d-balloon .cfx{display:block;z-index:55}
.d-lilac .hm,.d-blush .hm,.d-scarlet .hm,.d-locket .hm,.d-lantern .hm,.d-royal .hm,.d-balloon .hm{display:none}

/* ---------------------------------------------------------------- MOONLIT LILAC */
.d-lilac{--fs:"Parisienne",cursive;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-lilac #intro{background:radial-gradient(ellipse at 50% 15%,#3B2C6E,#1E1640 45%,#110C26 85%)}
.d-lilac .ibg{opacity:.16;animation:none}
.d-lilac .iveil{background:linear-gradient(180deg,rgba(22,15,46,.3),rgba(22,15,46,.8))}
.moon{position:absolute;left:50%;top:3%;z-index:1;width:min(36vw,170px);aspect-ratio:1;margin-left:calc(min(36vw,170px) / -2);border-radius:50%;background:radial-gradient(circle at 38% 36%,#FFFDF5,#F3E9FF 45%,#D9C8F5 70%,#B9A2E6);animation:mglow 5s ease-in-out infinite alternate;will-change:transform}
.moon::before{content:"";position:absolute;inset:-45%;border-radius:50%;background:radial-gradient(circle,rgba(214,196,255,.5) 30%,rgba(160,130,230,.18) 50%,transparent 70%)}
.moon::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 60%,rgba(180,160,220,.18),transparent 10%),radial-gradient(circle at 62% 30%,rgba(180,160,220,.15),transparent 8%),radial-gradient(circle at 65% 66%,rgba(180,160,220,.12),transparent 12%)}
@keyframes mglow{to{transform:scale(1.04)}}
.d-lilac .ic{z-index:3;margin-top:min(44vw,200px);width:min(90vw,390px);gap:12px;padding:24px 16px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.05));border:1px solid rgba(214,196,255,.4);box-shadow:0 30px 60px -24px rgba(5,0,20,.8);background-color:rgba(30,22,64,.55)}
.d-lilac .im{display:none}
.d-lilac .yai{color:#E6D6FF}.d-lilac .yai i{background:#E6D6FF}
.d-lilac .ipf{border:2px solid rgba(255,255,255,.8);border-radius:10px;box-shadow:0 0 26px -4px rgba(200,168,240,.8)}
.d-lilac .ipn{font-size:clamp(30px,8.4vw,38px)}
.d-lilac .iph{fill:var(--acc2)}
.d-lilac .icard{background:rgba(255,255,255,.08);border:1px solid rgba(214,196,255,.35);border-radius:16px;-webkit-backdrop-filter:none;backdrop-filter:none}
.d-lilac .ict{color:var(--acc2)}.d-lilac .icl{background:var(--acc2)}
.d-lilac .open-btn{border-radius:999px;background:linear-gradient(120deg,#8E6BD8,#C8A8F0 55%,#FFD6EC);color:#1E1640}
.d-lilac .open-btn::after{border-radius:999px;border-color:#C8A8F0}
/* opening: the moon grows and fills the screen with soft light */
.d-lilac.opening #intro .moon{transition:transform 1.5s cubic-bezier(.6,0,.3,1) .15s;transform:scale(9)}
.d-lilac.opening #intro .ic{transition:transform .9s cubic-bezier(.6,0,.4,1),opacity .6s;transform:translate3d(0,12%,0) scale(.94);opacity:0}
.d-lilac.opening #intro .sky i{transition:opacity .8s;opacity:0}
.d-lilac.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero */
.d-lilac .hero{background:#160F2E}
.d-lilac .ss{z-index:0}.d-lilac .hveil{z-index:1;background:linear-gradient(180deg,rgba(22,15,46,.5) 0,rgba(22,15,46,.05) 22%,rgba(22,15,46,.3) 36%,rgba(22,15,46,.82) 52%,rgba(17,12,38,.95) 100%)}
.d-lilac .sl{transition:opacity 1.6s ease,transform 1.8s cubic-bezier(.25,.7,.25,1);transform:translate3d(7%,0,0) scale(1.1);opacity:0}
.d-lilac .sl.on{transform:translate3d(0,0,0) scale(1.03);opacity:1}
.d-lilac .sl.out{transform:translate3d(-5%,0,0) scale(1.03);opacity:1}
.d-lilac .sky.hs{z-index:1}
.moon.hm2{top:70px;left:auto;right:6%;margin:0;width:min(20vw,90px);z-index:1;opacity:.9}
.d-lilac .hero-in{z-index:3}
.d-lilac .wgm{color:#E6D6FF;letter-spacing:.3em}
.d-lilac .hero .nm{color:#fff;text-shadow:0 0 24px rgba(200,168,240,.75)}
.d-lilac .nm .amp{color:var(--acc2)}
.d-lilac .cdu{background:rgba(255,255,255,.1);border:1px solid rgba(214,196,255,.45);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 0 26px -6px rgba(200,168,240,.7)}
.d-lilac .cdu .rp{stroke:var(--acc2)}.d-lilac .cdu .rt{stroke:rgba(255,255,255,.1)}
/* fireflies */
.d-lilac .cfx i{top:0;left:0;width:6px;height:6px;border-radius:50%;background:#FFF3C4;box-shadow:0 0 10px 4px rgba(255,236,170,.85),0 0 24px 8px rgba(214,196,255,.4);opacity:.9;animation:ffly calc(14s + var(--q) * 2s) ease-in-out infinite;animation-delay:calc(var(--q) * -2.3s)}
.d-lilac .cfx i:nth-child(odd){animation-name:ffly2}
@keyframes ffly{0%,100%{transform:translate3d(8vw,80vh,0);opacity:.2}20%{opacity:1}40%{transform:translate3d(32vw,52vh,0);opacity:.4}60%{transform:translate3d(58vw,64vh,0);opacity:1}80%{transform:translate3d(80vw,36vh,0);opacity:.3}}
@keyframes ffly2{0%,100%{transform:translate3d(88vw,30vh,0);opacity:.3}25%{transform:translate3d(64vw,56vh,0);opacity:1}50%{transform:translate3d(40vw,26vh,0);opacity:.3}75%{transform:translate3d(16vw,48vh,0);opacity:1}}
.d-lilac .couple{background:#FBF8FF}
.d-lilac .pfo{transform:none;border:1px solid var(--acc);border-radius:6px}.d-lilac .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc2);border-radius:10px}
.d-lilac .pc:hover .pfo{transform:none}.d-lilac .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-lilac .pc h3{font:400 clamp(34px,8.4vw,46px) var(--fs)}
.d-lilac .cillu{color:#9A7BD0}
.d-lilac .strip{background:linear-gradient(90deg,#3B2C6E,#8E6BD8,#3B2C6E)}.d-lilac .strip i{fill:#FFD6EC}
.d-lilac .when{background:linear-gradient(180deg,#5B4A8C,#2E2358)}.d-lilac .wave{fill:#5B4A8C}.d-lilac .wave.b{fill:#2E2358}
.d-lilac .evb h3,.d-lilac .h2.scr,.d-lilac .ty{font-family:var(--fs)}
.d-lilac .evb h3{font-size:clamp(34px,8vw,42px);font-weight:400}
.d-lilac .btn.w{color:#3B2C6E}
.d-lilac .foot::before{background:linear-gradient(180deg,rgba(22,15,46,.4),rgba(46,35,88,.88))}

/* ---------------------------------------------------------------- ROSE GOLD GRACE */
.d-blush{--fs:"Rouge Script",cursive;--fb:"Mulish",system-ui,sans-serif;--fd:"Playfair Display",serif}
.d-blush #intro{background:#3A2226;-webkit-perspective:1400px;perspective:1400px}
.d-blush .ibg{animation:none;transform:scale(1.05)}
.d-blush .iveil{background:linear-gradient(180deg,rgba(74,42,48,.55),rgba(74,42,48,.45) 40%,rgba(58,34,38,.88))}
.lace{position:absolute;inset:12px;z-index:2;border-radius:16px;pointer-events:none;border:10px solid transparent;-o-border-image:none;background:radial-gradient(circle,rgba(255,240,236,.75) 1.6px,transparent 2.2px) 0 0/12px 12px;-webkit-mask:linear-gradient(#000,#000) content-box exclude,linear-gradient(#000,#000);mask:linear-gradient(#000,#000) content-box exclude,linear-gradient(#000,#000);-webkit-mask-composite:xor;opacity:.7;animation:fadein 1.2s .2s both}
.door{position:absolute;top:0;bottom:0;width:50%;z-index:5;opacity:0;pointer-events:none;background:linear-gradient(135deg,#F7DCD5,#E8B4A0 45%,#D99A8A);will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.door i{position:absolute;inset:18px;border:2px solid rgba(255,255,255,.65);border-radius:10px;background:radial-gradient(circle,rgba(255,255,255,.55) 1.4px,transparent 2px) 0 0/14px 14px}
.door.l{left:0;transform-origin:0 50%;box-shadow:inset -10px 0 20px -10px rgba(120,60,60,.4)}
.door.r{right:0;transform-origin:100% 50%;box-shadow:inset 10px 0 20px -10px rgba(120,60,60,.4)}
.door.l::after,.door.r::after{content:"";position:absolute;top:50%;width:14px;height:44px;margin-top:-22px;border-radius:7px;background:linear-gradient(#F6DE8D,#C9962E)}
.door.l::after{right:14px}.door.r::after{left:14px}
.d-blush .ic{z-index:3}
.d-blush .yai{color:#F6D3C8}.d-blush .yai i{background:#F6D3C8}
.d-blush .ipf{border:3px solid #F1CBBE;border-radius:6px;box-shadow:0 0 0 5px rgba(232,180,160,.2),0 14px 28px -12px rgba(0,0,0,.6)}
.d-blush .ipn{font-size:clamp(30px,8.4vw,38px)}
.d-blush .iph{fill:#E8B4A0}
.d-blush .icard{background:rgba(74,42,48,.55);border:1px solid rgba(232,180,160,.55);border-radius:14px}
.d-blush .ict{color:#F1CBBE}.d-blush .icl{background:#E8B4A0}
.d-blush .open-btn{border-radius:999px;background:linear-gradient(120deg,#B76E79,#E8B4A0 55%,#F6D3C8);color:#4A2A30}
.d-blush .open-btn::after{border-radius:999px;border-color:#E8B4A0}
/* opening: lace doors appear and swing open in 3D */
.d-blush.opening #intro .door{opacity:1;transition:opacity .25s ease .3s,transform 1.4s cubic-bezier(.6,0,.25,1) .55s}
.d-blush.opening .door.l{transform:rotateY(-105deg)}
.d-blush.opening .door.r{transform:rotateY(105deg)}
.d-blush.opening #intro .ic{transition:opacity .35s,transform .5s;opacity:0;transform:scale(.96)}
.d-blush.opening #intro .ibg,.d-blush.opening #intro .iveil,.d-blush.opening #intro .lace{transition:opacity .4s .45s;opacity:0}
.d-blush.opening #intro{transition:background-color .1s .5s;background-color:transparent;opacity:1}
/* hero */
.d-blush .hero{background:#3A2226}
.d-blush .ss{z-index:0}.d-blush .hveil{z-index:1;background:linear-gradient(180deg,rgba(74,42,48,.45) 0,rgba(74,42,48,.05) 22%,rgba(74,42,48,.3) 36%,rgba(58,34,38,.82) 52%,rgba(46,26,30,.95) 100%)}
.d-blush .sl{opacity:1;transform:translate3d(0,100%,0);transition:transform 1.5s cubic-bezier(.7,0,.2,1)}
.d-blush .sl.on{transform:translate3d(0,0,0)}
.d-blush .sl.out{transform:translate3d(0,-18%,0)}
.d-blush .sl.on img,.d-blush .sl.out img{animation:kbz2 8s ease-out both}
.rgf{position:absolute;inset:14px;z-index:2;pointer-events:none;border:1px solid rgba(241,203,190,.75);border-radius:12px;box-shadow:inset 0 0 0 6px rgba(0,0,0,0),inset 0 0 0 7px rgba(241,203,190,.45)}
.d-blush .hero-in{z-index:3}
.d-blush .wgm{color:#F6D3C8}
.d-blush .hero .nm{color:#FFF4F0}
.d-blush .nm .amp{color:#E8B4A0}
.d-blush .cd{gap:clamp(8px,2.6vw,16px)}
.d-blush .cdu{border-radius:14px;aspect-ratio:.86;background:rgba(255,240,236,.14);border:1px solid rgba(241,203,190,.7);-webkit-backdrop-filter:none;backdrop-filter:none}
.d-blush .cdu svg{display:none}
.d-blush .cdu b{font-family:var(--fd);font-weight:500}
/* rose petals rising softly */
.d-blush .cfx i{top:auto;bottom:-30px;width:13px;height:16px;border-radius:80% 0 80% 0;background:#F2B5BE;opacity:.85;animation-name:prise;animation-timing-function:ease-in-out}
.d-blush .cfx i:nth-child(2n){background:#E8B4A0}.d-blush .cfx i:nth-child(3n){background:#FFE6E0}
@keyframes prise{0%{transform:translate3d(0,0,0) rotate(0) rotateY(0)}50%{transform:translate3d(30px,-55vh,0) rotate(160deg) rotateY(180deg)}100%{transform:translate3d(-16px,-112vh,0) rotate(320deg) rotateY(360deg);opacity:0}}
.d-blush .pfo{transform:none;border:1px solid var(--gold);border-radius:4px}.d-blush .pfo::after{transform:none;inset:-7px;border:1px dashed var(--acc2);border-radius:8px}
.d-blush .pc:hover .pfo{transform:none}.d-blush .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-blush .pc h3{font:400 clamp(36px,9vw,48px) var(--fs)}
.d-blush .cillu{color:var(--acc)}
.d-blush .strip{background:linear-gradient(90deg,#B76E79,#E8B4A0,#B76E79)}.d-blush .strip i{fill:#fff}
.d-blush .when{background:linear-gradient(180deg,#B76E79,#8A4E59)}.d-blush .wave{fill:#B76E79}.d-blush .wave.b{fill:#8A4E59}
.d-blush .evb h3,.d-blush .h2.scr,.d-blush .ty{font-family:var(--fs)}
.d-blush .evb h3{font-size:clamp(36px,8.6vw,44px);font-weight:400}
.d-blush .btn.w{color:#8A4E59}
.d-blush .foot::before{background:linear-gradient(180deg,rgba(74,42,48,.4),rgba(138,78,89,.88))}

/* ---------------------------------------------------------------- SCARLET BLOOM */
.d-scarlet{--fs:"Satisfy",cursive;--fb:"Outfit",system-ui,sans-serif;--fd:"Marcellus",serif}
.d-scarlet .iveil{background:radial-gradient(ellipse at 50% 45%,rgba(60,4,10,.45),rgba(26,5,8,.9) 78%)}
.garl{position:absolute;left:0;right:0;top:-4px;z-index:2;height:0;pointer-events:none}
.garl i{position:absolute;top:0;left:calc(4% + var(--g) * 11.5%);width:14px;height:70px;background:radial-gradient(circle at 50% 7px,#FFB627 5px,#E2770C 6.5px,transparent 7px) 0 0/14px 14px repeat-y;transform-origin:50% 0;will-change:transform;animation:gsway calc(3s + var(--g) * .35s) ease-in-out infinite alternate;animation-delay:calc(var(--g) * -.4s)}
.garl i:nth-child(2n){height:114px}.garl i:nth-child(3n){height:92px}.garl i:nth-child(5n){height:136px}
.garl i:nth-child(3n){background-image:radial-gradient(circle at 50% 7px,#FFF4E0 4.5px,#E8D8B8 6px,transparent 6.5px)}
.garl i::after{content:"";position:absolute;bottom:-14px;left:50%;width:12px;height:16px;margin-left:-6px;border-radius:50% 50% 50% 50%/30% 30% 70% 70%;background:#D7263D}
@keyframes gsway{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
.bloom{position:absolute;left:50%;top:50%;z-index:1;width:min(130vw,640px);aspect-ratio:1;margin:calc(min(130vw,640px) / -2) 0 0 calc(min(130vw,640px) / -2);pointer-events:none;opacity:.55;animation:spin 90s linear infinite;will-change:transform}
.bloom i{position:absolute;left:50%;top:50%;width:22%;height:46%;margin:-46% 0 0 -11%;border-radius:50% 50% 50% 50%/70% 70% 30% 30%;background:radial-gradient(ellipse at 50% 85%,rgba(215,38,61,.9),rgba(140,14,30,.6) 60%,rgba(140,14,30,0) 75%);transform-origin:50% 100%;transform:rotate(calc(var(--p) * 30deg)) scale(.2);animation:bloomin 1.6s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.2s + var(--p) * .06s)}
@keyframes bloomin{to{transform:rotate(calc(var(--p) * 30deg)) scale(1)}}
.d-scarlet .ic{z-index:3}
.d-scarlet .yai{color:#F2B33D}.d-scarlet .yai i{background:#F2B33D}
.d-scarlet .im{color:#F2B33D}
.d-scarlet .ipf{border:3px solid #F2B33D;border-radius:6px;box-shadow:0 0 0 4px rgba(242,179,61,.18),0 16px 30px -12px rgba(0,0,0,.8)}
.d-scarlet .iph{fill:#F2B33D}
.d-scarlet .icard{background:rgba(60,6,14,.6);border:1px solid rgba(242,179,61,.5);border-radius:10px}
.d-scarlet .ict{color:#F2B33D;font-family:var(--fd)}.d-scarlet .icl{background:#F2B33D}
.d-scarlet .open-btn{border-radius:999px;background:linear-gradient(120deg,#B3122A,#E0303F 55%,#F2B33D);letter-spacing:.18em}
.d-scarlet .open-btn::after{border-radius:999px;border-color:#F2B33D}
/* opening: petals burst outward, garlands lift */
.d-scarlet.opening #intro .bloom{transition:opacity .9s;opacity:0}
.d-scarlet.opening #intro .garl i{transition:transform 1s cubic-bezier(.6,0,.4,1);transform:translate3d(0,-110%,0)}
.d-scarlet.opening #intro .ic{transition:transform 1s cubic-bezier(.6,0,.4,1),opacity .7s;transform:scale(1.1);opacity:0}
.d-scarlet.opening #intro{transition:opacity .9s ease .9s;opacity:0}
/* hero: photos swing in like a page */
.d-scarlet .hero{background:#1A0508;-webkit-perspective:1200px;perspective:1200px}
.d-scarlet .ss{z-index:0}.d-scarlet .hveil{z-index:1;background:linear-gradient(180deg,rgba(26,5,8,.5) 0,rgba(26,5,8,.05) 22%,rgba(26,5,8,.3) 36%,rgba(26,5,8,.84) 52%,rgba(20,4,6,.96) 100%)}
.d-scarlet .sl{transition:opacity 1.3s ease,transform 1.6s cubic-bezier(.25,.8,.25,1);transform:rotateY(-14deg) scale(1.15);transform-origin:0 50%;opacity:0}
.d-scarlet .sl.on{transform:rotateY(0) scale(1.04);opacity:1}
.d-scarlet .sl.out{transform:scale(1.04);opacity:1}
.garl.hg{z-index:2}
.d-scarlet .hero-in{z-index:3}
.d-scarlet .wgm{color:#F2B33D;font-family:var(--fd);letter-spacing:.24em}
.d-scarlet .hero .nm{color:#FFF3E6}
.d-scarlet .nm .amp{color:#F2B33D}
.d-scarlet .cdu{border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(224,48,63,.75),rgba(110,8,20,.8));border:2px solid rgba(242,179,61,.7);-webkit-backdrop-filter:none;backdrop-filter:none}
.d-scarlet .cdu .rp{stroke:#F2B33D}
.d-scarlet .cdu b{font-family:var(--fd)}
/* marigold + rose petals falling */
.d-scarlet .cfx i{width:12px;height:12px;border-radius:50% 0 50% 50%;background:#FFB627;opacity:.9;animation-name:ptum}
.d-scarlet .cfx i:nth-child(2n){background:#E2770C}.d-scarlet .cfx i:nth-child(3n){background:#D7263D;border-radius:80% 0 80% 0;width:11px;height:15px}
.d-scarlet .pfo{transform:none;border:2px solid var(--acc2);border-radius:6px}.d-scarlet .pfo::after{transform:none;inset:-8px;border:1px solid var(--acc);border-radius:10px}
.d-scarlet .pc:hover .pfo{transform:none}.d-scarlet .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-scarlet .pc h3{font:400 clamp(30px,7.6vw,40px) var(--fs)}
.d-scarlet .cillu{color:var(--acc)}
.d-scarlet .strip{background:linear-gradient(90deg,#B3122A,#E2770C,#B3122A)}.d-scarlet .strip i{fill:#FFE08A}
.d-scarlet .when{background:linear-gradient(180deg,#B3122A,#6E0A18)}.d-scarlet .wave{fill:#B3122A}.d-scarlet .wave.b{fill:#6E0A18}
.d-scarlet .evb h3{font:400 clamp(30px,7.4vw,38px) var(--fs)}
.d-scarlet .btn.w{color:#B3122A}
.d-scarlet .foot::before{background:linear-gradient(180deg,rgba(26,5,8,.4),rgba(110,10,24,.88))}

/* ---------------------------------------------------------------- FOREVER YOURS (locket) */
.d-locket{--fs:"Italianno",cursive;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-locket .iveil{background:radial-gradient(ellipse at 50% 35%,rgba(40,6,18,.4),rgba(18,6,12,.9) 75%)}
.d-locket .im{display:none}
.lock{position:relative;width:clamp(96px,26vw,120px);height:clamp(104px,28vw,130px);margin:-4px auto 2px;-webkit-perspective:600px;perspective:600px;animation:lswing 3.2s ease-in-out infinite alternate;transform-origin:50% -30px}
@keyframes lswing{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
.chain{position:absolute;left:50%;top:-34px;width:2px;height:40px;margin-left:-1px;background:repeating-linear-gradient(#F6DE8D 0 4px,#9A7420 4px 6px)}
.lh{position:absolute;top:0;bottom:0;width:50%;overflow:hidden;will-change:transform}
.lh svg{position:absolute;top:0;width:200%;height:100%;fill:url(#none);fill:#D9A93E;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
.lh.l{left:0;transform-origin:0 50%}.lh.r{right:0;transform-origin:100% 50%}
.lh.l svg{left:0}.lh.r svg{right:0}
.lh::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 25%,rgba(255,246,210,.75),transparent 45%)}
.lin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-bottom:12%;font:400 clamp(30px,8vw,38px)/1 var(--fs);color:#5A3A0C;z-index:2;pointer-events:none}
.lin em{font-style:normal;font-size:.6em;margin:0 2px}
.lgl{position:absolute;left:50%;top:45%;width:20px;height:20px;margin:-10px;border-radius:50%;background:radial-gradient(circle,#FFF6D8,rgba(255,210,140,.6) 40%,transparent 70%);opacity:0}
.d-locket .ic{z-index:3}
.d-locket .ic>.lock{opacity:1}
.d-locket.opening #intro .ic,.d-royal.opening #intro .ic{opacity:1;transform:none}
.d-locket .yai{color:var(--gold)}.d-locket .yai i{background:var(--gold)}
.d-locket .ipf{border:2px solid var(--gold);border-radius:8px;box-shadow:0 0 0 4px rgba(233,196,106,.15),0 16px 30px -12px rgba(0,0,0,.8)}
.d-locket .ipn{font-size:clamp(32px,9vw,42px)}
.d-locket .iph{fill:var(--acc)}
.d-locket .icard{background:rgba(58,16,32,.55);border:1px solid rgba(233,196,106,.45);border-radius:14px}
.d-locket .ict{color:var(--gold)}.d-locket .icl{background:var(--gold)}
.d-locket .open-btn{border-radius:999px;background:linear-gradient(120deg,#A12B57,#D6457A 55%,#E9C46A)}
.d-locket .open-btn::after{border-radius:999px;border-color:var(--gold)}
/* opening: the locket opens, light pours out */
.d-locket.opening .lock{animation:none;transform:none}
.d-locket.opening .lin{transition:opacity .3s;opacity:0}
.d-locket.opening .lh.l{transition:transform 1s cubic-bezier(.6,0,.25,1) .15s;transform:rotateY(-120deg)}
.d-locket.opening .lh.r{transition:transform 1s cubic-bezier(.6,0,.25,1) .15s;transform:rotateY(120deg)}
.d-locket.opening .lgl{animation:lglow 1.5s ease-out .5s forwards}
@keyframes lglow{0%{opacity:0;transform:scale(1)}30%{opacity:1}100%{opacity:1;transform:scale(160)}}
.d-locket.opening #intro .ic>:not(.lock){transition:opacity .5s;opacity:0}
.d-locket.opening #intro{transition:opacity .7s ease 1.2s;opacity:0}
/* hero: heartbeat change of photos */
.d-locket .hero{background:#12060C}
.d-locket .ss{z-index:0}.d-locket .hveil{z-index:1;background:linear-gradient(180deg,rgba(18,6,12,.5) 0,rgba(18,6,12,.05) 22%,rgba(18,6,12,.32) 36%,rgba(18,6,12,.84) 52%,rgba(14,4,9,.96) 100%)}
.d-locket .sl{transition:opacity 1.2s ease;opacity:0;transform:scale(1.04)}
.d-locket .sl.on{opacity:1;animation:hbeat 7s ease-out both}
.d-locket .sl.out{opacity:1;transform:scale(1.04)}
@keyframes hbeat{0%{transform:scale(.94)}8%{transform:scale(1.06)}14%{transform:scale(1)}20%{transform:scale(1.04)}100%{transform:scale(1.1)}}
.d-locket .hero-in{z-index:3}
.d-locket .wgm{color:var(--gold)}
.d-locket .hero .nm{color:#FFF1F4;font-size:calc(var(--nk,1) * clamp(54px,14vw,104px));text-shadow:0 0 26px rgba(214,69,122,.6),0 4px 20px rgba(0,0,0,.4)}
.d-locket .nm .amp{color:var(--gold);font-family:var(--fd);font-style:italic;font-size:.5em}
.d-locket .cdu{background:radial-gradient(circle at 35% 30%,rgba(255,236,190,.18),rgba(40,10,22,.7));border:2px solid rgba(233,196,106,.75);-webkit-backdrop-filter:none;backdrop-filter:none}
.d-locket .cdu .rp{stroke:#E9C46A}.d-locket .cdu b{font-family:var(--fd);font-weight:600}
/* golden hearts rising */
.d-locket .cfx i{top:auto;bottom:-30px;width:16px;height:16px;fill:none;opacity:.8;animation-name:crise}
.d-locket .cfx i svg path{fill:none;stroke:#E9C46A;stroke-width:6}
.d-locket .cfx i:nth-child(2n) svg path{fill:#D6457A;stroke:none}
.d-locket .cfx i:nth-child(3n){width:11px;height:11px}
.d-locket .pfo{transform:none;border:2px solid var(--gold);border-radius:8px}.d-locket .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:12px}
.d-locket .pc:hover .pfo{transform:none}.d-locket .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-locket .pc h3{font:400 clamp(40px,10vw,54px) var(--fs)}
.d-locket .h2.scr,.d-locket .ty{font-size:clamp(54px,13vw,90px)}
.d-locket .cillu{color:var(--acc)}
.d-locket .strip{background:linear-gradient(90deg,#6A1031,#A12B57,#6A1031)}.d-locket .strip i{fill:#E9C46A}
.d-locket .when{background:linear-gradient(180deg,#6A1031,#3A0A1C)}.d-locket .wave{fill:#6A1031}.d-locket .wave.b{fill:#3A0A1C}
.d-locket .evb h3{font:400 clamp(40px,10vw,50px) var(--fs)}
.d-locket .btn.w{color:#6A1031}
.d-locket .foot::before{background:linear-gradient(180deg,rgba(18,6,12,.4),rgba(106,16,49,.88))}

/* ---------------------------------------------------------------- SUNSET LANTERNS */
.d-lantern{--fs:"Yellowtail",cursive;--fb:"Manrope",system-ui,sans-serif;--fd:"Playfair Display",serif}
.d-lantern #intro{background:linear-gradient(180deg,#2A1240 0%,#6A2C5E 38%,#D9663A 72%,#F5B25A 100%)}
.d-lantern .ibg{opacity:.14;animation:none}
.d-lantern .iveil{background:linear-gradient(180deg,rgba(42,18,64,.35),rgba(42,18,32,.25) 50%,rgba(60,20,10,.5))}
.dusk{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.sun{position:absolute;left:50%;bottom:16%;width:min(56vw,280px);aspect-ratio:1;margin-left:calc(min(56vw,280px) / -2);border-radius:50%;background:radial-gradient(circle,#FFF4C8,#FFD27A 28%,#F28C38 49%,rgba(255,180,90,.35) 51%,rgba(255,180,90,.12) 70%,rgba(255,180,90,0) 100%);transform:translate3d(0,30%,0);animation:sunup 2.4s cubic-bezier(.2,.8,.2,1) .2s both;will-change:transform}
@keyframes sunup{from{transform:translate3d(0,70%,0)}}
.hill{position:absolute;left:-10%;right:-10%;bottom:0;border-radius:50% 50% 0 0}
.hill.h1{height:24%;background:#3B1A2A}
.hill.h2{height:16%;left:-30%;right:20%;background:#24101C}
.lants{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.lants i,.d-lantern .cfx i{position:absolute;top:auto;bottom:-70px;left:calc(6% + var(--g,var(--q)) * 13%);width:34px;height:auto;animation:lrise calc(13s + var(--g,var(--q)) * 1.7s) linear infinite;animation-delay:calc(var(--g,var(--q)) * -2.1s)}
.lants i svg,.d-lantern .cfx i svg{position:relative;width:100%;height:auto;display:block;animation:flick 1.6s ease-in-out infinite alternate}
.lants i::before,.d-lantern .cfx i::before{content:"";position:absolute;left:-60%;right:-60%;top:-30%;bottom:-30%;border-radius:50%;background:radial-gradient(circle,rgba(255,200,110,.5),rgba(255,170,80,.15) 45%,transparent 70%)}
.lants i:nth-child(2n),.d-lantern .cfx i:nth-child(2n){width:28px}.lants i:nth-child(3n),.d-lantern .cfx i:nth-child(3n){width:42px}
@keyframes lrise{0%{transform:translate3d(0,0,0) rotate(-3deg)}50%{transform:translate3d(24px,-58vh,0) rotate(3deg)}100%{transform:translate3d(-12px,-118vh,0) rotate(-2deg)}}
@keyframes flick{to{opacity:.82}}
.d-lantern .ic{z-index:3;background:rgba(42,18,32,.68);border:1px solid rgba(255,210,122,.4);border-radius:20px;padding:22px 14px}
.d-lantern .yai{color:#FFD27A}.d-lantern .yai i{background:#FFD27A}
.d-lantern .im{color:#FFD27A}
.d-lantern .ipf{border:4px solid #FFF3DE;border-radius:4px;box-shadow:0 14px 28px -12px rgba(0,0,0,.7)}
.d-lantern .iph{fill:#FFD27A}
.d-lantern .icard{background:rgba(255,247,236,.1);border:1px solid rgba(255,210,122,.4);border-radius:14px;-webkit-backdrop-filter:none;backdrop-filter:none}
.d-lantern .ict{color:#FFD27A}.d-lantern .icl{background:#FFD27A}
.d-lantern .open-btn{border-radius:999px;background:linear-gradient(120deg,#C4532B,#F28C38 50%,#FFD27A);color:#3B1E14}
.d-lantern .open-btn::after{border-radius:999px;border-color:#FFD27A}
.d-lantern .cfx i{display:none}
.d-lantern.is-open .cfx i{display:block}
.d-lantern .cfx i:nth-child(n+6){display:none!important}
/* opening: the sun rises and fills the sky */
.d-lantern.opening #intro .sun{animation:none;transition:transform 1.5s cubic-bezier(.6,0,.3,1);transform:translate3d(0,-60%,0) scale(6)}
.d-lantern.opening #intro .lants i{transition:opacity .6s;opacity:0}
.d-lantern.opening #intro .ic{transition:transform 1s cubic-bezier(.6,0,.4,1),opacity .6s;transform:translate3d(0,-10%,0);opacity:0}
.d-lantern.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero */
.d-lantern .hero{background:#2A1220}
.d-lantern .ss{z-index:0}.d-lantern .hveil{z-index:1;background:linear-gradient(180deg,rgba(42,18,32,.45) 0,rgba(42,18,32,.05) 22%,rgba(60,20,20,.3) 36%,rgba(42,18,32,.82) 52%,rgba(30,12,22,.96) 100%)}
.d-lantern .sl{transition:opacity 2s ease,transform 2s cubic-bezier(.25,.7,.25,1);opacity:0;transform:translate3d(-6%,0,0) scale(1.12)}
.d-lantern .sl.on{opacity:1;transform:translate3d(0,0,0) scale(1.03)}
.d-lantern .sl.out{opacity:1;transform:translate3d(4%,0,0) scale(1.03)}
.sunglow{position:absolute;left:50%;top:-30vmax;z-index:1;width:80vmax;height:80vmax;margin-left:-40vmax;border-radius:50%;background:radial-gradient(circle,rgba(255,200,110,.35),rgba(255,160,80,.12) 40%,transparent 70%);pointer-events:none;animation:mglow 6s ease-in-out infinite alternate}
.d-lantern .hero-in{z-index:3}
.d-lantern .wgm{color:#FFD27A}
.d-lantern .hero .nm{color:#FFF4E2;text-shadow:0 0 26px rgba(242,140,56,.6),0 4px 20px rgba(0,0,0,.4)}
.d-lantern .nm .amp{color:#FFD27A}
.d-lantern .cd{gap:clamp(8px,2.8vw,18px)}
.d-lantern .cdu{border-radius:22px 22px 22px 22px/30px 30px 30px 30px;aspect-ratio:.78;background:radial-gradient(ellipse at 50% 55%,rgba(255,232,170,.5),rgba(242,140,56,.55) 60%,rgba(196,83,43,.7));border:1px solid rgba(255,210,122,.75);box-shadow:0 0 30px -4px rgba(255,180,90,.7);-webkit-backdrop-filter:none;backdrop-filter:none;animation:flick 2.2s ease-in-out infinite alternate}
.d-lantern .cdu:nth-child(2){animation-delay:-.6s}.d-lantern .cdu:nth-child(3){animation-delay:-1.1s}.d-lantern .cdu:nth-child(4){animation-delay:-1.7s}
.d-lantern .cdu::before,.d-lantern .cdu::after{content:"";position:absolute;left:30%;right:30%;height:6px;background:#6B3A1A;border-radius:2px}
.d-lantern .cdu::before{top:-4px}.d-lantern .cdu::after{bottom:-4px}
.d-lantern .cdu svg{display:none}
.d-lantern .cdu b{color:#3B1E14;font-family:var(--fd)}.d-lantern .cdu span{color:#5A2A12}
.d-lantern .pf{background:#fff;padding:10px 10px 34px;box-shadow:0 24px 44px -24px rgba(61,36,18,.6)}
.d-lantern .pc0 .pf{transform:rotate(-2deg)}.d-lantern .pc1 .pf{transform:rotate(2deg)}
.d-lantern .pfo{display:none}.d-lantern .pfi{border-radius:0}
.d-lantern .pc h3{font:400 clamp(32px,8vw,42px) var(--fs)}
.d-lantern .cillu{color:var(--band)}
.d-lantern .strip{background:linear-gradient(90deg,#6A2C5E,#D9663A,#F28C38)}.d-lantern .strip i{fill:#FFE6A8}
.d-lantern .when{background:linear-gradient(180deg,#C4532B,#6A2C5E)}.d-lantern .wave{fill:#C4532B}.d-lantern .wave.b{fill:#6A2C5E}
.d-lantern .evb h3{font:400 clamp(32px,8vw,42px) var(--fs)}
.d-lantern .btn.w{color:#C4532B}
.d-lantern .foot::before{background:linear-gradient(180deg,rgba(42,18,64,.4),rgba(196,83,43,.85))}

/* ---------------------------------------------------------------- ROYAL VELVET */
.d-royal{--fs:"Pinyon Script",cursive;--fb:"Lato",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-royal #intro{background:repeating-linear-gradient(90deg,#0B1030 0,#18225A 3%,#24307A 5%,#141C4C 7.5%,#0B1030 10%)}
.d-royal .ibg{opacity:.12;animation:none}
.d-royal .iveil{background:radial-gradient(ellipse at 50% 40%,rgba(11,16,48,.2),rgba(6,8,28,.82) 75%)}
.rbn{position:absolute;top:50%;z-index:2;width:52%;height:34px;margin-top:-17px;background:linear-gradient(180deg,#8C6A1A,#F6DE8D 30%,#D4AF37 55%,#8C6A1A);box-shadow:0 6px 14px rgba(0,0,0,.45);will-change:transform}
.rbn.l{left:0}.rbn.r{right:0}
.d-royal .ic{z-index:3;background:rgba(11,16,48,.72);border:1px solid rgba(212,175,55,.6);border-radius:6px;padding:30px 16px 24px;box-shadow:inset 0 0 0 6px rgba(11,16,48,.72),inset 0 0 0 7px rgba(212,175,55,.35),0 30px 60px -24px rgba(0,0,0,.9)}
.d-royal .im{display:none}
.bow{display:block;width:clamp(96px,26vw,124px);margin:-62px auto -6px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5));animation:bowin 1s cubic-bezier(.3,1.5,.5,1) .3s both}
.bow svg{width:100%;height:auto;display:block}
@keyframes bowin{from{transform:scale(.3) rotate(-20deg);opacity:0}}
.d-royal .ic>.bow{opacity:1;transform:none;animation:bowin 1s cubic-bezier(.3,1.5,.5,1) .3s both}
.d-royal .yai{color:#F3D57A}.d-royal .yai i{background:#F3D57A}
.d-royal .ipf{border:2px solid #D4AF37;border-radius:4px;box-shadow:0 0 0 5px rgba(212,175,55,.15),0 18px 30px -12px rgba(0,0,0,.8)}
.d-royal .ipn{color:#FFF6DC}
.d-royal .iph{fill:#D4AF37}
.d-royal .icard{background:rgba(20,28,76,.6);border:1px solid rgba(212,175,55,.45);border-radius:4px}
.d-royal .ict{color:#F3D57A;font-family:var(--fd);font-weight:600}.d-royal .icl{background:#D4AF37}
.d-royal .open-btn{border-radius:2px;background:linear-gradient(180deg,#F3D57A,#B8902A);color:#0B1030;letter-spacing:.24em}
.d-royal .open-btn::after{border-radius:4px;border-color:#D4AF37}
/* opening: the bow spins away and the ribbon slides apart */
.d-royal.opening .ic>.bow{animation:bowout .8s cubic-bezier(.6,0,.4,1) forwards}
@keyframes bowout{to{transform:scale(1.6) rotate(200deg);opacity:0}}
.d-royal.opening .rbn.l{transition:transform 1.1s cubic-bezier(.7,0,.2,1) .25s;transform:translate3d(-105%,0,0)}
.d-royal.opening .rbn.r{transition:transform 1.1s cubic-bezier(.7,0,.2,1) .25s;transform:translate3d(105%,0,0)}
.d-royal.opening #intro .ic>:not(.bow){transition:opacity .5s .1s;opacity:0}
.d-royal.opening #intro .ic{transition:background-color .5s .2s,border-color .5s .2s,box-shadow .5s .2s;background-color:transparent;border-color:transparent;box-shadow:none}
.d-royal.opening #intro{transition:opacity .9s ease .95s;opacity:0}
/* hero: a gold frame, photos turn in */
.d-royal .hero{background:#0B1030}
.d-royal .hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#0B1030 0,#141C4C 3%,#0B1030 6%);opacity:.9}
.d-royal .ss{left:50%;right:auto;top:clamp(80px,12vh,116px);bottom:auto;width:min(76vw,400px);aspect-ratio:.82;margin-left:calc(min(76vw,400px) / -2);overflow:hidden;border:3px solid #D4AF37;box-shadow:0 0 0 7px #0B1030,0 0 0 8px rgba(212,175,55,.5),0 30px 60px -20px rgba(0,0,0,.9);z-index:1}
.rframe{position:absolute;left:50%;top:calc(clamp(80px,12vh,116px) - 18px);width:calc(min(76vw,400px) + 36px);aspect-ratio:.86;margin-left:calc(min(76vw,400px) / -2 - 18px);z-index:2;pointer-events:none;border:1px solid rgba(212,175,55,.55);border-radius:3px}
.rframe::before,.rframe::after{content:"\2756";position:absolute;left:50%;margin-left:-10px;width:20px;text-align:center;color:#D4AF37;font-size:18px;line-height:20px;background:#0B1030}
.rframe::before{top:-11px}.rframe::after{bottom:-11px}
.d-royal .sl{transition:opacity 1.5s ease,transform 1.7s cubic-bezier(.25,.8,.25,1);transform:rotate(-4deg) scale(1.22);opacity:0}
.d-royal .sl.on{transform:rotate(0) scale(1.03);opacity:1}
.d-royal .sl.out{transform:rotate(0) scale(1.03);opacity:1}
.d-royal .hveil{display:none}
.d-royal .hero-in{z-index:3;padding-top:calc(min(76vw,400px) / .82 + clamp(80px,12vh,116px) + 40px);padding-bottom:110px}
.d-royal .wgm{color:#F3D57A;font-family:var(--fd);font-weight:600;letter-spacing:.28em}
.d-royal .hero .nm{color:#FFF6DC}
.d-royal .nm .amp{color:#D4AF37}
.d-royal .cdu{background:radial-gradient(circle at 35% 30%,#2E3C8C,#141C4C);border:2px solid #D4AF37;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 0 0 4px rgba(212,175,55,.15)}
.d-royal .cdu .rp{stroke:#F3D57A}.d-royal .cdu b{font-family:var(--fd);color:#F3D57A}
/* gold glitter falling */
.d-royal .cfx i{width:7px;height:7px;background:linear-gradient(135deg,#FFF3C4,#D4AF37);transform:rotate(45deg);box-shadow:0 0 8px 2px rgba(243,213,122,.7);opacity:.9;animation-name:gfall;animation-timing-function:linear}
.d-royal .cfx i:nth-child(2n){width:5px;height:5px}
@keyframes gfall{0%{transform:translate3d(0,0,0) rotate(45deg) scale(1);opacity:.2}10%{opacity:1}50%{transform:translate3d(20px,55vh,0) rotate(225deg) scale(.6);opacity:.4}60%{opacity:1}100%{transform:translate3d(-10px,112vh,0) rotate(405deg) scale(1);opacity:.6}}
.d-royal .pfo{transform:none;border:2px solid #D4AF37;border-radius:4px}.d-royal .pfo::after{transform:none;inset:-7px;border:1px solid rgba(212,175,55,.5);border-radius:6px}
.d-royal .pc:hover .pfo{transform:none}.d-royal .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-royal .pc .role{color:#2E3C8C;font-family:var(--fd);font-weight:600}
.d-royal .pc h3{font:400 clamp(34px,8.4vw,44px) var(--fs)}
.d-royal .k{color:#2E3C8C}
.d-royal .cillu{color:#B8902A}
.d-royal .strip{background:linear-gradient(90deg,#141C4C,#2E3C8C,#141C4C);color:#F3D57A}.d-royal .strip i{fill:#D4AF37}
.d-royal .when{background:linear-gradient(180deg,#1C2560,#0B1030)}.d-royal .wave{fill:#1C2560}.d-royal .wave.b{fill:#0B1030}
.d-royal .when .k{color:#F3D57A}
.d-royal .evb h3{font:400 clamp(32px,8vw,42px) var(--fs)}
.d-royal .btn{background:#2E3C8C;border-color:#2E3C8C}
.d-royal .btn.w{background:#D4AF37;border-color:#D4AF37;color:#0B1030}
.d-royal .btn.ghost{background:transparent;color:#2E3C8C}
.d-royal .btn.wa{background:#25D366;border-color:#25D366}
.d-royal .foot::before{background:linear-gradient(180deg,rgba(11,16,48,.45),rgba(28,37,96,.9))}
.d-royal .ft-n span{color:#D4AF37}

/* ---------------------------------------------------------------- LOVE BALLOONS */
.d-balloon{--fs:"Satisfy",cursive;--fb:"Nunito",system-ui,sans-serif;--fd:"Cormorant Garamond",serif}
.d-balloon #intro{background:linear-gradient(180deg,#FFD9E4,#FFEFF4 55%,#FFF8FA);color:#4A1E2C}
.d-balloon .ibg,.d-balloon .iveil{display:none}
.cloud{position:absolute;z-index:1;width:160px;height:52px;border-radius:52px;background:#fff;opacity:.9;pointer-events:none;animation:cdrift 26s linear infinite;will-change:transform}
.cloud::before,.cloud::after{content:"";position:absolute;background:#fff;border-radius:50%}
.cloud::before{width:70px;height:70px;left:24px;top:-34px}.cloud::after{width:52px;height:52px;left:82px;top:-24px}
.cloud.c1{top:10%;left:-10%}.cloud.c2{top:32%;left:60%;transform:scale(.7);animation-duration:34s;animation-delay:-12s}.cloud.c3{top:78%;left:20%;transform:scale(.85);animation-duration:30s;animation-delay:-20s}
@keyframes cdrift{from{transform:translate3d(-30vw,0,0)}to{transform:translate3d(110vw,0,0)}}
.d-balloon .ic{z-index:3;margin-top:min(30vw,130px);width:min(90vw,390px);gap:12px;padding:24px 16px;background:#fff;border-radius:24px;box-shadow:0 30px 60px -30px rgba(240,80,122,.55),0 0 0 6px rgba(255,255,255,.6)}
.d-balloon .im{display:none}
.blns{position:absolute;left:50%;top:0;width:0;height:0;z-index:-1}
.d-balloon .ic>.blns{opacity:1;transform:none;animation:none}
.blns i{position:absolute;bottom:0;left:calc(-80px + var(--g) * 40px);width:46px;fill:#F0507A;transform-origin:50% 100%;animation:bbob calc(2.6s + var(--g) * .3s) ease-in-out infinite alternate;animation-delay:calc(var(--g) * -.5s)}
.blns i svg{width:100%;display:block;margin-top:-150px;filter:drop-shadow(0 6px 8px rgba(240,80,122,.35))}
.blns i:nth-child(2n){fill:#FF9FB8;width:40px}.blns i:nth-child(2n) svg{margin-top:-176px}.blns i:nth-child(2n)::after{height:136px}.blns i:nth-child(3n) svg{margin-top:-130px}.blns i:nth-child(3n)::after{height:90px}.blns i:nth-child(3n){fill:#F7C873}
.blns i::after{content:"";position:absolute;left:50%;bottom:0;width:1.5px;height:110px;background:#C9A3AE;transform-origin:50% 100%}
@keyframes bbob{from{transform:rotate(calc(-8deg + var(--g) * 3deg)) translate3d(0,0,0)}to{transform:rotate(calc(-2deg + var(--g) * 3deg)) translate3d(0,-10px,0)}}
.d-balloon .yai{color:var(--acc)}.d-balloon .yai i{background:var(--acc)}
.d-balloon .ipf{border:4px solid #fff;border-radius:14px;box-shadow:0 12px 24px -10px rgba(240,80,122,.6)}
.d-balloon .ipn{color:#4A1E2C;font-size:clamp(22px,6vw,28px)}.d-balloon .ipr{color:#8C6A76}
.d-balloon .icard{background:#FFF0F4;border:2px dashed #FFB4C6;border-radius:18px;color:#4A1E2C}
.d-balloon .ict{color:var(--acc)}.d-balloon .ici,.d-balloon .icv{color:#8C6A76}.d-balloon .icl{background:var(--acc2)}
.d-balloon .open-btn{border-radius:999px;background:linear-gradient(120deg,#F0507A,#FF9FB8)}
.d-balloon .open-btn::after{border-radius:999px}
/* opening: the balloons lift the card up and away */
.d-balloon.opening #intro .ic{transition:transform 1.6s cubic-bezier(.55,0,.75,.4) .1s;transform:translate3d(0,-140vh,0) rotate(-4deg);opacity:1}
.d-balloon.opening #intro .cloud{transition:transform 1.6s cubic-bezier(.6,0,.4,1);transform:translate3d(0,40vh,0)}
.d-balloon.opening #intro{transition:opacity .6s ease 1.25s;opacity:0}
/* hero: tilted photo card in the sky, photos pop in */
.d-balloon .hero{background:linear-gradient(180deg,#FFD9E4,#FFF8FA);color:#4A1E2C}
.d-balloon .ss{left:50%;right:auto;top:clamp(84px,12vh,120px);bottom:auto;width:min(72vw,360px);aspect-ratio:.82;margin-left:calc(min(72vw,360px) / -2);overflow:hidden;border:10px solid #fff;border-radius:18px;box-shadow:0 30px 50px -26px rgba(240,80,122,.7);transform:rotate(-2deg);z-index:1}
.d-balloon .sl{opacity:0;transform:scale(.7);transition:transform .9s cubic-bezier(.3,1.5,.5,1),opacity .5s ease}
.d-balloon .sl.on{opacity:1;transform:scale(1)}
.d-balloon .sl.out{opacity:1;transform:scale(1);z-index:1}
.d-balloon .sl.art{background:linear-gradient(140deg,#FFB4C6,#F7C873)}
.d-balloon .hveil{display:none}
.d-balloon .hero-in{padding-top:calc(min(72vw,360px) / .82 + clamp(84px,12vh,120px) + 36px);padding-bottom:110px;color:#4A1E2C}
.d-balloon .wgm{color:var(--acc);font-weight:700}
.d-balloon .hero .nm{color:#4A1E2C;text-shadow:none;font-size:calc(var(--nk,1) * clamp(36px,9.6vw,72px))}
.d-balloon .nm .amp{color:var(--acc)}
.d-balloon .quote{color:#8C6A76;text-shadow:none}.d-balloon .quote::before,.d-balloon .quote::after{color:var(--acc)}
.d-balloon .cd{gap:clamp(8px,2.8vw,18px);margin-top:16px}
.d-balloon .cdu{border-radius:50% 50% 46% 46%/56% 56% 44% 44%;background:radial-gradient(circle at 35% 28%,#FFC2D2,#F0507A 70%);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 14px 20px -12px rgba(240,80,122,.7);animation:bbob2 2.8s ease-in-out infinite alternate}
.d-balloon .cdu:nth-child(2){background:radial-gradient(circle at 35% 28%,#FFE2EA,#FF9FB8 70%);animation-delay:-.7s}.d-balloon .cdu:nth-child(3){background:radial-gradient(circle at 35% 28%,#FFF0C8,#F7C873 70%);animation-delay:-1.4s}.d-balloon .cdu:nth-child(4){animation-delay:-2.1s}
.d-balloon .cdu::after{content:"";position:absolute;left:50%;top:100%;width:1.5px;height:22px;background:#C9A3AE}
@keyframes bbob2{to{transform:translate3d(0,-8px,0)}}
.d-balloon .cdu svg{display:none}
.d-balloon .cdu b,.d-balloon .cdu span{color:#fff}
.d-balloon .ssd i{background:rgba(240,80,122,.35)}.d-balloon .ssd i.on{background:var(--acc)}
.d-balloon .scroll-hint{border-color:var(--acc)}.d-balloon .scroll-hint span{background:var(--acc)}
.d-balloon .nav{background:rgba(255,255,255,.9)}.d-balloon .nav a{color:#4A1E2C}.d-balloon .nav a.on,.d-balloon .nav a:hover{color:#fff}
/* heart balloons drifting up the page */
.d-balloon .cfx i{top:auto;bottom:-80px;width:26px;height:auto;fill:#F0507A;opacity:.85;animation-name:brise;animation-timing-function:ease-in-out}
.d-balloon .cfx i:nth-child(2n){fill:#FF9FB8;width:20px}.d-balloon .cfx i:nth-child(3n){fill:#F7C873}
.d-balloon .cfx i svg{height:auto}
.d-balloon .cfx i::after{content:"";position:absolute;left:50%;top:100%;width:1px;height:34px;background:#C9A3AE}
.d-balloon .cfx i:nth-child(n+7){display:none}
@keyframes brise{0%{transform:translate3d(0,0,0) rotate(-6deg)}50%{transform:translate3d(26px,-58vh,0) rotate(6deg)}100%{transform:translate3d(-10px,-120vh,0) rotate(-4deg)}}
.d-balloon .pf{background:#fff;padding:10px;border-radius:20px;box-shadow:0 20px 40px -20px rgba(240,80,122,.6)}
.d-balloon .pfo{display:none}.d-balloon .pfi{border-radius:14px}
.d-balloon .pc h3{font:400 clamp(26px,6.4vw,34px) var(--fs)}
.d-balloon .cillu{color:var(--acc)}
.d-balloon .strip{background:linear-gradient(90deg,#F0507A,#FF9FB8,#F7C873)}.d-balloon .strip i{fill:#fff}
.d-balloon .when{background:linear-gradient(160deg,#F0507A,#FF8FA8)}.d-balloon .wave{fill:#F0507A}.d-balloon .wave.b{fill:#FF8FA8}
.d-balloon .evb h3{font:400 clamp(26px,6.4vw,32px) var(--fs)}
.d-balloon .btn.w{color:#D0325E}
.d-balloon .foot::before{background:linear-gradient(180deg,rgba(74,30,44,.25),rgba(240,80,122,.75))}
.d-lilac .cdu b,.d-locket .cdu b,.d-royal .cdu b,.d-blush .cdu b,.d-lantern .cdu b,.d-scarlet .cdu b{font-variant-numeric:lining-nums tabular-nums}

/* ======================================================================
   1.30 – eleven photo designs, each with its own layout + new photo slideshows
   (everything scoped to .n3 / .tr-* / .d-<new look>; older designs untouched)
   ====================================================================== */
.n3 .cfx{display:block;z-index:2}
.n3.is-intro .cfx{display:none}
.n3 .cfx i:nth-child(n+7){display:none}
/* every new design: the first page scrolls if a phone is very short, and its content is centred */
.n3 #intro{display:flex;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.n3 #intro>*{flex-shrink:0}
.n3 .open-btn{display:block}
.n3 .hm{display:none}
.bsm{margin:0;font:700 clamp(19px,5vw,27px)/1.7 "Amiri","Scheherazade New",serif;color:var(--gold);letter-spacing:0}
.hero-in>.bsm{opacity:0;transform:translateY(16px);transition:opacity 1s .3s,transform 1s .3s}
.is-open .hero-in>.bsm{opacity:1;transform:none}
.n3 .cd-note{color:inherit}
/* light dots rising (stained glass) / bubbles (seaside) */
.n3.cfall .cfx i .fli:empty{border-radius:50%}
/* ---- 1.30 photo slideshows (transform/opacity only) ---- */
.n3 .sl.on .sx,.n3 .sl.out .sx{will-change:transform}
.sx{position:absolute;display:block;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.sl .sx img{inset:auto;left:0;top:0;max-width:none}
.tr-tiles .sl:not(.art),.tr-blinds .sl:not(.art),.tr-split .sl:not(.art),.tr-slats .sl:not(.art){opacity:1;transition:none}
/* tiles: four tiles flip in one after another */
.tr-tiles .sx{width:calc(50% + 1px);height:calc(50% + 1px);transform:perspective(1000px) rotateY(-90deg);transition:transform .9s cubic-bezier(.3,.7,.3,1);transition-delay:calc(var(--x) * .14s)}
.tr-tiles .sx:nth-child(2){left:50%}.tr-tiles .sx:nth-child(3){top:50%}.tr-tiles .sx:nth-child(4){left:50%;top:50%}
.tr-tiles .sx img{width:calc(200% - 2px);height:calc(200% - 2px)}
.tr-tiles .sx:nth-child(2) img,.tr-tiles .sx:nth-child(4) img{left:calc(-100% + 1px)}
.tr-tiles .sx:nth-child(3) img,.tr-tiles .sx:nth-child(4) img{top:calc(-100% + 1px)}
.tr-tiles .sl.on .sx,.tr-tiles .sl.out .sx{transform:perspective(1000px) rotateY(0)}
/* blinds: three panels drop in from the top */
.tr-blinds .sx{top:0;height:100%;width:calc(33.334% + 1px);left:calc(var(--x) * 33.333%);transform:translate3d(0,-101%,0);transition:transform 1s cubic-bezier(.65,0,.25,1);transition-delay:calc(var(--x) * .16s)}
.tr-blinds .sx img{width:calc(300% - 3px);height:100%;left:calc(var(--x) * -100% + var(--x) * 1px)}
.tr-blinds .sl.on .sx,.tr-blinds .sl.out .sx{transform:none}
/* split: the photo closes in from the top and bottom */
.tr-split .sx{left:0;width:100%;height:calc(50% + 1px);top:calc(var(--x) * 50%);transform:translate3d(0,calc((var(--x) * 2 - 1) * 101%),0);transition:transform 1.25s cubic-bezier(.7,0,.2,1)}
.tr-split .sx img{width:100%;height:calc(200% - 2px);top:calc(var(--x) * -100% + var(--x) * 1px)}
.tr-split .sl.on .sx,.tr-split .sl.out .sx{transform:none}
/* slats: five strips slide in from alternate sides */
.tr-slats .sx{left:0;width:100%;height:calc(20% + 1px);top:calc(var(--x) * 20%);transform:translate3d(-101%,0,0);transition:transform 1s cubic-bezier(.7,0,.2,1);transition-delay:calc(var(--x) * .1s)}
.tr-slats .sx:nth-child(2n){transform:translate3d(101%,0,0)}
.tr-slats .sx img{width:100%;height:calc(500% - 5px);top:calc(var(--x) * -100% + var(--x) * 1px)}
.tr-slats .sl.on .sx,.tr-slats .sl.out .sx{transform:none}
/* cube */
.tr-cube .ss{-webkit-perspective:1600px;perspective:1600px;overflow:hidden}
.tr-cube .sl{opacity:1;transform-origin:50% 50% -50vw;transform:rotateY(90deg);transition:transform 1.5s cubic-bezier(.6,0,.3,1);-webkit-backface-visibility:hidden;backface-visibility:hidden}
.tr-cube .sl.on{transform:rotateY(0)}
.tr-cube .sl.out{transform:rotateY(-90deg)}
/* whirl */
.tr-whirl .sl{opacity:0;transform:rotate(-12deg) scale(1.45);transition:opacity 1.2s ease,transform 1.7s cubic-bezier(.2,.8,.2,1)}
.tr-whirl .sl.on{opacity:1;transform:rotate(0) scale(1.04)}
.tr-whirl .sl.out{opacity:1;transform:rotate(3deg) scale(1.12)}
/* push */
.tr-push .sl{opacity:1;transform:translate3d(100%,0,0);transition:transform 1.4s cubic-bezier(.7,0,.25,1)}
.tr-push .sl.on{transform:translate3d(0,0,0)}
.tr-push .sl.out{transform:translate3d(-35%,0,0)}
/* diagonal */
.tr-diag .sl{opacity:0;transform:translate3d(26%,26%,0) scale(1.2);transition:opacity 1.1s ease,transform 1.6s cubic-bezier(.2,.8,.2,1)}
.tr-diag .sl.on{opacity:1;transform:scale(1.02)}
.tr-diag .sl.out{opacity:1;transform:translate3d(-5%,-5%,0) scale(1.2)}
/* depth */
.tr-depth .sl{opacity:0;transform:scale(1.35);transition:opacity 1.3s ease,transform 1.7s cubic-bezier(.2,.8,.2,1)}
.tr-depth .sl.on{opacity:1;transform:scale(1.02)}
.tr-depth .sl.out{opacity:1;transform:scale(.88)}
/* peel: the new photo swings down like a page */
.tr-peel .sl{opacity:1;transform-origin:100% 0;transform:rotate(-24deg) translate3d(60%,-30%,0) scale(1.1);transition:transform 1.5s cubic-bezier(.3,.7,.2,1)}
.tr-peel .sl.on{transform:none}
.tr-peel .sl.out{transform:scale(.96)}
/* flip (top hinge) */
.tr-flipx .ss{-webkit-perspective:1400px;perspective:1400px}
.tr-flipx .sl{opacity:1;transform-origin:50% 0;transform:rotateX(92deg);transition:transform 1.4s cubic-bezier(.3,1.25,.4,1);-webkit-backface-visibility:hidden;backface-visibility:hidden}
.tr-flipx .sl.on{transform:rotateX(0)}
.tr-flipx .sl.out{transform:none}
.n3 .sl.art{opacity:0;transition:opacity 1.4s ease;transform:none}
.n3 .sl.art.on,.n3 .sl.art.out{opacity:1}
/* ---- falling leaves / flowers: path (outer) > tumble (.fli) ---- */
.lf3,.n3.cfall .cfx i,.n3.cfall .cfx i:nth-child(n){position:absolute;top:-40px;left:calc(3% + var(--q) * 16%);width:18px;height:22px;background:none;will-change:transform;animation:lfall calc(10s + var(--q) * 1.5s) linear infinite;animation-delay:calc(var(--q) * -2.4s)}
.lf3:nth-child(2n),.n3.cfall .cfx i:nth-child(2n){width:14px;height:17px;animation-name:lfall2}
.lf3:nth-child(3n),.n3.cfall .cfx i:nth-child(3n){width:21px;height:25px}
.fli{position:absolute;inset:0;display:block;animation:ltum calc(3.2s + var(--q) * .4s) ease-in-out infinite}
.fli svg{width:100%;height:100%;display:block}
@keyframes lfall{0%{transform:translate3d(0,0,0)}25%{transform:translate3d(34px,28vh,0)}50%{transform:translate3d(-12px,56vh,0)}75%{transform:translate3d(28px,84vh,0)}100%{transform:translate3d(0,118vh,0)}}
@keyframes lfall2{0%{transform:translate3d(0,0,0)}25%{transform:translate3d(-30px,28vh,0)}50%{transform:translate3d(14px,56vh,0)}75%{transform:translate3d(-24px,84vh,0)}100%{transform:translate3d(6px,118vh,0)}}
@keyframes ltum{0%{transform:rotate(0) rotateX(0)}50%{transform:rotate(170deg) rotateX(160deg)}100%{transform:rotate(360deg) rotateX(360deg)}}
.lvs{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}

/* ---------------------------------------------------------------- VOWS */
.d-vows{--fs:"Rozha One",Georgia,serif;--fb:"Poppins",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-vows .hero{background:#1A0606}
.d-vows .ss{z-index:0}.d-vows .hveil{z-index:1;background:linear-gradient(180deg,rgba(26,6,6,.5) 0,rgba(26,6,6,.05) 22%,rgba(26,6,6,.3) 36%,rgba(26,6,6,.84) 52%,rgba(26,6,6,.96) 100%)}
.d-vows .hero-in{z-index:3}
.d-vows .hero .nm{color:#FFF1D0}.d-vows .nm .amp{color:#F6C453}
.d-vows .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-vows .cdu .rp{stroke:#F6C453}.d-vows .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-vows .pfo{transform:none;border:2px solid var(--gold);border-radius:2px}.d-vows .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:6px}
.d-vows .pc:hover .pfo{transform:none}.d-vows .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-vows .pfi{border-radius:0px}
.d-vows .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-vows .h2.scr,.d-vows .ty{font-family:var(--fs)}
.d-vows .cillu{color:var(--acc)}
.d-vows .strip{background:linear-gradient(90deg,#7A1A10,#C23A1A,#7A1A10);color:#fff}.d-vows .strip i{fill:#F6C453}
.d-vows .when{background:linear-gradient(180deg,#7A1A10,#3A0A06)}.d-vows .wave{fill:#7A1A10}.d-vows .wave.b{fill:#3A0A06}
.d-vows .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-vows .btn.w{color:#7A1A10}
.d-vows .foot::before{background:linear-gradient(180deg,rgba(26,6,6,.42),rgba(122,26,16,.9))}
.d-vows .ft-n span{color:#F6C453}
/* first page: Saptapadi – the sacred fire and seven steps */
.d-vows #intro{background:radial-gradient(ellipse at 50% 56%,#5E1608,#260707 52%,#120303);color:#FFEFD6}
.sv{position:relative;z-index:3;margin:auto;width:min(94vw,520px);display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 0;text-align:center}
.sv-k{margin:0;font:500 clamp(9.5px,2.5vw,11px) var(--fb);letter-spacing:.3em;text-transform:uppercase;color:#F6C453;opacity:0;animation:fadein 1s .3s forwards}
.sv-n{display:flex;flex-direction:column;align-items:center;margin:0;max-width:100%;font:400 clamp(40px,12vw,66px)/1.08 var(--fs);background:linear-gradient(180deg,#FFF3CF,#F6C453 55%,#D9861C);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;animation:svup 1.2s cubic-bezier(.2,.8,.2,1) .45s forwards}
.sv-n span{max-width:100%;overflow-wrap:anywhere}
.sv-n i{font:italic 500 .42em/1.3 var(--fd);-webkit-text-fill-color:#F6C453}
@keyframes svup{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}
.sv-stage{display:flex;align-items:center;justify-content:center;gap:clamp(2px,1.6vw,12px);width:100%}
.sv-i{flex:none;position:relative;display:grid;place-items:center;width:clamp(62px,17vw,92px);aspect-ratio:.78;overflow:hidden;border:2px solid #F6C453;box-shadow:0 0 0 4px rgba(246,196,83,.14),0 14px 26px -12px #000;background:linear-gradient(140deg,#E2502A,#F6C453);opacity:0;animation:fadein 1s 2.4s forwards}
.sv-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sv-i b{font:400 34px var(--fs);color:#fff}
.sv-ring{position:relative;flex:none;width:clamp(170px,48vw,250px);aspect-ratio:1}
.sv-ring::before{content:"";position:absolute;inset:6%;border-radius:50%;border:1px dashed rgba(246,196,83,.35)}
.sv-step{position:absolute;left:50%;top:50%;width:16px;height:28px;margin:-14px 0 0 -8px;transform:rotate(calc(var(--q) * 51.43deg)) translate3d(0,calc(clamp(170px,48vw,250px) * -.44),0) rotate(90deg) scale(.4);opacity:0;animation:svstep .5s cubic-bezier(.3,1.5,.5,1) forwards;animation-delay:calc(.9s + var(--q) * .2s)}
@keyframes svstep{to{opacity:1;transform:rotate(calc(var(--q) * 51.43deg)) translate3d(0,calc(clamp(170px,48vw,250px) * -.44),0) rotate(90deg) scale(1)}}
.sv-step svg{width:100%;height:100%;display:block;fill:#E0283E;filter:none}
.sv-step:nth-child(odd) svg{transform:scaleX(-1)}
.sv-step b{position:absolute;left:20px;top:6px;font:600 10px var(--fb);color:#F6C453;transform:rotate(calc(-1 * (var(--q) * 51.43deg + 90deg)))}
.sv-fire{position:absolute;left:24%;top:22%;width:52%;height:52%;will-change:transform}
.sv-glow{position:absolute;inset:-55%;border-radius:50%;background:radial-gradient(circle,rgba(255,176,64,.5),rgba(226,80,42,.18) 40%,transparent 66%);animation:svglow 2.2s ease-in-out infinite alternate}
@keyframes svglow{from{opacity:.65;transform:scale(.95)}to{opacity:1;transform:scale(1.06)}}
.sv-kund{position:absolute;left:12%;right:12%;bottom:6%;height:28%;border-radius:0 0 50% 50%/0 0 100% 100%;background:linear-gradient(180deg,#D98A3A,#8A4214 70%,#5A2A0C)}
.sv-kund::before{content:"";position:absolute;left:-4%;right:-4%;top:-10px;height:20px;border-radius:50%;background:radial-gradient(ellipse at 50% 50%,#3A1206 40%,#E9A55A 42%,#B4651F 70%)}
.sv-f{position:absolute;left:50%;bottom:24%;width:42%;height:70%;margin-left:-21%;border-radius:50% 50% 50% 50%/62% 62% 38% 38%;background:radial-gradient(ellipse at 50% 82%,#FFF8D6 0,#FFD34D 26%,#FF8A1F 52%,rgba(226,80,42,.85) 66%,rgba(226,80,42,0) 74%);transform-origin:50% 100%;animation:svfl .45s ease-in-out infinite alternate}
.sv-f.f2{width:30%;height:52%;margin-left:-36%;animation-duration:.6s;animation-delay:-.2s}
.sv-f.f3{width:30%;height:56%;margin-left:6%;animation-duration:.52s;animation-delay:-.35s}
.sv-f.f4{width:20%;height:38%;margin-left:-10%;bottom:26%;background:radial-gradient(ellipse at 50% 80%,#FFFFFF,#FFF2B0 50%,rgba(255,220,120,0) 72%);animation-duration:.38s}
@keyframes svfl{from{transform:scale(.92,.86) skewX(-3deg)}to{transform:scale(1.04,1.1) skewX(3deg)}}
.sv-sp{position:absolute;left:calc(38% + var(--q) * 3%);bottom:50%;width:3px;height:3px;border-radius:50%;background:#FFD34D;box-shadow:0 0 6px 2px rgba(255,170,60,.8);opacity:0;animation:svsp calc(1.4s + var(--q) * .17s) ease-out infinite;animation-delay:calc(var(--q) * -.31s)}
@keyframes svsp{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:1}100%{transform:translate3d(calc((var(--q) - 3.5) * 6px),-90px,0);opacity:0}}
.sv-info{display:flex;flex-direction:column;align-items:center;gap:3px;opacity:0;animation:fadein 1s 2.3s forwards}
.sv-info::before{content:"";width:120px;height:1px;margin-bottom:8px;background:linear-gradient(90deg,transparent,#F6C453,transparent)}
.sv-e{margin:0;font:600 10.5px var(--fb);letter-spacing:.28em;text-transform:uppercase;color:#F6C453}
.sv-d{margin:0;font:400 clamp(19px,5.4vw,24px)/1.25 var(--fs);color:#FFEFD6}
.sv-t,.sv-v{margin:0;font:400 clamp(13px,3.5vw,14.5px)/1.45 var(--fb);color:rgba(255,239,214,.8)}
.d-vows .open-btn{margin-top:6px;width:min(80vw,270px);border-radius:999px;background:linear-gradient(120deg,#D9861C,#F6C453 50%,#FFE7A0);color:#3A1208;font:700 13px var(--fb);letter-spacing:.14em;box-shadow:0 0 28px -4px rgba(246,196,83,.6);opacity:0;animation:fadein 1s 2.6s forwards}
.d-vows .open-btn::after{border-radius:999px;border-color:#F6C453}
.sv-flash{position:absolute;inset:0;z-index:6;pointer-events:none;background:radial-gradient(circle at 50% 55%,#FFF6D6,#FFC24A 40%,#E2502A 80%);opacity:0}
/* opening: the fire blazes and fills the screen with light */
.d-vows.opening #intro .sv-fire{transition:transform 1s cubic-bezier(.5,0,.75,0);transform:scale(3.2)}
.d-vows.opening #intro .sv-flash{transition:opacity .7s ease .35s;opacity:1}
.d-vows.opening #intro .sv-n,.d-vows.opening #intro .sv-info,.d-vows.opening #intro .sv-i,.d-vows.opening #intro .open-btn{animation:none;transition:opacity .4s;opacity:0}
.d-vows.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero: countdown as glowing diyas */
.d-vows .wgm{color:#F6C453;font-weight:600}
.d-vows .hero .nm{text-shadow:0 0 24px rgba(246,196,83,.45),0 4px 18px rgba(0,0,0,.5)}
.d-vows .cd{gap:clamp(10px,3vw,20px);padding-top:30px}
.d-vows .cdu{overflow:visible;border-radius:6px 6px 50% 50%/6px 6px 60% 60%;aspect-ratio:1.1;background:linear-gradient(180deg,#C8752E,#7A3A12 80%);box-shadow:0 12px 20px -10px #000,inset 0 4px 0 #E9A55A}
.d-vows .cdu::before{content:"";position:absolute;left:50%;top:-30px;width:18px;height:30px;margin-left:-9px;border-radius:50% 50% 50% 50%/62% 62% 38% 38%;background:radial-gradient(ellipse at 50% 82%,#FFF8D6,#FFD34D 30%,#FF8A1F 58%,rgba(226,80,42,0) 74%);transform-origin:50% 100%;animation:svfl .5s ease-in-out infinite alternate}
.d-vows .cdu:nth-child(2)::before{animation-delay:-.2s}.d-vows .cdu:nth-child(3)::before{animation-delay:-.35s}.d-vows .cdu:nth-child(4)::before{animation-delay:-.1s}
.d-vows .cdu svg{display:none}
.d-vows .cdu b{color:#FFF1D0;font-family:var(--fs);font-weight:400}
.d-vows .cdu span{color:#FFD9A0}
.d-vows .fli{inset:auto;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#FFD34D;box-shadow:0 0 8px 3px rgba(255,150,40,.7)}
.d-vows.cfall .cfx i:nth-child(n){animation-name:svrise;top:auto;bottom:-20px}
.d-vows.cfall .cfx i .fli{animation:none}
@keyframes svrise{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:1}100%{transform:translate3d(24px,-110vh,0);opacity:0}}
/* sections */
.d-vows .k{color:#C23A1A;font-weight:600}
.d-vows .pfo{border-color:#F6C453}
.d-vows .ev{background:rgba(255,255,255,.1);border:1px solid rgba(246,196,83,.5)}
.d-vows .evdate{background:#E2502A}
.d-vows .evb h3{color:#F6C453}

/* ---------------------------------------------------------------- SILK */
.d-silk{--fs:"Gilda Display",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-silk .hero{background:#3A0626}
.d-silk .ss{z-index:0}.d-silk .hveil{z-index:1;background:linear-gradient(180deg,rgba(58,6,38,.5) 0,rgba(58,6,38,.05) 22%,rgba(58,6,38,.3) 36%,rgba(58,6,38,.84) 52%,rgba(58,6,38,.96) 100%)}
.d-silk .hero-in{z-index:3}
.d-silk .hero .nm{color:#FFE7A0}.d-silk .nm .amp{color:#E7B84A}
.d-silk .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-silk .cdu .rp{stroke:#E7B84A}.d-silk .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-silk .pfo{transform:none;border:2px solid var(--gold);border-radius:0px}.d-silk .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:4px}
.d-silk .pc:hover .pfo{transform:none}.d-silk .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-silk .pfi{border-radius:0px}
.d-silk .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-silk .h2.scr,.d-silk .ty{font-family:var(--fs)}
.d-silk .cillu{color:var(--acc)}
.d-silk .strip{background:linear-gradient(90deg,#6E0B3E,#B5195E,#6E0B3E);color:#fff}.d-silk .strip i{fill:#E7B84A}
.d-silk .when{background:linear-gradient(180deg,#6E0B3E,#3A0626)}.d-silk .wave{fill:#6E0B3E}.d-silk .wave.b{fill:#3A0626}
.d-silk .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-silk .btn.w{color:#6E0B3E}
.d-silk .foot::before{background:linear-gradient(180deg,rgba(58,6,38,.42),rgba(110,11,62,.9))}
.d-silk .ft-n span{color:#E7B84A}
/* first page: a Kanjivaram silk saree with a gold zari border */
.d-silk #intro{background:linear-gradient(115deg,#55062F 0%,#8E0E52 20%,#640A3C 38%,#A3155F 56%,#5E0838 76%,#86104C 100%);color:#FFF1DC}
.sk-sheen{position:fixed;inset:0 -60%;z-index:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,205,170,.14) 47%,rgba(255,255,255,.26) 50%,rgba(255,205,170,.14) 53%,transparent 60%);animation:sksheen 6s ease-in-out infinite}
@keyframes sksheen{0%{transform:translate3d(-35%,0,0)}100%{transform:translate3d(35%,0,0)}}
.sk-zari{position:absolute;left:0;right:0;z-index:1;height:clamp(50px,13vw,74px);background:radial-gradient(circle,#8E0E52 2.2px,transparent 2.8px) 0 50%/18px 18px repeat-x,linear-gradient(#FFE7A0,#FFE7A0) 0 6px/100% 2px no-repeat,linear-gradient(#FFE7A0,#FFE7A0) 0 calc(100% - 6px)/100% 2px no-repeat,repeating-linear-gradient(90deg,#C9962E 0 2px,#F5D77A 2px 4px,#E7B84A 4px 6px);box-shadow:0 0 0 1px #8C6418;overflow:visible}
.sk-zari::after{content:"";position:absolute;left:0;right:0;height:22px;background:conic-gradient(from 135deg at 50% 0,#E7B84A 90deg,transparent 0) 0 0/26px 22px repeat-x}
.sk-zari.t{top:0}.sk-zari.t::after{top:100%}
.sk-zari.b{bottom:0}.sk-zari.b::after{bottom:100%;transform:scaleY(-1)}
.sk-zari::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%) 0 0/50% 100% no-repeat;animation:skglint 3.6s ease-in-out infinite}
@keyframes skglint{0%{background-position:-60% 0}60%,100%{background-position:220% 0}}
.sk{position:relative;z-index:3;margin:auto;width:min(92vw,470px);display:flex;flex-direction:column;align-items:center;gap:10px;padding:clamp(86px,22vw,112px) 0 clamp(80px,20vw,104px);text-align:center}
.sk-k{margin:0;font:italic 500 clamp(15px,4vw,18px) var(--fd);color:#FFD9C2}
.sk-pics{display:flex;align-items:center;justify-content:center;gap:clamp(10px,3vw,18px);margin:6px 0}
.sk-i{position:relative;display:grid;place-items:center;width:clamp(86px,25vw,118px);aspect-ratio:.8;overflow:hidden;border:3px solid #E7B84A;outline:1px dashed #FFE7A0;outline-offset:4px;background:linear-gradient(140deg,#B5195E,#E7B84A)}
.sk-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sk-i b{font:400 40px var(--fs);color:#fff}
.sk-knot{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle,#FFE7A0 0 22%,#B5195E 24% 36%,#E7B84A 38% 60%,transparent 62%),repeating-conic-gradient(#E7B84A 0 15deg,transparent 15deg 30deg);animation:spin 12s linear infinite}
.sk-n{display:flex;flex-direction:column;align-items:center;margin:4px 0 0;max-width:100%;font:400 clamp(40px,11.6vw,62px)/1.08 var(--fs);background:linear-gradient(100deg,#B8862E 0%,#FFF0B8 22%,#E7B84A 40%,#B8862E 60%,#FFF0B8 80%,#E7B84A 100%) 0 0/200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:skfoil 5s linear infinite}
.sk-n span{max-width:100%;overflow-wrap:anywhere}
.sk-n i{font:italic 500 .48em/1.3 var(--fd)}
@keyframes skfoil{to{background-position:-200% 0}}
.sk-band{width:min(80%,280px);height:14px;margin:4px 0;background:conic-gradient(from 135deg at 50% 0,#E7B84A 90deg,transparent 0) 0 0/14px 10px repeat-x,linear-gradient(#E7B84A,#E7B84A) 0 100%/100% 3px no-repeat}
.sk-e{margin:0;font:600 10.5px var(--fb);letter-spacing:.3em;text-transform:uppercase;color:#E7B84A}
.sk-d{margin:0;font:500 clamp(15px,4vw,18px)/1.4 var(--fb);color:#FFF1DC}
.sk-v{margin:0;font:400 clamp(13px,3.5vw,15px)/1.45 var(--fb);color:rgba(255,241,220,.82)}
.d-silk .open-btn{margin-top:10px;width:min(80vw,280px);border-radius:2px;background:linear-gradient(100deg,#B8862E,#FFF0B8 45%,#E7B84A 60%,#B8862E);color:#55062F;font:600 12.5px var(--fb);letter-spacing:.2em;box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
.d-silk .open-btn::after{border-radius:4px;border-color:#E7B84A}
.sk-drape{position:fixed;inset:-2%;z-index:6;pointer-events:none;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.18) 50%,transparent 60%),repeating-linear-gradient(90deg,rgba(0,0,0,.08) 0 30px,rgba(255,255,255,.04) 30px 60px),linear-gradient(115deg,#064A3A,#0B6E55 40%,#075241 70%,#0A6A52);transform:translate3d(0,110%,0) skewY(0)}
.sk-drape::before{content:"";position:absolute;left:0;right:0;top:0;height:46px;background:repeating-linear-gradient(90deg,#C9962E 0 2px,#F5D77A 2px 4px);box-shadow:0 2px 0 #8C6418}
.d-silk:not(.opening) .sk-drape{animation:skdrape 1.5s cubic-bezier(.6,0,.3,1) .25s backwards}
@keyframes skdrape{from{transform:translate3d(0,0,0)}}
/* opening: the green silk pallu sweeps back over, the zari border slides away */
.d-silk.opening #intro .sk-drape{transition:transform 1.1s cubic-bezier(.6,0,.3,1);transform:translate3d(0,0,0) skewY(-4deg)}
.d-silk.opening #intro .sk-zari.t{transition:transform .9s cubic-bezier(.6,0,.4,1);transform:translate3d(0,-120%,0)}
.d-silk.opening #intro .sk-zari.b{transition:transform .9s cubic-bezier(.6,0,.4,1);transform:translate3d(0,120%,0)}
.d-silk.opening #intro{transition:opacity .8s ease 1.1s;opacity:0}
/* hero */
.sk-zari.hz{z-index:2;height:34px;opacity:.95}
.sk-zari.hz.t{top:auto;bottom:auto;top:58px}
.sk-zari.hz::after{height:14px;background-size:16px 14px}
.d-silk .wgm{color:#FFE7A0;font-weight:600}
.d-silk .hero .nm{color:#FFE7A0;text-shadow:none}
.d-silk .hero .nm .nw{background:linear-gradient(100deg,#E7B84A,#FFF6D2 30%,#E7B84A 55%,#FFF6D2 85%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.d-silk .hero-in{text-shadow:0 2px 10px rgba(0,0,0,.4)}
.d-silk .cd{gap:clamp(8px,2.6vw,16px)}
.d-silk .cdu{border-radius:4px;aspect-ratio:.86;background:linear-gradient(135deg,#8E0E52,#55062F);box-shadow:inset 0 0 0 2px #E7B84A,inset 0 0 0 5px #55062F,inset 0 0 0 6px rgba(231,184,74,.6),0 12px 20px -10px #000}
.d-silk .cdu svg{display:none}
.d-silk .cdu b{color:#FFE7A0;font-family:var(--fs);font-weight:400}
.d-silk .fli{color:#E0284A}.d-silk .cfx i:nth-child(2n) .fli{color:#FF7A94}.d-silk .cfx i:nth-child(3n) .fli{color:#B5195E}
/* sections */
.d-silk .k{color:#B5195E;font-weight:600}
.d-silk .strip{background:repeating-linear-gradient(90deg,#C9962E 0 2px,#F5D77A 2px 4px,#E7B84A 4px 6px);color:#55062F}
.d-silk .strip b{font-family:var(--fs)}
.d-silk .strip i{fill:#B5195E}
.d-silk .pfo{border:3px solid #E7B84A;border-radius:0}.d-silk .pfo::after{border:1px dashed #B5195E;border-radius:0}
.d-silk .when{border-top:6px solid #E7B84A;border-bottom:6px solid #E7B84A}
.d-silk .ev{background:rgba(255,255,255,.1);border:1px solid rgba(231,184,74,.6);border-radius:2px}
.d-silk .evdate{background:#E7B84A;color:#55062F}
.d-silk .evb h3{color:#FFE7A0}
@media (max-height:820px){.sk{gap:6px;padding-top:max(74px,min(22vw,96px));padding-bottom:max(70px,min(20vw,90px))}.sk-i{width:min(25vw,13vh,118px)}.sk-n{font-size:clamp(36px,min(11.6vw,7vh),62px)}}

/* ---------------------------------------------------------------- BANGLE */
.d-bangle{--fs:"Dancing Script",cursive;--fb:"Nunito",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-bangle .hero{background:#2A0718}
.d-bangle .ss{z-index:0}.d-bangle .hveil{z-index:1;background:linear-gradient(180deg,rgba(42,7,24,.5) 0,rgba(42,7,24,.05) 22%,rgba(42,7,24,.3) 36%,rgba(42,7,24,.84) 52%,rgba(42,7,24,.96) 100%)}
.d-bangle .hero-in{z-index:3}
.d-bangle .hero .nm{color:#FFFFFF}.d-bangle .nm .amp{color:#E8B04A}
.d-bangle .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-bangle .cdu .rp{stroke:#E8B04A}.d-bangle .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-bangle .pfo{transform:none;border:2px solid var(--gold);border-radius:10px}.d-bangle .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:14px}
.d-bangle .pc:hover .pfo{transform:none}.d-bangle .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-bangle .pfi{border-radius:8px}
.d-bangle .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-bangle .h2.scr,.d-bangle .ty{font-family:var(--fs)}
.d-bangle .cillu{color:var(--acc)}
.d-bangle .strip{background:linear-gradient(90deg,#9C1450,#D81B60,#9C1450);color:#fff}.d-bangle .strip i{fill:#E8B04A}
.d-bangle .when{background:linear-gradient(180deg,#9C1450,#5E0A30)}.d-bangle .wave{fill:#9C1450}.d-bangle .wave.b{fill:#5E0A30}
.d-bangle .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-bangle .btn.w{color:#9C1450}
.d-bangle .foot::before{background:linear-gradient(180deg,rgba(42,7,24,.42),rgba(156,20,80,.9))}
.d-bangle .ft-n span{color:#E8B04A}
/* first page: glass bangles */
.d-bangle #intro{background:radial-gradient(circle,rgba(232,176,74,.35) 1px,transparent 1.6px) 0 0/22px 22px,radial-gradient(ellipse at 50% 28%,#FFF4F7,#FBD6E1 55%,#F3AEC3);color:#3A0E22}
.bg{position:relative;z-index:3;margin:auto;width:min(92vw,460px);display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px 0 24px;text-align:center}
.bg-stack{position:relative;width:200px;height:170px;-webkit-perspective:700px;perspective:700px}
.bg-stack i{position:absolute;left:10px;top:calc(-58px + var(--q) * 12px);width:180px;height:180px;transform:rotateX(74deg);animation:bgdrop .75s cubic-bezier(.3,1.35,.5,1) both;animation-delay:calc(.25s + var(--q) * .13s)}
.bg-stack i::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,var(--c1),var(--c2) 12%,#fff 15%,var(--c2) 18%,var(--c1) 34%,var(--c2) 52%,var(--c1) 66%,#fff 70%,var(--c1) 74%,var(--c2) 88%,var(--c1));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 15px),#000 calc(100% - 14px));mask:radial-gradient(farthest-side,transparent calc(100% - 15px),#000 calc(100% - 14px));animation:spin calc(5s + var(--q) * .6s) linear infinite}
.bg-stack i:nth-child(odd)::before{-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px));mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px));animation-direction:reverse}
.bg-stack i{--c1:#C2185B;--c2:#FF6F9C}
.bg-stack i:nth-child(odd){--c1:#B8862E;--c2:#FFE9A8}
.bg-stack i:nth-child(4n+2){--c1:#127A52;--c2:#5FE0A8}
.bg-stack i:nth-child(4n){--c1:#1E4FB0;--c2:#7FB4FF}
.bg-stack i:nth-child(6n){--c1:#7B1FA2;--c2:#D58CF0}
@keyframes bgdrop{from{transform:translate3d(0,-220px,0) rotateX(74deg);opacity:0}to{transform:rotateX(74deg);opacity:1}}
.bg-k{margin:4px 0 0;font:italic 500 clamp(16px,4.4vw,20px) var(--fd);color:#9C1450;opacity:0;animation:fadein 1s 1.5s forwards}
.bg-n{margin:0;max-width:100%;font:700 clamp(40px,11.6vw,60px)/1.12 var(--fs);color:#9C1450;overflow-wrap:anywhere;opacity:0;animation:svup 1s cubic-bezier(.2,.8,.2,1) 1.6s forwards}
.bg-n i{font-style:normal;color:#E8B04A}
@keyframes svup{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}
.bg-pics{display:flex;align-items:center;justify-content:center;gap:clamp(10px,3vw,18px);opacity:0;animation:fadein 1s 1.9s forwards}
.bg-i{position:relative;display:grid;place-items:center;width:clamp(84px,24vw,112px);aspect-ratio:.8;overflow:hidden;border:4px solid #fff;border-radius:10px;box-shadow:0 12px 24px -12px rgba(156,20,80,.6);background:linear-gradient(140deg,#D81B60,#E8B04A)}
.bg-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.bg-i b{font:700 42px var(--fs);color:#fff}
.bg-ring{position:relative;width:46px;height:46px}
.bg-ring::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(#C2185B,#FFE9A8,#127A52,#FF6F9C,#1E4FB0,#E8B04A,#C2185B);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px));mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px));animation:spin 4s linear infinite}
.bg-card{width:min(100%,340px);padding:16px 16px 14px;border:3px solid transparent;border-radius:18px;background:linear-gradient(#FFFBFC,#FFFBFC) padding-box,linear-gradient(90deg,#C2185B,#E8B04A,#127A52,#1E4FB0,#C2185B) border-box;box-shadow:0 18px 34px -22px rgba(156,20,80,.6);opacity:0;animation:fadein 1s 2.1s forwards}
.bg-e{margin:0;font:700 10.5px var(--fb);letter-spacing:.28em;text-transform:uppercase;color:#D81B60}
.bg-d{margin:6px 0 0;font:700 clamp(16px,4.4vw,19px)/1.3 var(--fb);color:#3A0E22}
.bg-t,.bg-v{margin:3px 0 0;font:500 14px/1.4 var(--fb);color:#7E5A68}
.d-bangle .open-btn{width:min(80vw,270px);border-radius:999px;background:linear-gradient(120deg,#9C1450,#D81B60 50%,#E8B04A);color:#fff;font:700 13px var(--fb);letter-spacing:.16em;box-shadow:0 14px 26px -12px rgba(156,20,80,.7);opacity:0;animation:fadein 1s 2.3s forwards}
.d-bangle .open-btn::after{border-radius:999px;border-color:#D81B60}
@media (max-width:360px){.bg-stack{transform:scale(.86);margin:-10px 0}}
/* opening: the bangles roll away to both sides */
.d-bangle.opening #intro .bg-stack i{animation:none;transition:transform 1s cubic-bezier(.5,0,.75,0),opacity .4s .7s;transition-delay:calc(var(--q) * .05s);transform:translate3d(120vw,0,0) rotateX(74deg);opacity:0}
.d-bangle.opening #intro .bg-stack i:nth-child(even){transform:translate3d(-120vw,0,0) rotateX(74deg)}
.d-bangle.opening #intro .bg-n,.d-bangle.opening #intro .bg-k,.d-bangle.opening #intro .bg-pics,.d-bangle.opening #intro .bg-card,.d-bangle.opening #intro .open-btn{animation:none;transition:opacity .5s .3s,transform .8s .3s;opacity:0;transform:scale(.94)}
.d-bangle.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero */
.bg-stack.hb{position:absolute;top:58px;z-index:2;transform:scale(.42);transform-origin:0 0}
.bg-stack.hb.l{left:8px}.bg-stack.hb.r{right:8px;transform-origin:100% 0}
.bg-stack.hb i{animation:none}
.d-bangle .wgm{color:#FFD6E4;font-weight:700}
.d-bangle .cd{gap:clamp(10px,3vw,20px)}
.d-bangle .cdu{background:radial-gradient(circle,rgba(42,7,24,.75) 0 58%,transparent 60%);box-shadow:none}
.d-bangle .cdu::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--c1),var(--c2) 15%,#fff 18%,var(--c2) 21%,var(--c1) 40%,var(--c2) 60%,#fff 66%,var(--c1) 72%,var(--c2) 88%,var(--c1));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 9px),#000 calc(100% - 8px));mask:radial-gradient(farthest-side,transparent calc(100% - 9px),#000 calc(100% - 8px));animation:spin 6s linear infinite}
.d-bangle .cdu{--c1:#C2185B;--c2:#FF6F9C}.d-bangle .cdu:nth-child(2){--c1:#B8862E;--c2:#FFE9A8}.d-bangle .cdu:nth-child(3){--c1:#127A52;--c2:#5FE0A8}.d-bangle .cdu:nth-child(4){--c1:#1E4FB0;--c2:#7FB4FF}
.d-bangle .cdu svg{display:none}
.d-bangle .fli{inset:auto;left:50%;top:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;border-radius:50%;background:#FFE9A8;box-shadow:0 0 8px 3px rgba(255,214,140,.75)}
.d-bangle.cfall .cfx i .fli{animation:bgtw 1.6s ease-in-out infinite alternate}
@keyframes bgtw{from{opacity:.2;transform:scale(.6)}to{opacity:1;transform:scale(1.2)}}
/* sections */
.d-bangle .k{color:#D81B60;font-weight:700}
.d-bangle .pfo{border:4px solid transparent;border-radius:12px;background:linear-gradient(90deg,#C2185B,#E8B04A,#127A52,#1E4FB0) border-box;-webkit-mask:linear-gradient(#000,#000) padding-box exclude,linear-gradient(#000,#000);mask:linear-gradient(#000,#000) padding-box exclude,linear-gradient(#000,#000)}
.d-bangle .pfo::after{display:none}
.d-bangle .pfi{border-radius:8px}
.d-bangle .strip{background:linear-gradient(90deg,#C2185B,#E8B04A,#127A52,#1E4FB0,#C2185B)}
.d-bangle .ev{background:#FFFBFC;color:#3A0E22;border-radius:18px}
.d-bangle .ev .evi{color:#D81B60}.d-bangle .evdate{background:#D81B60}
.d-bangle .evb h3{color:#9C1450}
.d-bangle .ev .btn.wg{color:#9C1450;border-color:#9C1450}.d-bangle .btn{background:#9C1450;border-color:#9C1450}.d-bangle .btn.ghost{background:transparent;color:#9C1450}.d-bangle .btn.w{background:#D81B60;border-color:#D81B60;color:#fff}.d-bangle .btn.wa{background:#25D366;border-color:#25D366}

/* ---------------------------------------------------------------- MISTY */
.d-misty{--fs:"Caveat",cursive;--fb:"Quicksand",system-ui,sans-serif;--fd:"Caveat",cursive}
.d-misty .hero{background:#0E2620}
.d-misty .ss{z-index:0}.d-misty .hveil{z-index:1;background:linear-gradient(180deg,rgba(14,38,32,.5) 0,rgba(14,38,32,.05) 22%,rgba(14,38,32,.3) 36%,rgba(14,38,32,.84) 52%,rgba(14,38,32,.96) 100%)}
.d-misty .hero-in{z-index:3}
.d-misty .hero .nm{color:#2B3A2E}.d-misty .nm .amp{color:#FFF3A8}
.d-misty .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-misty .cdu .rp{stroke:#FFF3A8}.d-misty .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-misty .pfo{transform:none;border:2px solid var(--gold);border-radius:2px}.d-misty .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:6px}
.d-misty .pc:hover .pfo{transform:none}.d-misty .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-misty .pfi{border-radius:0px}
.d-misty .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-misty .h2.scr,.d-misty .ty{font-family:var(--fs)}
.d-misty .cillu{color:var(--acc)}
.d-misty .strip{background:linear-gradient(90deg,#5E8C6A,#7FA88A,#5E8C6A);color:#fff}.d-misty .strip i{fill:#FFF3A8}
.d-misty .when{background:linear-gradient(180deg,#4F7A5C,#355A42)}.d-misty .wave{fill:#4F7A5C}.d-misty .wave.b{fill:#355A42}
.d-misty .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-misty .btn.w{color:#4F7A5C}
.d-misty .foot::before{background:linear-gradient(180deg,rgba(14,38,32,.42),rgba(79,122,92,.9))}
.d-misty .ft-n span{color:#FFF3A8}
/* first page: a scrapbook journal */
.d-misty #intro{background:radial-gradient(circle,rgba(60,90,70,.08) 1px,transparent 1.5px) 0 0/14px 14px,linear-gradient(160deg,#E3ECDD,#CFDDC6);color:#2B3A2E;-webkit-perspective:1400px;perspective:1400px}
.sb{position:relative;z-index:3;margin:auto;width:min(92vw,470px);padding:44px clamp(16px,5vw,28px) 24px 46px;border-radius:6px;background:linear-gradient(90deg,transparent 30px,#F2B8B8 30px 31px,transparent 31px),repeating-linear-gradient(180deg,transparent 0 29px,#DCE6F0 29px 30px),#FFFDF6;box-shadow:0 26px 50px -24px rgba(30,50,35,.55);text-align:center;transform-origin:50% 0;animation:sbin 1s cubic-bezier(.2,.8,.2,1) .2s both}
@keyframes sbin{from{transform:translate3d(0,40px,0) rotate(2deg);opacity:0}}
.sb-rings{position:absolute;left:18px;right:18px;top:-12px;height:30px;background:radial-gradient(circle at 50% 55%,transparent 6px,#6E7E74 6px 8.5px,transparent 9px) 0 0/26px 30px repeat-x}
.sb-date{position:absolute;right:16px;top:16px;margin:0;font:600 18px var(--fs);color:#8C6A4A;transform:rotate(4deg)}
.sb-h{margin:0 0 14px;font:700 clamp(28px,8vw,38px)/1.1 var(--fs);color:#3A5A44}
.sb-pics{display:flex;align-items:flex-start;justify-content:center;gap:clamp(6px,3vw,16px)}
.sb-pic{position:relative;margin:0;padding:8px 8px 6px;background:#fff;box-shadow:0 10px 20px -10px rgba(0,0,0,.45);animation:place .7s cubic-bezier(.3,1.4,.5,1) both}
.sb-pic.a{--r:-5deg;animation-delay:.6s}.sb-pic.b{--r:4deg;animation-delay:.85s}
.sb-pic{transform:rotate(var(--r))}
@keyframes place{from{transform:scale(1.35) rotate(calc(var(--r) * 3));opacity:0}to{transform:rotate(var(--r));opacity:1}}
.tape{position:absolute;left:50%;top:-12px;z-index:2;width:72px;height:22px;margin-left:-36px;background:repeating-linear-gradient(45deg,rgba(240,190,120,.75) 0 6px,rgba(250,215,160,.75) 6px 12px);transform:rotate(-4deg);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.sb-i{display:grid;place-items:center;width:clamp(104px,30vw,146px);aspect-ratio:.82;overflow:hidden;background:linear-gradient(140deg,#9BC5A5,#E9C46A)}
.sb-i img{width:100%;height:100%;object-fit:cover}.sb-i b{font:700 54px var(--fs);color:#fff}
.sb-pic figcaption{margin-top:4px;font:700 clamp(22px,6.4vw,28px)/1.1 var(--fs);color:#2B3A2E}
.sb-hrt{margin-top:46px;font-size:26px;color:#E25563;animation:beat 1.4s ease-in-out infinite}
.sb-note{position:relative;margin:22px auto 0;width:min(100%,300px);padding:16px 14px 14px;background:#FFF3A8;box-shadow:0 12px 20px -12px rgba(0,0,0,.45);transform:rotate(-2deg);animation:place2 .7s cubic-bezier(.3,1.4,.5,1) 1.1s both}
@keyframes place2{from{transform:scale(1.3) rotate(-8deg);opacity:0}to{transform:rotate(-2deg);opacity:1}}
.clip{position:absolute;left:24px;top:-14px;width:14px;height:36px;border:2.5px solid #8A9A90;border-radius:8px}
.sb-k{margin:0;font:700 14px var(--fb);letter-spacing:.2em;text-transform:uppercase;color:#8C6A4A}
.sb-d{margin:4px 0 0;font:700 clamp(24px,6.6vw,30px)/1.1 var(--fs);color:#2B3A2E}
.sb-t,.sb-v{margin:4px 0 0;font:500 14px/1.4 var(--fb);color:#4A5A4E}
.sb-arrow{display:block;width:90px;height:44px;margin:4px auto -4px;fill:none;stroke:#3A5A44;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sb-arrow path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1s ease 1.6s forwards}
.sb-leaf{position:absolute;right:-6px;bottom:44px;width:34px;color:#5E9E6E;transform:rotate(-30deg)}
.sb-leaf svg{width:100%;display:block}
.d-misty .open-btn{margin:8px auto 0;width:auto;padding:10px 26px;border:2px dashed #3A5A44;border-radius:8px;background:transparent;color:#3A5A44;font:700 24px var(--fs);letter-spacing:0;text-transform:none;box-shadow:none;transform:rotate(-2deg)}
.d-misty .open-btn::before{display:none}.d-misty .open-btn::after{border-radius:10px;border-color:#3A5A44}
/* opening: the notebook page flips over */
.d-misty.opening #intro .sb{animation:none;transform-origin:50% 0;transition:transform 1.2s cubic-bezier(.6,0,.3,1),opacity .4s .85s;transform:rotateX(110deg);opacity:0}
.d-misty.opening #intro{transition:opacity .7s ease 1.05s;opacity:0}
/* hero: the slideshow is a taped photo on a notebook page */
.d-misty .hero{background:linear-gradient(90deg,transparent 30px,#F2B8B8 30px 31px,transparent 31px),repeating-linear-gradient(180deg,transparent 0 29px,#DCE6F0 29px 30px),#FFFDF6;color:#2B3A2E}
.d-misty .ss{left:50%;right:auto;top:96px;bottom:auto;width:var(--fw);aspect-ratio:.82;margin-left:calc(var(--fw) / -2);overflow:hidden;border:10px solid #fff;box-shadow:0 20px 40px -20px rgba(0,0,0,.55);transform:rotate(-2deg)}
.d-misty .hveil{display:none}
.sb-rings.hr{position:absolute;top:8px;left:24px;right:24px;z-index:2}
.tape.ht1,.tape.ht2{position:absolute;top:84px;z-index:3;margin:0}
.tape.ht1{left:calc(50% - var(--fw) / 2 - 18px);transform:rotate(-28deg)}
.tape.ht2{left:calc(50% + var(--fw) / 2 - 54px);transform:rotate(28deg)}
.d-misty .hero-in{padding:calc(var(--fw) / .82 + 120px) 0 110px}
.d-misty .wgm{color:#8C6A4A;font-weight:700}
.d-misty .hero .nm{font-weight:700;text-shadow:none;font-size:calc(var(--nk,1) * clamp(50px,13vw,92px))}
.d-misty .nm .amp{color:#E25563}
.d-misty .quote{color:#4A5A4E;text-shadow:none}.d-misty .quote::before,.d-misty .quote::after{color:#E25563}
.d-misty .cd{gap:clamp(8px,2.6vw,16px)}
.d-misty .cdu{border-radius:2px;aspect-ratio:1;background:#FFF3A8;color:#2B3A2E;box-shadow:0 10px 16px -10px rgba(0,0,0,.5);transform:rotate(-4deg)}
.d-misty .cdu:nth-child(2){background:#FFD0DA;transform:rotate(3deg)}.d-misty .cdu:nth-child(3){background:#CDEBD3;transform:rotate(-2deg)}.d-misty .cdu:nth-child(4){background:#CFE3F7;transform:rotate(5deg)}
.d-misty .cdu svg{display:none}
.d-misty .cdu b{font:700 clamp(30px,8vw,46px)/1 var(--fs)}
.d-misty .cdu span{font-family:var(--fb);color:#5A6A5E}
.d-misty .cd-note{color:#2B3A2E}
.d-misty .ssd i{background:rgba(43,58,46,.3)}.d-misty .ssd i.on{background:#3A5A44}
.d-misty .scroll-hint{border-color:#3A5A44}.d-misty .scroll-hint span{background:#3A5A44}
.d-misty .nav{background:rgba(255,253,246,.92);border-color:rgba(43,58,46,.15)}.d-misty .nav a{color:#2B3A2E}.d-misty .nav a.on,.d-misty .nav a:hover{color:#fff;background:#3A5A44}
.d-misty .fli{color:#5E9E6E}.d-misty .cfx i:nth-child(2n) .fli{color:#9BC53D}.d-misty .cfx i:nth-child(3n) .fli{color:#C9A84C}
/* sections: polaroids & sticky notes */
.d-misty .k{color:#8C6A4A;font-weight:700}
.d-misty .pf{background:#fff;padding:10px 10px 36px;box-shadow:0 20px 34px -22px rgba(0,0,0,.6)}
.d-misty .pc0 .pf{transform:rotate(-3deg)}.d-misty .pc1 .pf{transform:rotate(3deg)}
.d-misty .pfo{display:none}.d-misty .pfi{border-radius:0}
.d-misty .pc h3{font:700 clamp(32px,8vw,42px) var(--fs)}
.d-misty .strip{background:#FFF3A8;color:#2B3A2E}.d-misty .strip b{font-weight:700}.d-misty .strip i{fill:#E25563}
.d-misty .ev{background:#FFFDF6;color:#2B3A2E;border-radius:4px;box-shadow:0 16px 26px -18px rgba(0,0,0,.6)}
.d-misty .ev .evi{color:#3A5A44}.d-misty .evdate{background:#E25563}
.d-misty .evb h3{font:700 clamp(30px,7.4vw,38px) var(--fs)}
.d-misty .ev .btn.wg{color:#3A5A44;border-color:#3A5A44}.d-misty .btn{background:#3A5A44;border-color:#3A5A44}.d-misty .btn.ghost{background:transparent;color:#3A5A44}.d-misty .btn.w{background:#E25563;border-color:#E25563;color:#fff}.d-misty .btn.wa{background:#25D366;border-color:#25D366}
.d-misty .gi{border-radius:0;padding:8px 8px 24px;background:#fff;box-shadow:0 14px 24px -16px rgba(0,0,0,.5)}
.d-misty .gi:nth-child(odd){transform:rotate(-2deg)}.d-misty .gi:nth-child(even){transform:rotate(2deg)}

.d-misty .hero{--fw:min(80vw,420px,44vh)}

/* ---------------------------------------------------------------- POORAM */
.d-pooram{--fs:"Bungee",Impact,sans-serif;--fb:"Work Sans",system-ui,sans-serif;--fd:"Bungee",Impact,sans-serif}
.d-pooram .hero{background:#1E0A2A}
.d-pooram .ss{z-index:0}.d-pooram .hveil{z-index:1;background:linear-gradient(180deg,rgba(30,10,42,.5) 0,rgba(30,10,42,.05) 22%,rgba(30,10,42,.3) 36%,rgba(30,10,42,.84) 52%,rgba(30,10,42,.96) 100%)}
.d-pooram .hero-in{z-index:3}
.d-pooram .hero .nm{color:#FFF3D1}.d-pooram .nm .amp{color:#F4C430}
.d-pooram .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-pooram .cdu .rp{stroke:#F4C430}.d-pooram .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-pooram .pfo{transform:none;border:2px solid var(--gold);border-radius:4px}.d-pooram .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:8px}
.d-pooram .pc:hover .pfo{transform:none}.d-pooram .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-pooram .pfi{border-radius:2px}
.d-pooram .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-pooram .h2.scr,.d-pooram .ty{font-family:var(--fs)}
.d-pooram .cillu{color:var(--acc)}
.d-pooram .strip{background:linear-gradient(90deg,#1E0A2A,#3A1250,#1E0A2A);color:#fff}.d-pooram .strip i{fill:#F4C430}
.d-pooram .when{background:linear-gradient(180deg,#8E1B3A,#5A0F24)}.d-pooram .wave{fill:#8E1B3A}.d-pooram .wave.b{fill:#5A0F24}
.d-pooram .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-pooram .btn.w{color:#8E1B3A}
.d-pooram .foot::before{background:linear-gradient(180deg,rgba(30,10,42,.42),rgba(142,27,58,.9))}
.d-pooram .ft-n span{color:#F4C430}
/* first page: a festival marquee sign */
.d-pooram #intro{background:radial-gradient(ellipse at 50% 0%,#4A1648,#1E0A2A 62%,#12061A);flex-direction:column}
.prs{position:absolute;left:0;right:0;top:0;z-index:2;display:flex;justify-content:center;gap:clamp(2px,1.2vw,10px);pointer-events:none}
.prs i{display:block;width:clamp(40px,11vw,62px);margin-top:-8px;animation:prsin .9s cubic-bezier(.3,1.4,.5,1) both,pbob 2.4s ease-in-out infinite alternate;animation-delay:calc(.2s + var(--q) * .09s),calc(1.2s + var(--q) * .3s)}
.prs i svg{width:100%;height:auto;display:block}
.prs i:nth-child(7n+1) .cp{fill:#E63946}.prs i:nth-child(7n+2) .cp{fill:#2A9D8F}.prs i:nth-child(7n+3) .cp{fill:#F77F00}.prs i:nth-child(7n+4) .cp{fill:#9B2CB5}.prs i:nth-child(7n+5) .cp{fill:#1D6FD6}.prs i:nth-child(7n+6) .cp{fill:#2DB84F}.prs i:nth-child(7n) .cp{fill:#E6007E}
@keyframes prsin{from{transform:translate3d(0,-110%,0)}}
@keyframes pbob{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,8px,0)}}
.mq{position:relative;z-index:3;margin:auto;width:min(92vw,500px);display:flex;flex-direction:column;align-items:center;gap:14px;padding:clamp(100px,26vw,130px) 0 24px;color:#FFF3D1;text-align:center}
.mq-sign{position:relative;width:100%;padding:38px 18px;border-radius:14px;background:radial-gradient(ellipse at 50% 40%,#C2182F,#7A0C1E 80%);border:4px solid #F4C430;box-shadow:0 0 0 6px #2B0B1A,0 0 0 8px #F4C430,0 24px 40px -14px #000;animation:power 1.4s steps(1) .3s both}
@keyframes power{0%{opacity:0}10%{opacity:1}16%{opacity:.25}24%{opacity:1}30%{opacity:.5}36%,100%{opacity:1}}
.mq-bulbs{position:absolute;left:14px;right:14px;display:flex;justify-content:space-between;pointer-events:none}
.mq-bulbs.t{top:10px}.mq-bulbs.b{bottom:10px}
.mq-bulbs i{width:11px;height:11px;border-radius:50%;background:radial-gradient(circle,#FFFBEA,#FFD86B 60%);box-shadow:0 0 8px 2px rgba(255,214,120,.85);animation:bulb 1s steps(1) infinite}
.mq-bulbs i:nth-child(2n){animation-delay:-.5s}
@keyframes bulb{50%{opacity:.25}}
.mq-k{margin:0;font:600 11px var(--fb);letter-spacing:.34em;text-transform:uppercase;color:#F4C430}
.mq-n{margin:6px 0 0;font:400 clamp(30px,9.6vw,52px)/1.08 var(--fs);color:#FFF3D1;text-shadow:0 0 18px rgba(255,214,120,.65);overflow-wrap:anywhere}
.mq-a{margin:2px 0 -2px;font:400 clamp(20px,5vw,28px) var(--fs);color:#F4C430}
.mq-star{display:flex;align-items:center;justify-content:center;gap:12px}
.mq-star>span:not(.mq-i){font:600 11px var(--fb);letter-spacing:.3em;text-transform:uppercase;color:#F4C430}
.mq-i{display:grid;place-items:center;width:clamp(64px,18vw,84px);aspect-ratio:.8;overflow:hidden;border:3px solid #F4C430;border-radius:4px;background:linear-gradient(140deg,#E63946,#F4C430)}
.mq-i img{width:100%;height:100%;object-fit:cover}.mq-i b{font:400 30px var(--fs);color:#fff}
.mq-board{width:100%;padding:12px 14px;border:6px solid #4A2E1A;border-radius:4px;background:repeating-linear-gradient(180deg,#151515 0 22px,#0B0B0B 22px 24px)}
.mq-board p{margin:0;font:400 clamp(12px,3.4vw,15px)/1.9 var(--fs);letter-spacing:.06em;color:#F5F5F5;text-transform:uppercase;overflow-wrap:anywhere}
.d-pooram .open-btn{width:min(100%,280px);border-radius:6px;background:#F4C430;color:#2B0B1A;font:400 14px var(--fs);letter-spacing:.12em;box-shadow:0 0 22px rgba(244,196,48,.55)}
.d-pooram .open-btn::after{border-radius:8px;border-color:#F4C430}
/* opening: all lights blaze and the sign rises away */
.d-pooram.opening #intro .mq-bulbs i{animation:none;opacity:1}
.d-pooram.opening #intro .mq{transition:transform 1.1s cubic-bezier(.5,0,.75,0) .25s,opacity .5s .7s;transform:translate3d(0,-70vh,0) scale(.7);opacity:0}
.d-pooram.opening #intro .prs i{animation:none;transition:transform 1s cubic-bezier(.5,0,.75,0);transition-delay:calc(var(--q) * .06s);transform:translate3d(0,-140%,0)}
.d-pooram.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero: bulb frame */
.mq-bulbs.hb{z-index:2;left:16px;right:16px}
.mq-bulbs.hb.t{top:66px}.mq-bulbs.hb.b{bottom:14px}
.d-pooram .wgm{color:#F4C430;font-weight:600;letter-spacing:.34em}
.d-pooram .hero .nm{text-shadow:0 0 22px rgba(255,214,120,.7),0 4px 18px rgba(0,0,0,.5);font-size:calc(var(--nk,1) * clamp(36px,9.6vw,76px))}
.d-pooram .cd{gap:clamp(6px,2vw,12px)}
.d-pooram .cdu{border-radius:4px;aspect-ratio:.86;background:repeating-linear-gradient(180deg,#151515 0 22px,#0B0B0B 22px 24px);border:4px solid #4A2E1A;box-shadow:0 10px 20px -10px #000}
.d-pooram .cdu svg{display:none}
.d-pooram .cdu b{font:400 clamp(24px,6.6vw,38px)/1 var(--fs);color:#fff}
.d-pooram .cdu span{color:#F4C430}
.d-pooram .fli{color:#E63946}.d-pooram .cfx i:nth-child(2n) .fli{color:#F77F00}.d-pooram .cfx i:nth-child(3n) .fli{color:#E6007E}
/* sections */
.d-pooram .k{color:#B0213A;font-weight:600}
.d-pooram .h2.scr{font-size:clamp(30px,8vw,52px);color:#8E1B3A}
.d-pooram .when .h2{color:#FFF3D1}
.d-pooram .pc h3{font:400 clamp(22px,6vw,30px) var(--fs);color:#8E1B3A}
.d-pooram .strip b{font:400 clamp(16px,4vw,20px) var(--fs);color:#F4C430}
.d-pooram .ev{background:rgba(255,255,255,.12);border:2px solid #F4C430}
.d-pooram .evb h3{font:400 clamp(20px,5.4vw,26px) var(--fs);color:#F4C430}
.d-pooram .evdate{background:#F4C430;color:#2B0B1A}
.d-pooram .ty{font-size:clamp(40px,11vw,70px)}

/* ---------------------------------------------------------------- STAINED */
.d-stained{--fs:"Cinzel Decorative",Georgia,serif;--fb:"Cormorant Garamond",Georgia,serif;--fd:"Cinzel",Georgia,serif}
.d-stained .hero{background:#140E22}
.d-stained .ss{z-index:0}.d-stained .hveil{z-index:1;background:linear-gradient(180deg,rgba(20,14,34,.5) 0,rgba(20,14,34,.05) 22%,rgba(20,14,34,.3) 36%,rgba(20,14,34,.84) 52%,rgba(20,14,34,.96) 100%)}
.d-stained .hero-in{z-index:3}
.d-stained .hero .nm{color:#FFF8EA}.d-stained .nm .amp{color:#E3A72F}
.d-stained .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-stained .cdu .rp{stroke:#E3A72F}.d-stained .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-stained .pfo{transform:none;border:2px solid var(--gold);border-radius:2px}.d-stained .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:6px}
.d-stained .pc:hover .pfo{transform:none}.d-stained .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-stained .pfi{border-radius:0px}
.d-stained .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-stained .h2.scr,.d-stained .ty{font-family:var(--fs)}
.d-stained .cillu{color:var(--acc)}
.d-stained .strip{background:linear-gradient(90deg,#2D2250,#7B3FA0,#2D2250);color:#fff}.d-stained .strip i{fill:#E3A72F}
.d-stained .when{background:linear-gradient(180deg,#2D2250,#171030)}.d-stained .wave{fill:#2D2250}.d-stained .wave.b{fill:#171030}
.d-stained .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-stained .btn.w{color:#2D2250}
.d-stained .foot::before{background:linear-gradient(180deg,rgba(20,14,34,.42),rgba(45,34,80,.9))}
.d-stained .ft-n span{color:#E3A72F}
/* first page: a stained-glass triptych that swings open */
.d-stained #intro{background:radial-gradient(ellipse at 50% 26%,#2E2148,#140E22 64%)}
.srays{position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-conic-gradient(from 0deg at 50% 18%,rgba(255,228,170,.09) 0 5deg,transparent 5deg 16deg);-webkit-mask:radial-gradient(circle at 50% 18%,#000 10%,transparent 70%);mask:radial-gradient(circle at 50% 18%,#000 10%,transparent 70%);animation:rayp 4s ease-in-out infinite alternate}
@keyframes rayp{from{opacity:.45}to{opacity:1}}
.tp{position:relative;z-index:3;margin:auto;width:min(96vw,620px);display:flex;flex-direction:column;align-items:center;gap:16px;padding:22px 0;color:#F6EAD0;text-align:center}
.tp-rose{display:block;width:clamp(74px,20vw,104px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#FFF3C4 0 12%,transparent 13%),repeating-conic-gradient(#C0392B 0 22deg,#E3A72F 22deg 24deg,#1F4E9E 24deg 43deg,#E3A72F 43deg 45deg);box-shadow:0 0 0 4px #2B2236,0 0 0 6px #E3A72F,0 0 40px 6px rgba(227,167,47,.35);animation:spin 40s linear infinite}
.tp-row{display:flex;align-items:stretch;justify-content:center;width:100%;-webkit-perspective:1300px;perspective:1300px}
.tp-c{position:relative;z-index:1;flex:0 0 50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:30px 10px 22px;border:2px solid #E3A72F;border-radius:400px 400px 8px 8px/150px 150px 8px 8px;background:linear-gradient(180deg,#2C2244,#19132C);box-shadow:inset 0 0 0 5px #19132C,inset 0 0 0 6px rgba(227,167,47,.4)}
.tp-k{margin:0;font:500 italic clamp(12px,3.2vw,14px)/1.3 var(--fb);color:#D8C9A8}
.tp-n{display:flex;flex-direction:column;margin:6px 0;font:700 clamp(17px,5.2vw,30px)/1.15 var(--fs);color:#FFF4D8;overflow-wrap:anywhere;max-width:100%}
.tp-n i{font:500 italic .8em var(--fb);color:#E3A72F}
.tp-e{margin:4px 0 0;font:600 10.5px var(--fd);letter-spacing:.2em;text-transform:uppercase;color:#E3A72F}
.tp-d{margin:2px 0 0;font:600 clamp(14px,3.8vw,17px)/1.3 var(--fb)}
.tp-t,.tp-v{margin:0;font:500 clamp(13px,3.4vw,15px)/1.35 var(--fb);color:#D8C9A8}
.tp-w{position:relative;flex:0 0 25%;transform-style:preserve-3d;will-change:transform}
.tp-w.l{transform-origin:100% 50%;animation:tpl 1.5s cubic-bezier(.5,0,.2,1) .7s both}
.tp-w.r{transform-origin:0 50%;animation:tpr 1.5s cubic-bezier(.5,0,.2,1) .7s both}
@keyframes tpl{from{transform:rotateY(179deg)}to{transform:rotateY(0)}}
@keyframes tpr{from{transform:rotateY(-179deg)}to{transform:rotateY(0)}}
.tp-in,.tp-out{border:2px solid #E3A72F;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.tp-in{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;padding:12px 6px;background:linear-gradient(180deg,#241B3A,#140E22)}
.tp-w.l .tp-in{border-radius:200px 0 0 8px/90px 0 0 8px;border-right:0}
.tp-w.r .tp-in{border-radius:0 200px 8px 0/0 90px 8px 0;border-left:0}
.tp-out{position:absolute;inset:0;transform:rotateY(180deg);background:linear-gradient(135deg,rgba(192,57,43,.95) 0 25%,rgba(31,78,158,.95) 25% 50%,rgba(30,132,73,.95) 50% 75%,rgba(214,137,16,.95) 75%) 0 0/50% 34%}
.tp-w.l .tp-out{border-radius:0 200px 8px 0/0 90px 8px 0}
.tp-w.r .tp-out{border-radius:200px 0 0 8px/90px 0 0 8px}
.tp-i{display:grid;place-items:center;width:100%;aspect-ratio:.72;overflow:hidden;border:2px solid #E3A72F;background:linear-gradient(140deg,#7B3FA0,#E3A72F)}
.tp-i img{width:100%;height:100%;object-fit:cover}.tp-i b{font:700 34px var(--fs);color:#fff}
.tp-in p{margin:0;font:700 clamp(12px,3.4vw,16px)/1.2 var(--fs);color:#FFF4D8;overflow-wrap:anywhere;max-width:100%}
.d-stained .open-btn{width:min(70vw,240px);border:1px solid #E3A72F;border-radius:2px;background:transparent;color:#E3A72F;font:600 13px var(--fd);letter-spacing:.3em;box-shadow:0 0 30px -6px rgba(227,167,47,.5)}
.d-stained .open-btn::after{border-radius:4px;border-color:#E3A72F}
/* opening: the wings close and the window fills with light */
.d-stained.opening #intro .tp-w.l{animation:none;transition:transform .9s cubic-bezier(.6,0,.3,1);transform:rotateY(179deg)}
.d-stained.opening #intro .tp-w.r{animation:none;transition:transform .9s cubic-bezier(.6,0,.3,1);transform:rotateY(-179deg)}
.d-stained.opening #intro .tp{transition:transform 1s cubic-bezier(.6,0,.3,1) .75s,opacity .5s 1.1s;transform:scale(1.5);opacity:0}
.d-stained.opening #intro{transition:opacity .8s ease 1.1s;opacity:0}
/* hero: the slideshow in a jewelled window frame */
.d-stained .hero::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 50% 20%,#2E2148,#140E22 70%)}
.glw{position:absolute;z-index:1;width:70vmin;height:70vmin;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(123,63,160,.38),transparent 64%);animation:gdrift 13s ease-in-out infinite alternate}
.glw.g1{left:-20vmin;top:4%}.glw.g2{right:-24vmin;top:30%;background:radial-gradient(circle,rgba(227,167,47,.3),transparent 64%);animation-delay:-4s}.glw.g3{left:20%;bottom:-30vmin;background:radial-gradient(circle,rgba(58,123,213,.3),transparent 64%);animation-delay:-8s}
@keyframes gdrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(8vw,6vh,0)}}
.d-stained .ss{left:50%;right:auto;top:110px;bottom:auto;z-index:2;width:var(--fw);aspect-ratio:.8;margin-left:calc(var(--fw) / -2);overflow:hidden;border:6px solid transparent;background:linear-gradient(#140E22,#140E22) padding-box,linear-gradient(135deg,#C0392B,#E3A72F,#1F4E9E,#1E8449,#7B3FA0) border-box;box-shadow:0 0 0 2px #E3A72F,0 30px 60px -20px rgba(0,0,0,.9)}
.d-stained .hveil{display:none}
.tp-arch{position:absolute;left:50%;top:40px;z-index:2;width:var(--fw);height:90px;margin-left:calc(var(--fw) / -2);border:2px solid #E3A72F;border-bottom:0;border-radius:50% 50% 0 0/100% 100% 0 0;pointer-events:none}
.tp-arch::after{content:"";position:absolute;left:50%;top:14px;width:46px;height:46px;margin-left:-23px;border-radius:50%;background:repeating-conic-gradient(#C0392B 0 22deg,#E3A72F 22deg 24deg,#1F4E9E 24deg 43deg,#E3A72F 43deg 45deg);box-shadow:0 0 0 2px #E3A72F}
.d-stained .hero-in{padding:calc(var(--fw) / .8 + 140px) 0 110px}
.d-stained .wgm{font:500 italic clamp(14px,3.6vw,17px) var(--fb);letter-spacing:.04em;text-transform:none;color:#D8C9A8}
.d-stained .hero .nm{font-weight:700;font-size:calc(var(--nk,1) * clamp(30px,8vw,62px))}
.d-stained .cdu{clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);border-radius:0;aspect-ratio:1.12;background:linear-gradient(135deg,#7B3FA0,#3A7BD5)}
.d-stained .cdu:nth-child(2){background:linear-gradient(135deg,#C0392B,#E3A72F)}.d-stained .cdu:nth-child(3){background:linear-gradient(135deg,#1E8449,#3A7BD5)}.d-stained .cdu:nth-child(4){background:linear-gradient(135deg,#D68910,#C0392B)}
.d-stained .cdu svg{display:none}
.d-stained .fli{inset:auto;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#FFE7A8;box-shadow:0 0 8px 3px rgba(255,214,120,.7)}
.d-stained.cfall .cfx i:nth-child(n){animation-name:mote;top:auto;bottom:-20px}
.d-stained.cfall .cfx i .fli{animation:none}
@keyframes mote{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:1}100%{transform:translate3d(20px,-110vh,0);opacity:0}}
/* sections */
.d-stained .k{color:#7B3FA0;font-weight:600}
.d-stained .h2.scr{font-weight:700;font-size:clamp(30px,8vw,54px)}
.d-stained .pfo{border:4px solid transparent;background:linear-gradient(135deg,#C0392B,#E3A72F,#1F4E9E,#1E8449) border-box;-webkit-mask:linear-gradient(#000,#000) padding-box exclude,linear-gradient(#000,#000);mask:linear-gradient(#000,#000) padding-box exclude,linear-gradient(#000,#000);border-radius:2px}
.d-stained .pfo::after{display:none}
.d-stained .pc h3{font:700 clamp(22px,6vw,30px) var(--fs)}
.d-stained .strip b{font:700 clamp(15px,4vw,19px) var(--fs)}
.d-stained .ev{background:rgba(255,255,255,.1);border:1px solid rgba(227,167,47,.6);border-radius:2px}
.d-stained .evb h3{font:700 clamp(20px,5.4vw,26px) var(--fs);color:#E3A72F}
.d-stained .evdate{background:#7B3FA0}
.d-stained .ty{font-size:clamp(38px,10vw,64px)}

.d-stained .hero{--fw:min(80vw,420px,44vh)}

/* ---------------------------------------------------------------- AUTUMN */
.d-autumn{--fs:"Fraunces",Georgia,serif;--fb:"Lato",system-ui,sans-serif;--fd:"Fraunces",Georgia,serif}
.d-autumn .hero{background:#26120A}
.d-autumn .ss{z-index:0}.d-autumn .hveil{z-index:1;background:linear-gradient(180deg,rgba(38,18,10,.5) 0,rgba(38,18,10,.05) 22%,rgba(38,18,10,.3) 36%,rgba(38,18,10,.84) 52%,rgba(38,18,10,.96) 100%)}
.d-autumn .hero-in{z-index:3}
.d-autumn .hero .nm{color:#FFF6EA}.d-autumn .nm .amp{color:#E9A23B}
.d-autumn .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-autumn .cdu .rp{stroke:#E9A23B}.d-autumn .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-autumn .pfo{transform:none;border:2px solid var(--gold);border-radius:6px}.d-autumn .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:10px}
.d-autumn .pc:hover .pfo{transform:none}.d-autumn .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-autumn .pfi{border-radius:4px}
.d-autumn .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-autumn .h2.scr,.d-autumn .ty{font-family:var(--fs)}
.d-autumn .cillu{color:var(--acc)}
.d-autumn .strip{background:linear-gradient(90deg,#8C3B1F,#C8553D,#8C3B1F);color:#fff}.d-autumn .strip i{fill:#E9A23B}
.d-autumn .when{background:linear-gradient(180deg,#8C3B1F,#5A2410)}.d-autumn .wave{fill:#8C3B1F}.d-autumn .wave.b{fill:#5A2410}
.d-autumn .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-autumn .btn.w{color:#8C3B1F}
.d-autumn .foot::before{background:linear-gradient(180deg,rgba(38,18,10,.42),rgba(140,59,31,.9))}
.d-autumn .ft-n span{color:#E9A23B}
/* first page: a wall calendar */
.d-autumn #intro{background:radial-gradient(ellipse at 40% 20%,#FFE6C2,#F2BE85 55%,#D98C4E);color:#3A1E10}
.lvs{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.d-autumn .fli{color:#C8553D}.d-autumn .lf3:nth-child(2n) .fli,.d-autumn .cfx i:nth-child(2n) .fli{color:#E9A23B}.d-autumn .lf3:nth-child(3n) .fli,.d-autumn .cfx i:nth-child(3n) .fli{color:#8C3B1F}
.cal{position:relative;z-index:3;margin:auto;width:min(90vw,400px);display:flex;flex-direction:column;align-items:center;gap:16px;padding:26px 0 24px}
.cl-nail{position:relative;width:12px;height:12px;border-radius:50%;background:#3A1E10;box-shadow:0 2px 3px rgba(0,0,0,.4);margin-bottom:-6px}
.cl-nail::before,.cl-nail::after{content:"";position:absolute;top:8px;width:1.5px;height:38px;background:#5A3A22;transform-origin:50% 0}
.cl-nail::before{left:5px;transform:rotate(40deg)}.cl-nail::after{left:5px;transform:rotate(-40deg)}
.cl-page{position:relative;width:100%;margin-top:22px;padding-top:26px;border-radius:8px;background:#FFFBF5;box-shadow:0 22px 40px -18px rgba(90,40,10,.65);transform-origin:50% 0;animation:clsw 2.6s cubic-bezier(.3,.6,.4,1) .2s both;-webkit-perspective:1200px;perspective:1200px}
@keyframes clsw{0%{transform:rotate(7deg);opacity:0}10%{opacity:1}30%{transform:rotate(-4deg)}50%{transform:rotate(2deg)}70%{transform:rotate(-1deg)}100%{transform:rotate(0)}}
.cl-page::before{content:"";position:absolute;left:0;right:0;top:0;height:26px;border-radius:8px 8px 0 0;background:radial-gradient(circle at 50% 50%,#FFFBF5 4px,transparent 4.5px) 10px 0/32px 26px repeat-x,#7A3218}
.cl-ph{position:relative;display:grid;grid-template-columns:1fr 1fr;height:clamp(130px,36vw,170px)}
.cl-i{display:grid;place-items:center;overflow:hidden;background:linear-gradient(140deg,#E9A23B,#C8553D)}
.cl-i img{width:100%;height:100%;object-fit:cover}.cl-i b{font:700 46px var(--fs);color:#fff}
.cl-ph p{position:absolute;left:0;right:0;bottom:0;margin:0;padding:22px 10px 8px;background:linear-gradient(180deg,transparent,rgba(58,30,16,.8));font:400 italic clamp(20px,5.6vw,26px)/1.15 var(--fs);color:#fff;text-align:center;overflow-wrap:anywhere}
.cl-ph p i{color:#E9A23B}
.cl-m{margin:12px 0 4px;text-align:center;font:700 clamp(24px,7vw,32px)/1 var(--fs);color:#8C3B1F;letter-spacing:.02em}
.cl-m span{font-weight:400;color:#C8553D}
.cl-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;padding:6px 12px 4px;text-align:center}
.cl-g .wd{font:700 10px var(--fb);letter-spacing:.08em;text-transform:uppercase;color:#C8553D;padding:4px 0}
.cl-g i{display:block;padding:6px 0;font:400 clamp(12px,3.4vw,14px)/1 var(--fb);font-style:normal;color:#6B5040}
.cl-g .wday{position:relative;font-weight:700;color:#fff}
.cl-g .wday span{position:relative;z-index:1}
.cl-g .wday::before{content:"";position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:#C8553D;transform:scale(0);animation:wdot .5s cubic-bezier(.3,1.6,.5,1) 2.2s forwards}
@keyframes wdot{to{transform:scale(1)}}
.cl-g .wday svg{position:absolute;left:50%;top:50%;width:44px;height:42px;margin:-22px 0 0 -22px;overflow:visible;fill:none;stroke:#8C3B1F;stroke-width:2;z-index:2}
.cl-g .wday svg path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1s ease 2.5s forwards}
.cl-note{margin:2px 0 0;padding:8px 14px 14px;text-align:center;font:400 italic clamp(19px,5.4vw,23px)/1.3 var(--fs);color:#8C3B1F}
.cl-note span{display:block;font:500 normal 13px/1.4 var(--fb);color:#6B5040}
.cl-flips{position:absolute;inset:0;z-index:4;pointer-events:none}
.cl-flips i{position:absolute;inset:0;border-radius:8px;background:#FFFBF5;transform-origin:50% 0;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:flipaway .55s cubic-bezier(.5,0,.75,0) forwards}
.cl-flips i::before{content:"";position:absolute;left:0;right:0;top:0;height:26px;border-radius:8px 8px 0 0;background:radial-gradient(circle at 50% 50%,#FFFBF5 4px,transparent 4.5px) 10px 0/32px 26px repeat-x,#7A3218}
.cl-flips i:nth-child(1){animation-delay:1.55s;background:#FFF3E2}.cl-flips i:nth-child(2){animation-delay:1.25s;background:#FFF7EC}.cl-flips i:nth-child(3){animation-delay:.95s}
@keyframes flipaway{to{transform:rotateX(-100deg);opacity:0}}
.d-autumn .open-btn{width:min(80vw,260px);border-radius:999px;background:linear-gradient(120deg,#8C3B1F,#C8553D 50%,#E9A23B);color:#fff;font:700 13px var(--fb);letter-spacing:.16em}
.d-autumn .open-btn::after{border-radius:999px;border-color:#C8553D}
/* opening: the page tears off and falls */
.d-autumn.opening #intro .cl-page{animation:none;transform-origin:0 0;transition:transform 1.2s cubic-bezier(.5,0,.75,0),opacity .5s .7s;transform:translate3d(-10vw,110vh,0) rotate(-28deg);opacity:0}
.d-autumn.opening #intro .open-btn,.d-autumn.opening #intro .cl-nail{transition:opacity .4s;opacity:0}
.d-autumn.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero: tear-off calendar countdown */
.d-autumn .wgm{color:#E9A23B;font-weight:700}
.d-autumn .hero .nm{font-style:italic}
.d-autumn .cd{gap:clamp(8px,2.6vw,16px)}
.d-autumn .cdu{border-radius:6px;aspect-ratio:.82;padding-top:12px;background:#FFFBF5;color:#3A1E10;overflow:hidden;box-shadow:0 12px 20px -10px rgba(0,0,0,.7)}
.d-autumn .cdu::before{content:"";position:absolute;left:0;right:0;top:0;height:13px;background:radial-gradient(circle,#FFFBF5 2.4px,transparent 3px) 4px 0/14px 13px repeat-x,#8C3B1F}
.d-autumn .cdu svg{display:none}
.d-autumn .cdu b{font:700 clamp(26px,7vw,40px)/1 var(--fs);color:#8C3B1F}
.d-autumn .cdu span{color:#C8553D}
/* sections */
.d-autumn .k{color:#A8431F;font-weight:700}
.d-autumn .h2.scr{font-style:italic}
.d-autumn .pc h3{font-style:italic}
.d-autumn .ev{background:#FFFBF5;color:#3A1E10;border-radius:8px}
.d-autumn .ev .evi{color:#8C3B1F}.d-autumn .evdate{background:#C8553D}
.d-autumn .evb h3{font-style:italic;color:#8C3B1F}
.d-autumn .ev .btn.wg{color:#8C3B1F;border-color:#8C3B1F}.d-autumn .btn{background:#8C3B1F;border-color:#8C3B1F}.d-autumn .btn.ghost{background:transparent;color:#8C3B1F}.d-autumn .btn.w{background:#C8553D;border-color:#C8553D;color:#fff}.d-autumn .btn.wa{background:#25D366;border-color:#25D366}

/* ---------------------------------------------------------------- SEASIDE */
.d-seaside{--fs:"Courgette",cursive;--fb:"Figtree",system-ui,sans-serif;--fd:"Special Elite",ui-monospace,monospace}
.d-seaside .hero{background:#0A2A3F}
.d-seaside .ss{z-index:0}.d-seaside .hveil{z-index:1;background:linear-gradient(180deg,rgba(10,42,63,.5) 0,rgba(10,42,63,.05) 22%,rgba(10,42,63,.3) 36%,rgba(10,42,63,.84) 52%,rgba(10,42,63,.96) 100%)}
.d-seaside .hero-in{z-index:3}
.d-seaside .hero .nm{color:#3A2A18}.d-seaside .nm .amp{color:#F2D6B3}
.d-seaside .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-seaside .cdu .rp{stroke:#F2D6B3}.d-seaside .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-seaside .pfo{transform:none;border:2px solid var(--gold);border-radius:6px}.d-seaside .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:10px}
.d-seaside .pc:hover .pfo{transform:none}.d-seaside .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-seaside .pfi{border-radius:4px}
.d-seaside .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-seaside .h2.scr,.d-seaside .ty{font-family:var(--fs)}
.d-seaside .cillu{color:var(--acc)}
.d-seaside .strip{background:linear-gradient(90deg,#1A5E85,#1F7FB8,#1A5E85);color:#fff}.d-seaside .strip i{fill:#F2D6B3}
.d-seaside .when{background:linear-gradient(180deg,#1A5E85,#0F3D58)}.d-seaside .wave{fill:#1A5E85}.d-seaside .wave.b{fill:#0F3D58}
.d-seaside .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-seaside .btn.w{color:#1A5E85}
.d-seaside .foot::before{background:linear-gradient(180deg,rgba(10,42,63,.42),rgba(26,94,133,.9))}
.d-seaside .ft-n span{color:#F2D6B3}
/* first page: a message in a bottle on the beach */
.d-seaside #intro{background:linear-gradient(180deg,#BFE6F7 0%,#E6F6FC 30%,#5FC3E4 40%,#1F7FB8 52%,#F2D6B3 62%,#EBC9A0 100%);color:#3A2A18;flex-direction:column}
.sea{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.sunr{position:absolute;left:50%;top:18%;width:min(30vw,140px);aspect-ratio:1;margin-left:calc(min(30vw,140px) / -2);border-radius:50%;background:radial-gradient(circle,#FFFDF0,#FFF0C2 50%,rgba(255,240,194,0) 72%)}
.wv{position:absolute;left:0;width:200%;height:60px;animation:wmove 12s linear infinite}
.wv svg{width:100%;height:100%;display:block}
.wv.w1{top:36%;fill:rgba(255,255,255,.55)}
.wv.w2{top:50%;height:70px;fill:rgba(255,255,255,.85);animation-duration:8s;animation-direction:reverse}
@keyframes wmove{to{transform:translate3d(-50%,0,0)}}
.sand{position:absolute;left:0;right:0;bottom:0;height:42%;background:radial-gradient(circle,rgba(201,160,110,.35) 1px,transparent 1.5px) 0 0/12px 12px}
.mb{position:relative;z-index:3;margin:auto;width:min(90vw,420px);display:flex;flex-direction:column;align-items:center;padding:18px 0 22px}
.mb-bot{display:block;width:clamp(58px,16vw,78px);margin-bottom:-26px;z-index:2;transform-origin:50% 80%;animation:bwash 1.4s cubic-bezier(.2,.8,.2,1) both,mbbob 3s ease-in-out 1.4s infinite alternate}
.mb-bot svg{width:100%;height:auto;display:block}
@keyframes bwash{from{transform:translate3d(-50vw,-20vh,0) rotate(-80deg);opacity:0}}
@keyframes mbbob{from{transform:rotate(-8deg)}to{transform:rotate(6deg) translate3d(0,-4px,0)}}
.mb-scroll{position:relative;width:100%}
.mb-roll{display:block;position:relative;z-index:1;height:22px;margin:0 -10px;border-radius:12px;background:linear-gradient(180deg,#C9A46E,#F2E2BE 35%,#E6CC98 60%,#B98E58);box-shadow:0 4px 8px -3px rgba(90,60,20,.5)}
.mb-roll.b{opacity:0;animation:fadein .5s 1.7s forwards}
.mb-paper{position:relative;margin:-6px 0;padding:24px 22px 26px;background:linear-gradient(90deg,rgba(185,142,88,.18),transparent 8%,transparent 92%,rgba(185,142,88,.18)),#FBF1DC;text-align:center;transform-origin:50% 0;animation:unroll 1.2s cubic-bezier(.3,.8,.3,1) .7s both}
@keyframes unroll{from{transform:scaleY(.02)}}
.mb-k{margin:0;font:400 12px var(--fd);letter-spacing:.24em;text-transform:uppercase;color:#1A5E85}
.mb-ph{display:flex;justify-content:center;gap:12px;margin:14px 0 6px}
.mb-i{display:grid;place-items:center;width:clamp(70px,20vw,92px);aspect-ratio:.8;overflow:hidden;border:4px solid #fff;background:linear-gradient(140deg,#5FC3E4,#F2D6B3);box-shadow:0 8px 14px -8px rgba(0,0,0,.5)}
.mb-i:first-child{transform:rotate(-4deg)}.mb-i:last-child{transform:rotate(4deg)}
.mb-i img{width:100%;height:100%;object-fit:cover}.mb-i b{font:400 34px var(--fs);color:#fff}
.mb-n{margin:6px 0 0;font:400 clamp(30px,8.6vw,42px)/1.12 var(--fs);color:#123247;overflow-wrap:anywhere}
.mb-n i{font-style:normal;color:#1F7FB8}
.mb-t{margin:6px 0 0;font:400 clamp(13px,3.6vw,15px)/1.55 var(--fd);color:#4A3A28}
.mb-d{margin:10px 0 0;font:600 clamp(14px,3.8vw,16px)/1.4 var(--fb);color:#123247}
.mb-v{margin:2px 0 0;font:500 14px/1.4 var(--fb);color:#5E7686}
.d-seaside .open-btn{margin-top:20px;width:min(80vw,260px);border-radius:999px;background:linear-gradient(120deg,#1A5E85,#1F7FB8 55%,#5FC3E4);color:#fff;font:600 13px var(--fb);letter-spacing:.16em;position:relative;z-index:3}
.d-seaside .open-btn::after{border-radius:999px;border-color:#1F7FB8}
/* opening: the scroll rolls up and the bottle drifts out to sea */
.d-seaside.opening #intro .mb-paper{animation:none;transition:transform .8s cubic-bezier(.6,0,.4,1);transform:scaleY(.02)}
.d-seaside.opening #intro .mb-roll.b{animation:none;transition:transform .8s cubic-bezier(.6,0,.4,1),opacity .3s .6s;transform:translate3d(0,-200px,0);opacity:0}
.d-seaside.opening #intro .mb-bot{animation:none;transition:transform 1.2s cubic-bezier(.5,0,.75,0) .5s;transform:translate3d(60vw,-30vh,0) rotate(70deg)}
.d-seaside.opening #intro .open-btn{transition:opacity .3s;opacity:0}
.d-seaside.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero: parchment banner for the names */
.mb-band{position:relative;margin:0 0 22px;padding:18px clamp(16px,5vw,34px) 16px;background:#FBF1DC;border-radius:4px;box-shadow:0 18px 30px -18px rgba(0,0,0,.6);opacity:0;transform:translate3d(0,20px,0);transition:opacity 1s .3s,transform 1s .3s}
.mb-band::before,.mb-band::after{content:"";position:absolute;top:-6px;bottom:-6px;width:16px;border-radius:8px;background:linear-gradient(90deg,#B98E58,#F2E2BE 50%,#B98E58)}
.mb-band::before{left:-10px}.mb-band::after{right:-10px}
.is-open .mb-band{opacity:1;transform:none}
.d-seaside .wgm{color:#1A5E85;font-family:var(--fd)}
.d-seaside .hero .nm{text-shadow:none;margin-bottom:4px}
.d-seaside .nm .amp{color:#1F7FB8}
.d-seaside .quote{color:#5E4A30;text-shadow:none;font-family:var(--fd)}
.d-seaside .cdu{background:radial-gradient(circle at 35% 30%,#FBF1DC,#E9D2A8);color:#123247;border:2px solid #fff}
.d-seaside .cdu .rt{stroke:rgba(18,50,71,.12)}.d-seaside .cdu .rp{stroke:#1F7FB8}
.d-seaside .cd-note{color:#fff}
.d-seaside .fli{inset:auto;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;border:1.5px solid rgba(255,255,255,.85);background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.9) 15%,transparent 50%)}
.d-seaside.cfall .cfx i:nth-child(n){animation-name:bubu;top:auto;bottom:-20px}
.d-seaside.cfall .cfx i .fli{animation:none}
@keyframes bubu{0%{transform:translate3d(0,0,0)}25%{transform:translate3d(10px,-28vh,0)}50%{transform:translate3d(-8px,-56vh,0)}75%{transform:translate3d(9px,-84vh,0)}100%{transform:translate3d(0,-112vh,0)}}
/* sections */
.d-seaside .k{color:#1A5E85;font-family:var(--fd)}
.d-seaside .couple::before{background:linear-gradient(180deg,var(--paper),#F7EEDD)}
.d-seaside .pfo{border-color:#F2D6B3}
.d-seaside .strip b{font-family:var(--fs)}
.d-seaside .ev{background:#FBF1DC;color:#3A2A18;border-radius:6px}
.d-seaside .ev .evi{color:#1A5E85}.d-seaside .evdate{background:#1F7FB8}
.d-seaside .evb h3{color:#1A5E85}
.d-seaside .ev .btn.wg{color:#1A5E85;border-color:#1A5E85}.d-seaside .btn{background:#1A5E85;border-color:#1A5E85}.d-seaside .btn.ghost{background:transparent;color:#1A5E85}.d-seaside .btn.w{background:#1F7FB8;border-color:#1F7FB8;color:#fff}.d-seaside .btn.wa{background:#25D366;border-color:#25D366}

/* ---------------------------------------------------------------- IZNIK */
.d-iznik{--fs:"Marcellus",Georgia,serif;--fb:"Raleway",system-ui,sans-serif;--fd:"El Messiri",Georgia,serif}
.d-iznik .hero{background:#0B1F4A}
.d-iznik .ss{z-index:0}.d-iznik .hveil{z-index:1;background:linear-gradient(180deg,rgba(11,31,74,.5) 0,rgba(11,31,74,.05) 22%,rgba(11,31,74,.3) 36%,rgba(11,31,74,.84) 52%,rgba(11,31,74,.96) 100%)}
.d-iznik .hero-in{z-index:3}
.d-iznik .hero .nm{color:#13265A}.d-iznik .nm .amp{color:#E8B04A}
.d-iznik .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-iznik .cdu .rp{stroke:#E8B04A}.d-iznik .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-iznik .pfo{transform:none;border:2px solid var(--gold);border-radius:14px}.d-iznik .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:18px}
.d-iznik .pc:hover .pfo{transform:none}.d-iznik .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-iznik .pfi{border-radius:12px}
.d-iznik .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-iznik .h2.scr,.d-iznik .ty{font-family:var(--fs)}
.d-iznik .cillu{color:var(--acc)}
.d-iznik .strip{background:linear-gradient(90deg,#1E4A9A,#36B3C9,#1E4A9A);color:#fff}.d-iznik .strip i{fill:#E8B04A}
.d-iznik .when{background:linear-gradient(180deg,#1E4A9A,#122E66)}.d-iznik .wave{fill:#1E4A9A}.d-iznik .wave.b{fill:#122E66}
.d-iznik .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-iznik .btn.w{color:#1E4A9A}
.d-iznik .foot::before{background:linear-gradient(180deg,rgba(11,31,74,.42),rgba(30,74,154,.9))}
.d-iznik .ft-n span{color:#E8B04A}
/* first page: a bento grid of Iznik tiles */
.d-iznik #intro{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cg fill='none' stroke='%2336B3C9' stroke-opacity='.18' stroke-width='1.4'%3E%3Cpath d='M40 14c-7 8-9 16-5 25h10c4-9 2-17-5-25zM40 39c-6-4-14-4-18 0M40 39c6-4 14-4 18 0M40 39v24M40 52c-9 0-15 6-16 14M40 52c9 0 15 6 16 14'/%3E%3Ccircle r='12'/%3E%3Ccircle cx='80' r='12'/%3E%3Ccircle cy='80' r='12'/%3E%3Ccircle cx='80' cy='80' r='12'/%3E%3C/g%3E%3C/svg%3E") 0 0/80px 80px,radial-gradient(ellipse at 50% 30%,#1E4A9A,#0B1F4A 70%);color:#13265A;-webkit-perspective:1200px;perspective:1200px}
.bt{position:relative;z-index:3;margin:auto;width:min(94vw,540px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:18px 0}
.bt-c{position:relative;min-width:0;padding:14px;border-radius:18px;background:#F7FAFF;overflow:hidden;box-shadow:0 14px 28px -18px rgba(0,0,0,.7);animation:btin .7s cubic-bezier(.3,1.25,.5,1) both;animation-delay:calc(.2s + var(--n,0) * .08s)}
.bt-c:nth-child(1){--n:0}.bt-c:nth-child(2){--n:1}.bt-c:nth-child(3){--n:2}.bt-c:nth-child(4){--n:3}.bt-c:nth-child(5){--n:4}.bt-c:nth-child(6){--n:5}.bt-c:nth-child(7){--n:6}.bt-c:nth-child(8){--n:7}
@keyframes btin{from{transform:perspective(800px) rotateX(-75deg) translate3d(0,20px,0);opacity:0}}
.bt-h{grid-column:span 2;text-align:center;background:#13265A;color:#fff}
.bt-h::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:repeating-linear-gradient(90deg,#36B3C9 0 10px,#E8B04A 10px 14px,#D9433B 14px 18px,#E8B04A 18px 22px)}
.bt-h .bsm{color:#E8B04A}
.bt-h p:last-child{margin:2px 0 6px;font:600 11px var(--fb);letter-spacing:.3em;text-transform:uppercase}
.bt-p{padding:0;aspect-ratio:.8}
.bt-i{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(140deg,#1E5BB8,#36B3C9)}
.bt-i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.bt-i b{font:600 60px var(--fs);color:#fff}
.bt-l{position:absolute;left:10px;bottom:10px;padding:4px 10px;border-radius:999px;background:rgba(247,250,255,.92);font:700 10px var(--fb);letter-spacing:.16em;text-transform:uppercase;color:#13265A}
.bt-n{grid-column:span 2;text-align:center;padding:18px 14px}
.bt-n::before,.bt-n::after{content:"";position:absolute;top:10px;width:34px;height:34px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 4c-5 6-6 11-3 17h6c3-6 2-11-3-17zM20 21c-5-3-10-3-13 0 3 1 7 2 13 0zM20 21c5-3 10-3 13 0-3 1-7 2-13 0z' fill='%231E5BB8'/%3E%3Cpath d='M20 21v15' stroke='%2336B3C9' stroke-width='2'/%3E%3Ccircle cx='20' cy='12' r='2' fill='%23D9433B'/%3E%3C/svg%3E") center/contain no-repeat}
.bt-n::before{left:10px}.bt-n::after{right:10px}
.bt-n p{margin:0;font:400 clamp(30px,8.6vw,44px)/1.1 var(--fs);color:#13265A;overflow-wrap:anywhere}
.bt-n i{display:block;font:500 italic 20px var(--fb);color:#36B3C9}
.bt-d{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#36B3C9;color:#fff;text-align:center}
.bt-d b{font:700 clamp(44px,13vw,62px)/1 var(--fs)}
.bt-d span{font:600 13px var(--fb);letter-spacing:.14em;text-transform:uppercase}
.bt-d small{font:500 12px var(--fb);opacity:.9}
.bt-t{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;background:#E8B04A;color:#13265A}
.bt-t svg{width:30px;height:30px}
.bt-t b{font:700 clamp(13px,3.6vw,16px)/1.3 var(--fb)}
.bt-v{grid-column:span 2;display:flex;align-items:center;gap:12px}
.bt-v svg{flex:none;width:30px;height:30px;color:#D9433B}
.bt-v p{margin:0;font:500 13px/1.4 var(--fb);color:#5F6E8C;text-align:left}
.bt-v b{display:block;font:700 15px/1.3 var(--fb);color:#13265A}
.bt-o{grid-column:span 2;padding:0;background:none;box-shadow:none}
.d-iznik .open-btn{width:100%;padding:17px 20px;border-radius:18px;background:linear-gradient(120deg,#13265A,#1E5BB8 55%,#36B3C9);color:#fff;font:700 13px var(--fb);letter-spacing:.22em}
.d-iznik .open-btn::after{border-radius:20px;border-color:#36B3C9}
/* opening: the tiles flip away one by one */
.d-iznik.opening #intro .bt-c{animation:none;transition:transform .7s cubic-bezier(.6,0,.4,1),opacity .5s .2s;transition-delay:calc(var(--n,0) * .06s);transform:perspective(800px) rotateY(90deg);opacity:0}
.d-iznik.opening #intro{transition:opacity .7s ease 1s;opacity:0}
/* hero: tiled layout – the slideshow sits in a big rounded tile */
.d-iznik .hero{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cg fill='none' stroke='%2336B3C9' stroke-opacity='.16' stroke-width='1.4'%3E%3Cpath d='M40 14c-7 8-9 16-5 25h10c4-9 2-17-5-25zM40 39v24'/%3E%3Ccircle r='12'/%3E%3Ccircle cx='80' r='12'/%3E%3Ccircle cy='80' r='12'/%3E%3Ccircle cx='80' cy='80' r='12'/%3E%3C/g%3E%3C/svg%3E") 0 0/80px 80px,#0B1F4A}
.d-iznik .ss{left:50%;right:auto;top:76px;bottom:auto;width:min(94vw,760px);height:min(46vh,520px);margin-left:calc(min(94vw,760px) / -2);overflow:hidden;border-radius:22px;box-shadow:0 0 0 4px #36B3C9,0 24px 50px -24px #000}
.d-iznik .hveil{display:none}
.d-iznik .hero-in{width:min(94vw,760px);padding:calc(min(46vh,520px) + 92px) 0 96px}
.bt-hn{width:100%;padding:18px 14px;text-align:center;animation:none;opacity:0;transform:translate3d(0,20px,0);transition:opacity 1s .3s,transform 1s .3s}
.is-open .bt-hn{opacity:1;transform:none}
.d-iznik .bt-hn .wgm{color:#1E5BB8;opacity:1;transform:none}
.d-iznik .hero .nm{text-shadow:none;margin:4px 0 6px;font-weight:400;font-size:calc(var(--nk,1) * clamp(36px,9.6vw,70px))}
.d-iznik .nm .amp{color:#36B3C9}
.d-iznik .quote{color:#5F6E8C;text-shadow:none}
.d-iznik .cd{width:100%;margin-top:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.d-iznik .cdu{width:auto;aspect-ratio:1;border-radius:16px;background:#F7FAFF;color:#13265A}
.d-iznik .cdu:nth-child(2){background:#36B3C9;color:#fff}.d-iznik .cdu:nth-child(3){background:#E8B04A}.d-iznik .cdu:nth-child(4){background:#1E5BB8;color:#fff}
.d-iznik .cdu svg{display:none}
.d-iznik .cdu b{font:700 clamp(26px,7vw,44px)/1 var(--fs)}
.d-iznik .cd-note{color:#fff}
.d-iznik .ssd{bottom:calc(100% - min(46vh,520px) - 64px)}
/* sections */
.d-iznik .k{color:#1E5BB8;font-weight:700}
.d-iznik .pf{padding:8px;border-radius:18px;background:#fff;box-shadow:0 14px 30px -20px rgba(11,31,74,.6)}
.d-iznik .pfo{display:none}.d-iznik .pfi{border-radius:12px}
.d-iznik .pc h3{font-weight:600}
.d-iznik .ev{background:#F7FAFF;color:#13265A;border-radius:18px}
.d-iznik .ev .evi{color:#1E5BB8}.d-iznik .evdate{background:#E8B04A;color:#13265A}
.d-iznik .evb h3{font-weight:600;color:#13265A}
.d-iznik .ev .btn.wg{color:#1E5BB8;border-color:#1E5BB8}.d-iznik .btn{background:#1E5BB8;border-color:#1E5BB8;border-radius:12px}.d-iznik .btn.ghost{background:transparent;color:#1E5BB8}.d-iznik .btn.w{background:#36B3C9;border-color:#36B3C9;color:#fff}.d-iznik .btn.wa{background:#25D366;border-color:#25D366}
.d-iznik .gi{border-radius:18px}
@media (min-width:900px) and (min-height:600px){
.bt{width:min(92vw,860px);grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"h h h h" "p1 p2 n n" "p1 p2 d t" "v v o o"}
.bt-h{grid-area:h}.bt-c:nth-child(2){grid-area:p1}.bt-c:nth-child(3){grid-area:p2}.bt-n{grid-area:n}.bt-d{grid-area:d}.bt-t{grid-area:t}.bt-v{grid-area:v}.bt-o{grid-area:o;display:flex;align-items:stretch}
.bt-p{aspect-ratio:auto}
.d-iznik .bt-o .open-btn{width:100%;height:100%}}
@media (max-height:700px) and (max-width:899px){.bt{gap:8px;padding:10px 0}.bt-c{padding:10px;border-radius:14px}.bt-p{aspect-ratio:1}.bt-n{padding:10px}.bt-n p{font-size:30px}.bt-d b{font-size:40px}.d-iznik .open-btn{padding:14px}}

/* ---------------------------------------------------------------- ANAR */
.d-anar{--fs:"Lobster Two",cursive;--fb:"Figtree",system-ui,sans-serif;--fd:"El Messiri",Georgia,serif}
.d-anar .hero{background:#26080F}
.d-anar .ss{z-index:0}.d-anar .hveil{z-index:1;background:linear-gradient(180deg,rgba(38,8,15,.5) 0,rgba(38,8,15,.05) 22%,rgba(38,8,15,.3) 36%,rgba(38,8,15,.84) 52%,rgba(38,8,15,.96) 100%)}
.d-anar .hero-in{z-index:3}
.d-anar .hero .nm{color:#3A1018}.d-anar .nm .amp{color:#E3B04B}
.d-anar .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-anar .cdu .rp{stroke:#E3B04B}.d-anar .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-anar .pfo{transform:none;border:2px solid var(--gold);border-radius:4px}.d-anar .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:8px}
.d-anar .pc:hover .pfo{transform:none}.d-anar .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-anar .pfi{border-radius:2px}
.d-anar .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-anar .h2.scr,.d-anar .ty{font-family:var(--fs)}
.d-anar .cillu{color:var(--acc)}
.d-anar .strip{background:linear-gradient(90deg,#7E1A2C,#B3263E,#7E1A2C);color:#fff}.d-anar .strip i{fill:#E3B04B}
.d-anar .when{background:linear-gradient(180deg,#7E1A2C,#4E0F1B)}.d-anar .wave{fill:#7E1A2C}.d-anar .wave.b{fill:#4E0F1B}
.d-anar .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-anar .btn.w{color:#7E1A2C}
.d-anar .foot::before{background:linear-gradient(180deg,rgba(38,8,15,.42),rgba(126,26,44,.9))}
.d-anar .ft-n span{color:#E3B04B}
/* first page: a Nikah certificate */
.d-anar #intro{background:radial-gradient(ellipse at 50% 40%,#FFF8F2,#FBE6DC 55%,#F1CDBE);color:#3A1018;-webkit-perspective:1300px;perspective:1300px}
.pbr{position:absolute;top:-2%;z-index:2;width:min(60vw,300px);transform-origin:0 0;animation:absw 6s ease-in-out infinite alternate;pointer-events:none}
.pbr svg{width:100%;height:auto;display:block}
.pbr.l{left:-8%}
.pbr.r{right:-8%;transform:scaleX(-1);transform-origin:100% 0;animation-name:pbsw2;animation-delay:-3s}
@keyframes absw{from{transform:rotate(-2deg)}to{transform:rotate(2deg)}}
@keyframes pbsw2{from{transform:scaleX(-1) rotate(-2deg)}to{transform:scaleX(-1) rotate(2deg)}}
.lvs{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.d-anar .fli{color:#E8432E}.d-anar .lf3:nth-child(2n) .fli,.d-anar .cfx i:nth-child(2n) .fli{color:#C0263E}.d-anar .lf3:nth-child(3n) .fli,.d-anar .cfx i:nth-child(3n) .fli{color:#F2784B}
.ct{position:relative;z-index:3;margin:auto;width:min(92vw,500px);display:flex;flex-direction:column;align-items:center;gap:16px;padding:clamp(60px,16vw,90px) 0 24px}
.ct-doc{position:relative;width:100%;padding:28px clamp(16px,5vw,30px) 54px;background:repeating-radial-gradient(circle at 50% 120%,transparent 0 14px,rgba(179,38,62,.035) 14px 15px),#FFFCF5;text-align:center;box-shadow:inset 0 0 0 2px #B3263E,inset 0 0 0 8px #FFFCF5,inset 0 0 0 9px #E3B04B,0 26px 50px -24px rgba(94,15,30,.55);transform-origin:50% 0;animation:ctin 1.1s cubic-bezier(.2,.8,.2,1) .2s both}
@keyframes ctin{from{transform:perspective(900px) rotateX(-80deg);opacity:0}}
.ct-cn{position:absolute;width:30px;height:30px;border:3px double #E3B04B}
.ct-cn::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#B3263E}
.ct-cn.tl{left:14px;top:14px;border-right:0;border-bottom:0}.ct-cn.tl::after{left:4px;top:4px}
.ct-cn.tr{right:14px;top:14px;border-left:0;border-bottom:0}.ct-cn.tr::after{right:4px;top:4px}
.ct-cn.bl{left:14px;bottom:14px;border-right:0;border-top:0}.ct-cn.bl::after{left:4px;bottom:4px}
.ct-cn.br{right:14px;bottom:14px;border-left:0;border-top:0}.ct-cn.br::after{right:4px;bottom:4px}
.d-anar .bsm{color:#B3263E}
.ct-h{margin:4px 0 6px;font:600 clamp(19px,5.4vw,26px)/1.2 var(--fd);letter-spacing:.06em;text-transform:uppercase;color:#7E1A2C}
.ct-x{margin:6px 0 0;font:italic 400 clamp(13px,3.6vw,15px)/1.45 var(--fb);color:#7E5A5E}
.ct-sig{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,4vw,24px);margin:14px 0 8px}
.ct-sig>div{display:flex;flex-direction:column;align-items:center;min-width:0}
.ct-i{display:grid;place-items:center;width:clamp(84px,25vw,118px);aspect-ratio:.8;overflow:hidden;border:2px solid #E3B04B;outline:1px solid #B3263E;outline-offset:3px;background:linear-gradient(140deg,#B3263E,#E3B04B)}
.ct-i img{width:100%;height:100%;object-fit:cover}.ct-i b{font:400 40px var(--fs);color:#fff}
.ct-s{width:100%;margin:12px 0 0;padding-bottom:4px;border-bottom:1px solid #3A1018;font:400 clamp(24px,6.8vw,32px)/1.15 var(--fs);color:#8E1B2C;overflow-wrap:anywhere;clip-path:inset(0 100% 0 0);animation:sign 1.1s ease forwards}
.ct-sig>div:first-child .ct-s{animation-delay:1.2s}.ct-sig>div:last-child .ct-s{animation-delay:1.7s}
@keyframes sign{to{clip-path:inset(0 -10% 0 0)}}
.ct-sig small{margin-top:4px;font:600 10px var(--fb);letter-spacing:.2em;text-transform:uppercase;color:#7E5A5E}
.ct-d{margin:4px 0 0;font:700 clamp(15px,4vw,17px)/1.35 var(--fb);color:#3A1018}
.ct-v{margin:2px 0 0;font:500 14px/1.4 var(--fb);color:#7E5A5E}
.ct-seal{position:absolute;left:50%;bottom:-38px;width:78px;height:78px;margin-left:-39px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFE6A0,#E3B04B 45%,#A87A1E);box-shadow:0 0 0 3px #FFFCF5,0 0 0 5px #E3B04B,0 10px 20px -8px rgba(0,0,0,.5);display:grid;place-items:center;animation:stamp .55s cubic-bezier(.3,1.5,.5,1) 2.2s both}
.ct-seal svg{width:56%;height:auto;display:block}
.ct-seal i{position:absolute;top:62px;z-index:-1;width:18px;height:40px;background:#B3263E;clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%)}
.ct-seal i:first-of-type{left:18px;transform:rotate(14deg)}.ct-seal i:last-of-type{right:18px;transform:rotate(-14deg)}
@keyframes stamp{from{transform:scale(2.4);opacity:0}}
.d-anar .open-btn{margin-top:48px;width:min(80vw,260px);border-radius:4px;background:linear-gradient(120deg,#7E1A2C,#B3263E 50%,#E3B04B);color:#fff;font:700 13px var(--fb);letter-spacing:.18em}
.d-anar .open-btn::after{border-radius:6px;border-color:#B3263E}
/* opening: the seal presses and the certificate folds away */
.d-anar.opening #intro .ct-seal{animation:none;transition:transform .35s ease;transform:scale(.86)}
.d-anar.opening #intro .ct-doc{animation:none;transition:transform 1.1s cubic-bezier(.6,0,.3,1) .3s,opacity .5s .8s;transform:perspective(900px) rotateX(82deg) translate3d(0,-20vh,0) scale(.7);opacity:0}
.d-anar.opening #intro .open-btn{transition:opacity .3s;opacity:0}
.d-anar.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero: the slideshow in an ornate certificate frame on cream */
.d-anar .hero{background:repeating-radial-gradient(circle at 50% 120%,transparent 0 14px,rgba(179,38,62,.035) 14px 15px),#FFF8F2;color:#3A1018}
.d-anar .ss{left:50%;right:auto;top:96px;bottom:auto;width:var(--fw);aspect-ratio:.8;margin-left:calc(var(--fw) / -2);overflow:hidden;border:3px solid #E3B04B;box-shadow:0 26px 50px -24px rgba(94,15,30,.6)}
.d-anar .hveil{display:none}
.ct-frame{position:absolute;left:50%;top:80px;z-index:2;display:block;width:calc(var(--fw) + 32px);aspect-ratio:.84;margin-left:calc(var(--fw) / -2 - 16px);border:1px solid #B3263E;pointer-events:none}
.ct-frame .ct-cn{width:26px;height:26px}
.ct-frame .ct-cn.tl{left:-6px;top:-6px}.ct-frame .ct-cn.tr{right:-6px;top:-6px}.ct-frame .ct-cn.bl{left:-6px;bottom:-6px}.ct-frame .ct-cn.br{right:-6px;bottom:-6px}
.d-anar .hero-in{padding:calc(var(--fw) / .8 + 130px) 0 110px}
.d-anar .wgm{color:#B3263E;font-weight:600}
.d-anar .hero .nm{text-shadow:none}
.d-anar .quote{color:#7E5A5E;text-shadow:none}
.d-anar .cdu{background:radial-gradient(circle at 35% 30%,#FFF6DA,#F3DDA8);color:#7E1A2C;border:2px solid #E3B04B}
.d-anar .cdu .rt{stroke:rgba(126,26,44,.12)}.d-anar .cdu .rp{stroke:#B3263E}
.d-anar .cdu b{font-family:var(--fd)}
.d-anar .cd-note{color:#3A1018}
.d-anar .ssd i{background:rgba(126,26,44,.3)}.d-anar .ssd i.on{background:#B3263E}
.d-anar .scroll-hint{border-color:#B3263E}.d-anar .scroll-hint span{background:#B3263E}
.d-anar .nav{background:rgba(255,248,242,.92);border-color:rgba(126,26,44,.15)}.d-anar .nav a{color:#3A1018}.d-anar .nav a.on,.d-anar .nav a:hover{color:#fff;background:#B3263E}
/* sections */
.d-anar .k{color:#B3263E;font-weight:600}
.d-anar .pfo{border:3px double #E3B04B;border-radius:0}.d-anar .pfo::after{border-color:#B3263E;border-radius:0}
.d-anar .ev{background:#FFFCF5;color:#3A1018;border-radius:4px;box-shadow:inset 0 0 0 1px #E3B04B}
.d-anar .ev .evi{color:#B3263E}.d-anar .evdate{background:#B3263E}
.d-anar .evb h3{color:#7E1A2C}
.d-anar .ev .btn.wg{color:#7E1A2C;border-color:#7E1A2C}.d-anar .btn{background:#7E1A2C;border-color:#7E1A2C}.d-anar .btn.ghost{background:transparent;color:#7E1A2C}.d-anar .btn.w{background:#B3263E;border-color:#B3263E;color:#fff}.d-anar .btn.wa{background:#25D366;border-color:#25D366}

.d-anar .hero{--fw:min(80vw,430px,44vh)}

/* ---------------------------------------------------------------- QALAM */
.d-qalam{--fs:"Cormorant Garamond",Georgia,serif;--fb:"Raleway",system-ui,sans-serif;--fd:"Cinzel",Georgia,serif}
.d-qalam .hero{background:#0E0D0C}
.d-qalam .ss{z-index:0}.d-qalam .hveil{z-index:1;background:linear-gradient(180deg,rgba(14,13,12,.5) 0,rgba(14,13,12,.05) 22%,rgba(14,13,12,.3) 36%,rgba(14,13,12,.84) 52%,rgba(14,13,12,.96) 100%)}
.d-qalam .hero-in{z-index:3}
.d-qalam .hero .nm{color:#F6EBD3}.d-qalam .nm .amp{color:#C9A04A}
.d-qalam .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-qalam .cdu .rp{stroke:#C9A04A}.d-qalam .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-qalam .pfo{transform:none;border:2px solid var(--gold);border-radius:0px}.d-qalam .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:4px}
.d-qalam .pc:hover .pfo{transform:none}.d-qalam .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-qalam .pfi{border-radius:0px}
.d-qalam .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-qalam .h2.scr,.d-qalam .ty{font-family:var(--fs)}
.d-qalam .cillu{color:var(--acc)}
.d-qalam .strip{background:linear-gradient(90deg,#141210,#2A251E,#141210);color:#fff}.d-qalam .strip i{fill:#C9A04A}
.d-qalam .when{background:linear-gradient(180deg,#141210,#0A0908)}.d-qalam .wave{fill:#141210}.d-qalam .wave.b{fill:#0A0908}
.d-qalam .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-qalam .btn.w{color:#141210}
.d-qalam .foot::before{background:linear-gradient(180deg,rgba(14,13,12,.42),rgba(20,18,16,.9))}
.d-qalam .ft-n span{color:#C9A04A}
/* first page: black & gold typography, no card */
.d-qalam #intro{background:radial-gradient(ellipse at 50% 45%,#2A2318,#0E0D0C 62%);color:#F3E9D2}
.flr{position:absolute;z-index:1;width:min(92vw,440px);color:#C9A04A;pointer-events:none}
.flr svg{width:100%;height:auto;display:block}
.flr path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.8s ease .3s forwards}
.flr.f1{left:-10%;top:2%}
.flr.f2{right:-10%;bottom:2%;transform:rotate(180deg)}
.flr.f2 path{animation-delay:1s}
.ql{position:relative;z-index:3;margin:auto;width:min(92vw,520px);display:flex;flex-direction:column;align-items:center;gap:12px;padding:30px 0;text-align:center}
.d-qalam .bsm{color:#C9A04A;opacity:0;animation:fadein 1s .2s forwards}
.ql-top{display:flex;align-items:center;justify-content:center;gap:clamp(14px,5vw,30px);opacity:0;animation:fadein 1.2s .4s forwards}
.ql-i{display:grid;place-items:center;width:clamp(76px,22vw,104px);aspect-ratio:.66;overflow:hidden;border:1px solid #C9A04A;outline:1px solid rgba(201,160,74,.45);outline-offset:5px;background:linear-gradient(160deg,#3A2F1E,#141210)}
.ql-i img{width:100%;height:100%;object-fit:cover}.ql-i b{font:500 40px var(--fd);color:#C9A04A}
.ql-mono{display:flex;flex-direction:column;align-items:center;margin:0;font:500 clamp(34px,10vw,52px)/1 var(--fd);color:#C9A04A}
.ql-mono i{width:1px;height:30px;margin:8px 0;background:linear-gradient(#C9A04A,transparent)}
.ql-k{margin:8px 0 0;font:500 10.5px var(--fb);letter-spacing:.42em;text-transform:uppercase;color:#C9A04A;opacity:0;animation:fadein 1s .7s forwards}
.ql-n{display:flex;flex-direction:column;align-items:center;margin:0;font:italic 500 clamp(42px,12.6vw,72px)/1.05 var(--fs);color:#F6EBD3;max-width:100%}
.ql-w{display:block;max-width:100%;overflow-wrap:anywhere}
.ql-amp{margin:2px 0;font:400 .42em var(--fd);font-style:normal;color:#C9A04A;opacity:0;animation:fadein .8s 1.5s forwards}
.lt{display:inline-block;opacity:0;transform:translate3d(0,.35em,0);animation:ltin .6s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.9s + var(--i) * .07s)}
.ql-amp+.ql-w .lt{animation-delay:calc(1.7s + var(--i) * .07s)}
@keyframes ltin{to{opacity:1;transform:none}}
.ql-line{display:block;width:140px;height:1px;background:linear-gradient(90deg,transparent,#C9A04A,transparent);transform:scaleX(0);animation:qline 1s ease 2.2s forwards}
@keyframes qline{to{transform:scaleX(1)}}
.ql-d{margin:4px 0 0;font:500 clamp(12px,3.4vw,14px) var(--fd);letter-spacing:.24em;text-transform:uppercase;color:#F3E9D2;opacity:0;animation:fadein 1s 2.3s forwards}
.ql-v{margin:0;font:400 clamp(13px,3.4vw,14.5px)/1.5 var(--fb);color:rgba(243,233,210,.7);opacity:0;animation:fadein 1s 2.45s forwards}
.d-qalam .open-btn{margin-top:10px;width:min(76vw,250px);border:1px solid #C9A04A;border-radius:0;background:transparent;color:#C9A04A;font:500 12.5px var(--fd);letter-spacing:.34em;box-shadow:none;opacity:0;animation:fadein 1s 2.6s forwards}
.d-qalam .open-btn::after{border-radius:0;border-color:#C9A04A}
.ink{position:absolute;left:-25%;top:0;z-index:7;width:150%;height:100%;background:linear-gradient(90deg,#8C6A1E,#E9D3A0 45%,#C9A04A 60%,#1A1610);transform:translate3d(-110%,0,0) skewX(-14deg);pointer-events:none}
/* opening: a gold stroke sweeps across */
.d-qalam.opening #intro .ink{transition:transform 1s cubic-bezier(.6,0,.3,1) .05s;transform:translate3d(0,0,0) skewX(-14deg)}
.d-qalam.opening #intro .ql{transition:opacity .5s .3s;opacity:0}
.d-qalam.opening #intro{transition:opacity .8s ease 1.05s;opacity:0}
/* hero: a tall portrait window on black */
.d-qalam .hero{background:radial-gradient(ellipse at 50% 30%,#2A2318,#0E0D0C 65%);color:#F6EBD3}
.d-qalam .ss{left:50%;right:auto;top:84px;bottom:auto;width:var(--fw);aspect-ratio:.68;margin-left:calc(var(--fw) / -2);overflow:hidden;border:1px solid #C9A04A;outline:1px solid rgba(201,160,74,.45);outline-offset:8px}
.d-qalam .hveil{display:none}
.flr.hf{left:-12%;top:0;z-index:1;width:min(84vw,420px);opacity:.6}
.flr.hf path{animation:none;stroke-dashoffset:0}
.d-qalam .hero-in{padding:calc(var(--fw) / .68 + 116px) 0 110px}
.d-qalam .wgm{color:#C9A04A;font-family:var(--fd);letter-spacing:.34em}
.d-qalam .hero .nm{font-style:italic;font-weight:500;text-shadow:none}
.d-qalam .quote{color:rgba(243,233,210,.75);text-shadow:none}
.d-qalam .cd{gap:0}
.d-qalam .cdu{width:clamp(70px,20vw,110px);background:none;box-shadow:none;border-radius:0;border-right:1px solid rgba(201,160,74,.4)}
.d-qalam .cdu:last-child{border-right:0}
.d-qalam .cdu svg{display:none}
.d-qalam .cdu b{font:500 clamp(30px,8vw,48px)/1 var(--fd);color:#F6EBD3}
.d-qalam .cdu span{color:#C9A04A;letter-spacing:.24em}
.d-qalam .fli{color:#C9A04A}.d-qalam .cfx i:nth-child(2n) .fli{color:#E9D3A0}
/* sections */
.d-qalam .k{color:#8C6A1E;font-family:var(--fd)}
.d-qalam .h2.scr{font-style:italic;font-weight:500}
.d-qalam .pfo{border:1px solid #C9A04A;border-radius:0}.d-qalam .pfo::after{border:1px solid rgba(201,160,74,.5);border-radius:0}
.d-qalam .pc h3{font-style:italic;font-weight:500}
.d-qalam .strip{background:#141210;color:#C9A04A;transform:none;margin:0}
.d-qalam .strip b{font-style:italic}
.d-qalam .ev{background:rgba(255,255,255,.04);border:1px solid rgba(201,160,74,.5);border-radius:0}
.d-qalam .ev .evi{color:#141210;border-color:#C9A04A}
.d-qalam .evdate{background:#C9A04A;color:#141210}
.d-qalam .evb h3{font-style:italic;color:#E9D3A0}
.d-qalam .when .h2{color:#F6EBD3}.d-qalam .when .k{color:#C9A04A}
.d-qalam .btn{border-radius:0;background:#141210;border-color:#141210}.d-qalam .btn.w{background:#C9A04A;border-color:#C9A04A;color:#141210}.d-qalam .btn.ghost{background:transparent;color:#141210}.d-qalam .btn.wg{border-color:#C9A04A;color:#C9A04A}.d-qalam .btn.wa{background:#25D366;border-color:#25D366}

.d-qalam .hero{--fw:min(66vw,340px,44vh)}
/* ======================================================================
   1.32 – eleven classic photo designs (scoped to .n4 / .tr-* / .d-<look>)
   Animations use transform and opacity only, so phones run them as smoothly as laptops.
   ====================================================================== */
.n4 .hero .nm{white-space:normal;line-height:1.14;max-width:100%}
.tr-mosaic .sl:not(.art),.tr-dissolve .sl:not(.art),.tr-doors .sl:not(.art){opacity:1;transition:none}
/* mosaic: nine tiles pop in, scattered */
.tr-mosaic .sx{width:calc(33.334% + 1px);height:calc(33.334% + 1px);transform:scale(0);opacity:0;transition:transform .7s cubic-bezier(.3,1.4,.5,1),opacity .35s;transition-delay:calc(var(--r) * .09s)}
.tr-mosaic .sx img{width:calc(300% - 3px);height:calc(300% - 3px)}
.tr-mosaic .sl.on .sx,.tr-mosaic .sl.out .sx{transform:none;opacity:1}
.tr-mosaic .sx:nth-child(1){left:0.0%;top:0.0%}.tr-mosaic .sx:nth-child(1) img{left:calc(0% + 0px);top:calc(0% + 0px)}
.tr-mosaic .sx:nth-child(2){left:33.333%;top:0.0%}.tr-mosaic .sx:nth-child(2) img{left:calc(-100% + 1px);top:calc(0% + 0px)}
.tr-mosaic .sx:nth-child(3){left:66.666%;top:0.0%}.tr-mosaic .sx:nth-child(3) img{left:calc(-200% + 2px);top:calc(0% + 0px)}
.tr-mosaic .sx:nth-child(4){left:0.0%;top:33.333%}.tr-mosaic .sx:nth-child(4) img{left:calc(0% + 0px);top:calc(-100% + 1px)}
.tr-mosaic .sx:nth-child(5){left:33.333%;top:33.333%}.tr-mosaic .sx:nth-child(5) img{left:calc(-100% + 1px);top:calc(-100% + 1px)}
.tr-mosaic .sx:nth-child(6){left:66.666%;top:33.333%}.tr-mosaic .sx:nth-child(6) img{left:calc(-200% + 2px);top:calc(-100% + 1px)}
.tr-mosaic .sx:nth-child(7){left:0.0%;top:66.666%}.tr-mosaic .sx:nth-child(7) img{left:calc(0% + 0px);top:calc(-200% + 2px)}
.tr-mosaic .sx:nth-child(8){left:33.333%;top:66.666%}.tr-mosaic .sx:nth-child(8) img{left:calc(-100% + 1px);top:calc(-200% + 2px)}
.tr-mosaic .sx:nth-child(9){left:66.666%;top:66.666%}.tr-mosaic .sx:nth-child(9) img{left:calc(-200% + 2px);top:calc(-200% + 2px)}
/* dissolve: twelve squares fade in at random */
.tr-dissolve .sx{width:calc(33.334% + 1px);height:calc(25% + 1px);opacity:0;transform:scale(1.08);transition:opacity .7s ease,transform .9s ease;transition-delay:calc(var(--r) * .09s)}
.tr-dissolve .sx img{width:calc(300% - 3px);height:calc(400% - 4px)}
.tr-dissolve .sl.on .sx,.tr-dissolve .sl.out .sx{opacity:1;transform:none}
.tr-dissolve .sx:nth-child(1){left:0.0%;top:0%}.tr-dissolve .sx:nth-child(1) img{left:calc(0% + 0px);top:calc(0% + 0px)}
.tr-dissolve .sx:nth-child(2){left:33.333%;top:0%}.tr-dissolve .sx:nth-child(2) img{left:calc(-100% + 1px);top:calc(0% + 0px)}
.tr-dissolve .sx:nth-child(3){left:66.666%;top:0%}.tr-dissolve .sx:nth-child(3) img{left:calc(-200% + 2px);top:calc(0% + 0px)}
.tr-dissolve .sx:nth-child(4){left:0.0%;top:25%}.tr-dissolve .sx:nth-child(4) img{left:calc(0% + 0px);top:calc(-100% + 1px)}
.tr-dissolve .sx:nth-child(5){left:33.333%;top:25%}.tr-dissolve .sx:nth-child(5) img{left:calc(-100% + 1px);top:calc(-100% + 1px)}
.tr-dissolve .sx:nth-child(6){left:66.666%;top:25%}.tr-dissolve .sx:nth-child(6) img{left:calc(-200% + 2px);top:calc(-100% + 1px)}
.tr-dissolve .sx:nth-child(7){left:0.0%;top:50%}.tr-dissolve .sx:nth-child(7) img{left:calc(0% + 0px);top:calc(-200% + 2px)}
.tr-dissolve .sx:nth-child(8){left:33.333%;top:50%}.tr-dissolve .sx:nth-child(8) img{left:calc(-100% + 1px);top:calc(-200% + 2px)}
.tr-dissolve .sx:nth-child(9){left:66.666%;top:50%}.tr-dissolve .sx:nth-child(9) img{left:calc(-200% + 2px);top:calc(-200% + 2px)}
.tr-dissolve .sx:nth-child(10){left:0.0%;top:75%}.tr-dissolve .sx:nth-child(10) img{left:calc(0% + 0px);top:calc(-300% + 3px)}
.tr-dissolve .sx:nth-child(11){left:33.333%;top:75%}.tr-dissolve .sx:nth-child(11) img{left:calc(-100% + 1px);top:calc(-300% + 3px)}
.tr-dissolve .sx:nth-child(12){left:66.666%;top:75%}.tr-dissolve .sx:nth-child(12) img{left:calc(-200% + 2px);top:calc(-300% + 3px)}
/* flip: the photo turns over like a card */
.tr-flipy .ss{-webkit-perspective:1600px;perspective:1600px}
.tr-flipy .sl{opacity:1;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:rotateY(180deg);transition:transform 1.4s cubic-bezier(.5,0,.3,1)}
.tr-flipy .sl.on{transform:rotateY(0)}
.tr-flipy .sl.out{transform:rotateY(-180deg)}
/* bloom: the new photo blooms from the centre */
.tr-bloom .sl{opacity:0;transform:scale(.35) rotate(-6deg);transition:transform 1.5s cubic-bezier(.2,1.2,.3,1),opacity 1s ease}
.tr-bloom .sl.on{opacity:1;transform:scale(1.02)}
.tr-bloom .sl.out{opacity:1;transform:scale(1.02)}
/* through: fly through the old photo into the new one */
.tr-through .sl{opacity:0;transform:scale(.62);transition:transform 1.5s cubic-bezier(.6,0,.3,1),opacity 1.1s ease}
.tr-through .sl.on{opacity:1;transform:scale(1.02)}
.tr-through .sl.out{z-index:3;opacity:0;transform:scale(1.9)}
/* doors: the new photo closes in from both sides like two doors */
.tr-doors .sx{top:0;height:100%;width:calc(50% + 1px);left:calc(var(--x) * 50%);transform:translate3d(calc((var(--x) * 2 - 1) * 101%),0,0);transition:transform 1.4s cubic-bezier(.7,0,.25,1)}
.tr-doors .sx img{width:calc(200% - 2px);height:100%;left:calc(var(--x) * -100% + var(--x) * 1px)}
.tr-doors .sl.on .sx,.tr-doors .sl.out .sx{transform:none}
/* glow: the new photo glows in */
.tr-glow .sl{opacity:0;transform:scale(1.1);transition:opacity 1.4s ease,transform 1.8s cubic-bezier(.2,.8,.2,1)}
.tr-glow .sl.on,.tr-glow .sl.out{opacity:1;transform:none}
/* fan: the new photo swings open like a fan */
.tr-fan .sl{opacity:1;transform-origin:0 100%;transform:rotate(-75deg);transition:transform 1.6s cubic-bezier(.3,.9,.3,1)}
.tr-fan .sl.on,.tr-fan .sl.out{transform:none}
/* spin: the new photo twirls in */
.tr-spin .sl{opacity:0;transform:rotate(-14deg) scale(.55);transition:transform 1.6s cubic-bezier(.2,.9,.3,1.1),opacity 1s ease}
.tr-spin .sl.on,.tr-spin .sl.out{opacity:1;transform:none}
/* rise: the new photo rises up */
.tr-rise .sl{opacity:0;transform:translate3d(0,38%,0) scale(1.05);transition:transform 1.6s cubic-bezier(.2,.8,.2,1),opacity 1.1s ease}
.tr-rise .sl.on{opacity:1;transform:none}
.tr-rise .sl.out{opacity:1;transform:translate3d(0,-6%,0)}
/* drop: the new photo drops in and settles */
.tr-drop .sl{opacity:1;transform:translate3d(0,-102%,0);transition:transform 1.5s cubic-bezier(.3,1.2,.5,1)}
.tr-drop .sl.on{transform:none}
.tr-drop .sl.out{transform:scale(.94)}
/* every new slide: a slow zoom and a light sweep */
.n4 .sl.on>img{animation:n4kb 9s ease-out both}
@keyframes n4kb{from{transform:scale(1.14) translate3d(-1.5%,1%,0)}to{transform:scale(1.02)}}
.n4 .sl:not(.art)::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 32%,rgba(255,236,200,.3) 46%,rgba(255,255,255,.45) 50%,rgba(255,236,200,.3) 54%,transparent 68%);transform:translate3d(-101%,0,0);opacity:0}
.n4 .sl.on:not(.art)::after{animation:n4sweep 1.7s ease-out .5s both}
@keyframes n4sweep{0%{opacity:1;transform:translate3d(-101%,0,0)}100%{opacity:1;transform:translate3d(101%,0,0)}}
.n4 .ss{overflow:hidden}

/* ---- the invitation card on the first page ---- */
.n4 #intro{color:var(--cink,#fff)}
.c4-bg{position:fixed;inset:0;z-index:0;pointer-events:none}
.c4{position:relative;z-index:3;margin:auto;width:min(90vw,400px);display:flex;flex-direction:column;align-items:center;gap:11px;padding:20px 16px 22px;text-align:center;border-radius:var(--crad,22px);background:var(--cbg,rgba(255,255,255,.06));border:1px solid var(--cbd,rgba(255,255,255,.18));box-shadow:var(--csh,0 30px 60px -30px rgba(0,0,0,.7));animation:c4in 1.1s cubic-bezier(.2,.8,.2,1) .15s both}
@keyframes c4in{from{opacity:0;transform:translate3d(0,30px,0) scale(.96)}}
.c4-em{position:relative;display:grid;place-items:center}
.c4-img{display:block;background:no-repeat center/contain}
.c4>.bsm{margin:-2px 0 -4px;opacity:0;animation:fadein 1s .4s forwards}
.c4-k{display:flex;align-items:center;justify-content:center;gap:10px;margin:0;font:600 10.5px var(--fb);letter-spacing:.32em;text-transform:uppercase;color:var(--cacc);opacity:0;animation:c4k 1s ease .45s forwards}
.c4-k i{width:36px;height:1px;background:currentColor;transform:scaleX(0);animation:c4ln .9s ease .8s forwards}
@keyframes c4k{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:none}}
@keyframes c4ln{to{transform:scaleX(1)}}
.c4-pp{display:flex;align-items:flex-start;justify-content:center;gap:clamp(8px,3.4vw,16px);width:100%;--pw:clamp(96px,30vw,128px)}
.c4-pc{display:flex;flex-direction:column;align-items:center;gap:5px;width:var(--pw);min-width:0}
.c4-pf{position:relative;display:grid;place-items:center;width:var(--pw);aspect-ratio:.8;overflow:hidden;border-radius:var(--prad,10px);border:2px solid var(--cgold);box-shadow:0 0 0 5px var(--pring,rgba(255,255,255,.08)),0 16px 28px -16px rgba(0,0,0,.7);background:linear-gradient(140deg,var(--acc),var(--gold));opacity:0;animation:c4pf 1.1s cubic-bezier(.2,.8,.2,1) .7s forwards;--rx:-1}
.c4-pc+.c4-ph+.c4-pc .c4-pf{animation-delay:.85s;--rx:1}
@keyframes c4pf{from{opacity:0;transform:perspective(600px) rotateY(calc(var(--rx) * 70deg)) scale(.9)}to{opacity:1;transform:none}}
.c4-pf img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c4-pf b{font:400 44px var(--fs);color:#fff}
.c4-pf::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);transform:translate3d(-120%,0,0);animation:c4shine 7s ease 2.2s infinite}
@keyframes c4shine{0%{transform:translate3d(-120%,0,0)}22%,100%{transform:translate3d(120%,0,0)}}
.c4-ph{flex-shrink:0;width:22px;margin-top:calc(var(--pw) * .55);color:var(--cacc);animation:beat 1.5s ease-in-out infinite}
.c4-ph svg{display:block;width:100%;fill:currentColor}
.c4-pn{margin:3px 0 0;max-width:100%;font:var(--fnw,500) min(var(--fnsz,clamp(24px,6.6vw,30px)),calc(var(--pw) * 1.7 / var(--n,6)))/1.15 var(--fs);color:var(--cname,#fff);overflow-wrap:break-word}
.c4-w{display:inline-block;white-space:nowrap}
.c4-c{display:inline-block;opacity:0;transform:translate3d(0,.55em,0) rotate(10deg);animation:c4ch .6s cubic-bezier(.2,.9,.3,1.3) forwards,c4wave 7s ease-in-out infinite;animation-delay:calc(1.1s + var(--c) * .05s),calc(3.6s + var(--c) * .07s)}
@keyframes c4ch{to{opacity:1;transform:none}}
@keyframes c4wave{0%,10%,100%{transform:none}5%{transform:translate3d(0,-.16em,0)}}
.c4-pr{margin:0;font:600 9.5px var(--fb);letter-spacing:.28em;text-transform:uppercase;color:var(--cmut);opacity:0;animation:fadein .8s 1.6s forwards}
.c4-ev{width:100%;padding:12px 14px;border-radius:var(--erad,14px);background:var(--evbg,rgba(255,255,255,.06));border:1px solid var(--cbd);opacity:0;animation:n4up .9s cubic-bezier(.2,.8,.2,1) 1.55s forwards}
.c4-ev p{margin:0}
.c4-et{font:600 10px var(--fb);letter-spacing:.3em;text-transform:uppercase;color:var(--cacc)}
.c4-ed{margin-top:4px!important;font:600 clamp(16px,4.4vw,19px)/1.3 var(--fd);color:var(--cink)}
.c4-ei{margin-top:2px!important;font:500 13px/1.4 var(--fb);color:var(--cmut)}
.c4-el{display:block;width:44px;height:1px;margin:8px auto;background:var(--cgold);opacity:.7}
.c4-vn{font:500 13px/1.45 var(--fb);color:var(--cmut)}
@keyframes n4up{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
.n4 .open-btn{position:relative;overflow:hidden;margin-top:4px;width:min(100%,250px);border-radius:999px;background:var(--cbtn);color:var(--cbtnk,#fff);font:700 12px var(--fb);letter-spacing:.2em;box-shadow:0 14px 26px -12px var(--cbsh,rgba(0,0,0,.6));opacity:0;animation:n4up .8s cubic-bezier(.2,.8,.2,1) 1.8s forwards}
.n4 .open-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translate3d(-120%,0,0);animation:c4shine 4.5s ease 2.8s infinite}
.n4 .open-btn::after{border-radius:999px;border-color:var(--cgold)}
.n4 .open-btn span{position:relative}
/* opening (every design): the card lifts away, each design adds its own effect */
.n4.opening #intro .c4{animation:c4out 1.1s cubic-bezier(.6,0,.3,1) .1s both}
@keyframes c4out{from{opacity:1;transform:none}to{opacity:0;transform:translate3d(0,-34px,0) scale(1.06)}}
.n4.opening #intro{transition:opacity .75s ease 1.1s;opacity:0}
/* the second page zooms gently into view as the first page fades */
.n4.opening .hero .ss{animation:n4hin 2.2s cubic-bezier(.2,.8,.2,1) .6s both}
@keyframes n4hin{from{transform:scale(1.22);opacity:.4}to{transform:none;opacity:1}}
.n4.opening .hero-in{animation:n4hin2 1.6s cubic-bezier(.2,.8,.2,1) 1s both}
@keyframes n4hin2{from{opacity:0;transform:translate3d(0,30px,0)}to{opacity:1;transform:none}}

/* ---- second page: names letter by letter ---- */
.n4nm .c4-c{animation:none;opacity:0;transform:translate3d(0,.5em,0) rotate(8deg)}
.is-open .n4nm .c4-c{animation:c4ch .7s cubic-bezier(.2,.9,.3,1.3) forwards;animation-delay:calc(.9s + var(--c) * var(--st,.055s))}
.n4nm .amp{display:inline-block;opacity:0;transform:scale(.4)}
.is-open .n4nm .amp{animation:c4ch .7s cubic-bezier(.2,.9,.3,1.5) 1.3s forwards}
.n4 .hero .wgm{opacity:0;transform:translate3d(0,12px,0);transition:opacity 1s .5s,transform 1s .5s}
.n4.is-open .hero .wgm{opacity:1;transform:none}
.n4 .quote{transition-delay:1.9s}
/* pause the second page's effects while it is scrolled out of view */
.n4.hz .hero *,.n4.hz .hero *::before,.n4.hz .hero *::after{animation-play-state:paused!important}

/* ---- photo gallery: photos turn in one after another and catch the light ---- */
.n4 .gl .gi{position:relative;border:3px solid var(--gold);border-radius:12px;box-shadow:0 18px 30px -18px rgba(0,0,0,.6);opacity:0;transform:perspective(800px) rotateY(-65deg) scale(.86);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),opacity .9s ease;transition-delay:var(--d,0s)}
.n4 .gl .gi:nth-child(2n){transform:perspective(800px) rotateY(65deg) scale(.86)}
.n4 .gl .gi.in{opacity:1;transform:none}
.n4 .gi::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);transform:translate3d(-130%,0,0)}
.n4 .gi.in::after{animation:c4shine 8s ease calc(var(--d,0s) + 1.2s) infinite}
.n4 .gi img{transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.n4 .gi:hover img{transform:scale(1.08)}
.n4 .pfo{animation:none}

/* ---- shared particles ---- */
.n4-dust{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.n4-dust.h{position:absolute;z-index:2}
.n4-dt{position:absolute;left:calc(5% + var(--q) * 12%);width:5px;height:5px;border-radius:50%;background:radial-gradient(circle,#FFF4C8,var(--gold) 60%,transparent 72%);opacity:0;will-change:transform,opacity;animation:n4float calc(7s + var(--q) * .7s) ease-in-out infinite;animation-delay:calc(var(--q) * -1.3s)}
.n4-dt:nth-child(3n){width:3px;height:3px}.n4-dt:nth-child(4n){width:7px;height:7px}
.n4-dt:nth-child(1){top:18%}.n4-dt:nth-child(2){top:62%}.n4-dt:nth-child(3){top:34%}.n4-dt:nth-child(4){top:78%}.n4-dt:nth-child(5){top:12%}.n4-dt:nth-child(6){top:50%}.n4-dt:nth-child(7){top:86%}.n4-dt:nth-child(8){top:26%}
@keyframes n4float{0%,100%{opacity:0;transform:translate3d(0,0,0)}30%,70%{opacity:.9}50%{transform:translate3d(14px,-40px,0)}}
.n4-dust.up .n4-dt{top:auto;bottom:-10px;animation:n4rise calc(6s + var(--q) * .8s) linear infinite;animation-delay:calc(var(--q) * -1.1s)}
@keyframes n4rise{0%{opacity:0;transform:translate3d(0,0,0)}15%{opacity:1}100%{opacity:0;transform:translate3d(30px,-75vh,0)}}
.n4-dust.bk .n4-dt{width:34px;height:auto;aspect-ratio:1;background:url(art/n4/bokeh.webp) center/contain no-repeat;animation-duration:calc(9s + var(--q) * 1s)}
.n4-dust.bk .n4-dt:nth-child(2n){width:22px}.n4-dust.bk .n4-dt:nth-child(3n){width:46px}
.n4-pts{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.n4-pt{position:absolute;top:-30px;left:calc(4% + var(--q) * 12.5%);width:16px;height:19px;color:var(--pcol,#E8506A);will-change:transform;animation:lfall calc(10s + var(--q) * 1.3s) linear infinite;animation-delay:calc(var(--q) * -1.9s)}
.n4-pt:nth-child(2n){width:12px;height:15px;animation-name:lfall2;color:var(--pcol2,#F6A9C0)}
.n4-pt span{position:absolute;inset:0;animation:ltum calc(3s + var(--q) * .4s) ease-in-out infinite}
.n4-pt svg{width:100%;height:100%;display:block}
.n4-bbs{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.n4-bbs.h{position:absolute}
.n4-bb{position:absolute;bottom:-20px;left:calc(6% + var(--q) * 9.4%);width:10px;height:10px;border-radius:50%;border:1.5px solid rgba(255,248,224,.8);background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.9) 0 18%,transparent 24%);will-change:transform,opacity;animation:n4bub calc(6s + var(--q) * .6s) linear infinite;animation-delay:calc(var(--q) * -.9s)}
.n4-bb:nth-child(2n){width:6px;height:6px}.n4-bb:nth-child(3n){width:14px;height:14px}
@keyframes n4bub{0%{opacity:0;transform:translate3d(0,0,0)}10%{opacity:1}50%{transform:translate3d(10px,-50vh,0)}90%{opacity:.8}100%{opacity:0;transform:translate3d(-6px,-104vh,0)}}
/* flames (diya, lamp, candles) */
.n4-fl{position:absolute;width:var(--fw,14px);aspect-ratio:.57;background:url(art/n4/flame.webp) center bottom/contain no-repeat;transform-origin:50% 90%;will-change:transform;animation:n4flk 1.6s ease-in-out infinite alternate;animation-delay:calc(var(--q,0) * -.37s)}
.n4-fl:nth-child(2n){animation-duration:1.25s}
@keyframes n4flk{0%{transform:scale(1,1) rotate(-2deg)}35%{transform:scale(.92,1.08) rotate(2deg)}70%{transform:scale(1.05,.95) rotate(-1deg)}100%{transform:scale(.96,1.06) rotate(1.5deg)}}
/* ---- gold line-art emblems: drawn stroke by stroke, then they float gently ---- */
.c4-em{margin:-2px 0 -2px;animation:n4bob 5s ease-in-out 3s infinite}
@keyframes n4bob{0%,100%{transform:none}50%{transform:translate3d(0,-5px,0)}}
.c4-e{position:relative;display:block;width:var(--ew,150px)}
.la{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 0 5px var(--glow,rgba(233,190,110,.5)))}
.la .lp{stroke-dasharray:1;stroke-dashoffset:1;animation:ladraw 2.6s cubic-bezier(.4,0,.2,1) .25s forwards}
@keyframes ladraw{to{stroke-dashoffset:0}}
.la circle.lp{animation-delay:1.2s}
.c4-e>b{position:absolute;left:0;right:0;top:50%;transform:translate3d(0,-50%,0);font:500 clamp(24px,7vw,30px)/1 var(--fs);color:var(--cgold);letter-spacing:.04em;opacity:0;animation:fadein 1s 1.6s forwards}
.c4-e>b i{font-style:italic;margin:0 .12em;font-size:.7em}
/* ornate gold frame around the screen (Royal Mandap, Floral Grace) */
.c4-fr{position:fixed;inset:12px;z-index:1;pointer-events:none;border:1px solid var(--frc,rgba(217,178,90,.55));color:var(--cgold);opacity:0;animation:fadein 1.2s .2s forwards}
.c4-fr::after{content:"";position:absolute;inset:6px;border:1px solid var(--frc,rgba(217,178,90,.35))}
.c4-fr>i{position:absolute;width:clamp(56px,16vw,92px);aspect-ratio:1;transition:transform 1.1s cubic-bezier(.6,0,.3,1)}
.c4-fr>i svg{display:block;width:100%;height:100%}
.c4-fr .tl{left:-6px;top:-6px}.c4-fr .tr{right:-6px;top:-6px;transform:scaleX(-1)}.c4-fr .bl{left:-6px;bottom:-6px;transform:scaleY(-1)}.c4-fr .br{right:-6px;bottom:-6px;transform:scale(-1)}
.n4.opening #intro .c4-fr{animation:c4frout 1.2s cubic-bezier(.6,0,.3,1) both}
@keyframes c4frout{from{opacity:1;transform:none}to{opacity:0;transform:scale(1.12)}}
.c4-hf{position:absolute;inset:14px;z-index:2;pointer-events:none;border:1px solid rgba(233,206,140,.6);opacity:0;transform:scale(1.04);transition:opacity 1.2s .6s,transform 1.4s cubic-bezier(.2,.8,.2,1) .6s}
.c4-hf::after{content:"";position:absolute;inset:6px;border:1px solid rgba(233,206,140,.35)}
.is-open .c4-hf{opacity:1;transform:none}
/* floating hearts */
.n4-hts{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.n4-hts.h{position:absolute;z-index:2}
.n4-ht{position:absolute;bottom:-30px;left:calc(6% + var(--q) * 14%);width:18px;aspect-ratio:1.1;background:var(--htc,#E8506A);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 21C5 16 1 12 1 7a5.5 5.5 0 0 1 11-1.5A5.5 5.5 0 0 1 23 7c0 5-4 9-11 14z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 21C5 16 1 12 1 7a5.5 5.5 0 0 1 11-1.5A5.5 5.5 0 0 1 23 7c0 5-4 9-11 14z'/%3E%3C/svg%3E") center/contain no-repeat;opacity:0;will-change:transform,opacity;animation:n4bub calc(8s + var(--q) * .9s) linear infinite;animation-delay:calc(var(--q) * -1.4s)}
.n4-ht:nth-child(2n){width:12px;background:var(--htc2,#F6A9C0)}.n4-ht:nth-child(3n){width:24px}

/* ---------------------------------------------------------------- DIYA */
.d-diya{--fs:"Cormorant Garamond",Georgia,serif;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cinzel",Georgia,serif}
.d-diya .hero{background:#2A0A0E}
.d-diya .ss{z-index:0}.d-diya .hveil{z-index:1;background:linear-gradient(180deg,rgba(42,10,14,.5) 0,rgba(42,10,14,.05) 22%,rgba(42,10,14,.3) 36%,rgba(42,10,14,.84) 52%,rgba(42,10,14,.96) 100%)}
.d-diya .hero-in{z-index:3}
.d-diya .hero .nm{color:#FFE7B0}.d-diya .nm .amp{color:#E8B54A}
.d-diya .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-diya .cdu .rp{stroke:#E8B54A}.d-diya .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-diya .pfo{transform:none;border:2px solid var(--gold);border-radius:8px}.d-diya .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:12px}
.d-diya .pc:hover .pfo{transform:none}.d-diya .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-diya .pfi{border-radius:6px}
.d-diya .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-diya .h2.scr,.d-diya .ty{font-family:var(--fs)}
.d-diya .cillu{color:var(--acc)}
.d-diya .strip{background:linear-gradient(90deg,#5A0E18,#8A1A24,#5A0E18);color:#fff}.d-diya .strip i{fill:#E8B54A}
.d-diya .when{background:linear-gradient(180deg,#5A0E18,#2A0A0E)}.d-diya .wave{fill:#5A0E18}.d-diya .wave.b{fill:#2A0A0E}
.d-diya .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-diya .btn.w{color:#5A0E18}
.d-diya .foot::before{background:linear-gradient(180deg,rgba(42,10,14,.42),rgba(90,14,24,.9))}
.d-diya .ft-n span{color:#E8B54A}
.d-diya{--cink:#FFF1DC;--cmut:#E6C6A8;--cacc:#F2A541;--cgold:#E8B54A;--cname:#FFE7B0;--cbg:linear-gradient(180deg,rgba(90,14,24,.72),rgba(42,10,14,.82));--cbd:rgba(232,181,74,.45);--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#3A1410;--evbg:rgba(0,0,0,.22);--pring:rgba(232,181,74,.14);--ew:190px;--glow:rgba(255,190,90,.7)}

.d-diya .c4-bg{background:radial-gradient(ellipse at 50% 30%,#7A1424,#3A0A12 55%,#1E0508)}
.dy-rays{position:fixed;left:50%;top:30%;z-index:0;width:180vmax;height:180vmax;margin:-90vmax 0 0 -90vmax;pointer-events:none;background:repeating-conic-gradient(from 0deg,rgba(255,200,110,.09) 0 6deg,transparent 6deg 15deg);-webkit-mask:radial-gradient(circle,#000 0,transparent 60%);mask:radial-gradient(circle,#000 0,transparent 60%);will-change:transform;animation:dyspin 60s linear infinite}
@keyframes dyspin{to{transform:rotate(360deg)}}
.e-diya .n4-fl{left:78.6%;top:12%;--fw:15%;margin-left:-7.5%;opacity:0;animation:fadein .8s 2.4s forwards,n4flk 1.6s ease-in-out 2.4s infinite alternate}
.e-diya::before{content:"";position:absolute;left:82%;top:30%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:radial-gradient(circle,rgba(255,190,90,.55),transparent 65%);opacity:0;animation:fadein 1s 2.4s forwards}
.d-diya .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-diya .hero .nm{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.d-diya .hero .nm .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-diya .cdu{background:radial-gradient(circle at 50% 35%,rgba(122,20,36,.75),rgba(42,10,14,.85));box-shadow:inset 0 0 0 1px rgba(232,181,74,.6),0 14px 26px -14px #000}
.d-diya .cdu b{color:#FFE7B0}.d-diya .cdu span{color:#F2A541}

.d-diya.opening #intro .e-diya .n4-fl{animation:dyflare 1.5s cubic-bezier(.5,0,.3,1) both}
@keyframes dyflare{0%{opacity:1;transform:none}100%{opacity:1;transform:scale(30)}}
.d-diya.opening #intro .dy-rays{animation:dyrays 1.8s cubic-bezier(.4,0,.2,1) both}
@keyframes dyrays{from{transform:none}to{transform:rotate(80deg) scale(1.7)}}
.d-diya.opening #intro .c4{animation:c4out 1.1s cubic-bezier(.6,0,.3,1) .35s both}

/* ---------------------------------------------------------------- MANDAP */
.d-mandap{--fs:"Cormorant Garamond",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Marcellus",Georgia,serif}
.d-mandap .hero{background:#3A0610}
.d-mandap .ss{z-index:0}.d-mandap .hveil{z-index:1;background:linear-gradient(180deg,rgba(58,6,16,.5) 0,rgba(58,6,16,.05) 22%,rgba(58,6,16,.3) 36%,rgba(58,6,16,.84) 52%,rgba(58,6,16,.96) 100%)}
.d-mandap .hero-in{z-index:3}
.d-mandap .hero .nm{color:#FFE7B0}.d-mandap .nm .amp{color:#E8B54A}
.d-mandap .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-mandap .cdu .rp{stroke:#E8B54A}.d-mandap .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-mandap .pfo{transform:none;border:2px solid var(--gold);border-radius:8px}.d-mandap .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:12px}
.d-mandap .pc:hover .pfo{transform:none}.d-mandap .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-mandap .pfi{border-radius:6px}
.d-mandap .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-mandap .h2.scr,.d-mandap .ty{font-family:var(--fs)}
.d-mandap .cillu{color:var(--acc)}
.d-mandap .strip{background:linear-gradient(90deg,#6E0A1C,#9E1430,#6E0A1C);color:#fff}.d-mandap .strip i{fill:#E8B54A}
.d-mandap .when{background:linear-gradient(180deg,#6E0A1C,#3A0610)}.d-mandap .wave{fill:#6E0A1C}.d-mandap .wave.b{fill:#3A0610}
.d-mandap .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-mandap .btn.w{color:#6E0A1C}
.d-mandap .foot::before{background:linear-gradient(180deg,rgba(58,6,16,.42),rgba(110,10,28,.9))}
.d-mandap .ft-n span{color:#E8B54A}
.d-mandap{--cink:#FFF1DC;--cmut:#E9CFA8;--cacc:#E8B54A;--cgold:#E8B54A;--cname:#FFE7B0;--cbg:linear-gradient(180deg,rgba(120,12,30,.6),rgba(60,6,16,.78));--cbd:rgba(232,181,74,.5);--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#4A0A16;--evbg:rgba(0,0,0,.2);--pring:rgba(232,181,74,.14);--ew:160px;--pcol:#F2A541;--pcol2:#E8506A}

.d-mandap .c4-bg{background:radial-gradient(circle,rgba(232,181,74,.14) 1.2px,transparent 1.8px) 0 0/26px 26px,radial-gradient(ellipse at 50% 30%,#9E1430,#5A0816 55%,#2A0308)}
.d-mandap .c4{border-radius:160px 160px 18px 18px;padding-top:28px}
.d-mandap .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-mandap .hero .nm{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.d-mandap .hero .nm .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-mandap .cdu{border-radius:999px 999px 10px 10px;aspect-ratio:.82;background:rgba(60,6,16,.6);box-shadow:inset 0 0 0 1px rgba(232,181,74,.6)}
.d-mandap .cdu svg{display:none}.d-mandap .cdu b{color:#FFE7B0}.d-mandap .cdu span{color:#E8B54A}

.d-mandap.opening #intro .c4-em{animation:mdzoom 1.3s cubic-bezier(.6,0,.3,1) both}
@keyframes mdzoom{from{opacity:1;transform:none}to{opacity:0;transform:scale(3.4)}}
.d-mandap.opening #intro .c4{animation:mdcard 1.1s cubic-bezier(.6,0,.3,1) .15s both}
@keyframes mdcard{from{opacity:1;transform:none}to{opacity:0;transform:scale(.86)}}

/* ---------------------------------------------------------------- PEACOCK */
.d-peacock{--fs:"Cinzel",Georgia,serif;--fb:"Raleway",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-peacock .hero{background:#06323A}
.d-peacock .ss{z-index:0}.d-peacock .hveil{z-index:1;background:linear-gradient(180deg,rgba(6,50,58,.5) 0,rgba(6,50,58,.05) 22%,rgba(6,50,58,.3) 36%,rgba(6,50,58,.84) 52%,rgba(6,50,58,.96) 100%)}
.d-peacock .hero-in{z-index:3}
.d-peacock .hero .nm{color:#F6E7B8}.d-peacock .nm .amp{color:#D9B25A}
.d-peacock .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-peacock .cdu .rp{stroke:#D9B25A}.d-peacock .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-peacock .pfo{transform:none;border:2px solid var(--gold);border-radius:8px}.d-peacock .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:12px}
.d-peacock .pc:hover .pfo{transform:none}.d-peacock .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-peacock .pfi{border-radius:6px}
.d-peacock .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-peacock .h2.scr,.d-peacock .ty{font-family:var(--fs)}
.d-peacock .cillu{color:var(--acc)}
.d-peacock .strip{background:linear-gradient(90deg,#0B4A52,#1E8C8A,#0B4A52);color:#fff}.d-peacock .strip i{fill:#D9B25A}
.d-peacock .when{background:linear-gradient(180deg,#0B4A52,#06323A)}.d-peacock .wave{fill:#0B4A52}.d-peacock .wave.b{fill:#06323A}
.d-peacock .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-peacock .btn.w{color:#0B4A52}
.d-peacock .foot::before{background:linear-gradient(180deg,rgba(6,50,58,.42),rgba(11,74,82,.9))}
.d-peacock .ft-n span{color:#D9B25A}
.d-peacock{--cink:#EAF6F2;--cmut:#A9CFC8;--cacc:#D9B25A;--cgold:#D9B25A;--cname:#F6E7B8;--cbg:linear-gradient(180deg,rgba(6,60,70,.6),rgba(4,30,36,.82));--cbd:rgba(217,178,90,.45);--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#06323A;--evbg:rgba(0,0,0,.2);--pring:rgba(217,178,90,.14);--ew:150px;--glow:rgba(120,220,210,.45)}

.d-peacock .c4-bg{background:radial-gradient(ellipse at 50% 30%,#0E5A66,#06323A 55%,#03181C)}
.pk-geo{position:fixed;left:50%;top:40%;z-index:0;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;pointer-events:none;opacity:.5;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg fill='none' stroke='%23D9B25A' stroke-opacity='.28' stroke-width='1'%3E%3Cpath d='M60 0L120 60L60 120L0 60Z'/%3E%3Cpath d='M60 20L100 60L60 100L20 60Z'/%3E%3Ccircle cx='60' cy='60' r='12'/%3E%3C/g%3E%3C/svg%3E") 0 0/120px 120px;-webkit-mask:radial-gradient(circle,#000 0,transparent 55%);mask:radial-gradient(circle,#000 0,transparent 55%);will-change:transform;animation:dyspin 90s linear infinite}
.d-peacock .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-peacock .c4-em{transform-origin:50% 100%}
.d-peacock .hero .nm{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.d-peacock .hero .nm .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-peacock .cdu{background:radial-gradient(circle at 50% 35%,rgba(14,90,102,.75),rgba(4,30,36,.85))}
.d-peacock .cdu b{color:#F6E7B8}.d-peacock .cdu span{color:#D9B25A}

.d-peacock.opening #intro .c4-em{animation:pkfan 1.3s cubic-bezier(.6,0,.3,1) both}
@keyframes pkfan{from{opacity:1;transform:none}to{opacity:0;transform:rotate(-35deg) scale(4)}}
.d-peacock.opening #intro .c4{animation:pkcard 1.2s cubic-bezier(.6,0,.3,1) .1s both}
@keyframes pkcard{from{opacity:1;transform:none}to{opacity:0;transform:translate3d(30vw,0,0) rotate(10deg)}}
.d-peacock.opening #intro .pk-geo{animation:dyspin 6s linear both}

/* ---------------------------------------------------------------- ROSE */
.d-rose{--fs:"Cormorant Garamond",Georgia,serif;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-rose .hero{background:#4A0E1E}
.d-rose .ss{z-index:0}.d-rose .hveil{z-index:1;background:linear-gradient(180deg,rgba(74,14,30,.5) 0,rgba(74,14,30,.05) 22%,rgba(74,14,30,.3) 36%,rgba(74,14,30,.84) 52%,rgba(74,14,30,.96) 100%)}
.d-rose .hero-in{z-index:3}
.d-rose .hero .nm{color:#FFE4EC}.d-rose .nm .amp{color:#F8BBD0}
.d-rose .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-rose .cdu .rp{stroke:#F8BBD0}.d-rose .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-rose .pfo{transform:none;border:2px solid var(--gold);border-radius:14px}.d-rose .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:18px}
.d-rose .pc:hover .pfo{transform:none}.d-rose .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-rose .pfi{border-radius:12px}
.d-rose .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-rose .h2.scr,.d-rose .ty{font-family:var(--fs)}
.d-rose .cillu{color:var(--acc)}
.d-rose .strip{background:linear-gradient(90deg,#B0284E,#E91E63,#B0284E);color:#fff}.d-rose .strip i{fill:#F8BBD0}
.d-rose .when{background:linear-gradient(180deg,#B0284E,#6E1430)}.d-rose .wave{fill:#B0284E}.d-rose .wave.b{fill:#6E1430}
.d-rose .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-rose .btn.w{color:#B0284E}
.d-rose .foot::before{background:linear-gradient(180deg,rgba(74,14,30,.42),rgba(176,40,78,.9))}
.d-rose .ft-n span{color:#F8BBD0}
.d-rose{--cink:#4A1424;--cmut:#8A6A72;--cacc:#C2185B;--cgold:#E2A3B4;--cname:#B0284E;--cbg:rgba(255,255,255,.72);--cbd:rgba(194,24,91,.18);--cbtn:linear-gradient(120deg,#C2185B,#F06292);--cbtnk:#fff;--cbsh:rgba(194,24,91,.6);--evbg:rgba(255,240,244,.9);--pring:rgba(255,255,255,.9);--ew:140px;--glow:rgba(194,24,91,.25);--htc:#F48FB1;--htc2:#F8BBD0;--pcol:#E91E63;--pcol2:#F48FB1;--csh:0 30px 60px -30px rgba(176,40,78,.45)}

.d-rose #intro{color:#4A1424}
.d-rose .c4-bg{background:radial-gradient(ellipse at 50% 20%,#FFFFFF,#FCE4EC 45%,#F8BBD0)}
.d-rose .la{--g:1}
.d-rose .la-rose path{stroke:#C2185B}
.d-rose .c4-ph{color:#E91E63}
.d-rose .hero .nm{color:#FFE4EC;text-shadow:0 0 30px rgba(233,30,99,.55),0 4px 18px rgba(0,0,0,.4)}
.d-rose .nm .amp{color:#F8BBD0}
.d-rose .cdu{background:radial-gradient(circle at 35% 30%,#FFFFFF,#F8BBD0 70%);box-shadow:0 10px 20px -10px rgba(176,40,78,.7)}
.d-rose .cdu b{color:#B0284E}.d-rose .cdu span{color:#8A3A52}.d-rose .cdu .rp{stroke:#C2185B}.d-rose .cdu .rt{stroke:rgba(176,40,78,.18)}
.d-rose .wgm{color:#F8BBD0}

.d-rose.opening #intro .c4-em{animation:rozoom 1.4s cubic-bezier(.6,0,.3,1) both}
@keyframes rozoom{0%{opacity:1;transform:none}70%{opacity:1}100%{opacity:0;transform:scale(7)}}
.d-rose.opening #intro .c4{animation:roflip 1.1s cubic-bezier(.6,0,.3,1) .1s both}
@keyframes roflip{from{opacity:1;transform:perspective(900px)}to{opacity:0;transform:perspective(900px) rotateY(95deg)}}

/* ---------------------------------------------------------------- MANDALA */
.d-mandala{--fs:"Cinzel",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-mandala .hero{background:#3A1408}
.d-mandala .ss{z-index:0}.d-mandala .hveil{z-index:1;background:linear-gradient(180deg,rgba(58,20,8,.5) 0,rgba(58,20,8,.05) 22%,rgba(58,20,8,.3) 36%,rgba(58,20,8,.84) 52%,rgba(58,20,8,.96) 100%)}
.d-mandala .hero-in{z-index:3}
.d-mandala .hero .nm{color:#FFE9CC}.d-mandala .nm .amp{color:#F2C38A}
.d-mandala .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-mandala .cdu .rp{stroke:#F2C38A}.d-mandala .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-mandala .pfo{transform:none;border:2px solid var(--gold);border-radius:10px}.d-mandala .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:14px}
.d-mandala .pc:hover .pfo{transform:none}.d-mandala .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-mandala .pfi{border-radius:8px}
.d-mandala .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-mandala .h2.scr,.d-mandala .ty{font-family:var(--fs)}
.d-mandala .cillu{color:var(--acc)}
.d-mandala .strip{background:linear-gradient(90deg,#8A3A18,#B4532A,#8A3A18);color:#fff}.d-mandala .strip i{fill:#F2C38A}
.d-mandala .when{background:linear-gradient(180deg,#8A3A18,#4A1E0C)}.d-mandala .wave{fill:#8A3A18}.d-mandala .wave.b{fill:#4A1E0C}
.d-mandala .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-mandala .btn.w{color:#8A3A18}
.d-mandala .foot::before{background:linear-gradient(180deg,rgba(58,20,8,.42),rgba(138,58,24,.9))}
.d-mandala .ft-n span{color:#F2C38A}
.d-mandala{--cink:#3A1E10;--cmut:#7E6050;--cacc:#B4532A;--cgold:#C9962E;--cname:#8A3A18;--cbg:rgba(255,252,246,.85);--cbd:rgba(201,150,46,.4);--cbtn:linear-gradient(120deg,#B4532A,#D9A443);--cbtnk:#fff;--cbsh:rgba(180,83,42,.55);--evbg:rgba(253,243,230,.9);--pring:rgba(255,255,255,.9);--ew:150px;--glow:rgba(201,150,46,.3);--pcol:#E8812A;--pcol2:#F2C38A;--csh:0 30px 60px -30px rgba(120,60,20,.45)}

.d-mandala #intro{color:#3A1E10}
.d-mandala .c4-bg{background:radial-gradient(ellipse at 50% 25%,#FFFBF4,#FCEBD6 55%,#F4D3AE)}
.mdx{display:block;width:100%;height:auto;color:#C9962E}
.mdx .mdl{stroke-dasharray:1;stroke-dashoffset:1;animation:ladraw 3s cubic-bezier(.4,0,.2,1) .2s forwards}
.e-mandala .mdx{animation:dyspin 40s linear 3s infinite}
.e-mandala>b{color:#8A3A18;font-size:clamp(17px,4.8vw,20px)}
.md-big{position:fixed;left:50%;top:42%;z-index:0;width:150vmin;margin:-75vmin 0 0 -75vmin;opacity:.12;pointer-events:none;will-change:transform;animation:dyspin 120s linear infinite}
.md-big .mdl{animation:none;stroke-dashoffset:0}
.md-big.h{position:absolute;top:auto;bottom:12%;margin:0 0 0 -75vmin;opacity:.16;z-index:2}
.md-big.h .mdx{color:#F2C38A}
.d-mandala .hero .nm{color:#FFE9CC}
.d-mandala .cdu{background:radial-gradient(circle at 50% 35%,rgba(138,58,24,.7),rgba(58,20,8,.85))}
.d-mandala .cdu b{color:#FFE9CC}.d-mandala .cdu span{color:#F2C38A}

.d-mandala.opening #intro .md-big{animation:mdbig 1.8s cubic-bezier(.5,0,.3,1) both}
@keyframes mdbig{from{opacity:.12;transform:none}to{opacity:.45;transform:scale(2.6) rotate(120deg)}}
.d-mandala.opening #intro .c4-em{animation:mdemb 1.3s cubic-bezier(.6,0,.3,1) both}
@keyframes mdemb{from{opacity:1;transform:none}to{opacity:0;transform:scale(4.5) rotate(90deg)}}
.d-mandala.opening #intro .c4{animation:mlcard 1.1s cubic-bezier(.6,0,.3,1) .2s both}
@keyframes mlcard{from{opacity:1;transform:none}to{opacity:0;transform:scale(.7) rotate(-8deg)}}

/* ---------------------------------------------------------------- CHAMP */
.d-champ{--fs:"Italiana",Georgia,serif;--fb:"Montserrat",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-champ .hero{background:#2A1E16}
.d-champ .ss{z-index:0}.d-champ .hveil{z-index:1;background:linear-gradient(180deg,rgba(42,30,22,.5) 0,rgba(42,30,22,.05) 22%,rgba(42,30,22,.3) 36%,rgba(42,30,22,.84) 52%,rgba(42,30,22,.96) 100%)}
.d-champ .hero-in{z-index:3}
.d-champ .hero .nm{color:#FFF6E6}.d-champ .nm .amp{color:#F3D9A8}
.d-champ .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-champ .cdu .rp{stroke:#F3D9A8}.d-champ .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-champ .pfo{transform:none;border:2px solid var(--gold);border-radius:12px}.d-champ .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:16px}
.d-champ .pc:hover .pfo{transform:none}.d-champ .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-champ .pfi{border-radius:10px}
.d-champ .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-champ .h2.scr,.d-champ .ty{font-family:var(--fs)}
.d-champ .cillu{color:var(--acc)}
.d-champ .strip{background:linear-gradient(90deg,#8A6A4A,#B08A5A,#8A6A4A);color:#fff}.d-champ .strip i{fill:#F3D9A8}
.d-champ .when{background:linear-gradient(180deg,#8A6A4A,#4A3626)}.d-champ .wave{fill:#8A6A4A}.d-champ .wave.b{fill:#4A3626}
.d-champ .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-champ .btn.w{color:#8A6A4A}
.d-champ .foot::before{background:linear-gradient(180deg,rgba(42,30,22,.42),rgba(138,106,74,.9))}
.d-champ .ft-n span{color:#F3D9A8}
.d-champ{--cink:#3A2A22;--cmut:#86766A;--cacc:#B08A4A;--cgold:#C9A46A;--cname:#8A6A3A;--cbg:rgba(255,252,248,.78);--cbd:rgba(201,164,106,.4);--cbtn:linear-gradient(120deg,#C9A46A,#F3D9A8 50%,#C9A46A);--cbtnk:#3A2A22;--cbsh:rgba(150,110,60,.55);--evbg:rgba(253,246,238,.9);--pring:rgba(255,255,255,.9);--ew:170px;--glow:rgba(201,164,106,.4);--csh:0 30px 60px -30px rgba(120,90,50,.45)}

.d-champ #intro{color:#3A2A22}
.d-champ .c4-bg{background:radial-gradient(ellipse at 50% 20%,#FFFDF9,#F8E9DA 50%,#EBCDB4)}
.d-champ .n4-bb{border-color:rgba(201,164,106,.8);background:radial-gradient(circle at 32% 30%,rgba(255,255,255,1) 0 18%,rgba(255,240,210,.4) 24%,transparent 60%)}
.c4-tw{position:absolute;left:50%;top:14%;width:26px;height:26px;margin-left:-13px;background:#FFF6D8;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);opacity:0;animation:chtw 2.4s ease-in-out 2.6s infinite}
@keyframes chtw{0%,100%{opacity:0;transform:scale(.2) rotate(0)}40%{opacity:1;transform:scale(1.2) rotate(45deg)}}
.d-champ .hero .nm{color:#FFF6E6}
.d-champ .cdu{background:radial-gradient(circle at 35% 30%,rgba(255,250,240,.35),rgba(120,90,50,.45))}
.d-champ .cdu b{color:#FFF6E6}.d-champ .cdu span{color:#F3D9A8}
.d-champ .nm .amp,.d-champ .c4-e b{font-family:"Cormorant Garamond",Georgia,serif;font-style:normal}

.d-champ.opening #intro .c4-tw{animation:chflash 1.4s cubic-bezier(.5,0,.3,1) both}
@keyframes chflash{0%{opacity:1;transform:none}100%{opacity:1;transform:scale(70) rotate(90deg)}}
.d-champ.opening #intro .c4{animation:chrise 1.2s cubic-bezier(.6,0,.3,1) .1s both}
@keyframes chrise{from{opacity:1;transform:none}to{opacity:0;transform:translate3d(0,-40vh,0) scale(.9)}}
.d-champ.opening #intro .n4-bb{animation-duration:1.6s}

/* ---------------------------------------------------------------- FLORAL */
.d-floral{--fs:"Cormorant Garamond",Georgia,serif;--fb:"Mulish",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-floral .hero{background:#3A2430}
.d-floral .ss{z-index:0}.d-floral .hveil{z-index:1;background:linear-gradient(180deg,rgba(58,36,48,.5) 0,rgba(58,36,48,.05) 22%,rgba(58,36,48,.3) 36%,rgba(58,36,48,.84) 52%,rgba(58,36,48,.96) 100%)}
.d-floral .hero-in{z-index:3}
.d-floral .hero .nm{color:#FFF4F6}.d-floral .nm .amp{color:#F2D6DE}
.d-floral .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-floral .cdu .rp{stroke:#F2D6DE}.d-floral .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-floral .pfo{transform:none;border:2px solid var(--gold);border-radius:12px}.d-floral .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:16px}
.d-floral .pc:hover .pfo{transform:none}.d-floral .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-floral .pfi{border-radius:10px}
.d-floral .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-floral .h2.scr,.d-floral .ty{font-family:var(--fs)}
.d-floral .cillu{color:var(--acc)}
.d-floral .strip{background:linear-gradient(90deg,#8E5A6E,#B5677F,#8E5A6E);color:#fff}.d-floral .strip i{fill:#F2D6DE}
.d-floral .when{background:linear-gradient(180deg,#8E5A6E,#5A3442)}.d-floral .wave{fill:#8E5A6E}.d-floral .wave.b{fill:#5A3442}
.d-floral .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-floral .btn.w{color:#8E5A6E}
.d-floral .foot::before{background:linear-gradient(180deg,rgba(58,36,48,.42),rgba(142,90,110,.9))}
.d-floral .ft-n span{color:#F2D6DE}
.d-floral{--cink:#3A2A30;--cmut:#86727A;--cacc:#B5677F;--cgold:#C9A46A;--cname:#8E5A6E;--cbg:rgba(255,252,251,.82);--cbd:rgba(201,164,106,.4);--cbtn:linear-gradient(120deg,#B5677F,#D99AB0);--cbtnk:#fff;--cbsh:rgba(181,103,127,.55);--evbg:rgba(253,244,246,.92);--pring:rgba(255,255,255,.9);--ew:140px;--glow:rgba(201,164,106,.35);--pcol:#E8A0B8;--pcol2:#F6D5DE;--frc:rgba(201,164,106,.6);--csh:0 30px 60px -30px rgba(120,70,90,.4)}

.d-floral #intro{color:#3A2A30}
.d-floral .c4-bg{background:radial-gradient(ellipse at 50% 20%,#FFFFFF,#FBEFF1 55%,#F2DCE2)}
.e-floral>b{color:#8E5A6E}
.d-floral .hero .nm{color:#FFF4F6}
.d-floral .cdu{background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.3),rgba(142,90,110,.5))}
.d-floral .cdu b{color:#FFF4F6}.d-floral .cdu span{color:#F2D6DE}

.d-floral.opening #intro .c4-em{animation:flspin 1.3s cubic-bezier(.6,0,.3,1) both}
@keyframes flspin{from{opacity:1;transform:none}to{opacity:0;transform:scale(4) rotate(60deg)}}
.d-floral.opening #intro .c4{animation:mdcard 1.1s cubic-bezier(.6,0,.3,1) .15s both}
@keyframes mdcard{from{opacity:1;transform:none}to{opacity:0;transform:scale(.86)}}

/* ---------------------------------------------------------------- CANDLE */
.d-candle{--fs:"Playfair Display",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-candle .hero{background:#1E140E}
.d-candle .ss{z-index:0}.d-candle .hveil{z-index:1;background:linear-gradient(180deg,rgba(30,20,14,.5) 0,rgba(30,20,14,.05) 22%,rgba(30,20,14,.3) 36%,rgba(30,20,14,.84) 52%,rgba(30,20,14,.96) 100%)}
.d-candle .hero-in{z-index:3}
.d-candle .hero .nm{color:#FFE9BC}.d-candle .nm .amp{color:#E0B865}
.d-candle .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-candle .cdu .rp{stroke:#E0B865}.d-candle .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-candle .pfo{transform:none;border:2px solid var(--gold);border-radius:8px}.d-candle .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:12px}
.d-candle .pc:hover .pfo{transform:none}.d-candle .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-candle .pfi{border-radius:6px}
.d-candle .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-candle .h2.scr,.d-candle .ty{font-family:var(--fs)}
.d-candle .cillu{color:var(--acc)}
.d-candle .strip{background:linear-gradient(90deg,#3A2A1E,#5A4430,#3A2A1E);color:#fff}.d-candle .strip i{fill:#E0B865}
.d-candle .when{background:linear-gradient(180deg,#3A2A1E,#1E140E)}.d-candle .wave{fill:#3A2A1E}.d-candle .wave.b{fill:#1E140E}
.d-candle .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-candle .btn.w{color:#3A2A1E}
.d-candle .foot::before{background:linear-gradient(180deg,rgba(30,20,14,.42),rgba(58,42,30,.9))}
.d-candle .ft-n span{color:#E0B865}
.d-candle{--cink:#FFF6E6;--cmut:#D9C6A6;--cacc:#E0B865;--cgold:#E0B865;--cname:#FFE9BC;--cbg:linear-gradient(180deg,rgba(58,42,30,.6),rgba(30,20,14,.84));--cbd:rgba(224,184,101,.45);--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#2A1E14;--evbg:rgba(0,0,0,.22);--pring:rgba(224,184,101,.14);--ew:170px;--glow:rgba(255,200,110,.55)}

.d-candle .c4-bg{background:radial-gradient(ellipse at 50% 30%,#4A3424,#1E140E 60%,#0E0906)}
.e-candle .n4-fl{--fw:9%;margin-left:-4.5%;opacity:0;animation:fadein .8s 2.6s forwards,n4flk 1.6s ease-in-out 2.6s infinite alternate}
.e-candle .n4-fl:nth-child(2){left:31%;top:24%}.e-candle .n4-fl:nth-child(3){left:50%;top:6%}.e-candle .n4-fl:nth-child(4){left:69%;top:30%}
.e-candle::before{content:"";position:absolute;left:50%;top:20%;width:200px;height:140px;margin:-70px 0 0 -100px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,190,90,.35),transparent 65%);opacity:0;animation:fadein 1.2s 2.6s forwards}
.d-candle .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-candle .hero .nm{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.d-candle .hero .nm .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-candle .cdu{background:radial-gradient(circle at 50% 35%,rgba(74,52,36,.75),rgba(30,20,14,.85))}
.d-candle .cdu b{color:#FFE9BC}.d-candle .cdu span{color:#E0B865}

.d-candle.opening #intro .e-candle .n4-fl{animation:cdflare 1.5s cubic-bezier(.5,0,.3,1) both}
@keyframes cdflare{0%{opacity:1;transform:none}100%{opacity:1;transform:scale(12)}}
.d-candle.opening #intro .n4-dust .n4-dt{animation:cdbk 1.5s ease both}
@keyframes cdbk{to{opacity:1;transform:scale(3)}}
.d-candle.opening #intro .c4{animation:c4out 1.1s cubic-bezier(.6,0,.3,1) .35s both}

/* ---------------------------------------------------------------- FANOUS */
.d-fanous{--fs:"Marcellus",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-fanous .hero{background:#0B1E2A}
.d-fanous .ss{z-index:0}.d-fanous .hveil{z-index:1;background:linear-gradient(180deg,rgba(11,30,42,.5) 0,rgba(11,30,42,.05) 22%,rgba(11,30,42,.3) 36%,rgba(11,30,42,.84) 52%,rgba(11,30,42,.96) 100%)}
.d-fanous .hero-in{z-index:3}
.d-fanous .hero .nm{color:#FFE7B0}.d-fanous .nm .amp{color:#E3B866}
.d-fanous .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-fanous .cdu .rp{stroke:#E3B866}.d-fanous .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-fanous .pfo{transform:none;border:2px solid var(--gold);border-radius:10px}.d-fanous .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:14px}
.d-fanous .pc:hover .pfo{transform:none}.d-fanous .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-fanous .pfi{border-radius:8px}
.d-fanous .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-fanous .h2.scr,.d-fanous .ty{font-family:var(--fs)}
.d-fanous .cillu{color:var(--acc)}
.d-fanous .strip{background:linear-gradient(90deg,#14324A,#1E4A66,#14324A);color:#fff}.d-fanous .strip i{fill:#E3B866}
.d-fanous .when{background:linear-gradient(180deg,#14324A,#0B1E2A)}.d-fanous .wave{fill:#14324A}.d-fanous .wave.b{fill:#0B1E2A}
.d-fanous .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-fanous .btn.w{color:#14324A}
.d-fanous .foot::before{background:linear-gradient(180deg,rgba(11,30,42,.42),rgba(20,50,74,.9))}
.d-fanous .ft-n span{color:#E3B866}
.d-fanous{--cink:#F4EEDC;--cmut:#C9C2AE;--cacc:#E3B866;--cgold:#E3B866;--cname:#FFE7B0;--cbg:linear-gradient(180deg,rgba(20,50,74,.62),rgba(11,30,42,.84));--cbd:rgba(227,184,102,.45);--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#0B1E2A;--evbg:rgba(0,0,0,.22);--pring:rgba(227,184,102,.14);--ew:116px;--glow:rgba(255,200,110,.55)}

.d-fanous .c4-bg{background:radial-gradient(ellipse at 50% 30%,#1E4A66,#0B1E2A 60%,#050E14)}
.ln-light{position:fixed;left:50%;top:32%;z-index:0;width:130vmin;aspect-ratio:1;margin:-65vmin 0 0 -65vmin;pointer-events:none;background:url(art/n4/lightstars.webp) center/contain no-repeat;opacity:.55;will-change:transform;animation:dyspin 80s linear infinite}
.la-lantern .lglow{opacity:0;animation:lnglow 3s ease-in-out 2.2s infinite alternate}
@keyframes lnglow{from{opacity:.55}to{opacity:1}}
.ln-side{position:fixed;top:-6px;z-index:1;width:clamp(70px,20vw,112px);transform-origin:50% 0;will-change:transform;animation:lnsway 5s ease-in-out infinite alternate}
.ln-side.l{left:4%}.ln-side.r{right:4%;animation-delay:-2.4s;width:clamp(58px,16vw,92px);top:-24px}
.ln-side .la{filter:drop-shadow(0 0 8px rgba(255,190,90,.6))}
@keyframes lnsway{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
.ln-side .lp{animation-delay:.6s}
.d-fanous .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.ln-side.h{position:absolute;z-index:2;opacity:0;transition:opacity 1s .6s}
.is-open .ln-side.h{opacity:1}
.d-fanous .hero .nm{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.d-fanous .hero .nm .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-fanous .cdu{border-radius:999px 999px 10px 10px;aspect-ratio:.82;background:rgba(11,30,42,.6);box-shadow:inset 0 0 0 1px rgba(227,184,102,.6),0 0 18px rgba(255,190,90,.2)}
.d-fanous .cdu svg{display:none}.d-fanous .cdu b{color:#FFE7B0}.d-fanous .cdu span{color:#E3B866}

.d-fanous.opening #intro .ln-side{animation:lnup 1.3s cubic-bezier(.6,0,.3,1) both}
@keyframes lnup{from{transform:none}to{transform:translate3d(0,-115%,0)}}
.d-fanous.opening #intro .ln-light{animation:lnbig 1.8s cubic-bezier(.4,0,.2,1) both}
@keyframes lnbig{from{opacity:.55;transform:none}to{opacity:1;transform:scale(2) rotate(60deg)}}
.d-fanous.opening #intro .c4{animation:lncard 1.2s cubic-bezier(.6,0,.3,1) .1s both}
@keyframes lncard{from{opacity:1;transform:none}to{opacity:0;transform:translate3d(0,24vh,0) scale(.92)}}

/* ---------------------------------------------------------------- ARCH */
.d-arch{--fs:"Gilda Display",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Cormorant Garamond",Georgia,serif}
.d-arch .hero{background:#F4F1EC}
.d-arch .ss{z-index:0}.d-arch .hveil{z-index:1;background:linear-gradient(180deg,rgba(244,241,236,.5) 0,rgba(244,241,236,.05) 22%,rgba(244,241,236,.3) 36%,rgba(244,241,236,.84) 52%,rgba(244,241,236,.96) 100%)}
.d-arch .hero-in{z-index:3}
.d-arch .hero .nm{color:#5A3E12}.d-arch .nm .amp{color:#F6DE9A}
.d-arch .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-arch .cdu .rp{stroke:#F6DE9A}.d-arch .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-arch .pfo{transform:none;border:2px solid var(--gold);border-radius:4px}.d-arch .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:8px}
.d-arch .pc:hover .pfo{transform:none}.d-arch .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-arch .pfi{border-radius:2px}
.d-arch .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-arch .h2.scr,.d-arch .ty{font-family:var(--fs)}
.d-arch .cillu{color:var(--acc)}
.d-arch .strip{background:linear-gradient(90deg,#8A6420,#B8862E,#8A6420);color:#fff}.d-arch .strip i{fill:#F6DE9A}
.d-arch .when{background:linear-gradient(180deg,#8A6420,#5A3E12)}.d-arch .wave{fill:#8A6420}.d-arch .wave.b{fill:#5A3E12}
.d-arch .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-arch .btn.w{color:#8A6420}
.d-arch .foot::before{background:linear-gradient(180deg,rgba(244,241,236,.42),rgba(138,100,32,.9))}
.d-arch .ft-n span{color:#F6DE9A}
.d-arch{--cink:#2A2420;--cmut:#7A7268;--cacc:#B8862E;--cgold:#C9A04A;--cname:#8A6420;--cbg:transparent;--cbd:transparent;--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#2A2420;--cbsh:rgba(150,110,50,.5);--evbg:rgba(255,255,255,.72);--pring:rgba(255,255,255,.9);--csh:none}

.d-arch #intro{color:#2A2420}
.d-arch .c4-bg,.ma-bg{background:url(art/n4/marble.webp) center/cover,#F7F4EE}
.ma-bg{position:absolute;inset:0;z-index:0}
.ma-fr{position:absolute;left:50%;top:50%;z-index:2;width:min(96vw,460px);height:min(98%,calc(min(96vw,460px) * 1.62));transform:translate3d(-50%,-50%,0);pointer-events:none;overflow:hidden;background:url(art/n4/arch_top.webp) top/100% auto no-repeat,url(art/n4/arch_bot.webp) bottom/100% auto no-repeat;opacity:0;animation:fadein 1.2s .2s forwards}
.ma-fr::before{content:"";position:absolute;left:0;right:0;top:calc(min(96vw,460px) * .64);bottom:calc(min(96vw,460px) * .12);background:url(art/n4/arch_mid.webp) 0 0/100% auto repeat-y}
.ma-shine{position:absolute;inset:0;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.7) 50%,transparent 60%);-webkit-mask:url(art/n4/arch_top.webp) top/100% auto no-repeat;mask:url(art/n4/arch_top.webp) top/100% auto no-repeat;transform:translate3d(-100%,0,0);animation:c4shine 6s ease 2s infinite}
.d-arch .c4{width:min(62vw,296px);padding:calc(min(96vw,460px) * .36) 0 calc(min(96vw,460px) * .13);gap:8px;--pw:clamp(80px,23vw,106px)}
.d-arch .c4>.bsm{color:#A87830}
.d-arch .c4-c{background:linear-gradient(180deg,#B8862E,#8A5A1C);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
/* second page: photos in the arch window */
.d-arch .hero{--aw:min(86vw,400px,48vh);background:#F7F4EE;color:#2A2420}
.d-arch .ss{left:50%;right:auto;top:76px;bottom:auto;z-index:1;width:var(--aw);aspect-ratio:.638;margin-left:calc(var(--aw) / -2);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 940'%3E%3Cpath d='M74 920V334C74 214 180 194 270 134Q300 104 300 84Q300 104 330 134C420 194 526 214 526 334V920Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 940'%3E%3Cpath d='M74 920V334C74 214 180 194 270 134Q300 104 300 84Q300 104 330 134C420 194 526 214 526 334V920Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.ma-hf{position:absolute;left:50%;top:76px;z-index:2;width:var(--aw);aspect-ratio:.638;margin-left:calc(var(--aw) / -2);pointer-events:none;overflow:hidden;background:url(art/n4/arch_top.webp) top/100% auto no-repeat,url(art/n4/arch_bot.webp) bottom/100% auto no-repeat}
.ma-hf::before{content:"";position:absolute;left:0;right:0;top:calc(var(--aw) * .64);bottom:calc(var(--aw) * .1);background:url(art/n4/arch_mid.webp) 0 0/100% auto repeat-y}
.d-arch .hveil{display:none}
.d-arch .hero-in{padding:calc(var(--aw) / .638 + 96px) 0 100px}
.d-arch .wgm{color:#8A6420}
.d-arch .hero .nm{color:#5A3E12;text-shadow:none}
.d-arch .nm .amp{color:#C9A04A}
.d-arch .quote{color:#5E564C;text-shadow:none}
.d-arch .cdu{background:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1px rgba(201,160,74,.7),0 10px 20px -12px rgba(90,62,18,.5)}
.d-arch .cdu b{color:#5A3E12}.d-arch .cdu span{color:#A87830}.d-arch .cdu .rp{stroke:#C9A04A}.d-arch .cdu .rt{stroke:rgba(90,62,18,.15)}
.d-arch .cd-note{color:#5A3E12}
.d-arch .ssd i{background:rgba(42,36,32,.25)}.d-arch .ssd i.on{background:#C9A04A}
.d-arch .scroll-hint{border-color:#A87830}.d-arch .scroll-hint span{background:#A87830}
.d-arch .nav{background:rgba(255,255,255,.9);border-color:rgba(42,36,32,.12)}.d-arch .nav a{color:#2A2420}.d-arch .nav a.on,.d-arch .nav a:hover{color:#fff;background:#B8862E}
.d-arch .n4-dt{background:radial-gradient(circle,#FFF4C8,#C9A04A 60%,transparent 72%)}

.d-arch.opening #intro .ma-fr{animation:mawalk 1.5s cubic-bezier(.6,0,.3,1) both}
@keyframes mawalk{0%{opacity:1;transform:translate3d(-50%,-50%,0)}70%{opacity:1}100%{opacity:0;transform:translate3d(-50%,-50%,0) scale(3.6)}}
.d-arch.opening #intro .c4{animation:macard 1.4s cubic-bezier(.6,0,.3,1) both}
@keyframes macard{0%{opacity:1;transform:none}60%{opacity:.6}100%{opacity:0;transform:scale(3)}}

/* ---------------------------------------------------------------- ATTAR */
.d-attar{--fs:"Cormorant Garamond",Georgia,serif;--fb:"Jost",system-ui,sans-serif;--fd:"Marcellus",Georgia,serif}
.d-attar .hero{background:#2A0A16}
.d-attar .ss{z-index:0}.d-attar .hveil{z-index:1;background:linear-gradient(180deg,rgba(42,10,22,.5) 0,rgba(42,10,22,.05) 22%,rgba(42,10,22,.3) 36%,rgba(42,10,22,.84) 52%,rgba(42,10,22,.96) 100%)}
.d-attar .hero-in{z-index:3}
.d-attar .hero .nm{color:#FFE7B0}.d-attar .nm .amp{color:#E3B866}
.d-attar .cdu{-webkit-backdrop-filter:none;backdrop-filter:none}.d-attar .cdu .rp{stroke:#E3B866}.d-attar .cdu b{font-variant-numeric:lining-nums tabular-nums}
.d-attar .pfo{transform:none;border:2px solid var(--gold);border-radius:8px}.d-attar .pfo::after{transform:none;inset:-7px;border:1px solid var(--acc);border-radius:12px}
.d-attar .pc:hover .pfo{transform:none}.d-attar .pc.in .pfo{animation:tfr 1.4s cubic-bezier(.2,.8,.2,1)}
.d-attar .pfi{border-radius:6px}
.d-attar .pc h3{font:400 clamp(28px,7vw,38px)/1.15 var(--fs)}
.d-attar .h2.scr,.d-attar .ty{font-family:var(--fs)}
.d-attar .cillu{color:var(--acc)}
.d-attar .strip{background:linear-gradient(90deg,#5A0E26,#8A1A3A,#5A0E26);color:#fff}.d-attar .strip i{fill:#E3B866}
.d-attar .when{background:linear-gradient(180deg,#5A0E26,#2A0A16)}.d-attar .wave{fill:#5A0E26}.d-attar .wave.b{fill:#2A0A16}
.d-attar .evb h3{font:400 clamp(26px,6.6vw,34px)/1.2 var(--fs)}
.d-attar .btn.w{color:#5A0E26}
.d-attar .foot::before{background:linear-gradient(180deg,rgba(42,10,22,.42),rgba(90,14,38,.9))}
.d-attar .ft-n span{color:#E3B866}
.d-attar{--cink:#FFF0E8;--cmut:#E2C2B8;--cacc:#E3B866;--cgold:#E3B866;--cname:#FFE7B0;--cbg:linear-gradient(180deg,rgba(90,14,38,.62),rgba(42,10,22,.84));--cbd:rgba(227,184,102,.45);--cbtn:linear-gradient(120deg,#B8862E,#F6DE9A 50%,#B8862E);--cbtnk:#2A0A16;--evbg:rgba(0,0,0,.2);--pring:rgba(227,184,102,.14);--ew:132px;--pcol:#C8102E;--pcol2:#E8506A}

.d-attar .c4-bg{background:radial-gradient(ellipse at 50% 30%,#6E1430,#2A0A16 60%,#14040A)}
.at-pat{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.35;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cg fill='none' stroke='%23E3B866' stroke-opacity='.35'%3E%3Cpath d='M40 4L52 28L76 40L52 52L40 76L28 52L4 40L28 28Z'/%3E%3Ccircle cx='40' cy='40' r='8'/%3E%3C/g%3E%3C/svg%3E") 0 0/80px 80px;-webkit-mask:radial-gradient(ellipse at 50% 40%,#000 10%,transparent 70%);mask:radial-gradient(ellipse at 50% 40%,#000 10%,transparent 70%)}
.la-attar .lp:nth-last-child(-n+3){animation:ladraw 2s ease 2s forwards,atcurl 4s ease-in-out 4s infinite}
@keyframes atcurl{0%,100%{opacity:1;transform:none}50%{opacity:.35;transform:translate3d(0,-6px,0)}}
.d-attar .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-attar .hero .nm{filter:drop-shadow(0 3px 10px rgba(0,0,0,.55))}.d-attar .hero .nm .c4-c{background:linear-gradient(180deg,#FFF4C8 0%,#F0CF7A 45%,#C9963A 75%,#F6DE9A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.d-attar .cdu{background:radial-gradient(circle at 50% 35%,rgba(110,20,48,.75),rgba(42,10,22,.85))}
.d-attar .cdu b{color:#FFE7B0}.d-attar .cdu span{color:#E3B866}
.d-attar .c4{gap:9px}

.d-attar.opening #intro .c4-em{animation:atup 1.3s cubic-bezier(.6,0,.3,1) both}
@keyframes atup{from{opacity:1;transform:none}to{opacity:0;transform:translate3d(0,-34vh,0) scale(2)}}
.d-attar.opening #intro .c4{animation:mdcard 1.1s cubic-bezier(.6,0,.3,1) .2s both}
@keyframes mdcard{from{opacity:1;transform:none}to{opacity:0;transform:scale(.86)}}