/*
Theme Name: Houzez Child
Theme URI: http://www.favethemes.com/
Author: Favethemes
Author URI: http://www.favethemes.com/
Description: Houzez is a premium WordPress theme for real estate agents where modern aesthetics are combined with tasteful simplicity, and where the ease of use is achieved without compromise in your ability to customise the design. Whether you are a real estate agent looking to build a website for your company or a web developer seeking a perfect WordPress theme for your next project, you are certain to appreciate the numerous features and benefits that our theme provides.
Version: 1.0.6
Tags: white, right-sidebar, left-sidebar, custom-colors, custom-menu, featured-images, post-formats, theme-options, translation-ready
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: houzez
Template: houzez
*/


/* Parent theme CSS is enqueued by Houzez via register-scripts.php — no @import needed. */

/* Your CSS code goes here
-------------------------------------- */

/* ==================================================================
   PILBE FIX: Houzez listing lightbox scroll-block
   The parent theme renders #houzez-listing-lightbox as display:block
   with visibility:hidden / opacity:0.  Because pointer-events default
   to 'auto', the invisible overlay captures every scroll & click event.
   Disable pointer-events while hidden; re-enable when Bootstrap adds
   .show (i.e. the modal is actually open).
   ================================================================== */
#houzez-listing-lightbox:not(.show) {
    pointer-events: none !important;
}
@media (max-width: 767px) {
    .nav-mobile .nav-item {
        flex: 1 1 25%;
    }
    #mobile-sort-by-modal .modal-body {
        padding: 1rem;
    }
    #mobile-sort-by-modal .sort-by-item {
        border-bottom: 1px solid #e5e5e5;
        color: #333;
        text-decoration: none;
    }
    #mobile-sort-by-modal .sort-by-item:last-child {
        border-bottom: none;
    }
    .sort-by {
        display: none !important;
    }
}

/* autocomplete style
*/
.auto-complete {
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    overflow: hidden;
    transition: all 0.3s ease;
}

.auto-complete .list-group {
    margin-bottom: 0;
}

.auto-complete .list-group-item {
    border: none;
    border-bottom: 1px solid #f0f0f0;
    padding: 12px 15px;
    transition: background-color 0.2s ease;
}

.auto-complete .list-group-item:last-child {
    border-bottom: none;
}

.auto-complete .list-group-item:hover {
    background-color: #f8f9fa;
}

.auto-complete .list-group-item a {
    color: #333;
    text-decoration: none;
    display: block;
}

.auto-complete .list-group-item .auto-complete-title {
    font-weight: 600;
    margin-bottom: 3px;
}

.auto-complete .list-group-item .auto-complete-desc {
    font-size: 0.9em;
    color: #666;
}

.auto-complete:hover {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15), 0 2px 4px rgba(0, 0, 0, 0.12);
}

/* ==================================================================
   PILBE UNIFIED CITY / POSTCODE SEARCH
   ================================================================== */

/* Field wrapper */
.pilbe-unified-wrap {
    position: relative;
}

/* Force-hide the original Select2 city dropdowns when our field is active.
   Uses general sibling combinator — if .pilbe-unified-wrap is a sibling of
   any .select2 or select[id^="selectCity"], the originals get hidden. */
.pilbe-unified-wrap ~ .select2,
.pilbe-unified-wrap ~ select[id^="selectCity"],
.pilbe-unified-wrap ~ .select2-container,
.select2 ~ .pilbe-unified-wrap ~ .select2,
/* Also handle the reverse DOM order */
select[id^="selectCity"] ~ .select2:has(~ .pilbe-unified-wrap) {
    display: none !important;
}
/* Parent-level approach for Select2 containers rendered as first children */
*:has(> .pilbe-unified-wrap) > .select2,
*:has(> .pilbe-unified-wrap) > .select2-container,
*:has(> .pilbe-unified-wrap) > select[id^="selectCity"] {
    display: none !important;
}

.pilbe-unified-input-wrap {
    position: relative;
}

/* Match Houzez form-control sizing */
.pilbe-unified-input {
    height: 45px;
    font-size: 14px;
    padding-right: 32px;
}

/* Clear button (×) */
.pilbe-unified-clear {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    font-size: 18px;
    color: #999;
    cursor: pointer;
    line-height: 1;
    padding: 2px 6px;
    z-index: 2;
}
.pilbe-unified-clear:hover {
    color: #333;
}

/* Autocomplete dropdown */
.pilbe-postcode-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1060;
    display: none;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-top: 2px;
}

.pilbe-postcode-dropdown .list-group {
    margin-bottom: 0;
}

.pilbe-postcode-dropdown .list-group-item {
    border: none;
    border-bottom: 1px solid #f0f0f0;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    transition: background-color 0.15s ease;
}

.pilbe-postcode-dropdown .list-group-item.pilbe-no-result {
    cursor: default;
    color: #999;
    font-style: italic;
}

.pilbe-postcode-dropdown .list-group-item:last-child {
    border-bottom: none;
}

.pilbe-postcode-dropdown .list-group-item:hover,
.pilbe-postcode-dropdown .list-group-item.pilbe-active {
    background-color: #f8f9fa;
}
.pilbe-postcode-dropdown .list-group-item.pilbe-no-result:hover {
    background-color: #fff;
}

/* Badge for taxonomy type (City / Area / State) */
.pilbe-badge {
    font-size: 11px;
    color: #999;
    white-space: nowrap;
}

/* Validation error */
.pilbe-postcode-error {
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
}

/* Hidden helper */
.pilbe-hidden {
    display: none !important;
}

/* When keyword field is replaced by our unified input */
.pilbe-keyword-replaced::before {
    display: none !important; /* hide the default search magnifying-glass icon */
}
.pilbe-keyword-replaced .pilbe-unified-wrap {
    width: 100%;
}
.pilbe-keyword-replaced .pilbe-unified-input {
    height: 40px;
    border-radius: 6px;
}

/* Desktop search bar: make dropdown visible and well-positioned */
.advanced-search .pilbe-postcode-dropdown {
    z-index: 1060;
    max-height: 300px;
    overflow-y: auto;
}

/* Match Property Type select to City/Postcode input height */
.pilbe-search__popup-content select,
.pilbe-search__popup-content select.pilbe-search__popup-property {
    height: 45px;
    font-size: 14px;
    border-radius: 6px;
    padding: 8px 12px;
    box-sizing: border-box;
}

/* Mobile responsive */
@media (max-width: 767px) {
    /* Ensure inputs are visible and full-width */
    .pilbe-unified-wrap {
        width: 100%;
    }
    .pilbe-unified-input {
        width: 100%;
        height: 45px;
        font-size: 16px; /* prevents iOS zoom on focus */
    }

    /* Dropdown: open below, not clipped by popup container */
    .pilbe-postcode-dropdown {
        z-index: 1080;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        max-height: 220px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        margin-top: 2px;
        border-radius: 8px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    }

    /* Ensure popup container doesn't clip the dropdown */
    .pilbe-search__popup-content-container,
    .pilbe-search__popup-content-container--active,
    .pilbe-search__popup-content,
    [class*="pilbe-search__popup"] {
        overflow: visible !important;
    }

    /* Touch-friendly suggestion items */
    .pilbe-postcode-dropdown .list-group-item {
        padding: 14px 15px;
        font-size: 15px;
    }

    /* Property Type also full-width */
    .pilbe-search__popup-content select {
        width: 100%;
    }

    /* Badge text on small screens */
    .pilbe-badge {
        font-size: 10px;
    }
}



/* ==================================================================
   PILBE HOMEPAGE ENHANCEMENTS
   ================================================================== */

/* ── P5: Hero Subheadline ─────────────────────────────────────── */
.pilbe-custom-hero-sub {
    color: rgba(255, 255, 255, 0.9);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    margin-top: 12px;
    max-width: 620px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}



