/* ============================================================
   BLR PROPERTIES
   CUSTOM SINGLE PROPERTY PAGE
============================================================ */

.blr-property-page {
    --blr-blue: #0649c9;
    --blr-blue-dark: #043b9f;
    --blr-blue-light: #edf4ff;

    --blr-dark: #08152f;
    --blr-green: #19a66a;
    --blr-green-dark: #118556;

    --blr-border: #dce3ee;
    --blr-light: #f6f9ff;
    --blr-muted: #667085;

    background: #ffffff;
    color: var(--blr-dark);

    padding: 28px 0 50px;
}


.blr-property-page * {
    box-sizing: border-box;
}


.blr-property-page svg {
    display: block;
}


.blr-property-container {

    width: min(
        1440px,
        calc(100% - 48px)
    );

    margin: 0 auto;
}


/* ============================================================
   BREADCRUMB
============================================================ */

.blr-breadcrumb {

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

    gap: 9px;

    margin-bottom: 22px;

    font-size: 14px;

    color: #667085;
}


.blr-breadcrumb a {

    color: #344054;

    text-decoration: none;

    transition: .2s ease;
}


.blr-breadcrumb a:hover {

    color: var(--blr-blue);
}


.blr-breadcrumb strong {

    color: #475467;

    font-weight: 500;
}


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

.blr-property-hero {

    display: grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(380px, .9fr);

    gap: 34px;

    align-items: start;
}


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

.blr-hero-gallery {

    min-width: 0;
}


.blr-main-image {

    position: relative;

    overflow: hidden;

    border-radius: 12px;

    background: #eef2f7;

    aspect-ratio: 1.55 / 1;

    box-shadow:
        0 4px 18px
        rgba(15, 23, 42, .06);
}


