/* Independent layouts; sparse placement preserves the configured reading order. */
.edma-banner-grid {
    display: grid;
    grid-template-columns: repeat(var(--mobile-columns), minmax(0, 1fr));
    grid-auto-rows: var(--mobile-height);
    gap: var(--mobile-gap);
}
.edma-banner {
    display: var(--mobile-display);
    grid-column: var(--mobile-column);
    grid-row: var(--mobile-rows);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border-radius: var(--banner-radius);
    background: var(--color-mist, #eff0f0);
}
.edma-banner picture,
.edma-banner img {
    display: block;
    width: 100%;
    height: 100%;
}
.edma-banner img { object-fit: var(--banner-fit); }
.edma-banner:focus-visible {
    outline: 3px solid var(--color-brass, #c69e44);
    outline-offset: 3px;
}
@media (min-width: 900px) {
    .edma-banner-grid {
        grid-template-columns: repeat(var(--desktop-columns), minmax(0, 1fr));
        grid-auto-rows: var(--desktop-height);
        gap: var(--desktop-gap);
    }
    .edma-banner {
        display: var(--desktop-display);
        grid-column: var(--desktop-column);
        grid-row: var(--desktop-rows);
    }
}