@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --font-sans: "Inter", system-ui, sans-serif;
    --font-display: "Source Serif 4", Georgia, serif;

    --color-navy: #1b3a5b;
    --color-signal: #e2231a;
    --color-anthrazit: #1a2530;
    --color-nebel: #f6f8fa;
    --color-bereit: #1f8f5a;
    --color-wartung: #b5460f;
    --color-rand: #d9dee5;
  }

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

  body {
    @apply bg-nebel text-anthrazit antialiased;
    font-feature-settings: "tnum" 1;
  }

  h1,
  h2,
  h3 {
    @apply font-display text-navy;
  }
}

@layer utilities {
  .tabular-nums {
    font-variant-numeric: tabular-nums;
  }
}
