/* BATES v0.26.195 – tablet layout polish after full-page visual review. */

/* The global .button display rule must never override native hidden state. */
.bates-home-guide [hidden] {
    display: none !important;
}

@media (min-width: 661px) and (max-width: 1080px) {
    /* Keep the client-zone story readable instead of squeezing two rich columns. */
    #main .bates-client-zone-section--home-outcome .bates-client-zone {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }

    #main .bates-client-zone-section--home-outcome .bates-client-zone-copy {
        max-width: none;
    }

    #main .bates-client-zone-section--home-outcome .bates-client-zone-visual-desktop {
        display: none;
    }

    #main .bates-client-zone-section--home-outcome .bates-client-zone-visual-mobile {
        display: block;
        width: min(100%, 820px);
        margin: 24px auto 0;
        padding: 9px;
        border-radius: 18px;
        transform: none;
        box-shadow: 0 22px 52px rgba(5, 13, 32, .3);
    }

    #main .bates-client-zone-section--home-outcome .bates-client-zone-visual-mobile .bates-client-zone-browser {
        border-radius: 12px;
    }

    #main .bates-client-zone-section--home-outcome .bates-client-zone-visual-mobile .bates-client-zone-browser img {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 1200 / 760;
        object-fit: cover;
        object-position: center top;
    }

    #main .bates-client-zone-section--home-outcome .bates-client-zone-mobile-chips {
        display: none;
    }

    /* A stacked lead removes the tall empty column beside the portrait photo. */
    #main .bates-home-why__lead {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
        align-items: start;
    }

    #main .bates-home-why__visual {
        width: min(100%, 820px);
        margin-inline: auto;
    }

    #main .bates-home-why__visual img {
        aspect-ratio: 16 / 9;
        max-height: 390px;
        object-position: center 38%;
    }

    #main .bates-home-why__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #main .bates-home-why__footer {
        align-items: flex-start;
        flex-direction: column;
    }

    #main .bates-home-why__actions {
        justify-content: flex-start;
    }
}