/* ════════════════════════════════════════════════
   ICAM — Menuiserie & Agencement
   Palette exacte brand book
   ════════════════════════════════════════════════ */
:root {
  --brun:       #2E1409;
  --brun-fonce: #1A0C05;
  --caramel:    #8B5E2A;
  --or:         #C4953A;
  --or-pale:    #E8C87A;
  --beige:      #EDE5D8;
  --creme:      #F5F0E8;
  --blanc:      #FDFAF6;
  --txt:        #6B5D52;
  --txt-leger:  #9C8E84;
  --vert:       #a6b1a1;
  --vert-clair: #d4dbd2;
  --ease:       cubic-bezier(0.22,1,0.36,1);
}

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:17px; }

body {
  font-family:'DM Sans',sans-serif;
  font-weight:400;
  background:var(--blanc);
  color:var(--brun);
  overflow-x:hidden;
  cursor:none;
}

/* ── Curseur ── */
#icam-cursor {
  width:10px; height:10px;
  background:var(--caramel);
  border-radius:50%;
  position:fixed; top:0; left:0;
  pointer-events:none;
  z-index:99999;
  transform:translate(-50%,-50%);
  transition:width .22s var(--ease),height .22s var(--ease),opacity .2s,background .2s;
  mix-blend-mode:multiply;
}
#icam-cursor.grow { width:40px; height:40px; background:var(--or); opacity:.45; }

