/* Charte « Carnet de bord » — sejoursvoyagesguadeloupe.com
   Papier sable, encre végétale, corail et lagon. Bodoni Moda / Petrona / Outfit.
   Repères : la ligne de route pointillée, les escales numérotées, le billet perforé. */

:root{
  --sable:#FBF7EF;
  --sable-2:#F4EBDC;
  --sable-3:#EADFC9;
  --vert:#0F3D2E;
  --vert-2:#15503C;
  --encre:#1D2420;
  --encre-2:#47524B;
  --encre-3:#78847C;
  --corail:#E4573D;
  --corail-2:#C9432B;
  --lagon:#1E9E8E;
  --lagon-2:#0F6B60;
  --soleil:#F0B44C;
  --trait:rgba(29,36,32,.16);
  --trait-point:1.5px dashed rgba(29,36,32,.32);
  --titres:"Bodoni Moda",Georgia,"Times New Roman",serif;
  --lecture:"Petrona",Georgia,serif;
  --etiquettes:"Outfit","Helvetica Neue",Arial,sans-serif;
  --large:1200px;
  --courbe:cubic-bezier(.25,.6,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:24px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;font-family:var(--lecture);font-size:17px;line-height:1.65;
  color:var(--encre);background:var(--sable);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--titres);font-weight:560;line-height:1.12;margin:0 0 .5em;color:var(--vert)}
h1{font-size:clamp(2.1rem,4.6vw,3.7rem);letter-spacing:-.01em}
h2{font-size:clamp(1.7rem,3vw,2.5rem)}
h3{font-size:clamp(1.3rem,2vw,1.65rem)}
p{margin:0 0 1.15em}
.cadre{max-width:var(--large);margin:0 auto;padding:0 clamp(20px,4vw,44px)}
.acces{position:absolute;left:-9999px;top:0;background:var(--corail);color:var(--sable);padding:10px 16px;z-index:300;font-family:var(--etiquettes)}
.acces:focus{left:12px;top:12px}
.visuel{width:100%;height:100%;object-fit:cover;display:block}
.visuel_attente{display:block;width:100%;height:100%;min-height:180px;background:repeating-linear-gradient(45deg,var(--sable-2) 0 14px,var(--sable-3) 14px 16px)}

/* petites étiquettes */
.repere{
  font-family:var(--etiquettes);font-weight:500;font-size:.72rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--lagon-2);margin:0 0 14px;
}
.repere a{color:inherit}

/* lien éditorial à flèche longue */
.lien_fleche{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--etiquettes);font-weight:500;font-size:.9rem;letter-spacing:.05em;
  color:var(--corail-2);padding:6px 0;
}
.lien_fleche span{border-bottom:1px solid currentColor;padding-bottom:3px}
.lien_fleche svg{transition:transform .3s var(--courbe)}
.lien_fleche:hover svg{transform:translateX(6px)}

/* bouton unique (billet, formulaires) */
.bouton{
  display:block;width:100%;text-align:center;
  font-family:var(--etiquettes);font-weight:600;font-size:.92rem;letter-spacing:.06em;
  background:var(--corail);color:var(--sable);border:0;border-radius:6px;
  padding:16px 22px;cursor:pointer;transition:background .25s;
}
.bouton:hover{background:var(--corail-2)}

/* ligne de route, séparateur signature */
.ligne-de-route{display:flex;align-items:center;gap:14px;margin:0 0 26px;color:var(--lagon)}
.ligne-de-route i{flex:1;border-top:var(--trait-point)}