/* ── P4: App Download Section ─────────────────────────────────── */
.pilbe-custom-app-section {
    background: #ffffff;
    padding: 70px 20px;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
}
.pilbe-custom-app-inner {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 60px;
}
.pilbe-custom-app-text {
    flex: 1;
}
.pilbe-custom-app-headline {
    font-size: 32px;
    font-weight: 800;
    color: #1a1a2e;
    margin: 0 0 14px;
    line-height: 1.2;
}
.pilbe-custom-app-desc {
    font-size: 17px;
    color: #555;
    line-height: 1.6;
    margin: 0 0 28px;
}
.pilbe-custom-app-buttons {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.pilbe-custom-app-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    border-radius: 12px;
    text-decoration: none;
    color: #fff;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.pilbe-custom-app-badge span {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}
.pilbe-custom-app-badge small {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.85;
}
.pilbe-custom-app-badge strong {
    font-size: 16px;
    font-weight: 700;
}
.pilbe-custom-app-badge--play {
    background: #1a1a2e;
}
.pilbe-custom-app-badge--play:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    color: #fff;
    text-decoration: none;
}
.pilbe-custom-app-badge--apple {
    background: #1a1a2e;
}
.pilbe-custom-app-badge--apple:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    color: #fff;
    text-decoration: none;
}
.pilbe-custom-app-icon {
    flex-shrink: 0;
}
.pilbe-custom-app-icon img {
    width: 200px;
    height: 200px;
    border-radius: 28px;
    box-shadow: 0 8px 30px rgba(0, 77, 229, 0.15);
}

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 767px) {

    /* Hero sub */
    .pilbe-custom-hero-sub {
        font-size: 15px;
        padding: 0 10px;
    }

    /* App section: stacked */
    .pilbe-custom-app-section {
        padding: 48px 16px;
    }
    .pilbe-custom-app-inner {
        flex-direction: column;
        text-align: center;
        gap: 32px;
    }
    .pilbe-custom-app-headline {
        font-size: 24px;
    }
    .pilbe-custom-app-desc {
        font-size: 15px;
    }
    .pilbe-custom-app-buttons {
        justify-content: center;
    }
    .pilbe-custom-app-icon img {
        width: 140px;
        height: 140px;
        border-radius: 24px;
    }
}

/* ── P6: "Pilbe is different" section ─────────────────────────── */
.pilbe-why-diff {
    --pwd-bg: var(--pilbe-neutral-50, #F9FAFB);
    --pwd-card-bg: var(--pilbe-neutral-0, #FFFFFF);
    --pwd-border: var(--pilbe-neutral-200, #E8ECF1);
    --pwd-text: var(--pilbe-neutral-900, #1A1D26);
    --pwd-muted: var(--pilbe-neutral-500, #6B7280);
    --pwd-grad-start: #3F65F3;
    --pwd-grad-end:   #5D40DD;
    --pwd-icon-bg: var(--pilbe-neutral-900, #1A1D26);

    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    padding: 110px 20px;
    background:
        radial-gradient(1200px 500px at 100% 0%, rgba(63, 101, 243, 0.07), transparent 60%),
        radial-gradient(900px 400px at 0% 100%, rgba(93, 64, 221, 0.06), transparent 60%),
        var(--pwd-bg);
    font-family: var(--pilbe-font, 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
}

/* ── Decorative blurred glows ─────────────────────────────────── */
.pilbe-why-diff__glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.55;
    pointer-events: none;
    z-index: 0;
}
.pilbe-why-diff__glow--a {
    width: 420px; height: 420px;
    top: -140px; right: -120px;
    background: radial-gradient(circle, rgba(63, 101, 243, 0.35), transparent 70%);
}
.pilbe-why-diff__glow--b {
    width: 360px; height: 360px;
    bottom: -120px; left: -100px;
    background: radial-gradient(circle, rgba(93, 64, 221, 0.28), transparent 70%);
}

.pilbe-why-diff__inner {
    position: relative;
    z-index: 1;
    max-width: 1180px;
    margin: 0 auto;
}

/* ── Header (centered) ───────────────────────────────────────── */
.pilbe-why-diff__head {
    max-width: 720px;
    margin: 0 auto 72px;
    text-align: center;
}
.pilbe-why-diff__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px 6px 10px;
    background: linear-gradient(135deg, rgba(63, 101, 243, 0.1) 0%, rgba(93, 64, 221, 0.1) 100%);
    border: 1px solid rgba(93, 64, 221, 0.18);
    color: #3F3ACF;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin: 0 auto 22px;
}
.pilbe-why-diff__eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3F65F3 0%, #5D40DD 100%);
    box-shadow: 0 0 0 4px rgba(93, 64, 221, 0.18);
    animation: pwd-dot-pulse 2.2s ease-in-out infinite;
}
@keyframes pwd-dot-pulse {
    0%, 100% { box-shadow: 0 0 0 4px rgba(93, 64, 221, 0.18); }
    50%      { box-shadow: 0 0 0 7px rgba(93, 64, 221, 0.04); }
}

.pilbe-why-diff__title {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px 16px;
    font-size: clamp(32px, 4.2vw, 48px);
    line-height: 1.08;
    font-weight: 400;
    color: var(--pwd-text);
    margin: 0 0 20px;
    letter-spacing: -0.8px;
}
.pilbe-why-diff__title-line {
    display: inline-flex;
    align-items: baseline;
    gap: 10px;
}
.pilbe-why-diff__title-accent {
    font-weight: 800;
    background: linear-gradient(135deg, #3F65F3 0%, #5D40DD 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.pilbe-why-diff__logo {
    display: inline-block;
    width: clamp(38px, 4vw, 48px);
    height: auto;
    flex-shrink: 0;
    transform-origin: 50% 65%;
    animation: pwd-logo-float 3.2s ease-in-out infinite;
    filter: drop-shadow(0 4px 14px rgba(93, 64, 221, 0.28));
}
@keyframes pwd-logo-float {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50%      { transform: translateY(-4px) rotate(-2deg); }
}

.pilbe-why-diff__sub {
    font-size: clamp(16px, 1.25vw, 18px);
    line-height: 1.6;
    color: var(--pwd-muted);
    margin: 0 auto;
    max-width: 600px;
}

/* ── Grid + cards ────────────────────────────────────────────── */
.pilbe-why-diff__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.pilbe-why-diff__card {
    position: relative;
    padding: 36px;
    background: var(--pwd-card-bg);
    border: 1px solid var(--pwd-border);
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
    transition:
        transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.25s ease;
    overflow: hidden;
    isolation: isolate;
}
.pilbe-why-diff__card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, var(--pwd-grad-start), var(--pwd-grad-end));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 1;
}
.pilbe-why-diff__card:hover {
    transform: translateY(-4px);
    box-shadow:
        0 20px 40px -20px rgba(15, 23, 42, 0.18),
        0 8px 20px -12px rgba(93, 64, 221, 0.28);
    border-color: transparent;
}
.pilbe-why-diff__card:hover::before {
    opacity: 1;
}

.pilbe-why-diff__icon {
    position: relative;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--pwd-icon-bg);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), background 0.35s ease;
    overflow: hidden;
}
.pilbe-why-diff__icon::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--pwd-grad-start) 0%, var(--pwd-grad-end) 100%);
    opacity: 0;
    transition: opacity 0.35s ease;
    z-index: 0;
}
.pilbe-why-diff__icon svg {
    position: relative;
    z-index: 1;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.pilbe-why-diff__card:hover .pilbe-why-diff__icon {
    transform: scale(1.08) rotate(-3deg);
}
.pilbe-why-diff__card:hover .pilbe-why-diff__icon::after {
    opacity: 1;
}
.pilbe-why-diff__card:hover .pilbe-why-diff__icon svg {
    transform: scale(1.1);
}

.pilbe-why-diff__card-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--pwd-text);
    margin: 0 0 10px;
    letter-spacing: -0.2px;
}
.pilbe-why-diff__card-copy {
    font-size: 15px;
    line-height: 1.65;
    color: var(--pwd-muted);
    margin: 0;
}

