
:root{
  --bg:#f2f2f2;
  --panel:#ffffff;
  --text:#0e1116;
  --muted:#475569;
  --brand:#095aa5;
  --brand-2:#095aa5;
  --card:#ffffff;
  --border:#d7dce2;
  --focus:#095aa5;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6}
img{max-width:100%;height:auto}
a{color:var(--brand-2);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1080px;margin:0 auto;padding:0 20px}
.flex{display:flex}
.between{justify-content:space-between}
.center{align-items:center}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}

.site-header{position:sticky;top:0;background:rgba(11,18,32,0.9);backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid var(--border);z-index:10}
.site-header .brand{display:flex;gap:12px;align-items:center;font-weight:700;color:var(--text)}
.site-header .brand img {
  height: 72px;      /* already doubled */
  margin-top: 8px;   /* add buffer above */
  margin-bottom: 8px; /* balance spacing below */
}

.site-header .nav-toggle{display:none;background:none;border:1px solid var(--border);border-radius:8px;width:44px;height:44px}
.site-header .nav-menu{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.site-header .nav-menu a{display:block;padding:16px 6px;color:var(--text)}

.hero{padding:80px 0;background:linear-gradient(180deg, rgba(9,90,165,0.06), rgba(9,90,165,0));}
.hero h1{font-size:44px;line-height:1.1;margin:0 0 12px}
.hero p{max-width:760px;margin:0 0 18px;color:var(--muted)}
.cta-row{display:flex;gap:12px;margin-top:12px}
.btn{display:inline-block;padding:12px 16px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--text);font-weight:600}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:linear-gradient(90deg,var(--brand),var(--brand-2));border:none;color:#081016}

