.process{

    background:white;

}

.process__timeline{

    position:relative;

    display:grid;

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

    gap:40px;

    margin-top:80px;

}

.process__line{

    position:absolute;

    top:60px;

    left:10%;

    right:10%;

    height:0;

    border-top:3px dashed var(--color-border);

    background:none;

    z-index:0;

}

.process-card{

    position:relative;

    background:white;

    border-radius:4px;

    border:1px solid var(--color-border);

    padding:35px;

    text-align:left;

    box-shadow:none;

    transition:.35s;

    z-index:1;

}

.process-card:hover{

    transform:translateY(-8px);

    border-color:var(--color-primary);

}

.process-card__number{

    width:42px;

    height:42px;

    margin:0 0 25px;

    border-radius:50%;

    background:var(--color-primary);

    color:white;

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:700;

}

.process-card__icon{

    width:80px;

    height:80px;

    margin:0 0 25px;

    display:flex;

    align-items:center;

    justify-content:center;

}

.process-card__icon img{

    width:64px;

    height:64px;

}

.process-card h3{

    margin-bottom:15px;

}

@media(max-width:1100px){

    .process__timeline{

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

    }

    .process__line{

        display:none;

    }

}

@media(max-width:700px){

    .process__timeline{

        grid-template-columns:1fr;

    }

}