
:root {
    --dwelling-gold: #b79a63;
    --dwelling-dark: #171513;
    --dwelling-text: #292621;
}

#sp-header {
    background: rgba(255, 255, 255, 0.97) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);

    position: relative;
    z-index: 9999;

    transition: all 0.3s ease;
}


/* Header inner spacing */

#sp-header .container {
    max-width: 1440px;
}

#sp-menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span {
    position: relative;

    display: flex;
    align-items: center;

    padding: 0 17px !important;

    color: var(--dwelling-text) !important;

    font-size: 18px !important;
    font-weight: 500 !important;

    letter-spacing: 0.1px;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}

.sp-megamenu-parent > li > a::after,
.sp-megamenu-parent > li > span::after {

    content: "";

    position: absolute;

    left: 17px;
    right: 17px;
    bottom: -7px;

    height: 2px;

    background: var(--dwelling-gold);

    transform: scaleX(0);
    transform-origin: center;

    transition: transform 0.3s ease;
}


.sp-megamenu-parent > li:hover > a::after,
.sp-megamenu-parent > li:hover > span::after,
.sp-megamenu-parent > li.active > a::after {

    transform: scaleX(1);
}

.sp-megamenu-parent > li:hover > a,
.sp-megamenu-parent > li:hover > span {

    color: var(--dwelling-gold) !important;
}

.sp-megamenu-parent > li.active > a {

    color: var(--dwelling-gold) !important;
}

.sp-megamenu-parent > li.menu-item-has-children > a::before,
.sp-megamenu-parent > li.menu-item-has-children > span::before {

    color: var(--dwelling-gold);
}

.sp-megamenu-parent .sp-dropdown {

    margin-top: 18px !important;

    border: 0 !important;

    border-top: 2px solid var(--dwelling-gold) !important;

    box-shadow:
        0 15px 45px rgba(0, 0, 0, 0.12) !important;

    background: #ffffff !important;
}

.sp-megamenu-parent .sp-dropdown li a {

    padding: 10px 15px !important;

    color: #292621 !important;

    font-size: 14px !important;

    transition:
        padding-left 0.25s ease,
        color 0.25s ease,
        background 0.25s ease;
}

.sp-megamenu-parent .sp-dropdown li a:hover {

    color: var(--dwelling-gold) !important;

    background: #faf8f4 !important;

    padding-left: 26px !important;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item>a {
    font-size: 16px !important;
}

.dwelling-book-now > a {
    background-color: #b89446 !important;
    color: #fff !important;
}

@media (max-width: 991px) {

    #sp-header {

        box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);

    }

    .sp-megamenu-parent > li > a,
    .sp-megamenu-parent > li > span {

        padding: 12px 20px !important;

    }

    .sp-megamenu-parent > li:last-child > a {

        margin: 8px 15px;

        text-align: center;
    }
}

.sp-megamenu-parent > li {
    position: relative !important;
}

.sp-megamenu-parent .sp-dropdown {
    margin-top: 0 !important;
}

.sp-megamenu-parent > li:hover > .sp-dropdown {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.sp-megamenu-parent .sp-dropdown {
    transition:
        opacity 0.2s ease,
        visibility 0.2s ease !important;
}
