/* Pages de texte long — légales et contact.
   Direction « Le Jardin d'encre » : crème, serif, une seule colonne étroite.
   La barre reprend celle des pages publiques (partials/barre), le pied est
   partagé par toutes les pages du site. */

:root{
  --feuille:#0F7A46; --feuille-clair:#17A05C; --masque:#D9A441; --piment:#C62828;
  --encre:#141B14; --plume:#4C5A4E; --voile:#7E8C80;
  --papier:#FAF8F3; --creme:#F1EDE2; --bord:rgba(20,27,20,.12);
  --serif:Georgia,"Times New Roman",serif;
}

*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--encre);
  font:16px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
a{color:var(--feuille)}

/* ── La barre, reprise de l'accueil ─────────────────────────────────────── */
.barre{display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  background:#fff;border-bottom:1px solid var(--bord);padding:12px 22px}
.barre .marque{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--encre)}
.barre .nom b{display:block;font:600 17px/1.1 var(--serif)}
.barre .nom em{color:var(--masque);font-style:normal}
.barre .nom small{color:var(--voile);font-size:11px;letter-spacing:.06em}
.barre .menu{display:flex;gap:18px;flex-wrap:wrap}
.barre .menu a{text-decoration:none;color:var(--plume);font-size:14.5px;padding:4px 0}
.barre .menu a:hover,.barre .menu a.on{color:var(--feuille);box-shadow:inset 0 -2px 0 var(--masque)}
.barre .outils{margin-left:auto;display:flex;align-items:center;gap:12px}
.barre .recherche{display:flex;gap:6px}
.barre .recherche input{border:1px solid var(--bord);border-radius:999px;padding:8px 14px;
  font-size:14px;min-width:180px;background:var(--papier)}
.barre .recherche button{border:0;border-radius:999px;background:#0B3B23;color:#fff;
  padding:8px 16px;font-size:13.5px;cursor:pointer}
.barre .rond{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--bord);color:var(--plume);text-decoration:none}

