/* === WIDGET: about | scope .vr-about ====================================== */
@layer widgets {
  .vr-about > .vr-container > .vr-card { padding: 30px; }
  .vr-about h2 { font-size: 1.75rem; }
  .vr-about .vr-about__lead { font-size: 1rem; color: var(--vr-ink); margin-top: 18px; }
  .vr-about__planned { display: flex; align-items: flex-start; gap: 12px; margin-top: 24px; padding: 16px; border: 1px solid var(--vr-border); border-left: 3px solid var(--vr-brand); border-radius: 7px; }
  .vr-about__planned > .vr-icon { color: var(--vr-brand); }
  .vr-about__planned strong { display: block; font-size: .8rem; }
  .vr-about__planned span { display: block; margin-top: 6px; font-size: var(--vr-text-xs); color: var(--vr-muted); }
  .vr-about__steps { list-style: none; counter-reset: steps; padding: 0; margin-top: 20px; }
  .vr-about__steps li { counter-increment: steps; display: flex; align-items: flex-start; gap: 12px; margin-top: 16px; font-size: var(--vr-text-sm); }
  .vr-about__steps li::before { content: counter(steps); flex: 0 0 23px; height: 23px; border-radius: 50%; background: var(--vr-brand); color: white; font-size: .7rem; font-weight: 700; display: grid; place-items: center; }
  .vr-about__steps p { margin-top: 3px; font-size: var(--vr-text-xs); }
  .vr-about .vr-about__disclosure { font-size: var(--vr-text-xs); border-top: 1px solid var(--vr-border); padding-top: 16px; margin-top: 20px; }
  @media (max-width: 680px) { .vr-about > .vr-container > .vr-card { padding: 24px; } }
}
/* === END WIDGET: about =================================================== */
