/* ======================================== */
/* RESPONSIVE FIXES – Akvo International    */
/* ======================================== */

/* Extra small devices (phones, <576px) */
@media (max-width: 575.98px) {
    /* Header */
    .header-main-one-wrapper {
        flex-wrap: wrap;
    }
    .thumbnail img {
        max-height: 50px;
    }
    .button-area .menu-btn {
        margin-left: 10px !important;
    }

    /* Banner */
    .banner-inner-two-content h1 {
        font-size: 28px !important;
    }
    .banner-inner-two-content .disc {
        font-size: 14px !important;
    }

    /* About section */
    .left-thumbnail-about-area-two img {
        width: 100%;
    }
    .counter-about-area {
        padding: 15px;
    }
    .counter-about-area .title {
        font-size: 24px;
    }

    /* Service cards */
    .single-service-signle-wrapper {
        padding: 20px 15px;
    }

    /* Project gallery */
    .project-style-one .thumbnail img {
        height: 200px;
        object-fit: cover;
    }

    /* Footer */
    .footer-one-single-wized {
        margin-bottom: 30px;
    }
    .map-area-main-footer-two iframe {
        height: 300px;
    }

    /* Solar page specific */
    .solar-category-title {
        font-size: 22px !important;
        padding-left: 15px;
    }
    .product-card .card-img-top {
        height: 140px;
    }
    .final-cta {
        padding: 40px 15px !important;
    }
    .final-cta h2 {
        font-size: 24px !important;
    }
}

/* Small devices (tablets, 576px – 767px) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .banner-inner-two-content h1 {
        font-size: 36px;
    }
    .product-card .card-img-top {
        height: 160px;
    }
}

/* Medium devices (desktops, 768px – 991px) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .banner-inner-two-content h1 {
        font-size: 42px;
    }
    .product-card .card-img-top {
        height: 170px;
    }
}

/* Large devices (desktops, 992px and up) – mostly fine, but ensure no overflow */
@media (min-width: 992px) {
    .container-2 {
        max-width: 1140px;
        margin: 0 auto;
    }
}

/* Fix for very large screens */
@media (min-width: 1600px) {
    .container {
        max-width: 1440px;
    }
}

/* Ensure images don't overflow */
img {
    max-width: 100%;
    height: auto;
}

/* Fix for the solar page hero buttons on all screens */
.hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    margin-top: 30px;
}
.hero-buttons .akvo-btn {
    margin: 0 !important;
}

/* Ensure the sidebar menu works on mobile */
#side-bar {
    transition: transform 0.3s ease;
}
#side-bar.open {
    transform: translateX(0);
}
#anywhere-home.active {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 999;
}