@font-face {
  font-family: 'corps';
  src: url('polices/plus-jakarta-sans-var.woff2') format('woff2');
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'corps-repli';
  src: local('Arial'), local('Liberation Sans');
  size-adjust: 105.75%;
  ascent-override: 98.16%;
  descent-override: 20.99%;
  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-weight: var(--g-titre);

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

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

  line-height: calc(0.92em + 0.4rem);
  letter-spacing: -0.035em;
}

h2 {
  font-size: var(--t-titre);
  line-height: 1.12;
  letter-spacing: -0.03em;
  margin-block: 1.75em 0.65em;
}

h3 {
  font-size: var(--t-intertitre);
  line-height: 1.22;
  letter-spacing: -0.02em;
  margin-block: 1.6em 0.5em;
}

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

h5,
h6 {
  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 1.1em;
  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(.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;

  --marque-tuile: #ffffff;
  --marque-toit: #b45309;
  --marque-ecu: #15303c;

  --canevas: #ffffff;
  --surface: #ffffff;
  --bande: #f3f6f7;
  --filet: #e3e9ec;
  --filet-fort: #cfd9de;

  --encre: #0f2a36;
  --texte-2: #334650;
  --texte-3: #566873;

  --texte-4: #788a93;

  --petrole: #15303c;

  --accent: #b45309;
  --accent-trace: #b45309;
  --accent-texte: #b45309;
  --accent-nuit: #ff8a3d;
  --accent-lavis: #fcf4ec;
  --orange-vif: #fc6303;

  --bouton-fond: #b45309;
  --bouton-texte: #ffffff;
  --bouton-survol: #92400e;

  --nuit: #15303c;
  --nuit-surface: #1d3d4b;
  --nuit-filet: #2b4c5a;
  --nuit-pied: #0f2530;
  --nuit-texte: #ffffff;
  --nuit-texte-2: #c9d6dc;
  --nuit-texte-3: #a3b6be;

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

  --t-display: clamp(2.25rem, 1.45rem + 3.2vw, 3.75rem);
  --t-titre: clamp(1.75rem, 1.25rem + 1.9vw, 2.625rem);
  --t-intertitre: clamp(1.3125rem, 1.12rem + 0.8vw, 1.625rem);
  --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-chiffre: clamp(2.75rem, 2rem + 2.6vw, 4rem);
  --t-corps: 1rem;
  --t-note: 0.8125rem;
  --t-folio: 0.75rem;
  --t-mesure: 0.75rem;

  --pas: clamp(4rem, 2.5rem + 4.5vw, 7.5rem);
  --ecart-cartes: clamp(1.25rem, 0.9rem + 1.5vw, 2rem);
  --ecart-bloc: clamp(2rem, 1.6rem + 1.5vw, 3rem);

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

  --ombre-carte: 0 1px 2px rgb(21 48 60 / 5%), 0 4px 12px rgb(21 48 60 / 4%), 0 16px 32px rgb(21 48 60 / 5%);
  --ombre-levee: 0 2px 6px rgb(21 48 60 / 6%), 0 12px 28px rgb(21 48 60 / 8%), 0 32px 64px rgb(21 48 60 / 10%);
  --ombre-survol: 0 2px 4px rgb(21 48 60 / 6%), 0 14px 28px rgb(21 48 60 / 9%), 0 28px 56px rgb(21 48 60 / 9%);
  --ombre-entete: 0 1px 0 rgb(21 48 60 / 7%), 0 8px 24px rgb(21 48 60 / 6%);
  --ombre-barre: 0 -2px 14px rgb(21 48 60 / 10%);

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

  --duree-vive: 150ms;
  --duree: 220ms;
  --duree-lente: 520ms;
  --detente: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ressort: cubic-bezier(0.16, 1, 0.3, 1);

  --marque-cote: 2.5rem;
}

@media (max-width: 47.999rem), (pointer: coarse) {
  :root {
    --t-folio: 0.8125rem;
    --t-mesure: 0.8125rem;
    --bandeau-h: calc(2.75rem + 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(--sans);
  font-size: var(--t-mesure);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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: var(--mesure-ligne);
}

.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: 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(--canevas); }
.heros__villa .illustration { margin: 0; max-inline-size: none; }
.heros__villa .illustration__image {
  aspect-ratio: 4 / 3;
  max-block-size: 62svh;
  border-radius: 0;
  object-position: 50% 55%;
}
.heros__villa figcaption {
  inline-size: min(100%, var(--large));
  margin-inline: auto;
  padding-inline: max(var(--gouttiere), env(safe-area-inset-left, 0px)) max(var(--gouttiere), env(safe-area-inset-right, 0px));
}
.heros__grille {
  display: grid;
  gap: 2rem;
  align-items: start;
  padding-block: clamp(1.75rem, 1.25rem + 2vw, 3rem) var(--pas);
}
.heros__contenu { max-inline-size: 42rem; }

.heros h1 { margin-block: 0; line-height: calc(0.96em + 0.3rem); letter-spacing: -0.03em; 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;
  transition: text-decoration-color var(--duree-vive) var(--detente);
}
.heros__appel a:hover { text-decoration-color: currentcolor; }

@media (min-width: 48rem) {
  .heros__villa .illustration__image { aspect-ratio: 16 / 9; max-block-size: 66svh; }
}
@media (min-width: 62rem) {
  .heros__villa .illustration__image { aspect-ratio: 21 / 9; max-block-size: 72svh; }
}

@media (min-width: 64rem) {
  .heros__villa .illustration__image {
    aspect-ratio: auto;
    block-size: clamp(20rem, 58svh, 36rem);
    max-block-size: none;
    object-position: 50% 40%;
  }
}
@media (min-width: 62rem) {

  .heros__villa .illustration__credit { display: block; max-inline-size: 34rem; }
  .heros__grille {
    grid-template-columns: minmax(0, 1.2fr) minmax(20rem, 0.8fr);
    gap: clamp(2rem, 5vw, 5rem);
  }
  .heros .widget--heros { margin-block-start: calc(-1 * clamp(7rem, 3rem + 7vw, 11rem)); }
}

.heros__photo .illustration__image { object-position: 40% 30%; }

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

  max-inline-size: none;
  font-family: var(--sans);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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;
}

.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; }

