
:root{
  --blue:#0b3c8c;
  --azure:#1e90ff;
  --light:#f7fbff;
  --text:#10335e;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,#eaf4ff 0%, #f9fbff 100%);
}
.container{max-width:1150px;margin:0 auto;padding:20px}
.header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 0;
}
.header .brand{display:flex; align-items:center; gap:14px}
.header img{height:60px}
.header h1{font-size:1.6rem; margin:0; color:var(--blue)}
.nav a{
  text-decoration:none; margin:0 8px; color:var(--blue); font-weight:600;
}
.hero{
  background: radial-gradient(1000px 200px at 20% 0%, rgba(30,144,255,.15), transparent),
              linear-gradient(180deg, #ffffff, #edf5ff);
  border:1px solid #d7e6ff; border-radius:24px; padding:32px; 
  box-shadow:0 8px 28px rgba(16,51,94,.08);
}
.hero h2{font-size:2rem; margin:0 0 8px 0; color:var(--blue)}
.hero p{margin:0 0 16px 0}
.cta-row{display:flex; gap:12px; flex-wrap:wrap}
.button{
  border:none; padding:12px 16px; border-radius:14px; font-weight:700; cursor:pointer;
  background:var(--blue); color:white; text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  box-shadow:0 6px 14px rgba(11,60,140,.25);
}
.button.alt{background:var(--azure)}
.section{margin:40px 0}
.section h3{margin:0 0 16px 0; color:var(--blue); font-size:1.6rem}
.grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:16px}
.card{
  background:white; border:1px solid #dce9ff; border-radius:18px; padding:18px;
  box-shadow:0 4px 16px rgba(16,51,94,.06); transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-3px); box-shadow:0 10px 22px rgba(16,51,94,.12)}
.card h4{margin:10px 0 0 0}
.badge{display:inline-block; background:#e6f2ff; color:var(--blue); padding:6px 10px; border-radius:999px; font-weight:700; font-size:.85rem}
.services-list{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2, 1fr); gap:10px}
.services-list li{display:flex; align-items:center; gap:8px; padding:10px; border:1px dashed #cfe0ff; border-radius:12px; background:#fbfdff}
.form{
  background:white; border:1px solid #d7e6ff; border-radius:18px; padding:18px;
  box-shadow:0 6px 18px rgba(16,51,94,.08);
}
.form label{font-weight:600}
.form input, .form select, .form textarea{
  width:100%; padding:12px; border:1px solid #cfe0ff; border-radius:12px; margin-top:6px;
}
.form .row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.form .actions{display:flex; gap:10px; align-items:center}
.footer{
  margin-top:48px; padding:24px 0; text-align:center; color:#3a5a92;
  border-top:1px solid #d7e6ff;
}
.social a{margin:0 6px; text-decoration:none; font-weight:700; color:var(--blue)}
@media(max-width:840px){
  .grid{grid-template-columns:1fr 1fr}
  .form .row{grid-template-columns:1fr}
  .services-list{grid-template-columns:1fr}
  .header h1{font-size:1.2rem}
}
