@font-face {
  font-family: 'corps';
  src: url('polices/archivo-var.woff2') format('woff2');
  font-weight: 350 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'corps-repli';
  src: local('Arial'), local('Liberation Sans');
  size-adjust: 100.53%;
}

@font-face {
  font-family: 'mesure';
  src: url('polices/armata-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'mesure-repli';
  src: local('Arial'), local('Liberation Sans');
  size-adjust: 116.76%;
  ascent-override: 83.68%;
  descent-override: 23.38%;
  line-gap-override: 0%;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {

  font-synthesis: none;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;

  scroll-padding-block: calc(var(--barre-h) + 0.75rem) 0.75rem;
}

a,
button,
summary,
label {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

body {

  overflow-x: clip;
  margin: 0;
  background: var(--canevas);
  color: var(--texte-2);
  font-family: var(--sans);
  font-size: var(--t-corps);
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  scrollbar-color: var(--texte-4) transparent;
}

:is(p, li, dt, dd, h1, h2, h3, h4, summary, figcaption, blockquote) {
  overflow-wrap: anywhere;
  min-inline-size: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--serif);
  font-weight: var(--g-titre);

  color: var(--encre);
  margin: 0;
  text-wrap: balance;
}

h1 {
  font-size: var(--t-display);

  line-height: calc(0.9em + 0.45rem);
  letter-spacing: -0.02em;
}

h2 {
  font-size: var(--t-titre);
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin-block: 1.5em 0.5em;
}

h3 {
  font-size: var(--t-intertitre);
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin-block: 1.4em 0.4em;
}

h4 {
  font-size: var(--t-sous-titre);
  line-height: 1.3;
  margin-block: 1.3em 0.3em;
}

h5,
h6 {
  font-family: var(--sans);
  font-weight: var(--g-fort);
  font-variation-settings: normal;
  font-size: var(--t-corps);
  line-height: 1.4;
  margin-block: 1.2em 0.3em;
}

h2:first-child,
h3:first-child,
h4:first-child,
.folio-section + h2,
.folio-section + h3,
.folio-section + h4 { margin-block-start: 0; }

main > section + section:not(.bande) { margin-block-start: var(--pas); }
main > section + section > h1 { margin-block-end: 0.3em; }

p {
  max-inline-size: var(--mesure-ligne);
  margin: 0 0 0.9em;
  text-wrap: pretty;
}

p:last-child { margin-block-end: 0; }

main dd { max-inline-size: var(--mesure-ligne); }

main :is(ul, ol):not([class]) > li { max-inline-size: var(--mesure-ligne); }

strong,
b {
  font-weight: var(--g-fort);
  color: var(--encre);
}

em,
i {
  font-style: normal;
  color: var(--encre);
}

a {
  color: inherit;
  transition: color var(--duree-vive) var(--detente),
    text-decoration-color var(--duree-vive) var(--detente);
}

main :is(p, li, dd, blockquote, figcaption) a {
  color: var(--accent-texte);
  text-decoration-line: underline;
  text-decoration-color: color-mix(in srgb, var(--accent-texte) 45%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

main :is(p, li, dd, blockquote, figcaption) a:hover {
  text-decoration-color: currentcolor;
}

a[target='_blank']::after {
  content: ' (nouvel onglet)';
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  white-space: nowrap;
  clip-path: inset(50%);
}

:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

a:focus-visible:not(.bouton):not(.nav__lien):not(.tiroir__lien):not(.onglets__onglet):not(.outil):not(.vitrine__lien) {
  border-radius: 2px;
}

img,
svg,
video,
picture {
  max-inline-size: 100%;
}

img,
video { block-size: auto; }

::selection {
  background: var(--accent-lavis);
  color: var(--encre);
}

.page {
  inline-size: min(100%, var(--large));
  padding-inline-start: max(var(--gouttiere), env(safe-area-inset-left, 0px));
  padding-inline-end: max(var(--gouttiere), env(safe-area-inset-right, 0px));
  margin-inline: auto;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

:root {
  color-scheme: light dark;

  --canevas: #fbf9f5;
  --surface: #ffffff;
  --bande: #f3eee3;
  --filet: #e6e0d2;
  --filet-fort: #cfc7b4;

  --encre: #0f1c1e;
  --texte-2: #37494d;
  --texte-3: #5d6f74;

  --texte-4: #7a8b90;

  --petrole: #12303e;

  --accent: #c96a00;
  --accent-trace: #f6ae2f;
  --accent-texte: #a85400;
  --accent-nuit: #f6ae2f;
  --accent-lavis: #fff3d6;

  --bouton-fond: #f6ae2f;
  --bouton-texte: #0f1c1e;
  --bouton-survol: #e89d17;

  --nuit: #12303e;
  --nuit-surface: #1b4152;
  --nuit-filet: #2a5266;
  --nuit-pied: #0b222c;
  --nuit-texte: #ffffff;
  --nuit-texte-2: #c5d3d8;
  --nuit-texte-3: #9aaeb6;

  --sans: 'corps', 'corps-repli', Arial, 'Liberation Sans', system-ui, sans-serif;
  --serif: 'corps', 'corps-repli', Arial, 'Liberation Sans', system-ui, sans-serif;
  --chasse: 'mesure', 'mesure-repli', Arial, 'Liberation Sans', system-ui, sans-serif;
  --g-titre: 600;
  --g-fort: 600;
  --g-nav: 500;

  --t-display: clamp(2.25rem, 1.5rem + 3vw, 3.75rem);
  --t-titre: clamp(1.75rem, 1.25rem + 1.8vw, 2.5rem);
  --t-intertitre: clamp(1.375rem, 1.15rem + 0.9vw, 1.75rem);
  --t-sous-titre: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem);
  --t-chapo: clamp(1.0625rem, 1rem + 0.35vw, 1.1875rem);

  --t-valeur: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem);
  --t-corps: 1rem;
  --t-note: 0.8125rem;
  --t-folio: 0.75rem;
  --t-mesure: 0.6875rem;

  --pas: clamp(3rem, 1.5rem + 4vw, 6rem);

  --mesure-ligne: 60ch;
  --rayon: 0.75rem;
  --rayon-large: 1.25rem;
  --rayon-petit: 0.5rem;
  --rayon-pastille: 9999px;

  --ombre-carte: 0 1px 2px rgb(15 28 30 / 5%), 0 8px 24px rgb(15 28 30 / 8%);
  --ombre-levee: 0 2px 4px rgb(15 28 30 / 6%), 0 16px 40px rgb(15 28 30 / 12%);
  --ombre-entete: 0 2px 12px rgb(15 28 30 / 8%);
  --ombre-barre: 0 -2px 14px rgb(15 28 30 / 9%);

  --barre-h: calc(4.25rem + 1px);
  --onglets-h: calc(4rem + 1px);
  --bandeau-h: calc(2.25rem + 1px);

  --duree-vive: 150ms;
  --duree: 220ms;
  --duree-lente: 420ms;
  --detente: cubic-bezier(0.22, 0.61, 0.36, 1);

  --marque-cote: 2.5rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;

    --canevas: #0b1416;
    --surface: #132022;
    --bande: #1a2a2d;
    --filet: #24373b;
    --filet-fort: #33474b;

    --encre: #f2f4f3;
    --texte-2: #c3cccd;
    --texte-3: #95a3a5;
    --texte-4: #889699;
    --petrole: #cfe0e6;

    --accent-texte: #f6ae2f;
    --accent-lavis: #2a2110;

    --ombre-carte: 0 2px 10px rgb(0 0 0 / 50%);
    --ombre-levee: 0 8px 30px rgb(0 0 0 / 62%);
    --ombre-entete: 0 2px 10px rgb(0 0 0 / 55%);
    --ombre-barre: 0 -2px 14px rgb(0 0 0 / 55%);
  }
}

@media (max-width: 47.999rem), (pointer: coarse) {
  :root {
    --t-folio: 0.8125rem;
    --t-mesure: 0.8125rem;
    --bandeau-h: calc(2.75rem + 1px);
  }
}

@media (orientation: landscape) and (max-height: 32rem) and (pointer: coarse) and (max-width: 71.999rem) {
  :root { --onglets-h: calc(3rem + 1px); }
}

body {
  --gouttiere: 1rem;
  --large: 72rem;
}

@media (min-width: 40rem) {
  body { --gouttiere: 1.5rem; }
}

@media (min-width: 64rem) {
  body {
    --gouttiere: clamp(2rem, 2.5vw, 3.5rem);
    --large: clamp(72rem, calc(40rem + 45vw), 90rem);
  }
}

.folio-section,
.intitule,
.pied__titre,
.bloc-identification dt {
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
  margin: 0;
}

.folio-section {
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin: 0 0 1em;
}

.folio-section::before {
  content: '';
  flex: none;
  inline-size: 0.625rem;
  block-size: 0.625rem;
  border-radius: 3px;
  background: var(--accent-trace);
}

.chapo {
  font-size: var(--t-chapo);
  line-height: 1.55;
  color: var(--texte-3);
  max-inline-size: 42rem;
  margin: 0.8em 0 0;
}

.chapo + p,
.chapo + ul,
.chapo + ol,
.chapo + .points,
.chapo + .etapes { margin-block-start: 1.15em; }

.note {
  display: block;
  margin-block-start: 0.35em;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
  max-inline-size: 60ch;
}

.portrait {
  margin: 1.5rem 0 0;
  max-inline-size: 22rem;
}

.portrait img {
  display: block;
  inline-size: 100%;
  border-radius: var(--rayon-large);
}

main.page {
  padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem);
}

main.page:has(> .bande) { padding-block: 0; }

.bande {
  padding-block: var(--pas);
}

main.page > :is(.bande, .heros) {
  margin-inline: calc(50% - 50vw);
}
main.page > .bande + .bande { margin-block-start: 0; }

.bande--ivoire { background: var(--bande); }

.bande--nuit {
  background:
    radial-gradient(70% 90% at 100% 0%, rgb(246 174 47 / 10%), transparent 60%),
    var(--nuit);
  color: var(--nuit-texte);
}

.bande--nuit :is(h2, h3) { color: var(--nuit-texte); }
.bande--nuit :is(p, li, dd) { color: var(--nuit-texte-2); }
.bande--nuit .chapo { color: var(--nuit-texte-2); }
.bande--nuit .folio-section { color: var(--nuit-texte-3); }

.bande--nuit a:not(.bouton) { color: var(--accent-nuit); text-decoration-color: currentcolor; }

.heros {
  background: var(--bande);
  border-block-end: 1px solid var(--filet);
}
.heros__grille {
  display: grid;
  gap: 2rem;
  align-items: center;
  padding-block: clamp(2.5rem, 1.5rem + 3vw, 5rem) clamp(4rem, 3rem + 3vw, 6rem);
}
.heros__contenu { max-inline-size: 40rem; }

.heros h1 { margin-block: 0.4em 0; line-height: calc(0.94em + 0.3rem); text-wrap: pretty; }
.heros .chapo { color: var(--texte-2); max-inline-size: 36rem; }
.heros__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
  margin-block-start: 1.75rem;
}

.heros__actions .bouton--plein {
  min-block-size: 3.5rem;
  padding-inline: 2rem;
  font-size: 1.0625rem;
}

