.navigation {
  display: flex;
  gap: 30px;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .navigation {
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
  }
}
.navigation__item {
  position: relative;
}
.navigation__item--active .navigation__link span {
  transform: rotate(180deg);
}
.navigation__link {
  color: #384050;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .navigation__link {
    font-size: 18px;
    line-height: 27px;
    justify-content: flex-start;
  }
}
.navigation__link span {
  font-size: 16px;
  color: #448fff;
  font-weight: 500;
  transition: 0.38s ease-in-out;
}
.navigation__dropdown {
  padding-top: 28px;
  position: absolute;
  display: none;
  animation-duration: 0.38s;
  animation-fill-mode: backwards;
  animation-name: animate-fade;
  animation-timing-function: ease-in-out;
  z-index: 11;
  left: -15px;
}
.navigation__dropdown--open {
  opacity: 1;
  visibility: visible;
}
.navigation__dropdown--flex {
  display: flex;
}
@media (max-width: 992px) {
  .navigation__dropdown {
    position: static;
    padding-top: 10px;
    transition: 0.38s ease-in-out;
  }
}
.navigation__dropdown-list {
  background-color: #f1f4f6;
  border: 1px solid;
  border-color: #d8dfe4;
  border-radius: 10px;
  padding: 16px;
  width: max-content;
  color: #384050;
  font-size: 14px;
  font-weight: 400;
  line-height: 16.41px;
  text-align: left;
  gap: 10px;
  display: flex;
  flex-direction: column;
}
@media (max-width: 992px) {
  .navigation__dropdown-list {
    width: 100%;
    background-color: transparent;
    border: none;
    font-size: 15px;
    line-height: 22px;
    padding: 0;
    color: #606773;
  }
}
@media (hover: hover) {
  .navigation__item:hover .navigation__dropdown {
    display: block;
  }
}
@media (hover: hover) {
  .navigation__dropdown:hover {
    display: block;
  }
}
.SearchForm {
  color: #384050;
  width: clamp(15.625rem, 79.618vw + -35.231rem, 31.25rem);
  font-weight: 400;
  line-height: 19px;
  text-align: left;
  display: flex;
  padding: 16px;
  border-radius: 10px;
  justify-content: space-between;
  background-color: #f1f4f6;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.SearchForm--full {
  width: 100%;
}
.SearchForm::placeholder {
  color: #999fae;
}
@media (max-width: 992px) {
  .SearchForm {
    display: none;
  }
  .SearchForm--full {
    display: flex;
  }
}
.SearchForm input {
  background-color: #f1f4f6;
  width: 98%;
}
.SearchForm__btn {
  color: #999fae;
  font-size: 20px;
}
.download {
  display: flex;
  gap: 10px;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #393185;
  color: #ffffff;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  text-align: left;
  white-space: nowrap;
}
@media (max-width: 992px) {
  .download {
    display: none;
  }
}
.download span {
  font-size: 20px;
}
.contacts {
  display: flex;
  flex-direction: row;
  gap: 18px;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  text-align: left;
  white-space: nowrap;
  color: #384050;
}
@media (max-width: 992px) {
  .contacts {
    flex-direction: column;
    gap: 15px;
  }
}
.contacts--ft {
  flex-direction: column;
}
@media (max-width: 992px) {
  .contacts--header {
    display: none;
  }
}
.contacts__link {
  color: #384050;
  display: flex;
  gap: 10px;
  align-items: center;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  text-align: left;
  font-weight: 600;
}
@media (max-width: 992px) {
  .contacts__link {
    gap: 15px;
    font-size: 18px;
    line-height: 21px;
  }
}
.contacts__link span {
  color: #448fff;
  font-size: 20px;
}
@media (max-width: 992px) {
  .contacts__link span {
    font-size: 24px;
  }
}
.contacts__link--ft {
  gap: 15px;
  font-size: 16px;
  font-weight: 600;
  line-height: 19px;
  text-align: left;
}
.contacts__link--ft span {
  font-size: 24px;
}
.contacts--ft {
  flex-direction: column-reverse;
}
.burger {
  display: none;
  position: relative;
  width: 35px;
  height: 20px;
}
.burger::before,
.burger::after {
  content: "";
  background: #393185;
  border-radius: 10px;
  position: absolute;
  width: 100%;
  height: 2px;
  right: 0;
  top: 10px;
  transition: 0.38s ease-in-out;
}
.burger::after {
  top: 20px;
}
.burger::before {
  width: 100%;
}
.burger span {
  content: "";
  background: #393185;
  border-radius: 10px;
  position: absolute;
  right: 0;
  width: 100%;
  height: 2px;
  transition: 0.38s ease-in-out;
}
.burger--open::before {
  opacity: 0;
}
.burger--open::after {
  width: 100%;
  transform: rotate(-45deg) translate(5px, -10px);
}
.burger--open span {
  width: 100%;
  transform: rotate(45deg) translate(4px, 9px);
}

