:root{
  --bg:#0f0f10;
  --panel:#141416;
  --muted:#bdb9b2;
  --gold:#f4b400;
  --accent:#ffdf66;
  --white:#ffffff;
  --container:1100px;
  --radius:12px;
  --shadow: 0 6px 20px rgba(0,0,0,0.5);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background:var(--bg);
  color:var(--muted);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}

/* Header */
.site-header{background:linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.2));position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(255,255,255,0.03)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.logo img{height:56px;border-radius:6px}
.nav{display:flex}
.nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0;align-items:center}
.nav a{color:var(--muted);text-decoration:none;padding:8px 12px;border-radius:8px;font-weight:600}
.nav a:hover, .nav a.active{color:#000;background:var(--gold)}

/* nav toggle for mobile */
.nav-toggle{display:none;background:none;border:0;color:var(--white);font-size:22px;padding:6px;cursor:pointer}

/* Hero */
.hero{
  background-image: linear-gradient(rgba(1,1,1,0.45), rgba(1,1,1,0.45)), url('../images/hero.jpg');
  background-color:#0b0b0b;
  background-size:cover;background-position:center;
  padding:90px 0 70px;
  color:var(--white);
}
.hero-inner{text-align:center;padding:20px}
.hero h1{font-size:2.6rem;margin:0 0 12px;color:var(--gold)}
.hero p{max-width:820px;margin:0 auto 20px;color:rgba(255,255,255,0.85)}
.hero-ctas .btn{margin:8px}

/* Buttons */
.btn{display:inline-block;padding:12px 20px;border-radius:28px;text-decoration:none;font-weight:700}
.btn-primary{background:var(--gold);color:#000}
.btn-outline{border:2px solid rgba(255,255,255,0.06);color:var(--white);background:transparent;padding:10px 18px}

/* Highlights & cards */
.highlights{display:flex;gap:18px;justify-content:space-between;margin-top:-40px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:20px;border-radius:12px;flex:1;box-shadow:var(--shadow);text-align:center}
.card h3{color:var(--white);margin-bottom:8px}
.card p{color:var(--muted)}

/* Services preview */
.services-preview{margin-top:40px}
.service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:18px}
.service-box{background:var(--panel);padding:20px;border-radius:12px;box-shadow:var(--shadow);color:var(--muted)}
.service-box h4{color:var(--gold);margin-bottom:8px}

/* Page container */
.page{padding:50px 20px}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:20px}
.gallery-grid img{width:100%;height:200px;object-fit:cover;border-radius:10px;cursor:pointer;transition:transform .25s}
.gallery-grid img:hover{transform:scale(1.04)}

/* Lightbox */
.lightbox{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.9);z-index:999}
.lightbox.active{display:flex}
.lightbox img{max-width:92%;max-height:86%;border-radius:10px;box-shadow:0 10px 40px rgba(0,0,0,0.7)}

/* Service list and posts */
.service-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.service-card{background:var(--panel);padding:18px;border-radius:12px;color:var(--muted)}
.post{background:var(--panel);padding:18px;border-radius:12px;margin-bottom:14px}

/* Contact */
.contact-page .contact-form{max-width:700px;margin-bottom:20px}
input[type=text], input[type=email], textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:var(--white);margin-bottom:12px}
.contact-info p{color:var(--muted)}

/* Footer */
.site-footer{border-top:1px solid rgba(255,255,255,0.03);padding:22px 0;margin-top:40px;color:var(--muted)}
.foot-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}
.brand{font-weight:700;color:var(--white)}

/* WhatsApp float */
.whatsapp-float{position:fixed;right:18px;bottom:18px;background:#25D366;color:#fff;padding:12px 14px;border-radius:50%;font-size:20px;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,0.5)}

/* Responsive */
@media(max-width:900px){
  .highlights{flex-direction:column}
  .header-inner{gap:12px}
}
@media(max-width:760px){
  .nav{display:none}
  .nav.show{display:block}
  .nav ul{flex-direction:column;background:transparent;padding:12px 0}
  .nav a{display:block;padding:10px 12px}
  .nav-toggle{display:block}
  .hero{padding:70px 0}
  .gallery-grid img{height:180px}
  .foot-inner{flex-direction:column;gap:8px;text-align:center}
}