:root {
  --carbon:#101314;
  --carbon-soft:#1b2021;
  --carbon-deep:#090b0c;
  --ash:#c8ccc8;
  --bone:#ebece7;
  --ink:#121515;
  --signal:#a4253c;
  --signal-dark:#73182b;
  --line:rgba(235,236,231,.22);
  --dark-line:rgba(18,21,21,.18);
  --mono:'IBM Plex Mono',ui-monospace,'Cascadia Mono','SFMono-Regular',Consolas,monospace;
  --sans:'Inter',Arial,Helvetica,sans-serif;
  --display:'Fraunces',Georgia,serif;
}
* { box-sizing:border-box; }
html { overflow-x:hidden; scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--bone); background:var(--carbon); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:0; z-index:-1; opacity:.08; background-image:linear-gradient(rgba(235,236,231,.18) 1px, transparent 1px); background-size:100% 9px; pointer-events:none; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; text-underline-offset:5px; }
button,input,select { font:inherit; }
button { border:0; }
::selection { color:var(--bone); background:var(--signal); }
:focus-visible { outline:2px solid var(--signal); outline-offset:4px; }

.site-header { position:sticky; top:0; z-index:10; border-bottom:1px solid var(--line); background:rgba(16,19,20,.86); backdrop-filter:blur(18px); }
.nav-shell { width:min(1440px,calc(100% - 64px)); min-height:78px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.wordmark { display:grid; gap:1px; line-height:.92; font-family:var(--display); font-weight:800; letter-spacing:-.025em; font-size:1.52rem; font-variation-settings:"SOFT" 35,"WONK" 0; }
.wordmark i { color:var(--signal); font-family:var(--mono); font-size:.53rem; font-style:normal; letter-spacing:.15em; text-transform:uppercase; }
nav { display:flex; gap:28px; margin-left:auto; font:600 .68rem var(--mono); letter-spacing:.04em; text-transform:uppercase; }
nav a { transition:color .2s ease; }
nav a:hover { color:var(--signal); }
.nav-book,.primary-button,.form-submit,.service-row button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:0 18px; border:1px solid currentColor; color:var(--bone); background:transparent; font:600 .68rem var(--mono); letter-spacing:.05em; text-transform:uppercase; cursor:pointer; transition:background .2s ease,color .2s ease,transform .2s ease,border-color .2s ease; }
.nav-book:hover,.primary-button:hover,.service-row button:hover { color:var(--carbon); background:var(--bone); transform:translateY(-2px); }

.hero { position:relative; min-height:calc(100svh - 78px); display:grid; grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr); overflow:hidden; background:var(--carbon-deep); }
.hero-art { position:relative; grid-column:2; min-height:720px; overflow:hidden; }
.hero-art img { width:100%; height:100%; object-fit:cover; object-position:57% center; filter:saturate(.72) contrast(1.08); animation:hero-breathe 16s ease-in-out infinite; }
.hero-art::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,11,12,.34),transparent 45%); pointer-events:none; }
.hero-counter { position:absolute; right:32px; bottom:26px; margin:0; color:rgba(235,236,231,.72); font:.57rem/1.65 var(--mono); letter-spacing:.1em; text-align:right; text-transform:uppercase; }
.hero-copy { position:relative; z-index:1; grid-row:1; grid-column:1; align-self:center; padding:44px clamp(32px,7vw,115px) 64px; }
.eyebrow { margin:0; color:var(--signal); font:600 .64rem var(--mono); letter-spacing:.13em; text-transform:uppercase; }
.hero h1 { max-width:12.8ch; margin:20px 0 24px; font:750 4rem/.98 var(--display); letter-spacing:-.022em; font-variation-settings:"SOFT" 35,"WONK" 0; text-wrap:balance; }
.hero-intro { max-width:36ch; margin:0; color:var(--ash); font-size:1.05rem; line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin-top:30px; }
.hero-actions span { max-width:21ch; color:var(--ash); font:.7rem/1.6 var(--mono); letter-spacing:.06em; text-transform:uppercase; }

.section-frame { width:min(1240px,calc(100% - 64px)); margin:auto; }
h2 { margin:0; font:750 4.65rem/1 var(--display); letter-spacing:-.022em; font-variation-settings:"SOFT" 35,"WONK" 0; text-wrap:balance; }
h3,p { margin:0; }
.section-heading { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(260px,.55fr); gap:clamp(35px,8vw,120px); align-items:end; }
.section-heading p { color:var(--ash); line-height:1.75; }