.blr-main-image img {

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


.blr-no-image {

    display: flex;

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

    color: #667085;

    min-height: 420px;
}


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

.blr-premium-badge {

    position: absolute;

    left: 18px;
    top: 18px;

    z-index: 2;

    background:
        rgba(6, 73, 201, .94);

    color: #fff;

    padding: 9px 14px;

    border-radius: 7px;

    font-size: 13px;

    font-weight: 600;

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


/* ============================================================
   THUMBNAILS
============================================================ */

.blr-thumbnail-row {

    display: grid;

    grid-template-columns:
        repeat(5, 1fr);

    gap: 8px;

    margin-top: 9px;
}


.blr-thumbnail {

    height: 94px;

    padding: 0;

    overflow: hidden;

    cursor: pointer;

    background: #fff;

    border:
        2px solid transparent;

    border-radius: 8px;

    transition: .2s ease;
}


.blr-thumbnail:hover {

    transform:
        translateY(-2px);
}


.blr-thumbnail.active {

    border-color:
        var(--blr-blue);
}


.blr-thumbnail img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


.blr-photo-count {

    margin-top: 8px;

    color: #667085;

    font-size: 13px;

    text-align: right;
}


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

.blr-hero-info {

    min-width: 0;
}


.blr-property-tags {

    display: flex;

    gap: 10px;

    flex-wrap: wrap;

    margin-bottom: 18px;
}


.blr-status-tag,
.blr-type-tag {

    display: inline-flex;

    align-items: center;

    min-height: 32px;

    padding: 7px 13px;

    border-radius: 6px;

    font-size: 13px;

    font-weight: 600;
}


.blr-status-tag {

    color: #087443;

    background: #eaf9f1;
}


.blr-type-tag {

    color: var(--blr-blue);

    background: var(--blr-blue-light);
}


.blr-hero-info h1 {

    font-size:
        clamp(
            30px,
            3vw,
            44px
        );

    line-height: 1.15;

    margin:
        4px 0 8px;

    color: #07142e;

    font-weight: 700;
}


.blr-property-subtitle {

    font-size: 18px;

    color: #344054;

    margin-bottom: 18px;

    font-weight: 500;
}


.blr-property-location {

    display: flex;

    align-items: flex-start;

    gap: 8px;

    margin: 10px 0 20px;

    font-size: 15px;

    color: #344054;

    line-height: 1.55;
}


.blr-property-location a {

    color: #344054;

    text-decoration: none;
}


.blr-property-location a:hover {

    color: var(--blr-blue);
}


.blr-inline-icon {

    flex: 0 0 auto;

    color: var(--blr-blue);

    margin-top: 1px;
}


.blr-inline-icon svg {

    width: 20px;
    height: 20px;
}


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

.blr-price-card {

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

    border-radius: 12px;

    padding: 26px;

    background: #fff;

    box-shadow:
        0 8px 25px
        rgba(15, 23, 42, .05);
}


.blr-price-grid {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 24px;
}


.blr-price-label,
.blr-price-range span {

    display: block;

    font-size: 14px;

    color: #667085;

    margin-bottom: 8px;
}


.blr-price-grid strong {

    display: block;

    color: var(--blr-blue);

    font-size: 25px;

    line-height: 1.25;

    word-break: break-word;
}


.blr-main-price {

    font-size: 30px !important;
}


.blr-price-range {

    border-top:
        1px solid #e5e7eb;

    margin-top: 22px;

    padding-top: 20px;
}


.blr-price-range strong {

    display: block;

    color: #101828;

    font-size: 18px;
}


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

.blr-price-actions {

    display: grid;

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

    gap: 12px;

    margin-top: 22px;
}


.blr-btn {

    min-height: 50px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    padding: 11px 18px;

    text-decoration: none !important;

    border-radius: 7px;

    font-weight: 600;

    font-size: 14px;

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


.blr-btn:hover {

    transform:
        translateY(-1px);
}


.blr-btn-primary {

    background:
        var(--blr-blue);

    color: #fff !important;

    border:
        1px solid
        var(--blr-blue);
}


.blr-btn-primary:hover {

    background:
        var(--blr-blue-dark);

    box-shadow:
        0 7px 18px
        rgba(6, 73, 201, .18);
}


.blr-btn-outline {

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

    color:
        var(--blr-blue) !important;

    background: #fff;
}


.blr-btn-outline:hover {

    background:
        var(--blr-blue-light);
}


.blr-btn-whatsapp {

    background:
        var(--blr-green);

    color: #fff !important;

    border:
        1px solid
        var(--blr-green);
}


.blr-btn-whatsapp:hover {

    background:
        var(--blr-green-dark);
}


.blr-button-icon {

    display: inline-flex;
}


.blr-button-icon svg {

    width: 18px;
    height: 18px;
}


/* ============================================================
   QUICK FACTS
============================================================ */

.blr-facts-card {

    display: grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(145px, 1fr)
        );

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

    border-radius: 12px;

    margin-top: 32px;

    background: #fff;

    overflow: hidden;

    box-shadow:
        0 5px 18px
        rgba(15, 23, 42, .035);
}


.blr-fact {

    min-height: 145px;

    padding: 22px 15px;

    text-align: center;

    border-right:
        1px solid #e5e7eb;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;
}


.blr-fact:last-child {

    border-right: 0;
}


/* ============================================================
   BLUE CIRCULAR FACT ICONS
============================================================ */

.blr-fact-icon {

    width: 52px;

    height: 52px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 12px;

    border-radius: 50%;

    color:
        var(--blr-blue);

    background:
        #edf4ff;

    border:
        1px solid #d8e6ff;
}


.blr-fact-icon svg {

    width: 24px;
    height: 24px;
}


.blr-fact span {

    color: #667085;

    font-size: 12px;

    margin-bottom: 7px;
}


.blr-fact strong {

    color: #101828;

    font-size: 15px;

    line-height: 1.35;

    font-weight: 600;
}


/* ============================================================
   COMMON SECTION CARDS
============================================================ */

.blr-property-details-card,
.blr-description-card,
.blr-gallery-section,
.blr-amenities-card,
.blr-location-card {

    margin-top: 32px;

    padding: 30px;

    background: #fff;

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

    border-radius: 12px;

    box-shadow:
        0 5px 20px
        rgba(15, 23, 42, .035);
}


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

.blr-section-heading {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 22px;
}


.blr-section-heading h2 {

    margin: 0;

    color: #101828;

    font-size: 23px;

    font-weight: 700;
}


.blr-title-line {

    width: 38px;

    height: 3px;

    background:
        var(--blr-blue);

    border-radius: 4px;

    margin-top: 12px;
}


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

.blr-detail-grid {

    display: grid;

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

    gap: 0;

    border:
        1px solid #e5e7eb;

    border-radius: 9px;

    overflow: hidden;
}


.blr-detail-item {

    padding: 20px;

    min-height: 92px;

    border-right:
        1px solid #e5e7eb;

    border-bottom:
        1px solid #e5e7eb;

    display: flex;

    flex-direction: column;

    justify-content: center;

    gap: 7px;
}


.blr-detail-item span {

    color: #667085;

    font-size: 12px;
}


.blr-detail-item strong {

    color: #101828;

    font-size: 15px;

    line-height: 1.4;
}


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

.blr-description {

    color: #344054;

    line-height: 1.8;

    font-size: 15px;
}


.blr-description p:first-child {

    margin-top: 0;
}


.blr-description p:last-child {

    margin-bottom: 0;
}


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

.blr-gallery-total {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 7px 12px;

    border-radius: 6px;

    background:
        var(--blr-blue-light);

    color:
        var(--blr-blue);

    font-size: 13px;

    font-weight: 600;
}


.blr-gallery-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    grid-template-rows:
        230px 165px;

    gap: 9px;
}


.blr-gallery-item {

    position: relative;

    overflow: hidden;

    padding: 0;

    border: 0;

    border-radius: 8px;

    background: #eef2f7;

    cursor: pointer;
}


.blr-gallery-item img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

    transition:
        transform .3s ease;
}


