/* Les pages légales (mentions, confidentialité, conditions) : le jour de la page d'accueil,
   et la nuit du film en mode sombre (préférence du système, ou le choix fait sur le site). */
@font-face{ font-family:'Clash Display'; src:url('../../app/polices/clash-600.woff2') format('woff2'); font-weight:600; font-display:swap }
@font-face{ font-family:'Switzer'; src:url('../../app/polices/switzer-400.woff2') format('woff2'); font-weight:400; font-display:swap }
@font-face{ font-family:'Switzer'; src:url('../../app/polices/switzer-500.woff2') format('woff2'); font-weight:500; font-display:swap }
@font-face{ font-family:'Switzer'; src:url('../../app/polices/switzer-600.woff2') format('woff2'); font-weight:600; font-display:swap }

:root{
  --fond:#ECEBE6; --carte:#F7F7F4; --encre:#1C2127; --encre-2:rgba(28,33,39,.76); --encre-3:rgba(28,33,39,.62);
  --filet:rgba(28,33,39,.12); --accent:#005FFB; --lien:#0047D6; --manque:#B0503C; --manque-fond:rgba(176,80,60,.1);
  color-scheme:light;
}
html[data-theme="nuit"]{
  --fond:#0D1422; --carte:#152036; --encre:#EEF0EA; --encre-2:rgba(238,240,234,.8); --encre-3:rgba(238,240,234,.64);
  --filet:rgba(238,240,234,.12); --lien:#6FA6FF; --manque:#F0A08A; --manque-fond:rgba(240,160,138,.12);
  color-scheme:dark;
}
*{ box-sizing:border-box }
body{ margin:0; background:var(--fond); color:var(--encre); font:400 17px/1.7 'Switzer', system-ui, sans-serif; -webkit-font-smoothing:antialiased }
a{ color:var(--lien); text-underline-offset:3px }
.haut{ width:min(820px, 100% - 40px); margin:0 auto; padding:26px 0 0; display:flex; align-items:center; justify-content:space-between; gap:16px }
.logo{ display:inline-flex; align-items:center; gap:10px; color:var(--encre); text-decoration:none; font:600 19px/1 'Clash Display', system-ui, sans-serif }
.logo img{ width:30px; height:30px }
.theme{ border:1px solid var(--filet); background:transparent; color:var(--encre-2); border-radius:999px; min-height:44px; padding:0 16px; font:500 14px/1 'Switzer', sans-serif; cursor:pointer }
main{ width:min(820px, 100% - 40px); margin:0 auto; padding:56px 0 40px }
h1{ margin:0; font:600 clamp(34px, 5vw, 52px)/1.05 'Clash Display', system-ui, sans-serif; letter-spacing:-.02em; word-spacing:.05em }
.maj{ margin:12px 0 0; color:var(--encre-3); font-size:15px }
.chapo{ margin:22px 0 0; font-size:19px; color:var(--encre-2) }
section{ margin-top:40px; padding-top:28px; border-top:1px solid var(--filet) }
h2{ margin:0 0 10px; font:600 22px/1.25 'Clash Display', system-ui, sans-serif; letter-spacing:-.005em; word-spacing:.08em }
p, li{ color:var(--encre-2) }
p{ margin:10px 0 0 } ul{ margin:10px 0 0; padding-left:22px } li{ margin:6px 0 }
dl{ display:grid; grid-template-columns:minmax(0, 12em) minmax(0, 1fr); gap:10px 22px; margin:14px 0 0; padding:20px 22px; background:var(--carte); border-radius:18px; box-shadow:0 0 0 1px var(--filet) }
dt{ color:var(--encre-3); font-size:15px } dd{ margin:0; color:var(--encre); font-weight:500 }
mark.manque{ background:var(--manque-fond); color:var(--manque); padding:1px 8px; border-radius:6px; font-weight:600 }
.pied{ width:min(820px, 100% - 40px); margin:0 auto; padding:30px 0 60px; display:flex; flex-wrap:wrap; gap:10px 22px; border-top:1px solid var(--filet); font-size:15px }
.pied a[aria-current]{ color:var(--encre); text-decoration:none; font-weight:600 }
@media (max-width:600px){ dl{ grid-template-columns:1fr; gap:2px } dd{ margin-bottom:10px } }