/* Styles specifiques page FAQ (extraits de la maquette) */


/* En-tete de page (partage) */
.page-head{background:var(--ink-deep,oklch(19% .008 159));padding:clamp(2.5rem,6vw,5rem) 0 clamp(2.25rem,5vw,3.5rem);border-bottom:1px solid var(--color-hairline-dark)}
.page-head .crumb{font:600 13px/1 var(--font-display);color:var(--color-ink-text-soft);letter-spacing:.02em;margin-bottom:1.1rem}
.page-head .crumb a{color:var(--color-accent);text-decoration:none}
.page-head h1{font-size:clamp(2.2rem,5.5vw,3.9rem);line-height:1.02;color:var(--color-paper);letter-spacing:-.02em;max-width:18ch}
.page-head .lede{font-size:clamp(1.02rem,1.4vw,1.32rem);line-height:1.6;color:var(--color-ink-text-soft);max-width:72ch;margin-top:1.2rem}

/* Sommaire en pilules : barre collante sous la nav */
.som-bar{position:sticky;top:57px;z-index:30;background:oklch(19% .008 159 / .92);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-hairline-dark)}
.som{display:flex;flex-wrap:nowrap;gap:.5rem;padding:.7rem 0;overflow-x:auto;scrollbar-width:none}
.som::-webkit-scrollbar{display:none}
.som a{flex:none;font:600 13.5px/1 var(--font-display);color:var(--color-paper-2);border:1px solid var(--color-hairline-dark);border-radius:999px;padding:.6em 1.05em;text-decoration:none;transition:border-color .2s,color .2s}
.som a:hover{border-color:var(--color-accent);color:var(--color-accent)}
.faq-band{scroll-margin-top:118px}

/* Bandes FAQ : compteur discret + variante encre de l'accordeon */
.faq-band .head .dek{margin-top:.55rem}
.section--dark .faq details{border-bottom:1px solid var(--color-hairline-dark)}
.section--dark .faq summary{color:var(--color-paper)}
.section--dark .faq details>p{color:var(--color-ink-text-soft)}
.section--dark .faq summary::after{color:var(--color-accent)}
.section--dark .faq details .ph{color:var(--color-accent);border-color:var(--color-accent)}