/* ═══════════════════════════════════════════════
   NOVELITE Group — Design System Premium v3
   Poppins | #1E71B8 · #FFD700 · #5FB776 · #5D6D7E
═══════════════════════════════════════════════ */

/* ── TOKENS ─────────────────────────────────── */
:root{
  --blue:    #1E71B8;
  --blue-dk: #155A96;
  --blue-lt: #E8F2FB;
  --gold:    #FFD700;
  --gold-dk: #E6C200;
  --gold-lt: #FFF9CC;
  --green:   #5FB776;
  --green-dk:#4A9A60;
  --green-lt:#EAFAF1;
  --white:   #FFFFFF;
  --grey:    #5D6D7E;
  --navy:    #0D1B2A;
  --navy2:   #132030;
  --off:     #F8FAFC;
  --light:   #EEF4FB;
  --border:  #DDE6F0;
  --r:       8px;
  --r-lg:    16px;
  --r-xl:    24px;
  --t:       .3s ease;
  --sh:      0 2px 16px rgba(13,27,42,.07);
  --sh-md:   0 8px 40px rgba(13,27,42,.13);
  --sh-lg:   0 20px 60px rgba(13,27,42,.2);
}

/* ── RESET ──────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Poppins',sans-serif;color:var(--navy);background:var(--white);line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}

/* ── LANGUE ─────────────────────────────────── */
html[lang="fr"] [data-lang="en"]{display:none}
html[lang="en"] [data-lang="fr"]{display:none}

/* ── LAYOUT ─────────────────────────────────── */
.container{max-width:1240px;margin:0 auto;padding:0 2rem}
.section{padding:96px 0}
.section--grey{background:var(--off)}
.section--blue{background:var(--blue);color:var(--white)}
.section--navy{background:var(--navy);color:var(--white)}
.section--light{background:var(--light)}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}

/* ── ANIMATIONS ─────────────────────────────── */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .65s ease,transform .65s ease}
.reveal.up{opacity:1;transform:translateY(0)}

/* ── SECTION HEADER ─────────────────────────── */
.section-tag{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:.7rem}
.section-head{text-align:center;max-width:680px;margin:0 auto 3.5rem}
.section-head .section-tag{display:block}
.section-title{font-size:clamp(1.7rem,3vw,2.4rem);font-weight:700;line-height:1.2;margin-bottom:.8rem;color:var(--navy)}
.section-title--w{color:var(--white)}
.section-sub{font-size:.92rem;color:var(--grey);line-height:1.85;max-width:560px}
.section-sub--w{color:rgba(255,255,255,.65)}
.section-cta{text-align:center;margin-top:3rem}

