/* ==============================
 TABLET & SMALL LAPTOPS (≤1024px)
============================== */
@media (max-width: 1024px) {

    /* Product Cards */
    .product-card {
        flex: 0 0 calc(100% / 2.5);
    }

    .carousel-btn {
        width: 45px;
        height: 45px;
    }

    .product-card img {
        height: 180px;
    }

    /* Why Section */
    .bg-text {
        font-size: 70px;
        top: 10px;
    }

    .main-title {
        margin-top: -20px;
    }

    .label {
        font-size: 36px;
    }

    .why-block {
        grid-template-columns: 180px auto;
        gap: 60px;
    }
}



/* ==============================
 TABLET RESPONSIVE (≤768px)
============================== */
@media (max-width: 768px) {
    .logo {
        height: 55px;
    }
    /* Navbar */
    .custom-navbar {
        padding: 12px 20px;
    }

    .enquiry-btn {
        display: block;
        text-align: center;
        margin-left: 0 !important;
    }

    /* Hero */
    .hero-box {
        padding: 25px 20px;
    }

    .btn-group {
        flex-direction: column;
        gap: 10px;
    }

    /* Testimonial */
    .testimonial-card {
        flex: 0 0 100%;
    }

    .sig-right {
        border-left: none;
        padding-left: 10px;
    }

    /* Footer */
    footer {
        text-align: center;
    }

    .footer-list a:hover {
        padding-left: 0;
    }

    /* Stats */
    .stat-card {
        border-right: none;
    }

    .stat-text {
        font-size: 18px;
    }

    /* Arrow Buttons */
    .arrow-link {
        font-size: 17px;
    }

        .arrow-link span {
            width: 26px;
            height: 26px;
        }

    /* CTA */
    .cta-section .btn {
        padding: 8px 18px;
        border-radius: 11px 11px 11px 0;
    }

    /* Product Section */
    .product-card {
        flex: 0 0 calc(100% / 2);
    }

    .product-track {
        gap: 18px;
    }

    .carousel-btn {
        top: unset;
        bottom: -20px;
        transform: none;
    }

    .prev-btn {
        left: 35%;
    }

    .next-btn {
        right: 35%;
    }

    /* Why Section */
    .bg-text {
        font-size: 55px;
        top: 5px;
    }

    .main-title {
        margin-top: -15px;
    }

    .tagline {
        font-size: 16px;
    }

    .why-block {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .label {
        font-size: 28px;
        min-width: auto;
        text-align: left;
    }

    .why-block p {
        font-size: 16px;
        max-width: 100%;
    }

    .why-block::before {
        width: 40px;
        bottom: -10px;
    }
    .step-number {
        font-size: 60px;
        margin-bottom: 15px;
    }

    .process-step {
        text-align: center;
    }

        .process-step .col-md-10 {
            margin-top: 15px;
        }
    .product-image {
        height: auto;
    }
    .service-card-img img {
        height: auto;        
    }
    .product-info {
        padding: 15px;
    }
    .enquiry-card,
    .enquiry-info {
        padding: 20px;
    }
   
}
/* ==============================
 SMALL MOBILE (≤600px)
============================== */
@media (max-width: 600px) {

    /* Product */
    .product-card {
        flex: 0 0 100%;
    }

        .product-card img {
            height: 150px;
        }

        .product-card h4 {
            font-size: 1rem;
        }

    .prev-btn {
        left: 30%;
    }

    .next-btn {
        right: 30%;
    }
    .gallery-img {
        height: 230px;
    }
}


/* ==============================
 EXTRA SMALL (≤480px)
============================== */
@media (max-width: 480px) {

    .bg-text {
        font-size: 42px;
    }

    .label {
        font-size: 24px;
        letter-spacing: 1px;
    }

    .tagline {
        font-size: 14px;
    }
}

/* project */
@media (min-width: 992px) {
    .project-card {
        flex: 0 0 33.333%; 
        max-width: 33.333%;
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    .project-card {
        flex: 0 0 50%; 
        max-width: 50%;
    }

    .project-prev {
        left: 10px !important;
    }

    .project-next {
        right: 10px !important;
    }
}

@media (max-width: 767px) {
    .project-card {
        flex: 0 0 100%; 
        max-width: 100%;
        height: 300px; 
    }

}
@media (max-width: 992px) {
    .testimonial-card {
        flex: 0 0 calc(50% - 20px);
    }
}

@media (max-width: 576px) {
    .testimonial-card {
        flex: 0 0 100%;
    }
}
@media (max-width: 768px) {

    .lightbox-nav {
        top: auto;
        bottom: 30%;
        transform: none;
        font-size: 18px;
        padding: 8px 8px;
        background: rgba(0, 0, 0, 0.75);
    }

        .lightbox-nav.prev {
            left: 15px;
        }

        .lightbox-nav.next {
            right: 15px;
        }
}