@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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
}
.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: normal; color: var(--encre);
  font-family: var(--sans);
  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(--sans);
  font-size: var(--t-mesure); line-height: 1.4;
  letter-spacing: 0.005em; text-transform: none;
}
@media (min-width: 48rem) and (max-width: 77.999rem) { .marque__statut { display: block; } }

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

.monogramme { flex: none; inline-size: auto; block-size: var(--marque-cote); }

.nav { display: none; }

@media (min-width: 78rem) {
  .nav { display: flex; align-items: center; gap: clamp(1rem, 4.5vw - 2.6rem, 1.5rem); }
  .marque { flex: none; }
  .marque__nom { white-space: nowrap; }
}
@media (min-width: 78rem) and (max-width: 106.999rem) {
  .entete .bouton--tel { inline-size: 2.75rem; padding-inline: 0; justify-content: center; }
  .entete .bouton--tel__numero { display: none; }
}

.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;
  transition: color var(--duree-vive) var(--detente);
}
.nav__lien:hover { color: var(--encre); }

.nav__lien--appel {
  min-block-size: 2.5rem;
  padding-inline: 1.1rem;
  border-radius: var(--rayon-pastille);
  background: var(--bouton-fond);
  color: var(--bouton-texte);
  font-weight: var(--g-fort);
}
.nav__lien--appel:hover { color: var(--bouton-texte); background: var(--bouton-survol); }
.nav__lien--appel[aria-current]::after { content: none; }

.nav__lien[aria-current] { color: var(--accent-texte); }
.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: 78rem) { .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: min(16rem, 100vw - 2 * var(--gouttiere));
  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);
}

.tiroir__appel { margin-block: 0.5rem; justify-content: center; }
.tiroir__lien--petit { font-size: 0.875rem; color: var(--texte-2); }

.pied {
  background: var(--nuit-pied);
  border-block-start: 1px solid var(--nuit-filet);
  color: var(--nuit-texte-2);
  font-size: 0.875rem;
}
.pied > .page { padding-block: clamp(2.5rem, 1.8rem + 2.2vw, 3.5rem); }

.pied__obligatoire {
  margin-block-start: 1.25rem; padding-block-start: 1rem;
  border-block-start: 1px solid var(--nuit-filet);
  font-size: 0.8125rem; line-height: 1.45;
  color: var(--nuit-texte-2);
}
.pied .pied__identite,
.pied .pied__mention {
  margin: 0 0 0.4rem; padding: 0; border: 0;
  max-inline-size: 70ch;
}
.pied .pied__obligatoire p:last-child { margin-block-end: 0; }
.pied__liens ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem;
}
.pied__liens a {
  display: inline-flex;
  align-items: center;
  min-block-size: 1.75rem;
  color: var(--nuit-texte-2);
  text-decoration: none;
}
@media (pointer: coarse) {

  .pied__liens a { min-block-size: 2.75rem; min-inline-size: 2.75rem; }
}
.pied__liens a:hover { color: var(--accent-nuit); text-decoration: underline; text-underline-offset: 0.18em; }
.pied__identite a { color: var(--accent-nuit); text-decoration: underline; text-underline-offset: 0.18em; }
.pied__mention,
.pied__arrete {
  margin-block-start: 1.25rem;
  font-family: var(--sans);
  font-size: var(--t-mesure); line-height: 1.5;
  letter-spacing: 0.005em; text-transform: none;
  color: var(--nuit-texte-3); max-inline-size: none;
}

