:root{
  --bg:#0b0a08; --bg2:#13110d; --ink:#efe8da; --mute:#a59c8a; --line:rgba(239,232,218,.16);
  --gold:#d1a755; --gold2:#e2c17a;
  --serif:'Prata','Georgia',serif; --display:'Cormorant Garamond','Georgia',serif; --sans:'Inter Tight','Helvetica Neue',Arial,sans-serif;
  --gut:clamp(20px,2.4vw,36px);
  --caps:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --bow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 20'%3E%3Cpath d='M0 0L14 10L0 20V0Z'/%3E%3Cpath d='M36 0L22 10L36 20V0Z'/%3E%3Crect x='13' y='8' width='10' height='4' rx='1'/%3E%3C/svg%3E");
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--bg)}
body{background:var(--bg);color:var(--ink);font:300 18px/1.45 var(--sans);letter-spacing:0;overflow-x:clip;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
.wrap{padding:0 var(--gut);max-width:1760px;margin:0 auto}
.sq{display:inline-block;width:7px;height:7px;background:var(--gold);margin-right:10px;vertical-align:middle;transform:translateY(-1px)}
.mask{display:block;width:100%;aspect-ratio:var(--r);background:var(--ink);-webkit-mask:var(--m) center/100% 100% no-repeat;mask:var(--m) center/100% 100% no-repeat}
.h2{font:400 clamp(34px,4.6vw,66px)/1.04 var(--serif);letter-spacing:-.01em}
.rule{height:1px;background:var(--line);margin:clamp(20px,2.4vw,36px) 0}
.cols{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gut)}
.cols--tight{align-items:start}
.label{font:400 15px/1.3 var(--sans);color:var(--ink)}
.label--light{color:var(--ink)}
.ulink{display:inline-block;margin-top:28px;font:400 16px var(--sans);border-bottom:1px solid var(--ink);padding-bottom:2px;transition:color .25s,border-color .25s}
.ulink:hover{color:var(--gold);border-color:var(--gold)}
.btn{display:inline-block;margin-top:30px;padding:15px 26px;background:var(--gold);color:#16110a;font:400 16px var(--sans);transition:background .25s}
.btn:hover{background:var(--gold2)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* NAV: the live site's bar, transparent over the film, solid once scrolled */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;height:80px;display:flex;align-items:center;gap:var(--gut);padding:0 var(--gut);transition:background .4s,box-shadow .4s}
.nav.is-scrolled{background:rgba(11,10,8,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 2px 40px rgba(0,0,0,.3)}
.nav__logo{flex:none}
.nav__logo img{height:46px;width:auto}
.nav__links{display:flex;align-items:center;margin:0 auto}
.nav__link{position:relative;padding:28px 20px;font:500 13px var(--caps);letter-spacing:.12em;text-transform:uppercase;color:#fff;transition:color .3s}
.nav__link::before{content:'';position:absolute;top:10px;left:50%;width:16px;height:9px;background:var(--gold);-webkit-mask:var(--bow) center/contain no-repeat;mask:var(--bow) center/contain no-repeat;transform:translateX(-50%) scale(0);opacity:0;transition:transform .3s,opacity .3s}
.nav__link:hover,.nav__link.is-active{color:var(--gold)}
.nav__link:hover::before,.nav__link.is-active::before{transform:translateX(-50%) scale(1);opacity:1}
.nav__links:hover .nav__link.is-active:not(:hover){color:#fff}
.nav__links:hover .nav__link.is-active:not(:hover)::before{transform:translateX(-50%) scale(0);opacity:0}
.nav__panelbook{display:none}
.nav__toggle{display:none}

/* HERO: shop film behind the wordmark, overlay copy from the live site */
.hero{min-height:100svh;padding:100px var(--gut) 0;display:flex;flex-direction:column;justify-content:flex-end;gap:clamp(20px,3vh,36px);position:relative;isolation:isolate;overflow:hidden}
.hero__film{position:absolute;inset:0;z-index:-1;background:#000}
.hero__film video{width:100%;height:100%;object-fit:cover}
.hero__film::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,10,8,.55) 0%,rgba(11,10,8,.6) 45%,rgba(11,10,8,.88) 100%)}
.hero__center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px}
.hero__badge{display:flex;align-items:center;gap:14px;font:500 12px var(--caps);letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}
.hero__badge::before,.hero__badge::after{content:'';width:40px;height:1px;background:var(--gold)}
.hero__sub{font:italic 300 clamp(18px,2vw,26px)/1.35 var(--serif);color:rgba(239,232,218,.82);letter-spacing:.06em;max-width:22ch}
.nw{white-space:nowrap}
.hero__bow{width:36px;height:20px;fill:var(--gold);margin-top:6px}
.hero__place{display:flex;flex-direction:column;align-items:center;gap:10px}
.hero__place span{font:500 11px var(--caps);letter-spacing:.3em;text-transform:uppercase;color:rgba(239,232,218,.75)}
.hero__place b{display:block;font:500 18px/1 var(--display);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(209,167,85,.32);padding:12px calc(22px - .24em) 11px 22px}
.hero__word{width:100%;font-size:0}
.hero__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--gut);margin:0 calc(var(--gut)*-1);padding:0 0 0 var(--gut);background:rgba(11,10,8,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid rgba(209,167,85,.18)}
.hero__hours{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;font:400 12px var(--caps);letter-spacing:.1em;text-transform:uppercase;color:rgba(239,232,218,.82)}
.hero__hours span{display:flex;align-items:center;gap:28px}
.hero__hours span:first-child::after{content:'';width:4px;height:4px;border-radius:50%;background:var(--gold)}
.hero__book{display:inline-flex;align-items:center;justify-content:center;gap:12px;flex:none;padding:22px 36px;background:var(--gold);color:#0b0a08;font:600 13px var(--caps);letter-spacing:.16em;text-transform:uppercase;transition:background .3s}
.hero__book:hover{background:var(--gold2)}
.hero__book svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.hero__book:hover svg{transform:translateX(4px)}

/* GROW: portrait film that fills the screen */
.grow{height:320vh;position:relative}
.grow__stick{position:sticky;top:0;height:100svh;display:flex;align-items:center;justify-content:center;overflow:clip}
.grow,.smp{--p:0;--wp:0}
.grow__frame{position:relative;width:calc(22vw + (100vw - 22vw)*var(--p));height:calc(34svh + (100svh - 34svh)*var(--p));overflow:hidden;background:#000;z-index:1}
.grow__frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.grow__word{position:absolute;top:50%;z-index:2;font:400 clamp(34px,5.4vw,84px)/1 var(--serif);letter-spacing:-.01em;transform:translateY(-50%)}
.grow__word--l{left:var(--gut);margin-left:calc(var(--wp,0)*-34vw);opacity:calc(1 - var(--wp,0)*1.5)}
.grow__word--r{right:var(--gut);margin-right:calc(var(--wp,0)*-34vw);opacity:calc(1 - var(--wp,0)*1.5)}
.grow__cap{position:absolute;bottom:26px;left:0;right:0;text-align:center;z-index:3;font:400 15px var(--sans);color:var(--ink);opacity:calc(var(--wp,0)*1.2)}
.grow__cap{mix-blend-mode:normal;text-shadow:0 1px 12px rgba(0,0,0,.6)}

/* STORY */
.story{padding:clamp(70px,9vw,140px) 0 clamp(50px,6vw,90px)}
.story__body{max-width:640px}
.story__body p{font:300 clamp(17px,1.35vw,21px)/1.5 var(--sans);margin-bottom:1.1em}
/* STAT BADGES: the live site's circles, measured from wellkeptnyc.com */
.facts{display:flex;justify-content:center;gap:48px;margin-top:clamp(60px,7vw,100px)}
.stat{flex:none;width:130px;height:130px;border-radius:50%;border:2px solid rgba(209,167,85,.3);background:rgba(209,167,85,.06);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:border-color .4s,box-shadow .4s}
.stat:hover{border-color:var(--gold);box-shadow:0 0 40px rgba(209,167,85,.2)}
.stat b{font:600 2.4rem/1 var(--display);color:var(--gold)}
.stat span{margin-top:4px;font:500 .6rem/1.35 var(--caps);letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.6)}
@media (max-width:1024px){.facts{gap:32px}.stat{width:110px;height:110px}}
@media (max-width:768px){.facts{gap:20px;flex-wrap:wrap}.stat{width:100px;height:100px}.stat b{font-size:1.8rem}}
.story__duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--gut);margin-top:clamp(50px,7vw,110px);align-items:start}
.duo{overflow:hidden;background:#000;aspect-ratio:4/5}
.duo--b{margin-top:clamp(40px,10vw,160px)}
.duo video{width:100%;height:100%;object-fit:cover}

/* BARBERS */
.barbers{padding:clamp(40px,5vw,80px) 0 clamp(60px,7vw,110px)}
.barbers__lede{max-width:560px;font:300 18px/1.5 var(--sans);color:var(--ink)}
.rail{display:flex;gap:var(--gut);overflow-x:auto;scroll-snap-type:x mandatory;padding:clamp(34px,4vw,60px) var(--gut) 10px;scrollbar-width:none;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{display:none}
.bcard{position:relative;flex:0 0 clamp(240px,24vw,380px);scroll-snap-align:start;display:block}
.bcard__img{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--bg2);position:relative}
.bcard__img img{width:100%;height:100%;object-fit:cover;object-position:center 12%;filter:grayscale(.25);transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .6s}
.bcard:hover .bcard__img img{transform:scale(1.05);filter:none}
.bcard__name{display:block;font:400 clamp(26px,2.4vw,36px)/1.1 var(--serif);margin-top:16px}
.bcard__role{display:block;font:400 15px var(--sans);color:var(--mute);margin-top:4px}
.bcard__cue{display:block;position:absolute;right:12px;top:12px;padding:8px 12px;background:var(--ink);color:#16110a;font:400 14px var(--sans);transform:translateY(-6px);opacity:0;transition:opacity .35s,transform .35s}
.bcard:hover .bcard__cue,.bcard:focus-visible .bcard__cue{opacity:1;transform:none}
.rail__ctl{display:flex;gap:10px;margin-top:20px}
.rbtn{width:46px;height:46px;border:1px solid var(--line);background:none;color:var(--ink);font:400 18px var(--sans);cursor:pointer;transition:background .25s,color .25s}
.rbtn:hover{background:var(--ink);color:#16110a}
.rbtn svg{width:18px;height:18px;margin:auto;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* SERVICES ledger */
.services{padding:clamp(40px,5vw,80px) 0 clamp(70px,8vw,120px)}
.ledger li{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(0,1.5fr) minmax(90px,auto);gap:var(--gut);align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line);transition:padding .35s}
.ledger li:first-child{border-top:1px solid var(--line)}
.ledger li:hover{padding-left:12px}
.ledger__n{font:400 clamp(22px,2vw,30px)/1.15 var(--serif)}
.ledger__a{display:block}
.ledger__a:hover{color:var(--gold)}
.ledger__d{font:300 16px/1.4 var(--sans);color:var(--mute)}
.ledger__p{font:400 clamp(20px,1.8vw,26px) var(--serif);color:var(--gold);text-align:right;white-space:nowrap}
.ledger--plain .ledger__p{font:400 15px var(--sans);color:var(--ink)}

/* SMP pinned film */
.smp{height:300vh;position:relative}
.smp__frame{width:calc(30vw + (100vw - 30vw)*var(--p));height:calc(48svh + (100svh - 48svh)*var(--p))}
.smp__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.72));opacity:var(--p)}
.smp__copy{position:absolute;z-index:3;left:var(--gut);right:var(--gut);bottom:clamp(30px,6vh,70px);max-width:620px;opacity:calc((var(--p) - .55)*3.2);transform:translateY(calc((1 - var(--p))*30px))}
.smp__h{font:400 clamp(34px,4.6vw,66px)/1.04 var(--serif);margin:16px 0 18px;letter-spacing:-.01em}
.smp__copy p:not(.label){font:300 17px/1.5 var(--sans);max-width:520px}

