/*
 * ASG Opole — tokeny projektu. WSPÓLNY KONTRAKT wszystkich agentów.
 * Właściciel: agent Fundament. Inni agenci NIE zmieniają nazw ani nie usuwają tokenów;
 * mogą prosić koordynatora o nowe. Wartości Fundament może dostroić.
 *
 * Kierunek: „pole o świcie” — ciemny grafit z nutą morskiej zieleni (jak gradacja zdjęć marki),
 * jeden akcent: piasek/khaki z logotypu (#b0996f rozjaśniony dla kontrastu). Heksagon z logo jako
 * powracający motyw (maski zdjęć, ikony, znaczniki) — oszczędnie.
 */
:root {
	/* — kolor: tło i powierzchnie (ciemny ton, domyślny) — */
	--asg-ink: #0b1110;           /* tło strony */
	--asg-surface: #121a19;       /* karty, sekcje */
	--asg-surface-2: #192322;     /* wyniesione powierzchnie */
	--asg-surface-3: #212d2b;     /* hover, pola formularzy */
	--asg-line: rgba(232, 240, 236, 0.09);
	--asg-line-strong: rgba(232, 240, 236, 0.18);

	/* — tekst — */
	--asg-text: #edf2ef;
	--asg-text-2: rgba(237, 242, 239, 0.70);
	--asg-text-3: rgba(237, 242, 239, 0.50);

	/* — akcent (jedyny) — */
	--asg-sand: #c9b083;          /* akcent: przyciski, linki, wyróżnienia */
	--asg-sand-strong: #d8c29a;   /* hover */
	--asg-sand-ink: #17120a;      /* tekst na piaskowym */
	--asg-sand-soft: rgba(201, 176, 131, 0.14);

	/* — statusy (tylko komunikaty, nigdy dekoracja) — */
	--asg-ok: #5fbf8a;
	--asg-warn: #f0a24a;
	--asg-err: #ef6b5e;

	/* — materiał (nawigacja, arkusze) wg apple-design §12 — */
	--asg-glass: rgba(11, 17, 16, 0.62);
	--asg-glass-blur: saturate(160%) blur(20px);
	--asg-glass-edge: rgba(255, 255, 255, 0.07);

	/* — typografia: Archivo (nagłówki) + Geist (tekst), self-hosted, OFL, latin + latin-ext (assets/fonts) — */
	--asg-font-display: "Archivo", "Archivo Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
	--asg-font-text: "Geist", "Geist Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
	--asg-fw-display: 680;  /* waga nagłówków (font zmienny) */
	--asg-fw-strong: 600;
	--asg-font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;

	/* skala płynna; tracking zależny od rozmiaru (apple-design §15) */
	--asg-fs-hero: clamp(2.75rem, 1.4rem + 6vw, 6.5rem);   --asg-ls-hero: -0.035em; --asg-lh-hero: 0.98;
	--asg-fs-h1: clamp(2.25rem, 1.5rem + 3.4vw, 4.25rem);  --asg-ls-h1: -0.028em;   --asg-lh-h1: 1.04;
	--asg-fs-h2: clamp(1.75rem, 1.3rem + 2vw, 3rem);       --asg-ls-h2: -0.022em;   --asg-lh-h2: 1.08;
	--asg-fs-h3: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem); --asg-ls-h3: -0.012em;   --asg-lh-h3: 1.2;
	--asg-fs-body: 1.0625rem;                              --asg-ls-body: 0;        --asg-lh-body: 1.55;
	--asg-fs-small: 0.875rem;                              --asg-ls-small: 0.01em;  --asg-lh-small: 1.45;
	--asg-fs-eyebrow: 0.75rem;                             --asg-ls-eyebrow: 0.14em;

	/* — odstępy (rem, skalują się z rozmiarem tekstu użytkownika) — */
	--asg-s-1: 0.25rem; --asg-s-2: 0.5rem; --asg-s-3: 0.75rem; --asg-s-4: 1rem;
	--asg-s-5: 1.5rem;  --asg-s-6: 2rem;   --asg-s-7: 3rem;    --asg-s-8: 4.5rem;
	--asg-s-9: 7rem;    --asg-s-10: 10rem;
	--asg-section: clamp(4.5rem, 3rem + 7vw, 10rem);        /* pionowy oddech sekcji */
	--asg-gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);      /* boczny margines (min 16px na telefonie) */
	--asg-max: 80rem;                                       /* szerokość treści */
	--asg-max-text: 42rem;                                  /* szerokość akapitów */
	--asg-header-h: 4rem;

	/* — warstwy (z-index) — jedyna skala w projekcie — */
	--asg-z-naglowek: 100;
	--asg-z-zaslona: 110;
	--asg-z-arkusz: 120;
	--asg-z-skip: 200;

	/* — kształt i głębia — */
	--asg-r-sm: 0.5rem; --asg-r-md: 0.875rem; --asg-r-lg: 1.375rem; --asg-r-xl: 2rem; --asg-r-pill: 999px;
	--asg-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.35);
	--asg-shadow-2: 0 10px 30px -12px rgba(0, 0, 0, 0.6);
	--asg-shadow-3: 0 30px 80px -24px rgba(0, 0, 0, 0.75);
	--asg-hex: polygon(25% 3%, 75% 3%, 100% 50%, 75% 97%, 25% 97%, 0 50%);  /* maska heksagonu (płaski) */
	--asg-hex-pointy: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);  /* jak w logo */

	/* — ruch (apple-design: tłumienie 1.0 domyślnie, sprężyna tylko po geście z pędem) — */
	--asg-ease-out: cubic-bezier(0.22, 1, 0.36, 1);      /* wejścia, odsłonięcia */
	--asg-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);   /* zmiany stanu */
	--asg-ease-press: cubic-bezier(0.3, 0, 0.5, 1);
	--asg-dur-press: 100ms;   /* reakcja na wciśnięcie */
	--asg-dur-fast: 180ms;    /* hover, kolor */
	--asg-dur-base: 320ms;    /* panele, menu */
	--asg-dur-slow: 640ms;    /* odsłanianie sekcji */
}

