/* Vernostný program: popis pred spustením (/vernostny-program) */
.vp { display: grid; gap: var(--app-space-7); padding: calc(var(--app-space-7) + var(--app-space-5)) 0 calc(var(--app-space-7) * 2); }
.vp h2 { margin: 0 0 var(--app-space-4); font-size: clamp(24px, 2.6vw, 32px); line-height: 1.15; letter-spacing: -0.02em; }
.vp-head { display: grid; gap: var(--app-space-4); justify-items: start; max-width: 760px; }
.vp-head h1 { margin: 0; font-size: clamp(34px, 5vw, 58px); line-height: 1.05; letter-spacing: -0.03em; }
.vp-lead { margin: 0; font-size: 18px; line-height: 1.55; color: var(--v3-muted); max-width: 60ch; }
.vp-badge { display: inline-block; margin-left: 8px; padding: 4px 10px; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--burgundy) 10%, var(--white)); color: var(--burgundy); font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: none; }
.vp-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--app-space-4); }
.vp-steps li { position: relative; padding: var(--app-space-5); border-radius: 22px; background: var(--white); box-shadow: var(--v3-card-shadow); }
.vp-steps h3 { margin: var(--app-space-3) 0 6px; font-size: 20px; color: var(--burgundy); }
.vp-steps p { margin: 0; color: var(--v3-muted); line-height: 1.55; }
.vp-n { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--burgundy); color: var(--white); font-weight: 600; }
.vp-grid { display: grid; gap: var(--app-space-5); }
.vp-card { padding: var(--app-space-5); border-radius: 22px; background: color-mix(in srgb, var(--white) 72%, transparent); border: 1px solid var(--v3-line-soft); }
.vp-rows, .vp-ladder { list-style: none; margin: 0; padding: 0; display: grid; }
.vp-rows li, .vp-ladder li { display: flex; justify-content: space-between; gap: var(--app-space-4); padding: 12px 0; border-top: 1px solid var(--v3-line); }
.vp-rows li:first-child, .vp-ladder li:first-child { border-top: 0; }
.vp-rows b { color: var(--burgundy); white-space: nowrap; }
.vp-ladder li { counter-increment: lvl; }
.vp-ladder b { color: var(--v3-muted); font-weight: 600; white-space: nowrap; }
.vp-ladder li:last-child span { font-weight: 700; color: var(--burgundy); }
.vp-rewards ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--app-space-4); }
.vp-rewards li { display: grid; gap: 6px; padding: var(--app-space-5); border-radius: 22px; background: var(--white); box-shadow: var(--v3-card-shadow); }
.vp-rewards strong { font-size: 18px; color: var(--burgundy); }
.vp-rewards li > span:last-child { color: var(--burgundy); font-weight: 600; }
.vp-reward-icon { width: 28px; height: 28px; color: var(--burgundy); }
.vp-credits p { margin: 0 0 var(--app-space-3); line-height: 1.6; max-width: 70ch; }
.vp-final { display: grid; gap: var(--app-space-4); justify-items: start; padding: var(--app-space-7) var(--app-space-6); border-radius: 28px; background: radial-gradient(70% 120% at 100% 0%, color-mix(in srgb, var(--ember) 35%, transparent), transparent 60%), var(--burgundy); color: var(--white); }
.vp-final h2 { color: var(--white); max-width: 30ch; }
.vp-final .btn-primary { background: var(--white); color: var(--burgundy); }
.vp-final .btn-primary:hover { background: color-mix(in srgb, var(--white) 86%, var(--ember)); color: var(--burgundy); }
.vp-note { margin: 0; font-size: 14px; color: color-mix(in srgb, var(--white) 75%, transparent); }
@media (min-width: 900px) {
  .vp-steps { grid-template-columns: repeat(3, 1fr); }
  .vp-grid { grid-template-columns: 1fr 1fr; align-items: start; }
  .vp-rewards ul { grid-template-columns: repeat(3, 1fr); }
}