:root {
    --gold: #153156;
    --gold-dark: #0d1f36;
    --dark: #15191c;
    --text: #242424;
    --muted: #777;
    --cream: #faf8f2;
    --border: #e9e9e9;
    --np-gold: #153156;
    --np-gold-dark: #0d1f36;
    --np-dark: #171b1e;
    --np-text: #242424;
    --np-muted: #777;
    --np-light: #faf8f2;
    --np-border: #e8e5dd;
    background: #fff;
    color: var(--np-text);
    --np-gold: #153156;
    --np-gold-dark: #0d1f36;
    --np-dark: #171b1e;
    --np-text: #242424;
    --np-muted: #777;
    --np-light: #faf8f2;
    --np-border: #e8e5dd;
    background: #fff;
    color: var(--np-text);
    --agent-gold: #153156;
    --agent-dark: #171b1e;
    --agent-muted: #777;
    --agent-border: #e7e3da;
}

.np-about-page .container {
    max-width: 1180px;
}

.color-property span {
    color: #153156;
}

.np-about-page *,
.np-about-page *::before,
.np-about-page *::after {
    box-sizing: border-box;
}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.text-size{
    font-size: 10px;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Inter", sans-serif;
    color: var(--text);
    background: #fff;
    /* overflow-x: hidden; */
}

a {
    text-decoration: none;
    color: inherit;
}

img {
    width: 100%;
    display: block;
}

.container {
    max-width: 1268px;
}

/* =========================================
           TOP BAR
        ========================================= */

.top-bar {
    background: #171a1c;
    color: #fff;
    font-size: 13px;
    padding: 7px 0;
}

.top-bar a {
    color: #fff;
    opacity: .9;
}

/* =========================================
           NAVBAR
        ========================================= */

.main-navbar {
    background: #fff;
    border-bottom: 1px solid #eee;
    position: sticky;
    top: 0;
    z-index: 999;
    transition: .3s ease;
}

.main-navbar.scrolled {
    box-shadow: 0 5px 25px rgba(0, 0, 0, .08);
}

.navbar-brand img {
    width: 225px;
}

.navbar-nav {
    gap: 3px;
}

.navbar-nav .nav-link {
    color: #333;
    font-size: 11px;
    font-weight: 500;
    padding: 24px 14px !important;
    transition: .3s ease;
}

.navbar-nav .nav-link:hover {
    color: var(--gold);
}

.sell-btn {
    background: var(--gold);
    color: white;
    padding: 10px 18px;
    border-radius: 4px;
    font-size: 11px;
    border: none;
    transition: .3s;
}

.sell-btn:hover {
    background: var(--gold-dark);
    color: #fff;
    transform: translateY(-2px);
}

.property-menu {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.property-menu .nav-link {
    padding-right: 2px !important;
    white-space: nowrap;
}

.property-toggle {
    border: 0;
    background: transparent;
    padding: 0 3px !important;
    margin: 0 !important;
    width: auto;
    height: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
    cursor: pointer;
}

/* Arrow */
.dropdown-arrow {
    display: block;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.2s ease;
}

/* Desktop */
@media (min-width: 768px) {

    .property-dropdown .dropdown-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(8px);
        transition: .2s ease;
    }

    .property-dropdown:hover .dropdown-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }

    .property-dropdown:hover .dropdown-arrow {
        transform: rotate(225deg);
    }

    .property-toggle {
        pointer-events: none;
    }
}

/* Mobile */
@media (max-width: 767.98px) {

    .property-dropdown .dropdown-menu {
        display: none;
        position: static;
        margin: 0;
        padding: 5px 0 5px 15px;
        border: 0;
        box-shadow: none;
    }

    .property-dropdown.mobile-open .dropdown-menu {
        display: block;
    }

    .property-dropdown.mobile-open .dropdown-arrow {
        transform: rotate(225deg);
    }
}

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

.hero {
    min-height: 475px;
    position: relative;
    overflow: visible;
    background:
         linear-gradient(90deg, rgb(255 255 255 / 95%) 0%, rgb(255 255 255 / 36%) 37%, rgb(255 255 255 / 0%) 75%),
        url("../img/hero-banner1.png");

    background-size: cover;
    background-position: center;
}

.hero-content {
    padding-top: 80px;
    max-width: 520px;
    position: relative;
    z-index: 2;
}

.hero-content h1 {
    font-size: 58px;
    line-height: 1.1;
    font-weight: 700;
    margin-bottom: 15px;
}

.hero-content h1 span {
    color: var(--gold);
}

.hero-content p {
    max-width: 380px;
    font-size: 15px;
    line-height: 1.7;
    color: #000;
}

.hero-buttons {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.btn-gold {
    background: var(--gold);
    color: #fff;
    border: 1px solid var(--gold);
    border-radius: 4px;
    padding: 10px 17px;
    font-size: 11px;
    transition: .3s;
}

.btn-gold:hover {
    background: var(--gold-dark);
    color: #fff;
    transform: translateY(-2px);
}

.btn-outline-custom {
    border: 1px solid #aaa;
    background: white;
    color: #333;
    border-radius: 4px;
    padding: 10px 17px;
    font-size: 11px;
    transition: .3s;
}

.btn-outline-custom:hover {
    border-color: var(--gold);
    color: var(--gold);
}

/* Family Badge */

.family-badge {
    position: absolute;
    right: 7%;
    bottom: 95px;
    background: rgba(255, 255, 255, .96);
    padding: 15px 20px;
    border-radius: 7px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .12);
    display: flex;
    align-items: center;
    gap: 10px;
    animation: floatBadge 4s ease-in-out infinite;
}

.family-badge .badge-icon {
    width: 35px;
    height: 35px;
    background: #f7f1e3;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--gold);
}

.family-badge strong {
    display: block;
    font-size: 13px;
}

.family-badge small {
    color: #777;
    font-size: 9px;
}

@keyframes floatBadge {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}

/* =========================================
           SEARCH BOX
        ========================================= */
        
/* ========================================
   PROPERTY SEARCH WRAPPER
======================================== */

.search-wrapper {
    position: relative;
    z-index: 10;
    margin-top: -42px;
}


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

.search-box {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 35px rgba(0, 0, 0, .12);
    padding: 12px;
}


/* ========================================
   SEARCH TABS
======================================== */

.search-tabs {
    display: flex;
    align-items: center;
    gap: 35px;
    padding: 0 15px 12px;
    border-bottom: 1px solid #eee;
}

.search-tab {
    position: relative;

    display: inline-flex;
    align-items: center;
    gap: 4px;

    padding: 7px 0;

    border: 0;
    outline: none;
    background: transparent;

    color: #666;

    font-size: 14px;
    font-weight: 400;

    cursor: pointer;

    transition: .3s ease;
}

.search-tab i {
    font-size: 12px;
}

.search-tab:hover {
    color: var(--gold);
}

.search-tab.active {
    color: var(--gold);
    font-weight: 600;
}


/* Active underline */

.search-tab.active::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -13px;

    width: 100%;
    height: 2px;

    background: var(--gold);

    border-radius: 5px;
}


/* ========================================
   SEARCH FIELDS
======================================== */

.search-fields {
    display: grid;

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

    gap: 10px;

    padding: 14px 5px 3px;
}


/*
   IMPORTANT:
   Hide every tab content by default
*/

.search-fields.tab-content {
    display: none;
}


/*
   Show only selected tab
*/

.search-fields.tab-content.active {
    display: grid;
}


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

.search-field {
    min-width: 0;

    border-right: 1px solid #eee;

    /*padding: 0 12px;*/
}


.search-field label {
    display: block;

    margin-bottom: 5px;

    color: #999;

    font-size: 11px;
    line-height: 1.2;
}


.search-field select {
    width: 100%;

    padding: 2px 0;

    border: none;
    outline: none;

    background-color: transparent;

    color: #444;

    font-size: 11px;

    cursor: pointer;
}


.search-field select:focus {
    box-shadow: none;
}


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

.search-btn {
    height: 45px;
    min-width: 150px;
    margin-top:12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 20px;

    border: none;
    border-radius: 5px;

    background: var(--gold);
    color: #fff;

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

    cursor: pointer;

    transition: .3s ease;
}


.search-btn:hover {
    background: var(--gold-dark);
    color: #fff;
}


.search-btn i {
    font-size: 12px;
}


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

@media (max-width: 991px) {

    .search-fields {
        grid-template-columns: 1fr 1fr;
    }

    .search-field {
        border-right: 1px solid #eee;
    }

    .search-btn {
        min-height: 42px;
    }

}


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

@media (max-width: 575px) {

    .search-wrapper {
        margin-top: -25px;
    }

    .search-box {
        padding: 10px;
    }

    .search-tabs {
        gap: 20px;
        padding: 0 8px 10px;

        overflow-x: auto;
        scrollbar-width: none;
    }

    .search-tabs::-webkit-scrollbar {
        display: none;
    }

    .search-tab {
        flex-shrink: 0;
        font-size: 10px;
    }

    .search-tab.active::after {
        bottom: -11px;
    }

    .search-fields {
        grid-template-columns: 1fr;
        gap: 0;

        padding: 10px 0 0;
    }

    .search-field {
        border-right: none;
        border-bottom: 1px solid #eee;

        padding: 10px 8px;
    }

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

    .search-field select {
        font-size: 11px;
    }

    .search-btn {
        width: 100%;
        min-height: 42px;

        margin-top: 10px;
    }

}

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

.section {
    padding: 42px 0;
}

.section-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 17px;
}

.section-heading h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
}

.view-all {
    color: var(--gold);
    font-size: 10px;
    font-weight: 600;
}

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

.location-card {
    overflow: hidden;
    border-radius: 4px;
    cursor: pointer;
    background: #fff;
}

.location-card img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    display: block;
    transition: .5s ease;
}

.location-card:hover img {
    transform: scale(1.08);
}

.location-card1 {
    overflow: hidden;
    border-radius: 4px;
    cursor: pointer;
    background: #fff;
    margin-bottom: 10px;
}

.location-card1 img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: .5s ease;
}

.location-card1:hover img {
    transform: scale(1.08);
}




.location-info {
    padding: 8px 10px;
    background: #fff;
    color: #222;
}

.location-info strong {
    display: block;
    font-size: 19px;
    font-weight: 600;
    margin-bottom: 2px;
}

.location-info small {
    display: block;
    font-size: 13px;
    color: #777;
}

/* =========================================
           PROPERTY CARDS
        ========================================= */

.property-card {
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
    transition: .4s ease;
}

.property-card:hover {
    transform: translateY(-7px);
}

.property-image {
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}

.property-image img {
    height: 150px;
    object-fit: cover;
    transition: .5s;
}

.property-card:hover .property-image img {
    transform: scale(1.06);
}

.property-badge {
    position: absolute;
    left: 7px;
    top: 7px;
    background: var(--gold);
    color: white;
    padding: 4px 7px;
    font-size: 8px;
    border-radius: 3px;
}

.property-details {
    padding: 9px 2px;
}

.property-details h3 {
    font-size: 16px;
    margin-bottom: 4px;
    font-weight: 700;
}

.property-location {
    color: #777;
    font-size: 13px;
    margin-bottom: 6px;
}

.property-price {
    color: var(--gold);
    font-weight: 700;
    font-size: 12px;
}

.property-meta {
    color: #777;
    font-size: 12px;
    margin-top: 4px;
}

/* =========================================
           SELL CTA
        ========================================= */

.sell-cta {
    min-height: 175px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    background:
        linear-gradient(90deg,
            rgba(17, 20, 22, .97) 0%,
            rgba(17, 20, 22, .92) 42%,
            rgba(17, 20, 22, .2) 100%),
        url("../img/index-banner1.png");
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    padding: 30px;
}

.sell-content {
    color: #fff;
    max-width: 500px;
}

.sell-content h2 {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
}

.sell-content p {
    color: #ccc;
    font-size: 13px;
    line-height: 1.6;
    margin: 10px 0 29px;
}

.how-link {
    color: #fff;
    font-size: 9px;
    margin-left: 10px;
}

/* =========================================
           CATEGORIES
        ========================================= */

.category-card {
    text-align: center;
    padding: 12px;
    border-right: 1px solid #eee;
    transition: .3s;
}

.category-card:hover {
    transform: translateY(-4px);
}

.category-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #faf7ef;
    color: var(--gold);
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}

.category-card h4 {
    font-size: 15px;
    margin: 7px 0 3px;
}

.category-card p {
    font-size: 12px;
    color: #999;
    margin: 0;
}

/* =========================================
           WHY CHOOSE
        ========================================= */

.why-section {
    background: #faf9f4;
    padding: 20px 0;
}

.why-title {
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 20px;
}

.why-item {
    text-align: center;
    padding: 5px 15px;
}

.why-icon {
    width: 50px;
    height: 50px;
    margin: auto;
    color: var(--gold);
    font-size: 30px;
}

.why-item h4 {
    font-size: 16px;
    margin: 7px 0 3px;
}

.why-item p {
    font-size: 12px;
    color: #777;
    margin: 0;
}

/* =========================================
           BOOK CTA
        ========================================= */

.book-cta {
    min-height: 105px;
    margin-top: 18px;
    border-radius: 5px;
    overflow: hidden;
    background:
        url("../img/index-banner2.png");
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 25px;
}

@media (max-width:768px){
    .book-cta {
    min-height: 105px;
    margin-top: 18px;
    border-radius: 5px;
    overflow: hidden;
    background:linear-gradient(90deg,
            rgba(20, 22, 23, .92) 0%,
            rgba(20, 22, 23, .78) 45%,
            rgba(20, 22, 23, .25) 100%),
        url("../img/index-banner2.png");
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 25px;
}
}

.book-content {
    color: #fff;
    width: 52%;
}

.book-content h2 {
    font-size: 26px;
    font-weight: 700;
}

.book-content p {
    font-size: 12px;
    margin-bottom: 28px;
}

.book-contact {
    font-size: 8px;
    margin-left: 8px;
}

/* =========================================
           NEWS
        ========================================= */

.news-card {
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}

.bottom-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 45%;
    background: linear-gradient(to top,
            rgba(0, 0, 0, 0.55),
            rgba(0, 0, 0, 0));
    pointer-events: none;
}

.news-card img {
    height: 230px;
    object-fit: cover;
    transition: .5s;
}

.news-card:hover img {
    transform: scale(1.07);
}

.news-card:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(0, 0, 0, .75),
            transparent 65%);
}

.news-content {
    position: absolute;
    bottom: 9px;
    left: 10px;
    right: 10px;
    z-index: 2;
    color: #fff;
}

.news-content h3 {
    font-size: 16px;
    line-height: 1.3;
    margin-bottom: 9px;
}

.news-content small {
    font-size: 11px;
}

.news-badge {
    position: absolute;
    top: 7px;
    left: 7px;
    z-index: 3;
    background: var(--gold);
    color: #fff;
    font-size: 7px;
    padding: 4px 6px;
    border-radius: 3px;
}

/* =========================================
           TRUSTED BRANDS
        ========================================= */
.trusted {
    padding: 60px 0;
    background: #fff;
}

.trusted h3 {
    text-align: center;
    font-size: 35px;
    font-weight: 600;
    margin-bottom: 35px;
    color: #222;
}

.trusted-item {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 30px;
}

.trusted-item img {
    max-width: 160px;
    max-height: 65px;
    width: auto;
    height: auto;
    object-fit: contain;
}



.trusted-slider .owl-stage {
    display: flex;
    align-items: center;
}

.trusted-slider .owl-item {
    display: flex;
    justify-content: center;
}

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

footer {
    background: #171b1e;
    color: #fff;
    padding-top: 40px;
}

.footer-logo {
    width: 155px;
    /* height:; */
    margin-bottom: 15px;
    filter: brightness(0) invert(1);
}

.footer-description {
    font-size: 13px;
    line-height: 1.7;
    color: #aaa;
    max-width: 220px;
}

.footer-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 13px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 7px;
}

.footer-links a {
    color: #aaa;
    font-size: 12px;
    transition: .3s;
}

.footer-links a:hover {
    color: var(--gold);
}

.footer-contact {
    color: #aaa;
    font-size: 12px;
    line-height: 1.8;
}

.footer-bottom {
    border-top: 1px solid #303438;
    margin-top: 30px;
    padding: 13px 0;
    color: #777;
    font-size: 14px;
}

/* =========================================
           SCROLL REVEAL
        ========================================= */

.reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .8s ease,
        transform .8s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.reveal-left {
    opacity: 0;
    transform: translateX(-40px);
    transition: .8s ease;
}

.reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

.reveal-right {
    opacity: 0;
    transform: translateX(40px);
    transition: .8s ease;
}

.reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* =========================================
           IMAGE LAZY ANIMATION
        ========================================= */

.image-hover {
    overflow: hidden;
}

.image-hover img {
    transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}

.image-hover:hover img {
    transform: scale(1.08);
}

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

@media(max-width: 991px) {

    .navbar-nav .nav-link {
        padding: 10px !important;
    }

    .hero {
        min-height: 570px;
        background-position: 65% center;
    }

    .hero-content {
        padding: 60px 15px;
    }

    .hero-content h1 {
        font-size: 38px;
    }

    .family-badge {
        right: 20px;
        bottom: 100px;
    }

    .search-fields {
        grid-template-columns: 1fr 1fr;
    }

    .search-btn {
        min-height: 45px;
    }
}

@media(max-width: 767px) {

    .top-bar {
        display: none;
    }

    .navbar-brand img {
        width: 215px;
    }

    .hero {
        min-height: 273px;
        background: linear-gradient(90deg,
                rgba(20, 22, 23, .92) 0%,
                rgba(20, 22, 23, .78) 45%,
                rgba(20, 22, 23, .25) 100%),
            url("../img/hero-banner1.png");
        background-position: center;
        background-size: cover;
    }

    .hero-content {
        padding-top: 44px;
    }

    .hero-content h1 {
        font-size: 24px;
        color: white;
    }

    .hero-content p {
        color: #fff;
        font-size: 9px;
    }

    .family-badge {
        display: none;
        /*right: 15px;*/
        /*bottom: 115px;*/
    }

    .search-wrapper {
        margin-top: -42px;
    }

    .search-tabs {
        gap: 18px;
        overflow-x: auto;
    }

    .search-fields {
        grid-template-columns: 1fr;
    }

    .search-field {
        border-right: 0;
        border-bottom: 1px solid #eee;
        padding: 10px;
    }

    .search-btn {
        height: 45px;
    }

    .section {
        padding: 30px 0;
    }

    .property-image img {
        height: 180px;
    }

    .sell-cta {
        min-height: 280px;
    }

    .book-cta {
        min-height: 250px;
        justify-content: flex-end;
        align-items: flex-end;
        background-position: left;
    }

    .book-content {
        width: 100%;
    }

    .category-card {
        border-bottom: 1px solid #eee;
    }

    .footer-column {
        margin-bottom: 25px;
    }
}



/* About US PAge */



/* =========================================================
       COMMON
    ========================================================= */

.np-section {
    padding: 80px 0;
}

.np-section-small {
    padding: 55px 0;
}

.np-section-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--np-gold);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    margin-bottom: 12px;
}

.np-section-label::before {
    content: "";
    width: 28px;
    height: 2px;
    background: var(--np-gold);
}

.np-section-title {
    font-size: 34px;
    line-height: 1.2;
    font-weight: 700;
    margin-bottom: 15px;
    color: var(--np-dark);
}

.np-section-title span {
    color: var(--np-gold);
}

.np-section-description {
    font-size: 13px;
    line-height: 1.8;
    color: var(--np-muted);
    max-width: 650px;
}

.np-gold-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--np-gold);
    color: #fff;
    border: 1px solid var(--np-gold);
    padding: 12px 21px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    transition: all .3s ease;
    text-decoration: none;
}

.np-gold-btn:hover {
    background: var(--np-gold-dark);
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(185, 151, 85, .25);
}

.np-outline-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #fff;
    color: var(--np-text);
    border: 1px solid #ccc;
    padding: 12px 21px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    transition: all .3s ease;
    text-decoration: none;
}

.np-outline-btn:hover {
    border-color: var(--np-gold);
    color: var(--np-gold);
}

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

.np-about-hero {
    min-height: 370px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .92) 0%,*/
        /*    rgba(20, 22, 23, .78) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/about-banner.png");

    background-size: cover;
    background-position: center;
}

.np-about-hero-content {
    max-width: 650px;
    color: #000;
    position: relative;
    z-index: 2;
}

.np-about-hero-content .np-section-label {
    color: var(--gold);
}

.np-about-hero-content .np-section-label::before {
    background: var(--gold);
}

.np-about-hero h1 {
    font-size: 48px;
    line-height: 1.1;
    font-weight: 700;
    margin-bottom: 15px;
}

.np-about-hero h1 span {
    color: var(--gold);
}

.np-about-hero p {
    max-width: 570px;
    font-size: 13px;
    line-height: 1.8;
    color: #000;
    margin-bottom: 22px;
}

.np-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    color: rgb(0 0 0);
}

.np-breadcrumb span:last-child {
    color: #153156;
}

/* =========================================================
       ABOUT INTRO
    ========================================================= */

.np-about-image-wrapper {
    position: relative;
    padding-right: 30px;
    padding-bottom: 30px;
}

.np-about-main-image {
    height: 420px;
    object-fit: cover;
    border-radius: 7px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .12);
}

.np-about-image-wrapper::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 75%;
    height: 75%;
    border: 1px solid var(--np-gold);
    border-radius: 7px;
    z-index: -1;
}

.np-experience-badge {
    position: absolute;
    left: -18px;
    bottom: 35px;
    background: #fff;
    padding: 17px 23px;
    border-radius: 6px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .15);
    text-align: center;
    animation: npFloat 4s ease-in-out infinite;
}

.np-experience-badge strong {
    display: block;
    color: var(--np-gold);
    font-size: 26px;
    line-height: 1;
}

.np-experience-badge span {
    display: block;
    color: #555;
    font-size: 9px;
    margin-top: 5px;
}

@keyframes npFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}

.np-about-content {
    padding-left: 15px;
}

.np-about-content h2 {
    font-size: 36px;
    line-height: 1.2;
    font-weight: 700;
    margin-bottom: 18px;
}

.np-about-content h2 span {
    color: var(--np-gold);
}

.np-about-content p {
    color: var(--np-muted);
    font-size: 13px;
    line-height: 1.9;
    margin-bottom: 13px;
}

.np-about-points {
    list-style: none;
    padding: 0;
    margin: 22px 0;
}

.np-about-points li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
    font-size: 11px;
    color: #555;
}

.np-about-points i {
    color: var(--np-gold);
    font-size: 15px;
    margin-top: -1px;
}

/* =========================================================
       STATS
    ========================================================= */

.np-stats-section {
    background: var(--np-light);
    border-top: 1px solid #f0ede5;
    border-bottom: 1px solid #f0ede5;
}

.np-stat {
    text-align: center;
    padding: 15px 20px;
    border-right: 1px solid var(--np-border);
}

.np-stat:last-child {
    border-right: 0;
}

.np-stat-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #fff;
    color: var(--np-gold);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 10px;
    font-size: 25px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .05);
}

.np-stat-number {
    font-size: 27px;
    color: var(--np-dark);
    font-weight: 700;
    line-height: 1;
}

.np-stat-label {
    font-size: 12px;
    color: #888;
    margin-top: 6px;
}

/* =========================================================
       VISION MISSION
    ========================================================= */

.np-vm-section {
    background: #fff;
}

.np-vm-card {
    height: 100%;
    padding: 35px;
    border: 1px solid var(--np-border);
    border-radius: 7px;
    background: #fff;
    position: relative;
    overflow: hidden;
    transition: all .4s ease;
}

.np-vm-card::before {
    content: "";
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: rgba(185, 151, 85, .08);
    right: -30px;
    top: -30px;
    transition: .4s ease;
}

.np-vm-card:hover {
    transform: translateY(-8px);
    border-color: rgba(185, 151, 85, .45);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .08);
}

.np-vm-card:hover::before {
    transform: scale(1.5);
}

.np-vm-icon {
    width: 55px;
    height: 55px;
    border-radius: 6px;
    background: #faf6ec;
    color: var(--np-gold);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    margin-bottom: 20px;
    position: relative;
}

.header-description p{
    font-size: 10px;
}

.np-vm-card h3 {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 11px;
}

.np-vm-card p {
    color: var(--np-muted);
    font-size: 13px;
    line-height: 1.8;
    margin: 0;
}

/* =========================================================
       CORE VALUES
    ========================================================= */

.np-values-section {
    background: var(--np-light);
}

.np-value-card {
    height: 100%;
    background: #fff;
    border-radius: 6px;
    padding: 25px 20px;
    text-align: center;
    border: 1px solid #eee;
    transition: .35s ease;
}

.np-value-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .08);
}

