/* Bande « Mon plateau » · chantier unslop 2026-11-12.
   Une boucle muette tirée d'une vidéo de Steeve, sur son vrai plateau, posée
   sous le hero des pages TikTok Live. Une vidéo différente par page.
   Comportement (js/plateau.js) : lecture seulement à l'écran, jamais avec
   « réduire les animations », bouton pause toujours disponible. */
.plateau{padding:clamp(1.6rem,4vw,2.6rem) 0 0}
.plateau__in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.2rem,3.5vw,2.6rem);align-items:center}
.plateau__ecran{position:relative;margin:0;border-radius:14px;overflow:hidden;background:#111;border:1px solid rgba(205,168,92,.22);aspect-ratio:4/3}
.plateau__ecran video{display:block;width:100%;height:100%;object-fit:cover}
.plateau__ecran::after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);background:linear-gradient(to top,rgba(10,10,10,.55),rgba(10,10,10,0) 38%)}
.plateau__pastille{position:absolute;left:14px;top:14px;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border-radius:999px;background:rgba(10,10,10,.72);color:#f5f5f5;font:600 .66rem/1 'Montserrat',system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.plateau__pastille i{width:7px;height:7px;border-radius:50%;background:#ae0000;box-shadow:0 0 0 3px rgba(174,0,0,.25)}
.plateau__pause{position:absolute;right:12px;bottom:12px;z-index:2;width:38px;height:38px;border-radius:50%;border:1px solid rgba(245,245,245,.35);background:rgba(10,10,10,.6);color:#f5f5f5;cursor:pointer;display:grid;place-items:center}
.plateau__pause:hover{border-color:#cda85c;color:#cda85c}
.plateau__pause:focus-visible{outline:2px solid #cda85c;outline-offset:3px}
.plateau__pause svg{width:14px;height:14px}
.plateau__pause .i-lecture{display:none}
.plateau__ecran.est-en-pause .plateau__pause .i-pause{display:none}
.plateau__ecran.est-en-pause .plateau__pause .i-lecture{display:block}
.plateau__txt .plateau__kick{display:block;font:700 .66rem/1 'Montserrat',system-ui,sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#cda85c;margin-bottom:.9rem}
.plateau__txt p{margin:0 0 1rem;font-size:1rem;line-height:1.7;color:rgba(245,245,245,.78)}
.plateau__txt p strong{color:#f5f5f5;font-weight:600}
.plateau__txt a{color:#cda85c;text-underline-offset:4px}
@media (max-width:760px){.plateau__in{grid-template-columns:1fr}}
/* Variante « L'auteur » dans le corps des articles du blog (js/post-engine.js). */
.plateau--auteur{padding:0;margin:2.2rem 0 2.6rem}
.plateau--auteur .plateau__in{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(1rem,3vw,1.8rem)}
.plateau--auteur .plateau__txt p{font-size:.95rem;margin-bottom:.7rem}
.plateau--auteur .plateau__txt p:last-child{margin-bottom:0}
@media (max-width:600px){.plateau--auteur .plateau__in{grid-template-columns:1fr}}
/* Variante autonome : la bande porte sa propre largeur quand la page n'a pas de conteneur adapté. */
.plateau--seul{max-width:1100px;margin:0 auto;padding:clamp(2rem,5vw,3.5rem) clamp(1rem,4vw,1.5rem)}
.plateau--etroit .plateau__in{grid-template-columns:1fr}
.plateau--etroit{padding:clamp(1.4rem,4vw,2rem) 0 0}
/* Variante portrait (2026-11-12) : vidéos verticales de Steeve, cadrées en 4:5
   pour garder la présence du sujet au lieu de rogner en paysage. */
.plateau--portrait .plateau__in{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.plateau--portrait .plateau__ecran{aspect-ratio:4/5;max-height:82vh}
@media (max-width:760px){.plateau--portrait .plateau__in{grid-template-columns:1fr}.plateau--portrait .plateau__ecran{max-height:none}}