/* ==========================================================================
   Pluvori — système du site de présentation
   Version 1.9 — 16/10/2026 (sélecteur de langue en haut de page) ;
   1.8 : 12/10/2026 (césure des intertitres limitée aux mots d’au moins 10 lettres) ; 1.7 : 12/10/2026 (césure limitée à l’allemand sur les pages légales, intertitres) ; 1.6 : 12/10/2026 ; 1.5 : 06/10/2026 ; 1.4 à 1.0 : 30 et 29/09/2026
   Mobile d'abord. Un point de rupture : 1024 px (navigation visible,
   jetons ordinateur, grille de 12 colonnes). Aucune ressource tierce.
   Polices : SIL Open Font License 1.1, hébergées sur le même domaine.
   ========================================================================== */

/* --- 1. Polices ----------------------------------------------------------- */
@font-face{font-family:'Schibsted Grotesk';src:url(polices/schibstedgrotesk.woff2) format('woff2');font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:'Source Serif 4';src:url(polices/sourceserif4.woff2) format('woff2');font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:'Source Serif 4';src:url(polices/sourceserif4-italic.woff2) format('woff2');font-weight:200 900;font-style:italic;font-display:swap}

/* --- 2. Jetons (mobile) --------------------------------------------------- */
:root{
--couleur-papier:#edeae1;
--couleur-encre:#1c1917;
--couleur-encre-secondaire:#4b4741;
--couleur-filet:#dcd8cd;
--couleur-blanc:#ffffff;
--police-titre:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
--police-texte:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
--police-extrait:'Source Serif 4',Georgia,'Times New Roman',serif;
--graisse-texte:400;
--graisse-lien:600;
--graisse-accent:700;
--graisse-intertitre:800;
--graisse-titre:850;
--espace-4:4px;--espace-8:8px;--espace-12:12px;--espace-16:16px;--espace-20:20px;--espace-24:24px;--espace-32:32px;--espace-40:40px;--espace-48:48px;--espace-56:56px;--espace-64:64px;--espace-72:72px;
--arrondi:6px;
--arrondi-focus:2px;
--filet-fin:1px solid var(--couleur-encre);
--filet-fort:3px solid var(--couleur-encre);
--filet-discret:1px solid var(--couleur-filet);
--bordure-controle:1px solid var(--couleur-encre-secondaire);
--bordure-a-fournir:1px dashed var(--couleur-encre-secondaire);
--focus-epaisseur:3px;
--focus-decalage:3px;
--cible-min:44px;
--marge-laterale:16px;
--mesure:620px;
--largeur-max:1440px;
--hauteur-entete:64px;
--hauteur-marque:24px;
--hauteur-marque-pied:22px;
--taille-surtitre:15px;
--taille-titre:46px;--interligne-titre:0.98;
--taille-titre-legal:46px;
--taille-chapeau:20px;
--taille-intertitre:34px;
--taille-titre-encadre:32px;
--taille-texte:17px;--interligne-texte:1.55;
--taille-texte-encadre:17px;
--taille-signature:28px;
--taille-signature-fonction:19px;
--taille-extrait:18px;--interligne-extrait:1.6;
--taille-sujet:22px;
--taille-titre-extrait:24px;
--taille-citation:21px;
--taille-texte-appuye:20px;
--taille-numero:64px;
--taille-legende:15px;
--taille-pied:15px;
--taille-nav:16px;
--taille-bouton:17px;
--taille-bouton-compact:15px;
--taille-menu-mobile:30px;
}

/* --- 3. Base -------------------------------------------------------------- */
.page{margin:0;background:var(--couleur-papier);color:var(--couleur-encre);font-family:var(--police-texte);font-weight:var(--graisse-texte);font-size:var(--taille-texte);line-height:var(--interligne-texte);display:flex;flex-direction:column;box-sizing:border-box;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-kerning:normal}
.page *{box-sizing:border-box}
.page p,.page h1,.page h2,.page h3,.page ol,.page ul,.page blockquote{margin:0}
.page ul,.page ol{list-style:none;padding:0}
.page p{text-wrap:pretty}
.section>p,.section__corps>p,.chapeau,.fiche-agent>p,.encadre>p,.encadre--trait,.extrait,.etape,.page-legale>*{max-width:var(--mesure)}
.page a{color:inherit}
.page [id]{scroll-margin-top:var(--espace-24)}
.page a:focus-visible,.page button:focus-visible{outline:var(--focus-epaisseur) solid var(--couleur-encre);outline-offset:var(--focus-decalage);border-radius:var(--arrondi-focus)}
.lien-texte,.section__corps p a,.encadre p a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.lien-texte:hover,.section__corps p a:hover,.encadre p a:hover{text-decoration-thickness:2px}
.lien-texte:active,.section__corps p a:active,.encadre p a:active{text-decoration-thickness:3px}
.lien-evitement{position:absolute;left:var(--espace-16);top:-80px;background:var(--couleur-encre);color:var(--couleur-blanc) !important;padding:var(--espace-12) var(--espace-16);font-weight:var(--graisse-lien)}
.lien-evitement:focus{top:var(--espace-12)}