.blr-gallery-item:hover img {

    transform:
        scale(1.035);
}


.blr-gallery-item-1 {

    grid-column:
        span 2;
}


.blr-more-photos {

    position: absolute;

    inset: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    background:
        rgba(5, 19, 45, .62);

    color: #fff;

    font-size: 16px;

    font-weight: 600;
}


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

.blr-amenities-grid {

    display: grid;

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

    gap: 14px;
}


.blr-amenity {

    min-height: 118px;

    padding: 16px 10px;

    text-align: center;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 10px;

    color: #1d2939;

    font-size: 13px;

    line-height: 1.35;

    background: #f8faff;

    border:
        1px solid #e5ecf8;

    border-radius: 10px;

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


.blr-amenity:hover {

    transform:
        translateY(-2px);

    border-color:
        #c9daf8;

    box-shadow:
        0 7px 18px
        rgba(6, 73, 201, .07);
}


/* ============================================================
   BLUE CIRCULAR AMENITY ICONS
============================================================ */

.blr-amenity-icon {

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color:
        var(--blr-blue);

    background: #eaf2ff;

    border:
        1px solid #d4e3ff;
}


.blr-amenity-icon svg {

    width: 23px;

    height: 23px;
}


.blr-amenity span {

    font-weight: 500;

    color: #26364d;
}


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

.blr-location-details {

    display: flex;

    align-items: center;

    gap: 18px;

    padding: 22px;

    background: #f8faff;

    border:
        1px solid #e4eaf4;

    border-radius: 10px;
}


.blr-location-large-icon {

    width: 56px;

    height: 56px;

    flex: 0 0 56px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color:
        var(--blr-blue);

    background:
        #eaf2ff;
}


.blr-location-large-icon svg {

    width: 26px;

    height: 26px;
}


.blr-location-details > div:nth-child(2) {

    flex: 1;

    min-width: 0;
}


.blr-location-details strong {

    display: block;

    color: #101828;

    font-size: 16px;

    line-height: 1.5;
}


.blr-location-details span {

    display: block;

    margin-top: 5px;

    color: #667085;

    font-size: 13px;
}


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

.blr-contact-card {

    display: grid;

    grid-template-columns:
        40% 60%;

    margin-top: 34px;

    border:
        1px solid #9bb6ec;

    border-radius: 12px;

    background: #fff;

    overflow: hidden;

    box-shadow:
        0 8px 26px
        rgba(6, 73, 201, .055);
}


.blr-contact-info,
.blr-enquiry-form {

    padding: 32px;
}


.blr-contact-info {

    border-right:
        1px solid #e4e7ec;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f8faff
        );
}


