/* Source preserved: mobile-v8.css */
/* JM.Micro â€” version mobile complÃ¨te, palette pÃ©trole et cuivre */
:root{
  --black:#142427;
  --ink:#142427;
  --brand:#1f4a4d;
  --brand-deep:#102e31;
  --cream:#f4efe7;
  --paper:#f4efe7;
  --white:#fbf8f2;
  --mist:#dde7e4;
  --stone:#748b88;
  --accent:#f36f21;
  --oxide:#f36f21;
  --orange:#f36f21;
  --line:#b9cbc6;
  --sage:#afc5c0;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Arial,Helvetica,sans-serif;
}

/* V8 final overrides â€” keep last in the cascade */
.smp-unit + .smp-unit{border-left:0!important}
.menu-toggle,.home-mobile .menu-toggle,.standalone-v6 .menu-toggle{border:0!important;box-shadow:none!important;background:var(--accent)!important}
.hero-intro,.hero-foot,.testimonial,.quote,.contact-whatsapp,.salon-media,.pricing-finish,.youtube-poster-local,.technique-mobile .hero,.technique-mobile .cta,.histoire-mobile .hero,.histoire-mobile .cta,.hygiene-mobile .hero,.hygiene-mobile .kit,.hygiene-mobile .certificate,.hygiene-mobile .cta,.standalone-v6 .hero,.standalone-v6 .cta,.footer{background:var(--brand)!important}
.about-photo{height:auto!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;background:var(--white)!important}
.reviews-grid{grid-template-columns:minmax(0,1fr)!important;max-width:860px!important;gap:28px!important;text-align:center!important}
.reviews-heading h2{max-width:760px!important;margin:10px auto 0!important}
.review-copy{max-width:680px!important;margin-inline:auto!important}
.review-score{display:flex!important;justify-content:center!important;align-items:center!important;gap:18px!important;margin:0 auto 22px!important;padding:19px 0!important;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.review-score strong{font-size:clamp(3.2rem,8vw,5.4rem)!important}
.review-score span{max-width:260px!important;text-align:left!important;line-height:1.45!important}
.review-actions{justify-content:center!important}
.contact-heading{max-width:760px!important;margin:0 auto 34px!important;text-align:center!important}
.contact-heading h2{max-width:720px!important;margin:10px auto 15px!important;color:var(--cream)!important}
.contact-heading p{max-width:620px!important;margin:0 auto!important;color:#dce8e5!important}
.contact-options{display:grid!important;grid-template-columns:.82fr 1.18fr!important;gap:22px!important;align-items:start!important}
.contact-card{padding:30px!important;background:var(--cream)!important;border:0!important;color:var(--brand)!important}
.contact-card h3{margin:5px 0 12px!important;font:2rem/1 var(--serif)!important;color:var(--brand)!important}
.contact-card p{color:#3e5e60!important}
.contact-option-label{color:var(--accent)!important;font-size:.66rem!important;font-weight:900!important;letter-spacing:.14em!important;text-transform:uppercase}
.contact-card .button{min-height:54px!important;border:0!important;background:var(--accent)!important;color:var(--brand)!important;box-shadow:7px 7px 0 var(--brand)!important}
.contact-phone{margin:20px 0 0!important;text-align:center!important}
.contact-phone a{color:var(--brand)!important;font-weight:800!important}
.diagnostic-form label{display:block!important;margin:14px 0 6px!important;font-size:.72rem!important;font-weight:800!important;letter-spacing:.06em!important;text-transform:uppercase}
.diagnostic-form input:not([type="checkbox"]),.diagnostic-form textarea{width:100%!important;padding:13px 14px!important;border:1px solid var(--line)!important;border-radius:0!important;background:#fff!important;color:var(--brand)!important;font:inherit!important}
.diagnostic-form input[type="file"]{padding:11px!important;background:#fff!important}
.diagnostic-form .photo-upload{position:relative!important;display:grid!important;grid-template-columns:auto 1fr!important;align-items:center!important;gap:14px!important;width:100%!important;min-height:64px!important;margin:14px 0 6px!important;padding:10px!important;border:2px solid var(--accent)!important;background:#fff!important;cursor:pointer!important;overflow:hidden!important;text-transform:none!important;letter-spacing:0!important}
.diagnostic-form .photo-upload:hover,.diagnostic-form .photo-upload:focus-within{box-shadow:0 0 0 3px rgba(241,123,42,.24)!important}
.diagnostic-form .photo-upload-action{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:42px!important;padding:10px 14px!important;background:var(--accent)!important;color:var(--brand-deep)!important;font-size:.72rem!important;font-weight:900!important;letter-spacing:.06em!important;text-transform:uppercase!important}
.diagnostic-form .photo-upload-selection{color:var(--brand)!important;font-size:.84rem!important;font-weight:600!important}
.diagnostic-form .photo-upload input[type="file"]{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;opacity:0!important;cursor:pointer!important}
.diagnostic-form .photo-upload-help{display:block!important;margin:0 0 18px!important;color:#d8e4df!important;font-size:.74rem!important;line-height:1.5!important}
@media(max-width:600px){.diagnostic-form .photo-upload{grid-template-columns:1fr!important;gap:8px!important}.diagnostic-form .photo-upload-action{width:100%!important}.diagnostic-form .photo-upload-selection{text-align:center!important}}
.diagnostic-form .consent{display:flex!important;align-items:flex-start!important;gap:10px!important;margin:15px 0 18px!important;text-transform:none!important;letter-spacing:0!important;font-weight:400!important}
.diagnostic-form .consent input{margin-top:4px!important}
.diagnostic-form .button{width:100%!important}
.form-preview-note{display:block!important;margin-top:14px!important;color:#607779!important;font-size:.68rem!important;line-height:1.45!important}
.contact-signature{text-align:center!important}
.technique-mobile .cta h2,.technique-mobile .cta p,.histoire-mobile .cta h2,.histoire-mobile .cta p,.hygiene-mobile .cta h2,.hygiene-mobile .cta p,.standalone-v6 .cta h2,.standalone-v6 .cta p{color:var(--cream)!important}
.technique-mobile .cta .button,.histoire-mobile .cta .button,.hygiene-mobile .cta .button,.standalone-v6 .cta .button{border:0!important;background:var(--accent)!important;color:var(--brand)!important;box-shadow:7px 7px 0 var(--cream)!important}
.hygiene-mobile .certificate img{background:var(--brand)!important}
@media(max-width:760px){
  .review-score{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:14px!important;text-align:left!important}
  .review-score strong{font-size:3.55rem!important}
  .review-score span{font-size:.62rem!important}
  .review-actions{align-items:stretch!important}
  .contact-options{grid-template-columns:1fr!important}
  .contact-card{padding:24px 20px!important}
}

/* Identité V12 : même logo et même fond sur toutes les pages. */
header{background:#1f4a4d!important;border-bottom-color:rgba(242,238,230,.22)!important}
header .nav > a:first-child,
header .brand{
  display:block!important;
  width:338px!important;
  height:70px!important;
  background:#1f4a4d url('/assets/logo-jm-micro-05-petrol.png') left center/contain no-repeat!important;
  mix-blend-mode:normal!important;
}
header .nav > a:first-child img{display:none!important}
.video-note{font-size:.86rem;color:#d9d8d3}
.gesture-film{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:36px;
  align-items:center;
  margin-top:0;
  margin-bottom:70px;
  padding:30px;
  background:#1f4a4d;
  color:#f2eee6;
}
.gesture-film-copy h2{margin:10px 0 12px;font:clamp(2.1rem,4vw,3.5rem)/.96 var(--serif)}
.gesture-film-copy p{margin:0;color:#d9d8d3}
.gesture-film video{display:block;width:100%;max-height:560px;background:#000;object-fit:contain}

@media(max-width:760px){
  header .nav > a:first-child,
  header .brand{width:calc(100% - 64px)!important;height:64px!important;flex:0 1 auto!important}
  .gesture-film{grid-template-columns:1fr;gap:22px;margin-bottom:44px;padding:20px}
  .gesture-film video{max-height:520px}
  .technique-mobile .hero h1{font-size:clamp(2.8rem,13vw,4rem)!important;line-height:.94!important}
}

/* Base commune aux nouvelles pages autonomes V6. */
.standalone-v6,
.standalone-v6 *{box-sizing:border-box}
.standalone-v6{margin:0;background:var(--cream);color:var(--black);font-family:var(--sans);line-height:1.5}
.standalone-v6 .wrap{width:min(100% - 40px,1180px);margin-inline:auto}
.standalone-v6 a{color:inherit}
.standalone-v6 header{position:sticky;top:0;z-index:20;background:var(--brand);border-bottom:1px solid rgba(244,239,231,.22)}
.standalone-v6 .nav{min-height:80px;display:flex;align-items:center;gap:22px;position:relative}
.standalone-v6 .brand{display:block;width:310px;height:64px;flex:0 0 310px;background:var(--brand) url('/assets/bons-logos/logo-05-petrole-cuivre.svg') left center/contain no-repeat}
.standalone-v6 .nav-links{display:flex;align-items:center;justify-content:flex-end;gap:19px;margin-left:auto;background:transparent}
.standalone-v6 .nav-links a{color:var(--cream);font-size:.66rem;font-weight:800;letter-spacing:.1em;text-decoration:none;text-transform:uppercase}
.standalone-v6 .nav-links a:hover,
.standalone-v6 .nav-links a.active{color:var(--accent)}
.standalone-v6 .menu-toggle{display:none}
.standalone-v6 .tag{color:var(--accent);font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.standalone-v6 .button{display:inline-flex;align-items:center;justify-content:center;min-height:49px;padding:13px 20px;border:1px solid var(--black);background:var(--black);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-decoration:none;text-transform:uppercase}
.standalone-v6 .button:hover{background:var(--accent);border-color:var(--accent);color:var(--black)}
.standalone-v6 .footer{padding:27px 0;background:var(--brand-deep);color:var(--cream);font-size:.72rem}
.standalone-v6 .footer .wrap{display:flex;justify-content:space-between;gap:22px}
.standalone-v6 .chat-cta{position:fixed;right:18px;bottom:18px;z-index:18;padding:13px 17px;background:var(--accent);color:var(--brand-deep);box-shadow:0 8px 25px rgba(0,0,0,.24);font-size:.66rem;font-weight:900;letter-spacing:.08em;text-decoration:none;text-transform:uppercase}

@media(max-width:760px){
  .standalone-v6 .wrap{width:min(100% - 28px,1180px)}
  .standalone-v6 .nav{min-height:72px;gap:0}
  .standalone-v6 .brand{width:calc(100% - 68px);height:64px;flex:0 1 auto}
  .standalone-v6 .menu-toggle{display:flex;width:68px;height:64px;flex:0 0 68px;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:0;background:var(--accent)!important;color:var(--brand-deep)!important;font-size:.54rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
  .standalone-v6 .menu-toggle span{display:block;width:23px;height:2px;background:var(--brand-deep)!important;position:relative}
  .standalone-v6 .menu-toggle span:before,
  .standalone-v6 .menu-toggle span:after{content:"";position:absolute;right:0;height:2px;background:var(--brand-deep)!important}
  .standalone-v6 .menu-toggle span:before{top:-6px;width:23px}
  .standalone-v6 .menu-toggle span:after{top:6px;width:14px}
  .standalone-v6 .nav-links{display:none;position:absolute;top:71px;left:-14px;right:-14px;margin:0;padding:22px 28px 26px;background:var(--cream);border-bottom:1px solid var(--line);box-shadow:0 12px 22px rgba(0,0,0,.12)}
  .standalone-v6 header.menu-open .nav-links{display:grid;gap:17px}
  .standalone-v6 .nav-links a{color:var(--black)}
  .standalone-v6 .footer .wrap{display:block}
  .standalone-v6 .footer .wrap>*+*{display:block;margin-top:4px}
  .standalone-v6 .chat-cta{right:12px;bottom:12px;padding:11px 14px}
}

/* V8 â€” harmonisation pÃ©trole, lisibilitÃ© mobile et conversion */
:root{
  --black:#1f4a4d;
  --ink:#1f4a4d;
  --brand-deep:#1f4a4d;
}

html,
body{background:var(--brand)}

header,
.home-mobile header,
.standalone-v6 header{background:var(--brand)!important}

.menu-toggle,
.home-mobile .menu-toggle,
.standalone-v6 .menu-toggle{
  border:0!important;
  outline:0;
  box-shadow:none!important;
  background:var(--accent)!important;
}

.menu-toggle span,
.menu-toggle span::before,
.menu-toggle span::after{background:var(--brand)!important}

/* Le titre SMP reste graphique, sans sÃ©parateurs blancs. */
.smp-unit + .smp-unit{border-left:0!important}

/* Les fonds sombres reprennent exactement le pÃ©trole du header. */
.hero-intro,
.hero-foot,
.testimonial,
.quote,
.contact-whatsapp,
.salon-media,
.pricing-finish,
.youtube-poster-local,
.technique-mobile .hero,
.technique-mobile .cta,
.histoire-mobile .hero,
.histoire-mobile .cta,
.hygiene-mobile .hero,
.hygiene-mobile .kit,
.hygiene-mobile .certificate,
.hygiene-mobile .cta,
.standalone-v6 .hero,
.standalone-v6 .cta,
.footer{background:var(--brand)!important}

.about-photo{
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  background:var(--white);
}

/* Avis Google : une lecture compacte et centrÃ©e. */
.reviews-grid{
  grid-template-columns:minmax(0,1fr)!important;
  max-width:860px;
  gap:28px!important;
  text-align:center;
}
.reviews-heading h2{max-width:760px;margin:10px auto 0}
.review-copy{max-width:680px!important;margin-inline:auto}
.review-score{
  justify-content:center;
  align-items:center!important;
  gap:18px!important;
  margin:0 auto 22px!important;
  padding:19px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.review-score strong{font-size:clamp(3.2rem,8vw,5.4rem)!important}
.review-score span{max-width:260px!important;text-align:left;line-height:1.45}
.review-actions{justify-content:center}

/* Contact : WhatsApp prioritaire, formulaire clairement proposÃ© en second. */
.contact-heading{max-width:760px;margin:0 auto 34px;text-align:center}
.contact-heading h2{max-width:720px;margin:10px auto 15px;color:var(--cream)}
.contact-heading p{max-width:620px;margin:0 auto;color:#dce8e5}
.contact-options{display:grid;grid-template-columns:.82fr 1.18fr;gap:22px;align-items:start}
.contact-card{
  padding:30px!important;
  background:var(--cream)!important;
  border:0!important;
  color:var(--brand)!important;
}
.contact-card h3{margin:5px 0 12px;font:2rem/1 var(--serif);color:var(--brand)}
.contact-card p{color:#3e5e60!important}
.contact-option-label{color:var(--accent);font-size:.66rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.contact-card .button{
  min-height:54px;
  border:0!important;
  background:var(--accent)!important;
  color:var(--brand)!important;
  box-shadow:7px 7px 0 var(--brand);
}
.contact-card .button:hover{transform:translate(2px,2px);box-shadow:4px 4px 0 var(--brand)}
.contact-phone{margin:20px 0 0!important;text-align:center}
.contact-phone a{color:var(--brand)!important;font-weight:800}
.diagnostic-form label{display:block;margin:14px 0 6px;font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.diagnostic-form input:not([type="checkbox"]),
.diagnostic-form textarea{
  width:100%;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:0;
  background:#fff;
  color:var(--brand);
  font:inherit;
}
.diagnostic-form input[type="file"]{padding:11px!important;background:#fff}
.diagnostic-form .consent{display:flex;align-items:flex-start;gap:10px;margin:15px 0 18px;text-transform:none;letter-spacing:0;font-weight:400}
.diagnostic-form .consent input{margin-top:4px}
.diagnostic-form .button{width:100%}
.form-preview-note{display:block;margin-top:14px;color:#607779;font-size:.68rem;line-height:1.45}
.contact-signature{text-align:center}

/* CTA des pages secondaires : contraste franc et bouton identifiable. */
.technique-mobile .cta h2,
.technique-mobile .cta p,
.histoire-mobile .cta h2,
.histoire-mobile .cta p,
.hygiene-mobile .cta h2,
.hygiene-mobile .cta p,
.standalone-v6 .cta h2,
.standalone-v6 .cta p{color:var(--cream)!important}
.technique-mobile .cta .button,
.histoire-mobile .cta .button,
.hygiene-mobile .cta .button,
.standalone-v6 .cta .button{
  border:0!important;
  background:var(--accent)!important;
  color:var(--brand)!important;
  box-shadow:7px 7px 0 var(--cream);
}
.hygiene-mobile .certificate img{background:var(--brand)!important}

@media(max-width:760px){
  .about-photo{width:100%;max-height:none}
  .reviews-grid{gap:21px!important}
  .reviews-heading h2{font-size:clamp(2.65rem,13vw,4.2rem)}
  .review-score{display:grid!important;grid-template-columns:auto minmax(0,1fr);gap:14px!important;text-align:left}
  .review-score strong{font-size:3.55rem!important}
  .review-score span{font-size:.62rem!important}
  .review-actions{align-items:stretch!important}
  .review-actions a{text-align:center}
  .contact-options{grid-template-columns:1fr}
  .contact-card{padding:24px 20px!important}
  .contact-heading{margin-bottom:24px}
  .contact-card .button{width:100%}
}

/* V5 â€” hiÃ©rarchie, confiance, salon et rythme mobile */
.effect-title{
  display:grid;
  width:max-content;
  margin:12px 0 24px;
  font-family:Georgia,"Times New Roman",serif;
  letter-spacing:-.075em;
}
.effect-title span{
  font-size:clamp(3rem,7vw,5rem);
  line-height:.8;
  color:var(--cream);
}
.effect-title strong{
  margin-left:.48em;
  font-size:clamp(5.2rem,12vw,8.2rem);
  font-weight:400;
  line-height:.76;
  color:var(--accent);
}

.review-score{
  display:flex;
  align-items:flex-end;
  gap:16px;
  margin:0 0 22px;
  padding-bottom:19px;
  border-bottom:1px solid var(--line);
}
.review-score strong{
  font:clamp(3rem,6vw,5.6rem)/.78 Georgia,"Times New Roman",serif;
  letter-spacing:-.07em;
  color:var(--accent);
}
.review-score span{
  max-width:180px;
  font-size:.76rem;
  font-weight:800;
  line-height:1.35;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.review-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 24px;
}
.review-bio-link{
  color:var(--black);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.08em;
  text-decoration:underline;
  text-decoration-color:var(--accent);
  text-decoration-thickness:2px;
  text-underline-offset:5px;
  text-transform:uppercase;
}

.salon{
  padding:84px 0;
  background:var(--mist);
  border-top:1px solid var(--line);
  scroll-margin-top:80px;
}
.salon-grid{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:64px;
  align-items:center;
}
.salon-media{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:430px;
  overflow:hidden;
  padding:28px;
  background:
    linear-gradient(150deg,transparent 48%,rgba(255,255,255,.07) 48% 50%,transparent 50%),
    var(--black);
  color:#fff;
  border-bottom:7px solid var(--accent);
}
.salon-media:before{
  content:"";
  position:absolute;
  width:160px;
  height:160px;
  top:42px;
  right:38px;
  border:1px solid color-mix(in srgb,var(--accent) 65%,transparent);
  transform:rotate(15deg);
}
.salon-media span,
.salon-media strong{position:relative;z-index:1}
.salon-media span{
  margin-bottom:8px;
  color:var(--accent);
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.salon-media strong{
  max-width:280px;
  font:2.2rem/.95 Georgia,"Times New Roman",serif;
}
.salon-copy h2{
  max-width:600px;
  margin:12px 0 22px;
  font:clamp(2.5rem,4.8vw,4.7rem)/.94 Georgia,"Times New Roman",serif;
  letter-spacing:-.06em;
}
.salon-copy p{max-width:610px}
.salon-copy address{
  margin:24px 0 18px;
  padding-left:18px;
  border-left:3px solid var(--accent);
  font-style:normal;
}
.salon-facts{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 24px;
}
.salon-facts span{
  padding:7px 10px;
  background:var(--white);
  border:1px solid var(--line);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.salon-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px 22px;
}
.parking-link{
  color:var(--black);
  font-size:.76rem;
  font-weight:800;
  text-decoration:underline;
  text-decoration-color:var(--accent);
  text-decoration-thickness:2px;
  text-underline-offset:5px;
  text-transform:uppercase;
}

.technique-mobile .quote .wrap{
  display:flex;
  justify-content:center;
  text-align:center;
}
.technique-mobile .quote p{
  max-width:760px;
  margin:0;
}

@media(max-width:760px){
  .effect-title{
    margin:10px 0 19px;
  }
  .effect-title span{
    font-size:clamp(2.7rem,14vw,3.7rem);
  }
  .effect-title strong{
    margin-left:.24em;
    font-size:clamp(5.3rem,27vw,7rem);
  }
  .hero-intro{padding-top:25px!important;padding-bottom:21px!important}
  .hero-foot{padding-top:21px!important;padding-bottom:31px!important}

  .testimonial,
  .reviews,
  .method,
  .pricing,
  .quote,
  .about,
  .salon,
  .contact,
  .faq,
  .density{padding-top:52px!important;padding-bottom:52px!important}
  .testimonial-grid,
  .reviews-grid,
  .method-grid,
  .about-grid,
  .salon-grid,
  .contact-grid{gap:27px!important}

  .testimonial-grid>div:first-child,
  .reviews-grid>div:first-child,
  .review-copy{text-align:center}
  .testimonial-grid p,
  .review-copy p{margin-inline:auto}
  .review-score{
    justify-content:center;
    align-items:center;
    gap:11px;
    text-align:left;
  }
  .review-score strong{font-size:3.9rem}
  .review-score span{max-width:145px;font-size:.65rem}
  .review-actions{
    justify-content:center;
  }

  .pricing-main{
    gap:8px!important;
  }
  .pricing-diagram{
    width:min(100%,410px);
    min-height:270px!important;
    margin:0 auto 4px;
    -webkit-mask-size:178% auto!important;
    mask-size:178% auto!important;
    -webkit-mask-position:41% 4%!important;
    mask-position:41% 4%!important;
  }
  .pricing-table-head{text-align:center}

  .salon-grid{grid-template-columns:1fr}
  .salon-media{
    min-height:300px;
    padding:22px;
  }
  .salon-copy{text-align:center}
  .salon-copy p{margin-inline:auto}
  .salon-copy address{
    display:inline-block;
    text-align:left;
  }
  .salon-facts,
  .salon-actions{justify-content:center}
  .salon-actions .button{width:100%}

  .about-grid>div,
  .method-grid>div:first-child,
  .faq-head{text-align:center}
  .about p{margin-inline:auto}
  .technique-mobile .content{padding-top:48px!important;padding-bottom:48px!important}
  .technique-mobile .blocks{gap:18px!important}
  .technique-mobile .block{padding:24px 0!important}
  .technique-mobile .schema{margin-top:42px!important;padding-top:36px!important}
  .technique-mobile .quote{padding:34px 0!important}
  .histoire-mobile main section,
  .hygiene-mobile main section{padding-top:52px!important;padding-bottom:52px!important}
}

/* Le raccourci WhatsApp s'efface au niveau du vrai bloc contact. */
.chat-cta{
  transition:opacity .22s ease,transform .22s ease,background-color .22s ease;
}
.chat-cta.is-suppressed{
  animation:none!important;
  opacity:0!important;
  pointer-events:none;
  transform:translateY(18px)!important;
}

/* V8 — photo réelle du salon et formulaire de diagnostic */
.salon-media.salon-photo{
  display:block;
  min-height:0;
  margin:0;
  padding:0;
  overflow:hidden;
  background:var(--brand)!important;
  border-bottom:7px solid var(--accent);
}
.salon-media.salon-photo:before{display:none}
.salon-photo img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  background:var(--brand);
}
.salon-photo figcaption{
  padding:12px 16px 13px;
  color:var(--white);
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.diagnostic-form .form-preview-note a{
  color:inherit;
  font-weight:800;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

/* V8 â€” verrouillage visuel final */
.smp-unit + .smp-unit{
  border-left:0!important;
}
.menu-toggle,
.home-mobile .menu-toggle,
.standalone-v6 .menu-toggle{
  border:0!important;
  border-top:0!important;
  box-shadow:none!important;
}
.hero-image{
  background:var(--brand)!important;
}

/* V5.1 â€” titre SMP mieux rythmÃ© et tarifs clarifiÃ©s */
.hero .smp-title{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:end;
  gap:clamp(1.5rem,5vw,4rem)!important;
  width:min(100%,690px);
  margin:12px 0 25px!important;
  font:clamp(5.7rem,12vw,8.7rem)/.72 Georgia,"Times New Roman",serif!important;
  letter-spacing:0!important;
}
.hero .smp-title span{
  position:relative;
  display:block;
  min-width:0!important;
  padding:0 0 22px!important;
  line-height:.72;
  text-align:left;
  color:var(--cream);
}
.hero .smp-title span:nth-child(2){color:var(--accent)}
.hero .smp-title span::after{
  content:attr(data-word);
  position:absolute;
  left:0!important;
  right:auto!important;
  bottom:0;
  font:700 .55rem/1 var(--sans);
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--sage);
  white-space:nowrap;
}
.pricing-finish{
  display:block!important;
  margin-top:34px;
  padding:25px 27px 25px 31px!important;
  border-left:4px solid var(--accent);
}
.pricing-finish::before{
  content:"FINITION INCLUSE SI UTILE";
  display:block;
  margin-bottom:10px;
  color:var(--accent);
  font:800 .62rem/1 var(--sans);
  letter-spacing:.13em;
}
.pricing-special{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:34px;
  align-items:start;
  margin-top:18px;
  padding:28px;
  background:var(--mist);
  border-top:1px solid var(--line);
}
.pricing-special-heading > span{
  display:block;
  margin-bottom:9px;
  color:var(--accent);
  font:800 .66rem/1 var(--sans);
  letter-spacing:.13em;
  text-transform:uppercase;
}
.pricing-special h3{
  margin:0;
  font:1.7rem/1 var(--serif);
  letter-spacing:-.035em;
}
.pricing-special-copy p{
  margin:0 0 10px;
  color:#5f5a56;
  font-size:.9rem;
}
.pricing-special .button{margin-top:7px}

@media(max-width:760px){
  .hero .smp-title{
    gap:clamp(1rem,5vw,1.8rem)!important;
    width:100%;
    margin:7px 0 23px!important;
    font-size:clamp(5.2rem,26vw,6.8rem)!important;
  }
  .hero .smp-title span{padding-bottom:20px!important}
  .hero .smp-title span::after{
    font-size:clamp(.42rem,2vw,.52rem);
    letter-spacing:.07em;
  }
  .pricing-finish{
    margin-top:24px!important;
    padding:20px 18px 20px 21px!important;
  }
  .pricing-special{
    grid-template-columns:1fr;
    gap:15px;
    padding:22px 18px;
  }
  .pricing-special h3{font-size:1.5rem}
  .price-scope small{font-size:.73rem;line-height:1.25}
}

html{background:var(--brand)}
body{
  background:var(--cream);
  color:var(--black);
  line-height:1.5;
}
header{
  background:var(--brand);
  border-bottom-color:rgba(245,238,232,.28);
  box-shadow:0 5px 18px rgba(23,33,29,.16);
}
.nav > a:first-child,
.brand{
  background:var(--brand) url('/assets/bons-logos/logo-05-petrole-cuivre.png') left center/contain no-repeat;
}
.nav > a:first-child img{display:none}
.menu-toggle{
  background:var(--accent);
  color:var(--brand-deep);
  border:0!important;
  border-left-color:transparent;
}
.menu-toggle span,
.menu-toggle span:after{background:var(--brand-deep)}
.menu-toggle span{border:0!important}
.nav-links{background:var(--cream)}
.nav-links a{color:var(--black)}
.nav-links a:hover,
.nav-links a.active{color:var(--brand)}

.tag,
.eyebrow,
.hero h1 em,
.number,
.era-year,
.session-count b,
.pricing-phase small,
.faq-item summary:after,
.shave-rule span,
.kit-note,
.framework-list b,
.certificate strong{color:var(--accent)}
.hero,
.hero-grid,
.hero-intro,
.hero-foot,
.testimonial,
.kit,
.pricing-finish,
.shave-rule{background:var(--ink)}
.hero-rule,
.quote,
.cta{background:var(--brand)}
.hero-rule{background:var(--accent)}
.hero p,
.hero-sub{color:var(--sage)}

.button,
.chat-cta,
.chat{
  background:var(--brand);
  border-color:var(--brand);
  color:var(--cream);
}
.button:hover,
.button:focus-visible,
.chat-cta:hover,
.chat-cta:focus-visible,
.chat:hover,
.chat:focus-visible{
  background:var(--accent);
  border-color:var(--accent);
  color:var(--ink);
}
.quote{color:var(--cream)}
.quote strong,
.quote .quote-mark{color:var(--accent)}
.method,
.modern,
.certificates{background:var(--mist)}
.reviews,
.about,
.pricing,
.density,
.pillar,
.principle,
.note{background:var(--white)}
.price-zone,
.method-index,
.result-text .facts > div:first-child{background:var(--brand);color:var(--cream)}
.pricing-diagram{background:var(--accent)}
.pricing-phase{border-color:var(--accent)}
.pricing-finish-mark{border-color:var(--accent);color:var(--accent)}
.pricing-note{background:var(--mist);border-color:var(--line)}
.faq-item[open]{border-color:var(--accent)}
.text-link,
.review-link,
.reviews-link,
.note a{color:var(--brand)}
.footer{background:var(--brand);color:var(--cream)}
.footer a{color:var(--cream)}

.hero-montage{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#050706;
}
.hero-montage:after{display:none}
.hero-montage figure{margin:0}
.hero-montage .hero-after{
  position:absolute;
  inset:0;
  display:block;
  background:#050706;
}
.hero-montage .hero-after img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center top;
}
.hero-montage .hero-before{
  position:absolute;
  z-index:2;
  left:18px;
  bottom:18px;
  width:32%;
  max-width:215px;
  overflow:hidden;
  background:#050706;
  border:2px solid var(--accent);
  box-shadow:0 12px 30px rgba(0,0,0,.42);
}
.hero-montage .hero-before img{
  display:block;
  width:100%;
  height:auto;
}
.hero-montage figcaption{
  position:absolute;
  z-index:3;
  padding:7px 9px;
  background:rgba(16,46,49,.92);
  color:var(--cream);
  font-size:.58rem;
  font-weight:800;
  letter-spacing:.12em;
  line-height:1;
  text-transform:uppercase;
}
.hero-montage .hero-after figcaption{
  right:16px;
  bottom:16px;
  border-left:3px solid var(--accent);
}
.hero-montage .hero-before figcaption{
  left:0;
  top:0;
  background:var(--accent);
  color:var(--ink);
}
.gesture-film{
  display:grid;
  grid-template-columns:minmax(220px,.62fr) minmax(0,1.38fr);
  gap:34px;
  align-items:end;
  margin:0 0 70px;
  padding:28px;
  background:var(--ink);
  color:var(--cream);
}
.gesture-film-copy h2{
  margin:10px 0 14px;
  font:clamp(2.3rem,4vw,4rem)/.92 Georgia,"Times New Roman",serif;
  letter-spacing:-.055em;
}
.gesture-film-copy p{
  margin:0;
  color:var(--sage);
  font-size:.92rem;
}
.gesture-film video{
  display:block;
  width:100%;
  height:auto;
  max-height:650px;
  object-fit:contain;
  background:#000;
  border-bottom:5px solid var(--accent);
}

@media(max-width:760px){
  .wrap{
    width:min(100% - 24px,1100px);
  }

  /* Header compact et continu */
  header .wrap{width:calc(100% - 24px)}
  .nav{
    height:70px;
    gap:0;
  }
  .nav > a:first-child,
  .brand{
    width:calc(100% - 62px);
    height:70px;
    flex:0 1 auto;
    background-position:left center;
  }
  .menu-toggle{
    width:62px;
    height:70px;
    flex:0 0 62px;
    padding:0;
    border:0;
    border-left:1px solid rgba(245,238,232,.25);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
    font-size:.52rem;
  }
  .nav-links{
    top:69px;
    left:-12px;
    right:-12px;
    padding:16px 22px 18px;
    gap:14px!important;
  }

  /* Rythme vertical gÃ©nÃ©ral */
  .proof,
  .reviews,
  .testimonial,
  .method,
  .pricing,
  .about,
  .contact,
  .faq,
  .density,
  .content,
  .timeline,
  .modern,
  .kit,
  .certificates,
  .framework,
  .cta{
    padding:50px 0!important;
  }
  .gallery{padding:0 0 50px!important}
  .quote{padding:50px 0!important}
  .footer{padding:20px 0}

  h2{margin-top:8px!important;margin-bottom:14px!important}
  p{margin-top:0}
  .tag{line-height:1.25}

  /* Accueil */
  .hero{padding:12px 0 0!important}
  .hero-grid{border-radius:0}
  .hero-intro{
    padding:22px 14px 18px!important;
  }
  .hero-rule{
    height:7px;
    margin:0 0 20px;
  }
  .hero h1{
    margin:0 0 18px!important;
    font-size:clamp(3.95rem,20vw,5.2rem)!important;
    line-height:.77!important;
  }
  .hero-sub,
  .hero-intro > p{
    max-width:18em;
    margin:0;
    font-size:1.08rem!important;
    line-height:1.4;
  }
  .hero-image{
    min-height:0!important;
    aspect-ratio:1/1.26;
  }
  .hero-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center top;
  }
  .hero-montage .hero-before{
    left:12px;
    bottom:12px;
    width:34%;
    border-width:2px;
  }
  .hero-montage .hero-after figcaption{
    right:12px;
    bottom:12px;
  }
  .gesture-film{
    grid-template-columns:1fr;
    gap:18px;
    margin:0 0 42px;
    padding:18px 14px 14px;
  }
  .gesture-film-copy h2{
    margin:8px 0 10px!important;
    font-size:2.45rem!important;
    line-height:.92!important;
  }
  .gesture-film video{
    width:100%;
    max-height:none;
  }
  .hero-foot{
    padding:17px 14px 24px!important;
  }
  .hero-foot .button{margin-top:14px}
  .hero-foot small{margin-top:10px}

  .intro{max-width:none}
  .intro h2{
    font-size:clamp(2.45rem,12vw,3.25rem)!important;
    line-height:.94!important;
  }
  .intro-note{margin-top:14px}
  .proof-grid,
  .reviews-grid,
  .testimonial-grid,
  .method-grid,
  .about-grid,
  .contact-grid,
  .density-grid{
    gap:22px!important;
  }
  .proof-grid{margin-top:28px!important}
  .result-text h3{margin:8px 0 12px}
  .result-text p{margin-bottom:14px}
  .rule{margin:18px 0}
  .facts{gap:1px}
  .facts > div{padding:18px}
  .whatsapp-main{margin-top:22px}
  .whatsapp-main .button,
  .about .button,
  .contact .button,
  .cta .button{width:100%}

  .reviews h2,
  .testimonial h2,
  .gallery h2,
  .method h2,
  .about h2,
  .contact h2,
  .faq h2,
  .density h2,
  .pricing h2{
    font-size:clamp(2.35rem,11vw,3.15rem)!important;
    line-height:.94!important;
  }
  .review-copy p{margin-bottom:12px}
  .review-note{margin-top:9px}
  .testimonial-grid p{margin-bottom:13px}
  .youtube-player{min-height:0;aspect-ratio:16/9}

  .gallery-head{margin-bottom:16px!important}
  .gallery-head p{margin-top:10px!important}
  .gallery-track{
    grid-auto-columns:88%!important;
    gap:12px!important;
    padding-bottom:8px!important;
  }
  .gallery-card figcaption{padding:12px 2px 0}
  .gallery-card.gallery-video video{height:285px!important}
  .gallery-note{margin:12px 0 0}

  .steps{margin-top:2px}
  .step{
    gap:13px;
    padding:18px 0!important;
  }
  .step h3{margin:0 0 6px}
  .step p{margin:0}

  .pricing-opening{
    gap:12px!important;
    padding-bottom:20px!important;
  }
  .session-count b{font-size:5rem!important}
  .pricing-progress{padding:18px 0!important}
  .pricing-phase{padding:12px 0!important}
  .pricing-main{gap:2px!important}
  .pricing-diagram{min-height:188px!important}
  .pricing-table-head{margin-bottom:10px}
  .price-row{padding:11px 0!important}
  .price-amount{font-size:1.28rem!important}
  .pricing-finish{
    margin-top:24px!important;
    padding:18px 16px!important;
  }
  .pricing-maintenance{margin-top:12px!important}

  .about-photo{margin-bottom:0}
  .about-grid p{margin-bottom:12px}
  .contact-grid address{margin-top:20px}
  .form{padding:20px!important}
  .form label{margin-top:10px}
  .form input,
  .form textarea{padding:12px}
  .form textarea{min-height:120px}
  .faq-head{gap:12px!important}
  .faq-list{margin-top:24px!important}
  .faq-item summary{padding:16px 0!important}
  .faq-item p{margin-bottom:16px!important}
  .faq-cta{margin-top:22px!important}
  .shave-rule{padding:22px 0!important}

  /* Pages Le geste et Origines */
  .technique-mobile > main > .hero,
  .histoire-mobile > main > .hero,
  .hygiene-mobile > main > .hero{
    padding:42px 0 36px!important;
  }
  .technique-mobile > main > .hero h1,
  .histoire-mobile > main > .hero h1,
  .hygiene-mobile > main > .hero h1{
    margin:10px 0 14px!important;
    font-size:clamp(3.7rem,18vw,4.8rem)!important;
  }
  .technique-mobile > main > .hero p,
  .histoire-mobile > main > .hero p,
  .hygiene-mobile > main > .hero p{
    margin:0;
    font-size:1rem!important;
    line-height:1.45;
  }
  .lead{
    margin:0 0 30px!important;
    font-size:1.03rem!important;
  }
  .blocks{gap:0!important}
  .block{
    padding:18px 0!important;
  }
  .block h2{
    margin:7px 0 9px!important;
    font-size:1.75rem!important;
  }
  .schema{
    margin:30px 0 0!important;
    padding:14px!important;
    gap:18px!important;
  }
  .schema h2{font-size:2.35rem!important}
  .schema p{margin-bottom:11px}
  .timeline-intro{
    margin:0 0 28px!important;
    font-size:1.03rem!important;
  }
  .era{
    gap:7px!important;
    padding:20px 0!important;
  }
  .era h2{
    margin:0 0 9px!important;
    font-size:2rem!important;
  }
  .pillars{
    gap:12px!important;
    margin-top:22px!important;
  }
  .pillar{padding:19px!important}

  /* Page HygiÃ¨ne */
  .hygiene-mobile .hero-grid{gap:20px!important}
  .hygiene-mobile .seal{
    width:120px!important;
    margin-top:2px;
  }
  .hygiene-mobile .seal strong{font-size:2rem!important}
  .hygiene-mobile .seal span{font-size:.44rem!important}
  .hygiene-mobile .intro{
    padding:44px 0 28px!important;
    gap:14px!important;
  }
  .hygiene-mobile .intro p{font-size:1rem!important}
  .hygiene-mobile .principles{gap:1px}
  .hygiene-mobile .principle{padding:20px!important}
  .hygiene-mobile .principle h3{margin:10px 0 6px!important}
  .hygiene-mobile .kit-grid,
  .hygiene-mobile .framework-grid{gap:18px!important}
  .hygiene-mobile .kit-copy{
    padding:18px 0!important;
  }
  .hygiene-mobile .kit-list{
    gap:7px!important;
    margin-top:16px!important;
  }
  .hygiene-mobile .kit-note{margin-top:13px!important}
  .hygiene-mobile .certificates-head{margin-bottom:20px!important}
  .hygiene-mobile .certificates-head p{margin-top:10px!important}
  .hygiene-mobile .certificate-grid{gap:12px!important}
  .hygiene-mobile .certificate{padding:10px!important}
  .hygiene-mobile .certificate figcaption{padding:10px 2px 2px!important}
  .hygiene-mobile .framework-list{margin-top:20px!important}
  .hygiene-mobile .framework-list article{
    grid-template-columns:38px 1fr!important;
    gap:10px!important;
    padding:16px 0!important;
  }
  .hygiene-mobile .note{
    margin-top:22px!important;
    padding:16px!important;
  }
  .cta p{margin-bottom:20px!important}
  .footer .wrap>*+*{margin-top:4px!important}

  .chat,
  .chat-cta{
    right:12px!important;
    bottom:12px!important;
    padding:11px 14px!important;
  }
}

/* V6 â€” parcours plus court, titre SMP 05 et conversion WhatsApp */
.smp-05{margin:26px 0 22px!important;max-width:650px}
.smp-word{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:8px solid var(--accent)}
.smp-unit{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:16px 12px 0}
.smp-unit+ .smp-unit{border-left:1px solid rgba(255,255,255,.2)}
.smp-unit strong{font:clamp(4.6rem,8vw,8rem)/.76 var(--serif);letter-spacing:-.09em;color:#fff}
.smp-unit span{margin-top:12px;font-size:.6rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--accent)}
.youtube-poster{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#000}
.youtube-poster img{width:100%;height:100%;display:block;object-fit:cover;opacity:.82}
.youtube-poster span{position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;place-items:center;width:66px;height:66px;border-radius:50%;background:var(--accent);color:#fff;font-size:1.35rem;box-shadow:0 8px 30px rgba(0,0,0,.3)}
.youtube-poster-local{display:grid;place-content:center;text-align:center;color:#fff;background:linear-gradient(145deg,var(--brand-deep),#050807);text-decoration:none}
.youtube-poster-local:before{content:"";position:absolute;inset:18px;border:1px solid rgba(201,111,74,.45)}
.youtube-poster-local strong{font:clamp(2rem,5vw,4rem)/.95 var(--serif);letter-spacing:-.045em}
.youtube-poster-local small{margin-top:10px;color:#cfc9c2;font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.youtube-poster-local span{top:auto;bottom:24px}
.gallery-card{content-visibility:visible!important;contain-intrinsic-size:auto!important}
.reviews-grid{align-items:start!important}
.reviews .tag{margin:0 0 8px;line-height:1}
.review-score{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.review-score strong{font:2.35rem/1 var(--serif);color:var(--accent)}
.review-score span{font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.review-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.review-bio-link,.text-link{display:inline-block;color:inherit;font-size:.75rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:5px}
.pricing-teaser,.faq-teaser{padding:86px 0;background:var(--white);border-top:1px solid var(--line)}
.pricing-teaser-grid,.faq-teaser-grid{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end}
.pricing-teaser h2,.faq-teaser h2{font:clamp(2.4rem,4.7vw,4.7rem)/.94 var(--serif);letter-spacing:-.055em;margin:12px 0 0}
.pricing-teaser p,.faq-teaser p{margin:0 0 24px;max-width:520px}
.faq-teaser{background:var(--mist)}
.contact-whatsapp{background:var(--black);color:#fff}
.contact-whatsapp h2{color:#fff}
.contact-whatsapp p{color:#d7d1cc}
.contact-signature{margin-top:22px;color:var(--accent);font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.contact-card{padding:34px;background:#211d20;border:1px solid #4b4247}
.contact-card .button{width:100%;background:var(--accent);border-color:var(--accent)}
.contact-card .button:hover{background:#fff;color:var(--black);border-color:#fff}
.contact-card address{margin-top:25px;color:#cfc7c3}
.contact-card a:not(.button){color:#fff}
/* Le contenu complet existe dÃ©sormais sur des pages dÃ©diÃ©es. */
.faq,.density,.shave-rule{display:none}

@media(max-width:760px){
  .smp-word{border-top-width:6px}
  .smp-unit{padding:14px 7px 0}
  .smp-unit strong{font-size:4.75rem}
  .smp-unit span{font-size:.51rem;letter-spacing:.08em}
  .pricing-teaser,.faq-teaser{padding:58px 0}
  .pricing-teaser-grid,.faq-teaser-grid{grid-template-columns:1fr;gap:22px}
  .pricing-teaser h2,.faq-teaser h2{font-size:2.75rem}
  .youtube-poster span{width:54px;height:54px}
  .review-actions{align-items:flex-start;flex-direction:column;gap:14px}
  .contact-card{padding:24px 20px}
}

/* V4 â€” finition mobile : header franc, nouveau titre et rythme resserrÃ© */
.menu-toggle{
  background:var(--accent)!important;
  border:0!important;
  color:var(--ink)!important;
}
.menu-toggle span{
  width:23px!important;
  height:2px!important;
  margin:4px 0 0!important;
  border:0!important;
  background:var(--ink)!important;
  position:relative;
}
.menu-toggle span:before,
.menu-toggle span:after{
  content:"";
  position:absolute;
  right:0;
  height:2px!important;
  background:var(--ink)!important;
}
.menu-toggle span:before{top:-6px;width:23px}
.menu-toggle span:after{top:6px!important;width:14px!important}

.smp-title{
  display:flex;
  align-items:flex-end;
  gap:.08em;
  margin:7px 0 26px;
  font:clamp(5.6rem,12vw,8.6rem)/.72 Georgia,"Times New Roman",serif;
  letter-spacing:-.08em;
}
.smp-title span{
  position:relative;
  display:inline-block;
  min-width:.62em;
  padding-bottom:19px;
  color:var(--cream);
}
.smp-title span:nth-child(2){color:var(--accent)}
.smp-title span:after{
  content:attr(data-word);
  position:absolute;
  left:.12em;
  bottom:0;
  font:800 .55rem/1 Arial,sans-serif;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--sage);
}
.smp-title span:last-child:after{left:auto;right:-.05em}

.results-gallery{padding-bottom:78px}
.results-gallery .gallery-head{
  margin-top:44px;
  padding-top:34px;
  border-top:1px solid var(--line);
}
.results-gallery .gallery-head h3{
  margin:8px 0 10px;
  font:clamp(2.5rem,5vw,4.4rem)/.94 Georgia,"Times New Roman",serif;
  letter-spacing:-.055em;
}
.results-gallery .gallery-head p{max-width:620px}
.gallery-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 18px;
  margin-top:20px;
}
.gallery-actions p{margin:0;color:var(--stone);font-size:.86rem}
.gallery-actions a{
  color:var(--brand);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.09em;
  text-decoration-color:var(--accent);
  text-decoration-thickness:2px;
  text-transform:uppercase;
  text-underline-offset:5px;
}

.technique-mobile .quote{padding:44px 0!important}
.technique-mobile .cta{padding:48px 0 72px!important}
.technique-mobile .cta .button{
  width:min(100%,420px);
  background:var(--accent)!important;
  border:2px solid var(--ink)!important;
  box-shadow:5px 5px 0 var(--ink);
  color:var(--ink)!important;
}
.hygiene-mobile .seal{
  justify-self:center!important;
  margin-inline:auto!important;
}

@media(max-width:760px){
  .smp-title{
    gap:.03em;
    margin:5px 0 22px;
    font-size:clamp(5.4rem,28vw,7rem);
  }
  .smp-title span{
    min-width:.59em;
    padding-bottom:18px;
  }
  .smp-title span:after{
    left:.06em;
    font-size:.46rem;
    letter-spacing:.08em;
  }
  .smp-title span:last-child:after{right:-.18em}
  .results-gallery{padding:46px 0 50px!important}
  .results-gallery .proof-grid{margin-top:22px!important}
  .results-gallery .gallery-head{
    margin-top:32px!important;
    padding-top:26px;
  }
  .results-gallery .gallery-head h3{
    font-size:clamp(2.35rem,12vw,3.2rem);
  }
  .gallery-actions{
    display:block;
    margin-top:17px;
  }
  .gallery-actions p{margin-bottom:9px}
  .technique-mobile .quote{padding:36px 0!important}
  .technique-mobile .cta{padding:42px 0 62px!important}
  .hygiene-mobile .hero-grid{text-align:center}
}

/* V5 final overrides â€” placÃ©s aprÃ¨s les rÃ¨gles historiques */
@media(max-width:760px){
  .hero-intro{padding-top:25px!important;padding-bottom:21px!important}
  .hero-foot{padding-top:21px!important;padding-bottom:31px!important}
  .testimonial,
  .reviews,
  .method,
  .pricing,
  .quote,
  .about,
  .salon,
  .contact,
  .faq,
  .density{padding-top:52px!important;padding-bottom:52px!important}
  .testimonial-grid,
  .reviews-grid,
  .method-grid,
  .about-grid,
  .salon-grid,
  .contact-grid{gap:27px!important}
  .pricing-main{gap:8px!important}
  .pricing-diagram{
    width:min(100%,410px);
    min-height:270px!important;
    margin:0 auto 4px;
    -webkit-mask-size:178% auto!important;
    mask-size:178% auto!important;
    -webkit-mask-position:41% 4%!important;
    mask-position:41% 4%!important;
  }
  .pricing-table-head{text-align:center}
  .technique-mobile .content{padding-top:48px!important;padding-bottom:48px!important}
  .technique-mobile .blocks{gap:18px!important}
  .technique-mobile .block{padding:24px 0!important}
  .technique-mobile .schema{margin-top:42px!important;padding-top:36px!important}
  .technique-mobile .quote{padding:34px 0!important}
  .histoire-mobile main section,
  .hygiene-mobile main section{padding-top:52px!important;padding-bottom:52px!important}
}


/* Source preserved: assets/site-v12-v3.css */
/* JM.Micro — V12 v3 test
   Couche commune et volontairement prioritaire pour stabiliser l'identité,
   le responsive, les ancres et les composants partagés de la V12. */

:root {
  --site-brand: #1f4a4d;
  --site-brand-deep: #163c3f;
  --site-cream: #f4efe7;
  --site-white: #fbf8f2;
  --site-mist: #dde7e4;
  --site-accent: #f36f21;
  --site-accent-readable: #f36f21;
  --site-accent-on-dark: #f36f21;
  --site-line: #b9cbc6;
  --site-text: #173f42;
  --site-muted: #536f70;
  --site-header-height: 108px;
}

html {
  scroll-padding-top: calc(var(--site-header-height) + 18px);
}

body.v12-v3 {
  overflow-x: clip;
  background: var(--site-cream);
  color: var(--site-text);
}

.v12-v3 [id] {
  /* Le décalage commun est déjà porté par scroll-padding-top sur html.
     Le dupliquer ici plaçait certaines ancres mobiles trop bas. */
  scroll-margin-top: 0;
}

.v12-v3 img,
.v12-v3 video,
.v12-v3 iframe {
  max-width: 100%;
}

.v12-v3 .skip-link {
  position: fixed;
  z-index: 9999;
  top: 8px;
  left: 8px;
  padding: 11px 15px;
  background: var(--site-cream);
  color: var(--site-brand);
  font-weight: 800;
  text-decoration: none;
  transform: translateY(-160%);
}

.v12-v3 .skip-link:focus {
  transform: translateY(0);
}

.v12-v3 :focus-visible {
  outline: 3px solid var(--site-accent) !important;
  outline-offset: 4px;
}

/* En-tête commun : logo plus lisible, aucun rectangle autour du menu. */
.v12-v3 #site-header {
  position: sticky;
  z-index: 1000;
  top: 0;
  min-height: var(--site-header-height);
  background: var(--site-brand) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(244, 239, 231, .2) !important;
  box-shadow: 0 5px 18px rgba(20, 45, 47, .15);
  backdrop-filter: none !important;
}

.v12-v3 #site-header .wrap {
  width: min(1280px, calc(100% - 40px)) !important;
}

.v12-v3 #site-header .nav {
  min-height: var(--site-header-height) !important;
  height: var(--site-header-height) !important;
  display: flex;
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
}

.v12-v3 #site-header .brand,
.v12-v3 #site-header .nav > a:first-child {
  display: flex !important;
  align-items: center;
  width: clamp(300px, 25vw, 365px) !important;
  height: 98px !important;
  flex: 0 0 clamp(300px, 25vw, 365px) !important;
  background: none !important;
  mix-blend-mode: normal !important;
}

.v12-v3 #site-header .brand img,
.v12-v3 #site-header .nav > a:first-child img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 98px !important;
  object-fit: contain;
  object-position: left center;
  mix-blend-mode: normal !important;
}

.v12-v3 #site-navigation,
.v12-v3 #site-header .nav-links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(14px, 1.55vw, 24px);
  margin-left: auto;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.v12-v3 #site-navigation a {
  padding: 10px 0;
  color: var(--site-cream) !important;
  font-size: clamp(.61rem, .66vw, .69rem) !important;
  font-weight: 800;
  letter-spacing: .1em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

.v12-v3 #site-navigation a:hover,
.v12-v3 #site-navigation a.active,
.v12-v3 #site-navigation a[aria-current="page"] {
  color: var(--site-accent-on-dark) !important;
}

.v12-v3 .hero .tag,
.v12-v3 .hero h1 em,
.v12-v3 .testimonial .tag,
.v12-v3 .contact .tag,
.v12-v3 .gesture-film .tag,
.v12-v3 .cta .tag {
  color: var(--site-accent-on-dark) !important;
}

.v12-v3 .menu-toggle {
  display: none !important;
}

/* Rythme commun plus compact. */
.v12-v3.home-mobile .proof,
.v12-v3.home-mobile .reviews,
.v12-v3.home-mobile .method,
.v12-v3.home-mobile .about,
.v12-v3.home-mobile .salon,
.v12-v3.home-mobile .testimonial,
.v12-v3.home-mobile .faq-teaser,
.v12-v3.home-mobile .contact {
  padding-top: clamp(62px, 6.5vw, 84px) !important;
  padding-bottom: clamp(62px, 6.5vw, 84px) !important;
}

.v12-v3 .hero-montage .hero-after img,
.v12-v3 .hero-montage .hero-before img {
  display: block;
}

/* Accueil : un parcours court, orienté preuve puis prise de contact. */
.v12-v3.home-mobile .hero-cta {
  border-color: var(--site-accent-readable) !important;
  background: var(--site-accent-readable) !important;
  color: var(--site-brand-deep) !important;
}

.v12-v3.home-mobile .hero-cta:hover,
.v12-v3.home-mobile .hero-cta:focus-visible {
  border-color: var(--site-cream) !important;
  background: var(--site-cream) !important;
}

.v12-v3 .results-gallery .intro {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(340px, 1.05fr);
  gap: 24px clamp(42px, 6vw, 86px);
  max-width: none;
  align-items: start;
}

.v12-v3 .results-gallery .intro h2 {
  grid-row: 1 / span 2;
  margin-top: 0;
}

.v12-v3 .results-gallery .intro > p {
  max-width: 590px;
  padding-top: 10px;
}

.v12-v3 .proof-signals {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 2px 0 0;
  padding: 0;
  border-top: 1px solid var(--site-line);
  list-style: none;
}

.v12-v3 .proof-signals li {
  display: grid;
  grid-template-columns: minmax(118px, .42fr) 1fr;
  gap: 16px;
  padding: 13px 0;
  border-bottom: 1px solid var(--site-line);
}

.v12-v3 .proof-signals strong {
  color: var(--site-accent);
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.v12-v3 .proof-signals span {
  color: var(--site-muted);
  font-size: .84rem;
}

/* Galerie : visionneuse horizontale sur tous les écrans. */
.v12-v3 .gallery-viewer {
  position: relative;
  margin-top: 10px;
}

.v12-v3 .results-gallery .gallery-track {
  display: flex !important;
  grid-template-columns: none !important;
  grid-auto-flow: initial !important;
  gap: clamp(18px, 2.2vw, 30px) !important;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding: 3px max(1px, calc((100% - min(850px, 82vw)) / 2)) 18px !important;
}

.v12-v3 .results-gallery .gallery-track::-webkit-scrollbar {
  display: none;
}

.v12-v3 .results-gallery .gallery-card {
  flex: 0 0 min(850px, 82vw) !important;
  width: min(850px, 82vw) !important;
  content-visibility: visible !important;
  contain-intrinsic-size: none !important;
  scroll-snap-align: center;
  scroll-snap-stop: always;
}

.v12-v3 .results-gallery .gallery-card img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-height: min(68vh, 720px);
  margin: 0 auto;
  object-fit: contain !important;
  background: var(--site-white);
  cursor: zoom-in;
}

.v12-v3 .results-gallery .gallery-card figcaption {
  max-width: 760px;
  padding: 15px 2px 2px !important;
  color: var(--site-text);
  font-size: .86rem !important;
}

.v12-v3 .gallery-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 6px;
}

.v12-v3 .gallery-control {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid var(--site-brand);
  border-radius: 50%;
  background: transparent;
  color: var(--site-brand);
  cursor: pointer;
  font-size: 1.35rem;
}

.v12-v3 .gallery-control:hover {
  background: var(--site-brand);
  color: var(--site-cream);
}

.v12-v3 .gallery-status {
  min-width: 64px;
  color: var(--site-muted);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-align: center;
}

.v12-v3 .gallery-lightbox {
  width: min(1100px, calc(100% - 32px));
  max-width: 1100px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--site-cream);
}

.v12-v3 .gallery-lightbox::backdrop {
  background: rgba(8, 24, 25, .93);
}

.v12-v3 .lightbox-inner {
  position: relative;
  padding: 52px 14px 20px;
}

.v12-v3 .lightbox-inner img {
  display: block;
  width: 100%;
  max-height: calc(100vh - 150px);
  object-fit: contain;
}

.v12-v3 .lightbox-caption {
  max-width: 780px;
  margin: 14px auto 0;
  text-align: center;
}

.v12-v3 .lightbox-close {
  position: absolute;
  top: 0;
  right: 8px;
  width: 44px;
  height: 44px;
  border: 1px solid var(--site-cream);
  border-radius: 50%;
  background: var(--site-brand);
  color: var(--site-cream);
  cursor: pointer;
  font-size: 1.35rem;
}

/* Témoignage : une vraie vignette, puis chargement de YouTube au clic. */
.v12-v3 .testimonial-grid {
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr) !important;
  gap: clamp(36px, 5vw, 72px) !important;
}

.v12-v3 .testimonial-cta {
  display: inline-block;
  margin-top: 10px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--site-accent);
  color: var(--site-cream);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}

.v12-v3 .youtube-consent {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  width: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(244, 239, 231, .38);
  background: #071617;
  color: var(--site-cream);
  cursor: pointer;
  text-align: left;
}

.v12-v3 .youtube-consent::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(7, 22, 23, .62), rgba(7, 22, 23, .05) 62%), linear-gradient(0deg, rgba(7, 22, 23, .72), transparent 55%);
}

.v12-v3 .youtube-consent img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease, filter .25s ease;
}

.v12-v3 .youtube-consent:hover img {
  filter: saturate(1.05) contrast(1.04);
  transform: scale(1.015);
}

.v12-v3 .youtube-play {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 74px;
  height: 74px;
  margin: 0;
  border: 2px solid var(--site-accent);
  border-radius: 50%;
  background: rgba(22, 60, 63, .9);
  color: var(--site-accent);
  font-size: 1.8rem;
  transform: translate(-50%, -50%);
}

.v12-v3 .youtube-label {
  position: absolute;
  z-index: 2;
  right: 22px;
  bottom: 20px;
  left: 22px;
}

.v12-v3 .youtube-label strong,
.v12-v3 .youtube-label small {
  display: block;
}

.v12-v3 .youtube-label strong {
  font: 1.5rem/1.2 var(--serif);
}

.v12-v3 .youtube-label small {
  margin-top: 4px;
  color: #d7dfdb;
  font-size: .7rem;
}

.v12-v3 .youtube-player {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}

/* Page Le geste. */
.v12-v3.technique-mobile .hero h1 {
  max-width: none !important;
  font-size: clamp(4.2rem, 9vw, 8rem) !important;
  line-height: .92 !important;
  letter-spacing: -.075em !important;
}

.v12-v3.technique-mobile .content {
  padding-bottom: 58px !important;
}

.v12-v3.technique-mobile .schema {
  margin-bottom: 0 !important;
}

.v12-v3 .gesture-film {
  grid-template-columns: minmax(300px, 1fr) minmax(260px, .62fr) !important;
  align-items: center !important;
  gap: clamp(34px, 5vw, 76px) !important;
  width: min(1000px, calc(100% - 40px)) !important;
  max-width: 1000px !important;
  margin: 0 auto clamp(64px, 6vw, 92px) !important;
  padding: clamp(28px, 4vw, 56px) !important;
}

.v12-v3 .gesture-film-copy {
  max-width: 470px;
}

.v12-v3 .gesture-film video {
  justify-self: center;
  width: min(100%, 310px) !important;
  height: auto !important;
  max-height: 550px !important;
  aspect-ratio: 406 / 720;
  border: 1px solid rgba(244, 239, 231, .22) !important;
  border-bottom: 5px solid var(--site-accent) !important;
  background: #050606;
  box-shadow: 0 20px 45px rgba(7, 22, 23, .22);
  object-fit: contain !important;
}

/* Tarifs : schéma réellement affiché et mieux équilibré. */
.v12-v3 .rates-grid {
  grid-template-columns: minmax(430px, .95fr) minmax(0, 1.05fr) !important;
  align-items: start !important;
  gap: clamp(45px, 6vw, 90px) !important;
}

.v12-v3 .zones-figure {
  display: block !important;
  min-height: 440px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--site-accent) !important;
  -webkit-mask: url('/assets/schema-zones-original.png') 50% 3% / 230% auto no-repeat !important;
  mask: url('/assets/schema-zones-original.png') 50% 3% / 230% auto no-repeat !important;
}

.v12-v3 .zones-figure img {
  display: none !important;
}

.v12-v3 .maintenance {
  padding: 70px 0 !important;
}

.v12-v3 .maintenance .wrap {
  max-width: 820px;
}

.v12-v3 .maintenance p {
  max-width: 780px !important;
  font-size: 1rem;
}

.v12-v3 .maintenance p + p {
  margin-top: 14px !important;
}

/* FAQ : interligne suffisamment ample pour les hampes et jambages. */
.v12-v3 .faq-page-hero h1 {
  max-width: 1120px !important;
  line-height: 1.01 !important;
  letter-spacing: -.065em !important;
}

/* Contact et page Merci. */
.v12-v3 .contact-main h2 {
  max-width: 760px;
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  line-height: 1 !important;
}

.v12-v3 .contact-layout > *,
.v12-v3 .contact-card {
  min-width: 0;
}

.v12-v3 .contact-card a,
.v12-v3 .footer-address a {
  overflow-wrap: anywhere;
}

.v12-v3 .diagnostic-form input,
.v12-v3 .diagnostic-form textarea,
.v12-v3 .diagnostic-form button {
  min-height: 48px;
}

.v12-v3 .diagnostic-form .privacy-inline {
  color: var(--site-brand) !important;
  font-weight: 800;
}

.v12-v3 .diagnostic-form .form-preview-note a {
  color: var(--site-brand) !important;
  font-weight: 800;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.v12-v3 .diagnostic-form button[type="submit"] {
  border-color: var(--site-accent-readable) !important;
  background: var(--site-accent-readable) !important;
  color: var(--site-brand-deep) !important;
}

.v12-v3 .diagnostic-form button[type="submit"]:hover,
.v12-v3 .diagnostic-form button[type="submit"]:focus-visible {
  border-color: var(--site-brand-deep) !important;
  background: var(--site-brand-deep) !important;
  color: var(--site-cream) !important;
}

.v12-v3 .whatsapp-main.button,
.v12-v3 .whatsapp-button.button {
  border-color: #25d366 !important;
  background: #25d366 !important;
  color: var(--site-brand-deep) !important;
}

.v12-v3 .whatsapp-main.button:hover,
.v12-v3 .whatsapp-main.button:focus-visible,
.v12-v3 .whatsapp-button.button:hover,
.v12-v3 .whatsapp-button.button:focus-visible {
  border-color: #128c7e !important;
  background: #128c7e !important;
  color: #fff !important;
}

.v12-v3 .thank-you-hero h1 {
  color: var(--site-cream) !important;
}

.v12-v3 .map-placeholder {
  display: grid;
  min-height: 360px;
  place-items: center;
  padding: 30px;
  border: 1px solid var(--site-line);
  background: var(--site-mist);
  text-align: center;
}

.v12-v3 .map-placeholder p {
  max-width: 520px;
}

.v12-v3 .map-placeholder > div {
  display: grid;
  justify-items: center;
  gap: 13px;
}

.v12-v3 .map-placeholder strong {
  font: 1.45rem/1.2 var(--serif);
}

.v12-v3 .map-placeholder span {
  color: var(--site-muted);
}

.v12-v3 .map-placeholder .button {
  margin-top: 8px;
}

/* CTA flottants : plus compacts et respect de la zone sûre mobile. */
.v12-v3 .chat-cta,
.v12-v3 .chat {
  z-index: 900 !important;
  right: 18px !important;
  bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  max-width: 220px;
  min-height: 48px;
  border-color: #25d366 !important;
  background: #25d366 !important;
  color: var(--site-brand-deep) !important;
}

.v12-v3 .chat-cta::before,
.v12-v3 .chat::before {
  content: "" !important;
  width: 19px !important;
  height: 19px !important;
  border: 2px solid currentColor !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: inset -4px -4px 0 -3px currentColor;
}

.v12-v3 .chat-cta:hover,
.v12-v3 .chat-cta:focus-visible,
.v12-v3 .chat:hover,
.v12-v3 .chat:focus-visible {
  border-color: #128c7e !important;
  background: #128c7e !important;
  color: #fff !important;
}

.v12-v3 .chat-cta.is-suppressed,
.v12-v3 .chat.is-suppressed {
  opacity: 0 !important;
  visibility: hidden;
  pointer-events: none;
}

/* Pied de page commun, utile et lisible. */
.v12-v3 .site-footer,
.v12-v3 .footer.site-footer {
  padding: 58px 0 24px !important;
  background: var(--site-brand) !important;
  color: var(--site-cream) !important;
}

.v12-v3 .site-footer .footer-grid {
  display: grid !important;
  grid-template-columns: 1.05fr 1fr 1fr;
  gap: clamp(34px, 5vw, 76px);
  align-items: start;
}

.v12-v3 .footer-identity strong {
  display: block;
  width: min(230px, 100%);
  aspect-ratio: 645 / 145;
  margin-bottom: 10px;
  overflow: hidden;
  background: url('/assets/jm-micro-wordmark.png') left center / contain no-repeat;
  color: transparent;
  font-size: 0;
  line-height: 0;
}

.v12-v3 .footer-identity span,
.v12-v3 .footer-address,
.v12-v3 .footer-links a {
  color: #e5e7df !important;
  font-size: .82rem;
  line-height: 1.65;
}

.v12-v3 .footer-address {
  margin: 0;
  font-style: normal;
}

.v12-v3 .footer-address a {
  display: block;
}

.v12-v3 .footer-address a,
.v12-v3 .footer-links a {
  text-decoration-color: rgba(244, 239, 231, .45);
  text-underline-offset: 4px;
}

.v12-v3 .footer-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 20px;
}

.v12-v3 .footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 42px;
  padding-top: 18px;
  border-top: 1px solid rgba(244, 239, 231, .22);
  color: #cfdad5;
  font-size: .7rem;
}

/* Page de confidentialité, volontairement sobre et lisible. */
.v12-v3 .privacy-hero {
  padding: clamp(70px, 8vw, 110px) 0;
  background: var(--site-brand-deep);
  color: var(--site-cream);
}

.v12-v3 .privacy-hero h1 {
  margin: 12px 0 16px;
  font: clamp(3.8rem, 8vw, 7rem)/.92 var(--serif);
  letter-spacing: -.07em;
}

.v12-v3 .privacy-content {
  padding: clamp(60px, 7vw, 92px) 0;
}

.v12-v3 .privacy-copy {
  max-width: 820px;
}

.v12-v3 .privacy-copy h2 {
  margin: 34px 0 8px;
  font: 1.75rem/1.15 var(--serif);
}

.v12-v3 .privacy-copy h2:first-child {
  margin-top: 0;
}

.v12-v3 .privacy-note {
  margin-top: 38px;
  padding: 20px 22px;
  border-left: 5px solid var(--site-accent);
  background: var(--site-white);
}

@media (max-width: 1080px) {
  :root { --site-header-height: 88px; }

  .v12-v3 #site-header .wrap {
    width: calc(100% - 24px) !important;
  }

  .v12-v3 #site-header .nav {
    min-height: var(--site-header-height) !important;
    height: var(--site-header-height) !important;
    gap: 0 !important;
  }

  .v12-v3 #site-header .brand,
  .v12-v3 #site-header .nav > a:first-child {
    width: calc(100% - 78px) !important;
    height: 82px !important;
    flex: 0 1 auto !important;
  }

  .v12-v3 #site-header .brand img,
  .v12-v3 #site-header .nav > a:first-child img {
    width: min(100%, 360px) !important;
    max-height: 82px !important;
  }

  .v12-v3 .menu-toggle {
    display: flex !important;
    width: 78px !important;
    height: 78px !important;
    flex: 0 0 78px !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 !important;
    border: 0 !important;
    background: var(--site-accent) !important;
    color: var(--site-brand-deep) !important;
    cursor: pointer;
    font-size: .56rem !important;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
  }

  .v12-v3 .menu-toggle span {
    display: block;
    position: relative;
    width: 25px !important;
    height: 2px !important;
    margin: 0 !important;
    border: 0 !important;
    background: var(--site-brand-deep) !important;
  }

  .v12-v3 .menu-toggle span::before,
  .v12-v3 .menu-toggle span::after {
    content: "";
    position: absolute;
    left: 0;
    height: 2px;
    background: var(--site-brand-deep) !important;
  }

  .v12-v3 .menu-toggle span::before { top: -7px; width: 25px; }
  .v12-v3 .menu-toggle span::after { top: 7px !important; width: 17px !important; }

  .v12-v3 #site-navigation,
  .v12-v3 #site-header .nav-links {
    display: none;
    position: absolute;
    z-index: 1001;
    top: calc(var(--site-header-height) - 1px);
    right: -12px;
    left: -12px;
    margin: 0;
    padding: 22px 26px 26px !important;
    background: var(--site-cream) !important;
    border-bottom: 1px solid var(--site-line) !important;
    box-shadow: 0 15px 25px rgba(14, 48, 50, .18) !important;
  }

  .v12-v3 #site-header.menu-open #site-navigation,
  .v12-v3 #site-header.menu-open .nav-links {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 3px 24px !important;
  }

  .v12-v3 #site-navigation a {
    min-height: 44px;
    padding: 13px 0;
    color: var(--site-brand) !important;
    font-size: .7rem !important;
  }

  .v12-v3 #site-navigation a:hover,
  .v12-v3 #site-navigation a.active,
  .v12-v3 #site-navigation a[aria-current="page"] {
    color: var(--site-brand-deep) !important;
    text-decoration: underline;
    text-decoration-color: var(--site-accent);
    text-decoration-thickness: 2px;
    text-underline-offset: 5px;
  }

  .v12-v3 .rates-grid {
    grid-template-columns: minmax(330px, .85fr) minmax(0, 1.15fr) !important;
    gap: 34px !important;
  }

  .v12-v3 .zones-figure {
    min-height: 380px !important;
    -webkit-mask-size: 220% auto !important;
    mask-size: 220% auto !important;
  }

  .v12-v3 .site-footer .footer-grid {
    grid-template-columns: 1fr 1fr;
  }

  .v12-v3 .footer-links {
    grid-column: 1 / -1;
    grid-template-columns: repeat(4, auto);
  }
}

@media (max-width: 760px) {
  .v12-v3 .wrap {
    width: min(100% - 28px, 1100px) !important;
  }

  .v12-v3 .results-gallery .intro,
  .v12-v3 .testimonial-grid {
    grid-template-columns: 1fr !important;
  }

  .v12-v3 .results-gallery .intro h2 {
    grid-row: auto;
  }

  .v12-v3 .results-gallery .intro > p {
    padding-top: 0;
  }

  .v12-v3 .proof-signals li {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .v12-v3 .testimonial-grid {
    gap: 28px !important;
  }

  .v12-v3 .youtube-play {
    width: 62px;
    height: 62px;
    font-size: 1.5rem;
  }

  .v12-v3 .youtube-label {
    right: 16px;
    bottom: 14px;
    left: 16px;
  }

  .v12-v3 .youtube-label strong {
    font-size: 1.22rem;
  }

  .v12-v3.home-mobile .proof,
  .v12-v3.home-mobile .reviews,
  .v12-v3.home-mobile .method,
  .v12-v3.home-mobile .about,
  .v12-v3.home-mobile .salon,
  .v12-v3.home-mobile .testimonial,
  .v12-v3.home-mobile .faq-teaser,
  .v12-v3.home-mobile .contact {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .v12-v3 .results-gallery .gallery-track {
    gap: 16px !important;
    padding: 2px 0 14px !important;
    scroll-padding-inline: 0;
  }

  .v12-v3 .results-gallery .gallery-card {
    flex-basis: 100% !important;
    width: 100% !important;
    scroll-snap-align: start;
  }

  .v12-v3 .gallery-controls {
    justify-content: space-between;
  }

  .v12-v3 .gesture-film {
    grid-template-columns: 1fr !important;
  }

  .v12-v3 .gesture-film {
    width: min(100% - 28px, 520px) !important;
    gap: 24px !important;
    margin: 0 auto 44px !important;
    padding: 24px 20px 20px !important;
  }

  .v12-v3 .gesture-film video {
    width: min(100%, 275px) !important;
    max-height: 490px !important;
  }

  .v12-v3.technique-mobile .hero h1 {
    font-size: clamp(3.7rem, 20vw, 5.2rem) !important;
    line-height: .92 !important;
  }

  .v12-v3 .rates-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }

  .v12-v3 .zones-figure {
    width: 100% !important;
    min-height: 270px !important;
    padding: 0 !important;
    -webkit-mask-position: 50% 2% !important;
    mask-position: 50% 2% !important;
    -webkit-mask-size: 215% auto !important;
    mask-size: 215% auto !important;
  }

  .v12-v3 .rates h2 {
    max-width: 100%;
    font-size: clamp(2.75rem, 14vw, 4rem) !important;
    line-height: .94 !important;
  }

  .v12-v3 .faq-page-hero h1 {
    font-size: clamp(3.35rem, 15vw, 4.8rem) !important;
    line-height: 1.03 !important;
  }

  .v12-v3 .contact-main h2 {
    font-size: clamp(2.55rem, 13vw, 3.6rem) !important;
    line-height: 1 !important;
  }

  .v12-v3 .contact-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .v12-v3 .privacy-hero h1 {
    font-size: clamp(2.8rem, 14vw, 3.2rem);
  }

  .v12-v3 .map-placeholder {
    min-height: 260px;
  }

  .v12-v3 .chat-cta,
  .v12-v3 .chat {
    right: 10px !important;
    bottom: calc(10px + env(safe-area-inset-bottom)) !important;
    max-width: 175px;
    min-height: 48px;
    padding: 11px 14px !important;
    font-size: .61rem !important;
  }

  .v12-v3 .site-footer,
  .v12-v3 .footer.site-footer {
    padding: 44px 0 20px !important;
  }

  .v12-v3 .site-footer .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .v12-v3 .footer-links {
    grid-column: auto;
    grid-template-columns: 1fr 1fr;
  }

  .v12-v3 .footer-bottom {
    display: grid;
    gap: 5px;
    margin-top: 32px;
  }
}

@media (max-width: 420px) {
  :root { --site-header-height: 82px; }

  .v12-v3 #site-header .brand,
  .v12-v3 #site-header .nav > a:first-child {
    width: calc(100% - 70px) !important;
    height: 76px !important;
  }

  .v12-v3 #site-header .brand img,
  .v12-v3 #site-header .nav > a:first-child img {
    max-height: 74px !important;
  }

  .v12-v3 .menu-toggle {
    width: 70px !important;
    height: 72px !important;
    flex-basis: 70px !important;
  }

  .v12-v3 #site-header.menu-open #site-navigation,
  .v12-v3 #site-header.menu-open .nav-links {
    grid-template-columns: 1fr;
  }

  .v12-v3 .results-gallery .gallery-card {
    flex-basis: 100% !important;
    width: 100% !important;
  }

  .v12-v3 .price-row {
    grid-template-columns: 36px minmax(0, 1fr) !important;
  }

  .v12-v3 .price-amount {
    grid-column: 2 !important;
  }

  .v12-v3 .zones-figure {
    min-height: 240px !important;
    -webkit-mask-size: 230% auto !important;
    mask-size: 230% auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .v12-v3 *,
  .v12-v3 *::before,
  .v12-v3 *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
