/* The featured-homes cards for a page that is not ours (the Webflow homepage) or for the
   /embed/featured frame. The canon's property card (components/tch-property-card),
   restated under `tchx-` with its own values: this file must never read a host page's
   custom properties, and nothing here may style anything outside `.tchx-feed`.
   Type is inherited so the cards sit in the host's font; the title alone is the
   canon's display face when the host has it. No rate on a card (content-pack.md). */
.tchx-feed {
  --tchx-ink: #1A1B1F; --tchx-text: #525252; --tchx-slate: #485C66; --tchx-line: #D7E1E4;
  --tchx-teal: #126B69; --tchx-teal-tint: #E7F1F0; --tchx-gold-wash: #FFF6DB; --tchx-gold-ink: #6B4E00;
  display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
  box-sizing: border-box; font: inherit; color: var(--tchx-text); text-align: left;
}
.tchx-feed *, .tchx-feed *::before, .tchx-feed *::after { box-sizing: border-box; }
.tchx-card {
  display: flex; flex-direction: column; overflow: hidden; background: #FFFFFF;
  border: 1px solid var(--tchx-line); border-radius: 18px; color: inherit; text-decoration: none;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.tchx-card:hover { border-color: var(--tchx-teal); box-shadow: 0 1px 2px rgba(18,56,62,.05), 0 8px 24px rgba(18,56,62,.08); transform: translateY(-2px); }
.tchx-card:focus-visible { outline: 3px solid var(--tchx-teal); outline-offset: 3px; }
.tchx-card__photo { display: block; aspect-ratio: 3 / 2; background: var(--tchx-teal-tint); overflow: hidden; }
.tchx-card__photo img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; border: 0; }
.tchx-card__body { display: grid; gap: .5rem; padding: 1rem 1.125rem 1.25rem; }
.tchx-card__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }
.tchx-card__city { font-size: .875rem; font-weight: 600; color: var(--tchx-slate); }
.tchx-chip { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .625rem; border-radius: 999px;
  background: var(--tchx-teal-tint); color: #0D524F; font-size: .8125rem; font-weight: 600; line-height: 1.2; }
.tchx-chip::before { content: ""; width: .4375rem; height: .4375rem; border-radius: 50%; background: currentColor; }
.tchx-chip--soon { background: var(--tchx-gold-wash); color: var(--tchx-gold-ink); }
.tchx-card__title { font-family: "Merriweather", Georgia, serif; font-weight: 700; font-size: 1.1875rem; line-height: 1.3; color: var(--tchx-ink); }
.tchx-card__specs { display: flex; flex-wrap: wrap; gap: .25rem 1rem; font-size: .9375rem; }
.tchx-card__specs b { color: var(--tchx-ink); font-weight: 600; }
.tchx-empty { margin: 0; font: inherit; }
.tchx-empty a { color: var(--tchx-teal, #126B69); font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .tchx-card { transition: none; } .tchx-card:hover { transform: none; } }