@charset "UTF-8";
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
.button {
  transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out, border-color 0.5s ease-in-out;
}
.button--style-primary:hover {
  background-color: transparent;
  color: var(--color-primary);
}
.button--style-primary.button--with-arrow:hover::after {
  filter: url(#filter-style-primary);
}
.button--style-primary.button--with-arrow::after {
  transition: filter 0.5s ease-in-out;
}
.button--style-secondary:hover {
  color: var(--color-secondary);
  background-color: transparent;
}
.button--style-secondary.button--with-arrow:hover::after {
  filter: url(#filter-style-secondary);
}
.button--style-secondary.button--with-arrow::after {
  transition: filter 0.5s ease-in-out;
}

.aftersubmit__link {
  transition: text-decoration-color 0.5s ease-in-out;
}
.aftersubmit__link:hover {
  text-decoration-color: transparent;
}

/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
.slider-nav {
  margin: 40px 0 0;
}

.slider-arrow {
  width: 30px;
  height: 30px;
}
.section-title--level-1 {
  font-size: 65px;
}
.section-title--level-2 {
  font-size: 43px;
}
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
.header {
  --logo-width: 160px;
  --logo-height: 73px;
}
.header.fixed > .header__logo {
  font-size: calc(var(--logo-size) * 0.6);
}
.header.fixed > .header__burger.active {
  --burger-width: calc(20px * 0.8);
  --burger-height: calc(20px * 0.8);
}
.header__logo {
  top: 10px;
}
.header__menu-content {
  padding: 60px var(--section-px);
}
.header__nav-link {
  border-bottom: 1px solid transparent;
  transition: border-bottom-color 0.5s ease-out;
}
.header__nav-link:hover {
  border-bottom-color: currentColor;
}
.header__links {
  margin: 60px 0 0;
}
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/
.footer__logo {
  margin: 0 120px auto 0;
  width: 299px;
  height: 137px;
}
.footer__nav-list {
  column-gap: 120px;
}
.footer__nav-link {
  border-bottom: 1px solid transparent;
  transition: border-bottom-color 0.5s ease-in-out;
}
.footer__nav-link:hover {
  border-bottom-color: currentColor;
}
/*
  Создает функцию calc(), которая исходя из переданных
  значений ширины экранов и пикселей, делает функцию
  "от->до".

  Например:
  margin-bottom: responsive('320->575', '20->100');
  На размерах экранов от 320 до 575, нижний отступ будет
  расти от 20 до 100.

  Аргумент $minus: true делает значение отрицательным,
  например:
  margin-bottom: responsive('320->575', '0->100', true);
  На размерах экранов от 320 до 575, нижний отступ будет
  уменьшаться от 0 до -100.
*/