/* ==========================================================================
   tokens.css: zmienne projektu
   Kolory zebrane z wczesniak.pl (pasek tytułowy / stopka, logo)
   oraz z KV kampanii #BiegamDobrze 2027.
   ========================================================================== */
:root {
  /* Kolory serwisu wczesniak.pl */
  --c-navy: #3065b5;          /* pasek tytułowy i stopka wczesniak.pl */
  --c-navy-dark: #24508f;
  --c-blue: #1f95d2;          /* błękit logo Fundacji */
  --c-sky: #34a3e3;           /* błękit tła KV 2027 */
  --c-link: #2a8fd6;          /* linki w treści (jak na stronie) */

  /* Akcenty kampanii */
  --c-orange: #e95b00;        /* #BiegamDobrze, przycisk „Przekaż 1,5%” */
  --c-orange-dark: #c94e00;
  --c-orange-soft: #fff1e7;
  --c-plum: #ab0253;          /* magenta z KV 2027 */
  --c-plum-dark: #8a0243;
  --c-fb: #1877f2;

  /* Neutralne */
  --c-ink: #1d2a3a;
  --c-text: #3e4a59;
  --c-muted: #6b7684;
  --c-line: #dfe7f1;
  --c-tint: #eef6fc;          /* jasny błękit sekcji */
  --c-white: #ffffff;

  /* Typografia */
  --f-body: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --f-display: "Baloo 2", "Open Sans", system-ui, sans-serif;

  --fs-xs: .8125rem;
  --fs-sm: .9375rem;
  --fs-base: 1.0625rem;
  --fs-lg: 1.1875rem;
  --fs-h3: clamp(1.25rem, 1.1rem + .6vw, 1.5rem);
  --fs-h2: clamp(1.75rem, 1.35rem + 1.7vw, 2.625rem);
  --fs-h1: clamp(2.25rem, 1.6rem + 3vw, 4rem);

  /* Odstępy i kształty */
  --container: 1180px;
  --gutter: 16px;
  --section-y: clamp(64px, 5vw + 32px, 112px);
  --radius-sm: 10px;
  --radius: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;
  --shadow-sm: 0 2px 8px rgba(29, 42, 58, .08);
  --shadow: 0 12px 32px rgba(29, 42, 58, .12);
  --shadow-lg: 0 24px 60px rgba(20, 50, 100, .22);

  --header-h: 92px;
  --wave-h: clamp(40px, 6vw, 90px);
  --dash-blue: rgba(48, 101, 181, .35);
  --dash-white: rgba(255, 255, 255, .6);
  --dash-orange: rgba(233, 91, 0, .55);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

@media (min-width: 768px) {
  :root { --gutter: 24px; }
}
