/* ==========================================================================
   Laurelle Nob Consulting — feuille de style unique (v6)
   Rythme sombre dominant, comme la version d'origine, sans ses marqueurs.
   Titres : Libre Caslon Display. Texte et interface : Libre Franklin.
   Or fonctionnel. Aucune ressource externe.
   ========================================================================== */

/* --------------------------------------------------------------- 1. Polices
   Open Sans pour tout le site, comme controlrisks.com : une seule famille,
   titres en 600, texte en 400. Libre Caslon Display n'est conservé que pour
   le filigrane décoratif et le monogramme. */
@font-face{font-family:'OpenSans';src:url('fonts/opensans-latin.woff2') format('woff2-variations');font-weight:300 800;font-style:normal;font-display:swap;
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'OpenSans';src:url('fonts/opensans-latin-ext.woff2') format('woff2-variations');font-weight:300 800;font-style:normal;font-display:swap;
unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'OpenSans';src:url('fonts/opensans-latin-italic.woff2') format('woff2-variations');font-weight:300 800;font-style:italic;font-display:swap;
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Gelasio';src:url('fonts/gelasio.woff2') format('woff2-variations');font-weight:400 700;font-style:normal;font-display:swap;
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:'Caslon';src:url('fonts/caslon-latin.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;
unicode-range:U+0000-00FF,U+2000-206F;}

/* --------------------------------------------------------------- 2. Jetons */
:root{
  --paper:#FFFFFF;
  --surface:#F2F4F7;
  --surface-2:#E8EBF0;
  --line:#D9DDE4;
  --line-soft:#E7EAEF;
  --line-strong:#AFB6C1;

  --ink:#0E151D;
  --ink-body:#2B343F;
  --ink-mute:#55606D;

  --navy:#1B2A41;
  --navy-deep:#121D2C;
  --navy-soft:#1F3C6B;          /* second ton du hero : ecart de luminosite porte de 4 a 9 points */
  --navy-line:#33415A;
  --on-navy:#DCE1E8;
  --on-navy-mute:#98A3B2;
  --on-navy-mute-2:#AEB9C9;     /* meme role, lisible aussi sur le second ton */

  --gold:#D4AF37;
  --gold-soft:#E0C25F;
  --gold-ink:#866D1D;           /* seule variante utilisable en texte sur fond clair */

  /* Une seule famille pour tout le texte. --mark ne sert qu'au filigrane. */
  --sans:'OpenSans','Helvetica Neue',Helvetica,Arial,sans-serif;
  --disp:'Gelasio',Georgia,'Times New Roman',serif;   /* titres */
  --mark:'Caslon',Georgia,serif;

  --shell:1180px;
  --gut:clamp(20px,4vw,48px);
  --sec:clamp(60px,7.5vw,108px);
  --sec-s:clamp(44px,5.5vw,76px);

  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:44px;--s8:60px;--s9:80px;

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --z-drawer:180;--z-head:200;--z-flag:300;--z-skip:400;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:100px;}
body{font-family:var(--sans);font-size:16.5px;line-height:1.7;font-weight:400;
  color:var(--ink-body);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--gold-ink);outline-offset:3px;}
.hero :focus-visible,.pagehead :focus-visible,.band :focus-visible,.sitefoot :focus-visible{outline-color:var(--gold-soft);}
::selection{background:var(--navy);color:#fff;}

.shell{max-width:var(--shell);margin-inline:auto;padding-inline:var(--gut);}
.measure{max-width:66ch;}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:14px 22px;z-index:var(--z-skip);text-decoration:none;font-size:14px;}
.skip:focus{left:0;}

/* --------------------------------------------------------------- 3. Titres */
h1,h2{font-family:var(--disp);font-weight:600;color:var(--ink);letter-spacing:-.005em;line-height:1.16;text-wrap:balance;}
h3,h4{font-family:var(--sans);font-weight:600;color:var(--ink);letter-spacing:-.012em;line-height:1.2;text-wrap:balance;}
/* Le niveau de titre des entrées d'index suit la structure du document ;
   l'apparence, elle, ne change pas. */
