/* BoostImpact, page de vente et pages du parcours. Charte du logo boostimpact.agency (16/10/2026) : marine #051234 et vert #7CCE12.
   Marine = fond des pages sombres et texte des pages claires. Vert = petites touches seulement : point du mot-symbole, focus, boutons d'action
   (texte marine sur vert, contraste 9,4:1), repère ponctuel (prix de départ, mention d'offre, sur fond marine). Jamais de texte vert sur blanc (1,96:1).
   Les noms de variables --bleu et --citron sont gardés (rôles inchangés) ; leurs valeurs suivent la nouvelle charte.
   Titres : Anton en majuscules, réservé aux titres COURTS (h1, h2 de quelques mots, prix) ; le reste en Figtree, jamais de paragraphe en Anton.
   Tout le reste : Figtree 400 à 700. Fontsource (npm @fontsource/anton et @fontsource/figtree 5.3.0), licence SIL OFL 1.1, hébergées dans fonts/ (voir fonts/OFL-*.txt).
   Interdits : dégradé, pilule (rayon 12 px au plus sur les boutons), trait coloré devant un libellé, orange, majuscules d'étiquette. */

@font-face{font-family:'Anton';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/anton-400.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/figtree-400.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-weight:500;font-style:normal;font-display:swap;src:url(fonts/figtree-500.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-weight:600;font-style:normal;font-display:swap;src:url(fonts/figtree-600.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-weight:700;font-style:normal;font-display:swap;src:url(fonts/figtree-700.woff2) format('woff2')}

:root{
  --nuit:#051234;
  --carte:#0C1D45;
  --blanc:#FFFFFF;
  --doux:#E4E6F2;
  --discret:#A9ADBF;
  --bleu:#7CCE12;
  --bleu-fonce:#6AB80C;
  --lien-survol:#B7C4E6;
  --citron:#7CCE12;
  --vert:#7CCE12;
  --clair:#F4F5FA;
  --gris-clair:#3A3D4D;
  --filet:rgba(255,255,255,.14);
  --filet-fort:rgba(255,255,255,.2);
  --titre:'Anton','Arial Narrow',Impact,system-ui,sans-serif;
  --sans:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --marge:16px;
  --saut:88px;
  --r-btn:10px;
  --r-carte:22px;
  /* Couleurs de la page courante (les pages légales passent en clair) */
  --fond:var(--nuit);
  --texte:var(--blanc);
  --texte-doux:var(--doux);
  --texte-discret:var(--discret);
  --trait:var(--filet);
  --trait-fort:var(--filet-fort);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--nuit);font-synthesis-weight:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--fond);color:var(--texte);font-family:var(--sans);font-size:17px;line-height:1.55;font-variant-numeric:lining-nums;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
input,button,select,textarea{font-family:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0}
a{color:inherit;text-underline-offset:4px}
a:hover{color:var(--lien-survol)}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--vert);outline-offset:3px}
sup{font-size:.6em;line-height:0;vertical-align:.6em}

/* Anton : une seule graisse (400), majuscules et interlettrage léger. Classe .anton pour les autres titres courts et grands chiffres. */
h1,h2,.anton{font-family:var(--titre);font-weight:400;text-transform:uppercase;letter-spacing:.012em;color:var(--texte);text-wrap:balance}
h1{font-size:clamp(44px,7vw,100px);line-height:1}
h2{font-size:clamp(32px,4.4vw,62px);line-height:1.04}
h3{font-family:var(--sans);font-weight:700;font-size:22px;line-height:1.2;color:var(--texte)}
b,strong{font-weight:700}
.citron{color:var(--citron)}

.wrap{max-width:1280px;margin:0 auto;padding-left:var(--marge);padding-right:var(--marge)}
.section{padding-top:var(--saut)}
.note{font-size:14px;line-height:1.5;color:var(--texte-discret)}
.mention{font-size:13px;line-height:1.45;color:var(--discret)}
.hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.evitement{position:absolute;left:var(--marge);top:-80px;background:var(--blanc);color:var(--nuit);padding:12px 16px;border-radius:var(--r-btn);z-index:30;font-weight:700}
.evitement:focus{top:8px}

