/*
Theme Name: ROBIN Custom (Code-First)
Theme URI: https://robin-rpa.ru/
Author: SL Soft
Author URI: https://slsoft.org/
Description: Минималистичная barebones-тема для сайта платформы ROBIN. Code-First подход: вся вёрстка, стили и логика — в файлах темы. Tailwind CSS (CDN на этапе разработки), шрифт Inter. Эстетика продуктового SaaS в духе productive.io.
Version: 0.1.50
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: robin-custom-theme
*/

/* Мета-файл темы. Стили задаются через Tailwind (см. functions.php).
   Сюда добавляем только то, что нельзя выразить утилитами Tailwind. */

/* --------------------------------------------------------------------------
   Фирменный шрифт TTInterfaces (как на slsoft.ru). Начертания 200/400/500.
   Веса 500–900 мапятся на Medium через диапазон — чтобы 600/700 из Tailwind
   не давали «ложный жирный», а использовали реальный Medium, как на slsoft.
   -------------------------------------------------------------------------- */
@font-face {
	font-family: "TTInterfaces";
	src: url(assets/fonts/TTInterfaces-ExtraLight.woff2) format("woff2");
	font-weight: 100 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "TTInterfaces";
	src: url(assets/fonts/TTInterfaces-Regular.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "TTInterfaces";
	src: url(assets/fonts/TTInterfaces-Medium.woff2) format("woff2");
	font-weight: 500 900;
	font-style: normal;
	font-display: swap;
}

/* --------------------------------------------------------------------------
   Rubik — акцентный рублёный шрифт для мокапов «браузерных окон» в блоке
   «ROBIN. Ассистент» (все три вкладки): отличает интерфейс демо-продукта
   от фирменного TTInterfaces остального сайта. Файлы — вариативные (ось
   wght целиком), поэтому один файл покрывает весь диапазон начертаний.
   -------------------------------------------------------------------------- */
@font-face {
	font-family: "Rubik";
	src: url(assets/fonts/Rubik-latin.woff2) format("woff2");
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122;
}
@font-face {
	font-family: "Rubik";
	src: url(assets/fonts/Rubik-cyrillic.woff2) format("woff2");
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
	font-family: "Caveat";
	src: url(assets/fonts/Caveat-latin-regular.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122;
}
@font-face {
	font-family: "Caveat";
	src: url(assets/fonts/Caveat-cyrillic-regular.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
	font-family: "Caveat";
	src: url(assets/fonts/Caveat-latin-bold.woff2) format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122;
}
@font-face {
	font-family: "Caveat";
	src: url(assets/fonts/Caveat-cyrillic-bold.woff2) format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* --------------------------------------------------------------------------
   Фирменные токены --robin-* — их читает плагин robin-lead-form (шорткод
   [robin_lead_form], см. assets/css/multistep-form.css плагина: без этих
   переменных он падает на дефолтные синий/бирюзовый цвета Stripe/Typeform,
   не совпадающие с бордовым ROBIN). Задаём здесь, не трогая сам плагин —
   так его стиль остаётся в теме, а плагин по-прежнему независим от темы.
   -------------------------------------------------------------------------- */
:root {
	--robin-accent: #A30C33;
	--robin-accent-2: #A30C33;
	--robin-radius: 14px;
	--robin-text: #0E1526;
	--robin-muted: #64748B;
	--robin-bg-light: #F6F3F1;
	--robin-font-head: "TTInterfaces", "Arial", sans-serif;
}

/* Кнопки формы — как везде на сайте, полностью скруглённые (pill), а не
   прямоугольные с радиусом --robin-radius. Вторичная кнопка «Назад»
   (.robin-btn--ghost) была не видна: .robin-lead .robin-btn (2 класса)
   перебивал .robin-btn--ghost (1 класс) по специфичности и красил её в
   акцент — здесь специфичность выше, чтобы ghost-стиль применился. */
.robin-lead .robin-btn {
	border-radius: 999px;
}
.robin-lead .robin-btn.robin-btn--ghost {
	background: transparent;
	color: var(--lead-muted);
	border: 1.5px solid #E0E6F0;
}
.robin-lead .robin-btn.robin-btn--ghost:hover {
	color: var(--lead-text);
}

/* Фокус/выбор карточек и полей — в плагине это захардкоженный синий
   rgba(47,107,255,...), не завязанный на --lead-accent (только border-color
   берёт переменную). Перекрашиваем в бордовый ROBIN, чтобы не было
   красной рамки с синим свечением. */
.robin-lead .robin-card.is-selected,
.robin-lead .robin-field__input:focus {
	box-shadow: 0 0 0 3px rgba(163, 12, 51, 0.15);
}
.robin-lead .robin-card:focus-visible {
	box-shadow: 0 0 0 3px rgba(163, 12, 51, 0.35);
}

.robin-assist-window,
.robin-assist-window input,
.robin-assist-window button {
	font-family: "Rubik", "Arial", sans-serif;
}

.robin-deleg-label {
	font-family: "Caveat", "Arial", sans-serif;
	color: #2B4C8C;
	filter: url(#robin-ink-texture);
}
@media (prefers-reduced-motion: reduce), (max-resolution: 1dppx) {
	/* На низком DPI зерно фильтра читается как грязь, а не текстура штриха */
	.robin-deleg-label { filter: none; }
}

/* --------------------------------------------------------------------------
   Hero: брендовая лента-иллюстрация как фоновый акцент.
   Занимает ВСЮ высоту первого экрана: верх — по верхней границе сайта,
   низ — по нижней границе Hero. Верхушка уводится в прозрачность под
   хедером (sticky), левый край мягко гаснет под текстом.
   Лежит под контентом (в слое z-0 фоновых акцентов).
   -------------------------------------------------------------------------- */
.robin-hero-ribbon {
	position: absolute;
	top: 0;
	right: 0;          /* край картинки строго в обрез экрана, без зазора */
	height: 100%;      /* от верхней до нижней границы Hero */
	width: auto;       /* сохраняем пропорции рисунка */
	max-width: none;
	opacity: 1;        /* точная графика как в исходнике */
	-webkit-mask-image:
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 100%),
		linear-gradient(to left, #000 38%, transparent 100%);
	-webkit-mask-composite: source-in;
	        mask-image:
		linear-gradient(to bottom, transparent 0%, #000 12%, #000 100%),
		linear-gradient(to left, #000 38%, transparent 100%);
	        mask-composite: intersect;
}
@media (max-width: 1024px) {
	/* на планшетах/телефонах — приглушаем и уводим правее, чтобы не мешать тексту */
	.robin-hero-ribbon { right: 0; opacity: .55; }
}

/* --------------------------------------------------------------------------
   Hero-карточки: «магнитный» параллакс. JS задаёт transform слоям вслед за
   курсором; здесь — плавность возврата и «задержка» заголовка.
   Двигаются ЧАСТИ карточки с разной глубиной («слои стекла»), не блок целиком.
   -------------------------------------------------------------------------- */
/* Контейнер 3D-сцены: перспектива для дочерних translate3d/rotateX/rotateY. */
.robin-parallax { perspective: 1000px; }

/* Каждая карточка целиком двигается по курсору (глубина — атрибут data-depth,
   10..45 — чем больше, тем сильнее смещение и тем «ближе» карточка кажется)
   через translate3d + лёгкий наклон rotateX/rotateY. Transform целиком
   считает и применяет JS (см. robin-magnet.js, rAF + lerp) — здесь только
   transition для плавного возврата/подъёма и will-change. */
[data-magnet] {
	will-change: transform;
	transition: box-shadow .3s ease;
}
[data-magnet].is-lifted {
	z-index: 20;
	box-shadow: 0 30px 60px -15px rgba(15, 23, 42, .28), 0 10px 20px -8px rgba(15, 23, 42, .15);
}

/* Внутренние слои карточки («стекло» второго порядка) — своя, более лёгкая
   параллакс-глубина поверх движения всей карточки (см. data-depth-inner). */
[data-magnet] [data-depth-inner] { transition: transform .3s cubic-bezier(.2, .7, .2, 1); will-change: transform; }
[data-magnet] [data-depth-inner="5"] { transition-delay: .06s; } /* заголовок — с лёгкой задержкой */

/* Кнопка «Подробнее» — выезжает снизу при наведении на карточку */
.robin-magnet-more {
	margin-top: 12px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	color: #A30C33;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .3s ease, transform .3s ease;
}
[data-magnet]:hover .robin-magnet-more { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
	[data-magnet] { transition: none; }
	[data-magnet] [data-depth-inner], .robin-magnet-more { transition: none; }
}

/* --------------------------------------------------------------------------
   Шапка: эффект матового стекла ПРИ СКРОЛЛЕ.
   Вверху страницы — прозрачная (сливается с фоном Hero). После прокрутки
   JS добавляет класс .is-scrolled → полупрозрачный фон + backdrop-blur.
   -------------------------------------------------------------------------- */
.robin-header {
	background-color: transparent;
	border-bottom: 1px solid transparent;
	transition: background-color .3s ease, border-color .3s ease,
		box-shadow .3s ease, backdrop-filter .3s ease;
}

.robin-header.is-scrolled {
	background-color: rgba(246, 243, 241, 0.7); /* #F6F3F1 @ 70% */
	-webkit-backdrop-filter: blur(12px) saturate(150%);
	backdrop-filter: blur(12px) saturate(150%);
	border-bottom-color: rgba(148, 163, 184, 0.35); /* slate-400 @ 35% */
	box-shadow: 0 1px 2px rgba(11, 18, 32, .04), 0 8px 24px -12px rgba(11, 18, 32, .12);
}

/* Серо-голубое «стекло» — только на главной; на остальных страницах шапка
   белая сразу, без прозрачного состояния вверху. */
body:not(.home) .robin-header,
body:not(.home) .robin-header.is-scrolled {
	background-color: #fff;
}

/* --------------------------------------------------------------------------
   Кнопка «Войти» в шапке: тонкое бренд-подчёркивание, выкатывающееся
   слева направо по наведению. Класс уникален — другие пункты меню не задеты.
   Производительно: анимируется только transform (scaleX), без reflow.
   -------------------------------------------------------------------------- */
.robin-login-link { position: relative; }
.robin-login-link::after {
	content: "";
	position: absolute;
	left: 0.75rem;   /* совпадает с горизонтальным паддингом px-3 */
	right: 0.75rem;
	bottom: 0.4rem;
	height: 1.5px;
	border-radius: 2px;
	background: #000000; /* чёрная линия */
	transform: scaleX(0);
	transform-origin: right center; /* при уходе курсора линия уезжает вправо */
	transition: transform .35s cubic-bezier(.4, 0, .2, 1);
}
.robin-login-link:hover,
.robin-login-link:focus-visible {
	color: #000000; /* чёрный текст по наведению */
}
.robin-login-link:hover::after,
.robin-login-link:focus-visible::after {
	transform: scaleX(1);
	transform-origin: left center; /* при наведении въезжает слева направо */
}
@media (prefers-reduced-motion: reduce) {
	.robin-login-link::after { transition: none; }
}

/* --------------------------------------------------------------------------
   Первичные кнопки: базовый фон #A30C33, по наведению заливка градиентом
   СЛЕВА цветом #C72329 (анимация background-size, без сдвига кнопки).
   -------------------------------------------------------------------------- */
.robin-btn-primary {
	background-color: #A30C33;
	/* градиент слева направо: #C72329 доходит примерно до середины, дальше #A30C33 */
	background-image: linear-gradient(90deg, #C72329 0%, #A30C33 50%, #A30C33 100%);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 0% 100%;
	transition: background-size .35s ease, box-shadow .2s ease;
}
.robin-btn-primary:hover,
.robin-btn-primary:focus-visible {
	background-size: 100% 100%;
}

/* --------------------------------------------------------------------------
   Блок «Автоматизация для каждого отдела»: активная карточка отдела и
   фейд метрик при переключении (см. setMetric() в robin-departments.js).
   -------------------------------------------------------------------------- */
.robin-dept-card {
	cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}
[data-metric] {
	transition: opacity .15s ease;
}
.robin-dept-card:hover {
	transform: translateY(-2px);
}
.robin-dept-card.is-active {
	background: #F6F3F1;
}

/* --------------------------------------------------------------------------
   Секция «Платформа ROBIN»: иконки прямо на «стеклянных» ячейках статичной
   картинки (см. front-page.php, $robin_plat_cells) — без своей подложки,
   цвет ячейки даёт сама картинка. Наведение на иконку или на пункт списка
   слева/справа подсвечивает пару — см. robin-platform-graphic.js.
   -------------------------------------------------------------------------- */
/* Рамка = реальный размер стеклянной ячейки (left/top/width/height в %,
   см. $robin_plat_cells), содержимое центрируется флексом — а не точка +
   translate(-50%,-50%), так центровка не зависит от размера иконки. */
.robin-plat-frame {
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	border: none;
	background: none;
	padding: 0;
	margin: 0;
	cursor: pointer;
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .18));
	transition: opacity .4s ease, transform .2s ease, filter .2s ease;
	transform: translateY(var(--plat-y, 0px));
}
.robin-plat-frame--group {
	flex-direction: column;
	gap: 8px;
}
.robin-plat-icon {
	display: block;
	margin: 0;
	padding: 0;
}
/* Мелкие иконки пунктов (не крупный маркер группы) — визуально опущены
   на 4px относительно центра ячейки. */
.robin-plat-icon.robin-feat-icon.h-6.w-6 {
	transform: translateY(4px);
}
.robin-plat-frame:hover,
.robin-plat-frame.is-linked {
	transform: translateY(var(--plat-y, 0px)) scale(1.1);
	filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .3));
}
.robin-plat-li {
	cursor: default;
}
.robin-plat-li.is-linked {
	background-color: #F6F3F1;
}
.robin-plat-li.is-linked > span:first-child {
	background: #A30C33;
}

/* --------------------------------------------------------------------------
   Инфографика блока «Платформа ROBIN»: точечные ambient-анимации на иконках
   самой картинки (.robin-plat-frame[data-feat-icon], крупные бордовые маркеры
   и мелкие ячейки-пункты), а не в текстовых карточках. Всё стоит на паузе,
   пока панель не видна (см. [data-plat-graphic].is-inview, добавляется тем же
   IntersectionObserver, что запускает stagger-появление плиток — см.
   robin-platform-graphic.js), и на hover/.is-linked — синхронный отклик
   с уже существующей подсветкой пары иконка/пункт списка. Только transform/
   opacity/stroke — раскладка (left/top/width/height) фреймов не трогается.
   Скорость/цвет — через CSS-переменные ниже (--robin-*-duration), которые
   можно переопределить точечно на [data-plat-graphic] или на любом предке.
   -------------------------------------------------------------------------- */
[data-plat-graphic] {
	--robin-wave-duration: 4.5s;
	--robin-line-duration: 3s;
	--robin-silhouette-duration: 4s;
	--robin-grid-duration: 6s;
	--robin-orbit-duration: 4.5s;
	--robin-flow-duration: 3.6s;
	--robin-scan-duration: 2.6s;
	--robin-ocr-duration: 3.2s;
	--robin-arrow-duration: 4s;
	--robin-cell-duration: 3.6s;
	--robin-node-duration: 2.4s;
	--robin-glint-duration: 3.4s;
}
.robin-feat-icon-wrap {
	position: relative;
	display: inline-flex;
}
.robin-feat-icon-wrap > .robin-plat-icon {
	position: relative;
	z-index: 1;
}

/* -------- Блок 1 «Автоматизация»: волна по мелким ячейкам сверху вниз ---- */
.robin-plat-frame[data-plat-graphic-item^="0-"]:not(.robin-plat-frame--group)::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: 10px;
	box-shadow: 0 0 0 0 rgba(163, 12, 51, 0);
	pointer-events: none;
	animation-name: robin-wave-pulse;
	animation-duration: var(--robin-wave-duration);
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: box-shadow, opacity;
}
[data-plat-graphic].is-inview .robin-plat-frame[data-plat-graphic-item^="0-"]:not(.robin-plat-frame--group)::after {
	animation-play-state: running;
}
[data-plat-graphic-item="0-0"]::after { animation-delay: 0s; }
[data-plat-graphic-item="0-1"]::after { animation-delay: .15s; }
[data-plat-graphic-item="0-2"]::after { animation-delay: .32s; }
[data-plat-graphic-item="0-3"]::after { animation-delay: .47s; }
[data-plat-graphic-item="0-4"]::after { animation-delay: .66s; }
@keyframes robin-wave-pulse {
	0%, 90%, 100% { box-shadow: 0 0 0 0 rgba(163, 12, 51, 0); opacity: 0; }
	4%            { opacity: 1; }
	16%           { box-shadow: 0 0 0 3px rgba(163, 12, 51, .22); opacity: 0; }
}

/* Flowchart (orchestration, 0-1): линии связей дорисовываются наружу. */
[data-plat-graphic-item="0-1"] svg path {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation-name: robin-line-draw;
	animation-duration: var(--robin-line-duration);
	animation-timing-function: cubic-bezier(.65, 0, .35, 1);
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: stroke-dashoffset;
}
[data-plat-graphic].is-inview [data-plat-graphic-item="0-1"] svg path {
	animation-play-state: running;
}

/* Users (team, 0-2): второй силуэт рядом с основным мягко проявляется. */
[data-plat-graphic-item="0-2"] svg path:nth-of-type(2),
[data-plat-graphic-item="0-2"] svg path:nth-of-type(3) {
	animation-name: robin-silhouette-fade;
	animation-duration: var(--robin-silhouette-duration);
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: opacity;
}
[data-plat-graphic].is-inview [data-plat-graphic-item="0-2"] svg path:nth-of-type(2),
[data-plat-graphic].is-inview [data-plat-graphic-item="0-2"] svg path:nth-of-type(3) {
	animation-play-state: running;
}
@keyframes robin-silhouette-fade {
	0%, 100% { opacity: .12; }
	45%, 65% { opacity: 1; }
}

/* Checklist (0-3): 2 галочки дорисовываются по очереди. */
[data-plat-graphic-item="0-3"] svg path:nth-of-type(2),
[data-plat-graphic-item="0-3"] svg path:nth-of-type(3) {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation-name: robin-line-draw;
	animation-duration: var(--robin-line-duration);
	animation-timing-function: cubic-bezier(.65, 0, .35, 1);
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: stroke-dashoffset;
}
[data-plat-graphic].is-inview [data-plat-graphic-item="0-3"] svg path:nth-of-type(2),
[data-plat-graphic].is-inview [data-plat-graphic-item="0-3"] svg path:nth-of-type(3) {
	animation-play-state: running;
}
[data-plat-graphic-item="0-3"] svg path:nth-of-type(3) { animation-delay: .45s; }
@keyframes robin-line-draw {
	0%, 8%    { stroke-dashoffset: 1; }
	40%, 60%  { stroke-dashoffset: 0; }
	95%, 100% { stroke-dashoffset: 1; }
}

/* Главный маркер «Автоматизация» (grid): 4 квадрата стартуют вразнобой и
   плавно собираются в ровную сетку — метафора «порядок из хаоса». */
.robin-plat-frame--group[data-feat-icon="grid"] svg rect {
	transform-box: fill-box;
	transform-origin: center;
	animation-duration: var(--robin-grid-duration);
	animation-timing-function: cubic-bezier(.22, 1, .36, 1);
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: transform;
}
[data-plat-graphic].is-inview .robin-plat-frame--group[data-feat-icon="grid"] svg rect {
	animation-play-state: running;
}
.robin-plat-frame--group[data-feat-icon="grid"] svg rect:nth-of-type(1) { animation-name: robin-grid-settle-1; }
.robin-plat-frame--group[data-feat-icon="grid"] svg rect:nth-of-type(2) { animation-name: robin-grid-settle-2; }
.robin-plat-frame--group[data-feat-icon="grid"] svg rect:nth-of-type(3) { animation-name: robin-grid-settle-3; }
.robin-plat-frame--group[data-feat-icon="grid"] svg rect:nth-of-type(4) { animation-name: robin-grid-settle-4; }
.robin-plat-frame--group[data-feat-icon="grid"]:hover svg rect,
.robin-plat-frame--group[data-feat-icon="grid"].is-linked svg rect {
	animation-duration: 1.4s;
}
@keyframes robin-grid-settle-1 {
	0%, 100% { transform: translate(-1.4px, -1.1px) rotate(-9deg); }
	18%, 85% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes robin-grid-settle-2 {
	0%, 100% { transform: translate(1.6px, -0.8px) rotate(7deg); }
	18%, 85% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes robin-grid-settle-3 {
	0%, 100% { transform: translate(-1.2px, 1.4px) rotate(6deg); }
	18%, 85% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes robin-grid-settle-4 {
	0%, 100% { transform: translate(1.3px, 1.2px) rotate(-8deg); }
	18%, 85% { transform: translate(0, 0) rotate(0deg); }
}

/* -------- Блок 2 «AI»: частицы из мелких ячеек летят к крупной звезде ---- */
.robin-feat-flow {
	position: absolute;
	inset: 0;
	pointer-events: none;
	overflow: visible;
}
.robin-feat-flow-dot {
	position: absolute;
	top: 50%;
	left: 78%;
	width: 3px;
	height: 3px;
	margin: -1.5px;
	border-radius: 50%;
	background: var(--robin-accent, #A30C33);
	opacity: 0;
	animation-name: robin-flow-in;
	animation-duration: var(--robin-flow-duration);
	animation-timing-function: ease-in;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: transform, opacity;
}
[data-plat-graphic].is-inview .robin-feat-flow-dot {
	animation-play-state: running;
}
[data-plat-graphic-item="1-0"] .robin-feat-flow-dot--1 { animation-delay: 0s; }
[data-plat-graphic-item="1-0"] .robin-feat-flow-dot--2 { animation-delay: .9s; }
[data-plat-graphic-item="1-1"] .robin-feat-flow-dot--1 { animation-delay: .3s; }
[data-plat-graphic-item="1-1"] .robin-feat-flow-dot--2 { animation-delay: 1.2s; }
[data-plat-graphic-item="1-2"] .robin-feat-flow-dot--1 { animation-delay: .6s; }
[data-plat-graphic-item="1-2"] .robin-feat-flow-dot--2 { animation-delay: 1.5s; }
@keyframes robin-flow-in {
	0%   { opacity: 0;  transform: translateX(0); }
	12%  { opacity: .9; }
	70%  { opacity: .7; transform: translateX(-64px); }
	100% { opacity: 0;  transform: translateX(-78px); }
}

/* Search (1-0): луч сканирования внутри линзы лупы (клип — круг лупы,
   координаты в % — проекция круга cx=11 cy=11 r=7 из 24×24 viewBox). */
.robin-feat-scan-clip {
	position: absolute;
	left: 16.667%;
	top: 16.667%;
	width: 58.333%;
	height: 58.333%;
	border-radius: 50%;
	overflow: hidden;
	pointer-events: none;
}
.robin-feat-scan-beam {
	position: absolute;
	left: -25%;
	right: -25%;
	height: 26%;
	background: linear-gradient(180deg, transparent, currentColor 50%, transparent);
	opacity: .6;
	animation-name: robin-scan-sweep;
	animation-duration: var(--robin-scan-duration);
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: transform;
}
[data-plat-graphic].is-inview .robin-feat-scan-beam {
	animation-play-state: running;
}
@keyframes robin-scan-sweep {
	0%, 8%    { transform: translateY(-30%); }
	50%       { transform: translateY(115%); }
	92%, 100% { transform: translateY(-30%); }
}

/* Document (doc-scan, 1-1): 3 строки «сканируются» по очереди — тусклая
   заливка сменяется полноценным currentColor, слева направо по списку. */
[data-plat-graphic-item="1-1"] svg path {
	opacity: .3;
	animation-name: robin-ocr-reveal;
	animation-duration: var(--robin-ocr-duration);
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: opacity;
}
[data-plat-graphic].is-inview [data-plat-graphic-item="1-1"] svg path {
	animation-play-state: running;
}
[data-plat-graphic-item="1-1"] svg path:nth-of-type(2) { animation-delay: .3s; }
[data-plat-graphic-item="1-1"] svg path:nth-of-type(3) { animation-delay: .6s; }
@keyframes robin-ocr-reveal {
	0%, 85%, 100% { opacity: .3; }
	35%, 55%      { opacity: 1; }
}

/* Главный маркер «AI» (звезда): частицы по орбите, часть пути их притягивает
   к центру (сжатие радиуса + затухание) — «поглощение» данных. */
.robin-feat-orbit {
	position: absolute;
	inset: 0;
	pointer-events: none;
}
.robin-feat-dot {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3px;
	height: 3px;
	margin: -1.5px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0;
	animation-name: robin-orbit;
	animation-duration: var(--robin-orbit-duration);
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: transform, opacity;
}
[data-plat-graphic].is-inview .robin-feat-dot {
	animation-play-state: running;
}
.robin-feat-dot--1 { animation-delay: 0s; }
.robin-feat-dot--2 { animation-delay: -1.5s; }
.robin-feat-dot--3 { animation-delay: -3s; }
.robin-plat-frame--group[data-feat-icon="sparkles"]:hover .robin-feat-dot,
.robin-plat-frame--group[data-feat-icon="sparkles"].is-linked .robin-feat-dot {
	animation-duration: 1.8s;
}
@keyframes robin-orbit {
	0%   { opacity: 0;   transform: rotate(0deg)   translateX(15px) rotate(0deg)    scale(.6); }
	12%  { opacity: .8; }
	45%  { opacity: .8;  transform: rotate(200deg) translateX(15px) rotate(-200deg) scale(1); }
	62%  { opacity: .9;  transform: rotate(260deg) translateX(3px)  rotate(-260deg) scale(.4); }
	78%  { opacity: 0;   transform: rotate(300deg) translateX(15px) rotate(-300deg) scale(.6); }
	100% { opacity: 0;   transform: rotate(360deg) translateX(15px) rotate(-360deg) scale(.6); }
}

/* -------- Блок 3 «Процессы»: стрелка рисует петлю, по завершении — общий
   импульс в 3 мелких ячейках (общая --robin-arrow-duration держит их в фазе,
   т.к. обе анимации стартуют одновременно по .is-inview и не сбиваются). --- */
.robin-plat-frame--group[data-feat-icon="handoff"] svg polyline,
.robin-plat-frame--group[data-feat-icon="handoff"] svg path {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation-name: robin-arrow-draw;
	animation-duration: var(--robin-arrow-duration);
	animation-timing-function: cubic-bezier(.65, 0, .35, 1);
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: stroke-dashoffset;
}
[data-plat-graphic].is-inview .robin-plat-frame--group[data-feat-icon="handoff"] svg polyline,
[data-plat-graphic].is-inview .robin-plat-frame--group[data-feat-icon="handoff"] svg path {
	animation-play-state: running;
}
.robin-plat-frame--group[data-feat-icon="handoff"] svg path { animation-delay: .15s; }
@keyframes robin-arrow-draw {
	0%, 8%    { stroke-dashoffset: 1; }
	45%, 60%  { stroke-dashoffset: 0; }
	95%, 100% { stroke-dashoffset: 1; }
}
.robin-plat-frame[data-plat-graphic-item^="2-"]:not(.robin-plat-frame--group)::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: 10px;
	box-shadow: 0 0 0 0 rgba(163, 12, 51, 0);
	pointer-events: none;
	animation-name: robin-sync-pulse;
	animation-duration: var(--robin-arrow-duration);
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: box-shadow, opacity;
}
[data-plat-graphic].is-inview .robin-plat-frame[data-plat-graphic-item^="2-"]:not(.robin-plat-frame--group)::after {
	animation-play-state: running;
}
@keyframes robin-sync-pulse {
	0%, 43%, 68%, 100% { box-shadow: 0 0 0 0 rgba(163, 12, 51, 0); opacity: 0; }
	48%                { opacity: 1; }
	60%                { box-shadow: 0 0 0 3px rgba(163, 12, 51, .22); opacity: 0; }
}

/* Table (layout-form, 2-0): 3 ячейки заливаются светом по очереди
   (координаты в % — проекция сетки x4..20/y4..20, разделы y9.5 и x9.5 из
   24×24 viewBox). */
.robin-feat-cell {
	position: absolute;
	background: currentColor;
	opacity: 0;
	border-radius: 1.5px;
	pointer-events: none;
	animation-name: robin-cell-fill;
	animation-duration: var(--robin-cell-duration);
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: opacity;
}
[data-plat-graphic].is-inview .robin-feat-cell {
	animation-play-state: running;
}
.robin-feat-cell--1 { left: 16.667%; top: 16.667%; width: 66.667%; height: 22.917%; animation-delay: 0s; }
.robin-feat-cell--2 { left: 16.667%; top: 39.583%; width: 22.917%; height: 43.75%;  animation-delay: .35s; }
.robin-feat-cell--3 { left: 39.583%; top: 39.583%; width: 43.75%;  height: 43.75%;  animation-delay: .7s; }
@keyframes robin-cell-fill {
	0%, 92%, 100% { opacity: 0; }
	25%, 55%      { opacity: .22; }
}

/* Node (branch, 2-1): линии статичны (как есть), вдоль них бежит светящаяся
   точка-пульс — CSS Motion Path по той же геометрии, что и path в иконке
   (M6 6.5v11M6 12h10 из 24×24 viewBox = ровно те же px при h-6 w-6 иконке). */
.robin-feat-node-pulse {
	position: absolute;
	top: 0;
	left: 0;
	width: 2.4px;
	height: 2.4px;
	margin: -1.2px 0 0 -1.2px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0;
	offset-path: path('M6 6.5v11M6 12h10');
	animation-name: robin-node-pulse;
	animation-duration: var(--robin-node-duration);
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: offset-distance, opacity;
}
[data-plat-graphic].is-inview .robin-feat-node-pulse {
	animation-play-state: running;
}
@keyframes robin-node-pulse {
	0%   { offset-distance: 0%;   opacity: 0; }
	8%   { opacity: 1; }
	92%  { opacity: 1; }
	100% { offset-distance: 100%; opacity: 0; }
}

/* Key/доступ (user-check, 2-2): галочка проявляется как «глинт» — быстрая
   яркая отрисовка, символизирует «доступ разрешён». */
[data-plat-graphic-item="2-2"] svg path:nth-of-type(2) {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation-name: robin-line-draw;
	animation-duration: var(--robin-glint-duration);
	animation-timing-function: cubic-bezier(.65, 0, .35, 1);
	animation-iteration-count: infinite;
	animation-play-state: paused;
	will-change: stroke-dashoffset;
}
[data-plat-graphic].is-inview [data-plat-graphic-item="2-2"] svg path:nth-of-type(2) {
	animation-play-state: running;
}

@media (prefers-reduced-motion: reduce) {
	[data-plat-graphic] *,
	[data-plat-graphic] *::after {
		animation: none !important;
		transform: none !important;
		stroke-dashoffset: 0 !important;
	}
	.robin-feat-dot,
	.robin-feat-flow-dot,
	.robin-feat-cell,
	.robin-feat-scan-beam,
	.robin-feat-node-pulse {
		opacity: 0 !important;
	}
	[data-plat-graphic-item="1-1"] svg path,
	[data-plat-graphic-item="0-2"] svg path:nth-of-type(2),
	[data-plat-graphic-item="0-2"] svg path:nth-of-type(3) {
		opacity: 1 !important;
	}
}

/* --------------------------------------------------------------------------
   Иллюстрации карточек «Объединяем технологии в единый процесс»
   (page-platform.php, robin_platform_tech_illustration в functions.php) —
   инлайн-SVG вместо растровых мокапов. Два ambient-эффекта, общие на все
   3 карточки (RPA/AI/Процессы):
     1. .robin-tech-dash — бегущий пунктир по всем коннекторам (dasharray
        "1 6", период 7 → dashoffset -7 замыкает цикл бесшовно).
     2. .robin-tech-pulse — короткий «пульс» (шаг/спутник/аватар), пункты
        оживают по очереди через animation-delay в разметке — волна
        «данные идут по цепочке» вместо статичной картинки.
   Обе анимации стоят на паузе, пока [data-tech-illust] не попадёт во
   вьюпорт — включает .is-inview тот же приём IntersectionObserver, что
   у инфографики «Платформа ROBIN» выше (см. robin-platform-tech.js).
   -------------------------------------------------------------------------- */
.robin-tech-dash {
	animation: robin-tech-march 1.6s linear infinite;
	animation-play-state: paused;
	will-change: stroke-dashoffset;
}
[data-tech-illust].is-inview .robin-tech-dash {
	animation-play-state: running;
}
@keyframes robin-tech-march {
	to { stroke-dashoffset: -7; }
}

.robin-tech-pulse {
	transform-box: fill-box;
	transform-origin: center;
	animation: robin-tech-pop 3s ease-in-out infinite;
	animation-play-state: paused;
	will-change: transform;
}
[data-tech-illust].is-inview .robin-tech-pulse {
	animation-play-state: running;
}
@keyframes robin-tech-pop {
	0%   { transform: scale(1); }
	4%   { transform: scale(1.22); }
	11%  { transform: scale(1); }
	100% { transform: scale(1); }
}

/* Ядро AI-карточки — тихое «дыхание» вместо резкого пульса шагов/спутников. */
.robin-tech-core {
	transform-box: fill-box;
	transform-origin: center;
	animation: robin-tech-breathe 3s ease-in-out infinite;
	animation-play-state: paused;
	will-change: transform;
}
[data-tech-illust].is-inview .robin-tech-core {
	animation-play-state: running;
}
@keyframes robin-tech-breathe {
	0%, 100% { transform: scale(1); }
	50%      { transform: scale(1.08); }
}

/* «Преимущества платформы ROBIN» (page-platform.php): иллюстрация по мотивам
   gitbook.com — наклонное градиентное пятно, плавающие карточки и
   «сканирующий» блик по полосе, как у карточки агента GitBook. */
.robin-adv-blob {
	transform: translate(-50%, -50%) rotate(-53deg);
}
.robin-adv-float {
	animation: robin-adv-bob 6s ease-in-out infinite;
	animation-play-state: paused;
}
.robin-adv-scan {
	animation: robin-adv-scan 2.2s ease-in-out infinite;
	animation-play-state: paused;
}
[data-tech-illust].is-inview .robin-adv-float,
[data-tech-illust].is-inview .robin-adv-scan {
	animation-play-state: running;
}
@keyframes robin-adv-bob {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-6px); }
}
@keyframes robin-adv-scan {
	from { transform: translateX(-100%); }
	to   { transform: translateX(200%); }
}

/* Инфографика «Преимущества» (page-platform.php, .robin-advg) — по мотивам
   [data-plat-graphic] на главной: панели проявляются по очереди при скролле,
   по светлым ячейкам бежит «волна» (тот же robin-wave-pulse). Всё на паузе до
   [data-tech-illust].is-inview (robin-platform-tech.js). */
.robin-advg-panel {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1);
	transition-delay: calc(var(--i, 0) * .14s);
}
.robin-advg.is-inview .robin-advg-panel {
	opacity: 1;
	transform: none;
}
.robin-advg-cell {
	cursor: default;
	transition: transform .2s ease, box-shadow .2s ease;
}
.robin-advg-cell.is-linked {
	transform: scale(1.06);
	box-shadow: 0 4px 14px -4px rgba(138, 10, 43, .45);
}
.robin-advg-cell:not(.robin-advg-cell--group)::after {
	content: "";
	position: absolute;
	inset: -3px;
	border-radius: 10px;
	pointer-events: none;
	animation: robin-wave-pulse 4.5s ease-out infinite;
	animation-delay: var(--d, 0s);
	animation-play-state: paused;
}
.robin-advg.is-inview .robin-advg-cell::after {
	animation-play-state: running;
}
.robin-adv-p.is-linked {
	background-color: #F6F3F1;
	color: #1C1917;
}
@media (prefers-reduced-motion: reduce) {
	.robin-advg-panel {
		opacity: 1;
		transform: none;
		transition: none;
	}
	.robin-advg-cell::after {
		animation: none !important;
	}
}


/* Иконки инфографики «Преимущества» — ambient-анимации по смыслу каждой
   иконки, тот же приём, что у [data-plat-graphic] на главной: только
   transform/opacity/stroke, всё на паузе до .robin-advg.is-inview
   (robin-platform-tech.js), при наведении/.is-linked — быстрее.
   Ключ — data-feat-icon на ячейке. Часть эффектов (robin-feat-cell,
   robin-feat-node-pulse, robin-line-draw, robin-silhouette-fade,
   robin-arrow-draw) переиспользована с главной — см. выше. */
.robin-advg {
	--robin-cell-duration: 3.6s;
	--robin-node-duration: 2.4s;
	--robin-line-duration: 3s;
	--robin-silhouette-duration: 4s;
	--robin-arrow-duration: 4s;
}
.robin-advg-cell > svg,
.robin-advg-cell > .robin-feat-icon-wrap {
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .18));
}
/* !important — правила ниже задают animation шорткатом, который иначе
   сбросил бы паузу. */
.robin-advg:not(.is-inview) .robin-advg-cell svg,
.robin-advg:not(.is-inview) .robin-advg-cell svg *,
.robin-advg:not(.is-inview) .robin-feat-cell,
.robin-advg:not(.is-inview) .robin-feat-node-pulse {
	animation-play-state: paused !important;
}
.robin-advg.is-inview .robin-feat-cell,
.robin-advg.is-inview .robin-feat-node-pulse {
	animation-play-state: running;
}
.robin-advg-cell.is-linked svg,
.robin-advg-cell.is-linked svg * {
	animation-duration: 1.4s !important;
}

/* Отрисовка штрихом (pathLength="1"): галочка в щите, строки на мониторе,
   галочка доступа, связи блок-схем. */
.robin-advg [data-feat-icon="shield"] svg path:nth-of-type(2),
.robin-advg [data-feat-icon="monitor"] svg path:nth-of-type(2),
.robin-advg [data-feat-icon="monitor"] svg path:nth-of-type(3),
.robin-advg [data-feat-icon="user-check"] svg path:nth-of-type(2),
.robin-advg [data-feat-icon="blocks"] svg path,
.robin-advg [data-feat-icon="orchestration"] svg path {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation-name: robin-line-draw;
	animation-duration: var(--robin-line-duration);
	animation-timing-function: cubic-bezier(.65, 0, .35, 1);
	animation-iteration-count: infinite;
}
.robin-advg [data-feat-icon="monitor"] svg path:nth-of-type(3) { animation-delay: .35s; }
.robin-advg [data-feat-icon="user-check"] svg path:nth-of-type(2) { animation-delay: .5s; }
.robin-advg [data-feat-icon="orchestration"] svg path { animation-delay: .8s; }

/* Стрелка передачи (handoff): та же петля отрисовки, что у «Процессов». */
.robin-advg [data-feat-icon="handoff"] svg polyline,
.robin-advg [data-feat-icon="handoff"] svg path {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation-name: robin-arrow-draw;
	animation-duration: var(--robin-arrow-duration);
	animation-timing-function: cubic-bezier(.65, 0, .35, 1);
	animation-iteration-count: infinite;
}
.robin-advg [data-feat-icon="handoff"] svg path { animation-delay: .15s; }

/* Код: угловые скобки «дышат» в стороны от слэша. */
.robin-advg [data-feat-icon="code"] svg path:nth-of-type(1),
.robin-advg [data-feat-icon="code"] svg path:nth-of-type(2) {
	animation: robin-adv-bracket 3.2s ease-in-out infinite;
}
.robin-advg [data-feat-icon="code"] svg path:nth-of-type(2) { animation-name: robin-adv-bracket-l; }
@keyframes robin-adv-bracket {
	0%, 60%, 100% { transform: translateX(0); }
	25%, 40%      { transform: translateX(1.6px); }
}
@keyframes robin-adv-bracket-l {
	0%, 60%, 100% { transform: translateX(0); }
	25%, 40%      { transform: translateX(-1.6px); }
}

/* Ключ поворачивается «в замке». */
.robin-advg [data-feat-icon="key"] svg {
	transform-origin: 8px 15px;
	animation: robin-adv-key 3.6s ease-in-out infinite;
}
@keyframes robin-adv-key {
	0%, 55%, 100% { transform: rotate(0deg); }
	20%, 35%      { transform: rotate(-22deg); }
}

/* Замок: дужка приподнимается и защёлкивается. */
.robin-advg [data-feat-icon="lock"] svg path {
	animation: robin-adv-shackle 3.6s cubic-bezier(.5, 0, .3, 1) infinite;
	animation-delay: .6s;
}
@keyframes robin-adv-shackle {
	0%, 50%, 100% { transform: translateY(0); }
	20%, 35%      { transform: translateY(-2px); }
	42%           { transform: translateY(.4px); }
}

/* Медаль: круг коротко «вспыхивает». */
.robin-advg [data-feat-icon="badge"] svg circle {
	transform-box: fill-box;
	transform-origin: center;
	animation: robin-tech-pop 3.6s ease-in-out infinite;
	animation-delay: .9s;
}

/* Терминал: мигающий курсор после приглашения. */
.robin-advg [data-feat-icon="terminal"] svg path:nth-of-type(2) {
	animation: robin-adv-caret 1.1s steps(1, end) infinite;
}
@keyframes robin-adv-caret {
	0%, 55% { opacity: 1; }
	56%, 100% { opacity: 0; }
}

/* Команда: второй силуэт проявляется (как на главной). */
.robin-advg [data-feat-icon="team"] svg path:nth-of-type(2),
.robin-advg [data-feat-icon="team"] svg path:nth-of-type(3) {
	animation: robin-silhouette-fade var(--robin-silhouette-duration) ease-in-out infinite;
}

/* Обучение: шапочку «подбрасывают». */
.robin-advg [data-feat-icon="academy"] svg {
	animation: robin-adv-toss 3.8s cubic-bezier(.3, 0, .3, 1) infinite;
}
@keyframes robin-adv-toss {
	0%, 45%, 100% { transform: translateY(0) rotate(0deg); }
	18%           { transform: translateY(-3px) rotate(-8deg); }
	32%           { transform: translateY(0) rotate(0deg); }
	38%           { transform: translateY(-.8px); }
}

/* Блоки No-Code: квадраты поочерёдно «встают на место». */
.robin-advg [data-feat-icon="blocks"] svg rect {
	transform-box: fill-box;
	transform-origin: center;
	animation: robin-tech-pop 3s ease-in-out infinite;
}
.robin-advg [data-feat-icon="blocks"] svg rect:nth-of-type(2) { animation-delay: 1.2s; }

@media (prefers-reduced-motion: reduce) {
	.robin-advg-cell svg,
	.robin-advg-cell svg * {
		animation: none !important;
		transform: none !important;
		stroke-dashoffset: 0 !important;
		opacity: 1 !important;
	}
	.robin-advg .robin-feat-cell,
	.robin-advg .robin-feat-node-pulse {
		animation: none !important;
		opacity: 0 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.robin-adv-float,
	.robin-adv-scan {
		animation: none !important;
	}
	.robin-tech-dash,
	.robin-tech-pulse,
	.robin-tech-core {
		animation: none !important;
		transform: none !important;
		stroke-dashoffset: 0 !important;
	}
}

/* --------------------------------------------------------------------------
   Полоса логотипов: непрерывная «бегущая строка» (marquee), оформленная
   как карточка-галерея логотипов у firecrawl.dev — рамка-«окно» на vellum-
   фоне (#F9F9F9/#F6F3F1), логотипы едут внутри неё без разделителей между
   ячейками — единственная вертикальная линия в блоке отделяет текстовую
   подпись слева от ленты (см. .robin-logo-cell в front-page.php).
   Набор логотипов выводится дважды (см. front-page.php); трек сдвигается
   ровно на половину своей ширины → петля бесшовна. По наведению — быстрее.
   -------------------------------------------------------------------------- */
.robin-logos-marquee {
	/* Рамка/фон карточки теперь на общем контейнере вместе с подписью слева
	   (см. front-page.php, data-logos) — здесь только окно прокрутки. */
	position: relative;
	overflow: hidden;
}
/* Затухание к краям рамки — не CSS-маска (она гасила бы саму рамку), а
   наложенные градиенты в цвет фона карточки (белый): логотипы уходят
   «под рамку», а сама граница карточки остаётся чёткой. */
.robin-logos-marquee::before,
.robin-logos-marquee::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 64px;
	z-index: 1;
	pointer-events: none;
}
.robin-logos-marquee::before {
	left: 0;
	background: linear-gradient(to right, #ffffff, transparent);
}
.robin-logos-marquee::after {
	right: 0;
	background: linear-gradient(to left, #ffffff, transparent);
}
.robin-logos-track {
	width: max-content;
	animation: robin-logos-scroll 60s linear infinite;
	will-change: transform;
}
/* по наведению курсора лента едет чуть быстрее */
.robin-logos-marquee:hover .robin-logos-track {
	animation-duration: 38s;
}
@keyframes robin-logos-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
/* Лента — осознанный, плавный элемент оформления, поэтому движется всегда.
   Для системной настройки «уменьшить движение» не отключаем её полностью,
   а лишь замедляем, чтобы движение оставалось ненавязчивым. */
@media (prefers-reduced-motion: reduce) {
	.robin-logos-track { animation-duration: 90s; }
	.robin-logos-marquee:hover .robin-logos-track { animation-duration: 60s; }
}

/* Разделители между логотипами убраны — по просьбе пользователя единственная
   вертикальная линия в блоке остаётся только между текстовой подписью и
   лентой (border-r на статичном блоке подписи, см. front-page.php). */
.robin-logo-cell {}

/* Монохромный тон логотипов (#262626, как ink-цвет текста у firecrawl.dev):
   красит только тёмные пиксели (текст/знак) через SVG-фильтр
   #robin-logo-tint (см. разметку ленты) — светлый/прозрачный фон логотипа
   остаётся нетронутым. По наведению фильтр снимается — проявляются
   настоящие цвета логотипа. */
.robin-logo-mono {
	filter: url(#robin-logo-tint);
	transition: filter .2s ease;
}
.robin-logo-mono:hover {
	filter: none;
}

/* --------------------------------------------------------------------------
   Ленты экранов-скелетонов по краям чата в сценарии «Любой ИИ-движок без
   привязки» (front-page.php, data-assist-stage="0") — референс: блёклые
   скриншоты продукта по бокам от чат-карточки на gitbook.com. Механика —
   та же, что у .robin-logos-marquee (дублируем контент, едем на -50%,
   петля бесшовна), только по вертикали и в двух направлениях: левая лента
   вверх, правая — вниз.
   -------------------------------------------------------------------------- */
.robin-skel-ribbon {
	position: relative;
	overflow: hidden;
	height: 100%;
}
/* Затухание сверху/снизу в цвет фона окна чата (#F0F2F6) — карточки
   «выезжают»/«уезжают» под рамку, не обрезаются резко. */
.robin-skel-ribbon::before,
.robin-skel-ribbon::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	height: 40px;
	z-index: 1;
	pointer-events: none;
}
.robin-skel-ribbon::before {
	top: 0;
	background: linear-gradient(to bottom, #F0F2F6, transparent);
}
.robin-skel-ribbon::after {
	bottom: 0;
	background: linear-gradient(to top, #F0F2F6, transparent);
}
.robin-skel-track {
	display: flex;
	flex-direction: column;
	gap: 10px;
	will-change: transform;
}
.robin-skel-track--up { animation: robin-skel-up 26s linear infinite; }
.robin-skel-track--down { animation: robin-skel-down 26s linear infinite; }
@keyframes robin-skel-up {
	from { transform: translateY(0); }
	to   { transform: translateY(-50%); }
}
@keyframes robin-skel-down {
	from { transform: translateY(-50%); }
	to   { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.robin-skel-track--up, .robin-skel-track--down { animation-duration: 70s; }
}

/* Карточка-скелетон: блёклый макет чужого экрана (не настоящий скриншот) —
   строки-плейсхолдеры и мелкие боксы, тон светлее основного интерфейса.
   Пропорция 16:9 — «уменьшенный экран 1920×1080», а не квадратная плитка;
   ширина приходит от ленты (100%), высота считается из aspect-ratio. */
.robin-skel-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	flex: none;
	width: 100%;
	aspect-ratio: 16 / 9;
	padding: 10px 12px;
	border-radius: 10px;
	background: #ffffff;
	border: 1px solid #E6EBF3;
}
.robin-skel-card__head {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 2px;
}
.robin-skel-line {
	display: block;
	height: 6px;
	border-radius: 999px;
	background: #E2E8F0;
}
.robin-skel-row {
	display: flex;
	align-items: center;
	gap: 6px;
}
.robin-skel-dot {
	flex: none;
	width: 6px;
	height: 6px;
	border-radius: 2px;
	background: #CBD5E1;
}
.robin-skel-avatar {
	flex: none;
	width: 16px;
	height: 16px;
	border-radius: 5px;
	background: #F3D2DC;
}
.robin-skel-pill {
	display: block;
	width: 40px;
	height: 12px;
	margin-top: 2px;
	border-radius: 999px;
	background: #FAEAEF;
}
.robin-skel-grid {
	display: grid;
	grid-template-columns: repeat(4, 16px);
	gap: 6px;
}
.robin-skel-box {
	width: 16px;
	height: 16px;
	border-radius: 4px;
	background: #EDF0F5;
}
/* Три точки «окна», как у настоящего браузера/приложения — сидят в углу
   некоторых вариантов карточки-скелетона (list/table) для разнообразия. */
.robin-skel-wdots {
	display: flex;
	gap: 4px;
	margin-bottom: 2px;
}
.robin-skel-wdot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #D8DEE9;
}
/* Строка «таблицы»: несколько отрезков в ряд (не друг под другом, как
   .robin-skel-line сам по себе) — референс «список с колонками». */
.robin-skel-trow {
	display: flex;
	align-items: center;
	gap: 10px;
}
/* На вкладке «Любой ИИ-движок без привязки» (data-assist-stage="0") прячем
   «оболочку приложения» — навигацию, шапку с токенами и поле ввода (см.
   data-assist-nav/-header/-inputbar в front-page.php, переключает
   robin-assistant-tabs.js): там своя чистая hero-композиция без плотной
   обвязки, референс — GitBook Assistant, и место отдаётся под увеличенную
   центральную карточку. !important — элементы несут утилитные классы display
   (hidden/flex), у которых та же специфичность, что и у обычного [hidden]. */
.robin-assist-nav--collapsed,
.robin-assist-header--collapsed,
.robin-assist-inputbar--collapsed {
	display: none !important;
}

/* Табы data-pp-tabs/robin-partner-tabs.js: панели несут Tailwind-утилиту
   display (grid/flex), у которой та же специфичность, что и у обычного
   [hidden] — без !important браузер применяет автора-стиль вместо UA-правила
   [hidden]{display:none}, и скрытая панель всё равно рендерится. */
[data-pp-panel][hidden] {
	display: none !important;
}

/* Смена экрана по клику на таб — фейд снизу вверх вместо жёсткого [hidden]:
   активный экран стоит на месте (opacity 1, translateY 0), неактивный
   опущен на 16px и прозрачен, но остаётся в DOM (pointer-events отключены),
   чтобы transition было чем анимировать при снятии --hidden. */
.robin-assist-stage {
	transition: opacity .45s ease, transform .45s ease;
}
.robin-assist-stage--hidden {
	opacity: 0;
	transform: translateY(16px);
	pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
	.robin-assist-stage { transition: opacity .2s linear; }
	.robin-assist-stage--hidden { transform: none; }
}

/* Мигающий курсор в конце текста, который посимвольно печатает сценарий
   «No-Code оркестрация» в поле ввода окна (см. typeIntoInput в
   robin-assistant-scenarios.js) — имитация реального набора запроса. */
.robin-typing-caret {
	display: inline-block;
	width: 1px;
	height: 12px;
	margin-left: 1px;
	vertical-align: -2px;
	background: currentColor;
	animation: robin-caret-blink 1s step-end infinite;
}
@keyframes robin-caret-blink {
	50% { opacity: 0; }
}

/* Подпись под окном раздела «ROBIN. Ассистент» — каждое предложение
   проявляется построчно снизу вверх при переключении вкладки (см. activate()
   в robin-assistant-tabs.js). */
.robin-assist-caption-line {
	margin: 0;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .45s ease, transform .45s ease;
}
.robin-assist-caption-line + .robin-assist-caption-line {
	margin-top: .35em;
}
.robin-assist-caption-line--visible {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.robin-assist-caption-line { transition: opacity .2s linear; transform: none; }
}

/* Кнопка «Узнать больше об Ассистенте» — на каждое переключение вкладки
   всплывает снизу заново (сбрасывается на translateY(24px)/opacity:0, затем
   с небольшой задержкой после смены сценария едет на место), а не просто
   висит статично под окном. Задержка проставляется через activate() в
   robin-assistant-tabs.js — та же логика, что у подписи выше. */
.robin-assist-cta {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .5s cubic-bezier(0.16, 1, 0.3, 1), transform .5s cubic-bezier(0.16, 1, 0.3, 1);
}
.robin-assist-cta--visible {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.robin-assist-cta { transition: opacity .2s linear; transform: none; opacity: 1; }
}

/* ==========================================================================
   Раздел «ROBIN. Ассистент», вкладка «Локальные GPT-модели» — 3-колоночная
   демонстрация (документ / чат / дашборд). Таймлайн — GSAP, см.
   assets/js/robin-assistant-gpt-scenario.js; здесь только статическое
   оформление (переменные цвета, скелетон документа, скан-линия, теги,
   моноширинный код), сам таймлайн работает через opacity/transform/height,
   которые GSAP выставляет напрямую через style.
   ========================================================================== */
.robin-gpt-demo {
	--robin-gpt-bg: #F4F5F7;
	--robin-gpt-accent: #8B1C2B;
	--robin-gpt-user-msg: #D9E8FF;
	--robin-gpt-scan: #16A34A;
	--robin-gpt-tag: #334155;
	background: var(--robin-gpt-bg);
}
.robin-gpt-doc-line {
	display: block;
	height: 7px;
	border-radius: 4px;
	background: #E2E5EB;
	filter: blur(2.5px);
	transition: filter .6s ease;
}
.robin-gpt-doc--sharp .robin-gpt-doc-line {
	filter: blur(0);
}
.robin-gpt-scanline {
	position: absolute;
	left: 10px;
	right: 10px;
	top: 28px;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--robin-gpt-scan), transparent);
	box-shadow: 0 0 10px 2px rgba(22, 163, 74, .5);
	opacity: 0;
	pointer-events: none;
}
.robin-gpt-tag {
	position: absolute;
	left: 12px;
	white-space: nowrap;
	padding: 2px 8px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--robin-gpt-tag);
	color: var(--robin-gpt-tag);
	font-size: 10px;
	font-weight: 600;
	box-shadow: 0 2px 6px rgba(51, 65, 85, .25);
	opacity: 0;
	pointer-events: none;
	z-index: 20;
}
.robin-gpt-json-code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	white-space: pre-wrap;
	word-break: break-word;
}
.robin-gpt-badge-dot {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 999px;
	background: var(--robin-gpt-accent);
	animation: robin-gpt-badge-pulse 1.6s ease-in-out infinite;
}
@keyframes robin-gpt-badge-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: .4; transform: scale(.7); }
}
/* Дашборд справа виден сразу с типовыми данными (см. front-page.php) —
   ничего не проявляется из пустоты; когда сценарий досчитывает текущий
   документ, значения обновляются на месте (см. флеш ниже), а в «Похожие
   договоры» справа вырастает новый столбик — «текущий», подписанный
   тегом, который сидит вплотную над его растущим краем (bottom: 100% —
   едет вместе со столбиком, пока тот растёт). */