/* ── Scroll-reveal animation ─────────────────────────────────── */
.pilbe-why-diff [data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--reveal-delay, 0ms);
    will-change: opacity, transform;
}
.pilbe-why-diff [data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 900px) {
    .pilbe-why-diff {
        padding: 72px 18px;
    }
    .pilbe-why-diff__head {
        margin-bottom: 48px;
    }
    .pilbe-why-diff__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .pilbe-why-diff__card {
        padding: 28px;
    }
    .pilbe-why-diff__icon {
        width: 48px;
        height: 48px;
        margin-bottom: 18px;
    }
    .pilbe-why-diff__card-title {
        font-size: 18px;
    }
    .pilbe-why-diff__glow--a,
    .pilbe-why-diff__glow--b {
        width: 260px;
        height: 260px;
        filter: blur(60px);
    }
}

/* ── Reduced motion ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .pilbe-why-diff [data-reveal] {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .pilbe-why-diff__heart,
    .pilbe-why-diff__eyebrow-dot {
        animation: none;
    }
    .pilbe-why-diff__card,
    .pilbe-why-diff__icon,
    .pilbe-why-diff__icon svg {
        transition: none;
    }
    .pilbe-why-diff__card:hover {
        transform: none;
    }
    .pilbe-why-diff__card:hover .pilbe-why-diff__icon {
        transform: none;
    }
}

/* ==================================================================
   FIX FOR ACCOUNT BUTTON VISIBILITY & POSITIONING (ALL DEVICES)
   ================================================================== */
/* Desktop: push to the right, next to the hamburger */
.elementor-element.elementor-element-2f39e6b9.navbar-pilbe__button-account {
    display: flex !important;
    order: 90 !important;
    margin-left: auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    flex: 0 0 24px !important;
}

/* The hamburger should stay at the very end */
.elementor-element.elementor-element-969b8b5.navbar-pilbe__button-humberger {
    order: 100 !important;
    margin-left: 0 !important;
}

/* Apply a robust inline SVG data URI (Pilbe brand blue #004274 to match hamburger) */
.elementor-element.elementor-element-2f39e6b9.navbar-pilbe__button-account .elementor-button {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    padding: 0 !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23004274'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z'/%3E%3C/svg%3E") !important;
    background-size: 24px 24px !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Force the existing SVG icon to match hamburger color (fallback) */
.elementor-element.elementor-element-2f39e6b9.navbar-pilbe__button-account .elementor-button-icon svg {
    fill: #004274 !important;
    width: 24px !important;
    height: 24px !important;
}
.elementor-element.elementor-element-2f39e6b9.navbar-pilbe__button-account .elementor-button-icon svg path {
    fill: #004274 !important;
}

/* Mobile: move the account button to the LEFT side */
@media (max-width: 767px) {
    .elementor-element.elementor-element-2f39e6b9.navbar-pilbe__button-account {
        order: -1 !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }
}

/* Hide the secondary desktop-only button (4d937e0b) globally to prevent duplicates */
.elementor-element.elementor-element-4d937e0b.navbar-pilbe__button-account {
    display: none !important;
}

/* ==================================================================
   PILBE HOMEPAGE SPACING FIXES
   Uses .elementor-22097 prefix to beat Elementor's generated CSS specificity.
   Overrides both regular padding AND CSS custom properties (--padding-*)
   that Elementor containers rely on.
   ================================================================== */

/* ── Global: tighten ALL parent containers ── */
.elementor-22097 .e-con.e-parent {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
    --padding-top: 30px !important;
    --padding-bottom: 30px !important;
}

/* ── Global: tighten ALL child containers ── */
.elementor-22097 .e-con.e-child {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    --padding-top: 10px !important;
    --padding-bottom: 10px !important;
}

/* ── Kill or cap ALL spacer widgets ── */
.elementor-22097 .elementor-widget-spacer {
    max-height: 20px !important;
    overflow: hidden !important;
}
.elementor-22097 .elementor-widget-spacer .elementor-spacer-inner {
    height: 20px !important;
    max-height: 20px !important;
}

/* ── Tighten heading widget margins ── */
.elementor-22097 .elementor-widget-heading {
    margin-bottom: 10px !important;
    margin-top: 0 !important;
}

/* ── Tighten text-editor widget margins ── */
.elementor-22097 .elementor-widget-text-editor {
    margin-bottom: 10px !important;
}

/* ── Reduce inner padding on feature cards ── */
.elementor-22097 .elementor-icon-box-wrapper {
    padding: 15px !important;
}

/* ── Tighten image-box widget spacing ── */
.elementor-22097 .elementor-widget-image-box {
    margin-bottom: 10px !important;
}

/* ── Collapse gap on container-inner wrappers ── */
.elementor-22097 .e-con-inner {
    gap: 10px !important;
}

/* ── Section-specific: Search bar → tight vertical ── */
.elementor-22097 .elementor-element.elementor-element-513e022b {
    min-height: 58px;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    --padding-top: 10px !important;
    --padding-bottom: 10px !important;
}

/* ── Section-specific: Features / heading → tight ── */
.elementor-22097 .elementor-element.elementor-element-849e416 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    --padding-top: 20px !important;
    --padding-bottom: 20px !important;
}

/* ── Section-specific: Savings Calculator → tight ── */
.elementor-22097 .elementor-element.elementor-element-2cd3369 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
    --padding-top: 30px !important;
    --padding-bottom: 30px !important;
}

/* ── Section-specific: AI Intelligence ── */
.elementor-22097 .elementor-element.elementor-element-8cf2088 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
    --padding-top: 30px !important;
    --padding-bottom: 30px !important;
}

/* ── Section-specific: Home Valuation CTA — had --margin-top:100px! ── */
.elementor-22097 .elementor-element.elementor-element-e23194e {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
    margin-top: 30px !important;
    --padding-top: 30px !important;
    --padding-bottom: 30px !important;
    --margin-top: 30px !important;
    --margin-bottom: 0px !important;
}

/* ── Home Valuation inner card — had --padding:100px on all sides! ── */
.elementor-22097 .elementor-element.elementor-element-427f47e8 {
    padding: 40px !important;
    --padding-top: 40px !important;
    --padding-bottom: 40px !important;
    --padding-left: 40px !important;
    --padding-right: 40px !important;
}

/* ── Also target legacy section selectors just in case ── */
.elementor-22097 .elementor-section {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

/* ── Mobile: even tighter ── */
@media (max-width: 767px) {
    .elementor-22097 .e-con.e-parent {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
        --padding-top: 20px !important;
        --padding-bottom: 20px !important;
    }
    .elementor-22097 .e-con.e-child {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
        --padding-top: 8px !important;
        --padding-bottom: 8px !important;
    }
    .elementor-22097 .elementor-widget-spacer,
    .elementor-22097 .elementor-widget-spacer .elementor-spacer-inner {
        max-height: 10px !important;
        height: 10px !important;
    }
    .elementor-22097 .e-con-inner {
        gap: 8px !important;
    }
    .elementor-22097 .elementor-element.elementor-element-427f47e8 {
        padding: 20px !important;
        --padding-top: 20px !important;
        --padding-bottom: 20px !important;
        --padding-left: 20px !important;
        --padding-right: 20px !important;
    }
}

/* =====================================================
   PILBE INSIGHTS TAB — Popup
   ===================================================== */

/* Insights panel inside popup */
.pilbe-search__insights-panel {
    padding: 20px 0 8px;
}

.pilbe-insights-label {
    font-size: 0.9rem;
    color: #5a6a85;
    margin-bottom: 14px;
    line-height: 1.5;
}

.pilbe-insights-input-wrap {
    position: relative;
}

.pilbe-insights-postcode-input {
    height: 52px;
    border-radius: 10px;
    border: 1px solid #E8ECF1;
    padding: 0 16px;
    font-size: 1rem;
    width: 100%;
    background: #F5F7FA;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: border-color 0.2s;
}

.pilbe-insights-postcode-input:focus {
    border-color: #3F65F3;
    outline: none;
    background: #fff;
}

.pilbe-insights-error {
    color: #e53e3e;
    font-size: 0.8rem;
    margin-top: 6px;
}

/* Popup nav — accommodate 3 tabs */
.pilbe-search__popup-nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
}