.np-value-icon {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    background: #faf6ec;
    color: var(--np-gold);
    border-radius: 50%;
    font-size: 25px;
}

.np-value-card h4 {
    font-size: 19px;
    margin: 13px 0 7px;
    font-weight: 700;
}

.np-value-card p {
    color: #888;
    font-size: 12px;
    line-height: 1.7;
    margin: 0;
}

/* =========================================================
       TEAM
    ========================================================= */

.np-team-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 7px;
    overflow: hidden;
    transition: .4s ease;
}

.np-team-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1);
}

.np-team-image {
    height: 280px;
    overflow: hidden;
    position: relative;
}

.np-team-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .6s ease;
}

.np-team-card:hover .np-team-image img {
    transform: scale(1.06);
}

.np-team-social {
    position: absolute;
    bottom: 15px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 7px;
    opacity: 0;
    transform: translateY(10px);
    transition: .35s ease;
}

.np-team-card:hover .np-team-social {
    opacity: 1;
    transform: translateY(0);
}

.np-team-social a {
    width: 31px;
    height: 31px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    color: var(--np-gold);
    border-radius: 50%;
    font-size: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}

.np-team-info {
    padding: 17px;
    text-align: center;
}

.np-team-info h3 {
    font-size: 17px;
    margin: 0 0 5px;
    font-weight: 700;
}

.np-team-info p {
    color: var(--np-gold);
    font-size: 12px;
    margin: 0;
}

/* =========================================================
       HOW WE WORK
    ========================================================= */

.np-process-section {
    background: linear-gradient(90deg, rgb(255 255 255 / 54%), rgb(255 255 255 / 52%)),  url(../img/index-banner1.png);
    color: #000;
}

.np-process-section .np-section-title {
    color: #000;
}

.np-process-section .np-section-description {
    color: #222222;
}

.np-process {
    position: relative;
}

.np-process-line {
    position: absolute;
    top: 28px;
    left: 11%;
    right: 11%;
    height: 1px;
    background: rgba(185, 151, 85, .4);
}

.np-process-item {
    text-align: center;
    position: relative;
    z-index: 2;
}

.np-process-number {
    width: 57px;
    height: 57px;
    border-radius: 50%;
    background: var(--np-gold);
    border: 1px solid var(--np-gold);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 17px;
    font-size: 15px;
    font-weight: 700;
    transition: .3s;
}

.np-process-item:hover .np-process-number {
    background: var(--np-dark);
    color: #fff;
    transform: scale(1.1);
}

.np-process-item h4 {
    font-size: 16px;
    margin-bottom: 7px;
}

.np-process-item p {
    font-size: 11px;
    color: #222222;
    line-height: 1.6;
    max-width: 150px;
    margin: auto;
}

/* =========================================================
       FAQ
    ========================================================= */

.np-faq-section {
    background: #fff;
}

.np-faq .accordion-item {
    border: 1px solid #e9e6df;
    margin-bottom: 10px;
    border-radius: 5px !important;
    overflow: hidden;
}

.np-faq .accordion-button {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    padding: 17px 20px;
    background: #fff;
    box-shadow: none;
}

.np-faq .accordion-button:not(.collapsed) {
    color: var(--np-gold);
    background: #fffdf9;
}

.np-faq .accordion-button::after {
    background-size: 12px;
}

.np-faq .accordion-body {
    color: #777;
    font-size: 13px;
    line-height: 1.8;
    padding: 0 20px 17px;
}

/* =========================================================
       RELATED SERVICES
    ========================================================= */

.np-related-section {
    background: var(--np-light);
}

.np-related-card {
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 7px;
    min-height: 240px;
    cursor: pointer;
}

.np-related-card img {
    width: 100%;
    height: 100%;
    min-height: 240px;
    object-fit: cover;
    transition: .6s ease;
}

.np-related-card:hover img {
    transform: scale(1.08);
}

.np-related-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(0, 0, 0, .82),
            rgba(0, 0, 0, .05) 70%);
}

.np-related-content {
    position: absolute;
    z-index: 2;
    bottom: 20px;
    left: 20px;
    right: 20px;
    color: #fff;
}

.np-related-content i {
    color: #d4b36a;
    font-size: 22px;
}

.np-related-content h3 {
    font-size: 17px;
    font-weight: 700;
    margin: 8px 0 5px;
}

.np-related-content p {
    font-size: 10px;
    color: rgba(255, 255, 255, .75);
    margin: 0;
    line-height: 1.6;
}

/* =========================================================
       FINAL CTA
    ========================================================= */

.np-final-cta {
    padding: 60px 0;
    background:
        linear-gradient(90deg, rgb(16 16 16 / 98%), rgb(16 16 16 / 49%)),
        url("../img/about-last.png");

    background-size: cover;
    background-position: center;
    color: #fff;
    text-align: center;
}

.np-final-cta h2 {
    font-size: 31px;
    font-weight: 700;
    margin-bottom: 10px;
}

.np-final-cta p {
    font-size: 11px;
    color: rgba(255, 255, 255, .75);
    margin-bottom: 20px;
}

.np-final-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.np-final-cta .np-outline-btn {
    background: transparent;
    color: #fff;
    border-color: rgba(255, 255, 255, .5);
}

.np-final-cta .np-outline-btn:hover {
    border-color: #fff;
    color: #fff;
}

/* =========================================================
       SCROLL ANIMATION
    ========================================================= */

.np-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .8s ease,
        transform .8s ease;
}

.np-reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.np-reveal-left {
    opacity: 0;
    transform: translateX(-45px);
    transition: .8s ease;
}

.np-reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

.np-reveal-right {
    opacity: 0;
    transform: translateX(45px);
    transition: .8s ease;
}

.np-reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

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

@media(max-width: 991px) {

    .np-section {
        padding: 60px 0;
    }

    .np-about-hero h1 {
        font-size: 40px;
    }

    .np-about-image-wrapper {
        margin-bottom: 30px;
    }

    .np-process-line {
        display: none;
    }

    .np-process-item {
        margin-bottom: 35px;
    }

}

@media(max-width: 767px) {

    .np-section {
        padding: 45px 0;
    }

    .np-section-title {
        font-size: 27px;
    }

    .np-about-hero {
        min-height: 430px;
    }

    .np-about-hero h1 {
        font-size: 34px;
    }

    .np-about-hero p {
        font-size: 11px;
    }

    .np-about-image-wrapper {
        padding-right: 15px;
        padding-bottom: 20px;
    }

    .np-about-main-image {
        height: 300px;
    }

    .np-experience-badge {
        left: 5px;
        bottom: 20px;
    }

    .np-about-content {
        padding-left: 0;
    }

    .np-about-content h2 {
        font-size: 28px;
        margin-top: 15px;
    }

    .np-stat {
        border-right: 0;
        border-bottom: 1px solid var(--np-border);
        padding: 20px;
    }

    .np-stat:last-child {
        border-bottom: 0;
    }

    .np-vm-card {
        padding: 25px;
    }

    .np-team-image {
        height: 330px;
    }

    .np-final-cta h2 {
        font-size: 25px;
    }

    .np-final-buttons {
        flex-direction: column;
        align-items: center;
    }

    .np-final-buttons a {
        width: 190px;
    }

}


.np-contact-section {
    padding: 80px 0;
}

.np-contact-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--np-gold);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    margin-bottom: 12px;
}

.np-contact-label::before {
    content: "";
    width: 28px;
    height: 2px;
    background: var(--np-gold);
}

.np-contact-title {
    font-size: 35px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--np-dark);
    margin-bottom: 15px;
}

.np-contact-title span {
    color: var(--np-gold);
}

.np-contact-description {
    color: var(--np-muted);
    font-size: 12px;
    line-height: 1.8;
    max-width: 650px;
}

.np-contact-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 22px;
    background: var(--np-gold);
    border: 1px solid var(--np-gold);
    color: #fff;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    transition: .3s ease;
    text-decoration: none;
}

.np-contact-btn:hover {
    background: var(--np-gold-dark);
    border-color: var(--np-gold-dark);
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(185, 151, 85, .25);
}

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

.np-contact-hero {
    min-height: 370px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .80) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/hero-banner.png");

    background-size: cover;
    background-position: center;
}

.np-contact-hero-content {
    max-width: 650px;
    color: #000;
    position: relative;
    z-index: 2;
}

.np-contact-hero .np-contact-label {
    color: var(--np-gold);
}

.np-contact-hero .np-contact-label::before {
    background: var(--np-gold);
}

.np-contact-hero h1 {
    font-size: 48px;
    line-height: 1.1;
    font-weight: 700;
    margin-bottom: 15px;
}

.np-contact-hero h1 span {
    color: var(--np-gold);
}

.np-contact-hero p {
    max-width: 560px;
    color: #000;
    font-size: 13px;
    line-height: 1.8;
    margin-bottom: 20px;
}

.np-contact-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    color: #000;
}

.np-contact-breadcrumb span:last-child {
    color: var(--np-gold);
}

/* =========================================================
       CONTACT INFORMATION CARDS
    ========================================================= */

.np-contact-info-section {
    padding: 0;
    margin-top: -55px;
    position: relative;
    z-index: 5;
}

.np-contact-info-card {
    background: #fff;
    border: 1px solid #eee;
    min-height: 145px;
    padding: 25px 20px;
    text-align: center;
    border-radius: 6px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .08);
    transition: .4s ease;
}

.np-contact-info-card:hover {
    transform: translateY(-8px);
    border-color: rgba(185, 151, 85, .5);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .12);
}

.np-contact-info-icon {
    width: 50px;
    height: 50px;
    margin: 0 auto 12px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #faf6ec;
    color: var(--np-gold);
    font-size: 25px;
}

.np-contact-info-card h3 {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 7px;
}

.np-contact-info-card p {
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
    color: #777;
}

.np-contact-info-card a {
    color: #777;
    text-decoration: none;
    transition: .3s;
}

.np-contact-info-card a:hover {
    color: var(--np-gold);
}

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

.np-contact-form-wrapper {
    background: #fff;
    border: 1px solid var(--np-border);
    border-radius: 7px;
    padding: 35px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .05);
}

.np-form-title {
    font-size: 27px;
    font-weight: 700;
    margin-bottom: 7px;
}

.np-form-description {
    color: #888;
    font-size: 12px;
    line-height: 1.7;
    margin-bottom: 25px;
}

.np-form-group {
    margin-bottom: 17px;
}

.np-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #444;
    margin-bottom: 7px;
}

.np-form-control,
.np-form-select {
    width: 100%;
    height: 43px;
    border: 1px solid #dedbd3;
    border-radius: 4px;
    padding: 0 13px;
    font-family: inherit;
    font-size: 13px;
    color: #444;
    background: #fff;
    outline: none;
    transition: .3s;
}

.np-form-control:focus,
.np-form-select:focus,
.np-form-textarea:focus {
    border-color: var(--np-gold);
    box-shadow: 0 0 0 3px rgba(185, 151, 85, .1);
}

.np-form-textarea {
    width: 100%;
    min-height: 115px;
    resize: vertical;
    border: 1px solid #dedbd3;
    border-radius: 4px;
    padding: 12px 13px;
    font-family: inherit;
    font-size: 13px;
    color: #444;
    outline: none;
    transition: .3s;
}

.np-form-submit {
    width: 100%;
    height: 45px;
    border: 0;
    background: var(--np-gold);
    color: #fff;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
}

.np-form-submit:hover {
    background: var(--gold-dark);
    transform: translateY(-2px);
}

.np-form-note {
    text-align: center;
    color: #999;
    font-size: 10px;
    margin-top: 10px;
}

/* =========================================================
       CONTACT SIDE IMAGE
    ========================================================= */

.np-contact-image-wrapper {
    height: 100%;
    min-height: 510px;
    position: relative;
    overflow: hidden;
    border-radius: 7px;
}

.np-contact-image-wrapper img {
    width: 100%;
    height: 100%;
    min-height: 510px;
    object-fit: cover;
    transition: .7s ease;
}

.np-contact-image-wrapper:hover img {
    transform: scale(1.05);
}

.np-contact-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(20, 22, 23, .85),
            rgba(20, 22, 23, .05) 70%);
}

.np-contact-image-content {
    position: absolute;
    bottom: 25px;
    left: 25px;
    right: 25px;
    color: #fff;
}

.np-contact-image-content span {
    font-size: 9px;
    color: var(--np-gold);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.np-contact-image-content h3 {
    font-size: 22px;
    margin: 7px 0;
    font-weight: 700;
}

.np-contact-image-content p {
    font-size: 9px;
    color: rgba(255, 255, 255, .75);
    line-height: 1.7;
    max-width: 390px;
    margin: 0;
}

/* =========================================================
       OFFICE DETAILS
    ========================================================= */

.np-office-section {
    background: var(--np-light);
}

.np-office-card {
    height: 100%;
    background: #fff;
    border: 1px solid #ebe8e0;
    border-radius: 6px;
    padding: 27px;
    transition: .35s ease;
}

.np-office-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .07);
}

.np-office-card h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 18px;
}

.np-office-item {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.np-office-item:last-child {
    margin-bottom: 0;
}

.np-office-item-icon {
    width: 40px;
    height: 40px;
    min-width: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #faf6ec;
    color: var(--np-gold);
    font-size: 20px;
}

.np-office-item h4 {
    font-size: 14px;
    margin: 0 0 4px;
    font-weight: 700;
}

.np-office-item p {
    margin: 0;
    color: #777;
    font-size: 13px;
    line-height: 1.6;
}

/* =========================================================
       BUSINESS HOURS
    ========================================================= */

.np-hours {
    margin-top: 22px;
    border-top: 1px solid #eee;
    padding-top: 17px;
}

.np-hours-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
}

.all-p-tag{
        max-width: 560px;
    color: #000;
    font-size: 13px;
    line-height: 1.8;
    margin-bottom: 20px;
}

.np-hours-row {
    display: flex;
    justify-content: space-between;
    color: #777;
    font-size: 12px;
    margin-bottom: 7px;
}

.np-hours-row strong {
    color: #444;
}

/* =========================================================
       MAP
    ========================================================= */

.np-map-wrapper {
    height: 100%;
    min-height: 430px;
    border-radius: 7px;
    overflow: hidden;
    position: relative;
    border: 1px solid #ddd;
}

.np-map-wrapper iframe {
    width: 100%;
    height: 100%;
    min-height: 430px;
    border: 0;
    filter: grayscale(15%);
}

.np-map-overlay-card {
    position: absolute;
    left: 20px;
    bottom: 20px;
    background: #fff;
    padding: 15px 18px;
    border-radius: 5px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .15);
    max-width: 230px;
}

.np-map-overlay-card h4 {
    font-size: 10px;
    margin-bottom: 5px;
    font-weight: 700;
}

.np-map-overlay-card p {
    margin: 0;
    color: #777;
    font-size: 8px;
    line-height: 1.6;
}

/* =========================================================
       FAQ
    ========================================================= */

.np-contact-faq-section {
    background: #fff;
}

.np-contact-faq .accordion-item {
    border: 1px solid #e9e6df;
    border-radius: 5px !important;
    margin-bottom: 10px;
    overflow: hidden;
}

.np-contact-faq .accordion-button {
    background: #fff;
    box-shadow: none;
    color: #333;
    font-size: 11px;
    font-weight: 600;
    padding: 16px 18px;
}

.np-contact-faq .accordion-button:not(.collapsed) {
    color: var(--np-gold);
    background: #fffdf9;
}

.np-contact-faq .accordion-body {
    color: #777;
    font-size: 9px;
    line-height: 1.8;
    padding: 0 18px 16px;
}

/* =========================================================
       CTA
    ========================================================= */

.np-contact-cta {
    padding: 60px 0;
    text-align: center;
    color: #fff;

    background:
        linear-gradient(90deg,
            rgba(72, 47, 29, .96),
            rgba(72, 47, 29, .82)),
        url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1600&q=85");

    background-size: cover;
    background-position: center;
}

.np-contact-cta h2 {
    font-size: 31px;
    font-weight: 700;
    margin-bottom: 10px;
}

.np-contact-cta p {
    color: rgba(255, 255, 255, .76);
    font-size: 11px;
    margin-bottom: 20px;
}

.np-contact-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.np-contact-outline-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, .55);
    color: #fff;
    padding: 12px 22px;
    border-radius: 4px;
    font-size: 11px;
    text-decoration: none;
    transition: .3s;
}

.np-contact-outline-btn:hover {
    color: #fff;
    border-color: #fff;
    background: rgba(255, 255, 255, .08);
}

/* =========================================================
       ANIMATION
    ========================================================= */

.np-contact-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .8s ease,
        transform .8s ease;
}

.np-contact-reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.np-contact-reveal-left {
    opacity: 0;
    transform: translateX(-45px);
    transition: .8s ease;
}

.np-contact-reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

.np-contact-reveal-right {
    opacity: 0;
    transform: translateX(45px);
    transition: .8s ease;
}

.np-contact-reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

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

@media(max-width: 991px) {

    .np-contact-section {
        padding: 60px 0;
    }

    .np-contact-hero h1 {
        font-size: 40px;
    }

    .np-contact-info-section {
        margin-top: -35px;
    }

    .np-contact-image-wrapper {
        min-height: 420px;
    }

    .np-contact-image-wrapper img {
        min-height: 420px;
    }

    .np-map-wrapper {
        min-height: 400px;
    }

    .np-map-wrapper iframe {
        min-height: 400px;
    }

}

@media(max-width: 767px) {

    .np-contact-section {
        padding: 45px 0;
    }

    .np-contact-title {
        font-size: 28px;
    }

    .np-contact-hero {
        min-height: 420px;
    }

    .np-contact-hero h1 {
        font-size: 34px;
    }

    .np-contact-hero p {
        font-size: 11px;
    }

    .np-contact-info-section {
        margin-top: -25px;
    }

    .np-contact-info-card {
        margin-bottom: 15px;
    }

    .np-contact-form-wrapper {
        padding: 23px;
    }

    .np-contact-image-wrapper {
        min-height: 320px;
    }

    .np-contact-image-wrapper img {
        min-height: 320px;
    }

    .np-map-wrapper {
        min-height: 350px;
    }

    .np-map-wrapper iframe {
        min-height: 350px;
    }

    .np-contact-cta h2 {
        font-size: 25px;
    }

    .np-contact-cta-buttons {
        flex-direction: column;
        align-items: center;
    }

    .np-contact-cta-buttons a {
        width: 190px;
        justify-content: center;
    }

}


/* Property Page */


.np-property-section {
    padding: 70px 0;
}

.np-property-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gold);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 11px;
}

.np-property-label::before {
    content: "";
    width: 27px;
    height: 2px;
    background: var(--gold);
}

.np-property-title {
    font-size: 32px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--dark);
    margin-bottom: 12px;
}

.np-property-title span {
    color: var(--gold);
}

.np-property-description {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.8;
    max-width: 650px;
}

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

.np-properties-hero {
    min-height: 390px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: visible;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .78) 43%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/properties1.png");

    background-size: cover;
    background-position: center;
}

.np-properties-hero-content {
    max-width: 650px;
    color: #000;
    position: relative;
    z-index: 2;
}

.np-properties-hero .np-property-label {
    color: var(--gold);
}

.np-properties-hero .np-property-label::before {
    background: var(--gold);
}

.np-properties-hero h1 {
    font-size: 46px;
    line-height: 1.1;
    font-weight: 700;
    margin-bottom: 14px;
}

.np-properties-hero h1 span {
    color: var(--gold);
}

.np-properties-hero p {
    max-width: 560px;
    color: #000;
    font-size: 12px;
    line-height: 1.8;
    margin-bottom: 20px;
}

.np-property-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #000;
    font-size: 9px;
}

.np-property-breadcrumb span:last-child {
    color: var(--gold);
}

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

.np-property-search-wrapper {
    position: relative;
    z-index: 20;
    margin-top: -55px;
}

.np-property-search {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .13);
    border: 1px solid #eee;
    padding: 17px;
}

.np-search-tabs {
    display: flex;
    gap: 30px;
    border-bottom: 1px solid #eee;
    margin-bottom: 16px;
    padding: 0 7px;
}

.np-search-tab {
    position: relative;
    border: 0;
    background: transparent;
    color: #777;
    padding: 7px 0 14px;
    font-size: 10px;
    font-weight: 500;
    cursor: pointer;
}

.np-search-tab i {
    margin-right: 5px;
}

.np-search-tab.active {
    color: var(--gold);
    font-weight: 700;
}

.np-search-tab.active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--gold);
}

.np-search-fields {
    display: grid;
    grid-template-columns:
        1.1fr 1.1fr 1fr 1fr 1fr auto;
    gap: 9px;
}

.np-search-field {
    min-height: 48px;
    border: 1px solid #e4e1da;
    border-radius: 4px;
    padding: 8px 11px;
    transition: .3s;
    background: #fff;
}

.np-search-field:focus-within {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(185, 151, 85, .08);
}

.np-search-field label {
    display: block;
    color: #999;
    font-size: 7px;
    margin-bottom: 4px;
}

.np-search-field select {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 9px;
    color: #444;
}

.np-search-button {
    border: 0;
    border-radius: 4px;
    background: var(--gold);
    color: #fff;
    padding: 0 20px;
    font-size: 9px;
    font-weight: 600;
    transition: .3s;
    white-space: nowrap;
}

.np-search-button:hover {
    background: var(--gold-dark);
    transform: translateY(-2px);
}

/* =========================================================
       FILTER BAR
    ========================================================= */

.np-filter-section {
    padding: 28px 0 10px;
}

.np-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

.np-filter-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.np-filter-btn {
    border: 1px solid #dedbd4;
    background: #fff;
    color: #555;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 14px;
    cursor: pointer;
    transition: .3s;
}

.np-filter-btn:hover,
.np-filter-btn.active {
    border-color: var(--gold);
    color: var(--gold);
    background: #fffdf8;
}

.np-results-count {
    color: #888;
    font-size: 12px;
}

.np-sort-select {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 8px;
    color: #555;
    outline: none;
    background: #fff;
}

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

.np-property-card {
    background: #fff;
    border: 1px solid #e9e6df;
    border-radius: 6px;
    overflow: hidden;
    height: 100%;
    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}

.np-property-card:hover {
    transform: translateY(-7px);
    border-color: rgba(185, 151, 85, .45);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1);
}

.np-property-image {
    height: 205px;
    position: relative;
    overflow: hidden;
}

.np-property-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.np-property-card:hover .np-property-image img {
    transform: scale(1.07);
}

.np-property-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px 8px;
    background: var(--gold);
    color: #fff;
    font-size: 7px;
    border-radius: 3px;
    font-weight: 600;
    z-index: 2;
}

.np-property-badge.featured {
    background: #25292b;
}

.np-property-wishlist {
    position: absolute;
    top: 5px;
    right: 9px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .95);
    color: #777;
    font-size: 16px;
    z-index: 3;
    transition: .3s;
}

.np-property-wishlist:hover {
    color: #d55;
    transform: scale(1.08);
}

.np-property-content {
    padding: 15px;
}

.np-property-type {
    color: var(--gold);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 5px;
}

.np-property-name {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
    color: #222;
}

.np-property-location {
    color: #888;
    font-size: 11px;
    margin-bottom: 10px;
}

.np-property-location i {
    color: var(--gold);
}

.np-property-price {
    color: var(--gold);
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 9px;
}

.np-property-details {
    display: flex;
    align-items: center;
    gap: 13px;
    border-top: 1px solid #eee;
    padding-top: 10px;
    color: #777;
    font-size: 8px;
}

.np-property-details span {
    display: flex;
    align-items: center;
    gap: 4px;
}

.np-property-details i {
    color: var(--gold);
}

/*.np-property-footer {*/
/*    margin-top: 12px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: space-between;*/
/*}*/



.np-view-property {
    color: var(--gold);
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
}

.np-view-property:hover {
    color: var(--gold-dark);
}

.np-property-enquire {
    border: 1px solid var(--gold);
    color: var(--gold);
    background: transparent;
    padding: 6px 10px;
    border-radius: 3px;
    font-size: 10px;
    transition: .3s;
}

.np-property-enquire:hover {
    background: var(--gold);
    color: #fff;
}


.np-property-footer {
    width: 100%;
}

/* View Details + Enquire */

.np-property-footer-main {
    display: flex;
    margin-top: 10px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
}

/* WhatsApp + Call */

.np-property-footer-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 12px;
}

.np-property-whatsapp,
.np-property-call {
    flex: 1;
    height: 37px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.3s ease;
}

/* WhatsApp */

.np-property-whatsapp {
    background: #25D366;
    color: #fff;
}

.np-property-whatsapp:hover {
    background: #128C7E;
    color: #fff;
    transform: translateY(-2px);
}

/* Call */

.np-property-call {
    background: #111;
    color: #fff;
}

.np-property-call:hover {
    background: #333;
    color: #fff;
    transform: translateY(-2px);
}