/* ============ bandeau de tête : marque centrée, navigation scindée ============ */
.entete{position:sticky;top:0;z-index:90;background:var(--sable);border-bottom:1px solid var(--trait)}
.entete_rang{max-width:var(--large);margin:0 auto;padding:10px clamp(20px,4vw,44px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.marque{display:inline-flex;flex-direction:column;align-items:center;gap:2px;justify-self:center;color:var(--vert);padding:2px 10px}
.marque .papillon{color:var(--corail)}
.marque_nom{display:flex;flex-direction:column;align-items:center;font-family:var(--titres);font-size:.98rem;line-height:1.14;letter-spacing:.02em;text-align:center}
.marque_nom b{font-weight:640;letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;color:var(--lagon-2);font-family:var(--etiquettes)}
.entete_nav{display:flex;align-items:center;gap:clamp(14px,2.4vw,34px);font-family:var(--etiquettes);font-size:.85rem;letter-spacing:.06em}
.entete_nav-gauche{justify-content:flex-end}
.entete_nav-droite{justify-content:flex-start}
.entete_nav a{padding:10px 2px;border-bottom:2px solid transparent;transition:border-color .2s,color .2s}
.entete_nav a:hover{color:var(--corail-2);border-color:var(--corail)}
.entete_groupe{position:relative}
.deroule{
  position:absolute;top:100%;left:50%;transform:translate(-50%,6px);min-width:190px;
  background:#fff;border:1px solid var(--trait);border-radius:8px;padding:10px;
  box-shadow:0 18px 40px -24px rgba(15,61,46,.4);
  display:none;flex-direction:column;
}
.deroule a{padding:9px 12px;border-radius:5px;border-bottom:0}
.deroule a:hover{background:var(--sable-2);border-bottom:0}
.entete_groupe:hover .deroule,.entete_groupe:focus-within .deroule{display:flex}

/* ============ barre basse mobile + volet des îles ============ */
.barre{display:none}
.volet{position:fixed;inset:0;z-index:200}
.volet[hidden]{display:none}
.volet_fond{position:absolute;inset:0;background:rgba(15,61,46,.55)}
.volet_panneau{
  position:absolute;left:0;right:0;bottom:0;background:var(--sable);
  border-radius:18px 18px 0 0;padding:24px 22px calc(20px + env(safe-area-inset-bottom));
  max-height:78vh;overflow:auto;transform:translateY(12px);opacity:0;
  transition:transform .3s var(--courbe),opacity .3s;
}
.volet.ouvert .volet_panneau{transform:none;opacity:1}
.volet_item{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:13px 6px;min-height:48px;border-bottom:1px solid var(--trait)}
.volet_item b{font-family:var(--titres);font-size:1.15rem;font-weight:560;color:var(--vert)}
.volet_item span{font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.08em;color:var(--encre-3)}
.volet_fermer{margin-top:16px;width:100%;min-height:48px;background:none;border:1px solid var(--trait);border-radius:6px;font-family:var(--etiquettes);font-size:.85rem;letter-spacing:.08em;cursor:pointer;color:var(--encre-2)}

/* ============ proue : hero éditorial scindé ============ */
.proue{padding:clamp(30px,5vw,70px) 0 clamp(40px,6vw,80px);border-bottom:1px solid var(--trait);background:linear-gradient(180deg,var(--sable) 60%,var(--sable-2) 100%)}
.proue_rang{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,5vw,70px);align-items:center}
.proue_texte h1{margin-bottom:.45em}
.proue_chapo{font-size:clamp(1.02rem,1.3vw,1.18rem);color:var(--encre-2);margin-bottom:1.6em}
.proue_index{list-style:none;margin:34px 0 0;padding:20px 0 0;border-top:var(--trait-point)}
.proue_index li+li{border-top:1px solid var(--trait)}
.proue_index a{display:grid;grid-template-columns:44px 1fr auto;align-items:baseline;gap:14px;padding:11px 4px;transition:background .2s}
.proue_index a:hover{background:rgba(30,158,142,.07)}
.proue_index i{font-style:normal;font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.14em;color:var(--corail-2)}
.proue_index b{font-family:var(--titres);font-weight:560;font-size:1.12rem;color:var(--vert)}
.proue_index span{font-family:var(--etiquettes);font-size:.7rem;letter-spacing:.08em;color:var(--encre-3)}
.proue_visuel{margin:0;position:relative}
.proue_visuel img{
  aspect-ratio:3/4;border-radius:999px 999px 14px 14px;
  animation:lever .8s var(--courbe) both;
}
@keyframes lever{from{opacity:.4;transform:translateY(14px)}to{opacity:1;transform:none}}
.proue_legende{margin-top:12px;text-align:center;font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--encre-3)}