.pilbe-search__popup-nav .pilbe-search__popup-nav-item {
    flex: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    padding: 16px 12px !important;
}

@media (max-width: 575px) {
    .pilbe-search__popup-nav .pilbe-search__popup-nav-item {
        font-size: 12px !important;
        padding: 12px 8px !important;
    }
    .pilbe-search__popup-menu-label {
        font-size: 10px !important;
        padding: 1px 5px !important;
    }
}

/* =====================================================
   PILBE INSIGHTS TAB — Hero inline bar
   ===================================================== */

/* Ensure hero tabs (Rent, Sale, Insights) fit properly and don't squeeze/wrap */
.pilbe-search__tab-menu {
    max-width: 380px !important; /* Increase max-width to allow room for 3 tabs */
    flex-wrap: nowrap !important;
}

.pilbe-search__tab-menu-item {
    flex: 1 1 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    padding: 12px 10px !important;
}

@media (max-width: 575px) {
    .pilbe-search__tab-menu-item {
        font-size: 14px !important;
        padding: 12px 4px !important;
    }
}

.pilbe-hero-insights-form {
    width: 100%;
}

.pilbe-hero-insights-row {
    display: flex;
    flex-direction: row;
    gap: 16px;
    align-items: center;
}

.pilbe-hero-insights-input {
    flex: 1;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.pilbe-hero-insights-go {
    flex-shrink: 0;
    min-width: 120px;
}

#tabInsights {
    animation: pilbeFadeIn 0.3s ease;
}

#pilbeHeroInsightsError {
    margin-top: 8px;
}

@keyframes pilbeFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ==================================================================
   SCHEDULE A TOUR — FOUC Prevention
   The Slick date slider inside the sidebar tour form initialises on
   window.load, which can be very late when images are heavy.
   Without these rules the raw date <div>s flash as a vertical list
   before Slick converts them into a horizontal carousel.
   ================================================================== */

/* 1. Keep the parent wrapper at a fixed height with overflow hidden
      so the vertical list of dates never bleeds into view. */
.property-schedule-tour-day-form {
    max-height: 100px;
    overflow: hidden;
}

/* 2. The slide wrapper already has .houzez-all-slider-wrap which sets
      opacity:0; visibility:hidden via the parent theme. Reinforce it
      here so no specificity conflict can break it, and add overflow
      hidden to clip any stray content. */
.property-schedule-tour-day-form-slide:not(.slick-initialized) {
    opacity: 0 !important;
    visibility: hidden !important;
    max-height: 0 !important;
    overflow: hidden !important;
}

/* 3. Once Slick adds .slick-initialized, fade in smoothly. */
.property-schedule-tour-day-form-slide.slick-initialized {
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none !important;
    overflow: visible !important;
    transition: opacity 0.3s ease-in-out;
}

/* Mobile responsive — Insights */
@media (max-width: 575px) {
    .pilbe-hero-insights-row {
        flex-direction: column;
    }
    .pilbe-hero-insights-go {
        width: 100%;
    }
    .pilbe-hero-insights-input {
        width: 100%;
    }
}

/* ==================================================================
   PILBE HOMEPAGE — WEB & INTERACTIVE ANIMATION LAYER
   Brand: Pilbe blue #3F65F3 → purple #5D40DD
   ================================================================== */
:root {
    --pilbe-brand-start: #3F65F3;
    --pilbe-brand-mid:   #4D52E8;
    --pilbe-brand-end:   #5D40DD;
    --pilbe-ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
    --pilbe-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── Hero: animated gradient mesh + orbs ────────────────────────── */
.top-banner-wrap {
    position: relative;
    overflow: hidden;
}
.top-banner-wrap .banner-inner {
    position: relative;
    z-index: 2;
}
/* When our FX layer is present, let it be the hero background — override
   Houzez's inline parallax image + any background color. */
.top-banner-wrap .pilbe-hero-fx ~ .banner-inner,
.top-banner-wrap .pilbe-hero-fx ~ .banner-inner.houzez-parallax {
    background-image: none !important;
    background-color: transparent !important;
}
.pilbe-hero-fx {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}
.pilbe-hero-fx__gradient {
    position: absolute;
    inset: -10%;
    background:
        radial-gradient(40% 40% at 18% 28%, rgba(63, 101, 243, 0.55) 0%, transparent 65%),
        radial-gradient(35% 35% at 82% 18%, rgba(93, 64, 221, 0.45) 0%, transparent 65%),
        radial-gradient(45% 45% at 70% 82%, rgba(63, 101, 243, 0.35) 0%, transparent 65%),
        radial-gradient(30% 30% at 20% 80%, rgba(124, 77, 255, 0.35) 0%, transparent 65%),
        linear-gradient(135deg, #0b1431 0%, #14205a 55%, #2a1a6e 100%);
    filter: saturate(1.1);
    animation: pilbeHeroMesh 18s ease-in-out infinite;
}
.pilbe-hero-fx__grain {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 3px 3px;
    mix-blend-mode: overlay;
    opacity: 0.35;
}
.pilbe-hero-fx__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.55;
    will-change: transform;
    transition: transform 0.6s var(--pilbe-ease-out);
}
.pilbe-hero-fx__orb--a {
    width: 420px; height: 420px;
    top: -120px; left: -80px;
    background: radial-gradient(circle, rgba(63, 101, 243, 0.9), transparent 70%);
    animation: pilbeOrbFloat 14s ease-in-out infinite;
}
.pilbe-hero-fx__orb--b {
    width: 520px; height: 520px;
    bottom: -160px; right: -120px;
    background: radial-gradient(circle, rgba(93, 64, 221, 0.85), transparent 70%);
    animation: pilbeOrbFloat 18s ease-in-out -6s infinite reverse;
}
.pilbe-hero-fx__orb--c {
    width: 300px; height: 300px;
    top: 40%; left: 55%;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.65), transparent 70%);
    animation: pilbeOrbFloat 20s ease-in-out -3s infinite;
}
@keyframes pilbeHeroMesh {
    0%, 100% { transform: scale(1) rotate(0deg); }
    50%      { transform: scale(1.08) rotate(2deg); }
}
@keyframes pilbeOrbFloat {
    0%, 100% { transform: translate3d(0, 0, 0); }
    33%      { transform: translate3d(40px, -30px, 0) scale(1.05); }
    66%      { transform: translate3d(-30px, 25px, 0) scale(0.95); }
}

/* ── Hero: cityscape illustration ──────────────────────────────── */
.pilbe-hero-cityscape {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    pointer-events: none;
    line-height: 0;
    opacity: 0;
    transform: translateY(12px);
    animation: pilbeCityscapeFadeIn 1.2s var(--pilbe-ease-out) 0.6s forwards;
}
.pilbe-hero-cityscape img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 280px;
    object-fit: cover;
    object-position: bottom center;
    -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,1) 40%, rgba(0,0,0,0) 100%);
    mask-image: linear-gradient(to top, rgba(0,0,0,1) 40%, rgba(0,0,0,0) 100%);
}
@keyframes pilbeCityscapeFadeIn {
    to { opacity: 0.45; transform: translateY(0); }
}
/* Mobile: shrink the cityscape and increase transparency */
@media (max-width: 767px) {
    .pilbe-hero-cityscape img {
        max-height: 140px;
    }
    @keyframes pilbeCityscapeFadeIn {
        to { opacity: 0.3; transform: translateY(0); }
    }
}

