.toggle-period {
    background: transparent;
    color: var(--segment-foreground, #111827);
}

.toggle-period.active {
    background: linear-gradient(140deg, rgba(37, 99, 235, 0.95), var(--segment-primary));
    color: var(--segment-contrast, #ffffff);
    box-shadow: 0 10px 30px rgba(37, 99, 235, 0.25);
}


    .toggle-period.active span {
        color: var(--segment-destaque) !important;
    }

.card-plano {
    border-radius: 1.25rem;
}

    .card-plano:hover {
        transform: translateY(-6px);
    }

@media (max-width: 768px) {
    .toggle-period {
        padding: 0.6rem 0.85rem;
        font-size: 0.9rem;
    }

    .card-plano {
        box-shadow: 0 14px 36px rgba(0, 0, 0, 0.06);
    }
}