/* === ANASAYFA RESPONSIVE STİLLERİ === */

/* Tablet Boyutu (992px ve altı) */
@media (max-width: 992px) {
    .hero-bg h1 {
        font-size: 2.5rem; /* 40px */
    }
    .hero-bg p {
        font-size: 1.125rem; /* 18px */
    }

    .regions-grid {
        grid-template-columns: repeat(3, 1fr); /* 6'dan 3'e düşür */
    }

    .about-intro__container {
        grid-template-columns: 1fr; /* Tek sütuna düşür */
        gap: 32px;
    }

    .about-intro__image-wrapper {
        order: -1; /* Resmi yukarı taşı */
    }

    .stats-box {
        position: static; /* Sabit pozisyonu kaldır */
        margin-top: 24px;
        width: 100%;
        right: auto;
        bottom: auto;
    }
}

/* Mobil Boyutu (768px ve altı) */
@media (max-width: 768px) {
    .hero-bg {
        padding-top: 6rem; /* 96px */
        padding-bottom: 6rem; /* 96px */
    }
    .hero-bg h1 {
        font-size: 2rem; /* 32px */
    }
    .hero-bg p {
        font-size: 1rem; /* 16px */
    }

    /* Arama formu zaten Tailwind ile responsive, ek kural gerekirse buraya eklenebilir */

    .regions-grid {
        grid-template-columns: repeat(2, 1fr); /* 3'ten 2'ye düşür */
    }

    .stats-box {
        grid-template-columns: 1fr 1fr; /* 2x2 grid yap */
    }

    .mission-vision-grid {
        grid-template-columns: 1fr; /* Tek sütuna düşür */
    }

    .about-intro__buttons {
        flex-direction: column; /* Butonları alt alta diz */
    }
    .about-intro__buttons .btn {
        width: 100%;
        text-align: center;
    }
}

/* Daha Küçük Mobil Cihazlar (480px ve altı) */
@media (max-width: 480px) {
    .regions-grid {
        grid-template-columns: 1fr; /* Tek sütun yap */
    }
}