/* ═════════════════════════════════════════════════════════════
   SYSTÈME IMPEK : la source unique du design (voir CLAUDE.md › Charte)
   Toute nouvelle page utilise uniquement ces jetons et ces composants.
   ═════════════════════════════════════════════════════════════ */

/* Polices hébergées sur le site (sous-ensemble latin : français, €) */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/plus-jakarta-v1.woff2) format('woff2')}
/* Police de secours aux mêmes dimensions, affichée le temps que la vraie arrive : la page ne saute pas au changement */
@font-face{font-family:'Jakarta secours';font-display:swap;font-weight:400 500;src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('Arimo');ascent-override:99%;descent-override:21%;line-gap-override:0%;size-adjust:105%}
@font-face{font-family:'Jakarta secours';font-display:swap;font-weight:600 800;src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('Arimo Bold');ascent-override:102%;descent-override:22%;line-gap-override:0%;size-adjust:102%}

:root{
  /* Couleurs */
  --vert:#166534;          /* boutons, liens, prix */
  --vert-fonce:#0F3D24;    /* titres, fonds foncés, survol */
  --vert-clair:#86EFAC;    /* contour de focus, détails sur fond foncé */
  --vert-pale:#ECFDF3;     /* fonds de badges et de survol */
  --encre:#13201A;         /* texte principal */
  --encre-douce:#374140;   /* texte secondaire long */
  --gris:#55625B;          /* petits textes, légendes (contraste AA) */
  --ligne:#DDE5DF;         /* bordures, séparateurs */
  --fond-doux:#F2F6F3;     /* sections alternées */
  --blanc:#FFFFFF;
  --etoile:#B7791F;        /* étoiles des avis */

  /* Polices */
  --police-titre:'Plus Jakarta Sans','Jakarta secours',system-ui,-apple-system,'Segoe UI',sans-serif;
  --police-texte:'Plus Jakarta Sans','Jakarta secours',system-ui,-apple-system,'Segoe UI',sans-serif;
  --titre-poids:800;        /* titres gras et serrés */
  --titre-esp:-.035em;

  /* Tailles de texte (rapport 1,25) */
  --t-xs:.875rem;    /* 14 px : mentions, légendes */
  --t-s:1rem;        /* 16 px : petits textes, boutons */
  --t-m:1.0625rem;   /* 17 px : texte courant */
  --t-l:1.3125rem;   /* 21 px : intro, titres de carte */
  --t-xl:1.625rem;   /* 26 px : titres de niveau 3 */
  --t-2xl:2.0625rem; /* 33 px : titres de niveau 2 sur téléphone */
  --t-3xl:2.5625rem; /* 41 px : titre principal sur téléphone, niveau 2 sur ordinateur */
  --t-4xl:3.25rem;   /* 52 px : titre principal sur ordinateur */

  /* Espacements : multiples de 8 px */
  --e-1:8px; --e-2:16px; --e-3:24px; --e-4:32px; --e-6:48px; --e-8:64px; --e-12:96px;

  /* Formes */
  --rayon:16px; --rayon-l:24px; --rayon-bouton:999px; /* boutons en pilule, coins doux */
  --ombre:0 1px 2px rgba(19,32,26,.05),0 12px 32px -16px rgba(19,32,26,.22);
  --largeur:1120px;

  /* Anciens noms, conservés le temps de refaire chaque page (ne plus les utiliser) */
  --g:var(--vert);--gd:var(--vert-fonce);--b:var(--vert-fonce);--gm:#15803D;--gl:#22C55E;--gp:var(--vert-pale);
  --bl:var(--vert-clair);--lime:#B7F5C8;
  --cr:#F3F5F4;--cd:#E8ECEA;--ow:var(--blanc);--wh:var(--blanc);
  --tx:var(--encre);--tm:var(--encre-douce);--mu:var(--gris);--bd:var(--ligne);
  --fd:var(--police-titre);--fb:var(--police-texte);--fs:var(--police-titre);
  --sh-1:0 1px 2px rgba(12,20,17,.04),0 2px 6px -2px rgba(12,20,17,.05);
  --sh-2:0 1px 2px rgba(12,20,17,.04),0 14px 34px -14px rgba(12,20,17,.18);
  --sh-3:0 2px 4px rgba(12,20,17,.05),0 28px 56px -20px rgba(12,20,17,.26);
  --nh:76px;
}

/* Police variable (400 à 800) : jamais de faux gras fabriqué par le navigateur */
body{font-synthesis-weight:none}

/* ── Mise en page ── */
.conteneur{width:100%;max-width:var(--largeur);margin:0 auto;padding:0 var(--e-2)}
@media(min-width:900px){.conteneur{padding:0 var(--e-4)}}
.section{padding:var(--e-8) 0;background:var(--blanc)}
.section-douce{background:var(--fond-doux)}
.section-foncee{background:var(--vert-fonce);color:var(--blanc)}
@media(min-width:900px){.section{padding:var(--e-12) 0}}

