/* Shared web adaptation of the CloudHero typography guidelines.
 * Roboto Regular for reading; keep the existing heading and UI hierarchy.
 * Loaded after template CSS, including its mobile and legacy inline sizes.
 */
:root {
  --ch-font-family: "Roboto", Arial, Helvetica, Verdana, sans-serif;
  --font-family: var(--ch-font-family);
  --ch-body-size: 20px;
  --ch-card-size: 18px;
  --ch-body-leading: 1.6;
}

body,
body :is(main, .ch-platform, .chr-article, .chr-library, .chn-header,
  .chn-footer, .chp-header, .chp-footer, .ch-case-next, .ch-credentials-summary),
body :is(.chn-direct, .chn-fallback, .chn-trigger, .chn-group-title,
  .chn-footer-group h2, .chn-mobile-toggle, .chp-menu-toggle,
  .chr-format-nav, .chr-button, .chp-footer-top p) {
  font-family: var(--ch-font-family);
}

/* Paragraphs, lists and legacy text classes (also used on divs), excluding headings,
 * metadata, navigation, form controls and compact embedded interfaces.
 * !important is limited to reading size/leading to supersede old theme rules.
 */
body main :is(p, li, .headline-help, .banner-text):not(:where(
  nav *, form *, table *, figcaption *, pre *,
  .chac *, .ch-readiness *, .chp-sample-report *,
  .chp-trust *, .ch-credentials-summary *, .chp-breadcrumb *,
  .chr-card-meta *, .ch-weekly-meta *, .author-box *,
  .cloudhero-entity__details *, .team-info *, .mans-photos-text,
  .headline-category, .headline-text, .article-title, .mini-title,
  .team-name, .event-text, .event-little, .resourceEventContentRight p:first-of-type,
  .chp-label, .chp-note, .chp-price *, .chp-stat *,
  .chr-kicker, .chr-byline, .chr-card-meta, .chr-result-count,
  .chm-meta, .chm-evidence-note, .chc-byline, .chc-source,
  .chv-byline, .chv-note, .chv-credentials,
  .ch-case-kicker, .ch-case-index-kicker, .ch-case-index-nav-label,
  .ch-story-eyebrow, .ch-story-byline,
  .ch-weekly-kicker, .ch-weekly-date, .ch-weekly-meta,
  .lh-eyebrow, .lh-note, .lh-home-meta,
  .cve-eyebrow, .cve-meta, .htw-eyebrow, .htw-meta,
  .ch-home-team-label, .ch-home-partner, .ch-home-terms, .ch-home-expertise,
  .ch-customer-hint, .chd-metrics-note, .ch-credentials-eyebrow,
  .sr-micro, .sr-note, .sr-source,
  [class*="eyebrow"], [class*="kicker"], [class*="byline"],
  .visually-hidden, .screen-reader-text
)) {
  font-size: var(--ch-body-size) !important;
  line-height: var(--ch-body-leading) !important;
}

/* Cards retain a compact scale on desktop and mobile. Only copy is selected,
 * so their titles, dates and labels continue to use the template hierarchy.
 */
body main :is(.chp-panel, .chp-service-card, .chp-detail-item, .chp-proof,
  .chr-card, .chr-card-body, .chp-hero-aside, .chp-responsibility,
  .chp-steps, .sr-steps, .ac-entry-cards, .ch-home-aws-card,
  .ch-home-audience-grid, .ch-home-team-action, .chm-related,
  .cloudhero-card, .cloudhero-reading-group) :is(p, li):not(:where(
    [class*="kicker"], [class*="eyebrow"], .chp-label, .chp-note,
    .chr-card-meta, .chr-card-meta *, .chc-source, .ch-home-terms,
    .chp-stat *, .chp-price *, nav *, form *
  )),
body main .article-text {
  font-size: var(--ch-card-size) !important;
  line-height: var(--ch-body-leading) !important;
}

/* Reading content is also stored in definition lists and nested speaker cards.
 * Select the prose containers so prominent numeric facts keep their own scale.
 */
body main .chv-guide dd {
  font-size: var(--ch-body-size) !important;
  line-height: var(--ch-body-leading) !important;
}

body main :is(.author-box__bio, .chp-sample-report-body) p,
body main .single-post .chr-speakers p,
body main :is(.chv-finding, .chp-finding-meta, .ch-story-facts,
  .ch-weekly-promise, .ch-case-facts, .ch-story-metrics) dd,
body main :is(.chp-note, .chv-note, .chd-metrics-note, .chm-evidence-note,
  .chc-source, .lh-note, .ch-home-terms, .sr-micro, .sr-note, .event-little) {
  font-size: var(--ch-card-size) !important;
  line-height: var(--ch-body-leading) !important;
}

/* Allow longer paragraphs to wrap without changing the approved columns. */
body main :is(.article-text, .chp-lede, .banner-text, .chp-panel p) {
  overflow-wrap: break-word;
}