/* Retraite Exacte — feuille de style du site (refonte du 05/10/2026).
   Paul, 05/10 : « la police est horrible, le design en général aussi ».
   → Fraunces abandonnée : UNE famille, Figtree (variable, auto-hébergée), sobre et très lisible.
   → plus de sur-titres en capitales, de mot en italique coloré, de numéros 01/02, d'émojis.
   Gardé (tranché par Paul le 28-29/09) : l'ORANGE DU MUR en haut de l'accueil, le VERT réservé aux clics.
   Cible 55-70 ans : corps 19 px, contraste AA partout, cibles tactiles ≥ 52 px.
   ⚠ Servie avec un cache d'un an (.htaccess) : changer le ?v= à chaque modif. */

@font-face { font-family: "Figtree"; src: url("polices3/figtree-latin-wght.woff2") format("woff2"); font-weight: 300 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; src: url("polices3/figtree-latin-ext-wght.woff2") format("woff2"); font-weight: 300 900; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --mur: #A65A32;          /* l'orange du mur de la présentatrice (blanc dessus : 5,1:1) */
  --mur-fonce: #8C4523;
  --mur-nuit: #6E3418;
  --orange-encre: #9A4521; /* texte orange sur crème (5,6:1) */
  --orange-pale: #F7E6DA;
  --orange-voile: #FBF1EA;
  --papier: #FAF6F0;
  --papier-2: #F3ECE2;
  --carte: #FFFFFF;
  --encre: #1C1410;
  --gris: #574C44;
  --gris-clair: #7A6E65;
  --ligne: #E6DBCD;
  --ligne-forte: #CDBFAE;
  --brun: #24160F;
  --action: #17603F;       /* vert : UNIQUEMENT ce qui se clique (blanc dessus : 7,5:1) */
  --action-fonce: #0E4A30;
  --action-pale: #E4F1E9;
  --alerte: #B23A1E;
  --alerte-pale: #FBE7E0;
  /* anciens noms, gardés pour les pages et scripts qui s'en servent encore */
  --terre: var(--mur); --terre-fonce: var(--mur-fonce); --terre-pale: var(--orange-pale);
  --foret: var(--orange-encre); --foret-pale: var(--orange-pale); --papier-clair: var(--papier-2);
  --sans: "Figtree", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --serif: var(--sans);
  --rayon: 16px;
  --ombre: 0 1px 2px rgba(60, 30, 10, .05), 0 12px 32px -14px rgba(60, 30, 10, .22);
  --ombre-haute: 0 2px 4px rgba(40, 20, 8, .06), 0 30px 60px -24px rgba(40, 20, 8, .35);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; background: var(--papier); color: var(--encre); font: 450 19px/1.6 var(--sans); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; display: block; }
