@font-face{font-family:Mont;src:url(../fonts/montserrat-regular.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Mont;src:url(../fonts/montserrat-semibold.ttf) format("truetype");font-style:normal;font-weight:600 800;font-display:swap}
@font-face{font-family:Garamond;src:url(../fonts/eb-garamond.woff2) format("woff2");font-display:swap}
@font-face{font-family:GreatVibes;src:url(../fonts/great-vibes.woff2) format("woff2");font-display:swap}
@font-face{font-family:Vidaloka;src:url(../fonts/vidaloka.ttf) format("truetype");font-display:swap}
@font-face{font-family:Cinzel;src:url(../fonts/cinzel.ttf) format("truetype");font-display:swap}

:root{
    --ink:#181918;
    --charcoal:#252624;
    --cream:#f3ddbf;
    --paper:#f2eee7;
    --white:#fff;
    --muted:#c9c6bf;
}

*{box-sizing:border-box}
html{scroll-behavior:auto;background:#121312}
body{margin:0;font-family:Mont,Arial,sans-serif;color:#fff;background:#121312;overflow-x:hidden}
body.invitation-locked{overflow:hidden}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
.invitation{position:relative;width:100%;max-width:500px;margin:0 auto;background:#eee;overflow:hidden;box-shadow:0 0 70px rgba(0,0,0,.55)}
.desktop-cover{display:none}

.opening-cover{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;min-height:100svh;background:#171817 url(../images/modern-jawa-fallback.jpg) center/cover no-repeat;transition:opacity .9s ease,visibility .9s ease,transform 1.1s cubic-bezier(.65,0,.15,1)}
.opening-cover.is-open{opacity:0;visibility:hidden;transform:translateY(-4%)}
.cover-grain{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.12)),repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.025) 3px 4px);pointer-events:none}
.cover-content{position:relative;width:100%;height:100svh;display:flex;flex-direction:column;align-items:center;padding:17vh 26px 8vh;text-align:center;z-index:2}
.cover-label,.kicker{margin:0 0 7px;font-family:Cinzel,serif;font-size:14px;letter-spacing:2.4px;text-transform:uppercase}
.cover-content h1{margin:0;font:400 clamp(38px,11vw,54px)/1.2 Vidaloka,serif;letter-spacing:.5px}
.cover-guest{display:flex;flex-direction:column;gap:14px;margin-top:76px;margin-bottom:27px;font-size:14px;letter-spacing:1.5px}
.cover-guest strong{font-weight:600}
.gold-button,.dark-button,.outline-button,.copy-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:12px 22px;font-size:11px;font-weight:700;letter-spacing:.7px;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}
.gold-button{color:#171817;background:linear-gradient(110deg,#fff5e8,#e7c79d);box-shadow:0 5px 20px rgba(0,0,0,.23)}
.gold-button:hover,.dark-button:hover,.outline-button:hover,.copy-button:hover{transform:translateY(-2px)}
.gold-button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.gold-button.small{padding:9px 17px;font-size:10px}
.leaf-icon{font-size:18px;line-height:0}

.dark-section,.dark-pattern{position:relative;background:#20211f url(../images/modern-jawa-all-page.jpg) center/cover no-repeat;color:#fff}
.dark-pattern:before{content:"";position:absolute;inset:0;background:rgba(21,22,21,.56);pointer-events:none}
.ambient-dust{position:absolute!important;z-index:0!important;inset:4% 7%;overflow:hidden;pointer-events:none;opacity:.65;backface-visibility:hidden}
.ambient-dust:before,.ambient-dust:after{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:rgba(255,244,218,.85);box-shadow:72px 64px 0 rgba(255,255,255,.55),151px 18px 0 rgba(246,222,183,.5),236px 112px 0 rgba(255,255,255,.48),285px 48px 0 rgba(246,222,183,.58),42px 210px 0 rgba(255,255,255,.5),188px 276px 0 rgba(246,222,183,.45),304px 340px 0 rgba(255,255,255,.55),105px 410px 0 rgba(246,222,183,.48)}
.ambient-dust:before{left:2%;top:2%}.ambient-dust:after{right:8%;top:28%;transform:scale(.7);opacity:.65}
.dark-pattern.motion-active .ambient-dust{animation:ambientDustDrift 9s ease-in-out infinite}
.dark-pattern.motion-active .ambient-dust-reverse{animation-direction:reverse;animation-duration:11s}
.textured-section,.countdown-section,.closing-section{position:relative;background:#ece7de url(../images/paper.jpg) center/420px;color:#282927}
.section-pad{padding:76px 34px;text-align:center}
.section-pad>*{position:relative;z-index:1}

.hero{height:100svh;min-height:720px;display:flex;align-items:flex-start;justify-content:center;overflow:hidden;padding:0;text-align:center;background:#171817 url(../images/modern-jawa-fallback.jpg) center/cover no-repeat}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.15) 65%,rgba(0,0,0,.35))}
.hero-copy{position:absolute;z-index:4;top:35.5%;left:0;width:100%;padding:0 25px;text-align:center}
.display-title{font:400 clamp(39px,11vw,57px)/1.1 Vidaloka,serif;letter-spacing:1px;margin:8px 0}
.hero-date{font-family:Cinzel,serif;font-size:16px;letter-spacing:5px;margin:8px 0}
.hero-wayang{position:absolute;z-index:3;top:8%;left:50%;width:29%;transform:translateX(-50%);filter:drop-shadow(0 8px 12px rgba(0,0,0,.5))}
.hero-particles{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none}
.hero-copy .hero-choreo-item{opacity:0;filter:blur(7px);transform:translate3d(0,-58px,0) scale(.96);transition:opacity 1.15s ease,transform 1.25s cubic-bezier(.16,1,.3,1),filter 1.1s ease}
.hero-wayang.hero-choreo-item{opacity:0;transform:translate3d(-50%,-78px,0) scale(.9);transition:opacity 1.35s ease,transform 1.55s cubic-bezier(.16,1,.3,1),filter 1.2s ease}
.hero.hero-intro-visible .hero-wayang{opacity:1;transform:translate3d(-50%,0,0) scale(1)}
.hero.hero-intro-visible .hero-copy .hero-choreo-item{opacity:1;filter:blur(0);transform:translate3d(0,0,0) scale(1)}
.hero.hero-intro-visible .hero-copy .kicker{transition-delay:.12s}
.hero.hero-intro-visible .hero-copy .display-title{transition-delay:.3s}
.hero.hero-intro-visible .hero-copy .hero-date{transition-delay:.48s}
.sparkles{position:absolute;inset:0;z-index:2;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.5px),radial-gradient(circle,#f5dfbc 0 1px,transparent 2px);background-size:67px 89px,113px 127px;background-position:5px 20px,30px 10px;opacity:.65;animation:sparkleFall 12s linear infinite;animation-play-state:paused}
.hero.motion-active .sparkles{animation-play-state:running}
.hero.motion-active.hero-intro-visible .hero-wayang{animation:heroWayangFloat 5.5s ease-in-out 1.7s infinite}

.ornament-line{font-size:24px;color:#a78b66;margin-bottom:16px}
.script-title{font:400 57px/1 GreatVibes,cursive;margin:0 0 25px;color:#fff;text-transform:capitalize}
.script-title.dark{color:#282927}
.quote-section{position:relative;min-height:620px;display:flex;flex-direction:column;justify-content:center;padding-top:105px;padding-bottom:105px;overflow:hidden;background:#171817 url(../images/potongan-fallback.jpg) center/cover no-repeat;color:#fff}
.quote-section:before,.quote-section:after{content:"";position:absolute;width:56%;aspect-ratio:555/678;background:url(../images/bunga-jawa.png) center/contain no-repeat;opacity:.6;pointer-events:none}
.quote-section:before{right:-28%;top:-10%;transform:rotate(8deg)}
.quote-section:after{left:-30%;bottom:-16%;transform:scaleX(-1) rotate(8deg)}
.quote-section.motion-active:before{animation:quoteFlowerRight 7s ease-in-out infinite}
.quote-section.motion-active:after{animation:quoteFlowerLeft 8s ease-in-out infinite}
.quote-section .ornament-line{display:none}
.quote-section .script-title{font:500 25px/1.3 Cinzel,serif;letter-spacing:.5px;text-transform:uppercase}
.quote-section blockquote{margin:0 auto 18px;max-width:430px;font:400 12px/1.75 Mont,sans-serif}
.quote-section cite{font:400 11px/1.5 Mont,sans-serif;letter-spacing:0;text-transform:none}
.section-copy{max-width:410px;margin:0 auto 38px;font:400 13px/1.9 Mont,sans-serif}

.couple-section{padding:16px 12px 65px;overflow:hidden}
.couple-arch{position:relative;z-index:2;padding:50px 14px 34px;border:5px solid var(--cream);border-radius:260px;background:rgba(30,31,30,.76);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.couple-arch>.script-title{max-width:260px;margin-left:auto;margin-right:auto;font-size:55px;line-height:.8}
.couple-arch>.section-copy{margin-bottom:26px;font-size:12px;line-height:1.65}
.floral{position:absolute!important;z-index:0!important;width:62%;opacity:.75;pointer-events:none}
.floral-right{right:-40%;top:14%;transform:rotate(10deg)}
.floral-left{left:-40%;bottom:8%;transform:scaleX(-1) rotate(10deg)}
.couple-section.motion-active .floral-right{animation:floralSwayRight 5.5s ease-in-out infinite}
.couple-section.motion-active .floral-left{animation:floralSwayLeft 6.3s ease-in-out infinite}
.person-card{width:100%;margin:0 auto;padding:27px 10px 18px;background:transparent;border:0;border-radius:0;box-shadow:none}
.person-card .person-short{font:400 51px/1 GreatVibes,cursive;margin:0 0 23px;color:#fff}
.person-card h3{margin:0 0 8px;font:400 28px/1.2 Vidaloka,serif}
.person-card p:not(.person-short){font-size:12px;line-height:1.8;margin:0 auto 20px;max-width:300px}
.outline-button{border:1px solid var(--cream);padding:8px 15px;color:#fff;background:transparent}
.ampersand{font:400 65px/1 Vidaloka,serif;margin:27px 0 10px;color:#fff}

.countdown-section{min-height:780px;display:flex;flex-direction:column;justify-content:center;padding-top:90px;padding-bottom:92px;background:#171817 url(../images/potongan-fallback.jpg) center/cover no-repeat!important;color:#fff}
.countdown-section:before{background:rgba(18,19,18,.35)}
.kicker.dark{color:#fff;font-weight:400}
.date-lockup{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:19px;margin:25px 0 47px;padding:34px 0 44px;font-family:Vidaloka,serif}
.date-lockup:before,.date-lockup:after{content:"";display:block;width:180px;height:1px;background:linear-gradient(90deg,transparent,#fff 20%,#fff 80%,transparent)}
.date-lockup strong{font-size:55px;font-weight:400;line-height:1}
.date-lockup span{writing-mode:initial;text-transform:capitalize;letter-spacing:0;font-size:53px;line-height:1}
.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:0 auto 34px;max-width:410px}
.countdown div{display:flex;min-width:0;flex-direction:column;padding:12px 3px;border-right:0}
.countdown div:last-child{border:0}
.countdown strong{font:400 27px/1 Vidaloka,serif}
.countdown span{font-size:8px;letter-spacing:.6px;margin-top:6px;text-transform:uppercase}
.dark-button{color:#fff;background:#252624;padding:11px 18px;box-shadow:0 5px 15px rgba(0,0,0,.15)}
.countdown-section>.dark-button{display:none}

.events-section{padding:100px 34px 110px;overflow:hidden}
.events-section:after{content:"";position:absolute;z-index:1;inset:18px 16px;border:4px solid var(--cream);border-radius:250px;pointer-events:none}
.events-section>*{z-index:2}
.event-wayang{width:27%;max-width:125px;margin:0 auto 24px;filter:drop-shadow(0 7px 10px rgba(0,0,0,.4))}
.events-section.motion-active .event-wayang.is-visible{animation:ornamentBreathe 5s ease-in-out infinite}
.events-section>.script-title{font-size:52px;line-height:.84}
.events-section>.section-copy{font-size:10px;line-height:1.55;margin-bottom:28px}
.event-divider{margin:8px 0 14px;color:#fff;font:400 18px/1 Garamond,serif;letter-spacing:2px}
.event-card{margin:0 auto;padding:38px 8px 45px;max-width:420px;border:0;border-bottom:1px solid rgba(243,221,191,.32);border-radius:0;background:transparent;box-shadow:none}
.event-card:last-child{border-bottom:0;padding-bottom:30px}
.event-icon{font-size:34px;color:var(--cream);margin-bottom:12px}
.event-card h3{font:400 48px/1 GreatVibes,cursive;margin:0 0 24px;color:#fff}
.event-card>strong{font:400 16px/1.4 Cinzel,serif;letter-spacing:1px}
.event-card p{font-size:12px;line-height:1.8}
.event-card .pin{display:block;font-size:27px;color:var(--cream);margin-top:24px}

.stream-card{padding-top:38px}
.stream-card h3{font-size:42px;margin-bottom:15px}
.stream-card p{max-width:320px;margin:0 auto 20px}

.story-section{overflow:hidden;padding:84px 28px 90px;background:#171817 url(../images/potongan-fallback.jpg) center/cover no-repeat!important}
.story-section:before{background:rgba(17,18,17,.34)}
.story-section:after{content:"";position:absolute;z-index:0;inset:0;background:radial-gradient(circle at 50% 32%,rgba(255,239,210,.08),transparent 42%);pointer-events:none}
.story-flower{position:absolute;z-index:1;width:54%;aspect-ratio:555/678;background:url(../images/bunga-jawa.png) center/contain no-repeat;opacity:.58;pointer-events:none;transform-origin:50% 82%;backface-visibility:hidden;will-change:transform}
.story-flower-left{left:-29%;top:84px;transform:scaleX(-1) rotate(8deg)}
.story-flower-right{right:-28%;top:255px;transform:rotate(9deg)}
.story-section.motion-active .story-flower-left{animation:storyFlowerLeft 5.8s ease-in-out infinite}
.story-section.motion-active .story-flower-right{animation:storyFlowerRight 6.6s ease-in-out .35s infinite}
.story-section>.script-title{font:400 39px/1.15 Vidaloka,serif;margin-bottom:5px}
.story-tagline{font:italic 11px/1.55 Garamond,serif;color:#fff;margin:0 0 48px}
.timeline{display:flex;position:relative;z-index:2;flex-direction:column;gap:42px}
.story-card{position:relative;padding:0 4px;border:0;background:transparent;text-align:center;border-radius:0}
.story-card h3{font:400 29px/1.15 Vidaloka,serif;color:#fff;margin:0 0 17px}
.story-card p{max-width:370px;margin:0 auto;font-size:10px;line-height:1.7}

.gift-section{padding:54px 16px 24px;background-position:center!important}
.gift-panel,.rsvp-panel{position:relative;padding:28px 16px 30px;border:3px solid var(--cream);border-radius:24px;background:rgba(30,31,30,.78)}
.gift-panel>.script-title,.rsvp-panel>.script-title{font:400 29px/1.2 Cinzel,serif;text-transform:uppercase;margin-bottom:15px}
.gift-panel>p:not(.script-title){font:400 11px/1.65 Mont,sans-serif;max-width:390px;margin:0 auto 20px}
.gift-drawer{display:block;max-height:0;overflow:hidden;opacity:0;transition:max-height .75s cubic-bezier(.16,1,.3,1),opacity .5s ease,margin .5s ease;margin-top:0}
.gift-drawer.is-visible{max-height:1000px;opacity:1;margin-top:24px}
.gift-card-group{padding:12px 12px 22px;border:1px solid #ded6cb;border-radius:17px;background:#fff;color:#20211f;box-shadow:0 12px 30px rgba(0,0,0,.18)}
.gift-card{padding:25px 12px 32px;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.gift-card+.gift-card{border-top:1px solid #555;padding-top:42px}
.gift-card p{font-size:10px;line-height:1.65;margin:8px 0}
.gift-card strong{font-weight:700}
.bank-logo{display:block;width:86px;height:auto;margin:0 auto 17px}
.gift-address-card{position:relative;padding-bottom:33px}
.gift-address-card:after{content:"";position:absolute;left:0;right:0;bottom:0;border-bottom:1px solid #555}
.copy-button{margin-top:15px;background:#ead4b5;color:#252624;padding:8px 15px}

.response-section{padding:20px 16px 52px}
.rsvp-panel{padding:28px 16px 34px}
.rsvp-panel>.section-copy{font-size:10px;line-height:1.55;margin-bottom:20px}
.form-notice{padding:12px;margin:0 0 20px;border:1px solid #e2cda9;border-radius:9px;color:#eee2d0;font-size:11px;line-height:1.6;background:rgba(0,0,0,.2)}
.form-notice a{text-decoration:underline}
.rsvp-form{display:flex;flex-direction:column;gap:12px;padding:0;background:transparent;color:#fff;text-align:left;border-radius:0}
.rsvp-form label{font-family:Garamond,serif;font-size:11px;font-weight:600;letter-spacing:0}
.rsvp-form input,.rsvp-form select,.rsvp-form textarea{width:100%;margin-top:7px;border:1px solid #d6cdbf;border-radius:3px;background:#fff;padding:11px 12px;color:#272825;font-family:Mont,sans-serif;font-size:11px;outline:none}
.rsvp-form input:focus,.rsvp-form select:focus,.rsvp-form textarea:focus{border-color:#b38e5b;box-shadow:0 0 0 3px rgba(179,142,91,.13)}
.rsvp-form textarea{resize:vertical}
.form-result{min-height:16px;margin:0;text-align:center;font-size:11px;color:#276b3f}
.form-result.error{color:#a02c2c}
.wishes-section{min-height:670px;padding:88px 20px 80px;background:#171817 url(../images/potongan-fallback.jpg) center/cover no-repeat!important}
.wishes-section:before{background:rgba(17,18,17,.34)}
.wishes{margin:0}
.wishes>.script-title{font:400 30px/1.2 Cinzel,serif;text-transform:uppercase;margin-bottom:18px}
.wishes>.section-copy{font-size:10px;line-height:1.6;margin-bottom:22px}
.wishes-form{display:flex;flex-direction:column;gap:10px;padding:28px 16px 34px;border-radius:6px;background:#fff;color:#242524;text-align:left;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.wishes-form input,.wishes-form textarea{width:100%;margin:0;padding:11px 12px;border:1px solid #ddd4c8;border-radius:6px;background:#fff;color:#242524;font:400 11px Mont,sans-serif;outline:none}
.wishes-form input:focus,.wishes-form textarea:focus{border-color:#c79963;box-shadow:0 0 0 3px rgba(199,153,99,.13)}
.wish-submit{align-self:flex-start;border:0;border-radius:2px;padding:9px 23px;background:var(--cream);color:#222;font-size:10px;font-weight:700;cursor:pointer}
.wish-submit:disabled{opacity:.5;cursor:not-allowed}
.wishes-form .form-result{color:#276b3f;text-align:left}
.wishes-form .form-result.error{color:#a02c2c}
.wishes-section .message-list{margin-top:24px}
.attendance-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:25px 0}
.attendance-summary div{display:flex;flex-direction:column;padding:13px 4px;border:1px solid rgba(243,221,191,.5);border-radius:8px;background:rgba(0,0,0,.15)}
.attendance-summary strong{font:400 26px Garamond,serif;color:var(--cream)}
.attendance-summary span{font-size:8px;margin-top:4px;text-transform:uppercase}
.message-list{display:flex;flex-direction:column;gap:10px;max-height:500px;overflow:auto;text-align:left;padding-right:3px}
.message-card{padding:15px 16px;border-radius:10px;background:rgba(248,244,237,.95);color:#2a2b29}
.message-card header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px}
.message-card strong{font:600 15px Garamond,serif}
.message-card time{font-size:8px;color:#777}
.message-card p{font-size:11px;line-height:1.7;margin:0;white-space:pre-line}
.admin-reply{margin-top:12px;padding:11px 12px;border-left:3px solid #b98a50;border-radius:0 7px 7px 0;background:#eee3d5}
.admin-reply>div{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:5px}
.admin-reply>div strong{font:700 10px Mont,sans-serif;color:#765a35;text-transform:uppercase;letter-spacing:.5px}
.admin-reply time{font-size:7px;color:#887b6d}
.attendance-badge{display:inline-block;margin-top:10px;padding:4px 8px;border-radius:99px;background:#e8ddcd;font-size:8px;text-transform:uppercase}
.loading-message{text-align:center;font-size:11px;color:#ddd}

.closing-section{min-height:100svh;padding:clamp(105px,19.5svh,140px) 24px clamp(34px,6svh,48px);display:flex;align-items:center;flex-direction:column;justify-content:flex-start;overflow:hidden;background:#e9e7e1 url(../images/modern-jawa-all-page.jpg) center 44%/cover no-repeat;color:#111}
.closing-section:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(248,247,243,.05),rgba(250,249,245,.6) 48%,rgba(252,251,247,.86) 76%,rgba(252,251,247,.76))}
.closing-lottie{position:absolute!important;z-index:4!important;inset:0;pointer-events:none}
.closing-wayang{width:50%;max-width:150px;margin:0 auto clamp(69px,11svh,78px);opacity:.82;filter:grayscale(1) brightness(.5)}
.closing-section.motion-active .closing-wayang.is-visible{animation:closingWayangFloat 6s ease-in-out infinite}
.closing-section>p{font:400 10px/1.65 Mont,sans-serif;max-width:335px;margin:0 auto}
.closing-section .display-title{font-size:clamp(27px,8vw,32px);margin:clamp(16px,3svh,23px) 0 0}
.closing-side-wayang{position:absolute!important;z-index:3!important;bottom:clamp(18px,3.5svh,26px);width:29%;max-width:106px;opacity:.88;filter:grayscale(1) brightness(.28);pointer-events:none;backface-visibility:hidden}
.closing-side-left{left:-10%;transform:rotate(-18deg)}
.closing-side-right{right:-10%;transform:scaleX(-1) rotate(-18deg)}
.closing-section.motion-active .closing-side-left{animation:closingSideLeft 6.5s ease-in-out infinite}
.closing-section.motion-active .closing-side-right{animation:closingSideRight 7s ease-in-out infinite}
.closing-section>span{font-size:9px;letter-spacing:2px;text-transform:uppercase}
.closing-section>p,.closing-section>h2,.closing-section>span{z-index:5;color:#111}

.invitation-footer{position:relative;min-height:245px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 28px 65px;text-align:center;background:#171817 url(../images/potongan-fallback.jpg) center/cover no-repeat;color:#fff;overflow:hidden}
.invitation-footer:before,.invitation-footer:after{content:"";position:absolute;width:42%;aspect-ratio:555/678;background:url(../images/bunga-jawa.png) center/contain no-repeat;opacity:.55;pointer-events:none}
.invitation-footer:before{left:-24%;top:-35%;transform:scaleX(-1)}
.invitation-footer:after{right:-23%;top:-32%}
.invitation-footer.motion-active:before{animation:footerFlowerLeft 7s ease-in-out infinite}
.invitation-footer.motion-active:after{animation:footerFlowerRight 6.5s ease-in-out infinite}
.invitation-footer p,.invitation-footer span,.footer-socials{position:relative;z-index:2}
.invitation-footer p{margin:0 0 7px;font-size:10px;font-style:italic}
.invitation-footer>span{font-size:9px;font-style:italic}
.footer-socials{display:flex;gap:18px;margin-top:24px}
.footer-socials a{display:grid;place-items:center;width:29px;height:29px;border:2px solid #fff;border-radius:50%;font-size:17px;font-weight:700}

.music-control{position:fixed;z-index:120;left:16px;bottom:19px;width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:#171817;box-shadow:0 6px 18px rgba(0,0,0,.3),inset 0 0 0 1px #d9d5ce;cursor:pointer}
.music-control.playing{animation:spin 5s linear infinite}
.bottom-nav{display:none}
.bottom-nav a{display:grid;place-items:center;width:37px;height:30px;border-radius:99px;font-size:14px}
.bottom-nav a:hover{background:#e8d2b3;color:#222}

.reveal{opacity:0;transform:translate3d(0,34px,0) scale(.985);transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.reveal.is-visible{opacity:1;transform:none}
.delay-1{transition-delay:.15s}.delay-2{transition-delay:.3s}.delay-3{transition-delay:.5s}
.story-section .story-reveal{opacity:0;filter:blur(4px);transition:opacity .75s ease,transform 1.05s cubic-bezier(.16,1,.3,1),filter .7s ease}
.story-section .story-heading{transform:translate3d(0,-30px,0) scale(.94)}
.story-section .story-tagline-reveal{transform:translate3d(0,20px,0);transition-delay:.12s}
.story-section .story-from-left{transform:translate3d(-58px,30px,0) rotate(-1.5deg)}
.story-section .story-from-right{transform:translate3d(58px,30px,0) rotate(1.5deg)}
.story-section .story-card:nth-child(1){transition-delay:.22s}
.story-section .story-card:nth-child(2){transition-delay:.38s}
.story-section .story-card:nth-child(3){transition-delay:.54s}
.story-section .story-reveal.is-visible{opacity:1;filter:none;transform:none}

@keyframes sparkleFall{to{background-position:5px 198px,30px 264px}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes heroWayangFloat{0%,100%{transform:translate3d(-50%,0,0) scale(1)}50%{transform:translate3d(-50%,8px,0) scale(1.025)}}
@keyframes quoteFlowerRight{0%,100%{transform:translate3d(0,0,0) rotate(8deg)}50%{transform:translate3d(-8px,12px,0) rotate(11deg) scale(1.035)}}
@keyframes quoteFlowerLeft{0%,100%{transform:translate3d(0,0,0) scaleX(-1) rotate(8deg)}50%{transform:translate3d(10px,-10px,0) scaleX(-1) rotate(4deg) scale(1.035)}}
@keyframes floralSwayRight{0%,100%{transform:translate3d(0,0,0) rotate(10deg)}50%{transform:translate3d(-8px,9px,0) rotate(14deg) scale(1.035)}}
@keyframes floralSwayLeft{0%,100%{transform:translate3d(0,0,0) scaleX(-1) rotate(10deg)}50%{transform:translate3d(9px,-7px,0) scaleX(-1) rotate(6deg) scale(1.03)}}
@keyframes ornamentBreathe{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,7px,0) scale(1.045)}}
@keyframes storyFlowerLeft{0%,100%{transform:translate3d(0,0,0) scaleX(-1) rotate(8deg)}50%{transform:translate3d(13px,-12px,0) scaleX(-1) rotate(3deg) scale(1.055)}}
@keyframes storyFlowerRight{0%,100%{transform:translate3d(0,0,0) rotate(9deg)}50%{transform:translate3d(-12px,14px,0) rotate(14deg) scale(1.05)}}
@keyframes closingWayangFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-9px,0) scale(1.025)}}
@keyframes closingSideLeft{0%,100%{transform:translate3d(0,0,0) rotate(-18deg)}50%{transform:translate3d(5px,-6px,0) rotate(-14deg)}}
@keyframes closingSideRight{0%,100%{transform:translate3d(0,0,0) scaleX(-1) rotate(-18deg)}50%{transform:translate3d(-5px,-6px,0) scaleX(-1) rotate(-14deg)}}
@keyframes footerFlowerLeft{0%,100%{transform:translate3d(0,0,0) scaleX(-1)}50%{transform:translate3d(8px,8px,0) scaleX(-1) rotate(-4deg)}}
@keyframes footerFlowerRight{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-8px,9px,0) rotate(4deg)}}
@keyframes ambientDustDrift{0%,100%{transform:translate3d(0,0,0);opacity:.42}50%{transform:translate3d(5px,14px,0);opacity:.78}}
.sway,.sway-reverse,.quote-section:before,.quote-section:after,.invitation-footer:before,.invitation-footer:after{backface-visibility:hidden;transform-origin:center}

@media (min-width:900px){
    body{background:#0f100f}
    .desktop-cover{position:fixed;inset:0 500px 0 0;display:flex;align-items:flex-end;background:#171817 url(../images/modern-jawa-fallback.jpg) center bottom/cover no-repeat;padding:0 0 12vh 7vw}
    .desktop-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,20,.28),rgba(20,20,20,.22) 45%,rgba(0,0,0,.7))}
    .desktop-copy{position:relative;z-index:1;text-align:left}
    .desktop-copy p,.desktop-copy span{font:500 14px Cinzel,serif;letter-spacing:2px;text-transform:uppercase}
    .desktop-copy h2{font:400 clamp(44px,5vw,72px)/1 Vidaloka,serif;margin:9px 0 16px}
    .invitation{margin:0 0 0 auto}
    .opening-cover{left:auto;right:0;width:500px;max-width:500px;margin:0}
    .music-control{left:50px;bottom:25px}
    .bottom-nav{left:auto;right:190px;transform:none}
}

@media (max-width:380px){
    .section-pad{padding-left:23px;padding-right:23px}
    .cover-content{padding-top:14vh}
    .cover-content h1{font-size:39px}
    .script-title{font-size:50px}
}

@media (prefers-reduced-motion:reduce){
    *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
    .reveal{opacity:1;transform:none}
    .story-section .story-reveal{opacity:1;transform:none;filter:none;transition:none}
}