<link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Open+Sans:wght@400;600;700&display=swap'>

:root {
  /* Палитра — primary (зелёный акцент) + secondary (тёмно-зелёный) + оттенки */
  --primary: hsl(105 53% 48%);
  --primary-l-1: hsl(105 53% 56%);  --primary-l-2: hsl(105 53% 64%);
  --primary-l-3: hsl(105 53% 72%);  --primary-l-4: hsl(105 53% 81%);
  --primary-l-5: hsl(105 53% 90%);
  --primary-d-1: hsl(105 53% 42%);  --primary-d-2: hsl(105 53% 34%);
  --primary-d-3: hsl(105 53% 25%);  --primary-d-4: hsl(105 53% 17%);
  --primary-d-5: hsl(105 53% 9%);
  --primary-t-1: hsla(105 53% 48% / 0.09);  --primary-t-2: hsla(105 53% 48% / 0.18);
  --primary-t-3: hsla(105 53% 48% / 0.27);  --primary-t-4: hsla(105 53% 48% / 0.36);
  --primary-t-5: hsla(105 53% 48% / 0.45);  --primary-t-6: hsla(105 53% 48% / 0.55);
  --primary-t-7: hsla(105 53% 48% / 0.64);  --primary-t-8: hsla(105 53% 48% / 0.73);
  --primary-t-9: hsla(105 53% 48% / 0.82);  --primary-t-10: hsla(105 53% 48% / 0.91);
  --secondary: hsl(105 42% 34%);
  --secondary-l-1: hsl(105 42% 42%);  --secondary-l-2: hsl(105 42% 50%);
  --secondary-l-3: hsl(105 42% 60%);  --secondary-l-4: hsl(105 42% 72%);
  --secondary-l-5: hsl(105 42% 86%);
  --secondary-d-1: hsl(105 42% 28%);  --secondary-d-2: hsl(105 42% 22%);
  --secondary-d-3: hsl(105 42% 16%);  --secondary-d-4: hsl(105 42% 10%);
  --secondary-d-5: hsl(105 42% 5%);
  --secondary-t-1: hsla(105 42% 34% / 0.09);  --secondary-t-2: hsla(105 42% 34% / 0.18);
  --secondary-t-3: hsla(105 42% 34% / 0.27);  --secondary-t-4: hsla(105 42% 34% / 0.36);
  --secondary-t-5: hsla(105 42% 34% / 0.45);  --secondary-t-6: hsla(105 42% 34% / 0.55);
  --secondary-t-7: hsla(105 42% 34% / 0.64);  --secondary-t-8: hsla(105 42% 34% / 0.73);
  --secondary-t-9: hsla(105 42% 34% / 0.82);  --secondary-t-10: hsla(105 42% 34% / 0.91);

  /* Кастомные переменные проекта Volchkov Group */
  --vg-ink: var(--dark);
  --vg-paper: var(--light);
  --vg-gray: var(--neutral);
  --vg-muted: var(--neutral-l-10);
  --vg-line: var(--neutral-l-9);
  --vg-overlay: rgba(26, 31, 36, 0.78);
  --vg-radius-sm: var(--radius-s);
  --vg-radius-md: var(--radius-m);
  --vg-radius-pill: var(--radius-round);
  --vg-shadow-card: var(--shadow-s);
  --vg-shadow-hover: 0 10px 28px rgba(33,38,45,0.1);

  /* Offcanvas theming */
  --oc-bg: var(--vg-ink);
  --oc-padding: 24px;
  --oc-border: 2px solid rgba(255,255,255,0.12);
  --oc-shadow: 4px 0 24px rgba(0,0,0,0.4);
  --oc-backdrop: rgba(0,0,0,0.6);
  --oc-link: var(--vg-paper);
  --oc-link-hover: var(--primary);
  --oc-link-bg-hover: var(--primary-t-2);
  --oc-width: 320px;
}
  *, *::before, *::after { box-sizing: border-box; }
  html { scroll-behavior: smooth; overflow-x: hidden; }
  body { margin: 0; font-family: 'Open Sans', sans-serif; font-size: 16px; line-height: 1.6; color: var(--vg-ink); background: var(--vg-paper); -webkit-font-smoothing: antialiased; overflow-x: hidden; max-width: 100vw; }
  h1, h2, h3, h4, h5, h6, p { margin: 0; }
  img { max-width: 100%; display: block; }
  a { color: inherit; text-decoration: none; }
  ul { list-style: none; }
  .header__nav-items.brx-nav-nested-items { display: flex !important; flex-direction: row !important; flex-wrap: nowrap; align-items: center; gap: 28px; list-style: none; padding: 0; margin: 0; }
  .header__nav-items.brx-nav-nested-items > li { width: auto !important; }
  .header__nav-items.brx-nav-nested-items > li > a { font-size: 14px; font-weight: 600; color: var(--vg-gray); transition: color 0.2s; }
  .header__nav-items.brx-nav-nested-items > li > a:hover { color: var(--vg-ink); }
  .brx-offcanvas-inner { background: var(--oc-bg) !important; padding: var(--oc-padding) !important; border-right: var(--oc-border) !important; box-shadow: var(--oc-shadow) !important; }
  .brx-offcanvas-backdrop { background: var(--oc-backdrop) !important; }
  .offcanvas__list.brx-nav-nested-items > li > a { color: var(--oc-link) !important; }
  .offcanvas__list.brx-nav-nested-items > li > a:hover { color: var(--oc-link-hover) !important; background: var(--oc-link-bg-hover) !important; }
  .offcanvas__close { color: var(--oc-link) !important; }
  .offcanvas__close svg { fill: var(--oc-link) !important; stroke: var(--oc-link) !important; }
  .offcanvas__close:hover { color: var(--oc-link-hover) !important; }
  .offcanvas__close:hover svg { fill: var(--oc-link-hover) !important; stroke: var(--oc-link-hover) !important; }

  // Smooth scroll handled natively via CSS scroll-behavior