/* style.css - style premium, responsive */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap');

:root{
  --bg:#0f1115;
  --card:#0e1620;
  --muted:#9aa4b2;
  --accent:#d4a941; /* gold */
  --white:#ffffff;
  --glass: rgba(255,255,255,0.04);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,'Segoe UI',Roboto, 'Helvetica Neue', Arial;
  background: linear-gradient(180deg,#05060a 0%, #0f1115 100%);
  color:var(--white);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.6;
}

/* CONTAINER */
.container{max-width:1150px;margin:0 auto;padding:0 20px}

/* NAV */
header.site-header{position:sticky;top:0;z-index:60;background:linear-gradient(180deg, rgba(15,17,21,0.85), rgba(15,17,21,0.6));backdrop-filter:blur(6px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--accent);font-size:1.1rem}
.brand img{height:44px;width:44px;border-radius:8px;object-fit:cover}
.nav{display:flex;gap:18px;align-items:center}
.nav a{color:var(--white);text-decoration:none;font-weight:600;opacity:.95;padding:8px 10px;border-radius:8px;transition:all .18s}
.nav a:hover{background:var(--glass);color:var(--accent);transform:translateY(-2px)}
.cta{background:var(--accent);color:#071018;padding:9px 14px;border-radius:10px;font-weight:700;text-decoration:none;box-shadow:0 6px 18px rgba(212,169,65,0.12)}

/* Mobile nav */
.burger{display:none;cursor:pointer;background:none;border:0;color:var(--white);font-size:1.4rem}
.mobile-menu{display:none;flex-direction:column;gap:12px;padding:15px 20px;background:linear-gradient(180deg, rgba(12,14,18,0.95), rgba(12,14,18,0.95))}

/* HERO */
.hero{padding:90px 0 70px;display:grid;grid-template-columns:1fr 420px;gap:40px;align-items:center}
.hero-left h1{font-size:2.6rem;margin:0 0 12px;color:var(--white);letter-spacing:-0.5px}
.hero-left p.lead{color:var(--muted);max-width:750px;font-size:1.05rem;margin-bottom:18px}
.hero-cta{display:flex;gap:12px;align-items:center}
.hero-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:22px;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,0.5);}

/* SERVICES PREVIEW */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:28px}
.card{background:linear-gradient(180deg,#0b0f14, #0e1220);padding:18px;border-radius:12px;border:1px solid rgba(255,255,255,0.03);transition:transform .28s,box-shadow .28s}
.card:hover{transform:translateY(-8px);box-shadow:0 18px 40px rgba(2,6,23,0.65)}
.card .icon{height:56px;width:56px;border-radius:12px;background:rgba(255,255,255,0.03);display:flex;align-items:center;justify-content:center;margin-bottom:12px;font-size:22px;color:var(--accent)}
.card h4{margin:0 0 8px}
.card p{color:var(--muted);font-size:0.95rem}

/* TESTIMONIALS */
.testimonials{margin-top:36px;display:grid;grid-template-columns:1fr 340px;gap:24px;align-items:start}
.testimonials .list{display:flex;flex-direction:column;gap:14px}
.testimonial{background:linear-gradient(180deg,#08101a,#07101a);padding:16px;border-radius:12px;border:1px solid rgba(255,255,255,0.02)}
.testimonial p{color:var(--muted);font-size:0.95rem;margin-bottom:8px}
.pull{background:linear-gradient(180deg,#081018,#071018);padding:18px;border-radius:12px;border:1px solid rgba(255,255,255,0.03);text-align:center}

/* LONG CONTENT */
.content{background:rgba(255,255,255,0.02);padding:28px;border-radius:12px;margin-top:26px}
.content h3{color:var(--accent)}

/* FOOTER */
.site-footer{margin-top:50px;padding:32px 0;color:var(--muted);text-align:center;border-top:1px solid rgba(255,255,255,0.03)}

/* WHATSAPP FLOAT */
.whatsapp{position:fixed;right:18px;bottom:18px;background:linear-gradient(180deg,#25d366,#1aa557);width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 28px rgba(0,0,0,0.45);z-index:120}
.whatsapp i{font-size:22px;color:#fff}

/* POPUP */
.modal{display:none;position:fixed;inset:0;align-items:center;justify-content:center;background:rgba(2,6,23,0.65);z-index:200}
.modal .box{width:92%;max-width:480px;background:linear-gradient(180deg,#071018,#0d1318);padding:20px;border-radius:14px;border:1px solid rgba(255,255,255,0.04);box-shadow:0 20px 60px rgba(2,6,23,0.7)}
.modal .box h4{margin:0 0 8px;color:var(--accent)}
.modal .box p{color:var(--muted);margin-bottom:12px}
.modal .actions{display:flex;gap:10px;justify-content:flex-end}
.modal .btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(--white);padding:8px 12px;border-radius:8px}
.modal .btn-primary{background:var(--accent);color:#071018;padding:9px 14px;border-radius:10px;font-weight:700;border:0}

/* FORM STYLES */
.form-card{background:linear-gradient(180deg,#071018,#0d1418);padding:18px;border-radius:12px;border:1px solid rgba(255,255,255,0.03)}
.form-card label{display:block;font-size:0.9rem;margin-bottom:6px;color:var(--muted)}
.input,textarea{width:100%;padding:12px;border-radius:8px;border:1px solid rgba(255,255,255,0.04);background:transparent;color:var(--white);resize:vertical}
textarea{min-height:140px}

/* UTIL */
.kicker{display:inline-block;background:rgba(255,255,255,0.03);padding:6px 10px;border-radius:999px;color:var(--muted);font-size:.85rem;margin-bottom:10px}

/* RESPONSIVE */
@media (max-width:1000px){
  .hero{grid-template-columns:1fr; padding:70px 0 40px}
  .testimonials{grid-template-columns:1fr;gap:16px}
  .header-inner{padding:12px 0}
}
@media (max-width:680px){
  .nav{display:none}
  .burger{display:block}
  .mobile-menu{display:flex}
  .cards{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
  .hero-left h1{font-size:1.6rem}
  .hero{padding:48px 0}
}