/* --------------------------------------------------------------------------
   «ИИ для техподдержки и клиентского сервиса» (page-ai-support.php).
   Визуальный язык — как у /ai-communications/, /platform/,
   /corporate-assistants/: белые секции, пергаментные фрейм-карточки
   #f6f3f1, рамка Ash #cecac8, моно-подписи, бордовый акцент #a30c33,
   красный #c52229 — «результат». Мини-схемы — общие .rcm-caps-* (style.css).
   Префикс .rts-. Появление при скролле и счётчики — robin-ai-support.js
   (класс .rts-js на <html>; без JS всё показано в финальном состоянии).
   -------------------------------------------------------------------------- */
.rts-hero,
.rts-pains,
.rts-self,
.rts-results,
#process,
#voice,
#use-cases {
	--rts-parchment: #f6f3f1;
	--rts-paper: #fbfaf9;
	--rts-ash: #cecac8;
	--rts-line: #edebe9;
	--rts-ink: #242424;
	--rts-graphite: #4e4d4d;
	--rts-smoke: #797776;
	--rts-muted: #9f9f9f;
	--rts-accent: #a30c33;
	--rts-result: #c52229;
	--rts-result-soft: #eab0b2;
	--rts-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--rts-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Общие элементы ---------- */
.rts-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--rts-mono);
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rts-accent);
}
.rts-eyebrow-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--rts-accent);
	box-shadow: 0 0 0 0 rgba(163, 12, 51, 0.45);
	animation: rts-ping 2s ease-out infinite;
}
@keyframes rts-ping {
	0%   { box-shadow: 0 0 0 0 rgba(163, 12, 51, 0.45); }
	80%  { box-shadow: 0 0 0 8px rgba(163, 12, 51, 0); }
	100% { box-shadow: 0 0 0 0 rgba(163, 12, 51, 0); }
}
.rts-h2 {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 400;
	font-size: 45px;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--rts-ink, #242424);
}
.rts-h2 em {
	font-style: normal;
	color: var(--rts-accent, #a30c33);
}
.rts-h2--center {
	max-width: 46rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.rts-p {
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 1.55;
	letter-spacing: -0.02em;
	color: var(--rts-graphite);
}

/* ==========================================================================
   1. HERO
   ========================================================================== */
.rts-hero {
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr);
	gap: 48px;
	align-items: center;
	padding: 56px 56px 56px 64px;
	border-radius: 24px;
	background: var(--rts-parchment);
	overflow: hidden;
}
.rts-hero-title {
	margin: 18px 0 0;
	font-family: var(--robin-font-head);
	font-weight: 500;
	font-size: 52px;
	line-height: 1.04;
	letter-spacing: -0.03em;
	color: var(--rts-ink);
}
.rts-hero-title em {
	font-style: normal;
	color: var(--rts-accent);
}
.rts-hero-lead {
	margin: 22px 0 0;
	font-size: 19px;
	line-height: 1.45;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-hero-sub {
	margin: 12px 0 0;
	max-width: 34rem;
	font-size: 15px;
	line-height: 1.55;
	letter-spacing: -0.02em;
	color: #717171;
}
.rts-hero-benefits {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}
.rts-hero-benefits li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px 6px 6px;
	border: 1px solid var(--rts-ash);
	border-radius: 9999px;
	background: var(--rts-paper);
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-hero-benefit-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--rts-line);
	color: var(--rts-accent);
}
.rts-hero-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 32px;
}

/* --- Консоль входящих обращений --- */
.rts-hero-visual {
	position: relative;
	padding: 36px 8px 44px 28px;
}
.rts-console {
	position: relative;
	border: 1px solid var(--rts-ash);
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 24px 60px -30px rgba(36, 36, 36, 0.35), 0 2px 6px -2px rgba(36, 36, 36, 0.06);
	overflow: hidden;
}
.rts-console-bar {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--rts-line);
	font-family: var(--rts-mono);
	font-size: 11px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-console-dots { display: inline-flex; gap: 5px; }
.rts-console-dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--rts-line); }
.rts-console-title { flex: 1; }
.rts-console-live {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 9px;
	border: 1px solid var(--rts-result-soft);
	border-radius: 9999px;
	color: var(--rts-result);
}
.rts-console-live i,
.rts-call-rec i,
.rts-widget-name small i {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
	animation: rts-blink 1.4s ease-in-out infinite;
}
@keyframes rts-blink { 50% { opacity: 0.25; } }

