

/* =========================================================
ELEMENTOR RESET / PROTECTION
========================================================= */

.dis-location-v1,
.dis-location-v1 *,
.dis-location-v1 *::before,
.dis-location-v1 *::after {
    box-sizing: border-box;
}

.dis-location-v1 {

    --bg: #f3efe7;
    --surface: #fbfaf7;

    --dark: #22282c;
    --body: #596166;

    --gold: #cf9d47;
    --gold-light: #dfb25d;

    position: relative;

    width: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;

    background: #f3efe7;

    color: #252b2f;

    font-family: "Montserrat", Arial, sans-serif;

    isolation: isolate;
}


/* =========================================================
FONT AWESOME
========================================================= */

.dis-location-v1 .fa-solid,
.dis-location-v1 .fas {

    font-family: "Font Awesome 6 Free";

    font-style: normal;
    font-variant: normal;

    font-weight: 900;

    line-height: 1;

    text-rendering: auto;

    -webkit-font-smoothing: antialiased;
}


/* =========================================================
BACKGROUND DECORATION
========================================================= */

.dis-location-v1__decor {

    position: absolute;

    inset: 0;

    z-index: 0;

    pointer-events: none;

    overflow: hidden;
}


.dis-location-v1__decor-circle {

    position: absolute;

    display: block;

    border-radius: 50%;

    border:
        1px solid rgba(191,141,57,0.10);
}


.dis-location-v1__decor-circle--one {

    width: 580px;
    height: 580px;

    top: -350px;
    right: -220px;
}


.dis-location-v1__decor-circle--two {

    width: 420px;
    height: 420px;

    bottom: -290px;
    left: -250px;
}


/* =========================================================
1400PX CONTAINER
========================================================= */

.dis-location-v1__container {

    position: relative;

    z-index: 2;

    width: calc(100% - 64px);
    max-width: 1400px;

    margin: 0 auto;

    padding:
        112px 0 120px;
}


/* =========================================================
MAIN LAYOUT
========================================================= */

.dis-location-v1__layout {

    display: grid;

    grid-template-columns:
        minmax(0,1.08fr)
        minmax(0,0.92fr);

    align-items: center;

    width: 100%;

    margin: 0;
    padding: 0;
}


/* =========================================================
LEFT VISUAL
========================================================= */

.dis-location-v1__visual {

    position: relative;

    width: 100%;

    margin: 0;

    padding:
        0 0 42px;
}


/* IMAGE WRAP */

.dis-location-v1__image-wrap {

    position: relative;

    width: 100%;

    height: 610px;

    margin: 0;
    padding: 0;

    overflow: hidden;

    background: #d8d5cf;
}


/* IMAGE */

.dis-location-v1__image-wrap img {

    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    max-width: none;

    margin: 0;
    padding: 0;

    object-fit: cover;

    object-position:
        center center;

    border: 0;
    border-radius: 0;

    transform:
        scale(1.01);

    transition:
        transform 900ms cubic-bezier(.2,.75,.25,1);
}


.dis-location-v1__image-wrap:hover img {

    transform:
        scale(1.04);
}


/* IMAGE SHADE */

.dis-location-v1__image-shade {

    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        linear-gradient(
            180deg,
            rgba(18,22,24,0.00) 45%,
            rgba(18,22,24,0.08) 68%,
            rgba(18,22,24,0.38) 100%
        );

    pointer-events: none;
}


/* CORNERS */

.dis-location-v1__corner {

    position: absolute;

    z-index: 5;

    width: 78px;
    height: 78px;

    pointer-events: none;
}


.dis-location-v1__corner--tl {

    top: 28px;
    left: 28px;

    border-top:
        2px solid #d3a34e;

    border-left:
        2px solid #d3a34e;
}


.dis-location-v1__corner--br {

    right: 28px;
    bottom: 28px;

    border-right:
        2px solid #d3a34e;

    border-bottom:
        2px solid #d3a34e;
}


/* GOLD LOCATION MARK */

.dis-location-v1__image-marker {

    position: absolute;

    z-index: 6;

    right: 0;
    bottom: 0;

    display: flex;

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

    width: 86px;
    height: 86px;

    background:
        #cf9d47;
}


.dis-location-v1__image-marker i {

    color: #22282c;

    font-size: 25px;
}


/* BOTTOM GOLD STRIP */