/* Entrees de liste : niveau h2 dans le document, apparence de h3 sur la page. */
.index .row h2,.points li h2,.toolset .grp h2{font-family:var(--sans);font-size:18.5px;letter-spacing:-.006em;line-height:1.35;}
h1{font-size:clamp(34px,4.9vw,60px);line-height:1.1;}
h2{font-size:clamp(26px,3vw,38px);line-height:1.18;}
h3{font-size:18.5px;letter-spacing:-.006em;line-height:1.35;}
p{text-wrap:pretty;}
strong{font-weight:600;color:var(--ink);}
.field{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);}

/* --------------------------------------------------------------- 4. En-tête */
.masthead{position:sticky;top:0;z-index:var(--z-head);background:var(--paper);border-bottom:1px solid var(--line);transition:box-shadow .3s var(--ease);}
.masthead.is-stuck{box-shadow:0 1px 8px rgba(14,21,29,.08);}
.masthead .bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);height:82px;transition:height .3s var(--ease);}
.masthead.is-stuck .bar{height:64px;}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;flex:none;}
.brand .mono{width:42px;height:42px;background:var(--navy);color:#fff;font-family:var(--disp);font-weight:600;font-size:17px;letter-spacing:.03em;display:flex;align-items:center;justify-content:center;flex:none;transition:width .3s var(--ease),height .3s var(--ease);}
.masthead.is-stuck .brand .mono{width:34px;height:34px;font-size:14px;}
/* Signature en Libre Caslon Display, pour retrouver l'allure de la
   version d'origine. Le sous-titre reste en Open Sans. */
.brand .name{font-family:var(--disp);font-size:15.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink);white-space:nowrap;line-height:1.15;}
.brand .name small{display:block;font-family:var(--sans);font-size:9.5px;font-weight:400;letter-spacing:.1em;text-transform:none;color:var(--ink-mute);margin-top:5px;transition:opacity .25s var(--ease),max-height .3s var(--ease);}
.masthead.is-stuck .brand .name small{opacity:0;max-height:0;overflow:hidden;}
.mainnav>ul{display:flex;align-items:center;gap:30px;list-style:none;}
.mainnav a{font-family:var(--sans);font-size:13.5px;font-weight:500;color:var(--ink-body);text-decoration:none;padding:30px 0;position:relative;white-space:nowrap;transition:color .18s var(--ease),padding .3s var(--ease);}
.masthead.is-stuck .mainnav a{padding:21px 0;}
.mainnav a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .32s var(--ease);}
.mainnav a:hover{color:var(--ink);}
.mainnav a:hover::after,.mainnav a[aria-current="page"]::after{transform:scaleX(1);}
.mainnav a[aria-current="page"]{color:var(--ink);font-weight:600;}
/* Sélecteur de langue.
   Le rembourrage vertical de « .mainnav a » s'appliquait aussi à ce lien et
   l'étirait sur toute la hauteur de l'en-tête : d'où la boîte trop haute.
   La règle ci-dessous est plus spécifique et reprend la main. */
.langswitch{display:flex;align-items:center;gap:7px;margin-left:var(--s2);padding-left:var(--s4);position:relative;}
.langswitch::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:18px;background:var(--line);}
.langswitch .cur,.mainnav .langswitch a{font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.09em;padding:0;line-height:1;}
.langswitch .cur{color:var(--ink);}
.mainnav .langswitch a{color:var(--ink-mute);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;transition:color .18s var(--ease),border-color .18s var(--ease);}
.mainnav .langswitch a::after{display:none;}
.mainnav .langswitch a:hover{color:var(--ink);border-bottom-color:var(--gold);}
.langswitch .sep{color:var(--line-strong);font-size:12px;line-height:1;}
/* L'en-tête compacté redéfinit le rembourrage des liens de navigation :
   on le neutralise aussi pour le sélecteur de langue. */
