:root{--r:#e30613;--b:#151410;--c:#111118;--m:#b9b9c4;--w:#fff;--max:1180px;--rad:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#151410;color:#fff;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;line-height:1.6}a{text-decoration:none;color:inherit}.container{max-width:var(--max);margin:auto;padding:0 22px}.topbar{height:34px;background:var(--r);overflow:hidden;display:flex;align-items:center;font-weight:900}.topbar div{white-space:nowrap;animation:marq 24s linear infinite;padding-left:100%}.topbar:hover div{animation-play-state:paused}@keyframes marq{to{transform:translateX(-100%)}}header{position:sticky;top:0;background:#151410;z-index:20;border-bottom:1px solid #1d1d1d}.nav{max-width:1260px;margin:auto;display:flex;align-items:center;gap:18px;padding:10px 18px}.logo img{width:285px}.menu{flex:1;overflow-x:auto;scrollbar-width:none}.menu::-webkit-scrollbar{display:none}.menu ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;white-space:nowrap;justify-content:flex-end}.menu a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 11px;border-radius:14px;font-size:12px;font-weight:900}.menu i{font-size:16px}.menu a:hover,.menu a.active{background:#111;color:var(--r)}.hero{background:radial-gradient(circle at 80% 20%,rgba(227,6,19,.25),transparent 30%),linear-gradient(135deg,#000,#08080c 60%,#2b0004);position:relative;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px;opacity:.32}.hero-grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:42px;align-items:center;padding:78px 22px}.badge{display:inline-flex;gap:8px;align-items:center;background:rgba(227,6,19,.14);border:1px solid rgba(227,6,19,.5);border-radius:999px;padding:9px 14px;font-weight:900;margin-bottom:18px}.hero h1{font-size:clamp(38px,6vw,76px);line-height:.98;margin:0 0 20px;letter-spacing:-2px}.hero h1 span{color:var(--r)}.hero p{color:#dedee5;font-size:clamp(17px,2vw,22px);max-width:720px}.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:15px 22px;font-weight:950;transition:.2s}.red{background:var(--r)}.outline{border:1px solid rgba(255,255,255,.25)}.btn:hover{transform:translateY(-2px)}.checks{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}.checks div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);border-radius:18px;padding:14px;font-weight:900}.checks i{color:var(--r)}.hero-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:32px;padding:24px;box-shadow:0 25px 70px rgba(0,0,0,.35)}.screen{background:#000;border-radius:24px;border:1px solid #333;padding:18px}.bar{height:13px;background:linear-gradient(90deg,var(--r),#ff6d6d);border-radius:20px;margin-bottom:16px}.monitor{aspect-ratio:16/10;border-radius:18px;background:linear-gradient(135deg,#08284f,#1792ff 60%,#092e68);display:grid;place-items:center;font-size:74px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.stat{background:#111;border:1px solid #292929;border-radius:18px;padding:14px;text-align:center}.stat strong{display:block;color:var(--r);font-size:23px}.section{padding:76px 0}.light{background:#fff;color:#111}.title{text-align:center;margin-bottom:38px}.k{color:var(--r);text-transform:uppercase;font-weight:950;letter-spacing:.14em;font-size:13px}.title h2{font-size:clamp(30px,4vw,50px);line-height:1.05;margin:10px 0 12px}.title p{color:#bbb;max-width:760px;margin:auto}.light .title p{color:#555}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{background:linear-gradient(180deg,#14141b,#0c0c10);border:1px solid #26262e;border-radius:var(--rad);padding:26px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.ico{width:68px;height:68px;border-radius:20px;background:var(--r);display:grid;place-items:center;font-size:28px;margin-bottom:18px}.card h3{font-size:24px;margin:0 0 12px}.card li{color:#d2d2d9}.process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step{background:#fff;color:#111;border-radius:var(--rad);padding:24px;box-shadow:0 16px 38px rgba(0,0,0,.08)}.num{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#000;color:#fff;font-weight:950}.trust{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}.trust-item{display:flex;gap:14px;background:#111;border:1px solid #292929;border-radius:18px;padding:18px;margin-bottom:12px}.trust-item i{color:var(--r);font-size:22px}.review{background:#fff;color:#111;border-radius:var(--rad);padding:22px;box-shadow:0 16px 38px rgba(0,0,0,.08)}.stars{color:#f7b500}.cta{background:linear-gradient(135deg,var(--r),#640008);border-radius:32px;padding:42px;display:flex;justify-content:space-between;align-items:center;gap:22px}.cta h2{margin:0;font-size:clamp(28px,4vw,46px)}footer{background:#000;border-top:1px solid #202020;padding:50px 0 24px}.foot{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:24px}footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}footer p,footer li,footer a{color:#c7c7cf}.copy{margin-top:34px;padding-top:18px;border-top:1px solid #202020;text-align:center;color:#85858e;font-size:13px}.page{padding:64px 0;background:linear-gradient(135deg,#000,#151515);border-bottom:1px solid #202020}.page h1{font-size:clamp(36px,5vw,60px);margin:0 0 10px}.content{padding:60px 0}.form{display:grid;gap:15px;max-width:760px;margin:auto}input,textarea,select{width:100%;background:#fff;color:#111;border:1px solid #ddd;border-radius:14px;padding:14px;font:inherit}textarea{min-height:145px}label{font-weight:850}.table{width:100%;border-collapse:collapse;background:#fff;color:#111;border-radius:20px;overflow:hidden}.table th{background:#111;color:#fff;text-align:left}.table th,.table td{padding:16px;border-bottom:1px solid #eee}.packs{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.pack{background:#fff;color:#111;border-radius:var(--rad);padding:28px}.price{font-size:34px;font-weight:950;color:var(--r)}.map{border:0;width:100%;height:350px;border-radius:22px;filter:grayscale(100%) invert(90%) contrast(85%)}@media(max-width:980px){.hero-grid,.trust{grid-template-columns:1fr}.grid3,.process,.foot{grid-template-columns:1fr 1fr}.logo img{width:215px}}@media(max-width:700px){.nav{padding:8px 10px}.logo img{width:150px}.menu a{font-size:10px;padding:7px 8px}.hero-grid{padding:48px 16px}.checks,.grid3,.process,.foot,.packs{grid-template-columns:1fr}.actions{display:grid}.cta{display:grid;text-align:center}.section{padding:54px 0}} 

/* Correction couleur : le fond du menu utilise exactement la couleur de fond du logo */
body,
header,
.nav,
.menu,
.menu ul {
  background-color: #151410 !important;
}

header {
  box-shadow: none !important;
  border-bottom: 0 !important;
}

.logo img {
  background-color: #151410 !important;
}

.hero {
  background-color: #151410 !important;
}


/* ===== Corrections demandées : fond logo/menu/footer + menu centré ===== */
body,
header,
.nav,
.menu,
.menu ul,
footer,
.foot,
.copy {
  background-color: #151410 !important;
}

header,
footer {
  box-shadow: none !important;
  border-color: #151410 !important;
}

.nav {
  position: relative !important;
  justify-content: center !important;
  min-height: 150px !important;
}

.logo {
  position: absolute !important;
  left: 18px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 2 !important;
}

.menu {
  flex: 0 1 auto !important;
  margin: 0 auto !important;
  max-width: calc(100% - 360px) !important;
}

.menu ul {
  justify-content: center !important;
}

.logo img {
  background-color: #151410 !important;
  display: block !important;
}

/* Footer : même fond que le logo, sans démarcation */
footer .container,
footer div,
footer p,
footer ul,
footer li {
  background-color: transparent !important;
}

@media (max-width: 980px) {
  .nav {
    justify-content: flex-start !important;
    min-height: auto !important;
  }
  .logo {
    position: static !important;
    transform: none !important;
  }
  .menu {
    flex: 1 1 auto !important;
    max-width: none !important;
  }
  .menu ul {
    justify-content: flex-start !important;
  }
}


/* ===== FIX HEADER / LOGO / FOOTER demandé ===== */

/* Le rouge reste uniquement sur la barre d'offre en haut */
.topbar {
  background: #e30613 !important;
  z-index: 80 !important;
}

/* Header compact : plus de gros espace vide au-dessus du logo */
header {
  background-color: #151410 !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.35) !important;
}

.nav {
  min-height: 150px !important;
  padding: 10px 18px !important;
  background-color: #151410 !important;
  display: grid !important;
  grid-template-columns: 360px 1fr 360px !important;
  align-items: center !important;
  gap: 18px !important;
}

/* Le logo reste à gauche, sans passer sur le bandeau rouge */
.logo {
  position: static !important;
  transform: none !important;
  justify-self: start !important;
  z-index: 2 !important;
}

.logo img {
  width: 300px !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  background-color: #151410 !important;
}

/* Menu bien centré au milieu de l'en-tête */
.menu {
  grid-column: 2 !important;
  justify-self: center !important;
  max-width: none !important;
  width: auto !important;
  overflow-x: auto !important;
  background-color: #151410 !important;
}

.menu ul {
  justify-content: center !important;
  background-color: #151410 !important;
}

.menu a {
  font-size: 12px !important;
}

/* Séparation propre entre le contenu et le bas du site */
.cta {
  margin-bottom: 80px !important;
}

footer {
  background-color: #151410 !important;
  border-top: 1px solid rgba(255,255,255,.12) !important;
  position: relative !important;
  margin-top: 0 !important;
  padding-top: 62px !important;
}

footer::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(1160px, calc(100% - 44px)) !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(227,6,19,.75), rgba(255,255,255,.18), transparent) !important;
}

