/* ==========================================================================
   Neurodesign · l'éditorial
   Article, territoire, recherche. Chargée sur ces vues uniquement.

   La Home est un spectacle ; ces pages sont un média. Elles en gardent le
   vocabulaire (les mêmes sommaires, la même typographie, le même bleu) mais
   elles obéissent à une autre règle : la lecture d'abord.
   ========================================================================== */

/* Les vues de lecture commencent sous une barre fixe et compacte. Une page
   qui ouvre sur le film, elle, doit commencer exactement en haut : la barre
   y est transparente et passe par-dessus la scène. */
.nd-main{padding-top:68px}
.nd-main:has(.nd-film){padding-top:0}
@media (max-width:980px){ .nd-main{padding-top:60px} }

/* --------------------------------------------------------------------------
   L'ouverture d'un territoire
   Un territoire s'ouvre comme un chapitre : son rang, son nom en grand, sa
   question, et l'image qui la démontre. Le visuel déborde à droite : il fait
   partie de la page, il n'est pas posé dedans.
   -------------------------------------------------------------------------- */
.nd-terr{
  position:relative;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,44%);
  align-items:center;gap:clamp(30px,5vw,80px);
  padding:clamp(56px,9vh,120px) 0 clamp(56px,9vh,120px) var(--nd-gutter);
  /* Le texte tient la colonne de gauche, le visuel déborde à droite : c'est
     aussi l'ordre du DOM, donc l'ordre de lecture. */
  min-height:min(82svh,860px);
  background:linear-gradient(120deg,var(--nd-paper) 0%,var(--nd-lav) 100%);
  overflow:hidden;
}
.nd-terr--simple{grid-template-columns:1fr;padding-right:var(--nd-gutter);min-height:0}

.nd-terr__art{
  margin:0;align-self:stretch;border-radius:20px 0 0 20px;grid-column:2;grid-row:1;
  background:var(--nd-lav) var(--nd-terr-img) center / cover no-repeat;
  box-shadow:0 60px 130px -60px rgba(11,12,20,.6);
  min-height:min(64svh,660px);
}

.nd-terr__body{max-width:60ch;grid-column:1;grid-row:1}
.nd-terr__n{
  margin:0 0 10px;font:500 13px/1 ui-monospace,monospace;
  letter-spacing:.18em;color:var(--nd-blue);
}
.nd-terr__t{
  margin:0;font-weight:800;font-size:clamp(50px,8.4vw,136px);
  line-height:.92;letter-spacing:-.045em;color:var(--nd-ink);
}
.nd-terr__sous{
  margin:16px 0 0;font-weight:700;font-size:clamp(20px,2.5vw,34px);
  letter-spacing:-.02em;color:var(--nd-ink);
}
.nd-terr__intro{margin:22px 0 0;max-width:46ch}
.nd-terr__cles{
  margin:20px 0 0;font-size:13.5px;color:var(--nd-muted);
}
.nd-terr__compte{
  margin:26px 0 0;font:500 12px/1 ui-monospace,monospace;
  letter-spacing:.14em;text-transform:uppercase;color:var(--nd-muted);
}
.nd-terr--simple .nd-search{margin-left:0;max-width:min(620px,100%)}

@media (max-width:980px){
  .nd-terr{
    grid-template-columns:1fr;padding:clamp(40px,7vh,80px) var(--nd-gutter);
    min-height:0;gap:30px;
  }
  .nd-terr__art{grid-column:1;grid-row:1;order:-1;border-radius:16px;min-height:44svh}
  .nd-terr__body{grid-column:1;grid-row:2}
}

/* --------------------------------------------------------------------------
   Le rail des territoires
   Six entrées sur une ligne : la carte complète du site, toujours à portée.
   C'est ce qui fait qu'on lit une bibliothèque et non une liste de catégories.
   -------------------------------------------------------------------------- */
