/* Explainer films on the FCN pages: a 16:9 cut, and a 4:5 cut with larger copy for phones, in one
   figure[data-fcn-film]. js/usmarket_fcn_film.js plays the cut on show while it is half on screen. */

.fcn-film {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: var(--ds-radius-md);
    background: #f6f7f9; /* the films' own paper, so the frame does not flash before the poster */
}

.fcn-film--4x5 {
    display: none;
    aspect-ratio: 4 / 5;
}

@media (max-width: 720px) {
    .fcn-film--16x9 {
        display: none;
    }

    .fcn-film--4x5 {
        display: block;
        width: min(100%, 88svh * 4 / 5);
        margin-inline: auto;
    }
}