/* Match the sans-serif titles used by the Modes stories. */
:root {
  --section-heading-size: clamp(40px, 5.1vw, 86px);
  --section-heading-leading: .92;
  --section-heading-tracking: -.065em;
}

.memory-format-page :is(.mf-hero h1, .mf-lede h2, .mf-reader h2, .mf-anatomy h2, .mf-profiles h2, .mf-preview h2, .mf-closing h2),
.pricing-page .pricing-clarity h2,
.marketplace-page :is(.signup-panel h2, .marketplace-opportunities-head h2),
.marketplace-page[data-marketplace-audience] .signup-panel h2 {
  font-family: var(--sans);
  font-size: var(--section-heading-size);
  font-weight: 850;
  line-height: var(--section-heading-leading);
  letter-spacing: var(--section-heading-tracking);
  word-spacing: normal;
  font-kerning: normal;
  text-wrap: balance;
  white-space: normal;
  overflow-wrap: anywhere;
}

.memory-format-page :is(.mf-lede, .mf-reader-heading, .mf-anatomy, .mf-preview) > * { min-width: 0; }
.memory-format-page .mf-reader h2 span { white-space: normal; }
.memory-format-page .mf-profile-list h3 { margin-right: 0; font-size: clamp(24px, 2vw, 34px); }

.memory-format-page :is(.mf-profile-list h3, .mf-capabilities h3),
.pricing-page .pricing-hero-plan :is(h1, h2),
.marketplace-page :is(.marketplace-feature-grid h3, .marketplace-workflow-map h3) {
  font-family: var(--sans);
  font-weight: 850;
  line-height: .98;
  letter-spacing: -.045em;
  text-wrap: balance;
}

@media (max-width: 760px) {
  :root { --section-heading-size: clamp(34px, calc(17vw - 10.88px), 62px); }
  .mf-lede { padding-block: 82px; gap: 28px; }
  .mf-reader-heading { gap: 22px; }
  .mf-anatomy { padding-block: 82px; gap: 42px; }
  .mf-anatomy-copy > p { margin-block: 22px; }
  .mf-preview { padding-block: 82px; gap: 42px; }
  .mf-preview-intro > p:last-child { margin-top: 22px; }
  .pricing-clarity { gap: 28px; }
  .signup-panel-head p { margin-top: 22px; }
}

/* A touch focus should not leave the keyboard-only skip link over the page. */
.mf-skip-link:not(:focus-visible) { transform: translateY(-150%); }