/* --- 1. GLOBAL RESET (WAJIB ADA) --- */
* {
    box-sizing: border-box; /* Memastikan padding tidak menambah lebar elemen */
}

html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important; /* Potong paksa elemen yang bandel */
    margin: 0;
    padding: 0;
    position: relative;
}

body {
    font-family: Raleway, sans-serif;
    background: url('../img/latarbelakang.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    --bs-body-bg: transparent !important;
}

/* --- 2. PERBAIKAN NAVBAR AGAR PRESISI --- */
.navbar-glass {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    width: 100% !important;
    left: 0;
    top: 0;
    /* Pastikan tidak ada margin kiri/kanan di navbar itu sendiri */
    margin: 0 !important; 
}

/* --- 3. PERBAIKAN KHUSUS MOBILE (KUNCI UTAMA) --- */
@media (max-width: 991px) {
    
    /* A. Reset Container: Agar paddingnya konsisten dan lurus */
    .container, .container-fluid {
        padding-left: 20px !important;
        padding-right: 20px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important; /* Double protection untuk container */
    }

    /* B. MENJINAKKAN ROW BOOTSTRAP (Penyebab utama margin berlebih) */
    /* Row bootstrap punya margin -12px kiri kanan. Di HP ini sering bikin error. 
       Kita nol-kan margin row, tapi tetap izinkan padding di kolomnya. */
    .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important; /* Paksa row selebar container saja */
    }

    /* C. Pastikan Kolom di dalam row tetap punya jarak dari pinggir */
    .col, .col-12, .col-lg-5, .col-lg-7, .col-lg-4, .col-md-6 {
        padding-left: 0 !important; /* Reset padding kolom agar teks mepet container yg sudah dipadding */
        padding-right: 0 !important;
    }

    /* D. Navbar Toggler (Burger Bar) */
    /* Kita paksa margin kanannya 0 agar lurus dengan garis container */
    .navbar-toggler {
        margin-right: 0 !important; 
        border: none !important;
        padding-right: 0 !important;
    }

    /* E. Jarak Header */
    .main-content {
        margin-top: 5rem !important;
    }

    /* F. Gambar Hero */
    .hero-animate {
        max-width: 90%; 
        margin: 0 auto;
    }
}

/* --- 4. STYLE LAINNYA (BAWAAN ANDA) --- */
.bg-nav { background-color: #031a56; }
.mt--2 { margin-top: -0.5rem !important; }
.hr-dotted { border-top: 1px dotted; opacity: .25; }

.navbar-light .navbar-nav .nav-link {
    color: #031a56 !important; font-size: 16px; font-weight: 600; transition: all 0.4s;
}
.navbar-light .navbar-nav .nav-link:hover { color: #ff00cc !important; }

.feature-icon-1 {
    display: inline-flex; align-items: center; justify-content: center;
    width: 5rem; height: 5rem; font-size: 3rem; color: #fff; border-radius: 100%;
}

.btn-social-media {
    color: #31316a; background-color: ##ffffff; border-color: ##ffffff;
    width: 2rem; height: 2rem; padding: 1.2rem;
    text-align: center; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 100%;
}
.btn-social-media:hover {
    color: #ff00cc; background-color: #0d6efd; border-color: #0d6efd;
}

/* Footer */
.footer .copyright a { color: #050560; text-decoration: none; }
.footer .copyright a:hover { color: #ff00cc; }
.footer .link a { color: #212529; text-decoration: none; }
.footer .link a:hover { color: #ff00cc; }

/* Animasi & Efek */
.card-hover { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.card-hover:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1) !important; }

.hero-animate { animation: float 6s ease-in-out infinite; }
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0px); }
}

.btn-hover-scale { transition: transform 0.2s; }
.btn-hover-scale:hover { transform: scale(1.05); }

.gallery-item { overflow: hidden; position: relative; }
.gallery-item img { transition: transform 0.5s ease; }
.gallery-item:hover img { transform: scale(1.05); }