/* --------------------------------------------------------------------------
   «ROBIN.Ассистент для закупок» (page-ai-procurement.php).
   Визуальный язык — как у /ai-communications/, /platform/,
   /corporate-assistants/: кремовые панели, рамки Ash, моно-подписи,
   акцент #A30C33 / #C52229. Префикс .rpr-*; общий .rcm-lead — из style.css.
   JS-поведение — assets/js/robin-ai-procurement.js.
   -------------------------------------------------------------------------- */
/* Файл подключается только на этой странице — переменные можно держать на :root */
:root {
	--rpr-parchment: #f6f3f1;
	--rpr-paper: #fbfaf9;
	--rpr-ash: #cecac8;
	--rpr-line: #e7e3e0;
	--rpr-sk: #e9e5e2;
	--rpr-ink: #242424;
	--rpr-graphite: #4e4d4d;
	--rpr-smoke: #797776;
	--rpr-accent: #a30c33;
	--rpr-result: #c52229;
	--rpr-soft: #eab0b2;
	--rpr-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.rpr-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(--rpr-ink);
}
.rpr-h2 em { font-style: normal; color: var(--rpr-accent); }
.rpr-h2--center { max-width: 48rem; margin: 0 auto; text-align: center; }
.rpr-panel {
	padding: 56px;
	border-radius: 24px;
	background: var(--rpr-parchment);
	color: var(--rpr-ink);
}
.rpr-dot {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--rpr-result);
	animation: rpr-ping 2s ease-out infinite;
}
@keyframes rpr-ping {
	0%   { box-shadow: 0 0 0 0 rgba(197, 34, 41, 0.45); }
	100% { box-shadow: 0 0 0 9px rgba(197, 34, 41, 0); }
}

/* ==========================================================================
   HERO
   ========================================================================== */
.rpr-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: 32px 48px 36px;
	border-radius: 24px;
	background: var(--rpr-parchment);
	color: var(--rpr-ink);
}
.rpr-hero-top {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: 48px;
	align-items: end;
	margin-top: 28px;
}
.rpr-hero-title {
	margin: 0;
	font-family: var(--robin-font-head);
	font-weight: 500;
	font-size: 60px;
	line-height: 1.02;
	letter-spacing: -0.035em;
	color: var(--rpr-ink);
}
.rpr-hero-title em { display: block; font-style: normal; color: var(--rpr-accent); }
.rpr-hero-sub {
	margin: 18px 0 0;
	font-size: 18px;
	line-height: 1.5;
	letter-spacing: -0.02em;
	color: var(--rpr-graphite);
}
.rpr-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.rpr-hero-aside {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-left: 24px;
	border-left: 2px solid var(--rpr-accent);
	font-size: 15px;
	line-height: 1.55;
	letter-spacing: -0.02em;
	color: var(--rpr-graphite);
}
.rpr-hero-aside p { margin: 0; }
.rpr-hero-awards {
	max-width: 62rem;
	margin: 24px auto 0;
	font-size: 13px;
	line-height: 1.55;
	text-align: center;
	color: #9f9f9f;
}

/* ---------- Доска «сравнение КП» ----------
   Цикл 8s: 0–10% строки появляются; 10–28% КП «распознаются» (иконка
   документа); 22–40% проверка (ожидание → галочка); 30–50% столбцы растут;
   52–62% прочерчивается линия НМЦ; 64% подсвечивается минимальное
   предложение; 94–100% сброс. Задержка строки — --i × 0.12s. */
