/*
 * Tokeny PDM Construction, wersja Avenir (Figma EWXAni2igqzqRF8NwhnrGj, odczyt 22.10.2026:
 * docs/figma/spec-strona-glowna.md, punkt C). Kolory PDM w rolach systemu Avenir, kroje Lora i Figtree.
 * Kontrasty zmierzone 22.10 (avg.py kontrast) i opisane w redesign-figma/DESIGN.md.
 * Nazwy ról zostają jak w motyw-start (komponenty motywu działają bez zmian); doszły role ciemnych
 * sekcji (--c-deep, --c-dark, --c-on-dark*), tła pomocnicze (--c-wash*) i skala nagłówków Avenir.
 */

@font-face { font-family: "Lora"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/lora-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Lora"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/lora-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Lora"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/lora-latin-ext-400-italic.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Lora"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/lora-latin-400-italic.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/figtree-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/figtree-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/figtree-latin-ext-500-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/figtree-latin-500-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
	/* Granat PDM (Figma: granat/800, granat/900, akcent/500, tlo/*) */
	--primary-50: #f3f4fb;    /* tlo/karta */
	--primary-100: #e3e7f6;   /* tlo/wash-2 */
	--primary-200: #ced5ef;   /* tlo/wash */
	--primary-500: #555dbb;   /* akcent: 5,72 na bieli, 5,22 na primary-50; na 900 tylko 2,54 */
	--primary-800: #383a70;   /* tekst: 10,46 na bieli */
	--primary-900: #262645;   /* 14,53 na bieli */
	--brand-white: #ffffff;
	/* Skala secondary z motyw-start (wybór, zaznaczenie, pola) wskazuje na granat: motyw nie ma szarości. */
	--secondary-50: var(--primary-50);
	--secondary-200: var(--primary-200);
	--secondary-400: rgb(56 58 112 / 0.6);
	--secondary-500: rgb(56 58 112 / 0.7);
	--secondary-600: rgb(56 58 112 / 0.78);
	--secondary-700: rgb(56 58 112 / 0.78);
	--secondary-800: var(--primary-800);
	--secondary-900: var(--primary-900);
	--primary-400: var(--primary-500);
	--primary-700: var(--primary-800);
	--black-200: var(--primary-200);
	--danger-700: #b61928;

	/* Role */
	--c-bg: var(--brand-white);
	--c-bg-soft: var(--primary-50);
	--c-wash: var(--primary-200);
	--c-wash-2: var(--primary-100);
	--c-text: var(--primary-800);
	--c-text-2: rgb(56 58 112 / 0.78);       /* 5,51 na bieli, 5,19 na primary-50, 4,82 na primary-100 */
	--c-text-3: var(--c-text-2);
	--c-line: rgb(56 58 112 / 0.16);
	--c-field-border: rgb(56 58 112 / 0.6);  /* obrys pól 3,27 na primary-50, 3,40 na bieli (WCAG 1.4.11) */
	--c-dark: var(--primary-800);            /* sekcje ciemne: liczby, kroki */
	--c-deep: var(--primary-900);            /* hero, nagłówek podstrony, belka po przewinięciu, arkusz menu */
	--c-on-dark: var(--brand-white);
	--c-on-dark-2: rgb(255 255 255 / 0.72);  /* 6,31 na primary-800 */
	--c-on-dark-lead: rgb(255 255 255 / 0.82);
	--c-line-on-dark: rgb(255 255 255 / 0.28);
	--c-accent-text: var(--primary-800);
	--c-accent-surface: var(--primary-200);
	--c-accent-line: var(--primary-500);
	--c-on-accent: var(--primary-800);
	--c-accent-hover: var(--primary-200);
	--c-action: var(--primary-800);          /* przycisk ciemny: biel 10,46 */
	--c-action-hover: var(--primary-900);
	--c-on-action: var(--brand-white);
	--c-action-light: var(--brand-white);    /* przycisk jasny na ciemnym: napis granat */
	--c-action-light-hover: var(--primary-200);
	--c-focus: var(--primary-500);           /* na ciemnym biel (reguły komponentów) */

	/* Szkło na zdjęciach (Figma: granat/900 45-55%, rozmycie 16, obrys biel 20%) */
	--glass-bg: rgb(38 38 69 / 0.65);   /* 55% z Figmy podniesione: jasne niebo zdjęcia dawało 3,7 (detektor 22.10) */
	--glass-blur: 16px;
	--glass-line: rgb(255 255 255 / 0.2);

	/* Pismo: Lora 400 nagłówki, Figtree tekst. Desktop z Figmy, telefon z Avenir (płynnie 390 -> 1440). */
	--font-heading: "Lora", Georgia, "Times New Roman", serif;
	--font-text: "Figtree", Arial, "Helvetica Neue", sans-serif;
	--font-text-strong: 500;

	--heading-display: clamp(3rem, 2.071rem + 3.81vw, 5.5rem);     /* 48 -> 88 */
	--heading-number: clamp(3.5rem, 2.757rem + 3.048vw, 5.5rem);   /* 56 -> 88 */
	--heading-h1: clamp(2.5rem, 1.943rem + 2.286vw, 4rem);         /* 40 -> 64 */
	--heading-h2: clamp(2rem, 1.443rem + 2.286vw, 3.25rem);        /* 32 -> 52 */
	--heading-h3: clamp(1.75rem, 1.471rem + 1.143vw, 2.5rem);      /* 28 -> 40 */
	--heading-h4: clamp(1.5rem, 1.314rem + 0.762vw, 2rem);         /* 24 -> 32 */
	--heading-h5: clamp(1.375rem, 1.329rem + 0.19vw, 1.5rem);      /* 22 -> 24 */
	--heading-h6: 1.25rem;
	--txt-lead: clamp(1.125rem, 1.079rem + 0.19vw, 1.25rem);       /* 18 -> 20, B1 */
	--txt-body-1: 1rem;          /* 16, B2 */
	--txt-body-2: 0.875rem;      /* 14, B3 */
	--txt-caption: 0.875rem;
	--txt-menu: 0.9375rem;       /* 15 */
	--leading-display: 1;
	--leading-tight: 1.15;
	--leading-h4: 1.1875;
	--leading-lead: 1.5;
	--leading-text: 1.625;
	--track-display: -0.0227em;
	--track-h1: -0.03125em;
	--track-h2: -0.0288em;
	--track-h3: -0.03em;
	--track-h4: -0.0188em;
	--track-h5: -0.0167em;

	/* Układ: ramka 1440, margines 32, treść 1376 (telefon 16 i 358) */
	--wrap-wide: 86rem;          /* 1376 */
	--wrap-content: 86rem;
	--wrap-text: 47.5rem;        /* 760: akapity wyśrodkowane i strona tekstowa */
	--gutter: clamp(1rem, 0.629rem + 1.524vw, 2rem);
	--section-space: clamp(5rem, 4.071rem + 3.81vw, 7.5rem);   /* 80 -> 120 */
	--radius: 0.75rem;           /* 12: zdjęcia, karty, szkło */
	--radius-ui: 0.5rem;         /* 8: przyciski i pola */
	--gap-s: 0.5rem;
	--gap-m: 1rem;
	--gap-l: 1.5rem;
	--gap-xl: 2rem;
	--touch: 3rem;
}