/* =========================================================================
   Registre Public — couche de marque 2026.

   Cette feuille est chargee APRES le <style> inline de chaque page. A
   specificite egale, c'est donc elle qui gagne : on rebrande sans toucher aux
   structures ni renommer une seule classe.

   Elle fait deux choses :
   1. Elle redefinit les anciennes variables (--flame, --callout, --line...)
      avec les valeurs de la nouvelle identite. Tout ce qui utilise var()
      bascule sans etre modifie.
   2. Elle reprend le chrome commun a toutes les familles de pages
      (header/.nav/.logo, .card, .callout, .btn, .cta, tableaux, footer) et
      l'aligne sur les fiches.

   Trois regles a ne pas casser :
   - page creme, surfaces blanches, separation par REMPLISSAGE et non par
     ombre ou bordure ;
   - tous les angles ronds, pilule pour ce qui est cliquable ;
   - le marine est reserve aux ACTIONS. Aucun bandeau ni decor ne le consomme.
   ========================================================================= */
:root{
  --ink:#161721; --ink2:#4B4F5C; --ink3:#767B89; --ink4:#9BA0AD;
  --line:#DFDBD0; --line2:#EBE8DF; --line-strong:#DFDBD0;
  --blue:#1F2E67; --blue2:#2E4189;
  --page:#F0EEE7; --surface:#fff; --surface2:#F0EEE7;
  --ok:#18753C; --okbg:#E4F5E9;
  --r:20px; --r-in:12px;

  /* anciens noms, nouvelles valeurs */
  --flame:#1F2E67; --flame-deep:#2E4189; --flame-soft:#E7E9F1;
  --callout:#FFFFFF; --paper:#F0EEE7; --sheet:#FFFFFF;
  --ink-2:#4B4F5C; --ink-3:#767B89; --ok-bg:#E4F5E9;
  --warn:#B34000;
}

body{background:var(--page);color:var(--ink);line-height:1.55}
/* Les liens de contenu restent soulignes (lisibilite), mais en marine sombre. */
a{color:var(--blue)}

/* ---------- en-tete : filet marine, convention institutionnelle ---------- */
header{background:var(--surface);border-top:4px solid var(--blue);
  border-bottom:1px solid var(--line)}
.nav{height:62px}
/* Mot-symbole monochrome : le marine etant sombre, un "Public" bleu sur un
   "Registre" noir ne se distinguerait plus. */
.logo{color:var(--blue);font-weight:760;font-size:1.16rem;letter-spacing:-.028em}
.logo em{font-style:normal;font-weight:550;color:var(--blue)}
.navlink{color:var(--ink2);text-decoration:none;font-weight:550}
.navlink:hover{color:var(--blue)}

/* ---------- actions : pilule, remplissage, jamais d'ombre ---------- */
.btn,.cta,.btn-soft{border-radius:99px;text-decoration:none;font-weight:640;
  transition:background .16s,color .16s}
.btn,.cta{background:var(--blue);color:#fff;padding:12px 22px}
.btn:hover,.cta:hover{background:var(--blue2);color:#fff}
/* Le bouton secondaire vit sur du creme : il contraste par le blanc. */
.btn-soft{background:var(--surface);color:var(--blue);padding:11px 20px}
.btn-soft:hover{background:var(--blue);color:#fff}

/* ---------- surfaces : blanches, arrondies, sans trait ---------- */
.card,.callout,.sheet,.box,.panel{background:var(--surface);border:none;border-radius:var(--r)}
.callout{border-left:none;padding:20px 24px;margin:22px 0}
.callout p:last-child{margin-bottom:0}
.card{padding:22px 24px}

/* Le fil d'ariane et la ligne de fraicheur sont ambiants : ni bandeau, ni accent. */
.crumb{color:var(--ink4);font-size:.8rem;margin:22px 0 0}
.crumb a{color:var(--ink4);text-decoration:none}
.crumb a:hover{color:var(--ink2)}
.maj{color:var(--ink4);font-size:.8rem;margin-bottom:22px}

/* ---------- tableaux : filets internes seulement ---------- */
table{border-collapse:collapse;background:var(--surface);border-radius:var(--r);overflow:hidden}
th,td{border:none;border-bottom:1px solid var(--line2);padding:11px 16px;color:var(--ink2)}
th{background:var(--surface);color:var(--ink);font-weight:650}
tr:last-child td{border-bottom:none}
td b{color:var(--ink)}

/* ---------- indicateurs ---------- */
/* Enfants DIRECTS uniquement : les cellules contiennent elles-memes des div
   (.n et .l), qu'un selecteur descendant separerait d'un filet parasite. */
.kpi{gap:0;background:var(--surface);border:none;border-radius:var(--r);overflow:hidden;margin:22px 0}
.kpi > div{background:var(--surface);padding:18px 20px;border:none}
.kpi > div + div{border-left:1px solid var(--line2)}
@media(max-width:640px){.kpi > div + div{border-left:none;border-top:1px solid var(--line2)}}
.kpi > div > div{padding:0;border:none;background:none}
.kpi .n{color:var(--ink);font-weight:790;letter-spacing:-.03em}
.kpi .l{color:var(--ink3);font-size:.79rem}

/* ---------- listes de resultats et pagination ---------- */
.result-list,.liste,.rows{background:var(--surface);border:none;border-radius:var(--r);overflow:hidden}
.pager a,.pager span{border-radius:99px;text-decoration:none;padding:8px 15px;font-size:.86rem}
.pager a{background:var(--surface);color:var(--blue)}
.pager a:hover{background:var(--blue);color:#fff}
.pager .cur{background:var(--blue);color:#fff}

.badge{border-radius:99px;padding:3px 11px;font-size:.7rem;font-weight:600}

/* ---------- pied de page marine ---------- */
footer{background:var(--blue);color:rgb(255 255 255/.68);border-top:none;
  padding:32px 0 44px;margin-top:52px;font-size:.82rem;line-height:1.7}
footer b{color:#fff;font-weight:650}
footer a{color:rgb(255 255 255/.82);text-decoration:underline;text-underline-offset:2px}
footer a:hover{color:#fff}


/* Sur petit ecran, le rembourrage confortable des cellules faisait deborder les
   tableaux a plusieurs colonnes de quelques pixels : la page defilait
   horizontalement. On resserre, et les noms longs peuvent se couper. */
@media (max-width:600px){
  th,td{padding:10px 11px}
  td a{overflow-wrap:anywhere}
}

/* Pied de page colle en bas sur les pages courtes : sans ca, une bande creme
   apparait sous le marine quand le contenu ne remplit pas l'ecran. */
body{min-height:100vh;display:flex;flex-direction:column}
body > footer{margin-top:auto}