/* Start:/local/templates/assimettric-avl_s3/assets/css/pages/page-company.css?17936146886737*/
/*
 * Page: /kompaniya/ («О компании»)
 * Figma (desktop): https://www.figma.com/design/o2pxpPyVyPKWw4xNWKOeBQ/asimetrik-avl--Copy-?node-id=1097-60
 * Figma (768): node-id=1236-1481, Figma (390): node-id=1236-463
 *
 * Page-level стили — только для статичной секции company-cta (заголовок,
 * фон, панель, кнопка), по аналогии с page-brands.css/brands-cta. Ссылки
 * телефон/email внутри панели рендерятся компонентом company_cta_contacts —
 * их стили (.company-cta__contact*) лежат в его собственном style.css.
 * Остальные блоки страницы («О компании») — полноценные news.list-
 * компоненты, стили каждого — в его собственной папке.
 */

/*
 * .header — position:absolute (наложена на контент, не выталкивает его,
 * так по всему сайту). company_index (блок company-intro) переиспользован
 * с главной, где ПЕРЕД ним стоит hero с большим отступом сверху — на
 * /kompaniya/ это первый блок на странице, и штатного padding-top
 * компонента (64px на mobile/tablet, clamp(60px,6.2vw,119px) на десктопе)
 * не хватает даже чтобы просто очистить высоту шапки (~78-90px), не говоря
 * уже о видимом зазоре под ней. По фидбеку пользователя зазор ПОСЛЕ шапки
 * должен быть ~90px по макету — то есть итоговый padding-top = высота
 * шапки + зазор, а не 90px от начала страницы (первая попытка была именно
 * такой ошибкой — с ней контент упирался вплотную в шапку). Используем
 * то же значение, что и на других детальных страницах (услуги/проекты/
 * бренды/404) — clamp(140px, 9.5vw, 182px) — оно уже устроено как
 * "высота шапки + ровно такой зазор" и даёт одинаковый отступ по всему
 * сайту, как и просили. Не трогаем сам компонент (на главной он верный),
 * задаём только для этой страницы. Селектор через #about — та же
 * специфичность класса в style.css компонента иначе побеждала бы по
 * порядку подключения (он грузится позже page-company.css).
 */
#about .about__inner {
  padding-top: clamp(140px, 9.5vw, 182px);
}

.company-cta {
  background: var(--color-panel);
  padding: 0 0 clamp(56px, 6vw, 110px);
}

.company-cta__inner {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 clamp(20px, 7.6vw, 146px);
}

.company-cta__banner {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 58px);
  min-height: clamp(320px, 22vw, 427px);
  padding: clamp(28px, 3vw, 58px) clamp(28px, 5.1vw, 99px);
  border-radius: clamp(20px, 1.8vw, 35px);
  background: var(--color-panel-alt);
}

.company-cta__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.company-cta__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(17, 17, 19, 0.45) 0%, rgba(35, 39, 45, 0) 53%, rgba(35, 39, 45, 0.33) 83%);
}

.company-cta__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.company-cta__text {
  position: relative;
  z-index: 1;
  max-width: 630px;
}

.company-cta__title {
  margin: 0;
  font-weight: 600;
  font-size: clamp(28px, 3.02vw, 58px);
  line-height: 1.1;
  letter-spacing: -0.017em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-cta__title span {
  display: block;
}

.company-cta__title--muted {
  color: var(--color-muted);
}

.company-cta__divider {
  display: block;
  width: 46px;
  height: 2px;
  margin: 30px 0 20px;
  background: var(--color-line-muted);
}

.company-cta__desc {
  margin: 0;
  max-width: 572px;
  font-size: clamp(16px, 1.15vw, 22px);
  line-height: 1.6;
  color: var(--color-white);
}

/* ---------- Panel ---------- */

.company-cta__panel {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: clamp(240px, 19.8vw, 380px);
  padding: clamp(24px, 2.3vw, 45px);
  border-radius: clamp(26px, 2.6vw, 50px);
  background: rgba(51, 54, 60, 0.67);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.company-cta__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  padding: clamp(12px, 0.85vw, 16px) clamp(18px, 1.35vw, 26px);
  border: 1px solid var(--color-white);
  border-radius: clamp(9px, 0.65vw, 12.5px);
  background: none;
  color: var(--color-white);
  font-family: inherit;
  text-decoration: none;
  font-size: clamp(13px, 0.8vw, 15.6px);
  font-weight: 600;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.company-cta__btn:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.company-cta__btn svg {
  width: 20px;
  height: auto;
  flex-shrink: 0;
}

/*
 * Tablet
 * Figma (768): node-id=1236-1481
 */

@media (min-width: 761px) and (max-width: 1024px) {
  .company-cta__inner {
    padding-left: 51px;
    padding-right: 51px;
  }

  .company-cta__banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 32px;
  }

  .company-cta__title {
    font-size: 48px;
  }

  .company-cta__desc {
    font-size: 18px;
  }

  .company-cta__panel {
    width: 100%;
    max-width: 380px;
  }
}

/* ---------- Mobile ---------- */

@media (max-width: 760px) {
  .company-cta__inner {
    padding-left: 21px;
    padding-right: 21px;
  }

  .company-cta__banner {
    flex-direction: column;
    align-items: flex-start;
    min-height: auto;
    padding: 24px;
    border-radius: 27px;
  }

  .company-cta__title {
    font-size: 30px;
  }

  .company-cta__desc {
    font-size: 17px;
    max-width: none;
  }

  .company-cta__panel {
    width: 100%;
  }
}

/* End */


/* Start:/local/templates/assimettric-avl_s3/components/bitrix/news.list/company_index/style.css?179361469014852*/
/*
 * Block: about (второй экран, «о компании»)
 */

.about {
  position: relative;
  overflow: hidden;
  background: var(--color-panel);
}

.about__inner {
  position: relative;
  max-width: 1920px;
  margin: 0 auto;
  padding: clamp(60px, 6.2vw, 119px) clamp(20px, 7.6vw, 146px) clamp(70px, 8.2vw, 158px);
}

.about__photo {
  position: absolute;
  left: 0;
  top: 0;
  width: 58%;
  height: 82%;
  z-index: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  mask-image: linear-gradient(100deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.9) 45%, transparent 85%);
  -webkit-mask-image: linear-gradient(100deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.9) 45%, transparent 85%);
}

.about__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 65% 55%;
}

/* ---------- Row: интро + статистика ---------- */

.about__row {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(32px, 4.9vw, 94px);
}

.about__intro {
  max-width: clamp(280px, 34vw, 650px);
  min-width: 0;
}

