/* ============================================================
   BOTÕES
   ============================================================ */
.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.95rem 1.85rem;
    font-family: var(--ff-body);
    font-weight: 500;
    font-size: 0.95rem;
    border-radius: 999px;
    cursor: pointer;
    transition:
        background-color 0.5s var(--ease-out),
        color 0.5s var(--ease-out),
        border-color 0.5s var(--ease-out),
        transform 0.5s var(--ease-out),
        box-shadow 0.5s var(--ease-out);
    white-space: nowrap;
    border: 1px solid transparent;
    line-height: 1;
    overflow: hidden;
    isolation: isolate;
}

.btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.18) 50%, transparent 100%);
    transform: translateX(-110%);
    transition: transform 0.85s var(--ease-out);
    z-index: -1;
}

.btn:hover::before { transform: translateX(110%); }

.btn .icon { transition: transform 0.5s var(--ease-out); }
.btn:hover .icon { transform: translateX(4px); }
.btn:active { transform: translateY(1px) scale(0.985); }

.btn--primary {
    background: var(--c-primary);
    color: #fff;
    box-shadow: 0 10px 28px -14px rgba(88, 98, 42, 0.55);
}
.btn--primary:hover {
    background: var(--c-primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 22px 44px -18px rgba(88, 98, 42, 0.6);
}

.btn--gold {
    background: var(--c-gold);
    color: #fff;
    box-shadow: 0 10px 28px -14px rgba(138, 140, 90, 0.55);
}
.btn--gold:hover {
    background: var(--c-primary);
    transform: translateY(-2px);
    box-shadow: 0 22px 44px -18px rgba(88, 98, 42, 0.6);
}

.btn--ghost {
    background: transparent;
    color: var(--c-text);
    border-color: rgba(37, 40, 32, 0.22);
}
.btn--ghost:hover {
    background: var(--c-primary);
    color: #fff;
    border-color: var(--c-primary);
    transform: translateY(-2px);
}

.btn--sm {
    padding: 0.7rem 1.25rem;
    font-size: 0.85rem;
}

/* Área de toque confortável em telas touch (mínimo 44px, ideal 48-56px) */
@media (max-width: 720px) {
    .btn {
        min-height: 52px;
        font-size: 1rem;
    }

    .btn--sm { min-height: 44px; }
}