/* ===========================================================================
   FIVS — galerie photo (galerie.php) : chiffres, filtres par édition
   (collants), une section par édition, images sans année, univers visuel
   2027, renvois et visionneuse plein écran. Jetons de cine.css : thèmes
   clair / sombre suivis d'eux-mêmes ; propriétés logiques, le RTL se retourne.
   =========================================================================== */
.gl .pg-h2{font-size:var(--h2-acc);font-weight:600;color:var(--ivoire);line-height:1.12}
.gl .pg-h2 em{color:var(--rouge-vif)}
html[lang=ar] .gl,html[lang=ar] .gl *,html[lang=ar] .gl-lb,html[lang=ar] .gl-lb *{letter-spacing:0}
html[lang=ar] .gl,html[lang=ar] .gl-lb{font-family:var(--f-ar)}
html[lang=ar] .gl .pg-h2{line-height:1.35}
.gl .sec{scroll-margin-top:150px}
.gl [hidden]{display:none!important}

/* --- Chiffres ------------------------------------------------------------- */
.gl .gl-tete{padding-block:clamp(32px,4vw,56px) clamp(18px,2vw,28px)}
.gl-kpi{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--i-14)}
.gl-kpi li{display:flex;align-items:baseline;gap:12px;padding:clamp(16px,1.8vw,24px) clamp(6px,1.4vw,22px)}
.gl-kpi li+li{border-inline-start:1px solid var(--i-14);padding-inline-start:clamp(16px,2.4vw,36px)}
.gl-kpi strong{font-family:var(--f);font-size:clamp(30px,3vw,44px);line-height:1;font-weight:600;letter-spacing:-.03em;color:var(--ivoire);font-variant-numeric:tabular-nums}
.gl-kpi li:first-child strong{color:var(--rouge-vif)}
.gl-kpi span{font-size:14.5px;line-height:1.4;color:var(--i-62)}

/* --- Filtres par édition (collants, comme .hi-nav) -------------------------- */
.gl-nav{position:sticky;inset-block-start:86px;z-index:20;padding-inline:var(--gout);transition:inset-block-start .6s var(--ease)}
body:has(.hdr.is-cache) .gl-nav{inset-block-start:12px}
.gl-nav__in{display:flex;gap:6px;max-inline-size:calc(var(--large) - 2 * var(--gout));margin-inline:auto;padding:6px;border-radius:999px;
  background:color-mix(in srgb,var(--noir) 86%,transparent);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);
  box-shadow:inset 0 0 0 1px var(--i-08),0 10px 30px -18px rgba(0,0,0,.6);overflow-x:auto;scrollbar-width:none}
.gl-nav__in::-webkit-scrollbar{display:none}
.gl-f{flex:1 1 auto;display:flex;align-items:baseline;justify-content:center;gap:10px;min-inline-size:0;padding:10px 18px;border-radius:999px;white-space:nowrap;
  color:var(--i-62);background:color-mix(in srgb,var(--noir-3) 82%,transparent);box-shadow:inset 0 0 0 1px var(--i-14);transition:background .3s,color .3s,box-shadow .3s}
.gl-f b{font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--ivoire);font-variant-numeric:tabular-nums}
html[lang=ar] .gl-f b{font-size:16px}
.gl-f span{font-size:13px}
.gl-f small{font-family:var(--mono);font-size:11px;color:var(--i-40);font-variant-numeric:tabular-nums}
html[lang=ar] .gl-f small{font-family:var(--f-ar);font-size:12px}
.gl-f:hover{box-shadow:inset 0 0 0 1px var(--i-40);color:var(--ivoire)}
.gl-f[aria-current]{background:var(--ivoire);box-shadow:none}
.gl-f[aria-current] :is(b,span,small){color:var(--noir)}
.gl-f:focus-visible{outline:2px solid var(--rouge-vif);outline-offset:2px}

/* --- Section d'édition ----------------------------------------------------- */
.gl .gl-ed{padding-block:clamp(56px,6.4vw,104px)}
.gl-ed--alt{background:var(--noir-2)}
.gl-ed__tete{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;gap:20px clamp(28px,4vw,64px);margin-block-end:clamp(26px,3vw,40px)}
.gl-ed__tete .pg-tete{display:block;margin:0}
.gl .pg-tete__intro{max-inline-size:56ch}
:is(.gl-ed__tete,.gl-une__t) .pg-tete__intro{margin-block-start:18px}
.gl-ed__cote{display:flex;flex-direction:column;gap:18px;padding-block-end:6px}
.gl-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;font-size:14px;color:var(--i-62)}
.gl-meta span{display:inline-flex;align-items:center;gap:8px}
.gl-meta svg{inline-size:16px;block-size:16px;flex:none;color:var(--rouge-vif)}
.gl-liens{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin:0}
.gl-liens .lien-fl{font-size:14.5px;gap:8px}
.gl-liens .lien-fl svg{inline-size:14px;block-size:14px}
.gl-liens__n{font-weight:500;color:var(--i-62)}

