.akm-how-it-works{
    background:#111111;
    padding:70px 0 90px;
}

.akm-how-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:35px;

    margin-top:70px;

}

.akm-step{

    position:relative;

    background:#1b1b1b;

    border:1px solid rgba(255,255,255,.06);

    border-radius:20px;

    padding:45px 35px;

    transition:.35s;

    overflow:hidden;

}

.akm-step::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;

    height:4px;

    background:#D4AF37;

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.akm-step:hover{

    transform:translateY(-10px);

    box-shadow:0 30px 70px rgba(0,0,0,.45);

}

.akm-step:hover::before{

    transform:scaleX(1);

}

.akm-step-number{

    width:72px;

    height:72px;

    border-radius:50%;

    background:#D4AF37;

    color:#111111;

    font-size:28px;

    font-weight:800;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:30px;

    transition:.35s;

}

.akm-step:hover .akm-step-number{

    transform:rotate(8deg) scale(1.08);

}

.akm-step h3{

    color:#ffffff;

    font-size:28px;

    margin-bottom:18px;

    line-height:1.2;

}

.akm-step p{

    color:#cfcfcf;

    font-size:17px;

    line-height:1.8;

    margin:0;

}

@media(max-width:1200px){

    .akm-how-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:768px){

    .akm-how-it-works{

        padding:80px 0;

    }

    .akm-how-grid{

        grid-template-columns:1fr;

        gap:25px;

        margin-top:50px;

    }

    .akm-step{

        padding:35px 28px;

    }

    .akm-step-number{

        width:60px;

        height:60px;

        font-size:24px;

        margin-bottom:22px;

    }

    .akm-step h3{

        font-size:24px;

    }

    .akm-step p{

        font-size:16px;

    }

}