/* Mobile */

@media (max-width: 575px) {

    .np-property-footer-main {
        gap: 8px;
    }

    .np-property-footer-actions {
        gap: 8px;
    }

    .np-property-whatsapp,
    .np-property-call {
        font-size: 10px;
    }

}

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

.np-filter-sidebar {
    background: #fff;
    border: 1px solid #e6e2da;
    border-radius: 6px;
    padding: 20px;
    position: sticky;
    top: 90px;
}

.np-filter-sidebar h3 {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 18px;
}

.np-sidebar-group {
    border-top: 1px solid #eee;
    padding: 15px 0;
}

.np-sidebar-group:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.np-sidebar-group-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 11px;
}

.np-sidebar-group-title i {
    color: #aaa;
}

.np-check-item {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #777;
    font-size: 11px;
    margin-bottom: 9px;
}

.np-check-item input {
    accent-color: var(--gold);
}

.np-price-inputs {
    display: flex;
    gap: 6px;
}

.np-price-inputs input {
    width: 50%;
    height: 34px;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0 8px;
    font-size: 8px;
    outline: none;
}

.np-price-inputs input:focus {
    border-color: var(--gold);
}

.np-clear-filter {
    width: 100%;
    background: #fff;
    color: var(--gold);
    border: 1px solid var(--gold);
    border-radius: 4px;
    padding: 9px;
    font-size: 11px;
    transition: .3s;
}

.np-clear-filter:hover {
    background: var(--gold);
    color: #fff;
}

/* =========================================================
       PAGINATION
    ========================================================= */

.np-pagination {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 40px;
}

.np-page-btn {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ddd;
    background: #fff;
    color: #777;
    border-radius: 4px;
    font-size: 9px;
    cursor: pointer;
    transition: .3s;
}

.np-page-btn:hover,
.np-page-btn.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #fff;
}

/* =========================================================
       PROPERTY CATEGORIES
    ========================================================= */

.np-category-section {
    background: var(--cream);
}

.np-category-card {
    position: relative;
    height: 220px;
    overflow: hidden;
    border-radius: 6px;
    cursor: pointer;
}

.np-category-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .6s ease;
}

.np-category-card:hover img {
    transform: scale(1.08);
}

.np-category-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(0, 0, 0, .78),
            transparent 65%);
}

.np-category-content {
    position: absolute;
    z-index: 2;
    left: 18px;
    right: 18px;
    bottom: 17px;
    color: #fff;
}

.np-category-content i {
    color: #d5b46b;
    font-size: 20px;
}

.np-category-content h3 {
    font-size: 14px;
    font-weight: 700;
    margin: 7px 0 3px;
}

.np-category-content p {
    color: rgba(255, 255, 255, .72);
    font-size: 8px;
    margin: 0;
}

/* =========================================================
       FEATURED PROJECTS
    ========================================================= */

.np-featured-section {
    background: #fff;
}

.np-project-card {
    background: #fff;
    border: 1px solid #e7e3db;
    border-radius: 6px;
    overflow: hidden;
    transition: .4s;
}

.np-project-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .08);
}

.np-project-image {
    height: 190px;
    position: relative;
    overflow: hidden;
}

.np-project-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .6s;
}

.np-project-card:hover .np-project-image img {
    transform: scale(1.07);
}

.np-project-tag {
    position: absolute;
    left: 10px;
    top: 10px;
    background: var(--gold);
    color: #fff;
    padding: 5px 8px;
    border-radius: 3px;
    font-size: 7px;
}

.np-project-content {
    padding: 15px;
}

.np-project-content h3 {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
}

.np-project-content p {
    color: #888;
    font-size: 8px;
    margin-bottom: 10px;
}

.np-project-meta {
    display: flex;
    justify-content: space-between;
    color: #777;
    font-size: 8px;
    border-top: 1px solid #eee;
    padding-top: 10px;
}

.category-icon2 {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #fff;
    color: var(--gold);
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}

/* =========================================================
       CTA
    ========================================================= */

.np-properties-cta {
    padding: 60px 0;
    text-align: center;
    color: #fff;

    background:
        linear-gradient(90deg, rgb(16 16 16 / 98%), rgb(16 16 16 / 49%)), url(../img/about-last.png);


    background-size: cover;
    background-position: center;
}

.np-properties-cta h2 {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 10px;
}

.np-properties-cta p {
    color: rgba(255, 255, 255, .75);
    font-size: 10px;
    margin-bottom: 20px;
}

.np-properties-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.np-properties-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 11px 20px;
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 4px;
    color: #fff;
    font-size: 10px;
    text-decoration: none;
    transition: .3s;
}

.np-properties-outline:hover {
    color: #fff;
    border-color: #fff;
    background: rgba(255, 255, 255, .08);
}

/* =========================================================
       ANIMATIONS
    ========================================================= */

.np-property-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .75s ease,
        transform .75s ease;
}

.np-property-reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.np-property-reveal-left {
    opacity: 0;
    transform: translateX(-45px);
    transition: .8s ease;
}

.np-property-reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

.np-property-reveal-right {
    opacity: 0;
    transform: translateX(45px);
    transition: .8s ease;
}

.np-property-reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

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

@media(max-width: 1199px) {

    .np-search-fields {
        grid-template-columns:
            1fr 1fr 1fr;
    }

    .np-search-button {
        min-height: 45px;
    }

}

@media(max-width: 991px) {

    .np-property-section {
        padding: 55px 0;
    }

    .np-properties-hero h1 {
        font-size: 40px;
    }

    .np-property-search-wrapper {
        margin-top: -40px;
    }

    .np-filter-sidebar {
        position: static;
        margin-bottom: 25px;
    }

    .np-property-image {
        height: 220px;
    }

}

@media(max-width: 767px) {

    .np-property-section {
        padding: 45px 0;
    }

    .np-properties-hero {
        min-height: 420px;
    }

    .np-properties-hero h1 {
        font-size: 34px;
    }

    .np-properties-hero p {
        font-size: 10px;
    }

    .np-property-search-wrapper {
        margin-top: -25px;
    }

    .np-search-tabs {
        overflow-x: auto;
        gap: 20px;
        white-space: nowrap;
    }

    .np-search-fields {
        grid-template-columns: 1fr;
    }

    .np-filter-bar {
        align-items: flex-start;
        flex-direction: column;
    }

    .np-filter-left {
        width: 100%;
    }

    .np-property-image {
        height: 190px;
    }

    .np-property-name {
        font-size: 12px;
    }

    .np-property-price {
        font-size: 13px;
    }

    .np-category-card {
        height: 190px;
    }

    .np-project-image {
        height: 180px;
    }

    .np-properties-cta h2 {
        font-size: 25px;
    }

    .np-properties-cta-buttons {
        flex-direction: column;
        align-items: center;
    }

    .np-properties-cta-buttons a {
        width: 190px;
    }

}


/* Property details page */


.np-simple-image {
    width: 100%;
    height: 460px;
    overflow: hidden;
    border-radius: 7px;
    position: relative;
    background: #eee;
}

.np-simple-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.np-simple-image:hover img {
    transform: scale(1.04);
}

.np-simple-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: var(--gold);
    color: #fff;
    padding: 7px 12px;
    border-radius: 3px;
    font-size: 8px;
    font-weight: 600;
    z-index: 2;
}

/* =========================================
       PROPERTY INFORMATION
    ========================================= */

.np-simple-info {
    padding: 28px 0 0;
}

.np-simple-type {
    color: var(--gold);
    text-transform: uppercase;
    font-size: 9px;
    letter-spacing: 1.3px;
    font-weight: 700;
    margin-bottom: 8px;
}

.np-simple-title {
    color: var(--dark);
    font-size: 30px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 7px;
}

.np-simple-location {
    color: #888;
    font-size: 14px;
    margin-bottom: 17px;
}

.np-simple-location i {
    color: var(--gold);
}

.np-simple-price {
    color: var(--gold);
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 20px;
}

/* =========================================
       PROPERTY QUICK DETAILS
    ========================================= */

.np-simple-details-box {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 17px 0;
    margin-bottom: 25px;
}

.np-simple-detail {
    text-align: center;
    border-right: 1px solid #eee;
}

.np-simple-detail:last-child {
    border-right: 0;
}

.np-simple-detail i {
    display: block;
    color: var(--gold);
    font-size: 17px;
    margin-bottom: 6px;
}

.np-simple-detail strong {
    display: block;
    font-size: 11px;
    color: #333;
}

.np-simple-detail span {
    display: block;
    color: #999;
    font-size: 7px;
    margin-top: 3px;
}

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

.np-simple-heading {
    color: var(--dark);
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 11px;
}

.np-simple-heading span {
    color: var(--gold);
}

.np-simple-description {
    color: #777;
    font-size: 13px;
    line-height: 1.9;
    margin-bottom: 25px;
}

/* =========================================
       AMENITIES
    ========================================= */

.np-simple-amenities {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 28px;
}

.np-simple-amenity {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px;
    background: var(--cream);
    border: 1px solid #eee9df;
    border-radius: 4px;
    font-size: 12px;
    color: #555;
    transition: .3s;
}

.np-simple-amenity:hover {
    transform: translateY(-3px);
    border-color: var(--gold);
}

.np-simple-amenity i {
    color: var(--gold);
    font-size: 13px;
}

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

.np-simple-buttons {
    display: flex;
    gap: 9px;
}

.np-simple-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 12px 20px;
    border-radius: 4px;
    border: 1px solid var(--gold);
    background: var(--gold);
    color: #fff;
    text-decoration: none;
    font-size: 9px;
    font-weight: 600;
    transition: .3s;
}

.np-simple-btn:hover {
    background: var(--gold-dark);
    border-color: var(--gold-dark);
    color: #fff;
    transform: translateY(-2px);
}

.np-simple-btn-outline {
    background: #fff;
    color: var(--gold);
}

.np-simple-btn-outline:hover {
    background: var(--gold);
    color: #fff;
}

/* =========================================
       RIGHT SIDEBAR
    ========================================= */

.np-simple-sidebar {
    position: sticky;
    top: 90px;
}

.np-simple-sidebar-box {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 20px;
    margin-bottom: 18px;
    box-shadow: 0 7px 25px rgba(0, 0, 0, .045);
}

.np-sidebar-title {
    color: var(--dark);
    font-size: 16px;
    font-weight: 700;
    padding-bottom: 13px;
    border-bottom: 1px solid #eee;
    margin-bottom: 8px;
}

.np-sidebar-title span {
    color: var(--gold);
}

/* =========================================
       CATEGORY
    ========================================= */

.np-simple-category {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 4px;
    border-bottom: 1px solid #eee;
    text-decoration: none;
    color: #666;
    font-size: 9px;
    transition: .3s;
}

.np-simple-category:last-child {
    border-bottom: 0;
}

.np-simple-category:hover {
    color: var(--gold);
    padding-left: 9px;
}

.np-simple-category-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.np-simple-category-left i {
    color: var(--gold);
    font-size: 13px;
}

.np-simple-category-count {
    background: #f7f3eb;
    color: var(--gold);
    border-radius: 20px;
    padding: 3px 7px;
    font-size: 7px;
}

/* =========================================
       ENQUIRY SIDEBAR
    ========================================= */

.np-simple-enquiry {
    background: var(--dark);
    color: #fff;
    border-radius: 6px;
    padding: 22px;
}

.np-simple-enquiry-label {
    color: #d3b16a;
    font-size: 8px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
}

.np-simple-enquiry h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 7px;
}

.np-simple-enquiry p {
    color: rgba(255, 255, 255, .62);
    font-size: 8px;
    line-height: 1.7;
    margin-bottom: 18px;
}

.np-simple-input {
    width: 100%;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, .15);
    background: rgba(255, 255, 255, .06);
    color: #fff;
    border-radius: 3px;
    padding: 0 10px;
    margin-bottom: 8px;
    outline: none;
    font-size: 8px;
}

.np-simple-input::placeholder {
    color: rgba(255, 255, 255, .45);
}

.np-simple-input:focus {
    border-color: var(--gold);
}

.np-simple-submit {
    width: 100%;
    height: 40px;
    border: 0;
    border-radius: 3px;
    background: var(--gold);
    color: #fff;
    font-size: 9px;
    font-weight: 600;
    margin-top: 5px;
    transition: .3s;
}

.np-simple-submit:hover {
    background: var(--gold-dark);
}

/* =========================================
       PROPERTY INFO TABLE
    ========================================= */

.np-simple-specs {
    margin-top: 30px;
    border: 1px solid var(--border);
    border-radius: 5px;
    overflow: hidden;
}

.np-simple-spec-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid #eee;
}

.np-simple-spec-row:last-child {
    border-bottom: 0;
}

.np-simple-spec-row div {
    padding: 12px 14px;
    font-size: 11px;
}

.np-simple-spec-row div:first-child {
    color: #888;
    background: #fcfbf8;
}

.np-simple-spec-row div:last-child {
    color: #333;
    font-weight: 600;
}

/* =========================================
       ANIMATION
    ========================================= */

.np-simple-reveal {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity .7s ease,
        transform .7s ease;
}

.np-simple-reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.np-simple-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: .7s ease;
}

.np-simple-left.active {
    opacity: 1;
    transform: translateX(0);
}

.np-simple-right {
    opacity: 0;
    transform: translateX(30px);
    transition: .7s ease;
}

.np-simple-right.active {
    opacity: 1;
    transform: translateX(0);
}

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

@media(max-width: 991px) {

    .np-simple-sidebar {
        position: static;
        margin-top: 35px;
    }

    .np-simple-image {
        height: 400px;
    }

}

@media(max-width: 767px) {

    .np-simple-details {
        padding: 25px 0 50px;
    }

    .np-simple-image {
        height: 280px;
    }

    .np-simple-title {
        font-size: 24px;
    }

    .np-simple-price {
        font-size: 21px;
    }

    .np-simple-details-box {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px 0;
    }

    .np-simple-detail:nth-child(2) {
        border-right: 0;
    }

    .np-simple-detail:nth-child(1),
    .np-simple-detail:nth-child(2) {
        padding-bottom: 12px;
        border-bottom: 1px solid #eee;
    }

    .np-simple-amenities {
        grid-template-columns: repeat(2, 1fr);
    }

    .np-simple-buttons {
        flex-direction: column;
    }

    .np-simple-btn {
        width: 100%;
    }

}

/* =========================================
   PROPERTY CATEGORY DROPDOWN
========================================= */

.np-category-dropdown-box {
    padding: 20px;
}

.np-property-accordion {
    border: 0;
}

.np-property-accordion .accordion-item {
    border: 0;
    border-bottom: 1px solid #eee;
    background: transparent;
}

.np-property-accordion .accordion-item:last-child {
    border-bottom: 0;
}


/* Main dropdown button */

.np-property-accordion .accordion-button {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    padding: 13px 3px;

    background: #fff;

    color: #555;

    box-shadow: none;

    font-size: 9px;

    font-weight: 500;
}


/* Remove Bootstrap blue focus */

.np-property-accordion .accordion-button:focus {
    box-shadow: none;
}


/* Remove default Bootstrap background */

.np-property-accordion .accordion-button:not(.collapsed) {
    color: var(--gold);
    background: #fff;
    box-shadow: none;
}


/* Left icon + title */

.np-category-dropdown-left {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 12px;
}


/* Icon */

.np-category-dropdown-left i {
    width: 32px;
    height: 32px;

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

    background: #faf6ec;

    color: var(--gold);

    border-radius: 4px;

    font-size: 16px;

    transition: .3s;
}


/* Active icon */

.np-property-accordion .accordion-button:not(.collapsed) .np-category-dropdown-left i {
    background: var(--gold);
    color: #fff;
}


/* Count */

.np-simple-category-count {
    background: #f7f3eb;
    color: var(--gold);

    border-radius: 20px;

    padding: 3px 7px;

    font-size: 7px;

    font-weight: 600;

    margin-left: auto;
}


/* Bootstrap arrow */

.np-property-accordion .accordion-button::after {
    width: 8px;
    height: 8px;

    background-size: 8px;

    margin-left: 4px;
}


/* Dropdown body */

.np-property-accordion .accordion-body {
    padding: 2px 8px 12px 37px;
}


/* Sub-category links */

.np-property-accordion .accordion-body a {
    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 8px 0;

    color: #888;

    font-size: 11px;

    text-decoration: none;

    border-bottom: 1px dashed #eee;

    transition: .3s;
}

.np-property-accordion .accordion-body a:last-child {
    border-bottom: 0;
}

.np-property-accordion .accordion-body a:hover {
    color: var(--gold);

    padding-left: 5px;
}


/* Sub-category count */

.np-property-accordion .accordion-body a span {
    color: #aaa;
    font-size: 7px;
}


/* Active category */

.np-property-accordion .accordion-body a:hover span {
    color: var(--gold);
}


/* Agent Profile */
/* =========================================================
   PREMIUM AGENTS SECTION
========================================================= */




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

.np-agents-heading {

    max-width: 650px;

    margin: 0 auto 55px;
}

.np-agents-eyebrow {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    color: var(--agent-gold);

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 2px;

    margin-bottom: 13px;
}

.np-agents-eyebrow::before,
.np-agents-eyebrow::after {

    content: "";

    width: 25px;

    height: 1px;

    background: var(--agent-gold);
}

.np-agents-heading h2 {

    color: var(--agent-dark);

    font-size: 34px;

    line-height: 1.25;

    font-weight: 700;

    margin-bottom: 13px;
}

