#ConfidenceSection {

    --font-family: HelveticaNeueCyr;

    margin-top: 126px;

    @media (max-width: 1239px) {
        margin-top: 80px;
    }

    .Section {
        position: relative;

        overflow: hidden;

        background-color: #101010;

        min-height: 782px;

        @media (max-width: 1239px) {
            min-height: 1050px;
        }
    }

    .Dot {
        position: absolute;

        left: 50%;
        transform: translate(-50%, 0);

        top: 270px;

        width: 11px;
        height: 11px;
        background-color: white;
        border-radius: 11px;

        @media (max-width: 1239px) {
            transform: translate(50%, 0);
            left: unset;
            right: 20vw;
            top: 488px;
        }
    }

    .Dot.Appear {
        animation: Confidence_Dot 400ms;
    }

    .Line {
        position: absolute;

        left: 50%;
        transform: translate(-50%, 0);

        top: 281px;
        width: 1px;
        height: 485px;

        background-color: #282828;

        @media (max-width: 1239px) {
            left: unset;
            right: 20vw;
            top: 499px;
            height: 490px;
        }
    }

    .Line.Appear {
        animation: Confidence_Line 1600ms;
    }

    .Photo>img {
        width: 100%;
        height: 100%;
        aspect-ratio: 1/1;
        border-radius: 100%;
    }

    .Photo1 {
        position: absolute;

        left: 40px;
        top: 0px;

        img {
            width: 230px;
            height: 230px;
        }

        @media (max-width: 1239px) {

            top: 224px;
            left: calc(50% + 22px);

            img {
                width: 80.016px;
                height: 79.992px;
            }

            flex-shrink: 0;
        }
    }

    .Photo1.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_PhotoRight 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_PhotoLeft 600ms;
        }
    }

    .Photo2 {
        position: absolute;

        left: 225px;
        top: 303px;

        img {
            width: 180px;
            height: 180px;
        }

        z-index: 109;

        @media (max-width: 1239px) {

            left: calc(50% + 72px);
            top: 320px;

            img {
                width: 80.016px;
                height: 79.992px;
                flex-shrink: 0;
            }
        }
    }

    .Photo2.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_EasyPhotoRight 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_EasyPhotoLeft 600ms;
        }
    }

    .Photo3 {
        position: absolute;

        top: 62px;
        right: 70px;

        img {
            width: 229px;
            height: 229px;
        }

        @media (max-width: 1239px) {

            top: 377px;
            right: unset;
            left: calc(50% - 120px);

            img {
                width: 148.046px;
                height: 148.018px;
                flex-shrink: 0;
            }
        }
    }

    .Photo3.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_PhotoLeft 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_PhotoRight 600ms;
        }
    }

    .Photo4 {
        position: absolute;

        top: 463px;
        right: 153px;

        img {
            width: 146px;
            height: 146px;
        }

        @media (max-width: 1239px) {
            top: 433px;
            right: unset;
            left: calc(50% + 43px);

            img {
                width: 118.549px;
                height: 118.516px;
            }
        }
    }

    .Photo4.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_EasyPhotoRight 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_EasyPhotoRight 600ms;
        }
    }

    .Photo5 {
        position: absolute;

        left: 53px;
        top: 0px;

        @media (max-width: 1239px) {

            top: 254px;
            left: calc(50% - 152px);

            img {
                width: 114.633px;
                height: 114.633px;
            }

            flex-shrink: 0;
        }
    }

    .Photo5.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_PhotoLeft 600ms;
        }
    }

    .Photo6 {
        position: absolute;

        left: 53px;
        top: 0px;

        @media (max-width: 1239px) {

            top: 298px;
            left: calc(50% - 25px);

            img {
                width: 59.25px;
                height: 59.249px;
            }

            flex-shrink: 0;
        }
    }

    .Photo6.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_EasyPhotoRight 600ms;
        }
    }

    .Photo5.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_EasyPhotoLeft 600ms;
        }
    }

    .SmileLabel {
        position: absolute;

        left: 195px;
        top: 330px;

        z-index: 110;

        @media (max-width: 1239px) {
            transform: translate(calc(50vw - 50%));

            left: 112px;
            top: 308px;

            img {
                width: 80.016px;
                height: 79.992px;
                flex-shrink: 0;
            }
        }
    }

    .Motto {
        position: absolute;

        top: 0px;
        left: 50%;
        transform: translate(-50%, 0);

        width: 600px;
        margin-top: 20px;

        font-family: var(--font-family);
        font-weight: 500;
        font-size: 40px;
        line-height: 102%;
        text-align: center;
        color: #fff;

        @media (max-width: 1239px) {
            width: 73%;
            margin-top: unset;

            color: #fff;
            text-align: center;
            leading-trim: both;
            text-edge: cap;
            font-family: HelveticaNeueCyr;
            font-size: 27px;
            font-style: normal;
            font-weight: 550;
            line-height: 27.9px;
            /* 103.333% */
        }
    }

    .Motto.Appear {
        animation: Confidence_Motto 500ms;
    }

    .Motto>.Accent {
        color: #555;
    }

    .Lead1 {
        position: absolute;

        top: 398px;
        left: 640px;

        width: 301px;

        color: #fff;
        leading-trim: both;
        text-edge: cap;
        font-family: HelveticaNeueCyr;
        font-size: 22px;
        font-style: normal;
        font-weight: 550;
        line-height: 22.957px; /* 104.348% */

        @media (max-width: 1239px) {
            top: 642px;
            width: 44vw;
            right: unset;
            left: 2.2vw;
            transform: unset;

            color: #fff;
            leading-trim: both;
            text-edge: cap;
            font-family: HelveticaNeueCyr;
            font-size: 14px;
            font-style: normal;
            font-weight: 550;
            line-height: 14.875px; /* 106.25% */
        }
    }

    .Lead1.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_EasyRight 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_Right 600ms;
        }
    }

    .Lead2 {
        position: absolute;

        top: 549px;
        left: 340px;

        width: 155px;

        color: #fff;
        leading-trim: both;
        text-edge: cap;
        font-family: HelveticaNeueCyr;
        font-size: 15px;
        font-style: normal;
        font-weight: 550;
        line-height: 18px; /* 120% */

        @media (max-width: 1239px) {
            top: 846px;
            left: 50%;
            transform: translate(-50%);
            width: 60vw;

            text-align: center;

            color: #fff;
            text-align: center;
            leading-trim: both;
            text-edge: cap;
            font-family: HelveticaNeueCyr;
            font-size: 25px;
            font-style: normal;
            font-weight: 550;
            line-height: 100%; 
        }
    }

    .Lead2.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_Top 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_Left 600ms;
        }
    }

    .Lead3 {
        position: absolute;

        top: 680px;
        left: 640px;

        width: 310px;

        color: #fff;
        leading-trim: both;
        text-edge: cap;
        font-family: HelveticaNeueCyr;
        font-size: 22px;
        font-style: normal;
        font-weight: 550;
        line-height: 22.957px; /* 104.348% */

        opacity: 0.6;

        @media (max-width: 1239px) {
            top: 642px;
            transform: unset;
            right: 1vw;
            left: unset;
            width: 41.4vw;

            color: #fff;
            leading-trim: both;
            text-edge: cap;
            font-family: HelveticaNeueCyr;
            font-size: 14px;
            font-style: normal;
            font-weight: 550;
            line-height: 14.875px; /* 106.25% */
        }
    }

    .Lead3.Appear {
        @media (max-width: 1239px) {
            animation: Confidence_EasyLeft 600ms;
        }

        @media (min-width: 1240px) {
            animation: Confidence_Right 600ms;
        }
    }

    .Photo2Text {
        position: absolute;
        width: 195px;
        height: 195px;
        left: 150px;
        top: 228px;
        z-index: 119;

        @media (max-width: 1239px) {
            left: calc(50% + 39px);
            top: 286px;
            width: 86.016px;
            height: 86.992px;
        }
    }

    .Photo2Text.Appear {
        animation: Confidence_Photo2Text 600ms;
    }

    .Photo2Text svg text {
        fill: #fff;
        font-family: HelveticaNeueCyr;
        font-size: 32px;
        font-weight: 500;
        text-transform: uppercase;
        font-variant-ligatures: none;
        letter-spacing: 1px;
        animation: Photo2Rotation 25s linear infinite;
        transform-origin: 250px 250px;
    }

    .Photo2Text svg {
        width: 170%;
        height: 170%;
    }

    .Photo2Text svg .Photo2TextTrick {
        transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1);
        transform-origin: 250px 250px;
    }

    .Photo2Text svg:hover .Photo2TextTrick {
        transform: scale(1.2) rotate(90deg);
    }

    .Smile {
        @media (max-width: 1239px) {
            position: absolute;

            top: 939px;
            left: 50%;
            transform: translate(-50%);
        }
    }

    .Smile.Appear path {
        animation: Confidence_Smile 1000ms;
    }
}

