/* --- PENGATURAN DASAR & RESET --- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* Praktik terbaik untuk layout yang konsisten */
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

body {
    background-color: #000000;
    background-image: radial-gradient(#ffffff3b 0.5px, transparent 1px);
    background-size: 20px 20px;
    color: #ffffff; /* Warna teks default */
}

a {
    color: inherit; /* Mewarisi warna dari elemen induk */
    text-decoration: none;
}

/* --- HEADER --- */
.header-container {
    height: 175px;
    width: 100%;
    background-color: black;
    display: flex; /* Menggunakan flexbox untuk penataan */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px; /* Jarak antara logo dan tombol */
}

.logo-container {
    /* Tidak perlu style khusus jika sudah diatur oleh .header-container */
}

.button-group {
    display: flex;
    justify-content: center;
    gap: 2rem;
}

/* --- GAYA TOMBOL UMUM --- */
.btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    padding: 0 15px;
    border: 1px solid white;
    border-radius: 8px;
    font-weight: bold;
    color: white;
    background-color: rgb(130, 32, 175);
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s; /* Transisi halus */
}

.btn:hover {
    background-color: orange;
    color: black;
}

/* --- MAIN CONTENT --- */
.main-section {
    padding: 20px;
    max-width: 900px; /* Batas lebar agar tidak terlalu lebar di layar besar */
    margin: 0 auto; /* Tengah secara horizontal */
    text-align: center;
}

.main-picture {
    margin-bottom: 20px;
}

.main-picture img {
    max-width: 100%;
    height: auto; /* Membuat gambar responsif */
    border-radius: 8px;
}

.judul {
    font-size: 1.5rem; /* Ukuran font yang lebih baik */
    margin-bottom: 10px;
}

.description {
    margin-bottom: 20px;
    line-height: 1.6; /* Jarak antar baris agar mudah dibaca */
}

.tombol-group {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.link-terupdate {
    display: inline-block;
    padding: 10px 20px;
    border: 1px solid rgb(201, 201, 201);
    border-radius: 5px;
    background-color: orange;
    color: black;
    font-weight: bold;
    transition: background-color 0.3s, color 0.3s;
}

.link-terupdate:hover {
    background-color: rgb(15, 71, 175);
    color: #ffffff;
}


/* --- FOOTER --- */
footer {
    width: 100%;
    height: 60px;
    background-color: black;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 40px; /* Beri jarak dari konten utama */
}

.copyright {
    color: rgb(255, 196, 0);
}