/* ============ la traversée : route pointillée + escales ============ */
.traversee{padding:clamp(60px,8vw,110px) 0 clamp(40px,6vw,80px);background:var(--sable)}
.traversee_tete{max-width:none;margin-bottom:clamp(30px,5vw,60px)}
.traversee_flux{position:relative;display:flex;flex-direction:column;gap:clamp(50px,7vw,100px);padding-top:10px;padding-bottom:10px}
.traversee_ligne{position:absolute;top:0;bottom:0;left:50%;width:0;border-left:var(--trait-point)}
.jalon{
  position:absolute;left:50%;top:0;transform:translate(-50%,-50%);
  width:44px;height:44px;border-radius:50%;background:var(--sable);border:1.5px solid var(--lagon);
  display:grid;place-items:center;color:var(--corail);
  transition:top .18s linear;
}
.escale{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(26px,4.5vw,64px);align-items:center}
.escale_visuel{display:block;overflow:hidden;border-radius:12px;background:var(--sable-3)}
.escale_visuel img{aspect-ratio:16/11;transition:transform 1s var(--courbe)}
.escale_visuel:hover img{transform:scale(1.04)}
.escale_corps{padding-right:clamp(0px,3vw,34px)}
.escale-paire .escale_visuel{order:2}
.escale-paire .escale_corps{order:1;padding-right:0;padding-left:clamp(0px,3vw,34px);text-align:left;justify-self:end}
.escale_num{font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.16em;color:var(--encre-3);margin-bottom:10px}
.escale_num i{font-style:normal;display:inline-block;background:var(--vert);color:var(--sable);border-radius:4px;padding:2px 7px;margin-right:10px;letter-spacing:.1em}
.escale_corps h3{font-size:clamp(1.7rem,2.6vw,2.3rem);margin-bottom:.25em}
.escale_ancre{font-family:var(--titres);font-style:italic;font-weight:460;color:var(--lagon-2);margin-bottom:.9em}
.escale_texte{color:var(--encre-2)}
.escale_infos{margin:0 0 18px;padding:14px 0 4px;border-top:1px solid var(--trait);display:flex;flex-wrap:wrap;gap:6px 28px}
.escale_infos div{display:flex;gap:8px;align-items:baseline}
.escale_infos dt{font-family:var(--etiquettes);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--soleil);background:var(--vert);border-radius:3px;padding:2px 6px}
.escale_infos dd{margin:0;font-size:.92rem;color:var(--encre-2)}
.traversee_fin{margin-top:clamp(36px,5vw,60px);text-align:center}

/* ============ saisons : ruban de l'année ============ */
.saisons{padding:clamp(60px,8vw,110px) 0;background:var(--vert);color:var(--sable)}
.saisons h2{color:var(--sable)}
.saisons .repere{color:var(--soleil)}
.saisons_intro{color:rgba(251,247,239,.78);max-width:none}
.annee{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin:30px 0 26px}
.mois{
  font-family:var(--etiquettes);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;
  min-height:48px;border:0;border-radius:4px;cursor:pointer;
  background:rgba(251,247,239,.12);color:rgba(251,247,239,.75);
  border-bottom:3px solid transparent;transition:background .2s,color .2s,border-color .2s;
}
.mois-careme{background:rgba(240,180,76,.2);color:var(--soleil)}
.mois:hover{background:rgba(251,247,239,.24);color:var(--sable)}
.mois[aria-selected="true"]{background:var(--sable);color:var(--vert);border-color:var(--corail)}
.saisons_verdict{font-family:var(--titres);font-size:clamp(1.15rem,1.8vw,1.5rem);font-weight:520}
.saisons_verdict b{color:var(--soleil);font-weight:640}
.saisons_iles{list-style:none;margin:18px 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ile_puce{
  display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:9px 16px;
  border:1px solid rgba(251,247,239,.3);border-radius:6px;
  font-family:var(--etiquettes);font-size:.82rem;letter-spacing:.05em;
  transition:opacity .35s,border-color .35s;
}
.ile_puce i{width:8px;height:8px;border-radius:50%;background:var(--lagon)}
.ile_puce.hors-saison{opacity:.38}
.ile_puce.hors-saison i{background:rgba(251,247,239,.4)}
.saisons_note{font-size:.92rem;color:rgba(251,247,239,.65)}
.saisons_note a{color:var(--soleil);border-bottom:1px solid currentColor}

/* ============ cap : routes de préparation en rangées ============ */
.cap{padding:clamp(60px,8vw,110px) 0;background:var(--sable-2)}
.cap_liste{border-top:1.5px solid var(--vert)}
.cap_item{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:18px;padding:22px 6px;border-bottom:1px solid var(--trait);transition:background .2s}
.cap_item::after{content:"→";font-family:var(--etiquettes);color:var(--corail-2);font-size:1.2rem;transition:transform .25s var(--courbe)}
.cap_item:hover{background:rgba(228,87,61,.05)}
.cap_item:hover::after{transform:translateX(6px)}
.cap_num{font-family:var(--titres);font-size:1.7rem;font-weight:560;color:var(--lagon);border:var(--trait-point);border-radius:50%;width:52px;height:52px;display:grid;place-items:center}
.cap_corps{display:flex;flex-direction:column;gap:4px}
.cap_corps b{font-family:var(--titres);font-weight:560;font-size:clamp(1.15rem,1.8vw,1.45rem);color:var(--vert)}
.cap_corps span{font-size:.95rem;color:var(--encre-2)}

/* ============ journal : rangées d'articles ============ */
.journal{padding:clamp(60px,8vw,110px) 0}
.journal_liste{border-top:1.5px solid var(--vert)}
.entree{display:grid;grid-template-columns:1fr 150px;gap:24px;align-items:center;padding:24px 4px;border-bottom:1px solid var(--trait)}
.entree_meta{font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--encre-3);margin-bottom:8px}
.entree_meta a{color:var(--lagon-2)}
.entree_titre{font-size:clamp(1.2rem,1.9vw,1.55rem);margin-bottom:.35em}
.entree_titre a{background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .35s var(--courbe)}
.entree:hover .entree_titre a{background-size:100% 1px}
.entree_extrait{font-size:.96rem;color:var(--encre-2);margin:0}
.entree_vignette{display:block;width:150px;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--sable-3)}
.journal_tout{margin-top:26px}
.journal-liees{background:var(--sable-2)}

