.facts{
    margin-top: 30px;
}
.card-sm{
    margin-top: 30px;
}
.facts-logo div{
    display: flex;
    align-items: center;
    max-height: 136px;
    justify-content: center;
}


.howork{
    .howork-left{
        border-radius: 16px;
        background-size: cover;
        background-position: center;
        background-image: url("/assets/img/about-howork.jpg");
        aspect-ratio: 582 / 642;
        height: 642px;
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: wrap;
        gap: 30px;
        >div{
            width: calc(50% - 15px);
            box-shadow: 0 0 0 30px var(--clr-gr-lt);
            border-radius: 16px;
            aspect-ratio: 1;
            &:first-child, &:last-child{
                width: auto;
                margin-bottom: auto;
                background-color: var(--clr-gr-lt);
                aspect-ratio: none;
                flex-grow: 1;
                flex-shrink: 1;
            }
        }
    }
    .howork-right{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 60px;
        .howork-item{
            display: flex;
            flex-direction: row;
            gap: 30px;
            cursor: pointer;
            .howork-caption{
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 10px;
                .timing{
                    color: var(--Primary-1D45F0, #1D45F0);
                    font-size: 20px;
                    font-weight: 600;
                    line-height: 28px;
                }
            }
            h5{
                margin: 0;
            }
        }
    }
}

@media screen and (max-width: 1240px){
    .howork{
        .howork-left{
            height: 135%;
            width: 100%;
        }
        .howork-right{
            gap: 30px;
            h5{
                margin-block: 10px;
            }
        }
    }

}

@media screen and (max-width: 1024px){
    .jumb-slogan{
        margin-block: 0;
    }
    
    .facts{
        margin-top: 10px;
    }

    .howork{
        .howork-left{
            height: 105vw;
            width: 100%;

        }
        .howork-right{
            gap: 30px;
            .howork-item{
                display: flex;
                flex-direction: row;
                gap: 30px;
                cursor: pointer;
                h5{
                    margin: 0;
                }
            }
        }
    }
}




.container {
    max-width: 800px;
    margin: 32px auto;

    h1 {
        text-align: center;

    }

    swiper-slide {
        text-align: center;
        font-size: 24px;
        border-radius: 24px;
        padding: 16px 0;
        height: 400px;


        &:nth-of-type(1) {
            background-color: #780000;
            color: white
        }

        &:nth-of-type(2) {
            background-color: #fdf0d5;
        }

        &:nth-of-type(3) {
            background-color: #003049;
            color: white;
        }

        &:nth-of-type(4) {
            background-color: #669bbc;
        }
    }
}