/* --- 4. Rôles typographiques ---------------------------------------------- */
.surtitre{font-family:var(--police-texte);font-size:var(--taille-surtitre);font-weight:var(--graisse-accent);line-height:1.3}
.titre{font-family:var(--police-titre);font-size:var(--taille-titre);font-weight:var(--graisse-titre);line-height:var(--interligne-titre);letter-spacing:-0.035em;text-wrap:balance}
.titre--legal{font-size:var(--taille-titre-legal)}
.chapeau{font-size:var(--taille-chapeau);line-height:1.45;text-wrap:pretty}
.intertitre{font-family:var(--police-titre);font-size:var(--taille-intertitre);font-weight:var(--graisse-intertitre);line-height:1.12;letter-spacing:-0.025em;text-wrap:balance}
/* Intertitre : un mot plus long que sa colonne (288 px à 1024 px) se coupe au lieu de recouvrir le texte voisin. Toutes langues.
   hyphenate-limit-chars 10 4 4 : césure réservée aux mots d’au moins 10 lettres, 4 lettres au moins de part et d’autre du tiret,
   pour ne pas couper les mots courts qui tiennent dans la colonne. Ignorée sans erreur là où elle n’est pas reconnue. */
.intertitre{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;-webkit-hyphenate-limit-chars:10 4 4;hyphenate-limit-chars:10 4 4}
.texte-appuye{font-size:var(--taille-texte-appuye);font-weight:var(--graisse-intertitre);line-height:1.35;letter-spacing:-0.01em}
.note-citation{font-family:var(--police-extrait);font-style:italic;font-size:var(--taille-citation);line-height:1.45}

