@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Flex:opsz,wght@6..144,1..1000&display=swap');



:root {

    /* Brand */
    --homely-primary: #0c4f8a;
    --homely-primary-hover: #083d6d;
    --homely-primary-dark: #07345d;
    --homely-primary-soft: #edf5fc;

    /* Background */
    --homely-body-bg: #f7f9fc;
    --homely-header-bg: #ffffff;
    --homely-surface: #ffffff;
    --homely-surface-soft: #f7f9fc;

    /* Text */
    --homely-text-primary: #172033;
    --homely-text-secondary: #667085;
    --homely-text-muted: #98a2b3;

    /* Border */
    --homely-border: #e4e7ec;
    --homely-border-soft: #eef1f5;

    /* Overlay */
    --homely-overlay: rgba(15, 23, 42, 0.50);

    /* Sizes */
    --homely-header-height: 72px;
    --homely-container-width: 1440px;
    --homely-sidebar-width: 310px;

    /* Radius */
    --homely-radius-sm: 6px;
    --homely-radius-md: 9px;
    --homely-radius-lg: 14px;
    --homely-radius-xl: 18px;

    /* Shadow */
    --homely-shadow-sm:
        0 1px 2px rgba(16, 24, 40, 0.04);

    --homely-shadow-header:
        0 3px 15px rgba(16, 24, 40, 0.07);

    --homely-shadow-dropdown:
        0 14px 40px rgba(16, 24, 40, 0.12);

    --homely-shadow-sidebar:
        12px 0 40px rgba(16, 24, 40, 0.14);

    /* Font */
    --homely-font:"Google Sans Flex", sans-serif;

    /* Transition */
    --homely-transition: 0.25s ease;


}


/* ==========================================================
   RESET
========================================================== */

* {
    box-sizing: border-box;
}


html {
    scroll-behavior: smooth;
}


body {
    margin: 0;
    font-family: var(--homely-font);
    background: var(--homely-body-bg);
    color: var(--homely-text-primary);
}


svg{
    width: 20px;
}

a {
    text-decoration: none;
}


/* ==========================================================
   MAIN CONTAINER
========================================================== */

.homely-container {
    width: 100%;
    max-width: var(--homely-container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: 26px;
    padding-right: 26px;
}


/* ==========================================================
   HEADER
========================================================== */

.homely-header {
    width: 100%;
    height: var(--homely-header-height);

    background: var(--homely-header-bg);

    border-bottom: 1px solid var(--homely-border-soft);

    transition:
        box-shadow var(--homely-transition),
        border-color var(--homely-transition);

    z-index: 1030;
}


.homely-header.header-scrolled {
    border-color: transparent;
    box-shadow: var(--homely-shadow-header);
}


.homely-header__inner {
    height: var(--homely-header-height);

    display: flex;
    align-items: center;

    position: relative;
}


/* ==========================================================
   LOGO
========================================================== */

.homely-logo {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    color: var(--homely-text-primary);

    flex-shrink: 0;
}


.homely-logo:hover {
    color: var(--homely-text-primary);
}


.homely-logo__icon {
    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--homely-primary);

    font-size: 31px;
}


.homely-logo__content {
    display: flex;
    flex-direction: column;

    line-height: 1;
}


.homely-logo__name {
    color: var(--homely-text-primary);

    font-size: 19px;
    font-weight: 750;

    letter-spacing: -0.4px;
}


.homely-logo__tagline {
    margin-top: 4px;

    color: var(--homely-text-muted);

    font-size: 8px;
    font-weight: 500;

    white-space: nowrap;
}


/* ==========================================================
   DESKTOP NAV
========================================================== */

.homely-nav {
    height: 100%;

    align-items: center;

    gap: 3px;

    margin-left: 62px;
}


.homely-nav__link {
    height: 40px;

    padding: 0 13px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 3px;

    border: 0;

    background: transparent;

    color: var(--homely-text-primary);

    font-family: inherit;
    font-size: 13px;
    font-weight: 600;

    border-radius: var(--homely-radius-md);

    position: relative;

    transition:
        color var(--homely-transition),
        background var(--homely-transition);
}


.homely-nav__link:hover,
.homely-nav__link:focus {
    color: var(--homely-primary);

    background: var(--homely-primary-soft);
}


.homely-nav__link.active {
    color: var(--homely-primary);
}


.homely-nav__link.active::after {
    content: "";

    position: absolute;

    left: 14px;
    right: 14px;
    bottom: -16px;

    height: 2px;

    background: var(--homely-primary);

    border-radius: 10px;
}


/* ==========================================================
   EXPLORE DROPDOWN
========================================================== */

.homely-dropdown__toggle::after {
    display: none;
}


.homely-dropdown__toggle i {
    font-size: 16px;

    transition: transform var(--homely-transition);
}


.homely-dropdown__toggle.show i {
    transform: rotate(180deg);
}


.homely-dropdown__menu {
    width: 265px;

    margin-top: 11px !important;

    padding: 8px;

    border: 1px solid var(--homely-border);

    border-radius: var(--homely-radius-lg);

    background: var(--homely-surface);

    box-shadow: var(--homely-shadow-dropdown);
}


.homely-dropdown__menu .dropdown-item {
    display: flex;
    align-items: center;

    gap: 12px;

    min-height: 58px;

    padding: 9px 10px;

    border-radius: var(--homely-radius-md);

    color: var(--homely-text-primary);

    white-space: normal;

    transition: background var(--homely-transition);
}