.np-agents-heading h2 span {

    display: block;

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

.np-agents-heading p {

    color: var(--agent-muted);

    font-size: 10px;

    line-height: 1.8;

    margin: 0;
}


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

.np-agent-premium-card {

    position: relative;

    background: #fff;

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

    border-radius: 8px;

    overflow: hidden;

    box-shadow:
        0 15px 45px rgba(30, 30, 30, .06);

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

.np-agent-premium-card:hover {

    transform: translateY(-9px);

    box-shadow:
        0 25px 55px rgba(30, 30, 30, .12);
}


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

.np-agent-premium-image {

    height: 360px;

    position: relative;

    overflow: hidden;

    background: #eee;
}

.np-agent-premium-image::after {

    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 35%;

    background:
        linear-gradient(to top,
            rgba(0, 0, 0, .5),
            transparent);

    pointer-events: none;
}

.np-agent-premium-image img {

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .8s cubic-bezier(.2, .7, .2, 1);
}

.np-agent-premium-card:hover .np-agent-premium-image img {

    transform: scale(1.07);
}


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

.np-agent-verified {

    position: absolute;

    top: 16px;
    left: 16px;

    z-index: 3;

    display: flex;

    align-items: center;

    gap: 5px;

    padding: 7px 11px;

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

    color: var(--agent-gold);

    border-radius: 4px;

    font-size: 7px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .7px;

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


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

.np-agent-experience {

    position: absolute;

    right: 16px;
    bottom: 16px;

    z-index: 3;

    display: flex;

    align-items: center;

    gap: 8px;

    color: #fff;
}

.np-agent-experience strong {

    font-size: 27px;

    line-height: 1;

    font-weight: 700;

    color: #fff;
}

.np-agent-experience span {

    font-size: 6px;

    line-height: 1.5;

    text-transform: uppercase;

    letter-spacing: .7px;

    color: rgba(255, 255, 255, .8);
}


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

.np-agent-premium-content {

    padding: 26px 27px 27px;

    position: relative;
}

.np-agent-premium-content::before {

    content: "";

    position: absolute;

    top: 0;
    left: 27px;

    width: 42px;
    height: 3px;

    background: var(--agent-gold);
}


/* =========================================================
   ROLE
========================================================= */

.np-agent-role {

    padding-top: 3px;

    color: var(--agent-gold);

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.2px;

    margin-bottom: 8px;
}

.np-agent-premium-content h3 {

    color: var(--agent-dark);

    font-size: 25px;

    font-weight: 700;

    margin: 0 0 6px;
}

.np-agent-place {

    display: flex;

    align-items: center;

    gap: 5px;

    color: #999;

    font-size: 11px;

    margin-bottom: 15px;
}

.np-agent-place i {

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

.np-agent-premium-content>p {

    color: #777;

    font-size: 11px;

    line-height: 1.8;

    margin-bottom: 17px;
}


/* =========================================================
   SPECIALITY
========================================================= */

.np-agent-speciality {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 11px 0;

    border-top: 1px solid #eee;

    border-bottom: 1px solid #eee;

    margin-bottom: 16px;
}

.np-agent-speciality span {

    color: #aaa;

    font-size: 11px;

    text-transform: uppercase;

    letter-spacing: 1px;
}

.np-agent-speciality strong {

    color: #555;

    font-size: 10px;

    font-weight: 600;
}


/* =========================================================
   BOTTOM
========================================================= */

.np-agent-premium-bottom {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 17px;
}


/* =========================================================
   RATING
========================================================= */

.np-agent-rating {

    display: flex;

    align-items: center;

    gap: 8px;
}

.np-agent-rating>strong {

    color: var(--agent-gold);

    font-size: 20px;

    font-weight: 700;
}

.np-agent-stars {

    color: #c79e50;

    font-size: 12px;

    letter-spacing: 1px;

    line-height: 1;
}

.np-agent-rating span {

    display: block;

    color: #aaa;

    font-size: 8px;

    margin-top: 3px;
}


/* =========================================================
   SOCIAL
========================================================= */

.np-agent-social {

    display: flex;

    gap: 6px;
}

.np-agent-social a {

    width: 28px;
    height: 28px;

    display: flex;

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

    border: 1px solid #e5e1d8;

    border-radius: 50%;

    color: #888;

    text-decoration: none;

    font-size: 9px;

    transition: .3s;
}

.np-agent-social a:hover {

    color: #fff;

    background: var(--agent-gold);

    border-color: var(--agent-gold);

    transform: translateY(-3px);
}


/* =========================================================
   PROFILE BUTTON
========================================================= */

.np-agent-profile-btn {

    width: 100%;

    height: 40px;

    display: flex;

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

    gap: 8px;

    background: var(--agent-dark);

    color: #fff;

    border-radius: 4px;

    text-decoration: none;

    font-size: 8px;

    font-weight: 600;

    transition: .35s;
}

.np-agent-profile-btn i {

    transition: transform .35s;
}

.np-agent-profile-btn:hover {

    background: var(--agent-gold);

    color: #fff;
}

.np-agent-profile-btn:hover i {

    transform: translateX(5px);
}


/* =========================================================
   SECOND CARD ACCENT
========================================================= */

.np-agent-card-second .np-agent-premium-content::before {

    background: var(--agent-gold);
}


/* =========================================================
   SCROLL ANIMATION
========================================================= */

.np-agent-left {

    opacity: 0;

    transform: translateX(-45px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}

.np-agent-right {

    opacity: 0;

    transform: translateX(45px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}

.np-agent-left.active,
.np-agent-right.active {

    opacity: 1;

    transform: translateX(0);
}

.np-agent-reveal {

    opacity: 0;

    transform: translateY(25px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}

.np-agent-reveal.active {

    opacity: 1;

    transform: translateY(0);
}


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

@media (max-width: 767px) {

    .np-agents-premium {

        padding: 60px 0;
    }

    .np-agents-heading {

        margin-bottom: 35px;
    }

    .np-agents-heading h2 {

        font-size: 27px;
    }

    .np-agent-premium-image {

        height: 330px;
    }

    .np-agent-premium-content {

        padding: 24px 20px;
    }

    .np-agent-premium-content::before {

        left: 20px;
    }

    .np-agent-premium-content h3 {

        font-size: 23px;
    }

}

@media (max-width: 400px) {

    .np-agent-speciality {

        align-items: flex-start;

        flex-direction: column;

        gap: 4px;
    }

}

.np-agent-hero {
    min-height: 390px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: visible;

    background:
        linear-gradient(90deg,
            rgba(20, 22, 23, .93) 0%,
            rgba(20, 22, 23, .78) 43%,
            rgba(20, 22, 23, .25) 100%),
        url("../img/properties3.png");

    background-size: cover;
    background-position: center;
}

/* =========================================================
       REGISTER PAGE
    ========================================================= */



.np-register-breadcrumb {

    background: var(--cream);

    padding: 20px 0;

    border-bottom: 1px solid #eee;
}

.np-register-breadcrumb .breadcrumb {

    margin: 0;

    align-items: center;
}

.np-register-breadcrumb .breadcrumb-item {

    font-size: 8px;

    color: #999;
}

.np-register-breadcrumb .breadcrumb-item a {

    color: var(--gold);

    text-decoration: none;
}

.np-register-breadcrumb .breadcrumb-item.active {

    color: #555;

    font-weight: 600;
}

.np-register-breadcrumb .breadcrumb-item+.breadcrumb-item::before {

    color: #bbb;

    font-size: 9px;
}


/* =========================================================
       REGISTER SECTION
    ========================================================= */

.np-register-section {

    padding: 65px 0 80px;

    background:
        linear-gradient(135deg,
            #ffffff 0%,
            #faf8f2 100%);
}


/* =========================================================
       REGISTER WRAPPER
    ========================================================= */

.np-register-wrapper {

    max-width: 980px;

    margin: auto;

    display: grid;

    grid-template-columns: 40% 60%;

    background: #fff;

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

    border-radius: 8px;

    overflow: hidden;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, .07);
}


/* =========================================================
       LEFT INFORMATION
    ========================================================= */

.np-register-info {

    position: relative;

    padding: 42px 35px;

    background:
        linear-gradient(145deg, #153156, #0c223f);

    color: #fff;

    overflow: hidden;
}

.np-register-info::before {

    content: "";

    position: absolute;

    width: 220px;
    height: 220px;

    border-radius: 50%;

    border: 1px solid rgba(185, 151, 85, .25);

    top: -80px;
    right: -80px;
}

.np-register-info::after {

    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    border-radius: 50%;

    background:
        rgba(185, 151, 85, .06);

    bottom: -50px;
    left: -50px;
}


/* =========================================================
       LOGO / BRAND MARK
    ========================================================= */

.np-register-mark {

    width: 42px;
    height: 42px;

    display: flex;

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

    background: var(--gold);

    color: #fff;

    border-radius: 5px;

    font-size: 18px;

    margin-bottom: 25px;

    position: relative;

    z-index: 2;
}


.np-register-info h2 {

    position: relative;

    z-index: 2;

    font-size: 27px;

    line-height: 1.3;

    font-weight: 700;

    margin-bottom: 13px;
}

.np-register-info h2 span {

    color: #d0ae67;
}

.np-register-info>p {

    position: relative;

    z-index: 2;

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

    font-size: 12px;

    line-height: 1.9;

    margin-bottom: 30px;
}


/* =========================================================
       BENEFITS
    ========================================================= */

.np-register-benefits {

    position: relative;

    z-index: 2;
}

.np-register-benefit {

    display: flex;

    gap: 10px;

    margin-bottom: 18px;
}

.np-register-benefit-icon {

    width: 40px;
    height: 40px;

    min-width: 31px;

    display: flex;

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

    color: #d3b16b;

    background:
        rgba(185, 151, 85, .13);

    border-radius: 4px;

    font-size: 22px;
}

.np-register-benefit strong {

    display: block;

    color: #fff;

    font-size: 11px;

    margin-bottom: 3px;
}

.np-register-benefit span {

    display: block;

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

    font-size: 10px;

    line-height: 1.5;
}


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

.np-register-form {

    padding: 42px 45px;
}


.np-register-eyebrow {

    color: var(--gold);

    font-size: 8px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1.5px;

    margin-bottom: 8px;
}

.np-register-form h1 {

    color: var(--dark);

    font-size: 29px;

    font-weight: 700;

    margin-bottom: 7px;
}

.np-register-form h1 span {

    color: var(--gold);
}

.np-register-form-intro {

    color: #888;

    font-size: 12px;

    line-height: 1.7;

    margin-bottom: 25px;
}


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

.np-register-field {

    margin-bottom: 15px;
}

.np-register-field label {

    display: block;

    color: #555;

    font-size: 14px;

    font-weight: 600;

    margin-bottom: 6px;
}

.np-register-input-wrapper {

    position: relative;
}

.np-register-input-wrapper i {

    position: absolute;

    left: 12px;

    top: 50%;

    transform: translateY(-50%);

    color: var(--gold);

    font-size: 11px;

    pointer-events: none;
}

.np-register-input {

    width: 100%;

    height: 42px;

    padding: 0 12px 0 35px;

    border: 1px solid #ddd9d0;

    border-radius: 4px;

    background: #fff;

    color: #333;

    font-size: 13px;

    outline: none;

    transition: .3s;
}

.np-register-input::placeholder {

    color: #aaa;
}

.np-register-input:focus {

    border-color: var(--gold);

    box-shadow:
        0 0 0 3px rgba(185, 151, 85, .08);
}


/* =========================================================
       PASSWORD STRENGTH
    ========================================================= */

.np-register-password-strength {

    display: flex;

    gap: 4px;

    margin-top: 7px;
}

.np-password-line {

    height: 3px;

    flex: 1;

    background: #eee;

    border-radius: 10px;

    transition: .3s;
}

.np-password-line.active {

    background: var(--gold);
}

.np-password-hint {

    color: #aaa;

    font-size: 7px;

    margin-top: 4px;
}


/* =========================================================
       TERMS
    ========================================================= */

.np-register-terms {

    display: flex;

    align-items: flex-start;

    gap: 8px;

    margin: 5px 0 18px;
}

.np-register-terms input {

    margin-top: 2px;

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

.np-register-terms label {

    color: #888;

    font-size: 7px;

    line-height: 1.6;
}

.np-register-terms a {

    color: var(--gold);

    text-decoration: none;
}


/* =========================================================
       REGISTER BUTTON
    ========================================================= */

.np-register-btn {

    width: 100%;

    height: 43px;

    border: 0;

    border-radius: 4px;

    background: var(--gold);

    color: #fff;

    font-size: 9px;

    font-weight: 600;

    transition: .35s;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 7px;
}

.np-register-btn:hover {

    background: var(--gold-dark);

    transform: translateY(-2px);

    box-shadow:
        0 7px 18px rgba(185, 151, 85, .2);
}


/* =========================================================
       LOGIN LINK
    ========================================================= */

.np-register-login {

    text-align: center;

    margin-top: 19px;

    color: #999;

    font-size: 13px;
}

.np-register-login a {

    color: var(--gold);

    font-weight: 600;

    text-decoration: none;
}


/* =========================================================
       ANIMATIONS
    ========================================================= */

.np-register-animate-left {

    opacity: 0;

    transform: translateX(-35px);

    animation:
        npRegisterLeft .8s ease forwards;
}

.np-register-animate-right {

    opacity: 0;

    transform: translateX(35px);

    animation:
        npRegisterRight .8s ease forwards;
}

@keyframes npRegisterLeft {

    to {

        opacity: 1;

        transform: translateX(0);
    }
}

@keyframes npRegisterRight {

    to {

        opacity: 1;

        transform: translateX(0);
    }
}


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

@media(max-width: 767px) {

    .np-register-section {

        padding: 40px 0 55px;
    }

    .np-register-wrapper {

        display: block;
    }

    .np-register-info {

        padding: 30px 25px;
    }

    .np-register-info h2 {

        font-size: 24px;
    }

    .np-register-form {

        padding: 30px 22px;
    }

    .np-register-form h1 {

        font-size: 25px;
    }

    .np-register-benefits {

        display: grid;

        grid-template-columns:
            repeat(2, 1fr);

        gap: 10px;
    }

    .np-register-benefit {

        margin-bottom: 8px;
    }

}

@media(max-width: 480px) {

    .np-register-benefits {

        grid-template-columns: 1fr;
    }

}


/* Login page */



/* =========================================================
       BREADCRUMB
    ========================================================= */

.np-login-breadcrumb {

    background: var(--cream);

    padding: 20px 0;

    border-bottom: 1px solid #eee;
}

.np-login-breadcrumb .breadcrumb {

    margin: 0;

    align-items: center;
}

.np-login-breadcrumb .breadcrumb-item {

    font-size: 8px;

    color: #999;
}

.np-login-breadcrumb .breadcrumb-item a {

    color: var(--gold);

    text-decoration: none;

    transition: .3s;
}

.np-login-breadcrumb .breadcrumb-item a:hover {

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

.np-login-breadcrumb .breadcrumb-item.active {

    color: #555;

    font-weight: 600;
}

.np-login-breadcrumb .breadcrumb-item+.breadcrumb-item::before {

    color: #bbb;

    font-size: 9px;
}


/* =========================================================
       LOGIN SECTION
    ========================================================= */

.np-login-section {

    padding: 65px 0 80px;

    background:
        linear-gradient(135deg,
            #ffffff 0%,
            #faf8f2 100%);
}


/* =========================================================
       LOGIN WRAPPER
    ========================================================= */

.np-login-wrapper {

    max-width: 980px;

    margin: auto;

    display: grid;

    grid-template-columns: 40% 60%;

    background: #fff;

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

    border-radius: 8px;

    overflow: hidden;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, .07);
}


/* =========================================================
       LEFT SIDE
    ========================================================= */

.np-login-info {

    position: relative;

    padding: 45px 35px;

    background:
        linear-gradient(145deg, #153156, #0c223f);

    color: #fff;

    overflow: hidden;
}


.np-login-info::before {

    content: "";

    position: absolute;

    width: 230px;
    height: 230px;

    border-radius: 50%;

    border: 1px solid rgba(185, 151, 85, .25);

    top: -90px;
    right: -90px;
}


.np-login-info::after {

    content: "";

    position: absolute;

    width: 170px;
    height: 170px;

    border-radius: 50%;

    background:
        rgba(185, 151, 85, .06);

    bottom: -60px;
    left: -60px;
}


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

.np-login-mark {

    width: 45px;
    height: 45px;

    display: flex;

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

    background: var(--gold);

    color: #fff;

    border-radius: 5px;

    font-size: 18px;

    margin-bottom: 28px;

    position: relative;

    z-index: 2;
}


.np-login-info h2 {

    position: relative;

    z-index: 2;

    font-size: 28px;

    line-height: 1.3;

    font-weight: 700;

    margin-bottom: 13px;
}


.np-login-info h2 span {

    color: #d0ae67;
}


.np-login-info>p {

    position: relative;

    z-index: 2;

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

    font-size: 11px;

    line-height: 1.9;

    margin-bottom: 30px;
}


/* =========================================================
       FEATURES
    ========================================================= */

.np-login-feature {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 11px;

    margin-bottom: 18px;
}


.np-login-feature-icon {

    width: 40px;
    height: 40px;

    min-width: 33px;

    display: flex;

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

    color: #d3b16b;

    background:
        rgba(185, 151, 85, .13);

    border-radius: 4px;

    font-size: 19px;
}


.np-login-feature strong {

    display: block;

    color: #fff;

    font-size: 12px;

    margin-bottom: 3px;
}


.np-login-feature span {

    display: block;

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

    font-size: 9px;

    line-height: 1.5;
}


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

.np-login-form {

    padding: 45px 50px;
}


.np-login-eyebrow {

    color: var(--gold);

    font-size: 8px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1.5px;

    margin-bottom: 8px;
}


.np-login-form h1 {

    color: var(--dark);

    font-size: 30px;

    font-weight: 700;

    margin-bottom: 7px;
}


.np-login-form h1 span {

    color: var(--gold);
}


.np-login-intro {

    color: #888;

    font-size: 12px;

    line-height: 1.7;

    margin-bottom: 27px;
}


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

.np-login-field {

    margin-bottom: 17px;
}


.np-login-field label {

    display: block;

    color: #555;

    font-size: 11px;

    font-weight: 600;

    margin-bottom: 6px;
}


.np-login-input-wrapper {

    position: relative;
}


.np-login-input-wrapper>i {

    position: absolute;

    left: 12px;

    top: 50%;

    transform:
        translateY(-50%);

    color: var(--gold);

    font-size: 11px;

    pointer-events: none;
}


.np-login-input {

    width: 100%;

    height: 43px;

    padding: 0 38px 0 35px;

    border: 1px solid #ddd9d0;

    border-radius: 4px;

    background: #fff;

    color: #333;

    font-size: 13px;

    outline: none;

    transition: .3s;
}


.np-login-input::placeholder {

    color: #aaa;
}


.np-login-input:focus {

    border-color: var(--gold);

    box-shadow:
        0 0 0 3px rgba(185, 151, 85, .08);
}


/* =========================================================
       SHOW PASSWORD
    ========================================================= */

.np-login-password-toggle {

    position: absolute;

    right: 12px;

    top: 50%;

    transform:
        translateY(-50%);

    color: #999;

    cursor: pointer;

    font-size: 11px;

    transition: .3s;
}


.np-login-password-toggle:hover {

    color: var(--gold);
}


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

.np-login-options {

    display: flex;

    align-items: center;

    justify-content: end;

    margin: 3px 0 20px;
}


.np-login-remember {

    display: flex;

    align-items: center;

    gap: 6px;
}


.np-login-remember input {

    width: 12px;
    height: 12px;

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


.np-login-remember label {

    color: #888;

    font-size: 7px;

    cursor: pointer;
}


.np-login-forgot {

    color: var(--gold);

    font-size: 11px;

    font-weight: 600;

    text-decoration: none;

    transition: .3s;
}


.np-login-forgot:hover {

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


/* =========================================================
       LOGIN BUTTON
    ========================================================= */

.np-login-btn {

    width: 100%;

    height: 44px;

    display: flex;

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

    gap: 7px;

    border: 0;

    border-radius: 4px;

    background: var(--gold);

    color: #fff;

    font-size: 12px;

    font-weight: 600;

    transition: .35s;
}


.np-login-btn:hover {

    background: var(--gold-dark);

    transform: translateY(-2px);

    box-shadow:
        0 7px 18px rgba(185, 151, 85, .2);
}


/* =========================================================
       DIVIDER
    ========================================================= */

.np-login-divider {

    display: flex;

    align-items: center;

    gap: 10px;

    margin: 22px 0 17px;

    color: #aaa;

    font-size: 7px;
}


.np-login-divider::before,
.np-login-divider::after {

    content: "";

    flex: 1;

    height: 1px;

    background: #eee;
}


/* =========================================================
       SOCIAL LOGIN
    ========================================================= */

.np-login-socials {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 8px;
}


.np-login-social {

    height: 39px;

    display: flex;

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

    gap: 7px;

    border: 1px solid #ddd9d0;

    border-radius: 4px;

    background: #fff;

    color: #666;

    text-decoration: none;

    font-size: 8px;

    transition: .3s;
}


.np-login-social i {

    font-size: 11px;
}


.np-login-social:hover {

    border-color: var(--gold);

    color: var(--gold);

    transform: translateY(-2px);
}


/* =========================================================
       REGISTER LINK
    ========================================================= */

.np-login-register {

    text-align: center;

    color: #999;

    font-size: 12px;

    margin-top: 21px;
}


.np-login-register a {

    color: var(--gold);

    font-weight: 600;

    text-decoration: none;
}


/* =========================================================
       ERROR MESSAGE
    ========================================================= */

.np-login-error {

    display: none;

    padding: 9px 11px;

    margin-bottom: 15px;

    background: #fff3f1;

    border: 1px solid #f0d2cd;

    border-radius: 4px;

    color: #b65b4d;

    font-size: 7px;
}


.np-login-error.show {

    display: block;

    animation:
        npLoginShake .35s ease;
}


@keyframes npLoginShake {

    0%,
    100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-5px);
    }

    75% {
        transform: translateX(5px);
    }
}


/* =========================================================
       ENTRANCE ANIMATION
    ========================================================= */

.np-login-animate-left {

    opacity: 0;

    transform: translateX(-35px);

    animation:
        npLoginLeft .8s ease forwards;
}


.np-login-animate-right {

    opacity: 0;

    transform: translateX(35px);

    animation:
        npLoginRight .8s ease forwards;
}


@keyframes npLoginLeft {

    to {

        opacity: 1;

        transform: translateX(0);
    }
}


@keyframes npLoginRight {

    to {

        opacity: 1;

        transform: translateX(0);
    }
}


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

@media(max-width: 767px) {

    .np-login-section {

        padding: 40px 0 55px;
    }


    .np-login-wrapper {

        display: block;
    }


    .np-login-info {

        padding: 32px 25px;
    }


    .np-login-info h2 {

        font-size: 24px;
    }


    .np-login-form {

        padding: 32px 22px;
    }


    .np-login-form h1 {

        font-size: 26px;
    }


    .np-login-socials {

        grid-template-columns: 1fr;
    }

}

/* Blog details page */

.blog-details-section {
    padding: 80px 0;
    background: #fff;
}

/* Blog Content */
.blog-details-image {
    width: 100%;
    height: 480px;
    object-fit: cover;
    border-radius: 8px;
}

.blog-details-content {
    padding-top: 25px;
}

.blog-details-content .blog-date {
    color: var(--gold);
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}

.blog-details-content h1 {
    font-size: 38px;
    line-height: 1.25;
    color: var(--dark);
    font-weight: 700;
    margin-bottom: 20px;
}

.blog-details-content p {
    color: var(--text);
    font-size: 16px;
    line-height: 1.9;
    margin-bottom: 20px;
}

/* Sidebar */
.blog-sidebar {
    border: 1px solid #eee;
    padding: 25px;
    border-radius: 8px;
    position: sticky;
    top: 100px;
}

.sidebar-title {
    position: relative;
    font-size: 22px;
    color: var(--dark);
    font-weight: 700;
    padding-bottom: 15px;
    margin-bottom: 20px;
}

.sidebar-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 45px;
    height: 3px;
    background: var(--gold);
}

.recent-blog {
    display: flex;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
}

.recent-blog:last-child {
    border-bottom: none;
}

.recent-blog img {
    width: 85px;
    height: 70px;
    object-fit: cover;
    border-radius: 5px;
    flex-shrink: 0;
}

.recent-blog-content h6 {
    font-size: 15px;
    line-height: 1.4;
    margin: 0 0 7px;
}

.recent-blog-content h6 a {
    color: var(--dark);
    text-decoration: none;
    transition: .3s;
}

.recent-blog-content h6 a:hover {
    color: var(--gold);
}

.recent-blog-content span {
    font-size: 12px;
    color: #999;
}

/* Responsive */
@media (max-width: 991px) {
    .blog-details-section {
        padding: 60px 0;
    }

    .blog-sidebar {
        margin-top: 40px;
        position: static;
    }

    .blog-details-image {
        height: 400px;
    }
}

@media (max-width: 575px) {
    .blog-details-section {
        padding: 40px 0;
    }

    .blog-details-image {
        height: 250px;
    }

    .blog-details-content h1 {
        font-size: 28px;
    }

    .blog-details-content p {
        font-size: 15px;
    }
}

.np-blog-hero {
    min-height: 370px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .80) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/buy-property.png");

    background-size: cover;
    background-position: center;
}

.blog-one {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-right: 5px
}

.blog-one small a {
    margin-right: 18px;
}


/* Forgot Password */


.np-forgot-breadcrumb {

    background: var(--cream);

    padding: 20px 0;

    border-bottom: 1px solid #eee;
}

.np-forgot-breadcrumb .breadcrumb {

    margin: 0;

    align-items: center;
}

.np-forgot-breadcrumb .breadcrumb-item {

    font-size: 8px;

    color: #999;
}

.np-forgot-breadcrumb .breadcrumb-item a {

    color: var(--gold);

    text-decoration: none;

    transition: .3s;
}

.np-forgot-breadcrumb .breadcrumb-item a:hover {

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

.np-forgot-breadcrumb .breadcrumb-item.active {

    color: #555;

    font-weight: 600;
}

.np-forgot-breadcrumb .breadcrumb-item+.breadcrumb-item::before {

    color: #bbb;

    font-size: 9px;
}


/* =========================================================
       MAIN SECTION
    ========================================================= */

.np-forgot-section {

    padding: 70px 0 85px;

    background:
        linear-gradient(135deg,
            #ffffff 0%,
            #faf8f2 100%);
}


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

.np-forgot-wrapper {

    max-width: 980px;

    margin: auto;

    display: grid;

    grid-template-columns: 40% 60%;

    background: #fff;

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

    border-radius: 8px;

    overflow: hidden;

    box-shadow:
        0 18px 50px rgba(0, 0, 0, .07);
}


/* =========================================================
       LEFT PANEL
    ========================================================= */

.np-forgot-info {

    position: relative;

    padding: 45px 35px;

    background:
        linear-gradient(145deg,
            #1d2225,
            #111416);

    color: #fff;

    overflow: hidden;
}


.np-forgot-info::before {

    content: "";

    position: absolute;

    width: 230px;
    height: 230px;

    border-radius: 50%;

    border: 1px solid rgba(185, 151, 85, .25);

    top: -90px;

    right: -90px;
}


.np-forgot-info::after {

    content: "";

    position: absolute;

    width: 170px;
    height: 170px;

    border-radius: 50%;

    background:
        rgba(185, 151, 85, .06);

    bottom: -60px;

    left: -60px;
}


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

.np-forgot-mark {

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--gold);

    color: #fff;

    border-radius: 5px;

    font-size: 19px;

    margin-bottom: 28px;

    position: relative;

    z-index: 2;
}


.np-forgot-info h2 {

    position: relative;

    z-index: 2;

    color: #fff;

    font-size: 28px;

    line-height: 1.3;

    font-weight: 700;

    margin-bottom: 13px;
}


.np-forgot-info h2 span {

    color: #153156;
}


.np-forgot-info>p {

    position: relative;

    z-index: 2;

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

    font-size: 11px;

    line-height: 1.9;

    margin-bottom: 30px;
}


/* =========================================================
       STEPS
    ========================================================= */

.np-forgot-step {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: flex-start;

    gap: 11px;

    margin-bottom: 20px;
}


.np-forgot-step-number {

    width: 40px;

    height: 40px;

    min-width: 30px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        rgba(185, 151, 85, .13);

    color: #153156;

    font-size: 12px;

    font-weight: 700;
}


.np-forgot-step strong {

    display: block;

    color: #fff;

    font-size: 11px;

    margin-bottom: 3px;
}


.np-forgot-step span {

    display: block;

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

    font-size: 10px;

    line-height: 1.6;
}


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

.np-forgot-form {

    padding: 50px;
}


.np-forgot-eyebrow {

    color: var(--gold);

    font-size: 8px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1.5px;

    margin-bottom: 8px;
}


.np-forgot-form h1 {

    color: var(--dark);

    font-size: 30px;

    font-weight: 700;

    margin-bottom: 8px;
}


.np-forgot-form h1 span {

    color: var(--gold);
}


.np-forgot-intro {

    color: #888;

    font-size: 11px;

    line-height: 1.8;

    max-width: 430px;

    margin-bottom: 28px;
}


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

.np-forgot-field {

    margin-bottom: 17px;
}


.np-forgot-field label {

    display: block;

    color: #555;

    font-size: 11px;

    font-weight: 600;

    margin-bottom: 6px;
}


.np-forgot-input-wrapper {

    position: relative;
}


.np-forgot-input-wrapper>i {

    position: absolute;

    left: 12px;

    top: 50%;

    transform:
        translateY(-50%);

    color: var(--gold);

    font-size: 11px;

    pointer-events: none;
}


.np-forgot-input {

    width: 100%;

    height: 44px;

    padding: 0 12px 0 35px;

    border: 1px solid #ddd9d0;

    border-radius: 4px;

    background: #fff;

    color: #333;

    font-size: 11px;

    outline: none;

    transition: .3s;
}


.np-forgot-input::placeholder {

    color: #aaa;
}


.np-forgot-input:focus {

    border-color: var(--gold);

    box-shadow:
        0 0 0 3px rgba(185, 151, 85, .08);
}


/* =========================================================
       SEND BUTTON
    ========================================================= */

.np-forgot-btn {

    width: 100%;

    height: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    border: 0;

    border-radius: 4px;

    background: var(--gold);

    color: #fff;

    font-size: 11px;

    font-weight: 600;

    transition: .35s;
}


.np-forgot-btn:hover {

    background: var(--gold-dark);

    transform: translateY(-2px);

    box-shadow:
        0 7px 18px rgba(185, 151, 85, .2);
}


/* =========================================================
       MESSAGE
    ========================================================= */

.np-forgot-message {

    display: none;

    padding: 12px;

    margin-bottom: 17px;

    border-radius: 4px;

    font-size: 7px;

    line-height: 1.6;
}


.np-forgot-message.success {

    display: block;

    color: #4d7852;

    background: #f1f8f1;

    border: 1px solid #d5e8d5;
}


.np-forgot-message.error {

    display: block;

    color: #b65b4d;

    background: #fff3f1;

    border: 1px solid #f0d2cd;
}


/* =========================================================
       BACK TO LOGIN
    ========================================================= */

.np-forgot-back-login {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 5px;

    margin-top: 22px;

    color: #999;

    font-size: 10px;

    text-decoration: none;

    transition: .3s;
}


.np-forgot-back-login i {

    transition: .3s;
}


.np-forgot-back-login:hover {

    color: var(--gold);
}


.np-forgot-back-login:hover i {

    transform: translateX(-3px);
}


/* =========================================================
       SECURITY NOTE
    ========================================================= */

.np-forgot-security {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    margin-top: 25px;

    padding-top: 17px;

    border-top: 1px solid #eee;

    color: #aaa;

    font-size: 10px;
}


.np-forgot-security i {

    color: var(--gold);

    font-size: 10px;
}


/* =========================================================
       ANIMATION
    ========================================================= */

.np-forgot-animate-left {

    opacity: 0;

    transform: translateX(-35px);

    animation:
        npForgotLeft .8s ease forwards;
}


.np-forgot-animate-right {

    opacity: 0;

    transform: translateX(35px);

    animation:
        npForgotRight .8s ease forwards;
}


@keyframes npForgotLeft {

    to {

        opacity: 1;

        transform: translateX(0);
    }
}


@keyframes npForgotRight {

    to {

        opacity: 1;

        transform: translateX(0);
    }
}


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

@media(max-width: 767px) {

    .np-forgot-section {

        padding: 40px 0 55px;
    }


    .np-forgot-wrapper {

        display: block;
    }


    .np-forgot-info {

        padding: 32px 25px;
    }


    .np-forgot-info h2 {

        font-size: 24px;
    }


    .np-forgot-form {

        padding: 32px 22px;
    }


    .np-forgot-form h1 {

        font-size: 26px;
    }

}


/* OTP verification page */


/* =========================================================
       OTP PAGE
    ========================================================= */

.np-otp-page {

    --primary: #17053f;
    --primary-light: #5b70ca;
    --primary-hover: #4f63b8;

    --text: #211946;
    --muted: #8a8898;

    --border: #c5c4d1;

    min-height: 100vh;

    background: #edf2ff;

    padding: 60px 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    font-family:
        Arial,
        Helvetica,
        sans-serif;
}


/* =========================================================
       MAIN DEVICE / WEBSITE FRAME
    ========================================================= */

.np-otp-frame {

    max-width: 1180px;

    background: #fff;

    border-radius: 55px;

    position: relative;

    box-shadow:
        0 25px 70px rgba(23, 5, 63, .10);

    overflow: hidden;
}


/* =========================================================
       TOP AREA
    ========================================================= */

.np-otp-topbar {

    width: 100%;

    height: 90px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 70px;
}


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

.np-otp-logo {

    display: flex;

    align-items: center;

    gap: 4px;

    color: #123d7a;

    font-size: 24px;

    font-weight: 800;

    letter-spacing: -1px;

    text-decoration: none;
}


.np-otp-logo-icon {

    width: 38px;

    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #293fd0;

    font-size: 30px;

    font-weight: 900;

    font-style: italic;
}


.np-otp-language {

    display: flex;

    align-items: center;

    gap: 8px;

    color: #aaa8b5;

    font-size: 12px;

    cursor: pointer;
}


.np-otp-language i {

    font-size: 9px;
}


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

.np-otp-content {

    min-height: 500px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 11px 21px 19px;
}


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

.np-otp-card {

    width: 100%;

    max-width: 370px;

    background: #fff;

    padding: 28px 18px 30px;

    border-radius: 5px;



    animation:
        npOtpCardIn .7s ease forwards;
}


@keyframes npOtpCardIn {

    from {

        opacity: 0;

        transform:
            translateY(25px) scale(.97);
    }

    to {

        opacity: 1;

        transform:
            translateY(0) scale(1);
    }
}


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

.np-otp-card h1 {

    margin: 0 0 8px;

    color: var(--text);

    font-size: 30px;

    line-height: 1.2;

    font-weight: 700;
}


.np-otp-card-description {

    color: #858393;

    font-size: 13px;

    line-height: 1.7;

    margin-bottom: 28px;
}


/* =========================================================
       OTP INPUTS
    ========================================================= */

.np-otp-inputs {

    display: flex;

    justify-content: center;

    gap: 16px;

    margin-bottom: 18px;
}


.np-otp-input {

    width: 48px;

    height: 48px;

    border: 2px solid var(--border);

    border-radius: 5px;

    background: #fff;

    color: var(--text);

    font-size: 20px;

    font-weight: 600;

    text-align: center;

    outline: none;

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


.np-otp-input:focus {

    border-color: var(--primary-light);

    box-shadow:
        0 0 0 3px rgba(91, 112, 202, .12);

    transform: translateY(-2px);
}


.np-otp-input.filled {

    border-color: var(--primary-light);
}


.np-otp-input.error {

    border-color: #d9534f;

    animation:
        npOtpShake .35s ease;
}


@keyframes npOtpShake {

    0%,
    100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-4px);
    }

    75% {
        transform: translateX(4px);
    }
}


/* =========================================================
       TIMER / RESEND
    ========================================================= */

.np-otp-meta {

    display: flex;

    justify-content: end;

    align-items: center;

    margin-bottom: 27px;

    color: #8c8b98;

    font-size: 11px;
}


.np-otp-time strong {

    color: var(--primary-light);

    font-weight: 700;
}


.np-otp-resend {

    border: 0;

    padding: 0;

    background: transparent;

    color: var(--primary-light);

    font-size: 11px;

    font-weight: 600;

    cursor: pointer;
}


.np-otp-resend:hover {

    text-decoration: underline;
}


.np-otp-resend:disabled {

    color: #b7b6c0;

    cursor: not-allowed;

    text-decoration: none;
}


/* =========================================================
       VERIFY BUTTON
    ========================================================= */

.np-otp-verify {

    width: 100%;

    height: 48px;

    border: 0;

    border-radius: 25px;

    background: var(--primary-light);

    color: #fff;

    font-size: 15px;

    font-weight: 600;

    cursor: pointer;

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


.np-otp-verify:hover {

    background: var(--primary-hover);

    transform: translateY(-2px);

    box-shadow:
        0 8px 20px rgba(91, 112, 202, .22);
}


.np-otp-verify:disabled {

    opacity: .7;

    cursor: not-allowed;

    transform: none;

    box-shadow: none;
}


/* =========================================================
       CANCEL BUTTON
    ========================================================= */

.np-otp-cancel {

    width: 100%;

    height: 48px;

    margin-top: 15px;

    border: 2px solid var(--primary-light);

    border-radius: 25px;

    background: #fff;

    color: var(--primary-light);

    font-size: 15px;

    font-weight: 600;

    cursor: pointer;

    transition: .3s;
}


.np-otp-cancel:hover {

    background: #f5f7ff;

    transform: translateY(-2px);
}


/* =========================================================
       MESSAGE
    ========================================================= */

.np-otp-message {

    display: none;

    margin-bottom: 15px;

    padding: 9px 12px;

    border-radius: 5px;

    font-size: 11px;

    line-height: 1.5;

    text-align: center;
}


.np-otp-message.error {

    display: block;

    color: #b84d49;

    background: #fff2f1;

    border: 1px solid #f0d0cd;
}


.np-otp-message.success {

    display: block;

    color: #477b52;

    background: #f1f9f2;

    border: 1px solid #d2e7d4;
}


/* =========================================================
       BOTTOM HELP
    ========================================================= */

.np-otp-help {

    position: absolute;

    bottom: 55px;

    left: 0;

    width: 100%;

    text-align: center;

    color: #9694a0;

    font-size: 11px;
}


.np-otp-help a {

    color: var(--primary-light);

    font-weight: 600;

    text-decoration: none;
}


.np-otp-help a:hover {

    text-decoration: underline;
}


/* =========================================================
       LOADING
    ========================================================= */

.np-otp-spinner {

    width: 16px;

    height: 16px;

    border: 2px solid rgba(255, 255, 255, .4);

    border-top-color: #fff;

    border-radius: 50%;

    display: inline-block;

    animation:
        npOtpSpin .7s linear infinite;

    vertical-align: middle;

    margin-right: 6px;
}


@keyframes npOtpSpin {

    to {
        transform: rotate(360deg);
    }
}


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

@media (max-width: 767px) {

    .np-otp-page {

        min-height: 100vh;

        padding: 20px 15px;

        align-items: flex-start;
    }


    .np-otp-frame {

        min-height: calc(100vh - 40px);

        border-width: 14px;

        border-radius: 30px;
    }


    .np-otp-topbar {

        height: 70px;

        padding: 0 22px;
    }


    .np-otp-logo {

        font-size: 18px;
    }


    .np-otp-logo-icon {

        width: 28px;

        height: 28px;

        font-size: 22px;
    }


    .np-otp-language {

        font-size: 10px;
    }


    .np-otp-content {

        min-height: auto;

        padding:
            45px 18px 120px;

        align-items: flex-start;
    }


    .np-otp-card {

        max-width: 100%;

        padding:
            25px 16px 27px;

        box-shadow:
            0 5px 20px rgba(0, 0, 0, .08);
    }


    .np-otp-card h1 {

        font-size: 27px;
    }


    .np-otp-card-description {

        font-size: 12px;

        margin-bottom: 25px;
    }


    .np-otp-inputs {

        gap: 10px;
    }


    .np-otp-input {

        width: 46px;

        height: 46px;
    }


    .np-otp-help {

        bottom: 25px;

        padding: 0 20px;

        font-size: 10px;
    }

}


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

@media (max-width: 380px) {

    .np-otp-page {

        padding: 10px;
    }


    .np-otp-frame {

        min-height:
            calc(100vh - 20px);

        border-width: 10px;

        border-radius: 24px;
    }


    .np-otp-topbar {

        padding: 0 15px;
    }


    .np-otp-inputs {

        gap: 7px;
    }


    .np-otp-input {

        width: 43px;

        height: 43px;

        font-size: 18px;
    }

}


/* Subscription Plane page */

.np-subscription-breadcrumb {

    background: var(--cream);

    padding: 20px 0;

    border-bottom: 1px solid #eee;
}

.np-subscription-breadcrumb .breadcrumb {

    margin: 0;

    align-items: center;
}

.np-subscription-breadcrumb .breadcrumb-item {

    font-size: 8px;

    color: #999;
}

.np-subscription-breadcrumb .breadcrumb-item a {

    color: var(--gold);

    text-decoration: none;

    transition: .3s;
}

.np-subscription-breadcrumb .breadcrumb-item a:hover {

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

.np-subscription-breadcrumb .breadcrumb-item.active {

    color: #555;

    font-weight: 600;
}

.np-subscription-breadcrumb .breadcrumb-item+.breadcrumb-item::before {

    color: #bbb;

    font-size: 9px;
}


/* =========================================================
       MAIN SECTION
    ========================================================= */

.np-subscription-section {

    padding: 60px 0 85px;

    background:
        linear-gradient(135deg,
            #ffffff 0%,
            #faf8f2 100%);
}


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

.np-subscription-heading {

    text-align: center;

    margin-bottom: 28px;
}

.np-subscription-eyebrow {

    color: var(--gold);

    font-size: 8px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1.6px;

    margin-bottom: 8px;
}

.np-subscription-heading h1 {

    color: var(--dark);

    font-size: 31px;

    font-weight: 700;

    margin-bottom: 7px;
}

.np-subscription-heading h1 span {

    color: var(--gold);
}

.np-subscription-heading p {

    max-width: 520px;

    margin: auto;

    color: #888;

    font-size: 9px;

    line-height: 1.8;
}


/* =========================================================
       BILLING TOGGLE
    ========================================================= */

.np-subscription-toggle {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    margin-bottom: 35px;
}

.np-subscription-toggle-label {

    color: #888;

    font-size: 8px;

    font-weight: 600;
}

.np-subscription-toggle-box {

    position: relative;

    width: 118px;

    height: 34px;

    padding: 3px;

    display: flex;

    background: #eeeae2;

    border-radius: 20px;
}

.np-subscription-toggle-btn {

    width: 50%;

    height: 28px;

    border: 0;

    background: transparent;

    color: #888;

    border-radius: 17px;

    font-size: 7px;

    font-weight: 600;

    cursor: pointer;

    position: relative;

    z-index: 2;

    transition: .3s;
}

.np-subscription-toggle-btn.active {

    color: #fff;
}

.np-subscription-toggle-slider {

    position: absolute;

    top: 3px;

    left: 3px;

    width: calc(50% - 3px);

    height: 28px;

    background: var(--gold);

    border-radius: 17px;

    transition: .35s;
}

.np-subscription-toggle-slider.yearly {

    transform: translateX(100%);
}

.np-save-badge {

    padding: 4px 7px;

    background: #edf6ee;

    color: #638369;

    border-radius: 12px;

    font-size: 6px;

    font-weight: 700;
}


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

.np-subscription-plans {

    max-width: 1050px;

    margin: auto;
}


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

.np-plan-card {

    height: 100%;

    position: relative;

    background: #fff;

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

    border-radius: 7px;

    padding: 30px 25px;

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

    animation:
        npPlanReveal .7s ease both;
}

.np-plan-card:hover {

    transform: translateY(-7px);

    border-color:
        rgba(185, 151, 85, .6);

    box-shadow:
        0 18px 45px rgba(0, 0, 0, .08);
}


.np-plan-card:nth-child(1) {

    animation-delay: .1s;
}

.np-plan-card:nth-child(2) {

    animation-delay: .2s;
}

.np-plan-card:nth-child(3) {

    animation-delay: .3s;
}


@keyframes npPlanReveal {

    from {

        opacity: 0;

        transform: translateY(25px);
    }

    to {

        opacity: 1;

        transform: translateY(0);
    }
}


/* =========================================================
       FEATURED PLAN
    ========================================================= */

.np-plan-card.featured {

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

    box-shadow:
        0 15px 45px rgba(185, 151, 85, .13);

    transform: translateY(-5px);
}

.np-plan-card.featured:hover {

    transform: translateY(-12px);
}


.np-plan-popular {

    position: absolute;

    top: -1px;

    left: 50%;

    transform:
        translateX(-50%);

    padding: 6px 18px;

    background: var(--gold);

    color: #fff;

    border-radius:
        0 0 5px 5px;

    font-size: 6px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .7px;
}


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

.np-plan-icon {

    width: 42px;

    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 18px;

    background:
        rgba(185, 151, 85, .1);

    color: var(--gold);

    border-radius: 5px;

    font-size: 17px;
}


.np-plan-card.featured .np-plan-icon {

    margin-top: 10px;
}


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

.np-plan-name {

    color: var(--dark);

    font-size: 21px;

    font-weight: 700;

    margin-bottom: 6px;
}

.np-plan-description {

    min-height: 31px;

    color: #999;

    font-size: 11px;

    line-height: 1.6;

    margin-bottom: 18px;
}


/* =========================================================
       PRICE
    ========================================================= */

.np-plan-price {

    display: flex;

    align-items: baseline;

    gap: 3px;

    margin-bottom: 5px;
}

.np-plan-currency {

    color: var(--gold);

    font-size: 15px;

    font-weight: 700;
}

.np-plan-amount {

    color: var(--dark);

    font-size: 31px;

    line-height: 1;

    font-weight: 700;
}

.np-plan-period {

    color: #999;

    font-size: 7px;
}


.np-plan-yearly-note {

    min-height: 15px;

    color: #638369;

    font-size: 7px;

    font-weight: 600;

    margin-bottom: 15px;
}


/* =========================================================
       DIVIDER
    ========================================================= */

.np-plan-divider {

    height: 1px;

    background: #eee;

    margin: 17px 0;
}


/* =========================================================
       FEATURES
    ========================================================= */

.np-plan-features {

    list-style: none;

    padding: 0;

    margin: 0;
}

.np-plan-features li {

    display: flex;

    align-items: flex-start;

    gap: 8px;

    color: #666;

    font-size: 10px;

    line-height: 1.6;

    margin-bottom: 11px;
}

.np-plan-features li i {

    color: var(--gold);

    font-size: 10px;

    margin-top: 1px;
}

.np-plan-features li.disabled {

    color: #bbb;
}

.np-plan-features li.disabled i {

    color: #cfcfcf;
}


/* =========================================================
       PLAN BUTTON
    ========================================================= */

.np-plan-btn {

    width: 100%;

    height: 40px;

    margin-top: 15px;

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

    border-radius: 4px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    background: #fff;

    color: var(--gold);

    text-decoration: none;

    font-size: 8px;

    font-weight: 600;

    transition: .3s;
}

.np-plan-btn:hover {

    background: var(--gold);

    color: #fff;

    transform: translateY(-2px);

    box-shadow:
        0 7px 18px rgba(185, 151, 85, .2);
}


.np-plan-card.featured .np-plan-btn {

    background: var(--gold);

    color: #fff;
}

.np-plan-card.featured .np-plan-btn:hover {

    background: var(--gold-dark);
}


/* =========================================================
       GUARANTEE
    ========================================================= */

.np-subscription-guarantee {

    max-width: 700px;

    margin: 35px auto 0;

    padding: 14px 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    background: #fff;

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

    border-radius: 5px;

    color: #888;

    font-size: 7px;

    text-align: center;
}

.np-subscription-guarantee i {

    color: #64846b;

    font-size: 12px;
}


/* =========================================================
       COMPARISON SECTION
    ========================================================= */

.np-subscription-bottom {

    margin-top: 55px;

    text-align: center;
}

.np-subscription-bottom h2 {

    color: var(--dark);

    font-size: 20px;

    font-weight: 700;

    margin-bottom: 7px;
}

.np-subscription-bottom p {

    color: #999;

    font-size: 8px;

    margin-bottom: 22px;
}


.np-subscription-mini-features {

    max-width: 850px;

    margin: auto;

    display: grid;

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

    gap: 10px;
}


.np-mini-feature {

    padding: 16px 10px;

    background: #fff;

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

    border-radius: 5px;

    transition: .3s;
}

.np-mini-feature:hover {

    transform: translateY(-4px);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, .05);
}

.np-mini-feature i {

    display: block;

    color: var(--gold);

    font-size: 16px;

    margin-bottom: 7px;
}

.np-mini-feature strong {

    display: block;

    color: #444;

    font-size: 7px;

    margin-bottom: 3px;
}

.np-mini-feature span {

    display: block;

    color: #aaa;

    font-size: 6px;

    line-height: 1.5;
}


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

@media(max-width: 991px) {

    .np-plan-card.featured {

        transform: none;
    }

    .np-plan-card.featured:hover {

        transform: translateY(-7px);
    }

    .np-subscription-mini-features {

        grid-template-columns:
            repeat(2, 1fr);
    }

}


@media(max-width: 767px) {

    .np-subscription-section {

        padding: 45px 0 60px;
    }

    .np-subscription-heading h1 {

        font-size: 26px;
    }

    .np-subscription-heading p {

        padding: 0 15px;
    }

    .np-subscription-toggle {

        margin-bottom: 25px;
    }

    .np-plan-card {

        padding: 25px 22px;
    }

}


@media(max-width: 575px) {

    .np-subscription-mini-features {

        grid-template-columns: 1fr;
    }

    .np-subscription-guarantee {

        margin-left: 10px;

        margin-right: 10px;
    }

}

.np-two-agent-actions {
    display: flex;
    gap: 7px;
}

.np-two-agent-actions .np-agent-btn {
    padding: 9px 12px;
    font-size: 13px;
    flex: 1;
}


/* ================================
   Testimonials
================================ */

.np-testimonials-section {
    padding: 90px 0;
    background: #f8f6f1;
    overflow: hidden;
}

.np-testimonials-heading span {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--gold);
}

.np-testimonials-heading h2 {
    margin: 10px 0 12px;
    font-family: "Bodoni Moda", serif;
    font-size: 42px;
    font-weight: 500;
    color: #28231f;
}

.np-testimonials-heading p {
    max-width: 600px;
    margin: auto;
    color: #777;
    font-size: 15px;
}

/* Card */

.np-testimonial-card {
    position: relative;
    min-height: 385px;
    padding: 28px 30px 30px;
    background: #fff;
    border-radius: 18px;
    margin: 5px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Quote */

.np-quote {
    height: 55px;
}

.np-quote i {
    font-size: 54px;
    line-height: 1;
    color: #eadfc8;
}

.np-testimonial-text {
    margin: 15px 0 25px;
    font-size: 16px;
    line-height: 1.65;
    font-style: italic;
    color: #45403d;
    flex: 1;
}

/* Client */

.np-testimonial-bottom {
    display: flex;
    align-items: center;
    gap: 12px;
}

.np-testimonial-bottom img {
    width: 52px !important;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
}

.np-testimonial-bottom h6 {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 700;
    color: var(--gold);
}

.np-testimonial-bottom span {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--gold);
}

/* Owl Carousel */

.np-testimonial-carousel .owl-stage {
    display: flex;
}

.np-testimonial-carousel .owl-item {
    display: flex;
}

.np-testimonial-carousel .item {
    width: 100%;
}

/* Owl Cursor / Navigation */

.np-testimonial-carousel .owl-nav {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 30px;
}

.np-testimonial-carousel .owl-nav button {
    width: 42px;
    height: 42px;
    border: 1px solid #d8cdbb !important;
    border-radius: 50%;
    background: #fff !important;
    color: #3b332d !important;
    font-size: 20px !important;
    transition: .3s ease;
}

.np-testimonial-carousel .owl-nav button:hover {
    background: #3b332d !important;
    color: #fff !important;
}

/* Dots */

.np-testimonial-carousel .owl-dots {
    margin-top: 20px;
    text-align: center;
}

.np-testimonial-carousel .owl-dot span {
    width: 7px !important;
    height: 7px !important;
    margin: 5px !important;
    background: #d6cbb9 !important;
}

.np-testimonial-carousel .owl-dot.active span {
    width: 24px !important;
    border-radius: 10px;
    background: #b88a44 !important;
}

/* Mobile */

@media (max-width: 767px) {

    .np-testimonials-section {
        padding: 60px 0;
    }

    .np-testimonials-heading h2 {
        font-size: 32px;
    }

    .np-testimonial-card {
        min-height: 350px;
        padding: 25px;
    }

    .np-testimonial-text {
        font-size: 14px;
    }

}

.np-login-hero {
    min-height: 370px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .80) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/luxury2.png");

    background-size: cover;
    background-position: center;
}

.np-register-hero {
    min-height: 370px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .80) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/residential1.png");

    background-size: cover;
    background-position: center;
}


.navbar-nav .nav-link {
    position: relative;
}

.navbar-nav .nav-link.active {
    color: #1531564 !important;
    font-weight: 900 !important;
}

.navbar-nav .nav-link.active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    height: 2px;
    background: #153156;
    border-radius: 10px;
}

@media (max-width:768px){
    .navbar-nav .nav-link.active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2px;
    width: 62px;
    height: 2px;
    background: #153156;
}
}




/* preloader */
#page {
    display: none;
}

#loading {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000000;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    background-image: url("../img/preloader.gif");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 300px;
}


.np-loc-hero {
    min-height: 370px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .80) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/index-banner1.png");

    background-size: cover;
    background-position: center;
}



.recapcha{
    width: 120px !important;
}


.category-img{
    width: 35px;
    height: 35px;
}


.wa-ultimate-button1 {
  position: fixed;
  bottom: 30px;
  left: 45px;
  z-index: 100;
  perspective: 1200px;
  animation: fadeInUp 1.2s ease-out;
}

.wa-entry {
  position: relative;
  width: 65px;
  height: 65px;
  background: radial-gradient(circle, #25d366 0%, #128c7e 100%);
  border-radius: 50%;
  color: white;
  font-size: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow:
    0 0 20px #25d366,
    0 0 60px rgba(37, 211, 102, 0.6),
    inset 0 0 15px #128c7e;
  transition: transform 0.3s ease;
  overflow: visible;
  animation: pulse 2.5s infinite ease-in-out;
}

.wa-entry:hover {
  transform: scale(1.08) rotateX(10deg);
}

.wa-glow {
  position: absolute;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  top: -20px;
  left: -20px;
  background: radial-gradient(circle, rgba(37, 211, 102, 0.3), transparent);
  animation: glowPulse 3s ease-in-out infinite;
  filter: blur(12px);
  z-index: 0;
}

.wa-ring {
  position: absolute;
  border-radius: 50%;
  border: 2px dashed rgb(33 197 107);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.ring1 {
  width: 75px;
  height: 75px;
  animation: spin 8s linear infinite;
}

.ring2 {
  width: 120px;
  height: 120px;
  animation: spinReverse 12s linear infinite;
}

.wa-bubbles {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: white;
  opacity: 0.6;
  animation: bubbles 4s linear infinite;
  box-shadow:
    0 0 4px #fff,
    0 -10px 0 0 rgba(255,255,255,0.3),
    0 -20px 0 0 rgba(255,255,255,0.2),
    0 -30px 0 0 rgba(255,255,255,0.1);
}

.wa-tooltip {
  position: absolute;
  bottom: 100%;
  margin-bottom: 15px;
  padding: 6px 14px;
  font-size: 14px;
  color: #000;
  white-space: nowrap;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(8px);
  border-radius: 10px;
  opacity: 0;
  transform: scale(0.95);
  transition: 0.4s ease;
  text-shadow: 0 0 4px #25d366;
}

.wa-entry:hover .wa-tooltip {
  opacity: 1;
  transform: scale(1);
}
.wa-entry:hover i{
  color: #fff
}
.wa-tooltip span {
  display: inline-block;
  overflow: hidden;
  border-right: 2px solid #fff;
  white-space: nowrap;
  animation: typing 3s steps(25) 1s forwards, blink 0.8s step-end infinite;
  max-width: 0;
}

/* Animations */
@keyframes pulse {
  0%, 100% {
    box-shadow:
      0 0 20px #25d366,
      0 0 60px rgba(37, 211, 102, 0.5),
      inset 0 0 15px #128c7e;
  }
  50% {
    box-shadow:
      0 0 30px #25d366,
      0 0 80px rgba(37, 211, 102, 0.8),
      inset 0 0 25px #128c7e;
  }
}

@keyframes spin {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes spinReverse {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(-360deg); }
}

@keyframes bubbles {
  0% {
    transform: translateX(-50%) translateY(0);
    opacity: 0.6;
  }
  100% {
    transform: translateX(-50%) translateY(-50px);
    opacity: 0;
  }
}

@keyframes glowPulse {
  0%, 100% { opacity: 0.2; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.2); }
}

@keyframes typing {
  to { max-width: 220px; }
}

@keyframes blink {
  0%, 100% { border-color: transparent; }
  50% { border-color: white; }
}

@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(40px); }
  100% { opacity: 1; transform: translateY(0); }
}

.navigation li.active a {
    color: #eb7102 !important;
    font-weight: bold;
}
@media (max-width: 767px) {
    .call-to-action-6 {
        display: none !important;
    }
}



/* =========================================
   PROPERTY IMAGE GALLERY
========================================= */

.np-property-gallery {
    width: 100%;
}

/* Main Image */

.np-gallery-main {
    width: 100%;
    height: 520px;
    overflow: hidden;
    border-radius: 18px;
    background: #f5f5f5;
    position: relative;
}

.np-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: opacity 0.3s ease, transform 0.4s ease;
}

.np-gallery-main:hover img {
    transform: scale(1.02);
}

/* =========================================
   PROPERTY MEDIA OPTIONS
========================================= */

/*.np-property-media-options {*/
/*    display: grid;*/
/*    grid-template-columns: repeat(4, 1fr);*/
/*    gap: 12px;*/
/*    margin-top: 15px;*/
/*}*/

/*.np-media-option {*/
/*    min-height: 68px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    gap: 12px;*/
/*    padding: 12px 15px;*/

/*    background: #fff;*/
/*    border: 1px solid #e5e5e5;*/
/*    border-radius: 12px;*/

/*    text-decoration: none;*/
/*    color: #111;*/

/*    cursor: pointer;*/
/*    transition: all 0.25s ease;*/
/*}*/

/*.np-media-option:hover {*/
/*    border-color: #111;*/
/*    transform: translateY(-2px);*/
/*    box-shadow: 0 6px 18px rgba(0,0,0,0.08);*/
/*}*/

/*.np-media-icon {*/
/*    width: 40px;*/
/*    height: 40px;*/

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

/*    flex-shrink: 0;*/

/*    border-radius: 50%;*/
/*    background: #f4f4f4;*/

/*    font-size: 18px;*/
/*}*/

/*.np-media-option span:last-child {*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    text-align: left;*/
/*}*/

/*.np-media-option strong {*/
/*    font-size: 14px;*/
/*    font-weight: 600;*/
/*}*/

/*.np-media-option small {*/
/*    margin-top: 3px;*/
/*    color: #777;*/
/*    font-size: 11px;*/
/*}*/

.np-enquiry-option {
    background: #111;
    color: #fff;
    border-color: #111;
}

.np-enquiry-option .np-media-icon {
    background: rgba(255,255,255,0.12);
}

.np-enquiry-option small {
    color: #ccc;
}


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

@media (max-width: 900px) {

    .np-property-media-options {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media (max-width: 500px) {

    .np-property-media-options {
        grid-template-columns: 1fr;
    }

}


/* =========================================
   THUMBNAILS
========================================= */

.np-gallery-thumbs {
    display: flex;
    gap: 12px;
    margin-top: 14px;
    overflow-x: auto;
    padding-bottom: 5px;

    scrollbar-width: thin;
}

.np-gallery-thumb {
    flex: 0 0 105px;
    height: 78px;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    background: #f5f5f5;
    transition: all 0.3s ease;
}

.np-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.np-gallery-thumb:hover img {
    transform: scale(1.08);
}

.np-gallery-thumb:hover {
    border-color: #999;
}

/* Active thumbnail */

.np-gallery-thumb.active {
    border-color: #000;
}


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

@media (max-width: 767px) {

    .np-gallery-main {
        height: 300px;
        border-radius: 12px;
    }

    .np-gallery-thumbs {
        gap: 8px;
        margin-top: 10px;
    }

    .np-gallery-thumb {
        flex: 0 0 80px;
        height: 62px;
        border-radius: 8px;
    }

}
/* =================================
   AGENTCONNECT PRICING SECTION ONLY
   FONT SIZE INCREASED
================================= */

.ac-pricing-section {
    width: 100%;
    padding: 15px 15px 25px;
    font-family: Arial, Helvetica, sans-serif;
    background: #fff;
    box-sizing: border-box;
}

.ac-pricing-section *,
.ac-pricing-section *::before,
.ac-pricing-section *::after {
    box-sizing: border-box;
}

.ac-pricing-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}


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

.ac-pricing-title {
    text-align: center;
    margin-bottom: 15px;
}

.ac-pricing-title h2 {
    margin: 0;
    color: #111a3a;
    font-size: 40px;
    line-height: 1.15;
    font-weight: 700;
}

.ac-pricing-title p {
    margin: 7px 0 15px;
    color: #555;
    font-size: 16px;
    line-height: 1.4;
}


/* =================================
   TOP FEATURES
================================= */

.ac-features-strip {
    width: 650px;
    max-width: 100%;
    min-height: 45px;
    margin: 0 auto 12px;
    border: 1px solid #e5e8ed;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,.03);
}

.ac-features-strip div {
    flex: 1;
    text-align: center;
    font-size: 13px;
    color: #333;
    white-space: nowrap;
}

.ac-features-strip span {
    font-size: 16px;
    margin-right: 6px;
}

.ac-features-strip i {
    width: 1px;
    height: 22px;
    background: #ddd;
}


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

.ac-tab-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 45px;
    margin-bottom: 15px;
}

.ac-pricing-tabs {
    width: 310px;
    height: 48px;
    display: flex;
    border: 1px solid #e0e5eb;
    border-radius: 9px;
    overflow: hidden;
    background: #fff;
}

.ac-tab-btn {
    width: 50%;
    border: 0;
    background: #fff;
    cursor: pointer;
    color: #111;
    padding: 5px;
    line-height: 1.1;
}

.ac-tab-btn strong {
    display: block;
    font-size: 14px;
}

.ac-tab-btn small {
    display: block;
    font-size: 10px;
    margin-top: 2px;
}

.ac-tab-btn.active {
    background: #153156;
    color: #fff;
}

.ac-save-badge {
    color: #23834a;
    background: #f3fff7;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 11px;
    white-space: nowrap;
}


/* =================================
   PLANS
================================= */

.ac-plans-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}

.ac-yearly-plans {
    display: none;
}


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

.ac-plan-card {
    position: relative;
    min-width: 0;
    border: 1px solid #d8dde4;
    border-radius: 13px;
    padding: 16px 15px 14px;
    background: #fff;
    text-align: center;
    overflow: visible;
}

.ac-plan-card.ac-free {
    border-color: #8acda4;
}

.ac-plan-card.ac-starter {
    border-color: #8bb9eb;
}

.ac-plan-card.ac-pro {
    border-color: #e5b66f;
}

.ac-plan-card.ac-business {
    border-color: #b69ade;
}


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

.ac-plan-badge {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 10px;
    background: #079447;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    margin-bottom: 7px;
}

.ac-starter .ac-plan-badge {
    background: #153156;
}

.ac-pro .ac-plan-badge {
    background: #ef7615;
}

.ac-business .ac-plan-badge {
    background: #153155;
}


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

.ac-popular {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #f47719;
    color: #fff;
    padding: 5px 14px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}


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

.ac-plan-card h3 {
    margin: 2px 0 6px;
    font-size: 27px;
    line-height: 1.15;
    color: #153156;
}

.ac-starter h3 {
    color: #153156;
}

.ac-pro h3 {
    color: #e87514;
}

.ac-business h3 {
    color: #153055;
}

.ac-plan-description {
    min-height: 42px;
    margin: 0 0 6px;
    color: #333;
    font-size: 11px;
    line-height: 1.35;
}


/* =================================
   PRICE
================================= */

.ac-price {
    font-size: 31px;
    font-weight: 700;
    line-height: 1;
    margin-top: 5px;
    color: #079447;
}

.ac-price span {
    font-size: 21px;
}

.ac-starter .ac-price {
    color: #153156;
}

.ac-pro .ac-price {
    color: #153156;
}

.ac-business .ac-price {
    color: #153155;
}

.ac-period {
    font-size: 11px;
    color: #555;
    margin-top: 4px;
}

.ac-save-text {
    min-height: 15px;
    color: #23914d;
    font-size: 10px;
    font-weight: 600;
    margin-top: 3px;
}


/* =================================
   HIGHLIGHT
================================= */

.ac-plan-highlight {
    min-height: 52px;
    margin: 10px 0;
    padding: 8px;
    border-radius: 6px;
    background: #f5faf7;
    display: flex;
    align-items: center;
    text-align: left;
    gap: 8px;
}

.ac-starter .ac-plan-highlight {
    background: #f4f8fc;
}

.ac-pro .ac-plan-highlight {
    background: #fff9f0;
}

.ac-business .ac-plan-highlight {
    background: #f8f4fc;
}

.ac-plan-highlight span {
    font-size: 20px;
}

.ac-plan-highlight p {
    margin: 0;
    font-size: 10px;
    line-height: 1.35;
    color: #222;
}


/* =================================
   SECTION HEADINGS
================================= */

.ac-plan-card h4 {
    text-align: left;
    margin: 11px 0 6px;
    color: #148445;
    font-size: 11px;
    font-weight: 700;
}

.ac-starter h4 {
    color: #153156;
}

.ac-pro h4 {
    color: #dc711a;
}

.ac-business h4 {
    color: #153155;
}


/* =================================
   LISTS
================================= */

.ac-plan-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.ac-plan-card li {
    position: relative;
    padding-left: 17px;
    margin: 6px 0;
    color: #303030;
    font-size: 10px;
    line-height: 1.3;
}

.ac-plan-card li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    font-size: 10px;
    font-weight: 700;
    color: #079447;
}

