.masthead {
    position: relative;
    text-align: center;
    display: flex; /* Menjadikan .masthead sebagai flex container */
    justify-content: center; /* Menjaga konten berada di tengah horizontal */
    align-items: center; /* Menjaga konten berada di tengah vertikal */
    height: 100vh; /* Menjamin tinggi header memenuhi layar */
    overflow: hidden; /* Untuk menghindari gambar meluber */
}

.masthead-image {
    width: 100%;
    height: auto;
    max-height: 100vh; /* Atur tinggi gambar agar tidak melebihi tinggi layar */
    object-fit: cover; /* Gambar tetap terpotong agar mengisi area */
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1; /* Agar gambar berada di belakang konten */
}

.masthead .container {
    position: relative;
    z-index: 1; /* Agar konten tetap berada di atas gambar */
    text-align: center; /* Pastikan teks berada di tengah kontainer */
}

.masthead-subheading {
    font-size: 3rem;
    font-weight: bold;
    color: white; /* Warna teks bisa disesuaikan */
    margin-bottom: 20px;
}

.btn {
    margin: 5px;
}
/* Kontainer yang menampung iframe */
.map-container {
    display: flex; /* Menggunakan Flexbox */
    justify-content: center; /* Menyusun iframe secara horizontal di tengah */
    align-items: center; /* Menyusun iframe secara vertikal di tengah */
    width: 100%; /* Membuat kontainer mengambil lebar penuh */
    height: 100vh; /* Membuat kontainer mengisi seluruh tinggi layar */
    background: #eee; /* Warna latar belakang jika diperlukan */
}

/* Styling untuk iframe */
.map-container iframe {
    width: 80%; /* Lebar iframe 80% dari kontainer */
    height: 60%; /* Tinggi iframe 60% dari kontainer */
    border: 0; /* Menghilangkan border iframe */
}
