/* page-specific styles (set B)
   Small additions for: contact, careers, faqs, 404 and shared empty states.
   Everything else reuses main.css. */

/* ------------------------------ shared */
.empty-note {
  text-align: center;
  color: var(--muted);
  max-width: 34rem;
  margin: 2rem auto 0;
}

/* ------------------------------ contact */
.contact__map { margin-top: 1rem; }
.form-card h2 { font-size: 1.45rem; margin-bottom: .35rem; }
.form-card__sub { color: var(--muted); font-size: .95rem; margin-bottom: 1.4rem; }
.form-foot { margin-top: 1.4rem; display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; }
.form-foot .hint { font-size: .82rem; color: var(--muted); margin: 0; flex: 1; min-width: 14rem; }
.form-faq-link {
  margin: 1.5rem 0 0; padding-top: 1.2rem;
  border-top: 1px solid var(--line-cool); font-size: .93rem;
}
.form-faq-link a { font-weight: 600; }
.chan p a { color: var(--navy); }
.chan p a:hover { color: var(--teal-dark); }

/* ------------------------------ careers */
.careers__note {
  text-align: center; color: var(--muted); font-style: italic;
  max-width: 46rem; margin: 2.2rem auto 0;
}

/* ------------------------------ faqs */
.faq-filters { justify-content: center; }
.faq-more { text-align: center; margin: 2rem auto 0; color: var(--muted); max-width: 40rem; }

/* ------------------------------ 404 */
.nf__inner { text-align: center; max-width: 44rem; padding-block: clamp(1rem, 4vw, 3rem); }
.nf__code {
  font-family: var(--font-display); font-weight: 800;
  font-size: clamp(4.5rem, 12vw, 7rem); color: var(--powder);
  line-height: 1; margin-bottom: .5rem;
}
.nf__inner p { color: var(--muted); max-width: 30rem; margin-inline: auto; }
.nf__actions { display: flex; gap: .9rem; justify-content: center; flex-wrap: wrap; margin-top: 1.8rem; }
.nf__links {
  margin-top: 2.6rem; font-size: .92rem;
  display: flex; gap: .4rem 1.1rem; flex-wrap: wrap; justify-content: center;
}
.nf__links span { color: var(--muted); }