@keyframes Photo2Rotation {
    to {
        transform: rotate(360deg);
    }
}

@keyframes Confidence_Dot {
    from {
        width: 0px;
        height: 0px;
    }
}

@keyframes Confidence_Line {
    from {
        height: 0px;
    }
}

@keyframes Confidence_Motto {
    from {
        opacity: .2;
        top: 20px;
    }
}

@keyframes Confidence_PhotoLeft {
    from {
        opacity: .4;
        transform: translate(-50px) rotate(-30deg) scale(.9);
    }
}

@keyframes Confidence_EasyPhotoLeft {
    from {
        opacity: .4;
        transform: translate(-50px) rotate(-30deg) scale(.9);
    }
}

@keyframes Confidence_PhotoRight {
    from {
        opacity: .4;
        transform: translate(20px) rotate(30deg) scale(.9);
    }
}

@keyframes Confidence_EasyPhotoRight {
    from {
        opacity: .4;
        transform: translate(20px) rotate(30deg) scale(.9);
    }
}

@keyframes Confidence_Left {
    from {
        transform: translate(80px);
        opacity: .1;
    }
}

@keyframes Confidence_EasyLeft {
    from {
        transform: translate(15px);
        opacity: .1;
    }
}

@keyframes Confidence_Top {
    from {
        opacity: .1;
    }
}

@keyframes Confidence_Right {
    from {
        transform: translate(-60px);
        opacity: .1;
    }
}

@keyframes Confidence_EasyRight {
    from {
        transform: translate(-15px);
        opacity: .1;
    }
}

@keyframes Confidence_Smile {
    0% {
        stroke-width: 0;
    }

    70% {
        stroke-width: 31;
    }

    80% {
        stroke-width: 31;
    }

    100% {
        stroke-width: 27.1908;
    }
}

@keyframes Confidence_Photo2Text {
    from {
        opacity: 0;
    }
}