.badges{padding:18px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.badge{background:var(--card);border:1px solid var(--border);padding:10px 12px;border-radius:12px;text-align:center}

.services-preview{padding:48px 0}
.card{background:var(--card);border:1px solid var(--border);padding:20px;border-radius:16px}
.card.muted{background:#f9fafb;border:1px solid #e2e8f0}

.highlight{padding:48px 0;background:linear-gradient(0deg, rgba(34,197,94,0.06), transparent)}
.checklist{list-style:none;padding:0;margin:0}
.checklist li{padding-left:26px;position:relative;margin:8px 0}
.checklist li::before{content:"";position:absolute;left:0;top:8px;width:14px;height:14px;border-radius:50%;background:conic-gradient(var(--brand),var(--brand-2));box-shadow:0 0 0 2px #09111d}

.faq{padding:48px 0}
details{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px 16px;margin:12px 0}
summary{cursor:pointer;font-weight:600}

.page-hero{padding:48px 0;border-bottom:1px solid var(--border)}
.form .form-row{display:flex;flex-direction:column;margin:12px 0}
label{font-weight:600;margin-bottom:6px}
input,textarea{background:#ffffff;border:1px solid var(--border);border-radius:12px;padding:12px;color:var(--text)}
input:focus,textarea:focus{outline:2px solid var(--focus);border-color:transparent}
.text-link{color:var(--brand);font-weight:600}

.site-footer{border-top:1px solid var(--border);padding:24px 0;margin-top:48px;background:#f8fafc}
.site-footer .brand img {
  height: 72px;   /* match header logo */
  margin-top: 8px;
  margin-bottom: 8px;
}

.footer-top{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:12px}
.footer-links{list-style:none;margin:0;padding:0;display:flex;gap:16px}

.not-found{display:flex;align-items:center;justify-content:center;min-height:80vh;text-align:center}

.trust-bullets{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;list-style:none;padding:0;margin:16px 0;color:var(--muted)}
.trust-bullets li{background:rgba(255,255,255,0.04);border:1px solid var(--border);padding:8px 12px;border-radius:10px}

.contact-list{list-style:none;margin:0;padding:0}
.fine-print{color:var(--muted);font-size:14px;margin-top:6px}

@media (max-width: 860px){
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .site-header .nav-toggle{display:block}
  .site-header .nav-menu{display:none;flex-direction:column;background:#0b1220;position:absolute;right:20px;top:64px;border:1px solid var(--border);border-radius:12px;overflow:hidden}
  .site-header .nav-menu.open{display:flex}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
/* Light theme tweaks for contrast */
a{color:var(--brand-2)}
.btn{background:#ffffff;color:#0e1116}
.btn.primary{background:var(--brand);color:#ffffff}
.site-header{background:rgba(255,255,255,0.92)}
.footer-top a{color:inherit}


/* Hamburger icon styling */
.nav-toggle {
  position: relative;
  width: 32px;
  height: 24px;
  cursor: pointer;
  border: none;
  background: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.nav-toggle span,
.nav-toggle::before,
.nav-toggle::after {
  content: "";
  display: block;
  height: 3px;
  background: #000; /* black bars for visibility */
  border-radius: 2px;
  transition: 0.3s ease;
}

.nav-toggle::before,
.nav-toggle::after {
  width: 100%;
}

.nav-toggle span {
  width: 70%;
  align-self: flex-start;
}

/* --- Mobile nav hamburger + dropdown fixes --- */
.site-header .nav-toggle {
  position: relative;
  display: block;
  width: 44px;
  height: 44px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
}
.site-header .nav-toggle::before,
.site-header .nav-toggle::after,
.site-header .nav-toggle span {
  content: "";
  position: absolute;
  left: 9px;
  right: 9px;
  height: 2px;
  background: #0e1116;
  border-radius: 2px;
}
.site-header .nav-toggle::before { top: 13px; }
.site-header .nav-toggle span     { top: 21px; }
.site-header .nav-toggle::after  { top: 29px; }

@media (max-width: 860px){
  .site-header .nav-menu {
    display: none;
    flex-direction: column;
    background: #0b1220;
    position: absolute;
    right: 20px;
    top: 64px;
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    min-width: 220px;
    z-index: 9999;
  }
  .site-header .nav-menu.open { display: flex; }
  .site-header .nav-menu a {
    color: #ffffff;
    padding: 14px 16px;
  }
  .site-header .nav-menu a:hover {
    background: rgba(255,255,255,0.08);
    text-decoration: none;
  }
}

/* === Mobile nav polish (clean, non-boxy) === */
.site-header .nav-toggle{
  position: relative;
  width: 44px; height: 44px;
  border: none;               /* remove box border */
  background: transparent;    /* remove button fill */
  border-radius: 0;           /* no rounded box look */
  box-shadow: none;           /* no shadows */
  cursor: pointer;
}
.site-header .nav-toggle::before,
.site-header .nav-toggle::after,
.site-header .nav-toggle span{
  content: "";
  position: absolute;
  left: 10px; right: 10px;
  height: 2px;
  background: var(--text);    /* match site text color */
  border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.site-header .nav-toggle::before{ top: 14px; }
.site-header .nav-toggle span    { top: 21px; }
.site-header .nav-toggle::after { top: 28px; }

/* Dropdown panel uses light theme to match header */
@media (max-width: 860px){
  .site-header .nav-menu{
    display: none;
    flex-direction: column;
    position: absolute;
    right: 20px; top: 64px;
    background: #ffffff;              /* light panel */
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    min-width: 220px;
    overflow: hidden;
    z-index: 1000;
  }
  .site-header .nav-menu.open{ display: flex; }
  .site-header .nav-menu a{
    color: var(--text);
    padding: 14px 16px;
    font-weight: 600;
  }
  .site-header .nav-menu a:hover{
    background: #f7fafc;
    text-decoration: none;
  }
}

/* === Final nav visibility rules === */
/* Desktop default: show links, hide hamburger */
.site-header .nav-toggle { display: none !important; }
.site-header .nav-menu { display: flex !important; }

/* Mobile: show hamburger, hide menu until opened */
@media (max-width: 860px){
  .site-header .nav-toggle { display: block !important; }
  .site-header .nav-menu { display: none; }
  .site-header .nav-menu.open { display: flex; }
}

/* === Critical fix: mobile should hide menu until toggled === */
@media (max-width: 860px){
  .site-header .nav-toggle { display: block !important; }
  .site-header .nav-menu { display: none !important; }           /* override desktop !important */
  .site-header .nav-menu.open { display: flex !important; }       /* only show when toggled */
}