/* Darken banner overlay slightly so content pops */
.top-banner-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(7, 11, 33, 0.25) 0%, rgba(7, 11, 33, 0.55) 100%);
    z-index: 1;
    pointer-events: none;
}

/* Safety net: any header/footer/nav/sticky region must never be
   affected by the reveal transform/opacity layer. Even if something
   slips through tagSectionsForReveal(), these elements stay interactive. */
.elementor-location-header [data-pilbe-reveal],
.elementor-location-footer [data-pilbe-reveal],
.elementor-location-header.pilbe-reveal-children,
.elementor-location-footer.pilbe-reveal-children,
header [data-pilbe-reveal],
footer [data-pilbe-reveal],
.elementor-location-header .pilbe-reveal-children > * > *,
.elementor-location-footer .pilbe-reveal-children > * > *,
.elementor-location-header .pilbe-reveal-children .elementor-widget-wrap > *,
.elementor-location-footer .pilbe-reveal-children .elementor-widget-wrap > *,
header .pilbe-reveal-children > * > *,
footer .pilbe-reveal-children > * > *,
.elementor-sticky [data-pilbe-reveal],
.elementor-sticky .pilbe-reveal-children > * > *,
.elementor-sticky .pilbe-reveal-children .elementor-widget-wrap > * {
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
}

/* ── Hero: eyebrow pill above headline ──────────────────────────── */
.pilbe-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px 7px 12px;
    margin: 0 auto 18px;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(-8px);
    animation: pilbeFadeDown 0.7s var(--pilbe-ease-out) 0.1s forwards;
}
.pilbe-hero-eyebrow__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--pilbe-brand-start), var(--pilbe-brand-end));
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.15);
    animation: pilbeDotPulse 2s ease-in-out infinite;
}
@keyframes pilbeDotPulse {
    0%, 100% { box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.15); }
    50%      { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.03); }
}
@keyframes pilbeFadeDown {
    to { opacity: 1; transform: translateY(0); }
}

/* ── Hero: kinetic headline — word-by-word reveal + rotating word ── */
.banner-title {
    position: relative;
    z-index: 2;
}
.pilbe-hero-word {
    display: inline-block;
    opacity: 0;
    transform: translateY(24px);
    animation: pilbeWordRise 0.75s var(--pilbe-ease-spring) forwards;
    will-change: transform, opacity;
}
@keyframes pilbeWordRise {
    to { opacity: 1; transform: translateY(0); }
}

.pilbe-hero-rotator {
    position: relative;
    display: inline-block;
    vertical-align: baseline;
    min-width: 5ch;
    text-align: left;
}
.pilbe-hero-rotator__word {
    display: inline-block;
    background: linear-gradient(135deg, #8db4ff 0%, #c2a8ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    position: relative;
    transform: translateY(0);
    transition: transform 0.5s var(--pilbe-ease-spring), opacity 0.45s ease;
}
.pilbe-hero-rotator__word::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, #8db4ff, #c2a8ff);
    transform: scaleX(0);
    transform-origin: left center;
    animation: pilbeUnderlineSweep 2.8s var(--pilbe-ease-out) infinite;
}
@keyframes pilbeUnderlineSweep {
    0%   { transform: scaleX(0); transform-origin: left center; }
    45%  { transform: scaleX(1); transform-origin: left center; }
    55%  { transform: scaleX(1); transform-origin: right center; }
    100% { transform: scaleX(0); transform-origin: right center; }
}
.pilbe-hero-rotator__word.is-leaving {
    opacity: 0;
    transform: translateY(-22px);
}
.pilbe-hero-rotator__word.is-entering {
    opacity: 0;
    transform: translateY(22px);
}

/* ── Hero: subtitle — override parent theme so it shows as white ── */
.pilbe-custom-hero-sub {
    opacity: 0;
    transform: translateY(12px);
    animation: pilbeFadeUp 0.7s var(--pilbe-ease-out) 0.9s forwards;
}
@keyframes pilbeFadeUp {
    to { opacity: 1; transform: translateY(0); }
}

/* ── Hero: value chips row ──────────────────────────────────────── */
.pilbe-hero-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 28px auto 0;
    max-width: 820px;
}
.pilbe-hero-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    color: #fff;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0.2px;
    opacity: 0;
    transform: translateY(14px);
    animation: pilbeFadeUp 0.6s var(--pilbe-ease-out) calc(1.1s + var(--i, 0) * 0.1s) forwards;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s var(--pilbe-ease-out);
}
.pilbe-hero-chip:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
}
.pilbe-hero-chip__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--pilbe-brand-start), var(--pilbe-brand-end));
    color: #fff;
    flex-shrink: 0;
}
.pilbe-hero-chip__icon svg {
    width: 11px;
    height: 11px;
}

/* ── Hero: live-stats row ──────────────────────────────────────── */
.pilbe-hero-stats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(20px, 4vw, 54px);
    margin: 36px auto 0;
    padding: 18px 24px;
    max-width: 820px;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    opacity: 0;
    transform: translateY(18px);
    animation: pilbeFadeUp 0.7s var(--pilbe-ease-out) 1.6s forwards;
}
.pilbe-hero-stat {
    text-align: center;
    color: #fff;
    min-width: 120px;
}
.pilbe-hero-stat__num {
    display: block;
    font-size: clamp(22px, 2.2vw, 30px);
    font-weight: 800;
    line-height: 1.1;
    background: linear-gradient(135deg, #ffffff 0%, #c2d0ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    letter-spacing: -0.3px;
}
.pilbe-hero-stat__label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.72);
}

/* ── Hero: scroll hint ─────────────────────────────────────────── */
.pilbe-hero-scroll {
    position: absolute;
    left: 50%;
    bottom: 24px;
    transform: translateX(-50%);
    z-index: 3;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    pointer-events: none;
    opacity: 0;
    animation: pilbeFadeUp 0.6s var(--pilbe-ease-out) 2.1s forwards;
}
.pilbe-hero-scroll__line {
    width: 1px;
    height: 34px;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,0.8), transparent);
    background-size: 100% 200%;
    animation: pilbeScrollHint 1.8s ease-in-out infinite;
}
@keyframes pilbeScrollHint {
    0%   { background-position: 0% -100%; }
    100% { background-position: 0% 100%; }
}

/* ── Search-bar glow halo on focus ─────────────────────────────── */
.banner-caption .advanced-search,
.banner-caption .main-search-field-wrap {
    transition: box-shadow 0.35s ease, transform 0.35s var(--pilbe-ease-out);
}
.pilbe-search-focused .advanced-search,
.pilbe-search-focused .main-search-field-wrap {
    box-shadow:
        0 0 0 4px rgba(99, 102, 241, 0.25),
        0 20px 50px -20px rgba(93, 64, 221, 0.55);
    transform: translateY(-2px);
}

/* ── Global scroll-reveal utility ──────────────────────────────── */
[data-pilbe-reveal] {
    opacity: 0;
    transform: translateY(32px);
    transition:
        opacity 0.8s var(--pilbe-ease-out),
        transform 0.8s var(--pilbe-ease-out);
    transition-delay: var(--pilbe-reveal-delay, 0ms);
    will-change: opacity, transform;
}
[data-pilbe-reveal="fade"]  { transform: translateY(0); }
[data-pilbe-reveal="left"]  { transform: translateX(-32px); }
[data-pilbe-reveal="right"] { transform: translateX(32px); }
[data-pilbe-reveal="scale"] { transform: scale(0.94); }
[data-pilbe-reveal].is-visible {
    opacity: 1;
    transform: translate(0,0) scale(1);
}

