@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,600&family=Outfit:wght@400;500;600;700&display=swap');

@custom-variant dark (&:is(.dark *));

:root {
  --background: #fafafa;
  --foreground: #09090b;
  --card: #ffffff;
  --card-foreground: #09090b;
  --popover: #ffffff;
  --popover-foreground: #09090b;

  /* Safety Orange for High Urgency */
  --primary: #ea580c;
  --primary-foreground: #ffffff;

  /* Dark Zinc for contrast sections */
  --secondary: #18181b;
  --secondary-foreground: #fafafa;

  --muted: #f4f4f5;
  --muted-foreground: #71717a;
  --accent: #fff7ed;
  --accent-foreground: #9a3412;
  --destructive: #dc2626;
  --destructive-foreground: #ffffff;
  --border: #e4e4e7;
  --input: #e4e4e7;
  --ring: #ea580c;
  --radius: 0px; /* Brutalist/sharp edges */
}

@layer base {
  /* ROADMAP-230: mobile safety net. `overflow-x: clip` blocks horizontal
   * scroll from any element that escapes the viewport without breaking
   * `position: sticky`. Both html and body covered for Safari < 16. */
  html, body {
    overflow-x: clip;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: -0.011em;
  }

  h1, h2, h3, h4, h5, h6 {
    font-family: 'Outfit', 'Plus Jakarta Sans', system-ui, sans-serif;
    letter-spacing: -0.02em;
  }

  /* Make h1 and h2 normal/balanced weight and reduce oversized scale */
  h1 {
    font-weight: 600 !important;
    font-size: clamp(2rem, 5vw, 3.25rem) !important;
    line-height: 1.15 !important;
  }

  h2 {
    font-weight: 600 !important;
    font-size: clamp(1.65rem, 3.8vw, 2.35rem) !important;
    line-height: 1.25 !important;
  }

  h3 {
    font-weight: 600 !important;
  }

  h1, h2, h3, h4, h5, h6, p, span, a, li {
    overflow-wrap: anywhere;
    word-wrap: break-word;
  }

  body {
    background-color: var(--background);
    color: var(--foreground);
  }

  .grayscale-map {
    filter: grayscale(100%) contrast(120%) invert(90%) hue-rotate(180deg);
  }
}

/* Footer Typography Enhancements */
footer {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}

/* Footer Section Headings (Pages, Services, Locations) */
footer h2 {
  font-family: 'Outfit', system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.8125rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--primary) !important;
}

/* Footer Brand Title */
footer a.font-black {
  font-family: 'Outfit', system-ui, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* Footer Links - Clean, readable, balanced weight */
footer a, footer nav a {
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  font-size: 0.9375rem !important;
}

/* Footer Subtext and Descriptions */
footer p {
  font-weight: 400 !important;
  color: #a1a1aa !important;
  line-height: 1.6 !important;
}

/* Bottom copyright & legal links */
footer .text-xs, footer .text-sm {
  font-weight: 500 !important;
}