.masthead.is-stuck .mainnav .langswitch a{padding:0 0 2px;}
.burger{display:none;width:44px;height:44px;background:none;border:1px solid var(--line-strong);cursor:pointer;}
.burger i{display:block;width:17px;height:1.5px;background:var(--ink);margin:4px auto;transition:transform .28s var(--ease),opacity .18s var(--ease);}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(5.5px) rotate(45deg);}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-5.5px) rotate(-45deg);}
.drawer{display:none;border-bottom:1px solid var(--line);background:var(--paper);z-index:var(--z-drawer);}
.drawer.open{display:block;}
.drawer ul{list-style:none;padding:var(--s2) 0 var(--s5);}
.drawer a{display:flex;align-items:center;justify-content:space-between;font-family:var(--sans);font-size:16.5px;font-weight:500;color:var(--ink);text-decoration:none;padding:16px 0;border-bottom:1px solid var(--line-soft);}
.drawer a[aria-current="page"]{color:var(--ink-mute);}
.drawer a[aria-current="page"]::after{content:"";width:18px;height:2px;background:var(--gold);}
.drawer .minor a{font-size:13.5px;font-weight:400;color:var(--ink-mute);padding:12px 0;}
@media(max-width:940px){.mainnav li.foldable{display:none;}.burger{display:block;}.mainnav>ul{gap:14px;}}
.brand .court{display:none;}
/* Sous 520 px, la signature complete en Caslon poussait la navigation
   hors de l'ecran : 447 px de contenu pour 375 px de fenetre. On bascule
   sur le nom d'usage, qui est aussi celui employe partout ailleurs. */
@media(max-width:520px){.brand .full{display:none;}.brand .court{display:inline;}}
@media(max-width:430px){.brand .name{font-size:13px;letter-spacing:.11em;}.brand .name small{display:none;}.masthead .bar{height:70px;}}
.no-js .drawer{display:block;}
.no-js .burger{display:none;}

/* --------------------------------------------------------------- 5. Hero sombre
   Le bloc d'ouverture occupe la première fenêtre, comme sur la version d'origine.
   La profondeur vient de trois choses : la masse sombre, un fond en deux tons
   séparés par un filet, et le cartouche clair qui chevauche le bas du bloc. */
.hero{background:var(--navy);color:var(--on-navy);position:relative;overflow:hidden;}
/* Le passage d'un ton à l'autre était une arête franche : elle se lisait
   comme un défaut d'affichage. Elle est remplacée par un fondu de 30 % de
   la largeur. C'est le seul dégradé du site, et il sert à supprimer une
   couture, pas à décorer. */
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,var(--navy) 0%,var(--navy) 46%,var(--navy-soft) 76%,var(--navy-soft) 100%);}
.hero::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--gold);transform-origin:left;animation:draw 1.1s var(--ease-out) both;}
.hero .shell{position:relative;z-index:1;padding-block:clamp(72px,11vw,150px) calc(clamp(72px,11vw,150px) + 46px);min-height:clamp(440px,72vh,720px);display:flex;flex-direction:column;justify-content:center;}
.hero h1{color:#fff;max-width:19ch;}
.hero .standfirst{font-size:clamp(16.5px,1.5vw,19.5px);line-height:1.72;color:var(--on-navy);max-width:56ch;margin-top:var(--s6);}
.hero .acts{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s7);}
.hero .locus{margin-top:var(--s6);font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--on-navy-mute-2);}
@media(max-width:900px){.hero::before{background:linear-gradient(180deg,var(--navy) 0%,var(--navy) 58%,var(--navy-soft) 88%,var(--navy-soft) 100%);}}

/* Cartouche chevauchant */
.docwrap{position:relative;z-index:2;margin-top:-46px;}
.docblock{background:var(--paper);border:1px solid var(--line);border-top:2px solid var(--gold);display:grid;grid-template-columns:repeat(4,1fr);}
.docblock>div{padding:22px 24px 24px;border-right:1px solid var(--line-soft);}
.docblock>div:last-child{border-right:none;}
.docblock dt{margin-bottom:var(--s2);}
.docblock dd{font-family:var(--sans);font-size:14.5px;font-weight:500;color:var(--ink);line-height:1.45;}
@media(max-width:900px){
  .docblock{grid-template-columns:repeat(2,1fr);}
  .docblock>div{border-bottom:1px solid var(--line-soft);}
  .docblock>div:nth-child(2n){border-right:none;}
  .docblock>div:nth-last-child(-n+2){border-bottom:none;}
}
@media(max-width:520px){
  .docwrap{margin-top:-32px;}
  .docblock{grid-template-columns:1fr;}
  .docblock>div{border-right:none;border-bottom:1px solid var(--line-soft);padding:18px 20px 20px;}
  .docblock>div:last-child{border-bottom:none;}
}

