/* ══════════════════════════════════════════════════════════════════
   typography.css — Centralised type scale for forensic-centre.com
   Load after output.css on every page.
   ══════════════════════════════════════════════════════════════════ */

/* ── Base ────────────────────────────────────────────────────────── */
body {
  font-size: 17px;
  line-height: 1.65;
}
@media (max-width: 767px) {
  body {
    font-size: 16px;
  }
}

/* ── Headings ────────────────────────────────────────────────────── */

/* Hero H1 — primary landing page (index.html) */
.typo-hero-h1 {
  font-size: clamp(2.1rem, 5vw, 3.25rem) !important;
  line-height: 1.08 !important;
}

/* Secondary page H1 (polygraph, statement-analysis, contact, etc.) */
.typo-page-h1 {
  font-size: clamp(2rem, 4vw, 3rem) !important;
  line-height: 1.1 !important;
}

/* Section H2 */
.typo-section-h2 {
  font-size: clamp(1.7rem, 3vw, 2.25rem) !important;
  line-height: 1.15 !important;
}

/* Card H3 */
.typo-card-h3 {
  font-size: clamp(1.125rem, 1.5vw, 1.375rem) !important; /* ~18→22px */
  line-height: 1.25 !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: -0.005em !important;
}

/* ── Readable prose ─────────────────────────────────────────────── */
/* Apply only to long-form body paragraphs in content sections.
   Do NOT apply to cards, forms, footer, or grid layouts. */
.typo-readable {
  max-width: 70ch;
}

/* ── FAQ questions ──────────────────────────────────────────────── */
.typo-faq-q {
  font-size: 1rem !important;      /* 17px desktop, 16px mobile */
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* ── Eyebrow / overline labels ──────────────────────────────────── */
.typo-eyebrow {
  font-size: clamp(0.6875rem, 1vw, 0.8125rem) !important; /* 11→13px */
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* ── Footer ─────────────────────────────────────────────────────── */
.typo-footer-name {
  font-size: clamp(1rem, 1.2vw, 1.125rem) !important; /* 16→18px */
  line-height: 1.3 !important;
}

.typo-footer-desc {
  font-size: 14px !important;
  line-height: 1.55 !important;
}

.typo-footer-link {
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

.typo-footer-legal {
  font-size: 12px !important;
  line-height: 1.55 !important;
  text-transform: none !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

/* ── Mobile CTA bar ─────────────────────────────────────────────── */
.typo-mobile-cta-label {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
}

/* ── Button text ────────────────────────────────────────────────── */
.typo-btn {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* ── Page-entry fade ───────────────────────────────────────────── */
body {
  animation: pageEntry 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes pageEntry {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  body { animation: none; }
}