
:root{
  --blue:#062f66;
  --blue2:#0b5ed7;
  --sky:#eef6ff;
  --gold:#ffcc00;
  --dark:#061b36;
  --text:#102033;
}
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}
html{scroll-behavior:smooth}
body{background:var(--sky);color:var(--text);line-height:1.6}
a{text-decoration:none}
.nav{
  position:fixed;top:0;left:0;width:100%;
  background:rgba(6,47,102,.97);color:white;
  display:flex;justify-content:space-between;align-items:center;
  padding:15px 7%;z-index:999;
  box-shadow:0 8px 28px rgba(0,0,0,.25)
}
.logo{font-size:22px;font-weight:900;letter-spacing:.2px}
.menu{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.menu a{color:white;font-weight:800;font-size:15px}
.menu a:hover{color:var(--gold)}
.nav-call{background:var(--gold);color:#111!important;padding:10px 16px;border-radius:50px}
.hero{
  min-height:96vh;
  background:linear-gradient(rgba(2,28,64,.78),rgba(2,28,64,.82)),
  url("https://images.unsplash.com/photo-1607472586893-edb57bdc0e39?auto=format&fit=crop&w=1800&q=85");
  background-size:cover;background-position:center;
  display:flex;align-items:center;padding:130px 7% 70px;color:white
}
.hero-inner{max-width:820px}
.badge{display:inline-block;background:var(--gold);color:#111;padding:10px 18px;border-radius:50px;font-weight:900;margin-bottom:18px}
h1{font-size:60px;line-height:1.05;margin-bottom:20px}
.hero p{font-size:22px;color:#e7f1ff;max-width:720px;margin-bottom:30px}
.btn{
  display:inline-block;background:var(--gold);color:#111;
  padding:16px 28px;border-radius:13px;font-size:18px;font-weight:900;margin:7px;
  box-shadow:0 8px 20px rgba(0,0,0,.18)
}
.btn-light{background:white;color:var(--blue)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;max-width:1120px;margin:-62px auto 35px;padding:0 20px;position:relative}
.stat{background:white;border-radius:22px;padding:28px;text-align:center;box-shadow:0 16px 38px rgba(0,0,0,.14)}
.stat strong{display:block;font-size:32px;color:var(--blue2)}
section{max-width:1150px;margin:auto;padding:85px 20px}
h2{text-align:center;font-size:38px;color:var(--blue);margin-bottom:12px}
.sub{text-align:center;color:#50647c;font-size:18px;margin:0 auto 45px;max-width:760px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:25px}
.card{
  background:white;border-radius:24px;padding:32px;
  box-shadow:0 14px 32px rgba(10,70,140,.12);
  border:1px solid #d9e9ff;transition:.25s
}
.card:hover{transform:translateY(-7px);box-shadow:0 20px 45px rgba(10,70,140,.18)}
.icon{font-size:44px;margin-bottom:16px}
.card h3{font-size:23px;color:var(--blue2);margin-bottom:10px}
.card p{color:#4b6078}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.panel{background:white;border-radius:26px;padding:42px;box-shadow:0 15px 38px rgba(0,0,0,.1)}
.panel ul{list-style:none;margin-top:18px}
.panel li{margin:12px 0;font-size:18px}
.panel li:before{content:"✓ ";color:var(--blue2);font-weight:900}
.service-hero{min-height:58vh;background:linear-gradient(135deg,var(--blue),var(--blue2));color:white;padding:145px 7% 70px;text-align:center}
.service-hero h1{font-size:52px}
.service-hero p{font-size:21px;max-width:760px;margin:0 auto 25px;color:#eaf3ff}
.contact-box{
  background:linear-gradient(135deg,var(--blue),var(--blue2));
  color:white;text-align:center;border-radius:30px;padding:65px 25px
}
.contact-box h2{color:white}
.float{
  position:fixed;right:20px;bottom:20px;background:var(--gold);color:#111;
  padding:16px 24px;border-radius:50px;font-weight:900;box-shadow:0 10px 30px rgba(0,0,0,.35);z-index:999
}
footer{background:var(--dark);color:white;text-align:center;padding:28px}
@media(max-width:850px){
  .nav{flex-direction:column;gap:12px;padding:13px}
  .menu{justify-content:center;gap:10px}
  .menu a{font-size:13px}
  .hero{text-align:center;padding-top:185px}
  h1,.service-hero h1{font-size:38px}
  .hero p{font-size:18px}
  .split{grid-template-columns:1fr}
}