/* --------------------------------------------------------------- 6. Bandeau de page intérieure */
.pagehead{background:var(--navy);color:var(--on-navy);position:relative;overflow:hidden;}
.pagehead::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,var(--navy) 0%,var(--navy) 54%,var(--navy-soft) 82%,var(--navy-soft) 100%);}
.pagehead::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--gold);transform-origin:left;animation:draw 1.1s var(--ease-out) both;}
.pagehead .shell{position:relative;z-index:1;padding-block:clamp(46px,6.5vw,88px);}
.pagehead h1{color:#fff;max-width:21ch;}
.pagehead .standfirst{margin-top:var(--s5);max-width:60ch;color:var(--on-navy);font-size:clamp(16px,1.35vw,18.5px);line-height:1.7;}
.crumb{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--on-navy-mute-2);margin-bottom:var(--s5);}
.crumb a{color:var(--on-navy-mute-2);text-decoration:none;border-bottom:1px solid transparent;transition:color .2s var(--ease),border-color .2s var(--ease);}
.crumb a:hover{color:var(--gold-soft);border-color:var(--gold-soft);}
.crumb i{font-style:normal;color:var(--gold-soft);margin-inline:var(--s2);}
@media(max-width:900px){.pagehead::before{background:linear-gradient(180deg,var(--navy) 0%,var(--navy) 62%,var(--navy-soft) 100%);}}

/* --------------------------------------------------------------- 7. Boutons */
.btn{display:inline-flex;align-items:center;gap:11px;font-family:var(--sans);font-size:13.5px;font-weight:500;letter-spacing:.04em;text-decoration:none;padding:15px 28px;min-height:50px;border:1px solid var(--navy);background:var(--navy);color:#fff;transition:background .22s var(--ease),border-color .22s var(--ease),color .22s var(--ease);}
.btn .arw{width:16px;height:1.5px;background:currentColor;position:relative;transition:transform .28s var(--ease);flex:none;}
.btn .arw::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);}
.btn:hover .arw{transform:translateX(4px);}
.btn:hover{background:var(--navy-deep);border-color:var(--navy-deep);}
.btn-gold{background:var(--gold);border-color:var(--gold);color:var(--navy-deep);}
.btn-gold:hover{background:var(--gold-soft);border-color:var(--gold-soft);color:var(--navy-deep);}
.btn-onnavy{background:none;border-color:rgba(220,225,232,.45);color:#fff;}
.btn-onnavy:hover{background:rgba(255,255,255,.09);border-color:#fff;}
.btn-line{background:none;color:var(--ink);border-color:var(--line-strong);}
.btn-line:hover{background:none;border-color:var(--ink);color:var(--ink);}
.btn-invert{background:#fff;border-color:#fff;color:var(--navy);}
.btn-invert:hover{background:var(--on-navy);border-color:var(--on-navy);color:var(--navy-deep);}
.tlink{font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-strong);padding-bottom:2px;transition:border-color .2s var(--ease);}
.tlink:hover{border-color:var(--gold);}

/* --------------------------------------------------------------- 8. Sections */
section{padding-block:var(--sec);}
section.tight{padding-block:var(--sec-s);}
section.hairline{border-top:1px solid var(--line);}
/* --surface n'est plus utilisé que par le bloc d'appel en bas de page.
   Deux blocs voisins de même couleur donnaient l'impression d'un trait
   posé au milieu d'un aplat. Le corps des pages reste blanc. */
section.plate{background:var(--paper);border-top:1px solid var(--line);}
.sectionhead{max-width:60ch;margin-bottom:clamp(34px,4.5vw,56px);}
.sectionhead p{margin-top:var(--s4);color:var(--ink-mute);}

.index{border-top:1px solid var(--ink);}
.index .row{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,11fr);gap:var(--s2) var(--s7);padding-block:28px;border-bottom:1px solid var(--line-soft);align-items:baseline;position:relative;}
.index .row::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--gold);transition:width .55s var(--ease);}
.index .row:hover::after{width:100%;}
.index .row p{color:var(--ink-mute);font-size:15.5px;}
a.index-row{text-decoration:none;display:block;}
a.index-row h3{transition:color .2s var(--ease);}
a.index-row:hover h3{color:var(--gold-ink);}
@media(max-width:780px){.index .row{grid-template-columns:1fr;gap:var(--s2);padding-block:24px;}}