/* ── Textes ── */
.titre-1,.titre-2,.titre-3{font-family:var(--police-titre);font-weight:var(--titre-poids);letter-spacing:var(--titre-esp);line-height:1.08;color:var(--vert-fonce);margin:0}
.titre-1{font-size:var(--t-3xl);max-width:16ch}
.titre-2{font-size:var(--t-2xl);max-width:20ch}
.titre-3{font-size:var(--t-l);line-height:1.2}
@media(min-width:900px){.titre-1{font-size:var(--t-4xl)}.titre-2{font-size:var(--t-3xl)}.titre-3{font-size:var(--t-xl)}}
.section-foncee .titre-1,.section-foncee .titre-2,.section-foncee .titre-3{color:var(--blanc)}
.intro{font-size:var(--t-l);line-height:1.45;color:var(--gris);max-width:36ch;margin:var(--e-2) 0 0}
.section-foncee .intro{color:rgba(255,255,255,.82)}
.petit{font-size:var(--t-s);color:var(--gris)}

/* ── Boutons : un seul bouton principal par écran ── */
.bouton,.bouton-secondaire,.bouton-clair{display:inline-flex;align-items:center;justify-content:center;gap:var(--e-1);min-height:48px;padding:0 var(--e-3);border-radius:var(--rayon-bouton);font-family:var(--police-texte);font-size:var(--t-s);font-weight:600;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;border:0;transition:background-color .15s,box-shadow .15s}
.bouton{background:var(--vert);color:var(--blanc)}
.bouton:hover{background:var(--vert-fonce)}
.bouton-secondaire{background:var(--blanc);color:var(--vert-fonce);box-shadow:inset 0 0 0 2px var(--ligne)}
.bouton-secondaire:hover{box-shadow:inset 0 0 0 2px var(--vert)}
.bouton-clair{background:var(--blanc);color:var(--vert-fonce)}
.bouton-clair:hover{background:var(--vert-pale)}
.bouton svg,.bouton-secondaire svg,.bouton-clair svg{width:18px;height:18px;flex-shrink:0}
@media(max-width:520px){.bouton-plein-tel{width:100%}}
:is(.bouton,.bouton-secondaire,.bouton-clair,a,button,summary,input,select,textarea):focus-visible{outline:3px solid var(--vert-clair);outline-offset:2px}

/* ── Cartes ── */
.carte{background:var(--blanc);border-radius:var(--rayon);padding:var(--e-3);box-shadow:inset 0 0 0 1px var(--ligne)}
.section-douce .carte{box-shadow:none}
.carte-ombre{box-shadow:var(--ombre)}

/* ── Liste de prix ── */
.liste-prix{list-style:none;margin:var(--e-1) 0 0;padding:0}
.liste-prix li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--e-2);padding:var(--e-1) 0;border-top:1px solid var(--ligne)}
.liste-prix li:first-child{border-top:0}
.liste-prix small{display:block;font-size:var(--t-xs);color:var(--gris)}
.liste-prix b{font-family:var(--police-titre);font-weight:var(--titre-poids);font-size:var(--t-l);color:var(--vert);font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}


/* ── Pop-up de l'offre (js/offre.js) : en bas de l'écran sur téléphone, jamais en plein écran ── */
.offre-pop{position:fixed;inset:0;z-index:9500;display:flex;align-items:flex-end;justify-content:center}
.offre-pop[hidden]{display:none}
.offre-pop-fond{position:absolute;inset:0;background:rgba(10,18,14,.5)}
.offre-pop-boite{position:relative;width:100%;max-width:440px;max-height:85vh;overflow:auto;background:var(--blanc);border-radius:var(--rayon-l) var(--rayon-l) 0 0;padding:var(--e-4) var(--e-3) calc(var(--e-3) + env(safe-area-inset-bottom));font-family:var(--police-texte);color:var(--encre);box-shadow:0 -10px 40px rgba(0,0,0,.25)}
@media(min-width:600px){.offre-pop{align-items:center}.offre-pop-boite{border-radius:var(--rayon-l);padding:var(--e-4)}}
.offre-pop-boite:focus{outline:none}
.offre-pop-x{position:absolute;top:var(--e-1);right:var(--e-1);width:44px;height:44px;border-radius:50%;border:0;background:var(--vert-pale);color:var(--vert-fonce);cursor:pointer;display:grid;place-items:center}
.offre-pop-x svg{width:18px;height:18px}
.offre-pop-chiffre{display:block;font-family:var(--police-titre);font-weight:var(--titre-poids);font-size:var(--t-4xl);line-height:1;color:var(--vert)}
.offre-pop h2{margin:var(--e-1) 0 0;font-family:var(--police-titre);font-weight:var(--titre-poids);font-size:var(--t-xl);line-height:1.15;color:var(--vert-fonce)}
.offre-pop p{margin:var(--e-1) 0 0;color:var(--gris);line-height:1.55}
.offre-pop-ex{display:flex;justify-content:space-between;gap:var(--e-2);align-items:center;margin:var(--e-2) 0;padding:12px var(--e-2);border-radius:var(--rayon);background:var(--vert-pale);font-size:var(--t-xs);font-weight:600}
.offre-pop-ex s{color:var(--gris);font-weight:400}
.offre-pop-ex b{color:var(--vert-fonce);font-size:var(--t-m)}
.offre-pop-ex span:last-child{white-space:nowrap}
.offre-pop .bouton{width:100%}
.offre-pop-non{display:block;min-height:44px;margin:var(--e-1) auto 0;border:0;background:none;color:var(--gris);font:inherit;font-size:var(--t-s);text-decoration:underline;cursor:pointer;padding:0 var(--e-1)}
body.offre-ouverte{overflow:hidden}
body.offre-ouverte .float-btns{display:none}

