/* Rodriques shared typography. Font files and color values remain consumer-owned. */
@layer rodriques-design-system {
  :where(:root) {
    --rds-type-body-size: 1rem;
    --rds-type-body-weight: 400;
    --rds-type-body-line-height: 1.6;
    --rds-type-display-size: clamp(2.4rem, 5.625vw, 4.35rem);
    --rds-type-display-mobile-size: clamp(2.25rem, 12vw, 3.6rem);
    --rds-type-display-weight: 500;
    --rds-type-display-line-height: 1.04;
    --rds-type-display-letter-spacing: -0.045em;
    --rds-type-page-title-size: clamp(2rem, 3.25vw, 3rem);
    --rds-type-page-title-weight: 500;
    --rds-type-page-title-line-height: 1.04;
    --rds-type-page-title-letter-spacing: -0.045em;
    --rds-type-section-title-size: clamp(1.6875rem, 2.8125vw, 2.625rem);
    --rds-type-section-title-weight: 500;
    --rds-type-section-title-line-height: 1.04;
    --rds-type-section-title-letter-spacing: -0.035em;
    --rds-type-subsection-title-size: 1.0875rem;
    --rds-type-subsection-title-weight: 550;
    --rds-type-subsection-title-line-height: 1.04;
    --rds-type-subsection-title-letter-spacing: -0.025em;
    --rds-type-document-title-size: clamp(1.3rem, 2vw, 1.65rem);
    --rds-type-document-title-weight: 550;
    --rds-type-document-title-line-height: 1.3;
    --rds-type-document-title-letter-spacing: -0.025em;
    --rds-type-lead-size: clamp(1.15rem, 2vw, 1.35rem);
    --rds-type-lead-weight: 400;
    --rds-type-lead-line-height: 1.65;
    --rds-type-feature-body-size: clamp(1.12rem, 1.8vw, 1.35rem);
    --rds-type-feature-body-weight: 400;
    --rds-type-feature-body-line-height: 1.6;
    --rds-type-label-size: 0.75rem;
    --rds-type-label-weight: 750;
    --rds-type-label-line-height: 1.4;
    --rds-type-label-letter-spacing: 0.16em;
    --rds-type-navigation-size: 0.92rem;
    --rds-type-navigation-weight: 650;
    --rds-type-navigation-line-height: 1.4;
    --rds-type-action-size: 0.94rem;
    --rds-type-action-weight: 700;
    --rds-type-action-line-height: 1.4;
    --rds-type-small-size: 0.875rem;
    --rds-type-small-weight: 400;
    --rds-type-small-line-height: 1.5;
  }

  :where(body, .ds-type-body) {
    font-family: var(--ds-font-body);
    font-size: var(--rds-type-body-size);
    font-weight: var(--rds-type-body-weight);
    line-height: var(--rds-type-body-line-height);
  }

  :where(.ds-type-display) {
    font-size: var(--rds-type-display-size);
    font-weight: var(--rds-type-display-weight);
    letter-spacing: var(--rds-type-display-letter-spacing);
    line-height: var(--rds-type-display-line-height);
  }

  :where(.ds-type-page-title) {
    font-size: var(--rds-type-page-title-size);
    font-weight: var(--rds-type-page-title-weight);
    letter-spacing: var(--rds-type-page-title-letter-spacing);
    line-height: var(--rds-type-page-title-line-height);
  }

  :where(.ds-type-section-title) {
    font-size: var(--rds-type-section-title-size);
    font-weight: var(--rds-type-section-title-weight);
    letter-spacing: var(--rds-type-section-title-letter-spacing);
    line-height: var(--rds-type-section-title-line-height);
  }

  :where(.ds-type-subsection-title) {
    font-size: var(--rds-type-subsection-title-size);
    font-weight: var(--rds-type-subsection-title-weight);
    letter-spacing: var(--rds-type-subsection-title-letter-spacing);
    line-height: var(--rds-type-subsection-title-line-height);
  }

  :where(.ds-type-document-title) {
    font-size: var(--rds-type-document-title-size);
    font-weight: var(--rds-type-document-title-weight);
    letter-spacing: var(--rds-type-document-title-letter-spacing);
    line-height: var(--rds-type-document-title-line-height);
  }

  :where(.ds-type-lead) {
    font-size: var(--rds-type-lead-size);
    font-weight: var(--rds-type-lead-weight);
    line-height: var(--rds-type-lead-line-height);
  }

  :where(.ds-type-feature-body) {
    font-size: var(--rds-type-feature-body-size);
    font-weight: var(--rds-type-feature-body-weight);
    line-height: var(--rds-type-feature-body-line-height);
  }

  :where(.ds-type-label) {
    font-size: var(--rds-type-label-size);
    font-weight: var(--rds-type-label-weight);
    letter-spacing: var(--rds-type-label-letter-spacing);
    line-height: var(--rds-type-label-line-height);
    text-transform: uppercase;
  }

  :where(.ds-type-navigation) {
    font-size: var(--rds-type-navigation-size);
    font-weight: var(--rds-type-navigation-weight);
    line-height: var(--rds-type-navigation-line-height);
  }

  :where(.ds-type-action) {
    font-size: var(--rds-type-action-size);
    font-weight: var(--rds-type-action-weight);
    line-height: var(--rds-type-action-line-height);
  }

  :where(.ds-type-small) {
    font-size: var(--rds-type-small-size);
    font-weight: var(--rds-type-small-weight);
    line-height: var(--rds-type-small-line-height);
  }

  @media (max-width: 700px) {
    :where(.ds-type-display) {
      font-size: var(--rds-type-display-mobile-size);
    }
  }
}