:root{
  --blue:#0b63a7;
  --teal:#12a6b9;
  --muted:#6b7280;
  --bg:#f8fafc;
  --card:#ffffff;
}

*{box-sizing:border-box}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial; margin:0; color:#111827; background:var(--bg); line-height:1.6;}
.container{max-width:1100px;margin:0 auto;padding:0 20px;}
.header-inner{display:flex;align-items:center;justify-content:space-between; gap:20px;}
.site-header{background:linear-gradient(180deg, rgba(255,255,255,0.9), rgba(248,250,252,0.9));backdrop-filter: blur(6px); position:sticky;top:0;z-index:50;padding:12px 0; box-shadow:0 2px 8px rgba(15,23,42,0.06);}
.brand{display:flex;align-items:center;gap:12px;}
.logo{width:64px;height:64px;object-fit:contain;border-radius:8px;background:white;padding:6px;box-shadow:0 4px 14px rgba(12,74,110,0.06);}
.brand h1{font-size:18px;margin:0;color:var(--blue);letter-spacing:0.4px;}
.tag{margin:0;font-size:12px;color:var(--muted);}

.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:18px;}
.nav a{color:var(--muted);text-decoration:none;font-weight:600;}
.btn{background:var(--teal);color:white;padding:10px 14px;border-radius:8px;text-decoration:none;font-weight:700;}
.btn.large{padding:14px 20px;font-size:16px}

.hero{padding:56px 0;background:linear-gradient(90deg, rgba(11,99,167,0.06), rgba(18,166,185,0.04));}
.hero-grid{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:center;}
.hero h2{font-size:32px;margin:0;color:#072b4a;}
.hero p{color:var(--muted);margin-top:12px;margin-bottom:18px;}

.hero-card{background:var(--card);padding:18px;border-radius:12px;box-shadow:0 10px 30px rgba(12,74,110,0.06);text-align:center;}
.hero-card img{max-width:100%;border-radius:8px}
.bbbee-caption{font-size:13px;color:var(--muted);margin-top:8px}

.section{padding:48px 0}
.alt{background:linear-gradient(180deg, #ffffff, #fbfdff);}
h3{font-size:24px;color:#072b4a;margin-bottom:18px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:18px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
article{background:var(--card);padding:18px;border-radius:12px;box-shadow:0 6px 18px rgba(12,74,110,0.04)}
.contact-grid{display:grid;grid-template-columns:360px 1fr;gap:20px;align-items:start}
.contact-card{background:var(--card);padding:18px;border-radius:12px;box-shadow:0 6px 18px rgba(12,74,110,0.04)}
.contact-form label{display:block;margin-bottom:10px;font-weight:600;color:var(--muted)}
.contact-form input, .contact-form textarea{width:100%;padding:10px;border-radius:8px;border:1px solid #e6eef2;margin-top:6px}
.site-footer{padding:24px 0;background:#072b4a;color:white;margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}
.small{font-size:12px;color:#cfeef4}

/* Dropdown nav basic */
.nav .dropdown{position:relative}
.nav .dropdown-menu{position:absolute;top:38px;left:0;background:white;border-radius:8px;padding:8px;box-shadow:0 10px 30px rgba(12,74,110,0.08);display:none;min-width:220px}
.nav .dropdown:hover .dropdown-menu{display:block}
.nav .dropdown-menu li{padding:8px 12px}
.nav .dropdown-menu a{color:#0b63a7;font-weight:600;text-decoration:none}

/* Responsive */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; padding:0 10px}
  .nav{display:none}
  .header-inner{gap:10px}
  .container{padding:0 14px}
  .grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
}