:root {
 --spacing-unit:1rem;
 --radius:8px;
 --font-main:'Inter',sans-serif;
}

body{margin:0;font-family:Inter,Arial,sans-serif;color:#1a1a1a;background:#f9fafb;}
header{background:#ffffff;border-bottom:1px solid #e5e7eb;}
.card{background:white;padding:20px;border-radius:12px;box-shadow:0 4px 10px rgba(0,0,0,0.05);text-align:left;}
.card2{padding:1px;text-align:left;}
.cta-button{background:#2563eb;color:white;padding:10px 10px;border-radius:8px;text-decoration:none;font-weight:600;}
.cta-section{background:#1e3a8a;color:white;padding:5px 5px;text-align:center;}
.container{max-width:1200px;margin:0 auto;padding:0px;display:flex;align-items:center;justify-content:space-between;}
.footer{background:#111827;color:white;padding:10px 20px;}
.footer a{color:#9ca3af;text-decoration:none;}
.footer-note{text-align:center;margin-top:20px;color:#6b7280;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:30px;}
.hero-img{width:100%;max-height:380px;object-fit:cover;border-radius:12px;margin-bottom:10px;}
.logo{font-size:20px;font-weight:700;display:flex;align-items:center;gap:8px;}
.main-nav a{margin:0 10px;color:#374151;text-decoration:none;font-weight:500;}
.section{padding:5px 5px;text-align:center;}

/* Mobile-first improvements */
@media (max-width: 600px){
  .container{
    flex-direction: column;
    align-items: flex-start;
    padding: 10px;
  }
  .main-nav{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
  }
  .main-nav a{
    margin: 0;
    padding: 6px 0;
  }
  .hero-img{
    max-height: 220px;
  }
  .section{
    padding: 15px 10px;
  }
  h1,h2,h3{
    font-size: 1.2rem;
  }
}


/* MOBILE HAMBURGER MENU */
.menu-toggle{display:none;}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:6px;}
.hamburger span{display:block;width:24px;height:3px;background:#374151;border-radius:2px;}

@media (max-width:600px){
  .hamburger{display:flex;}
  .container{flex-direction:row;align-items:center;justify-content:space-between;}
  .main-nav{display:none;flex-direction:column;width:100%;margin-top:12px;gap:10px;}
  .menu-toggle:checked ~ .main-nav{display:flex;}
  .cta-button{display:none;}
  .menu-toggle:checked ~ .cta-button{display:block;margin-top:10px;}
}


/* PERFORMANCE: Enable smoother rendering */
img { image-rendering: auto; }

/* Avoid layout thrash on mobile */
@media (max-width:600px){
  body { overflow-x:hidden; }
}


/* Visually hidden but accessible text */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* Skip link for keyboard users */
.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.skip-link:focus {
  left: 16px;
  top: 16px;
  width: auto;
  height: auto;
  padding: 8px 12px;
  background: #111827;
  color: #ffffff;
  z-index: 1000;
  clip: auto;
  border-radius: 4px;
}

/* Visible focus outline */
a:focus-visible,
button:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}


/* Dark mode (respects user preference) */
@media (prefers-color-scheme: dark) {
  body {
    background:#020617;
    color:#e5e7eb;
  }
  header {
    background:#020617;
    border-bottom:1px solid #1f2937;
  }
  .section {
    background:transparent;
  }
  .card, .card2 {
    background:#020617;
    color:#e5e7eb;
    box-shadow:0 4px 12px rgba(0,0,0,0.6);
  }
  .cta-section {
    background:#0f172a;
    color:#e5e7eb;
  }
  .cta-button {
    background:#2563eb;
    color:#e5e7eb;
  }
  .footer {
    background:#000000;
    color:#e5e7eb;
  }
  .footer a {
    color:#9ca3af;
  }
  .logo {
    color:#e5e7eb;
  }
}

/* Print styles */
@media print {
  header, .cta-section, .footer, .hamburger, .menu-toggle, .skip-link {
    display:none !important;
  }
  body {
    background:#ffffff;
    color:#000000;
  }
  .section {
    padding:12px 0;
  }
  a {
    color:#000000;
    text-decoration:underline;
  }
}

/* footer list alignment fix */
.footer ul {
    padding-left: 1.2rem;   /* Normalize left padding so bullets align */
    margin-left: 0;         /* Prevent browser default misalignment */
    list-style-position: outside;  /* Keep original bullet behavior */
}


/* Robust footer bullet alignment fix (Option B) */
.footer ul li {
    position: relative;
    padding-left: 1.2em; /* reserve space for bullet */
}

.footer ul li::before {
    content: "•";
    position: absolute;
    left: 0; /* place bullet at fixed left edge */
    width: 1em;
}


/* Remove default bullets to prevent double markers */
.footer ul {
    list-style-type: none;
    padding-left: 0;
    margin-left: 0;
}


/* Unified footer list rendering using Flexbox (Solution C) */
.footer ul {
    list-style-type: none;
    padding-left: 0;
    margin-left: 0;
}

.footer ul li {
    display: flex;
    align-items: flex-start;
    gap: 0.5em;  /* space between bullet and text */
}

/* Bullet element */
.footer ul li::before {
    content: "•";
    margin-top: 0.1em;
}


/* Narrow content container replacing inline styles */
.container-narrow {
  max-width: 900px;
  text-align: left;
  margin-inline: auto;
}