/* ── BOUTONS ────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:.45rem;padding:.78rem 1.9rem;border-radius:var(--r);font-size:.83rem;font-weight:600;letter-spacing:.02em;transition:var(--t);cursor:pointer;border:none;font-family:'Poppins',sans-serif;white-space:nowrap;text-align:center}
.btn--gold{background:var(--gold);color:var(--navy)}
.btn--gold:hover{background:var(--gold-dk);transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,215,0,.4)}
.btn--blue{background:var(--blue);color:var(--white)}
.btn--blue:hover{background:var(--blue-dk);transform:translateY(-2px);box-shadow:0 8px 24px rgba(30,113,184,.35)}
.btn--green{background:var(--green);color:var(--white)}
.btn--green:hover{background:var(--green-dk);transform:translateY(-2px)}
.btn--navy{background:var(--navy);color:var(--white)}
.btn--navy:hover{background:var(--navy2);transform:translateY(-2px)}
.btn--outline{border:2px solid var(--blue);color:var(--blue);background:transparent}
.btn--outline:hover{background:var(--blue);color:var(--white)}
.btn--outline-w{border:2px solid rgba(255,255,255,.5);color:var(--white);background:transparent}
.btn--outline-w:hover{background:var(--white);color:var(--navy)}
.btn--sm{padding:.48rem 1.1rem;font-size:.76rem}
.btn--lg{padding:1rem 2.4rem;font-size:.92rem}

/* ── NAVBAR ─────────────────────────────────── */
#navbar{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:var(--blue);
  box-shadow:0 2px 20px rgba(13,27,42,.3)
}
.nav-wrap{
  display:flex;align-items:stretch;
  max-width:1400px;margin:0 auto;min-height:62px
}
.nav-logo{
  display:flex;align-items:center;
  padding:0 1.6rem 0 1.2rem;
  background:transparent;
  flex-shrink:0;
  border-right:1px solid rgba(255,255,255,.18)
}
.nav-logo img{height:38px;width:auto;display:block}
.nav-links{
  display:flex;align-items:center;
  gap:0;padding:0 .6rem;flex:1;flex-wrap:nowrap
}
.nav-links a{
  font-size:.65rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:rgba(255,255,255,.82);transition:color .3s ease;
  padding:.35rem .55rem;border-radius:4px;white-space:nowrap
}
.nav-links a:hover{
  color:var(--white);
  background:rgba(255,255,255,.1);
  box-shadow:inset 0 -2px 0 var(--gold),0 2px 8px rgba(255,215,0,.18)
}
.nav-links a:active{
  color:var(--gold)!important;
  background:rgba(255,215,0,.12)!important;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.18),inset 0 -2px 0 var(--gold-dk)!important;
  transform:translateY(1px)
}
.nav-links a:focus,.nav-links a:focus-visible{color:rgba(255,255,255,.82);background:transparent;outline:none}
.nav-links a:visited{color:rgba(255,255,255,.82)}
.nav-links a.active{color:var(--white);font-weight:700}
#navbar,#navbar *{-webkit-tap-highlight-color:transparent}
.nav-dropdown{position:relative}
.nav-dropdown>a::after{content:' ▾';font-size:.5rem;vertical-align:middle;opacity:.65}
.nav-drop-menu{
  position:absolute;top:calc(100% + 2px);left:0;min-width:210px;
  background:var(--navy2);border-radius:0 0 var(--r) var(--r);
  box-shadow:var(--sh-md);padding:.4rem;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:var(--t);
  border-top:2px solid var(--gold)
}
.nav-dropdown:hover .nav-drop-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-drop-menu a{
  display:block;padding:.48rem .85rem;font-size:.72rem;
  color:rgba(255,255,255,.68);border-radius:4px;letter-spacing:.02em;
  white-space:nowrap
}
.nav-drop-menu a:hover{background:rgba(255,255,255,.07);color:var(--gold)}
.nav-actions{display:flex;align-items:center;gap:.45rem;padding:0 .8rem;flex-shrink:0}
.btn-devis-nav{
  background:var(--gold);color:var(--navy);
  padding:.38rem .9rem;border-radius:var(--r);
  font-size:.67rem;font-weight:700;letter-spacing:.02em;
  transition:var(--t);border:none;cursor:pointer;
  font-family:'Poppins',sans-serif;white-space:nowrap
}
.btn-devis-nav:hover{background:var(--gold-dk);box-shadow:0 4px 14px rgba(255,215,0,.35)}
.btn-partner-nav{
  border:1.5px solid rgba(255,255,255,.35);color:rgba(255,255,255,.82);
  padding:.38rem .9rem;border-radius:var(--r);
  font-size:.67rem;font-weight:700;transition:var(--t);
  background:transparent;cursor:pointer;white-space:nowrap;
  display:inline-block
}
.btn-partner-nav:hover{border-color:var(--white);color:var(--white)}
.lang-btn{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);
  color:rgba(255,255,255,.85);padding:.3rem .7rem;border-radius:50px;
  font-size:.68rem;font-weight:700;cursor:pointer;font-family:'Poppins',sans-serif;
  transition:var(--t);letter-spacing:.04em;flex-shrink:0
}
.lang-btn:hover{border-color:var(--gold);color:var(--gold)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:.4rem .5rem;flex-shrink:0}
.burger span{width:21px;height:2px;background:var(--white);border-radius:2px;display:block;transition:var(--t)}
.nav-mobile-menu{
  display:none;flex-direction:column;
  position:absolute;top:100%;left:0;right:0;
  background:var(--navy2);padding:.8rem 1.5rem 1.5rem;gap:0;
  border-top:2px solid var(--gold);box-shadow:0 8px 24px rgba(0,0,0,.3)
}
.nav-mobile-menu.open{display:flex}
.nav-mobile-menu a{
  font-size:.8rem;font-weight:600;color:rgba(255,255,255,.72);
  letter-spacing:.04em;text-transform:uppercase;
  padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.06)
}
.nav-mobile-menu a:hover{color:var(--gold)}

/* ── BOUTON FLOTTANT ─────────────────────────── */
#floatDevis{
  position:fixed;bottom:6rem;right:1.75rem;z-index:900;
  background:var(--gold);color:var(--navy);
  padding:.82rem 1.4rem;border-radius:50px;
  font-size:.8rem;font-weight:700;
  box-shadow:0 8px 30px rgba(255,215,0,.45);
  transition:var(--t);display:flex;align-items:center;gap:.45rem;
  cursor:pointer;border:none;font-family:'Poppins',sans-serif
}
#floatDevis:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(255,215,0,.55)}

