/* ---------- cards ---------- */

.card {
  background-color: var(--paper);
  border: 1px solid var(--line);
  border-top: 3px solid var(--gold);
  border-radius: 10px;
  box-shadow: 0 4px 16px rgba(107, 31, 69, 0.06);
}

.card-header {
  background-color: transparent;
  border-bottom: 1px solid var(--line);
  color: var(--velvet);
  font-family: var(--font-display);
}

.card-footer {
  background-color: rgba(243, 163, 92, 0.06);
  border-top: 1px solid var(--line);
}

.card-title {
  font-family: var(--font-display);
  color: var(--velvet);
}

/* profile grid cards get a gentle lift on hover */
.card:has(.stretched-link):hover {
  box-shadow: 0 8px 24px rgba(232, 56, 108, 0.16);
  transform: translateY(-2px);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

/* ---------- home page "no results" state ----------
   Generous vertical padding both above and below is deliberate: with no profile grid to give
   the page height, the heading right above (e.g. "Оголошення міста X") and the footer right
   below used to sit almost flush against the "nothing found" text. */
.empty-state {
  text-align: center;
  padding: 2.5rem 1rem 3.5rem;
  max-width: 30rem;
  margin: 0 auto;
}
.empty-state-icon {
  width: 64px;
  height: 64px;
  margin-bottom: 1rem;
}
.empty-state-title {
  margin-bottom: 0.5rem;
}
.empty-state-hint {
  color: var(--muted);
  margin-bottom: 1.5rem;
}