/* ============================================================
TOKENS — CSS variables (paleta, cienie, layout)
Identyczne z prototypem Majowych Ogrodów. NIE wymyślaj nowych
wartości — jeśli czegoś brakuje, dopisz token tu, nie hardkoduj.
============================================================ */
/* Fonty Google Fonts ładowane z partials/head-meta.html (preconnect + ).
Tu zostawiamy import jako fallback na wypadek izolowanego użycia tokens.css.
W docelowym buildzie pierwszeństwo ma w (szybszy preload). */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700;800;900&family=Nunito:wght@400;500;600;700;800&display=swap');
:root {
/* Paleta */
--green-dark: #3d6b2e;
--green: #5a9142;
--green-light: #7ab358;
--green-bg: #eaf3e3;
--gray-bg: #f2f2f0;
--gray-card: #ffffff;
--text-dark: #1f2a1a;
--text-medium: #4a544a;
--text-light: #7a827a;
--border: #e4e6e2;
/* Cienie zielono-tonowane */
--shadow-sm: 0 2px 8px rgba(61, 107, 46, 0.06);
--shadow-md: 0 6px 24px rgba(61, 107, 46, 0.08);
--shadow-lg: 0 16px 48px rgba(61, 107, 46, 0.12);
/* Layout */
--max-width: 1280px;
--section-padding: 100px;
/* Fonty (skróty do użycia w komponentach) */
--font-heading: 'Roboto', sans-serif;
--font-body: 'Nunito', sans-serif;
}
/* Breakpointy — CSS variables NIE działają w @media queries.
Trzymamy je tu jako referencję (komentarz) i używamy wartości bezpośrednio:
--bp-mobile: 640px
--bp-tablet: 1024px
Zasady projektu (CONTEXT.md):
mobile-first, breakpointy 640px (mobile->tablet) i 1024px (tablet->desktop) */