:root{--taupe:#A98B76;--sand:#BFA28C;--ivory:#F3E4C9;--sage:#BABF94;--ink:#574334;--muted:#88715d;--gold:#aa9159;--paper:#fcf7ec;--line:#c4ac83;--pane:420px;--serif:'Cormorant Garamond',Georgia,serif;--script:'Italianno',cursive;--body:'Poppins',sans-serif}
*{box-sizing:border-box}html{width:100%;scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--taupe);color:var(--ink);font:400 11px/1.9 var(--body);overflow-x:hidden}body.is-closed{overflow:hidden}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit}img{max-width:100%;display:block}button:focus-visible,a:focus-visible{outline:2px solid var(--ink);outline-offset:5px}h1,h2,h3,p{margin:0}section{scroll-margin-top:16px}::selection{background:var(--sage);color:var(--ink)}.script{font:400 40px/1.1 var(--script)}.eyebrow{font-size:9px;letter-spacing:.21em;text-transform:uppercase;margin-bottom:10px}.section-title{font-size:49px;line-height:1.03;margin:0 0 22px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.desktop-poster{position:fixed;inset:0 var(--pane) 0 0;overflow:hidden;background:var(--sand);color:var(--ivory)}.poster-image{width:100%;height:100%;object-fit:cover;object-position:center 43%}.poster-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(63,47,33,.14),rgba(63,47,33,.21) 35%,rgba(53,43,29,.75))}.poster-copy{position:absolute;top:48%;left:5%;right:5%;text-align:center;transform:translateY(-50%);text-shadow:0 2px 18px #5c493c}.poster-copy .script{font-size:37px;margin-bottom:12px}.poster-copy h2{font:600 clamp(36px,3.9vw,64px)/1.05 var(--serif);text-transform:uppercase;margin-bottom:16px;letter-spacing:.015em}.poster-copy>p:last-child{font-size:12px;font-weight:500}.poster-note{position:absolute;bottom:32px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:.3em;color:#f4e8d4}
.invitation-pane{width:min(100%,var(--pane));min-width:0;margin-left:auto;position:relative;box-shadow:-15px 0 60px #4835243d;background:var(--sand)}.cover{position:fixed;z-index:100;top:0;right:0;bottom:0;width:var(--pane);height:100svh;min-height:560px;color:var(--paper);overflow:hidden;background:var(--taupe);transition:transform 1.15s cubic-bezier(.76,0,.24,1),visibility 1.15s}.cover-image{width:100%;height:100%;object-fit:cover;object-position:center 45%;animation:cover-drift 16s ease-in-out infinite alternate}.cover-shade{position:absolute;inset:0;background:linear-gradient(180deg,#4e3b2e75 0%,#76604d12 35%,#49382c14 48%,#49382cd9 100%)}.cover-top{position:absolute;top:10%;left:24px;right:24px;text-align:center}.cover-top .script{font-size:34px;margin-bottom:16px}.cover-top h1{font:600 33px/1.1 var(--serif);text-transform:uppercase;letter-spacing:.01em;text-shadow:0 2px 20px #524333}.fine-line{display:block;margin:20px auto 0;width:70px;height:1px;background:#f3e4c97a}.cover-bottom{position:absolute;bottom:9%;left:25px;right:25px;text-align:center}.cover-bottom>p{font-size:10px;line-height:1.8}.cover-bottom h2{font:600 25px/1.2 var(--serif);margin:13px 0 24px;overflow-wrap:anywhere}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--sage);color:#4e4834;border:1px solid #f9f0dd;border-radius:50px;padding:9px 18px;text-decoration:none;font-size:10px;font-weight:500;line-height:1.5;transition:background .3s,transform .3s,box-shadow .3s;min-height:35px}.button svg{width:14px;height:14px;flex:none}.button:hover{background:var(--ivory);transform:translateY(-2px);box-shadow:0 6px 18px #54413424}.cover-button{min-width:180px;background:#b8ae84;color:#fff9ec}.cover-top,.cover-bottom{transition:opacity .5s,transform .7s}.cover.is-opening .cover-top{opacity:0;transform:translateY(-40px)}.cover.is-opening .cover-bottom{opacity:0;transform:translateY(40px)}.cover.is-opening{transform:translateY(-100%);visibility:hidden;transition-delay:.16s}.cover.is-gone{display:none}
.scene{position:relative;isolation:isolate;background:#BFA28C url('assets/reference/JAWA-BACKGROUND.jpg') center center/100% auto repeat-y}.scene:before{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#a98b7620,#f3e4c914 50%,#babf942b);pointer-events:none}.hero{width:100%;max-width:100%;height:100vh;height:100dvh;min-height:100svh;aspect-ratio:auto;overflow:hidden}.hero-art{position:absolute;inset:0;background:url('assets/reference/JAWA-FALLBACK.jpg') center/cover no-repeat;transform:scale(1.02);filter:saturate(.66);animation:scene-drift 12s ease-in-out infinite alternate}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#babf9419,transparent 40%,#a98b7617);pointer-events:none}.hero-copy{position:absolute;z-index:2;top:22%;left:19%;right:19%;text-align:center;color:var(--ivory)}.hero-copy .script{font-size:28px;margin-bottom:20px}.hero-copy h2{font:500 42px/1.05 var(--serif);text-transform:uppercase;color:#e2d3a6;letter-spacing:.015em}.hero-copy h2 span{display:block}.hero-copy h2 i{display:block;font:400 43px/1 var(--script);color:var(--paper);margin:7px 0 10px}.hero-date{font:600 17px var(--serif);letter-spacing:.19em;margin-top:25px;color:var(--paper)}.hero-copy>*{opacity:0;transform:translateY(24px)}.is-open .hero-copy>*{animation:arrive 1.1s cubic-bezier(.2,.7,.2,1) both;animation-delay:.65s}.is-open .hero-copy h2{animation-delay:.9s}.is-open .hero-copy .hero-date{animation-delay:1.1s}.hero-flower{position:absolute;z-index:3;bottom:-12px;width:32%;height:30%;object-fit:contain;transform-origin:50% 100%;filter:saturate(.5);animation:sway 6s ease-in-out infinite alternate;pointer-events:none}.flower-left{left:-30px}.flower-right{right:-30px;animation-direction:alternate-reverse;animation-duration:7s}.scroll-cue{position:absolute;z-index:4;bottom:24px;left:50%;width:21px;height:32px;border:1px solid #fff7dfb3;border-radius:12px;transform:translateX(-50%)}.scroll-cue span{position:absolute;top:7px;left:9px;width:2px;height:7px;background:var(--paper);border-radius:2px;animation:scroll-dot 2s infinite}
.paper-panel{position:relative;z-index:1;margin:0 19px;padding:52px 25px;background:rgba(252,247,236,.96);border:1px solid #d3b881;text-align:center;overflow:hidden}.paper-panel:after{content:'';position:absolute;inset:6px;pointer-events:none;border:1px solid #cbbd9c70;z-index:-1}.arch-panel{border-radius:210px 210px 0 0;padding-top:88px}.arch-panel:after{border-radius:205px 205px 0 0}.panel-motif{position:absolute;top:0;left:0;width:100%;opacity:.16;pointer-events:none}.couple-section{padding:35px 0 50px}.small-gunungan{width:40px;height:68px;object-fit:contain;position:relative;margin:-65px auto 52px;filter:saturate(.5)}.greeting{font:500 18px/1.4 var(--serif);margin-bottom:26px}.intro-copy .section-title{margin-bottom:25px}.intro-copy>p:last-child{max-width:270px;margin:auto;font-size:10px}.couple-art{position:relative;margin:38px auto 26px;max-width:290px;padding:0 20px}.together-portrait{position:relative;z-index:1;width:100%;border-radius:150px 150px 3px 3px;overflow:hidden;border:5px solid #e5d6b6;outline:1px solid #b59c73;box-shadow:0 15px 25px #765d4226;background:var(--sand)}.together-portrait img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain}.couple-wayang{position:absolute;z-index:0;top:31%;width:105px;filter:saturate(.55);transform-origin:50% 100%;animation:sway 7s ease-in-out infinite alternate}.couple-wayang.left{left:-15px;transform:rotate(-10deg)}.couple-wayang.right{right:-15px;transform:rotate(10deg);animation-direction:alternate-reverse}.together-flower{position:absolute;z-index:2;bottom:-8px;width:90px;filter:saturate(.5);pointer-events:none}.together-flower.left{left:-12px;transform:rotate(-12deg)}.together-flower.right{right:-12px;transform:rotate(12deg)}.couple-names .person{margin:0}.couple-names .couple-amp{margin:24px 0 17px}.person h3{font-size:59px;margin-bottom:0}.full-name{font:600 20px/1.15 var(--serif);text-transform:uppercase;letter-spacing:.015em;margin:2px 0 12px}.parents{font-size:10px;line-height:1.8}.couple-amp{font-size:54px;color:var(--taupe);margin:27px 0 -15px}.ornament-divider{display:flex;align-items:center;justify-content:center;gap:18px;color:#aa9159;margin:40px auto -18px}.ornament-divider:before,.ornament-divider:after{content:'';width:50px;height:1px;background:#aa91594d}
.verse-section{padding:15px 19px 65px}.verse-panel{position:relative;text-align:center;background:var(--taupe);color:#fbf3e3;padding:48px 25px 42px;border:1px solid #f3e4c9ba;box-shadow:inset 0 0 0 5px #bfa28c,inset 0 0 0 6px #f3e4c957}.verse-panel:before{content:'';position:absolute;inset:0;background:url('assets/kawung.svg') repeat;opacity:.09;pointer-events:none}.monogram{font:500 61px/.9 var(--serif);margin:0 auto 28px;letter-spacing:-.06em}.monogram i{font:400 39px var(--script);color:var(--ivory);margin:0 3px}.arabic{font:400 19px/2.1 Georgia,serif;position:relative;margin-bottom:20px}.verse-panel blockquote{font:400 10px/1.9 var(--body);margin:0;position:relative}.verse-source{font-size:9px;margin-top:20px;letter-spacing:.1em}
.event-section{padding:0 0 55px}.section-heading{position:relative}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:28px 0 26px}.countdown>div{background:var(--sage);padding:12px 4px 9px;border-radius:16px 16px 3px 3px;color:#4d533d}.countdown strong{display:block;font:600 28px/1 var(--serif)}.countdown span{display:block;font-size:8px;margin-top:5px}.event-intro{font-size:10px;margin-bottom:30px}.event-card{padding:30px 12px 32px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;margin-top:28px;background:linear-gradient(180deg,#f3e4c963,transparent);border-radius:100px 100px 0 0}.event-symbol{display:block;font:400 34px/1 var(--serif);color:#a18d5b;margin-bottom:16px}.event-card h3{font-size:49px;margin-bottom:17px}.event-card .day{text-transform:uppercase;font-size:9px;letter-spacing:.18em}.event-card .date{font:600 23px/1.1 var(--serif);margin:7px 0 10px}.short-line{display:block;width:45px;height:1px;background:var(--line);margin:20px auto}.event-card h4{font:600 17px/1.25 var(--serif);text-transform:uppercase;margin:0 0 10px}.event-card .address{font-size:10px;margin-bottom:20px}.location-section{padding-bottom:55px}.location-section .paper-panel{padding-top:43px}.location-section .section-title{font-size:45px}.map-frame{padding:5px;border:1px solid var(--line);margin:25px 0 21px;background:#e5d8ba}.map-frame iframe{display:block;width:100%;height:240px;border:0;background:var(--ivory)}
.gift-section{padding-bottom:55px}.gift-section .section-title{margin-bottom:18px}.gift-card{padding:24px 18px;margin-top:24px;border:1px solid #bfa28c;border-radius:18px;background:linear-gradient(135deg,#e4d1b4,#f3e4c9);box-shadow:0 8px 20px #8b735312}.bank-name{display:block;font:600 italic 31px var(--serif);text-align:right;color:#6c7160;margin-bottom:14px}.account-number{font:600 24px var(--serif);letter-spacing:.07em}.gift-card>p:not(.account-number){font-size:10px;margin:4px 0 15px}.gift-card .button{font-size:9px}.gift-address{background:transparent;box-shadow:none}.gift-address h3{font:600 22px var(--serif);margin-bottom:10px}.gift-address>p:first-of-type{font-weight:600}.copy-feedback{min-height:18px;font-size:10px;margin:14px 0 -16px;color:#657046}
.response-section{padding-bottom:45px}.response-section .paper-panel{padding-bottom:33px}.rsvp-form{text-align:left;margin-top:30px}.field{margin-bottom:17px}.field label{display:block;font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.field input,.field select,.field textarea{display:block;width:100%;color:var(--ink);border:1px solid #cab59c;background:#fffaf1;border-radius:6px;padding:11px 12px;min-height:42px;font-size:11px;outline:none}.field select{padding-right:20px}.field textarea{resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#8e7b5b;box-shadow:0 0 0 2px #babf944d}.rsvp-form>.button{width:100%;background:var(--taupe);color:var(--paper);border-color:var(--taupe);min-height:40px}.rsvp-form>.button:hover{background:#8f7562}.form-feedback{min-height:20px;font-size:10px;line-height:1.6;color:#617047;margin-top:12px}.wish-list{text-align:left;max-height:350px;overflow:auto;margin-top:25px;padding-right:5px;scrollbar-width:thin;scrollbar-color:#bfa28c transparent}.wish{padding:16px 0;border-top:1px solid #c7b69977}.wish strong{display:inline;font:600 18px var(--serif);overflow-wrap:anywhere}.wish span{display:inline-block;background:#babf9440;border-radius:12px;padding:1px 7px;margin-left:8px;font-size:8px;color:#646f49}.wish p{font-size:10px;margin-top:8px;overflow-wrap:anywhere}.closing{padding:70px 30px 340px;text-align:center;min-height:790px;background-size:100% 100%;background-repeat:no-repeat}.closing:after{content:'';position:absolute;inset:25px 19px 280px;z-index:-1;background:#fcf7eceb;border:1px solid #cfb78e;border-radius:180px 180px 0 0}.closing-gunungan{width:38px;height:65px;object-fit:contain;margin:0 auto 24px;filter:saturate(.5)}.closing .section-title{font-size:50px;margin-bottom:20px}.closing p{font-size:10px;max-width:285px;margin-inline:auto}.closing .closing-label{margin-top:25px;font-size:9px}.closing h3{font:600 31px/1 var(--serif);margin:12px 0 10px;text-transform:uppercase}.closing .closing-date{font-size:9px;letter-spacing:.1em}
.music-toggle{position:fixed;z-index:30;right:17px;bottom:20px;border:1px solid #f3e4c999;border-radius:50%;width:37px;height:37px;background:#625240e8;color:var(--paper);display:grid;place-items:center;box-shadow:0 3px 12px #352a2338;opacity:0;pointer-events:none;transition:opacity .5s,background .3s}.music-toggle svg{width:25px;height:25px}.is-open .music-toggle{opacity:1;pointer-events:auto}.music-toggle[aria-pressed=true]{background:#87906a}.music-toggle[aria-pressed=true] svg{animation:record-spin 7s linear infinite}.reveal{opacity:0;transform:translateY(28px);transition:opacity .85s ease,transform 1s cubic-bezier(.2,.7,.2,1)}.reveal.in-view{opacity:1;transform:translateY(0)}.noscript-note{background:var(--ivory);padding:20px;position:fixed;z-index:150;bottom:0;right:0;width:var(--pane);text-align:center}
@keyframes arrive{to{opacity:1;transform:translateY(0)}}@keyframes cover-drift{from{transform:scale(1)}to{transform:scale(1.06)}}@keyframes scene-drift{from{transform:scale(1.02) translateY(0)}to{transform:scale(1.045) translateY(4px)}}@keyframes sway{from{rotate:-3deg}to{rotate:3deg}}@keyframes scroll-dot{0%,100%{opacity:.2;transform:translateY(0)}50%{opacity:1;transform:translateY(8px)}}@keyframes record-spin{to{transform:rotate(360deg)}}
@media(min-width:1500px){:root{--pane:460px}.hero-copy .script{font-size:31px}.hero-copy h2{font-size:46px}.hero-date{margin-top:30px}.paper-panel{margin-inline:22px;padding-inline:31px}.couple-art{max-width:310px}}
@media(max-width:800px){:root{--pane:100%}.desktop-poster{display:none}.invitation-pane{width:100%;max-width:500px;margin:auto;box-shadow:0 0 40px #4835243d}.cover{width:100%;max-width:500px;left:50%;right:auto;transform:translateX(-50%)}.cover.is-opening{transform:translate(-50%,-100%)}.music-toggle{right:max(17px,calc((100vw - 500px)/2 + 17px))}.hero{height:100vh;height:100dvh;min-height:100svh;aspect-ratio:auto}.hero-copy{top:22%}.hero-copy h2{font-size:clamp(36px,10.5vw,49px)}.hero-copy .script{font-size:clamp(25px,7.1vw,32px)}.hero-art{background-size:cover}.hero-date{font-size:16px}.cover-top h1{font-size:clamp(29px,8.5vw,39px)}.cover-top{top:9%}.noscript-note{max-width:500px;left:50%;right:auto;transform:translateX(-50%)}}
@media(max-width:360px){body{font-size:10px}.paper-panel{margin-inline:13px;padding-inline:20px}.arch-panel{padding-top:80px}.hero{min-height:100svh}.hero-copy{left:17%;right:17%}.hero-copy .script{margin-bottom:16px}.hero-date{margin-top:21px;font-size:14px}.cover{min-height:520px}.section-title{font-size:45px}.couple-art{padding-inline:15px}.couple-wayang.left{left:-17px}.couple-wayang.right{right:-17px}.countdown{gap:5px}.countdown strong{font-size:25px}.verse-section{padding-inline:13px}.verse-panel{padding-inline:20px}.closing{padding-inline:27px}}
html[data-motion="reduced"]{scroll-behavior:auto}html[data-motion="reduced"] *,html[data-motion="reduced"] *:before,html[data-motion="reduced"] *:after{animation:none!important;transition-duration:.01ms!important}html[data-motion="reduced"] .reveal,html[data-motion="reduced"] .hero-copy>*{opacity:1;transform:none}html[data-motion="reduced"] .cover.is-opening{transition-delay:0s}

/* Input berukuran 16px mencegah zoom fokus otomatis di browser ponsel. */
@media(max-width:800px){.field input,.field select,.field textarea{font-size:16px;min-height:44px}.field input,.field textarea{line-height:1.5}}