.team-members {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;

    .team-member {
        border-radius: 10px;
        width: calc(33% - 1rem);
        padding: 2rem;
        display: flex;
        flex-direction: column;
        align-items: center;

        img {
            width: 100px;
            border-radius: 50%;
        }

        .placeholder {
            width: 100px;
            height: 100px;
            border-radius: 50%;
            background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple);
            overflow: hidden;

            .placeholder-inner {
                width: 100%;
                height: 100%;
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
                background-size: 65px;
            }
        }

        .title {
            margin-bottom: 0;
            text-align: center;
        }

        .job-role {
            margin-bottom: 0;
            text-align: center;
        }

        .clamped-text {
            display: -webkit-box;
            -webkit-line-clamp: 4;
            -webkit-box-orient: vertical;
            overflow: hidden;
            line-clamp: 4;
        }

        .read-more {
            width: 100%;
            cursor: pointer;
        }
    }

    @media(max-width: 885px) {
        .team-member {
            width: calc(50% - 0.5rem);
        }
    }

    @media(max-width: 600px) {
        .team-member {
            width: 100%;
        }
    }
}

.blog {
    .load-more-container {
        display: flex;
        justify-content: center;
        margin-top: 2rem;
    }

    .load-more {
        background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple);
        color: var(--wp--preset--color--accent-1);
        font-size: var(--wp--preset--font-size--small);
        font-style: normal;
        font-weight: 600;
        padding-top: 14px;
        padding-right: 28px;
        padding-bottom: 14px;
        padding-left: 28px;
        border: none;
        border-radius: 99999px;
        cursor: pointer;
    }
}

.blog-posts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.blog-post {
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;

    .image {
        background-size: cover;
        background-position: center;
        height: 300px;
    }

    .content {
        padding: 3rem;

        .title {
            margin-bottom: 0;
            margin-top: 0;
        }

        .description {
            margin-bottom: 0;
            display: -webkit-box;
            -webkit-line-clamp: 6;
            -webkit-box-orient: vertical;
            overflow: hidden;
            line-clamp: 6;
        }

        .read-more {
            width: 100%;
            cursor: pointer;
        }
    }
}

.blog-post:nth-child(odd) {
    flex-direction: column-reverse;
}

.blog-post:first-child {
    grid-column: span 3;
    flex-direction: row;

    .image {
        flex: 1;
        height: 100%;
    }

    .content {
        flex: 1;
    }

    .description {
        display: -webkit-box;
        -webkit-line-clamp: 12;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-clamp: 12;
    }
}