/* стиль — head сайта: токены --sw-* (design_system.md р.2) */
:root {

  --sw-color-bg-page: #F4F5F5;
  --sw-color-bg-grid: #d5d5d6;
  --sw-color-bg-section: #FFFFFF;
  --sw-color-surface-muted: #EBEBEB;
  --sw-color-border: #E6E6E6;
  --sw-color-border-strong: #C5C5C5;
  --sw-color-text: #242424;
  --sw-color-text-muted: #8F8F8F;
  --sw-color-text-prefill: #D3D3D3;
  --sw-color-text-on-cta: #FFFFFF;
  --sw-color-text-on-dark: #BEBEBE;
  --sw-color-text-pill: #5E5E5E;
  --sw-color-cta: #242424;
  --sw-color-cta-hover: #0D0D0D;
  --sw-color-accent: #E8D5C4;
  --sw-color-accent-hover: #D6C1AE;
  --sw-color-link-hover: #A68A73;
  --sw-color-focus: #242424;
  --sw-color-focus-on-dark: #FFFFFF;

  /* Гамме VIS-1 не подчиняются: только заливка активных плашек. */
  --sw-color-vk: #0077FE;
  --sw-color-max-base: #7333E7;
  --sw-color-max-bl: #44CCFF;
  --sw-color-max-tl: #274EBD;
  --sw-color-max-tr: #9933DD;
  --sw-color-phone-from: #00944D;
  --sw-color-phone-to: #1FED56;
  --sw-color-mail: #FFC550;

  /* Заморозка ≤320; отрезки — каскадом ниже. */
  --sw-fs-1: 13px;
  --sw-fs-2: 15px;
  --sw-fs-3: 16px;
  --sw-fs-4: 17px;
  --sw-fs-5: 19px;
  --sw-fs-6: 22px;
  --sw-fs-7: 28px;
  --sw-fs-8: 30px;
  --sw-fs-9: 35px;

  /* Безразмерный множитель: кегль бывает ниже потолка шкалы. */
  --sw-lh-1: 1.30;
  --sw-lh-2: 1.29;
  --sw-lh-3: 1.24;
  --sw-lh-4: 1.22;
  --sw-lh-5: 1.18;
  --sw-lh-6: 1.14;
  --sw-lh-7: 1.10;
  --sw-lh-8: 1.08;
  --sw-lh-9: 1.05;

  /* Ось Jura 300–700: легче 300 начертания нет. */
  --sw-fw-light: 300;
  --sw-fw-regular: 400;
  --sw-fw-medium: 500;
  --sw-fw-semibold: 600;


  --sw-space-4: 4px;
  --sw-space-8: 8px;
  --sw-space-12: 12px;
  --sw-space-16: 16px;
  --sw-space-24: 24px;
  --sw-space-32: 32px;
  --sw-space-48: 48px;
  --sw-space-64: 64px;
  --sw-space-96: 96px;
  --sw-space-128: 128px;

  /* Фолбэки var() в секциях повторяют эти значения дословно. */
  --sw-radius-1: clamp(3px, 0.833vw, 12px);
  --sw-radius-2: clamp(4px, 1.389vw, 20px);
  --sw-radius-3: clamp(6px, 1.944vw, 28px);
  --sw-radius-4: clamp(9px, 3.19vw,  46px);
  --sw-radius-pill: 999px;

  --sw-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --sw-shadow-md: 0 4px 16px rgba(0,0,0,0.08);
  --sw-shadow-lg: 0 12px 32px rgba(0,0,0,0.10);

  --sw-dur-fast: 150ms;
  --sw-dur-base: 250ms;
  --sw-dur-slow: 400ms;
  --sw-dur-entrance: 700ms;
  --sw-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --sw-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --sw-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* Справочные: в @media var() не работает. */
  --sw-bp-md: 768px;
  --sw-bp-lg: 1024px;
  --sw-bp-xl: 1440px;

  --sw-z-base: 0;
  --sw-z-raised: 10;
  --sw-z-sticky: 100;
  --sw-z-dropdown: 200;
  --sw-z-overlay: 900;

  /* Акцентное — три места с лёгким начертанием. */
  --sw-font-family: 'InterVar', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --sw-font-family-accent: 'Jura', 'InterVar', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

}

/* стиль — head сайта: отрезки шкалы. Порядок по возрастанию обязателен. */
@media (min-width: 320px) {
  :root {
    --sw-fs-1: calc(0.47619vw + 11.48px);
    --sw-fs-2: calc(0.47619vw + 13.48px);
    --sw-fs-3: calc(0.95238vw + 12.95px);
    --sw-fs-4: calc(1.42857vw + 12.43px);
    --sw-fs-5: calc(1.90476vw + 12.90px);
    --sw-fs-6: calc(3.33333vw + 11.33px);
    --sw-fs-7: calc(5.71429vw + 9.71px);
    --sw-fs-8: calc(6.66667vw + 8.67px);
    --sw-fs-9: calc(8.57143vw + 7.57px);
  }
}

@media (min-width: 425px) {
  :root {
    --sw-fs-1: calc(0.14577vw + 12.88px);
    --sw-fs-2: calc(0.14577vw + 14.88px);
    --sw-fs-3: calc(0.29155vw + 15.76px);
    --sw-fs-4: calc(0.43732vw + 16.64px);
    --sw-fs-5: calc(0.87464vw + 17.28px);
    --sw-fs-6: calc(1.60350vw + 18.69px);
    --sw-fs-7: calc(2.33236vw + 24.09px);
    --sw-fs-8: calc(2.62391vw + 25.85px);
    --sw-fs-9: calc(3.49854vw + 29.13px);
  }
}

@media (min-width: 768px) {
  :root {
    --sw-fs-1: calc(0.59524vw + 9.43px);
    --sw-fs-2: calc(0.59524vw + 11.43px);
    --sw-fs-3: calc(0.89286vw + 11.14px);
    --sw-fs-4: calc(0.89286vw + 13.14px);
    --sw-fs-5: calc(0.89286vw + 17.14px);
    --sw-fs-6: calc(0.89286vw + 24.14px);
    --sw-fs-7: calc(0.89286vw + 35.14px);
    --sw-fs-8: calc(1.33929vw + 35.71px);
    --sw-fs-9: calc(1.48810vw + 44.57px);
  }
}

@media (min-width: 1440px) {
  :root {
    --sw-fs-1: calc(0.53571vw + 10.29px);
    --sw-fs-2: calc(0.71429vw + 9.71px);
    --sw-fs-3: calc(0.71429vw + 13.71px);
    --sw-fs-4: calc(0.80357vw + 14.43px);
    --sw-fs-5: calc(1.07143vw + 14.57px);
    --sw-fs-6: calc(1.69643vw + 12.57px);
    --sw-fs-7: calc(2.67857vw + 9.43px);
    --sw-fs-8: calc(2.76786vw + 15.14px);
    --sw-fs-9: calc(3.39286vw + 17.14px);
  }
}

@media (min-width: 2560px) {
  :root {
    --sw-fs-1: 24px;
    --sw-fs-2: 28px;
    --sw-fs-3: 32px;
    --sw-fs-4: 35px;
    --sw-fs-5: 42px;
    --sw-fs-6: 56px;
    --sw-fs-7: 78px;
    --sw-fs-8: 86px;
    --sw-fs-9: 104px;
  }
}
