/* Rail de navigation. Structure inspirée de sparki.be, habillage aux jetons.
   Aucune valeur de couleur, de rayon ni d'espacement n'est écrite ici. */

.saut{position:absolute;left:var(--e-4);top:var(--e-4);z-index:calc(var(--z-rail) + 1);
  transform:translateY(-200%);background:var(--c-blanc);color:var(--c-ancre);
  padding:var(--e-3) var(--e-4);border-radius:var(--r-action);text-decoration:none;
  font-weight:var(--g-600)}
.saut:focus{transform:translateY(0)}

.rail{position:sticky;top:0;z-index:var(--z-rail);
  --rail-fond:var(--c-enbro); --rail-vif:var(--c-enbro-vif)}
.rail--earth{--rail-fond:var(--c-earth); --rail-vif:var(--c-earth-vif)}

/* ── Onglets de segment : au-dessus, l'actif se solidarise à la barre ── */
.segments{background:var(--c-papier)}
.segments ul{display:flex;gap:var(--e-1);margin:0;padding:0 var(--e-7);list-style:none}
.segments a{display:flex;align-items:center;height:var(--rail-onglet-h);
  padding:0 var(--e-5);text-decoration:none;font-size:var(--t-annexe);
  font-weight:var(--g-500);color:var(--c-ancre);
  border-radius:var(--r-media) var(--r-media) var(--r-nul) var(--r-nul)}
.segments a:hover{color:var(--rail-fond)}
.segments a[aria-current="page"]{background:var(--rail-fond);color:var(--c-blanc)}
.segments a:focus-visible{outline:var(--b-epais) solid var(--c-ancre);outline-offset:calc(var(--e-1) * -1)}

/* ── Barre ─────────────────────────────────────────────────── */
.barre{display:flex;align-items:center;gap:var(--e-6);
  min-height:var(--rail-h);padding-inline:var(--e-7);
  background:var(--rail-fond);color:var(--c-blanc)}

.marque-rail{display:flex;align-items:center;gap:var(--e-4);
  margin-inline-end:auto}
.marque-rail__nom{display:flex;align-items:center}
.marque-rail__nom img{display:block;height:var(--rail-logo-h);width:auto}
.marque-rail__soeur{font-size:var(--t-annexe);text-decoration:none;
  color:color-mix(in srgb,var(--c-blanc) 82%,transparent);
  border-bottom:var(--b-fin) solid color-mix(in srgb,var(--c-blanc) 40%,transparent)}
.marque-rail__soeur::before{content:"&";margin-inline-end:var(--e-2);
  border:0;color:color-mix(in srgb,var(--c-blanc) 60%,transparent)}
.marque-rail__soeur:hover{color:var(--c-blanc);border-bottom-color:var(--c-blanc)}
.marque-rail__nom:focus-visible,.marque-rail__soeur:focus-visible{
  outline:var(--b-epais) solid var(--c-blanc);outline-offset:var(--e-2)}

.rubriques{display:flex;align-items:center;gap:var(--e-2);margin:0;padding:0;list-style:none}
.rubrique{position:static}
.rubrique__titre{display:inline-flex;align-items:center;gap:var(--e-2);
  height:var(--rail-h);padding-inline:var(--e-3);
  background:none;border:0;border-bottom:var(--b-epais) solid transparent;
  font:inherit;font-weight:var(--g-500);color:var(--c-blanc);cursor:pointer}
.rubrique__titre:hover{border-bottom-color:var(--rail-vif)}
.rubrique__titre[aria-expanded="true"]{border-bottom-color:var(--c-blanc)}
.chevron{width:.5em;height:.5em;border-right:var(--b-fin) solid currentColor;
  border-bottom:var(--b-fin) solid currentColor;transform:rotate(45deg) translate(-15%,-15%);
  transition:transform var(--d-court) var(--courbe)}
.rubrique__titre[aria-expanded="true"] .chevron{transform:rotate(225deg) translate(-15%,-15%)}

.aide{color:var(--c-blanc);text-decoration:none;font-weight:var(--g-500);
  border-bottom:var(--b-fin) solid color-mix(in srgb,var(--c-blanc) 40%,transparent)}
.aide:hover{border-bottom-color:var(--c-blanc)}

.action{background:var(--c-blanc);color:var(--rail-fond);
  padding:var(--e-3) var(--e-5);border-radius:var(--r-action);
  text-decoration:none;font-weight:var(--g-600);white-space:nowrap}
.action:hover{background:var(--c-papier)}
.action__court{display:none}

.rubrique__titre:focus-visible,.aide:focus-visible,.action:focus-visible,
.burger:focus-visible{outline:var(--b-epais) solid var(--c-blanc);outline-offset:var(--e-1)}