.outils {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ecart-cartes);
  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), translate var(--duree) var(--detente);
}
.outil:hover { box-shadow: var(--ombre-levee); border-color: var(--filet-fort); }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .outil:hover { translate: 0 -2px; }
}
.outil:focus-visible { outline-offset: 3px; }
.outil__numero {
  font-family: var(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  font-variant-numeric: tabular-nums;
  color: var(--accent-texte);
}
.outil__titre {
  display: block;
  font-family: var(--sans);
  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: 72rem) { .outils { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.cartes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ecart-cartes);
  margin-block: var(--ecart-bloc);
}
.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 {
  display: flex;
  align-items: center;
  min-block-size: 2.75rem;
  color: var(--accent-texte);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.carte > h3 > a:hover { text-decoration-thickness: 2px; }

.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: var(--ecart-bloc);
  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(--sans);
  font-weight: var(--g-titre);
  font-size: var(--t-chiffre);
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--accent-texte);
}
.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: var(--ecart-bloc); 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: 2.25rem;
}
.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(--sans);
  font-weight: var(--g-titre);
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  color: var(--bouton-texte);
}

.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: var(--ecart-bloc) 0;
}

.vitrine {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ecart-cartes);
  margin-block: var(--ecart-bloc);
  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(.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(--sans);
  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)); }
}

.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(--sans);
  font-size: var(--t-mesure); letter-spacing: 0.005em; text-transform: none; 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(--sans);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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);
}

.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(--sans);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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(--sans);
  font-weight: 400;
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  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(--sans);
  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);
}

.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(--sans);
  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(--sans);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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: var(--ecart-bloc); 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: var(--ecart-bloc); display: grid; gap: 0.75rem; }
.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(--sans);
  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(--sans);
  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; }
}

.barre-bas { display: none; }

@keyframes barre-bas-parait {
  from { opacity: 0; visibility: hidden; }
  to { opacity: 1; visibility: visible; }
}

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

  :root {
    --appel-d: 3.5rem;
    --appel-marge: 0.5rem;
    --appel-cote: 1rem;
    --onglets-reserve: calc(var(--appel-d) + 3 * var(--appel-marge) + env(safe-area-inset-bottom, 0px));
  }

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

  .pied > .page { padding-block: 2rem 0; }
  .pied__liens ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
  html { scroll-padding-block-end: var(--onglets-reserve); }

  .utilitaire { display: none; }

  .entete .bouton--tel {
    position: fixed;
    inset-block-end: calc(var(--appel-marge) + env(safe-area-inset-bottom, 0px));
    inset-inline-end: max(var(--appel-cote), env(safe-area-inset-right, 0px));
    inline-size: var(--appel-d);
    block-size: var(--appel-d);
    min-block-size: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--bouton-fond);
    color: var(--bouton-texte);
    box-shadow: var(--ombre-levee);
  }

  .entete .bouton--tel svg { inline-size: 1.5rem; block-size: 1.5rem; }
  .entete .bouton--tel__numero { display: none; }

  .barre-bas {
    display: flex;
    position: fixed;
    inset-inline: 0;
    inset-block-end: 0;
    padding-block: var(--appel-marge) calc(var(--appel-marge) + env(safe-area-inset-bottom, 0px));
    padding-inline: max(var(--appel-cote), env(safe-area-inset-left, 0px))
      calc(max(var(--appel-cote), env(safe-area-inset-right, 0px)) + var(--appel-d) + var(--appel-marge));
    border-block-start: 1px solid var(--filet);
    background: var(--surface);
  }
  .barre-bas .bouton {
    flex: 1;
    min-inline-size: 0;
    min-block-size: var(--appel-d);
    padding-inline: 0.75rem;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }
  @supports (animation-timeline: scroll()) {
    .barre-bas {
      visibility: hidden;
      animation: barre-bas-parait linear both;
      animation-range: 80svh 100svh;
      animation-timeline: scroll(root block);
    }
  }

  body:has(.tiroir[open]) .barre-bas { animation: none; }

  .outil-ordinateur { display: none; }

  .tiroir[open] > .tiroir__bouton::before { z-index: -1; background: rgb(15 37 48 / 55%); }

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

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

  .tiroir__lien {
    min-block-size: 3rem;
    padding-block: 0.6rem;
    font-size: 1.125rem;
    line-height: 1.3;
    color: var(--encre);
  }
  .tiroir__lien--petit { font-size: 0.9375rem; color: var(--texte-2); }

  @media (max-height: 36rem) {
    .entete:not(:has(.tiroir[open])) { position: relative; }
    html { scroll-padding-block-start: 0.75rem; }
  }

  @media (forced-colors: active) {
    .entete .bouton--tel { border: 1px solid ButtonText; }
    .barre-bas { border-block-start-color: ButtonText; }
  }
}

@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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
}

.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; }
}

.langues { flex: none; }
.langues__bouton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-block-size: 2.75rem;
  min-inline-size: 2.75rem;
  padding-inline: 0.35rem;
  border: 0;
  border-radius: var(--rayon);
  background: transparent;
  color: var(--encre);
  font-size: 0.875rem;
  font-weight: var(--g-fort);
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background-color var(--duree-vive) var(--detente);
}
.langues__bouton svg { display: none; flex: none; inline-size: 1rem; block-size: 1rem; }
@media (min-width: 48rem) { .langues__bouton svg { display: block; } }
.langues__bouton:hover,
.langues:has(:popover-open) .langues__bouton { background: var(--bande); }
.langues__nom {
  position: absolute; inline-size: 1px; block-size: 1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

.langues__liste {
  min-inline-size: 11rem;
  margin: auto;
  padding: 0.4rem;
  list-style: none;
  border: 1px solid var(--filet-fort);
  border-radius: var(--rayon-large);
  background: var(--surface);
  color: var(--encre);
  box-shadow: var(--ombre-levee);
}
@supports (anchor-name: --langues) {
  .langues__bouton { anchor-name: --langues; }
  .langues__liste {
    position-anchor: --langues;
    inset: auto;
    inset-block-start: calc(anchor(end) + 0.25rem);
    inset-inline-end: anchor(end);
    margin: 0;
    position-try-fallbacks: flip-inline;
  }
}

@supports not selector(:popover-open) {
  .langues { position: relative; }
  .langues__liste { display: none; position: absolute; inset-block-start: 100%; inset-inline-end: 0; margin: 0; }
  .langues:hover .langues__liste,
  .langues:focus-within .langues__liste { display: block; }
}
.langues__lien {
  display: flex;
  align-items: center;
  min-block-size: 2.75rem;
  padding: 0.35rem 0.85rem;
  border-radius: var(--rayon);
  color: var(--encre);
  text-decoration: none;
  font-weight: var(--g-nav);
}
.langues__lien:hover { background: var(--accent-lavis); }
.langues__lien[aria-current] { font-weight: var(--g-fort); color: var(--accent-texte); }
.langues__lien[aria-current]::after { content: '\2713' / ''; margin-inline-start: auto; padding-inline-start: 1rem; }

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

@media (forced-colors: active) {
  .langues__liste { border: 1px solid ButtonText; }
}

.ligne-formulaire {
  flex-basis: 100%;
  margin: 0.5rem 0 0;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-2);
  max-inline-size: none;
}
.ligne-formulaire a {
  display: inline-flex;
  align-items: center;
  min-block-size: 2.75rem;
  font-weight: var(--g-fort);
  white-space: nowrap;
  color: var(--accent-texte);
}

.traduction {
  margin: 1rem 0 0;
  font-size: var(--t-note);
  line-height: 1.45;
  color: var(--texte-3);
  max-inline-size: none;
}
.traduction a { color: var(--accent-texte); }

.pied__note {
  margin: 0;
  color: var(--nuit-texte-3);
  max-inline-size: 70ch;
}
.pied__legal .pied__identite { margin-block-start: 0.5rem; }

:lang(de), :lang(nl) { hyphens: auto; overflow-wrap: break-word; }

:root :is(h1, h2, h3, h4, h5, h6, :is(h1, h2, h3, h4, h5, h6) *) { hyphens: manual; }

@media (max-width: 30rem) { :is(:lang(de), :lang(nl)) h1 { font-size: 2rem; } }

:lang(en) a[target='_blank']::after { content: ' (new tab)'; }
:lang(es) a[target='_blank']::after { content: ' (nueva pesta\0000f1a)'; }
:lang(de) a[target='_blank']::after { content: ' (neuer Tab)'; }
:lang(it) a[target='_blank']::after { content: ' (nuova scheda)'; }
:lang(nl) a[target='_blank']::after { content: ' (nieuw tabblad)'; }
:lang(pt) a[target='_blank']::after { content: ' (novo separador)'; }
:lang(ca) a[target='_blank']::after { content: ' (pestanya nova)'; }

.mention-traduite .pied__mention { margin: 0; color: var(--texte-2); }

.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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  color: var(--texte-3);
  font-variant-numeric: tabular-nums;
}

.question__mot {
  font-family: var(--sans);
  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(--sans);
  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(--sans);
  text-transform: none;
  letter-spacing: 0.005em;
  font-size: var(--t-mesure);
  color: var(--accent-texte);
}

.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(--sans);
  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: 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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  color: var(--nuit-texte-2);
}

.simu__capital {
  margin-block: 0.25rem 0;
  font-family: var(--sans);
  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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  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);
}

.simu__suite { grid-column: 1 / -1; margin: 0; }
.simu__panneau .ligne-formulaire { grid-column: 1 / -1; margin: 0; color: var(--nuit-texte-2); }
.simu__panneau .ligne-formulaire a { color: var(--accent-nuit); }
@media (min-width: 28rem) {
  .simu__suite,
  .simu__panneau .ligne-formulaire { order: 1; }
}

.tableau-replie { margin-block: 1.5rem 0; }
.tableau-replie > summary { list-style: none; cursor: pointer; }
.tableau-replie > summary::-webkit-details-marker { display: none; }
.tableau-replie[open] > summary { margin-block-end: 1rem; }

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

.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(240 164 107 / 14%);
  outline-color: var(--accent-nuit);
}