.nd-rail{
  border-block:1px solid var(--nd-line);
  background:var(--nd-paper);
  overflow-x:auto;
  scrollbar-width:none;
}
.nd-rail::-webkit-scrollbar{display:none}
.nd-rail ol{
  list-style:none;margin:0;padding:0 var(--nd-gutter);
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(max-content,1fr);
  min-width:max-content;
}
.nd-rail li + li{border-left:1px solid var(--nd-line)}
.nd-rail a{
  display:flex;align-items:baseline;gap:12px;
  padding:22px clamp(16px,2vw,30px);
  text-decoration:none;color:var(--nd-muted);white-space:nowrap;
  transition:color .35s var(--nd-ease),background-color .35s var(--nd-ease);
}
.nd-rail a:hover{color:var(--nd-ink);background:var(--nd-lav)}
.nd-rail a:focus-visible{outline:2px solid var(--nd-blue);outline-offset:-4px}
.nd-rail__n{font:500 11px/1 ui-monospace,monospace;letter-spacing:.12em;color:var(--nd-blue);opacity:.55}
.nd-rail__t{font-weight:700;font-size:clamp(15px,1.3vw,18px);letter-spacing:-.015em}
.nd-rail__c{font:500 11px/1 ui-monospace,monospace;color:var(--nd-muted)}
/* Le territoire courant est tenu, pas seulement coloré. */
.nd-rail .is-actif a{color:var(--nd-ink);background:var(--nd-lav)}
.nd-rail .is-actif .nd-rail__n{opacity:1}
.nd-rail .is-actif .nd-rail__t{position:relative}
.nd-rail .is-actif .nd-rail__t::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--nd-blue);
}
@media (max-width:760px){
  .nd-rail ol{padding-inline:20px}
  .nd-rail a{padding:18px 16px}
}

/* --------------------------------------------------------------------------
   Le sommaire d'articles
   Une liste, jamais une grille de vignettes : c'est ce qui tient encore
   debout à deux cents articles. L'image n'apparaît qu'au survol, et elle
   reste une image, pas une carte.
   -------------------------------------------------------------------------- */
.nd-band--archive{padding-top:clamp(50px,7vh,90px)}
.nd-index--articles .nd-index__row{position:relative;grid-template-columns:72px 1fr}
.nd-index--articles .nd-index__row a{
  display:grid;grid-template-columns:1fr auto;align-items:baseline;
  column-gap:28px;row-gap:12px;padding:36px 0;
}
.nd-index--articles .nd-index__t{
  grid-column:1 / -1;font-size:clamp(23px,2.8vw,44px);line-height:1.08;
}
.nd-index--articles .nd-index__d{grid-column:1;max-width:52ch}
.nd-index--articles .nd-index__k{grid-column:2;margin-left:0;white-space:nowrap}

.nd-index__vue{
  position:absolute;right:0;top:50%;z-index:2;
  width:150px;height:100px;border-radius:10px;pointer-events:none;
  background:var(--nd-lav) center / cover no-repeat;
  opacity:0;transform:translateY(-50%) translateX(18px) rotate(-3deg) scale(.94);
  transition:opacity .4s var(--nd-ease), transform .55s var(--nd-ease);
  box-shadow:0 30px 60px -34px rgba(11,12,20,.6);
}
@media (hover:hover) and (min-width:1100px){
  /* L'image n'est demandée qu'au survol. Déclarée dans la règle de base, elle
     serait chargée pour chaque ligne de la page, soit douze fichiers pour un
     effet que la plupart des lecteurs ne déclencheront jamais. Un navigateur
     ne va chercher une image de fond que lorsque la règle s'applique. */
  .nd-index--articles .nd-index__row:hover .nd-index__vue{
    background-image:var(--nd-vue);
    opacity:1;transform:translateY(-50%) translateX(0) rotate(-2deg) scale(1);
  }
}
@media (max-width:1099px){ .nd-index__vue{display:none} }
@media (max-width:760px){
  .nd-index--articles .nd-index__row{grid-template-columns:48px 1fr}
  .nd-index--articles .nd-index__row a{grid-template-columns:1fr}
  .nd-index--articles .nd-index__d{display:none}
  .nd-index--articles .nd-index__k{grid-column:1}
}

/* --------------------------------------------------------------------------
   Pagination et état vide
   -------------------------------------------------------------------------- */
