/* FIVS — vidéothèque. Fond blanc, rouge du logo #e3061b, Cairo (arabe) / Manrope (latin), polices locales. */
@font-face{font-family:Cairo;font-weight:400;font-display:swap;src:url(../fonts/font-0.woff2) format('woff2')}
@font-face{font-family:Cairo;font-weight:600;font-display:swap;src:url(../fonts/font-1.woff2) format('woff2')}
@font-face{font-family:Cairo;font-weight:700;font-display:swap;src:url(../fonts/font-2.woff2) format('woff2')}
@font-face{font-family:Cairo;font-weight:800;font-display:swap;src:url(../fonts/font-3.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(../fonts/font-5.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:500;font-display:swap;src:url(../fonts/font-6.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:600;font-display:swap;src:url(../fonts/font-7.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(../fonts/font-8.woff2) format('woff2')}

:root{
  --rouge:#e3061b; --rouge-f:#b8000f; --rouge-p:#fdecee;
  --encre:#0f0f10; --texte:#2b2b2e; --doux:#606067; --trait:#e7e7ea; --fond:#ffffff; --gris:#f4f4f6;
  --or:#b07d12; --or-p:#fbf3df; --argent:#6b7280; --bronze:#9a5b2c;
  --r:14px; --ombre:0 1px 2px rgba(15,15,16,.06),0 6px 18px rgba(15,15,16,.06);
  --page:min(1480px,100% - 32px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--fond);color:var(--texte);font:15px/1.55 Manrope,Cairo,system-ui,-apple-system,"Segoe UI",sans-serif}
body.rtl{font-family:Cairo,Manrope,system-ui,sans-serif;letter-spacing:0}
:lang(ar),[dir=rtl] *{letter-spacing:0!important}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--rouge);outline-offset:2px;border-radius:8px}
h1,h2,h3{color:var(--encre);margin:0;line-height:1.25}
.visuel-cache{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saut{position:absolute;inset-inline-start:-999px;top:8px;background:var(--rouge);color:#fff;padding:8px 14px;border-radius:999px;z-index:99}
.saut:focus{inset-inline-start:12px}
.ic{width:20px;height:20px;flex:none}
.rtl .ic--dir{transform:scaleX(-1)}
.drap{font-style:normal}

/* --- En-tête -------------------------------------------------------------- */
.tete{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--trait)}
.tete__in{width:var(--page);margin:auto;display:flex;align-items:center;gap:18px;height:66px;direction:ltr}
.rtl .cherche,.rtl .langues{direction:rtl}
.marque{display:flex;align-items:center;gap:10px;flex:none;direction:ltr}
.marque img{height:38px;width:auto}
.marque__t{font-weight:700;color:var(--encre);font-size:15px;padding-inline-start:10px;border-inline-start:2px solid var(--rouge);line-height:1.1}
.rtl .marque__t{font-family:Cairo}
.cherche{flex:1;display:flex;max-width:640px;margin-inline:auto;border:1px solid #d6d6db;border-radius:999px;overflow:hidden;background:#fff;transition:border-color .2s,box-shadow .2s}
.cherche:focus-within{border-color:var(--rouge);box-shadow:0 0 0 4px var(--rouge-p)}
.cherche input{flex:1;min-width:0;border:0;padding:10px 18px;font:inherit;background:transparent;color:var(--encre);outline:0}
.cherche button{border:0;background:var(--gris);padding:0 18px;cursor:pointer;color:var(--encre);display:grid;place-items:center;border-inline-start:1px solid #d6d6db}
.cherche button:hover{background:#ebebef}
.langues{display:flex;gap:2px;background:var(--gris);border-radius:999px;padding:3px;flex:none}
.langues a{padding:5px 11px;border-radius:999px;font-size:13px;font-weight:700;color:var(--doux)}
.langues a.on{background:#fff;color:var(--rouge);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.langues a[lang=ar]{font-family:Cairo}
.rond{width:40px;height:40px;border-radius:50%;border:1px solid var(--trait);background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--encre)}
.rond:hover{background:var(--gris)}
.tete__menu{display:none}
.onglets{width:var(--page);margin:auto;display:flex;gap:8px;overflow-x:auto;padding:10px 0 12px;scrollbar-width:none}
.onglets::-webkit-scrollbar{display:none}
.onglets a{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:7px 14px;border-radius:10px;background:var(--gris);color:var(--encre);font-weight:600;font-size:14px;transition:background .15s}
.onglets a small{color:var(--doux);font-weight:500}
.onglets a .ic{width:17px;height:17px}
.onglets a:hover{background:#e9e9ee}
.onglets a.on{background:var(--encre);color:#fff}
.onglets a.on small{color:#c9c9cf}

/* --- Boutons ---------------------------------------------------------------- */
.bt{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:9px 16px;font:inherit;font-weight:700;font-size:14px;cursor:pointer;transition:background .15s,transform .15s}
.bt .ic{width:18px;height:18px}
.bt--rouge{background:var(--rouge);color:#fff}
.bt--rouge:hover{background:var(--rouge-f)}
.bt--doux{background:var(--gris);color:var(--encre)}
.bt--doux:hover{background:#e7e7ec}
.bt--grand{padding:13px 26px;font-size:16px}
.bt:active{transform:scale(.97)}

/* --- Page --------------------------------------------------------------------- */
.page{width:var(--page);margin:auto;padding:22px 0 60px;min-height:60vh}
.sur{display:inline-flex;align-items:center;gap:7px;margin:0 0 8px;color:var(--rouge);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.06em}
.rtl .sur{text-transform:none;font-size:14px}
.sur .ic{width:16px;height:16px}

/* À la une */
.une{position:relative;border-radius:22px;overflow:hidden;background:#111;color:#fff;margin-bottom:26px;isolation:isolate}
.une__fond{position:absolute;inset:0;z-index:-1}
.une__fond img{width:100%;height:100%;object-fit:cover;filter:blur(28px) saturate(1.2);transform:scale(1.2);opacity:.55}
.une__fond::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,12,.92),rgba(10,10,12,.55))}
.rtl .une__fond::after{background:linear-gradient(270deg,rgba(10,10,12,.92),rgba(10,10,12,.55))}
.une__in{display:grid;grid-template-columns:1fr 1.15fr;gap:34px;align-items:center;padding:38px}
.une h1{color:#fff;font-size:clamp(26px,3.4vw,44px);margin:4px 0 10px;font-weight:800}
.une .sur{color:#ff5a68}
.une__aut{color:#e4e4e8;font-size:17px;margin:0 0 14px}
.une__prix{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.une__img{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#000;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.une__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.une__img:hover img{transform:scale(1.03)}

/* Chiffres */
.chiffres{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:6px 4px 22px;border-bottom:1px solid var(--trait);margin-bottom:12px}
.chiffres__intro{margin:0;color:var(--doux);font-size:15px;max-width:520px}
.chiffres ul{list-style:none;margin:0;padding:0;display:flex;gap:30px;flex-wrap:wrap}
.chiffres li{display:flex;flex-direction:column}
.chiffres b{font-size:28px;color:var(--rouge);font-weight:800;line-height:1.1}
.chiffres span{font-size:13px;color:var(--doux)}

/* Rangées */
.rangee{margin:26px 0 8px}
.rangee__h{display:flex;align-items:flex-end;gap:14px;margin-bottom:12px}
.rangee__h>div{flex:1;min-width:0}
.rangee__h h2{font-size:21px;font-weight:800}
.rangee__h p{margin:2px 0 0;color:var(--doux);font-size:13px}
.lien-tout{display:inline-flex;align-items:center;gap:4px;color:var(--rouge);font-weight:700;font-size:14px;white-space:nowrap}
.lien-tout .ic{width:16px;height:16px}
.rangee__nav{display:flex;gap:6px}
.rangee__nav .rond{width:34px;height:34px}
.rangee__nav .ic{width:18px;height:18px}
.rangee__piste{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 4*16px)/5);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:#d0d0d6 transparent}
.rangee__piste>*{scroll-snap-align:start}
.rangee--or .rangee__h h2::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,#f6d36b,#b07d12);margin-inline-end:9px;vertical-align:middle}

/* Cartes */
.carte{min-width:0}
.carte__img{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--gris)}
.carte__img img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.carte:hover .carte__img img{transform:scale(1.05)}
.carte__vide{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(135deg,#e3061b,#8f0010)}
.carte__vide img{width:42%;height:auto;opacity:.9;object-fit:contain;transform:none!important}
.carte__play{position:absolute;inset:0;margin:auto;width:54px;height:54px;border-radius:50%;background:rgba(227,6,27,.92);color:#fff;display:grid;place-items:center;opacity:0;transform:scale(.8);transition:opacity .2s,transform .2s;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.carte__play .ic{width:26px;height:26px;margin-inline-start:3px}
.carte:hover .carte__play,.carte__img:focus-visible .carte__play,.une__img .carte__play{opacity:1;transform:none}
.une__img .carte__play{width:74px;height:74px}
.carte__duree{position:absolute;bottom:7px;inset-inline-end:7px;background:rgba(0,0,0,.8);color:#fff;font-size:12px;font-weight:700;padding:1px 6px;border-radius:5px;direction:ltr}
.carte__coupe{position:absolute;top:8px;inset-inline-start:8px;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#f9dc7d,#c08a17);color:#3b2600;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.carte__coupe .ic{width:17px;height:17px}
.carte__txt{padding:10px 2px 4px}
.carte__t{font-size:15px;font-weight:700;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rtl .carte__t,.carte__t [dir=rtl]{font-family:Cairo}
.carte__t a:hover{color:var(--rouge)}
.carte__m{margin:4px 0 0;color:var(--doux);font-size:13px;display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.carte__m b{font-weight:400;opacity:.6}
.carte__p{margin:6px 0 0}

/* Pastilles de prix */
.prix{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px 3px 8px;font-size:12px;font-weight:700;background:var(--or-p);color:#6b4a00;border:1px solid #efd9a1;line-height:1.4}
.prix .ic{width:14px;height:14px}
.prix--r1{background:linear-gradient(135deg,#fff3c4,#f7dc83);border-color:#e3bd4f;color:#5a3d00}
.prix--r2{background:#f1f3f6;border-color:#d5d9e0;color:#3d4450}
.prix--r3{background:#f8ebe1;border-color:#e6c6ad;color:#6d3a14}
.prix--public{background:var(--rouge-p);border-color:#f7c3c9;color:#8f0010}
.prix--special{background:#eef2ff;border-color:#cdd6fb;color:#2f3c8f}
.une .prix{box-shadow:0 1px 0 rgba(255,255,255,.2)}

/* Grilles */
.grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px 16px}
.bandeau{padding:14px 0 18px;border-bottom:1px solid var(--trait);margin-bottom:22px}
.bandeau h1{font-size:clamp(26px,3vw,38px);font-weight:800;margin-bottom:6px}
.bandeau>p{margin:4px 0;color:var(--doux)}
.bandeau__d{max-width:760px}
.bandeau--or .sur{color:var(--or)}
.puces{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.puces a{padding:7px 14px;border-radius:999px;border:1px solid var(--trait);font-weight:600;font-size:14px;background:#fff}
.puces a small{color:var(--doux)}
.puces a:hover{border-color:#c9c9cf}
.puces a.on{background:var(--rouge);border-color:var(--rouge);color:#fff}
.puces a.on small{color:#ffd5d9}
.bloc{margin:8px 0 34px}
.bloc__h{display:flex;align-items:baseline;gap:12px;margin-bottom:14px;border-inline-start:4px solid var(--rouge);padding-inline-start:12px}
.bloc__h h2{font-size:20px;font-weight:800;flex:1}
.compte{color:var(--doux);font-size:14px}
.sous{font-size:15px;color:var(--doux);font-weight:700;margin:18px 0 12px;text-transform:uppercase;letter-spacing:.05em}
.rtl .sous{text-transform:none;font-size:16px}
.vide{color:var(--doux);padding:30px 0}
.vide-page{text-align:center;padding:80px 0}
.vide-page h1{font-size:24px;margin-bottom:20px}
.cherche--grand{max-width:none;margin:14px 0 6px;border-radius:14px}
.cherche--grand select{border:0;border-inline-start:1px solid #d6d6db;padding:0 12px;font:inherit;background:#fff;color:var(--encre)}
.cherche--grand .bt{border-radius:0}

/* Listes */
.listes-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.carte-liste{display:flex;flex-direction:column;gap:6px}
.carte-liste__img{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--gris);box-shadow:6px -6px 0 -1px #ddd,12px -12px 0 -2px #eee}
.rtl .carte-liste__img{box-shadow:-6px -6px 0 -1px #ddd,-12px -12px 0 -2px #eee}
.carte-liste__img img{width:100%;height:100%;object-fit:cover}
.carte-liste__nb{position:absolute;inset-block:0;inset-inline-end:0;width:38%;background:rgba(15,15,16,.78);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-weight:800;font-size:18px}
.carte-liste__t{font-weight:800;color:var(--encre);margin-top:6px}
.carte-liste__d{color:var(--doux);font-size:13px}
.carte-liste:hover .carte-liste__t{color:var(--rouge)}

/* Page vidéo */
.regarder{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:28px;align-items:start}
.lecteur{position:relative;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden}
.lecteur__media{position:absolute;inset:0;width:100%;height:100%;border:0}
.lecteur__ext{position:absolute;inset:0;display:grid;place-content:center;gap:14px;text-align:center;color:#fff;padding:20px}
.regarder__t{font-size:clamp(21px,2.3vw,28px);font-weight:800;margin:16px 0 8px}
.rtl .regarder__t,.regarder__t[dir=rtl]{font-family:Cairo}
.regarder__prix{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.regarder__barre{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--trait)}
.auteur{margin:0;font-weight:800;color:var(--encre);font-size:16px}
.meta{margin:2px 0 0;color:var(--doux);font-size:14px;display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center}
.meta span{display:inline-flex;align-items:center;gap:5px}
.meta .ic{width:16px;height:16px}
.regarder__act{display:flex;flex-wrap:wrap;gap:8px}
.fiche{display:flex;flex-wrap:wrap;gap:10px 34px;margin:16px 0;padding:14px 18px;background:var(--gris);border-radius:14px}
.fiche dt{font-size:12px;color:var(--doux);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.rtl .fiche dt{text-transform:none;font-size:13px}
.fiche dd{margin:2px 0 0;font-weight:700}
.fiche dd a:hover{color:var(--rouge)}
.regarder__desc{white-space:normal;color:var(--texte);margin-bottom:16px}
.enchainer{display:flex;justify-content:space-between;gap:10px;margin-top:10px}
.regarder__suite h2{font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;margin-bottom:10px}
.suite{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;max-height:calc(100vh - 140px);overflow:auto;position:sticky;top:130px}
.suite a{display:grid;grid-template-columns:168px 1fr;gap:10px;padding:6px;border-radius:12px}
.suite a:hover,.suite li.on a{background:var(--gris)}
.suite li.on a{box-shadow:inset 3px 0 0 var(--rouge)}
.rtl .suite li.on a{box-shadow:inset -3px 0 0 var(--rouge)}
.suite__img{position:relative;aspect-ratio:16/9;border-radius:9px;overflow:hidden;background:var(--gris)}
.suite__img img{width:100%;height:100%;object-fit:cover}
.suite__txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.suite__txt b{font-size:14px;line-height:1.35;color:var(--encre);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.suite__txt small{color:var(--doux);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.suite__prix{display:inline-flex;align-items:center;gap:4px;color:var(--or)!important;font-weight:700}
.suite__prix .ic{width:13px;height:13px}

/* Pied */
.pied{background:#0f0f10;color:#c9c9cf;margin-top:30px}
.pied__in{width:var(--page);margin:auto;padding:34px 0;display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;justify-content:space-between}
.pied__marque{display:flex;align-items:center;gap:14px;direction:ltr}
.pied__marque img{height:34px;width:auto}
.pied__marque span{font-size:13px;max-width:230px;line-height:1.35;direction:ltr}
.pied__liens{display:flex;flex-wrap:wrap;gap:8px 22px}
.pied__liens a{display:inline-flex;align-items:center;gap:7px;color:#fff;font-weight:600}
.pied__liens a:hover{color:#ff5a68}
.pied__note{width:100%;margin:0;font-size:12px;color:#8b8b93;border-top:1px solid #26262a;padding-top:16px}

/* Réactif */
@media (max-width:1200px){.rangee__piste{grid-auto-columns:calc((100% - 3*16px)/4)}.regarder{grid-template-columns:minmax(0,1fr) 340px}.suite a{grid-template-columns:140px 1fr}}
@media (max-width:980px){
  .rangee__piste{grid-auto-columns:calc((100% - 2*14px)/3);gap:14px}
  .regarder{grid-template-columns:1fr}
  .suite{position:static;max-height:none}
  .une__in{grid-template-columns:1fr;padding:22px;gap:20px}
  .une__img{order:-1}
}
@media (max-width:720px){
  :root{--page:calc(100% - 32px)}
  .tete__in{height:auto;flex-wrap:wrap;padding:10px 0;gap:10px}
  .marque img{height:30px}
  .marque__t{font-size:14px}
  .langues{margin-inline-start:auto}
  .cherche{order:3;flex-basis:100%;margin:0}
  .tete__menu{display:grid}
  .onglets{display:none;flex-direction:column;padding:6px 0 12px}
  .onglets.ouvert{display:flex}
  .onglets a{width:100%}
  .rangee__piste{grid-auto-columns:72%}
  .rangee__nav{display:none}
  .chiffres ul{gap:18px}
  .chiffres b{font-size:22px}
  .grille{grid-template-columns:1fr 1fr;gap:16px 10px}
  .carte__t{font-size:14px}
  .une{border-radius:16px}
  .une h1{font-size:24px}
  .lecteur{border-radius:0;margin-inline:-16px}
  .regarder__act .bt span{display:none}
  .regarder__act .bt{padding:10px}
  .cherche--grand{flex-wrap:wrap}
  .cherche--grand select{flex:1;border-inline-start:0;border-top:1px solid #d6d6db;padding:10px}
  .cherche--grand .bt{border-top:1px solid #d6d6db}
}
@media (max-width:420px){.grille{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Parcourir : filtres */
.filtres{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin-top:14px}
.filtres label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:var(--doux)}
.filtres select{min-width:170px;padding:9px 12px;border:1px solid #d6d6db;border-radius:10px;font:inherit;font-size:14px;color:var(--encre);background:#fff}
.filtres select:focus{border-color:var(--rouge);outline:0;box-shadow:0 0 0 3px var(--rouge-p)}
.filtres__case{flex-direction:row!important;align-items:center;gap:6px!important;font-size:14px!important;color:var(--encre)!important;padding:9px 4px}
.filtres__case .ic{width:16px;height:16px;color:var(--or)}
.regarder__desc h2{font-size:16px;font-weight:800;margin:0 0 6px}
.regarder__desc p{margin:0;line-height:1.8}
.fiche dd small{color:var(--doux);font-weight:500}
@media (max-width:720px){.filtres label{flex:1 1 45%}.filtres select{min-width:0;width:100%}}

/* Logo animé de la vidéothèque : calques découpés dans le logo fourni (1127 × 222). */
.lv{position:relative;display:block;height:38px;aspect-ratio:1127/222;direction:ltr}
.lv img{position:absolute;top:0;height:100%;width:auto;max-width:none}
.lv__fivs{left:0;animation:lv-monte .6s cubic-bezier(.2,.7,.2,1) both}
.lv__barre{left:41.70%;transform-origin:50% 60%;animation:lv-barre .45s .35s cubic-bezier(.2,.7,.2,1) both}
.lv__mot{left:47.91%;animation:lv-mot .7s .5s cubic-bezier(.2,.7,.2,1) both}
.lv__badge{position:absolute;left:8.163%;top:2.252%;width:5.235%;height:26.58%;border-radius:50%;
  animation:lv-pop .55s .75s cubic-bezier(.3,1.6,.5,1) both, lv-pouls 4s 2s ease-in-out infinite}
.lv__badge img{position:static;width:100%;height:100%}
.lv__badge::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #e3061b;opacity:0;
  animation:lv-onde 4s 2s ease-out infinite}
.marque:hover .lv__badge{animation:lv-pouls .8s ease-in-out}
@keyframes lv-monte{from{opacity:0;transform:translateY(35%)}to{opacity:1;transform:none}}
@keyframes lv-barre{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes lv-mot{from{clip-path:inset(0 100% 0 0);opacity:.2;transform:translateX(-4%)}to{clip-path:inset(0 0 0 0);opacity:1;transform:none}}
@keyframes lv-pop{from{transform:scale(0) rotate(-90deg)}to{transform:scale(1) rotate(0)}}
@keyframes lv-pouls{0%,100%{transform:scale(1)}8%{transform:scale(1.16)}16%{transform:scale(.96)}24%{transform:scale(1)}}
@keyframes lv-onde{0%{opacity:.7;transform:scale(1)}30%{opacity:0;transform:scale(2.2)}100%{opacity:0}}
@media (max-width:720px){.lv{height:30px}}
@media (prefers-reduced-motion:reduce){.lv *,.lv__badge::after{animation:none!important}}

/* ==========================================================================
   Thème « salle obscure » (toute la plateforme) — esprit plateformes de streaming,
   identité FIVS : noir profond, rouge du logo, or des prix.
   ========================================================================== */
body.sombre{
  --fond:#0a0a0c; --encre:#f6f6f8; --texte:#d9d9de; --doux:#9d9da6; --trait:#25252b; --gris:#17171b;
  --rouge-p:rgba(227,6,27,.16); --or-p:rgba(240,196,90,.14);
  background:var(--fond); color:var(--texte);
}
.sombre .tete{background:rgba(10,10,12,.92);border-bottom-color:#1c1c21}
.sombre .cherche{background:#141418;border-color:#2b2b31}
.sombre .cherche input{color:var(--encre)}
.sombre .cherche button{background:#1d1d22;color:var(--encre);border-color:#2b2b31}
.sombre .cherche button:hover{background:#26262c}
.sombre .langues{background:#17171b}
.sombre .langues a.on{background:#2a2a30;color:#ff5a68;box-shadow:none}
.sombre .rond{background:#17171b;border-color:#2b2b31;color:var(--encre)}
.sombre .rond:hover{background:#24242a}
.sombre .onglets a{background:#17171b;color:#e6e6ea}
.sombre .onglets a:hover{background:#24242a}
.sombre .onglets a.on{background:#f6f6f8;color:#0a0a0c}
.sombre .onglets a.on small{color:#55555c}
.sombre .bt--doux{background:#1d1d22;color:var(--encre)}
.sombre .bt--doux:hover{background:#2a2a30}
.sombre .puces a{background:#141418;border-color:#2b2b31}
.sombre .fiche,.sombre .filtres select,.sombre .cherche--grand select{background:#141418;color:var(--encre);border-color:#2b2b31}
.sombre .prix{background:rgba(240,196,90,.12);border-color:rgba(240,196,90,.35);color:#f3d27f}
.sombre .prix--r2{background:rgba(200,205,215,.12);border-color:rgba(200,205,215,.35);color:#dfe3ea}
.sombre .prix--r3{background:rgba(205,127,60,.14);border-color:rgba(205,127,60,.4);color:#e9a06a}
.sombre .prix--public{background:rgba(227,6,27,.16);border-color:rgba(255,90,104,.45);color:#ff8a94}
.sombre .prix--special{background:rgba(120,140,255,.14);border-color:rgba(140,160,255,.4);color:#b9c4ff}
.sombre .carte__img,.sombre .suite__img,.sombre .carte-liste__img{background:#16161a}
.sombre .carte-liste__img{box-shadow:6px -6px 0 -1px #2a2a30,12px -12px 0 -2px #1d1d22}
.sombre .suite a:hover,.sombre .suite li.on a{background:#17171b}
.sombre .chiffres{border-color:#1c1c21}
.sombre .lecteur{box-shadow:0 20px 60px rgba(0,0,0,.6)}
.sombre .bloc__h h2,.sombre .bandeau h1{color:var(--encre)}

.bt--blanc{background:#fff;color:#0a0a0c}
.bt--blanc:hover{background:#e8e8ec}
.bt--verre{background:rgba(110,110,120,.42);color:#fff;backdrop-filter:blur(8px)}
.bt--verre:hover{background:rgba(140,140,150,.55)}
.etiq{border:1px solid currentColor;border-radius:4px;padding:0 5px;font-size:.85em;opacity:.85}

/* --- Accueil : bandeau plein écran -------------------------------------- */
.accueil .tete{position:fixed;inset-inline:0;top:0;background:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,0));border-bottom:0;backdrop-filter:none;transition:background .3s}
.accueil .tete.solide{background:rgba(10,10,12,.96);backdrop-filter:blur(10px)}
.accueil .page{width:100%;padding:0}
.rangees{width:var(--page);margin:-90px auto 0;position:relative;z-index:2;padding-bottom:40px}
.vedette{position:relative;height:min(86vh,820px);min-height:520px;overflow:hidden;background:#000}
.vedette__diapo{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s}
.vedette__diapo.on{opacity:1;visibility:visible;transition:opacity .9s ease}
.vedette__fond{position:absolute;inset:0}
.vedette__fond img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 9s ease-out}
.vedette__diapo.on .vedette__fond img{transform:scale(1)}
.vedette__fond::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(10,10,12,.95) 0%,rgba(10,10,12,.72) 34%,rgba(10,10,12,.1) 70%),
             linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,0) 32%)}
.rtl .vedette__fond::after{background:linear-gradient(270deg,rgba(10,10,12,.95) 0%,rgba(10,10,12,.72) 34%,rgba(10,10,12,.1) 70%),linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,0) 32%)}
.vedette__txt{position:absolute;inset-inline-start:max(16px,calc((100% - 1480px)/2));bottom:150px;width:min(620px,calc(100% - 32px));color:#fff}
.vedette__txt .sur{color:#ff5a68}
.vedette__txt h2{color:#fff;font-size:clamp(34px,5.2vw,72px);font-weight:800;line-height:1.05;margin:6px 0 10px;letter-spacing:-.02em;text-shadow:0 4px 30px rgba(0,0,0,.5)}
.rtl .vedette__txt h2,.vedette__txt h2[dir=rtl]{letter-spacing:0;font-family:Cairo;line-height:1.3}
.vedette__aut{font-size:18px;color:#e9e9ee;margin:0 0 8px;font-weight:600}
.vedette__meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;color:#cfcfd6;font-size:14px;margin:0 0 12px}
.vedette__meta i{font-style:normal;opacity:.5}
.vedette__meta b{color:#46d369;font-weight:800}
.vedette__prix{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.vedette__syn{color:#e2e2e7;font-size:16px;line-height:1.7;margin:0 0 20px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:560px}
.vedette__bts{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.vedette__pts{position:absolute;bottom:118px;inset-inline-end:max(16px,calc((100% - 1480px)/2));display:flex;gap:8px;z-index:3}
.vedette__pts button{width:26px;height:4px;border-radius:2px;border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0;transition:width .3s,background .3s}
.vedette__pts button.on{width:44px;background:#e3061b}

/* --- Rangées et cartes « streaming » -------------------------------------- */
.sombre .rangee__h h2{font-size:22px;color:#fff}
.sombre .rangee__piste{padding:10px 4px 26px;margin:-10px -4px 0;scrollbar-width:none}
.sombre .rangee__piste::-webkit-scrollbar{display:none}
.carte{position:relative;transition:transform .28s cubic-bezier(.2,.7,.2,1),z-index 0s .28s}
.carte__info{position:absolute;top:8px;inset-inline-end:8px;width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(255,255,255,.75);
  background:rgba(10,10,12,.55);color:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .2s;z-index:2}
.carte__info .ic{width:18px;height:18px}
.carte__meta{display:none;margin:6px 0 0;font-size:12px;color:var(--doux);flex-wrap:wrap;gap:4px 6px;align-items:center}
.carte__meta i{font-style:normal;opacity:.5}
.carte__meta b{color:#46d369}
@media (hover:hover){
  .sombre .carte:hover,.sombre .carte:focus-within{transform:scale(1.07);z-index:5;transition:transform .28s cubic-bezier(.2,.7,.2,1)}
  .sombre .carte:hover .carte__img{box-shadow:0 18px 40px rgba(0,0,0,.65)}
  .carte:hover .carte__info,.carte:focus-within .carte__info{opacity:1}
  .sombre .carte:hover .carte__meta{display:flex}
}
.carte__info:focus-visible{opacity:1}
/* Télécommande / clavier : le focus se voit comme le survol (prépare l'app Android TV). */
.sombre .carte__img:focus-visible{outline:3px solid #fff;outline-offset:3px}
.sombre .carte:focus-within .carte__meta{display:flex}

/* Podium : grands chiffres de rang */
.rangee--podium .rangee__piste{grid-auto-columns:calc((100% - 3*16px)/3.6)}
.podium{display:grid;grid-template-columns:auto 1fr;align-items:center;min-width:0}
.podium__n{font-size:clamp(90px,10vw,170px);font-weight:800;line-height:.8;color:#0a0a0c;-webkit-text-stroke:3px #f0c45a;letter-spacing:-.06em;margin-inline-end:-18px;z-index:0;font-family:Manrope,sans-serif}
.podium .carte{z-index:1}

/* Tuiles pays / langues */
.rangee__piste--tuiles{grid-auto-columns:minmax(150px,170px)}
.tuile{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px;border-radius:14px;background:linear-gradient(145deg,#1a1a1f,#111114);border:1px solid #25252b;transition:border-color .2s,transform .2s}
.tuile:hover,.tuile:focus-visible{border-color:#e3061b;transform:translateY(-3px)}
.tuile__g{font-size:34px;line-height:1.1}
.tuile__l{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:#e3061b;color:#fff;font-size:17px;font-weight:800}
.tuile__n{font-weight:800;color:#fff}
.tuile__c{font-size:12px;color:var(--doux)}

/* Fenêtre « Plus d'infos » */
.modale{width:min(920px,calc(100% - 24px));max-height:calc(100vh - 40px);padding:0;border:0;border-radius:18px;background:#141418;color:var(--texte);box-shadow:0 30px 90px rgba(0,0,0,.7);overflow:auto}
.modale::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(3px)}
.modale__x{position:absolute;top:12px;inset-inline-end:12px;z-index:3;font-size:16px}
.fiche-m__img{position:relative;aspect-ratio:16/9;background:#000}
.fiche-m__img img{width:100%;height:100%;object-fit:cover}
.fiche-m__img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#141418 0%,rgba(20,20,24,0) 45%)}
.fiche-m__play{position:absolute;inset:0;margin:auto;width:76px;height:76px;border-radius:50%;background:rgba(227,6,27,.92);color:#fff;display:grid;place-items:center;z-index:2;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.fiche-m__play .ic{width:34px;height:34px;margin-inline-start:4px}
.fiche-m__txt{padding:0 28px 28px;margin-top:-30px;position:relative;z-index:2}
.fiche-m__txt h2{font-size:clamp(24px,3vw,36px);color:#fff;font-weight:800;margin-bottom:4px}
.fiche-m__aut{margin:0 0 10px;font-weight:700;color:#e9e9ee}
.fiche-m__syn{line-height:1.8;color:#dcdce2;margin:0 0 16px}
.fiche-m__dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px 20px;margin:0 0 18px}
.fiche-m__dl dt{font-size:12px;color:var(--doux);font-weight:700}
.fiche-m__dl dd{margin:2px 0 0;color:#fff;font-weight:600}

.chiffres{margin-top:30px}
@media (max-width:980px){
  .vedette{height:78vh;min-height:480px}
  .vedette__txt{bottom:110px}
  .vedette__pts{bottom:84px}
  .rangees{margin-top:-60px}
  .rangee--podium .rangee__piste{grid-auto-columns:calc((100% - 14px)/1.6)}
}
@media (max-width:720px){
  .accueil .tete{position:sticky;background:rgba(10,10,12,.96)}
  .vedette{height:auto;min-height:0;aspect-ratio:auto}
  .vedette__diapo{position:relative;display:none}
  .vedette__diapo.on{display:block}
  .vedette__fond{position:relative;aspect-ratio:16/10}
  .vedette__fond::after{background:linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,0) 60%)}
  .vedette__txt{position:relative;inset:auto;bottom:auto;width:auto;padding:0 16px 20px;margin-top:-40px}
  .vedette__txt h2{font-size:32px}
  .vedette__pts{position:static;justify-content:center;padding-bottom:10px}
  .rangees{margin-top:0}
  .rangee--podium .rangee__piste{grid-auto-columns:78%}
  .podium__n{font-size:90px}
  .fiche-m__txt{padding:0 18px 22px}
}

/* ==========================================================================
   Mise en page « télévision » : rail d'icônes à gauche, bandeau dont le texte est
   aligné sur le bord, rangée « À ne pas manquer » posée sur le bas du bandeau.
   ========================================================================== */
.rail{display:none}
@media (min-width:981px){
  .sombre{--rail:76px}
  .rail{display:flex;flex-direction:column;justify-content:center;gap:6px;position:fixed;inset-block:0;inset-inline-start:0;width:var(--rail);z-index:40;
    background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.92) 70%,rgba(0,0,0,0));padding:90px 0 20px;transition:width .25s ease}
  .rtl .rail{background:linear-gradient(270deg,#000 0%,rgba(0,0,0,.92) 70%,rgba(0,0,0,0))}
  .rail a{position:relative;display:flex;align-items:center;gap:16px;height:52px;padding-inline-start:26px;color:#b9b9c1;white-space:nowrap;overflow:hidden}
  .rail a .ic{width:24px;height:24px;flex:none}
  .rail a span{opacity:0;transition:opacity .2s;font-weight:700}
  .rail:hover,.rail:focus-within{width:240px;background:rgba(0,0,0,.96)}
  .rail:hover a span,.rail:focus-within a span{opacity:1}
  .rail a:hover,.rail a:focus-visible{color:#fff;outline:0}
  .rail a:focus-visible{background:rgba(255,255,255,.08)}
  .rail a.on{color:#fff}
  .rail a.on::before{content:"";position:absolute;inset-inline-start:0;top:8px;bottom:8px;width:4px;border-radius:0 3px 3px 0;background:#e3061b}
  body.sombre{padding-inline-start:var(--rail)}
  .sombre .onglets{display:none}
  .accueil .tete{inset-inline-start:var(--rail)}
  html{overflow-x:hidden}
}

/* Texte du bandeau aligné sur le bord de lecture, même pour un titre arabe en interface latine. */
.vedette__txt h2,.vedette__txt p{text-align:start}
.ltr .vedette__txt h2,.ltr .vedette__syn,.ltr .vedette__aut{text-align:left}
.rtl .vedette__txt h2,.rtl .vedette__syn,.rtl .vedette__aut{text-align:right}
.vedette__txt h2 bdi,.vedette__syn bdi{unicode-bidi:isolate}

/* Bandeau plus haut, texte dans le tiers supérieur, rangée « À ne pas manquer » en bas */
.vedette{height:min(100vh,940px);min-height:640px}
.vedette__txt{top:clamp(110px,16vh,170px);bottom:auto}
.vedette__fond img{object-position:center 30%}
.vedette__fond::after{background:linear-gradient(90deg,rgba(10,10,12,.96) 0%,rgba(10,10,12,.78) 30%,rgba(10,10,12,.08) 66%),
  linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,.85) 24%,rgba(10,10,12,0) 52%)}
.rtl .vedette__fond::after{background:linear-gradient(270deg,rgba(10,10,12,.96) 0%,rgba(10,10,12,.78) 30%,rgba(10,10,12,.08) 66%),
  linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,.85) 24%,rgba(10,10,12,0) 52%)}
.vedette__pts{top:clamp(110px,16vh,170px);bottom:auto}
.vedette__rangee{position:absolute;inset-inline:0;bottom:18px;z-index:4;width:var(--page);margin:auto}
.vedette__rt{font-size:22px;color:#fff;font-weight:800;margin:0 0 10px}
.rangee__piste--une{grid-auto-columns:calc((100% - 4*16px)/5.2)!important}
.une-c{position:relative;border-radius:12px;transition:transform .3s}
.une-c .carte__txt{opacity:.75;transition:opacity .3s}
.une-c.on{transform:translateY(-6px)}
.une-c.on .carte__img{outline:4px solid #fff;outline-offset:0;box-shadow:0 16px 40px rgba(0,0,0,.7)}
.une-c.on .carte__txt{opacity:1}
.une-c.on .carte__t{background:#fff;color:#0a0a0c;border-radius:0 0 8px 8px;padding:6px 10px;margin-top:-10px}
.une-c.on .carte__t a{color:#0a0a0c}
.rangees{margin-top:10px}

/* Rangées : un peu plus de cartes visibles, défilement automatique doux */
.sombre .rangee__piste{grid-auto-columns:calc((100% - 5*14px)/6);gap:14px;scroll-behavior:smooth}
.sombre .rangee__piste--tuiles{grid-auto-columns:minmax(150px,170px)}

@media (max-width:1200px){.sombre .rangee__piste{grid-auto-columns:calc((100% - 3*14px)/4.3)}.rangee__piste--une{grid-auto-columns:calc((100% - 3*14px)/4.2)!important}}
@media (max-width:980px){
  .sombre .rangee__piste,.rangee__piste--une{grid-auto-columns:calc((100% - 2*14px)/3.2)!important}
  .vedette{height:min(92vh,860px)}
}
@media (max-width:720px){
  .rail{display:flex;position:fixed;inset-inline:0;bottom:0;z-index:40;justify-content:space-around;background:rgba(10,10,12,.97);border-top:1px solid #1d1d22;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .rail a{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;color:#a3a3ab;padding:4px 2px;min-width:0}
  .rail a .ic{width:22px;height:22px}
  .rail a span{max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rail a.on{color:#fff}
  .rail a:nth-child(n+6){display:none}
  .sombre .pied{padding-bottom:70px}
  .vedette{height:auto}
  .vedette__txt{position:relative;top:auto}
  .vedette__pts{position:static}
  .vedette__rangee{position:relative;bottom:auto;padding-bottom:6px}
  .sombre .rangee__piste,.rangee__piste--une{grid-auto-columns:62%!important}
}
@media (prefers-reduced-motion:reduce){.sombre .rangee__piste{scroll-behavior:auto}}

/* ==========================================================================
   Respiration (retour client « trop encombré ») : bandeau en flux (texte puis
   rangée), espacements plus généreux, pastilles de prix sur une ligne.
   ========================================================================== */
.tete__in{height:78px;gap:22px}
.accueil .tete{padding-top:6px}
.vedette{display:grid;grid-template-rows:1fr auto;height:auto;min-height:min(100vh,1000px)}
.vedette__diapo{position:static;grid-area:1/1;min-width:0}
.vedette__fond{position:absolute;inset:0;z-index:0}
.vedette__txt{position:relative;inset:auto;top:auto;bottom:auto;z-index:2;align-self:center;
  width:min(640px,calc(100% - 32px));margin-inline-start:max(16px,calc((100% - 1480px)/2));
  padding:150px 0 56px}
.vedette__txt .sur{margin-bottom:16px}
.vedette__txt h2{margin:0 0 18px}
.vedette__aut{margin:0 0 14px}
.vedette__meta{margin:0 0 18px;gap:8px 12px}
.vedette__prix{margin:0 0 22px;gap:10px}
.vedette__syn{margin:0 0 34px;line-height:1.85}
.vedette__bts{gap:16px}
.vedette__pts{position:static;inset:auto;display:flex;gap:8px}
.vedette__rangee{position:relative;grid-area:2/1;bottom:auto;padding:12px 0 30px}
.vedette__rh{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px}
.vedette__rt{margin:0}
.rangees{margin-top:26px}
.sombre .rangee{margin:46px 0 10px}
.sombre .rangee__h{margin-bottom:16px}
.sombre .rangee__piste{gap:22px;grid-auto-columns:calc((100% - 5*22px)/5.6)}
.rangee__piste--une{gap:22px!important;grid-auto-columns:calc((100% - 4*22px)/5.2)!important}
.carte__txt{padding:14px 2px 6px}
.carte__t{line-height:1.45}
.carte__m{margin-top:8px}
.carte__p{margin-top:10px}
.carte .prix{max-width:100%;white-space:nowrap;overflow:hidden}
.carte .prix span{overflow:hidden;text-overflow:ellipsis}
.sombre .carte:hover .carte__meta,.sombre .carte:focus-within .carte__meta{display:none}
.une-c.on .carte__t{margin-top:-14px;padding:8px 12px}
@media (min-width:1700px){.sombre .rangee__piste{grid-auto-columns:calc((100% - 6*22px)/6.6)}}
@media (max-width:1200px){.sombre .rangee__piste{grid-auto-columns:calc((100% - 3*22px)/4.2)}}
@media (max-width:980px){.sombre .rangee__piste,.rangee__piste--une{grid-auto-columns:calc((100% - 2*18px)/3.1)!important;gap:18px!important}.vedette__txt{padding-top:120px}}
@media (max-width:720px){
  .vedette{min-height:0}
  .vedette__diapo.on{display:block}
  .vedette__fond{position:relative;inset:auto}
  .vedette__txt{padding:0 0 28px;margin-top:-30px;width:auto;margin-inline:16px}
  .vedette__txt h2{margin-bottom:12px}
  .vedette__syn{margin-bottom:24px}
  .sombre .rangee__piste,.rangee__piste--une{grid-auto-columns:64%!important;gap:14px!important}
  .tete__in{height:auto}
}
.vedette{grid-template-columns:minmax(0,1fr)}
.sombre .rangee--podium .rangee__piste{grid-auto-columns:calc((100% - 3*22px)/3.7)}
.podium__n{margin-inline-end:-14px}
@media (max-width:980px){.sombre .rangee--podium .rangee__piste{grid-auto-columns:calc((100% - 22px)/1.7)}}
@media (max-width:720px){.sombre .rangee--podium .rangee__piste{grid-auto-columns:80%}}
@media (max-width:720px){
  .sombre .tete__menu{display:none}
  .tete__in{gap:12px;padding:12px 0}
  .tete__in .langues{margin-inline-start:auto}
  .tete__in .cherche{margin-top:2px}
}

/* ==========================================================================
   Fiche film : panneau plein écran (texte côté début, image qui se fond côté fin),
   onglets, rangées liées.
   ========================================================================== */
.film-page .page{width:100%;padding:0}
.film{position:relative;min-height:min(84vh,820px);display:flex;align-items:center;background:#0a0a0c;overflow:hidden}
.film__media{position:absolute;inset-block:0;inset-inline-end:0;width:64%}
.film__image{position:absolute;inset:0}
.film__image img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.film__image::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,#0a0a0c 0%,rgba(10,10,12,.82) 16%,rgba(10,10,12,.25) 46%,rgba(10,10,12,0) 70%),
             linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,0) 26%)}
.rtl .film__image::after{background:linear-gradient(270deg,#0a0a0c 0%,rgba(10,10,12,.82) 16%,rgba(10,10,12,.25) 46%,rgba(10,10,12,0) 70%),linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,0) 26%)}
.film__play{position:absolute;inset:0;margin:auto;width:84px;height:84px;border-radius:50%;background:rgba(227,6,27,.9);color:#fff;display:grid;place-items:center;z-index:2;
  box-shadow:0 12px 40px rgba(0,0,0,.55);transition:transform .2s}
.film__play:hover,.film__play:focus-visible{transform:scale(1.08)}
.film__play .ic{width:36px;height:36px;margin-inline-start:5px}
.film__lecteur{position:absolute;inset:6% 4% 6% 0;margin:auto;aspect-ratio:16/9;height:auto;max-height:88%;border-radius:14px;z-index:3}
.rtl .film__lecteur{inset:6% 0 6% 4%}
.film__lecteur[hidden],.film__image[hidden]{display:none}
.film__txt{position:relative;z-index:2;width:min(560px,40%);margin-inline-start:max(32px,calc((100% - 1480px)/2));padding:150px 0 70px;color:#fff}
.film__txt .sur{color:#ff5a68;margin-bottom:16px}
.film__txt h1{font-size:clamp(36px,4.6vw,68px);font-weight:800;line-height:1.08;color:#fff;margin:0 0 20px;letter-spacing:-.02em;text-shadow:0 4px 30px rgba(0,0,0,.5)}
.ltr .film__txt h1,.ltr .film__syn{text-align:left}
.rtl .film__txt h1{letter-spacing:0;line-height:1.3;font-family:Cairo}
.film__txt .vedette__meta{margin:0 0 18px}
.film__prix{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-size:19px;font-weight:800;color:#f3d27f}
.film__prix .ic{width:26px;height:26px;flex:none}
.film__syn{font-size:16px;line-height:1.85;color:#e2e2e7;margin:0 0 30px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.film__bts{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:0 0 32px}
.rond--film{width:48px;height:48px;border:2px solid rgba(255,255,255,.55)!important;background:rgba(20,20,24,.6)!important;color:#fff!important}
.rond--film:hover,.rond--film:focus-visible{border-color:#fff!important;background:rgba(255,255,255,.12)!important}
.film__lignes{margin:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.film__lignes div{display:flex;flex-wrap:wrap;gap:6px}
.film__lignes dt{color:var(--doux)}
.film__lignes dd{margin:0;color:#ededf1}
.film__lignes a:hover{color:#ff5a68}

.onglets-film{display:flex;gap:34px;width:var(--page);margin:0 auto;border-bottom:1px solid #222228;padding:0 2px}
.onglets-film button{position:relative;background:none;border:0;color:#a9a9b1;font:inherit;font-weight:800;font-size:16px;padding:16px 0;cursor:pointer;letter-spacing:.02em}
.ltr .onglets-film button{text-transform:uppercase;font-size:14px;letter-spacing:.08em}
.onglets-film button:hover{color:#fff}
.onglets-film button.on{color:#fff}
.onglets-film button.on::after{content:"";position:absolute;inset-inline:0;bottom:-1px;height:4px;border-radius:3px 3px 0 0;background:#e3061b}
.film__panneaux{width:var(--page);margin:0 auto;padding:34px 0 10px}
.film__panneau[hidden]{display:none}
.film__pres{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:48px}
.film__pres h2{font-size:18px;color:#fff;margin:0 0 12px}
.film__pres h2:not(:first-child){margin-top:26px}
.film__syn-long{line-height:1.95;color:#dcdce2;margin:0;font-size:16px}
.film__credits{display:grid;gap:16px;margin:0;align-content:start}
.film__credits dt{font-size:12px;color:var(--doux);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.rtl .film__credits dt{text-transform:none;letter-spacing:0;font-size:13px}
.film__credits dd{margin:4px 0 0;color:#fff;font-weight:600}
.film__credits dd a:hover{color:#ff5a68}
.film__credits--grand{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:22px 36px}
.film__rangees{width:var(--page);margin:0 auto;padding-bottom:40px}

@media (max-width:980px){
  .film{display:block;min-height:0}
  .film__media{position:relative;width:100%;aspect-ratio:16/9;inset:auto}
  .film__image::after{background:linear-gradient(0deg,#0a0a0c 0%,rgba(10,10,12,0) 45%)!important}
  .film__lecteur,.rtl .film__lecteur{position:absolute;inset:0;max-height:none;border-radius:0}
  .film__txt{width:auto;margin:-40px 16px 0;padding:0 0 32px}
  .film__pres{grid-template-columns:1fr;gap:28px}
}
@media (max-width:720px){
  .film__txt h1{font-size:32px}
  .film__prix{font-size:16px}
  .onglets-film{gap:22px;overflow-x:auto;scrollbar-width:none}
  .onglets-film button{white-space:nowrap}
}
.film__txt{width:min(620px,44%)}
.film__bts{gap:12px}
.film__syn-long{text-align:start}
@media (max-width:980px){.film__txt{width:auto}}
@media (min-width:981px){
  .film--lecture .film__media{width:54%}
  .film--lecture .film__lecteur{inset:0;margin:auto;width:calc(100% - 40px);height:auto;max-height:86%}
  .film--lecture .film__txt{width:min(560px,40%)}
}
.film__image::after{inset:-2px}

/* Logo animé en boucle continue (cycle de 12 s, demande client « animation continue »). */
.lv__fivs{animation:lvb-fivs 12s cubic-bezier(.4,0,.2,1) infinite}
.lv__barre{animation:lvb-barre 12s cubic-bezier(.4,0,.2,1) infinite}
.lv__mot{animation:lvb-mot 12s cubic-bezier(.4,0,.2,1) infinite}
.lv__badge{animation:lvb-badge 12s cubic-bezier(.4,0,.2,1) infinite}
.lv__badge::after{animation:lvb-onde 12s ease-out infinite}
.marque:hover .lv__badge{animation:lvb-badge 12s cubic-bezier(.4,0,.2,1) infinite}
@keyframes lvb-fivs{
  0%{opacity:.35;transform:translateY(14%)} 7%,90%{opacity:1;transform:none} 100%{opacity:.35;transform:translateY(14%)}}
@keyframes lvb-barre{
  0%,3%{transform:scaleY(0)} 10%,86%{transform:scaleY(1)} 94%,100%{transform:scaleY(0)}}
@keyframes lvb-mot{
  0%,7%{clip-path:inset(0 100% 0 0);opacity:.3} 18%,82%{clip-path:inset(0 0 0 0);opacity:1}
  92%{clip-path:inset(0 0 0 100%);opacity:.3} 92.01%,100%{clip-path:inset(0 100% 0 0);opacity:.3}}
@keyframes lvb-badge{
  0%,12%{transform:scale(0) rotate(-120deg)} 19%{transform:scale(1.12) rotate(0)} 22%{transform:scale(1)}
  40%{transform:scale(1)} 43%{transform:scale(1.14)} 46%{transform:scale(.97)} 49%{transform:scale(1)}
  64%{transform:scale(1)} 67%{transform:scale(1.14)} 70%{transform:scale(.97)} 73%,86%{transform:scale(1)}
  95%,100%{transform:scale(0) rotate(120deg)}}
@keyframes lvb-onde{
  0%,42%{opacity:0;transform:scale(1)} 43%{opacity:.6;transform:scale(1)} 53%{opacity:0;transform:scale(2.3)}
  66%{opacity:0;transform:scale(1)} 67%{opacity:.6;transform:scale(1)} 77%,100%{opacity:0;transform:scale(2.3)}}
@media (prefers-reduced-motion:reduce){.lv *,.lv__badge::after{animation:none!important;transform:none!important;clip-path:none!important;opacity:1!important}}

/* Lecture plein écran */
.ecran{position:fixed;inset:0;z-index:1000;background:#000;display:grid;place-items:center;width:100vw;height:100vh;height:100dvh}
.ecran__boite{position:relative;width:min(100vw,calc(100vh * 16 / 9));width:min(100vw,calc(100dvh * 16 / 9));aspect-ratio:16/9;max-height:100%}
.ecran__boite iframe,.ecran__boite video{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.ecran__x{position:absolute;top:max(14px,env(safe-area-inset-top));inset-inline-end:16px;z-index:2;width:48px;height:48px;border-radius:50%;
  border:2px solid rgba(255,255,255,.7);background:rgba(20,20,24,.7);color:#fff;font-size:20px;cursor:pointer;display:grid;place-items:center}
.ecran__x:hover,.ecran__x:focus-visible{background:#e3061b;border-color:#e3061b;outline:0}
html.ecran-ouvert,html.ecran-ouvert body{overflow:hidden}
.ecran__x{-webkit-appearance:none;appearance:none;padding:0;line-height:1;border-radius:50%!important}
.ecran__lecteur{position:absolute;inset:0;display:grid;place-items:center}
.ecran__lecteur > div,.ecran__lecteur iframe{width:100%!important;height:100%!important}
.ecran__lecteur .fb-video,.ecran__lecteur .fb-video span{width:100%!important;max-height:100%}
.ecran__lecteur .fb-video iframe{max-height:100vh}
.ecran__son{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));inset-inline-start:50%;transform:translateX(-50%);z-index:3;
  -webkit-appearance:none;appearance:none;border:0;border-radius:999px;background:#fff;color:#0a0a0c;font:inherit;font-weight:800;font-size:17px;padding:14px 26px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.rtl .ecran__son{transform:translateX(50%)}
.ecran__son:hover,.ecran__son:focus-visible{background:#e3061b;color:#fff;outline:0}