/* Club Five Health - location amenities pages + global service finder.
   Builds on tokens.css / components.css. Loaded only on those two templates. */

/* ── Hero ─────────────────────────────────────────────────────────────── */
.cfh-amen-hero { text-align: center; }
.cfh-amen-hero h1 { margin: var(--sp-2) 0 var(--sp-3); }
.cfh-amen-hero__back { color: var(--accent-green); text-decoration: none; }
.cfh-amen-hero__back:hover { text-decoration: underline; }
.cfh-amen-hero__lede {
  max-width: 60ch; margin: 0 auto var(--sp-4);
  color: var(--ink-on-dark); opacity: .82; font-size: 1.05rem;
}
.cfh-amen-hero__cta { display: flex; gap: var(--sp-2); justify-content: center; flex-wrap: wrap; }

/* ── Sticky filter bar ────────────────────────────────────────────────── */
.cfh-amen-filter {
  position: sticky; top: 0; z-index: 30;
  background: var(--surface-light, #fff);
  border-bottom: 1px solid var(--border-light);
  padding: var(--sp-3) 0;
}
.cfh-amen-filter__in { display: flex; flex-direction: column; gap: var(--sp-3); }
.cfh-amen-search {
  display: flex; align-items: center; gap: var(--sp-2);
  border: 1px solid var(--border-light); border-radius: var(--radius-pill);
  padding: .65rem 1.1rem; background: var(--surface-cream);
}
.cfh-amen-search svg { width: 20px; height: 20px; color: var(--ink-muted); flex: 0 0 auto; }
.cfh-amen-search input {
  border: 0; background: transparent; width: 100%; font: inherit; color: var(--ink);
}
.cfh-amen-search input:focus { outline: none; }

.cfh-amen-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.cfh-amen-chip {
  border: 1px solid var(--border-light); background: #fff; color: var(--ink-muted);
  border-radius: var(--radius-pill); padding: .45rem 1rem;
  font: 600 .85rem/1 var(--font-display); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.cfh-amen-chip:hover { border-color: var(--ink); color: var(--ink); }
.cfh-amen-chip.is-active { background: var(--ink); color: #fff; border-color: var(--ink); }

/* ── Results ──────────────────────────────────────────────────────────── */
.cfh-amen-results { padding-top: var(--sp-5); }
.cfh-amen-group { margin-bottom: var(--sp-6); }
.cfh-amen-group[hidden] { display: none; }
.cfh-amen-group__head {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3);
  flex-wrap: wrap; margin-bottom: var(--sp-3);
  padding-bottom: var(--sp-2); border-bottom: 2px solid var(--accent-green);
  scroll-margin-top: 120px;
}
.cfh-amen-grid {
  display: grid; gap: var(--sp-3);
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.cfh-amen-card {
  display: flex; flex-direction: column; gap: .5rem;
  border: 1px solid var(--border-light); border-radius: var(--radius-md);
  padding: var(--sp-3); background: #fff; text-decoration: none; color: var(--ink);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.cfh-amen-card[hidden] { display: none; }
.cfh-amen-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent-green);
  box-shadow: 0 12px 28px rgba(14, 15, 14, .10);
}
.cfh-amen-card__title { margin: 0; font: 700 1.1rem/1.25 var(--font-display); }
.cfh-amen-card__blurb { margin: 0; color: var(--ink-muted); font-size: .92rem; line-height: 1.5; }
.cfh-amen-card__more {
  margin-top: auto; display: inline-flex; align-items: center; gap: .35rem;
  color: var(--ink); font: 600 .82rem/1 var(--font-display);
}
.cfh-amen-card__more svg { width: 16px; height: 16px; transition: transform .15s; }
.cfh-amen-card:hover .cfh-amen-card__more { color: var(--accent-green-hover); }
.cfh-amen-card:hover .cfh-amen-card__more svg { transform: translateX(3px); }

/* Tier-D cards (no client copy yet): softer treatment, "ask us" affordance. */
.cfh-amen-card--soft { background: var(--surface-cream); }
.cfh-amen-card--soft .cfh-amen-card__more { color: var(--ink-muted); }

.cfh-amen-empty {
  text-align: center; color: var(--ink-muted); font-size: 1.05rem; padding: var(--sp-5) 0;
}
.cfh-amen-empty[hidden] { display: none; }

/* ── Finder-specific ──────────────────────────────────────────────────── */
.cfh-find-group__link {
  font: 600 .85rem/1 var(--font-display); color: var(--accent-green-hover);
  text-decoration: none; white-space: nowrap;
}
.cfh-find-group__link:hover { text-decoration: underline; }

@media (min-width: 720px) {
  .cfh-amen-filter__in { flex-direction: row; align-items: center; }
  .cfh-amen-search { flex: 0 0 320px; }
  .cfh-amen-chips { flex: 1; }
}