:root{--ivory:#faf5e9;--burgundy:#761e2d;--ink:#612733;--gold:#b89050;--serif:'Cormorant Garamond',Georgia,serif;--script:'Great Vibes','URW Chancery L',cursive;--sans:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#421320;color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased}body.is-sealed{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #b9904e;outline-offset:5px}button[disabled]{cursor:default}.svg-definitions{position:absolute;width:0;height:0;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
.invitation{width:min(100%,430px);margin:0 auto;background:var(--ivory);box-shadow:0 0 100px #18030a80}.scene{position:relative;width:100%;aspect-ratio:9/16;isolation:isolate;overflow:hidden;container-type:inline-size}.scene-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.introduction{background:#fffaf0}.intro-copy{position:absolute;inset:35.6% 5.5% 0;display:flex;align-items:center;flex-direction:column;text-align:center}.logo-arrival{width:39%;aspect-ratio:1;position:relative;flex:none;margin-bottom:2.5%}.hp-logo{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 1px #b58a3c12)}.logo-glint{position:absolute;inset:9%;background:linear-gradient(112deg,transparent 34%,#fff8d833 45%,#fff8d8cc 49%,transparent 59%);mix-blend-mode:screen;opacity:0;pointer-events:none;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.save-date-group{margin:0 0 3.6%}.save-date{font-size:16px;font-size:4.1cqw;letter-spacing:.19em;line-height:1.1;font-weight:600;margin:0 0 8px;color:#875e28}.invitation-line{font-size:16px;font-size:4.1cqw;line-height:1.3;margin:0;font-weight:500}.couple-names{font-family:var(--script);font-size:43px;font-size:11.2cqw;font-weight:400;line-height:1.3;white-space:nowrap;margin:0;color:#772234;letter-spacing:0}.couple-names span{display:inline-block;padding:0 .035em;vertical-align:baseline}.intro-ornament{width:29%;height:22px;flex:none;margin:2% 0 2.5%;color:#b88e45}.hashtag{font-size:15px;font-size:3.9cqw;margin:0 0 5.2%;letter-spacing:.015em;font-weight:500}.intro-dates{font-size:20px;font-size:5.1cqw;margin:0;letter-spacing:.045em;font-weight:500}.scroll-cue{display:flex;flex-direction:column;align-items:center;text-decoration:none;font-family:var(--sans);font-size:10px;font-size:2.6cqw;letter-spacing:.14em;color:#8b7150;gap:9px;margin-top:auto;margin-bottom:7.2%}.scroll-cue svg{width:16px;height:24px;animation:scroll-tick 2.6s ease-in-out infinite}
.bell{position:absolute;top:10.4%;width:17%;aspect-ratio:1/2;z-index:2;transform-origin:50% 0;pointer-events:none;filter:drop-shadow(0 3px 2px #a0702822);animation:bell-sway 4.7s ease-in-out infinite alternate}.bell svg{width:100%;height:100%;display:block;overflow:hidden}.bell-left{left:5.7%;animation-delay:-1.6s}.bell-right{right:5.7%;top:10%;animation-duration:5.2s;animation-direction:alternate-reverse}.is-sealed .bell{animation-play-state:paused}
/* One ordered introduction: HP, invitation, Himanshu, then Priya. */
.intro-step{opacity:1}.js .intro-step{opacity:1;transform:none}
.js .introduction:not(.intro-started) .intro-step{opacity:0}
.intro-started .logo-arrival{animation:hp-logo-enter 1.4s cubic-bezier(.16,1,.3,1) both}
.intro-started .logo-glint{animation:logo-light 1.1s ease .25s both}
.intro-started .save-date{animation:typed-arrive .7s steps(13,end) 1.45s both}
.intro-started .invitation-line{animation:typed-arrive 1.15s steps(26,end) 2.2s both}
.intro-started .intro-groom{animation:ink-arrive 1.35s cubic-bezier(.22,.7,.3,1) 3.5s both}
.intro-started .intro-amp{animation:copy-arrive .2s ease 4.95s both}
.intro-started .intro-bride{animation:ink-arrive 1.2s cubic-bezier(.22,.7,.3,1) 5.25s both}
.intro-started .intro-ornament{animation:copy-arrive .4s ease 6.5s both}
.intro-started .hashtag{animation:copy-arrive .35s ease 6.95s both}
.intro-started .intro-dates{animation:copy-arrive .4s ease 7.35s both}
.intro-started .scroll-cue{animation:copy-arrive .5s ease 8.15s both}
.intro-hearts{position:absolute;bottom:14%;left:12%;right:12%;height:12%;pointer-events:none}
.intro-hearts span{position:absolute;bottom:0;left:10%;font:24px var(--serif);color:#ab5c64;opacity:0}
.intro-hearts span:nth-child(2){left:82%;font-size:18px;--heart-delay:.25s;--heart-drift:8px}
.intro-hearts span:nth-child(3){left:69%;font-size:14px;--heart-delay:.5s;--heart-drift:-8px}
.intro-started .intro-hearts span{animation:heart-rise 2.6s ease-out calc(7.8s + var(--heart-delay,0s)) both}
@keyframes hp-logo-enter{from{opacity:0;transform:scale(1.12);filter:blur(2px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes typed-arrive{from{opacity:1;clip-path:inset(-15% 100% -20% 0)}to{opacity:1;clip-path:inset(-15% -3% -20% -3%)}}
@keyframes ink-arrive{from{opacity:1;clip-path:inset(-15% 100% -20% 0);transform:translateY(4px)}to{opacity:1;clip-path:inset(-15% -12% -20% -12%);transform:translateY(0)}}
@keyframes heart-rise{0%{opacity:0;transform:translate(0,5px) scale(.7)}20%{opacity:.7}100%{opacity:0;transform:translate(var(--heart-drift,-12px),-65px) scale(1.1)}}

.petal-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3}.petal{position:absolute;left:var(--x);top:-8%;width:var(--size);height:calc(var(--size) * .64);border-radius:80% 9% 75% 20%;background:radial-gradient(ellipse at 25% 25%,#f6c6bd,#ba5862 65%,#8e3346);box-shadow:inset 1px 1px 2px #ffead275;opacity:0;animation:petal-fall var(--duration) linear var(--delay) infinite;will-change:transform}.petal:nth-child(3n){background:radial-gradient(ellipse at 25% 25%,#fffbe7,#dcc082 65%,#b98f43)}.petal:nth-child(4n){filter:blur(.6px)}.is-sealed .petal{animation-play-state:paused}
.welcome{background:#fffbf4;border-top:1px solid #b8905030}.welcome-copy{position:absolute;inset:22% 11% 5%;text-align:center;display:flex;flex-direction:column;align-items:center}.eyebrow{font-family:var(--sans);font-size:10px;font-size:2.6cqw;font-weight:500;letter-spacing:.14em;line-height:1.5;margin:0;color:#896b3b}.welcome-title{font-size:36px;font-size:8.7cqw;font-weight:400;letter-spacing:-.035em;line-height:1.03;margin:4% 0 4%;color:#6b2633}.welcome-title em{font-weight:400;color:#a0793d}.welcome-message{font-size:20px;font-size:clamp(16px,4.87cqw,21px);font-weight:500;line-height:1.32;max-width:100%;margin:0}.signature{margin:4% 0 0}.signature>span{font-size:17px;font-size:4.36cqw;font-style:italic;color:#9b7b47}.signature p{font-size:25px;font-size:6.4cqw;font-family:var(--script);margin:4px 0 0}.welcome-ornament{width:50%;height:18px;margin:4% 0 4%;color:#b58b45;flex:none}.countdown-area{width:100%}.countdown{display:flex;justify-content:center;align-items:flex-start;gap:14px;margin:12px 0 0;font-variant-numeric:tabular-nums}.countdown>div{min-width:48px}.countdown span{display:block;font-size:38px;font-size:9.75cqw;line-height:1;font-weight:400}.countdown small{display:block;font-family:var(--sans);font-size:8px;letter-spacing:.11em;color:#927b58;margin-top:9px}.countdown i{font-size:26px;font-style:normal;font-weight:400;line-height:1.05;color:#b69255}.countdown-date{font-size:14px;font-size:3.6cqw;margin:12px 0 0;letter-spacing:.03em;color:#917650}.js .reveal{opacity:0;transform:translateY(12px)}.welcome.has-entered .reveal{animation:copy-arrive .8s ease var(--delay,0ms) both}
.bloom{position:absolute;bottom:18%;width:42px;height:42px;z-index:1;opacity:.78;pointer-events:none}.bloom-left{left:5%;transform:rotate(-25deg)}.bloom-right{right:5%;bottom:12%;transform:rotate(24deg) scale(.8)}.bloom-petal{position:absolute;left:40%;top:6%;width:24%;height:48%;border-radius:60% 60% 44% 44%;background:linear-gradient(#fff8e0,#e0b88a 78%,#ae753d);box-shadow:inset 0 0 0 .5px #b17a4944;transform-origin:50% 92%;transform:rotate(var(--angle)) scaleY(.08);opacity:.4}.bloom:after{content:'';position:absolute;left:45%;top:45%;width:16%;height:16%;border-radius:50%;background:radial-gradient(#f8daa0,#a77027);box-shadow:0 0 3px #ae8249}.bloom.has-bloomed .bloom-petal{animation:flower-open 2.8s cubic-bezier(.2,.65,.3,1) calc(.6s + var(--petal-delay)) both}

/* All four paper triangles remain present until their individual hinge opens. */
.opening{position:fixed;inset:0;z-index:20;display:flex;justify-content:center;align-items:flex-start;background:#421320;overflow:hidden;transition:background-color 1s ease}.envelope{position:relative;width:min(100%,430px);aspect-ratio:9/16;flex:none;isolation:isolate;perspective:1400px;overflow:hidden;background:#7b2934}.envelope-lining{position:absolute;inset:0;background:radial-gradient(ellipse at center,#fffbed,#efe0c2);box-shadow:inset 0 0 55px #a4744140}.envelope-lining:after{content:'';position:absolute;inset:9px;border:1px solid #c8a87488;box-shadow:0 0 0 5px #fff8e477}.flap{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform,opacity}.paper-face{position:absolute;inset:0;background:#681f2c}.flap-left{z-index:2;transform-origin:left center}.flap-left .paper-face{clip-path:polygon(0 0,51% 50%,0 100%)}.flap-right{z-index:3;transform-origin:right center}.flap-right .paper-face{clip-path:polygon(100% 0,49% 50%,100% 100%)}.flap-bottom{z-index:4;transform-origin:bottom center}.flap-bottom .paper-face{clip-path:polygon(0 100%,50% 49.7%,100% 100%)}.flap-top{z-index:5;transform-origin:top center}.flap-top .paper-face{clip-path:polygon(0 0,100% 0,50% 50.3%)}.envelope-seams{position:absolute;inset:0;width:100%;height:100%;z-index:6;overflow:visible;pointer-events:none}.seam-line,.seam-light{fill:none;stroke:#e4be81;stroke-width:1.4;vector-effect:non-scaling-stroke}.seam-line{opacity:0}.seam-light{stroke:#fff8ce;opacity:0;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 6px #ffe7a2) drop-shadow(0 0 15px #ffc55b) drop-shadow(0 0 28px #f3a633)}
.seal-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:9;width:39%;aspect-ratio:1;border:0;padding:0;background:transparent;filter:drop-shadow(0 8px 7px #23051066);transition:filter .3s}.seal-button:hover{filter:drop-shadow(0 8px 10px #23051080) brightness(1.045)}.seal-button:active img{transform:scale(.975)}.seal-button img{width:100%;height:100%;display:block;position:relative;z-index:1;transition:transform .2s}.seal-halo{position:absolute;inset:22%;border-radius:50%;box-shadow:0 0 40px 12px #ffc86266;animation:seal-breathe 3.8s ease-in-out infinite}.tap-hint{position:absolute;bottom:8%;left:0;right:0;text-align:center;z-index:7;font-family:var(--sans);font-size:11px;letter-spacing:.2em;color:#ecd5b1bb;pointer-events:none}.opening-light{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 50%,#fffef0 0,#fff8c9 9%,#ffe298e0 23%,#ffc56585 43%,transparent 76%);mix-blend-mode:screen}.opening-light span{position:absolute;left:42%;right:42%;top:28%;bottom:28%;background:#fffbe0;filter:blur(20px);box-shadow:0 0 55px 20px #ffe89d,0 0 140px 45px #ffc16dcc}.opening.is-opening{animation:opening-away .75s ease 2.05s both}.is-opening .seal-button{animation:seal-lift 1.1s cubic-bezier(.25,.6,.3,1) .15s both}.is-opening .seal-halo{animation:seal-flare 1.1s ease both}.is-opening .tap-hint{animation:fade-out .25s ease both}.is-opening .seam-light{animation:seams-light 1.9s ease .05s both}.is-opening .seam-line{animation:fade-out .4s ease .95s both}.is-opening .opening-light{animation:golden-reveal 2.4s ease .1s both}.is-opening .flap-left{animation:open-left 1.65s cubic-bezier(.4,0,.2,1) .58s both}.is-opening .flap-right{animation:open-right 1.65s cubic-bezier(.4,0,.2,1) .66s both}.is-opening .flap-top{animation:open-top 1.8s cubic-bezier(.4,0,.2,1) .46s both}.is-opening .flap-bottom{animation:open-bottom 1.75s cubic-bezier(.4,0,.2,1) .72s both}

.controls{position:fixed;z-index:12;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(calc(100% - 28px),402px);display:flex;justify-content:space-between;align-items:center;pointer-events:none}.controls button{pointer-events:auto;border:1px solid #b48e5e66;background:#fff9edee;box-shadow:0 2px 10px #32152316;color:#713040;backdrop-filter:blur(8px)}.right-controls{display:flex;align-items:center;gap:8px}.round-control{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;padding:12px}.round-control svg{width:18px;height:18px}.music-control{height:44px;display:flex;align-items:center;gap:9px;border-radius:24px;padding:0 12px;font-family:var(--sans);font-size:10px;letter-spacing:.025em}.sound-bars{display:flex;align-items:center;gap:2px;height:16px}.sound-bars i{display:block;background:currentColor;width:2px;height:5px;border-radius:2px}.music-control[aria-pressed=true] .sound-bars i{animation:sound-wave 1.15s ease-in-out infinite}.sound-bars i:nth-child(2){animation-delay:-.25s!important}.sound-bars i:nth-child(3){animation-delay:-.65s!important}.sound-bars i:nth-child(4){animation-delay:-.45s!important}
.motion-paused .decorative-motion,.motion-paused .scroll-cue svg,.page-hidden .decorative-motion{animation-play-state:paused!important}.scene:not(.is-visible) .petal,.scene:not(.is-visible) .bell{animation-play-state:paused}
@keyframes copy-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes logo-arrive{from{opacity:0;transform:translateY(9px) scale(.94);filter:blur(2px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes logo-light{0%{opacity:0;transform:translateX(-50%)}30%{opacity:.75}100%{opacity:0;transform:translateX(55%)}}
@keyframes name-write{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -8% 0 -8%)}}
@keyframes bell-sway{from{transform:rotate(-2.7deg)}to{transform:rotate(2.7deg)}}
@keyframes scroll-tick{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes petal-fall{0%{opacity:0;transform:translate3d(0,-10px,0) rotate(0)}9%{opacity:.65}88%{opacity:.6}100%{opacity:0;transform:translate3d(var(--drift),810px,0) rotate(var(--spin))}}
@keyframes flower-open{from{transform:rotate(var(--angle)) scaleY(.08);opacity:.4}to{transform:rotate(var(--angle)) scaleY(1);opacity:1}}
@keyframes seal-breathe{0%,100%{box-shadow:0 0 30px 7px #ffc86244}50%{box-shadow:0 0 45px 12px #ffc86277}}
@keyframes seal-lift{0%{transform:translate(-50%,-50%) scale(1);opacity:1}20%{transform:translate(-50%,-50%) scale(.97);opacity:1}60%{transform:translate(-50%,-59%) scale(1.04);opacity:1}100%{transform:translate(-50%,-85%) scale(1.08);opacity:0}}
@keyframes seams-light{0%{opacity:0;stroke-dashoffset:1}10%{opacity:1}48%,70%{opacity:1;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}}
@keyframes seal-flare{0%{box-shadow:0 0 35px 8px #ffd57966}55%{box-shadow:0 0 70px 24px #fff1b5,0 0 130px 40px #ffcc7499}100%{box-shadow:0 0 100px 38px #ffd57900}}
@keyframes golden-reveal{0%{opacity:0;transform:scale(.5)}35%{opacity:.95;transform:scale(.95)}63%{opacity:1;transform:scale(1.3)}100%{opacity:0;transform:scale(1.7)}}
@keyframes open-left{0%{transform:rotateY(0);opacity:1}78%{opacity:1}100%{transform:rotateY(-105deg);opacity:0}}
@keyframes open-right{0%{transform:rotateY(0);opacity:1}78%{opacity:1}100%{transform:rotateY(105deg);opacity:0}}
@keyframes open-top{0%{transform:rotateX(0);opacity:1}78%{opacity:1}100%{transform:rotateX(106deg);opacity:0}}
@keyframes open-bottom{0%{transform:rotateX(0);opacity:1}78%{opacity:1}100%{transform:rotateX(-106deg);opacity:0}}
@keyframes opening-away{from{opacity:1}to{opacity:0}}
@keyframes fade-out{to{opacity:0}}
@keyframes sound-wave{0%,100%{height:4px}50%{height:14px}}
@media(min-width:700px){body{background:radial-gradient(ellipse at 50% 5%,#77323b,#35111c 75%)}.invitation{box-shadow:0 0 0 1px #bc936040,0 20px 120px #17040c99}.opening{background:radial-gradient(ellipse at 50% 5%,#77323b,#35111c 75%)}}
@media(max-width:350px){.welcome-copy{left:11%;right:11%}.countdown{gap:10px}.welcome-ornament{margin-top:6%;margin-bottom:5%}.countdown-date{margin-top:12px}.intro-copy{left:4%;right:4%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js .intro-step,.js .reveal{opacity:1;transform:none}.couple-names span{clip-path:none!important}.petal-field,.opening-light{display:none}.bloom-petal{transform:rotate(var(--angle)) scaleY(1)}}


/* The reverse face shows the ivory lining as each paper flap turns. */
.paper-face{backface-visibility:hidden}.flap:after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#fff9e9,#e4d1ac);backface-visibility:hidden;transform:rotateY(180deg)}.flap-left:after{clip-path:polygon(100% 0,49% 50%,100% 100%)}.flap-right:after{clip-path:polygon(0 0,51% 50%,0 100%)}.flap-top:after{transform:rotateX(180deg);clip-path:polygon(0 100%,100% 100%,50% 49.7%)}.flap-bottom:after{transform:rotateX(180deg);clip-path:polygon(0 0,100% 0,50% 50.3%)}
.motion-paused .sound-bars i{animation-play-state:paused!important}

/* Each supplied transparent flap is registered to the same 9:16 hinge geometry. */
.flap-art{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden}.flap-left .paper-face{background:#681f2c}.flap-right .paper-face{background:#671d29}.flap-top .paper-face{background:#6b2430}.flap-bottom .paper-face{background:#641e2a}

/* Family blessings — the third 9:16 scene, with live, editable typography. */
.family{background:var(--ivory);border-top:1px solid #b8905030}
.family-link{position:absolute;bottom:4.5%;left:50%;transform:translateX(-50%);width:44px;height:38px;display:grid;place-items:center;color:#a38149;z-index:4}
.family-link svg{width:15px;height:22px}
.blessing-emblem{position:absolute;top:17%;left:0;right:0;width:12%;aspect-ratio:1;margin:0 auto;display:block}
.blessing-emblem img{position:relative;display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;filter:drop-shadow(0 1px 1.5px #9e6b2418)}
.blessing-glow{position:absolute;inset:17% 21%;border-radius:50%;background:radial-gradient(ellipse,#f8dda35e,transparent 70%);opacity:.45}
.family.is-visible .blessing-glow{animation:blessing-breathe 5.5s ease-in-out infinite}
.family-copy{position:absolute;inset:26% 4.5% 6.5%;display:flex;flex-direction:column;align-items:center;text-align:center}
.family-blessing{font-size:17px;font-size:4.4cqw;line-height:1.25;font-style:italic;font-weight:500;color:#9b783e;margin:0 0 2cqw}
.family-hosts{font-size:15px;font-size:3.95cqw;line-height:1.35;font-weight:600;color:#71303c;margin:0 0 2cqw}
.fit-line{width:100%;white-space:nowrap;letter-spacing:0}
.fit-line>span{display:inline-block;white-space:nowrap}
.family-request{width:100%;font-size:16px;font-size:4.23cqw;line-height:1.35;font-weight:400;color:#77594b;margin:0 0 2.5cqw}
.family-request p{margin:0}
.family-person{width:100%}
.family-name{font-family:var(--script);font-size:50px;font-size:13cqw;font-weight:400;line-height:1.14;margin:0;color:#812637;letter-spacing:0}
.family-name-ink{display:inline-block;padding:0 .13em}
.family-kinship{font-size:14px;font-size:3.55cqw;line-height:1.3;font-weight:500;color:#80544f;margin:1cqw 0 0}
.family-with{font-size:16px;font-size:4.1cqw;font-style:italic;line-height:1.25;color:#ac8850;margin:1.6cqw 0 1.4cqw}
.family-ornament{width:34%;height:18px;height:4.6cqw;flex:none;color:#b38a49;margin:2.5cqw 0 2cqw}
.family-hashtag{font-size:15px;font-size:3.9cqw;line-height:1.3;font-weight:500;color:#822d3e;margin:0}
.family .bloom-left{bottom:17%;left:3%;transform:rotate(-25deg) scale(.7)}
.family .bloom-right{bottom:12%;right:3%;transform:rotate(24deg) scale(.7)}
/* Screen 4 uses one timeline, independent of generic text observers. */
.js .family:not(.family-started) .family-step{opacity:0}
.family-started .family-blessing{animation:copy-arrive .65s ease both}
.family-started .family-hosts{animation:copy-arrive .6s ease .75s both}
.family-started .family-request{animation:copy-arrive .6s ease 1.45s both}
.family-started .family-groom .family-name-ink{animation:ink-arrive 1.35s ease 2.2s both}
.family-started .family-groom .family-kinship{animation:copy-arrive .55s ease 3.7s both}
.family-started .family-with{animation:copy-arrive .3s ease 4.4s both}
.family-started .family-bride .family-name-ink{animation:ink-arrive 1.25s ease 4.85s both}
.family-started .family-bride .family-kinship{animation:copy-arrive .55s ease 6.25s both}
.family-started .family-ornament{animation:copy-arrive .35s ease 6.9s both}
.family-started .family-hashtag{animation:copy-arrive .4s ease 7.35s both}
@keyframes blessing-breathe{0%,100%{opacity:.35;transform:scale(.94)}50%{opacity:.7;transform:scale(1.05)}}
@media(prefers-reduced-motion:reduce){.js .family-step{opacity:1;transform:none}.js .family-name-ink{clip-path:none!important}.blessing-glow{animation:none!important}}

/* Celebration path: four illustrated stops along one continuous gold line. */
.journey{background:var(--ivory);border-top:1px solid #b8905030}
.journey-heading{position:absolute;top:21%;left:8%;right:8%;text-align:center}
.journey-heading h2{font-family:var(--script);font-size:46px;font-size:11.8cqw;line-height:1.18;font-weight:400;color:#7f2638;margin:2.3cqw 0 1.8cqw}
.journey-intro{font-size:17px;font-size:4.35cqw;line-height:1.3;margin:0;color:#8b6954;font-style:italic}
.journey-list{position:absolute;inset:38% 9% 12%;padding:0;margin:0;list-style:none;display:grid;grid-template-rows:repeat(4,1fr);gap:1.8cqw}
.journey-list:before{content:'';position:absolute;left:10cqw;top:8%;bottom:8%;width:1px;border-left:1px dashed #be995b88;transform-origin:top;opacity:.8}
.journey-row{position:relative;display:flex;align-items:center;gap:3.5cqw;min-height:100%;text-decoration:none;border-radius:14px;transition:background .25s;outline-offset:3px}
.journey-row:hover,.journey-row:focus-visible{background:#f0e2c947}
.journey-art{position:relative;width:20cqw;height:19cqw;flex:none;display:block;background:radial-gradient(ellipse,#fffaf0 35%,#fffaf000 74%)}
.journey-art img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px #77582912)}
.journey-art small{position:absolute;left:-.5cqw;bottom:0;display:grid;place-items:center;width:5cqw;height:5cqw;border:1px solid #c4a57077;border-radius:50%;background:#fff9ed;font-family:var(--sans);font-size:2.15cqw;color:#9d7840}
.journey-wedding-art img{padding:0 1.5cqw}
.journey-text{display:flex;flex:1;min-width:0;flex-direction:column;gap:.65cqw}
.journey-text strong{font-weight:500;font-size:24px;font-size:6cqw;line-height:1.07;color:#7a2637}
.journey-text>span{font-size:13px;font-size:3.4cqw;line-height:1.2;font-weight:600;color:#93703b}
.journey-text>small{font-size:13px;font-size:3.3cqw;line-height:1.15;color:#896c5b}
.journey-arrow{width:15px;height:19px;flex:none;color:#b08648}
.journey-hint{position:absolute;bottom:6.5%;width:100%;text-align:center;font-family:var(--sans);font-size:9px;font-size:2.3cqw;color:#9c8055;letter-spacing:.07em;margin:0}
.journey.has-entered .journey-list:before{animation:path-unfurl 1.8s ease .3s both}

/* Event scenes keep words as HTML and use the supplied backgrounds as scenery. */
.event-scene{--event-ink:#772c37;--event-muted:#8d6848;--event-gold:#a87f38;--event-button:#fff6e3;color:var(--event-ink);border-top:1px solid #b8905030}
.event-copy{position:absolute;top:20%;left:9%;right:9%;text-align:center;display:flex;flex-direction:column;align-items:center;z-index:2}
.event-kicker{font-family:var(--sans);font-size:10px;font-size:2.6cqw;text-transform:uppercase;letter-spacing:.13em;line-height:1.4;color:var(--event-gold);margin:0 0 1.3cqw}
.event-title{font-family:var(--script);font-size:48px;font-size:12.4cqw;font-weight:400;line-height:1.12;margin:0 0 2.5cqw;color:var(--event-ink)}
.event-title-ink{display:inline-block;padding:0 .08em}
.event-poem{font-size:17px;font-size:4.4cqw;line-height:1.28;font-weight:500;font-style:italic;color:var(--event-muted);margin:0 0 3cqw;max-width:100%}
.event-datetime{display:flex;flex-direction:column;gap:.8cqw;margin:0 0 2cqw;color:var(--event-ink);font-variant-numeric:lining-nums}
.event-datetime time{font-size:20px;font-size:5cqw;line-height:1.1;font-weight:600;letter-spacing:.03em}
.event-datetime span{font-size:16px;font-size:4.05cqw;line-height:1.25}
.event-venue{display:flex;flex-direction:column;gap:.5cqw;text-decoration:none;margin:0 0 2.5cqw;color:var(--event-muted);max-width:100%;min-height:44px;justify-content:center}
.event-venue strong{font-size:16px;font-size:4cqw;font-weight:600;line-height:1.25}
.event-venue span{font-size:13px;font-size:3.4cqw;line-height:1.25}
.event-venue:hover strong{text-decoration:underline;text-underline-offset:3px}
.event-actions{display:flex;justify-content:center;align-items:center;gap:2cqw}
.venue-button,.path-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:25px;text-decoration:none;font-family:var(--sans);font-size:10px;font-size:2.55cqw;letter-spacing:.015em;transition:background .2s,box-shadow .2s}
.venue-button{padding:0 3.8cqw;background:var(--event-button);border:1px solid #b58b4777;color:#73313b;box-shadow:0 2px 6px #4230190c}
.venue-button svg{width:15px;height:17px}
.path-button{padding:0 3cqw;color:var(--event-muted);border:1px solid #ac895c55;background:#fffaf023}
.venue-button:hover{box-shadow:0 3px 12px #42301924}.path-button:hover{background:#fffaf055}
.event-couple{position:absolute;left:18%;width:64%;height:29.5%;bottom:7.5%;z-index:1;pointer-events:none}
.event-couple img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 5px 5px #18271d18)}
.event-scene .family-link{color:var(--event-gold);bottom:2%}
.ring-scene{--event-ink:#fff4d4;--event-muted:#f5e7c8;--event-gold:#e9c58b;background:#061c32}
.ring-scene .event-copy:before{content:'';position:absolute;inset:-7% -6% -4%;background:radial-gradient(ellipse,#03172978,transparent 73%);z-index:-1;pointer-events:none}
.ring-scene .event-title{font-size:12cqw;text-shadow:0 2px 12px #060d2599}
.ring-scene .event-venue{color:#fff4da}
.ring-scene .path-button{border-color:#ddc79c77;background:#0c20384d}
.haldi-scene{--event-ink:#923f21;--event-muted:#805230;--event-gold:#9b692a;background:#fff1cb}
.haldi-scene .event-copy{top:16.5%;left:12%;right:12%}
.haldi-scene .event-title,.mehendi-scene .event-title{font-size:14cqw}
.haldi-scene .event-couple{height:32%;left:15%;width:70%}
.haldi-scene .bloom-left{left:10%;bottom:14%;transform:scale(.85);opacity:.9}.haldi-scene .bloom-right{right:10%;bottom:24%;transform:scale(.7);opacity:.9}
.haldi-scene .bloom-petal{background:linear-gradient(#fff1a3,#e9b331 75%,#bf8520)}
.mehendi-scene{--event-ink:#842c3d;--event-muted:#375568;--event-gold:#667c73;--event-button:#fdf8ed;background:#d7effc}
.mehendi-scene .event-copy{top:11.5%;left:10%;right:10%}
.mehendi-scene .event-copy:before{content:'';position:absolute;inset:39% -5% -4%;background:radial-gradient(ellipse,#e2f1faed 4%,#e2f1fa9c 62%,transparent 78%);z-index:-1;pointer-events:none}
.mehendi-scene .event-couple{left:31%;width:63%;height:32%;bottom:7.5%}
.mehendi-scene .bloom-left{bottom:20%;left:7%;transform:rotate(-20deg) scale(.8)}
.mehendi-scene .bloom-right{bottom:14%;right:3%;transform:rotate(25deg) scale(.65)}
.mehendi-scene .bloom-petal{background:linear-gradient(#f8fdff,#9bc4dc 75%,#6b95ba);box-shadow:inset 0 0 0 .5px #759aba55}
.golden-petals .petal{background:radial-gradient(ellipse at 25% 25%,#fff2a1,#edbc4e 65%,#ce8e25)}
.blue-petals .petal{background:radial-gradient(ellipse at 25% 25%,#fcfdff,#a6cbe3 65%,#6395c0)}

/* Ambient motion: dimmer-like chandelier light, birds with moving wings, butterflies. */
.chandelier-lights,.sparkle-field{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.chandelier-lights i{position:absolute;left:var(--x);top:var(--y);width:15%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#ffe4a888,#ffd27c44 24%,transparent 69%);mix-blend-mode:screen;opacity:.2;animation:candle-glow 4.5s ease-in-out var(--light-delay) infinite}
.sparkle{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);opacity:0;color:#ffe2a7;animation:star-glimmer var(--duration) ease-in-out var(--delay) infinite;filter:drop-shadow(0 0 4px #ffdb91)}
.sparkle:before,.sparkle:after{content:'';position:absolute;background:currentColor;border-radius:100%;inset:0 45%}.sparkle:after{transform:rotate(90deg)}
.bird-flight{position:absolute;top:13%;left:-16%;width:12%;height:auto;aspect-ratio:1.6;pointer-events:none;z-index:4;opacity:0;animation:bird-cross 21s linear -3s infinite;filter:drop-shadow(0 1px 1px #446b7a26)}
.bird-flight svg,.butterfly-flight svg{width:100%;height:100%;display:block;overflow:visible}
.bird-wing,.bird-back-wing{fill:#fff9e9;stroke:#c4b181;stroke-width:.65;transform-origin:30px 25px;animation:wing-lift .65s ease-in-out infinite alternate}
.bird-back-wing{fill:#e8e1c5;animation-delay:-.3s}.bird-body{fill:#fff8e3;stroke:#bea97a;stroke-width:.6}
.mehendi-scene .bird-flight{top:7%;animation-duration:24s;animation-delay:-7s}
.mehendi-scene .bird-distant{top:57%;width:7%;animation-duration:29s;animation-delay:-15s;z-index:1}
.mehendi-scene .bird-wing{fill:#f5fcff;stroke:#7395af}.mehendi-scene .bird-body{fill:#edfaff;stroke:#7395af}.mehendi-scene .bird-back-wing{fill:#c2d8e5;stroke:#7395af}
.butterfly-flight{position:absolute;width:9%;aspect-ratio:1;z-index:4;pointer-events:none;filter:drop-shadow(0 2px 2px #618aa925)}
.butterfly-left{left:6%;top:55%;animation:butterfly-wander 14s ease-in-out -2s infinite}
.butterfly-right{right:8%;top:29%;width:7%;animation:butterfly-wander 17s ease-in-out -7s infinite reverse}
.butterfly-wing{fill:#91bfd8;stroke:#f8f1cf;stroke-width:1;transform-origin:24px 25px;animation:butterfly-flap .8s ease-in-out infinite alternate}
.wing-right{animation-delay:-.4s;fill:#d2e5ee}
.js .event-step{opacity:0;transform:translateY(10px)}
.js .event-title-ink{clip-path:inset(0 100% 0 0)}
.scene.has-entered .event-step{animation:copy-arrive .8s ease var(--delay,0ms) both}
.scene.has-entered .event-title-ink{animation:name-write 1.25s cubic-bezier(.25,.65,.45,1) .25s both}
.scene:not(.is-visible) .decorative-motion{animation-play-state:paused!important}
.motion-paused .scene.has-entered .event-step,.motion-paused .scene.has-entered .event-title-ink{animation-duration:.01ms!important;animation-delay:0ms!important}
.motion-paused .journey-list:before{animation-duration:.01ms!important;animation-delay:0ms!important}
@keyframes path-unfurl{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes candle-glow{0%,100%{opacity:.18;transform:translate(-50%,-50%) scale(.85)}50%{opacity:.55;transform:translate(-50%,-50%) scale(1.12)}}
@keyframes star-glimmer{0%,70%,100%{opacity:0;transform:scale(.45) rotate(0)}83%{opacity:.8;transform:scale(1) rotate(12deg)}}
@keyframes bird-cross{0%{opacity:0;transform:translate(0,0) rotate(-8deg)}6%{opacity:.85}30%{transform:translate(40cqw,-2cqw) rotate(5deg)}65%{opacity:.85;transform:translate(86cqw,2cqw) rotate(-4deg)}83%,100%{opacity:0;transform:translate(126cqw,-2cqw) rotate(5deg)}}
@keyframes wing-lift{from{transform:rotate(-13deg) scaleY(.7)}to{transform:rotate(15deg) scaleY(1)}}
@keyframes butterfly-wander{0%,100%{transform:translate(0,0) rotate(-15deg)}30%{transform:translate(3cqw,-4cqw) rotate(10deg)}65%{transform:translate(-1cqw,2cqw) rotate(-4deg)}}
@keyframes butterfly-flap{from{transform:scaleX(.38)}to{transform:scaleX(1)}}
@media(max-width:350px){.journey-list{left:7%;right:7%}.journey-row{gap:3cqw}.journey-arrow{width:12px}.event-copy{left:7%;right:7%}.haldi-scene .event-copy{left:11%;right:11%}.event-venue{min-height:40px}.event-actions{gap:1.5cqw}.venue-button,.path-button{font-size:9px}.event-couple{height:28%;bottom:7%}.haldi-scene .event-couple{height:30%}.mehendi-scene .event-couple{height:30%;bottom:6.5%}}
@media(prefers-reduced-motion:reduce){.js .event-step{opacity:1;transform:none}.js .event-title-ink{clip-path:none!important}.bird-flight,.butterfly-flight,.sparkle-field{display:none}.chandelier-lights i{animation:none!important;opacity:.2}.journey-list:before{transform:none!important}}

.mehendi-scene .event-poem{font-size:16px;font-size:4.1cqw;line-height:1.24}

/* Closing chapters: the same 9:16 invitation, with room for every detail. */
.wedding-scene{--event-ink:#80283b;--event-muted:#805936;--event-gold:#a68045;background:#fff7e8}
.wedding-scene .event-copy{top:18%;left:8%;right:8%}
.wedding-scene .event-poem{font-size:4.1cqw;line-height:1.23;margin-bottom:2.6cqw}
.wedding-scene .event-datetime{gap:1cqw}
.wedding-scene .event-datetime span{font-size:3.8cqw}
.wedding-scene .event-couple{height:26%;width:60%;left:20%;bottom:8.5%}
.wedding-scene .family-link{bottom:1.5%;color:#8b5935}
.mandap-glow{position:absolute;left:24%;right:24%;top:67%;bottom:12%;border-radius:50%;background:radial-gradient(ellipse,#ffd88e45,transparent 72%);mix-blend-mode:soft-light;animation:mandap-light 5s ease-in-out infinite;pointer-events:none}
.mandap-sparkles{top:62%;bottom:7%}
.mandap-sparkles .sparkle{color:#d6ad60;filter:drop-shadow(0 0 3px #e9cd8a)}
.programme,.rsvp{background:var(--ivory);border-top:1px solid #b8905030}
.programme-heading{position:absolute;top:21%;left:8%;right:8%;text-align:center}
.programme-heading h2{font-family:var(--script);font-size:11.8cqw;font-weight:400;line-height:1.16;margin:2.5cqw 0 1.8cqw;color:#7e2839}
.programme-intro{font-size:4.35cqw;line-height:1.25;font-style:italic;color:#8b6954;margin:0}
.programme-list{position:absolute;inset:38% 10% 19%;list-style:none;margin:0;padding:0;display:grid;grid-template-rows:1.15fr .75fr 1.1fr;gap:2cqw}
.programme-list:before{content:'';position:absolute;left:10cqw;top:4%;bottom:7%;width:1px;border-left:1px dashed #bb945b80;transform-origin:top}
.programme.has-entered .programme-list:before{animation:path-unfurl 2s ease both}
.programme-stop{display:grid;grid-template-columns:20cqw 1fr;gap:4cqw;align-items:start;position:relative}
.programme-stop>time{background:#fbf5e7;border:1px solid #c4a47677;border-radius:50%;width:20cqw;height:20cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1cqw;font-size:7cqw;line-height:.9;font-variant-numeric:lining-nums;color:#875f35;box-shadow:0 2px 8px #a8803810}
.programme-stop>time span{font-family:var(--sans);font-size:2.05cqw;line-height:1.2;letter-spacing:.015em}
.programme-stop h3{font-size:5.05cqw;line-height:1.12;font-weight:600;color:#822e3e;margin:0 0 1.1cqw}
.programme-place{display:block;min-height:44px;font-size:3.8cqw;line-height:1.2;color:#805e45;text-decoration:none;padding:0 0 1cqw}
.programme-place>span{display:flex;align-items:center;gap:1cqw;font-family:var(--sans);font-size:2.2cqw;letter-spacing:.01em;color:#a07439;margin-top:1.3cqw}
.programme-place svg{width:12px;height:12px;flex:none}
.programme-place:hover,.programme-place:focus-visible{text-decoration:underline;text-underline-offset:3px}
.programme-detail{font-size:3.85cqw;line-height:1.2;font-style:italic;color:#8a6951;margin:0}
.programme-actions{position:absolute;bottom:9.5%;left:8%;right:8%;display:flex;justify-content:center;align-items:center;gap:2cqw}
.programme-actions .venue-button{padding:0 3cqw}
.programme .bloom-left{bottom:9%;left:3%;transform:scale(.65)}
.programme .bloom-right{bottom:19%;right:1%;transform:scale(.65)}
.programme .family-link{bottom:2%}
.closing-logo{position:absolute;top:15.5%;left:42%;width:16%;aspect-ratio:1}
.closing-logo img{width:100%;height:100%;display:block;object-fit:contain;filter:drop-shadow(0 2px 2px #aa7a3c22)}
.rsvp-copy{position:absolute;top:26%;left:8%;right:8%;text-align:center;display:flex;flex-direction:column;align-items:center}
.closing-title{font-family:var(--script);font-size:12cqw;line-height:1.13;font-weight:400;margin:0 0 3cqw;color:#7e2839}
.closing-family{margin:0 0 4cqw}
.closing-family p{font-size:4.25cqw;line-height:1.25;margin:0;color:#8a6243}
.closing-family p:first-child{font-size:4.65cqw;letter-spacing:.07em;margin-bottom:1cqw;color:#7e3341}
.rsvp-intro{margin:0 0 2.8cqw}
.rsvp-intro>.eyebrow{margin:0 0 1.8cqw;font-size:2.5cqw}
.rsvp-intro>p:not(.eyebrow){font-size:4cqw;line-height:1.2;margin:0 0 1cqw;color:#8a6951}
.rsvp-intro h3{font-size:5cqw;line-height:1.2;font-weight:600;margin:0;color:#7e3341}
.contact-list{width:100%;display:flex;flex-direction:column;gap:2cqw}
.contact-row{display:flex;align-items:center;gap:1cqw;padding:1.4cqw 1.8cqw;border:1px solid #c5a27466;border-radius:12px;background:#fffaf0b3;box-shadow:0 3px 12px #a97a3e06}
.contact-number{display:flex;align-items:center;flex:1;min-height:44px;white-space:nowrap;text-decoration:none;font-size:4.15cqw;font-weight:600;font-variant-numeric:lining-nums;color:#7e3341}
.contact-action{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-height:44px;min-width:44px;text-decoration:none;color:#8d6940;border-radius:9px}
.contact-action svg{width:17px;height:17px}.contact-action span{font-family:var(--sans);font-size:2.15cqw;line-height:1.2}
.whatsapp-action{min-width:16cqw;color:#673640;background:#efe3ce70}
.contact-action:hover,.contact-action:focus-visible{background:#e9d8b9b3}.contact-number:hover{text-decoration:underline;text-underline-offset:3px}
.closing-ornament{width:37%;height:4cqw;flex:none;margin:3.5cqw 0 2.5cqw;color:#b38b4b}
.closing-signature p{font-family:var(--script);font-size:8cqw;line-height:1.2;margin:0 0 1cqw;color:#7e2839}
.closing-hashtag{font-size:3.7cqw;line-height:1.2;color:#915147}
.back-to-celebrations{display:flex;align-items:center;justify-content:center;gap:2cqw;min-height:44px;font-family:var(--sans);font-size:2.35cqw;letter-spacing:.02em;color:#977b54;text-decoration:none;margin-top:1cqw}
.back-to-celebrations svg{width:13px;height:13px;transform:rotate(-90deg)}
.rsvp .bloom-left{bottom:8%;left:3%;transform:scale(.65)}.rsvp .bloom-right{bottom:13%;right:2%;transform:scale(.65)}
.invitation{padding-bottom:max(76px,calc(env(safe-area-inset-bottom) + 60px))}
.venue-button,.path-button{font-size:clamp(10px,2.7cqw,12px)}
.family-link{height:44px}
.family-link svg{animation:scroll-tick 2.6s ease-in-out infinite}

/* Text stays readable by default; entry animations are progressive enhancement. */
.ink-reveal{display:inline-block;padding:0 .13em}
.word-ink{display:inline-block}
.js .motion-item{opacity:1;transform:none}
.js .ink-reveal{clip-path:none}
.js .word-ink{opacity:1;transform:none}
.motion-item.has-arrived{animation:copy-arrive .7s cubic-bezier(.2,.7,.3,1) var(--arrival-delay,0ms) both}
.has-arrived .ink-reveal{animation:ink-unfold 1.4s cubic-bezier(.22,.7,.3,1) calc(var(--arrival-delay,0ms) + .1s) both}
.has-arrived .word-ink{animation:word-arrive .6s cubic-bezier(.2,.7,.3,1) calc(var(--arrival-delay,0ms) + var(--word-delay,0ms)) both}
.has-arrived.closing-logo{animation:logo-arrive 1.15s cubic-bezier(.16,1,.3,1) both}
.motion-paused .motion-item,.motion-paused .word-ink{animation:none!important;opacity:1!important;transform:none!important}
.motion-paused .ink-reveal{animation:none!important;clip-path:none!important}
.motion-paused .intro-started .intro-step,.motion-paused .intro-started .couple-names span{animation-duration:.01ms!important;animation-delay:0ms!important}
.motion-paused .logo-glint{animation:none!important;opacity:0!important}
.motion-paused .family-link svg,.page-hidden .family-link svg{animation-play-state:paused}
.motion-paused .programme-list:before{animation-duration:.01ms!important}
@keyframes word-arrive{from{opacity:0;transform:translateY(.32em)}to{opacity:1;transform:translateY(0)}}
@keyframes ink-unfold{from{clip-path:inset(-15% 100% -20% 0)}to{clip-path:inset(-15% -10% -20% -10%)}}
@keyframes mandap-light{0%,100%{opacity:.45;transform:scale(.92)}50%{opacity:.9;transform:scale(1.05)}}
@media(max-width:350px){.wedding-scene .event-copy{top:17.5%;left:7%;right:7%}.wedding-scene .event-couple{height:25%;bottom:7.5%}.programme-list{left:8%;right:8%;gap:1.6cqw}.programme-actions{left:6%;right:6%}.rsvp-copy{left:7%;right:7%;top:25%}.contact-row{padding:1cqw 1.4cqw}.closing-family{margin-bottom:3cqw}.closing-ornament{margin-top:2.5cqw;margin-bottom:2cqw}.back-to-celebrations{margin-top:0}}
@media(prefers-reduced-motion:reduce){.js .motion-item,.js .word-ink{opacity:1!important;transform:none!important;animation:none!important}.js .ink-reveal{clip-path:none!important;animation:none!important}.family-link svg{animation:none!important}.mandap-glow{animation:none!important}.programme-list:before{transform:none!important}}

/* Screen 1 after the HP envelope: Ganesh ji, gold mandala, Hindi blessing. */
.blessing-opening{background:var(--ivory)}
.blessing-canvas{position:absolute;inset:0;isolation:isolate;overflow:hidden;background:var(--ivory)}
.devotional-aura{position:absolute;left:15%;right:15%;top:24%;height:39%;border-radius:50%;background:radial-gradient(ellipse,#fbe4a775,transparent 70%);pointer-events:none}
.ganesha-composition{position:absolute;top:22.5%;left:13%;width:74%;aspect-ratio:1}
.mandala-arrival{position:absolute;inset:0;opacity:.6}
.rotating-mandala{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 3px #a7732230)}
.ganesha-figure{position:absolute;left:23%;top:16%;width:54%;height:68%;transform-origin:center;opacity:.85;filter:drop-shadow(0 4px 5px #af7c2f18)}
.ganesha-figure svg{display:block;width:100%;height:100%;overflow:visible}
.ganesha-brush-stroke{stroke-dasharray:1;stroke-dashoffset:0}
.mantra-copy{position:absolute;top:64%;left:5%;right:5%;color:#7d2c36;text-align:center;font-family:'Noto Serif Devanagari','Mangal',serif;font-weight:500}
.mantra-line{font-size:4.35cqw;line-height:1.9;margin:0;white-space:nowrap;width:100%}
.mantra-ink{display:inline-block;white-space:nowrap;clip-path:inset(-15% 100% -20% 0)}
.mantra-heading{font-size:4.8cqw;color:#9a7338;margin-bottom:2.5cqw}
/* Hide the unrevealed artwork under the fading envelope. Never remount it. */
.js .blessing-opening:not(.blessing-started) .ganesha-figure,
.js .blessing-opening:not(.blessing-started) .mandala-arrival{opacity:0}
.js .blessing-opening:not(.blessing-started) .ganesha-brush-stroke{stroke-dashoffset:1}
.blessing-started .ganesha-figure{animation:ganesha-zoom 2.8s cubic-bezier(.2,.7,.3,1) both}
.blessing-started .ganesha-brush-stroke{animation:brush-paint 2.8s cubic-bezier(.3,.1,.3,1) both}
.blessing-started .mandala-arrival{animation:mandala-enter 1s ease 2.9s both}
.blessing-started .rotating-mandala{animation:mandala-revolve 56s linear 2.9s infinite}
.blessing-started .mantra-salutation{animation:mantra-type 1.2s steps(18,end) 4s both}
.blessing-started .devotional-aura{animation:blessing-breathe 6s ease-in-out infinite}
.blessing-started .mantra-first{animation:mantra-type 2.7s steps(35,end) 5.4s both}
.blessing-started .mantra-second{animation:mantra-type 2.9s steps(38,end) 8.3s both}
.blessing-paused .ganesha-figure,.blessing-paused .mandala-arrival{animation:none!important;opacity:1;transform:none}
.blessing-paused .ganesha-brush-stroke{animation:none!important;stroke-dashoffset:0}
.blessing-paused .rotating-mandala,.blessing-paused .devotional-aura,.blessing-paused .sound-bars i{animation-play-state:paused!important}
.blessing-paused.blessing-started .mantra-ink{animation:none!important;clip-path:none}
.page-hidden .blessing-opening *{animation-play-state:paused!important}
@keyframes brush-paint{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ganesha-zoom{0%{opacity:0;transform:scale(.8)}20%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes mandala-enter{from{opacity:0;transform:scale(.9) rotate(-12deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes mandala-revolve{to{transform:rotate(360deg)}}
@keyframes mantra-type{from{clip-path:inset(-15% 100% -20% 0)}to{clip-path:inset(-15% -3% -20% -3%)}}

/* Ground the cutouts by their feet, relative to the floor in each backdrop. */
.event-couple:before{content:'';position:absolute;left:29%;width:44%;height:3.2cqw;bottom:calc(var(--floor-contact,2%) - 1.6cqw);background:radial-gradient(ellipse,#482b2866,transparent 70%);filter:blur(1.7px);pointer-events:none}
.event-couple img{position:relative;z-index:1}
.ring-scene .event-copy{top:24.5%}
.ring-scene .event-couple{height:26%;width:60%;left:20%;bottom:5.5%;--floor-contact:1.4%}
.ring-scene .event-kicker{font-size:2.75cqw;letter-spacing:.11em;color:#f4d497;text-shadow:0 1px 5px #02152a}
.haldi-scene .event-couple{height:32%;width:72%;left:20%;bottom:5.5%;--floor-contact:3.2%}
.mehendi-scene .event-couple{height:30%;width:66%;left:24%;bottom:4.8%;--floor-contact:2.4%}
.wedding-scene .event-couple{height:23.8%;width:60%;left:20%;bottom:4.7%;--floor-contact:4.3%}
.wedding-scene .family-link{bottom:0}
.ring-scene .chandelier-lights i{width:20%;background:radial-gradient(#fff0b5aa,#ffc65c66 20%,transparent 69%);animation:chandelier-shimmer 4.8s ease-in-out var(--light-delay) infinite}
.firework-field{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.firework{position:absolute;left:var(--burst-x);top:var(--burst-y)}
.firework-ray{position:absolute;width:2px;height:2px;border-radius:50%;background:#ffe8aa;box-shadow:0 0 3px #ffce69,0 0 6px #ffb85f66;opacity:0;animation:firework-burst 8.5s ease-out var(--ray-delay) infinite}
.firework:nth-child(2) .firework-ray{background:#e6f4ff;box-shadow:0 0 3px #c2e0ff,0 0 6px #d8dfff55}
@keyframes chandelier-shimmer{0%,100%{opacity:.25;transform:translate(-50%,-50%) scale(.9)}35%{opacity:.68;transform:translate(-50%,-50%) scale(1.03)}55%{opacity:.35;transform:translate(-50%,-50%) scale(.96)}75%{opacity:.76;transform:translate(-50%,-50%) scale(1.08)}}
@keyframes firework-burst{0%,18%{opacity:0;transform:translate(0,0) scale(.2)}21%{opacity:.75;transform:translate(0,0) scale(.7)}36%{opacity:.65;transform:translate(var(--ray-x),var(--ray-y)) scale(1)}58%,100%{opacity:0;transform:translate(calc(var(--ray-x) * 1.15),calc(var(--ray-y) * 1.15 + 4cqw)) scale(.35)}}
@media(max-width:350px){.ring-scene .event-copy{top:24%}.ring-scene .event-couple{height:25%;bottom:5%}.haldi-scene .event-couple{height:31%;bottom:5%}.mehendi-scene .event-couple{height:29%;bottom:4.5%}.wedding-scene .event-couple{height:23.5%;bottom:4.5%}}
@media(prefers-reduced-motion:reduce){.ganesha-figure,.mandala-arrival{opacity:1!important;transform:none!important;animation:none!important}.ganesha-brush-stroke{stroke-dashoffset:0!important;animation:none!important}.blessing-started .mantra-ink{clip-path:none!important;animation:none!important}.rotating-mandala,.devotional-aura{animation:none!important}.firework-field{display:none}.ring-scene .chandelier-lights i{animation:none!important;opacity:.3}}
.scene:not(.is-visible) .rotating-mandala,.scene:not(.is-visible) .devotional-aura{animation-play-state:paused}
/* Keep controls outside the reading viewport, including the phone safe area. */
:root{--player-height:calc(70px + env(safe-area-inset-bottom,0px))}
body{height:100vh;height:100dvh;overflow:hidden}
.invitation-viewport{height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;scroll-padding-block:12px;overscroll-behavior-y:contain}
.invitation-open .invitation-viewport{height:calc(100vh - var(--player-height));height:calc(100dvh - var(--player-height))}
.is-sealed .invitation-viewport{overflow:hidden}
.invitation{container-type:inline-size;padding-bottom:18px}
.controls{bottom:0;width:min(100%,430px);height:var(--player-height);padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));background:#faf5e9;border-top:1px solid #bd975d66;box-shadow:0 -4px 18px #3215230c;pointer-events:auto}
.controls button{background:#fffaf1;backdrop-filter:none}


/* Essential details cannot be gated by an observer or covered by ornaments. */
.intro-copy,.welcome-copy,.family-copy,.journey-heading,.journey-list,.journey-hint,.event-copy,.programme-heading,.programme-list,.programme-actions,.rsvp-copy,.closing-logo,.mantra-copy{z-index:5}
.event-venue,.event-datetime,.event-actions,.programme-place,.contact-row{opacity:1!important;transform:none!important;animation:none!important;clip-path:none!important}
/* Live venue lettering sits directly on the supplied scenery. */
.event-scene .event-venue{width:100%;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;color:var(--event-muted);margin-bottom:2cqw;gap:.35cqw}
.event-scene .event-venue strong,.event-scene .event-venue .venue-name{font-size:clamp(14px,3.6cqw,15.5px);line-height:1.2;font-weight:600;color:var(--event-ink)}
.event-scene .event-venue span{font-size:14px;line-height:1.22}
.event-scene .event-poem{font-size:clamp(14px,3.6cqw,15.5px);line-height:1.25;margin-bottom:2cqw}
.ring-scene .event-venue{text-shadow:0 1px 5px #02152a}
.haldi-scene .event-venue{text-shadow:0 1px 3px #fff8de}
.mehendi-scene .event-venue{text-shadow:0 1px 3px #edf8ff}

/* Larger portraits, grounded to the individual 9:16 backdrops. Numeric size is
   in scene-width percent; floor is in scene-height percent. JS only caps a
   portrait when the measured text needs extra space. It never stretches it. */
.event-scene{--event-top:32cqw;--portrait-size:54;--portrait-floor:5.5;display:block;padding:0;height:177.7778cqw;min-height:0}
.event-scene .event-copy{position:absolute;top:var(--event-top);left:8%;right:8%;margin:0}
.event-scene .event-title{margin-bottom:2cqw}
.event-scene .event-datetime{margin-bottom:1.5cqw}
.event-scene .event-couple{position:absolute;left:15%;bottom:calc(var(--portrait-floor) * 1%);width:70%;height:calc(var(--portrait-size) * 1cqw);margin:0}
.ring-scene{--event-top:40cqw;--portrait-size:54;--portrait-floor:5.5}
.ring-scene .event-title{font-size:11.5cqw}
.haldi-scene{--event-top:31cqw;--portrait-size:65;--portrait-floor:5.5}
.haldi-scene .event-copy{left:12%;right:12%}
.haldi-scene .event-couple{width:70%;left:18%;--floor-contact:2.1%}
.mehendi-scene{--event-top:20.4cqw;--portrait-size:67;--portrait-floor:4.8}
.mehendi-scene .event-copy{left:10%;right:10%}
.mehendi-scene .event-couple{width:76%;left:18%}
.wedding-scene{--event-top:32cqw;--portrait-size:46;--portrait-floor:4.3}
.wedding-scene .event-couple{width:60%;left:21.5%}
.event-scene .family-link{bottom:0;height:36px;min-height:36px;z-index:6}
.event-couple img{object-fit:contain;object-position:center bottom}

/* Three full programme entries, including both clickable home addresses. */
.programme-heading{top:19%}
.programme-list{inset:35% 9% 15%;grid-template-rows:repeat(3,1fr);gap:1.8cqw}
.programme-stop h3{line-height:1.08;margin-bottom:1cqw}
.programme-place{font-size:14px;line-height:1.22;padding-bottom:0}
.programme-place>span{font-size:10px;line-height:1.2;margin-top:1cqw}
.programme-actions{bottom:6.2%}
.programme .family-link{bottom:0;height:36px}

.page-hidden .intro-step,.page-hidden .logo-glint,.page-hidden .motion-item,.page-hidden .word-ink,.page-hidden .ink-reveal{animation-play-state:paused!important}
.motion-paused .introduction .intro-step{opacity:1!important}
@media(max-width:350px){.event-scene .event-actions{gap:1.5cqw}.event-scene .event-kicker{letter-spacing:.09em}.programme-list{left:8%;right:8%}}
@media(prefers-reduced-motion:reduce){.invitation-viewport{scroll-behavior:auto}.js .introduction .intro-step{opacity:1!important;transform:none!important}.logo-glint{display:none}}

.opening .petal-field{z-index:7}.opening .petal{animation-play-state:running}

/* Pause timelines offscreen instead of consuming their entrances unseen. */
.introduction:not(.is-visible) .intro-step,.introduction:not(.is-visible) .logo-glint,.introduction:not(.is-visible) .intro-hearts span,
.family:not(.is-visible) .family-step,.blessing-opening:not(.is-visible) .ganesha-figure,.blessing-opening:not(.is-visible) .ganesha-brush-stroke,.blessing-opening:not(.is-visible) .mandala-arrival,.blessing-opening:not(.is-visible) .mantra-ink,
.page-hidden .intro-hearts span,.page-hidden .family-step{animation-play-state:paused}
.motion-paused .introduction .intro-step,.motion-paused .family .family-step{animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}
.motion-paused .intro-hearts{display:none}
@media(prefers-reduced-motion:reduce){.js .family .family-step,.js .introduction .intro-step{opacity:1!important;transform:none!important;clip-path:none!important;animation:none!important}.intro-hearts{display:none}}