.b-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:clamp(32px,5vw,96px);max-width:1480px;min-height:100vh;min-height:100svh;margin-inline:auto;padding:clamp(120px,15vh,170px) var(--pad) clamp(56px,8vh,96px)}
.b-title{margin-top:22px;font-family:var(--f-barber);font-size:clamp(5.2rem,15vw,15rem);line-height:.8;color:var(--paper)}
.b-title .ln:nth-child(2){margin-left:.5em;color:var(--gold-hi)}
.b-hero .lede{margin-top:34px;max-width:40ch}
.b-facts{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:44px;font-family:var(--f-cond);font-weight:500;font-size:.92rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.b-facts strong{margin-right:.35em;font-weight:600;color:var(--fg)}
.b-hero-media{position:relative;height:min(76vh,780px);background:var(--ink-3);clip-path:polygon(22% 0,100% 0,100% 100%,0 100%)}
.b-hero-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(.4) contrast(1.08) brightness(.85)}
.b-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(12,10,8,.7),transparent 45%)}
.b-hero-media figcaption{position:absolute;right:20px;bottom:18px;z-index:1;font-family:var(--f-cond);font-weight:600;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--paper)}

.b-band{position:relative;z-index:2;width:112%;margin:clamp(24px,4vw,56px) 0 clamp(24px,4vw,56px) -6%;background:var(--gold);color:var(--ink);transform:rotate(-2.2deg)}
.b-band .marquee{padding-block:.1em}
.b-band .marquee span{padding-inline:.45em;font-family:var(--f-barber);font-size:clamp(2rem,4.4vw,3.8rem);line-height:1.25}
.b-band .marquee span::after{content:"×";margin-left:.9em;font-family:var(--f-cond);font-size:.55em;vertical-align:.25em}

.b-services{padding-block:clamp(96px,13vw,190px) clamp(40px,6vw,80px)}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:32px;margin-bottom:clamp(48px,7vw,110px)}
.h2-b{margin-top:14px;font-family:var(--f-barber);font-size:clamp(3.4rem,8vw,7.6rem);line-height:.88}
.jump{display:flex;flex-wrap:wrap;gap:8px 28px;max-width:560px}
.jump a{font-family:var(--f-cond);font-weight:600;font-size:.95rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.jump a span{margin-right:.5em;color:var(--gold-hi)}
.jump a:hover{color:var(--fg)}

.svc-group{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,2fr);gap:clamp(24px,5vw,96px);padding-block:clamp(40px,6vw,80px);border-top:1px solid var(--line)}
.svc-group-head{position:sticky;top:110px;align-self:start}
.svc-num{display:block;font-family:var(--f-barber);font-size:clamp(3.4rem,6vw,5.6rem);line-height:.9;color:var(--gold)}
.svc-group-head h3{font-family:var(--f-barber);font-size:clamp(2.2rem,3.6vw,3.4rem)}
.svc-group-head p{max-width:30ch;margin-top:16px;color:var(--muted)}
.svc a{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name book" "desc book";column-gap:24px;padding:22px 0 24px;border-bottom:1px solid var(--line)}
.svc a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--gold-hi);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.svc a:hover{color:inherit}
.svc a:hover::after{transform:scaleX(1)}
.svc-name{grid-area:name;font-family:var(--f-cond);font-weight:600;font-size:clamp(1.5rem,2.6vw,2.3rem);line-height:1.1;letter-spacing:.02em;text-transform:uppercase;transition:transform .6s var(--ease),color .3s}
.svc-tag{margin-left:.5em;font-style:normal;font-weight:500;font-size:.5em;letter-spacing:.14em;vertical-align:.35em;color:var(--gold-hi)}
.svc-desc{grid-area:desc;max-width:52ch;margin-top:6px;font-size:.98rem;color:var(--muted)}
.svc-book{grid-area:book;align-self:center;font-family:var(--f-cond);font-weight:600;font-size:.88rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi);opacity:0;transform:translateX(-10px);transition:opacity .4s var(--ease),transform .6s var(--ease)}
.svc a:hover .svc-name{color:var(--gold-hi);transform:translateX(12px)}
.svc a:hover .svc-book,.svc a:focus-visible .svc-book{opacity:1;transform:none}
@media (hover:none){.svc-book{opacity:1;transform:none}}