/* ---------- Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 22px;border:1.5px solid transparent;border-radius:var(--r-btn);background:var(--carte);color:var(--blanc);font:inherit;font-size:16px;font-weight:700;line-height:1.25;text-align:center;text-decoration:none;cursor:pointer}
.btn:hover{color:var(--blanc)}
.btn-prim{background:var(--bleu);border-color:var(--bleu);color:var(--nuit)}
.btn-prim:hover{background:var(--bleu-fonce);border-color:var(--bleu-fonce);color:var(--nuit)}
.btn-contour{background:transparent;border-color:rgba(255,255,255,.7);color:var(--blanc)}
.btn-contour:hover{background:rgba(255,255,255,.08);border-color:var(--blanc)}
.btn-blanc{background:var(--blanc);border-color:var(--blanc);color:var(--nuit)}
.btn-blanc:hover{background:var(--doux);border-color:var(--doux);color:var(--nuit)}
.btn-grand{min-height:58px;padding:12px 26px;font-size:18px}
.btn[disabled]{opacity:.65;cursor:default}

/* ---------- En-tête */
.page{position:relative}
.entete{position:relative;z-index:2;background:var(--nuit);border-bottom:1px solid var(--filet);color:var(--blanc)}
.entete .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 16px;padding-top:12px;padding-bottom:4px}
/* Mot-symbole « boostimpact.agency » (logo du 16/10/2026, en texte) : minuscules, Figtree 700 (géométrique, comme le logo), point vert, « agency » en 400. */
.logo{order:1;display:inline-flex;align-items:baseline;min-height:48px;padding-top:12px;font-family:var(--sans);font-weight:700;text-transform:none;font-size:25px;letter-spacing:-.02em;line-height:1;text-decoration:none;color:var(--blanc);white-space:nowrap}
.logo-point{color:var(--vert)}
.logo-suffixe{font-weight:400;letter-spacing:0}
.logo:hover{color:var(--blanc)}
.btn-menu{order:3;min-height:44px;padding:8px 18px;font-size:15px}
.menu{order:4;flex:1 0 100%;display:flex;flex-wrap:wrap;gap:0 20px;font-size:15px;font-weight:600}
.menu a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--blanc)}
.menu a:hover{color:var(--lien-survol)}
.entete-photo{position:absolute;top:0;left:0;right:0;background:transparent;border-bottom:0}
.entete-simple .wrap{flex-wrap:nowrap;min-height:72px;padding-top:0;padding-bottom:0}
.retour{order:3;display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:600;color:var(--blanc)}
.entete-simple .wrap{gap:0 12px}
/* Sélecteur de langue « FR / EN » (bloc legal:langues, outils/legal.py) : texte simple, la langue courante en blanc, l'autre en lien (cible 44 px). */
.langues{order:2;margin-left:auto;display:flex;align-items:center;font-size:15px;font-weight:600;line-height:1;color:var(--discret)}
.langues a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;color:var(--doux);text-decoration:none}
.langues a:hover{color:var(--lien-survol);text-decoration:underline}
.langue-active{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;color:var(--blanc);font-weight:700}
.langues-sep{padding:0 1px}