.saisie__champs { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.saisie__champ { display: grid; gap: 0.6rem; align-content: start; cursor: text; }
.saisie__champ .simu__legende { float: none; margin: 0; }
.saisie__facultatif { font-family: var(--sans); font-weight: 400; font-size: var(--t-note); color: var(--texte-3); }
.saisie__case { display: flex; align-items: center; gap: 0.5rem; font-weight: var(--g-fort); color: var(--encre); }
.saisie__entree {
  inline-size: 100%;
  max-inline-size: 12rem;
  min-block-size: 2.75rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--texte-3);
  border-radius: var(--rayon);
  background: var(--bande);
  color: var(--encre);
  font: inherit;
  font-size: 1.125rem;
  font-variant-numeric: tabular-nums;
}

.saisie__entree:focus-visible { border-color: var(--accent-trace); outline: 3px solid var(--accent-trace); outline-offset: -3px; }
.saisie__groupe:not([hidden]) {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
  margin-block-start: 0.75rem;
}
.simu__mensualite[data-mensualite] { margin-block-end: 0.25rem; }
.simu__capital:empty, .saisie__loyer:empty { display: none; }
.saisie__loyer { margin-block: 0.5rem 0; font-size: var(--t-note); color: var(--nuit-texte-2); }

[data-saisie] .simu__capital, [data-cases] .simu__capital { text-wrap: balance; font-size: var(--t-sous-titre); }

.frais .taux tr[hidden] { display: none; }
.frais tfoot :is(th, td) { padding-block: 0.75rem; border-block-start: 2px solid var(--encre); font-weight: var(--g-fort); color: var(--encre); }
.frais tfoot td { font-size: var(--t-intertitre); line-height: 1.15; }
.frais .simu__invite { margin-block: 1rem; color: var(--texte-2); }

@media (max-width: 47.999rem) {
  .frais .taux :is(table, tbody, tfoot) { display: block; }
  .frais .taux thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .frais .taux tr { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 1rem; padding: 0.6rem 1rem; border-block-start: 1px solid var(--filet); }
  .frais .taux :is(th, td) { padding: 0; border: 0; white-space: normal; }
  .frais .taux th[scope="row"] { grid-column: 1 / -1; }
  .frais .taux tbody td { font-size: var(--t-corps); }
  .frais .taux caption { display: block; inline-size: auto; text-align: start; }
  .frais .frais__grille tr { grid-template-columns: 1fr; }
  .frais .frais__grille td { display: flex; justify-content: space-between; gap: 1rem; }
  .frais .frais__grille td::before { content: attr(data-intitule); font-size: var(--t-note); color: var(--texte-3); }
}

[data-lemoine] .frais__grille tbody td { font-size: var(--t-corps); line-height: 1.4; }

.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: var(--ecart-bloc);
}
.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(3rem, 5vw, 5rem);
  align-items: start;
}
.duo > * { min-inline-size: 0; }
.duo h2 { margin-block-start: 0; }
.duo .jalons { margin-block-start: var(--ecart-bloc); }
@media (min-width: 62rem) {
  .duo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.portrait--duo { max-inline-size: 42rem; margin-block-start: var(--ecart-bloc); }
.portrait--duo img { aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 30%; }

.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(--sans);
  font-size: 1.125rem;
  color: var(--bouton-texte);
}
.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(4, minmax(0, 1fr)); gap: 0.375rem; }
}
@media (max-width: 23.999rem) {
  .bande--logos .banques { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.bande--logos .banque {
  flex-direction: column;
  justify-content: flex-start;
  gap: 0.35rem;
  min-inline-size: 0;
  padding: 0.5rem 0.3rem 0.45rem;
  border-color: var(--filet);
  border-radius: var(--rayon);
  box-shadow: var(--ombre-carte);
}
.bande--logos .banque__logo {
  box-sizing: border-box;
  inline-size: 100%;
  max-inline-size: none;
  block-size: 2.5rem;
  padding: 0.125rem;
  object-fit: contain;
}
@media (max-width: 40rem) {
  .bande--logos .banque__logo { block-size: 2rem; padding: 0; }
}
.bande--logos .banque__nom {
  font-size: var(--t-folio);
  line-height: 1.2;
  text-align: center;
  overflow-wrap: break-word;
  hyphens: auto;
  hyphenate-limit-chars: 10 4 4;
  color: var(--texte-3);
}

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

.widget {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0.75rem;
  min-inline-size: 0;
  padding: clamp(1.25rem, 0.9rem + 1.2vw, 2rem);
  border: 1px solid var(--filet);
  border-radius: var(--rayon-large);
  background: var(--surface);
  box-shadow: var(--ombre-levee);
}

.widget--heros { max-inline-size: 34rem; }
.widget p { max-inline-size: none; margin: 0; }
.widget__titre { font-size: var(--t-note); font-weight: var(--g-fort); color: var(--texte-3); }

.widget__taux {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 4.5rem), 1fr));
  gap: 0.75rem;
  margin: 0;
}
.widget__taux .widget__valeur { font-size: min(var(--t-valeur), 7.5vw); }
.widget__taux > div { display: grid; gap: 0.25rem; min-inline-size: 0; }
.widget__taux dt { font-size: var(--t-note); }
.widget__taux dd { margin: 0; }
.widget__phrase { color: var(--texte-2); }
.widget__valeur {
  font-family: var(--sans);
  font-weight: var(--g-titre);
  font-size: var(--t-valeur);
  line-height: 1;
  letter-spacing: -0.03em;
  white-space: nowrap;
  color: var(--accent-texte);
}
.widget__mot { color: var(--texte-2); }
.widget .widget__source { margin: 0; }
.widget__action {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.5rem;
  padding-block-start: 0.75rem;
  border-block-start: 1px solid var(--filet);
}
.widget__lien {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-block-size: 2.75rem;
  font-weight: var(--g-fort);
  color: var(--encre);
  text-decoration: none;
}
.widget__lien::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);
}
.widget__lien:hover { color: var(--accent-texte); }
.widget__lien:hover::after { translate: 0.2rem 0; }