.heros__appel { margin: 0.5rem 0 0; max-inline-size: none; font-weight: var(--g-fort); }
.heros__appel a {
  display: inline-flex;
  align-items: center;
  min-block-size: 2.75rem;
  padding-block: 0.5rem;
  color: var(--accent-texte);
  text-decoration-line: underline;
  text-decoration-color: color-mix(in srgb, var(--accent-texte) 45%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.heros__appel a:hover { text-decoration-color: currentcolor; }
.heros__image {
  position: relative;
  min-inline-size: 0;
}
.heros__image picture {
  display: block;
  overflow: hidden;
  border-radius: var(--rayon-large);
  box-shadow: var(--ombre-levee);
}
.heros__image img {
  display: block;
  inline-size: 100%;
  aspect-ratio: 4 / 3;
  max-block-size: min(28rem, 42svh);
  object-fit: cover;
  object-position: 50% 30%;
}

.heros__image::before {
  content: '';
  position: absolute;
  inset-block-end: -0.75rem;
  inset-inline-end: -0.75rem;
  inline-size: 6rem;
  block-size: 6rem;
  border-radius: var(--rayon-large);
  background: var(--accent-trace);
  z-index: -1;
}

.metier {
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin: 0;

  max-inline-size: none;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent-texte);
}
.metier::before {
  content: '';
  flex: none;
  inline-size: 0.625rem;
  block-size: 0.625rem;
  border-radius: 3px;
  background: var(--accent-trace);
}

.heros__gages {
  list-style: none;
  margin: 1.75rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
  max-inline-size: 34rem;
}
.heros__gages li {
  display: flex;
  align-items: start;
  gap: 0.6rem;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-2);
}
.heros__gages li::before {
  content: '';
  flex: none;
  inline-size: 0.5rem;
  block-size: 0.85rem;
  margin-block-start: 0.05rem;
  margin-inline: 0.25rem 0.35rem;
  border-inline-end: 2px solid var(--accent);
  border-block-end: 2px solid var(--accent);
  rotate: 45deg;
}

@media (min-width: 62rem) {
  .heros__grille {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: clamp(2rem, 5vw, 5rem);
  }
  .heros__image img { max-block-size: none; }
}

.bouton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-block-size: 3rem;
  padding-inline: 1.5rem;
  max-inline-size: 100%;
  border: 1.5px solid transparent;
  border-radius: var(--rayon-pastille);
  font-family: var(--sans);
  font-size: 0.9375rem;
  font-weight: var(--g-fort);
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color var(--duree-vive) var(--detente),
    border-color var(--duree-vive) var(--detente),
    color var(--duree-vive) var(--detente),
    box-shadow var(--duree-vive) var(--detente);
}
.bouton svg { flex: none; }

.bouton--plein {
  background: var(--bouton-fond);
  border-color: var(--bouton-fond);
  color: var(--bouton-texte);
  box-shadow: var(--ombre-carte);
}
.bouton--plein:hover {
  background: var(--bouton-survol);
  border-color: var(--bouton-survol);
  box-shadow: var(--ombre-levee);
}

.bouton--contour {
  background: var(--surface);
  border-color: var(--texte-4);
  color: var(--encre);
}
.bouton--contour:hover {
  background: var(--bande);
  border-color: var(--encre);
}

.bouton--tel {
  min-block-size: 2.5rem; padding-inline: 0.9rem; white-space: nowrap;
  border-color: transparent;
  background: var(--accent-lavis); color: var(--accent-texte);
  font-size: var(--t-note);
}
.bouton--tel:hover {
  background: var(--bouton-fond);
  border-color: var(--bouton-fond);
  color: var(--bouton-texte);
}
@media (pointer: coarse) { .bouton--tel { min-block-size: 2.75rem; } }
.bouton--tel__numero { display: none; font-variant-numeric: tabular-nums; }
@media (min-width: 48rem) { .bouton--tel__numero { display: inline; } }

.bande--nuit .bouton--contour {
  background: transparent;
  border-color: rgb(255 255 255 / 55%);
  color: var(--nuit-texte);
}
.bande--nuit .bouton--contour:hover {
  background: rgb(255 255 255 / 10%);
  border-color: var(--nuit-texte);
  color: var(--nuit-texte);
}

@media (prefers-reduced-motion: no-preference) {
  .bouton { transition-property: background-color, border-color, color, box-shadow, translate, scale; }
  .bouton:hover { translate: 0 -1px; }
  .bouton:active { translate: 0 0; scale: 0.98; }
}

.appel {
  display: grid;
  gap: 1.5rem;
  align-items: center;
}
.appel h2 { max-inline-size: 22ch; }
.appel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
@media (min-width: 56rem) {
  .appel {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2.5rem;
  }
}

@view-transition { navigation: auto; }

.entete { view-transition-name: entete; }
.onglets { view-transition-name: onglets; }

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}

.saut {
  position: absolute; z-index: 60;
  inset-inline-start: 0.75rem; inset-block-start: -5rem;
  padding: 0.7rem 1rem; text-decoration: none;
  background: var(--surface); color: var(--encre);
  border: 2px solid var(--encre); border-radius: var(--rayon);
  font-weight: var(--g-fort);
  transition: inset-block-start var(--duree) var(--detente);
}
.saut:focus-visible { inset-block-start: 0.75rem; }

.utilitaire {
  background: var(--nuit);
  color: var(--nuit-texte-2);
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.utilitaire__contenu {
  display: flex; align-items: stretch; justify-content: space-between;
  gap: 1rem; min-block-size: calc(var(--bandeau-h) - 1px);
}
.utilitaire__coordonnees { display: flex; align-items: stretch; gap: 1.25rem; min-inline-size: 0; }

.utilitaire a { display: inline-flex; align-items: center; color: inherit; text-decoration: none; }
.utilitaire a:hover { color: var(--accent-nuit); }
.utilitaire a:focus-visible { outline-offset: -3px; }
.utilitaire__coordonnees a + a,
.utilitaire__contenu > span { display: none; }
@media (min-width: 40rem) {
  .utilitaire__coordonnees a + a,
  .utilitaire__contenu > span { display: inline-flex; align-items: center; }
}

.utilitaire a { white-space: nowrap; }
@media (pointer: coarse) and (max-width: 63.999rem) { .utilitaire__contenu > span { display: none; } }

.entete {
  position: sticky; inset-block-start: 0; z-index: 47;
  border-block-end: 1px solid var(--filet);
  container-type: scroll-state;
}
.entete__contenu {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2vw, 1.5rem);
  min-block-size: calc(var(--barre-h) - 1px);
}

.entete__contenu::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--surface);
  transition: background-color var(--duree) var(--detente), box-shadow var(--duree) var(--detente);
}
@supports (container-type: scroll-state) {
  @container scroll-state(stuck: top) {
    .entete__contenu::before { box-shadow: var(--ombre-entete); }
  }
}

.marque {
  display: flex; align-items: center; gap: 0.7rem;
  min-block-size: 2.75rem; min-inline-size: 0; margin-inline-end: auto;
  color: inherit; text-decoration: none;
}
.marque__textes { display: grid; align-content: center; gap: 0.05rem; min-inline-size: 0; }
.marque__nom {
  min-inline-size: 0; overflow-wrap: anywhere; color: var(--encre);
  font-family: var(--serif);
  font-size: clamp(1.125rem, 1rem + 0.4vw, 1.375rem);
  font-weight: var(--g-titre); letter-spacing: -0.01em; line-height: 1.1;
}
.marque__statut {
  display: none; color: var(--texte-3);
  font-family: var(--chasse);
  font-size: var(--t-mesure); line-height: 1.4;
  letter-spacing: 0.08em; text-transform: uppercase;
}
@media (min-width: 48rem) and (max-width: 71.999rem) { .marque__statut { display: block; } }

body:has(.metier) .marque__statut { display: none; }

.monogramme { flex: none; inline-size: var(--marque-cote); block-size: var(--marque-cote); }
@media (prefers-color-scheme: dark) {
  .monogramme > :first-child { fill: var(--nuit-surface); }
}

.nav { display: none; }
@media (min-width: 72rem) { .nav { display: flex; align-items: center; gap: 1.5rem; } }
.nav__lien {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-block-size: 2.75rem;
  font-size: 0.875rem;
  font-weight: var(--g-nav);
  line-height: 1.4;
  white-space: nowrap;
  color: var(--texte-2);
  text-decoration: none;
}
.nav__lien:hover { color: var(--encre); }

.nav__lien[aria-current] { color: var(--encre); }
.nav__lien[aria-current]::after {
  content: '';
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0.5rem;
  block-size: 3px; border-radius: 2px; background: var(--accent);
}
@media (forced-colors: active) {
  .nav__lien[aria-current] { text-decoration: underline; text-underline-offset: 0.35em; }
  .tiroir__lien[aria-current] { text-decoration: underline; border-inline-start-width: 6px; }
}

.entete__actions { display: flex; align-items: center; gap: 0.5rem; }
@media (min-width: 40rem) { .entete__actions { gap: 1rem; } }

.tiroir { position: relative; }
@media (min-width: 72rem) { .tiroir { display: none; } }
.tiroir__bouton {
  display: inline-flex; align-items: center; justify-content: center;
  min-block-size: 2.75rem; min-inline-size: 2.75rem;
  border: 0; border-radius: var(--rayon);
  background: transparent; color: var(--encre);
  cursor: pointer; list-style: none;
}
.tiroir__bouton::-webkit-details-marker { display: none; }
.tiroir__bouton::marker { content: ''; }
.tiroir:not([open]) > .tiroir__bouton:hover { background: var(--bande); }

.tiroir__case { display: contents; }
.tiroir__croix,
.tiroir__mot--fermer,
.tiroir[open] .tiroir__barres,
.tiroir[open] .tiroir__mot--ouvrir { display: none; }
.tiroir[open] .tiroir__croix,
.tiroir[open] .tiroir__mot--fermer { display: block; }
.tiroir__mot {
  position: absolute; inline-size: 1px; block-size: 1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

.tiroir[open] > .tiroir__bouton::before {
  content: '';
  position: fixed;
  inset: 0;
  cursor: default;
}

.tiroir__panneau {
  position: absolute;
  inset-block-start: calc(100% + 0.5rem);
  inset-inline-end: 0;
  z-index: 50;
  display: grid;
  inline-size: max-content;
  min-inline-size: 16rem;
  max-inline-size: calc(100vw - 2 * var(--gouttiere));
  max-block-size: calc(100svh - var(--barre-h) - var(--bandeau-h) - 1rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.75rem;
  background: var(--surface);
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  box-shadow: var(--ombre-levee);
  transition: opacity var(--duree-lente) var(--detente), translate var(--duree-lente) var(--detente);
}

@starting-style {
  .tiroir[open] .tiroir__panneau { opacity: 0; translate: 0 8px; }
}
.tiroir__lien {
  display: flex;
  align-items: center;
  min-block-size: 2.75rem;
  padding: 0.5rem 0.85rem;
  border-inline-start: 3px solid transparent;
  border-radius: var(--rayon-petit);
  font-size: 0.9375rem;
  font-weight: var(--g-nav);
  color: var(--texte-2);
  text-decoration: none;
}
.tiroir__lien:hover { background: var(--bande); color: var(--encre); }
.tiroir__lien[aria-current] {
  border-inline-start-color: var(--accent); background: var(--accent-lavis); color: var(--encre);
}

.pied {
  background: var(--nuit-pied);
  border-block-start: 1px solid var(--nuit-filet);
  color: var(--nuit-texte-2);
  font-size: var(--t-note);
}
.pied > .page { padding-block: clamp(2.5rem, 1.8rem + 2.2vw, 3.5rem); }
.pied__titre { margin-block-end: 0.9em; color: var(--nuit-texte); }
.pied .bloc-identification { border-color: var(--nuit-filet); }
.pied .bloc-identification dd { color: var(--nuit-texte); }
.pied .bloc-identification dt,
.pied .note { color: var(--nuit-texte-3); }
.pied__grille { display: grid; gap: 2rem; margin-block-start: 2rem; }
.pied__plan ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.1rem; }
.pied__plan a,
.pied__contact a {
  display: inline-flex;
  align-items: center;
  min-block-size: 1.75rem;
  font-size: var(--t-note);
  color: var(--nuit-texte-2);
  text-decoration: none;
}
@media (pointer: coarse) {

  .pied__plan a,
  .pied__contact a { min-block-size: 2.75rem; min-inline-size: 2.75rem; }
}
.pied__plan a:hover,
.pied__contact a:hover { color: var(--accent-nuit); text-decoration: underline; text-underline-offset: 0.18em; }
.pied dd a { color: var(--accent-nuit); text-decoration: underline; text-underline-offset: 0.18em; }
.pied__mention,
.pied__encaissement { max-inline-size: 70ch; color: var(--nuit-texte-2); }
.pied__arrete {
  margin-block-start: 2.5rem; padding-block-start: 1.25rem;
  border-block-start: 1px solid var(--nuit-filet);
  font-family: var(--chasse);
  font-size: var(--t-mesure); line-height: 1.5;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--nuit-texte-3); max-inline-size: none;
}
@media (min-width: 46rem) { .pied__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (min-width: 64rem) {
  .pied > .page {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: clamp(1.5rem, 3vw, 2.5rem);
    row-gap: 2rem;
    align-items: start;
  }
  .pied__grille { display: contents; }
  .bloc-identification { grid-column: 1 / span 2; grid-row: 1; border-block: 0; padding-block: 0; }
  .pied__mention,
  .pied__encaissement { grid-column: 1 / span 2; margin: 0; }
  .pied__plan { grid-column: 3; grid-row: 1 / span 5; }
  .pied__contact { grid-column: 4; grid-row: 1 / span 5; }
  .pied__arrete { grid-column: 1 / -1; margin-block-start: 0; }
}

.outils {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(0.75rem, 1.6vw, 1.25rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.outils > li { min-inline-size: 0; }
.outil {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 0.5rem;
  block-size: 100%;
  padding: 1.25rem 1.25rem 1.1rem;
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
  color: inherit;
  text-decoration: none;
  transition: box-shadow var(--duree) var(--detente), border-color var(--duree) var(--detente);
}
.outil:hover { box-shadow: var(--ombre-levee); border-color: var(--filet-fort); }
.outil:focus-visible { outline-offset: 3px; }
.outil__numero {
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--accent-texte);
}
.outil__titre {
  display: block;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-intertitre);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--encre);
  text-wrap: balance;
}
.outil__mot {
  max-inline-size: none;
  margin: 0;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
}