/* ============ cale : pied de page manifeste, clair ============ */
.cale{background:var(--sable);border-top:1px solid var(--trait);padding:clamp(50px,7vw,90px) 0 30px}
.cale_manifeste{max-width:none;text-align:center;margin-bottom:clamp(36px,5vw,56px)}
.cale_papillon{color:var(--corail);margin-bottom:14px}
.cale_manifeste p{font-family:var(--titres);font-weight:480;font-size:clamp(1.25rem,2.2vw,1.8rem);line-height:1.4;color:var(--vert);margin-bottom:18px}
.cale_liens,.cale_legal{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;font-family:var(--etiquettes);font-size:.82rem;letter-spacing:.05em}
.cale_liens{padding-bottom:16px;margin-bottom:14px;border-bottom:var(--trait-point)}
.cale_liens a,.cale_legal a{padding:6px 0;color:var(--encre-2);border-bottom:1px solid transparent}
.cale_liens a:hover,.cale_legal a:hover{color:var(--corail-2);border-color:currentColor}
.cale_note{margin:22px 0 0;text-align:center;font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.04em;color:var(--encre-3)}
.cale_coord{color:var(--lagon-2)}

/* ============ frontispice des pages de lecture ============ */
.frontispice{padding:clamp(30px,4.5vw,60px) 0 clamp(20px,3vw,36px);border-bottom:1px solid var(--trait);background:var(--sable-2)}
.frontispice h1{max-width:none}
.frontispice_ancre{font-family:var(--titres);font-style:italic;font-weight:460;font-size:clamp(1.1rem,1.7vw,1.4rem);color:var(--lagon-2);margin:0}
.frontispice_meta{font-family:var(--etiquettes);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--encre-3);margin:6px 0 0}
.fil{font-family:var(--etiquettes);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px;color:var(--encre-3)}
.fil ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fil li+li::before{content:"›";margin-right:8px;color:var(--corail)}
.fil a:hover{color:var(--vert)}

.planche_rang{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,54px);align-items:start;padding-top:clamp(24px,3.5vw,44px)}
.planche_rang-seule{grid-template-columns:1fr}
.planche{margin:0;border:1px solid var(--trait);border-radius:12px;padding:10px;background:#fff}
.planche img{border-radius:8px;aspect-ratio:16/9}
.planche_bord{padding-top:6px}
.manifest{margin:0}
.manifest_ligne{display:flex;align-items:baseline;gap:10px;padding:11px 0;border-bottom:var(--trait-point)}
.manifest dt{font-family:var(--etiquettes);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lagon-2);white-space:nowrap}
.manifest_ligne::before{content:"";order:2;flex:1;border-bottom:1px dotted var(--trait)}
.manifest dt{order:1}
.manifest dd{order:3;margin:0;font-size:.95rem;text-align:right;color:var(--encre)}

.sommaire{margin:clamp(24px,3.5vw,40px) 0 8px;padding:4px 24px;border:var(--trait-point);border-radius:10px;background:#fff}
.sommaire summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:48px;font-family:var(--etiquettes);font-weight:500;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--lagon-2)}
.sommaire summary::-webkit-details-marker{display:none}
.sommaire summary::after{content:"›";font-size:1.3rem;letter-spacing:0;transform:rotate(90deg);transition:transform .25s;color:var(--corail-2)}
.sommaire[open] summary::after{transform:rotate(-90deg)}
.sommaire ol{margin:4px 0 16px;padding-left:1.2em;columns:2;column-gap:44px;font-family:var(--etiquettes);font-size:.88rem}
.sommaire li{margin:0 0 8px;break-inside:avoid}
.sommaire a{display:inline-block;padding:3px 0;color:var(--encre-2);border-bottom:1px solid transparent}
.sommaire a:hover{color:var(--corail-2);border-color:currentColor}
@media(max-width:700px){.sommaire ol{columns:1}}

