.weblogPost {
    display: flex;
    flex-direction: column;
    gap: var(--gridGutter);
}

.weblogPost__backLink {
    font-family: var(--proximaMedium);
    font-size: var(--h4Size);
    color: var(--baseLight900);
}

.weblogPost .postListPost__intro,
.weblogPost__text,
.weblogPost .weblogPost__attachments {
    margin-block-end: 3rem;
}

.weblogPost__titleSection {
    text-align: center;
}

.weblogPost .postMetaInfo {
    justify-content: center;
    text-align: left;
}

.weblogPost__title {
    margin-block: 2rem;
}

.weblogPost .postListPost__intro {
    margin-inline: auto;
    font-size: var(--introSize);
}

.weblogPost__image {
    border-radius: var(--borderRadiusSmall);
}

.weblogPost__text,
.weblogPost .weblogPost__attachments {
    margin-inline: auto;
}

.weblogPost__contentSection {
    position: relative;
    margin-block: var(--marginSmall);
}

@media (min-width: 768px) {
    .weblogPost .postListPost__intro,
    .weblogPost .weblogPost__text,
    .weblogPost .weblogPost__attachments {
        max-width: 60%;
    }

    .weblogPost__share:has(.ShareButtons--sizeSmall) {
        --socialMediaButtonSize: 26px;
    }

    .weblogPost__share:has(.ShareButtons--sizeNormal) {
        --socialMediaButtonSize: 32px;
    }

    .weblogPost__share:has(.ShareButtons--sizeLarge) {
        --socialMediaButtonSize: 42px;
    }

    .weblogPost__share {
        position: absolute;
        left: calc(20% - var(--socialMediaButtonSize) - 1.5rem);
        top: .4rem;
        display: flex;
        flex: 0 0 var(--socialMediaButtonSize);
        max-width: var(--socialMediaButtonSize);
    }

    .weblogPost__share .ShareButtons {
        flex-direction: column;
    }
}

/**
 * Weblog detailpage on a sidebar UI-variant
 */

.variantSidebar .weblogPost__titleSection {
    text-align: left;
}

.variantSidebar .weblogPost .postMetaInfo {
    justify-content: flex-end;
}

@media (min-width: 768px) {
    .variantSidebar .weblogPost .postListPost__intro,
    .variantSidebar .weblogPost .weblogPost__text,
    .variantSidebar .weblogPost .weblogPost__attachments {
        max-width: none;
    }

    .variantSidebar .weblogPost__share {
        position: static;
    }

    .variantSidebar .weblogPost__share .ShareButtons {
        flex-direction: row;
        flex-wrap: nowrap;
    }
}
