*{box-sizing:border-box;margin:0;padding:0}:root{--primary-color:#d4af37;--secondary-color:#8b7355;--accent-color:#f4f1e8;--text-dark:#2c2c2c;--text-light:#fff;--background-dark:#1a1a1a;--background-light:#f8f8f8;--gradient-primary:linear-gradient(135deg, #d4af37, #f4d03f);--gradient-dark:linear-gradient(135deg, #1a1a1a, #2c2c2c)}body{color:var(--text-dark);font-family:Poppins,sans-serif;line-height:1.6;overflow-x:hidden}html{scroll-behavior:smooth}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--background-dark)}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--secondary-color)}.main-content{background:var(--background-light)}.hidden{display:none}.section{z-index:1;align-items:center;min-height:100vh;padding:80px 0;display:flex;position:relative}.container{max-width:1200px;margin:0 auto;padding:0 20px}.section-title{text-align:center;color:var(--primary-color);margin-bottom:50px;font-family:Dancing Script,cursive;font-size:3rem;position:relative}.section-title:after{content:"";background:var(--gradient-primary);border-radius:2px;width:100px;height:3px;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}.loading-screen{background:var(--gradient-dark);z-index:9999;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .5s;display:flex;position:fixed;top:0;left:0}.loading-content{text-align:center;color:var(--text-light)}.loading-spinner{border:3px solid #d4af374d;border-top:3px solid var(--primary-color);border-radius:50%;width:50px;height:50px;margin:0 auto 20px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.cover-section{background:var(--gradient-dark);width:100%;max-height:100vh;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);z-index:1;opacity:0;justify-content:center;align-items:center;transition:opacity 1s,transform 1s;display:flex;position:relative;overflow-x:auto;transform:translateY(20px)}.cover-section.show{opacity:1;transform:translateY(0)}.cover-content{text-align:center;max-width:500px;max-height:100vh;color:var(--text-light);z-index:2;padding:20px;position:relative}.ornament-top,.ornament-bottom{color:var(--primary-color);padding:20px 0;font-size:2rem;animation:1.5s ease-in-out infinite heartbeat}.ornament-bottom{animation:2s ease-in-out infinite heartbeat}@keyframes heartbeat{0%,to{transform:scale(1)}30%{transform:scale(1.15)}60%{transform:scale(1)}}.wedding-title{color:var(--primary-color);margin-bottom:30px;font-family:Dancing Script,cursive;font-size:2.5rem;font-weight:600}.couple-photo{border:4px solid var(--primary-color);border-radius:50%;width:200px;height:200px;margin:0 auto 30px;overflow:hidden;box-shadow:0 0 30px #d4af374d}.couple-photo img{object-fit:cover;width:100%;height:100%}.couple-names{margin-bottom:clamp(10px,4vw,20px)}.combined-names{justify-content:center;align-items:center;gap:clamp(5px,2vw,15px);margin:0;display:flex}.combined-names .bride-name,.combined-names .groom-name{color:var(--text-light);margin:0;font-family:Dancing Script,cursive;font-size:clamp(1.8rem,5vw,2.2rem);font-weight:600;line-height:1}.combined-names .ampersand{color:var(--primary-color);margin:0;font-family:Dancing Script,cursive;font-size:clamp(1.5rem,4vw,2rem)}.wedding-date{margin-bottom:30px;font-size:1.1rem}.guest-name{margin-bottom:40px}.guest-name h3{color:var(--primary-color);margin-top:10px;font-family:Dancing Script,cursive;font-size:1.8rem}.open-invitation-btn{background:var(--gradient-primary);color:var(--text-dark);cursor:pointer;border:none;border-radius:50px;padding:15px 30px;font-family:Poppins,sans-serif;font-size:1.1rem;font-weight:500;transition:all .3s;box-shadow:0 5px 15px #d4af374d}.open-invitation-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #d4af3766}.open-invitation-btn i{margin-right:10px}.home-section{background:var(--gradient-dark);color:var(--text-light);text-align:center}.bismillah{color:var(--primary-color);margin-bottom:40px;font-size:1.5rem}.verse{max-width:800px;margin:0 auto 40px;font-style:italic;line-height:1.8}.verse-ref{color:var(--primary-color);margin-top:20px;font-weight:500;display:block}.invitation-text{max-width:600px;margin:0 auto;font-size:1.1rem}.couple-section{background:var(--background-light)}.couple-container{grid-template-columns:1fr auto 1fr;align-items:center;gap:50px;max-width:1000px;margin:0 auto;display:grid}.bride-info,.groom-info{text-align:center}.profile-photo{border:4px solid var(--primary-color);border-radius:50%;width:250px;height:250px;margin:0 auto 30px;overflow:hidden;box-shadow:0 10px 30px #0000001a}.profile-photo img{object-fit:cover;width:100%;height:100%}.bride-info h3,.groom-info h3{color:var(--primary-color);margin-bottom:15px;font-family:Dancing Script,cursive;font-size:2rem}.couple-divider{color:var(--primary-color);text-align:center;font-size:3rem}.social-links{justify-content:center;align-items:center;gap:10px;margin-top:20px;display:flex}.social-link{background:var(--primary-color);width:25px;height:25px;color:var(--text-light);border-radius:50%;justify-content:center;align-items:center;text-decoration:none;transition:all .3s;display:flex}.social-link:hover{transform:translateY(-2px);box-shadow:0 5px 15px #d4af374d}.social-links p{margin:0;font-family:Poppins,sans-serif;font-size:14px}.event-section{background:var(--gradient-dark);color:var(--text-light)}.events-container{grid-template-columns:1fr 1fr;align-items:stretch;gap:40px;margin-bottom:60px;display:grid}.event-card{backdrop-filter:blur(10px);text-align:center;background:#ffffff1a;border:1px solid #d4af3733;border-radius:20px;padding:40px}.event-icon{color:var(--primary-color);margin-bottom:20px;font-size:3rem}.event-card h3{color:var(--primary-color);margin-bottom:20px;font-family:Dancing Script,cursive;font-size:2rem}.event-details p{justify-content:center;align-items:center;gap:10px;margin-bottom:10px;display:flex}.map-btn{background:var(--gradient-primary);color:var(--text-dark);cursor:pointer;border:none;border-radius:25px;margin-top:20px;padding:12px 25px;transition:all .3s}.map-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #d4af374d}.gallery-section{background:var(--background-light)}.gallery-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;display:grid}.gallery-item{aspect-ratio:1;cursor:pointer;border-radius:15px;transition:all .3s;position:relative;overflow:hidden}.gallery-item:hover{transform:translateY(-5px);box-shadow:0 15px 35px #0003}.gallery-item img{object-fit:cover;width:100%;height:100%;transition:all .3s}.gallery-overlay{opacity:0;background:#000000b3;justify-content:center;align-items:center;width:100%;height:100%;transition:all .3s;display:flex;position:absolute;top:0;left:0}.gallery-item:hover .gallery-overlay{opacity:1}.gallery-overlay i{color:var(--text-light);font-size:2rem}.gift-section{text-align:center;max-width:auto;background:var(--gradient-dark);color:var(--text-light);margin:auto}.gift-options,.gift-options-money,.gift-options-giftbox{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:30px auto;padding:0;list-style:none;display:grid}.gift-options-money li,.gift-options-giftbox li{text-align:center;background:#ffffff0d;border-radius:16px;padding:20px;transition:transform .2s,box-shadow .2s;position:relative;box-shadow:0 4px 15px #0000001a}.gift-options-money li:hover,.gift-options-giftbox li:hover{transform:translateY(-5px);box-shadow:0 12px 25px #0000004d}.gift-options-money li strong,.gift-options-giftbox li strong{color:var(--primary-color);margin-bottom:15px;font-weight:600;display:block}.gift-options-money li p,.gift-options-giftbox li p{word-break:break-word;margin:10px 0}.copy-btn-bank,.copy-btn-ovo,.copy-btn-gopay,.copy-btn-address{background:var(--primary-color);color:var(--text-light);cursor:pointer;border:none;border-radius:8px;padding:5px 10px;font-size:.8rem;transition:background .2s}.copy-btn-bank:hover,.copy-btn-ovo:hover,.copy-btn-gopay:hover,.copy-btn-address:hover{background:#d4af37}.rsvp-section{background:var(--gradient-light);color:var(--text-dark)}.rsvp-container{grid-template-columns:1fr 1fr;gap:40px;margin:0 auto;padding-bottom:40px;display:grid}.rsvp-footer{text-align:center;color:var(--primary-color);margin:0 80px;padding:30px 40px 0}.rsvp-form{backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #d4af3733;border-radius:20px;padding:40px}.form-group{margin-bottom:25px}.form-group label{color:var(--primary-color);margin-bottom:8px;font-weight:500;display:block}.form-group select option{color:var(--text-linght);background-color:var(--background-light)}.form-group input,.form-group select,.form-group textarea{width:100%;color:var(--primary-color);background:#ffffff1a;border:1px solid #d4af374d;border-radius:10px;padding:12px 15px;font-family:inherit;font-size:1rem}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--primary-color);outline:none;box-shadow:0 0 10px #d4af3733}.form-group input:focus,.form-group textarea:focus{color:var(--text-dark)}.submit-btn{background:var(--gradient-primary);width:100%;color:var(--text-light);cursor:pointer;border:none;border-radius:10px;padding:15px;font-family:Poppins,sans-serif;font-size:1rem;font-weight:500;transition:all .3s}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #d4af374d}.wishes-container{backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #d4af3733;border-radius:20px;padding:40px}.wishes-container h3{color:var(--primary-color);text-align:center;margin-bottom:30px;font-family:Dancing Script,cursive;font-size:2rem}.wishes-list{max-height:400px;bottom:0;overflow-y:auto}.wish-item{border-left:4px solid var(--primary-color);background:#ffffff0d;border-radius:10px;margin-bottom:15px;padding:20px}.wish-name{color:var(--primary-color);margin-bottom:5px;font-weight:600}.wish-message{max-height:5rem;font-size:.8rem;line-height:1.6;overflow-y:auto}.wish-date{color:#a9a9a9;margin-top:10px;font-size:.7rem}.wishes-loading{text-align:center;color:var(--primary-color);padding:35px 20px}.wishes-loading i{margin-bottom:12px;font-size:1.8rem;display:inline-block}.wishes-loading p{margin:0;font-size:.9rem;font-style:italic}.wishes-empty{text-align:center;color:var(--primary-color);background:#ffffff0d;border:1px dashed #d4af3759;border-radius:12px;padding:35px 20px}.wishes-empty i{color:var(--primary-color);margin-bottom:12px;font-size:2.2rem;display:block}.wishes-empty p{margin:0 0 6px;font-size:.95rem}.wishes-empty .empty-sub{color:#a9a9a9;margin:0;font-size:.8rem;font-style:italic}.footer{background:var(--background-dark);color:var(--text-light);text-align:center;padding:40px 0}.footer .container p:first-of-type{color:var(--primary-color);font-family:Dancing Script,cursive;animation:3s ease-in-out infinite alternate glowMove}@keyframes glowMove{0%{text-shadow:5px 0 10px #ffd700b3}50%{text-shadow:-5px 0 10px #ffd700b3}to{text-shadow:5px 0 10px #ffd700b3}}.couple-names-footer{color:var(--primary-color);margin:15px 0;font-family:Dancing Script,cursive;font-size:2rem}.footer-date{color:var(--primary-color);font-weight:500}.footer .container p:last-of-type{font-size:.8rem}.copyright{border-top:var(--primary-color) 1px ridge;text-align:center;color:var(--text-light);background-color:var(--background-dark);padding:15px 0;font-family:Poppins,sans-serif;font-size:14px}.copyright a{color:var(--primary-color,#007bff);text-decoration:none}.heart{transform-origin:50%;color:#fff;animation:1.5s ease-in-out infinite heartbeat;display:inline-block}.floating-hearts{pointer-events:none;z-index:0;width:100%;height:100%;position:absolute;top:0;left:0}.floating-hearts i{color:var(--primary-color);opacity:.6;animation:6s ease-in-out infinite float;position:absolute}.heart-1{font-size:1.5rem;animation-delay:0s;top:20%;left:10%}.heart-2{font-size:1rem;animation-delay:1s;top:60%;left:85%}.heart-3{font-size:1.2rem;animation-delay:2s;top:80%;left:20%}.heart-4{font-size:.8rem;animation-delay:3s;top:30%;left:80%}.heart-5{font-size:1.3rem;animation-delay:4s;top:70%;left:5%}@keyframes float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-20px)rotate(10deg)}}.audio-player{z-index:1000;opacity:0;transition:opacity 1s;display:none;position:fixed;top:20px;right:20px}.audio-player.show{opacity:1;display:block}#audioToggle{background:var(--gradient-primary);width:50px;height:50px;color:var(--text-dark);cursor:pointer;border:none;border-radius:50%;font-size:1.2rem;transition:all .3s;box-shadow:0 5px 15px #d4af374d}#audioToggle:hover{transform:translateY(-2px);box-shadow:0 8px 25px #d4af3766}#audioToggle.playing{animation:2s infinite pulse}@keyframes pulse{0%{box-shadow:0 0 #d4af37b3}70%{box-shadow:0 0 0 10px #d4af3700}to{box-shadow:0 0 #d4af3700}}.navbar{backdrop-filter:blur(10px);z-index:1000;background:#1a1a1ae6;border-radius:50px;padding:12px;transition:transform .3s;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 5px 25px #0003}.navbar.hidden{transform:translateY(100%)}.navbar ul{gap:20px;list-style:none;display:flex}.navbar a{color:var(--text-light);border-radius:50%;justify-content:center;align-items:center;padding:12px;text-decoration:none;transition:all .3s;display:flex}.navbar a:hover,.navbar a.active{background:var(--primary-color);color:var(--text-dark);transform:translateY(-2px)}.countdown-container{text-align:center;max-width:600px;margin:0 auto}.countdown-container h3,.countdown-container h4{color:var(--primary-color);margin-bottom:30px;font-family:Dancing Script,cursive;font-size:2rem}.countdown{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.countdown-item{backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #d4af3733;border-radius:15px;padding:20px}.countdown-item span{color:var(--primary-color);font-size:2rem;font-weight:600;display:block}.countdown-item label{color:var(--text-light);font-size:.9rem}.modal{z-index:9999;background-color:#000000e6;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal-content{text-align:center;width:90%;max-width:800px;margin:auto;padding:20px;position:relative;top:50%;transform:translateY(-50%)}.modal-content img{border-radius:10px;max-width:100%;max-height:80vh}.close{color:var(--text-light);cursor:pointer;font-size:40px;font-weight:700;position:absolute;top:15px;right:35px}.modal-nav{margin-top:20px}.prev-btn,.next-btn{background:var(--primary-color);color:var(--text-dark);cursor:pointer;border:none;border-radius:25px;margin:0 10px;padding:10px 20px;transition:all .3s}.prev-btn:hover,.next-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #d4af374d}@media (width<=1024px){.loading-screen{opacity:.95;height:100vh;transition:opacity 1s;overflow:hidden}.loading-spinner{width:100px;height:100px}.loading-content p{font-size:2rem}.wedding-title{font-size:4rem}.bride-name,.groom-name{font-size:2rem}.couple-container{grid-template-columns:1fr;gap:30px}.couple-divider{order:2}.groom-info{order:3}.events-container{grid-template-columns:1fr}.countdown{grid-template-columns:repeat(2,1fr);gap:15px}}@media (width<=768px){html{font-size:18px}.container{padding:0 15px}.loading-spinner{width:50px;height:50px}.loading-content p{font-size:1rem}.cover-section{height:100vh;overflow:hidden auto}.cover-content{align-content:center;width:auto;height:100vh;position:relative}#audioToggle{width:1.7rem;height:1.7rem;font-size:.7rem}.ornament-top{margin:0;padding:0}.ornament-bottom{margin:0;padding:20px 0}.wedding-title{font-size:2.4rem}.combined-names .bride-name,.combined-names .groom-name,.combined-names .ampersand{font-size:1.8rem}.wedding-date{font-size:1rem}.open-invitation-btn{padding:9px 17px;font-size:.9rem}.couple-container{grid-template-columns:1fr;gap:30px}.couple-divider{order:2}.groom-info{order:3}.events-container{grid-template-columns:1fr}.countdown{grid-template-columns:repeat(2,1fr);gap:15px}.rsvp-container{grid-template-columns:1fr}.rsvp-footer{text-align:center;margin:0;padding:1rem}.navbar{z-index:1000;padding:12px;transition:transform .3s;position:fixed;bottom:10px}.navbar.hidden{transform:translateY(100%)}.navbar ul{gap:15px}.navbar a{padding:12px}.section-title{font-size:2.5rem}.profile-photo{width:200px;height:200px}}@media (width<=480px){html{font-size:18px}.container{padding:0 15px}.loading-screen{opacity:.95;height:100vh;transition:opacity 1s;overflow:hidden}.loading-spinner{width:50px;height:50px}.loading-content p{font-size:1rem}section .section-title{font-size:2.5rem}.cover-section{height:100vh;overflow:hidden auto}.cover-content{align-content:center;width:auto;height:100vh;position:relative}#audioToggle{width:1rem;height:1rem;font-size:.5rem}.ornament-top{margin:0;padding:0}.ornament-bottom{max-width:20rem;margin:0;padding:0}.wedding-title{font-size:1.7rem}.couple-photo{width:10rem;height:10rem}.combined-names .bride-name,.combined-names .groom-name,.combined-names .ampersand{font-size:1.7rem}.wedding-date{font-size:.8rem}.guest-name p{font-size:.9rem}.guest-name h3{font-size:1.7rem}.open-invitation-btn{padding:7px 14px;font-size:.8rem}.section.home-section{box-sizing:border-box;justify-content:center;align-items:center;padding:0}.verse p,.verse .verse-ref,.invitation-text{font-size:.7rem}.section.couple-section{font-size:1rem}.countdown-item span{font-size:1.5rem}.gallery-grid{grid-template-columns:repeat(2,1fr);gap:15px}.event-card{padding:30px 20px}.bride-info .profile-photo,.groom-info .profile-photo{width:180px;height:180px;margin:auto}.bride-info p,.groom-info p{font-size:.8rem;font-style:normal}.bride-info .ortu,.groom-info .ortu{font-size:.8rem;font-style:italic}.event-details p{font-size:.7rem}.countdown-container h3{font-size:1.7rem}.countdown .countdown-item span{font-size:1.3rem}.countdown .countdown-item label{font-size:.7rem}.rsvp-section .container{box-sizing:border-box;max-width:100%;padding:0 15px}.rsvp-container{box-sizing:border-box;flex-direction:column;gap:20px;width:100%;padding:0 15px;display:flex}.section.rsvp-section{padding-bottom:1rem}.section.rsvp-section .section-title{font-size:2rem}.rsvp-form,.wishes-container{border-radius:10px;padding:20px;font-size:.9rem}.rsvp-sction .submit-btn{padding:12px;font-size:1rem}.rsvp-sction .wishes-list{max-height:300px}.rsvp-form .submit-btn,.form-group input,.form-group select,.form-group textarea,.form-group label{font-size:.8rem}.rsvp-footer{text-align:center;margin:0;padding:1rem 0 0;font-size:.8rem}.notification{white-space:nowrap;font-size:.8rem!important}#gift{padding-bottom:1.5rem}.gift-section .gift-container p:not(ul p),.gift-section .gift-container ul p{font-size:.8rem}.digital-wallet p{flex-direction:column;align-items:flex-start}.digital-wallet button{margin-top:5px}}
