/* Import Font & Variabel Warna */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap');

:root {
    --bs-primary: #0D47A1;
    --accent-color: #FFC107;
    --bs-font-sans-serif: 'Poppins', sans-serif;
}

/* Global */
body {
    font-family: var(--bs-font-sans-serif);
    /* PENTING: Beri jarak agar konten tidak tertutup navbar */
    padding-top: 75px; 
}

/* =================================== */
/* === STYLING NAVBAR FINAL & PASTI === */
/* =================================== */

.navbar {
    /* Gunakan warna biru utama dengan sedikit transparan (95% solid) */
    background-color: rgba(13, 71, 161, 0.95) !important; 
    /* Efek blur modern di belakang navbar */
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px); /* Untuk support browser Safari */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

.navbar-brand {
    font-weight: 700;
}

.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link:visited {
    color: rgba(255, 255, 255, 0.85);
    padding: 0.5rem 1rem;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: #FFFFFF;
}

/* Style untuk menu yang sedang aktif */
.navbar-dark .navbar-nav .nav-link.active {
    color: var(--accent-color);
    border-bottom-color: var(--accent-color);
}

/* =================================== */
/* === STYLING KONTEN LAINNYA === */
/* =================================== */

.hero-image {
    height: 85vh;
    background-size: cover;
    background-position: center;
}
.carousel-caption {
    bottom: 15%;
}
.caption-bg {
    background-color: rgba(0, 0, 0, 0.6);
    padding: 1.5rem;
    border-radius: 0.5rem;
}
.carousel-caption h5 {
    font-size: 2.2rem;
}
.carousel-caption p {
    font-size: 1.0rem;
}

.card {
    border: none;
    transition: all 0.3s ease;
}
.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

footer a:hover {
    color: var(--accent-color) !important;
}

.prose {
    line-height: 1.7;
}
.prose ul, .prose ol {
    padding-left: 1.5rem;
}

/* ... (kode CSS Anda yang lain) ... */

/* Penyesuaian untuk layar mobile (di bawah 768px) */
@media (max-width: 767px) {
    .carousel-caption {
        /* Posisikan sedikit lebih tinggi di mobile */
        bottom: 10%;
    }
    .caption-bg {
        padding: 1rem; /* Kurangi padding di mobile */
    }
    .carousel-caption h5 {
        font-size: 1.5rem; /* Perkecil font judul */
    }
    .carousel-caption p {
        font-size: 0.9rem; /* Perkecil font deskripsi */
    }
    .carousel-caption .btn {
        padding: 0.5rem 1rem; /* Perkecil ukuran tombol */
        font-size: 0.9rem;
    }
}