.company-section {
    padding: 120px 0 60px;
    color: var(--black);
}

.company-section .container {
    padding: 0 var(--page-gutter);
}

.company-section__layout {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(0, 1.45fr);
    gap: 120px;
    align-items: start;
}

.company-section__connect {
    gap: 24px;
}

.company-section__brand {
    margin-bottom: 0;
}

.company-section__social {
    gap: 0;
}

.company-section__social a {
    color: var(--black);
}

.company-section__story {
    display: grid;
    grid-template-columns: minmax(0, 420px) auto;
    gap: 32px;
    align-items: start;
}

.company-section__story-main {
    max-width: 420px;
}

.company-section__title {
    margin-bottom: 24px;
}

.company-section__text {
    margin: 0;
    font-size: var(--type-body-size-s);
    font-weight: var(--type-body-weight-medium);
    line-height: var(--type-body-line-height);
    color: var(--black);
}

.company-section__link,
.company-section__link:visited {
    justify-self: end;
    color: var(--black);
    font-size: var(--type-body-size-s);
    font-weight: var(--type-body-weight-bold);
    line-height: var(--type-link-line-height);
    text-transform: uppercase;
    letter-spacing: var(--type-link-letter-spacing);
    text-decoration: underline;
    text-underline-offset: var(--type-link-underline-offset);
}

.company-section__link:hover {
    color: var(--link-hover-color);
}

@media (max-width: 1023px) {
    .company-section {
        padding: 96px 0;
    }

    .company-section__layout {
        gap: 64px;
    }

    .company-section__story {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .company-section__link,
    .company-section__link:visited {
        justify-self: start;
    }
}

@media (max-width: 767px) {
    .company-section {
        padding: 64px 0;
    }

    .company-section__layout {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .company-section__story {
        order: 1;
        gap: 24px;
    }

    .company-section__connect {
        order: 2;
    }

    .company-section__story-main {
        max-width: none;
    }

    .company-section__title {
        margin-bottom: 20px;
    }
}
