:root{
    --primary:#143E90;
    --primary-dark:#003060;
    --secondary:#E6007E;
    --white:#fff;
    --text-grey:#312F34;
    /*font*/
    --thin:100;
    --extralight:200;
    --light:300;
    --regular:400;
    --medium:500;
    --semibold:600;
    --bold:700;
    --extrabold:800;
    --black:900;
}
body{
    margin: 0;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    line-height: 1.2;
    color: var(--text-grey);
    background-color: #FAFAFA;
}
body::after{
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 39%;
    height: 100%;
    background-color: #fff;
    z-index: -1;
}
*{
    margin: 0;
}
img{
    display: block;
    max-width: 100%;
}
/**************************************
TYPOGRAPHY
**************************************/
h1, .h1{
    font-size: 65px;
    font-weight: var(--regular);
    line-height: 1.3;
    font-family: "Playfair Display", serif;
}
h2, .h2{
    font-size: 60px;
    font-weight: var(--regular);
    line-height: 80px;
    font-family: "Playfair Display", serif;
}
h3, .h3{
    font-size: 38px;
    font-weight: var(--regular);
    line-height: 1.5;
    font-family: "Playfair Display", serif;
}
h4, .h4{
    font-size: 35px;
    font-weight: var(--regular);
    line-height: 1.4;
    font-family: "Playfair Display", serif;
}
h5, .h5{
    font-size: 26px;
    font-weight: var(--light);
    line-height: 38px;
    font-family: "Playfair Display", serif;
}
h6, .h6{
    font-size: 20px;
    font-weight: var(--regular);
    line-height: 36px;
}
p, .para{
    font-size:16px;
    line-height:26px;
    font-weight:var(--regular);
    font-family: 'Poppins', sans-serif;
}
li{
    font-size:20px;
    line-height:26px;
    font-weight:var(--medium);
    font-family: 'Poppins', sans-serif;
}
*{
    margin: 0;
    box-sizing: border-box;
}
a{
    text-decoration: none;
    color: var(--primary);
}
a:hover{
    color: inherit;
}
b{
    font-weight: var(--semibold);
}
img{
    display: block;
    max-width: 100%;
}
.text-primary{
    color: var(--primary);
}
.text-secondary{
    color: var(--secondary);
}
:root{
    --heading-width:153px;
    --heading2-width:462px;
    --heading-space:73px;
}
.heading :is(h1, h2, h3, h4, h5, h6){
    position: relative;
    display: flex;
}
.heading :is(h1, h2, h3, h4, h5, h6)::before{
    content: '';
    flex-shrink: 0;
    display: block;
    width: var(--heading-width);
    height: 1px;
    background-color: #CCCCCC;
    margin-block: 64px 0;
    margin-right: var(--heading-space);
}
.heading.heading-secondary :is(h1, h2, h3, h4, h5, h6)::before{
    background-color: var(--secondary);
}
.heading p{
    margin-top: 36px;
    padding-left: var(--heading-width);
}
.sub-heading{
    display: block;
    font-size: 16px;
    font-weight: var(--medium);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 24px;
}
.heading .sub-heading{
    padding-left: var(--heading-width);
}
.heading.heading-secondary .sub-heading{
    color: var(--secondary);
}
/*heading 2*/
.heading-2 :is(h1, h2, h3, h4, h5, h6){
    position: relative;
    display: flex;
}
.heading-2 :is(h1, h2, h3, h4, h5, h6)::before{
    content: '';
    display: block;
    width: var(--heading2-width);
    height: 1px;
    background-color: var(--secondary);
    margin-block: auto 15px;
    margin-right: var(--heading-space);
    flex-shrink: 0;
}
.heading-2 span {
    display: block;
    color: var(--primary);
    letter-spacing: 4.5px;
    font-weight: 600;
    padding-left: var(--heading2-width);
    margin-bottom: 10px;
}
.heading-2 p{
    font-size: 24px;
    font-weight: var(--semibold);
    font-style: normal;
    color: rgb(17, 17, 17);
    text-wrap: balance;
    line-height: 1.32;
    padding-left: calc(var(--heading2-width) + var(--heading-space));
}
@media screen and (max-width:1280px) {
    h1, .h1{
        font-size: 45px;
        line-height: 1.2;
    }
    h2, .h2{
        font-size: 45px;
        line-height: 1.2;
    }
    h3, .h3{
        font-size: 35px;
        line-height: 1.2;
    }
    h4, .h4{
        font-size: 30px;
        line-height: 1.2;
    }
    h5, .h5{
        font-size: 26px;
        line-height: 1.2;
    }
    h6, .h6{
        font-size: 20px;
        line-height: 1.2;
    }
    /* p, .para, li{
        font-size: 18px;
        line-height: 1.3;
    } */
    .heading, .heading-2{
        --heading-width:100px;
        --heading2-width:100px;
        --heading-space:45px;
    }
    .heading :is(h1, h2, h3, h4, h5, h6)::before {
        margin-block: 47px 0;
    }
}
@media screen and (max-width:767px) {
    h1, .h1{
        font-size: 40px;
    }
    h2, .h2{
        font-size: 26px;
    }
    h3, .h3{
        font-size: 24px;
    }
    h4, .h4{
        font-size: 22px;
    }
    h5, .h5{
        font-size: 22px;
    }
    h6, .h6{
        font-size: 18px;
    }
    p, .para, li{
        font-size: 16px;
        line-height: 22px;
    }
    .heading, .heading-2{
        --heading-width:35px;
        --heading2-width:35px;
        --heading-space:25px;
    }
    .heading :is(h1, h2, h3, h4, h5, h6)::before {
        margin-block: 26px 0;
    }
}

