/* Local art direction: printed botanical wallpaper, paper and stained wood. */
:root {
  --ink:#1b2019;
  --paper:#f1e8d6;
  --gold:#c5a366;
  --muted:#ccc7b9;
  --line:#555342;
  --wood:#32281f;
  --wallpaper:url('assets/botanical-wallpaper.jpg');
}
body{background:var(--ink)}
.header{background:var(--wood);border-bottom:3px double #9b8252}
.wordmark>span{color:var(--paper)}
.button{box-shadow:inset 0 0 0 3px var(--gold),inset 0 0 0 4px #71572e;border-color:#cdb27d}
.button:hover{box-shadow:none}
.hero{
  background-image:linear-gradient(90deg,#151c17b8,#151c173d),var(--wallpaper);
  background-position:center;
  background-size:cover;
}
.hero-shade{display:none}
.hero-content{width:64%;padding-left:7%;padding-right:2%;position:relative;z-index:1}
.hero h1{font-size:clamp(52px,min(6.5vw,11.5vh),104px);text-shadow:0 2px 16px #10180dc9;letter-spacing:-3px}
.hero-intro{max-width:470px;color:#f1e8d6;text-shadow:0 1px 6px #111}
.hero .eyebrow{color:#f1e8d6;text-shadow:0 1px 6px #111}
.hero-photo{
  z-index:0;right:7%;top:36px;width:31%;height:calc(100% - 178px);
  object-position:50% 55%;opacity:1;filter:saturate(.65) sepia(.14);
  border:9px solid var(--wood);outline:1px solid #b39a68;outline-offset:4px;
  border-radius:46% 46% 2px 2px;box-shadow:0 12px 35px #080e0977;
}
.hero-note{top:auto;bottom:87px;right:7%;width:31%;border:0;padding:0;text-align:center;z-index:1}
.hero-note>span{font-size:10px;letter-spacing:2px}
.hero-note small{font-family:var(--display);font-size:17px;margin:0;color:var(--paper)}
.hero-bottom{margin-inline:7%;border-color:#c5a36666;color:#eee6d5;z-index:1}
.statement{background:#c0a16a;color:#22271e;border-block:4px double #74603d}
.services{
  background-image:linear-gradient(#1b2019e8,#1b2019e8),var(--wallpaper);
  background-size:cover;
}
.price-menu{
  background:#ede2cd;color:#292e23;padding:25px 30px;
  border:1px solid #9d865e;outline:1px solid #9d865e;outline-offset:5px;
  box-shadow:0 12px 35px #0003;
}
.menu-head{color:#63502b;border-color:#b6a585}
.service{border-color:#c2b292;padding-block:18px}
.service p,.service p span,.price-menu .source-note,.menu-extra>span>span{color:#615c4d}
.price>span{color:#725a2f}
.service:hover{background:#e3d5ba}
.price-menu a:focus-visible{outline-color:#755b2f}
.shop-section{
  background-image:linear-gradient(#f0e7d8f2,#f0e7d8f2),var(--wallpaper);
  background-size:cover;color:#22281e;
}
.mirror-frame{background:var(--wood);border-color:#584731;box-shadow:0 0 0 5px #ae915f,0 0 0 7px #493b28,0 9px 24px #38271930}
.mirror-frame img{filter:saturate(.75) sepia(.08)}
.style-picker button[aria-pressed="true"]{background:#293224;border-color:#293224}
.quote,.barber-note{border-color:#b7a887}
.visit{
  background-image:linear-gradient(90deg,#152019c9,#152019a6),var(--wallpaper);
  background-size:cover;background-position:center;
}
.visit-intro{text-shadow:0 2px 12px #1119}
.visit-details{background:#1c231dee;padding:30px;border:1px solid #a98e5866;gap:24px}
footer{background:var(--wood);border-top:4px double #9b8252}
.mobile-booking:not([hidden]){background:var(--wood)}
@media(min-width:651px) and (max-height:760px){
  .hero-photo{top:28px;height:calc(100% - 165px)}
  .hero-note{bottom:78px}.hero h1{margin-top:18px}
  .hero-intro{margin-top:20px}.hero-actions{margin-top:22px}
  .price-menu{padding-block:20px}.service{padding-block:15px}
}
@media(max-width:1050px){
  .price-menu{padding-inline:22px}.visit-details{padding:24px}
  .hero-content{width:66%;padding-left:6%}.hero-photo{right:5%;width:29%}.hero-note{right:5%;width:29%}
}
@media(min-width:651px) and (max-width:900px){
  .hero-note{display:block}.hero h1{font-size:clamp(51px,7.8vw,70px)}
  .hero-photo{top:14%;height:64%}.hero-note{bottom:14%}
  .price-menu{padding-inline:17px}.service h3{font-size:22px}.price{gap:12px}
}
@media(max-width:650px){
  .hero{background-image:linear-gradient(#151c1799,#151c1799),var(--wallpaper);background-size:auto 850px;background-position:center top}
  .hero-content{width:100%;padding:36px 6% 28px}
  .hero h1{font-size:clamp(48px,12.4vw,80px);letter-spacing:-2.7px}
  .hero-photo{display:none}
  .hero-note{display:none}
  .hero-intro{max-width:350px}
  .hero-bottom{margin-inline:6%}
  .services{background-size:auto 900px}
  .price-menu{padding:24px 18px;outline-offset:4px;margin:4px}
  .service{padding-block:18px}.service h3{font-size:24px}
  .shop-section{background-size:auto 1200px}
  .visit{background-size:auto 950px}
  .visit-details{padding:24px 18px;gap:22px}
}
@media(max-width:390px){.visit-details{grid-template-columns:1fr}.hours dl>div{display:flex}}
