/*
 * Coexistence layer for the approved static prototype and WordPress services.
 * Loaded after Hello Elementor and DatHousing Core: its purpose is
 * to keep service markup from changing the approved public composition.
 */
.dh-prototype-root {
  isolation: isolate;
}

/* Hello's generic header and form-control rules are valuable for Elementor
 * slots, but must not alter the approved prototype shell. These values mirror
 * the local source at the desktop baseline. */
.dh-prototype-root .site-header {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.dh-prototype-root .site-header .shell {
  width: min(100% - 48px, 1240px);
  max-width: none;
  height: 72px;
  margin-inline: auto;
}

/* ATP Mega Menu is rendered inside the local header slot. These declarations
 * preserve the prototype shell while allowing Elementor to own links, columns
 * and icon settings. The high menu layer stays above every sticky project bar. */
.dh-prototype-root .desktop-nav.dh-atp-menu-host {
  display: block;
  justify-self: center;
  min-width: 0;
}

/* Elementor's saved document adds its normal 1120px section wrapper. Inside
 * this already-sized header slot it must collapse to its content, otherwise
 * the visible navigation is offset outside the header. */
.dh-prototype-root .dh-atp-menu-host .elementor,
.dh-prototype-root .dh-atp-menu-host .elementor-section,
.dh-prototype-root .dh-atp-menu-host .elementor-container,
.dh-prototype-root .dh-atp-menu-host .elementor-column,
.dh-prototype-root .dh-atp-menu-host .elementor-widget,
.dh-prototype-root .dh-atp-menu-host .elementor-widget-container {
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dh-prototype-root .dh-atp-menu-host .elementor-section .elementor-container,
.dh-prototype-root .dh-atp-menu-host .elementor-column-wrap,
.dh-prototype-root .dh-atp-menu-host .elementor-widget-wrap {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-mmw,
.dh-prototype-root .dh-atp-menu-host #atp-mmw {
  position: relative !important;
  z-index: 12010 !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-menu-link {
  min-height: var(--header-h);
  padding-inline: clamp(10px, 1.2vw, 17px) !important;
  color: var(--navy-800, #25324b) !important;
  font-family: var(--body, "Source Sans 3", sans-serif) !important;
  font-size: .9rem !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-menu-link:hover,
.dh-prototype-root .dh-atp-menu-host .atp-menu-item:hover > .atp-menu-link {
  color: var(--gold-700, #94610a) !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-mega-dropdown {
  position: fixed !important;
  top: var(--header-h) !important;
  left: max(24px, calc((100vw - 1240px) / 2)) !important;
  right: auto !important;
  width: min(1240px, calc(100vw - 48px)) !important;
  max-height: min(620px, calc(100vh - var(--header-h) - 20px));
  overflow-y: auto;
  border: 1px solid var(--line, #d8dee8) !important;
  border-top: 3px solid var(--gold-600, #bd8209) !important;
  border-radius: 0 0 14px 14px !important;
  box-shadow: 0 28px 64px rgb(16 24 42 / .2) !important;
  transform: translateY(8px) !important;
  z-index: 12020 !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-menu-item:hover > .atp-mega-dropdown {
  transform: translateY(0) !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-col-title {
  color: var(--navy-950, #10182a) !important;
  font-family: var(--display, "Inter Tight", sans-serif) !important;
  text-transform: none !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-col-items li a {
  color: var(--ink-soft, #4d5a70) !important;
  font-family: var(--body, "Source Sans 3", sans-serif) !important;
}

.dh-prototype-root .dh-atp-menu-host .atp-col-items li a::before {
  border-left-color: var(--gold-600, #bd8209) !important;
}

@media (max-width: 900px) {
  .dh-prototype-root .header-inner .desktop-nav.dh-atp-menu-host {
    display: block !important;
    justify-self: end;
    grid-column: 2;
  }

  .dh-prototype-root .site-header .menu-button,
  .dh-prototype-root .site-header .mobile-menu {
    display: none !important;
  }

  .dh-prototype-root .dh-atp-menu-host .atp-mega-menu {
    position: static !important;
  }

  .dh-prototype-root .dh-atp-menu-host .atp-mobile-toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--line, #d8dee8) !important;
    border-radius: 9px;
    background: #fff !important;
  }

  .dh-prototype-root .dh-atp-menu-host .atp-menu-list.atp-menu-open {
    position: absolute !important;
    top: var(--header-h) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: calc(100vh - var(--header-h));
    padding: 10px 20px 24px;
    overflow-y: auto;
    border-top: 1px solid var(--line, #d8dee8);
    box-shadow: 0 24px 48px rgb(16 24 42 / .16) !important;
    z-index: 12020 !important;
  }

  .dh-prototype-root .dh-atp-menu-host .atp-menu-link {
    min-height: 48px;
    padding-inline: 4px !important;
  }

  .dh-prototype-root .dh-atp-menu-host .atp-mega-dropdown {
    position: static !important;
    width: auto !important;
    max-height: none;
    overflow: visible;
    border: 0 !important;
    border-left: 2px solid var(--gold-600, #bd8209) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }
}

.dh-prototype-root .transaction-tabs button {
  font-size: 16px;
  line-height: 26.88px;
}

.dh-prototype-root .property-search .search-field select {
  height: 17px;
  min-height: 0;
  padding: 0;
  font-size: 13.3333px;
}

/* Restore the source grid's inherited rhythm. Hello resets labels to 16px,
 * shrinking the first grid row and pulling every control up by 8px. */
.dh-prototype-root .property-search .search-field {
  line-height: 26.88px;
}

.dh-prototype-root .property-search .search-field > span:not(.select-wrap) {
  line-height: 19.992px;
}

/* FormLayer can safely be injected into an approved placement without its
 * generic controls inheriting a different visual language. */
.dh-prototype-root :is(.formlayer-form, .formlayer, [data-formlayer-form]) :is(input, select, textarea, button) {
  font: inherit;
}

.dh-prototype-root :is(.formlayer-form, .formlayer, [data-formlayer-form]) :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100%;
  border: 1px solid #cfd7e3;
  border-radius: 8px;
  background: #fff;
  color: #16213a;
}

.dh-prototype-root :is(.formlayer-form, .formlayer, [data-formlayer-form]) :is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 44px;
  padding: 9px 12px;
}

.dh-prototype-root :is(.formlayer-form, .formlayer, [data-formlayer-form]) textarea {
  min-height: 110px;
  padding: 12px;
  resize: vertical;
}

.dh-prototype-root [data-dh-bridge-status].is-error {
  color: #b42318;
}

.dh-prototype-root [data-dh-bridge-status].is-success {
  color: #16794b;
}

/* Empty by default. It only gains vertical space when an editor deliberately
 * assigns an Elementor template to the corresponding slot option. */
.dh-elementor-slot:empty {
  display: none;
}
.dh-project-detail-link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:10px 14px;border:1px solid rgba(255,255,255,.32);border-radius:8px;color:#fff!important;text-decoration:none;font-weight:700}.dh-project-detail-link:hover{background:rgba(255,255,255,.12)}