.outil__fleche {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-block-start: 0.5rem;
  font-size: var(--t-note);
  font-weight: var(--g-fort);
  color: var(--encre);
}
.outil__fleche::after {
  content: '';
  inline-size: 0.45rem;
  block-size: 0.45rem;
  border-block-start: 2px solid var(--accent);
  border-inline-end: 2px solid var(--accent);
  rotate: 45deg;
  transition: translate var(--duree-vive) var(--detente);
}
.outil:hover .outil__fleche::after { translate: 0.2rem 0; }
@media (min-width: 40rem) { .outils { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 62rem) { .outils { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.cartes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(0.75rem, 1.6vw, 1.5rem);
  margin-block: 1.5rem;
}
.carte {
  min-inline-size: 0;
  padding: clamp(1.25rem, 2.2vw, 1.75rem);
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
}
.carte > h3 { font-size: var(--t-sous-titre); line-height: 1.25; color: var(--encre); margin-block-end: 0.5em; }

.carte > h3::before {
  content: '';
  display: block;
  inline-size: 0.625rem;
  block-size: 0.625rem;
  margin-block-end: 0.85rem;
  border-radius: 3px;
  background: var(--accent-trace);
}
.carte > p { color: var(--texte-2); font-size: 0.9375rem; line-height: 1.55; }
.carte > p:last-child { margin-block-end: 0; }
.carte > h3 > a { color: inherit; text-decoration: none; }
.carte > h3 > a:hover { color: var(--accent-texte); }

.carte:has(> h3 > a) { position: relative; }
.carte > h3 > a::after { content: ''; position: absolute; inset: 0; border-radius: var(--rayon-large); }
.carte:has(> h3 > a) > :not(h3) a { position: relative; z-index: 1; }
.carte:has(> h3 > a:hover) { border-color: var(--texte-4); }
.carte:has(> h3 > a:focus-visible) { outline: 3px solid var(--accent); outline-offset: 2px; }
.carte:has(> h3 > a:focus-visible) > h3 > a { outline: none; }

@media (min-width: 43rem) {
  .cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cartes:has(> :nth-child(3)):not(:has(> :nth-child(4))) { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 62rem) {
  .cartes:has(> :nth-child(3)):not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 68rem) {
  .cartes:has(> :nth-child(4)):not(:has(> :nth-child(5))):not(section:has(> .folio-section) *) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cartes:has(> :nth-child(6)):not(:has(> :nth-child(7))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.reperes__liste {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin-block: 1.25rem;
  padding: 0;
  list-style: none;
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
  overflow: hidden;
}
.reperes__liste > li {
  min-inline-size: 0;
  padding: 1.25rem 1.5rem;
  border-block-start: 1px solid var(--filet);
}
.reperes__liste > li:first-child { border-block-start: 0; }
.reperes__chiffre {
  display: block;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-titre);
  line-height: 1.05;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  color: var(--petrole);
}
.reperes__mot {
  display: block;
  margin-block-start: 0.4rem;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
}
@media (min-width: 43rem) {
  .reperes__liste:has(> :nth-child(3)):not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .reperes__liste:has(> :nth-child(3)):not(:has(> :nth-child(4))) > li { border-block-start: 0; border-inline-start: 1px solid var(--filet); }
  .reperes__liste:has(> :nth-child(3)):not(:has(> :nth-child(4))) > li:first-child { border-inline-start: 0; }
}

@media (min-width: 34rem) {
  .reperes__liste:has(> :nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reperes__liste:has(> :nth-child(4)) > li:nth-child(-n + 2) { border-block-start: 0; }
  .reperes__liste:has(> :nth-child(4)) > li:nth-child(even) { border-inline-start: 1px solid var(--filet); }
}
@media (min-width: 68rem) {
  .reperes__liste:has(> :nth-child(4)):not(:has(> :nth-child(5))) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .reperes__liste:has(> :nth-child(4)):not(:has(> :nth-child(5))) > li { border-block-start: 0; border-inline-start: 1px solid var(--filet); }
  .reperes__liste:has(> :nth-child(4)):not(:has(> :nth-child(5))) > li:first-child { border-inline-start: 0; }
}

.jalons { margin-block: 1.5rem; padding: 0; list-style: none; }
.jalons > li {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: 1rem;
  row-gap: 0;
  padding-block-end: 1.75rem;
}
.jalons > li:last-child { padding-block-end: 0; }
.jalons > li:not(:last-child)::before {
  content: '';
  position: absolute;
  inset-block: 3rem 0.25rem;
  inset-inline-start: calc(1.25rem - 0.5px);
  inline-size: 1px;
  background: var(--filet-fort);
}
.jalons__rang {
  grid-column: 1;
  grid-row: 1 / span 20;
  display: grid;
  place-items: center;
  inline-size: 2.5rem;
  block-size: 2.5rem;
  max-inline-size: none;
  margin: 0;
  border-radius: var(--rayon-pastille);
  background: var(--accent-trace);
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  color: #0f1c1e;
}

.jalons__icone {
  inline-size: 1.25rem;
  block-size: 1.25rem;
  margin-inline-end: 0.5rem;
  vertical-align: -0.2em;
  color: var(--accent-texte);
}
.jalons > li > :not(.jalons__rang) { grid-column: 2; }
.jalons h3 { margin-block: 0.35rem 0.4rem; font-size: var(--t-sous-titre); line-height: 1.25; }
.jalons p:not(.jalons__rang) { margin-block-end: 0; color: var(--texte-2); }

.apres-jalons,
.apres-points,
.appel-en-ligne {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  max-inline-size: none;
  margin-block: 1.5rem 0;
}

.vitrine {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(0.75rem, 1.6vw, 1.5rem);
  margin-block: 1.5rem;
  padding: 0;
  list-style: none;
}
.vitrine__tuile {
  position: relative;
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
  transition: box-shadow var(--duree) var(--detente);
}
.vitrine__tuile:has(> a:hover),
.vitrine__tuile:has(> a:focus-visible) { box-shadow: var(--ombre-levee); }

.vitrine__tuile > a,
.vitrine__tuile > a:focus-visible:not(.bouton):not(.nav__lien):not(.tiroir__lien):not(.onglets__onglet):not(.outil) {
  display: block;
  color: inherit;
  text-decoration: none;
  border-radius: var(--rayon-large) var(--rayon-large) 0 0;
}
.vitrine__tuile picture {
  display: block;
  overflow: hidden;
  border-start-start-radius: var(--rayon-large);
  border-start-end-radius: var(--rayon-large);
}
.vitrine__tuile img {
  display: block;
  inline-size: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--bande);
}
.vitrine__titre {
  display: block;
  padding: 1rem 1.25rem 0;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-sous-titre);
  line-height: 1.2;
  color: var(--encre);
}
.vitrine__tuile > p {
  max-inline-size: none;
  margin: 0.4rem 0 0;
  padding: 0 1.25rem 1.25rem;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .vitrine__tuile img { transition: scale 300ms var(--detente); }
  .vitrine__tuile > a:hover img { scale: 1.03; }
}

@media (min-width: 40rem) { .vitrine { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 62rem) {
  .vitrine:has(> :nth-child(6)):not(:has(> :nth-child(7))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 68rem) {
  .vitrine:has(> :nth-child(4)):not(:has(> :nth-child(5))) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (prefers-color-scheme: dark) {
  .outil,
  .carte,
  .vitrine__tuile { border-color: var(--filet-fort); }
  .reperes__liste { border-color: var(--filet-fort); }
}

.banques { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-block: 1.25rem; padding: 0; list-style: none; }
.banque,
.etiquette {
  display: inline-flex; align-items: center; gap: 0.55rem; min-inline-size: 0; max-inline-size: 100%;
  border: 1px solid var(--filet); border-radius: var(--rayon-pastille); background: var(--surface);
}
.banque { padding: 0.25rem 0.9rem 0.25rem 0.25rem; }
.etiquette { padding: 0.25rem 0.75rem; font-size: var(--t-note); color: var(--texte-2); }
.banque__sceau {
  flex: none; display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; white-space: nowrap;
  border-radius: var(--rayon-pastille); background: var(--accent-lavis); font-family: var(--chasse);
  font-size: var(--t-mesure); letter-spacing: 0.04em; text-transform: uppercase; color: var(--accent-texte);
}

.banque__logo {
  flex: none; box-sizing: content-box; block-size: 1.25rem; inline-size: auto; max-inline-size: 6.5rem;
  padding: 0.375rem 0.5rem; border-radius: 4px; background: #fff; object-fit: contain;
}
.banque__nom { min-inline-size: 0; font-size: var(--t-note); line-height: 1.3; color: var(--texte-2); }

main > section > section:not(.reperes) { margin-block-start: var(--pas); }
.famille > h2 { margin-block-start: 0; font-size: var(--t-intertitre); line-height: 1.15; }
.famille__compte {
  display: flex;
  align-items: center;
  gap: 0.6em;
  max-inline-size: none;
  margin: 0 0 1em;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
}
.famille__compte::before {
  content: '';
  flex: none;
  inline-size: 0.625rem;
  block-size: 0.625rem;
  border-radius: 3px;
  background: var(--accent-trace);
}

@media (prefers-color-scheme: dark) {
  .banque__sceau { outline: 1px solid var(--filet-fort); outline-offset: -1px; }
}

.taux,
.tableau {
  overflow-x: auto;
  overscroll-behavior-x: contain;
  margin-block: 1.5rem;
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
  scrollbar-width: thin;
  scrollbar-color: var(--texte-4) transparent;
}
.taux table,
.tableau table { inline-size: 100%; border-collapse: collapse; }
.taux caption,
.tableau caption {
  position: sticky; inset-inline-start: 0;
  inline-size: min(100%, calc(100vw - 2.25rem));
  padding: 1rem 1.1rem 0.8rem;
  text-align: start;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--texte-3);
}
.taux :is(th, td),
.tableau :is(th, td) {
  padding: 0.65rem 1.1rem;
  text-align: start;
  font-size: 0.9375rem;
  line-height: 1.4;
}

.taux :is(th, td) { white-space: nowrap; }
.taux thead th,
.tableau thead th {
  font-family: var(--chasse);
  font-weight: 400;
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  vertical-align: bottom;
  white-space: normal;
  color: var(--texte-3);
  background: var(--bande);
  border-block: 1px solid var(--filet);
}
.taux tbody :is(th, td),
.tableau tbody :is(th, td) { border-block-start: 1px solid var(--filet); }
.taux tbody tr:first-child > *,
.tableau tbody tr:first-child > * { border-block-start: 0; }
.taux tbody td,
.tableau tbody td {
  color: var(--encre);
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: 1.125rem;
  font-variant-numeric: tabular-nums;
}

.taux:not(.taux--capacite) tbody td { font-size: var(--t-intertitre); line-height: 1.15; }

.taux :is(thead, tbody) th:first-child,
.tableau tbody th:first-child, .tableau:has(tbody tr > th:first-child) thead th:first-child { position: sticky; inset-inline-start: 0; border-inline-end: 1px solid var(--filet); }
.taux tbody th:first-child,
.tableau tbody th:first-child { background: var(--surface); }
.taux tbody th[scope='row'],
.tableau tbody th[scope='row'] { font-weight: var(--g-fort); font-size: 0.9375rem; color: var(--encre); }

.taux__source { margin-block: 0.75rem 0; font-size: var(--t-note); line-height: 1.5; color: var(--texte-3); }
.taux__reserves { margin-block: 1.25rem; padding: 0; list-style: none; }
.taux__reserves > li {
  position: relative;
  max-inline-size: var(--mesure-ligne);
  margin-block-end: 0.6rem;
  padding-inline-start: 1.25rem;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
}
.taux__reserves > li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0.55em;
  inline-size: 0.5rem;
  block-size: 0.5rem;
  border-radius: 2px;
  background: var(--accent-trace);
}

.taux-cartes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(0.75rem, 1.6vw, 1.25rem);
  margin-block: 1.5rem;
  padding: 0;
  list-style: none;
}
@media (min-width: 34rem) {
  .taux-cartes:has(> :nth-child(3)):not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.taux-carte {
  min-inline-size: 0;
  padding: 1.25rem 1.4rem;
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
}
.bande--nuit .taux-carte {
  border-color: var(--nuit-filet);
  background: var(--nuit-surface);
  box-shadow: none;
}
.taux-carte__valeur {
  max-inline-size: none;
  margin: 0;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: clamp(2rem, 1.5rem + 1.6vw, 2.75rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  color: var(--encre);
}
.bande--nuit .taux-carte__valeur { color: var(--nuit-texte); }
.taux-carte__mot {
  max-inline-size: none;
  margin: 0.5rem 0 0;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--texte-3);
}
.bande--nuit .taux-carte__mot { color: var(--nuit-texte-2); }
.bande--nuit .taux__source { color: var(--nuit-texte-3); }

.tarif {
  max-inline-size: calc(var(--mesure-ligne) + 3.5rem);
  margin-block: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid transparent;
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-levee);
}
.tarif__valeur {
  max-inline-size: none;
  margin: 0;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-titre);
  line-height: 1.05;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  color: var(--petrole);
}
.tarif__mot { max-inline-size: none; margin: 0.6rem 0 0; font-size: var(--t-note); line-height: 1.45; color: var(--texte-3); }
.tarif__points { margin: 1.25rem 0 0; padding: 0; list-style: none; }
.tarif__points > li {
  position: relative;
  padding: 0.55rem 0 0.55rem 1.4rem;
  border-block-start: 1px solid var(--filet);
  font-size: 0.9375rem;
  color: var(--texte-2);
}
.tarif__points > li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 1.05em;
  inline-size: 0.5rem;
  block-size: 0.5rem;
  border-radius: 2px;
  background: var(--accent-trace);
}
.tarif__arrete {
  max-inline-size: none;
  margin: 1.25rem 0 0;
  padding-block-start: 0.9rem;
  border-block-start: 1px solid var(--filet);
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
}

.bloc-identification { margin-block-end: 1.5rem; padding-block: 1.25rem; border-block: 1px solid var(--filet-fort); }
.bloc-identification__lignes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.9rem clamp(1.5rem, 4vw, 3rem);
  margin: 0;
}
@media (min-width: 46rem) {
  .bloc-identification__lignes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.bloc-identification__lignes > div { min-inline-size: 0; }
.bloc-identification dd { margin: 0.3rem 0 0; font-size: var(--t-note); line-height: 1.45; color: var(--encre); }

main dl:not([class]) { margin-block: 1.5rem; }
main dl:not([class]) > dt {
  margin-block-start: 1.25rem;
  padding-block-start: 1.25rem;
  border-block-start: 1px solid var(--filet);
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--texte-3);
}
main dl:not([class]) > dt:first-child { margin-block-start: 0; padding-block-start: 0; border-block-start: 0; }
main dl:not([class]) > dd { margin: 0.35rem 0 0; color: var(--encre); }

