/* tokens.css - kontrakt designsystemowy, ladowany jako pierwszy */
:root {
  /* === Marka === */
  --brand-primary: #F5A623;
  --brand-primary-hover: #FFB73D;
  --brand-primary-active: #C8861B;
  --brand-secondary: #1A1F2A;

  /* === Industrial palette === */
  --color-graphite: #1A1F2A;
  --color-anthracite: #252B38;
  --color-steel: #4A5568;
  --color-steel-light: #8895A7;
  --color-paper: #F8F8F6;
  --color-paper-warm: #F0EBE3;
  --color-white: #FFFFFF;

  --color-red: #D72638;
  --color-success: #2EA672;
  --color-line: #E5E7EB;
  --color-line-dark: #2D3441;

  /* === Typografia === */
  --font-headline: 'Manrope', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Roboto Mono', ui-monospace, monospace;

  /* === Spacing === */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem;
  --space-4: 1rem;    --space-5: 1.25rem;
  --space-6: 1.5rem;  --space-8: 2rem;
  --space-10: 2.5rem; --space-12: 3rem;
  --space-16: 4rem;   --space-20: 5rem; --space-24: 6rem;

  --container-max: 1280px;
  --container-narrow: 880px;

  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 16px; --radius-xl: 24px;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px rgba(26, 31, 42, 0.06);
  --shadow-md: 0 4px 12px rgba(26, 31, 42, 0.08);
  --shadow-lg: 0 12px 32px rgba(26, 31, 42, 0.12);
  --shadow-xl: 0 24px 48px rgba(26, 31, 42, 0.16);

  --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 180ms;
  --duration-base: 280ms;
  --duration-slow: 480ms;

  --section-padding-y: clamp(60px, 8vw, 100px);
  --section-padding-x: clamp(20px, 4vw, 40px);

  --header-h: 76px;
}

@media (max-width: 767px) {
  :root { --header-h: 64px; }
}