@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Manrope:wght@400;500;600&display=swap');


.envoris-elementor-hero-section{
    --envoris-navy:#03345D;
    --envoris-navy-hover:#022A4C;
    --envoris-text:#33434F;

    --envoris-font:
        "Inter",
        Arial,
        sans-serif;

    --envoris-heading:
        "Manrope",
        Arial,
        sans-serif;

    width:100%;
    margin:0;

    padding:32px 0 0;

    background:#FFFFFF;

    font-family:
        var(--envoris-font);
}


.envoris-elementor-hero{
    --envoris-hero-max-width:1480px;

    position:relative;

    width:min(
        var(--envoris-hero-max-width),
        calc(100% - 36px)
    );

    min-height:600px;

    margin:0 auto;

    display:flex;
    align-items:center;

    overflow:hidden;

    border-radius:22px;

    background-image:
        linear-gradient(
            90deg,
            rgba(255,255,255,1) 0%,
            rgba(255,255,255,.99) 18%,
            rgba(255,255,255,.96) 29%,
            rgba(255,255,255,.88) 38%,
            rgba(255,255,255,.68) 47%,
            rgba(255,255,255,.40) 55%,
            rgba(255,255,255,.15) 63%,
            rgba(255,255,255,0) 73%
        ),
        var(--envoris-hero-image);

    background-size:
        cover,
        cover;

    background-position:
        center right;

    background-repeat:
        no-repeat;

    box-shadow:
        0 14px 38px
        rgba(3,52,93,.07);
}


.envoris-elementor-hero::after{
    content:"";

    position:absolute;
    inset:0;

    z-index:1;

    pointer-events:none;

    background:
        linear-gradient(
            to top,
            rgba(255,255,255,.10) 0%,
            rgba(255,255,255,0) 34%
        );
}


.envoris-elementor-hero-inner{
    position:relative;
    z-index:3;

    width:100%;

    padding:82px 78px;
}


.envoris-elementor-hero-content{
    width:100%;
    max-width:540px;
}


.envoris-elementor-hero-eyebrow{
    display:flex;
    align-items:center;

    gap:13px;

    margin:0 0 17px;

    color:#60798D;

    font-family:
        var(--envoris-heading);

    font-size:10px;
    line-height:1;

    font-weight:600;

    letter-spacing:.20em;
    text-transform:uppercase;
}


.envoris-elementor-hero-eyebrow::before{
    content:"";

    flex:0 0 auto;

    width:28px;
    height:1px;

    background:
        var(--envoris-navy);
}


.envoris-elementor-hero-title{
    max-width:540px;

    margin:0;

    color:
        var(--envoris-navy);

    font-family:
        var(--envoris-heading) !important;

    font-size:
        clamp(
            50px,
            4.1vw,
            68px
        );

    line-height:1.02;

    font-weight:500;

    letter-spacing:-.045em;
}


.envoris-elementor-hero-title span{
    display:block;
}


.envoris-elementor-hero-text{
    max-width:435px;

    margin:24px 0 0;

    color:
        var(--envoris-text);

    font-family:
        var(--envoris-font);

    font-size:15px;
    line-height:1.7;

    font-weight:400;
}


.envoris-elementor-hero-buttons{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    margin-top:30px;
}


.envoris-elementor-hero-btn{
    min-height:54px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:17px;

    padding:0 28px;

    background:
        var(--envoris-navy);

    color:#FFFFFF !important;

    border:
        1px solid
        var(--envoris-navy);

    border-radius:28px;

    font-family:
        var(--envoris-heading);

    font-size:13px;
    line-height:1;

    font-weight:500;

    text-decoration:none !important;

    box-shadow:
        0 7px 18px
        rgba(3,52,93,.13);

    transition:
        background .22s ease,
        border-color .22s ease,
        transform .22s ease,
        box-shadow .22s ease;
}


.envoris-elementor-hero-btn:hover{
    background:
        var(--envoris-navy-hover);

    border-color:
        var(--envoris-navy-hover);

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 22px
        rgba(3,52,93,.17);
}


.envoris-elementor-hero-arrow{
    font-size:18px;
    font-weight:300;
}


.envoris-elementor-reveal{
    opacity:0;

    transform:
        translateY(12px);

    animation:
        envorisElementorHeroReveal
        .65s ease forwards;
}


.envoris-elementor-delay-1{
    animation-delay:.08s;
}


.envoris-elementor-delay-2{
    animation-delay:.16s;
}


.envoris-elementor-delay-3{
    animation-delay:.24s;
}


@keyframes envorisElementorHeroReveal{

    to{
        opacity:1;
        transform:translateY(0);
    }

}


/* TABLET */

@media(max-width:1100px){

    .envoris-elementor-hero-section{
        padding-top:27px;
    }


    .envoris-elementor-hero{
        width:
            calc(100% - 30px);

        min-height:550px;

        border-radius:18px;

        background-position:
            63% center;
    }


    .envoris-elementor-hero-inner{
        padding:
            65px 48px;
    }


    .envoris-elementor-hero-content{
        max-width:470px;
    }


    .envoris-elementor-hero-title{
        font-size:54px;
    }

}


/* MOBILE */

@media(max-width:767px){

    .envoris-elementor-hero-section{
        padding-top:18px;
    }


    .envoris-elementor-hero{
        width:
            calc(100% - 18px);

        min-height:650px;

        align-items:flex-end;

        border-radius:15px;

        background-image:
            linear-gradient(
                to top,
                rgba(255,255,255,1) 0%,
                rgba(255,255,255,.99) 34%,
                rgba(255,255,255,.94) 45%,
                rgba(255,255,255,.68) 57%,
                rgba(255,255,255,.28) 68%,
                rgba(255,255,255,0) 79%
            ),
            var(--envoris-hero-image);

        background-size:
            cover,
            cover;

        background-position:
            68% center;

        background-repeat:
            no-repeat;
    }


    .envoris-elementor-hero-inner{
        padding:
            290px 24px 46px;
    }


    .envoris-elementor-hero-content{
        max-width:none;
    }


    .envoris-elementor-hero-eyebrow{
        margin-bottom:14px;

        font-size:9px;
    }


    .envoris-elementor-hero-title{
        max-width:100%;

        font-size:
            clamp(
                42px,
                12vw,
                54px
            );

        line-height:1.02;

        letter-spacing:-.04em;
    }


    .envoris-elementor-hero-text{
        max-width:100%;

        margin-top:20px;

        font-size:14px;
        line-height:1.65;
    }


    .envoris-elementor-hero-buttons{
        margin-top:23px;
    }


    .envoris-elementor-hero-btn{
        width:100%;
    }

}


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

    .envoris-elementor-reveal{
        opacity:1;

        transform:none;

        animation:none;
    }

}