/* ── HERO ───────────────────────────────────── */
#hero{min-height:100vh;position:relative;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:url('../img/hero.jpg') center/cover no-repeat}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(115deg,rgba(13,27,42,.95) 0%,rgba(13,27,42,.75) 55%,rgba(30,113,184,.45) 100%)}
.hero-content{position:relative;z-index:1;width:100%;max-width:1240px;margin:0 auto;padding:130px 2rem 90px}
.hero-badge{
  display:inline-flex;align-items:center;gap:.6rem;
  background:rgba(255,215,0,.1);border:1px solid rgba(255,215,0,.3);
  color:var(--gold);padding:.38rem 1.1rem;border-radius:50px;
  font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2rem
}
.hero-title{font-size:clamp(2.2rem,5.5vw,4.2rem);font-weight:800;color:var(--white);line-height:1.07;margin-bottom:.5rem;max-width:740px}
.hero-title em{color:var(--gold);font-style:italic}
.hero-bar{width:56px;height:3px;background:var(--gold);margin:.8rem 0 1.4rem;border-radius:2px}
.hero-sub{font-size:.98rem;color:rgba(255,255,255,.7);max-width:500px;margin-bottom:2.5rem;line-height:1.85;font-weight:300}
.hero-ctas{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:4rem}
.hero-stats{
  display:flex;gap:0;
  border-top:1px solid rgba(255,255,255,.1);padding-top:2.5rem;flex-wrap:wrap
}
.hero-stat{padding-right:2.5rem;margin-right:2.5rem;border-right:1px solid rgba(255,255,255,.1)}
.hero-stat:last-child{border:none;margin:0;padding:0}
.hero-stat-num{display:block;font-size:2.2rem;font-weight:800;color:var(--gold);line-height:1}
.hero-stat-lbl{display:block;font-size:.68rem;color:rgba(255,255,255,.5);letter-spacing:.08em;text-transform:uppercase;margin-top:.2rem}
.hero-scroll{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.35rem;
  color:rgba(255,255,255,.3);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase
}
.scroll-line{width:1px;height:38px;background:rgba(255,255,255,.18);animation:scrollA 1.6s ease-in-out infinite}
@keyframes scrollA{0%,100%{opacity:.25;transform:scaleY(1)}50%{opacity:.9;transform:scaleY(1.3)}}

/* ── BANDEAU STATS ───────────────────────────── */
.stats-band{background:var(--blue);padding:52px 0}
.stats-band-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.stats-band-item{
  text-align:center;padding:1.5rem 2rem;
  border-right:1px solid rgba(255,255,255,.15)
}
.stats-band-item:last-child{border:none}
.stats-band-icon{display:block;font-size:1.8rem;margin-bottom:.6rem}
.stats-band-num{
  font-size:2.8rem;font-weight:800;color:var(--gold);line-height:1;
  display:inline-block
}
.stats-band-plus{font-size:1.6rem;font-weight:800;color:var(--gold);vertical-align:top;margin-top:.3rem}
.stats-band-lbl{display:block;font-size:.76rem;color:rgba(255,255,255,.65);letter-spacing:.08em;text-transform:uppercase;margin-top:.4rem}

/* ── À PROPOS ────────────────────────────────── */
.about-img-wrap{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-lg);aspect-ratio:4/3;position:relative}
.about-img{width:100%;height:100%;object-fit:cover;display:block}
.about-content .section-tag{display:block;margin-bottom:.5rem}
.about-text{font-size:.9rem;color:var(--grey);line-height:1.85;margin-bottom:1rem}
.about-pills{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0 1.8rem}
.pill{padding:.35rem .95rem;border-radius:50px;font-size:.74rem;font-weight:600;background:var(--light);color:var(--navy);border:1.5px solid transparent}
.pill--blue{background:var(--blue-lt);color:var(--blue-dk);border-color:rgba(30,113,184,.2)}
.pill--green{background:var(--green-lt);color:var(--green-dk);border-color:rgba(95,183,118,.2)}
.pill--gold{background:var(--gold-lt);color:#7a5f00;border-color:rgba(255,215,0,.3)}

/* ── PÔLES ACTIVITÉS ─────────────────────────── */
.poles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.pole-card{
  border-radius:var(--r-lg);overflow:hidden;
  background:var(--white);border:1px solid var(--border);
  transition:var(--t);position:relative
}
.pole-card:hover{transform:translateY(-5px);box-shadow:var(--sh-md)}
.pole-img-wrap{position:relative;height:220px;overflow:hidden}
.pole-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.pole-card:hover .pole-img{transform:scale(1.07)}
.pole-img-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,transparent 30%,rgba(13,27,42,.65) 100%)
}
.pole-body{padding:1.4rem 1.2rem 1.6rem}
.pole-icon{font-size:1.5rem;margin-bottom:.6rem;display:block}
.pole-title{font-size:.98rem;font-weight:700;color:var(--navy);margin-bottom:.5rem}
.pole-desc{font-size:.82rem;color:var(--grey);line-height:1.65;margin-bottom:1rem}
.pole-arrow{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.78rem;font-weight:700;color:var(--blue);transition:var(--t)
}
.pole-arrow:hover{gap:.7rem;color:var(--blue-dk)}
.arrow-icon{font-size:.9rem;transition:var(--t)}

