:root {
  --font-body: "Caviar Dreams", Arial, sans-serif;
  --font-display: "Bootshaus", "Arial Narrow", sans-serif;
  --page-max-width: 83.375rem;
  --page-content-max-width: 69.25rem;
  --page-content-offset: clamp(1rem, 8.25vw, 7.0625rem);
  --layout-gutter: clamp(1rem, 5vw, 4.375rem);
  --section-space-y: clamp(2.5rem, 6vw, 6rem);
  --section-space-y-tight: clamp(2rem, 4vw, 4rem);
  --viewport-height: 100vh;
  --safe-area-top: env(safe-area-inset-top, 0px);
  --safe-area-right: env(safe-area-inset-right, 0px);
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --safe-area-left: env(safe-area-inset-left, 0px);
  --control-min-size: 2.75rem;
  /*font-size*/
  --advantages-cut: 3.25rem;
  --font-size-h2: 2.75rem;
  --font-size-h3: 1.875rem;
  /*color*/
  --color-page: #F4F7EF;
  --color-text: #000000;
  --color-title: #022349;
  --color-marked: #2b87a2;
  --color-white: #ffffff;
  --advantages-accent: #b30b45;
  --advantages-hover-bg: #0f7797;
  --advantages-hover-text: #ffffff;
  --color-accent: #a20a3f;
  --color-accent-variables-2: #5B122A;
  --color-button-primary: #8f0634;
  --color-button-info: #1395bd;
  --color-header-panel: #0f7797;
  --advantages-bg: #f7f8f1; /* цвет фона секции */
  --advantages-border: #0d2237;
  /*border*/
  --border-1: 1px solid #09192c;
  --border-2: 2px solid #09192c;
  --border-1-2: .5px solid #09192c;
  --advantages-border-width: 2px;
  /*margin*/
  --margin-title: 0.83rem;
  --margin-left-title: var(--page-content-offset);
  --padding-inline: var(--page-content-offset);
}

@supports (height: 100dvh) {
  :root {
    --viewport-height: 100dvh;
  }
}

html {
  font-size: 16px;
}

@media (max-width: 950px) {
  html { font-size: 16px; }

  :root {
    --layout-gutter: 1rem;
    --page-content-offset: 1rem;
  }
}
@media (min-width: 951px) {
  html {
    font-size: clamp(13px, calc(13px + 0.65vw), 55px);
  }
}