/* ==========================================================================
   Tokeny projektu
   Nazwy zgodne z Automatic.css 3.x (słownik, nie zależność): --primary-*, --space-*,
   --section-space-*, --h1…, --text-*, --gutter, --content-width, --radius, --transition-*.
   Nazwy spoza ACSS są oznaczone „NDK”. Wartości płynne: 360 px → 1280 px szerokości okna.
   Komponenty używają tylko tych zmiennych (wyjątek: wymiary specyficzne dla układu komponentu).
   Rozmiar pośredni fontu liczymy z tokenu, np. calc(var(--text-l) * 1.1), zamiast dodawać nowy token.
   ========================================================================== */

/* Fonty projektu (licencje webfont: Gill Sans – Monotype, Georgia – Microsoft; do potwierdzenia przed publikacją).
   Georgia najpierw z systemu (local), plik tylko jako zapas. */
@font-face {
  font-family: "Gill-Sans";
  src: url("../fonts/gillsans.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Georgia-Reg";
  src: local("Georgia"), url("../fonts/georgia.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Georgia-Reg";
  src: local("Georgia Italic"), url("../fonts/georgiai.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  /* Kolory: marka */
  --primary: #135e4b;
  --primary-medium: #2f7360;
  --primary-semi-light: #3f7f6d;
  --primary-light: #5e9888;
  --primary-trans-20: rgb(19 94 75 / 0.2);
  --primary-trans-30: rgb(19 94 75 / 0.3);
  --secondary: #b67152;
  --secondary-ultra-light: #f1dfd2;
  --secondary-light: #d3b19b;
  --secondary-semi-dark: #a3613f;
  --secondary-dark: #9c5c40;
  --secondary-ultra-dark: #85472d;
  --base: #2b3431;
  --base-trans-10: rgb(43 52 49 / 0.1);
  --base-trans-20: rgb(43 52 49 / 0.2);

  /* Kolory: neutralne i tekst */
  --white: #fefefe;
  --white-trans-30: rgb(254 254 254 / 0.3);
  --white-trans-60: rgb(254 254 254 / 0.6);
  --white-trans-70: rgb(254 254 254 / 0.7);
  --white-trans-90: rgb(254 254 254 / 0.9);
  --neutral-ultra-light: #ededed;
  --text-dark: #5c5c5c;
  --text-light: var(--white);
  --heading-color: var(--primary);

  /* Typografia */
  --text-font-family: "Gill-Sans", "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
  --heading-font-family: var(--text-font-family);
  --accent-font-family: "Georgia-Reg", Georgia, serif; /* NDK: krój akcentów (kursywa) */
  --text-line-height: 1.6;
  --heading-line-height: 0.94;

  --h1: clamp(3rem, 1.6304rem + 6.0870vw, 6.5rem);
  --h2: clamp(3.25rem, 1.9783rem + 5.6522vw, 6.5rem);
  --h3: clamp(1.5rem, 1.3533rem + 0.6522vw, 1.875rem);
  --h4: clamp(1.1875rem, 1.1141rem + 0.3261vw, 1.375rem);

  --text-xs: clamp(0.8125rem, 0.7880rem + 0.1087vw, 0.875rem);
  --text-s: 0.9375rem;
  --text-m: clamp(1rem, 0.9755rem + 0.1087vw, 1.0625rem);
  --text-l: clamp(1rem, 0.9511rem + 0.2174vw, 1.125rem);
  --text-xl: clamp(1.375rem, 1.2283rem + 0.6522vw, 1.75rem);
  --text-xxl: clamp(2.5rem, 1.0049rem + 3.1189vw, 3.5rem); /* rośnie od 767 px, jak w szablonie */

  /* Odstępy */
  --space-xs: clamp(0.625rem, 0.5272rem + 0.4348vw, 0.875rem);
  --space-s: clamp(1rem, 0.8777rem + 0.5435vw, 1.3125rem);
  --space-m: clamp(1.5rem, 1.3043rem + 0.8696vw, 2rem);
  --space-l: clamp(2.25rem, 1.9565rem + 1.3043vw, 3rem);
  --space-xl: clamp(3.375rem, 2.9348rem + 1.9565vw, 4.5rem);
  --space-xxl: clamp(5rem, 4.3152rem + 3.0435vw, 6.75rem);

  --section-space-s: clamp(3rem, 2.2174rem + 3.4783vw, 5rem);
  --section-space-m: clamp(4.5rem, 3.3261rem + 5.2174vw, 7.5rem);
  --section-space-l: clamp(6rem, 4.4348rem + 6.9565vw, 10rem);

  /* Układ */
  --content-width: 75rem;
  --gutter: clamp(1.25rem, 0.7609rem + 2.1739vw, 2.5rem);
  --header-height: 5rem; /* NDK */

  /* Kształt i ruch */
  --radius: 4px;
  --focus-color: var(--secondary);
  --focus-width: 2px;
  --focus-offset: 3px;
  --transition-duration: 0.35s;
  --transition-timing: cubic-bezier(0.16, 1, 0.3, 1);
  --transition: var(--transition-duration) var(--transition-timing);

  /* Przyciski */
  --btn-min-height: 3.375rem; /* NDK */
  --btn-padding-inline: 1.75rem;
  --btn-border-radius: var(--radius);
  --btn-border-width: 1px;
}

@media (max-width: 767px) {
  :root {
    --header-height: 4rem;
  }
}