.b-gallery{padding-top:clamp(80px,10vw,140px)}
.gal-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:24px;margin-bottom:48px}
.gal-track{display:flex;align-items:flex-start;gap:clamp(12px,1.4vw,20px);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);padding:0 var(--pad) 72px;scrollbar-width:none;cursor:grab;user-select:none;-webkit-user-select:none}
.gal-track::-webkit-scrollbar{display:none}
.gal-track.is-drag{scroll-snap-type:none;cursor:grabbing}
.gal-item{flex:0 0 auto;width:clamp(220px,24vw,360px);aspect-ratio:4/5;overflow:hidden;background:var(--ink-3);scroll-snap-align:start}
.gal-item:nth-child(even){margin-top:56px}
.gal-item img{width:100%;height:100%;object-fit:cover;filter:grayscale(.75);pointer-events:none;transition:filter .8s var(--ease),transform 1.2s var(--ease)}
.gal-item:hover img{filter:none;transform:scale(1.04)}

.b-reviews{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:var(--pad);padding-block:clamp(96px,12vw,180px);border-top:1px solid var(--line)}
.rating{font-family:var(--f-barber);font-size:clamp(9rem,22vw,20rem);line-height:.8;color:var(--gold-hi)}
.rating-sub{margin-top:18px;font-family:var(--f-cond);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.rating-sub a{color:var(--fg);border-bottom:1px solid var(--gold)}
.quotes{display:grid;gap:44px}
.quote p{font-family:var(--f-cond);font-weight:600;font-size:clamp(1.8rem,3.4vw,3rem);line-height:1.08;text-transform:uppercase}
.quote cite{display:block;margin-top:10px;font-style:normal;font-size:.95rem;color:var(--muted)}

.b-visit{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:end;gap:var(--pad);padding-block:clamp(96px,12vw,180px);border-top:1px solid var(--line)}
.b-visit h2{font-family:var(--f-barber);font-size:clamp(3.4rem,8vw,8rem);line-height:.9}
.b-visit h2 .ln:nth-child(2){margin-left:.5em;color:var(--gold-hi)}
.b-visit h2 .ln:nth-child(3){margin-left:1em}
.visit-info{display:grid;gap:28px}
.visit-info .hours{font-size:1.1rem}
.visit-info address{font-size:1.1rem}

@media (max-width:900px){
  .b-hero{grid-template-columns:minmax(0,1fr);min-height:0}
  .b-hero-media{height:58vh;clip-path:polygon(0 10%,100% 0,100% 100%,0 100%)}
  .section-head,.svc-group,.b-reviews,.b-visit{grid-template-columns:minmax(0,1fr)}
  .svc-group-head{position:static}
}
.b-hero.photo-hero{max-width:none;grid-template-columns:minmax(0,1fr);isolation:isolate;overflow:hidden}
.photo-hero .hero-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.b-hero.photo-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(12,10,8,.94),rgba(12,10,8,.76) 48%,rgba(12,10,8,.26)),linear-gradient(0deg,rgba(12,10,8,.65),transparent 50%)}
.b-hero.photo-hero .b-hero-copy{max-width:950px}
.b-hero.photo-hero .lede,.b-hero.photo-hero .b-facts{color:var(--paper)}
@media(max-width:900px){.b-hero.photo-hero{min-height:90svh}.b-hero.photo-hero::before{background:rgba(12,10,8,.78)}}
#svc-title{scroll-margin-top:12px}

/* Keep cut names inside each image without obscuring the haircut. */
.gal-item{position:relative}
.gal-item figcaption{position:absolute;inset:auto 0 0;padding:36px 16px 16px;background:linear-gradient(transparent,rgba(0,0,0,.88));color:#fff;font-family:var(--f-cond);font-size:clamp(1rem,1.35vw,1.25rem);font-weight:600;line-height:1.2;text-wrap:balance;pointer-events:none}

.gal-controls{display:flex;justify-content:flex-end;gap:12px;margin-bottom:20px}
.gal-arrow{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--gold);border-radius:50%;background:var(--ink);color:var(--paper);cursor:pointer}
.gal-arrow svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
.gal-arrow:hover{background:var(--gold);color:var(--ink)}
.gal-arrow:focus-visible{outline:2px solid var(--paper);outline-offset:4px}
.gal-arrow[hidden]{display:none}
.gal-controls:has(.gal-arrow:not([hidden])){min-height:48px}
.gal-controls:not(:has(.gal-arrow:not([hidden]))){display:none}
@media(max-width:900px){.gal-controls{display:none}}