/* ── Menu (gabarit/nav.html) : le canapé d'abord, puis les autres services ── */
/* (sélecteurs « nav … » et « #mob … » : ils passent devant les anciennes règles de site.css) */
nav .burger{align-items:center;gap:var(--e-1);flex-direction:row;min-height:44px;padding:0 14px;border-radius:var(--rayon-bouton);box-shadow:inset 0 0 0 1.5px var(--ligne);background:var(--blanc);color:var(--encre);font:600 var(--t-s)/1 var(--police-texte)}
nav .burger .burger-i{display:flex;flex-direction:column;gap:4px;width:auto;height:auto;background:none}
nav .burger .burger-i span{width:18px;height:2px;background:currentColor;border-radius:2px;display:block}
nav .burger .burger-t{display:inline;width:auto;height:auto;background:none}
nav .burger[aria-expanded="true"] .burger-i span:nth-child(2){opacity:0}
nav .burger[aria-expanded="true"] .burger-i span:first-child{transform:translateY(6px) rotate(45deg)}
nav .burger[aria-expanded="true"] .burger-i span:last-child{transform:translateY(-6px) rotate(-45deg)}
@media(min-width:1024px){nav .burger{display:none}}
body.menu-ouvert{overflow:hidden}
body.menu-ouvert .float-btns,body.menu-ouvert #cookie-bar{display:none!important}
#mob{gap:var(--e-1);padding:var(--e-2) var(--e-2) calc(var(--e-3) + env(safe-area-inset-bottom));height:calc(100dvh - var(--nh));max-height:none;background:var(--fond-doux);font-family:var(--police-texte)}
#mob a{display:block;border-bottom:0;padding:0;color:var(--encre);text-decoration:none}
#mob b{display:block;font-weight:700;font-size:var(--t-m);color:var(--vert-fonce)}
#mob small{display:block;font-size:var(--t-xs);color:var(--gris);font-weight:500;margin-top:2px}
#mob .mob-une{display:grid;grid-template-columns:112px 1fr;gap:var(--e-2);align-items:center;background:var(--blanc);border-radius:var(--rayon);padding:var(--e-1);box-shadow:inset 0 0 0 2px var(--vert)}
#mob .mob-une img{width:112px;height:84px;object-fit:cover;border-radius:12px}
#mob .mob-une b{font-size:var(--t-l);letter-spacing:-.02em}
#mob .mob-duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--e-1)}
#mob .mob-duo a{background:var(--blanc);border-radius:var(--rayon);padding:12px var(--e-2);min-height:56px}
#mob .mob-titre{margin:var(--e-2) 0 0;font-size:var(--t-s);font-weight:700;color:var(--gris)}
#mob .mob-l{display:flex;align-items:center;gap:12px;background:var(--blanc);border-radius:var(--rayon);padding:12px var(--e-2);min-height:56px}
#mob .mob-l svg{width:24px;height:24px;flex-shrink:0;color:var(--vert)}
#mob .mob-bas{display:flex;flex-wrap:wrap;gap:var(--e-1);margin-top:var(--e-1)}
#mob .mob-bas a{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--e-2);border-radius:var(--rayon-bouton);background:var(--blanc);font-size:var(--t-s);font-weight:600}
#mob a[aria-current="page"]{box-shadow:inset 0 0 0 2px var(--vert)}
#mob .mob-cta{display:flex;align-items:center;justify-content:center;min-height:52px;margin:var(--e-2) 0 0;padding:0;border-radius:var(--rayon-bouton);background:var(--vert);color:var(--blanc);font-size:var(--t-m);font-weight:700}
#mob .mob-tel{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:var(--rayon-bouton);box-shadow:inset 0 0 0 2px var(--ligne);background:var(--blanc);font-weight:600;color:var(--vert-fonce)}
/* Ordinateur : « Autres services » s'ouvre au survol, au clavier ou au clic */
.nav-sous-b{display:flex;align-items:center;gap:4px;min-height:40px;padding:.5rem .8rem;border:0;border-radius:10px;background:none;color:var(--tm);font:500 .9rem/1 var(--police-texte);cursor:pointer;white-space:nowrap}
.nav-sous-b svg{width:12px;height:12px}
.nav-sous-b:hover,.nav-sous:focus-within .nav-sous-b{background:rgba(22,101,52,.07);color:var(--g)}
.nav-sous-l{display:none;position:absolute;top:100%;left:0;min-width:300px;margin:0;padding:var(--e-1);list-style:none;background:var(--blanc);border-radius:var(--rayon);box-shadow:var(--ombre),inset 0 0 0 1px var(--ligne)}
.nav-sous:hover .nav-sous-l,.nav-sous:focus-within .nav-sous-l,.nav-sous.ouvert .nav-sous-l{display:block}
.nav-sous-l a{display:block;padding:10px 12px;border-radius:12px;text-decoration:none}
.nav-sous-l a:hover{background:var(--vert-pale)}
.nav-sous-l b{display:block;font-size:.95rem;color:var(--vert-fonce)}
.nav-sous-l small{display:block;font-size:var(--t-xs);color:var(--gris)}
.nav-sous-l a[aria-current="page"] b{color:var(--vert)}
.nav-sous:has(a[aria-current="page"]) .nav-sous-b{color:var(--g);background:var(--gp)}