/* Elementor widgets inside a tagged section get a soft fade-up stagger */
.pilbe-reveal-children > * > *,
.pilbe-reveal-children .elementor-widget-wrap > * {
    opacity: 0;
    transform: translateY(22px);
    transition:
        opacity 0.7s var(--pilbe-ease-out),
        transform 0.7s var(--pilbe-ease-out);
    transition-delay: calc(var(--pilbe-stagger, 0) * 80ms);
}
.pilbe-reveal-children.is-visible > * > *,
.pilbe-reveal-children.is-visible .elementor-widget-wrap > * {
    opacity: 1;
    transform: translateY(0);
}

/* ── Section separator wave (between hero and first section) ───── */
.pilbe-wave-divider {
    display: block;
    width: 100%;
    height: 60px;
    margin-top: -60px;
    position: relative;
    z-index: 3;
    background:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'><path d='M0,48 C240,12 480,12 720,30 C960,48 1200,48 1440,18 L1440,60 L0,60 Z' fill='%23ffffff'/></svg>")
        no-repeat center/cover;
    pointer-events: none;
}

/* ── Micro-interactions: buttons and links ─────────────────────── */
.pilbe-btn-magnetic,
.btn-primary,
.houzez-btn-primary,
.pilbe-custom-app-badge,
.banner-caption .btn {
    position: relative;
    overflow: hidden;
    transition: transform 0.25s var(--pilbe-ease-out), box-shadow 0.25s ease;
}
.pilbe-btn-magnetic::after,
.btn-primary::after,
.houzez-btn-primary::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,0.35) 0%, transparent 45%);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}
.pilbe-btn-magnetic:hover::after,
.btn-primary:hover::after,
.houzez-btn-primary:hover::after {
    opacity: 1;
}

/* ── Cards: lift + outline glow on hover (catches listing tiles) ── */
.listing-item-wrap,
.agent-item,
.property-item-v1,
.property-item-v2,
.property-item-v3,
.item-pilbe {
    transition: transform 0.4s var(--pilbe-ease-out), box-shadow 0.4s var(--pilbe-ease-out);
}
.listing-item-wrap:hover,
.agent-item:hover,
.property-item-v1:hover,
.property-item-v2:hover,
.property-item-v3:hover,
.item-pilbe:hover {
    transform: translateY(-6px);
    box-shadow:
        0 30px 50px -25px rgba(15, 23, 42, 0.25),
        0 12px 22px -12px rgba(63, 101, 243, 0.28);
}

/* ── Mobile hero tuning ────────────────────────────────────────── */
@media (max-width: 767px) {
    .pilbe-hero-eyebrow { font-size: 10px; padding: 6px 12px 6px 10px; }
    .pilbe-hero-chips  { gap: 6px; margin-top: 18px; }
    .pilbe-hero-chip   { font-size: 12px; padding: 7px 12px; }
    .pilbe-hero-stats  { gap: 14px; padding: 14px 16px; margin-top: 22px; border-radius: 14px; }
    .pilbe-hero-stat   { min-width: 90px; }
    .pilbe-hero-stat__num   { font-size: 20px; }
    .pilbe-hero-stat__label { font-size: 10px; }
    .pilbe-hero-scroll { display: none; }
    .pilbe-hero-fx__orb { filter: blur(50px); }
}

/* ==================================================================
   PILBE HOMEPAGE — VISUAL HARMONISATION LAYER
   One vocabulary across every section below the hero:
   - One font (Lato) · One neutral scale · One brand gradient
   - One card chrome (radius / border / shadow / hover)
   - One primary button (brand gradient)
   - One section header pattern (eyebrow → gradient-accent title → sub)
   - One spacing rhythm + alternating bg (white / #F8F7FE)
   Scoped to body.pilbe-home (added by pilbe-homepage.js).
   ================================================================== */

body.pilbe-home {
    /* Canonical Pilbe design tokens */
    --pbds-font:        'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --pbds-ink:         #1A1D26;
    --pbds-ink-2:       #2A2F3C;
    --pbds-muted:       #5B6473;
    --pbds-muted-2:     #8A93A3;
    --pbds-line:        #E6ECF2;
    --pbds-line-soft:   #EEF1F6;
    --pbds-bg:          #FFFFFF;
    --pbds-bg-tint:     #F8F7FE;
    --pbds-bg-tint-2:   #F3F5FB;
    --pbds-brand-1:     #3F65F3;
    --pbds-brand-2:     #5D40DD;
    --pbds-brand-grad:  linear-gradient(135deg, #3F65F3 0%, #5D40DD 100%);
    --pbds-brand-tint:  linear-gradient(135deg, rgba(63,101,243,0.10) 0%, rgba(93,64,221,0.10) 100%);
    --pbds-radius-card: 20px;
    --pbds-radius-btn:  12px;
    --pbds-shadow:      0 1px 2px rgba(15, 23, 42, 0.04),
                        0 8px 24px -8px rgba(15, 23, 42, 0.06);
    --pbds-shadow-lift: 0 24px 48px -22px rgba(63, 101, 243, 0.30),
                        0 12px 24px -12px rgba(93, 64, 221, 0.22);
    --pbds-section-pad: clamp(48px, 5.5vw, 76px);
}

/* ── 1. Font unification — scope to page content, never touch header/footer/nav ── */
body.pilbe-home .page-wrap,
body.pilbe-home .page-wrap h1,
body.pilbe-home .page-wrap h2,
body.pilbe-home .page-wrap h3,
body.pilbe-home .page-wrap h4,
body.pilbe-home .page-wrap p,
body.pilbe-home .page-wrap a,
body.pilbe-home .page-wrap span,
body.pilbe-home #pilbe-app-download,
body.pilbe-home #pilbe-why-different,
body.pilbe-home #pilbe-why-different *,
body.pilbe-home .pb-home-why-wrap,
body.pilbe-home .pb-home-why-wrap *,
body.pilbe-home .pb-foragents-wrap,
body.pilbe-home .pb-foragents-wrap *,
body.pilbe-home .pilbe-custom-app-section,
body.pilbe-home .pilbe-custom-app-section * {
    font-family: var(--pbds-font) !important;
}

/* ── 2. Neutral color unification across the three custom sections ── */
body.pilbe-home .pb-home-why-title,
body.pilbe-home .pb-home-why-card-title,
body.pilbe-home .pilbe-custom-app-headline {
    color: var(--pbds-ink);
    letter-spacing: -0.02em;
}
body.pilbe-home .pb-home-why-subtitle,
body.pilbe-home .pb-home-why-card-desc,
body.pilbe-home .pilbe-custom-app-desc {
    color: var(--pbds-muted);
}

/* ── 3. Section rhythm — alternate white / soft tint ───────────── */
body.pilbe-home .pilbe-custom-app-section {
    padding: var(--pbds-section-pad) 20px;
    background: var(--pbds-bg-tint);
}
body.pilbe-home .pb-home-why-wrap {
    padding: var(--pbds-section-pad) 20px;
    max-width: 1180px;
}
body.pilbe-home .pilbe-why-diff {
    padding: var(--pbds-section-pad) 20px;
}
body.pilbe-home .pb-foragents-wrap {
    padding: var(--pbds-section-pad) 20px !important;
}

/* ── 4. Section header pattern — unify title + subtitle scale ─── */
body.pilbe-home .pb-home-why-title,
body.pilbe-home .pilbe-custom-app-headline {
    font-size: clamp(30px, 3.6vw, 44px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    margin: 0 0 16px;
}
body.pilbe-home .pb-home-why-subtitle,
body.pilbe-home .pilbe-custom-app-desc {
    font-size: clamp(15px, 1.15vw, 17px);
    line-height: 1.6;
    max-width: 640px;
}

/* Gradient-accent final word treatment via :after-first-child selectors
   Applied with a utility: sections that want the gradient treatment on
   their H2 wrap their accent word in <em> or <span class="pbds-accent">. */
body.pilbe-home .pbds-accent,
body.pilbe-home .pb-home-why-title em,
body.pilbe-home .pilbe-custom-app-headline em {
    font-style: normal;
    background: var(--pbds-brand-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 900;
}

/* ── 5. Universal card chrome — applies to every card-like widget ─ */
body.pilbe-home .pb-home-why-card,
body.pilbe-home .pilbe-why-diff__card,
body.pilbe-home .listing-item-wrap,
body.pilbe-home .agent-item,
body.pilbe-home .property-item-v1,
body.pilbe-home .property-item-v2,
body.pilbe-home .property-item-v3,
body.pilbe-home .item-pilbe {
    border-radius: var(--pbds-radius-card);
    border: 1px solid var(--pbds-line);
    background: var(--pbds-bg);
    box-shadow: var(--pbds-shadow);
    transition:
        transform 0.4s var(--pilbe-ease-out),
        box-shadow 0.4s var(--pilbe-ease-out),
        border-color 0.25s ease;
}
body.pilbe-home .pb-home-why-card:hover,
body.pilbe-home .pilbe-why-diff__card:hover,
body.pilbe-home .listing-item-wrap:hover,
body.pilbe-home .agent-item:hover,
body.pilbe-home .property-item-v1:hover,
body.pilbe-home .property-item-v2:hover,
body.pilbe-home .property-item-v3:hover,
body.pilbe-home .item-pilbe:hover {
    transform: translateY(-6px);
    box-shadow: var(--pbds-shadow-lift);
    border-color: transparent;
}

/* ── 6. Universal icon-badge — 52px rounded square with brand grad ─ */
body.pilbe-home .pbds-icon,
body.pilbe-home .pilbe-why-diff__icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--pbds-brand-grad);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 24px -12px rgba(93, 64, 221, 0.45);
}
/* Existing why-diff overrides its own bg on hover — let the grad stick. */
body.pilbe-home .pilbe-why-diff__icon { background: var(--pbds-brand-grad) !important; }
body.pilbe-home .pilbe-why-diff__icon::after { display: none; }

/* ── 7. Unified primary button — brand gradient pill ───────────── */
body.pilbe-home .pbds-btn,
body.pilbe-home .pb-home-why-btn,
body.pilbe-home .page-wrap .btn-primary,
body.pilbe-home .page-wrap .houzez-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 26px;
    border-radius: var(--pbds-radius-btn);
    background: var(--pbds-brand-grad);
    color: #fff;
    font-family: var(--pbds-font);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.1px;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    box-shadow: 0 8px 24px -12px rgba(93, 64, 221, 0.6);
    transition: transform 0.25s var(--pilbe-ease-out), box-shadow 0.25s ease, filter 0.25s ease;
}
body.pilbe-home .pbds-btn:hover,
body.pilbe-home .pb-home-why-btn:hover,
body.pilbe-home .page-wrap .btn-primary:hover,
body.pilbe-home .page-wrap .houzez-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px -14px rgba(93, 64, 221, 0.7);
    filter: brightness(1.05);
    color: #fff;
}
body.pilbe-home .pb-home-why-card:hover .pb-home-why-btn {
    box-shadow: 0 16px 36px -14px rgba(93, 64, 221, 0.7);
    border-color: transparent;
}

