.elementor-18378 .elementor-element.elementor-element-a1af403{--display:flex;--background-transition:0.3s;}.elementor-18378 .elementor-element.elementor-element-b0f377e{width:100%;max-width:100%;}.elementor-18378 .elementor-element.elementor-element-77f1666{--display:flex;--background-transition:0.3s;}/* Start custom CSS for html, class: .elementor-element-b0f377e *//* =====================================================
   MR BLUE STORE DETAIL
   SECTION 1 — HEADER + HERO
===================================================== */


/* =====================================================
   MAIN PAGE
===================================================== */

.mr-detail-page {

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    background: #ffffff;

    color: #07183c;

    overflow: hidden;
}


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

.mr-store-header {

    width: 100%;

    margin: 0;
    padding: 0;

    background: #ffffff;

    border-bottom:
        1px solid
        #edf2f7;
}


.mr-store-header-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    min-height: 70px;

    margin: 0 auto;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 40px;
}


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

.mr-store-logo {

    display: flex !important;

    align-items: center;

    flex-shrink: 0;

    margin: 0 !important;
    padding: 0 !important;

    text-decoration: none !important;
}


.mr-store-logo img {

    width: 105px !important;

    height: auto !important;

    max-width: none !important;

    display: block !important;

    margin: 0 !important;
}


/* =====================================================
   NAVIGATION
===================================================== */

.mr-store-nav {

    display: flex;

    align-items: center;

    gap: 30px;
}


.mr-store-nav a {

    margin: 0 !important;
    padding: 0 !important;

    color: #07a183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1.2 !important;

    font-weight: 500 !important;

    text-decoration: none !important;
}


.mr-store-nav a:hover {

    color: #086cff !important;
}


/* BOOK PICKUP */

.mr-store-nav
.mr-header-book {

    min-height: 34px !important;

    padding:
        0
        17px !important;

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    border-radius: 4px !important;

    background: #086cff !important;

    color: #ffffff !important;

    font-size: 12px !important;

    font-weight: 700 !important;

    box-shadow:
        0 5px 12px
        rgba(8,108,255,.18);
}


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

.mr-store-hero {

    width: 100%;

    margin: 0;
    padding: 0;

    background: #ffffff;
}


.mr-store-hero-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    min-height: 410px;

    margin: 0 auto;

    display: grid;

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


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

.mr-store-hero-content {

    min-height: 410px;

    box-sizing: border-box;

    padding:
        70px
        45px
        45px
        25px;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;
}


/* =====================================================
   EYEBROW
===================================================== */

.mr-store-eyebrow {

    width: auto !important;

    height: auto !important;

    min-height: 8px !important;

    margin:
        0
        0
        22px
        0 !important;

    padding: 0 !important;

    display: flex !important;

    align-items: center !important;

    gap: 4px !important;

    color: #0875f5 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 10px !important;

    line-height: 8px !important;

    font-weight: 700 !important;

    letter-spacing: 1.7px !important;

}


/* EYEBROW ALL CHILDREN */

.mr-store-eyebrow span,
.mr-store-eyebrow b,
.mr-store-eyebrow strong,
.mr-store-eyebrow #hero-city {

    display: inline-block !important;

    width: auto !important;

    height: auto !important;

    min-width: 0 !important;

    min-height: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    color: #0875f5 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 10px !important;

    line-height: 8px !important;

    font-weight: 700 !important;

    letter-spacing: 1.7px !important;

    text-transform: uppercase !important;
}


/* EXTRA FORCE FOR CITY */

#hero-city {

    font-size: 10px !important;

    line-height: 8px !important;

    font-weight: 700 !important;

    letter-spacing: 1.7px !important;

    color: #0875f5 !important;
}


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

.mr-store-main-title {

    width: auto !important;

    max-width: 520px !important;

    margin:
        0
        0
        0
        0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 61px !important;

    line-height: .91 !important;

    letter-spacing: -2.6px !important;

    font-weight: 900 !important;

    text-transform: none !important;
}


/* HEADING BLUE CITY */

.mr-store-main-title #hero-city-title {

    display: block !important;

    width: auto !important;

    height: auto !important;

    margin:
        5px
        0
        0
        0 !important;

    padding: 0 !important;

    color: #086cff !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 61px !important;

    line-height: .91 !important;

    letter-spacing: -2.6px !important;

    font-weight: 900 !important;

    text-transform: none !important;
}


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

.mr-store-description {

    margin:
        23px
        0
        18px
        0 !important;

    padding: 0 !important;

    color: #55657c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1.5 !important;

    font-weight: 400 !important;
}


.mr-store-description span {

    margin: 0 !important;

    padding: 0 !important;

    color: inherit !important;

    font-size: inherit !important;

    font-weight: inherit !important;
}


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

.mr-hero-buttons {

    display: flex !important;

    align-items: center !important;

    gap: 8px !important;

    margin: 0 !important;

    padding: 0 !important;
}


.mr-schedule-btn,
.mr-call-btn {

    min-height: 32px !important;

    height: 32px !important;

    padding:
        0
        16px !important;

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    box-sizing: border-box !important;

    border-radius: 4px !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 12px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


/* BLUE BUTTON */

.mr-schedule-btn {

    background: #086cff !important;

    border:
        1px solid
        #086cff !important;

    color: #ffffff !important;
}


.mr-schedule-btn:hover {

    background: #005ddd !important;

    color: #ffffff !important;
}


/* WHITE BUTTON */

.mr-call-btn {

    background: #ffffff !important;

    border:
        1px solid
        #086cff !important;

    color: #086cff !important;
}


.mr-call-btn:hover {

    background: #f4f9ff !important;

    color: #086cff !important;
}


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

.mr-hero-location {

    margin:
        14px
        0
        0
        0 !important;

    padding: 0 !important;

    display: flex !important;

    align-items: center !important;

    flex-wrap: wrap !important;

    gap: 6px !important;

    color: #748299 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 11px !important;

    line-height: 1.4 !important;

    font-weight: 400 !important;
}


.mr-location-separator {

    color: #a7b3c2 !important;
}


.mr-hero-location a {

    color: #086cff !important;

    font-size: 11px !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


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

.mr-store-hero-image {

    min-height: 410px;

    height: 410px;

    box-sizing: border-box;

    padding: 30px;

    background: #dff0ff;
}


.mr-store-image-frame {

    width: 100%;

    height: 390px;

    min-height: 390px;

    position: relative;

    overflow: hidden;

    box-sizing: border-box;

    border:
        1px dashed
        #b9d9f8;
}


.mr-store-image-frame img {

    width: 100% !important;

    height: 100% !important;

    max-width: none !important;

    display: block !important;

    object-fit: cover !important;

    object-position: center !important;
}


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

.mr-store-image-label {

    position: absolute !important;

    left: 14px !important;

    bottom: 14px !important;

    margin: 0 !important;

    padding:
        5px
        9px !important;

    background: #ffffff !important;

    border-radius: 2px !important;

    color: #1c3455 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 10px !important;

    line-height: 1.2 !important;

    font-weight: 700 !important;
}


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

@media (min-width: 901px) {

    .mr-store-main-title {

        font-size: 61px !important;

        line-height: .91 !important;
    }

    .mr-store-main-title #hero-city-title {

        font-size: 61px !important;

        line-height: .91 !important;
    }

}


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

@media (max-width: 900px) {

    .mr-store-hero-inner {

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


    .mr-store-hero-content {

        padding:
            55px
            30px
            40px;
    }


    .mr-store-main-title {

        font-size: 52px !important;

        line-height: .93 !important;
    }


    .mr-store-main-title #hero-city-title {

        font-size: 52px !important;

        line-height: .93 !important;
    }

}


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

@media (max-width: 768px) {

    .mr-store-header-inner {

        width:
            calc(100% - 30px);

        min-height: 65px;

        gap: 15px;
    }


    .mr-store-logo img {

        width: 90px !important;
    }


    .mr-store-nav {

        gap: 12px;
    }


    .mr-store-nav a {

        font-size: 11px !important;
    }


    .mr-store-nav a:first-child {

        display: none;
    }


    .mr-store-nav .mr-header-book {

        min-height: 32px !important;

        padding:
            0
            12px !important;

        font-size: 11px !important;
    }


    .mr-store-hero-inner {

        width: 100%;

        grid-template-columns: 1fr;
    }


    .mr-store-hero-content {

        min-height: auto;

        padding:
            48px
            25px
            38px;
    }


    .mr-store-main-title {

        font-size: 48px !important;

        line-height: .92 !important;

        letter-spacing: -1.8px !important;
    }


    .mr-store-main-title #hero-city-title {

        font-size: 48px !important;

        line-height: .92 !important;

        letter-spacing: -1.8px !important;
    }


    .mr-store-hero-image {

        height: 330px;

        min-height: 330px;

        padding: 10px;
    }


    .mr-store-image-frame {

        height: 310px;

        min-height: 310px;
    }

}


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

@media (max-width: 480px) {

    .mr-store-header-inner {

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


    .mr-store-logo img {

        width: 85px !important;
    }


    .mr-store-nav {

        gap: 8px;
    }


    .mr-store-nav a:nth-child(3) {

        display: none;
    }


    .mr-store-hero-content {

        padding:
            40px
            20px
            35px;
    }


    .mr-store-main-title {

        font-size: 43px !important;

        line-height: .93 !important;
    }


    .mr-store-main-title #hero-city-title {

        font-size: 43px !important;

        line-height: .93 !important;
    }

}
/* =====================================================
   SECTION 2 — STORE DETAILS
   UPDATED TYPOGRAPHY
===================================================== */

