/*
 * RCS shared typography scale
 * Desktop base: 18px / Mobile base: 16px
 * Heading ratio: 1 : 1.414 (silver ratio)
 * This file must be loaded after the common and page-specific stylesheets.
 */

:root {
  --rcs-type-note: 0.875rem;          /* 14px */
  --rcs-type-small: 1rem;             /* 16px */
  --rcs-type-body: 1.125rem;          /* 18px */
  --rcs-type-lead: 1.25rem;           /* 20px: body emphasis */
  --rcs-type-heading-small: 1.5625rem; /* 25px ≒ 18 × 1.414 */
  --rcs-type-heading-medium: 2.25rem;  /* 36px ≒ 25 × 1.414 */
  --rcs-type-heading-large: 3.1875rem; /* 51px ≒ 36 × 1.414 */
  --rcs-type-heading-hero: 4.5rem;     /* 72px ≒ 51 × 1.414 */
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-size: var(--rcs-type-body);
}

/* Standard reading text */
main p,
main li,
main dt,
main dd,
main td,
main th {
  font-size: var(--rcs-type-body) !important;
  line-height: 1.8;
}

/* Semantic heading hierarchy */
main h1 {
  font-size: var(--rcs-type-heading-hero) !important;
  line-height: 1.25;
}

main h2 {
  font-size: var(--rcs-type-heading-large) !important;
  line-height: 1.35;
}

main h3 {
  font-size: var(--rcs-type-heading-medium) !important;
  line-height: 1.45;
}

main h4,
main h5,
main h6 {
  font-size: var(--rcs-type-heading-small) !important;
  line-height: 1.5;
}

/* Introductory text gets one restrained intermediate step. */
main [class*="__lead"],
main .comparison__lead,
main .top-message__text {
  font-size: var(--rcs-type-lead) !important;
  line-height: 1.9;
}

/* Emphasis within reading text stays one restrained step above body copy. */
main p strong,
main li strong,
main dt strong,
main dd strong,
main td strong,
main th strong {
  font-size: var(--rcs-type-lead) !important;
}

/* Statements function as small headings even when marked up as paragraphs. */
main .top-message__statement,
main .construction-management__catch,
main .management-association__promise {
  font-size: var(--rcs-type-heading-medium) !important;
  line-height: 1.65;
}

/* English eyebrows, labels and other supporting information. */
main [class*="eyebrow"],
main [class*="__label"],
main [class*="__number"],
main [class$="__en"],
main .en {
  font-size: var(--rcs-type-small) !important;
  line-height: 1.6;
}

/* Sources, captions and legal notes never drop below 13px. */
main [class*="caption"],
main [class*="__source"],
main [class*="__note"],
main small,
.copyright {
  font-size: var(--rcs-type-note) !important;
  line-height: 1.7;
}

/* Navigation and actions remain comfortably tappable/readable. */
header a,
nav a,
button,
input,
select,
textarea,
main [class*="cta"] a,
main a[class*="button"],
main a[class*="btn"] {
  font-size: var(--rcs-type-small);
}

main [class*="cta"] a,
main a[class*="button"],
main a[class*="btn"] {
  font-size: var(--rcs-type-body) !important;
}

@media (max-width: 767px) {
  :root {
    /* Keep long-form text readable while preventing excessive wrapping. */
    --rcs-type-note: 0.8125rem;          /* 13px */
    --rcs-type-small: 0.875rem;          /* 14px */
    --rcs-type-body: 1rem;               /* 16px */
    --rcs-type-lead: 1.125rem;           /* 18px */
    --rcs-type-heading-small: 1.3125rem; /* 21px */
    --rcs-type-heading-medium: 1.625rem; /* 26px */
    --rcs-type-heading-large: 1.875rem;  /* 30px */
    --rcs-type-heading-hero: 2rem;       /* 32px: content titles */
  }

  main p,
  main li,
  main dt,
  main dd,
  main td,
  main th {
    font-size: var(--rcs-type-body) !important;
  }

  main .top-message__statement,
  main .construction-management__catch,
  main .management-association__promise {
    font-size: var(--rcs-type-heading-medium) !important;
  }
}
