/*
 * First Sheep — Global Typography Roles
 *
 * Loaded after each page stylesheet and before manual-overrides.css.
 * Page structure and semantic heading levels remain unchanged; selectors below
 * assign visual roles to the existing markup.
 */

/* Shared page roles */
main.page-home,
main.page-about,
main.page-features,
main.page-record,
main.page-dialogue,
main.page-coach,
main.page-work,
main.page-pricing,
main.page-science,
main.page-ai,
main.page-safety,
main.page-privacy,
main.page-faq,
main.page-column,
main.page-column-article,
main.page-company,
main.page-team,
main.page-news,
main.page-contact,
main.page-legal {
  font-family: var(--first-sheep-font);
}

main.page-about h1,
main.page-features h1,
main.page-record h1,
main.page-dialogue h1,
main.page-coach h1,
main.page-work h1,
main.page-pricing h1,
main.page-science h1,
main.page-ai h1,
main.page-safety h1,
main.page-privacy h1,
main.page-faq h1,
main.page-column h1,
main.page-column-article h1,
main.page-company h1,
main.page-team h1,
main.page-news h1,
main.page-contact h1,
main.page-legal h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}

main.page-about h2,
main.page-features h2,
main.page-record h2,
main.page-dialogue h2,
main.page-coach h2,
main.page-work h2,
main.page-pricing h2,
main.page-science h2,
main.page-ai h2,
main.page-safety h2,
main.page-privacy h2,
main.page-faq h2,
main.page-column h2,
main.page-column-article h2,
main.page-company h2,
main.page-team h2,
main.page-news h2,
main.page-contact h2,
main.page-legal h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}

main.page-about h3,
main.page-features h3,
main.page-record h3,
main.page-dialogue h3,
main.page-coach h3,
main.page-work h3,
main.page-pricing h3,
main.page-science h3,
main.page-ai h3,
main.page-safety h3,
main.page-privacy h3,
main.page-faq h3,
main.page-column h3,
main.page-column-article h3,
main.page-company h3,
main.page-team h3,
main.page-news h3,
main.page-contact h3,
main.page-legal h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}

main.page-about p,
main.page-features p,
main.page-record p,
main.page-dialogue p,
main.page-coach p,
main.page-work p,
main.page-pricing p,
main.page-science p,
main.page-ai p,
main.page-safety p,
main.page-privacy p,
main.page-faq p,
main.page-column p,
main.page-column-article p,
main.page-company p,
main.page-team p,
main.page-news p,
main.page-contact p,
main.page-legal p {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

main :is(.eyebrow, [class*="__crumb"], .manifest-target__section-label) {
  font-size: var(--fs-caption);
  line-height: var(--lh-caption);
}

main :is(small, figcaption, caption) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

/* Shared V1 page family */
main.v1-page .v1-hero__copy>p {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

/* Repeat the family class to outrank legacy route-specific selectors without
 * !important. This is the canonical typography layer for every V1 page. */
main.v1-page.v1-page h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}

main.v1-page.v1-page h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}

main.v1-page.v1-page h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}