.trust-strip { border-block:1px solid var(--line); background:var(--carbon); }
.trust-inner { width:min(1240px,calc(100% - 64px)); min-height:86px; margin:auto; display:grid; grid-template-columns:repeat(4,auto); gap:28px; align-items:center; justify-content:space-between; }
.trust-inner strong,.trust-inner span { font:600 .68rem var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.trust-inner span { color:var(--ash); }

.value-section,.services,.gallery-section,.faq-section { padding:clamp(95px,12vw,170px) 0; background:var(--carbon-soft); }
.value-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:70px; background:var(--line); }
.value-grid article { min-height:255px; padding:34px; background:var(--carbon-soft); transition:background .25s ease,transform .25s ease; }
.value-grid article:hover { background:#222829; transform:translateY(-4px); }
.value-grid span { color:var(--signal); font:600 .68rem var(--mono); letter-spacing:.12em; }
.value-grid h3 { margin-top:70px; font:750 2rem/1.05 var(--display); letter-spacing:-.015em; }
.value-grid p { max-width:24ch; margin-top:16px; color:var(--ash); line-height:1.65; }

.problem-section { padding:clamp(95px,13vw,190px) 0; background:var(--bone); color:var(--ink); }
.problem-layout { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(280px,.72fr); gap:clamp(44px,8vw,120px); align-items:end; }
.problem-layout p { color:#525655; font-size:1.04rem; line-height:1.8; }

.services { background:var(--carbon); }
.service-list { margin-top:70px; border-top:1px solid var(--line); }
.service-row { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(188px,auto); gap:28px; align-items:center; padding:30px 0; border-bottom:1px solid var(--line); }
.service-row h3 { font:750 2.35rem/1.05 var(--display); letter-spacing:-.015em; }
.service-row p { margin-top:10px; color:var(--ash); line-height:1.55; }
.service-row strong { color:var(--bone); font:600 .75rem var(--mono); }
.service-row button { min-height:42px; color:var(--ash); }

.steps-section { padding:clamp(95px,12vw,160px) 0; background:var(--signal); }
.steps-layout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(320px,1.1fr); gap:clamp(50px,10vw,140px); align-items:center; }
.text-link { display:inline-flex; margin-top:34px; color:#f5d9dc; font:600 .7rem var(--mono); letter-spacing:.08em; text-transform:uppercase; text-decoration:underline; }
.steps-list { margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.28); }
.steps-list li { display:flex; gap:24px; padding:28px 0; border-bottom:1px solid rgba(255,255,255,.28); color:#f7dfe2; font:750 2.05rem/1.08 var(--display); letter-spacing:-.015em; }
.steps-list span { min-width:38px; color:#f0bbc2; font:600 .7rem var(--mono); letter-spacing:.1em; }

.gallery-grid { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(300px,.72fr); grid-template-rows:repeat(2,324px); gap:18px; margin-top:70px; }
.gallery-grid figure { position:relative; min-height:0; margin:0; overflow:hidden; background:var(--carbon); }
.gallery-grid figure:has(img[src*="barber-team"]) { display:none; }
.gallery-grid img { width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(1.06); transition:transform .7s cubic-bezier(.2,.8,.2,1); }
.gallery-grid figure:hover img { transform:scale(1.045); }
.gallery-grid figcaption { position:absolute; left:18px; bottom:16px; color:var(--bone); font:600 .62rem var(--mono); letter-spacing:.1em; text-transform:uppercase; text-shadow:0 2px 18px rgba(0,0,0,.65); }
.gallery-large { grid-row:1 / span 3; }

.reviews-section { padding:clamp(100px,13vw,180px) 0; background:var(--bone); color:var(--ink); }
.reviews-layout { display:grid; grid-template-columns:minmax(0,.85fr) minmax(320px,1.15fr); gap:clamp(50px,10vw,130px); }
.rating-line { margin-top:28px; color:var(--signal); font:600 .68rem var(--mono); letter-spacing:.07em; text-transform:uppercase; }
.review-stack { display:grid; gap:22px; }
blockquote { margin:0; padding:30px 0; border-top:1px solid var(--dark-line); }
blockquote:last-child { border-bottom:1px solid var(--dark-line); }
blockquote p { font:750 2rem/1.18 var(--display); letter-spacing:-.015em; }
cite { display:block; margin-top:22px; color:#626665; font:600 .68rem var(--mono); font-style:normal; letter-spacing:.08em; text-transform:uppercase; }

.team-section { display:grid; grid-template-columns:1.08fr .92fr; min-height:760px; background:var(--carbon); }
.team-photo { min-height:640px; overflow:hidden; }
.team-photo img { width:100%; height:100%; object-fit:cover; filter:saturate(.75) contrast(1.05); }
.team-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(56px,8vw,135px); }
.team-copy p { max-width:34ch; margin-top:30px; color:var(--ash); line-height:1.75; }
.bio-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:72px; }
.bio-grid article { border-top:1px solid var(--line); padding-top:22px; }
.bio-grid h3 { font:750 1.5rem/1.08 var(--display); letter-spacing:-.012em; }
.bio-grid p { margin-top:12px; font-size:.88rem; }

.faq-section { background:var(--carbon-soft); }
.faq-layout { display:grid; grid-template-columns:minmax(0,.82fr) minmax(320px,1.18fr); gap:clamp(50px,10vw,120px); align-items:start; }
.faq-list { border-top:1px solid var(--line); }
details { border-bottom:1px solid var(--line); }
summary { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:18px; color:var(--bone); font:750 1.48rem/1.16 var(--display); letter-spacing:-.012em; cursor:pointer; list-style:none; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; color:var(--signal); font:600 1rem var(--mono); }
details[open] summary::after { content:"-"; }
details p { max-width:64ch; padding:0 0 26px; color:var(--ash); line-height:1.7; }

.final-cta { display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(50px,10vw,150px); padding:clamp(100px,13vw,180px) max(32px,calc((100vw - 1240px)/2)); background:var(--bone); color:var(--ink); }
.booking-copy p { max-width:32ch; margin-top:28px; color:#525655; line-height:1.75; }
.booking-copy span { display:block; margin-top:34px; color:var(--signal); font:600 .68rem/1.7 var(--mono); letter-spacing:.07em; text-transform:uppercase; }
.booking-form { display:grid; gap:10px; padding-top:8px; }
.booking-form label { margin-top:13px; color:#5b5e5d; font:600 .62rem var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.booking-form select,.booking-form input { width:100%; min-height:54px; border:0; border-bottom:1px solid rgba(18,21,21,.45); border-radius:0; padding:0 2px; color:var(--ink); background:transparent; outline:none; font:500 1rem var(--sans); }
.booking-form select:focus,.booking-form input:focus { border-color:var(--signal); }
.booking-form input::placeholder { color:#929592; }
.form-message { display:none; margin:9px 0 0; color:var(--signal-dark); font-size:.78rem; }
.form-message.is-visible { display:block; }
.form-submit { width:100%; margin-top:28px; border-color:var(--ink); color:var(--bone); background:var(--ink); }
.form-submit:hover { color:var(--bone); background:var(--signal); border-color:var(--signal); transform:translateY(-2px); }

footer { border-top:1px solid var(--line); background:var(--carbon-deep); }
.footer-inner { width:min(1240px,calc(100% - 64px)); min-height:190px; margin:auto; display:grid; grid-template-columns:1fr minmax(240px,360px) minmax(220px,320px); gap:45px; align-items:center; }
.footer-inner p { color:var(--ash); font:.7rem/1.75 var(--mono); letter-spacing:.04em; text-transform:uppercase; }

.reveal { opacity:1; transform:none; filter:none; transition:transform .75s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { transform:none; }
@keyframes hero-breathe { 0%,100% { transform:scale(1.02); } 50% { transform:scale(1.06); } }

@media (max-width:980px) {
  h2 { font-size:3.7rem; }
  .section-heading,.problem-layout,.steps-layout,.reviews-layout,.faq-layout,.final-cta { grid-template-columns:1fr; }
  .value-grid { grid-template-columns:1fr; }
  .team-section { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:1fr 1fr; grid-template-rows:360px 260px; }
  .gallery-large { grid-row:auto; grid-column:1 / -1; }
  .footer-inner { grid-template-columns:1fr; gap:24px; padding:44px 0; }
}

@media (max-width:800px) {
  .nav-shell,.section-frame,.trust-inner,.footer-inner { width:min(100% - 40px,620px); }
  .nav-shell { min-height:70px; }
  nav { display:none; }
  .nav-book { min-height:38px; padding:0 12px; font-size:.55rem; }
  .hero { min-height:auto; display:flex; flex-direction:column; }
  .hero-art { order:1; width:100%; min-height:390px; }
  .hero-art img { object-position:61% center; }
  .hero-copy { order:0; padding:48px 20px 58px; }
  .hero h1 { max-width:9.6ch; font-size:2.85rem; line-height:1.02; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .primary-button { width:100%; }
  .trust-inner { grid-template-columns:1fr; gap:13px; padding:24px 0; }
  .value-section,.services,.gallery-section,.faq-section,.reviews-section,.steps-section,.problem-section { padding:82px 0; }
  h2 { font-size:2.65rem; line-height:1.05; }
  .section-heading { gap:25px; }
  .value-grid { margin-top:46px; }
  .value-grid article { min-height:210px; padding:26px; }
  .value-grid h3 { margin-top:46px; }
  .service-list { margin-top:48px; }
  .service-row { grid-template-columns:1fr; gap:16px; padding:28px 0; }
  .service-row h3 { font-size:1.9rem; line-height:1.08; }
  .service-row button { width:100%; }
  .steps-list li { font-size:1.55rem; line-height:1.15; }
  .gallery-grid { grid-template-columns:1fr; grid-template-rows:none; margin-top:46px; }
  .gallery-grid figure { min-height:0; aspect-ratio:4 / 3; }
  .gallery-grid .gallery-large { aspect-ratio:3 / 4; }
  blockquote p { font-size:1.45rem; line-height:1.25; }
  .team-photo { min-height:430px; }
  .team-copy { padding:72px 20px; }
  .bio-grid { grid-template-columns:1fr; margin-top:48px; }
  summary { min-height:68px; font-size:1.22rem; line-height:1.22; }
  .final-cta { padding:82px 20px; gap:48px; }
}

@media (max-width:390px) {
  .wordmark { font-size:1.34rem; }
  .nav-book { max-width:150px; text-align:center; }
  .hero h1,h2 { font-size:2.42rem; }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
  .reveal { opacity:1; transform:none; filter:none; }
}