.blr-contact-eyebrow {

    display: inline-block;

    margin-bottom: 8px;

    color:
        var(--blr-blue);

    font-size: 12px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .6px;
}


.blr-contact-card h2 {

    margin: 0;

    color: #101828;

    font-size: 23px;

    line-height: 1.3;
}


.blr-contact-person {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-top: 24px;

    padding-bottom: 20px;

    border-bottom:
        1px solid #e5e7eb;
}


.blr-contact-avatar {

    width: 48px;

    height: 48px;

    flex: 0 0 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        var(--blr-blue);

    color: #fff;

    font-size: 18px;

    font-weight: 700;
}


.blr-contact-person span {

    display: block;

    color: #667085;

    font-size: 12px;

    margin-bottom: 3px;
}


.blr-contact-person strong {

    display: block;

    color: #101828;

    font-size: 16px;
}


/* ============================================================
   CONTACT ROWS
============================================================ */

.blr-contact-list {

    margin-top: 18px;

    display: flex;

    flex-direction: column;

    gap: 8px;
}


.blr-contact-row {

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 11px 10px;

    border-radius: 8px;

    text-decoration: none !important;

    transition:
        background .2s ease;
}


.blr-contact-row:hover {

    background: #edf4ff;
}


.blr-contact-row-icon {

    width: 38px;

    height: 38px;

    flex: 0 0 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color:
        var(--blr-blue);

    background:
        #eaf2ff;
}


.blr-contact-row-icon svg {

    width: 18px;

    height: 18px;
}


.blr-contact-row small {

    display: block;

    color: #667085;

    font-size: 11px;

    margin-bottom: 2px;
}


.blr-contact-row strong {

    color: #101828;

    font-size: 14px;

    word-break: break-word;
}


.blr-contact-notes {

    margin-top: 18px;

    padding: 15px;

    background: #fff;

    border:
        1px solid #e5e7eb;

    border-radius: 8px;

    color: #475467;

    font-size: 13px;

    line-height: 1.6;
}


.blr-contact-buttons {

    display: grid;

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

    gap: 10px;

    margin-top: 20px;
}


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

.blr-enquiry-form h2 {

    margin-bottom: 8px;
}


.blr-enquiry-form > p {

    margin:
        0 0 20px;

    color: #667085;

    line-height: 1.55;

    font-size: 14px;
}


.blr-enquiry-form form {

    display: flex;

    flex-direction: column;

    gap: 12px;
}


.blr-form-row {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 12px;
}


