section.block-steps,
section.block-steps:first-child,
section.block-steps:last-child{
    margin-top: 0;
    margin-bottom: 0;
    border: 0;
    background-color: var(--bg);
    background-image: url("./bg_steps_01.png"), url("./bg_steps_02.png");
    border-radius: 64px 0 65px 0;
    padding: 94px 0;
    background-position: top left, 100% 60px;
    background-repeat: no-repeat;
    background-size: auto;
}
.block-steps .heading .title > h1,
.block-steps .heading .title > h2,
.block-steps .heading .title > h3,
.block-steps .heading .title > h4,
.block-steps .heading .title > h5,
.block-steps .heading .title > h6,
.block-steps .heading .title > p{
    font-size: 44px;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -0.01em;
    text-align: center;
    margin-top: 0;
    margin-bottom: 68px;
}
.grid-steps{
    display: grid;
    grid-template-columns: repeat(4, minmax(auto, 1fr));
    grid-gap: 24px;
    margin-bottom: 200px;
}
.grid-steps .item-step{
    background: rgba(249, 249, 249, 1);
    padding: 40px;
    border: 1px solid rgba(227, 227, 227, 0.7);
    box-shadow: 50px 50px 100px 0 rgba(1, 16, 39, 0.16);
    border-radius: 56px;
}
.grid-steps .item-step .title h1,
.grid-steps .item-step .title h2,
.grid-steps .item-step .title h3,
.grid-steps .item-step .title h4,
.grid-steps .item-step .title h5,
.grid-steps .item-step .title h6,
.grid-steps .item-step .title p
{
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    letter-spacing: -0.01em;
    text-align: left;
    margin-top: 0;
    margin-bottom: 16px;
}
.grid-steps .item-step .description p{
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    letter-spacing: -0.01em;
    text-align: left;
    margin-top: 0;
    margin-bottom: 4px;
}
.block-steps .body-banner{
    position: relative;
    padding-top: 247px;
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}
.block-steps .body-banner::after{
    position: absolute;
    content: '';
    background: linear-gradient(29deg, rgba(62, 39, 101, 0) -1.75%, rgba(96, 96, 225, 0.18) 50.44%);
    top: 0;
    bottom: -94px;
    left: 0;
    right: 0;
    z-index: 0;
}
.block-steps .body-banner .meta-banner{
    position: relative;
    z-index: 2;
    padding: 48px 56px;
    max-width: 520px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 32px;
    background: rgba(244, 244, 244, 0.6);
    border: 2px solid rgba(227, 227, 227, 0.7);
    box-shadow: 50px 50px 100px 0 rgba(1, 16, 39, 0.16);
    backdrop-filter: blur(10px)
}
.block-steps .body-banner .meta-banner .title > h1,
.block-steps .body-banner .meta-banner .title > h2,
.block-steps .body-banner .meta-banner .title > h3,
.block-steps .body-banner .meta-banner .title > h4,
.block-steps .body-banner .meta-banner .title > h5,
.block-steps .body-banner .meta-banner .title > h6,
.block-steps .body-banner .meta-banner .title > p{
    font-size: 44px;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -0.01em;
    text-align: left;
    margin-top: 0;
    margin-bottom: 16px;
}
.block-steps .body-banner .meta-banner .description > p{
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: -0.01em;
    text-align: left;
    margin-top: 0;
    margin-bottom: 42px;
}

/* Responsive */
@media only screen and (max-width: 980px) {
    section.block-steps, section.block-steps:first-child, section.block-steps:last-child {
        background-position: top left, 100% 60%;
        background-size: auto, contain;
    }
    .block-steps .heading .title > h1, .block-steps .heading .title > h2, .block-steps .heading .title > h3, .block-steps .heading .title > h4, .block-steps .heading .title > h5, .block-steps .heading .title > h6, .block-steps .heading .title > p{
        font-size: 32px;
        font-weight: 700;
        line-height: 36px;
    }
    .grid-steps {
        grid-template-columns: repeat(1, minmax(auto, 1fr));
    }
    .block-steps .body-banner .meta-banner{
        padding: 48px 32px;
        margin-left: 16px;
        margin-right: 16px;
    }
    .block-steps .body-banner .meta-banner .title > h1, .block-steps .body-banner .meta-banner .title > h2, .block-steps .body-banner .meta-banner .title > h3, .block-steps .body-banner .meta-banner .title > h4, .block-steps .body-banner .meta-banner .title > h5, .block-steps .body-banner .meta-banner .title > h6, .block-steps .body-banner .meta-banner .title > p{
        font-size: 32px;
        font-weight: 700;
        line-height: 36px;
    }
    .block-steps .body-banner .meta-banner .description > p{
        font-size: 24px;
        font-weight: 500;
        line-height: 32px;
    }
}