/* ── Scroll reveal ── */
.rv  { opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
.rl  { opacity:0; transform:translateX(-32px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
.rr  { opacity:0; transform:translateX(32px);  transition:opacity .7s var(--ease),transform .7s var(--ease); }
.rv.vis,.rl.vis,.rr.vis { opacity:1; transform:none; }
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}


#urgence-bar a { color:var(--blanc); font-weight:500; text-decoration:underline; }

/* ══ NAV ══ */
nav {
  position:sticky; top:0; z-index:100;
  height:80px;
  background:rgba(253,250,246,.97);
  backdrop-filter:blur(14px) saturate(180%);
  border-bottom:1px solid rgba(139,94,42,.09);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 4%;
  transition:box-shadow .3s;
}
nav.scrolled { box-shadow:0 2px 28px rgba(46,20,9,.08); }

.nav-logo { display:flex; align-items:center; gap:11px; text-decoration:none; }
.nav-logo img { max-height:62px; width:auto; display:block; }
.nav-logo-text { font-weight:500; font-size:1.18rem; letter-spacing:.22em; color:var(--brun); line-height:1; }
.nav-logo-sub { font-size:.46rem; letter-spacing:.2em; text-transform:uppercase; color:var(--caramel); display:block; margin-top:2px; }

nav ul { list-style:none; display:flex; gap:1.8rem; align-items:center; }
nav a {
  text-decoration:none;
  font-size:.84rem; letter-spacing:.05em;
  color:var(--txt); font-weight:400;
  transition:color .2s;
  white-space:nowrap;
  position:relative;
}
nav a:hover { color:var(--caramel); }
nav a.active { color:var(--vert); }
nav a.active::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:1.5px; background:var(--vert);
}
.nav-logo.active::after { display:none!important; }
.nav-logo::after { display:none!important; }

.nav-tel {
  display:flex; align-items:center; gap:.5rem;
  font-size:.76rem; font-weight:500; color:var(--brun);
  border:1px solid rgba(139,94,42,.2);
  padding:.42rem .95rem; border-radius:2px;
  transition:all .2s; text-decoration:none;
}
.nav-tel:hover { background:var(--beige); border-color:var(--caramel); }
.nav-tel svg { color:var(--caramel); }
.nav-cta {
  background:var(--brun)!important;
  color:var(--blanc)!important;
  padding:.52rem 1.25rem!important;
  border-radius:2px; font-weight:400!important;
  letter-spacing:.06em!important;
}
.nav-cta:hover { background:var(--caramel)!important; color:var(--blanc)!important; }
.nav-cta::after { display:none!important; }

/* ══ BOUTONS GLOBAUX ══ */
.btn-p {
  display:inline-flex; align-items:center; gap:.65rem;
  background:var(--brun);
  color:var(--blanc);
  text-decoration:none;
  padding:.9rem 1.8rem;
  font-size:.76rem; letter-spacing:.12em; text-transform:uppercase;
  font-weight:400; border-radius:2px;
  transition:all .25s var(--ease);
  border:none; cursor:pointer; font-family:'DM Sans',sans-serif;
}
.btn-p:hover { background:var(--caramel); transform:translateY(-2px); box-shadow:0 8px 22px rgba(46,20,9,.2); }
.btn-p svg { transition:transform .2s; }
.btn-p:hover svg { transform:translateX(4px); }

.btn-outline {
  display:inline-flex; align-items:center; gap:.65rem;
  color:var(--brun);
  text-decoration:none;
  padding:.9rem 1.8rem;
  font-size:.76rem; letter-spacing:.12em; text-transform:uppercase;
  font-weight:400; border-radius:2px;
  border:1.5px solid var(--brun);
  transition:all .25s; cursor:pointer;
  font-family:'DM Sans',sans-serif; background:transparent;
}
.btn-outline:hover { border-color:var(--caramel); color:var(--caramel); }

/* ══ EYEBROW ══ */
.eyebrow {
  font-size:.64rem; letter-spacing:.28em; text-transform:uppercase;
  color:var(--caramel); margin-bottom:1.2rem;
  display:flex; align-items:center; gap:.8rem;
}
.eyebrow::before { content:''; display:block; width:28px; height:2px; background:var(--vert); }
.eyebrow-light { color:var(--or); }
.eyebrow-light::before { background:var(--or); }

/* ══ SECTION TITRES ══ */
.section-h2 {
  font-family:'Cormorant',serif;
  font-size:clamp(2rem,3vw,2.9rem);
  font-weight:300; line-height:1.12;
  color:var(--brun); margin-bottom:1rem;
}
.section-h2 em { font-style:italic; color:var(--caramel); }
.section-h2-light { color:var(--blanc); }
.section-h2-light em { color:var(--or-pale); }

/* ══ TRUST BAR ══ */
.trust-bar {
  background:var(--creme);
  border-top:1px solid rgba(139,94,42,.1);
  padding:1.1rem 4%;
  display:flex; align-items:center; gap:2rem; flex-wrap:wrap;
}
.trust-item { display:flex; align-items:center; gap:.55rem; font-size:.73rem; color:var(--txt); white-space:nowrap; }
.trust-item svg { color:var(--vert); opacity:1; flex-shrink:0; }
.trust-div { width:1px; height:15px; background:rgba(139,94,42,.15); }

/* ══ FOOTER ══ */
footer {
  background:var(--brun-fonce);
  padding:4rem 4% 2rem;
}
.footer-top {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:3.5rem;
  padding-bottom:2.8rem;
  border-bottom:1px solid rgba(253,250,246,.06);
  margin-bottom:1.8rem;
}
.footer-brand > p {
  font-size:.93rem; line-height:1.9;
  color:rgba(253,250,246,.32);
  max-width:280px; margin-top:1rem;
}
.footer-col h4 {
  font-size:.6rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--caramel); margin-bottom:1.1rem; font-weight:400;
}
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:.52rem; }
.footer-col a {
  text-decoration:none; font-size:.78rem;
  color:rgba(253,250,246,.42);
  transition:color .15s;
}
.footer-col a:hover { color:var(--or); }
.footer-bottom {
  display:flex; justify-content:space-between; align-items:center;
  font-size:.67rem; color:rgba(253,250,246,.18);
  flex-wrap:wrap; gap:.5rem;
}
.footer-bottom a { color:rgba(253,250,246,.18); text-decoration:none; }
.footer-bottom a:hover { color:rgba(253,250,246,.35); }

/* ══ WHATSAPP ══ */
.wa-float {
  position:fixed; bottom:2rem; right:2rem; z-index:500;
  background:#25D366; color:#fff;
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 18px rgba(37,211,102,.35);
  text-decoration:none;
  transition:all .25s var(--ease);
}
.wa-float:hover { transform:scale(1.1); box-shadow:0 6px 26px rgba(37,211,102,.45); }

/* ══ PAGE HERO (sous-pages) ══ */
.page-hero {
  background:var(--brun);
  padding:5rem 4% 4rem;
  position:relative; overflow:hidden;
}
.page-hero::after {
  content:''; position:absolute; right:-80px; bottom:-80px;
  width:300px; height:300px;
  border:1px solid rgba(196,149,58,.1);
  clip-path:polygon(50% 0%,100% 100%,0% 100%);
  pointer-events:none;
}
.page-hero-eyebrow { color:var(--or); }
.page-hero-eyebrow::before { background:var(--or); }
.page-hero h1 {
  font-family:'Cormorant',serif;
  font-size:clamp(2.5rem,4vw,4rem);
  font-weight:300; line-height:1.1;
  color:var(--blanc); margin-bottom:1rem;
}
.page-hero h1 em { font-style:italic; color:var(--or-pale); }
.page-hero p { font-size:.9rem; line-height:1.85; color:rgba(253,250,246,.72); max-width:540px; }