/* ============ prose ============ */
.texte{padding:clamp(24px,3.5vw,44px) 0 clamp(60px,8vw,100px);font-size:17px;line-height:1.65}
.texte-intro{padding-bottom:clamp(20px,3vw,36px)}
.texte > *:first-child{margin-top:0}
.texte h2{margin:1.9em 0 .6em;scroll-margin-top:90px;padding-top:.6em;border-top:var(--trait-point)}
.texte h3{margin:1.5em 0 .5em}
.texte p,.texte li{max-width:none}
.texte a{color:var(--lagon-2);border-bottom:1px solid rgba(30,158,142,.45);transition:border-color .2s}
.texte a:hover{border-color:var(--lagon-2)}
.texte ul,.texte ol{padding-left:1.25em;margin:0 0 1.3em}
.texte li{margin-bottom:.45em}
.texte li::marker{color:var(--corail-2)}
.texte blockquote{margin:2em 0;padding:0 0 0 22px;border-left:3px solid var(--soleil);font-family:var(--titres);font-size:1.3rem;font-style:italic;line-height:1.4;color:var(--encre-2)}
.texte table{width:100%;border-collapse:collapse;margin:2em 0;font-size:.95rem;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
.texte thead th{font-family:var(--etiquettes);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sable);background:var(--vert);text-align:left;padding:11px 14px}
.texte td{padding:11px 14px;border-bottom:1px solid var(--trait);vertical-align:top}
.texte tbody tr:nth-child(odd){background:rgba(244,235,220,.5)}

/* classes portées par le contenu publié */
.gwa-lead{font-family:var(--titres);font-weight:480;font-size:clamp(1.2rem,1.9vw,1.5rem);line-height:1.45;color:var(--vert);margin-bottom:1.5em}
.gwa-eyebrow{display:inline-block;font-family:var(--etiquettes);font-weight:500;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lagon-2);margin-bottom:10px}
.gwa-essentiel{margin:0 0 2.2em;padding:24px 26px 18px;background:#fff;border:var(--trait-point);border-radius:10px;position:relative}
.gwa-essentiel::before{content:"";position:absolute;top:-1px;left:24px;width:56px;height:3px;background:var(--corail);border-radius:2px}
.gwa-essentiel ul{margin:0;padding-left:1.1em}
.gwa-essentiel li{margin-bottom:.5em}
.gwa-figure{margin:2.2em 0;border:1px solid var(--trait);border-radius:12px;padding:10px;background:#fff}
.gwa-figure img{width:100%;height:auto;border-radius:8px;aspect-ratio:16/10;object-fit:cover}
.gwa-figure figcaption{font-family:var(--etiquettes);font-size:.74rem;letter-spacing:.04em;color:var(--encre-3);margin-top:10px;padding:0 4px 2px}
.gwa-callout{margin:2.2em 0;padding:22px 26px;background:var(--sable-2);border-left:4px solid var(--soleil);border-radius:0 10px 10px 0}
.gwa-callout strong{display:block;font-family:var(--titres);font-size:1.25rem;font-weight:560;color:var(--vert);margin-bottom:6px}
.gwa-callout p{margin:0;color:var(--encre-2)}
.gwa-faq{margin:3em 0 1em}
.gwa-faq details{border-bottom:1px solid var(--trait)}
.gwa-faq details:first-of-type{border-top:1.5px solid var(--vert)}
.gwa-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;padding:17px 2px;min-height:44px;font-family:var(--titres);font-size:1.22rem;font-weight:540;line-height:1.3;color:var(--vert)}
.gwa-faq summary::-webkit-details-marker{display:none}
.gwa-faq summary::after{content:"›";font-family:var(--etiquettes);font-size:1.5rem;color:var(--corail-2);flex:none;line-height:1;transform:rotate(90deg);transition:transform .3s}
.gwa-faq details[open] summary::after{transform:rotate(-90deg)}
.gwa-faq .faq-a{padding:0 2px 20px;color:var(--encre-2)}
.gwa-faq .faq-a p:last-child{margin-bottom:0}

/* ============ billet Trip.com ============ */
.billet{display:grid;grid-template-columns:64px 1fr;margin:2.6em 0;border-radius:12px;overflow:hidden;border:1px solid var(--trait);background:#fff;position:relative}
.billet::before,.billet::after{content:"";position:absolute;left:56px;width:16px;height:16px;border-radius:50%;background:var(--sable);border:1px solid var(--trait)}
.billet::before{top:-9px}
.billet::after{bottom:-9px}
.billet_talon{background:var(--lagon-2);display:grid;place-items:center;border-right:2px dashed var(--sable)}
.billet_talon span{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--etiquettes);font-size:.66rem;letter-spacing:.22em;color:var(--sable)}
.billet_corps{padding:22px 26px 18px}
.billet .repere{color:var(--corail-2);margin-bottom:6px}
.billet_titre{font-family:var(--titres);font-size:1.45rem;font-weight:560;color:var(--vert);margin:0 0 4px}
.billet_note{margin:0 0 16px;font-size:.92rem;color:var(--encre-2)}
.billet .bouton{max-width:420px}
.billet_mention{margin:12px 0 0;font-family:var(--etiquettes);font-size:.7rem;letter-spacing:.02em;color:var(--encre-3)}

/* ============ signature d'auteur ============ */
.signature{display:flex;gap:18px;align-items:flex-start;margin:3em 0 0;padding:22px 0 0;border-top:var(--trait-point)}
.signature_sceau{flex:none;width:58px;height:58px;border-radius:50%;border:1.5px solid var(--lagon);color:var(--lagon-2);display:grid;place-items:center;font-family:var(--titres);font-size:1.2rem}
.signature b{font-family:var(--titres);font-size:1.2rem;font-weight:560;color:var(--vert)}
.signature p{margin:4px 0 0;font-size:.94rem;color:var(--encre-2)}

/* ============ escales suivantes ============ */
.suite{padding:clamp(44px,6vw,80px) 0;background:var(--sable-2)}
.suite_liste{border-top:1.5px solid var(--vert)}
.suite_item{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:16px;padding:18px 4px;border-bottom:1px solid var(--trait);transition:background .2s}
.suite_item:hover{background:rgba(30,158,142,.06)}
.suite_num{font-family:var(--etiquettes);font-size:.72rem;letter-spacing:.14em;color:var(--corail-2)}
.suite_nom{display:flex;flex-direction:column;gap:2px}
.suite_nom{font-family:var(--titres);font-weight:560;font-size:1.25rem;color:var(--vert)}
.suite_nom em{font-family:var(--lecture);font-style:italic;font-weight:400;font-size:.9rem;color:var(--encre-2)}
.suite_coord{font-family:var(--etiquettes);font-size:.68rem;letter-spacing:.1em;color:var(--encre-3)}

/* ============ atlas (hub des îles) ============ */
.atlas{padding-bottom:clamp(60px,8vw,100px)}
.atlas_rang{display:grid;grid-template-columns:64px 1fr 200px;gap:clamp(16px,3vw,36px);align-items:center;padding:26px 4px;border-bottom:1px solid var(--trait);transition:background .2s}
.atlas_rang:first-child{border-top:1.5px solid var(--vert)}
.atlas_rang:hover{background:rgba(30,158,142,.05)}
.atlas_num{font-family:var(--titres);font-size:1.6rem;font-weight:560;color:var(--lagon);border:var(--trait-point);border-radius:50%;width:56px;height:56px;display:grid;place-items:center}
.atlas_corps{display:flex;flex-direction:column;gap:4px}
.atlas_corps b{font-family:var(--titres);font-weight:600;font-size:clamp(1.3rem,2vw,1.7rem);color:var(--vert)}
.atlas_corps em{font-style:italic;color:var(--lagon-2)}
.atlas_texte{font-size:.95rem;color:var(--encre-2)}
.atlas_faits{font-family:var(--etiquettes);font-size:.74rem;letter-spacing:.03em;color:var(--encre-3);margin-top:6px}
.atlas_visuel{position:relative;display:block;width:200px;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--sable-3)}
.atlas_visuel i{position:absolute;left:8px;bottom:8px;font-style:normal;font-family:var(--etiquettes);font-size:.62rem;letter-spacing:.1em;background:rgba(15,61,46,.75);color:var(--sable);padding:3px 8px;border-radius:4px}

