/* Large illustrated moments, joined by a flowering date trail. */
.celebrations{padding-bottom:90px}
.event-story{padding:0 0 0 40px;margin-top:55px;max-width:1120px}
.event-story .event-list{display:flex;flex-direction:column;gap:54px;max-width:none}
.celebration-vine{width:32px;left:0}
.vine-guide,.vine-stem{stroke-width:1.6}.vine-stem{stroke:#c3a36c}
.event,.event:nth-child(2){display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);padding:9px;border-radius:8px;background:#fff7eb;transform:none;text-align:left;box-shadow:0 12px 30px #270b1217;transition:box-shadow .4s}
.event:nth-child(2){grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);background:#f9e6b1}
.event:nth-child(3){background:#512532;border-color:#a88757}
.event:hover,.event:nth-child(2):hover{transform:none;box-shadow:0 17px 36px #270b1226}
.event .event-image-wrap{min-width:0;min-height:370px;aspect-ratio:auto;overflow:hidden;border-radius:5px}
.event:nth-child(2) .event-image-wrap{order:2}
.event:nth-child(2) .event-details{order:1}
.event .event-image{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:5px;transform:scale(1.005)}
.event .event-details{padding:37px 30px 29px;justify-content:center;align-items:flex-start;min-width:0}
.event .event-weekday{font-size:9px;padding-right:0;margin-bottom:20px}
.event h3{font-size:43px;line-height:1.06;min-height:0;max-width:340px}
.event .event-subtitle{font-size:23px;min-height:0;max-width:290px;margin:15px 0 25px}
.event .event-time{font-size:11px}.event .event-location{font-size:12px;margin-bottom:20px}
.event .text-button{margin-top:0;min-height:44px;font-size:9px}
.event .event-date-block{bottom:17px;right:18px;width:80px;height:80px;outline-offset:3px;z-index:4}
.event .event-date{font-size:47px}.event .event-month{font-size:6px;letter-spacing:1.2px}
.event-wedding h3,.event-wedding .event-time{color:#ffe6c0}
.event-wedding .event-weekday,.event-wedding .event-subtitle{color:#e3c6b3}
.event-wedding .event-location,.event-wedding .text-button{color:#f1dbbd}
.event-wedding .event-details .text-button{border-color:#c7a579}
.event .event-tap{left:16px;bottom:19px;font-size:9px;padding:9px 12px;max-width:calc(100% - 115px)}
.event .event-activate,.event .event-confetti{border-radius:5px}
.event-note{margin-top:35px}

/* Painted foreground boughs part, leaving the faces clear. */
.scene-decoration{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.scene-bough{position:absolute;top:-34px;width:39%;max-width:225px;transform:translate(var(--scene-x,0px),var(--scene-y,0px));transition:transform .3s}
.scene-bough-left{left:-33px;--flip:1}.scene-bough-right{right:-33px;--flip:-1}
.scene-bough img{width:100%;height:auto;display:block;transform:scaleX(var(--flip));transform-origin:18% 0;animation:bough-breathe 6s ease-in-out infinite;animation-play-state:paused}
.scene-in-view .scene-bough img{animation-play-state:running}
.scene-playing .scene-bough-left{animation:curtain-left 1.65s cubic-bezier(.2,.7,.2,1) both}
.scene-playing .scene-bough-right{animation:curtain-right 1.65s cubic-bezier(.2,.7,.2,1) both}
.scene-ornament{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.scene-bloom{transform-box:fill-box;transform-origin:center}
.scene-playing .scene-bloom{animation:flower-unfurl .8s var(--bloom-delay) cubic-bezier(.2,.8,.3,1.3) both}
.marigold-string{transform-box:fill-box;transform-origin:center top;animation:marigold-sway 5s ease-in-out infinite;animation-play-state:paused}
.scene-in-view .marigold-string{animation-play-state:running}
.mehndi-ink path{stroke-dasharray:1;stroke-dashoffset:0}
.scene-playing .mehndi-ink path{animation:mehndi-draw 2.4s .65s ease both}
.wedding-bulb .light-glow{opacity:.12;filter:blur(3px);animation:lantern-glow 5s ease-in-out infinite;animation-play-state:paused}
.scene-in-view .wedding-bulb .light-glow{animation-play-state:running}
.scene-playing .wedding-bulb{animation:light-welcome 1.2s var(--light-delay) ease both}
.scene-petals,.garden-petals{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.scene-petal,.garden-petals i{position:absolute;left:var(--petal-x);top:-20px;width:9px;height:14px;background:radial-gradient(ellipse at 25% 25%,#f6cbc4,#c78291);border-radius:90% 12% 80% 25%;opacity:0}
.scene-playing .scene-petal{animation:scene-petal-fall 2.4s var(--petal-delay) ease-in both}
.scene-playing .event-image{animation:painting-settle 2.1s ease both}
@keyframes curtain-left{from{transform:translateX(75%) rotate(18deg)}to{transform:translateX(0) rotate(0)}}
@keyframes curtain-right{from{transform:translateX(-75%) rotate(-18deg)}to{transform:translateX(0) rotate(0)}}
@keyframes bough-breathe{0%,100%{transform:scaleX(var(--flip)) rotate(-1deg)}50%{transform:scaleX(var(--flip)) rotate(2deg)}}
@keyframes flower-unfurl{from{opacity:0;transform:scale(.05) rotate(-35deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes marigold-sway{0%,100%{transform:rotate(-1.1deg)}50%{transform:rotate(1.1deg)}}
@keyframes mehndi-draw{from{stroke-dashoffset:1;opacity:.3}to{stroke-dashoffset:0;opacity:1}}
@keyframes light-welcome{from{opacity:0}to{opacity:1}}
@keyframes lantern-glow{0%,100%{opacity:.08}50%{opacity:.28}}
@keyframes scene-petal-fall{0%{opacity:0;transform:translate(0,-15px) rotate(0)}15%{opacity:.8}85%{opacity:.65}100%{opacity:0;transform:translate(35px,460px) rotate(var(--petal-turn))}}
@keyframes painting-settle{from{transform:scale(1.045)}to{transform:scale(1.005)}}

/* A living garden frames a personal letter, which stays readable after opening. */
.together .portrait-frame{overflow:hidden}
.together .portrait-painting{transform:scale(1.02)}
.garden-revealed .portrait-painting{animation:garden-arrives 2.2s ease both}
.garden-branch{position:absolute;top:-22px;width:25%;max-width:290px;z-index:2;pointer-events:none;transform:translate(var(--scene-x,0px),var(--scene-y,0px));transition:transform .35s}
.garden-branch-left{left:-25px;--flip:1}.garden-branch-right{right:-25px;--flip:-1}
.together .portrait-frame .garden-branch img{position:static;display:block;width:100%;height:auto;object-fit:contain;transform:scaleX(var(--flip));transform-origin:15% 0;animation:bough-breathe 6.5s ease-in-out infinite;animation-play-state:paused}
.portrait-frame.scene-in-view .garden-branch img{animation-play-state:running}
.garden-petals{z-index:2}
.garden-revealed .garden-petals i{animation:garden-petal-drift 10s var(--petal-delay) linear infinite;animation-play-state:paused}
.portrait-frame.scene-in-view .garden-petals i{animation-play-state:running}
.letter-envelope{position:absolute;right:60px;bottom:0;width:360px;z-index:3;perspective:900px;isolation:isolate}
.letter-envelope .together-letter{position:relative;right:auto;bottom:auto;width:100%;margin:0;transform:rotate(1.2deg)}
.envelope-back,.envelope-flap,.envelope-pocket{position:absolute;left:0;right:0;bottom:0;opacity:0;pointer-events:none}
.envelope-back{height:210px;background:#e6cfaa;border:1px solid #b79a70;border-radius:4px;z-index:0}
.envelope-flap{bottom:65px;height:145px;background:linear-gradient(160deg,#f8e9cd,#d6b889);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;z-index:5;backface-visibility:visible}
.envelope-pocket{height:210px;background:linear-gradient(145deg,#fff1d7,#e4c8a2);clip-path:polygon(0 0,50% 50%,100% 0,100% 100%,0 100%);border:1px solid #b79a70;z-index:4}
.envelope-seal{position:absolute;left:50%;top:125px;width:45px;height:45px;display:grid;place-items:center;border-radius:50%;background:#864252;color:#ffe6c0;transform:translateX(-50%);font:italic 14px var(--serif);border:1px solid #a9656d}
.letter-ready:not(.letter-revealed) .together-letter{opacity:0;transform:translateY(80px) scale(.94)}
.letter-ready:not(.letter-revealed) .envelope-back,.letter-ready:not(.letter-revealed) .envelope-flap,.letter-ready:not(.letter-revealed) .envelope-pocket{opacity:1}
.letter-playing .together-letter{animation:letter-lift 1.65s cubic-bezier(.2,.7,.2,1) both}
.letter-playing .envelope-flap{animation:envelope-unfold 1.25s ease both}
.letter-playing .envelope-pocket,.letter-playing .envelope-back{animation:envelope-recedes 1.8s ease both}
.letter-line{display:block}.letter-line+.letter-line{margin-top:9px}
.letter-playing .letter-line{animation:letter-line-arrives .75s var(--line-delay) ease both}
.letter-playing .signature{animation:letter-line-arrives .8s 2.45s ease both}
.signature-line{display:block;width:180px;height:20px;margin:4px 0 13px;overflow:visible}
.signature-line path{fill:none;stroke:#b5965a;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.letter-playing .signature-line path{animation:letter-signature .95s 2.9s ease both}
.letter-playing .together-letter,.letter-playing .envelope-flap,.letter-playing .envelope-pocket,.letter-playing .envelope-back{will-change:transform,opacity}
.garden-replay{text-align:center;margin:25px auto 0;padding:0 24px}
.garden-replay .text-button{min-height:44px;font-size:9px;cursor:pointer}
.garden-replay .text-button[aria-disabled="true"]{opacity:.6;cursor:wait}
@keyframes garden-arrives{from{opacity:.45;transform:scale(1.005);clip-path:inset(4% 2% 4% 2%)}to{opacity:1;transform:scale(1.02);clip-path:inset(0)}}
@keyframes garden-petal-drift{0%{opacity:0;transform:translate(0,-20px) rotate(0)}12%{opacity:.65}75%{opacity:.55}100%{opacity:0;transform:translate(80px,700px) rotate(var(--petal-turn))}}
@keyframes envelope-unfold{0%{opacity:1;transform:rotateX(0)}65%{opacity:1;transform:rotateX(175deg)}100%{opacity:0;transform:rotateX(180deg)}}
@keyframes envelope-recedes{0%,48%{opacity:1}100%{opacity:0}}
@keyframes letter-lift{0%,24%{opacity:0;transform:translateY(85px) scale(.94) rotate(0)}55%{opacity:1}100%{opacity:1;transform:translateY(0) scale(1) rotate(1.2deg)}}
@keyframes letter-line-arrives{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes letter-signature{from{stroke-dashoffset:1;opacity:.4}to{stroke-dashoffset:0;opacity:1}}
@keyframes mobile-envelope-unfold{0%{opacity:1;transform:translateZ(0) rotateX(0)}85%{opacity:1;transform:translateZ(0) rotateX(-170deg)}100%{opacity:0;transform:translateZ(0) rotateX(-180deg)}}
@keyframes mobile-letter-lift{0%,26%{opacity:0;transform:translate3d(0,calc(100% - 194px),0)}34%{opacity:1;transform:translate3d(0,calc(100% - 194px),0)}100%{opacity:1;transform:translate3d(0,0,0)}}
@keyframes mobile-envelope-recedes{0%,66%{opacity:1;transform:translate3d(0,0,0)}100%{opacity:0;transform:translate3d(0,30px,0)}}
html[data-scenes-paused="true"] .scene-decoration *,html[data-scenes-paused="true"] .garden-branch *,html[data-scenes-paused="true"] .garden-petals *{animation-play-state:paused!important}
html[lang=hi] .event h3{font-size:29px;line-height:1.65;min-height:0}
html[lang=hi] .event-subtitle{font:13px/1.9 var(--hindi);min-height:0}
html[lang=hi] .event-wedding .event-subtitle{color:#e3c6b3}
html[lang=hi] .event-weekday{font-size:10px;letter-spacing:0}
html[lang=hi] .event .event-month{font-size:9px;letter-spacing:0}
html[lang=hi] .event .text-button{font-size:10px;letter-spacing:0}
@media(min-width:761px) and (max-width:1000px){.event .event-details{padding:28px 23px}.event h3{font-size:36px}.event .event-subtitle{font-size:21px}.event .event-image-wrap{min-height:355px}.letter-envelope{right:45px;width:325px}.letter-envelope .together-letter{padding:32px 27px}}
@media(max-width:760px){
 .celebrations{padding-left:5%;padding-right:5%;padding-bottom:75px}
 .event-story{padding:0 0 0 26px;margin-top:38px}.celebration-vine{width:25px}
 .event-story .event-list{gap:38px;max-width:440px}
 .event,.event:nth-child(2){display:flex;flex-direction:column;padding:7px;border-radius:7px;transform:none}
 .event .event-image-wrap{min-height:0;aspect-ratio:4/3;width:100%;order:0!important}
 .event .event-details{padding:28px 21px 20px;order:1!important}
 .event h3{font-size:36px;max-width:290px}
 .event .event-weekday{font-size:8px;margin-bottom:15px}
 .event .event-subtitle{font-size:21px;max-width:270px;margin:13px 0 23px}
 .event .event-date-block{width:67px;height:67px;bottom:14px;right:14px}
 .event .event-date{font-size:40px}.event .event-month{font-size:5px}
 .event .event-tap{font-size:8px;left:10px;bottom:14px;padding:8px;max-width:calc(100% - 93px)}
 .scene-bough{top:-20px;width:43%;max-width:160px}.scene-bough-left{left:-22px}.scene-bough-right{right:-22px}
 .letter-envelope{position:relative;right:auto;bottom:auto;width:calc(100% - 43px);max-width:375px;margin:28px auto 0;overflow:hidden}
 .letter-envelope .together-letter{padding:31px 28px;max-width:none;transform:none}
 .letter-playing .together-letter{animation:mobile-letter-lift 2.1s cubic-bezier(.22,.65,.25,1) both}
 .envelope-flap{backface-visibility:hidden;-webkit-backface-visibility:hidden}
 .letter-playing .envelope-flap{animation:mobile-envelope-unfold 1s cubic-bezier(.35,0,.2,1) both}
 .letter-playing .envelope-pocket,.letter-playing .envelope-back{animation:mobile-envelope-recedes 2.6s cubic-bezier(.25,.6,.2,1) both}
 .letter-playing .letter-line{animation-delay:calc(var(--line-delay) + .6s)}
 .letter-playing .signature{animation-delay:2.9s}
 .letter-playing .signature-line path{animation-delay:3.45s}
 .garden-branch{width:40%;max-width:210px;top:-19px}
 .garden-branch-left{left:-26px}.garden-branch-right{right:-26px}
 .garden-replay{margin-top:20px}.signature-line{width:170px}
 html[lang=hi] .event h3{font-size:26px;line-height:1.65}
 html[lang=hi] .event-subtitle{font-size:12px}
 html[lang=hi] .event .event-weekday{font-size:9px}
 html[lang=hi] .event .event-month{font-size:8px}
}
html[data-motion="reduce"] .scene-decoration *,html[data-motion="reduce"] .garden-branch *,html[data-motion="reduce"] .portrait-painting,html[data-motion="reduce"] .letter-envelope *{animation:none!important;transition:none!important}
html[data-motion="reduce"] .scene-petals,html[data-motion="reduce"] .garden-petals,html[data-motion="reduce"] .envelope-back,html[data-motion="reduce"] .envelope-flap,html[data-motion="reduce"] .envelope-pocket{display:none}
html[data-motion="reduce"] .letter-ready .together-letter{opacity:1;transform:none}
@media print{.scene-decoration,.garden-branch,.garden-petals,.envelope-back,.envelope-flap,.envelope-pocket,.garden-replay{display:none}.letter-envelope{position:relative;right:auto;width:100%;max-width:400px;margin:20px auto}.letter-envelope .together-letter{opacity:1!important;transform:none!important;animation:none!important}.event-story{padding:0}.celebration-vine{display:none}.event-list .event{break-inside:avoid}.event .event-image-wrap{min-height:260px}}
