/* ==========================================================================
   BigFoto – tokeny systemu (kolor, typografia, kształt)
   Kierunek: energiczny, „naklejkowy” styl (jak stripsiaki.pl): kremowe tło,
   pełnokolorowe pasy sekcji, zaokrąglony krój Baloo 2, pigułkowe przyciski,
   duże promienie, twarde cienie offsetowe na plakietkach, fale między sekcjami.
   Wdrożenie używa JEDNEJ kolorystyki — „grafit" (decyzja właściciela).
   Pozostałe pięć schematów z mockupu zostało usuniętych; gdyby wróciły,
   są w INSTRUKCJA.md projektu bigfoto_nowy_sklep.
   Kontrasty tekstu ≥ 4.5:1.
   ========================================================================== */
:root {
  /* --- typografia --- */
  --font-display: "Baloo 2", "Trebuchet MS", "Segoe UI", system-ui, sans-serif;
  --font-body: "Poppins", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", "SF Mono", Menlo, Consolas, monospace;

  --fs-0: 0.75rem;   /* 12 – mono etykiety */
  --fs-1: 0.8125rem; /* 13 */
  --fs-2: 0.875rem;  /* 14 */
  --fs-3: 1rem;      /* 16 – body */
  --fs-4: 1.125rem;  /* 18 – lead */
  --fs-5: 1.375rem;  /* 22 – h4 */
  --fs-6: 1.875rem;  /* 30 – h3 */
  --fs-7: clamp(2rem, 3.4vw, 2.75rem);   /* h2 sekcji */
  --fs-8: clamp(2.5rem, 4.2vw, 3.5rem);  /* h1 podstron */
  --fs-9: clamp(2.6rem, 5.6vw, 4.6rem);  /* hero */

  /* --- rytm i kształt --- */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;
  --container: 1280px;
  --gutter: 24px;
  --radius-xs: 8px;    /* badge, chip mono */
  --radius-sm: 12px;   /* inputy, chipy */
  --radius-md: 20px;   /* karty, panele */
  --radius-lg: 28px;   /* kafle, blat hero */
  --radius-xl: 40px;   /* duże pasy, karty hero */
  --radius-pill: 999px;
  --line-w: 2px;       /* obrys kart */
  --header-h: 76px;
  --utility-h: 36px;
  --nav-h: 50px;
  --ease: cubic-bezier(.22,1,.36,1);
  --ease-bounce: cubic-bezier(.34,1.56,.64,1);
  --dur: 180ms;

  /* ============ SCHEMAT DOMYŚLNY: Grafit i mosiądz (paleta wybrana przez właściciela; decyzja 2026-09-03) ============ */
  --bg: #FAF9F7; --bg-alt: #F1EEE9; --surface: #FFFFFF; --surface-2: #F5F3F0;
  --border: #E6E1D9; --border-strong: #CFC8BC; --border-input: #8F887D;
  --text: #1D1C1A; --text-muted: #625D55; --text-faint: #8F887D; --ink: #1D1C1A;
  --brand: #1D1C1A; --brand-hover: #3A3835; --brand-dark: #121110; --brand-contrast: #FFFFFF; --brand-soft: #EFEBE4;
  --cta: #D9A441; --cta-hover: #E6B65A; --cta-contrast: #1D1C1A; --cta-border: transparent;
  --accent: #FF6B4A; --accent-soft: #FFE4DC; --accent-contrast: #1D1C1A; --accent-ink: #B9411F; --mint: #7BD389;
  --header-bg: #1D1C1A; --header-text: #FAF9F7; --header-muted: #B8B2A8; --header-border: rgba(255,255,255,.12);
  --utility-bg: #121110; --utility-text: #CFC8BC;
  --footer-bg: #1D1C1A; --footer-text: #CFC8BC; --footer-heading: #FFFFFF; --footer-border: rgba(255,255,255,.1);
  --success: #2F7D4F; --success-soft: #DFEFE5; --warning: #9C5F0C; --warning-soft: #F8ECD6; --danger: #B4312F; --danger-soft: #F7DFDE;
  --sale: #B23A3A; --focus: #D9A441; --overlay: rgba(29,28,26,.6); --shadow-color: 29, 28, 26;
  --logo-ink: #1D1C1A; --photo-tile: #F5F3F0; --marker: #F1E4C4; --stars: #C8922F; color-scheme: light;

  /* Cienie. `--sticker` to sygnaturowy twardy cień offsetowy z punktu 4
     instrukcji — bez niego karty w hover, plakietki i panele hero tracą
     „naklejkowy” charakter, na którym stoi cały projekt. */
  --shadow-1: 0 2px 6px rgba(var(--shadow-color), .08);
  --shadow-2: 0 10px 30px rgba(var(--shadow-color), .12);
  --shadow-3: 0 20px 50px rgba(var(--shadow-color), .18);
  --sticker: 5px 5px 0 var(--ink);
  --sticker-sm: 3px 3px 0 var(--ink);

  /* Gwiazdka jako maska SVG — używana tam, gdzie WooCommerce generuje
     własny znacznik i nie da się wstawić ikony ze sprite'a. */
  --bf-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3.2l2.7 5.8 6.3.8-4.6 4.3 1.2 6.2L12 17.3 6.4 20.3l1.2-6.2L3 9.8l6.3-.8z' fill='%23000'/%3E%3C/svg%3E");

}

/* ============ Ocean i słońce (najbliższy stripsiaki.pl) ============ */

/* ============ Atrament i koral (ewolucja obecnej marki) ============ */

/* ============ Śliwka i morela ============ */

/* ============ Butelka i mosiądz ============ */


/* ============ Galeria: ciemnia i bursztyn (ciemny) ============ */