.about__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.27;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-white);
}

.about__eyebrow-line {
  width: clamp(24px, 2.3vw, 44px);
  height: 1px;
  background: var(--color-white);
  flex-shrink: 0;
}

.about__title {
  margin: 30px 0 0;
  font-size: clamp(22px, 2.08vw, 40px);
  line-height: 1.35;
  color: var(--color-white);
  text-transform: uppercase;
}

.about__title-accent {
  font-weight: 600;
}

/* Приглушённая часть заголовка (после жирного "Компания ASIMETRIK KZ") —
   по макету тоньше и мельче основного текста, не просто другого цвета.
   text-transform: none — это обычный текст, не капс, как жирная часть. */
.about__title-plain {
  font-weight: 400;
  font-size: 0.75em;
  text-transform: none;
}

.about__divider {
  display: block;
  width: 46px;
  height: 2px;
  margin: 30px 0 20px;
  background: var(--color-line-muted);
}

.about__desc {
  margin: 0;
  max-width: 489px;
  font-size: clamp(14px, 0.78vw, 15px);
  line-height: 1.73;
  font-weight: 400;
  color: var(--color-white);
}

.about__link {
  /* Класс общий для <a> (на главной — ссылка на /kompaniya/) и <button>
     (на /kompaniya/ — открывает попап "обсудить проект", см. template.php):
     background/border/padding/font-family сброшены явно — у <button>,
     в отличие от <a>, они не наследуются браузером по умолчанию. */
  display: inline-flex;
  align-items: center;
  gap: clamp(24px, 3.28vw, 63px);
  margin-top: clamp(24px, 2.5vw, 48px);
  padding: 0 0 clamp(8px, 1.1vw, 22px);
  border: none;
  border-bottom: 2px solid var(--color-white-40);
  background: none;
  cursor: pointer;
  font-family: inherit;
  color: var(--color-white);
  text-decoration: none;
  font-size: clamp(12px, 0.73vw, 14px);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  transition: gap 0.25s ease, border-color 0.25s ease;
}

.about__link:hover {
  gap: clamp(30px, 4vw, 76px);
  border-color: rgba(255, 255, 255, 0.8);
}

.about__link-arrow {
  width: clamp(14px, 1.15vw, 22px);
  height: auto;
  color: var(--color-white);
}

/* ---------- Статистика ---------- */

.about__stats-col {
  flex: 0 0 auto;
  width: clamp(280px, 34.95vw, 671px);
}

.about__stats {
  display: grid;
  /* minmax(0,1fr), не просто 1fr — иначе колонка не сжимается меньше
     min-content самого длинного слова/цифры внутри (напр. "реализованных
     объектов"), и сетка вылезает за пределы контейнера на узких экранах,
     игнорируя max-width родителя (.about__stats-col). Без gap — 4 ячейки
     образуют один цельный блок, скруглённый только по внешним углам
     (см. --tl/--tr/--bl/--br ниже), а не отдельные карточки с зазором. */
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.about__stat {
  /* Контент идёт естественным потоком сверху вниз (иконка → цифра →
     линия → текст), без justify-content:flex-end — раньше контент
     прижимался к низу ячейки, и при несовпадении высоты ячейки с
     фактической высотой контента наверху оставался пустой зазор
     (тем больше, чем сильнее ячейка отличалась от контента по высоте).
     height явным clamp'ом, не aspect-ratio — aspect-ratio считает высоту
     от ФАКТИЧЕСКОЙ ширины ячейки, а сабпиксельные округления ширины двух
     соседних колонок грида иногда чуть расходятся, из-за чего высота
     ячеек в одном ряду отличалась на 1-2px (виден "уступ" на стыке).
     Явная высота не зависит от вычисленной ширины — гарантированно
     одинаковая у всех 4 ячеек. Формула — та же ставка (34.95vw/2), что и
     у .about__stats-col, чтобы ячейка оставалась квадратной. */
  position: relative;
  height: clamp(140px, 17.475vw, 335px);
  display: flex;
  flex-direction: column;
  padding: clamp(16px, 2.3vw, 44px);
  /* Тонкая линия между ячейками цветом фона страницы (не реальный gap —
     фон между ячейками не открывается) — border-box, чтобы 1px рамки не
     увеличивал высоту сверх заданной выше. */
  border: 1px solid var(--color-panel);
  box-sizing: border-box;
  background: var(--color-panel-alt);
  color: var(--color-white);
}

.about__stat--tl {
  border-top-left-radius: 18%;
}

.about__stat--tr {
  border-top-right-radius: 18%;
}

.about__stat--bl {
  border-bottom-left-radius: 18%;
}

.about__stat--br {
  border-bottom-right-radius: 18%;
}

/*
 * .about__stat--light — это демонстрация hover-эффекта в Figma (не
 * постоянная подсветка первой ячейки), сама подсветка навешивается через
 * :hover ниже. Класс --light в разметке оставлен для точечных ручных
 * правок из Hermitage, если понадобится, но сам по себе фон не красит.
 */
.about__stat:hover {
  background: var(--color-white);
  color: var(--color-panel-alt);
}

.about__stat:hover .about__stat-icon {
  background: var(--color-icon-circle-light);
  color: var(--color-panel-alt);
}

.about__stat-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: clamp(28px, 2.8vw, 54px);
  height: clamp(28px, 2.8vw, 54px);
  border-radius: 50%;
  background: var(--color-icon-circle);
  color: var(--color-icon-muted);
}

.about__stat--light .about__stat-icon {
  background: var(--color-icon-circle-light);
  color: var(--color-panel-alt);
}

.about__stat-icon svg,
.about__stat-icon img {
  width: 55%;
  height: 55%;
}

.about__stat-number {
  margin-top: clamp(12px, 1.5vw, 29px);
  font-size: clamp(28px, 3.75vw, 72px);
  font-weight: 600;
  line-height: 1.08;
  font-variant-numeric: tabular-nums;
  color: inherit;
}

/*
 * Разделитель — svg-линия (не div), чтобы можно было "дорисовать" её
 * через stroke-dashoffset при попадании блока в вьюпорт (см. script.js).
 * Дефолтный вид (тонкая, currentColor, opacity .5) не отличается от
 * прежнего div-варианта, пока JS не отработал/если он отключён.
 */
.about__stat-line {
  display: block;
  width: clamp(20px, 2.6vw, 50px);
  height: 2px;
  margin: clamp(10px, 1.2vw, 23px) 0 clamp(6px, 0.9vw, 17px);
  overflow: visible;
}

.about__stat-line line {
  stroke: currentColor;
  stroke-width: 1;
  opacity: 0.5;
}