.dis-location-v1__visual-foot {

    position: absolute;

    right: -28px;
    bottom: 0;

    z-index: 7;

    display: flex;

    align-items: center;

    gap: 8px;

    width: 210px;
    height: 72px;

    padding:
        0 29px;

    background:
        #22282c;
}


.dis-location-v1__visual-foot span {

    display: block;

    height: 1px;

    background:
        #d7aa58;
}


.dis-location-v1__visual-foot span:nth-child(1) {

    width: 67px;
}


.dis-location-v1__visual-foot span:nth-child(2) {

    width: 29px;
}


.dis-location-v1__visual-foot span:nth-child(3) {

    width: 11px;
}


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

.dis-location-v1__content {

    position: relative;

    z-index: 10;

    width:
        calc(100% + 58px);

    margin:
        0 0 0 -58px;

    padding:
        61px 60px 55px;

    background:
        #fbfaf7;

    border:
        1px solid rgba(37,43,47,0.12);

    box-shadow:
        0 24px 60px rgba(31,36,39,0.10);
}


/* GOLD LEFT EDGE */

.dis-location-v1__content::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 4px;
    height: 100%;

    background:
        #cf9d47;
}


/* =========================================================
ACCENT
========================================================= */

.dis-location-v1__accent {

    display: flex;

    align-items: center;

    gap: 8px;

    width: 100%;

    margin:
        0 0 30px;
}


.dis-location-v1__accent span {

    display: block;

    height: 2px;

    background:
        #cf9d47;
}


.dis-location-v1__accent span:first-child {

    width: 68px;
}


.dis-location-v1__accent span:last-child {

    width: 22px;
}


.dis-location-v1__accent i {

    display: block;

    width: 7px;
    height: 7px;

    border:
        1px solid #cf9d47;

    transform:
        rotate(45deg);
}


/* =========================================================
TOP META
========================================================= */

.dis-location-v1__top {

    display: flex;

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

    gap: 30px;

    width: 100%;

    margin:
        0 0 31px;
}


.dis-location-v1__icon {

    display: flex;

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

    width: 58px;
    height: 58px;

    border:
        1px solid rgba(198,147,61,0.44);
}


.dis-location-v1__icon i {

    color:
        #c7903d;

    font-size:
        21px;
}


.dis-location-v1__number {

    color:
        #b78537;

    font-family:
        "Oswald", Arial, sans-serif;

    font-size:
        15px;

    font-weight:
        500;

    line-height:
        1;

    letter-spacing:
        2px;
}


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

.dis-location-v1 .dis-location-v1__title,
.dis-location-v1 h2.dis-location-v1__title {

    width: 100%;

    margin: 0;
    padding: 0;

    color:
        #252b2f;

    font-family:
        "Oswald", Arial, sans-serif;

    font-size:
        46px;

    font-weight:
        600;

    font-style:
        normal;

    line-height:
        1.11;

    letter-spacing:
        -0.45px;

    text-align:
        left;

    text-transform:
        none;

    text-decoration:
        none;
}


/* =========================================================
RULE
========================================================= */

.dis-location-v1__rule {

    display: flex;

    align-items: center;

    gap: 8px;

    width: 100%;

    margin:
        24px 0 23px;
}


.dis-location-v1__rule span {

    display: block;

    width: 74px;
    height: 2px;

    background:
        #cf9d47;
}


.dis-location-v1__rule i {

    display: block;

    width: 7px;
    height: 7px;

    border:
        1px solid #cf9d47;

    transform:
        rotate(45deg);
}


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

.dis-location-v1 .dis-location-v1__text,
.dis-location-v1 p.dis-location-v1__text {

    width: 100%;

    margin: 0;
    padding: 0;

    color:
        #596166;

    font-family:
        "Montserrat", Arial, sans-serif;

    font-size:
        18px;

    font-weight:
        400;

    font-style:
        normal;

    line-height:
        1.75;

    letter-spacing:
        0;

    text-align:
        left;

    text-transform:
        none;
}


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

.dis-location-v1__bottom-art {

    display: flex;

    align-items: center;

    gap: 17px;

    width: 100%;

    margin:
        37px 0 0;
}


.dis-location-v1__bottom-line {

    display: block;

    flex: 1 1 auto;

    height: 1px;

    background:
        rgba(37,43,47,0.15);
}


.dis-location-v1__bottom-symbol {

    display: flex;

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

    flex: 0 0 43px;

    width: 43px;
    height: 43px;

    border:
        1px solid rgba(198,147,61,0.38);
}


