/* ==========================================================================
   Anna Jaworowska — tokens
   Jedno źródło prawdy dla kolorów, typografii, rytmu i stanów.
   Kolejność wczytywania: tokens.css → components.css → (style podstrony)
   ========================================================================== */

/* Fonty NIE ładowane tu przez @import (blokuje render) — enqueue w functions.php
   pod handle 'aj-fonts', ten sam URL Google Fonts co w prototypie HTML. */

:root {
  /* --- Kolory: tło ---------------------------------------------------- */
  --aj-bg-light:        #FBF9F5;   /* jasny pas — podstawowe tło sekcji */
  --aj-bg-warm:         #F7F2E8;   /* jasny pas naprzemienny — gdy dwie jasne sekcje się stykają */
  --aj-bg-cream:        #F3EEE4;   /* kremowa karta na jasnym tle */
  --aj-bg-cream-2:      #EBE4D6;   /* kremowa karta — stan hover / nagłówek tabeli */
  --aj-bg-dark:         #0F0E0D;   /* ciemny pas kinowy */
  --aj-bg-dark-raised:  #1C1A17;   /* karta NA ciemnym tle (min. o 1 stopień jaśniejsza) */
  --aj-bg-dark-raised-2:#262218;   /* karta na ciemnym — hover */

  /* --- Kolory: tekst -------------------------------------------------- */
  --aj-ink:             #171512;   /* nagłówki na jasnym */
  --aj-ink-body:        #3A352E;   /* body na jasnym — kontrast 9.6:1 */
  --aj-ink-muted:       #5C554A;   /* podpisy na jasnym — min. dopuszczalny, 5.4:1 */
  --aj-on-dark:         #F6F3ED;   /* nagłówki na ciemnym */
  --aj-on-dark-body:    rgba(246,243,237,.82); /* body na ciemnym */
  --aj-on-dark-muted:   rgba(246,243,237,.62); /* WYŁĄCZNIE etykiety 12–13 px */

  /* --- Akcent: jedno złoto w całym serwisie --------------------------- */
  --aj-gold:            #C0A062;   /* akcent bazowy (na ciemnym: tekst, linie, ramki) */
  --aj-gold-hover:      #D6BA84;   /* hover na ciemnym */
  --aj-gold-ink:        #8A6B2E;   /* złoto jako TEKST na jasnym tle — 4.8:1 */
  --aj-gold-fill:       #BC9A55;   /* wypełnienie przycisku primary (zamiast jaskrawej żółci) */
  --aj-gold-fill-hover: #A9873F;
  --aj-gold-soft:       rgba(192,160,98,.16); /* tła podświetleń, wiersze tabeli */

  /* --- Krawędzie ------------------------------------------------------ */
  --aj-line-light:      #DCD4C4;              /* na jasnym */
  --aj-line-light-soft: #E8E1D3;
  --aj-line-dark:       rgba(246,243,237,.14); /* na ciemnym */
  --aj-line-dark-soft:  rgba(246,243,237,.08);
  --aj-line-gold:       rgba(192,160,98,.45);

  /* --- Typografia: rodziny ------------------------------------------- */
  --aj-font-display: "Playfair Display", "Times New Roman", Georgia, serif;
  --aj-font-body:    "Barlow", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* --- Typografia: skala 6 stopni (clamp: 390 → 1280 px) -------------
     Skala oparta o proporcje PrescottBox (small-luxury, gęstsza od
     kinowego oryginału aj4) — 2026-09-04. Wielkości nagłówków prawie
     bez zmian (były już blisko), ale treść/etykiety zmniejszone. */
  --aj-fs-display: clamp(2.75rem, 1.6rem + 4.6vw, 4.5rem);  /* 44 → 72  hero */
  --aj-fs-h1:      clamp(2rem, 1.4rem + 2.6vw, 3.25rem);    /* 32 → 52  nagłówek sekcji dużej */
  --aj-fs-h2:      clamp(1.75rem, 1.35rem + 1.6vw, 2.625rem);/* 28 → 42  nagłówek sekcji */
  --aj-fs-h3:      clamp(1.1875rem, 1.05rem + .5vw, 1.3125rem); /* 19 → 21  nagłówek karty */
  --aj-fs-body:    0.9375rem;                               /* 15 px — treść (było 17) */
  --aj-fs-body-lg: 1.0625rem;                               /* 17 px — lead, akapit hero (było 18) */
  --aj-fs-small:   0.8125rem;                               /* 13 px — podpisy, meta (było 15) */
  --aj-fs-eyebrow: 0.75rem;                                 /* 12 px — eyebrow, etykiety (było 13) */

  /* --- Typografia: interlinie i światło ------------------------------ */
  --aj-lh-display: 1.08;
  --aj-lh-head:    1.16;
  --aj-lh-body:    1.6;
  --aj-lh-tight:   1.45;   /* listy, komórki tabeli */
  --aj-ls-eyebrow: .18em;
  --aj-ls-button:  .1em;
  --aj-ls-display: -.01em;

  /* --- Odstępy ---------------------------------------------------------
     Rytm sekcji ściśnięty do proporcji Prescott/Angal (było 96/128/160,
     kinowo za duże na tę skalę serwisu) — 2026-09-04. */
  --aj-s-1:   8px;
  --aj-s-2:  16px;
  --aj-s-3:  24px;
  --aj-s-4:  48px;
  --aj-s-5:  64px;    /* sekcja zwarta (było 96) */
  --aj-s-6:  96px;    /* sekcja standardowa (było 128) */
  --aj-s-7: 112px;    /* sekcja otwierająca / CTA (było 160) */

  /* --- Siatka --------------------------------------------------------- */
  --aj-container: 1240px;        /* jak Prescott (było 1200) */
  --aj-container-narrow: 760px;  /* maks. szerokość akapitu treści */
  --aj-gutter: clamp(20px, 4vw, 48px);  /* było clamp(20px,5vw,64px) */
  --aj-measure: 68ch;            /* maks. długość wiersza */

  /* --- Promienie ------------------------------------------------------ */
  --aj-r-0: 0;      /* karty, przyciski, sloty — kierunek jest kanciasty */
  --aj-r-1: 2px;    /* inputy, drobne kontrolki */
  --aj-r-pill: 999px;

  /* --- Cienie (bardzo oszczędnie, tylko na jasnym tle) ---------------- */
  --aj-shadow-card:  0 1px 2px rgba(23,21,18,.04), 0 12px 32px -16px rgba(23,21,18,.14);
  --aj-shadow-hover: 0 2px 4px rgba(23,21,18,.06), 0 20px 44px -18px rgba(23,21,18,.20);

  /* --- Ruch i fokus --------------------------------------------------- */
  --aj-ease: cubic-bezier(.22,.61,.36,1);
  --aj-dur: 220ms;
  --aj-focus: 2px solid var(--aj-gold);
  --aj-focus-offset: 3px;

  /* --- Proporcje slotów na zdjęcia ------------------------------------ */
  --aj-ratio-portrait: 4 / 5;   /* portret, karta oferty pionowa */
  --aj-ratio-wide:     16 / 9;  /* blog, hero pomocnicze */
  --aj-ratio-card:     3 / 2;   /* karta oferty w siatce */
}

@media (prefers-reduced-motion: reduce) {
  :root { --aj-dur: 1ms; }
}