.button {
    position: relative;
    z-index: 1;
    padding: 21px 72px;
    border: 3px solid var(--monza);
    color: var(--monza);
    border-radius: 40px;

    transition-duration: var(--td-fast);
    will-change: transform;
}

.button:hover {
    transform: translateY(-0.5rem);
}

.button:active {
    transform: translateY(0rem);
}

.button--monza {
    border: 3px solid var(--monza);
    background-color: var(--monza);
    color: #fff;
    outline: 0px solid #f7e0e3 !important;
    margin-bottom: 16px;

    will-change: outline;
}

.button--monza:hover {
    transform: none;
    outline: 16px solid #f7e0e3 !important;
}

.button--monza:active {
    transform: translateY(-0.5rem);
}

.button:disabled {
    border-color: var(--gray_dark);
    background-color: var(--gray_dark);
}

.button:disabled:hover {
    transform: none;
    outline: none !important;
}

.card {
    display: flex;
    border-radius: 32px;
    box-shadow: 0px 8px 40px rgba(0, 0, 0, 0.08);
    
    transition-duration: var(--td-slow);
}

.card:hover {
    box-shadow: 0px 8px 40px 15px rgba(0, 0, 0, 0.12);
}

section > .container > .title {
    text-align: center;
}

modal .button { padding: 15px 93px; }

@media (max-width:1023.98px) {
    .button {
        padding: 12px 42px;
    }

    modal .button { padding: 9px 58px; }
}