.tabcontents {
   margin-block-end: 24px;
}

.tabcontents__buttons {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-block-end: 40px;
    flex-wrap: wrap;
}

.tabcontents__button {
    flex: calc(25% - 8px) 0 1;
    border: 0;
    background-color: var(--wp--preset--color--contrast);
    color: var(--wp--preset--color--base);
    transition: background-color .25s ease-in, color .25s ease-in;
    padding: var(--button-padding-default);
    border-radius: var(--button-border-radius-medium);
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    letter-spacing: 1px;
    min-height: 72px;
    &:hover, &.active {
        color: var(--wp--preset--color--accent-2);
        background-color: var(--wp--preset--color--accent-1);
    }
}

.tabcontents__info  {
    &.tab-content.active {
        display: block;
    }
    ol {
        li {
            margin-bottom: 8px;
        }
    }
    ul {
        list-style: none;
        margin: 0;
        padding: 0;
        li {
            position: relative;
            margin-bottom: 20px;
            font-size: 1rem;
            font-weight: 700;
            padding-left: 48px;
            a {
                font-weight: 700;
                color: var(--wp--preset--color--accent-1);
                transition: color .25s ease-in;
                &:hover {
                    color: var(--wp--preset--color--base);
                }
            }
            &:before {
                content: " ";
                position: absolute;
                left: 0;
                top: -5px;
                background-image: url(../../images/check-bg.svg);
                background-repeat: no-repeat;
                background-position: center center;
                width: 36px;
                height: 36px;
            }
        }
        ul {
            margin-top: 20px;
        }
    }
}

@media (max-width: 1024px) {
    .tabcontents__buttons {
        flex-direction: column;
        row-gap: 10px;
    }
    .tabcontents__button {
        flex: 1 0 1;
        min-height: 56px;
    }
}