.robin-gpt-bar-tag {
	position: absolute;
	bottom: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(4px);
	margin-bottom: 4px;
	white-space: nowrap;
	padding: 1px 6px;
	border-radius: 999px;
	background: var(--robin-gpt-accent);
	color: #fff;
	font-size: 9px;
	font-weight: 600;
	opacity: 0;
	pointer-events: none;
}
.robin-gpt-card-flash {
	animation: robin-gpt-card-flash 900ms ease-out;
}
@keyframes robin-gpt-card-flash {
	0% { background-color: rgba(139, 28, 43, .12); }
	100% { background-color: #fff; }
}
@media (prefers-reduced-motion: reduce) {
	.robin-gpt-doc-line { transition: none; }
	.robin-gpt-badge-dot { animation: none; }
	.robin-gpt-card-flash { animation: none; }
}
/* ==========================================================================
   ПРЕИМУЩЕСТВА ПЛАТФОРМЫ ROBIN — таблица сравнения. Референс стиля — блок
   «Not your average checkup» на functionhealth.com: бежевая панель, строки на
   hairline-разделителях, колонка-лидер — приподнятая градиентная карточка,
   выходящая за верх и низ панели. Терракоту Function заменяет бордовый
   акцент ROBIN; акцентное слово заголовка — Lora Italic (как в .rcm-pains).
   ========================================================================== */
.rcx-title {
	margin: 0 auto;
	max-width: 48rem;
	text-align: center;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: clamp(2rem, 1.4rem + 2.2vw, 2.8125rem);
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: #242424;
}
.rcx-title em {
	font-family: "Lora", Georgia, "Times New Roman", serif;
	font-style: italic;
	font-weight: 400;
	letter-spacing: -0.01em;
	color: var(--robin-accent);
}
/* Акцентное слово тем же шрифтом, что и весь заголовок — меняется только цвет. */
.rcx-title-accent {
	color: var(--robin-accent);
}
.rcx-lead {
	margin: 20px auto 0;
	max-width: 36rem;
	text-align: center;
	font-size: 1rem;
	line-height: 1.55;
	color: #797776;
}

/* Пропорции колонок — в процентах, как у Function: так подложка карточки
   (абсолютная) точно совпадает с колонкой ROBIN в каждой строке. */
.rcx {
	--rcx-label: 34%;
	--rcx-gap-l: 3%;
	--rcx-card: 23%;
	--rcx-gap-r: 2%;
	--rcx-col: 19%;
	--rcx-head: 96px;          /* шапка над панелью = вылет карточки вверх */
	--rcx-tail: 48px;          /* вылет карточки вниз за панель */
	--rcx-pad: 40px;           /* боковые поля панели */
	--rcx-row: 4.4375rem;
	--rcx-panel: #F6F3F1;
	--rcx-stroke: #D6D1CD;
	--rcx-ink: #242424;
	--rcx-muted: #4E4D4D;
	--rcx-card-bg: #EDEBE9;
	--rcx-card-line: var(--rcx-stroke);
	width: min(100%, 72rem);
	margin: 56px auto 0;
	padding: 0 var(--rcx-pad) var(--rcx-tail);
}
.rcx__inner { position: relative; }

/* Бежевая панель — псевдоэлемент: начинается под шапкой колонок, чтобы
   карточка ROBIN и подписи конкурентов «висели» над её верхним краем. */
.rcx__inner::before {
	content: "";
	position: absolute;
	top: var(--rcx-head);
	right: calc(var(--rcx-pad) * -1);
	bottom: -12px;
	left: calc(var(--rcx-pad) * -1);
	border-radius: 24px;
	background: var(--rcx-panel);
}

.rcx__card {
	position: absolute;
	z-index: 1;
	top: 0;
	bottom: calc(var(--rcx-tail) * -1);
	left: calc(var(--rcx-label) + var(--rcx-gap-l));
	width: var(--rcx-card);
	border-radius: 24px;
	background: var(--rcx-card-bg);
	box-shadow: 0 .25rem 1.875rem rgba(0, 0, 0, .06);
}

.rcx__row {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: var(--rcx-label) var(--rcx-gap-l) var(--rcx-card) var(--rcx-gap-r) var(--rcx-col) var(--rcx-col);
	align-items: center;
	min-height: var(--rcx-row);
}
/* Разделитель строки: серый по панели, светлый поверх карточки, пропуски
   в зазорах вокруг карточки (у Function их закрывает сама карточка). */
.rcx__row::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: linear-gradient(90deg,
		var(--rcx-stroke) 0 var(--rcx-label),
		transparent var(--rcx-label) calc(var(--rcx-label) + var(--rcx-gap-l)),
		var(--rcx-card-line) calc(var(--rcx-label) + var(--rcx-gap-l)) calc(var(--rcx-label) + var(--rcx-gap-l) + var(--rcx-card)),
		transparent calc(var(--rcx-label) + var(--rcx-gap-l) + var(--rcx-card)) calc(100% - var(--rcx-col) * 2),
		var(--rcx-stroke) calc(100% - var(--rcx-col) * 2) 100%);
}
.rcx__row--last::after { display: none; }
/* Шапка: линия только под логотипом на карточке (панель начинается ниже). */
.rcx__row--head {
	min-height: var(--rcx-head);
	align-items: stretch;
}
.rcx__row--head::after {
	background: linear-gradient(90deg,
		transparent 0 calc(var(--rcx-label) + var(--rcx-gap-l)),
		var(--rcx-card-line) calc(var(--rcx-label) + var(--rcx-gap-l)) calc(var(--rcx-label) + var(--rcx-gap-l) + var(--rcx-card)),
		transparent calc(var(--rcx-label) + var(--rcx-gap-l) + var(--rcx-card)) 100%);
}

.rcx__label {
	grid-column: 1;
	margin: 0;
	padding: 14px 0;
	font-size: clamp(1rem, .188vw + .9558rem, 1.125rem);
	line-height: 1.4;
	color: var(--rcx-ink);
}
.rcx__row--head .rcx__label { padding: 0; }