:root{
    --header-height:150px;
}
@media screen and (max-width:1140px) {
    :root{
        --header-height:110px;
    }
}
/**************************************
CONTAINER
**************************************/
:root{
    --container-width: 1533px;
    --container-padding:60px;
    --container: min(calc(100% - var(--container-padding) * 2), var(--container-width));
    --container-spacing: max(calc((100% - var(--container-width)) / 2), var(--container-padding));
    --container-spacing-minus: max(calc((-100% + var(--container-width)) / 2), var(--container-padding));
    --container-fluid-spacing:54px;
}
@media screen and (max-width:767px){
     :root{
         --container-padding:15px;
         --container-fluid-spacing:15px;
     }
}
.container{
    width: var(--container);
    margin-inline: auto;
}
/**************************************
BUTTON
**************************************/
.button{
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1;
    text-align: center;
    color: #fff !important;
    background-color: var(--primary) !important;
    border: 1px solid var(--primary);
    border-radius: 6px;
    padding: 19px 30px;
    cursor: pointer;
    box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.10);
    transition: all 0.3s;
}
.button:hover,
.button:focus{
    background-color: var(--secondary) !important;
    border-color: var(--secondary);
}
/*secondary*/
.button.secondary{
    background-color: var(--secondary) !important;
    border-color: var(--secondary);
}
.button.secondary:hover,
.button.secondary:focus{
    background-color: var(--primary) !important;
    border-color: var(--primary);
}
/*white*/
.button.white{
    background-color: #fff !important;
    border-color: #fff;
    color: var(--primary) !important;
}
.button.white:hover,
.button.white:focus{
    background-color: var(--secondary) !important;
    border-color: var(--secondary);
    color: #fff !important;
}
/*hover white*/
.button.hover-white:hover,
.button.hover-white:focus{
    background-color: #fff !important;
    border-color: #fff;
    color: var(--primary) !important;
}
.button.secondary.hover-white:hover,
.button.secondary.hover-white:focus{
    color: var(--secondary) !important;
}
/*button group*/
.button-group{
    display: flex;
    flex-wrap: wrap;
    grid-gap: 15px 28px;
}
/**************************************
FORM
**************************************/
.form-wrap{
    position: relative;
}
.form-wrap:not(:first-child){
    margin-top: 20px;
}
.form-wrap input:not([type="submit"], [type="button"], [type="checkbox"], [type="radio"]),
.form-wrap textarea{
    width: 100%;
    border: 0;
    background-color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: var(--regular);
    letter-spacing: 2px;
    line-height: 1;
    color: var(--primary);
    padding: 18px 22px;
    border-radius: 6px;
}
.form-wrap input::placeholder,
.form-wrap textarea::placeholder{
    color: var(--primary);
}
@media screen and (max-width:1280px) {
    .form-wrap:not(:first-child) {
        margin-top: 25px;
    }
    .form-wrap input:not([type="submit"], [type="button"]), 
    .form-wrap textarea{
        padding: 18px 25px;
    }
}
/*privacy statement*/
.checkbox-inline label{
    display:flex;
    grid-gap:14px;
    user-select: none;
}
.checkbox-inline input {
    all: unset !important;
    width: 16px !important;
    height: 16px !important;
    border: 2px solid #96939A !important;
    border-radius: 2px !important;
    flex-shrink:0 !important;
    position: relative !important;
}
.checkbox-inline input:checked::after{
    content: '\f00c';
    position: absolute;
    inset: 0;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    color: #fff;
    font-family: "Font Awesome 6 Pro";
    font-weight: 700;
    line-height: 1;
}
.checkbox-inline span{
    font-size:14px;
    line-height:1.3;
    font-weight:var(--regular);
}
.checkbox-inline label a{
    color: #fff;
    transition: all 0.3s;
}
.checkbox-inline label a:hover{
    color: var(--secondary);
}
/*inline group*/
.checkbox-group-inline{
    display: flex;
    flex-wrap: wrap;
    grid-gap: 20px 20px;
}
/*group*/
.checkbox-group{
    display: flex;
    flex-direction: column;
    grid-gap: 20px 20px;
}
/*error*/
.error{
    display: block;
    margin-top: 5px;
    font-size: 14px;
    color: #f15252;
}
:is(.checkbox-inline, .checkbox-group-inline) .error{
    position: absolute;
    left: 0;
    bottom: -20px;
}
/**************************************
LISTING STYLE
**************************************/
.ul-wrap ul{
    padding-left: 0;
    list-style: none;
}
.ul-wrap ul li{
    padding-left: calc(12px + 21px);
    position: relative;
}
.ul-wrap ul li:not(:first-child){
    margin-top: 20px;
}
.ul-wrap ul li::before{
    content: '';
    width: 16px;
    height: 31px;
    background-image: url('../images/li-marker.png');
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0px;
    left: 0;
}
/**/
.ul-wrap.white-marker ul li{
    font-size: 16px;
}
.ul-wrap.white-marker ul li:not(:first-child){
    margin-top: 15px;
}
.ul-wrap.white-marker ul li::before {
    background-image: none;
    background-color: #fff;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    top: 7px;
}
/**************************************
ORDER LIST
**************************************/
.ol-wrap ol{
    padding-left: 0;
    counter-reset: ol;
    list-style: none;
}
.ol-wrap ol li{
    counter-increment: ol;
    padding-left: calc(21px + 35px);
    position: relative;
}
.ol-wrap ol li::before{
    content: counter(ol);
    position: absolute;
    font-family: "Playfair Display", serif;
    font-size: 40px;
    font-weight: var(--bold);
    /* top: 20px; */
    left: 0;
}
.ol-wrap ol li:not(:first-child){
    margin-top: 19px;
}
@media screen and (max-width:1280px) {
    .ol-wrap ol li:not(:first-child) {
        margin-top: 40px;
    }
    .ol-wrap ol li {
        font-size: 18px;
        line-height: 1.5;
    }
    .ol-wrap ol li::before{
        line-height: 1;
        top: -5px;
    }
}
/**************************************
HERO BANNER
**************************************/
.hero-banner{
    --form-width:653px;
    color: #fff;
    position: relative;
    padding-block: calc(var(--header-height) + 58px) 30px;
    aspect-ratio: 1920/1230;
}
.hero-banner .c-row{
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
}
.hero-banner .block-left{
    width: calc(100% - var(--form-width));
    color: var(--text-grey);
    padding-top: 30px;
}
.hero-banner .block-right{
    width: var(--form-width);
}
.hero-banner-img{
    position: absolute;
    inset: 0;
}
.hero-banner-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top left;
}
img.flip-img{
    transform: scaleX(-1);
}
.hero-banner .block-left p{
    margin-top: 29px;
    max-width: 736px;
}
.hero-banner .block-right .feefo-logo{
    display: flex;
    justify-content: center;
    align-items: center;
    grid-gap: 10px;
    margin-top: 30px;
    margin-inline: auto;
}
.hero-banner .block-right .feefo-logo h3{
    font-size: 30px;
    color: #312F34;
}
.hero-banner .banner-form{
    width: var(--form-width);
    aspect-ratio: 653/847;
    display: flex;
    align-items: flex-end;
    background-image: url('../images/subtraction.png');
    background-size: cover;
    background-position: center top;
    padding-block: 0px 90px;
    padding-inline: 50px;
    margin-inline: auto 0;
}
.hero-banner .banner-form-inner{
    max-width: 410px;
    margin-inline: auto;
}
.hero-banner .banner-form-inner h3{
    line-height: 1.2;
}
.hero-banner .banner-form .button{
    width: 100%;
    max-width: 215px;
}
.hero-banner .banner-form h3 + p{
    margin-top: 13px;
    font-size: 13px;
    line-height: 1.5;
}
.hero-banner .banner-form form{
    margin-top: 30px;
}
.hero-banner .banner-form form .form-wrap{
    position: relative;
}
.hero-banner .banner-form form .form-wrap label.error {
    font-size: 11px;
    position: absolute;
    bottom: -17px;
}
.hero-banner .banner-form form .form-wrap input:not([type="submit"], [type="button"], [type="checkbox"], [type="radio"]){
    padding-block: 15px;
}
.hero-banner .banner-form form .checkbox-inline{
    margin-top: 20px;
}
.hero-banner .banner-form form .form-action{
    margin-top: 30px;
}
.checkbox-inline label a{
    color: #fff;
    transition: all 0.3s;
}
.checkbox-inline label a:hover{
    color: var(--secondary);
}
@media screen and (max-width:1430px) {
    .hero-banner .block-left h1{
        font-size: 40px;
    }
}
@media screen and (max-width:991px) {
    .hero-banner{
        padding-block: calc(var(--header-height) + 10px) 30px;
    }
    .hero-banner .block-left{
        padding-top: 0;
    }
}
@media screen and (max-width:1359px) {
    .hero-banner .block-left{
        width: 100%;
    }
    .hero-banner .block-right{
        width: 100%;
    }
}
@media screen and (max-width:767px) {
    .hero-banner {
        --form-width: 360px;
    }
    .hero-banner .block-right{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .hero-banner .banner-form {
        /* min-height: 519px; */
        min-height: 540px;
        background-size: contain;
        padding-block: 0px 0;
        padding-inline: 43px;
        background-repeat: no-repeat;
        margin-inline: -15px;
    }
    .hero-banner .banner-form-inner {
        background-color: var(--primary);
        padding-inline: 15px;
        padding-bottom: 15px;
    }
    .hero-banner .banner-form-inner h3{
        font-size: 16px;
    }
    .hero-banner .banner-form h3 + p {
        margin-top: 10px;
        font-size: 10px;
        line-height: 1.2;
    }
    .hero-banner .banner-form form {
        margin-top: 15px;
    }
    .hero-banner .form-wrap:not(:first-child) {
        margin-top: 15px;
    }
    .hero-banner .banner-form form .form-wrap input:not([type="submit"], [type="button"], [type="checkbox"], [type="radio"]) {
        padding-block: 10px;
        padding-inline: 15px;
    }
    .checkbox-inline span {
        font-size: 10px;
        line-height: 1.3;
        font-weight: var(--regular);
    }
    .hero-banner .banner-form form .form-action {
        margin-top: 15px;
    }
    .hero-banner .banner-form .button {
        padding-block: 13px;
        padding-inline: 10px;
        max-width: 140px;
        font-size: 10px;
    }
    .hero-banner .banner-form form .form-wrap label.error {
        font-size: 10px;
        bottom: -14px;
    }
}
@media screen and (max-width:767px) {
    .hero-banner .block-left h1{
        font-size: 34px;
    }
    .hero-banner .block-right .feefo-logo{
        margin-top: 15px;
    }
    .hero-banner .block-right .feefo-logo h3{
        font-size: 18px;
    }
    .hero-banner .block-right .feefo-logo img {
        width: 85px;
    }
}
@media screen and (max-width:480px) {
    .hero-banner .block-left h1{
        font-size: 28px;
    }
}
/**************************************
BODY 1
**************************************/
.body-1{
    padding-block: 150px 150px;
    position: relative;
}
.body-1::after{
    content: '';
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
    background-image: url('../images/arrow-bg.png');
    background-repeat: no-repeat;
    background-position: top 77px left 213px;
}
.body-1 .heading .text{
    max-width: 506px;
}
.body-1 .c-row{
    display: flex;
    flex-wrap: wrap;
}
.body-1 .block-left{
    width: 50%;
    padding-right: 65px;
}
.body-1 .block-right{
    width: 50%;
    padding-top: 70px;
}
.body-1 .button-group{
    margin-top: 50px;
    padding-left: var(--heading-width);
}
.body-1 .button{
    width: 100%;
    max-width: 215px;
    padding-inline: 15px;
}
.body-1 .block-right :is(p, ul, ol):not(:first-child){
    margin-top: 34px;
}
@media screen and (max-width:1480px) {
    .body-1 .heading h2{
        font-size: 45px;
        line-height: 1.2;
    }
}
@media screen and (max-width:1280px) {
    .body-1 {
        padding-block: 70px 70px;
    }
    .body-1 .block-left {
        width: 100%;
    }
    .body-1 .block-right{
        padding-top: 40px;
        width: 100%;
    }
    .body-1 .button-group{
        margin-top: 40px;
        padding-left: 0;
    }
}
@media screen and (max-width:1280px) {
    .body-1 .block-right :is(p, ul, ol):not(:first-child) {
        margin-top: 15px;
    }
}
/**************************************
BODY 2
**************************************/
.body-2{
    position: relative;
    background-color: var(--primary);
    color: var(--white);
}
.body-2::after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    background-image: url('../images/big-arrow-bg.png');
    background-repeat: no-repeat;
    background-position: center;;
}
.body-2 .heading{
    width: calc(100% + 100px);
    margin-bottom: 60px;
}
.body-2 .c-row{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    position: relative;
    z-index: 1;
}
.body-2 .block-left{
    width: 60%;
    padding-block: 150px 150px;
}
.body-2 .block-left article{
    max-width: 766px;
    padding-right: 30px;
}
.body-2 .block-left > :is(p, ul, ol):not(:first-child){
    margin-top: 34px;
}
.body-2 .block-right{
    width: 40%;
    margin-bottom: -70px;
}
.body-2 .block-left .button-group{
    margin-top: 50px;
    padding-left: var(--heading-width);
}
.body-2 .block-left .button{
    width: 100%;
    max-width: 215px;
    padding-inline: 15px;
}
/**/
.call-us-btn{
    margin-top: 16px;
    font-family: "Playfair Display", serif;
    font-size: 40px;
    color: #fff;
}
.call-us-btn a{
    color: var(--white);
}
.call-us-btn a:hover{
    color: var(--secondary);
}
@media screen and (max-width:1360px) {
    .body-2 .c-row{
        align-items: center;
    }
}
@media screen and (max-width:991px) {
    .body-2 .heading{
        width: 100%;
        margin-bottom: 30px;
    }
    .body-2 .c-row {
        align-items: baseline;
        flex-direction: column-reverse;
    }
    .body-2 .block-left {
        width: 100%;
        padding-block: 50px 50px;
    }
    .body-2 .block-right {
        width: 100%;
        max-width: 300px;
        margin-block: -40px 0;
    }
    .body-2::after {
        background-size: auto auto;
        background-position: top right;
    }
}
/**************************************
BODY 3
**************************************/
.body-3{
    padding-block: 40px 110px;
    position: relative;
    color: var(--text-grey);
}
.body-3 .heading{
    margin-bottom: 60px;
    margin-left: -50px;
}
.body-3 .c-row{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}
.body-3 .block-left{
    width: 40%;
}
.body-3 article{
    max-width: 766px;
}
.body-3 article p{
    max-width: 736px;
}
.body-3 article > :is(p, .ul-wrap, .ol-wrap):not(:first-child){
    margin-top: 34px;
}
.body-3 .block-right{
    width: 60%;
    padding-top: 94px;
    padding-left: 90px;
}
@media screen and (max-width:991px) {
    .body-3 {
        padding-block: 40px 40px;
    }
    .body-3 .heading{
        margin-left: 0;
        margin-bottom: 30px;
    }
    .body-3 .block-left {
        width: 100%;
        max-width: 220px;
    }
    .body-3 .block-right{
        width: calc(100% - 220px);
        padding-top: 70px;
        padding-left: 30px;
    }
}
@media screen and (max-width:767px) {
    .body-3 .block-right{
        padding-top: 40px;
    }
}
@media screen and (max-width:580px) {
    .body-3 .block-right{
        width: 100%;
        padding-left: 0;
    }
}
/**************************************
SERVICES
**************************************/
.services{
    padding-block: 150px 32px;
}
.services .heading p{
    max-width: 877px;
}
.services-container{
    margin-top: 70px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 110px 74px;
}
.service-card{
    padding-top: 40px;
    display: flex;
    background-color: var(--primary);
    color: var(--white);
    box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.05);
    border-radius: 16px;
}
.service-card:is(:nth-child(2), :nth-child(3)){
    background-color: var(--secondary);
}
.service-card .image-block{
    width: 45%;
    display: flex;
    align-items: flex-end;
}
.service-card .image-block img{
    margin-left: -44px;
    margin-bottom: -44px;
}
.service-card .text-block{
    width: 55%;
    padding-right: 40px;
    padding-bottom: 30px;
}
.service-card .text-block p{
    margin-top: 26px;
}
@media screen and (max-width:1280px) {
    .services {
        padding-block: 70px 32px;
    }
    .services-container {
        margin-top: 40px;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 70px 30px;
    }
    .service-card .image-block img {
        margin-left: -20px;
    }
    .service-card .image-block{
        align-items: flex-start;
        margin-top: -80px;
    }
}
@media screen and (max-width:991px) {
    .services-container {
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 40px 30px;
    }
    .service-card .image-block{
        width: 28%;
    }
    .service-card .text-block {
        width: 72%;
    }
    .service-card .image-block img {
        max-height: 220px;
    }
}
@media screen and (max-width:767px) {
    .services-container{
        padding-left: 15px;
    }
}
@media screen and (max-width:480px) {
    .service-card{
        flex-wrap: wrap;
        padding-top: 0;
    }
    .service-card .text-block{
        width: 100%;
        padding-inline: 15px;
    }
    .service-card .image-block{
        width: 100%;
        margin-top: 0;
    }
    .service-card .image-block img {
        max-height: unset;
        margin-left: -20px;
        margin-block: -30px 0;
    }
}
/**************************************
CTA
**************************************/
.cta {
    display: flex;
    text-align: center;
    padding-block: calc(54px + 52px) 54px;
}
.cta-panel {
    margin-inline: auto;
    background-color: #0f2d69;
    background-image: linear-gradient(90deg, rgba(19,59,138,1) 0%, rgba(15,45,105,1) 100%);
    color: var(--white);
    text-align: left;
    position: relative;
    display: inline-flex;
    align-items: center;
    grid-gap: 15px 44px;
    padding-block: 41px;
    padding-inline: 44px 0;
    border-radius: 40px 0 0 40px;
}
.cta-panel h2{
    font-size: 55px;
    line-height: 1;
}
.cta-panel .icons {
    display: flex;
    grid-gap: 30px;
    margin-right: -90px;
    position: relative;
    z-index: 1;
}
.cta-panel .icons > div{
    display: flex;
    align-items: center;
    grid-gap: 13px;
}
.cta-panel .icons a{
    font-size: 22px;
    font-weight: var(--bold);
    line-height: 1;
    color: var(--white);
}
.cta-panel .icons a .md{
    display: none;
}
.cta-panel .icons a:hover{
    color: var(--secondary);
}
.cta-panel::after{
    content: '';
    width: 223px;
    height: 273px;
    position: absolute;
    right: 1px;
    transform: translateX(100%);
    background-image: url('../images/cta.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center left;
}
.cta-2{
    text-align: left;
    padding-block: calc(54px + 32px) 54px;
}
@media screen and (max-width:1280px) {
    .cta-panel {
        grid-gap: 15px 24px;
        padding-block: 30px;
        padding-inline: 44px 0;
    }
    .cta-panel::after {
        width: 153px;
        height: 183px;
    }
    .cta-panel h2 {
        font-size: 33px;
    }
    .cta-panel .icons {
        grid-gap: 15px;
        margin-right: -50px;
    }
    .cta-panel .icons a {
        font-size: 16px;
    }
    .cta-panel .icons img{
        width: 40px;
        height: 25px;
        object-fit: contain;
    }
}
@media screen and (max-width:991px) {
    .cta-panel{
        width: calc(100% - 153px);
        flex-wrap: wrap;
        grid-gap: 20px 0px;
        padding-block: 20px;
        padding-inline: 20px 0;
    }
    .cta-panel h2{
        width: 100%;
    }
    .cta-panel .icons a .dd{
        display: none;
    }
    .cta-panel .icons a .md{
        display: block;
    }
    .cta-panel .icons > div {
        grid-gap: 5px;
    }
    .cta-1 .cta-panel{
        margin-left: calc(-153px / 2);
    }
}
@media screen and (max-width:767px) {
    .cta{
        padding-block: calc(13px + 15px) 13px;
    }
    .cta-panel {
        width: calc(100% - 113px);
        max-width: 310px;
        grid-gap: 15px 0px;
        padding-block: 15px;
        padding-inline: 15px 0;
        border-radius: 16px 0 0 16px;
    }
    .cta-panel::after {
        width: 113px;
        height: 133px;
    }
    .cta-panel h2 {
        font-size: 20px;
    }
    .cta-panel .icons a {
        font-size: 11px;
    }
    .cta-panel .icons img {
        width: 33px;
        height: 21px;
    }
    .cta-1 .cta-panel{
        margin-left: -113px;
    }
}
/**************************************
RCB FORM
**************************************/
.rcb-block{
    min-height: 500px;
    padding-block: 100px;
    color: #fff;
    position: relative;
}
.rcb-block::after {
    content: '';
    width: calc(100% - 45px);
    position: absolute;
    inset: 0;
    background-image: url(../images/rcb.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center right;
}
.rcb-block .heading p{
    width: calc(100% - 110px);
    padding-left: 0;
    max-width: 890px;
}
.rcb-block .container{
    position: relative;
    z-index: 1;
}
.rcb-block .form-row{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}
.rcb-block .form-left{
    width: 50%;
    padding-right: 24px;
}
.rcb-block .form-right{
    width: 50%;
    padding-left: 24px;
}
.rcb-block form{
    margin-top: 61px;
    max-width: calc(100% - 110px);
}
.rcb-block form .form-action{
    margin-top: 43px;
}
.rcb-block form .md{
    display: none;
}
.rcb-block form .form-action .button{
    width: 100%;
    max-width: 215px;
}
/*checkbox*/
.rcb-block .checkbox-inline input{
    border-color: var(--white) !important;
} 
/**/
.rcb-block .contact-field{
    margin-block: 34px 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    grid-gap: 15px;
}
.rcb-block .contact-field p{
    font-weight: var(--semibold);
}
/**/
.rcb-block .form-wrap textarea{
    min-height: 215px;
}
@media screen and (max-width: 1280px) {
    .rcb-block{
        padding-block: 70px 70px;
    }
}
@media screen and (max-width: 767px) {
    .rcb-block{
        padding-block: 40px 40px;
    }
    .rcb-block::after {
        width: 100%;
        background-size: contain;
        background-position: top;
        background-color: var(--primary);
    }
    .rcb-block .heading p{
        width: 100%;
    }
    .rcb-block form {
        margin-top: 30px;
        max-width: unset;
    }
    .rcb-block .form-left {
        width: 100%;
        padding-right: 0;
    }
    .rcb-block .form-right {
        margin-top: 24px;
        width: 100%;
        padding-left: 0;
    }
    .rcb-block .form-wrap textarea {
        min-height: 140px;
    }
    .rcb-block form .dd{
        display: none;
    }
    .rcb-block form .md{
        display: block;
    }
    .rcb-block form .form-action {
        margin-top: 30px;
    }    
}
/**************************************
BODY 4
**************************************/
.body-4{
    padding-block: 150px;
}
.body-4 .container-fluid{
    padding-inline: 110px;
}
.body-4 .c-row{
    display: flex;
    flex-wrap: wrap;
    box-shadow: 10px 10px 40px rgba(0,0,0,0.10);
    background-color: #fff;
    border-radius: 16px;
    overflow: hidden;
}
.body-4 .img-block {
    width: calc(100% - 37.5%);
}
.body-4 .img-block img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.body-4 .text-block {
    width: 37.5%;
    padding-block: 108px;
    padding-inline: 100px;
    background-image: url(../images/arrow-bg.png);
    background-size: 256px;
    background-repeat: no-repeat;
    background-position: 105px 105px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.body-4 .text-block article{
    max-width: 365px;
}
.body-4 .text-block p{
    margin-top: 27px;
}
.body-4 .text-block .button-group{
    margin-top: 30px;
}
.body-4 .text-block .button{
    width: 100%;
    max-width: 215px;
}
.call-us-big{
    margin-top: 61px;
    font-family: "Playfair Display", serif;
    font-size: clamp(24px, 2.5vw, 48px);
    line-height: 1.2;
    color: var(--primary);
}
.call-us-big a{
    display: block;
    color: var(--secondary);
}
.call-us-big a:hover{
    color: var(--primary);
}
@media screen and (max-width: 1360px) {
    .call-us-big{
        font-size: clamp(24px, 2vw, 48px);
    }
}
@media screen and (max-width: 1280px) {
    .body-4 .container-fluid {
        padding-inline: 30px;
    }
    .body-4 {
        padding-block: 150px 150px;
    }
    .body-4 .text-block {
        padding-block: 70px;
        padding-inline: 40px;
    }
    .call-us-big {
        margin-top: 40px;
        font-size: 28px
    }
}
@media screen and (max-width: 767px) {
    .body-4 {
        padding-block: 70px 70px;
    }
    .body-4 .c-row{
        flex-direction: column-reverse;
    }
    .body-4 .img-block {
        width: 100%;
    }
    .body-4 .text-block{
        width: 100%;
        padding-block: 30px;
        padding-inline: 30px;
        justify-content: flex-start;
        background-size:contain;
        background-position: center;
    }
    .call-us-big {
        margin-top: 30px;
        font-size: 24px
    }
    .body-4 .img-block img{
        max-height: 580px;
        object-position: top;
    }
}
@media screen and (max-width: 525px) {
    .body-4 .img-block img{
        max-height: 450px;
        object-position: top;
    }
}
/**************************************
BODY 5
**************************************/
.body-5{
    position: relative;
}
.body-5 .body-5-text{
    padding-block: 50px;
    position: absolute;
    inset: 0;
    color: #fff;
    display: flex;
    justify-content: center;
}
.body-5 .body-5-text .container{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.body-5 .body-5-text .container > div{
    padding-right: 70px;
}
.body-5 .body-5-text h2{
    display: flex;
    grid-gap: 32px;
}
.body-5 .body-5-text h2 span{
    max-width: 815px;
}
.body-5 .body-5-text h2 img{
    flex-shrink: 0;
    margin-block: auto;
}
.body-5 .body-5-text .button{
    margin-top: 42px;
    margin-left: calc(117px + 32px);
}
.body-5 .body-5-img img{
    width: 100%;
    min-height: 300px;
    object-fit: cover;
}
@media screen and (max-width:991px) {
    .body-5 .body-5-text{
        position: relative;
        z-index: 1;
        inset: 0;
    }
    .body-5 .body-5-img{
        position: absolute;
        inset: 0;
    }
    .body-5 .body-5-img img {
        height: 100%;
        min-height: unset;
    }
}
@media screen and (max-width:767px) {
    .body-5 .body-5-text .container > div{
        padding-right: 0;
    }
    .body-5 .body-5-text h2 img{
        width: 50px;
        margin-block: 0 auto;
    }
    .body-5 .body-5-text .button {
        margin-top: 30px;
        margin-left: calc(50px + 32px);
    }
}
/**************************************
TESTIMONIAL
**************************************/
.testimonial{
    margin-top: 200px;
    padding-block: 30px calc(210px + 131px);
    position: relative;
}
.testimonial .heading-2 .sub-heading{
    color: var(--secondary);
}
.testimonial::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    background-image: url(../images/arrow-bg.png);
    background-size: auto;
    background-repeat: no-repeat;
    background-position: left calc(50% + 85px) top 0;
}
.testimonial-slider{
    margin-top: 49px;
    padding-left: 190px;
    /* max-width: 1370px; */
}
.testimonial-card{
    display: flex;
}
.testimonial-card .text-left{
    flex-shrink: 0;
    min-width: 190px;
}
.testimonial-card .text-left span{
    display: block;
}
.testimonial-card .text-left .name{
    font-size: 13px;
    font-weight: var(--semibold);
    color: var(--secondary);
    letter-spacing: 3px;
}
.testimonial-card .text-left .profile-title{
    margin-top: 9px;
    font-size: 16px;
    font-weight: var(--regular);
    color: var(--primary);
}
.testimonial-card .text-right{
    flex-grow: 1;
    padding-left: 93px;
}
.testimonial-card .text-right h5{
    font-weight: var(--semibold);
    font-style: italic;
}
.testimonial-slider .owl-dots{
    margin-top: 70px;
    padding-left: calc(190px + 93px);
}
@media screen and (max-width:1280px) {
    .testimonial{
        padding-block: 150px 150px;
    }
    .testimonial::after{
        background-size: clamp(200px, 20%, 300px);
        background-position: right 5% bottom 15%;
    }
    .testimonial-slider{
        padding-left: 0;
    }
}
@media screen and (max-width:767px) {
    .testimonial{
        margin-top: 0;
        padding-block: 100px 40px;
    }
    .testimonial::after{
        background-size: 150px;
        background-position: right bottom;
    }
    .testimonial-card{
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }
    .testimonial-card .text-left{
        margin-top: 30px;
        width: 100%;
    }
    .testimonial-card .text-right{
        width: 100%;
        padding-left: 0;
    }
    .testimonial-slider .owl-dots{
        padding-left: 0;
    }
}
/**************************************
OWL DOTS
**************************************/
.owl-dots button{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--primary) !important;
    opacity: 0.10;
    margin-inline: 5px;
}
.owl-dots button.active{
    opacity: 1;
}
/**************************************
THANK YOU  MESSAGE
**************************************/
.hero-banner .banner-form.submitted .only-form {
    opacity: 0;
    visibility: hidden;
}
.hero-banner .banner-form.submitted .banner-form-inner{
    position: relative;
}
.hero-banner .banner-form.submitted .thank-you-message {
    padding: 15px;
    position: absolute;
    inset: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
/*rcb*/
.rcb-block.submitted{
    display: flex;
    align-items: center;
}
/**************************************
RESPONSIVE
**************************************/
.mobile-device{
    display: none;
}
@media screen and (max-width:1280px) {
    .desktop-device{
        display: none;
    }
    .mobile-device{
        display: block;
    }   
}