/* A quiet, continuous painted journey. */
body{background:#f5f0e5}.welcome{height:116px;text-align:center;background:radial-gradient(ellipse at center,#dbe9e5aa,transparent 70%),#faf6ec}.welcome .bell{width:130px;height:112px;border:0;border-radius:0;margin:auto;display:flex;flex-direction:column;gap:0}.welcome .bell svg{width:66px;height:82px;transform-origin:50% 0}.welcome .bell span{font-size:14px;color:#725b40}.artwork-sequence{background:radial-gradient(ellipse at 0 30%,#c8ded855,transparent 65%),radial-gradient(ellipse at 100% 70%,#eddbbd66,transparent 60%),#faf8f1}.artwork-page:after{content:'';position:absolute;inset:auto 0 -1px;height:5%;background:linear-gradient(transparent,#faf8f1);pointer-events:none;z-index:1}.artwork-page:not(:first-child):before{content:'';position:absolute;inset:-1px 0 auto;height:5%;background:linear-gradient(#faf8f1,transparent);pointer-events:none;z-index:1}.river-current{z-index:2}.scratch-cloud{position:absolute;left:32%;top:13%;width:38%;height:21%;z-index:5;line-height:1.4;transition:opacity 1.2s; border-radius:40%}.scratch-cloud canvas{width:100%;height:100%;touch-action:none;border-radius:35%;display:block}.reveal-logo{position:absolute;left:-10%;right:-10%;top:42%;width:120%;font:clamp(13px,3.4vw,21px)/1.4 Girassol;color:#416b7c;text-shadow:0 1px 8px white;pointer-events:auto}.scratch-cloud.revealed{opacity:0;pointer-events:none}.weather{position:fixed;inset:0;max-width:680px;margin:auto;z-index:9;pointer-events:none;overflow:hidden}.weather i{position:absolute;top:-40px;left:var(--x);width:9px;height:15px;border-radius:75% 15% 70% 20%;background:radial-gradient(#efc4b7,#cf8f9066);opacity:.48;animation:petal-fall var(--duration) linear infinite;animation-delay:var(--delay)}.weather.snow i{width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 5px #fff;opacity:.65}.weather.quiet{opacity:0}.weather{transition:opacity 1s}.weather.paused i{animation-play-state:paused}@keyframes petal-fall{0%{transform:translate(0,-3vh) rotate(0)}100%{transform:translate(45px,110vh) rotate(290deg)}}
.lake-offering{height:85svh;min-height:500px;max-height:850px;position:relative;overflow:hidden;padding:65px 24px 24px;display:flex;flex-direction:column;align-items:center;background:linear-gradient(#faf6ec 0%,#faf6ec55 22%,transparent 48%),url('assets/pushkar-watercolor.png') center/cover}.lake-offering h2{font:34px/1.25 'Capitaly Script';color:#315c68}.lake-offering>p{font-size:16px;margin-top:12px}.offer-lotus{margin-top:auto;z-index:2;border:1px solid #c0a578;background:#fff7e7df;border-radius:40px;padding:14px 26px;min-height:48px;color:#315c68}.offering-status{min-height:27px;background:#faf6ecb0;border-radius:12px;padding:0 10px}.lake-flowers{position:absolute;inset:42% 0 15%;pointer-events:none}.lake-lotus{position:absolute;width:64px;height:64px;left:var(--left);bottom:5%;background:url('assets/vector-atlas.png') 100% 100%/300% 300%;clip-path:inset(0 0 0 8.5%);animation:lotus-offering 12s ease-out forwards;filter:drop-shadow(0 8px 3px #315c6644)}@keyframes lotus-offering{from{transform:translateY(40px) scale(1.1);opacity:0}15%{opacity:1}to{transform:translateY(-90px) translateX(18px) scale(.65);opacity:.8}}
.family-wash{background:#faf6ec88}.family-content{background:linear-gradient(#faf6ecdd,#faf6ec44 15%,#faf6ec66 85%,#faf6ec)}.rsvp-form{margin:35px auto;max-width:440px;padding:26px 20px;background:#faf6ece8;border:1px solid #c8b48a88;border-radius:44% 44% 18px 18px / 18px 18px 18px 18px;text-align:left;text-shadow:none}.rsvp-form h2{text-align:center}.rsvp-form label,.rsvp-form legend{font-size:16px}.rsvp-form>label{display:block;margin:16px 0 7px}.rsvp-form input:not([type=radio]),.rsvp-form select{width:100%;font:16px Girassol;padding:12px;background:#fffaf0;color:#573e2c;border:1px solid #bca580;border-radius:5px}.rsvp-form fieldset{border:0;padding:0;margin:22px 0}.rsvp-form fieldset label{display:flex;align-items:center;gap:9px;min-height:46px}.rsvp-form input[type=radio]{width:19px;height:19px;accent-color:#477b7a}.rsvp-form .primary{width:100%;margin-top:22px;border-radius:5px}.rsvp-form .rsvp-note{font-size:13px;line-height:1.5;text-align:center;margin-top:10px}.map-directions{display:flex;gap:12px;align-items:center;justify-content:center;margin:24px 0;min-height:60px}.map-directions svg{width:32px;height:42px}.map-directions small{font-size:14px}.closing-shiv-shakti{margin-top:-1px}button:focus-visible{outline-offset:4px}
@media(prefers-reduced-motion:reduce){.weather{display:none}.scratch-cloud{transition:none}.lake-lotus{animation:none;opacity:1;bottom:25%}}

/* Watercolour assets shared by the river and the lake. */
.scroll-lotus .flower,.lake-lotus{background-image:url('assets/lotus-watercolor.png');background-size:contain;background-position:center;background-repeat:no-repeat;clip-path:none}
.scratch-cloud{left:29%;top:12.5%;width:44%;height:22%;border-radius:0}
.scratch-cloud canvas{border-radius:0}
.cloud-wisp{position:absolute;pointer-events:none;z-index:3;width:28%;height:auto;opacity:.7}
.cloud-wisp-left{left:1%;top:22%;transform:rotate(-7deg)}
.cloud-wisp-right{right:1%;top:20%;transform:rotate(6deg) scaleX(-1)}
#kailash>img:first-child{clip-path:polygon(18% 0,82% 0,82% 19%,100% 19%,100% 100%,0 100%,0 19%,18% 19%)}
#kailash{background:#f9f6ed}
.bell-cluster{position:absolute;top:0;width:18%;height:19%;background-image:url('assets/user-pages/page-1.webp');background-size:555.5556% 526.3158%;transform-origin:50% 0;z-index:4;pointer-events:none;mask-image:linear-gradient(#000 92%,transparent)}
.bell-cluster-left{left:0;background-position:0 0}.bell-cluster-right{right:0;background-position:100% 0}
.bells-in-wind .bell-cluster-left{animation:side-bells 4.8s ease-in-out infinite}.bells-in-wind .bell-cluster-right{animation:side-bells 5.3s ease-in-out infinite reverse}
@keyframes side-bells{0%,100%{transform:rotate(0)}25%{transform:rotate(2deg)}75%{transform:rotate(-1.7deg)}}
.continuous-waterfall{position:absolute;left:12%;right:12%;top:20%;bottom:0;pointer-events:none;z-index:3;opacity:.13;background:url('assets/waterfall-watercolor.png') center top/100% 1100px repeat-y;mask-image:linear-gradient(transparent,#000 6%,#000 94%,transparent);animation:falling-water 55s linear infinite;mix-blend-mode:multiply}
@keyframes falling-water{to{background-position:center 1100px}}
@media(prefers-reduced-motion:reduce){.bell-cluster,.continuous-waterfall{animation:none!important}}
.continuous-waterfall{background-size:100% 100%;background-repeat:no-repeat;animation:waterfall-wash 14s ease-in-out infinite alternate}
@keyframes waterfall-wash{from{opacity:.11;filter:brightness(1)}to{opacity:.17;filter:brightness(1.08)}}
@media(prefers-reduced-motion:reduce){.continuous-waterfall{animation:none}}

/* One quiet cloud reserved for the monogram. */
.scratch-cloud{left:31%;top:13%;width:40%;height:21%}
.scratch-cloud canvas{filter:saturate(.48) brightness(1.09);opacity:.94}
.reveal-logo{font-size:clamp(12px,3.1vw,19px);color:#527180}
/* Shiva–Shakti looking over Pushkar, without the former side decorations. */
.closing-shiv-shakti{aspect-ratio:4/5;position:relative;mask-image:none;-webkit-mask-image:none;background:linear-gradient(#faf6ec,transparent 24%),url('assets/pushkar-watercolor.png') center/cover no-repeat}
.closing-shiv-shakti:after{content:'';position:absolute;inset:20% 0 0;background:url('assets/shiv-shakti-blessing.png') center bottom/88% auto no-repeat;pointer-events:none}
/* Extended sky and feathered opening. */
.welcome{position:relative;height:150px;padding-top:12px;margin-bottom:-24px;z-index:5;background:radial-gradient(ellipse at 50% 18%,#d7e7eecc,transparent 70%),url('assets/cloud-watercolor.png') center 35%/110% auto no-repeat,#faf6ec;mask-image:linear-gradient(#000 0%,#000 64%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0%,#000 64%,transparent 100%)}
.welcome .bell{position:relative;z-index:2;height:105px}
#kailash:before{content:'';position:absolute;top:0;left:0;right:0;height:32px;z-index:6;background:linear-gradient(#faf6ecbb,transparent);pointer-events:none}
.bell-cluster{mask-image:linear-gradient(transparent 0%,#000 5%,#000 94%,transparent);-webkit-mask-image:linear-gradient(transparent 0%,#000 5%,#000 94%,transparent)}
/* Narrow fades preserve the 26 November artwork. */
#day-26>img{mask-image:linear-gradient(to bottom,transparent,#000 2.5%,#000 97.5%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 2.5%,#000 97.5%,transparent)}
#day-26:before,#day-26:after{height:2%}
.temple-transition{top:-32px;height:77px}

/* Transparent bell artwork moves independently of the scenery. */
.bell-cluster{background-size:100% 100%;background-repeat:no-repeat;mask-image:none;-webkit-mask-image:none;height:24%;width:18%;transform-origin:50% 0}
.bell-cluster-left{background-image:url('assets/bells-left.png')}
.bell-cluster-right{background-image:url('assets/bells-right.png')}
.welcome{background:#faf6ec}
.scratch-cloud{touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}
.scratch-cloud canvas{filter:brightness(1.08);opacity:.94}
.reveal-logo{touch-action:none;color:#836444}

/* Stationary sky fills only the cut-out areas behind the transparent bells. */
#kailash{background:#f9f6ed url('assets/kailash-sky-repaired.webp') center top/100% 100% no-repeat}

/* Concise temple reveal and a clean end to the invitation. */
.temple-journey{height:220svh}
.ganesh-icon{display:block;width:clamp(64px,20vw,105px);height:auto;object-fit:contain;flex-shrink:0;margin:0 auto 6px}
.family-content h2.complete-heading,.lake-offering h2.complete-heading{font-family:Girassol;font-size:27px;line-height:1.35}
.calendar-action{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px auto;min-height:60px;font-size:16px}
.calendar-action svg{width:32px;height:42px;flex-shrink:0}
.calendar-action small{font:14px Girassol}
html,body{overscroll-behavior-y:none}
.closing{padding-bottom:0}.closing-shiv-shakti{margin-bottom:0}
@media(max-height:650px){.ganesh-icon{width:60px}.temple-details h2{font-size:27px}.temple-details .gold-rule{margin:10px auto}.temple-replay{margin-top:12px}}

/* The supplied Pushkar skyline closes the journey behind Shiva–Shakti. */
.family-content{padding-bottom:14px}
.closing-shiv-shakti{aspect-ratio:1/1;background:#faf6ec;overflow:hidden;isolation:isolate}
.closing-shiv-shakti:before{content:'';position:absolute;inset:0;background:url('assets/pushkar-city.png') center center/cover no-repeat;mix-blend-mode:multiply;mask-image:linear-gradient(transparent,#000 15%);-webkit-mask-image:linear-gradient(transparent,#000 15%);pointer-events:none}
.closing-shiv-shakti:after{inset:0;background-size:72% auto;background-position:center bottom}

/* All bell cords share the top edge of the invitation, independent of the hero image. */
#main{position:relative}
.welcome{padding-top:0}
.welcome .bell{padding:0;justify-content:flex-start}
.welcome .bell svg{width:66px;height:79.2px;flex-shrink:0}
#main>.bell-cluster{top:0;width:18%;height:auto;aspect-ratio:308/1034;z-index:7;background-size:100% 100%;transform-origin:50% 0}
#main>.bell-cluster-left{background-image:url('assets/bells-top-left.png')}
#main>.bell-cluster-right{background-image:url('assets/bells-top-right.png');aspect-ratio:176/594}