.ac-starter li::before {
    color: #086bd8;
}

.ac-pro li::before {
    color: #ed7616;
}

.ac-business li::before {
    color: #6224b8;
}


/* =================================
   DIVIDER
================================= */

.ac-divider {
    height: 1px;
    background: #e7e7e7;
    margin: 11px 0 7px;
}


/* =================================
   TWO COLUMNS
================================= */

.ac-two-column-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
}


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

.ac-plan-button {
    width: 100%;
    height: 34px;
    margin-top: 12px;
    border: 0;
    border-radius: 6px;
    color: #fff;
    background: #079447;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}

.ac-starter .ac-plan-button {
    background: #153156;
}

.ac-pro .ac-plan-button {
    background: #f4770d;
}

.ac-business .ac-plan-button {
    background: #153155;
}

.ac-credit-note {
    display: block;
    font-size: 9px;
    margin-top: 4px;
    color: #555;
}


/* =================================
   BOTTOM INFO
================================= */

.ac-bottom-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 13px;
    border: 1px solid #edf0f3;
    background: #fafbfd;
    border-radius: 5px;
    min-height: 50px;
}

.ac-bottom-info > div {
    text-align: center;
    padding: 8px 10px;
    border-right: 1px solid #e5e8ec;
}

.ac-bottom-info > div:last-child {
    border-right: 0;
}