/* Ciemny ton wymuszony (np. stopka na stronie w jasnym tonie). */
[data-asg-ton="ciemny"] {
	--asg-ink: #0b1110;
	--asg-surface: #121a19;
	--asg-surface-2: #192322;
	--asg-surface-3: #212d2b;
	--asg-line: rgba(232, 240, 236, 0.09);
	--asg-line-strong: rgba(232, 240, 236, 0.18);
	--asg-text: #edf2ef;
	--asg-text-2: rgba(237, 242, 239, 0.70);
	--asg-text-3: rgba(237, 242, 239, 0.50);
	--asg-sand: #c9b083;
	--asg-sand-strong: #d8c29a;
	--asg-sand-ink: #17120a;
	--asg-sand-soft: rgba(201, 176, 131, 0.14);
	--asg-glass: rgba(11, 17, 16, 0.62);
	--asg-glass-edge: rgba(255, 255, 255, 0.07);
	--asg-shadow-2: 0 10px 30px -12px rgba(0, 0, 0, 0.6);
	--asg-shadow-3: 0 30px 80px -24px rgba(0, 0, 0, 0.75);
}

/* Jasny ton — przepływy zakupowe (koszyk, zamówienie, konto) i długie teksty (regulamin).
   Włączany atrybutem data-asg-ton="jasny" na <body> lub sekcji. */
[data-asg-ton="jasny"] {
	--asg-ink: #f4f2ed;
	--asg-surface: #ffffff;
	--asg-surface-2: #faf8f4;
	--asg-surface-3: #eeebe4;
	--asg-line: rgba(20, 24, 22, 0.10);
	--asg-line-strong: rgba(20, 24, 22, 0.20);
	--asg-text: #141816;
	--asg-text-2: rgba(20, 24, 22, 0.70);
	--asg-text-3: rgba(20, 24, 22, 0.52);
	--asg-sand: #8a6e3e;          /* ciemniejszy piasek dla kontrastu AA na jasnym */
	--asg-sand-strong: #745a2f;
	--asg-sand-ink: #ffffff;
	--asg-sand-soft: rgba(138, 110, 62, 0.10);
	--asg-glass: rgba(244, 242, 237, 0.72);
	--asg-glass-edge: rgba(255, 255, 255, 0.6);
	--asg-shadow-2: 0 10px 30px -14px rgba(20, 24, 22, 0.25);
	--asg-shadow-3: 0 30px 80px -30px rgba(20, 24, 22, 0.35);
}

@media (prefers-reduced-transparency: reduce) {
	:root { --asg-glass: rgba(11, 17, 16, 0.97); --asg-glass-blur: none; }
	[data-asg-ton="jasny"] { --asg-glass: rgba(244, 242, 237, 0.98); }
}
@media (prefers-contrast: more) {
	:root { --asg-line: rgba(232, 240, 236, 0.35); --asg-text-2: rgba(237, 242, 239, 0.9); --asg-text-3: rgba(237, 242, 239, 0.75); }
	[data-asg-ton="jasny"] { --asg-line: rgba(20, 24, 22, 0.4); --asg-text-2: rgba(20, 24, 22, 0.9); --asg-text-3: rgba(20, 24, 22, 0.75); }
}
@media (prefers-reduced-motion: reduce) {
	:root { --asg-dur-base: 1ms; --asg-dur-slow: 1ms; }
}