.nd-pages{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  margin-top:clamp(40px,6vh,72px);
}
.nd-pages .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:44px;padding:0 14px;border-radius:999px;
  font-size:14.5px;font-weight:600;text-decoration:none;color:var(--nd-ink);
  transition:background-color .3s var(--nd-ease),color .3s var(--nd-ease);
}
.nd-pages .page-numbers:hover{background:var(--nd-lav)}
.nd-pages .page-numbers.current{background:var(--nd-ink);color:#fff}
.nd-pages .page-numbers.dots{min-width:24px;color:var(--nd-muted)}
.nd-pages .page-numbers:focus-visible{outline:2px solid var(--nd-blue);outline-offset:2px}

.nd-vide{padding:clamp(40px,7vh,90px) 0;max-width:52ch}
.nd-vide__t{margin:0 0 12px;font-weight:800;font-size:clamp(24px,3vw,38px);letter-spacing:-.025em}
.nd-vide__d{margin:0;color:var(--nd-muted);font-size:17px;line-height:1.65}
.nd-vide__terr{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 0;padding:0}

/* --------------------------------------------------------------------------
   L'article
   Une colonne, et rien qui la dispute. Les images et les citations peuvent
   en sortir, parce qu'elles ont quelque chose à montrer ; le texte, non.
   -------------------------------------------------------------------------- */
.nd-article{
  /* Mesuré, pas déduit : à cette taille de corps, la colonne tient autour de
     soixante-dix signes par ligne. Au-delà, l'œil perd le début de la ligne
     suivante ; en deçà, il saute trop souvent. */
  --nd-col:680px;
  padding:clamp(46px,8vh,110px) var(--nd-gutter) clamp(50px,8vh,110px);
}
.nd-article > *{max-width:var(--nd-col);margin-inline:auto}

.nd-fil{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  font-size:13px;color:var(--nd-muted);margin-bottom:26px;
}
.nd-fil a{color:var(--nd-muted);text-decoration:none;transition:color .3s var(--nd-ease)}
.nd-fil a:hover{color:var(--nd-ink)}
.nd-fil [aria-current]{color:var(--nd-ink);font-weight:600}

.nd-article__terr{margin:0 0 16px}
.nd-article__terr a{color:inherit;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:2px}
.nd-article__title{
  margin:0;font-weight:800;font-size:clamp(36px,5.2vw,78px);
  line-height:1.02;letter-spacing:-.035em;color:var(--nd-ink);
}
.nd-article__chapo{
  margin:24px 0 0;font-size:clamp(19px,1.7vw,23px);line-height:1.6;
  color:var(--nd-muted);font-weight:500;
}
.nd-article__meta{
  margin:28px 0 0;display:flex;flex-wrap:wrap;gap:10px;
  font:500 12.5px/1 ui-monospace,monospace;letter-spacing:.08em;
  text-transform:uppercase;color:var(--nd-muted);
}

/* La couverture sort de la colonne : c'est la seule image qui a droit à
   toute la largeur avant même que la lecture commence. */
.nd-article__cover{
  max-width:min(1180px,100%);margin:clamp(38px,6vh,70px) auto clamp(34px,5vh,60px);
}
.nd-article__cover img{
  width:100%;height:auto;display:block;border-radius:16px;
  box-shadow:0 50px 100px -60px rgba(11,12,20,.5);
}
.nd-article__cover figcaption,
.nd-article__body figcaption,
.nd-article__body .wp-caption-text{
  margin-top:12px;font-size:13.5px;line-height:1.6;color:var(--nd-muted);
  text-align:left;
}

/* --- Le corps du texte --------------------------------------------------- */
.nd-article__body{
  font-size:clamp(17.5px,1.35vw,19.5px);line-height:1.78;color:#22242F;
}
/* Le rythme vertical du corps : une seule règle, et les éléments qui ont
   besoin de plus la surchargent. Attention à l'ordre de spécificité, un
   « p{margin:0} » placé après annulerait tout. */
.nd-article__body > *{margin-block:0}
.nd-article__body > * + *{margin-top:1.5em}
.nd-article__body h2{
  margin:2.2em 0 .55em;font-weight:800;font-size:clamp(25px,2.8vw,38px);
  line-height:1.14;letter-spacing:-.025em;color:var(--nd-ink);
}
.nd-article__body h3{
  margin:1.9em 0 .45em;font-weight:800;font-size:clamp(20px,2vw,26px);
  line-height:1.22;letter-spacing:-.015em;color:var(--nd-ink);
}
.nd-article__body h4{margin:1.6em 0 .4em;font-weight:700;font-size:1.05em;color:var(--nd-ink)}
.nd-article__body a{
  color:var(--nd-ink);text-decoration:none;
  box-shadow:inset 0 -1.5px 0 var(--nd-blue);
  transition:box-shadow .3s var(--nd-ease),color .3s var(--nd-ease);
}
.nd-article__body a:hover{color:var(--nd-blue);box-shadow:inset 0 -2px 0 var(--nd-blue)}
.nd-article__body a:focus-visible{outline:2px solid var(--nd-blue);outline-offset:3px;border-radius:2px}
.nd-article__body strong{font-weight:700;color:var(--nd-ink)}

.nd-article__body ul,
.nd-article__body ol{padding-left:1.3em}
.nd-article__body li + li{margin-top:.5em}
.nd-article__body ul li::marker{color:var(--nd-blue)}
.nd-article__body ol li::marker{color:var(--nd-blue);font-weight:600}

/* La citation sort à gauche : elle interrompt la lecture, elle doit se voir. */
.nd-article__body blockquote{
  margin:2.2em 0;padding:0 0 0 clamp(18px,3vw,34px);
  border-left:2px solid var(--nd-blue);
  font-weight:600;font-size:clamp(20px,2.1vw,28px);line-height:1.35;
  letter-spacing:-.02em;color:var(--nd-ink);
}
.nd-article__body blockquote p{margin:0}
.nd-article__body blockquote cite{
  display:block;margin-top:14px;font:500 13px/1.5 ui-monospace,monospace;
  font-style:normal;letter-spacing:.06em;color:var(--nd-muted);
}

/* Les images du corps débordent la colonne, jamais le texte. */
.nd-article__body figure,
.nd-article__body .wp-block-image{margin:2.4em 0}
.nd-article__body img{max-width:100%;height:auto;display:block;border-radius:12px}
.nd-article__body .alignwide,
.nd-article__body .wp-block-image.alignwide,
.nd-article__body figure.alignwide{
  width:min(1000px,92vw);margin-inline:calc(50% - min(500px,46vw));
}
.nd-article__body .alignfull,
.nd-article__body .wp-block-image.alignfull{
  width:100vw;margin-inline:calc(50% - 50vw);
}
.nd-article__body .alignfull img{border-radius:0}

.nd-article__body hr{
  border:0;height:1px;background:var(--nd-line);margin:3em 0;
}
.nd-article__body code{
  font:500 .88em/1.5 ui-monospace,monospace;background:var(--nd-lav);
  padding:.15em .4em;border-radius:5px;
}
.nd-article__body pre{
  background:var(--nd-ink);color:#EDEFF9;border-radius:12px;
  padding:22px 24px;overflow-x:auto;font-size:14px;line-height:1.6;
}
.nd-article__body pre code{background:none;padding:0;color:inherit}
.nd-article__body table{
  width:100%;border-collapse:collapse;font-size:.92em;
  display:block;overflow-x:auto;
}
.nd-article__body th,
.nd-article__body td{
  text-align:left;padding:12px 14px;border-bottom:1px solid var(--nd-line);
}
.nd-article__body th{font-weight:700;color:var(--nd-ink)}

.nd-article__tags{
  display:flex;flex-wrap:wrap;gap:9px;
  margin-top:clamp(40px,6vh,70px);padding-top:26px;
  border-top:1px solid var(--nd-line);
}

/* --------------------------------------------------------------------------
   La suite : d'un article à l'autre, d'un territoire à l'autre
   Une page de lecture ne finit jamais sur un cul-de-sac.
   -------------------------------------------------------------------------- */
.nd-suite{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:var(--nd-line);border-block:1px solid var(--nd-line);
  margin-top:clamp(50px,8vh,100px);
}
.nd-suite--terr{margin-top:0}
.nd-suite__lien{
  display:block;background:var(--nd-paper);
  padding:clamp(28px,4vh,48px) var(--nd-gutter);
  text-decoration:none;color:var(--nd-ink);
  transition:background-color .4s var(--nd-ease);
}
.nd-suite__lien:hover{background:var(--nd-lav)}
.nd-suite__lien--suiv{text-align:right;grid-column:2}
.nd-suite__sens{
  display:block;margin-bottom:10px;
  font:500 11px/1 ui-monospace,monospace;letter-spacing:.16em;
  text-transform:uppercase;color:var(--nd-blue);
}
.nd-suite__t{
  display:block;font-weight:700;font-size:clamp(18px,2vw,27px);
  line-height:1.2;letter-spacing:-.02em;
}
.nd-suite__lien:focus-visible{outline:2px solid var(--nd-blue);outline-offset:-4px}
@media (max-width:760px){
  .nd-suite{grid-template-columns:1fr}
  .nd-suite__lien--suiv{text-align:left;grid-column:1}
}

.nd-band--lies{background:var(--nd-lav)}

/* --------------------------------------------------------------------------
   La page Explorer : le même vocabulaire que la Home, sans le film. Chaque
   territoire est une bande, et l'ancre du lien tombe sous l'en-tête fixe.
   -------------------------------------------------------------------------- */
.nd-band--explore-head{padding-top:calc(148px + clamp(60px,8vh,110px))}
.nd-band--explore-head .nd-display{margin:14px 0 22px;font-size:clamp(40px,5.2vw,78px)}
.nd-band--territory{border-top:1px solid var(--nd-line);scroll-margin-top:96px}
.nd-territory__head{max-width:62ch;margin-bottom:clamp(30px,4vh,52px)}
.nd-territory__n{
  font:500 13px/1 ui-monospace,monospace;color:var(--nd-blue);letter-spacing:.14em;margin:0;
}
.nd-territory__head .nd-h2{margin:10px 0 6px}
.nd-territory__sub{font-size:clamp(18px,2vw,26px);font-weight:600;margin:0 0 18px;color:var(--nd-ink)}
/* La porte vers les vrais articles du territoire. Tant que la catégorie
   n'existe pas, le lien reste une ancre dans la page ; le thème le réécrit
   vers l'archive dès qu'elle est là. */
.nd-terr-lien{margin:26px 0 0}


/* Une page de texte : la colonne de lecture d'un article, sans son appareil
   éditorial. Pas de fil d'Ariane, pas de territoire, pas de temps de lecture
   — une page « À propos » n'est pas une publication. */
.nd-page .nd-article__head{margin-bottom:clamp(30px,5vh,56px)}

/* ==========================================================================
   À propos et Contact
   Deux pages composées, dans la grammaire des bandes. Elles n'utilisent pas
   le moteur de la Home : leur relief vient de l'ascenseur, vingt lignes de
   JavaScript dans la coquille qui donnent à chaque élément sa position dans
   l'écran, de -1 à +1. Le CSS en fait une dérive, une échelle, une opacité.
   ========================================================================== */

/* L'ascenseur : une amplitude par élément, jamais la même pour deux plans
   voisins. C'est l'écart entre les vitesses qui fabrique la profondeur. */
[data-nd-lift]{
  --nd-amp:0px;
  transform:translate3d(0, calc(var(--nd-lift, 0) * var(--nd-amp)), 0);
  will-change:transform;
}
.nd-static [data-nd-lift]{transform:none}

/* --------------------------------------------------------------------------
   L'ouverture : le portrait et la phrase
   -------------------------------------------------------------------------- */
.nd-about{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1.24fr) minmax(280px,0.76fr);
  align-items:center;gap:clamp(36px,4vw,72px);
  padding:clamp(70px,11vh,150px) var(--nd-gutter);
  min-height:min(88svh,940px);
  background:radial-gradient(90% 80% at 76% 38%,#FFF 0%,var(--nd-lav) 62%,#E7E9F6 100%);
}
.nd-about__body{position:relative;z-index:2}
/* Deux lignes, pas six : à cette taille, un titre qui passe à la ligne tout
   seul dévore l'écran. La coupe est écrite dans le contenu, la taille est
   calée pour que ces deux lignes tiennent. */
.nd-about__t{
  margin:18px 0 0;font-weight:800;
  font-size:clamp(34px,4.7vw,80px);line-height:.98;letter-spacing:-.04em;
}
.nd-about__sous{
  margin:26px 0 0;max-width:30ch;
  font-weight:600;font-size:clamp(19px,2vw,28px);line-height:1.35;
  letter-spacing:-.02em;color:var(--nd-ink);
}
.nd-about__role{
  margin:30px 0 0;font:500 12.5px/1.7 ui-monospace,monospace;
  letter-spacing:.14em;text-transform:uppercase;color:var(--nd-muted);
}

/* Le portrait : un disque, un halo, et une dérive plus lente que la page.
   Il ne tourne pas, il ne rebondit pas : il flotte, et c'est tout. */
.nd-about__photo{
  position:relative;z-index:1;justify-self:center;
  width:min(92%,460px);aspect-ratio:1;
}
.nd-about__photo img{
  width:100%;height:100%;display:block;border-radius:50%;
  box-shadow:0 60px 120px -50px rgba(11,12,20,.45);
}
.nd-about__photo::before{
  content:"";position:absolute;inset:-14%;border-radius:50%;z-index:-1;
  background:radial-gradient(circle,rgba(2,71,255,.20) 0%,rgba(138,124,255,.12) 45%,transparent 70%);
  filter:blur(24px);
}

@media (max-width:980px){
  .nd-about{grid-template-columns:1fr;text-align:left;min-height:0;gap:36px}
  .nd-about__body{max-width:none}
  .nd-about__photo{order:-1;width:min(66%,300px);justify-self:start}
}

/* --------------------------------------------------------------------------
   Les chiffres : la bande qui monte
   Trois mesures, pas douze. Chacune a sa propre vitesse : c'est ce décalage
   qui donne la sensation d'ascenseur.
   -------------------------------------------------------------------------- */
.nd-band--chiffres{background:var(--nd-paper);overflow:hidden}
.nd-chiffres{
  list-style:none;margin:clamp(34px,5vh,60px) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(26px,4vw,70px);
}
.nd-chiffre{border-top:1.5px solid var(--nd-ink);padding-top:22px}
.nd-chiffre:nth-child(1){--nd-amp:-26px}
.nd-chiffre:nth-child(2){--nd-amp:-54px}
.nd-chiffre:nth-child(3){--nd-amp:-34px}
.nd-chiffre__n{
  margin:0;font-weight:800;font-size:clamp(44px,6.4vw,96px);
  line-height:.94;letter-spacing:-.04em;color:var(--nd-ink);
}
.nd-chiffre__n i{font-style:normal;color:var(--nd-blue)}
.nd-chiffre__d{margin:14px 0 0;color:var(--nd-muted);font-size:16px;line-height:1.6}
@media (max-width:980px){
  .nd-chiffres{grid-template-columns:1fr 1fr;gap:26px 22px}
}
@media (max-width:640px){
  /* Trois mesures côte à côte sur un téléphone, c'est trois nombres qu'on ne
     lit plus. Une par ligne, et chacune garde sa force. */
  .nd-chiffres{grid-template-columns:1fr;gap:30px}
  .nd-chiffre{--nd-amp:0px}
}

/* --------------------------------------------------------------------------
   Le parcours : une colonne, un filet, des paliers
   -------------------------------------------------------------------------- */
.nd-band--parcours{background:var(--nd-lav)}
.nd-parcours{list-style:none;margin:clamp(34px,5vh,64px) 0 0;padding:0;position:relative}
.nd-parcours::before{
  content:"";position:absolute;left:clamp(58px,7vw,110px);top:8px;bottom:8px;width:1.5px;
  background:linear-gradient(180deg,var(--nd-blue),var(--nd-lilas));opacity:.35;
}
.nd-palier{
  display:grid;grid-template-columns:clamp(58px,7vw,110px) 1fr;
  gap:clamp(24px,3vw,52px);padding:clamp(26px,4vh,46px) 0;
  align-items:start;
}
.nd-palier__an{
  font:500 12.5px/1.5 ui-monospace,monospace;letter-spacing:.1em;
  color:var(--nd-blue);padding-top:8px;
}
.nd-palier__c{position:relative;padding-left:clamp(24px,3vw,52px)}
/* Le point sur le filet : c'est lui qui fait l'échelle des paliers. */
.nd-palier__c::before{
  content:"";position:absolute;left:calc(clamp(24px,3vw,52px) / -2 - 4.5px);top:14px;
  width:9px;height:9px;border-radius:50%;background:var(--nd-blue);
  box-shadow:0 0 0 5px var(--nd-lav);
}
.nd-palier__t{
  margin:0;font-weight:800;font-size:clamp(21px,2.4vw,34px);
  line-height:1.15;letter-spacing:-.025em;
}
.nd-palier__l{margin:4px 0 0;font-weight:600;font-size:15.5px;color:var(--nd-blue)}
.nd-palier__d{margin:14px 0 0;color:var(--nd-muted);font-size:16.5px;line-height:1.68;max-width:60ch}
@media (max-width:760px){
  .nd-parcours::before{left:8px}
  .nd-palier{grid-template-columns:1fr;gap:6px}
  .nd-palier__an{padding-top:0;padding-left:30px}
  .nd-palier__c{padding-left:30px}
  .nd-palier__c::before{left:4px;top:8px}
}

/* --------------------------------------------------------------------------
   Contact : les canaux réels, en grand
   Pas de formulaire qui n'envoie nulle part. Des adresses qui fonctionnent,
   traitées comme des titres parce que c'est ce qu'on vient chercher.
   -------------------------------------------------------------------------- */
.nd-band--contact{
  background:radial-gradient(80% 70% at 50% 30%,#FFF 0%,var(--nd-lav) 100%);
  overflow:hidden;
}
.nd-canaux{list-style:none;margin:clamp(40px,6vh,80px) 0 0;padding:0;
  border-top:1px solid var(--nd-line)}
.nd-canal{border-bottom:1px solid var(--nd-line)}
.nd-canal a{
  display:grid;grid-template-columns:clamp(96px,11vw,150px) 1fr auto;
  align-items:baseline;gap:clamp(16px,2.5vw,40px);
  padding:clamp(24px,3.4vh,40px) 0;
  text-decoration:none;color:var(--nd-ink);
  transition:padding-left .5s var(--nd-ease);
}
.nd-canal a:hover{padding-left:18px}
.nd-canal a:focus-visible{outline:2px solid var(--nd-blue);outline-offset:6px;border-radius:6px}
.nd-canal__k{
  font:500 11.5px/1 ui-monospace,monospace;letter-spacing:.16em;
  text-transform:uppercase;color:var(--nd-muted);
}
.nd-canal__v{
  font-weight:800;font-size:clamp(22px,3.1vw,48px);
  line-height:1.05;letter-spacing:-.03em;word-break:break-word;
}
.nd-canal__f{
  font-size:14px;color:var(--nd-muted);white-space:nowrap;
  transition:color .35s var(--nd-ease);
}
.nd-canal a:hover .nd-canal__f{color:var(--nd-blue)}
@media (max-width:760px){
  .nd-canal a{grid-template-columns:1fr;gap:8px;padding:22px 0}
  .nd-canal__f{white-space:normal}
}

/* Le lieu, en bas de page : une adresse, pas une carte. */
.nd-lieu{
  margin:clamp(46px,7vh,90px) 0 0;
  display:flex;flex-wrap:wrap;gap:10px 30px;align-items:baseline;
  font-size:15px;color:var(--nd-muted);
}
.nd-lieu strong{color:var(--nd-ink);font-weight:700}