.about__stat-line.is-counted line {
  stroke: #6fb3ff;
  opacity: 1;
  filter: drop-shadow(0 0 4px rgba(111, 179, 255, 0.55));
  transition: stroke 0.3s ease, opacity 0.3s ease, filter 0.3s ease;
}

.about__stat-label {
  font-size: clamp(12px, 0.83vw, 16px);
  line-height: 1.55;
  color: inherit;
}

/* ---------- Заметка под статистикой ---------- */

.about__note {
  display: flex;
  /* stretch, а не flex-start — линия должна быть высотой ровно с текст
     (сколько бы строк он ни занял), а не с отдельно заданным clamp()-ом,
     который на практике не совпадал с реальной высотой параграфа. */
  align-items: stretch;
  gap: clamp(16px, 1.6vw, 29px);
  margin-top: clamp(16px, 2.3vw, 44px);
}

.about__note-line {
  flex-shrink: 0;
  width: 1px;
  background: var(--color-white-50);
}

.about__note p {
  margin: 0;
  max-width: 520px;
  font-size: clamp(13px, 0.78vw, 15px);
  line-height: 1.6;
  color: var(--color-white);
}

/*
 * Tablet
 * Figma (768): https://www.figma.com/design/o2pxpPyVyPKWw4xNWKOeBQ/asimetrik-avl--Copy-?node-id=1215-630
 *
 * Точные значения с кадра 768 (не интерполяция из десктопного clamp()).
 * Диапазон ограничен снизу (min-width), чтобы не перетекать в мобильный
 * брейкпоинт — у него собственные, отдельно снятые с кадра 390 значения.
 */

@media (min-width: 761px) and (max-width: 1024px) {
  .about__inner {
    padding: 64px 51px 64px;
  }

  .about__photo {
    width: 100%;
    height: 460px;
    left: 0;
    top: 0;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.85) 55%, transparent 100%);
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.85) 55%, transparent 100%);
  }

  .about__row {
    flex-direction: column;
    gap: 56px;
  }

  .about__intro {
    max-width: none;
  }

  .about__eyebrow {
    font-size: 15px;
  }

  .about__title {
    font-size: 40px;
    line-height: 53px;
  }

  .about__desc {
    max-width: 596px;
    font-size: 18px;
    line-height: 30px;
  }

  .about__link {
    margin-top: 90px;
    font-size: 14px;
  }

  .about__stats-col {
    /* width:100% на широком tablet-контейнере (.about__row переходит в
       column) растягивает квадратные .about__stat (aspect-ratio:1) до
       ~450px+, а иконка/цифра/лейбл остаются фиксированного размера —
       пустота сверху (justify-content:flex-end прижимает контент к низу
       квадрата). Ограничиваем ширину колонки и центрируем её. */
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
  }

  .about__stat {
    /* height (не min-height!) — min-height лишь задаёт пол: при более
       длинном лейбле ("реализованных объектов" против "лет интеграции
       сложных AVL-систем") ячейка всё равно могла вырасти выше соседней в
       том же ряду. Жёсткая высота гарантирует одинаковый размер всех 4
       ячеек независимо от длины текста внутри. */
    height: 300px;
  }

  .about__stat-icon {
    width: 59px;
    height: 59px;
  }

  .about__stat-number {
    margin-top: 24px;
    font-size: 72px;
  }

  .about__stat-label {
    font-size: 22px;
    line-height: 27px;
  }

  .about__note p {
    max-width: none;
    font-size: 18px;
  }
}

/* ---------- Mobile ---------- */

@media (max-width: 760px) {
  .about__inner {
    padding: 64px 20px 56px;
  }

  .about__photo {
    width: 100%;
    height: 420px;
    left: 0;
    top: 0;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.85) 55%, transparent 100%);
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.85) 55%, transparent 100%);
  }

  .about__row {
    flex-direction: column;
    gap: 40px;
  }

  .about__intro {
    max-width: none;
  }

  .about__title {
    font-size: 22px;
  }

  .about__desc {
    max-width: none;
  }

  .about__stats-col {
    /* width:100% на широком мобильном контейнере (.about__row в столбик)
       растягивает квадратные .about__stat (aspect-ratio:1), а иконка/
       цифра остаются мелкими — пустота сверху (justify-content:flex-end
       прижимает контент к низу). Ограничиваем ширину колонки и
       центрируем её. */
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
  }

  .about__stat {
    /* height (не min-height) — та же причина, что на tablet: min-height
       не мешает конкретной ячейке вырасти выше соседей, если её текст
       длиннее. Жёсткая высота — все 4 ячейки гарантированно одинаковые. */
    height: 210px;
  }

  .about__stat-icon {
    width: 44px;
    height: 44px;
  }

  .about__stat-number {
    margin-top: 12px;
    font-size: 38px;
  }

  .about__stat-label {
    font-size: 12px;
  }
}

/* End */


/* Start:/local/templates/assimettric-avl_s3/components/bitrix/news.list/company_process/style.css?179361469011174*/
/*
 * Block: company_process (страница «О компании» — «Комплексный подход»)
 * Figma (desktop): https://www.figma.com/design/o2pxpPyVyPKWw4xNWKOeBQ/asimetrik-avl--Copy-?node-id=1097-60
 */

.company-process {
  background: var(--color-panel);
  padding-bottom: clamp(56px, 6vw, 110px);
}

.company-process__inner {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 clamp(20px, 7.6vw, 146px);
}

.company-process__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 58px);
}

.company-process__heading {
  flex: 1 1 480px;
  max-width: 900px;
}

.company-process__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: clamp(12px, 0.78vw, 15px);
  font-weight: 500;
  line-height: 1.27;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-process__eyebrow-line {
  width: clamp(24px, 2.3vw, 44px);
  height: 1px;
  background: var(--color-white);
  flex-shrink: 0;
}

.company-process__title {
  margin: clamp(12px, 1.6vw, 30px) 0 0;
  font-weight: 600;
  font-size: clamp(24px, 3.02vw, 58px);
  line-height: 1.1;
  letter-spacing: -0.017em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-process__title span {
  display: block;
}

.company-process__title--muted {
  color: var(--color-muted);
}

.company-process__desc {
  flex: 0 1 466px;
  margin: clamp(16px, 1.7vw, 32px) 0 0;
  font-size: clamp(14px, 0.83vw, 16px);
  line-height: 1.62;
  color: var(--color-white);
}

@media (min-width: 1025px) {
  .company-process__desc {
    margin-top: clamp(36px, 3.5vw, 67px);
  }
}

.company-process__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 1.9vw, 37px);
  margin-top: clamp(40px, 4.6vw, 86px);
}

