.demo-card-payment {
    display: grid;
    gap: .85rem;
    margin-top: 1.15rem;
    padding: 1rem;
    border: 1px solid rgba(33, 103, 238, .22);
    border-radius: 1rem;
    background: linear-gradient(145deg, #f7faff, #edf4ff);
}

.demo-card-payment__header {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: .75rem;
}

.demo-card-payment__header > span {
    padding: .28rem .48rem;
    border-radius: 999px;
    color: var(--color-white);
    background: var(--color-blue-600);
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.demo-card-payment h4 {
    margin: 0;
    color: var(--color-navy-900);
    font-size: 1rem;
}

.demo-card-payment__header p,
.demo-card-payment__values {
    margin: .25rem 0 0;
    color: var(--color-slate-700);
    font-size: .72rem;
    line-height: 1.5;
}

.demo-card-payment__values {
    margin: 0;
    padding: .7rem;
    border-radius: .7rem;
    color: var(--color-blue-700);
    background: rgba(33, 103, 238, .08);
}

.demo-card-payment__values strong {
    display: block;
}

.demo-card-payment input {
    background: rgba(255, 255, 255, .92);
    font-variant-numeric: tabular-nums;
}