@media (max-width: 992px) {
  .burger {
    display: block;
  }
}
.menu {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  background-color: #fff;
  position: fixed;
  left: -100%;
  top: 0px;
  width: 100%;
  height: 100vh;
  padding-bottom: 50px;
  padding-top: 90px;
  z-index: 20;
  transition: 0.38s ease-in-out;
  overflow: auto;
}
@media (max-width: 992px) {
  .menu {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .menu {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .menu {
    --container-width: 100%;
  }
}
.menu--open {
  left: 0;
}
.menu .SearchForm {
  display: flex;
  width: 100%;
}
.menu .download {
  display: flex;
  align-self: flex-start;
}
.menu__container {
  grid-area: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
}
.menu__container-top {
  display: flex;
  flex-direction: column;
  gap: 25px;
}
.menu__container-bottom {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.menu__text {
  color: #999fae;
  font-size: 12px;
  line-height: 18px;
}

@media (max-width: 768px) {
  .menu__container {
    grid-area: full;
    padding-left: 16px;
    padding-right: 16px;
  }
}
.header {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .header {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .header {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .header {
    --container-width: 100%;
  }
}
@media (max-width: 992px) {
  .header {
    position: fixed;
    z-index: 21;
    width: 100%;
    background-color: #ffffff;
  }
}
.header__case {
  grid-area: center;
  display: flex;
  gap: 24px;
  flex-direction: column;
  padding-top: 24px;
  padding-bottom: clamp(1.875rem, 5.732vw + -1.787rem, 3rem);
}
@media (max-width: 992px) {
  .header__case {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
.header__wrapper {
  display: flex;
  flex-direction: row;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
}
.header__bottom {
  background-color: #f1f4f6;
  border-radius: 15px;
  display: flex;
  flex-direction: row;
  gap: 40px;
  justify-content: space-between;
  align-items: center;
  padding-left: 16px;
  padding-top: 18px;
  padding-bottom: 18px;
  padding-right: 16px;
}
@media (max-width: 992px) {
  .header__bottom {
    display: none;
  }
}
.header__logo {
  width: clamp(7.188rem, 20.701vw + -6.035rem, 11.25rem);
  height: clamp(3.125rem, 9.554vw + -2.978rem, 5rem);
  object-fit: contain;
}
.header__left {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: center;
}
.header__container {
  display: flex;
  flex-direction: row;
  gap: clamp(1.875rem, 3.185vw + -0.159rem, 2.5rem);
  justify-content: space-between;
  align-items: center;
}
.modal {
  display: none;
  background-color: #f1f4f6;
  border-radius: 30px;
  padding: clamp(1.25rem, 3.185vw + -0.784rem, 1.875rem);
  width: clamp(34.375rem, 15.924vw + 24.204rem, 37.5rem);
}
.modal__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 30px;
}
.modal__container .btn {
  width: 100%;
  text-align: center;
}
.modal__text {
  color: #606773;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: 1.5;
}

.fancybox__backdrop {
  background: rgba(56, 64, 80, 0.7);
}

.fancybox__content > .f-button.is-close-btn {
  width: 30px;
  height: 30px;
  top: 20px;
  right: 20px;
  opacity: 1;
}
.fancybox__content > .f-button.is-close-btn::after {
  content: url('data:image/svg+xml,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 10L20 20M10 20L20 10M28.5 15C28.5 22.4558 22.4558 28.5 15 28.5C7.54416 28.5 1.5 22.4558 1.5 15C1.5 7.54416 7.54416 1.5 15 1.5C22.4558 1.5 28.5 7.54416 28.5 15Z" stroke="%23999FAE" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"/></svg>');
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.f-button svg {
  display: none;
}

@media (max-width: 768px) {
  .is-compact .fancybox__content > .f-button.is-close-btn {
    top: 15px;
  }
  .f-button {
    background: transparent;
  }
}
.scroll-to-top {
  width: 64px;
  height: 64px;
  padding: 16px;
  background-color: #393185;
  color: #ffffff;
  border-radius: 10px;
  position: fixed;
  font-size: 32px;
  bottom: 20px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 19;
}
.scroll-to-top span {
  vertical-align: top;
  font-size: 32px;
}

@media (max-width: 992px) {
  .scroll-to-top {
    width: 48px;
    height: 48px;
  }
  .scroll-to-top span {
    font-size: 24px;
  }
}
.footer {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: 24px;
}
@media (max-width: 992px) {
  .footer {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .footer {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .footer {
    --container-width: 100%;
  }
}
.footer__top {
  justify-content: space-between;
  display: flex;
  flex-direction: row;
  gap: clamp(5rem, 6.369vw + 0.932rem, 6.25rem);
}
.footer__left {
  justify-content: space-between;
  display: flex;
  flex-direction: row;
  gap: clamp(6.25rem, 94.586vw + -54.167rem, 24.813rem);
}
.footer__medium {
  justify-content: space-between;
  display: flex;
  flex-direction: row;
  padding-right: 95px;
  align-items: flex-end;
  padding-bottom: 15px;
}
.footer__medium--left {
  display: flex;
  flex-direction: column;
  color: #999fae;
  font-size: 12px;
  font-weight: 400;
  line-height: 15px;
  text-align: left;
}
.footer__branding {
  color: #999fae;
  font-size: 12px;
  font-weight: 400;
  line-height: 15px;
  text-align: left;
  display: flex;
  padding-bottom: 23px;
  gap: clamp(0.5rem, 2.229vw + -0.924rem, 0.938rem);
}
.footer__container {
  display: flex;
  flex-direction: column;
  border-radius: 30px;
  background-color: #f1f4f6;
  grid-area: center;
  padding-top: 40px;
  padding-bottom: clamp(1.25rem, 3.185vw + -0.784rem, 1.875rem);
  grid-area: center;
  padding: 30px;
}
.footer__bottom {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.footer__nav {
  display: flex;
  gap: clamp(3.125rem, 3.185vw + 1.091rem, 3.75rem);
}
.footer__menu {
  width: clamp(9.063rem, 4.777vw + 6.011rem, 10rem);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  text-align: left;
  color: #384050;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.footer__text {
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  text-align: left;
  color: #999fae;
  font-size: clamp(0.75rem, 0.637vw + 0.343rem, 0.875rem);
  line-height: clamp(1.375rem, 0.637vw + 0.968rem, 1.5rem);
}
.footer__text--link {
  transition: color 0.38s ease-in-out;
}
.footer__text--link:hover {
  color: #448fff;
}
.footer__text--mb {
  margin-bottom: clamp(0.625rem, 9.554vw + -5.478rem, 2.5rem);
}
.footer__logo {
  width: 160px;
  height: 72px;
  object-fit: contain;
}
.footer__list {
  display: flex;
  gap: clamp(0.625rem, 9.554vw + -5.478rem, 2.5rem);
}
.footer__list-link {
  font-size: clamp(0.875rem, 0vw + 0.875rem, 0.875rem);
  line-height: clamp(1.375rem, 1.274vw + 0.561rem, 1.625rem);
  transition: color 0.38s ease-in-out;
}
.footer__contacts {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
}
.footer__contacts-links {
  font-size: 20px;
  display: flex;
  gap: clamp(1.875rem, 9.554vw + -4.228rem, 3.75rem);
  margin-bottom: clamp(1.563rem, 7.325vw + -3.116rem, 3rem);
}
.footer__contacts-adress {
  width: 80%;
  text-align: right;
  font-size: clamp(0.875rem, 0.637vw + 0.468rem, 1rem);
  line-height: clamp(1.375rem, 1.274vw + 0.561rem, 1.625rem);
  margin-bottom: clamp(0.938rem, 5.414vw + -2.521rem, 2rem);
}
.footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.footer__bottom-box {
  display: flex;
  align-items: center;
  gap: clamp(8.438rem, 36.624vw + -14.956rem, 15.625rem);
}
.footer__develop {
  display: flex;
  align-items: center;
  gap: 10px;
}
@media (max-width: 992px) {
  .footer__top {
    flex-direction: column;
    gap: 30px;
    padding-bottom: 30px;
  }
  .footer__left {
    flex-direction: column;
    gap: 30px;
  }
  .footer__medium {
    flex-direction: column-reverse;
    gap: 30px;
    padding-right: 0px;
    align-items: flex-start;
  }
  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}
@media (max-width: 576px) {
  .footer {
    padding-bottom: 0;
  }
  .footer__container {
    border-radius: 0;
    grid-area: full;
    padding: 20px;
  }
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

input,
textarea {
  outline: none;
}

html {
  height: 100%;
  scroll-behavior: smooth;
}

@font-face {
  font-family: "Roboto Flex";
  src: url("../fonts/RobotoFlex-VariableFont.ttf") format("truetype-variations");
  font-weight: 100 900;
}
body {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  font-family: "Roboto Flex";
}

.section {
  padding-bottom: clamp(4.063rem, 9.554vw + -2.04rem, 5.938rem);
}

.textError {
  font-size: 16px;
  line-height: 1.2;
  text-align: left;
}
.social {
  display: flex;
  flex-direction: row;
  gap: 10px;
  justify-content: start;
  align-items: center;
  text-align: left;
  color: #606773;
  font-size: 16px;
  font-weight: 400;
  line-height: 16px;
}
@media (max-width: 992px) {
  .social {
    font-size: 16px;
    line-height: 20px;
  }
}
.social span {
  color: #999fae;
  font-size: 24px;
}
.btn {
  display: block;
  position: relative;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: clamp(1.25rem, 3.822vw + -1.191rem, 2rem);
  padding-right: clamp(1.25rem, 3.822vw + -1.191rem, 2rem);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  background-color: #448fff;
  color: #ffffff;
  border-radius: 10px;
  text-align: center;
  width: fit-content;
  z-index: 1;
  transition: all 0.38s ease-in-out;
  padding: 16px 32px 16px 32px;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  text-align: left;
}
@media (max-width: 992px) {
  .btn--full {
    width: 100%;
    height: fit-content;
    text-align: center;
  }
}
.input {
  width: 100%;
  padding: 15px;
  border-radius: 10px;
  border: 1px solid #d8dfe4;
  font-family: "Roboto Flex";
  font-size: 16px;
  font-weight: 400;
  line-height: 1.1;
  color: #384050;
}
.input::placeholder {
  color: #999fae;
}
.input--checkbox {
  padding: 0;
  appearance: none;
  border-radius: 5px;
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.38s ease-in-out;
  background-color: #ffffff;
  border: 1px solid #d8dfe4;
}
.input--checkbox::before {
  font-size: 7px;
  color: #ffffff;
}
.input--checkbox:checked {
  border: 1px solid #448fff;
  background-color: #448fff;
}
.input--textarea {
  resize: none;
  height: clamp(6.25rem, 8.28vw + 0.961rem, 7.875rem);
}
.input--textarea::-webkit-scrollbar {
  width: 10px;
}
.input--textarea::-webkit-scrollbar-track {
  background: #ffffff;
  border-radius: 5px;
}
.input--textarea::-webkit-scrollbar-thumb {
  background-color: #448fff;
  border-radius: 5px;
  border: 3px solid #ffffff;
}
.form {
  display: flex;
  row-gap: 30px;
  column-gap: 25px;
  flex-wrap: wrap;
  width: 80%;
}
.form--column {
  width: 100%;
  flex-direction: column;
}
.form--column .form__input {
  width: 100%;
}
@media (max-width: 992px) {
  .form {
    width: 100%;
  }
}
.form__input {
  width: calc(29% - 5px);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.form__input label {
  color: #384050;
  font-size: clamp(0.875rem, 0.637vw + 0.468rem, 1rem);
  font-weight: 600;
  line-height: 1.1;
  text-align: left;
}
@media (max-width: 992px) {
  .form__input {
    width: 100%;
  }
  .form__input label {
    font-size: 16px;
  }
}
.form__wrapper {
  display: flex;
  align-items: center;
  gap: 15px;
}
.form__text {
  width: 75%;
  text-align: left;
  font-size: clamp(0.75rem, 0.637vw + 0.343rem, 0.875rem);
  line-height: 1.2;
  color: #606773;
}
.form__text a {
  color: #384050;
  position: relative;
}
.form__text a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #384050;
  transition: 0.38s ease-in-out;
}
@media (max-width: 992px) {
  .form__text {
    width: 80%;
  }
}
.title {
  color: #384050;
  font-size: clamp(2.188rem, 4.14vw + -0.457rem, 3rem);
  font-weight: 700;
  line-height: 41px;
}
@media (max-width: 992px) {
  .title {
    font-size: 32px;
    line-height: 30px;
  }
}
.mainTitle {
  color: #384050;
  text-align: left;
  font-size: clamp(3.438rem, 2.866vw + 1.607rem, 4rem);
  font-weight: 700;
  line-height: 54px;
}
@media (max-width: 992px) {
  .mainTitle {
    font-size: 42px;
    line-height: 1.1;
  }
}
.text {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .text {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .text {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .text {
    --container-width: 100%;
  }
}
.text--small {
  padding-bottom: 48px;
}
.text__container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: clamp(2.125rem, 4.459vw + -0.723rem, 3rem);
  grid-area: center;
}
@media (max-width: 576px) {
  .text__container {
    align-items: center;
  }
}
.text__block {
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: #606773;
  font-size: 18px;
  font-weight: 400;
  line-height: 27px;
  text-align: left;
}
.certificates {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(7.5rem, 8.28vw + 2.211rem, 9.125rem);
}
@media (max-width: 992px) {
  .certificates {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .certificates {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .certificates {
    --container-width: 100%;
  }
}
.certificates__container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 48px;
  grid-area: center;
}
.certificates__top {
  display: inline-flex;
  justify-content: space-between;
  align-items: baseline;
}
.certificates__slide {
  width: 18.5%;
  background-color: #f1f4f6;
  padding: 15px;
  border: 1px solid #d8dfe4;
  border-radius: 15px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.certificates__image {
  border-radius: 10px;
  object-fit: cover;
}
.certificates__buttons {
  display: flex;
  gap: 10px;
}
.certificates__buttons-btnNext,
.certificates__buttons-btnPrev {
  font-size: 32px;
  color: #448fff;
}
.certificates__buttons-btnNext:hover,
.certificates__buttons-btnPrev:hover {
  cursor: pointer;
}
.certificates__buttons-btnPrev {
  transform: rotate(180deg);
}
.certificates__pagination {
  z-index: 2;
}
.certificates__pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: -68px;
}
.certificates__pagination.swiper-pagination-horizontal.swiper-pagination-bullets
  .swiper-pagination-bullet {
  margin: 0 4px;
}
.certificates__pagination .swiper-pagination-bullet {
  opacity: 1;
  background-color: #d8dfe4;
}
.certificates__pagination .swiper-pagination-bullet-active {
  background-color: #448fff;
}
.feedback {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .feedback {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .feedback {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .feedback {
    --container-width: 100%;
  }
}
.feedback__container {
  position: relative;
  display: flex;
  flex-direction: column;
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
  border-radius: 30px;
  background-color: #f1f4f6;
  grid-area: center;
  padding: clamp(1.563rem, 1.592vw + 0.545rem, 1.875rem);
}
@media (max-width: 992px) {
  .feedback__container {
    gap: 30px;
    text-align: center;
  }
}
.feedback__handphone {
  position: absolute;
  right: 30px;
  bottom: 0;
  object-fit: cover;
  width: clamp(15rem, 25.796vw + -1.477rem, 20.063rem);
  height: clamp(22.5rem, 28.662vw + 4.192rem, 28.125rem);
}
@media (max-width: 992px) {
  .feedback__handphone {
    display: none;
  }
}
.feedback__wrapper {
  display: flex;
  flex-direction: column;
  gap: clamp(1.563rem, 1.592vw + 0.545rem, 1.875rem);
}
.feedback__text {
  max-width: clamp(42.5rem, 12.739vw + 34.363rem, 45rem);
  font-size: 18px;
  font-weight: 400;
  line-height: 27px;
  color: #606773;
}
@media (max-width: 992px) {
  .feedback__text {
    width: 100%;
  }
}
.heroCard {
  width: 30%;
  border-radius: 15px;
  border: 1px solid #d8dfe4;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  background-color: rgba(241, 244, 246, 0.8509803922);
  backdrop-filter: blur(5px);
}
@media (max-width: 768px) {
  .heroCard {
    width: 100%;
  }
}
.heroCard__title {
  color: #448fff;
  font-size: clamp(2rem, 5.096vw + -1.255rem, 3rem);
  font-weight: 700;
  line-height: 0.8;
}
.heroCard__text {
  color: #606773;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  font-weight: 400;
  line-height: 1.1;
}
.hero {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .hero {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .hero {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .hero {
    --container-width: 100%;
  }
}
@media (max-width: 992px) {
  .hero {
    margin-top: 70px;
  }
}
@media (max-width: 992px) {
  .hero--about {
    margin-top: 0px;
  }
}
.hero__case {
  grid-area: center;
}
@media (max-width: 576px) {
  .hero__case {
    grid-area: full;
  }
}
.hero__container {
  display: grid;
  grid-area: 1/1/-1/-1;
}
.hero__list {
  margin-top: -50px;
  align-self: end;
  justify-content: center;
  display: flex;
  gap: 15px;
  z-index: 6;
}
@media (max-width: 768px) {
  .hero__list {
    flex-direction: column;
    gap: 10px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
.hero__image {
  grid-area: 1/1/-1/-1;
  border-radius: 30px;
  height: 0;
  min-height: 100%;
  width: 100%;
  z-index: -1;
  object-fit: cover;
  filter: contrast(0.65) brightness(0.7);
}
@media (max-width: 576px) {
  .hero__image {
    border-radius: 0;
  }
}
.hero__wrapper {
  grid-area: 1/1/-1/-1;
  max-width: 540px;
  display: flex;
  flex-direction: column;
  gap: 60px;
  padding-left: 60px;
  padding-top: 100px;
  padding-bottom: 100px;
  z-index: 9;
}
@media (max-width: 992px) {
  .hero__wrapper {
    padding-top: 64px;
    padding-left: 20px;
    padding-right: 20px;
    max-width: 100%;
    gap: 50px;
  }
}
@media (max-width: 768px) {
  .hero__wrapper {
    padding-bottom: 150px;
  }
}
.hero__top {
  display: flex;
  flex-direction: column;
  gap: 30px;
  z-index: 9;
}
.hero__title {
  color: #ffffff;
  font-size: clamp(3.438rem, 2.866vw + 1.607rem, 4rem);
  font-weight: 700;
  line-height: 54.4px;
}
@media (max-width: 992px) {
  .hero__title {
    font-size: 42px;
    line-height: 35px;
  }
}
.hero__description {
  color: #d8dfe4;
  font-size: 24px;
  font-weight: 400;
  line-height: 20.4px;
}
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 33%;
  padding: 10px;
  gap: 16px;
  border-radius: 15px;
  border: 1px solid #d8dfe4;
  text-align: left;
}
.card__wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 10px;
  padding-bottom: 10px;
}
.card__img {
  border-radius: 10px;
  object-fit: cover;
  width: 390px;
}
.card__date {
  color: #999fae;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
}
.card__name {
  color: #384050;
  font-size: 18px;
  font-weight: 600;
  line-height: 21px;
  width: 90%;
}
.card__description {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #606773;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  width: 90%;
}
.card__link {
  position: absolute;
  bottom: 20px;
  right: 20px;
}
@media (max-width: 992px) {
  .card {
    width: 45%;
  }
}
@media (max-width: 576px) {
  .card {
    width: 99%;
  }
}
.factories {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .factories {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .factories {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .factories {
    --container-width: 100%;
  }
}
.factories__container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 5.732vw + -1.787rem, 3rem);
  background-color: #ffffff;
  grid-area: center;
}
@media (max-width: 768px) {
  .factories__container {
    align-items: center;
  }
}
.factories__list {
  display: flex;
  gap: clamp(1.5rem, 1.911vw + 0.279rem, 1.875rem);
  justify-content: center;
}
@media (max-width: 992px) {
  .factories__list {
    flex-wrap: wrap;
  }
}

@media (max-width: 576px) {
  .factories__list {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }
}
.breadcrumb {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
@media (max-width: 992px) {
  .breadcrumb {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .breadcrumb {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .breadcrumb {
    --container-width: 100%;
  }
}
.breadcrumb__wrapper {
  color: #999fae;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  text-align: left;
  grid-area: center;
}
.breadcrumb__wrapper span {
  padding-right: 13px;
}
.breadcrumb_last {
  color: #606773;
}
@media (max-width: 992px) {
  .breadcrumb {
    padding-top: 100px;
  }
}
.contact {
  display: flex;
  align-items: center;
  gap: 15px;
}
.contact--big .contact__text {
  font-size: clamp(1.25rem, 1.274vw + 0.436rem, 1.5rem);
  font-weight: 700;
}
.contact__icon {
  color: #448fff;
  font-size: 24px;
}
.contact__text {
  font-weight: 600;
  font-size: 16px;
  line-height: 1.1;
  color: #384050;
  transition: color 0.38s ease-in-out;
}
.contactSection {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .contactSection {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .contactSection {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .contactSection {
    --container-width: 100%;
  }
}
.contactSection__container {
  grid-area: center;
  display: flex;
  justify-content: space-between;
}
.contactSection__info {
  width: 40%;
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.contactSection__wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.contactSection__map {
  width: 57%;
  height: clamp(21.25rem, 31.847vw + 0.908rem, 27.5rem);
}
.contactSection__map ymaps,
.contactSection__map iframe {
  border-radius: 20px;
  /* width: 100%;
  height: 100%; */
}
.contactSection__map .ymaps3x0--map-copyrights__container {
  display: none !important;
}
.contactSection__text {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  color: #999fae;
  font-size: 16px;
  line-height: 24px;
}

@media (max-width: 992px) {
  .contactSection__container {
    flex-direction: column;
    gap: 30px;
  }
  .contactSection__info {
    width: 100%;
  }
  .contactSection__map {
    width: 100%;
    height: 300px;
  }
}
.about {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .about {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .about {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .about {
    --container-width: 100%;
  }
}
@media (max-width: 576px) {
  .about .btn {
    width: 100%;
    text-align: center;
  }
}
.about__container {
  grid-area: center;
  position: relative;
  display: flex;
  padding: 15px;
  gap: 60px;
  border-radius: 30px;
  background-color: #f1f4f6;
}
@media (max-width: 992px) {
  .about__container {
    flex-direction: column;
    gap: 25px;
  }
}
.about__photo {
  border-radius: 15px;
  object-fit: cover;
  width: clamp(31.25rem, 41.401vw + 4.805rem, 39.375rem);
  height: 100%;
}
@media (max-width: 992px) {
  .about__photo {
    width: 100%;
    height: 350px;
  }
}
@media (max-width: 576px) {
  .about__photo {
    height: 250px;
  }
}
.about__wrapper {
  display: flex;
  flex-direction: column;
  gap: 48px;
  padding-top: 42px;
  padding-bottom: 42px;
}
@media (max-width: 992px) {
  .about__wrapper {
    padding-top: 0;
    padding-bottom: 10px;
    gap: 25px;
  }
}
.about__text {
  font-size: 18px;
  font-weight: 400;
  line-height: 27px;
  text-align: left;
  color: #606773;
}
@media (max-width: 992px) {
  .about__text {
    font-size: 16px;
  }
}
.about__title {
  font-size: 24px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  color: #606773;
}
@media (max-width: 992px) {
  .about__title {
    font-size: 20px;
    line-height: 20px;
  }
}
.about__block {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.benefits {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .benefits {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .benefits {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .benefits {
    --container-width: 100%;
  }
}
.benefits__container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 32px;
  grid-area: center;
  align-content: center;
  justify-content: center;
}
.benefits__item {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
}
.benefits__circle {
  border: 1px solid #d8dfe4;
  background-color: #f1f4f6;
  width: clamp(6.25rem, 12.739vw + -1.887rem, 8.75rem);
  height: clamp(6.25rem, 12.739vw + -1.887rem, 8.75rem);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.benefits__description {
  max-width: 230px;
  color: #384050;
  font-size: 16px;
  font-weight: 600;
  line-height: 19px;
  text-align: center;
}
.benefits__image {
  width: clamp(3.125rem, 4.459vw + 0.277rem, 4rem);
  height: clamp(3.125rem, 4.459vw + 0.277rem, 4rem);
  object-fit: contain;
}

@media (max-width: 992px) {
  .benefits__circle {
    width: 80px;
    height: 80px;
  }
  .benefits__item {
    gap: 15px;
  }
  .benefits__image {
    width: 40px;
    height: 40px;
  }
  .benefits__description {
    font-size: 14px;
    line-height: 17px;
    max-width: 160px;
    word-break: break-word;
  }
}
@media (max-width: 576px) {
  .benefits__container {
    grid-area: full;
  }
}
.documents {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .documents {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .documents {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .documents {
    --container-width: 100%;
  }
}
.documents__container {
  display: flex;
  flex-direction: column;
  gap: clamp(2.188rem, 4.14vw + -0.457rem, 3rem);
  background-color: #ffffff;
  grid-area: center;
}
@media (max-width: 576px) {
  .documents__container {
    align-items: center;
  }
}
.documents__wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: clamp(0.625rem, 1.592vw + -0.392rem, 0.938rem);
}
.documents__item {
  width: 32%;
  background-color: #f1f4f6;
  flex-direction: row;
  padding: 15px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
@media (max-width: 992px) {
  .documents__item {
    width: 49%;
  }
}
@media (max-width: 576px) {
  .documents__item {
    width: 98%;
  }
}
.documents__item--title {
  color: #384050;
  font-size: 16px;
  font-weight: 600;
  line-height: 19px;
  text-align: left;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.documents__item--file {
  font-size: 32px;
  color: #448fff;
}
.documents__item--arrow {
  font-size: 20px;
  color: #999fae;
}
.gallery {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.gallery img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.gallery__modal {
  border: 1px solid #d8dfe4;
  width: clamp(28.75rem, 50.955vw + -3.798rem, 38.75rem);
  height: clamp(28.75rem, 50.955vw + -3.798rem, 38.75rem);
  border-radius: 15px;
}
@media (max-width: 576px) {
  .gallery__modal {
    width: 100%;
    height: 350px;
  }
}
.gallery__modal img {
  border-radius: 15px;
}
.gallery__wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.gallery__image {
  cursor: pointer;
  width: clamp(3.313rem, 6.369vw + -0.756rem, 4.563rem);
  height: clamp(3.313rem, 6.369vw + -0.756rem, 4.563rem);
  border-radius: 5px;
  border: 1px solid #d8dfe4;
  padding: 5px;
  transition: 0.38s ease-in-out;
}
.gallery__image--active {
  border-color: #448fff;
}
.gallery__image img {
  border-radius: 5px;
}
.equipment {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
@media (max-width: 992px) {
  .equipment {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .equipment {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .equipment {
    --container-width: 100%;
  }
}
.equipment__container {
  grid-area: center;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
@media (max-width: 992px) {
  .equipment__container {
    grid-template-columns: 1fr;
  }
}
.equipment__description {
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.equipment__description-text {
  color: #606773;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: 1.5;
  display: flex;
  flex-direction: column;
  gap: clamp(0.625rem, 3.185vw + -1.409rem, 1.25rem);
}
@media (max-width: 992px) {
  .equipment__description {
    order: -1;
  }
}
.tablePhoto {
  overflow: auto;
}
.tablePhoto::-webkit-scrollbar {
  width: 13px;
}
.tablePhoto::-webkit-scrollbar-track {
  background: #ffffff;
}
.tablePhoto::-webkit-scrollbar-thumb {
  background-color: #448fff;
  border-radius: 10px;
  border: 5px solid #ffffff;
}
.tablePhoto img {
  width: 100%;
  min-width: 1306px;
  height: auto;
  object-fit: contain;
}
.characteristics {
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.characteristics__wrapper {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.characteristics__item {
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: 1.5;
  color: #606773;
}
.characteristics__item b,
.characteristics__item strong {
  font-weight: 700;
  color: #384050;
}
.characteristics__name {
  color: #384050;
  font-size: clamp(1.125rem, 1.274vw + 0.311rem, 1.375rem);
  font-weight: 700;
  line-height: 1.5;
}
.characteristics__text {
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: 1.5;
  color: #384050;
}
.models {
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.models__item {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.models__name {
  background-color: #f1f4f6;
  padding: 15px;
  border-radius: 10px;
  color: #384050;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  font-weight: 700;
  line-height: 1.5;
}
.models__wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 992px) {
  .models__wrapper {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
}
@media (max-width: 576px) {
  .models__wrapper {
    grid-template-columns: 1fr;
  }
}
.models__list {
  display: flex;
  flex-direction: column;
  gap: clamp(0.625rem, 3.185vw + -1.409rem, 1.25rem);
  color: #606773;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: 1.5;
}
.models__list ul li {
  padding-left: 35px;
  position: relative;
}
.models__list ul li:before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #606773;
}
.tabs {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .tabs {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .tabs {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .tabs {
    --container-width: 100%;
  }
}
.tabs__container {
  grid-area: center;
}
.tabs__wrapper {
  display: flex;
  align-items: center;
  gap: clamp(1.875rem, 11.146vw + -5.245rem, 4.063rem);
  border-bottom: 1px solid #d8dfe4;
  margin-bottom: 25px;
}
.tabs__item {
  cursor: pointer;
  color: #384050;
  position: relative;
  padding-bottom: 15px;
  font-weight: 700;
  font-size: clamp(1.125rem, 1.274vw + 0.311rem, 1.375rem);
  line-height: 1.5;
}
.tabs__item--active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  height: 2px;
  width: 100%;
  background-color: #448fff;
}
.tabs__content {
  height: inherit;
}
.tabs__content-item {
  opacity: 0;
  transition: opacity 0.38s ease-in-out;
  display: none;
  height: inherit;
}
.tabs__content-item--active {
  display: block;
}
.tabs__content-item--opacity {
  opacity: 1;
}

@media (max-width: 992px) {
  .tabs__wrapper {
    overflow-y: hidden;
    overflow-x: scroll;
  }
  .tabs__item {
    white-space: nowrap;
  }
}
.error {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  height: 50vh;
  padding-top: clamp(4.063rem, 9.554vw + -2.04rem, 5.938rem);
  margin-bottom: clamp(5rem, 35.032vw + -17.377rem, 11.875rem);
}
@media (max-width: 992px) {
  .error {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .error {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .error {
    --container-width: 100%;
  }
}
.error__container {
  grid-area: center;
  display: flex;
  justify-content: space-between;
}
.error__info {
  width: 50%;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.error__title {
  font-size: clamp(3rem, 5.096vw + -0.255rem, 4rem);
  font-weight: 700;
  line-height: clamp(2.188rem, 6.369vw + -1.881rem, 3.438rem);
  color: #384050;
  width: 70%;
}
.error__text {
  width: 80%;
  color: #606773;
  font-size: 18px;
  line-height: 28px;
}
.error__icon {
  object-fit: contain;
  height: 270px;
  width: 49%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

@media (max-width: 992px) {
  .error {
    padding-top: 135px;
    height: auto;
  }
}
@media (max-width: 768px) {
  .error {
    padding-top: 110px;
  }
  .error__container {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 30px;
  }
  .error__info {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .error__icon {
    width: 100%;
  }
}
.newsCard {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 10px;
  gap: 16px;
  border-radius: 15px;
  border: 1px solid #d8dfe4;
  text-align: left;
}
.newsCard--between {
  justify-content: space-between;
}
.newsCard__wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 10px;
  padding-bottom: 10px;
}
.newsCard__wrapper--end {
  flex-direction: row;
  align-items: flex-end;
}
.newsCard__wrapper--end .newsCard__link {
  position: static;
}
.newsCard__img {
  border-radius: 10px;
  object-fit: contain;
  width: 100%;
  height: 220px;
}
.newsCard__date {
  color: #999fae;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
}
.newsCard__name {
  color: #384050;
  font-size: 18px;
  font-weight: 600;
  line-height: 21px;
  width: 80%;
}
.newsCard__description {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #606773;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  width: 90%;
}
@media (max-width: 992px) {
  .newsCard__description {
    -webkit-line-clamp: 5;
  }
}
.newsCard__link {
  position: absolute;
  bottom: 20px;
  right: 20px;
  font-size: 20px;
  color: #999fae;
}
.pageNavigation {
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1;
  justify-content: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  text-align: left;
  color: #606773;
}
@media (max-width: 576px) {
  .pageNavigation {
    gap: 8px;
  }
}
.pageNavigation__prev,
.pageNavigation__next {
  font-size: 20px;
  transition: color 0.38s ease-in-out;
  color: #448fff;
  cursor: pointer;
}
@media (hover: hover) {
  .pageNavigation__prev:hover,
  .pageNavigation__next:hover {
    color: #448fff;
  }
}
.pageNavigation__prev {
  transform: rotate(180deg);
}
:where(.pageNavigation a:not(.pageNavigation__prev, .pageNavigation__next)) {
  width: 24px;
  height: 24px;
  transition: all 0.38s ease-in-out;
  transition-property: color, border, background;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
}
@media (max-width: 576px) {
  :where(.pageNavigation a:not(.pageNavigation__prev, .pageNavigation__next)) {
    font-size: 14px;
    height: 35px;
    width: 35px;
  }
}
:where(
    .pageNavigation a:not(.pageNavigation__prev, .pageNavigation__next)
  ):hover {
  border-color: #448fff;
}
.pageNavigation .active {
  color: #448fff;
}
.catalog {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .catalog {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .catalog {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .catalog {
    --container-width: 100%;
  }
}
.catalog__container {
  grid-area: center;
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.catalog__description {
  display: flex;
  flex-direction: column;
  gap: clamp(0.625rem, 3.185vw + -1.409rem, 1.25rem);
  color: #606773;
  font-size: 18px;
  line-height: 1.5;
}
.catalog__wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
}
@media (max-width: 992px) {
  .catalog__wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .catalog__wrapper {
    grid-template-columns: 1fr;
  }
}
.newsBlock {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .newsBlock {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .newsBlock {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .newsBlock {
    --container-width: 100%;
  }
}
.newsBlock__container {
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 5.732vw + -1.787rem, 3rem);
  background-color: #ffffff;
  grid-area: center;
}
@media (max-width: 576px) {
  .newsBlock__container {
    align-items: center;
  }
}
.newsBlock__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media (max-width: 992px) {
  .newsBlock__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 576px) {
  .newsBlock__list {
    grid-template-columns: repeat(1, 1fr);
  }
}
.content {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .content {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .content {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .content {
    --container-width: 100%;
  }
}
.content__container {
  grid-area: center;
}
.content__container h1 {
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.content__container h2,
.content__container h3 {
  color: #384050;
  font-size: clamp(1.563rem, 2.229vw + 0.139rem, 2rem);
  font-weight: 700;
  line-height: 32px;
  text-align: left;
  margin-bottom: clamp(1.25rem, 1.592vw + 0.233rem, 1.563rem);
  margin-top: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.content__container p {
  color: #606773;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  font-weight: 400;
  line-height: 27px;
  text-align: left;
  margin-bottom: clamp(1.25rem, 1.592vw + 0.233rem, 1.563rem);
}
.content__container p span,
.content__container p b {
  color: #384050;
  font-weight: 700;
}
.content__container ul {
  color: #384050;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  font-weight: 600;
  line-height: 27px;
  text-align: left;
  list-style-type: disc;
  list-style-position: inside;
}
.content__container:last-child {
  margin-bottom: 0;
}
.content__image {
  object-fit: cover;
  border-radius: 30px;
  height: 525px;
  width: 100%;
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.content__date {
  color: #999fae;
  font-size: 18px;
  font-weight: 400;
  line-height: 27px;
  text-align: left;
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.link {
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  text-align: left;
  color: #448fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 15px;
}
.link span {
  font-size: 20px;
}
@media (max-width: 768px) {
  .link {
    display: none;
  }
}
.link--mobile {
  display: none;
}
@media (max-width: 768px) {
  .link--mobile {
    display: flex;
    justify-content: center;
  }
}
.titleLink {
  display: inline-flex;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .titleLink {
    justify-content: center;
  }
}
.news {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
  padding-bottom: clamp(5rem, 5.096vw + 1.745rem, 6rem);
}
@media (max-width: 992px) {
  .news {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .news {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .news {
    --container-width: 100%;
  }
}
.news__container {
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 5.732vw + -1.787rem, 3rem);
  background-color: #ffffff;
  grid-area: center;
}
@media (max-width: 576px) {
  .news__container {
    align-items: center;
  }
}
.news__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media (max-width: 992px) {
  .news__list {
    grid-template-columns: 1fr;
  }
}
.searchResult {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .searchResult {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .searchResult {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .searchResult {
    --container-width: 100%;
  }
}
.searchResult__container {
  grid-area: center;
}
.searchResult__wrapper {
  display: flex;
  flex-direction: column;
  gap: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.searchResult__text {
  margin-bottom: 25px;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: 1.5;
  color: #999fae;
}
.searchResult__text span {
  color: #384050;
}
.searchResult__link {
  border-radius: 20px;
  border: 1px solid #d8dfe4;
  padding: 25px;
  margin-bottom: 15px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.searchResult__link:last-child {
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
@media (hover: hover) {
  .searchResult__link:hover .searchResult__link-title {
    color: #448fff;
  }
}
.searchResult__link-title {
  font-size: 20px;
  font-weight: 700;
  line-height: 22px;
  color: #384050;
  transition: color 0.38s ease-in-out;
}
.searchResult__link-text {
  font-size: 14px;
  line-height: 1.4;
  color: #606773;
  -webkit-line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.geography {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .geography {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .geography {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .geography {
    --container-width: 100%;
  }
}
.geography__container {
  grid-area: right;
}
.geography__wrapper {
  margin-bottom: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
}
.geography__text {
  width: 17%;
  color: #606773;
  font-size: clamp(1rem, 0.637vw + 0.593rem, 1.125rem);
  line-height: clamp(1.5rem, 1.274vw + 0.686rem, 1.75rem);
}
.geography__content {
  display: flex;
  align-items: flex-start;
}
.geography__map {
  width: clamp(43.75rem, 121.019vw + -33.551rem, 67.5rem);
  position: relative;
  height: clamp(31.25rem, 73.248vw + -15.537rem, 45.625rem);
}
.geography__map-svg {
  position: absolute;
  left: 0;
  top: 0;
  object-fit: contain;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.geography__map-line {
  width: clamp(33.75rem, 84.713vw + -20.361rem, 50.375rem);
  height: clamp(16.875rem, 34.076vw + -4.891rem, 23.563rem);
  object-fit: contain;
  top: clamp(6.25rem, 19.108vw + -5.955rem, 10rem);
  right: clamp(2.5rem, 12.739vw + -5.637rem, 5rem);
  position: absolute;
  z-index: 1;
}
.geography__map-local {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 7px;
  position: absolute;
  min-width: 65px;
  max-width: 65px;
  z-index: 2;
  transform: translateY(0px);
  transition: 0.38s ease-in-out;
}
.geography__map-local:hover {
  transform: translateY(-5px);
}
.geography__map-local:hover .geography__map-city {
  opacity: 1;
}
.geography__map-local:hover .geography__map-wrapper {
  width: clamp(1.25rem, 4.777vw + -1.801rem, 2.188rem);
  height: clamp(1.25rem, 4.777vw + -1.801rem, 2.188rem);
}
.geography__map-local:hover .geography__map-circle {
  width: clamp(0.625rem, 1.592vw + -0.392rem, 0.938rem);
  height: clamp(0.625rem, 1.592vw + -0.392rem, 0.938rem);
}
.geography__map-local:first-of-type {
  top: clamp(11.875rem, 27.07vw + -5.416rem, 17.188rem);
  left: clamp(5.625rem, 22.293vw + -8.615rem, 10rem);
}
.geography__map-local:nth-of-type(2) {
  top: clamp(14.063rem, 33.439vw + -7.297rem, 20.625rem);
  left: clamp(8.438rem, 30.255vw + -10.888rem, 14.375rem);
}
.geography__map-local:nth-of-type(3) {
  top: clamp(17.188rem, 44.586vw + -11.292rem, 25.938rem);
  left: clamp(9.063rem, 31.847vw + -11.28rem, 15.313rem);
}
.geography__map-local:nth-of-type(4) {
  top: clamp(22.188rem, 54.14vw + -12.395rem, 32.813rem);
  left: clamp(8.625rem, 30.892vw + -11.107rem, 14.688rem);
}
.geography__map-local:nth-of-type(5) {
  top: clamp(16.875rem, 41.401vw + -9.57rem, 25rem);
  left: clamp(10.625rem, 36.624vw + -12.769rem, 17.813rem);
}
.geography__map-local:nth-of-type(6) {
  top: clamp(16.563rem, 39.809vw + -8.865rem, 24.375rem);
  left: clamp(13.75rem, 44.586vw + -14.729rem, 22.5rem);
}
.geography__map-local:nth-of-type(7) {
  top: clamp(15.625rem, 38.217vw + -8.786rem, 23.125rem);
  left: clamp(20rem, 60.51vw + -18.65rem, 31.875rem);
}
.geography__map-local:nth-of-type(8) {
  top: clamp(10.938rem, 27.07vw + -6.354rem, 16.25rem);
  left: clamp(23.125rem, 66.879vw + -19.594rem, 36.25rem);
}
.geography__map-local:nth-of-type(9) {
  top: clamp(6.25rem, 15.924vw + -3.921rem, 9.375rem);
  left: clamp(39.063rem, 106.688vw + -29.084rem, 60rem);
}
.geography__map-local:nth-of-type(10) {
  top: clamp(15rem, 38.217vw + -9.411rem, 22.5rem);
  left: clamp(28.75rem, 84.395vw + -25.157rem, 45.313rem);
}
.geography__map-local:nth-of-type(11) {
  top: clamp(13.438rem, 33.439vw + -7.922rem, 20rem);
  left: clamp(13.438rem, 42.994vw + -14.025rem, 21.875rem);
}
.geography__map-local:nth-of-type(12) {
  top: clamp(6.875rem, 15.924vw + -3.296rem, 10rem);
  left: clamp(17.5rem, 54.14vw + -17.082rem, 28.125rem);
}
.geography__map-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(0.938rem, 1.592vw + -0.08rem, 1.25rem);
  height: clamp(0.938rem, 1.592vw + -0.08rem, 1.25rem);
  transition: 0.38s ease-in-out;
}
.geography__map-circle {
  width: clamp(0.313rem, 0.955vw + -0.298rem, 0.5rem);
  height: clamp(0.313rem, 0.955vw + -0.298rem, 0.5rem);
  background-color: #448fff;
  border-radius: 50%;
  z-index: 2;
  transition: 0.38s ease-in-out;
}
.geography__map-blur {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(22, 143, 233, 0.2509803922);
  border-radius: 50%;
  z-index: 1;
  border: 2px solid #448fff;
}
.geography__map-city {
  padding: 5px 10px 5px 10px;
  border-radius: 5px;
  background-color: #ffffff;
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1019607843);
  z-index: 3;
  text-align: center;
  color: #606773;
  font-size: 12px;
  line-height: 20px;
  opacity: 0;
  transition: opacity 0.38s ease-in-out;
}

@media (max-width: 992px) {
  .geography__content {
    flex-direction: column;
    gap: 40px;
  }
  .geography__text {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .geography__container {
    grid-area: center;
    overflow: hidden;
  }
  .geography__map {
    width: 598px;
    height: 330px;
  }
  .geography__map-line {
    width: 350px;
    height: 300px;
    top: 10px;
    left: 140px;
  }
  .geography__map-local:first-of-type {
    left: 105px;
    top: 125px;
  }
  .geography__map-local:nth-of-type(2) {
    left: 135px;
    top: 150px;
  }
  .geography__map-local:nth-of-type(3) {
    left: 145px;
    top: 190px;
  }
  .geography__map-local:nth-of-type(4) {
    left: 140px;
    top: 235px;
  }
  .geography__map-local:nth-of-type(5) {
    left: 160px;
    top: 180px;
  }
  .geography__map-local:nth-of-type(6) {
    left: 190px;
    top: 175px;
  }
  .geography__map-local:nth-of-type(7) {
    left: 260px;
    top: 165px;
  }
  .geography__map-local:nth-of-type(8) {
    left: 290px;
    top: 120px;
  }
  .geography__map-local:nth-of-type(9) {
    left: 460px;
    top: 70px;
  }
  .geography__map-local:nth-of-type(10) {
    left: 350px;
    top: 160px;
  }
  .geography__map-local:nth-of-type(11) {
    left: 190px;
    top: 145px;
  }
  .geography__map-local:nth-of-type(12) {
    left: 233px;
    top: 75px;
  }
}
@media (max-width: 576px) {
  .geography__container {
    grid-area: full;
  }
  .geography__wrapper,
  .geography__text {
    padding-left: 16px;
    padding-right: 16px;
  }
  .geography__content {
    gap: 20px;
  }
  .geography__map {
    width: 800px;
    height: 539px;
    margin-left: -100px;
  }
  .geography__map-blur {
    border: 1px solid #448fff;
  }
  .geography__map-line {
    width: 600px;
    height: 250px;
    top: 125px;
    left: 100px;
  }
  .geography__map-local:first-of-type {
    left: 100px;
    top: 200px;
  }
  .geography__map-local:nth-of-type(2) {
    left: 145px;
    top: 240px;
  }
  .geography__map-local:nth-of-type(3) {
    left: 160px;
    top: 295px;
  }
  .geography__map-local:nth-of-type(4) {
    left: 150px;
    top: 365px;
  }
  .geography__map-local:nth-of-type(5) {
    left: 185px;
    top: 285px;
  }
  .geography__map-local:nth-of-type(6) {
    left: 230px;
    top: 280px;
  }
  .geography__map-local:nth-of-type(7) {
    left: 330px;
    top: 265px;
  }
  .geography__map-local:nth-of-type(8) {
    left: 380px;
    top: 190px;
  }
  .geography__map-local:nth-of-type(9) {
    display: none;
  }
  .geography__map-local:nth-of-type(10) {
    display: none;
  }
  .geography__map-local:nth-of-type(11) {
    left: 225px;
    top: 235px;
  }
  .geography__map-local:nth-of-type(12) {
    left: 295px;
    top: 120px;
  }
}
.products {
  --container-width: 1306px;
  display: grid;
  grid-template-columns: [full-start left-start] minmax(15px, 1fr) [right-start center-start] minmax(
      0,
      var(--container-width)
    ) [left-end center-end] minmax(15px, 1fr) [full-end right-end];
  grid-template-rows: [full-start left-start center-start right-start] auto [full-end left-end center-end right-end];
}
@media (max-width: 992px) {
  .products {
    --container-width: 920px;
  }
}
@media (max-width: 768px) {
  .products {
    --container-width: 640px;
  }
}
@media (max-width: 576px) {
  .products {
    --container-width: 100%;
  }
}
.products__container {
  grid-area: center;
  display: flex;
  flex-direction: column;
  gap: clamp(1.563rem, 4.777vw + -1.489rem, 2.5rem);
}
.products__wrapper {
  display: flex;
  gap: clamp(0.938rem, 6.369vw + -3.131rem, 2.188rem);
}
@media (max-width: 768px) {
  .products__wrapper {
    flex-direction: column;
    align-items: center;
  }
}
.products__box {
  position: relative;
}
.products__box:last-child .products__circle:first-of-type {
  top: clamp(8.75rem, 15.924vw + -1.421rem, 11.875rem);
  left: 85px;
}
.products__box:last-child
  .products__circle:first-of-type
  .products__circle-text {
  max-width: clamp(9.375rem, 47.771vw + -21.139rem, 18.75rem);
  min-width: clamp(9.375rem, 47.771vw + -21.139rem, 18.75rem);
}
@media (max-width: 768px) {
  .products__box:last-child .products__circle:first-of-type {
    left: 120px;
    top: 160px;
  }
}
@media (max-width: 576px) {
  .products__box:last-child .products__circle:first-of-type {
    left: 60px;
    top: 120px;
  }
}
.products__box:last-child .products__circle:nth-of-type(2) {
  left: clamp(17.188rem, 28.662vw + -1.121rem, 22.813rem);
  top: clamp(12.813rem, 20.701vw + -0.41rem, 16.875rem);
}
.products__box:last-child
  .products__circle:nth-of-type(2)
  .products__circle-text {
  max-width: clamp(8.125rem, 40.446vw + -17.71rem, 16.063rem);
  min-width: clamp(8.125rem, 40.446vw + -17.71rem, 16.063rem);
}
@media (max-width: 768px) {
  .products__box:last-child .products__circle:nth-of-type(2) {
    left: 320px;
  }
}
@media (max-width: 576px) {
  .products__box:last-child .products__circle:nth-of-type(2) {
    top: 160px;
    left: 220px;
    z-index: 3;
  }
}
.products__box:last-child .products__circle:nth-of-type(3) {
  z-index: 2;
  left: clamp(22.5rem, 44.586vw + -5.979rem, 31.25rem);
  top: clamp(7.5rem, 12.739vw + -0.637rem, 10rem);
}
.products__box:last-child
  .products__circle:nth-of-type(3)
  .products__circle-text {
  max-width: clamp(9.375rem, 47.771vw + -21.139rem, 18.75rem);
  min-width: clamp(9.375rem, 47.771vw + -21.139rem, 18.75rem);
}
@media (max-width: 992px) {
  .products__box:last-child .products__circle:nth-of-type(3) {
    left: 310px;
  }
}
@media (max-width: 768px) {
  .products__box:last-child .products__circle:nth-of-type(3) {
    left: 430px;
  }
}
@media (max-width: 576px) {
  .products__box:last-child .products__circle:nth-of-type(3) {
    left: 270px;
    top: 100px;
  }
}
.products__box:last-child .products__circle:last-of-type {
  top: clamp(4.375rem, 4.777vw + 1.324rem, 5.313rem);
  left: clamp(24.375rem, 44.586vw + -4.104rem, 33.125rem);
}
.products__box:last-child
  .products__circle:last-of-type
  .products__circle-text {
  max-width: clamp(6.25rem, 50vw + -25.688rem, 16.063rem);
  min-width: clamp(6.25rem, 50vw + -25.688rem, 16.063rem);
}
@media (max-width: 992px) {
  .products__box:last-child .products__circle:last-of-type {
    left: 320px;
  }
}
@media (max-width: 768px) {
  .products__box:last-child .products__circle:last-of-type {
    left: 450px;
  }
}
@media (max-width: 576px) {
  .products__box:last-child .products__circle:last-of-type {
    left: 280px;
    top: 65px;
  }
}
.products__img {
  width: clamp(32.5rem, 36.624vw + 9.106rem, 39.688rem);
  height: clamp(16.25rem, 27.07vw + -1.041rem, 21.563rem);
  object-fit: contain;
}
@media (max-width: 576px) {
  .products__img {
    width: 335px;
    height: 200px;
  }
}
.products__circle {
  cursor: pointer;
  z-index: 1;
  position: absolute;
  margin-top: -5px;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.products__circle:hover span,
.products__circle:focus span {
  transform: rotate(45deg);
}
.products__circle:hover span:last-child,
.products__circle:focus span:last-child {
  transform: rotate(135deg);
}
.products__circle:hover .products__circle-text,
.products__circle:focus .products__circle-text {
  opacity: 1;
  visibility: visible;
}
@media (max-width: 992px) {
  .products__circle {
    width: 20px;
    height: 20px;
    padding: 20px;
  }
}
.products__circle:first-of-type {
  top: clamp(1.875rem, 6.369vw + -2.193rem, 3.125rem);
  left: 35px;
}
.products__circle:first-of-type .products__circle-text {
  max-width: clamp(6.25rem, 50vw + -25.688rem, 16.063rem);
  min-width: clamp(6.25rem, 50vw + -25.688rem, 16.063rem);
}
@media (max-width: 768px) {
  .products__circle:first-of-type {
    top: 50px;
    left: 85px;
  }
}
@media (max-width: 576px) {
  .products__circle:first-of-type {
    left: 40px;
  }
}
.products__circle:nth-of-type(2) {
  z-index: 2;
  left: clamp(3.125rem, 9.554vw + -2.978rem, 5rem);
  top: clamp(6.25rem, 15.924vw + -3.921rem, 9.375rem);
}
@media (max-width: 768px) {
  .products__circle:nth-of-type(2) {
    top: 120px;
    left: 80px;
  }
}
@media (max-width: 576px) {
  .products__circle:nth-of-type(2) {
    top: 95px;
    left: 45px;
  }
}
.products__circle:nth-of-type(3) {
  left: clamp(11.875rem, 25.478vw + -4.399rem, 16.875rem);
  top: clamp(6.25rem, 9.554vw + 0.147rem, 8.125rem);
}
@media (max-width: 768px) {
  .products__circle:nth-of-type(3) {
    left: 230px;
    top: 110px;
  }
}
@media (max-width: 576px) {
  .products__circle:nth-of-type(3) {
    top: 80px;
    left: 140px;
  }
}
.products__circle:last-of-type {
  top: clamp(6.25rem, 6.369vw + 2.182rem, 7.5rem);
  left: clamp(21.25rem, 44.586vw + -7.229rem, 30rem);
}
.products__circle:last-of-type .products__circle-text {
  max-width: clamp(9.375rem, 47.771vw + -21.139rem, 18.75rem);
  min-width: clamp(9.375rem, 47.771vw + -21.139rem, 18.75rem);
}
@media (max-width: 768px) {
  .products__circle:last-of-type {
    left: 380px;
  }
}
@media (max-width: 576px) {
  .products__circle:last-of-type {
    left: 260px;
    top: 80px;
  }
}
.products__circle span {
  transition: transform 0.38s ease-in-out;
  width: 15px;
  height: 3px;
  background-color: #ffffff;
  border-radius: 4px;
  position: absolute;
}
.products__circle span:last-child {
  transform: rotate(90deg);
}
@media (max-width: 992px) {
  .products__circle span {
    width: 10px;
    height: 2px;
  }
}
.products__circle::after {
  content: "";
  z-index: -1;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #448fff;
}
@media (max-width: 992px) {
  .products__circle::after {
    position: absolute;
    width: 20px;
    height: 20px;
  }
}
.products__circle-text {
  visibility: hidden;
  z-index: -1;
  max-width: clamp(9.375rem, 34.076vw + -12.391rem, 16.063rem);
  min-width: clamp(9.375rem, 34.076vw + -12.391rem, 16.063rem);
  top: -55px;
  position: absolute;
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1490196078);
  background-color: #ffffff;
  padding: clamp(0.625rem, 0.637vw + 0.218rem, 0.75rem)
    clamp(0.625rem, 4.459vw + -2.223rem, 1.5rem);
  border-radius: 5px;
  font-size: clamp(0.75rem, 1.274vw + -0.064rem, 1rem);
  font-weight: 600;
  line-height: clamp(0.875rem, 1.592vw + -0.142rem, 1.188rem);
  text-align: center;
  color: #384050;
  opacity: 0;
  transition: opacity 0.38s ease-in-out;
}
@media (max-width: 992px) {
  .products__circle-text {
    top: -45px;
    opacity: 1;
  }
}