/* Isolated agency direction: black ink, white space, strong editorial contrast. */
:root{--ink:#111;--plum:#111;--iris:#111;--muted:#555;--paper:#fff;--soft:#fff;--line:#c9c9c9}
body{background:#fff;color:#111}
.site-header.home-header:not(.menu-open),.site-header.home-header.menu-open,.site-header.home-header.past-home-hero:not(.menu-open){background:rgba(255,255,255,.97);color:#111;border-bottom:1px solid #111;box-shadow:none;--nav-accent:#111}
.site-header .brand-color,.visit .visit-logo,.footer-brand>img{filter:brightness(0);opacity:1}
.site-header .brand-white{opacity:0!important}
.site-header.home-header .nav-panel{background:#fff;border-color:#111;box-shadow:0 18px 28px #0000000d}
.site-header a,.site-header button{--iris:#111;--plum:#111}
.site-header .nav-panel a:hover{color:#111;background-color:#eee}
.home-hero,.home-hero .hero-media{background:#fff}
.home-hero,.page-hero-photo,.page-hero,.contact-hero{border-bottom:1px solid #111}
.home-hero .hero-media::after{background:linear-gradient(90deg,#fff 0%,#fff 26%,#fffffff0 42%,#ffffff55 63%,#ffffff00 82%)}
.home-hero #hero-title,.home-hero #hero-title em,.home-hero .eyebrow,.home-hero .hero-proof dt{color:#111}
.home-hero .hero-lede{color:#333}
.home-hero .hero-proof,.home-hero .hero-proof>div{border-color:#111}
.home-hero .hero-proof>div::before{z-index:-1;background:linear-gradient(115deg,rgba(255,255,255,.4),rgba(210,215,220,.16));transform:none;opacity:0;transition:opacity .2s ease}
.home-hero .hero-proof>div:is(:hover,:focus-within)::before{transform:none;opacity:1}
.home-hero .hero-proof>div:hover .proof-arrow{color:#111}
.section-kicker,.eyebrow{color:#111!important;}
.requested,.treatments,.team,.photo-story,.brands,.questions,.consultation,.history-home,.visit,.private-results,.page-hero,.contact-hero,.site-footer{background:#fff;color:#111}
.history-home .history-number-lockup{color:#111}
.history-home .history-brand-row,.site-heritage{background:#fff;border-color:#111}
.history-home .history-copy p,.private-results .private-results-copy>p:not(.section-kicker){color:#444}
.trust,.review-band,.closing{background:#111;color:#fff}
.trust :is(h2,h3,p,span),.review-band :is(p,blockquote,figcaption),.closing :is(h2,p,a){color:#fff}
.trust .section-kicker,.review-band .section-kicker{color:#fff!important}
.trust-proof-list article+article{border-color:#555}
.trust-proof-list article>span{color:#bbb}
.review-band+.closing::before{background:#777}
.review-dots button::before{border-color:#aaa}.review-dots button.is-active::before{background:#fff}
.closing .closing-phone{background-image:none;color:#fff}.closing>div>a::before{content:none}.closing>div>a:hover,.closing>div>a:focus-visible{color:#111}
.button,.access-preview,.access-preview input,.access-preview button{border-radius:0;box-shadow:none}
/* Inverse colours switch together, avoiding unreadable mid-transition greys. */
body .button{transition:box-shadow .2s ease,border-color .2s ease}
body .button:is(:hover,:focus-visible){transform:none}
/* Shared button colours; the banner and dark closing section invert the fill. */
body .site-header.home-header:is(.past-home-hero,:not(.past-home-hero)) :is(.nav-actions,.nav-mobile-actions) .button-primary,body .button.button-primary{background:#111;color:#fff;border-color:#111}
body .button.button-light{background:#fff;color:#111;border-color:#111}
body .site-header.home-header:is(.past-home-hero,:not(.past-home-hero)) :is(.nav-actions,.nav-mobile-actions) .button-primary:is(:hover,:focus-visible),body .button.button-primary:is(:hover,:focus-visible),body .button.button-light:is(:hover,:focus-visible),.access-preview.access-form button:is(:hover,:focus-visible){background:#fff;color:#111;border-color:#111}
body .home-hero .button.button-primary{background:transparent;color:#111;border-color:#111}
body .home-hero .button.button-primary:is(:hover,:focus-visible){background:#111;color:#fff;border-color:#111}
body .closing .button.button-light{background:#fff;color:#111;border-color:#fff}
body .closing .button.button-light:is(:hover,:focus-visible){background:#111;color:#fff;border-color:#fff}
body .button:is(:focus-visible){outline:2px solid currentColor;outline-offset:4px}
.brands .brand-rail{border:0;border-top:1px solid #c9c9c9;border-left:1px solid #c9c9c9}
.brands .brand-rail>span{min-height:80px;border:0;border-right:1px solid #c9c9c9;border-bottom:1px solid #c9c9c9}
.brands .brand-rail>span>a{min-height:80px;padding:18px 10px;background-image:none;background-color:#fff;color:#111;transition:background-color .25s,color .25s}
.brands .brand-rail>span>a:is(:hover,:focus-visible){background-color:#111;color:#fff}
.visit .visit-copy a:not(.button){background-image:linear-gradient(90deg,#e6e6e6,#e6e6e6)}
.accordion summary:is(:hover,:focus-visible){background:#f0f0f0}
.visit :is(h2,p,address,a,dt,dd),.page-hero :is(h1,p,a,dt,dd),.contact-hero :is(h1,p,a){color:#111}
.visit-map{background:#eee}.map-directions{background:#fff;color:#111;border-color:#111}
.page-hero-photo .hero-media::after{background:linear-gradient(90deg,#fff,#fffffff2 35%,#ffffffbf 55%,#ffffff14)}
.page-hero-photo .hero-proof dt,.page-hero-photo .crumbs,.page-hero-photo .crumbs a{color:#444}
.page-hero-photo .hero-proof,.page-hero-photo .hero-proof>div{border-color:#999}
.site-footer{border-top:1px solid #111}.footer-wordmark{color:#111;opacity:1}
@media(max-width:920px){.home-hero .hero-media::after{background:linear-gradient(90deg,#fffffff2,#ffffffa6 60%,#ffffff26),linear-gradient(0deg,#fff,#ffffff26 75%)}}

.blog,.fmt{--b-soft:#fff}.blog .index-list>article:last-child:nth-child(odd){grid-column:1/-1}

.aside-card .section-kicker,.contact-card .section-kicker{color:#fff!important}

/* The entire clinic mark is flat black on the concept. */
body img[src*="laserit-child/assets/logo-"]{filter:brightness(0) saturate(100%)!important}

/* Keep treatment labels still and the highlight behind their content. */
.treatment-row::before{background:#f5f5f5;box-shadow:none;transform:none;opacity:0;pointer-events:none;transition:opacity .2s ease}
.treatment-row:is(:hover,:focus-within)::before{transform:none;opacity:1}
.row-links a{transition:color .2s ease,background-color .2s ease}
.row-links a:is(:hover,:focus-visible){padding-left:0;background:#e8e8e8;color:#111}
.home-hero .hero-proof :is(dt,dd,.proof-link,.proof-arrow){color:#111}
@media(prefers-reduced-motion:reduce){.treatment-row::before,.row-links a,body .button{transition:none}}

/* Neutral navigation and remaining accents for the selected monochrome design. */
.home-header .nav-panel-links>div>a,.home-header .nav-panel .selector-menu-card,.home-header .nav-panel-about .nav-panel-lead .nav-panel-route{background-image:linear-gradient(90deg,#e9e9e9,#f5f5f5)}
.home-header .nav-panel-lead .nav-panel-route:not(.selector-menu-card):is(:hover,:focus-visible),.home-header .nav-panel-links .nav-view-all:is(:hover,:focus-visible){background:#eee;color:#111;box-shadow:0 0 0 6px #eee}
.home-header .nav-panel .nav-panel-all:is(:hover,:focus-visible){background:#eee;border-color:#ddd;color:#111}
.home-header .selector-menu-card:is(:hover,:focus-visible) .selector-thumb{box-shadow:0 0 0 3px #ddd}
.home-header .selector-menu-card:is(:hover,:focus-visible) .selector-menu-label{background:#eee;color:#111}
.home-hero .hero-proof>div:is(:hover,:focus-within) .proof-arrow{color:#111}
.closing>div>a{background-image:linear-gradient(90deg,#eee,#fff);transition:none}
body .closing>div>.button-light{background-image:none}
.interactive-map .map-pin{background:#bbb}.interactive-map .map-label{background:linear-gradient(115deg,#ffffff99,#ffffff22),#e8e8e8;color:#111}.interactive-map .map-label:is(:hover,:focus-visible){background-color:#f5f5f5;color:#111}.visit-copy a[href^="tel:"]:is(:hover,:focus-visible){color:#111}
/* Keep the acne photograph visible rather than stacking two white masks over it. */
.page-hero-photo:has(img[src*="acne-skin-treatments-banner"]) .hero-media{left:55%;background:#fff}
.page-hero-photo:has(img[src*="acne-skin-treatments-banner"]) .hero-media img{mask-image:none;-webkit-mask-image:none;filter:none;object-position:35% 50%}
.page-hero-photo:has(img[src*="acne-skin-treatments-banner"]) .hero-media::after{background:linear-gradient(90deg,#fff,transparent 40%)}
@media(max-width:1000px){
.page-hero-photo:has(img[src*="acne-skin-treatments-banner"]) .hero-media{position:relative;inset:auto;order:2;height:260px;width:100%;margin-top:24px}
.page-hero-photo:has(img[src*="acne-skin-treatments-banner"]) .hero-media::after{background:none}
}

@media(max-width:600px){.page-hero-photo:has(img[src*="acne-skin-treatments-banner"]) .hero-proof>div{grid-template-columns:110px minmax(0,1fr);gap:14px}}

/* Compact the heading-to-treatment spacing without shifting hover targets. */
#treatments>.section-intro{margin-bottom:28px}
#treatments .treatment-row:first-child{padding-top:24px}

/* 2026-10-07 (Chris): clinic photos removed. A hero without its photo spans the full width,
   so the heading is not squeezed into the empty photo column. */
.hero.contact-hero:not(:has(.hero-media)),.page-hero:not(:has(.page-hero-media)),.resource-hero-inner:not(:has(> img)){grid-template-columns:minmax(0,1fr)}
.page-hero:not(:has(.page-hero-media)) h1,.resource-hero-inner:not(:has(> img)) h1{max-width:none}

/* 2026-10-07 (Chris): one brand removed, seven brands. BOTOX COSMETIC, the longest name, takes
   two cells, so four columns make two full rows and two columns make full rows: no empty cell. */
.brands .brand-rail>span:first-child{grid-column:span 2}
