.billing-cycle-control {
    display: flex;
    justify-content: center;
    margin: -1rem auto 2.25rem;
}

.billing-cycle-switch {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.16);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.16);
}

.billing-cycle-switch.on-light {
    border-color: rgba(15, 23, 42, 0.1);
    background: #eef2ff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

.billing-cycle-option {
    min-width: 128px;
    padding: 0.72rem 1.2rem;
    border: 0;
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.78);
    background: transparent;
    font-weight: 700;
    cursor: pointer;
    transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.billing-cycle-switch.on-light .billing-cycle-option { color: #64748b; }
.billing-cycle-option:hover { color: #fff; transform: translateY(-1px); }
.billing-cycle-switch.on-light .billing-cycle-option:hover { color: #4338ca; }
.billing-cycle-option.is-active { color: #4338ca; background: #fff; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16); }
.billing-cycle-switch.on-light .billing-cycle-option.is-active { color: #fff; background: #4338ca; }
.billing-cycle-option .save-label { margin-left: 0.3rem; color: #047857; font-size: 0.72rem; }
.billing-cycle-switch.on-light .billing-cycle-option.is-active .save-label { color: #d1fae5; }

.plan-price-display { min-height: 58px; }
.plan-price-period { font-size: 1rem; font-weight: 600; color: #6b7280; }
.plan-yearly-saving { display: none; margin-top: -0.55rem; margin-bottom: 1rem; color: #047857; font-size: 0.78rem; font-weight: 700; }
.plan-card.is-yearly .plan-yearly-saving { display: block; }

@media (max-width: 575.98px) {
    .billing-cycle-switch { width: 100%; border-radius: 18px; }
    .billing-cycle-option { flex: 1; min-width: 0; padding-inline: 0.65rem; }
}

@media (prefers-reduced-motion: reduce) {
    .billing-cycle-option { transition: none; }
}