:root{
  --black:#101112;
  --charcoal:#181a1c;
  --cream:#f5f1e9;
  --gold:#c79a4c;
  --gold2:#e0b86e;
  --text:#34383c;
  --muted:#70767b;
  --white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);line-height:1.6;background:#fff}
a{text-decoration:none;color:inherit}
.container{width:min(1120px,calc(100% - 36px));margin:auto}
.header{position:sticky;top:0;z-index:20;background:rgba(16,17,18,.96);border-bottom:1px solid #2d2f31}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px;color:#fff}
.brand-icon{display:grid;place-items:center;width:43px;height:43px;border:2px solid var(--gold);border-radius:50%;font-weight:900;color:var(--gold)}
.brand strong{display:block;line-height:1;font-size:18px;letter-spacing:1px}
.brand small{display:block;color:var(--gold);letter-spacing:3px;font-size:8px;margin-top:5px}
nav{display:flex;align-items:center;gap:26px}
nav a{font-size:12px;font-weight:700;color:#ddd}
.nav-book{background:var(--gold);color:#111!important;padding:10px 16px;border-radius:5px}
.hero{padding:88px 0;background:linear-gradient(120deg,#111213,#1b1e21);color:#fff}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.eyebrow,.gold-label,.section-title span,.booking>div>div>span{font-size:11px;font-weight:800;letter-spacing:2px;color:var(--gold)}
.hero h1{font-size:62px;line-height:1.02;letter-spacing:-2px;margin:18px 0}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero-copy p{max-width:590px;color:#b9bec2;font-size:17px}
.hero-buttons{display:flex;gap:12px;margin:28px 0}
.btn{display:inline-block;padding:14px 22px;border-radius:5px;font-size:13px;font-weight:800;border:0;cursor:pointer}
.primary{background:var(--gold);color:#111}
.secondary{border:1px solid #555b60;color:#fff}
.dark{background:#17191b;color:#fff}
.highlights{display:flex;flex-wrap:wrap;gap:22px;color:#aab0b4;font-size:11px;margin-top:30px}
.hero-art{min-height:430px;border:1px solid #4e4331;border-radius:14px;background:linear-gradient(145deg,#292c2f,#121314);position:relative;overflow:hidden;padding:48px;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.barber-lines{position:absolute;right:-70px;top:-80px;width:280px;height:560px;background:repeating-linear-gradient(135deg,transparent 0 32px,rgba(199,154,76,.13) 32px 55px)}
.hero-badge{position:absolute;top:35px;right:35px;width:88px;height:88px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;text-align:center;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:1px}
.scissors{font-size:45px;color:var(--gold);position:relative}
.hero-art h2{font-size:47px;line-height:1;margin:12px 0;position:relative}
.hero-art p{color:#b9bec2;position:relative}
.section{padding:90px 0}
.section-title{text-align:center;margin-bottom:42px}
.section-title h2,.about-copy h2,.booking h2,.location h2{font-size:40px;line-height:1.15;margin:7px 0;color:#191b1d}
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}
.services article{border:1px solid #e3ddd4;padding:28px;border-radius:9px}
.service-icon{font-size:28px;color:var(--gold)}
.services h3{font-size:17px;color:#1b1d1f}
.services p{font-size:13px;color:var(--muted)}
.about{padding:90px 0;background:var(--cream)}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}
.about-card{min-height:390px;background:linear-gradient(145deg,#1a1c1e,#2d302f);border-radius:12px;padding:45px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff}
.about-card span{color:var(--gold);font-size:11px;letter-spacing:2px}
.about-card h2{font-size:42px;line-height:1.08;margin:10px 0}
.about-copy p{color:#697076}
.ticks{display:grid;gap:12px;margin-top:25px}
.ticks div{display:flex;align-items:center;gap:12px}
.ticks b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#eee0c4;color:#8a642a}
.ticks span{font-size:13px;font-weight:700}
.booking{padding:85px 0;background:#151719;color:#fff}
.booking-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.booking h2{color:#fff;font-size:43px}
.booking p{color:#b7bcc0}
.booking-form{background:#24272a;padding:28px;border:1px solid #3d4144;border-radius:10px}
.booking-form label{display:block;color:#ddd;font-size:11px;font-weight:700;margin-bottom:12px}
.booking-form input,.booking-form select{width:100%;margin-top:6px;padding:13px;border:1px solid #454a4e;background:#181a1c;color:#fff;border-radius:5px}
.full{width:100%;text-align:center;margin-top:7px}
.success{margin-top:12px;background:#28382f;color:#bfe4cc;padding:10px;text-align:center;border-radius:5px;font-size:12px}
.location{padding:90px 0}
.location-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}
.location p{color:#687076}
.small-copy{font-size:13px;max-width:430px}
.map-card{min-height:300px;background:#ece7de;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #ded5c8}
.pin{width:55px;height:55px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:grid;place-items:center;background:var(--gold);color:#111;font-size:18px;margin-bottom:30px}
.pin::first-letter{transform:rotate(45deg)}
.map-card strong{font-size:20px;color:#1b1d1f}
.map-card span{font-size:12px;color:#777;margin-top:5px}
.map-card small{letter-spacing:3px;color:#9a793f;margin-top:10px}
footer{background:#0d0f10;color:#999;padding:22px 0}
.footer{display:flex;justify-content:space-between;font-size:11px}
.footer a{color:var(--gold);font-weight:700}
@media(max-width:800px){
  nav a:not(.nav-book){display:none}
  .hero-grid,.about-grid,.booking-grid,.location-grid{grid-template-columns:1fr;gap:38px}
  .services{grid-template-columns:1fr 1fr}
  .hero h1{font-size:46px}
}
@media(max-width:520px){
  .hero{padding:60px 0}
  .hero h1{font-size:39px}
  .hero-buttons{flex-direction:column;text-align:center}
  .services{grid-template-columns:1fr}
  .section-title h2,.about-copy h2,.booking h2,.location h2{font-size:32px}
  .hero-art h2{font-size:38px}
  .footer{flex-direction:column;text-align:center;gap:6px}
}

.whatsapp{background:#25D366!important;color:#fff!important;margin-top:10px}
.whatsapp-float{position:fixed;right:20px;bottom:20px;z-index:50;background:#25D366;color:#fff;padding:13px 18px;border-radius:50px;font-weight:800;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.whatsapp-float:hover{transform:translateY(-2px)}

.hero-photo{height:480px;border-radius:14px;overflow:hidden;position:relative;border:1px solid #4e4331;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.82))}
.photo-label{position:absolute;z-index:2;left:28px;right:28px;bottom:25px;display:flex;justify-content:space-between;align-items:end;color:#fff}
.photo-label strong{font-size:18px;letter-spacing:1px}
.photo-label span{font-size:11px;color:#e1c486}
.gallery-section{padding:90px 0;background:#101112}
.gallery-section .section-title h2{color:#fff}
.gallery-grid{display:grid;grid-template-columns:1.3fr .7fr;grid-template-rows:240px 240px;gap:14px}
.gallery-grid figure{margin:0;position:relative;overflow:hidden;border-radius:9px;background:#222}
.gallery-grid .gallery-large{grid-row:1/3}
.gallery-grid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.gallery-grid figure:hover img{transform:scale(1.035)}
.gallery-grid figure:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.78))}
.gallery-grid figcaption{position:absolute;z-index:2;left:20px;bottom:16px;color:#fff;font-weight:800;font-size:14px;letter-spacing:.4px}
@media(max-width:800px){
 .hero-photo{height:420px}
 .gallery-grid{grid-template-columns:1fr;grid-template-rows:360px 260px 260px}
 .gallery-grid .gallery-large{grid-row:auto}
 .photo-label{flex-direction:column;align-items:flex-start;gap:4px}
}

.special-hours{margin:22px 0;padding:18px 20px;border-left:3px solid var(--gold);background:rgba(199,154,76,.08);border-radius:0 7px 7px 0}
.special-hours strong{display:block;color:var(--gold2);font-size:15px;margin-bottom:5px}
.special-hours p{margin:0!important;font-size:13px;color:#c5c9cc!important}
