* { margin:0; padding:0; box-sizing:border-box; font-family: 'Segoe UI', Arial, sans-serif; }
body { color:#1a1a2e; scroll-behavior:smooth; }

.navbar {
  display:flex; justify-content:space-between; align-items:center;
  padding:20px 8%; background:#0f172a; color:white; position:sticky; top:0; z-index:10;
}
.navbar .logo { font-size:1.5rem; font-weight:bold; color:#38bdf8; }
.navbar nav a { color:white; text-decoration:none; margin-left:25px; font-weight:500; }
.navbar nav a:hover { color:#38bdf8; }

.hero {
  text-align:center; padding:100px 8% 80px; background:linear-gradient(135deg,#0f172a,#1e3a8a); color:white;
}
.hero h1 { font-size:2.3rem; max-width:800px; margin:0 auto 20px; }
.hero p { max-width:650px; margin:0 auto 30px; opacity:0.9; }
.btn {
  background:#38bdf8; color:#0f172a; padding:14px 30px; border-radius:30px;
  text-decoration:none; font-weight:bold; display:inline-block;
}
.btn:hover { background:#0ea5e9; }

.why, .services, .enquiry { padding:70px 8%; }
.why { background:#f8fafc; }
h2 { text-align:center; margin-bottom:40px; font-size:2rem; color:#0f172a; }

.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:20px; }
.card {
  background:white; padding:25px; border-radius:12px; box-shadow:0 2px 10px rgba(0,0,0,0.06);
}
.card h3 { margin-bottom:10px; color:#1e3a8a; }

.enquiry { background:#0f172a; color:white; text-align:center; }
.enquiry form { max-width:450px; margin:0 auto; display:flex; flex-direction:column; gap:15px; }
.enquiry input {
  padding:14px; border-radius:8px; border:none; font-size:1rem;
}
.enquiry button {
  padding:14px; border:none; border-radius:8px; background:#38bdf8; color:#0f172a;
  font-weight:bold; font-size:1rem; cursor:pointer;
}
.enquiry button:hover { background:#0ea5e9; }
#formMessage { margin-top:15px; font-weight:500; }

footer { text-align:center; padding:25px; background:#0f172a; color:#94a3b8; }