.sx-why-section{
    --sx-blob-speed:10s;
    position:relative;
    width:100%;
    overflow:hidden;
    box-sizing:border-box;
    background:#fff;
    isolation:isolate;
}
.sx-why-container{
    position:relative;
    z-index:3;
    max-width:1440px;
    margin:0 auto;
    padding:0 54px;
    box-sizing:border-box;
}
.sx-why-layout{
    display:grid;
    grid-template-columns:minmax(390px,.82fr) minmax(0,1.18fr);
    align-items:center;
    gap:70px;
}
.sx-why-left{position:relative;z-index:4;}
.sx-why-heading{
    margin:0 0 28px;
    font-size:42px;
    line-height:1.18;
    font-weight:800;
    letter-spacing:-1px;
    color:#191A18;
}
.sx-why-description{
    max-width:500px;
    margin:0 0 48px;
    font-size:17px;
    line-height:1.65;
    color:#6A6A6A;
}
.sx-collage{
    width:100%;
    max-width:520px;
    display:grid;
    grid-template-columns:1.08fr .92fr;
    grid-template-rows:150px 150px;
    gap:9px;
}
.sx-collage-item{overflow:hidden;border-radius:9px;}
.sx-collage img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .55s cubic-bezier(.2,.8,.2,1);
}
.sx-collage-1{grid-row:1 / 3;}
.sx-collage-2{grid-column:2;grid-row:1;}
.sx-collage-3{grid-column:2;grid-row:2;}
.sx-collage-4{display:none;}
.sx-collage:hover img{transform:scale(1.025);}
.sx-why-right{position:relative;z-index:4;}
.sx-feature-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:90px;
    row-gap:62px;
}
.sx-feature{
    position:relative;
    display:block;
    color:inherit;
    text-decoration:none;
    min-height:210px;
    padding:0 4px;
    transition:transform .35s ease;
}
.sx-feature-number{
    width:66px;
    height:66px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:27px;
    background:#fff;
    color:#27BDEB;
    font-size:20px;
    font-weight:800;
    box-shadow:0 12px 35px rgba(0,0,0,.07);
    border-radius:6px;
    transition:
        border-radius .5s cubic-bezier(.68,-.6,.32,1.6),
        transform .5s cubic-bezier(.68,-.6,.32,1.6),
        box-shadow .4s ease;
}
.sx-feature-title{
    margin:0 0 16px;
    color:#191A18;
    font-size:23px;
    line-height:1.25;
    font-weight:800;
}
.sx-feature-text{
    max-width:330px;
    color:#6A6A6A;
    font-size:15px;
    line-height:1.65;
}
.sx-feature:hover{
    transform:translateY(-5px);
}
.sx-feature:hover .sx-feature-number{
    transform:rotate(-5deg) scale(1.08);
    border-radius:45% 55% 58% 42% / 54% 42% 58% 46%;
    box-shadow:0 16px 35px rgba(0,0,0,.12);
}
.sx-why-blob{
    position:absolute;
    z-index:1;
    width:720px;
    height:620px;
    left:-260px;
    top:50%;
    transform:translateY(-50%);
    border-radius:58% 42% 65% 35% / 44% 58% 42% 56%;
    background:#7EDFF7;
    opacity:.48;
    filter:blur(1px);
    pointer-events:none;
    will-change:left,transform,border-radius;
}
.sx-why-blob::after{
    content:"";
    position:absolute;
    inset:-80px;
    border-radius:inherit;
    background:var(--sx-blob-2,#B8F2FF);
    opacity:.55;
    filter:blur(45px);
}
.sx-why-section.is-moving .sx-why-blob{
    animation:sxBlobTravel var(--sx-blob-speed) ease-in-out infinite alternate;
}
.sx-why-blob.has-jelly{
    animation:sxBlobJelly 7s ease-in-out infinite;
}
.sx-why-section.is-moving .sx-why-blob.has-jelly{
    animation:
        sxBlobTravel var(--sx-blob-speed) ease-in-out infinite alternate,
        sxBlobJelly 7s ease-in-out infinite;
}
.sx-why-noise{
    position:absolute;
    z-index:2;
    inset:0;
    pointer-events:none;
    opacity:.35;
    background-image:radial-gradient(rgba(0,0,0,.055) 1.2px,transparent 1.4px);
    background-size:24px 24px;
    mask-image:linear-gradient(to right,rgba(0,0,0,.15),transparent 75%);
    -webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.15),transparent 75%);
}
@keyframes sxBlobTravel{
    0%{
        left:-270px;
        transform:translateY(-50%) rotate(-8deg) scale(1);
    }
    50%{
        left:32%;
        transform:translateY(-48%) rotate(9deg) scale(1.12);
    }
    100%{
        left:calc(100% - 420px);
        transform:translateY(-52%) rotate(-4deg) scale(.96);
    }
}
@keyframes sxBlobJelly{
    0%,100%{
        border-radius:58% 42% 65% 35% / 44% 58% 42% 56%;
    }
    25%{
        border-radius:45% 55% 37% 63% / 57% 40% 60% 43%;
    }
    50%{
        border-radius:67% 33% 50% 50% / 36% 63% 37% 64%;
    }
    75%{
        border-radius:39% 61% 60% 40% / 62% 43% 57% 38%;
    }
}

@media (max-width:1100px){
    .sx-why-container{padding:0 32px;}
    .sx-why-layout{grid-template-columns:1fr 1.15fr;gap:40px;}
    .sx-feature-grid{column-gap:42px;row-gap:45px;}
    .sx-why-heading{font-size:36px;}
    .sx-collage{max-width:450px;}
    .sx-collage{grid-template-rows:125px 125px;}
}
@media (max-width:767px){
    .sx-why-container{padding:0 20px;}
    .sx-why-layout{grid-template-columns:1fr;gap:55px;}
    .sx-why-heading{font-size:32px;margin-bottom:18px;}
    .sx-why-description{font-size:15px;margin-bottom:30px;}
    .sx-collage{max-width:100%;grid-template-rows:115px 115px;}
    .sx-feature-grid{grid-template-columns:1fr;gap:35px;}
    .sx-feature{min-height:auto;}
    .sx-feature-number{width:58px;height:58px;margin-bottom:20px;font-size:17px;}
    .sx-feature-title{font-size:21px;}
    .sx-feature-text{font-size:14px;}
    .sx-why-blob{
        width:540px;
        height:500px;
        left:-310px;
        opacity:.4;
    }
    @keyframes sxBlobTravel{
        0%{left:-330px;transform:translateY(-50%) rotate(-8deg) scale(.95);}
        50%{left:30%;transform:translateY(-48%) rotate(8deg) scale(1.04);}
        100%{left:55%;transform:translateY(-52%) rotate(-5deg) scale(.9);}
    }
}