/* --- Grille ---------------------------------------------------------------- */
.gl-grille{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1vw,14px)}
.gl-ph{position:relative;min-inline-size:0}
.gl-ph__a{position:relative;display:block;overflow:hidden;border-radius:14px;aspect-ratio:3/2;background:var(--noir-3);box-shadow:inset 0 0 0 1px var(--i-08);cursor:zoom-in}
.gl-ph__a img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;transition:transform .9s var(--ease),filter .5s}
.gl-ph__a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.5));opacity:0;transition:opacity .4s;pointer-events:none}
.gl-ph__a:hover img{transform:scale(1.05)}
.gl-ph__a:hover::after,.gl-ph__a:focus-visible::after{opacity:1}
.gl-ph__a:focus-visible{outline:2px solid var(--rouge-vif);outline-offset:2px}
.gl-ph__leg{position:absolute;z-index:1;inset-inline:0;inset-block-end:0;padding:24px 14px 12px;font-size:13px;font-weight:600;color:#f2ede6;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.65))}
.gl-ph__zoom{position:absolute;z-index:1;inset-block-start:10px;inset-inline-end:10px;display:grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;
  color:#0b0b0d;background:#f2ede6;opacity:0;scale:.85;transition:opacity .3s,scale .35s var(--ease)}
.gl-ph__zoom svg{inline-size:16px;block-size:16px}
.gl-ph__a:hover .gl-ph__zoom,.gl-ph__a:focus-visible .gl-ph__zoom{opacity:1;scale:1}
.gl-plus{display:block;margin:clamp(24px,2.6vw,36px) auto 0;padding:12px 24px;border:0;border-radius:999px;font:inherit;font-size:15px;font-weight:700;
  color:var(--ivoire);background:transparent;box-shadow:inset 0 0 0 1px var(--i-40);cursor:pointer;transition:background .25s,color .25s}
.gl-plus:hover{background:var(--ivoire);color:var(--noir)}

/* --- Édition à photo unique : grande vignette à côté du texte -------------- */
.gl-une{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:clamp(28px,4vw,64px)}
.gl-ed--une.gl-ed--alt .gl-une{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}
.gl-ed--une.gl-ed--alt .gl-grille--une{order:2}
.gl-grille--une{grid-template-columns:minmax(0,1fr)}
.gl-grille--une .gl-ph__a{aspect-ratio:16/9;border-radius:var(--r)}
.gl-une__t{display:flex;flex-direction:column;gap:20px}
.gl-une__t .pg-tete{display:block;margin:0}

/* --- Images sans année ------------------------------------------------------ */
.gl-autres{border-block-start:1px solid var(--i-08)}
.gl-autres .pg-tete{margin-block-end:clamp(24px,2.6vw,36px)}
.gl-autres .gl-grille{grid-template-columns:repeat(6,minmax(0,1fr))}
.gl-autres .gl-ph__a{aspect-ratio:1;border-radius:12px}

/* --- Univers visuel 2027 ------------------------------------------------- */
.gl .gl-charte{background:var(--noir-2);padding-block:clamp(56px,6.4vw,104px)}
.gl .gl-fin{padding-block:clamp(56px,6.4vw,104px)}
.gl-charte .pg-tete{margin-block-end:clamp(24px,2.6vw,36px)}
.gl-charte__l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(10px,1.2vw,18px)}
.gl-ph--illus .gl-ph__a{aspect-ratio:1;border-radius:var(--r);background:#fff}
.gl-ph--illus .gl-ph__a img{object-fit:contain;padding:6%}
.gl-ph--illus p{margin:12px 0 0;font-size:14px;font-weight:600;line-height:1.4;color:var(--i-80)}

/* --- Renvois ---------------------------------------------------------------- */
.gl-fin__b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);align-items:center;gap:24px clamp(28px,4vw,56px);padding:clamp(26px,3.4vw,48px);border-radius:var(--r);
  background:linear-gradient(140deg,color-mix(in srgb,var(--rouge) 18%,var(--noir-3)),var(--noir-3) 60%);box-shadow:inset 0 0 0 1px var(--i-08)}
