/* Compact readable panels, sized to content. */
.cover-content{left:0;right:0;bottom:12svh;width:min(82%,300px);margin-inline:auto;padding:14px 12px}
.cover-content h2{font-size:clamp(46px,12vw,61px);margin:5px 0 8px}.cover-content .guest-block{margin:12px 0}.cover-content .open-btn{min-height:42px;padding:9px 17px}.cover-content .cover-note{font-size:9px}.cover-content .cover-intro{font-size:11px}
.location-note{width:min(100%,300px);margin:22px auto;padding:20px 14px}.location-note h3{font-size:22px;line-height:1.3}.location-note p{font-size:12px;line-height:1.65;margin:10px 0 16px}.location-note .btn{min-height:42px;padding:9px 13px;font-size:11px}
.event-card{max-width:300px;margin-left:auto;margin-right:auto;padding-top:46px;padding-bottom:40px}.event-card h3{font-size:30px}.event-card .fine-rule{margin:15px auto}
/* Roses overlay the edge, appearing after the portrait frame. */
.flower-oval .frame-flower{width:42%;height:36%;z-index:6}.flower-oval .frame-flower-right{top:-8%;bottom:auto;right:-15%}.flower-oval .frame-flower-left{top:auto;bottom:-7%;left:-15%}
.frame-flower-crop,.frame-flower-right .frame-flower-crop{overflow:visible;mask-image:none;transform:none}.frame-flower-crop img{inset:0;width:100%;height:100%;object-fit:contain}.frame-flower-left .frame-flower-crop{transform:rotate(180deg)}
/* Independently articulated wings; the breast, feet and note remain steady. */
.dove-rig{position:relative;width:100%;aspect-ratio:2/1;perspective:700px}.dove-part{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;backface-visibility:visible}
.dove-body{clip-path:polygon(43% 28%,57% 28%,62% 100%,38% 100%);z-index:2}
.dove-wing-left{clip-path:polygon(0 0,48% 0,48% 68%,38% 82%,0 80%);transform-origin:46% 48%}
.dove-wing-right{clip-path:polygon(52% 0,100% 0,100% 80%,62% 82%,52% 68%);transform-origin:54% 48%}
.has-outro .dove-wing-left{animation:wing-left 1.1s ease-in-out infinite}.has-outro .dove-wing-right{animation:wing-right 1.1s ease-in-out infinite}
.dove-left .dove-part{animation-delay:-.3s}.dove-right .dove-part{animation-delay:-.7s}
@keyframes wing-left{0%,100%{transform:rotateY(-8deg) rotateZ(0)}50%{transform:rotateY(48deg) rotateZ(-12deg)}}
@keyframes wing-right{0%,100%{transform:rotateY(8deg) rotateZ(0)}50%{transform:rotateY(-48deg) rotateZ(12deg)}}
.carried-note{position:absolute;left:34%;width:32%;top:79%;z-index:3;text-align:center;color:#602531;transform-origin:50% 0;animation:note-sway 1.6s ease-in-out infinite alternate}
.carried-note>i{position:absolute;top:-15%;height:30%;width:1px;background:#d7c19b;left:37%}.carried-note>i+i{left:63%}.carried-note>span{display:block;padding:7% 4%;background:#f4ead7;border:1px solid #c8a980;box-shadow:0 3px 8px #0002;font-family:var(--serif);font-size:clamp(12px,3vw,35px);line-height:1.15}.carried-note small{display:block;font-size:.54em;margin-top:5%}
@keyframes note-sway{from{rotate:-3deg}to{rotate:3deg}}
.has-outro .dove-approach{animation-duration:5.8s;animation-timing-function:cubic-bezier(.35,0,.65,1)}.has-outro .feather-whiteout{animation-duration:5.8s}
@keyframes dove-exit-left{0%{opacity:0;transform:translate(-30%,7%) scale(.18) rotate(-8deg)}12%{opacity:1}35%{transform:translate(-9%,-18%) scale(.23) rotate(9deg)}58%{transform:translate(-35%,-7%) scale(.27) rotate(-15deg);opacity:1}86%,100%{transform:translate(-105%,-20%) scale(.32);opacity:0}}
@keyframes dove-exit-right{0%{opacity:0;transform:translate(27%,-23%) scale(.14) rotate(12deg)}15%{opacity:1}37%{transform:translate(12%,2%) scale(.2) rotate(-8deg)}60%{transform:translate(38%,-10%) scale(.25) rotate(14deg);opacity:1}90%,100%{transform:translate(106%,5%) scale(.32);opacity:0}}
@keyframes dove-toward-screen{0%{opacity:0;transform:translate(-6%,-30%) scale(.12) rotate(-5deg)}12%{opacity:1}30%{transform:translate(9%,-16%) scale(.22) rotate(8deg)}48%{transform:translate(-7%,-3%) scale(.4) rotate(-5deg)}67%{transform:translate(0,-6%) scale(.7) rotate(0)}80%{transform:translate(0,-5%) scale(.9)}100%{transform:translate(0,12%) scale(8);opacity:1}}
/* Water follows the photographed falls; soft streaks and spray replace harsh bars. */
.opening-waterfall{z-index:0;pointer-events:none}.garden-animation .garden-bg{opacity:0}.forest-gate .opening-waterfall{height:106%;top:-3%}.garden-animation .garden-vignette{z-index:1}
.opening-waterfall .water-stream,.opening-waterfall .waterfall-spray,.opening-waterfall .lake-shimmer,.opening-waterfall .falling-filaments i{animation-play-state:running}
.water-stream{opacity:.5;background:repeating-linear-gradient(177deg,transparent 0 9px,#f5fbff66 13px,#dce9ef22 26px,transparent 43px 85px),repeating-linear-gradient(93deg,transparent 0 3px,#faffff44 4px,transparent 6px 11px);background-size:100% 85px,100% 100%;filter:blur(.7px);animation:real-water .85s linear infinite;mask-image:radial-gradient(ellipse,#000 15%,#0009 45%,transparent 72%)}
@keyframes real-water{from{background-position:0 0,0 0}to{background-position:2px 85px,1px 10px}}
.falling-filaments i{width:.8%;opacity:.5;filter:blur(.5px)}.waterfall-spray{filter:blur(3px);opacity:.55}.lake-shimmer{opacity:.16}
@media(prefers-reduced-motion:reduce){.dove-part,.carried-note,.opening-waterfall *{animation:none!important}}
.carried-note>i{top:-35%;height:45%}

/* Centering is layout-based, independent of entrance-animation transforms. */
.cover-content .open-btn{display:grid;grid-template-columns:18px minmax(0,1fr) 18px;align-items:center;justify-items:center;gap:10px;width:min(100%,223px);min-width:0;margin-inline:auto;text-align:center}
.cover-content .open-btn svg{width:18px;height:18px}
.cover-content .open-btn .open-label{white-space:nowrap;text-align:center}
/* Balanced, compact panels override the earlier ornamental-card dimensions. */
#invitation,#couple,#event{padding-top:38px;padding-bottom:38px}
#invitation>.scene-content,#couple>.scene-content,#event>.scene-content{max-width:330px;margin-inline:auto;box-sizing:border-box;padding:28px 16px 24px!important}
#invitation>.scene-content{border-radius:85px 85px 8px 8px}#couple>.scene-content{border-radius:75px 75px 8px 8px}
#invitation .section-title,#couple .section-title,#event .section-title{font-size:29px;line-height:1.22;letter-spacing:-.5px}
#invitation .bismillah{font-size:21px;margin:18px 0}
#invitation .eyebrow,#couple .section-header .eyebrow{font-size:8px;letter-spacing:.15em}
#invitation .portrait-window{width:min(100%,255px);margin:24px auto;outline-offset:4px}
#invitation .verse-gunungan{margin-top:18px}
#couple .section-header,#event .section-header{margin-bottom:24px}
#couple .person{margin-inline:auto;text-align:center}
#couple .person h3{font-size:46px;margin:6px 0 9px}#couple .person .full-name{font-size:17px}#couple .person .parents{font-size:12px;line-height:1.7}
#couple .floral-frame.flower-oval{width:190px;margin:16px auto 26px}
#couple .couple-amp{margin:20px auto;font-size:40px}
#event .event-card{width:100%;max-width:280px;min-height:0;margin:18px auto;padding:48px 25px 44px}
#event .event-card h3{font-size:32px;margin:16px 0 13px}
#event .event-card .event-time{font-size:13px}
#event .event-card .fine-rule{margin:13px auto}
#event .event-card p:not(.event-time){font-size:11px;line-height:1.7}
#event .event-card .text-button{font-size:10px;margin-top:14px;min-height:40px}
#event .event-date{margin-bottom:18px}
/* Fuller rose clusters remain on diagonally opposite corners. */
#couple .flower-oval .frame-flower{width:52%;height:40%}
#couple .flower-oval .frame-flower-right{right:-18%;top:-7%}
#couple .flower-oval .frame-flower-left{left:-18%;bottom:-7%}
.frame-flower-crop .rose-extra{width:62%;height:62%;opacity:0;transition:opacity .8s ease,translate .9s ease;translate:0 12px}
.frame-flower-crop .rose-extra-a{left:-22%;top:42%;transform:rotate(-28deg)}
.frame-flower-crop .rose-extra-b{left:35%;top:-20%;transform:rotate(24deg)}
.flowers-visible .frame-flower-right .rose-extra{opacity:1;translate:0 0;transition-delay:1.4s}
.flowers-visible .frame-flower-left .rose-extra{opacity:1;translate:0 0;transition-delay:2.2s}
/* The camera settles on the carried thank-you card, not the dove's body. */
.carried-note{left:23%;width:54%;color:#48121e;animation:none}
.carried-note>span{font-family:var(--sans);font-weight:600;font-size:clamp(22px,6vw,42px);padding:8% 5%;background:#fff4dd;border:2px solid #b99863;text-shadow:none;box-shadow:0 5px 18px #0005}
.carried-note small{font-size:.65em;font-weight:500;margin-top:7px}
.carried-note>i{left:44%;height:40%;top:-35%}.carried-note>i+i{left:56%}
.has-outro .dove-front{animation-name:dove-to-message}
@keyframes dove-to-message{0%{opacity:0;transform:translate(-6%,-30%) scale(.12) rotate(-5deg)}12%{opacity:1}30%{transform:translate(9%,-16%) scale(.25) rotate(8deg)}48%{transform:translate(-7%,-6%) scale(.5) rotate(-5deg)}65%{transform:translate(0,-10%) scale(.95) rotate(0);opacity:1}82%{transform:translate(0,-18%) scale(1.35);opacity:1}100%{transform:translate(0,-26%) scale(1.8);opacity:0}}
.feather-whiteout{display:grid;place-items:center;background:#fff4dd}
.has-outro .feather-whiteout{animation:message-close 5.8s ease both}
.farewell-message{text-align:center;color:#48121e;padding:24px;line-height:1.25;text-shadow:none}
.farewell-message>span{display:block;font-family:var(--serif);font-size:clamp(40px,10vw,78px)}
.farewell-message>strong{display:block;font-family:var(--sans);font-size:clamp(24px,6vw,42px);font-weight:500;margin-top:16px}
@keyframes message-close{0%,68%{opacity:0;clip-path:inset(42% 25% round 8px)}82%{opacity:1;clip-path:inset(32% 12% round 8px)}100%{opacity:1;clip-path:inset(0 round 0)}}
@media(prefers-reduced-motion:reduce){.frame-flower-crop .rose-extra{opacity:1;translate:0 0;transition:none}.has-outro .feather-whiteout{animation:none;opacity:1}.has-outro .dove-front{animation:none}}
/* Natural opening water: moving photographic texture with local turbulence. */
.opening-waterfall .water-stream,.opening-waterfall .falling-filaments,.opening-waterfall .waterfall-spray{display:none}
.natural-water{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.opening-waterfall .lake-shimmer{opacity:.055;filter:blur(.7px);animation-duration:11s;background:repeating-linear-gradient(179deg,transparent 0 12px,#e6d4b333 13px,transparent 14px 31px)}
@media(prefers-reduced-motion:reduce){.natural-water{display:none}}
