/* mc-mobile-layout-v1: scoped phone layout refinements for the existing Zibll markup. */
@media (max-width: 767px), (max-width: 1024px) and (max-height: 480px) {
    /* Give navigation its own readable surface above the detailed hero image. */
    body.wp-theme-zibll .header {
        background: rgba(8, 24, 29, .94) !important;
        border-bottom: 1px solid rgba(119, 234, 204, .12);
    }
    /* The absolute search was positioned against the height of the whole hero,
       placing it on top of the shortcut cards. Give it its own normal-flow row. */
    body.home .header-slider-container > .header-slider-search {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: auto;
        max-width: none;
        margin: 12px 10px;
        padding: 0;
        transform: none;
    }

    body.home .header-slider-container > .header-slider-search .search-form {
        padding: 0;
    }

    body.home .header-slider-container > .header-slider-search .line-form {
        min-height: 44px;
        align-items: center;
    }

    body.home .header-slider-container > .header-slider-card {
        margin-top: 0;
    }

    /* Override the site's old max-560px single-column shortcut rule. */
    body.home .header-slider-card > div > .flex.flex-row.flex-col-sm-2 {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px;
        margin: 0 !important;
    }

    body.home .header-slider-card > div > .flex.flex-row.flex-col-sm-2 > .flex1 {
        min-width: 0;
        padding: 0;
    }

    body.home .header-slider-card .icon-cover-card.mc-motion-card {
        min-height: 92px;
        height: 100%;
        padding: 12px 10px !important;
    }

    body.home .header-slider-card .icon-cover-card.mc-motion-card > .icon-cover-icon {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
        font-size: 18px !important;
    }

    body.home .header-slider-card .icon-cover-card.mc-motion-card > .icon-cover-desc {
        margin-left: 8px;
        min-width: 0;
    }

    body.home .header-slider-card .icon-cover-card.mc-motion-card .icon-cover-desc > .em12.text-ellipsis.font-bold {
        font-size: 14px;
        line-height: 1.45;
        white-space: normal;
        overflow-wrap: anywhere;
        overflow: visible;
        text-overflow: clip;
    }

    body.home .header-slider-card .icon-cover-card.mc-motion-card .icon-cover-desc > .muted-color.mt6.text-ellipsis {
        margin-top: 4px;
        font-size: 12px;
        line-height: 1.5;
        white-space: normal;
        overflow-wrap: anywhere;
        overflow: visible;
        text-overflow: clip;
    }

    /* Keep the native header, logo, avatar and menu behavior. */
    body.wp-theme-zibll .header > .navbar-top .navbar-header > .navbar-toggle {
        min-width: 44px;
        height: 44px;
        margin-top: 3px;
        margin-bottom: 3px;
        opacity: 1;
        border-radius: 10px;
        background-color: rgba(255, 255, 255, .05);
        touch-action: manipulation;
    }

    /* These home section captions currently use 28px / 24px mobile sizes. */
    body.home .widget-text-title > .text-title {
        font-size: 24px;
        line-height: 1.4;
        margin-bottom: 12px;
    }

    body.home .widget-text-title > .text-desc {
        font-size: 16px;
        line-height: 1.65;
        margin-bottom: 16px;
        overflow-wrap: anywhere;
    }

    /* Preserve the existing horizontally scrollable category tabs. */
    body.home .widget-tab-post.style-list > .relative > .list-inline > li {
        padding: 0;
        margin: 0 4px 0 0;
    }

    body.home .widget-tab-post.style-list > .relative > .list-inline > li > a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        padding: 8px 14px;
        line-height: 1.4;
        touch-action: manipulation;
    }

    /* Let long project names use more of the narrow list card. */
    body.home .widget-tab-post.style-list .posts-item.list > .post-graphic:not(.order1) {
        margin-right: 12px;
        flex-shrink: 0;
    }

    body.home .widget-tab-post.style-list .posts-item.list > .post-graphic .item-thumbnail {
        width: 108px;
    }

    body.home .widget-tab-post.style-list .posts-item.list > .item-body {
        min-width: 0;
    }

    body.home .widget-tab-post.style-list .posts-item.list > .item-body > .item-heading {
        font-size: 16px;
        line-height: 1.5;
        -webkit-line-clamp: 3;
        max-height: 4.5em;
        margin-bottom: 8px;
        overflow-wrap: anywhere;
    }

    /* Off-screen review slides must stay inside their own Swiper viewport. */
    body.home .testimonial-wrap > .swiper-testimonial {
        overflow: hidden !important;
    }

    body.home .widget_zm_stats_bar_widget > .zm-stats-bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 8px; }
    body.home .widget_zm_stats_bar_widget .zm-stats-item { min-width: 0; margin: 0; justify-content: center; flex-wrap: wrap; }
    body.home .widget_zm_stats_bar_widget .zm-stats-sep { display: none; }
}