body {
    font-family: 'Inter', sans-serif;
    scroll-behavior: smooth;
}
.font-serif { font-family: 'Playfair Display', serif; }
.glass { background: rgba(255,255,255,0.9); backdrop-filter: blur(10px); }
.gradient-bg { background: linear-gradient(135deg,#1e3a8a 0%,#3b82f6 100%); }

/* Swiper */
.swiper { width:100%; padding-top:40px; padding-bottom:60px; }
.swiper-slide {
    background-position:center;
    background-size:cover;
    width:280px;
    height:380px;
    border-radius:20px;
    box-shadow:0 15px 35px rgba(0,0,0,0.1);
}
@media (min-width:768px){
    .swiper-slide{ width:320px; height:450px; }
}
.swiper-slide img,.swiper-slide video{
    width:100%; height:100%; object-fit:cover; border-radius:20px;
}
.swiper-pagination-bullet-active{ background:#1e3a8a!important; }

/* Spinner */
.spinner{
    border:3px solid rgba(255,255,255,0.3);
    border-radius:50%;
    border-top:3px solid #fff;
    width:20px; height:20px;
    animation:spin 1s linear infinite;
    display:inline-block; margin-right:10px;
}
@keyframes spin{
    0%{transform:rotate(0)} 100%{transform:rotate(360deg)}
}

#modalBerhasil{
    display:none; position:fixed; z-index:100; inset:0;
    background:rgba(0,0,0,0.75);
    align-items:center; justify-content:center;
    backdrop-filter:blur(4px);
}

.float-wa{
    position:fixed; width:60px; height:60px; bottom:40px; right:40px;
    background:#25d366; color:#fff; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:30px; box-shadow:2px 2px 10px rgba(0,0,0,.2);
    z-index:100; transition:.3s;
}
.float-wa:hover{ transform:scale(1.1); background:#128c7e; }

/* --- Video Landing Overlay --- */
#videoOverlay {
    transition: opacity 0.8s ease, visibility 0.8s;
}
.overlay-hidden {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body.modal-open {
    overflow: hidden; /* Mengunci scroll saat video muncul */
}