/* ── 8. App-download section: re-chrome to match system ────────── */
body.pilbe-home .pilbe-custom-app-inner {
    background: var(--pbds-bg);
    border: 1px solid var(--pbds-line);
    border-radius: 24px;
    padding: 48px;
    box-shadow: var(--pbds-shadow);
    max-width: 1100px;
}
body.pilbe-home .pilbe-custom-app-badge--play,
body.pilbe-home .pilbe-custom-app-badge--apple {
    background: var(--pbds-ink);
    border-radius: var(--pbds-radius-btn);
}
body.pilbe-home .pilbe-custom-app-icon img {
    box-shadow: 0 20px 50px -20px rgba(63, 101, 243, 0.35);
}

/* ── 9. Why-list section: re-chrome to match system ──────────── */
body.pilbe-home .pb-home-why-card {
    padding: 40px 32px;
}
body.pilbe-home .pb-home-why-btn {
    /* Already styled as gradient pill above via the universal rule. */
    margin-bottom: 24px;
    padding: 12px 22px;
    font-size: 14px;
}
body.pilbe-home .pb-home-why-card:hover .pb-home-why-btn {
    transform: translateY(0);
}

/* ── 10. Why-different: keep the gold standard, just re-token it ── */
body.pilbe-home .pilbe-why-diff {
    --pwd-bg:        var(--pbds-bg-tint);
    --pwd-card-bg:   var(--pbds-bg);
    --pwd-border:    var(--pbds-line);
    --pwd-text:      var(--pbds-ink);
    --pwd-muted:     var(--pbds-muted);
    --pwd-grad-start: var(--pbds-brand-1);
    --pwd-grad-end:   var(--pbds-brand-2);
}

/* ── 11. Elementor content widgets — unify headings/buttons ──── */
body.pilbe-home .page-wrap .elementor-widget-heading h1.elementor-heading-title,
body.pilbe-home .page-wrap .elementor-widget-heading h2.elementor-heading-title,
body.pilbe-home .page-wrap .elementor-widget-heading h3.elementor-heading-title {
    font-family: var(--pbds-font) !important;
    color: var(--pbds-ink);
    letter-spacing: -0.03em;
    font-weight: 800;
    line-height: 1.1;
}
body.pilbe-home .page-wrap .elementor-widget-text-editor,
body.pilbe-home .page-wrap .elementor-widget-text-editor p {
    font-family: var(--pbds-font) !important;
    color: var(--pbds-muted);
    font-size: clamp(15px, 1.15vw, 17px);
    line-height: 1.6;
}

/* Elementor buttons inherit the pbds-btn system */
body.pilbe-home .page-wrap .elementor-button,
body.pilbe-home .page-wrap .elementor-widget-button .elementor-button {
    font-family: var(--pbds-font) !important;
    background: var(--pbds-brand-grad);
    border-radius: var(--pbds-radius-btn);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.1px;
    box-shadow: 0 8px 24px -12px rgba(93, 64, 221, 0.6);
    transition: transform 0.25s var(--pilbe-ease-out), box-shadow 0.25s ease, filter 0.25s ease;
}
body.pilbe-home .page-wrap .elementor-button:hover,
body.pilbe-home .page-wrap .elementor-widget-button .elementor-button:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 16px 36px -14px rgba(93, 64, 221, 0.7);
}

/* Elementor image-box / icon-box cards inherit the card chrome */
body.pilbe-home .page-wrap .elementor-widget-image-box .elementor-image-box-wrapper,
body.pilbe-home .page-wrap .elementor-widget-icon-box .elementor-icon-box-wrapper,
body.pilbe-home .page-wrap .elementor-widget-call-to-action .elementor-cta {
    background: var(--pbds-bg);
    border: 1px solid var(--pbds-line);
    border-radius: var(--pbds-radius-card);
    box-shadow: var(--pbds-shadow);
    padding: 32px;
    transition:
        transform 0.4s var(--pilbe-ease-out),
        box-shadow 0.4s var(--pilbe-ease-out),
        border-color 0.25s ease;
}
body.pilbe-home .page-wrap .elementor-widget-image-box .elementor-image-box-wrapper:hover,
body.pilbe-home .page-wrap .elementor-widget-icon-box .elementor-icon-box-wrapper:hover,
body.pilbe-home .page-wrap .elementor-widget-call-to-action .elementor-cta:hover {
    transform: translateY(-6px);
    box-shadow: var(--pbds-shadow-lift);
    border-color: transparent;
}

/* Elementor section background rhythm — even sections slightly tinted.
   We mark them via JS (pilbe-section-tint) to avoid over-coloring. */
body.pilbe-home .pilbe-section-tint,
body.pilbe-home .pilbe-section-tint > .elementor-container,
body.pilbe-home .pilbe-section-tint.e-con {
    background: var(--pbds-bg-tint);
}

