/* ============================================================
   CITY VILLA CLUB — редизайн: сторінка «Типи будинків»
   Картка обʼєкта + фільтр (тип / площа / стан будівництва).
   Підключається тільки на types.php. Усі класи — префікс .rd-,
   нові імена звірені з components.css/inner.css, колізій нема.
   ============================================================ */

.rd-catalog { padding-top: clamp(1.4rem, 1rem + 1.4vw, 2.2rem); }

/* ---------- Фільтр ---------- */
.rd-filters {
  border: 0;
  margin: 0 0 clamp(2rem, 1.5rem + 2vw, 3.2rem);
  padding: clamp(1.2rem, 1rem + 1vw, 1.8rem) var(--rd-pad);
  background: var(--rd-white);
  border-radius: var(--rd-radius);
  box-shadow: var(--rd-shadow);
}
.rd-filters__label { margin: 0 0 1rem; }
.rd-filters__groups {
  display: grid;
  gap: 1.2rem clamp(1.4rem, 1rem + 2vw, 2.6rem);
}
@media (min-width: 700px) {
  .rd-filters__groups { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.rd-filters__group { border: 0; margin: 0; padding: 0; }
.rd-filters__group legend {
  padding: 0 0 .6rem;
  font-size: .74rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .13em;
  color: var(--rd-muted);
}
.rd-filters__group > div { display: flex; flex-wrap: wrap; gap: .5rem; }

/* чекбокс, стилізований чипом: справжній input лишається, тільки прозорий */
.rd-fchip { position: relative; display: inline-flex; cursor: pointer; }
.rd-fchip input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.rd-fchip span {
  display: inline-flex;
  align-items: center;
  padding: .55em 1.05em;
  border-radius: 999px;
  border: 1px solid var(--rd-hairline);
  background: var(--rd-paper);
  font-size: .82rem;
  font-weight: 500;
  color: var(--rd-ink);
  transition: background var(--rd-fast), border-color var(--rd-fast), color var(--rd-fast);
}
.rd-fchip:hover span { border-color: var(--rd-navy); }
.rd-fchip input:checked ~ span { background: var(--rd-navy); border-color: var(--rd-navy); color: #fff; }
.rd-fchip input:focus-visible ~ span { outline: 2px solid var(--rd-amber); outline-offset: 2px; }

.rd-filters__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: clamp(1.2rem, 1rem + 1vw, 1.8rem);
  padding-top: clamp(1.2rem, 1rem + 1vw, 1.8rem);
  border-top: 1px solid var(--rd-hairline);
}
.rd-filters__count { margin: 0; font-size: .92rem; color: var(--rd-muted); }
.rd-filters__count b { font-weight: 900; font-style: italic; color: var(--rd-navy); padding-right: .04em; }

/* кнопка «Скинути» на світлому тлі — окремий варіант, .rd-btn--ghost зроблений для фото/наві */
.rd-btn--ghost-navy {
  background: none;
  color: var(--rd-navy);
  padding: .85em 1.5em;
  border-radius: var(--rd-radius-s);
  box-shadow: inset 0 0 0 1px var(--rd-hairline);
}
.rd-btn--ghost-navy:hover { background: var(--rd-paper); box-shadow: inset 0 0 0 1px var(--rd-navy); }

/* ---------- Пояснення: нова архітектура забудови ---------- */
.rd-archnote {
  display: grid;
  gap: 0;
  grid-template-columns: 1fr;
  margin: 0 0 clamp(2rem, 1.5rem + 2vw, 3.2rem);
  background: var(--rd-white);
  border-radius: var(--rd-radius);
  box-shadow: var(--rd-shadow);
  overflow: hidden;
}
@media (min-width: 700px) {
  .rd-archnote { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); align-items: stretch; }
}
.rd-archnote__img {
  width: 100%;
  height: 100%;
  max-height: 20rem;
  object-fit: cover;
}
@media (min-width: 700px) { .rd-archnote__img { max-height: none; } }
.rd-archnote__text {
  padding: clamp(1.4rem, 1.1rem + 1.2vw, 2.2rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .6rem;
}
.rd-archnote__label {
  margin: 0;
  font-size: .74rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .13em;
  color: var(--rd-amber);
}
.rd-archnote__text p:last-child { margin: 0; color: var(--rd-ink); }

/* ---------- Порожній результат ---------- */
.rd-catalog-empty {
  text-align: center;
  max-width: 34em;
  margin: 0 auto clamp(2rem, 1.5rem + 2vw, 3.2rem);
  padding: clamp(2rem, 1.5rem + 2vw, 3rem) 1.5rem;
  background: var(--rd-white);
  border-radius: var(--rd-radius);
  border: 1px dashed var(--rd-hairline);
  color: var(--rd-muted);
}
.rd-catalog-empty a { color: var(--rd-navy); }

/* ---------- Сітка карток обʼєктів ---------- */
.rd-tcards {
  display: grid;
  gap: var(--rd-gap);
  grid-template-columns: 1fr;
  padding-bottom: clamp(2.4rem, 1.8rem + 2.4vw, 4rem);
}
@media (min-width: 700px)  { .rd-tcards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .rd-tcards { grid-template-columns: repeat(3, 1fr); } }

.rd-tcard {
  display: flex;
  flex-direction: column;
  background: var(--rd-white);
  border-radius: var(--rd-radius);
  overflow: hidden;
  box-shadow: var(--rd-shadow);
  transition: transform var(--rd-norm) var(--rd-ease), box-shadow var(--rd-norm);
}
.rd-tcard:hover { transform: translateY(-4px); box-shadow: var(--rd-shadow-lift); }
.rd-tcard[hidden] { display: none; }

.rd-tcard__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.rd-tcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--rd-ease); }
.rd-tcard:hover .rd-tcard__media img { transform: scale(1.05); }
.rd-tcard.is-sold .rd-tcard__media img { filter: grayscale(1) brightness(1.06); opacity: .75; }
.rd-tcard.is-sold .rd-tcard__name,
.rd-tcard.is-sold .rd-tcard__price { color: var(--rd-muted); }

