/* Justified text, refined 28 Oct.
   Body text is justified so paragraphs read as clean blocks.
   Headlines, titles, labels, buttons, tags and short lists stay left-aligned.
   To go back to fully left-aligned text: remove the justify.css <link> line from each page. */

.prose p,
.prose li,
.legal p,
.split > div > p,
.split-media > div > p,
.service .lead,
.area p,
.sectors p,
.principles p,
.stage > p:not(.outputs),
.article-row div > p,
.cta-band p,
.newsletter p,
.footer-about,
.confidential p,
.form-note,
.hero .lead,
.page-head .lead,
.article-head .dek {
  text-align: justify;
  text-justify: inter-word;
  -webkit-hyphens: auto;
  hyphens: auto;
  hyphenate-limit-chars: 8 3 3;
}

/* Never justified: anything that works as a title or a label */
h1, h2, h3, h4,
.statement, .quote-line,
.section-head p,
.path p,
.stage .outputs,
.ticks li, .credentials li, .sector-tags li, .regions li,
.offices li, .contact-list li, .footer-links li, .footer-base,
.crumb, .meta, .cat, .time,
.btn, .nav li, .choices, .form-status, label, legend {
  text-align: left;
  -webkit-hyphens: manual;
  hyphens: manual;
}

/* Phones: the large intro lines are too wide for clean justification in a narrow column,
   so they stay left-aligned there; normal body text stays justified. */
@media (max-width: 47.99em) {
  .hero .lead,
  .page-head .lead,
  .article-head .dek,
  .service .lead,
  .split > div > p.lead,
  .split-media > div > p.lead,
  .cta-band p {
    text-align: left;
    -webkit-hyphens: manual;
    hyphens: manual;
  }
}

/* Wide screens: the advisory-area and sector cards sit three to a row; their columns are too narrow
   for clean justification, so their short texts stay left-aligned there. */
@media (min-width: 64em) {
  .area p,
  .sectors p {
    text-align: left;
    -webkit-hyphens: manual;
    hyphens: manual;
  }
}
