.r2f-service-page {
    background: #fff;
}


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

.r2f-service-hero {
    position: relative;

    min-height: 630px;

    display: flex;
    align-items: center;

    overflow: hidden;

    color: #fff;

    background: var(--r2f-navy-950);

    isolation: isolate;
}

.r2f-service-hero__bg {
    position: absolute;

    inset: 0;

    z-index: -3;
}

.r2f-service-hero__bg img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.r2f-service-hero::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: -2;

    background:
        linear-gradient(90deg,
            rgba(6, 17, 36, .97) 0%,
            rgba(6, 17, 36, .89) 46%,
            rgba(6, 17, 36, .54) 75%,
            rgba(6, 17, 36, .7) 100%);
}

.r2f-service-hero::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: -1;

    background:
        radial-gradient(circle at 72% 28%,
            rgba(59, 157, 245, .17),
            transparent 25%);
}

.r2f-service-hero__inner {
    width: 100%;

    display: grid;

    grid-template-columns:
        1.08fr .62fr;

    align-items: center;

    gap: 70px;

    padding:
        88px 0 105px;
}

.r2f-service-hero .r2f-kicker {
    color: var(--r2f-gold-400);
}

.r2f-service-hero h1 {
    max-width: 760px;

    margin: 0 0 21px;

    color: #fff;

    font-family:
        var(--r2f-font-display);

    font-size:
        clamp(3rem, 4.6vw, 4.8rem);

    font-weight: 850;

    letter-spacing: -.055em;

    line-height: .98;

    text-wrap: balance;
}

.r2f-service-hero__content>p {
    max-width: 700px;

    margin: 0;

    color: #ccd8e7;

    font-size:
        clamp(1rem, 1.4vw, 1.14rem);

    line-height: 1.75;
}

.r2f-service-hero__actions {
    display: flex;

    flex-wrap: wrap;

    gap: 11px;

    margin-top: 30px;
}


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

.r2f-service-hero__card {
    padding: 25px;

    border:
        1px solid rgba(255, 255, 255, .14);

    border-radius: 25px;

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

    backdrop-filter: blur(18px);

    box-shadow:
        0 25px 65px rgba(0, 0, 0, .18);
}

.r2f-service-hero__icon {
    width: 52px;
    height: 52px;

    display: grid;

    place-items: center;

    margin-bottom: 25px;

    border-radius: 15px;

    color: var(--r2f-gold-400);

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

    font-size: 1.1rem;
}

.r2f-service-hero__card>span {
    display: block;

    margin-bottom: 7px;

    color: var(--r2f-gold-400);

    font-size: .69rem;

    font-weight: 850;

    letter-spacing: .1em;

    text-transform: uppercase;
}

.r2f-service-hero__card strong {
    display: block;

    margin-bottom: 8px;

    color: #fff;

    font-family:
        var(--r2f-font-display);

    font-size: 1.45rem;

    font-weight: 820;
}

.r2f-service-hero__card p {
    color: #bdcadb;

    font-size: .81rem;

    line-height: 1.6;
}

.r2f-service-hero__location {
    display: flex;

    align-items: center;

    gap: 8px;

    margin-top: 19px;

    padding-top: 17px;

    border-top:
        1px solid rgba(255, 255, 255, .1);

    color: #d9e3ef;

    font-size: .76rem;
}

.r2f-service-hero__location i {
    color: var(--r2f-gold-400);
}


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

.r2f-service-breadcrumb-wrap {
    border-bottom:
        1px solid #e5ebf2;

    background: #fff;
}

.r2f-service-breadcrumb {
    min-height: 52px;

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 7px;

    color: #758398;

    font-size: .75rem;
}

.r2f-service-breadcrumb a {
    color: var(--r2f-blue-700);

    text-decoration: none;
}

.r2f-service-breadcrumb i {
    color: #adb8c6;

    font-size: .58rem;
}


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

.r2f-service-intro {
    padding: 100px 0;
}

.r2f-service-intro__grid {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    gap: 65px;

    align-items: start;
}

.r2f-service-intro__content {
    display: grid;

    gap: 18px;
}

.r2f-service-intro__content>p {
    margin: 0;

    color: var(--r2f-muted);

    font-size: .97rem;

    line-height: 1.82;
}

