/* --- AROS KIDS COMPREHENSIVE RESPONSIVENESS (300px - 3000px) --- */

/* ==========================================================================
   1. MOBILE SMALL (300px - 480px)
   ========================================================================== */
@media (max-width: 480px) {
    /* General Spacing */
    .section-space, 
    .ukg-v8-section, 
    .daycare-v8-section, 
    .nursery-v8-section {
        padding: 50px 0 !important;
    }

    /* Typography */
    .v8-main-title {
        font-size: 28px !important;
        line-height: 1.2 !important;
    }
    .v8-pre-title {
        font-size: 14px !important;
        letter-spacing: 2px !important;
    }
    .v8-lead-text {
        font-size: 16px !important;
    }

    /* Collage Boxes */
    .v8-collage-box {
        margin-bottom: 30px;
    }
    .v8-image-main img {
        border-radius: 30px 50px !important;
    }
    .v8-badge-float {
        padding: 10px 15px !important;
        font-size: 14px !important;
        bottom: 10px !important;
        right: 10px !important;
    }

    /* Focus Cards */
    .v8-focus-card {
        padding: 25px 20px !important;
    }
    .v8-fc-icon {
        width: 60px !important;
        height: 60px !important;
        font-size: 24px !important;
    }
    .v8-fc-title {
        font-size: 18px !important;
    }

    /* Team/Facility Cards */
    .team-card-three__hover {
        padding: 15px !important;
    }
    .team-card-three__title {
        font-size: 18px !important;
    }
    .team-card-three__rm {
        width: 50px !important;
        height: 50px !important;
        font-size: 20px !important;
    }
}

/* ==========================================================================
   2. TABLET PORTRAIT / PHABLET (481px - 767px)
   ========================================================================== */
@media (min-width: 481px) and (max-width: 767px) {
    .v8-main-title {
        font-size: 32px !important;
    }
    .v8-collage-box {
        max-width: 100%;
        margin-bottom: 40px;
    }
}

/* ==========================================================================
   3. TABLET LANDSCAPE (768px - 991px)
   ========================================================================== */
@media (min-width: 768px) and (max-width: 991px) {
    .v8-content-box {
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center;
    }
    .v8-content-box .kidearn-btn {
        margin: 0 auto;
    }
    .v8-collage-box {
        margin-bottom: 50px;
    }
}

/* ==========================================================================
   4. LAPTOP (MACBOOK AIR / STANDARD DESKTOP) (1200px - 1600px)
   ========================================================================== */
@media (min-width: 1200px) and (max-width: 1600px) {
    .container {
        max-width: 1140px;
    }
    .v8-main-title {
        font-size: 42px !important;
    }
}

/* ==========================================================================
   5. LARGE DESKTOP & TVS (1920px - 3000px)
   ========================================================================== */
@media (min-width: 1920px) {
    .container {
        max-width: 1600px !important;
    }
    .v8-main-title {
        font-size: 54px !important;
    }
    .v8-lead-text {
        font-size: 22px !important;
    }
    .v8-fc-text {
        font-size: 18px !important;
    }
    .v8-collage-box {
        transform: scale(1.1);
        margin: 40px 0;
    }
    section {
        padding: 150px 0 !important;
    }
}

/* ==========================================================================
   6. SAMSUNG TVS / 4K SCREENS (2560px+)
   ========================================================================== */
@media (min-width: 2560px) {
    .container {
        max-width: 2200px !important;
    }
    body {
        font-size: 20px;
    }
    .v8-main-title {
        font-size: 72px !important;
    }
    .v8-pre-title {
        font-size: 24px !important;
        letter-spacing: 6px !important;
    }
}

@media (min-width:300px) and (max-width: 900px) {
.v8-mosaic-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr) !important;
    gap: 30px;
    margin-top: 50px;
}
.ukg-f-row {
     display: block !important; 
    align-items: center;
    gap: 80px;
    margin-bottom: 120px;
}
.contact-map {
    position: relative;
    margin-bottom: 0px !important;
}
}