/* ============================================================
   TEXT — justified (2026-10-06)

   Running text is set justified. It was a switch for a day, ragged
   against justified under j, and closed on justified; the ragged right
   the site shipped in is what style.css, pages.css and photos.css
   still say underneath, and this file is loaded after them and
   overrides them — every rule here starts at :root, so it outweighs
   the rule it replaces rather than relying on coming later.

   Justified type is not one property. text-align: justify on its own
   is what makes justified web text look bad — the browser can only
   widen spaces, never break a word, so every short line opens a hole
   and the holes line up into rivers. What it takes to look like a
   page someone set:

     1  only running text      paragraphs, lists of sentences, captions
                               and quotes in the body face. Headings,
                               labels, buttons, the mono, tables and
                               data stay flush left: a justified
                               heading is a line of gaps, and a
                               justified label is nothing at all.
     2  hyphenation            the whole of what keeps the spaces even.
                               Words of six letters and more, three
                               letters either side of the break, never
                               more than two hyphens running (Safari
                               honours the last; Chrome cannot yet).
                               Addresses, codes and emails never break.
     3  plain wrap             balance shortens every line to match the
                               shortest, and justify then stretches
                               each one back out: the worst spacing on
                               the page. Pretty is no better here:
                               Chrome's pulls a word down to keep the
                               last line from standing alone and never
                               asks what that does to the line above,
                               which justify then opens into holes. A
                               last line of one word is the lesser
                               fault in a justified block, and the one
                               every book accepts.
     4  a measure to justify   under ~32ch a line holds five or six
                               words, and the slack of a long word
                               carried over is shared between four
                               spaces that open into holes no
                               hyphenation closes. A phone's column is
                               33, so under 600px nothing is justified.
                               Above it, head.js measures every
                               justified block and hands data-rag to
                               the narrow ones,
                               a card three to a row on a tablet, so
                               they stay ragged.
     5  edges that land       a ragged block's right edge is a blur,
                               so where it stopped never mattered. A
                               justified one is a hard line, and a hard
                               line that stops short of everything
                               around it reads as a mistake. So the
                               blocks that sat in a column narrower
                               than the column now take the column:
                               the section sentence runs to the rail's
                               end, a caption to its photograph's
                               edges.
   ============================================================ */

/* ---- 1–4 · what is justified, and how ---- */
@media (min-width: 600px) {
  :root :is(
    /* the inner pages: his documents, the FAQ, the steps */
    .lede:not(.lede--parts), .prose p:not(.chain), .prose .list li, .callout, .faq__a p, .faq details p, .step p,
    .svc3__role, .svc3__list li, .ab-list li, .ab-scope__lede,
    /* the home page */
    .hero__support, .hero__nh, .sec-head__prose p, .sec-close p:not(:first-child),
    .sol__lead, .sol__b, .sector p, .ind-panel__p, .kc__s, .ref__q p, .why-qs li,
    .cred__card-b, .who__body p, .ph__t, .wmap__sub, .wmap__case-sum, .legal__note,
    /* every page */
    .foot-tag
  ):not([data-rag]) {
    text-align: justify;
    text-justify: inter-word;
    -webkit-hyphens: auto;
    hyphens: auto;
    hyphenate-limit-chars: 6 3 3;
    -webkit-hyphenate-limit-before: 3;
    -webkit-hyphenate-limit-after: 3;
    -webkit-hyphenate-limit-lines: 2;
    text-wrap: wrap;
    /* Safari only: quotes and the full stop at the end of a line hang
       outside it, so the edge is optical rather than arithmetic */
    hanging-punctuation: first allow-end last;
  }
  /* the two places an id outranks the list above, both of them balance */
  :root #services :is(.sec-head__prose .lede, .sec-close p:not(:first-child), .sol__b):not([data-rag]) {
    text-wrap: wrap;
  }
}

/* what must never take a hyphen, wherever it sits */
:root :is(a[href^="mailto:"], .mono, .src, code, abbr, .chain, address) {
  -webkit-hyphens: manual;
  hyphens: manual;
}

/* ---- 5 · edges that land ---- */

/* The section's own sentence beside its headline ran 54ch into a
   column a little wider than that, ending a hand short of the rail's
   number above it. It takes the column — 51ch at the lede size on a
   laptop, 53 on a desk display, so the measure barely moves. */
@media (min-width: 1100px) {
  :root .sec-head > p:not(.eyebrow, .aud),
  :root :is(.who__in, .legal__in) > .sec-head > p:not(.eyebrow),
  :root .sec-head > .sec-head__prose,
  :root #services :is(.sec-head__prose .lede, .sec-close p:not(:first-child)) {
    max-width: none;
  }
}
/* a caption is as wide as its photograph — except under About's photo
   across the whole page, where it would be a line no one can track */
:root .ph__t { max-width: none; }
:root .ab-hero .ph__t { max-width: 44ch; }
/* the paragraph beside the photograph on About takes its column */
:root .who__body p { max-width: none; }