/* See JobLink in Action section */

#set-in-action-section {
    position: relative;
    background: linear-gradient(to bottom, #E1DCF5 0%, #FFFFFF 233px);
    padding-top: 72px;
    padding-bottom: 60px;
    z-index: 1;
}

#set-in-action-section .content {
    flex-direction: column;
    align-items: center;
    max-width: 1100px;
    width: 100%;
    position: relative;
}

.set-in-action-header {
    text-align: center;
}

.set-in-action-header h2 {
    margin-bottom: 32px;
}

.set-in-action-subtitle {
    margin: 0;
    font-size: 18px;
    color: var(--color-gray-dark);
}

.set-in-action-grid {
    margin-top: 56px;
    display: flex;
    flex-direction: column;
    gap: 48px;
    max-width: 980px;
    width: 100%;
}

.set-in-action-card {
    display: flex;
    align-items: center;
    gap: 80px;
    /* border-radius: 28px;
    padding: 40px 44px; */
}

.set-in-action-card--candidate {
    flex-direction: row-reverse;
}

.set-in-action-card-text {
    max-width: 431px;
}

.set-in-action-card-text h3 {
    margin: 0 0 12px;
    font-size: 32px;
    font-family: "Alexandria";
}

.set-in-action-card-text p {
    margin: 0;
    color: var(--color-gray-dark);
    line-height: 150%;
}

.set-in-action-card-video {
    min-width: 0;
    z-index: 1;
}

.set-in-action-video {
    width: 100%;
    display: block;
    border: none;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.25);
    width: 450px;
    /* height: 300px; */
    border-radius: 20px;
}

.set-in-action-elipse-1 {
    /* Ellipse 161 */

    position: absolute;
    width: 664.9px;
    height: 586.7px;
    left: -341px;
    top: -100px;

    background: linear-gradient(96.04deg, rgba(89, 75, 246, 0.5) -65.56%, rgba(255, 255, 255, 0.5) 78.66%);
    filter: blur(150px);
    transform: matrix(-0.53, -0.85, 0.7, -0.71, 0, 0);
}

.set-in-action-elipse-2 {
 /* Ellipse 159 */

    position: absolute;
    width: 369px;
    height: 437px;
    bottom: -150px;
    left: -311px;


    background: linear-gradient(103.89deg, rgba(156, 39, 176, 0.5) 0.82%, rgba(255, 255, 255, 0.5) 111.68%);
    filter: blur(150px);
    transform: matrix(-0.57, -0.82, 0.73, -0.68, 0, 0);
   
}

.set-in-action-elipse-3 {
/* Ellipse 162 */

    position: absolute;
    width: 591.88px;
    height: 541.52px;
    /* left: 933px; */
    right: -200px;
    top: -300px;
    background: linear-gradient(99.28deg, rgba(89, 75, 246, 0.5) -5.21%, rgba(255, 255, 255, 0.5) 78.34%);
    filter: blur(150px);
    transform: matrix(-0.6, -0.8, 0.76, -0.65, 0, 0);

    
}

.set-in-action-rectangle-1 {
 /* Rectangle 8517 */

 position: absolute;
 width: 209.51px;
 height: 203.26px;
 left: -145px;
 top: 500px;
 background: linear-gradient(180deg, rgba(181, 0, 175, 0.1) 0%, rgba(134, 141, 165, 0.1) 100%);
 border-radius: 60px;
 transform: rotate(76.97deg);
   
}

.set-in-action-rectangle-2 {
 /* Rectangle 8519 */

 position: absolute;
 width: 123.73px;
 height: 120.04px;
 left: -100px;
 top: 840px;
 background: linear-gradient(107.65deg, rgba(157, 71, 170, 0.2) -6.4%, rgba(255, 235, 252, 0.2) 32.46%);
 border-radius: 30px;
 transform: rotate(58.88deg);
   z-index: 2;
}

.set-in-action-rectangle-3 {
    /* Rectangle 8510 */

    position: absolute;
    width: 371.66px;
    height: 369.17px;
    right: -111px;
    top: 760px;
    /* background: rgba(213, 222, 255, 0.4); */
    border-radius: 106.372px;
    transform: rotate(20.87deg);
    z-index: 1;
    background: linear-gradient(177.52deg, rgba(213, 222, 255, 0.4) 2.08%, rgba(255, 255, 255, 0.4) 56.52%);
}

.set-in-action-spline-1 {
    /* Spline 1 */

    position: absolute;
    bottom: 25px;
    right: -95px;
    z-index: 1;
}

.set-in-action-spline-2 {
    /* Spline 2 */
    position: absolute;
    bottom: -56px;
    right: -138px;

}

@media (max-width: 1024px) {
    #set-in-action-section {
        padding-top: 48px;
        padding-bottom: 64px;
    }

    .set-in-action-card {
        padding: 28px 24px;
        gap: 28px;
    }
}

