/* Shared text hierarchy; retain the existing fonts, colours and page layout. */
:root {
  --copy-size: 16px;
  --lead-size: 18px;
  --section-title-size: 48px;
  --item-title-size: 28px;
  --link-size: 14px;
}

#main p:not(.eyebrow):not(.lead):not(.section-note) {
  font-size: var(--copy-size);
  line-height: 1.65;
}

/* The original theme uses an important declaration for these paragraphs. */
#main .technology-facts p {
  font-size: var(--copy-size) !important;
  line-height: 1.65;
}

#main .technology-facts h3:last-child {
  margin-bottom: 0;
}

#main .lead {
  font-size: var(--lead-size);
  line-height: 1.6;
}

#main h2,
#main .story-copy h3 {
  font-size: var(--section-title-size);
  line-height: 1.15;
}

#main .benefits h3,
#main .technology-facts h3,
#main .home-news-grid h3 {
  font-size: var(--item-title-size);
  line-height: 1.2;
}

#main .text-link {
  font-size: var(--link-size);
  line-height: 1.4;
}

#main .home-intro > div > p:first-child:not(.eyebrow),
#main .home-proof > div > .text-link:first-child,
#main .home-media-copy h2 + .text-link {
  margin-top: 0;
}

/* These cards now contain just a number and a headline. */
#main .benefits-summary .section-heading {
  align-items: flex-start;
}

#main .benefits-summary .three-columns {
  margin-top: 36px;
  align-items: start;
}

#main .benefits-summary .three-columns h3 {
  margin-bottom: 0;
}

#main .benefits-summary .three-columns .index {
  margin-bottom: 18px;
}

@media (max-width: 800px) {
  :root {
    --copy-size: 15px;
    --lead-size: 17px;
    --section-title-size: 36px;
    --item-title-size: 26px;
    --link-size: 13px;
  }
}

@media (max-width: 600px) {
  :root {
    --section-title-size: 35px;
    --item-title-size: 26px;
  }

  #main .benefits-summary .three-columns {
    gap: 24px;
    margin-top: 28px;
  }

  #main .benefits-summary .three-columns article {
    padding-top: 20px;
  }

  #main .benefits-summary .three-columns .index {
    top: 25px;
    margin: 0;
  }
}