@media screen and (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .outils > li,
    .reperes__liste > li {
      animation: apparait linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 70%;
    }
  }
}
@keyframes apparait {
  from { translate: 0 1.25rem; }
  to { translate: 0 0; }
}

.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:not(:last-child)::after {
  content: '/';
  margin-inline-start: 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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  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: var(--ecart-cartes);
  margin: var(--ecart-bloc) 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(--sans);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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; }

@media (pointer: coarse) { .carte-article__titre a { display: block; min-block-size: 2.75rem; } }
.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(--sans);
  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-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(--sans);
  font-size: var(--t-mesure);
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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(--sans);
  font-size: var(--t-mesure);
  letter-spacing: 0.005em;
  text-transform: none;
  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(--sans);
  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: var(--ecart-bloc) 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: 1.5rem 0 var(--ecart-bloc);
  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(--sans);
  font-size: var(--t-mesure);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.005em;
  text-transform: none;
  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(--sans);
  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(--sans);
  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(--sans); font-weight: var(--g-titre); color: var(--encre); white-space: nowrap; }
.valeur__ligne-libelle { color: var(--texte-2); }

.valeur__ligne-libelle { flex: 0 1 auto; min-inline-size: min(11rem, 45%); overflow-wrap: normal; }
.valeur__ligne-texte { min-inline-size: 0; overflow-wrap: anywhere; }
@media (max-width: 47.999rem) {
  .valeur__lignes > li { flex-direction: column; gap: 0.15rem; }
  .valeur__ligne-libelle { min-inline-size: 0; }
}
.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(--sans); font-size: var(--t-mesure); letter-spacing: 0.005em; text-transform: none; }
.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(--sans);
  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; } }

.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 0 0 auto;
    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 screen and (max-width: 47.999rem) {

  .taux tbody th { white-space: normal; }

  .tableau {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
  }
  .tableau::after { display: none; }
  .tableau :is(table, tbody, tr, td) { display: block; }
  .tableau thead {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .tableau tbody { display: grid; gap: 0.75rem; }
  .tableau tr {
    padding: 1rem 1.1rem;
    border: 1px solid var(--filet);
    border-radius: var(--rayon-large);
    background: var(--surface);
    box-shadow: var(--ombre-carte);
  }

  .article__corps .tableau :is(th, td) { min-inline-size: 0; }
  .tableau tbody td {
    overflow-wrap: anywhere;
    padding: 0;
    border: 0;
    font-family: var(--sans);
    font-weight: 400;
    font-size: var(--t-corps);
    line-height: 1.5;
    color: var(--texte-2);
  }
  .tableau tbody td:first-child { font-weight: var(--g-fort); font-size: 1.0625rem; color: var(--encre); }
  .tableau tbody td + td {
    margin-block-start: 0.65rem;
    padding-block-start: 0.65rem;
    border-block-start: 1px solid var(--filet);
  }
  .tableau td + td[data-intitule]::before {
    content: attr(data-intitule);
    display: block;
    margin-block-end: 0.15rem;
    font-family: var(--sans);
    font-size: var(--t-mesure);
    line-height: 1.4;
    letter-spacing: 0.005em;
    text-transform: none;
    color: var(--texte-3);
  }

  .taux.taux--capacite table {
    display: grid;
    grid-template-columns: minmax(max-content, 1.1fr) repeat(3, minmax(min-content, 1fr));
  }
  .taux.taux--capacite :is(caption, thead, tbody, tr) { grid-column: 1 / -1; }
  .taux.taux--capacite :is(thead, tbody, tr) { display: grid; grid-template-columns: subgrid; }
  .taux.taux--capacite caption { display: block; contain: inline-size; }
  .taux.taux--capacite :is(th, td) { padding: 0.55rem 0.2rem; border: 0; white-space: nowrap; }
  .taux.taux--capacite thead { border-block: 1px solid var(--filet); background: var(--bande); }
  .taux.taux--capacite thead th { max-inline-size: 5rem; white-space: normal; letter-spacing: 0.03em; }
  .taux.taux--capacite thead th:nth-child(n + 3) { max-inline-size: 4.5rem; }
  .taux.taux--capacite tbody tr + tr { border-block-start: 1px solid var(--filet); }
  .taux.taux--capacite tr > :first-child { grid-area: 1 / 1; padding-block-end: 0; }
  .taux.taux--capacite tr > :nth-child(2) { grid-area: 2 / 1; padding-block-start: 0.15rem; }
  .taux.taux--capacite tr > :is(:first-child, :nth-child(2)) {
    position: sticky;
    inset-inline-start: 0;
    padding-inline-start: 0.85rem;
    border: 0;
    background: var(--surface);
  }
  .taux.taux--capacite thead tr > :nth-child(n) { background: var(--bande); }
  .taux.taux--capacite tr > :nth-child(n + 3) { grid-row: 1 / span 2; align-self: center; justify-self: end; text-align: end; }
  .taux.taux--capacite tr > :last-child { padding-inline-end: 0.7rem; }
  .taux.taux--capacite tbody td { font-size: 0.9375rem; }

  .taux.taux--capacite tbody td:nth-child(n + 3) { white-space: normal; font-size: 0.875rem; }
  .taux.taux--capacite tbody td:first-of-type { font-size: var(--t-note); font-weight: 400; color: var(--texte-2); }
  .taux.taux--capacite tbody th[scope='row'] { font-size: 1rem; }
}

@media (max-width: 47.999rem), (pointer: coarse) {
  .points--liens > li > a { display: flex; align-items: center; min-block-size: 2.75rem; }
}

:root { --trait: linear-gradient(90deg, var(--orange-vif), var(--accent)); }

.metier::before,
.folio-section::before {
  inline-size: 1.25rem;
  block-size: 3px;
  border-radius: 2px;
  background: var(--trait);
}
.carte > h3::before {
  inline-size: 1.5rem;
  block-size: 3px;
  border-radius: 2px;
  background: var(--trait);
}
.jauge__trait { background: var(--trait); }

.heros__photo {
  inline-size: min(100%, var(--large));
  margin-inline: auto;
  padding-block-start: clamp(0.75rem, 0.5rem + 1vw, 1.5rem);
  padding-inline: max(var(--gouttiere), env(safe-area-inset-left, 0px)) max(var(--gouttiere), env(safe-area-inset-right, 0px));
}
.heros__photo .illustration {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: var(--rayon-photo);
  box-shadow: var(--ombre-levee);
}
.heros__photo .illustration::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, transparent 55%, rgb(15 37 48 / 28%)),
    radial-gradient(60% 80% at 100% 100%, rgb(252 99 3 / 16%), transparent 70%);
}
.heros__photo .illustration__image { display: block; inline-size: 100%; }
@media (max-width: 47.999rem) {
  .heros__photo .illustration { border-radius: var(--rayon-large); }
}