.rpr-board {
	margin: 36px 0 0;
	border: 1px solid var(--rpr-ash);
	border-radius: 28px;
	background: #fff;
	box-shadow: 0 40px 70px -50px rgba(80, 20, 30, 0.45);
	overflow: hidden;
}
.rpr-board-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--rpr-line);
	background: var(--rpr-paper);
}
.rpr-board-search {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 260px;
	padding: 8px 16px;
	border: 1px solid var(--rpr-ash);
	border-radius: 999px;
	background: #fff;
	font-size: 14px;
	color: var(--rpr-smoke);
}
.rpr-typing {
	display: inline-block;
	overflow: hidden;
	white-space: nowrap;
	border-right: 1.5px solid var(--rpr-accent);
	color: var(--rpr-ink);
	animation: rpr-type 8s steps(17) infinite, rpr-caret .8s step-end infinite;
}
@keyframes rpr-type {
	0%        { max-width: 0; }
	14%, 92%  { max-width: 17ch; }
	100%      { max-width: 0; }
}
@keyframes rpr-caret { 50% { border-color: transparent; } }
.rpr-board-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rpr-tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	border: 1px solid var(--rpr-line);
	border-radius: 999px;
	font-family: var(--rpr-mono);
	font-size: 11px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rpr-smoke);
	animation: 8s ease-in-out infinite;
}
.rpr-tag:nth-child(1) { animation-name: rpr-tag-0; }
.rpr-tag:nth-child(2) { animation-name: rpr-tag-1; }
.rpr-tag:nth-child(3) { animation-name: rpr-tag-2; }
.rpr-tag:nth-child(4) { animation-name: rpr-tag-3; }
@keyframes rpr-tag-0 { 0%, 9% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; } 11%, 30% { color: var(--rpr-accent); border-color: var(--rpr-soft); background: #fff5f5; } 34%, 100% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; } }
@keyframes rpr-tag-1 { 0%, 21% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; } 23%, 42% { color: var(--rpr-accent); border-color: var(--rpr-soft); background: #fff5f5; } 46%, 100% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; } }
@keyframes rpr-tag-2 { 0%, 29% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; } 31%, 52% { color: var(--rpr-accent); border-color: var(--rpr-soft); background: #fff5f5; } 56%, 100% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; } }
@keyframes rpr-tag-3 {
	0%, 51%   { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; }
	54%, 92%  { color: #fff; border-color: var(--rpr-accent); background: var(--rpr-accent); }
	96%, 100% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: transparent; }
}

.rpr-board-body {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 28px 28px;
	--track-x: 150px; /* левый край ценовой дорожки: ава + КП + проверка + отступы */
}
.rpr-row {
	display: grid;
	grid-template-columns: 34px 34px 34px minmax(0, 1fr);
	align-items: center;
	gap: 16px;
	animation: rpr-row 8s ease-in-out infinite;
	animation-delay: calc(var(--i) * .12s);
}
@keyframes rpr-row {
	0%        { opacity: 0; transform: translateY(6px); }
	5%, 93%   { opacity: 1; transform: none; }
	100%      { opacity: 0; }
}
.rpr-row-ava {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: var(--rpr-parchment);
	font-family: var(--rpr-mono);
	font-size: 13px;
	color: var(--rpr-graphite);
}
.rpr-row-doc {
	position: relative;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border: 1px dashed var(--rpr-ash);
	border-radius: 10px;
	color: var(--rpr-ash);
	animation: rpr-doc 8s ease-in-out infinite;
	animation-delay: calc(var(--i) * .12s);
}
.rpr-row-doc i {
	position: absolute;
	left: 4px;
	right: 4px;
	top: 4px;
	height: 2px;
	background: var(--rpr-result);
	opacity: 0;
	animation: rpr-doc-scan 8s linear infinite;
	animation-delay: calc(var(--i) * .12s);
}
@keyframes rpr-doc {
	0%, 9%    { border-style: dashed; color: var(--rpr-ash); background: transparent; }
	12%, 93%  { border-style: solid; border-color: var(--rpr-line); color: var(--rpr-accent); background: #fff; }
	100%      { border-style: dashed; color: var(--rpr-ash); }
}
@keyframes rpr-doc-scan {
	0%, 12%  { opacity: 0; transform: translateY(0); }
	13%      { opacity: 1; }
	24%      { opacity: 1; transform: translateY(24px); }
	25%,100% { opacity: 0; }
}
.rpr-row-check { position: relative; width: 34px; height: 34px; }
.rpr-row-check-wait,
.rpr-row-check-ok {
	position: absolute;
	inset: 6px;
	border-radius: 50%;
}
.rpr-row-check-wait {
	border: 2px solid var(--rpr-line);
	border-top-color: var(--rpr-accent);
	animation: rpr-spin .8s linear infinite, rpr-wait 8s ease-in-out infinite;
	animation-delay: 0s, calc(var(--i) * .12s);
}
@keyframes rpr-spin { to { transform: rotate(360deg); } }
@keyframes rpr-wait { 0%, 20% { opacity: 0; } 22%, 34% { opacity: 1; } 36%, 100% { opacity: 0; } }
.rpr-row-check-ok {
	display: grid;
	place-items: center;
	background: var(--rpr-accent);
	color: #fff;
	transform: scale(0);
	animation: rpr-ok 8s cubic-bezier(.34, 1.56, .64, 1) infinite;
	animation-delay: calc(var(--i) * .12s);
}
@keyframes rpr-ok { 0%, 34% { transform: scale(0); } 38%, 93% { transform: scale(1); } 97%, 100% { transform: scale(0); } }
.rpr-row-track {
	position: relative;
	height: 14px;
	border-radius: 7px;
	background: var(--rpr-parchment);
}
.rpr-row-bar {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: var(--w);
	border-radius: inherit;
	background: #d9d3cf;
	transform-origin: left;
	animation: rpr-bar 8s cubic-bezier(.22, 1, .36, 1) infinite;
	animation-delay: calc(var(--i) * .12s);
}
@keyframes rpr-bar { 0%, 30% { transform: scaleX(0); } 48%, 93% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
.rpr-row--min .rpr-row-bar { animation-name: rpr-bar, rpr-bar-min; animation-duration: 8s, 8s; animation-iteration-count: infinite, infinite; }
@keyframes rpr-bar-min {
	0%, 63%   { background: #d9d3cf; box-shadow: none; }
	66%, 93%  { background: linear-gradient(to right, var(--rpr-accent), var(--rpr-result)); box-shadow: 0 6px 16px -6px rgba(197, 34, 41, 0.7); }
	100%      { background: #d9d3cf; }
}
.rpr-row-min {
	position: absolute;
	left: calc(var(--w) + 10px);
	top: 50%;
	padding: 2px 7px;
	border-radius: 999px;
	background: var(--rpr-result);
	font-family: var(--rpr-mono);
	font-size: 10px;
	color: #fff;
	transform: translateY(-50%) scale(0);
	animation: rpr-min 8s cubic-bezier(.34, 1.56, .64, 1) infinite;
	animation-delay: calc(var(--i) * .12s);
}
@keyframes rpr-min { 0%, 64% { transform: translateY(-50%) scale(0); } 68%, 93% { transform: translateY(-50%) scale(1); } 97%, 100% { transform: translateY(-50%) scale(0); } }
.rpr-nmc {
	position: absolute;
	top: 14px;
	bottom: 18px;
	left: calc(28px + var(--track-x) + (100% - 56px - var(--track-x)) * var(--nmc-f, .69));
	border-left: 2px dashed var(--rpr-accent);
	transform-origin: top;
	animation: rpr-nmc 8s ease-in-out infinite;
}
@keyframes rpr-nmc { 0%, 52% { transform: scaleY(0); opacity: 0; } 53% { opacity: 1; } 62%, 93% { transform: scaleY(1); opacity: 1; } 100% { opacity: 0; } }
.rpr-nmc-tag {
	position: absolute;
	top: -12px;
	left: -1px;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--rpr-accent);
	font-family: var(--rpr-mono);
	font-size: 10px;
	color: #fff;
	transform: translateX(-50%);
}

.rpr-board-kpis {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--rpr-line);
}
.rpr-board-kpis li {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 28px 24px;
}
.rpr-board-kpis li + li { border-left: 1px solid var(--rpr-line); }
.rpr-kpi-value {
	font-family: var(--robin-font-head);
	font-size: 36px;
	line-height: 1;
	letter-spacing: -0.035em;
	color: var(--rpr-accent);
}
.rpr-kpi-label { font-size: 14px; line-height: 1.45; letter-spacing: -0.02em; color: var(--rpr-graphite); }

/* ==========================================================================
   ХАБ ВОЗМОЖНОСТЕЙ
   ========================================================================== */
.rpr-hub {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 200px minmax(0, 1fr);
	align-items: center;
	gap: 0 56px;
	margin-top: 48px;
}
.rpr-hub-col { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.rpr-cap {
	position: relative;
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 16px;
	padding: 20px;
	border: 1px solid var(--rpr-line);
	border-radius: 22px;
	background: #fff;
	transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.rpr-cap:hover { border-color: var(--rpr-soft); transform: translateY(-2px); box-shadow: 0 18px 32px -24px rgba(163, 12, 51, 0.5); }
.rpr-cap-ico {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 13px;
	background: var(--rpr-parchment);
	color: var(--rpr-accent);
	transition: background .25s ease, color .25s ease;
}
.rpr-cap:hover .rpr-cap-ico { background: var(--rpr-accent); color: #fff; }
.rpr-cap-title { margin: 0; font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; color: var(--rpr-ink); }
.rpr-cap-text { margin: 6px 0 0; font-size: 14px; line-height: 1.5; letter-spacing: -0.02em; color: var(--rpr-graphite); }
/* Провод от карточки к ядру */
.rpr-cap-wire {
	position: absolute;
	top: 50%;
	width: 57px;
	height: 0;
	border-top: 1px dashed var(--rpr-ash);
}
.rpr-hub-col--left .rpr-cap-wire { left: 100%; }
.rpr-hub-col--right .rpr-cap-wire { right: 100%; }
.rpr-cap-wire::after {
	content: "";
	position: absolute;
	top: -3.5px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--rpr-ash);
}
.rpr-hub-col--left .rpr-cap-wire::after { right: -3px; }
.rpr-hub-col--right .rpr-cap-wire::after { left: -3px; }
.rpr-cap:hover .rpr-cap-wire {
	border-top: 2px solid transparent;
	background: linear-gradient(to right, var(--rpr-result) 50%, transparent 0) 0 -1px / 8px 2px repeat-x;
	height: 2px;
	animation: rpr-wire .6s linear infinite;
}
.rpr-hub-col--right .rpr-cap:hover .rpr-cap-wire { animation-direction: reverse; }
.rpr-cap:hover .rpr-cap-wire::after { background: var(--rpr-result); }
@keyframes rpr-wire { to { background-position: 8px -1px; } }

.rpr-hub-core {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: 22px 18px;
	border: 1.5px solid var(--rpr-accent);
	border-radius: 28px;
	background: #fff;
	box-shadow: 0 30px 50px -36px rgba(163, 12, 51, 0.6);
}
.rpr-hub-kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--rpr-mono);
	font-size: 11px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rpr-accent);
}
.rpr-hub-chat {
	display: flex;
	flex-direction: column;
	gap: 5px;
	align-self: stretch;
	padding: 10px 12px;
	border-radius: 14px 14px 14px 4px;
	background: var(--rpr-parchment);
}
.rpr-hub-chat i { height: 6px; border-radius: 3px; background: var(--rpr-sk); }
.rpr-hub-chat--out { align-items: flex-end; border-radius: 14px 14px 4px 14px; background: #fff5f5; }
.rpr-hub-chat--out i { background: var(--rpr-soft); }
.rpr-hub-icons { display: grid; grid-template-columns: repeat(3, 40px); gap: 8px; }
.rpr-hub-ico {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--rpr-line);
	border-radius: 12px;
	color: var(--rpr-smoke);
	transition: background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
	animation: rpr-hub-ico 6s ease-in-out infinite;
	animation-delay: calc(var(--k) * 1s);
}
@keyframes rpr-hub-ico {
	0%, 14%, 100% { color: var(--rpr-smoke); border-color: var(--rpr-line); background: #fff; }
	4%, 10%       { color: var(--rpr-accent); border-color: var(--rpr-soft); background: #fff5f5; }
}
.rpr-hub:has(.rpr-cap[data-k="0"]:hover) .rpr-hub-ico[data-k="0"],
.rpr-hub:has(.rpr-cap[data-k="1"]:hover) .rpr-hub-ico[data-k="1"],
.rpr-hub:has(.rpr-cap[data-k="2"]:hover) .rpr-hub-ico[data-k="2"],
.rpr-hub:has(.rpr-cap[data-k="3"]:hover) .rpr-hub-ico[data-k="3"],
.rpr-hub:has(.rpr-cap[data-k="4"]:hover) .rpr-hub-ico[data-k="4"],
.rpr-hub:has(.rpr-cap[data-k="5"]:hover) .rpr-hub-ico[data-k="5"] {
	animation: none;
	background: var(--rpr-accent);
	border-color: var(--rpr-accent);
	color: #fff;
	transform: scale(1.12);
}
.rpr-hub:has(.rpr-cap:hover) .rpr-hub-ico { animation: none; }

/* ==========================================================================
   ТРАССА ШАГОВ
   ========================================================================== */
.rpr-track { position: relative; margin-top: 56px; --p: 0; }
.rpr-track-list {
	display: grid;
	grid-template-columns: repeat(var(--n), minmax(0, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rpr-track-rail {
	position: absolute;
	left: calc(100% / var(--n) / 2 - 10px);
	right: calc(100% / var(--n) / 2 - 10px);
	top: 27px;
	height: 2px;
	background: var(--rpr-line);
}
.rpr-track-fill {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, var(--rpr-accent), var(--rpr-result));
	transform: scaleX(var(--p));
	transform-origin: left;
	transition: transform .15s linear;
}
.rpr-step { position: relative; text-align: center; }
.rpr-step-node {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	margin: 0 auto;
	border: 1px solid var(--rpr-ash);
	border-radius: 18px;
	background: #fff;
	color: var(--rpr-smoke);
	transition: background .35s ease, color .35s ease, border-color .35s ease, transform .35s cubic-bezier(.34, 1.56, .64, 1), box-shadow .35s ease;
}
.rpr-step.is-on .rpr-step-node {
	border-color: var(--rpr-accent);
	background: var(--rpr-accent);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 14px 24px -14px rgba(163, 12, 51, 0.8);
}
.rpr-step-num {
	display: block;
	margin-top: 16px;
	font-family: var(--rpr-mono);
	font-size: 12px;
	color: var(--rpr-smoke);
	transition: color .35s ease;
}
.rpr-step.is-on .rpr-step-num { color: var(--rpr-accent); }
.rpr-step-title { margin: 6px 0 0; font-size: 17px; font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; color: var(--rpr-ink); }
.rpr-step-text { margin: 8px 0 0; font-size: 14px; line-height: 1.5; letter-spacing: -0.02em; color: var(--rpr-graphite); }
.rpr-track.is-js .rpr-step:not(.is-on) .rpr-step-title,
.rpr-track.is-js .rpr-step:not(.is-on) .rpr-step-text { opacity: .55; }
.rpr-step-title, .rpr-step-text { transition: opacity .35s ease; }

/* ==========================================================================
   БЕНТО ПРЕИМУЩЕСТВ
   ========================================================================== */
.rpr-bento {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-auto-rows: minmax(0, auto);
	gap: 16px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
}
.rpr-bento-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 28px;
	border: 1px solid var(--rpr-line);
	border-radius: 28px;
	background: #fff;
	transition: border-color .25s ease, transform .25s ease;
}
.rpr-bento-card:hover { border-color: var(--rpr-soft); }
.rpr-bento-card--hero { grid-row: span 2; background: linear-gradient(160deg, #fff 55%, #fff5f5); }
.rpr-bento-ico {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin-bottom: 20px;
	border-radius: 14px;
	background: var(--rpr-parchment);
	color: var(--rpr-accent);
	transition: transform .35s cubic-bezier(.34, 1.56, .64, 1), background .25s ease, color .25s ease;
}
.rpr-bento-card:hover .rpr-bento-ico { transform: rotate(-8deg) scale(1.06); background: var(--rpr-accent); color: #fff; }
.rpr-bento-num {
	position: absolute;
	top: 24px;
	right: 26px;
	font-family: var(--rpr-mono);
	font-size: 12px;
	color: var(--rpr-accent);
}
.rpr-bento-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(--rpr-ink); }
.rpr-bento-card--hero .rpr-bento-title { margin-top: auto; font-size: 28px; }
.rpr-bento-text { margin: 10px 0 0; font-size: 15px; line-height: 1.5; letter-spacing: -0.02em; color: var(--rpr-graphite); }

/* Иллюстрация «разрозненные документы → сводная таблица» */
.rpr-merge {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	min-height: 180px;
	margin-bottom: 24px;
	border-radius: 20px;
	background: var(--rpr-parchment);
}
.rpr-merge-docs { display: grid; grid-template-columns: repeat(2, 38px); gap: 8px; }
.rpr-merge-doc {
	display: grid;
	place-items: center;
	width: 38px;
	height: 46px;
	border: 1px solid var(--rpr-ash);
	border-radius: 8px;
	background: #fff;
	color: var(--rpr-smoke);
	animation: rpr-merge-doc 5s ease-in-out infinite;
	animation-delay: calc(var(--d) * .25s);
}
.rpr-merge-doc:nth-child(odd) { transform: rotate(-6deg); }
.rpr-merge-doc:nth-child(even) { transform: rotate(5deg); }
@keyframes rpr-merge-doc {
	0%, 20%, 100% { translate: 0 0; opacity: 1; }
	40%           { translate: 24px 0; opacity: .2; }
	60%           { translate: 0 0; opacity: 1; }
}
.rpr-merge-arrow {
	width: 44px;
	height: 2px;
	background: linear-gradient(to right, var(--rpr-result) 50%, transparent 0) 0 0 / 8px 2px repeat-x;
	animation: rpr-wire-h .7s linear infinite;
}
@keyframes rpr-wire-h { to { background-position: 8px 0; } }
.rpr-merge-table {
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 130px;
	padding: 12px;
	border: 1px solid var(--rpr-soft);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 14px 28px -18px rgba(163, 12, 51, 0.6);
}
.rpr-merge-table span { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 5px; }
.rpr-merge-table i {
	height: 7px;
	border-radius: 3px;
	background: var(--rpr-sk);
	animation: rpr-merge-row 5s ease-in-out infinite;
	animation-delay: calc(var(--d) * .25s);
}
.rpr-merge-table span:first-child i { background: var(--rpr-accent); animation: none; }
@keyframes rpr-merge-row { 0%, 35%, 100% { background: var(--rpr-sk); } 45%, 85% { background: var(--rpr-soft); } }

/* ==========================================================================
   КАНБАН ЗАДАЧ
   ========================================================================== */
.rpr-kanban {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
	margin-top: 48px;
}
.rpr-lane {
	padding: 14px;
	border: 1px solid var(--rpr-ash);
	border-radius: 24px;
	background: var(--rpr-parchment);
}
.rpr-lane-head { display: flex; align-items: center; gap: 10px; padding: 4px 4px 14px; }
.rpr-lane-ico {
	display: grid;
	place-items: center;
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: var(--rpr-accent);
	color: #fff;
}
.rpr-lane-title { flex: 1; margin: 0; font-size: 15px; font-weight: 500; line-height: 1.25; letter-spacing: -0.02em; color: var(--rpr-ink); }
.rpr-lane-count {
	flex: none;
	min-width: 24px;
	padding: 2px 7px;
	border-radius: 999px;
	background: #fff;
	font-family: var(--rpr-mono);
	font-size: 11px;
	text-align: center;
	color: var(--rpr-smoke);
}
.rpr-lane-list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rpr-lane-list li {
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr);
	align-items: start;
	gap: 10px;
	padding: 12px 14px;
	border: 1px solid var(--rpr-line);
	border-radius: 14px;
	background: #fff;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: -0.02em;
	color: var(--rpr-ink);
	transition: border-color .2s ease, transform .2s ease;
}
.rpr-lane-list li:hover { border-color: var(--rpr-soft); transform: translateX(3px); }
.rpr-lane-check {
	display: grid;
	place-items: center;
	width: 20px;
	height: 20px;
	border: 1px solid var(--rpr-ash);
	border-radius: 6px;
	color: transparent;
	transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.rpr-lane-list li:hover .rpr-lane-check { background: var(--rpr-accent); border-color: var(--rpr-accent); color: #fff; }
/* Каскадное появление карточек внутри колонок */
.rpr-kanban.rpr-reveal-ready .rpr-lane-list li { opacity: 0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease, border-color .2s ease; transition-delay: calc(var(--i, 0) * 120ms + var(--j) * 90ms + 200ms); }
.rpr-kanban.rpr-reveal-ready.is-inview .rpr-lane-list li { opacity: 1; transform: none; }
.rpr-kanban.rpr-reveal-ready.is-inview .rpr-lane-list li:hover { transform: translateX(3px); transition-delay: 0s; }
.rpr-kanban.rpr-reveal-ready.is-inview .rpr-lane-check { animation: rpr-check-in .5s ease both; animation-delay: calc(var(--i, 0) * 120ms + var(--j) * 90ms + 600ms); }
@keyframes rpr-check-in {
	0%   { background: transparent; color: transparent; }
	50%  { background: var(--rpr-accent); color: #fff; border-color: var(--rpr-accent); transform: scale(1.15); }
	100% { background: transparent; color: transparent; transform: scale(1); }
}

.rpr-webinar { margin-top: 40px; text-align: center; }
.rpr-webinar-btn {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 8px 22px 8px 8px;
	border: 1px solid var(--rpr-ash);
	border-radius: 999px;
	background: #fff;
	cursor: pointer;
	transition: gap .2s ease, border-color .2s ease;
}
.rpr-webinar-btn:hover { gap: 18px; border-color: var(--rpr-soft); }
.rpr-webinar-play {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--rpr-accent);
	color: #fff;
	animation: rpr-ping 2s ease-out infinite;
}
.rpr-webinar-play svg { margin-left: 2px; }
.rpr-webinar-text {
	font-family: var(--rpr-mono);
	font-size: 13px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rpr-accent);
}

/* ==========================================================================
   КЕЙСЫ
   ========================================================================== */
.rpr-cases {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
}
.rpr-case {
	display: flex;
	flex-direction: column;
	padding: 28px;
	border: 1px solid var(--rpr-line);
	border-radius: 28px;
	background: #fff;
	transition: border-color .25s ease, box-shadow .25s ease;
}
.rpr-case:hover { border-color: var(--rpr-soft); box-shadow: 0 22px 40px -30px rgba(163, 12, 51, 0.55); }
.rpr-case-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-family: var(--rpr-mono);
	font-size: 12px;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--rpr-smoke);
}
.rpr-case-num { color: var(--rpr-accent); }
.rpr-case-nda { padding: 2px 8px; border-radius: 999px; background: #fff0f1; color: var(--rpr-accent); }
.rpr-case-metric {
	margin: 18px 0 0;
	font-family: var(--robin-font-head);
	font-size: 26px;
	line-height: 1.15;
	letter-spacing: -0.025em;
	color: var(--rpr-accent);
}
.rpr-case-text { margin: 12px 0 0; font-size: 15px; line-height: 1.5; letter-spacing: -0.02em; color: var(--rpr-graphite); }
.rpr-case-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: auto;
	padding-top: 20px;
	font-family: var(--rpr-mono);
	font-size: 12px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--rpr-accent);
	transition: gap .15s ease;
}
.rpr-case-link:hover { gap: 10px; }

/* ==========================================================================
   ПОЧЕМУ ВЫБИРАЮТ ROBIN
   ========================================================================== */
.rpr-why {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--rpr-ash);
}
.rpr-why li { padding: 28px 24px 8px 0; }
.rpr-why li + li { padding-left: 24px; border-left: 1px solid var(--rpr-line); }
.rpr-why-ico { display: grid; place-items: center; width: 40px; height: 40px; color: var(--rpr-accent); transition: transform .35s cubic-bezier(.34, 1.56, .64, 1); }
.rpr-why li:hover .rpr-why-ico { transform: translateY(-3px) scale(1.08); }
.rpr-why-title { margin: 14px 0 0; font-size: 17px; font-weight: 500; letter-spacing: -0.02em; color: var(--rpr-ink); }
.rpr-why-text { margin: 8px 0 0; font-size: 14px; line-height: 1.5; letter-spacing: -0.02em; color: var(--rpr-graphite); }

/* ---------- Появление по скроллу (только когда JS включил механизм) ---------- */
.rpr-reveal-ready > * {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .6s ease, transform .6s cubic-bezier(.22, 1, .36, 1);
	transition-delay: calc(var(--i, 0) * 90ms);
}
.rpr-reveal-ready.is-inview > * { opacity: 1; transform: none; }
.rpr-hub.rpr-reveal-ready > .rpr-hub-core { transform: scale(.94); }
.rpr-hub.rpr-reveal-ready.is-inview > .rpr-hub-core { transform: none; }
.rpr-hub.rpr-reveal-ready > .rpr-hub-col { opacity: 1; transform: none; }
.rpr-hub.rpr-reveal-ready .rpr-cap { opacity: 0; transition: opacity .5s ease, transform .5s ease, border-color .25s ease, box-shadow .25s ease; transition-delay: calc(var(--i) * 90ms + 150ms); }
.rpr-hub.rpr-reveal-ready .rpr-hub-col--left .rpr-cap { transform: translateX(-16px); }
.rpr-hub.rpr-reveal-ready .rpr-hub-col--right .rpr-cap { transform: translateX(16px); }
.rpr-hub.rpr-reveal-ready.is-inview .rpr-cap { opacity: 1; transform: none; }
.rpr-hub.rpr-reveal-ready.is-inview .rpr-cap:hover { transform: translateY(-2px); transition-delay: 0s; }

/* ==========================================================================
   Адаптив
   ========================================================================== */
@media (max-width: 1023px) {
	.rpr-hero { padding: 24px 24px 28px; }
	.rpr-hero-top { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.rpr-hero-title { font-size: 46px; }
	.rpr-panel { padding: 40px 28px; }
	.rpr-h2 { font-size: 36px; }
	.rpr-hub { grid-template-columns: minmax(0, 1fr); gap: 14px; }
	.rpr-hub-core { order: -1; flex-direction: row; flex-wrap: wrap; justify-content: center; }
	.rpr-hub-chat { display: none; }
	.rpr-hub-icons { grid-template-columns: repeat(6, 40px); }
	.rpr-cap-wire { display: none; }
	.rpr-track-list { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.rpr-track-rail { left: 27px; right: auto; top: 28px; bottom: 28px; width: 2px; height: auto; }
	.rpr-track-fill { transform: scaleY(var(--p)); transform-origin: top; }
	.rpr-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 20px; text-align: left; }
	.rpr-step-node { grid-row: 1 / span 3; margin: 0; }
	.rpr-step-num { margin-top: 2px; }
	.rpr-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rpr-bento-card--hero { grid-column: 1 / -1; grid-row: auto; }
	.rpr-kanban { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rpr-cases { grid-template-columns: minmax(0, 1fr); }
	.rpr-why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rpr-why li:nth-child(3) { padding-left: 0; border-left: 0; }
}
@media (max-width: 639px) {
	.rpr-hero { padding: 20px 16px 24px; border-radius: 20px; }
	.rpr-hero-title { font-size: 36px; }
	.rpr-hero-sub { font-size: 16px; }
	.rpr-hero-aside { padding-left: 16px; font-size: 14px; }
	.rpr-board { border-radius: 22px; }
	.rpr-board-search { min-width: 0; flex: 1 1 100%; }
	.rpr-board-tags { display: none; }
	.rpr-board-body { padding: 20px 14px 22px; gap: 8px; --track-x: 108px; }
	.rpr-nmc { left: calc(14px + var(--track-x) + (100% - 28px - var(--track-x)) * var(--nmc-f, .69)); }
	.rpr-row { grid-template-columns: 28px 28px 28px minmax(0, 1fr); gap: 8px; }
	.rpr-row-ava, .rpr-row-doc, .rpr-row-check { width: 28px; height: 28px; }
	.rpr-row-check-wait, .rpr-row-check-ok { inset: 4px; }
	.rpr-board-kpis { grid-template-columns: minmax(0, 1fr); }
	.rpr-board-kpis li + li { border-left: 0; border-top: 1px solid var(--rpr-line); }
	.rpr-board-kpis li { padding: 18px 20px; }
	.rpr-panel { padding: 32px 16px; border-radius: 20px; }
	.rpr-h2 { font-size: 30px; line-height: 1.12; }
	.rpr-hub-icons { grid-template-columns: repeat(6, 34px); gap: 6px; }
	.rpr-hub-ico { width: 34px; height: 34px; }
	.rpr-bento, .rpr-kanban, .rpr-why { grid-template-columns: minmax(0, 1fr); }
	.rpr-why li, .rpr-why li + li { padding: 22px 0 6px; border-left: 0; }
	.rpr-why li + li { border-top: 1px solid var(--rpr-line); }
	.rpr-merge { min-height: 150px; }
}

@media (prefers-reduced-motion: reduce) {
	.rpr-hero *, .rpr-panel *, #how *, #tasks * {
		animation: none !important;
		transition: none !important;
	}
	.rpr-typing { max-width: none; border-right: 0; }
	.rpr-row-check-wait { display: none; }
	.rpr-row-check-ok, .rpr-row-min { transform: none; }
	.rpr-row-min { transform: translateY(-50%); }
	.rpr-row--min .rpr-row-bar { background: var(--rpr-accent); }
	.rpr-reveal-ready > *, .rpr-hub.rpr-reveal-ready .rpr-cap { opacity: 1; transform: none; }
}