:root {
    --vs-gn-transition: all 600ms cubic-bezier(0, 0, 0.5, 1);
}

/* ---- ANIMATIONS GENERAL ---- */
/* ---- HEADING ---- */
.vs-section .vs-header .vs-title-1__regular,
.vs-section .vs-header .vs-title-2__regular,
.vs-section .vs-header .vs-title-2__regular,
.vs-section .vs-header .vs-text {
    opacity: 0;
    transition: var(--vs-gn-transition);
    transform: translateY(25px);
}

.vs-section .vs-header .vs-title-2__regular{
    transition-delay: 150ms;
}

.vs-section .vs-header .vs-text {
    transition-delay: 200ms;
}

.vs-animate.vs-section .vs-header .vs-title-1__regular,
.vs-animate.vs-section .vs-header .vs-title-2__regular,
.vs-animate.vs-section .vs-header .vs-title-2__regular,
.vs-animate.vs-section .vs-header .vs-text {
    opacity: 1;
    transform: translateY(0);
}

/* ---- LINKS IN HEADING  ---- */
/* ---- Link page ---- */
.vs-section .vs-container .vs-link-arrow[class*="link-page"],
.vs-section .vs-wrapper .vs-link-arrow.link-page-mobile {
    opacity: 0;
    transition: var(--vs-gn-transition);
    transform: translateY(25px);
    transition-delay: 300ms;
}

.vs-section .vs-wrapper .vs-link-arrow.link-page-mobile {
    transition-delay: 1050ms;
}


.vs-animate.vs-section .vs-container .vs-link-arrow[class*="link-page"],
.vs-animate.vs-section .vs-wrapper .vs-link-arrow.link-page-mobile {
    opacity: 1;
    transform: translateY(0);
}

/* ---- CONTENT ---- */
/* ---- General  ---- */
.vs-section .vs-container + .vs-component,
.vs-section .vs-wrapper--fluid .vs-component,
.vs-section .vs-wrapper--fluid .vs-component--fluid,
    /* Specific components */
.vs-section .vs-anim-grid {
    opacity: 0;
    transform: translateY(25px);
    transition: var(--vs-gn-transition) 400ms;
}

.vs-animate.vs-section .vs-container + .vs-component,
.vs-animate.vs-section .vs-wrapper--fluid .vs-component,
.vs-animate.vs-section .vs-wrapper--fluid .vs-component--fluid,
    /* Specific components */
.vs-animate.vs-section .vs-anim-grid {
    opacity: 1;
    transform: translateY(0);
}


/* ---- ANIMATIONS FADE IN UP - PAGE LOAD ---- */
/* ---- ANIMATIONS HEROES ---- */
/* ---- Delete general configuration ---- */
.vs-section.tpl-hero .vs-wrapper--fluid .vs-component--fluid {
    transform: none;
    opacity: 1;
}

.vs-animate.vs-section.tpl-hero .vs-wrapper--fluid .vs-component--fluid {
    transform: none;
}

/* ---- Fade in up - page load ---- */
.vs-section.tpl-hero .vs-fade-in-up__load {
    opacity: 0;
    transition: all 1000ms ease-out 50ms;
}

.vs-animate.vs-section.tpl-hero .vs-fade-in-up__load {
    opacity: 1;
}

@media (min-width: 744px) {
    .vs-section.tpl-hero .vs-fade-in-up__load {
        opacity: 0;
        transform: translateY(48px);
        transition: opacity 100ms cubic-bezier(0, 0, 0.5, 1),
        transform 600ms cubic-bezier(0, 0, 0.5, 1);
    }

    .vs-section.tpl-hero .vs-fade-in-up__load:nth-of-type(2) {
        transition-delay: 350ms;
    }

    .vs-animate.vs-section.tpl-hero .vs-fade-in-up__load {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ---- ANIMATIONS FADE IN ---- */
.vs-section .vs-container + .vs-component.vs-anim-fade-in,
.vs-section .vs-container + .vs-component--fluid.vs-anim-fade-in {
    opacity: 0;
    transform: none;
    transition: all 400ms cubic-bezier(0, 0, 0.5, 1) 350ms;
}

.vs-animate.vs-section .vs-container + .vs-component.vs-anim-fade-in,
.vs-animate.vs-section .vs-container + .vs-component--fluid.vs-anim-fade-in {
    opacity: 1;
    transform: none;
}

/* ---- ANIMATIONS STAGGERED ---- */
/* Delete general configuration */
.vs-section .vs-container + .vs-component.vs-anim-staggered,
.vs-section .vs-wrapper--fluid .vs-component--fluid.vs-anim-staggered {
    transform: none;
}

.vs-animate.vs-section .vs-container + .vs-component.vs-anim-staggered,
.vs-animate.vs-section .vs-wrapper--fluid .vs-component--fluid.vs-anim-staggered {
    transform: none;
}

/*  Animation items */
.vs-section .vs-container + .vs-component.vs-anim-staggered .vs-anim-staggered__item,
.vs-section .vs-container + .vs-component--fluid.vs-anim-staggered .vs-anim-staggered__item {
    --index: none;
    opacity: 0;
    transform: translate(25px, 0);
    transition: var(--vs-gn-transition);
    transition-delay: calc(var(--index) * 200ms);
}

.vs-animate.vs-section .vs-container + .vs-component.vs-anim-staggered .vs-anim-staggered__item,
.vs-animate.vs-section .vs-container + .vs-component--fluid.vs-anim-staggered .vs-anim-staggered__item {
    opacity: 1;
    transform: none;
}

@media (min-width: 744px) {
    .vs-section .vs-container + .vs-component.vs-anim-staggered .vs-anim-staggered__item,
    .vs-section .vs-container + .vs-component--fluid.vs-anim-staggered .vs-anim-staggered__item {
        transform: translate(100px, 0);
        transition: opacity 2s ease, transform 0.6s ease;
        transition-delay: calc(var(--index) * 200ms);
    }
}