/* ==========================================================================
   Media Cards Section
   ========================================================================== */

.rw-media-cards {
    padding-top: var( --pad-top, 30px );
    padding-bottom: var( --pad-bottom, 30px );
    padding-left: 20px;
    padding-right: 20px;
}

/* Column variants — commented out until button group selector is re-enabled
   Uncomment these + the $cols logic in media_cards.php to restore per-instance control
.rw-media-cards__grid--2 { grid-template-columns: repeat( 2, 1fr ); }
.rw-media-cards__grid--3 { grid-template-columns: repeat( 3, 1fr ); }
.rw-media-cards__grid--4 { grid-template-columns: repeat( 4, 1fr ); } */

/* Hardcoded 2-column layout — swap for the variants above when ready */
.rw-media-cards__grid {
    display: grid;
    gap: 60px 20px;
    grid-template-columns: repeat( 2, 1fr );
}

/* Each item fills its grid cell — the media partial handles its own
   internal layout (image, video, link card) via .rw-media and children */
.rw-media-cards__item {
    aspect-ratio: 3 / 2;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media ( max-width: 992px ) {

    .rw-media-cards__grid {
        display: grid;
        gap: 20px;
        grid-template-columns: repeat( 1, 1fr );
    }
    .rw-media-cards {
        padding-top: calc( var( --pad-top, 40px ) / 2 );
        padding-bottom: calc( var( --pad-bottom, 40px ) / 2 );
    }

    /* Responsive column overrides — re-enable when column variants are restored
    .rw-media-cards__grid--4 {
        grid-template-columns: repeat( 2, 1fr );
    }

    .rw-media-cards__grid--3 {
        grid-template-columns: repeat( 2, 1fr );
    } */
}

@media ( max-width: 640px ) {
    /* All variants go to single column — re-enable when column variants are restored
    .rw-media-cards__grid--2,
    .rw-media-cards__grid--3,
    .rw-media-cards__grid--4 {
        grid-template-columns: 1fr;
    } */

    /* Hardcoded 2-col → 1-col at mobile */
    .rw-media-cards__grid {
        grid-template-columns: 1fr;
    }
}