.fv-decoration-01 {
    display: inline-block;
    width: 34dvw;
    height: 10dvh;
    margin: 0;
    border-radius: 50px;
    background: linear-gradient(270deg, #99b1ff, #a4f7eb, #55c6b4);
    background-size: 600% 600%;
    animation: gradientAnimation 10s ease infinite, riseFromBottomLeft 1s ease-out forwards;
    transform: rotate(-35deg);
    position: absolute;
    z-index: 1;
    right: -13%;
    bottom: 0;
    opacity: 0;
}

.fv-decoration-02 {
    position: absolute;
    display: inline-block;
    width: 34dvw;
    height: 10dvh;
    margin: 0;
    border-radius: 50px;
    z-index: 2;
    right: -14%;
    bottom: -1%;
    background: none;
}

.fv-decoration-02::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50px;
    padding: 2px;
    background: linear-gradient(270deg, #a4f7eb, #55c6b4);
    background-size: 600% 600%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: gradientAnimation 15s ease infinite, riseFromLeftBottom 1.2s ease-out forwards;
    transform: rotate(-35deg);
    box-sizing: border-box;
    pointer-events: none;
    opacity: 0;
}

.fv-decoration-03 {
    display: inline-block;
    width: 21dvw;
    height: 6dvh;
    margin: 0;
    border-radius: 50px;
    background: linear-gradient(270deg, #a4f7eb, #99b1ff, #55c6b4);
    background-size: 600% 600%;
    animation: gradientAnimation 10s ease infinite, riseFromBottomLeft 1s ease-out forwards;
    transform: rotate(-45deg);
    position: absolute;
    z-index: 1;
    right: 15%;
    top: 3%;
    opacity: 0;
}

.fv-decoration-04 {
    position: absolute;
    display: inline-block;
    width: 21dvw;
    height: 6dvh;
    margin: 0;
    border-radius: 50px;
    z-index: 2;
    right: 14%;
    top: 4%;
    background: none;
}

.fv-decoration-04::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50px;
    padding: 2px;
    background: linear-gradient(270deg, #99b1ff, #55c6b4);
    background-size: 600% 600%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: gradientAnimation 15s ease infinite, riseFromLeftBottom 1.2s ease-out forwards;
    transform: rotate(-45deg);
    box-sizing: border-box;
    pointer-events: none;
    opacity: 0;
}

.fv-decoration-05 {
    display: inline-block;
    width: 40dvw;
    height: 7dvh;
    margin: 0;
    border-radius: 50px;
    background: linear-gradient(270deg, #99b1ff, #a4f7eb, #55c6b4);
    background-size: 600% 600%;
    animation: gradientAnimation 10s ease infinite, riseFromBottomLeft 1s ease-out forwards;
    transform: rotate(-45deg);
    position: absolute;
    z-index: 1;
    left: -21%;
    top: 17%;
    opacity: 0;
}

.fv-decoration-06 {
    position: absolute;
    display: inline-block;
    width: 40dvw;
    height: 7dvh;
    margin: 0;
    border-radius: 50px;
    z-index: 2;
    left: -20%;
    top: 17%;
    background: none;
}

.fv-decoration-06::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50px;
    padding: 2px;
    background: linear-gradient(270deg, #a4f7eb, #99b1ff, #55c6b4);
    background-size: 600% 600%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: gradientAnimation 15s ease infinite, riseFromLeftBottom 1.2s ease-out forwards;
    transform: rotate(-45deg);
    box-sizing: border-box;
    pointer-events: none;
    opacity: 0;
}

.fv-decoration-07 {
    display: inline-block;
    width: 21dvw;
    height: 6dvh;
    margin: 0;
    border-radius: 50px;
    background: linear-gradient(270deg, #99b1ff, #a4f7eb, #55c6b4);
    background-size: 600% 600%;
    animation: gradientAnimation 10s ease infinite, riseFromBottomLeft 1s ease-out forwards;
    transform: rotate(-45deg);
    position: absolute;
    z-index: 1;
    left: -4%;
    bottom: 0;
    opacity: 0;
}

.fv-decoration-08 {
    position: absolute;
    display: inline-block;
    width: 21dvw;
    height: 7dvh;
    margin: 0;
    border-radius: 50px;
    z-index: 2;
    left: -3%;
    bottom: 0;
    background: none;
}

.fv-decoration-08::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50px;
    padding: 2px;
    background: linear-gradient(270deg, #99b1ff, #55c6b4);
    background-size: 600% 600%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: gradientAnimation 15s ease infinite, riseFromLeftBottom 1.2s ease-out forwards;
    transform: rotate(-45deg);
    box-sizing: border-box;
    pointer-events: none;
    opacity: 0;
}

@keyframes gradientAnimation {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes riseFromBottomLeft {
    0% {
        transform: translate(-100px, 100px) rotate(-40deg);
        opacity: 0;
    }
    100% {
        transform: translate(0, 0) rotate(-40deg);
        opacity: 0.5;
    }
}

@keyframes riseFromLeftBottom {
    0% {
        transform: translate(-100px, 100px) rotate(-40deg);
        opacity: 0;
    }
    100% {
        transform: translate(0, 0) rotate(-40deg);
        opacity: 0.5;
    }
}

.fv-decoration-01,
.fv-decoration-02::before,
.fv-decoration-03,
.fv-decoration-04::before,
.fv-decoration-05,
.fv-decoration-06::before,
.fv-decoration-07,
.fv-decoration-08::before {
    animation-fill-mode: forwards; 
}

.fv-decoration-01 { animation-delay: 0s; }
.fv-decoration-02::before { animation-delay: 0.3s; }
.fv-decoration-03 { animation-delay: 0.6s; }
.fv-decoration-04::before { animation-delay: 0.9s; }
.fv-decoration-05 { animation-delay: 1.2s; }
.fv-decoration-06::before { animation-delay: 1.5s; }
.fv-decoration-07 { animation-delay: 1.8s; }
.fv-decoration-08::before { animation-delay: 2.1s; }


@media screen and (max-width: 768px) {
    .fv-decoration-01,.fv-decoration-02,.fv-decoration-03,.fv-decoration-04,
    .fv-decoration-05,.fv-decoration-06,.fv-decoration-07,.fv-decoration-08 {
        display: none;
    }
}

.chevrons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.chevrons span {
    width: 60px;
    height: 25px;
    background: url(../../../../images/readyfor/ico-arrow.png) no-repeat 0 0;
    background-size: 100%;
    display: block;
    margin-bottom: -18px;
}

.chevrons span {
    animation: scrollDown 1.5s infinite;
}

.chevrons span:nth-child(2) {
    animation-delay: 0.2s;
}

.chevrons span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes scrollDown {
    0% {
        transform: rotate(0deg) translateY(0);
        opacity: 0;
    }
    30% {
        opacity: 1;
    }
    60% {
        transform: rotate(0deg) translateY(0);
        opacity: 1;
    }
    100% {
        transform: rotate(0deg) translateY(0);
        opacity: 0;
    }
}