/* Shared type scale. Keep page copy at its natural size; never simulate zoom.
   Heading sizes use rem so reader font preferences still apply. */
.sx-site { font-size: 1rem; }

/* Main website and newsletter landing page. */
.sx-marketing .hero h1 {
  font-size: 2.25rem;
  line-height: 1.16;
  margin-bottom: 16px;
}
.sx-marketing .page:not(#page-home) h1 { font-size: 2rem; line-height: 1.2; }
.sx-marketing .hero p.lede,
.sx-marketing .section-head p { font-size: 1rem; line-height: 1.6; }
.sx-marketing .section-head h2 { font-size: 1.5rem; line-height: 1.25; }
.sx-marketing .shot-copy h3 { font-size: 1.25rem; line-height: 1.3; }
.sx-marketing section.band { padding: 52px 0; }
.sx-marketing section.band.tight { padding: 36px 0; }
.sx-marketing .section-head { margin-bottom: 28px; }
.sx-marketing .hero .cta-row { margin-top: 20px; }

/* Article archive. Smaller supporting labels already have their own scale. */
.sx-library .hero { padding: 36px 0 24px; }
.sx-library .hero h1 { font-size: 2rem; line-height: 1.2; max-width: 720px; }
.sx-library .hero p { font-size: 1rem; line-height: 1.6; }
.sx-library .featured h2 { font-size: 1.375rem; line-height: 1.25; }
.sx-library .resources-section h2 { font-size: 1.375rem; line-height: 1.3; }

/* Articles and their companion reading guides share one body/title rhythm. */
.sx-article { line-height: 1.65; }
.sx-article .hero { padding: 28px 0 22px; }
.sx-article .hero h1 {
  font-size: 2.125rem;
  line-height: 1.18;
  letter-spacing: -.025em;
  margin-bottom: 14px;
}
.sx-article .hero > p { font-size: 1rem; line-height: 1.6; margin-bottom: 16px; }
.sx-article .back-link { margin-bottom: 18px; }
.sx-article article { font-size: 1rem; line-height: 1.65; }
.sx-article article p { margin-bottom: 16px; }
.sx-article article h2 {
  font-size: 1.375rem;
  line-height: 1.3;
  margin: 34px 0 14px;
}
.sx-article .article-body { max-width: 68ch; }
.sx-article .article-body .article-lead,
.sx-article .article-body .article-callout { font-size: 1.0625rem; line-height: 1.65; }
.sx-article .article-body .article-callout { padding: 18px 22px; margin: 24px 0; }
.sx-article .article-toc { padding: 14px 0 18px; margin-bottom: 26px; }
.sx-article .review-resource { margin: 36px auto; padding: 26px; }
.sx-article .review-resource h2 { font-size: 1.375rem; line-height: 1.3; }
.sx-article .review-resource p,
.sx-article .review-resource li { font-size: 1rem; line-height: 1.65; }
.sx-article .review-resource .resource-footnote { font-size: .875rem; }

/* Standalone interactive resources and legal pages. */
.sx-tool h1,
.sx-legal h1 { font-size: 1.75rem; line-height: 1.2; }
.sx-tool h2 { font-size: 1.25rem; line-height: 1.3; }
.sx-tool .score { font-size: 2.5rem; }

@media (max-width: 920px) {
  .sx-marketing nav.main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
  }
  .sx-marketing .navlinks {
    grid-column: 1 / -1;
    grid-row: 2;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 20px;
    padding-bottom: 2px;
  }
  .sx-marketing .navlinks a { white-space: nowrap; }
  .sx-marketing .nav-cta { justify-content: flex-end; }
}

@media (max-width: 600px) {
  .sx-marketing .hero h1 { font-size: 1.875rem; }
  .sx-marketing .page:not(#page-home) h1 { font-size: 1.75rem; }
  .sx-marketing nav.main { padding: 12px 16px; gap: 10px; }
  .sx-marketing .brand { gap: 8px; }
  .sx-marketing .brand img { width: 28px; height: 28px; }
  .sx-marketing .brand .wordmark { font-size: 1.0625rem; white-space: nowrap; }
  .sx-marketing .navlinks { gap: 12px; }
  .sx-marketing .navlinks li a { font-size: .75rem; }
  .sx-marketing .nav-cta .btn { font-size: .75rem; padding: 8px 10px; }
  .sx-marketing .section-head h2 { font-size: 1.375rem; }
  .sx-marketing section.band { padding: 36px 0; }
  .sx-marketing section.band.tight { padding: 28px 0; }
  .sx-article .hero { padding: 24px 0 18px; }
  .sx-article .hero h1,
  .sx-library .hero h1 { font-size: 1.75rem; }
  .sx-article .article-body h2 { font-size: 1.25rem; margin-top: 28px; }
  .sx-article .review-resource { padding: 22px 20px; }
  .sx-library .hero { padding: 24px 0 20px; }
  .sx-library .featured h2 { font-size: 1.25rem; }
  .sx-tool h1,
  .sx-legal h1 { font-size: 1.625rem; }
  /* Keep form fields readable without triggering mobile focus magnification. */
  .sx-site input:not([type=checkbox]):not([type=radio]),
  .sx-site select,
  .sx-site textarea { font-size: 1rem; }
}

@media (max-width: 360px) {
  .sx-site .site-brand,
  .sx-marketing .brand { gap: 6px; }
  .sx-site .site-brand img,
  .sx-marketing .brand img { width: 24px; height: 24px; }
  .sx-site .site-brand .wordmark,
  .sx-marketing .brand .wordmark { font-size: 1rem; }
  .sx-site .site-nav-cta,
  .sx-marketing .nav-cta .btn { padding: 8px; font-size: .6875rem; }
}