.Article.at-socials {
    margin-bottom: 0;
    background-color: var(--lightBlue);
}

.at-socials__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    padding-top: var(--innerPaddingYSmall);
    padding-bottom: var(--innerPaddingYSmall);
}

.at-socials__title {
    display: inline;
    padding: .15em;
    line-height: 1.6;
    color: var(--baseLight100);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-color: var(--baseDark500);
}

.at-socials__socialMedia {
    display: flex;
    gap: .5rem;
}

.at-socials__socialMediaItemLink {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    color: var(--baseLight100);
    border-radius: var(--borderRadius);
    background-color: var(--baseDark500);
}

.at-socials__socialMediaItemLink::before {
    font-size: 1.25rem;
}

.at-socials__feedWrapper {
    grid-row: 1;
}

/*
 * Compact
 */

.at-socials.at-socials--compact {
    background-color: var(--baseLight100);
}

.at-socials--compact .at-socials__inner {
    position: relative;
    margin: 6rem auto -2rem auto;
    padding-left: 1rem;
    padding-right: 1rem;
    transform: translateY(-2rem);
}

@media (min-width: 768px) {
    .at-socials__inner {
        grid-template-columns: 1.5fr 1fr;
        gap: 5rem;
        padding-top: var(--innerPaddingY);
        padding-bottom: var(--innerPaddingY);
    }

    .at-socials--compact .at-socials__inner {
        padding-left: var(--innerPaddingY);
        padding-right: var(--innerPaddingY);
    }
}
