.btn-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: white;
    padding: 5px 10px;
    border-radius: 100px;
    height: 50px;
    width: 220px;
    background: linear-gradient(45deg, var(--roxin-v1), var(--azulzin-v1));
    cursor: pointer;
}

asterisco{
    color: var(--roxin-v1);
    font-weight: 700;
}

.btn-arrow {
    &::after {
        transform: rotate(180deg);
        content: "";
        display: inline-block;
        width: 24px;
        height: 24px;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M17 11H9.41l3.3-3.29a1 1 0 1 0-1.42-1.42l-5 5a1 1 0 0 0-.21.33a1 1 0 0 0 0 .76a1 1 0 0 0 .21.33l5 5a1 1 0 0 0 1.42 0a1 1 0 0 0 0-1.42L9.41 13H17a1 1 0 0 0 0-2'/%3E%3C/svg%3E");
    }
}

.btn-flow {
    width: 250px;
    gap: 10px;
    height: 55px !important;
    min-height: 55px;

    &::before {
        content: "";
        display: inline-block;
        width: 24px;
        height: 24px;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M11.95 18q.525 0 .888-.363t.362-.887t-.362-.888t-.888-.362t-.887.363t-.363.887t.363.888t.887.362m-.9-3.85h1.85q0-.825.188-1.3t1.062-1.3q.65-.65 1.025-1.238T15.55 8.9q0-1.4-1.025-2.15T12.1 6q-1.425 0-2.312.75T8.55 8.55l1.65.65q.125-.45.563-.975T12.1 7.7q.8 0 1.2.438t.4.962q0 .5-.3.938t-.75.812q-1.1.975-1.35 1.475t-.25 1.825M12 22q-2.075 0-3.9-.787t-3.175-2.138T2.788 15.9T2 12t.788-3.9t2.137-3.175T8.1 2.788T12 2t3.9.788t3.175 2.137T21.213 8.1T22 12t-.788 3.9t-2.137 3.175t-3.175 2.138T12 22m0-2q3.35 0 5.675-2.325T20 12t-2.325-5.675T12 4T6.325 6.325T4 12t2.325 5.675T12 20m0-8'/%3E%3C/svg%3E");
    }
}

.line-idez {
    position: relative;
    display: flex;
    align-items: center;
    place-content: center;

    &::before {
        content: "";
        height: 3px;
        border-radius: 100px;
        background-color: var(--azulzin-v1);
        position: absolute;
        bottom: -8px;
        width: 40%;
        transition: 0.3s;
    }
}

cursor {
    position: fixed;
    width: 40px;
    height: 40px;
    /* background: var(--roxin-v1); */
    border-radius: 100px;
    border: 2px solid var(--roxin-v1);
    opacity: 0.5;
    /* transition: 0.1s; */
}



