@charset "UTF-8";

/* ════════════════════════════════════════════════════
   HUMANS BOARD — main.css
   simple-override · Publii 0.47.5
   ════════════════════════════════════════════════════ */

/* ── STEP 1 : Reset thème Simple ─────────────────────
   Masque les éléments natifs du thème Simple          */
body>a:first-child,
body>a:first-of-type,
body>p:first-child,
.l-header,
header.l-header,
.c-header,
.c-nav,
.l-footer:not([class*="ft-"]),
footer.l-footer,
.c-footer,
.c-alert,
.l-pagination,
.c-breadcrumbs,
.js-search,
.c-search,
.c-entry__header,
.c-entry__meta,
[class^="c-share"],
.c-tag-list,
.js-content__share-button,
.js-content__share-popup,
#backToTop {
  display: none !important;
}

/* Neutralise les wrappers du thème Simple             */
body,
.l-wrapper, .l-container, .l-content,
.l-grid, .l-grid__col,
.c-entry, .c-entry__content, .c-entry__inner,
.l-post-content, main, article {
  max-width:   none !important;
  width:       100% !important;
  padding:     0    !important;
  margin:      0    !important;
  float:       none !important;
  background:  transparent !important;
  border:      none !important;
  box-shadow:  none !important;
}

/* ── STEP 2 : Design Humans Board ────────────────────
   CSS copié mot pour mot depuis landing-page.html     */

/* ═══════════════════════════════════════════════════════
   RÈGLES IMMUABLES :
   1. Mobile-first   3. SEO          5. LLMs Generator
   2. Responsive     4. Rich Snippets

   PRINCIPE FOND D'ÉCRAN :
   • body = gris #f3f4f6 PARTOUT, de bout en bout
   • Sections = PAS de fond propre → héritent du gris
   • Composants (cards) = blanc #fff → ressortent sur gris
   • ZÉRO bordure horizontale entre sections
   ═══════════════════════════════════════════════════════ */

/* ── TOKENS ── */
:root{
  --blue:#2563eb; --blue-d:#1d4ed8;
  --blue-lt:#eff6ff; --blue-md:#dbeafe; --blue-tx:#1e40af;
  --vg:linear-gradient(135deg,#a78bfa,#7c3aed,#5b21b6);
  --v3:#7c3aed;
  --green:#047857; --glt:#d1fae5;
  --red:#dc2626; --orange:#b45309;
  --tx:#111827; --tx2:#374151; --tx3:#6b7280; --tx4:#6b7280;
  --bd:#e5e7eb;
  --bg:#ffffff;   /* composants blancs */
  --bg3:#f3f4f6;  /* fond global gris */
  --r:8px; --r2:12px;

  /* Typographie */
  --f-xxs:12px; --f-xs:12px; --f-sm:12px; --f-md:13px;
  --f-base:14px; --f-lg:15px; --f-xl:16px;
  --f-h1:clamp(22px,6vw,28px);
  --f-h2:clamp(18px,4.5vw,22px);
  --f-h3:14px;
  --f-stat:clamp(26px,7vw,32px);
  --lh:1.65; --lh-h:1.15;

  /* Espacement (base 4px) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px;
  --s5:24px; --s6:32px; --s7:40px; --s8:56px;

  /* Layout */
  --nav-h:56px; --max:1080px; --px:20px; --py:40px;
  --sep:linear-gradient(90deg,rgba(255,255,255,.9) 0%,rgba(37,99,235,.20) 15%,rgba(37,99,235,.20) 85%,rgba(255,255,255,.9) 100%);
  --sep-shadow:0 2px 6px rgba(37,99,235,.1),0 1px 0 rgba(255,255,255,.9);
}

/* ── RESET COMPLET PUBLII SIMPLE THEME ──
   Force tout ce que le thème peut injecter
   à ne pas avoir de fond blanc ni de contrainte de largeur
── */
*,*::before,*::after{
  box-sizing:border-box;margin:0;padding:0;
  animation-duration:.01ms!important;
  animation-iteration-count:1!important;
}
html,body{
  background:var(--bg3)!important;
}
/* Ciblé sur wrappers Simple theme uniquement — transform:none retiré
   (cassait FAQ rotate, hamburger, btn:active scale)                */
.c-entry *,.l-wrapper *,.l-post-content *,.l-content *{
  opacity:1!important;visibility:visible!important;
}

/* Masquer les éléments natifs du thème */
body>a:first-child,body>a:first-of-type,body>p:first-child,
.l-header,header.l-header,.c-header,.c-nav,
.l-footer:not([class*="ft-"]),footer.l-footer,.c-footer,
.c-alert,.l-pagination,.c-breadcrumbs,.js-search,.c-search,
.c-entry__header,.c-entry__meta,
[class^="c-share"],.c-tag-list{display:none!important;}

/* Neutraliser TOUS les wrappers du thème :
   background transparent, largeur 100%, pas de padding/margin */
body,
.l-wrapper,.l-container,.l-content,
.l-grid,.l-grid__col,
.c-entry,.c-entry__content,.c-entry__inner,
.l-post-content,main,article{
  max-width:none!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
  float:none!important;
  background:transparent!important;
  border:none!important;
  box-shadow:none!important;
}

html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  font-family:system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:var(--f-base);
  line-height:var(--lh);
  color:var(--tx);
  -webkit-font-smoothing:antialiased;
}
a{color:var(--blue);text-decoration:none;}
ul{list-style:none;}
img{max-width:100%;height:auto;display:block;}
input,textarea,select{font-size:16px;} /* iOS Safari : empêche le zoom auto < 16px */

