/* Container */
.c-footer {
  border-top: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, .8);
  padding: 1.25rem 0;
  color: #475569;
  font-size: .9rem;
}

/* Layout: center, allow wraps when narrow */
.c-footer__inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 20px;

  display: flex;
  align-items: center;       /* keep baseline feeling on wide */
  justify-content: center;
  flex-wrap: wrap;           /* allow wrapping on phones */
  gap: .5rem 1rem;
  text-align: center;
}

/* Let legal wrap by default (mobile friendly). We'll restrict it on wider screens. */
.c-footer__legal {
  color: #475569;
  /* no white-space here; allow natural wrapping on phones */
}

/* Links inline with dot separators; allow wrap */
.c-footer__links {
  list-style: none;
  margin: 0;
  padding: 0;

  display: inline-flex;      /* inline for baseline with text */
  align-items: center;       /* fixes dot vertical alignment */
  flex-wrap: wrap;
  gap: .5rem 1rem;
}

/* Dot before the first link (between legal and first link) */
.c-footer__links::before {
  content: "•";
  color: #94a3b8;
  display: inline-block;
  line-height: 1;            /* baseline alignment */
  margin: 0 -.5rem 0 -1rem;
}

/* Dots between links */
.c-footer__links li + li::before {
  content: "•";
  color: #94a3b8;
  display: inline-block;
  line-height: 1;            /* baseline alignment */
  margin: 0 .5rem 0 -0.5rem;
}

/* Link look */
.c-footer__links a {
  color: #334155;
  text-decoration: none;
}
.c-footer__links a:hover {
  text-decoration: underline;
}

/* On small screens, remove the leading separator bullet and let links wrap naturally */
@media (max-width: 525px) {
  .c-footer__links {
    /* slight breathing room when the list wraps under the legal text */
    margin-top: .35rem;
  }
  .c-footer__links::before {
    content: none;      /* no leading bullet before the first link */
    display: none;
  }
}

/* =========================
   Breakpoints / Behavior
   ========================= */

/* ≥640px (tablets+): keep legal on one line for the “single-line” desktop look */
@media (min-width: 640px) {
  .c-footer__legal {
    white-space: nowrap;     /* lock legal to one line on larger screens */
  }
  .c-footer__inner {
    gap: .75rem 1.5rem;
  }
}

/* ≥1024px: a touch more breathing room */
@media (min-width: 1024px) {
  .c-footer__inner {
    gap: .75rem 2rem;
  }
}