/* ——— Арабское дерево: то, что нельзя решить логическими свойствами ———
   Подключается только к RTL-языкам, поэтому селекторы можно держать простыми.
   Файл идёт после секционных стилей: правила ниже должны выигрывать у них
   по порядку, а не по весу — специфичность здесь намеренно низкая. */

/* Арабское письмо связное: положительный трекинг разрывает вязь и превращает
   слово в набор отдельных букв. В макете трекинг стоит у 83 правил — это
   типографика латиницы, к арабскому она не применяется. */
[dir="rtl"] * {
  letter-spacing: normal;
}

/* Регистра в арабском нет, uppercase на нём не делает ничего. Но подписи-ярлыки
   в макете опознаются именно капслоком и разрядкой; без обоих они сливаются
   с обычным текстом, поэтому отделяем их весом и размером. */
[dir="rtl"] .eyebrow,
[dir="rtl"] .field__label,
[dir="rtl"] .sum__cap,
[dir="rtl"] .fact dt,
[dir="rtl"] .ahero__tag,
[dir="rtl"] .relc__meta,
[dir="rtl"] .statbar__label,
[dir="rtl"] .trust__label {
  font-size: max(1em, 12px);
  font-weight: 600;
}

/* Арабские глифы выше и ниже базовой линии латинских: на плотном интерлиньяже
   диакритика наезжает на соседнюю строку. */
[dir="rtl"] {
  line-height: 1.7;
}
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3 {
  line-height: 1.35;
}

/* Стрелки в кнопках и ссылках нарисованы символом и указывают вперёд по чтению.
   В RTL «вперёд» — налево, поэтому глиф разворачиваем, а не переписываем текст. */
[dir="rtl"] .btn--gold,
[dir="rtl"] .cat__btn,
[dir="rtl"] .mtype__btn,
[dir="rtl"] .ocard__btn,
[dir="rtl"] .appc__btn,
[dir="rtl"] .ncard__btn {
  /* картинка-стрелка внутри кнопки */
}
[dir="rtl"] .cat__btn img,
[dir="rtl"] .mtype__btn img,
[dir="rtl"] .ocard__btn img,
[dir="rtl"] .appc__btn img,
[dir="rtl"] .ncard__btn img,
[dir="rtl"] .svc__arrow {
  transform: scaleX(-1);
}

/* панель баннера «18 видов»: в RTL растворяется левый край, а не правый */
[dir="rtl"] .bkinds__panel {
  -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 140px), transparent);
  mask-image: linear-gradient(to left, #000 calc(100% - 140px), transparent);
}