/* ============ archives, 404 ============ */
.feuillet_archive{padding:clamp(30px,4.5vw,54px) clamp(20px,4vw,44px) clamp(70px,9vw,110px)}
.feuillet_pages{margin-top:44px;font-family:var(--etiquettes);font-size:.82rem;letter-spacing:.06em}
.feuillet_pages .nav-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.feuillet_pages .page-numbers{padding:11px 16px;border:1px solid var(--trait);border-radius:6px;min-height:44px}
.feuillet_pages .page-numbers.current{background:var(--vert);color:var(--sable);border-color:var(--vert)}
.feuillet_vide{font-family:var(--titres);font-size:1.3rem}
.feuillet_vide a{color:var(--lagon-2);border-bottom:1px solid currentColor}
.perdu{padding:clamp(80px,12vw,160px) 0;text-align:center}
.perdu .ligne-de-route{max-width:340px;margin:0 auto 26px}
.perdu_texte{color:var(--encre-2)}
.perdu_liens{display:flex;gap:34px;justify-content:center;flex-wrap:wrap;margin-top:20px}

/* ============ apparitions au défilement ============ */
html.js [data-vue]{opacity:0;transform:translateY(16px);transition:opacity .6s var(--courbe),transform .6s var(--courbe);transition-delay:calc(var(--n,0) * 80ms)}
html.js [data-vue].en-vue{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  [data-vue]{opacity:1;transform:none;transition:none}
  .proue_visuel img{animation:none}
  .jalon{transition:none}
}

