:root {
  --black:#080808; --charcoal:#101010; --cream:#f6f1e8; --gold:#c99349; --gold-light:#e0b66f;
  --ink:#161616; --muted:#66605a; --shell:1180px;
}
* { box-sizing:border-box; }
body { margin:0; font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:var(--black); color:#fff; line-height:1.6; }
a { color:inherit; } img { max-width:100%; display:block; }
.skip-link { position:absolute; left:-999px; top:0; z-index:1000; background:#fff; color:#000; padding:.8rem 1rem; }
.skip-link:focus { left:1rem; top:1rem; }
.site-header { background:rgba(6,6,6,.96); border-bottom:1px solid rgba(255,255,255,.14); position:sticky; top:0; z-index:100; }
.header-inner { width:min(calc(100% - 2rem), var(--shell)); margin:0 auto; min-height:92px; display:flex; justify-content:space-between; align-items:center; gap:2rem; }
.logo-lockup { display:inline-flex; align-items:center; gap:.95rem; text-decoration:none; }
.logo-image { width:auto; height:84px; border-radius:12px; }
.logo-text { display:flex; flex-direction:column; line-height:1.05; }
.logo-title { font-weight:900; letter-spacing:-.02em; color:#fff; }
.logo-place { color:rgba(255,255,255,.7); font-size:.9rem; }
.nav { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.nav a { color:rgba(255,255,255,.86); text-decoration:none; font-weight:800; font-size:.9rem; padding:.7rem .78rem; border-radius:999px; }
.nav a:hover,.nav a.active { color:#fff; background:rgba(201,147,73,.16); }
.nav a.active { box-shadow:inset 0 -2px 0 var(--gold); }
.barber-hero { position:relative; min-height:650px; display:grid; align-items:center; overflow:hidden; background:linear-gradient(90deg, rgba(0,0,0,.97) 0%, rgba(0,0,0,.78) 40%, rgba(0,0,0,.24) 76%), url("assets/barber-hero.png") center right / cover no-repeat; border-bottom:1px solid rgba(201,147,73,.45); }
.hero-content { width:min(calc(100% - 2rem), var(--shell)); margin:0 auto; padding:5rem 0; }
.gold-kicker { display:inline-flex; align-items:center; gap:.8rem; margin:0 0 1rem; color:var(--gold); text-transform:uppercase; letter-spacing:.26em; font-weight:900; font-size:.86rem; }
.gold-kicker span { display:block; width:42px; height:2px; background:var(--gold); }
.barber-hero h1 { margin:0; max-width:780px; font-family:Georgia, "Times New Roman", serif; font-weight:500; font-size:clamp(3.8rem, 8vw, 7.4rem); line-height:.86; letter-spacing:-.06em; }
.barber-hero h1 strong { display:block; color:var(--gold); text-transform:uppercase; letter-spacing:.02em; font-weight:800; }
.barber-strap { margin:1.55rem 0 .95rem; text-transform:uppercase; letter-spacing:.34em; font-weight:900; font-size:1rem; }
.barber-strap::after { content:""; display:inline-block; width:42px; height:2px; margin-left:.8rem; background:var(--gold); vertical-align:middle; }
.hero-copy { max-width:460px; margin:0 0 1.6rem; color:rgba(255,255,255,.9); font-size:1.16rem; }
.gold-button,.outline-button,.dark-outline-button { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-weight:900; border-radius:4px; padding:.95rem 1.3rem; transition:transform .18s ease, filter .18s ease; }
.gold-button { background:linear-gradient(135deg, var(--gold), var(--gold-light)); color:#fff; box-shadow:0 12px 30px rgba(0,0,0,.22); }
.gold-button:hover,.outline-button:hover,.dark-outline-button:hover { transform:translateY(-1px); filter:brightness(1.04); }
.trust-strip { width:min(calc(100% - 2rem), var(--shell)); margin:0 auto; display:grid; grid-template-columns:repeat(4, 1fr); padding:2.6rem 0; }
.trust-item { text-align:center; padding:0 2rem; border-right:1px solid rgba(255,255,255,.12); }
.trust-item:last-child { border-right:0; }
.trust-icon { font-size:2.2rem; color:var(--gold); margin-bottom:.7rem; }
.trust-item h2 { margin:0 0 .55rem; text-transform:uppercase; letter-spacing:.08em; font-size:.95rem; }
.trust-item p { margin:0; color:rgba(255,255,255,.72); }
.cream-section { background:var(--cream); color:var(--ink); }
.services-about { display:grid; grid-template-columns:minmax(280px,1fr) minmax(280px,.78fr) minmax(280px,1fr); gap:3rem; padding:3rem max(1rem, calc((100vw - var(--shell)) / 2)); align-items:start; }
.section-column h2,.work-intro h2,.info-block h2 { margin:0; text-transform:uppercase; letter-spacing:.08em; font-size:1.45rem; }
.underline { width:78px; height:2px; background:var(--gold); margin:.85rem 0 1.35rem; }
.price-list,.hours-list { margin:0; }
.price-list div { display:grid; grid-template-columns:auto 1fr auto; align-items:baseline; gap:.6rem; margin:0 0 .95rem; font-weight:800; }
.price-list div::after { content:""; border-bottom:1px dotted rgba(0,0,0,.7); grid-column:2; }
.price-list dt { grid-column:1; } .price-list dd { grid-column:3; margin:0; }
.outline-button { margin-top:1.2rem; color:var(--ink); border:1px solid var(--gold); background:transparent; }
.about-card p { color:#3f3b35; margin:0 0 1rem; }
.about-image-card { border:1px solid rgba(0,0,0,.08); overflow:hidden; box-shadow:0 22px 50px rgba(0,0,0,.14); }
.about-image-card img { width:100%; aspect-ratio:1.18/1; object-fit:cover; }
.work-section { background:#0a0a0a; display:grid; grid-template-columns:.78fr 1.82fr; gap:2.8rem; padding:3.2rem max(1rem, calc((100vw - var(--shell)) / 2)); border-top:1px solid rgba(201,147,73,.35); border-bottom:1px solid rgba(201,147,73,.25); }
.work-intro p { color:rgba(255,255,255,.78); max-width:260px; }
.dark-outline-button { margin-top:1rem; color:#fff; border:1px solid var(--gold); background:transparent; }
.gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.95rem; }
.gallery-grid img { width:100%; aspect-ratio:1/1.1; object-fit:cover; border:2px solid rgba(201,147,73,.48); }
.practical-info { display:grid; grid-template-columns:repeat(3,1fr); padding:3.2rem max(1rem, calc((100vw - var(--shell)) / 2)); gap:2.2rem; }
.info-block { padding:0 2rem; border-right:1px solid rgba(0,0,0,.13); }
.info-block:last-child { border-right:0; }
.info-block h2 { display:flex; align-items:center; gap:.75rem; font-size:1.05rem; }
.info-block h2 span { color:var(--gold); font-size:1.55rem; }
.hours-list div { display:grid; grid-template-columns:95px 1fr; gap:.8rem; margin-bottom:.38rem; }
.hours-list dt { font-weight:800; } .hours-list dd { margin:0; color:#393530; }
.check-list { list-style:none; padding:0; margin:0; display:grid; gap:.8rem; }
.check-list li { position:relative; padding-left:1.8rem; }
.check-list li::before { content:"✓"; position:absolute; left:0; color:var(--gold); font-weight:900; }
.fiction-note { font-size:.9rem; color:var(--muted); font-style:italic; }
.barber-cta { position:relative; min-height:310px; display:grid; place-items:center; text-align:center; overflow:hidden; background:linear-gradient(rgba(0,0,0,.76), rgba(0,0,0,.83)), radial-gradient(circle at 20% 10%, rgba(201,147,73,.32), transparent 28%), #080808; border-top:1px solid rgba(201,147,73,.3); }
.cta-content { width:min(calc(100% - 2rem), 900px); padding:3.5rem 0; }
.barber-cta h2 { margin:0 0 .9rem; text-transform:uppercase; letter-spacing:.13em; font-size:clamp(1.7rem,4vw,3.1rem); line-height:1.05; }
.barber-cta p { color:rgba(255,255,255,.82); margin:0 0 1.4rem; }
.example-warning { margin-top:1.2rem!important; color:rgba(255,255,255,.7)!important; }
.site-footer { background:#090909; border-top:1px solid rgba(255,255,255,.1); }
.footer-inner { width:min(calc(100% - 2rem), var(--shell)); margin:0 auto; display:grid; grid-template-columns:1.25fr .7fr .85fr; gap:3rem; padding:2.6rem 0; }
.footer-logo { width:110px; border-radius:999px; margin-bottom:.9rem; }
.footer-brand-block p { color:rgba(255,255,255,.68); max-width:390px; }
.footer-tagline { color:#fff!important; }
.site-footer h3 { text-transform:uppercase; letter-spacing:.08em; font-size:.95rem; }
.footer-links { margin:0; padding:0; list-style:none; }
.footer-links a,.site-footer a { color:rgba(255,255,255,.82); }
.footer-links li { margin-bottom:.42rem; }
.footer-bottom { width:min(calc(100% - 2rem), var(--shell)); margin:0 auto; padding:1.25rem 0; border-top:1px solid rgba(255,255,255,.08); display:flex; justify-content:space-between; gap:1rem; color:rgba(255,255,255,.58); font-size:.9rem; }
@media (max-width:1080px) {
  .header-inner { align-items:flex-start; flex-direction:column; padding:1rem 0; }
  .services-about,.work-section,.practical-info,.footer-inner { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:repeat(2,1fr); }
  .info-block { border-right:0; padding:0; }
  .trust-strip { grid-template-columns:repeat(2,1fr); }
  .trust-item:nth-child(2) { border-right:0; }
}
@media (max-width:680px) {
  .logo-image { height:70px; }
  .logo-text { display:none; }
  .nav { gap:.1rem; }
  .nav a { font-size:.82rem; padding:.55rem .62rem; }
  .barber-hero { min-height:560px; background:linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.82) 70%), url("assets/barber-hero.png") center / cover no-repeat; }
  .barber-strap { letter-spacing:.18em; }
  .trust-strip { grid-template-columns:1fr; }
  .trust-item { border-right:0; border-bottom:1px solid rgba(255,255,255,.12); padding:1.35rem 1rem; }
  .trust-item:last-child { border-bottom:0; }
  .services-about,.work-section,.practical-info { padding-top:2.4rem; padding-bottom:2.4rem; }
  .gallery-grid { grid-template-columns:1fr; }
  .hours-list div { grid-template-columns:1fr; gap:.05rem; }
  .footer-bottom { flex-direction:column; }
}