.points{list-style:none;border-top:1px solid var(--ink);}
.points li{padding-block:26px;border-bottom:1px solid var(--line-soft);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,11fr);gap:var(--s2) var(--s7);align-items:baseline;}
.points p{color:var(--ink-mute);font-size:15.5px;}
@media(max-width:780px){.points li{grid-template-columns:1fr;gap:var(--s2);padding-block:22px;}}

.commit{display:grid;grid-template-columns:210px minmax(0,1fr);gap:0 var(--s7);border-top:1px solid var(--ink);}
.commit dt{font-family:var(--sans);font-weight:600;font-size:16px;color:var(--ink);padding-block:26px;border-bottom:1px solid var(--line-soft);}
.commit dd{padding-block:26px;border-bottom:1px solid var(--line-soft);color:var(--ink-mute);max-width:70ch;}
@media(max-width:780px){.commit{grid-template-columns:1fr;}.commit dt{padding:24px 0 0;border-bottom:none;}.commit dd{padding:var(--s2) 0 24px;}}

/* Outils, groupés par famille */
.toolset{border-top:1px solid var(--ink);}
.toolset .grp{padding-block:24px;border-bottom:1px solid var(--line-soft);display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--s2) var(--s7);align-items:baseline;}
.toolset .grp h3{font-size:15.5px;position:relative;}
.toolset .grp p{font-family:var(--sans);font-size:16px;color:var(--ink-body);line-height:1.85;}
@media(max-width:780px){.toolset .grp{grid-template-columns:1fr;gap:var(--s2);}}

/* --------------------------------------------------------------- 9. Bande sombre */
.band{background:var(--navy);color:var(--on-navy);position:relative;}
.band::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gold);}
.band .shell{padding-block:clamp(56px,7.5vw,104px);}
/* Ces deux blocs definissent deja leur rythme vertical dans .shell.
   La regle generique « section { padding-block } » s'y ajoutait : les blancs
   etaient comptes deux fois, soit 216 px morts par bloc et par page. */
section.band,section.callout{padding-block:0;}
.band h1,.band h2,.band h3{color:#fff;}
.band p{color:var(--on-navy);}
.band .field{color:var(--on-navy-mute);}
.band .statement{font-family:var(--disp);font-weight:600;font-size:clamp(25px,3vw,38px);line-height:1.22;letter-spacing:-.005em;color:#fff;max-width:19ch;}
.band .split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,5vw,76px);align-items:start;}
@media(max-width:900px){.band .split{grid-template-columns:1fr;}}
.band .tools{border-top:1px solid var(--navy-line);margin-top:var(--s6);padding-top:var(--s5);}
.band .tools p{font-family:var(--sans);font-size:14.5px;color:var(--on-navy);margin-top:var(--s2);line-height:1.95;}

/* --------------------------------------------------------------- 10. Duo, portrait encadré sombre */
.duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(32px,5vw,76px);align-items:start;}
@media(max-width:900px){.duo{grid-template-columns:1fr;}}
.portrait{background:var(--navy);padding:26px 26px 30px;}
/* Aucun filet sous le portrait : l'espacement suffit à séparer
   l'image de la légende. */