/* ============ responsive ============ */
@media(max-width:1020px){
  .entete_nav{gap:14px;font-size:.78rem}
}
@media(max-width:900px){
  .entete{position:static}
  .entete_nav{display:none}
  .entete_rang{grid-template-columns:1fr;justify-items:center;padding:8px 20px}
  body{padding-bottom:64px}
  .barre{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:120;
    background:var(--vert);color:var(--sable);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -10px 30px -18px rgba(15,61,46,.5);
  }
  .barre_lien{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    min-height:60px;background:none;border:0;cursor:pointer;color:rgba(251,247,239,.85);
    font-family:var(--etiquettes);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;
  }
  .barre_lien:active,.barre_lien:hover{color:var(--soleil)}
  .barre_lien .papillon{color:currentColor}
  .proue_rang{grid-template-columns:1fr;gap:30px}
  .proue_visuel{order:-1;max-width:420px;margin:0 auto}
  .proue_visuel img{aspect-ratio:4/5;border-radius:180px 180px 12px 12px}
  .traversee_ligne{left:21px}
  .jalon{left:21px}
  .escale{grid-template-columns:1fr;gap:18px;padding-left:52px}
  .escale-paire .escale_visuel{order:0}
  .escale-paire .escale_corps{order:1;padding-left:0}
  .escale_corps{padding-right:0}
  .planche_rang{grid-template-columns:1fr}
  .atlas_rang{grid-template-columns:44px 1fr;row-gap:12px}
  .atlas_visuel{grid-column:2;width:100%;max-width:340px;aspect-ratio:16/9}
  .atlas_num{width:44px;height:44px;font-size:1.2rem}
  .annee{grid-template-columns:repeat(6,1fr)}
}
@media(max-width:700px){
  .entree{grid-template-columns:1fr 96px;gap:16px}
  .entree_vignette{width:96px}
  .cap_item{grid-template-columns:44px 1fr auto;gap:12px}
  .cap_num{width:44px;height:44px;font-size:1.2rem}
  .billet{grid-template-columns:1fr}
  .billet::before,.billet::after{display:none}
  .billet_talon{border-right:0;border-bottom:2px dashed var(--sable);padding:8px}
  .billet_talon span{writing-mode:horizontal-tb;transform:none}
  .billet .bouton{max-width:none}
  .suite_item{grid-template-columns:44px 1fr}
  .suite_coord{display:none}
}
@media(max-width:480px){
  .annee{grid-template-columns:repeat(4,1fr)}
  .proue_index a{grid-template-columns:36px 1fr;row-gap:0}
  .proue_index span{grid-column:2}
}

/* ============ v2.1 : gabarit GUIDE (pages) vs NOTE (articles) ============ */

/* frontispice enrichi des fiches : titre + carte d'identité */
.frontispice_rang{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:clamp(24px,4vw,60px);align-items:center}
.carte_identite{background:#fff;border:var(--trait-point);border-radius:12px;padding:18px 22px 10px;box-shadow:0 20px 44px -34px rgba(15,61,46,.45)}
.carte_identite_tete{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid var(--trait);font-family:var(--etiquettes);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--corail-2)}
.carte_identite_tete .papillon{color:var(--corail)}
.carte_identite dl{margin:0}
.carte_identite div{display:flex;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px dotted var(--trait)}
.carte_identite div:last-child{border-bottom:0}
.carte_identite dt{font-family:var(--etiquettes);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--lagon-2);white-space:nowrap;order:1}
.carte_identite div::before{content:"";order:2;flex:1;border-bottom:1px dotted var(--trait)}
.carte_identite dd{order:3;margin:0;font-size:.9rem;text-align:right}
.carte_identite dd small{display:block;font-family:var(--etiquettes);font-size:.64rem;letter-spacing:.08em;color:var(--encre-3)}

/* sous-navigation à jalons (pages guides) */
.jalons{position:sticky;top:var(--entete-h,64px);z-index:80;background:var(--sable-2);border-bottom:1px solid var(--trait)}
.jalons_rang{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-top:6px;padding-bottom:6px}
.jalons_rang::-webkit-scrollbar{display:none}
.jalons a{
  flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;
  font-family:var(--etiquettes);font-size:.78rem;letter-spacing:.04em;color:var(--encre-2);
  border-radius:6px;white-space:nowrap;transition:background .2s,color .2s;
}
.jalons a:hover{background:rgba(30,158,142,.1);color:var(--vert)}
.jalons i{font-style:normal;font-size:.64rem;letter-spacing:.1em;color:var(--corail-2)}