.gl-fin__t h2{font-size:var(--h2-acc);font-weight:600;line-height:1.12;letter-spacing:-.02em;color:var(--ivoire)}
html[lang=ar] .gl-fin__t h2{line-height:1.35}
.gl-fin__t p{margin-block-start:10px;color:var(--i-62);max-inline-size:40ch}
.gl-fin__l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gl-fin__l a{position:relative;display:flex;flex-direction:column;gap:4px;block-size:100%;padding:16px 50px 16px 18px;border-radius:14px;
  background:color-mix(in srgb,var(--noir) 40%,transparent);box-shadow:inset 0 0 0 1px var(--i-14);transition:box-shadow .3s,background .3s}
[dir=rtl] .gl-fin__l a{padding:16px 18px 16px 50px}
.gl-fin__l b{font-size:16px;font-weight:700;color:var(--ivoire)}
.gl-fin__l span{font-size:13.5px;line-height:1.45;color:var(--i-62)}
.gl-fin__l svg{position:absolute;inset-block-start:18px;inset-inline-end:18px;inline-size:16px;block-size:16px;color:var(--rouge-vif);transition:translate .4s var(--ease)}
[dir=rtl] .gl-fin__l svg{scale:-1 1}
.gl-fin__l a:hover{box-shadow:inset 0 0 0 1px var(--i-40)}
.gl-fin__l a:hover svg{translate:4px 0}
[dir=rtl] .gl-fin__l a:hover svg{translate:-4px 0}

