/* ═══════════════════════════════════════════════════════════════════
   GWAZH — circulation entre les pages (1er novembre 2026)
   Fil d'Ariane, barre des formules, formule précédente / suivante,
   bouton fixe sur téléphone, pied de page à quatre colonnes.
   Éléments créés par assets/js/gwazh-nav.js.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Fil d'Ariane ── */
.fil { grid-column: 1 / -1; margin: 0 0 0.6rem; font-family: var(--font-sans); font-size: 0.78rem; letter-spacing: 0.04em; color: var(--text-light); }
.fil ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; }
.fil li { display: inline-flex; align-items: center; }
.fil li + li::before { content: '›'; margin: 0 0.45rem; opacity: 0.6; }
.fil a, .fil span[aria-current] { display: inline-flex; align-items: center; min-height: 44px; }
.fil a { color: inherit; text-decoration: none; border-bottom: 1px solid transparent; }
.fil a:hover { color: var(--teal-deep); border-bottom-color: currentColor; }
.fil span[aria-current] { color: var(--teal-deep); }
.fil .fil-retour::before { content: '·'; }
.fil .fil-retour a { color: var(--teal-mid); }
.fil.fil--haut, .pc-entree > .fil--haut { position: absolute; z-index: 3; top: calc(76px + 0.2rem); left: 0; right: 0; max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad-h); }
@media (max-width: 760px) { .fil--haut { top: 66px; } }
.pc-entree .fil--haut ol { justify-content: center; }
/* fonds sombres : pages juridiques, contact, qui suis-je */
.hero--juridique .fil, body[data-seuil="sombre"] .fil { color: rgba(255,255,255,0.68); }
.hero--juridique .fil span[aria-current], body[data-seuil="sombre"] .fil span[aria-current] { color: #fff; }
.hero--juridique .fil a:hover, body[data-seuil="sombre"] .fil a:hover { color: var(--gold-pale); }
.hero--juridique .fil .fil-retour a, body[data-seuil="sombre"] .fil .fil-retour a { color: var(--gold-pale); }
.hero--juridique .fil ol { justify-content: center; }

/* ── Barre des formules ── */
.fbarre { max-width: var(--max-w); margin: 0 auto; padding: 1.1rem var(--pad-h) 0.2rem; overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; scroll-padding-inline: var(--pad-h); }
.fbarre ul { list-style: none; margin: 0; padding: 0 0 0.5rem; display: flex; gap: 0.5rem; justify-content: center; flex-wrap: wrap; }
.fbarre a {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1rem; white-space: nowrap;
  border-radius: var(--radius-pill); border: 1px solid color-mix(in srgb, var(--f-color) 45%, transparent);
  font-family: var(--font-sans); font-size: 0.82rem; color: var(--text-dark); text-decoration: none; background: var(--paper);
  transition: background 0.2s, border-color 0.2s;
}
.fbarre a:hover { background: color-mix(in srgb, var(--f-light) 45%, var(--paper)); border-color: var(--f-color); }
.fbarre a[aria-current="page"] { background: var(--f-light); border-color: var(--f-color); font-weight: 500; }
.fbarre-point { width: 10px; height: 10px; border-radius: 50%; background: var(--f-color); flex: none; }
@media (max-width: 760px) {
  .fbarre ul { flex-wrap: nowrap; justify-content: flex-start; width: max-content; }
}

/* ── Formule précédente / suivante ── */
.fsuite { max-width: var(--max-w); margin: 0 auto; padding: clamp(1.6rem, 4vw, 2.6rem) var(--pad-h); display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; border-top: 1px solid rgba(185,162,122,0.3); }
.fsuite-lien {
  display: flex; flex-direction: column; gap: 0.3rem; min-height: 44px; padding: 1rem 1.2rem; text-decoration: none;
  border-radius: 14px; border: 1px solid color-mix(in srgb, var(--f-color) 35%, transparent); background: var(--paper);
  transition: background 0.2s, border-color 0.2s;
}
.fsuite-lien:hover { background: color-mix(in srgb, var(--f-light) 35%, var(--paper)); border-color: var(--f-color); }
.fsuite-suiv { text-align: right; align-items: flex-end; }
.fsuite-sens { font-family: var(--font-sans); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-light); }
.fsuite-nom { display: inline-flex; align-items: center; gap: 0.55rem; font-family: var(--font-serif); font-size: 1.25rem; color: var(--teal-deep); }
@media (max-width: 520px) { .fsuite { grid-template-columns: 1fr; } .fsuite-suiv { text-align: left; align-items: flex-start; } }

/* ── Bouton fixe, téléphone uniquement ── */
.fcta { display: none; }
@media (max-width: 760px) {
  .fcta {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom, 0px));
    background: color-mix(in srgb, var(--paper) 92%, transparent); backdrop-filter: blur(6px);
    border-top: 1px solid color-mix(in srgb, var(--f-color) 40%, transparent);
  }
  .fcta .btn-gold { display: flex; width: 100%; min-height: 48px; }
  body.fcta-on { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
  body.fcta-on .guide { bottom: 5.4rem; }
  body.fcta-on .back-to-top { bottom: 5.6rem; }
  html.trilogie-ouverte .fcta { display: none; }
}

/* ── Pied de page : quatre colonnes (le site, les formules, contact) ── */
.footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
@media (max-width: 1024px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .footer-grid { grid-template-columns: 1fr; } }
.footer-links a { display: inline-flex; align-items: center; min-height: 32px; }
@media (max-width: 760px) { .footer-links { gap: 0; } .footer-links a { min-height: 44px; } }

/* clavier : contour visible partout */
.fil a:focus-visible, .fbarre a:focus-visible, .fsuite-lien:focus-visible, .fcta a:focus-visible { outline: 2px solid var(--teal-deep); outline-offset: 2px; }

/* ── Deux univers : séparateur et pastille de passage vers l'autre univers ── */
.fbarre ul { align-items: center; }
.fbarre-sep { width: 1px; height: 26px; margin: 0 0.5rem; background: var(--gold-line); flex: none; }
.fbarre-passage a {
  border: 1px dashed var(--gold-light); background: transparent; color: var(--canard-nuit);
  font-family: var(--font-serif); font-size: 0.88rem; letter-spacing: 0.01em;
}
.fbarre-passage a:hover { background: color-mix(in srgb, var(--gold-pale) 60%, transparent); border-style: solid; border-color: var(--gold-light); }
@media (max-width: 760px) { .fbarre-sep { margin: 0 0.25rem; } }

/* ── Pied de page : mention des photographies, sur sa propre ligne ── */
.footer-bottom .footer-photos { flex-basis: 100%; }

/* la barre des formules ne doit pas être recouverte par une section qui remonte (Expertise) */
main > .fbarre { position: relative; z-index: 2; padding-bottom: 1rem; }
main > .fbarre + .ex2-carte { margin-top: 0; }