.foot {
  background-color: #151410 !important;
  align-items: start !important;
}

.copy {
  background-color: #151410 !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  margin-top: 42px !important;
}

/* Footer logo plus propre et pas trop grand */
footer img {
  max-width: 230px !important;
  border-radius: 0 !important;
}

/* Mobile / tablette : on revient sur une disposition simple */
@media (max-width: 980px) {
  .nav {
    display: flex !important;
    min-height: auto !important;
    grid-template-columns: none !important;
  }

  .logo img {
    width: 170px !important;
  }

  .menu {
    grid-column: auto !important;
    justify-self: auto !important;
    width: 100% !important;
  }

  .menu ul {
    justify-content: flex-start !important;
  }
}

@media (max-width: 700px) {
  .logo img {
    width: 135px !important;
  }

  .nav {
    gap: 10px !important;
  }

  .menu a {
    font-size: 10px !important;
  }

  footer {
    padding-top: 44px !important;
  }
}


/* ===== Correction cases à cocher page devis ===== */
fieldset label {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  margin: 12px 0 !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

fieldset input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: #e30613 !important;
  vertical-align: middle !important;
  position: static !important;
}

fieldset legend {
  line-height: 1 !important;
}


/* ===== Pack ultra puissant : conversion, SEO local, FAQ, simulateur, floating buttons ===== */
.floating-actions {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 90;
  display: grid;
  gap: 10px;
}

.float-btn {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.16);
  transition: transform .2s, filter .2s;
}

.float-btn:hover {
  transform: translateY(-3px) scale(1.03);
  filter: brightness(1.08);
}