.company-process__card {
  /* height явным clamp'ом, не aspect-ratio — та же причина, что и в
     company_index/.about__stat: aspect-ratio считает высоту от
     фактической ширины карточки, а у 4 колонок грида ширина иногда чуть
     расходится (сабпиксельное округление), из-за чего высота карточек
     в одном ряду отличалась на 1-2px. Явная высота не зависит от
     вычисленной ширины.
     Пол clamp'а (изначально 276px, снят с соотношения 381:520 из Figma)
     оказался НИЖЕ реально нужной высоты контента у нижней границы
     desktop-диапазона — замер getBoundingClientRect показал реальный
     контент требует до ~333px на 1025-1150px ширины (карточка была
     280-294px — текст вылезал за карточку). Пол поднят до 360px —
     достаточно для всей нижней части диапазона (1025-~1325px, дальше
     27.2vw уже сама превышает пол), верхняя граница (520px на 1920px)
     не менялась — на ней запас уже достаточный (замер: нужно ~468px).
     min-height, а не height: замеры делались в Chrome, а на iPhone текст
     переносится на больше строк и при жёсткой высоте вылезал за карточку.
     Карточки лежат в одной сетке — ряд всё равно выравнивается по самой
     высокой, так что одинаковая высота в ряду сохраняется. */
  position: relative;
  z-index: 0;
  display: flex;
  flex-direction: column;
  min-height: clamp(360px, 27.2vw, 520px);
  padding: clamp(20px, 2.1vw, 40px) clamp(20px, 1.6vw, 30px);
  border-radius: clamp(22px, 2.1vw, 40px);
  background: var(--color-card);
  color: var(--color-white);
  border: 1px solid transparent;
  transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

/* Лёгкая неоновая подсветка рамки — по фидбеку сделано намного слабее
   исходного варианта (убран большой тёмный offset-shadow и inset-кольцо,
   остался только тонкий мягкий glow, почти как просто подсвеченный border). */
.company-process__card:hover {
  background: rgba(74, 130, 196, 0.1);
  border-color: rgba(111, 179, 255, 0.55);
  box-shadow: 0 0 14px rgba(88, 166, 255, 0.22);
  transform: translateY(-4px);
}

/* Spotlight-курсор: см. комментарий у .services__card в
   news.list/company_stages/style.css — тот же паттерн. */
.company-process__card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: radial-gradient(300px circle at var(--spot-x, 50%) var(--spot-y, 50%), rgba(111, 179, 255, 0.16), transparent 70%);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.company-process__card:hover::before {
  opacity: 1;
}

.company-process__card-index {
  font-size: clamp(18px, 1.6vw, 30px);
  font-weight: 600;
  color: var(--color-white);
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.company-process__card:hover .company-process__card-index {
  color: #6fb3ff;
  text-shadow: 0 0 6px rgba(111, 179, 255, 0.6);
}

.company-process__card:hover .company-process__card-icon {
  filter: drop-shadow(0 0 5px rgba(111, 179, 255, 0.5));
}

.company-process__card-icon {
  display: flex;
  align-items: center;
  margin-top: clamp(16px, 1.8vw, 34px);
  width: clamp(44px, 3.7vw, 72px);
  height: clamp(44px, 3.7vw, 72px);
  color: var(--color-white);
  transition: filter 0.3s ease;
}

.company-process__card-icon svg {
  width: 100%;
  height: 100%;
}

/*
 * Раньше margin-top:auto прижимал title+line+desc к низу карточки — при
 * короткой карточке (мало текста) высокая карточка + прижатый низ давали
 * огромный пустой разрыв сразу после иконки. Контент теперь идёт
 * естественным потоком сверху вниз с фиксированным отступом, как у
 * .about__stat в company_index — если внизу карточки остаётся запас
 * высоты, он просто оседает под текстом, а не превращается в разрыв
 * над ним.
 */
.company-process__card-content {
  margin-top: clamp(16px, 2vw, 38px);
}

.company-process__card-title {
  margin: 0;
  font-size: clamp(18px, 1.46vw, 28px);
  font-weight: 500;
  line-height: 1.15;
  color: var(--color-white);
}

.company-process__card-line {
  display: block;
  width: 18px;
  height: 1px;
  margin: clamp(10px, 1vw, 18px) 0;
  background: var(--color-white-40);
}

.company-process__card-desc {
  margin: 0;
  font-size: clamp(15px, 1.15vw, 22px);
  line-height: 1.36;
  color: var(--color-white-85);
}

@media (min-width: 761px) and (max-width: 1024px) {
  .company-process__inner {
    padding-left: 51px;
    padding-right: 51px;
  }

  .company-process__eyebrow {
    font-size: 15px;
  }

  .company-process__eyebrow-line {
    width: 30px;
  }

  .company-process__title {
    font-size: 48px;
  }

  .company-process__desc {
    font-size: 16px;
    max-width: 663px;
  }

  .company-process__cards {
    grid-template-columns: repeat(2, 1fr);
  }

  .company-process__card {
    /* Как и на mobile (см. комментарий у mobile-правила ниже) — растягивать
       325:444 из Figma формулой на весь диапазон 761-1024px было неверно:
       замер реальной высоты контента на 782/832/932/1006px показал
       ~255-337px без выраженного роста с шириной, тогда как прежняя
       формула растила карточку линейно с 439px до 616px. Высота —
       фиксированная, с запасом над измеренным максимумом (337px) под
       нижний padding и небольшой воздух. */
    min-height: 370px;
  }

  .company-process__card-index {
    font-size: 24px;
  }

  .company-process__card-title {
    font-size: 24px;
  }

  .company-process__card-desc {
    font-size: 20px;
  }
}

@media (max-width: 760px) {
  .company-process__inner {
    padding-left: 21px;
    padding-right: 21px;
  }

  .company-process__eyebrow {
    font-size: 15px;
  }

  .company-process__eyebrow-line {
    width: 30px;
  }

  .company-process__title {
    font-size: 30px;
  }

  .company-process__desc {
    font-size: 14px;
    max-width: none;
  }

  .company-process__cards {
    grid-template-columns: 1fr;
  }

  .company-process__card {
    /* НЕ растягиваем 348:475 из Figma (снят с макета 390px) на весь
       диапазон 320-760px — соотношение сторон описывает конкретную
       ширину, а не формулу масштабирования. Замер реальной высоты
       контента (getBoundingClientRect от верха карточки до низа
       card-content) на 320/500/620/700/760px показал ~265-293px почти
       без роста (на широких mobile-шириных текст переносится на меньше
       строк, а не на больше) — в отличие от прежней формулы, которая
       росла до 980px. Высота карточки — фиксированная, с запасом под
       нижний padding (20px) и небольшим воздухом. */
    min-height: 330px;
  }

  .company-process__card-index {
    font-size: 27px;
  }

  .company-process__card-icon {
    /* Базовый clamp(44px,3.7vw,72px) на мобильной ширине упирается в
       44px-пол — заметно меньше иконки в Figma (~64px). Свой clamp для
       мобильного диапазона (320-760px): доходит до 64px уже на ширине
       390px (как в Figma) и дальше не растёт. */
    width: clamp(44px, 16.4vw, 64px);
    height: clamp(44px, 16.4vw, 64px);
    margin-top: clamp(16px, 6vw, 28px);
  }

  .company-process__card-title {
    font-size: 26px;
  }

  .company-process__card-desc {
    font-size: 20px;
  }
}

/* End */


/* Start:/local/templates/assimettric-avl_s3/components/bitrix/news.list/company_tech/style.css?17936146907301*/
/*
 * Block: company_tech (страница «О компании» — «Объединяем технологии в единую систему»)
 * Figma (desktop): https://www.figma.com/design/o2pxpPyVyPKWw4xNWKOeBQ/asimetrik-avl--Copy-?node-id=1097-63
 * Интерактив (hover по пилюле подсвечивает саму пилюлю + её линию/точки) — script.js.
 */

.company-tech {
  background: var(--color-panel-alt);
  padding: clamp(56px, 6vw, 110px) 0;
}

.company-tech__inner {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 clamp(20px, 7.6vw, 146px);
}

.company-tech__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 58px);
}

