
    /* ===== Palette issue des affiches ===== */
    :root{
      --primary:#E36830;      /* orange affiche */
      --primary-600:#C55522;
      --secondary:#248756;    /* vert affiche (plus vif) */
      --secondary-600:#1E724A;/* vert foncé affiche */
      --cream:#F3F2ED;        /* fond crème affiche */
      --beige:#EBD1A8;        /* touches beige affiche */
      --dark:#1B1410;         /* brun très foncé affiche (texte) */
      --muted:#6A6158;        /* gris/brun doux */
      --bg:#F3F2ED;           /* fond de page */
      --card:#FFFFFF;         /* cartes claires */
      --ring:rgba(227,104,48,.25); /* focus orange */
    }

    html,body{height:100%}
    body{
      font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
      background:
        radial-gradient(1200px 700px at 85% -10%, rgba(227,104,48,.08) 0%, transparent 60%),
        radial-gradient(800px 500px at -10% 10%, rgba(36,135,86,.08) 0%, transparent 70%),
        var(--bg);
      color:var(--dark);
    }

    /* ===== Header / Nav ===== */
    .navbar{
      background: rgba(255,255,255,.85);
      backdrop-filter:saturate(140%) blur(10px);
      border-bottom:1px solid rgba(27,20,16,.08);
    }
    .navbar .nav-link{ color:#2E2A26; font-weight:600 }
    .navbar .nav-link:hover{ color:var(--primary) }

    .brand-badge{
      display:inline-flex;align-items:center;gap:.55rem;
      font-weight:800;letter-spacing:.2px;color:var(--dark);
    }
    .brand-dot{
      width:10px;height:10px;border-radius:999px;
      background:linear-gradient(135deg,var(--secondary),var(--primary));
      box-shadow:0 0 0 6px rgba(36,135,86,.18)
    }

    /* ===== Hero ===== */
    .hero{
      position:relative;overflow:hidden;
      padding: 6rem 0 4rem;
      background:
        radial-gradient(900px 300px at 10% 10%, rgba(36,135,86,.12), transparent 60%),
        radial-gradient(1000px 360px at 90% 15%, rgba(227,104,48,.10), transparent 60%),
        linear-gradient(0deg, #FFFFFF, #FFFFFF00 60%),
        var(--cream);
    }
    .headline{
      font-size:clamp(1.8rem,4vw,3rem);
      font-weight:800;
      line-height:1.1;
      color:#1A1714;
      text-shadow:0 4px 20px rgba(227,104,48,.08);
    }
    .headline .accent-o{ color:var(--primary) }
    .headline .accent-g{ color:var(--secondary-600) }
    .subhead{ color:#4B453F; font-size:clamp(1rem,2vw,1.125rem)}

    .hero-card{
      background:linear-gradient(180deg, #FFFFFF, #FFFDF9);
      border:1px solid rgba(27,20,16,.08);
      box-shadow:0 15px 40px rgba(27,20,16,.08);
      border-radius:22px;
    }

    /* ===== Boutons ===== */
    .btn-primary{
      --bs-btn-bg:var(--primary);
      --bs-btn-border-color:var(--primary);
      --bs-btn-hover-bg:var(--primary-600);
      --bs-btn-hover-border-color:var(--primary-600);
      --bs-btn-color:#fff;
      --bs-btn-focus-shadow-rgb:227, 104, 48;
    }
    .btn-success{
      --bs-btn-bg:var(--secondary);
      --bs-btn-border-color:var(--secondary);
      --bs-btn-hover-bg:var(--secondary-600);
      --bs-btn-hover-border-color:var(--secondary-600);
      --bs-btn-color:#fff;
    }
    .btn-outline-dark{
      --bs-btn-color:#2E2A26;
      --bs-btn-border-color:#CAB9A1;
      --bs-btn-hover-bg:#F7F1E4;
      --bs-btn-hover-border-color:#BFAE95;
    }

    .badge-ben{
      background:linear-gradient(90deg,#0f9d58,#f4b400,#db4437);
      color:#0b1220;font-weight:800
    }

    /* ===== Cards / Features ===== */
    .feature{
      background:linear-gradient(180deg, #FFFFFF, #FFFDF8);
      border:1px solid rgba(27,20,16,.08);
      border-radius:16px;
      height:100%;
      transition:.2s transform ease,.2s box-shadow ease;
    }
    .feature:hover{transform:translateY(-4px); box-shadow:0 12px 30px rgba(27,20,16,.10)}
    .feature .icon{
      width:52px;height:52px;border-radius:12px;display:grid;place-items:center;font-size:1.25rem;
      background: radial-gradient(circle at 30% 20%, rgba(36,135,86,.10), rgba(227,104,48,.08));
      border:1px solid rgba(27,20,16,.10); color:var(--secondary-600);
    }

    /* ===== Steps ===== */
    .step{display:flex;gap:14px;align-items:flex-start}
    .step .num{
      width:36px;height:36px;border-radius:10px;
      background:linear-gradient(135deg,var(--secondary),var(--primary));
      color:#fff;display:grid;place-items:center;font-weight:800
    }

    /* ===== Pricing ===== */
    .price-card{
      background:linear-gradient(180deg, #FFFFFF, #FFFDF9);
      border:1px solid rgba(27,20,16,.10);
      border-radius:18px;
      box-shadow:0 10px 30px rgba(27,20,16,.08);
      height:100%;
    }
    .price-card.pop{
      outline:2px solid var(--ring);
      box-shadow:0 18px 50px rgba(227,104,48,.12);
    }
    .price-title{font-weight:800;color:#2B2723}
    .list-checked i{color:var(--secondary-600)}

    /* ===== Cities strip ===== */
    .cities{display:flex;flex-wrap:wrap;gap:.5rem}
    .cities .chip{
      padding:.35rem .7rem;border-radius:9999px;border:1px dashed rgba(27,20,16,.25);
      color:#3A342E;font-weight:600;background:#FFF9F1
    }

    /* ===== Footer ===== */
    footer{
      border-top:1px solid rgba(27,20,16,.08);
      background:linear-gradient(0deg,#FFFFFF, #FFF6EA);
    }
    a{color:#1F6D47;text-decoration:none}
    a:hover{color:#27935C}

    /* ===== Formulaires ===== */
    .form-control, .form-select{
      background:#FFFFFF;border:1px solid rgba(27,20,16,.15);color:#2E2A26
    }
    .form-control:focus, .form-select:focus{
      border-color:var(--primary); box-shadow: 0 0 0 .25rem var(--ring)
    }

    .divider{height:1px;background:linear-gradient(90deg, transparent, rgba(27,20,16,.15), transparent)}

    /* ===== WhatsApp Floating ===== */
    .whatsapp{
      position:fixed;right:18px;bottom:18px;z-index:60;
      background:#25D366;border-radius:999px;color:white;padding:.85rem 1rem;
      box-shadow:0 8px 24px rgba(27,20,16,.20);text-decoration:none;font-weight:700
    }
    .whatsapp:hover{opacity:.9;color:white}

    .flag{font-size:1.25rem}


    .login-wrap{min-height:100vh;display:grid;place-items:center;padding:2rem}
    .login-card{max-width:440px;width:100%}
    .brand{font-weight:800;letter-spacing:.2px;color:var(--dark)}
    .brand .dot{width:10px;height:10px;border-radius:9999px;display:inline-block;margin-right:.5rem;background:linear-gradient(135deg,var(--secondary),var(--primary))}
 
 /* ===== Footer (refonte) ===== */
.site-footer{
  background:
    radial-gradient(900px 300px at 15% 20%, rgba(36,135,86,.10), transparent 60%),
    radial-gradient(1000px 360px at 85% 0%, rgba(227,104,48,.08), transparent 60%),
    linear-gradient(0deg,#FFFFFF,#FFF6EA);
  border-top:4px solid var(--primary);
  color:#2B2723;
}
.site-footer .accent-bar{
  height:6px;
  background:linear-gradient(90deg,var(--secondary),var(--primary));
  border-radius:9999px;
  opacity:.9;
}
.footer-title{
  font-weight:800;
  letter-spacing:.2px;
  color:#1B1410;
}
.footer-text{ color:#4B453F }
.footer-logo{ display:flex; align-items:center; gap:.6rem }
.footer-logo img{ height:54px }
.footer-badge{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.35rem .6rem; border-radius:999px;
  background:#FFF7E6; border:1px solid #EED2A4; color:#8B5A12; font-weight:700;
}
.footer-links a{
  display:block; padding:.25rem 0; color:#1F6D47; text-decoration:none; font-weight:600
}
.footer-links a:hover{ color:#27935C }
.socials .btn{
  border-radius:999px; font-weight:700; padding:.4rem .75rem;
  box-shadow:0 8px 20px rgba(27,20,16,.08)
}
.btn-wa{ background:#25D366; color:#fff }
.btn-wa:hover{ color:#fff; opacity:.95 }
.btn-call{ background:var(--primary); color:#fff }
.btn-call:hover{ color:#fff; background:var(--primary-600) }
.newsletter .form-control{
  background:#FFFFFF; border:1px solid rgba(27,20,16,.15);
}
.newsletter .btn{ border-radius:12px }
.legalbar{
  border-top:1px solid rgba(27,20,16,.12);
  color:#6A6158; font-size:.925rem
}
.legalbar a{ color:#1F6D47; text-decoration:none }
.legalbar a:hover{ color:#27935C }


/* Footer: liste verticale + email */
.footer-links{ padding:0; margin:0 }
.footer-links li{ list-style:none; margin:.25rem 0 }
.footer-links li a{
  display:block; padding:.25rem 0; color:#1F6D47; text-decoration:none; font-weight:600
}
.footer-links li a:hover{ color:#27935C }

.footer-email{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.5rem .75rem; border-radius:12px;
  background:#FFF7E6; border:1px solid #EED2A4; color:#8B5A12; font-weight:700;
  word-break: break-all;
}
.footer-email i{ opacity:.9 }

footer li{
  list-style: none;
}

.toast.custom-toast{
  border-radius:14px;
  box-shadow:0 12px 30px rgba(27,20,16,.18);
  border:1px solid rgba(27,20,16,.08);
}
.toast.custom-toast .toast-header{
  border-bottom:1px solid rgba(27,20,16,.08);
  font-weight:700;
}
.toast-success .toast-header{ background:#E9F7F0; color:#1F6D47 }
.toast-error   .toast-header{ background:#FFF0E8; color:#9C3E11 }

/* Nav-pills = même style que .btn.btn-primary */
.nav-pills .nav-link{
  border-radius: 9999px;
  background: var(--primary);
  color: #fff;
  border: 1px solid var(--primary);
  font-weight: 700;
}
.nav-pills .nav-link:hover{
  background: var(--primary-600);
  border-color: var(--primary-600);
  color: #fff;
}
.nav-pills .nav-link:focus{
  outline: none;
  box-shadow: 0 0 0 .25rem var(--ring); /* même halo que boutons */
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link{
  background: var(--primary-600);
  border-color: var(--primary-600);
  color: #fff;
}

