/* la page où l'on se trouve, marquée comme la langue active : un filet vert */
  .nav-links a[aria-current="page"]{ color: var(--paper); border-bottom: 1px solid var(--vert); }
  .nav.clair .nav-links a[aria-current="page"]{ color: #15294d; border-bottom-color: #2f7777; }

  /* en fin de lecture : où aller ensuite */
  .exp-autres{
    border-top: 1px solid var(--hairline-2); padding-top: 22px; margin-top: 10px;
    font-family: "Archivo", Arial, sans-serif; font-size: 12px; letter-spacing: .1em;
    text-transform: uppercase; color: var(--muted);
  }
  .exp-autres a{
    color: #2b3f63; text-decoration: none; padding-bottom: 2px;
    background-image: linear-gradient(#2f7777, #2f7777);
    background-size: 0% 1px; background-repeat: no-repeat; background-position: 0 100%;
    transition: background-size .35s ease, color .35s ease;
  }
  .exp-autres a:hover, .exp-autres a:focus-visible{ color: #15294d; background-size: 100% 1px; }
  .exp-autres .sep{ margin: 0 10px; color: var(--hairline); }

  /* ——— Page d'expertise ———
     Le même enchaînement que l'accueil : la nuit pour l'entrée en matière,
     le papier pour ce qui se lit vraiment, la nuit pour la sortie. */
  .exp-hero{
    background-color: var(--ink-2);
    background-image: linear-gradient(to bottom, #070a14 0, #080b17 90px, #090d1a 190px, #0b0f1d 330px, #0b0f1d 100%);
    padding-block: clamp(40px, 5vw, 62px) clamp(54px, 7vw, 88px);
  }
  .fil{
    display: inline-flex; align-items: center; gap: 11px;
    font-family: "Archivo", Arial, sans-serif; font-size: 11.5px; letter-spacing: .12em;
    text-transform: uppercase; color: var(--muted); text-decoration: none;
    margin-bottom: clamp(34px, 4.5vw, 54px);
    transition: color .3s ease;
  }
  .fil .fl{ width: 22px; height: 1px; background: var(--vert); transition: width .3s ease, background-color .3s ease; }
  .fil:hover, .fil:focus-visible{ color: var(--paper-soft); }
  .fil:hover .fl{ width: 32px; background: var(--vert-lift); }
  .exp-titre{ margin: 0; font-size: clamp(2.7rem, 6.4vw, 4.4rem); }
  .exp-sur{
    margin: clamp(20px, 2.4vw, 28px) 0 0; max-width: 24ch;
    font-size: clamp(1.28rem, 2.5vw, 2.05rem); line-height: 1.22;
    color: var(--paper); font-weight: 400;
  }
  .exp-intro{
    margin: clamp(26px, 3vw, 36px) 0 0; max-width: 64ch;
    color: var(--paper-soft); font-size: clamp(1rem, 1.35vw, 1.1rem);
  }

  /* corps : deux colonnes, comme les domaines de l'accueil */
  .exp-corps{ padding-block: clamp(52px, 7vw, 88px); }
  .exp-bloc{
    display: grid; gap: 12px 48px; grid-template-columns: minmax(0, 1fr);
    padding-block: clamp(28px, 3.4vw, 42px);
    border-bottom: 1px solid var(--hairline-2);
  }
  .exp-bloc:first-of-type{ border-top: 1px solid var(--hairline); }
  @media (min-width: 760px){
    .exp-bloc{ grid-template-columns: minmax(200px, .75fr) minmax(0, 1.65fr); gap: 12px 48px; }
  }
  .exp-bloc h2{
    margin: 0; font-family: "Libre Caslon Display", Georgia, serif; font-weight: 400;
    font-size: clamp(1.26rem, 2vw, 1.6rem); letter-spacing: -.01em; line-height: 1.2;
    color: var(--paper);
  }
  /* le sous-titre est une phrase, pas une étiquette : italique en bas de casse,
     dans le vert du papier, comme les légendes du chapitre « Le cabinet » */
  .exp-bloc .sous{
    display: block; margin-top: 8px; line-height: 1.45;
    font-family: "Libre Caslon Text", "Spectral", Georgia, serif; font-style: italic;
    font-size: 1.06rem; font-weight: 400; letter-spacing: 0; text-transform: none;
    color: #276565;   /* le vert du papier tombait à 4,2:1 en italique : trop juste pour être lu */
  }
  /* Spectral en graisse 300 perd son trait sur la texture du papier, à la longueur
     où ces pages se lisent : le corps passe à 400 dans le chapitre clair. */
  .exp-corps p{ font-weight: 400; }
  .exp-bloc p{ margin: 0; color: var(--paper-soft); max-width: 64ch; }
  .exp-bloc p + p{ margin-top: 15px; }
  /* le vécu : ce qui a été fait, séparé de ce qui est proposé.
     Un filet vert très pâle, le texte dans l'encre pleine plutôt que dans le gris. */
  .exp-bloc p.vecu{
    margin-top: 20px; padding-top: 18px;
    border-top: 1px solid rgba(47,119,119,.22);
    color: var(--paper);
  }
  /* le filet ne marque que le passage : les paragraphes de vécu suivants s'enchaînent */
  .exp-bloc p.vecu + p.vecu{ margin-top: 15px; padding-top: 0; border-top: 0; }

  /* sortie : les coordonnées, sans bouton */
  .exp-fin{ background-color: var(--ink-2); border-top: 1px solid var(--hairline-2); padding-block: clamp(44px, 5.5vw, 72px); }
  .exp-fin .shell{ display: grid; gap: 26px 56px; grid-template-columns: minmax(0, 1fr); }
  @media (min-width: 760px){ .exp-fin .shell{ grid-template-columns: minmax(0, 1fr) auto; align-items: end; } }
  .exp-fin .label{ display: block; margin-bottom: 12px; }
  .exp-fin-p{ margin: 0; max-width: 42ch; color: var(--paper-soft); }
  .exp-coord{ display: flex; flex-wrap: wrap; gap: 8px 40px; align-items: baseline; }
  .exp-coord a{
    font-family: "Libre Caslon Display", Georgia, serif; font-size: clamp(1.08rem, 1.6vw, 1.3rem);
    color: var(--paper); text-decoration: none;
    background-image: linear-gradient(var(--vert), var(--vert));
    background-size: 0% 1px; background-repeat: no-repeat; background-position: 0 100%;
    padding-bottom: 3px; transition: background-size .35s ease;
  }
  .exp-coord a:hover, .exp-coord a:focus-visible{ background-size: 100% 1px; }

  /* sur une page d'expertise, la langue courante n'est pas un bouton et les autres
     ramènent à l'accueil, qui seul sait les afficher */
  .langs a, .langs .ici{
    display: inline-block; padding: 2px 6px; text-decoration: none;
    font-family: "Archivo", "Noto Sans SC", Arial, sans-serif; font-size: 12px; letter-spacing: .06em;
    color: var(--muted); border-bottom: 1px solid transparent; transition: color .3s ease, border-color .3s ease;
  }
  .langs a:hover, .langs a:focus-visible{ color: var(--paper); }
  .langs .ici{ color: var(--paper); border-bottom-color: var(--vert); }
  .nav.clair .langs a, .nav.clair .langs .ici{ color: #6b7a93; }
  .nav.clair .langs a:hover, .nav.clair .langs .ici{ color: #15294d; }
  .nav.clair .langs .ici{ border-bottom-color: #2f7777; }
  @media (max-width: 900px){ .langs a, .langs .ici{ font-size: 12px; letter-spacing: .16em; } }