.homely-dropdown__menu .dropdown-item:hover {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


.dropdown-item-icon {
    width: 36px;
    height: 36px;

    min-width: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: var(--homely-surface-soft);

    border: 1px solid var(--homely-border-soft);

    border-radius: var(--homely-radius-md);

    color: var(--homely-primary);

    font-size: 18px;
}


.homely-dropdown__menu .dropdown-item span:last-child {
    display: flex;
    flex-direction: column;

    gap: 3px;
}


.homely-dropdown__menu .dropdown-item strong {
    font-size: 13px;
    font-weight: 650;
}


.homely-dropdown__menu .dropdown-item small {
    color: var(--homely-text-muted);

    font-size: 10px;
}


.homely-dropdown__menu .dropdown-divider {
    margin: 7px 0;

    border-color: var(--homely-border-soft);
}


/* ==========================================================
   RIGHT ACTIONS
========================================================== */

.homely-actions {
    display: flex;
    align-items: center;

    gap: 10px;

    margin-left: auto;
}


.homely-business {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    height: 40px;

    padding: 0 7px;

    color: var(--homely-text-primary);

    font-size: 12px;
    font-weight: 600;

    border-radius: var(--homely-radius-md);

    transition:
        color var(--homely-transition),
        background var(--homely-transition);
}


.homely-business i {
    color: var(--homely-text-secondary);

    font-size: 17px;
}


.homely-business:hover {
    color: var(--homely-primary);

    background: var(--homely-primary-soft);
}


.homely-business:hover i {
    color: var(--homely-primary);
}


/* ==========================================================
   ICON BUTTON
========================================================== */

.homely-icon-button {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: var(--homely-text-primary);

    border-radius: 50%;

    font-size: 21px;

    transition:
        color var(--homely-transition),
        background var(--homely-transition);
}


.homely-icon-button:hover {
    color: var(--homely-primary);

    background: var(--homely-primary-soft);
}


/* ==========================================================
   HEADER BUTTONS
========================================================== */

.homely-login-btn {
    height: 40px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 16px;

    border: 1px solid var(--homely-primary);

    border-radius: var(--homely-radius-md);

    background: var(--homely-surface);

    color: var(--homely-primary);

    font-size: 12px;
    font-weight: 650;

    white-space: nowrap;

    transition: all var(--homely-transition);
}


.homely-login-btn:hover {
    border-color: var(--homely-primary);

    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


.homely-post-btn {
    height: 40px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 18px;

    border: 1px solid var(--homely-primary);

    border-radius: var(--homely-radius-md);

    background: var(--homely-primary);

    color: #ffffff;

    font-size: 12px;
    font-weight: 650;

    white-space: nowrap;

    box-shadow:
        0 4px 10px rgba(12, 79, 138, 0.15);

    transition: all var(--homely-transition);
}


.homely-post-btn:hover {
    border-color: var(--homely-primary-hover);

    background: var(--homely-primary-hover);

    color: #ffffff;

    transform: translateY(-1px);

    box-shadow:
        0 7px 15px rgba(12, 79, 138, 0.22);
}


/* ==========================================================
   MOBILE TOGGLE
========================================================== */

.homely-mobile-toggle {
    width: 42px;
    height: 42px;

    margin-right: 7px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 0;

    background: transparent;

    border-radius: var(--homely-radius-md);

    color: var(--homely-text-primary);

    font-size: 24px;

    transition:
        color var(--homely-transition),
        background var(--homely-transition);
}


.homely-mobile-toggle:hover {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


/* ==========================================================
   OFFCANVAS
========================================================== */

.homely-sidebar {
    --bs-offcanvas-width: var(--homely-sidebar-width);

    width: var(--homely-sidebar-width);

    max-width: 86vw;

    border: 0 !important;

    background: var(--homely-surface);

    box-shadow: var(--homely-shadow-sidebar);
}


.offcanvas-backdrop.show {
    opacity: 1;

    background: var(--homely-overlay);
}


/* ==========================================================
   SIDEBAR HEADER
========================================================== */

.homely-sidebar__header {
    min-height: 76px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 15px 18px;

    border-bottom: 1px solid var(--homely-border-soft);
}


.homely-sidebar-close {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;

    background: var(--homely-surface-soft);

    border-radius: 50%;

    color: var(--homely-text-primary);

    font-size: 23px;

    transition: all var(--homely-transition);
}


.homely-sidebar-close:hover {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


/* ==========================================================
   SIDEBAR BODY
========================================================== */

.homely-sidebar__body {
    overflow-y: auto;

    flex: 1;

    padding: 15px 14px 20px;
}


.homely-sidebar-section-title {
    padding: 4px 11px 10px;

    color: var(--homely-text-muted);

    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.7px;
}


/* ==========================================================
   SIDEBAR MENU
========================================================== */

.homely-sidebar-menu {
    display: flex;
    flex-direction: column;

    gap: 3px;
}


.homely-sidebar-link {
    width: 100%;

    min-height: 48px;

    display: flex;
    align-items: center;

    gap: 11px;

    padding: 7px 11px;

    border: 0;

    border-radius: var(--homely-radius-md);

    background: transparent;

    color: var(--homely-text-primary);

    font-family: inherit;
    font-size: 13px;
    font-weight: 600;

    text-align: left;

    transition: all var(--homely-transition);
}


.homely-sidebar-link:hover {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


.homely-sidebar-link.active {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


.homely-sidebar-link__icon {
    width: 34px;
    height: 34px;

    min-width: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: var(--homely-radius-sm);

    color: var(--homely-text-secondary);

    font-size: 19px;

    transition: all var(--homely-transition);
}


.homely-sidebar-link:hover .homely-sidebar-link__icon,
.homely-sidebar-link.active .homely-sidebar-link__icon {
    color: var(--homely-primary);
}


.homely-sidebar-link.active .homely-sidebar-link__icon {
    background: rgba(12, 79, 138, 0.07);
}


/* ==========================================================
   SIDEBAR COLLAPSE
========================================================== */

.sidebar-arrow {
    font-size: 18px;

    transition: transform var(--homely-transition);
}


.homely-sidebar-collapse[aria-expanded="true"] .sidebar-arrow {
    transform: rotate(180deg);
}


.homely-sidebar-submenu {
    margin: 2px 0 7px 45px;

    padding-left: 10px;

    border-left: 1px solid var(--homely-border);
}


.homely-sidebar-submenu a {
    min-height: 39px;

    display: flex;
    align-items: center;

    padding: 7px 10px;

    border-radius: var(--homely-radius-sm);

    color: var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 550;

    transition: all var(--homely-transition);
}


.homely-sidebar-submenu a:hover {
    color: var(--homely-primary);

    background: var(--homely-primary-soft);
}


.homely-sidebar-divider {
    height: 1px;

    margin: 9px 10px;

    background: var(--homely-border-soft);
}


/* ==========================================================
   SIDEBAR FOOTER
========================================================== */

.homely-sidebar__footer {
    padding: 14px;

    background: var(--homely-surface);

    border-top: 1px solid var(--homely-border-soft);

    display: flex;
    flex-direction: column;

    gap: 9px;
}


.homely-sidebar-login,
.homely-sidebar-post {
    width: 100%;

    min-height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    border-radius: var(--homely-radius-md);

    font-size: 13px;
    font-weight: 650;
}


.homely-sidebar-login {
    border: 1px solid var(--homely-primary);

    background: var(--homely-surface);

    color: var(--homely-primary);
}


.homely-sidebar-login:hover {
    border-color: var(--homely-primary);

    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


.homely-sidebar-post {
    border: 1px solid var(--homely-primary);

    background: var(--homely-primary);

    color: #ffffff;
}


.homely-sidebar-post:hover {
    border-color: var(--homely-primary-hover);

    background: var(--homely-primary-hover);

    color: #ffffff;
}


/* ==========================================================
   FOCUS ACCESSIBILITY
========================================================== */

.homely-nav__link:focus-visible,
.homely-icon-button:focus-visible,
.homely-mobile-toggle:focus-visible,
.homely-sidebar-link:focus-visible,
.homely-sidebar-close:focus-visible,
.homely-login-btn:focus-visible,
.homely-post-btn:focus-visible {

    outline: 2px solid var(--homely-primary);

    outline-offset: 2px;
}


/* ==========================================================
   DEMO AREA
========================================================== */

.demo-content {
    padding: 60px 0;

    background: var(--homely-body-bg);
}


.demo-box {
    padding: 45px;

    border: 1px solid var(--homely-border);

    border-radius: var(--homely-radius-xl);

    background: var(--homely-surface);

    box-shadow: var(--homely-shadow-sm);
}


.demo-label {
    display: inline-flex;

    margin-bottom: 12px;

    color: var(--homely-primary);

    font-size: 13px;
    font-weight: 700;
}


.demo-box h1 {
    max-width: 650px;

    margin-bottom: 14px;

    color: var(--homely-text-primary);

    font-size: 42px;
    font-weight: 750;

    letter-spacing: -1.4px;
}


.demo-box p {
    max-width: 620px;

    margin: 0;

    color: var(--homely-text-secondary);

    font-size: 15px;
    line-height: 1.7;
}


/* ==========================================================
   <= 1199px
========================================================== */

@media (max-width: 1199.98px) {

    .homely-nav {
        margin-left: 35px;
    }


    .homely-nav__link {
        padding-left: 10px;
        padding-right: 10px;
    }

}


/* ==========================================================
   <= 991px
   TABLET + MOBILE
========================================================== */

@media (max-width: 991.98px) {

    :root {
        --homely-header-height: 64px;
    }


    .homely-container {
        padding-left: 14px;
        padding-right: 14px;
    }


    .homely-logo__name {
        font-size: 18px;
    }


    .homely-logo__tagline {
        display: none;
    }


    .homely-logo__icon {
        width: 30px;
        height: 30px;

        font-size: 27px;
    }


    .homely-actions {
        gap: 2px;
    }


    .demo-content {
        padding-top: 30px;
    }


    .demo-box {
        padding: 30px;
    }


    .demo-box h1 {
        font-size: 34px;
    }

}


/* ==========================================================
   <= 575px
========================================================== */

@media (max-width: 575.98px) {

    .homely-container {
        padding-left: 10px;
        padding-right: 10px;
    }


    .homely-mobile-toggle {
        margin-right: 2px;
    }


    .homely-header-left {
        min-width: 0;
    }


    .homely-logo {
        gap: 6px;
    }


    .homely-logo__name {
        font-size: 17px;
    }


    .homely-icon-button {
        width: 38px;
        height: 38px;

        font-size: 20px;
    }


    .homely-sidebar {
        max-width: 88vw;
    }


    .demo-box {
        padding: 24px 20px;
    }


    .demo-box h1 {
        font-size: 29px;

        letter-spacing: -0.8px;
    }

}


/* ==========================================================
   <= 375px
========================================================== */

@media (max-width: 375px) {

    .homely-logo__name {
        font-size: 16px;
    }


    .homely-logo__icon {
        font-size: 25px;
    }


    .homely-mobile-toggle {
        width: 38px;
    }

}



/* ==========================================================
   PROPERTY HERO CONFIG
========================================================== */

:root {

    /*
    |--------------------------------------------------------------------------
    | Hero Image
    |--------------------------------------------------------------------------
    |
    | Bas yahan apni final property image ka path change karna hai.
    |
    */

    --homely-hero-image:
        url("../img/property-hero.webp");


    /* Hero */

    --homely-hero-height: 480px;

    --homely-hero-overlay-left:
        rgba(7, 26, 45, 0.78);

    --homely-hero-overlay-middle:
        rgba(7, 26, 45, 0.35);

    --homely-hero-overlay-right:
        rgba(7, 26, 45, 0.08);


    /* Search Panel */

    --homely-search-panel-bg: #ffffff;

    --homely-search-panel-border: #e5eaf0;

    --homely-search-field-bg: #ffffff;

    --homely-search-field-border: #e4e9ef;

    --homely-search-placeholder: #8993a4;

    --homely-search-panel-shadow:
        0 12px 35px rgba(18, 38, 63, 0.12);

}


/* ==========================================================
   HERO
========================================================== */

.homely-property-hero {
    position: relative;

    min-height: var(--homely-hero-height);

    margin: 0;

    overflow: visible;

    background: #172b3f;
}


/* ==========================================================
   BACKGROUND IMAGE
========================================================== */

.homely-property-hero__background {
    position: absolute;

    inset: 0;

    background-image: var(--homely-hero-image);

    background-size: cover;

    background-repeat: no-repeat;

    background-position: center 51%;

    z-index: 1;
}


/* ==========================================================
   IMAGE OVERLAY
========================================================== */

.homely-property-hero__overlay {
    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        linear-gradient(
            90deg,
            var(--homely-hero-overlay-left) 0%,
            rgba(7, 26, 45, 0.65) 26%,
            var(--homely-hero-overlay-middle) 51%,
            var(--homely-hero-overlay-right) 78%,
            rgba(7, 26, 45, 0.04) 100%
        );
}


/* ==========================================================
   CONTENT
========================================================== */

.homely-property-hero .homely-container {
    min-height: var(--homely-hero-height);

    z-index: 3;
}


.homely-property-hero__content {
    max-width: 640px;

    padding-top: 48px;
}


/* ==========================================================
   TRUST BADGE
========================================================== */

.homely-hero-trust {
    width: fit-content;

    min-height: 34px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    padding: 4px 11px 4px 5px;

    margin-bottom: 18px;

    border: 1px solid rgba(255, 255, 255, 0.16);

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.12);

    backdrop-filter: blur(8px);

    -webkit-backdrop-filter: blur(8px);

    color: #ffffff;
}


.homely-hero-trust__avatars {
    display: flex;

    align-items: center;
}


.homely-hero-trust__avatars span {
    width: 25px;

    height: 25px;

    display: block;

    overflow: hidden;

    margin-left: -7px;

    border: 2px solid rgba(255, 255, 255, 0.95);

    border-radius: 50%;

    background: #d9e2eb;
}


.homely-hero-trust__avatars span:first-child {
    margin-left: 0;
}


.homely-hero-trust__avatars img {
    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;
}


.homely-hero-trust__text {
    font-size: 10px;

    font-weight: 600;

    line-height: 1;

    white-space: nowrap;

    color: rgba(255, 255, 255, 0.95);
}


/* ==========================================================
   TITLE
========================================================== */

.homely-property-hero__title {
    max-width: 610px;

    margin: 0;

    color: #ffffff;

    font-size: clamp(40px, 4vw, 56px);

    font-weight: 700;

    line-height: 1.08;

    letter-spacing: -1.7px;
}


.homely-property-hero__title span {
    color: #55a8f7;
}


/* ==========================================================
   DESCRIPTION
========================================================== */

.homely-property-hero__description {
    max-width: 560px;

    margin: 14px 0 0;

    color: rgba(255, 255, 255, 0.88);

    font-size: 14px;

    font-weight: 400;

    line-height: 1.55;
}


/* ==========================================================
   SEARCH PANEL
========================================================== */

.homely-property-search {
    position: absolute;

    left: 26px;
    right: 26px;

    bottom: 18px;

    z-index: 5;

    padding: 0 15px 13px;

    border: 1px solid rgba(255, 255, 255, 0.52);

    border-radius: 12px;

    background: var(--homely-search-panel-bg);

    box-shadow: var(--homely-search-panel-shadow);
}


/* ==========================================================
   TABS WRAPPER
========================================================== */

.homely-property-tabs-wrapper {
    overflow-x: auto;

    overflow-y: hidden;

    scrollbar-width: none;
}


.homely-property-tabs-wrapper::-webkit-scrollbar {
    display: none;
}


.homely-property-tabs {
    min-width: max-content;

    display: flex;

    align-items: center;

    gap: 4px;

    padding-top: 7px;

    border-bottom: 1px solid var(--homely-border-soft);
}


/* ==========================================================
   TAB
========================================================== */

.homely-property-tab {
    min-width: 78px;

    height: 42px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 0 18px;

    border: 0;

    border-radius: 6px;

    background: transparent;

    color: var(--homely-text-primary);

    font-family: inherit;

    font-size: 12px;

    font-weight: 600;

    white-space: nowrap;

    transition:
        background var(--homely-transition),
        color var(--homely-transition);
}


.homely-property-tab:hover {
    color: var(--homely-primary);

    background: var(--homely-primary-soft);
}


.homely-property-tab.active {
    background: var(--homely-primary);

    color: #ffffff;

    box-shadow:
        0 4px 12px rgba(12, 79, 138, 0.18);
}


/* ==========================================================
   FORM
========================================================== */

.homely-property-search__form {
    padding-top: 10px;
}


/* ==========================================================
   SEARCH FIELD
========================================================== */

.homely-search-field {
    height: 54px;

    position: relative;

    padding: 7px 11px 6px;

    border: 1px solid var(--homely-search-field-border);

    border-radius: 7px;

    background: var(--homely-search-field-bg);

    transition:
        border-color var(--homely-transition),
        box-shadow var(--homely-transition);
}


.homely-search-field:focus-within {
    border-color: rgba(12, 79, 138, 0.55);

    box-shadow:
        0 0 0 3px rgba(12, 79, 138, 0.08);
}


/* ==========================================================
   FIELD LABEL
========================================================== */

.homely-search-field label {
    display: block;

    margin: 0 0 1px 25px;

    color: var(--homely-text-primary);

    font-size: 9px;

    font-weight: 650;

    line-height: 1.2;
}


/* ==========================================================
   FIELD CONTROL
========================================================== */

.homely-search-field__control {
    display: flex;

    align-items: center;

    position: relative;

    min-width: 0;
}


.homely-search-field__icon {
    width: 20px;

    height: 20px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    flex: 0 0 auto;

    margin-right: 5px;

    color: var(--homely-text-primary);
}


.homely-search-field__icon svg {
    width: 16px;

    height: 16px;
}


/* ==========================================================
   INPUT / SELECT
========================================================== */

.homely-search-field input,
.homely-search-field select {
    width: 100%;

    height: 25px;

    min-width: 0;

    padding: 0;

    border: 0;

    outline: 0;

    background: transparent;

    box-shadow: none;

    color: var(--homely-text-primary);

    font-family: inherit;

    font-size: 11px;

    font-weight: 500;
}


.homely-search-field input::placeholder {
    color: var(--homely-search-placeholder);

    opacity: 1;
}


.homely-search-field select {
    padding-right: 23px;

    cursor: pointer;

    color: var(--homely-search-placeholder);

    appearance: none;

    -webkit-appearance: none;

    -moz-appearance: none;
}


.homely-select-arrow {
    position: absolute;

    top: 50%;

    right: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--homely-text-secondary);

    pointer-events: none;

    transform: translateY(-50%);
}


.homely-select-arrow svg {
    width: 13px;

    height: 13px;
}


/* ==========================================================
   SEARCH BUTTON
========================================================== */

.homely-property-search__button {
    min-width: 181px;

    height: 54px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    padding: 0 21px;

    border: 1px solid var(--homely-primary);

    border-radius: 7px;

    background:
        linear-gradient(
            135deg,
            var(--homely-primary) 0%,
            var(--homely-primary-hover) 100%
        );

    color: #ffffff;

    font-family: inherit;

    font-size: 12px;

    font-weight: 650;

    white-space: nowrap;

    box-shadow:
        0 6px 15px rgba(12, 79, 138, 0.16);

    transition:
        transform var(--homely-transition),
        background var(--homely-transition),
        box-shadow var(--homely-transition);
}


.homely-property-search__button svg {
    flex: 0 0 auto;

    width: 18px;

    height: 18px;
}


.homely-property-search__button:hover {
    background: var(--homely-primary-hover);

    box-shadow:
        0 9px 20px rgba(12, 79, 138, 0.24);

    transform: translateY(-1px);
}


.homely-property-search__button:active {
    transform: translateY(0);
}


/* ==========================================================
   POPULAR SEARCHES
========================================================== */

.homely-popular-searches {
    display: flex;

    align-items: center;

    gap: 10px;

    padding-top: 9px;

    overflow: hidden;
}


.homely-popular-searches__label {
    flex: 0 0 auto;

    color: var(--homely-text-secondary);

    font-size: 10px;

    font-weight: 600;

    white-space: nowrap;
}


.homely-popular-searches__list {
    display: flex;

    align-items: center;

    gap: 7px;

    overflow-x: auto;

    scrollbar-width: none;
}


.homely-popular-searches__list::-webkit-scrollbar {
    display: none;
}


.homely-popular-searches__list button {
    height: 27px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    flex: 0 0 auto;

    padding: 0 16px;

    border: 1px solid var(--homely-border-soft);

    border-radius: 999px;

    background: var(--homely-surface-soft);

    color: var(--homely-text-secondary);

    font-family: inherit;

    font-size: 9px;

    font-weight: 500;

    white-space: nowrap;

    transition:
        background var(--homely-transition),
        color var(--homely-transition),
        border-color var(--homely-transition);
}


.homely-popular-searches__list button:hover {
    border-color: rgba(12, 79, 138, 0.16);

    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


/* ==========================================================
   1199px
========================================================== */

@media (max-width: 1199.98px) {

    .homely-property-hero__title {
        font-size: 48px;
    }


    .homely-property-search__button {
        min-width: 170px;
    }

}


/* ==========================================================
   TABLET 991px
========================================================== */

@media (max-width: 991.98px) {

    .homely-property-hero {
        min-height: 615px;

        padding-bottom: 20px;
    }


    .homely-property-hero .homely-container {
        min-height: 615px;
    }


    .homely-property-hero__background {
        background-position: 62% center;
    }


    .homely-property-hero__overlay {
        background:
            linear-gradient(
                90deg,
                rgba(7, 26, 45, 0.82) 0%,
                rgba(7, 26, 45, 0.60) 52%,
                rgba(7, 26, 45, 0.23) 100%
            );
    }


    .homely-property-hero__content {
        padding-top: 44px;
    }


    .homely-property-hero__title {
        font-size: 46px;
    }


    .homely-property-search {
        left: 14px;

        right: 14px;

        bottom: 18px;
    }


    .homely-property-search__button {
        width: 100%;
    }

}


/* ==========================================================
   MOBILE 767px
========================================================== */

@media (max-width: 767.98px) {

    .homely-property-hero {
        min-height: auto;

        padding-bottom: 18px;

        /*overflow: hidden;*/
    }


    .homely-property-hero .homely-container {
        min-height: auto;

        padding-bottom: 0;
    }


    /*
    ----------------------------------------------------------
    Mobile background height
    ----------------------------------------------------------
    */

    .homely-property-hero__background {
        height: 370px;

        bottom: auto;

        background-position: 68% center;
    }


    .homely-property-hero__overlay {
        height: 370px;

        bottom: auto;

        background:
            linear-gradient(
                90deg,
                rgba(5, 22, 39, 0.86) 0%,
                rgba(5, 22, 39, 0.62) 62%,
                rgba(5, 22, 39, 0.27) 100%
            );
    }


    /*
    ----------------------------------------------------------
    Hero text
    ----------------------------------------------------------
    */

    .homely-property-hero__content {
        min-height: 370px;

        max-width: 520px;

        display: flex;

        flex-direction: column;

        justify-content: center;

        padding-top: 22px;

        padding-bottom: 82px;
    }


    .homely-hero-trust {
        margin-bottom: 14px;
    }


    .homely-property-hero__title {
        font-size: clamp(36px, 9vw, 44px);

        line-height: 1.08;

        letter-spacing: -1px;
    }


    .homely-property-hero__description {
        max-width: 430px;

        margin-top: 12px;

        font-size: 13px;
    }


    /*
    ----------------------------------------------------------
    Search box becomes normal flow
    ----------------------------------------------------------
    */

    .homely-property-search {
        position: relative;

        left: auto;

        right: auto;

        bottom: auto;

        margin-top: -52px;

        padding: 0 12px 13px;

        border-radius: 13px;
    }


    /*
    ----------------------------------------------------------
    Tabs
    ----------------------------------------------------------
    */

    .homely-property-tabs {
        gap: 2px;
    }


    .homely-property-tab {
        min-width: auto;

        height: 44px;

        padding: 0 17px;

        font-size: 11px;
    }


    /*
    ----------------------------------------------------------
    Fields
    ----------------------------------------------------------
    */

    .homely-search-field {
        height: 58px;

        padding-top: 8px;

        padding-bottom: 7px;
    }


    .homely-search-field label {
        font-size: 10px;
    }


    .homely-search-field input,
    .homely-search-field select {
        font-size: 12px;
    }


    /*
    ----------------------------------------------------------
    Search button
    ----------------------------------------------------------
    */

    .homely-property-search__button {
        min-width: 100%;

        height: 52px;

        font-size: 13px;
    }


    /*
    ----------------------------------------------------------
    Popular
    ----------------------------------------------------------
    */

    .homely-popular-searches {
        display: block;

        padding-top: 12px;
    }


    .homely-popular-searches__label {
        display: block;

        margin-bottom: 7px;

        font-size: 10px;
    }


    .homely-popular-searches__list {
        width: 100%;
    }


    .homely-popular-searches__list button {
        height: 29px;

        padding-left: 14px;

        padding-right: 14px;

        font-size: 10px;
    }

}


/* ==========================================================
   MOBILE 575px
========================================================== */

@media (max-width: 575.98px) {

    .homely-property-hero__background,
    .homely-property-hero__overlay {
        height: 355px;
    }


    .homely-property-hero__background {
        background-position: 65% center;
    }


    .homely-property-hero__content {
        min-height: 355px;

        padding-top: 20px;

        padding-bottom: 75px;
    }


    .homely-hero-trust {
        min-height: 31px;

        padding-right: 9px;
    }


    .homely-hero-trust__avatars span {
        width: 23px;

        height: 23px;
    }


    .homely-hero-trust__text {
        font-size: 9px;
    }


    .homely-property-hero__title {
        font-size: 37px;
    }


    .homely-property-hero__description {
        max-width: 340px;

        font-size: 12px;

        line-height: 1.5;
    }


    .homely-property-search {
        margin-top: -48px;

        border-radius: 12px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-property-hero__title {
        font-size: 33px;
    }


    .homely-property-hero__description {
        font-size: 11px;
    }


    .homely-hero-trust__text {
        max-width: 160px;

        overflow: hidden;

        text-overflow: ellipsis;
    }


    .homely-property-tab {
        padding-left: 14px;

        padding-right: 14px;
    }

}





/* ==========================================================
   REUSABLE CUSTOM SEARCHABLE SELECT
========================================================== */

.homely-custom-select {
    position: relative;

    overflow: visible;
}


/* ==========================================================
   TRIGGER
========================================================== */

.homely-custom-select__trigger {
    width: 100%;
    height: 25px;

    display: flex;
    align-items: center;

    padding: 0 25px 0 0;

    border: 0;
    outline: 0;

    background: transparent;

    color: var(--homely-search-placeholder, #8993a4);

    font-family: inherit;
    font-size: 11px;
    font-weight: 500;

    text-align: left;

    cursor: pointer;
}


.homely-custom-select__selected {
    display: block;

    width: 100%;

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;
}


/* Selected value has value */
.homely-custom-select.has-value
.homely-custom-select__selected {
    color: var(--homely-text-primary, #172033);
}


/* ==========================================================
   ARROW
========================================================== */

.homely-custom-select .homely-select-arrow {
    transition:
        transform 0.2s ease,
        color 0.2s ease;
}


.homely-custom-select.is-open .homely-select-arrow {
    transform:
        translateY(-50%)
        rotate(180deg);

    color: var(--homely-primary, #0c4f8a);
}


/* ==========================================================
   MENU
========================================================== */

.homely-custom-select__menu {
    position: absolute;

    top: calc(100% + 8px);
    left: 0;

    width: 100%;
    min-width: 220px;

    display: none;

    padding: 8px;

    border: 1px solid var(--homely-border, #e4e7ec);

    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 14px 35px rgba(16, 24, 40, 0.14);

    z-index: 1050;
}


.homely-custom-select.is-open
.homely-custom-select__menu {
    display: block;

    animation:
        homelySelectOpen 0.18s ease;
}


@keyframes homelySelectOpen {

    from {
        opacity: 0;

        transform: translateY(-4px);
    }

    to {
        opacity: 1;

        transform: translateY(0);
    }

}


/* ==========================================================
   SEARCH BOX
========================================================== */

.homely-custom-select__search {
    height: 39px;

    display: flex;
    align-items: center;

    gap: 7px;

    padding: 0 10px;

    margin-bottom: 7px;

    border: 1px solid var(--homely-border, #e4e7ec);

    border-radius: 7px;

    background: #ffffff;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


.homely-custom-select__search:focus-within {
    border-color:
        var(--homely-primary, #0c4f8a);

    box-shadow:
        0 0 0 3px rgba(12, 79, 138, 0.07);
}


/* Search Icon */
.homely-custom-select__search-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    color:
        var(--homely-text-secondary, #667085);
}


/* Search Input */
.homely-custom-select__search-input {
    width: 100%;
    height: 100%;

    padding: 0;

    border: 0 !important;
    outline: 0 !important;

    background: transparent;

    box-shadow: none !important;

    color:
        var(--homely-text-primary, #172033);

    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
}


.homely-custom-select__search-input::placeholder {
    color:
        var(--homely-text-muted, #98a2b3);
}


/* ==========================================================
   OPTIONS WRAPPER
========================================================== */

.homely-custom-select__options {
    max-height: 220px;

    overflow-x: hidden;
    overflow-y: auto;

    padding-right: 2px;
}


/* Scrollbar */
.homely-custom-select__options::-webkit-scrollbar {
    width: 4px;
}


.homely-custom-select__options::-webkit-scrollbar-track {
    background: transparent;
}


.homely-custom-select__options::-webkit-scrollbar-thumb {
    border-radius: 20px;

    background: #d0d5dd;
}


/* ==========================================================
   OPTION
========================================================== */

.homely-custom-select__option {
    width: 100%;
    min-height: 39px;

    display: flex;
    align-items: center;

    padding: 8px 10px;

    border: 0;

    border-radius: 6px;

    background: transparent;

    color:
        var(--homely-text-primary, #172033);

    font-family: inherit;
    font-size: 12px;
    font-weight: 500;

    text-align: left;

    cursor: pointer;

    transition:
        background 0.18s ease,
        color 0.18s ease;
}


.homely-custom-select__option:hover {
    background:
        var(--homely-primary-soft, #edf5fc);

    color:
        var(--homely-primary, #0c4f8a);
}


/* Selected Option */
.homely-custom-select__option.is-selected {
    position: relative;

    padding-right: 31px;

    background:
        var(--homely-primary-soft, #edf5fc);

    color:
        var(--homely-primary, #0c4f8a);

    font-weight: 600;
}


/* Selected Check */
.homely-custom-select__option.is-selected::after {
    content: "✓";

    position: absolute;

    top: 50%;
    right: 11px;

    color:
        var(--homely-primary, #0c4f8a);

    font-size: 13px;
    font-weight: 700;

    transform: translateY(-50%);
}


/* ==========================================================
   EMPTY STATE
========================================================== */

.homely-custom-select__empty {
    display: none;

    padding: 17px 10px;

    color:
        var(--homely-text-muted, #98a2b3);

    font-size: 11px;
    font-weight: 500;

    text-align: center;
}


/* ==========================================================
   FIELD OPEN STATE
========================================================== */

.homely-custom-select.is-open {
    border-color:
        var(--homely-primary, #0c4f8a);
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 767.98px) {

    .homely-custom-select__menu {
        min-width: 100%;
    }


    .homely-custom-select__trigger {
        font-size: 12px;
    }


    .homely-custom-select__option {
        min-height: 42px;

        font-size: 12px;
    }

}
/* ==========================================================
   CLEAN EXPLORE DROPDOWN
========================================================== */

.homely-dropdown {
    position: relative;
}


.homely-dropdown__toggle {
    gap: 6px;
}


.homely-dropdown__toggle::after {
    display: none !important;
}


.homely-dropdown-arrow {
    width: 15px;
    height: 15px;

    flex: 0 0 auto;

    transition:
        transform var(--homely-transition),
        color var(--homely-transition);
}


.homely-dropdown__toggle.show
.homely-dropdown-arrow {
    transform: rotate(180deg);
}


/* Menu */

.homely-dropdown__menu {
    width: 270px;

    margin-top: 10px !important;

    padding: 7px;

    border: 1px solid var(--homely-border);

    border-radius: 12px;

    background: var(--homely-surface);

    box-shadow:
        0 18px 45px rgba(16, 24, 40, 0.13);
}


/* Little top arrow */

.homely-dropdown__menu::before {
    content: "";

    position: absolute;

    top: -6px;
    left: 34px;

    width: 12px;
    height: 12px;

    background: #ffffff;

    border-top: 1px solid var(--homely-border);
    border-left: 1px solid var(--homely-border);

    transform: rotate(45deg);
}


/* Dropdown Item */

.homely-dropdown__menu .dropdown-item {
    min-height: 55px;

    display: flex;
    align-items: center;

    padding: 9px 12px;

    border-radius: 8px;

    white-space: normal;

    color: var(--homely-text-primary);

    transition:
        background .2s ease,
        color .2s ease;
}


.homely-dropdown__menu .dropdown-item:hover,
.homely-dropdown__menu .dropdown-item:focus {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


.homely-dropdown__menu .dropdown-item > span {
    display: flex;
    flex-direction: column;

    gap: 2px;
}


.homely-dropdown__menu .dropdown-item strong {
    font-size: 13px;

    font-weight: 650;
}


.homely-dropdown__menu .dropdown-item small {
    color: var(--homely-text-muted);

    font-size: 10px;

    line-height: 1.4;
}


.homely-dropdown__menu .dropdown-item:hover small {
    color: var(--homely-text-secondary);
}


.homely-dropdown__menu .dropdown-divider {
    margin: 5px 4px;

    border-color: var(--homely-border-soft);
}


/* ==========================================================
   MOBILE SIDEBAR
========================================================== */

.homely-sidebar {
    --bs-offcanvas-width: 310px;

    width: 310px;

    max-width: 86vw;

    border: 0 !important;

    background: #ffffff;

    box-shadow:
        16px 0 50px rgba(15, 23, 42, .14);
}


/* ==========================================================
   HEADER
========================================================== */

.homely-sidebar__header {
    min-height: 77px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 14px 15px 14px 24px;

    border-bottom:
        1px solid var(--homely-border-soft);

    background: #ffffff;
}


/* Brand */

.homely-sidebar-brand {
    min-width: 0;

    display: flex;
    flex-direction: column;

    color: var(--homely-text-primary);

    line-height: 1;
}


.homely-sidebar-brand:hover {
    color: var(--homely-text-primary);
}


.homely-sidebar-brand__name {
    font-size: 20px;

    font-weight: 720;

    letter-spacing: -0.5px;
}


.homely-sidebar-brand__tagline {
    margin-top: 5px;

    color: var(--homely-text-muted);

    font-size: 8px;

    font-weight: 500;
}


/* ==========================================================
   CLOSE
========================================================== */

.homely-sidebar-close {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 1px solid var(--homely-border-soft);

    border-radius: 50%;

    background: var(--homely-surface-soft);

    color: var(--homely-text-primary);

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease,
        transform .2s ease;
}


.homely-sidebar-close svg {
    width: 18px;
    height: 18px;
}


.homely-sidebar-close:hover {
    border-color: rgba(12, 79, 138, .12);

    background: var(--homely-primary-soft);

    color: var(--homely-primary);

    transform: rotate(5deg);
}


/* ==========================================================
   BODY
========================================================== */

.homely-sidebar__body {
    flex: 1;

    overflow-x: hidden;
    overflow-y: auto;

    padding: 17px 15px 20px;
}


.homely-sidebar-section-title {
    padding: 1px 10px 9px;

    color: var(--homely-text-muted);

    font-size: 10px;

    font-weight: 700;

    letter-spacing: .9px;

    text-transform: uppercase;
}


/* ==========================================================
   MENU
========================================================== */

.homely-sidebar-menu {
    display: flex;
    flex-direction: column;

    gap: 2px;
}


.homely-sidebar-link {
    position: relative;

    width: 100%;

    min-height: 48px;

    display: flex;
    align-items: center;

    padding: 0 14px;

    border: 0;

    border-radius: 9px;

    background: transparent;

    color: var(--homely-text-primary);

    font-family: inherit;

    font-size: 14px;

    font-weight: 580;

    text-align: left;

    cursor: pointer;

    transition:
        color .2s ease,
        background .2s ease;
}


.homely-sidebar-link:hover {
    background: #f7f9fc;

    color: var(--homely-primary);
}


/* Active */

.homely-sidebar-link.active {
    padding-left: 18px;

    background: var(--homely-primary-soft);

    color: var(--homely-primary);

    font-weight: 650;
}


.homely-sidebar-link.active::before {
    content: "";

    position: absolute;

    top: 13px;
    bottom: 13px;
    left: 7px;

    width: 3px;

    border-radius: 20px;

    background: var(--homely-primary);
}


/* Text */

.homely-sidebar-link__text {
    flex: 1;

    display: block;
}


/* ==========================================================
   EXPLORE ARROW
========================================================== */

.sidebar-arrow {
    width: 17px;
    height: 17px;

    flex: 0 0 auto;

    color: var(--homely-text-secondary);

    transition:
        transform .2s ease,
        color .2s ease;
}


.homely-sidebar-collapse[aria-expanded="true"] {
    color: var(--homely-primary);

    background: var(--homely-primary-soft);
}


.homely-sidebar-collapse[aria-expanded="true"]
.sidebar-arrow {
    color: var(--homely-primary);

    transform: rotate(180deg);
}


/* ==========================================================
   SUB MENU
========================================================== */

.homely-sidebar-submenu {
    position: relative;

    margin:
        4px
        0
        7px
        15px;

    padding:
        3px
        0
        3px
        13px;

    border-left:
        1px solid var(--homely-border);
}


.homely-sidebar-submenu a {
    min-height: 39px;

    display: flex;
    align-items: center;

    padding: 6px 12px;

    border-radius: 7px;

    color: var(--homely-text-secondary);

    font-size: 12px;

    font-weight: 520;

    transition:
        color .2s ease,
        background .2s ease;
}


.homely-sidebar-submenu a:hover {
    background: var(--homely-primary-soft);

    color: var(--homely-primary);
}


/* Divider */

.homely-sidebar-divider {
    height: 1px;

    margin: 10px 10px;

    background: var(--homely-border-soft);
}


/* ==========================================================
   FOOTER
========================================================== */

.homely-sidebar__footer {
    display: flex;
    flex-direction: column;

    gap: 9px;

    padding:
        13px
        15px
        max(14px, env(safe-area-inset-bottom));

    border-top:
        1px solid var(--homely-border-soft);

    background: #ffffff;
}


.homely-sidebar-login,
.homely-sidebar-post {
    width: 100%;

    min-height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    font-size: 13px;

    font-weight: 650;
}


.homely-sidebar-login {
    border:
        1px solid var(--homely-primary);

    background: #ffffff;

    color: var(--homely-primary);
}


.homely-sidebar-login:hover {
    border-color:
        var(--homely-primary);

    background:
        var(--homely-primary-soft);

    color:
        var(--homely-primary);
}


.homely-sidebar-post {
    border:
        1px solid var(--homely-primary);

    background:
        var(--homely-primary);

    color: #ffffff;
}


.homely-sidebar-post:hover {
    border-color:
        var(--homely-primary-hover);

    background:
        var(--homely-primary-hover);

    color: #ffffff;
}


/* ==========================================================
   SCROLLBAR
========================================================== */

.homely-sidebar__body {
    scrollbar-width: thin;

    scrollbar-color:
        #d0d5dd
        transparent;
}


.homely-sidebar__body::-webkit-scrollbar {
    width: 4px;
}


.homely-sidebar__body::-webkit-scrollbar-track {
    background: transparent;
}


.homely-sidebar__body::-webkit-scrollbar-thumb {
    border-radius: 20px;

    background: #d0d5dd;
}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 575.98px) {

    .homely-sidebar {
        width: min(310px, 88vw);

        max-width: 88vw;
    }


    .homely-sidebar__header {
        padding-left: 20px;
    }


    .homely-sidebar-link {
        min-height: 47px;
    }

}



/* ==========================================================
   PROPERTY TYPES SECTION
========================================================== */

.homely-property-types {
    width: 100%;

    padding: 18px 0 20px;

    background: #ffffff;

    border-top: 1px solid var(--homely-border-soft);
    border-bottom: 1px solid var(--homely-border-soft);
}


/* ==========================================================
   SCROLL WRAPPER
========================================================== */

.homely-property-types__scroll {
    width: 100%;

    overflow-x: auto;
    overflow-y: hidden;

    scrollbar-width: none;

    -webkit-overflow-scrolling: touch;
}


.homely-property-types__scroll::-webkit-scrollbar {
    display: none;
}


/* ==========================================================
   LIST
========================================================== */

.homely-property-types__list {
    display: grid;

    grid-template-columns: repeat(7, minmax(110px, 1fr));

    gap: 18px;

    width: 100%;
}


/* ==========================================================
   CARD
========================================================== */

.homely-property-type-card {
    min-width: 0;

    height: 104px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 8px;

    padding: 11px 8px;

    border: 1px solid var(--homely-border-soft);

    border-radius: 9px;

    background: #ffffff;

    color: var(--homely-text-primary);

    font-family: inherit;

    cursor: pointer;

    box-shadow:
        0 3px 12px rgba(16, 24, 40, 0.035);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease,
        background .22s ease;
}


/* Hover */

.homely-property-type-card:hover {
    border-color:
        rgba(12, 79, 138, .18);

    background:
        var(--homely-primary-soft);

    box-shadow:
        0 8px 22px rgba(16, 24, 40, .08);

    transform:
        translateY(-2px);
}


/* ==========================================================
   ICON
========================================================== */

.homely-property-type-card__icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;
}


.homely-property-type-card__icon svg {
    width: 46px;
    height: 46px;

    display: block;
}


/* ==========================================================
   NAME
========================================================== */

.homely-property-type-card__name {
    width: 100%;

    display: block;

    color: var(--homely-text-primary);

    font-size: 11px;

    font-weight: 600;

    line-height: 1.25;

    text-align: center;

    white-space: nowrap;
}


/* ==========================================================
   ACTIVE
========================================================== */

.homely-property-type-card.active {
    border-color:
        rgba(12, 79, 138, .28);

    background:
        var(--homely-primary-soft);

    box-shadow:
        0 5px 16px rgba(12, 79, 138, .08);
}


.homely-property-type-card.active
.homely-property-type-card__name {
    color:
        var(--homely-primary);
}


/* ==========================================================
   LARGE DESKTOP
========================================================== */

@media (min-width: 1200px) {

    .homely-property-types__list {
        gap: 18px;
    }


    .homely-property-type-card {
        height: 105px;
    }

}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .homely-property-types {
        padding:
            16px 0 18px;
    }


    .homely-property-types__list {
        grid-template-columns:
            repeat(7, 120px);

        gap: 12px;

        width: max-content;

        padding-right: 14px;
    }


    .homely-property-type-card {
        width: 120px;

        height: 100px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-property-types {
        padding:
            14px 0 16px;
    }


    /*
    | Slightly bleed till right side so next card
    | visible rahe and user ko swipe ka hint mile.
    */

    .homely-property-types__scroll {
        width:
            calc(100% + 14px);
    }


    .homely-property-types__list {
        grid-template-columns:
            repeat(7, 108px);

        gap: 10px;

        width: max-content;

        padding-right: 16px;
    }


    .homely-property-type-card {
        width: 108px;

        height: 94px;

        gap: 6px;

        padding: 9px 6px;

        border-radius: 8px;
    }


    .homely-property-type-card__icon {
        width: 42px;
        height: 42px;
    }


    .homely-property-type-card__icon svg {
        width: 41px;
        height: 41px;
    }


    .homely-property-type-card__name {
        font-size: 10px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-property-types__list {
        grid-template-columns:
            repeat(7, 101px);

        gap: 9px;
    }


    .homely-property-type-card {
        width: 101px;

        height: 91px;
    }


    .homely-property-type-card__icon {
        width: 39px;
        height: 39px;
    }


    .homely-property-type-card__icon svg {
        width: 38px;
        height: 38px;
    }


    .homely-property-type-card__name {
        font-size: 12px;
    }

}



/* ==========================================================
   FEATURED PROPERTIES
========================================================== */

.homely-featured-properties {
    padding: 34px 0 40px;

    background: #ffffff;
            overflow: hidden;
}


/* ==========================================================
   SECTION HEADER
========================================================== */

.homely-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 18px;
}


.homely-section-head__content h2 {
    margin: 0;

    color: var(--homely-text-primary);

    font-size: 24px;
    font-weight: 720;

    line-height: 1.2;

    letter-spacing: -0.5px;
}


.homely-section-head__content p {
    margin: 5px 0 0;

    color: var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 450;
}


.homely-section-head__link {
    display: inline-flex;
    align-items: center;

    gap: 6px;

    padding-bottom: 2px;

    color: var(--homely-primary);

    font-size: 11px;
    font-weight: 650;

    white-space: nowrap;
}


.homely-section-head__link svg {
    width: 16px;
    height: 16px;

    transition: transform .2s ease;
}


.homely-section-head__link:hover {
    color: var(--homely-primary-hover);
}


.homely-section-head__link:hover svg {
    transform: translateX(3px);
}


/* ==========================================================
   GRID
========================================================== */

.homely-featured-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 18px;
}


/* ==========================================================
   CARD
========================================================== */

.homely-property-card {
    min-width: 0;

    overflow: hidden;

    border:
        1px solid var(--homely-border-soft);

    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 4px 16px rgba(16, 24, 40, .055);

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}


.homely-property-card:hover {
    border-color:
        rgba(12, 79, 138, .12);

    box-shadow:
        0 13px 30px rgba(16, 24, 40, .10);

    transform: translateY(-3px);
}


/* ==========================================================
   IMAGE
========================================================== */

.homely-property-card__media {
    position: relative;

    height: 190px;

    overflow: hidden;

    background: #edf1f5;
}


.homely-property-card__media img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .45s ease;
}


.homely-property-card:hover
.homely-property-card__media img {
    transform: scale(1.035);
}


/* ==========================================================
   BADGE
========================================================== */

.homely-property-badge {
    position: absolute;

    top: 11px;
    left: 11px;

    min-height: 24px;

    display: inline-flex;
    align-items: center;

    gap: 4px;

    padding: 0 9px;

    border-radius: 5px;

    color: #ffffff;

    font-size: 9px;
    font-weight: 650;

    box-shadow:
        0 4px 10px rgba(0, 0, 0, .08);
}


.homely-property-badge svg {
    width: 12px;
    height: 12px;
}


.homely-property-badge.verified {
    background: #2ebc74;
}


.homely-property-badge.featured {
    background: #f59e37;
}


.homely-property-badge.sale {
    background: #ef4f4f;
}


/* ==========================================================
   WISHLIST
========================================================== */

.homely-property-wishlist {
    position: absolute;

    top: 10px;
    right: 10px;

    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border:
        1px solid rgba(255, 255, 255, .7);

    border-radius: 50%;

    background:
        rgba(255, 255, 255, .82);

    backdrop-filter: blur(6px);

    color: #607080;

    cursor: pointer;

    transition:
        color .2s ease,
        background .2s ease,
        transform .2s ease;
}


.homely-property-wishlist svg {
    width: 17px;
    height: 17px;
}


.homely-property-wishlist:hover {
    background: #ffffff;

    color: #e64c5f;

    transform: scale(1.05);
}


.homely-property-wishlist.active {
    background: #fff0f2;

    color: #e34659;
}


.homely-property-wishlist.active svg {
    fill: currentColor;
}


/* ==========================================================
   BODY
========================================================== */

.homely-property-card__body {
    padding: 13px 13px 12px;
}


.homely-property-price {
    margin-bottom: 3px;

    color: var(--homely-text-primary);

    font-size: 18px;
    font-weight: 720;

    line-height: 1.2;
}


.homely-property-title {
    margin: 0;

    overflow: hidden;

    color: var(--homely-text-primary);

    font-size: 15px;
    font-weight: 650;

    line-height: 1.45;

    white-space: nowrap;

    text-overflow: ellipsis;
}


/* ==========================================================
   LOCATION
========================================================== */

.homely-property-location {
    display: flex;
    align-items: center;

    gap: 4px;

    margin-top: 7px;

    color: var(--homely-text-secondary);

    font-size: 12px;
}


.homely-property-location svg {
    width: 12px;
    height: 12px;

    flex: 0 0 auto;
}


.homely-property-location span {
    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;
}


/* ==========================================================
   SPECS
========================================================== */

.homely-property-specs {
        display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 5px;
    color: var(--homely-text-secondary);
    font-size: 12px;
    white-space: nowrap;
}


.homely-property-specs > span {
    display: inline-flex;
    align-items: center;

    gap: 4px;
}


.homely-property-specs svg {
    width: 13px;
    height: 13px;
}


/* ==========================================================
   AGENT
========================================================== */

.homely-property-agent {
    min-height: 59px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    padding: 10px 12px;

    border-top:
        1px solid var(--homely-border-soft);
}


.homely-property-agent__profile {
    min-width: 0;

    display: flex;
    align-items: center;

    gap: 8px;
}


.homely-property-agent__profile > img {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    border-radius: 50%;

    object-fit: cover;

    background: var(--homely-surface-soft);
}


.homely-property-agent__profile > div {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: 2px;
}


.homely-property-agent__profile strong {
    overflow: hidden;

    color: var(--homely-text-primary);

    font-size: 14px !important;
    font-weight: 650;

    white-space: nowrap;

    text-overflow: ellipsis;
}


.homely-property-agent__profile small {
    display: flex;
    align-items: center;

    gap: 4px;

    color: var(--homely-text-muted);

    font-size: 7.5px;
}


.homely-property-agent__profile small > span {
    width: 5px;
    height: 5px;

    display: inline-block;

    border-radius: 50%;

    background: #2fbd76;
}


/* ==========================================================
   AGENT ACTIONS
========================================================== */

.homely-property-agent__actions {
    display: flex;
    align-items: center;

    gap: 6px;
}


.homely-agent-action {
    width: 29px;
    height: 29px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 29px;

    border-radius: 50%;

    font-size: 10px;
    font-weight: 700;

    transition:
        transform .2s ease,
        background .2s ease;
}


.homely-agent-action svg {
    width: 15px;
    height: 15px;
}


.homely-agent-action.phone {
    background: #eaf5ff;

    color: #1766a5;
}


.homely-agent-action.whatsapp {
    background: #e9fbf1;

    color: #1aa763;
}


.homely-agent-action:hover {
    transform: translateY(-2px);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1199.98px) {

    .homely-featured-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 16px;
    }


    .homely-property-card__media {
        height: 220px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-featured-properties {
        padding:
            26px 0 30px;
    }


    .homely-section-head {
        align-items: center;

        margin-bottom: 15px;
    }


    .homely-section-head__content h2 {
        font-size: 20px;
    }


    .homely-section-head__content p {
        font-size: 10px;
    }


    .homely-section-head__link span {
        display: none;
    }


    .homely-section-head__link {
        width: 34px;
        height: 34px;

        justify-content: center;

        padding: 0;

        border:
            1px solid var(--homely-border-soft);

        border-radius: 50%;

        background: #ffffff;
    }


    /*
    | Horizontal cards
    */

    .homely-featured-scroll {
        width:
            calc(100% + 14px);

        overflow-x: auto;
        overflow-y: hidden;

        margin-right: -14px;

        scrollbar-width: none;

        -webkit-overflow-scrolling: touch;

        scroll-snap-type:
            x mandatory;
    }


    .homely-featured-scroll::-webkit-scrollbar {
        display: none;
    }


    .homely-featured-grid {
        width: max-content;

        display: flex;

        gap: 12px;

        padding-right: 16px;
    }


    .homely-property-card {
        width: 280px;

        flex: 0 0 280px;

        scroll-snap-align: start;
    }


    .homely-property-card__media {
        height: 180px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-property-card {
        width: 265px;

        flex-basis: 265px;
    }


    .homely-property-card__media {
        height: 172px;
    }


    .homely-property-specs {
        gap: 10px;
    }

}



/* ==========================================================
   EXPLORE PROPERTIES BY CITY
========================================================== */

.homely-city-properties {
    width: 100%;

    padding: 34px 0 42px;

    background: #ffffff;

    border-top:
        1px solid var(--homely-border-soft);
}


/* ==========================================================
   HEADER
========================================================== */

.homely-city-properties__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 17px;
}


.homely-city-properties__heading h2 {
    margin: 0;

    color:
        var(--homely-text-primary);

    font-size: 24px;
    font-weight: 720;

    line-height: 1.2;

    letter-spacing: -0.5px;
}


.homely-city-properties__heading p {
    margin: 5px 0 0;

    color:
        var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 450;

    line-height: 1.4;
}


/* ==========================================================
   VIEW ALL
========================================================== */

.homely-city-properties__view-all {
    display: inline-flex;
    align-items: center;

    gap: 6px;

    padding-bottom: 2px;

    color:
        var(--homely-primary);

    font-size: 11px;
    font-weight: 650;

    white-space: nowrap;

    transition:
        color .2s ease;
}


.homely-city-properties__view-all svg {
    width: 16px;
    height: 16px;

    transition:
        transform .2s ease;
}


.homely-city-properties__view-all:hover {
    color:
        var(--homely-primary-hover);
}


.homely-city-properties__view-all:hover svg {
    transform: translateX(3px);
}


/* ==========================================================
   GRID
========================================================== */

.homely-city-properties__grid {
    display: grid;

    grid-template-columns:
        repeat(6, minmax(0, 1fr));

    gap: 16px;
}


/* ==========================================================
   CITY CARD
========================================================== */

.homely-city-card {
    position: relative;

    min-width: 0;

    height: 185px;

    display: block;

    overflow: hidden;

    border-radius: 9px;

    background: #e9eef3;

    box-shadow:
        0 3px 13px rgba(16, 24, 40, .06);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


.homely-city-card:hover {
    box-shadow:
        0 12px 26px rgba(16, 24, 40, .14);

    transform:
        translateY(-3px);
}


/* ==========================================================
   IMAGE
========================================================== */

.homely-city-card > img {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .5s ease;
}


.homely-city-card:hover > img {
    transform:
        scale(1.055);
}


/* ==========================================================
   GRADIENT
========================================================== */

.homely-city-card__overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(5, 18, 30, .02) 0%,
            rgba(5, 18, 30, .08) 42%,
            rgba(5, 18, 30, .84) 100%
        );

    z-index: 1;

    transition:
        background .25s ease;
}


.homely-city-card:hover
.homely-city-card__overlay {
    background:
        linear-gradient(
            180deg,
            rgba(5, 18, 30, .02) 0%,
            rgba(5, 18, 30, .13) 42%,
            rgba(5, 18, 30, .91) 100%
        );
}


/* ==========================================================
   CONTENT
========================================================== */

.homely-city-card__content {
    position: absolute;

    left: 13px;
    right: 13px;
    bottom: 12px;

    z-index: 2;
}


.homely-city-card__content h3 {
    margin: 0;

    color: #ffffff;

    font-size: 15px;
    font-weight: 680;

    line-height: 1.2;

    text-shadow:
        0 1px 4px rgba(0, 0, 0, .25);
}


.homely-city-card__content p {
    margin: 4px 0 0;

    color:
        rgba(255, 255, 255, .90);

    font-size: 9px;
    font-weight: 520;

    line-height: 1.2;
}


/* ==========================================================
   LARGE SCREENS
========================================================== */

@media (min-width: 1400px) {

    .homely-city-card {
        height: 190px;
    }

}


/* ==========================================================
   1199px
========================================================== */

@media (max-width: 1199.98px) {

    .homely-city-properties__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));

        gap: 14px;
    }


    .homely-city-card {
        height: 210px;
    }

}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .homely-city-properties {
        padding:
            30px 0 35px;
    }


    .homely-city-properties__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));

        gap: 12px;
    }


    .homely-city-card {
        height: 185px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-city-properties {
        padding:
            26px 0 30px;
    }


    .homely-city-properties__header {
        align-items: center;

        margin-bottom: 15px;
    }


    .homely-city-properties__heading h2 {
        font-size: 20px;

        letter-spacing: -0.3px;
    }


    .homely-city-properties__heading p {
        font-size: 10px;
    }


    /*
    |--------------------------------------------------------------------------
    | Mobile View All
    |--------------------------------------------------------------------------
    */

    .homely-city-properties__view-all span {
        display: none;
    }


    .homely-city-properties__view-all {
        width: 34px;
        height: 34px;

        flex: 0 0 34px;

        display: flex;
        align-items: center;
        justify-content: center;

        padding: 0;

        border:
            1px solid var(--homely-border-soft);

        border-radius: 50%;

        background: #ffffff;
    }


    /*
    |--------------------------------------------------------------------------
    | Horizontal Scroll
    |--------------------------------------------------------------------------
    */

    .homely-city-properties__scroll {
        width:
            calc(100% + 14px);

        overflow-x: auto;
        overflow-y: hidden;

        margin-right: -14px;

        padding-bottom: 2px;

        scrollbar-width: none;

        -webkit-overflow-scrolling: touch;

        scroll-snap-type:
            x mandatory;
    }


    .homely-city-properties__scroll::-webkit-scrollbar {
        display: none;
    }


    .homely-city-properties__grid {
        width: max-content;

        display: flex;

        gap: 11px;

        padding-right: 16px;
    }


    .homely-city-card {
        width: 150px;
        height: 175px;

        flex: 0 0 150px;

        scroll-snap-align: start;

        border-radius: 9px;
    }


    .homely-city-card__content {
        left: 11px;
        right: 11px;
        bottom: 11px;
    }


    .homely-city-card__content h3 {
        font-size: 14px;
    }


    .homely-city-card__content p {
        font-size: 8.5px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-city-card {
        width: 140px;
        height: 166px;

        flex-basis: 140px;
    }


    .homely-city-properties__heading h2 {
        font-size: 18px;
    }

}


/* ==========================================================
   FIND PROPERTIES WITHIN YOUR BUDGET
========================================================== */

.homely-budget-properties {
    width: 100%;

    padding: 34px 0 42px;

    background: #ffffff;
}


/* ==========================================================
   HEADING
========================================================== */

.homely-budget-properties__heading {
    margin-bottom: 18px;
}


.homely-budget-properties__heading h2 {
    margin: 0;

    color: var(--homely-text-primary);

    font-size: 24px;
    font-weight: 720;

    line-height: 1.2;

    letter-spacing: -0.5px;
}


.homely-budget-properties__heading p {
    margin: 5px 0 0;

    color: var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 450;

    line-height: 1.4;
}


/* ==========================================================
   GRID
========================================================== */

.homely-budget-properties__grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 16px;
}


/* ==========================================================
   CARD
========================================================== */

.homely-budget-card {
    min-width: 0;

    min-height: 96px;

    display: flex;
    align-items: center;

    gap: 14px;

    padding: 16px 18px;

    border:
        1px solid rgba(16, 24, 40, .025);

    border-radius: 10px;

    color: var(--homely-text-primary);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}


.homely-budget-card:hover {
    color: var(--homely-text-primary);

    border-color:
        rgba(12, 79, 138, .08);

    box-shadow:
        0 10px 25px rgba(16, 24, 40, .08);

    transform:
        translateY(-2px);
}


/* ==========================================================
   CARD BACKGROUNDS
========================================================== */

.homely-budget-card--green {
    background:
        linear-gradient(
            135deg,
            #effbf5 0%,
            #e8f8ef 100%
        );
}


.homely-budget-card--blue {
    background:
        linear-gradient(
            135deg,
            #eff8ff 0%,
            #e7f3fe 100%
        );
}


.homely-budget-card--orange {
    background:
        linear-gradient(
            135deg,
            #fff7f2 0%,
            #fff0e8 100%
        );
}


.homely-budget-card--purple {
    background:
        linear-gradient(
            135deg,
            #f7f3ff 0%,
            #f1eaff 100%
        );
}


/* ==========================================================
   ICON WRAPPER
========================================================== */

.homely-budget-card__icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 48px;

    border-radius: 50%;
}


.homely-budget-card__icon svg {
    width: 24px;
    height: 24px;

    display: block;
}


/* Green */
.homely-budget-card--green
.homely-budget-card__icon {
    background: #d8f5e5;

    color: #20b46c;
}


/* Blue */
.homely-budget-card--blue
.homely-budget-card__icon {
    background: #dceeff;

    color: #258ae5;
}


/* Orange */
.homely-budget-card--orange
.homely-budget-card__icon {
    background: #ffe7d7;

    color: #ff853b;
}


/* Purple */
.homely-budget-card--purple
.homely-budget-card__icon {
    background: #e9ddff;

    color: #7b4dd8;
}


/* ==========================================================
   CARD CONTENT
========================================================== */

.homely-budget-card__content {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: 5px;
}


.homely-budget-card__content strong {
    overflow: hidden;

    color: var(--homely-text-primary);

    font-size: 13px;
    font-weight: 680;

    line-height: 1.25;

    white-space: nowrap;

    text-overflow: ellipsis;
}


.homely-budget-card__content small {
    color: var(--homely-text-secondary);

    font-size: 10px;
    font-weight: 450;

    line-height: 1.25;
}


/* ==========================================================
   1199px
========================================================== */

@media (max-width: 1199.98px) {

    .homely-budget-properties__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 13px;
    }

}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .homely-budget-properties {
        padding:
            30px 0 35px;
    }


    .homely-budget-card {
        min-height: 92px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-budget-properties {
        padding:
            0px 0 0px;
    }


    .homely-budget-properties__heading {
        margin-bottom: 15px;
    }


    .homely-budget-properties__heading h2 {
        font-size: 20px;

        letter-spacing: -0.3px;
    }


    .homely-budget-properties__heading p {
        font-size: 10px;
    }


    /*
    |--------------------------------------------------------------------------
    | Horizontal Swipe
    |--------------------------------------------------------------------------
    */

    .homely-budget-properties__scroll {
        width:
            calc(100% + 14px);

        overflow-x: auto;
        overflow-y: hidden;

        margin-right: -14px;

        scrollbar-width: none;

        -webkit-overflow-scrolling: touch;

        scroll-snap-type:
            x mandatory;
    }


    .homely-budget-properties__scroll::-webkit-scrollbar {
        display: none;
    }


    .homely-budget-properties__grid {
        width: max-content;

        display: flex;

        gap: 11px;

        padding-right: 16px;
    }


    .homely-budget-card {
        width: 255px;

        min-height: 90px;

        flex: 0 0 255px;

        padding: 14px 15px;

        gap: 12px;

        scroll-snap-align: start;
    }


    .homely-budget-card__icon {
        width: 45px;
        height: 45px;

        flex-basis: 45px;
    }


    .homely-budget-card__icon svg {
        width: 22px;
        height: 22px;
    }


    .homely-budget-card__content strong {
        font-size: 12px;
    }


    .homely-budget-card__content small {
        font-size: 9px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-budget-card {
        width: 235px;

        flex-basis: 235px;
    }


    .homely-budget-properties__heading h2 {
        font-size: 18px;
    }

}



/* ==========================================================
   WHY CHOOSE HOMELY
========================================================== */

.homely-why-choose {
    padding: 38px 0 25px;

    background: #ffffff;
}


/* Heading */

.homely-why-choose__heading {
    margin-bottom: 28px;
}


.homely-why-choose__heading h2 {
    margin: 0;

    color: var(--homely-text-primary);

    font-size: 25px;
    font-weight: 720;

    line-height: 1.2;

    letter-spacing: -.5px;
}


.homely-why-choose__heading p {
    margin: 5px 0 0;

    color: var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 450;
}


/* ==========================================================
   TRUST ITEM
========================================================== */

.homely-trust-item {
    min-height: 92px;

    display: flex;
    align-items: center;

    gap: 15px;

    padding: 10px 12px;

    border-radius: 10px;

    transition:
        background .2s ease,
        transform .2s ease;
}


.homely-trust-item:hover {
    background:
        var(--homely-primary-soft);

    transform:
        translateY(-2px);
}


/* Icon */

.homely-trust-item__icon {
    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 52px;

    color: var(--homely-primary);
}


.homely-trust-item__icon svg {
    width: 45px;
    height: 45px;

    display: block;
}


/* Content */

.homely-trust-item__content {
    min-width: 0;
}


.homely-trust-item__content h3 {
    margin: 0;

    color: var(--homely-text-primary);

    font-size: 14px;
    font-weight: 680;

    line-height: 1.3;
}


.homely-trust-item__content p {
    max-width: 180px;

    margin: 5px 0 0;

    color: var(--homely-text-secondary);

    font-size: 10px;
    font-weight: 450;

    line-height: 1.4;
}


/* ==========================================================
   SELL PROPERTY SECTION
========================================================== */

.homely-sell-property {
    padding: 14px 0 42px;

    background: #ffffff;
}


/* Main Box */

.homely-sell-property__box {
    overflow: hidden;

    border:
        1px solid #d9ebfa;

    border-radius: 11px;

    background:
        linear-gradient(
            100deg,
            #f5fbff 0%,
            #eaf6ff 45%,
            #eff9ff 100%
        );

    box-shadow:
        0 5px 18px rgba(16, 24, 40, .04);
}


/* ==========================================================
   IMAGE
========================================================== */

.homely-sell-property__image {
    width: 100%;
    height: 100%;

    min-height: 180px;

    overflow: hidden;
}


.homely-sell-property__image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .5s ease;
}


.homely-sell-property__box:hover
.homely-sell-property__image img {
    transform:
        scale(1.025);
}


/* ==========================================================
   CONTENT
========================================================== */

.homely-sell-property__content {
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 28px 30px;
}


.homely-sell-property__content h2 {
    margin: 0;

    color: var(--homely-primary);

    font-size: 25px;
    font-weight: 720;

    line-height: 1.2;

    letter-spacing: -.4px;
}


.homely-sell-property__content p {
    max-width: 470px;

    margin: 9px 0 17px;

    color: var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 450;

    line-height: 1.55;
}


/* ==========================================================
   CTA BUTTON
========================================================== */

.homely-sell-property__button {
    width: fit-content;

    min-height: 43px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    padding: 0 17px;

    border:
        1px solid var(--homely-primary);

    border-radius: 7px;

    background:
        linear-gradient(
            135deg,
            var(--homely-primary),
            var(--homely-primary-hover)
        );

    color: #ffffff;

    font-size: 11px;
    font-weight: 650;

    box-shadow:
        0 6px 15px rgba(12, 79, 138, .15);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.homely-sell-property__button svg {
    width: 16px;
    height: 16px;

    flex: 0 0 auto;

    transition:
        transform .2s ease;
}


.homely-sell-property__button:hover {
    background:
        var(--homely-primary-hover);

    color: #ffffff;

    box-shadow:
        0 9px 20px rgba(12, 79, 138, .22);

    transform:
        translateY(-1px);
}


.homely-sell-property__button:hover svg {
    transform:
        translateX(3px);
}


/* ==========================================================
   BENEFITS
========================================================== */

.homely-sell-property__benefits {
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 13px;

    padding: 24px 28px;
}


.homely-sell-benefit {
    display: flex;
    align-items: center;

    gap: 8px;

    color: var(--homely-text-primary);

    font-size: 14px;
    font-weight: 580;
}


.homely-sell-benefit > span {
    width: 20px;
    height: 20px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 20px;

    border-radius: 50%;

    background:
        rgba(12, 79, 138, .08);

    color:
        var(--homely-primary);
}


.homely-sell-benefit svg {
    width: 13px;
    height: 13px;
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .homely-why-choose {
        padding:
            32px 0 22px;
    }


    .homely-why-choose__heading {
        margin-bottom: 18px;
    }


    .homely-trust-item {
        min-height: 84px;
    }


    .homely-sell-property__content {
        padding:
            24px 25px;
    }


    /*
    | On tablet benefits move below
    */

    .homely-sell-property__benefits {
        display: grid;

        grid-template-columns:
            repeat(2, 1fr);

        gap: 12px 18px;

        padding:
            16px 25px 22px;

        border-top:
            1px solid rgba(12, 79, 138, .08);
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-why-choose {
        padding:
            26px 0 20px;
    }


    .homely-why-choose__heading {
        margin-bottom: 14px;
    }


    .homely-why-choose__heading h2 {
        font-size: 20px;

        letter-spacing: -.3px;
    }


    .homely-why-choose__heading p {
        font-size: 10px;
    }


    /*
    |--------------------------------------------------------------------------
    | Trust Features
    |--------------------------------------------------------------------------
    */

    .homely-trust-item {
        min-height: 100%;

        align-items: flex-start;

        gap: 10px;

        padding: 12px 8px;

        background:
            #ffffff;

        border:
            1px solid var(--homely-border-soft);

        box-shadow:
            0 3px 12px rgba(16, 24, 40, .035);
    }


    .homely-trust-item__icon {
        width: 38px;
        height: 38px;

        flex-basis: 38px;
    }


    .homely-trust-item__icon svg {
        width: 34px;
        height: 34px;
    }


    .homely-trust-item__content h3 {
        font-size: 14px;
    }


    .homely-trust-item__content p {
        margin-top: 3px;

        font-size: 12px;

        line-height: 1.35;
    }


    /*
    |--------------------------------------------------------------------------
    | CTA
    |--------------------------------------------------------------------------
    */

    .homely-sell-property {
        padding:
            10px 0 30px;
    }


    .homely-sell-property__box {
        border-radius: 12px;
    }


    .homely-sell-property__image {
        min-height: 200px;
        height: 200px;
    }


    .homely-sell-property__content {
        padding:
            21px 18px 18px;
    }


    .homely-sell-property__content h2 {
        font-size: 21px;
    }


    .homely-sell-property__content p {
        margin:
            8px 0 15px;

        font-size: 11px;
    }


    .homely-sell-property__button {
        min-height: 44px;

        font-size: 11px;
    }


    .homely-sell-property__benefits {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 11px;

        padding:
            15px 18px 20px;
    }


    .homely-sell-benefit {
        gap: 6px;

        font-size: 14px;
    }


    .homely-sell-benefit > span {
        width: 18px;
        height: 18px;

        flex-basis: 18px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    /*
    | Why Choose remains 2 columns,
    | but compact for small device
    */

    .homely-trust-item {
        display: block;
    }


    .homely-trust-item__icon {
        margin-bottom: 7px;
    }


    .homely-sell-property__image {
        height: 180px;

        min-height: 180px;
    }


    .homely-sell-property__content h2 {
        font-size: 19px;
    }


    .homely-sell-property__benefits {
        grid-template-columns:
            1fr;
    }


    .homely-sell-benefit {
        font-size: 14px;
    }

}



/* ==========================================================
   LATEST REAL ESTATE INSIGHTS
========================================================== */

.homely-insights {
    width: 100%;

    padding: 36px 0 42px;

    background: #ffffff;

    border-top:
        1px solid var(--homely-border-soft);
}


/* ==========================================================
   HEADER
========================================================== */

.homely-insights__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 18px;
}


.homely-insights__heading h2 {
    margin: 0;

    color:
        var(--homely-text-primary);

    font-size: 24px;
    font-weight: 720;

    line-height: 1.2;

    letter-spacing: -.5px;
}


.homely-insights__heading p {
    margin: 5px 0 0;

    color:
        var(--homely-text-secondary);

    font-size: 12px;
    font-weight: 450;

    line-height: 1.4;
}


/* ==========================================================
   VIEW ALL
========================================================== */

.homely-insights__view-all {
    display: inline-flex;
    align-items: center;

    gap: 6px;

    padding-bottom: 2px;

    color:
        var(--homely-primary);

    font-size: 11px;
    font-weight: 650;

    white-space: nowrap;

    transition:
        color .2s ease;
}


.homely-insights__view-all svg {
    width: 16px;
    height: 16px;

    transition:
        transform .2s ease;
}


.homely-insights__view-all:hover {
    color:
        var(--homely-primary-hover);
}


.homely-insights__view-all:hover svg {
    transform:
        translateX(3px);
}


/* ==========================================================
   GRID
========================================================== */

.homely-insights__grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 20px;
}


/* ==========================================================
   ARTICLE CARD
========================================================== */

.homely-insight-card {
    min-width: 0;

    overflow: hidden;

    border:
        1px solid var(--homely-border-soft);

    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 4px 16px rgba(16, 24, 40, .05);

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}


.homely-insight-card:hover {
    border-color:
        rgba(12, 79, 138, .12);

    box-shadow:
        0 13px 28px rgba(16, 24, 40, .10);

    transform:
        translateY(-3px);
}


/* ==========================================================
   IMAGE
========================================================== */

.homely-insight-card__image {
    position: relative;

    width: 100%;
    height: 220px;

    display: block;

    overflow: hidden;

    background:
        var(--homely-surface-soft);
}


.homely-insight-card__image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .45s ease;
}


.homely-insight-card:hover
.homely-insight-card__image img {
    transform:
        scale(1.04);
}


/* ==========================================================
   BODY
========================================================== */

.homely-insight-card__body {
    position: relative;

    padding:
        19px 14px 14px;
}


/* ==========================================================
   CATEGORY
========================================================== */

.homely-insight-category {
        position: absolute;
    top: -40px;
    left: 13px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0px 15px;
    border: 0px solid #d9eafb;
    border-radius: 3px;
    background: #0c4f8a;
    color: #fff;
    font-size: 12px;
    font-weight: 650;
    box-shadow: 0 3px 8px rgba(16, 24, 40, .06);
}


/* ==========================================================
   TITLE
========================================================== */

.homely-insight-card h3 {
    margin:
        4px 0 0;

    font-size: 15px;
    font-weight: 650;

    line-height: 1.45;
}


.homely-insight-card h3 a {
    display: block;

    overflow: hidden;

    color:
        var(--homely-text-primary);

    white-space: nowrap;

    text-overflow: ellipsis;

    transition:
        color .2s ease;
}


.homely-insight-card h3 a:hover {
    color:
        var(--homely-primary);
}


/* ==========================================================
   META
========================================================== */

.homely-insight-meta {
    display: flex;
    align-items: center;

    gap: 7px;

    margin-top: 10px;

    color:
        var(--homely-text-muted);

       font-size: 13px;
    font-weight: 450;
}


.homely-insight-meta__dot {
    width: 3px;
    height: 3px;

    flex: 0 0 3px;

    border-radius: 50%;

    background:
        var(--homely-text-muted);
}


.homely-insight-read-time {
    display: inline-flex;
    align-items: center;

    gap: 4px;
}


.homely-insight-read-time svg {
    width: 12px;
    height: 12px;
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .homely-insights {
        padding:
            32px 0 36px;
    }


    .homely-insights__grid {
        gap: 14px;
    }


    .homely-insight-card__image {
        height: 150px;
    }


    .homely-insight-card h3 {
        font-size: 13px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-insights {
        padding:
            27px 0 31px;
    }


    /* Header */

    .homely-insights__header {
        align-items: center;

        margin-bottom: 15px;
    }


    .homely-insights__heading h2 {
        font-size: 20px;

        letter-spacing: -.3px;
    }


    .homely-insights__heading p {
        max-width: 240px;

        font-size: 10px;
    }


    /*
    |--------------------------------------------------------------------------
    | Mobile View All Circle
    |--------------------------------------------------------------------------
    */

    .homely-insights__view-all span {
        display: none;
    }


    .homely-insights__view-all {
        width: 34px;
        height: 34px;

        flex: 0 0 34px;

        display: flex;
        align-items: center;
        justify-content: center;

        padding: 0;

        border:
            1px solid var(--homely-border-soft);

        border-radius: 50%;

        background: #ffffff;
    }


    /*
    |--------------------------------------------------------------------------
    | Horizontal Swipe
    |--------------------------------------------------------------------------
    */

    .homely-insights__scroll {
        width:
            calc(100% + 14px);

        overflow-x: auto;
        overflow-y: hidden;

        margin-right: -14px;

        padding-bottom: 3px;

        scrollbar-width: none;

        -webkit-overflow-scrolling: touch;

        scroll-snap-type:
            x mandatory;
    }


    .homely-insights__scroll::-webkit-scrollbar {
        display: none;
    }


    .homely-insights__grid {
        width: max-content;

        display: flex;

        gap: 12px;

        padding-right: 16px;
    }


    .homely-insight-card {
        width: 285px;

        flex: 0 0 285px;

        scroll-snap-align: start;
    }


    .homely-insight-card__image {
        height: 160px;
    }


    .homely-insight-card__body {
        padding:
            14px 13px 13px;
    }


    .homely-insight-card h3 {
        font-size: 13px;
    }


    .homely-insight-category {
        min-height: 26px;

        font-size: 8.5px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-insights__heading h2 {
        font-size: 18px;
    }


    .homely-insight-card {
        width: 265px;

        flex-basis: 265px;
    }


    .homely-insight-card__image {
        height: 150px;
    }

}


/* ==========================================================
   HOMELY FOOTER
========================================================== */

.homely-footer {
    position: relative;

    width: 100%;

    padding:
        40px 0 0;

    overflow: hidden;

    background:
        linear-gradient(
            110deg,
            #09243c 0%,
            #0c3152 48%,
            #09243e 100%
        );

    color: #ffffff;
}


/* subtle glow */
.homely-footer::before {
    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    top: -280px;
    right: 4%;

    border-radius: 50%;

    background:
        rgba(48, 136, 205, .09);

    filter: blur(30px);

    pointer-events: none;
}


/* ==========================================================
   BRAND
========================================================== */

.homely-footer__brand {
    max-width: 330px;
}


/* Logo */

.homely-footer-logo {
    width: fit-content;

    display: inline-flex;
    align-items: center;

    gap: 10px;

    color: #ffffff;
}


.homely-footer-logo:hover {
    color: #ffffff;
}


.homely-footer-logo__icon {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 40px;

    color: #ffffff;
}


.homely-footer-logo__icon svg {
    width: 36px;
    height: 36px;
}


.homely-footer-logo__content {
    display: flex;
    flex-direction: column;

    line-height: 1;
}


.homely-footer-logo__content strong {
    color: #ffffff;

    font-size: 20px;
    font-weight: 700;

    letter-spacing: -.35px;
}


.homely-footer-logo__content small {
    margin-top: 5px;

    color:
        rgba(255, 255, 255, .58);

    font-size: 8px;

    font-weight: 450;
}


/* Description */

.homely-footer__description {
    max-width: 310px;
    margin: 14px 0 16px;
    color: rgba(255, 255, 255, .68);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.65;
}


/* ==========================================================
   SOCIAL
========================================================== */

.homely-footer-social {
    display: flex;
    align-items: center;

    gap: 8px;
}


.homely-footer-social__item {
    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(255, 255, 255, .07);

    border-radius: 50%;

    background:
        rgba(255, 255, 255, .07);

    color:
        rgba(255, 255, 255, .82);

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;
}


.homely-footer-social__item svg {
    width: 15px;
    height: 15px;
}


.homely-footer-social__item:hover {
    border-color:
        rgba(255, 255, 255, .16);

    background:
        rgba(255, 255, 255, .14);

    color: #ffffff;

    transform:
        translateY(-2px);
}


/* ==========================================================
   FOOTER COLUMNS
========================================================== */

.homely-footer-column h3,
.homely-footer-newsletter h3 {
       margin: 4px 0 13px;
    color: #ffffff;
    font-size: 20px;
    font-weight: 650;
    line-height: 1.3;
}


.homely-footer-column ul {
    padding: 0;

    margin: 0;

    list-style: none;
}


.homely-footer-column li {
    margin-bottom: 8px;
}


.homely-footer-column li:last-child {
    margin-bottom: 0;
}


.homely-footer-column a {
    position: relative;

    display: inline-block;

    color:rgb(255 255 255 / 84%);

    font-size: 15px;

    font-weight: 430;

    line-height: 1.3;

    transition:
        color .2s ease,
        transform .2s ease;
}


.homely-footer-column a:hover {
    color: #ffffff;

    transform:
        translateX(3px);
}


/* ==========================================================
   NEWSLETTER
========================================================== */

.homely-footer-newsletter {
    min-width: 0;
}


.homely-footer-newsletter p {
    margin:-4px 0 12px;
    color:rgba(255, 255, 255, .63);
    font-size: 15px;
    line-height: 1.5;
}


.homely-footer-newsletter__form {
    width: 100%;

    min-height: 44px;

    display: flex;

    padding: 3px;

    border:
        1px solid rgba(255, 255, 255, .24);

    border-radius: 7px;

    background: #ffffff;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}


.homely-footer-newsletter__form:focus-within {
    border-color:
        rgba(96, 177, 240, .8);

    box-shadow:
        0 0 0 3px rgba(75, 157, 220, .12);
}


.homely-footer-newsletter__form input {
    width: 100%;
    min-width: 0;

    height: 36px;

    padding:
        0 11px;

    border: 0;
    outline: 0;

    background:
        transparent;

    box-shadow: none;

    color:
        var(--homely-text-primary);

    font-family:
        inherit;

    font-size: 10px;
}


.homely-footer-newsletter__form input::placeholder {
    color: #98a2b3;
}


.homely-footer-newsletter__form button {
    width: 39px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 39px;

    padding: 0;

    border: 0;

    border-radius: 5px;

    background:
        var(--homely-primary);

    color: #ffffff;

    cursor: pointer;

    transition:
        background .2s ease,
        transform .2s ease;
}


.homely-footer-newsletter__form button svg {
    width: 17px;
    height: 17px;

    transition:
        transform .2s ease;
}


.homely-footer-newsletter__form button:hover {
    background:
        var(--homely-primary-hover);
}


.homely-footer-newsletter__form button:hover svg {
    transform:
        translateX(2px);
}


/* ==========================================================
   FOOTER BOTTOM
========================================================== */

.homely-footer-bottom {
    min-height: 55px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    margin-top: 32px;

    border-top:
        1px solid rgba(255, 255, 255, .08);
}


.homely-footer-bottom p {
    margin: 0;

    color:
        rgba(255, 255, 255, .46);

    font-size: 9px;
}


.homely-footer-bottom__links {
    display: flex;
    align-items: center;

    gap: 18px;
}


.homely-footer-bottom__links a {
    color:
        rgba(255, 255, 255, .52);

    font-size: 9px;

    transition:
        color .2s ease;
}


.homely-footer-bottom__links a:hover {
    color: #ffffff;
}


/* ==========================================================
   1199px
========================================================== */

@media (max-width: 1199.98px) {

    .homely-footer {
        padding-top: 36px;
    }


    .homely-footer__brand {
        max-width: 300px;
    }


    .homely-footer-newsletter__form {
        max-width: 300px;
    }

}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .homely-footer {
        padding-top: 32px;
    }


    .homely-footer__brand {
        max-width: 450px;

        margin-bottom: 7px;
    }


    .homely-footer__description {
        max-width: 400px;
    }


    .homely-footer-newsletter {
        max-width: 450px;
    }


    .homely-footer-newsletter h3 {
        margin-top: 4px;
    }


    .homely-footer-bottom {
        margin-top: 28px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .homely-footer {
        padding-top: 28px;
    }


    /*
    |--------------------------------------------------------------------------
    | Brand
    |--------------------------------------------------------------------------
    */

    .homely-footer-logo__icon {
        width: 36px;
        height: 36px;

        flex-basis: 36px;
    }


    .homely-footer-logo__icon svg {
        width: 32px;
        height: 32px;
    }


    .homely-footer-logo__content strong {
        font-size: 19px;
    }


    .homely-footer__description {
        margin-top: 12px;

        font-size: 10px;
    }


    /*
    |--------------------------------------------------------------------------
    | Link Columns
    |--------------------------------------------------------------------------
    */

    .homely-footer-column {
        padding-top: 5px;
    }


    .homely-footer-column h3,
    .homely-footer-newsletter h3 {
        margin-bottom: 11px;

        font-size: 11px;
    }


    .homely-footer-column li {
        margin-bottom: 9px;
    }


    .homely-footer-column a {
        font-size: 10px;
    }


    /*
    |--------------------------------------------------------------------------
    | Newsletter
    |--------------------------------------------------------------------------
    */

    .homely-footer-newsletter {
        padding-top: 7px;

        max-width: none;
    }


    .homely-footer-newsletter p {
        font-size: 9px;
    }


    .homely-footer-newsletter__form {
        max-width: none;

        min-height: 47px;
    }


    .homely-footer-newsletter__form input {
        height: 39px;

        font-size: 11px;
    }


    .homely-footer-newsletter__form button {
        width: 42px;
        height: 39px;

        flex-basis: 42px;
    }


    /*
    |--------------------------------------------------------------------------
    | Bottom
    |--------------------------------------------------------------------------
    */

    .homely-footer-bottom {
        min-height: auto;

        flex-direction: column;

        align-items: flex-start;

        gap: 10px;

        margin-top: 25px;

        padding:
            17px 0 20px;
    }


    .homely-footer-bottom__links {
        gap: 15px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 399.98px) {

    .homely-footer {
        padding-top: 25px;
    }


    .homely-footer-social__item {
        width: 30px;
        height: 30px;
    }


    .homely-footer-column h3 {
        font-size: 10.5px;
    }


    .homely-footer-column a {
        font-size: 9.5px;
    }

}