/* Editorial lineation. Keep the copy in one heading and prefer complete thoughts.
   A phrase may wrap internally when enlarged text exceeds the available measure. */
h1 .sa-phrase, h2 .sa-phrase, h3 .sa-phrase,
.tool h3 span.sa-phrase, .sa-phrase {
  display: inline-block;
  max-inline-size: 100%;
  vertical-align: baseline;
  white-space: normal;
  font-weight: inherit;
  color: inherit;
}
h1 .sa-line, h2 .sa-line, h3 .sa-line,
.tool h3 span.sa-line { display: block; }
/* Emergency wrapping is only used when an individual word exceeds its box,
   e.g. at enlarged text sizes. Normal layouts retain the reviewed word groups. */
h1, h2, h3, .sa-phrase { overflow-wrap: break-word; word-break: normal; hyphens: manual; }
.problem h2 { max-inline-size: 100%; }
.invitation h2 { max-inline-size: 68rem; margin-inline: auto; }
.faq h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
.life-intro { container-type: inline-size; }
.life-intro h2 { font-size: clamp(1.25rem, 10cqi, 2rem); }
.tool-content, .tools-heading > *, .result-card, .reflection-steps article,
.intro-copy, .perspective-copy, .life-intro, .steps > article { min-inline-size: 0; }
/* Existing title spans supplied color/weight as well as a forced line. */
.tool h3 .sa-subtitle { color: #e0e3ec; font-weight: 300; }
.tool-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 27rem), 1fr)); }
.tool h3 { font-size: clamp(1.25rem, 2vw, 1.4375rem); }
header.hero { height: auto; min-height: max(780px, min(900px, 100svh)); max-height: none; }
.topbar { flex-wrap: wrap; gap: 12px; }
.big-btn { max-inline-size: 100%; overflow-wrap: break-word; }
.thanks-hero .card p { overflow-wrap: break-word; }
@media (max-width: 820px) {
  header.hero { min-height: 700px; }
}
/* Give the reading column enough measure before returning to the split layout. */
@media (max-width: 767px) {
  .intro, .perspective { grid-template-columns: 1fr; }
  .intro-photo { min-height: 320px; height: 320px; }
  .faq { display: block; }
  .life-grid { display: flex; flex-direction: column; }
  .life-photo { height: 280px; }
}
@supports (text-wrap: pretty) {
  .lede, .tagline, blockquote { text-wrap: pretty; }
}
@media (max-width: 560px) {
  header.hero { min-height: 710px; }
  .problem h2, .tools h2, .outcome h2, .reflection h2,
  .result-types h2, .perspective-copy h2, .life-intro h2 {
    font-size: clamp(1.5rem, 7.5vw, 2rem);
  }
  .intro-copy h2 { font-size: clamp(1.5rem, 7.5vw, 2.125rem); }
  .closing h2 { font-size: clamp(1.5rem, 7.5vw, 2.1875rem); }
  .tool h3 { font-size: clamp(1.25rem, 5.8vw, 1.75rem); }
  .photo-hero h1 { font-size: clamp(1.875rem, 8.5vw, 2.3125rem); }
  .doc h1.sa-score-title { font-size: clamp(1.5rem, 7.5vw, 1.875rem); }
  .doc h1.sa-guide-title { font-size: clamp(1.25rem, 6.25vw, 1.875rem); }
}
@media print {
  h1, h2, h3 { break-after: avoid-page; }
  p { orphans: 3; widows: 3; }
}