/**
 * site.css
 * Кастомные стили поверх site-base.css.
 * Подключать после site-base.css.
 */

/* Шрифты — сочетание Sans + Mono (Apple-style)
   Sans: UI, заголовки, body, кнопки
   Mono: метки, даты, подписи, метрики */
:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
    "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "SF Mono", ui-monospace, "Roboto Mono", Menlo, Monaco, Consolas,
    "Liberation Mono", monospace;

  --_typography---font-family--primary: var(--font-sans);
  --_typography---font-family--secondary: var(--font-sans);
  --_typography---font-family--detail: var(--font-mono);

  --type-body-size: 1.0625rem;
  --type-body-leading: 1.47;
  --type-body-tracking: -0.016em;
  --type-lead-size: 1.3125rem;
  --type-lead-leading: 1.38;
  --type-prose-h2-size: 1.375rem;
  --type-prose-h2-leading: 1.25;

  /* Кастомный скроллбар — только thumb, без фона трека */
  --scrollbar-size: 5px;
  --scrollbar-thumb: rgba(17, 17, 17, 0.22);
  --scrollbar-thumb-hover: rgba(17, 17, 17, 0.38);
  --scrollbar-thumb-active: rgba(17, 17, 17, 0.5);

  --_typography---h1--line-height: 1.05;
  --_typography---h2--line-height: 1.08;
  --_typography---h3--line-height: 1.12;
  --_typography---h4--line-height: 1.15;
  --_typography---h5--line-height: 1.2;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--font-sans);
  font-size: var(--type-body-size);
  line-height: var(--type-body-leading);
  letter-spacing: var(--type-body-tracking);
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6,
.heading-style-h3,
.heading-style-h4,
.heading-style-h5,
.heading-style-h6 {
  font-family: var(--font-sans);
  font-weight: 600;
}