/* ══ RESPONSIVE ══ */
@media(max-width:1024px){
  #icam-cursor{display:none;} body{cursor:auto;}
  nav ul { display:none; }
  .nav-tel { display:none; }
  .footer-top { grid-template-columns:1fr 1fr; gap:2rem; }
}
@media(max-width:600px){
  .footer-top { grid-template-columns:1fr; }
  .trust-bar { gap:1.2rem; }
}

/* Footer mobile */
@media(max-width:768px){
  .footer-grid { grid-template-columns:1fr; gap:2.5rem; text-align:center; }
  .footer-grid > div:first-child { text-align:center; }
}
@media(max-width:480px){
  .footer-nav { flex-direction:column; gap:1rem; }
}

/* ══ TOUCHE VERT SAUGE CHARTE ICAM ══ */

/* Séparateur nav hover discret */
nav a:hover { color:var(--caramel); }
nav a.active { color:var(--caramel); }

/* Trust bar séparateur vert */
.trust-div { width:1px; height:16px; background:var(--vert-clair); }

/* Galerie : tag catégorie en vert sauge sur fond foncé */
.g-cat, .gal-cat { color:var(--vert-clair) !important; }

/* Stat numéros hero : un sur trois en vert sauge */
.hero-stats > div:nth-child(3) .stat-num { color:var(--vert-clair); }

/* Processus : ligne de connexion verte */
.process-line { background:repeating-linear-gradient(90deg,var(--vert) 0,var(--vert) 8px,transparent 8px,transparent 18px); opacity:.18; }

/* Chiffre labels soulignés en vert */
.chiffre-lab strong { color:var(--brun); border-bottom:1px solid var(--vert-clair); padding-bottom:2px; }

/* Footer : liens en vert au hover */
footer a:hover { color:var(--vert-clair) !important; }

/* Btn outline en vert sauge subtil */
.btn-outline { border-color:var(--vert-clair); color:var(--brun); }
.btn-outline:hover { border-color:var(--vert); color:var(--vert); background:transparent; }

/* Valeurs ICAM : numérotation discrète verte */
.valeur-bloc { border-top:2px solid transparent; border-left:3px solid transparent; transition:border-color .25s, border-left-color .25s; padding-left:.6rem; }
.valeur-bloc:hover { border-top-color:var(--vert); border-left-color:var(--vert); }

/* Eyebrow light en vert */
.eyebrow-light::before { background:var(--vert-clair); }

/* Trust bar fond très légèrement vert */
.trust-bar { background:var(--creme); border-top:2px solid var(--vert); border-bottom:1px solid var(--vert-clair); }

/* ══ VERT SAUGE VISIBLE — charte ICAM ══ */

/* Chiffres clés : valeurs en vert */
.chiffre-num { color:var(--vert) !important; }

/* Section processus : numéros en vert */
.p-num { color:var(--vert); border-color:var(--vert-clair); }
.p-step:hover .p-num { background:var(--vert); color:var(--blanc); border-color:var(--vert); }

/* Tags catégorie galerie en vert sauge */
.gal-cat { color:var(--vert-clair) !important; letter-spacing:.2em; }
.g-cat { color:var(--vert-clair) !important; }

/* Section valeurs : icônes et titre en vert */
.valeur-titre { color:var(--vert); font-weight:500; margin-bottom:.6rem; font-size:.72rem; letter-spacing:.18em; }

/* Chiffres section : fond vert très léger */
.chiffres-bloc { border:1.5px solid var(--vert-clair); }

/* Eyebrow light version */
.eyebrow-light { color:var(--vert-clair); }
.eyebrow-light::before { background:var(--vert-clair); width:28px; height:2px; }

/* Footer : lien email et tel en vert au hover */
footer a:hover { color:var(--vert-clair) !important; }

/* Barre de progression hero : indicateur slide vert */
.hero-dots .dot { background:var(--vert); }

/* Trust bar : fond légèrement vert */
.trust-div { background:var(--vert); opacity:.4; }

/* Contact form : focus border en vert */
.form-input:focus, .form-textarea:focus { border-color:var(--vert); outline:none; box-shadow:0 0 0 3px rgba(166,177,161,.2); }

/* Séparateur section : ligne vert */
.section-divider { width:40px; height:2px; background:var(--vert); margin:1.5rem 0; }

/* Galerie images : toujours object-fit cover sans espace */
.gal-item img, .g-item img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
}
.gal-item { min-height:220px; }
.gal-item.tall { min-height:460px; }

/* Mini photos hero : object-fit toujours */
.mini-photo img { object-fit:cover; object-position:center; }
