/* Дизайн-токены сайта партнёра NSP.
   Концепция: светлая «травяная» витрина. Спокойный фон, лесной зелёный для действий,
   медовый акцент для бейджей и выделений. Сайт намеренно светлый, тёмная тема после MVP. */
:root {
  --nsp-teal: #007f6e; /* цвет логотипа Nature's Sunshine, только для логотипа */
  color-scheme: light;

  /* Цвет */
  --paper: #f5f6ef;        /* фон страницы, светлый с зелёным подтоном */
  --surface: #ffffff;      /* карточки, шапка */
  --ink: #17251d;          /* основной текст */
  --muted: #5a685f;        /* вторичный текст */
  --line: #dde2d4;         /* разделители и обводки */
  --forest: #1d4a36;       /* основной цвет действия */
  --forest-deep: #133325;  /* hover, тёмные полосы */
  --on-forest: #f3f6ee;    /* текст на зелёном */
  --leaf: #dcebd1;         /* светлые зелёные поверхности */
  --honey: #f2b53c;        /* акцент */
  --honey-soft: #fbecc6;
  --sand: #efe7d6;
  --mist: #dbe8ea;
  --danger: #a8402a;

  /* Шрифты */
  --font-display: "Unbounded", "Arial Black", "Segoe UI", system-ui, sans-serif;
  --font-body: "Onest", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* Кегли */
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);
  --fs-2xl: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
  --fs-hero: clamp(2rem, 1.1rem + 3.4vw, 3.6rem);

  /* Скругления, тени, раскладка */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-pill: 999px;
  --shadow: 0 1px 2px rgb(23 37 29 / 0.05), 0 10px 28px rgb(23 37 29 / 0.07);
  --container: 1240px;
  --pad: 16px;
  --header-h: 64px;
  --bottombar-h: 64px;
}

@media (min-width: 768px) {
  :root { --pad: 28px; --header-h: 72px; }
}
@media (min-width: 1280px) {
  :root { --pad: 32px; }
}