/* Базовые стили кнопки */
.button-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--color-light);
    background-color: var(--color-accent);
    text-decoration: none;
    border: 0.25rem solid var(--color-accent);
    /* 4px */
    border-radius: 6.1875rem;
    /* 99px */
    padding: 0.875rem 1.875rem;
    /* 14px 30px */
    font-size: 1.125rem;
    /* 18px */
    font-weight: 800;
    transition: var(--transition-default);
    white-space: nowrap;
    cursor: pointer;
    font-family: inherit;
}

.button-cta:hover {
    background-color: var(--color-light);
    color: var(--color-dark);
    transform: translateY(-0.0625rem);
    /* -1px */
}

/* Убираем варианты стилей primary/secondary/accent - используем базовый стиль */
.button-cta-primary,
.button-cta-secondary,
.button-cta-accent {
    color: var(--color-light);
    background-color: var(--color-accent);
    border-color: var(--color-accent);
}

.button-cta-primary:hover,
.button-cta-secondary:hover,
.button-cta-accent:hover {
    background-color: var(--color-light);
    color: var(--color-dark);
    transform: translateY(-0.0625rem);
    /* -1px */
}

/* Стили для редактора Gutenberg */
.wp-block-button .button-cta {
    margin: 0.625rem 0;
    /* 10px 0 */
}

/* Убираем стандартные стили браузера для кнопок */
.button-cta {
    background: var(--color-accent);
    border: 0.25rem solid var(--color-accent);
    /* 4px */
    outline: none;
}

.button-cta:focus {
    outline: 0.125rem solid var(--color-accent);
    /* 2px */
    outline-offset: 0.125rem;
    /* 2px */
}