:root {
  color-scheme: dark;
  --space-3xs: 2px; --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px; --space-xl: 32px; --space-2xl: 48px; --space-3xl: 80px; --space-4xl: 120px;
  --text-xs: 0.8125rem; --text-sm: 0.875rem; --text-md: 1rem; --text-lg: 1.25rem; --text-xl: 1.5625rem; --text-2xl: 1.953rem; --text-3xl: 2.441rem;
  --text-display-s: clamp(2.25rem, 4vw + 0.5rem, 3.75rem); --text-display: clamp(2.75rem, 5vw + 1rem, 4.5rem);
  --text-section: clamp(2rem, 2.5vw + 1rem, 3rem); --text-title: clamp(1.25rem, 0.75vw + 0.875rem, 1.625rem); --text-lead: clamp(1.125rem, 0.35vw + 1rem, 1.375rem);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); --ease-in: cubic-bezier(0.7, 0, 0.84, 0); --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms; --dur-short: 220ms; --dur-long: 420ms;
  --color-error: #ef4444; --color-success: #22c55e;
  --container: 1280px; --gutter: 48px; --gap-columns: 32px; --section-gap-s: 72px; --section-gap: 96px; --section-gap-l: 128px;
  --z-base: 1; --z-raised: 10; --z-dropdown: 100; --z-sticky: 200; --z-sticky-nav: 300; --z-modal: 400; --z-toast: 500; --z-tooltip: 600;

  /* Hallmark Kiln: Теплая крафтовая палитра темного дерева, обожженной глины, янтаря и хмеля */
  --color-paper: #131211;
  --color-paper-card: #1c1a17;
  --color-paper-warm: #26231f;
  --color-paper-hero: #171513;
  --color-paper-dark: #0d0c0b;
  
  --color-ink: #f6f3eb;
  --color-ink-2: #ded7ca;
  --color-muted: #9b9385;
  --color-rule: rgba(246, 243, 235, 0.1);
  --color-rule-dark: rgba(246, 243, 235, 0.16);

  /* Ember / Amber — теплое свечение крафтового пива */
  --color-accent: #d97706;
  --color-accent-hover: #f59e0b;
  --color-accent-soft: rgba(217, 119, 6, 0.16);
  --color-accent-ink: #131211;
  --color-focus: #f59e0b;

  /* Стихии напитков: Хмель, Мед, Сидр, Солод */
  --color-hop: #22c55e;
  --color-hop-bg: rgba(34, 197, 94, 0.14);
  --color-honey: #f59e0b;
  --color-honey-bg: rgba(245, 158, 11, 0.14);
  --color-cider: #ef4444;
  --color-cider-bg: rgba(239, 68, 68, 0.14);
  --color-beer: #f97316;
  --color-beer-bg: rgba(249, 115, 22, 0.14);

  --color-tag-overlay: rgba(19, 18, 17, 0.88);
  --color-tag-text: #f6f3eb;
  --color-tag-sub: #ded7ca;

  --color-shadow-btn: rgba(217, 119, 6, 0.35);
  --color-overlay-bg: rgba(13, 12, 11, 0.85);
  --color-footer-text: #f6f3eb;
  --color-footer-muted: #9b9385;

  --font-display: "Playfair Display", Georgia, serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  
  --radius-sm: 8px;
  --radius-card: 20px;
  --radius-pill: 999px;
  --rule-hair: 1px;
  
  --shadow-subtle: 0 4px 20px rgba(0, 0, 0, 0.3);
  --shadow-card: 0 20px 48px -12px rgba(0, 0, 0, 0.6);
  --shadow-float: 0 32px 72px -16px rgba(0, 0, 0, 0.8);

  --tracking-display: -0.02em;
  --display-weight: 700;
}

[data-theme="light"] {
  color-scheme: light;
  --color-paper: #f8f6f0;
  --color-paper-card: #fffdf9;
  --color-paper-warm: #eee9dc;
  --color-paper-hero: #e8e1cf;
  --color-paper-dark: #191613;

  --color-ink: #1c1916;
  --color-ink-2: #3a342c;
  --color-muted: #746b5e;
  --color-rule: rgba(28, 25, 22, 0.12);
  --color-rule-dark: rgba(28, 25, 22, 0.2);

  --color-accent: #b45309;
  --color-accent-hover: #92400e;
  --color-accent-soft: rgba(180, 83, 9, 0.12);
  --color-accent-ink: #fffdf9;
  --color-focus: #b45309;

  --color-hop: #15803d;
  --color-hop-bg: rgba(21, 128, 61, 0.1);
  --color-honey: #b45309;
  --color-honey-bg: rgba(180, 83, 9, 0.1);
  --color-cider: #b91c1c;
  --color-cider-bg: rgba(185, 28, 28, 0.1);
  --color-beer: #c2410c;
  --color-beer-bg: rgba(194, 65, 12, 0.1);

  --color-tag-overlay: rgba(28, 25, 22, 0.84);
  --color-tag-text: #fffdf9;
  --color-tag-sub: #ded7ca;

  --color-shadow-btn: rgba(180, 83, 9, 0.25);
  --color-overlay-bg: rgba(28, 25, 22, 0.7);
  --color-footer-text: #f6f3eb;
  --color-footer-muted: #9b9385;

  --shadow-subtle: 0 4px 16px rgba(45, 35, 25, 0.05);
  --shadow-card: 0 16px 40px -8px rgba(45, 35, 25, 0.08);
  --shadow-float: 0 24px 60px -12px rgba(45, 35, 25, 0.14);
}