.dis-location-v1__bottom-symbol i {

    color:
        #c6913e;

    font-size:
        15px;
}


/* =========================================================
1200
========================================================= */

@media (max-width: 1200px) {

    .dis-location-v1__container {

        width:
            calc(100% - 48px);

        padding:
            95px 0 104px;
    }


    .dis-location-v1__image-wrap {

        height:
            565px;
    }


    .dis-location-v1__content {

        width:
            calc(100% + 45px);

        margin-left:
            -45px;

        padding:
            50px 45px 47px;
    }


    .dis-location-v1
    .dis-location-v1__title,
    .dis-location-v1
    h2.dis-location-v1__title {

        font-size:
            41px;
    }

}


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

@media (max-width: 950px) {

    .dis-location-v1__container {

        width:
            calc(100% - 40px);

        padding:
            82px 0 90px;
    }


    .dis-location-v1__layout {

        grid-template-columns:
            1fr;
    }


    .dis-location-v1__visual {

        padding-bottom:
            0;
    }


    .dis-location-v1__image-wrap {

        height:
            520px;
    }


    .dis-location-v1__visual-foot {

        right:
            24px;

        bottom:
            0;
    }


    .dis-location-v1__content {

        width:
            calc(100% - 54px);

        margin:
            -65px auto 0;

        padding:
            48px 45px 46px;
    }

}


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

@media (max-width: 767px) {

    .dis-location-v1__container {

        width:
            calc(100% - 36px);

        padding:
            68px 0 73px;
    }


    .dis-location-v1__image-wrap {

        height:
            370px;
    }


    .dis-location-v1__image-wrap img {

        object-position:
            center center;
    }


    .dis-location-v1__corner {

        width:
            50px;

        height:
            50px;
    }


    .dis-location-v1__corner--tl {

        top:
            17px;

        left:
            17px;
    }


    .dis-location-v1__corner--br {

        right:
            17px;

        bottom:
            17px;
    }


    .dis-location-v1__image-marker {

        width:
            64px;

        height:
            64px;
    }


    .dis-location-v1__image-marker i {

        font-size:
            20px;
    }


    .dis-location-v1__visual-foot {

        display:
            none;
    }


    /* CONTENT */

    .dis-location-v1__content {

        width:
            calc(100% - 20px);

        margin:
            -42px auto 0;

        padding:
            34px 25px 32px;
    }


    .dis-location-v1__accent {

        margin-bottom:
            24px;
    }


    .dis-location-v1__accent span:first-child {

        width:
            52px;
    }


    .dis-location-v1__top {

        margin-bottom:
            25px;
    }


    .dis-location-v1__icon {

        width:
            50px;

        height:
            50px;
    }


    .dis-location-v1__icon i {

        font-size:
            18px;
    }


    .dis-location-v1
    .dis-location-v1__title,
    .dis-location-v1
    h2.dis-location-v1__title {

        font-size:
            35px;

        line-height:
            1.12;
    }


    .dis-location-v1__rule {

        margin:
            20px 0 19px;
    }


    .dis-location-v1
    .dis-location-v1__text,
    .dis-location-v1
    p.dis-location-v1__text {

        font-size:
            16.5px;

        line-height:
            1.7;
    }


    .dis-location-v1__bottom-art {

        margin-top:
            28px;
    }

}


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

@media (max-width: 420px) {

    .dis-location-v1__container {

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


    .dis-location-v1__image-wrap {

        height:
            315px;
    }


    .dis-location-v1__content {

        width:
            calc(100% - 12px);

        padding:
            30px 21px 29px;
    }


    .dis-location-v1
    .dis-location-v1__title,
    .dis-location-v1
    h2.dis-location-v1__title {

        font-size:
            32px;
    }


    .dis-location-v1
    .dis-location-v1__text,
    .dis-location-v1
    p.dis-location-v1__text {

        font-size:
            16px;
    }

}


/* =========================================================
REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .dis-location-v1__image-wrap img {

        transition:
            none;
    }


    .dis-location-v1__image-wrap:hover img {

        transform:
            scale(1.01);
    }

}




/* Client feedback 05: use a real patient from the original site (Sarah), not office furniture. */
.dis-location-v1 .dis-location-v1__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 29%;
}
@media (max-width: 767px) {
  .dis-location-v1 .dis-location-v1__image-wrap img { object-position: center 25%; }
}