.rts-tickets {
	margin: 0;
	padding: 8px 10px;
	list-style: none;
}
.rts-ticket {
	--cycle: 9s;
	position: relative;
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	padding: 10px 8px;
	border-bottom: 1px dashed var(--rts-line);
	animation: rts-ticket var(--cycle) var(--rts-ease) infinite both;
	animation-delay: calc(var(--i) * 0.75s);
}
.rts-ticket:last-child { border-bottom: 0; }
@keyframes rts-ticket {
	0%       { opacity: 0; transform: translateX(-14px); }
	6%, 90%  { opacity: 1; transform: none; }
	97%,100% { opacity: 0; transform: translateX(10px); }
}
.rts-ticket-ch {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid var(--rts-line);
	border-radius: 10px;
	background: var(--rts-parchment);
	color: var(--rts-smoke);
}
.rts-ticket-body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rts-ticket-name {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-ticket-skel { display: flex; gap: 6px; }
.rts-ticket-skel i {
	display: block;
	height: 5px;
	max-width: 46%;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--rts-line) 0%, #f7f5f4 50%, var(--rts-line) 100%);
	background-size: 200% 100%;
	animation: rts-shimmer 1.8s linear infinite;
}
@keyframes rts-shimmer { to { background-position: -200% 0; } }

/* Статус: «Новое» → «Решено» / «Сотруднику» — сменяется на ~30% цикла строки */
.rts-ticket-status {
	display: grid;
	justify-items: end;
	font-family: var(--rts-mono);
	font-size: 10.5px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}
.rts-st {
	grid-area: 1 / 1;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 9999px;
	white-space: nowrap;
	animation: var(--cycle) linear infinite both;
	animation-delay: calc(var(--i) * 0.75s);
}
.rts-st--new {
	border: 1px solid var(--rts-ash);
	color: var(--rts-smoke);
	animation-name: rts-st-out;
}
.rts-st--done {
	border: 1px solid var(--rts-result-soft);
	background: #fdf3f3;
	color: var(--rts-result);
	animation-name: rts-st-in;
}
.rts-st--done::before {
	content: "";
	width: 9px;
	height: 5px;
	margin-top: -3px;
	border-left: 1.6px solid currentColor;
	border-bottom: 1.6px solid currentColor;
	transform: rotate(-45deg);
}
.rts-st--human {
	border: 1px solid var(--rts-ink);
	background: var(--rts-ink);
	color: #fff;
	animation-name: rts-st-in;
}
@keyframes rts-st-out {
	0%, 28%   { opacity: 1; transform: none; }
	32%, 100% { opacity: 0; transform: translateY(-6px); }
}
@keyframes rts-st-in {
	0%, 29%   { opacity: 0; transform: translateY(6px) scale(0.9); }
	34%, 100% { opacity: 1; transform: none; }
}
/* Подсветка строки в момент, когда ассистент её «закрывает» */
.rts-ticket::after {
	content: "";
	position: absolute;
	inset: 2px 0;
	z-index: -1;
	border-radius: 12px;
	background: linear-gradient(90deg, rgba(197, 34, 41, 0), rgba(197, 34, 41, 0.07), rgba(197, 34, 41, 0));
	opacity: 0;
	animation: rts-ticket-flash var(--cycle) linear infinite both;
	animation-delay: calc(var(--i) * 0.75s);
}
.rts-ticket--handoff::after { background: linear-gradient(90deg, rgba(36, 36, 36, 0), rgba(36, 36, 36, 0.06), rgba(36, 36, 36, 0)); }
@keyframes rts-ticket-flash {
	0%, 28%  { opacity: 0; }
	33%      { opacity: 1; }
	45%,100% { opacity: 0; }
}

.rts-console-meter {
	padding: 14px 18px 18px;
	border-top: 1px solid var(--rts-line);
	background: var(--rts-paper);
}
.rts-console-meter-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	font-family: var(--rts-mono);
	font-size: 11px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-console-meter-head b {
	font-family: var(--robin-font-head);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.02em;
	text-transform: none;
	color: var(--rts-accent);
}
.rts-console-meter-track {
	position: relative;
	height: 8px;
	margin-top: 10px;
	border-radius: 9999px;
	background: var(--rts-line);
	overflow: hidden;
}
.rts-console-meter-track i {
	position: absolute;
	inset: 0 auto 0 0;
	width: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--rts-accent), var(--rts-result));
	animation: rts-meter 9s var(--rts-ease) infinite;
}
@keyframes rts-meter {
	0%, 8%   { width: 100%; }
	55%, 88% { width: 20%; }
	100%     { width: 100%; }
}

