/* ============================================================================
   course-extras.css — additions to the two course detail designs.

   course-content.css and course-claude.css are generated and must not be
   hand-edited, so anything added to those pages after generation lives here.
   Loaded after both, and scoped to .ctc-page / .clc-page so it cannot leak.
   ========================================================================== */

/* Payment-method note in the plan card, between the price and the buy button.

   Colour is set per design rather than inherited: .plan-card sets no colour of
   its own (each child names its own #fff / #000), so `inherit` resolved to the
   page's black and came out unreadable on the dark card. */
.ctc-page .plan-rocket,
.clc-page .plan-rocket {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
  padding: 4px 0 0;
  font-family: 'Noto Sans Armenian', sans-serif;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
}

/* Vibe Directing — translucent dark card over a photo. */
.ctc-page .plan-rocket { color: #fff; }

/* Built with Claude — solid brand yellow card. */
.clc-page .plan-rocket { color: #000; }

.ctc-page .plan-rocket svg,
.clc-page .plan-rocket svg {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
}

@media (max-width: 640px) {
  .ctc-page .plan-rocket,
  .clc-page .plan-rocket {
    font-size: 12px;
    padding: 8px 12px;
  }
}