.company-tech__heading {
  flex: 1 1 480px;
  max-width: 1050px;
}

.company-tech__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: clamp(12px, 0.78vw, 15px);
  font-weight: 500;
  line-height: 1.27;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-tech__eyebrow-line {
  width: clamp(24px, 2.3vw, 44px);
  height: 1px;
  background: var(--color-white);
  flex-shrink: 0;
}

.company-tech__title {
  margin: clamp(12px, 1.6vw, 30px) 0 0;
  font-weight: 600;
  font-size: clamp(24px, 3.02vw, 58px);
  line-height: 1.1;
  letter-spacing: -0.017em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-tech__title span {
  display: block;
}

.company-tech__title--muted {
  color: var(--color-muted);
}

.company-tech__desc {
  flex: 0 1 466px;
  margin: clamp(16px, 1.7vw, 32px) 0 0;
  font-size: clamp(14px, 0.83vw, 16px);
  line-height: 1.62;
  color: var(--color-white);
}

@media (min-width: 1025px) {
  .company-tech__desc {
    margin-top: clamp(36px, 3.5vw, 67px);
  }
}

/* ---------- Diagram ---------- */

.company-tech__diagram {
  display: grid;
  grid-template-columns: clamp(240px, 24vw, 360px) 1fr clamp(240px, 24vw, 360px);
  align-items: center;
  /*
   * Без зазора между колонками: координаты линий в SVG (x=0/x=460)
   * рассчитаны на то, что схема примыкает к карточкам вплотную —
   * любой gap здесь сдвигает точки линий от края пилюль.
   */
  gap: 0;
  max-width: 1280px;
  margin: clamp(40px, 4.5vw, 86px) auto 0;
}

.company-tech__col {
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 1.5vw, 28px);
}

.company-tech__pill {
  position: relative;
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.4vw, 20px);
  min-height: clamp(70px, 6.7vw, 108px);
  padding: clamp(16px, 1.6vw, 24px) clamp(18px, 1.6vw, 28px);
  border-radius: clamp(14px, 1.4vw, 20px);
  background: var(--color-card);
  color: var(--color-white);
  cursor: pointer;
  transition: background-color 0.25s ease;
}

.company-tech__pill:hover {
  background: #454b57;
}

.company-tech__pill--active {
  background: #2f528f;
}

.company-tech__pill--active:hover {
  background: #355da3;
}

.company-tech__pill-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(28px, 2.6vw, 44px);
  height: clamp(28px, 2.6vw, 44px);
  flex-shrink: 0;
  color: var(--color-white);
}

.company-tech__pill-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.company-tech__pill-label {
  font-size: clamp(13px, 1.15vw, 17px);
  font-weight: 400;
  line-height: 1.3;
  color: var(--color-white);
}

/* ---------- Center: lines + core ---------- */

.company-tech__center {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(220px, 23vw, 380px);
}

.company-tech__lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}

.company-tech__line {
  fill: none;
  stroke: #3b3f4d;
  stroke-width: 1.5;
  transition: stroke 0.25s ease, stroke-width 0.25s ease;
}

.company-tech__line--active {
  stroke: #3c65af;
  stroke-width: 2;
}

.company-tech__dot {
  fill: var(--color-white);
  stroke: var(--color-panel-alt);
  stroke-width: 1;
  transition: stroke 0.25s ease;
}

.company-tech__dot--active {
  stroke: #3c65af;
  stroke-width: 1.5;
}

.company-tech__core {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(140px, 15.5vw, 210px);
  height: clamp(140px, 15.5vw, 210px);
  border-radius: 50%;
  background: #121418;
}

.company-tech__core-glow {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid #2f528f;
  box-shadow: 0 0 35px rgba(47, 82, 143, 0.45), inset 0 0 20px rgba(47, 82, 143, 0.25);
  pointer-events: none;
}

.company-tech__core-content {
  position: relative;
  z-index: 1;
  font-family: Arial, sans-serif;
  text-align: center;
  font-size: clamp(13px, 1.25vw, 15px);
  font-weight: 500;
  line-height: 1.35;
  color: var(--color-white);
}

.company-tech__core-content strong {
  display: block;
  margin: 3px 0;
  font-size: clamp(15px, 1.45vw, 18px);
  font-weight: 700;
}

@media (min-width: 761px) and (max-width: 1024px) {
  .company-tech__inner {
    padding-left: 51px;
    padding-right: 51px;
  }

  .company-tech__eyebrow {
    font-size: 15px;
  }

  .company-tech__eyebrow-line {
    width: 30px;
  }

  .company-tech__title {
    font-size: 48px;
  }

  .company-tech__desc {
    font-size: 16px;
  }

  .company-tech__diagram {
    grid-template-columns: clamp(200px, 26vw, 280px) 1fr clamp(200px, 26vw, 280px);
  }

  .company-tech__pill {
    min-height: 62px;
    padding: 12px 16px;
  }

  .company-tech__pill-icon {
    width: 22px;
    height: 22px;
  }

  .company-tech__pill-label {
    font-size: 13px;
  }

  .company-tech__core {
    width: 177px;
    height: 177px;
  }

  .company-tech__core-content {
    font-size: 13px;
  }

  .company-tech__core-content strong {
    font-size: 15px;
  }
}

