/* Mobile-only alignment rules — site-wide overrides.
   - Hero / page-hero headers stay centered on mobile (Kate review 2026-05-10).
   - Body paragraphs left-justified site-wide.
   Loaded last in base.html.j2 so these win the cascade. */

@media (max-width: 640px) {
  .hero h1,
  .hero h2,
  .hero h3,
  .hero p,
  .page-hero h1,
  .page-hero h2,
  .page-hero h3,
  .hero-title,
  .hero-subtitle,
  .hero-authors,
  .hero-publisher,
  .hero-tagline,
  .hero-launch,
  .hero-eyebrow,
  .page-hero-sub,
  .page-hero-authors,
  .page-hero-pub,
  .page-hero-eyebrow,
  .hero-logline {
    text-align: center;
  }

  p {
    text-align: left;
  }

  /* Hero paragraphs are the exception — keep them centered with the headers. */
  .hero p,
  .page-hero p {
    text-align: center;
  }
}