/* ============================================================
   BALESTRA RED — COUCHE RESPONSIVE
   Chargée EN DERNIER, après les <style> de page, pour gagner
   la cascade sans recourir à !important.
   Paliers : ≤1180 · ≤1000 (nav) · ≤900 · ≤620
   ============================================================ */

/* ============================================================
   NAVIGATION MOBILE — disclosure sans JavaScript
   ============================================================ */
.nav-burger{display:none;margin-left:auto;position:relative;}
.nav-burger>summary{list-style:none;cursor:pointer;width:44px;height:44px;display:flex;
  flex-direction:column;justify-content:center;gap:5px;padding:0 10px;}
.nav-burger>summary::-webkit-details-marker{display:none;}
.nav-burger>summary span{display:block;height:1.5px;background:var(--encre);}
.nav-burger[open]>summary span:nth-child(2){opacity:0;}
.nav-panel{position:absolute;right:0;top:52px;width:min(84vw,320px);background:var(--chaux);
  border:1px solid var(--encre-15);padding:8px;z-index:60;
  box-shadow:0 18px 44px rgba(27,25,23,.10);}
.nav-panel a{display:block;padding:14px 16px;font-size:15px;border-bottom:1px solid var(--encre-08);}
.nav-panel a:last-child{border-bottom:none;}
.nav-panel a.nav-cta{margin-top:8px;text-align:center;color:var(--chaux);}

/* ============================================================
   RESPONSIVE
   Trois paliers : ≤1100 (tablette large) · ≤900 (tablette)
   · ≤620 (mobile). Les gouttières suivent.
   ============================================================ */

@media (max-width:1180px){
  :root{--gouttiere:44px;}
  .breadcrumb{padding-left:44px;padding-right:44px;}
  .section,.cta-band{padding-left:44px;padding-right:44px;}
  .footer{padding-left:44px;padding-right:44px;}
  .hero,.p-hero,.wrap,.mesure,.pillars,.crit-band,.cred{padding-left:44px;padding-right:44px;}
  .cred{margin-left:44px;margin-right:44px;}
  h1,.hero h1,.p-hero h1,.left h1{font-size:clamp(34px,4.6vw,58px);}
  .section-head h2,.cta-band h2{font-size:clamp(26px,3.2vw,40px);}
}

@media (max-width:1000px){
  .nav-links,.nav-right{display:none;}
  .nav-burger{display:block;}
  .nav{height:76px;}
  .nav-logo .lockup{height:44px;}
}

@media (max-width:420px){
  .nav-logo .lockup{display:none;}
  .nav-logo .markonly{display:block;}
}

@media (max-width:900px){
  /* les grilles à 3+ colonnes passent à 2 */
  .g4,.chain,.act,.piste-row,.steps{grid-template-columns:repeat(2,1fr);}
  .g3,.gov3,.why,.usecase,.team-grid,.seuils,.headline-figs,.pillar-grid,.principe,.dir{grid-template-columns:repeat(2,1fr);}
  .jv{grid-template-columns:1fr 1fr;}
  .jv-cap{grid-column:1 / -1;}
  /* les bordures verticales deviennent horizontales */
  .chain .ch,.act .a,.headline-figs .f,.stat{border-left:none;border-top:1px solid var(--encre-15);}
  .pillar{border-left:none;padding-left:0;border-top:1px solid var(--chaux-15);padding-top:28px;}
  .pillar:first-child{border-top:none;}
  .crit-band{flex-direction:column;gap:26px;align-items:center;}
  .crit-band .i{border-left:none;padding:0;}
  .cred .row{flex-wrap:wrap;gap:14px 30px;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px 30px;}
  .footer-grid > div:first-child{grid-column:1 / -1;}
  .section-head{flex-direction:column;align-items:flex-start;gap:16px;}
  .section-head p{max-width:none;}
  .lead{grid-template-columns:110px 1fr;}
  table.crit,table.compare{min-width:640px;}
}

