/* Feuille commune aux pages de contenu (guides, pages ville).
   Les jetons sont ceux de l'accueil, aux mêmes valeurs : une page de guide ne
   doit pas donner l'impression d'avoir changé de site. */
:root{
  --vert:#7F8C79; --vert-fonce:#4E5A49; --vert-clair:#EDF1EA;
  --encre:#26302A; --gris:#4A574C; --trait:rgba(38,48,42,.17); --fond:#FBFCFA;
  --blanc:#fff; --rayon:14px; --sur-vert:#fff;
  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --corps:'Public Sans',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--encre);
     font:17px/1.65 var(--corps)}
.bandeau{position:sticky;top:0;z-index:20;background:rgba(251,252,250,.88);
         backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
         border-bottom:1px solid var(--trait)}
.bandeau .in{max-width:760px;margin:0 auto;padding:11px 20px;display:flex;
             align-items:center;gap:14px}
.bandeau img{height:34px;width:auto}
.marque-lien{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.marque-lien .marque{font-family:var(--display);font-weight:600;font-size:.8rem;
                     letter-spacing:.11em;text-transform:uppercase;color:var(--encre);
                     white-space:nowrap}
.bandeau nav{margin-left:auto;display:flex;gap:clamp(9px,2vw,18px);font-size:.86rem;
             white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.bandeau nav::-webkit-scrollbar{display:none}
.bandeau nav a{color:var(--gris);text-decoration:none}
.bandeau nav a:hover{color:var(--vert-fonce)}
@media (max-width:560px){.marque-lien .marque{display:none}}
main{max-width:760px;margin:0 auto;padding:26px 20px 50px}
.fil{font-size:.82rem;color:var(--gris);margin:0 0 18px}
.fil a{color:var(--gris)}
h1,h2,h3{font-family:var(--display);font-weight:600;letter-spacing:-.01em}
h1{font-size:clamp(1.9rem,1.5rem + 1.6vw,2.6rem);line-height:1.1;margin:0 0 12px}
h2{font-size:1.42rem;line-height:1.22;margin:34px 0 10px}
h3{font-size:1.08rem;margin:24px 0 8px;color:var(--vert-fonce)}
p{margin:0 0 16px}
.chapo{font-size:1.1rem;color:var(--gris);margin:0 0 26px}
ul,ol{margin:0 0 18px;padding-left:22px}
li{margin:5px 0}
strong{font-weight:650}
blockquote{margin:22px 0;padding:14px 18px;background:var(--vert-clair);
           border-radius:var(--rayon);color:var(--vert-fonce)}
blockquote p:last-child{margin:0}
table{border-collapse:collapse;width:100%;margin:0 0 20px;font-size:.94rem}
th,td{border:1px solid var(--trait);padding:8px 11px;text-align:left}
thead th{background:var(--vert-clair);font-weight:650}
.encart{border:1.5px solid var(--vert);border-radius:var(--rayon);
        padding:18px 20px;margin:28px 0;background:var(--blanc)}
.encart h2{margin-top:0}
.btn{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:0 20px;
     border-radius:11px;font-weight:600;text-decoration:none;
     background:var(--vert);color:var(--sur-vert);border:1.5px solid var(--vert)}
.btn.trait{background:transparent;color:var(--vert-fonce)}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 0}
.pied{background:#38423A;color:rgba(255,255,255,.62);margin:44px -20px 0;
      padding:44px 20px 24px;font-size:.9rem}
.pied .in{max-width:760px;margin:0 auto}
.pied-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
             gap:28px;margin-bottom:26px}
.pied h3{color:#fff;font-family:var(--corps);font-size:.76rem;font-weight:700;
         letter-spacing:.17em;text-transform:uppercase;margin:0 0 12px}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.pied li{margin:0;line-height:1.7}
.pied p{line-height:1.7}
.pied a{color:rgba(255,255,255,.72);text-decoration:none}
.pied a:hover{color:#fff}
.pied-bas{border-top:1px solid rgba(255,255,255,.18);padding-top:18px;
          display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.82rem}
.liens{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;
       margin:22px 0 0;padding:0;list-style:none}
.liens a{display:block;border:1px solid var(--trait);border-radius:12px;padding:13px 15px;
         background:var(--blanc);text-decoration:none;color:inherit}
.liens a b{display:block;color:var(--vert-fonce)}
.liens a span{font-size:.87rem;color:var(--gris)}
@media (max-width:560px){h1{font-size:1.6rem}body{font-size:16px}}