/* ── MARQUES ─────────────────────────────────── */
.brands-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.brand-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:2rem 1.6rem;
  text-align:center;transition:var(--t);position:relative;overflow:hidden
}
.brand-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--blue);transition:var(--t)
}
.brand-card:hover{transform:translateY(-5px);box-shadow:var(--sh-md)}
.brand-card:hover::before{background:var(--gold);height:4px}
.brand-icon-wrap{
  width:64px;height:64px;border-radius:var(--r);
  background:var(--light);display:flex;align-items:center;
  justify-content:center;margin:0 auto 1rem;transition:var(--t)
}
.brand-card:hover .brand-icon-wrap{background:var(--blue-lt)}
.brand-icon{font-size:1.7rem}
.brand-name{font-size:1.15rem;font-weight:800;color:var(--navy);margin-bottom:.4rem;letter-spacing:.03em}
.brand-desc{font-size:.82rem;color:var(--grey);line-height:1.65;margin-bottom:1.2rem}
.brand-link{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.78rem;font-weight:700;color:var(--blue);transition:var(--t)
}
.brand-link:hover{gap:.7rem}

/* ── PROJETS ─────────────────────────────────── */
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.proj-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden;transition:var(--t)
}
.proj-card:hover{transform:translateY(-5px);box-shadow:var(--sh-md)}
.proj-img-wrap{position:relative;height:210px;overflow:hidden}
.proj-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.proj-card:hover .proj-img{transform:scale(1.07)}
.proj-status{
  position:absolute;top:1rem;left:1rem;
  padding:.25rem .75rem;border-radius:50px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em
}
.proj-status--ongoing{background:var(--gold-lt);color:#7a5f00}
.proj-status--planned{background:var(--blue-lt);color:var(--blue-dk)}
.proj-status--done{background:var(--green-lt);color:var(--green-dk)}
.proj-body{padding:1.4rem}
.proj-category{
  display:block;font-size:.66rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:.35rem
}
.proj-title{font-size:.97rem;font-weight:700;color:var(--navy);margin-bottom:.4rem}
.proj-desc{font-size:.83rem;color:var(--grey);line-height:1.65;margin-bottom:.8rem}
.proj-link{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.78rem;font-weight:700;color:var(--blue);transition:var(--t)
}
.proj-link:hover{gap:.7rem}

/* ── RSE / SOCIAL ────────────────────────────── */
.social-text{font-size:.9rem;color:var(--grey);line-height:1.85;margin-bottom:1.5rem}
.social-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1.8rem}
.social-stat{
  background:var(--light);border:1px solid var(--border);
  border-radius:var(--r);padding:1.2rem;text-align:center
}
.social-stat-num{display:block;font-size:1.8rem;font-weight:800;color:var(--blue);line-height:1}
.social-stat-lbl{display:block;font-size:.72rem;color:var(--grey);margin-top:.3rem;line-height:1.4}
.social-img-wrap{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;background:var(--light);display:flex;align-items:center;justify-content:center}
.social-img{width:100%;height:100%;object-fit:cover;display:block}

