/* ============================================================
 * Bill primitive — giant price display ("NEW $40", "OLD $95++").
 * Used on card backs. Pair with `.bill-sub` for tagline.
 * ============================================================ */

.bill {
  font-family: 'Outfit', sans-serif;
  font-weight: 800;
  font-size: clamp(64px, 8.5vw, 120px);
  line-height: 0.9;
  letter-spacing: -0.045em;
  text-transform: uppercase;
  text-align: center;
}
.bill .label { color: var(--white); display: block; }
.bill .price-jaz { color: var(--jaz-blue-bright); display: block; margin-top: 4px; }
.bill .price-accent { color: var(--accent-light); display: block; margin-top: 4px; }

.bill .currency {
  font-size: 0.65em;
  font-weight: 800;
  letter-spacing: -0.03em;
  margin-right: 0.03em;
  position: relative;
  top: -0.05em;
}
.bill .plus {
  font-size: 0.36em;
  font-weight: 800;
  vertical-align: top;
  margin-left: 0.06em;
  letter-spacing: -0.04em;
  line-height: 1;
  position: relative;
  top: 0.1em;
}
.bill-sub {
  font-family: 'Outfit', sans-serif;
  font-weight: 500;
  font-size: 22px;
  line-height: normal;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-align: center;
  margin-top: 18px;
}

/* .back-cta-btn rules live in primitives/button.css (shared with .cta-button). */

@media (max-width: 900px) {
  .bill { font-size: clamp(56px, 12vw, 96px); }
  .bill-sub { font-size: 16px; letter-spacing: 1.6px; line-height: normal; }
}