@font-face {
  font-display: swap;
  font-family: "PTRootUI";
  src: url("/assets/fonts/PTRootUI/PTRootUI_Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-display: swap;
  font-family: "PTRootUI";
  src: url("/assets/fonts/PTRootUI/PTRootUI_Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-display: swap;
  font-family: "PTRootUI";
  src: url("/assets/fonts/PTRootUI/PTRootUI_Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/fonts/Inter/Inter_Regular.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  src: url("/assets/fonts/Inter/Inter_Medium.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  src: url("/assets/fonts/Inter/Inter_SemiBold.woff2") format("woff2");
}
:root {
  /* Colors */
  --color-white: #ffffff;
  --color-white-2: #f2f3f8;
  --color-black: #0f161e;
  --color-black-transparent: rgba(0, 0, 0, 0.5);
  --color-gray: #d9e2e9;
  --color-gray-1: #f2f7fb;
  --color-gray-2: #797b8e;
  --color-gray-3: #7e828a;
  --color-blue: #0186ab;
  --color-blue-2: #001029;
  --color-blue-3: #00add7;
  --color-blue-4: #0d63c7;
  --color-blue-5: #9bc0f7;
  --color-blue-6: #053272;
  --color-blue-7: #0679ff;
  --color-blue-transparent: rgba(15, 22, 30, 0.9);
  --color-red: #ff393c;
  --color-green: #74d2a5;
  --color-green-1: #81f4bc;
  --color-green-2: #173742;
  /* Gradients */
  --gradient-white: linear-gradient(to left, transparent, var(--color-white));
  /* Borders */
  --border-black: 1px solid var(--color-black);
  --border-blue: 1px solid var(--color-blue);
  --border-blue-2: 1px solid var(--color-blue-2);
  --border-blue-3: 1px solid var(--color-blue-3);
  --border-blue-3-bold: 1.5px solid var(--color-blue-3);
  --border-green: 1.5px solid var(--color-green);
  --border-blue-5: 1px solid var(--color-blue-5);
  --border-blue-6: 1px solid var(--color-blue-6);
  --border-blue-6-bold: 2px solid var(--color-blue-6);
  --border-red: 1px solid var(--color-red);
  --border-white: 1px solid var(--color-white);
  /* Fonts */
  --font-pt: "PTRootUI";
  --font-inter: "Inter";
  --font-size-xxl: 24px;
  --font-size-xl: 20px;
  --font-size-l: 18px;
  --font-size-m: 16px;
  --font-size-s: 14px;
  --font-size-xs: 12px;
  --font-size-xxs: 10px;
  --font-size-h1: 64px;
  --font-size-h2: 40px;
  --font-size-h3: 30px;
  --font-size-h4: 24px;
  --font-size-h5: 20px;
  --font-size-h6: 16px;
  --line-height-xl: 32px;
  --line-height-l: 28px;
  --line-height-m: 24px;
  --line-height-s: 20px;
  --line-height-xs: 18px;
  --line-height-xxs: 16px;
  --line-height-h1: 74px;
  --line-height-h2: 40px;
  --line-height-h3: 36px;
  --line-height-h4: 28px;
  --line-height-h5: 24px;
  --line-height-h6: 20px;
  --font-weight-bold: 700;
  --font-weight-semi-bold: 600;
  --font-weight-medium: 500;
  --font-weight-regular: 400;
  --letter-spacing-m: 0%;
  --letter-spacing-s: -10%;
}
@media screen and (max-width: 900px) {
  :root {
    --font-size-h1: 36px;
    --font-size-h2: 30px;
    --font-size-h3: 24px;
    --font-size-h4: 22px;
    --font-size-h5: 19px;
    --line-height-h1: 36px;
    --line-height-h2: 34px;
    --line-height-h3: 28px;
    --line-height-h4: 26px;
    --line-height-h5: 23px;
  }
}
:root {
  /* z-indexes */
  --z-index-anchors: 50;
  --z-index-header: 51;
  --z-index-popup: 100;
  --z-index-styles-debugger: 1000;
  /* Transitions */
  --duration-slow: 0.4s;
  --duration: 0.2s;
  --easings: ease-in-out;
  --transition-slow: var(--duration-slow) var(--easings);
  --transition: var(--duration) var(--easings);
}

*,
*::before,
*::after {
  box-sizing: border-box;
  outline: none;
}

html,
body {
  scroll-padding-top: 140px;
  scroll-behavior: smooth;
  min-height: 320px;
  min-width: 320px;
  background-color: var(--color-white);
}
@media screen and (max-width: 900px) {
  html,
  body {
    scroll-padding-top: 80px;
  }
}

html {
  scroll-behavior: smooth;
}

body._no-scroll {
  overflow: hidden;
}

html,
body,
input,
select,
button,
textarea {
  font-family: var(--font-inter), sans-serif;
  color: var(--color-blue-2);
  font-size: var(--font-size-m);
  line-height: var(--line-height-m);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-m);
}

input,
button,
select,
textarea {
  padding: 0;
  margin: 0;
  font-size: var(--font-size-m);
  line-height: var(--line-height-m);
  border: none;
  background: none;
}

input,
select,
textarea {
  width: 100%;
}

select {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}

button:not(:disabled) {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
}

i,
em {
  font-style: italic;
}

b,
strong {
  font-weight: var(--font-weight-bold);
}

a {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

svg,
img {
  display: block;
}

.h1,
h1 {
  font-size: var(--font-size-h1);
  line-height: var(--line-height-h1);
  scroll-margin-top: 140px;
}

.h2,
h2 {
  font-size: var(--font-size-h2);
  line-height: var(--line-height-h2);
  scroll-margin-top: 140px;
}

.h3,
h3 {
  font-size: var(--font-size-h3);
  line-height: var(--line-height-h3);
  scroll-margin-top: 140px;
}

.h4,
h4 {
  font-size: var(--font-size-h4);
  line-height: var(--line-height-h4);
  scroll-margin-top: 140px;
}

.h5,
h5 {
  font-size: var(--font-size-h5);
  line-height: var(--line-height-h5);
  scroll-margin-top: 140px;
}

.h6,
h6 {
  font-size: var(--font-size-h6);
  line-height: var(--line-height-h6);
  scroll-margin-top: 140px;
}

.h1,
h1 {
  font-family: var(--font-pt), sans-serif;
}

.h2,
h2 {
  font-family: var(--font-pt), sans-serif;
}

.h3,
h3 {
  font-family: var(--font-pt), sans-serif;
}

.h4,
h4 {
  font-family: var(--font-pt), sans-serif;
}

.h5,
h5 {
  font-family: var(--font-pt), sans-serif;
}

.h3,
h3 {
  font-weight: var(--font-weight-medium);
}

.h4,
h4 {
  font-weight: var(--font-weight-medium);
}

.h2,
h2 {
  max-width: 844px;
}
.h2._margin,
h2._margin {
  margin-bottom: 48px;
}
@media screen and (max-width: 900px) {
  .h2._margin,
  h2._margin {
    margin-bottom: 40px;
  }
}

.h3,
h3 {
  max-width: 578px;
}
.h3._margin,
h3._margin {
  margin-bottom: 24px;
}

.h5,
h5 {
  font-weight: var(--font-weight-bold);
}

.h6,
h6 {
  font-weight: var(--font-weight-semi-bold);
}

p._size-s {
  font-size: var(--font-size-xs);
  line-height: var(--line-height-xxs);
}
p._size-l {
  font-size: var(--font-size-l);
  line-height: var(--line-height-l);
}
@media screen and (max-width: 900px) {
  p._size-l {
    font-size: var(--font-size-m);
    line-height: var(--line-height-m);
  }
}
p._size-xl {
  font-size: var(--font-size-xxl);
  line-height: var(--line-height-xl);
}
@media screen and (max-width: 900px) {
  p._size-xl {
    font-size: var(--font-size-xl);
    line-height: var(--line-height-m);
  }
}

hr {
  width: 100%;
  height: 1px;
  margin: 0;
  padding: 0;
  border: none;
}
hr._color-blue {
  background-color: var(--color-blue-5);
}
hr._color-white {
  background-color: var(--color-white);
}
hr._color-dark-green {
  background-color: var(--color-green-2);
}

@media screen and (max-width: 900px) {
  .mobile-hide {
    display: none !important;
  }
}

@media screen and (min-width: 901px) {
  .desktop-hide {
    display: none !important;
  }
}

@media screen and (max-width: 1100px) {
  .mobile-header-hide {
    display: none !important;
  }
}

@media screen and (min-width: 1101px) {
  .desktop-header-hide {
    display: none !important;
  }
}

.swiper {
  --swiper-theme-color: var(--color-green);
  --swiper-pagination-bullet-horizontal-gap: 8px;
  --swiper-pagination-bullet-size: 12px;
  --swiper-pagination-bullet-inactive-color: var(--color-white);
  --swiper-pagination-bullet-inactive-opacity: 1;
}
.swiper .swiper-pagination {
  width: auto;
  position: static;
}
.swiper .swiper-pagination-bullet {
  border: var(--border-green);
  background-color: transparent;
  transition: opacity var(--transition), border-color var(--transition), background-color var(--transition);
}
@media (hover: hover) {
  .swiper .swiper-pagination-bullet:hover:not(.swiper-pagination-bullet-active) {
    border-color: var(--color-green-1);
    background-color: var(--color-green-1);
  }
}
.swiper .swiper-pagination-bullet-active {
  background-color: var(--color-green);
}