/* ── ÉQUIPE ─────────────────────────────────── */
.team-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.2rem}
.team-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:2rem 1.2rem 1.6rem;
  text-align:center;transition:var(--t)
}
.team-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:var(--blue-lt)}
.team-avatar{
  width:88px;height:88px;border-radius:50%;margin:0 auto 1.2rem;
  overflow:hidden;border:3px solid var(--border);transition:var(--t);
  background:var(--blue);display:flex;align-items:center;justify-content:center
}
.team-card:hover .team-avatar{border-color:var(--gold);transform:scale(1.06)}
.team-avatar svg{display:block;flex-shrink:0}
.team-avatar--dg  {background:linear-gradient(145deg,#2484d0,var(--blue-dk))}
.team-avatar--dsdt{background:linear-gradient(145deg,var(--gold),var(--gold-dk))}
.team-avatar--qhse{background:linear-gradient(145deg,var(--green),var(--green-dk))}
.team-avatar--ddo {background:linear-gradient(145deg,#4a7fa8,var(--grey))}
.team-avatar--rh  {background:linear-gradient(145deg,var(--grey),var(--navy))}
/* ── Photo réelle : remplacer team-avatar--XXX par team-avatar--photo ── */
.team-avatar--photo{background:var(--border);padding:0}
.team-avatar--photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.team-name{font-size:.85rem;font-weight:700;color:var(--navy);margin-bottom:.2rem;line-height:1.3}
.team-role{
  display:block;font-size:.68rem;font-weight:700;
  color:var(--blue);letter-spacing:.04em;text-transform:uppercase;margin-bottom:.4rem
}
.team-bio{font-size:.74rem;color:var(--grey);line-height:1.5}
.team-info{margin-top:.2rem}

/* ── CTA BAND ────────────────────────────────── */
.cta-band{background:var(--blue);padding:80px 0}
.cta-band-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:2rem;flex-wrap:wrap
}
.cta-band-title{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;color:var(--white);margin-bottom:.5rem}
.cta-band-sub{font-size:.9rem;color:rgba(255,255,255,.68);max-width:480px;line-height:1.7}
.cta-band-btns{display:flex;gap:1rem;flex-wrap:wrap;flex-shrink:0}

/* ── PAGE HERO (pages internes) ─────────────── */
.page-hero{padding:140px 0 70px;background:var(--navy);position:relative;overflow:hidden}
.page-hero-bg{position:absolute;inset:0;opacity:.09}
.page-hero-bg img{width:100%;height:100%;object-fit:cover}
.page-hero-inner{position:relative;z-index:1}
.breadcrumb{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}
.breadcrumb a{font-size:.75rem;color:rgba(255,255,255,.42);transition:var(--t)}
.breadcrumb a:hover{color:var(--gold)}
.breadcrumb span{font-size:.75rem;color:rgba(255,255,255,.22)}
.page-hero-title{font-size:clamp(1.9rem,5vw,3rem);font-weight:700;color:var(--white);line-height:1.15;margin-bottom:.9rem}
.page-hero-sub{font-size:.96rem;color:rgba(255,255,255,.6);max-width:540px;line-height:1.8}

/* ── MODALE ─────────────────────────────────── */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:2000;display:none;align-items:center;justify-content:center;padding:1.5rem}
.modal.active{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);max-width:560px;width:100%;max-height:90vh;overflow-y:auto;padding:2.5rem;position:relative}
.modal-close{position:absolute;top:1.2rem;right:1.2rem;width:32px;height:32px;border:none;background:var(--off);border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;color:var(--grey);transition:var(--t)}
.modal-close:hover{background:var(--border)}
.modal-title{font-size:1.35rem;font-weight:700;margin-bottom:.3rem;color:var(--navy)}
.modal-sub{font-size:.86rem;color:var(--grey);margin-bottom:1.8rem;line-height:1.6}
.modal-ref{background:var(--light);border:1px solid var(--border);border-radius:var(--r);padding:.6rem 1rem;font-size:.82rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:.5rem}
.modal-ref strong{color:var(--blue)}

/* ── FORMULAIRES ────────────────────────────── */
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.78rem;font-weight:600;color:var(--navy);margin-bottom:.38rem}
.form-input,.form-select,.form-textarea{
  width:100%;padding:.72rem 1rem;
  border:1.5px solid var(--border);border-radius:var(--r);
  font-size:.87rem;font-family:'Poppins',sans-serif;
  color:var(--navy);transition:var(--t);background:var(--white)
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  outline:none;border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(30,113,184,.1)
}
.form-textarea{resize:vertical;min-height:110px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.file-zone{
  border:2px dashed var(--border);border-radius:var(--r);
  padding:1.2rem;text-align:center;cursor:pointer;transition:var(--t);position:relative
}
.file-zone:hover{border-color:var(--blue);background:var(--blue-lt)}
.file-zone input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.file-zone-txt{font-size:.82rem;color:var(--grey)}
.file-zone-name{font-size:.78rem;font-weight:600;color:var(--blue);margin-top:.3rem}

/* ── FOOTER PREMIUM ──────────────────────────── */
footer{background:#5D6D7E;color:var(--white);padding:64px 0 0}
.footer-top{
  display:grid;grid-template-columns:1.7fr 1fr 1fr 1.1fr;
  gap:3rem;padding-bottom:3rem;
  border-bottom:1px solid rgba(255,255,255,.18)
}
.footer-brand{}
.footer-logo{height:44px;margin-bottom:1.2rem;filter:none}
.footer-desc{font-size:.83rem;color:rgba(255,255,255,.75);line-height:1.75;max-width:280px;margin-bottom:1.4rem}
.footer-social{display:flex;gap:.55rem}
.footer-social a{
  width:34px;height:34px;border:1px solid rgba(255,255,255,.16);
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:.8rem;color:rgba(255,255,255,.5);transition:var(--t);font-style:normal
}
.footer-social a:hover{border-color:var(--gold);color:var(--gold);background:rgba(255,215,0,.08)}
.footer-col h4{
  font-size:.72rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold);margin-bottom:1.1rem
}
.footer-links{display:flex;flex-direction:column;gap:.45rem}
.footer-links a{font-size:.82rem;color:rgba(255,255,255,.5);transition:var(--t)}
.footer-links a:hover{color:var(--white)}
.footer-contact{}
.footer-contact-row{display:flex;gap:.65rem;margin-bottom:.75rem;align-items:flex-start}
.footer-contact-row .ic{color:var(--gold);flex-shrink:0;margin-top:.1rem;font-size:.9rem}
.footer-contact-row span{font-size:.82rem;color:rgba(255,255,255,.5);line-height:1.5}
.footer-bottom{
  padding:1.3rem 0;
  border-top:1px solid rgba(255,255,255,.06)
}
.footer-bottom-inner{
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:.5rem
}
.footer-copy{font-size:.74rem;color:rgba(255,255,255,.28)}
.footer-legal{display:flex;gap:1.4rem}
.footer-legal a{font-size:.74rem;color:rgba(255,255,255,.28);transition:var(--t)}
.footer-legal a:hover{color:rgba(255,255,255,.65)}

/* ── COMPAT: ancien footer-grid ─────────────── */
.footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.12)}
.footer-col-h{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:1.1rem}
.footer-list{display:flex;flex-direction:column;gap:.45rem}
.footer-list a{font-size:.82rem;color:rgba(255,255,255,.82);transition:var(--t)}
.footer-list a:hover{color:var(--gold)}
.footer-contact-item{display:flex;gap:.65rem;margin-bottom:.75rem;align-items:flex-start}
.footer-contact-item .icon{color:var(--gold);flex-shrink:0;margin-top:.1rem}
.footer-contact-item span{font-size:.82rem;color:rgba(255,255,255,.82);line-height:1.5}
.footer-bottom-bar{padding:1.3rem 0;border-top:1px solid rgba(255,255,255,.15)}
.footer-copy{font-size:.74rem;color:rgba(255,255,255,.6)}
.footer-legal a{font-size:.74rem;color:rgba(255,255,255,.6);transition:var(--t)}
.footer-legal a:hover{color:var(--white)}