/* ── CONTENEUR CENTRÉ ── */
.inner{
  width:100%;
  max-width:var(--max);
  padding-left:var(--px);
  padding-right:var(--px);
  margin:0 auto;
}

/* ── BOUTONS ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:var(--s2);padding:10px 18px;
  font-family:inherit;font-size:var(--f-md);font-weight:700;
  line-height:1;border-radius:var(--r);border:none;
  cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background .15s,box-shadow .15s;
}
.btn-sm{padding:7px 14px;font-size:var(--f-sm);min-height:44px;}
.btn-lg{padding:12px 24px;font-size:var(--f-base);min-height:44px;}
.btn-xl{padding:14px 26px;font-size:var(--f-lg);font-weight:800;min-height:44px;}
.btn-p {background:var(--blue);color:#fff;}
.btn-p:hover{background:var(--blue-d);box-shadow:0 4px 16px rgba(37,99,235,.3);}
.btn-o {background:transparent;color:var(--blue);border:1.5px solid var(--blue);}
.btn-o:hover{background:var(--blue-lt);}
.btn-ow{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4);}
.btn-ow:hover{background:rgba(255,255,255,.12);}
.btn-w {background:#fff;color:var(--blue);}
.btn-w:hover{background:var(--blue-lt);}

/* ── BADGES ── */
.bdg{display:inline-flex;align-items:center;gap:var(--s2);padding:4px 12px;border-radius:20px;font-size:var(--f-xs);font-weight:700;}
.bdg-blue{background:var(--blue-md);color:var(--blue-tx);}
.bdg-dark{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.3);}
.bdg-green{background:var(--glt);color:#065f46;}

/* ═══════════════════════════════════════
   NAV
   ═══════════════════════════════════════ */
.hb-nav{
  display:flex;align-items:center;justify-content:space-between;
  height:var(--nav-h);padding:0 var(--px);
  background:var(--bg);
  box-shadow:0 1px 0 var(--bd);
  position:sticky;top:0;z-index:1000;
  width:100%;
}
.hb-logo{display:flex;align-items:center;gap:var(--s3);flex-shrink:0;}
.hb-logo-icon{
  width:32px;height:32px;border-radius:9px;
  background:var(--vg);
  display:flex;align-items:center;justify-content:center;
  font-size:var(--f-lg);font-weight:800;color:#fff;flex-shrink:0;
}
.hb-logo-name{font-size:var(--f-xl);font-weight:700;color:var(--tx);white-space:nowrap;}
.hb-logo-name span{color:var(--v3);}
.hb-nav-links{display:none;gap:var(--s6);list-style:none;}
.hb-nav-links a{font-size:var(--f-md);font-weight:500;color:var(--tx2);transition:color .15s;white-space:nowrap;}
.hb-nav-links a:hover{color:var(--blue);}
.hb-nav-r{display:flex;align-items:center;}

/* ═══════════════════════════════════════
   HERO
   fond dégradé bleu-lt, contenu centré
   ═══════════════════════════════════════ */
.hb-hero{
  background:var(--bg);
  padding:20px 0;
  position:relative;
  text-align:center;
}
.hb-hero::after{
  content:'';position:absolute;
  bottom:0;left:0;right:0;height:0.5px;
  background:var(--sep);
  box-shadow:0 4px 16px rgba(37,99,235,.15),0 1px 0 rgba(255,255,255,1);
}
.hb-hero-inner{width:100%;}
.hb-hero h1{
  font-size:clamp(22px,3.2vw,34px);font-weight:800;
  line-height:1.25;letter-spacing:-.4px;
  color:#0c3ade;
  margin:var(--s3) 0 var(--s5);width:100%;text-align:center;
}
.hb-hero h1 em{color:#0c3ade;font-style:normal;}
.hb-hero-sub{
  font-size:var(--f-base);color:var(--tx2);
  line-height:1.6;margin-bottom:var(--s5);
  width:100%;text-align:center;
}
.hb-hero-cta{margin-bottom:var(--s3);display:flex;justify-content:center;flex-wrap:wrap;gap:var(--s3);}
.hb-hero-cta .btn-p{box-shadow:0 4px 16px rgba(37,99,235,.25);}
.hb-hero-proof{font-size:var(--f-xs);color:var(--tx4);line-height:1.7;}

/* ═══════════════════════════════════════
   STATS — 4 cartes blanches sur fond gris
   ═══════════════════════════════════════ */
#stats{padding:20px 0;position:relative;}
#stats::before{
  content:'';position:absolute;
  top:0;left:0;right:0;height:0.5px;
  background:var(--sep);box-shadow:var(--sep-shadow);
}
#stats::after{
  content:'';position:absolute;
  bottom:0;left:0;right:0;height:0.5px;
  background:var(--sep);box-shadow:var(--sep-shadow);
}
.hb-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--s3);
}
.hb-stat{
  background:var(--bg);
  border-radius:var(--r2);
  padding:var(--s5) var(--s4);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.hb-stat::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--blue);
}
.hb-stat.s-red::before  {background:var(--red);}
.hb-stat.s-green::before{background:var(--green);}
.hb-stat-n{
  font-size:var(--f-stat);font-weight:800;
  color:var(--blue);line-height:1;
}
.hb-stat-n.red  {color:var(--red);}
.hb-stat-n.green{color:var(--green);}
.hb-stat-l{font-size:var(--f-sm);color:var(--tx2);margin-top:var(--s2);line-height:1.45;}
.hb-stat-src{font-size:var(--f-xxs);color:var(--tx4);margin-top:var(--s2);font-weight:600;letter-spacing:.3px;}

