:root{
  --nav-height:64px;
  --nav-bg:#0b2940;
  --accent:#b8893b;
  --text:#f5f7f9;
  --muted:#9aa8b3;
  --container:1100px;
}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; color:#021627; background:#ffffff; line-height:1.45}
.header{background:var(--nav-bg); color:var(--text); padding:18px 20px; display:flex; align-items:center; gap:16px}
.header img{height:56px}
.header .brand{font-weight:700; letter-spacing:1px}
.nav{background:#052036; padding:10px 20px; display:flex; justify-content:center; flex-wrap:wrap}
.nav a{color:var(--text); text-decoration:none; margin:4px 12px; font-weight:600}
.hero{background:linear-gradient(180deg, #04283a 0%, #062e45 100%); color:var(--text); padding:60px 20px; text-align:center}
.hero h1{font-size:48px; margin:0 0 6px}
.hero p{margin:0 0 18px; color:#dbe9f1}
.cta{display:inline-block; background:var(--accent); color:#021627; padding:12px 20px; border-radius:6px; font-weight:700; text-decoration:none}
.container{max-width:var(--container); margin:36px auto; padding:0 20px}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px}
.card{border-radius:8px; border:1px solid #e6eef4; padding:18px; background:#ffffff; box-shadow:0 6px 18px rgba(3,12,18,0.04)}
.services-list li{margin:8px 0}
.pricing{display:flex; gap:12px; flex-wrap:wrap}
.price{flex:1; min-width:200px; border-radius:8px; padding:18px; background:linear-gradient(180deg,#f8f9fb,#ffffff); text-align:center; border:1px solid #e1e8ee}
.footer{background:#021018; color:#cfe7f0; padding:28px 20px; text-align:center; margin-top:36px}
.contact-card{background:#052036; color:var(--text); padding:18px; border-radius:8px}
.gallery img{width:100%; border-radius:6px; display:block}
form label{font-size:14px; font-weight:600; color:#052036}
form input, form select, form textarea{width:100%; padding:9px 10px; margin:6px 0 14px; border-radius:5px; border:1px solid #c9d5e2; font-size:14px}
form button[type="submit"]{border:none; cursor:pointer}
small.help{color:var(--muted); font-size:12px}

/* Responsive */
@media (max-width:600px){
  .hero h1{font-size:34px}
  .header img{height:48px}
}