/* ---------- Premier écran : promesse, fonctionnement, prix de départ, bouton ; photo et aperçu du service (tout visible sans défiler) */
.haut{padding-top:18px;padding-bottom:28px}
.haut-grille{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:center}
.haut-texte{display:flex;flex-direction:column;gap:12px;min-width:0}
h1{font-size:clamp(38px,5.4vw,78px);line-height:.98}
.chapo{font-size:17px;line-height:1.45;max-width:560px;color:var(--doux)}
.chapo strong{color:var(--blanc)}
/* Mot-symbole au-dessus du titre : la marque, pas un titre ; même dessin que l'en-tête (minuscules, point vert). */
.marque-symbole{font-family:var(--sans);font-weight:700;letter-spacing:-.02em;font-size:22px;line-height:1;color:var(--doux)}
.marque-symbole .logo-suffixe{font-weight:400;letter-spacing:0}
.haut-comment{font-size:17px;line-height:1.45;color:var(--blanc)}
.haut-prix{font-size:18px;line-height:1.35;font-weight:600;color:var(--blanc)}
.prix-repere{color:var(--citron);font-weight:700}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px}
.lien-fort{display:inline-flex;align-items:center;min-height:44px;color:var(--lien-survol);font-weight:700;text-decoration:underline;text-underline-offset:5px}
.lien-fort:hover{color:var(--blanc)}
.apercu{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0}
.apercu-photo{width:100%;height:118px;object-fit:cover;object-position:60% 45%;border-radius:14px}
.apercu-fil{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
.apercu-carte{background:var(--carte);border:1px solid var(--filet);border-radius:12px;padding:8px 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-width:0}
.apercu-quoi{font-size:13px;font-weight:700;color:var(--blanc)}
.apercu-ligne{display:flex;align-items:center;gap:8px;font-size:14px}
.apercu-texte{font-size:14px;line-height:1.35;color:var(--doux)}
.apercu-action{font-size:13px;font-weight:700;color:var(--lien-survol)}
.apercu-carte:nth-child(2) .apercu-texte,.apercu-carte:nth-child(3) .apercu-texte{display:none}
.apercu .mention{font-size:12px}
.etoiles{display:inline-block;width:92px;height:16px;background:var(--blanc);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6-4.9-4.6 6.6-.8z'/%3E%3C/svg%3E") repeat-x left center/18.4px 16px;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6-4.9-4.6 6.6-.8z'/%3E%3C/svg%3E") repeat-x left center/18.4px 16px}


/* ---------- Têtes de section */
.tete{display:flex;flex-direction:column;gap:14px;max-width:820px;margin-bottom:32px}
.tete-chapo{font-size:18px;line-height:1.5;color:var(--doux);max-width:640px}

/* ---------- Démonstration : photo, publication, résultat */
.demo{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.demo-etape{background:var(--carte);border:1px solid var(--filet);border-radius:var(--r-carte);padding:18px;display:flex;flex-direction:column;gap:12px;min-width:0}
.demo-num{font-weight:700;font-size:17px}
.demo-etape>img{border-radius:12px;aspect-ratio:4/5;object-fit:cover;width:100%;max-height:340px}
.demo-texte{font-size:15px;line-height:1.45;color:var(--doux)}
.mini-post{background:var(--blanc);color:var(--nuit);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}
.mini-post img{border-radius:8px;aspect-ratio:4/5;object-fit:cover;max-height:220px;width:100%}
.mini-compte{display:flex;align-items:center;gap:8px;font-size:14px}
.mini-avatar{width:26px;height:26px;border-radius:50%;background:var(--nuit);color:var(--blanc);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.mini-legende{font-size:14px;line-height:1.4}
.mini-bouton{align-self:flex-start;background:var(--bleu);color:var(--nuit);border-radius:8px;padding:6px 14px;font-size:14px;font-weight:700}
.resultat{display:flex;flex-direction:column;gap:10px}
.resultat-ligne{background:rgba(255,255,255,.06);border-radius:12px;padding:12px 14px;font-size:15px;line-height:1.45}
.demonstration .mention,#demonstration .mention{margin-top:12px}

/* ---------- Trois services */
.services{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.service{border-top:1px solid var(--filet-fort);padding:18px 0 4px;display:flex;flex-direction:column;gap:8px}
.service p{font-size:17px;line-height:1.5;color:var(--doux)}
.regle-ia{margin-top:22px;font-size:16px;line-height:1.5;color:var(--blanc);max-width:720px}

/* ---------- Fonctionnement en 3 étapes */
.etapes{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.etape{display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:start;background:var(--carte);border:1px solid var(--filet);border-radius:var(--r-carte);padding:20px}
.etape-num{font-family:var(--titre);font-size:40px;line-height:1;color:var(--blanc)}
.etape p{font-size:16px;line-height:1.5;color:var(--doux);margin-top:6px}

/* ---------- Offres : trois cartes côte à côte, l'offre conseillée marquée par son cadre et sa mention (citron), jamais par un bandeau */
.offres{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:stretch}
.offre{background:var(--carte);border:1px solid var(--filet);border-radius:var(--r-carte);padding:24px 20px;display:flex;flex-direction:column;gap:16px;min-width:0}
.offre.reco{border:2px solid var(--blanc)}
.offre-nom{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px}
.offre-nom h3{font-family:var(--titre);font-weight:400;text-transform:uppercase;font-size:34px;line-height:1}
.reco-lib{font-size:15px;font-weight:700;color:var(--citron)}
.offre-promesse{font-size:17px;line-height:1.45;color:var(--doux)}
.prix-bloc{display:flex;flex-direction:column;gap:4px}
.prix{display:flex;align-items:baseline;gap:8px}
.prix-montant{font-family:var(--titre);font-size:52px;line-height:1;color:var(--blanc)}
.prix-unite{font-size:16px;font-weight:600;color:var(--doux)}
.prix-semestre{font-size:15px;line-height:1.4;color:var(--doux)}
.inclus{list-style:none;display:flex;flex-direction:column;gap:10px;flex:1}
.inclus li{font-size:16px;line-height:1.45;padding-top:10px;border-top:1px solid var(--filet)}
.inclus .inclus-tout{font-weight:700;border-top:0;padding-top:0}
.offre-sans{font-size:14px;color:var(--discret)}
.offre .btn{width:100%}
.compare-cadre{margin-top:28px;overflow-x:auto;border:1px solid var(--filet);border-radius:var(--r-carte)}
.compare{width:100%;min-width:640px;border-collapse:collapse;font-size:15px;line-height:1.4}
.compare th,.compare td{padding:12px 14px;border-top:1px solid var(--filet);text-align:left;vertical-align:top;font-weight:400}
.compare thead th,.compare thead td{border-top:0;font-weight:700;font-size:16px}
.compare tbody th{font-weight:600;color:var(--blanc)}
.compare td{color:var(--doux)}
.compare .reco{background:rgba(255,255,255,.05)}
.regle,.garantie-delais,.recoit,.urgence{margin-top:28px;background:var(--carte);border:1px solid var(--filet);border-radius:var(--r-carte);padding:22px 20px;display:flex;flex-direction:column;gap:12px}
.regle p,.recoit p{font-size:16px;line-height:1.5;color:var(--doux)}
.regle strong,.recoit strong{color:var(--blanc)}
.garantie-promesse{font-size:19px;line-height:1.45;font-weight:700}
.recoit-liste{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.recoit-liste li{display:flex;flex-direction:column;gap:2px;font-size:16px;line-height:1.45;color:var(--doux)}
.recoit-liste strong{color:var(--blanc)}
.urgence-titre{font-size:19px;font-weight:700}
.urgence p:not(.urgence-titre){font-size:16px;color:var(--doux)}
.offres-pied{margin-top:24px;display:flex;flex-direction:column;gap:8px}
.offres-pied .garantie{font-size:18px;font-weight:700}
.contrat{font-size:15px;color:var(--doux)}

/* ---------- Équipe et responsabilités (sans photo, sans avatar, sans icône) */
.equipe{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;max-width:820px}
.personne{border-top:1px solid var(--filet-fort);padding-top:16px;display:flex;flex-direction:column;gap:6px}
.personne p,.responsabilite p{font-size:17px;line-height:1.5;color:var(--doux)}
.responsabilite{margin-top:24px;max-width:820px;display:flex;flex-direction:column;gap:8px}
.responsabilite a{color:var(--lien-survol)}

/* ---------- Simulateur (page secondaire, site/simulateur.html) */
.simu{display:flex;flex-direction:column;gap:22px}
.calc{display:flex;flex-direction:column;gap:16px}
.calc-mode{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
.calc-mode legend{font-size:15px;font-weight:700;margin-bottom:8px}
.calc-radio{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:16px}
.calc-trio{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.calc-resultat{background:var(--carte);border:1px solid var(--filet);border-radius:var(--r-carte);padding:22px 20px;display:flex;flex-direction:column;gap:12px}
.calc-montant{font-family:var(--titre);font-size:42px;line-height:1.05;color:var(--blanc)}
.calc-prudence,.calc-limite{font-size:15px;line-height:1.5;color:var(--doux)}
.calc-limite{background:rgba(255,255,255,.06);border-radius:12px;padding:14px 16px;color:var(--blanc)}


/* ---------- Questions */
.faq{max-width:900px;display:flex;flex-direction:column;gap:28px}
.faq h2{font-size:clamp(34px,4vw,56px);line-height:1}
.questions{border-top:1px solid var(--filet-fort)}
.q{border-bottom:1px solid var(--filet-fort)}
.q summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:14px 0;font-size:19px;font-weight:700;cursor:pointer;list-style:none}
.q summary::-webkit-details-marker{display:none}
.q summary::after{content:"+";flex:none;font-size:26px;font-weight:400;line-height:1}
.q[open] summary::after{content:"\2212"}
.q p{padding:0 0 22px;max-width:40em;font-size:18px;line-height:1.55;color:var(--doux)}

/* ---------- Appel final et formulaire d'audit */
.audit-section{padding-bottom:var(--saut)}
.audit-bloc{background:var(--carte);border:1px solid var(--filet);border-radius:24px;padding:32px 20px;display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center;color:var(--blanc)}
.audit-texte{display:flex;flex-direction:column;gap:18px}
.audit-texte h2{font-size:clamp(38px,5.4vw,76px);line-height:.98}
.audit-texte p{font-size:20px;line-height:1.5}
.audit-bloc :focus-visible{outline-color:var(--blanc)}
.form{display:flex;flex-direction:column;gap:16px;min-width:0}
.champ{display:flex;flex-direction:column;gap:6px;min-width:0}
.champ label,.lib-champ,.lib{font-size:15px;font-weight:700}
.aide{font-size:14px;line-height:1.4}
.rang{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=number],select{font:inherit;font-size:17px;color:var(--nuit);background:var(--blanc);border:1.5px solid var(--blanc);border-radius:12px;padding:10px 16px;min-height:54px;width:100%}
input::placeholder{color:#6B6F80}
input:focus-visible,select:focus-visible{outline:3px solid var(--blanc);outline-offset:1px}
.choix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.choix .m-choix{min-height:48px;padding:8px 12px;border:1.5px solid rgba(255,255,255,.75);border-radius:var(--r-btn);background:transparent;color:var(--blanc);font:inherit;font-size:15px;font-weight:700;line-height:1.25;text-align:left;cursor:pointer}
.choix .m-choix:hover{background:rgba(255,255,255,.1)}
.choix .m-choix[aria-pressed="true"]{background:var(--blanc);border-color:var(--blanc);color:var(--nuit)}
.ok{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.45}
.ok input{width:22px;height:22px;margin:1px 0 0;flex:none;accent-color:var(--bleu)}
.ok a{color:inherit}
.form .btn{width:100%;margin-top:4px}
.audit-bloc .form .btn-prim{min-height:62px;font-size:19px}
.audit-note{font-size:16px!important;color:var(--doux)}
.mention-page{margin-top:18px}
.err{background:var(--blanc);color:#A11212;border-radius:var(--r-btn);padding:12px 14px;font-size:15px;font-weight:700}


/* ---------- Pied de page (contenu géré par outils/legal.py : ne pas modifier entre les marqueurs) */
/* Pied compact : « © 2026 RENOM », liens légaux, « Un service de Girlden LTD » sur une ligne (retour à la ligne permis sur mobile).
   Identité complète (.pied-identite) seulement sur les pages légales et la fiche de mise en route : 12 px, gris lisible (règle 20 du
   règlement britannique 2015/17 : lisible à l'œil nu). */
.pied{border-top:1px solid var(--filet);background:var(--nuit);padding:14px 0 18px;font-size:14px;line-height:1.5;color:var(--discret)}
.pied .wrap{display:flex;flex-direction:column;gap:2px}
.pied-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:0 20px}
.pied-copy{color:var(--doux);font-weight:600}
.pied-societe{font-size:12px;color:var(--discret)}
.pied-identite{font-size:12px;line-height:1.5;color:var(--discret);max-width:820px;padding-bottom:4px}
.pied-liens{display:flex;flex-wrap:wrap;gap:0 18px}
.pied-liens a{display:inline-flex;align-items:center;min-height:44px;color:var(--discret)}
.pied-liens a:hover{color:var(--blanc)}

/* ---------- Pages du parcours (merci, mise en route) */
.simple{padding-top:56px;padding-bottom:88px;display:flex;flex-direction:column;gap:24px;max-width:820px}
.simple h1{font-size:clamp(42px,6vw,72px)}
.simple .chapo{font-size:19px}
.carte-form,.form-fiche{background:var(--carte);border:1px solid var(--filet);border-radius:var(--r-carte);padding:24px 20px;gap:18px}
.carte-form{display:flex;flex-direction:column}
.form-fiche{display:grid;grid-template-columns:minmax(0,1fr)}
.carte-form .lib{color:var(--doux)}
.form-fiche .ok input,.carte-form .ok input{accent-color:var(--bleu)}
.form-fiche .ok a{color:var(--blanc)}
.form-fiche [role=alert]{color:var(--blanc);font-weight:700}
.simple .note{color:var(--discret)}

/* ---------- Pages légales : fond clair, en-tête et polices de la charte */
body.clair{--fond:#FFFFFF;--texte:#051234;--texte-doux:#2B2E3A;--texte-discret:#545869;--trait:#DCDEE8;--trait-fort:#C3C6D3}
body.clair main a:hover{color:var(--nuit);text-decoration-thickness:2px}
body.clair main :focus-visible{outline-color:var(--nuit)}
.juridique{max-width:820px;padding-top:44px;padding-bottom:56px;display:flex;flex-direction:column;gap:16px;color:var(--texte-doux);overflow-wrap:anywhere}
.juridique h1{font-size:clamp(38px,5vw,56px);line-height:1.1;color:var(--texte)}
.juridique h2{font-size:26px;line-height:1.15;margin-top:24px;color:var(--texte)}
.juridique h3{font-family:var(--sans);font-size:18px;margin-top:8px;color:var(--texte)}
.juridique ul,.juridique ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.juridique .maj{color:var(--texte-discret);font-size:15px}
.juridique .version-fr{padding:12px 16px;background:var(--clair);border-radius:12px;font-size:15px;color:var(--texte)}
.juridique blockquote{margin:0;padding:16px 20px;background:var(--clair);border-radius:12px}
.juridique a{text-underline-offset:3px}
.sommaire ol{columns:2 220px;column-gap:32px;display:block;font-size:15px}
.sommaire li{margin-bottom:6px;break-inside:avoid}
.fiche-legale{display:flex;flex-direction:column;border-top:1px solid var(--trait)}
.fiche-legale>div{display:grid;grid-template-columns:minmax(0,1fr);gap:2px 24px;padding:10px 0;border-bottom:1px solid var(--trait)}
.fiche-legale dt{font-size:14px;color:var(--texte-discret)}
.fiche-legale dd{margin:0;color:var(--texte)}
.a-completer{font-weight:700;color:var(--texte)}
.tableau-legal{overflow-x:auto;border:1px solid var(--trait);border-radius:12px}
.tableau-legal table{width:100%;min-width:560px;border-collapse:collapse;font-size:15px;line-height:1.5}
.tableau-legal th,.tableau-legal td{padding:10px 12px;border-top:1px solid var(--trait);text-align:left;vertical-align:top;font-weight:400}
.tableau-legal thead th{border-top:0;font-size:14px;font-weight:700;color:var(--texte);background:var(--clair)}
.tableau-legal tbody th{font-weight:600;color:var(--texte)}
.tableau-legal .offres-legales{min-width:0;overflow-wrap:normal}
@media (max-width:759px){
  .tableau-legal:not(:has(.offres-legales)){overflow:visible;border:0;border-radius:0}
  .tableau-legal:not(:has(.offres-legales)) table{min-width:0}
  .tableau-legal:not(:has(.offres-legales)) thead{display:none}
  .tableau-legal:not(:has(.offres-legales)) tr,.tableau-legal:not(:has(.offres-legales)) th,.tableau-legal:not(:has(.offres-legales)) td{display:block}
  .tableau-legal:not(:has(.offres-legales)) tr{border:1px solid var(--trait);border-radius:12px;margin-bottom:12px;padding:4px 0}
  .tableau-legal:not(:has(.offres-legales)) th,.tableau-legal:not(:has(.offres-legales)) td{border-top:0;padding:6px 14px}
  .tableau-legal td[data-l]::before{content:attr(data-l);display:block;font-size:13px;color:var(--texte-discret)}
  .offres-legales{font-size:13px;hyphens:auto}
  .offres-legales th,.offres-legales td{padding:8px 6px}
  .offres-legales th:first-child{padding-left:10px}
}


/* ---------- Tablette */
@media (min-width:760px){
  :root{--marge:24px;--saut:104px}
  .entete .wrap{flex-wrap:nowrap;min-height:76px;padding-top:0;padding-bottom:0;gap:0 28px}
  .menu{order:2;flex:0 1 auto;margin-left:auto;gap:0 28px;font-size:16px}
  .langues{order:3;margin-left:0}
  .btn-menu{order:4;min-height:48px;padding:10px 22px;font-size:16px}
  .haut{padding-top:36px;padding-bottom:40px}
  .chapo{font-size:20px}
  .btn-grand{min-height:60px;padding:12px 30px;font-size:19px}
  .apercu-photo{height:220px}
  .apercu-fil{grid-template-columns:repeat(3,minmax(0,1fr))}
  .apercu-carte{flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px}
  .apercu-carte:nth-child(2) .apercu-texte,.apercu-carte:nth-child(3) .apercu-texte{display:block}
  .demo{grid-template-columns:repeat(3,minmax(0,1fr))}
  .services{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
  .etapes{grid-template-columns:repeat(3,minmax(0,1fr))}
  .recoit-liste{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 28px}
  .equipe{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
  .audit-bloc{padding:56px 48px;border-radius:28px}
  .rang{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calc-trio{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pied-ligne{gap:0 28px}
  .pied-societe{margin-left:auto}
  .form-fiche{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-fiche .champ:not(.demi),.form-fiche>div:last-child,.form-fiche .hp,.form-fiche .ok,.form-fiche fieldset{grid-column:1/-1}
  .carte-form,.form-fiche{padding:32px}
  .juridique{padding-top:64px}
  .fiche-legale>div{grid-template-columns:220px minmax(0,1fr)}
}

/* ---------- Ordinateur : texte à gauche, photo et aperçu à droite, tout dans le premier écran (1440 x 900) */
@media (min-width:1040px){
  :root{--saut:120px}
  .haut{padding-top:48px;padding-bottom:56px}
  .haut-grille{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px}
  .haut-texte{gap:20px}
  .marque-symbole{font-size:30px}
  .chapo{font-size:20px}
  .apercu{display:block}
  .apercu-photo{height:600px;border-radius:18px}
  .apercu-fil{position:absolute;left:-28px;bottom:44px;width:min(330px,82%);grid-template-columns:minmax(0,1fr);gap:10px}
  .apercu-carte{background:rgba(12,29,69,.94)}
  .apercu .mention{margin-top:8px}
  .offres{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .offre{padding:30px 26px}
  .regle,.garantie-delais,.recoit,.urgence{padding:30px 32px}
  .audit-bloc{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;padding:72px}
  .rang{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:1040px){.offre-promesse{min-height:4.4em}}
fieldset.champ{border:0;margin:0;padding:0;min-width:0}
fieldset.champ legend{padding:0;margin-bottom:6px}