/* ═══════════════════════════════════════
   SECTIONS
   ═══════════════════════════════════════ */
.sec{padding:20px 0;position:relative;}
.sec:nth-of-type(even){background:var(--bg);}
.sec::before{
  content:'';position:absolute;
  top:0;left:0;right:0;height:0.5px;
  background:var(--sep);box-shadow:var(--sep-shadow);
}
.sec::after{
  content:'';position:absolute;
  bottom:0;left:0;right:0;height:0.5px;
  background:var(--sep);box-shadow:var(--sep-shadow);
}
.sec-lbl{
  display:block;font-size:var(--f-xxs);font-weight:700;
  letter-spacing:2.5px;color:#0c3ade;
  text-transform:uppercase;margin-bottom:6px;
  text-align:center;
}
.sec h2{
  font-size:var(--f-h2);font-weight:800;
  line-height:var(--lh-h);letter-spacing:-.2px;
  color:var(--tx);margin:0 0 var(--s3);width:100%;
  text-align:center;
}
.sec .sub{
  font-size:var(--f-lg);color:var(--tx2);
  line-height:1.72;margin-bottom:var(--s5);width:100%;
  text-align:center;
}

/* ── CHAÎNE CAUSALE ── */
.chain{
  display:flex;flex-direction:column;gap:var(--s2);
  background:var(--blue-lt);border:1px solid var(--blue-md);
  border-radius:var(--r2);padding:var(--s4);
}
.chain-arrow{font-size:var(--f-md);color:var(--blue);font-weight:700;align-self:center;flex-shrink:0;}
.chain-item{
  font-size:var(--f-md);font-weight:700;
  padding:var(--s3) var(--s4);border-radius:var(--r);
  background:var(--bg);color:var(--tx);
  line-height:1.45;border-left:3px solid var(--bd);
  flex:1;min-width:0;
}
.chain-item small{font-size:var(--f-xs);font-weight:400;display:block;color:var(--tx3);margin-top:2px;}
.chain-item.cause {border-left-color:var(--orange);}
.chain-item.mid   {border-left-color:var(--red);}
.chain-item.cost  {border-left-color:var(--v3);}
.chain-item.result{border-left-color:var(--green);background:var(--glt);color:#065f46;}

/* ── GRILLES ── */
.g2,.g3,.g4{display:grid;grid-template-columns:1fr;gap:var(--s4);}

/* ── CARDS ── */
.card{
  background:var(--bg);border-radius:var(--r2);
  padding:var(--s5);transition:box-shadow .2s;
}
.card:hover{box-shadow:0 4px 16px rgba(37,99,235,.1);}
.card-ico{
  width:36px;height:36px;border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;
  font-size:var(--f-xl);margin:0 auto var(--s4);flex-shrink:0;
}
.ico-blue  {background:var(--blue-md);}
.ico-red   {background:#fee2e2;}
.ico-green {background:var(--glt);}
.ico-purple{background:#ede9fe;}
.card h3{font-size:var(--f-xl);font-weight:700;margin:0 0 var(--s2);color:var(--tx);line-height:1.35;text-align:center;}
.card p {font-size:var(--f-lg);color:var(--tx2);line-height:var(--lh);margin:0;}
.card-result{
  margin-top:var(--s4);padding:var(--s3) var(--s4);
  background:var(--glt);border-radius:var(--r);
  font-size:var(--f-base);font-weight:800;color:var(--green);
  text-align:center;line-height:1.35;
}

/* ── WHO CARDS ── */
.who-card{background:var(--bg);border-radius:var(--r2);padding:var(--s5);}
.who-av   {font-size:24px;margin-bottom:var(--s2);}
.who-title{font-size:var(--f-h3);font-weight:700;color:var(--tx);margin:0 0 2px;}
.who-role {font-size:var(--f-xs);color:var(--tx3);margin-bottom:var(--s4);}
.who-pains{display:flex;flex-direction:column;gap:var(--s2);}
.who-pains li{font-size:var(--f-sm);color:var(--tx2);display:flex;align-items:flex-start;gap:var(--s2);line-height:1.5;}
.who-pains li::before{content:"→";color:var(--blue);font-weight:700;flex-shrink:0;margin-top:1px;}

/* ── TOGGLE ── */
.toggle-row{display:flex;align-items:center;justify-content:center;gap:var(--s4);margin-bottom:var(--s5);flex-wrap:wrap;}
.toggle-lbl{font-size:var(--f-md);color:var(--tx2);font-weight:500;}

/* ── PRICING ── */
.pricing{display:grid;grid-template-columns:1fr;gap:var(--s4);}
.p-card{background:var(--bg);border-radius:var(--r2);padding:var(--s5);display:flex;flex-direction:column;}
.p-card.featured{border:2px solid var(--blue);background:var(--blue-lt);}
.p-star{display:inline-block;font-size:var(--f-xxs);font-weight:700;background:var(--blue);color:#fff;border-radius:4px;padding:3px 8px;margin-bottom:var(--s3);letter-spacing:.3px;}
.p-label  {font-size:var(--f-sm);font-weight:700;color:var(--tx2);margin-bottom:var(--s2);}
.p-price  {font-size:clamp(22px,4vw,26px);font-weight:800;color:var(--tx);line-height:1;margin-bottom:var(--s1);display:flex;align-items:baseline;gap:4px;flex-wrap:wrap;}
.p-price .eur{font-size:var(--f-sm);font-weight:400;color:var(--tx3);}
.p-promo  {font-size:var(--f-sm);font-weight:700;color:var(--v3);margin-bottom:2px;}
.p-economy{font-size:var(--f-xs);color:var(--green);margin-bottom:var(--s3);}
.p-size   {font-size:var(--f-sm);color:var(--tx3);margin-bottom:var(--s3);padding-bottom:var(--s3);border-bottom:1px solid var(--bd);}
.p-feats  {flex:1;display:flex;flex-direction:column;gap:var(--s2);margin:0 0 var(--s4);}
.p-feats li{font-size:var(--f-sm);color:var(--tx2);display:flex;align-items:flex-start;gap:var(--s2);line-height:1.5;}
.p-feats li::before{content:"✓";color:var(--green);font-weight:700;flex-shrink:0;}
.p-note   {font-size:var(--f-xs);color:var(--tx4);text-align:center;margin-top:var(--s2);}
.p-note.hl{color:var(--blue-tx);font-weight:700;}

/* ── FAQ ── */
.faq{margin-top:var(--s4);}
.faq-item{border-bottom:1px solid var(--bd);}
.faq-item:first-child{border-top:1px solid var(--bd);}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:var(--s4) 0;gap:var(--s4);font-size:var(--f-base);font-weight:700;color:var(--tx);cursor:pointer;user-select:none;line-height:1.4;}
.faq-q:hover{color:var(--blue);}
.faq-ico{color:var(--blue);font-size:20px;font-weight:300;flex-shrink:0;transition:transform .25s;line-height:1;}
.faq-item.open .faq-ico{transform:rotate(45deg);}
.faq-a{font-size:var(--f-lg);color:var(--tx2);line-height:1.75;max-height:0;overflow:hidden;transition:max-height .35s ease,padding .2s;}
.faq-item.open .faq-a{max-height:500px;padding-bottom:var(--s4);}

/* ── CTA FINAL ── */
.hb-cta{background:linear-gradient(135deg,var(--blue),var(--blue-d));padding:var(--py) 0;text-align:center;}
.hb-cta h2{font-size:var(--f-h2);font-weight:800;color:#fff;margin:var(--s3) 0;line-height:var(--lh-h);}
.hb-cta p {font-size:var(--f-md);color:rgba(255,255,255,.85);margin:0 auto var(--s5);line-height:1.72;max-width:520px;}
.cta-note {font-size:var(--f-xs);color:rgba(255,255,255,.4);margin-top:var(--s3);line-height:1.7;}

/* ── FOOTER ── */
.ft-main{background:#111827;padding:var(--s7) 0 var(--s5);}
.ft-grid{display:grid;grid-template-columns:1fr;gap:var(--s6);margin-bottom:var(--s5);}
.ft-brand h4{font-size:var(--f-lg);font-weight:700;color:#fff;display:flex;align-items:center;gap:var(--s2);margin:0 0 var(--s3);}
.ft-brand-icon{width:24px;height:24px;border-radius:7px;background:var(--vg);display:inline-flex;align-items:center;justify-content:center;font-size:var(--f-sm);font-weight:800;color:#fff;flex-shrink:0;}
.ft-brand p   {font-size:var(--f-sm);color:rgba(255,255,255,.75);line-height:1.7;margin-bottom:var(--s3);}
.ft-certs     {display:flex;gap:var(--s2);flex-wrap:wrap;}
.ft-cert      {background:rgba(255,255,255,.10);border-radius:4px;padding:2px 8px;font-size:var(--f-xxs);font-weight:700;color:rgba(255,255,255,.85);}
.ft-col h5    {font-size:var(--f-xxs);font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:rgba(255,255,255,.85);margin:0 0 var(--s3);}
.ft-col a     {display:flex;align-items:center;min-height:44px;font-size:var(--f-sm);color:rgba(255,255,255,.75);transition:color .15s;}
.ft-col a:hover{color:#fff;}
.ft-bottom    {border-top:1px solid rgba(255,255,255,.15);padding-top:var(--s4);font-size:var(--f-xxs);color:rgba(255,255,255,.65);display:flex;flex-direction:column;gap:var(--s1);}
.ft-seo       {background:var(--bg3);padding:var(--s6) 0;}
.ft-seo-grid  {display:grid;grid-template-columns:1fr;gap:var(--s5) var(--s4);}
.ft-seo h5    {font-size:var(--f-xxs);font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--tx3);margin:0 0 var(--s3);}
.ft-seo a     {display:flex;align-items:center;min-height:40px;font-size:var(--f-xs);color:var(--blue);line-height:1.5;}
.ft-seo a:hover{text-decoration:underline;}

/* ══════════════════════════════════
   TABLETTE ≥ 640px
   ══════════════════════════════════ */
@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);
  }
  .hb-nav{padding:0 var(--px);}
  .hb-hero-cta{display:flex;gap:var(--s3);}
  .hb-stats{grid-template-columns:repeat(4,1fr);}
  .hb-stat{border-right:1px solid var(--bd);}
  .hb-stat:last-child{border-right:none;}
  .g2{grid-template-columns:repeat(2,1fr);}
  .g3{grid-template-columns:repeat(2,1fr);}
  .g4{grid-template-columns:repeat(2,1fr);}
  .pricing{grid-template-columns:repeat(2,1fr);}
  .chain{flex-direction:row;flex-wrap:nowrap;align-items:stretch;}
  .chain-arrow{align-self:center;}
  .ft-grid{grid-template-columns:repeat(2,1fr);}
  .ft-seo-grid{grid-template-columns:repeat(2,1fr);}
  .ft-bottom{flex-direction:row;justify-content:space-between;}
}

/* ══════════════════════════════════
   DESKTOP ≥ 1024px
   ══════════════════════════════════ */
@media(min-width:1024px){
  :root{
    --px:48px;--py:56px;
    --f-h1:clamp(32px,3.2vw,42px);
    --f-h2:clamp(22px,2.2vw,28px);
    --f-h3:15px;--f-base:15px;--f-lg:16px;--f-xl:17px;
    --f-stat:clamp(30px,2.8vw,38px);
  }
  .inner{max-width:var(--max);}
  .hb-nav{padding:0 var(--px);}
  .hb-nav-links{display:flex;}
  .g3{grid-template-columns:repeat(3,1fr);}
  .g4{grid-template-columns:repeat(4,1fr);}
  .pricing{grid-template-columns:repeat(4,1fr);}
  .ft-grid{grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:var(--s7);}
  .ft-seo-grid{grid-template-columns:repeat(4,1fr);}
}

/* ══════════════════════════════════
   GRAND ÉCRAN ≥ 1280px
   ══════════════════════════════════ */
@media(min-width:1280px){
  :root{--max:1120px;}
}

/* ── NAVBAR SIMPLE THEME → style HumansBoard ──
── */
.navbar{
  display:flex;align-items:center;justify-content:space-between;
  height:var(--nav-h);padding:0 var(--px);
  background:var(--bg);
  box-shadow:0 1px 0 var(--bd),0 2px 8px rgba(37,99,235,.06);
  position:sticky;top:0;z-index:1000;
  width:100%;
}
.navbar__menu{
  display:flex;gap:var(--s6);list-style:none;
  margin:0;padding:0;
}
.navbar__menu a{
  font-size:var(--f-md);font-weight:500;
  color:var(--tx2);transition:color .15s;
  text-decoration:none;white-space:nowrap;
}
.navbar__menu a:hover,
.navbar__menu a.active{color:var(--blue);}
.navbar .logo,.navbar__logo,.navbar .c-logo,.navbar a.logo{display:none!important;}
/* ── HAMBURGER ──────────────────────────────────────
   Icône = SVG inline dans navbar.hbs → aucun CSS requis pour l'icône
   CSS gère uniquement : affichage bouton + switch SVG burger↔croix */
.navbar__toggle{
  background:transparent;border:none;cursor:pointer;
  color:var(--tx);display:none;
  width:44px;height:44px;
  align-items:center;justify-content:center;
  padding:0;flex-shrink:0;
}
.navbar__toggle-box{display:flex;align-items:center;justify-content:center;pointer-events:none;}
.navbar__toggle-inner{display:none;}

/* Switch SVG : burger visible, croix cachée */
.navbar__toggle .hb-icon-burger{display:block;}
.navbar__toggle .hb-icon-close {display:none!important;}
/* Quand is-active (JS) : burger caché, croix visible */
.navbar__toggle.is-active .hb-icon-burger{display:none!important;}
.navbar__toggle.is-active .hb-icon-close {display:block!important;}

/* Bloque scroll quand menu ouvert (JS ajoute no-scroll sur <html>) */
html.no-scroll{overflow:hidden!important;}

/* ── RESPONSIVE NAV ── */
@media(max-width:1023px){
  .navbar__toggle{display:flex;}
  .hb-nav-links{display:none!important;}
}
@media(min-width:1024px){
  .navbar{padding:0 var(--px);}
  .hb-nav-links{display:flex;align-items:center;}
  .hb-nav-links .navbar__menu{
    display:flex;gap:var(--s6);list-style:none;margin:0;padding:0;
  }
}

/* ── OVERLAY MENU MOBILE ── */
.navbar_mobile_overlay.is-hidden{display:none!important;}
.navbar_mobile_overlay:not(.is-hidden){
  display:block!important;
  position:fixed;top:var(--nav-h);left:0;right:0;
  height:calc(100vh - var(--nav-h));
  background:var(--bg);z-index:999;
  padding:var(--s5) var(--px);
  overflow-y:auto;
  border-top:1px solid var(--bd);
  box-shadow:0 8px 32px rgba(0,0,0,.08);
}
.navbar_mobile_overlay .navbar__menu{
  display:flex;flex-direction:column;
  gap:0;list-style:none;margin:0;padding:0;
}
.navbar_mobile_overlay .navbar__menu li a{
  display:block;padding:var(--s4) 0;
  font-size:var(--f-lg);font-weight:500;
  color:var(--tx);text-decoration:none;
  border-bottom:1px solid var(--bd);
  transition:color .15s;
}
.navbar_mobile_overlay .navbar__menu li:last-child a{border-bottom:none;}
.navbar_mobile_overlay .navbar__menu a:hover{color:var(--blue);}

/* ── FAQ H3 sémantique ── */
.faq-q h3{
  font-size:var(--f-base);font-weight:700;
  color:inherit;line-height:var(--lh-h);
  margin:0;padding:0;display:inline;
}

/* ── CONTACT PAGE ── */
#contact-hero{padding-top:var(--s8);text-align:center;background:var(--bg);}
#contact-main{background:var(--blue-lt);}
#contact-hero h1{
  font-size:var(--f-h1);font-weight:800;
  line-height:var(--lh-h);letter-spacing:-.3px;
  color:var(--tx);margin:var(--s3) 0 0;
}
.contact-wrap{display:grid;grid-template-columns:1fr;gap:var(--s4);}
.contact-info{display:flex;flex-direction:column;gap:var(--s3);}
.contact-info .card{padding:var(--s4);}
.contact-info .btn{width:100%;justify-content:center;margin-top:var(--s3);}
.contact-form-wrap{
  background:var(--bg);
  border:1.5px solid var(--blue-md);
  border-radius:var(--r2);
  padding:var(--s5);
  box-shadow:0 4px 24px rgba(37,99,235,.08),0 1px 4px rgba(37,99,235,.06);
}
@media(min-width:1024px){
  .contact-wrap{grid-template-columns:280px 1fr;align-items:start;gap:var(--s6);}
  .contact-form-wrap{padding:var(--s6);}
}

/* ── FORMULAIRE WEB3FORMS ── */
.w3f-field{display:flex;flex-direction:column;gap:var(--s1);margin-bottom:var(--s4);}
.w3f-label{font-size:var(--f-sm);font-weight:700;color:var(--blue-tx);}
.w3f-input{
  width:100%;min-height:44px;
  padding:var(--s3) var(--s4);
  font-family:inherit;font-size:var(--f-base);
  color:var(--tx);line-height:var(--lh);
  background:var(--bg);border:1.5px solid var(--bd);
  border-radius:var(--r);
  transition:border-color .2s,box-shadow .2s;
  appearance:none;-webkit-appearance:none;
}
.w3f-input::placeholder{color:var(--tx4);}
.w3f-input:hover{border-color:var(--blue-md);}
.w3f-input:focus{
  outline:none;border-color:#0c3ade;
  box-shadow:0 0 0 3px rgba(37,99,235,.10);
}
select.w3f-input{cursor:pointer;}
textarea.w3f-input{resize:vertical;min-height:112px;}
.w3f-btn{
  width:100%;justify-content:center;
  margin-top:var(--s4);min-height:48px;
  font-size:var(--f-base);font-weight:800;letter-spacing:.2px;
  box-shadow:0 4px 16px rgba(37,99,235,.28);
  transition:background .15s,box-shadow .15s,transform .1s;
}
.w3f-btn:hover{box-shadow:0 6px 20px rgba(37,99,235,.36);}
.w3f-btn:active{transform:scale(.98);box-shadow:none;}
.w3f-note{font-size:var(--f-xxs);color:var(--tx4);text-align:center;margin-top:var(--s3);line-height:1.6;}
.w3f-msg{
  display:none;border-radius:var(--r);
  padding:var(--s3) var(--s4);
  font-size:var(--f-sm);font-weight:600;
  margin-bottom:var(--s4);border-left:3px solid;
}
.w3f-ok {background:var(--glt);color:#065f46;border-left-color:var(--green);}
.w3f-err{background:#fee2e2;color:var(--red);border-left-color:var(--red);}

/* ── SECURITE PAGE ── */
#securite-hero{text-align:center;padding-top:var(--s8);}
#securite-hero h1,
#securite-hero .sub,
#securite-garanties .sec-lbl,
#securite-garanties h2,
#securite-garanties .sub,
#securite-donnees .sec-lbl,
#securite-donnees h2,
#securite-donnees .sub,
#securite-conformite .sec-lbl,
#securite-conformite h2,
#securite-conformite .sub{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
#securite-hero h1,
#securite-garanties h2,
#securite-donnees h2,
#securite-conformite h2,
#securite-hero ~ .sec h2,
#faq-securite h2{
  color:#0c3ade;
}

/* ════════════════════════════════════════════════════
   ARTICLES — styles scoped .hb-art
   Référence : maquette Figma · Harmonisé landing page
   ════════════════════════════════════════════════════ */

/* ── FOND PAGE ARTICLE = BLANC (même que Figma) ── */
body:has(.hb-art){background:var(--bg)!important;}

/* ── WRAPPER ──
   Pleine largeur avec max-width landing = même gabarit
   que les sections index.hbs                                     */
.hb-art{
  max-width:var(--max) !important;
  margin:0 auto !important;
  padding:var(--py) var(--px);
  color:var(--tx2);
  background:var(--bg);
}

/* ── H1 TITRE ARTICLE ──
   Identique au --f-h1 de la landing · Noir · Bold 800           */
.hb-art-title{
  font-size:var(--f-h1);
  font-weight:800;
  color:var(--tx);
  line-height:var(--lh-h);
  letter-spacing:-.3px;
  margin:0 0 var(--s6);
}

/* ── TEXTE COURANT ──
   --f-base = 14px mobile → 15px desktop
   line-height:1.72 = même que .sec .sub                         */
.hb-art p{
  font-size:var(--f-base);
  line-height:1.72;
  color:var(--tx2);
  margin:0 0 var(--s4);
  text-align:left;
}
.hb-art strong{color:var(--tx);font-weight:600;}

/* ── BOUTONS PARTAGE ──
   Layout : "Partager :" + boutons alignés                        */
.hb-art-share{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:var(--s2);margin:0 0 var(--s5);
  padding:var(--s3) var(--s4);
  border:1px solid var(--bd);border-radius:var(--r2);
  background:var(--bg);
}
.hb-art-share-lbl{
  font-size:var(--f-sm);font-weight:600;
  color:var(--tx2);white-space:nowrap;
  margin-right:var(--s2);
}
.hb-art-share a{
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 14px;border-radius:6px;
  font-size:var(--f-sm);font-weight:500;
  text-decoration:none;
  border:1px solid var(--bd);
  color:var(--tx2);background:var(--bg);
  transition:border-color .15s,background .15s,color .15s;
  line-height:1;
}
.hb-art-share a:hover{
  border-color:#0c3ade;
  background:var(--blue-lt);
  color:#0c3ade;
}
.hb-art-share a.hb-li{
  background:#0077b5;color:#fff;border-color:#0077b5;
}
.hb-art-share a.hb-li:hover{
  background:#005f99;border-color:#005f99;color:#fff;
}

/* ── META ── */
.hb-art-meta{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:4px 6px;
  font-size:var(--f-sm);color:var(--tx3);
  margin-bottom:var(--s3);
  line-height:var(--lh);
}
.hb-art-meta .sep{color:var(--tx4);margin:0 var(--s1);}

/* ── BREADCRUMB ── */
.hb-art-bc{
  font-size:var(--f-sm);color:var(--tx3);
  margin-bottom:var(--s6);
  line-height:var(--lh);
}
.hb-art-bc a{color:var(--blue);text-decoration:none;}
.hb-art-bc a:hover{text-decoration:underline;}
.hb-art-bc span{margin:0 5px;color:var(--tx4);}

/* ── SOMMAIRE ──
   Fond bleu clair + bordure gauche bleue (= design Figma)        */
.hb-art-toc{
  background:var(--blue-lt);
  border:1px solid var(--blue-md);
  border-left:4px solid var(--blue);
  border-radius:0 var(--r2) var(--r2) 0;
  padding:var(--s4) var(--s5);
  margin:0 0 var(--s6);
}
.hb-art-toc h2{
  font-size:var(--f-base);font-weight:700;
  color:var(--tx);margin:0 0 var(--s3);
}
.hb-art-toc ol{
  margin:0;padding-left:20px;
  display:flex;flex-direction:column;gap:var(--s2);
}
.hb-art-toc li{
  font-size:var(--f-md);color:var(--tx2);
  line-height:var(--lh);
}
.hb-art-toc a{color:var(--blue);text-decoration:none;}
.hb-art-toc a:hover{text-decoration:underline;}

/* ── TABLEAU CHIFFRES CLÉS ──
   Double sélecteur .hb-art .hb-art-kpi = spécificité 0,2,0
   écrase le thème Simple (.c-entry__content table = 0,2,1 max)   */
.hb-art .hb-art-kpi{
  background:#eff6ff !important;
  border:2px solid #93c5fd !important;
  border-radius:12px !important;
  padding:20px !important;
  margin:0 0 var(--s6) !important;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  box-shadow:0 2px 12px rgba(37,99,235,.10);
}
.hb-art .hb-art-kpi h2{
  font-size:clamp(16px,2vw,20px) !important;
  font-weight:700 !important;
  color:#1d4ed8 !important;
  margin:0 0 16px !important;
  display:flex;align-items:center;gap:8px;
}
.hb-art .hb-art-kpi table{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  font-size:14px !important;
  min-width:420px;
  border:2px solid #93c5fd !important;
  border-radius:8px !important;
  background:#fff !important;
}
.hb-art .hb-art-kpi thead tr th{
  background:#2563eb !important;
  color:#fff !important;
  padding:13px 18px !important;
  text-align:left !important;
  font-weight:700 !important;
  font-size:14px !important;
  border:none !important;
  border-bottom:2px solid #1d4ed8 !important;
}
.hb-art .hb-art-kpi tbody tr td{
  background:#fff !important;
  border:none !important;
  border-bottom:1.5px solid #93c5fd !important;
  padding:13px 18px !important;
  font-size:14px !important;
  line-height:1.65 !important;
}
.hb-art .hb-art-kpi tbody tr:nth-child(even) td{
  background:#e8f2ff !important;
}
.hb-art .hb-art-kpi tbody tr:last-child td{
  border-bottom:none !important;
}
.hb-art .hb-art-kpi tbody td:nth-child(1){
  font-weight:700 !important;
  color:#111827 !important;
}
.hb-art .hb-art-kpi tbody td:nth-child(2){
  font-weight:700 !important;
  color:#1d4ed8 !important;
  white-space:nowrap;
}
.hb-art .hb-art-kpi tbody td:nth-child(3){
  font-weight:400 !important;
  color:#6b7280 !important;
}

/* ── TITRES ARTICLE ──
   H2 : = .sec h2 landing (var(--f-h2) + 800 + bleu + trait)
   H3 : uppercase FONCÉ (= Figma : var(--tx), pas bleu)
   H4 : bold normal (= Figma : action items)                      */
.hb-art h2.hb-h2{
  font-size:var(--f-h2);
  font-weight:800;
  color:#0c3ade;
  border-bottom:3px solid var(--blue);
  padding-bottom:var(--s2);
  margin:var(--s7) 0 var(--s4);
  scroll-margin-top:72px;
  line-height:var(--lh-h);
  letter-spacing:-.2px;
}
.hb-art h3.hb-h3{
  font-size:var(--f-sm);
  font-weight:700;
  color:var(--tx);
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin:var(--s6) 0 var(--s3);
}
.hb-art h4.hb-h4{
  font-size:var(--f-base);
  font-weight:700;
  color:var(--tx);
  margin:var(--s4) 0 var(--s2);
}

/* ── CALLOUT "POUR ALLER PLUS LOIN" ── */
.hb-art-more{
  background:var(--blue-lt);
  border-left:4px solid var(--blue);
  border-radius:0 var(--r) var(--r) 0;
  padding:var(--s3) var(--s5);
  margin:var(--s5) 0;
}
.hb-art-more p{
  font-size:var(--f-xs);font-weight:700;
  color:var(--tx3);margin:0 0 var(--s2);
  text-transform:uppercase;letter-spacing:.8px;
  text-align:left;
}
.hb-art-more a{
  display:block;color:#0c3ade;
  font-size:var(--f-sm);font-weight:500;
  text-decoration:none;margin:4px 0;
  line-height:var(--lh);
}
.hb-art-more a::before{content:"→ ";font-weight:700;}
.hb-art-more a:hover{text-decoration:underline;}

/* ── HIGHLIGHT ── */
.hb-art-hl{
  background:var(--blue-lt);
  border:1px solid var(--blue-md);
  border-radius:var(--r);
  padding:var(--s3) var(--s5);
  margin:var(--s4) 0;
  font-size:var(--f-base);
  color:var(--blue-tx);
  font-weight:600;
  line-height:var(--lh);
}

/* ── SHARE BAS ── */
.hb-art-share-bottom{
  margin-top:var(--s7);
  padding-top:0;
  border-top:none;
}

/* ── RESPONSIVE ARTICLES ─────────────────────────────
   Audit complet basé sur screenshot mobile 375px
   ─────────────────────────────────────────────────── */

/* ── MOBILE < 640px ── */
@media(max-width:639px){

  /* Wrapper : padding réduit */
  .hb-art{padding:var(--s5) var(--px);}

  /* H1 titre : taille réduite mobile */
  .hb-art-title{
    font-size:clamp(20px,6vw,26px);
    margin-bottom:var(--s5);
  }

  /* Texte : justify → left sur mobile (évite espaces blancs) */
  .hb-art p{text-align:left;}

  /* Share bar : colonne sur très petits écrans */
  .hb-art-share{
    padding:var(--s2) var(--s3);
    gap:var(--s1) var(--s2);
  }
  .hb-art-share-lbl{
    width:100%;     /* label sur sa propre ligne */
    margin:0 0 var(--s1);
  }
  .hb-art-share a{
    padding:5px 10px;
    font-size:var(--f-xs);
  }

  /* Meta : wrap compact */
  .hb-art-meta{
    flex-direction:column;
    gap:var(--s1);
    align-items:flex-start;
  }
  .hb-art-meta .sep{display:none;}  /* masque le "•" séparateur */

  /* Breadcrumb : plus petit */
  .hb-art-bc{
    font-size:var(--f-xs);
    margin-bottom:var(--s4);
    line-height:1.5;
  }

  /* TOC : padding réduit */
  .hb-art-toc{padding:var(--s3) var(--s4);}
  .hb-art-toc h2{font-size:var(--f-sm);}
  .hb-art-toc li{font-size:var(--f-xs);}

  /* Tableau KPI : scroll horizontal actif + spécificité correcte (0,2,0) */
  .hb-art .hb-art-kpi{
    padding:var(--s3) !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    padding-bottom:calc(var(--s3) + 4px) !important; /* espace scrollbar */
  }
  .hb-art .hb-art-kpi > h2{font-size:var(--f-sm) !important;}

  /* H2 article : réduit */
  .hb-art h2.hb-h2{
    font-size:1.15rem;
    margin-top:var(--s6);
    margin-bottom:var(--s3);
  }

  /* H3 : espacement réduit */
  .hb-art h3.hb-h3{margin:var(--s4) 0 var(--s2);}

  /* Callout : padding réduit */
  .hb-art-more{padding:var(--s2) var(--s4);}
  .hb-art-hl{padding:var(--s2) var(--s3);}

  /* Titre article */
  .hb-art-title{margin-bottom:var(--s4);}
}

/* ── TABLETTE 640–1023px ── */
@media(min-width:640px) and (max-width:1023px){
  .hb-art{padding:var(--py) var(--px);}
  /* WCAG 1.4.8 : text-align left pour lisibilité */
  .hb-art p{text-align:left;}
  /* Share bar : inline */
  .hb-art-share-lbl{width:auto;}
}

/* ── DESKTOP ≥ 1024px ── */
@media(min-width:1024px){
  .hb-art{padding:var(--py) var(--px);}
}