/* ================================================================
   HOME MEDIA DASHBOARD COMPOSITION v2
   Layout ownership ONLY. Compact reference density: 3 columns x 2 rows.
   ================================================================ */

.public-home-layout .campaign-home-page {
    --home-media-rail: min(1840px, calc(100% - 64px));
    --home-media-column-gap: 24px;
    --home-media-row-gap: 24px;
    --home-media-card-height: 380px;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid {
    position: relative;
    width: var(--home-media-rail);
    margin: 18px auto 24px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, var(--home-media-card-height));
    column-gap: var(--home-media-column-gap);
    row-gap: var(--home-media-row-gap);
    align-items: stretch;
    background: transparent;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid > .managed-home-section {
    width: 100%;
    min-width: 0;
    height: var(--home-media-card-height);
    min-height: 0;
    margin: 0;
    padding: 0 !important;
    background: transparent !important;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-gallery,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-section,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-shell {
    display: contents;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card--photos { grid-column: 1; grid-row: 1; }

/* Video/Reels wrappers are removed from grid geometry with display:contents.
   Their actual visual cards become the grid items, exactly like Photo/Wallpaper/Poster. */
.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-videos,
.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-reels {
    display: contents !important;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-video-showcase {
    grid-column: 2;
    grid-row: 1;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-reels {
    grid-column: 3;
    grid-row: 1;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card--wallpapers { grid-column: 1; grid-row: 2; }
.public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card--posters { grid-column: 2; grid-row: 2; }
.public-home-layout .campaign-home-page .home-ref-media-card-grid .home-ref-news { grid-column: 3; grid-row: 2; }

.public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-video-showcase,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-reels,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .news-media-section,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .news-media-shell,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .news-media-card {
    width: 100% !important;
    max-width: none !important;
    height: var(--home-media-card-height) !important;
    min-height: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid .home-ref-news {
    display: flex;
    min-width: 0;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid .home-ref-news > * {
    width: 100%;
}

@media (max-width: 1365.98px) {
    .public-home-layout .campaign-home-page {
        --home-media-rail: calc(100% - 40px);
        --home-media-column-gap: 18px;
        --home-media-row-gap: 18px;
        --home-media-card-height: 360px;
    }
}

@media (max-width: 991.98px) {
    .public-home-layout .campaign-home-page {
        --home-media-rail: calc(100% - 32px);
        --home-media-column-gap: 18px;
        --home-media-row-gap: 18px;
        --home-media-card-height: 360px;
    }

    .public-home-layout .campaign-home-page .home-ref-media-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
    }

    .public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card--photos,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .home-ref-videos,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .home-ref-reels,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card--wallpapers,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card--posters,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .home-ref-news {
        grid-column: auto;
        grid-row: auto;
    }
}

@media (max-width: 767.98px) {
    .public-home-layout .campaign-home-page {
        --home-media-rail: calc(100% - 22px);
        --home-media-row-gap: 14px;
        --home-media-card-height: auto;
    }

    .public-home-layout .campaign-home-page .home-ref-media-card-grid {
        margin-top: 14px;
        margin-bottom: 18px;
        grid-template-columns: 1fr;
        gap: var(--home-media-row-gap);
    }

    .public-home-layout .campaign-home-page .home-ref-media-card-grid > .managed-home-section,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .gallery-media-card,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-video-showcase,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-reels,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .news-media-section,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .news-media-shell,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .news-media-card {
        height: auto !important;
        min-height: 0 !important;
    }
}


/* ================================================================
   ROOT FIX - SAME GEOMETRY FOR ALL SIX CARDS
   ================================================================ */
.public-home-layout .campaign-home-page {
    --home-media-equal-gap: 14px;
    --home-media-inner-x: 14px;
    --home-media-inner-top: 11px;
    --home-media-inner-bottom: 13px;
    --home-media-header-x: 16px;
}

.public-home-layout .campaign-home-page .home-ref-media-card-grid {
    column-gap: var(--home-media-equal-gap) !important;
    row-gap: var(--home-media-equal-gap) !important;
    gap: var(--home-media-equal-gap) !important;
}

/* No invisible wrapper is allowed to contribute width/gap to first row. */
.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-videos,
.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-reels {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* Actual first-row cards now fill the exact same grid cells as lower-row cards. */
.public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-video-showcase,
.public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-reels {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
}

@media (max-width: 1365.98px) {
    .public-home-layout .campaign-home-page {
        --home-media-equal-gap: 14px;
        --home-media-inner-x: 12px;
        --home-media-inner-top: 9px;
        --home-media-inner-bottom: 11px;
        --home-media-header-x: 13px;
    }
}

@media (max-width: 991.98px) {
    /* display:contents remains safe; restore automatic grid positioning */
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-video-showcase,
    .public-home-layout .campaign-home-page .home-ref-media-card-grid .campaign-reels {
        grid-column: auto;
        grid-row: auto;
    }
}


/* ================================================================
   v6 - FINAL MEDIA ISOLATION RESET
   These selectors intentionally outrank retired legacy #videos rules.
   ================================================================ */
@media (min-width: 992px) {
    body.public-home-layout .campaign-home-page .home-ref-media-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        column-gap: 14px !important;
        row-gap: 14px !important;
    }

    body.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-videos,
    body.public-home-layout .campaign-home-page .home-ref-media-card-grid > .home-ref-reels {
        display: contents !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.public-home-layout .campaign-home-page .home-ref-media-card-grid #videos.campaign-video-showcase {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: var(--home-media-card-height) !important;
        margin: 0 !important;
        padding: 0 !important;
        justify-self: stretch !important;
        align-self: stretch !important;
        box-sizing: border-box !important;
    }

    body.public-home-layout .campaign-home-page .home-ref-media-card-grid #reels.campaign-reels {
        grid-column: 3 !important;
        grid-row: 1 !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: var(--home-media-card-height) !important;
        margin: 0 !important;
        padding: 0 !important;
        justify-self: stretch !important;
        align-self: stretch !important;
        box-sizing: border-box !important;
    }
}