@charset "UTF-8";
/**
needs bootstrap function str-replace()
 */
/**
* Метод дополняет svg-sprite.scss.
* Позволяет получить чистый урл элемента спрайта для использования в псевдоэлементах или background-image
* Example: content: url(get-svg-url('checkmark', $user-variables: (fill: 'tomato')));
* Example: background-image: url(get-svg-url('heart', $user-variables: (stroke: 'red', fill: 'pink')));
*/
/**
вертикальные отступы
для каждого цвета указываются в порядке как в $grid-breakpoints
 */
/*
<div class="highlighted-blob">
    <div class="highlighted-blob__image">
        <div class="highlighted-blob__title"></div>
    </div>
    <div class="highlighted-blob__figcaption"></div>
</div>
*/
.highlighted-blob {
  display: block;
  position: relative;
  width: 480px;
  max-width: 100%;
}
.highlighted-blob__image {
  width: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("/upload/_base/highload-blob-bg.png");
  background-size: 214px 200px;
  background-position: center center;
  background-repeat: no-repeat;
  margin-bottom: 24px;
}
.highlighted-blob__title {
  font-size: var(--fz-h1);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -5px;
  text-align: center;
}
.highlighted-blob__title .digit {
  color: #000;
  font-size: clamp(60px, 7vw, 70px);
}
.highlighted-blob__figcaption {
  font-weight: 500;
  font-size: var(--fz-h6);
  line-height: 1.3;
  text-align: center;
  max-width: 300px;
  margin: 0 auto;
}