/* Le Gué · feuille de style du site · charte officielle v2 du 14 octobre 2026 */
@font-face{font-family:Spectral;src:url("fonts/Spectral-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Spectral;src:url("fonts/Spectral-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Spectral;src:url("fonts/Spectral-Italic.woff2") format("woff2");font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:"Work Sans";src:url("fonts/WorkSans-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Work Sans";src:url("fonts/WorkSans-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
:root{
  --gue-papier:#F4EDE2;--gue-encre:#1B3A4B;--gue-rouille:#B4552F;--gue-ardoise:#4F6D7A;--gue-filet:#E3D5BE;
  --gue-titre:Spectral,"Iowan Old Style",Georgia,serif;--gue-texte:"Work Sans","Helvetica Neue",Arial,sans-serif;
  --mesure:64ch;color-scheme:light
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--gue-papier);color:var(--gue-encre);font:17px/1.6 var(--gue-texte)}
body.sobre{background:#fff}
img{max-width:100%;height:auto}
a{color:var(--gue-encre);text-decoration-thickness:1.5px;text-underline-offset:.22em;text-decoration-color:var(--gue-rouille)}
a:focus-visible,button:focus-visible{outline:3px solid var(--gue-rouille);outline-offset:4px}
.evitement{position:absolute;left:-999px;top:0;background:var(--gue-encre);color:var(--gue-papier);padding:8px 14px;z-index:10}
.evitement:focus{left:12px}
.page{max-width:1180px;margin:0 auto;padding:0 max(16px,env(safe-area-inset-right,0px)) 48px max(16px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:minmax(0,1fr) 56px;gap:0 48px}
.contenu{min-width:0}
.reperes{position:relative;grid-row:1/span 40;grid-column:2}
.reperes::before{content:"";position:absolute;left:50%;top:32px;bottom:0;width:1px;background:var(--gue-encre)}
.reperes::after{content:"";position:absolute;left:50%;top:32px;bottom:0;width:14px;background:repeating-linear-gradient(to bottom,var(--gue-encre) 0 1px,transparent 1px 56px)}
.reperes span{position:sticky;top:46vh;display:block;width:16px;height:16px;border-radius:50%;background:var(--gue-rouille);margin:420px 0 0 calc(50% - 8px);box-shadow:0 0 0 6px var(--gue-papier);z-index:1}
.sobre .reperes{display:none}
.sobre .page{grid-template-columns:minmax(0,1fr)}
header.site{display:flex;align-items:center;justify-content:space-between;gap:18px 24px;flex-wrap:wrap;padding:32px 0 8px}
header.site .logo{display:block;width:200px;height:auto}
nav ul{display:flex;gap:6px 22px;flex-wrap:wrap;list-style:none;margin:0;padding:0;font-size:15px}
nav a{text-decoration:none;padding:4px 0;border-bottom:1px solid transparent}
nav a:hover,nav a[aria-current="page"]{border-bottom-color:var(--gue-rouille)}
h1,h2,h3{font-family:var(--gue-titre);font-weight:600;line-height:1.12;text-wrap:balance;margin:0}
h1{font-size:clamp(2.1rem,4.8vw,3.7rem);max-width:19ch;letter-spacing:-.01em}
h2{font-size:clamp(1.55rem,2.7vw,2.1rem);max-width:26ch}
h3{font-size:1.18rem}
p,ul,ol{margin:0;max-width:var(--mesure)}
strong{font-weight:600}
section{padding:64px 0;border-top:1px solid var(--gue-filet);display:grid;gap:20px}
section.ouverture{border-top:0;padding:60px 0 56px;gap:24px}
.ouverture p{font-size:1.12rem;max-width:58ch}
.ouverture p:first-of-type strong{font-family:var(--gue-titre);font-size:1.1em}
.ligne-gue{font-family:var(--gue-titre);font-style:italic;color:var(--gue-ardoise)}
.actions{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:4px}
.bouton{display:inline-block;font:600 15px/1.3 var(--gue-texte);text-decoration:none;padding:13px 22px;border:1.5px solid var(--gue-encre);background:var(--gue-encre);color:var(--gue-papier);border-radius:2px;cursor:pointer}
.bouton.clair{background:transparent;color:var(--gue-encre)}
.bouton:hover{background:var(--gue-rouille);border-color:var(--gue-rouille);color:var(--gue-papier)}
.lien{font-size:15px}
ul.liste{padding-left:1.1em;display:grid;gap:8px}
ul.liste li::marker{color:var(--gue-rouille)}
ol.questions{padding-left:1.4em;display:grid;gap:10px;font-family:var(--gue-titre);font-size:1.2rem}
ol.questions li::marker{color:var(--gue-rouille);font-weight:600}
.etapes{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1.5px solid var(--gue-encre);max-width:none}
.etapes li{position:relative;padding:22px 24px 4px 0;display:grid;gap:8px;align-content:start;min-width:0}
.etapes li::before{content:"";position:absolute;top:-8.5px;left:0;width:14px;height:14px;border-radius:50%;background:var(--gue-papier);border:1.5px solid var(--gue-encre)}
.etapes li:nth-child(2)::before{background:var(--gue-rouille);border-color:var(--gue-rouille)}
.quand{font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--gue-rouille)}
.etapes p{font-size:15.5px}
.figure{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:44px;align-items:center}
.figure .texte{display:grid;gap:16px;min-width:0}
.figure img{display:block;width:100%}
.bio{display:grid;grid-template-columns:200px minmax(0,1fr);gap:32px;align-items:start}
.bio .texte{display:grid;gap:14px;min-width:0}
.portrait{display:block;width:200px;height:auto;border-radius:2px;filter:saturate(.92)}
.mail-type{background:#fff;border:1px solid var(--gue-filet);border-left:2px solid var(--gue-rouille);padding:22px 24px;display:grid;gap:12px;max-width:68ch;font-size:15.5px}
.offre2{font-size:14.5px;color:var(--gue-ardoise);padding-top:18px;border-top:1px solid var(--gue-filet)}
.source{font-size:14px;color:var(--gue-ardoise)}
.cloture{font-family:var(--gue-titre);font-size:1.3rem;max-width:42ch}
.copie-ok{font-size:14px;color:var(--gue-ardoise)}
footer.site{border-top:1px solid var(--gue-filet);padding:40px 0 0;display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;font-size:15px;line-height:1.7}
footer.site strong{font-family:var(--gue-titre);font-size:1.15rem}
footer.site .pied{display:grid;justify-items:end;gap:10px;font-size:13px;color:var(--gue-ardoise)}
footer.site .pied a{color:var(--gue-ardoise)}
.signe{width:24px;height:24px}
@media (max-width:820px){
  .page{grid-template-columns:minmax(0,1fr);gap:0}
  .reperes{display:none}
  .figure,.etapes,.bio{grid-template-columns:minmax(0,1fr)}
  .portrait{width:160px}
  .etapes{border-top:0;border-left:1.5px solid var(--gue-encre);margin-left:7px}
  .etapes li{padding:0 0 26px 26px}
  .etapes li::before{top:4px;left:-8.5px}
  section{padding:48px 0}
  section.ouverture{padding:40px 0 44px}
  footer.site .pied{justify-items:start}
}
@media (prefers-reduced-motion:no-preference){.bouton{transition:background .2s,border-color .2s,color .2s}}
@media print{.reperes,nav,.actions{display:none}body{background:#fff;font-size:11pt}}