/* PROOF */
.proof{padding:clamp(70px,8vw,120px) 0 clamp(50px,6vw,90px)}
.strip{overflow:hidden;margin:clamp(34px,4vw,60px) 0}
.strip__track{display:flex;gap:14px;width:max-content;animation:slide 60s linear infinite}
.strip video{width:clamp(150px,15vw,240px);aspect-ratio:9/16;object-fit:cover;background:#000;flex:none}
.quotes{overflow:hidden}
.quotes__track{display:flex;gap:var(--gut);width:max-content;animation:slide 90s linear infinite reverse;padding:0 var(--gut)}
.looks{overflow:hidden;margin:0 0 clamp(34px,4vw,60px)}
.looks__track{display:flex;gap:14px;width:max-content;animation:slide 70s linear infinite reverse}
.looks img{width:clamp(120px,11vw,180px);aspect-ratio:295/400;object-fit:cover;background:var(--bg2);flex:none}
.strip:hover .strip__track,.quotes:hover .quotes__track,.looks:hover .looks__track{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.q{flex:none;width:clamp(280px,30vw,460px);border-top:1px solid var(--line);padding-top:20px}
.q blockquote{font:300 clamp(17px,1.3vw,20px)/1.5 var(--sans)}
.q figcaption{margin-top:16px;font:400 14px var(--sans);color:var(--mute)}

/* PRESS */
.press{padding:clamp(40px,5vw,80px) 0 clamp(80px,9vw,140px)}

/* FOOTER */
.foot{background:var(--bg2);padding-top:clamp(50px,6vw,90px)}
.foot__top{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gut)}
.foot__col .label{margin-bottom:14px}
.foot__col p:not(.label){font:300 17px/1.5 var(--sans)}
.foot__col a:hover{color:var(--gold)}
.foot__col .label{display:flex;align-items:center;gap:10px}
.ico{width:16px;height:16px;flex:none;fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.foot__col--r{display:flex;flex-direction:column;align-items:flex-end;gap:18px}
.foot__social{display:flex;gap:12px}
.foot__social a{width:42px;height:42px;border:1px solid rgba(239,232,218,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:border-color .3s,color .3s,background .3s}
.foot__social a:hover{border-color:var(--gold);color:var(--gold);background:rgba(209,167,85,.1)}
.foot__social svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.foot__social .fill{fill:currentColor;stroke:none}
.foot__link{display:inline-flex;align-items:center;gap:10px;font:400 16px var(--sans)}
.foot__link svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.foot__link:hover{color:var(--gold)}
.foot__link:hover svg{transform:translateX(4px)}
.foot__word{font-size:0;margin:clamp(40px,6vw,90px) 0 clamp(20px,2vw,30px)}
.foot__word .mask{background:var(--gold)}
.foot__base{display:flex;flex-wrap:wrap;gap:6px 24px;justify-content:space-between;padding-top:18px;padding-bottom:22px;font:400 14px var(--sans);color:var(--mute);border-top:1px solid var(--line)}

/* PHONE */
@media (max-width:860px){
  body{font-size:17px}
  .nav{height:70px;justify-content:space-between}
  .nav.is-scrolled{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(11,10,8,.97)}
  .nav__logo img{height:40px}
  .nav__toggle{display:flex;flex-direction:column;gap:6px;padding:12px 4px 12px 12px;background:none;border:0;cursor:pointer;position:relative;z-index:2}
  .nav__toggle span{display:block;width:30px;height:2px;background:#fff;transition:transform .35s,opacity .35s}
  .nav__toggle[aria-expanded=true] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav__toggle[aria-expanded=true] span:nth-child(2){opacity:0}
  .nav__toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .nav__links{position:fixed;z-index:1;top:0;right:0;bottom:0;width:min(78vw,320px);margin:0;flex-direction:column;justify-content:center;gap:4px;padding:90px 30px 40px;background:rgba(11,10,8,.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);transform:translateX(100%);visibility:hidden;transition:transform .45s cubic-bezier(.25,.46,.45,.94),visibility 0s .45s}
  .nav__links.open{transform:none;visibility:visible;transition:transform .45s cubic-bezier(.25,.46,.45,.94)}
  .nav__link{padding:16px 0;font-size:17px;letter-spacing:.14em}
  .nav__link::before{display:none}
  .nav__panelbook{display:block;margin-top:26px;padding:16px 22px;background:var(--gold);color:#0b0a08;font:600 12px var(--caps);letter-spacing:.16em;text-transform:uppercase;text-align:center}
  .hero{padding-top:84px;gap:18px}
  .hero__center{gap:14px}
  .hero__bar{flex-direction:column;align-items:stretch;gap:0;padding:0}
  .hero__hours{justify-content:center;padding:14px var(--gut);font-size:11px;gap:6px 18px}
  .hero__hours span{gap:18px}
  .hero__book{padding:19px 20px;font-size:12px}
  .cols{grid-template-columns:1fr;gap:18px}
  .hero__lede{align-self:flex-start;max-width:320px}
  .grow{height:300vh}
  .grow__stick{flex-direction:column;justify-content:center;gap:0}
  .grow__frame{width:calc(54vw + (100vw - 54vw)*var(--p));height:calc(46svh + (100svh - 46svh)*var(--p))}
  .grow__word{position:absolute;left:0;right:auto;margin:0;width:100%;text-align:center;transform:none}
  .grow__word--l{top:11svh;margin-top:calc(var(--wp,0)*-18svh)}
  .grow__word--r{top:auto;bottom:11svh;right:auto;margin-bottom:calc(var(--wp,0)*-18svh)}
  .grow__word--l,.grow__word--r{margin-left:0;margin-right:0}
  .story__duo{grid-template-columns:1fr 1fr}
  .duo--b{margin-top:50px}
  .ledger li{grid-template-columns:1fr auto;gap:6px 14px}
  .ledger__d{grid-column:1/-1;grid-row:2}
  .ledger li:hover{padding-left:0}
  .smp__frame{width:calc(60vw + (100vw - 60vw)*var(--p));height:calc(52svh + (100svh - 52svh)*var(--p))}
  .foot__top{grid-template-columns:1fr 1fr}
  .foot__col--r{align-items:flex-start}
}
/* INNER PAGES: Haven's statement, label column, bleed media, key-facts table */
.page{padding-top:clamp(130px,15vw,200px)}
.crumb{display:inline-flex;align-items:center;gap:10px;margin-bottom:clamp(30px,4vw,56px);font:400 15px var(--sans);color:var(--mute);transition:color .25s}
.crumb:hover{color:var(--gold)}
.crumb svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lead{font:400 clamp(32px,3.9vw,58px)/1.1 var(--serif);letter-spacing:-.01em;max-width:21ch}
.prose{max-width:640px}
.prose p{font:300 clamp(17px,1.35vw,21px)/1.55 var(--sans);margin-bottom:1.1em}
.prose .btn{margin-top:14px}
.sec{padding-top:clamp(70px,9vw,140px)}
.sec--last{padding-bottom:clamp(80px,9vw,140px)}
.bleed{margin-top:clamp(50px,7vw,110px)}
.bleed img,.bleed video{width:100%;aspect-ratio:16/8;object-fit:cover;background:#000}
.cap{display:flex;justify-content:space-between;gap:var(--gut);margin-top:12px;font:400 14px var(--sans);color:var(--mute)}
.meta{border-top:1px solid var(--line);margin:8px 0 6px}
.meta div{display:grid;grid-template-columns:minmax(110px,1fr) minmax(0,2.4fr);gap:var(--gut);padding:13px 0;border-bottom:1px solid var(--line)}
.meta dt{font:400 15px var(--sans);color:var(--mute)}
.meta dd{font:400 16px/1.45 var(--sans)}
.meta a:hover{color:var(--gold)}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 22px}
.tags li{padding:7px 12px;border:1px solid var(--line);font:400 14px var(--sans)}
.status{display:inline-flex;align-items:center;gap:8px;font:400 14px var(--sans);color:var(--mute)}
.status::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--mute)}
.status--on{color:var(--ink)}.status--on::before{background:var(--gold)}
.ledger__when{display:block;margin-top:6px;font:400 14px var(--sans);color:var(--mute)}
.ledger--menu li{display:block;padding:0}
.ledger--menu li:hover{padding-left:0}
.ledger--menu a{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(0,1.5fr) minmax(110px,auto);gap:var(--gut);align-items:baseline;padding:22px 0;transition:padding .35s}
.ledger--menu a:hover{padding-left:12px}
.ledger--menu a:hover .ledger__n{color:var(--gold)}
.ledger__p small{display:block;margin-top:4px;font:400 14px var(--sans);color:var(--mute)}
.note{margin-top:22px;font:400 14px/1.5 var(--sans);color:var(--mute);max-width:640px}
.smpf{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gut);align-items:end}
.smpf video{width:100%;aspect-ratio:4/3;object-fit:cover;background:#000}
.smpf h2{font:400 clamp(28px,2.8vw,42px)/1.1 var(--serif);margin:14px 0 16px}
.smpf p:not(.label){font:300 17px/1.55 var(--sans)}
.smpf .sub{display:block;margin-top:14px;font:400 15px var(--sans);color:var(--mute)}
.smpf .sub a{border-bottom:1px solid var(--line)}
.btn--ghost{background:none;border:1px solid var(--line);color:var(--ink);margin-left:10px}
.btn--ghost:hover{background:none;border-color:var(--gold);color:var(--gold)}
/* Barber profile */
.pro{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,70px);align-items:start}
.pro__img{position:sticky;top:110px;aspect-ratio:4/5;overflow:hidden;background:var(--bg2)}
.pro__img img{width:100%;height:100%;object-fit:cover;object-position:center 15%}
.pro__name{font:400 clamp(64px,9vw,150px)/.92 var(--serif);letter-spacing:-.02em;margin:18px 0 clamp(20px,2.4vw,34px)}
.pro .prose{margin-bottom:10px}
.next{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--gut);padding:clamp(28px,3vw,44px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);transition:color .3s}
.next b{display:block;margin-top:10px;font:400 clamp(44px,6vw,96px)/1 var(--serif);letter-spacing:-.01em}
.next svg{width:clamp(30px,3vw,48px);height:clamp(30px,3vw,48px);fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s}
.next:hover{color:var(--gold)}
.next:hover svg{transform:translateX(8px)}
.bcard--work .bcard__name{font-size:clamp(22px,1.9vw,28px)}
@media (max-width:860px){
  .bleed img,.bleed video{aspect-ratio:4/3}
  .cap{flex-direction:column;gap:2px}
  .ledger--menu a{grid-template-columns:1fr auto;gap:6px 14px}
  .ledger--menu a .ledger__d{grid-column:1/-1;grid-row:2}
  .ledger--menu a:hover{padding-left:0}
  .smpf{grid-template-columns:1fr}
  .pro{grid-template-columns:1fr}
  .pro__img{position:relative;top:0}
  .btn--ghost{margin-left:0}
  .meta div{grid-template-columns:96px minmax(0,1fr)}
}
/* TITLE CASE: headings, labels and links read like the live site's */
h1,h2,h3,h4,.label,.hero__sub,.grow__word,.bcard__name,.bcard__role,.bcard__cue,.ulink,.btn,.cap span,.ledger__n,.status,.crumb,.next b,.tags li,.foot__link,.smp__h,.pp-svc,.pp-menu{text-transform:capitalize}

/* STORY: the whole crew, framed over its own blurred light */
.crew{position:relative;isolation:isolate;overflow:hidden;margin-top:clamp(50px,7vw,110px);padding:clamp(28px,5vw,80px) 0 clamp(18px,2vw,28px);background:#000}
.crew__glow{position:absolute;inset:-80px;z-index:-1;background:url(/media/crew.jpg) center 40%/cover;filter:blur(50px) saturate(1.2) brightness(.4)}
.crew__frame{width:min(600px,calc(100% - 2*var(--gut)));margin:0 auto;padding:clamp(6px,.8vw,12px);border:1px solid rgba(209,167,85,.38);background:rgba(11,10,8,.4);box-shadow:0 40px 90px rgba(0,0,0,.55)}
.crew__frame img{width:100%;aspect-ratio:3/4;object-fit:cover}
.crew .cap{margin-top:18px;color:rgba(239,232,218,.72)}

/* BARBER PROFILE: the live wellkeptnyc.com profile, measured */
body[data-barber] .nav{background:rgba(11,10,8,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
/* A blur on the header turns it into the box its fixed phone menu sizes against, so the
   open menu came out 130px tall with its links spilling over the page. No blur on phones,
   same as .nav.is-scrolled above. */
@media (max-width:860px){body[data-barber] .nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(11,10,8,.97)}}
/* With the phone menu open: the logo stays whole above the panel (as the close button does),
   and the Book pill and the chat bubble step aside so they never sit on the menu. */
@media (max-width:860px){.nav__logo{position:relative;z-index:2}}
body.menu-open .pp-pill{transform:translate(-50%,160%)}
body.menu-open chat-widget{display:none!important}
.pp{padding-top:80px}
.pp-shell{max-width:1120px;margin:0 auto;padding-inline:var(--gut)}
.pp-hero{position:relative;isolation:isolate;background:#b7bbc6}
.pp-hero img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 18%;max-height:70svh}
.pp-hero::after{content:'';position:absolute;inset:auto 0 0 0;height:22%;background:linear-gradient(to bottom,rgba(11,10,8,0),rgba(11,10,8,.55) 62%,var(--bg));pointer-events:none}
.pp-intro{padding:26px var(--gut) 4px;max-width:1120px;margin:0 auto}
.pp-intro .crumb{display:none}
.pp-eyebrow{font:600 .68rem var(--caps);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.pp-name{margin-top:12px;font:600 clamp(2.9rem,13vw,4.6rem)/.92 var(--display);letter-spacing:-.01em;color:#fff;text-wrap:balance}
.pp-rule{width:56px;height:2px;background:var(--gold);margin:22px 0 18px}
.pp-bio{max-width:46ch;font:300 17px/1.6 var(--sans);color:#cfcfcf}
.pp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.pp-chips li{padding:8px 15px;border:1px solid rgba(209,167,85,.25);border-radius:100px;font:500 .68rem var(--caps);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.pp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:18px 34px;border-radius:100px;background:var(--gold);color:#0b0a08;font:700 .82rem var(--caps);letter-spacing:.14em;text-transform:uppercase;transition:background .3s,transform .2s}
.pp-btn:hover{background:var(--gold2);transform:translateY(-2px)}
.pp-btn--intro,.pp-hint{display:none}
.pp-btn--intro{margin-top:28px}
.pp-hint{margin-top:12px;max-width:36ch;font:400 .82rem var(--sans);color:var(--mute)}
.pp-work{padding-block:44px 8px}
.pp-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:6px}
.pp-work h2,.pp-place h2{font:500 2.1rem/1.1 var(--display);color:#fff}
.pp-menu{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;font:500 .7rem var(--caps);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.pp-menu:hover{color:var(--gold2)}
.pp-note{margin-bottom:20px;font:400 .86rem var(--sans);color:var(--mute)}
.pp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.pp-tile{position:relative;display:block;border-radius:14px;overflow:hidden;background:var(--bg2)}
.pp-tile img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.pp-tile::after{content:'';position:absolute;inset:auto 0 0 0;height:62%;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.82));pointer-events:none}
.pp-tag{position:absolute;z-index:2;left:12px;right:12px;bottom:11px;display:flex;align-items:flex-end;justify-content:space-between;gap:8px}
.pp-svc{font:600 .78rem/1.25 var(--caps);color:#fff}
.pp-amt{font:600 1.25rem/1 var(--display);color:var(--gold2)}
@media (hover:hover){.pp-tile:hover img{transform:scale(1.05)}}
.pp-place{margin-top:40px;padding-block:44px 30px;border-top:1px solid rgba(255,255,255,.07)}
.pp-place h2{font-size:1.9rem;margin-bottom:18px}
.pp-fact{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.pp-fact:last-child{border-bottom:0}
.pp-fact dt{flex:none;font:500 .68rem var(--caps);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.pp-fact dd{text-align:right;font:400 .95rem/1.6 var(--caps);color:var(--ink)}
.pp-fact dd a{color:var(--gold)}
.pp-band{padding:46px var(--gut) 40px;text-align:center}
.pp-band p{max-width:34ch;margin:16px auto 0;font:400 .84rem/1.6 var(--sans);color:var(--mute)}
.pp-next{padding-bottom:clamp(60px,7vw,110px)}
.pp-pill{position:fixed;z-index:70;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translate(-50%,0);width:calc(100% - 40px);max-width:420px;min-height:54px;display:flex;align-items:center;justify-content:center;border-radius:100px;background:var(--gold);color:#0b0a08;font:700 .82rem var(--caps);letter-spacing:.14em;text-transform:uppercase;box-shadow:0 10px 34px rgba(0,0,0,.55);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.pp-pill.tuck{transform:translate(-50%,160%)}
@media (min-width:861px){
  .pp-stage{display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:56px;max-width:1120px;margin:0 auto;padding:40px var(--gut) 10px}
  .pp-hero{grid-column:2;grid-row:1;border-radius:18px;overflow:hidden}
  .pp-hero img{max-height:none}
  .pp-hero::after{display:none}
  .pp-intro{grid-column:1;grid-row:1;padding:0}
  .pp-intro .crumb{display:inline-flex}
  .pp-name{font-size:clamp(3.4rem,5.4vw,5rem)}
  .pp-grid{grid-template-columns:repeat(4,1fr);gap:14px}
  .pp-btn--intro{display:inline-flex}
  .pp-hint{display:block}
  .pp-pill{display:none}
}
@media (max-width:860px){.pp{padding-top:70px}}
/* the service sheet (booking-sheet.js) takes the live site's faces */
.bs{--serif:var(--display);--sans:var(--caps);font-family:var(--caps)}
.bs-head h2{font-weight:600!important}
/* EVENTS: the live wellkeptnyc.com/events, measured, on this site's tokens */
.ev-page{--paper:#ede6d6;--ev-t:.4s cubic-bezier(.25,.46,.45,.94)}
.ev-shell{max-width:1180px;margin:0 auto;padding-inline:var(--gut)}
.ev-page em{font-style:italic;color:var(--gold)}
.ev-hero{position:relative;overflow:hidden;padding:176px 24px 72px;text-align:center;background:radial-gradient(ellipse at 50% 30%,rgba(209,167,85,.08) 0%,transparent 55%),linear-gradient(180deg,#0a0a0a 0%,#1a1a1a 60%,#0a0a0a 100%)}
.ev-hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(209,167,85,.15) 1px,transparent 0);background-size:40px 40px;opacity:.25;pointer-events:none}
.ev-hero-inner{position:relative;max-width:860px;margin:0 auto}
.ev-eyebrow{display:block;margin-bottom:26px;font:600 .72rem var(--caps);letter-spacing:.4em;text-transform:uppercase;color:var(--gold)}
.ev-hero h1{font:500 clamp(2.8rem,8vw,5.4rem)/1.04 var(--display);letter-spacing:-.01em;color:#fff}
.ev-rule{width:60px;height:1px;margin:30px auto;background:rgba(209,167,85,.5)}
.ev-hero p{max-width:560px;margin:0 auto;font:400 1rem/1.75 var(--caps);color:#a8a8a8}
.ev-btn{display:inline-flex;align-items:center;gap:10px;padding:17px 40px;background:var(--gold);color:#0a0a0a;font:600 .82rem var(--caps);letter-spacing:.15em;text-transform:uppercase;transition:background var(--ev-t),letter-spacing var(--ev-t)}
.ev-btn:hover{background:var(--gold2);letter-spacing:.2em}
.ev-btn svg,.ev-btn-ghost svg{width:16px;height:16px}
.ev-btn-ghost{display:inline-flex;align-items:center;gap:10px;padding:17px 34px;border:1px solid rgba(209,167,85,.4);color:#efefef;font:500 .78rem var(--caps);letter-spacing:.15em;text-transform:uppercase;transition:border-color var(--ev-t),color var(--ev-t),background var(--ev-t)}
.ev-btn-ghost:hover{border-color:var(--gold);color:var(--gold);background:rgba(209,167,85,.06)}
.ev-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:40px}
.ev-section{padding:96px 0}
.ev-section-head{max-width:640px;margin-bottom:52px}
.ev-section-head .ev-eyebrow{margin-bottom:16px}
.ev-section-head h2{font:500 clamp(2rem,4.4vw,3rem)/1.12 var(--display);color:#fff}
.ev-section-head p{margin-top:16px;font:400 .95rem/1.75 var(--caps);color:#9a9a9a}
.ev-featured{background:var(--bg)}
.ev-feature-grid{display:grid;grid-template-columns:1fr .85fr;gap:72px;align-items:start;padding-top:52px;border-top:1px solid rgba(209,167,85,.22)}
.ev-status{display:inline-flex;align-items:center;gap:9px;margin-bottom:24px;padding:8px 16px;border:1px solid rgba(209,167,85,.35);font:600 .66rem var(--caps);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.ev-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);flex-shrink:0}
.ev-status.is-live{color:#6cc46c;border-color:rgba(108,196,108,.4)}
.ev-status.is-live .ev-dot{background:#6cc46c;animation:ev-pulse 2s infinite}
.ev-status.is-past{color:#8a8a8a;border-color:rgba(255,255,255,.14)}
.ev-status.is-past .ev-dot{background:#8a8a8a}
@keyframes ev-pulse{0%,100%{opacity:1}50%{opacity:.35}}
.ev-feature-body h3{margin-bottom:18px;font:500 clamp(2.1rem,4.6vw,3.2rem)/1.08 var(--display);color:#fff}
.ev-feature-body>p{max-width:46ch;font:400 .98rem/1.8 var(--caps);color:#a8a8a8}
.ev-perks{margin-top:34px;border-top:1px solid rgba(255,255,255,.08)}
.ev-perk{display:flex;align-items:flex-start;gap:18px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.ev-perk-icon{flex-shrink:0;width:42px;height:42px;border:1px solid rgba(209,167,85,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold)}
.ev-perk-icon svg{width:19px;height:19px}
.ev-perk h4{margin-bottom:4px;font:600 .95rem var(--caps);letter-spacing:.02em;color:#fff}
.ev-perk p{font:400 .85rem/1.6 var(--caps);color:#8e8e8e}
.ev-feature-meta{display:flex;flex-wrap:wrap;gap:28px;margin-top:30px}
.ev-meta-item span{display:block;margin-bottom:7px;font:600 .62rem var(--caps);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.ev-meta-item p{font:400 .9rem/1.5 var(--caps);color:#efefef}
.ev-meta-item a{border-bottom:1px solid rgba(209,167,85,.35)}
.ev-meta-item a:hover{color:var(--gold)}
.ev-feature-body .ev-actions{justify-content:flex-start;margin-top:34px}
.ev-flyer-stage{position:sticky;top:124px;display:flex;flex-direction:column;align-items:center;padding:14px 20px 0}
.ev-flyer{position:relative;display:flex;flex-direction:column;width:100%;max-width:360px;aspect-ratio:4/5;background:#0a0a0a;border:1px solid rgba(209,167,85,.28);box-shadow:0 30px 70px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.6);transform:rotate(-2.2deg);transition:transform .6s cubic-bezier(.25,.46,.45,.94)}
.ev-flyer-stage:hover .ev-flyer{transform:rotate(0) translateY(-6px)}
.ev-flyer::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(209,167,85,.12) 1px,transparent 0);background-size:26px 26px;opacity:.5;pointer-events:none}
.ev-flyer-body{position:relative;flex:1;display:flex;flex-direction:column;padding:30px 28px 20px}
.ev-flyer-mark{display:flex;flex-direction:column;align-items:center;gap:9px;color:var(--paper)}
.ev-flyer-word{font:500 1.32rem/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--paper)}
.ev-flyer-sub{font:500 .5rem var(--caps);letter-spacing:.42em;text-transform:uppercase;color:rgba(237,230,214,.6)}
.ev-flyer-art{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:14px 0 6px}
.ev-flyer-art svg{width:102px;height:auto;max-height:100%;color:var(--gold);opacity:.72}
.ev-flyer-kicker{margin-bottom:8px;font:700 .6rem var(--caps);letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.ev-flyer-title{font:700 clamp(1.6rem,3.4vw,2.05rem)/.94 var(--caps);letter-spacing:-.015em;text-transform:uppercase;color:var(--paper)}
.ev-flyer-count{margin-top:13px;padding-top:11px;border-top:1px solid rgba(237,230,214,.18);font:500 .6rem/1.5 var(--caps);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;color:rgba(237,230,214,.68)}
.ev-flyer-bar{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 20px;background:var(--gold);color:#101010;font:700 .72rem var(--caps);letter-spacing:.14em;text-transform:uppercase}
.ev-flyer-bar svg{width:14px;height:14px;flex-shrink:0}
.ev-flyer-pin{position:absolute;z-index:3;top:-9px;left:50%;width:18px;height:18px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--gold2),#b8903e);box-shadow:0 3px 9px rgba(0,0,0,.6)}
.ev-year{background:linear-gradient(180deg,#0a0a0a 0%,#131313 50%,#0a0a0a 100%)}
.ev-timeline{position:relative;padding-left:34px}
.ev-timeline::before{content:'';position:absolute;left:5px;top:12px;bottom:12px;width:1px;background:linear-gradient(180deg,rgba(209,167,85,.55),rgba(209,167,85,.12))}
.ev-entry{position:relative;display:grid;grid-template-columns:190px 1fr auto;gap:36px;align-items:start;padding:34px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.ev-entry:last-child{border-bottom:0}
.ev-entry::before{content:'';position:absolute;left:-34px;top:44px;width:12px;height:7px;background:var(--gold);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 20'%3E%3Cpath d='M0 0L14 10L0 20V0Z'/%3E%3Cpath d='M36 0L22 10L36 20V0Z'/%3E%3Crect x='13' y='8' width='10' height='4' rx='1'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 20'%3E%3Cpath d='M0 0L14 10L0 20V0Z'/%3E%3Cpath d='M36 0L22 10L36 20V0Z'/%3E%3Crect x='13' y='8' width='10' height='4' rx='1'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.4;transition:opacity var(--ev-t)}
.ev-entry.is-next::before{opacity:1}
.ev-when{font:500 clamp(1.5rem,2.4vw,1.95rem)/1.1 var(--display);color:#fff}
.ev-when span{display:block;margin-top:8px;font:600 .62rem var(--caps);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.ev-what h3{margin-bottom:8px;font:600 1.06rem var(--caps);letter-spacing:.01em;color:#fff}
.ev-what p{max-width:52ch;font:400 .9rem/1.7 var(--caps);color:#8e8e8e}
.ev-tag{align-self:center;white-space:nowrap;padding:7px 14px;border:1px solid rgba(255,255,255,.14);font:600 .6rem var(--caps);letter-spacing:.2em;text-transform:uppercase;color:#8a8a8a}
.ev-tag.is-open{color:var(--gold);border-color:rgba(209,167,85,.4)}
.ev-pull{padding:0 24px 96px;background:var(--bg)}
.ev-pull span{display:block;max-width:660px;margin:0 auto;padding:30px 0;border-top:1px solid rgba(209,167,85,.2);border-bottom:1px solid rgba(209,167,85,.2);text-align:center;font:italic 500 clamp(1.2rem,2.1vw,1.55rem)/1.5 var(--display);letter-spacing:.01em;color:var(--gold)}
.ev-pull cite{display:block;margin-top:16px;font:normal 600 .66rem var(--caps);letter-spacing:.22em;text-transform:uppercase;color:rgba(237,230,214,.45)}
.ev-cta{padding:90px 24px 130px;text-align:center;background:linear-gradient(180deg,#0a0a0a 0%,#1a1a1a 50%,#0a0a0a 100%)}
.ev-cta h2{max-width:700px;margin:0 auto 20px;font:500 clamp(2rem,5vw,3.3rem)/1.12 var(--display);color:#fff}
.ev-cta p{max-width:520px;margin:0 auto;font:400 1rem/1.7 var(--caps);color:#a8a8a8}
@media (max-width:1024px){
  .ev-feature-grid{grid-template-columns:1fr;gap:48px}
  .ev-flyer-stage{order:-1;position:static;padding:0 0 8px}
  .ev-flyer{max-width:320px}
}
@media (max-width:768px){
  .ev-section{padding:72px 0}
  .ev-hero{padding:130px 24px 56px}
  .ev-entry{grid-template-columns:1fr;gap:14px;padding:28px 0}
  .ev-entry::before{top:34px}
  .ev-tag{justify-self:start;align-self:start}
}
@media (max-width:480px){
  .ev-actions .ev-btn,.ev-actions .ev-btn-ghost{width:100%;justify-content:center}
  .ev-feature-meta{gap:22px}
  .ev-timeline{padding-left:26px}
  .ev-entry::before{left:-26px}
  .ev-pull{padding-bottom:72px}
  .ev-cta{padding:70px 24px 100px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .strip__track,.quotes__track{animation:none}
  .grow{height:auto}.grow__stick{position:relative;height:auto;padding:80px 0}.grow__frame{width:90vw;height:70svh}
  .smp{height:auto}.smp .grow__stick{height:auto}.smp__copy{position:relative;opacity:1;transform:none;margin-top:20px}.smp__frame{width:90vw;height:70svh}
}