.portrait .nm{font-family:var(--sans);font-weight:600;font-size:20px;color:#fff;margin-top:var(--s5);line-height:1.25;letter-spacing:-.01em;}
.portrait .rule{height:var(--s3);}
.portrait p{font-family:var(--sans);font-size:13.5px;color:var(--on-navy);line-height:1.75;}
.prose p{margin-bottom:var(--s5);max-width:68ch;}
.prose p:last-child{margin-bottom:0;}
.prose .lede{font-size:19px;line-height:1.6;color:var(--ink);}

/* --------------------------------------------------------------- 11. Contact */
.contactlist{list-style:none;border-top:1px solid var(--navy-line);}
.contactlist li{border-bottom:1px solid var(--navy-line);padding-block:18px;display:flex;align-items:center;gap:var(--s5);}
.ico{width:44px;height:44px;flex:none;border:1px solid rgba(201,168,95,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .25s var(--ease),border-color .25s var(--ease);}
.ico svg{width:17px;height:17px;stroke:var(--gold-soft);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.ico svg.fill{fill:var(--gold-soft);stroke:none;}
.contactlist li:hover .ico{background:rgba(176,141,62,.16);border-color:var(--gold);}
.contactlist .lb{display:block;margin-bottom:3px;}
.contactlist a{font-family:var(--sans);font-size:16.5px;color:#fff;text-decoration:none;border-bottom:1px solid transparent;padding-bottom:1px;transition:border-color .2s var(--ease);}
.contactlist a:hover{border-color:var(--gold);}
.infoset{border-top:1px solid var(--navy-line);}
.infoset .r{border-bottom:1px solid var(--navy-line);padding-block:16px;}
.infoset dd{font-family:var(--sans);font-size:15.5px;color:#fff;margin-top:3px;}
@media(max-width:430px){.contactlist a{font-size:15px;}.contactlist li{gap:var(--s4);}}

/* --------------------------------------------------------------- 12. Appel */
.callout{border-top:1px solid var(--line);background:var(--surface);}
.callout .shell{padding-block:clamp(48px,6vw,80px);display:flex;justify-content:space-between;align-items:center;gap:var(--s6);flex-wrap:wrap;}
.callout h2{font-size:clamp(25px,2.7vw,34px);margin-bottom:var(--s2);}
.callout p{color:var(--ink-mute);max-width:52ch;}

.onward{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;}
.onward .spacer{border-right:1px solid var(--line-soft);}
.onward a{padding:30px var(--gut);text-decoration:none;border-right:1px solid var(--line-soft);transition:background .22s var(--ease);position:relative;}
.onward a::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);}
.onward a:hover::after{transform:scaleX(1);}
.onward a:last-child{border-right:none;text-align:right;}
.onward a:last-child::after{transform-origin:right;}
.onward a:hover{background:var(--surface);}
.onward .ttl{display:block;font-family:var(--sans);font-weight:600;font-size:19px;color:var(--ink);margin-top:var(--s2);letter-spacing:-.012em;}
.onward .dir{display:flex;align-items:center;gap:10px;}
.onward a.next .dir{justify-content:flex-end;}
.onward .chev{width:18px;height:1.5px;background:var(--gold);position:relative;flex:none;transition:transform .28s var(--ease);}
.onward .chev::after{content:"";position:absolute;top:-3px;width:7px;height:7px;border-top:1.5px solid var(--gold);border-right:1.5px solid var(--gold);}
.onward a.next .chev::after{right:0;transform:rotate(45deg);}
.onward a.prev .chev::after{left:0;transform:rotate(-135deg);}
.onward a.next:hover .chev{transform:translateX(4px);}
.onward a.prev:hover .chev{transform:translateX(-4px);}
@media(max-width:620px){.onward{grid-template-columns:1fr;}
  .onward a{border-right:none;border-bottom:1px solid var(--line-soft);text-align:left!important;}
  .onward a:last-child{border-bottom:none;}.onward a:last-child::after{transform-origin:left;}
  .onward .spacer{display:none;}
  .onward a.next .dir{justify-content:flex-start;}}

/* --------------------------------------------------------------- 13. Pied de page */
.sitefoot{background:var(--navy-deep);color:var(--on-navy-mute);font-family:var(--sans);font-size:14px;}
.sitefoot .shell{padding-block:var(--s9) var(--s6);}
.footgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:var(--s7);padding-bottom:var(--s7);border-bottom:1px solid var(--navy-line);}
@media(max-width:940px){.footgrid{grid-template-columns:1fr 1fr;gap:var(--s7) var(--s6);}}
@media(max-width:560px){.footgrid{grid-template-columns:1fr;gap:var(--s6);}}
.footgrid .sig{display:block;font-family:var(--disp);font-weight:600;font-size:21px;letter-spacing:-.005em;color:#fff;margin-bottom:var(--s4);}
.footgrid .sig::after{content:"";display:block;width:32px;height:2px;background:var(--gold);margin-top:var(--s4);}
.footgrid p{font-size:14.5px;line-height:1.75;max-width:38ch;color:var(--on-navy-mute);}
.footgrid h2{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--on-navy-mute);margin-bottom:var(--s4);line-height:1.2;}
.footgrid ul{list-style:none;display:grid;gap:11px;}
.footgrid a{color:#C4CBD5;text-decoration:none;transition:color .18s var(--ease);}
.footgrid a:hover{color:#fff;}
.disclaimer{padding-block:var(--s5);border-bottom:1px solid var(--navy-line);}
.disclaimer p{font-size:13px;line-height:1.75;color:var(--on-navy-mute);max-width:96ch;}
.footbottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s3);padding-top:var(--s5);font-size:12.5px;}
.footbottom nav{display:flex;gap:var(--s5);flex-wrap:wrap;}
.footbottom a{color:var(--on-navy-mute);text-decoration:none;}
.footbottom a:hover{color:#fff;}

/* --------------------------------------------------------------- 14. Pages légales */
.legal{padding-block:clamp(44px,6vw,76px) clamp(64px,8vw,104px);}
.legal .shell{max-width:790px;}
.legal h1{font-size:clamp(32px,4.4vw,52px);}
.legal h2{font-weight:600;font-size:18.5px;margin:var(--s8) 0 var(--s3);}
.legal p,.legal li{margin-bottom:var(--s3);color:var(--ink-body);}
.legal ul{padding-left:22px;}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold);}
.legal .updated{font-family:var(--sans);font-size:12.5px;color:var(--ink-mute);margin-bottom:var(--s7);padding-bottom:var(--s5);border-bottom:1px solid var(--line);}

/* --------------------------------------------------------------- 15. Page 404 */
.notfound .shell{padding-block:clamp(56px,9vw,120px);}
.notfound .code{font-family:var(--mark);font-size:clamp(72px,13vw,170px);line-height:.9;color:rgba(201,168,95,.34);}
.notfound h1{margin-top:var(--s4);color:#fff;}
.notfound p{margin-top:var(--s5);max-width:56ch;color:var(--on-navy);}
.notfound .acts{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s7);}

/* --------------------------------------------------------------- 16. Hors ligne */
.offline{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-flag);background:var(--navy-deep);color:#fff;font-family:var(--sans);font-size:13.5px;padding:14px var(--gut);display:none;align-items:center;gap:var(--s3);border-top:2px solid var(--gold);}
.offline.show{display:flex;}
.offline .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex:none;}

