:root {
  --dhf-ink: #16324f;
  --dhf-deep: #173f4f;
  --dhf-teal: #287b8b;
  --dhf-muted: #687b83;
  --dhf-line: #d5ddde;
  --dhf-paper: #f4f1e8;
}
* {
  box-sizing: border-box;
}
.dreamhousefind-page {
  margin: 0;
  background: var(--dhf-paper);
  color: var(--dhf-ink);
  font-family: Arial, sans-serif;
}
.dhf-app {
  min-height: 100vh;
  padding: 0 5%;
}
.dhf-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 120px;
  border-bottom: 1px solid #ccd5d8;
}
.dhf-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--dhf-ink);
  text-decoration: none;
}
.dhf-brand img {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
}
.dhf-brand strong,
.dhf-footer strong {
  font:
    26px Georgia,
    serif;
}
.dhf-nav-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dhf-nav-actions > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #cbd5d8;
  border-radius: 50%;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
}
.dhf-nav-actions > button {
  min-width: 78px;
  padding: 11px 18px;
  border: 1px solid #b9c9cd;
  border-radius: 999px;
  background: transparent;
  color: var(--dhf-ink);
  font-weight: 700;
  cursor: pointer;
}
.dhf-add-listing-link { padding: 12px 18px; border-radius: 999px; background: #d8874d; color: #fff; font-size: 13px; font-weight: 800; text-decoration: none; box-shadow: 0 6px 18px #9c52262e; }
.dhf-add-listing-link:hover { background: #bf703b; }
.dhf-nav-actions > button:hover,
.dhf-nav-actions > button.dhf-account-active {
  border-color: var(--dhf-deep);
  background: var(--dhf-deep);
  color: #fff;
}
.dhf-account-dialog[hidden] { display: none; }
.dhf-account-dialog { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 24px; }
.dhf-account-backdrop { position: absolute; inset: 0; border: 0; background: #112c3ab8; backdrop-filter: blur(5px); cursor: default; }
.dhf-account-card {
  position: relative;
  width: min(100%, 500px);
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: clamp(30px, 5vw, 52px);
  border-radius: 22px;
  background: #fffdf7;
  box-shadow: 0 30px 90px #071a2860;
}
.dhf-account-close { position: absolute; top: 18px; right: 20px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: #e8eeed; color: var(--dhf-ink); font-size: 24px; cursor: pointer; }
.dhf-account-kicker { margin: 0 0 10px; color: var(--dhf-teal); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.dhf-account-card h2 { margin: 0; font: 42px/1.02 Georgia, serif; letter-spacing: -.025em; }
.dhf-account-intro { margin: 16px 0 26px; color: var(--dhf-muted); line-height: 1.55; }
.dhf-account-tabs { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 24px; padding: 4px; border-radius: 10px; background: #e8eeed; }
.dhf-account-tabs button { padding: 10px; border: 0; border-radius: 8px; background: transparent; color: var(--dhf-muted); font-weight: 700; cursor: pointer; }
.dhf-account-tabs button[aria-pressed="true"] { background: #fff; color: var(--dhf-ink); box-shadow: 0 2px 10px #1232; }
.dhf-account-card form { display: grid; gap: 15px; }
.dhf-account-card form[hidden] { display: none; }
.dhf-account-card form label { display: grid; gap: 7px; color: var(--dhf-ink); font-size: 12px; font-weight: 800; letter-spacing: .04em; }
.dhf-account-card form input { width: 100%; padding: 13px 14px; border: 1px solid #cbd6d7; border-radius: 9px; background: #fff; color: var(--dhf-ink); font: 16px Arial, sans-serif; }
.dhf-account-card form input:focus { outline: 2px solid #4a91a0; outline-offset: 1px; }
.dhf-account-card form small { margin-top: -8px; color: var(--dhf-muted); }
.dhf-account-card form button[type="submit"] { margin-top: 5px; padding: 15px 18px; border: 0; border-radius: 9px; background: var(--dhf-deep); color: #fff; font-weight: 800; cursor: pointer; }
.dhf-account-card form button[type="submit"] span { margin-left: 10px; }
.dhf-account-card form button:disabled { opacity: .55; cursor: wait; }
.dhf-account-card .dhf-forgot-link { margin-top: -5px; padding: 7px; border: 0; background: transparent; color: var(--dhf-teal); font-weight: 700; cursor: pointer; }
.dhf-account-card form > p { margin: 0 0 8px; color: var(--dhf-muted); line-height: 1.5; }
.dhf-social-login { display: grid; gap: 9px; margin: 22px 0; }
.dhf-social-login a { padding: 12px; border: 1px solid var(--dhf-line); border-radius: 9px; background: #fff; color: var(--dhf-ink); font-weight: 700; text-align: center; text-decoration: none; }
.dhf-social-login span { position: relative; color: var(--dhf-muted); font-size: 11px; text-align: center; text-transform: uppercase; }
.dhf-submit-page { max-width: 920px; margin: 0 auto; padding: 65px 0 110px; }
.dhf-submit-page > h1 { margin: 5px 0 14px; font: clamp(48px, 6vw, 78px)/.95 Georgia, serif; letter-spacing: -.04em; }
.dhf-submit-page > p:not(.dhf-account-kicker) { max-width: 650px; margin-bottom: 34px; color: var(--dhf-muted); line-height: 1.6; }
.dhf-submit-page form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; padding: clamp(24px, 5vw, 46px); border: 1px solid var(--dhf-line); border-radius: 18px; background: #fff; box-shadow: 0 20px 60px #00000012; }
.dhf-submit-page label { display: grid; gap: 8px; color: var(--dhf-ink); font-size: 12px; font-weight: 800; }
.dhf-submit-page input, .dhf-submit-page select, .dhf-submit-page textarea { width: 100%; padding: 13px; border: 1px solid #cbd6d7; border-radius: 9px; background: #fff; color: var(--dhf-ink); font: 16px Arial, sans-serif; }
.dhf-submit-wide { grid-column: 1 / -1; }
.dhf-submit-photo { padding: 18px; border: 1px dashed #afc2c5; border-radius: 12px; background: #f7faf9; }
.dhf-submit-photo > span { color: var(--dhf-muted); font-size: 12px; font-weight: 400; }
.dhf-submit-photo input[type="file"] { padding: 10px; background: #fff; cursor: pointer; }
.dhf-submit-photo img { width: min(100%, 520px); max-height: 340px; margin-top: 8px; border-radius: 11px; object-fit: cover; }
.dhf-submit-page button { padding: 15px 20px; border: 0; border-radius: 9px; background: var(--dhf-deep); color: #fff; font-weight: 800; cursor: pointer; }
.dhf-submit-status { margin: 0; color: var(--dhf-teal); font-weight: 700; }
.dhf-account-signed > p { color: var(--dhf-muted); }
.dhf-account-signed > div { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 28px 0; }
.dhf-account-signed > div span { display: grid; gap: 4px; padding: 18px; border-radius: 12px; background: #e8eeed; color: var(--dhf-muted); }
.dhf-account-signed > div strong { color: var(--dhf-ink); font: 30px Georgia, serif; }
.dhf-account-signed > button { padding: 11px 0; border: 0; background: transparent; color: var(--dhf-teal); font-weight: 800; cursor: pointer; }
.dhf-account-error { margin: 18px 0 0; padding: 12px 14px; border-radius: 8px; background: #f8e3df; color: #8b2e25; line-height: 1.4; }
body.dhf-modal-open { overflow: hidden; }
.dhf-account-page { padding: 70px 0 110px; }
.dhf-account-page > header { display: flex; align-items: end; justify-content: space-between; gap: 40px; padding-bottom: 48px; border-bottom: 1px solid var(--dhf-line); }
.dhf-account-page > header h1,
.dhf-account-locked h1 { margin: 5px 0 12px; font: clamp(46px, 6vw, 84px)/.95 Georgia, serif; letter-spacing: -.04em; }
.dhf-account-page > header > div > p:last-child { color: var(--dhf-muted); }
.dhf-account-summary { display: flex; gap: 12px; }
.dhf-account-summary span { min-width: 130px; padding: 18px 22px; border: 1px solid var(--dhf-line); border-radius: 14px; background: #fff; color: var(--dhf-muted); }
.dhf-account-summary strong { display: block; margin-bottom: 4px; color: var(--dhf-ink); font: 32px Georgia, serif; }
.dhf-account-page > section { padding-top: 64px; }
.dhf-account-section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.dhf-account-section-head p { margin: 0 0 7px; color: var(--dhf-teal); font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.dhf-account-section-head h2 { margin: 0; font: 38px Georgia, serif; }
.dhf-account-section-head > a { color: var(--dhf-teal); font-weight: 700; text-decoration: none; }
.dhf-account-favorite-grid { margin-top: 0; }
.dhf-account-searches { display: grid; gap: 10px; }
.dhf-account-search-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px; border: 1px solid var(--dhf-line); border-radius: 12px; background: #fff; }
.dhf-account-search-row a { display: flex; min-width: 0; flex: 1; align-items: center; justify-content: space-between; gap: 20px; color: var(--dhf-ink); text-decoration: none; }
.dhf-account-search-row a span { color: var(--dhf-teal); font-size: 13px; font-weight: 700; }
.dhf-account-search-row button { padding: 8px 12px; border: 0; background: transparent; color: #8b4038; font-weight: 700; cursor: pointer; }
.dhf-account-empty { padding: 28px; border: 1px dashed #bdcacc; border-radius: 12px; color: var(--dhf-muted); text-align: center; }
.dhf-account-locked { max-width: 760px; margin: 0 auto; padding-top: 120px; text-align: center; }
.dhf-account-locked > p:not(.dhf-account-kicker) { color: var(--dhf-muted); font-size: 17px; line-height: 1.6; }
.dhf-account-locked > button { margin-top: 18px; padding: 14px 24px; border: 0; border-radius: 999px; background: var(--dhf-deep); color: #fff; font-weight: 800; cursor: pointer; }
@media (max-width: 760px) {
  .dhf-account-page > header { align-items: start; flex-direction: column; }
  .dhf-account-summary { width: 100%; }
  .dhf-account-summary span { min-width: 0; flex: 1; }
  .dhf-account-section-head { align-items: start; flex-direction: column; }
  .dhf-account-search-row a { align-items: start; flex-direction: column; gap: 6px; }
  .dhf-submit-page form { grid-template-columns: 1fr; }
  .dhf-submit-wide { grid-column: 1; }
}
.dhf-hero {
  min-height: calc(100vh - 120px);
  padding-top: 105px;
}
.dhf-hero h1 {
  margin: 0 0 52px;
  font:
    normal clamp(58px, 8vw, 132px)/0.9 Georgia,
    serif;
  letter-spacing: -0.045em;
}
.dhf-hero h1 em {
  color: var(--dhf-teal);
  font-weight: 400;
}
.dhf-search {
  display: grid;
  grid-template-columns: 0.7fr 1fr 0.7fr 0.7fr 0.8fr 0.6fr 1fr auto;
  max-width: 1580px;
  margin-bottom: 92px;
  overflow: hidden;
  border: 1px solid var(--dhf-line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 20px 60px #00000018;
}
.dhf-field {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  padding: 15px 17px;
  border-right: 1px solid #e1e5e6;
}
.dhf-field > span {
  margin-bottom: 7px;
  color: #738188;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.dhf-field input,
.dhf-field select {
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--dhf-ink);
  font:
    600 14px Arial,
    sans-serif;
}
.dhf-field input::placeholder {
  color: #8b989d;
}
.dhf-search button {
  min-width: 190px;
  padding: 0 24px;
  border: 0;
  background: var(--dhf-deep);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}
.dhf-search button span {
  margin-left: 8px;
  font-size: 20px;
}
.dhf-search button:hover,
.dhf-view:hover {
  background: #21586a;
}
.dhf-results {
  padding: 28px 0 92px;
  border-top: 1px solid #ccd5d8;
}
.dhf-results-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}
.dhf-results-head p {
  margin: 0 0 7px;
  color: var(--dhf-teal);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.dhf-results-head h2 {
  margin: 0;
  font:
    normal 38px Georgia,
    serif;
}
.dhf-results-head > span {
  color: var(--dhf-muted);
  font-size: 13px;
}
.dreamhousefind-properties {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.dreamhousefind-property {
  display: flex;
  min-height: 370px;
  flex-direction: column;
  gap: 22px;
  padding: 24px;
  overflow: hidden;
  border: 1px solid var(--dhf-line);
  border-radius: 16px;
  background: #ffffffe0;
  box-shadow: 0 16px 45px #00000010;
}
.dhf-card-media {
  height: 220px;
  margin: -24px -24px 0;
  overflow: hidden;
  background: #dfe8e8;
}
.dhf-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}
.dreamhousefind-property:hover .dhf-card-media img {
  transform: scale(1.025);
}
.dhf-card-placeholder {
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #d8e7e5, #edf0e8);
  color: var(--dhf-teal);
}
.dhf-card-placeholder span {
  font: 76px Georgia, serif;
  opacity: 0.72;
}
.dhf-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #7a888d;
  font-size: 12px;
}
.dhf-status {
  padding: 6px 9px;
  border-radius: 999px;
  background: #dff2e6;
  color: #245b3b;
  font-size: 11px;
  font-weight: 700;
}
.dhf-location {
  margin: 0 0 8px;
  color: var(--dhf-teal);
  font-size: 13px;
  font-weight: 700;
}
.dreamhousefind-property h3 {
  margin: 0;
  font:
    normal 25px/1.2 Georgia,
    serif;
}
.dreamhousefind-property h3 a {
  color: inherit;
  text-decoration: none;
}
.dreamhousefind-property h3 a:hover {
  color: var(--dhf-teal);
}
.dhf-price {
  color: var(--dhf-deep);
  font:
    34px Georgia,
    serif;
}
.dreamhousefind-property dl {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 0;
}
.dreamhousefind-property dl div {
  padding-top: 12px;
  border-top: 1px solid #e1e5e6;
}
.dreamhousefind-property dt {
  margin-bottom: 5px;
  color: #7a888d;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.dreamhousefind-property dd {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
}
.dhf-view {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding: 13px 16px;
  border-radius: 10px;
  background: var(--dhf-deep);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
.dhf-message {
  padding: 24px;
  border: 1px solid var(--dhf-line);
  border-radius: 12px;
  background: #fff;
  color: #5c6d73;
}
.dhf-error {
  border-color: #eccaca;
  background: #fff2f2;
  color: #8a2f2f;
}
.dhf-load-more {
  display: flex;
  min-height: 110px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--dhf-muted);
  text-align: center;
}
.dhf-load-more p {
  margin: 0;
}
.dhf-load-more > span {
  width: 22px;
  height: 22px;
  border: 2px solid #cbd7d8;
  border-top-color: var(--dhf-teal);
  border-radius: 50%;
  animation: dhf-spin 0.8s linear infinite;
}
.dhf-load-more:not(.dhf-is-loading) > span {
  visibility: hidden;
}
.dhf-load-error {
  flex-direction: column;
}
.dhf-load-error button,
.dhf-load-more > button {
  padding: 10px 16px;
  border: 1px solid var(--dhf-deep);
  border-radius: 9px;
  background: transparent;
  color: var(--dhf-deep);
  cursor: pointer;
  font-weight: 700;
}
@keyframes dhf-spin {
  to { transform: rotate(360deg); }
}
.dhf-detail-page {
  min-height: calc(100vh - 120px);
  padding: 48px 0 90px;
}
.dhf-back {
  display: inline-flex;
  margin-bottom: 28px;
  color: var(--dhf-teal);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.dhf-property-detail {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.8fr);
  overflow: hidden;
  border: 1px solid var(--dhf-line);
  border-radius: 22px;
  background: #fffffff0;
  box-shadow: 0 24px 70px #00000014;
}
.dhf-detail-media {
  min-height: 590px;
  background: #dfe8e8;
}
.dhf-detail-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dhf-detail-placeholder {
  display: grid;
  height: 100%;
  place-items: center;
  background: linear-gradient(135deg, #d8e7e5, #edf0e8);
  color: var(--dhf-teal);
  font: 120px Georgia, serif;
}
.dhf-detail-content {
  display: flex;
  flex-direction: column;
  padding: clamp(34px, 5vw, 72px);
}
.dhf-detail-eyebrow {
  margin: 0 0 18px;
  color: var(--dhf-teal);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.dhf-detail-content h1 {
  margin: 0 0 14px;
  font: normal clamp(38px, 4vw, 62px)/1.02 Georgia, serif;
  letter-spacing: -0.035em;
}
.dhf-detail-location {
  margin: 0 0 34px;
  color: var(--dhf-muted);
  font-size: 15px;
}
.dhf-detail-price {
  margin: 0 0 32px;
  color: var(--dhf-deep);
  font: 40px Georgia, serif;
}
.dhf-detail-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 32px;
}
.dhf-detail-facts div {
  padding-top: 14px;
  border-top: 1px solid var(--dhf-line);
}
.dhf-detail-facts dt {
  margin-bottom: 7px;
  color: var(--dhf-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.dhf-detail-facts dd {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}
.dhf-detail-note {
  margin: auto 0 22px;
  color: var(--dhf-muted);
  font-size: 13px;
  line-height: 1.55;
}
.dhf-detail-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-radius: 11px;
  background: var(--dhf-deep);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}
.dhf-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 32px 0 45px;
  border-top: 1px solid #ccd5d8;
  color: var(--dhf-muted);
}
.dhf-footer strong {
  color: var(--dhf-ink);
}
@media (max-width: 1300px) {
  .dhf-search {
    grid-template-columns: repeat(4, 1fr);
  }
  .dhf-field {
    border-bottom: 1px solid #e1e5e6;
  }
  .dhf-search button {
    min-height: 68px;
  }
  .dreamhousefind-properties {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .dhf-app {
    padding: 0 20px;
  }
  .dhf-nav {
    height: 94px;
  }
  .dhf-brand img {
    width: 70px;
    height: 70px;
  }
  .dhf-brand strong {
    font-size: 21px;
  }
  .dhf-hero {
    padding-top: 55px;
  }
  .dhf-hero h1 {
    margin-bottom: 38px;
    font-size: clamp(50px, 17vw, 78px);
    letter-spacing: -0.055em;
  }
  .dhf-search {
    grid-template-columns: 1fr;
    margin-bottom: 65px;
  }
  .dhf-field {
    min-height: 65px;
    border-right: 0;
  }
  .dhf-search button {
    min-height: 68px;
    border-radius: 0;
  }
  .dhf-results-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .dhf-results-head h2 {
    font-size: 31px;
  }
  .dreamhousefind-properties {
    grid-template-columns: 1fr;
  }
  .dreamhousefind-property dl {
    grid-template-columns: repeat(3, 1fr);
  }
  .dhf-detail-page {
    padding-top: 28px;
  }
  .dhf-property-detail {
    grid-template-columns: 1fr;
  }
  .dhf-detail-media {
    min-height: 330px;
  }
  .dhf-detail-content {
    padding: 30px 24px;
  }
  .dhf-detail-content h1 {
    font-size: 38px;
  }
  .dhf-detail-facts {
    grid-template-columns: repeat(3, 1fr);
  }
  .dhf-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}
.dhf-renovation-badge {
    display: inline-flex;
    align-items: center;
    margin: 0 .4rem .45rem 0;
    padding: .35rem .65rem;
    border-radius: 999px;
    background: #fff0d6;
    color: #74420a;
    font-size: .75rem;
    font-weight: 700;
}

.dhf-detail-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin: .5rem 0;
}