/* =========================================================
   AUTHOR SECTION
========================================================= */

.singlepost-author-section{
    padding: 0 0 100px;
}

.singlepost-author-container{
    max-width: 1300px;
    margin: 0 auto;

    padding: 0 40px;
}

.singlepost-author-box{
    max-width: 900px;

    margin: 0 auto;

    background: var(--surface);

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

    padding: 40px;

    display: flex;
    gap: 32px;
    align-items: center;
}

.singlepost-author-avatar img{
    width: 120px;
    height: 120px;

    border-radius: 50%;

    object-fit: cover;
}

.singlepost-author-content{
    flex: 1;
}

.singlepost-author-label{
    display: inline-block;

    font-size: 13px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 1px;

    color: var(--color-primary);

    margin-bottom: 12px;
}

.singlepost-author-name{
    font-size: 32px;
    font-weight: 800;

    line-height: 1.2;

    color: var(--color-ink);

    margin-bottom: 16px;
}

.singlepost-author-bio{
    font-size: 16px;
    line-height: 1.9;

    color: var(--color-muted);

    margin-bottom: 24px;
}

.singlepost-author-social{
    display: flex;
    gap: 14px;
}

.singlepost-author-social a{
    width: 42px;
    height: 42px;

    border-radius: 50%;

    background: var(--surface);

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--color-ink);

    text-decoration: none;

    transition: all 0.25s ease;
}

.singlepost-author-social a:hover{
    background: var(--color-primary);
    color: var(--white);
}

@media(max-width:768px){

    .singlepost-author-container{
        padding: 0 20px;
    }

    .singlepost-author-box{
        flex-direction: column;
        text-align: center;

        padding: 32px 24px;
    }

    .singlepost-author-name{
        font-size: 26px;
    }

    .singlepost-author-social{
        justify-content: center;
    }
}