/* --- Visionneuse plein écran --------------------------------------------- */
.gl-lb{position:fixed;inset:0;inline-size:100vw;block-size:100dvh;max-inline-size:none;max-block-size:none;margin:0;padding:0;border:0;color:#f2ede6;background:rgba(6,6,8,.97);overflow:hidden}
.gl-lb::backdrop{background:rgba(4,4,6,.9)}
.gl-lb[open]{display:grid;grid-template-rows:minmax(0,1fr) auto;animation:glIn .3s var(--ease,ease)}
@keyframes glIn{from{opacity:0}}
.gl-lb__scene{display:grid;place-items:center;min-block-size:0;padding:clamp(56px,6vw,72px) clamp(12px,6vw,96px) 12px;touch-action:pan-y}
.gl-lb__scene img{max-inline-size:100%;max-block-size:calc(100dvh - clamp(56px,6vw,72px) - 12px - var(--gl-barre,84px));inline-size:auto;block-size:auto;object-fit:contain;border-radius:6px;box-shadow:0 30px 90px rgba(0,0,0,.6);transition:opacity .25s}
.gl-lb__scene img.is-charge{opacity:.25}
.gl-lb.is-illus .gl-lb__scene img{background:#fff;padding:3%;border-radius:18px}
.gl-lb__barre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding:14px clamp(16px,4vw,48px) max(18px,env(safe-area-inset-bottom));
  border-block-start:1px solid rgba(242,237,230,.1)}
.gl-lb__info{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0;font-size:14px;color:rgba(242,237,230,.7)}
.gl-lb__ed{font-weight:700;color:#ff2b3f}
.gl-lb__leg{color:#f2ede6}
.gl-lb__n{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums}
.gl-lb__liens{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.gl-lb__liens a{padding:9px 16px;border-radius:999px;font-size:13.5px;font-weight:700;color:#f2ede6;box-shadow:inset 0 0 0 1px rgba(242,237,230,.3);transition:background .2s,color .2s}
.gl-lb__liens a:hover{background:#f2ede6;color:#0b0b0d}
.gl-lb__couv{background:#e3061b;box-shadow:none!important}
.gl-lb__couv:hover{background:#ff2b3f!important;color:#fff!important}
.gl-lb__x,.gl-lb__pas{position:absolute;z-index:2;display:grid;place-items:center;inline-size:46px;block-size:46px;border:0;border-radius:50%;color:#f2ede6;
  background:rgba(242,237,230,.1);cursor:pointer;transition:background .2s}
.gl-lb__x:hover,.gl-lb__pas:hover{background:rgba(242,237,230,.24)}
.gl-lb__x:focus-visible,.gl-lb__pas:focus-visible,.gl-lb__liens a:focus-visible{outline:2px solid #ff2b3f;outline-offset:2px}
.gl-lb__x svg,.gl-lb__pas svg{inline-size:22px;block-size:22px}
.gl-lb__x{inset-block-start:14px;inset-inline-end:14px}
.gl-lb__pas{inset-block-start:calc(50% - 50px)}
.gl-lb__pas--prec{inset-inline-start:clamp(8px,1.6vw,24px)}
.gl-lb__pas--suiv{inset-inline-end:clamp(8px,1.6vw,24px)}
[dir=rtl] .gl-lb__pas svg{scale:-1 1}
.gl-lb.is-seul .gl-lb__pas{display:none}
html:has(.gl-lb[open]){overflow:hidden}

/* --- Responsive ----------------------------------------------------------- */
@media (max-width:1100px){
  .gl-grille{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gl-autres .gl-grille,.gl-charte__l{grid-template-columns:repeat(4,minmax(0,1fr))}
  .gl-ed__tete{grid-template-columns:minmax(0,1fr);align-items:start}
}
@media (max-width:900px){
  .gl-une,.gl-ed--une.gl-ed--alt .gl-une{grid-template-columns:minmax(0,1fr)}
  .gl-ed--une.gl-ed--alt .gl-grille--une{order:0}
  .gl-fin__b{grid-template-columns:minmax(0,1fr)}
  .gl-charte__l{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gl-nav{inset-block-start:74px}
}
@media (max-width:640px){
  .gl-kpi li{flex-direction:column;gap:6px;padding:14px 4px}
  .gl-kpi li+li{padding-inline-start:12px}
  .gl-kpi strong{font-size:28px}
  .gl-kpi span{font-size:12.5px;line-height:1.35}
  .gl-f small{display:none}
  .gl-grille{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gl-autres .gl-grille{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gl-charte__l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gl-fin__l{grid-template-columns:minmax(0,1fr)}
  .gl-nav{padding-inline:12px}
  .gl-nav__in{gap:4px;padding:5px}
  .gl-f{flex:0 0 auto;padding:9px 14px;gap:8px}
  .gl-f span{display:none}
  .gl-f b{font-size:14px}
  .gl-ph__a{border-radius:10px}
  .gl-ph__zoom{display:none}
  .gl-lb{--gl-barre:150px}
  .gl-lb__pas{inset-block-start:calc(50% - 95px);inline-size:40px;block-size:40px;background:rgba(14,14,16,.62)}
  .gl-lb__scene{padding:64px 0 12px}
  .gl-lb__scene img{border-radius:0}
  .gl-lb__liens a{padding:8px 14px;font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .gl-nav,.gl-ph__a img,.gl-ph__zoom,.gl-lb__scene img,.gl-fin__l svg{transition:none}
  .gl-lb[open]{animation:none}
}

/* Ouverture « Le cinéma nous rassemble » */
.gl-ouv{padding-block:clamp(56px,7vw,110px) clamp(24px,3vw,44px)}
.gl-ouv .titre-2{font-size:clamp(2.6rem,6.2vw,5.6rem);line-height:1.02}
.gl-ouv .chapo{font-size:clamp(1rem,1.15vw,1.12rem);line-height:1.85;text-align:justify}
.gl-ouv+.gl-tete{padding-block-start:0}

/* Collage animé d'ouverture (galerie-collage.js) : salle sombre pleine largeur. */
.gl-collage{position:relative;overflow:hidden;background:#0a0a0c;block-size:clamp(420px,78vh,780px);
  inline-size:100%;color:rgba(255,255,255,.55)}
.gl-collage__scene{position:absolute;inset:0;perspective:1100px;perspective-origin:50% 50%;transform-style:preserve-3d}
.gl-collage__carte{position:absolute;left:50%;top:50%;margin:0;aspect-ratio:3/4;overflow:hidden;background:#1a1a1e;
  box-shadow:0 18px 40px -18px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.06);backface-visibility:hidden;will-change:transform,opacity}
.gl-collage__carte.is-vedette{aspect-ratio:4/5;z-index:5}
.gl-collage__carte img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
.gl-collage__coin{position:absolute;z-index:6;font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;pointer-events:none}
.gl-collage__coin--hg{inset-block-start:18px;inset-inline-start:22px}
.gl-collage__coin--hd{inset-block-start:18px;inset-inline-end:22px}
.gl-collage__coin--bg{inset-block-end:18px;inset-inline-start:22px}
.gl-collage__coin--bd{inset-block-end:18px;inset-inline-end:22px}
[dir=rtl] .gl-collage__coin{letter-spacing:0}

/* Le festival en vidéo (galerie-videos.js) */
.gl-vid__filtres{display:flex;flex-wrap:wrap;gap:8px;margin-block:clamp(18px,2vw,28px)}
.gl-vid__f{font:inherit;font-size:14px;font-weight:600;padding:8px 16px;border-radius:99px;border:1px solid var(--i-14);background:#fff;color:var(--ivoire);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.gl-vid__f:hover{border-color:var(--rouge-vif);color:var(--rouge-vif)}
.gl-vid__f[aria-pressed=true]{background:#141416;border-color:#141416;color:#fff}
.gl-vid__grille{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,26px)}
.gl-vid__i[hidden]{display:none}
.gl-vid__carte{display:grid;gap:12px;inline-size:100%;padding:0;border:0;background:none;color:inherit;text-align:start;cursor:pointer;font:inherit}
.gl-vid__vis{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:18px;background:#0b0b0d;box-shadow:0 26px 50px -34px rgba(10,10,20,.6)}
.gl-vid__vis img{inline-size:100%;block-size:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .4s;filter:brightness(.82)}
.gl-vid__vis--vide{display:grid;place-items:center;background:radial-gradient(ellipse at center,#2a0a0e,#0b0b0d 70%)}
.gl-vid__vis--vide .gl-vid__logo{inline-size:46%;block-size:auto;object-fit:contain;filter:none;opacity:.85}
.gl-vid__carte:hover .gl-vid__vis img,.gl-vid__carte:focus-visible .gl-vid__vis img{transform:scale(1.06);filter:brightness(1)}
.gl-vid__play{position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;place-items:center;inline-size:62px;block-size:62px;border-radius:50%;
  background:var(--rouge-vif,#e3061b);box-shadow:0 0 0 8px rgba(227,6,27,.25);transition:transform .3s,box-shadow .3s}
.gl-vid__play svg{inline-size:26px;block-size:26px;fill:#fff;margin-inline-start:4px}
[dir=rtl] .gl-vid__play svg{margin-inline-start:0;margin-inline-end:4px;transform:none}
.gl-vid__carte:hover .gl-vid__play{transform:scale(1.1);box-shadow:0 0 0 14px rgba(227,6,27,.18)}
.gl-vid__duree{position:absolute;inset-block-end:12px;inset-inline-end:12px;padding:3px 9px;border-radius:7px;background:rgba(0,0,0,.72);color:#fff;font-size:12px;font-weight:600}
.gl-vid__badge{position:absolute;inset-block-start:12px;inset-inline-start:12px;padding:4px 11px;border-radius:99px;background:rgba(255,255,255,.92);color:#141416;font-size:12px;font-weight:700}
.gl-vid__t{font-size:17px;font-weight:700;line-height:1.35;color:var(--ivoire);transition:color .2s}
[dir=rtl] .gl-vid__t{line-height:1.6}
.gl-vid__carte:hover .gl-vid__t{color:var(--rouge-vif)}
.gl-vid__source{margin-block-start:clamp(20px,2.4vw,32px)}
.gl-vid__source a{font-weight:700;color:var(--ivoire);border-block-end:1.5px solid var(--rouge-vif);padding-block-end:2px}
.gl-vid__dlg{inline-size:min(1100px,94vw);max-block-size:94vh;padding:0;border:0;border-radius:18px;background:#0b0b0d;color:#fff;overflow:visible}
.gl-vid__dlg::backdrop{background:rgba(5,5,8,.86);backdrop-filter:blur(4px)}
.gl-vid__cadre{aspect-ratio:16/9;inline-size:100%;border-radius:18px 18px 0 0;overflow:hidden;background:#000}
.gl-vid__cadre.is-portrait{aspect-ratio:9/16;inline-size:min(420px,100%);max-block-size:80vh;margin-inline:auto}
.gl-vid__cadre iframe{inline-size:100%;block-size:100%;border:0;display:block}
.gl-vid__dlg-t{margin:0;padding:14px 20px 18px;font-weight:700}
.gl-vid__fermer{position:absolute;inset-block-start:-14px;inset-inline-end:-14px;inline-size:40px;block-size:40px;border-radius:50%;border:0;background:var(--rouge-vif,#e3061b);color:#fff;font-size:24px;line-height:1;cursor:pointer;z-index:2}
@media (max-width:620px){.gl-vid__fermer{inset-block-start:6px;inset-inline-end:6px}}

/* Lisibilité mobile/tablette : aucun libellé visible sous 12 px (bureau inchangé). */
@media (max-width:900px){
  .gl-f small{font-size:12px}
}