@media (max-width: 760px) {
  .company-tech__lines {
    display: none;
  }

  .company-tech__diagram {
    gap: clamp(20px, 3vw, 32px);
  }

  .company-tech__inner {
    padding-left: 21px;
    padding-right: 21px;
  }

  .company-tech__eyebrow {
    font-size: 15px;
  }

  .company-tech__eyebrow-line {
    width: 30px;
  }

  .company-tech__title {
    font-size: 30px;
  }

  .company-tech__desc {
    font-size: 14px;
    max-width: none;
  }

  .company-tech__diagram {
    grid-template-columns: 1fr;
  }

  .company-tech__center {
    order: -1;
    height: auto;
    margin: 0 auto 8px;
  }

  .company-tech__core {
    width: 200px;
    height: 200px;
    margin: 0 auto;
  }

  .company-tech__core-content {
    font-size: 16px;
  }

  .company-tech__core-content strong {
    font-size: 22px;
  }

  .company-tech__pill {
    min-height: 94px;
  }

  .company-tech__pill-icon {
    width: 24px;
    height: 24px;
  }

  .company-tech__pill-label {
    font-size: 16px;
  }
}

/* End */


/* Start:/local/templates/assimettric-avl_s3/components/bitrix/news.list/company_trust/style.css?179361469019981*/
/*
 * Block: company_trust (страница «О компании» — «Опыт, подтверждённый реальными объектами»)
 * Figma (desktop): https://www.figma.com/design/o2pxpPyVyPKWw4xNWKOeBQ/asimetrik-avl--Copy-?node-id=1097-60
 * Figma (768): node-id=1236-1481, Figma (390): node-id=1236-463
 *
 * В макете карточки проектов «выбегают» за границы контейнера (особенно
 * на 768). Здесь упрощено до аккуратной сетки без горизонтального выбега.
 */

.company-trust {
  background: var(--color-panel);
  padding: clamp(56px, 6vw, 110px) 0;
}

.company-trust__inner {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 clamp(20px, 7.6vw, 146px);
}

.company-trust__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 58px);
}

.company-trust__heading {
  flex: 1 1 480px;
  max-width: 1050px;
}

.company-trust__side {
  flex: 0 1 466px;
}

.company-trust__eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: clamp(12px, 0.78vw, 15px);
  font-weight: 500;
  line-height: 1.27;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-trust__eyebrow-line {
  width: clamp(24px, 2.3vw, 44px);
  height: 1px;
  background: var(--color-white);
  flex-shrink: 0;
}

.company-trust__title {
  margin: clamp(12px, 1.6vw, 30px) 0 0;
  font-weight: 600;
  font-size: clamp(24px, 3.02vw, 58px);
  line-height: 1.1;
  letter-spacing: -0.017em;
  text-transform: uppercase;
  color: var(--color-white);
}

.company-trust__title span {
  display: block;
}

.company-trust__title--muted {
  color: var(--color-muted);
}

.company-trust__desc {
  margin: clamp(16px, 1.7vw, 32px) 0 0;
  font-size: clamp(14px, 0.83vw, 16px);
  line-height: 1.62;
  color: var(--color-white);
}

/* На desktop блок «описание + ссылка» стоит справа, на одном уровне с
   заголовком (не под ним). На ≤1024px переносится под заголовок. */
@media (min-width: 1025px) {
  .company-trust__side {
    margin-top: clamp(36px, 3.5vw, 67px);
  }
}

.company-trust__link {
  display: inline-flex;
  align-items: center;
  gap: clamp(20px, 2.7vw, 52px);
  margin-top: clamp(16px, 2vw, 39px);
  padding-bottom: clamp(6px, 0.83vw, 16px);
  border-bottom: 1px solid var(--color-white-40);
  color: var(--color-white);
  text-decoration: none;
  font-size: clamp(12px, 0.73vw, 14px);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  transition: gap 0.25s ease, border-color 0.25s ease;
}

.company-trust__link:hover {
  gap: clamp(26px, 3.4vw, 64px);
  border-color: rgba(255, 255, 255, 0.8);
}

.company-trust__link svg {
  width: clamp(14px, 1.15vw, 22px);
  height: auto;
  flex-shrink: 0;
}

/* ---------- Body ---------- */

.company-trust__body {
  display: flex;
  /* nowrap на desktop — иначе на ширинах у самого края 1920px (с учётом
     скроллбара/паддингов) реальные 440px (features) + 1158px (карточки)
     + gap чуть-чуть не помещаются, и .company-trust__cards целиком
     переносится на вторую строку и растягивается на всю ширину (та же
     категория бага, что уже чинили внутри самих карточек). Wrap нужен
     только на планшетной раскладке — включается там отдельно. */
  flex-wrap: nowrap;
  gap: clamp(20px, 1.25vw, 24px);
  margin-top: clamp(40px, 4.5vw, 86px);
}

.company-trust__features {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 0.8vw, 15px);
  flex: 0 0 440px;
}

.company-trust__features-link {
  display: inline-flex;
  align-items: center;
  gap: clamp(20px, 2.7vw, 52px);
  margin-top: clamp(28px, 3vw, 58px);
  padding-bottom: clamp(6px, 0.83vw, 16px);
  border-bottom: 1px solid var(--color-white-40);
  color: var(--color-white);
  text-decoration: none;
  font-size: clamp(12px, 0.78vw, 15px);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  transition: gap 0.25s ease, border-color 0.25s ease;
  align-self: flex-start;
}

.company-trust__features-link:hover {
  gap: clamp(26px, 3.4vw, 64px);
  border-color: rgba(255, 255, 255, 0.8);
}

.company-trust__features-link svg {
  width: clamp(16px, 1.15vw, 22px);
  height: auto;
  flex-shrink: 0;
}

.company-trust__feature {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.4vw, 27px);
  min-height: clamp(70px, 5.5vw, 105px);
  padding: clamp(16px, 1.6vw, 30px);
  border-radius: clamp(16px, 1.5vw, 28px);
  background: rgba(58, 63, 72, 0.25);
  border: 1px solid transparent;
  transition: background 0.3s ease, border-color 0.3s ease;
}

/* Ч/б-подсветка (без цвета — в отличие от синих hover-эффектов карточек
   справа), по запросу: фон и рамка чуть светлеют, текст/иконка ярче. */