.float-phone { background: #e30613; }
.float-whatsapp { background: #25D366; }
.float-devis { background: #111; }

.trust-badges {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  margin-top: 26px;
}

.trust-badge {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 18px;
  padding: 16px 12px;
  text-align: center;
  font-weight: 900;
}

.trust-badge i {
  display: block;
  color: #e30613;
  font-size: 24px;
  margin-bottom: 8px;
}

.feature-strip {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
}

.feature-box {
  border-radius: 24px;
  padding: 24px;
  background: linear-gradient(180deg,#15151d,#0c0c10);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
}

.feature-box i {
  color: #e30613;
  font-size: 30px;
  margin-bottom: 14px;
}

.notice-red {
  background: linear-gradient(135deg,#e30613,#740008);
  color: #fff;
  border-radius: 28px;
  padding: 30px;
  box-shadow: 0 22px 60px rgba(227,6,19,.16);
}

.zone-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.zone-cloud a,
.zone-cloud span {
  background: #111;
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 850;
}

.light .zone-cloud a,
.light .zone-cloud span {
  background: #fff;
  color: #111;
  border: 1px solid #ddd;
}

.faq-list {
  max-width: 940px;
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.faq-list details {
  background: #111117;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 18px 20px;
}

.light .faq-list details {
  background: #fff;
  border: 1px solid #ddd;
  color: #111;
}

.faq-list summary {
  font-weight: 950;
  cursor: pointer;
}

.faq-list p {
  color: #d1d1da;
}

.light .faq-list p {
  color: #444;
}

.simulator {
  max-width: 900px;
  margin: auto;
  background: #fff;
  color: #111;
  border-radius: 28px;
  padding: 30px;
  box-shadow: 0 18px 50px rgba(0,0,0,.12);
}

.simulator-grid {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 14px;
  align-items: end;
}

.estimate-result {
  margin-top: 18px;
  padding: 18px;
  border-radius: 18px;
  background: #111;
  color: #fff;
  font-weight: 850;
}

.estimate-result strong {
  color: #e30613;
  font-size: 24px;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 22px;
}

.blog-card {
  background: #fff;
  color: #111;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 16px 38px rgba(0,0,0,.08);
}

.blog-card .tag {
  color: #e30613;
  font-weight: 950;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .08em;
}

.guarantee-box {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 20px;
  align-items: center;
  background: linear-gradient(135deg,#111,#1b1b22);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  padding: 28px;
}

.guarantee-box i {
  color: #e30613;
  font-size: 58px;
}

@media(max-width:980px) {
  .trust-badges,
  .feature-strip,
  .blog-grid {
    grid-template-columns: 1fr 1fr;
  }
  .simulator-grid {
    grid-template-columns: 1fr;
  }
}

@media(max-width:700px) {
  .floating-actions {
    left: 10px;
    bottom: 10px;
  }
  .float-btn {
    width: 48px;
    height: 48px;
  }
  .trust-badges,
  .feature-strip,
  .blog-grid {
    grid-template-columns: 1fr;
  }
  .guarantee-box {
    grid-template-columns: 1fr;
    text-align: center;
  }
}


/* ===== Correction lisibilité textes sur blocs foncés ===== */
/* Certains blocs foncés placés dans une section blanche héritaient du texte noir.
   Ces règles forcent les textes en blanc/gris clair uniquement dans les blocs noirs. */

.trust-item,
.trust-item *,
.guarantee-box,
.guarantee-box *,
.feature-box,
.feature-box *,
.estimate-result,
.estimate-result *,
.cta,
.cta * {
  color: #ffffff !important;
}

.trust-item p,
.trust-item div,
.guarantee-box p,
.feature-box p,
.cta p {
  color: #e6e6ec !important;
}

.guarantee-box .k,
.feature-box .k,
.cta .k {
  color: #e30613 !important;
}

.guarantee-box .btn,
.cta .btn,
.trust-item .btn {
  color: #ffffff !important;
}

.light .trust-item,
.light .guarantee-box,
.light .feature-box {
  color: #ffffff !important;
}

.light .trust-item p,
.light .trust-item div,
.light .guarantee-box p,
.light .feature-box p {
  color: #e6e6ec !important;
}


/* ===== Contact prioritaire + bloc paiement ===== */
.payment-info {
  margin-top: 34px;
}

.payment-info > div {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 16px 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.payment-info strong {
  color: #fff;
  font-weight: 950;
}

.payment-info i {
  color: #e30613;
  margin-right: 6px;
}

.payment-info span {
  color: #e6e6ec;
}

.payment-info .no-check {
  color: #ffb8b8;
  font-weight: 900;
}

footer small {
  color: #aaa;
  font-size: 12px;
}


/* ===== Finitions finales : vidéos, avis Google, anti-spam, cookie banner, SEO local, mobile ===== */
.video-showcase {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 30px;
  align-items: center;
}

.video-frame {
  background: #000;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 22px 60px rgba(0,0,0,.28);
}

.video-frame video {
  width: 100%;
  height: auto;
  display: block;
}

.video-frame.vertical {
  max-width: 380px;
  margin: 0 auto;
}

.avis-google-box {
  background: #fff;
  color: #111;
  border-radius: 28px;
  padding: 24px;
  box-shadow: 0 18px 50px rgba(0,0,0,.10);
}

.honeypot {
  position: absolute !important;
  left: -9999px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

.cookie-banner {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 120;
  max-width: 390px;
  background: #111118;
  color: #fff;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
  display: none;
}

.cookie-banner.show {
  display: block;
}

.cookie-banner p {
  color: #e6e6ec;
  margin: 8px 0 14px;
}

.cookie-banner .btn {
  padding: 10px 16px;
}

.seo-local-note {
  background: rgba(227,6,19,.08);
  border: 1px solid rgba(227,6,19,.25);
  border-radius: 22px;
  padding: 20px;
  margin-top: 24px;
}

.form .anti-spam-box {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 18px;
  padding: 18px;
  color: #111;
}

@media(max-width:980px) {
  .video-showcase {
    grid-template-columns: 1fr;
  }
}

@media(max-width:700px) {
  .cookie-banner {
    left: 10px;
    right: 10px;
    bottom: 10px;
    max-width: none;
  }

  .video-frame {
    border-radius: 18px;
  }

  .avis-google-box {
    padding: 16px;
    border-radius: 18px;
  }

  .menu a {
    min-width: 68px;
  }

  input, textarea, select {
    font-size: 16px !important; /* évite le zoom iPhone */
  }
}


/* ===== Version mobile optimisée avec menu hamburger ===== */
.menu-toggle {
  display: none;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255,255,255,.18);
  background: #111118;
  border-radius: 14px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  z-index: 160;
}

.menu-toggle span {
  width: 22px;
  height: 2px;
  background: #fff;
  display: block;
  border-radius: 999px;
  transition: transform .25s, opacity .25s;
}

.menu-toggle.is-open span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.menu-toggle.is-open span:nth-child(2) {
  opacity: 0;
}

.menu-toggle.is-open span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.mobile-menu-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.62);
  z-index: 130;
  opacity: 0;
  visibility: hidden;
  transition: .25s;
}

.mobile-menu-backdrop.show {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 820px) {
  .topbar {
    height: 32px !important;
    font-size: 12px !important;
  }

  header {
    position: sticky !important;
    top: 0 !important;
    z-index: 150 !important;
  }

  .nav {
    display: flex !important;
    min-height: 78px !important;
    padding: 8px 12px !important;
    gap: 10px !important;
    justify-content: space-between !important;
  }

  .logo {
    position: static !important;
    transform: none !important;
    flex: 0 0 auto !important;
  }

  .logo img {
    width: 135px !important;
    max-height: 64px !important;
    object-fit: contain !important;
  }

  .menu-toggle {
    display: flex !important;
    margin-left: auto !important;
  }

  .menu {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    width: min(86vw, 360px) !important;
    height: 100vh !important;
    background: #151410 !important;
    padding: 96px 18px 28px !important;
    z-index: 150 !important;
    transform: translateX(105%) !important;
    transition: transform .28s ease !important;
    overflow-y: auto !important;
    box-shadow: -20px 0 60px rgba(0,0,0,.55) !important;
    border-left: 1px solid rgba(255,255,255,.12) !important;
  }

  body.menu-open .menu {
    transform: translateX(0) !important;
  }

  body.menu-open {
    overflow: hidden !important;
  }

  .menu ul {
    display: grid !important;
    gap: 10px !important;
    justify-content: stretch !important;
    width: 100% !important;
    background: transparent !important;
  }

  .menu li {
    width: 100% !important;
  }

  .menu a {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    gap: 13px !important;
    padding: 15px 16px !important;
    border-radius: 16px !important;
    font-size: 16px !important;
    background: rgba(255,255,255,.055) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
  }

  .menu a i {
    width: 22px !important;
    text-align: center !important;
    font-size: 18px !important;
  }

  .menu a.active,
  .menu a:hover {
    background: rgba(227,6,19,.18) !important;
    color: #fff !important;
    border-color: rgba(227,6,19,.45) !important;
  }

  .hero-grid,
  .trust,
  .video-showcase {
    grid-template-columns: 1fr !important;
  }

  .hero h1,
  .page h1 {
    font-size: clamp(34px, 11vw, 48px) !important;
    letter-spacing: -1px !important;
  }

  .hero-grid {
    padding: 42px 16px !important;
  }

  .page {
    padding: 42px 0 !important;
  }

  .actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .btn {
    width: 100% !important;
    text-align: center !important;
  }

  .grid3,
  .process,
  .packs,
  .foot,
  .trust-badges,
  .feature-strip,
  .blog-grid {
    grid-template-columns: 1fr !important;
  }

  .card,
  .pack,
  .step,
  .review,
  .simulator {
    border-radius: 20px !important;
  }

  .table {
    display: block !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
  }

  .floating-actions {
    left: 10px !important;
    bottom: 10px !important;
    z-index: 125 !important;
  }

  .float-btn {
    width: 46px !important;
    height: 46px !important;
  }

  .cookie-banner {
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    max-width: none !important;
  }
}

@media (max-width: 420px) {
  .container {
    padding: 0 16px !important;
  }

  .logo img {
    width: 118px !important;
  }

  .menu {
    width: 90vw !important;
  }

  .hero h1,
  .page h1 {
    font-size: 32px !important;
  }

  .section {
    padding: 44px 0 !important;
  }
}


/* ===== Horaires + zone 30 km ===== */
.hours-card {
  max-width: 760px;
  margin: 0 auto;
}

.hours-card h2 i {
  color: #e30613;
  margin-right: 8px;
}

.hours-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px 24px;
  margin-top: 18px;
}

.hours-grid span {
  color: #e6e6ec;
}

.hours-grid strong {
  color: #fff;
}

.light .hours-grid span,
.light .hours-grid strong {
  color: #111;
}

.zone-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.zone-cloud span {
  background: #111;
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 850;
}

.light .zone-cloud span {
  background: #fff;
  color: #111;
  border: 1px solid #ddd;
}

.zone-note {
  margin-top: 26px;
  text-align: center;
  color: #555;
  font-weight: 800;
}


/* ===== Message commercial + paiement confirmé ===== */
.notice-red h2 {
  color: #fff !important;
}

.notice-red p {
  color: #fff !important;
}

.payment-info > div {
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 20px !important;
  padding: 18px 20px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px 20px !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.payment-info strong,
.payment-info span {
  color: #ffffff !important;
}

.payment-info i {
  color: #e30613 !important;
  margin-right: 6px !important;
}

.payment-info .no-check {
  color: #ffb8b8 !important;
  font-weight: 950 !important;
}

.promise-mini {
  background: rgba(227,6,19,.10);
  border: 1px solid rgba(227,6,19,.28);
  border-radius: 20px;
  padding: 18px;
  margin-top: 20px;
  font-weight: 850;
}

/* ===== Footer compact pro + mobile court ===== */
.pro-footer{background:#151410!important;border-top:1px solid rgba(255,255,255,.10)!important;padding:42px 0 18px!important;margin-top:0!important}
.pro-footer:before{content:""!important;display:block!important;width:min(1160px,calc(100% - 44px))!important;height:1px!important;margin:-42px auto 34px!important;background:linear-gradient(90deg,transparent,rgba(227,6,19,.65),rgba(255,255,255,.12),transparent)!important}
.pro-footer-grid{display:grid!important;grid-template-columns:1.25fr 1fr 1.15fr 1fr .95fr!important;gap:28px!important;align-items:start!important}
.footer-brand img{max-width:210px!important;margin:0 0 16px!important}
.footer-brand p{color:#d7d7df!important;margin:0 0 16px!important;max-width:300px!important}
.footer-social{display:flex!important;gap:10px!important}
.footer-social a{width:38px!important;height:38px!important;border-radius:50%!important;background:rgba(255,255,255,.08)!important;color:#fff!important;display:grid!important;place-items:center!important;border:1px solid rgba(255,255,255,.12)!important}
.footer-social a:hover{background:#e30613!important}
.footer-section{color:#fff!important;background:transparent!important}
.footer-section summary{list-style:none!important;cursor:default!important;font-weight:950!important;color:#fff!important;margin-bottom:14px!important;font-size:16px!important}
.footer-section summary::-webkit-details-marker{display:none!important}
.footer-section ul{list-style:none!important;padding:0!important;margin:0!important;display:grid!important;gap:8px!important}
.footer-section li,.footer-section a,.footer-section small{color:#d2d2db!important;font-size:14px!important;line-height:1.45!important}
.footer-section a:hover{color:#fff!important}.footer-section small{color:#9c9ca7!important}
.hours-list li{display:flex!important;justify-content:space-between!important;gap:14px!important;border-bottom:1px solid rgba(255,255,255,.06)!important;padding-bottom:5px!important}.hours-list strong{color:#fff!important;font-size:13px!important}
.pro-payment{margin-top:30px!important}.pro-payment>div{max-width:980px!important;margin:0 auto!important;padding:14px 18px!important;border-radius:18px!important}
.pro-footer .copy{margin-top:22px!important;padding-top:16px!important;border-top:1px solid rgba(255,255,255,.08)!important;color:#8f8f98!important}
.cta{margin-bottom:32px!important}.notice-red{padding:30px!important}
@media(max-width:1100px){.pro-footer-grid{grid-template-columns:1.2fr 1fr 1fr!important}}
@media(max-width:820px){
.section{padding:34px 0!important}.page{padding:36px 0!important}.notice-red,.cta{padding:24px 20px!important;border-radius:22px!important}.cta h2{font-size:28px!important}.cta p,.notice-red p{font-size:15px!important}
.pro-footer{padding:28px 0 12px!important}.pro-footer:before{margin:-28px auto 22px!important}.pro-footer-grid{grid-template-columns:1fr!important;gap:10px!important}.footer-brand{text-align:center!important;margin-bottom:8px!important}.footer-brand img{max-width:150px!important;margin:0 auto 10px!important}.footer-brand p{max-width:280px!important;margin:0 auto 12px!important;font-size:14px!important}.footer-social{justify-content:center!important}
.footer-section{border:1px solid rgba(255,255,255,.10)!important;border-radius:16px!important;background:rgba(255,255,255,.045)!important;overflow:hidden!important}.footer-section summary{cursor:pointer!important;margin:0!important;padding:14px 16px!important;display:flex!important;align-items:center!important;justify-content:space-between!important}.footer-section summary:after{content:"+"!important;color:#e30613!important;font-size:22px!important;line-height:1!important}.footer-section[open] summary:after{content:"–"!important}.footer-section ul{padding:0 16px 14px!important;gap:7px!important}.footer-section li,.footer-section a,.footer-section small{font-size:13px!important}.hours-list li{padding-bottom:4px!important}
.pro-payment{margin-top:16px!important}.pro-payment>div{display:grid!important;gap:8px!important;border-radius:16px!important;padding:13px!important}.pro-payment strong,.pro-payment span{font-size:13px!important}.pro-footer .copy{margin-top:14px!important;font-size:12px!important}
main>section:nth-last-of-type(1),main>section:nth-last-of-type(2){padding-top:24px!important;padding-bottom:24px!important}
}
@media(max-width:420px){.section{padding:28px 0!important}.notice-red,.cta{padding:20px 16px!important}.footer-section summary{padding:12px 14px!important}}


/* ===== Réduction des grandes séparations en bas de page ===== */
/* Objectif : garder un site aéré, mais éviter les gros blancs entre simulateur, engagement et CTA. */

@media (min-width: 821px) {
  .compact-simulator {
    padding-top: 46px !important;
    padding-bottom: 22px !important;
  }

  .compact-simulator .title {
    margin-bottom: 26px !important;
  }

  .compact-engagement {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  .compact-engagement .notice-red {
    padding: 34px 42px !important;
    max-width: 1080px !important;
    margin: 0 auto !important;
  }

  .compact-final-cta {
    padding-top: 28px !important;
    padding-bottom: 48px !important;
  }

  .compact-final-cta .cta {
    margin-bottom: 0 !important;
  }

  /* Sécurité si des classes n'ont pas été appliquées : règle moderne compatible navigateurs récents */
  main > section:has(.simulator) {
    padding-bottom: 22px !important;
  }

  main > section:has(.notice-red) {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  main > section:has(.cta) {
    padding-top: 28px !important;
    padding-bottom: 48px !important;
  }
}

@media (max-width: 820px) {
  .compact-simulator,
  .compact-engagement,
  .compact-final-cta {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }

  .compact-simulator .title {
    margin-bottom: 18px !important;
  }

  .compact-engagement .notice-red,
  .compact-final-cta .cta {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  main > section:has(.simulator),
  main > section:has(.notice-red),
  main > section:has(.cta) {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}


/* ===== Pack premium final : avis, merci, avant/après, pros, mobile polish ===== */
.premium-hero-note {
  margin-top: 20px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;
  padding: 18px;
  font-weight: 850;
  color: #fff;
}

.before-after-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.before-after {
  background: #fff;
  color: #111;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 18px 45px rgba(0,0,0,.10);
  position: relative;
  overflow: hidden;
}

.before-after:before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: linear-gradient(90deg,#e30613,#ff6b6b);
}

.before-after .mini-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #e30613;
  margin-bottom: 8px;
}

.before-after h3 {
  margin: 0 0 12px;
}

.before-after p {
  color: #444;
}

.pro-targets {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.pro-target {
  background: linear-gradient(180deg,#15151d,#0b0b0f);
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px;
  padding: 24px;
}

.pro-target i {
  color: #e30613;
  font-size: 28px;
  margin-bottom: 12px;
}

.review-cta {
  background: linear-gradient(135deg,#111,#1b1b22);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  padding: 30px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: center;
}

.review-cta h2,
.review-cta p {
  color: #fff !important;
}

.thank-you-steps {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 16px;
}

.thank-card {
  background: #fff;
  color: #111;
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 16px 38px rgba(0,0,0,.08);
}

.thank-card i {
  color: #e30613;
  font-size: 24px;
  margin-bottom: 10px;
}

.mobile-test-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  padding: 9px 13px;
  background: rgba(227,6,19,.12);
  border: 1px solid rgba(227,6,19,.35);
  font-weight: 950;
  color: #fff;
}

.review-mini {
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.review-mini a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  padding: 11px 15px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  font-weight: 900;
}

.review-mini a:hover {
  background: #e30613;
}

@media(max-width: 980px) {
  .before-after-grid,
  .pro-targets,
  .thank-you-steps {
    grid-template-columns: 1fr 1fr;
  }

  .review-cta {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

@media(max-width: 700px) {
  .before-after-grid,
  .pro-targets,
  .thank-you-steps {
    grid-template-columns: 1fr;
  }

  .before-after,
  .pro-target,
  .thank-card,
  .review-cta {
    border-radius: 18px;
    padding: 18px;
  }

  .review-mini {
    display: grid;
  }

  .review-mini a {
    justify-content: center;
  }
}

/* Boutons flottants plus propres sur mobile : évite de manger le contenu */
@media(max-width: 820px) {
  .floating-actions {
    grid-template-columns: repeat(3, 46px) !important;
    grid-auto-flow: column !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 10px !important;
    background: rgba(21,20,16,.78) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    backdrop-filter: blur(10px) !important;
    padding: 8px !important;
    border-radius: 999px !important;
  }

  body {
    padding-bottom: 72px !important;
  }
}


/* ===== Correction mobile : boutons rapides à côté du hamburger ===== */

/* Par défaut, les boutons du header sont cachés sur PC */
.header-quick-actions {
  display: none;
}

/* PC : logo un peu réduit + menu plus propre sur une ligne */
@media (min-width: 821px) {
  .nav {
    grid-template-columns: 280px 1fr 220px !important;
    min-height: 122px !important;
    padding: 10px 18px !important;
  }

  .logo img {
    width: 245px !important;
    max-height: 105px !important;
    object-fit: contain !important;
  }

  .menu {
    max-width: none !important;
    overflow: visible !important;
  }

  .menu ul {
    gap: 8px !important;
    flex-wrap: nowrap !important;
  }

  .menu a {
    font-size: 12px !important;
    padding: 10px 11px !important;
    white-space: nowrap !important;
  }

  .menu a i {
    font-size: 16px !important;
  }
}

/* Mobile : les boutons sont dans le header, plus en bas */
@media (max-width: 820px) {
  .nav {
    display: grid !important;
    grid-template-columns: auto 1fr auto auto !important;
    align-items: center !important;
    min-height: 74px !important;
    padding: 8px 10px !important;
    gap: 8px !important;
  }

  .logo {
    justify-self: start !important;
  }

  .logo img {
    width: 104px !important;
    max-height: 56px !important;
    object-fit: contain !important;
  }

  .header-quick-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    justify-self: end !important;
  }

  .header-action {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.25) !important;
    text-decoration: none !important;
    font-size: 15px !important;
  }

  .header-action.phone {
    background: #e30613 !important;
  }

  .header-action.whatsapp {
    background: #25D366 !important;
  }

  .header-action.devis {
    background: #111118 !important;
  }

  .menu-toggle {
    justify-self: end !important;
    margin-left: 0 !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 14px !important;
  }

  /* On supprime les boutons flottants du bas sur mobile pour ne plus gêner cookies/chat/navigation */
  .floating-actions {
    display: none !important;
  }

  body {
    padding-bottom: 0 !important;
  }

  /* Le chat Tawk.to peut rester à droite sans être recouvert par nos boutons */
  .cookie-banner {
    bottom: 12px !important;
  }
}

/* Très petits écrans : on garde tout sur une ligne */
@media (max-width: 420px) {
  .nav {
    grid-template-columns: auto 1fr auto auto !important;
    gap: 6px !important;
    padding: 7px 8px !important;
  }

  .logo img {
    width: 92px !important;
  }

  .header-quick-actions {
    gap: 5px !important;
  }

  .header-action {
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
  }

  .menu-toggle {
    width: 40px !important;
    height: 40px !important;
  }
}


/* ===== Bouton avis Google placé sous les avis ===== */
.reviews-google-under {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 26px auto 0;
}

.reviews-google-under a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 14px 24px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff !important;
  font-weight: 950;
  text-decoration: none;
  box-shadow: 0 14px 34px rgba(0,0,0,.25);
}

.reviews-google-under a:hover {
  background: #e30613;
  border-color: #e30613;
  transform: translateY(-2px);
}

.reviews-google-under i {
  color: #fff;
}

.light .reviews-google-under a,
.reviews-google-under.on-light a {
  background: #111;
  border-color: #222;
  color: #fff !important;
}

@media (max-width: 700px) {
  .reviews-google-under {
    margin-top: 20px;
  }

  .reviews-google-under a {
    width: 100%;
    max-width: 320px;
    min-height: 48px;
    padding: 12px 18px;
    font-size: 15px;
  }
}

/* ===== V1 officielle : pages SEO ciblées et finitions conversion ===== */
.service-checklist{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.service-check{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:18px;color:#fff;font-weight:850}.service-check i{color:#e30613;margin-right:8px}.light .service-check{background:#fff;color:#111;border-color:#ddd}.warning-box{background:#fff3f3;border:1px solid #ffc7c7;color:#111;border-radius:22px;padding:22px;font-weight:800}.good-reflex{background:linear-gradient(135deg,#15151d,#0b0b0f);border:1px solid rgba(255,255,255,.12);color:#fff;border-radius:26px;padding:26px;display:grid;grid-template-columns:70px 1fr;gap:18px;align-items:center}.good-reflex i{color:#e30613;font-size:44px}.good-reflex h2,.good-reflex p{color:#fff!important}.privacy-reassurance{background:rgba(227,6,19,.08);border:1px solid rgba(227,6,19,.28);border-radius:18px;padding:18px;color:#111;font-weight:850}.privacy-reassurance i{color:#e30613;margin-right:6px}.quick-solutions{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.quick-solution{background:#fff;color:#111;border-radius:24px;padding:24px;box-shadow:0 16px 38px rgba(0,0,0,.08);text-decoration:none;transition:.2s}.quick-solution:hover{transform:translateY(-4px);box-shadow:0 24px 55px rgba(0,0,0,.14)}.quick-solution i{color:#e30613;font-size:30px;margin-bottom:12px}.quick-solution p{color:#555;margin:0}@media(max-width:980px){.quick-solutions,.service-checklist{grid-template-columns:1fr 1fr}}@media(max-width:700px){.quick-solutions,.service-checklist{grid-template-columns:1fr}.good-reflex{grid-template-columns:1fr;text-align:center;padding:22px}}


/* ===== Vidéo accueil ===== */
.video-home-section {
  padding-top: 46px !important;
  padding-bottom: 46px !important;
}

.video-showcase-pro {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 28px;
  align-items: center;
}

.video-copy {
  background: linear-gradient(135deg,#15151d,#0b0b0f);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  padding: 30px;
  color: #fff;
}

.video-copy h2,
.video-copy p {
  color: #fff !important;
}

.video-card-pro {
  background: #000;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}

.video-card-pro video {
  width: 100%;
  display: block;
  background: #000;
}

@media(max-width: 900px) {
  .video-home-section {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }

  .video-showcase-pro {
    grid-template-columns: 1fr;
  }

  .video-copy,
  .video-card-pro {
    border-radius: 20px;
  }

  .video-copy {
    padding: 22px;
  }
}


/* ===== Vidéo directement dans le visuel hero ===== */
.video-hero-card {
  overflow: hidden;
}

.video-hero-card .video-screen {
  padding: 0 !important;
  background: #000 !important;
  overflow: hidden !important;
  position: relative !important;
}

.video-hero-card .video-screen video {
  width: 100% !important;
  height: 100% !important;
  min-height: 310px !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: inherit !important;
  background: #000 !important;
}

/* On garde les statistiques sous la vidéo comme avant */
.video-hero-card .stats {
  position: relative !important;
  z-index: 2 !important;
}

/* Si l’ancien style vidéo séparé existe encore, il ne doit pas créer de marge inutile */
.video-home-section {
  display: none !important;
}

/* Ajustement PC : le hero reste équilibré avec la vidéo */
@media (min-width: 901px) {
  .video-hero-card .video-screen {
    min-height: 320px !important;
  }
}

/* Ajustement mobile : la vidéo reste propre dans l’écran */
@media (max-width: 900px) {
  .video-hero-card .video-screen video {
    min-height: 220px !important;
  }
}

@media (max-width: 420px) {
  .video-hero-card .video-screen video {
    min-height: 190px !important;
  }
}


/* ===== Hero : ordinateur avec la pub/vidéo qui tourne dans l'écran ===== */
.computer-ad-card {
  padding: 34px 34px 28px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(227,6,19,.18), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 34px !important;
  overflow: visible !important;
}

.computer-stage {
  position: relative;
  max-width: 640px;
  margin: 0 auto 24px;
  padding-bottom: 82px;
}

.computer-monitor {
  position: relative;
  background: linear-gradient(180deg, #17171d, #050506);
  border: 12px solid #050506;
  border-radius: 30px;
  box-shadow:
    0 30px 70px rgba(0,0,0,.45),
    inset 0 0 0 1px rgba(255,255,255,.08);
  padding: 16px;
}

.computer-camera {
  position: absolute;
  top: 8px;
  left: 50%;
  width: 8px;
  height: 8px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: #2b2b32;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.08);
  z-index: 3;
}

.computer-screen {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 18px;
  overflow: hidden;
  background: #000;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.10),
    0 0 0 1px rgba(227,6,19,.14);
}

.computer-screen video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* petit reflet pro sur l'écran */
.computer-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(255,255,255,.18), transparent 28%, transparent 70%, rgba(255,255,255,.05));
  pointer-events: none;
  mix-blend-mode: screen;
}

.computer-neck {
  position: absolute;
  left: 50%;
  bottom: 42px;
  width: 92px;
  height: 46px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #16161b, #070708);
  border: 1px solid rgba(255,255,255,.10);
  border-top: 0;
  border-radius: 0 0 14px 14px;
  box-shadow: 0 16px 34px rgba(0,0,0,.38);
}

.computer-foot {
  position: absolute;
  left: 50%;
  bottom: 22px;
  width: 240px;
  height: 28px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #1a1a20, #050506);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  box-shadow: 0 18px 38px rgba(0,0,0,.35);
}

.computer-keyboard {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(92%, 520px);
  height: 28px;
  transform: translateX(-50%) perspective(260px) rotateX(18deg);
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.11) 0 1px, transparent 1px 24px),
    linear-gradient(180deg, #141419, #060607);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 10px 10px 18px 18px;
  opacity: .92;
}

.computer-ad-card .stats {
  margin-top: 8px !important;
  position: relative;
  z-index: 3;
}

/* Animation douce : l'ordinateur semble vivant sans faire gadget */
.computer-monitor {
  animation: computerFloat 5.5s ease-in-out infinite;
}

@keyframes computerFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@media (max-width: 900px) {
  .computer-ad-card {
    padding: 22px 18px 22px !important;
    border-radius: 24px !important;
  }

  .computer-stage {
    padding-bottom: 64px;
    margin-bottom: 14px;
  }

  .computer-monitor {
    border-width: 8px;
    border-radius: 22px;
    padding: 10px;
  }

  .computer-screen {
    border-radius: 14px;
  }

  .computer-neck {
    width: 66px;
    height: 34px;
    bottom: 34px;
  }

  .computer-foot {
    width: 170px;
    height: 22px;
    bottom: 18px;
  }

  .computer-keyboard {
    height: 22px;
  }
}

@media (max-width: 420px) {
  .computer-ad-card {
    padding: 18px 14px 18px !important;
  }

  .computer-stage {
    padding-bottom: 54px;
  }

  .computer-monitor {
    border-width: 7px;
    padding: 8px;
  }
}

/* prelaunch-final-polish */
.quick-solutions .quick-solution { min-height: 150px; }
@media(max-width:700px){
  .quick-solutions .quick-solution{min-height:auto}
}


/* ===== Compteur de visites discret ===== */
.visit-counter {
  width: fit-content;
  max-width: calc(100% - 32px);
  margin: 22px auto 0;
  padding: 9px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.10);
  color: #d9d9e2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  line-height: 1.2;
}

.visit-counter i {
  color: #e30613;
  font-size: 13px;
}

.visit-counter strong {
  color: #fff;
  font-weight: 950;
}

@media (max-width: 700px) {
  .visit-counter {
    margin-top: 14px;
    font-size: 12px;
    padding: 8px 12px;
  }
}


/* ===== Stats hero plus propres ===== */
.hero-proof {
  margin-top: 18px !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
}

.proof-item {
  min-height: 92px !important;
  background: rgba(0,0,0,.42) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 18px !important;
  padding: 14px 12px !important;
  display: grid !important;
  grid-template-columns: 34px 1fr !important;
  align-items: center !important;
  gap: 10px !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.22) !important;
}

.proof-item i {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  background: rgba(227,6,19,.14) !important;
  color: #e30613 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 15px !important;
}

.proof-item strong {
  display: block !important;
  color: #fff !important;
  font-size: 22px !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  white-space: nowrap !important;
}

.proof-item span {
  display: block !important;
  color: #d7d7df !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  margin-top: 5px !important;
  font-weight: 800 !important;
}

.computer-ad-card .stats {
  display: none !important;
}

@media (max-width: 900px) {
  .hero-proof {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .proof-item {
    min-height: auto !important;
    grid-template-columns: 30px 1fr !important;
    padding: 11px 12px !important;
    border-radius: 15px !important;
  }

  .proof-item i {
    width: 30px !important;
    height: 30px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
  }

  .proof-item strong {
    font-size: 18px !important;
  }

  .proof-item span {
    font-size: 12px !important;
    margin-top: 3px !important;
  }
}

@media (min-width: 901px) and (max-width: 1180px) {
  .proof-item {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  .proof-item i {
    margin: 0 auto !important;
  }

  .proof-item strong {
    font-size: 19px !important;
  }
}


/* ===== Tchat au clic uniquement ===== */
.depanne-chat-launcher {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9998;
  min-width: 104px;
  height: 48px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: #e30613;
  color: #fff;
  font-weight: 950;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  cursor: pointer;
  box-shadow: 0 18px 42px rgba(0,0,0,.38);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.depanne-chat-launcher:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(0,0,0,.44);
  background: #ff1020;
}

.depanne-chat-launcher.loading {
  opacity: .9;
  cursor: progress;
}

.depanne-chat-launcher .chat-icon {
  font-size: 18px;
  line-height: 1;
}

body.tawk-is-loaded .depanne-chat-launcher {
  display: none;
}

@media (max-width: 820px) {
  .depanne-chat-launcher {
    right: 12px;
    bottom: 12px;
    min-width: 88px;
    height: 42px;
    padding: 0 14px;
    font-size: 13px;
  }

  .depanne-chat-launcher .chat-icon {
    font-size: 16px;
  }
}


/* ===== Correctif tchat : un seul bouton visible ===== */
body.tawk-is-loaded .depanne-chat-launcher {
  display: none !important;
}

.depanne-chat-launcher {
  z-index: 9997 !important;
}


/* Correctif final tchat : on garde uniquement le bouton officiel Tawk.to */
.depanne-chat-launcher {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}


/* ===== Menu desktop légèrement agrandi ===== */
@media (min-width: 901px) {
  .header {
    min-height: 118px !important;
  }

  .logo img,
  .site-logo img,
  header img[src*="logo"] {
    max-height: 96px !important;
    width: auto !important;
    object-fit: contain !important;
  }

  .nav,
  .nav-menu,
  .desktop-nav,
  header nav ul {
    gap: 18px !important;
    align-items: center !important;
  }

  .nav a,
  .nav-menu a,
  .desktop-nav a,
  header nav a {
    font-size: 16px !important;
    font-weight: 950 !important;
    padding: 15px 16px !important;
    line-height: 1.15 !important;
  }

  .nav a i,
  .nav-menu a i,
  .desktop-nav a i,
  header nav a i {
    font-size: 21px !important;
    margin-bottom: 7px !important;
  }

  .nav a.active,
  .nav-menu a.active,
  .desktop-nav a.active,
  header nav a.active {
    border-radius: 18px !important;
  }
}

/* Sur écran moyen, on agrandit sans casser la ligne */
@media (min-width: 901px) and (max-width: 1180px) {
  .nav,
  .nav-menu,
  .desktop-nav,
  header nav ul {
    gap: 10px !important;
  }

  .nav a,
  .nav-menu a,
  .desktop-nav a,
  header nav a {
    font-size: 14px !important;
    padding: 12px 10px !important;
  }

  .nav a i,
  .nav-menu a i,
  .desktop-nav a i,
  header nav a i {
    font-size: 18px !important;
  }

  .logo img,
  .site-logo img,
  header img[src*="logo"] {
    max-height: 86px !important;
  }
}


/* ===== SEO Local Boost : FAQ et pages locales ===== */
.faq-mini .faq-list {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.faq-mini details {
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 16px 18px;
}

.faq-mini summary {
  cursor: pointer;
  font-weight: 950;
  color: #fff;
  list-style: none;
}

.faq-mini summary::-webkit-details-marker {
  display: none;
}

.faq-mini summary::after {
  content: "+";
  float: right;
  color: #e30613;
  font-size: 22px;
  line-height: 1;
}

.faq-mini details[open] summary::after {
  content: "−";
}

.faq-mini p {
  color: #dcdce4;
  margin: 12px 0 0;
  line-height: 1.7;
}

.light .faq-mini details,
.faq-mini.light details {
  background: #fff;
}

.light .faq-mini summary,
.faq-mini.light summary {
  color: #111;
}

.light .faq-mini p,
.faq-mini.light p {
  color: #333842;
}

.local-seo-hero h1 {
  max-width: 980px;
}

@media (max-width: 820px) {
  .faq-mini details {
    padding: 14px 15px;
    border-radius: 15px;
  }
}