.mr-store-details {
    width: 100%;
    margin: 0;
    padding: 65px 0 55px;
    background: #ffffff;
}

.mr-store-details-inner {
    width: min(1180px, calc(100% - 60px));
    margin: 0 auto;
}


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

.mr-store-details-heading {
    text-align: center;
    margin-bottom: 34px;
}

.mr-section-eyebrow {
    margin: 0 0 10px !important;
    padding: 0 !important;

    color: #0875f5 !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 11px !important;
    line-height: 1 !important;

    font-weight: 700 !important;

    letter-spacing: 2px !important;

    text-transform: uppercase !important;
}


/* MAIN HEADING */

.mr-store-details-heading h2 {
    margin: 0 !important;
    padding: 0 !important;

    color: #07183c !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 38px !important;
    line-height: 1.15 !important;

    letter-spacing: -1.2px !important;

    font-weight: 900 !important;
}

.mr-store-details-heading h2 span {
    color: #07183c !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: inherit !important;
    font-weight: 900 !important;
}


/* SUBTITLE */

.mr-store-details-heading p {
    margin: 8px 0 0 !important;
    padding: 0 !important;

    color: #66758c !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 13px !important;
    line-height: 1.5 !important;

    font-weight: 400 !important;
}


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

.mr-store-details-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 2fr)
        minmax(300px, .95fr);

    gap: 10px;

    align-items: stretch;
}


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

.mr-store-info-card {
    padding: 25px 20px;

    background: #ffffff;

    border: 1px solid #dcecff;

    border-radius: 5px;

    box-sizing: border-box;
}


/* STORE NAME */

.mr-store-info-card h3 {
    margin: 0 0 20px !important;
    padding: 0 !important;

    color: #07183c !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 19px !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;
}


/* =====================================================
   DETAIL ROW
===================================================== */

.mr-detail-row {
    display: grid;

    grid-template-columns: 105px 1fr;

    gap: 15px;

    align-items: start;
}


/* LABEL */

.mr-detail-label {
    color: #50627b !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 13px !important;
    line-height: 1.5 !important;

    font-weight: 700 !important;
}


/* VALUE */

.mr-detail-value {
    color: #172b4d !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 13px !important;
    line-height: 1.55 !important;

    font-weight: 400 !important;
}


/* LINKS */

.mr-detail-value a {
    display: inline-block;

    margin-top: 5px !important;

    color: #0875f5 !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 12px !important;
    line-height: 1.3 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}

.mr-detail-value a:hover {
    text-decoration: underline !important;
}


/* =====================================================
   DIVIDER
===================================================== */

.mr-detail-divider {
    width: 100%;
    height: 1px;

    margin: 20px 0;

    background: #e8eef6;
}


/* =====================================================
   OPENING HOURS
===================================================== */

.mr-hours-box {
    width: 100%;

    min-height: 50px;

    padding: 8px 12px;

    box-sizing: border-box;

    display: flex;

    flex-direction: column;

    justify-content: center;

    gap: 5px;

    background: #eaf5ff;

    border-radius: 3px;
}


.mr-hours-badge {
    display: inline-block;

    width: fit-content;

    padding: 4px 8px;

    background: #d9edff;

    color: #0875f5 !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 8px !important;
    line-height: 1 !important;

    font-weight: 700 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;

    border-radius: 2px;
}


#details-hours {
    color: #0875f5 !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 12px !important;

    line-height: 1.2 !important;

    font-weight: 400 !important;
}


/* =====================================================
   PHONE
===================================================== */

.mr-phone-number {
    color: #07183c !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 13px !important;

    line-height: 1.4 !important;

    font-weight: 500 !important;
}


/* =====================================================
   RIGHT MAP CARD
===================================================== */

.mr-store-map-card {
    padding: 15px 12px 12px;

    box-sizing: border-box;

    background: #eaf5ff;

    border-radius: 5px;
}


.mr-store-map-card h3 {
    margin: 0 0 4px !important;
    padding: 0 !important;

    color: #07183c !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 19px !important;
    line-height: 1.2 !important;

    font-weight: 800 !important;
}


/* MAP LOCATION */

.mr-map-location {
    margin-bottom: 10px !important;

    color: #52657d !important;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 12px !important;
    line-height: 1.4 !important;

    font-weight: 400 !important;
}


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

.mr-map-wrapper {
    width: 100%;

    height: 125px;

    overflow: hidden;

    background: #dceafa;

    border-radius: 4px;
}

.mr-map-wrapper iframe {
    width: 100%;
    height: 100%;

    display: block;

    border: 0;
}


/* =====================================================
   GOOGLE DIRECTIONS BUTTON
===================================================== */

.mr-google-direction {
    width: 100%;

    min-height: 30px;

    margin-top: 9px;

    padding: 0 10px;

    box-sizing: border-box;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    background: #0875f5 !important;

    color: #ffffff !important;

    border-radius: 4px;

    font-family: Arial, Helvetica, sans-serif !important;

    font-size: 12px !important;
    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}

.mr-google-direction:hover {
    background: #0064df !important;
    color: #ffffff !important;
}

.mr-google-direction span {
    font-size: 16px !important;
    line-height: 1 !important;
}


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

@media (max-width: 900px) {

    .mr-store-details {
        padding: 50px 0 45px;
    }

    .mr-store-details-inner {
        width: calc(100% - 40px);
    }

    .mr-store-details-heading h2 {
        font-size: 35px !important;
    }

    .mr-store-details-grid {
        grid-template-columns: 1fr 300px;
    }
}


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

@media (max-width: 700px) {

    .mr-store-details {
        padding: 45px 0 40px;
    }

    .mr-store-details-inner {
        width: calc(100% - 30px);
    }

    .mr-store-details-heading {
        margin-bottom: 25px;
    }

    .mr-store-details-heading h2 {
        font-size: 31px !important;
    }

    .mr-store-details-heading p {
        font-size: 13px !important;
    }

    .mr-store-details-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .mr-store-info-card {
        padding: 22px 17px;
    }

    .mr-detail-row {
        grid-template-columns: 90px 1fr;
        gap: 10px;
    }

    .mr-store-map-card {
        padding: 15px;
    }

    .mr-map-wrapper {
        height: 190px;
    }
}


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

@media (max-width: 480px) {

    .mr-store-details-heading h2 {
        font-size: 28px !important;
    }

    .mr-detail-row {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .mr-detail-divider {
        margin: 17px 0;
    }
}
/* =====================================================
   SECTION 3 — SERVICES
===================================================== */

.mr-services-section {

    width: 100%;
    margin: 0;

    padding:
        55px
        0
        38px;

    background: #ffffff;
}


.mr-services-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    margin: 0 auto;
}


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

.mr-services-heading {

    text-align: center;

    margin:
        0
        0
        28px;
}


.mr-services-heading h2 {

    margin: 0 !important;
    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    /* UPDATED */
    font-size: 41px !important;

    line-height: 1.15 !important;

    letter-spacing: -1.1px !important;

    font-weight: 900 !important;
}


.mr-services-heading h2 span {

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: inherit !important;
    line-height: inherit !important;

    font-weight: 900 !important;
}


.mr-services-heading p {

    margin:
        6px
        0
        0 !important;

    padding: 0 !important;

    color: #66758c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    /* UPDATED */
    font-size: 14px !important;

    line-height: 1.5 !important;

    font-weight: 400 !important;
}


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

.mr-services-grid {

    display: grid;

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

    gap: 7px;
}


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

.mr-service-card {

    min-height: 155px;

    padding:
        15px
        15px
        12px;

    box-sizing: border-box;

    background: #ffffff;

    border:
        1px solid
        #cfe4ff;

    border-radius: 4px;

    display: flex;

    flex-direction: column;

    align-items: flex-start;
}


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

.mr-service-category {

    margin:
        0
        0
        7px;

    padding: 0;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    /* UPDATED */
    font-size: 10px;

    line-height: 1.1;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;
}


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

.mr-service-card h3 {

    margin: 0;
    padding: 0;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    /* UPDATED */
    font-size: 23px;

    line-height: 1.15;

    font-weight: 800;

    letter-spacing: -.3px;
}


/* =====================================================
   BLUE LINE
===================================================== */

.mr-service-line {

    width: 23px;

    height: 3px;

    margin:
        8px
        0
        8px;

    background: #0875f5;

    border-radius: 2px;
}


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

.mr-service-card ul {

    margin:
        0
        0
        8px;

    padding:
        0
        0
        0
        15px;

    color: #526782;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    /* UPDATED */
    font-size: 13px;

    line-height: 1.6;
}


.mr-service-card li {

    margin: 0;
    padding: 0;
}


.mr-service-card li::marker {

    color: #82c1ff;

    font-size: 13px;
}


/* =====================================================
   EXPLORE SERVICE
===================================================== */

