input[type="submit"],
button {
    background: transparent;
    color: var(--primary-color);
    padding: var(--spacing-md) var(--spacing-xl);
    font-size: 1rem;
    font-weight: 700;
    border: 1px solid var(--primary-color);
    border-radius: var(--radius);
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    width: 100%;
    font-family: inherit;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-shadow: 0 0 5px var(--primary-color);
    -webkit-appearance: none;
    appearance: none;
}

input[type="submit"]:hover,
button:hover {
    background: var(--primary-color);
    color: var(--text-inverse);
    box-shadow: var(--shadow-md);
    text-shadow: 0 0 5px var(--text-inverse);
}

input[type="submit"]:active,
button:active {
    transform: scale(0.98);
    box-shadow: none;
}