/* =========================================================
   NXA.CO — FINAL ALBUM BOTTOM FIX
   - standardise final 4 photos
   - remove empty grid height
   - bring YouTube much closer
========================================================= */

/* Remove unnecessary bottom space from the album container */
.work-album-scroll {
    padding-bottom: 12px !important;
    gap: 10px !important;
}

/* Final 4 photos = one clean standard row */
.work-album-pattern-block.is-final-four {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: clamp(240px, 27vw, 390px) !important;
    gap: 10px !important;
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 0 !important;
}

.work-album-pattern-block.is-final-four .work-album-pattern-item {
    grid-row: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
}

.work-album-pattern-block.is-final-four .pattern-item-1 {
    grid-column: 1 !important;
}

.work-album-pattern-block.is-final-four .pattern-item-2 {
    grid-column: 2 !important;
}

.work-album-pattern-block.is-final-four .pattern-item-3 {
    grid-column: 3 !important;
}

.work-album-pattern-block.is-final-four .pattern-item-4 {
    grid-column: 4 !important;
}

.work-album-pattern-block.is-final-four img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* YouTube sits immediately after the final photos */
.work-album-youtube {
    width: 100% !important;
    margin: 4px 0 10px !important;
    padding: 0 !important;
    grid-column: 1 / -1 !important;
}

.work-album-youtube-head {
    display: none !important;
}

.work-album-youtube-frame {
    width: min(1180px, 92vw) !important;
    aspect-ratio: 16 / 9 !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    background: #090202 !important;
}

.work-album-youtube-frame iframe {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0 !important;
}

/* Tablet */
@media (max-width: 900px) {
    .work-album-pattern-block.is-final-four {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, 260px) !important;
        gap: 8px !important;
    }

    .work-album-pattern-block.is-final-four .pattern-item-1 {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    .work-album-pattern-block.is-final-four .pattern-item-2 {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    .work-album-pattern-block.is-final-four .pattern-item-3 {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    .work-album-pattern-block.is-final-four .pattern-item-4 {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }

    .work-album-youtube {
        margin-top: 2px !important;
    }
}

/* Mobile */
@media (max-width: 560px) {
    .work-album-pattern-block.is-final-four {
        grid-template-columns: 1fr !important;
        grid-template-rows: none !important;
    }

    .work-album-pattern-block.is-final-four .work-album-pattern-item {
        grid-column: 1 !important;
        grid-row: auto !important;
        aspect-ratio: 4 / 5 !important;
        height: auto !important;
    }

    .work-album-youtube {
        margin-top: 0 !important;
    }

    .work-album-youtube-frame {
        width: 92vw !important;
    }
}


/* =========================================================
   ALBUM YOUTUBE — BOTTOM OF PHOTO GRID
========================================================= */
.work-album-youtube {
    flex: 0 0 auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 8px 0 18px !important;
    padding: 0 !important;
    position: relative !important;
    overflow: visible !important;
}

.work-album-youtube-frame {
    width: min(1180px, 92vw) !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    margin: 0 auto !important;
    background: #090202 !important;
    overflow: hidden !important;
}

.work-album-youtube-frame iframe {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    border: 0 !important;
}

@media (max-width: 700px) {
    .work-album-youtube-frame {
        width: 94vw !important;
    }
}
