
@import url('https://fonts.cdnfonts.com/css/old-london');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --bg:#0e0e10;
  --panel:#141416;
  --panel-2:#1a1b1e;
  --gold:#d4af37;
  --gold-2:#f0d275;
  --muted:#cfcfcf;
  --soft:#9a9a9a;
}

html, body{ background:var(--bg); color:var(--muted); font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }

/* Navbar */
.navbar{ background: rgba(10,10,10,.75); border-bottom:1px solid rgba(212,175,55,.25); backdrop-filter: blur(8px) saturate(130%); }
.navbar-brand{ font-weight:800; color:var(--gold) !important; letter-spacing:.3px; display:flex; align-items:center; gap:.6rem; }
.navbar-brand .brand-gothic{ font-family:'OldLondon', cursive; font-size:1.4rem; line-height:1; }
.nav-link{ color:#ddd !important; font-weight:600; }
.nav-link:hover{ color:var(--gold) !important; }
.nav-cta{ border:1px solid var(--gold); color:var(--gold); border-radius:10px; padding:.4rem .8rem; font-weight:700; }
.nav-cta:hover{ background:var(--gold); color:#111; }

/* Hero */
.hero{
  min-height:88vh;
  background:
    linear-gradient( to right, rgba(0,0,0,.75), rgba(0,0,0,.25) ),
    url('assets/cortez-cut-3.jpg') center/cover no-repeat;
  display:flex; align-items:center;
}
.hero .eyebrow{ color:var(--gold); font-weight:800; letter-spacing:.7px; display:flex; align-items:center; gap:.5rem; }
.hero h1{ font-family:'Playfair Display', serif; font-weight:800; color:var(--gold-2); font-size: clamp(40px, 6vw, 72px); line-height:1.05; }
.hero p{ color:#d8d8d8; max-width: 56ch; }
.hero .btn{ padding:.85rem 1.1rem; border-radius:12px; }
.btn-gold{ background:var(--gold); color:#121212; border:none; font-weight:800; }
.btn-gold:hover{ filter:brightness(1.07); }
.btn-outline-gold{ border:1px solid var(--gold); color:var(--gold); font-weight:800; }
.btn-outline-gold:hover{ background:var(--gold); color:#111; }
.hero .stats{ color:#cfcfcf; }
.hero .scroll-indicator{ width:26px; height:38px; border:2px solid var(--gold); border-radius:18px; position:relative; margin-top:2rem; }
.hero .scroll-indicator::after{ content:""; position:absolute; width:4px; height:8px; left:50%; top:7px; transform:translateX(-50%); background:var(--gold); border-radius:2px; animation:wheel 1.6s infinite; }
@keyframes wheel{ 0%{ opacity:1; transform:translate(-50%,0);} 100%{ opacity:0; transform:translate(-50%,14px);} }

/* Sections */
.section{ padding: 7rem 0; }
.section.alt{ background:var(--panel); }
.section h2{ font-family:'Playfair Display', serif; color:var(--gold); font-weight:800; margin-bottom:1rem; }
.lead-muted{ color:#d8d8d8; }

/* Service cards grid (Lovable-like) */
.card-service{
  background: var(--panel-2);
  border:1px solid rgba(212,175,55,.22);
  border-radius:14px;
  padding: 1.25rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  transition: transform .25s ease, box-shadow .25s ease;
  height:100%;
}
.card-service:hover{ transform: translateY(-6px); box-shadow:0 18px 50px rgba(212,175,55,.14); }
.card-service .icon{
  width:64px; height:64px; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, rgba(212,175,55,.22), rgba(212,175,55,.05));
  display:grid; place-items:center; font-size:1.5rem; color:var(--gold);
  margin-bottom:.75rem;
}
.card-service h5{ color:#fff; font-weight:800; }
.card-service p{ color:#dcdcdc; }
.card-service .price{ color:var(--gold); font-weight:900; font-size:1.35rem; }
.card-service .time{ color:#bdbdbd; }

/* Gallery */
.gallery img{ border-radius:14px; border:1px solid rgba(212,175,55,.16); box-shadow:0 12px 28px rgba(0,0,0,.35); }

/* About */
.about-img{ border-radius:22px; border:1px solid rgba(212,175,55,.22); box-shadow:0 18px 50px rgba(0,0,0,.35); }
.about h3{ color:var(--gold-2); font-weight:800; font-family:'Playfair Display', serif; }

/* Metrics & Team */
.metric{ background: var(--panel-2); border:1px solid rgba(212,175,55,.22); border-radius:14px; padding:1.4rem; text-align:center; }
.metric .value{ font-size:1.8rem; color:var(--gold); font-weight:900; }
.team-card{ background: var(--panel-2); border:1px solid rgba(212,175,55,.22); border-radius:14px; padding:1.4rem; text-align:center; }

/* Footer */
footer{ background:#0b0b0c; border-top:1px solid rgba(212,175,55,.22); }
footer h6{ color:var(--gold); font-weight:800; }
footer a{ color:#dcdcdc; text-decoration:none; }
footer a:hover{ color:var(--gold); }
.footer-brand{ font-family:'OldLondon', cursive; color:var(--gold); font-size:1.4rem; }

.bottom-bar{ border-top:1px solid rgba(212,175,55,.12); padding:.8rem 0; color:#bdbdbd; font-size:.92rem; }

/* Reveal on scroll */
.reveal{ opacity:0; transform: translateY(16px); transition: opacity .8s ease, transform .8s ease; }
.reveal.show{ opacity:1; transform: none; }