/* ── VALEURS ─────────────────────────────────── */
.value-card{padding:2rem;border-radius:var(--r-lg);background:var(--white);border:1px solid var(--border);transition:var(--t)}
.value-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md)}
.value-icon{width:50px;height:50px;border-radius:var(--r);background:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:1rem}
.value-title{font-size:.93rem;font-weight:700;color:var(--navy);margin-bottom:.4rem}
.value-desc{font-size:.83rem;color:var(--grey);line-height:1.7}

/* ── POLICY / RSE / QHSE ─────────────────────── */
.policy-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:2rem;transition:var(--t)}
.policy-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:var(--green)}
.policy-icon{width:50px;height:50px;border-radius:var(--r);background:var(--green-lt);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:1rem}

/* ── PARTENARIAT ─────────────────────────────── */
.partner-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:2.2rem 1.8rem;transition:var(--t);position:relative;overflow:hidden}
.partner-card::after{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--blue);transition:var(--t)}
.partner-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.partner-card:hover::after{background:var(--gold)}
.partner-icon{width:52px;height:52px;border-radius:var(--r);background:var(--light);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1.1rem;transition:var(--t)}
.partner-card:hover .partner-icon{background:var(--gold-lt)}
.partner-title{font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:.45rem}
.partner-desc{font-size:.84rem;color:var(--grey);line-height:1.7;margin-bottom:1.1rem}

/* ── CARRIÈRES ───────────────────────────────── */
.job-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:1.7rem;transition:var(--t);display:flex;flex-direction:column}
.job-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:var(--blue-lt)}
.job-dept{display:block;font-size:.65rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:.35rem}
.job-title{font-size:.98rem;font-weight:700;color:var(--navy);margin-bottom:.55rem}
.job-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.9rem}
.job-tag{padding:.18rem .6rem;border-radius:50px;font-size:.66rem;font-weight:600;background:var(--light);color:var(--grey)}
.job-desc{font-size:.82rem;color:var(--grey);line-height:1.65;flex:1;margin-bottom:1.1rem}
.job-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);padding-top:.9rem}
.job-loc{font-size:.74rem;color:var(--grey);display:flex;align-items:center;gap:.3rem}