.mr-service-card a {

    margin-top: auto;

    padding: 0;

    color: #0875f5 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    /* UPDATED */
    font-size: 13px !important;

    line-height: 1.2 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


.mr-service-card a span {

    margin-left: 3px;

    /* UPDATED */
    font-size: 17px;

    font-weight: 700;
}


.mr-service-card a:hover {

    color: #005ddd !important;
}


/* =====================================================
   FOOTNOTE
===================================================== */

.mr-services-note {

    margin:
        10px
        0
        0;

    text-align: center;

    color: #748299;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    /* UPDATED */
    font-size: 10px;

    line-height: 1.4;

    font-weight: 400;
}


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

@media (max-width: 900px) {

    .mr-services-section {

        padding:
            48px
            0
            35px;
    }


    .mr-services-inner {

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


    .mr-services-heading h2 {

        font-size: 36px !important;
    }


    .mr-services-heading p {

        font-size: 13px !important;
    }


    .mr-services-grid {

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

        gap: 8px;
    }


    .mr-service-card h3 {

        font-size: 22px;
    }


    .mr-service-card ul {

        font-size: 13px;
    }

}


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

@media (max-width: 600px) {

    .mr-services-section {

        padding:
            42px
            0
            32px;
    }


    .mr-services-inner {

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


    .mr-services-heading {

        margin-bottom: 22px;
    }


    .mr-services-heading h2 {

        font-size: 31px !important;

        line-height: 1.18 !important;
    }


    .mr-services-heading p {

        font-size: 13px !important;
    }


    .mr-services-grid {

        grid-template-columns: 1fr;

        gap: 8px;
    }


    .mr-service-card {

        min-height: 150px;

        padding:
            15px
            14px
            12px;
    }


    .mr-service-category {

        font-size: 10px;
    }


    .mr-service-card h3 {

        font-size: 22px;
    }


    .mr-service-card ul {

        font-size: 13px;

        line-height: 1.6;
    }


    .mr-service-card a {

        font-size: 13px !important;
    }

}
/* =====================================================
   SECTION 4 — LOCAL STORE EXPERIENCE
===================================================== */

.mr-store-action-section {

    width: 100%;

    margin: 0;

    padding:
        55px
        0
        45px;

    background: #ffffff;
}


.mr-store-action-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    margin: 0 auto;
}


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

.mr-store-action-heading {

    text-align: center;

    margin:
        0
        28px;
}


.mr-store-action-eyebrow {

    margin:
        0
        0
        10px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 1.8px;

    text-transform: uppercase;
}


.mr-store-action-heading h2 {

    margin: 0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    /* SAME SIZE SCALE AS SERVICES */
    font-size: 41px !important;

    line-height: 1.15 !important;

    letter-spacing: -1px !important;

    font-weight: 900 !important;
}


.mr-store-action-heading h2 span {

    color: #07183c !important;

    font-size: inherit !important;

    font-weight: 900 !important;
}


.mr-store-action-heading p {

    margin:
        6px
        0
        10px !important;

    padding: 0 !important;

    color: #66758c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 14px !important;

    line-height: 1.5 !important;

    font-weight: 400 !important;
}


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

.mr-store-action-grid {

    display: grid;

    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(0, .95fr);

    gap: 25px;

    align-items: center;
}


/* =====================================================
   VIDEO AREA
===================================================== */

.mr-store-video-area {

    width: 100%;

    overflow: hidden;

    background: #eef6ff;

    border-radius: 6px;

    border:
        1px solid
        #e1edfb;
}


/* =====================================================
   MAIN VIDEO
===================================================== */

.mr-main-video {

    position: relative;

    width: 100%;

    height: 285px;

    overflow: hidden;

    background: #9eabc0;

    border-radius:
        6px
        6px
        0
        0;
}


.mr-main-video-element {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    background: #8f9db1;
}


/* =====================================================
   PLAY BUTTON
===================================================== */

.mr-video-play {

    position: absolute;

    left: 50%;
    top: 50%;

    transform:
        translate(
            -50%,
            -50%
        );

    width: 58px;

    height: 58px;

    padding: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        2px solid
        rgba(255,255,255,.9);

    border-radius: 50%;

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

    backdrop-filter:
        blur(3px);

    cursor: pointer;

    z-index: 5;
}


.mr-video-play span {

    margin-left: 4px;

    color: #0875f5;

    font-size: 29px;

    line-height: 1;

}


/* =====================================================
   VIDEO LABEL
===================================================== */

.mr-video-label {

    position: absolute;

    left: 12px;

    bottom: 10px;

    color: #ffffff;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 11px;

    line-height: 1.2;

    font-weight: 500;

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


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

.mr-video-thumbnails {

    display: grid;

    grid-template-columns:
        1fr
        1fr;

    gap: 5px;

    padding: 7px;
}


.mr-video-thumb {

    min-height: 50px;

    padding: 5px;

    display: flex;

    align-items: center;

    gap: 8px;

    border:
        1px solid
        #dce9f7;

    border-radius: 4px;

    background: #ffffff;

    cursor: pointer;

    text-align: left;
}


.mr-video-thumb:hover {

    border-color:
        #0875f5;
}


/* =====================================================
   THUMBNAIL PREVIEW
===================================================== */

.mr-thumb-preview {

    width: 64px;

    height: 35px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #d9e6f5;

    border-radius: 3px;
}


.mr-thumb-play {

    width: 17px;

    height: 17px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #ffffff;

    background: #53677f;

    border-radius: 50%;

    font-size: 8px;

    padding-left: 1px;
}


.mr-thumb-title {

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 11px;

    line-height: 1.3;

    font-weight: 700;
}


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

.mr-store-action-content {

    padding:
        5px
        0;
}


.mr-action-blue-line {

    width: 23px;

    height: 3px;

    margin:
        0
        0
        7px;

    background: #0875f5;

    border-radius: 2px;
}


.mr-store-action-content h3 {

    margin: 0 0 7px !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 23px !important;

    line-height: 1.15 !important;

    font-weight: 800 !important;

    letter-spacing: -.3px !important;
}


.mr-action-description {

    margin:
        0
        0
        17px !important;

    padding: 0 !important;

    color: #526782 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1.55 !important;

    font-weight: 400 !important;
}


/* =====================================================
   FEATURES
===================================================== */

.mr-action-feature {

    display: flex;

    align-items: flex-start;

    gap: 10px;

    margin:
        0
        0
        13px;
}


.mr-action-feature-icon {

    width: 31px;

    height: 31px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #eaf5ff;

    border-radius: 50%;

    color: #0875f5;

    font-size: 17px;
}


.mr-action-feature h4 {

    margin: 0 0 2px !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1.25 !important;

    font-weight: 800 !important;
}


.mr-action-feature p {

    margin: 0 !important;

    padding: 0 !important;

    color: #66758c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 11px !important;

    line-height: 1.45 !important;

    font-weight: 400 !important;
}


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

.mr-action-buttons {

    display: flex;

    align-items: center;

    gap: 25px;

    margin-top: 17px;
}


.mr-action-pickup {

    min-height: 34px;

    padding:
        0
        14px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    background: #0875f5;

    color: #ffffff !important;

    border-radius: 4px;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


.mr-action-pickup span {

    font-size: 17px;

    line-height: 1;
}


.mr-action-direction {

    color: #0875f5 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 12px !important;

    line-height: 1.2 !important;

    font-weight: 700 !important;

    text-decoration: underline !important;
}


.mr-action-direction:hover {

    color: #005ddd !important;
}


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

@media (max-width: 900px) {

    .mr-store-action-section {

        padding:
            48px
            0
            40px;
    }


    .mr-store-action-inner {

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


    .mr-store-action-heading h2 {

        font-size: 36px !important;
    }


    .mr-store-action-heading p {

        font-size: 13px !important;
    }


    .mr-store-action-grid {

        grid-template-columns: 1fr;

        gap: 25px;
    }


    .mr-main-video {

        height: 320px;
    }

}


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

@media (max-width: 600px) {

    .mr-store-action-section {

        padding:
            42px
            0
            35px;
    }


    .mr-store-action-inner {

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


    .mr-store-action-heading {

        margin-bottom: 22px;
    }


    .mr-store-action-heading h2 {

        font-size: 31px !important;

        line-height: 1.18 !important;
    }


    .mr-store-action-heading p {

        font-size: 13px !important;
    }


    .mr-main-video {

        height: 270px;
    }


    .mr-store-action-content h3 {

        font-size: 22px !important;
    }


    .mr-action-description {

        font-size: 13px !important;
    }


    .mr-action-feature h4 {

        font-size: 13px !important;
    }


    .mr-action-feature p {

        font-size: 12px !important;
    }


    .mr-action-buttons {

        gap: 18px;
    }

}

/* =====================================================
   SECTION 5 — HOW IT WORKS
===================================================== */

.mr-care-section {

    width: 100%;

    margin: 0;

    padding:
        55px
        0
        45px;

    background:
        #f8fbff;

    position: relative;

    overflow: hidden;
}


/* =====================================================
   SOFT BACKGROUND SHAPES
===================================================== */

.mr-care-section::before {

    content: "";

    position: absolute;

    width: 360px;

    height: 360px;

    left: -210px;

    top: -90px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


.mr-care-section::after {

    content: "";

    position: absolute;

    width: 300px;

    height: 300px;

    right: -180px;

    bottom: -100px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


/* =====================================================
   INNER
===================================================== */

.mr-care-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    margin: 0 auto;

    position: relative;

    z-index: 2;
}


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

.mr-care-heading {

    text-align: center;

    margin:
        0
        0
        30px;
}


.mr-care-eyebrow {

    margin:
        0
        0
        9px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.mr-care-heading h2 {

    margin: 0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 36px !important;

    line-height: 1.15 !important;

    letter-spacing: -1px !important;

    font-weight: 900 !important;
}


.mr-care-heading h2 span {

    color: #07183c !important;

    font-size: inherit !important;

    font-weight: 900 !important;
}


.mr-care-heading p {

    margin:
        6px
        0
        0 !important;

    padding: 0 !important;

    color: #66758c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1.5 !important;

    font-weight: 400 !important;
}


/* =====================================================
   STEPS
===================================================== */

.mr-care-steps {

    display: grid;

    grid-template-columns:
        1fr
        24px
        1fr
        24px
        1fr;

    align-items: center;

    width: 100%;
}


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

.mr-care-step {

    min-height: 94px;

    padding:
        14px
        17px;

    box-sizing: border-box;

    background: #ffffff;

    border:
        1px solid
        #cfe2fa;

    border-radius: 6px;
}


.mr-care-number {

    margin:
        0
        5px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 13px;

    line-height: 1;

    font-weight: 800;
}


.mr-care-step h3 {

    margin:
        0
        5px;

    padding: 0;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 19px;

    line-height: 1.15;

    font-weight: 800;

    letter-spacing: -.2px;
}


.mr-care-step p {

    margin: 0 5px;

    padding: 0;

    color: #66758c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1.45;

    font-weight: 400;
}


/* =====================================================
   CONNECTOR
===================================================== */

.mr-care-connector {

    width: 100%;

    height: 1px;

    background: #0875f5;

    position: relative;
}


.mr-care-connector::after {

    content: "";

    position: absolute;

    width: 5px;

    height: 5px;

    right: -1px;

    top: 50%;

    transform:
        translateY(-50%);

    background: #0875f5;

    border-radius: 50%;
}


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

.mr-care-cta {

    width: 100%;

    min-height: 48px;

    margin-top: 23px;

    padding:
        0
        25px;

    box-sizing: border-box;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 18px;

    background: #071f4a;

    border-radius: 6px;
}


.mr-care-cta span {

    color: #ffffff;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 13px;

    line-height: 1;

    font-weight: 700;
}


.mr-care-cta-divider {

    width: 1px;

    height: 18px;

    background:
        rgba(
            255,
            255,
            255,
            .35
        );
}


.mr-care-cta-button {

    min-height: 28px;

    padding:
        0
        15px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    background: #0875f5;

    color: #ffffff !important;

    border-radius: 4px;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 11px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


.mr-care-cta-button:hover {

    background: #0567dc;

    color: #ffffff !important;
}


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

@media (max-width: 900px) {

    .mr-care-section {

        padding:
            48px
            0
            40px;
    }


    .mr-care-inner {

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


    .mr-care-heading h2 {

        font-size: 34px !important;
    }


    .mr-care-steps {

        grid-template-columns:
            1fr;
            
        gap: 10px;
    }


    .mr-care-connector {

        display: none;
    }

}


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

@media (max-width: 600px) {

    .mr-care-section {

        padding:
            42px
            0
            35px;
    }


    .mr-care-inner {

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


    .mr-care-heading {

        margin-bottom: 22px;
    }


    .mr-care-heading h2 {

        font-size: 30px !important;

        line-height: 1.18 !important;
    }


    .mr-care-heading p {

        font-size: 12px !important;
    }


    .mr-care-step {

        min-height: 105px;

        padding:
            15px
            16px;
    }


    .mr-care-step h3 {

        font-size: 20px;
    }


    .mr-care-step p {

        font-size: 12px;
    }


    .mr-care-cta {

        flex-wrap: wrap;

        gap: 12px;

        padding:
            12px
            15px;
    }


    .mr-care-cta-divider {

        display: none;
    }

}
/* =====================================================
   SECTION 6 — SERVICE PRICING
===================================================== */

.mr-pricing-section {

    width: 100%;

    margin: 0;

    padding:
        48px
        0
        38px;

    background:
        #f8fbff;

    position: relative;

    overflow: hidden;
}


/* =====================================================
   BACKGROUND SHAPES
===================================================== */

.mr-pricing-section::before {

    content: "";

    position: absolute;

    width: 390px;

    height: 390px;

    left: -245px;

    top: 30px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


.mr-pricing-section::after {

    content: "";

    position: absolute;

    width: 360px;

    height: 360px;

    right: -190px;

    top: -170px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


/* =====================================================
   INNER
===================================================== */

.mr-pricing-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    margin: 0 auto;

    position: relative;

    z-index: 2;
}


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

.mr-pricing-heading {

    text-align: center;

    margin:
        0
        0
        25px;
}


.mr-pricing-eyebrow {

    margin:
        0
        0
        9px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.mr-pricing-heading h2 {

    margin: 0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 35px !important;

    line-height: 1.15 !important;

    letter-spacing: -1px !important;

    font-weight: 900 !important;
}


.mr-pricing-heading h2 span {

    color: #07183c !important;

    font-size: inherit !important;

    line-height: inherit !important;

    font-weight: 900 !important;
}


.mr-pricing-heading p {

    margin:
        5px
        0
        0 !important;

    padding: 0 !important;

    color: #66758c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 12px !important;

    line-height: 1.5 !important;

    font-weight: 400 !important;
}


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

.mr-pricing-grid {

    display: grid;

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

    gap:
        10px;

    width: 100%;
}


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

.mr-price-card {

    min-height: 87px;

    padding:
        12px
        15px
        10px;

    box-sizing: border-box;

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

    border:
        1px solid
        #e0ebf8;

    border-radius: 6px;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;
}


.mr-price-card h3 {

    margin:
        0
        4px;

    padding: 0;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 17px;

    line-height: 1.15;

    font-weight: 800;

    letter-spacing: -.2px;
}


.mr-price-card p {

    margin:
        0
        4px;

    padding: 0;

    color: #66758c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1.35;

    font-weight: 400;
}


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

.mr-price {

    margin:
        auto
        4px
        0;

    display: flex;

    align-items: baseline;

    gap: 3px;
}


.mr-price-from {

    color: #66758c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 11px;

    font-weight: 400;
}


.mr-price strong {

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 25px;

    line-height: 1;

    font-weight: 900;

    letter-spacing: -.5px;
}


.mr-price-unit {

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    font-weight: 700;
}


/* =====================================================
   NOTE
===================================================== */

.mr-pricing-note {

    margin:
        9px
        0
        8px;

    text-align: center;

    color: #748299;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1.4;

    font-weight: 400;
}


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

.mr-pricing-cta {

    width: 100%;

    min-height: 34px;

    padding:
        0
        18px;

    box-sizing: border-box;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 18px;

    background:
        #dff1ff;

    border-radius: 6px;
}


.mr-pricing-cta span {

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1;

    font-weight: 700;
}


.mr-pricing-quote-btn {

    min-height: 24px;

    padding:
        0
        14px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    background: #0875f5;

    color: #ffffff !important;

    border-radius: 5px;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;

    white-space: nowrap;
}


.mr-pricing-quote-btn:hover {

    background: #0567dc;

    color: #ffffff !important;
}


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

@media (max-width: 900px) {

    .mr-pricing-section {

        padding:
            45px
            0
            35px;
    }


    .mr-pricing-inner {

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


    .mr-pricing-heading h2 {

        font-size: 32px !important;
    }


    .mr-pricing-grid {

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

}


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

@media (max-width: 600px) {

    .mr-pricing-section {

        padding:
            40px
            0
            32px;
    }


    .mr-pricing-inner {

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


    .mr-pricing-heading {

        margin-bottom: 22px;
    }


    .mr-pricing-heading h2 {

        font-size: 29px !important;

        line-height: 1.18 !important;
    }


    .mr-pricing-heading p {

        font-size: 12px !important;
    }


    .mr-pricing-grid {

        grid-template-columns: 1fr;

        gap: 8px;
    }


    .mr-price-card {

        min-height: 100px;

        padding:
            14px
            15px
            12px;
    }


    .mr-price-card h3 {

        font-size: 19px;
    }


    .mr-price-card p {

        font-size: 11px;
    }


    .mr-price strong {

        font-size: 26px;
    }


    .mr-pricing-cta {

        flex-direction: column;

        gap: 8px;

        padding:
            12px
            15px;
    }


    .mr-pricing-cta span {

        font-size: 12px;

        text-align: center;

        line-height: 1.3;
    }

}
/* =====================================================
   SECTION 7 — CUSTOMER REVIEWS
===================================================== */

.mr-reviews-section {

    width: 100%;

    margin: 0;

    padding:
        48px
        0
        42px;

    background:
        linear-gradient(
            135deg,
            #f8fbff 0%,
            #ffffff 55%,
            #edf7ff 100%
        );

    position: relative;

    overflow: hidden;
}


/* =====================================================
   BACKGROUND SHAPES
===================================================== */

.mr-reviews-section::before {

    content: "";

    position: absolute;

    width: 430px;

    height: 430px;

    left: -270px;

    bottom: -250px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


.mr-reviews-section::after {

    content: "";

    position: absolute;

    width: 390px;

    height: 390px;

    right: -220px;

    top: -250px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


/* =====================================================
   INNER
===================================================== */

.mr-reviews-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    margin: 0 auto;

    display: grid;

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

    gap: 20px;

    align-items: center;

    position: relative;

    z-index: 2;
}


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

.mr-google-card {

    min-height: 245px;

    padding:
        14px
        12px;

    box-sizing: border-box;

    background: #ffffff;

    border:
        1px solid
        #dbeafa;

    border-radius: 6px;

    box-shadow:
        0
        4px
        15px
        rgba(
            20,
            80,
            150,
            .05
        );

    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;
}


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

.mr-google-logo img {
    width: 78px;
    height: 40px;
    display: block;
}


.mr-google-card h3 {

    margin:
        0
        10px;

    padding: 0;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 19px;

    line-height: 1.1;

    font-weight: 800;

    letter-spacing: -.3px;
}


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

.mr-google-rating-box {

    width: 100%;

    min-height: 27px;

    padding:
        0
        5px;

    box-sizing: border-box;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #f1f7ff;

    border-radius: 4px;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 11px;

    line-height: 1;

    font-weight: 600;
}


.mr-google-stars {

    margin:
        8px
        0
        3px;

    color: #8ba5c3;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 20px;

    line-height: 1;

    letter-spacing: 1px;
}


.mr-google-verified {

    color: #7b8ba1;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1.2;
}


/* =====================================================
   GOOGLE BUTTON
===================================================== */

.mr-google-button {

    width: 100%;

    min-height: 27px;

    margin:
        10px
        0
        9px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 5px;

    background: #0875f5;

    color: #ffffff !important;

    border-radius: 15px;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


.mr-google-button span {

    font-size: 13px;

    line-height: 1;
}


.mr-google-button:hover {

    background: #0567dc;

    color: #ffffff !important;
}


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

.mr-google-badge {

    width: 100%;

    min-height: 25px;

    margin-top: auto;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #eef7ff;

    border-radius: 4px;

    color: #8192a8;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1.2;
}


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

.mr-customer-reviews {

    min-width: 0;
}


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

.mr-reviews-heading {

    margin:
        0
        0
        13px;
}


.mr-reviews-eyebrow {

    margin:
        0
        0
        7px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.mr-reviews-heading h2 {

    margin: 0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 26px !important;

    line-height: 1.15 !important;

    letter-spacing: -.7px !important;

    font-weight: 900 !important;
}


.mr-reviews-heading h2 span {

    color: #07183c !important;

    font-size: inherit !important;

    font-weight: 900 !important;
}


.mr-reviews-heading p {

    margin:
        5px
        0
        0 !important;

    padding: 0 !important;

    color: #66758c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 12px !important;

    line-height: 1.4 !important;

    font-weight: 400 !important;
}


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

.mr-review-grid {

    display: grid;

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

    gap: 10px;
}


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

.mr-review-card {

    min-height: 123px;

    padding:
        13px
        15px;

    box-sizing: border-box;

    background: #ffffff;

    border:
        1px solid
        #dbeafa;

    border-radius: 6px;

    position: relative;

    display: flex;

    flex-direction: column;
}


.mr-review-quote {

    color: #83c4ff;

    font-family:
        Georgia,
        serif;

    font-size: 42px;

    line-height: .65;

    font-weight: 700;
}


.mr-review-text {

    margin-top: 7px;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1.4;

    font-weight: 400;
}


.mr-review-quote-end {

    align-self: flex-end;

    margin-top: auto;

    color: #83c4ff;

    font-family:
        Georgia,
        serif;

    font-size: 41px;

    line-height: .5;

    font-weight: 700;
}


/* =====================================================
   AUTHOR
===================================================== */

.mr-review-author {

    margin-top: 9px;

    display: flex;

    flex-direction: column;

    gap: 2px;
}


.mr-review-author strong {

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1.2;

    font-weight: 700;
}


.mr-review-author span {

    color: #8a9ab0;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1.2;

    font-weight: 400;
}


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

@media (max-width: 900px) {

    .mr-reviews-section {

        padding:
            45px
            0
            38px;
    }


    .mr-reviews-inner {

        width:
            calc(100% - 40px);

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

        gap: 16px;
    }


    .mr-reviews-heading h2 {

        font-size: 24px !important;
    }

}


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

@media (max-width: 600px) {

    .mr-reviews-section {

        padding:
            40px
            0
            32px;
    }


    .mr-reviews-inner {

        width:
            calc(100% - 30px);

        grid-template-columns: 1fr;

        gap: 22px;
    }


    .mr-google-card {

        width: 210px;

        margin: 0 auto;
    }


    .mr-reviews-heading {

        text-align: center;
    }


    .mr-reviews-heading h2 {

        font-size: 28px !important;

        line-height: 1.18 !important;
    }


    .mr-reviews-heading p {

        font-size: 12px !important;
    }


    .mr-review-grid {

        grid-template-columns: 1fr;

        gap: 8px;
    }


    .mr-review-card {

        min-height: 125px;
    }

}
/* =====================================================
   SECTION 8 — AREAS WE SERVE
===================================================== */

.mr-coverage-section {

    width: 100%;

    margin: 0;

    padding:
        48px
        0
        42px;

    background:
        #f8fbff;

    position: relative;

    overflow: hidden;
}


/* =====================================================
   BACKGROUND SHAPES
===================================================== */

.mr-coverage-section::before {

    content: "";

    position: absolute;

    width: 390px;

    height: 390px;

    left: -280px;

    bottom: -270px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


.mr-coverage-section::after {

    content: "";

    position: absolute;

    width: 350px;

    height: 350px;

    right: -210px;

    top: -250px;

    border:
        1px solid
        #dcecff;

    border-radius: 50%;

    opacity: .8;
}


/* =====================================================
   INNER
===================================================== */

.mr-coverage-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        1fr
        1.08fr;

    gap: 35px;

    align-items: center;

    position: relative;

    z-index: 2;
}


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

.mr-coverage-content {

    min-width: 0;
}


.mr-coverage-eyebrow {

    margin:
        0
        10px;

    display: flex;

    align-items: center;

    gap: 12px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.mr-coverage-eyebrow::after {

    content: "";

    width: 60px;

    height: 1px;

    background: #0875f5;

    opacity: .8;
}


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

.mr-coverage-content h2 {

    margin: 0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 41px !important;

    line-height: 1.02 !important;

    letter-spacing: -1.3px !important;

    font-weight: 900 !important;
}


.mr-coverage-content h2 span {

    display: block;

    color: #07183c !important;

    font-size: inherit !important;

    line-height: inherit !important;

    font-weight: 900 !important;
}


.mr-coverage-content h2 b {

    color: #07183c !important;

    font-weight: 900 !important;
}


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

.mr-coverage-description {

    max-width: 320px;

    margin:
        12px
        0
        14px;

    color: #66758c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1.5;

    font-weight: 400;
}


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

.mr-coverage-areas {

    width: 100%;

    max-width: 310px;

    display: grid;

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

    gap: 7px;
}


.mr-area-button {

    min-height: 30px;

    padding:
        0
        10px;

    box-sizing: border-box;

    display: flex;

    align-items: center;

    gap: 7px;

    background: #ffffff;

    border:
        1px solid
        #dbe8f6;

    border-radius: 5px;

    color: #526782;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 600;

    text-align: left;

    cursor: pointer;
}


.mr-area-button i {

    color: #8ba0b9;

    font-size: 12px;
}


.mr-area-button.active {

    background: #f4f9ff;

    border-color: #0875f5;

    color: #07183c;
}


.mr-area-button.active i {

    color: #0875f5;
}


.mr-area-button:hover {

    border-color: #0875f5;

    color: #07183c;
}


/* =====================================================
   NOTE
===================================================== */

.mr-coverage-note {

    margin-top: 13px;

    display: flex;

    align-items: center;

    gap: 7px;

    color: #748299;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1.4;
}


.mr-coverage-info {

    width: 14px;

    height: 14px;

    flex: 0 0 14px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #dcecff;

    color: #0875f5;

    border-radius: 50%;

    font-size: 10px;

    font-weight: 700;
}


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

.mr-coverage-map {

    width: 100%;

    min-height: 255px;

    padding:
        10px;

    box-sizing: border-box;

    background: #ffffff;

    border:
        1px solid
        #dbe8f6;

    border-radius: 9px;

    box-shadow:
        0
        5px
        18px
        rgba(
            30,
            100,
            180,
            .05
        );
}


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

.mr-map-header {

    height: 27px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding:
        0
        3px;
}


.mr-map-brand {

    display: flex;

    align-items: center;

    gap: 6px;

    color: #526782;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 13px;

    font-weight: 600;
}


.mr-google-g {

    font-size: 22px;

    line-height: 1;

    font-weight: 900;

    color: #4285f4;
}


.mr-map-preview {

    padding:
        4px
        7px;

    background: #edf5ff;

    border-radius: 8px;

    color: #7190b1;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 7px;

    line-height: 1;

    white-space: nowrap;
}


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

.mr-map-area {

    height: 205px;

    position: relative;

    overflow: hidden;

    background:
        #eaf3fb;

    border-radius: 6px;
}


/* =====================================================
   FAKE MAP BACKGROUND
===================================================== */

.mr-map-area::before {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            35deg,
            transparent 0 43%,
            #d2e1ef 43% 44%,
            transparent 44% 100%
        ),
        linear-gradient(
            150deg,
            transparent 0 54%,
            #d7e5f1 54% 55%,
            transparent 55% 100%
        ),
        linear-gradient(
            90deg,
            transparent 0 35%,
            #d5e4f0 35% 36%,
            transparent 36% 67%,
            #d5e4f0 67% 68%,
            transparent 68%
        ),
        #e9f2f9;
}


/* MAP ROADS */

.mr-map-road {

    position: absolute;

    background: #ffffff;

    opacity: .85;

    transform-origin: center;
}


.road-one {

    width: 140%;

    height: 9px;

    left: -20%;

    top: 40%;

    transform: rotate(-16deg);
}


.road-two {

    width: 130%;

    height: 6px;

    left: -15%;

    top: 67%;

    transform: rotate(23deg);
}


.road-three {

    width: 8px;

    height: 130%;

    left: 52%;

    top: -15%;

    transform: rotate(19deg);
}


/* MAP LABELS */

.mr-map-label {

    position: absolute;

    color: #66829d;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 7px;

    font-weight: 700;
}


.map-label-one {

    left: 32%;

    top: 20%;
}


.map-label-two {

    right: 14%;

    top: 30%;
}


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

.mr-map-pin {

    position: absolute;

    left: 50%;

    top: 38%;

    transform:
        translate(
            -50%,
            -50%
        );

    display: flex;

    flex-direction: column;

    align-items: center;
}


.mr-map-pin i {

    color: #0875f5;

    font-size: 28px;

    filter:
        drop-shadow(
            0
            2px
            3px
            rgba(
                0,
                80,
                180,
                .18
            )
        );
}


.mr-map-pin span {

    margin-top: -2px;

    padding:
        3px
        7px;

    background: #ffffff;

    border-radius: 3px;

    color: #526782;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 7px;

    font-weight: 700;

    box-shadow:
        0
        2px
        6px
        rgba(
            0,
            0,
            0,
            .08
        );
}


/* =====================================================
   STORE INFO CARD
===================================================== */

.mr-map-store-card {

    position: absolute;

    left: 10px;

    right: 10px;

    bottom: 10px;

    min-height: 60px;

    padding:
        7px;

    box-sizing: border-box;

    display: flex;

    align-items: center;

    gap: 8px;

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

    border-radius: 7px;

    box-shadow:
        0
        4px
        12px
        rgba(
            30,
            80,
            130,
            .12
        );
}


.mr-map-store-image {

    width: 48px;

    height: 42px;

    flex: 0 0 48px;

    overflow: hidden;

    border-radius: 3px;
}


.mr-map-store-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;
}


.mr-map-store-info {

    min-width: 0;

    flex: 1;

    position: relative;

    padding-right: 92px;
}


.mr-map-store-info strong {

    display: block;

    margin-bottom: 3px;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 13px;

    line-height: 1.1;

    font-weight: 800;
}


.mr-map-address {

    display: block;

    max-width: 150px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    color: #7a8da5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1.2;
}


.mr-map-address i {

    color: #8ba0b9;

    margin-right: 3px;
}


/* =====================================================
   DIRECTIONS BUTTON
===================================================== */

.mr-map-directions {

    position: absolute;

    right: 0;

    top: 0;

    min-height: 24px;

    padding:
        0
        10px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 4px;

    background: #0875f5;

    color: #ffffff !important;

    border-radius: 4px;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 8px !important;

    line-height: 1 !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


.mr-map-directions:hover {

    background: #0567dc;

    color: #ffffff !important;
}


/* =====================================================
   STORE PROFILE
===================================================== */

.mr-map-profile {

    position: absolute;

    right: 0;

    bottom: -17px;

    color: #0875f5 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 7px !important;

    line-height: 1 !important;

    font-weight: 600 !important;

    text-decoration: none !important;
}


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

@media (max-width: 900px) {

    .mr-coverage-section {

        padding:
            45px
            0
            38px;
    }


    .mr-coverage-inner {

        width:
            calc(100% - 40px);

        grid-template-columns:
            1fr;

        gap: 25px;
    }


    .mr-coverage-content {

        max-width: 500px;

        margin: 0 auto;

        width: 100%;
    }


    .mr-coverage-map {

        max-width: 650px;

        margin: 0 auto;
    }

}


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

@media (max-width: 600px) {

    .mr-coverage-section {

        padding:
            40px
            0
            32px;
    }


    .mr-coverage-inner {

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


    .mr-coverage-content h2 {

        font-size: 34px !important;

        line-height: 1.08 !important;
    }


    .mr-coverage-description {

        font-size: 12px;

        max-width: 100%;
    }


    .mr-coverage-areas {

        max-width: 100%;
    }


    .mr-coverage-note {

        align-items: flex-start;

        font-size: 8px;
    }


    .mr-coverage-map {

        padding: 7px;

        min-height: 240px;
    }


    .mr-map-area {

        height: 195px;
    }


    .mr-map-store-info {

        padding-right: 82px;
    }


    .mr-map-directions {

        padding:
            0
            7px;

        font-size: 7px !important;
    }

}
/* =====================================================
   SECTION 9 — FAQ
===================================================== */

.mr-faq-section {

    width: 100%;

    margin: 0;

    padding:
        42px
        0
        42px;

    background: #ffffff;

    overflow: hidden;
}


/* =====================================================
   MAIN BACKGROUND
   SINGLE BACKGROUND — NO LEFT BOX
===================================================== */

.mr-faq-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    min-height: 330px;

    margin: 0 auto;

    position: relative;

    display: grid;

    grid-template-columns:
        34%
        66%;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 5% 100%,
            #eef7ff 0,
            #eef7ff 22%,
            transparent 23%
        ),
        radial-gradient(
            circle at 18% 38%,
            #edf6ff 0,
            #edf6ff 31%,
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #fafdff 0%,
            #ffffff 55%,
            #f5faff 100%
        );
}


/* =====================================================
   LARGE CURVED BACKGROUND SHAPE
===================================================== */

.mr-faq-inner::before {

    content: "";

    position: absolute;

    width: 520px;

    height: 520px;

    left: -250px;

    top: -85px;

    border-radius: 50%;

    background:
        #edf7ff;

    opacity: .95;

    z-index: 0;
}


/* =====================================================
   TOP RIGHT CURVE
===================================================== */

.mr-faq-inner::after {

    content: "";

    position: absolute;

    width: 270px;

    height: 270px;

    right: -170px;

    top: -155px;

    border-radius: 50%;

    background:
        #eaf5ff;

    z-index: 0;
}


/* =====================================================
   LEFT CONTENT
   TRANSPARENT — NO BOX
===================================================== */

.mr-faq-left {

    position: relative;

    z-index: 2;

    padding:
        75px
        25px
        45px
        42px;

    box-sizing: border-box;

    background: transparent;
}


/* REMOVE OLD BOX/CURVES */

.mr-faq-left::before,
.mr-faq-left::after {

    display: none;
}


/* =====================================================
   EYEBROW
===================================================== */

.mr-faq-eyebrow {

    margin:
        0
        0
        12px;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 1.8px;

    text-transform: uppercase;
}


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

.mr-faq-left h2 {

    margin: 0 !important;

    padding: 0 !important;

    color: #07183c !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 35px !important;

    line-height: 1.02 !important;

    letter-spacing: -1px !important;

    font-weight: 900 !important;
}


.mr-faq-left h2 span {

    display: block;

    color: #07183c !important;

    font-size: inherit !important;

    line-height: inherit !important;

    font-weight: 900 !important;
}


.mr-faq-left h2 b {

    font-weight: 900 !important;
}


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

.mr-faq-left p {

    max-width: 210px;

    margin:
        12px
        0
        19px;

    color: #66758c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1.45;

    font-weight: 400;
}


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

.mr-faq-contact {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #0875f5 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 10px !important;

    line-height: 1 !important;

    font-weight: 600 !important;

    text-decoration:
        underline !important;

    text-underline-offset: 3px;
}


.mr-faq-contact span {

    font-size: 18px;

    line-height: 8px;

    text-decoration: none;
}


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

.mr-faq-list {

    position: relative;

    z-index: 2;

    padding:
        42px
        38px
        38px
        22px;

    box-sizing: border-box;

    display: flex;

    flex-direction: column;

    gap: 6px;

    background: transparent;
}


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

.mr-faq-item {

    width: 100%;

    background: #ffffff;

    border:
        1px solid
        #cfe1f5;

    border-radius: 5px;

    overflow: hidden;

    box-sizing: border-box;
}


/* =====================================================
   QUESTION
===================================================== */

.mr-faq-question {

    width: 100%;

    min-height: 38px;

    padding:
        0
        14px;

    border: 0;

    outline: none;

    background: #ffffff;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    color: #07183c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 11px;

    line-height: 1.3;

    font-weight: 700;

    text-align: left;

    cursor: pointer;
}


.mr-faq-question:hover {

    background: #ffffff;
}


/* =====================================================
   PLUS / MINUS
===================================================== */

.mr-faq-icon {

    flex: 0 0 auto;

    color: #0875f5;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 18px;

    line-height: 1;

    font-weight: 400;
}


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

.mr-faq-item.active
.mr-faq-question {

    background:
        #eaf4ff;
}


/* =====================================================
   ANSWER
===================================================== */

.mr-faq-answer {

    display: none;

    padding:
        0
        14px
        12px;

    background:
        #eaf4ff;
}


.mr-faq-answer p {

    margin: 0;

    color: #66758c;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 10px;

    line-height: 1.45;

    font-weight: 400;
}


.mr-faq-item.active
.mr-faq-answer {

    display: block;
}


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

@media (max-width: 900px) {

    .mr-faq-inner {

        width:
            calc(100% - 40px);

        grid-template-columns:
            1fr;
    }


    .mr-faq-left {

        padding:
            55px
            35px
            35px;
    }


    .mr-faq-list {

        padding:
            10px
            30px
            35px;
    }

}


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

@media (max-width: 600px) {

    .mr-faq-section {

        padding:
            35px
            0
            30px;
    }


    .mr-faq-inner {

        width:
            calc(100% - 30px);

        grid-template-columns:
            1fr;
    }


    .mr-faq-left {

        padding:
            45px
            25px
            25px;
    }


    .mr-faq-left h2 {

        font-size: 32px !important;
    }


    .mr-faq-list {

        padding:
            5px
            15px
            25px;
    }


    .mr-faq-question {

        min-height: 42px;

        padding:
            0
            12px;

        font-size: 11px;
    }


    .mr-faq-answer {

        padding:
            0
            12px
            12px;
    }

}
/* =====================================================
   SECTION 10 — FINAL CTA
===================================================== */

.mr-final-cta {

    width: 100%;

    margin: 0;

    padding:
        28px
        0
        28px;

    background: #ffffff;

    box-sizing: border-box;
}


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

.mr-final-cta-inner {

    width:
        min(
            1180px,
            calc(100% - 60px)
        );

    min-height: 155px;

    margin: 0 auto;

    padding:
        18px
        30px
        20px;

    box-sizing: border-box;

    position: relative;

    overflow: hidden;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    border-radius: 9px;

    background:
        linear-gradient(
            120deg,
            #0754d9 0%,
            #0875f5 48%,
            #1766e8 100%
        );

    box-shadow:
        0
        5px
        14px
        rgba(7, 83, 210, 0.22);
}


/* =====================================================
   LEFT CURVED SHAPE
===================================================== */

.mr-final-cta-inner::before {

    content: "";

    position: absolute;

    width: 500px;

    height: 250px;

    left: -245px;

    bottom: -165px;

    border-radius: 50%;

    background:
        rgba(0, 42, 145, 0.45);

    transform: rotate(15deg);

    pointer-events: none;
}


/* =====================================================
   RIGHT CURVED SHAPE
===================================================== */

.mr-final-cta-inner::after {

    content: "";

    position: absolute;

    width: 430px;

    height: 220px;

    right: -220px;

    bottom: -150px;

    border-radius: 50%;

    background:
        rgba(0, 53, 170, 0.35);

    transform: rotate(-12deg);

    pointer-events: none;
}


/* =====================================================
   EYEBROW
===================================================== */

.mr-final-cta-eyebrow {

    position: relative;

    z-index: 2;

    margin: 0;

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

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}


/* =====================================================
   SMALL LINE
===================================================== */

.mr-final-cta-line {

    position: relative;

    z-index: 2;

    width: 20px;

    height: 1px;

    margin:
        7px
        0
        5px;

    background:
        rgba(255,255,255,0.7);
}


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

.mr-final-cta h2 {

    position: relative;

    z-index: 2;

    margin:
        0
        0
        5px !important;

    padding: 0 !important;

    color: #ffffff !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size: 30px !important;

    line-height: 1.12 !important;

    letter-spacing: -0.5px !important;

    font-weight: 900 !important;
}


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

.mr-final-cta p {

    position: relative;

    z-index: 2;

    margin:
        0
        0
        12px;

    padding: 0;

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

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1.4;

    font-weight: 400;
}


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

.mr-final-cta-buttons {

    position: relative;

    z-index: 3;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;
}


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

.mr-final-btn {

    min-width: 105px;

    height: 29px;

    padding:
        0
        15px;

    box-sizing: border-box;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 5px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 11px;

    line-height: 1;

    font-weight: 700;

    text-decoration: none !important;

    transition:
        all
        .2s
        ease;
}


/* =====================================================
   BOOK A SERVICE
===================================================== */

.mr-final-btn-primary {

    color: #075bdc !important;

    background: #ffffff;

    border:
        1px solid
        #ffffff;
}


.mr-final-btn-primary:hover {

    color: #075bdc !important;

    background: #f2f7ff;
}


/* =====================================================
   CALL STORE
===================================================== */

.mr-final-btn-secondary {

    color: #ffffff !important;

    background: transparent;

    border:
        1px solid
        rgba(255,255,255,0.85);
}


.mr-final-btn-secondary:hover {

    color: #ffffff !important;

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


/* =====================================================
   GET DIRECTIONS
===================================================== */

.mr-final-btn-link {

    min-width: auto;

    padding:
        0
        5px;

    color: #ffffff !important;

    background: transparent;

    border: 0;

    text-decoration:
        underline !important;

    text-underline-offset: 3px;
}


.mr-final-btn-link:hover {

    color: #ffffff !important;

    opacity: .85;
}


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

@media (max-width: 900px) {

    .mr-final-cta {

        padding:
            25px
            0;
    }


    .mr-final-cta-inner {

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


    .mr-final-cta h2 {

        font-size: 28px !important;
    }

}


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

@media (max-width: 600px) {

    .mr-final-cta {

        padding:
            20px
            0;
    }


    .mr-final-cta-inner {

        width:
            calc(100% - 30px);

        min-height: 180px;

        padding:
            22px
            15px;
    }


    .mr-final-cta h2 {

        font-size: 25px !important;

        line-height: 1.15 !important;
    }


    .mr-final-cta p {

        font-size: 11px;

        max-width: 280px;
    }


    .mr-final-cta-buttons {

        flex-wrap: wrap;

        gap: 8px;
    }


    .mr-final-btn {

        min-width: 100px;

        height: 30px;

        font-size: 11px;
    }

}
/* =====================================================
   GLOBAL PARAGRAPH FONT SIZE — ONLY FONT SIZE CHANGED
   ===================================================== */

html body .mr-detail-page p {
    font-size: 16px !important;
}


/* =====================================================
   STORE DETAIL — FULL BLEED BACKGROUNDS ONLY
   IMPORTANT:
   - Keep all existing content widths/design unchanged
   - Make only the Elementor widget/page background full width
   - Inner content remains centered at 1180px
===================================================== */

/* Escape Elementor's boxed content area */
html body .elementor-widget-html:has(.mr-detail-page) {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* Make the Elementor widget container full width */
html body .elementor-widget-html:has(.mr-detail-page) .elementor-widget-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Main page itself fills the full-width widget */
html body .mr-detail-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Background/outer sections stay full width */
html body .mr-detail-page .mr-store-header,
html body .mr-detail-page .mr-store-hero,
html body .mr-detail-page .mr-store-details,
html body .mr-detail-page .mr-services-section,
html body .mr-detail-page .mr-store-action-section,
html body .mr-detail-page .mr-care-section,
html body .mr-detail-page .mr-pricing-section,
html body .mr-detail-page .mr-reviews-section,
html body .mr-detail-page .mr-coverage-section,
html body .mr-detail-page .mr-faq-section,
html body .mr-detail-page .mr-final-cta {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

/* Keep the actual content centered — DO NOT stretch it */
html body .mr-detail-page .mr-store-header-inner,
html body .mr-detail-page .mr-store-hero-inner,
html body .mr-detail-page .mr-store-details-inner,
html body .mr-detail-page .mr-services-inner,
html body .mr-detail-page .mr-store-action-inner,
html body .mr-detail-page .mr-care-inner,
html body .mr-detail-page .mr-pricing-inner,
html body .mr-detail-page .mr-reviews-inner,
html body .mr-detail-page .mr-coverage-inner,
html body .mr-detail-page .mr-faq-inner,
html body .mr-detail-page .mr-final-cta-inner {
    width: min(1180px, calc(100% - 60px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* Tablet */
@media (max-width: 900px) {
    html body .mr-detail-page .mr-store-header-inner,
    html body .mr-detail-page .mr-store-hero-inner,
    html body .mr-detail-page .mr-store-details-inner,
    html body .mr-detail-page .mr-services-inner,
    html body .mr-detail-page .mr-store-action-inner,
    html body .mr-detail-page .mr-care-inner,
    html body .mr-detail-page .mr-pricing-inner,
    html body .mr-detail-page .mr-reviews-inner,
    html body .mr-detail-page .mr-coverage-inner,
    html body .mr-detail-page .mr-faq-inner,
    html body .mr-detail-page .mr-final-cta-inner {
        width: calc(100% - 40px) !important;
        max-width: 1180px !important;
    }
}

/* Mobile */
@media (max-width: 768px) {
    html body .mr-detail-page .mr-store-header-inner,
    html body .mr-detail-page .mr-hero-inner,
    html body .mr-detail-page .mr-store-details-inner,
    html body .mr-detail-page .mr-services-inner,
    html body .mr-detail-page .mr-store-action-inner,
    html body .mr-detail-page .mr-care-inner,
    html body .mr-detail-page .mr-pricing-inner,
    html body .mr-detail-page .mr-reviews-inner,
    html body .mr-detail-page .mr-coverage-inner,
    html body .mr-detail-page .mr-faq-inner,
    html body .mr-detail-page .mr-final-cta-inner {
        width: calc(100% - 30px) !important;
        max-width: 1180px !important;
    }
}


/* =========================================================
   MR BLUE STORE DETAIL - FINAL FULL WIDTH FIX
   HERO + FAQ
   Existing content/layout/design preserved
========================================================= */


/* =========================================================
   1. ELEMENTOR HTML WIDGET
   Break the Store Detail HTML out of Elementor's centered
   content width so full-width section backgrounds can work.
========================================================= */

html body .elementor-widget-html:has(.mr-detail-page) {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

html body .elementor-widget-html:has(.mr-detail-page)
.elementor-widget-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}


/* =========================================================
   2. MAIN STORE DETAIL PAGE
========================================================= */

html body .mr-detail-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}


/* =========================================================
   3. ALL OUTER SECTIONS FULL WIDTH
========================================================= */

html body .mr-detail-page .mr-store-header,
html body .mr-detail-page .mr-store-hero,
html body .mr-detail-page .mr-store-details,
html body .mr-detail-page .mr-services-section,
html body .mr-detail-page .mr-store-action-section,
html body .mr-detail-page .mr-care-section,
html body .mr-detail-page .mr-pricing-section,
html body .mr-detail-page .mr-reviews-section,
html body .mr-detail-page .mr-coverage-section,
html body .mr-detail-page .mr-faq-section,
html body .mr-detail-page .mr-final-cta {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}


/* =========================================================
   4. NORMAL INNER CONTENT WIDTH
   Content remains centered at 1180px.
========================================================= */

html body .mr-detail-page .mr-store-header-inner,
html body .mr-detail-page .mr-store-hero-inner,
html body .mr-detail-page .mr-store-details-inner,
html body .mr-detail-page .mr-services-inner,
html body .mr-detail-page .mr-store-action-inner,
html body .mr-detail-page .mr-care-inner,
html body .mr-detail-page .mr-pricing-inner,
html body .mr-detail-page .mr-reviews-inner,
html body .mr-detail-page .mr-coverage-inner,
html body .mr-detail-page .mr-final-cta-inner {
    width: min(1180px, calc(100% - 60px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}


/* =========================================================
   5. HERO / BANNER FULL WIDTH
   The entire banner gets the same light-blue background
   as the image-side frame.
========================================================= */

html body .mr-detail-page .mr-store-hero {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;
    padding: 0 !important;
    background: #dff0ff !important;
    box-sizing: border-box !important;
}

html body .mr-detail-page .mr-store-hero-inner {
    width: min(1180px, calc(100% - 60px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    background: #dff0ff !important;
    box-sizing: border-box !important;
}

html body .mr-detail-page .mr-store-hero-content {
    background: #dff0ff !important;
}

html body .mr-detail-page .mr-store-hero-image {
    background: #dff0ff !important;
}


/* =========================================================
   6. FAQ FULL WIDTH BACKGROUND
   IMPORTANT:
   Background is on the OUTER section.
   The inner FAQ box is transparent.
========================================================= */

html body .mr-detail-page .mr-faq-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;

    background:
        radial-gradient(
            circle at 5% 100%,
            #eef7ff 0,
            #eef7ff 22%,
            transparent 23%
        ),
        radial-gradient(
            circle at 18% 38%,
            #edf6ff 0,
            #edf6ff 31%,
            transparent 32%
        ),
        linear-gradient(
            90deg,
            #edf7ff 0%,
            #ffffff 55%,
            #f5faff 100%
        ) !important;
}


/* FAQ content stays centered */
html body .mr-detail-page .mr-faq-inner {
    width: min(1180px, calc(100% - 60px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;

    /* Do NOT create a separate rectangular background */
    background: transparent !important;

    box-sizing: border-box !important;
}


/* Keep FAQ content above decorative shapes */
html body .mr-detail-page .mr-faq-left,
html body .mr-detail-page .mr-faq-right {
    position: relative !important;
    z-index: 2 !important;
}


/* =========================================================
   7. FINAL CTA FULL WIDTH
========================================================= */

html body .mr-detail-page .mr-final-cta {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}


/* =========================================================
   8. TABLET
========================================================= */

@media (max-width: 900px) {

    html body .mr-detail-page .mr-store-header-inner,
    html body .mr-detail-page .mr-store-hero-inner,
    html body .mr-detail-page .mr-store-details-inner,
    html body .mr-detail-page .mr-services-inner,
    html body .mr-detail-page .mr-store-action-inner,
    html body .mr-detail-page .mr-care-inner,
    html body .mr-detail-page .mr-pricing-inner,
    html body .mr-detail-page .mr-reviews-inner,
    html body .mr-detail-page .mr-coverage-inner,
    html body .mr-detail-page .mr-faq-inner,
    html body .mr-detail-page .mr-final-cta-inner {
        width: calc(100% - 40px) !important;
        max-width: 1180px !important;
    }
}


/* =========================================================
   9. MOBILE
========================================================= */

@media (max-width: 768px) {

    html body .mr-detail-page .mr-store-header-inner,
    html body .mr-detail-page .mr-store-hero-inner,
    html body .mr-detail-page .mr-store-details-inner,
    html body .mr-detail-page .mr-services-inner,
    html body .mr-detail-page .mr-store-action-inner,
    html body .mr-detail-page .mr-care-inner,
    html body .mr-detail-page .mr-pricing-inner,
    html body .mr-detail-page .mr-reviews-inner,
    html body .mr-detail-page .mr-coverage-inner,
    html body .mr-detail-page .mr-faq-inner,
    html body .mr-detail-page .mr-final-cta-inner {
        width: calc(100% - 30px) !important;
        max-width: 1180px !important;
    }
}


/* =========================================================
   10. SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    html body .mr-detail-page .mr-store-header-inner,
    html body .mr-detail-page .mr-store-hero-inner,
    html body .mr-detail-page .mr-store-details-inner,
    html body .mr-detail-page .mr-services-inner,
    html body .mr-detail-page .mr-store-action-inner,
    html body .mr-detail-page .mr-care-inner,
    html body .mr-detail-page .mr-pricing-inner,
    html body .mr-detail-page .mr-reviews-inner,
    html body .mr-detail-page .mr-coverage-inner,
    html body .mr-detail-page .mr-faq-inner,
    html body .mr-detail-page .mr-final-cta-inner {
        width: calc(100% - 24px) !important;
        max-width: 1180px !important;
    }
}


/* =========================================================
   FAQ BACKGROUND IMAGE - FINAL
   Full-width background image
========================================================= */

html body .mr-detail-page .mr-faq-section {
    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    box-sizing: border-box !important;

    background-image: url("https://www.mr-blue.in/wp-content/uploads/2026/09/background.png") !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
    background-color: transparent !important;
}

/* FAQ inner must remain transparent so the image
   covers the complete section, not only the content box */
html body .mr-detail-page .mr-faq-inner {
    width: min(1180px, calc(100% - 60px)) !important;
    max-width: 1180px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    background: transparent !important;
    box-sizing: border-box !important;
}

/* Keep FAQ text/cards above the background */
html body .mr-detail-page .mr-faq-left,
html body .mr-detail-page .mr-faq-right {
    position: relative !important;
    z-index: 2 !important;
}


/* TABLET */
@media (max-width: 900px) {

    html body .mr-detail-page .mr-faq-inner {
        width: calc(100% - 40px) !important;
        max-width: 1180px !important;
    }

    html body .mr-detail-page .mr-faq-section {
        background-size: 100% 100% !important;
        background-position: center center !important;
    }
}


/* MOBILE */
@media (max-width: 768px) {

    html body .mr-detail-page .mr-faq-inner {
        width: calc(100% - 30px) !important;
        max-width: 1180px !important;
    }

    html body .mr-detail-page .mr-faq-section {
        background-size: 100% 100% !important;
        background-position: center center !important;
    }
}


/* SMALL MOBILE */
@media (max-width: 480px) {

    html body .mr-detail-page .mr-faq-inner {
        width: calc(100% - 24px) !important;
        max-width: 1180px !important;
    }

    html body .mr-detail-page .mr-faq-section {
        background-size: 100% 100% !important;
        background-position: center center !important;
    }
}


/* =========================================================
   FAQ - ACTUAL FULL VIEWPORT WIDTH FIX
   FINAL OVERRIDE
   Do not use the 1180px inner box as the background.
========================================================= */

/* The FAQ SECTION itself becomes the full-width background */
html body .mr-detail-page section.mr-faq-section {
    display: block !important;

    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    box-sizing: border-box !important;

    overflow: hidden !important;

    background-image: url("https://www.mr-blue.in/wp-content/uploads/2026/09/background.png") !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
    background-color: transparent !important;
}


/* Remove the old 1180px background from FAQ INNER */
html body .mr-detail-page section.mr-faq-section
.mr-faq-inner {
    width: min(1180px, calc(100% - 60px)) !important;
    max-width: 1180px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    background: transparent !important;
    background-image: none !important;

    box-sizing: border-box !important;
}


/* Remove the old inner pseudo-background shapes.
   The new background.png belongs to the full section. */
html body .mr-detail-page section.mr-faq-section
.mr-faq-inner::before,
html body .mr-detail-page section.mr-faq-section
.mr-faq-inner::after {
    background: transparent !important;
    background-image: none !important;
    opacity: 0 !important;
}


/* Keep actual FAQ content above the background */
html body .mr-detail-page section.mr-faq-section
.mr-faq-left,
html body .mr-detail-page section.mr-faq-section
.mr-faq-list {
    position: relative !important;
    z-index: 2 !important;
}

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

@media (max-width: 900px) {

    html body .mr-detail-page section.mr-faq-section {
        width: 100vw !important;
        max-width: 100vw !important;

        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    html body .mr-detail-page section.mr-faq-section
    .mr-faq-inner {
        width: calc(100% - 40px) !important;
        max-width: 1180px !important;
    }
}


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

@media (max-width: 768px) {

    html body .mr-detail-page section.mr-faq-section
    .mr-faq-inner {
        width: calc(100% - 30px) !important;
        max-width: 1180px !important;
    }

    html body .mr-detail-page section.mr-faq-section {
        background-size: 100% 100% !important;
        background-position: center center !important;
    }
}


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

@media (max-width: 480px) {

    html body .mr-detail-page section.mr-faq-section
    .mr-faq-inner {
        width: calc(100% - 24px) !important;
        max-width: 1180px !important;
    }
}/* End custom CSS */
/* Start custom CSS *//* Only Store Details page */
body.page-id-18378 .page-area.pt-120 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}/* End custom CSS */