/* FnS typography-only pass, using Mutton's five shared type roles.
   The hero, contact/navigation, product images, and large evidence numbers
   are deliberately outside these rules. One documented weight-note spacing
   safeguard follows the type rules; media geometry is unchanged. */
.fns-type-unified {
  --fns-title: clamp(2rem, 3.5vw, 3rem);
  --fns-subhead: 1.5rem;
  --fns-body: 1.125rem;
  --fns-label: 1rem;
  --fns-note: 1.375rem;
}

/* All core-story paragraphs share the same reading size. */
.fns-type-unified #main-content > section:not(.case-opening):not(#contact) p {
  font-size: var(--fns-body);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -.012em;
  text-wrap: pretty;
}

/* Subheadings introduce a smaller idea inside a chapter. */
.fns-type-unified #main-content > section:not(.case-opening):not(#contact) h3,
.fns-type-unified #main-content .fns-paired-findings h4 {
  font-size: var(--fns-subhead);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.02em;
  text-wrap: balance;
}

/* Product-decision h3s function as section titles, just as in Mutton. */
.fns-type-unified #main-content > section:not(.case-opening):not(#contact) h2,
.fns-type-unified #main-content > section:not(.case-opening):not(#contact) .case-reading > h3 {
  font-size: var(--fns-title);
  font-weight: 650;
  line-height: 1.16;
  letter-spacing: -.03em;
  text-wrap: balance;
}

/* Context labels and controls: one readable supporting size. */
.fns-type-unified #main-content > section:not(.case-opening):not(#contact)
  :is(.case-kicker, .case-problem-label, .fd-eyebrow, .fns-perception-label,
      .fns-pain-label, .fd-architecture > li > span, .case-step-index,
      .case-counter-flow > li > span, .case-small, .fns-session-meta,
      .fns-flow-tools p, .fns-followup-index, .case-film-chapters button,
      .story-motion-glimpse figcaption b, .fns-finding-fix h5) {
  font-size: var(--fns-label);
  line-height: 1.45;
  letter-spacing: 0;
}
.fns-type-unified #main-content > section:not(.case-opening):not(#contact)
  :is(.case-kicker, .case-problem-label, .fd-eyebrow) {
  font-weight: 600;
  letter-spacing: .1em;
}

/* Annotations describe the evidence; they do not compete with its heading. */
.fns-type-unified #main-content > section:not(.case-opening):not(#contact)
  :is(.case-counter-flow > li > strong, .fns-weight-add h4,
      .fns-weight-cart h4, .fns-premium-callouts figcaption strong,
      .fns-engineering-decisions dt, .fns-weight-side h4,
      .story-size-cut-grid figcaption strong, .case-build-bridge strong) {
  font-size: var(--fns-body);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -.012em;
}
.fns-type-unified #main-content > section:not(.case-opening):not(#contact)
  :is(.case-research-positive li, .fns-engineering-decisions dd,
      .story-metric dt, .case-production-number h3,
      .story-size-cut-grid figcaption > span, .story-motion-glimpse figcaption,
      .case-build-bridge > div > span, .fns-flow-note) {
  font-size: var(--fns-body);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -.012em;
}

/* Gallery notes use the body role above; only true handwriting gets the note role. */
.fns-type-unified #main-content > section:not(.case-opening):not(#contact)
  .case-handwriting {
  font-size: var(--fns-note);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
}
.fns-type-unified #main-content > section:not(.case-opening):not(#contact)
  :is(.case-insight, .case-closing-thought) {
  font-size: var(--fns-subhead);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -.02em;
  text-wrap: balance;
}

/* The two right-hand weight notes used to occupy the same grid row.
   Give the Add note its own row so larger copy cannot overlap the net caption.
   The screen keeps its existing column, width, crop and dotted anchors. */
@media (min-width: 701px) {
  .fns-type-unified .fns-weight-comparison {
    grid-template-rows: auto auto;
    row-gap: 24px;
  }
  .fns-type-unified .fns-weight-comparison .fns-weight-screen {
    grid-row: 1 / span 2;
  }
  .fns-type-unified .fns-weight-comparison .fns-weight-add {
    grid-row: 2;
    align-self: start;
    margin: 0;
  }
}