:root{
  --bg:#ffffff;
  --muted-bg:#ffffff;
  --text:#000000;
  --muted:#f7f7f7;

  --primary:#0b2a6f;
  --primary-2:#163c8a;

  --border:#e7ebf2;
  --radius:18px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  background:var(--bg);
  color:var(--text);
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.container{
  width:min(1150px, calc(100% - 36px));
  margin:0 auto;
}

/* =========================
   HEADER (shared)
========================= */
.site-header{
  background:#ffffff;
  border-bottom:1px solid var(--border);
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:16px 0;
}

/* Logo (image only) */
.logo{
  flex:0 0 auto;
  display:flex;
  align-items:center;
}

.logo-img{
  height:150px;   /* matches your screenshot */
  width:auto;
}

/* Center nav */
.top-nav{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  min-width:0;
}

.nav-link{
  font-size:15px;
  color:#4c566c;
  padding:8px 6px;
  white-space:nowrap;
}

.nav-link:hover{ color:var(--text); }

.nav-link.active{
  color:var(--text);
  text-decoration:underline;
  text-underline-offset:6px;
}

/* Icons right */
.header-icons{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:12px;
}

.icon-btn{
  width:38px;
  height:38px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:#1b2a55;
}

.icon-btn svg{
  width:20px;
  height:20px;
}

/* =========================
   FOOTER (shared)
========================= */
.site-footer{
  background:var(--primary);
  color:rgba(255,255,255,0.92);
}

.footer-top{
  padding:40px 0 34px;
  border-bottom:1px solid rgba(255,255,255,0.18);
}

.footer-top-inner{
  text-align:center;
}

.footer-top-inner h3{
  margin:0 0 14px 0;
  font-size:20px;
  letter-spacing:-0.2px;
}

.footer-top-inner p{
  margin:10px 0;
  color:rgba(255,255,255,0.78);
}

.footer-bottom{
  padding:18px 0;
}

.footer-bottom-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.footer-links{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  color:rgba(255,255,255,0.78);
  font-size:13px;
}

.footer-links a{
  color:rgba(255,255,255,0.78);
  text-decoration:underline;
  text-underline-offset:3px;
}

.footer-pay{
  display:flex;
  align-items:center;
  justify-content:center;
}

.pay-badge{
  width:34px;
  height:24px;
  border-radius:6px;
  background:#ffffff;
  color:#1f3a7a;
  display:grid;
  place-items:center;
  font-weight:900;
}
/* =========================
   FOOTER BADGES (shared)
========================= */
.footer-badges{
  margin-top: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.footer-badge{
  height: 60px;          /* consistent height */
  width: auto;
  max-width: 260px;      /* stops huge logos */
  object-fit: contain;
  display: block;

  /* helps white/transparent logos on dark footer */
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
}

/* If one logo still looks too small/big, you can target it by src or add a class */
@media (max-width: 600px){
  .footer-badge{
    height: 34px;
    max-width: 220px;
  }
}

/* Responsive (header) */
@media (max-width: 980px){
  .top-nav{
    justify-content:flex-end;
    gap:14px;
    flex-wrap:wrap;
  }
  .logo-img{ height:38px; }
}


/* =========================
   MOBILE NAV (shared)
========================= */

/* Hide hamburger on desktop */
.nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid var(--border);
  background:#fff;
  cursor:pointer;
}

.nav-toggle span{
  display:block;
  width:18px;
  height:2px;
  background:#1b2a55;
  margin:5px auto;
  border-radius:2px;
}

/* Mobile nav hidden by default */
.mobile-nav{
  display:none;
  padding: 10px 18px 18px;
  border-top:1px solid var(--border);
  background:#fff;
}

.mobile-nav.show{
  display:grid;
  gap:10px;
}

.mobile-nav .nav-link{
  padding:10px 10px;
  border-radius:10px;
  background:#f7f8fb;
}

/* On mobile: hide centered nav, show hamburger */
@media (max-width: 980px){
  .top-nav{ display:none; }
  .nav-toggle{ display:block; }
}