.rcx__brand {
	grid-column: 3;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 2px;
	padding: 16px 14px;
	text-align: left;
	color: var(--rcx-ink);
}
.rcx__brand-name { font-size: 1.375rem; font-weight: 500; letter-spacing: .04em; line-height: 1.1; }
.rcx__brand-sub { font-size: .75rem; color: #797776; }

/* Подписи конкурентов — над панелью, как «Standard checkup» у Function. */
.rcx__colhead {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 2px;
	padding: 0 8px 14px;
	text-align: left;
	color: var(--rcx-ink);
}
.rcx__colhead-title { font-size: 1rem; line-height: 1.3; }
.rcx__colhead-sub { font-size: .75rem; color: #797776; }
.rcx__row--head > :nth-child(3) { grid-column: 5; }
.rcx__row--head > :nth-child(4) { grid-column: 6; }

.rcx__val {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	padding: 10px 8px;
	text-align: left;
}
.rcx__val--robin { grid-column: 3; padding-inline: 14px; }
.rcx__val--ru { grid-column: 5; }
.rcx__val--world { grid-column: 6; }
.rcx__val-txt { font-size: .9375rem; line-height: 1.3; color: var(--rcx-muted); }
.rcx__val--robin .rcx__val-txt { font-weight: 500; color: var(--rcx-ink); }

.rcx-ico { flex-shrink: 0; }
.rcx-ico--yes circle { fill: var(--robin-accent); }
.rcx-ico--yes path { stroke: #fff; }
.rcx-ico--warn,
.rcx-ico--no { stroke: var(--rcx-ink); opacity: .72; }
.rcx-ico--no { opacity: .45; }

/* --- Планшет: уже поля, мельче текст значений. --- */
@media (max-width: 959px) {
	.rcx { --rcx-pad: 20px; --rcx-label: 30%; --rcx-gap-l: 2%; --rcx-card: 24%; --rcx-gap-r: 2%; --rcx-col: 21%; }
	.rcx__val { flex-direction: column; align-items: flex-start; gap: 6px; text-align: left; }
	.rcx__val-txt { font-size: .8125rem; }
}

/* --- Телефон: критерий — отдельной строкой во всю ширину, под ним три
   значения. Сплошная карточка тут перекрыла бы подписи, поэтому колонка
   ROBIN — бордовые плитки на тех же местах. --- */
@media (max-width: 639px) {
	.rcx { --rcx-pad: 12px; --rcx-head: 72px; --rcx-tail: 0px; margin-top: 40px; }
	.rcx__card { display: none; }
	.rcx__row {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: 6px;
		align-items: stretch;
		padding-bottom: 12px;
	}
	.rcx__row::after { background: var(--rcx-stroke); }
	.rcx__row--head { padding-bottom: 0; }
	.rcx__row--head::after { display: none; }
	.rcx__row--head .rcx__label { display: none; }
	.rcx__label { grid-column: 1 / -1; padding: 14px 4px 10px; font-size: .9375rem; }
	.rcx__brand,
	.rcx__val--robin,
	.rcx__val--ru,
	.rcx__val--world,
	.rcx__row--head > :nth-child(3),
	.rcx__row--head > :nth-child(4) { grid-column: auto; }
	.rcx__brand {
		align-self: end;
		border-radius: 14px 14px 0 0;
		background: var(--rcx-card-bg);
		padding: 10px 6px;
	}
	.rcx__brand-name { font-size: 1rem; }
	.rcx__brand-sub,
	.rcx__colhead-sub { font-size: .625rem; }
	.rcx__colhead { padding: 0 6px 10px; }
	.rcx__colhead-title { font-size: .75rem; }
	.rcx__val { padding: 10px 6px; border-radius: 12px; }
	.rcx__val--robin { padding-inline: 6px; background: var(--rcx-card-bg); }
	.rcx__val-txt { font-size: .75rem; }
	.rcx-ico { width: 20px; height: 20px; }
}

/* ==========================================================================
   CTA «Скачать PDF-отчёт» — акцентный блок с движущейся градиентной рамкой,
   дышащим свечением, парящей иконкой и «подпрыгивающей» стрелкой.
   ========================================================================== */
.robin-dl {
	position: relative;
	border-radius: 30px;
	padding: 1px; /* тоньше — толщина градиентной рамки */
	/* нейтральная серая рамка, плавно «перетекающая» по периметру */
	background: linear-gradient(120deg, #64748B 0%, #94A3B8 30%, rgba(100, 116, 139, .15) 55%, #64748B 85%);
	background-size: 260% 260%;
	animation: rcBorderFlow 7s ease infinite;
	transition: transform .35s cubic-bezier(.16, 1, .3, 1);
}
.robin-dl:hover { transform: translateY(-4px); }
.robin-dl__inner {
	position: relative;
	overflow: hidden;
	border-radius: 28px;
	background: #ffffff;
	padding: 56px 32px;
	text-align: center;
}

.robin-dl__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 62px;
	height: 62px;
	border-radius: 18px;
	color: #475569;
	background: linear-gradient(160deg, #F1F5F9, #E2E8F0);
	box-shadow: 0 6px 12px -6px rgba(71, 85, 105, .35), inset 0 1px 0 rgba(255, 255, 255, .8);
	animation: rcFloat 3.6s ease-in-out infinite;
}

/* кнопка — тот же приём заливки слева направо, что у .robin-btn-primary,
   но в нейтральном сером, а не в фирменном бордовом (не общий класс —
   только для этого блока, чтобы не перекрашивать остальные CTA сайта). */
.robin-dl__btn {
	background-color: #334155;
	background-image: linear-gradient(90deg, #475569 0%, #334155 50%, #334155 100%);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 0% 100%;
	box-shadow: 0 14px 30px -10px rgba(51, 65, 85, .6);
	transition: background-size .35s ease, box-shadow .25s ease, transform .2s ease;
}
.robin-dl__btn:hover,
.robin-dl__btn:focus-visible {
	background-size: 100% 100%;
	transform: translateY(-2px);
	box-shadow: 0 18px 38px -10px rgba(51, 65, 85, .7);
}
.robin-dl__arrow { animation: rcArrowBob 1.8s ease-in-out infinite; }

@keyframes rcBorderFlow {
	0%   { background-position: 0% 50%; }
	50%  { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}
@keyframes rcFloat {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-6px); }
}
@keyframes rcArrowBob {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(3px); }
}

/* Резервный статичный вид при «уменьшить движение» — блок полностью виден. */
@media (prefers-reduced-motion: reduce) {
	.robin-dl,
	.robin-dl__icon,
	.robin-dl__arrow { animation: none; }
	.robin-dl:hover { transform: none; }
}

/* ==========================================================================
   ВИДЕО О ROBIN — плеер-фасад в стилистике сайта.
   Красивый постер + кнопка play; тяжёлый iframe RuTube грузится по клику.
   ========================================================================== */
.robin-video {
	position: relative;
	border-radius: 22px;
	overflow: hidden;
	background: #0F172A; /* тёмная подложка: видео заполняет всю карточку */
}

/* Шапка-оверлей ПОВЕРХ видео: полупрозрачный градиент (тёмный сверху →
   прозрачный вниз). Скрыта по умолчанию; при наведении «вплывает» сверху
   под небольшим углом (translateY + rotateX) за 0.3s. Белые иконки/текст. */
.robin-video__bar {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 16px 18px 28px;
	color: #ffffff;
	background: linear-gradient(to bottom, rgba(6, 8, 20, .80) 0%, rgba(6, 8, 20, .40) 45%, transparent 100%);
	opacity: 0;
	transform: translateY(-20px) rotateX(-16deg);
	transform-origin: top center;
	transition: opacity .3s ease, transform .3s ease;
	pointer-events: none;
}
.robin-video__bar svg { flex-shrink: 0; }
.robin-video__title {
	font-size: .92rem;
	font-weight: 600;
	line-height: 1.3;
	color: #ffffff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, .45);
}
/* Появляется при наведении на плеер и при фокусе с клавиатуры. */
.robin-video:hover .robin-video__bar,
.robin-video:focus-within .robin-video__bar {
	opacity: 1;
	transform: translateY(0) rotateX(0);
}
@media (prefers-reduced-motion: reduce) {
	.robin-video__bar { transition: opacity .3s ease; transform: none; }
	.robin-video:hover .robin-video__bar,
	.robin-video:focus-within .robin-video__bar { transform: none; }
}

/* Сцена: соотношение 16:9, скруглённая, содержит постер, кнопку и iframe. */
.robin-video__stage {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: 0; /* заподлицо: скругление даёт родительская карточка */
	overflow: hidden;
	background: #0F172A;
	perspective: 900px; /* сцена для «вплывания под углом» шапки */
}
.robin-video__poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s cubic-bezier(.16, 1, .3, 1);
}
/* мягкое затемнение для контраста кнопки поверх любого постера */
.robin-video__stage::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(65% 65% at 50% 50%, rgba(15, 23, 42, .04), rgba(15, 23, 42, .30));
	transition: opacity .3s ease;
	pointer-events: none;
}
.robin-video__stage:hover .robin-video__poster { transform: scale(1.05); }

/* Кнопка-триггер перекрывает всю сцену (клик/фокус/клавиатура). */
.robin-video__trigger {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	padding: 0;
	margin: 0;
	background: transparent;
	cursor: pointer;
	z-index: 2;
}
.robin-video__play {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 78px;
	height: 78px;
	padding-left: 5px; /* оптическое центрирование треугольника */
	border-radius: 50%;
	color: #fff;
	background: linear-gradient(135deg, #C72329 0%, #A30C33 65%);
	box-shadow: 0 14px 34px -8px rgba(163, 12, 51, .75);
	transition: transform .25s ease, box-shadow .25s ease;
}
/* пульсирующее кольцо — привлекает внимание */
.robin-video__play::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid rgba(163, 12, 51, .55);
	animation: robinVideoPulse 2.4s ease-out infinite;
}
.robin-video__trigger:hover .robin-video__play,
.robin-video__trigger:focus-visible .robin-video__play {
	transform: scale(1.08);
	box-shadow: 0 18px 44px -8px rgba(163, 12, 51, .85);
}
@keyframes robinVideoPulse {
	0%   { transform: scale(1);   opacity: .7; }
	100% { transform: scale(1.7); opacity: 0; }
}

.robin-video__time {
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 2;
	padding: 3px 9px;
	border-radius: 999px;
	background: rgba(15, 23, 42, .72);
	color: #fff;
	font-size: .72rem;
	font-weight: 600;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

/* Состояние воспроизведения: показываем iframe, прячем оверлеи. */
.robin-video__stage iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	z-index: 3;
}
.robin-video__stage.is-playing::after,
.robin-video__stage.is-playing .robin-video__trigger,
.robin-video__stage.is-playing .robin-video__time,
.robin-video__stage.is-playing .robin-video__bar { display: none; }

@media (prefers-reduced-motion: reduce) {
	.robin-video__play::before { animation: none; }
	.robin-video__stage:hover .robin-video__poster { transform: none; }
}

/* ==========================================================================
   НОВОСТИ ROBIN — фильтр по категориям + карусель карточек.
   ========================================================================== */
/* Табы фильтра: активный — тёмный (как в макете), ховер — бордовый акцент. */
.robin-news-tab {
	padding: 9px 20px;
	border-radius: 999px;
	font-size: .95rem;
	font-weight: 500;
	white-space: nowrap;
	color: #334155;
	background: #ffffff;
	border: 1px solid #E2E8F0;
	cursor: pointer;
	transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}
.robin-news-tab:hover { color: #000; border-color: #0E1526; }
.robin-news-tab.is-active {
	color: #ffffff;
	background: #0E1526;
	border-color: #0E1526;
}

/* Дорожка карусели — скрытый скроллбар. Увеличенный нижний паддинг:
   overflow-x: auto делает и вертикальную ось auto, поэтому даём тени карточек
   и ховер-подъёму запас снизу, чтобы их не срезала отбивка контейнера. */
.robin-news-track {
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 44px;
	margin-bottom: -20px; /* компенсируем часть паддинга, чтобы отступ до след. блока не разрастался */
}
.robin-news-track::-webkit-scrollbar { display: none; }

/* Карточка материала */
.robin-news-card {
	flex: 0 0 auto;
	width: 300px;
	background: #ffffff;
	border: 1px solid #EEF1F6;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 20px 44px -30px rgba(15, 23, 42, .45);
	transition: transform .25s ease, box-shadow .25s ease;
}
.robin-news-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 30px 54px -28px rgba(15, 23, 42, .55);
}
.robin-news-card[hidden] { display: none; }

.robin-news-media {
	position: relative;
	height: 220px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.robin-news-media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* Ватермарк-плейсхолдер (виден, если нет реального изображения) */
.robin-news-wm {
	display: flex;
	align-items: center;
	gap: 8px;
	opacity: .55;
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: .02em;
	color: #334155;
}
.robin-news-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	padding: 5px 12px;
	border-radius: 8px;
	background: rgba(14, 21, 38, .72);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	color: #ffffff;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.robin-news-body { padding: 22px 20px 28px; }
.robin-news-title {
	font-size: 1.05rem;
	font-weight: 500;
	line-height: 1.35;
	color: #0E1526;
}
.robin-news-date { margin-top: 16px; font-size: .9rem; color: #6B7A96; }

/* Стрелки карусели — тёмные круги, бордовые по наведению (как логотипы). */
.robin-news-arrow {
	position: absolute;
	top: 110px; /* ≈ центр области изображения */
	transform: translateY(-50%);
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	color: #ffffff;
	background: #0E1526;
	box-shadow: 0 12px 26px -10px rgba(15, 23, 42, .55);
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease;
}
.robin-news-arrow:hover { background: #A30C33; }
.robin-news-arrow:active { transform: translateY(-50%) scale(.94); }
.robin-news-prev { left: -20px; }
.robin-news-next { right: -20px; }
@media (max-width: 640px) {
	.robin-news-prev { left: -6px; }
	.robin-news-next { right: -6px; }
}

/* ==========================================================================
   ДОСТИЖЕНИЯ — логотип/иконка награды + текст.
   ========================================================================== */
/* Логотипы наград — без карточек, прямо на белом фоне; крупные и
   соразмерные по габаритам (единый бокс + object-contain). */
.robin-award-logo {
	flex-shrink: 0;
	width: 184px;
	height: 124px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.robin-award-logo--img img { max-width: 100%; max-height: 100%; object-fit: contain; }
/* плейсхолдер-иконка (пока нет реального логотипа) — крупнее, без плитки */
.robin-award-logo--ph { color: #A30C33; }
.robin-award-logo--ph svg { width: 68px; height: 68px; }
@media (max-width: 640px) {
	.robin-award-logo { width: 128px; height: 96px; }
	.robin-award-logo--ph svg { width: 54px; height: 54px; }
}

/* ==========================================================================
   КЕЙСЫ (шорткод [robin_cases_modern]) — в стилистике блока «Объединяем
   технологии в единый процесс» (page-platform.php): секция — бежевый
   фрейм rounded-3xl #F6F3F1, карточки безрамочные (без border/bg/тени),
   сверху панель-«иллюстрация» 16:9 на #EDEBE9 с белой плашкой (как
   панели в robin_platform_tech_illustration), ниже rose-kicker,
   заголовок, список с плоскими rose-иконками и ссылка.
   ========================================================================== */
/* Карусель: 3 карточки на десктопе (как сетка lg:grid-cols-3 у tech-блока),
   2 — на планшете, 1 (+ выглядывающая) — на мобильных. */
.robin-cases-carousel { position: relative; margin-top: 48px; }
.robin-cases-track {
	/* Грид с колонками-карточками + subgrid в карточке: панели, kicker'ы,
	   заголовки и ссылки выровнены по строкам между соседними карточками,
	   даже если текст метрики/заголовка переносится по-разному. */
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 64px) / 3);
	grid-template-rows: auto auto auto 1fr auto;
	column-gap: 32px;
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 2px 0;
}
.robin-cases-track::-webkit-scrollbar { display: none; }

.rcm-card {
	min-width: 0;
	scroll-snap-align: start;
	grid-row: span 5;
	display: grid;
	grid-template-rows: subgrid;
	row-gap: 0;
}
.rcm-visual  { grid-row: 1; }
.rcm-kicker  { grid-row: 2; }
.rcm-title   { grid-row: 3; }
.rcm-list    { grid-row: 4; align-self: start; }
.rcm-cta     { grid-row: 5; }
@media (max-width: 1023px) {
	.robin-cases-track { grid-auto-columns: calc(50% - 16px); }
}
@media (max-width: 640px) {
	.robin-cases-track { grid-auto-columns: 88%; }
}

/* Стрелки листания */
.robin-cases-arrow {
	position: absolute;
	/* По центру панели 16:9: margin-top в % считается от ширины карусели,
	   высота панели = ширина карточки × 9/16, центр — половина. */
	top: 0;
	margin-top: calc((100% - 64px) / 3 * 9 / 32 - 24px);
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	color: #ffffff;
	background: #0E1526;
	box-shadow: 0 12px 26px -10px rgba(15, 23, 42, .55);
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease;
}
.robin-cases-arrow:hover { background: #A30C33; }
.robin-cases-arrow:active { transform: scale(.94); }
.robin-cases-prev { left: -24px; }
.robin-cases-next { right: -24px; }
@media (max-width: 1023px) {
	.robin-cases-arrow { margin-top: calc((100% - 32px) / 2 * 9 / 32 - 24px); }
}
@media (max-width: 640px) {
	.robin-cases-arrow { margin-top: calc(88% * 9 / 32 - 24px); }
	.robin-cases-prev { left: -10px; }
	.robin-cases-next { right: -10px; }
}

/* Панель-«иллюстрация» не ниже 16:9 — фон и плашка как у SVG tech-блока.
   Не aspect-ratio: в subgrid-строке высота растягивается по соседям, и
   aspect-ratio пересчитал бы от неё ширину. Вместо него — распорка
   ::before с padding-top 56.25% (считается от ширины) в той же ячейке. */
.rcm-visual {
	display: grid;
	align-items: center;
	min-width: 0;
	padding: 0 26px;
	border-radius: 16px;
	background: #EDEBE9;
}
.rcm-visual::before { content: ''; grid-area: 1 / 1; padding-top: 56.25%; }
.rcm-visual__panel {
	grid-area: 1 / 1;
	margin: 22px 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
	padding: 18px 20px;
	border: 1px solid #E6EBF3;
	border-radius: 12px;
	background: #ffffff;
	transition: transform .25s ease;
}
.rcm-card:hover .rcm-visual__panel { transform: translateY(-3px); }
.rcm-logo { display: flex; align-items: center; min-width: 0; height: 28px; }
.rcm-logo img { max-height: 28px; max-width: 100%; width: auto; object-fit: contain; }
.rcm-logo__text {
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.01em;
	color: #0E1526;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Hero-метрика внутри плашки */
.rcm-hero__num {
	font-size: clamp(1.8rem, 2.6vw, 2.25rem);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.02em;
	color: #A30C33;
}
.rcm-hero__num--text { font-size: clamp(1.35rem, 1.9vw, 1.6rem); line-height: 1.2; }
.rcm-hero__word { font-size: .6em; letter-spacing: -.01em; color: #0E1526; }
.rcm-hero__foot { margin-top: 6px; display: flex; flex-direction: column; gap: 1px; }
.rcm-hero__desc { font-size: .85rem; font-weight: 500; line-height: 1.4; color: #6B7A96; }
.rcm-hero__unit { font-size: .78rem; color: #94A3B8; }
.rcm-hero__foot--solo { margin-top: 0; }
.rcm-hero__foot--solo .rcm-hero__desc { font-size: 1rem; font-weight: 600; color: #0E1526; line-height: 1.35; }

/* Текстовая часть — как у карточек tech-блока */
.rcm-kicker {
	margin-top: 20px;
	font-size: .75rem;
	font-weight: 600;
	line-height: 1rem;
	letter-spacing: .025em;
	text-transform: uppercase;
	color: #A30C33;
}
.rcm-title {
	margin-top: 8px;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.375;
	color: #111827;
}
.rcm-list { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.rcm-list li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: .875rem;
	line-height: 1.625;
	color: #717171;
}
.rcm-list__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	margin-top: 2px;
	color: #A30C33;
}
.rcm-list__ico svg { width: 18px; height: 18px; }

.rcm-cta {
	padding-top: 20px;
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 8px;
	color: #0E1526;
	font-size: .9rem;
	font-weight: 600;
	text-decoration: none;
	transition: color .2s ease;
}
.rcm-cta svg { flex-shrink: 0; color: #A30C33; transition: transform .2s ease; }
.rcm-cta:hover { color: #A30C33; }
.rcm-cta:hover svg { transform: translateX(3px); }

/* ==========================================================================
   ОТЗЫВЫ — сетка карточек (логотип, компания, выжимка из цитаты, подпись)
   + модальное окно с полным текстом отзыва.
   ========================================================================== */
.robin-rev-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
}
@media (max-width: 1024px) { .robin-rev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
@media (max-width: 640px)  { .robin-rev-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; } }

.robin-rev {
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border: 1px solid #EEF1F6;
	border-radius: 24px;
	padding: 28px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 24px 44px -34px rgba(15, 23, 42, .30);
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.robin-rev:hover {
	transform: translateY(-4px);
	border-color: #CBD5E1;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 32px 56px -34px rgba(15, 23, 42, .40);
}

/* Логотип — единый бокс, чтобы карточки были соразмерны при разных пропорциях */
.robin-rev__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 74px;
	margin-bottom: 20px;
	padding: 8px 12px;
}
.robin-rev__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.robin-rev__logo-text { font-size: 1.05rem; font-weight: 600; color: #0E1526; text-align: center; }

.robin-rev__company {
	font-size: 1.1rem;
	font-weight: 600;
	letter-spacing: -.01em;
	color: #0E1526;
}
.robin-rev__desc {
	margin-top: 6px;
	font-size: .82rem;
	line-height: 1.55;
	color: #94A3B8;
}

/* Цитата: крупная серая «ёлочка» как маркер, дальше — выжимка */
.robin-rev__quote { position: relative; margin: 20px 0 24px; padding-top: 20px; border-top: 1px solid #F1F4F9; }
.robin-rev__mark { color: #CBD5E1; }
.robin-rev__excerpt {
	margin-top: 10px;
	font-size: .95rem;
	line-height: 1.7;
	color: #334155;
}

/* Футер карточки прижат к низу — ряд карточек выравнивается по кнопке */
.robin-rev__foot { margin-top: auto; }
.robin-rev__author { display: flex; flex-direction: column; gap: 2px; margin-bottom: 16px; }
.robin-rev__author-name { font-size: .92rem; font-weight: 600; color: #0E1526; }
.robin-rev__author-role { font-size: .8rem; line-height: 1.5; color: #94A3B8; }

.robin-rev__btn {
	display: flex;
	align-items: center;
	gap: 9px;
	width: 100%;
	padding-top: 18px;
	border-top: 1px solid #EEF1F6;
	color: #334155;
	font-size: .92rem;
	font-weight: 500;
	cursor: pointer;
	transition: color .2s ease;
}
.robin-rev__btn svg { flex-shrink: 0; color: #A30C33; transition: transform .2s ease; }
.robin-rev__btn:hover { color: #A30C33; }
.robin-rev__btn:hover svg { transform: translateX(3px); }

/* --- Модальное окно --------------------------------------------------- */
.robin-rev-lock { overflow: hidden; }

.robin-rev-modal {
	position: fixed;
	inset: 0;
	z-index: 120;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}
.robin-rev-modal[hidden] { display: none; }

.robin-rev-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(14, 21, 38, .55);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity .2s ease;
}
.robin-rev-modal.is-open .robin-rev-modal__backdrop { opacity: 1; }

.robin-rev-modal__dialog {
	position: relative;
	width: 100%;
	max-width: 720px;
	max-height: min(84vh, 760px);
	overflow-y: auto;
	background: #ffffff;
	border-radius: 26px;
	padding: 40px;
	box-shadow: 0 40px 90px -30px rgba(15, 23, 42, .55);
	opacity: 0;
	transform: translateY(14px) scale(.98);
	transition: opacity .22s ease, transform .22s ease;
}
.robin-rev-modal.is-open .robin-rev-modal__dialog { opacity: 1; transform: none; }

.robin-rev-modal__close {
	position: absolute;
	top: 18px;
	right: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: #64748B;
	background: #F5F7FB;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}
.robin-rev-modal__close:hover { background: #A30C33; color: #ffffff; }

.robin-rev-modal__head {
	display: flex;
	align-items: center;
	gap: 20px;
	padding-right: 48px; /* запас под крестик */
	padding-bottom: 22px;
	border-bottom: 1px solid #EEF1F6;
}
.robin-rev-modal__logo {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 132px;
	height: 68px;
	padding: 6px 10px;
	background: #FAFBFD;
	border-radius: 14px;
	font-size: .9rem;
	font-weight: 600;
	color: #0E1526;
	text-align: center;
}
.robin-rev-modal__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.robin-rev-modal__company { font-size: 1.35rem; font-weight: 600; letter-spacing: -.01em; color: #0E1526; }
.robin-rev-modal__desc { margin-top: 6px; font-size: .86rem; line-height: 1.55; color: #94A3B8; }

.robin-rev-modal__body { padding-top: 22px; }
.robin-rev-modal__body p {
	font-size: 1rem;
	line-height: 1.8;
	color: #334155;
}
.robin-rev-modal__body p + p { margin-top: 16px; }

.robin-rev-modal__sign {
	display: flex;
	flex-direction: column;
	gap: 3px;
	margin-top: 26px;
	padding-left: 18px;
	border-left: 3px solid #A30C33;
}
.robin-rev-modal__sign[hidden] { display: none; }
.robin-rev-modal__sign-name { font-size: 1rem; font-weight: 600; color: #0E1526; }
.robin-rev-modal__sign-role { font-size: .86rem; line-height: 1.5; color: #94A3B8; }

@media (max-width: 640px) {
	.robin-rev { padding: 24px; }
	.robin-rev-modal { padding: 14px; }
	.robin-rev-modal__dialog { padding: 28px 22px; max-height: 90vh; }
	.robin-rev-modal__head { flex-direction: column; align-items: flex-start; gap: 14px; }
	.robin-rev-modal__logo { width: 116px; height: 60px; }
}

/* ==========================================================================
   КАТАЛОГ КЕЙСОВ (шаблон page-cases.php): сводка, фильтр по отраслям,
   сетка карточек и модальное окно с подробностями кейса.
   Визуальный язык — как у карточек кейсов на главной (.rcm-*).
   ========================================================================== */

/* Сводка под заголовком */
.rcc-stat {
	padding: 18px 20px;
	background: #ffffff;
	border: 1px solid #EDF0F5;
	border-radius: 18px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.rcc-stat__value {
	font-size: clamp(1.6rem, 3vw, 2rem);
	font-weight: 700;
	letter-spacing: -.02em;
	color: #A30C33;
}
.rcc-stat__label { margin-top: 4px; font-size: .82rem; line-height: 1.4; color: #6B7A96; }

/* Панель фильтра — «липнет» к шапке при прокрутке */
.rcc-filter {
	position: sticky;
	top: 64px; /* высота шапки */
	z-index: 20;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 -6px 36px;
	padding: 14px 6px;
	background: #F6F3F1; /* карточки не должны просвечивать сквозь панель */
}
/* мягкая растушёвка под липкой панелью */
.rcc-filter::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: 20px;
	background: linear-gradient(180deg, #F6F3F1, rgba(246, 243, 241, 0));
	pointer-events: none;
}
.rcc-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	font-size: .9rem;
	font-weight: 500;
	color: #475569;
	background: #ffffff;
	border: 1px solid #E6EBF3;
	border-radius: 999px;
	cursor: pointer;
	transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.rcc-chip:hover { color: #000; border-color: #0E1526; }
.rcc-chip.is-active {
	color: #ffffff;
	background: #0E1526;
	border-color: #0E1526;
}
.rcc-chip__num {
	font-size: .75rem;
	font-weight: 600;
	color: #94A3B8;
	background: #F1F4FA;
	border-radius: 999px;
	padding: 1px 7px;
}
.rcc-chip.is-active .rcc-chip__num { color: #ffffff; background: rgba(255, 255, 255, .16); }

/* Сетка карточек */
.rcc-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
@media (max-width: 1024px) { .rcc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px)  { .rcc-grid { grid-template-columns: minmax(0, 1fr); } }

.rcc-card {
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border: 1px solid #EEF1F6;
	border-radius: 24px;
	padding: 24px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 24px 44px -34px rgba(15, 23, 42, .28);
	transition: transform .3s ease, box-shadow .3s ease;
}
.rcc-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 34px 60px -36px rgba(15, 23, 42, .38);
}
.rcc-card.is-hidden, .rcc-card[hidden] { display: none; }

/* Плашка логотипа — та же «поверхность», что у карточек на главной */
.rcc-logo {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 92px;
	margin-bottom: 18px;
	border: 1px solid #EDF0F5;
	border-radius: 16px;
	overflow: hidden;
	background: linear-gradient(180deg, #FFFFFF 0%, #F1F4FA 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), inset 0 -12px 22px -18px rgba(15, 23, 42, .16);
}
.rcc-logo img {
	max-height: 52px;
	max-width: 72%;
	width: auto;
	object-fit: contain;
	filter: drop-shadow(0 8px 7px rgba(15, 23, 42, .14));
	transition: transform .35s cubic-bezier(.2, .7, .2, 1);
}
.rcc-card:hover .rcc-logo img { transform: translateY(-2px) scale(1.03); }
@media (prefers-reduced-motion: reduce) { .rcc-logo img { transition: none; } }

/* Плашка для кейсов без логотипа (NDA): название компании текстом */
.rcc-logo--text { flex-direction: column; gap: 8px; padding: 14px 18px; }
.rcc-logo__text {
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
	color: #64748B;
}
.rcc-nda {
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #94A3B8;
	background: #EEF1F7;
	border-radius: 999px;
	padding: 3px 9px;
}

/* Отрасли */
.rcc-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rcc-tag {
	font-size: .72rem;
	font-weight: 500;
	color: #A30C33;
	background: #FAEAEF;
	border-radius: 999px;
	padding: 3px 10px;
}

.rcc-title {
	margin: 12px 0 0;
	font-size: 1.02rem;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: -.01em;
	color: #0E1526;
}
.rcc-company { margin-top: 6px; font-size: .82rem; font-weight: 500; color: #94A3B8; }
.rcc-task {
	margin: 10px 0 0;
	font-size: .88rem;
	line-height: 1.6;
	color: #64748B;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Компактная метрика внутри карточки */
.rcc-metric {
	margin-top: 16px;
	padding: 14px 16px;
	background: #F7F8FB;
	border-radius: 12px;
}
.rcc-metric__top { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
.rcc-metric__value {
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -.02em;
	color: #A30C33;
}
.rcc-metric__unit { font-size: .82rem; font-weight: 500; color: #6B7A96; }
.rcc-metric__desc { margin-top: 6px; font-size: .8rem; line-height: 1.45; color: #6B7A96; }

/* Кнопка «Что сделал робот» — прижата к низу карточки */
.rcc-more {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: auto;
	padding-top: 18px;
	font-size: .88rem;
	font-weight: 600;
	color: #0E1526;
	background: none;
	border: 0;
	cursor: pointer;
	transition: color .2s ease;
}
.rcc-more svg { color: #A30C33; transition: transform .2s ease; }
.rcc-more:hover { color: #A30C33; }
.rcc-more:hover svg { transform: translateX(3px); }

.rcc-empty {
	margin: 40px 0 0;
	text-align: center;
	font-size: .95rem;
	color: #94A3B8;
}
.rcc-empty[hidden] { display: none; }

/* «Показать ещё» */
.rcc-showmore {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 13px 28px;
	font-size: .92rem;
	font-weight: 600;
	color: #ffffff;
	background: #0E1526;
	border: 0;
	border-radius: 999px;
	cursor: pointer;
	box-shadow: 0 16px 30px -18px rgba(15, 23, 42, .6);
	transition: background-color .2s ease, transform .2s ease;
}
.rcc-showmore:hover { background: #A30C33; }
.rcc-showmore:active { transform: scale(.97); }
.rcc-showmore[hidden] { display: none; }
.rcc-showmore__num {
	font-size: .78rem;
	font-weight: 600;
	background: rgba(255, 255, 255, .16);
	border-radius: 999px;
	padding: 2px 9px;
}

/* Модальное окно кейса */
.rcc-modal {
	position: fixed;
	inset: 0;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.rcc-modal[hidden] { display: none; }
.rcc-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(14, 21, 38, .55);
	backdrop-filter: blur(3px);
}
.rcc-modal__dialog {
	position: relative;
	width: min(720px, 100%);
	max-height: 86vh;
	overflow-y: auto;
	padding: 36px;
	background: #ffffff;
	border-radius: 26px;
	box-shadow: 0 40px 90px -40px rgba(15, 23, 42, .6);
}
.rcc-modal__close {
	position: absolute;
	top: 18px;
	right: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: #64748B;
	background: #F1F4FA;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: color .2s ease, background-color .2s ease;
}
.rcc-modal__close:hover { color: #ffffff; background: #A30C33; }

.rcc-modal__head { display: flex; align-items: center; gap: 18px; padding-right: 44px; }
.rcc-modal__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 132px;
	height: 68px;
	border: 1px solid #EDF0F5;
	border-radius: 14px;
	background: linear-gradient(180deg, #FFFFFF 0%, #F1F4FA 100%);
}
.rcc-modal__logo:empty { display: none; }
.rcc-modal__logo img { max-width: 78%; max-height: 44px; object-fit: contain; }
.rcc-modal__company { font-size: 1.05rem; font-weight: 600; color: #0E1526; }
.rcc-modal__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

.rcc-modal__title {
	margin: 22px 0 0;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -.02em;
	color: #0E1526;
}
.rcc-modal__section { margin-top: 24px; }
.rcc-modal__label {
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #A30C33;
}
.rcc-modal__text { margin: 10px 0 0; font-size: .95rem; line-height: 1.65; color: #475569; }
.rcc-modal__bullets { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.rcc-modal__bullets li { display: flex; gap: 12px; font-size: .95rem; line-height: 1.6; color: #475569; }
.rcc-modal__bullets li::before {
	content: "";
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	margin-top: 9px;
	border-radius: 50%;
	background: #A30C33;
}
.rcc-modal__metric {
	margin-top: 22px;
	padding: 18px 20px;
	background: #F7F8FB;
	border-radius: 14px;
}
.rcc-modal__metric[hidden] { display: none; }
.rcc-modal__link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin-top: 28px;
	padding: 12px 22px;
	font-size: .9rem;
	font-weight: 600;
	color: #ffffff;
	background: #0E1526;
	border-radius: 999px;
	transition: background-color .2s ease;
}
.rcc-modal__link:hover { background: #A30C33; }

/* CTA внизу страницы */
.rcc-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding: 44px;
	background: #0E1526;
	border-radius: 28px;
}
.rcc-cta__btn {
	display: inline-flex;
	align-items: center;
	padding: 14px 30px;
	font-size: .95rem;
	font-weight: 600;
	color: #0E1526;
	background: #ffffff;
	border-radius: 999px;
	transition: color .2s ease, background-color .2s ease;
}
.rcc-cta__btn:hover { color: #ffffff; background: #A30C33; }

@media (max-width: 640px) {
	.rcc-card { padding: 20px; }
	.rcc-modal__dialog { padding: 26px 20px; max-height: 90vh; }
	.rcc-modal__head { flex-direction: column; align-items: flex-start; gap: 14px; }
	.rcc-cta { padding: 30px; }
	.rcc-filter { top: 56px; }
}

/* --------------------------------------------------------------------------
   Top Metrics Bar, Hero Metric в карточке, чипы стека и GEO-FAQ.
   Дополняют блок «Каталог кейсов» выше.
   -------------------------------------------------------------------------- */

/* Плашка из 4 главных метрик под заголовком страницы */
.rcc-metrics-bar {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin-top: 40px;
}
@media (max-width: 900px) { .rcc-metrics-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .rcc-metrics-bar { grid-template-columns: minmax(0, 1fr); } }

/* Модификатор для страниц с 3 метриками вместо обычных 4 (когда у источника
   контента реально только 3 цифры — см. page-ai-accounting.php). */
.rcc-metrics-bar--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .rcc-metrics-bar--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .rcc-metrics-bar--3 { grid-template-columns: minmax(0, 1fr); } }

.rcc-mbar {
	display: flex;
	flex-direction: column;
	padding: 22px;
	background: #ffffff;
	border: 1px solid #EDF0F5;
	border-radius: 20px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 22px 40px -34px rgba(15, 23, 42, .28);
}
.rcc-mbar__value {
	font-size: clamp(1.5rem, 2.6vw, 1.9rem);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.02em;
	color: #A30C33;
	overflow-wrap: anywhere; /* длинные слова-метрики не должны рвать карточку */
}
.rcc-mbar__label {
	margin-top: 6px;
	font-size: .86rem;
	font-weight: 600;
	line-height: 1.35;
	color: #0E1526;
}
.rcc-mbar__note {
	margin: 10px 0 0;
	font-size: .78rem;
	line-height: 1.5;
	color: #6B7A96;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Hero Metric внутри карточки кейса */
.rcc-hero {
	margin-top: 14px;
	padding: 12px 16px;
	background: #F7F8FB;
	border-radius: 12px;
	font-size: 1.12rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.01em;
	color: #A30C33;
}

/* GEO Summary в карточке: полный текст в DOM, визуально ограничен по высоте */
.rcc-geo {
	margin: 12px 0 0;
	font-size: .86rem;
	line-height: 1.6;
	color: #64748B;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Чипы стека технологий */
.rcc-stack { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.rcc-tech {
	font-size: .72rem;
	font-weight: 500;
	color: #475569;
	background: #F1F4FA;
	border: 1px solid #E6EBF3;
	border-radius: 8px;
	padding: 3px 9px;
}
.rcc-tech--more { color: #94A3B8; }
.rcc-stack--modal { margin-top: 12px; }

/* Hero Metric в модальном окне */
.rcc-modal__hero {
	font-size: clamp(1.6rem, 3vw, 2.1rem);
	font-weight: 700;
	letter-spacing: -.02em;
	color: #A30C33;
}

/* GEO-FAQ: аккордеон на <details> */
.rcc-faq {
	background: #ffffff;
	border: 1px solid #EDF0F5;
	border-radius: 18px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
	transition: border-color .2s ease, box-shadow .2s ease;
}
.rcc-faq[open] {
	border-color: #E6EBF3;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 22px 40px -34px rgba(15, 23, 42, .30);
}
.rcc-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 20px 24px;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.45;
	color: #0E1526;
	cursor: pointer;
	list-style: none;
}
.rcc-faq__q::-webkit-details-marker { display: none; }
.rcc-faq__q:hover { color: #A30C33; }
.rcc-faq__ico {
	flex: 0 0 auto;
	color: #A30C33;
	transition: transform .2s ease;
}
.rcc-faq[open] .rcc-faq__ico { transform: rotate(180deg); }
.rcc-faq__a {
	padding: 0 24px 22px;
	font-size: .94rem;
	line-height: 1.7;
	color: #475569;
}

@media (max-width: 640px) {
	.rcc-faq__q { padding: 16px 18px; font-size: .95rem; }
	.rcc-faq__a { padding: 0 18px 18px; }
	.rcc-mbar { padding: 18px; }
}

/* --------------------------------------------------------------------------
   ВИДЕО-КЕЙСЫ (шаблон page-videos.php). Сетка и чипы переиспользуются
   из каталога кейсов (.rcc-grid, .rcc-chip, .rcc-tag, .rcc-modal).
   -------------------------------------------------------------------------- */

.rcv-card {
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border: 1px solid #EEF1F6;
	border-radius: 24px;
	padding: 20px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 24px 44px -34px rgba(15, 23, 42, .28);
	transition: transform .3s ease, box-shadow .3s ease;
}
.rcv-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 34px 60px -36px rgba(15, 23, 42, .38);
}
.rcv-card.is-hidden, .rcv-card[hidden] { display: none; }

/* Постер: собственная «обложка» — внешние превью не грузим (CSP сайта) */
.rcv-poster {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 16 / 9;
	margin-bottom: 16px;
	border: 0;
	border-radius: 16px;
	cursor: pointer;
	overflow: hidden;
	background:
		radial-gradient(120% 120% at 15% 0%, rgba(163, 12, 51, .55), transparent 55%),
		linear-gradient(140deg, #131C2F 0%, #0E1526 60%, #1B2438 100%);
}
.rcv-poster--empty { cursor: default; }
.rcv-poster__play {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	padding-left: 4px;
	color: #ffffff;
	background: rgba(163, 12, 51, .92);
	border-radius: 50%;
	box-shadow: 0 18px 34px -14px rgba(0, 0, 0, .7);
	transition: transform .25s ease, background-color .25s ease;
}
.rcv-poster:hover .rcv-poster__play { transform: scale(1.08); background: #A30C33; }
.rcv-poster__type {
	position: absolute;
	left: 12px;
	bottom: 12px;
	z-index: 1;
	font-size: .7rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .85);
	background: rgba(255, 255, 255, .14);
	backdrop-filter: blur(4px);
	border-radius: 999px;
	padding: 4px 10px;
}
@media (prefers-reduced-motion: reduce) {
	.rcv-poster__play { transition: none; }
}

.rcv-date {
	font-size: .72rem;
	font-weight: 500;
	color: #94A3B8;
	background: #F1F4FA;
	border-radius: 999px;
	padding: 3px 10px;
}

/* Выжимка сути ролика — акцентная цитата с бордовой линией */
.rcv-quote {
	margin: 14px 0 0;
	padding: 2px 0 2px 14px;
	border-left: 3px solid #A30C33;
	font-size: .92rem;
	font-style: normal;
	line-height: 1.5;
	color: #0E1526;
}

/* Ключевой вывод */
.rcv-take {
	display: flex;
	gap: 9px;
	margin-top: 14px;
	padding: 12px 14px;
	background: #F7F8FB;
	border-radius: 12px;
	font-size: .84rem;
	line-height: 1.5;
	color: #475569;
}
.rcv-take svg { flex: 0 0 auto; margin-top: 3px; color: #A30C33; }

.rcv-soon {
	margin-top: auto;
	padding-top: 18px;
	font-size: .84rem;
	color: #94A3B8;
}

/* Модальный плеер */
.rcv-modal__dialog { width: min(920px, 100%); padding: 28px; }
.rcv-modal__title {
	margin: 0 44px 18px 0;
	font-size: 1.15rem;
	font-weight: 600;
	line-height: 1.4;
	color: #0E1526;
}
.rcv-modal__frame {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #0E1526;
	border-radius: 16px;
	overflow: hidden;
}
.rcv-modal__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.rcv-modal__link {
	display: inline-block;
	margin-top: 16px;
	font-size: .86rem;
	font-weight: 500;
	color: #6B7A96;
	text-decoration: underline;
	text-underline-offset: 4px;
}
.rcv-modal__link:hover { color: #A30C33; }

@media (max-width: 640px) {
	.rcv-card { padding: 16px; }
	.rcv-modal__dialog { padding: 20px; }
}

/* ==========================================================================
   НАВИГАЦИЯ: мега-меню «Ресурсы и База знаний» + мобильный drawer.
   Десктоп — раскрытие на hover/focus (CSS), тач — класс .is-open (robin-nav.js).
   ========================================================================== */

/* Панель мега-меню: две зоны — сетка категорий и Spotlight (glean.com-стиль:
   компактный радиус 12px вместо «таблеточного», тонкая рамка, мягкая тень) */
/* ==========================================================================
   Мега-меню «Решения»/«Ресурсы» (общий шаблон robin_render_mega_menu()) —
   референс: glean.com, раздел Solutions (2 колонки-списка + карточка-промо
   с картинкой сверху). Токены (радиус 10px, обводка #E7E3E1) — как у
   «Продукты», для единого визуального языка по всем мега-меню.
   ========================================================================== */
.robin-mega__panel {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1.1fr);
	background: #F7F3EF;
	border: 1px solid #E7E3E1;
	border-radius: 10px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 40px 80px -40px rgba(15, 23, 42, .45);
	overflow: hidden; /* нижний баннер и промо-колонка бесшовно повторяют радиус панели */
}
@media (max-width: 1100px) {
	.robin-mega__panel { grid-template-columns: minmax(0, 1fr); }
}

.robin-mega__grid { padding: 8px; }
/* Подпись колонки + разделитель на всю её ширину (референс: DEPARTMENTS/
   INDUSTRIES у Glean). */
.robin-mega__eyebrow {
	padding: 0 0 8px 8px;
	margin-bottom: 8px;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #999999;
	border-bottom: 1px solid #EDF0F5;
}

/* Смысловые колонки ссылок: число колонок задаёт --cols (см. robin_render_mega_menu()).
   Разделители между колонками — тонкая граница #eaeaea вместо гориз. gap. */
.robin-mega__cols {
	display: grid;
	grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr));
	padding-top: 8px;
	padding-left: 8px;
	padding-bottom: 12px;
	background: #ffffff;
	border-radius: 10px;
}
.robin-mega__col {
	display: flex;
	flex-direction: column;
	gap: 1px;
	padding: 0 20px;
}
.robin-mega__col:last-child { padding-right: 0; }
.robin-mega__col:not(:first-child) { border-left: 1px solid #EAEAEA; }
@media (max-width: 1100px) {
	.robin-mega__cols { grid-template-columns: minmax(0, 1fr); gap: 4px; }
	.robin-mega__col { padding: 0; border-left: 0 !important; }
	.robin-mega__col + .robin-mega__col { margin-top: 10px; padding-top: 10px; border-top: 1px solid #EAEAEA; }
}

/* Пункт меню: компактная строка иконка+заголовок (референс: плоский список
   Glean, без описания на виду) — подпись раскрывается по ховеру (max-height
   0→auto + opacity), чтобы не терять контент. */
/* color задан один раз на .robin-mega__card — иконка и стрелка «внешняя
   ссылка» ничего своего не красят, наследуют currentColor, поэтому всегда
   совпадают с цветом заголовка (и в покое, и по ховеру). */
.robin-mega__card {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 7px 8px;
	border-radius: 8px;
	color: #0E1526;
	transition: background-color .15s ease, color .18s ease;
}
.robin-mega__card:hover { color: #A30C33; }
.robin-mega__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
}
.robin-mega__body { display: flex; flex-direction: column; min-width: 0; }
.robin-mega__title {
	font-size: .86rem;
	font-weight: 500;
	line-height: 1.3;
}
.robin-mega__desc {
	display: block;
	max-height: 0;
	margin-top: 0;
	overflow: hidden;
	font-size: .74rem;
	line-height: 1.4;
	color: #999999;
	opacity: 0;
	transition: max-height .2s ease, opacity .15s ease, margin-top .2s ease;
}
.robin-mega__card:hover .robin-mega__desc { max-height: 20px; margin-top: 2px; opacity: 1; }
/* Стрелка у пунктов, ведущих на внешний домен */
.robin-mega__ext {
	display: inline-block;
	margin-left: 3px;
	vertical-align: -1px;
}

/* Нижний баннер во всю ширину панели */
.robin-mega__banner {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 20px;
	background: #F7F3EF;
	border-top: 1px solid #EDF0F5;
}
.robin-mega__banner-text {
	font-size: .86rem;
	color: #475569;
}
.robin-mega__banner-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	padding: 8px 16px;
	font-size: .86rem;
	font-weight: 600;
	color: #A30C33;
	background: #ffffff;
	border: 1px solid #F6F3F1;
	border-radius: 10px;
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.robin-mega__banner-cta:hover {
	border-color: #A30C33;
	box-shadow: 0 1px 2px rgba(163, 12, 51, .15);
	transform: translateY(-1px);
}

/* Spotlight-карточка: картинка сверху + текст снизу (референс: правая
   карточка «AI for Engineering» у Glean, раздел Solutions). */
/* .robin-spot — только позиционирующая обёртка (отступ от панели); собственно
   карточка со скруглением и обводкой — вложенный .robin-spot__card
   (референс: .robin-pm__banner). */
.robin-spot {
	display: flex;
	padding: 8px 8px 8px 0;
}
.robin-spot__card {
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	border-radius: 10px;
	border-bottom-left-radius: 10px;
	background: #F7F3EF;
	transition: background-color .2s ease;
}
.robin-spot:hover .robin-spot__card,
.robin-spot:hover .robin-spot__body { background: #F3EFEA; }
.robin-spot__media {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 120px;
	border-radius: 10px;
	background-image: url('assets/img/nav-solutions-spot.jpg');
	background-size: cover;
	background-position: 50% 50%;
}
.robin-spot__media-label {
	font-size: 1.1rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: #16916C;
}
.robin-spot__body {
	display: flex;
	flex-direction: column;
	padding: 16px 18px 18px;
	border-radius: 0 0 10px 10px;
	background: #F7F3EF;
	transition: background-color .2s ease;
}
.robin-spot__badge {
	font-size: .65rem;
	font-weight: 600;
	letter-spacing: .06em;
	color: #817B7A;
}
.robin-spot__title {
	margin-top: 6px;
	font-size: .92rem;
	font-weight: 600;
	line-height: 1.35;
	color: #0E1526;
}
.robin-spot__desc {
	margin-top: 6px;
	font-size: .8rem;
	line-height: 1.5;
	color: #76767C;
}
.robin-spot__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 14px;
	font-size: .84rem;
	font-weight: 600;
	color: #A30C33;
}
.robin-spot__cta svg { transition: transform .2s ease; }
.robin-spot:hover .robin-spot__cta svg { transform: translateX(4px); }
@media (max-width: 1100px) {
	.robin-spot { padding-left: 8px; }
}

/* ==========================================================================
   Мега-меню «Продукты» — референс glean.com/platform: три равные белые
   карточки продуктов в ряд (включая «Платформа ROBIN») + баннер снизу на
   всю ширину. Верстается отдельно от .robin-mega* — структура заметно
   отличается от «Решения»/«Ресурсы» (колонки + spotlight).
   ========================================================================== */
.robin-pm {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 8px;
	background: #F7F3EF;
	border: 1px solid #E7E3E1;
	border-radius: 10px;
	overflow: hidden; /* баннер бесшовно повторяет скругление панели */
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 40px 80px -40px rgba(15, 23, 42, .45);
}

.robin-pm__cols {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	padding: 20px;
	background: #ffffff;
	border: 1px solid #E7E3E1;
	border-radius: 10px;
}
.robin-pm__col { display: flex; flex-direction: column; padding: 0 20px; }
.robin-pm__col:first-child { padding-left: 0; }
.robin-pm__col:last-child { padding-right: 0; }
.robin-pm__col:not(:first-child) { border-left: 1px solid #EAEAEA; }
@media (max-width: 1100px) {
	.robin-pm__cols { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	.robin-pm__col { padding: 0; border-left: 0 !important; }
}

.robin-pm__col-head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding-bottom: 14px;
	margin-bottom: 8px;
	border-bottom: 1px solid #EDF0F5;
	transition: opacity .15s ease;
}
.robin-pm__col-head:hover { opacity: .82; }
.robin-pm__col-ico {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: #0E1526;
	color: #ffffff;
}
.robin-pm__col-title { display: block; font-size: .95rem; font-weight: 600; color: #0E1526; }
.robin-pm__col-desc { display: block; margin-top: 2px; font-size: .78rem; color: #999999; }

.robin-pm__item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 4px;
	border-radius: 8px;
	font-size: .88rem;
	color: #334155;
	transition: background-color .15s ease, color .15s ease;
}
.robin-pm__item:hover { color: #A30C33; }
.robin-pm__item-ico { display: flex; flex: 0 0 auto; width: 17px; height: 17px; }

/* Баннер: тот же .robin-mega__banner-text/-cta, что у «Решения»/«Ресурсы» —
   но без grid-column-трюка: .robin-pm это flex-column, баннер просто
   последний элемент внизу. Фон — сплошной цвет, без картинки. */
.robin-pm__banner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 8px 14px 8px;
	background: #F7F3EF;
	border: 1px solid #E7E3E1;
	border-radius: 10px;
}

/* Тач-устройства: раскрытие по классу (см. robin-nav.js) */
.robin-header nav .group.is-open > div:last-child {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}
.robin-header nav .group.is-open > div.robin-mega {
	transform: translate(-50%, 0);
}

/* Компактное меню («Партнёрам», «О ROBIN»): паддинг задан обычным CSS,
   а не Tailwind-классом pt-[12px] — рядом в className несколько
   arbitrary-value утилит ([...]) с запятыми внутри (border-color, shadow),
   и JIT-парсер Tailwind Play CDN, похоже, путался в границах соседних
   [...] и терял pt-[12px] при разборе строки классов. */
.robin-compact-panel {
	padding: 12px 8px 8px;
}
/* Отступ от шапки до самой панели (было — Tailwind pt-3, тоже переведено
   на обычный CSS для надёжности). */
.robin-compact-reveal {
	padding-top: 24px;
}

/* Затемнение страницы под открытым мега-меню (референс: glean.com).
   Триггер полностью на :has() — тот же элемент реагирует на hover/focus
   и .group, на тач-класс .is-open, и на React-меню «Ресурсы» через
   aria-expanded его кнопки. top: 64px = высота шапки (h-16) — оверлей
   геометрически не заходит под шапку, поэтому она остаётся не затемнена
   по всей ширине и высоте даже когда прозрачна (до .is-scrolled). */
.robin-nav-overlay {
	position: fixed;
	top: 64px;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 49;
	background: rgba(15, 23, 42, .45);
	backdrop-filter: blur(1px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .25s ease, visibility .25s ease;
}
.robin-header:has(nav .group:hover) ~ .robin-nav-overlay,
.robin-header:has(nav .group:focus-within) ~ .robin-nav-overlay,
.robin-header:has(nav .group.is-open) ~ .robin-nav-overlay,
.robin-header:has(#robin-resources-menu-root button[aria-expanded="true"]) ~ .robin-nav-overlay {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* --------------------------------------------------------------------------
   Бургер и мобильный drawer
   -------------------------------------------------------------------------- */
.robin-burger {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	padding: 0 9px;
	background: transparent;
	border: 0;
	border-radius: 12px;
	cursor: pointer;
}
.robin-burger__bar {
	display: block;
	height: 2px;
	width: 100%;
	background: #0E1526;
	border-radius: 2px;
	transition: transform .25s ease, opacity .2s ease;
}
.robin-burger.is-open .robin-burger__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.robin-burger.is-open .robin-burger__bar:nth-child(2) { opacity: 0; }
.robin-burger.is-open .robin-burger__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.robin-drawer {
	position: fixed;
	inset: 64px 0 0;
	z-index: 40;
	overflow-y: auto;
	background: #F6F3F1;
	border-top: 1px solid #E6EBF3;
}
.robin-drawer[hidden] { display: none; }
.robin-drawer__inner { padding: 14px 20px 40px; }

.robin-acc { border-bottom: 1px solid #E6EBF3; }
.robin-acc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 16px 2px;
	font-size: 1rem;
	font-weight: 600;
	color: #0E1526;
	background: none;
	border: 0;
	cursor: pointer;
}
.robin-acc__ico { color: #94A3B8; transition: transform .2s ease; }
.robin-acc__head.is-open .robin-acc__ico { transform: rotate(180deg); color: #A30C33; }
.robin-acc__body { padding: 0 0 14px; }
.robin-acc__body[hidden] { display: none; }

.robin-acc__link {
	display: block;
	padding: 11px 2px;
	font-size: .95rem;
	color: #475569;
}
.robin-acc__link:hover { color: #A30C33; }

/* Заголовок группы ресурсов в мобильном drawer */
.robin-acc__group {
	padding: 12px 12px 4px;
	font-size: .7rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #94A3B8;
}
.robin-acc__card {
	display: flex;
	gap: 12px;
	padding: 12px;
	margin-bottom: 8px;
	background: #ffffff;
	border: 1px solid #EDF0F5;
	border-radius: 14px;
}
.robin-acc__title { display: block; font-size: .92rem; font-weight: 600; color: #0E1526; }
.robin-acc__desc { display: block; margin-top: 3px; font-size: .8rem; line-height: 1.5; color: #6B7A96; }

.robin-acc__spot {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 16px;
	margin-top: 10px;
	border-radius: 14px;
	background: #F8F9FA;
	border: 1px solid #EDF0F5;
}

.robin-drawer__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 26px; }
.robin-drawer__ghost {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 13px 20px;
	font-size: .95rem;
	font-weight: 600;
	border-radius: 999px;
	color: #A30C33;
	border: 1px solid #A30C33;
}

@media (prefers-reduced-motion: reduce) {
	.robin-spot, .robin-spot__cta svg, .robin-acc__ico, .robin-burger__bar { transition: none; }
}
/* ==========================================================================
   БАЗА ЗНАНИЙ /docs/ — трёхколоночный портал документации.
   2026-10-02: стилистика /platform/, /ai-communications/, /corporate-assistants/:
   белые секции, фрейм-карточки пергамент #F6F3F1 (rounded 24–28px, рамка Ash),
   нейтральная палитра Ink/Graphite/Smoke, моно для служебных подписей,
   бордовый #A30C33 — единственный акцент. Шапка и подвал — сквозные.
   ========================================================================== */

.robin-docs-wrap,
.robin-docs-hero,
.robin-search {
	--rdx-parchment: #f6f3f1;
	--rdx-line: #efeeed;
	--rdx-ash: #cecac8;
	--rdx-ink: #242424;
	--rdx-graphite: #4e4d4d;
	--rdx-muted: #717171;
	--rdx-smoke: #797776;
	--rdx-accent: #a30c33;
	--rdx-accent-soft: #eab0b2;
	--rdx-accent-tint: #faeaef;
	--rdx-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* --- Hero ----------------------------------------------------------------- */
.robin-docs-hero__search {
	display: flex;
	align-items: center;
	gap: 12px;
	width: min(560px, 100%);
	margin: 32px auto 0;
	padding: 14px 16px 14px 20px;
	font-size: 15px;
	color: var(--rdx-muted);
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 999px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .05), 0 1px 2px -1px rgba(0, 0, 0, .05);
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease;
}
.robin-docs-hero__search:hover { border-color: var(--rdx-accent-soft); color: var(--rdx-ink); }
.robin-docs-hero__search span { flex: 1 1 auto; text-align: left; }

.robin-docs-hero__sections {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 12px;
	max-width: 1080px;
	margin: 44px auto 0;
	padding: 0;
	list-style: none;
}
.robin-docs-hero__card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	height: 100%;
	padding: 20px;
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 20px;
	transition: border-color .2s ease, transform .2s ease;
}
.robin-docs-hero__card:hover { border-color: var(--rdx-accent-soft); transform: translateY(-2px); }
.robin-docs-hero__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: #000000;
	background: var(--rdx-parchment);
	border: 1px solid var(--rdx-line);
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .05), 0 1px 2px -1px rgba(0, 0, 0, .05);
}
.robin-docs-hero__ico svg { width: 20px; height: 20px; }
.robin-docs-hero__meta {
	display: flex;
	gap: 10px;
	font-family: var(--rdx-mono);
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}
.robin-docs-hero__num { color: var(--rdx-accent); }
.robin-docs-hero__title { font-size: 17px; line-height: 1.3; letter-spacing: -.02em; color: var(--rdx-ink); }

/* --- Сетка ---------------------------------------------------------------- */
.robin-docs-wrap { background: #ffffff; }
.robin-docs {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr) 240px;
	gap: 48px;
	max-width: 80rem; /* = max-w-7xl, как фреймы на соседних страницах */
	margin: 0 auto;
	padding: 40px 24px 96px;
}
@media (max-width: 1200px) {
	.robin-docs { grid-template-columns: 264px minmax(0, 1fr); gap: 40px; }
	.robin-docs__toc { display: none; }
}
@media (max-width: 900px) {
	.robin-docs { grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 24px 16px 64px; }
	.robin-docs__side { position: static; }
}

/* --- Левый сайдбар: фрейм-карточка пергамент ----------------------------- */
.robin-docs__side-inner {
	position: sticky;
	top: 88px;
	max-height: calc(100vh - 112px);
	overflow-y: auto;
	padding: 16px;
	background: var(--rdx-parchment);
	border-radius: 24px;
	scrollbar-width: thin;
}
@media (max-width: 900px) {
	.robin-docs__side-inner { position: static; max-height: none; overflow: visible; }
}

.robin-docs__side-label {
	margin: 20px 4px 8px;
	font-family: var(--rdx-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}

.robin-docs__search {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px 12px;
	font-size: 14px;
	color: var(--rdx-muted);
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 12px;
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease;
}
.robin-docs__search:hover { border-color: var(--rdx-accent-soft); color: var(--rdx-ink); }
.robin-docs__search span { flex: 1 1 auto; min-width: 0; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.robin-docs__search svg, .robin-docs-hero__search svg, .robin-search__field svg { width: 18px; height: 18px; flex: none; }

.robin-kbd {
	font-family: var(--rdx-mono, ui-monospace, monospace);
	font-size: 11px;
	font-weight: 500;
	color: var(--rdx-smoke, #797776);
	background: var(--rdx-parchment, #f6f3f1);
	border: 1px solid var(--rdx-ash, #cecac8);
	border-radius: 6px;
	padding: 2px 6px;
	white-space: nowrap;
}

.robin-docs__versions {
	display: flex;
	gap: 4px;
	padding: 4px;
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 14px;
}
.robin-docs__version {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	padding: 7px 10px;
	font-size: 13px;
	font-weight: 500;
	color: var(--rdx-graphite);
	background: transparent;
	border: 0;
	border-radius: 10px;
	cursor: pointer;
	transition: color .2s ease, background-color .2s ease;
}
.robin-docs__version:hover { color: var(--rdx-accent); }
.robin-docs__version.is-active { color: #ffffff; background: var(--rdx-accent); }
.robin-docs__version-note {
	font-family: var(--rdx-mono);
	font-size: 10px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: -.02em;
	opacity: .75;
}

.robin-docs__tree { margin-top: 0; }
.robin-docs__group + .robin-docs__group { margin-top: 2px; }
.robin-docs__group-head {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 8px;
	font-size: 14px;
	font-weight: 500;
	color: var(--rdx-ink);
	background: none;
	border: 0;
	border-radius: 12px;
	cursor: pointer;
	text-align: left;
	transition: background-color .2s ease;
}
.robin-docs__group-head:hover { background: rgba(255, 255, 255, .7); }
.robin-docs__group-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex: none;
	color: #000000;
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 7px;
}
.robin-docs__group-ico svg { width: 15px; height: 15px; }
.robin-docs__group-title { flex: 1 1 auto; }
.robin-docs__group-chevron { color: var(--rdx-smoke); transition: transform .2s ease; }
.robin-docs__group-head.is-open .robin-docs__group-chevron { transform: rotate(180deg); }

.robin-docs__links { list-style: none; margin: 2px 0 8px 22px; padding: 0 0 0 12px; border-left: 1px solid var(--rdx-ash); }
.robin-docs__links[hidden] { display: none; }
.robin-docs__link {
	display: block;
	padding: 6px 10px;
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--rdx-muted);
	border-radius: 10px;
	transition: color .2s ease, background-color .2s ease;
}
.robin-docs__link:hover { color: var(--rdx-ink); background: rgba(255, 255, 255, .7); }
.robin-docs__link.is-current {
	position: relative;
	color: var(--rdx-accent);
	background: #ffffff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
}
.robin-docs__link.is-current::before {
	content: "";
	position: absolute;
	left: -13px;
	top: 8px;
	bottom: 8px;
	width: 1px;
	background: var(--rdx-accent);
}

/* --- Центр: статья ------------------------------------------------------- */
.robin-docs__main { min-width: 0; max-width: 46rem; }

.robin-docs__kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--rdx-mono);
	font-size: 12px;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}
.robin-docs__kicker-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--rdx-accent); }

.robin-docs__h1 {
	margin: 14px 0 0;
	font-family: var(--robin-font-head);
	font-size: clamp(30px, 3.4vw, 42px);
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -.025em;
	color: var(--rdx-ink);
}
.robin-docs__lead { margin: 18px 0 0; font-size: 17px; line-height: 1.6; letter-spacing: -.015em; color: var(--rdx-muted); }

.robin-docs__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 22px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--rdx-line);
	font-family: var(--rdx-mono);
	font-size: 12px;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}
.robin-docs__draft {
	font-family: var(--rdx-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--rdx-accent);
	background: #ffffff;
	border: 1px solid var(--rdx-accent-soft);
	border-radius: 999px;
	padding: 3px 10px;
	cursor: help;
}

.robin-docs__article { padding-top: 8px; }
.robin-docs__article h2 {
	margin: 44px 0 0;
	font-family: var(--robin-font-head);
	font-size: 24px;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -.02em;
	color: var(--rdx-ink);
	scroll-margin-top: 96px;
}
.robin-docs__article p { margin: 14px 0 0; font-size: 16px; line-height: 1.7; letter-spacing: -.012em; color: var(--rdx-graphite); }
.robin-docs__ul { margin: 16px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.robin-docs__ul li { position: relative; padding-left: 22px; font-size: 16px; line-height: 1.65; color: var(--rdx-graphite); }
.robin-docs__ul li::before {
	content: "";
	position: absolute;
	left: 3px;
	top: 10px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #ffffff;
	border: 1.5px solid var(--rdx-accent);
}

.robin-docs__callout {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 24px;
	padding: 20px 22px;
	background: var(--rdx-parchment);
	border: 1px solid var(--rdx-line);
	border-radius: 20px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--rdx-graphite);
}
.robin-docs__callout strong {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--rdx-mono);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--rdx-accent);
}
.robin-docs__callout strong::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--rdx-accent);
}

.robin-docs__code {
	position: relative;
	margin: 24px 0 0;
	border-radius: 20px;
	overflow: hidden;
	background: var(--rdx-ink);
}
.robin-docs__code figcaption {
	padding: 12px 18px;
	font-family: var(--rdx-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: #a8a5a3;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.robin-docs__code pre { margin: 0; padding: 18px; overflow-x: auto; }
.robin-docs__code code {
	font-family: var(--rdx-mono);
	font-size: 13.5px;
	line-height: 1.65;
	color: #f6f3f1;
}
.robin-docs__copy {
	position: absolute;
	top: 7px;
	right: 10px;
	padding: 4px 12px;
	font-family: var(--rdx-mono);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: -.02em;
	color: #f6f3f1;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 999px;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease;
}
.robin-docs__copy:hover { background: var(--rdx-accent); border-color: var(--rdx-accent); }

.robin-docs__video { margin: 28px 0 0; }
.robin-docs__video-stage {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 9;
	border-radius: 24px;
	overflow: hidden;
	/* пергамент с красным свечением — как hero /ai-communications/ */
	background:
		radial-gradient(45% 60% at 50% 50%, rgba(197, 34, 41, .16), transparent 70%),
		var(--rdx-parchment);
	border: 1px solid var(--rdx-line);
}
.robin-docs__video-stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.robin-docs__video-play {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	padding-left: 4px;
	color: #ffffff;
	background: var(--rdx-accent);
	border: 0;
	border-radius: 50%;
	box-shadow: 0 0 0 10px rgba(163, 12, 51, .1), 0 0 0 22px rgba(163, 12, 51, .05);
	cursor: pointer;
	transition: transform .2s ease;
}
.robin-docs__video-stage.is-playing .robin-docs__video-play { display: none; }
.robin-docs__video-play:hover { transform: scale(1.07); }
.robin-docs__video figcaption {
	margin-top: 10px;
	font-family: var(--rdx-mono);
	font-size: 12px;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}

/* Оценка полезности */
.robin-docs__rate {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-top: 56px;
	padding: 20px 24px;
	background: var(--rdx-parchment);
	border-radius: 24px;
}
.robin-docs__rate-q { font-size: 16px; letter-spacing: -.015em; color: var(--rdx-ink); }
.robin-docs__rate-btns { display: flex; gap: 8px; }
.robin-docs__rate-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 18px;
	font-size: 14px;
	font-weight: 500;
	color: var(--rdx-graphite);
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 999px;
	cursor: pointer;
	transition: color .2s ease, border-color .2s ease;
}
.robin-docs__rate-btn:hover:not(:disabled) { color: var(--rdx-accent); border-color: var(--rdx-accent); }
.robin-docs__rate-btn:disabled { opacity: .55; cursor: default; }
.robin-docs__rate-btn.is-chosen { color: #ffffff; background: var(--rdx-accent); border-color: var(--rdx-accent); opacity: 1; }
.robin-docs__rate-thanks { flex-basis: 100%; margin: 0; font-size: 14px; color: var(--rdx-muted); }

/* Пагинация по статьям */
.robin-docs__pager { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
@media (max-width: 640px) { .robin-docs__pager { grid-template-columns: minmax(0, 1fr); } }
.robin-docs__pager-item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 20px 22px;
	border: 1px solid var(--rdx-ash);
	border-radius: 24px;
	background: #ffffff;
	transition: border-color .2s ease, transform .2s ease;
}
.robin-docs__pager-item + .robin-docs__pager-item { text-align: right; }
.robin-docs__pager-item:hover { border-color: var(--rdx-accent-soft); transform: translateY(-2px); }
.robin-docs__pager-item.is-disabled { opacity: .45; pointer-events: none; }
.robin-docs__pager-dir {
	font-family: var(--rdx-mono);
	font-size: 12px;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}
.robin-docs__pager-item:not(.is-disabled) .robin-docs__pager-dir { color: var(--rdx-accent); }
.robin-docs__pager-title { font-size: 17px; letter-spacing: -.02em; color: var(--rdx-ink); }

/* --- Правый сайдбар: оглавление ------------------------------------------ */
.robin-docs__toc-inner { position: sticky; top: 88px; }
.robin-docs__toc-title {
	font-family: var(--rdx-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--rdx-smoke);
}
.robin-docs__toc ul { list-style: none; margin: 12px 0 0; padding: 0; border-left: 1px solid var(--rdx-line); }
.robin-docs__toc a {
	display: block;
	margin-left: -1px;
	padding: 6px 12px;
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--rdx-muted);
	border-left: 1px solid transparent;
	transition: color .2s ease;
}
.robin-docs__toc a:hover { color: var(--rdx-ink); }
.robin-docs__toc a.is-active { color: var(--rdx-accent); border-left-color: var(--rdx-accent); }

.robin-docs__help {
	margin-top: 32px;
	padding: 20px;
	background: var(--rdx-parchment);
	border-radius: 24px;
}
.robin-docs__help-title { font-size: 16px; letter-spacing: -.015em; color: var(--rdx-ink); }
.robin-docs__help p { margin: 8px 0 0; font-size: 13.5px; line-height: 1.55; color: var(--rdx-muted); }
.robin-docs__help-link {
	display: inline-flex;
	margin-top: 16px;
	padding: 8px 16px;
	font-size: 13px;
	font-weight: 500;
	color: var(--rdx-accent);
	background: #ffffff;
	border: 1px solid var(--rdx-accent);
	border-radius: 999px;
	transition: color .2s ease, background-color .2s ease;
}
.robin-docs__help-link:hover { color: #ffffff; background: var(--rdx-accent); }

/* --- Модальный поиск (Cmd/Ctrl + K) -------------------------------------- */
.robin-search {
	position: fixed;
	inset: 0;
	z-index: 120;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 12vh 16px 20px;
}
.robin-search[hidden] { display: none; }
.robin-search__overlay {
	position: absolute;
	inset: 0;
	background: rgba(36, 36, 36, .4);
	backdrop-filter: blur(4px);
}
.robin-search__dialog {
	position: relative;
	width: min(640px, 100%);
	background: #ffffff;
	border: 1px solid var(--rdx-line);
	border-radius: 28px;
	box-shadow: 0 40px 90px -40px rgba(36, 36, 36, .45);
	overflow: hidden;
}
.robin-search__field {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px 20px;
	border-bottom: 1px solid var(--rdx-line);
	color: var(--rdx-smoke);
}
.robin-search__input {
	flex: 1 1 auto;
	font-size: 16px;
	color: var(--rdx-ink);
	background: none;
	border: 0;
	outline: none;
}
.robin-search__results { max-height: 52vh; overflow-y: auto; padding: 8px; }
.robin-search__item {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 12px 14px;
	border-radius: 16px;
}
.robin-search__item.is-active, .robin-search__item:hover { background: var(--rdx-parchment); }
.robin-search__item-sec {
	font-family: var(--rdx-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--rdx-accent);
}
.robin-search__item-title { font-size: 15px; letter-spacing: -.015em; color: var(--rdx-ink); }
.robin-search__item-desc { font-size: 13px; line-height: 1.5; color: var(--rdx-muted); }
.robin-search__item mark { background: var(--rdx-accent-tint); color: var(--rdx-accent); border-radius: 3px; padding: 0 2px; }
.robin-search__empty { margin: 0; padding: 26px 20px; text-align: center; font-size: 14px; color: var(--rdx-muted); }
.robin-search__empty[hidden] { display: none; }
.robin-search__foot {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	padding: 12px 20px;
	border-top: 1px solid var(--rdx-line);
	font-family: var(--rdx-mono);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: -.02em;
	color: var(--rdx-smoke);
	background: var(--rdx-parchment);
}
.robin-search__foot kbd { margin-right: 4px; background: #ffffff; }

@media (prefers-reduced-motion: reduce) {
	.robin-docs__pager-item, .robin-docs__video-play, .robin-docs__group-chevron,
	.robin-docs-hero__card { transition: none; }
}

/* ==========================================================================
   Страница «Корпоративные ассистенты» (page-corporate-assistants.php),
   блок «Как работает ROBIN.Ассистент?» — точный референс структуры и
   поведения: https://www.gitbook.com/features/ai/gitbook-assistant. Список
   слева: неактивный пункт — только приглушённые иконка+заголовок, у
   активного разворачивается описание (grid-accordion 0fr -> 1fr, а не
   opacity с зарезервированной высотой, как было раньше) — список не
   «прыгает», но и не занимает лишнее место под скрытым текстом. Активная
   панель справа переключается через JS по тому же индексу
   (assets/js/robin-assistant-how.js, не менялась) синхронно с hover/focus
   на пункте. Без индикатора прогресса — автопереключение работает по
   таймеру в JS; переходы короче и на ease-out, чтобы смена шагов ощущалась
   быстрее и мягче. */
.robin-assist-how-item {
	background: none;
	border: 0;
	cursor: pointer;
}
.robin-assist-how-icon,
.robin-assist-how-title {
	transition: color .15s ease-out;
}
.robin-assist-how-item:hover .robin-assist-how-icon,
.robin-assist-how-item:focus-visible .robin-assist-how-icon,
.robin-assist-how-item.is-active .robin-assist-how-icon {
	color: #0F172A;
}
.robin-assist-how-item:hover .robin-assist-how-title,
.robin-assist-how-item:focus-visible .robin-assist-how-title,
.robin-assist-how-item.is-active .robin-assist-how-title {
	color: #0F172A;
	font-weight: 600;
}
.robin-assist-how-item:focus-visible {
	outline: 2px solid #E11D48;
	outline-offset: 4px;
	border-radius: 8px;
}
.robin-assist-how-desc-wrap {
	grid-template-rows: 0fr;
	transition: grid-template-rows .18s ease-out;
}
.robin-assist-how-item:hover .robin-assist-how-desc-wrap,
.robin-assist-how-item:focus-visible .robin-assist-how-desc-wrap,
.robin-assist-how-item.is-active .robin-assist-how-desc-wrap {
	grid-template-rows: 1fr;
}
.robin-assist-how-desc {
	min-height: 0;
}
.robin-assist-how-frame {
	opacity: 0;
	transform: scale(1.02);
	transition: opacity .2s ease-out, transform .2s ease-out;
	pointer-events: none;
}
.robin-assist-how-frame.is-active {
	opacity: 1;
	transform: scale(1);
	pointer-events: auto;
}
@media (prefers-reduced-motion: reduce) {
	.robin-assist-how-icon,
	.robin-assist-how-title,
	.robin-assist-how-desc-wrap,
	.robin-assist-how-frame {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   «Что умеет ROBIN?» (page-platform.php, [data-cando]) — светлая секция
   (bg-[#F6F3F1], как везде на странице) со светлой 3D-панелью-«скриншотом»
   внутри (.robin-cando-panel, rounded-3xl, bg-white + border-gray-100):
   наклонённая плоскость с облаками точек (кластер на каждую область) +
   светлая сетка карточек ниже. Панель раньше была чёрной (bg-black) —
   по запросу от 2026-09-29 стала светлой, поэтому скелетон-полосы/
   разделители/подложки внутри переведены с полупрозрачного белого на
   полупрозрачный тёмный (rgba(15,23,42,*) — тон gray-900), чтобы остаться
   видимыми на белом фоне; точки-кластеры и подписи-пилюли (тёмные,
   rgba(40,40,44,*)) не трогались — они самодостаточны по цвету.
   JS: robin-platform-cando.js (не менялся).
   2026-09-30: по запросу центральная панель (.robin-cando-board) и левое
   меню (.robin-cando-side) — сплошной #000, полосы/подписи/разделители
   белые; подложка вокруг (.robin-cando-panel) убрана полностью —
   background: transparent, без рамки/тени/паддингов (Tailwind-классы
   bg-white/border/shadow/overflow-hidden сняты в page-platform.php),
   маска-виньетка у .robin-cando-stage снята, чтобы чёрный не «таял» в фон.
   -------------------------------------------------------------------------- */
.robin-cando-panel {
	padding: 0;
	margin-left: 0;
	margin-right: 0;
	background: transparent;
	border: 0;
	box-shadow: none;
	isolation: isolate;
}
/* 2026-09-30: по запросу фоном за планшетом — лента из рендера
   «Платформа ROBIN/0d0d9030-….png» (assets/img/platform-cando-ribbon.webp):
   только сама лента (альфа-канал исходного PNG, прозрачный webp),
   по центру за планшетом, чуть шире него. */
.robin-cando {
	overflow-x: clip;
}
.robin-cando-panel::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(1200px, 100vw);
	aspect-ratio: 1600 / 572;
	transform: translate(-50%, -50%);
	background: url("assets/img/platform-cando-ribbon.webp?v=3") center / contain no-repeat;
	z-index: -1;
	pointer-events: none;
}
/* 2026-09-30: по запросу панель оформлена как планшет по мотивам рендера
   «Платформа ROBIN/090522c3-….png» (Marketing/картинки сайта): корпус с
   алюминиевой гранью (градиентная рамка), чёрная рамка экрана, камера,
   кнопки на торцах, толщина корпуса (::before, сдвинутый по Z) и мягкий
   3D-наклон вместо прежней «лежащей» плоскости. Содержимое экрана — те же
   скелетон-меню (.robin-cando-side) и доска с кластерами (.robin-cando-board),
   JS и селекторы не менялись. Красные «ленты» рендера не переносились. */
.robin-cando-stage {
	position: relative;
	margin: 3% auto 5%;
	max-width: 1120px;
	padding: 0 24px;
	perspective: 2400px;
	perspective-origin: 50% 30%;
	pointer-events: none;
}
/* Тень «на полу» под планшетом. */
.robin-cando-stage::after {
	content: "";
	position: absolute;
	left: 16%;
	right: 12%;
	bottom: -5%;
	height: 12%;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgba(20, 16, 18, 0.28), rgba(20, 16, 18, 0.08) 60%, transparent);
	filter: blur(14px);
	z-index: -1;
}
.robin-cando-plane {
	position: relative;
	width: 84%;
	margin: 0 auto;
	aspect-ratio: 16 / 10.4;
	transform: rotateX(13deg) rotateY(-15deg) rotateZ(6deg);
	transform-origin: 50% 50%;
	transform-style: preserve-3d;
	container-type: inline-size;
}
.robin-cando-device {
	position: absolute;
	inset: 0;
	padding: 2cqw;
	border: 0.5cqw solid transparent;
	border-radius: 4.4cqw;
	background:
		linear-gradient(#0b0b0c, #0b0b0c) padding-box,
		linear-gradient(135deg, #9a9ca1 0%, #3a3b3f 18%, #6c6e73 42%, #26272a 64%, #85878c 86%, #3d3e42 100%) border-box;
	box-shadow: inset 0 0 0 0.12cqw rgba(255, 255, 255, 0.07);
	transform-style: preserve-3d;
}
/* Толщина корпуса: копия силуэта чуть позади лицевой панели + основная тень. */
.robin-cando-device::before {
	content: "";
	position: absolute;
	inset: -0.5cqw;
	border-radius: 4.4cqw;
	background: linear-gradient(135deg, #505257, #1c1d20 45%, #3a3b3f);
	transform: translateZ(-1.3cqw);
	box-shadow:
		2cqw 4cqw 6cqw rgba(15, 12, 14, 0.30),
		5cqw 10cqw 14cqw rgba(15, 12, 14, 0.18);
}
.robin-cando-device-cam {
	position: absolute;
	top: 0.75cqw;
	left: 50%;
	width: 0.6cqw;
	height: 0.6cqw;
	margin-left: -0.3cqw;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #3c4a5e, #111318 60%);
	box-shadow: 0 0 0 0.12cqw #1a1a1c;
}
.robin-cando-device-btn {
	position: absolute;
	border-radius: 0.3cqw;
	background: linear-gradient(90deg, #4a4c50, #8b8d92 50%, #4a4c50);
	transform: translateZ(-0.6cqw);
}
.robin-cando-device-btn.is-power {
	top: -0.95cqw;
	right: 13%;
	width: 6cqw;
	height: 0.45cqw;
}
.robin-cando-device-btn.is-vol-up,
.robin-cando-device-btn.is-vol-down {
	left: -0.95cqw;
	width: 0.45cqw;
	height: 5cqw;
	background: linear-gradient(180deg, #4a4c50, #8b8d92 50%, #4a4c50);
}
.robin-cando-device-btn.is-vol-up { top: 16%; }
.robin-cando-device-btn.is-vol-down { top: 25%; }
.robin-cando-screen {
	position: relative;
	display: flex;
	gap: 1.4cqw;
	height: 100%;
	padding: 1.4cqw;
	border-radius: 2.4cqw;
	background:
		radial-gradient(ellipse 70% 60% at 78% 0%, rgba(225, 29, 72, 0.14), transparent 70%),
		#08080a;
	overflow: hidden;
}
/* 2026-09-30: стеклянный диагональный блик поверх экрана убран по запросу. */
.robin-cando-side {
	display: flex;
	flex-direction: column;
	gap: 5%;
	width: 17%;
	padding: 2.2% 1.6%;
	border-radius: 1.6cqw;
	background-color: rgba(255, 255, 255, 0.035);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
	color: #fff;
}
.robin-cando-board {
	position: relative;
	flex: 1;
	border-radius: 1.8cqw;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
	color: #fff;
}
.robin-cando-board-head {
	position: absolute;
	top: 4%;
	left: 6%;
	right: 30%;
	display: flex;
	flex-direction: column;
	gap: 1.1cqw;
}
/* 2026-09-30: полоски-скелетоны приглушены до «едва видно». */
.robin-cando-skel {
	display: block;
	height: 0.9cqw;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.07);
}
.robin-cando-skel.is-title {
	height: 1.6cqw;
	background: rgba(255, 255, 255, 0.12);
}
.robin-cando-skel.is-active {
	height: 1.8cqw;
	background: rgba(255, 255, 255, 0.11);
}
.robin-cando-guide {
	position: absolute;
	left: 4%;
	right: 4%;
	border-top: 1px dashed rgba(255, 255, 255, 0.25);
}
.robin-cando-cluster {
	position: absolute;
	inset: 0;
	transition: opacity 0.7s ease, filter 0.7s ease;
}
.robin-cando-dot {
	position: absolute;
	width: calc(1.05cqw * var(--s, 1));
	height: calc(1.05cqw * var(--s, 1));
	margin: calc(-0.525cqw * var(--s, 1)) 0 0 calc(-0.525cqw * var(--s, 1));
	border-radius: 50%;
	background: var(--c);
	box-shadow: 0 0 0.9cqw color-mix(in srgb, var(--c) 55%, transparent);
	opacity: 0;
	transform: scale(0.2);
	transition: opacity 0.6s ease calc(var(--i) * 30ms), transform 0.6s cubic-bezier(.2, .8, .2, 1) calc(var(--i) * 30ms);
}
.robin-cando.is-inview .robin-cando-dot {
	opacity: 0.9;
	transform: scale(1);
	animation:
		robin-cando-twinkle 4.5s ease-in-out var(--d) infinite,
		robin-cando-drift calc(7s + var(--d)) ease-in-out calc(var(--d) * -2) infinite alternate;
}
/* Мерцание: точка то приглушается, то вспыхивает чуть ярче своим цветом. */
@keyframes robin-cando-twinkle {
	0%, 100% { opacity: 0.9;  box-shadow: 0 0 0.9cqw color-mix(in srgb, var(--c) 55%, transparent); }
	45%      { opacity: 0.45; box-shadow: 0 0 0.4cqw color-mix(in srgb, var(--c) 30%, transparent); }
	70%      { opacity: 1;    box-shadow: 0 0 1.6cqw color-mix(in srgb, var(--c) 80%, transparent); }
}
/* Медленный дрейф — отдельным свойством translate, чтобы не спорить с
   transform: scale() входной анимации. */
@keyframes robin-cando-drift {
	0%   { translate: 0 0; }
	50%  { translate: 0.35cqw -0.25cqw; }
	100% { translate: -0.25cqw 0.3cqw; }
}

/* Свечение под кластером: мягкое пятно цвета кластера «дышит» и медленно
   переливается по оттенку (hue-rotate ±, у каждого кластера свой сдвиг фазы). */
.robin-cando-cluster::before {
	content: "";
	position: absolute;
	left: var(--cx);
	top: var(--cy);
	width: 26%;
	height: 26%;
	transform: translate(-50%, -50%) scale(0.6);
	border-radius: 50%;
	background:
		radial-gradient(closest-side, color-mix(in srgb, var(--c) 42%, transparent), color-mix(in srgb, var(--c) 12%, transparent) 55%, transparent 100%);
	filter: blur(1.2cqw);
	opacity: 0;
	pointer-events: none;
	transition: opacity 1.2s ease calc(var(--ci) * 90ms), transform 1.2s ease calc(var(--ci) * 90ms);
}
.robin-cando.is-inview .robin-cando-cluster::before {
	opacity: 0.55;
	transform: translate(-50%, -50%) scale(1);
	animation:
		robin-cando-breathe 7s ease-in-out calc(var(--ci) * -0.8s) infinite,
		robin-cando-hue 11s ease-in-out calc(var(--ci) * -1.3s) infinite alternate;
}
@keyframes robin-cando-breathe {
	0%, 100% { opacity: 0.4;  transform: translate(-50%, -50%) scale(0.92); }
	50%      { opacity: 0.75; transform: translate(-50%, -50%) scale(1.12); }
}
@keyframes robin-cando-hue {
	0%   { filter: blur(1.2cqw) hue-rotate(-14deg); }
	100% { filter: blur(1.2cqw) hue-rotate(22deg); }
}
.robin-cando-cluster.is-active::before {
	background:
		radial-gradient(closest-side, color-mix(in srgb, var(--c) 60%, transparent), color-mix(in srgb, var(--c) 18%, transparent) 55%, transparent 100%);
}

/* 2026-09-30: бегущий диагональный блик по панели (robin-cando-sheen)
   убран по запросу — остался только сплошной фон. */
.robin-cando-board {
	background: #101012;
}

/* Вне вьюпорта — пауза всех бесконечных анимаций (класс ставит JS). */
.robin-cando.is-paused .robin-cando-dot,
.robin-cando.is-paused .robin-cando-cluster::before {
	animation-play-state: paused;
}
.robin-cando-label {
	position: absolute;
	z-index: 1;
	transform: translate(-50%, -50%);
	padding: 0.55cqw 1.2cqw;
	border-radius: 0.9cqw;
	background: rgba(40, 40, 44, 0.78);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), 0 0.6cqw 1.6cqw rgba(0, 0, 0, 0.45);
	color: #fff;
	font-size: 1.45cqw;
	line-height: 1.2;
	white-space: nowrap;
	transition: background-color 0.3s ease, color 0.3s ease;
}
/* 2026-10-02: кластеры на планшете переключаются наведением — сцена
   остаётся pointer-events:none, «ловят» курсор только подпись и пятно
   свечения кластера (события уходят на .robin-cando-cluster, см. JS). */
.robin-cando-label,
.robin-cando-cluster::before {
	pointer-events: auto;
	cursor: pointer;
}
.robin-cando-cluster.is-active .robin-cando-label {
	z-index: 2;
}
.robin-cando[data-active] .robin-cando-cluster:not(.is-active) {
	opacity: 0.35;
	filter: saturate(0.5);
}
.robin-cando-cluster.is-active .robin-cando-label {
	background: color-mix(in srgb, var(--c) 30%, #1c1c20);
	color: #fff;
}
/* Карточки-области под панелью — светлые, в стиле карточек остальной
   страницы (border-gray-100 bg-white, см. «Искусственный интеллект в
   ROBIN» рядом). Наведение/фокус (или автоперебор) подсвечивает иконку
   и рамку цветом --c — тем же цветом, что и кластер на панели выше. */
.robin-cando-item {
	outline: none;
	cursor: default;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.robin-cando-item-icon {
	display: inline-flex;
	height: 2.5rem;
	width: 2.5rem;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	border-radius: 0.75rem;
	background: #FFF1F2;
	color: #E11D48;
	transition: background-color 0.3s ease, color 0.3s ease;
}
.robin-cando-item.is-active {
	border-color: color-mix(in srgb, var(--c) 45%, #E5E7EB);
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--c) 22%, transparent);
}
.robin-cando-item.is-active .robin-cando-item-icon {
	background: color-mix(in srgb, var(--c) 18%, #fff);
	color: var(--c);
}
.robin-cando[data-active] .robin-cando-item:not(.is-active) {
	opacity: 0.6;
}
.robin-cando-item:focus-visible {
	outline: 2px solid #E11D48;
	outline-offset: 3px;
	border-radius: 16px;
}
@media (max-width: 767px) {
	.robin-cando-panel {
		padding: 0 4%;
	}
	.robin-cando-stage {
		margin: 0 auto 4%;
		padding: 0;
		max-width: none;
	}
	.robin-cando-plane {
		width: 94%;
		transform: rotateX(10deg) rotateY(-10deg) rotateZ(4deg);
	}
	.robin-cando-label {
		padding: 0.45cqw 0.9cqw;
		font-size: 2.1cqw;
	}
}
@media (prefers-reduced-motion: reduce) {
	.robin-cando-dot,
	.robin-cando.is-inview .robin-cando-dot,
	.robin-cando.is-inview .robin-cando-cluster::before,
	.robin-cando.is-inview .robin-cando-board {
		animation: none;
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   Hero-схема «Каналы → AI-агент ROBIN → Действия» (page-ai-communications.php).
   Визуальный язык — DESIGN.md (Monad): пергамент #f6f3f1, линии Ash #cecac8,
   pill-узлы, моно для всех подписей, serif (weight 400) для имени агента,
   красное свечение хаба, без теней. Семантика цвета: серый — входящая
   коммуникация, бордовый ROBIN — обработка агентом, красный #C52229 — результат.
   -------------------------------------------------------------------------- */
.rcm-flow {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result: #c52229;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--rcm-serif: var(--robin-font-head);
	position: relative;
	isolation: isolate;
	overflow: hidden;
	margin-left: 0;
	margin-right: 0;
	padding: 24px 16px;
	/* без рамки и своей подложки: схема лежит прямо на фоне hero-блока (#F6F3F1) */
	background: transparent;
	font-family: var(--rcm-mono);
	color: var(--rcm-ink);
}
@media (min-width: 1024px) {
	.rcm-flow { padding: 16px 8px; }
}
/* атмосферная пастельная вуаль (Coral → Sky, Sky → Mint) по краям */
.rcm-flow::before,
.rcm-flow::after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 420px;
	height: 320px;
	border-radius: 50%;
	filter: blur(70px);
	opacity: 0.35;
	pointer-events: none;
	/* схема без рамки — вуаль обрезалась бы по прямоугольнику и читалась как рамка */
	display: none;
}
.rcm-flow::before {
	left: -160px;
	top: -120px;
	background: linear-gradient(135deg, #ff9473, #a0b5eb);
}
.rcm-flow::after {
	right: -160px;
	bottom: -140px;
	background: linear-gradient(135deg, #a0b5eb, #c52229);
}
.rcm-flow-svg {
	width: 100%;
	height: auto;
	overflow: visible;
}
.rcm-flow-svg text {
	font-family: var(--rcm-mono);
}
.rcm-flow-caption {
	font-size: 11px;
	fill: var(--rcm-smoke);
}
.rcm-flow-line {
	fill: none;
	stroke: var(--rcm-ash);
	stroke-width: 1.2;
}
.rcm-flow-line--dash { stroke-dasharray: 3 5; }
.rcm-flow-line--out { stroke: var(--rcm-result-soft); }
.rcm-flow-line--core { stroke: var(--rcm-accent); stroke-width: 1.4; }
.rcm-flow-pill {
	fill: var(--rcm-parchment);
	stroke: var(--rcm-ash);
	stroke-width: 1;
}
.rcm-flow-node--out .rcm-flow-pill { stroke: var(--rcm-result-soft); }
.rcm-flow-icon { color: var(--rcm-smoke); }
.rcm-flow-node--out .rcm-flow-icon { color: var(--rcm-result); }
.rcm-flow-label {
	font-size: 13px;
	letter-spacing: -0.02em;
	fill: var(--rcm-ink);
}
.rcm-flow-label--sm { font-size: 12px; }
/* вторая строка в плашке узла (схема платформы, page-platform.php) */
.rcm-flow-label-sub {
	font-size: 10px;
	letter-spacing: -0.02em;
	fill: var(--rcm-smoke);
}
.rcm-flow-chip {
	fill: var(--rcm-parchment);
	stroke: var(--rcm-ash);
	stroke-width: 1;
}
.rcm-flow-chip--out { stroke: var(--rcm-result-soft); }
.rcm-flow-chip-text {
	font-size: 9.5px;
	letter-spacing: 0.04em;
	fill: var(--rcm-smoke);
}
.rcm-flow-chip-text--out { fill: var(--rcm-result); }
.rcm-flow-diamond rect {
	fill: var(--rcm-parchment);
	stroke: var(--rcm-accent);
	stroke-width: 1.3;
}
.rcm-flow-diamond circle { fill: var(--rcm-accent); }
.rcm-flow-core-title {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.02em;
	fill: var(--rcm-ink);
}
.rcm-flow-core-sub {
	font-size: 11px;
	fill: var(--rcm-graphite);
}
.rcm-flow-hub {
	fill: #fbfaf9;
	stroke: var(--rcm-ash);
	stroke-width: 1;
}
.rcm-flow-ring {
	fill: none;
	stroke: var(--rcm-accent);
	stroke-width: 1.2;
	stroke-dasharray: 2 7;
	stroke-linecap: round;
	opacity: 0.7;
	transform-box: fill-box;
	transform-origin: center;
	animation: rcm-flow-spin 24s linear infinite;
}
.rcm-flow-svg .rcm-flow-hub-title {
	font-family: var(--rcm-serif);
	font-size: 30px;
	font-weight: 400;
	letter-spacing: -0.02em;
	fill: var(--rcm-ink);
}
.rcm-flow-hub-kicker {
	font-size: 9px;
	letter-spacing: 0.1em;
	fill: var(--rcm-smoke);
}
.rcm-flow-dot { fill: var(--rcm-smoke); }
.rcm-flow-dot--out { fill: var(--rcm-result); }
@keyframes rcm-flow-spin {
	to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
	.rcm-flow-dots { display: none; }
	.rcm-flow-ring { animation: none; }
}

/* мобильная версия схемы: вертикальный стек */
.rcm-flow-stack {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
}
.rcm-flow-stack-caption {
	margin-top: 4px;
	font-size: 11px;
	color: var(--rcm-smoke);
}
.rcm-flow-stack-pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}
.rcm-flow-stack-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border: 1px solid var(--rcm-ash);
	border-radius: 9999px;
	font-size: 12px;
	letter-spacing: -0.02em;
}
.rcm-flow-stack-pill svg {
	width: 14px;
	height: 14px;
	color: var(--rcm-smoke);
}
.rcm-flow-stack-pill--out { border-color: var(--rcm-result-soft); }
.rcm-flow-stack-pill-sub { color: var(--rcm-smoke); }
.rcm-flow-stack-pill--out svg { color: var(--rcm-result); }
.rcm-flow-stack-arrow { color: var(--rcm-ash); font-size: 18px; line-height: 1; }
.rcm-flow-stack-arrow--out { color: var(--rcm-result); }
.rcm-flow-stack-core {
	width: 100%;
	max-width: 360px;
	padding: 20px 16px;
	border: 1px solid var(--rcm-accent);
	border-radius: 24px;
	background: radial-gradient(circle at 50% 30%, rgba(197, 34, 41, 0.14), transparent 70%), #fbfaf9;
}
.rcm-flow-stack-kicker {
	display: block;
	font-size: 10px;
	letter-spacing: 0.1em;
	color: var(--rcm-smoke);
}
.rcm-flow-stack-bird {
	display: block;
	width: 72px;
	height: auto;
	margin: 8px auto 4px;
}
.rcm-flow-stack-title {
	display: block;
	font-family: var(--rcm-serif);
	font-size: 28px;
	line-height: 1.2;
	letter-spacing: -0.02em;
}
.rcm-flow-stack-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 8px;
	margin-top: 14px;
	text-align: left;
}
.rcm-flow-stack-grid b {
	display: block;
	font-size: 11px;
	font-weight: 500;
}
.rcm-flow-stack-grid b::first-letter { color: var(--rcm-accent); }
.rcm-flow-stack-grid span {
	font-size: 11px;
	color: var(--rcm-graphite);
}

/* --------------------------------------------------------------------------
   Карточки-тезисы «How Monad Works» под hero (page-ai-communications.php).
   DESIGN.md (Monad): рамка Ash 1px, скругление 40px, padding 40px, без теней;
   serif 400 — заголовок, моно — всё остальное; одна «выделенная» карточка
   на Periwinkle. Цветовая семантика схем — как у .rcm-flow: серый — вход,
   бордовый — агент, красный #C52229 — результат.
   -------------------------------------------------------------------------- */
.rcm-how {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result: #c52229;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--rcm-serif: var(--robin-font-head);
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	font-family: var(--rcm-mono);
	color: var(--rcm-ink);
}
/* Вертикальные карточки: текст сверху, схема снизу; две карточки в ряд */
.rcm-how-card {
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	gap: 32px;
	padding: 32px;
	border: 1px solid var(--rcm-ash);
	border-radius: 28px;
	background: var(--rcm-parchment);
	overflow: hidden;
}
.rcm-how-text {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.rcm-how-num {
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: -0.03em;
	color: var(--rcm-smoke);
}
.rcm-how .rcm-how-title {
	font-family: var(--rcm-serif);
	font-weight: 400;
	font-size: 20px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.rcm-how-body {
	font-size: 15px;
	line-height: 1.35;
	letter-spacing: -0.025em;
	color: var(--rcm-graphite);
}
.rcm-how-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rcm-how-tags li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: 100%;
	padding: 7px 14px;
	border: 1px solid var(--rcm-ash);
	border-radius: 9999px;
	background: var(--rcm-parchment);
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: -0.02em;
}
.rcm-how-tags li::before {
	content: "";
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--rcm-accent);
}

/* Схема снизу карточки — прижата к низу, чтобы схемы двух карточек стояли на одной линии */
.rcm-how-art { position: relative; width: 100%; max-width: 480px; margin: auto auto 0; aspect-ratio: 2 / 1; }
.rcm-how-art svg { display: block; width: 100%; height: 100%; overflow: visible; }
.rcm-how-art svg text { font-family: var(--rcm-mono); font-size: 13px; letter-spacing: -0.02em; text-transform: uppercase; fill: var(--rcm-ink); }
.rcm-how-line { fill: none; stroke: var(--rcm-ash); stroke-width: 1.2; }
.rcm-how-line--out { stroke: var(--rcm-result-soft); }
.rcm-how-line--live {
	stroke: var(--rcm-smoke);
	stroke-dasharray: 2 8;
	stroke-linecap: round;
	animation: rcm-how-dash 1.6s linear infinite;
}
.rcm-how-line--live-out { stroke: var(--rcm-result); }
@keyframes rcm-how-dash { to { stroke-dashoffset: -40; } }
.rcm-how-node rect { fill: var(--rcm-parchment); stroke: var(--rcm-ash); stroke-width: 1; }
.rcm-how-icon { color: var(--rcm-smoke); }
.rcm-how-node--out rect { stroke: var(--rcm-result-soft); }
.rcm-how-node--out .rcm-how-icon { color: var(--rcm-result); }
.rcm-how-node--hub rect { fill: #fbfaf9; stroke: var(--rcm-accent); stroke-width: 1.3; }
.rcm-how-node--hub circle { fill: var(--rcm-accent); }
.rcm-how-art .rcm-how-node--hub text { font-weight: 500; }
.rcm-how-node--chip rect { fill: rgba(246, 243, 241, 0.8); stroke-dasharray: 3 3; }
.rcm-how-art .rcm-how-node--chip text { font-size: 11px; fill: var(--rcm-graphite); }

/* Тезис над карточками — текст без подложки, на всю ширину блока
   (в разметке вынесен из контейнера max-w-6xl) */
.rcm-how-note {
	margin: 0;
	padding: 18px 24px;
	font-family: var(--robin-font-head);
	font-size: 24px;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-align: center;
	color: #000;
}

@media (prefers-reduced-motion: reduce) {
	.rcm-how-line--live { animation: none; }
}
@media (max-width: 1023px) {
	.rcm-how { grid-template-columns: minmax(0, 1fr); }
	.rcm-how-card { gap: 24px; padding: 24px 20px; border-radius: 24px; }
	.rcm-how .rcm-how-title { font-size: 18px; }
	.rcm-how-tags li { padding: 6px 12px; font-size: 12px; }
}
/* На телефоне схема в viewBox 640 ужимается до нечитаемого кегля —
   как и hero-SVG, прячем её; тезисы и теги остаются. */
@media (max-width: 639px) {
	.rcm-how-art { display: none; }
}

/* --------------------------------------------------------------------------
   Блок «Что мешает масштабировать коммуникации силами людей»
   (page-ai-communications.php, #pains). По DESIGN.md (Function, секция
   «160+ lab tests chosen by top doctors»): кремовая панель без тени,
   скругление 24px, заголовок крупным кеглем с курсивным serif-акцентом
   на ключевых словах, крупная цифра-стат, список на hairline-разделителях.
   Палитра — та же, что у .rcm-how (терракоту Function заменяет бордовый
   акцент ROBIN — второй акцент не вводим). Serif-курсив — Lora Italic,
   локально в assets/fonts (только кириллица + латиница), используется
   только для акцентных слов, остальной текст — фирменный TTInterfaces.
   -------------------------------------------------------------------------- */
@font-face {
	font-family: "Lora";
	src: url(assets/fonts/Lora-Italic-cyrillic.woff2) format("woff2");
	font-weight: 400 500;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
	font-family: "Lora";
	src: url(assets/fonts/Lora-Italic-latin.woff2) format("woff2");
	font-weight: 400 500;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.rcm-pains {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-italic: "Lora", Georgia, "Times New Roman", serif;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 48px 64px;
	padding: 56px;
	border-radius: 24px;
	background: var(--rcm-parchment);
	color: var(--rcm-ink);
}
.rcm-pains-head {
	align-self: start;
	position: sticky;
	top: 112px;
	display: flex;
	flex-direction: column;
	gap: 32px;
}
/* Hero Stat Block: крупная цифра + подпись, отделены вертикальной hairline */
.rcm-pains .rcm-pains-stat {
	display: flex;
	align-items: baseline;
	gap: 14px;
	margin: 0;
}
.rcm-pains-stat-num {
	font-family: var(--rcm-italic);
	font-style: italic;
	font-size: 45px;
	line-height: 1;
	color: var(--rcm-accent);
}
.rcm-pains-stat-label {
	padding-left: 14px;
	border-left: 1px solid var(--rcm-ash);
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--rcm-graphite);
}
.rcm-pains .rcm-pains-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rcm-ink);
}
/* Фирменный ход DESIGN.md: roman + italic serif в одной строке.
   Курсивом — только «эмоциональные» слова, не всё предложение. */
.rcm-pains-title em {
	font-family: var(--rcm-mono);
	font-style: normal;
	font-weight: 400;
	letter-spacing: -0.01em;
	color: var(--rcm-accent);
}

.rcm-pains-list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--rcm-ash);
}
.rcm-pains-item {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr) 40px;
	gap: 20px;
	align-items: start;
	padding: 28px 0;
	border-bottom: 1px solid var(--rcm-ash);
}
.rcm-pains-num {
	padding-top: 5px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--rcm-accent);
}
.rcm-pains .rcm-pains-item-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.rcm-pains .rcm-pains-text {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
/* Контурная иконка в круге на hairline — «печать» справа от строки */
.rcm-pains-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--rcm-ash);
	border-radius: 9999px;
	color: var(--rcm-accent);
	transition: background-color .2s ease, border-color .2s ease;
}
.rcm-pains-item:hover .rcm-pains-icon {
	background: #fbfaf9;
	border-color: var(--rcm-accent);
}

@media (max-width: 1023px) {
	.rcm-pains { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 40px 32px; }
	.rcm-pains-head { position: static; gap: 24px; }
	.rcm-pains .rcm-pains-title { font-size: 36px; }
}
@media (max-width: 639px) {
	.rcm-pains { padding: 32px 20px; border-radius: 20px; }
	.rcm-pains .rcm-pains-title { font-size: 30px; line-height: 1.12; }
	.rcm-pains-stat-num { font-size: 36px; }
	.rcm-pains-item { grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 22px 0; }
	.rcm-pains-icon { display: none; }
	.rcm-pains .rcm-pains-item-title { font-size: 18px; }
	.rcm-pains .rcm-pains-text { font-size: 14px; }
}

/* --------------------------------------------------------------------------
   Блок «Преимущества наших AI-агентов для коммуникаций»
   (page-ai-communications.php, #capabilities). Тот же язык, что у верхних
   блоков: заголовок — как .rcm-pains-title (serif + курсивный акцент Lora),
   карточки — как .rcm-how-card (пергамент, рамка Ash, без теней), вместо
   иллюстраций — мини-схемы из pill-узлов с семантикой .rcm-flow:
   серый — вход, бордовый — агент, красный #C52229 — результат.
   -------------------------------------------------------------------------- */
.rcm-caps {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result: #c52229;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--rcm-italic: "Lora", Georgia, "Times New Roman", serif;
	color: var(--rcm-ink);
}
.rcm-caps .rcm-caps-title {
	max-width: 46rem;
	margin: 0 0 48px;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rcm-ink);
}
.rcm-caps-title em {
	font-family: var(--rcm-mono);
	font-style: normal;
	font-weight: 400;
	letter-spacing: -0.01em;
	color: var(--rcm-accent);
}
/* Заголовок «Преимущества наших AI-агентов…» — акцентное слово набрано
   основным шрифтом заголовка (не моно), только цвет остаётся акцентным. */
.rcm-caps-title em.rcm-caps-em--head {
	font-family: var(--robin-font-head);
	letter-spacing: -0.025em;
}
/* Заголовок по центру блока (страница AI-агентов для коммуникаций) */
.rcm-caps .rcm-caps-title.rcm-caps-title--center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.rcm-caps-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rcm-caps-card {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 28px;
	border: 1px solid var(--rcm-ash);
	border-radius: 28px;
	background: var(--rcm-parchment);
	transition: border-color .2s ease;
}
.rcm-caps-card:hover { border-color: var(--rcm-result-soft); }
.rcm-caps .rcm-caps-meta {
	display: flex;
	gap: 10px;
	margin: 0;
	font-family: var(--rcm-mono);
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}
.rcm-caps-num { color: var(--rcm-accent); }
.rcm-caps .rcm-caps-item-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.rcm-caps .rcm-caps-desc {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}

/* Мини-схема — прижата к низу, чтобы схемы в ряду стояли на одной линии */
.rcm-caps-art { width: 100%; margin-top: auto; padding-top: 8px; aspect-ratio: 320 / 140; }
.rcm-caps-art svg { display: block; width: 100%; height: 100%; overflow: visible; }
.rcm-caps-art svg text { font-family: var(--rcm-mono); font-size: 11px; letter-spacing: -0.02em; text-transform: uppercase; fill: var(--rcm-ink); }
.rcm-caps-line { fill: none; stroke: var(--rcm-ash); stroke-width: 1.2; }
.rcm-caps-line--out { stroke: var(--rcm-result-soft); }
.rcm-caps-line--dash { stroke-dasharray: 3 3; }
.rcm-caps-line--live {
	stroke: var(--rcm-smoke);
	stroke-dasharray: 2 8;
	stroke-linecap: round;
	animation: rcm-how-dash 1.6s linear infinite;
}
.rcm-caps-line--out.rcm-caps-line--live { stroke: var(--rcm-result); }
.rcm-caps-bar { fill: var(--rcm-smoke); }
.rcm-caps-node rect { fill: var(--rcm-parchment); stroke: var(--rcm-ash); stroke-width: 1; }
.rcm-caps-icon { color: var(--rcm-smoke); }
.rcm-caps-node--out rect { stroke: var(--rcm-result-soft); }
.rcm-caps-node--out circle { fill: var(--rcm-result); }
.rcm-caps-node--out .rcm-caps-icon { color: var(--rcm-result); }
.rcm-caps-node--hub rect { fill: #fbfaf9; stroke: var(--rcm-accent); stroke-width: 1.3; }
.rcm-caps-node--hub circle { fill: var(--rcm-accent); }
.rcm-caps-art .rcm-caps-node--hub text { font-weight: 500; }
.rcm-caps-node--chip rect { fill: rgba(246, 243, 241, 0.9); stroke-dasharray: 3 3; }
.rcm-caps-art .rcm-caps-node--chip text { font-size: 10px; fill: var(--rcm-graphite); }
.rcm-caps-diamond rect { fill: #fbfaf9; stroke: var(--rcm-accent); stroke-width: 1.3; }
.rcm-caps-diamond circle { fill: var(--rcm-accent); }

@media (prefers-reduced-motion: reduce) {
	.rcm-caps-line--live { animation: none; }
}
@media (max-width: 1023px) {
	.rcm-caps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rcm-caps .rcm-caps-title { font-size: 36px; margin-bottom: 36px; }
}
@media (max-width: 639px) {
	.rcm-caps-grid { grid-template-columns: minmax(0, 1fr); }
	.rcm-caps-card { padding: 24px 20px; border-radius: 24px; }
	.rcm-caps .rcm-caps-title { font-size: 30px; line-height: 1.12; margin-bottom: 28px; }
	.rcm-caps .rcm-caps-item-title { font-size: 18px; }
	.rcm-caps .rcm-caps-desc { font-size: 14px; }
}

/* --------------------------------------------------------------------------
   Блок «Отзывы» (page-ai-communications.php, #reviews) — те же карточки
   .rcm-caps-card, что у «Преимущества…» выше: вместо мини-схемы внизу
   карточки — подпись автора отзыва (margin-top: auto, тот же приём
   выравнивания по нижнему краю ряда, что у .rcm-caps-art).
   -------------------------------------------------------------------------- */
.rcm-rev-quote { margin: 0; }
.rcm-rev-mark { display: block; margin-bottom: 10px; color: #9F9F9F; }
.rcm-rev-quote p {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
.rcm-rev-sign {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: auto 0 0;
	padding-top: 16px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	line-height: 1.35;
	letter-spacing: -0.02em;
}
.rcm-rev-sign-name { color: #9F9F9F; }
.rcm-rev-sign-role { color: #9F9F9F; }
.rcm-rev-all { margin-top: 40px; text-align: center; }
.rcm-rev-all a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--rcm-mono);
	font-size: 13px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rcm-accent);
	transition: gap .15s ease;
}
.rcm-rev-all a:hover { gap: 10px; }

/* Панель-фрейм, как у .rcm-pains: кремовая подложка, rounded 24px. */
.rcm-caps--panel {
	padding: 56px;
	border-radius: 24px;
	background: var(--rcm-parchment);
}
.rcm-caps--panel .rcm-caps-card { background: #fff; }
@media (max-width: 1023px) {
	.rcm-caps--panel { padding: 40px 32px; }
}
@media (max-width: 639px) {
	.rcm-caps--panel { padding: 32px 20px; border-radius: 20px; }
}

/* --------------------------------------------------------------------------
   Блок «AI-агенты для ключевых задач бизнеса» (page-ai-communications.php,
   #scenarios). Тот же язык, что у .rcm-pains/.rcm-caps: пергамент, рамка
   Ash без тени, serif-заголовок с курсивным акцентом Lora, моно-подпись
   ролей внизу карточки. Табы — общий компонент со страницей партнёрской
   программы (assets/js/robin-partner-tabs.js); обёртка и панель стилизуются
   как раньше, а переключатели здесь дополнительно перекрашены (см. правила
   .rcm-domains-tabs [data-pp-tab] ниже) — на странице партнёрской программы
   они остаются в исходных классах скрипта.
   -------------------------------------------------------------------------- */
.rcm-domains {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--rcm-italic: "Lora", Georgia, "Times New Roman", serif;
	color: var(--rcm-ink);
}
.rcm-domains .rcm-domains-title {
	max-width: 46rem;
	margin: 0 0 32px;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rcm-ink);
}
.rcm-domains-title em {
	font-family: var(--robin-font-head);
	font-style: normal;
	font-weight: 400;
	letter-spacing: -0.025em;
	color: var(--rcm-accent);
}
.rcm-domains-panel {
	padding: 40px;
	border: 1px solid var(--rcm-ash);
	border-radius: 32px;
	background: var(--rcm-parchment);
}
.rcm-domains-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	font-family: inherit;
}
/* Переопределяет цвета исходных классов скрипта (border-rose-600…) только
   для этого блока — на странице партнёрской программы переключатели
   остаются как были. */
.rcm-domains-tabs [data-pp-tab] {
	border-color: #EDEBE9;
	background-color: #fff;
	color: #9F9F9F;
}
.rcm-domains-tabs [data-pp-tab]:hover {
	border-color: #EDEBE9;
	color: #9F9F9F;
}
.rcm-domains-tabs [data-pp-tab][aria-selected="true"],
.rcm-domains-tabs [data-pp-tab][aria-selected="true"]:hover {
	border-color: var(--rcm-accent);
	background-color: #fff;
	color: var(--rcm-accent);
}
.rcm-domains-card {
	position: relative;
	margin-top: 32px;
	padding-top: 32px;
	border-top: 1px solid var(--rcm-ash);
}
.rcm-domains-num {
	display: block;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.03em;
	color: var(--rcm-accent);
}
.rcm-domains .rcm-domains-card-title {
	margin: 10px 0 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 24px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.rcm-domains .rcm-domains-card-desc {
	margin: 12px 0 0;
	max-width: 42rem;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
.rcm-domains .rcm-domains-roles {
	margin: 20px 0 0;
	padding-top: 20px;
	border-top: 1px solid var(--rcm-ash);
	font-family: var(--rcm-mono);
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}

@media (max-width: 1023px) {
	.rcm-domains .rcm-domains-title { font-size: 36px; }
	.rcm-domains-panel { padding: 28px 24px; border-radius: 24px; }
}
@media (max-width: 639px) {
	.rcm-domains .rcm-domains-title { font-size: 30px; line-height: 1.12; }
	.rcm-domains-panel { padding: 24px 20px; border-radius: 20px; }
	.rcm-domains .rcm-domains-card-title { font-size: 20px; }
	.rcm-domains .rcm-domains-card-desc { font-size: 14px; }
}

/* ==========================================================================
   Блок «Архитектура решения» (page-corporate-assistants.php, БЛОК 4.1)
   Референс механики — Column «Infrastructure»: изометрический стек из
   3 плит; при скролле верх и низ расходятся, средняя плита («Платформа
   ROBIN») раскладывается на 3 компонента. Цвета/шрифт — только наши.

   Всё движение — transform от одной переменной --p (0…1) на
   [data-arch-stage], её пишет assets/js/robin-arch-stack.js. Из --p
   выводятся две фазы: --a (слои расходятся) и --b (платформа
   раскладывается). По умолчанию --p: 1 — финальное состояние, его видят
   без JS, при prefers-reduced-motion и на мобильных.

   Объём плит: плита — квадрат W×W под rotateX(60deg) rotateZ(-45deg)
   (изометрия без перспективы), толщина — стопка box-shadow со смещением
   (-n, n) в локальных координатах, что после поворота уходит строго вниз
   на экране. Сдвиг слоя — translateY у обёртки-якоря в экранных
   координатах, поэтому подписи справа двигаются на ту же величину и
   выноски не нужно пересчитывать в JS.
   ========================================================================== */
.robin-arch {
	/* Шкала сдвинута из rose (малиновый) в чистый красный оперения птицы
	   ROBIN с маскота (robin-bird.png: #CC2424 → #B41818 → #840C0C → #600000);
	   светлота шагов прежняя. Акцент блока — тоже красный птицы. */
	--arch-rose-100: #F6D4D1;
	--arch-rose-200: #EBA7A2;
	--arch-rose-400: #CC3A33;
	--arch-rose-500: #B41818;
	--arch-rose-700: #840C0C;
	--arch-rose-800: #600000;
	--arch-red-600: #CC2424;
	--arch-red-650: #A80C0C;
	--robin-accent: #A80C0C;
	--arch-line: #E6EBF3;
	--arch-callout: #9F9F9F;
}

.robin-arch-sticky {
	padding: 56px 0;
}

.robin-arch-stage {
	--p: 1;
	--a: clamp(0, calc((var(--p) - 0.05) / 0.35), 1);
	--b: clamp(0, calc((var(--p) - 0.4) / 0.5), 1);
	/* Единица сцены: 1px, пока хватает окна; иначе сцена ужимается, чтобы
	   целиком влезть в высоту под шапкой (64px) и в ширину. */
	--u: min(1px, calc((100vh - 64px) / 720), calc(100vw / 1180));
	--w: calc(250 * var(--u));
	/* Половина экранной ширины плиты: W·√2 / 2. */
	--half: calc(var(--w) * 0.7071);
	/* Расстояние от центра до верхнего/нижнего слоя и шаг между
	   компонентами платформы. */
	--gap: calc((34 + 86 * var(--a) + 96 * var(--b)) * var(--u));
	--sub-step: calc(74 * var(--b) * var(--u));
	/* Центр стека по X внутри холста: плита + место под скобку «Платформа
	   ROBIN» слева; всё остальное — колонка подписей справа. */
	--cx: calc(var(--half) + 64px);
}

.robin-arch-heading {
	margin: 0 0 32px;
}

/* Холст иллюстрации: стек и подписи позиционируются от его центра.
   Запас по высоте (130px) — под чипы верхнего слоя, которые растут вверх. */
.robin-arch-canvas {
	position: relative;
	height: calc(2 * (216 * var(--u) + 130px));
}

/* ≥ 1024px — заголовок колонкой слева от иллюстрации, по центру стека. */
@media (min-width: 1024px) {
	.robin-arch-stage {
		display: grid;
		grid-template-columns: minmax(200px, 24%) minmax(0, 1fr);
		gap: 24px;
		align-items: center;
	}
	.robin-arch-heading {
		margin: 0;
	}
}

/* --- Визуал: слои-якоря и плиты ----------------------------------------- */
.robin-arch-visual {
	position: absolute;
	inset: 0;
	pointer-events: none;
}
.robin-arch-layer,
.robin-arch-sub,
.robin-arch-shell {
	position: absolute;
	width: 0;
	height: 0;
	will-change: transform;
}
.robin-arch-layer {
	left: var(--cx);
	top: 50%;
}
.robin-arch-sub,
.robin-arch-shell {
	left: 0;
	top: 0;
}
.robin-arch-layer--top {
	z-index: 4;
	transform: translateY(calc(-1 * var(--gap)));
}
.robin-arch-layer--mid {
	z-index: 2;
}
.robin-arch-layer--base {
	z-index: 1;
	transform: translateY(var(--gap));
}
.robin-arch-sub {
	z-index: calc(3 - var(--i));
	transform: translateY(calc((var(--i) - 1) * var(--sub-step)));
}
/* Цельная плита платформы лежит поверх компонентов и растворяется в
   начале фазы B — под ней уже видны расходящиеся плиты. */
.robin-arch-shell {
	z-index: 4;
	opacity: calc(1 - var(--b) * 3);
}

.robin-arch-plate {
	position: absolute;
	left: calc(var(--w) / -2);
	top: calc(var(--w) / -2);
	width: var(--w);
	height: var(--w);
	border-radius: calc(26 * var(--u));
	transform: rotateX(60deg) rotateZ(-45deg);
	box-shadow:
		inset 0 0 0 1px var(--rim),
		-2px 2px 0 var(--edge), -4px 4px 0 var(--edge), -6px 6px 0 var(--edge),
		-8px 8px 0 var(--edge), -10px 10px 0 var(--edge), -12px 12px 0 var(--edge),
		-14px 14px 0 var(--edge), -16px 16px 0 var(--edge), -18px 18px 0 var(--edge),
		-20px 20px 0 var(--edge),
		-40px 40px 48px var(--drop);
}

/* Верхний слой — готовые ассистенты: светлая плита с «плитками»-точками. */
.robin-arch-plate--top {
	--rim: #FFFFFF;
	--edge: #E2E2E1;
	--drop: rgba(14, 21, 38, 0.10);
	background:
		radial-gradient(circle, var(--arch-rose-100) 0 calc(7 * var(--u)), transparent calc(7.5 * var(--u))) 0 0 / calc(var(--w) / 5) calc(var(--w) / 5),
		linear-gradient(135deg, #FFFFFF 0%, #F5F7FB 100%);
}

/* Средний слой — платформа: бренд-градиент кнопки .robin-btn-primary. */
.robin-arch-plate--mid {
	--rim: rgba(255, 255, 255, 0.22);
	--edge: var(--arch-rose-700);
	--drop: rgba(132, 12, 12, 0.14);
	background: linear-gradient(135deg, var(--arch-red-600) 0%, var(--arch-red-650) 70%);
}

/* Компоненты платформы — тоньше и по тону от светлого (Studio) к
   тёмному (Robot), чтобы стопка читалась сверху вниз. */
.robin-arch-plate--sub {
	--rim: rgba(255, 255, 255, 0.25);
	--drop: rgba(132, 12, 12, 0.10);
	box-shadow:
		inset 0 0 0 1px var(--rim),
		-2px 2px 0 var(--edge), -4px 4px 0 var(--edge), -6px 6px 0 var(--edge),
		-8px 8px 0 var(--edge), -10px 10px 0 var(--edge), -12px 12px 0 var(--edge),
		-28px 28px 40px var(--drop);
}
.robin-arch-sub:nth-child(1) .robin-arch-plate--sub {
	--edge: var(--arch-rose-500);
	background: linear-gradient(135deg, var(--arch-rose-200) 0%, var(--arch-rose-400) 100%);
}
.robin-arch-sub:nth-child(2) .robin-arch-plate--sub {
	--edge: var(--arch-rose-700);
	background: linear-gradient(135deg, var(--arch-red-600) 0%, var(--arch-rose-500) 100%);
}
.robin-arch-sub:nth-child(3) .robin-arch-plate--sub {
	--edge: var(--arch-rose-800);
	background: linear-gradient(135deg, var(--arch-red-650) 0%, var(--arch-rose-700) 100%);
}

/* Нижний слой — ИТ-инфраструктура: тёмная плита (ink) с сеткой. */
.robin-arch-plate--base {
	--rim: rgba(255, 255, 255, 0.08);
	--edge: #060A14;
	--drop: rgba(14, 21, 38, 0.28);
	background:
		repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px calc(var(--w) / 6)),
		repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px calc(var(--w) / 6)),
		linear-gradient(135deg, #1B2440 0%, var(--robin-text) 100%);
}

/* Скобка «Платформа ROBIN» слева от разложенных компонентов. */
.robin-arch-bracket {
	position: absolute;
	left: calc(var(--cx) - var(--half) - 28px);
	top: 50%;
	z-index: 5;
	opacity: var(--b);
}
.robin-arch-bracket::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(-74 * var(--u));
	width: 8px;
	height: calc(148 * var(--u));
	border: 1px solid var(--arch-rose-200);
	border-right: 0;
	border-radius: 4px 0 0 4px;
	transform: scaleY(var(--b));
}
.robin-arch-bracket span {
	position: absolute;
	right: 10px;
	top: 0;
	transform: translateY(-50%) rotate(180deg);
	writing-mode: vertical-rl;
	white-space: nowrap;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--robin-accent);
}

/* --- Подписи и выноски --------------------------------------------------- */
.robin-arch-labels {
	position: absolute;
	inset: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	pointer-events: none;
}
.robin-arch-label {
	--y: 0px;
	position: absolute;
	left: calc(var(--cx) + var(--half) + 4px);
	right: 0;
	top: 50%;
	padding-left: 64px;
	/* 12px — половина строки заголовка: центр заголовка = центр слоя. */
	transform: translateY(calc(var(--y) - 12px));
	will-change: transform;
	pointer-events: auto;
}
/* Верхний слой: описание над заголовком, чтобы подписи расходились от
   центра, а не наезжали на компоненты платформы. */
.robin-arch-label--top {
	--y: calc(-1 * var(--gap));
	top: auto;
	bottom: 50%;
	display: flex;
	flex-direction: column-reverse;
	transform: translateY(calc(var(--y) + 12px));
}
.robin-arch-label--base {
	--y: var(--gap);
}

.robin-arch-title {
	position: relative;
	margin: 0;
}
.robin-arch-toggle {
	appearance: none;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
	color: #0F172A;
	text-align: left;
	cursor: default;
}

/* Выноска: линия от угла плиты до текста + точка на углу плиты. */
.robin-arch-title::before,
.robin-arch-sublabel::before {
	content: "";
	position: absolute;
	right: calc(100% + 12px);
	top: 12px;
	width: 52px;
	height: 1px;
	background: var(--arch-callout);
}
.robin-arch-title::after,
.robin-arch-sublabel::after {
	content: "";
	position: absolute;
	right: calc(100% + 60px);
	top: 9px;
	width: 7px;
	height: 7px;
	border-radius: 9999px;
	background: var(--dot, #9F9F9F);
	box-shadow: 0 0 0 3px #FFFFFF;
}
.robin-arch-label--mid { --dot: var(--robin-accent); }
.robin-arch-label--base { --dot: var(--robin-text); }

/* Заголовок платформы полностью гаснет (b = .25) до того, как на его
   месте проявится подпись ROBIN Orchestrator — без наложения текста. */
.robin-arch-label--mid > .robin-arch-title {
	opacity: calc(1 - var(--b) * 4);
}
.robin-arch-label--top .robin-arch-desc-wrap,
.robin-arch-label--base .robin-arch-desc-wrap {
	opacity: calc(var(--a) * 2 - 1);
}
.robin-arch-label--top .robin-arch-desc-wrap { margin-bottom: 12px; }
.robin-arch-label--base .robin-arch-desc-wrap { margin-top: 12px; }

.robin-arch-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	max-width: 440px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.robin-arch-chip {
	padding: 4px 10px;
	border-radius: 9999px;
	background: #FFFFFF;
	color: #717171;
	box-shadow: inset 0 0 0 1px var(--arch-line);
	font-size: 12px;
	line-height: 16px;
}
.robin-arch-chip--dark {
	background: var(--robin-text);
	box-shadow: none;
	color: #FFFFFF;
}

/* Компоненты платформы: на десктопе — каждый на уровне своей плиты. */
.robin-arch-subs {
	margin: 0;
	padding: 0;
	list-style: none;
}
.robin-arch-sublabel {
	--o: clamp(0, calc((var(--b) - 0.25 - var(--i) * 0.12) / 0.35), 1);
	position: absolute;
	left: 64px;
	right: 0;
	top: 0;
	opacity: var(--o);
	transform: translate(calc((1 - var(--o)) * 12px), calc((var(--i) - 1) * var(--sub-step)));
	--dot: var(--robin-accent);
}
.robin-arch-sublabel-product {
	display: block;
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
	color: #0F172A;
}
.robin-arch-sublabel-name {
	display: block;
	font-size: 14px;
	line-height: 20px;
	color: #9F9F9F;
}

/* --- Десктоп со scrollytelling (класс .is-scrolly ставит JS) ------------- */
@media (min-width: 768px) {
	/* Сцена не растягивается на всё окно, а равна холсту (+ заголовок над
	   ним на < 1024px) с полями по 48px — меньше пустого фона сверху/снизу.
	   --arch-u повторяет --u из .robin-arch-stage. Прилипает по центру окна
	   под шапкой; трек = сцена + прежняя дистанция прокрутки (20vh + 64px). */
	.robin-arch.is-scrolly {
		--arch-u: min(1px, calc((100vh - 64px) / 720), calc(100vw / 1180));
		--arch-head: 72px;
		--arch-h: min(calc(100vh - 64px), calc(432 * var(--arch-u) + 260px + var(--arch-head) + 96px));
	}
	.robin-arch.is-scrolly .robin-arch-track {
		height: calc(var(--arch-h) + 20vh + 64px);
	}
	.robin-arch.is-scrolly .robin-arch-sticky {
		position: sticky;
		top: calc(64px + (100vh - 64px - var(--arch-h)) / 2);
		display: flex;
		align-items: center;
		height: var(--arch-h);
		padding: 0;
	}
	.robin-arch.is-scrolly .robin-arch-stage {
		flex: 1;
	}
}
@media (min-width: 1024px) {
	.robin-arch.is-scrolly {
		--arch-head: 0px;
	}
}

/* --- Мобильные: статичная схема + аккордеон подписей --------------------- */
@media (max-width: 767px) {
	.robin-arch-sticky {
		padding: 48px 0;
	}
	.robin-arch-stage {
		--p: 1 !important;
		--u: 0.5px;
		--cx: 50%;
	}
	.robin-arch-canvas {
		height: auto;
	}
	.robin-arch-visual {
		position: relative;
		height: calc(660 * var(--u));
	}
	.robin-arch-labels {
		position: static;
		margin-top: 24px;
		border-top: 1px solid var(--arch-line);
	}
	.robin-arch-label,
	.robin-arch-label--top {
		position: static;
		display: block;
		padding: 0;
		transform: none;
		border-bottom: 1px solid var(--arch-line);
	}
	.robin-arch-title::before,
	.robin-arch-title::after,
	.robin-arch-sublabel::after {
		content: none;
	}
	.robin-arch-toggle {
		position: relative;
		padding: 16px 32px 16px 0;
		cursor: pointer;
	}
	.robin-arch-toggle:focus-visible {
		outline: 2px solid var(--robin-accent);
		outline-offset: 2px;
		border-radius: 4px;
	}
	/* Шеврон аккордеона. */
	.robin-arch-toggle::after {
		content: "";
		position: absolute;
		right: 6px;
		top: 50%;
		width: 8px;
		height: 8px;
		border-right: 1.5px solid currentColor;
		border-bottom: 1.5px solid currentColor;
		transform: translateY(-70%) rotate(45deg);
		transition: transform .25s ease;
	}
	.robin-arch-label.is-open .robin-arch-toggle::after {
		transform: translateY(-30%) rotate(-135deg);
	}
	.robin-arch-label--mid > .robin-arch-title,
	.robin-arch-label--top .robin-arch-desc-wrap,
	.robin-arch-label--base .robin-arch-desc-wrap {
		opacity: 1;
		margin: 0;
	}
	/* Аккордеон сворачивается только когда JS готов его открывать —
	   без JS описания просто видны. */
	.robin-arch-desc-wrap {
		display: grid;
		grid-template-rows: 1fr;
		transition: grid-template-rows .25s ease;
	}
	.robin-arch.is-ready .robin-arch-label:not(.is-open) .robin-arch-desc-wrap {
		grid-template-rows: 0fr;
	}
	.robin-arch-desc {
		min-height: 0;
		overflow: hidden;
	}
	.robin-arch-desc > * {
		margin-bottom: 16px;
	}
	.robin-arch-sublabel {
		position: relative;
		left: auto;
		padding: 6px 0 6px 14px;
		opacity: 1;
		transform: none;
	}
	/* Вместо выноски — бренд-полоска слева у компонента. */
	.robin-arch-sublabel::before {
		right: auto;
		left: 0;
		top: 8px;
		bottom: 8px;
		width: 2px;
		height: auto;
		border-radius: 2px;
		background: var(--robin-accent);
	}
}

@media (prefers-reduced-motion: reduce) {
	.robin-arch .robin-arch-track {
		height: auto !important;
	}
	.robin-arch .robin-arch-sticky {
		position: static !important;
		height: auto !important;
		padding: 56px 0 !important;
	}
	.robin-arch-stage {
		--p: 1 !important;
	}
	.robin-arch-desc-wrap,
	.robin-arch-toggle::after {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   Hero «Платформа ROBIN» (page-platform.php, .robin-hero-*) — композиция
   по мотивам delphi.ai (DESIGN (5).md): заголовок по центру, «ядро» снизу
   (частично скрытая сфера) и тонкие орбиты чипов вокруг него. Взята только
   композиция/приём движения оригинала — палитра своя, ROBIN
   (белый/#F6F3F1/#717171/rose-600 через var(--robin-accent)), а не
   парчмент/chestnut источника.

   Геометрия «полукруга-орбиты»: у .robin-hero-ring/.robin-hero-orbit
   transform: translate(-50%, 50%) ставит центр окружности точно на нижний
   край .robin-hero-orbits; контейнер обрезает низ (overflow-y hidden) —
   видна только верхняя дуга, без ручного arc-path.

   Вращение чипа: .robin-hero-orbit-spin крутит саму орбиту (двигает чип
   по дуге); .robin-hero-chip-pos крутится в противофазе — те же
   унаследованные --dur/--start, но animation-direction развёрнут
   относительно родителя, поэтому текст чипа остаётся прямо. Сам
   .robin-hero-chip анимацией не занят — его transform свободен для
   hover-увеличения (иначе конфликтовал бы с transform от keyframes).

   Фаза старта каждого чипа — через отрицательный animation-delay
   (--start в градусах: delay = dur * start / -360), не через отдельные
   keyframes на чип. Направление — класс .robin-hero-orbit--rev меняет
   animation-direction, те же keyframes на оба варианта.

   Пауза + увеличение при наведении — :has() на .robin-hero-chip:hover,
   без JS. На мобильных (≤640px) орбиты выключаются, чипы превращаются
   в статичное облако тегов (та же разметка, без дублирования контента).
   -------------------------------------------------------------------------- */
.robin-hero-orbits {
	height: clamp(240px, 32vw, 380px);
	overflow: hidden;
	/* Мягкое угасание у верхнего края контейнера — без него glow
	   центрального «ядра» обрезался бы overflow: hidden жёсткой прямой
	   линией вместо плавного затухания. */
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 40px, #000 100%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 40px, #000 100%);
}
.robin-hero-ring,
.robin-hero-orbit {
	position: absolute;
	left: 50%;
	bottom: 0;
	aspect-ratio: 1 / 1;
	/* Тот же translateY, что у .robin-hero-core (25% = видно 3/4 круга) —
	   кольца и орбиты чипов концентричны центральному «ядру», просто с
	   бОльшим диаметром (тот же шаг между sm/md/lg, что и раньше). */
	transform: translate(-50%, 25%);
	border-radius: 9999px;
	pointer-events: none;
}
.robin-hero-ring {
	border: 1px solid #F6F3F1;
}
/* Hero во фрейме-карточке (bg #F6F3F1): кольца и обводка чипов того же
   цвета, что фон, пропали бы — делаем их на тон темнее. */
.robin-hero-card .robin-hero-ring,
.robin-hero-card .robin-hero-chip {
	border-color: #E8E1DB;
}
.robin-hero-ring--sm,
.robin-hero-orbit--sm { width: clamp(260px, 34vw, 340px); }
.robin-hero-ring--md,
.robin-hero-orbit--md { width: clamp(360px, 46vw, 460px); }
.robin-hero-ring--lg,
.robin-hero-orbit--lg { width: clamp(460px, 58vw, 600px); }

.robin-hero-core {
	position: absolute;
	left: 50%;
	bottom: 0;
	width: clamp(300px, 40vw, 420px);
	aspect-ratio: 1 / 1;
	/* 25% вместо 50% translateY — вниз уходит только четверть круга,
	   видно 3/4 диаметра, а не ровно половину. */
	transform: translate(-50%, 25%);
	border-radius: 9999px;
	background: radial-gradient(circle at 50% 22%, #ff4a3d 0%, #c81f1a 45%, #4a0908 100%);
	box-shadow: 0 -36px 80px -16px rgba(200, 31, 26, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.22);
	pointer-events: none;
}
.robin-hero-core-mascot {
	position: absolute;
	left: 50%;
	top: 10%;
	width: 82%;
	transform: translate(-50%, 0);
}
.robin-hero-core-mascot img {
	display: block;
	width: 100%;
	height: auto;
}

.robin-hero-orbit-spin {
	position: absolute;
	inset: 0;
	animation: robin-hero-orbit-spin var(--dur) linear infinite;
	animation-delay: calc(var(--dur) * var(--start) / -360);
}
.robin-hero-orbit--rev .robin-hero-orbit-spin {
	animation-direction: reverse;
}
.robin-hero-chip-pos {
	position: absolute;
	top: 0;
	left: 50%;
	animation: robin-hero-orbit-counter var(--dur) linear infinite reverse;
	animation-delay: calc(var(--dur) * var(--start) / -360);
	pointer-events: auto;
}
.robin-hero-orbit--rev .robin-hero-chip-pos {
	animation-direction: normal;
}
@keyframes robin-hero-orbit-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}
@keyframes robin-hero-orbit-counter {
	from { transform: translate(-50%, -50%) rotate(0deg); }
	to   { transform: translate(-50%, -50%) rotate(360deg); }
}

.robin-hero-chip {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	padding: 8px 14px 8px 10px;
	border-radius: 9999px;
	background: #ffffff;
	border: 1px solid #F6F3F1;
	box-shadow: 0 8px 20px -14px rgba(17, 24, 39, 0.35);
	font-size: 12.5px;
	font-weight: 500;
	color: #717171;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.robin-hero-chip-icon {
	display: flex;
	color: var(--robin-accent);
}
.robin-hero-chip-icon svg { width: 15px; height: 15px; }

.robin-hero-orbit:has(.robin-hero-chip:hover) .robin-hero-orbit-spin,
.robin-hero-orbit:has(.robin-hero-chip:hover) .robin-hero-chip-pos {
	animation-play-state: paused;
}
.robin-hero-chip:hover {
	transform: scale(1.08);
	box-shadow: 0 14px 28px -14px rgba(17, 24, 39, 0.4);
	z-index: 5;
}

@media (max-width: 640px) {
	.robin-hero-orbits {
		height: auto;
		overflow: visible;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 8px;
		padding: 4px 0 8px;
	}
	.robin-hero-ring,
	.robin-hero-core { display: none; }
	.robin-hero-orbit,
	.robin-hero-orbit-spin,
	.robin-hero-chip-pos {
		position: static;
		width: auto;
		aspect-ratio: auto;
		transform: none;
		animation: none;
	}
	.robin-hero-chip { font-size: 12px; padding: 7px 12px 7px 9px; }
	.robin-hero-card { padding-bottom: 24px; }
}

@media (prefers-reduced-motion: reduce) {
	.robin-hero-orbit-spin,
	.robin-hero-chip-pos {
		animation: none;
	}
}

/* --------------------------------------------------------------------------
   Блок «Искусственный интеллект в ROBIN» (page-platform.php, #ai) — те же
   карточки .rcm-caps, что у «Преимущества наших AI-агентов…»
   (page-ai-communications.php). Дополнения: широкая карточка OCR на всю
   строку (схема слева + пример из 3 шагов справа) и рамка распознавания
   на мини-схеме скана.
   -------------------------------------------------------------------------- */
.rcm-caps-card--wide { grid-column: 1 / -1; }
.rcm-caps-wide-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px;
	align-items: start;
}
.rcm-caps-wide-main { display: flex; flex-direction: column; gap: 20px; }
.rcm-caps-wide-main .rcm-caps-art { max-width: 400px; margin-top: 0; }
.rcm-caps .rcm-caps-steps-label {
	margin: 0 0 4px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}
.rcm-caps-steps ol { margin: 0; padding: 0; list-style: none; }
.rcm-caps-steps li {
	display: flex;
	gap: 16px;
	padding: 16px 0;
	border-bottom: 1px solid var(--rcm-ash);
}
.rcm-caps-steps li:last-child { border-bottom: 0; padding-bottom: 0; }
.rcm-caps-steps .rcm-caps-num {
	flex: none;
	padding-top: 3px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.03em;
}
.rcm-caps .rcm-caps-steps li p {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
.rcm-caps-scan {
	fill: rgba(197, 34, 41, 0.06);
	stroke: var(--rcm-result);
	stroke-width: 1.2;
	stroke-dasharray: 4 3;
	animation: rcm-caps-scan 3.2s ease-in-out infinite alternate;
}
@keyframes rcm-caps-scan { to { transform: translateY(46px); } }
@media (prefers-reduced-motion: reduce) {
	.rcm-caps-scan { animation: none; }
}
@media (max-width: 1023px) {
	.rcm-caps-wide-body { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 639px) {
	.rcm-caps .rcm-caps-steps li p { font-size: 14px; }
}

/* --------------------------------------------------------------------------
   Блок «Подбор сценария» (page-platform.php, .robin-pick, внизу страницы) —
   в стилистике «Искусственный интеллект в ROBIN» (.rcm-caps): пергамент,
   рамка Ash без теней, моно-подписи капсом, нумерация 01/02 бордовым,
   заголовок основным шрифтом с акцентным словом. Чипы, шаги и стек
   рисует assets/js/robin-platform.js — классы .robin-pick-chip/-step/-tech.
   -------------------------------------------------------------------------- */
.robin-pick {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result: #c52229;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	color: var(--rcm-ink);
}
.robin-pick-eyebrow,
.robin-pick-meta,
.robin-pick-label,
.robin-pick-unit,
.robin-pick-ctx {
	font-family: var(--rcm-mono);
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}
.robin-pick-eyebrow { display: inline-block; color: var(--rcm-accent); }
.robin-pick-head {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	align-items: end;
	gap: 16px 48px;
}
.robin-pick .robin-pick-title {
	max-width: 46rem;
	margin: 12px 0 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 38px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rcm-ink);
}
.robin-pick-title em { font-style: normal; color: var(--rcm-accent); }
.robin-pick .robin-pick-lead {
	max-width: 42rem;
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}

/* Карточка виджета — белая на пергаментном фрейме (как карточки кейсов) */
.robin-pick-card {
	margin-top: 32px;
	overflow: hidden;
	border: 1px solid var(--rcm-ash);
	border-radius: 24px;
	background: #fff;
}
/* Шаги 01/02: подпись слева, пилюли справа — одной строкой */
.robin-pick-row {
	display: grid;
	grid-template-columns: 170px minmax(0, 1fr);
	align-items: start;
	gap: 8px 16px;
	padding: 16px 28px;
	border-bottom: 1px solid var(--rcm-ash);
}
.robin-pick-meta { display: flex; gap: 10px; padding-top: 10px; }
.robin-pick-num { color: var(--rcm-accent); }
.robin-pick-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.robin-pick-chip {
	position: relative;
	overflow: hidden;
	padding: 7px 15px;
	border: 1px solid var(--rcm-ash);
	border-radius: 9999px;
	background: #fbfaf9;
	font-size: 14px;
	line-height: 1.3;
	letter-spacing: -0.02em;
	color: var(--rcm-graphite);
	transition: border-color .2s ease, color .2s ease, background-color .2s ease;
}
.robin-pick-chip:hover { border-color: var(--rcm-result-soft); color: var(--rcm-ink); }
/* Отдел — залит бордовым; задача — как hub-узел схем (рамка акцента) */
.robin-pick-chip.is-active,
.robin-pick-chip.is-active:hover { border-color: var(--rcm-accent); background: var(--rcm-accent); color: #fff; }
.robin-pick-chip.is-selected,
.robin-pick-chip.is-selected:hover { border-color: var(--rcm-accent); color: var(--rcm-accent); }
/* Автопереключение: полоска-таймер снизу выбранной задачи
   (класс .is-running ставит robin-platform.js, длительность — --pick-auto) */
.robin-pick-chip.is-running::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: var(--rcm-accent);
	transform: scaleX(0);
	transform-origin: left center;
	animation: robin-pick-timer var(--pick-auto, 5s) linear forwards;
}
@keyframes robin-pick-timer { to { transform: scaleX(1); } }
/* Смена сценария — кроссфейд названия и метрики (element.animate в robin-platform.js) */
.robin-pick-metric-card { transition: border-color .2s ease; }

/* Результат */
.robin-pick-result {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: 24px;
	padding: 20px 28px 24px;
}
.robin-pick .robin-pick-name {
	margin: 8px 0 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
/* Шаги — как .rcm-caps-steps: моно-номер, разделители Ash */
.robin-pick-steps { margin: 8px 0 0; padding: 0; list-style: none; }
.robin-pick-step {
	display: flex;
	gap: 16px;
	padding: 8px 0;
	border-bottom: 1px solid var(--rcm-ash);
	transition: opacity .3s ease, transform .3s ease;
}
.robin-pick-step:last-child { border-bottom: 0; }
.robin-pick-step .robin-pick-num {
	flex: none;
	padding-top: 3px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.03em;
}
.robin-pick-step-text {
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
/* Стек — как chip-узлы мини-схем */
.robin-pick-stack { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.robin-pick-tech {
	padding: 5px 12px;
	border: 1px dashed var(--rcm-ash);
	border-radius: 9999px;
	background: #fbfaf9;
	font-family: var(--rcm-mono);
	font-size: 11px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rcm-graphite);
}
.robin-pick-metric-card {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 16px;
	padding: 22px 24px;
	border: 1px solid var(--rcm-ash);
	border-radius: 18px;
	background: var(--rcm-parchment);
}
.robin-pick-metric-card:hover { border-color: var(--rcm-result-soft); }
.robin-pick-label--accent { color: var(--rcm-accent); }
.robin-pick-metric {
	margin-top: 12px;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 40px;
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--rcm-result);
}
.robin-pick-unit { margin-top: 6px; }
.robin-pick .robin-pick-note {
	margin: 12px 0 0;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
.robin-pick-case { padding-top: 12px; border-top: 1px solid var(--rcm-ash); }
.robin-pick-case-name {
	margin-top: 6px;
	font-size: 15px;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}

/* Заявка */
.robin-pick-form { padding: 20px 28px; border-top: 1px solid var(--rcm-ash); background: var(--rcm-parchment); }
.robin-pick .robin-pick-form-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 20px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.robin-pick .robin-pick-form-text {
	margin: 4px 0 0;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
.robin-pick .robin-pick-ctx { margin: 0; }
.robin-pick-input {
	padding: 11px 18px;
	border: 1px solid var(--rcm-ash);
	border-radius: 9999px;
	background: #fff;
	font-size: 14px;
	color: var(--rcm-ink);
	outline: none;
	transition: border-color .2s ease;
}
.robin-pick-input::placeholder { color: var(--rcm-smoke); }
.robin-pick-input:focus { border-color: var(--rcm-accent); }
.robin-pick-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: 12px;
	font-size: 12px;
	line-height: 1.5;
	color: var(--rcm-smoke);
}
.robin-pick-consent input { flex: none; width: 14px; height: 14px; margin-top: 2px; accent-color: var(--rcm-accent); }
.robin-pick-consent a { text-decoration: underline; text-underline-offset: 2px; }
.robin-pick-consent a:hover { color: var(--rcm-accent); }

/* Факты — моно-подписи под верхней линейкой Ash */
.robin-pick-facts {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin-top: 28px;
}
.robin-pick-facts > div { padding-top: 12px; border-top: 1px solid var(--rcm-ash); }
.robin-pick-fact-num {
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.robin-pick-fact-text {
	margin-top: 6px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	line-height: 1.35;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}

@media (max-width: 1023px) {
	.robin-pick-head { grid-template-columns: minmax(0, 1fr); }
	.robin-pick .robin-pick-title { font-size: 34px; }
	.robin-pick-card { margin-top: 28px; }
	.robin-pick-row { grid-template-columns: minmax(0, 1fr); }
	.robin-pick-meta { padding-top: 0; }
	.robin-pick-result { grid-template-columns: minmax(0, 1fr); }
	.robin-pick-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
	.robin-pick .robin-pick-title { font-size: 30px; line-height: 1.12; }
	.robin-pick .robin-pick-lead { font-size: 15px; }
	.robin-pick-card { margin-top: 24px; border-radius: 20px; }
	.robin-pick-row, .robin-pick-result, .robin-pick-form { padding-left: 18px; padding-right: 18px; }
	.robin-pick-metric-card { padding: 20px 18px; }
	.robin-pick-metric { font-size: 36px; }
	.robin-pick .robin-pick-name { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
	.robin-pick-chip.is-running::after { display: none; }
}

/* Вариант .robin-pick для заявки (page-corporate-assistants.php, #lead-form):
   слева пункты — как шаги робота, справа форма плагина [robin_lead_form]
   без собственной карточки (её роль играет .robin-pick-card). Перекраска
   полей формы — общие правила :is(.rcm-lead, .robin-pick-leadform) ниже. */
.robin-pick--lead { --rcm-line: #edebe9; }
.robin-pick--lead .robin-pick-result { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 0; padding: 0; }
.robin-pick--lead .robin-pick-result > div:first-child { padding: 24px 28px; }
.robin-pick-leadform { padding: 24px 28px; border-left: 1px solid var(--rcm-ash); }
.robin-pick-step--lg .robin-pick-step-text { font-size: 15px; color: var(--rcm-ink); }
.robin-pick-step--lg { padding: 14px 0; }
.robin-pick-leadform .robin-lead .robin-lead__wrap {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}
@media (max-width: 1023px) {
	.robin-pick-leadform { border-left: 0; border-top: 1px solid var(--rcm-ash); }
}
@media (max-width: 639px) {
	.robin-pick--lead .robin-pick-result > div:first-child,
	.robin-pick-leadform { padding: 20px 18px; }
}

/* --------------------------------------------------------------------------
   «Архитектура платформы ROBIN» — схема-хаб (page-platform.php, .robin-archmap)
   в стилистике «Делегируйте задачи ROBIN» (front-page.php, #delegate).
   Единственная анимация — «бегущие муравьи» по контуру пилюли; на паузе,
   пока блок не попал во вьюпорт ([data-tech-illust].is-inview,
   robin-platform-tech.js).
   -------------------------------------------------------------------------- */
.robin-archmap-march {
	animation: robin-archmap-march .7s linear infinite;
	animation-play-state: paused;
}
.robin-archmap.is-inview .robin-archmap-march { animation-play-state: running; }
@keyframes robin-archmap-march { to { stroke-dashoffset: -8; } }

/* Картинки в плитках плавно покачиваются, каждая со своей фазой
   (отрицательный animation-delay из разметки). Анимируются отдельные
   свойства translate/rotate — не конфликтуют с transform: scale у
   group-hover:scale-110. */
.robin-archmap-bird {
	animation: robin-archmap-sway 5.4s ease-in-out infinite;
	animation-play-state: paused;
}
.robin-archmap.is-inview .robin-archmap-bird { animation-play-state: running; }
@keyframes robin-archmap-sway {
	0%, 100% { translate: 0 0;      rotate: 0deg; }
	25%      { translate: 0 -2px;   rotate: -3deg; }
	50%      { translate: 0 -3.5px; rotate: 0deg; }
	75%      { translate: 0 -1.5px; rotate: 3deg; }
}
@media (prefers-reduced-motion: reduce) {
	.robin-archmap-march, .robin-archmap-bird { animation: none; }
}

/* --------------------------------------------------------------------------
   Блок «Обсудим AI-агентов для ваших коммуникаций» (page-ai-communications.php,
   #lead-form). Тот же язык, что у .rcm-pains/.rcm-caps/.rcm-domains:
   пергаментная панель с рамкой Ash без тени, serif-заголовок 45px с
   акцентом, пункты — hairline-список с номерами. Форма плагина
   [robin_lead_form] приведена к палитре страницы ТОЛЬКО внутри .rcm-lead:
   убраны её собственные фон секции, отступы 56px и карточка с тенью —
   теперь это одна белая карточка с рамкой Ash, как поля на остальной
   странице.
   -------------------------------------------------------------------------- */
.rcm-lead {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-line: #edebe9;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px 56px;
	padding: 56px;
	border: 1px solid var(--rcm-ash);
	border-radius: 32px;
	background: var(--rcm-parchment);
	color: var(--rcm-ink);
}
.rcm-lead-head {
	align-self: start;
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.rcm-lead .rcm-lead-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rcm-ink);
}
.rcm-lead-title em {
	font-style: normal;
	white-space: nowrap;
	color: var(--rcm-accent);
}
.rcm-lead .rcm-lead-text {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.023em;
	color: var(--rcm-graphite);
}
.rcm-lead-list {
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--rcm-ash);
}
.rcm-lead-list li {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	gap: 12px;
	padding: 18px 0;
	border-bottom: 1px solid var(--rcm-ash);
	font-size: 15px;
	line-height: 1.45;
	letter-spacing: -0.023em;
	color: var(--rcm-ink);
}
.rcm-lead-num {
	padding-top: 3px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--rcm-accent);
}

/* --- Форма плагина внутри блока --- */
:is(.rcm-lead, .robin-pick-leadform) .robin-lead {
	--robin-accent: var(--rcm-accent);
	--robin-accent-2: var(--rcm-accent);
	--robin-text: var(--rcm-ink);
	--robin-muted: var(--rcm-smoke);
	padding: 0;
	background: transparent;
	color: var(--rcm-ink);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__wrap {
	max-width: none;
	padding: 36px;
	border: 1px solid var(--rcm-ash);
	border-radius: 24px;
	background: #fff;
	box-shadow: none;
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__head { margin-bottom: 24px; text-align: left; }
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__title {
	margin: 0 0 8px;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__subtitle {
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: -0.02em;
	color: var(--rcm-graphite);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__progress { height: 4px; background: var(--rcm-line); }
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__progress-bar { background: var(--rcm-accent); }
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__step-label {
	margin-bottom: 20px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__legend {
	margin-bottom: 16px;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 20px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__cards { gap: 10px; }
:is(.rcm-lead, .robin-pick-leadform) .robin-card {
	padding: 16px 20px;
	border: 1px solid var(--rcm-ash);
	border-radius: 16px;
	background: var(--rcm-parchment);
	transition: border-color .2s ease, background-color .2s ease;
}
:is(.rcm-lead, .robin-pick-leadform) .robin-card:hover { border-color: var(--rcm-result-soft); }
:is(.rcm-lead, .robin-pick-leadform) .robin-card.is-selected {
	border-color: var(--rcm-accent);
	background: #fff;
	box-shadow: none;
}
:is(.rcm-lead, .robin-pick-leadform) .robin-card:focus-visible { box-shadow: 0 0 0 3px rgba(163, 12, 51, 0.2); }
:is(.rcm-lead, .robin-pick-leadform) .robin-card__title {
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-card__desc {
	font-size: 13px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--rcm-smoke);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-field__label {
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--rcm-graphite);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-req { color: var(--rcm-accent); }
:is(.rcm-lead, .robin-pick-leadform) .robin-field__input {
	padding: 12px 16px;
	border: 1px solid var(--rcm-ash);
	border-radius: 12px;
	background: #fff;
	font-size: 15px;
	color: var(--rcm-ink);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-field__input::placeholder { color: #9f9f9f; }
:is(.rcm-lead, .robin-pick-leadform) .robin-field__input:focus {
	border-color: var(--rcm-accent);
	box-shadow: 0 0 0 3px rgba(163, 12, 51, 0.12);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-consent {
	font-size: 13px;
	line-height: 1.45;
	color: var(--rcm-graphite);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-consent input { accent-color: var(--rcm-accent); }
:is(.rcm-lead, .robin-pick-leadform) .robin-consent a { color: var(--rcm-accent); text-decoration: underline; text-underline-offset: 2px; }
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__nav { margin-top: 24px; }
:is(.rcm-lead, .robin-pick-leadform) .robin-lead .robin-btn {
	padding: 12px 24px;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap;
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead .robin-btn.robin-btn--ghost {
	border: 1px solid var(--rcm-ash);
	color: var(--rcm-graphite);
}
:is(.rcm-lead, .robin-pick-leadform) .robin-lead .robin-btn.robin-btn--ghost:hover { border-color: var(--rcm-graphite); color: var(--rcm-ink); }
/* В плагине display:inline-flex у .robin-btn перебивает атрибут hidden —
   на шаге 1 были видны «Назад» и «Отправить заявку». */
:is(.rcm-lead, .robin-pick-leadform) .robin-lead .robin-btn[hidden] { display: none; }
:is(.rcm-lead, .robin-pick-leadform) .robin-lead__success-icon {
	background: rgba(163, 12, 51, 0.08);
	color: var(--rcm-accent);
}

@media (max-width: 1023px) {
	.rcm-lead { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 40px 32px; border-radius: 24px; }
	.rcm-lead .rcm-lead-title { font-size: 36px; }
}
@media (max-width: 639px) {
	.rcm-lead { padding: 28px 16px; border-radius: 20px; }
	.rcm-lead .rcm-lead-title { font-size: 30px; line-height: 1.12; }
	.rcm-lead .rcm-lead-text,
	.rcm-lead-list li { font-size: 14px; }
	.rcm-lead .robin-lead__wrap { padding: 24px 20px; border-radius: 20px; }
}

/* --------------------------------------------------------------------------
   Блок «Смотрите также» (page-ai-communications.php). Язык .rcm-caps-card:
   пергамент, рамка Ash без тени, моно-метка с акцентным номером,
   serif-заголовок; на hover рамка розовеет, стрелка уходит вправо-вверх.
   -------------------------------------------------------------------------- */
.rcm-related {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-ink: #242424;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin-bottom: 0;
	padding: 0;
	list-style: none;
}
.rcm-related > li { display: flex; }
.rcm-related-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
	min-height: 168px;
	padding: 24px;
	border: 1px solid var(--rcm-ash);
	border-radius: 24px;
	background: var(--rcm-parchment);
	color: var(--rcm-ink);
	text-decoration: none;
	transition: border-color .2s ease;
}
.rcm-related-card:hover { border-color: var(--rcm-result-soft); }
.rcm-related-card:focus-visible { outline: 2px solid var(--rcm-accent); outline-offset: 3px; }
.rcm-related-meta {
	display: flex;
	gap: 10px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}
.rcm-related-num { color: var(--rcm-accent); }
.rcm-related-title {
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.rcm-related-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin-top: auto;
	border: 1px solid var(--rcm-ash);
	border-radius: 999px;
	color: var(--rcm-accent);
	transition: transform .2s ease, border-color .2s ease;
}
.rcm-related-card:hover .rcm-related-arrow { border-color: var(--rcm-result-soft); transform: translateX(3px); }
@media (max-width: 1023px) {
	.rcm-related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
	.rcm-related { grid-template-columns: minmax(0, 1fr); }
	.rcm-related-card { min-height: 0; padding: 20px; border-radius: 20px; }
	.rcm-related-title { font-size: 20px; }
}

/* --------------------------------------------------------------------------
   Hero-инфографика /platform/ «Платформа ROBIN ↔ участники процессов»
   (page-platform.php, [data-rpm]; SVG строит assets/js/robin-platform-mesh.js).
   Визуальный язык — как у .rcm-flow (DESIGN.md / Monad): пергамент, линии Ash,
   моно для подписей. Семантика цвета пакетов: серый — из платформы
   (запрос, данные, параметры), красный #C52229 — в платформу (ответ, документ,
   запись, текст). Бордовый ROBIN #a30c33 — окно платформы и иконки участников.
   -------------------------------------------------------------------------- */
.rpm {
	--rpm-parchment: #f6f3f1;
	--rpm-paper: #fbfaf9;
	--rpm-ash: #cecac8;
	--rpm-ash-soft: #e0dcda;
	--rpm-ink: #242424;
	--rpm-graphite: #4e4d4d;
	--rpm-smoke: #797776;
	--rpm-accent: #a30c33;
	--rpm-result: #c52229;
	--rpm-result-soft: #eab0b2;
	--rpm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	position: relative;
	margin: 0;
	font-family: var(--rpm-mono);
	color: var(--rpm-ink);
}
.rpm-stage { position: relative; width: 100%; }
.rpm-svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
	-webkit-tap-highlight-color: transparent;
}
.rpm-svg--narrow { max-width: 460px; margin: 0 auto; }
.rpm-svg text { font-family: var(--rpm-mono); }

/* без JS — простой список участников */
.rpm-fallback {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	line-height: 1.5;
	color: var(--rpm-graphite);
}
.rpm-fallback b { color: var(--rpm-ink); font-weight: 500; }
.rpm-fallback-hub { color: var(--rpm-accent); letter-spacing: 0.08em; text-transform: uppercase; font-size: 11px; }
.rpm.is-ready .rpm-fallback { display: none; }

/* лучи */
.rpm-line {
	fill: none;
	stroke: var(--rpm-ash);
	stroke-width: 1.1;
	transition: stroke 0.3s, opacity 0.3s, stroke-width 0.3s;
}
.rpm-line--x { stroke: var(--rpm-ash-soft); }
.rpm.is-focus .rpm-line { opacity: 0.22; }
.rpm.is-focus .rpm-line.is-on { opacity: 1; stroke: var(--rpm-result-soft); stroke-width: 1.4; }

/* пакеты */
.rpm-pk rect { fill: var(--rpm-paper); stroke: var(--rpm-ash); stroke-width: 1; }
.rpm-pk text { font-size: 9.5px; letter-spacing: 0.02em; fill: var(--rpm-smoke); }
.rpm-pk--in rect { stroke: var(--rpm-result-soft); }
.rpm-pk--in text { fill: var(--rpm-result); }
.rpm-dot { fill: var(--rpm-smoke); }
.rpm-dot--in { fill: var(--rpm-result); }

/* участники */
.rpm-node,
.rpm-win { cursor: pointer; outline: none; transition: opacity 0.3s; }
.rpm-node.is-dim { opacity: 0.35; }
.rpm-node-bg {
	fill: var(--rpm-paper);
	stroke: var(--rpm-ash);
	stroke-width: 1;
	transition: stroke 0.3s, fill 0.3s;
}
.rpm-node-icon { color: var(--rpm-accent); }
.rpm-node-label { font-size: 13px; letter-spacing: -0.02em; fill: var(--rpm-ink); }
.rpm-node-ring {
	fill: none;
	stroke: var(--rpm-accent);
	stroke-width: 1.2;
	stroke-dasharray: 2 7;
	stroke-linecap: round;
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
	transition: opacity 0.3s;
	animation: rcm-flow-spin 18s linear infinite;
}
.rpm-node-pulse {
	fill: none;
	stroke: var(--rpm-result);
	stroke-width: 1.2;
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
	pointer-events: none;
}
.rpm-node:hover .rpm-node-bg,
.rpm-node:focus-visible .rpm-node-bg,
.rpm-node.is-active .rpm-node-bg { stroke: var(--rpm-accent); fill: #fff; }
.rpm-node:hover .rpm-node-ring,
.rpm-node:focus-visible .rpm-node-ring,
.rpm-node.is-active .rpm-node-ring { opacity: 0.8; }

/* окно платформы */
.rpm-win-kicker { font-size: 10px; letter-spacing: 0.12em; fill: var(--rpm-smoke); }
.rpm-win-body { fill: var(--rpm-paper); }
.rpm-win-bar { fill: #E2E2E1; }
.rpm-win-dot { fill: #9F9F9F; opacity: 0.7; }
.rpm-win-title { font-size: 11px; letter-spacing: 0.14em; fill: #717171; }
.rpm-win-frame { fill: none; stroke: var(--rpm-ash); stroke-width: 1; transition: stroke 0.3s; }
.rpm-win:hover .rpm-win-frame,
.rpm-win:focus-visible .rpm-win-frame,
.rpm-win.is-active .rpm-win-frame { stroke: var(--rpm-accent); stroke-width: 1.4; }

.rpm-msg,
.rpm-avatar,
.rpm-typing {
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.35s ease, transform 0.35s ease;
}
.rpm-msg.is-shown,
.rpm-avatar.is-shown,
.rpm-typing.is-shown { opacity: 1; transform: none; }
.rpm-msg--q rect { fill: var(--rpm-accent); }
.rpm-msg--q text { font-size: 12px; fill: #fff; }
.rpm-msg--a rect { fill: #f6dfe1; }
.rpm-msg--a text { font-size: 12px; fill: var(--rpm-ink); }
.rpm-msg--a .rpm-trail { font-size: 10px; fill: var(--rpm-result); letter-spacing: -0.01em; }
.rpm-avatar circle { fill: #fff; stroke: var(--rpm-ash); stroke-width: 1; }
.rpm-typing rect { fill: #f6dfe1; }
.rpm-typing circle {
	fill: var(--rpm-result);
	opacity: 0.35;
	animation: rpm-typing 1s ease-in-out infinite;
}
@keyframes rpm-typing {
	0%, 100% { opacity: 0.25; }
	40% { opacity: 1; }
}
.rpm-input { fill: #fff; stroke: var(--rpm-ash-soft); stroke-width: 1; }
.rpm-input-text { font-size: 11px; fill: var(--rpm-smoke); }
.rpm-input-send { fill: var(--rpm-accent); }
.rpm-input-send-icon { color: #fff; }
.rpm-shield circle { fill: var(--rpm-parchment); stroke: #717171; stroke-width: 1.5; }
.rpm-shield svg { color: #717171; }

/* панель под схемой: описание + счётчики */
.rpm-panel {
	display: grid;
	gap: 20px;
	margin-top: 12px;
	padding-top: 20px;
	border-top: 1px solid var(--rpm-ash-soft);
}
@media (min-width: 1024px) {
	.rpm-panel { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 40px; align-items: start; }
}
.rpm-info { min-height: 96px; }
.rpm-info-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-size: 18px;
	font-weight: 500;
	color: var(--rpm-ink);
}
.rpm-info-desc {
	margin: 6px 0 0;
	font-family: var(--robin-font-head);
	font-size: 14px;
	line-height: 1.55;
	color: #717171;
}
.rpm-info-hint { margin: 8px 0 0; font-size: 11px; line-height: 1.5; color: var(--rpm-result); }
.rpm-stats-caption { margin: 0 0 10px; font-size: 11px; color: var(--rpm-smoke); }
.rpm-stats-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 640px) {
	.rpm-stats-list { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
.rpm-stats-list li { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rpm-stats-list b {
	font-size: 18px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	letter-spacing: -0.03em;
	color: var(--rpm-ink);
}
.rpm-stats-list span { font-size: 10px; color: var(--rpm-smoke); overflow: hidden; text-overflow: ellipsis; }

@media (prefers-reduced-motion: reduce) {
	.rpm-node-ring,
	.rpm-typing circle { animation: none; }
	.rpm-msg,
	.rpm-avatar,
	.rpm-typing { transition: none; }
}

/* --------------------------------------------------------------------------
   /academy/videos/ (page-academy-videos.php): каталог в палитре раздела
   Академии и страниц /platform/, /corporate-assistants/ — тёплые нейтральные
   рамки (#EFEEED / Ash), бордовый акцент #A30C33 вместо navy #0E1526.
   Только внутри .robin-academy-videos — общий каталог /videos/ не меняется.
   -------------------------------------------------------------------------- */
.robin-academy-videos .rcc-chip { color: #4e4d4d; border-color: #edebe9; }
.robin-academy-videos .rcc-chip:hover { color: #a30c33; border-color: #eab0b2; }
.robin-academy-videos .rcc-chip.is-active { color: #fff; background: #a30c33; border-color: #a30c33; }
.robin-academy-videos .rcc-chip__num { color: #797776; background: #f6f3f1; }
.robin-academy-videos .rcc-chip.is-active .rcc-chip__num { color: #fff; background: rgba(255, 255, 255, .18); }
.robin-academy-videos .rcv-card {
	border-color: #cecac8;
	border-radius: 28px;
	background: #f6f3f1;
	box-shadow: none;
	transition: border-color .2s ease, transform .3s ease;
}
.robin-academy-videos .rcv-card:hover { border-color: #eab0b2; box-shadow: none; }
.robin-academy-videos .rcc-tag { color: #797776; background: #fff; }
.robin-academy-videos .rcc-more { color: #a30c33; }
.robin-academy-videos .rcc-showmore { background: #a30c33; box-shadow: none; }
.robin-academy-videos .rcc-showmore:hover { background: #8a0a2b; }
/* Секция каталога белая — липкая панель фильтров и растушёвка тоже белые. */
.robin-academy-videos .rcc-filter { background: #fff; }
.robin-academy-videos .rcc-filter::after { background: linear-gradient(180deg, #fff, rgba(255, 255, 255, 0)); }

/* --------------------------------------------------------------------------
   /support/ (page-support.php): «Центр поддержки» в языке /platform/,
   /ai-communications/, /corporate-assistants/ — пергамент #F6F3F1, рамки Ash,
   моно-подписи, бордовый ROBIN #A30C33, красный результат #C52229.
   Карточки/панели — .rcm-caps*, форма — .robin-pick--lead; здесь только
   то, чего у них нет: hero-схема, SLA-полосы, макет письма, зоны.
   Анимации появления (.is-in) включает assets/js/robin-support.js.
   -------------------------------------------------------------------------- */
.rsp {
	--rcm-parchment: #f6f3f1;
	--rcm-ash: #cecac8;
	--rcm-line: #edebe9;
	--rcm-ink: #242424;
	--rcm-graphite: #4e4d4d;
	--rcm-smoke: #797776;
	--rcm-accent: #a30c33;
	--rcm-result: #c52229;
	--rcm-result-soft: #eab0b2;
	--rcm-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	color: var(--rcm-ink);
}
.rsp .rsp-eyebrow {
	margin: 0 0 14px;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rcm-accent);
}
.rsp .rsp-eyebrow + .rcm-caps-title { margin-bottom: 20px; }
.rsp .rsp-lead {
	max-width: 44rem;
	margin: 0;
	font-size: 16px;
	line-height: 1.55;
	letter-spacing: -0.02em;
	color: var(--rcm-graphite);
}
.rsp .rsp-h2 {
	margin: 0 0 20px;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rcm-ink);
}
.rsp-h2 em { font-style: normal; color: var(--rcm-accent); }
.rsp .rsp-subtitle {
	margin: 56px 0 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 24px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
}
.rsp .rsp-zones .rsp-subtitle { margin: 0; }
.rsp .rsp-footnote {
	margin: 16px 0 0;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.02em;
	color: var(--rcm-smoke);
}

/* Иконка во фрейме (#EFEEED), как «Возможности» /corporate-assistants/ */
.rsp-ico {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid #efeeed;
	border-radius: 10px;
	background: var(--rcm-parchment);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .05), 0 1px 2px -1px rgba(0, 0, 0, .05);
	color: #000;
	transition: color .2s ease, transform .3s cubic-bezier(.3, 1.5, .5, 1);
}
.rsp-ico--lg { width: 48px; height: 48px; border-radius: 12px; background: #fff; }

/* --- Hero-схема: продукты → поддержка → результат ----------------------- */
.rsp-flow {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(40px, .7fr) auto minmax(40px, .7fr) minmax(0, 1fr);
	align-items: stretch;
	max-width: 960px;
	height: 248px;
	margin: 48px auto 0;
}
.rsp-flow-col {
	display: grid;
	grid-template-rows: repeat(4, 1fr);
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rsp-flow-col--in { justify-items: end; }
.rsp-flow-col--out { justify-items: start; }
.rsp-flow-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border: 1px solid var(--rcm-ash);
	border-radius: 999px;
	background: #fbfaf9;
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--rcm-graphite);
	animation: rsp-pop .6s cubic-bezier(.3, 1.4, .5, 1) both;
	animation-delay: calc(.15s + var(--i, 0) * .08s);
}
.rsp-flow-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--rcm-smoke); }
.rsp-flow-pill--out { border-color: var(--rcm-result-soft); color: var(--rcm-ink); }
.rsp-flow-pill--out .rsp-flow-dot { background: var(--rcm-result); animation: rsp-blink 2.4s ease-in-out infinite; animation-delay: calc(var(--i, 0) * .3s); }
.rsp-flow-wire { display: block; width: 100%; height: 100%; overflow: visible; }
.rsp-wire { fill: none; stroke: var(--rcm-ash); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.rsp-wire--out { stroke: var(--rcm-result-soft); }
.rsp-wire--live {
	stroke: var(--rcm-smoke);
	stroke-width: 2;
	stroke-dasharray: 3 14;
	stroke-linecap: round;
	animation: rsp-dash 1.4s linear infinite;
}
.rsp-wire--out.rsp-wire--live { stroke: var(--rcm-result); }
.rsp-flow-hub {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	align-self: center;
	min-width: 220px;
	padding: 22px 26px;
	border: 1.3px solid var(--rcm-accent);
	border-radius: 28px;
	background: #fbfaf9;
	box-shadow: 0 0 0 8px rgba(163, 12, 51, .05), 0 18px 40px -24px rgba(163, 12, 51, .55);
	text-align: center;
	animation: rsp-pop .7s cubic-bezier(.3, 1.4, .5, 1) both;
}
.rsp-flow-hub-ring {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-bottom: 6px;
	border-radius: 50%;
	background: var(--rcm-accent);
	color: #fff;
}
.rsp-flow-hub-ring::before,
.rsp-flow-hub-ring::after {
	content: "";
	position: absolute;
	inset: 0;
	border: 1px solid var(--rcm-accent);
	border-radius: 50%;
	animation: rsp-ring 2.6s ease-out infinite;
}
.rsp-flow-hub-ring::after { animation-delay: 1.3s; }
.rsp-flow-hub-title { font-family: var(--robin-font-head); font-size: 20px; letter-spacing: -0.02em; color: var(--rcm-ink); }
.rsp-flow-hub-sub { font-family: var(--rcm-mono); font-size: 11px; letter-spacing: -0.02em; text-transform: uppercase; color: var(--rcm-smoke); }

@keyframes rsp-dash { to { stroke-dashoffset: -34; } }
@keyframes rsp-pop { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes rsp-ring { from { transform: scale(1); opacity: .6; } to { transform: scale(1.9); opacity: 0; } }
@keyframes rsp-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes rsp-vdash { to { background-position: 0 20px; } }

@media (max-width: 767px) {
	.rsp-flow { display: flex; flex-direction: column; align-items: center; height: auto; margin-top: 36px; }
	.rsp-flow-wire { display: none; }
	.rsp-flow-col { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
	.rsp-flow-hub { min-width: 0; width: 100%; max-width: 320px; margin: 36px 0; }
	/* Вертикальные «провода» над и под хабом */
	.rsp-flow-hub::before,
	.rsp-flow-hub::after {
		content: "";
		position: absolute;
		left: 50%;
		width: 2px;
		height: 36px;
		background-image: repeating-linear-gradient(180deg, var(--rcm-smoke) 0 3px, transparent 3px 10px);
		background-size: 2px 20px;
		animation: rsp-vdash 1s linear infinite;
	}
	.rsp-flow-hub::before { bottom: 100%; }
	.rsp-flow-hub::after { top: 100%; background-image: repeating-linear-gradient(180deg, var(--rcm-result) 0 3px, transparent 3px 10px); }
	.rsp-flow-pill { font-size: 11px; padding: 7px 12px; }
}

/* --- Плитки контактов --------------------------------------------------- */
.rsp-tile {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 22px;
	border: 1px solid #f3f4f6;
	border-radius: 18px;
	background: #fff;
	text-decoration: none;
	transition: border-color .2s ease, transform .25s ease;
}
a.rsp-tile:hover { border-color: #fecdd3; transform: translateY(-2px); }
a.rsp-tile:hover .rsp-ico { color: var(--rcm-accent); transform: rotate(-6deg) scale(1.05); }
.rsp-tile-label {
	margin-top: 16px;
	font-family: var(--rcm-mono);
	font-size: 11px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rcm-smoke);
}
.rsp-tile-value { margin-top: 6px; font-size: 17px; font-weight: 500; letter-spacing: -0.02em; color: var(--rcm-ink); transition: color .2s ease; }
a.rsp-tile:hover .rsp-tile-value { color: var(--rcm-accent); }
.rsp-tile-note { margin-top: 4px; font-size: 13.5px; line-height: 1.45; color: #717171; }
.rsp-status {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 12px;
	padding: 4px 10px 4px 8px;
	border-radius: 999px;
	background: var(--rcm-parchment);
	font-family: var(--rcm-mono);
	font-size: 11px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rcm-graphite);
}
.rsp-status[hidden] { display: none; }
.rsp-status-dot { position: relative; width: 7px; height: 7px; border-radius: 50%; background: var(--rcm-smoke); }
.rsp-status.is-open .rsp-status-dot { background: #16a34a; }
.rsp-status.is-open .rsp-status-dot::after {
	content: "";
	position: absolute;
	inset: -3px;
	border: 1px solid #16a34a;
	border-radius: 50%;
	animation: rsp-ring 2s ease-out infinite;
}

/* --- SLA-инфографика ---------------------------------------------------- */
.rsp-sla {
	margin-top: 40px;
	padding: 32px;
	border: 1px solid var(--rcm-ash);
	border-radius: 28px;
	background: #fff;
}
.rsp-sla-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	font-family: var(--rcm-mono);
	font-size: 11.5px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rcm-graphite);
}
.rsp-sla-legend span { display: inline-flex; align-items: center; gap: 8px; }
.rsp-key { display: inline-block; width: 22px; height: 8px; border-radius: 4px; }
.rsp-key--react { background: var(--rcm-accent); }
.rsp-key--solve { background: var(--rcm-result-soft); }
.rsp-key--open { background: repeating-linear-gradient(90deg, var(--rcm-ash) 0 4px, transparent 4px 7px); }

.rsp-sla-axis,
.rsp-sla-row {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 32px;
}
.rsp-sla-axis { align-items: end; margin-top: 24px; padding-bottom: 10px; border-bottom: 1px solid var(--rcm-ash); }
.rsp-sla-axis-cap { font-family: var(--rcm-mono); font-size: 11px; text-align: right; text-transform: uppercase; color: var(--rcm-smoke); }
/* Отступы шкалы = колонки .rsp-bar-row: 80px подпись + 12px gap слева, 138px + 12px справа */
.rsp-sla-scale { position: relative; height: 16px; margin: 0 150px 0 92px; }
.rsp-sla-scale span {
	position: absolute;
	transform: translateX(-50%);
	font-family: var(--rcm-mono);
	font-size: 11px;
	color: var(--rcm-smoke);
}
.rsp-sla-list { margin: 0; padding: 0; list-style: none; }
.rsp-sla-row { align-items: center; padding: 24px 0; border-bottom: 1px solid var(--rcm-line); }
.rsp-sla-row:last-child { padding-bottom: 0; border-bottom: 0; }
.rsp-sla-info { display: flex; align-items: flex-start; gap: 16px; }
.rsp-sla-num {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--rcm-accent);
	font-family: var(--rcm-mono);
	font-size: 14px;
	color: #fff;
}
.rsp-sla-num--1 { animation: rsp-alert 2.2s ease-out infinite; }
.rsp-sla-num--2 { background: var(--rcm-result); }
.rsp-sla-num--3 { background: #e0797e; }
.rsp-sla-num--4 { background: var(--rcm-result-soft); color: var(--rcm-accent); }
@keyframes rsp-alert { 0% { box-shadow: 0 0 0 0 rgba(163, 12, 51, .45); } 70%, 100% { box-shadow: 0 0 0 10px rgba(163, 12, 51, 0); } }
.rsp .rsp-sla-level { margin: 4px 0 0; font-family: var(--robin-font-head); font-weight: 400; font-size: 20px; letter-spacing: -0.02em; color: var(--rcm-ink); }
.rsp .rsp-sla-why { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: var(--rcm-graphite); }

.rsp-sla-bars { position: relative; display: flex; flex-direction: column; gap: 10px; }
.rsp-sla-grid { position: absolute; inset: -24px 150px -24px 92px; pointer-events: none; }
.rsp-sla-grid i { position: absolute; top: 0; bottom: 0; width: 0; border-left: 1px dashed var(--rcm-line); }
.rsp-bar-row { position: relative; display: grid; grid-template-columns: 80px minmax(0, 1fr) 138px; gap: 12px; align-items: center; }
.rsp-bar-cap { font-family: var(--rcm-mono); font-size: 10.5px; letter-spacing: -0.02em; text-align: right; text-transform: uppercase; color: var(--rcm-smoke); }
.rsp-bar {
	display: block;
	width: var(--w);
	min-width: 10px;
	height: 12px;
	border-radius: 6px;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 1s cubic-bezier(.2, .8, .2, 1);
	transition-delay: calc(.15s + var(--i, 0) * .14s);
}
.rsp-bar-row + .rsp-bar-row .rsp-bar { transition-delay: calc(.4s + var(--i, 0) * .14s); }
.rsp-bar--react { background: var(--rcm-accent); }
.rsp-bar--solve { background: var(--rcm-result-soft); }
.rsp-bar--open {
	background: repeating-linear-gradient(90deg, var(--rcm-ash) 0 6px, transparent 6px 10px);
	-webkit-mask-image: linear-gradient(90deg, #000 60%, transparent);
	mask-image: linear-gradient(90deg, #000 60%, transparent);
}
.rsp-sla.is-in .rsp-bar { transform: scaleX(1); }
.rsp-bar-val {
	font-size: 13px;
	line-height: 1.3;
	letter-spacing: -0.02em;
	color: var(--rcm-ink);
	opacity: 0;
	transition: opacity .5s ease;
	transition-delay: calc(.8s + var(--i, 0) * .14s);
}
.rsp-sla.is-in .rsp-bar-val { opacity: 1; }

/* Остальные запросы: карточки .rcm-caps-card с dl */
.rsp-req { gap: 14px; }
.rsp-req-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: auto 0 0; padding-top: 16px; border-top: 1px solid var(--rcm-ash); }
.rsp-req-dl dt { font-family: var(--rcm-mono); font-size: 11px; letter-spacing: -0.02em; text-transform: uppercase; color: var(--rcm-smoke); }
.rsp-req-dl dd { margin: 4px 0 0; font-size: 14px; line-height: 1.4; color: var(--rcm-ink); }

/* Рабочий день: бегунок доходит до 18:00 и «перепрыгивает» на 9:00 */
.rsp-day { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px; align-items: center; margin-top: 40px; }
.rsp-day-track { position: relative; display: flex; align-items: center; height: 44px; }
.rsp-day-seg {
	position: relative;
	flex: 1 1 0;
	height: 10px;
	border-radius: 5px;
	background: var(--rcm-result-soft);
}
.rsp-day-seg span {
	position: absolute;
	top: 16px;
	font-family: var(--rcm-mono);
	font-size: 11px;
	color: var(--rcm-smoke);
}
.rsp-day-seg span:first-child { left: 0; }
.rsp-day-seg span:last-child { right: 0; }
.rsp-day-gap { flex: 0 0 22%; height: 10px; background: repeating-linear-gradient(90deg, var(--rcm-ash) 0 3px, transparent 3px 8px); }
.rsp-day-runner {
	position: absolute;
	top: 50%;
	left: 0;
	width: 16px;
	height: 16px;
	margin: -8px 0 0 -8px;
	border: 3px solid #fff;
	border-radius: 50%;
	background: var(--rcm-accent);
	box-shadow: 0 2px 8px rgba(163, 12, 51, .4);
	animation: rsp-day 5s ease-in-out infinite;
}
@keyframes rsp-day {
	0% { left: 0; opacity: 1; }
	38% { left: 39%; opacity: 1; }
	44% { left: 39%; opacity: 0; }
	50% { left: 61%; opacity: 0; }
	56% { left: 61%; opacity: 1; }
	90% { left: 88%; opacity: 1; }
	100% { left: 88%; opacity: 0; }
}
.rsp .rsp-day-note { margin: 0; font-size: 14px; line-height: 1.55; color: var(--rcm-graphite); }

/* --- Как обратиться: макет письма --------------------------------------- */
.rsp-pause { display: flex; align-items: center; gap: 16px; margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--rcm-ash); }
.rsp-pause-num { font-family: "Lora", Georgia, serif; font-size: 45px; font-style: italic; line-height: 1; color: var(--rcm-accent); }
.rsp-pause-days { display: flex; gap: 5px; }
.rsp-pause-days i { width: 18px; height: 24px; border: 1px solid var(--rcm-ash); border-radius: 5px; background: #fff; animation: rsp-daytick 3s ease-in-out infinite; }
.rsp-pause-days i:nth-child(2) { animation-delay: .3s; }
.rsp-pause-days i:nth-child(3) { animation-delay: .6s; }
@keyframes rsp-daytick { 0%, 15% { background: #fff; } 30%, 80% { border-color: var(--rcm-result-soft); background: var(--rcm-result-soft); } 100% { background: #fff; } }
.rsp-pause-label { padding-left: 16px; border-left: 1px solid var(--rcm-ash); font-size: 14px; line-height: 1.4; color: var(--rcm-graphite); }

.rsp-mail {
	overflow: hidden;
	border: 1px solid var(--rcm-ash);
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 30px 60px -40px rgba(36, 36, 36, .35);
}
.rsp-mail-bar { display: flex; align-items: center; gap: 6px; padding: 12px 18px; border-bottom: 1px solid var(--rcm-line); background: var(--rcm-parchment); }
.rsp-mail-bar i { width: 10px; height: 10px; border-radius: 50%; background: var(--rcm-ash); }
.rsp-mail-bar span { margin-left: 10px; font-family: var(--rcm-mono); font-size: 11px; text-transform: uppercase; color: var(--rcm-smoke); }
.rsp-mail-head { padding: 14px 24px; border-bottom: 1px solid var(--rcm-line); font-size: 14px; }
.rsp-mail-head div { display: flex; align-items: baseline; gap: 12px; }
.rsp-mail-head span { width: 44px; font-family: var(--rcm-mono); font-size: 11px; text-transform: uppercase; color: var(--rcm-smoke); }
.rsp-mail-head b { font-weight: 500; color: var(--rcm-accent); }
.rsp-mail-body { padding: 20px 24px 8px; }
.rsp .rsp-mail-cap { margin: 0 0 8px; font-family: var(--rcm-mono); font-size: 11px; text-transform: uppercase; color: var(--rcm-smoke); }
.rsp-check { margin: 0; padding: 0; list-style: none; }
.rsp-check li { display: flex; gap: 14px; padding: 12px 0; border-bottom: 1px dashed var(--rcm-line); font-size: 14.5px; line-height: 1.5; color: var(--rcm-graphite); }
.rsp-check li:last-child { border-bottom: 0; }
.rsp-check-box {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	margin-top: 1px;
	border: 1.5px solid var(--rcm-ash);
	border-radius: 6px;
	color: #fff;
	transition: background-color .25s ease, border-color .25s ease;
	transition-delay: calc(.3s + var(--i) * .45s);
}
.rsp-check-box svg { width: 12px; height: 12px; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .35s ease; transition-delay: calc(.4s + var(--i) * .45s); }
.rsp-mail.is-in .rsp-check-box { border-color: var(--rcm-accent); background: var(--rcm-accent); }
.rsp-mail.is-in .rsp-check-box svg { stroke-dashoffset: 0; }
.rsp-check li > span:last-child { transition: color .3s ease; transition-delay: calc(.3s + var(--i) * .45s); }
.rsp-mail.is-in .rsp-check li > span:last-child { color: var(--rcm-ink); }
.rsp-mail-files { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 0 8px; }
.rsp-mail-files span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	border: 1px dashed var(--rcm-ash);
	border-radius: 8px;
	font-family: var(--rcm-mono);
	font-size: 11px;
	color: var(--rcm-graphite);
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .4s ease, transform .4s ease;
}
.rsp-mail-files span::before { content: ""; width: 8px; height: 10px; border: 1.3px solid var(--rcm-smoke); border-radius: 2px; }
.rsp-mail-files span:nth-child(1) { transition-delay: 2.2s; }
.rsp-mail-files span:nth-child(2) { transition-delay: 2.35s; }
.rsp-mail-files span:nth-child(3) { transition-delay: 2.5s; }
.rsp-mail.is-in .rsp-mail-files span { opacity: 1; transform: none; }
.rsp-mail-foot { display: flex; justify-content: flex-end; padding: 14px 24px 18px; border-top: 1px solid var(--rcm-line); }

/* --- Границы услуги ----------------------------------------------------- */
.rsp-scope { gap: 14px; }
.rsp .rsp-scope-hint { margin: -4px 0 0; font-size: 14px; color: var(--rcm-smoke); }
.rsp-scope-list { margin: 0; padding: 0; list-style: none; }
.rsp-scope-list li { display: flex; gap: 12px; padding: 12px 0; border-top: 1px solid var(--rcm-line); font-size: 14.5px; line-height: 1.5; color: var(--rcm-graphite); }
.rsp-scope-ico { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--rcm-parchment); color: var(--rcm-smoke); }
.rsp-scope-ico svg { width: 12px; height: 12px; }
.rsp-scope-ico--yes { background: var(--rcm-accent); color: #fff; }

.rsp-zones { margin-top: 16px; padding: 32px; border: 1px solid var(--rcm-ash); border-radius: 28px; background: #fff; }
.rsp-zones-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
.rsp-zones-split { display: flex; flex: 1 1 320px; gap: 4px; max-width: 460px; height: 40px; }
.rsp-zones-part {
	display: inline-flex;
	flex: var(--n) 1 0;
	align-items: center;
	gap: 8px;
	min-width: 96px;
	padding: 0 14px;
	border-radius: 12px;
	font-family: var(--rcm-mono);
	font-size: 11px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	opacity: 0;
	transform: scaleX(.2);
	transform-origin: left;
	transition: transform .9s cubic-bezier(.2, .8, .2, 1), opacity .4s ease;
}
.rsp-zones-part b { font-family: var(--robin-font-head); font-size: 18px; font-weight: 400; }
.rsp-zones-part--robin { background: var(--rcm-accent); color: #fff; }
.rsp-zones-part--client { background: var(--rcm-parchment); color: var(--rcm-graphite); transform-origin: right; transition-delay: .15s; }
.rsp-zones.is-in .rsp-zones-part { opacity: 1; transform: none; }
.rsp-zones-list { margin: 24px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--rcm-ash); }
.rsp-zones-list li { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--rcm-line); }
.rsp-zones-num { font-family: var(--rcm-mono); font-size: 12px; color: var(--rcm-accent); }
.rsp-zones-text { font-size: 15px; line-height: 1.45; color: var(--rcm-ink); }
.rsp-switch {
	position: relative;
	display: inline-grid;
	grid-template-columns: 1fr 1fr;
	padding: 3px;
	border: 1px solid var(--rcm-line);
	border-radius: 999px;
	background: var(--rcm-parchment);
	font-family: var(--rcm-mono);
	font-size: 10.5px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}
.rsp-switch-opt { position: relative; z-index: 1; padding: 6px 12px; text-align: center; color: var(--rcm-smoke); transition: color .3s ease; transition-delay: calc(.5s + var(--i, 0) * .08s); }
.rsp-switch-knob {
	position: absolute;
	top: 3px;
	bottom: 3px;
	left: 3px;
	width: calc(50% - 3px);
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
	transition: transform .5s cubic-bezier(.3, 1.3, .5, 1), background-color .3s ease;
	transition-delay: calc(.3s + var(--i, 0) * .08s);
}
/* До появления ползунок слева и белый; при появлении встаёт на свою сторону */
.rsp-zones.is-in .rsp-switch:not(.is-robin) .rsp-switch-knob { background: var(--rcm-ink); transform: translateX(100%); }
.rsp-zones.is-in .rsp-switch.is-robin .rsp-switch-knob { background: var(--rcm-accent); }
.rsp-zones.is-in .rsp-switch-opt.is-on { color: #fff; }

/* --- Решить самому ------------------------------------------------------ */
.rsp-help { flex: 1; color: inherit; text-decoration: none; }
.rsp-help:focus-visible { outline: 2px solid var(--rcm-accent); outline-offset: 3px; }
.rsp-help-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rsp-help-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 16px;
	border-top: 1px solid var(--rcm-ash);
	font-family: var(--rcm-mono);
	font-size: 12px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rcm-accent);
}
.rsp-help-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid var(--rcm-ash);
	border-radius: 999px;
	transition: transform .2s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}
.rsp-help:hover .rsp-help-arrow { border-color: var(--rcm-accent); background: var(--rcm-accent); color: #fff; transform: translateX(3px); }
.rsp-help:hover .rsp-ico { color: var(--rcm-accent); transform: rotate(-6deg) scale(1.06); }

/* --- CTA ---------------------------------------------------------------- */
.rsp-cta-link { display: inline-flex; align-items: center; gap: 8px; color: inherit; transition: color .2s ease, gap .2s ease; }
.rsp-cta-link:hover { gap: 12px; color: var(--rcm-accent); }

/* --- Адаптив ------------------------------------------------------------ */
@media (max-width: 1023px) {
	.rsp .rsp-h2 { font-size: 36px; }
	.rsp-sla-axis,
	.rsp-sla-grid { display: none; }
	.rsp-sla-row { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.rsp-day { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}
@media (max-width: 639px) {
	.rsp .rsp-h2 { font-size: 30px; line-height: 1.12; }
	.rsp-sla,
	.rsp-zones { padding: 20px; border-radius: 20px; }
	.rsp-bar-row { grid-template-columns: 70px minmax(0, 1fr); }
	.rsp-bar-val { grid-column: 2; margin-top: -4px; font-size: 12.5px; }
	.rsp-zones-list li { grid-template-columns: 28px minmax(0, 1fr); align-items: start; }
	.rsp-zones-num { padding-top: 3px; }
	.rsp-switch { grid-column: 2; justify-self: start; }
	.rsp-req-dl { grid-template-columns: 1fr; }
	.rsp-mail-body,
	.rsp-mail-head { padding-right: 18px; padding-left: 18px; }
}

@media (prefers-reduced-motion: reduce) {
	.rsp *,
	.rsp *::before,
	.rsp *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
}

/* ==========================================================================
   ПОДДЕРЖКА ПО /support-coe/ (page-coe.php) — .rsc-*
   2026-10-02: стилистика /platform/, /ai-communications/, /corporate-assistants/:
   пергамент #F6F3F1, рамка Ash, Ink/Graphite/Smoke, моно-подписи, бордовый
   #A30C33 — акцент, зелёный — только индикатор «поддержка сейчас на связи».
   Живые части (время МСК, «сегодня», появление) — robin-support-coe.js.
   ========================================================================== */
.rsc-hero,
.rsc-routes,
.rsc-panel,
#support-faq {
	--rsc-parchment: #f6f3f1;
	--rsc-line: #efeeed;
	--rsc-ash: #cecac8;
	--rsc-ink: #242424;
	--rsc-graphite: #4e4d4d;
	--rsc-muted: #717171;
	--rsc-smoke: #797776;
	--rsc-accent: #a30c33;
	--rsc-accent-soft: #eab0b2;
	--rsc-ok: #1f9d55;
	--rsc-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* --- Hero --------------------------------------------------------------- */
.rsc-hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--rsc-accent);
}
/* Индикатор: серый по умолчанию, зелёный пульс в рабочие часы (JS) */
.rsc-status {
	position: relative;
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: var(--rsc-ash);
}
.rsc-status.is-open { background: var(--rsc-ok); }
.rsc-status.is-open::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: inherit;
	border: 2px solid var(--rsc-ok);
	opacity: 0;
	animation: rsc-ping 2s ease-out infinite;
}
@keyframes rsc-ping {
	0% { transform: scale(.5); opacity: .7; }
	100% { transform: scale(1.6); opacity: 0; }
}

/* Иконка во фрейме — как на /corporate-assistants/ (#EFEEED) */
.rsc-ico {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: #000;
	background: #f6f3f1;
	border: 1px solid #efeeed;
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .05), 0 1px 2px -1px rgba(0, 0, 0, .05);
	transition: color .2s ease, transform .3s ease;
}
.rsc-ico svg { width: 20px; height: 20px; }
.rsc-ico--sm { width: 36px; height: 36px; }
.rsc-ico--sm svg { width: 17px; height: 17px; }

/* --- Маршруты (карточки .rcm-caps) ----------------------------------------- */
.rcm-caps-grid.rsc-routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rsc-route .rsc-ico { background: #fff; }
.rsc-route:hover .rsc-ico { color: var(--rsc-accent); transform: rotate(-6deg) scale(1.06); }
.rsc-route-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.rsc-route .rcm-caps-art { max-width: 420px; }
@media (max-width: 767px) {
	.rcm-caps-grid.rsc-routes { grid-template-columns: minmax(0, 1fr); }
}

/* Появление при прокрутке (JS ставит .is-armed, затем .is-inview) */
[data-rsc-anim].is-armed {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1), border-color .2s ease;
	transition-delay: calc(var(--d, 0) * 120ms);
}
[data-rsc-anim].is-armed.is-inview { opacity: 1; transform: none; }

/* --- Панель «Как обратиться» (каркас .rcm-pains) ----------------------------- */
.rsc-panel {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 48px 64px;
	padding: 56px;
	border-radius: 24px;
	background: var(--rsc-parchment);
	color: var(--rsc-ink);
}
.rsc-panel-head {
	align-self: start;
	position: sticky;
	top: 112px;
	display: flex;
	flex-direction: column;
	gap: 36px;
}
.rsc-panel .rsc-panel-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -.025em;
	color: var(--rsc-ink);
}
.rsc-panel-body { display: flex; flex-direction: column; gap: 16px; }

/* Циферблат 24 ч */
.rsc-dial { position: relative; width: min(300px, 100%); margin: 0; }
.rsc-dial svg { display: block; width: 100%; height: auto; overflow: visible; }
.rsc-dial-face { fill: #fbfaf9; stroke: none; }
.rsc-dial-tick { stroke: var(--rsc-ash); stroke-width: 1.2; stroke-linecap: round; }
.rsc-dial-tick--major { stroke: var(--rsc-smoke); stroke-width: 1.6; }
.rsc-dial-track,
.rsc-dial-arc {
	fill: none;
	stroke-width: 8;
	transform: rotate(-90deg);
	transform-origin: 120px 120px;
}
.rsc-dial-track { stroke: var(--rsc-line); }
/* Рабочая дуга 9→18 из 24 (pathLength=24): штрих 9, смещение 15 */
.rsc-dial-arc {
	stroke: var(--rsc-accent);
	stroke-linecap: round;
	stroke-dasharray: 9 15;
	stroke-dashoffset: 15;
}
.rsc-dial.is-armed .rsc-dial-arc { stroke-dasharray: 0 24; transition: stroke-dasharray 1.4s cubic-bezier(.4, 0, .2, 1) .2s; }
.rsc-dial.is-armed.is-inview .rsc-dial-arc { stroke-dasharray: 9 15; }
.rsc-dial-label {
	font-family: var(--rsc-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	fill: var(--rsc-accent);
}
.rsc-dial-hand { transform-origin: 120px 120px; transition: transform 1.2s cubic-bezier(.3, 1.4, .5, 1); }
.rsc-dial-hand line { stroke: var(--rsc-ink); stroke-width: 2; stroke-linecap: round; }
.rsc-dial-hand circle { fill: var(--rsc-ink); }
.rsc-dial.is-open .rsc-dial-hand circle { fill: var(--rsc-ok); }
.rsc-dial:not(.is-live) .rsc-dial-hand { display: none; }
.rsc-dial-pin { fill: #fff; stroke: var(--rsc-ink); stroke-width: 2; }
.rsc-dial-time {
	display: flex;
	justify-content: center;
	margin-top: 14px;
	align-items: baseline;
	gap: 6px;
	white-space: nowrap;
	font-family: var(--rsc-mono);
	color: var(--rsc-ink);
}
.rsc-dial-clock { font-size: 20px; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.rsc-dial-zone { font-size: 11px; color: var(--rsc-smoke); }

/* Карточки справа */
.rsc-card {
	padding: 28px;
	border: 1px solid var(--rsc-ash);
	border-radius: 28px;
	background: #fff;
	transition: border-color .2s ease;
}
.rsc-card:hover { border-color: var(--rsc-accent-soft); }
.rsc-card-head { display: flex; align-items: center; gap: 14px; }
.rsc-panel .rsc-card-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.25;
	letter-spacing: -.02em;
	color: var(--rsc-ink);
}
.rsc-card-text {
	margin: 18px 0 0;
	font-size: 15px;
	line-height: 1.6;
	letter-spacing: -.02em;
	color: var(--rsc-graphite);
}

/* Недельный график */
.rsc-week { margin-top: 24px; font-family: var(--rsc-mono); }
.rsc-week-scale {
	position: relative;
	height: 16px;
	margin: 0 0 6px 40px;
	font-size: 10px;
	color: var(--rsc-smoke);
}
.rsc-week-scale span {
	position: absolute;
	left: calc(var(--at) / 24 * 100%);
	transform: translateX(-50%);
}
.rsc-week-scale span:first-child { transform: none; }
.rsc-week-scale span:last-child { transform: translateX(-100%); }
.rsc-day {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	align-items: center;
	height: 26px;
}
.rsc-day-name { font-size: 12px; color: var(--rsc-graphite); text-transform: uppercase; }
.rsc-day.is-off .rsc-day-name { color: var(--rsc-smoke); }
.rsc-day.is-today .rsc-day-name { color: var(--rsc-accent); font-weight: 600; }
.rsc-day-track {
	position: relative;
	height: 12px;
	border-radius: 999px;
	background: var(--rsc-parchment);
}
.rsc-day-shift {
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(9 / 24 * 100%);
	width: calc(9 / 24 * 100%);
	border-radius: inherit;
	background: linear-gradient(90deg, #c72329, var(--rsc-accent));
	transform-origin: left center;
}
.rsc-card.is-armed .rsc-day-shift { transform: scaleX(0); transition: transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(.25s + var(--i) * 80ms); }
.rsc-card.is-armed.is-inview .rsc-day-shift { transform: none; }
.rsc-day.is-today .rsc-day-track { box-shadow: 0 0 0 1px var(--rsc-accent-soft); }
.rsc-day.is-off .rsc-day-track {
	background: repeating-linear-gradient(-45deg, var(--rsc-parchment) 0 6px, #ebe7e4 6px 7px);
}
.rsc-day-off {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	line-height: 1;
	color: var(--rsc-smoke);
}
/* Маркер текущего времени (JS) */
.rsc-day-now {
	position: absolute;
	top: -5px;
	bottom: -5px;
	width: 2px;
	margin-left: -1px;
	border-radius: 2px;
	background: var(--rsc-ink);
	z-index: 1;
}
.rsc-day-now::after {
	content: "";
	position: absolute;
	top: -4px;
	left: 50%;
	width: 8px;
	height: 8px;
	margin-left: -4px;
	border-radius: 999px;
	background: var(--rsc-ink);
	box-shadow: 0 0 0 3px #fff;
}

/* Контакты */
.rsc-contacts { display: grid; gap: 10px; margin-top: 20px; }
.rsc-contact {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	border: 1px solid var(--rsc-line);
	border-radius: 18px;
	background: var(--rsc-parchment);
	color: var(--rsc-ink);
	transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}
.rsc-contact:hover { border-color: var(--rsc-accent-soft); background: #fff; transform: translateY(-1px); }
.rsc-contact-ico {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	color: #fff;
	background: linear-gradient(135deg, #c72329, var(--rsc-accent));
}
.rsc-contact-ico svg { width: 19px; height: 19px; }
.rsc-contact--mail:hover .rsc-contact-ico svg { animation: rsc-bob .6s ease; }
.rsc-contact--phone:hover .rsc-contact-ico svg { animation: rsc-ring .7s ease; }
@keyframes rsc-bob { 40% { transform: translateY(-3px); } 70% { transform: translateY(1px); } }
@keyframes rsc-ring {
	15%, 45% { transform: rotate(-14deg); }
	30%, 60% { transform: rotate(14deg); }
	75% { transform: rotate(0); }
}
.rsc-contact-body { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }
.rsc-contact-label {
	font-family: var(--rsc-mono);
	font-size: 11px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--rsc-smoke);
}
.rsc-contact-value {
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 18px;
	letter-spacing: -.02em;
	white-space: nowrap;
}
.rsc-contact-arrow,
.rsc-doc-arrow {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	color: var(--rsc-smoke);
	transition: color .2s ease, transform .2s ease;
}
.rsc-contact:hover .rsc-contact-arrow,
.rsc-doc:hover .rsc-doc-arrow { color: var(--rsc-accent); transform: translate(2px, -2px); }

@media (max-width: 1023px) {
	.rsc-panel { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 40px 32px; }
	.rsc-panel-head { position: static; flex-direction: row; align-items: center; justify-content: space-between; gap: 24px; }
	.rsc-panel .rsc-panel-title { font-size: 36px; }
	.rsc-dial { flex-shrink: 0; width: 220px; }
}
@media (max-width: 639px) {
	.rsc-panel { padding: 32px 20px; border-radius: 20px; }
	.rsc-panel-head { flex-direction: column; align-items: flex-start; }
	.rsc-panel .rsc-panel-title { font-size: 30px; line-height: 1.12; }
	.rsc-dial { align-self: center; }
	.rsc-card { padding: 22px 18px; border-radius: 22px; }
	.rsc-contact-value { font-size: 16px; }
}

/* --- FAQ ------------------------------------------------------------------- */
.rsc-faq {
	border: 1px solid var(--rsc-ash);
	border-radius: 24px;
	background: var(--rsc-parchment);
	transition: border-color .2s ease, background-color .2s ease;
}
.rsc-faq:hover { border-color: var(--rsc-accent-soft); }
.rsc-faq[open] { background: #fff; }
.rsc-faq-q {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 22px 26px;
	cursor: pointer;
	list-style: none;
	font-size: 18px;
	line-height: 1.35;
	letter-spacing: -.02em;
	color: var(--rsc-ink);
}
.rsc-faq-q::-webkit-details-marker { display: none; }
.rsc-faq-num { flex-shrink: 0; font-family: var(--rsc-mono); font-size: 13px; color: var(--rsc-accent); }
.rsc-faq-text { flex: 1 1 auto; }
/* Плюс → минус */
.rsc-faq-toggle {
	position: relative;
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border: 1px solid var(--rsc-ash);
	border-radius: 999px;
	background: #fff;
	transition: background-color .2s ease, border-color .2s ease;
}
.rsc-faq-toggle::before,
.rsc-faq-toggle::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 1.6px;
	margin: -.8px 0 0 -6px;
	border-radius: 2px;
	background: var(--rsc-ink);
	transition: transform .3s ease, background-color .2s ease;
}
.rsc-faq-toggle::after { transform: rotate(90deg); }
.rsc-faq[open] .rsc-faq-toggle { background: var(--rsc-accent); border-color: var(--rsc-accent); }
.rsc-faq[open] .rsc-faq-toggle::before,
.rsc-faq[open] .rsc-faq-toggle::after { background: #fff; }
.rsc-faq[open] .rsc-faq-toggle::after { transform: rotate(0deg); }
.rsc-faq-a { padding: 0 26px 26px; }
.rsc-faq[open] .rsc-faq-a { animation: rsc-faq-in .35s ease; }
@keyframes rsc-faq-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* Состав поддержки: три колонки */
.rsc-scope { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.rsc-scope-col {
	padding: 22px;
	border: 1px solid var(--rsc-line);
	border-top: 3px solid var(--rsc-tone);
	border-radius: 18px;
	background: var(--rsc-parchment);
}
.rsc-scope-col--yes { --rsc-tone: var(--rsc-ok); }
.rsc-scope-col--limit { --rsc-tone: #d08a1e; }
.rsc-scope-col--no { --rsc-tone: var(--rsc-accent); }
.rsc-scope-head { display: flex; align-items: flex-start; gap: 10px; }
.rsc-scope-head p { margin: 0; font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--rsc-ink); }
.rsc-scope-ico {
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	padding: 5px;
	border-radius: 999px;
	color: var(--rsc-tone);
	background: #fff;
	box-shadow: 0 0 0 1px var(--rsc-line);
}
.rsc-scope-lead { margin: 12px 0 0; font-size: 14px; line-height: 1.5; color: var(--rsc-graphite); }
.rsc-scope-list { display: grid; gap: 10px; margin: 14px 0 0; padding: 0; list-style: none; }
.rsc-scope-list li { display: flex; gap: 10px; font-size: 14px; line-height: 1.5; color: var(--rsc-graphite); }
.rsc-scope-num { flex-shrink: 0; min-width: 16px; font-family: var(--rsc-mono); font-size: 12px; line-height: 21px; color: var(--rsc-tone); }
.rsc-scope-dash { flex-shrink: 0; width: 10px; height: 2px; margin-top: 10px; border-radius: 2px; background: var(--rsc-tone); }
.rsc-scope-note {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 14px 0 0;
	padding: 16px 18px;
	border: 1px dashed var(--rsc-ash);
	border-radius: 18px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--rsc-graphite);
}
.rsc-scope-note .rsc-ico { color: var(--rsc-accent); }
@media (max-width: 899px) {
	.rsc-scope { grid-template-columns: minmax(0, 1fr); }
}

/* Карточка документа */
.rsc-doc {
	display: flex;
	align-items: center;
	gap: 16px;
	max-width: 640px;
	padding: 16px 18px;
	border: 1px solid var(--rsc-line);
	border-radius: 18px;
	background: var(--rsc-parchment);
	color: var(--rsc-ink);
	transition: border-color .2s ease, transform .2s ease;
}
.rsc-doc:hover { border-color: var(--rsc-accent-soft); transform: translateY(-1px); }
.rsc-doc-ico {
	position: relative;
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 54px;
	border: 1px solid var(--rsc-line);
	border-radius: 10px;
	background: #fff;
	color: var(--rsc-ink);
}
.rsc-doc-ico svg { width: 22px; height: 22px; }
.rsc-doc-ext {
	position: absolute;
	bottom: -6px;
	left: 50%;
	transform: translateX(-50%);
	padding: 1px 6px;
	border-radius: 6px;
	font-family: var(--rsc-mono);
	font-size: 9px;
	font-weight: 600;
	letter-spacing: .04em;
	color: #fff;
	background: var(--rsc-accent);
}
.rsc-doc-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.rsc-doc-meta { font-family: var(--rsc-mono); font-size: 11px; text-transform: uppercase; color: var(--rsc-smoke); }
.rsc-doc-title { overflow-wrap: anywhere; font-size: 15px; line-height: 1.4; }

@media (max-width: 639px) {
	.rsc-faq-q { gap: 12px; padding: 18px; font-size: 16px; }
	.rsc-faq-a { padding: 0 18px 18px; }
	.rsc-faq-toggle { width: 30px; height: 30px; }
}

@media (prefers-reduced-motion: reduce) {
	.rsc-status.is-open::after,
	.rsc-contact-ico svg,
	.rsc-faq[open] .rsc-faq-a { animation: none !important; }
	[data-rsc-anim].is-armed,
	.rsc-dial-hand,
	.rsc-dial-arc,
	.rsc-day-shift { transition: none !important; }
	[data-rsc-anim].is-armed { opacity: 1; transform: none; }
	.rsc-dial.is-armed .rsc-dial-arc { stroke-dasharray: 9 15; }
	.rsc-card.is-armed .rsc-day-shift { transform: none; }
}