/* ── Confiance : « C'est moi qui viens » + 4 garanties (accueil, pages d'activité) ── */
.qui{display:block;padding:var(--e-3);border-radius:var(--rayon-l);background:var(--blanc);box-shadow:inset 0 0 0 1px var(--ligne)}
.qui-photo{width:88px;height:88px;border-radius:50%;overflow:hidden;background:var(--vert-fonce);color:var(--vert-clair);display:grid;place-items:center;font:800 2.25rem/1 var(--police-titre)}
.qui-photo img{width:100%;height:100%;object-fit:cover}
.qui-logo{background:var(--vert-pale)}
.qui-logo img{object-fit:contain;padding:14px}
.qui-t{margin:0;font:var(--titre-poids) var(--t-l)/1.2 var(--police-titre);letter-spacing:-.02em;color:var(--vert-fonce)}
.qui p{margin:var(--e-1) 0 0;color:var(--encre-douce);line-height:1.55;font-size:var(--t-s)}
@media(max-width:520px){.qui{grid-template-columns:1fr}.qui-photo{width:72px;height:72px;font-size:1.75rem}}
.garanties{list-style:none;margin:var(--e-2) 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--e-1)}
@media(min-width:900px){.garanties{grid-template-columns:repeat(4,1fr);gap:var(--e-2)}}
.garanties li{display:flex;flex-direction:column;gap:2px;padding:var(--e-2);border-radius:var(--rayon);background:var(--blanc);box-shadow:inset 0 0 0 1px var(--ligne);font-family:var(--police-texte)}
.garanties svg{width:28px;height:28px;color:var(--vert);margin-bottom:var(--e-1)}
.garanties b{font-size:var(--t-s);font-weight:700;color:var(--vert-fonce);line-height:1.25}
.garanties span{font-size:var(--t-xs);color:var(--gris);line-height:1.4}
/* Le jour du nettoyage : liste de points pratiques */
.jour{list-style:none;margin:var(--e-3) 0 0;padding:0;display:grid;gap:var(--e-2)}
@media(min-width:800px){.jour{grid-template-columns:1fr 1fr;gap:var(--e-2) var(--e-4)}}
.jour li{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start;font-family:var(--police-texte);line-height:1.5;color:var(--encre-douce)}
.jour svg{width:40px;height:40px;padding:8px;border-radius:12px;background:var(--vert-pale);color:var(--vert)}
.jour b{display:block;color:var(--vert-fonce);font-weight:700}

/* Bloc « Un professionnel… » compact : titre et texte à taille normale, même dans une section .e-sec */
.qui h2.qui-t{font-size:var(--t-l);max-width:none;line-height:1.25}
.qui h2.qui-t + p{font-size:var(--t-s);color:var(--encre-douce);max-width:60ch;margin-top:var(--e-1)}
@media(min-width:900px){.qui h2.qui-t{font-size:var(--t-xl)}}