svg { flex: none; }
a { color: var(--orange-encre); text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
a:hover { color: var(--mur-nuit); }
p { margin: 0 0 1em; }
h1, h2, h3 { font-family: var(--sans); font-weight: 780; line-height: 1.1; margin: 0 0 .45em; letter-spacing: -.022em; text-wrap: balance; color: var(--encre); }
h1 { font-size: clamp(2.3rem, 5.4vw, 3.9rem); letter-spacing: -.03em; line-height: 1.04; }
h2 { font-size: clamp(1.85rem, 3.9vw, 2.75rem); }
h3 { font-size: 1.25rem; font-weight: 720; letter-spacing: -.01em; line-height: 1.25; }
strong, b { font-weight: 700; }
:focus-visible { outline: 3px solid var(--action); outline-offset: 3px; border-radius: 6px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

.enveloppe { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.enveloppe--etroite { max-width: 780px; }
@media (max-width: 560px) { .enveloppe { padding: 0 18px; } }
.section { padding: 96px 0; }
.section--claire { background: var(--papier-2); }
.section--blanche { background: var(--carte); }
.section--profonde { background: var(--brun); color: #F3EADF; }
.section--profonde h2 { color: #fff; }
@media (max-width: 760px) { .section { padding: 64px 0; } }

/* sur-titre : discret, en minuscules, sans pastille ni tiret (les capitales espacées faisaient « gabarit ») */
.surtitre { display: block; font: 700 1rem/1.3 var(--sans); color: var(--orange-encre); margin-bottom: 12px; }
.chapo { font-size: 1.2rem; line-height: 1.55; color: var(--gris); max-width: 38em; }
.titre-section { max-width: 760px; margin-bottom: 44px; }
.titre-section--centre { margin-left: auto; margin-right: auto; text-align: center; }
.titre-section--centre .chapo { margin-left: auto; margin-right: auto; }
.titre-section .chapo { margin-bottom: 0; }

/* ── boutons : le vert veut dire « cliquez ici », nulle part ailleurs ── */
.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: .3em;
  min-height: 60px; padding: 16px 30px;
  background: var(--action); color: #fff; border: 0; border-radius: 12px;
  font: 700 1.1rem/1.2 var(--sans); letter-spacing: -.005em; text-decoration: none; cursor: pointer; text-align: center;
  box-shadow: 0 2px 0 var(--action-fonce), 0 12px 24px -12px rgba(14, 74, 48, .75);
  transition: background .15s, transform .15s, box-shadow .15s;
}
.bouton:hover { background: var(--action-fonce); color: #fff; transform: translateY(-1px); }
.bouton:active { transform: translateY(1px); box-shadow: 0 1px 0 var(--action-fonce); }
.bouton:disabled { opacity: .6; cursor: wait; transform: none; }
.bouton::after { content: ""; width: 18px; height: 18px; flex: none; margin-left: .2em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10h11M11 5l5 5-5 5' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10h11M11 5l5 5-5 5' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; transition: transform .15s; }
.bouton:hover::after { transform: translateX(3px); }
.bouton--large { width: 100%; }
.bouton--clair { background: #fff; color: var(--encre); border: 1.5px solid var(--ligne-forte); box-shadow: none; }
.bouton--clair:hover { background: var(--papier); color: var(--encre); border-color: var(--encre); }
.bouton--clair::after, .lien-bouton::after, .navigation-pas #precedent::after, .bouton--sans-fleche::after { content: none; }
.bouton--foret { background: var(--action); }
.bouton--fantome { background: transparent; color: #fff; border: 1.5px solid rgba(255, 248, 240, .7); box-shadow: none; }
.bouton--fantome:hover { background: rgba(255, 248, 240, .12); color: #fff; border-color: #fff; }
.bouton--fantome::after { content: none; }
.sous-bouton { font-size: .95rem; color: var(--gris); margin: 14px 0 0; }

/* ── en-tête ── */
.entete { position: sticky; top: 0; z-index: 20; background: rgba(250, 246, 240, .96); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--ligne); }
.entete__ligne { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 76px; }
.logo { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--encre); line-height: 1; }
.logo::before { content: ""; width: 40px; height: 40px; flex: none; border-radius: 10px; background: var(--mur) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='11' y='7' width='18' height='26' rx='3' fill='none' stroke='%23FFF8F0' stroke-width='2.4'/%3E%3Cpath d='M15 14h10M15 19.5h10' stroke='%23FFF8F0' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M15 26l3 3 7-7' fill='none' stroke='%23FFF8F0' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat; }
.logo__nom { display: block; font: 800 1.32rem/1 var(--sans); letter-spacing: -.025em; }
.logo__ligne { display: none; }
.entete__nav { display: flex; gap: 28px; margin-left: auto; margin-right: 8px; }
.entete__nav a { color: var(--encre); text-decoration: none; font-weight: 600; font-size: 1rem; }
.entete__nav a:hover { color: var(--orange-encre); }
@media (max-width: 1080px) { .entete__nav { display: none; } }
.entete__actions { display: flex; align-items: center; gap: 14px; }
.entete__yt { display: inline-flex; align-items: center; gap: 8px; font-size: .95rem; font-weight: 600; color: var(--gris); text-decoration: none; }
.entete .bouton { min-height: 48px; padding: 10px 20px; font-size: 1rem; box-shadow: 0 2px 0 var(--action-fonce); }
.entete .bouton::after { width: 16px; height: 16px; }
.entete__espace { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 4px; color: var(--encre); font-weight: 650; font-size: 1rem; text-decoration: none; white-space: nowrap; }
.entete__espace::before { content: ""; width: 22px; height: 22px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='4' fill='none' stroke='%23000' stroke-width='2'/%3E%3Cpath d='M4 21c1.2-4 4.3-6 8-6s6.8 2 8 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='4' fill='none' stroke='%23000' stroke-width='2'/%3E%3Cpath d='M4 21c1.2-4 4.3-6 8-6s6.8 2 8 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.entete__espace:hover { color: var(--orange-encre); }
@media (max-width: 640px) {
  .entete__ligne { min-height: 66px; gap: 10px; }
  .logo::before { width: 34px; height: 34px; border-radius: 9px; }
  .logo__nom { font-size: 1.15rem; }
  .entete__yt span { display: none; }
  .entete .bouton { padding: 10px 14px; font-size: .95rem; white-space: nowrap; min-height: 46px; }
}
@media (max-width: 480px) { .entete__plus { display: none; } #ref-commande { display: none; } .entete__actions .bouton { display: none; } }
@media (max-width: 480px) { .entete__yt { display: none; } }

/* accueil : l'en-tête se fond dans le haut orange, puis redevient crème au défilement */
.page-accueil .entete { background: var(--mur); border-bottom-color: rgba(255, 240, 228, .16); backdrop-filter: none; -webkit-backdrop-filter: none; transition: background .25s, box-shadow .25s, border-color .25s; }
.page-accueil .entete .logo, .page-accueil .entete .entete__nav a, .page-accueil .entete .entete__espace { color: #FFF8F0; transition: color .25s; }
.page-accueil .entete .logo::before { background-color: rgba(255, 248, 240, .16); box-shadow: inset 0 0 0 1.5px rgba(255, 248, 240, .55); transition: background-color .25s, box-shadow .25s; }
.page-accueil .entete .entete__nav a:hover, .page-accueil .entete .entete__espace:hover { color: #fff; text-decoration: underline; }
.page-accueil .entete .bouton { box-shadow: 0 0 0 2px rgba(255, 248, 240, .9); }
.page-accueil .entete.defile { background: rgba(250, 246, 240, .97); border-bottom-color: var(--ligne); box-shadow: 0 8px 24px -16px rgba(60, 30, 10, .35); }
.page-accueil .entete.defile .logo, .page-accueil .entete.defile .entete__nav a, .page-accueil .entete.defile .entete__espace { color: var(--encre); }
.page-accueil .entete.defile .entete__nav a:hover, .page-accueil .entete.defile .entete__espace:hover { color: var(--orange-encre); }
.page-accueil .entete.defile .logo::before { background-color: var(--mur); box-shadow: none; }
.page-accueil .entete.defile .bouton { box-shadow: 0 2px 0 var(--action-fonce); }

/* ── héros de l'accueil ── */
.heros { position: relative; overflow: hidden; padding: 56px 0 88px; background: var(--mur); color: #FFF8F0; }
.heros::before { content: ""; position: absolute; inset: auto -10% -45% 35%; height: 90%; background: radial-gradient(closest-side, rgba(255, 214, 180, .22), transparent); pointer-events: none; }
.heros__grille { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; gap: 64px; align-items: center; }
.heros h1 { color: #fff; margin-bottom: 22px; }
.heros .chapo { color: #FFF1E6; font-size: 1.25rem; max-width: 33em; }
.heros__chaine { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 26px; padding: 6px 16px 6px 6px; border-radius: 999px; background: rgba(40, 14, 2, .2); color: #FFF4EA; text-decoration: none; font-size: .98rem; font-weight: 550; }
.heros__chaine img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
.heros__chaine b { color: #fff; }
.heros__chaine:hover { background: rgba(40, 14, 2, .3); color: #fff; }
.heros__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.heros .bouton { box-shadow: 0 0 0 3px rgba(255, 248, 240, .92), 0 18px 34px -14px rgba(30, 10, 0, .7); }
.heros .bouton.bouton--fantome { box-shadow: none; }
.heros__preuves { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 24px 0 0; padding: 0; font-size: .98rem; color: #FFF1E6; }
.heros__preuves li { display: inline-flex; align-items: center; gap: 8px; }
.heros__preuves svg { width: 18px; height: 18px; color: #FFD9BF; }
.heros__visuel { position: relative; margin: 0; padding-bottom: 40px; }
.heros__photo { border-radius: 24px; overflow: hidden; aspect-ratio: 820 / 752; box-shadow: 0 0 0 1px rgba(255, 240, 228, .18), 0 40px 80px -30px rgba(40, 12, 0, .65); }
.heros__photo img { width: 100%; height: 100%; object-fit: cover; }
.heros__legende { position: absolute; top: 18px; right: 18px; padding: 7px 12px; border-radius: 999px; background: rgba(28, 20, 16, .62); color: #fff; font-size: .82rem; font-weight: 600; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.extrait { position: absolute; left: -44px; bottom: 0; width: min(360px, 82%); background: #fff; color: var(--encre); border-radius: 16px; box-shadow: var(--ombre-haute); padding: 18px 20px 14px; font-size: .95rem; }
.extrait__tete { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-bottom: 10px; margin-bottom: 4px; border-bottom: 1px solid var(--ligne); }
.extrait__tete b { font-size: 1rem; }
.extrait__tete span { font-size: .78rem; color: var(--gris-clair); white-space: nowrap; }
.extrait__ligne { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px dashed var(--ligne); line-height: 1.3; }
.extrait__ligne:last-child { border-bottom: 0; }
.extrait__ligne small { display: block; color: var(--gris); font-size: .84rem; }
@media (max-width: 960px) {
  .heros { padding: 36px 0 64px; }
  .heros__grille { grid-template-columns: 1fr; gap: 44px; }
  .heros__visuel { max-width: 560px; }
  .extrait { left: 14px; }
}
@media (max-width: 560px) {
  .heros__actions .bouton { width: 100%; }
  .heros__preuves { flex-direction: column; gap: 8px; }
  .extrait { position: relative; left: auto; bottom: auto; width: auto; margin: -56px 12px 0; }
  .heros__visuel { padding-bottom: 0; }
}

/* statuts (rapport, extrait) */
.statut { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: .8rem; font-weight: 700; white-space: nowrap; }
.statut::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.statut--corriger { background: var(--alerte-pale); color: var(--alerte); }
.statut--ok { background: var(--action-pale); color: var(--action); }

/* ── bandeau de réassurance ── */
.confiance { background: var(--brun); color: #F3EADF; }
.confiance ul { list-style: none; margin: 0 auto; padding: 22px 24px; display: grid; grid-template-columns: repeat(4, auto); justify-content: space-between; gap: 14px 32px; font-size: 1rem; font-weight: 600; }
.confiance li { display: flex; align-items: center; gap: 12px; }
.confiance svg { width: 26px; height: 26px; color: #F0B48F; }
@media (max-width: 900px) { .confiance ul { grid-template-columns: 1fr 1fr; font-size: .95rem; } }
@media (max-width: 420px) { .confiance ul { grid-template-columns: 1fr; } }

/* ── le constat : les chiffres ── */
.chiffres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 8px; border-top: 1px solid var(--ligne); border-bottom: 1px solid var(--ligne); }
.chiffre { padding: 34px 32px 34px 0; }
.chiffre + .chiffre { padding-left: 32px; border-left: 1px solid var(--ligne); }
.chiffre__nombre { font: 800 clamp(2.6rem, 5vw, 3.6rem)/1 var(--sans); letter-spacing: -.035em; color: var(--orange-encre); margin-bottom: 14px; font-variant-numeric: tabular-nums; }
.chiffre p { margin: 0; font-size: 1.04rem; color: var(--gris); }
@media (max-width: 800px) { .chiffres { grid-template-columns: 1fr; } .chiffre, .chiffre + .chiffre { padding: 26px 0; border-left: 0; } .chiffre + .chiffre { border-top: 1px solid var(--ligne); } }
.source { font-size: .9rem; color: var(--gris-clair); margin-top: 18px; }
.calcul { margin-top: 20px; font-size: .98rem; color: var(--gris); }
.balance { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 0; margin-top: 40px; border-radius: 22px; box-shadow: var(--ombre); }
.balance__cote { padding: 32px 34px; }
.balance__cote--risque { background: var(--orange-voile); border: 1px solid #EFD3C1; border-right: 0; border-radius: 22px 0 0 22px; }
.balance__cote--audit { background: var(--action-pale); border: 1px solid #C5DECF; border-left: 0; border-radius: 0 22px 22px 0; }
.balance__cote p { margin: 0; color: var(--gris); font-size: 1.02rem; }
.balance__titre { display: block; font-weight: 700; font-size: 1.05rem; margin-bottom: 10px; }
.balance__montant { display: block; font: 800 clamp(2.4rem, 4.8vw, 3.4rem)/1 var(--sans); letter-spacing: -.035em; margin-bottom: 12px; }
.balance__cote--risque .balance__montant { color: var(--alerte); }
.balance__cote--audit .balance__montant { color: var(--action); }
.balance__contre { display: grid; place-items: center; width: 0; position: relative; z-index: 1; }
.balance__contre span { width: 54px; height: 54px; margin: 0 -27px; border-radius: 50%; background: #fff; box-shadow: var(--ombre); display: grid; place-items: center; font-weight: 800; color: var(--gris); font-size: .95rem; }
@media (max-width: 760px) {
  .balance { grid-template-columns: 1fr; }
  .balance__cote--risque { border: 1px solid #EFD3C1; border-bottom: 0; border-radius: 22px 22px 0 0; }
  .balance__cote--audit { border: 1px solid #C5DECF; border-top: 0; border-radius: 0 0 22px 22px; }
  .balance__contre { width: auto; height: 0; }
  .balance__contre span { margin: -27px 0; }
}

/* ── le test : « mon relevé risque-t-il d'être incomplet ? » ── */
.test { display: grid; grid-template-columns: 1.15fr .85fr; gap: 32px; align-items: start; }
.test__questions { background: #fff; border: 1px solid var(--ligne); border-radius: 22px; box-shadow: var(--ombre); padding: 10px 30px; }
.test__q { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--ligne); }
.test__q:last-child { border-bottom: 0; }
.test__q p { margin: 0; font-weight: 600; font-size: 1.08rem; line-height: 1.4; }
.oui-non { display: inline-flex; flex: none; padding: 4px; border-radius: 12px; background: var(--papier-2); gap: 4px; }
.oui-non button { min-width: 72px; min-height: 48px; padding: 0 16px; border: 0; border-radius: 9px; background: transparent; color: var(--gris); font: 700 1rem var(--sans); cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
.oui-non button:hover { color: var(--encre); }
.oui-non button[aria-pressed="true"] { background: #fff; color: var(--encre); box-shadow: 0 1px 3px rgba(40, 20, 8, .18); }
.oui-non button[data-v="1"][aria-pressed="true"] { background: var(--mur); color: #fff; }
.test__resultat { position: sticky; top: 100px; background: var(--brun); color: #F3EADF; border-radius: 22px; padding: 32px; box-shadow: var(--ombre-haute); }
.test__compte { display: flex; align-items: baseline; gap: 12px; margin-bottom: 8px; }
.test__compte b { font: 800 4rem/1 var(--sans); letter-spacing: -.04em; color: #fff; font-variant-numeric: tabular-nums; }
.test__compte span { font-weight: 600; color: #E9D9C8; }
.test__resultat h3 { color: #fff; font-size: 1.35rem; margin-bottom: 10px; }
.test__resultat p { color: #E3D4C4; font-size: 1.02rem; }
.test__liste { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 8px; }
.test__liste li { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; color: #fff; font-size: 1rem; }
.test__liste li::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #F0A577; margin-top: 9px; }
.test__resultat .bouton { box-shadow: 0 0 0 2px rgba(255, 248, 240, .2); }
.test__resultat .sous-bouton { color: #CDBBA9; }
@media (max-width: 900px) { .test { grid-template-columns: 1fr; } .test__resultat { position: static; } }
@media (max-width: 560px) { .test__questions { padding: 4px 18px; } .test__q { flex-direction: column; align-items: stretch; gap: 12px; } .oui-non { align-self: stretch; } .oui-non button { flex: 1; } }

/* ── ce que l'audit vérifie ── */
.grille-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 34px; }
.grille-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.point { background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 28px 26px; transition: border-color .15s, box-shadow .15s; }
.point:hover { border-color: var(--ligne-forte); box-shadow: var(--ombre); }
.point h3 { margin-bottom: 8px; }
.point p { margin: 0; font-size: 1.02rem; color: var(--gris); }
.point__icone { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: var(--orange-voile); color: var(--orange-encre); margin-bottom: 20px; }
.point__icone svg { width: 28px; height: 28px; }
@media (max-width: 960px) { .grille-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .grille-2, .grille-3 { grid-template-columns: 1fr; } }

/* ── exemple de rapport : un vrai document ── */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
@media (max-width: 960px) { .duo { grid-template-columns: 1fr; gap: 40px; } }
.document { position: relative; padding: 0 18px 22px 0; }
.document::before { content: ""; position: absolute; inset: 22px 0 0 18px; background: #fff; border: 1px solid var(--ligne); border-radius: 14px; transform: rotate(2.2deg); box-shadow: var(--ombre); }
.document__feuille { position: relative; background: #fff; border: 1px solid var(--ligne); border-radius: 14px; box-shadow: var(--ombre-haute); padding: 30px 30px 24px; font-size: .97rem; }
.document__tete { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; padding-bottom: 16px; border-bottom: 2px solid var(--encre); }
.document__tete b { display: block; font-size: 1.2rem; letter-spacing: -.01em; }
.document__tete small { color: var(--gris); font-size: .88rem; }
.etiquette { display: inline-block; font: 700 .78rem/1 var(--sans); padding: 7px 10px; border-radius: 999px; background: var(--papier-2); color: var(--gris); white-space: nowrap; align-self: flex-start; }
.document__resume { display: flex; gap: 10px; flex-wrap: wrap; margin: 16px 0 6px; }
.document table { width: 100%; border-collapse: collapse; margin-top: 10px; font-variant-numeric: tabular-nums; }
.document th { text-align: left; font-size: .8rem; font-weight: 700; color: var(--gris-clair); padding: 8px 6px; border-bottom: 1px solid var(--ligne); }
.document td { padding: 12px 6px; border-bottom: 1px solid var(--ligne); vertical-align: top; line-height: 1.35; }
.document tr:last-child td { border-bottom: 0; }
.document td:first-child { font-weight: 700; white-space: nowrap; }
.document td small { display: block; color: var(--gris); font-size: .86rem; margin-top: 2px; }
.document td:last-child { text-align: right; }
.document__courrier { margin-top: 18px; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 12px; background: var(--papier); border: 1px dashed var(--ligne-forte); font-size: .94rem; }
.document__courrier svg { width: 26px; height: 26px; color: var(--orange-encre); }
@media (max-width: 560px) {
  .document__feuille { padding: 22px 18px 18px; }
  .document { padding: 0 8px 14px 0; }
  .document::before { inset: 14px 0 0 8px; }
  .document__tete { flex-direction: column-reverse; gap: 10px; }
  .document thead { display: none; }
  .document tr { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--ligne); }
  .document tr:last-child { border-bottom: 0; }
  .document td { padding: 0; border: 0; }
  .document td:nth-child(2) { grid-column: 1 / -1; order: 3; margin-top: 6px; }
}
.rapport-exemple { background: #fff; border: 1px solid var(--ligne); border-radius: 16px; box-shadow: var(--ombre); padding: 28px; font-size: .98rem; }
.liste-coches { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 16px; }
.liste-coches li { display: flex; gap: 14px; align-items: flex-start; }
.coche { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--action-pale); color: var(--action); display: grid; place-items: center; margin-top: 1px; }
.coche svg { width: 14px; height: 14px; }

/* ── étapes ── */
.etapes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; counter-reset: e; position: relative; }
.etapes::before { content: ""; position: absolute; top: 27px; left: 28px; right: 12%; height: 2px; background: repeating-linear-gradient(90deg, var(--ligne-forte) 0 8px, transparent 8px 14px); }
.etapes li { position: relative; counter-increment: e; padding-top: 76px; }
.etapes li::before { content: counter(e); position: absolute; top: 0; left: 0; width: 56px; height: 56px; border-radius: 50%; background: var(--mur); color: #fff; font: 800 1.35rem/56px var(--sans); text-align: center; box-shadow: 0 0 0 7px var(--papier); }
.section--claire .etapes li::before { box-shadow: 0 0 0 7px var(--papier-2); }
.section--blanche .etapes li::before { box-shadow: 0 0 0 7px #fff; }
.etapes h3 { font-size: 1.2rem; margin-bottom: 8px; }
.etapes p { margin: 0; font-size: 1.02rem; color: var(--gris); }
.etapes__duree { display: inline-block; margin-top: 12px; font-size: .9rem; font-weight: 700; color: var(--orange-encre); }
@media (max-width: 900px) {
  .etapes { grid-template-columns: 1fr; gap: 0; }
  .etapes::before { top: 28px; bottom: 28px; left: 27px; right: auto; width: 2px; height: auto; background: repeating-linear-gradient(180deg, var(--ligne-forte) 0 8px, transparent 8px 14px); }
  .etapes li { padding: 4px 0 30px 84px; min-height: 86px; }
  .etapes li:last-child { padding-bottom: 0; }
}

/* ── « où envoyer mes documents » ── */
.ou-envoyer { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.maquette-espace { background: #fff; border: 1px solid var(--ligne); border-radius: 22px; box-shadow: var(--ombre-haute); padding: 10px 26px; }
.maquette-espace__titre { font-weight: 700; font-size: 1.05rem; padding: 18px 0 12px; border-bottom: 1px solid var(--ligne); }
.maquette-espace__ligne { display: flex; gap: 16px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--ligne); }
.maquette-espace__ligne:last-child { border-bottom: 0; }
.maquette-espace__ligne b { display: block; }
.maquette-espace__ligne small { color: var(--gris); font-size: .92rem; }
@media (max-width: 900px) { .ou-envoyer { grid-template-columns: 1fr; gap: 40px; } }

/* ── comparatif ── */
.comparatif { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border-radius: 20px; overflow: hidden; border: 1px solid var(--ligne); font-size: 1.02rem; box-shadow: var(--ombre); }
.comparatif th, .comparatif td { padding: 18px 22px; text-align: left; border-bottom: 1px solid var(--ligne); vertical-align: middle; }
.comparatif thead th { background: var(--papier); font-size: .95rem; font-weight: 700; color: var(--gris); }
.comparatif thead th:last-child { background: var(--action); color: #fff; }
.comparatif tbody th { font-weight: 650; }
.comparatif td:last-child { background: #F5FAF7; color: var(--action-fonce); font-weight: 700; }
.comparatif td { color: var(--gris); }
.comparatif tr:last-child td, .comparatif tr:last-child th { border-bottom: 0; }
.comparatif .oui, .comparatif .non { display: inline-flex; align-items: center; gap: 8px; }
.comparatif .oui::before, .comparatif .non::before { content: ""; width: 20px; height: 20px; flex: none; border-radius: 50%; background: var(--action) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat; }
.comparatif .non::before { background: #E9E1D7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6.5 6.5l7 7M13.5 6.5l-7 7' fill='none' stroke='%237A6E65' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center/100% no-repeat; }
@media (max-width: 640px) { .comparatif th, .comparatif td { padding: 13px 12px; font-size: .92rem; } .comparatif .oui::before, .comparatif .non::before { display: none; } }

/* ── l'offre : deux formules côte à côte ── */
.formules-offre { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 920px; margin: 0 auto; align-items: stretch; }
.offre-carte { position: relative; display: flex; flex-direction: column; background: #fff; border: 1.5px solid var(--ligne); border-radius: 24px; padding: 34px 32px 30px; box-shadow: var(--ombre); }
.offre-carte--principale { border: 2.5px solid var(--action); box-shadow: var(--ombre-haute); }
.offre-carte__badge { position: absolute; top: -15px; left: 30px; padding: 6px 14px; border-radius: 999px; background: var(--action); color: #fff; font-size: .85rem; font-weight: 700; }
.offre-carte h3 { font-size: 1.4rem; margin-bottom: 4px; }
.offre-carte__delai { color: var(--gris); margin: 0 0 22px; font-size: 1.02rem; }
.offre-carte__prix { display: flex; align-items: baseline; gap: 10px; padding-bottom: 22px; margin-bottom: 4px; border-bottom: 1px solid var(--ligne); }
.offre-carte__prix b { font: 800 3.4rem/1 var(--sans); letter-spacing: -.04em; }
.offre-carte__prix span { color: var(--gris); font-size: .98rem; }
.offre-carte .liste-coches { margin: 22px 0 28px; gap: 12px; font-size: 1.02rem; flex: 1; align-content: start; }
.offre-carte .bouton { width: 100%; }
.offre-carte .bouton--clair { border-color: var(--action); color: var(--action-fonce); }
.offre-carte .bouton--clair::after { content: ""; }
.offre-carte .bouton--clair:hover { background: var(--action-pale); color: var(--action-fonce); border-color: var(--action); }
@media (max-width: 800px) { .formules-offre { grid-template-columns: 1fr; } .offre-carte--principale { order: -1; } }
@media (max-width: 560px) { .offre-carte { padding: 30px 22px 24px; } .offre-carte .bouton { padding: 16px 18px; } .garantie { flex-direction: column; gap: 12px; padding: 22px; } }
.garantie { display: flex; gap: 20px; align-items: flex-start; max-width: 920px; margin: 28px auto 0; padding: 24px 28px; border-radius: 20px; background: #fff; border: 1px solid var(--ligne); }
.garantie svg { width: 40px; height: 40px; color: var(--action); }
.garantie b { display: block; font-size: 1.1rem; margin-bottom: 4px; }
.garantie p { margin: 0; color: var(--gris); font-size: 1rem; }
.paiement-logos { display: flex; justify-content: center; align-items: center; gap: 10px 18px; flex-wrap: wrap; margin-top: 20px; font-size: .92rem; color: var(--gris); }
.paiement-logos span { display: inline-flex; align-items: center; gap: 6px; }
/* anciens blocs d'offre (pages secondaires) */
.offre { max-width: 620px; margin: 36px auto 0; background: #fff; border: 2px solid var(--encre); border-radius: 22px; box-shadow: var(--ombre); overflow: hidden; }
.offre__tete { background: var(--encre); color: #fff; padding: 22px 30px; display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.offre__tete h3 { margin: 0; color: #fff; }
.offre__prix { font: 800 2.6rem/1 var(--sans); color: #fff; }
.offre__corps { padding: 26px 30px 30px; }
.offre__express { margin: 16px 0 0; padding: 14px 16px; background: var(--orange-voile); border-radius: 12px; font-size: .98rem; text-align: center; }
.offre__note { font-size: .92rem; color: var(--gris); text-align: center; margin: 14px 0 0; }

/* ── FAQ ── */
.faq { border-top: 1px solid var(--ligne); }
.faq details { border-bottom: 1px solid var(--ligne); }
.faq summary { list-style: none; cursor: pointer; padding: 24px 56px 24px 0; position: relative; font: 700 1.15rem/1.4 var(--sans); letter-spacing: -.01em; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 4px; top: 50%; width: 36px; height: 36px; margin-top: -18px; border-radius: 50%; background: var(--papier-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 8l4 4 4-4' fill='none' stroke='%231C1410' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat; transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(180deg); }
.faq summary:hover { color: var(--orange-encre); }
.faq details > div { padding: 0 56px 24px 0; color: var(--gris); font-size: 1.05rem; }
.faq details > div p:last-child { margin: 0; }
@media (max-width: 560px) { .faq details > div { padding-right: 0; } }

/* ── check-list gratuite ── */
.capture { background: #fff; border: 1px solid var(--ligne); border-radius: 24px; padding: 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; box-shadow: var(--ombre); }
.capture h2 { font-size: clamp(1.6rem, 3.2vw, 2.1rem); }
@media (max-width: 800px) { .capture { grid-template-columns: 1fr; padding: 26px; gap: 24px; } }

/* ── appel final ── */
.appel-final { background: var(--mur); color: #FFF1E6; padding: 88px 0; text-align: center; }
.appel-final h2 { color: #fff; max-width: 820px; margin: 0 auto 16px; }
.appel-final p { max-width: 36em; margin: 0 auto 30px; font-size: 1.15rem; }
.appel-final .bouton { box-shadow: 0 0 0 3px rgba(255, 248, 240, .92), 0 18px 34px -14px rgba(30, 10, 0, .7); }
.appel-final .sous-bouton { color: #FFE6D4; margin-top: 18px; }

/* ── formulaires ── */
.champ { margin-bottom: 22px; }
.champ label, .etiquette-champ { display: block; font-weight: 700; margin-bottom: 8px; }
.champ .aide, .aide { font-size: .95rem; color: var(--gris); margin: -2px 0 10px; }
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select, textarea {
  width: 100%; min-height: 58px; padding: 14px 16px;
  border: 1.5px solid var(--ligne-forte); border-radius: 12px; background: #fff; color: var(--encre);
  font: 500 1.08rem/1.4 var(--sans); transition: border-color .15s, box-shadow .15s;
}
input::placeholder, textarea::placeholder { color: #A0948A; }
textarea { min-height: 110px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--action); box-shadow: 0 0 0 4px rgba(23, 96, 63, .16); }
.case { display: flex; gap: 12px; align-items: flex-start; font-size: 1rem; cursor: pointer; }
.case input { flex: none; width: 24px; height: 24px; margin: 2px 0 0; accent-color: var(--action); }
.erreur { color: var(--alerte); font-weight: 700; min-height: 1.2em; margin: 12px 0 0; }
.succes { color: var(--action); font-weight: 700; }
.bandeau { border-radius: 14px; padding: 16px 20px; margin: 0 0 24px; font-size: 1rem; }
.bandeau--terre { background: var(--alerte-pale); border: 1px solid #EDBBA9; }
.bandeau--foret { background: var(--orange-voile); border: 1px solid #EFD3C1; }
.bandeau--vert { background: var(--action-pale); border: 1px solid #B9D8C6; color: #0E3A26; }

/* ── page commande ── */
.commande { display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: start; padding: 52px 0 80px; }
.carte { background: #fff; border: 1px solid var(--ligne); border-radius: 22px; padding: 32px; box-shadow: var(--ombre); }
.recap__ligne { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--ligne); }
.recap__ligne span:last-child { color: var(--action); font-weight: 700; white-space: nowrap; }
.recap__total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 18px; font: 800 1.7rem/1 var(--sans); letter-spacing: -.02em; }
@media (max-width: 860px) { .commande { grid-template-columns: 1fr; gap: 28px; padding-top: 30px; } .commande__recap { order: 2; } .carte { padding: 24px 20px; } }
.etape-commande { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 14px; }
.etape-commande h2 { font-size: 1.4rem; margin: 4px 0 4px; }
legend.etape-commande { font: 750 1.4rem/1.3 var(--sans); letter-spacing: -.015em; align-items: center; }
.etape-commande__num { flex: none; width: 38px; height: 38px; border-radius: 50%; background: var(--mur); color: #fff; display: grid; place-items: center; font: 800 1.05rem/1 var(--sans); }
.glisser { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 30px 18px; border: 2px dashed var(--action); border-radius: 18px; background: #F5FAF7; text-align: center; cursor: pointer; transition: background .15s, transform .15s; }
.glisser:hover, .glisser.survol { background: var(--action-pale); }
.glisser.survol { transform: scale(1.01); }
.glisser input, .glisser__photo input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.glisser:focus-within { outline: 3px solid var(--action); outline-offset: 3px; }
.glisser__icone { font-size: 2.2rem; line-height: 1; }
.glisser__titre { font: 700 1.2rem/1.3 var(--sans); color: var(--encre); }
.glisser__sous { font-size: .95rem; color: var(--gris); }
.glisser__photo { margin-top: 10px; position: relative; justify-content: center; text-align: center; }
.glisser__photo::after { content: none; }
@media (hover: hover) and (pointer: fine) { .glisser__photo { display: none; } }
.glisser--tel { display: none; }
@media (hover: none) { .glisser--ordi { display: none; } .glisser--tel { display: block; } }
.formules { display: grid; gap: 10px; }
.formule { cursor: pointer; }
.formule input { position: absolute; opacity: 0; pointer-events: none; }
.formule span { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 62px; padding: 14px 18px; border: 1.5px solid var(--ligne-forte); border-radius: 14px; background: #fff; transition: border-color .15s, background .15s; }
.formule b { font-weight: 700; }
.formule em { font: 800 1.35rem/1 var(--sans); font-style: normal; letter-spacing: -.02em; color: var(--encre); white-space: nowrap; }
.formule input:checked + span { border-color: var(--action); background: var(--action-pale); box-shadow: inset 0 0 0 1px var(--action); }
.formule input:checked + span em { color: var(--action); }
.formule input:focus-visible + span { outline: 3px solid var(--action); outline-offset: 2px; }

/* ── espace dossier ── */
.jauge { margin: 26px 0 30px; }
.jauge__barre { height: 8px; background: var(--ligne); border-radius: 99px; overflow: hidden; }
.jauge__barre span { display: block; height: 100%; width: 25%; background: var(--action); border-radius: 99px; transition: width .3s; }
.jauge__pas { display: flex; justify-content: space-between; margin-top: 10px; font-size: .88rem; color: var(--gris); gap: 8px; }
.jauge__pas .actif { color: var(--encre); font-weight: 700; }
.pas h2 { font-size: 1.7rem; }
.question { border: 0; margin: 0 0 28px; padding: 0; }
.question legend { font: 700 1.18rem/1.35 var(--sans); margin-bottom: 10px; padding: 0; }
.choix { display: flex; flex-wrap: wrap; gap: 10px; }
.choix label, .cases label { cursor: pointer; }
.choix input, .cases input { position: absolute; opacity: 0; pointer-events: none; }
.choix span, .cases span { display: inline-flex; align-items: center; min-height: 54px; padding: 12px 20px; border: 1.5px solid var(--ligne-forte); border-radius: 12px; background: #fff; font-weight: 600; }
.choix input:checked + span, .cases input:checked + span { border-color: var(--action); background: var(--action-pale); color: var(--action-fonce); box-shadow: inset 0 0 0 1px var(--action); }
.choix input:focus-visible + span, .cases input:focus-visible + span { outline: 3px solid var(--action); outline-offset: 2px; }
.cases { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cases span { width: 100%; }
@media (max-width: 560px) { .cases { grid-template-columns: 1fr; } }
.revele { margin-top: 14px; padding: 16px; background: var(--papier); border: 1px solid var(--ligne); border-radius: 14px; }
.trio { display: grid; grid-template-columns: 1fr 1.4fr 1.2fr; gap: 10px; }
.duo-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.lien-bouton { background: none; border: 0; color: var(--orange-encre); font: 700 1rem var(--sans); cursor: pointer; padding: 10px 0; text-decoration: underline; }
.depot { border: 2px dashed var(--ligne-forte); border-radius: 16px; background: #fff; padding: 26px; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; }
.depot:hover, .depot.survol { border-color: var(--action); background: var(--action-pale); }
.depot input { position: absolute; opacity: 0; pointer-events: none; width: 1px; }
.depot b { display: block; font: 700 1.15rem var(--sans); margin-bottom: 4px; }
.depot span { font-size: .95rem; color: var(--gris); }
.pieces { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 8px; }
.pieces li { display: flex; justify-content: space-between; gap: 10px; align-items: center; background: var(--papier); border: 1px solid var(--ligne); border-radius: 12px; padding: 10px 14px; font-size: .97rem; }
.pieces button { background: none; border: 0; color: var(--orange-encre); font: 700 .92rem var(--sans); cursor: pointer; min-height: 40px; }
.navigation-pas { display: flex; justify-content: space-between; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
.navigation-pas .bouton { flex: 1 1 200px; }
.tableau__titre { font-size: clamp(2.1rem, 5vw, 3rem); }
.suivi { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 18px; }
.suivi__etape { display: grid; grid-template-columns: 52px 1fr; gap: 18px; background: #fff; border: 2px solid var(--ligne); border-radius: 22px; padding: 24px 24px 26px; box-shadow: var(--ombre); }
.suivi__rond { width: 52px; height: 52px; border-radius: 50%; background: var(--papier); border: 2px solid var(--ligne-forte); display: grid; place-items: center; font: 800 1.3rem/1 var(--sans); color: var(--gris); flex: none; }
.suivi__corps h2 { font-size: 1.45rem; margin: 6px 0 4px; }
.suivi__etat { font-weight: 700; color: var(--orange-encre); margin: 0 0 14px; }
.suivi__texte { color: var(--gris); font-size: 1rem; }
.suivi__etape.fait { border-color: #A9CFB9; }
.suivi__etape.fait .suivi__rond, .suivi__rond--fait { background: var(--action); border-color: var(--action); color: transparent; position: relative; }
.suivi__etape.fait .suivi__rond::after, .suivi__rond--fait::after { content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font: 800 1.5rem/1 var(--sans); }
.suivi__etape.fait .suivi__etat, .suivi__etape.en-cours .suivi__etat { color: var(--action); }
.suivi__etape.survol { border-color: var(--action); border-style: dashed; background: var(--action-pale); }
@media (max-width: 560px) { .suivi__etape { grid-template-columns: 1fr; gap: 8px; padding: 20px 18px; } .suivi__rond { width: 44px; height: 44px; } }
.envoi { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 4px 0 12px; }
.envoi__bouton { position: relative; display: flex; align-items: center; gap: 14px; min-height: 84px; padding: 16px 18px; border-radius: 16px; background: var(--action); color: #fff; cursor: pointer; box-shadow: 0 2px 0 var(--action-fonce), 0 12px 24px -12px rgba(14, 74, 48, .7); transition: background .15s, transform .15s; }
.envoi__bouton:hover { background: var(--action-fonce); transform: translateY(-1px); }
.envoi__bouton input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.envoi__bouton:focus-within { outline: 3px solid var(--orange-encre); outline-offset: 3px; }
.envoi__icone { font-size: 1.9rem; line-height: 1; }
.envoi__bouton b { display: block; font-size: 1.1rem; }
.envoi__bouton small { display: block; font-size: .9rem; opacity: .92; }
.envoi__bouton--photo { background: #fff; color: var(--encre); border: 2px solid var(--action); box-shadow: none; }
.envoi__bouton--photo:hover { background: var(--action-pale); }
@media (hover: hover) and (pointer: fine) { .envoi { grid-template-columns: 1fr; } .envoi__bouton--photo { display: none; } }
@media (max-width: 560px) { .envoi { grid-template-columns: 1fr; } }
.petit-aide { margin: 10px 0 0; font-size: 1rem; }
.petit-aide summary { cursor: pointer; font-weight: 700; color: var(--orange-encre); padding: 8px 0; }
.petit-aide p { color: var(--gris); margin: 6px 0; }
.petit-autre { font-size: .97rem; color: var(--gris); margin: 12px 0 0; }

/* ── page « Mon espace » ── */
.espace { padding-top: 52px; padding-bottom: 80px; }
.espace h1 { font-size: clamp(2rem, 4.6vw, 2.8rem); }
.espace .carte { margin-top: 26px; }
.espace .carte h2 { font-size: 1.5rem; }
.espace__retour { border: 2px solid var(--action); }
.aides { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 26px; }
.aide-carte { background: #fff; border: 1px solid var(--ligne); border-radius: 18px; padding: 22px; font-size: .97rem; }
.aide-carte h3 { font-size: 1.12rem; margin: 10px 0 6px; }
.aide-carte p { margin: 0; color: var(--gris); }
.aide-carte__icone { font-size: 1.6rem; }
@media (max-width: 760px) { .aides { grid-template-columns: 1fr; } }

/* ── pied ── */
.pied { background: var(--brun); color: #D6C9B9; padding: 64px 0 44px; font-size: .97rem; }
.pied a { color: #F3EADF; text-decoration: none; }
.pied a:hover { color: #fff; text-decoration: underline; }
.pied__grille { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 40px; }
.pied .logo { color: #fff; }
.pied__titre { display: block; color: #fff; font-weight: 700; margin-bottom: 14px; }
.pied ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pied__bas { border-top: 1px solid #3E2B21; margin-top: 44px; padding-top: 24px; font-size: .86rem; line-height: 1.55; color: #AE9F8F; }
@media (max-width: 760px) { .pied__grille { grid-template-columns: 1fr; gap: 28px; } }

/* ── barre collante mobile (aucun champ dedans) ── */
.barre-mobile { display: none; }
@media (max-width: 760px) {
  .barre-mobile { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); border-top: 1px solid var(--ligne); box-shadow: 0 -10px 30px -18px rgba(40, 20, 8, .4); gap: 14px; align-items: center; transform: translateY(110%); transition: transform .25s; }
  .barre-mobile.visible { transform: none; }
  .barre-mobile .bouton { flex: 1; min-height: 54px; font-size: 1.02rem; padding: 12px 16px; }
  .barre-mobile__prix { font: 800 1.45rem/1 var(--sans); letter-spacing: -.02em; }
  body.a-barre { padding-bottom: 82px; }
}

/* ── pages légales ── */
.legal { padding: 52px 0 80px; }
.legal h1 { font-size: clamp(2rem, 4.4vw, 2.8rem); }
.legal h2 { font-size: 1.45rem; margin-top: 1.8em; }
.legal p, .legal li { font-size: 1.03rem; }

/* ── anciens éléments encore cités par des pages secondaires ── */
.filet { display: none; }
mark { background: linear-gradient(transparent 58%, #F3CDB4 58%); color: inherit; padding: 0 2px; }
.portrait__cadre { border-radius: 20px; overflow: hidden; }
.pastille { width: 12px; height: 12px; border-radius: 50%; margin-top: 7px; }
.pastille--terre { background: var(--alerte); }
.pastille--foret { background: var(--action); }
.anomalie { display: grid; grid-template-columns: auto 1fr; gap: 14px; padding: 12px 0; border-bottom: 1px dashed var(--ligne); }
.anomalie:last-child { border-bottom: 0; }
.anomalie p { margin: 0; color: var(--gris); font-size: .95rem; }
.anomalie b { color: var(--encre); display: block; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }