/* ==========================================================================
   The Uniform Center — Design Tokens
   Kura's visual editor edits the custom properties in this :root block.
   Brand teal is sampled from the client's logo; navy + signal red add the
   first-responder / public-safety authority the homepage now leads with.
   ========================================================================== */

:root {
  /* Brand — teal (from logo) */
  --teal-050: #e6f2f5;
  --teal-100: #c2dfe6;
  --teal-300: #6bb3c1;
  --teal:     #0d7c93; /* primary brand color */
  --teal-600: #0a6a7e;
  --teal-700: #085767;
  --teal-800: #06414d;

  /* Ink — deep navy-slate (first-responder authority) */
  --ink:      #0e1f2c;
  --ink-800:  #13293a;
  --ink-700:  #1c384c;
  --ink-600:  #2a4a60;

  /* Signal — duty red (calls to action, emergency accent) */
  --signal:      #d1402e;
  --signal-600:  #b8331f;
  --signal-050:  #fbeae7;

  /* Amber — fire / EMS accent (used sparingly) */
  --amber: #e6a338;

  /* Neutrals */
  --bg:       #f4f7f8;
  --surface:  #ffffff;
  --surface-2:#eef3f4;
  --line:     #dbe3e7;
  --line-2:   #c8d4d9;
  --text:     #14212b;
  --text-2:   #3e4f5a;
  --muted:    #667a86;
  --white:    #ffffff;

  /* Typography */
  --font-display: "Oswald", "Arial Narrow", system-ui, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;

  /* Radius */
  --r-sm: 6px;
  --r:    10px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-pill: 999px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(14, 31, 44, 0.06), 0 1px 3px rgba(14, 31, 44, 0.08);
  --shadow:    0 6px 16px rgba(14, 31, 44, 0.10);
  --shadow-lg: 0 18px 40px rgba(14, 31, 44, 0.16);

  /* Layout */
  --maxw: 1200px;
  --gutter: clamp(16px, 4vw, 40px);

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}