@layer typography {
  .tk-payoff,
  .builder-focus {
    font-size: var(--tk-type-body);
    line-height: var(--tk-leading-body);
    font-weight: var(--tk-weight-regular);
    font-family: var(--tk-font-body);
  }
  .tk-body,
  .hero-description,
  .invite-rationale > p,
  .platform-copy > p:not(.eyebrow):not(.builder-focus),
  .story-layout > div > p:not(.eyebrow),
  .closing-inner > p:not(.eyebrow),
  .era-copy > p:not(.eyebrow),
  .history-intro > p:not(.eyebrow),
  .docs-title > p:not(.eyebrow) {
    font-size: var(--tk-type-body);
    line-height: var(--tk-leading-body);
    font-weight: var(--tk-weight-regular);
    font-family: var(--tk-font-body);
  }
  .tk-compact,
  .invite-benefits p,
  .steps p,
  .proof > p {
    font-size: var(--tk-type-label);
    line-height: var(--tk-leading-body);
    font-weight: var(--tk-weight-regular);
    font-family: var(--tk-font-body);
  }
  .tk-prose,
  .docs-section > p:not(.eyebrow),
  .docs-note > p,
  .faq-list details > p,
  .source-details p {
    font-size: var(--tk-type-label);
    line-height: var(--tk-leading-prose);
    font-weight: var(--tk-weight-regular);
    font-family: var(--tk-font-body);
  }
  .tk-helper,
  .copy-feedback,
  .copy-feedback-message,
  .hero-notes,
  .hero-notes a,
  .agent-story-bottom {
    font-size: var(--tk-type-label);
    line-height: var(--tk-leading-body);
    font-weight: var(--tk-weight-regular);
    font-family: var(--tk-font-body);
  }
  .tk-action,
  .button,
  .nav-cta,
  .inline-link,
  .menu-toggle,
  #site-nav > a {
    font-size: var(--tk-type-label);
    line-height: var(--tk-leading-label);
    font-weight: var(--tk-weight-bold);
    font-family: var(--tk-font-body);
  }
  .tk-eyebrow,
  .eyebrow {
    font-size: var(--tk-type-label);
    line-height: var(--tk-leading-label);
  }
  @media (max-width: 520px) {
    .tk-body,
    .hero-description,
    .invite-rationale > p,
    .platform-copy > p:not(.eyebrow):not(.builder-focus),
    .story-layout > div > p:not(.eyebrow),
    .closing-inner > p:not(.eyebrow),
    .era-copy > p:not(.eyebrow),
    .history-intro > p:not(.eyebrow),
    .docs-title > p:not(.eyebrow) {
      font-size: var(--tk-type-label);
    }
  }
}