/* Neel Weds Devi · scrollable invitation */
@font-face{font-family:"Cormorant";src:url(/assets/fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Cormorant";src:url(/assets/fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Cormorant";src:url(/assets/fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Cormorant";src:url(/assets/fonts/cormorant-garamond-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Great Vibes";src:url(/assets/fonts/great-vibes-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Tiro Bangla";src:url(/assets/fonts/tiro-bangla-bengali-400-normal.woff2) format("woff2");font-display:swap}

:root{
  --paper:#f8f0e0; --paper2:#f2e6cf; --ink:#4a2a14; --ink2:#6b4a30;
  --maroon:#741c1c; --maroon2:#521212; --gold:#b0802a; --gold2:#d9b45e; --gold3:#8a5e14;
  --marigold:#e8a33a; --sage:#8fa27e; --vermilion:#c8341e;
  --serif:"Cormorant",Georgia,serif; --script:"Great Vibes",cursive; --bn:"Tiro Bangla",serif;
  --maxw:460px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:var(--serif);color:var(--ink);font-size:19px;line-height:1.45;
  background:var(--paper);
  background-image:
    radial-gradient(120% 60% at 50% 0%,#fbf6ea 0%,transparent 60%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45 0 0 0 0 .32 0 0 0 0 .18 0 0 0 .07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  overflow-x:hidden;
}
body.locked{overflow:hidden;height:100svh}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hidden,[hidden]{display:none!important}

.script{font-family:var(--script);font-weight:400;line-height:1.15}
.bn{font-family:var(--bn)}
.gv{font-family:var(--script);font-weight:400}
.caps{font-family:var(--serif);font-weight:700;text-transform:uppercase;letter-spacing:.34em;font-size:13px;color:var(--maroon);text-align:center;padding-left:.34em}
.caps.small{font-size:12px;color:var(--ink2)}
.caps.tiny{font-size:11px;letter-spacing:.3em}
.gold{
  background:linear-gradient(100deg,#7a4f0c 0%,#c99a3c 22%,#f1d488 40%,#b8862b 58%,#e9c877 76%,#8a5e14 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  padding:.18em .25em .14em;margin:-.18em -.25em -.14em;display:inline-block;
  animation:sheen 7s ease-in-out infinite;
}
@keyframes sheen{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.lead{text-align:center;font-size:20px;color:var(--ink)}
.lead.small{font-size:17px;color:var(--ink2)}
.hint{font-style:italic;text-align:center;color:var(--ink2);font-size:16px;margin-top:14px}

/* ---------- reveal ---------- */
[data-r]{opacity:0;transform:translateY(18px);filter:blur(3px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1),filter .9s ease}
[data-r].in{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){[data-r]{transition:none;opacity:1;transform:none;filter:none}}

/* ---------- layout ---------- */
main{max-width:var(--maxw);margin:0 auto;position:relative;z-index:1}
.sec{padding:72px 26px;position:relative;display:flex;flex-direction:column;align-items:center;gap:10px}
.flourish{width:150px;height:18px;margin:4px 0 14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 18'><g fill='none' stroke='%23b0802a' stroke-width='1.1'><path d='M2 9h52M96 9h52'/><path d='M54 9c6-7 14-7 21 0 7-7 15-7 21 0-6 7-14 7-21 0-7 7-15 7-21 0z'/></g><circle cx='75' cy='9' r='2.2' fill='%23741c1c'/><circle cx='2' cy='9' r='1.5' fill='%23b0802a'/><circle cx='148' cy='9' r='1.5' fill='%23b0802a'/></svg>") center/contain no-repeat}

#progress{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,var(--gold2),var(--maroon));z-index:30}
#petals{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:20}

/* ---------- envelope (full screen, portrait) ---------- */
:root{--tex:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .42 0 0 0 0 .3 0 0 0 0 .16 0 0 0 .11 0'/></filter><rect width='100%' height='100%' filter='url(%23p)'/></svg>")}
#envelope{position:fixed;inset:0;z-index:50;overflow:hidden;background:radial-gradient(120% 90% at 50% 35%,#f7efdd,#e6d6b6)}
#envelope.gone{display:none}
.env{position:absolute;inset:0;transform-origin:50% 70%;cursor:pointer}
.env-back{position:absolute;inset:0;background:var(--tex),linear-gradient(#e8d9bb,#e2d0ad)}
.env-liner{position:absolute;left:0;right:0;top:0;height:46%;clip-path:polygon(0 0,100% 0,50% 88%);
  background:
    radial-gradient(circle at 50% 50%,rgba(241,212,136,.55) 0 1.3px,transparent 1.8px) 0 0/22px 22px,
    radial-gradient(circle at 50% 50%,transparent 0 6px,rgba(241,212,136,.35) 6.5px 7.3px,transparent 7.8px) 11px 11px/22px 22px,
    linear-gradient(#7d1816,#5a0f0e)}
.env-card{position:absolute;left:7%;right:7%;top:5%;height:86%;z-index:2;border-radius:3px;
  background:var(--tex),linear-gradient(#fffbf2,#fbf3e2);box-shadow:0 1px 0 rgba(176,128,42,.35) inset,0 0 0 1px rgba(176,128,42,.35),0 4px 10px rgba(60,35,10,.18);
  display:flex;flex-direction:column;align-items:center;padding-top:10%;gap:6px;text-align:center}
.env-card::before{content:"";position:absolute;inset:10px;border:1px solid rgba(176,128,42,.55);border-radius:2px;pointer-events:none}
.env-ganesh{width:22%;max-width:96px}
.env-bless{font-size:15px;color:var(--maroon);line-height:1.9}
.env-cap{font-size:11px;margin-top:6px}
.env-names{font-size:clamp(40px,12vw,54px);line-height:1.05;color:var(--maroon)}
.env-amp{font-style:italic;color:var(--ink2);font-size:20px;line-height:1}
.env-pocket-wrap{position:absolute;inset:0;z-index:3;filter:drop-shadow(0 -2px 3px rgba(90,60,30,.25));pointer-events:none}
.env-pocket{position:absolute;inset:0;clip-path:polygon(0 0,50% 40%,100% 0,100% 100%,0 100%);
  background:var(--tex),linear-gradient(90deg,#ecdec0 0%,#f5ead4 50%,#ecdec0 100%)}
.env-bottom-wrap{position:absolute;inset:0;filter:drop-shadow(0 -2px 2.5px rgba(90,60,30,.2))}
.env-bottom{position:absolute;inset:0;clip-path:polygon(0 100%,0 96%,50% 54%,100% 96%,100% 100%);background:var(--tex),linear-gradient(#f8efdd,#f0e3c8)}
.foil-frame{position:absolute;inset:16px;border:1px solid rgba(176,128,42,.8);outline:1px solid rgba(176,128,42,.45);outline-offset:-6px}
.address{position:absolute;left:0;right:0;bottom:11%;display:flex;flex-direction:column;align-items:center;gap:2px;padding:0 30px}
.addr-for{font-size:10.5px;color:var(--gold3)}
.addressee{font-size:clamp(30px,9vw,40px);line-height:1.15;text-align:center;text-wrap:balance}
.env-flap-wrap{position:absolute;left:0;right:0;top:0;height:46%;z-index:4;filter:drop-shadow(0 5px 6px rgba(80,50,20,.3));pointer-events:none}
.env-flap{position:absolute;inset:0;transform-origin:50% 0;transform-style:preserve-3d}
.flap-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;clip-path:polygon(0 0,100% 0,51.5% 98%,50% 100%,48.5% 98%)}
.flap-out{background:var(--tex),linear-gradient(170deg,#f7eedc 0%,#efe2c6 70%,#e8d8b8 100%)}
.flap-in{transform:rotateX(180deg);background:
    radial-gradient(circle at 50% 50%,rgba(241,212,136,.55) 0 1.3px,transparent 1.8px) 0 0/22px 22px,
    radial-gradient(circle at 50% 50%,transparent 0 6px,rgba(241,212,136,.35) 6.5px 7.3px,transparent 7.8px) 11px 11px/22px 22px,
    linear-gradient(#5a0f0e,#7d1816)}
.seal{position:absolute;left:50%;top:46%;width:136px;height:136px;margin:-68px 0 0 -68px;z-index:6;filter:drop-shadow(0 7px 7px rgba(50,8,5,.45)) drop-shadow(0 1px 1px rgba(50,8,5,.4))}
.seal::after{content:"";position:absolute;inset:4px;border-radius:50%;border:1.5px solid rgba(241,212,136,.9);animation:ripple 2.6s ease-out infinite;pointer-events:none}
@keyframes ripple{0%{transform:scale(.9);opacity:0}25%{opacity:.9}100%{transform:scale(1.45);opacity:0}}
.seal-half{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.seal-half.top{clip-path:polygon(-10% -10%,110% -10%,110% 51%,80% 46%,64% 55%,47% 47%,31% 56%,14% 48%,-10% 53%)}
.seal-half.bot{clip-path:polygon(-10% 53%,14% 48%,31% 56%,47% 47%,64% 55%,80% 46%,110% 51%,110% 110%,-10% 110%)}
.env-hint{position:absolute;left:0;right:0;top:calc(46% + 84px);z-index:5;text-align:center;font-weight:700;font-size:11.5px;letter-spacing:.32em;padding-left:.32em;text-transform:uppercase;color:var(--gold3);animation:breathe 2.6s ease-in-out infinite}
@keyframes breathe{50%{opacity:.4}}
@media (prefers-reduced-motion:reduce){.seal::after,.env-hint{animation:none}}

/* ---------- music ---------- */
#musicBtn{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:40;width:46px;height:46px;border-radius:50%;
  background:rgba(255,250,240,.9);border:1px solid var(--gold2);color:var(--maroon);display:grid;place-items:center;box-shadow:0 6px 16px rgba(74,42,20,.2);backdrop-filter:blur(6px)}
#musicBtn svg{width:22px;height:22px}
#musicBtn .off{display:none}
#musicBtn.muted .on{display:none}#musicBtn.muted .off{display:block}
#musicBtn:not(.muted) .on{animation:bob 1.6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-2px)}}

/* ---------- garland ---------- */
.garland{width:calc(100% + 52px);margin:-72px -26px 8px;height:120px;pointer-events:none}
.garland.low{margin:24px -26px -40px;height:90px}
.garland svg{width:100%;height:100%;overflow:visible}

/* ---------- hero ---------- */
.hero{min-height:100svh;justify-content:flex-start;padding-top:72px;gap:14px}
.ganesh-wrap{position:relative;width:150px;margin-top:8px}
.halo{position:absolute;inset:-30%;border-radius:50%;background:radial-gradient(circle,rgba(241,212,136,.55),rgba(241,212,136,0) 65%);animation:halo 5s ease-in-out infinite}
@keyframes halo{50%{transform:scale(1.08);opacity:.75}}
.ganesh{position:relative;width:100%}
.blessing{font-size:22px;color:var(--maroon);letter-spacing:.02em;line-height:1.9;padding:4px 0}
.mono{display:flex;align-items:center;gap:4px;margin:6px 0 0}
.mono .gv{font-size:56px;line-height:1;color:var(--gold3);background:linear-gradient(100deg,#7a4f0c,#e9c877 45%,#9a6a1a);-webkit-background-clip:text;background-clip:text;color:transparent;padding:.1em .12em}
.mono .rings{width:60px;height:38px;margin-top:6px}
.names{display:flex;flex-direction:column;align-items:center;font-weight:400;line-height:1}
.names .script{font-size:clamp(58px,17vw,78px)}
.names .amp{font-style:italic;font-size:28px;color:var(--ink2);margin:-4px 0}
.hashtag{font-style:italic;color:var(--maroon);font-size:18px;letter-spacing:.04em}
.scroll-cue{margin-top:auto;padding-top:24px;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink2);display:flex;flex-direction:column;align-items:center;gap:8px}
.scroll-cue span{width:1px;height:38px;background:linear-gradient(var(--gold),transparent);animation:cue 2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* ---------- greeting frame ---------- */
.frame{position:relative;width:100%;padding:104px 18px 40px;border:1px solid rgba(176,128,42,.55);outline:1px solid rgba(176,128,42,.25);outline-offset:-8px;background:rgba(255,251,242,.6);display:flex;flex-direction:column;align-items:center;gap:8px;border-radius:200px 200px 10px 10px}
.corner{position:absolute;width:26px;height:26px;border:1.5px solid var(--gold)}
.corner.tl,.corner.tr{display:none}
.corner.bl{left:-6px;bottom:-6px;border-right:0;border-top:0}
.corner.br{right:-6px;bottom:-6px;border-left:0;border-top:0}
.dear{font-size:clamp(30px,9vw,38px);text-align:center;text-wrap:balance;max-width:100%;line-height:1.2}
.hosts{font-weight:700;font-size:21px;color:var(--maroon);text-align:center;line-height:1.3}
.couple{font-size:clamp(44px,13vw,54px)}

/* ---------- scratch ---------- */
.scratch{position:relative;width:min(100%,320px);aspect-ratio:1/1.08;border-radius:160px 160px 14px 14px;overflow:hidden;box-shadow:0 18px 40px -18px rgba(74,42,20,.5);border:1px solid rgba(176,128,42,.6)}
.scratch-under{position:absolute;inset:0;background:radial-gradient(90% 70% at 50% 35%,#fffaf0,#f3e5c8);display:flex;flex-direction:column;align-items:center;justify-content:center}
.sd-day{text-transform:uppercase;letter-spacing:.35em;font-weight:700;font-size:15px;color:var(--maroon);padding-left:.35em}
.sd-num{font-family:var(--script);font-size:120px;line-height:1;color:var(--maroon);margin:4px 0 -6px}
.sd-month{font-weight:600;font-size:26px;color:var(--ink)}
.sd-time{font-style:italic;font-size:18px;color:var(--ink2);margin-top:6px}
#scratch{position:absolute;inset:0;width:100%;height:100%;touch-action:none;transition:opacity 1s ease}
#scratch.done{opacity:0;pointer-events:none}
.scratch.revealed{animation:glow 1.6s ease}
@keyframes glow{40%{box-shadow:0 0 0 6px rgba(241,212,136,.6),0 18px 40px -18px rgba(74,42,20,.5)}}
.finger{display:inline-block;width:16px;height:16px;margin-right:6px;vertical-align:-2px;border-radius:50%;border:1.5px solid var(--gold);animation:swipe 1.8s ease-in-out infinite}
@keyframes swipe{0%,100%{transform:translateX(-4px)}50%{transform:translateX(6px)}}

/* ---------- countdown ---------- */
.cd{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%;margin:14px 0 6px}
.cd div{background:rgba(255,251,242,.85);border:1px solid rgba(176,128,42,.55);border-radius:60px 60px 8px 8px;padding:18px 2px 12px;text-align:center;box-shadow:0 10px 24px -16px rgba(74,42,20,.45)}
.cd b{display:block;font-weight:600;font-size:clamp(30px,9vw,40px);color:var(--maroon);font-variant-numeric:lining-nums tabular-nums;line-height:1}
.cd span{display:block;margin-top:8px;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink2);padding-left:.22em}
.cd b.tick{animation:tick .5s ease}
@keyframes tick{0%{transform:translateY(-5px);opacity:.3}100%{transform:none;opacity:1}}

/* ---------- events ---------- */
.events{gap:10px}
.event{width:100%;margin:22px 0 34px;display:flex;flex-direction:column;align-items:center}
.stage{position:relative;width:100%;aspect-ratio:1/1.12;border-radius:999px 999px 18px 18px;overflow:hidden;border:1px solid rgba(176,128,42,.6);box-shadow:0 24px 44px -24px rgba(74,42,20,.6)}
.stage .wash{position:absolute;inset:0}
.stage .fig{position:absolute;bottom:4%;left:50%;height:80%;width:auto;max-width:none;transform:translateX(-50%);transform-origin:50% 100%;animation:sway 6s ease-in-out infinite;filter:drop-shadow(0 10px 12px rgba(60,30,10,.25))}
@keyframes sway{0%,100%{transform:translateX(-50%) rotate(-.4deg)}50%{transform:translateX(-50%) rotate(.4deg)}}
.haldi .wash{background:radial-gradient(70% 55% at 50% 30%,#fff6d6,transparent 70%),radial-gradient(90% 70% at 20% 100%,#f6d36b,transparent 60%),radial-gradient(90% 70% at 85% 90%,#f3b24a,transparent 60%),#fbe9b4}
.wedding .wash{background:radial-gradient(60% 45% at 50% 32%,#ffd9a0,transparent 70%),radial-gradient(100% 70% at 50% 110%,#a8322b,transparent 70%),linear-gradient(#3a1a2a,#6e1f22 65%,#8a2a1f)}
.reception .wash{background:radial-gradient(60% 45% at 50% 30%,#fff1dc,transparent 70%),radial-gradient(90% 60% at 15% 90%,#e9b9b0,transparent 60%),radial-gradient(90% 60% at 90% 85%,#e8c98f,transparent 60%),#f4dfcf}
.parents .wash{background:radial-gradient(70% 50% at 50% 28%,#fff3d9,transparent 70%),radial-gradient(90% 60% at 50% 105%,#e8b86a,transparent 65%),#f6e6c6}

/* marigold strings (haldi) */
.marigolds{position:absolute;top:0;left:0;right:0;height:46%;background:
  repeating-linear-gradient(90deg,transparent 0 13%,transparent 13% 100%);}
.marigolds::before,.marigolds::after{content:"";position:absolute;top:-6px;width:9px;height:100%;
  background:radial-gradient(circle,#f5a623 0 42%,#d9781a 44% 55%,transparent 57%) center top/9px 14px repeat-y}
.marigolds::before{left:18%}.marigolds::after{right:18%}
/* diyas (wedding) */
.diyas{position:absolute;left:8%;right:8%;bottom:4%;display:flex;justify-content:space-between;z-index:2}
.diyas i{width:26px;height:10px;border-radius:0 0 14px 14px;background:linear-gradient(#c56b2a,#7a3a12);position:relative}
.diyas i::before{content:"";position:absolute;left:50%;bottom:8px;width:9px;height:16px;transform:translateX(-50%);border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 70%,#fff6c8,#ffc24a 45%,rgba(255,120,20,.0) 75%);filter:blur(.4px);animation:flame 1.2s ease-in-out infinite alternate}
.diyas i::after{content:"";position:absolute;left:50%;bottom:4px;width:60px;height:60px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,190,90,.45),transparent 65%)}
.diyas i:nth-child(2)::before{animation-delay:.3s}.diyas i:nth-child(3)::before{animation-delay:.6s}.diyas i:nth-child(4)::before{animation-delay:.15s}.diyas i:nth-child(5)::before{animation-delay:.45s}
@keyframes flame{0%{transform:translateX(-50%) scale(1,1) skewX(-3deg)}100%{transform:translateX(-50%) scale(.9,1.12) skewX(3deg)}}
/* fairy lights (reception) */
.lights{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,236,170,.95) 0 1.6px,rgba(255,220,140,.25) 2.2px,transparent 4px);background-size:26px 30px;-webkit-mask:linear-gradient(#000,transparent 55%);mask:linear-gradient(#000,transparent 55%);animation:twinkle 3s ease-in-out infinite alternate}
@keyframes twinkle{0%{opacity:.55}100%{opacity:1}}
/* lamps (parents) */
.lamps i{position:absolute;top:16%;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,rgba(255,214,140,.9) 0 10%,rgba(255,200,110,.35) 30%,transparent 65%);animation:halo 4s ease-in-out infinite}
.lamps i:first-child{left:4%}.lamps i:last-child{right:4%;animation-delay:1.5s}

.info{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:22px;text-align:center}
.ev-title{font-weight:700;font-size:30px;letter-spacing:.3em;text-transform:uppercase;color:var(--maroon);padding-left:.3em}
.ev-date{font-weight:600;font-size:21px}
.ev-time{font-style:italic;color:var(--ink2)}
.ev-venue{font-weight:700;font-size:22px;color:var(--maroon);margin-top:8px}
.ev-addr{color:var(--ink);font-size:18px;line-height:1.35}
.ev-addr em{color:var(--ink2)}
.btn{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:11px 22px;border-radius:999px;border:1px solid var(--gold);color:var(--maroon);text-decoration:none;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:13px;background:rgba(255,251,242,.8);transition:transform .2s}
.btn:active{transform:scale(.97)}
.btn.solid{background:linear-gradient(#8a2a24,#5f1616);color:#fbe7b5;border-color:#5f1616;box-shadow:0 10px 20px -10px rgba(90,20,20,.6)}
.btn.solid:disabled{opacity:.45}
.pin{width:12px;height:12px;border-radius:50% 50% 50% 0;border:1.6px solid currentColor;transform:rotate(-45deg)}
.dress{margin-top:16px;padding:14px 18px;border-top:1px solid rgba(176,128,42,.45);display:flex;flex-direction:column;align-items:center;gap:6px}
.dress-line{font-style:italic;font-size:18px}
.swatches{display:flex;gap:10px;margin-top:4px}
.swatches i{width:30px;height:30px;border-radius:50%;background:var(--c);border:1px solid rgba(120,80,30,.35);box-shadow:inset 0 -3px 6px rgba(0,0,0,.08);position:relative}
.swatches i.no::after{content:"";position:absolute;left:-3px;right:-3px;top:50%;height:1.6px;background:var(--maroon);transform:rotate(-45deg)}
.swatches i.any{background:conic-gradient(#2f5d8a,#2e7d5b,#d9a521,#8c4fa1,#e98a9b,#1f3b5c,#2f5d8a)}

/* ---------- parents ---------- */
.stage.wide{aspect-ratio:1/1.05}
.parents .father{height:80%}
.parents .mother{height:73.5%}
.parents .father{left:33%}
.parents .mother{left:67%;animation-delay:-3s}
.message{min-height:9.5em;text-align:center;font-style:italic;font-size:21px;line-height:1.55;margin-top:22px;color:var(--ink)}
.message .cursor{display:inline-block;width:1px;height:1em;background:var(--maroon);vertical-align:-2px;margin-left:2px;animation:breathe .9s infinite}
.sign{font-size:46px;margin-top:6px}

/* ---------- RSVP ---------- */
.rsvp-title{font-size:50px;text-align:center}
#rsvpForm{width:100%;display:flex;flex-direction:column;gap:16px;margin-top:10px}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink2);font-weight:700}
.field input,.field textarea{font:inherit;font-size:19px;color:var(--ink);padding:12px 14px;border:1px solid rgba(176,128,42,.6);border-radius:12px;background:rgba(255,252,245,.9);outline:none}
.field input:focus,.field textarea:focus{border-color:var(--maroon);box-shadow:0 0 0 3px rgba(116,28,28,.12)}
.for-name{text-align:center;font-family:var(--script);font-size:34px;color:var(--maroon)}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opt{border:1px solid rgba(176,128,42,.55);border-radius:90px 90px 14px 14px;padding:22px 8px 16px;background:rgba(255,251,242,.85);display:flex;flex-direction:column;align-items:center;gap:6px;transition:all .3s}
.opt b{font-weight:700;font-size:17px;color:var(--maroon)}
.opt small{font-style:italic;font-size:15px;color:var(--ink2)}
.opt[aria-checked=true]{background:linear-gradient(#fff6e2,#f7e3b8);border-color:var(--maroon);box-shadow:0 0 0 2px rgba(116,28,28,.2),0 14px 26px -16px rgba(90,20,20,.5);transform:translateY(-2px)}
.ico{width:40px;height:40px}
.diya-ico{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><path d='M20 6c3 5 4 8 4 11a4 4 0 0 1-8 0c0-3 1-6 4-11z' fill='%23e8a33a'/><path d='M20 12c1.4 2.6 2 4 2 5.4a2 2 0 0 1-4 0c0-1.4.6-2.8 2-5.4z' fill='%23fff3c4'/><path d='M6 24h28c-2 7-8 10-14 10S8 31 6 24z' fill='%23741c1c'/><path d='M6 24h28' stroke='%23b0802a' stroke-width='1.5'/></svg>") center/contain no-repeat}
.hands-ico{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><g fill='none' stroke='%23741c1c' stroke-width='1.5' stroke-linejoin='round'><path d='M20 9c-4 5-4 13 0 20 4-7 4-15 0-20z' fill='%23f6dcc8'/><path d='M19 29c-6-1-11-6-12-13 6 1 10 5 12 13z' fill='%23f6dcc8'/><path d='M21 29c6-1 11-6 12-13-6 1-10 5-12 13z' fill='%23f6dcc8'/></g><path d='M9 32h22' stroke='%23b0802a' stroke-width='1.5'/></svg>") center/contain no-repeat}
.q{font-weight:600;font-size:18px;text-align:center;color:var(--maroon);margin-top:4px}
.evpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.evpick label{position:relative}
.evpick input{position:absolute;opacity:0}
.evpick span{display:flex;flex-direction:column;align-items:center;padding:12px 4px;border:1px solid rgba(176,128,42,.55);border-radius:12px;font-weight:700;font-size:16px;color:var(--ink);background:rgba(255,251,242,.85);transition:all .25s}
.evpick small{font-weight:500;font-size:13px;color:var(--ink2)}
.evpick input:checked+span{background:var(--maroon);color:#fbe7b5;border-color:var(--maroon)}
.evpick input:checked+span small{color:#f1d488}
.evpick input:focus-visible+span{outline:2px solid var(--gold)}
.stepper{display:flex;align-items:center;justify-content:center;gap:18px}
.stepper button{width:44px;height:44px;border-radius:50%;border:1px solid var(--gold);font-size:24px;color:var(--maroon);background:rgba(255,251,242,.9)}
.stepper output{font-variant-numeric:lining-nums;font-weight:700;font-size:32px;min-width:40px;text-align:center;color:var(--maroon)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.err{color:#a3221a;text-align:center;font-style:italic;min-height:1.2em;font-size:16px}
#rSubmit{align-self:center;padding:14px 34px;font-size:14px}
.thanks{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:10px 6px}
.thanks-ico{width:64px;height:64px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><circle cx='32' cy='32' r='30' fill='none' stroke='%23b0802a' stroke-width='1.5'/><path d='M32 46s-14-8.5-14-18a7.5 7.5 0 0 1 14-3.8A7.5 7.5 0 0 1 46 28c0 9.5-14 18-14 18z' fill='%23741c1c'/></svg>") center/contain no-repeat;animation:halo 3s ease-in-out infinite}
.thanks-title{font-size:44px}
.link{text-decoration:underline;color:var(--ink2);font-style:italic;margin-top:6px}
.call{margin-top:24px}
.call a{color:var(--maroon);font-weight:700;text-decoration:none;border-bottom:1px solid var(--gold2)}

/* ---------- footer ---------- */
.foot{padding-bottom:110px;gap:6px}
.foot .ganesh.small{width:64px;opacity:.9;margin-top:40px}
.foot .script{font-size:40px}
.tiny-note{font-size:15px;font-style:italic;color:var(--ink2)}


/* =========== Bengali wedding theme (11 Nov) =========== */
:root{--sindoor:#a3161a;--alpona:url(/assets/img/alpona.webp)}
/* opening page inside the painted shola arch */
.hero{position:relative;min-height:0;aspect-ratio:9/16;padding:27% 19% 0;justify-content:flex-start;gap:6px;overflow:hidden;margin:0 -0px}
.hero-bg{position:absolute;inset:0;background:url(/assets/img/hero.webp) center top/100% 100% no-repeat;z-index:-1;animation:heroBreath 18s ease-in-out infinite alternate;transform-origin:50% 40%}
@keyframes heroBreath{to{transform:scale(1.035)}}
.hero .ganesh-wrap{width:64px;margin-top:6px}
.hero .blessing{font-size:16px;line-height:1.8;padding:0}
.hero .mono{margin:0}
.hero .mono .gv{font-size:40px}
.hero .mono .rings{width:44px;height:28px;margin-top:4px}
.hero .names .script{font-size:clamp(38px,11.5vw,50px)}
.hero .names .amp{font-size:20px;margin:-6px 0}
.hero .caps.small{font-size:9.5px;letter-spacing:.26em;padding-left:.26em}
.hero .hashtag{font-size:15px}
.hero .scroll-cue{display:none}
@media (prefers-reduced-motion:reduce){.hero-bg{animation:none}}

/* laal-paar border between sections: white, red alpona band, gold rules */
.laalpaar{height:34px;margin:6px 0;background:
   linear-gradient(#d9b45e,#d9b45e) 0 5px/100% 1.5px no-repeat,
   linear-gradient(#d9b45e,#d9b45e) 0 calc(100% - 5px)/100% 1.5px no-repeat,
   var(--alpona) center/84px 84px repeat-x;
  box-shadow:inset 0 0 0 0 transparent;border-top:4px solid #fffaf0;border-bottom:4px solid #fffaf0;filter:saturate(1.05)}

/* butterfly (prajapati) divider */
.prajapati{width:72px;height:40px;margin:4px 0 14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 40'><g fill='none' stroke='%23b0802a' stroke-width='1.2'><path d='M36 12c-6-10-24-14-27-6-3 7 10 13 27 14'/><path d='M36 12c6-10 24-14 27-6 3 7-10 13-27 14'/><path d='M36 22c-5 2-17 6-17 12 0 4 10 3 17-8'/><path d='M36 22c5 2 17 6 17 12 0 4-10 3-17-8'/><path d='M36 10v20M36 10c-1-4-4-7-7-8M36 10c1-4 4-7 7-8'/><path d='M2 20h12M58 20h12'/></g><g fill='%23a3161a'><circle cx='20' cy='10' r='1.6'/><circle cx='52' cy='10' r='1.6'/><circle cx='25' cy='30' r='1.3'/><circle cx='47' cy='30' r='1.3'/><circle cx='36' cy='31' r='1.8'/></g></svg>") center/contain no-repeat}

/* scene stages: tall painted arch with a laal-paar edge */
.stage{aspect-ratio:9/16;border-radius:999px 999px 14px 14px;border:5px solid #fffaf0;
  box-shadow:0 0 0 5px var(--sindoor),0 0 0 6.5px #d9b45e,0 30px 50px -26px rgba(74,42,20,.65);background:#2a160c}
.stage.wide,.stage.parents-stage{aspect-ratio:9/16}
.stage .scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.stage[data-r]{transform:translateY(28px) scale(1.05);transition:opacity 1.2s ease,transform 1.6s cubic-bezier(.2,.7,.2,1),filter 1.2s ease}
.stage[data-r].in{transform:none}
.event{margin:26px 0 40px}

/* envelope lining and countdown in Bengali red */
.env-liner,.flap-in{background:var(--alpona) center/120px 120px repeat,#a3161a!important}
.cd div{border-top:3px solid var(--sindoor)}

/* =========== opening page: living backdrop, butterflies, monogram =========== */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block}
.hero .ganesh-wrap,.hero .blessing,.hero .mono,.hero .names,.hero .caps,.hero .hashtag{position:relative;z-index:2}
.mono span{display:inline-block;will-change:transform}
.flutter{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.bfly{position:absolute;left:0;top:0;width:62px;height:50px;opacity:0;will-change:transform}
.bfly svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 4px 3px rgba(60,30,10,.28))}
.bfly .wing{transform-box:view-box;transform-origin:0px 0px}
.bfly .wl{animation:flapL .26s ease-in-out infinite alternate}
.bfly .wr{animation:flapR .26s ease-in-out infinite alternate}
.bfly.b2 .wing{animation-duration:.23s}
.bfly.glide .wing{animation-duration:.55s}
@keyframes flapL{from{transform:scaleX(1)}to{transform:scaleX(.42)}}
@keyframes flapR{from{transform:scaleX(-1)}to{transform:scaleX(-.42)}}
@media (prefers-reduced-motion:reduce){.bfly .wing{animation:none}}