/* Linienplan: the recognition path as a transit line. The only file with raw values. */
@font-face { font-family: "Sofia Sans Condensed"; src: url("../fonts/heading-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Sofia Sans Condensed"; src: url("../fonts/heading-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible Next"; src: url("../fonts/body-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible Next"; src: url("../fonts/body-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  /* Platform: tiled wall, enamel plates, ink lettering */
  --color-bg: #e4e6e2;
  --color-surface: #ffffff;
  --color-surface-tint: #d6d9d3;
  --color-text: #141414;
  --color-text-muted: #484b50;
  --color-border: #b9bcb6;

  /* Lines: A (teal) runs inside Germany, B (sky blue) comes from abroad */
  --line-a: #0f7c7a;
  --line-a-strong: #0b5f5d;
  --line-b: #3a8fd4;
  --line-b-strong: #2c74b3;
  --color-here: #c8332b;

  --color-brand: var(--line-a);
  --color-brand-strong: var(--line-a-strong);
  --color-on-brand: #ffffff;
  --color-accent: #8ec5f2;
  --color-accent-strong: #6aafe8;
  --color-on-accent: #141414;
  --color-focus: #0f7c7a;
  --color-selection: #cfe6fa;

  /* Colour field behind every page header: teal running into a deep sky blue; white text holds 4.5:1 on both ends */
  --field: linear-gradient(120deg, #0f7c7a 0%, #17808f 45%, #2676b5 100%);
  --color-on-field: #ffffff;

  /* Night platform: top bar, closing panel, footer */
  --color-inverse-bg: #141414;
  --color-inverse-text: #f5f5f2;
  --color-inverse-muted: #c9cbc6;
  --color-inverse-border: rgb(245 245 242 / 0.24);

  --font-heading: "Sofia Sans Condensed", "Arial Narrow", sans-serif;
  --font-body: "Atkinson Hyperlegible Next", system-ui, sans-serif;

  --text-sm: 1rem;
  --text-base: 1.125rem;
  --text-lg: 1.3125rem;
  --text-xl: 1.625rem;
  --text-2xl: clamp(1.875rem, 1.45rem + 1.9vw, 2.75rem);
  --text-3xl: clamp(2.5rem, 1.6rem + 4vw, 4.75rem);
  --text-3xl-compact: clamp(2.5rem, 1.2rem + 3vw, 4rem);
  --leading-tight: 1.05;
  --leading-body: 1.6;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  --container: 76rem;
  --container-narrow: 44rem;
  --gutter: clamp(1rem, 4vw, 2rem);

  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 1rem;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgb(20 20 20 / 0.12);
  --shadow-md: 0 6px 18px -6px rgb(20 20 20 / 0.28);

  --line-width: 0.5rem;
  --plate-rim: 2px solid #141414;
  --station-size: 1.25rem;
  --station-ring: 0.25rem;

  --duration: 200ms;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}