/* -------------------PRESETS------------------- */
:root {
    --inner-wrapper-width: 1400px;
    --orange-color: #ff6f3c;
    --global-font-family: 'Montserrat';
    --paragraph-font-family: 'Open Sans';
    --dark-background-color: #1a3e5c;
}

/* -------------------------------------------------------- */
/* -------------------TITLE BLOCK STYLES------------------- */
/* -------------------------------------------------------- */
.hero-section {
    display: flex;
    justify-content: center;
}

.hero-section .container .heading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* margin 16px 0; */
    margin: 0;
}

.hero-section .container .heading-container .title {
    /* text-wrap: balance; */
    /* margin-bottom: ; */
    text-align: center;
    /* max-width: 90%; */
    max-width: 1440px;
}

.hero-section .container .heading-container .description {
    /* text-wrap: balance; */
    text-align: center;
    /* max-width: 90%; */
    /* max-width: 1024px; */
}

/* -----------------RESPONSIVE TITLE BLOCK----------------- */
@media only screen and (max-width: 1536px) {
    .hero-section .container .heading-container .title {
        text-align: center;
        /* max-width: 80%; */
        max-width: 1024px;
    }

    .hero-section .container .heading-container .description {
        text-align: center;
        /* max-width: 85%; */
        max-width: 860px;
    }
}

@media only screen and (max-width: 1024px) {
    .hero-section .container .heading-container .title {
        text-align: center;
        max-width: 100%;
    }

    .hero-section .container .heading-container .description {
        text-align: center;
        max-width: 100%;
    }
}

@media only screen and (max-width: 768px) {
    .hero-section .container .heading-container {
        margin: 0;
    }

    .hero-section .container .heading-container .title {
        text-wrap: balance;
    }

    .hero-section .container .heading-container .title h1 {
        margin-bottom: 25px;
    }

    .hero-section .container .heading-container .description {
        /* text-wrap: balance; */
    }

    .hero-section .container .heading-container .description p {
        margin-bottom: 0;
    }
}

/* -------------------------------------------------------- */
/* -------------------IMAGE BANNER BLOCK------------------- */
/* -------------------------------------------------------- */
.image-banner-container {
    display: flex;
    justify-content: center;
}

.image-banner-container .image-bnr-div {
    padding: 0;
    position: relative;
    z-index: 1 !important;
    width: 100%;
}

.image-banner-container .img-bnr {
    position: relative;
    z-index: 1 !important;
    display: block;
    width: 100%;
    height: auto;
}

.image-banner-container .img-bnr img {
    width: 100%;
    height: auto;
    display: block;
}

.image-banner-container .image-banner-3 img {
    position: relative;
    left: 3.5%;
    width: 96.5%;
}

.fullscreen-img {
    display: flex;
    justify-content: center;
}

/* image 1 - big bottom left */
.image-banner-container .image-banner-1::before {
    content: '';
    position: absolute;
    width: 95%;
    height: 95%;
    background-color: #ff6f3c;
    bottom: -6.5%;
    left: -4%;
    z-index: -1;
}

/* image 2 - half top left */
.image-banner-container .image-banner-2::before {
    content: '';
    position: absolute;
    width: 45%;
    height: 50%;
    background-color: #ff6f3c;
    top: -6.5%;
    left: -4%;
    z-index: -1;
}

/* image 3 - full top left */
.image-banner-container .image-banner-3::before {
    content: '';
    position: absolute;
    width: 104%;
    height: 108%;
    background-color: #ff6f3c;
    top: -8%;
    left: -4%;
    z-index: -1;
}

/* image 4 - small top left, half bottom right */
.image-banner-container .image-banner-4::before {
    content: '';
    position: absolute;
    width: 45%;
    height: 50%;
    background-color: #ff6f3c;
    bottom: -6.5%;
    right: -4%;
    z-index: -1;
}