/* --- 5. Composants -------------------------------------------------------- */
/* En-tête */
.entete{display:flex;align-items:center;gap:var(--espace-12);padding:0 var(--marge-laterale);min-height:var(--hauteur-entete);border-bottom:var(--filet-fort)}
.entete__marque{display:flex;align-items:center;min-height:var(--cible-min)}
.entete__marque img{height:var(--hauteur-marque);width:auto;display:block}
.entete__nav{display:none;gap:var(--espace-24);margin-left:auto}
.entete__nav a,.menu-mobile__lien{text-decoration:none}
.entete__nav a{font-size:var(--taille-nav);font-weight:var(--graisse-lien);display:flex;align-items:center;min-height:var(--cible-min)}
.entete__nav a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.entete__nav a:active{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px}
.entete__nav a[aria-current=page]{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:8px}
.entete__menu{margin-left:auto}
/* Menu mobile */
.menu-mobile{display:flex;flex-direction:column;padding:var(--espace-8) var(--marge-laterale) var(--espace-32)}
.menu-mobile[hidden]{display:none}
.menu-mobile__lien{font-family:var(--police-titre);font-weight:var(--graisse-intertitre);font-size:var(--taille-menu-mobile);letter-spacing:-0.02em;min-height:64px;display:flex;align-items:center;border-bottom:var(--filet-fin)}
.menu-mobile__lien:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:8px}
.menu-mobile__lien:active{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:8px}
.menu-mobile__lien[aria-current=page]{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:8px}
/* Bouton principal */
.bouton{display:inline-flex;align-items:center;justify-content:center;background:var(--couleur-encre);color:var(--couleur-blanc) !important;border:1px solid var(--couleur-encre);font-family:var(--police-texte);font-weight:var(--graisse-accent);font-size:var(--taille-bouton);line-height:1.3;text-decoration:none;text-align:center;border-radius:var(--arrondi);padding:var(--espace-12) var(--espace-24);min-height:52px}
.bouton:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.bouton:active{background:var(--couleur-papier);color:var(--couleur-encre) !important}
.bouton--compact{font-size:var(--taille-bouton-compact);min-height:var(--cible-min);padding:0 var(--espace-16);white-space:nowrap}
/* Bouton secondaire (Menu / Fermer) */
.bouton-secondaire{font-family:var(--police-texte);font-size:var(--taille-nav);font-weight:var(--graisse-lien);color:var(--couleur-encre);background:transparent;border:var(--bordure-controle);border-radius:var(--arrondi);min-height:var(--cible-min);padding:0 var(--espace-12);cursor:pointer}
.bouton-secondaire:hover{border-color:var(--couleur-encre)}
.bouton-secondaire:active{background:var(--couleur-filet)}
/* Lien fléché */
.lien-fleche{font-weight:var(--graisse-lien);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;display:inline-flex;align-items:center;min-height:var(--cible-min)}
.lien-fleche:hover{text-decoration-thickness:2px}
.lien-fleche:active{text-decoration-thickness:3px}
/* Appel à l'action */
.appel{display:flex;flex-direction:column;gap:var(--espace-12);align-items:flex-start;margin-top:var(--espace-8)}
.appel__engagement{font-size:var(--taille-legende);color:var(--couleur-encre-secondaire);line-height:1.45}
/* La une */
.une{padding:var(--espace-24) var(--marge-laterale) var(--espace-48);display:flex;flex-direction:column;gap:var(--espace-20)}
/* Section de page */
.section{padding:var(--espace-48) var(--marge-laterale);display:flex;flex-direction:column;gap:var(--espace-20);border-top:var(--filet-fort)}
.section__corps{display:flex;flex-direction:column;gap:var(--espace-20)}
/* Démonstration et colonne d'extrait */
.sujet{display:flex;flex-direction:column;gap:var(--espace-8);font-weight:var(--graisse-accent)}
.sujet__texte{font-family:var(--police-extrait);font-weight:600;font-size:var(--taille-sujet);line-height:1.3;letter-spacing:-0.005em;text-wrap:balance}
.extraits{display:flex;flex-direction:column;gap:var(--espace-32);margin-top:var(--espace-12)}
.colonne-extrait{display:flex;flex-direction:column;gap:var(--espace-12);border-top:var(--filet-fin);padding-top:var(--espace-16)}
.extrait{display:flex;flex-direction:column;gap:var(--espace-16);font-family:var(--police-extrait);font-size:var(--taille-extrait);line-height:var(--interligne-extrait)}
.extrait__chapeau{font-style:italic;padding-bottom:var(--espace-16);border-bottom:var(--filet-fin)}
.extrait__titre{font-weight:var(--graisse-accent);font-size:var(--taille-titre-extrait);line-height:1.15;letter-spacing:-0.01em;text-wrap:balance}
/* Signature d'agent et fiche d'agent */
.signature{font-family:var(--police-titre);font-weight:var(--graisse-titre);font-size:var(--taille-signature);line-height:1.2;letter-spacing:-0.02em}
.signature__nom{display:block}
.signature__fonction{display:block;margin-top:var(--espace-4);font-family:var(--police-extrait);font-weight:400;font-style:italic;font-size:var(--taille-signature-fonction);letter-spacing:0}
.fiches{display:flex;flex-direction:column;gap:var(--espace-32)}
.fiche-agent{display:flex;flex-direction:column;gap:var(--espace-8);border-top:var(--filet-fin);padding-top:var(--espace-16)}
/* Étapes */
.etapes{display:flex;flex-direction:column;gap:var(--espace-24);counter-reset:etape}
.etape{display:flex;flex-direction:column;gap:var(--espace-8);counter-increment:etape}
.etape::before{content:counter(etape);display:block;font-family:var(--police-titre);font-weight:var(--graisse-titre);font-size:var(--taille-numero);line-height:1;letter-spacing:-0.04em}
.etape strong{font-weight:var(--graisse-intertitre)}
.parcours{counter-reset:parcours}
.parcours>li{counter-increment:parcours}
.parcours>li>.section>.intertitre::before{content:counter(parcours);display:block;font-weight:var(--graisse-titre);font-size:var(--taille-numero);line-height:0.9;letter-spacing:-0.04em;margin-bottom:var(--espace-12)}
/* Encadré */
.encadre{display:flex;flex-direction:column;gap:var(--espace-16);padding:var(--espace-24) var(--espace-20);border-top:var(--filet-fort);font-size:var(--taille-texte-encadre)}
.encadre__titre{font-family:var(--police-titre);font-weight:var(--graisse-titre);font-size:var(--taille-titre-encadre);line-height:1.02;letter-spacing:-0.025em;text-wrap:balance}
.encadre--fort{background:var(--couleur-encre);color:var(--couleur-papier);border-top:0}
.encadre--fort a:focus-visible,.encadre--fort button:focus-visible{outline-color:var(--couleur-papier)}
.encadre--large{padding:var(--espace-40) var(--marge-laterale)}
.encadre--trait{display:block;border:var(--filet-fin);border-radius:var(--arrondi);background:var(--couleur-papier);padding:var(--espace-20)}
.encadre--trait strong{font-weight:var(--graisse-intertitre)}
.facons{display:flex;flex-direction:column;gap:var(--espace-16)}
.garanties{display:flex;flex-direction:column;gap:var(--espace-16);padding:var(--espace-8) var(--marge-laterale) var(--espace-16)}
/* Conclusion (appel à l'action de fin de page) */
.conclusion{padding:var(--espace-48) var(--marge-laterale) var(--espace-64);border-top:var(--filet-fort);display:flex;flex-direction:column;gap:var(--espace-24);align-items:flex-start}
.conclusion__citation{font-family:var(--police-extrait);font-style:italic;font-size:var(--taille-citation);line-height:1.4;max-width:30em}
/* Emplacement « À FOURNIR » */
.a-fournir{font-family:var(--police-texte);font-size:16px;font-weight:var(--graisse-lien);line-height:1.45;color:var(--couleur-encre-secondaire);border:var(--bordure-a-fournir);border-radius:var(--arrondi);padding:var(--espace-12) var(--espace-16);background:var(--couleur-blanc)}
span.a-fournir{display:inline;padding:var(--espace-4) var(--espace-8);-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:1.9}
/* Gabarit de page légale */
.page-legale{padding:var(--espace-8) var(--marge-laterale) var(--espace-64);display:flex;flex-direction:column;gap:var(--espace-16)}
.page-legale h2{font-family:var(--police-titre);font-weight:var(--graisse-intertitre);font-size:var(--taille-texte-appuye);line-height:1.25;margin-top:var(--espace-24)}
.page-legale>h2:first-child{margin-top:0}
.page-legale>.squelette{margin-top:var(--espace-16)}
.page-legale ul{list-style:disc;padding-left:var(--espace-20)}
.page-legale li+li{margin-top:var(--espace-8)}
/* Pages en allemand uniquement (:lang(de)) : les mots composés dépassent la colonne de 358 px à 390 px.
   Les autres langues gardent le rendu de la 1.5.
   1. Titre de page légale : un mot plus long que la colonne se coupe au lieu de déborder */
