:root{
  --color-deep-blue: #042a63;
  --color-royal-blue: #1f56b8;
  --color-lavender: #8b7bdc;
  --color-white: #ffffff;
  --color-gray-100: #f5f7fb;
  --color-gray-300: #dfe7f5;
  --max-width: 1200px;
  --transition-fast: 200ms cubic-bezier(.4,.0,.2,1);
  --shadow-soft: 0 8px 18px rgba(4, 42, 99, .08);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color-scheme: light;
}

/* Reset & base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--color-gray-100);
  color:#0f1b33;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  scroll-behavior:smooth;
  line-height:1.45;
}

/* container */
.container{
  max-width:var(--max-width);
  margin:0 auto;
  padding:1.5rem;
}

/* accessibility */
.skip-link{
  position:fixed;
  left:-999px;
  top:auto;
  width:1px;height:1px;overflow:hidden;
}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#000;color:#fff;padding:.5rem 1rem;border-radius:4px}

/* header */
.site-header{
  position:sticky;
  top:0;
  z-index:1200;
  background:linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.9));
  border-bottom:1px solid var(--color-gray-300);
  backdrop-filter: blur(6px);
}
.header-inner{
  display:flex;
  align-items:center;
  gap:1rem;
  justify-content:space-between;
}
.brand .logo{height:46px;display:block}
.main-nav{flex:1;margin-left:1rem}
.nav-list{display:flex;gap:1rem;list-style:none;margin:0;padding:0;align-items:center}
.nav-list a{color:var(--color-deep-blue);text-decoration:none;font-weight:600;padding:.5rem .75rem;border-radius:6px;transition:var(--transition-fast)}
.nav-list a:hover{background:rgba(31,86,184,0.06)}
.nav-list a.active{background:linear-gradient(90deg,var(--color-royal-blue),var(--color-lavender));color:#fff}

/* mobile toggle */
.mobile-toggle{display:none;background:transparent;border:0;padding:.25rem}
.burger{width:22px;height:2px;background:var(--color-deep-blue);display:block;position:relative}
.burger:after,.burger:before{content:"";position:absolute;left:0;width:22px;height:2px;background:var(--color-deep-blue)}
.burger:before{top:-6px}
.burger:after{top:6px}

/* header CTA */
.header-cta .btn{white-space:nowrap}

/* buttons */
.btn{display:inline-block;padding:.6rem 1rem;border-radius:6px;font-weight:700;cursor:pointer;text-decoration:none;transition:var(--transition-fast)}
.btn-primary{background:linear-gradient(90deg,var(--color-royal-blue),var(--color-lavender));color:var(--color-white);box-shadow:var(--shadow-soft)}
.btn-outline{border:2px solid rgba(31,86,184,.12);background:transparent;color:var(--color-deep-blue)}
.btn-light{background:rgba(255,255,255,0.12);color:var(--color-white);border:1px solid rgba(255,255,255,0.08)}

/* hero */
.hero, .hero-subpage{
  position:relative;
  background-size:cover;
  background-position:center center;
  color:var(--color-white);
  min-height:60vh;
  display:flex;
  align-items:center;
}
.hero .overlay, .hero-subpage .overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(4,42,99,0.6), rgba(16,25,49,0.6))}
.hero-inner{position:relative;z-index:2;padding:4rem 1rem}
.hero-title{font-size:clamp(2rem,4vw,3rem);margin:0 0 .5rem}
.hero-sub{font-size:1.05rem;margin:0 0 1rem}

/* sections */
.section{padding:3rem 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.split-media img, .split-media iframe{width:100%;border-radius:8px;display:block}
.split-content h2{margin-top:0}
.lead{color:#20304a}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-top:1rem}
.card{background:var(--color-white);padding:1rem;border-radius:10px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;gap:.75rem}
.card img{width:100%;height:140px;object-fit:cover;border-radius:6px}
.card h3{margin:.2rem 0}
.card p{flex:1}
.card .link{color:var(--color-royal-blue);font-weight:700;text-decoration:none}

/* grids */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.feature{background:var(--color-white);padding:1rem;border-radius:8px;box-shadow:var(--shadow-soft)}

/* connectivity */
.connectivity{position:relative;background-size:cover;background-position:center; color:#fff;padding:4rem 0}
.overlay-soft{background:linear-gradient(180deg, rgba(4,42,99,0.6), rgba(31,86,184,0.45));}

/* stats */
.stats-inner{display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between;background:linear-gradient(180deg,#fff,#f7f9ff);padding:1rem;border-radius:8px}
.stat{flex:1;min-width:160px;text-align:center;padding:1rem}
.stat-number{font-size:1.8rem;color:var(--color-royal-blue);display:block}

/* process */
.process{list-style:none;padding:0;margin:1rem 0;display:flex;flex-direction:column;gap:.5rem}
.process li{background:var(--color-white);padding:.8rem;border-radius:8px;box-shadow:var(--shadow-soft);display:flex;gap:.5rem;align-items:center}

/* CTA strong */
.cta-strong{background:linear-gradient(90deg,var(--color-royal-blue),var(--color-lavender));color:#fff;padding:2.25rem;border-radius:8px;margin:2rem 0}
.cta-inner{text-align:center}

/* footer */
.site-footer{background:#071534;color:#fff;padding:2rem 0;margin-top:2rem}
.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.25rem}
.footer-logo{height:42px}
.footer-links ul{list-style:none;padding:0;margin:0}
.footer-links a{color:rgba(255,255,255,0.9);text-decoration:none}

/* forms */
.contact-form{background:var(--color-white);padding:1rem;border-radius:8px;box-shadow:var(--shadow-soft)}
.form-row{margin-bottom:.75rem}
.form-row label{display:block;font-weight:700;margin-bottom:.25rem}
.form-row input, .form-row textarea, .form-row select{width:100%;padding:.6rem;border:1px solid var(--color-gray-300);border-radius:6px}
.form-alert{margin-top:1rem;padding:.75rem;border-radius:6px}

/* responsive images */
img{max-width:100%;height:auto}

/* subtle animations */
.fade-in{opacity:0;transform:translateY(10px);transition:opacity 450ms ease, transform 450ms ease}
.fade-in.visible{opacity:1;transform:none}
a,button{transition:transform var(--transition-fast), box-shadow var(--transition-fast)}
a:hover,button:hover{transform:translateY(-3px)}

/* small screens */
@media (max-width:900px){
  .split{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .nav-list{display:none}
  .mobile-toggle{display:block}
  .header-inner{gap:.5rem}
  .footer-grid{grid-template-columns:1fr}
  .hero{min-height:50vh}
}