.rd-tcard__body { padding: 1.2rem 1.3rem 1.4rem; display: flex; flex-direction: column; flex: 1; }
.rd-tcard__format {
  margin: 0 0 .2rem;
  font-size: .74rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--rd-amber);
}
.rd-tcard__name { margin: 0 0 .35rem; font-size: 1.25rem; }
.rd-tcard__meta { margin: 0 0 1rem; font-size: .85rem; color: var(--rd-muted); }
.rd-tcard__price { font-weight: 900; font-style: italic; color: var(--rd-navy); padding-right: .06em; }
.rd-tcard__avail b { color: var(--rd-free); font-weight: 500; }

.rd-tcard__specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem 1.1rem;
  margin: 0 0 1.2rem;
  padding-block: 1rem;
  border-block: 1px solid var(--rd-hairline);
}
.rd-tcard__specs > div { display: grid; gap: .1rem; }
.rd-tcard__specs dt { margin: 0; font-size: .72rem; color: var(--rd-muted); letter-spacing: .03em; }
.rd-tcard__specs dd { margin: 0; font-weight: 900; font-style: italic; font-size: 1.02rem; color: var(--rd-navy); }
.rd-tcard__specs dd sup { font-size: .6em; font-style: normal; font-weight: 500; }

.rd-tcard__cta { margin-top: auto; width: 100%; text-align: center; }
.rd-tcard__cta--disabled {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: auto;
  width: 100%;
  padding: 1em .2em;
  font-family: var(--rd-font);
  font-size: .84rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .13em;
  color: var(--rd-muted);
  border-top: 2px solid var(--rd-hairline);
}


/* Єдина реальна пропозиція серед готових — бейдж має вирізнятись із «Продано». */
.rd-status--hot {
  background: var(--rd-amber, #f39400);
  color: #fff;
}
