:root{
  --blue:#0a68b5; --accent:#ff9800; --bg:#f3f5f7; --text:#1d2127; --muted:#6b7280; --card:#ffffff;
  --shadow:0 10px 30px rgba(0,0,0,.08);
}
*{box-sizing:border-box} html,body{height:100%}
html{scroll-behavior:smooth}
body{margin:0; font-family:'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
     color:var(--text); background:var(--bg); line-height:1.6}
.container{width:92%;max-width:1200px;margin:0 auto}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:600;transition:.2s}
.btn-primary{background:var(--blue);color:#fff;box-shadow:var(--shadow)}
.btn-primary:hover{transform:translateY(-2px)}
.site-header{position:fixed;inset:0 0 auto 0;height:72px;display:flex;align-items:center;z-index:1000;transition:.25s;background:white} /*j'ai remplacé transparent par white pour corrigé le bug dans les  autres menus que l'index */
.header-solid{background:#fff;box-shadow:0 6px 20px rgba(0,0,0,.06)}
.header-inner{display:flex;align-items:center;gap:16px}
.brand img{height:44px}
.nav{margin-left:auto;display:flex;align-items:center;gap:8px}
.nav a{color:#111;text-decoration:none;padding:8px 12px;border-radius:10px;font-weight:600}
.nav a:hover{background:rgba(10,104,181,.08)}
.nav .btn-primary{margin-left:6px}
.nav-toggle{display:none;background:transparent;border:0;font-size:28px;cursor:pointer}
@media (max-width:880px){
 .nav-toggle{display:block;margin-left:auto;color:#111}
 .nav{position:fixed;top:76px;right:14px;background:#fff;box-shadow:var(--shadow);border-radius:14px;padding:10px;display:none;flex-direction:column;min-width:220px}
 body.nav-open .nav{display:flex}
}
.header-spacer{height:72px}

.p_accueil{position:relative;background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.15)), url('images/hall_industriel.jpg') center/cover no-repeat;
      min-height:64vh;display:flex;align-items:center;color:#fff}
.p_accueil .inner{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
.p_accueil h1{font-size:clamp(28px,4vw,44px);line-height:1.12;margin:0 0 10px}
.p_accueil p{opacity:.95;margin:0 0 18px}

.p_irve{position:relative;background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.15)), url('images/irve.jpg') center/cover no-repeat;
      min-height:64vh;display:flex;align-items:center;color:#fff}
.p_irve .inner{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
.p_irve h1{font-size:clamp(28px,4vw,44px);line-height:1.12;margin:0 0 10px}
.p_irve p{opacity:.95;margin:0 0 18px}
@media (max-width:900px){.hero .inner{grid-template-columns:1fr}}
.section{padding:68px 0}
.section h2{color:var(--blue);margin:0 0 18px}
.lead{color:var(--muted);margin-bottom:24px}
.cards{display:grid;grid-template-columns:repeat(3, 1fr);gap:20px}
.card{background:var(--card);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;transition:transform .25s}
.card:hover{transform:translateY(-4px)}
.card img{width:100%;height:350px;object-fit:cover} /* initiallement .card img{width:100%;height:170px;object-fit:cover} */
.card .content{padding:16px}
.contact form{display:flex;flex-direction:column;gap:12px;max-width:560px;margin:0 auto}
.contact input,.contact textarea{padding:12px 14px;border-radius:12px;border:1px solid #e5e7eb;background:#fff}
.contact button{border:0;cursor:pointer}
.map h2{text-align:center}
#map{width:100%;height:460px;border-radius:16px;box-shadow:var(--shadow);background:#e5eef7}
.site-footer{background:#101318;color:#cbd5e1;padding:26px 0;text-align:center}
@media (max-width:980px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.cards{grid-template-columns:1fr}}
.reveal{opacity:1;transform:translateY(14px);transition:opacity .6s ease, transform .6s ease}
.reveal.visible{opacity:1;transform:none}
html.is-animating body{opacity:.85;transition:opacity .25s}