/* ============================================================
   FIX FOOTER MENIMPA KONTEN
   Tambahkan di bagian PALING BAWAH frontend.css
   ============================================================ */

/* 1. Sticky footer — body flex column */
html {
    height: 100%;
}
body {
    min-height: 100vh;
    height: auto !important;
    display: flex;
    flex-direction: column;
}
body > header {
    flex-shrink: 0;
}
body > footer {
    flex-shrink: 0;
    position: static !important;
}

/* 2. Main wrapper tumbuh mengisi ruang sisa */
.main-wrapper {
    flex: 1 0 auto;
    padding-top: 80px;
    /* hapus min-height lama jika ada */
    min-height: unset !important;
    height: auto !important;
}

/* 3. FIX UTAMA: .hero-image dan cover pakai height:100%
   tapi parent tidak punya fixed height → tinggi jadi 0.
   Ganti dengan min-height berbasis viewport. */
.main-wrapper .hero-image,
#cover-kesaksian,
#cover-renungan {
    height: auto !important;
    min-height: 80vh; /* tinggi minimum layar, bukan 100% parent */
    position: relative;
}

/* 4. Navbar: ganti position:absolute → fixed
   agar konten tidak tertimpa navbar saat scroll */
.my-navbar {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    padding: 20px 30px;
    background: transparent !important;
    transition: background 0.3s ease;
}