.points { margin-block: 1.25rem; padding: 0; list-style: none; }
.points > li {
  padding-block: 0.65rem;
  padding-inline-end: max(0rem, 100% - var(--mesure-ligne));
  border-block-start: 1px solid var(--filet);
}
.points > li:last-child { border-block-end: 1px solid var(--filet); }
.points .intitule { margin-inline-end: 0.45em; color: var(--encre); }

.faq { margin-block: 1.5rem; display: grid; gap: 0.5rem; }
.faq details {
  border: 1px solid var(--filet);
  border-radius: var(--rayon);
  background: var(--surface);
  padding-inline: 1.1rem;
  transition: border-color var(--duree-vive) var(--detente),
    background-color var(--duree-vive) var(--detente), box-shadow var(--duree-vive) var(--detente);
}
.faq details[open] { border-color: var(--filet-fort); }
.faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-block-size: 3rem;
  padding-block: 0.8rem;
  font-weight: var(--g-fort);
  color: var(--encre);
  cursor: pointer;
  list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }

@media (hover: hover) and (pointer: fine) {
  .faq details:hover { background: var(--bande); box-shadow: inset 0 0 0 2px var(--texte-4); }
}
.faq summary:focus-visible { outline-offset: -3px; border-radius: var(--rayon-petit); }
.faq__question { font: inherit; line-height: 1.4; margin: 0; letter-spacing: normal; text-wrap: wrap; min-inline-size: 0; }

.faq summary::after {
  content: '';
  flex: none;
  inline-size: 0.5rem;
  block-size: 0.5rem;
  margin-inline-end: 0.3rem;
  border-inline-end: 2px solid var(--texte-4);
  border-block-end: 2px solid var(--texte-4);
  rotate: 45deg;
  translate: 0 -0.15rem;
  transition: rotate var(--duree) var(--detente), border-color var(--duree-vive) var(--detente);
}
.faq details[open] summary::after {
  rotate: 225deg;
  translate: 0 0.15rem;
  border-color: var(--accent);
}
.faq details > :not(summary) { color: var(--texte-2); font-size: 0.9375rem; }
.faq details > :last-child { margin-block-end: 1.1rem; }

