body {
    font-family: 'Inter', sans-serif;
    color: #4A4A4A;
    /* Background gradien merah putih */
    background: linear-gradient(to bottom, #FF0000 0%, #FF0000 50%, #FFFFFF 50%, #FFFFFF 100%);
    background-attachment: fixed; /* Membuat gradien tetap saat scroll */
    position: relative; /* Diperlukan untuk ornamen */
    overflow-x: hidden; /* Mencegah scroll horizontal */
}
.font-display {
    font-family: 'Playfair Display', serif;
}
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
.filter-btn {
    transition: all 0.3s ease;
}
.filter-btn.active {
    background-color: #A67B5B !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}
.chart-container {
    position: relative;
    width: 100%;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    max-height: 400px;
}
/* Ornamen 17 Agustus */
.ornament-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none; /* Agar tidak mengganggu interaksi */
    overflow: hidden; /* Memastikan ornamen tidak keluar dari body */
}
.ornament-flag-people {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 250px; /* Sesuaikan tinggi sesuai kebutuhan */
    background-image: url('https://placehold.co/1200x250/FFFFFF/000000?text=people_holding_flag_silhouette'); /* Placeholder */
    background-size: cover;
    background-position: center bottom;
    opacity: 0.2; /* Sesuaikan opasitas */
    z-index: -1;
}
.ornament-80 {
    position: absolute;
    top: 50px; /* Sesuaikan posisi */
    right: 50px; /* Sesuaikan posisi */
    width: 200px; /* Sesuaikan ukuran */
    height: 200px; /* Sesuaikan ukuran */
    background-image: url('https://placehold.co/200x200/FFFFFF/000000?text=80'); /* Placeholder */
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.1; /* Sesuaikan opasitas */
    z-index: -1;
}

/* Warna teks judul utama */
.text-merah-putih {
    color: #FF0000; /* Merah */
    text-shadow: 
        1px 1px 0 #FFFFFF,    /* Bayangan putih di kanan bawah */
        -1px -1px 0 #FFFFFF,  /* Bayangan putih di kiri atas */
        1px -1px 0 #FFFFFF,   /* Bayangan putih di kanan atas */
        -1px 1px 0 #FFFFFF;   /* Bayangan putih di kiri bawah */
}

/* Responsiveness for ornaments */
@media (max-width: 768px) {
    .ornament-flag-people {
        height: 150px;
        opacity: 0.15;
    }
    .ornament-80 {
        width: 100px;
        height: 100px;
        top: 20px;
        right: 20px;
        opacity: 0.08;
    }
}