.r2f-service-disclaimer {
    display: flex;

    gap: 11px;

    align-items: flex-start;

    margin-top: 5px;

    padding: 16px 18px;

    border-left:
        3px solid var(--r2f-gold-500);

    border-radius:
        0 13px 13px 0;

    color: #617186;

    background: #fff9ed;

    font-size: .78rem;

    line-height: 1.6;
}

.r2f-service-disclaimer i {
    margin-top: 4px;

    color: var(--r2f-gold-500);
}


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

.r2f-service-benefits {
    padding: 95px 0;

    background:
        var(--r2f-soft);
}

.r2f-service-benefit-grid {
    display: grid;

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

    gap: 14px;

    margin-top: 40px;
}

.r2f-service-benefit {
    min-height: 175px;

    padding: 21px;

    border:
        1px solid #dfe7f0;

    border-radius: 18px;

    background: #fff;
}

.r2f-service-benefit__check {
    width: 37px;
    height: 37px;

    display: grid;

    place-items: center;

    margin-bottom: 24px;

    border-radius: 11px;

    color: var(--r2f-success);

    background: #eaf8f3;
}

.r2f-service-benefit strong {
    color: var(--r2f-navy-950);

    font-size: .88rem;

    line-height: 1.45;
}


/* =========================================================
   FIT / ENQUIRY
========================================================= */

.r2f-service-fit {
    padding: 100px 0;
}

.r2f-service-fit__grid {
    display: grid;

    grid-template-columns:
        1fr .72fr;

    gap: 65px;

    align-items: center;
}

.r2f-service-fit__content {
    min-width: 0;
}

.r2f-service-fit__content .r2f-section-title {
    max-width: 720px;

    margin-bottom: 20px;
}

.r2f-service-fit__content .r2f-section-copy {
    max-width: 720px;

    margin-top: 0;

    line-height: 1.75;
}

.r2f-service-fit__tags {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    margin-top: 28px;
}

.r2f-service-fit__tags span {
    padding: 9px 12px;

    border:
        1px solid #dbe4ef;

    border-radius: 999px;

    color: #4f6279;

    background: #f9fbfd;

    font-size: .76rem;

    font-weight: 750;
}