/* --------------------------------------------------------------- 17. Mouvement */
@keyframes draw{from{transform:scaleX(0);}to{transform:scaleX(1);}}
@keyframes lift{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.hero h1,.hero .standfirst,.hero .acts,.hero .locus,.docwrap,
.pagehead .crumb,.pagehead h1,.pagehead .standfirst{animation:lift .78s var(--ease-out) both;}
.hero h1,.pagehead h1{animation-delay:.1s;}
.hero .standfirst,.pagehead .standfirst{animation-delay:.2s;}
.hero .acts{animation-delay:.3s;}
.hero .locus{animation-delay:.38s;}
.docwrap{animation-delay:.44s;}

.js [data-rise]{opacity:0;transform:translateY(16px);transition:opacity .75s var(--ease-out),transform .75s var(--ease-out);}
.js [data-rise].seen{opacity:1;transform:none;}
.js [data-rise-group]>*{opacity:0;transform:translateY(14px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out);}
.js [data-rise-group].seen>*{opacity:1;transform:none;}
.js [data-rise-group].seen>*:nth-child(1){transition-delay:0ms;}
.js [data-rise-group].seen>*:nth-child(2){transition-delay:75ms;}
.js [data-rise-group].seen>*:nth-child(3){transition-delay:150ms;}
.js [data-rise-group].seen>*:nth-child(4){transition-delay:225ms;}
.js [data-rise-group].seen>*:nth-child(5){transition-delay:300ms;}
.js [data-rise-group].seen>*:nth-child(6){transition-delay:375ms;}

@view-transition{navigation:auto;}
::view-transition-old(root){animation:vt-out .22s var(--ease) both;}
::view-transition-new(root){animation:vt-in .36s var(--ease-out) both;}
@keyframes vt-out{to{opacity:0;}}
@keyframes vt-in{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0ms!important;transition-duration:.001ms!important;}
  .js [data-rise],.js [data-rise-group]>*{opacity:1!important;transform:none!important;}
  @view-transition{navigation:none;}
}