.image-banner-container .image-banner-4::after {
    content: '';
    position: absolute;
    width: 20%;
    height: 32%;
    background-color: #ff6f3c;
    top: -6.5%;
    left: -4%;
    z-index: -1;
}

/* -------------------------------------------------------- */
/* -----------------------CARDS BLOCK---------------------- */
/* -------------------------------------------------------- */
/* -------------------CARDS BLOCK PRESETS------------------- */
/* start orange button preset */
.btn_orange {
    position: relative;
    display: block;
    padding: 16px 24px;
    background: linear-gradient(90deg, #ff6f3c, #ff6f3c);
    color: white;
    overflow: hidden;
    text-decoration: none;
    outline: 1px solid transparent;
    outline-offset: 0;
    transition: outline-color 0.3s ease;
    cursor: pointer;
    overflow: initial;
}

.btn_orange>span {
    font-weight: 600;
}

.btn_orange::before,
.btn_orange::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
    z-index: 0;
}

.btn_orange::before {
    background: linear-gradient(90deg, #1a3e5c, #1a3e5c);
}

.btn_orange::after {
    background: linear-gradient(90deg, rgba(26, 62, 92, 0.9), rgba(255, 111, 60, 0.9));
}

.btn_orange.hovered::before {
    opacity: 1;
}

.btn_orange.hovered {
    outline-color: white !important;
}

.btn_orange.leaving::after {
    opacity: 1;
}

span {
    position: relative;
    z-index: 1 !important;
}

/* end orange button preset */
/* -------------------CARD BLOCK STYLES------------------- */
/* use this class when 2 cards */
.variant-0 {
    display: grid;
    grid-template-columns: 50% 50% !important;
}

.cards-div {
    display: flex;
    justify-content: center;
}

.cards-div .container {
    display: flex;
    justify-content: center;
}

.cards-div .container .cards-container {
    display: grid;
    grid-template-columns: 33% 33% 33%;
    gap: 2%;
    justify-content: center;
    margin-top: 32px;
    margin-bottom: 32px;
}

.cards-div .container .cards-container .card {
    max-width: 719px;
    position: relative;
    z-index: 0;
    outline: 1px solid #adadad;
    width: 100%;
    min-height: auto;
    padding: 24px;
}

.cards-div .container .cards-container .card .card-img {
    width: 50px;
}

.cards-div .container .cards-container .card .card-text {
    position: relative;
    overflow: hidden;
}

.cards-div .container .cards-container .card h4 {
    margin-bottom: 0px;
}

.cards-div .container .cards-container .card .card-text p {
    /* was fs18 */
    line-height: 150%;
}

.card-text p {
    padding-bottom: 80px;
    margin-bottom: 0;
}

.cards-div .container .cards-container .card-inner-container {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
}

.cards-div .container .cards-container .card .overlay-block {
    background-color: var(--orange-color);
    color: white;
    text-decoration: none;
    position: absolute;
    border-top: 13px solid #adadad;
    border-left: 13px solid #adadad;
    border-bottom: 16px solid white;
    border-right: 16px solid white;
    outline: 15px solid white;
    outline-offset: -14px;
    bottom: -1px;
    right: -1px;
    padding: 16px 24px;
    font-weight: 600;
    z-index: 300;
    box-shadow: -1px -1px 0px 1px #adadad;
    font-size: 16px;

}

/* -------------------RESPONSIVE CARDS BLOCK------------------- */
@media only screen and (max-width: 1536px) {

    .card-text p {
        font-size: 16px;
    }

    .cards-div .container .cards-container .card .overlay-block {
        border-top: 10px solid #adadad !important;
        border-left: 10px solid #adadad !important;
        border-bottom: 10px solid white !important;
        border-right: 10px solid white !important;
        outline: 11px solid white !important;
        outline-offset: -10px !important;
    }
}

@media only screen and (max-width: 1200px) {
    .cards-div .container .cards-container {
        width: initial;
    }

    .cards-container .card {
        padding: 16px !important;
    }

    .cards-div .container .cards-container .card .overlay-block {
        border-top: 7px solid #adadad !important;
        border-left: 7px solid #adadad !important;
        border-bottom: 7px solid white !important;
        border-right: 7px solid white !important;
        outline: 8px solid white !important;
        outline-offset: -7px !important;
    }
}

@media only screen and (max-width: 1024px) {
    .card-text p {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {

    /* use this class when 2 cards */
    .variant-0 {
        display: grid;
        grid-template-columns: 100% !important;
    }

    .cards-div .container .cards-container {
        display: grid;
        grid-template-columns: 100%;
        gap: 20px;
        justify-content: center;
    }

    .cards-div .container .cards-container .card {
        width: 100%;
    }

}

/* -------------------------------------------------------- */
/* ----------------WHY CHOOSE AMENEX STYLES---------------- */
/* -------------------------------------------------------- */

.choose-amenex-section {
    background: radial-gradient(circle at 10% 90px, rgba(255, 102, 0, 0.3), transparent 300px), radial-gradient(circle at 100% 250px, rgba(255, 102, 0, 0.3), transparent 300px), #1a3e5c;
    position: relative;
}

.choose-amenex-section .whychoose-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    /* Allows clicks to pass through */
    z-index: 2;
    overflow: hidden;
}

.choose-amenex-section .whychoose-overlay-svg {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.choose-amenex-section .whychoose-overlay-svg-mobile {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.choose-amenex-section .choose-amenex-block {
    padding-top: 8%;
    padding-bottom: 12%;
}

.choose-amenex-section .choose-amenex-block .container {
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: 50% 50%;
    gap: 5%;
    align-items: center;
}

.choose-amenex-section .choose-amenex-block .container .amenex-q {
    justify-self: center;
}

.choose-amenex-section .choose-amenex-block .container .amenex-q h2,
.choose-amenex-section .choose-amenex-block .container .amenex-q p {
    text-align: start;
    color: white;
}

.choose-amenex-section .choose-amenex-block .container .amenex-a ul {
    padding: 0;
}

.choose-amenex-section .choose-amenex-block .container .amenex-a ul li {
    list-style: none;
    margin-top: 16px;
    display: flex;
    align-items: center;
}

.choose-amenex-section .choose-amenex-block .container .amenex-a ul li img {
    width: 50px;
    height: 50px;
    margin-right: 20px;
    flex-shrink: 0;
}

.choose-amenex-section .choose-amenex-block .container .amenex-a ul li p {
    color: white !important;
    font-weight: 500;
    margin: 0;
}

/* --------------WHY CHOOSE AMENEX RESPONSIVE-------------- */
@media only screen and (max-width: 1536px) {
    .choose-amenex-block {
        padding-top: 7%;
        padding-bottom: 10%;
    }


    body .cta-section .cta-block .full-container .left-arrow-container .arrow-svg {
        transform: translateY(25px);
    }
}

@media only screen and (max-width: 1200px) {
    /* nothing yet */
}

@media only screen and (max-width: 768px) {
    .whychoose-overlay-svg {
        display: none !important;
    }

    .whychoose-overlay-svg-mobile {
        display: block !important;
    }

    .choose-amenex-section {
        padding: 40px 0;
    }

    .choose-amenex-section .choose-amenex-block {
        padding-top: 0;
        padding-bottom: 10%;
    }

    .choose-amenex-section .choose-amenex-block .container {
        grid-template-columns: auto;
        gap: 40px;
        text-align: center;
        padding: 0 15px;
    }

    .choose-amenex-section .choose-amenex-block .container .amenex-q h2,
    .choose-amenex-section .choose-amenex-block .container .amenex-q p {
        text-align: center;
    }

    .choose-amenex-section .choose-amenex-block .container .amenex-a ul {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .choose-amenex-section .choose-amenex-block .container .amenex-a ul li {
        margin-top: 32px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .choose-amenex-section .choose-amenex-block .container .amenex-a ul li:first-child {
        margin-top: 0;
    }

    .choose-amenex-section .choose-amenex-block .container .amenex-a ul li img {
        margin-right: 0;
        margin-bottom: 12px;
    }

    .choose-amenex-section .choose-amenex-block .container .amenex-a ul li p {
        margin: 0;
    }

    .card-text p {
        font-size: 14px;
    }
}

@media only screen and (max-width: 520px) {

    .choose-amenex-section .choose-amenex-block .container .amenex-q h2,
    .choose-amenex-section .choose-amenex-block .container .amenex-q p {
        margin-bottom: 10px;
    }

    .choose-amenex-section .choose-amenex-block .container {
        gap: 20px;
    }

}


/* -------------------------------------------------------- */
/* ------------------OVERLAY BLOCK ARROW------------------- */
/* -------------------------------------------------------- */
.overlay-block-container {
    position: relative;
    aspect-ratio: 16/9;
}

.overlay-block-image {
    position: absolute;
    top: 0;
    left: 0;
    /* keep 99.9% instead of 100% to avoid clipping in chrome browsers */
    width: 99.9%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    will-change: transform;

}

.overlay-block-arrow {
    background-color: #FF6600;
    color: white;
    text-decoration: none;
    position: absolute;
    border: 8px solid white;
    outline: 7px solid white;
    outline-offset: -6px;
    bottom: -1px;
    right: -7px;
    padding: 8px;
    z-index: 2;
}

.overlay-block-arrow span {
    display: flex;
}

.overlay-block-arrow span svg {
    width: 40px;
    height: 40px;
}

/* -------------OVERLAY BLOCK ARROW RESPONSIVE------------- */
@media only screen and (max-width: 1440px) {

    .overlay-block-arrow {
        border: 7px solid white;
    }
}

@media only screen and (max-width: 520px) {
    .overlay-block-arrow span svg {
        width: 30px;
        height: 30px;
    }
}

/* -------------------------------------------------------- */
/* -------------------CTA BLOCK STYLES--------------------- */
/* -------------------------------------------------------- */
/* CTA Block Button Presets */
.cta-section .btn_transparent {
    background: transparent;
    box-sizing: border-box;
    border: 1px solid white;
    transition: box-shadow 0.2s ease;
}

.cta-section .btn_transparent:hover {
    box-shadow: 0 0 0 2px white;
}

.cta-section .btn_transparent:active,
.cta-section .btn_transparent:focus {
    background: transparent;
    box-shadow: 0 0 0 2px white;
}

/* CTA Block Main Styles */
.cta-section .cta-block .full-container {
    position: relative;
    background: radial-gradient(circle at 220px 90px, rgba(255, 102, 0, 0.3), transparent 300px), radial-gradient(circle at 100% 250px, rgba(255, 102, 0, 0.3), transparent 300px), #1a3e5c;
}

.cta-section .cta-block .full-container .left-arrow-container {
    position: absolute;
    left: 0;
    /* top: 50%; */
    bottom: 0%;
    /* transform: translateY(-50%); */
    z-index: 3;
}

.cta-section .cta-block .full-container .left-arrow-container .arrow-svg {
    display: block;
}

.cta-section .cta-block .full-container .right-arrow-container {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.cta-section .cta-block .full-container .right-arrow-container .arrow-svg {
    display: block;
}

.cta-section .cta-block .full-container .cta-content-container {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 45px 0 55px 0;
    /* from 86px */
}

.cta-section .cta-block .full-container .cta-content-container .cta-content {
    color: white;
    align-self: center;
    text-align: center;
    z-index: 3;
}

.cta-section .cta-block .full-container .cta-content-container .cta-content h3 {
    /* .cta-section .cta-block .full-container .cta-content-container .cta-content h4 */
    margin-bottom: 20px;
    /* font-size: 48px; */
}

.cta-section .cta-block .full-container .cta-content-container .cta-content p {
    margin-bottom: 30px;
    color: white;
}

.cta-section .cta-block .full-container .cta-content-container .cta-content .buttons-wrapper {
    display: flex;
    gap: 40px;
    justify-content: center;
    margin-top: 30px;
}

.cta-section .cta-block .full-container .cta-content-container .cta-content .buttons-wrapper .btn_left,
.cta-section .cta-block .full-container .cta-content-container .cta-content .buttons-wrapper .btn_right {
    font-size: 16px;
    color: white;
    padding: 16px 24px 16px 24px;
    text-decoration: none;
    width: 100%;
    max-width: 360px;
    white-space: nowrap;
    font-family: var(--global-font-family);
    font-weight: 600;
}

.arrow-svg .stroke-2 {
    display: none;
}

path.stroke-2 {
    transform: none !important;
}

/* -------------------CTA BLOCK RESPONSIVE------------------- */
@media only screen and (max-width: 1536px) {
    .cta-section .cta-block .full-container .cta-content-container {
        padding: 35px 0 40px 0;
    }

    .cta-section .cta-block .full-container .cta-content-container .cta-content .buttons-wrapper .btn_left,
    .cta-section .cta-block .full-container .cta-content-container .cta-content .buttons-wrapper .btn_right {
        font-size: 16px;
        max-width: 310px;
    }

    .cta-section .cta-block .arrow-svg path.stroke-1 {
        display: none;
    }

    .cta-section .cta-block .arrow-svg path.stroke-2 {
        display: block;
    }
}

@media (max-width: 1400px) and (min-width:1320px) {
    .cta-section .cta-block .full-container .left-arrow-container {
        left: -40px;
    }
}

@media (max-width:1320px) {
    .cta-section .left-arrow-container .arrow-svg {
        translate: -70px 0
    }
}

@media only screen and (max-width: 1200px) {

    .cta-section .left-arrow-container .arrow-svg,
    .cta-section .right-arrow-container .arrow-svg {
        display: none !important;
    }
}

@media screen and (max-width: 1024px) {

    .cta-section .btn_left,
    .cta-section .btn_right {
        width: 360px !important;
        font-size: 16px !important;
        padding: 13px !important;
    }

    .cta-section .cta-block .full-container .cta-content-container .cta-content {
        width: 90%;
    }

}

@media only screen and (max-width: 768px) {
    .cta-section .cta-block .full-container .cta-content-container {
        padding: 32px 0;
    }

    .cta-section .cta-block .full-container .cta-content-container .cta-content h4 {
        margin-bottom: 10px;
    }

    .cta-section .cta-block .full-container .cta-content-container .cta-content p {
        text-wrap: balance;
    }

    .cta-section .cta-block .full-container .cta-content-container .cta-content .buttons-wrapper {
        margin-top: 15px;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .cta-section .buttons-wrapper .btn_left,
    .cta-section .buttons-wrapper .btn_right {
        flex-basis: 0;
        flex-grow: 1;
        width: 300px !important;
        font-size: 16px !important;
        padding: 13px !important;
    }
}








@media screen and (max-width: 1680px) {
    .cta-section .cta-block .full-container .left-arrow-container .arrow-svg {
        transform: translateY(5px);
    }

    /* responsive RIGHT line transforms */
    .cta-section .cta-block .full-container .right-arrow-container path {
        transform: scaleX(60%) translateX(200px);
    }

    .cta-section .cta-block .full-container .right-arrow-container rect {
        transform: translateX(120px);
    }

    /* responsive LEFT line transforms */
    .cta-section .cta-block .full-container .left-arrow-container path:nth-child(odd),
    .cta-section .cta-block .full-container .left-arrow-container path.stroke-2 {
        transform: scaleX(55%);
    }

    .cta-section .cta-block .full-container .left-arrow-container path:nth-of-type(2) {
        transform: translateX(-68px);
    }

    .cta-section .cta-block .full-container .left-arrow-container path:nth-of-type(4) {
        transform: translateX(-202px);
    }
}