html,body{width:100%;max-width:100%;overflow-x:clip}body{min-width:0}main,header,footer,section,article,aside,nav,form,div{min-width:0}img,svg,video,iframe{display:block;max-width:100%}p,a,h1,h2,h3,h4,li,span{overflow-wrap:anywhere}.site-header,.site-footer,main{width:100%}.button,.site-header a,.text-link,.footer-column a,.footer-cta{transition:opacity .2s ease,background-color .2s ease,color .2s ease,transform .2s ease}.button:hover,.footer-cta:hover{transform:translateY(-2px)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.site-footer{background:#0b2d28;color:var(--cream);padding:44px clamp(24px,6vw,90px) 22px}.footer-shell{max-width:1440px;margin:auto;display:grid;grid-template-columns:minmax(360px,1.6fr) minmax(150px,.55fr) minmax(230px,.8fr);gap:clamp(40px,7vw,110px);align-items:start}.footer-brand>a:first-child{display:inline-block}.footer-brand img{width:min(330px,100%);height:88px;object-fit:contain;object-position:left center;filter:brightness(0) invert(1);opacity:.96}.footer-brand p{margin:14px 0 18px;color:#e4ebe7;font-size:.92rem;line-height:1.6}.footer-brand p span{color:#9fb2ab}.footer-cta{display:inline-flex!important;align-items:center;justify-content:space-between;gap:32px;min-width:220px;margin:0!important;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.42);text-decoration:none;font-size:.78rem!important;text-transform:uppercase;letter-spacing:.13em}.footer-column{padding-top:8px}.footer-label{color:#b9935a;font-size:.65rem;font-weight:600;letter-spacing:.2em;margin:0 0 15px}.site-footer .footer-column a{color:#e5ebe8;text-decoration:none;margin:0 0 7px;font-size:.82rem}.site-footer .footer-column a:hover{color:#d5b77e}.footer-contact p:last-child{font-size:.78rem;color:#9fb2ab;margin:12px 0 0}.footer-bottom{max-width:1440px;margin:32px auto 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.13);display:flex;align-items:center;justify-content:space-between;gap:24px}.footer-bottom p{margin:0;color:#829a92;font-size:.68rem}.footer-bottom div{display:flex;gap:22px}.site-footer .footer-bottom a{display:inline;color:#9fb2ab;text-decoration:none;margin:0;font-size:.68rem}.blog-card,.service-card,.treatment-directory article{min-width:0}.article-page{width:100%}.article-body a{word-break:break-word}
@media(max-width:900px){.site-header nav{max-width:100vw;overflow-x:hidden}.footer-shell{grid-template-columns:1.4fr .6fr}.footer-contact{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}.footer-contact .footer-label,.footer-contact p{grid-column:1/-1}}
@media(max-width:600px){html,body{overflow-x:hidden}.site-header{max-width:100%;padding-inline:18px}.site-header nav{width:100%;max-height:calc(100dvh - 80px);overflow-y:auto}.brand-logo{width:min(170px,62vw)!important}.hero,.treatment-hero,.about-hero,.experience-hero,.booking-wrap,.seo-intro,.faq,.blog-grid,.content-hero,.article-page{max-width:100%;overflow:hidden}.hero-copy h1,.content-hero h1,.article-page h1{font-size:clamp(2.65rem,13vw,3.55rem)}.hero-art,.about-portrait,.treatment-visual,.experience-orb{max-width:100%}.actions,.service-links,.treatment-price,.article-actions{max-width:100%;flex-wrap:wrap}.button{max-width:100%;white-space:normal;text-align:center}.calendar-week,.calendar-grid{width:100%;grid-template-columns:repeat(7,minmax(0,1fr))}.calendar-grid button{width:100%;min-width:0;padding:0}.mobile-review{width:auto;max-width:calc(100% + 4%)}.site-footer{padding:34px 20px 18px}.footer-shell{grid-template-columns:1fr;gap:30px}.footer-brand img{width:240px;height:66px}.footer-brand p{font-size:.86rem}.footer-column{padding-top:0}.footer-contact{grid-column:auto;display:block}.footer-bottom{margin-top:26px;align-items:flex-start;flex-direction:column;gap:12px}.footer-bottom div{gap:18px;flex-wrap:wrap}.blog-card{padding:24px}.article-body p{font-size:1rem}.treatment-directory article,.experience-steps article{min-width:0}}

/* Mobile booking containment fix: keep the booking UI centered and prevent horizontal drift. */
@media (max-width: 600px){
  .booking-wrap.mobile-booking{
    width:100%;
    max-width:100%;
    margin-inline:auto;
    padding-inline:clamp(16px,5vw,24px);
    overflow:visible;
  }
  .mobile-booking #booking-form,
  .mobile-booking .form-section,
  .mobile-booking .form-section>div,
  .mobile-booking .booking-calendar,
  .mobile-booking .slot-grid,
  .mobile-booking .two-cols,
  .mobile-booking .mobile-review,
  .mobile-booking .booking-submit{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .mobile-booking .form-section{
    grid-template-columns:38px minmax(0,1fr);
  }
  .mobile-booking .treatment-step{
    grid-template-columns:1fr;
  }
  .mobile-booking .booking-calendar{
    margin-inline:auto;
  }
  .mobile-booking input,
  .mobile-booking select,
  .mobile-booking textarea{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .mobile-booking .mobile-review{
    margin-inline:0;
  }
}

/* 2026-09-22 mobile viewport + booking centering hardening */
html,body{margin:0;width:100%;max-width:100%;overflow-x:hidden;overscroll-behavior-x:none}
@supports (overflow:clip){html,body{overflow-x:clip}}
.site-header{box-sizing:border-box}
.menu{width:46px;height:46px;padding:10px;border:0;background:transparent;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer}
.menu span{display:block;width:24px;height:2px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
.menu[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:900px){
 .menu{display:flex;flex:0 0 46px}
 .site-header nav{box-sizing:border-box;width:100%;max-width:100%;left:0;right:0;margin:0}
}
@media(max-width:600px){
 body,main{position:relative;width:100%;max-width:100%;overflow-x:hidden}
 .booking-hero.compact{box-sizing:border-box;width:100%;max-width:100%;margin:0;padding-inline:20px;overflow:hidden}
 .booking-wrap.mobile-booking{box-sizing:border-box;display:block!important;width:100%!important;max-width:680px!important;margin:0 auto!important;padding:36px 20px 56px!important;overflow:hidden!important}
 .mobile-booking #booking-form{box-sizing:border-box;width:100%!important;max-width:100%!important;margin:0 auto!important;overflow:hidden}
 .mobile-booking .booking-progress{box-sizing:border-box;width:100%!important;max-width:100%!important;margin:0 0 32px!important;left:auto;right:auto}
 .mobile-booking .form-section{box-sizing:border-box;display:grid!important;grid-template-columns:32px minmax(0,1fr)!important;column-gap:10px!important;width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important;overflow:hidden}
 .mobile-booking .form-section>div{box-sizing:border-box;width:100%!important;max-width:100%!important;min-width:0!important}
 .mobile-booking .step{width:32px;min-width:0;text-align:left}
 .mobile-booking .booking-calendar,.mobile-booking .calendar-head,.mobile-booking .calendar-week,.mobile-booking .calendar-grid,.mobile-booking .slot-grid,.mobile-booking .two-cols,.mobile-booking label,.mobile-booking input,.mobile-booking select,.mobile-booking textarea,.mobile-booking .chosen-treatment,.mobile-booking .mobile-review,.mobile-booking .booking-submit{box-sizing:border-box;width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0;margin-right:0}
 .mobile-booking .calendar-head{grid-template-columns:44px minmax(0,1fr) 44px}
 .mobile-booking .calendar-head strong{min-width:0;white-space:normal}
 .mobile-booking .calendar-week,.mobile-booking .calendar-grid{grid-template-columns:repeat(7,minmax(0,1fr))!important}
 .mobile-booking .calendar-grid button{min-width:0!important;width:100%!important;padding:0!important}
 .mobile-booking .two-cols{grid-template-columns:minmax(0,1fr)!important}
 .mobile-booking .mobile-review{position:relative!important;bottom:auto!important}
 .mobile-booking aside{box-sizing:border-box;width:100%;max-width:100%;overflow:hidden}
}
@media(max-width:380px){
 .booking-wrap.mobile-booking{padding-left:14px!important;padding-right:14px!important}
 .mobile-booking .form-section{grid-template-columns:26px minmax(0,1fr)!important;column-gap:8px!important}
 .mobile-booking .step{width:26px;font-size:.78rem}
 .mobile-booking .booking-calendar{padding:.5rem}
}

/* 2026-09-22 final /book mobile layout correction */
@media (max-width:600px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important;overscroll-behavior-x:none!important;touch-action:pan-y pinch-zoom}
  main{width:100%!important;max-width:100%!important;overflow-x:clip!important}
  .booking-wrap.mobile-booking{width:100%!important;max-width:100%!important;margin:0!important;padding:36px clamp(18px,5vw,24px) 56px!important;overflow-x:clip!important}
  .mobile-booking #booking-form{width:100%!important;max-width:100%!important;margin:0!important;overflow:visible!important}
  .mobile-booking .form-section,
  .mobile-booking .form-section.treatment-step,
  .mobile-booking .form-section.date-step,
  .mobile-booking .form-section.details-step{display:block!important;position:relative;width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important;overflow:visible!important}
  .mobile-booking .form-section>.step{display:block!important;position:absolute!important;left:0!important;top:.2rem!important;width:auto!important;line-height:1.2!important;z-index:1}
  .mobile-booking .form-section>div{display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important}
  .mobile-booking .form-section h2{padding-left:70px!important;min-height:44px;margin-bottom:1.5rem!important;overflow-wrap:normal!important;word-break:normal!important}
  .mobile-booking .date-step .step-heading{display:block!important}
  .mobile-booking .date-step .step-heading h2{width:100%!important}
  .mobile-booking .service-options,
  .mobile-booking .booking-calendar,
  .mobile-booking .slot-grid,
  .mobile-booking .two-cols,
  .mobile-booking label,
  .mobile-booking input,
  .mobile-booking select,
  .mobile-booking textarea,
  .mobile-booking .chosen-treatment,
  .mobile-booking .mobile-review,
  .mobile-booking .booking-submit{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
  .mobile-booking .select-card>span{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
  .mobile-booking .booking-progress{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}
  .mobile-booking aside{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}
}
@media (max-width:380px){
 .mobile-booking .form-section h2{padding-left:58px!important;font-size:2.15rem!important}
}

/* 2026-09-22 site-wide mobile UX pass */
@media (max-width:600px){
  :root{--mobile-gutter:clamp(20px,6vw,28px);--mobile-section:clamp(64px,16vw,92px)}
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  body{font-size:16px;line-height:1.55}
  main,.site-header,.site-footer,section,article{max-width:100%!important}
  p,a,h1,h2,h3,h4,li,span{overflow-wrap:normal;word-break:normal}
  h1{font-size:clamp(3rem,14vw,4.35rem);line-height:.98}
  h2{font-size:clamp(2.55rem,12vw,3.7rem);line-height:1.02}
  h3{line-height:1.12}
  .site-header{height:92px;padding-inline:var(--mobile-gutter)}
  .brand-logo{width:min(220px,66vw)!important;height:auto!important}
  .menu{margin-left:auto}
  .site-header nav{top:92px;padding:28px var(--mobile-gutter);gap:20px;align-items:stretch}
  .site-header nav a{font-size:1rem}
  .site-header nav .button{width:100%}

  .hero{min-height:auto;padding:64px var(--mobile-gutter) 72px;gap:48px}
  .hero-copy h1{font-size:clamp(3.35rem,15vw,4.6rem);margin-bottom:24px}
  .hero-copy .lead{font-size:1.05rem;line-height:1.65}
  .actions{gap:18px;margin:32px 0}.actions .button{width:100%}
  .trust{gap:12px 20px}
  .hero-art{min-height:430px}

  .intro{padding:var(--mobile-section) var(--mobile-gutter)}
  .intro h2{margin:12px 0 24px}
  .treatments{padding:var(--mobile-section) var(--mobile-gutter)}
  .section-heading{gap:22px}.service-grid{margin-top:44px}
  .service-card{min-height:0;padding:30px 0}.service-card h3{margin:22px 0 10px}

  .experience{padding:var(--mobile-section) var(--mobile-gutter);gap:42px}
  .experience ol{margin:0;width:100%}
  .experience li{display:grid!important;grid-template-columns:52px minmax(0,1fr)!important;gap:22px!important;padding:34px 0!important;align-items:start}
  .experience li>span{display:block!important;width:52px!important;min-width:52px!important;white-space:nowrap!important;overflow-wrap:normal!important;word-break:keep-all!important;color:var(--gold);font-size:1rem;line-height:1.3}
  .experience li>div{min-width:0;width:100%}
  .experience h3{font-size:clamp(1.75rem,8vw,2.35rem);line-height:1.08;margin:0 0 10px}
  .experience p{font-size:1rem;line-height:1.65;margin:0}

  .about{grid-template-columns:1fr}.portrait{height:clamp(390px,110vw,520px);font-size:clamp(5.5rem,25vw,8rem)}
  .about>div:last-child{padding:var(--mobile-section) var(--mobile-gutter)}
  .about blockquote{font-size:1.25rem}
  .areas{padding:var(--mobile-section) var(--mobile-gutter)}
  .areas h2{font-size:clamp(2.35rem,11vw,3.2rem)}
  .areas>p:nth-of-type(2){font-size:1.55rem}
  .cta{padding:var(--mobile-section) var(--mobile-gutter)}

  .booking-hero,.booking-hero.compact{padding:64px var(--mobile-gutter) 70px!important}
  .booking-hero.compact h1{font-size:clamp(3rem,13vw,4rem)}
  .booking-wrap.mobile-booking{padding:44px var(--mobile-gutter) 64px!important}
  .mobile-booking .form-section{padding-bottom:42px!important;margin-bottom:42px!important}
  .mobile-booking .form-section h2{padding-left:58px!important;font-size:clamp(2.25rem,10vw,3rem)!important;line-height:1.02!important;min-height:42px!important}
  .mobile-booking .form-section>.step{font-size:.95rem!important;white-space:nowrap!important}
  .mobile-booking label{font-size:.95rem;gap:8px;margin-bottom:22px}
  .mobile-booking input,.mobile-booking select,.mobile-booking textarea{padding:15px 16px;min-height:56px}

  .site-footer{padding:50px var(--mobile-gutter) 24px}
}
@media (max-width:380px){
  :root{--mobile-gutter:18px}
  .experience li{grid-template-columns:44px minmax(0,1fr)!important;gap:16px!important}
  .experience li>span{width:44px!important;min-width:44px!important}
  .mobile-booking .form-section h2{padding-left:52px!important}
}