.etapes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem clamp(1rem, 2.5vw, 2rem);
  margin-block: 1.5rem;
  padding: 0;
  list-style: none;
}
@media (min-width: 34rem) {
  .etapes--fil { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.etapes > li {
  min-inline-size: 0;
  padding-block-start: 0.75rem;
  border-block-start: 2px solid var(--filet-fort);
}
.etapes > li[aria-current='step'] {
  padding-block-start: calc(0.75rem - 2px);
  border-block-start-width: 4px;
  border-block-start-color: var(--accent);
}
.etapes__cote {
  display: inline-block;
  max-inline-size: none;
  margin: 0;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
}
.etapes > li[aria-current='step'] .etapes__cote {
  padding: 0.1rem 0.55rem;
  border: 1px solid currentcolor;
  border-radius: var(--rayon-pastille);
  color: var(--accent-texte);
}
.etapes__nom {
  max-inline-size: none;
  margin-block: 0.4rem 0;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-sous-titre);
  line-height: 1.2;
  letter-spacing: 0;
  color: var(--texte-3);
}
.etapes > li[aria-current='step'] .etapes__nom { color: var(--encre); }
.etapes p:not(.etapes__cote):not(.etapes__nom) {
  max-inline-size: none;
  margin: 0.3rem 0 0;
  font-size: var(--t-note);
  line-height: 1.4;
  color: var(--texte-3);
}
@media (forced-colors: active) {
  .etapes > li[aria-current='step'] { border-block-start-color: Highlight; }
}

@media (prefers-color-scheme: dark) {
  .taux,
  .tableau,
  .taux-carte,
  .tarif,
  .faq details { border-color: var(--filet-fort); }
}

.onglets { display: none; }

@media (max-width: 47.999rem), (orientation: landscape) and (max-height: 32rem) and (pointer: coarse) and (max-width: 71.999rem) {

  :root {
    --onglets-reserve: calc(var(--onglets-h) + env(safe-area-inset-bottom, 0px) + 1.25rem);
    --onglets-marge: 0.25rem;
    --case-marge: 0.25rem;
  }

  .pied { padding-block-end: var(--onglets-reserve); }
  html { scroll-padding-block-end: var(--onglets-reserve); }

  .utilitaire,
  .entete .bouton--tel { display: none; }

  .onglets {
    position: fixed;
    inset-block-end: 0;
    inset-inline: 0;
    z-index: 45;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    background: var(--surface);
    border-block-start: 1px solid var(--filet);
    box-shadow: var(--ombre-barre);
    padding-block-end: env(safe-area-inset-bottom, 0px);
    padding-inline-start: max(var(--onglets-marge), env(safe-area-inset-left, 0px));
    padding-inline-end: max(var(--onglets-marge), env(safe-area-inset-right, 0px));
  }

  .onglets__onglet,
  .onglets__appel,
  .tiroir__case {
    position: relative;
    display: grid;
    grid-template-rows: 2rem auto;
    justify-items: center;
    align-items: center;
    align-content: center;
    row-gap: 0.15rem;
    min-block-size: calc(var(--onglets-h) - 1px);
    padding-block: 0.3rem;
    padding-inline: var(--case-marge);
    text-decoration: none;
    font-size: var(--t-mesure);
    font-weight: var(--g-nav);
    line-height: 1.25;
    text-align: center;
    overflow-wrap: normal;
    min-inline-size: 0;
    color: var(--texte-3);
    container-type: inline-size;
  }

  .onglets__onglet svg,
  .onglets__appel svg,
  .tiroir__case svg { inline-size: 1.375rem; block-size: 1.375rem; flex-shrink: 0; }

  .onglets__onglet:hover { color: var(--encre); }

  .onglets__onglet[aria-current] { color: var(--encre); }

  .onglets__onglet[aria-current]::after {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inline-size: 2rem;
    block-size: 3px;
    border-radius: 0 0 2px 2px;
    background: var(--accent);
  }

  .onglets__appel { color: var(--accent-texte); }

  .onglets__pastille {
    display: grid;
    place-items: center;
    inline-size: min(2rem, 100%);
    aspect-ratio: 1;
    border-radius: var(--rayon-pastille);
    background: var(--bouton-fond);
    color: var(--bouton-texte);
  }

  .onglets__pastille svg { inline-size: 1.25rem; block-size: 1.25rem; }

  .onglets__onglet:focus-visible,
  .onglets__appel:focus-visible,
  .tiroir__bouton:focus-visible .tiroir__case {
    outline: 3px solid var(--accent);
    outline-offset: -3px;
    border-radius: var(--rayon-petit);
  }

  .tiroir__bouton:focus-visible { outline: none; }

  .tiroir__bouton {
    position: fixed;
    z-index: 52;
    inset-block-end: 0;
    inset-inline-end: 0;
    inline-size: calc(max(var(--onglets-marge), env(safe-area-inset-right, 0px)) + (100% - max(var(--onglets-marge), env(safe-area-inset-left, 0px)) - max(var(--onglets-marge), env(safe-area-inset-right, 0px))) / 5);
    display: block;
    min-block-size: 0;
    min-inline-size: 0;
    border-radius: 0;
    background: transparent;
  }

  .tiroir:not([open]) > .tiroir__bouton:hover { background: transparent; }
  .tiroir__bouton:hover .tiroir__case { color: var(--encre); }

  .tiroir__case {
    min-block-size: calc(var(--onglets-h) - 1px + env(safe-area-inset-bottom, 0px));
    padding-block-end: calc(0.3rem + env(safe-area-inset-bottom, 0px));
    padding-inline-end: calc(var(--case-marge) + max(var(--onglets-marge), env(safe-area-inset-right, 0px)));
  }

  .tiroir__mot {
    position: static;
    inline-size: auto;
    block-size: auto;
    overflow: visible;
    clip-path: none;
    white-space: normal;
  }

  .tiroir[open] > .tiroir__bouton { inset-inline-start: 0; inline-size: auto; }

  .tiroir[open] .tiroir__case {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 0.5rem;
    padding-inline-start: calc(var(--case-marge) + max(var(--onglets-marge), env(safe-area-inset-left, 0px)));
    background: var(--surface);
    border-block-start: 1px solid var(--filet);
    font-size: var(--t-corps);
    color: var(--encre);
  }

  .tiroir[open] > .tiroir__bouton::before { z-index: -1; background: rgb(15 28 30 / 50%); }

  .tiroir__panneau {
    position: fixed;
    inset: auto 0 calc(var(--onglets-h) - 1px + env(safe-area-inset-bottom, 0px)) 0;
    z-index: 53;
    display: flex;
    flex-direction: column;
    row-gap: 0.15rem;
    inline-size: auto;
    min-inline-size: 0;
    max-inline-size: none;
    max-block-size: calc(100svh - var(--onglets-h) - env(safe-area-inset-bottom, 0px) - 3rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-block: 0.75rem;
    padding-inline-start: max(0.75rem, env(safe-area-inset-left, 0px));
    padding-inline-end: max(0.75rem, env(safe-area-inset-right, 0px));
    background:
      linear-gradient(var(--surface) 0 0) bottom / 100% 2.5rem no-repeat local,
      radial-gradient(farthest-side at 50% 100%, var(--ombre-defile), transparent) bottom / 100% 1rem no-repeat scroll,
      var(--surface);
    --ombre-defile: rgb(15 28 30 / 35%);
    border: 0;
    border-block-start: 1px solid var(--filet);
    border-radius: var(--rayon-large) var(--rayon-large) 0 0;
    box-shadow: var(--ombre-levee);
    transition: opacity var(--duree) var(--detente),
      display var(--duree) allow-discrete;
  }

  @starting-style {
    .tiroir[open] .tiroir__panneau { opacity: 0; translate: 0; }
  }

  body:has(.tiroir[open]) > *:not(.entete),
  body:has(.tiroir[open]) .entete > *:not(.tiroir) { visibility: hidden; }

  .tiroir[open],
  .tiroir[open] * { visibility: visible; }

  .tiroir__lien {
    display: flex;
    align-items: center;
    min-block-size: 3rem;
    padding-block: 0.6rem;
    padding-inline: 0.85rem;
    border-radius: var(--rayon);
    font-size: 1.125rem;
    line-height: 1.3;
    text-decoration: none;
    color: var(--encre);
  }

  .tiroir__lien:hover { background: var(--bande); }

  .tiroir__lien[aria-current] { background: var(--accent-lavis); color: var(--accent-texte); }

  @media (max-height: 50rem) {
    .tiroir__panneau {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr));
      align-content: start;
      column-gap: 0.25rem;
    }

    .tiroir__lien { min-block-size: 2.75rem; padding-block: 0.4rem; font-size: 1rem; }
  }

  @media (max-height: 36rem) {
    .entete { position: relative; }
    html { scroll-padding-block-start: 0.75rem; }
  }

  @media (orientation: landscape) and (max-height: 32rem) {
    .onglets__onglet,
    .onglets__appel,
    .tiroir__case {
      display: flex;
      flex-direction: row;
      justify-content: center;
      gap: 0.5rem;
    }
  }

  @media (max-width: 22.499rem) {
    :root { --onglets-marge: 0px; --case-marge: 0.125rem; }
  }

  @container (inline-size < 4.5em) {
    .onglets__onglet > span:last-child,
    .onglets__appel > span:last-child,
    .tiroir__mot {
      position: absolute;
      inline-size: 1px;
      block-size: 1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .tiroir__panneau { transition: none; }
  }

  @media (prefers-color-scheme: dark) {
    .onglets,
    .tiroir__panneau,
    .tiroir[open] .tiroir__case { border-block-start-color: var(--filet-fort); }
    .tiroir__panneau { --ombre-defile: rgb(0 0 0 / 80%); }
  }

  @media (forced-colors: active) {
    .onglets,
    .tiroir[open] .tiroir__case { border-block-start-color: CanvasText; }
    .onglets__pastille { border: 1px solid ButtonText; }

    .onglets__onglet[aria-current] { text-decoration: underline; text-underline-offset: 0.25em; }
    .onglets__onglet[aria-current]::after { background: Highlight; forced-color-adjust: none; }

    .tiroir__panneau { border: 1px solid CanvasText; }
  }
}

@media (pointer: coarse) {

  .points > li > .intitule {
    padding-block: 1rem;
    margin-block: -1rem;
  }
}

.panneau-hote { display: none; }

@media (min-width: 98.25rem) {
  .panneau-hote {
    display: block;
    position: fixed;
    inset-block-end: 1.25rem;
    inset-inline-end: 1.25rem;
    z-index: 46;
  }
}

.panneau {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.65rem;
}

.panneau__bouton { order: 2; }
.panneau__carte { order: 1; }

.panneau__bouton {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-block-size: 3rem;
  padding-inline: 1.25rem;
  border: 0;
  border-radius: var(--rayon-pastille);
  background: var(--bouton-fond);
  color: var(--bouton-texte);
  font-size: 0.9375rem;
  font-weight: var(--g-fort);
  cursor: pointer;
  box-shadow: var(--ombre-levee);
  list-style: none;
  transition: background-color var(--duree-vive) var(--detente);
}

.panneau__bouton::-webkit-details-marker { display: none; }
.panneau__bouton::marker { content: ''; }

.panneau__bouton:hover { background: var(--bouton-survol); }

.panneau[open] .panneau__bouton {
  background: var(--surface);
  color: var(--encre);
  box-shadow: var(--ombre-carte);
}

.panneau__carte {
  inline-size: min(21rem, calc(100vw - 2.5rem));
  padding: 1.25rem 1.25rem 1rem;
  border: 1px solid var(--filet-fort);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-levee);
  transition: opacity var(--duree-lente) var(--detente),
    translate var(--duree-lente) var(--detente),
    display var(--duree-lente) allow-discrete;
}

@starting-style {
  .panneau[open] .panneau__carte {
    opacity: 0;
    translate: 0 0.5rem;
  }
}

.panneau__titre {
  margin: 0 0 0.35rem;
  font-size: var(--t-sous-titre);
  line-height: 1.2;
  color: var(--encre);
}

.panneau__note {
  margin: 0 0 0.9rem;
  font-size: var(--t-note);
  line-height: 1.4;
  color: var(--texte-3);
}

.panneau__geste {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  min-block-size: 2.75rem;
  padding: 0.55rem 0.85rem;
  margin-block-end: 0.4rem;
  border: 1px solid var(--filet);
  border-radius: var(--rayon);
  text-decoration: none;
  font-weight: var(--g-fort);
  color: var(--encre);
  transition: background-color var(--duree-vive) var(--detente),
    border-color var(--duree-vive) var(--detente);
}

.panneau__geste:hover {
  border-color: var(--filet-fort);
  background: var(--accent-lavis);
}

.panneau__geste--plein {
  border-color: transparent;
  background: var(--bouton-fond);
  color: var(--bouton-texte);
}

.panneau__geste--plein:hover {
  border-color: transparent;
  background: var(--bouton-survol);
}

.panneau__menu,
.panneau__geste .num {
  font-size: var(--t-note);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
}

.panneau__geste--plein .num { color: var(--bouton-texte); }

.panneau__pied {
  margin: 0.75rem 0 0;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.panneau__pied a {
  color: var(--texte-3);
  text-decoration: none;
}

.panneau__pied a:hover { color: var(--accent-texte); }

@media (prefers-reduced-motion: reduce) {
  .panneau__bouton,
  .panneau__carte { transition: none; }
}

.jauge {
  position: fixed;
  inset-block-start: 0;
  inset-inline: 0;
  z-index: 60;
  block-size: 3px;
  pointer-events: none;
}

.jauge__trait {
  display: block;
  block-size: 100%;
  inline-size: 0;
  background: var(--accent-trace);
  transform-origin: left center;
}

@supports (animation-timeline: scroll()) {
  .jauge__trait {
    inline-size: 100%;
    scale: 0 1;
    animation: jauge-avance linear both;
    animation-timeline: scroll(root block);
  }
}

@keyframes jauge-avance {
  from { scale: 0 1; }
  to { scale: 1 1; }
}

@media (prefers-reduced-motion: reduce) {
  .jauge { display: none; }
}

.taux,
.tableau { position: relative; }

.taux::after,
.tableau::after {
  content: '';
  position: absolute;
  inset-block: 0;
  inset-inline-end: 0;
  inline-size: 3rem;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(to right, transparent, var(--surface));
}

@supports (animation-timeline: scroll()) {
  .taux::after,
  .tableau::after {
    animation: voile-defilement linear both;
    animation-timeline: scroll(nearest inline);
  }
}

@keyframes voile-defilement {
  from { opacity: 1; }
  to { opacity: 0; }
}

@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  .taux::after,
  .tableau::after { display: none; }
}

.parcours {
  margin-block-start: var(--pas);
}

.parcours__titre {
  margin-block: 2rem 0.6rem;
  font-size: var(--t-intertitre);
  line-height: 1.2;
  color: var(--encre);
}

.question {
  min-inline-size: 0;
  margin: 0;
  padding: 1.25rem;
  border: 1px solid transparent;
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
}

.question__legende { float: left; inline-size: 100%; padding: 0; margin-block-end: 0.85rem; }

.question__cote {
  display: inline-block;
  min-inline-size: 2.1em;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--texte-3);
  font-variant-numeric: tabular-nums;
}

.question__mot {
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-sous-titre);
  line-height: 1.25;
  color: var(--encre);
}

.question:has(.choix__bouton:checked) .question__cote {
  color: var(--accent-texte);
}