.company-trust__feature:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.25);
}

.company-trust__feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(28px, 2vw, 38px);
  height: clamp(28px, 2vw, 38px);
  flex-shrink: 0;
  color: var(--color-white);
  opacity: 0.85;
  transition: opacity 0.3s ease;
}

.company-trust__feature:hover .company-trust__feature-icon {
  opacity: 1;
}

.company-trust__feature-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.company-trust__feature-text {
  margin: 0;
  font-size: clamp(14px, 1.04vw, 20px);
  font-weight: 500;
  line-height: 1.2;
  color: var(--color-white-60);
  transition: color 0.3s ease;
}

.company-trust__feature:hover .company-trust__feature-text {
  color: var(--color-white);
}

/* ---------- Project cards (Swiper) ----------
 * 3 реальные карточки по 370px (см. Figma node 1273:1215) физически не
 * помещаются рядом с колонкой преимуществ (440px) на большинстве desktop-
 * ширин — вместо того, чтобы искусственно сжимать карточки до нечитаемой
 * ширины, показываем их слайдером (тот же Swiper, что и в portfolio_index
 * на главной): карточки сохраняют свой настоящий размер, лишний ряд просто
 * прокручивается/пролистывается стрелками.
 */

.company-trust__cards {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.2vw, 20px);
  /* 3 карточки по 370px + 2 зазора по 24px — реальные размеры по Figma
     (node 1273:1215: карточки x=614/1008/1402, width=370 каждая). */
  flex: 1 1 1158px;
  min-width: 0;
}

.company-trust__cards-viewport {
  width: 100%;
  overflow: hidden;
}

.company-trust__cards-track {
  align-items: flex-start;
  margin: 0;
  padding: 0;
  list-style: none;
}

/*
 * .swiper-slide в собственном CSS Swiper уже задаёт width:100% с той же
 * специфичностью (один класс) — какое правило победит, зависело бы от
 * порядка подключения файлов. Составной селектор .company-trust__slide.swiper-slide
 * гарантированно перебивает его вне зависимости от порядка.
 */
.company-trust__slide.swiper-slide {
  /* Фиксированные 370px, как в Figma — это слайдер, ужимать карточку под
     ширину экрана больше не нужно, лишнее прокручивается. */
  width: 370px;
  height: auto;
  /* transition/filter — здесь, а не на .company-trust__card: card клипается
     через overflow:hidden (нужно для картинки), а filter на ТОМ ЖЕ элементе
     с border-radius+overflow:hidden у Chrome иногда даёт едва заметный
     артефакт (дуга/шов у скруглённого угла, видно ниже ~900px на скролле —
     подтверждено пользовательским скриншотом). Тот же обходной путь уже
     описан в памяти проекта: glow — на некликающемся родителе. */
  transition: filter 0.3s ease;
}

.company-trust__slide.swiper-slide:hover {
  filter: drop-shadow(0 0 10px rgba(88, 166, 255, 0.25));
}

.company-trust__card {
  /* Общая переменная для карточки/медиа/оверлея — иначе три отдельных
     clamp(24px, 2.1vw, 40px) на трёх разных элементах браузер может
     вычислить (округлить до пикселя) чуть по-разному, и скругления не
     совпадают на десятые пикселя — просвет ровно на границе кривых
     (подтверждено пользователем). Одна переменная — одно и то же готовое
     число у всех троих. */
  --trust-card-radius: clamp(24px, 2.1vw, 40px);
  position: relative;
  overflow: hidden;
  display: block;
  width: 100%;
  /* height:555px, не aspect-ratio:370/555 — слайд фиксированной ширины
     (370px), явная высота исключает любые особенности вычисления
     aspect-ratio как возможный источник дробного размера. */
  height: 555px;
  border-radius: var(--trust-card-radius);
  background: var(--color-panel);
  transition: box-shadow 0.3s ease;
  /* Карточка лежит внутри Swiper-трека, который Swiper двигает через
     transform: translate3d(...) (в т.ч. в дробных px — трек в режиме loop,
     spaceBetween:24 и clamp()-ширины редко дают целое число). Дробный
     сдвиг у родителя может сдвигать растеризацию скруглённого клипа этой
     карточки на до-пиксельную величину — просвет у края. translateZ(0)
     переводит карточку в свой собственный композитный слой, скругление
     считается от её же целых границ, а не "протаскивается" со сдвигом
     трека. */
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform;
}

/* В Figma (node 1105:787) рамка постоянная, но по запросу — только на
   hover, как акцент интерактивности. Лёгкая неоновая подсветка — тот же
   облегчённый рецепт, что и на остальных карточках сайта (без большой
   offset-тени, только тонкий glow: см. память "Neon hover intensity").
   inset box-shadow, а не border — border:2px solid transparent + box-
   sizing:border-box отодвигал img/overlay (position:absolute;inset:0,
   считается от padding-box) на 2px внутрь от скруглённого края карточки,
   и в этом постоянном зазоре просвечивал плоский фон карточки — ровно тот
   шов на скруглении, который заметил пользователь. box-shadow не входит
   в box-model, зазора не создаёт. */
.company-trust__card:hover {
  box-shadow: inset 0 0 0 2px rgba(111, 179, 255, 0.55);
}

/*
 * background-image вместо <img>: img — replaced-элемент со своими
 * особенностями (object-fit, intrinsic-размер, глобальный img{max-width:
 * 100%} в base.css).
 *
 * Затемнение низа — mask-image на самой картинке (та же техника, что и в
 * trust_index на главной), а не отдельный слой заливки поверх. Раньше был
 * отдельный div-оверлей (потом — второй background-layer на этом же
 * элементе) с градиентом var(--color-panel), но у скругления периодически
 * оставался просвет, где сквозь него было видно исходное фото (подтверждено
 * пользователем на неоднократных проверках). mask-image истончает саму
 * картинку до прозрачности снизу — под ней открывается родной
 * background:var(--color-panel) карточки, то есть ровно тот же цвет,
 * который раньше рисовал оверлей, но без отдельного слоя/клипа, которому
 * есть с чем не совпасть.
 */