/* ── BADGES ──────────────────────────────────── */
.badge{display:inline-block;padding:.22rem .75rem;border-radius:50px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.badge--on,.badge--ongoing{background:var(--gold-lt);color:#7a5f00}
.badge--done{background:var(--green-lt);color:var(--green-dk)}
.badge--avail{background:var(--blue-lt);color:var(--blue-dk)}

/* ── DIVIDER ─────────────────────────────────── */
.divider{width:44px;height:3px;border-radius:2px;background:var(--gold);margin:.8rem 0 1.8rem}
.divider--green{background:var(--green)}
.divider--blue{background:var(--blue)}
.divider--center{margin-left:auto;margin-right:auto}

/* ── RESPONSIVE ─────────────────────────────── */
@media(max-width:1140px){
  .nav-links{gap:.1rem}
  .nav-links a{font-size:.68rem;padding:.38rem .55rem}
  .team-grid{grid-template-columns:repeat(3,1fr)}
  .poles-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid,.footer-top{grid-template-columns:1fr 1fr;gap:2rem}
}
@media(max-width:900px){
  .grid-2{grid-template-columns:1fr;gap:2.5rem}
  .grid-3{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .brands-grid{grid-template-columns:1fr 1fr}
  .proj-grid{grid-template-columns:1fr 1fr}
  .nav-links,.btn-devis-nav,.btn-partner-nav{display:none}
  .nav-actions .lang-btn{display:inline-block}
  .burger{display:flex}
  .stats-band-grid{grid-template-columns:1fr}
  .stats-band-item{border-right:none;border-bottom:1px solid rgba(255,255,255,.15)}
  .stats-band-item:last-child{border:none}
  .cta-band-inner{flex-direction:column;text-align:center}
  .cta-band-btns{justify-content:center}
  .team-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .section{padding:60px 0}
  .grid-3{grid-template-columns:1fr}
  .grid-4{grid-template-columns:1fr}
  .brands-grid{grid-template-columns:1fr 1fr}
  .proj-grid{grid-template-columns:1fr}
  .poles-grid{grid-template-columns:1fr}
  .footer-grid,.footer-top{grid-template-columns:1fr}
  .footer-bottom-inner{flex-direction:column;text-align:center}
  .footer-legal{justify-content:center}
  .hero-stats{flex-direction:column;gap:1.2rem}
  .hero-stat{border:none;margin:0;padding:0}
  #floatDevis .lbl{display:none}
  #floatDevis{padding:.85rem;border-radius:50%;width:52px;height:52px;justify-content:center;bottom:5rem;right:1rem}
  .form-row{grid-template-columns:1fr}
  .team-grid{grid-template-columns:repeat(2,1fr)}
}

/* ── ALIASES PAGES INTERNES (sec, eyebrow, etc.) ── */
.sec{padding:96px 0}
.sec--light{background:var(--light)}
.sec--off{background:var(--off)}
.sec--blue{background:var(--blue);color:var(--white)}
.sec--dark{background:var(--navy);color:var(--white)}
.sec-title{font-size:clamp(1.7rem,3vw,2.4rem);font-weight:700;line-height:1.2;margin-bottom:.8rem;color:var(--navy)}
.sec-title--w{color:var(--white)}
.sec-sub{font-size:.92rem;color:var(--grey);line-height:1.85;max-width:560px}
.sec-sub--w{color:rgba(255,255,255,.65)}
.eyebrow{font-size:.68rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:.7rem;display:block}
.eyebrow--green{color:var(--green-dk)}
.eyebrow--blue{color:var(--blue)}
.eyebrow--w{color:rgba(255,215,0,.9)}

/* ── RSE / QHSE — blocs de mise en avant ── */
.rse-box{background:var(--white);border:1.5px solid var(--green);border-radius:var(--r-lg);padding:1.5rem;margin-top:1.8rem}
.rse-box-header{display:flex;align-items:center;gap:.8rem;margin-bottom:.8rem}
.rse-box-icon{width:40px;height:40px;border-radius:var(--r);background:var(--green-lt);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}
.rse-box-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--green-dk);display:block}
.rse-box-name{font-size:.9rem;font-weight:700;color:var(--navy)}
.qhse-box{background:var(--blue-lt);border:1.5px solid var(--blue);border-radius:var(--r-lg);padding:1.5rem;margin-top:1.8rem}
.qhse-box-header{display:flex;align-items:center;gap:.8rem;margin-bottom:.6rem}
.qhse-box-icon{width:38px;height:38px;border-radius:var(--r);background:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}

/* ── RESPONSIVE pages internes ── */
@media(max-width:900px){
  .sec{padding:60px 0}
}
@media(max-width:600px){
  .sec{padding:50px 0}
  .sec-title{font-size:1.5rem}
}

/* ══════════════════════════════════════════════════════════
   AJOUTS MAI 2026 — WhatsApp · Cookie Banner · Lazy
══════════════════════════════════════════════════════════ */

/* ── BOUTON WHATSAPP FLOTTANT ──────────────────────────── */
.wa-btn{
  position:fixed;bottom:28px;right:28px;z-index:9000;
  display:flex;align-items:center;justify-content:center;
  width:56px;height:56px;border-radius:50%;
  background:#25D366;color:#fff;
  box-shadow:0 4px 20px rgba(37,211,102,.45);
  text-decoration:none;font-size:1.6rem;
  transition:transform .25s ease,box-shadow .25s ease;
}
.wa-btn:hover{transform:scale(1.1);box-shadow:0 6px 28px rgba(37,211,102,.6)}
.wa-btn svg{width:30px;height:30px;fill:#fff}
@media(max-width:600px){
  .wa-btn{bottom:18px;right:16px;width:48px;height:48px}
  .wa-btn svg{width:26px;height:26px}
}

/* ── BANNIÈRE COOKIE ───────────────────────────────────── */
#cookie-banner{
  position:fixed;bottom:0;left:0;right:0;z-index:9999;
  background:var(--navy);color:#fff;
  padding:16px 24px;
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;
  font-size:.85rem;line-height:1.5;
  box-shadow:0 -4px 24px rgba(13,27,42,.3);
  transform:translateY(0);
  transition:transform .4s ease;
}
#cookie-banner.hidden{transform:translateY(110%)}
#cookie-banner a{color:var(--gold);text-decoration:underline}
.cookie-actions{display:flex;gap:10px;flex-shrink:0}
.cookie-btn{
  padding:8px 20px;border-radius:var(--r);font-size:.82rem;font-weight:600;
  border:none;cursor:pointer;transition:opacity .2s;
}
.cookie-btn--accept{background:var(--blue);color:#fff}
.cookie-btn--reject{background:transparent;color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.3)}
.cookie-btn:hover{opacity:.85}
@media(max-width:600px){
  #cookie-banner{padding:14px 16px;flex-direction:column;align-items:flex-start}
  .cookie-actions{width:100%;justify-content:flex-end}
}

/* ── LAZY LOADING (fade-in image) ──────────────────────── */
img[loading="lazy"]{opacity:0;transition:opacity .5s ease}
img[loading="lazy"].loaded{opacity:1}

/* ── TEAM AVATAR PHOTO (pour remplacement futur) ─────── */
.team-avatar--photo{background:var(--border);padding:0}
.team-avatar--photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}

