/*
 * Homepage search — approved desktop/adaptive direction.
 *
 * The filter always reads as three equal four-cell rows:
 * 1. Deal / segment / category / type
 * 2. City / price / area / features
 * 3. Bedrooms / bathrooms / keyword / search
 *
 * Mobile keeps its dedicated layout below 768px.
 */
@media (min-width: 768px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home {
        display: block !important;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid {
        min-width: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 16px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: stretch !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > * {
        order: 0 !important;
    }

    /* Older layout passes assigned explicit grid coordinates and wrappers.
       The shared grid owns the final desktop and tablet placement. */
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-market,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-filter-group {
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 64px !important;
        margin: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot > .artbin-service-native-search,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot > .houzez-ele-search-form-wrapper {
        display: contents !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-group-4b30271,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-type-submit {
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 64px !important;
        min-height: 64px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-search-submit-cell] {
        grid-column: auto !important;
        grid-row: auto !important;
        align-self: stretch !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 64px !important;
        min-height: 64px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-group-4b30271,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-type-submit {
        align-self: stretch !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-market > .artbin-service-chip {
        display: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 64px !important;
        min-height: 64px !important;
        margin: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control > summary {
        display: flex !important;
        align-items: center !important;
        gap: 11px !important;
        width: 100% !important;
        height: 64px !important;
        min-height: 64px !important;
        margin: 0 !important;
        padding: 0 18px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        border: 1px solid rgba(192, 210, 225, .36) !important;
        border-radius: 12px !important;
        background: rgba(6, 31, 53, .84) !important;
        color: #ffffff !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
        cursor: pointer !important;
        list-style: none !important;
        transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > summary::-webkit-details-marker,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control > summary::-webkit-details-marker,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control > summary::-webkit-details-marker {
        display: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > summary > [data-artbin-market-label],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control > summary [data-artbin-selection-label],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control > summary .artbin-service-catalog-selector-label {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        overflow: hidden !important;
        color: #ffffff !important;
        font-size: clamp(12px, 1.05vw, 15px) !important;
        font-weight: 750 !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* The chosen direction keeps the main label in each equal cell clean;
       active values are retained in the selected-filter rail below. */
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-catalog-selector-values {
        display: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-caret {
        flex: 0 0 auto !important;
        margin-left: auto !important;
        color: var(--artbin-filter-gold, #f4b51b) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control.is-active > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control[open] > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector.has-selection > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-catalog-selector.has-selection > summary {
        border-color: var(--artbin-filter-gold, #f4b51b) !important;
        background: rgba(12, 43, 70, .98) !important;
        color: #ffffff !important;
        box-shadow: 0 10px 24px rgba(3, 16, 29, .20) !important;
        outline: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot input[name="keyword"],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-type-submit .houzez-search-button {
        width: 100% !important;
        height: 64px !important;
        min-height: 64px !important;
        margin: 0 !important;
        border-radius: 12px !important;
        box-sizing: border-box !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell] input[name="keyword"],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-search-submit-cell] .houzez-search-button {
        width: 100% !important;
        height: 64px !important;
        min-height: 64px !important;
        margin: 0 !important;
        border-radius: 12px !important;
        box-sizing: border-box !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot input[name="keyword"] {
        padding: 0 18px !important;
        border: 1px solid rgba(192, 210, 225, .36) !important;
        background: rgba(6, 31, 53, .84) !important;
        color: #ffffff !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
        font-size: clamp(12px, 1.05vw, 15px) !important;
        font-weight: 650 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell] input[name="keyword"] {
        padding: 0 18px !important;
        /* The address / ID input has a distinct purpose, while keeping the
           exact same box dimensions as every other control. */
        border: 1px solid var(--artbin-filter-gold, #f4b51b) !important;
        background: rgba(6, 31, 53, .84) !important;
        color: #ffffff !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 0 0 1px rgba(244, 181, 27, .08) !important;
        font-size: clamp(12px, 1.05vw, 15px) !important;
        font-weight: 650 !important;
    }

    /* The placeholder is the field label in the approved compact layout. */
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell] > .elementor-field-label {
        display: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot input[name="keyword"]::placeholder {
        color: rgba(255, 255, 255, .78) !important;
        opacity: 1 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell] input[name="keyword"]::placeholder {
        color: rgba(255, 255, 255, .78) !important;
        opacity: 1 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-type-submit .houzez-search-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        padding: 0 18px !important;
        border: 1px solid var(--artbin-filter-gold, #f4b51b) !important;
        background: var(--artbin-filter-gold, #f4b51b) !important;
        color: #10233a !important;
        box-shadow: 0 10px 22px rgba(244, 181, 27, .23) !important;
        font-size: clamp(12px, 1.05vw, 15px) !important;
        font-weight: 900 !important;
        letter-spacing: .015em !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-search-submit-cell] .houzez-search-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        padding: 0 18px !important;
        border: 1px solid var(--artbin-filter-gold, #f4b51b) !important;
        background: var(--artbin-filter-gold, #f4b51b) !important;
        color: #10233a !important;
        box-shadow: 0 10px 22px rgba(244, 181, 27, .23) !important;
        font-size: clamp(12px, 1.05vw, 15px) !important;
        font-weight: 900 !important;
        letter-spacing: .015em !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary {
        width: 100% !important;
        margin: 18px 0 0 !important;
        padding: 15px 0 0 !important;
        border-top: 1px solid rgba(192, 210, 225, .24) !important;
        border-bottom: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary.is-visible {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary-label {
        flex: 0 0 auto !important;
        color: #ffffff !important;
        font-size: 12px !important;
        font-weight: 800 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary .artbin-service-selection-chip {
        min-height: 32px !important;
        padding: 6px 10px !important;
        border: 1px solid rgba(244, 181, 27, .70) !important;
        border-radius: 7px !important;
        background: rgba(244, 181, 27, .10) !important;
        color: #ffffff !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary .artbin-service-selection-chip-mark {
        color: var(--artbin-filter-gold, #f4b51b) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1099.98px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid {
        gap: 12px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-market,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-filter-group,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-group-4b30271,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-type-submit,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot input[name="keyword"],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-search-slot .elementor-field-type-submit .houzez-search-button {
        height: 56px !important;
        min-height: 56px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-search-submit-cell],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-keyword-cell] input[name="keyword"],
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > [data-artbin-search-submit-cell] .houzez-search-button {
        height: 56px !important;
        min-height: 56px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid > .artbin-service-control > summary,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-group > .artbin-service-control > summary {
        padding: 0 14px !important;
    }
}

/*
 * Keep the featured-properties heading visually separate from the homepage
 * finder at desktop and adaptive widths. The finder itself stays in place;
 * this only reserves the approved 20px of breathing room below it.
 */
@media (min-width: 768px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home {
        margin-bottom: 20px !important;
    }
}

/* Wide desktop: the four bedroom/bathroom choices are short enough to read
 * as one decision row. "More cities" expands the current list once; closing
 * the City disclosure restores the compact state through artbin-search.js. */
@media (min-width: 1200px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="bedrooms"] .artbin-service-range-presets,
    html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="bathrooms"] .artbin-service-range-presets {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="city"].is-expanded .artbin-service-city-more {
        display: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector [data-artbin-market-label] {
        text-transform: none !important;
    }
}

/*
 * Compact desktop / tablet hero.  At these widths Elementor's inner content
 * rail was capped well before the hero panel, leaving a large unused area on
 * the right and making the finder look narrower than its heading.  Keep the
 * heading and the filter on one shared rail; full desktop and mobile retain
 * their separate compositions.
 */
@media (min-width: 768px) and (max-width: 2047.98px) {
    html body.artbin-home-gold-search-active .elementor-element.elementor-element-9c7f74e,
    html body.artbin-home-gold-search-active .elementor-element.elementor-element-d2422a0,
    html body.artbin-home-gold-search-active .elementor-element.elementor-element-07dddbe {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: 0 0 100% !important;
        align-self: stretch !important;
        margin-inline: 0 !important;
        box-sizing: border-box !important;
    }

    html body.artbin-home-gold-search-active .elementor-element.elementor-element-d2422a0 .elementor-heading-title {
        max-width: none !important;
        font-size: clamp(36px, 3.35vw, 52px) !important;
        line-height: 1.12 !important;
        letter-spacing: -0.025em !important;
    }

    html body.artbin-home-gold-search-active .elementor-element.elementor-element-07dddbe,
    html body.artbin-home-gold-search-active .elementor-element.elementor-element-07dddbe .houzez-search-builder-wrapper,
    html body.artbin-home-gold-search-active .elementor-element.elementor-element-07dddbe .artbin-service-filter--home,
    html body.artbin-home-gold-search-active .elementor-element.elementor-element-07dddbe .artbin-service-filter-grid {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin-inline: 0 !important;
        box-sizing: border-box !important;
    }
}

/*
 * The wide adaptive hero deliberately lets the finder card straddle its lower
 * edge.  A fixed 145px reserve was no longer enough once the localised title
 * and three-row filter grew, so the following heading could sit underneath the
 * finder.  Reserve space for the actual overlap and align that heading with
 * the same horizontal rhythm as the finder rail.
 */
@media (min-width: 1200px) and (max-width: 2047.98px) {
    html body.artbin-home-gold-search-active:is(.page-id-2521, .page-id-30781, .page-id-30782) .elementor-element-b9dae63 {
        margin-bottom: clamp(240px, 16vw, 280px) !important;
    }

    html body.artbin-home-gold-search-active:is(.page-id-2521, .page-id-30781, .page-id-30782) .elementor-element-4f43f80 > .e-con-inner {
        padding-inline: max(72px, calc((100vw - 1680px) / 2)) !important;
        box-sizing: border-box !important;
    }
}
