/* Section /guides, alignée sur la refonte de l'accueil (bande bleu profond, cartes blanches).
   Complète site.css. Fichier versionné (cache d'un an sur /assets) : toute modification passe par un nouveau nom. */
.top nav a:not(.top__cta){display:inline}
@media(max-width:520px){.top nav a:not(.top__cta){display:none}}

/* bande d'en-tête */
.gband{background:var(--deep,#1A22A0);color:#fff;padding:clamp(2rem,5vw,3.5rem) 0 clamp(5.5rem,10vw,7.5rem)}
.gband--hub{padding-bottom:clamp(3rem,7vw,5rem)}
.gcrumbs{font-size:.9rem;color:#C7CBF5}
.gcrumbs a{color:#C7CBF5;text-underline-offset:3px}
.gcrumbs a:hover{color:#fff}
.gband h1{color:#fff;margin-top:clamp(1.2rem,3vw,2rem);font-size:clamp(2.3rem,1rem + 4.6vw,5rem);max-width:15em;text-wrap:balance}
.gband__meta{margin:1.2rem 0 0;color:#C7CBF5;font-size:.95rem}
.gband__lede{margin:1.4rem 0 0;max-width:34em;color:#C7CBF5;font-size:clamp(1.08rem,1rem + .4vw,1.3rem);line-height:1.5}

/* mise en page article + colonne */
.glayout{display:grid;gap:2rem;margin-top:clamp(-4.5rem,-7vw,-3.5rem);padding-bottom:clamp(2.5rem,6vw,4rem)}
@media(min-width:1040px){.glayout{grid-template-columns:minmax(0,46rem) minmax(0,17rem);justify-content:space-between;gap:3rem}}
.gart{min-width:0}

.answer{background:var(--paper,#fff);border-radius:14px;padding:clamp(1.3rem,3.5vw,2rem);box-shadow:0 24px 50px -30px rgba(18,19,26,.45);border-top:4px solid var(--blue)}
.answer__k{margin:0 0 .6rem;font-weight:700;color:var(--blue);font-size:.95rem}
.answer p{margin:0;font-size:clamp(1.08rem,1.02rem + .3vw,1.24rem);line-height:1.55}

/* sommaire : replié en ligne sur mobile, colonne collante sur grand écran */
.toc ol{margin:0;padding-left:1.25rem;font-size:.93rem;color:var(--mute)}
.toc li{margin:.35rem 0}
.toc a{color:var(--mute);text-decoration:none}
.toc a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.toc--inline{margin-top:1.4rem;background:var(--paper,#fff);border-radius:12px;padding:.9rem 1.2rem}
.toc--inline summary{cursor:pointer;font-weight:600}
.toc--inline ol{margin-top:.7rem}
.gside{display:none}
@media(min-width:1040px){
  .toc--inline{display:none}
  .gside{display:block;padding-top:clamp(5rem,8vw,6.5rem)}
  .gside__in{position:sticky;top:5.5rem}
  .toc--side{background:var(--paper,#fff);border-radius:12px;padding:1.2rem 1.3rem}
  .toc--side p{margin:0 0 .5rem;font-weight:700;font-size:.95rem}
  .gside__cta{margin-top:1rem;background:var(--ink);color:#fff;border-radius:12px;padding:1.2rem 1.3rem}
  .gside__cta p{margin:0 0 1rem;font-weight:600;line-height:1.35}
  .gside__cta .btn{width:100%;text-align:center}
  .gside__cta .btn:hover{background:#fff;color:var(--ink)}
}

/* corps */
.gbody section{padding-top:2.4rem;scroll-margin-top:5rem}
.gbody h2{margin:0 0 .9rem;font-size:clamp(1.55rem,1.1rem + 1.5vw,2.3rem);line-height:1.08;letter-spacing:-.025em;color:var(--ink);font-weight:700;font-variation-settings:"opsz" 96,"wdth" 80;text-wrap:balance}
.gbody p,.gbody li{max-width:40em}
.gbody p{margin:0 0 1rem}
.gbody ul{margin:0 0 1rem;padding-left:1.2rem}
.gbody li{margin-bottom:.5rem}
.gbody li::marker{color:var(--blue)}
.gbody a{color:var(--blue);text-underline-offset:3px}

/* étapes : de vraies séquences, donc numérotées */
.gbody ol.steps-list{list-style:none;counter-reset:st;margin:0 0 1.2rem;padding:0;display:grid;gap:.7rem}
.gbody ol.steps-list li{counter-increment:st;position:relative;margin:0;max-width:none;background:var(--paper,#fff);border-radius:12px;padding:1rem 1.2rem 1rem 3.6rem}
.gbody ol.steps-list li::before{content:counter(st);position:absolute;left:1.1rem;top:1rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--blue);color:#fff;font-weight:700;font-size:.9rem;display:grid;place-items:center;line-height:1}

/* tableaux */
.gbody table{width:100%;border-collapse:collapse;margin:0 0 1.2rem;font-size:.95rem;background:var(--paper,#fff);border-radius:12px;overflow:hidden;display:block;overflow-x:auto}
.gbody th,.gbody td{text-align:left;vertical-align:top;padding:.75rem 1rem;border-bottom:1px solid var(--line)}
.gbody tr:last-child th,.gbody tr:last-child td{border-bottom:0}
.gbody thead th{background:#E7E9FD;color:var(--deep,#1A22A0);font-weight:700}
.gbody tbody th{font-weight:700;white-space:nowrap}

/* FAQ en carte */
.gbody .faq{background:var(--paper,#fff);border-radius:12px;padding:0 1.2rem}
.gbody .faq details:first-child{border-top:0}
.gbody .faq details:last-child{border-bottom:0}
.gbody .faq p{max-width:none}

.sources{font-size:.92rem}
.sources h2{font-size:1.2rem!important}
.sources ul,.sources__note{color:var(--mute)}
.sources__note{font-size:.88rem}

/* appel final : même aplat bleu que l'accueil */
.gcta{background:var(--blue);color:#fff;padding:clamp(3rem,8vw,5.5rem) 0}
.gcta__k{margin:0 0 1rem;max-width:26em;font-size:clamp(1.05rem,1rem + .4vw,1.3rem);opacity:.9}
.gcta__link{display:inline-block;color:#fff;text-decoration:none;font-weight:700;font-size:clamp(2.3rem,1rem + 6vw,6rem);line-height:.95;letter-spacing:-.035em;font-variation-settings:"opsz" 96,"wdth" 75}
.gcta__link span{display:inline-block;transition:transform .2s}
.gcta__link:hover span{transform:translateX(.2em)}
.gcta__link:hover{text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.12em}
.gcta__s{margin:1.3rem 0 0;opacity:.85}

/* cartes de guides (accueil des guides et « à lire aussi ») */
.gcards{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
@media(min-width:720px){.gcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1100px){.hub .gcards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.gcard{position:relative;display:flex;flex-direction:column;gap:.6rem;background:var(--paper,#fff);border-radius:14px;padding:1.4rem 1.4rem 1.5rem;transition:transform .2s,box-shadow .2s}
.gcard:hover{transform:translateY(-3px);box-shadow:0 22px 44px -28px rgba(18,19,26,.5)}
.gcard__tag{align-self:flex-start;padding:.15rem .65rem;border-radius:999px;background:#E7E9FD;color:var(--blue);font-weight:600;font-size:.8rem}
.gcard h3{font-size:clamp(1.3rem,1.1rem + .6vw,1.6rem);line-height:1.12}
.gcard h3 a{text-decoration:none}
.gcard h3 a::after{content:"";position:absolute;inset:0;border-radius:14px}
.gcard:hover h3 a{color:var(--blue)}
.gcard p{margin:0;color:var(--mute);font-size:.95rem;line-height:1.5}
.gcard:focus-within{outline:2px solid var(--blue);outline-offset:3px}

.hub{padding:clamp(2rem,5vw,3rem) var(--pad) clamp(3rem,7vw,5rem)}
.hubgroup+.hubgroup{margin-top:clamp(2.5rem,5vw,3.5rem)}
.hubgroup h2{margin:0 0 1rem;font-size:1rem;color:var(--mute)}

.grelated{padding-top:clamp(2.5rem,6vw,4rem);padding-bottom:clamp(2.5rem,6vw,4rem)}
.grelated h2{margin:0 0 1rem;font-size:clamp(1.5rem,1.1rem + 1.3vw,2.2rem);color:var(--ink);letter-spacing:-.025em;font-weight:700;font-variation-settings:"opsz" 96,"wdth" 80}

@media(prefers-reduced-motion:reduce){.gcard,.gcard:hover{transition:none;transform:none}}