/*
 * SOLIFERM — Feuille de styles principale
 * CSS public du site SOLIFERM.
 */
/* ══ RESET & VARIABLES ══ */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --or:#b5592f;
  --or-dark:#8f4423;
  --or-light:#f3e6da;
  --or-pale:#faf1e9;
  --or-mid:#ecd9c8;
  --fond:#faf6f0;
  --blanc:#FFFFFF;
  --texte:#2b241d;
  --muted:#6b5f52;
  --border:#e9e0d2;
  --sombre:#241d16;
  --gris-clair:#f5f1ea;
}
html,body{font-family:'Karla',sans-serif;color:var(--texte);background:var(--blanc);overflow-x:clip}

/* Animation d'apparition au scroll (reprise des maquettes d'identité visuelle) */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.is-visible{opacity:1;transform:translateY(0)}


/* ══ NAVIGATION ══ */
/* ══ NAVIGATION ══ */
.site-nav{background:var(--blanc);height:75px;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;position:sticky;top:0;z-index:100;border-bottom:0.5px solid var(--border);box-shadow:0 1px 12px rgba(0,0,0,.04)}
.nav-logo{display:flex;flex-direction:column;gap:0}
.site-nav-list{list-style:none;display:flex;gap:1.8rem;align-items:center}
.logo{font-family:'Newsreader',serif;font-size:1.15rem;font-weight:500;color:var(--or);text-decoration:none;letter-spacing:.3px;display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.logo em{color:var(--or);font-style:normal;font-weight:600}
.logo-nom{font-family:'Newsreader',serif;font-size:1.8rem;color:var(--texte);letter-spacing:-.2px;line-height:1.05}
.logo-nom em{color:var(--or);font-style:normal}
.logo-sub{font-size:.68rem;color:#A89F84;letter-spacing:1px;text-transform:uppercase;margin-top:3px}
.nav-links{display:flex;list-style:none;height:100%;align-items:center;gap:0}
.nav-links>li{position:relative;height:100%;display:flex;align-items:center}
.nav-links>li>a{display:flex;align-items:center;height:100%;padding:0 1rem;color:#555;font-size:.78rem;text-decoration:none;cursor:pointer;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;gap:4px;user-select:none}
.nav-links>li>a:hover,.nav-links>li>a.active{color:var(--or)}
.nav-links>li>a.active{border-bottom-color:var(--or)}
.nav-arrow{font-size:.5rem;margin-top:1px;transition:transform .2s}
.nav-links>li:hover .nav-arrow{transform:rotate(180deg)}
/* Dropdown produits */
.nav-dropdown{position:absolute;top:100%;left:0;min-width:200px;background:var(--blanc);border:0.5px solid var(--border);border-radius:0 0 10px 10px;box-shadow:0 8px 24px rgba(0,0,0,.08);display:none;z-index:200;overflow:hidden}
.nav-links>li:hover .nav-dropdown{display:block}
.nav-dropdown a{display:block;padding:.65rem 1.1rem;font-size:.78rem;color:#555;text-decoration:none;border-bottom:0.5px solid var(--border);cursor:pointer;transition:background .12s,color .12s}
.nav-dropdown a:last-child{border-bottom:none}
.nav-dropdown a:hover{background:var(--or-light);color:var(--or)}
.nav-cta{background:var(--or);color:#fff;border:none;padding:.5rem 1.3rem;font-family:'Karla',sans-serif;font-size:.78rem;font-weight:500;cursor:pointer;border-radius:6px;white-space:nowrap}
.nav-cta:hover{background:var(--or-dark)}

/* ====== NAVIGATION SYSTEME B (hubs produits) - mega-menu, hamburger, mobile-menu ====== */

/* Complements site-nav-list */
.site-nav-list a{color:#555;text-decoration:none;font-size:.85rem;cursor:pointer;transition:color .15s;display:inline-block;padding:.5rem 0}
.site-nav-list a:hover,.site-nav-list a.active{color:var(--or)}
.site-nav-list .nav-pro{color:var(--or);border:0.5px solid rgba(181,89,47,.4);border-radius:4px;padding:.3rem .9rem}

/* Trigger nav-produits (caret dropdown) */
.nav-produits{position:static}
.nav-produits > a{display:inline-flex;align-items:center;gap:.3rem;cursor:pointer}
.nav-produits > a::after{
  content:'';display:inline-block;width:6px;height:6px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);margin-top:-3px;margin-left:.2rem;transition:transform .2s;
}
.nav-produits:hover > a::after,
.nav-produits.open > a::after{transform:rotate(225deg);margin-top:1px}

/* Mega-menu */
.mega-menu{
  position:absolute;top:100%;left:0;right:0;width:100%;
  background:#fff;border-bottom:0.5px solid var(--border);
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s,transform .2s,visibility 0s linear .2s;
  z-index:99;
}
.nav-produits:hover .mega-menu,
.mega-menu:hover,
.nav-produits.open .mega-menu{
  opacity:1;visibility:visible;transform:translateY(0);
  transition:opacity .2s,transform .2s,visibility 0s;
}
.mega-menu::before{content:'';position:absolute;top:-10px;left:0;right:0;height:10px}
.mega-menu-inner{
  display:grid;grid-template-columns:repeat(5,1fr);gap:2.5rem;
  padding:2.5rem 2.5rem 2rem;max-width:1400px;margin:0 auto;
}
.mm-col{display:flex;flex-direction:column}
.mm-col-titre{
  font-family:'Newsreader',serif;font-size:1rem;font-weight:500;color:var(--texte);
  text-decoration:none;padding-bottom:.75rem;margin-bottom:.85rem;
  border-bottom:1px solid var(--or-mid);
  display:flex;align-items:center;gap:.55rem;transition:color .15s;
}
.mm-col-titre:hover{color:var(--or)}
.mm-col-titre svg{width:18px;height:18px;color:var(--or-dark);flex-shrink:0}
.mm-col-list{list-style:none;display:flex;flex-direction:column;gap:.1rem}
.mm-col-list a{
  display:block;font-size:.85rem;color:#555;text-decoration:none;
  padding:.45rem .5rem;border-radius:5px;
  transition:background .12s,color .12s;line-height:1.4;
}
.mm-col-list a:hover{background:var(--or-light);color:var(--or-dark)}
.mega-menu-baseline{
  padding:1rem 2.5rem;background:var(--fond);border-top:0.5px solid var(--border);
  text-align:center;font-size:.78rem;color:var(--muted);letter-spacing:.3px;
}
.mega-menu-baseline strong{color:var(--or-dark);font-weight:500}

/* Hamburger mobile */
.nav-hamburger{display:none;background:none;border:none;cursor:pointer;padding:.4rem;flex-direction:column;gap:5px}
.nav-hamburger span{display:block;width:24px;height:2px;background:var(--texte);transition:transform .25s,opacity .25s}
.nav-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-hamburger.open span:nth-child(2){opacity:0}
.nav-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile-menu overlay */
.mobile-menu{display:none;position:fixed;top:0;right:-100%;width:88%;max-width:380px;height:100vh;background:#fff;z-index:200;transition:right .3s ease;overflow-y:auto;box-shadow:-4px 0 24px rgba(0,0,0,.15)}
.mobile-menu.open{right:0}
.mobile-menu-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.4);z-index:150;opacity:0;transition:opacity .3s}
.mobile-menu-overlay.open{display:block;opacity:1}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;padding:1.2rem 1.4rem;border-bottom:0.5px solid var(--border)}
.mobile-menu-header .logo{display:flex;align-items:center;text-decoration:none}
.mobile-menu-header .logo-nom{font-family:'Newsreader',serif;font-size:1.3rem;color:var(--texte);letter-spacing:-.2px;line-height:1.05}
.mobile-menu-header .logo-nom em{color:var(--or);font-style:normal}
.mobile-menu-header .logo-sub{font-size:.6rem;color:#A89F84;letter-spacing:.8px;text-transform:uppercase;margin-top:2px}
.mobile-menu-close{background:none;border:none;font-size:1.5rem;color:var(--muted);cursor:pointer;padding:.2rem .5rem}
.mobile-menu-list{list-style:none;padding:.8rem 0}
.mobile-menu-list > li{border-bottom:0.5px solid var(--border)}
.mobile-menu-list > li > a{display:block;padding:1rem 1.4rem;font-size:.95rem;color:var(--texte);text-decoration:none;font-weight:500}
.mobile-accordion summary{list-style:none;cursor:pointer;padding:1rem 1.4rem;font-size:.95rem;font-weight:500;color:var(--texte);display:flex;align-items:center;justify-content:space-between}
.mobile-accordion summary::-webkit-details-marker{display:none}
.mobile-accordion summary::after{content:'+';font-size:1.4rem;color:var(--or);font-weight:300;line-height:1}
.mobile-accordion[open] summary::after{content:'−'}
.mobile-accordion-content{padding:0 1.4rem 1rem;background:var(--fond)}
.mobile-accordion-content a{display:block;padding:.7rem .5rem;font-size:.88rem;color:#555;text-decoration:none;border-bottom:0.5px solid var(--border)}
.mobile-accordion-content a:last-child{border-bottom:none}
.mobile-accordion-content a:hover{color:var(--or)}

/* Responsive nav systeme B */
@media (max-width:1100px){
  .mega-menu-inner{gap:1.5rem;padding:2rem 1.5rem 1.5rem}
}
@media (max-width:900px){
  .site-nav-list{display:none}
  .nav-hamburger{display:flex}
  .mega-menu{display:none}
  .mobile-menu{display:block}
  .site-nav{padding:0 1.4rem}
  .site-nav .logo-nom{font-size:1.4rem}
  .site-nav .logo-sub{font-size:.58rem}
  .nav-actions .nav-ghost-btn{display:none}
}

/* ── Boutons nav "Trouver mon magasin" / "Être rappelé" (fondu-balayage au survol) ── */
.nav-actions{display:flex;align-items:center;gap:14px;flex-shrink:0}
.nav-ghost-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;border-radius:999px;border:1.5px solid var(--or);color:var(--or);font-size:.82rem;font-weight:600;white-space:nowrap;text-decoration:none;transition:color .4s ease;cursor:pointer;background:none}
.nav-ghost-btn::before{content:"";position:absolute;inset:0;width:0%;background:var(--or);transition:width .45s ease;z-index:0}
.nav-ghost-btn span{position:relative;z-index:1}
.nav-ghost-btn:hover{color:#fff8f2}
.nav-ghost-btn:hover::before{width:100%}
.mobile-menu-actions{display:flex;flex-direction:column;gap:10px;padding:0 1.4rem 1.2rem;border-bottom:0.5px solid var(--border)}
.mobile-menu-actions .nav-ghost-btn{width:100%;padding:13px 20px}

/* Animation d'entrée des boutons de nav au chargement (cascade droite→gauche) */
.enter-anim{opacity:0;transform:translateX(28px);transition:opacity .55s ease,transform .55s ease}
.enter-anim.is-in{opacity:1;transform:translateX(0)}

/* ── Modale "Être rappelé" ── */
#modal-rappel{display:none;position:fixed;inset:0;z-index:300;align-items:center;justify-content:center;background:rgba(43,36,29,.55);padding:20px}
#modal-rappel.open{display:flex}
.modal-rappel-box{background:var(--fond);border-radius:20px;max-width:380px;width:100%;padding:32px;position:relative;box-shadow:0 30px 60px -20px rgba(20,15,8,.4)}
.modal-rappel-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:1.3rem;color:var(--muted);cursor:pointer;line-height:1}
.modal-rappel-titre{font-family:'Newsreader',serif;font-size:1.3rem;font-weight:600;color:var(--texte);margin-bottom:8px}
.modal-rappel-sub{font-size:.9rem;color:var(--muted);margin-bottom:20px}
.modal-rappel-form{display:flex;flex-direction:column;gap:14px}
.modal-rappel-form input{padding:12px 14px;border-radius:10px;border:1px solid var(--border);font-size:.95rem;font-family:inherit;background:var(--blanc);color:var(--texte)}
.modal-rappel-row{display:flex;gap:10px}
.modal-rappel-row input{flex:1;min-width:0}
.modal-rappel-form button{background:var(--or);color:#fff;border:none;padding:12px;border-radius:999px;font-size:.95rem;font-weight:600;cursor:pointer;font-family:'Karla',sans-serif}
.modal-rappel-form button:hover{background:var(--or-dark)}

/* ── BULLES DE CONTACT FLOTTANTES (chatbot + WhatsApp), 26/09 ──
   Jamais construites sur le vrai site jusqu'ici (existaient seulement sur
   les maquettes) : ajoutées dans footer.njk (partagé) pour être actives
   sur les 36 pages d'un coup. Chatbot = avatar + bulle de texte façon
   « vrai chat humain » (demande explicite de Kévin, plutôt qu'une icône
   de robot) — reste un placeholder visuel, aucune logique de chat réelle
   branchée (décision explicite de Kévin, service à choisir plus tard). */
.contact-bulles{position:fixed;right:24px;bottom:24px;z-index:140;display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.bulle-whatsapp{display:none;align-items:center;justify-content:center;width:52px;height:52px;border-radius:999px;background:#25D366;box-shadow:0 10px 26px -8px rgba(20,60,30,.5);flex-shrink:0;animation:bulleIn .5s ease .6s both}
@media (max-width:760px){.bulle-whatsapp{display:flex}}
.bulle-chat{display:flex;align-items:center;gap:.6rem;background:none;border:none;padding:0;cursor:pointer;animation:bulleIn .5s ease 1s both;max-width:calc(100vw - 48px)}
.bulle-chat-bubble{background:var(--blanc);color:var(--texte);font-size:.82rem;font-weight:500;padding:.6rem 1rem;border-radius:14px 14px 4px 14px;box-shadow:0 12px 28px -12px rgba(60,40,20,.35);white-space:normal;max-width:150px;text-align:right;line-height:1.3}
.bulle-chat-avatar{flex-shrink:0;width:58px;height:58px;border-radius:50%;background:linear-gradient(160deg,#e9dcc4 0%,#d9c6a4 55%,#c9ac7c 100%);box-shadow:0 12px 28px -8px rgba(120,60,20,.4);display:flex;align-items:center;justify-content:center;color:rgba(255,248,242,.9);position:relative}
.bulle-chat-avatar::after{content:"";position:absolute;bottom:2px;right:2px;width:12px;height:12px;border-radius:50%;background:#3fae5a;border:2px solid var(--fond)}
@media (max-width:480px){.bulle-chat-bubble{display:none}}
@keyframes bulleIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}


/* ══ HERO (page accueil) ══ */
/* Hero : occupe ~85% de la hauteur d'écran, contenu aéré, transition douce vers KPIs */
.hero{display:grid;grid-template-columns:1fr 1fr;min-height:520px;padding:2.5rem 2.5rem 0;gap:0;align-items:stretch}
.hero-left{padding:1.5rem 2rem 1.5rem 0;display:flex;flex-direction:column;justify-content:center}
.hero-tag{font-size:.7rem;letter-spacing:2.5px;text-transform:uppercase;color:var(--or);margin-bottom:1.4rem;opacity:.9}
.hero-h1{font-family:'Newsreader',serif;font-size:2.5rem;font-weight:500;color:var(--texte);line-height:1.2;margin-bottom:1.4rem}
.hero-h1 em{color:var(--or);font-style:normal}
.hero-sub{font-size:.95rem;color:var(--muted);line-height:1.75;margin-bottom:2rem}
.hero-btns{display:flex;gap:.75rem;flex-wrap:wrap}
.btn-or{background:var(--or);color:#fff;border:none;padding:.78rem 1.85rem;border-radius:6px;font-family:'Karla',sans-serif;font-size:.83rem;font-weight:500;cursor:pointer}
.btn-or:hover{background:var(--or-dark)}
.btn-ghost{background:transparent;color:#555;border:0.5px solid #ddd2c0;padding:.78rem 1.85rem;border-radius:6px;font-family:'Karla',sans-serif;font-size:.83rem;cursor:pointer}
.btn-ghost:hover{border-color:var(--or);color:var(--or)}
.hero-right{background:var(--or-pale);display:flex;flex-direction:column;align-items:stretch;justify-content:center;padding:1.8rem 1.7rem;border-radius:14px;box-shadow:0 4px 24px rgba(181,89,47,.10);border:0.5px solid #e6d6c4}

/* ── Formulaire hero ── */
.hero-form{display:flex;flex-direction:column;gap:.95rem;width:100%}
.hero-form-head{text-align:center;margin-bottom:.4rem}
.hero-form-titre{font-family:'Newsreader',serif;font-size:1.5rem;font-weight:500;color:var(--texte);line-height:1.2;margin:0 0 .3rem}
.hero-form-sub{font-size:.78rem;color:var(--muted);margin:0;line-height:1.4}
.hero-form-row2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.hero-form-group{display:flex;flex-direction:column;gap:.3rem}
.hero-form-label{font-size:.72rem;font-weight:500;color:var(--texte);letter-spacing:.2px}
.hero-form-req{color:var(--or);margin-left:2px}
.hero-form-ctrl{padding:.6rem .75rem;border:0.5px solid #e6d6c4;border-radius:7px;background:#fff;font-family:'Karla',sans-serif;font-size:.86rem;color:var(--texte);transition:border-color .15s,box-shadow .15s;outline:none}
.hero-form-ctrl:focus{border-color:var(--or);box-shadow:0 0 0 2px rgba(181,89,47,.12)}
.hero-form-ctrl::placeholder{color:#b3a08c;font-size:.83rem}
.hero-form-help{font-size:.66rem;color:var(--muted);font-style:italic;margin-bottom:.18rem}
.hero-form-btn{margin-top:.45rem;padding:.85rem 1rem;background:var(--or);color:#fff;border:none;border-radius:7px;font-family:'Karla',sans-serif;font-size:.92rem;font-weight:500;letter-spacing:.3px;cursor:pointer;transition:background .15s,transform .15s,box-shadow .15s;box-shadow:0 4px 14px rgba(181,89,47,.18)}
.hero-form-btn:hover{background:var(--or-dark);transform:translateY(-1px);box-shadow:0 6px 20px rgba(181,89,47,.28)}
.hero-form-btn:active{transform:translateY(0)}
.hero-form-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.hero-form-msg{padding:.7rem .85rem;border-radius:7px;font-size:.78rem;line-height:1.5;margin-top:.4rem}
.hero-form-msg.success{background:#E8F4F0;color:#1F6B4F;border:0.5px solid #A8D5C0}
.hero-form-msg.error{background:#FBE9E9;color:#A03330;border:0.5px solid #E8B6B4}

/* Multi-select produits — réutilise le style du formulaire de devis principal */
.hf-prods-select{position:relative}
.hf-prods-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.6rem .75rem;border:0.5px solid #e6d6c4;border-radius:7px;background:#fff;font-family:'Karla',sans-serif;font-size:.86rem;color:var(--texte);cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s}
.hf-prods-trigger:hover{border-color:var(--or-pale)}
.hf-prods-trigger:focus{outline:none;border-color:var(--or);box-shadow:0 0 0 2px rgba(181,89,47,.12)}
.hf-prods-select.open .hf-prods-trigger{border-color:var(--or);box-shadow:0 0 0 2px rgba(181,89,47,.12)}
.hf-prods-trigger-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hf-prods-trigger-text.is-placeholder{color:#b3a08c}
.hf-prods-trigger-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--or);color:#fff;font-size:.7rem;font-weight:500;margin-right:.5rem}
.hf-prods-trigger-arrow{display:inline-block;width:8px;height:8px;border:1.5px solid var(--muted);border-top:0;border-left:0;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.hf-prods-select.open .hf-prods-trigger-arrow{transform:rotate(-135deg) translateY(2px)}
.hf-prods-panel{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:0.5px solid #e6d6c4;border-radius:7px;box-shadow:0 6px 22px rgba(0,0,0,.10);max-height:240px;overflow-y:auto;z-index:30;padding:.4rem}
.hf-prods-select.open .hf-prods-panel{display:block}
.hf-prod-check{display:flex;align-items:center;gap:.5rem;padding:.45rem .55rem;border-radius:5px;cursor:pointer;transition:background .12s;font-size:.85rem}
.hf-prod-check:hover{background:var(--or-pale)}
.hf-prod-check input{cursor:pointer;accent-color:var(--or)}
.hf-prod-check-label{color:var(--texte);user-select:none}
.hf-prods-chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.hf-prods-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .55rem;background:var(--or-pale);border:0.5px solid #e6d6c4;border-radius:12px;font-size:.72rem;color:var(--texte)}
.hf-prods-chip-x{cursor:pointer;color:var(--or);font-weight:500;line-height:1}

/* Honeypot — invisible aux humains */
.hf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Responsive : sur mobile, le formulaire passe en pleine largeur */
@media (max-width:768px){
  .hero-form-row2{grid-template-columns:1fr}.hero{grid-template-columns:1fr}.hero-left{padding-right:0}
  .hero-form-titre{font-size:1.3rem}
}

/* ══ KPIs ══ */
/* Style "carte" : fond or-pale chaleureux, border-radius, ombre douce */
.kpis{display:flex;background:var(--or-pale);margin:2rem 2.5rem 0;border-radius:14px;box-shadow:0 4px 24px rgba(181,89,47,.12);border:0.5px solid #e6d6c4;overflow:hidden}
.kpi{flex:1;text-align:center;padding:1rem .5rem;border-right:0.5px solid rgba(181,89,47,.18);background:transparent;transition:background .2s}
.kpi:last-child{border-right:none}
.kpi:hover{background:rgba(255,255,255,.4)}
.kpi-v{font-family:'Newsreader',serif;font-size:1.5rem;font-weight:500;color:var(--or-dark)}
.kpi-l{font-size:.68rem;color:#8a7c6c;margin-top:5px;line-height:1.3;text-transform:uppercase;letter-spacing:.5px}

/* ══ ZONES ══ */
/* Bandeau ville : marge-top vers les KPIs et marge-bottom à zéro (transition immédiate vers la section suivante) */
.zones{display:flex;align-items:center;gap:.5rem;padding:.8rem 2.5rem;margin-top:1rem;margin-bottom:0;background:var(--blanc);flex-wrap:wrap}
.zones-lbl{font-size:.72rem;color:#AAA;margin-right:.25rem}
.zone-tag{padding:3px 12px;border-radius:20px;background:var(--or-light);font-size:.7rem;color:var(--or-dark);border:0.5px solid #e6d6c4;font-weight:500}
a.zone-tag{text-decoration:none}
a.zone-tag:hover{background:var(--or);color:#fff;border-color:var(--or)}

/* ══ SECTIONS COMMUNES ══ */
.section{padding:3.5rem 2.5rem}
/* Section Produits : padding-top minimal pour transition immédiate avec les zones (pas de barre vide) */
#sec-produits{padding-top:0.6rem}
/* Sur écrans plus petits que 1080p, on relâche le min-height du hero pour ne pas trop forcer */
@media (max-height:850px){
  .hero{min-height:auto}
  .hero-tag{margin-bottom:.9rem}
  .hero-h1{margin-bottom:.9rem}
  .hero-sub{margin-bottom:1.4rem}
}
.section-alt{background:var(--fond)}
.section-label{font-size:.68rem;letter-spacing:2px;text-transform:uppercase;color:var(--or);margin-bottom:.6rem;opacity:.9}
.section-titre{font-family:'Newsreader',serif;font-size:1.85rem;color:var(--texte);margin-bottom:.5rem;line-height:1.2}
.section-sous{font-size:.9rem;color:var(--muted);margin-bottom:2.5rem;max-width:540px;line-height:1.7}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:2rem}
.lien-or{color:var(--or);cursor:pointer;font-size:.82rem;font-weight:500}
.lien-or:hover{text-decoration:underline}

/* ══ PRODUITS ══ */
.produits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
/* Mise en page accueil : 4 colonnes (la 7e carte se centre automatiquement) */
#prods-accueil{grid-template-columns:repeat(4,1fr);gap:1.25rem}
/* Force la dernière ligne à être centrée quand on a 5, 6 ou 7 cartes :
   on simule 12 colonnes, chaque carte prend 3 cols → 4 cards par ligne.
   Pour 7 cartes : 4 + 3 cards, la 2e ligne se centre via le décalage */
#prods-accueil.layout-4plus3{grid-template-columns:repeat(12,1fr)}
#prods-accueil.layout-4plus3 > .prod-card{grid-column:span 3}
#prods-accueil.layout-4plus3 > .prod-card:nth-child(5){grid-column:2 / span 3}
/* Responsive : sur écran moyen, retombe en 3 colonnes */
@media (max-width:1100px){
  #prods-accueil,#prods-accueil.layout-4plus3{grid-template-columns:repeat(3,1fr)}
  #prods-accueil.layout-4plus3 > .prod-card,
  #prods-accueil.layout-4plus3 > .prod-card:nth-child(5){grid-column:auto}
}
@media (max-width:768px){
  #prods-accueil,#prods-accueil.layout-4plus3{grid-template-columns:1fr}
}
.prod-card{background:var(--blanc);border:0.5px solid var(--border);border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s,box-shadow .2s}
.prod-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(0,0,0,.08)}
.prod-photo{height:190px;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center}
.prod-photo img{width:100%;height:100%;object-fit:cover;display:block}
.prod-photo-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.prod-info{padding:1rem 1.1rem}
.prod-nom{font-weight:500;font-size:.92rem;color:var(--texte);margin-bottom:3px}
.prod-sous{font-size:.75rem;color:var(--muted)}
.prod-lien{font-size:.73rem;color:var(--or);margin-top:.5rem;display:inline-block;font-weight:500}
/* Sur l'accueil : cartes plus compactes pour faire tenir 2 lignes (4+3) dans un écran 1080p */
#prods-accueil .prod-photo{height:150px}
#prods-accueil .prod-info{padding:.8rem 1rem}
#prods-accueil .prod-lien{margin-top:.35rem}

/* ══ POURQUOI NOUS ══ */
.atouts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.atout{background:var(--blanc);border:0.5px solid var(--border);border-radius:12px;padding:1.5rem 1.2rem;text-align:center}
.atout-icone{width:48px;height:48px;border-radius:50%;background:var(--or-light);margin:0 auto 1rem;display:flex;align-items:center;justify-content:center}
.atout-icone svg{width:22px;height:22px;stroke:var(--or);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.atout-titre{font-size:.88rem;font-weight:500;color:var(--texte);margin-bottom:.3rem}
.atout-desc{font-size:.75rem;color:var(--muted);line-height:1.55}

/* ══ PROCESS PAGE CONTACT — 5 étapes du parcours client (portage nouveau
   design 26/09 : ligne épurée avec séparateurs, cercle numéroté plein,
   plus de carte à bordure — cohérent avec .engagement du gabarit Racine
   simple, qui utilise le même schéma visuel) ══ */
.process-grid{display:flex;flex-direction:column;gap:0;max-width:780px;margin:0 auto}
.process-step{display:flex;gap:1.4rem;align-items:flex-start;padding:1.5rem 0;border-top:0.5px solid var(--border)}
.process-step:first-child{border-top:none}
.process-num{flex-shrink:0;width:2.8rem;height:2.8rem;border-radius:50% 44% 50% 44%;background:var(--or);color:#fff;font-family:'Newsreader',serif;font-size:1.1rem;font-weight:600;display:flex;align-items:center;justify-content:center}
.process-content{flex:1}
.process-titre{font-size:1rem;font-weight:600;color:var(--texte);margin-bottom:.35rem}
.process-desc{font-size:.88rem;color:var(--muted);line-height:1.65}
@media (max-width:768px){
  .process-step{padding:1.1rem 0;gap:1rem}
  .process-num{width:2.3rem;height:2.3rem;font-size:1rem}
}

/* ══ FAQ PAGE CONTACT ══ */
.faq-list{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:.7rem}
.faq-item{background:var(--blanc);border:0.5px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color .15s}
.faq-item[open]{border-color:#e6d6c4}
.faq-q{padding:1.05rem 1.3rem;font-size:.92rem;font-weight:500;color:var(--texte);cursor:pointer;display:flex;align-items:center;justify-content:space-between;list-style:none;user-select:none;transition:background .15s}
.faq-q::-webkit-details-marker{display:none}
.faq-q:hover{background:var(--fond)}
.faq-q::after{content:'+';font-family:'Karla',sans-serif;font-size:1.4rem;font-weight:300;color:var(--or);margin-left:1rem;transition:transform .2s;line-height:1}
.faq-item[open] .faq-q::after{content:'−'}
.faq-r{padding:0 1.3rem 1.2rem;font-size:.85rem;color:var(--muted);line-height:1.7}

/* ══ RÉALISATIONS ══ */
.reals-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;align-items:start}
.real-card{border-radius:10px;overflow:hidden;aspect-ratio:4/3;position:relative;cursor:default;background:var(--or-light);transition:box-shadow .2s,transform .25s}
.real-card.is-auto{aspect-ratio:auto;height:auto}
.real-card:hover{box-shadow:0 12px 40px rgba(40,30,15,.18);transform:translateY(-2px)}
.real-card .real-photo{width:100%;height:100%;display:block;background:#241d16}
.real-card .real-photo[data-fit="cover"]{object-fit:cover}
.real-card .real-photo[data-fit="contain"]{object-fit:contain}
.real-card.is-auto .real-photo{height:auto}
/* Ancienne règle conservée pour compat (si ailleurs des img sont insérées) */
.real-card img{display:block}
/* Bouton plein écran */
.real-zoom{position:absolute;top:10px;right:10px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);color:#fff;border:0.5px solid rgba(255,255,255,.25);border-radius:50%;cursor:pointer;z-index:6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:all .15s;padding:0;font-family:inherit}
.real-zoom:hover{background:var(--or);border-color:var(--or);transform:scale(1.08)}
.real-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:.25}
.real-overlay{position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(26,20,10,.7));display:flex;align-items:flex-end;padding:1rem}
.real-label{color:#fff;font-size:.8rem;font-weight:500}
.real-ville{font-size:.68rem;color:rgba(255,255,255,.75);margin-top:2px}

/* ══ AVIS ══ */
.avis-header{text-align:center;margin-bottom:2rem}
.avis-google{display:inline-flex;align-items:center;gap:.75rem;background:var(--blanc);border:0.5px solid var(--border);border-radius:30px;padding:.45rem 1.4rem;margin-top:.75rem}
.avis-etoiles{color:#FBBC05;font-size:.9rem;letter-spacing:1px}
.avis-note{font-size:.78rem;color:var(--muted)}
.avis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.avis-card{background:var(--blanc);border:0.5px solid var(--border);border-radius:12px;padding:1.25rem}
.avis-stars{color:#FBBC05;font-size:.85rem;margin-bottom:.5rem;letter-spacing:1px}
.avis-texte{font-size:.8rem;color:var(--muted);line-height:1.65;margin-bottom:.75rem;font-style:italic}
.avis-auteur{font-size:.75rem;font-weight:500;color:var(--texte)}
.avis-ville{font-size:.68rem;color:var(--muted)}

/* ══ ENCART SOCIÉTÉ ══ */
.societe-encart{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
/* Variante centrée (sans photo) — utilisée sur l'accueil */
.societe-encart-centre{max-width:780px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.societe-encart-centre .section-label{margin-bottom:.6rem}
.societe-encart-centre .section-titre{margin-bottom:1.2rem}
.encart-soc-texte{font-size:.95rem;color:var(--muted);line-height:1.85;margin-bottom:1.8rem;max-width:680px}
.soc-photo{height:280px;border-radius:14px;overflow:hidden;border:0.5px solid var(--border);background:var(--or-light);display:flex;align-items:center;justify-content:center}
.soc-photo img{width:100%;height:100%;object-fit:cover}
.soc-photo-ph{opacity:.25}

/* ══ BANDEAU DEVIS ══ */
/* Grand bandeau dernier écran : prend toute la fenêtre, centré, impactant */
.devis-band{background:var(--sombre);padding:3rem 2.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;text-align:center;min-height:60vh}
.devis-band > div{max-width:780px}
.devis-band h2{font-family:'Newsreader',serif;color:#faf6f0;font-size:2.2rem;font-weight:500;line-height:1.25;margin-bottom:.9rem}
.devis-band p{color:rgba(250,245,236,.65);font-size:1rem;line-height:1.7;max-width:680px;margin:0 auto}
.btn-or-inv{background:var(--or);color:#fff;border:none;padding:.95rem 2.4rem;font-family:'Karla',sans-serif;font-size:.95rem;font-weight:500;cursor:pointer;border-radius:7px;white-space:nowrap;transition:background .15s,transform .15s,box-shadow .15s;box-shadow:0 4px 14px rgba(181,89,47,.25)}
.btn-or-inv:hover{background:var(--or-dark);transform:translateY(-1px);box-shadow:0 6px 20px rgba(181,89,47,.4)}
@media (max-width:768px){
  .devis-band{min-height:auto;padding:2.5rem 1.5rem}
  .devis-band h2{font-size:1.6rem}
}

/* ══ PAGE PRODUIT DETAIL ══ */
.prod-detail-hero{background:var(--fond);padding:2.5rem 2.5rem 2rem;border-bottom:0.5px solid var(--border)}
.back-link{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--or);cursor:pointer;margin-bottom:1.25rem;font-weight:500}
.back-link:hover{text-decoration:underline}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;padding:2.5rem;margin-bottom:0}
.detail-grid.full-width{grid-template-columns:1fr}
.detail-grid.full-width #detail-specs{margin-top:1rem}
.detail-photo-ph{height:240px;background:var(--or-light);border-radius:10px;border:0.5px solid var(--border);display:flex;align-items:center;justify-content:center;opacity:.3}
/* Carrousel produit */
.prod-carousel{display:flex;flex-direction:column;gap:.5rem}
.prod-carousel-main{position:relative;width:100%;height:340px;border-radius:10px;overflow:hidden;border:0.5px solid var(--border);background:var(--fond)}
.prod-carousel-main img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .15s}
.prod-carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.92);border:0.5px solid var(--border);width:38px;height:38px;border-radius:50%;font-size:1.4rem;line-height:1;cursor:pointer;color:var(--texte);display:flex;align-items:center;justify-content:center;font-family:inherit;box-shadow:0 2px 8px rgba(0,0,0,.1);transition:all .15s}
.prod-carousel-arrow:hover{background:#fff;color:var(--or);transform:translateY(-50%) scale(1.05)}
.prod-carousel-arrow.prev{left:10px}
.prod-carousel-arrow.next{right:10px}
.prod-carousel-counter{position:absolute;bottom:10px;right:10px;background:rgba(0,0,0,.55);color:#fff;font-size:.7rem;padding:3px 9px;border-radius:11px;font-weight:500;letter-spacing:.03em}
.prod-carousel-thumbs{display:flex;gap:5px;overflow-x:auto;padding-bottom:3px;scrollbar-width:thin}
.prod-carousel-thumb{flex-shrink:0;width:62px;height:48px;border-radius:6px;overflow:hidden;border:1.5px solid var(--border);padding:0;background:none;cursor:pointer;transition:all .15s}
.prod-carousel-thumb:hover{border-color:var(--or-mid)}
.prod-carousel-thumb.active{border-color:var(--or);box-shadow:0 0 0 1px var(--or)}
.prod-carousel-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.prod-carousel-caption{font-size:.85rem;color:var(--muted);line-height:1.55;padding:.6rem .2rem;font-style:italic}
/* MODE LISTE — toutes les photos l'une après l'autre */
.prod-liste{display:flex;flex-direction:column;gap:1.5rem}
.prod-liste-item{display:grid;gap:1.2rem;align-items:stretch}
.prod-liste-item.layout-img-only{grid-template-columns:1fr;align-items:start}
.prod-liste-item.layout-img-txt{grid-template-columns:1fr 1fr}
.prod-liste-item.layout-txt-img{grid-template-columns:1fr 1fr}
.prod-liste-img{width:100%;border-radius:10px;border:0.5px solid var(--border);display:block;object-fit:cover;max-height:340px}
.prod-liste-item.layout-img-only .prod-liste-img{max-height:none}
.prod-liste-col-img{min-width:0;display:flex;align-items:center}
.prod-liste-col-img img{width:100%}
.prod-liste-col-txt{min-width:0;display:flex;flex-direction:column;justify-content:center}
.prod-liste-col-txt p{font-size:.92rem;color:var(--texte);line-height:1.7;margin:0;white-space:pre-wrap}
.prod-liste-caption{font-size:.85rem;color:var(--muted);line-height:1.6;padding:.5rem .2rem 0;font-style:italic}
@media (max-width:780px){
  .prod-liste-item.layout-img-txt,
  .prod-liste-item.layout-txt-img{grid-template-columns:1fr}
}
/* Badge "+N" sur les cartes produit en accueil/liste si plusieurs photos */
.prod-card-photos-badge{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.55);color:#fff;font-size:.65rem;padding:3px 8px;border-radius:10px;font-weight:500;letter-spacing:.02em;backdrop-filter:blur(4px)}
.prod-photo{position:relative}
@media (max-width:780px){
  .prod-carousel-main{height:240px}
  .prod-carousel-thumb{width:52px;height:40px}
}
.specs-table{background:var(--blanc);border:0.5px solid var(--border);border-radius:10px;overflow:hidden}
.spec-row{display:flex;justify-content:space-between;padding:.8rem 1.1rem;border-bottom:0.5px solid var(--border);font-size:.82rem}
.spec-row:last-child{border-bottom:none}
.spec-k{color:var(--muted)}.spec-v{font-weight:500;color:var(--texte)}

/* ══ PAGE RÉALISATIONS ══ */
.real-filtres{display:flex;gap:.5rem;margin-bottom:1.75rem;flex-wrap:wrap}
.filtre-btn{padding:.4rem 1.1rem;font-size:.75rem;border-radius:20px;cursor:pointer;font-family:inherit;border:0.5px solid var(--border);background:transparent;color:#555;transition:all .15s}
.filtre-btn:hover,.filtre-btn.active{background:var(--or);color:#fff;border-color:var(--or)}

/* ══ PAGE CONTACT — ancien layout générique, plus référencé par contact.njk
   depuis le portage au nouveau design (26/09) : conservé tel quel (mort mais
   inoffensif), le formulaire/fiche/carte réels utilisent désormais les
   classes ci-dessous. ══ */
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:2.5rem;padding:2.5rem}
.contact-card{background:var(--blanc);border:0.5px solid var(--border);border-radius:14px;padding:2rem}
.contact-bloc{display:flex;gap:.9rem;margin-bottom:1.5rem;align-items:flex-start}
.contact-icone{width:40px;height:40px;background:var(--or-light);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.contact-icone svg{width:18px;height:18px;stroke:var(--or);fill:none;stroke-width:1.6;stroke-linecap:round}
.contact-lbl{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px}
.contact-val{font-size:.88rem;font-weight:500;color:var(--texte)}
.contact-map{background:var(--or-light);border:0.5px solid var(--border);border-radius:10px;height:200px;display:flex;align-items:center;justify-content:center;margin-top:1rem;font-size:.8rem;color:var(--muted)}
.contacts-grid{display:grid;gap:1.5rem;max-width:1100px;margin:0 auto;padding:0 1.5rem 2rem;justify-content:center}
.contacts-grid-1{grid-template-columns:minmax(0,480px)}
.contacts-grid-2{grid-template-columns:repeat(2,minmax(0,420px))}
.contacts-grid-auto{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
@media (max-width:760px){
  .contacts-grid-2{grid-template-columns:minmax(0,460px)}
  .contacts-grid-auto{grid-template-columns:minmax(0,460px)}
}

/* ══ PAGE CONTACT — portage nouveau design (26/09), gabarit validé sur la
   maquette « Contact » : coins arrondis asymétriques + ombre douce, cohérent
   avec les gabarits produits déjà en ligne. Classes reprises à l'identique
   du HTML réel (page-spécifiques, aucune collision : vérifié par grep). ══ */
.contact-hero{position:relative;padding:2.8rem max(1.5rem,calc((100% - 1180px)/2 + 1.5rem)) 1.6rem;overflow:hidden}
.contact-hero::before{content:"";position:absolute;top:-8rem;right:-9rem;width:26rem;height:26rem;border-radius:46% 54% 58% 42%;background:radial-gradient(circle at 35% 35%,rgba(181,89,47,.14),rgba(181,89,47,0) 68%);pointer-events:none}
.contact-hero .section-sous{position:relative}

.contact-form-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:1.75rem;align-items:start;max-width:1180px;margin:0 auto;padding:0 1.5rem}
@media (max-width:900px){.contact-form-layout{grid-template-columns:1fr;gap:1.25rem}}

.contact-card-solo{
  background:var(--blanc);
  border-radius:28px 12px 28px 12px;
  box-shadow:0 18px 44px -20px rgba(60,40,20,.28);
  padding:2rem 2.1rem;
}
.contact-form-layout .contact-card-solo{margin-bottom:1.1rem}
.contact-form-layout .contact-card-solo:last-of-type{margin-bottom:0}
@media (max-width:680px){.contact-card-solo{padding:1.5rem 1.3rem}}

.contact-infos-bloc{
  background:var(--blanc);
  border-radius:12px 28px 12px 28px;
  box-shadow:0 18px 44px -20px rgba(60,40,20,.28);
  padding:2rem 2.1rem;
  margin-bottom:1.1rem;
}
.contact-infos-bloc .cib-titre{font-family:'Newsreader',serif;font-size:1.25rem;font-weight:500;color:var(--texte);margin-bottom:1.1rem}

.contact-fiche{display:flex;gap:1rem;align-items:center;margin-bottom:1.3rem}
.contact-fiche-avatar{width:56px;height:56px;border-radius:50% 46% 50% 44%;flex-shrink:0;background:var(--or);color:#fff;display:flex;align-items:center;justify-content:center}
.contact-fiche-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.contact-fiche-avatar-vide{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-family:'Newsreader',serif;font-weight:600;font-size:1.15rem;color:#fff}
.contact-fiche-nom{font-family:'Newsreader',serif;font-size:1.02rem;font-weight:600;color:var(--texte);line-height:1.25}
.contact-fiche-role{font-size:.78rem;color:var(--muted)}
.contact-fiche-coords{display:none} /* remplacé par .contact-info-row, non utilisé sur ce gabarit */

.contact-info-row{display:flex;justify-content:space-between;gap:1rem;padding:.68rem 0;border-top:0.5px solid var(--border);font-size:.85rem}
.contact-info-row:first-of-type{border-top:none}
.contact-info-row span:first-child{color:var(--muted)}
.contact-info-row span:last-child{font-weight:500;color:var(--texte);text-align:right}
a.contact-info-val{color:var(--texte);text-decoration:none}
a.contact-info-val:hover{color:var(--or)}

.contact-villes-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.contact-villes-chips .chip{font-size:.72rem;font-weight:500;padding:.35rem .8rem;border-radius:999px;background:var(--or-light);color:var(--or-dark)}

/* ══ PÔLE SEO LOCAL — cartes solutions avec zone photo (portage nouveau
   design 26/09, gabarit validé sur la maquette « dole.html ») : demandé par
   Kévin le 25/09 sur la maquette (« plus vendeur »), même langage visuel que
   le gabarit Hub produit (.hub-cat-photo/.cat-card-photo) — classes neuves
   (.solutions-grid/.solution-card/.solution-photo), pas de réutilisation de
   .produits-grid/.prod-card : ce dernier est le composant PARTAGÉ avec la
   grille Produits de l'accueil (index.njk), qu'on ne touche pas. ══ */
.solutions-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media (max-width:900px){.solutions-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.solutions-grid{grid-template-columns:1fr}}
.solution-card{background:var(--blanc);border-radius:28px 12px 28px 12px;box-shadow:0 18px 40px -24px rgba(60,40,20,.32);overflow:hidden;display:flex;flex-direction:column}
.solution-card:nth-child(even){border-radius:12px 28px 12px 28px}
/* Cartes réellement cliquables (liens vers les fiches produit réelles,
   absents de la maquette qui ne montrait qu'un placeholder statique) :
   la maquette n'a pas prévu ce cas, on ajoute juste la décoration de lien. */
a.solution-card{text-decoration:none;color:inherit;transition:box-shadow .2s ease,transform .2s ease}
a.solution-card:hover{box-shadow:0 22px 48px -22px rgba(60,40,20,.42);transform:translateY(-2px)}
.solution-photo{aspect-ratio:4/3;background:linear-gradient(160deg,#e9dcc4 0%,#d9c6a4 55%,#c9ac7c 100%);display:flex;align-items:center;justify-content:center}
.solution-photo span{color:rgba(255,248,242,.85);font-size:.78rem;font-style:italic}
.solution-body{padding:1.1rem 1.2rem 1.3rem}
.solution-body h3{font-family:'Newsreader',serif;font-weight:500;font-size:.98rem;margin-bottom:.3rem;color:var(--texte)}
.solution-body p{color:var(--muted);font-size:.85rem;line-height:1.5}

/* ══ SECTION "NOS SITES" en bas de la page Contact ══ */
.sites-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.4rem;
  max-width:1100px;margin:0 auto;padding:0 1.5rem 2rem;
}
.site-card{
  background:var(--blanc);
  border:0.5px solid var(--border);
  border-radius:14px;
  overflow:hidden;
  text-decoration:none;color:inherit;
  display:flex;flex-direction:column;
  transition:border-color .2s,box-shadow .2s,transform .2s;
  box-shadow:0 1px 6px rgba(0,0,0,.03);
}
.site-card:hover{
  border-color:var(--or-pale);
  box-shadow:0 6px 28px rgba(0,0,0,.08);
  transform:translateY(-3px);
}
.site-card-thumb{
  width:100%;aspect-ratio:16/10;
  background:var(--or-light);overflow:hidden;
  position:relative;
}
.site-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.site-card:hover .site-card-thumb img{transform:scale(1.04)}
.site-card-thumb-empty{
  display:flex;align-items:center;justify-content:center;
  font-size:3rem;color:var(--or);
}
.site-card-body{
  padding:1.2rem 1.4rem 1.4rem;
  display:flex;flex-direction:column;flex:1;
}
.site-card-type{
  display:inline-block;width:fit-content;
  background:var(--or-pale);color:var(--or);
  padding:3px 10px;border-radius:99px;
  font-size:.62rem;font-weight:500;
  text-transform:uppercase;letter-spacing:.5px;
  margin-bottom:.6rem;
}
.site-card-nom{
  font-family:'Newsreader',serif;
  font-size:1.25rem;color:var(--texte);
  line-height:1.2;margin-bottom:3px;font-weight:500;
}
.site-card-cp{font-size:.72rem;color:var(--muted);margin-bottom:.6rem}
.site-card-desc{
  font-size:.78rem;color:var(--muted);line-height:1.55;
  margin-bottom:.8rem;flex:1;
}
.site-card-link{
  font-size:.75rem;color:var(--or);font-weight:500;
  margin-top:auto;
}

/* ══ PAGE DÉDIÉE D'UN SITE ══ */
#spage-site{padding-bottom:2rem}
.site-page-breadcrumb{padding-top:1.5rem;padding-bottom:0!important}
.site-page-back{
  display:inline-flex;align-items:center;gap:5px;
  font-size:.78rem;color:var(--muted);text-decoration:none;
  padding:6px 12px;border-radius:6px;
  transition:background .15s,color .15s;
}
.site-page-back:hover{background:var(--or-pale);color:var(--or)}
.site-page-hero{padding-top:1rem!important}
.site-page-desc{
  font-size:.95rem;line-height:1.7;color:var(--texte);
  max-width:760px;margin-top:1rem;
}
.site-page-section{padding-top:2rem;padding-bottom:2rem}
.site-page-photos{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:repeat(2, 180px);
  gap:8px;
  max-width:1100px;margin:0 auto;
  border-radius:14px;overflow:hidden;
}
.site-page-photo{
  display:block;overflow:hidden;
  position:relative;background:var(--or-light);
  transition:transform .25s;
}
.site-page-photo.main{
  grid-row:1/3;grid-column:1/2;
}
.site-page-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.site-page-photo:hover img{transform:scale(1.04)}
.site-page-photo-plus{
  display:flex;align-items:center;justify-content:center;
  background:var(--sombre);color:#fff;
  font-size:.85rem;font-weight:500;
  border-radius:0;
}
@media (max-width:780px){
  .site-page-photos{
    grid-template-columns:1fr 1fr;
    grid-template-rows:200px 100px 100px;
  }
  .site-page-photo.main{grid-row:1/2;grid-column:1/3}
}
.site-page-grid{
  display:grid;grid-template-columns:1fr 1.2fr;
  gap:2.5rem;max-width:1100px;margin:0 auto;
  align-items:start;
}
@media (max-width:880px){
  .site-page-grid{grid-template-columns:1fr;gap:1.5rem}
}
.site-page-infos{
  display:flex;flex-direction:column;gap:.9rem;
  margin-bottom:1.5rem;
}
.site-page-info-item{
  display:flex;gap:.8rem;align-items:flex-start;
}
.site-page-info-ico{
  width:36px;height:36px;border-radius:8px;
  background:var(--or-pale);
  display:flex;align-items:center;justify-content:center;
  font-size:.95rem;flex-shrink:0;
}
.site-page-info-body{flex:1;min-width:0}
.site-page-info-lbl{
  font-size:.62rem;color:var(--muted);
  text-transform:uppercase;letter-spacing:.5px;
  margin-bottom:2px;
}
.site-page-info-val{
  font-size:.85rem;color:var(--texte);font-weight:500;
  word-break:break-word;text-decoration:none;
}
a.site-page-info-val{color:var(--or)}
a.site-page-info-val:hover{text-decoration:underline}
.site-page-info-val.multi{font-weight:400;line-height:1.55}
.site-page-cta{
  display:flex;gap:.8rem;flex-wrap:wrap;
  margin-top:1.5rem;
}
.site-page-map-wrap{
  border-radius:14px;overflow:hidden;
  border:0.5px solid var(--border);
  box-shadow:0 2px 12px rgba(0,0,0,.05);
}
.site-page-map{
  width:100%;height:340px;
  background:#E5EDF2;
}
.site-page-riche{
  max-width:760px;margin:0 auto;
  font-size:.92rem;line-height:1.75;color:var(--texte);
  padding-top:2rem;padding-bottom:2rem;
}
.site-page-riche p{margin-bottom:1rem}
.site-page-riche h2,.site-page-riche h3{
  font-family:'Newsreader',serif;
  margin-top:1.5rem;margin-bottom:.7rem;color:var(--texte);
}

/* ══ PAGE SOCIÉTÉ — portage nouveau design (26/09), gabarit validé sur la
   maquette « Racine simple » (pilote notre-societe.html) : coins arrondis
   asymétriques + ombre douce, cohérent avec le reste du site. Classes
   reprises à l'identique du HTML réel (page-spécifiques, sans collision). ══ */
.soc-hero{position:relative;padding:2.8rem 0 1.2rem;overflow:hidden}
.soc-hero .section-titre{max-width:34ch}
.soc-hero-sub{font-size:1.05rem;color:var(--muted);line-height:1.7;max-width:780px;font-weight:300;position:relative}

/* Bloc 2 — grille parcours + photo */
.soc-parc-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:2.5rem;align-items:start}
.soc-parc-photo{order:-1}
.soc-para{font-size:.98rem;color:var(--muted);line-height:1.75;margin-bottom:1rem}
.soc-para:last-child{margin-bottom:0}
.soc-photo-placeholder{
  width:100%;aspect-ratio:4/5;
  background:linear-gradient(160deg,#e9dcc4 0%,#d9c6a4 55%,#c9ac7c 100%);
  border-radius:12px 32px 12px 32px;
  box-shadow:0 22px 44px -24px rgba(60,40,20,.32);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;
  color:rgba(255,248,242,.85);
  font-size:.85rem;font-style:italic;text-align:center;padding:1.2rem;
}
.soc-photo-placeholder svg{display:none}
@media (max-width:820px){
  .soc-parc-grid{grid-template-columns:1fr;gap:1.75rem}
  .soc-parc-photo{order:0;max-width:320px;margin:0 auto}
}

/* Bloc 3 — déclic */
.soc-decl-titre{max-width:780px;line-height:1.25;font-style:italic}
.soc-decl .soc-para{
  background:var(--blanc);
  border-radius:32px 12px 32px 12px;
  box-shadow:0 18px 44px -20px rgba(60,40,20,.24);
  padding:1.6rem 1.9rem;
  max-width:none;
}
.soc-decl .soc-para + .soc-para{margin-top:1rem}

/* Bloc 4 — engagements (liste verticale numérotée, même schéma que
   .process-step de la page Contact) */
.soc-eng-list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:0;
  max-width:880px;
}
.soc-eng-item{display:flex;gap:1.5rem;align-items:flex-start;padding:1.5rem 0;border-top:0.5px solid var(--border)}
.soc-eng-item:first-child{border-top:none}
.soc-eng-num{
  font-family:'Newsreader',serif;
  font-size:1.1rem;font-weight:600;
  color:#fff;background:var(--or);
  flex-shrink:0;width:2.8rem;height:2.8rem;border-radius:50% 44% 50% 44%;
  display:flex;align-items:center;justify-content:center;
}
.soc-eng-body{min-width:0}
.soc-eng-titre{
  font-family:'Newsreader',serif;font-weight:500;
  font-size:1.05rem;margin:0 0 .4rem 0;color:var(--texte);
}
.soc-eng-desc{
  font-size:.88rem;color:var(--muted);line-height:1.7;margin:0;
}
@media (max-width:600px){
  .soc-eng-item{gap:1rem;padding:1.1rem 0}
  .soc-eng-num{width:2.3rem;height:2.3rem;font-size:1rem}
}

/* ══ FORMULAIRES ══ */
.form-group{margin-bottom:.9rem}
.form-label{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:5px}
.form-ctrl{width:100%;padding:10px 13px;border:0.5px solid var(--border);border-radius:7px;font-size:.82rem;font-family:'Karla',sans-serif;background:var(--fond);color:var(--texte);transition:border-color .15s}
.form-ctrl:focus{outline:none;border-color:var(--or)}
textarea.form-ctrl{min-height:110px;resize:vertical}
select.form-ctrl{cursor:pointer}
.form-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-submit{width:100%;padding:.8rem;background:var(--or);color:#fff;border:none;font-family:'Karla',sans-serif;font-size:.85rem;font-weight:500;cursor:pointer;border-radius:7px}
.form-submit:hover{background:var(--or-dark)}
.form-titre{font-family:'Newsreader',serif;font-size:1.2rem;margin-bottom:1.25rem}
.form-help{font-size:.66rem;color:var(--muted);margin:0 0 .5rem 0;line-height:1.45}
/* Astérisque pour champ obligatoire */
.form-req{color:#B85C3F;font-weight:500;margin-left:1px}
/* Bloc visuel "moyens de contact" : groupe tél+email avec liseré or
   pour signaler que c'est un sous-ensemble lié (au moins un obligatoire) */
.form-contact-bloc{
  background:var(--fond);
  border:0.5px solid var(--border);
  border-left:3px solid var(--or);
  border-radius:7px;
  padding:.85rem 1rem;
  margin-bottom:1rem;
}
.form-contact-bloc .form-help{margin-bottom:.55rem;color:var(--texte)}
.form-contact-bloc .form-help strong{color:var(--or-dark);font-weight:600}
/* Honeypot anti-bot : caché aux humains, rempli par les bots qui scannent
   tous les inputs visibles dans le DOM. On utilise plusieurs techniques
   combinées pour échapper aux détections d'accessibilité naïves. */
.hp-field{
  position:absolute !important;
  left:-9999px !important;
  top:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
/* Zone reCAPTCHA — espacement propre */
.rc-zone{margin-top:.4rem;margin-bottom:1rem;display:flex;justify-content:center}
/* Petit avis sous le widget si pas de backend */
.rc-warn{font-size:.66rem;color:var(--muted);text-align:center;margin-top:6px;line-height:1.45;font-style:italic}

/* ── Cases à cocher produits dans le formulaire devis ── */
.d-prods-checks{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:6px;
  background:var(--fond);
  border:0.5px solid var(--border);
  border-radius:7px;
  padding:.55rem;
}
.d-prod-check{
  display:flex;align-items:center;gap:.5rem;
  padding:.4rem .55rem;
  background:#fff;
  border:0.5px solid var(--border);
  border-radius:6px;
  font-size:.78rem;
  cursor:pointer;
  transition:all .12s;
  user-select:none;-webkit-user-select:none;
}
.d-prod-check:hover{border-color:var(--or-pale);background:#f8f0e6}
.d-prod-check input[type="checkbox"]{
  width:14px;height:14px;
  margin:0;
  accent-color:var(--or);
  cursor:pointer;
  flex-shrink:0;
}
.d-prod-check input[type="checkbox"]:checked + .d-prod-check-label{color:var(--or-dark);font-weight:600}
.d-prod-check:has(input:checked){border-color:var(--or);background:#f8f0e6;box-shadow:0 0 0 1px var(--or-pale)}
.d-prod-check-label{flex:1;line-height:1.3}
.d-prod-check-autre{grid-column:1/-1;background:#faf1e5;border-color:#d9b990}
.d-prod-check-autre:hover{background:#f5e8d8}

/* ── Multi-select dropdown (devis produits) ── */
.d-prods-select{
  position:relative;
  font-size:.85rem;
}
/* Bouton trigger : aspect d'un select natif */
.d-prods-trigger{
  width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.6rem .8rem;
  background:var(--fond);
  border:0.5px solid var(--border);
  border-radius:7px;
  font-size:.85rem;
  font-family:inherit;
  color:var(--texte);
  cursor:pointer;
  text-align:left;
  transition:border-color .12s, background .12s;
  min-height:38px;
}
.d-prods-trigger:hover{border-color:var(--or-pale)}
.d-prods-trigger:focus{outline:none;border-color:var(--or);box-shadow:0 0 0 1px var(--or-pale)}
.d-prods-select.open .d-prods-trigger{
  border-color:var(--or);
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:#fff;
}
.d-prods-trigger-text{
  flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.d-prods-trigger-text.is-placeholder{color:var(--muted)}
.d-prods-trigger-count{
  flex-shrink:0;
  background:var(--or);
  color:#fff;
  font-size:.65rem;font-weight:600;
  padding:2px 7px;
  border-radius:9px;
  min-width:20px;text-align:center;
}
.d-prods-trigger-arrow{
  flex-shrink:0;
  width:10px;height:10px;
  border-right:1.5px solid var(--muted);
  border-bottom:1.5px solid var(--muted);
  transform:rotate(45deg) translateY(-2px);
  transition:transform .15s;
}
.d-prods-select.open .d-prods-trigger-arrow{transform:rotate(-135deg) translateY(2px)}
/* Panneau déroulant */
.d-prods-panel{
  display:none;
  position:absolute;
  top:100%;left:0;right:0;
  background:#fff;
  border:0.5px solid var(--or);
  border-top:none;
  border-radius:0 0 7px 7px;
  box-shadow:0 6px 22px rgba(40,30,15,.13);
  z-index:5;
  max-height:280px;
  overflow-y:auto;
  padding:.45rem;
}
.d-prods-select.open .d-prods-panel{display:block}
/* Items dans le panneau (identique aux .d-prod-check mais sans grille) */
.d-prods-panel .d-prod-check{
  width:100%;
  margin:0 0 4px 0;
}
.d-prods-panel .d-prod-check:last-child{margin-bottom:0}
/* Sélections affichées sous le bouton (chips) */
.d-prods-chips{
  display:flex;flex-wrap:wrap;gap:5px;
  margin-top:.55rem;
}
.d-prods-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 4px 3px 10px;
  background:var(--or-light);
  border:0.5px solid #e6d6c4;
  border-radius:14px;
  font-size:.72rem;
  color:var(--or-dark);
  font-weight:500;
}
.d-prods-chip-x{
  width:18px;height:18px;
  display:inline-flex;align-items:center;justify-content:center;
  background:none;border:none;
  border-radius:50%;
  color:var(--or-dark);
  cursor:pointer;
  font-size:.85rem;line-height:1;
  padding:0;
  transition:background .12s;
}
.d-prods-chip-x:hover{background:rgba(181,89,47,.18)}

/* ── Zone Pièces jointes ── */
.d-pj-zone{
  display:flex;align-items:center;justify-content:center;
  padding:.7rem;
  background:var(--fond);
  border:1px dashed var(--border);
  border-radius:7px;
  transition:border-color .15s;
}
.d-pj-zone:hover{border-color:var(--or)}
.d-pj-btn{
  display:inline-flex;align-items:center;gap:.4rem;
  background:#fff;
  border:0.5px solid var(--border);
  color:var(--or-dark);
  border-radius:6px;
  padding:.5rem .9rem;
  font-size:.76rem;font-weight:500;
  font-family:inherit;
  cursor:pointer;
  transition:all .15s;
}
.d-pj-btn:hover{background:var(--or);color:#fff;border-color:var(--or)}
.d-pj-liste{margin-top:.6rem;display:flex;flex-direction:column;gap:5px}
.d-pj-item{
  display:flex;align-items:center;gap:.6rem;
  padding:.5rem .65rem;
  background:#fff;
  border:0.5px solid var(--border);
  border-radius:6px;
  font-size:.74rem;
}
.d-pj-ico{font-size:1rem;flex-shrink:0}
.d-pj-nom{flex:1;color:var(--texte);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.d-pj-size{color:var(--muted);font-size:.66rem;white-space:nowrap;flex-shrink:0}
.d-pj-rem{
  width:24px;height:24px;
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;
  border:0.5px solid var(--border);
  border-radius:50%;
  color:var(--muted);
  cursor:pointer;font-family:inherit;font-size:1rem;line-height:1;
  padding:0;
  transition:all .12s;
  flex-shrink:0;
}
.d-pj-rem:hover{background:#fbe9e9;border-color:#c84545;color:#c84545}

/* ══ PAGE PRO ══ */
.pro-features{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:2rem}
.pro-feat{background:var(--blanc);border:0.5px solid var(--border);border-radius:10px;padding:1.25rem;text-align:center}
.pro-login-card{max-width:420px;margin:0 auto;background:var(--blanc);border:0.5px solid var(--border);border-radius:14px;padding:2rem}

/* ══ FOOTER ══ */
.site-footer{background:var(--sombre);padding:3rem 2.5rem;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2rem}
.footer-logo-nom{font-family:'Newsreader',serif;color:#faf6f0;font-size:1.1rem;margin-bottom:.4rem}
.footer-logo-nom em{color:var(--or);font-style:normal}
.footer-tagline{font-size:.75rem;color:rgba(250,245,236,.55);line-height:1.6;margin-bottom:.6rem}
.footer-col h4{font-size:.65rem;text-transform:uppercase;letter-spacing:1.5px;color:rgba(250,245,236,.35);margin-bottom:.85rem}
.footer-col a,.footer-col p{display:block;font-size:.78rem;color:rgba(250,245,236,.55);margin-bottom:.4rem;text-decoration:none}
.footer-col a:hover{color:var(--or)}
.footer-col p a{display:inline;color:inherit}
.footer-col p a:hover{color:var(--or);text-decoration:underline}
.footer-bottom{background:#241d16;padding:.85rem 2.5rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem 1.25rem}
.footer-bottom p{font-size:.7rem;color:rgba(250,245,236,.45);margin:0}
.footer-bottom-links{display:flex;gap:1.25rem;flex-wrap:wrap}
.footer-bottom a{font-size:.7rem;color:rgba(250,245,236,.55);text-decoration:none}
.footer-bottom a:hover{color:var(--or)}
.footer-ver{font-size:.55rem;color:rgba(250,245,236,.15)}

@media (max-width:768px){
  .site-footer{grid-template-columns:1fr 1fr;gap:1.5rem;padding:2rem 1.5rem}
  .footer-bottom{flex-direction:column;align-items:flex-start;padding:1rem 1.5rem}
}
@media (max-width:480px){
  .site-footer{grid-template-columns:1fr}
}

/* ══ MODAL DEVIS ══ */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(26,22,18,.6);z-index:2000;align-items:center;justify-content:center}
.modal-bg.open{display:flex}
.modal{background:var(--blanc);border-radius:14px;padding:2rem;width:100%;max-width:520px;margin:1rem;position:relative;max-height:90vh;overflow-y:auto}
/* ── Modale Devis large : layout 2 colonnes ── */
.modal.modal-devis-large{max-width:920px;padding:2.2rem 2.4rem}
.modal-devis-grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);
  gap:2rem;
  margin-top:1.4rem;
  align-items:start;
}
.modal-devis-form{min-width:0}
/* Le bloc infos dans la modale : variante visuelle plus compacte que la page Contact */
.modal-devis-infos{
  position:sticky;top:0;
  padding:1.7rem 1.6rem;
  background:linear-gradient(180deg, var(--or-light) 0%, var(--blanc) 60%);
}
.modal-devis-infos .cib-titre{font-size:1.15rem}
.modal-devis-infos .cib-intro{font-size:.8rem;margin-bottom:1.2rem;padding-bottom:1rem}
@media (max-width:780px){
  .modal.modal-devis-large{max-width:520px;padding:2rem}
  .modal-devis-grid{
    grid-template-columns:1fr;
    gap:1.4rem;
  }
  /* Sur mobile, le bloc infos passe AVANT le formulaire pour mettre les coordonnées
     en évidence (l'utilisateur peut décider d'appeler plutôt que remplir) */
  .modal-devis-infos{
    order:-1;
    position:static;
    padding:1.3rem 1.2rem;
  }
}
.modal-x{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.2rem;cursor:pointer;color:var(--muted);line-height:1}
.modal-titre{font-family:'Newsreader',serif;font-size:1.4rem;color:var(--texte);margin-bottom:.25rem}
.modal-sous{font-size:.78rem;color:var(--muted);margin-bottom:1.5rem}
.modal-succes{display:none;text-align:center;padding:1.5rem 0}
.modal-succes-ico{font-size:2.5rem;margin-bottom:.75rem}
.modal-succes h3{font-family:'Newsreader',serif;font-size:1.2rem;color:var(--texte);margin-bottom:.4rem}
.modal-succes p{font-size:.82rem;color:var(--muted)}

/* ══ NOTIF ══ */
.notif{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(60px);background:var(--sombre);color:#faf6f0;padding:.9rem 1.4rem;border-radius:9px;font-size:.8rem;z-index:400;opacity:0;transition:all .3s;pointer-events:none;white-space:nowrap}
.notif.show{transform:translateX(-50%) translateY(0);opacity:1}

/* ══════════════════════════════════════════════════════════════ */
/* ══ CARTE LEAFLET — Zone d'intervention page Contact         ══ */
/* ══════════════════════════════════════════════════════════════ */
.carte-wrap{
  display:grid;grid-template-columns:1fr;gap:1.5rem;
  background:var(--blanc);
  border-radius:22px 10px 22px 10px;overflow:hidden;
  box-shadow:0 18px 44px -20px rgba(60,40,20,.28);
}
.carte-leaflet{
  width:100%;height:420px;background:#E5EDF2;
  font-family:inherit;
}
.carte-leaflet:focus{outline:2px solid var(--or);outline-offset:-2px}
/* Personnalisation Leaflet pour intégrer dans la charte */
.leaflet-popup-content-wrapper{border-radius:10px;font-family:inherit;box-shadow:0 4px 18px rgba(0,0,0,.15)}
.leaflet-popup-content{margin:.7rem .9rem;font-size:.78rem;line-height:1.5;color:var(--texte)}
.leaflet-popup-content strong{color:var(--or);font-family:'Newsreader',serif;font-size:.92rem;display:block;margin-bottom:3px}
/* Aide molette sous la carte */
.carte-aide-molette{
  display:flex;align-items:flex-start;gap:8px;
  margin:.9rem auto 0;max-width:1100px;
  padding:.7rem 1rem;background:var(--or-pale);
  border:0.5px solid var(--or-light);border-radius:8px;
  font-size:.7rem;color:var(--texte);line-height:1.55;
}
.carte-aide-molette strong{color:var(--or);font-weight:500}
.carte-aide-molette>span:first-child{font-size:1rem;flex-shrink:0;line-height:1}
.leaflet-popup-tip{background:#fff}
.leaflet-container{font-family:inherit !important}
.leaflet-control-attribution{font-size:.6rem;background:rgba(255,255,255,.85)}
.leaflet-control-zoom a{border-radius:6px !important;color:var(--texte) !important}
.leaflet-control-zoom a:hover{background:var(--or-pale) !important;color:var(--or) !important}
@media (max-width:920px){
  .carte-wrap{grid-template-columns:1fr}
  .carte-leaflet{height:380px}
}
/* ══════════════════════════════════════════════════════════════ */
/* ══ RTE CONTENT — Formatage texte riche côté visiteur        ══ */
/* ══════════════════════════════════════════════════════════════ */
/* Affichage du contenu RTE côté site public */
.rte-content strong,.rte-content b{font-weight:700}
.rte-content em,.rte-content i{font-style:italic}
.rte-content u{text-decoration:underline}
.rte-content a{color:var(--or);text-decoration:underline}
.rte-content a:hover{text-decoration:none}
.rte-content p{margin:0 0 .6rem}
.rte-content p:last-child{margin-bottom:0}

/* responsive-accueil collapse mobile */
@media (max-width:768px){
  .produits-grid,.atouts-grid,.reals-grid,.avis-grid{grid-template-columns:1fr}
  .kpis{flex-wrap:wrap}
  .kpi{flex:1 1 50%}
  .kpi:nth-child(2n){border-right:none}
}

/* responsive-contact astuce molette */
.carte-aide-molette>span:first-child{flex-shrink:1;min-width:0;font-size:inherit;line-height:inherit}
@media (max-width:768px){.carte-aide-molette{display:none}}

/* CTA Devis dans le drawer mobile (haut) */
.mobile-menu .mobile-menu-cta{display:block;width:calc(100% - 2.8rem);box-sizing:border-box;text-align:center;text-decoration:none;margin:1.2rem 1.4rem 1rem;padding:.9rem 1.3rem}

/* Fix : pas de soulignement sur les boutons-liens */
.nav-cta,.btn-or,.btn-or-inv{text-decoration:none}

/* Modif2 : responsive barre + lisibilite burger (scope .site-nav) */
@media (max-width:900px){
  .site-nav .nav-cta{order:2;margin-left:auto}
  .site-nav .nav-hamburger{order:3;margin-left:.75rem}
}
@media (max-width:599px){
  .site-nav .nav-cta{display:none}
}
/* Burger agrandi (resync translateY = gap+height = 6+2.5) */
.nav-hamburger{gap:6px}
.nav-hamburger span{width:28px;height:2.5px}
.nav-hamburger.open span:nth-child(1){transform:translateY(8.5px) rotate(45deg)}
.nav-hamburger.open span:nth-child(3){transform:translateY(-8.5px) rotate(-45deg)}

/* ── Breadcrumb (mutualise pages racine + fiches) ── */
.breadcrumb{padding:1.1rem 2.5rem .3rem;font-size:.78rem;color:var(--muted)}
.breadcrumb a{color:var(--muted);text-decoration:none}
.breadcrumb a:hover{color:var(--or)}
.breadcrumb .sep{margin:0 .5rem;opacity:.5}
.breadcrumb .current{color:var(--texte)}
@media (max-width:768px){.breadcrumb{padding:1rem 1.4rem .2rem}}

/* ══ FICHE PRODUIT — GABARIT "LOT 5" (portes de garage, portails, clôtures) ══
   Repris de la maquette validée par Kévin (pilote portes-garage-sectionnelle-plafond,
   v2 : icônes points clés -> cercles numérotés, zone d'intervention fusionnée au CTA). */
.prod-hero{max-width:900px;margin:0 auto;padding:2.6rem 2.5rem 1rem}
.prod-hero-label{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--or);font-weight:600;margin-bottom:.7rem;display:block}
.prod-hero h1{font-family:'Newsreader',serif;font-weight:500;font-size:2.1rem;line-height:1.25;max-width:22ch;margin-bottom:.9rem}
.prod-hero-sub{font-size:1rem;color:var(--muted);max-width:58ch;line-height:1.6;margin-bottom:1.2rem}
.prod-hero-meta{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.5rem;list-style:none}
.prod-hero-meta span{background:var(--or-pale);color:var(--or-dark);font-size:.78rem;font-weight:600;padding:.35rem .9rem;border-radius:999px}
.prod-hero-cta{display:flex;gap:.8rem;flex-wrap:wrap}

.prod-realisation{max-width:1440px;margin:0 auto;padding:0 2.5rem 3rem}
.prod-realisation-photo{position:relative;aspect-ratio:21/9;border-radius:12px 32px 12px 32px;overflow:hidden;background:linear-gradient(160deg,#e9dcc4 0%,#d9c6a4 55%,#c9ac7c 100%);display:flex;align-items:center;justify-content:center;box-shadow:0 22px 44px -24px rgba(60,40,20,.32)}
.prod-realisation-photo .ph-label{color:rgba(255,248,242,.9);font-size:.92rem;font-style:italic}
@media (max-width:640px){.prod-realisation-photo{aspect-ratio:4/3}}

.prod-points{padding:1rem 2.5rem 2.5rem}
.prod-points-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem 1.75rem}
@media (max-width:900px){.prod-points-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.prod-points-grid{grid-template-columns:1fr}}
.prod-point-num{width:40px;height:40px;border-radius:50% 44% 50% 44%;background:var(--or);color:#fff8f2;display:flex;align-items:center;justify-content:center;font-family:'Newsreader',serif;font-weight:600;font-size:1rem;margin-bottom:.9rem}
.prod-point-titre{font-size:1.02rem;font-weight:600;color:var(--texte);margin-bottom:.4rem}
.prod-point-desc{color:var(--muted);font-size:.88rem;line-height:1.5}

.prod-desc{max-width:900px;margin:0 auto;padding:1rem 2.5rem 3.5rem}
.prod-details-titre{font-family:'Newsreader',serif;font-weight:500;font-size:1.55rem;margin-bottom:1.6rem;max-width:32ch}
.prod-desc p{font-size:1rem;line-height:1.75;color:var(--texte);margin-bottom:1.1rem;max-width:70ch}
.prod-desc p:last-child{margin-bottom:0}

.prod-faq{max-width:820px;margin:0 auto;padding:1rem 2.5rem 3.5rem}
.prod-faq h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.55rem;margin-bottom:1.6rem}

.prod-cta{text-align:center;padding:3rem 2.5rem 4.2rem}
.prod-cta-inner{max-width:640px;margin:0 auto}
.prod-cta h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.75rem;margin-bottom:.8rem}
.prod-cta p{color:var(--muted);font-size:1.02rem;margin-bottom:.6rem}
.prod-cta .prod-cta-sub{color:#8a7c6c;font-size:.88rem;max-width:52ch;margin:0 auto 1.6rem}
.prod-cta .btn-or-inv{display:inline-block;margin-top:.6rem}

@media (max-width:768px){
  .prod-hero,.prod-realisation,.prod-points,.prod-desc,.prod-faq,.prod-cta{padding-left:1.4rem;padding-right:1.4rem}
}

/* ══ FICHE PRODUIT — GABARIT "ANCIENNES" (fenêtres, portes d'entrée, brise-soleil,
   pergolas, stores bannes, volets battants/roulants) ══
   Repris de la maquette validée par Kévin (fenetres-pvc.html). Préfixe "fiche2-" pour
   ne jamais entrer en collision avec les classes du gabarit "Lot 5" (.prod-*) ci-dessus,
   qui a une mise en page différente. La CTA finale réutilise .prod-cta/.prod-cta-inner/
   .prod-cta-sub car c'est littéralement le même composant partagé sur tout le site.
   FAQ unifiée sur le style +/− partagé (.faq-list/.faq-item/.faq-q/.faq-r) plutôt que
   le chevron rotatif de la maquette d'origine, pour n'avoir qu'un seul style de FAQ. */

.fiche2-hero{max-width:1180px;margin:0 auto;padding:1.1rem 2.5rem 3rem}
.fiche2-hero-label{font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--or);margin-bottom:.75rem;display:block}
.fiche2-hero h1{font-family:'Newsreader',serif;font-weight:500;font-size:2.1rem;line-height:1.25;max-width:26ch;margin-bottom:1rem}
.fiche2-hero-sub{font-size:.95rem;color:var(--muted);max-width:60ch;line-height:1.6}
.fiche2-hero-cta{margin-top:1.5rem}

.fiche2-intro{max-width:1180px;margin:0 auto;padding:0 2.5rem 3.5rem}
.fiche2-intro-inner{max-width:72ch}
.fiche2-intro p{font-size:1rem;line-height:1.75;color:var(--texte);margin-bottom:1.1rem}
.fiche2-intro p:last-child{margin-bottom:0}
.fiche2-intro p.fiche2-intro-note{font-size:.92rem;color:var(--muted);line-height:1.7}

/* Vitrine photos : slider + blocs alternés */
.fiche2-showcase{max-width:1180px;margin:0 auto;padding:0 2.5rem 4.75rem}
.fiche2-slider{position:relative;border-radius:28px 12px 28px 12px;overflow:hidden;aspect-ratio:21/9;min-height:260px;background:linear-gradient(160deg,var(--or-mid) 0%,#d9c6a4 55%,#c9ac7c 100%);box-shadow:0 24px 48px -24px rgba(60,40,20,.35)}
.fiche2-slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .5s ease}
.fiche2-slide.is-active{opacity:1}
.fiche2-slide-ph{text-align:center;font-size:.85rem;color:#5a4a2f;font-style:italic}
.fiche2-slide-prev,.fiche2-slide-next{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:999px;background:rgba(255,248,242,.88);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2}
.fiche2-slide-prev{left:16px}
.fiche2-slide-next{right:16px}
.fiche2-slide-dots{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:2}
.fiche2-slide-dot{width:8px;height:8px;border-radius:999px;background:#fff8f2;opacity:.45;cursor:pointer;border:none;padding:0}
.fiche2-slide-dot.is-active{opacity:1}

.fiche2-showcase-grid{display:flex;flex-direction:column;gap:2.5rem;margin-top:2.5rem}
.fiche2-showcase-item{display:flex;align-items:center;gap:2rem}
.fiche2-showcase-item:nth-child(even){flex-direction:row-reverse}
.fiche2-showcase-photo{flex:0 0 46%;aspect-ratio:4/3;border-radius:20px 40px 20px 40px;overflow:hidden;background:linear-gradient(155deg,#efe6d6 0%,#ddc9a8 100%);box-shadow:0 18px 36px -18px rgba(60,40,20,.3);display:flex;align-items:center;justify-content:center;position:relative}
.fiche2-showcase-item:nth-child(even) .fiche2-showcase-photo{border-radius:40px 20px 40px 20px;background:linear-gradient(155deg,#efe6d6 0%,#d6c19c 100%)}
.fiche2-showcase-tag{position:absolute;top:14px;right:14px;background:rgba(255,248,242,.85);color:var(--muted);font-size:.68rem;padding:4px 10px;border-radius:999px}
.fiche2-showcase-item:nth-child(even) .fiche2-showcase-tag{right:auto;left:14px}
.fiche2-showcase-text{flex:1}
.fiche2-showcase-text h3{font-family:'Newsreader',serif;font-weight:500;font-size:1.25rem;margin-bottom:.6rem}
.fiche2-showcase-text p{color:var(--muted);font-size:.95rem;line-height:1.6}

@media (max-width:768px){
  .fiche2-slider{aspect-ratio:4/3}
  .fiche2-showcase-item{flex-direction:column !important;align-items:flex-start;gap:1rem}
  .fiche2-showcase-photo{flex:0 0 auto;width:100%;aspect-ratio:16/10}
}

/* Encart variante premium (mixte alu, mixte bois/alu… — pages concernées seulement) */
.fiche2-premium-wrap{max-width:1180px;margin:0 auto;padding:0 2.5rem 4.75rem}
.fiche2-premium{background:linear-gradient(155deg,var(--or-pale) 0%,var(--or-mid) 100%);border-radius:40px 16px 40px 16px;padding:3.25rem 3rem}
.fiche2-premium-label{font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--or);margin-bottom:.75rem;display:block}
.fiche2-premium h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.7rem;max-width:30ch;margin-bottom:1.1rem}
.fiche2-premium h2 em{color:var(--or);font-style:italic}
.fiche2-premium-desc{color:var(--muted);font-size:.98rem;max-width:66ch;line-height:1.7;margin-bottom:1.2rem}
.fiche2-premium-cert{display:flex;align-items:center;gap:.5rem;color:var(--or-dark);font-size:.82rem;font-weight:600;margin-bottom:2rem}
.fiche2-premium-cert svg{flex-shrink:0;width:16px;height:16px}
.fiche2-premium-benefits{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.fiche2-premium-benefit{display:flex;gap:.9rem}
.fiche2-premium-benefit-icon{flex-shrink:0;width:34px;height:34px;border-radius:999px;background:rgba(181,89,47,.12);display:flex;align-items:center;justify-content:center}
.fiche2-premium-benefit strong{font-size:.95rem}
.fiche2-premium-benefit p{color:var(--muted);font-size:.9rem;line-height:1.55;margin-top:.25rem}
@media (max-width:768px){
  .fiche2-premium{padding:2rem 1.5rem}
  .fiche2-premium-benefits{grid-template-columns:1fr}
}

/* Détails techniques */
.fiche2-details{max-width:1180px;margin:0 auto;padding:0 2.5rem 4.75rem}
.fiche2-details h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.7rem;margin-bottom:2.5rem}
.fiche2-details h3{font-family:'Newsreader',serif;font-weight:500;font-size:1.05rem;margin-bottom:1.1rem;color:var(--or)}
.fiche2-details-block{margin-bottom:3.5rem}
.fiche2-details-block:last-child{margin-bottom:0}

.fiche2-tech-toggle{border:0;padding:0}
.fiche2-tech-toggle summary{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding:1.1rem 1.4rem;background:var(--blanc);border-radius:16px 4px 16px 4px;box-shadow:0 10px 24px -16px rgba(60,40,20,.25);cursor:pointer;list-style:none}
.fiche2-tech-toggle summary::-webkit-details-marker{display:none}
.fiche2-tech-toggle summary span{font-family:'Newsreader',serif;font-size:1.05rem;color:var(--or)}
.fiche2-tech-toggle summary svg{flex-shrink:0;transition:transform .25s ease}
.fiche2-tech-toggle[open] summary svg{transform:rotate(180deg)}
.fiche2-tech-intro{color:var(--muted);font-size:.85rem;line-height:1.6;margin:1rem .25rem 1.1rem}
.fiche2-tech-table{width:100%;border-collapse:collapse}
.fiche2-tech-table tr{border-bottom:1px solid rgba(43,36,29,.08)}
.fiche2-tech-table tr:last-child{border-bottom:none}
.fiche2-tech-table td{padding:.9rem .25rem;font-size:.92rem;vertical-align:top}
.fiche2-tech-table td:first-child{color:var(--muted);font-weight:600;width:38%;padding-right:1.25rem}
@media (max-width:768px){.fiche2-tech-table td:first-child{width:46%}}

.fiche2-modes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.fiche2-mode-card{background:var(--blanc);border-radius:16px 4px 16px 4px;padding:1.4rem;box-shadow:0 10px 24px -16px rgba(60,40,20,.25)}
.fiche2-mode-card:nth-child(even){border-radius:4px 16px 4px 16px}
.fiche2-mode-titre{font-family:'Newsreader',serif;font-weight:500;font-size:.95rem;color:var(--or);margin-bottom:.5rem;display:block}
.fiche2-mode-card p{color:var(--muted);font-size:.87rem;line-height:1.55}
@media (max-width:768px){.fiche2-modes-grid{grid-template-columns:1fr}}

.fiche2-options-list{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 2rem;margin-bottom:1.1rem}
.fiche2-options-list:last-child{margin-bottom:0}
.fiche2-option-item{display:flex;gap:.6rem;font-size:.92rem;line-height:1.55}
.fiche2-option-item::before{content:'—';color:var(--or);flex-shrink:0}
@media (max-width:768px){.fiche2-options-list{grid-template-columns:1fr}}

.fiche2-install-steps{display:flex;flex-direction:column}
.fiche2-install-step{display:flex;gap:1.25rem;padding:1.4rem 0;border-bottom:1px solid rgba(43,36,29,.08)}
.fiche2-install-step:last-child{border-bottom:none}
.fiche2-install-num{flex-shrink:0;width:30px;height:30px;border-radius:999px;background:var(--or);color:#fff8f2;font-size:.82rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.fiche2-install-step strong{font-size:.95rem}
.fiche2-install-step p{color:var(--muted);font-size:.9rem;line-height:1.55;margin-top:.25rem}

.fiche2-garanties-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-bottom:1.25rem}
.fiche2-garantie-card{background:var(--blanc);border-radius:16px 4px 16px 4px;padding:1.6rem 1.4rem;text-align:center;box-shadow:0 10px 24px -16px rgba(60,40,20,.25)}
.fiche2-garantie-chiffre{font-family:'Newsreader',serif;font-size:1.7rem;color:var(--or);margin-bottom:.4rem}
.fiche2-garantie-titre{font-size:.92rem;font-weight:600;margin-bottom:.3rem}
.fiche2-garantie-desc{font-size:.82rem;color:var(--muted);line-height:1.5}
.fiche2-details-note{color:var(--muted);font-size:.88rem;line-height:1.6;max-width:70ch}
.fiche2-details-block>p{font-size:.92rem;line-height:1.65;color:var(--texte);margin-bottom:1.1rem;max-width:70ch}

.fiche2-faq{max-width:820px;margin:0 auto;padding:0 2.5rem 4.75rem}
.fiche2-faq h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.7rem;margin-bottom:2rem}

@media (max-width:768px){
  .fiche2-hero,.fiche2-intro,.fiche2-showcase,.fiche2-premium-wrap,.fiche2-details,.fiche2-faq{padding-left:1.4rem;padding-right:1.4rem}
}

/* ══ HUB PRODUIT — Catégories (fenêtres, fermetures et protection solaire, portes de
   garage, portails et clôtures, portes d'entrée) ══
   Repris de la maquette validée par Kévin (pilote hub Fenêtres). Préfixe "cat-" : classes
   déjà présentes sur ces 5 fichiers réels (ancien design, style au cas par cas dans
   pageStyleBlock, supprimé au portage) — réutilisées à l'identique, aucune collision
   possible (grep confirmé : seuls ces 5 fichiers les utilisent). La grille de cartes est
   en auto-fit pour absorber sans classe supplémentaire les 5 tailles réelles (2 à 5
   cartes selon la page). La CTA finale réutilise .prod-cta/.prod-cta-inner/.prod-cta-sub,
   composant partagé sur tout le site (cf. gabarit "Lot 5" ci-dessus). Portes d'entrée
   (contenu plus riche que le pilote, validé par Kévin le 26/09) ajoute un comparatif
   matériaux (.cat-comparatif) et une FAQ (.cat-faq, réutilise .faq-list/.faq-item/.faq-q/
   .faq-r) ; sa zone d'intervention est fusionnée dans .prod-cta-sub (même traitement que
   fenetres-pvc.html v11 et le gabarit Lot 5). */

.cat-hero{max-width:900px;margin:0 auto;padding:2.6rem 2.5rem 1rem}
.cat-hero-label{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--or);font-weight:600;margin-bottom:.7rem;display:block}
.cat-hero h1{font-family:'Newsreader',serif;font-weight:500;font-size:2.1rem;line-height:1.25;max-width:26ch;margin-bottom:.9rem}
.cat-hero-sub{font-size:1rem;color:var(--muted);max-width:62ch;line-height:1.6}

.cat-cards{max-width:1180px;margin:0 auto;padding:1rem 2.5rem 3.5rem}
.cat-cards-titre{font-family:'Newsreader',serif;font-weight:500;font-size:1.6rem;line-height:1.3;max-width:34ch;margin-bottom:.5rem}
.cat-cards-sous{color:var(--muted);font-size:.95rem;max-width:56ch;margin-bottom:2rem}
.cat-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.6rem}

.cat-card{background:var(--blanc);border-radius:28px 12px 28px 12px;box-shadow:0 18px 40px -24px rgba(60,40,20,.32);padding:1.7rem 1.6rem 1.85rem;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .2s ease,box-shadow .2s ease}
.cat-card:hover{transform:translateY(-3px);box-shadow:0 22px 46px -22px rgba(60,40,20,.4)}
.cat-card:nth-child(even){border-radius:12px 28px 12px 28px}
.cat-card-photo{aspect-ratio:4/3;border-radius:18px 6px 18px 6px;overflow:hidden;background:linear-gradient(155deg,#efe6d6 0%,#d9c6a4 55%,#c9ac7c 100%);display:flex;align-items:center;justify-content:center;margin-bottom:1.3rem;box-shadow:inset 0 0 0 1px rgba(43,36,29,.06)}
.cat-card:nth-child(even) .cat-card-photo{border-radius:6px 18px 6px 18px}
.cat-card-photo-ph{color:rgba(43,36,29,.45);font-size:.8rem;font-style:italic;text-align:center;padding:0 1.2rem}
.cat-card-badge{display:inline-block;align-self:flex-start;background:var(--or-pale);color:var(--or-dark);font-size:.72rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;padding:.35rem .85rem;border-radius:999px;margin-bottom:1.1rem}
.cat-card-titre{font-family:'Newsreader',serif;font-weight:500;font-size:1.15rem;color:var(--texte);margin-bottom:.6rem}
.cat-card-desc{color:var(--muted);font-size:.9rem;line-height:1.6}
.cat-card-pour{font-size:.86rem;line-height:1.6;color:var(--texte);margin:1.1rem 0 1.3rem;padding-top:1.1rem;border-top:1px solid rgba(43,36,29,.08)}
.cat-card-pour strong{color:var(--texte)}
.cat-card-link{margin-top:auto;font-size:.88rem;font-weight:700;color:var(--or)}
.cat-card:hover .cat-card-link{text-decoration:underline}

/* Comparatif matériaux (portes d'entrée uniquement) */
.cat-comparatif{max-width:1180px;margin:0 auto;padding:1rem 2.5rem 3rem}
.cat-comparatif-titre{font-family:'Newsreader',serif;font-weight:500;font-size:1.6rem;margin-bottom:.5rem}
.cat-comparatif-sous{color:var(--muted);font-size:.95rem;margin-bottom:1.8rem}
.cat-table-wrap{overflow-x:auto;border-radius:16px;box-shadow:0 10px 24px -16px rgba(60,40,20,.25)}
.cat-table{width:100%;border-collapse:collapse;background:var(--blanc);min-width:640px}
.cat-table th,.cat-table td{padding:.9rem 1.1rem;font-size:.86rem;text-align:left;border-bottom:1px solid rgba(43,36,29,.08)}
.cat-table thead th{background:var(--or-pale);color:var(--or-dark);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em}
.cat-table td:first-child,.cat-table th:first-child{font-weight:600;color:var(--texte)}
.cat-table tbody tr:last-child td{border-bottom:none}

/* FAQ (portes d'entrée uniquement) */
.cat-faq{max-width:820px;margin:0 auto;padding:1rem 2.5rem 3.5rem}
.cat-faq-label{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--or);font-weight:600;margin-bottom:.7rem;display:block}
.cat-faq h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.55rem;margin-bottom:1.6rem}

@media (max-width:768px){
  .cat-hero,.cat-cards,.cat-comparatif,.cat-faq{padding-left:1.4rem;padding-right:1.4rem}
}

/* ══ HUB PRODUIT — Page globale (produits/index.njk) ══
   Contenu réel plus riche que la maquette pilote (5 catégories avec icône + sous-liste
   de produits + bloc de transition vers la page Contact, absents du pilote) : traitement
   propre créé pour ce contenu, validé par Kévin le 26/09 (décision : tout garder, pas de
   tri). Préfixe "hub-" déjà utilisé par ce fichier en ancien design (styles supprimés
   avec le pageStyleBlock) — aucune collision, seul ce fichier les utilise. La CTA finale
   réutilise .prod-cta/.prod-cta-inner (composant partagé). Le lien du bloc transition
   réutilise .lien-or (composant partagé, déjà utilisé ailleurs sur le site).
   Zones photo placeholder (26/09, demande de Kévin) : remplacent les icônes SVG
   décoratives d'origine, même convention que .cat-card-photo ci-dessus et que
   .prod-realisation-photo (gabarit Lot 5) — dégradé + légende, à remplacer par les
   vraies photos produit quand Kévin les fournira. */

.hub-hero{max-width:900px;margin:0 auto;padding:2.6rem 2.5rem 1rem}
.hub-hero-label{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--or);font-weight:600;margin-bottom:.7rem;display:block}
.hub-hero h1{font-family:'Newsreader',serif;font-weight:500;font-size:2.2rem;line-height:1.25;max-width:24ch;margin-bottom:.9rem}
.hub-hero-sub{font-size:1rem;color:var(--muted);max-width:62ch;line-height:1.6;margin-bottom:1.5rem}
.hub-hero-cta{display:flex;gap:.8rem;flex-wrap:wrap}

.hub-cats{max-width:1180px;margin:0 auto;padding:1rem 2.5rem 3.5rem}
.hub-cats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.8rem}
@media (max-width:640px){.hub-cats-grid{grid-template-columns:1fr}}

.hub-cat{background:var(--blanc);border-radius:20px 8px 20px 8px;box-shadow:0 14px 32px -20px rgba(60,40,20,.28);padding:1.8rem 1.7rem}
.hub-cat:nth-child(even){border-radius:8px 20px 8px 20px}
.hub-cat-photo{aspect-ratio:16/10;border-radius:16px 6px 16px 6px;overflow:hidden;background:linear-gradient(155deg,#efe6d6 0%,#d9c6a4 55%,#c9ac7c 100%);display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem;box-shadow:inset 0 0 0 1px rgba(43,36,29,.06)}
.hub-cat:nth-child(even) .hub-cat-photo{border-radius:6px 16px 6px 16px}
.hub-cat-photo-ph{color:rgba(43,36,29,.45);font-size:.82rem;font-style:italic;text-align:center;padding:0 1.2rem}
.hub-cat-titre{display:block;font-family:'Newsreader',serif;font-weight:500;font-size:1.2rem;color:var(--texte);text-decoration:none;margin-bottom:.5rem}
.hub-cat-titre:hover{color:var(--or)}
.hub-cat-desc{color:var(--muted);font-size:.9rem;line-height:1.6;margin-bottom:1rem}
.hub-cat-list{list-style:none;margin-bottom:1.2rem;padding-top:1rem;border-top:1px solid rgba(43,36,29,.08)}
.hub-cat-list li{margin-bottom:.5rem}
.hub-cat-list li:last-child{margin-bottom:0}
.hub-cat-list a{font-size:.86rem;color:var(--muted);text-decoration:none}
.hub-cat-list a:hover{color:var(--or);text-decoration:underline}
.hub-cat-link{font-size:.88rem;font-weight:700;color:var(--or);text-decoration:none}
.hub-cat-link:hover{text-decoration:underline}

.hub-transition{max-width:900px;margin:0 auto;padding:1rem 2.5rem 3.5rem;text-align:center}
.hub-transition-label{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--or);font-weight:600;margin-bottom:.7rem;display:block}
.hub-transition h2{font-family:'Newsreader',serif;font-weight:500;font-size:1.5rem;margin-bottom:.9rem}
.hub-transition p{color:var(--muted);font-size:.95rem;line-height:1.65;max-width:64ch;margin:0 auto 1.1rem}

@media (max-width:768px){
  .hub-hero,.hub-cats,.hub-transition{padding-left:1.4rem;padding-right:1.4rem}
}


/* ══ ACCUEIL — Refonte v2, fidèle à la maquette (artifact v21) — 28/09, demandé par Kévin ══
   La v1 (28/09, ci-dessus dans l'historique de ce fichier) réutilisait les composants déjà
   en prod (hub-cat, etc.) pour aller vite, mais le rendu s'éloignait trop de la maquette
   validée. Cette v2 reprend les VALEURS RÉELLES de la maquette (couleurs, rayons, tailles,
   grilles) section par section, avec le texte réel du site à la place des placeholders
   maquette. Remplace entièrement les classes .hero-photo(-…), .societe-encart-panel, .showroom-(…)
   de la v1 (mêmes noms de classes réutilisés pour le hero et l'encart société, valeurs
   mises à jour ; nouvelles classes pour KPIs, produits, promesses, showroom).
   Couleur #f1e8db (beige plus soutenu que --fond/--or-pale existants) reprise telle quelle
   de la maquette pour les bandeaux KPIs et Promesses — pas de variable existante équivalente.
   Section Zones (tags de villes) retirée du corps de la page : les mêmes 5 liens internes
   (Dole/Valdahon/Pontarlier/Vesoul/Montbéliard) existent déjà dans le footer, sur les 36
   pages (voir footer.njk) — aucune perte de maillage SEO, confirmé avant suppression.
   Tailles/couleurs d'icônes SVG ajoutées (bento-card-*-icon, showroom-photo-v2-
   mark, hero-photo-placeholder-mark svg) : absentes du premier jet de cette refonte, complétées
   pour que index.njk (v2) affiche des pictogrammes correctement dimensionnés dès l'écriture
   du HTML — même langage que .atout-icone svg déjà en prod (24px viewBox, stroke var(--or)). */

/* Hero photo plein écran — dégradé et voile alignés sur la maquette */
.hero-photo{position:relative;height:86vh;min-height:520px;overflow:hidden;display:flex;flex-direction:column;background:linear-gradient(155deg,#cdb388 0%,#a3855c 50%,#7a5f3f 100%)}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,13,8,.7) 0%,rgba(18,13,8,0) 55%);z-index:1}
.hero-photo-placeholder-mark{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:1;color:rgba(255,248,242,.7)}
.hero-photo-placeholder-mark svg{width:44px;height:44px;stroke:rgba(255,248,242,.75);fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;margin:0 auto 10px;display:block}
.hero-photo-placeholder-mark span{font-style:italic;font-size:.9rem}
.hero-photo-overlay{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:flex-end;max-width:1180px;width:100%;margin:0 auto;padding:0 2.5rem 3.5rem;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.hero-photo-tag{font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,248,242,.75);margin-bottom:14px}
.hero-photo-h1{font-family:'Newsreader',serif;font-size:2.3rem;font-weight:500;color:#fff8f2;line-height:1.25;max-width:32ch;margin-bottom:16px}
.hero-photo-h1 em{color:var(--or-light);font-style:normal}
.hero-photo-sub{font-size:1rem;line-height:1.55;max-width:42ch;color:rgba(255,248,242,.85);margin-bottom:1.8rem}
.hero-photo-btns{display:flex;gap:.75rem;flex-wrap:wrap}
@media (max-width:768px){
  .hero-photo{height:70vh;min-height:460px}
  .hero-photo-overlay{padding:0 1.4rem 2rem}
  .hero-photo-h1{font-size:1.65rem;max-width:none}
  /* repère replacé dans le flux (au-dessus du texte) : un top:% fixe chevauchait l'accroche
     sur les petits écrans (375×667, 320×568), où le hero est bloqué à sa min-height */
  .hero-photo-placeholder-mark{position:static;transform:none;margin:1.5rem auto 0}
}

/* Pastille "Photo à venir" réutilisée sur hero/produits/showroom */
.photo-venir-pill{position:absolute;background:rgba(255,248,242,.85);color:#6b5f52;font-size:.72rem;padding:5px 11px;border-radius:999px;z-index:1}

/* KPIs — bandeau icône + libellé (remplace l'ancien style "gros chiffres") */
.kpis-v2{background:#f1e8db;border-top:1px solid rgba(43,36,29,.06);border-bottom:1px solid rgba(43,36,29,.06)}
.kpis-v2-row{display:flex;align-items:center;justify-content:space-between;padding:1.9rem 2.5rem;flex-wrap:wrap;gap:1.75rem;max-width:1180px;margin:0 auto}
.kpi-v2{display:flex;align-items:center;gap:.9rem}
.kpi-v2-label{font-size:.95rem;font-weight:600;color:var(--texte)}
.kpi-v2-sep{width:1px;height:28px;background:rgba(43,36,29,.14)}
@media (max-width:768px){
  .kpis-v2-row{padding:1.6rem 1.4rem;justify-content:flex-start;gap:1.6rem}
  .kpi-v2-sep{display:none}
  .kpi-v2{width:44%}
}

/* Produits — grille mosaïque asymétrique (1 grande carte + 4 bandeaux), fidèle à la maquette */
.produits-bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:20px;max-width:1440px;margin:0 auto;padding:0}
.bento-card{position:relative;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 16px 32px -20px rgba(60,40,20,.24);transition:transform .2s ease,box-shadow .2s ease}
.bento-card:hover{transform:translateY(-3px)}
.bento-card-lg{grid-column:span 2;grid-row:span 2;border-radius:28px 12px 28px 12px;background:linear-gradient(160deg,#e9dcc4 0%,#d9c6a4 55%,#c9ac7c 100%);display:flex;flex-direction:column;justify-content:flex-end}
.bento-card-lg .photo-venir-pill{top:16px;right:16px}
.bento-card-lg-icon{flex:1;display:flex;align-items:center;justify-content:center}
.bento-card-lg-icon svg{width:64px;height:64px;stroke:#fff8f2;fill:none;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.bento-card-lg-txt{padding:26px;background:linear-gradient(0deg,rgba(36,29,22,.42) 0%,rgba(36,29,22,0) 100%)}
.bento-card-lg-txt h3{font-size:1.3rem;color:#fff8f2;font-family:'Newsreader',serif;font-weight:500}
.bento-card-lg-txt p{font-size:.9rem;margin-top:6px;color:#f0e6d8}
.bento-card-sm{grid-column:span 2;border-radius:28px 12px 28px 12px;background:linear-gradient(155deg,#efe6d6 0%,#d6c19c 100%);display:flex;align-items:center;gap:18px;padding:24px}
.bento-card-sm:nth-of-type(even){border-radius:12px 28px 12px 28px;background:linear-gradient(155deg,#efe6d6 0%,#ddc9a8 100%)}
.bento-card-sm .photo-venir-pill{top:12px;right:12px;font-size:.68rem;padding:4px 9px}
.bento-card-sm-icon{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:var(--or-light);display:flex;align-items:center;justify-content:center}
.bento-card-sm-icon svg{width:22px;height:22px;stroke:var(--or);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.bento-card-sm-titre{font-family:'Newsreader',serif;font-weight:500;font-size:1.08rem;color:var(--texte)}
.bento-card-sm-desc{font-size:.85rem;margin-top:4px;color:var(--muted)}
@media (max-width:768px){
  .produits-bento{grid-template-columns:1fr;grid-auto-rows:auto;padding:0}
  .bento-card-lg,.bento-card-sm{grid-column:auto;grid-row:auto;min-height:180px}
}

/* Encart société — panneau restylé (inchangé depuis la v1, déjà aligné sur le langage
   visuel de la maquette : mêmes rayons asymétriques 28px 12px 28px 12px que les cartes) */
.societe-encart-panel{max-width:820px;margin:0 auto;text-align:center;background:var(--blanc);border-radius:28px 12px 28px 12px;box-shadow:0 18px 40px -24px rgba(60,40,20,.28);padding:3rem 2.5rem}
.societe-encart-panel .section-label{margin-bottom:.6rem}
.societe-encart-panel .section-titre{margin-bottom:1.2rem}
@media (max-width:640px){.societe-encart-panel{padding:2rem 1.4rem}}

/* Promesses — icônes en rond sur bandeau beige, grille 2×2 (remplace les 4 cartes bordées) */
.promesses-panel{background:#f1e8db}
.promesses-grid-v2{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem 3.5rem;max-width:1180px;margin:0 auto}
.promesse-v2{display:flex;gap:1.1rem}
.promesse-v2-icone{width:46px;height:46px;border-radius:999px;background:var(--blanc);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 8px 18px -10px rgba(60,40,20,.3)}
.promesse-v2-icone svg{width:22px;height:22px;stroke:var(--or);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.promesse-v2-titre{font-size:1.12rem;margin-bottom:.4rem;font-family:'Newsreader',serif;font-weight:500;color:var(--texte)}
.promesse-v2-desc{font-size:.92rem;line-height:1.5;color:var(--muted)}
@media (max-width:640px){.promesses-grid-v2{grid-template-columns:1fr;gap:1.8rem}}

/* Showroom — grille 2 colonnes (photo / texte), remplace l'empilement centré de la v1 */
.showroom-grid-v2{display:grid;grid-template-columns:.95fr 1.05fr;gap:3.5rem;align-items:center;max-width:1180px;margin:0 auto;padding:0 2.5rem}
.showroom-photo-v2{position:relative;aspect-ratio:4/3;border-radius:12px 28px 12px 28px;overflow:hidden;background:linear-gradient(135deg,#f0e6d8 0%,#e7dac7 100%);box-shadow:0 30px 60px -25px rgba(60,40,20,.35);display:flex;align-items:center;justify-content:center}
.showroom-photo-v2 .photo-venir-pill{position:static;background:none;color:#a8998a;font-size:.85rem;padding:0}
.showroom-photo-v2-mark{text-align:center}
.showroom-photo-v2-mark svg{width:40px;height:40px;stroke:#a8998a;fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;margin:0 auto 10px;display:block}
.showroom-label-v2{font-size:.88rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.showroom-titre-v2{font-family:'Newsreader',serif;font-size:1.9rem;font-weight:500;color:var(--texte);margin-bottom:18px}
.showroom-addr-v2{display:flex;align-items:center;gap:10px;font-size:.98rem;font-weight:600;color:var(--texte)}
@media (max-width:768px){.showroom-grid-v2{grid-template-columns:1fr;gap:1.5rem;padding:0 1.4rem}}