:lang(de) .titre--legal{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
/* 2. Cellules des tableaux des pages légales : « anywhere » réduit aussi la largeur minimale des cellules,
   sans quoi le tableau ne rétrécit pas faute de césure */
:lang(de) .page-legale th,:lang(de) .page-legale td{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto}
.squelette{display:flex;flex-direction:column;gap:var(--espace-12)}
.squelette i{display:block;height:12px;background:var(--couleur-filet);border-radius:var(--arrondi-focus)}
.squelette__titre{height:28px !important;width:55%;margin-top:var(--espace-20)}
.squelette__ligne{width:100%}
.squelette__ligne--moyenne{width:92%}
.squelette__ligne--courte{width:70%}
.squelette__puce-ligne{display:flex;gap:var(--espace-12);align-items:center}
.squelette__puce-ligne b{width:8px;height:8px;border-radius:50%;background:var(--couleur-filet);flex:none}
.squelette__puce-ligne i{flex:1}
/* Pied de page */
.pied{padding:var(--espace-40) var(--marge-laterale) var(--espace-48);display:flex;flex-direction:column;gap:var(--espace-20);font-size:var(--taille-pied);line-height:1.5;border-top:var(--filet-fort);margin-top:auto}
.pied__devise{display:flex;align-items:center;gap:var(--espace-12);flex-wrap:wrap}
.pied__devise img{height:var(--hauteur-marque-pied);width:auto;display:block}
.pied ul{display:flex;flex-wrap:wrap;column-gap:var(--espace-24)}
.pied ul a{display:inline-flex;min-height:var(--cible-min);align-items:center;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.pied a:hover{text-decoration-thickness:2px}
.pied a:active{text-decoration-thickness:3px}
.pied__contact a{text-underline-offset:4px}
/* Sélecteur de langue : bande au-dessus de l’en-tête (nav.langues), placée après le lien d’évitement.
   Cinq langues, toujours dans le même ordre, chacune nommée dans sa langue. La langue courante
   (aria-current="true") se distingue par la graisse et l’absence de soulignement, pas par la couleur.
   Corps du pied de page, cibles de 44 px au moins. Focus : règle .page a:focus-visible (section 3). */
.langues{display:flex;justify-content:flex-end;padding:0 var(--marge-laterale);border-bottom:var(--filet-discret);font-size:var(--taille-pied);line-height:1.5}
.langues ul{display:flex;flex-wrap:wrap;column-gap:var(--espace-16)}
.langues a{display:inline-flex;align-items:center;min-height:var(--cible-min);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.langues a:hover{text-decoration-thickness:2px}
.langues a:active{text-decoration-thickness:3px}
.langues a[aria-current=true]{font-weight:var(--graisse-accent);text-decoration:none}

/* --- 6. Rupture 1024 px : navigation visible, jetons ordinateur, grille ---- */
@media (min-width: 1024px){
.entete{gap:var(--espace-40)}
.entete__nav{display:flex}
.entete__menu{display:none}
.menu-mobile{display:none}
:root{--marge-laterale:56px;--hauteur-entete:84px;--hauteur-marque:30px;--taille-surtitre:17px;--taille-titre:112px;--interligne-titre:0.94;--taille-titre-legal:72px;--taille-chapeau:26px;--taille-intertitre:56px;--taille-titre-encadre:44px;--taille-texte:18px;--taille-texte-encadre:18px;--taille-signature:34px;--taille-signature-fonction:20px;--taille-sujet:28px;--taille-titre-extrait:26px;--taille-citation:24px;--taille-texte-appuye:22px;--taille-numero:96px;--taille-bouton:18px}
.une{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24);row-gap:var(--espace-32);padding:var(--espace-40) var(--marge-laterale) var(--espace-72)}
.une>.surtitre,.une>.titre{grid-column:1 / span 12}
.une>.chapeau{grid-column:1 / span 7}
.une>.appel{grid-column:8 / span 5;margin-top:var(--espace-4);padding-left:var(--espace-24)}
.une>.ligne-lien{grid-column:1 / span 12}
.section{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24);row-gap:var(--espace-24);padding:var(--espace-64) var(--marge-laterale)}
.section>*{grid-column:5 / span 8}
.section>.intertitre{grid-column:1 / span 4;grid-row:1}
.section>.appel{max-width:var(--mesure)}
.demonstration>.intertitre{grid-row:1 / span 2}
.demonstration>.sujet{max-width:760px}
.demonstration>.extraits{grid-column:1 / span 12;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--espace-24);margin-top:var(--espace-16)}
.trois-temps>.intertitre{grid-column:1 / span 8}
.trois-temps>.etapes{grid-column:1 / span 12;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--espace-24);margin-top:var(--espace-16)}
.trois-temps .etape{border-top:var(--filet-fin);padding-top:var(--espace-16)}
.encadre--large{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24);row-gap:var(--espace-16);padding:var(--espace-64) var(--marge-laterale)}
.encadre--large>*{grid-column:5 / span 7}
.encadre--large>.encadre__titre{grid-column:1 / span 4;grid-row:1 / span 5}
.garanties{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24);row-gap:var(--espace-24);padding:var(--espace-8) var(--marge-laterale) var(--espace-24)}
.garanties>.encadre{grid-column:1 / span 12;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24);row-gap:var(--espace-16);padding:var(--espace-40) 0}
.garanties>.encadre>*{grid-column:5 / span 7}
.garanties>.encadre>.encadre__titre{grid-column:1 / span 4;grid-row:1 / span 3}
.garanties>.encadre--fort{grid-column:span 6;display:flex;padding:var(--espace-40) var(--espace-40) var(--espace-48);min-height:320px}
.fiches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--espace-32);row-gap:var(--espace-40)}
.facons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--espace-24)}
.conclusion{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24);padding:var(--espace-72) var(--marge-laterale)}
.conclusion>*{grid-column:5 / span 8;justify-self:start}
.page-legale{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24)}
.page-legale>*{grid-column:5 / span 7}
.pied{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--espace-24)}
.pied__devise{grid-column:1 / span 5}
.pied>nav{grid-column:6 / span 7;justify-self:end}
.pied__contact{grid-column:1 / span 12}
}

/* --- 7. Mouvement --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
.page *,.page *::before,.page *::after{transition:none !important;animation:none !important;scroll-behavior:auto !important}
}

/* Tableaux des pages légales — patch du site, validé par le porteur au point d'arrêt C le 01/10/2026.
   Jetons existants uniquement. Voir docs/MODIFICATIONS-CSS.md. */
.page-legale table{width:100%;border-collapse:collapse;font-size:var(--taille-pied);line-height:1.45}
.page-legale th,.page-legale td{text-align:left;vertical-align:top;padding:var(--espace-12) var(--espace-12) var(--espace-12) 0;border-bottom:var(--filet-discret)}
.page-legale th{font-weight:var(--graisse-accent);border-bottom:var(--filet-fin)}