/* СГЕНЕРИРОВАНО из design/tokens.json — не править вручную.
   Правьте токены в design/tokens.json и запускайте: npm run build:tokens */
:root {
  --color-brand-primary: #0068b7; /* Фирменный синий Hoshizaki */
  --color-brand-bright: #00a0e9; /* Акцентный голубой */
  --color-brand-navy: #12283d; /* Тёмно-синий: заголовки, подвал */
  --color-neutral-ink: #1c2e40; /* Основной текст */
  --color-neutral-grey: #5f7386; /* Второстепенный текст */
  --color-neutral-white: #ffffff;
  --color-neutral-line: #d4e0ea; /* Разделители */
  --color-ice-100: #eef4f9; /* Ледяной фон, светлый */
  --color-ice-200: #dfeaf2; /* Ледяной фон, средний */
  --color-ice-300: #cfe0ec; /* Ледяной фон, глубокий */
  --color-accent-penguin-beak: #f5a623; /* Оранжевый клюва пингвина */
  --semantic-bg-page: var(--color-ice-100);
  --semantic-bg-surface: var(--color-neutral-white);
  --semantic-bg-inverse: var(--color-brand-navy);
  --semantic-text-primary: var(--color-neutral-ink);
  --semantic-text-heading: var(--color-brand-navy);
  --semantic-text-muted: var(--color-neutral-grey);
  --semantic-text-accent: var(--color-brand-primary);
  --semantic-border-subtle: var(--color-neutral-line);
  --semantic-action-primary: var(--color-brand-primary);
  --semantic-action-hover: var(--color-brand-bright);
  --font-family-base: "Helvetica Neue", Arial, "Segoe UI", Roboto, "PT Sans", sans-serif;
  --font-size-xs: 12px;
  --font-size-s: 14px;
  --font-size-base: 16px;
  --font-size-l: 20px;
  --font-size-xl: 26px;
  --font-size-2xl: 44px;
  --font-size-hero: clamp(38px, 5.4vw, 68px);
  --space-2xs: 8px;
  --space-xs: 14px;
  --space-s: 20px;
  --space-m: 24px;
  --space-l: 40px;
  --space-xl: 64px;
  --space-2xl: 96px;
  --radius-s: 9px;
  --radius-m: 14px;
  --radius-l: 18px;
  --radius-pill: 999px;
  --shadow-card: 0 10px 30px -22px rgba(18, 55, 92, .45);
  --shadow-float: 0 18px 50px -18px rgba(18, 55, 92, .25);
  --shadow-button: 0 14px 34px -12px rgba(0, 104, 183, .55);
  --motion-ease-out: cubic-bezier(.22, .8, .26, .99);
  --motion-dur-fast: 0.25s;
  --motion-dur-base: 0.45s;
  --motion-dur-slow: 0.9s;
  --breakpoint-mobile: 520px;
  --breakpoint-tablet: 820px;
  --breakpoint-desktop: 1080px;
}