:root{
  --bg:#15120f;
  --bg-deep:#090909;
  --panel:#191614;
  --panel-2:#211a15;
  --line:rgba(255,255,255,.10);
  --line-gold:rgba(207,159,101,.38);
  --text:#f6f0e7;
  --muted:#b9afa4;
  --gold:#d0a36f;
  --gold-deep:#a97946;
  --light:#efe8de;
  --light-card:#f8f2e9;
  --dark:#181411;
  --shadow:0 28px 70px rgba(0,0,0,.34);
  --radius:24px;
  --max:1240px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:16px}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(var(--max),calc(100% - 44px));margin:0 auto}
.section{padding:92px 0}
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,7,7,.96);border-bottom:1px solid rgba(255,255,255,.07);backdrop-filter:blur(14px)}
.header-row{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.brand-mark{width:17px;height:17px;border:2px solid var(--gold);border-radius:50%;position:relative}
.brand-mark:before,.brand-mark:after{content:"";position:absolute;background:var(--gold)}
.brand-mark:before{width:2px;height:11px;left:50%;top:1px;transform:translateX(-50%)}
.brand-mark:after{height:2px;width:11px;left:1px;top:50%;transform:translateY(-50%)}
.brand strong{display:block;font-family:Oswald,Arial,sans-serif;font-size:1.68rem;line-height:1;letter-spacing:.075em}
.brand small{display:block;margin-top:5px;color:#95897d;font-size:.62rem;letter-spacing:.29em}
.site-nav{display:flex;align-items:center;justify-content:center;gap:24px;font-size:.87rem}
.site-nav a{color:#ddd6ce;transition:color .2s ease}
.site-nav a:hover,.site-nav a:focus-visible{color:var(--gold)}
.button{min-height:50px;padding:0 23px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;border:1px solid transparent;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.button:hover{transform:translateY(-2px)}
.button-primary{background:linear-gradient(135deg,#d9ad79,#e8c69d);color:#17110b;box-shadow:0 14px 32px rgba(208,163,111,.16)}
.button-secondary{border-color:var(--line-gold);background:rgba(0,0,0,.08);color:var(--text)}
.header-cta{min-width:135px}
.menu-toggle{display:none;width:48px;height:48px;border-radius:14px;border:1px solid var(--line);background:transparent}
.menu-toggle span{display:block;width:22px;height:2px;background:#eee;margin:5px auto}

/* HERO */
.hero{padding:62px 0 88px;background:radial-gradient(circle at 76% 16%,rgba(141,98,58,.08),transparent 28%),var(--bg)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(430px,.87fr);gap:62px;align-items:start}
.hero-copy{padding-top:22px}
.eyebrow{margin:0 0 19px;color:var(--gold);font-size:.72rem;font-weight:800;letter-spacing:.23em;text-transform:uppercase}
h1,h2,h3{margin:0}
h1,h2{font-family:Oswald,Arial,sans-serif;text-transform:uppercase;letter-spacing:.005em}
.hero h1{font-size:clamp(4.2rem,6.15vw,6.65rem);font-weight:700;line-height:.91;max-width:650px;color:#faf5ed}
.hero h1 span{display:block;color:transparent;-webkit-text-stroke:1.2px #bd8c55;text-stroke:1.2px #bd8c55;font-weight:500}
.hero-text{max-width:620px;margin:19px 0 0;color:#bdb2a7;line-height:1.72;font-size:.95rem}
.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:29px}
.hero-points{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:24px 0 0}
.hero-points li{padding:9px 13px;border:1px solid rgba(208,163,111,.20);border-radius:999px;color:#b7aa9e;font-size:.76rem}
.hero-visual{display:grid;gap:14px}
.hero-visual-main{height:486px;position:relative;border-radius:29px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:
  linear-gradient(180deg,rgba(0,0,0,.02) 35%,rgba(0,0,0,.50) 100%),
  url("assets/hero-barber-photo.svg") center 45%/cover no-repeat;
  box-shadow:var(--shadow)
}
.hero-badge{position:absolute;left:20px;top:22px;z-index:2;padding:10px 14px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(6,6,6,.58);font-size:.76rem;color:#f2ece5;backdrop-filter:blur(7px)}
.visual-label{position:absolute;right:20px;top:22px;z-index:2;font-family:Oswald,Arial,sans-serif;font-size:1.35rem;font-weight:700}
.hero-stat{position:absolute;left:20px;bottom:20px;z-index:2;width:245px;padding:25px 22px;border-radius:22px;background:rgba(5,6,6,.82);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(8px)}
.hero-stat strong{display:block;color:var(--gold);font-family:Oswald,Arial,sans-serif;font-size:2.2rem;line-height:1}
.hero-stat span{display:block;margin-top:12px;color:#c3b8ac;font-size:.9rem;line-height:1.5}
.hero-visual-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mini-card{min-height:160px;padding:25px 24px;border-radius:22px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(145deg,#181613,#121110);box-shadow:0 18px 45px rgba(0,0,0,.14)}
.mini-card.accent-card{border-color:rgba(208,163,111,.32);background:linear-gradient(145deg,#2a2119,#1a1612)}
.mini-card h3{font-family:Oswald,Arial,sans-serif;font-size:1.3rem;text-transform:uppercase;line-height:1.25}
.mini-card p{margin:13px 0 0;color:#c6bbb0;font-size:.86rem;line-height:1.5}

/* SHARED */
h2{font-size:clamp(2.3rem,3.6vw,3.7rem);line-height:.98}
h3{font-family:Oswald,Arial,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.section-copy{max-width:510px}
.section-copy p{color:var(--muted);line-height:1.75}
.about-section{background:#0e0e0d;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05)}
.about-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:42px;align-items:stretch}
.about-photo{min-height:430px;border-radius:24px;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.2)),url("assets/interior.webp") center/cover no-repeat;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.07)}
.about-content{display:flex;flex-direction:column;justify-content:center}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px}
.feature-card,.team-card,.review-card,.offer-card,.timeline-card,.faq-card,.contact-panel,.pricing-table{border:1px solid var(--line);border-radius:20px;background:linear-gradient(160deg,#171614,#10100f);box-shadow:0 18px 48px rgba(0,0,0,.16)}
.feature-card{padding:22px 20px}
.feature-card h3{font-size:1.05rem}
.feature-card p{margin:11px 0 0;color:#a99e93;font-size:.82rem;line-height:1.55}

/* SERVICES HOME */
.section-light{background:var(--light);color:var(--dark)}
.services-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:50px;align-items:center}
.section-light .section-copy p{color:#6e6258}
.eyebrow-dark{color:var(--gold-deep)}
.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.price-card{min-height:145px;padding:22px;border-radius:20px;background:var(--light-card);border:1px solid rgba(24,20,17,.08);box-shadow:0 14px 36px rgba(44,31,18,.07);display:flex;justify-content:space-between;gap:18px}
.price-card h3{font-size:1.13rem}
.price-card p{margin:10px 0 0;color:#6e6258;font-size:.82rem;line-height:1.55}
.price-card strong{color:var(--gold-deep);white-space:nowrap}

/* TEAM */
.team-layout{display:grid;grid-template-columns:.74fr 1.26fr;gap:44px}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.team-card{padding:0 0 19px;overflow:hidden}
.team-photo{height:235px;background-image:url("assets/team-sprite.webp");background-size:400% 100%;background-repeat:no-repeat;background-position-y:center}
.photo-one{background-position-x:0}
.photo-two{background-position-x:33.333%}
.photo-three{background-position-x:66.666%}
.photo-four{background-position-x:100%}
.team-card h3,.team-card>p{margin-left:17px;margin-right:17px}
.team-card h3{margin-top:17px;font-size:1.18rem}
.team-role{color:var(--gold)!important;font-size:.68rem!important;font-weight:800;text-transform:uppercase;letter-spacing:.12em;margin-top:6px!important;margin-bottom:7px!important}
.team-card p{color:#a99f96;font-size:.78rem;line-height:1.55}

/* GALLERY */
.gallery-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:44px;align-items:start}
.gallery-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;grid-auto-rows:195px;gap:12px}
.gallery-card{position:relative;overflow:hidden;border-radius:18px;border:1px solid rgba(255,255,255,.07);padding:18px;display:flex;align-items:flex-end;font-family:Oswald,Arial,sans-serif;text-transform:uppercase;font-size:1.05rem;background-position:center;background-size:cover;box-shadow:0 18px 46px rgba(0,0,0,.22)}
.gallery-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.72))}
.gallery-card{color:#fff}
.gallery-card>*{position:relative;z-index:1}
.gallery-card:nth-child(1){background-image:linear-gradient(180deg,transparent,rgba(0,0,0,.48)),url("assets/hero-barber.webp")}
.gallery-card:nth-child(2){background-image:linear-gradient(180deg,transparent,rgba(0,0,0,.48)),url("assets/tools.webp")}
.gallery-card:nth-child(3){background-image:linear-gradient(180deg,transparent,rgba(0,0,0,.48)),url("assets/interior.webp")}
.gallery-card:nth-child(4){background-image:linear-gradient(180deg,transparent,rgba(0,0,0,.48)),url("assets/team-sprite.webp")}
.gallery-card:nth-child(5){background-image:linear-gradient(180deg,transparent,rgba(0,0,0,.48)),url("assets/hero-barber.webp")}
.gallery-card.tall{grid-row:span 2}
.gallery-card.wide{grid-column:span 2}

/* REVIEWS */
.section-reviews{background:#0d0d0c}
.reviews-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:44px}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.review-card{padding:24px}
.review-card p{color:#c0b4a9;line-height:1.65;font-size:.87rem}
.review-card strong{font-size:.82rem}
.stars{color:var(--gold);letter-spacing:.11em}

/* CONTACT + FOOTER */
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-panel{padding:30px}
.dark-panel{background:linear-gradient(150deg,#111,#1a1511);color:var(--text)}
.light-panel{background:var(--light-card);color:var(--dark);border-color:rgba(24,20,17,.08);box-shadow:0 14px 36px rgba(44,31,18,.07)}
.contact-panel p{line-height:1.7}
.contact-list{display:grid;gap:16px;margin-top:24px}
.contact-list span{display:block;color:#94887d;font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.hours-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:11px}
.hours-list li{display:flex;justify-content:space-between;gap:18px;padding-bottom:10px;border-bottom:1px solid rgba(24,20,17,.08)}
.hours-list span{color:#6e6258}
.map-placeholder{margin-top:24px;min-height:175px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(135deg,#e4d5c2,#f3ede5);border:1px dashed rgba(24,20,17,.18);color:#76695d;font-weight:700}
.site-footer{background:#080808;border-top:1px solid rgba(255,255,255,.07);padding:38px 0 22px}
.footer-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:36px}
.footer-grid>div>p{color:#857a70;font-size:.85rem;line-height:1.6}
.footer-links{display:grid;gap:10px;color:#9c9187;font-size:.85rem}
.footer-bottom{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;gap:18px;color:#776e67;font-size:.78rem}

/* SERVICES PAGE */
.page-hero{padding:70px 0 76px;background:linear-gradient(90deg,rgba(0,0,0,.68),rgba(0,0,0,.20)),url("assets/tools.webp") 77% center/42% auto no-repeat,#0d0d0c}
.page-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:42px;align-items:center}
.page-hero h1{font-family:Oswald,Arial,sans-serif;text-transform:uppercase;font-size:clamp(3rem,5.6vw,5.8rem);line-height:.96;max-width:760px}
.page-hero-panel{padding:28px;border-radius:22px;background:rgba(8,8,8,.80);border:1px solid var(--line);backdrop-filter:blur(5px)}
.info-chip{display:inline-flex;padding:8px 13px;border:1px solid var(--line-gold);border-radius:999px;color:var(--gold);font-size:.78rem}
.page-hero-list{color:#b7aca2;line-height:1.7}
.section-copy-narrow{max-width:680px;margin-bottom:28px}
.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.offer-card{padding:28px}
.featured-offer{border-color:rgba(208,163,111,.42);background:linear-gradient(145deg,#251d16,#151311)}
.offer-tag{display:inline-flex;padding:7px 10px;border-radius:999px;background:rgba(208,163,111,.12);color:var(--gold);font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;margin-bottom:13px}
.offer-card p,.offer-card li{color:#aba096;line-height:1.6;font-size:.86rem}
.offer-card strong{display:block;color:var(--gold);font-family:Oswald,Arial,sans-serif;font-size:1.9rem;margin:14px 0}
.pricing-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.pricing-table{padding:25px;background:var(--light-card);color:var(--dark);border-color:rgba(24,20,17,.08);box-shadow:0 14px 36px rgba(44,31,18,.07)}
.pricing-table h3{margin-bottom:20px}
.pricing-row{display:flex;justify-content:space-between;gap:15px;padding:11px 0;border-bottom:1px solid rgba(24,20,17,.08);font-size:.86rem}
.pricing-row strong{color:var(--gold-deep)}
.timeline-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.timeline-card{padding:24px}
.timeline-card>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--gold);color:#17110b;font-family:Oswald,Arial,sans-serif;font-weight:700;margin-bottom:15px}
.timeline-card p,.faq-card p{color:#aaa096;line-height:1.6;font-size:.84rem}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.faq-card{padding:23px}
.cta-banner{display:flex;align-items:center;justify-content:space-between;gap:25px;background:var(--light-card);border:1px solid rgba(24,20,17,.08);border-radius:22px;padding:30px}
.cta-banner p{color:#6d6258}
.cta-actions{display:flex;gap:12px}
.dark-outline{color:var(--dark);border-color:rgba(24,20,17,.20)}

/* MOBILE */
@media(max-width:1100px){
  .site-nav{gap:14px;font-size:.8rem}
  .header-cta{display:none}
  .hero-grid{grid-template-columns:1fr 430px;gap:34px}
  .hero h1{font-size:clamp(3.7rem,6.4vw,5.6rem)}
  .about-layout,.services-layout,.team-layout,.gallery-layout,.reviews-layout,.page-hero-grid{grid-template-columns:1fr}
  .team-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .section{padding:70px 0}
  .menu-toggle{display:block}
  .site-nav{display:none;position:absolute;top:82px;left:18px;right:18px;flex-direction:column;align-items:flex-start;padding:20px;border:1px solid var(--line);border-radius:18px;background:#0b0b0b;box-shadow:var(--shadow)}
  .site-nav.is-open{display:flex}
  .hero{padding-top:44px}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding-top:0}
  .hero h1{max-width:620px}
  .hero-visual-main{height:520px}
  .feature-grid,.price-grid,.reviews-grid,.offer-grid,.pricing-columns,.timeline-grid,.faq-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:1fr 1fr}
  .gallery-card.tall,.gallery-card.wide{grid-row:auto;grid-column:auto}
  .contact-layout,.footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column}
  .page-hero{background-size:cover;background-position:center}
}
@media(max-width:560px){
  .container{width:min(var(--max),calc(100% - 28px))}
  .header-row{min-height:74px}
  .brand strong{font-size:1.4rem}
  .site-nav{top:74px;left:14px;right:14px}
  .hero h1{font-size:clamp(3.05rem,15vw,4.4rem)}
  .hero-visual-main{height:430px}
  .hero-stat{width:210px;padding:20px}
  .hero-visual-stack,.team-grid,.gallery-grid{grid-template-columns:1fr}
  .about-photo{min-height:330px}
  .hero-actions,.cta-actions{flex-direction:column}
  .button{width:100%}
  .cta-banner{flex-direction:column;align-items:stretch}
}