.widget { overflow: hidden; }

.heros__cote { display: grid; gap: 1.5rem; align-content: start; min-inline-size: 0; }
.heros__cote .heros__gages { margin-block-start: 0; }
.heros__cote .reponse { margin: 0; max-inline-size: 34rem; }
.widget__valeur { font-variant-numeric: tabular-nums; }

@media screen and (prefers-reduced-motion: no-preference) {
  .heros__photo .illustration__image { animation: relief-pose 1.4s var(--ressort) both; }
  .heros__contenu > * { animation: relief-monte 0.7s var(--ressort) both; }
  .heros__contenu > :nth-child(2) { animation-delay: 60ms; }
  .heros__contenu > :nth-child(3) { animation-delay: 120ms; }
  .heros__contenu > :nth-child(4) { animation-delay: 180ms; }
  .heros__contenu > :nth-child(n + 5) { animation-delay: 240ms; }
  .heros .widget--heros { animation: relief-monte 0.8s 200ms var(--ressort) both; }
}
@keyframes relief-pose {
  from { scale: 1.06; }
  to { scale: 1; }
}
@keyframes relief-monte {
  from { translate: 0 0.75rem; }
  to { translate: 0 0; }
}

.bouton,
.nav__lien--appel { border-radius: var(--rayon); }
.bouton {
  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) var(--detente),
    translate var(--duree) var(--ressort),
    scale var(--duree-vive) var(--detente);
}
.bouton--plein:hover { box-shadow: var(--ombre-survol); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .bouton:hover { translate: 0 -1px; }
  .bouton:active { translate: 0 0; scale: 0.98; }
}
.bouton--contour { border-color: var(--filet-fort); border-width: 1px; }
.bouton--contour:hover { border-color: var(--encre); background: var(--surface); box-shadow: var(--ombre-carte); }

.nav__lien:not(.nav__lien--appel)::after {
  content: '';
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0.5rem;
  block-size: 3px;
  border-radius: 2px;
  background: var(--trait);
  scale: 0 1;
  transition: scale var(--duree) var(--ressort);
}
.nav__lien:not(.nav__lien--appel):hover::after,
.nav__lien[aria-current]:not(.nav__lien--appel)::after { scale: 1 1; }
.nav__lien--appel { transition: background-color var(--duree-vive) var(--detente), box-shadow var(--duree) var(--detente); }
.nav__lien--appel:hover { box-shadow: var(--ombre-carte); }
.entete__contenu::before { box-shadow: var(--ombre-entete); }

