/* stylelint-disable */
/* stylelint-disable max-line-length */
:root {
  --breakpoint-xxl: 1920px;
  --breakpoint-xl: 1440px;
  --breakpoint-lg: 1280px;
  --breakpoint-md: 1024px;
  --breakpoint-md-s: 992px;
  --breakpoint-sm: 768px;
  --breakpoint-xs: 512px;
  --breakpoint-xxs: 390px;
}

/* stylelint-disable */
/* stylelint-disable */
/*
  This mixin can be used to set the object-fit:
  @include object-fit(contain);

  or object-fit and object-position:
  @include object-fit(cover, top);
*/
.heroblock {
  position: relative;
  margin-bottom: 60px;
  padding-top: clamp(100px, 68.3921568627px + 0.0810457516 * 100vw, 224px);
  padding-bottom: clamp(30px, 7.0588235294px + 0.0588235294 * 100vw, 120px);
  min-height: clamp(250px, 148.0392156863px + 0.2614379085 * 100vw, 650px);
}
.heroblock .sk-container--fl {
  padding: 0;
}
.heroblock.with-video {
  min-height: clamp(400px, 298.0392156863px + 0.2614379085 * 100vw, 800px);
}
@media (max-width: 768px) {
  .heroblock.with-video {
    min-height: clamp(305px, 178.8235294118px + 0.3235294118 * 100vw, 800px);
  }
}
.heroblock .background-wrapper {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  top: 0;
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}
.heroblock .background-wrapper picture {
  width: inherit;
  height: inherit;
}
.heroblock .background-wrapper img {
  width: 100%;
  height: auto;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.heroblock .background-wrapper video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.heroblock::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  left: 0;
  top: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0) 50%);
  position: absolute;
}
.heroblock-content {
  position: relative;
  z-index: 1;
}
.heroblock-content .breadcrumbs {
  position: absolute;
  bottom: calc(100% + 40px);
}
@media (max-width: 992px) {
  .heroblock-content .breadcrumbs {
    bottom: calc(100% + 20px);
  }
}
@media (max-width: 768px) {
  .heroblock-content .breadcrumbs {
    bottom: calc(100% + 10px);
  }
}
.heroblock-title {
  font-size: clamp(24px, 13.8039215686px + 0.0261437908 * 100vw, 64px);
  font-weight: 700;
  font-family: var(--font-secondary);
  color: var(--White);
  margin-bottom: clamp(15px, 13.7254901961px + 0.0032679739 * 100vw, 20px);
}
.heroblock-text {
  color: var(--White);
  font-size: clamp(14px, 12.9803921569px + 0.0026143791 * 100vw, 18px);
}
.heroblock .buttons-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(15px, 11.1764705882px + 0.0098039216 * 100vw, 30px);
  margin-top: clamp(20px, 14.9019607843px + 0.0130718954 * 100vw, 40px);
}
.heroblock .buttons-wrapper .fancybox-video {
  display: flex;
  align-items: center;
  gap: clamp(5px, 3.7254901961px + 0.0032679739 * 100vw, 10px);
  font-size: clamp(12px, 11.4901960784px + 0.0013071895 * 100vw, 14px);
  color: var(--White);
  text-decoration: unset;
}
.heroblock .buttons-wrapper .fancybox-video svg {
  width: clamp(32px, 23.0784313725px + 0.022875817 * 100vw, 67px);
  height: clamp(32px, 23.0784313725px + 0.022875817 * 100vw, 67px);
}
.heroblock .buttons-wrapper .fancybox-video svg circle {
  transition-duration: 0.5s;
}
.heroblock .buttons-wrapper .fancybox-video:hover svg circle {
  fill: var(--338-af-4);
}