/* ==========================================================================
   ASTRAMA CUSTOM CSS OVERRIDES
   ========================================================================== */

/* --- 1. HERO AREA & LOGO --- */
/* Menyesuaikan logo Astrama di sebelah kanan */
.astrama-hero-logo {
    width: 100%;
    max-width: 400px;
    height: auto;
    position: relative;
    z-index: 2;
    margin: 0 auto;
    display: block;
    filter: drop-shadow(0px 10px 25px rgba(173, 255, 47, 0.15));
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .astrama-hero-logo { max-width: 320px; }
}

@media (max-width: 767px) {
    /* Menjaga background gelap tetap muncul di HP */
    .it-hero-shape-2 {
        display: block !important; 
        height: 100%;
        object-fit: cover;
    }
    .it-hero-area { background-color: #121212 !important; }
    
    /* Merapikan jarak teks dan logo di HP */
    .it-hero-ptb {
        padding-top: 150px !important;
        padding-bottom: 30px !important; 
    }
    .astrama-hero-logo {
        max-width: 250px;
        margin: 40px auto 0 auto !important; 
    }
    .it-hero-thumb {
        min-height: auto !important; 
        margin-bottom: 50px;
    }
}


/* --- 2. FOOTER TRANSPARAN (GLASSMORPHISM) --- */
/* Ganti .tp-footer-area dengan class footer asli Anda jika berbeda */
.tp-footer-area, footer {
    background-color: rgba(20, 20, 20, 0.5) !important; 
    backdrop-filter: blur(10px); 
    -webkit-backdrop-filter: blur(10px); 
    border-top: 1px solid rgba(255, 255, 255, 0.05); 
}


/* --- 3. BRAND SLIDER INTERAKTIF --- */
/* Kondisi Default: Abu-abu & agak redup */
.creative-brand-item img {
    filter: grayscale(100%);
    opacity: 0.5;
    transition: all 0.4s ease-in-out;
    cursor: pointer;
}

/* Kondisi Hover (Disorot Mouse) */
.creative-brand-item img:hover {
    filter: none;
    opacity: 1;
    transform: scale(1.05);
}

/* Kondisi Aktif (Setelah Diklik) */
.creative-brand-item img.warna-asli {
    filter: none;
    opacity: 1;
    transform: scale(1.05); 
}

/* 1. Kondisi Default: Paksa SEMUA logo jadi abu-abu dan redup */
.creative-brand-item img {
    filter: grayscale(100%) !important;
    opacity: 0.5 !important;
    transition: all 0.4s ease-in-out !important;
    cursor: pointer !important;
}

/* 2. Kondisi Hover & Diklik: Paksa warna asli keluar */
.creative-brand-item img:hover,
.creative-brand-item img.warna-asli {
    filter: grayscale(0%) !important;
    opacity: 1 !important;
    transform: scale(1.05) !important;
}

/* =========================================================
   ASTRAMA: BUSINESS UNIT CARDS (RATA KIRI)
   ========================================================= */

/* 1. Memaksa seluruh teks di dalam kartu menjadi rata kiri */
.it-feature-item {
    text-align: center !important;
}

/* 2. Memastikan paragraf deskripsinya patuh menjadi rata kiri */
.it-feature-content p {
    text-align: left !important;
}

/* 3. Menggeser deretan label kecil (seperti Batch, FEFO, B2B) ke sebelah kiri */
/* Elemen ini menggunakan Flexbox dari bawaan template */
.it-feature-category {
    justify-content: flex-start !important;
    text-align: left !important;
}

/* 4. (Opsional) Menggeser Ikon gambar di atas teks ke sebelah kiri juga */
.it-feature-icon {
    margin-left: 0 !important;
    margin-right: auto !important;
    display: inline-block !important; /* Mencegah ikon mengambil lebar penuh */
}