/* ==========================================================================
   service-recurring.html — page-specific styles (tokens only, no new colours)
   ========================================================================== */

/* Outlined card numbers: style.css strokes them with currentColor, which is transparent on .card__num,
   so the stroke is invisible — give it an explicit colour and invert it with the hover state. */
.card .card__num { -webkit-text-stroke-color: var(--black); }
.card--hover:hover .card__num { -webkit-text-stroke-color: var(--white); }

/* Checklist inside the link / invoice cards — tighter than .stack */
.rec-list { display: flex; flex-direction: column; gap: 12px; }
.rec-list .check-item { font-size: 14px; line-height: 1.3; }

/* Aside next to the code sample: align its top with the code block (below the tab bar) */
.rec-aside { padding-top: 78px; }

@media (max-width: 1023px) {
  .rec-aside { padding-top: 0; }
}

@media (max-width: 639px) {
  .rec-list { gap: 10px; }
}