:is(.outil, .carte-article--index, .vitrine__tuile) { position: relative; }
:is(.outil, .carte-article--index, .vitrine__tuile)::before {
  content: '';
  position: absolute;
  inset-block-start: 0;
  inset-inline: 1.25rem;
  z-index: 1;
  block-size: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--trait);
  scale: 0 1;
  transition: scale var(--duree-lente) var(--ressort);
  pointer-events: none;
}
:is(.outil, .carte-article--index, .vitrine__tuile):is(:hover, :focus-within)::before { scale: 1 1; }
:is(.outil, .carte-article--index, .vitrine__tuile, .carte) {
  transition:
    box-shadow var(--duree) var(--detente),
    border-color var(--duree) var(--detente),
    translate var(--duree-lente) var(--ressort);
}
:is(.outil, .carte-article--index, .vitrine__tuile):hover { box-shadow: var(--ombre-survol); border-color: var(--filet-fort); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  :is(.outil, .carte-article--index, .vitrine__tuile):hover { translate: 0 -4px; }
  .outil:hover .outil__fleche::after,
  .widget__lien:hover::after { translate: 0.3rem 0; }
}

:is(.carte-article__vignette, .vitrine__tuile picture) { overflow: hidden; }
:is(.carte-article__vignette, .vitrine__tuile picture) img { transition: scale 0.9s var(--ressort); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  :is(.carte-article--index, .vitrine__tuile):hover img { scale: 1.04; }
}
.outil__titre { letter-spacing: -0.02em; }
.outil__numero { font-weight: var(--g-fort); }

.bande--nuit {
  background:
    radial-gradient(70rem 32rem at 100% 0%, rgb(252 99 3 / 12%), transparent 62%),
    radial-gradient(50rem 28rem at 0% 100%, rgb(255 255 255 / 4%), transparent 60%),
    var(--nuit);
}
.simu__panneau {
  background:
    radial-gradient(40rem 20rem at 100% 0%, rgb(252 99 3 / 12%), transparent 65%),
    var(--nuit);
}
.pied__liens a {
  background: linear-gradient(currentcolor, currentcolor) no-repeat 0 85% / 0 1px;
  transition: color var(--duree-vive) var(--detente), background-size var(--duree) var(--ressort);
}
.pied__liens a:hover { text-decoration: none; background-size: 100% 1px; }

:is(.bande--nuit, .utilitaire, .pied, .simu__panneau) :focus-visible { outline-color: var(--accent-nuit); }

:is(.tableau, .taux) tbody td { font-weight: var(--g-fort); font-variant-numeric: tabular-nums; }
:is(.tableau, .taux) tbody tr { transition: background-color var(--duree-vive) var(--detente); }
:is(.tableau, .taux) tbody tr:hover { background: var(--bande); }

.saisie__entree {
  background: var(--surface);
  transition: border-color var(--duree-vive) var(--detente), box-shadow var(--duree) var(--detente);
}
.saisie__entree:hover { border-color: var(--encre); }
.saisie__entree:focus-visible { box-shadow: 0 0 0 4px var(--accent-lavis); }
.simu__champ { border-color: var(--filet); }

@media screen and (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    :is(.cartes > .carte, .grille-articles > li, .vitrine > *, .jalons > li, .bande__tete, .simu__champ, .tableau) {
      animation: relief-apparait linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 75%;
    }
    :is(.outils, .cartes, .grille-articles, .vitrine, .reperes__liste) > :nth-child(3n + 2) { animation-range: entry 6% entry 81%; }
    :is(.outils, .cartes, .grille-articles, .vitrine, .reperes__liste) > :nth-child(3n + 3) { animation-range: entry 12% entry 87%; }
  }
}
@keyframes relief-apparait {
  from { translate: 0 1.5rem; scale: 0.985; }
  to { translate: 0 0; scale: 1; }
}

@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root) { animation: 160ms var(--detente) both relief-sort; }
  ::view-transition-new(root) { animation: 320ms var(--ressort) both relief-entre; }
}
@keyframes relief-sort { to { opacity: 0; } }
@keyframes relief-entre {
  from { opacity: 0; translate: 0 8px; }
  to { opacity: 1; translate: 0 0; }
}

@media print {

  body {
    --surface: #ffffff;
    --bande: #ffffff;
    --filet: #d6d6d4;
    --filet-fort: #d6d6d4;
    --encre: #111111;
    --texte-2: #3b3b3b;
    --texte-3: #5e5e5e;
    --texte-4: #8a8a8a;
    --petrole: #111111;
    --accent-texte: #b45309;
    --accent-nuit: #b45309;
    --accent-lavis: #ffffff;
    --ombre-carte: none;
    --ombre-levee: none;
    --ombre-entete: none;
    --ombre-barre: none;
    background: #ffffff;
    color: #3b3b3b;
    padding-block-end: 0;
  }

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

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

  .pied { background: #ffffff; color: #3b3b3b; border-block-start-color: #d6d6d4; }
  .pied :is(.pied__identite, .pied__mention) { color: #111111; }
  .pied :is(.pied__arrete) { color: #5e5e5e; }
  .pied a { color: #b45309; }

  .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; }
}
