@layer pages {
  body.future-ui.shell-public main > section {
    scroll-margin-block-start: var(--mf-sticky-top);
  }

  body.future-ui.shell-public .eyebrow {
    letter-spacing: .08em;
  }

  body.future-ui.shell-public :where(.course-card, .price-card, .trust-card) h3,
  body.future-ui.shell-public :where(.course-card, .price-card, .trust-card) p {
    overflow-wrap: break-word;
    line-break: strict;
  }

  body.future-ui.shell-public .price-card .price {
    color: var(--mf-ink-950);
    font-variant-numeric: tabular-nums;
  }

  body.future-ui.shell-public .featured-ribbon {
    background: var(--mf-blue-600);
    color: var(--mf-text-inverse);
  }

  @media (max-width: 560px) {
    body.future-ui.shell-public .compare-table-wrap {
      overflow-x: auto;
      scrollbar-gutter: stable;
    }
  }
}