.ac-bottom-info strong {
    display: block;
    color: #13225a;
    font-size: 10px;
    margin-bottom: 3px;
}

.ac-bottom-info small {
    display: block;
    color: #555;
    font-size: 9px;
}


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

@media (max-width: 1000px) {

    .ac-pricing-container {
        max-width: 95%;
    }

    .ac-plans-wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    .ac-pricing-title h2 {
        font-size: 34px;
    }
}

@media (max-width: 768px) {
    .ac-plans-wrapper {
        grid-template-columns: repeat(1, 1fr) !IMPORTANT;
    }
}


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

@media (max-width: 600px) {

    .ac-pricing-section {
        padding: 15px 10px;
    }

    .ac-pricing-container {
        max-width: 100%;
    }

    .ac-pricing-title h2 {
        font-size: 27px;
    }

    .ac-pricing-title p {
        font-size: 12px;
    }

    .ac-features-strip {
        width: 100%;
    }

    .ac-features-strip div {
        font-size: 8px;
    }

    .ac-features-strip span {
        display: none;
    }

    .ac-tab-row {
        flex-direction: column;
        gap: 10px;
    }

    .ac-pricing-tabs {
        width: 290px;
        height: 45px;
    }

    .ac-tab-btn strong {
        font-size: 13px;
    }

    .ac-tab-btn small {
        font-size: 9px;
    }

    .ac-save-badge {
        font-size: 10px;
    }

    .ac-plans-wrapper {
        grid-template-columns: 1fr;
    }

    .ac-plan-card {
        padding: 18px;
    }

    .ac-plan-card h3 {
        font-size: 28px;
    }

    .ac-plan-description {
        font-size: 12px;
    }

    .ac-price {
        font-size: 32px;
    }

    .ac-plan-card li {
        font-size: 11px;
    }

    .ac-plan-card h4 {
        font-size: 12px;
    }

    .ac-plan-highlight p {
        font-size: 11px;
    }

    .ac-plan-button {
        height: 38px;
        font-size: 12px;
    }

    .ac-bottom-info {
        grid-template-columns: 1fr;
    }

    .ac-bottom-info > div {
        border-right: 0;
        border-bottom: 1px solid #e5e8ec;
    }

    .ac-bottom-info > div:last-child {
        border-bottom: 0;
    }
}


/* =========================================
   PROPERTY MATCHING
========================================= */

.np-property-match {
    width: 100%;
    max-width: 1200px;
    margin: 60px auto;
    padding: 0 20px;
    font-family: Arial, sans-serif;
}


/* HEADER */

.np-match-header {
    text-align: center;
    margin-bottom: 35px;
}

.np-match-label {
    font-size: 11px;
    letter-spacing: 3px;
    font-weight: 700;
    color: #777;
}

.np-match-header h2 {
    margin: 10px 0;
    font-size: 34px;
    color: #111;
}

.np-match-header p {
    margin: 0;
    color: #777;
    font-size: 14px;
}


/* TWO CARDS */




.np-match-card {
    padding: 28px;
    border: 1px solid #e4e4e4;
    border-radius: 18px;
    background: #fff;
}


.np-match-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 25px;
}


.np-match-card-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    background: #153156;
    color: #fff;

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


.np-match-card-header h3 {
    margin: 0;
    font-size: 18px;
}


.np-match-card-header p {
    margin: 4px 0 0;
    font-size: 12px;
    color: #888;
}


/* FIELDS */

.np-match-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}


.np-match-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}


.np-match-full {
    grid-column: 1 / -1;
}


.np-match-field label {
    font-size: 12px;
    font-weight: 600;
    color: #333;
}


.np-match-field input,
.np-match-field select {
    width: 100%;
    height: 45px;
    /*padding: 0 13px;*/

    border: 1px solid #ddd;
    border-radius: 8px;

    background: #fff;
    font-size: 13px;
    color: #222;
    outline: none;
}


.np-match-field input:focus,
.np-match-field select:focus {
    border-color: #153156;
}


/* BUDGET */

.np-match-input-group {
    display: flex;
    align-items: center;

    height: 45px;

    border: 1px solid #ddd;
    border-radius: 8px;

    overflow: hidden;
}


.np-match-input-group span {
    padding-left: 13px;
    font-weight: 600;
}


.np-match-input-group input {
    height: 43px;
    border: none;
    flex: 1;
}


.np-match-input-group small {
    padding-right: 13px;
    color: #777;
}


/* AMENITIES */

.np-amenities {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}


.np-amenity {
    display: flex;
    align-items: center;
    gap: 7px;

    padding: 9px 11px;

    border: 1px solid #ddd;
    border-radius: 7px;

    font-size: 11px;
    cursor: pointer;
}


.np-amenity input {
    display: none;
}


.np-amenity span {
    display: none;
}


.np-amenity:has(input:checked) {
    background: #153156;
    border-color: #153156;
    color: #fff;
}


/* BUTTON */

.np-match-action {
    display: flex;
    justify-content: center;
    margin: 150px 0;
}

@media (max-width:768px){
    .np-match-action {
    display: flex;
    justify-content: center;
    margin: 25px 0;
}
}

.np-check-match {
    display: flex;
    align-items: center;
    gap: 5px;

    padding: 15px 22px;

    border: none;
    border-radius: 9px;

    background: #153156;
    color: #fff;

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

    cursor: pointer;
}


.np-check-match b {
    font-size: 20px;
}


.np-check-match:hover {
    background: #153156;
}


/* RESULT */

.np-match-result {
    padding: 30px;

    border: 1px solid #ddd;
    border-radius: 18px;

    background: #fafafa;
}


.np-match-score {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 30px;
}


/* SCORE CIRCLE */

.np-score-circle {
    width: 120px;
    height: 120px;

    flex-shrink: 0;

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

    border: 8px solid #153156;
    border-radius: 50%;
}


.np-score-circle span {
    font-size: 27px;
    font-weight: 700;
}


.np-score-circle small {
    color: #777;
    font-size: 11px;
}


.np-match-success {
    font-size: 10px;
    letter-spacing: 2px;
    font-weight: 700;
    color: #777;
}


.np-score-content h3 {
    margin: 6px 0;
    font-size: 24px;
}


.np-score-content p {
    margin: 0;
    color: #777;
    font-size: 13px;
}


/* BREAKDOWN */

.np-match-breakdown {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 35px;
}


.np-match-item > div:first-child {
    display: flex;
    justify-content: space-between;
    margin-bottom: 7px;
}


.np-match-item strong {
    font-size: 12px;
}


.np-match-item span {
    font-size: 12px;
    font-weight: 700;
}


.np-progress {
    height: 7px;
    background: #e5e5e5;
    border-radius: 20px;
    overflow: hidden;
}


.np-progress span {
    display: block;
    width: 0;
    height: 100%;
    background: #153156;
    transition: width 0.7s ease;
}


/* MOBILE */

