/* 🔹 Container utama pakai Flexbox */
.container {
    display: flex;
    align-items: center;
    justify-content: space-between; /* Gambar ke kanan di desktop */
    gap: 20px; /* Jarak antara teks dan gambar */
}

/* 🔹 Teks agar fleksibel */
.text {
    flex: 1; /* Teks lebih besar dari gambar */
}

/* 🔹 Gambar Responsive */
.responsive-img {
    max-width: 40%; /* Maksimal ukuran gambar di desktop */
    height: auto; /* Menjaga rasio gambar */
    flex-shrink: 0; /* Jangan membesar di luar batas */
    display: block; /* Hindari spasi kosong di bawah gambar */
}

/* 🔹 Pastikan semua gambar di website responsive */
img {
    max-width: 100%;
    height: auto;
}

/* 🔹 Mobile: Gambar pindah ke bawah & lebih kecil */
@media (max-width: 768px) {
    .container {
        flex-direction: column; /* Elemen jadi vertikal */
        text-align: center; /* Teks di tengah */
    }

    .responsive-img {
        max-width: 80%; /* Gambar lebih kecil di mobile */
    }
}
