.author-hero {
    padding: 80px 0 0;

    @media (min-width: 1200px) {
        padding: 124px 0 0;
    }

    .author-hero__wrapper {
        display: grid;
        grid-template-columns: clamp(256px,28.334vw,408px) minmax(auto, 762px);
        justify-content: space-between;
        gap: 16px;

        padding: clamp(16px,4.445vw,64px) clamp(16px,2.78vw,40px);
        border-radius: 24px;
        background: var(--background-card-color, #EFEFE9);

        @media (max-width: 991px) {
            padding-right: 16px;
            padding-left: 16px;
        }

        @media (max-width: 767px) {
            grid-template-columns: 1fr;
        }
    }

        .author-hero__photo {
            position: relative;
            padding-top: clamp(231px,25.625vw,369px);
            background-color: white;
            border-radius: 24px;
            overflow: hidden;

            @media (max-width: 767px) {
                aspect-ratio: 1.11;
            }

            &:before {
                content: 'No image';
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
            }

            & img {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
        }

        .author-hero__info {
            display: flex;
            flex-direction: column;
            gap: 32px;
        }
            .author-hero__text-content {
                display: flex;
                flex-direction: column;
                gap: clamp(16px,1.667vw,24px);
            }

            h1 {
                font-size: clamp(32px,3.334vw,48px);
                font-weight: 500;
                line-height: 1.167;
                color: black;
            }
            .author-hero__position {
                font-size: clamp(16px,1.25vw,18px);
                font-weight: 600;
                line-height: 1.33;
                color: black;
            }
            .author-hero__bio {
                color: var(--text-color, #636363);
                font-size: clamp(14px,1.112vw,16px);
                font-weight: 400;
                line-height: 1.25;
                @media (min-width: 768px) {
                    font-weight: 500;
                }
            }

        .auhtor-hero__socials-wrapper {
            display: flex;
            gap: 32px;
            align-items: center;
            justify-content: space-between;
            flex-direction: row;
            flex-wrap: wrap;
        }
        .author-hero__socials {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            gap: 8px;
        }
            .author-hero__social {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 44px;
                width: 44px;
                border-radius: 20px;
                background: var(--background-color,#FDFDF5);
                transition: opacity 300ms;

                & img {
                    height: 20px;
                    width: 20px;
                }

                &:hover {
                    opacity: 0.7;
                }
            }
            .author-hero__articles {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 4px;

                color: black;
                & span {
                    color: inherit;
                    font-weight: 500;
                    font-size: 16px;
                }
            }
}