/* ── 12. Divider between sections — a faint brand-tinted line ── */
body.pilbe-home .page-wrap > .elementor-section + .elementor-section::before,
body.pilbe-home .page-wrap > .e-con + .e-con::before {
    content: "";
    display: block;
    width: 80px;
    height: 2px;
    margin: -2px auto 0;
    background: var(--pbds-brand-grad);
    opacity: 0.18;
    border-radius: 999px;
}

/* ── 13. Responsive: tighten everything on mobile ─────────────── */
@media (max-width: 767px) {
    body.pilbe-home {
        --pbds-section-pad: 40px;
    }
    body.pilbe-home .pilbe-custom-app-inner {
        padding: 28px 20px;
        border-radius: 20px;
    }
    body.pilbe-home .pb-home-why-title,
    body.pilbe-home .pilbe-custom-app-headline {
        font-size: clamp(24px, 7vw, 32px);
    }
    body.pilbe-home .pb-home-why-card {
        padding: 28px 22px;
    }
}

/* ── 14. DENSITY PASS — kill dead whitespace everywhere ──────── */

/* Custom-section internal header gaps: the why-diff section's 72px
   stack between eyebrow/title/sub was the biggest offender. */
body.pilbe-home .pilbe-why-diff__head {
    margin-bottom: 36px;
}
body.pilbe-home .pilbe-why-diff__eyebrow { margin-bottom: 14px; }
body.pilbe-home .pilbe-why-diff__title   { margin-bottom: 12px; }
body.pilbe-home .pilbe-why-diff__grid    { gap: 20px; }
body.pilbe-home .pilbe-why-diff__card    { padding: 28px; }

body.pilbe-home .pb-home-why-header     { margin-bottom: 28px; }
body.pilbe-home .pb-home-why-title      { margin-bottom: 10px; }
body.pilbe-home .pb-home-why-grid       { gap: 20px; }
body.pilbe-home .pb-home-why-card-desc  { margin-bottom: 18px; }

body.pilbe-home .pilbe-custom-app-inner { gap: 36px; }
body.pilbe-home .pilbe-custom-app-headline { margin-bottom: 10px; }
body.pilbe-home .pilbe-custom-app-desc     { margin-bottom: 20px; }

/* Cap Elementor top-section padding: builder defaults often add
   80–120px of dead space on top of our rhythm. */
body.pilbe-home .page-wrap .elementor-top-section > .elementor-container,
body.pilbe-home .page-wrap .elementor-section.elementor-top-section > .elementor-container {
    padding-top: 0;
    padding-bottom: 0;
}
body.pilbe-home .page-wrap .elementor-top-section,
body.pilbe-home .page-wrap .elementor-section.elementor-top-section,
body.pilbe-home .page-wrap .e-con-full.e-parent {
    padding-top:    clamp(40px, 5vw, 72px) !important;
    padding-bottom: clamp(40px, 5vw, 72px) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Remove empty Elementor columns/widgets that only hold a spacer. */
body.pilbe-home .page-wrap .elementor-widget-spacer .elementor-spacer {
    height: clamp(16px, 2vw, 32px) !important;
}

/* Collapse blank <p> tags from WP editor content. */
body.pilbe-home .page-wrap p:empty,
body.pilbe-home .page-wrap .elementor-widget-text-editor p:empty {
    display: none;
}

/* Kill gap below the hero — banner sometimes leaves a margin. */
body.pilbe-home .top-banner-wrap { margin-bottom: 0 !important; }
body.pilbe-home .top-banner-wrap + * { margin-top: 0 !important; }

/* Cap hero height — 100vh is too tall on desktop monitors, and
   banner has fullscreen class from Houzez settings. */
body.pilbe-home .top-banner-wrap,
body.pilbe-home .top-banner-wrap .banner-inner {
    min-height: clamp(520px, 74vh, 760px);
    height: auto;
}

/* Tighten the page-wrap container itself so it doesn't add top space. */
body.pilbe-home .page-wrap > .container,
body.pilbe-home main#main-wrap > .page-wrap {
    padding-top: 0;
    padding-bottom: 0;
}

/* Between-section faint divider was adding 2px + visual gap — remove
   it (the alternating tint already signals separation). */
body.pilbe-home .page-wrap > .elementor-section + .elementor-section::before,
body.pilbe-home .page-wrap > .e-con + .e-con::before {
    display: none;
}

/* ── Accessibility: honour reduced motion ──────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .pilbe-hero-fx__gradient,
    .pilbe-hero-fx__orb,
    .pilbe-hero-eyebrow__dot,
    .pilbe-hero-rotator__word::after,
    .pilbe-hero-scroll__line {
        animation: none !important;
    }
    .pilbe-hero-word,
    .pilbe-custom-hero-sub,
    .pilbe-hero-eyebrow,
    .pilbe-hero-chip,
    .pilbe-hero-stats,
    .pilbe-hero-scroll,
    .pilbe-hero-cityscape,
    [data-pilbe-reveal],
    .pilbe-reveal-children > * > * {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }
    .pilbe-hero-cityscape {
        opacity: 0.45 !important;
    }
}

/* ==================================================================
   PROPERTY DETAIL — Brand-gradient Details section
   Overrides the Houzez Theme-Options inline red border/background
   on the "Details" block (Price, Beds, Baths, etc.).
   ================================================================== */
/* ==================================================================
   NAVBAR — Centre logo on tablet / mobile
   The Elementor flex container uses space-between with order-based
   re-ordering (account –1 | logo 1 | hamburger 100). Making the
   logo widget fill the remaining space and centring its content
   ensures the wordmark sits dead-centre regardless of sibling widths.
   ================================================================== */
@media (max-width: 1024px) {
    .navbar-pilbe__logo-image {
        flex: 1 1 0% !important;
        text-align: center;
    }
    .navbar-pilbe__logo-image .favethemes-site-logo,
    .navbar-pilbe__logo-image .logo.logo-desktop {
        display: flex;
        justify-content: center;
    }
}

#property-detail-wrap .block-content-wrap {
    border: none !important;
    border-left: 4px solid #3F65F3 !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
    background: linear-gradient(
        135deg,
        rgba(63, 101, 243, 0.06) 0%,
        rgba(93, 64, 221, 0.06) 100%
    ) !important;
    box-shadow:
        0 0 0 1px rgba(63, 101, 243, 0.12),
        0 2px 8px rgba(63, 101, 243, 0.05) !important;
    padding: 20px 24px !important;
}

/* ==================================================================
   HOMEPAGE HERO VIDEO BACKGROUND & CENTERING
   ================================================================== */
.pilbe-home .elementor-element-b147f27 {
    display: none !important;
}

.pilbe-home .pilbe-search-section {
    position: relative !important;
    min-height: calc(100vh - 61px) !important;
    height: calc(100vh - 61px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    isolation: isolate;
}

.pilbe-home .pilbe-search-section > .elementor-container,
.pilbe-home .pilbe-search-section .pilbe-search-section__column,
.pilbe-home .pilbe-search-section .pilbe-search-section__column > .elementor-widget-wrap,
.pilbe-home .pilbe-search-section .pilbe-search-section__inner-section,
.pilbe-home .pilbe-search-section .pilbe-search-section__inner-section > .elementor-container,
.pilbe-home .pilbe-search-section .pilbe-search-section__inner-section .elementor-widget-wrap {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

.pilbe-home .pilbe-search-section .elementor-widget-shortcode,
.pilbe-home .pilbe-search-section .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pilbe-home .pilbe-search {
    position: relative !important;
    z-index: 10 !important;
    width: 100% !important;
    max-width: 774px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.pilbe-home-video-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
    pointer-events: none;
}

.pilbe-home-video-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: rgba(0, 0, 0, 0.4);
    pointer-events: none;
}