.company-trust__card-media {
  position: absolute;
  inset: 0;
  border-radius: var(--trust-card-radius);
  background-size: cover;
  background-position: center;
  mask-image: linear-gradient(to top, transparent 0%, transparent 25%, #000 60%);
  -webkit-mask-image: linear-gradient(to top, transparent 0%, transparent 25%, #000 60%);
  transition: transform 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.company-trust__card:hover .company-trust__card-media {
  transform: scale(1.08);
}

.company-trust__card-text {
  position: absolute;
  left: clamp(20px, 1.6vw, 30px);
  right: clamp(20px, 1.6vw, 30px);
  bottom: clamp(24px, 2vw, 38px);
}

/* Категория — просто текст, без иконки (по Figma node 1105:787: у "КУЛЬТУРНЫЙ
   ОБЪЕКТ" своей иконки нет, значок "location" относится к городу внизу). */
.company-trust__card-tag {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-white-60);
}

.company-trust__card-text h3 {
  margin: 0;
  font-size: clamp(20px, 1.46vw, 28px);
  font-weight: 500;
  line-height: 1.2;
  color: var(--color-white);
}

/* Город + стрелка — один блок в самом низу карточки (Figma: pin-иконка и
   "АСТАНА" на y=486-521, стрелка в той же строке на y=502). */
.company-trust__card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: clamp(16px, 1.7vw, 33px);
}

.company-trust__card-city {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-white-60);
}

.company-trust__card-city svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.company-trust__card-city span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*
 * SVG-путь стрелки диагональный (M6 17L17 6...) — по макету (node-id=1105-787)
 * в состоянии покоя стрелка прямая (→), диагональной (как сейчас всегда)
 * становится только на hover. Не меняем сам path (два раза рисовать
 * незачем) — поворачиваем на 45° в покое, возвращаем на hover.
 */
.company-trust__card-arrow {
  width: 23px;
  height: auto;
  flex-shrink: 0;
  color: var(--color-white-60);
  transform: rotate(45deg);
  transition: transform 0.3s ease;
}

.company-trust__card:hover .company-trust__card-arrow {
  transform: rotate(0deg);
}

.company-trust__nav {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.company-trust__nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(38px, 3vw, 52px);
  height: clamp(38px, 3vw, 52px);
  border: 1px solid var(--color-white-40);
  border-radius: 50%;
  background: none;
  color: var(--color-white);
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.company-trust__nav-btn:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--color-white);
}

.company-trust__nav-btn svg {
  width: 16px;
  height: auto;
}

.company-trust__nav-btn--prev svg {
  transform: rotate(180deg);
}

/*
 * Tablet
 * Figma (768): node-id=1236-1481
 */

@media (min-width: 761px) and (max-width: 1024px) {
  .company-trust__inner {
    padding-left: 51px;
    padding-right: 51px;
  }

  .company-trust__eyebrow {
    font-size: 15px;
  }

  .company-trust__eyebrow-line {
    width: 30px;
  }

  .company-trust__title {
    font-size: 48px;
  }

  .company-trust__desc {
    font-size: 16px;
  }

  .company-trust__link {
    font-size: 14px;
  }

  .company-trust__features-link {
    font-size: 14px;
  }

  .company-trust__body {
    flex-wrap: wrap;
  }

  .company-trust__features {
    flex: 1 1 100%;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .company-trust__feature {
    flex: 1 1 300px;
  }

  .company-trust__cards {
    flex: 1 1 100%;
  }

  .company-trust__slide.swiper-slide {
    width: 220px;
  }

  .company-trust__card {
    height: 330px;
  }
}

/* ---------- Mobile ---------- */

@media (max-width: 760px) {
  .company-trust__inner {
    padding-left: 21px;
    padding-right: 21px;
  }

  .company-trust__eyebrow {
    font-size: 15px;
  }

  .company-trust__eyebrow-line {
    width: 30px;
  }

  .company-trust__title {
    font-size: 30px;
  }

  .company-trust__desc {
    font-size: 14px;
    max-width: none;
  }

  .company-trust__link {
    font-size: 14px;
  }

  .company-trust__features-link {
    font-size: 14px;
  }

  .company-trust__body {
    flex-direction: column;
  }

  .company-trust__features {
    flex: 1 1 auto;
    width: 100%;
  }

  .company-trust__feature {
    min-height: 83px;
  }

  .company-trust__feature-icon {
    width: 24px;
    height: 24px;
  }

  .company-trust__feature-text {
    font-size: 16px;
  }

  .company-trust__cards {
    /* .company-trust__body переходит в flex-direction:column на мобильном —
       унаследованный flex:1 1 1158px начинает трактоваться как высота
       (basis по главной оси, которая теперь вертикальная), а не ширина,
       раздувая блок до 1158px пустого места. Сбрасываем на auto. */
    flex: 1 1 auto;
    width: 100%;
  }

  .company-trust__slide.swiper-slide {
    width: 84%;
  }

  .company-trust__card {
    aspect-ratio: 348 / 521;
  }
}

/* End */


/* Start:/local/templates/assimettric-avl_s3/assets/vendor/swiper/swiper-bundle.min.css?179361469018466*/
/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */

@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
/* End */


/* Start:/local/templates/assimettric-avl_s3/components/bitrix/news.list/company_cta_contacts/style.css?17936146901051*/
/*
 * Block: company_cta_contacts (страница «О компании» — телефон/email
 * в панели баннера company-cta). Данные — ИБ 54 (тот же источник, что
 * header_contacts/footer_contacts). Обёртка .company-cta__panel и кнопка
 * .company-cta__btn — статика в kompaniya/index.php, стили — page-company.css.
 */

.company-cta__contact {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--color-white);
  text-decoration: none;
  font-size: clamp(14px, 1.15vw, 22px);
  font-weight: 500;
}

.company-cta__contact-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(38px, 2.9vw, 56px);
  height: clamp(38px, 2.9vw, 56px);
  flex-shrink: 0;
  border: 1px solid var(--color-icon-muted);
  border-radius: 50%;
  color: var(--color-white);
  backdrop-filter: blur(5.6px);
  -webkit-backdrop-filter: blur(5.6px);
}

.company-cta__contact-icon svg {
  width: 46%;
  height: 46%;
}

/* End */
/* /local/templates/assimettric-avl_s3/assets/css/pages/page-company.css?17936146886737 */
/* /local/templates/assimettric-avl_s3/components/bitrix/news.list/company_index/style.css?179361469014852 */
/* /local/templates/assimettric-avl_s3/components/bitrix/news.list/company_process/style.css?179361469011174 */
/* /local/templates/assimettric-avl_s3/components/bitrix/news.list/company_tech/style.css?17936146907301 */
/* /local/templates/assimettric-avl_s3/components/bitrix/news.list/company_trust/style.css?179361469019981 */
/* /local/templates/assimettric-avl_s3/assets/vendor/swiper/swiper-bundle.min.css?179361469018466 */
/* /local/templates/assimettric-avl_s3/components/bitrix/news.list/company_cta_contacts/style.css?17936146901051 */