/* -------------------------------------------------------------------------- */
/*                                  sponsors                                  */
/* -------------------------------------------------------------------------- */
.sponsors__section {
    --gap: 2px;
    --line-thickness: 1px;
    --line-color: #494949;
    --line-offset: calc(var(--gap) / 2);

    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(calc(1920px / 4 - var(--gap) * 3), 1fr));
    grid-auto-rows: minmax(min-content, 1fr);
    align-items: stretch;
    gap: var(--gap);
    overflow: hidden;
}

.sponsors__section > .sponsors__section__card {
    position: relative;
    display: flex;
    margin-right: calc(var(--gap) * -1);
    flex-direction: column;
    align-items: center;
    align-self: stretch;
}

.sponsors__section > .sponsors__section__card::before,
.sponsors__section > .sponsors__section__card::after {
    content: "";
    background-color: var(--line-color);
    position: absolute;
}

/* Row Lines */
.sponsors__section > .sponsors__section__card::after {
    inline-size: 100vw;
    block-size: var(--line-thickness);
    inset-block-start: calc(var(--line-offset) * -1);
    inset-inline-start: 0;
}

/* Column Lines */
.sponsors__section > .sponsors__section__card::before {
    inline-size: var(--line-thickness);
    block-size: calc(100% + var(--gap));
    inset-block-start: 0;
    inset-inline-start: calc(var(--line-offset) * -1);
}

.sponsors__section__card__logo {
    display: flex;
    width: 100%;
    height: 300px;
    padding: 31px 32px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: var(--white);
}

.sponsors__section__card__logo img {
    max-width: 500px;
    min-width: 400px;
    width: 100%;
    height: auto;
}

.sponsors__section__card__description {
    display: flex;
    padding: 48px 24px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}

.sponsors__section__card__description>a {
    margin-top: 48px;
}

@media (max-width: 768px) {
    .sponsors__section__card {
        flex: 0 0 100%;
    }

    .sponsors__section__card__logo img {
        min-width: 250px;
    }
}
/* -------------------------------------------------------------------------- */