/* Haut de page « plein cadre cinéma » (oct. 2026) : vidéo moins assombrie, grain, bandes qui s'ouvrent,
   titre en grand en bas à gauche, barre de lecture + pause. Retirer ce fichier, hero-c.js et la classe .hc = retour arrière. */
html body .a2-hero.hc{align-items:flex-end;min-height:100vh;min-height:100svh;padding:120px 0 clamp(64px,11vh,120px)}
.a2-hero.hc .hv-fond video{filter:saturate(.94) contrast(1.06)}
.a2-hero.hc .hv-veil{background:
  linear-gradient(0deg,rgba(8,24,19,.9) 0%,rgba(8,24,19,.55) 26%,rgba(8,24,19,.12) 58%,rgba(8,24,19,.4) 100%),
  linear-gradient(90deg,rgba(8,24,19,.5) 0%,rgba(8,24,19,0) 60%)}
.a2-hero.hc .hc-grain{position:absolute;inset:-50%;pointer-events:none;opacity:.08;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:hcGrain 1s steps(4) infinite}
@keyframes hcGrain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}100%{transform:translate(0,0)}}
.a2-hero.hc .hc-bar{position:absolute;left:0;right:0;height:12%;background:#000;z-index:5;pointer-events:none;transition:transform 1.5s cubic-bezier(.7,0,.2,1) .15s}
.a2-hero.hc .hc-bar.t{top:0}.a2-hero.hc .hc-bar.b{bottom:0}
.a2-hero.hc.hc-on .hc-bar.t{transform:translateY(-101%)}.a2-hero.hc.hc-on .hc-bar.b{transform:translateY(101%)}
/* textes alignés à gauche */
html body .a2-hero.hc .wrap{text-align:left}
html body .a2-hero.hc .eyebrow,html body .a2-hero.hc h1.a2-kine,html body .a2-hero.hc .a2-herotail,html body .a2-hero.hc .a2-serifline,html body .a2-hero.hc .a2-meta{text-align:left;margin-left:0;margin-right:0}
html body .a2-hero.hc h1.a2-kine{font-size:clamp(3rem,7.2vw,7.4rem);line-height:.96;letter-spacing:-.015em;max-width:none;margin:18px 0 0}
html body .a2-hero.hc .a2-herotail{margin-top:26px;padding-top:0;border:0;max-width:52ch}
html body .a2-hero.hc .a2-serifline{max-width:52ch}
html body .a2-hero.hc .hv-ctas{justify-content:flex-start;margin-top:28px}
/* barre de lecture + pause */
.a2-hero.hc .hc-meta{position:absolute;z-index:4;right:max(32px,calc((100vw - 1180px)/2 + 32px));bottom:clamp(64px,11vh,120px);
  display:flex;align-items:center;gap:14px;font:500 11px/1 'JetBrains Mono',Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:#CFDCD3}
.a2-hero.hc .hc-prog{width:140px;height:2px;background:rgba(255,255,255,.22);position:relative;overflow:hidden;display:block}
.a2-hero.hc .hc-prog i{position:absolute;inset:0;background:var(--ambre,#F2B44A);transform-origin:0 50%;transform:scaleX(var(--hcp,0))}
.a2-hero.hc .hc-pp{width:40px;height:40px;border-radius:50%;border:1px solid rgba(238,242,238,.45);background:rgba(6,20,15,.35);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.a2-hero.hc .hc-pp:hover{border-color:#E9B44C}
.a2-hero.hc .hc-pp:focus-visible{outline:2px solid #E9C979;outline-offset:3px}
.a2-hero.hc .hc-pp svg{width:12px;height:12px;display:block}
@media (max-width:1100px){.a2-hero.hc .hc-meta .hc-lab{display:none}}
@media (max-width:700px){
  html body .a2-hero.hc{min-height:94svh;padding:110px 0 110px}
  html body .a2-hero.hc .wrap,html body .a2-hero.hc .eyebrow,html body .a2-hero.hc h1.a2-kine,html body .a2-hero.hc .a2-herotail,html body .a2-hero.hc .a2-serifline{text-align:left;margin-left:0;margin-right:0}
  html body .a2-hero.hc h1.a2-kine{font-size:clamp(2.5rem,11.5vw,3.6rem)}
  html body .a2-hero.hc .hv-ctas{align-items:flex-start}
  .a2-hero.hc .hc-meta{left:20px;right:auto;bottom:34px}
  .a2-hero.hc .hc-prog{width:110px}
  .a2-hero.hc .hc-bar{height:8%}
}
@media (prefers-reduced-motion:reduce){.a2-hero.hc .hc-bar,.a2-hero.hc .hc-grain,.a2-hero.hc .hc-meta{display:none}}
.hero.no-video .hc-meta{display:none}
