/* LA CHARTE DE LA PAGE D ACCUEIL — FICHIER PRODUIT, NE JAMAIS LE MODIFIER A LA MAIN.

   D OU IL VIENT : recopie du vrai fichier de style du theme du site,
   D:/Publii/humans-board/input/themes/HumansBoard/assets/css/main.css,
   celui que la page d accueil utilise reellement.

   POURQUOI : regle 168 du projet. Le style, la charte graphique et les couleurs
   de la page d accueil s appliquent aussi aux offres payantes.

   COMMENT LE METTRE A JOUR : relancer
   l'outil generer-charte-offres.cjs du projet
   Toute modification faite a la main ici serait effacee a la prochaine execution,
   et le controle verif-charte-offres.cjs la signalerait avant (regle 119).

   Les reglages qui changent selon la taille de l ecran sont recopies eux aussi,
   dans le meme ordre : le telephone d abord, les grands ecrans ensuite.

   La police --hb-police est celle du corps des pages du site, recopiee telle
   quelle depuis le meme fichier. */

:root{
  --hb-police:system-ui,-apple-system,'Segoe UI',sans-serif;
}

:root{
  color-scheme:light;--blue:#000091;--blue-d:#00006E;--blue-lt:#EDF1FB;--blue-md:#D4DDF4;--blue-tx:#00006E;--blue-hero:#000091;--accent:#FFB400;--vg:linear-gradient(135deg,#a78bfa,#7c3aed,#5b21b6);--v3:#7c3aed;--green:#047857;--glt:#d1fae5;--green-d:#065f46;--red:#b91c1c;--orange:#b45309;--tx:#111827;--tx2:#374151;--tx3:#4b5563;--tx4:#4b5563;--bd:#e5e7eb;--bg:#ffffff;--bg3:#f3f4f6;--card-bg:#f5f7ff;--card-bd:rgba(0,0,145,.08);--r:8px;--r2:12px;--f-xxs:13px;--f-xs:13px;--f-sm:13px;--f-md:14px;--f-base:16px;--f-lg:17px;--f-xl:18px;--f-h1:clamp(22px,6vw,28px);--f-hero-h1:clamp(22px,3.2vw,26px);--f-h2:clamp(18px,4.5vw,22px);--f-h3:15px;--f-stat:clamp(26px,7vw,32px);--lh:1.65;--lh-h:1.15;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:40px;--s8:56px;--nav-h:56px;--max:1080px;--px:20px;--py:40px;--bd-champ:#6b7280;--max-lecture:70ch;--max-form:480px;--r-pill:999px;--sep:linear-gradient(90deg,rgba(255,255,255,.9) 0%,rgba(0,0,145,.20) 15%,rgba(0,0,145,.20) 85%,rgba(255,255,255,.9) 100%);--sep-shadow:0 2px 6px rgba(0,0,145,.1),0 1px 0 rgba(255,255,255,.9)
}

@media(min-width:640px){
:root{
  --px:32px;--py:48px;--f-h1:clamp(26px,5vw,34px);--f-h2:clamp(20px,4vw,24px);--f-stat:clamp(28px,5vw,36px)
}
}

@media(min-width:1024px){
:root{
  --px:48px;--py:80px;--f-h1:clamp(32px,3.2vw,42px);--f-h2:clamp(22px,2.2vw,28px);--f-h3:15px;--f-base:17px;--f-lg:18px;--f-xl:19px;--f-stat:clamp(30px,2.8vw,38px)
}
}

@media(min-width:1280px){
:root{
  --max:1120px
}
}

:root{
  --f-xxs:clamp(13px,12.4px + .15vw,14px);--f-xs:clamp(13px,12.4px + .15vw,14px);--f-sm:clamp(13px,12.2px + .2vw,15px);--f-md:clamp(14px,13.2px + .2vw,16px);--f-base:clamp(16px,15.4px + .17vw,18px);--f-lg:clamp(17px,16.2px + .2vw,19px);--f-xl:clamp(18px,17px + .25vw,20px);--f-h3:clamp(15px,14.2px + .22vw,17px)
}