/* =====================================================================
   NextGen Partner - Design Tokens
   Współdzielony system dla strony głównej i wszystkich podstron.
   Każda podstrona linkuje ten plik PRZED swoim własnym arkuszem.
   Kolory marki podane jako dokładne hexy (wierność #0076c0); tinty/skale
   wyprowadzone jako tokeny. Żadnych wartości "z palca" w arkuszach stron.
   ===================================================================== */

:root {
  /* ---- Kotwice marki ------------------------------------------------ */
  --signal:        #0076c0;   /* akcent: przepływ, CTA, focus, "stan zautomatyzowany" */
  --carbon:        #0b0e15;   /* atrament + baza ciemnej sceny */
  --mist:          #f5f6f8;   /* papier sekcji jasnych */
  --slate:         #5b6573;   /* neutral: tekst II rzędu, linie, "stan manualny" */
  --abyss:         #071a2b;   /* głębia gradientu sceny hero */
  --ember:         #e0a23c;   /* rzadka iskra "chaosu przed" - nie konkuruje z Signal */

  /* ---- Tinty / skala wyprowadzona ---------------------------------- */
  --signal-bright: #2a93da;   /* poświata / hover */
  --signal-deep:   #005a93;   /* aktywny / cień akcentu */
  --signal-wash:   rgba(0, 118, 192, 0.08);
  --signal-line:   rgba(0, 118, 192, 0.28);
  --signal-glow:   rgba(0, 118, 192, 0.22);  /* aura na ciemnym */
  --signal-pulse:  rgba(42, 147, 218, 0.5);  /* puls "na żywo" */

  --danger:        #d64541;                   /* błąd formularza - rzadki, tylko walidacja/wysyłka */
  --danger-wash:   rgba(214, 69, 65, 0.14);

  --carbon-hi:     #0e1626;   /* rozjaśnienie sceny hero */
  --glass-hi:      rgba(255, 255, 255, 0.06); /* szkło na ciemnym tle */
  --glass-lo:      rgba(255, 255, 255, 0.02);

  --ink:           var(--carbon);
  --ink-2:         #2b3441;   /* nagłówek II rzędu na jasnym */
  --ink-soft:      #424d5b;   /* tekst akapitowy na jasnym */

  --white:         #ffffff;   /* czysta biel: tekst na ciemnym, fg przycisku */
  --paper:         var(--mist);
  --paper-raised:  #ffffff;   /* powierzchnia paneli */
  --paper-sunken:  #ecedf1;   /* wgłębienia / pola */
  --paper-grid:    rgba(11, 14, 21, 0.045); /* siatka inżynierska */

  --hairline:        rgba(11, 14, 21, 0.12);
  --hairline-strong: rgba(11, 14, 21, 0.22);

  --slate-2:       #8a93a1;   /* jaśniejszy muted */
  --on-dark:       #e9edf3;   /* tekst na carbon */
  --on-dark-dim:   #98a4b4;   /* tekst II rzędu na carbon */
  --on-dark-line:  rgba(233, 237, 243, 0.16);

  /* ---- Typografia --------------------------------------------------- */
  --font-display: "Clash Display", "Switzer", system-ui, sans-serif;
  --font-body:    "Switzer", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Skala typu - sygnaturowa: duży kontrast skali, ciasna interlinia w display */
  --text-xs:   0.75rem;
  --text-sm:   0.8125rem;
  --text-base: 1rem;
  --text-lg:   clamp(1.0625rem, 0.6vw + 0.95rem, 1.1875rem);
  --text-xl:   clamp(1.25rem, 1.1vw + 1rem, 1.5rem);
  --text-2xl:  clamp(1.5rem, 1.8vw + 1.1rem, 2.05rem);
  --text-3xl:  clamp(1.9rem, 2.6vw + 1.1rem, 2.7rem);
  --text-4xl:  clamp(2.3rem, 3.6vw + 1.2rem, 3.5rem);
  --text-display-xs: clamp(2.5rem, 3.4vw + 1.3rem, 3.95rem);  /* CTA: większe niż 4xl, mniejsze niż display-s */
  --text-display-s: clamp(2.6rem, 5vw + 1rem, 4.6rem);
  --text-display:   clamp(2.85rem, 7vw + 0.6rem, 6.6rem);

  --tracking-tight:  -0.035em;  /* nagłówki display */
  --tracking-snug:   -0.02em;   /* nagłówki sekcji */
  --tracking-mono:    0.26em;   /* nadtytuły mono */
  --leading-display:  0.95;
  --leading-tight:    1.08;
  --leading-body:     1.62;

  /* ---- Przestrzeń (skala 4pt) -------------------------------------- */
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 96px;
  --space-4xl: 140px;

  --section-y: clamp(76px, 10vw, 154px);
  --gutter:    clamp(20px, 5vw, 80px);
  --maxw:      1280px;
  --measure:   62ch;

  /* ---- Promienie / linie / cienie ---------------------------------- */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-pill: 999px;

  --rule-hair: 1px;
  --rule-bold: 2px;

  --shadow-1: 0 1px 2px rgba(11, 14, 21, 0.04), 0 2px 10px rgba(11, 14, 21, 0.05);
  --shadow-2: 0 22px 60px -28px rgba(11, 14, 21, 0.30);
  --shadow-signal: 0 20px 64px -24px rgba(0, 118, 192, 0.45);

  /* ---- Ruch --------------------------------------------------------- */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in:     cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-1: 120ms;
  --dur-2: 240ms;
  --dur-3: 480ms;
  --dur-4: 820ms;
}

/* =====================================================================
   Baza współdzielona (reset + domyślne) - także dla podstron
   ===================================================================== */

*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  overflow-x: clip;
}

body {
  margin: 0;
  overflow-x: clip;
  background: var(--paper);
  color: var(--ink-soft);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  color: var(--ink);
  font-weight: 500;
  font-style: normal;        /* nagłówki zawsze roman */
  margin: 0;
  text-wrap: balance;
  overflow-wrap: anywhere;
  min-width: 0;
}

p { margin: 0; }

a { color: inherit; text-decoration: none; }

img, svg, canvas { display: block; max-width: 100%; }

button { font: inherit; color: inherit; }

::selection { background: var(--signal); color: #fff; }

:focus-visible {
  outline: var(--rule-bold) solid var(--signal);
  outline-offset: 3px;
  border-radius: 3px;
}
:focus:not(:focus-visible) { outline: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}
