/**
 * FCPD Typography Hot Pack — TASK-111
 * Professional gov aesthetic: DM Sans (UI) + Source Serif 4 (headings)
 * Mobile-first; safe overlay — does not change app logic.
 * Rollback: restore from backups/typography-pre-task111/
 */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=Source+Serif+4:opsz,wght@8..60,600;8..60,700&display=swap');

:root {
  --fcpd-font-sans: 'DM Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --fcpd-font-serif: 'Source Serif 4', 'STIX Two Text', Georgia, 'Times New Roman', serif;
  --fcpd-navy: #0b2545;
  --fcpd-navy-deep: #061628;
  --fcpd-blue: #1a4a7a;
  --fcpd-gold: #c9a227;
  --fcpd-gold-soft: #e8c547;
  --fcpd-ink: #1a2332;
  --fcpd-ink-muted: #4a5563;
  --fcpd-ink-soft: #64748b;
  --fcpd-paper: #f7f8fa;
  --fcpd-card: #ffffff;
  --fcpd-line: #dce2ea;
  --fcpd-radius: 8px;
  --fcpd-lh: 1.6;
  --fcpd-tracking: -0.01em;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

html,
body,
.fcpd-official-root,
.fcpd-root,
.wp-site-blocks,
body.home,
body.blog {
  font-family: var(--fcpd-font-sans) !important;
  color: var(--fcpd-ink) !important;
  line-height: var(--fcpd-lh);
  letter-spacing: var(--fcpd-tracking);
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings — serif for institutional weight */
h1, h2, h3, h4,
.wp-block-heading,
.fcpd-hero-title,
.fcpd-brand-title,
.fcpd-case-head h2,
.brand-text strong,
.hero h1,
.panel h2, .panel h3,
.doj-inquiry-title,
.guest-room-title {
  font-family: var(--fcpd-font-serif) !important;
  color: var(--fcpd-navy) !important;
  letter-spacing: -0.02em;
  line-height: 1.25;
  font-weight: 700;
}

.wp-block-post-title,
.brand-wordmark,
.footer-wordmark {
  font-family: var(--fcpd-font-serif) !important;
  letter-spacing: -0.015em;
}

p, li, label, .wp-block-paragraph,
.doj-inquiry-lead, .fcpd-hero-desc,
.ors-lead, .field label {
  font-family: var(--fcpd-font-sans) !important;
  color: var(--fcpd-ink-muted);
  line-height: 1.65;
}

a {
  color: var(--fcpd-blue);
  text-underline-offset: 0.18em;
}
a:hover {
  color: var(--fcpd-navy);
}

/* Forms — readable + iOS zoom-safe */
input, select, textarea, button,
.doj-inquiry-input,
.field input, .field select, .field textarea,
.wp-block-button__link,
.btn-primary, .doj-inquiry-btn {
  font-family: var(--fcpd-font-sans) !important;
}

input, select, textarea,
.doj-inquiry-input,
.field input, .field select, .field textarea {
  font-size: 16px !important;
  line-height: 1.45;
  color: var(--fcpd-ink) !important;
  border-color: var(--fcpd-line);
  border-radius: 6px;
}

button, .btn-primary, .doj-inquiry-btn,
.wp-block-button__link, .main-nav a {
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* Cards / surfaces */
.home-subscribe-card,
.fcpd-content-card,
.panel, .form-wrap {
  background: var(--fcpd-card);
  border-radius: var(--fcpd-radius);
}

.site-utility,
.fcpd-topbar,
.top-bar {
  letter-spacing: 0.02em;
}

/* Nav polish */
.main-nav a,
.fcpd-nav-link,
.nav-link {
  font-family: var(--fcpd-font-sans) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Mobile typography scale */
@media (max-width: 640px) {
  html {
    font-size: 16px;
  }
  body, .fcpd-official-root, .fcpd-root {
    line-height: 1.55;
  }
  h1, .hero h1, .fcpd-hero-title {
    font-size: clamp(1.35rem, 5.5vw, 1.75rem) !important;
  }
  h2, .wp-block-heading, .panel h2, .fcpd-case-head h2 {
    font-size: clamp(1.15rem, 4.5vw, 1.4rem) !important;
  }
  h3, .panel h3 {
    font-size: 1.05rem !important;
  }
  .brand-text strong {
    font-size: 1.05rem !important;
  }
  .brand-wordmark {
    font-size: 1.25rem !important;
  }
  p, .wp-block-paragraph, .ors-lead, .doj-inquiry-lead {
    font-size: 0.95rem;
  }
  .main-nav a, .fcpd-nav-link {
    min-height: 44px;
    font-size: 0.9rem;
  }
  .btn-primary, .doj-inquiry-btn, .wp-block-button__link {
    min-height: 48px;
    font-size: 1rem !important;
  }
}

@media (min-width: 641px) and (max-width: 1023px) {
  h1, .fcpd-hero-title {
    font-size: clamp(1.5rem, 3vw, 2rem) !important;
  }
}

/* Prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}