/* Плавающие плашки вокруг консоли */
.rts-float {
	position: absolute;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 14px 8px 8px;
	border: 1px solid var(--rts-ash);
	border-radius: 9999px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 14px 30px -18px rgba(36, 36, 36, 0.45);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	animation: rts-float 6s ease-in-out infinite;
}
@keyframes rts-float { 50% { transform: translateY(-6px); } }
.rts-float b {
	display: block;
	font-family: var(--robin-font-head);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-float small {
	display: block;
	margin-top: 2px;
	font-size: 11px;
	line-height: 1.2;
	color: var(--rts-smoke);
}
.rts-float--react { top: 0; left: 0; }
.rts-float--typing {
	right: 0;
	bottom: 6px;
	padding-right: 16px;
	animation-delay: -3s;
}
.rts-float-ico,
.rts-float-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #fdf3f3;
	color: var(--rts-result);
}
.rts-float-ico { animation: rts-ping 2.2s ease-out infinite; }
.rts-float-avatar { width: 28px; height: 28px; background: var(--rts-accent); color: #fff; }
.rts-float-name {
	font-family: var(--rts-mono);
	font-size: 11px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rts-graphite);
}
.rts-typing { display: inline-flex; gap: 3px; }
.rts-typing i {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--rts-smoke);
	animation: rts-typing 1.2s ease-in-out infinite;
}
.rts-typing i:nth-child(2) { animation-delay: 0.15s; }
.rts-typing i:nth-child(3) { animation-delay: 0.3s; }
@keyframes rts-typing {
	0%, 60%, 100% { transform: none; opacity: 0.4; }
	30%           { transform: translateY(-4px); opacity: 1; }
}

/* ==========================================================================
   2. ПОЧЕМУ ПЕРВАЯ ЛИНИЯ НЕ СПРАВЛЯЕТСЯ
   ========================================================================== */
.rts-pains {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 48px 64px;
	padding: 56px;
	border-radius: 24px;
	background: var(--rts-parchment);
	color: var(--rts-ink);
}
.rts-pains-head {
	align-self: start;
	position: sticky;
	top: 112px;
	display: flex;
	flex-direction: column;
	gap: 36px;
}
.rts-donuts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}
.rts-donut {
	position: relative;
	margin: 0;
	padding: 20px;
	border: 1px solid var(--rts-ash);
	border-radius: 24px;
	background: #fff;
}
.rts-donut svg {
	display: block;
	width: 96px;
	height: 96px;
	transform: rotate(-90deg);
}
.rts-donut-track { fill: none; stroke: var(--rts-line); stroke-width: 9; }
.rts-donut-fill {
	fill: none;
	stroke: var(--rts-accent);
	stroke-width: 9;
	stroke-linecap: round;
	stroke-dasharray: var(--v) 100;
	transition: stroke-dasharray 1.6s var(--rts-ease);
}
.rts-donut-val {
	position: absolute;
	top: 20px;
	left: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 96px;
	height: 96px;
	font-family: var(--robin-font-head);
	font-size: 26px;
	font-weight: 500;
	letter-spacing: -0.03em;
	color: var(--rts-accent);
}
.rts-donut figcaption {
	margin-top: 16px;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--rts-graphite);
}
.rts-js .rts-pains:not(.is-in) .rts-donut-fill { stroke-dasharray: 0 100; }