/* ── GRILLES RESPONSIVE ADDITIONNELLES ─────────────────── */
/* Remplacent les inline style="display:grid;grid-template-columns:..." */
.grid-r4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.grid-r3{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
/* Layout 2 colonnes formulaire + infos (contact.html) */
.contact-layout{display:grid;grid-template-columns:1fr 420px;gap:4rem;align-items:start}

@media(max-width:900px){
  .grid-r4{grid-template-columns:repeat(2,1fr)}
  .grid-r3{grid-template-columns:repeat(2,1fr)}
  .contact-layout{grid-template-columns:1fr;gap:2.5rem}
}
@media(max-width:600px){
  .grid-r4,.grid-r3{grid-template-columns:1fr}
  /* Réduction padding container sur très petit écran */
  .container{padding:0 1rem}
  /* Hero padding-top adapté à la navbar fixe */
  .hero-content{padding:100px 1rem 60px}
  /* Modale plein écran avec scroll */
  .modal{padding:.5rem}
  .modal-box{padding:1.4rem;border-radius:var(--r-lg);max-height:95vh}
  /* Boutons hero en colonne si trop serrés */
  .hero-ctas{flex-direction:column;align-items:flex-start}
  .hero-ctas .btn{width:100%;justify-content:center}
  /* CTA band boutons en colonne */
  .cta-band-btns{flex-direction:column;width:100%}
  .cta-band-btns .btn{width:100%;justify-content:center}
  /* Page hero padding mobile */
  .page-hero{padding:110px 0 48px}
  /* Sections internes */
  .sec{padding:48px 0}
}

/* ── ANTI-DÉBORDEMENT HORIZONTAL GLOBAL ─────────────────── */
html,body{max-width:100%;overflow-x:hidden}
/* Tout élément inline trop large se wrap plutôt que déborder */
p,li,span,label{word-break:break-word;overflow-wrap:break-word}