@media (max-width: 800px) {

    .np-match-form {
        /* grid-template-columns: 1fr; */
    }

    .np-match-breakdown {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 500px) {

    .np-match-fields {
        grid-template-columns: 1fr;
    }

    .np-match-card {
        padding: 20px;
    }

    .np-match-score {
        flex-direction: column;
        align-items: flex-start;
    }

}

/* =========================================
   CONTACT & COLLABORATION
========================================= */

.np-contact-collaboration {
    margin-top: 25px;
    padding: 30px;
    border: 1px solid #e1e5ea;
    border-radius: 18px;
    background: #fff;
}

.np-contact-header {
    margin-bottom: 22px;
}

.np-contact-header h2 {
    margin: 7px 0;
    font-size: 24px;
    color: #153156;
}

.np-contact-header p {
    margin: 0;
    color: #777;
    font-size: 13px;
}


/* OPTIONS */

.np-contact-options {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}


/* CARD */

.np-contact-card {
    display: flex;
    align-items: center;
    gap: 13px;

    min-height: 78px;
    padding: 15px;

    border: 1px solid #e1e5ea;
    border-radius: 12px;

    background: #fff;
    color: #222;

    text-decoration: none;
    cursor: pointer;

    text-align: left;

    transition: all 0.25s ease;
}

.np-contact-card:hover {
    border-color: #153156;
    box-shadow: 0 6px 18px rgba(21, 49, 86, 0.10);
    transform: translateY(-2px);
}


/* ICON */

.np-contact-icon {
    width: 42px;
    height: 42px;

    flex-shrink: 0;

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

    border-radius: 10px;

    background: #eef3f8;
    color: #153156;

    font-size: 20px;
}


/* TEXT */

.np-contact-content {
    flex: 1;
}

.np-contact-content h3 {
    margin: 0 0 4px;
    font-size: 14px;
    color: #153156;
}

.np-contact-content p {
    margin: 0;
    font-size: 11px;
    color: #777;
}


/* ARROW */

.np-contact-arrow {
    color: #153156;
    font-size: 18px;
    font-weight: 600;
}


/* MOBILE */

@media (max-width: 800px) {

    .np-contact-options {
        grid-template-columns: 1fr;
    }

}


/* =========================================
   COLLABORATION PAGE
========================================= */

.np-collaboration-page {
    max-width: 1180px;
    margin: 60px auto;
    padding: 0 20px;
}


/* HEADER */

.np-collab-page-header {
    text-align: center;
    margin-bottom: 35px;
}

.np-collab-page-header > span {
    font-size: 10px;
    letter-spacing: 3px;
    font-weight: 700;
    color: #153156;
}

.np-collab-page-header h1 {
    margin: 8px 0;
    font-size: 34px;
    color: #153156;
}

.np-collab-page-header p {
    margin: 0;
    color: #777;
    font-size: 13px;
}


/* LAYOUT */

.np-collab-page-layout {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 22px;
    align-items: start;
}


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

.np-collab-property-card {
    padding: 20px;
    border: 1px solid #e2e6eb;
    border-radius: 16px;
    background: #fff;
}

.np-collab-property-image {
    width: 100%;
    height: 220px;
    overflow: hidden;
    border-radius: 11px;
    margin-bottom: 18px;
}

.np-collab-property-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.np-collab-property-label {
    font-size: 9px;
    letter-spacing: 2px;
    font-weight: 700;
    color: #153156;
}

.np-collab-property-card h2 {
    margin: 7px 0;
    font-size: 20px;
    color: #153156;
}

.np-collab-location {
    margin: 0;
    color: #777;
    font-size: 12px;
}


/* PROPERTY DETAILS */

.np-collab-property-details {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 20px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.np-collab-property-details div {
    padding: 14px 5px;
    text-align: center;
    border-right: 1px solid #eee;
}

.np-collab-property-details div:last-child {
    border-right: none;
}

.np-collab-property-details strong {
    display: block;
    font-size: 13px;
    color: #153156;
}

.np-collab-property-details span {
    display: block;
    margin-top: 4px;
    font-size: 9px;
    color: #888;
}


/* AMENITIES */

.np-collab-amenities {
    margin-top: 20px;
}

.np-collab-amenities h3 {
    margin: 0 0 10px;
    font-size: 13px;
    color: #153156;
}

.np-collab-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.np-collab-tags span {
    padding: 7px 10px;
    border-radius: 20px;
    background: #f1f4f8;
    color: #153156;
    font-size: 10px;
}


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

.np-collab-form-card {
    padding: 28px;
    border: 1px solid #e2e6eb;
    border-radius: 16px;
    background: #fff;
}

.np-collab-form-title {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 25px;
}

.np-collab-number {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    background: #153156;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

.np-collab-form-title h2 {
    margin: 0;
    font-size: 19px;
    color: #153156;
}

.np-collab-form-title p {
    margin: 4px 0 0;
    font-size: 11px;
    color: #888;
}


/* FORM */

.np-direct-collab-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.np-collab-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

.np-collab-input {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.np-collab-input label {
    font-size: 11px;
    font-weight: 600;
    color: #333;
}

.np-collab-input input,
.np-collab-input select,
.np-collab-input textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 12px;
    border: 1px solid #dfe3e8;
    border-radius: 8px;
    background: #fff;
    outline: none;
    font-size: 12px;
}

.np-collab-input textarea {
    min-height: 105px;
    resize: vertical;
}

.np-collab-input input:focus,
.np-collab-input select:focus,
.np-collab-input textarea:focus {
    border-color: #153156;
}


/* =========================================
   BUYER REQUIREMENT
========================================= */

.np-collab-requirement {
    padding: 16px;
    border-radius: 10px;
    background: #f5f7fa;
}

.np-collab-requirement-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.np-collab-requirement-head h3 {
    margin: 0;
    font-size: 13px;
    color: #153156;
}

.np-collab-requirement-head span {
    font-size: 9px;
    color: #888;
}

.np-collab-requirement-items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.np-collab-requirement-items div {
    padding: 10px 5px;
    background: #fff;
    border: 1px solid #e1e5e9;
    border-radius: 7px;
    text-align: center;
}

.np-collab-requirement-items strong {
    display: block;
    font-size: 11px;
    color: #153156;
}

.np-collab-requirement-items small {
    display: block;
    margin-top: 3px;
    font-size: 8px;
    color: #888;
}


/* CONSENT */

.np-collab-consent {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 10px;
    line-height: 1.5;
    color: #777;
}

.np-collab-consent input {
    margin-top: 2px;
    accent-color: #153156;
}


/* BUTTON */

.np-send-collaboration {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border: none;
    border-radius: 8px;
    background: #153156;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.np-send-collaboration:hover {
    opacity: .92;
}

.np-send-collaboration span {
    font-size: 18px;
}


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

@media (max-width: 850px) {

    .np-collab-page-layout {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 600px) {

    .np-collaboration-page {
        margin: 35px auto;
    }

    .np-collab-form-row {
        grid-template-columns: 1fr;
    }

    .np-collab-requirement-items {
        grid-template-columns: 1fr 1fr;
    }

    .np-collab-form-card {
        padding: 20px;
    }

}


/* =========================================
   CHAT PAGE
========================================= */

.np-chat-page {
    max-width: 1200px;
    margin: 50px auto;
    padding: 0 20px;
}


/* PAGE HEADER */

.np-chat-page-header {
    text-align: center;
    margin-bottom: 30px;
}

.np-chat-page-header > span {
    font-size: 10px;
    letter-spacing: 3px;
    font-weight: 700;
    color: #153156;
}

.np-chat-page-header h1 {
    margin: 8px 0;
    font-size: 32px;
    color: #153156;
}

.np-chat-page-header p {
    margin: 0;
    color: #777;
    font-size: 13px;
}


/* LAYOUT */

.np-chat-layout {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 20px;

    height: 650px;
}


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

.np-chat-sidebar {
    display: flex;
    flex-direction: column;
    gap: 14px;

    overflow-y: auto;
}


/* AGENT CARD */

.np-agent-card {
    padding: 20px;

    border: 1px solid #e2e6eb;
    border-radius: 14px;

    background: #fff;
}

.np-agent-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.np-agent-avatar {
    width: 45px;
    height: 45px;

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

    border-radius: 50%;

    background: #153156;
    color: #fff;

    font-weight: 700;
}

.np-agent-top h3 {
    margin: 0 0 4px;
    font-size: 15px;
    color: #153156;
}

.np-online {
    font-size: 10px;
    color: #777;
}

.np-online i,
.np-chat-agent span i {
    display: inline-block;

    width: 7px;
    height: 7px;

    margin-right: 4px;

    border-radius: 50%;

    background: #36a269;
}


/* AGENT INFO */

.np-agent-info {
    margin-top: 18px;

    padding-top: 15px;

    border-top: 1px solid #eee;
}

.np-agent-info div {
    margin-bottom: 10px;
}

.np-agent-info span {
    display: block;

    font-size: 9px;
    color: #888;
}

.np-agent-info strong {
    display: block;

    margin-top: 3px;

    font-size: 11px;
    color: #333;
}


/* PROPERTY */

.np-chat-property {
    display: flex;
    gap: 12px;

    padding: 12px;

    border: 1px solid #e2e6eb;
    border-radius: 14px;

    background: #fff;
}

.np-chat-property img {
    width: 75px;
    height: 65px;

    object-fit: cover;

    border-radius: 8px;
}

.np-chat-property span {
    font-size: 8px;
    letter-spacing: 1px;
    color: #888;
}

.np-chat-property h3 {
    margin: 5px 0;

    font-size: 12px;
    color: #153156;
}

.np-chat-property p {
    margin: 0;

    font-size: 10px;
    color: #777;
}


/* MATCH */

.np-chat-match {
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 14px;

    border-radius: 12px;

    background: #f3f6f9;
}

.np-chat-match-score {
    width: 48px;
    height: 48px;

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

    border-radius: 50%;

    background: #153156;
    color: #fff;

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

.np-chat-match span {
    display: block;

    font-size: 8px;
    letter-spacing: 1px;
    color: #777;
}

.np-chat-match strong {
    display: block;

    margin-top: 4px;

    font-size: 12px;
    color: #153156;
}


/* REQUIREMENT */

.np-chat-requirement {
    padding: 16px;

    border: 1px solid #e2e6eb;
    border-radius: 14px;

    background: #fff;
}

.np-chat-requirement h3 {
    margin: 0 0 10px;

    font-size: 12px;
    color: #153156;
}

.np-chat-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.np-chat-tags span {
    padding: 6px 9px;

    border-radius: 20px;

    background: #f1f4f8;

    font-size: 9px;
    color: #153156;
}


/* =========================================
   CHAT CONTAINER
========================================= */

.np-chat-container {
    display: flex;
    flex-direction: column;

    min-width: 0;

    border: 1px solid #e2e6eb;
    border-radius: 16px;

    background: #fff;

    overflow: hidden;
}


/* CHAT HEADER */

.np-chat-header {
    height: 70px;

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

    padding: 0 20px;

    border-bottom: 1px solid #eee;
}

.np-chat-agent {
    display: flex;
    align-items: center;
    gap: 11px;
}

.np-chat-agent h2 {
    margin: 0 0 3px;

    font-size: 15px;
    color: #153156;
}

.np-chat-agent span {
    font-size: 9px;
    color: #777;
}

.np-chat-more {
    border: none;
    background: none;

    font-size: 22px;
    color: #777;

    cursor: pointer;
}


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

.np-chat-body {
    flex: 1;

    padding: 25px;

    overflow-y: auto;

    background: #f7f8fa;
}

.np-chat-date {
    width: fit-content;

    margin: 0 auto 20px;

    padding: 5px 10px;

    border-radius: 20px;

    background: #e7ebef;

    font-size: 9px;
    color: #777;
}


/* MESSAGE */

.np-message {
    display: flex;
    flex-direction: column;

    max-width: 70%;

    margin-bottom: 18px;
}

.np-message.sent {
    margin-left: auto;
    align-items: flex-end;
}

.np-message.received {
    align-items: flex-start;
}


/* BUBBLE */

.np-message-bubble {
    padding: 11px 14px;

    border-radius: 12px;

    font-size: 12px;
    line-height: 1.5;
}

.np-message.received .np-message-bubble {
    background: #fff;

    border: 1px solid #e4e7ea;

    color: #333;

    border-bottom-left-radius: 3px;
}

.np-message.sent .np-message-bubble {
    background: #153156;

    color: #fff;

    border-bottom-right-radius: 3px;
}


/* TIME */

.np-message-time {
    margin-top: 5px;

    font-size: 8px;

    color: #999;
}


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

.np-chat-input-area {
    display: flex;
    align-items: center;
    gap: 10px;

    padding: 12px 15px;

    border-top: 1px solid #eee;

    background: #fff;
}

.np-chat-input-area input {
    flex: 1;

    height: 42px;

    padding: 0 14px;

    border: 1px solid #ddd;
    border-radius: 22px;

    outline: none;

    font-size: 12px;
}

.np-chat-input-area input:focus {
    border-color: #153156;
}


/* ATTACH */

.np-chat-attach {
    width: 38px;
    height: 38px;

    border: none;

    border-radius: 50%;

    background: #f1f3f5;

    color: #153156;

    font-size: 20px;

    cursor: pointer;
}


/* SEND */

.np-chat-send {
    width: 40px;
    height: 40px;

    border: none;

    border-radius: 50%;

    background: #153156;

    color: #fff;

    cursor: pointer;

    font-size: 15px;
}


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

@media (max-width: 850px) {

    .np-chat-layout {
        grid-template-columns: 1fr;
        height: auto;
    }

    .np-chat-sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .np-chat-container {
        height: 600px;
    }

}

@media (max-width: 550px) {

    .np-chat-sidebar {
        display: flex;
    }

    .np-chat-page-header h1 {
        font-size: 26px;
    }

}

.property-360-card {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 12px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 12px;
    text-decoration: none;
}

.property-360-image {
    position: relative;
    width: 95px;
    height: 70px;
    overflow: hidden;
    border-radius: 8px;
    flex-shrink: 0;
}

.property-360-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.property-360-label {
    position: absolute;
    bottom: 5px;
    left: 5px;
    background: #153156;
    color: #fff;
    padding: 3px 7px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
}

.property-360-info strong {
    display: block;
    color: #153156;
    font-size: 16px;
}

.property-360-info small {
    display: block;
    margin-top: 4px;
    color: #777;
}


/* 360 FULLSCREEN VIEWER */

.property-360-viewer {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    background: #000;
}

.property-360-viewer:target {
    display: block;
}

#property360Canvas {
    width: 100%;
    height: 100vh;
}

.property-360-close {
    position: absolute;
    top: 20px;
    right: 25px;
    z-index: 100000;

    width: 42px;
    height: 42px;

    background: #153156;
    color: #fff;

    border-radius: 50%;
    text-align: center;

    font-size: 30px;
    line-height: 40px;
    text-decoration: none;
}


.property-360-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 40px 0;
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid #e5e5e5;
    box-shadow: 0 10px 35px rgba(21, 49, 86, 0.10);
}

/* Header */
.property-360-header {
    width: 100%;
    min-height: 80px;
    padding: 18px 25px;
    background: #153156;

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

.property-360-tag {
    display: block;
    color: #bfcde0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 3px;
}

.property-360-header h3 {
    margin: 0;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
}

.property-360-hint {
    color: #fff;
    font-size: 13px;
    opacity: .8;
}

/* Pannellum */
#panorama {
    width: 100% !important;
    height: 100px !important;
    /*min-height: 500px;*/
    position: relative;
    display: block;
    background: #111;
}

/* Footer */
.property-360-footer {
    width: 100%;
    min-height: 50px;
    padding: 12px 20px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 35px;

    background: #fff;
    color: #777;
    font-size: 13px;
}

/* Mobile */
@media (max-width: 768px) {

    .property-360-header {
        padding: 15px;
    }

    .property-360-header h3 {
        font-size: 18px;
    }

    .property-360-hint {
        display: none;
    }

    #panorama {
        height: 100px !important;
        /*min-height: 400px;*/
    }

    .property-360-footer {
        gap: 15px;
        font-size: 11px;
    }
}


/* Property Enquiry Modal */

#propertyEnquiryModal .modal-dialog {
    max-width: 750px;
}

.property-enquiry-modal {
    border: 0;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.25);
}

.property-enquiry-modal .modal-header {
    padding: 25px 30px;
    background: #111;
    color: #fff;
    border: 0;
}

.property-enquiry-modal .modal-title {
    font-size: 24px;
    font-weight: 700;
}

.property-enquiry-modal .modal-header p {
    color: #bdbdbd;
    font-size: 14px;
    margin-top: 5px;
}

.property-enquiry-modal .btn-close {
    filter: invert(1);
    opacity: 1;
}

.property-enquiry-modal .modal-body {
    padding: 30px;
    background: #fff;
}

.property-enquiry-modal label {
    display: block;
    margin-bottom: 7px;
    font-size: 14px;
    font-weight: 600;
    color: #222;
}

.property-enquiry-modal .form-control {
    height: 48px;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 12px 15px;
    font-size: 14px;
    box-shadow: none;
}

.property-enquiry-modal textarea.form-control {
    height: auto;
    resize: vertical;
}

.property-enquiry-modal .form-control:focus {
    border-color: #111;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
}

.np-enquiry-submit {
    width: 100%;
    border: 0;
    border-radius: 8px;
    background: #111;
    color: #fff;
    padding: 14px 25px;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.np-enquiry-submit span {
    margin-left: 8px;
    font-size: 18px;
}

.np-enquiry-submit:hover {
    background: #333;
    transform: translateY(-1px);
}

@media (max-width: 576px) {

    #propertyEnquiryModal .modal-dialog {
        margin: 10px;
    }

    .property-enquiry-modal .modal-header {
        padding: 20px;
    }

    .property-enquiry-modal .modal-body {
        padding: 20px;
    }

    .property-enquiry-modal .modal-title {
        font-size: 20px;
    }
}

.np-check-match {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 15px 22px;
    border: none;
    border-radius: 9px;
    background: #153156;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}


  .nsp-sitevisit-section {
        background: #f7f7f9;
        padding: 45px 15px;
    }

    .nsp-sitevisit-container {
        max-width: 1050px;
        margin: 0 auto;
    }

    .nsp-sitevisit-card {
        background: #ffffff;
        border-radius: 7px;
        overflow: hidden;
        box-shadow: 0 3px 16px rgba(0, 0, 0, 0.08);
    }


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

    .nsp-sitevisit-heading-box {
        padding: 25px 30px 20px;
        border-bottom: 1px solid #eeeeee;
    }

    .nsp-sitevisit-heading {
        margin: 0 0 5px;
        font-size: 23px;
        font-weight: 600;
        color: #222222;
    }

    .nsp-sitevisit-heading-text {
        margin: 0;
        font-size: 13px;
        color: #777777;
    }


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

    .nsp-sitevisit-form-box {
        padding: 30px;
    }

    .nsp-sitevisit-field {
        margin-bottom: 0;
    }

    .nsp-sitevisit-label {
        display: block;
        margin-bottom: 7px;
        font-size: 13px;
        font-weight: 500;
        color: #333333;
    }

    .nsp-sitevisit-required {
        color: #dc3545;
        margin-left: 2px;
    }


    /* ==============================
       INPUT WRAPPER
    ============================== */

    .nsp-sitevisit-input-wrap {
        position: relative;
    }

    .nsp-sitevisit-input-icon {
        position: absolute;
        left: 13px;
        top: 50%;
        transform: translateY(-50%);
        color: #888888;
        font-size: 14px;
        pointer-events: none;
        z-index: 2;
    }


    /* ==============================
       INPUTS
    ============================== */

    .nsp-sitevisit-input {
        width: 100%;
        height: 42px;
        padding: 9px 12px 9px 38px;
        border: 1px solid #dddddd;
        border-radius: 5px;
        background: #ffffff;
        color: #444444;
        font-size: 13px;
        outline: none;
        transition: 0.2s ease;
    }

    .nsp-sitevisit-input::placeholder {
        color: #aaaaaa;
    }

    .nsp-sitevisit-input:focus {
        border-color: #999999;
        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.04);
    }


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

    .nsp-sitevisit-select {
        width: 100%;
        height: 42px;
        padding: 8px 35px 8px 38px;
        border: 1px solid #dddddd;
        border-radius: 5px;
        background-color: #ffffff;
        color: #444444;
        font-size: 13px;
        outline: none;
        cursor: pointer;
    }

    .nsp-sitevisit-select:focus {
        border-color: #999999;
        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.04);
    }


    /* ==============================
       TEXTAREA
    ============================== */

    .nsp-sitevisit-note-wrap {
        position: relative;
    }

    .nsp-sitevisit-note-icon {
        position: absolute;
        top: 14px;
        left: 13px;
        color: #888888;
        font-size: 14px;
        z-index: 2;
    }

    .nsp-sitevisit-textarea {
        width: 100%;
        height: 105px;
        padding: 11px 12px 11px 38px;
        border: 1px solid #dddddd;
        border-radius: 5px;
        resize: none;
        font-size: 13px;
        color: #444444;
        outline: none;
    }

    .nsp-sitevisit-textarea::placeholder {
        color: #aaaaaa;
    }

    .nsp-sitevisit-textarea:focus {
        border-color: #999999;
        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.04);
    }


    /* ==============================
       SUBMIT
    ============================== */

    .nsp-sitevisit-submit-area {
        padding-top: 3px;
    }

    .nsp-sitevisit-submit {
        height: 40px;
        min-width: 90px;
        padding: 8px 22px;
        border: 1px solid #111827;
        border-radius: 5px;
        background: #111827;
        color: #ffffff;
        font-size: 13px;
        font-weight: 500;
        transition: 0.2s ease;
    }

    .nsp-sitevisit-submit:hover {
        background: #2d3543;
        border-color: #2d3543;
        color: #ffffff;
    }

    .nsp-sitevisit-note-required {
        margin-top: 9px;
        font-size: 11px;
        color: #888888;
    }


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

    @media (max-width: 767px) {

        .nsp-sitevisit-section {
            padding: 25px 12px;
        }

        .nsp-sitevisit-heading-box {
            padding: 22px 20px 18px;
        }

        .nsp-sitevisit-form-box {
            padding: 22px 20px 25px;
        }

        .nsp-sitevisit-heading {
            font-size: 20px;
        }
    }

.error{
    color:red!important;
}



/* =========================================
   MY SHORTLISTED PROPERTIES
========================================= */

.nsp-shortlist-page {
    max-width: 1200px;
}


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

.nsp-shortlist-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top:30px;
    margin-bottom: 28px;
}

.nsp-shortlist-title {
    color: #222222;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.3;
}

.nsp-shortlist-subtitle {
    color: #777777;
    font-size: 13px;
}


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

.nsp-shortlist-card {
    height: 100%;
    background: #ffffff;
    border: 1px solid #e9e9e9;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.25s ease;
}

.nsp-shortlist-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.09);
    border-color: #dddddd;
}


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

.nsp-shortlist-image-box {
    position: relative;
    width: 100%;
    height: 230px;
    overflow: hidden;
    background: #f1f1f1;
}

.nsp-shortlist-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.nsp-shortlist-card:hover .nsp-shortlist-image {
    transform: scale(1.04);
}


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

.nsp-shortlist-badge {
    position: absolute;
    top: 14px;
    left: 14px;

    display: inline-flex;
    align-items: center;
    gap: 6px;

    padding: 6px 10px;

    background: rgba(255, 255, 255, 0.95);
    border-radius: 4px;

    color: #dc3545;
    font-size: 11px;
    font-weight: 500;

    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.nsp-shortlist-badge i {
    font-size: 12px;
}


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

.nsp-shortlist-content {
    padding: 18px 18px 17px;
}

.nsp-shortlist-property-title {
    margin: 0 0 12px;

    color: #252525;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/* =========================================
   PROPERTY META
========================================= */

.nsp-shortlist-property-meta {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;

    color: #777777;
    font-size: 12px;
}

.nsp-shortlist-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.nsp-shortlist-meta-item i {
    color: #888888;
    font-size: 13px;
}

.nsp-shortlist-meta-divider {
    width: 1px;
    height: 13px;
    background: #dddddd;
}


/* =========================================
   ACTION
========================================= */

.nsp-shortlist-action {
    border-top: 1px solid #eeeeee;
    padding-top: 14px;
}

.nsp-shortlist-view-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;

    padding: 9px 12px;

    border: 1px solid #222222;
    border-radius: 4px;

    color: #222222;
    background: #ffffff;

    font-size: 12px;
    font-weight: 500;
    text-decoration: none;

    transition: all 0.2s ease;
}

.nsp-shortlist-view-btn i {
    font-size: 13px;
    transition: transform 0.2s ease;
}

.nsp-shortlist-view-btn:hover {
    background: #222222;
    color: #ffffff;
}

.nsp-shortlist-view-btn:hover i {
    transform: translateX(3px);
}


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

.nsp-shortlist-empty {
    padding: 65px 20px;
    text-align: center;

    background: #ffffff;
    border: 1px solid #e9e9e9;
    border-radius: 8px;
}

.nsp-shortlist-empty-icon {
    width: 65px;
    height: 65px;

    margin: 0 auto 18px;

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

    border-radius: 50%;
    background: #f8f8f8;

    color: #999999;
    font-size: 27px;
}

.nsp-shortlist-empty-title {
    margin-bottom: 7px;

    color: #333333;
    font-size: 18px;
    font-weight: 600;
}

.nsp-shortlist-empty-text {
    margin: 0;

    color: #888888;
    font-size: 13px;
}


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

@media (max-width: 767px) {

    .nsp-shortlist-page {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }

    .nsp-shortlist-title {
        font-size: 21px;
    }

    .nsp-shortlist-heading {
        margin-bottom: 20px;
    }

    .nsp-shortlist-image-box {
        height: 210px;
    }

    .nsp-shortlist-content {
        padding: 16px;
    }
}


@media (max-width: 575px) {

    .nsp-shortlist-image-box {
        height: 220px;
    }

    .nsp-shortlist-property-title {
        font-size: 16px;
    }
}


/* =========================================
   PROPERTY SHARE BUTTON
========================================= */

/*.np-property-share {*/
/*    display: inline-flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    gap: 5px;*/

/*    margin-top: 8px;*/
/*    padding: 7px 14px;*/
/*    margin-left: 35%;*/
/*    border: 1px solid var(--gold);*/
/*    border-radius: 4px;*/

/*    background: #fff;*/
/*    color: var(--gold);*/

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

/*    text-decoration: none;*/
/*    transition: .3s ease;*/
/*}*/

/*.np-property-share i {*/
/*    font-size: 12px;*/
/*}*/

/*.np-property-share:hover {*/
/*    background: var(--gold);*/
/*    color: #fff;*/
/*    border-color: var(--gold);*/
/*}*/


.np-property-share {
    position: absolute;
    top: 45px;
    right: 9px;

    width: 32px;
    height: 32px;

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

    margin: 0;
    padding: 0;

    background: rgba(255, 255, 255, 0.95);
    color: var(--gold);

    border: 0;
    border-radius: 50%;

    font-size: 15px;
    z-index: 3;

    box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
    transition: .3s ease;
}

.np-property-share span {
    display: none;
}

.np-property-share:hover {
    background: var(--gold);
    color: #fff;
    transform: scale(1.08);
}

.np-property-share i {
    font-size: 14px;
}

        .requirement-section {
            padding: 70px 15px;
        }

        .requirement-wrapper {
            max-width: 1050px;
            margin: auto;
            background: #fff;
            border-radius: 22px;
            overflow: hidden;
            box-shadow: 0 15px 50px rgba(0, 0, 0, 0.08);
        }

        /* Left Content */
        .requirement-info {
            background: linear-gradient(145deg, #182848, #263b68);
            color: #fff;
            padding: 55px 40px;
            height: 100%;
            position: relative;
            overflow: hidden;
        }

        .requirement-info::before {
            content: "";
            position: absolute;
            width: 220px;
            height: 220px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.05);
            top: -70px;
            right: -70px;
        }

        .requirement-info::after {
            content: "";
            position: absolute;
            width: 170px;
            height: 170px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.04);
            bottom: -60px;
            left: -60px;
        }

        .info-icon {
            width: 62px;
            height: 62px;
            border-radius: 16px;
            background: rgba(255,255,255,0.12);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 28px;
            margin-bottom: 25px;
        }

        .requirement-info h2 {
            font-size: 32px;
            font-weight: 700;
            margin-bottom: 15px;
        }

        .requirement-info p {
            color: rgba(255,255,255,0.78);
            line-height: 1.7;
            font-size: 15px;
        }

        .benefit-list {
            margin-top: 35px;
            padding: 0;
            list-style: none;
        }

        .benefit-list li {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 18px;
            font-size: 14px;
            color: rgba(255,255,255,0.9);
        }

        .benefit-list i {
            width: 25px;
            height: 25px;
            border-radius: 50%;
            background: rgba(255,255,255,0.12);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 13px;
        }

        /* Form */
        .requirement-form {
            padding: 50px 45px;
        }

        .form-heading {
            margin-bottom: 30px;
        }

        .form-heading h3 {
            font-size: 25px;
            font-weight: 700;
            color: #1d2939;
            margin-bottom: 8px;
        }

        .form-heading p {
            color: #667085;
            font-size: 14px;
            margin-bottom: 0;
        }

        .form-label {
            font-size: 14px;
            font-weight: 600;
            color: #344054;
            margin-bottom: 8px;
        }

        .form-control,
        .form-select {
            height: 45px;
            border: 1px solid #d0d5dd;
            border-radius: 10px;
            padding: 0 15px;
            font-size: 14px;
            box-shadow: none;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: #263b68;
            box-shadow: 0 0 0 3px rgba(38, 59, 104, 0.10);
        }

        .input-group-custom {
            position: relative;
        }

        .input-icon {
            position: absolute;
            left: 15px;
            top: 50%;
            transform: translateY(-50%);
            color: #98a2b3;
            z-index: 5;
        }

        .input-with-icon {
            padding-left: 43px;
        }

        .submit-btn {
            width: 100%;
            height: 54px;
            border: none;
            border-radius: 10px;
            background: #263b68;
            color: #fff;
            font-size: 15px;
            font-weight: 600;
            transition: all 0.3s ease;
        }

        .submit-btn:hover {
            background: #182848;
            transform: translateY(-1px);
            box-shadow: 0 8px 20px rgba(38, 59, 104, 0.20);
        }

        .form-note {
            text-align: center;
            font-size: 12px;
            color: #98a2b3;
            margin-top: 15px;
        }

        @media (max-width: 767px) {

            .requirement-section {
                padding: 35px 12px;
            }

            .requirement-info {
                padding: 35px 25px;
            }

            .requirement-info h2 {
                font-size: 26px;
            }

            .requirement-form {
                padding: 35px 22px;
            }
        }
        
        
