/* ==========================================================================
   Training Platform — Typography
   Spec: TRAINING_DESIGN_STANDARDS.md §4
   ========================================================================== */

body.training-page {
  /* Training scope inherits Arabic-first font from ahruf-tokens */
  font-feature-settings: "kern" 0; /* §4.3 — Arabic disables kerning on body */
  line-height: 1.65; /* §4.3 — +0.05 above Latin baseline */
}

html[lang="en"] body.training-page {
  font-feature-settings: "kern" 1;
  line-height: 1.6;
}

/* ── Type Scale §4.2 — mobile-first ── */

.training-page .training-display,
.training-page h1.training-display {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0;
  margin: 0;
}

.training-page h1,
.training-page .h1 {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

.training-page h2,
.training-page .h2 {
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 1.25;
}

.training-page h3,
.training-page .h3 {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3;
}

.training-page .text-body {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.65;
}

.training-page .text-body-lg,
.training-page .training-lead {
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.6;
}

.training-page .text-small,
.training-page .training-small {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
}

.training-page .text-micro,
.training-page .training-micro {
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
}

/* Desktop scale-up */
@media (min-width: 1024px) {
  .training-page .training-display,
  .training-page h1.training-display {
    font-size: 3.5rem;
  }

  .training-page h1,
  .training-page .h1 {
    font-size: 2.25rem;
  }

  .training-page h2,
  .training-page .h2 {
    font-size: 1.75rem;
  }

  .training-page h3,
  .training-page .h3 {
    font-size: 1.25rem;
  }

  .training-page .text-body {
    font-size: 1.0625rem;
  }

  .training-page .text-body-lg,
  .training-page .training-lead {
    font-size: 1.25rem;
  }
}

/* ── Tabular Numerals §4.3 — price, duration, progress ── */
.training-num,
.training-page .training-price,
.training-page .training-duration,
.training-page .training-progress-value,
.training-page [data-tabular] {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* ── Latin uppercase label letter-spacing §4.2 ── */
html[lang="en"] .training-page .training-uppercase {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ── Pull-quote §4.3 ── */
.training-page blockquote.pull,
.training-page .training-pullquote {
  font-weight: 300;
  font-style: italic;
  border-inline-start: 3px solid var(--ahruf-accent);
  padding-inline-start: var(--space-lg);
  margin: var(--space-xl) 0;
}

/* ── English proper nouns within Arabic — §12.11 ── */
.training-page .en-inline {
  font-family: var(--font-english);
  unicode-bidi: isolate;
}

/* ── Screen-reader only ── */
.training-sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .training-page *,
  .training-page *::before,
  .training-page *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}