/* --------------------------------------------------------------- 18. Impression */
@media print{
  .masthead,.drawer,.onward,.callout,.burger,.skip,.offline{display:none!important;}
  body{color:#000;background:#fff;font-size:11pt;line-height:1.45;}
  .hero,.pagehead,.band,.sitefoot,.portrait,.notfound{background:#fff!important;color:#000!important;}
  .hero h1,.pagehead h1,.band h2,.band .statement,.band p,.hero .standfirst,
  .pagehead .standfirst,.portrait p,.portrait .nm,.sitefoot a,.contactlist a,.notfound h1,.notfound p{color:#000!important;}
  .hero::before,.hero::after,.pagehead::before,.pagehead::after,.band::before{display:none!important;}
  .docwrap{margin-top:12pt;}
  .ico{border-color:#000;} .ico svg{stroke:#000;} .ico svg.fill{fill:#000;}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;}
  section{padding-block:16pt;}
}


/* ==========================================================================
   19. Texture des fonds
   Deux couches, uniquement sur les surfaces sombres :
   un filigrane LN repris de la version d'origine, et un grain très fin qui
   casse l'aplat. Le grain est un SVG intégré au fichier CSS : aucune image
   à télécharger, aucune requête réseau.
   ========================================================================== */
/* Le grain est un élément à part entière, pas un pseudo-élément :
   ::before et ::after sont déjà pris sur ces blocs par le panneau bicolore
   et par le filet doré. Deux règles sur le même pseudo-élément se seraient
   écrasées. */
.tex{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px 160px;
  opacity:.05;
}
.sitefoot{position:relative;overflow:hidden;}
.sitefoot .tex{opacity:.04;}
.band{overflow:hidden;}

.watermark{
  position:absolute;pointer-events:none;user-select:none;z-index:0;
  font-family:var(--mark);line-height:.78;color:rgba(255,255,255,.05);
  letter-spacing:.01em;
}
/* Le filigrane ne subsiste que sur le hero, seul bloc assez haut pour
   l'accueillir. Il déborde par le bas et par la droite de façon franche,
   pas d'un demi-jambage. Ailleurs, il ne produisait que des fragments. */
.hero .watermark{right:.04em;bottom:-.30em;font-size:clamp(230px,30vw,420px);}
.notfound .watermark{display:none;}
@media(max-width:640px){.hero .watermark{font-size:clamp(180px,52vw,260px);right:-.08em;bottom:-.26em;}}

/* Le contenu passe devant les deux couches */
.hero .shell,.pagehead .shell,.band .shell,.sitefoot .shell{position:relative;z-index:1;}

@media print{.tex,.watermark{display:none!important;}}


/* ==========================================================================
   20. Variantes sombres des blocs de contenu
   Sur trois pages, deux blocs voisins partageaient une couleur de fond :
   le trait de séparation donnait l'impression d'être posé au milieu d'un
   aplat. Les blocs « Méthode de travail » et « Environnement de travail »
   passent donc sur fond bleu nuit, ce qui rétablit l'alternance.
   ========================================================================== */
.band .sectionhead p{color:var(--on-navy-mute);}
.band .commit{border-top-color:rgba(255,255,255,.7);}
.band .commit dt{color:#fff;border-bottom-color:var(--navy-line);}
.band .commit dd{color:var(--on-navy);border-bottom-color:var(--navy-line);}
.band .toolset{border-top-color:rgba(255,255,255,.7);}
.band .toolset .grp{border-bottom-color:var(--navy-line);}
.band .toolset .grp h3{color:#fff;}
.band .toolset .grp p{color:var(--on-navy);}
.band .measure{color:var(--on-navy-mute);}

/* Page Contact : le bandeau et les coordonnées ne forment plus qu'un bloc. */
.pagehead.contactblock .shell{padding-bottom:clamp(56px,7.5vw,96px);}
.pagehead.contactblock .split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,5vw,76px);align-items:start;margin-top:clamp(36px,5vw,60px);}
@media(max-width:900px){.pagehead.contactblock .split{grid-template-columns:1fr;}}