/**
 * Storefront typography — Inter/system (--font-sans) + --text-* from header.css.
 * Load after global-font.css and header.css on marketing / content pages.
 */
:root {
  --sf-leading-body: 1.65;
  --sf-leading-ui: 1.45;
}

:is(
  .home-page,
  .about-page,
  .policy-page,
  .blog-page,
  .contact-page,
  .help-page,
  .faq-page,
  .how-it-works-page,
  .sitemap-page,
  .partner-page,
  .store-main
) {
  font-family: var(--font-sans);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:is(
  .home-page,
  .about-page,
  .policy-page,
  .blog-page,
  .contact-page,
  .help-page,
  .faq-page,
  .how-it-works-page,
  .sitemap-page,
  .partner-page,
  .store-main
) :where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--font-sans);
}

:is(
  .home-page,
  .about-page,
  .policy-page,
  .blog-page,
  .contact-page,
  .help-page,
  .faq-page,
  .how-it-works-page,
  .sitemap-page,
  .partner-page,
  .store-main,
  .search-page
) .breadcrumb {
  font-size: var(--text-xs, 11px);
  font-weight: 500;
  line-height: var(--sf-leading-ui);
  letter-spacing: 0.01em;
}