/* ── Méga-menu ─────────────────────────────────────────────── */
.mega{display:none;position:absolute;inset-inline-start:0;inset-block-start:100%;
  width:100%;z-index:var(--z-mega);
  background:var(--c-papier);color:var(--c-ancre);
  border-block-end:var(--b-epais) solid var(--rail-fond)}
.rubrique__titre[aria-expanded="true"] + .mega{display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,18rem);gap:var(--e-7);
  padding:var(--e-6) var(--e-7) var(--e-7);
  max-width:var(--mega-largeur);margin-inline:auto}
.mega__liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--e-2) var(--e-6);margin:0;padding:0;list-style:none}
.mega__liste a{display:block;padding:var(--e-3);text-decoration:none;color:inherit;
  border-radius:var(--r-media);border-inline-start:var(--b-epais) solid transparent}
.mega__liste a:hover{background:var(--c-blanc);border-inline-start-color:var(--rail-fond)}
.mega__liste a:focus-visible{outline:var(--b-epais) solid var(--rail-fond);outline-offset:var(--e-1)}
.mega__nom{display:block;font-weight:var(--g-600)}
.mega__desc{display:block;font-size:var(--t-annexe);line-height:var(--i-corps);
  color:color-mix(in srgb,var(--c-ancre) 74%,transparent);max-width:38ch}

.mega__encart{border-inline-start:var(--b-fin) solid var(--c-trait);padding-inline-start:var(--e-5)}
.mega__encart-titre{font-size:var(--t-h3);line-height:var(--i-titre);margin-block-end:var(--e-4)}
.mega__encart-lien{color:var(--rail-fond);font-weight:var(--g-600);text-decoration:none;
  border-bottom:var(--b-epais) solid var(--rail-vif)}
.mega__encart-lien:hover{border-bottom-color:var(--rail-fond)}
.mega__encart-lien:focus-visible{outline:var(--b-epais) solid var(--rail-fond);outline-offset:var(--e-2)}

/* ── Menu court ────────────────────────────────────────────── */
.burger{display:none;align-items:center;gap:var(--e-3);height:var(--rail-h);
  background:none;border:0;font:inherit;font-weight:var(--g-500);
  color:var(--c-blanc);cursor:pointer}
.burger__trait{width:1.25rem;height:var(--b-epais);background:currentColor;
  position:relative}
.burger__trait::before,.burger__trait::after{content:"";position:absolute;
  inset-inline:0;height:var(--b-epais);background:currentColor}
.burger__trait::before{top:calc(var(--e-2) * -1)}
.burger__trait::after{top:var(--e-2)}

@media (max-width:64rem){
  .segments ul,.barre{padding-inline:var(--e-5)}
  .aide{display:none}
  .burger{display:inline-flex}
  .rubriques{display:none;position:absolute;inset-inline:0;inset-block-start:100%;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--c-papier);color:var(--c-ancre);
    border-block-end:var(--b-epais) solid var(--rail-fond)}
  .barre:has(.burger[aria-expanded="true"]) .rubriques{display:flex}
  .rubrique__titre{width:100%;justify-content:space-between;color:var(--c-ancre);
    height:auto;padding:var(--e-4) var(--e-5);
    border-bottom:var(--b-fin) solid var(--c-trait)}
  .rubrique__titre:focus-visible{outline-color:var(--c-ancre)}
  .mega{position:static;border-block-end:0}
  .rubrique__titre[aria-expanded="true"] + .mega{grid-template-columns:1fr;
    padding:var(--e-4) var(--e-5) var(--e-5);gap:var(--e-5)}
  .mega__liste{grid-template-columns:1fr}
  .mega__encart{border-inline-start:0;border-block-start:var(--b-fin) solid var(--c-trait);
    padding-inline-start:0;padding-block-start:var(--e-4)}
}
@media (max-width:40rem){
  .segments ul{overflow-x:auto;scrollbar-width:none}
  .segments a{padding-inline:var(--e-4);white-space:nowrap}
  .barre{gap:var(--e-4);padding-inline:var(--e-4)}
  .action{padding-inline:var(--e-4);font-size:var(--t-annexe)}
  .marque-rail__soeur{display:none}
  /* l'intitulé du menu court passe en nom accessible du bouton */
  .burger__texte{position:absolute;width:1px;height:1px;overflow:hidden;
    clip-path:inset(50%);white-space:nowrap}
}
/* très petits téléphones : l'action garde son sens en moins de mots */
@media (max-width:26rem){
  .barre{gap:var(--e-3);padding-inline:var(--e-3)}
  .marque-rail{gap:var(--e-2)}
  .marque-rail__nom img{height:calc(var(--rail-logo-h) * .8)}
  .action__long{position:absolute;width:1px;height:1px;overflow:hidden;
    clip-path:inset(50%);white-space:nowrap}
  .action__court{display:inline}
}