@media (max-width:620px){
  :root{--gouttiere:22px;}
  .breadcrumb{padding-left:22px;padding-right:22px;}
  .section,.cta-band{padding:64px 22px;}
  .footer{padding:56px 22px 22px;}
  .hero,.p-hero,.wrap,.mesure,.pillars{padding-left:22px;padding-right:22px;}
  .cred{margin-left:22px;margin-right:22px;}
  /* tout passe en une colonne */
  .hero,.p-hero,.wrap,.g4,.g3,.gov3,.why,.usecase,.team-grid,.seuils,.headline-figs,
  .pillar-grid,.chain,.act,.piste-row,.steps,.prod2,.two-products,.excl,.jv,.grille-dl,.principe,.dir,
  .lead-row,.deal-example,.footer-grid,.opt-grid,.field-row,.contact-card,
  .map-wrap,.article-grid,.testimonials,.persona-grid,.timeline,.moat-grid,
  .portal-body,.etym,.gauges{grid-template-columns:1fr;}
  .engagements{border-left:none;border-top:1px solid var(--encre-15);padding-left:0;padding-top:28px;margin-top:8px;}
  .hero{gap:0;}
  .wrap{gap:40px;}
  .lead{grid-template-columns:1fr;gap:20px;}
  .persona-card,.prod,.tp-col,.uc,.st,.moat-item,.ch,.act .a,.gov3>div,.why>div,.testi{
    border-left:none;}
  .prod,.form-card,.excl div,.gov3>div,.why>div{padding:28px 24px;}
  .seuil .v{font-size:40px;}
  .act .v,.headline-figs .v{font-size:34px;}
  .quote p,.thesis p{font-size:21px;}
  .piste-row .p{padding-right:0;}
  .btn.solid,.nav-cta{display:block;text-align:center;}
  .hero .ctas,.p-hero .ctas,.ctas{flex-direction:column;align-items:stretch;gap:14px;}
  .footer-bottom{flex-direction:column;gap:18px;}
  .dl{width:100%;justify-content:center;}
}

/* ============================================================
   IMPRESSION
   ============================================================ */
@media print{
  .nav,.nav-burger,.cta-band,.sv-skip{display:none;}
  .page{max-width:none;}
  a{text-decoration:none;color:inherit;}
  .dark,.navy,.mesure,.pillars,.footer{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}

/* ---- corrections de détail mobile ---- */
@media (max-width:620px){
  .eyebrow{letter-spacing:.1em;font-size:10px;}
  .engagements{border-left:none;border-top:1px solid var(--encre-15);padding-left:0;padding-top:28px;}
  .hero{padding-top:40px;}
  .p-hero{padding-top:32px;}
  .graduation{height:10px;}
  .nav-panel{width:min(90vw,320px);}
  sup{font-size:.7em;}
}

/* Les retours forcés des H1 sont calés sur la largeur du bureau.
   Sous 900 px on laisse le texte se replier tout seul : un « en » ou un « et »
   seul sur sa ligne coûte plus à la lecture que la ligne idéale au-dessus. */
@media (max-width:900px){
  h1 br{display:none;}
  .hero h1 br,.p-hero h1 br{display:none;}
}

/* Carte des zones désignées (page Critères). Placé ici, et pas dans le <style>
   de la page, pour respecter l'ordre de cascade documenté. */
@media (max-width:1000px){
  .carte{grid-template-columns:1fr;gap:30px;padding:24px 22px 28px;}
  .carte-svg{max-width:560px;margin:0 auto;}
}
@media (max-width:620px){
  .carte{padding:18px 16px 22px;}
  .zfil label{font-size:9px;padding:9px 6px;}
  .zl ul{columns:1;}
  .carte-svg .lb{font-size:13px;}
}

/* L'accès plateforme sort de la barre haute sous 1024 px : il est
   repris dans le menu dépliant et dans le pied de page. */
@media (max-width:1080px){
  .nav-secure{display:none;}
}

/* Carte schématique : sous 620 px, une carte de France de 340 px de large
   avec 33 marqueurs n'est plus lisible et le survol n'existe pas. On la
   remplace par le renvoi vers le test par commune — plus rapide au doigt —
   et les listes, qui restent le contenu de référence.
   L'ordre compte : la règle de base d'abord, la media query ensuite. */
.carte-mob{display:none;border:1px solid var(--acier-15);background:var(--acier-08);padding:20px 20px 22px;margin-bottom:4px;}
.carte-mob p{font-size:13.5px;color:var(--encre-70);line-height:1.65;margin-bottom:16px;}
.carte-mob .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--acier);margin-bottom:9px;}
@media (max-width:620px){
  .carte-svg,.zleg,.zhint{display:none;}
  .carte-mob{display:block;}
}

@media (max-width:900px){
  .p-specs{margin-top:0;}
}


/* ============================================================
   GRILLE CRITÈRES — en blocs sous 620 px
   Un tableau à trois colonnes ne défile pas horizontalement sur
   un téléphone sans qu'on le sache. Chaque critère devient un
   bloc : le critère, puis chaque structure nommée par son
   étiquette. Aucun JavaScript.
   ============================================================ */
@media (max-width:620px){
  table.crit{min-width:0;table-layout:auto;}
  table.crit thead{display:none;}
  table.crit,table.crit tbody,table.crit tr,table.crit td{display:block;width:auto;}
  table.crit tr{border-bottom:1px solid var(--encre-15);padding:16px 0 18px;}
  table.crit tr:last-child{border-bottom:none;}
  table.crit td{border:none;padding:0 20px;}
  table.crit td.lbl{color:var(--encre);font-weight:500;margin-bottom:10px;}
  table.crit td.val{margin-top:10px;}
  table.crit td.val[data-c]::before{content:attr(data-c);display:block;font-family:var(--mono);
    font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--encre-50);margin-bottom:4px;}
}