/* Mobile-only performance and UX fixes. Desktop layout unchanged. */

@media (max-width: 930px) {
    /* Full-bleed heroes extend under the transparent navbar — no white padding gap */
    .body-content.public-content.body-content--full-bleed {
        padding-top: 0 !important;
    }

    /* Breadcrumb overlays hero instead of pushing it down (About, Services, etc.) */
    .body-content.public-content.body-content--full-bleed > .container:first-child {
        position: absolute;
        top: 230px;
        left: 0;
        right: 0;
        z-index: 5;
        width: 100%;
        max-width: 100%;
        pointer-events: none;
    }

    .body-content.public-content.body-content--full-bleed > .container:first-child .breadcrumb-container {
        pointer-events: auto;
    }

    .body-content.public-content.body-content--full-bleed > .top_IMG,
    .body-content.public-content.body-content--full-bleed > #fullPageCarousel {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}

@media (max-width: 767.98px) {
    /* Home hero: one viewport high — children use % not stacked 100vh */
    #fullPageCarousel {
        height: 100svh !important;
        min-height: 100svh !important;
        max-height: 100svh !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
        overflow: hidden !important;
    }

    #fullPageCarousel .carousel,
    #fullPageCarousel .carousel-inner,
    #fullPageCarousel .item,
    #fullPageCarousel .Carousel-Relative-Container {
        height: 100% !important;
        min-height: 100% !important;
        max-height: 100% !important;
    }

    #fullPageCarousel .item img {
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: none !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    /* No white band between hero and first home section */
    .body-content.public-content #fullPageCarousel + .home-section,
    .body-content.public-content #fullPageCarousel + .why-section,
    .body-content.public-content #fullPageCarousel + section {
        margin-top: 0 !important;
        padding-top: 0 !important;
        border-top: none !important;
    }

    .body-content.public-content #fullPageCarousel + .why-section .home-page-band,
    .body-content.public-content #fullPageCarousel + .home-section .home-page-band {
        padding-top: 16px !important;
    }

    /* About / other full-bleed page heroes */
    .body-content.public-content.body-content--full-bleed > .top_IMG {
        height: min(68vh, 480px) !important;
        min-height: 260px !important;
        max-height: 480px !important;
        margin-bottom: 0 !important;
    }

    .body-content.public-content.body-content--full-bleed .top_IMG + *,
    .body-content.public-content.body-content--full-bleed .svc-hero + *,
    .body-content.public-content.body-content--full-bleed .about-hero + *,
    .body-content.public-content.body-content--full-bleed .projects-showcase__hero + .projects-showcase__grid-wrap {
        margin-top: 0 !important;
    }

    .body-content.public-content.body-content--full-bleed .top_IMG + #about-section {
        padding-top: 20px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .projects-showcase__hero + .projects-showcase__grid-wrap {
        padding-top: 8px !important;
    }

    #services-section .svc-hero + .svc-intro,
    #services-section .svc-hero + .svc-list {
        margin-top: 0 !important;
        padding-top: 12px !important;
    }

    #about-section .about-company {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .projects-page .top_IMG + .projects-showcase {
        padding-top: 8px !important;
        margin-top: 0 !important;
    }
}

/* Adaptive carousels: grid on desktop, slider on mobile */
@media (min-width: 768px) {
    .home-card-carousel--adaptive .home-card-carousel__btn {
        display: none !important;
    }

    .home-card-carousel--adaptive .home-card-carousel__viewport {
        overflow: visible !important;
    }

    .home-card-carousel--adaptive .home-card-carousel__track {
        display: grid !important;
        transform: none !important;
        width: 100% !important;
        gap: 12px !important;
    }

    .home-card-carousel--adaptive[data-visible="4"] .home-card-carousel__track {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .home-card-carousel--adaptive .home-card-carousel__slide {
        flex: none !important;
        width: auto !important;
        max-width: none !important;
    }

    #homeServicesCarousel.home-card-carousel--adaptive .home-card-carousel__track {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
        width: 100% !important;
        transform: none !important;
    }

    #homeServicesCarousel.home-card-carousel--adaptive .home-card-carousel__slide {
        flex: 1 1 0 !important;
        max-width: 25% !important;
        width: auto !important;
    }

    #homeServicesCarousel .service-item[class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
    }
}

@media (max-width: 767.98px) {
    /* Carousel tracks must stay flex — grid/stack rules from page CSS are overridden here */
    .home-card-carousel--adaptive .home-card-carousel__track.services-items-row,
    .home-card-carousel--adaptive .home-card-carousel__track.why-section__grid {
        display: flex !important;
        flex-wrap: nowrap !important;
        grid-template-columns: none !important;
        gap: 8px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .home-card-carousel--adaptive .home-card-carousel__slide {
        flex-shrink: 0 !important;
    }

    /* Why Choose Us: full-width centered card + symmetric arrows */
    .why-section .home-page-band {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #homeWhyCarousel.home-card-carousel {
        position: relative;
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding-left: 36px;
        padding-right: 36px;
        box-sizing: border-box;
    }

    #homeWhyCarousel .home-card-carousel__viewport {
        width: 100%;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden;
    }

    #homeWhyCarousel .home-card-carousel__slide {
        display: flex !important;
        align-items: stretch !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    #homeWhyCarousel .why-pillar {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        box-sizing: border-box;
    }

    #homeWhyCarousel .home-card-carousel__btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 3;
        width: 32px;
        height: 32px;
        line-height: 32px;
    }

    #homeWhyCarousel .home-card-carousel__btn--prev {
        left: 0;
    }

    #homeWhyCarousel .home-card-carousel__btn--next {
        right: 0;
    }

    #homeServicesCarousel .home-card-carousel__slide .service-item,
    #homeServicesCarousel .service-item[class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 auto !important;
        float: none !important;
        margin-bottom: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Services carousel: slide controls + room for arrows */
    #homeServicesCarousel.home-card-carousel {
        position: relative;
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding-left: 36px;
        padding-right: 36px;
        box-sizing: border-box;
    }

    #homeServicesCarousel .home-card-carousel__viewport {
        width: 100%;
        padding: 0 !important;
        margin: 0 !important;
    }

    #homeServicesCarousel .home-card-carousel__btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 3;
        width: 32px;
        height: 32px;
        line-height: 32px;
    }

    #homeServicesCarousel .home-card-carousel__btn--prev {
        left: 0;
    }

    #homeServicesCarousel .home-card-carousel__btn--next {
        right: 0;
    }
}