.r2f-service-enquiry-card {
    padding: 30px;

    border:
        1px solid #dce5ef;

    border-radius: 25px;

    background:
        linear-gradient(145deg,
            #f7fbff,
            #edf5fd);

    box-shadow:
        var(--r2f-shadow-md);
}

.r2f-service-enquiry-card>span {
    display: block;

    margin-bottom: 9px;

    color: var(--r2f-blue-700);

    font-size: .7rem;

    font-weight: 850;

    letter-spacing: .1em;

    text-transform: uppercase;
}

.r2f-service-enquiry-card h3 {
    margin: 0 0 11px;

    color: var(--r2f-navy-950);

    font-family:
        var(--r2f-font-display);

    font-size: 1.55rem;

    font-weight: 820;

    letter-spacing: -.035em;

    line-height: 1.2;
}

.r2f-service-enquiry-card p {
    margin: 0 0 22px;

    color: #68798e;

    font-size: .84rem;

    line-height: 1.65;
}

.r2f-service-enquiry-card .r2f-btn {
    width: 100%;
}

.r2f-service-enquiry-card__wa {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    margin-top: 13px;

    color: #277b61;

    font-size: .77rem;

    font-weight: 750;

    text-decoration: none;
}


/* =========================================================
   LOCAL
========================================================= */

.r2f-service-local {
    padding: 100px 0;

    background:
        var(--r2f-soft);
}

.r2f-service-local__grid {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    gap: 60px;

    align-items: center;
}

.r2f-service-local__visual {
    height: 390px;

    overflow: hidden;

    border-radius: 24px;

    background: #e9eef5;
}

.r2f-service-local__visual img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.r2f-service-local__cities {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    margin: 23px 0 27px;
}

.r2f-service-local__cities a {
    padding: 8px 11px;

    border:
        1px solid #d9e3ed;

    border-radius: 999px;

    color: var(--r2f-blue-700);

    background: #fff;

    font-size: .75rem;

    font-weight: 750;

    text-decoration: none;
}


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

.r2f-service-faq {
    padding: 100px 0;

    color: #fff;

    background:
        var(--r2f-navy-950);
}

.r2f-service-faq .r2f-kicker {
    color: var(--r2f-gold-400);
}

.r2f-service-faq .r2f-section-title {
    color: #fff;
}

.r2f-service-faq .r2f-section-copy {
    color: #afbed0;
}

.r2f-service-faq__grid {
    display: grid;

    grid-template-columns:
        .7fr 1.3fr;

    gap: 60px;
}

.r2f-service-faq__list {
    display: grid;

    gap: 10px;
}

.r2f-service-faq-item {
    overflow: hidden;

    border:
        1px solid rgba(255, 255, 255, .1);

    border-radius: 15px;

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

.r2f-service-faq-question {
    width: 100%;

    min-height: 60px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 18px;

    padding: 15px 17px;

    border: 0;

    color: #fff;

    background: transparent;

    font: inherit;

    font-size: .84rem;

    font-weight: 750;

    text-align: left;

    cursor: pointer;
}

.r2f-service-faq-question i {
    transition:
        transform var(--r2f-transition);
}

.r2f-service-faq-item.is-open .r2f-service-faq-question i {
    transform: rotate(45deg);
}

.r2f-service-faq-answer {
    display: none;

    padding:
        0 17px 17px;

    color: #afbed0;

    font-size: .78rem;

    line-height: 1.65;
}

.r2f-service-faq-item.is-open .r2f-service-faq-answer {
    display: block;
}


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

.r2f-service-final {
    padding:
        90px 0 120px;
}

.r2f-service-final__card {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;

    padding: 38px;

    border-radius: 29px;

    color: #fff;

    background:
        linear-gradient(135deg,
            #0c284a,
            #13528d);

    box-shadow:
        var(--r2f-shadow-md);
}

.r2f-service-final__card>div>span {
    display: block;

    margin-bottom: 7px;

    color: var(--r2f-gold-400);

    font-size: .7rem;

    font-weight: 850;

    letter-spacing: .1em;

    text-transform: uppercase;
}

.r2f-service-final h2 {
    max-width: 720px;

    margin: 0 0 8px;

    color: #fff;

    font-family:
        var(--r2f-font-display);

    font-size:
        clamp(1.8rem, 3.1vw, 2.8rem);

    font-weight: 820;

    letter-spacing: -.04em;
}

.r2f-service-final p {
    margin: 0;

    color: #c6d4e4;

    line-height: 1.65;
}

.r2f-service-final__actions {
    display: flex;

    flex-wrap: wrap;

    gap: 9px;

    flex: 0 0 auto;
}


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

@media (max-width: 991.98px) {

    .r2f-service-hero__inner,
    .r2f-service-intro__grid,
    .r2f-service-fit__grid,
    .r2f-service-local__grid,
    .r2f-service-faq__grid {
        grid-template-columns: 1fr;
    }

    .r2f-service-benefit-grid {
        grid-template-columns:
            1fr 1fr;
    }

    .r2f-service-final__card {
        align-items: flex-start;

        flex-direction: column;
    }
}


@media (max-width: 767.98px) {

    .r2f-service-hero {
        min-height: auto;
    }

    .r2f-service-hero__inner {
        padding:
            55px 0 73px;
    }

    .r2f-service-hero h1 {
        font-size:
            clamp(2.7rem, 13vw, 4rem);
    }

    .r2f-service-hero__actions {
        display: grid;
    }

    .r2f-service-hero__actions .r2f-btn {
        width: 100%;
    }

    .r2f-service-intro,
    .r2f-service-benefits,
    .r2f-service-fit,
    .r2f-service-local,
    .r2f-service-faq {
        padding:
            70px 0;
    }

    .r2f-service-benefit-grid {
        grid-template-columns: 1fr;
    }

    .r2f-service-local__visual {
        height: 300px;
    }

    .r2f-service-final {
        padding:
            70px 0 90px;
    }

    .r2f-service-final__card {
        padding: 24px;

        border-radius: 22px;
    }

    .r2f-service-final__actions {
        width: 100%;
    }

    .r2f-service-final__actions .r2f-btn {
        width: 100%;
    }
}