.blr-enquiry-form input,
.blr-enquiry-form textarea {

    width: 100%;

    border:
        1px solid #d7dde7;

    border-radius: 7px;

    background: #fff;

    padding: 13px 15px;

    outline: none;

    color: #101828;

    font-size: 14px;

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


.blr-enquiry-form textarea {

    resize: vertical;

    min-height: 125px;
}


.blr-enquiry-form input:focus,
.blr-enquiry-form textarea:focus {

    border-color:
        var(--blr-blue);

    box-shadow:
        0 0 0 3px
        rgba(6, 73, 201, .08);
}


.blr-submit {

    min-height: 50px;

    border: 0;

    border-radius: 7px;

    background:
        var(--blr-blue);

    color: #fff;

    font-weight: 600;

    cursor: pointer;

    transition:
        .2s ease;
}


.blr-submit:hover {

    background:
        var(--blr-blue-dark);

    transform:
        translateY(-1px);
}


/* ============================================================
   TRUST BAR
============================================================ */

.blr-trust-bar {

    display: grid;

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

    gap: 20px;

    text-align: center;

    padding:
        30px 20px 5px;

    color: #344054;

    font-size: 14px;
}


.blr-trust-bar span {

    position: relative;

    padding-left: 4px;

    font-weight: 500;
}


/* ============================================================
   HOUZEZ OVERRIDE PROTECTION
============================================================ */

.blr-property-page button,
.blr-property-page input,
.blr-property-page textarea {

    font-family: inherit;
}


.blr-property-page button {

    outline: none;
}


.blr-property-page a {

    box-shadow: none;
}


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

@media (max-width: 1100px) {


    .blr-property-hero {

        grid-template-columns:
            1fr;
    }


    .blr-detail-grid {

        grid-template-columns:
            repeat(2, 1fr);
    }


    .blr-amenities-grid {

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


    .blr-contact-card {

        grid-template-columns:
            1fr 1.25fr;
    }

}


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

@media (max-width: 900px) {


    .blr-contact-card {

        grid-template-columns:
            1fr;
    }


    .blr-contact-info {

        border-right: 0;

        border-bottom:
            1px solid #e4e7ec;
    }


    .blr-amenities-grid {

        grid-template-columns:
            repeat(3, 1fr);
    }


    .blr-gallery-grid {

        grid-template-rows:
            210px 150px;
    }

}


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

@media (max-width: 767px) {


    .blr-property-page {

        padding-top: 18px;
    }


    .blr-property-container {

        width:
            calc(100% - 28px);
    }


    .blr-property-hero {

        gap: 22px;
    }


    .blr-main-image {

        border-radius: 9px;

        aspect-ratio:
            1.35 / 1;
    }


    .blr-premium-badge {

        left: 12px;

        top: 12px;

        padding: 7px 10px;

        font-size: 11px;
    }


    .blr-hero-info h1 {

        font-size: 28px;
    }


    .blr-property-subtitle {

        font-size: 16px;
    }


    .blr-thumbnail-row {

        display: flex;

        overflow-x: auto;

        padding-bottom: 4px;
    }


    .blr-thumbnail {

        min-width: 88px;

        height: 70px;

        flex:
            0 0 88px;
    }


    .blr-price-card {

        padding: 20px;
    }


    .blr-price-grid {

        grid-template-columns:
            1fr;
    }


    .blr-price-actions {

        grid-template-columns:
            1fr;
    }


    .blr-main-price {

        font-size:
            26px !important;
    }


    .blr-facts-card {

        grid-template-columns:
            repeat(2, 1fr);
    }


    .blr-fact {

        min-height: 125px;

        border-bottom:
            1px solid #e5e7eb;
    }


    .blr-fact-icon {

        width: 46px;

        height: 46px;
    }


    .blr-property-details-card,
    .blr-description-card,
    .blr-gallery-section,
    .blr-amenities-card,
    .blr-location-card {

        padding: 21px;

        margin-top: 24px;
    }


    .blr-section-heading h2 {

        font-size: 20px;
    }


    .blr-detail-grid {

        grid-template-columns:
            1fr;
    }


    .blr-detail-item {

        border-right: 0;

        min-height: 80px;
    }


    .blr-gallery-grid {

        grid-template-columns:
            1fr 1fr;

        grid-template-rows:
            190px
            120px
            120px;
    }


    .blr-gallery-item-1 {

        grid-column:
            span 2;
    }


    .blr-gallery-item-2 {

        grid-column:
            span 2;
    }


    .blr-amenities-grid {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 10px;
    }


    .blr-amenity {

        min-height: 108px;

        padding: 13px 8px;
    }


    .blr-location-details {

        align-items:
            flex-start;

        flex-wrap: wrap;
    }


    .blr-location-details .blr-btn {

        width: 100%;
    }


    .blr-contact-info,
    .blr-enquiry-form {

        padding: 22px;
    }


    .blr-form-row {

        grid-template-columns:
            1fr;
    }


    .blr-contact-buttons {

        grid-template-columns:
            1fr;
    }


    .blr-trust-bar {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 14px;

        padding-left: 0;

        padding-right: 0;
    }

}


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

@media (max-width: 480px) {


    .blr-property-container {

        width:
            calc(100% - 20px);
    }


    .blr-breadcrumb {

        font-size: 12px;
    }


    .blr-hero-info h1 {

        font-size: 25px;
    }


    .blr-facts-card {

        grid-template-columns:
            1fr 1fr;
    }


    .blr-amenities-grid {

        grid-template-columns:
            1fr 1fr;
    }


    .blr-amenity {

        font-size: 12px;
    }


    .blr-gallery-grid {

        display: flex;

        flex-direction: column;
    }


    .blr-gallery-item {

        height: 190px;
    }


    .blr-trust-bar {

        grid-template-columns:
            1fr 1fr;

        font-size: 12px;
    }

}