line {
    /* position: static; */
    /* content: ""; */
    display: block;
    /* width: 100vw; */
    height: 40%;
    /* bottom: 0px; */
    scale: 1.5 1;
    translate: 0 -100px;
    background-image: url("../img/line-section.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    overflow: hidden;
    z-index: 100 !important;

    height: 300px;
    /* altura final que você quer */
    overflow: hidden;
    /* isso sim corta o layout */
    /* background-color: red; */
    /* clip-path: inset(110px 0 110px 0); */
    /* overflow: hidden;   */
}


.info {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 20px;
    position: relative;

    img {
        border-radius: 10px;
    }

    h3 {
        margin-bottom: 100px;
    }

    label {
        background: linear-gradient(45deg, var(--roxin-v1), var(--azulzin-v1));
        position: absolute;
        right: 0;
        translate: -300px 120px;
        color: white;
        padding: 15px;
        border-radius: 7px;
        box-shadow: rgba(0, 0, 0, 0.165) 0px 0px 30px 10px;
        animation: fly-slow 1s infinite alternate-reverse;

        display: flex;
        flex-direction: row;
        gap: 6px;
        align-items: center;
        user-select: none;
        pointer-events: none;
        /* &:hover{
            background: white;
            color: black;

            >svg{
                filter: invert(1)
            }
        } */

        &:nth-of-type(2) {
            translate: 30px 190px;
        }

        &:nth-of-type(3) {
            translate: -200px 280px;
        }

    }
}

icon-people {
    position: fixed;
    right: 40px;
    bottom: 40px;
    cursor: pointer;
    z-index: 500;
    animation: wave 1.5s infinite alternate-reverse;
    transition: 0.4s;
    z-index: 9999;

    &:hover {
        transform: rotate(5deg);
    }
}

.modal-invisible {
    visibility: hidden;
    display: none;
}

modal-question {
    width: 100%;
    height: 100%;
    background: rgba(89, 89, 89, 0.264);
    backdrop-filter: blur(20px);
    position: fixed;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;

    >div {
        padding: 10px;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 300px;
        border-radius: 10px;
        height: 200px;
        color: black;
        background-color: white;

        span {
            font-size: 18px;
        }

        input {
            padding: 10px;
            outline: 1px solid silver;
            border: none;
            border-radius: 5px;

            &::placeholder {
                color: silver;
            }
        }

        button {
            padding: 10px;
            border: none;
            color: white;
            border-radius: 5px;
            background: var(--azulzin-v1);
            cursor: pointer;


        }

        label {
            font-size: 10px;
            color: silver;
            margin-top: 5px;
            cursor: pointer;
        }
    }
}


svg.pulse-svg {
    translate: -12px -200px;
    overflow: visible;

    .first-circle {
        fill: var(--roxin-v1);
        transform: scale(0.5);
        transform-origin: center center;
        animation: pulse-me 3s linear infinite;
    }

    .second-circle {
        fill: var(--roxin-v1);
        transform: scale(0.5);
        transform-origin: center center;
        animation: pulse-me 2s linear infinite;
    }


    .third-circle {
        fill: var(--roxin-v1);
        transform: scale(0.5);
        transform-origin: center center;
        animation: pulse-me 1s linear infinite;
    }
}

.carrossel {

    * {
        user-select: none;
    }



    >div {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        z-index: 0;
        /* background-color: red; */

        &::before,
        &::after {
            /* display: none; */
            position: absolute;
            content: "";
            width: 1000px;
            z-index: 10;
            height: 300px;
            border-radius: 50%;
            scale: 1.1 0.3;
            background-color: var(--white-n);
            /* outline: 1px solid black; */
        }

        &::before {
            z-index: 1;
            top: -36px;
        }

        &::after {
            /* outline: 1px solid black; */
            /* top: 485px; */
            top: 237px;
        }

        >img {
            width: 400px;
            height: 331px;
          

            &:first-child,
            &:last-child {
                filter: grayscale(1);
                transform: scale(0.7);
            }


            &:first-child {
                translate: 50px;
    
            }

            &:last-child {
                translate: -50px;
            }

        }
    }
}

.about-carrossel {
    display: flex;
    z-index: 900;
    flex-direction: row;
    gap: 30px;
    translate: 0px -60px;

    .descricao-lista {
        text-align: center;

        gap: 10px;

        ul {
            list-style: none;
            padding: 0;
            margin: 0;
            gap: 10px;
            display: flex;
            flex-direction: column;
            /* background-color: red; */
        }

        li {
            list-style-type: none;
            display: flex;
            align-items: center;
            gap: 10px;
            font-weight: 300;

            &::before {
                content: "";
                display: inline-block;
                width: 24px;
                height: 24px;
                background-repeat: no-repeat;
                background-size: 100% 100%;
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%232ec84e' fill-rule='evenodd' d='M12 21a9 9 0 1 0 0-18a9 9 0 0 0 0 18m-.232-5.36l5-6l-1.536-1.28l-4.3 5.159l-2.225-2.226l-1.414 1.414l3 3l.774.774z' clip-rule='evenodd'/%3E%3C/svg%3E");
                /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%237cf258' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M20 7L10 17l-5-5'/%3E%3C/svg%3E"); */
            }
        }
    }

    span {
        display: flex;
        align-items: center;

        &:hover {
            cursor: pointer;

        }


        &::before {
            content: "";
            display: inline-block;
            width: 55px;
            height: 54px;
            background-repeat: no-repeat;
            background-size: 100% 100%;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24'%3E%3Cpath fill='%236B14F7' d='M15.048 13.78a.75.75 0 0 0 1.06-1.06l-3.25-3.25a.75.75 0 0 0-1.06 0l-3.25 3.25a.75.75 0 1 0 1.06 1.06l2.72-2.72z'/%3E%3Cpath fill='%236B14F7' fill-rule='evenodd' d='M12.328 2c-5.523 0-10 4.477-10 10s4.477 10 10 10s10-4.477 10-10s-4.477-10-10-10m-8.5 10a8.5 8.5 0 1 1 17 0a8.5 8.5 0 0 1-17 0' clip-rule='evenodd'/%3E%3C/svg%3E");
        }

        &:first-child::before {
            transform: rotate(-90deg);
        }

        &:last-child::before {
            transform: rotate(90deg);
        }
    }

    p {
        width: 500px;
        text-align: center;
        font-weight: 300;
        font-size: 16px;

    }
}


.show-in-carrossel {
    animation: show-side-in 0.3s;
}

.show-out-carrossel {
    animation: show-side-out 0.3s;
}


@keyframes show-side-in {
    from {
        opacity: 0;
        translate: 100px;
    }
}


@keyframes show-side-out {
    from {
        opacity: 0;
        translate: -100px;
    }
}

@keyframes fly-slow {
    to {
        opacity: 0.7;
        /* top: 10px; */
        /* background: red; */
        /* translate: 0  160px; */
    }
}


@keyframes pulse-me {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }

    50% {
        opacity: 0.1;
    }

    70% {
        opacity: 0.09;
    }

    100% {
        transform: scale(5);
        opacity: 0;
    }
}