/* ==========================================================================
   CoolBus landing page — custom overrides on top of Tailwind (CDN)
   Brand: Route Yellow #FFC72C · Ink #14171F · Paper #FFFBF2
   ========================================================================== */

:root {
  --color-route-yellow: #ffc72c;
  --color-yellow-deep: #e8a80e;
  --color-ink: #14171f;
  --color-ink-soft: #3d4150;
  --color-paper: #fffbf2;
  --color-line: #ede6d3;
  --radius-button: 9999px;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem; /* offset for the sticky header */
  -webkit-text-size-adjust: 100%;
}

body {
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
}

/* Keep the hero eyebrow from wrapping awkwardly on small screens. */
@media (max-width: 380px) {
  h1 span.whitespace-nowrap {
    white-space: normal;
  }
}

/* Visible, on-brand focus ring for keyboard users. */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--color-ink);
  outline-offset: 2px;
  border-radius: var(--radius-button);
}

/* Respect users who prefer reduced motion. */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
  }
}