.work-experience-section{
    background-color: var(--color-bg);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
}

.work-experience-header{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.work-experience-title{
    margin-bottom: 40px;
}

.work-experiences-cards{
    width: 76%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
}


/* single card */
article.work-experience-card{
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-primary);
    border-radius: 10px;
    box-shadow: 0px 3px 7px 0px #ebebeb;
    padding: 27px;
    display: flex;
}

article.work-experience-card div:nth-child(1){
    width: 25%;
}

article.work-experience-card div:nth-child(2){
    width: 75%;
}

.mini-label{
    background-color: #e8e8f8;
    color: var(--color-primary);
    font-family: var(--font-body);
    font-size: 11px;
    padding: 3px 7px;
    border: 1px solid #4e46e54b;
    border-radius: 5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    margin-bottom: 9px;
}

.experience-card-title{
    font-size: 22px;
    margin-bottom: 7px;
}

.company-name span{
    color: var(--color-accent);
    font-size: var(--text-body-sm);

}

.company-name a{
    text-decoration: none;
}

.work-description{
    font-size: var(--text-body-md);
    margin-bottom: 11px;
    color: var(--color-text-secondary);
}