.text-style-label,
.pill_wrap .text-style-label,
.cta_pill {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.text-size-medium,
.post-header_component .text-size-medium,
.section_post-header .text-size-medium {
  font-size: var(--type-lead-size);
  line-height: var(--type-lead-leading);
  letter-spacing: -0.018em;
  font-weight: 400;
  color: var(--_colors---grey--300);
}

.text-rich-text,
.text-rich-text.w-richtext {
  font-size: var(--type-body-size);
  line-height: var(--type-body-leading);
  letter-spacing: var(--type-body-tracking);
}

.text-rich-text h2,
.text-rich-text.w-richtext h2,
.case-import .article-section h2 {
  margin-top: 2.5rem;
  margin-bottom: 0.75rem;
  font-size: var(--type-prose-h2-size);
  line-height: var(--type-prose-h2-leading);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.text-rich-text h2:first-child,
.case-import .article-section:first-child h2 {
  margin-top: 0;
}

.text-rich-text p,
.text-rich-text.w-richtext p,
.case-import .article-section p,
.case-import .article-section li {
  margin-bottom: 1.25rem;
  line-height: var(--type-body-leading);
}

.text-rich-text ul,
.text-rich-text ol,
.text-rich-text.w-richtext ul,
.text-rich-text.w-richtext ol {
  margin-bottom: 1.25rem;
  padding-left: 1.375rem;
}

.text-rich-text li + li,
.case-import .article-section li + li {
  margin-top: 0.375rem;
}

.text-rich-text strong,
.case-import strong {
  font-weight: 600;
}

.section_post-header .heading-style-h3 {
  letter-spacing: -0.025em;
  line-height: 1.12;
}

.blog-list_desc,
.work-list_desc,
.services_desc,
.brands_item-desc {
  line-height: 1.45;
  letter-spacing: -0.011em;
}

/* Work list: размеры как project-caption на alexyoung33rd.com */
.work-list_infos {
  grid-row-gap: 0.35rem;
  max-width: 100%;
}

.work-list_infos .heading-style-h6 {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.01em;
  color: var(--_colors---primary--black);
}

.work-list_infos .work-list_desc {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.4;
}

/* Work list: метрики как на старом сайте (project-caption-impact) */
.work-list_desc strong {
  font-weight: 500;
  color: var(--_colors---grey--400, #4a4a4a);
}

.case-results-table,
.case-import .results-table {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

.navbar_link-text,
.button_text,
.footer_link {
  letter-spacing: -0.01em;
}

/* Один sans-стек: перебиваем хардкод BDO Grotesk из site-base */
.about-team_text,
.about-team_text-2,
.home-header_heading,
.home-header_text,
.home-about_heading,
.home-about_img-text,
.footer_brand,
.heading-style-h1,
.heading-style-h2,
.newsletter_form .text-field,
.newsletter_form .text-field::placeholder {
  font-family: var(--font-sans);
}

.home-header_heading,
.footer_brand {
  font-weight: 600;
}

/* Mono — только метаданные, не смешивать с body-текстом */
.blog-list_content .text-style-label,
.post-header_infos .text-style-label,
.work-list_infos .heading-style-h6,
.blog-list_title,
.heading-style-h6 {
  font-family: var(--font-sans);
}

@media screen and (max-width: 991px) {
  :root {
    --_typography---font-family--primary: var(--font-sans);
    --_typography---font-family--secondary: var(--font-sans);
    --_typography---font-family--detail: var(--font-mono);
  }
}

@media screen and (max-width: 767px) {
  :root {
    --type-body-size: 1rem;
    --type-lead-size: 1.1875rem;
    --type-prose-h2-size: 1.25rem;
    --_typography---font-family--primary: var(--font-sans);
    --_typography---font-family--secondary: var(--font-sans);
    --_typography---font-family--detail: var(--font-mono);
  }
}

/* Без горизонтального скролла: 100vw + GSAP; контент может уходить за край */
html,
body {
  overflow-x: clip;
  max-width: 100%;
}

/* Скрываем нативный скроллбар (трек в Chrome/macOS не прозрачится через CSS).
   Вместо него — плавающий thumb в js/scroll-thumb.js */
html,
body {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

.scroll-thumb {
  position: fixed;
  top: 0;
  right: 3px;
  width: var(--scrollbar-size);
  border-radius: 999px;
  background: var(--scrollbar-thumb);
  z-index: 90;
  pointer-events: none;
  opacity: 0;
  transition:
    opacity 0.35s ease,
    background-color 0.2s ease;
}

.scroll-thumb.is-visible {
  opacity: 1;
}

.scroll-thumb.is-active {
  background: var(--scrollbar-thumb-hover);
}

@media (prefers-reduced-motion: reduce) {
  .scroll-thumb {
    transition: opacity 0.15s ease;
  }
}

body.blog-lightbox-open .scroll-thumb {
  display: none !important;
}

body > .navbar {
  pointer-events: none;
}

body > .navbar * {
  pointer-events: auto;
}

/* clip на body, не на page-wrapper — иначе position:fixed у navbar ломается при скролле */
.page-wrapper {
  overflow-x: visible;
  width: 100%;
  max-width: 100%;
}

/* Скрытие badge */
.w-webflow-badge {
  display: none !important;
}

/* Чёрно-белые градиенты: лейблы (Services, Experience…), кнопки */
:root {
  --gradient-accent: linear-gradient(
    90deg,
    #0a0a0a 0%,
    #3f3f3f 28%,
    #8a8a8a 55%,
    #c4c4c4 78%,
    #f0f0f0 100%
  );
  /* Pill-ссылки: лёгкий тёмный shimmer на hover */
  --gradient-nav-link-hover: linear-gradient(
    90deg,
    #ffffff 0%,
    #b0b0b0 14%,
    #ffffff 28%,
    #8a8a8a 42%,
    #fafafa 56%,
    #9a9a9a 70%,
    #ffffff 84%,
    #a8a8a8 100%
  );
  --gradient-ball-1: linear-gradient(to right, #171717, #737373);
  --gradient-ball-2: linear-gradient(78deg, #525252, #d4d4d4);
  --gradient-button-light: linear-gradient(165deg, #fafafa 0%, #e8e8e8 48%, #d6d6d6 100%);
  --gradient-button-solid: linear-gradient(165deg, #262626 0%, #0a0a0a 100%);
  --gradient-button-solid-hover: linear-gradient(165deg, #404040 0%, #171717 100%);
  /* Общий отступ плавающих logo + pill от краёв viewport */
  --navbar-float-top: calc(32px + env(safe-area-inset-top, 0px));
  --navbar-float-bottom: max(var(--fixed--1-25rem), env(safe-area-inset-bottom, 0px));
  /* Высота pill и кнопки «наверх» — одна линия по центру */
  --navbar-float-pill-height: 3.25rem;
  --navbar-tab-muted: rgba(255, 255, 255, 0.46);
  --back-to-top-size: 2.25rem;
  --navbar-text-size: var(--fixed--1rem, 1rem);
  --navbar-cta-pad-y: 12px;
  --navbar-cta-pad-x: 20px;
  --navbar-cta-radius: 12px;
}

/* label_wrap: треугольник логотипа вместо градиентной черты — высота = строка label */
.label_wrap {
  font-size: var(--fixed--0-875rem, 0.875rem);
  color: inherit;
}

.label_mark {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  line-height: 0;
}

.label_mark-svg {
  display: block;
  height: 1em;
  width: auto;
  aspect-ratio: 13.056 / 12.7996;
}

/* Старый класс — если остался в экспорте Webflow */
.label_line {
  display: inline-block;
  width: calc(1em * 13.056 / 12.7996);
  height: 1em;
  flex-shrink: 0;
  background-color: currentColor;
  background-image: none;
  vertical-align: middle;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.056 12.7996'%3E%3Cpath fill='black' fill-rule='evenodd' d='M6.00959 1.01906C6.25166 0.577349 6.88355 0.577398 7.12562 1.01906L13.0561 11.8515C13.2893 12.2779 12.9819 12.7996 12.4974 12.7996H0.637757C0.153273 12.7996 -0.153662 12.278 0.0797331 11.8515L6.00959 1.01906Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.056 12.7996'%3E%3Cpath fill='black' fill-rule='evenodd' d='M6.00959 1.01906C6.25166 0.577349 6.88355 0.577398 7.12562 1.01906L13.0561 11.8515C13.2893 12.2779 12.9819 12.7996 12.4974 12.7996H0.637757C0.153273 12.7996 -0.153662 12.278 0.0797331 11.8515L6.00959 1.01906Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.button_gradient-ball.ball-1 {
  background-color: #525252;
  background-image: var(--gradient-ball-1);
}

.button_gradient-ball.ball-2 {
  background-image: var(--gradient-ball-2);
}

.button:where(.w-variant-b8634f3d-4f7e-297a-e558-b94b09f0008b),
.button:where(.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2) {
  background-image: var(--gradient-button-light);
}

.button-solid {
  background-image: var(--gradient-button-solid);
}

.button-solid:hover {
  background-image: var(--gradient-button-solid-hover);
}

/* Hero-коллаж → css/hero-collage.css */
.section_home-header .home-header_img-wrap.hero-collage__card,
.section_home-header .hero-collage__flip,
.section_home-header .hero-collage__face {
  background-color: transparent !important;
  box-shadow: none !important;
}

.section_home-header .home-header_img-wrap.hero-collage__card::before,
.section_home-header .home-header_img-wrap.hero-collage__card::after,
.section_home-header .hero-collage__flip::before,
.section_home-header .hero-collage__flip::after {
  display: none !important;
  content: none !important;
}

/* Home about: pill по контенту + плавный разворот (размеры в JS, без scale) */
.home-about_sticky {
  position: sticky;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
}

.home-about_component {
  position: relative;
  box-sizing: border-box;
  transition: none !important;
}

/* Pill и stage: одна grid-схема на весь scroll, без смены flex/column */
.home-about_component.home-about--pill,
.home-about_component.home-about--stage.home-about--row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center !important;
  width: 100% !important;
  max-width: 100%;
  height: auto !important;
  padding: 0.35rem 0 !important;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}

.home-about_heading {
  position: static !important;
  color: var(--_colors---primary--black, #111);
  z-index: 3;
  pointer-events: none;
  white-space: nowrap;
}

.home-about_heading._1 {
  grid-column: 1;
  justify-self: end;
  text-align: right;
  padding-right: 0.25rem;
  right: auto !important;
  left: auto !important;
}

.home-about_heading._2 {
  grid-column: 3;
  justify-self: start;
  text-align: left;
  padding-left: 0.25rem;
  right: auto !important;
  left: auto !important;
}

.home-about_img-wrap {
  background-color: #000;
  border-radius: inherit;
  overflow: clip;
  position: relative;
  z-index: 1;
  transition: none !important;
}

.home-about_component.home-about--pill .home-about_img-wrap,
.home-about_component.home-about--stage.home-about--row .home-about_img-wrap {
  grid-column: 2;
  justify-self: center;
  width: fit-content;
  height: auto;
  max-width: 100%;
  border-radius: 9999px;
  flex-shrink: 0;
}

.home-about_img-wrap::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 1);
  opacity: var(--home-about-scrim, 0.42);
  pointer-events: none;
  border-radius: inherit;
}

.home-about_img-wrap.animation-scroll-border::before {
  opacity: 0;
}

.home-about_img-text {
  color: var(--_colors---primary--white, #fff);
  position: relative;
  inset: auto;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  white-space: nowrap;
  padding: 0.55rem 1.35rem;
  font-family: var(--_typography---h3--font-family);
  font-size: var(--_typography---h3--font-size);
  line-height: var(--_typography---h3--line-height);
  font-weight: var(--_typography---h3--font-weight);
  letter-spacing: var(--_typography---h3--letter-spacing);
  text-align: center;
  margin: 0;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.65);
  flex-shrink: 0;
}

.home-about_img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  will-change: opacity;
  opacity: 0.55;
  object-fit: cover;
  object-position: center center;
  transform: none !important;
  translate: none !important;
  rotate: none !important;
  scale: none !important;
}

/* Текст только в pill до разворота; в развёрнутом блоке — только видео */
.home-about_img-wrap.animation-scroll-border .home-about_img-text,
.home-about_component.animation-scroll-padding .home-about_img-text {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* iPad: home-about — без «пустого» 100vh, крупнее pill и подписи */
@media screen and (min-width: 768px) and (max-width: 991px) {
  .home-about_wrapper {
    height: 96rem;
  }

  .home-about_sticky {
    height: auto;
    min-height: 0;
    max-height: none;
    align-items: center;
    justify-content: center;
    padding: clamp(2.5rem, 12vh, 5rem) 1rem;
    box-sizing: border-box;
  }

  .home-about_component.home-about--pill {
    width: min(94vw, 42rem) !important;
    max-width: 42rem;
    margin-inline: auto;
    padding: 0.5rem 0 !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    column-gap: 0.5rem;
  }

  .home-about_component.home-about--stage.home-about--row {
    width: 100% !important;
    max-width: 100%;
    margin-inline: 0;
    padding: 0.5rem 0 !important;
  }

  .home-about_heading {
    font-size: clamp(1.35rem, 3.25vw, 2rem);
    line-height: 1.15;
  }

  .home-about_heading._1 {
    padding-right: 0.5rem;
  }

  .home-about_heading._2 {
    padding-left: 0.5rem;
  }

  .home-about_component.home-about--pill .home-about_img-wrap,
  .home-about_component.home-about--stage.home-about--row .home-about_img-wrap {
    min-width: 11rem;
    min-height: 3rem;
  }

  .home-about_img-text {
    font-size: clamp(0.9375rem, 2.1vw, 1.1875rem);
    line-height: 1.2;
    padding: 0.7rem 1.6rem;
    white-space: nowrap;
    width: auto;
    max-width: none;
  }
}

/* Footer: колонки сверху вниз (grid-auto-flow: column), не строки слева направо */
.footer_lists.footer_lists--grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(5.5rem, auto));
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
  column-gap: 2rem;
  row-gap: 0.35rem;
  align-items: start;
  width: auto;
  max-width: none;
}

.footer_lists.footer_lists--grid .footer_link {
  white-space: nowrap;
}

.footer_link.footer_link--has-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.footer_link-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.4rem;
  border-radius: 9999px;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--_colors---primary--white, #fff);
  background-color: var(--_colors---primary--black, #111);
  flex-shrink: 0;
}

@media screen and (max-width: 767px) {
  .footer_lists.footer_lists--grid {
    grid-template-columns: repeat(2, minmax(4.5rem, auto));
    grid-template-rows: repeat(5, auto);
    column-gap: 1.25rem;
  }
}

.footer_legal-links {
  width: 100%;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.footer_langs {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem 1rem;
  margin-left: auto;
}

.footer_lang {
  color: var(--_colors---grey--300);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: color 0.2s;
}

.footer_lang:hover,
.footer_lang.is-active {
  color: var(--_colors---primary--black);
}

.footer_lang.is-active {
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .footer_legal-links {
    flex-flow: column;
    align-items: flex-start;
  }

  .footer_langs {
    margin-left: 0;
    justify-content: flex-start;
  }
}

/* Brands: текстовые «логотипы» компаний вместо SVG */
.brands_item-logo-wrap--text {
  background-color: var(--_colors---primary--white);
  padding: 1.5rem 1.25rem;
}

.brands_item-logo-wrap--text .brands_item-logo {
  display: none;
}

.brands_item-wordmark {
  font-family: var(--_typography---h4--font-family);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  line-height: 1.1;
  font-weight: var(--_typography---font-weight--medium);
  letter-spacing: -0.03em;
  text-align: center;
  color: var(--_colors---primary--black);
  max-width: 12rem;
}

.brands_item-block:has(.brands_item-wordmark) .brands_item-name {
  display: none;
}

/* Experience / Services: убрать пунктирную линию (.line) перед контентом */
#section-brands > .padding-global.is-tiny,
.section_services > .padding-global.is-tiny {
  display: none;
}

/* Work: без счётчика кейсов в заголовке секции */
.work-list_number-wrap {
  display: none;
}

/* Work list: чёрные маски вместо превью (пропорции 16:9 и 3:2 из site-base) */
.work-list_image-main,
.work-list_image-second {
  overflow: hidden;
  background-color: #000;
  isolation: isolate;
}

.work-list_image-main {
  contain: layout paint;
}

.work-list_img-main,
.work-list_img-second {
  background-color: #000;
  display: block;
}

/* Work list: video как img — absolute + cover, без intrinsic overflow */
video.work-list_img-main.work-list_video {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center top;
  pointer-events: none;
  transform-origin: center center;
}

/* About team: чёрная маска вместо фото профиля */
.about-team_img-wrap {
  background-color: #000;
}

.about-team_img-wrap .about-team_img {
  background-color: #000;
  display: block;
}

/* Services: чёрные маски вместо превью (пропорция 3:2 в site-base) */
.services_img-wrap {
  background-color: #000;
}

.services_img-wrap .services_img {
  background-color: #000;
  display: block;
}

/* Newsletter: подпись только в placeholder инпута */
.newsletter_form .newsletter_label-wrap,
.newsletter_form .spacer-custom-2 {
  display: none;
}

.newsletter_form .text-field::placeholder {
  color: var(--_colors---grey--400);
  font-size: var(--fixed--3-5rem);
  font-weight: var(--_typography---font-weight--medium);
}

/* Blog list: временная маска 16:9 — плавный градиент (пока нет обложек) */
.blog-list_img-wrap {
  position: relative;
  background-color: #eceae4;
}

.blog-list_img-wrap .blog-list_img:not(.blog-list_img--cover) {
  aspect-ratio: 16 / 9;
  display: block;
  width: 100%;
  background-color: #f2f1ed;
  background-image: linear-gradient(
    128deg,
    #f2f1ed 0%,
    #ebe8e0 24%,
    #e4ebe8 52%,
    #e6e0ec 76%,
    #efe8e6 100%
  );
}

.blog-list_img-wrap .blog-list_img--cover {
  aspect-ratio: 16 / 9;
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
  background-color: #fff;
}

.blog-list_img-wrap:has(.blog-list_img--cover)::after {
  display: none;
}

/* Чуть разный угол/оттенок у карточек — не одинаковые плашки */
.blog-list_item:nth-child(1) .blog-list_img:not(.blog-list_img--cover) {
  background-image: linear-gradient(
    112deg,
    #f2f1ed 0%,
    #ede6dc 28%,
    #dce8ee 54%,
    #e8e2ec 80%,
    #f0ebe8 100%
  );
}

.blog-list_item:nth-child(2) .blog-list_img:not(.blog-list_img--cover) {
  background-image: linear-gradient(
    148deg,
    #eceae4 0%,
    #e8ebe4 32%,
    #e0e8f0 58%,
    #ebe4ea 84%,
    #f2f1ed 100%
  );
}

.blog-list_item:nth-child(3) .blog-list_img:not(.blog-list_img--cover) {
  background-image: linear-gradient(
    102deg,
    #f0efe9 0%,
    #e6ebe6 38%,
    #e8e4ef 68%,
    #eeeae6 100%
  );
}

/* Мягкая тень в углу — как на gradient.webp */
.blog-list_img-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(
    108deg,
    rgba(10, 10, 10, 0.22) 0%,
    rgba(10, 10, 10, 0.06) 28%,
    transparent 52%
  );
}

/* Blog index: вертикальный список как Cases (work-list), не сетка blog-list */
.blog-index-content .blog-index-list {
  display: flex;
  flex-flow: column;
  grid-template-columns: none;
  grid-column-gap: var(--fixed--7rem);
  grid-row-gap: var(--fixed--7rem);
  width: 100%;
}

.blog-index-content .work-list_item {
  width: 100%;
}

.blog-index-content .work-list_block.blog-list_block {
  grid-column-gap: 2.25rem;
  grid-row-gap: 2.25rem;
  flex-flow: column;
  perspective: 1200px;
}

.blog-index-content .work-list_infos {
  align-items: center;
  text-align: center;
}

.blog-index-content .work-list_infos .work-list_desc {
  text-align: center;
  max-width: 100%;
}

.blog-index-content .work-list_image-main .blog-list_img--cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center;
}

.blog-index-content .work-list_infos .blog-index_date {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--_colors---grey--300);
}

.blog-index-content .work-list_image-main .blog-list_img:not(.blog-list_img--cover) {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

@media screen and (max-width: 991px) {
  .blog-index-content .blog-index-list {
    grid-column-gap: var(--fixed--4-5rem);
    grid-row-gap: var(--fixed--4-5rem);
  }
}

@media screen and (max-width: 767px) {
  .blog-index-content .blog-index-list {
    grid-column-gap: var(--fixed--3rem);
    grid-row-gap: var(--fixed--3rem);
  }

  .blog-index-content .work-list_block.blog-list_block {
    grid-column-gap: 1.25rem;
    grid-row-gap: 1.25rem;
  }
}

/* Newsletter в футере: оригинальные стили section_newsletter, на всю ширину wrap */
.footer .footer_newsletter {
  width: 100%;
  max-width: none;
  align-self: stretch;
  margin-top: var(--fixed--1-5rem, 1.5rem);
}

.footer .footer_newsletter .newsletter_component {
  width: 100%;
  max-width: none;
  align-items: stretch;
}

.footer .footer_newsletter .newsletter_form-block,
.footer .footer_newsletter .newsletter_form,
.footer .footer_newsletter .input-wrapper {
  width: 100%;
  max-width: none;
}

.footer .footer_newsletter .text-field {
  width: 100%;
  max-width: none;
  display: block;
  box-sizing: border-box;
  background-color: #f2f1ed;
}

/* «Other blog posts» внизу статей — компактная сетка */
.section_blog-list:has(.blog_other-label) .blog-list_list {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  grid-column-gap: 1rem;
  grid-row-gap: 1.25rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.section_blog-list:has(.blog_other-label) .blog-list_item {
  min-width: 0;
}

.section_blog-list:has(.blog_other-label) .blog-list_block {
  grid-column-gap: 0.625rem;
  grid-row-gap: 0.625rem;
  height: 100%;
}

.section_blog-list:has(.blog_other-label) .blog-list_img-wrap {
  aspect-ratio: 3 / 2;
  max-height: 9.5rem;
}

.section_blog-list:has(.blog_other-label) .blog-list_img-wrap .blog-list_img:not(.blog-list_img--cover),
.section_blog-list:has(.blog_other-label) .blog-list_img-wrap .blog-list_img--cover {
  aspect-ratio: 3 / 2;
  width: 100%;
  height: 100%;
  max-height: 9.5rem;
  object-fit: cover;
}

.section_blog-list:has(.blog_other-label) .blog-list_content {
  grid-column-gap: 0.35rem;
  grid-row-gap: 0.35rem;
  max-width: 100%;
}

.section_blog-list:has(.blog_other-label) .blog-list_content .text-style-label {
  font-size: 0.6875rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.section_blog-list:has(.blog_other-label) .heading-style-h5 {
  font-size: 1.0625rem;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.section_blog-list:has(.blog_other-label) .blog-list_desc {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--_colors---grey--400, #727067);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

@media screen and (max-width: 991px) {
  .section_blog-list:has(.blog_other-label) .blog-list_list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 767px) {
  .section_blog-list:has(.blog_other-label) .blog-list_list {
    display: grid;
    grid-template-columns: 1fr;
    grid-row-gap: 1rem;
  }

  .section_blog-list:has(.blog_other-label) .blog-list_img-wrap,
  .section_blog-list:has(.blog_other-label) .blog-list_img-wrap .blog-list_img:not(.blog-list_img--cover),
  .section_blog-list:has(.blog_other-label) .blog-list_img-wrap .blog-list_img--cover {
    max-height: 11rem;
  }
}

/* Ссылки в статьях: серая пунктирная линия снизу; hover — сплошное подчёркивание */
.text-rich-text a {
  text-decoration: underline dotted;
  text-decoration-color: var(--_colors---grey--200);
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
  transition: text-decoration-color 0.2s ease, text-decoration-style 0.2s ease;
}

.text-rich-text a:hover {
  text-decoration-style: solid;
  text-decoration-color: currentColor;
}

.blog-list_block .blog-list_title {
  text-decoration: none;
  text-underline-offset: 0.12em;
  transition: text-decoration-color 0.2s ease;
}

.blog-list_block:hover .blog-list_title {
  text-decoration: underline;
}

.footer_link {
  text-decoration: none;
  text-underline-offset: 0.12em;
  transition: text-decoration-color 0.2s ease;
}

.footer_link:hover {
  text-decoration: underline;
}

.navbar_links-wrap .navbar_link-label {
  text-decoration: none;
  text-underline-offset: 0.14em;
  transition: text-decoration-color 0.2s ease;
}

.navbar_links-wrap .navbar_link:hover .navbar_link-label {
  text-decoration: none;
}

/* Blog post: кнопка «назад в Blog» вместо pill Blog post */
.section_post-header .blog-back {
  margin: 0;
}

.section_post-header .blog-back__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.2rem 0.85rem 0.2rem 0.2rem;
  border-radius: 999px;
  background-color: rgba(231, 230, 224, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.07);
  color: var(--_colors---grey--400, #5a5a5a);
  text-decoration: none;
  transition:
    background-color 0.22s ease,
    color 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.section_post-header .blog-back__btn:hover {
  background-color: #dfded6;
  border-color: rgba(0, 0, 0, 0.1);
  color: var(--_colors---primary--black, #111);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
  text-decoration: none;
}

.section_post-header .blog-back__btn:hover .blog-back__label {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.section_post-header .blog-back__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.625rem;
  height: 1.625rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.72);
  flex-shrink: 0;
  transition:
    background-color 0.22s ease,
    transform 0.22s ease;
}

.section_post-header .blog-back__btn:hover .blog-back__icon {
  background: #fff;
  transform: translateX(-2px);
}

.section_post-header .blog-back__label {
  font-size: var(--fixed--0-875rem, 0.875rem);
  font-weight: var(--_typography---font-weight--medium, 500);
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.section_post-header .post-header_date {
  color: var(--_colors---grey--400, #727067);
  font-size: var(--fixed--0-875rem, 0.875rem);
  font-weight: var(--_typography---font-weight--medium, 500);
  letter-spacing: -0.01em;
}

.section_post-header .post-header_infos {
  align-items: center;
}

/* Hero статьи: 16:9, без жёсткого кропа портретных иллюстраций */
.section_post-header .post-header_image-wrap {
  width: 100%;
}

.section_post-header .post-header_image {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: auto;
  display: block;
}

/* Диаграммы в тексте — полная ширина колонки, пропорции сохраняются */
.text-rich-text figure.blog-figure {
  margin: 0 0 2.5rem;
  width: 100%;
  max-width: 100%;
}

.text-rich-text figure.blog-figure--diagram {
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.text-rich-text figure.blog-figure img,
.text-rich-text figure.blog-figure object {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: var(--border-radius--medium, 0.75rem);
}

.text-rich-text figure.blog-figure img[role="button"] {
  cursor: zoom-in;
  transition: opacity 0.2s ease;
}

.text-rich-text figure.blog-figure img[role="button"]:hover {
  opacity: 0.92;
}

.text-rich-text figure.blog-figure img[role="button"]:focus-visible {
  outline: 2px solid var(--_colors---grey--300, #727067);
  outline-offset: 4px;
}

/* Лайтбокс диаграмм в статьях блога */
body.blog-lightbox-open {
  overflow: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html:has(body.blog-lightbox-open) {
  scrollbar-width: none;
}

html:has(body.blog-lightbox-open)::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

body.blog-lightbox-open::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.blog-lightbox {
  display: none;
  position: fixed;
  z-index: 10000;
  inset: 0;
  margin: 0;
  padding: 0;
  background: rgba(10, 10, 10, 0.9);
  backdrop-filter: blur(8px);
  overflow: hidden;
}

.blog-lightbox.is-open {
  display: block !important;
}

.blog-lightbox__close {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 10002;
  width: 2.75rem;
  height: 2.75rem;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.blog-lightbox__close:hover {
  background: rgba(255, 255, 255, 0.28);
}

.blog-lightbox__frame {
  position: fixed;
  inset: 0;
  z-index: 10001;
  overflow: auto;
  padding: 4rem 1.25rem 1.25rem;
  box-sizing: border-box;
  text-align: center;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.blog-lightbox__frame::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* Вертикальное центрирование в scroll-контейнере */
.blog-lightbox__frame::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.blog-lightbox__img {
  display: inline-block;
  vertical-align: middle;
  max-width: min(94vw, 1100px);
  max-height: min(86vh, 1600px);
  width: auto;
  height: auto;
  border-radius: var(--border-radius--medium, 0.75rem);
  background: #fff;
  cursor: zoom-in;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.4);
  pointer-events: auto;
}

.blog-lightbox[data-mode="full"] .blog-lightbox__img {
  max-width: none !important;
  max-height: none !important;
  cursor: zoom-out;
}

@media (max-width: 767px) {
  .blog-lightbox__close {
    top: 0.65rem;
    right: 0.65rem;
  }

  .blog-lightbox__frame {
    padding: 3.5rem 0.5rem 0.75rem;
  }
}

.text-rich-text figure.blog-figure--diagram img[src$=".svg"] {
  background: transparent;
  border: none;
}

.text-rich-text figure.blog-figure figcaption {
  margin-top: 0.75rem;
  color: var(--_colors---grey--400, #727067);
  font-size: var(--fixed--0-875rem, 0.875rem);
  line-height: 1.4;
  text-align: center;
}

/* Blockquote: серая кавычка слева, текст без «» в разметке */
.text-rich-text blockquote,
.text-rich-text.w-richtext blockquote {
  position: relative;
  margin: 2rem 0 2.5rem;
  padding: 0.125rem 0 0.125rem 3.5rem;
  border: none;
  border-left: none;
  font-weight: 500;
}

.text-rich-text blockquote::before,
.text-rich-text.w-richtext blockquote::before {
  content: "\201C";
  position: absolute;
  left: 0;
  top: -0.12em;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: clamp(3.25rem, 7vw, 4.75rem);
  font-weight: 700;
  line-height: 1;
  color: #d4d4d8;
  pointer-events: none;
  user-select: none;
}

.text-rich-text blockquote p,
.text-rich-text.w-richtext blockquote p {
  margin: 0 0 0.75rem;
  font-size: clamp(1.3125rem, 2.2vw, 1.5rem);
  line-height: 1.38;
  letter-spacing: -0.02em;
  font-weight: 500;
  font-style: italic;
  color: var(--_colors---grey--900, #1a1a18);
}

.text-rich-text blockquote cite,
.text-rich-text.w-richtext blockquote cite {
  display: block;
  margin-top: 0.375rem;
  font-size: 1rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.4;
  color: var(--_colors---grey--400, #727067);
}

@media screen and (max-width: 767px) {
  .text-rich-text blockquote,
  .text-rich-text.w-richtext blockquote {
    padding-left: 2.75rem;
  }

  .text-rich-text blockquote::before,
  .text-rich-text.w-richtext blockquote::before {
    font-size: 3.5rem;
  }

  .text-rich-text blockquote p,
  .text-rich-text.w-richtext blockquote p {
    font-size: 1.25rem;
    line-height: 1.42;
  }
}

/* Кнопка «наверх» — справа, на одной линии с pill navbar */
.back-to-top {
  position: fixed;
  right: calc(32px + env(safe-area-inset-right, 0px));
  bottom: calc(
    var(--navbar-float-bottom, 1.25rem) +
    (var(--navbar-float-pill-height, 3.25rem) - var(--back-to-top-size, 2.25rem)) / 2
  );
  z-index: 302;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--back-to-top-size, 2.25rem);
  height: var(--back-to-top-size, 2.25rem);
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 50%;
  background-color: rgba(12, 12, 12, 0.52);
  -webkit-backdrop-filter: blur(16px) saturate(165%);
  backdrop-filter: blur(16px) saturate(165%);
  color: #fff;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease,
    transform 0.25s ease,
    background-color 0.2s ease,
    border-color 0.2s ease;
}

.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.back-to-top:hover {
  background-color: rgba(12, 12, 12, 0.68);
  border-color: rgba(255, 255, 255, 0.18);
}

.back-to-top__icon {
  display: block;
}

@media screen and (max-width: 767px) {
  :root {
    --navbar-mobile-inset-x: 1rem;
    --navbar-mobile-inset-bottom: max(1rem, env(safe-area-inset-bottom, 0px));
    --navbar-float-bottom: var(--navbar-mobile-inset-bottom);
    --navbar-float-pill-height: 6.75rem;
    --navbar-tab-muted: rgba(255, 255, 255, 0.42);
    --back-to-top-size: 2rem;
  }

  .back-to-top {
    right: calc(var(--navbar-mobile-inset-x, 1rem) + env(safe-area-inset-right, 0px));
    bottom: calc(
      var(--navbar-mobile-inset-bottom, 1rem) + var(--navbar-float-pill-height, 7.25rem) + 0.5rem
    );
  }

  .back-to-top__icon {
    width: 12px;
    height: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .back-to-top {
    transition: opacity 0.15s ease, visibility 0.15s ease;
  }
}

/* Navbar: логотип внутри нижнего pill */
.navbar_logo-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: 0;
  inset-block-start: 0;
  margin: 0;
  flex-shrink: 0;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  color: #fff;
  transition: color 0.3s ease, opacity 0.3s ease;
}

.navbar_links-wrap .navbar_logo-wrap {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  pointer-events: auto;
}

.navbar_links-wrap .navbar_logo.logo-svg {
  width: 60px;
  max-width: 60px;
  opacity: 0.95;
}

.navbar_links-wrap .navbar_logo-wrap:hover {
  color: #fff;
  opacity: 1;
}

.navbar_links-wrap .navbar_logo-wrap:hover .navbar_logo.logo-svg {
  opacity: 1;
  transform: translateY(-1px);
}

/* Navbar: pill снизу на всех брейкпоинтах */
.navbar {
  position: fixed;
  inset: 0;
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 0;
  z-index: 300;
  background: transparent;
  pointer-events: none;
}

.navbar > .padding-global {
  position: static;
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  pointer-events: none;
}

.navbar_component {
  display: block;
  width: 100%;
  height: 0;
  min-height: 0;
  overflow: visible;
  pointer-events: none;
}

.navbar_hamburger-wrap {
  display: none !important;
}

.navbar_logo-wrap:hover {
  color: inherit;
}

.navbar_logo.logo-svg {
  display: block;
  width: 60px;
  max-width: 60px;
  height: auto;
  overflow: visible;
  opacity: 0.9;
  transition:
    opacity 0.3s ease,
    transform 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.navbar_logo-wrap:hover .navbar_logo.logo-svg {
  opacity: 1;
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce) {
  .navbar_logo.logo-svg {
    transition: color 0.3s ease;
    opacity: 1;
  }

  .navbar_logo-wrap:hover .navbar_logo.logo-svg {
    transform: none;
  }
}

/* Navbar pill: снизу на всех брейкпоинтах */
.navbar_links-wrap {
  isolation: isolate;
  position: fixed !important;
  bottom: var(--navbar-float-bottom) !important;
  top: auto !important;
  left: 50% !important;
  right: auto !important;
  margin: 0;
  z-index: 301;
  pointer-events: auto;
  display: flex !important;
  opacity: 1;
  visibility: visible;
  flex-flow: row nowrap;
  align-items: center;
  gap: var(--fixed--1rem, 1rem);
  overflow: visible;
  width: max-content !important;
  min-width: max-content;
  max-width: calc(100vw - 1.5rem);
  flex-shrink: 0;
  box-sizing: border-box;
  transform: translateX(-50%);
  background-color: rgba(12, 12, 12, 0.52);
  -webkit-backdrop-filter: blur(20px) saturate(165%);
  backdrop-filter: blur(20px) saturate(165%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.06),
    0 8px 24px rgba(0, 0, 0, 0.18),
    0 20px 40px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  transition:
    background-color 0.3s ease,
    box-shadow 0.3s ease,
    transform 0.32s cubic-bezier(0.25, 0.1, 0.25, 1),
    opacity 0.28s ease,
    visibility 0.28s ease,
    border-color 0.3s ease;
}

.navbar_links-wrap .navbar_links {
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 0.2rem;
  width: auto;
  max-width: none;
  flex: 0 0 auto;
  grid-column-gap: 0;
  grid-row-gap: 0;
  overflow: visible;
  padding: 0;
  background: transparent;
}

/* Скользящий highlight активного таба */
.navbar_tab-indicator {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 1px 3px rgba(0, 0, 0, 0.12);
  pointer-events: none;
  opacity: 0;
  will-change: transform, width, height;
  transition:
    transform 0.42s cubic-bezier(0.34, 1.15, 0.64, 1),
    width 0.42s cubic-bezier(0.34, 1.15, 0.64, 1),
    height 0.38s cubic-bezier(0.34, 1.15, 0.64, 1),
    opacity 0.2s ease;
}

@media (prefers-reduced-motion: reduce) {
  .navbar_tab-indicator {
    transition: opacity 0.15s ease;
  }
}

/* Dock tabs: активный — иконка + текст в pill; остальные — только иконка */
.navbar_links-wrap .navbar_links .navbar_link.w-inline-block {
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  flex-direction: row !important;
  flex-shrink: 0;
  justify-content: center !important;
  align-items: center !important;
  align-self: center !important;
  overflow: visible !important;
  height: auto !important;
  min-height: 0 !important;
  width: max-content;
  min-width: 2.5rem;
  padding: 0.5rem 0.55rem;
  gap: 0;
  position: relative;
  z-index: 1;
  vertical-align: middle;
  line-height: 1.2;
  border-radius: 999px;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.25s ease;
}

.navbar_links-wrap .navbar_links .navbar_link.w--current {
  gap: 0.35rem;
  padding: 0.5rem 0.7rem 0.5rem 0.55rem;
}

.navbar_links-wrap .navbar_link-label {
  display: inline-block;
  color: rgba(255, 255, 255, 0.72);
  -webkit-text-fill-color: rgba(255, 255, 255, 0.72);
  background: none;
  background-image: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  transition: color 0.25s ease, -webkit-text-fill-color 0.25s ease;
}

.navbar_links-wrap .navbar_link:hover .navbar_link-label,
.navbar_links-wrap .navbar_link:focus-visible .navbar_link-label {
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: none;
  background-image: none;
}

.navbar_links-wrap .navbar_links .navbar_link:not(.w--current):hover .navbar_tab-icon,
.navbar_links-wrap .navbar_links .navbar_link:not(.w--current):focus-visible .navbar_tab-icon {
  color: rgba(255, 255, 255, 0.78);
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
  .navbar_links-wrap .navbar_link-label {
    color: #fff;
    -webkit-text-fill-color: currentColor;
    background: none;
  }

  .navbar_links-wrap .navbar_link:hover .navbar_link-label,
  .navbar_links-wrap .navbar_link:focus-visible .navbar_link-label {
    color: #fff;
    -webkit-text-fill-color: #fff;
  }
}

@media (prefers-reduced-motion: reduce) {
  .navbar_links-wrap .navbar_link:hover .navbar_link-label,
  .navbar_links-wrap .navbar_link:focus-visible .navbar_link-label {
    color: #fff;
    -webkit-text-fill-color: #fff;
    background: none;
    background-image: none;
  }
}

/* Webflow export: column + _2 снизу — отключаем, оставляем плоский label как на iPad */
.navbar_links-wrap .navbar_links .navbar_link {
  flex-flow: row nowrap !important;
  flex-direction: row !important;
  align-items: center !important;
  overflow: visible !important;
}

.navbar_links-wrap .navbar_link-text._1,
.navbar_links-wrap .navbar_link-text._2 {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  transform: none !important;
}

.navbar_links-wrap .navbar_link:hover .navbar_link-text._1,
.navbar_links-wrap .navbar_link:hover .navbar_link-text._2 {
  transform: none !important;
}

.navbar_links-wrap .navbar_link-label {
  display: inline-block !important;
  visibility: visible !important;
  position: static !important;
  top: auto !important;
  width: max-content;
  max-width: 8rem;
  height: auto;
  margin: 0;
  padding: 0;
  line-height: 1.15;
  white-space: nowrap;
  pointer-events: auto !important;
  font-size: var(--navbar-text-size, 1rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  transform: none !important;
  transition:
    opacity 0.28s ease,
    max-width 0.38s cubic-bezier(0.34, 1.1, 0.64, 1),
    margin 0.38s cubic-bezier(0.34, 1.1, 0.64, 1),
    color 0.25s ease;
}

.navbar_links-wrap .navbar_link:hover .navbar_link-label,
.navbar_links-wrap .navbar_link:focus-visible .navbar_link-label {
  transform: none !important;
}

@media screen and (max-width: 767px) {
  .navbar_links-wrap .navbar_links .navbar_link:not(.w--current) .navbar_link-label {
    width: 0 !important;
    max-width: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }
}

.navbar_links-wrap .navbar_links .navbar_link.w--current .navbar_link-label {
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: none;
  background-image: none;
  opacity: 1 !important;
  font-weight: 600;
}

.navbar_links-wrap:not(.is-scroll-hidden):hover {
  background-color: rgba(12, 12, 12, 0.62);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.08),
    0 12px 32px rgba(0, 0, 0, 0.22),
    0 24px 48px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
  transform: translateX(-50%) translateY(-2px);
}

/* Web (≥768px): классический pill — все подписи, без dock-иконок и без Webflow hover */
@media screen and (min-width: 768px) {
  .navbar_links-wrap {
    padding: var(--fixed--0-5rem) var(--fixed--0-5rem) var(--fixed--0-5rem) var(--fixed--1-75rem) !important;
    gap: var(--fixed--1-75rem, 1.75rem) !important;
  }

  .navbar_links-wrap .navbar_links {
    gap: var(--fixed--1-5rem, 1.5rem) !important;
  }

  .navbar_tab-indicator,
  .navbar_tab-icon {
    display: none !important;
  }

  .navbar_links-wrap .navbar_links .navbar_link.w-inline-block {
    min-width: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    border-radius: 0 !important;
    font-size: var(--navbar-text-size, 1rem) !important;
    flex-flow: row !important;
    align-items: center !important;
    overflow: visible !important;
  }

  .navbar_links-wrap .navbar_links .navbar_link.w--current {
    gap: 0 !important;
    padding: 0 !important;
  }

  .navbar_links-wrap .navbar_link-label {
    display: inline-block !important;
    visibility: visible !important;
    position: static !important;
    top: auto !important;
    width: auto !important;
    max-width: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
    font-size: var(--navbar-text-size, 1rem) !important;
    font-weight: var(--_typography---font-weight--medium, 500) !important;
    transform: none !important;
    transition: color 0.2s ease, -webkit-text-fill-color 0.2s ease !important;
    color: rgba(255, 255, 255, 0.72) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.72) !important;
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
  }

  .navbar_links-wrap .navbar_links .navbar_link:not(.w--current) .navbar_link-label {
    width: auto !important;
    max-width: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  .navbar_links-wrap .navbar_link:hover .navbar_link-label,
  .navbar_links-wrap .navbar_link:focus-visible .navbar_link-label,
  .navbar_links-wrap .navbar_links .navbar_link.w--current .navbar_link-label {
    font-weight: var(--_typography---font-weight--medium, 500) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
    background-image: none !important;
    transform: none !important;
  }
}

/* iPad / планшет: pill снизу (перебиваем site-base ≤991: column + absolute) */
@media screen and (min-width: 768px) and (max-width: 991px) {
  .navbar_links-wrap {
    display: flex !important;
    padding: var(--fixed--0-5rem) var(--fixed--0-5rem) var(--fixed--0-5rem) var(--fixed--1-75rem) !important;
    grid-column-gap: var(--fixed--1-75rem) !important;
    grid-row-gap: 0 !important;
    flex-flow: row nowrap !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 1.5rem) !important;
    height: auto !important;
    min-height: 0 !important;
    border-radius: var(--fixed--1-5rem) !important;
    position: fixed !important;
    top: auto !important;
    bottom: var(--navbar-float-bottom) !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
  }

  .navbar_links-wrap:not(.is-scroll-hidden):hover {
    transform: translateX(-50%) translateY(-2px) !important;
  }

  .navbar_links-wrap .navbar_links {
    display: flex !important;
    flex-flow: row nowrap !important;
    flex-direction: row !important;
    grid-column-gap: var(--fixed--1-5rem) !important;
    grid-row-gap: 0 !important;
  }

  .navbar_links-wrap .navbar_logo .logo__word {
    display: block;
  }

  .navbar_links-wrap .navbar_logo-wrap {
    width: auto;
    min-width: 0;
    height: auto;
    overflow: visible;
  }

  .navbar_links-wrap .navbar_logo.logo-svg {
    width: 60px;
    max-width: 60px;
    height: auto;
    transform: none;
  }

  .navbar_links-wrap .navbar_link {
    font-size: var(--navbar-text-size, 1rem);
  }
}

/* Иконки табов — всегда; подпись только у активного */
.navbar_tab-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.375rem;
  height: 1.375rem;
  color: var(--navbar-tab-muted, rgba(255, 255, 255, 0.48));
  transition: color 0.25s ease;
}

.navbar_links-wrap .navbar_links .navbar_link.w--current .navbar_tab-icon {
  color: #fff;
}

.navbar_tab-icon-svg {
  display: block;
  width: 1.35rem;
  height: 1.35rem;
}

/* Мобилка: Contact (светлая кнопка) + tab bar с иконками, pill-фон и отступы от краёв */
@media screen and (max-width: 767px) {
  .navbar_links-wrap {
    display: flex !important;
    flex-flow: column nowrap !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    gap: 0.5rem !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: var(--navbar-mobile-inset-bottom, max(1rem, env(safe-area-inset-bottom, 0px))) !important;
    width: calc(100% - 2 * var(--navbar-mobile-inset-x, 1rem)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 2 * var(--navbar-mobile-inset-x, 1rem)) !important;
    transform: translateX(-50%) !important;
    border-radius: var(--fixed--1-5rem, 1.5rem) !important;
    padding: 0.55rem 0.65rem 0.5rem !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    background-color: rgba(12, 12, 12, 0.52) !important;
    -webkit-backdrop-filter: blur(20px) saturate(165%) !important;
    backdrop-filter: blur(20px) saturate(165%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow:
      0 1px 2px rgba(0, 0, 0, 0.06),
      0 8px 24px rgba(0, 0, 0, 0.18),
      0 20px 40px rgba(0, 0, 0, 0.12),
      inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
  }

  .navbar_links-wrap:not(.is-scroll-hidden):hover {
    transform: translateX(-50%) translateY(-2px) !important;
    background-color: rgba(12, 12, 12, 0.62) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
  }

  .navbar_links-wrap .navbar_logo-wrap {
    display: none !important;
  }

  /* Contact над табами — высота/паддинги как light-small в pill на десктопе */
  .navbar_links-wrap > .button.navbar_mobile-cta.is-active:where(.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2) {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
  }

  .navbar_links-wrap > .button.navbar_mobile-cta:where(.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2) {
    order: -1;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
    border-radius: var(--navbar-cta-radius, 12px) !important;
    font-family: var(--_typography---font-family--primary, var(--font-sans)) !important;
    font-size: var(--navbar-text-size, 1rem) !important;
    font-weight: var(--_typography---font-weight--medium, 500) !important;
    letter-spacing: -0.01em;
    line-height: normal !important;
    color: var(--_colors---primary--black) !important;
    -webkit-tap-highlight-color: transparent;
  }

  .navbar_links-wrap > .button.navbar_mobile-cta:where(.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2) .button_inner {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: var(--navbar-cta-pad-y, 12px) var(--navbar-cta-pad-x, 20px) !important;
    min-height: 0 !important;
    font: inherit !important;
    line-height: inherit !important;
    border-radius: var(--navbar-cta-radius, 12px) !important;
  }

  .navbar_links-wrap > .button.navbar_mobile-cta:where(.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2) .button_text {
    font: inherit !important;
    letter-spacing: inherit !important;
    color: inherit !important;
    opacity: 1 !important;
  }

  .navbar_links-wrap .navbar_cta-plus {
    display: none !important;
  }

  .navbar_links-wrap .navbar_links {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-flow: row nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0.12rem !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .navbar_links-wrap .navbar_links .navbar_link.w-inline-block {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    min-width: 0 !important;
    padding: 0.42rem 0.2rem !important;
  }

  .navbar_links-wrap .navbar_links .navbar_link.w--current {
    flex: 1.35 1 0 !important;
    padding: 0.42rem 0.45rem 0.42rem 0.35rem !important;
    gap: 0.28rem !important;
  }

  .navbar_links-wrap .navbar_links .navbar_link.w--current .navbar_link-label {
    font-size: clamp(0.625rem, 2.6vw, 0.75rem);
    max-width: 4.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

.navbar_links-wrap .navbar_link {
  color: #fff;
}

/* Contact в navbar pill: компактнее light-small (−4px padding), явные px чтобы перебить Webflow */
.navbar_links-wrap > a.button[href*="about"],
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 {
  font-size: var(--navbar-text-size, 1rem) !important;
  border-radius: var(--navbar-cta-radius, 12px) !important;
  color: var(--_colors---primary--black);
  background-color: transparent;
  background-image: var(--gradient-button-light);
}

.navbar_links-wrap > a.button[href*="about"]:hover,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2:hover {
  background-image: linear-gradient(165deg, #ffffff 0%, #ededed 48%, #dcdcdc 100%);
}

.navbar_links-wrap > a.button[href*="about"] .button_inner,
.navbar_links-wrap > a.button[href*="about"] .button_inner.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 .button_inner,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 .button_inner.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 {
  padding: var(--navbar-cta-pad-y, 12px) var(--navbar-cta-pad-x, 20px) !important;
  border-radius: var(--navbar-cta-radius, 12px) !important;
  box-shadow: inset 0 0 7px rgba(0, 0, 0, 0.1);
}

.navbar_links-wrap > a.button[href*="about"] .button_inner:hover,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 .button_inner:hover {
  box-shadow: inset 0 0 9px rgba(0, 0, 0, 0.16);
}

.navbar_links-wrap > a.button[href*="about"] .button_gradient,
.navbar_links-wrap > a.button[href*="about"] .button_gradient-glow,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 .button_gradient,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2 .button_gradient-glow {
  transition: opacity 0.35s ease;
}

.navbar_links-wrap > a.button[href*="about"]:not(:hover) .button_gradient,
.navbar_links-wrap > a.button[href*="about"]:not(:hover) .button_gradient-glow,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2:not(:hover) .button_gradient,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2:not(:hover) .button_gradient-glow {
  opacity: 0;
}

.navbar_links-wrap > a.button[href*="about"]:hover .button_gradient,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2:hover .button_gradient {
  opacity: 1;
}

.navbar_links-wrap > a.button[href*="about"]:hover .button_gradient-glow,
.navbar_links-wrap > .button.w-variant-994e88c4-baec-2bbf-d0b3-8a2991a92ab2:hover .button_gradient-glow {
  opacity: 0.9;
}

/* Navbar: скрытие pill при скролле вниз (класс is-scroll-hidden из footer-lang.js) */
.navbar_links-wrap.is-scroll-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media screen and (min-width: 768px) {
  .navbar_links-wrap.is-scroll-hidden {
    transform: translateX(-50%) translateY(calc(100% + 1.25rem)) !important;
  }
}

@media screen and (max-width: 767px) {
  .navbar_links-wrap.is-scroll-hidden {
    transform: translateX(-50%) translateY(calc(100% + 1.25rem)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .navbar_links-wrap.is-scroll-hidden {
    transform: translateX(-50%) !important;
  }
}

/* Футер: 2 блока — ссылки слева, иконки справа сверху */
.footer .footer_wrap {
  width: 100%;
  align-items: stretch;
}

.footer .footer_component {
  width: 100%;
  align-items: stretch;
  gap: var(--fixed--1-5rem);
}

.footer .footer_main {
  display: block !important;
  width: 100%;
}

.footer .footer_links-groups {
  display: block !important;
  width: 100% !important;
}

/* Блок 1: ссылки | Блок 2: соцсети (правый верхний угол) */
.footer .footer_group.footer_group--nav {
  display: grid !important;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto;
  align-items: start !important;
  width: 100%;
  column-gap: 0;
  row-gap: 1.25rem;
}

.footer .footer_group.footer_group--nav .footer_lists.footer_lists--grid {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  align-self: start;
  width: auto;
  max-width: 100%;
}

.footer .footer_group.footer_group--nav .footer_social {
  display: flex !important;
  grid-column: 2;
  grid-row: 1;
  flex-flow: row;
  justify-content: flex-end;
  align-items: center !important;
  justify-self: end !important;
  align-self: start !important;
  place-self: start end !important;
  height: auto !important;
  min-height: 0;
  gap: var(--fixed--1rem);
  width: auto;
  margin: 0 !important;
  padding: 0;
}

.footer .footer_group.footer_group--nav .footer_social-media-wrap {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .footer .footer_group.footer_group--nav {
    grid-template-columns: 1fr;
    row-gap: 1rem;
  }

  .footer .footer_group.footer_group--nav .footer_lists.footer_lists--grid {
    grid-column: 1;
    justify-self: start;
  }

  .footer .footer_group.footer_group--nav .footer_social {
    grid-column: 1;
    justify-self: end !important;
    place-self: start end !important;
  }
}

@media screen and (min-width: 768px) {
  .footer .footer_links-groups {
    width: 100% !important;
    max-width: none;
  }
}

/* Webflow: сброс grid-area / place-self на ноде группы */
#w-node-_0632acfa-8aaa-b158-7b6a-58a2921af54f-921af54a.footer_group--nav {
  grid-area: auto !important;
  place-self: auto !important;
  display: grid !important;
}

@media screen and (max-width: 991px) {
  .footer .footer_main {
    display: block !important;
    flex-flow: unset !important;
    align-items: unset !important;
  }

  .footer .footer_group.footer_group--nav .footer_social {
    align-items: center !important;
    justify-self: end !important;
    align-self: start !important;
    place-self: start end !important;
  }
}

.footer .footer_brand {
  width: 100%;
  color: var(--_colors---primary--black);
  margin-right: 0;
  padding-top: var(--fixed--2rem);
}

@media screen and (min-width: 768px) {
  .footer .footer_wrap {
    padding-bottom: calc(
      var(--navbar-float-bottom, 1.25rem) + var(--navbar-float-pill-height, 3.25rem) + 1rem
    );
  }
}

/* Бренд в футере */
.brand-sup {
  font-size: 0.5em;
  vertical-align: super;
  line-height: 0;
  display: inline-block;
  margin-left: 2px;
  transform: translateY(0.15em);
}

/* Лейблы на главной (Canada, ©2025) */
.home-header_labels {
  display: none !important;
}

/* Скрытие до загрузки JS — коллаж не скрываем, только текст/кнопку hero */
html.w-mod-js:not(.w-mod-ix3):not(.about-cube-ready) :is(
  .home-header_headings,
  .home-header_text,
  .home-header_button,
  .about-header_cube,
  .faq_accordion .faq_answer-wrap,
  .faq_accordion .faq_button-line.is-second,
  .scroll-note_text,
  .section_values .about-values_img-wrap._2,
  .section_values .about-values_img-wrap._3,
  .section_values .about-values_block-content._1,
  .section_values .about-values_block-content._2,
  .section_values .about-values_block-content._3,
  .brands_list,
  .section_about-header .text-style-label,
  .section_about-header h1,
  [animation="scale"],
  .button_gradient-ball.ball-1,
  .footer_brand,
  .button_gradient-ball.ball-2,
  .newsletter_button .newsletter_btn-wrap,
  .navbar_hamburger-line._1,
  .navbar_hamburger-line._2,
  .button .button_gradient,
  .button .button_gradient-glow,
  .home-header_heading._1,
  .home-header_heading._2,
  .home-header_heading._3,
  .section_services .heading-style-h3
) {
  visibility: hidden !important;
}

/* About: один текстовый блок — не 3-колоночная сетка с пустыми ячейками справа */
.section_approach .approach_items {
  display: flex;
  flex-flow: column;
  grid-template-columns: none;
  width: 100%;
  max-width: 100%;
}

.section_approach .approach_item {
  width: 100%;
  max-width: 100%;
}

.section_approach .approach_item-content {
  width: 100%;
  max-width: min(56rem, 100%);
}

.section_approach .approach_item-content p {
  margin: 0;
  line-height: 1.5;
  letter-spacing: -0.014em;
}

.section_approach .approach_item-content p + p {
  margin-top: 1.25rem;
}

/* Useful links — белая панель: фильтры сверху, список скроллится внутри */
.useful-links-page .useful-links-shell,
.useful-links-page #useful-links-root {
  margin: 0;
  padding: 0;
  max-width: 100%;
  background: transparent;
}

.useful-links-panel {
  display: flex;
  flex-direction: column;
  margin: 1.25rem 0 1.5rem;
  height: auto;
  border: none;
  border-radius: var(--ul-panel-radius, 24px);
  background: #fff;
  box-shadow: none;
  overflow: visible;
}

.useful-links-panel__body {
  border-radius: 0 0 var(--ul-panel-radius, 24px) var(--ul-panel-radius, 24px);
  padding: 0.75rem var(--useful-links-inset, 1.25rem) 1rem;
}

.useful-links-page .useful-links-toolbar {
  --ul-control-h: 2.5rem;
  --ul-pill-radius: 999px;
  --ul-pill-shadow: 0 2px 10px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.04);
  --ul-pill-shadow-hover: 0 6px 20px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.05);
  --ul-pill-shadow-open: 0 10px 28px rgba(0, 0, 0, 0.1), 0 4px 10px rgba(0, 0, 0, 0.06);
  position: relative;
  z-index: 3;
  flex-shrink: 0;
  margin: 0;
  padding: 1rem var(--useful-links-inset, 1.25rem) 0.85rem;
  background: #fff;
  border: none;
  border-radius: var(--ul-panel-radius, 24px) var(--ul-panel-radius, 24px) 0 0;
  box-shadow: none;
}

.useful-links-toolbar__top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.65rem;
  margin-bottom: 0.75rem;
  padding: 0;
}

.useful-links-toolbar__search {
  box-sizing: border-box;
  height: var(--ul-control-h);
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-radius: var(--ul-pill-radius);
  background: #fff;
  color: inherit;
  font: inherit;
  font-size: 0.9375rem;
  line-height: 1.25;
  flex: 1 1 12rem;
  min-width: 0;
  padding: 0 1rem;
  margin: 0;
  box-shadow: var(--ul-pill-shadow);
  transition:
    border-color 0.2s ease,
    box-shadow 0.25s ease;
}

.useful-links-toolbar__search:hover {
  box-shadow: var(--ul-pill-shadow-hover);
}

.useful-links-toolbar__search:focus {
  outline: none;
  border-color: rgba(0, 0, 0, 0.14);
  box-shadow: var(--ul-pill-shadow-open);
}

/* Type filter — кнопка-select, pill + плавная тень */
.useful-links-type {
  position: relative;
  flex: 0 1 auto;
  min-width: 12.5rem;
  max-width: 100%;
}

.useful-links-type__trigger {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  height: var(--ul-control-h);
  padding: 0 0.85rem 0 1rem;
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-radius: var(--ul-pill-radius);
  background: #fff;
  color: inherit;
  font: inherit;
  font-size: 0.9375rem;
  line-height: 1.25;
  cursor: pointer;
  text-align: left;
  box-shadow: var(--ul-pill-shadow);
  transition:
    border-color 0.2s ease,
    box-shadow 0.28s cubic-bezier(0.25, 0.1, 0.25, 1),
    transform 0.2s ease;
}

.useful-links-type__trigger:hover {
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: var(--ul-pill-shadow-hover);
}

.useful-links-type__trigger:focus-visible {
  outline: none;
  border-color: rgba(0, 0, 0, 0.14);
  box-shadow: var(--ul-pill-shadow-open);
}

.useful-links-type.is-open .useful-links-type__trigger {
  border-color: rgba(0, 0, 0, 0.12);
  box-shadow: var(--ul-pill-shadow-open);
}

.useful-links-type__value {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.useful-links-type__count {
  flex-shrink: 0;
  font-size: 0.8125rem;
  font-variant-numeric: tabular-nums;
  opacity: 0.45;
}

.useful-links-type__chevron {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.875rem;
  height: 0.875rem;
  color: currentColor;
  opacity: 0.5;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.useful-links-type__chevron svg {
  display: block;
  width: 0.875rem;
  height: 0.875rem;
}

.useful-links-type__trigger:hover .useful-links-type__chevron {
  opacity: 0.72;
}

.useful-links-type.is-open .useful-links-type__chevron {
  transform: rotate(180deg);
}

/* Выпадашка типов — только div, без ul/li (обход .w-richtext ul padding) */
.useful-links-type__menu {
  position: absolute;
  z-index: 100;
  top: calc(100% + 0.45rem);
  left: 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: max(100%, 16.5rem);
  max-width: min(22rem, calc(100vw - 2.5rem));
  max-height: min(16rem, 50vh);
  margin: 0;
  padding: 0.35rem;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 1rem;
  background: #fff;
  box-shadow: var(--ul-pill-shadow-open);
}

.useful-links-type__menu::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.useful-links-type__menu[hidden] {
  display: none;
}

.useful-links-type__option {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  margin: 0;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.25;
  color: inherit;
  text-align: left;
  cursor: pointer;
  border: none;
  border-radius: 0.65rem;
  background: transparent;
  transition: background 0.15s ease;
}

.useful-links-type__option .useful-links-type__label {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.useful-links-type__option .useful-links-type__count {
  flex: 0 0 auto;
  min-width: 2.25rem;
  font-size: 0.8125rem;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  text-align: right;
  opacity: 0.45;
}

.useful-links-type__option:hover,
.useful-links-type__option.is-focused {
  background: rgba(0, 0, 0, 0.05);
}

.useful-links-type__option.is-selected {
  background: rgba(0, 0, 0, 0.06);
}

.useful-links-type__option.is-selected .useful-links-type__label {
  font-weight: 600;
}

.useful-links-type__option.is-selected.is-focused,
.useful-links-type__option.is-selected:hover {
  background: rgba(0, 0, 0, 0.08);
}

.useful-links-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  margin: 0;
  padding: 0.15rem 0 0.25rem;
  border: none;
}

.useful-links-tabs::-webkit-scrollbar {
  display: none;
}

.useful-links-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
  white-space: nowrap;
  margin: 0;
  padding: 0.45rem 0.85rem;
  min-height: 2rem;
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-radius: var(--ul-pill-radius, 999px);
  background: #fff;
  color: inherit;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.01em;
  cursor: pointer;
  box-shadow: var(--ul-pill-shadow, 0 2px 10px rgba(0, 0, 0, 0.05));
  transition:
    color 0.2s ease,
    background-color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.25s cubic-bezier(0.25, 0.1, 0.25, 1),
    transform 0.2s ease;
}

.useful-links-tab__count {
  font-size: 0.6875rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  opacity: 0.42;
}

.useful-links-tab.is-active .useful-links-tab__count {
  opacity: 0.72;
  color: inherit;
}

.useful-links-tab:hover {
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: var(--ul-pill-shadow-hover, 0 6px 20px rgba(0, 0, 0, 0.08));
}

.useful-links-tab.is-active {
  background: #111;
  border-color: #111;
  color: #fff;
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14), 0 2px 6px rgba(0, 0, 0, 0.08);
}

.useful-links-tab.is-active .useful-links-tab__count {
  color: rgba(255, 255, 255, 0.72);
}

@media (prefers-reduced-motion: reduce) {
  .useful-links-toolbar__search,
  .useful-links-type__trigger,
  .useful-links-tab {
    transition: border-color 0.15s ease, background-color 0.15s ease;
  }
}

.useful-links-panel .useful-links-empty {
  margin: 0 0 1rem;
  padding: 1rem;
  text-align: center;
  font-size: 0.9375rem;
  opacity: 0.65;
  border: 1px dashed rgba(0, 0, 0, 0.12);
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.02);
}

.useful-links-section[hidden] {
  display: none !important;
}

.useful-links-row[hidden] {
  display: none !important;
}

.useful-links-page {
  --useful-links-inset: 1.25rem;
  --ul-panel-radius: 24px;
}

@media screen and (max-width: 767px) {
  .useful-links-page {
    --useful-links-inset: 1rem;
  }
}

/* Other blog posts — внизу статьи useful-links, в колонке контента */
.useful-links-page .blog-other-in-article {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-top: 0.5rem;
}

.useful-links-page .blog-other-in-article .blog_other-label {
  margin-bottom: 0;
}

.useful-links-page .blog-other-in-article .blog-list_list {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-row-gap: 1.25rem;
  grid-column-gap: 0;
}

.useful-links-page .blog-other-in-article .blog-list_block {
  grid-column-gap: 0.75rem;
  grid-row-gap: 0.75rem;
  height: auto;
  text-decoration: none;
  color: inherit;
}

.useful-links-page .blog-other-in-article .blog-list_block:hover {
  text-decoration: none;
}

.useful-links-page .blog-other-in-article .blog-list_img-wrap {
  aspect-ratio: auto;
  height: auto;
  overflow: hidden;
  background-color: #fff;
}

.useful-links-page .blog-other-in-article .blog-list_img-wrap::after {
  display: none;
}

.useful-links-page .blog-other-in-article .blog-list_img-wrap .blog-list_img--cover,
.useful-links-page .blog-other-in-article .blog-list_img-wrap .pixel-load__img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  background-color: #fff;
}

.useful-links-page .blog-other-in-article .blog-list_img-wrap .pixel-load {
  display: block;
  width: 100%;
  line-height: 0;
}

.useful-links-page .blog-other-in-article .blog-list_content {
  max-width: 100%;
  height: auto;
  align-self: start;
  justify-content: flex-start;
  grid-row-gap: 0.35rem;
  row-gap: 0.35rem;
}

.useful-links-page .blog-other-in-article .blog-list_content .text-style-label {
  margin: 0;
  text-decoration: none;
}

.useful-links-page .blog-other-in-article .blog-list_content .heading-style-h5 {
  margin: 0;
  text-decoration: none;
}

.useful-links-page .blog-other-in-article .blog-list_block:hover .heading-style-h5 {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.useful-links-page .blog-other-in-article .blog-list_desc {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--_colors---grey--400, #727067);
  text-decoration: none;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .useful-links-page .blog-other-in-article .blog-list_block {
    display: grid;
    grid-template-columns: minmax(0, 10.5rem) minmax(0, 1fr);
    align-items: start;
    column-gap: 1rem;
  }

  .useful-links-page .blog-other-in-article .blog-list_img-wrap {
    align-self: start;
  }
}

.useful-links-section {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0.75rem;
  margin: 0 0 0.875rem;
  padding: 0;
  overflow: hidden;
  background: #fff;
  width: 100%;
  box-sizing: border-box;
}

.useful-links-panel .useful-links-section {
  border: none;
  border-radius: 20px;
  background: #f5f5f5;
}

.useful-links-panel .useful-links-section:last-child {
  margin-bottom: 0;
}

/* Fintech cluster — 7 subsections share one tab filter */
.useful-links-section[data-section="fintech"] {
  border-left: 3px solid rgba(0, 0, 0, 0.07);
}

.useful-links-panel .useful-links-section[data-section="fintech"] {
  border-left: none;
}

.useful-links-section[data-section="fintech"] + .useful-links-section[data-section="fintech"] {
  margin-top: 0.5rem;
}

.useful-links-section__head {
  list-style: none;
  list-style-type: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem var(--useful-links-inset);
  margin: 0;
  user-select: none;
}

.useful-links-section__head::marker {
  content: "";
  display: none;
}

.useful-links-section__head::-webkit-details-marker {
  display: none;
}

.useful-links-section__title {
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  flex: 1 1 auto;
}

.useful-links-section__count {
  font-size: 0.75rem;
  letter-spacing: 0.01em;
  opacity: 0.45;
  white-space: nowrap;
}

.useful-links-section__chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  height: 1rem;
  color: currentColor;
  opacity: 0.5;
  transition: transform 0.2s ease, opacity 0.2s ease;
  flex-shrink: 0;
}

.useful-links-section__chevron svg {
  display: block;
  width: 1rem;
  height: 1rem;
}

.useful-links-section__head:hover .useful-links-section__chevron {
  opacity: 0.72;
}

.useful-links-section[open] .useful-links-section__chevron {
  transform: rotate(180deg);
}

.useful-links-section__body {
  padding: 0 var(--useful-links-inset) 1.25rem;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.useful-links-panel .useful-links-section__head,
.useful-links-panel .useful-links-section__body {
  padding-left: 1rem;
  padding-right: 1rem;
}

.useful-links-panel .useful-links-section__body {
  border-top: none;
}

.useful-links-section__intro {
  margin: 1rem 0 0.75rem;
  padding: 0;
  font-size: 0.9375rem;
  opacity: 0.72;
}

.useful-links-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.useful-links-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
  line-height: 1.45;
}

.useful-links-table thead th {
  text-align: left;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  opacity: 0.45;
  padding: 0.75rem 0.75rem 0.5rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  white-space: nowrap;
}

.useful-links-table thead th:last-child,
.useful-links-table td:last-child {
  padding-right: 0;
}

.useful-links-table tbody tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.useful-links-table tbody tr:last-child {
  border-bottom: none;
}

.useful-links-table td {
  vertical-align: top;
  padding: 0.875rem 0.75rem 0.875rem 0;
}

.useful-links-table__resource {
  width: 22%;
  min-width: 9rem;
  font-weight: 500;
}

.useful-links-table__resource a {
  text-decoration: none;
}

.useful-links-table__resource a:hover {
  text-decoration: underline;
}

.useful-links-table__about {
  width: 42%;
  opacity: 0.88;
}

.useful-links-table__benefit {
  width: 36%;
  opacity: 0.72;
}

@media screen and (max-width: 767px) {
  .useful-links-page {
    --useful-links-inset: 1rem;
  }

  .useful-links-section__head {
    flex-wrap: wrap;
    padding: 0.875rem var(--useful-links-inset);
  }

  .useful-links-section__count {
    order: 3;
    width: 100%;
    margin-top: 0.25rem;
  }

  .useful-links-section__body {
    padding: 0 var(--useful-links-inset) 1rem;
  }

  .useful-links-table thead {
    display: none;
  }

  .useful-links-table tbody tr {
    display: block;
    padding: 0.875rem 0;
  }

  .useful-links-table td {
    display: block;
    width: 100% !important;
    min-width: 0;
    padding: 0.2rem 0;
  }

  .useful-links-table td::before {
    content: attr(data-label);
    display: block;
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    opacity: 0.45;
    margin-bottom: 0.2rem;
  }

  .useful-links-table__resource {
    font-size: 1rem;
    margin-bottom: 0.35rem;
  }

  .useful-links-table__resource::before {
    display: none !important;
  }
}

/* Прогрессивная загрузка (blur / pixel) */
.pixel-load {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  line-height: 0;
}

.blog-list_img-wrap > .pixel-load--blur {
  aspect-ratio: 16 / 9;
}

.useful-links-page .blog-other-in-article .blog-list_img-wrap > .pixel-load--blur {
  aspect-ratio: auto;
  height: auto;
}

.pixel-load__canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
  z-index: 1;
  transition: opacity 0.45s ease;
}

.pixel-load__canvas--out {
  opacity: 0;
}

.pixel-load__img {
  opacity: 0;
  transition: opacity 0.5s ease;
}

.pixel-load__img--done {
  opacity: 1;
}

.post-header_image-wrap > .pixel-load {
  width: 100%;
}

/* About: настоящий 6-гранный куб вместо 4-стороннего призмы Webflow */
.section_about-header {
  --about-cube-size: min(32vh, 72vw);
  --about-cube-half: calc(var(--about-cube-size) / 2);
}

.about-header_cube-wrap {
  perspective: 1400px;
  perspective-origin: 50% 42%;
  justify-content: center;
  align-items: center;
  min-height: calc(var(--about-cube-size) + 6rem);
  padding: 1rem 0 3rem;
}

.about-header_cube {
  width: var(--about-cube-size) !important;
  height: var(--about-cube-size) !important;
  aspect-ratio: 1 / 1 !important;
  transform-style: preserve-3d;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  will-change: transform;
}

.about-header_cube-side {
  position: absolute;
  inset: 0 !important;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-origin: center center;
  z-index: auto;
}

.about-header_cube-side._1 {
  transform: rotateY(0deg) translateZ(var(--about-cube-half)) !important;
}

.about-header_cube-side._2 {
  transform: rotateY(90deg) translateZ(var(--about-cube-half)) !important;
}

.about-header_cube-side._3 {
  transform: rotateY(180deg) translateZ(var(--about-cube-half)) !important;
}

.about-header_cube-side._4 {
  transform: rotateY(-90deg) translateZ(var(--about-cube-half)) !important;
}

.about-header_cube-side._5 {
  transform: rotateX(90deg) translateZ(var(--about-cube-half)) !important;
}

.about-header_cube-side._6 {
  transform: rotateX(-90deg) translateZ(var(--about-cube-half)) !important;
}

@media screen and (max-width: 991px) {
  .section_about-header {
    --about-cube-size: min(42vw, 56vh);
  }
}

@media screen and (max-width: 767px) {
  .section_about-header {
    --about-cube-size: min(68vw, 52vh);
  }

  .about-header_cube-wrap {
    perspective: 1000px;
    min-height: calc(var(--about-cube-size) + 4rem);
    padding-bottom: 2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-header_cube {
    will-change: auto;
  }
}