.rts-pains-intro {
	margin: 0;
	font-family: var(--robin-font-head);
	font-size: 22px;
	line-height: 1.3;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-kicker {
	margin: 32px 0 14px;
	font-family: var(--rts-mono);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-routine {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rts-routine-item {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 14px 16px 14px 14px;
	border: 1px solid var(--rts-ash);
	border-radius: 18px;
	background: #fff;
	font-size: 15px;
	line-height: 1.35;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
	transition: border-color .2s ease, transform .3s var(--rts-ease), opacity .6s var(--rts-ease);
	transition-delay: 0s, 0s, calc(var(--i) * 60ms);
}
.rts-routine-item:hover { border-color: var(--rts-result-soft); transform: translateY(-2px); }
.rts-routine-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--rts-line);
	border-radius: 12px;
	background: var(--rts-parchment);
	color: var(--rts-accent);
	transition: background-color .2s ease, color .2s ease;
}
.rts-routine-item:hover .rts-routine-ico { background: var(--rts-accent); color: #fff; }
.rts-routine-num {
	align-self: start;
	font-family: var(--rts-mono);
	font-size: 11px;
	color: var(--rts-muted);
}
.rts-js .rts-pains:not(.is-in) .rts-routine-item { opacity: 0; transform: translateY(10px); }

.rts-pains-result {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 20px;
	padding-top: 28px;
	border-top: 1px solid var(--rts-ash);
}
.rts-pains-result-lead {
	font-family: var(--rts-mono);
	font-size: 12px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-chain {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rts-chain li {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px 8px 8px;
	border: 1px solid var(--rts-result-soft);
	border-radius: 9999px;
	background: #fff;
	font-size: 14px;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-chain li + li { margin-left: 26px; }
.rts-chain li + li::before {
	content: "";
	position: absolute;
	left: -28px;
	top: 50%;
	width: 18px;
	border-top: 1px dashed var(--rts-accent);
}
.rts-chain-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #fdf3f3;
	color: var(--rts-result);
}

/* ==========================================================================
   3. ПРОЦЕСС: рельс + карточки шагов
   ========================================================================== */
.rts-rail {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: -8px 0 28px;
	padding: 0;
	list-style: none;
}
/* Линия рельса — между центрами крайних станций */
.rts-rail::before {
	content: "";
	position: absolute;
	top: 22px;
	left: 12.5%;
	right: 12.5%;
	border-top: 1px dashed var(--rts-ash);
}
.rts-rail-stop {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}
.rts-rail-node {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--rts-ash);
	border-radius: 14px;
	background: #fff;
	color: var(--rts-smoke);
	animation: rts-stop 8s linear infinite;
	animation-delay: calc(var(--i) * 2s - 0.2s);
}
@keyframes rts-stop {
	0%, 2%   { border-color: var(--rts-ash); background: #fff; color: var(--rts-smoke); transform: none; }
	5%, 22%  { border-color: var(--rts-accent); background: var(--rts-accent); color: #fff; transform: scale(1.08); }
	28%,100% { border-color: var(--rts-result-soft); background: #fff; color: var(--rts-accent); transform: none; }
}
.rts-rail-label {
	font-family: var(--rts-mono);
	font-size: 11px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
/* «Обращение» бежит по рельсу от станции к станции */
.rts-rail-runner {
	position: absolute;
	top: 22px;
	left: 12.5%;
	right: 12.5%;
	height: 0;
	pointer-events: none;
}
.rts-rail-runner i {
	position: absolute;
	top: -5px;
	left: 0;
	width: 10px;
	height: 10px;
	margin-left: -5px;
	border-radius: 50%;
	background: var(--rts-result);
	box-shadow: 0 0 0 5px rgba(197, 34, 41, 0.15);
	animation: rts-runner 8s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}
@keyframes rts-runner {
	0%        { left: 0;      opacity: 0; }
	3%        { opacity: 1; }
	25%       { left: 33.33%; }
	50%       { left: 66.66%; }
	75%, 92%  { left: 100%;   opacity: 1; }
	100%      { left: 100%;   opacity: 0; }
}
.rts-steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rts-steps .rcm-caps-card { padding: 24px; }
.rts-steps .rcm-caps-item-title { font-size: 20px; }
.rts-steps .rcm-caps-desc { font-size: 14px; }

/* Шкала SLA в схеме шага «Контроль исполнения» */
.rts-sla-track { fill: var(--rts-line); }
.rts-sla-fill {
	fill: var(--rts-accent);
	transform-box: fill-box;
	transform-origin: 0 50%;
	animation: rts-sla 5s var(--rts-ease) infinite;
}
@keyframes rts-sla {
	0%       { transform: scaleX(0.04); }
	60%, 90% { transform: scaleX(1); }
	100%     { transform: scaleX(0.04); }
}
.rts-sla-tick { stroke: #fff; stroke-width: 2; }
.rts-sla-deadline { stroke: var(--rts-ink); stroke-width: 1.2; stroke-dasharray: 3 3; }
.rts-sla-ok circle {
	fill: #fff;
	stroke: var(--rts-result);
	stroke-width: 1.3;
}
.rts-sla-ok polyline { fill: none; stroke: var(--rts-result); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rts-sla-ok {
	transform-box: fill-box;
	transform-origin: center;
	animation: rts-sla-ok 5s var(--rts-ease) infinite;
}
@keyframes rts-sla-ok {
	0%, 55%  { opacity: 0; transform: scale(0.5); }
	64%, 90% { opacity: 1; transform: none; }
	100%     { opacity: 0; }
}
.rcm-caps-art .rts-sla-risk text { font-size: 10px; fill: var(--rts-smoke); }
.rts-sla-risk line { stroke: var(--rts-result); stroke-width: 1.2; }

/* ==========================================================================
   4. SELF-SERVICE
   ========================================================================== */
.rts-self {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: 48px 64px;
	align-items: center;
	padding: 56px;
	border-radius: 24px;
	background: var(--rts-parchment);
}
.rts-self-text .rts-h2 { margin-top: 14px; }
.rts-quote {
	display: flex;
	gap: 14px;
	margin: 32px 0 0;
	padding: 20px 22px;
	border: 1px solid var(--rts-ash);
	border-left: 3px solid var(--rts-accent);
	border-radius: 6px 20px 20px 6px;
	background: #fff;
}
.rts-quote-ico { flex-shrink: 0; margin-top: 2px; color: var(--rts-accent); }
.rts-quote p {
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
	letter-spacing: -0.02em;
	color: var(--rts-graphite);
}
.rts-quote b { font-weight: 500; color: var(--rts-ink); }

.rts-widget {
	padding: 22px;
	border: 1px solid var(--rts-ash);
	border-radius: 28px;
	background: #fff;
	box-shadow: 0 24px 60px -34px rgba(36, 36, 36, 0.35);
}
.rts-widget-head { display: flex; align-items: center; gap: 12px; }
.rts-widget-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 12px;
	background: var(--rts-accent);
	color: #fff;
}
.rts-widget-name {
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-widget-name small {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 2px;
	font-family: var(--rts-mono);
	font-size: 10.5px;
	font-weight: 400;
	text-transform: uppercase;
	color: #2f9e5b;
}
.rts-widget-input {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 18px;
	padding: 12px 8px 12px 16px;
	border: 1px solid var(--rts-ash);
	border-radius: 16px;
	background: var(--rts-paper);
	font-size: 14px;
	color: var(--rts-muted);
}
.rts-widget-caret {
	width: 1.5px;
	height: 18px;
	background: var(--rts-accent);
	animation: rts-caret 1s steps(1) infinite;
}
@keyframes rts-caret { 50% { opacity: 0; } }
.rts-widget-ph { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rts-widget-send {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 10px;
	background: var(--rts-ink);
	color: #fff;
}
.rts-widget-kicker {
	margin: 20px 0 8px;
	font-family: var(--rts-mono);
	font-size: 11px;
	font-weight: 400;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-skills { margin: 0; padding: 0; list-style: none; }
.rts-skill {
	position: relative;
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr) 20px;
	gap: 12px;
	align-items: center;
	padding: 9px 10px;
	border-radius: 14px;
	font-size: 15px;
	line-height: 1.3;
	letter-spacing: -0.02em;
	color: var(--rts-graphite);
	animation: rts-skill 14s linear infinite;
	animation-delay: calc(var(--i) * 2s);
}
/* Навыки подсвечиваются по очереди: 7 × 2с = цикл 14с */
@keyframes rts-skill {
	0%        { background: transparent; color: var(--rts-graphite); }
	2%, 12%   { background: #fdf3f3; color: var(--rts-ink); }
	15%, 100% { background: transparent; color: var(--rts-graphite); }
}
.rts-skill-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--rts-line);
	border-radius: 10px;
	background: var(--rts-parchment);
	color: var(--rts-accent);
}
.rts-skill-go {
	color: var(--rts-result);
	opacity: 0;
	animation: rts-skill-go 14s linear infinite;
	animation-delay: calc(var(--i) * 2s);
}
@keyframes rts-skill-go {
	0%        { opacity: 0; transform: translateX(-6px); }
	3%, 12%   { opacity: 1; transform: none; }
	15%, 100% { opacity: 0; transform: translateX(-6px); }
}

/* ==========================================================================
   5. ГОЛОСОВЫЕ АССИСТЕНТЫ
   ========================================================================== */
.rts-voice-top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px 64px;
	align-items: center;
	margin-bottom: 48px;
}
.rts-voice-top .rts-h2 { margin-top: 14px; }
.rts-call {
	padding: 22px 24px 24px;
	border: 1px solid var(--rts-ash);
	border-radius: 28px;
	background: var(--rts-parchment);
}
.rts-call-head { display: flex; align-items: center; gap: 12px; }
.rts-call-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--rts-accent);
	color: #fff;
	animation: rts-ping 2s ease-out infinite;
}
.rts-call-title {
	flex: 1;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-call-title small {
	display: block;
	margin-top: 2px;
	font-family: var(--rts-mono);
	font-size: 10.5px;
	font-weight: 400;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-call-rec {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 10px;
	border: 1px solid var(--rts-result-soft);
	border-radius: 9999px;
	background: #fff;
	font-family: var(--rts-mono);
	font-size: 10.5px;
	text-transform: uppercase;
	color: var(--rts-result);
}
.rts-call-wave {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 3px;
	height: 96px;
	margin: 22px 0 18px;
	padding: 0 4px;
}
.rts-call-wave i {
	flex: 1;
	max-width: 6px;
	height: var(--h);
	border-radius: 9999px;
	background: linear-gradient(180deg, var(--rts-result), var(--rts-accent));
	transform-origin: center;
	animation: rts-wave 1.1s ease-in-out infinite alternate;
	animation-delay: calc(var(--d) * -1);
}
@keyframes rts-wave {
	0%   { transform: scaleY(0.25); opacity: 0.55; }
	100% { transform: scaleY(1); opacity: 1; }
}
.rts-call-states {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rts-call-states li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 14px;
	border: 1px solid var(--rts-ash);
	border-radius: 9999px;
	background: #fff;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--rts-smoke);
	animation: rts-state 6s linear infinite;
	animation-delay: calc(var(--i) * 2s);
}
.rts-call-states li span {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}
@keyframes rts-state {
	0%        { border-color: var(--rts-ash); color: var(--rts-smoke); }
	4%, 30%   { border-color: var(--rts-accent); color: var(--rts-accent); }
	34%, 100% { border-color: var(--rts-ash); color: var(--rts-smoke); }
}
.rts-voice-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rts-voice-grid .rcm-caps-card { padding: 24px; }
.rts-voice-grid .rcm-caps-item-title { font-size: 20px; }
.rts-voice-grid .rcm-caps-desc { font-size: 14px; }

/* Детали голосовых мини-схем */
.rcm-caps-art .rts-va-label { font-size: 10px; fill: var(--rts-smoke); }
.rts-va-bar {
	fill: var(--rts-smoke);
	transform-box: fill-box;
	transform-origin: center;
	animation: rts-wave 0.9s ease-in-out infinite alternate;
	animation-delay: calc(var(--d) * -1);
}
.rts-va-bar--out { fill: var(--rts-result); }
.rts-va-cut { stroke: var(--rts-accent); stroke-width: 1.2; stroke-dasharray: 3 3; }
.rts-va-shield path { fill: #fbfaf9; stroke: var(--rts-accent); stroke-width: 1.3; }
.rts-va-shield polyline { fill: none; stroke: var(--rts-accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ==========================================================================
   6. ЧТО ПОЛУЧАЕТ БИЗНЕС — бенто-инфографика
   ========================================================================== */
.rts-results {
	padding: 56px;
	border-radius: 24px;
	background: var(--rts-parchment);
}
.rts-bento {
	display: grid;
	grid-template-columns: 1.35fr 1fr 1fr;
	grid-template-rows: auto auto;
	gap: 16px;
	margin-top: 48px;
}
.rts-tile {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 26px;
	border: 1px solid var(--rts-ash);
	border-radius: 28px;
	background: #fff;
	overflow: hidden;
	transition: border-color .2s ease, transform .3s var(--rts-ease);
}
.rts-tile:hover { border-color: var(--rts-result-soft); transform: translateY(-3px); }
.rts-tile--load {
	grid-row: span 2;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.rts-tile-val {
	margin-top: auto;
	font-family: var(--robin-font-head);
	font-size: 40px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.035em;
	color: var(--rts-accent);
}
.rts-tile-val small { font-size: 22px; font-weight: 400; }
.rts-tile-label {
	margin: 0;
	font-size: 15px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--rts-graphite);
}
.rts-tile-viz { height: 64px; }

/* 80% — полукруглая шкала */
.rts-gauge { position: relative; width: 100%; max-width: 340px; }
.rts-gauge svg { display: block; width: 100%; height: auto; overflow: visible; }
.rts-gauge-track { fill: none; stroke: var(--rts-line); stroke-width: 16; stroke-linecap: round; }
.rts-gauge-fill {
	fill: none;
	stroke: var(--rts-accent);
	stroke-width: 16;
	stroke-linecap: round;
	stroke-dasharray: 80 100;
	transition: stroke-dasharray 1.8s var(--rts-ease);
}
.rts-gauge-tick { stroke: var(--rts-ash); stroke-width: 1.4; stroke-linecap: round; }
.rts-gauge-val {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	font-family: var(--robin-font-head);
	font-size: 64px;
	font-weight: 500;
	line-height: 0.95;
	letter-spacing: -0.04em;
	color: var(--rts-accent);
}
.rts-gauge-val small {
	font-size: 18px;
	font-weight: 400;
	letter-spacing: -0.02em;
	color: var(--rts-smoke);
}
.rts-tile--load .rts-tile-label { max-width: 18rem; margin-top: 18px; font-size: 17px; }
.rts-js .rts-results:not(.is-in) .rts-gauge-fill { stroke-dasharray: 0 100; }

/* < 1 секунды — секундомер */
.rts-stopwatch svg { width: 64px; height: 64px; overflow: visible; }
.rts-sw-track { fill: none; stroke: var(--rts-line); stroke-width: 4; }
.rts-sw-sweep {
	fill: none;
	stroke: var(--rts-result);
	stroke-width: 4;
	stroke-linecap: round;
	stroke-dasharray: 0 100;
	transform: rotate(-90deg);
	transform-origin: 32px 34px;
	animation: rts-sweep 1.6s var(--rts-ease) infinite;
}
@keyframes rts-sweep {
	0%       { stroke-dasharray: 0 100; opacity: 1; }
	55%, 80% { stroke-dasharray: 100 0; opacity: 1; }
	100%     { stroke-dasharray: 100 0; opacity: 0; }
}
.rts-sw-crown { stroke: var(--rts-ink); stroke-width: 2.4; stroke-linecap: round; }
.rts-sw-hand {
	stroke: var(--rts-ink);
	stroke-width: 2.4;
	stroke-linecap: round;
	transform-origin: 32px 34px;
	animation: rts-hand 1.6s var(--rts-ease) infinite;
}
@keyframes rts-hand {
	0%        { transform: rotate(0); }
	55%, 100% { transform: rotate(360deg); }
}

/* 100% — сегменты SLA */
.rts-segments {
	display: flex;
	align-items: center;
	gap: 5px;
}
.rts-segments i {
	flex: 1;
	height: 28px;
	border-radius: 6px;
	background: var(--rts-accent);
	transition: background-color .3s ease, transform .4s var(--rts-ease);
	transition-delay: calc(var(--i) * 90ms);
}
.rts-segments-ok {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	margin-left: 4px;
	border-radius: 50%;
	background: #fdf3f3;
	color: var(--rts-result);
	transition: transform .4s var(--rts-ease) 1s, opacity .4s ease 1s;
}
.rts-js .rts-results:not(.is-in) .rts-segments i { background: var(--rts-line); transform: scaleY(0.5); }
.rts-js .rts-results:not(.is-in) .rts-segments-ok { opacity: 0; transform: scale(0.4); }

/* До 70% — сравнение столбцов */
.rts-bars {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
}
.rts-bars-row {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr);
	gap: 10px;
	align-items: center;
}
.rts-bars-row em {
	font-family: var(--rts-mono);
	font-size: 10.5px;
	font-style: normal;
	text-transform: uppercase;
	color: var(--rts-smoke);
}
.rts-bars-row i {
	display: block;
	height: 14px;
	border-radius: 9999px;
	transform-origin: 0 50%;
	transition: transform 1.4s var(--rts-ease) .2s;
}
.rts-bars-before { width: 100%; background: var(--rts-ash); }
.rts-bars-after { width: 30%; background: var(--rts-accent); }
.rts-js .rts-results:not(.is-in) .rts-bars-after { transform: scaleX(3.33); }

/* 24/7 — суточный циферблат */
.rts-dial svg { width: 64px; height: 64px; }
.rts-dial-tick {
	stroke: var(--rts-accent);
	stroke-width: 2.2;
	stroke-linecap: round;
	transition: stroke .3s ease;
	transition-delay: calc(var(--i) * 40ms);
}
.rts-js .rts-results:not(.is-in) .rts-dial-tick { stroke: var(--rts-line); }
.rts-dial-hand {
	stroke: var(--rts-ink);
	stroke-width: 2.4;
	stroke-linecap: round;
	transform-origin: 32px 32px;
	animation: rts-dial 12s linear infinite;
}
@keyframes rts-dial { to { transform: rotate(360deg); } }
.rts-dial-pin { fill: var(--rts-ink); }

/* ==========================================================================
   7. ГДЕ ROBIN ОСОБЕННО ПОЛЕЗЕН
   ========================================================================== */
.rts-cases {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
	margin: 48px 0 0;
	padding: 0;
	list-style: none;
}
.rts-case {
	display: flex;
	flex-direction: column;
	width: calc((100% - 32px) / 3);
	padding: 26px;
	border: 1px solid var(--rts-ash);
	border-radius: 28px;
	background: var(--rts-parchment);
	transition: border-color .2s ease, transform .3s var(--rts-ease), background-color .2s ease;
}
.rts-case:hover { border-color: var(--rts-result-soft); background: #fff; transform: translateY(-3px); }
.rts-case-top { display: flex; align-items: flex-start; justify-content: space-between; }
.rts-case-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border: 1px solid #efeeed;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px -1px rgba(0, 0, 0, 0.05);
	color: var(--rts-ink);
	transition: background-color .2s ease, color .2s ease, transform .3s var(--rts-ease);
}
.rts-case:hover .rts-case-ico { background: var(--rts-accent); color: #fff; transform: rotate(-6deg); }
.rts-case-num { font-family: var(--rts-mono); font-size: 12px; color: var(--rts-accent); }
.rts-case-title {
	margin: 22px 0 0;
	font-family: var(--robin-font-head);
	font-size: 21px;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--rts-ink);
}
.rts-case-text {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: -0.02em;
	color: var(--rts-graphite);
}

/* ==========================================================================
   Появление при скролле (только с JS)
   ========================================================================== */
.rts-js .rts-step[data-rts-reveal],
.rts-js .rts-voice-grid [data-rts-reveal],
.rts-js .rts-case[data-rts-reveal],
.rts-js .rts-widget[data-rts-reveal] {
	transition: opacity .7s var(--rts-ease), transform .7s var(--rts-ease), border-color .2s ease, background-color .2s ease;
	transition-delay: calc(var(--i, 0) * 90ms), calc(var(--i, 0) * 90ms), 0s, 0s;
}
.rts-js .rts-step[data-rts-reveal]:not(.is-in),
.rts-js .rts-voice-grid [data-rts-reveal]:not(.is-in),
.rts-js .rts-case[data-rts-reveal]:not(.is-in),
.rts-js .rts-widget[data-rts-reveal]:not(.is-in) {
	opacity: 0;
	transform: translateY(18px);
}

/* ==========================================================================
   Адаптив
   ========================================================================== */
@media (max-width: 1279px) {
	.rts-steps,
	.rts-voice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rts-hero-title { font-size: 44px; }
}
@media (max-width: 1023px) {
	.rts-hero { grid-template-columns: minmax(0, 1fr); padding: 40px 32px; }
	.rts-hero-visual { max-width: 560px; width: 100%; margin: 0 auto; }
	.rts-pains,
	.rts-self { grid-template-columns: minmax(0, 1fr); gap: 36px; padding: 40px 32px; }
	.rts-pains-head { position: static; }
	.rts-voice-top { grid-template-columns: minmax(0, 1fr); }
	.rts-results { padding: 40px 32px; }
	.rts-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rts-tile--load { grid-column: 1 / -1; grid-row: auto; }
	.rts-case { width: calc((100% - 16px) / 2); }
	.rts-h2 { font-size: 36px; }
	.rts-rail { display: none; }
}
@media (max-width: 639px) {
	.rts-hero { padding: 32px 20px; border-radius: 20px; }
	.rts-hero-title { font-size: 34px; }
	.rts-hero-lead { font-size: 17px; }
	.rts-hero-visual { padding: 44px 0 52px; }
	.rts-float--react { left: 0; }
	.rts-float small { display: none; }
	.rts-ticket { grid-template-columns: 30px minmax(0, 1fr) auto; gap: 10px; }
	.rts-ticket-ch { width: 30px; height: 30px; }
	.rts-h2 { font-size: 30px; line-height: 1.12; }
	.rts-pains,
	.rts-self,
	.rts-results { padding: 32px 20px; border-radius: 20px; }
	.rts-routine { grid-template-columns: minmax(0, 1fr); }
	.rts-donut { padding: 16px; }
	.rts-donut svg,
	.rts-donut-val { width: 80px; height: 80px; }
	.rts-donut-val { top: 16px; left: 16px; font-size: 22px; }
	.rts-chain { flex-direction: column; align-items: flex-start; }
	.rts-chain li + li { margin-left: 0; }
	.rts-chain li + li::before { display: none; }
	.rts-steps,
	.rts-voice-grid,
	.rts-bento { grid-template-columns: minmax(0, 1fr); }
	.rts-case { width: 100%; }
	.rts-gauge-val { font-size: 52px; }
	.rts-widget { padding: 16px; }
	.rts-skill { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	.rts-hero *,
	.rts-self *,
	.rts-results *,
	#process *,
	#voice * {
		animation: none !important;
	}
	.rts-ticket,
	.rts-st--done,
	.rts-st--human { opacity: 1 !important; transform: none !important; }
	.rts-st--new { opacity: 0 !important; }
	.rts-console-meter-track i { width: 20%; }
}

/* Sticky-навигация по разделам — только с планшета: на телефоне плашка
   переносится в несколько строк и закрывает заголовки секций. */
@media (max-width: 767px) {
	.rts-jumpnav { display: none !important; }
}