/* =====================================================
   QUICKLINKS BANNER — FINAL POLISHED VERSION
   ===================================================== */

.quicklinks-banner {
  background-color: #003366;
  width: 100%;
}

/* Reset list */
.quicklinks-banner ul {
  list-style: none;
  margin: 0;
  padding: 0 2rem 0 0; /* ❗ remove LEFT padding */
  display: flex;
  align-items: stretch;
  height: 48px;
}

/* All list items */
.quicklinks-banner li {
  display: flex;
}

/* All links base */
.quicklinks-banner a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1.25rem;
  color: #ffffff;
  text-decoration: none;
  white-space: nowrap;
  height: 100%;
  transition: background-color 0.15s ease, color 0.15s ease;
}

/* =====================================================
   LEFT: APPLY / VISIT / GIVE (CTA GROUP)
   ===================================================== */

/* Larger, lighter font */
.quicklinks-banner li:nth-child(-n+3) a {
  font-size: 16.5px;
  font-weight: 300; 
  min-width: 56px;
}

/* Colors */
.quicklinks-banner li:nth-child(1) a {
  background-color: #1f7a3f; /* Apply */
}
.quicklinks-banner li:nth-child(1) a:hover {
  background-color: #176033;
}

.quicklinks-banner li:nth-child(2) a {
  background-color: #0b63ce; /* Visit */
}
.quicklinks-banner li:nth-child(2) a:hover {
  background-color: #084fa5;
}


.quicklinks-banner li:nth-child(3) a {
  background-color: #0057AD; /* Give */
}
.quicklinks-banner li:nth-child(3) a:hover {
  background-color: #004a94;
}

/* =====================================================
   RIGHT: AUDIENCE LINKS
   ===================================================== */

/* Push audiences to the right */
.quicklinks-banner li:nth-child(4) {
  margin-left: auto;
}

/* Smaller + bolder than CTAs */
.quicklinks-banner li:nth-child(n+4) a {
  font-size: 15px;
  font-weight: 500;
}

/* =====================================================
   HOVER / FOCUS
   ===================================================== */

.quicklinks-banner li:nth-child(n+4) a:hover,
.quicklinks-banner li:nth-child(n+4) a:focus {
  background-color: #ffffff;
  color: #003366;
}

.quicklinks-banner li:nth-child(-n+3) a:hover,
.quicklinks-banner li:nth-child(-n+3) a:focus {
  color: #ffffff;
}

/* =====================================================
   MOBILE SAFETY
   ===================================================== */

@media (max-width: 768px) {
  .quicklinks-banner ul {
    padding: 0 1rem;
  }

  .quicklinks-banner a {
    padding: 0 0.75rem;
  }
}