/* Adaptations par largeur d'écran : écrans larges, ordinateurs, tablettes, mobiles. */

@media (min-width: 1800px) {
    .video-grid:not(.video-grid--related) { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
    .video-grid:not(.video-grid--related) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .video-page { grid-template-columns: minmax(0, 1fr); }
    .video-grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cookie-banner { flex-direction: column; align-items: stretch; gap: 14px; }
}

@media (max-width: 900px) {
    :root { --header-height: 64px; }

    .nav-toggle { display: flex; }

    .site-nav {
        position: fixed;
        inset: var(--header-height) 0 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 20px;
        padding: 20px var(--gutter) 32px;
        overflow-y: auto;
        background: var(--bg);
    }
    .site-nav.is-open { display: flex; }

    .site-nav__links { flex-direction: column; }
    .site-nav__links a {
        padding: 14px 4px;
        border-bottom: 1px solid var(--line);
        border-radius: 0;
        color: var(--text);
        font-size: 1.1rem;
    }
    .site-nav__account { flex-direction: column; align-items: stretch; }
    .site-nav__account .btn { min-height: 48px; }

    .profile-menu__button { width: 100%; }
    .profile-menu__panel { position: static; margin-top: 8px; }

    body.nav-open { overflow: hidden; }

    /* backdrop-filter crée un bloc conteneur qui piégerait le menu en position fixed. */
    .site-header { background: var(--bg); backdrop-filter: none; }

    .hero { min-height: min(68vh, 560px); }
    .site-footer__grid { grid-template-columns: 1fr 1fr; }
    .site-footer__grid > :first-child { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
    .video-grid:not(.video-grid--related) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
    .video-grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
    .video-card__title { font-size: 0.95rem; }

    /* Tactile : pas de survol, l'icône de lecture reste discrètement visible. */
    .video-card__play { width: 40px; height: 40px; opacity: 0.9; transform: translate(-50%, -50%); }
    .video-card__play svg { width: 18px; height: 18px; }

    .form-row { grid-template-columns: 1fr; }

    /* Lecteur bord à bord pour exploiter toute la largeur. */
    .video-page { padding-top: 0; gap: 24px; }
    .player { margin-inline: calc(var(--gutter) * -1); border-radius: 0; }
}

@media (max-width: 480px) {
    .video-grid:not(.video-grid--related),
    .video-grid--related { grid-template-columns: minmax(0, 1fr); gap: 26px; }

    .hero { min-height: 62vh; }
    .hero__actions .btn { width: 100%; }

    .site-footer__grid { grid-template-columns: 1fr; }
    .cookie-banner { left: 8px; right: 8px; bottom: 8px; padding: 14px; }
    .cookie-banner__actions .btn { flex: 1 1 100%; }
    .cookie-dialog__actions .btn { flex: 1 1 100%; }

    /* Lecteur verrouillé : le contenu doit tenir dans un cadre 16/9 réduit. */
    .player__locked p { display: none; }
    .player__locked-actions { margin-top: 10px; }
    .player__locked-actions .btn { min-height: 38px; padding: 6px 14px; }
}