/* ── Le texte ───────────────────────────────────────────────────────────── */
.texte{max-width:760px;margin:0 auto;padding:44px 24px 60px}
.texte .sur{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--voile);margin:0 0 10px}
.texte h1{font:600 clamp(28px,4.4vw,40px)/1.15 var(--serif);margin:0 0 14px;color:#0B3B23}
.texte .chapo{font-size:18px;color:var(--plume);margin:0 0 30px;
  padding-bottom:22px;border-bottom:2px solid var(--bord)}
.texte h2{font:600 20px/1.3 var(--serif);margin:32px 0 8px;color:var(--encre)}
.texte p{color:var(--plume);margin:0 0 14px}
.texte b{color:var(--encre)}
.texte .maj{margin-top:34px;padding-top:16px;border-top:1px solid var(--bord);
  font-size:13.5px;color:var(--voile)}

/* ── Le formulaire ──────────────────────────────────────────────────────── */
.formulaire{background:#fff;border:1px solid var(--bord);border-radius:16px;
  padding:24px 26px;margin:24px 0 0;box-shadow:0 10px 26px rgba(20,60,35,.05)}
.formulaire label{display:block;font-size:13px;font-weight:600;color:var(--encre);
  margin:16px 0 6px}
.formulaire input,.formulaire textarea{width:100%;border:1px solid var(--bord);
  border-radius:10px;padding:11px 13px;font:15px/1.5 inherit;background:var(--papier);color:var(--encre)}
.formulaire input:focus,.formulaire textarea:focus{outline:2px solid var(--feuille-clair);
  outline-offset:1px;background:#fff}
.formulaire textarea{resize:vertical;min-height:150px}
.formulaire button{margin-top:20px;border:0;border-radius:999px;background:#0B3B23;color:#fff;
  padding:12px 26px;font-size:15px;cursor:pointer}
.formulaire button:hover{background:var(--feuille)}
.formulaire .petit{margin:14px 0 0;font-size:12.5px;color:var(--voile)}

/* Le leurre : sorti du flux et hors écran, jamais « display:none » ni
   « hidden » — un robot lit ces attributs et laisserait le champ vide. */
.leurre{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

.avis{border-radius:12px;padding:13px 18px;margin:18px 0;font-size:15px}
.avis.bon{background:#E4F2E8;color:#0B3B23;border-left:4px solid var(--feuille)}
.avis.mauvais{background:#FBE3E1;color:#8A1F1B;border-left:4px solid var(--piment)}
.avis ul{margin:0;padding-left:20px}

@media (max-width:640px){
  .barre{gap:12px;padding:10px 14px}
  .barre .outils{width:100%;margin-left:0}
  .barre .recherche{flex:1}
  .barre .recherche input{min-width:0;width:100%}
  .texte{padding:30px 18px 44px}
}

/* ── L'espace membre ────────────────────────────────────────────────────── */
.texte.etroit{max-width:640px}
.texte h2{margin-top:38px}
.formulaire+h2{margin-top:44px}
.formulaire .option{font-weight:400;color:var(--voile)}
.formulaire .case{display:flex;gap:9px;align-items:flex-start;margin:18px 0 0;
  font-size:14px;font-weight:400;color:var(--plume)}
.formulaire .case input{width:auto;margin-top:3px}
.formulaire.danger{border-color:rgba(198,40,40,.35)}
.formulaire.danger p{color:var(--plume);font-size:14px;margin:0}
.formulaire button.rouge{background:#8A1F1B}
.formulaire button.rouge:hover{background:var(--piment)}
button.lien{background:none;border:0;color:var(--feuille);font-size:14.5px;
  padding:0;cursor:pointer;text-decoration:underline}
.avis.attente{background:#FCEFD6;color:#6B4708;border-left:4px solid #E9A020}
.apres{margin-top:26px;font-size:14.5px;color:var(--plume)}

.acces-carnet{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:26px 0 0}
.bouton-carnet{display:inline-block;background:#0B3B23;color:#fff;text-decoration:none;
  border-radius:999px;padding:11px 22px;font-size:15px}
.bouton-carnet:hover{background:var(--feuille)}
.acces-carnet span{font-size:13.5px;color:var(--voile)}

/* ── L abonnement ───────────────────────────────────────────────────────── */
.carte-offre{background:#fff;border:1px solid var(--bord);border-radius:16px;
  padding:22px 24px;margin:0 0 14px;box-shadow:0 10px 26px rgba(20,60,35,.05)}
.carte-offre b{display:block;font:600 20px/1.3 var(--serif);color:#0B3B23}
.carte-offre .prix{display:block;margin-top:4px;font-size:22px;font-weight:800;color:var(--feuille)}
.carte-offre .accroche{margin:10px 0 0;color:var(--encre);font-size:15px}
.carte-offre .detail{margin:8px 0 0;color:var(--plume);font-size:14.5px}
.carte-offre .attente-canal{margin:14px 0 0;font-size:14px;color:#6B4708;
  background:#FCEFD6;border-left:4px solid #E9A020;border-radius:0 10px 10px 0;padding:11px 15px}
.canaux{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 0}
.canal{border:0;border-radius:999px;background:#0B3B23;color:#fff;padding:11px 22px;
  font-size:15px;cursor:pointer}
.canal:hover{background:var(--feuille)}
.acces-abonnement{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:26px 0 0}
.acces-abonnement span{font-size:13.5px;color:var(--voile)}
.bouton-carnet.clair{background:#fff;color:#0B3B23;border:1px solid var(--bord)}
.bouton-carnet.clair:hover{background:var(--creme)}
.form-offre{background:var(--carte,#fff);border-radius:12px;margin-top:14px}
.form-offre label{display:block;margin:12px 0 5px;font-size:13px;font-weight:600}
.form-offre input,.form-offre select,.form-offre textarea{width:100%;max-width:520px;
  border:1px solid var(--bord);border-radius:9px;padding:9px 12px;font:14.5px/1.5 inherit}

/* ── Le calendrier ──────────────────────────────────────────────────────── */
.filtres-calendrier{margin:22px 0 24px;padding-bottom:18px;border-bottom:1px solid var(--bord)}
.filtres-calendrier .rangee{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:9px}
.filtres-calendrier .etiquette{font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--voile);min-width:56px}
.puce{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--bord);border-radius:999px;
  padding:6px 14px;font-size:13.5px;text-decoration:none;color:var(--plume);background:#fff}
.puce:hover{border-color:var(--feuille)}
.puce.on{background:#0B3B23;color:#fff;border-color:#0B3B23}
.puce.petite{padding:5px 11px;font-size:12.5px}
.puce b{font-size:11.5px;color:var(--voile)}
.puce.on b{color:#B7DCC5}
.travail{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--bord);
  border-radius:12px;padding:14px 16px;margin:0 0 9px}
.travail b{display:block;font-size:15.5px;color:var(--encre)}
.travail small{display:block;margin-top:2px;font-size:12.5px;color:var(--voile)}
.travail .detail{margin:8px 0 0;font-size:14px;color:var(--plume)}
.travail .source{margin:7px 0 0;font-size:12px}
.travail .source a{color:var(--voile)}
.geste{flex-shrink:0;border-radius:999px;padding:5px 12px;font-size:11.5px;font-weight:700;
  letter-spacing:.03em;background:var(--creme);color:#6B4708}
.geste-semer,.geste-planter{background:#E4F2E8;color:var(--feuille)}
.geste-recolter{background:#FCEFD6;color:#96610A}
.geste-proteger{background:#FBE3E1;color:var(--piment)}
.geste-stocker,.geste-preparer{background:#EDEAE2;color:var(--plume)}

.impression{margin:0 0 20px;padding:13px 17px;border:1px dashed rgba(20,27,20,.22);
  border-radius:12px;font-size:14.5px}
.impression span{display:block;margin-top:3px;font-size:13px;color:var(--voile)}


/* ── Accessibilite ──────────────────────────────────────────────────────── */
.saut-au-contenu{position:absolute;left:-9999px;top:0;z-index:100;background:#0B3B23;
  color:#fff;padding:12px 20px;border-radius:0 0 12px 0;font-size:15px;text-decoration:none}
.saut-au-contenu:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #17A05C;outline-offset:2px;
  border-radius:4px}
