.modern-stat-card {
    border-radius: 18px;

    padding: 28px;

    box-shadow:
        0 10px 30px rgba(0,0,0,.06);

    transition: .25s ease;

    height: 100%;
}

.modern-stat-card:hover {

    transform: translateY(-4px);

    box-shadow:
        0 14px 40px rgba(0,0,0,.10);
}

.stat-icon {

    width: 56px;
    height: 56px;

    border-radius: 14px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#eef2ff;

    font-size:24px;

    margin-bottom:18px;

    color:#4f46e5;
}

.stat-title {

    color:#6b7280;

    font-size:14px;

    margin-bottom:8px;
}

.stat-value {

    font-size:32px;

    font-weight:800;

    color:#111827;
}

.modern-progress {

    height:10px;

    border-radius:999px;

    overflow:hidden;

    background:#e5e7eb;
}

.modern-progress .progress-bar {

    border-radius:999px;
}

.billing-badge{
    display:inline-block;
    padding:6px 14px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.3px;
    color:#fff;
    box-shadow:0 4px 12px rgba(0,0,0,.12);
}

.billing-monthly{
    background:linear-gradient(135deg,#3b82f6,#2563eb);
}

.billing-quarterly{
    background:linear-gradient(135deg,#f59e0b,#d97706);
}

.billing-semiannually{
    background:linear-gradient(135deg,#8b5cf6,#6d28d9);
}

.billing-annually{
    background:linear-gradient(135deg,#10b981,#059669);
}