/* planche des guides : coordonnées gravées */
.planche-guide{position:relative}
.planche_coord{position:absolute;right:22px;bottom:22px;margin:0;font-family:var(--etiquettes);font-size:.64rem;letter-spacing:.16em;background:rgba(15,61,46,.78);color:var(--sable);padding:5px 10px;border-radius:4px}

/* sections des guides : points de passage numérotés */
.guide .texte{counter-reset:passage}
.guide .texte h2{counter-increment:passage;position:relative;padding-left:64px;border-top:0;padding-top:1em;margin-top:1.6em}
.guide .texte h2::before{
  content:counter(passage,decimal-leading-zero);
  position:absolute;left:0;top:.78em;
  width:46px;height:46px;border-radius:50%;border:var(--trait-point);
  display:grid;place-items:center;
  font-family:var(--etiquettes);font-size:.82rem;letter-spacing:.06em;color:var(--corail-2);
}
.guide .texte h2::after{content:"";position:absolute;left:64px;right:0;top:0;border-top:var(--trait-point)}
.note .texte h2{border-top:var(--trait-point)}

/* bloc hub : les notes de la branche sur la ligne de route */
.branche{padding:clamp(50px,7vw,90px) 0;background:var(--sable-2)}
.branche_tete{margin-bottom:26px}
.branche_liste{list-style:none;margin:0;padding:6px 0 6px 21px;border-left:var(--trait-point)}
.branche_item{position:relative;padding:14px 0 14px 26px}
.branche_item+.branche_item{border-top:1px solid var(--trait)}
.branche_point{position:absolute;left:-28px;top:26px;width:13px;height:13px;border-radius:50%;background:var(--lagon);border:2.5px solid var(--sable-2)}
.branche_item-attente .branche_point{background:var(--sable-2);border:1.5px dashed var(--encre-3)}
.branche_meta{font-family:var(--etiquettes);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--encre-3);margin:0 0 6px}
.branche_item-attente .branche_meta{color:var(--corail-2)}
.branche_titre{font-family:var(--titres);font-weight:560;font-size:clamp(1.15rem,1.8vw,1.45rem);color:var(--vert);margin:0 0 4px}
.branche_titre a{background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .35s var(--courbe)}
.branche_titre a:hover{background-size:100% 1px}
.branche_item-attente .branche_titre{color:var(--encre-3)}
.branche_extrait{font-size:.94rem;color:var(--encre-2);margin:0}
.branche_tout{margin-top:22px}

/* retour au hub (articles) */
.retour_hub{margin:14px 0 0}
.retour_hub a{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-family:var(--etiquettes);font-size:.84rem;letter-spacing:.05em;color:var(--lagon-2)}
.retour_hub a span{border-bottom:1px solid currentColor;padding-bottom:2px}
.retour_hub a:hover{color:var(--corail-2)}
.retour_hub-fin{margin-top:26px;padding-top:20px;border-top:var(--trait-point)}

@media(max-width:900px){
  .frontispice_rang{grid-template-columns:1fr;gap:20px}
  .carte_identite{max-width:520px}
  .guide .texte h2{padding-left:0;padding-top:64px}
  .guide .texte h2::before{top:10px}
  .guide .texte h2::after{left:64px;top:33px}
}

/* billet compact (slot affilié des notes du carnet) + embarquement accueil */
.billet-compact{grid-template-columns:1fr}
.billet-compact::before,.billet-compact::after{display:none}
.billet-compact .billet_talon{display:none}
.billet-compact .billet_corps{display:grid;grid-template-columns:1fr auto;gap:4px 24px;align-items:center;padding:16px 22px}
.billet-compact .repere{grid-column:1;margin:0}
.billet-compact .billet_titre{grid-column:1;font-size:1.15rem;margin:0}
.billet-compact .billet_note{display:none}
.billet-compact .bouton{grid-column:2;grid-row:1/3;width:auto;padding:13px 22px}
.billet-compact .billet_mention{grid-column:1/-1;margin-top:6px}
@media(max-width:700px){
  .billet-compact .billet_corps{grid-template-columns:1fr}
  .billet-compact .bouton{grid-column:1;grid-row:auto;width:100%}
}
.embarquement{padding:0 0 clamp(40px,6vw,70px)}
.embarquement .billet{margin:0}

/* Sur mobile, la barre de jalons ne se fige pas : l'en-tete y est deja statique
   et la barre d'onglets occupe le bas de l'ecran. Regle placee en fin de
   feuille pour l'emporter sur la declaration sticky de base (meme specificite). */
@media(max-width:900px){
  .jalons{position:static;top:auto}
  .texte h2{scroll-margin-top:20px}
}

/* volet mobile : deuxieme bloc « par envie » sous la liste des iles */
.volet_repere-suite{margin-top:18px;padding-top:14px;border-top:var(--trait-point)}