/* Мобильные декоративные элементы: по умолчанию скрыты */
.set-in-action-mobile-ellipse,
.set-in-action-mobile-rect,
.set-in-action-mobile-spline {
    display: none;
    pointer-events: none;
}

.desktop-video {
    display: block;
}

.mobile-video {
    display: none;
}
@media (max-width: 768px) {

    .desktop-video {
        display: none;
    }

    .mobile-video {
        display: block;
    }

    .set-in-action-elipse-1,
    .set-in-action-elipse-2,
    .set-in-action-elipse-3,
    .set-in-action-rectangle-1,
    .set-in-action-rectangle-2,
    .set-in-action-rectangle-3,
    .set-in-action-spline-1,
    .set-in-action-spline-2 {
        display: none;
    }

    .set-in-action-mobile-ellipse,
    .set-in-action-mobile-rect,
    .set-in-action-mobile-spline {
        display: block;
        position: absolute;
        z-index: 0;
    }


    .set-in-action-mobile-ellipse--left {
        /* Ellipse 202 */

        position: absolute;
        width: 163px;
        height: 225px;
        opacity: 1;
        top: 500px;
        /* left: 40px; */
        transform: rotate(126.36deg);
        background: linear-gradient(103.89deg, #594BF6 0.82%, #FFFFFF 111.68%);
        filter: blur(150px);
        transform: matrix(-0.59, -0.81, 0.75, -0.66, 0, 0);

    }


    .set-in-action-mobile-ellipse--right {
        top: 0;
        right: 0;
        width: 63.32%;
        height: 43.03%;
        background: linear-gradient(99.28deg, rgba(89, 75, 246, 0.5) -5.21%, rgba(255, 255, 255, 0.5) 78.34%);
        filter: blur(59.6254px);
        transform: matrix(-0.52, -0.86, 0.68, -0.73, 0, 0);
        opacity: 0.5;
    }


    .set-in-action-mobile-rect--small {
        width: 36.7px;
        height: 35.61px;
        left: 0;
        top: 319px;
        background: linear-gradient(180deg, rgba(181, 0, 175, 0.1) 0%, rgba(134, 141, 165, 0.1) 100%);
        border-radius: 8.89934px;
        transform: rotate(58.88deg);
    }


    .set-in-action-mobile-rect--large {
        width: 75.74px;
        height: 73.48px;
        top: 223px;
        right: 5px;
        background: #F6EAF7;
        border-radius: 21.6896px;
        transform: rotate(76.97deg);
        z-index: 2;
    }

    .set-in-action-mobile-spline--top {
        position: absolute;
        z-index: 2;
        top: 253px;
        right: 47px;
    }

    .set-in-action-mobile-spline--bottom {
        position: absolute;
        top: 266px;
        right: 40px;
        z-index: 2;
    }
    #set-in-action-section {
        padding-bottom: 24px;
        background: none;
        overflow: hidden;
        padding-top:24px;
    }
    #set-in-action-section .content {
        margin-top: 8px;
        border: 1px solid #F3F2FF;
        border-radius: 16px;
        margin-left: 24px;
        margin-right: 24px;
    }

    .set-in-action-header {
        max-width: 360px;
    }
    .set-in-action-header br {
        display: none;
    }

    .set-in-action-header h5 {
        font-size: 18px;
    }


    .set-in-action-header h2 {
        font-size: 28px;
        margin-bottom: 8px;
        font-weight: 600;
    }
    .set-in-action-card-text h3 {
        font-size: 16px;
        text-align: center;
        font-weight: 600;
        margin-bottom: 10px;
        line-height: 22px;
    }

    .set-in-action-card-text h5 {
        margin-top:10px;
        font-size: 16px;
        text-align: center;
    }

    .set-in-action-subtitle {
        font-size: 16px;
    }

    .set-in-action-grid {
        margin-top: 0px;
        gap: 0px;
    }

    .set-in-action-card {
        gap: 2px;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .set-in-action-card,
    .set-in-action-card--candidate {
        flex-direction: column;
        align-items: flex-start;
        padding: 24px 20px 28px;
        border-radius: 24px;
    }

    .set-in-action-card {
        flex-direction: column-reverse;
    }

    .set-in-action-card-text {
        max-width: none;
        width: 364px;
        max-width: fit-content;
        align-self: center;
    }
    

    .set-in-action-card-text h4 {
        font-size: 18px;
    }

    .set-in-action-card-text p {
        font-size: 16px;
    }

    .set-in-action-video {
        width: 100%;
        border-radius: 6px;
    }
    .set-in-action-card-text img {
        display: none;
    }

    .set-in-action-card-video {
        width: 278px;
        align-self: center;

    }

}

