/* Transparent nail/spa artwork replaces the barber silhouette in activity presets. */
.business-scene-photo .club-portrait{object-fit:contain;filter:none}
.business-scene-photo .hero>img.barber{object-fit:contain;filter:none}
.business-no-portrait .club-portrait,.business-no-portrait .hero>img.barber{display:none}
.barbers-title-row>.barbers-script{white-space:pre-line}
/* Profession wording uses the original composition; long labels fit its bounds. */
.fade-template .studio-intro{color:var(--palette-text)}
.fade-template .barbers-title-row>.barbers-title{min-width:0;flex:1}
.fade-template .barbers-title-row>.barbers-script{flex:0 1 250px;min-width:0;max-width:32%;white-space:pre-line}
.fade-template .barbers-layout-no-photo .barbers-photo-word{display:none}
.fade-template .barbers-layout-no-photo .barbers-portrait-placeholder{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:112px;height:112px;background:var(--palette-surface);border:1px solid var(--palette-line);font-size:clamp(40px,5vw,76px);color:var(--palette-muted)}
.fade-template .barbers-layout,.fade-template .barbers-featured,.fade-template .barbers-roster{min-width:0}
@media(max-width:700px){.fade-template .barbers-title-row{flex-wrap:wrap}.fade-template .barbers-title-row>.barbers-title{flex-basis:100%}.fade-template .barbers-title-row>.barbers-script{max-width:100%;flex-basis:auto}}
/* Keep the same portrait column when switching between people with/without photos. */
.fade-template .barbers-layout-no-photo .barbers-portrait-index{display:none}
.green-template .club-team-heading>.club-display{max-width:100%;min-width:0;flex-shrink:1;white-space:normal}
@media(max-width:700px){.fade-template .barbers-layout-no-photo .barbers-portrait-placeholder{width:80px;height:80px;font-size:40px}}
.fade-template .navbar-book>span:last-child{display:flex;align-items:center;justify-content:center;line-height:0}
.fade-template .navbar-book>span:last-child>svg{display:block;width:24px;height:24px;flex:none}
/* Blend preset cutouts into the original hero instead of exposing their bottom edge. */
.green-template.business-scene-photo .club-hero:before{content:'';position:absolute;left:0;right:0;bottom:-1px;height:clamp(110px,20%,220px);pointer-events:none;z-index:0;background:linear-gradient(to bottom,transparent,var(--palette-bg))}
/* Green keeps its portrait frame too; only the centered identity fallback is compact. */
.green-template .club-team-image:has(>.club-team-monogram)>.club-team-monogram{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:112px;height:112px;background:var(--palette-surface);border:1px solid var(--palette-line);font-size:40px;text-transform:uppercase}
.green-template .club-team-image:has(>.club-team-monogram)>span:not(.club-team-monogram){display:none}
@media(max-width:800px){.green-template .club-team-image:has(>.club-team-monogram)>.club-team-monogram{width:80px;height:80px;font-size:32px}}
/* The wrists also reach the source canvas sides; feather those edges locally. */
.green-template.business-scene-photo .club-portrait{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 65%,rgba(0,0,0,.85) 78%,rgba(0,0,0,.3) 92%,transparent 100%),linear-gradient(to right,transparent 0%,#000 5%,#000 87%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,#000 0%,#000 65%,rgba(0,0,0,.85) 78%,rgba(0,0,0,.3) 92%,transparent 100%),linear-gradient(to right,transparent 0%,#000 5%,#000 87%,transparent 100%);mask-composite:intersect;mask-repeat:no-repeat}
/* Keep large service catalogs compact without changing their booking identities. */
.green-template .club-catalog-search{display:grid;gap:9px;margin-bottom:24px;font-size:12px;color:var(--palette-text)}
.green-template .club-catalog-search input{width:100%;min-width:0;padding:12px 14px;border:1px solid var(--palette-line);border-radius:0;background:transparent;color:var(--palette-text);font:inherit;font-size:15px}
.green-template .club-catalog-search input::placeholder{color:var(--palette-muted)}
.green-template .club-catalog-search input:focus-visible,.green-template .club-catalog-expand:focus-visible{outline:2px solid var(--palette-accent);outline-offset:4px}
.green-template .club-catalog-count,.green-template .club-catalog-empty{font-size:12px;line-height:1.5;color:var(--palette-muted)}
.green-template .club-catalog-count{margin:16px 0 0}
.green-template .club-catalog-expand{display:flex;align-items:center;justify-content:center;gap:12px;min-height:44px;width:100%;margin-top:20px;border:1px solid var(--palette-line);background:transparent;color:var(--palette-text);font:inherit;font-size:13px;cursor:pointer}
.green-template .club-catalog-expand svg{width:18px;height:18px}
.green-template .club-catalog-expand[aria-expanded=true] svg{transform:rotate(180deg)}
/* Every logo frame follows its measured crop, including an explicitly chosen wordmark. */
.shop-brand-content[data-logo-layout]>.shop-logo-mark{width:min(calc(var(--shop-logo-size)*var(--logo-scale,1)*var(--logo-ratio,1)),calc(var(--shop-wordmark-width)*var(--logo-scale,1)));height:auto;aspect-ratio:var(--logo-ratio,1)}
/* On phones the complete business name stays above every portrait/photo. */
@media(max-width:800px){
 .green-template .club-tabs{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;gap:24px;padding-bottom:0;align-items:stretch;scrollbar-width:thin}
 .green-template .club-tabs>button{flex:0 0 auto;white-space:nowrap;min-height:48px;padding:10px 0 14px;border-bottom:2px solid transparent!important}
 .green-template .club-tabs>button[aria-pressed=true]{border-bottom-color:var(--palette-accent-ink)!important}
 .green-template .club-tabs>button:after{display:none!important}
 .club-experience.green-template .club-hero{--club-portrait-top:calc(var(--club-hero-header-height,85px) + 24px + var(--club-hero-name-height,23vw) + 16px);display:flex;flex-direction:column}
 .club-experience.green-template .club-portrait{position:relative;top:auto!important;bottom:auto;left:auto!important;align-self:center;max-width:100%;width:min(100%,calc(88%*var(--template-portrait-scale,1)));height:calc(98vw*var(--template-portrait-scale,1));max-height:125vw;margin:16px 0 0;transform:none}
 .club-experience.green-template .club-hero-services{position:relative;top:auto;right:auto;width:100%;margin:24px 0 80px}
}
.template-initial-loader{display:grid;place-items:center}
.website-looks-nails{position:relative;min-height:230px}
.website-looks-nails>img{position:absolute;top:20px;left:0;width:62%;height:190px;object-fit:cover;border:5px solid var(--website-bg);border-radius:18px;transform:rotate(-8deg)}
.website-looks-nails>img+img{left:35%;top:8px;transform:rotate(8deg)}
.template-initial-loader svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-dasharray:60 24;animation:template-loader-spin .8s linear infinite}
@keyframes template-loader-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.template-initial-loader svg{animation:none}}