.selection-calculator {
  margin: 42px auto 0;
  max-width: 1180px;
  padding: 42px;
  background: linear-gradient(135deg, #173c35, #28594e);
  color: #fff;
  box-shadow: 0 24px 70px rgba(20, 55, 48, .16);
}

.selection-calculator > header {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 40px;
  align-items: end;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, .16);
}

.selection-calculator > header span,
.selection-result span {
  display: block;
  color: #dfc9a3;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.selection-calculator h2 {
  margin: 8px 0 0;
  font: 48px/1.02 Georgia, serif;
  font-weight: 400;
}

.selection-calculator > header p {
  margin: 0;
  color: #d6e2de;
  font-size: 12px;
  line-height: 1.7;
}

.filter-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  padding-top: 28px;
}

.filter-form label,
.filter-field { min-width: 0; }
.filter-price { display: flex; flex-direction: column; gap: 10px; }

.filter-price > span,
.filter-field legend {
  color: #e7efec;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.filter-price i,
.filter-field legend i {
  display: inline-grid;
  place-items: center;
  width: 23px;
  height: 23px;
  margin-right: 7px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 50%;
  color: #dfc9a3;
  font-style: normal;
  text-transform: none;
}

.filter-price i img,
.filter-field legend i img,
.property-features li i img { width: 14px; height: 14px; object-fit: contain; }
.filter-field { margin: 0; padding: 0; border: 0; }
.filter-field legend { margin-bottom: 10px; }

.filter-form input[type="number"],
.filter-form input[type="text"],
.filter-form select {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 0;
  background: #fff;
  color: #173c35;
  font: 12px Arial, sans-serif;
  outline: none;
}

.filter-form input:focus,
.filter-form select:focus { border-color: #dfc9a3; box-shadow: 0 0 0 2px rgba(223, 201, 163, .14); }
.filter-options { display: flex; flex-wrap: wrap; gap: 7px; }
.filter-options label,
.filter-toggle { position: relative; display: block; cursor: pointer; }
.filter-options input,
.filter-toggle input { position: absolute; opacity: 0; pointer-events: none; }

.filter-options span,
.filter-toggle span {
  display: block;
  padding: 11px 13px;
  border: 1px solid rgba(255, 255, 255, .22);
  color: #e6efec;
  font-size: 10px;
  line-height: 1.15;
  transition: .2s ease;
}

.filter-options input:checked + span,
.filter-toggle input:checked + span { border-color: #dfc9a3; background: #dfc9a3; color: #173c35; }
.filter-actions { display: flex; gap: 16px; align-items: center; align-self: end; }

.filter-actions button {
  min-height: 48px;
  padding: 0 22px;
  border: 1px solid #dfc9a3;
  background: #dfc9a3;
  color: #173c35;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}

.filter-actions a { color: #fff; font-size: 10px; text-decoration: underline; text-underline-offset: 4px; }
.selection-result { display: flex; justify-content: space-between; align-items: center; margin-top: 28px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .16); }
.selection-result strong { font: 26px Georgia, serif; font-weight: 400; }
.catalog-results { padding-top: 54px; }
.catalog-empty { padding: 70px 24px; text-align: center; background: #f4f2ed; }
.catalog-empty > span { color: #a18860; font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.catalog-empty h2 { margin: 12px 0; font: 38px Georgia, serif; font-weight: 400; color: #173c35; }
.catalog-empty p { margin: 0 auto 22px; max-width: 460px; color: #64746f; font-size: 12px; line-height: 1.7; }
.catalog-empty a { display: inline-block; padding: 13px 19px; background: #173c35; color: #fff; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.property-features { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 0; padding: 0; list-style: none; }
.property-features li { display: flex; align-items: center; gap: 6px; max-width: 100%; padding: 7px 9px; background: #f0f4f2; color: #33554c; font-size: 9px; line-height: 1.3; }
.property-features li i { flex: 0 0 auto; color: #9a7b4f; font-style: normal; }
.property-features li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 900px) {
  .selection-calculator { margin-inline: 16px; padding: 30px; }
  .selection-calculator > header { grid-template-columns: 1fr; }
  .filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .selection-calculator { margin-top: 24px; padding: 24px 18px; }
  .selection-calculator h2 { font-size: 36px; }
  .filter-form { grid-template-columns: 1fr; }
  .selection-result { align-items: flex-start; gap: 8px; flex-direction: column; }
}