main.v1-page.v1-page .v1-hero__copy>p {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.v1-page.v1-page .v1-surface__inner>p {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

main.v1-page.v1-page :is(small, figcaption, caption) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

main.v1-page .v1-surface__inner>p,
main.v1-page .v1-surface__inner>ul,
main.v1-page .v1-surface__inner>ol,
main.v1-page .v1-surface__inner>.notice {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

main.v1-page :is(table, .faq-map, .data-flow, .safety-roles, .contact-types, .news-timeline, .company-facts, .company-history) :is(th, td, li, a, span, b, strong, p) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

main.v1-page .v1-surface__number {
  font-size: var(--fs-display);
  line-height: 1;
}

main :is(.v1-start, .target-start) h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}

main :is(.v1-start, .target-start)>div>p:first-child {
  font-size: var(--fs-caption);
  line-height: var(--lh-caption);
}

main :is(.v1-start, .target-start) small {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

/* HOME role assignment */
main.page-home .home-v3-hero__copy>p:first-of-type {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-home .home-v3-hero h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}

main.page-home .home-v3-lead {
  font-size: var(--fs-body-large);
  line-height: var(--lh-body-large);
}

main.page-home :is(.home-v3-empathy, .home-v3-hope, .home-v3-change, .home-v3-ending) h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}

main.page-home :is(.home-v3-empathy__copy>div p, .home-v3-hope__question>p, .home-v3-hope__future p, .home-v3-change dt, .home-v3-change dd, .home-v3-purpose>div>p, .home-v3-ending>div>p, .home-v3-ending aside p) {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

main.page-home .home-v3-hope__future strong {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-home :is(.home-v3-hope blockquote, .home-v3-change aside p:first-child) {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}

main.page-home .home-v3-purpose h2 {
  font-size: var(--fs-display);
  line-height: var(--lh-display);
}

main.page-home :is(.home-v3-purpose__line, .home-v3-quiet) {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-home :is(.home-v3-hero small, .home-v3-purpose aside p, .home-v3-ending small) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

/* About uses message-like paragraphs as visual headings. */
main.page-about :is(.about-target-emphasis, .about-target-display, .about-target-ending-line) {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}

main.page-about.page-about .about-target-hero h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}

main.page-about :is(.about-target-hero__statement, .about-target-close) {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-about :is(.about-target-hero__lead, .about-target-hero__body) {
  font-size: var(--fs-body-large);
  line-height: var(--lh-body-large);
}

/* Features overview and feature-detail families */
main.page-features .features-v1__hero-lines,
main:is(.page-dialogue, .page-coach, .page-work) :is(.dialogue-target__hero-copy>p, .coach-target__hero>div>p, .work-target__hero>div>p) {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-record.record-v1 h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}

main.page-record.record-v1 h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}

main.page-record.record-v1 :is(p, li) {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

main:is(.page-dialogue.dialogue-target, .page-coach.coach-target, .page-work.work-target) h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}

main:is(.page-dialogue.dialogue-target, .page-coach.coach-target, .page-work.work-target) h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}

main:is(.page-dialogue.dialogue-target, .page-coach.coach-target, .page-work.work-target) p {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

main:is(.page-features, .page-record, .page-dialogue, .page-coach, .page-work) :is(table, [role="table"], [class*="flow-table"], [class*="types-table"], [class*="phases"]) :is(p, li, b, strong, span, small, th, td) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

main:is(.page-dialogue, .page-coach, .page-work)>section>b,
main.page-features .features-v1__chapter>span,
main.page-record .record-v1__flow>span {
  font-size: var(--fs-display);
  line-height: 1;
}

/* Editorial articles and legal reading pages keep dense supporting content small. */
main:is(.page-column-article, .page-legal) :is(li, dd, dt, td, th) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

/* Component roles: their semantic heading level is intentionally retained. */
main.page-faq .v1-surface__inner>h2,
main.page-news .news-timeline h2 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}

main.page-team .team-hero-card h2 {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-team .team-hero-card :is(p, blockquote, td, small),
main.page-news .news-timeline :is(figcaption, th, td),
main.page-company :is(.company-facts, .company-history) :is(figcaption, th, td, small) {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

/* Legacy page CSS used !important for these three visual roles. These narrowly
 * scoped declarations are the only compatibility exceptions in this layer. */
main.page-about .about-target-emphasis,
main.page-about .about-target-display {
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
}

main.page-about .about-target-close,
main :is(.v1-start, .target-start) h2 {
  font-size: var(--fs-h2) !important;
  line-height: var(--lh-h2) !important;
}

/* Legacy breadcrumb rules used viewport font sizes with !important. Captions
 * are a single controlled compatibility exception across target pages. */
main [class*="__crumb"] {
  font-size: var(--fs-caption) !important;
  line-height: var(--lh-caption) !important;
}

/* About: principles lead; explanatory prose supports them. */
main.page-about .about-target-block--not-do-left li {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

main.page-about .about-target-block--not-do-right p,
main.page-about .about-target-block--sheep-right p {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
}

main.page-about .about-target-block--sheep-right strong {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

/* ========================================
 * SHARED V1 HERO SUMMARY TABLE
 *
 * The right-hand tables in V1 heroes use one typography contract:
 * label/title = Small, primary term = bold Small, explanation = Small.
 * Page styles continue to own geometry, borders, colour and column widths.
 * ======================================== */
main.v1-page.v1-page .v1-hero__visual :is(
  .ai-support-flow,
  .safety-roles,
  .data-flow,
  .faq-map,
  .company-sheet,
  .news-timeline,
  .contact-routes
) {
  --hero-table-text-size: var(--fs-small);
  --hero-table-text-leading: var(--lh-small);
}

/* Every visible leaf uses exactly the same type metrics. */
main.v1-page.v1-page .v1-hero__visual :is(
  .ai-support-flow figcaption,
  .ai-flow-track section>span,
  .ai-flow-track b,
  .ai-flow-track small,
  .safety-roles figcaption,
  .safety-roles section>span,
  .safety-roles h3,
  .safety-roles section>p,
  .data-flow figcaption,
  .data-flow .flow-node>span,
  .data-flow .flow-node>b,
  .data-flow .flow-node>small,
  .data-flow>p,
  .faq-map a>span,
  .faq-map a>b,
  .company-facts small,
  .company-facts b,
  .company-history th,
  .company-history td,
  .news-timeline figcaption,
  .news-timeline th,
  .news-timeline td,
  .contact-routes small,
  .contact-routes b,
  .contact-routes td>a,
  .contact-routes td>span
) {
  font-family: inherit;
  font-size: var(--hero-table-text-size);
  line-height: var(--hero-table-text-leading);
  font-weight: 400;
  font-style: normal;
  letter-spacing: normal;
}

/* Primary terms differ only by weight—never by size or spacing. */
main.v1-page.v1-page .v1-hero__visual :is(
  .ai-flow-track b,
  .safety-roles h3,
  .data-flow .flow-node>b,
  .faq-map a>b,
  .company-facts b,
  .company-history td,
  .news-timeline td,
  .contact-routes b
) {
  font-weight: 600;
}