.np-requirement-hero {
    min-height: 370px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        /*linear-gradient(90deg,*/
        /*    rgba(20, 22, 23, .93) 0%,*/
        /*    rgba(20, 22, 23, .80) 45%,*/
        /*    rgba(20, 22, 23, .25) 100%),*/
        linear-gradient(90deg, rgb(255 255 255 / 92%) 0%, rgb(135 135 135 / 62%) 45%, rgba(20, 22, 23, .25) 100%),
        url("../img/hero-banner.png");

    background-size: cover;
    background-position: center;
}


/* =========================================================
   REQUIREMENT MATCH RESULTS
   ========================================================= */

.req-match-section {
    padding: 35px 0 70px;
    background: #f7f8fa;
}

.req-match-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.req-match-header h3 {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    color: #171b1e;
}

.req-match-header h3::after {
    content: "";
    display: block;
    width: 38px;
    height: 2px;
    background: #153156;
    margin-top: 9px;
}


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

.req-property-card {
    position: relative;
    background: #fff !important;
    border: 1px solid #e9edf2 !important;
    border-radius: 10px !important;
    padding: 24px !important;
    margin-bottom: 18px !important;
    box-shadow: 0 5px 22px rgba(20, 35, 55, 0.06);
    transition: all 0.35s ease;
    overflow: hidden;
}

.req-property-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #153156;
    transition: all 0.35s ease;
}

.req-property-card:hover {
    transform: translateY(-4px);
    border-color: #d8e0ea !important;
    box-shadow: 0 14px 35px rgba(20, 35, 55, 0.11);
}

.req-property-card:hover::before {
    width: 6px;
}


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

.req-match-badge {
    float: right;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 12px !important;
    background: #edf8f1 !important;
    color: #198754 !important;
    border-radius: 20px;
    font-size: 12px !important;
    font-weight: 700;
    border: 1px solid #d6efdf;
}

.req-match-badge::before {
    content: "✓";
    width: 17px;
    height: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #198754;
    color: #fff;
    border-radius: 50%;
    font-size: 10px;
}


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

.req-property-card h4 {
    margin: 0 140px 18px 0;
    color: #171b1e;
    font-size: 19px;
    line-height: 1.4;
    font-weight: 700;
}


/* =========================
   PROPERTY INFORMATION
   ========================= */

.req-property-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin-bottom: 20px;
}

.req-property-info p {
    position: relative;
    margin: 0 !important;
    padding: 8px 18px;
    color: #667085;
    font-size: 12px;
    line-height: 1.5;
}

.req-property-info p:first-child {
    padding-left: 0;
}

.req-property-info p:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 1px;
    height: 20px;
    background: #e3e6ea;
    transform: translateY(-50%);
}

.req-property-info strong {
    display: block;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 500;
    margin-bottom: 3px;
}

.req-property-info p:first-child strong {
    color: #153156;
}

.req-property-info p:first-child {
    color: #153156;
    font-weight: 700;
}


/* =========================
   BUTTON AREA
   ========================= */

.req-property-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    padding-top: 16px;
    border-top: 1px solid #eef0f3;
}


/* View Property */

.req-view-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    background: #153156;
    color: #fff !important;

    border: 1px solid #153156;
    border-radius: 5px;

    padding: 10px 17px;

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

    transition: all 0.3s ease;
}

.req-view-btn:hover {
    background: #0d1f36;
    border-color: #0d1f36;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 7px 18px rgba(21, 49, 86, 0.18);
}


/* WhatsApp */

.req-whatsapp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 10px 16px;

    border: 1px solid #d7e8dd;
    border-radius: 5px;

    background: #f4fbf6;
    color: #198754 !important;

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

    transition: all 0.3s ease;
}

.req-whatsapp-btn:hover {
    background: #198754;
    border-color: #198754;
    color: #fff !important;
    transform: translateY(-2px);
}

.req-whatsapp-btn i {
    font-size: 14px;
}


/* Call */

.req-call-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 10px 16px;

    border: 1px solid #dce3eb;
    border-radius: 5px;

    background: #fff;
    color: #153156 !important;

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

    transition: all 0.3s ease;
}

.req-call-btn:hover {
    background: #153156;
    border-color: #153156;
    color: #fff !important;
    transform: translateY(-2px);
}

.req-call-btn i {
    font-size: 12px;
}


/* =========================
   NO RESULT
   ========================= */

.req-no-result {
    border: 1px solid #eee2bc !important;
    background: #fffaf0 !important;
    color: #806c36 !important;
    border-radius: 8px;
    padding: 20px 22px;
    font-size: 13px;
}


/* =========================
   ERROR
   ========================= */

.req-error-result {
    border-radius: 8px;
    padding: 18px 20px;
    font-size: 13px;
}


/* =========================
   RESULT COUNT
   ========================= */

.req-result-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 27px;
    height: 27px;

    padding: 0 8px;

    margin-left: 5px;

    background: #153156;
    color: #fff;

    border-radius: 20px;

    font-size: 11px;
    font-weight: 600;
}


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

@media (max-width: 767px) {

    .req-match-section {
        padding: 25px 0 45px;
    }

    .req-match-header {
        margin-bottom: 17px;
    }

    .req-match-header h3 {
        font-size: 19px;
    }

    .req-property-card {
        padding: 18px !important;
    }

    .req-property-card h4 {
        margin-right: 0;
        padding-right: 0;
        font-size: 16px;
        margin-bottom: 16px;
    }

    .req-match-badge {
        float: none;
        margin-bottom: 12px;
    }

    .req-property-info {
        display: block;
    }

    .req-property-info p,
    .req-property-info p:first-child {
        padding: 7px 0;
        border-bottom: 1px solid #f0f1f3;
    }

    .req-property-info p:not(:last-child)::after {
        display: none;
    }

    .req-property-info p:last-child {
        border-bottom: 0;
    }

    .req-property-info strong {
        display: inline-block;
        min-width: 105px;
        margin-right: 5px;
    }

    .req-property-actions {
        flex-wrap: wrap;
    }

    .req-view-btn,
    .req-whatsapp-btn,
    .req-call-btn {
        flex: 1;
        min-width: 105px;
    }
}

.navbar-brand img {
    position: absolute;
    top: 0;
    left: 80px;
    width: 160px;
    height: 145px;
    padding: 10px;
    object-fit: contain;
    background: #fff;
    box-shadow: 0 0 20px rgba(167, 167, 167, 0.7);
    border-radius: 0 0 20px 20px;
    z-index: 1000;
}

@media (max-width: 767px) {
    .navbar-brand img {
        top: 0;
        left: 0;
        width: 130px;
        height: 90px;
        padding: 8px;
        background: #fff;
        border-radius: 0 0 18px 18px;
        box-shadow: 0 0 15px rgba(167, 167, 167, 0.6);
    }
}

@media (max-width: 767px) {
.navbar-collapse {
    margin-top: 52px;
    flex-basis: 100%;
    flex-grow: 1;
    align-items: center;
}
}




.no-property-state {
    padding: 60px 20px !important;
}

.no-property-icon {
    width: 65px;
    height: 65px;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e5e5e5;
    border-radius: 50%;
    color: var(--gold);
    background: #fafafa;
    font-size: 28px;
}

.no-property-text {
    display: inline-block;
    margin: 0;
    padding: 10px 18px;
    color: #555;
    font-size: 13px;
    font-weight: 500;
    background: #f8f8f8;
    border-radius: 30px;
}



.locality-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 35px;
}

.locality-heading h2 {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
}

.locality-search {
    position: relative;
    width: 240px;
    margin: 0;
}

.locality-search input {
    width: 100%;
    height: 42px;
    padding: 0 40px 0 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    outline: none;
    font-size: 12px;
    background: #fff;
}

.locality-search i {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gold);
    font-size: 16px;
}


.property-heading {
    max-width: 1268px;
    margin: 45px auto 20px;
    padding: 0 12px;

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

.property-heading h1 {
    margin: 0;
    font-size: 30px;
    font-weight: 600;
}

.property-search {
    position: relative;
    width: 280px;
}

.property-search input {
    width: 100%;
    height: 42px;
    padding: 0 40px 0 16px;
    border: 1px solid #ddd;
    border-radius: 25px;
    outline: none;
    font-size: 12px;
    background: #fff;
    transition: .3s ease;
}

.property-search input:focus {
    border-color: var(--gold);
    box-shadow: 0 4px 15px rgba(0,0,0,.08);
}

.property-search i {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gold);
    font-size: 16px;
}


/* Schedule + Enquire */
/*.np-simple-buttons {*/
/*    display: flex !important;*/
/*    align-items: center !important;*/
/*    gap: 10px !important;*/
/*}*/

/*.np-property-footer-main {*/
/*    position: relative !important;*/
/*    top: -35px !important;*/
/*    left: 171px !important;*/
/*    margin: 0 !important;*/
/*}*/

/*.np-property-footer {*/
/*    position: relative !important;*/
/*}*/

/* Make WhatsApp + Call smaller */
/*.np-property-footer-actions {*/
/*    display: flex !important;*/
/*    gap: 10px !important;*/
/*    justify-content: flex-start !important;*/
/*    margin-top: 10px !important;*/
/*}*/

/*.np-property-whatsapp,*/
/*.np-property-call {*/
/*    width: 180px !important;*/
/*    flex: none !important;*/
/*    height: 40px !important;*/
/*    padding: 0 15px !important;*/
/*}*/



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

    /* Schedule button */
/*    .np-simple-buttons {*/
/*        display: flex !important;*/
/*        width: 100% !important;*/
/*        gap: 8px !important;*/
/*        margin-top: 15px !important;*/
/*    }*/

/*    .np-simple-btn {*/
/*        width: 100% !important;*/
/*        height: 40px !important;*/
/*    }*/

    /* Enquire - place beside Schedule */
/*    .np-property-footer-main {*/
/*        position: static !important;*/
/*        top: auto !important;*/
/*        left: auto !important;*/
/*        margin: 0 !important;*/
/*    }*/

/*    .np-property-enquire {*/
/*        margin-top: 10px;*/
/*        height: 35px !important;*/
/*        white-space: nowrap !important;*/
/*    }*/

    /* WhatsApp + Call */
/*    .np-property-footer-actions {*/
/*        display: flex !important;*/
/*        width: 100% !important;*/
/*        gap: 8px !important;*/
/*        margin-top: 10px !important;*/
/*    }*/

/*    .np-property-whatsapp,*/
/*    .np-property-call {*/
/*        width: auto !important;*/
/*        flex: 1 !important;*/
/*        height: 40px !important;*/
/*        padding: 0 8px !important;*/
/*    }*/
/*}*/


/* =========================================
   NEW PROPERTY ACTION BUTTONS
========================================= */

/* Schedule Site Visit */
.visit-action {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    height: 40px !important;
    padding: 0 15px !important;
    white-space: nowrap;
}

/* Enquire */
.enquire-action {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    height: 40px !important;
    padding: 0 15px !important;
    white-space: nowrap;
}

/* WhatsApp + Call wrapper */
.contact-actions {
    display: flex !important;
    align-items: center;
    gap: 10px !important;
    margin-top: 10px !important;
}

/* WhatsApp */
.whatsapp-action {
    width: 180px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 15px !important;
    background: #20d463 !important;
    color: #fff !important;
    border-radius: 5px;
    white-space: nowrap;
}

/* Call Now */
.call-action {
    width: 180px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 15px !important;
    background: #111 !important;
    color: #fff !important;
    border-radius: 5px;
    white-space: nowrap;
}


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

@media (max-width: 767px) {

    .visit-action {
        height: 40px !important;
        width: 100% !important;
    }

    .enquire-action {
        height: 40px !important;
    }

    .contact-actions {
        width: 100% !important;
        gap: 8px !important;
    }

    .whatsapp-action,
    .call-action {
        width: auto !important;
        flex: 1 !important;
        height: 40px !important;
        padding: 0 8px !important;
    }
}

/* Schedule Site Visit */
.visit-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px;

    height: 40px !important;
    padding: 0 18px !important;

    background: #17375f !important;
    color: #fff !important;

    border: 1px solid #17375f !important;
    border-radius: 5px !important;

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

    text-decoration: none !important;
    transition: all 0.3s ease;
}

.visit-action:hover {
    background: #0f2948 !important;
    border-color: #0f2948 !important;
    color: #fff !important;
    transform: translateY(-2px);
}


/* Enquire */
.enquire-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 40px !important;
    padding: 0 18px !important;

    background: #fff !important;
    color: #17375f !important;

    border: 1px solid #17375f !important;
    border-radius: 5px !important;

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

    text-decoration: none !important;
    transition: all 0.3s ease;
}

.enquire-action:hover {
    background: #17375f !important;
    color: #fff !important;
    transform: translateY(-2px);
}


/* =========================================
   RESTORE MEDIA GRID
========================================= */

.np-property-media-options {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 12px !important;
    margin-top: 15px !important;
}


/* =========================================
   VIDEO / BROCHURE BUTTON DESIGN
========================================= */

.np-media-option {
    min-height: 68px !important;

    display: flex !important;
    align-items: center !important;

    gap: 12px !important;
    padding: 12px 15px !important;

    background: #153156 !important;
    border: 1px solid #153156 !important;
    border-radius: 8px !important;

    text-decoration: none !important;
    color: #fff !important;

    cursor: pointer !important;

    transition: all 0.25s ease !important;
}


/* Icon */

.np-media-option .np-media-icon {
    width: 40px !important;
    height: 40px !important;

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

    flex-shrink: 0 !important;

    border-radius: 6px !important;

    background: #fff !important;
    color: #153156 !important;

    font-size: 17px !important;
}


/* Text */

.np-media-option span:last-child {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
}

.np-media-option strong {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.np-media-option small {
    margin-top: 3px !important;
    color: rgba(255,255,255,0.75) !important;
    font-size: 11px !important;
}


/* Hover */

.np-media-option:hover {
    background: #0d2748 !important;
    border-color: #0d2748 !important;

    transform: translateY(-2px) !important;

    box-shadow: 0 5px 15px rgba(0,0,0,0.15) !important;
}


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

@media (max-width: 767px) {

    .np-property-media-options {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .np-media-option {
        width: 100% !important;
    }
}

.search-field .select2-container {
    width: 100% !important;
}

.search-field .select2-container .select2-selection--single {
    height: 45px;
    border: 1px solid #ddd;
    border-radius: 8px;
    display: flex;
    align-items: center;
}

.search-field .select2-container--default
.select2-selection--single
.select2-selection__rendered {
    line-height: 43px;
    padding-left: 14px;
    font-size: 14px;
}

.search-field .select2-container--default
.select2-selection--single
.select2-selection__arrow {
    height: 43px;
}

/* =========================================
   FINAL PROPERTY MATCH LAYOUT FIX
========================================= */

.np-property-match .np-match-form {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    gap: 0 !important;
}


/* FORM CARD - SMALLER & CENTERED */
.np-property-match .np-match-card {
    /*width: 100% !important;*/
    max-width: 650px !important;
    margin: 0 auto !important;
}


/* FIELDS */
.np-property-match .np-match-fields {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
}


/* BUTTON AREA */
.np-property-match .np-match-action {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;

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

    margin: 18px 0 0 !important;
    padding: 0 !important;
}


/* BUTTON */
.np-property-match .np-check-match {
    margin: 0 !important;
    padding: 14px 22px !important;

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

    width: auto !important;
    min-width: 175px !important;

    background: #153156 !important;
    color: #fff !important;

    border: none !important;
    border-radius: 8px !important;

    font-size: 13px !important;
    font-weight: 600 !important;
}


/* MOBILE */
@media (max-width: 600px) {

    .np-property-match .np-match-card {
        max-width: 100% !important;
    }

    .np-property-match .np-match-fields {
        grid-template-columns: 1fr !important;
    }

    .np-property-match .np-match-action {
        margin-top: 18px !important;
    }

    .np-property-match .np-check-match {
        width: 100% !important;
        max-width: 300px !important;
    }
}

/* Maximum Budget - Custom Width */

/* .np-budget-group {
    display: flex !important;
    width: 100%;
}

.np-budget-group input {
    flex: 1 !important;
    min-width: 0 !important;
}

.np-budget-group select {
    width: 140px !important;
    min-width: 140px !important;
    flex: 0 0 140px !important;
    padding: 0 10px !important;
} */

.np-property-match .np-budget-group select[name="price_unit"] {
    width: 95px !important;
    min-width: 95px !important;
   
    flex: 0 0 100px !important;
}

/* =========================================
   LOCALITY FIELD FIX
========================================= */

.locality-field .locality-input-group {
    position: relative;
    width: 100%;
}


/* LOCALITY SELECT */

.locality-field .locality-select {
    width: 100% !important;
    height: 54px !important;

    padding-left: 44px !important;
    padding-right: 40px !important;

    border: 1px solid #d0d5dd !important;
    border-radius: 10px !important;

    background: #fff !important;

    color: #344054 !important;
    font-size: 14px !important;

    outline: none !important;
}


/* LOCATION ICON */

.locality-field .locality-icon {
    position: absolute;

    left: 16px;
    top: 50%;

    transform: translateY(-50%);

    z-index: 10;

    color: #98a2b3;

    font-size: 17px;

    pointer-events: none;
}


/* FOCUS */

.locality-field .locality-select:focus {
    border-color: #263b68 !important;

    box-shadow: 0 0 0 3px rgba(38, 59, 104, 0.10) !important;
}


/* =========================================
   SELECT2 VERSION
========================================= */

.locality-field .select2-container {
    width: 100% !important;
}


.locality-field .select2-container .select2-selection--single {
    height: 45px !important;

    display: flex !important;
    align-items: center !important;

    padding-left: 40px !important;
    padding-right: 35px !important;

    border: 1px solid #d0d5dd !important;
    border-radius: 10px !important;

    background: #fff !important;
}


.locality-field
.select2-container
.select2-selection--single
.select2-selection__rendered {

    padding-left: 0 !important;
    padding-right: 0 !important;

    line-height: normal !important;

    color: #344054 !important;
    font-size: 14px !important;
}


.locality-field
.select2-container
.select2-selection--single
.select2-selection__arrow {

    height: 54px !important;

    right: 10px !important;
    top: 0 !important;

    display: flex !important;
    align-items: center !important;
}


/* SELECT2 FOCUS */

.locality-field
.select2-container--focus
.select2-selection--single {

    border-color: #263b68 !important;

    box-shadow: 0 0 0 3px rgba(38, 59, 104, 0.10) !important;
}

/* =========================================
   PROPERTY CARD - SHARE & WISHLIST ORDER
   SHARE TOP / WISHLIST BELOW
========================================= */

/* SHARE BUTTON - TOP */
.np-property-image .np-property-share {
    position: absolute !important;
    top: 8px !important;
    right: 9px !important;
    z-index: 10 !important;
}

/* WISHLIST BUTTON - BELOW SHARE */
.np-property-image .np-property-wishlist {
    position: absolute !important;
    top: 49px !important;
    right: 9px !important;
    z-index: 10 !important;
}

/* Keep both buttons same size */
.np-property-image .np-property-share,
.np-property-image .np-property-wishlist {
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15) !important;
}

/* SHARE BUTTON - TOP */
.property-image .np-property-share {
    position: absolute !important;
    top: 8px !important;
    right: 9px !important;
    z-index: 10 !important;
}

/* WISHLIST BUTTON - BELOW SHARE */
.property-image .np-property-wishlist {
    position: absolute !important;
    top: 49px !important;
    right: 9px !important;
    z-index: 10 !important;
}

/* Keep both buttons same size */
.property-image .np-property-share,
.property-image .np-property-wishlist {
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15) !important;
}

/* =========================================
   FINAL PROPERTY MEDIA TABS FIX
========================================= */

/* OUTER CONTAINER MUST NOT BE A GRID */
.np-property-media-options {
    display: block !important;
    width: 100% !important;
    margin-top: 15px !important;
}


/* =========================================
   TABS - 3 IN ONE ROW
========================================= */

.np-property-media-options .np-media-tabs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;

    width: 100% !important;

    margin: 0 0 20px !important;
    padding: 5px !important;

    gap: 5px !important;

    background: #f7f8fa !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;

    list-style: none !important;
}

.np-property-media-options .np-media-tabs .nav-item {
    flex: 1 1 0 !important;
    width: 33.333% !important;
    margin: 0 !important;
}

.np-property-media-options .np-media-tab {
    width: 100% !important;
    min-height: 45px !important;

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

    padding: 10px !important;

    border: none !important;
    border-radius: 7px !important;

    background: transparent !important;
    color: #333 !important;

    font-size: 11px !important;
    font-weight: 600 !important;

    white-space: nowrap !important;
}

.np-property-media-options .np-media-tab.active {
    background: #153156 !important;
    color: #fff !important;
}


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

.np-property-media-options .np-media-tab-content {
    display: block !important;
    width: 100% !important;
}


/* =========================================
   VIDEO - 2 BUTTONS IN ONE ROW
========================================= */

.np-property-media-options #np-video-pane.show.active {
    display: grid !important;

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

    gap: 10px !important;

    width: 100% !important;
}


/* VIDEO BUTTON */
.np-property-media-options #np-video-pane .np-media-option {
    width: 100% !important;
    min-width: 0 !important;

    min-height: 68px !important;

    display: flex !important;
    align-items: center !important;

    margin: 0 !important;
    padding: 12px 15px !important;

    background: #153156 !important;
    border: 1px solid #153156 !important;
    border-radius: 8px !important;

    color: #fff !important;

    text-decoration: none !important;
}


/* VIDEO ICON */
.np-property-media-options #np-video-pane .np-media-icon {
    width: 40px !important;
    height: 40px !important;

    flex: 0 0 40px !important;

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

    margin-right: 12px !important;

    background: #fff !important;
    color: #153156 !important;

    border-radius: 6px !important;
}


/* VIDEO TEXT */
.np-property-media-options #np-video-pane .np-media-option strong {
    display: block !important;
    color: #fff !important;
    font-size: 13px !important;
}

.np-property-media-options #np-video-pane .np-media-option small {
    display: block !important;
    margin-top: 3px !important;
    color: rgba(255,255,255,.75) !important;
    font-size: 10px !important;
}


/* =========================================
   BROCHURE
========================================= */

.np-property-media-options #np-brochure-pane.show.active {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.np-property-media-options #np-floor-pane.show.active{
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;    
}


/* =========================================
   360 PANORAMA
========================================= */

.np-property-media-options #np-tour-pane.show.active {
    display: block !important;
    width: 100% !important;
}




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

@media (max-width: 575px) {

    .np-property-media-options #np-video-pane.show.active {
        grid-template-columns: 1fr !important;
    }
    
    .np-property-media-options #np-brochure-pane.show.active {
        grid-template-columns: 1fr !important;
    }
    
    .np-property-media-options #np-floor-pane.show.active {
        grid-template-columns: 1fr !important;
    }

    .np-property-media-options .np-media-tab {
        font-size: 10px !important;
        padding: 9px 5px !important;
    }
}

#panorama {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    min-height: 250px !important;
}

/* 360 PANORAMA CONTAINER */

.np-property-media-options #panorama {
    width: 100% !important;
    height: 400px !important;
    display: block !important;
    position: relative !important;
    background: #111 !important;
}

.np-panorama-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    width: 100%;
}

.np-panorama-item {
    width: 100%;
    height: 250px;
    background: #111;
    border-radius: 8px;
    overflow: hidden;
}

@media (max-width: 767px) {
    .np-panorama-grid {
        grid-template-columns: 1fr 1fr;
    }
}

/* =========================================
   360 GALLERY
========================================= */

.np-property-media-options .np-360-gallery {
    width: 100% !important;
    height: 300px !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
    background: #111 !important;
    overflow: hidden !important;
}

/* Pannellum itself */
.np-property-media-options .np-360-gallery .pnlm-container {
    width: 100% !important;
    height: 100% !important;
}

/* Remove old panorama height */
#panorama.np-360-gallery {
    height: 300px !important;
    min-height: 300px !important;
}

/* Mobile */
@media (max-width: 768px) {
    #panorama.np-360-gallery {
        height: 250px !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* =========================================
   360 VIEWER - SMALL BOX
========================================= */

#panorama {
    width: 25% !important;
    max-width: 25% !important;
    height: 100px !important;
    min-height: 100px !important;

    position: relative !important;
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #111 !important;
    overflow: hidden !important;
}

/* Pannellum inner viewer */
#panorama .pnlm-container,
#panorama .pnlm-render-container {
    width: 100% !important;
    height: 100% !important;
}

/* Load Panorama button */
#panorama .pnlm-load-button {
    transform: scale(.7);
}

/* ================================
   POPULAR LOCALITIES
================================ */

.footer-localities {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 20px;
    row-gap: 7px;
}

.footer-localities li {
    margin-bottom: 0 !important;
}

.footer-localities a {
    font-size: 11px !important;
    line-height: 1.4;
}


/* TABLET */
@media (max-width: 991px) {
    .footer-localities {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* MOBILE */
@media (max-width: 575px) {
    .footer-localities {
        grid-template-columns: 1fr;
    }
}