.choix-liste {
  clear: both;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.choix {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.65rem;
  min-block-size: 2.75rem;
  padding: 0.65rem 0.9rem;
  border-radius: var(--rayon);
  background: var(--canevas);
  cursor: pointer;
  box-shadow: inset 0 0 0 1px var(--filet-fort);
  transition:
    background-color var(--duree-vive) var(--detente),
    box-shadow var(--duree-vive) var(--detente);
}

@media (hover: hover) and (pointer: fine) {
  .choix:hover {
    background: var(--bande);
    box-shadow: inset 0 0 0 2px var(--texte-4);
  }
}

.choix__bouton {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  white-space: nowrap;
  clip-path: inset(50%);
}

.choix__marque {
  inline-size: 1.15rem;
  block-size: 1.15rem;
  border: 2px solid var(--texte-4);
  border-radius: var(--rayon-pastille);
  background: var(--surface);
}

.choix__nom {
  min-inline-size: 0;
  font-size: var(--t-corps);
  line-height: 1.35;
  color: var(--texte-2);
  text-wrap: pretty;
}

.choix:has(.choix__bouton:checked) {
  background: var(--accent-lavis);
  box-shadow: inset 0 0 0 3px var(--accent);
}

.choix:has(.choix__bouton:checked) .choix__marque {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 0.32rem var(--accent);
}

.choix:has(.choix__bouton:checked) .choix__nom {
  color: var(--encre);
  font-weight: var(--g-fort);
}

.choix:has(.choix__bouton:focus-visible) {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

@media (forced-colors: active) {
  .choix__bouton {
    position: static;
    inline-size: 1.15rem;
    block-size: 1.15rem;
    overflow: visible;
    clip-path: none;
  }
  .choix__marque {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .choix { transition: none; }
}

.parcours__compte {
  margin-block: 1rem 0;
  font-size: var(--t-note);
  color: var(--texte-3);
}

.parcours__liste {
  counter-reset: piece;
  margin-block-start: 0.75rem;
}

.parcours__compte-n {
  color: var(--encre);
  font-weight: var(--g-fort);
  font-variant-numeric: tabular-nums;
}

.parcours__compte-n::after {
  content: counter(piece);
}

.parcours__bande {
  margin-block-start: 2rem;
  padding: 1.25rem 1.5rem 1.5rem;
  border: 1px solid transparent;
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
}

.parcours__bande-titre {
  margin-block: 0.35rem 0.5rem;
  font-size: var(--t-intertitre);
  line-height: 1.2;
  color: var(--encre);
}

.parcours__chapo {
  max-inline-size: var(--mesure-ligne);
  margin-block-end: 1.25rem;
  font-size: var(--t-note);
  color: var(--texte-3);
}

.parcours__bloc {
  margin-block-start: 1.25rem;
}

.parcours__bloc-titre {
  margin-block: 0 0.35rem;
  font-size: var(--t-corps);
  line-height: 1.3;
  color: var(--accent-texte);
}

.parcours__pourquoi {
  max-inline-size: var(--mesure-ligne);
  margin-block: 0 0.6rem;
  font-size: var(--t-note);
  color: var(--texte-3);
}

.parcours__pieces {
  margin: 0;
  padding: 0;
  list-style: none;
}

.parcours__piece {
  counter-increment: piece;
  display: grid;

  grid-template-columns: 1.6rem minmax(0, 1fr);
  gap: 0.1rem 0.7rem;
  padding-block: 0.55rem;
  border-block-start: 1px solid var(--filet);
}

.parcours__piece::before {
  content: counter(piece, decimal-leading-zero);
  grid-row: 1 / span 3;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  color: var(--texte-3);
  font-variant-numeric: tabular-nums;
  padding-block-start: 0.3em;
}

.parcours__piece-nom {
  color: var(--texte-2);
  text-wrap: pretty;
}

.parcours__ou,
.parcours__precision {
  grid-column: 2;
  font-size: var(--t-note);
  color: var(--texte-3);
}

.parcours__ou-mot {
  font-family: var(--chasse);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: var(--t-mesure);
  color: var(--accent-texte);
}

@media (prefers-color-scheme: dark) {
  .question,
  .parcours__bande { border-color: var(--filet-fort); }
}

.parcours:has(#pq-logement-proprietaire:checked) .parcours__bloc[data-logement]:not([data-logement="proprietaire"]),
.parcours:has(#pq-logement-locataire:checked) .parcours__bloc[data-logement]:not([data-logement="locataire"]),
.parcours:has(#pq-logement-heberge-chez-un-proprietaire:checked) .parcours__bloc[data-logement]:not([data-logement="heberge-chez-un-proprietaire"]),
.parcours:has(#pq-logement-heberge-chez-un-locataire:checked) .parcours__bloc[data-logement]:not([data-logement="heberge-chez-un-locataire"]),

.parcours:has(#pq-activite-salarie:checked) .parcours__bloc[data-activite]:not([data-activite="salarie"]),
.parcours:has(#pq-activite-a-son-compte:checked) .parcours__bloc[data-activite]:not([data-activite="a-son-compte"]),

.parcours:has(#pq-credits-en-cours-non:checked) [data-retrait~="credits-en-cours"],
.parcours:has(#pq-biens-en-location-non:checked) [data-retrait~="biens-en-location"],
.parcours:has(#pq-projet-travaux-non:checked) [data-retrait~="projet-travaux"],
.parcours:has(#pq-projet-locatif-non:checked) [data-retrait~="projet-locatif"],

.parcours:has(#pq-horizon-compromis-signe:checked) [data-horizon-hors~="compromis-signe"],
.parcours:has(#pq-horizon-bien-trouve:checked) [data-horizon-hors~="bien-trouve"],
.parcours:has(#pq-horizon-sous-trois-mois:checked) [data-horizon-hors~="sous-trois-mois"],
.parcours:has(#pq-horizon-sous-six-mois:checked) [data-horizon-hors~="sous-six-mois"],
.parcours:has(#pq-horizon-recherche-en-cours:checked) [data-horizon-hors~="recherche-en-cours"],
.parcours:has(#pq-horizon-sans-idee:checked) [data-horizon-hors~="sans-idee"],

.parcours:has(#pq-credits-en-cours-non:checked):has(#pq-biens-en-location-non:checked) .parcours__bande[data-bande="engagements"],
.parcours:has(#pq-horizon-sous-trois-mois:checked):has(#pq-projet-travaux-non:checked):has(#pq-projet-locatif-non:checked) .parcours__bande[data-bande="projet"],
.parcours:has(#pq-horizon-sous-six-mois:checked):has(#pq-projet-travaux-non:checked):has(#pq-projet-locatif-non:checked) .parcours__bande[data-bande="projet"],
.parcours:has(#pq-horizon-recherche-en-cours:checked):has(#pq-projet-travaux-non:checked):has(#pq-projet-locatif-non:checked) .parcours__bande[data-bande="projet"],
.parcours:has(#pq-horizon-sans-idee:checked):has(#pq-projet-travaux-non:checked):has(#pq-projet-locatif-non:checked) .parcours__bande[data-bande="projet"] {
  display: none;
}

.pas {
  margin-block: 1.5rem 2.5rem;
}

.pas > .question + .question,
.pas > .pas__fin { margin-block-start: 1rem; }

.pas > .question { max-inline-size: 52rem; }

.pas .question__cote {
  display: block;
  min-inline-size: 0;
  color: var(--accent-texte);
}

.pas__jauge {
  display: flex;
  gap: 0.3rem;
  margin-block: 0.6rem 1rem;
}

.pas__jauge > span {
  flex: 1 1 0;
  block-size: 0.3rem;
  border-radius: var(--rayon-pastille);
  background: var(--filet-fort);
}

.pas__jauge > .est { background: var(--accent); }

.pas .question__mot {
  display: block;
  font-size: var(--t-intertitre);
  text-wrap: balance;
}

.pas .choix-liste { gap: 0.65rem; }

.pas .choix {
  min-block-size: 3.75rem;
  padding: 0.9rem 1.1rem;
  gap: 0.85rem;
}

.pas .choix__marque {
  inline-size: 1.35rem;
  block-size: 1.35rem;
}

.pas .choix__nom { font-size: 1.0625rem; }

.pas__nav,
.pas__suite { display: none; }

.pas__nav {
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  max-inline-size: none;
  margin-block: 1.25rem 0;
}

.pas__zero {
  display: inline-flex;
  align-items: center;
  min-block-size: 2.75rem;
  margin-inline-start: auto;
  padding-inline: 0.5rem;
  color: var(--texte-2);
  font-size: 0.9375rem;
}

.pas__fin {
  display: flex;
  flex-direction: column;
}

.pas__fin > .parcours__titre { margin-block-start: 0; }

.pas__fin > .parcours__titre,
.pas__fin > .parcours__titre + p { order: -3; }
.pas__fin > .parcours__compte { order: -2; margin-block: 0 0.25rem; }
.pas__fin > .parcours__liste { order: -1; }

.pas__depot {
  margin-block-start: 2rem;
  padding: 1.25rem 1.5rem 1.5rem;
  border-radius: var(--rayon-large);
  background: var(--accent-lavis);
}

.pas__depot > p:first-child { margin-block-start: 0; color: var(--encre); }
.pas__depot > .appel-en-ligne { margin-block-start: 1rem; }

@supports selector(:has(*)) {
  .pas { position: relative; }

  .pas__nav { display: flex; }
  .pas .question:target:has(:checked) .pas__suite { display: inline-flex; }

  .pas > .question {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    visibility: hidden;
    transition: visibility 0s linear 0.2s;
  }

  .pas > .question:not(:has(:checked)):not(.question:not(:has(:checked)) ~ .question),
  .pas > .question:target:has(:checked),
  .pas > .question:has(:focus-visible) {
    position: static;
    inline-size: auto;
    block-size: auto;
    overflow: visible;
    clip-path: none;
    visibility: visible;
    transition-delay: 0s;
  }

  .pas > .question:target:has(:checked) ~ .question:not(:has(:focus-visible)),
  .pas > .question:not(:has(:checked)) ~ .pas__fin,
  .pas > .question:target:has(:checked) ~ .pas__fin {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    visibility: hidden;
    transition: visibility 0s linear 0.2s;
  }

  .pas > .question + .question,
  .pas > .pas__fin { margin-block-start: 0; }
}

@media (min-width: 40rem) {
  .pas .choix-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media print {
  .pas__nav { display: none; }
}

.simu {
  margin-block: 2.5rem var(--pas);
}

.simu__champs {
  display: grid;
  gap: 1rem;
  margin-block: 1.25rem;
}

@media (min-width: 52rem) {
  .simu__champs {
    grid-template-columns: 2fr 1fr;
    align-items: start;
  }
}

.simu__champ {
  min-inline-size: 0;
  margin: 0;
  padding: 1.25rem;
  border: 1px solid transparent;
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
}

.simu__legende {
  float: left;
  inline-size: 100%;
  padding: 0;
  margin-block-end: 0.85rem;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-sous-titre);
  line-height: 1.25;
  color: var(--encre);
}

.simu__liste {
  clear: both;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 7.5rem), 1fr));
}

.simu__panneau {
  padding: 1.5rem;
  border: 1px solid var(--nuit-filet);
  border-radius: var(--rayon-large);
  background:
    radial-gradient(70% 90% at 100% 0%, rgb(246 174 47 / 10%), transparent 60%),
    var(--nuit);
  color: var(--nuit-texte-2);
}

.simu__titre {
  margin-block: 0 0.6rem;
  font-size: var(--t-intertitre);
  line-height: 1.2;
  color: var(--nuit-texte);
}

.simu__invite {
  max-inline-size: var(--mesure-ligne);
  margin: 0;
  color: var(--nuit-texte-2);
}

.simu:has(.simu__bouton-revenu:checked) .simu__invite {
  display: none;
}

.simu__groupe {
  display: none;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
}

.simu__mensualite {
  grid-column: 1 / -1;
  margin: 0;
  font-size: var(--t-note);
  letter-spacing: 0.02em;
  color: var(--nuit-texte-3);
}

.simu__mensualite-n {
  font-size: var(--t-corps);
  font-weight: var(--g-fort);
  color: var(--nuit-texte);
  font-variant-numeric: tabular-nums;
}

.simu__cellule {
  padding: 1rem;
  border-radius: var(--rayon);
  background: var(--nuit-surface);
  outline: 3px solid transparent;
  outline-offset: -3px;
  transition:
    background-color var(--duree-vive) var(--detente),
    outline-color var(--duree-vive) var(--detente);
}

.simu__duree {
  margin: 0;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--nuit-texte-2);
}

.simu__capital {
  margin-block: 0.25rem 0;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-intertitre);
  line-height: 1.15;
  color: var(--nuit-texte);
  font-variant-numeric: tabular-nums;
  text-wrap: nowrap;
}

.simu__retenue {
  display: var(--simu-retenue, none);
  margin-block: 0.4rem 0;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent-nuit);
}

.simu__reserve {
  max-inline-size: var(--mesure-ligne);
  margin-block: 1.25rem 0;
  font-size: var(--t-note);
  color: var(--nuit-texte-3);
}

@media (prefers-reduced-motion: reduce) {
  .simu__cellule {
    transition: none;
  }
}

@media (prefers-color-scheme: dark) {
  .simu__champ { border-color: var(--filet-fort); }
}

.simu:has(#simu-r-1800:checked) .simu__groupe[data-revenu="1800"],
.simu:has(#simu-r-2100:checked) .simu__groupe[data-revenu="2100"],
.simu:has(#simu-r-2400:checked) .simu__groupe[data-revenu="2400"],
.simu:has(#simu-r-2700:checked) .simu__groupe[data-revenu="2700"],
.simu:has(#simu-r-3000:checked) .simu__groupe[data-revenu="3000"],
.simu:has(#simu-r-3300:checked) .simu__groupe[data-revenu="3300"],
.simu:has(#simu-r-3600:checked) .simu__groupe[data-revenu="3600"],
.simu:has(#simu-r-3900:checked) .simu__groupe[data-revenu="3900"],
.simu:has(#simu-r-4200:checked) .simu__groupe[data-revenu="4200"],
.simu:has(#simu-r-4500:checked) .simu__groupe[data-revenu="4500"],
.simu:has(#simu-r-4800:checked) .simu__groupe[data-revenu="4800"],
.simu:has(#simu-r-5100:checked) .simu__groupe[data-revenu="5100"],
.simu:has(#simu-r-5400:checked) .simu__groupe[data-revenu="5400"],
.simu:has(#simu-r-5700:checked) .simu__groupe[data-revenu="5700"],
.simu:has(#simu-r-6000:checked) .simu__groupe[data-revenu="6000"] {
  display: grid;
}

.simu:has(#simu-d-15:checked) .simu__cellule[data-duree="15"],
.simu:has(#simu-d-20:checked) .simu__cellule[data-duree="20"],
.simu:has(#simu-d-25:checked) .simu__cellule[data-duree="25"] {
  --simu-retenue: block;
  --simu-ordre: -1;
  background: rgb(246 174 47 / 12%);
  outline-color: var(--accent-trace);
}

.bande--outils {
  position: relative;
  z-index: 1;
  padding-block: 0 var(--pas);
}
.bande--outils .outils {
  margin-block-start: calc(-1 * clamp(2.5rem, 2rem + 2vw, 3.5rem));
}

.bande--serree { padding-block: 0 var(--pas); }
.bande--serree .reperes__liste { margin-block: 0; }

.bande__tete {
  display: grid;
  gap: 1rem;
  align-items: end;
  margin-block-end: 1.5rem;
}
.bande__tete h2 { margin: 0; max-inline-size: 22ch; }
.bande__tete .chapo { margin-block-start: 0.6em; }
.bande__lien { max-inline-size: none; margin: 0; }
@media (min-width: 56rem) {
  .bande__tete { grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; }
  .bande__lien { padding-block-end: 0.25rem; }
}

.duo {
  display: grid;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
}
.duo > * { min-inline-size: 0; }
.duo h2 { margin-block-start: 0; }
.duo .jalons { margin-block-start: 1.25rem; }
@media (min-width: 62rem) {
  .duo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.vigilance {
  padding: 1.5rem 1.5rem 1.5rem 1.75rem;
  border: 1px solid var(--filet);
  border-inline-start: 5px solid var(--accent-trace);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
}
.vigilance h2,
.vigilance h3 {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-block: 0 0.6em;
  font-size: var(--t-intertitre);
}
.vigilance :is(h2, h3)::before {
  content: '!';
  flex: none;
  display: grid;
  place-items: center;
  inline-size: 1.75rem;
  block-size: 1.75rem;
  border-radius: var(--rayon-pastille);
  background: var(--accent-trace);
  font-family: var(--serif);
  font-size: 1.125rem;
  color: #0f1c1e;
}
.vigilance p { max-inline-size: none; font-size: 0.9375rem; }

@media (max-width: 47.999rem), (pointer: coarse) { .vigilance p { font-size: var(--t-corps); } }
.vigilance p:last-child { margin-block-end: 0; }
.vigilance__coordonnees {
  display: grid;
  gap: 0.35rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}
.vigilance__coordonnees li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.6rem;
  font-size: var(--t-note);
}
.vigilance__coordonnees .intitule { color: var(--texte-3); }
.vigilance__coordonnees strong { font-variant-numeric: tabular-nums; }

.bande--logos .banques {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.25rem, 1fr));
  gap: 0.5rem;
  margin-block-start: 1.75rem;
}
@media (max-width: 40rem) {
  .bande--logos .banques { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.375rem; }
}
.bande--logos .banque {
  flex-direction: column;
  justify-content: center;
  gap: 0.4rem;
  min-inline-size: 0;
  padding: 0.65rem 0.4rem 0.55rem;
  border-color: var(--filet);
  border-radius: var(--rayon);
  box-shadow: var(--ombre-carte);
}
.bande--logos .banque__logo {
  block-size: 1.5rem;
  max-inline-size: min(7.5rem, 100% - 0.5rem);
  padding: 0.125rem 0.25rem;
}
.bande--logos .banque__nom {
  font-size: var(--t-folio);
  line-height: 1.25;
  text-align: center;
  color: var(--texte-3);
}

.credits-logos { margin: 1rem 0 0; padding: 0; list-style: none; font-size: var(--t-folio); color: var(--texte-3); }

@media (prefers-color-scheme: dark) {
  .vigilance { border-color: var(--filet-fort); border-inline-start-color: var(--accent-trace); }
  .bande--logos .banque { border-color: var(--filet-fort); }
}

.fil-ariane ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35em;
  margin: 0 0 1.5rem;
  padding: 0;
  list-style: none;
  font-size: var(--t-note);
  color: var(--texte-3);
}
.fil-ariane li + li::before {
  content: '/';
  margin-inline-end: 0.35em;
  color: var(--texte-4);
}
.fil-ariane a { color: var(--texte-3); text-decoration: none; }

@media (pointer: coarse) {
  .fil-ariane ol { align-items: center; row-gap: 0; }
  .fil-ariane a { display: inline-flex; align-items: center; justify-content: center; min-block-size: 2.75rem; min-inline-size: 2.75rem; }
}
.fil-ariane a:hover { color: var(--accent-texte); text-decoration: underline; }
.fil-ariane [aria-current='page'] { color: var(--texte-2); }

.blog__sujets ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.blog__sujets a {
  display: inline-block;
  padding: 0.4em 0.95em;
  border: 1px solid var(--filet-fort);
  border-radius: var(--rayon-pastille);
  background: var(--surface);
  font-size: var(--t-note);
  font-weight: var(--g-nav);
  color: var(--texte-2);
  text-decoration: none;
}
.blog__sujets a:hover { border-color: var(--accent); color: var(--accent-texte); }
@media (pointer: coarse) { .blog__sujets a { display: inline-flex; align-items: center; min-block-size: 2.75rem; } }

.blog__grappe {
  margin-block-start: var(--pas);
  padding-block-start: clamp(1.5rem, 3vw, 2.25rem);
  border-block-start: 1px solid var(--filet-fort);
}
.blog__grappe-tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.5rem;
}
.blog__grappe-tete h2 { margin: 0; font-size: var(--t-intertitre); }
.blog__tout-voir {
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--accent-texte);
  text-underline-offset: 0.25em;
}
.blog__tout-voir:hover { color: var(--encre); }

@media (pointer: coarse) { .blog__tout-voir { display: inline-flex; align-items: center; column-gap: 0.3em; min-block-size: 2.75rem; } }

.grille-articles {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(1rem, 2vw, 1.5rem);
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 43rem) {
  .grille-articles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 68rem) {
  .grille-articles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.carte-article--index {
  position: relative;
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
  overflow: hidden;
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-carte);
  transition: box-shadow var(--duree) var(--detente), border-color var(--duree) var(--detente);
}
.carte-article--index:hover { box-shadow: var(--ombre-levee); border-color: var(--filet-fort); }

.carte-article__titre a::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
}
.carte-article--index:has(a:focus-visible) {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}
.carte-article__titre a:focus-visible { outline: none; }

.carte-article__vignette { display: block; }
.carte-article__vignette img {
  display: block;
  inline-size: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--bande);
}

.carte-article__texte {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.5rem;
  padding: clamp(1.1rem, 2vw, 1.5rem);
}
.carte-article__folio,
.carte-article__meta {
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
  margin: 0;
  max-inline-size: none;
}
.carte-article__meta { margin-block-start: auto; padding-block-start: 0.5rem; }
.carte-article__titre {
  font-size: var(--t-sous-titre);
  line-height: 1.25;
  margin: 0;
}
.carte-article__titre a { color: inherit; text-decoration: none; }
.carte-article--index:hover .carte-article__titre a { color: var(--accent-texte); }
.carte-article--index .carte-article__chapo {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--texte-2);
  max-inline-size: none;
}

.carte-article__credit {
  position: relative;
  z-index: 1;
  display: block;
  font-size: var(--t-folio);
  line-height: 1.4;
  color: var(--texte-3);
}
.carte-article__credit a { color: inherit; }

.articles-lies__liste {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 43rem) {
  .articles-lies__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.articles-lies__liste > .carte-article {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 1.1rem 1.25rem;
  border: 1px solid var(--filet-fort);
  border-radius: var(--rayon);
  background: var(--surface);
}
.articles-lies__liste > .carte-article > a {
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: 1.125rem;
  line-height: 1.3;
  color: var(--encre);
  text-decoration: none;
}
.articles-lies__liste > .carte-article > a:hover { color: var(--accent-texte); }

.articles-lies__liste > .carte-article { position: relative; }
.articles-lies__liste > .carte-article > a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.articles-lies__liste > .carte-article:has(> a:focus-visible) { outline: 3px solid var(--accent); outline-offset: 2px; }
.articles-lies__liste > .carte-article > a:focus-visible { outline: none; }
.articles-lies__liste > .carte-article > .carte-article__chapo {
  font-size: var(--t-note);
  line-height: 1.5;
  color: var(--texte-3);
}
.blog__bloc + .blog__bloc { margin-block-start: var(--pas); }
.blog__bloc > h2 { font-size: var(--t-intertitre); }

@media (prefers-color-scheme: dark) {
  .carte-article--index { border-color: var(--filet-fort); }
}

@media (prefers-reduced-motion: reduce) {
  .carte-article--index { transition: none; }
}

.article {
  max-inline-size: 42rem;
  margin-inline: auto;
}
.article__entete h1 {
  font-size: clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin-block: 0.4em 0;
}
.article__entete .folio-section { margin-block-end: 1em; }
.article__entete .chapo { max-inline-size: none; }
.article__meta {
  margin: 1.25rem 0 0;
  max-inline-size: none;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
}
.article__meta-fort { color: var(--encre); }
.article__entete .note { margin-block-start: 0.75rem; }

.article__signature {
  margin: 1.25rem 0 0;
  max-inline-size: none;
  font-size: var(--t-note);
  line-height: 1.5;
  color: var(--texte-2);
}
.article__signature a { color: var(--encre); font-weight: var(--g-fort); text-underline-offset: 0.2em; }
.article__signature a:hover { color: var(--accent-texte); }
.article__signature + .article__meta { margin-block-start: 0.35rem; }
.article__entete .reponse { margin: 1.5rem 0 0; max-inline-size: none; }

.essentiel,
.sommaire { margin-block: 2rem 0; }
.essentiel {
  padding: 1.1rem 1.35rem 0.35rem;
  border: 1px solid var(--filet-fort);
  border-block-start: 3px solid var(--accent-trace);
  border-radius: var(--rayon);
  background: var(--surface);
}
.essentiel__titre,
.sommaire__titre {
  margin: 0 0 0.5rem;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--texte-3);
}
.essentiel .points { margin-block: 0; }

.essentiel .points > li { padding-inline-end: 0; color: var(--encre); }
.essentiel .points > li:last-child { border-block-end: 0; }
.sommaire { padding-inline-start: 1.25rem; border-inline-start: 1px solid var(--filet-fort); }
.sommaire ol {
  margin: 0;
  padding-inline-start: 1.6em;
  font-size: var(--t-note);
  line-height: 1.45;
}
.sommaire li { margin-block: 0.4em; }
.sommaire li::marker {
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  font-variant-numeric: tabular-nums;
  color: var(--texte-3);
}
.sommaire a { color: var(--texte-2); text-decoration-color: var(--filet-fort); text-underline-offset: 0.2em; }
.sommaire a:hover { color: var(--accent-texte); text-decoration-color: currentcolor; }

.illustration {
  margin: 2rem 0;
  max-inline-size: 42rem;
}
.illustration__image {
  display: block;
  inline-size: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--rayon-large);
  background: var(--bande);
}
.illustration figcaption {
  margin-block-start: 0.6rem;
  font-size: var(--t-folio);
  line-height: 1.45;
  color: var(--texte-3);
}
.illustration__credit { font-size: inherit; }
.illustration__credit a { color: inherit; }
.article__corps .illustration { margin-block: 2.5rem 2rem; }

.article__corps {
  margin-block-start: 2rem;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--texte-2);
}
.article__corps p,
.article__corps li { max-inline-size: none; }
.article__corps p { margin-block: 0 1.1em; }
.article__corps h2 {
  font-size: var(--t-intertitre);
  line-height: 1.2;
  margin-block: 2em 0.6em;
}
.article__corps h3 {
  font-size: var(--t-sous-titre);
  line-height: 1.3;
  margin-block: 1.6em 0.5em;
}
.article__corps :is(ul, ol) {
  margin: 0 0 1.1em;
  padding-inline-start: 1.35em;
}
.article__corps li { margin-block: 0.35em; }
.article__corps li::marker { color: var(--accent-texte); }
.article__corps blockquote {
  margin: 1.5em 0;
  padding: 0.25em 0 0.25em 1.25em;
  border-inline-start: 3px solid var(--accent-trace);
  color: var(--texte-3);
}
.article__corps .tableau { margin-block: 1.5em; }

.article__corps .tableau :is(th, td) { white-space: normal; min-inline-size: 10rem; vertical-align: top; }

@media (min-width: 68rem) {
  .article__corps .tableau { inline-size: 56rem; margin-inline: -7rem; }
}

.reponse {
  margin: 0 0 2rem;
  padding: 1.1rem 1.35rem;
  border-inline-start: 4px solid var(--accent-trace);
  border-radius: 0 var(--rayon) var(--rayon) 0;
  background: var(--bande);
  color: var(--encre);
}
.reponse > :last-child { margin-block-end: 0; }

.encart {
  margin: 1.75em 0;
  padding: 1.1rem 1.35rem;
  border: 1px solid var(--filet-fort);
  border-radius: var(--rayon);
  background: var(--surface);
}
.encart .folio,
.valeur .etiquette {
  display: block;
  margin: 0 0 0.5rem;
  padding: 0;
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--texte-3);
  background: none;
  border: 0;
}
.encart__precision > :last-child { margin-block-end: 0; }

.mention-conso { max-inline-size: 42rem; margin-inline: auto; }
.mention-conso .valeur__verbatim { font-size: calc(var(--t-valeur) + 0.25rem); }

[data-lien-differe],
[data-lien-retire] { color: inherit; }

.valeur {
  margin: 1.75em 0;
  padding: 1.1rem 1.35rem;
  border: 1px solid var(--filet-fort);
  border-radius: var(--rayon);
  background: var(--surface);
}
.valeur--absente { border-style: dashed; background: transparent; }
.valeur__valeur {
  display: block;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: var(--t-valeur);
  line-height: 1.1;
  color: var(--encre);
  font-variant-numeric: tabular-nums;
}

.valeur .unit { font-size: max(0.55em, var(--t-mesure)); color: var(--texte-2); }
.valeur__verbatim,
.valeur__absence {
  margin: 0;
  font-family: var(--serif);
  font-weight: var(--g-titre);
  font-size: 1.25rem;
  line-height: 1.3;
  color: var(--encre);
}
.valeur .mention,
.valeur__precision {
  margin: 0.6rem 0 0;
  font-size: var(--t-note);
  line-height: 1.5;
  color: var(--texte-3);
}
.valeur__lignes {
  margin: 0.5rem 0 0;
  padding: 0;
  list-style: none;
}
.valeur__lignes > li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 0.45rem;
  border-block-start: 1px solid var(--filet);
  margin: 0;
  font-size: 0.9375rem;
}
.valeur__lignes > li:first-child { border-block-start: 0; }
.valeur__lignes .num { font-family: var(--serif); font-weight: var(--g-titre); color: var(--encre); white-space: nowrap; }
.valeur__ligne-libelle { color: var(--texte-2); }
.fiche__pied {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
  margin: 0.85rem 0 0;
  font-size: var(--t-folio);
  line-height: 1.5;
  color: var(--texte-3);
}
.fiche__pied dt { font-family: var(--chasse); font-size: var(--t-mesure); letter-spacing: 0.08em; text-transform: uppercase; }
.fiche__pied dd { margin: 0; }
.fiche__pied a { color: inherit; }

@media (pointer: coarse) {
  .fiche__pied { align-items: center; }
  .fiche__pied a,
  td a,
  td .valeur-ligne__source,
  .sommaire a,
  .sources__liste a { display: inline-flex; align-items: center; min-block-size: 2.75rem; min-inline-size: 2.75rem; vertical-align: middle; }
  .sommaire li { margin-block: 0; }
}

.valeur-ligne--texte { white-space: normal; }
.valeur-ligne .num { font-weight: var(--g-fort); color: var(--encre); white-space: nowrap; }
.valeur-ligne__source {
  font-family: var(--chasse);
  font-size: var(--t-mesure);
  letter-spacing: 0.04em;
  color: var(--texte-3);
}
.article__corps .valeur-ligne__source { color: var(--texte-3); text-decoration-color: var(--filet-fort); }
.valeur-ligne--absente {
  white-space: normal;
  border-block-end: 1px dashed var(--texte-4);
  color: var(--texte-3);
}

.sources,
.articles-lies {
  margin-block-start: 3rem;
  padding-block-start: 2rem;
  border-block-start: 1px solid var(--filet);
}
.sources__titre,
.articles-lies__titre { font-size: var(--t-intertitre); margin-block-end: 0.5em; }
.sources__liste { margin-block-start: 0.5rem; }
.sources__liste > li { font-size: var(--t-note); overflow-wrap: anywhere; }
.article .appel-en-ligne { margin-block-start: 2.5rem; }
.articles-lies__sujet { margin: 1.25rem 0 0; max-inline-size: none; font-size: var(--t-note); color: var(--texte-3); }
.articles-lies__sujet a { color: var(--accent-texte); font-weight: var(--g-fort); }
@media (pointer: coarse) { .articles-lies__sujet a { display: inline-flex; align-items: center; min-block-size: 2.75rem; } }

@media (prefers-color-scheme: dark) {
  .encart,
  .essentiel,
  .valeur { border-color: var(--filet-fort); }
  .essentiel { border-block-start-color: var(--accent-trace); }
}

.qr {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem 2rem;
  align-items: center;
  margin: 1.5rem 0 2.5rem;
}

@media (min-width: 40rem) {
  .qr { grid-template-columns: auto minmax(0, 1fr); }
}

.qr__code {
  display: block;
  inline-size: 14.5rem;
  block-size: 14.5rem;
  max-inline-size: 100%;
  border-radius: var(--rayon-petit);
  background: #fff;
  color: #000;
  forced-color-adjust: none;
  print-color-adjust: exact;
  box-shadow: var(--ombre-carte);
}

.qr figcaption {
  max-inline-size: 60ch;
  color: var(--texte-2);
  line-height: 1.55;
}

@media (max-width: 47.999rem) and (pointer: coarse), (orientation: landscape) and (max-height: 32rem) and (pointer: coarse) and (max-width: 71.999rem) {
  .qr,
  h2:has(+ .qr) { display: none; }
}

@media (max-width: 47.999rem), (pointer: coarse) {
  .carte > p,
  .faq details > :not(summary),
  .parcours__chapo,
  .parcours__pourquoi,
  .parcours__precision,
  .parcours__ou,
  .taux__reserves > li,
  .simu__reserve,
  .valeur__precision,
  .valeur .mention,
  .valeur__ligne-texte,
  .vitrine__tuile > p,
  .outil__mot,
  .carte-article--index .carte-article__chapo,
  .articles-lies__liste > .carte-article > .carte-article__chapo { font-size: var(--t-corps); }
}

.simu__voir { display: none; }

@media (max-width: 47.999rem), (orientation: landscape) and (max-height: 32rem) and (pointer: coarse) and (max-width: 71.999rem) {
  .simu:has(.simu__bouton-revenu:checked) .simu__voir {
    position: sticky;
    z-index: 2;
    inset-block-end: calc(var(--onglets-reserve) - 0.5rem);
    display: flex;
    inline-size: fit-content;
    margin: 1.5rem auto 0;
    box-shadow: var(--ombre-levee);
  }

  html:has(.simu .simu__bouton-revenu:checked) {
    scroll-padding-block-end: calc(var(--onglets-reserve) + 4rem);
  }

  @media (orientation: landscape) and (max-height: 32rem) {
    .simu:has(.simu__bouton-revenu:checked) .simu__voir {
      min-block-size: 2.75rem;
      padding-block: 0.25rem;
      inset-block-end: calc(var(--onglets-reserve) - 1rem);
    }
  }

  .simu__mensualite { order: -2; }
  .simu__cellule { order: var(--simu-ordre, 0); }
}

@supports (animation-timeline: view()) {
  .simu { timeline-scope: --simu-panneau; }
  .simu__panneau { view-timeline: --simu-panneau block; }

  .simu__voir {
    animation: pastille-part linear both;
    animation-range: entry 0% entry 50%;
    animation-timeline: --simu-panneau;
  }
}

@keyframes pastille-part {
  to { opacity: 0; visibility: hidden; }
}

@media (max-width: 47.999rem) {
  .taux--capacite {
    container-type: inline-size;
    scroll-snap-type: x mandatory;
    scroll-padding-inline-start: 7.25rem;
  }

  .taux--capacite :is(thead, tbody) th:first-child { inline-size: 7.25rem; min-inline-size: 7.25rem; }
  .taux--capacite thead th:not(:first-child) { scroll-snap-align: start; }

  @container (inline-size < 37.5rem) {
    .taux--capacite thead th:last-child::after { content: ''; display: block; inline-size: calc(100cqi - 7.25rem - 2.2rem); }
  }
}

@media print {

  body {
    --surface: #ffffff;
    --bande: #ffffff;
    --filet: #cfc7b4;
    --filet-fort: #cfc7b4;
    --encre: #0f1c1e;
    --texte-2: #37494d;
    --texte-3: #5d6f74;
    --texte-4: #7a8b90;
    --petrole: #12303e;
    --accent-texte: #a85400;
    --accent-nuit: #a85400;
    --accent-lavis: #ffffff;
    --ombre-carte: none;
    --ombre-levee: none;
    --ombre-entete: none;
    --ombre-barre: none;
    background: #ffffff;
    color: #37494d;
    padding-block-end: 0;
  }

  .saut,
  .jauge,
  .utilitaire,
  .entete,
  .tiroir,
  .onglets,
  .panneau-hote,
  .bande--nuit:has(.appel),
  .appel-en-ligne,
  .simu__voir,
  .pied__plan,
  .simu,
  .sommaire,
  .blog__sujets { display: none; }

  .bande--nuit,
  .bande--ivoire,
  .heros {
    background: #ffffff;
    color: #37494d;
  }
  .bande--nuit :is(h2, h3, p, li, dd, .chapo, .folio-section) { color: inherit; }
  .bande--nuit :is(h2, h3) { color: #0f1c1e; }
  .bande--nuit .taux-carte { background: #ffffff; border-color: #cfc7b4; }
  .bande--nuit .taux-carte__valeur { color: #0f1c1e; }
  .simu__panneau, .choix { background: #ffffff; border-color: #cfc7b4; color: #37494d; }
  .taux__source a::after { content: ' (' attr(href) ')'; word-break: break-all; }
  .simu__panneau :is(h3, p, .simu__capital, .simu__mensualite-n) { color: #0f1c1e; }
  main.page > :is(.bande, .heros) { margin-inline: 0; }

  .pied { background: #ffffff; color: #37494d; border-block-start-color: #cfc7b4; }
  .pied :is(.pied__titre, .bloc-identification dd, .pied__mention, .pied__encaissement) { color: #0f1c1e; }
  .pied :is(.bloc-identification dt, .note, .pied__arrete) { color: #5d6f74; }
  .pied a { color: #a85400; }

  .folio-section,
  .tableau th,
  .taux th {
    position: static !important;
    inset-block-start: auto;
    inset-inline-start: auto;
  }

  .tableau,
  .taux {
    overflow: visible;
    max-inline-size: none;
  }

  .cas,
  .cartes,
  .banques,
  .vitrine,
  .outils { display: block; }

  .cas__bloc,
  .carte,
  .outil,
  .etapes > li,
  .points > li,
  figure,
  table { break-inside: avoid; }

  h1,
  h2,
  h3,
  h4 { break-after: avoid; }

  details > :not(summary) { display: revert; }

  details::details-content { content-visibility: visible; }

  summary::after { display: none; }

  p,
  main :is(dt, dd),
  main :is(ul, ol):not([class]) > li { max-inline-size: none; }
}