
:root {
  --primary: #0052cc;
  --secondary: #0b1f44;
  --text: #1a1a1a;
  --bg: #ffffff;
  --radius: 6px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  color: var(--primary);
  text-decoration: none;
}

button {
  border-radius: var(--radius);
  cursor: pointer;
}

/* ===============================
   BASE FOOTER
================================ */
.footer{
  width:100%;
  background:#3a3a3a; /* Dark grey background for the footer */
  color:#d6d6d6;
  font-size:13px;
  font-family:inherit;
}

/* ===============================
   TOP UTILITY STRIP
   (EXTRA TOP SPACE ADDED)
================================ */
.footer-utility{
  background:#333333; /* Same dark grey for the top utility strip */
  border-bottom:1px solid #444;
}

.footer-utility-inner{
  max-width:1400px;
  margin:0 auto;
  padding:2.25rem 2.5rem 1.25rem; /* ↑ ONLY CHANGE: +~16px on top */
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.footer-utility-left{
  font-size:12px;
  color:#cfcfcf;
  letter-spacing:.02em;
}

/* SOCIAL ICONS */
.footer-utility-right{
  display:flex;
  align-items:center;
}

.footer-utility-right a{
  display:inline-flex;
  margin-left:1.25rem;
}

.footer-utility-right svg{
  width:18px;
  height:18px;
  fill:#cfcfcf;
  transition:fill .2s ease;
}

.footer-utility-right svg:hover{
  fill:#ffffff;
}

/* ===============================
   MAIN LINK MATRIX
================================ */
.footer-main{
  background:#333333; /* Same dark grey for the main link matrix */
}

.footer-main-inner{
  max-width:1400px;
  margin:0 auto;
  padding:4.5rem 2.5rem 5rem;
  display:grid;
  grid-template-columns:repeat(5, minmax(160px, 1fr));
  gap:3rem;
}

/* COLUMN HEADERS */
.footer-col h4{
  font-size:13px;
  font-weight:600;
  color:#ffffff;
  margin-bottom:1.2rem;
}

/* LINKS */
.footer-col a{
  display:block;
  font-size:13px;
  color:#d1d1d1;
  text-decoration:none;
  margin:.45rem 0;
  line-height:1.5;
}

.footer-col a:hover{
  color:#ffffff;
}

/* ===============================
   FOOTNOTES / COPYRIGHT
================================ */
.footer-footnotes{
  background:#4a4a4a; /* Lighter grey for the footnotes */
  border-top:1px solid #555;
}

.footer-footnotes-inner{
  max-width:1400px;
  margin:0 auto;
  padding:1.75rem 2.5rem;
  font-size:12px;
  color:#cfcfcf;
}

/* ===============================
   RESPONSIVE
================================ */
@media(max-width:1100px){
  .footer-main-inner{
    grid-template-columns:repeat(3, 1fr);
    padding:4rem 2.5rem 4.5rem;
  }
}

@media(max-width:768px){
  .footer-main-inner{
    grid-template-columns:1fr;
    gap:2.5rem;
    padding:3.5rem 6vw 4rem;
  }

  .footer-utility-inner{
    flex-direction:column;
    align-items:flex-start;
    gap:1rem;
    padding:2.25rem 6vw 1.5rem; /* mobile version preserved */
  }

  .footer-utility-right{
    margin-top:.5rem;
  }
}
