/* --------------------------------------------------------------------------
   Центральное «ядро» hero (.robin-hero-core, см. style.css) — своя
   анимированная графика для каждого раздела вместо маскота-птицы.
   Птица (platform-hero-mascot.webp) остаётся только на
   /corporate-assistants/, чтобы образ не повторялся из раздела в раздел.

   .robin-hero-core-art — квадратная сцена в видимой (верхние 3/4) части
   сферы; рисунок — белая линейная графика поверх красного градиента.
     --chart  — «Анализ и консалтинг»: столбцы растут, тренд прорисовывается;
     --radar  — «Центр компетенций и поддержка»: радар мониторинга 24/7;
     --path   — «Академия»: кольцо прогресса обучения с контрольными точками.
   -------------------------------------------------------------------------- */
.robin-hero-core-art {
	position: absolute;
	left: 50%;
	top: 12%;
	width: 58%;
	aspect-ratio: 1 / 1;
	transform: translateX(-50%);
	color: #fff;
}
.robin-hero-core-art svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
	position: relative;
}

/* ---------- --chart: аналитика ---------- */
.robin-hero-core-art--chart .rhc-grid line {
	stroke: rgba(255, 255, 255, 0.18);
	stroke-width: 0.6;
	stroke-dasharray: 2 3;
}
.robin-hero-core-art--chart .rhc-bar {
	fill: rgba(255, 255, 255, 0.22);
	stroke: rgba(255, 255, 255, 0.55);
	stroke-width: 0.8;
	transform-box: fill-box;
	transform-origin: 50% 100%;
	animation: rhc-bar-grow 6s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}
.robin-hero-core-art--chart .rhc-bar:nth-of-type(2) { animation-delay: 0.15s; }
.robin-hero-core-art--chart .rhc-bar:nth-of-type(3) { animation-delay: 0.3s; }
.robin-hero-core-art--chart .rhc-bar:nth-of-type(4) { animation-delay: 0.45s; }
.robin-hero-core-art--chart .rhc-bar:nth-of-type(5) { animation-delay: 0.6s; }
@keyframes rhc-bar-grow {
	0%        { transform: scaleY(0.08); opacity: 0.4; }
	22%, 82%  { transform: scaleY(1); opacity: 1; }
	100%      { transform: scaleY(0.08); opacity: 0.4; }
}
.robin-hero-core-art--chart .rhc-trend {
	fill: none;
	stroke: #fff;
	stroke-width: 2.4;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 100;
	animation: rhc-draw 6s ease-in-out infinite;
	filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.55));
}
@keyframes rhc-draw {
	0%, 12%   { stroke-dashoffset: 100; }
	45%, 82%  { stroke-dashoffset: 0; }
	100%      { stroke-dashoffset: 100; opacity: 0; }
}
.robin-hero-core-art--chart .rhc-tip {
	fill: #fff;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-tip 6s ease-in-out infinite;
}
.robin-hero-core-art--chart .rhc-tip-halo {
	fill: none;
	stroke: #fff;
	stroke-width: 1;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-halo 2s ease-out infinite;
}
@keyframes rhc-tip {
	0%, 42%   { transform: scale(0); }
	50%, 82%  { transform: scale(1); }
	100%      { transform: scale(0); }
}
@keyframes rhc-halo {
	0%   { transform: scale(0.6); opacity: 0.9; }
	100% { transform: scale(2.6); opacity: 0; }
}

/* ---------- --radar: мониторинг ---------- */
.robin-hero-core-art--radar .rhc-ring {
	fill: none;
	stroke: rgba(255, 255, 255, 0.28);
	stroke-width: 0.7;
}
.robin-hero-core-art--radar .rhc-cross {
	stroke: rgba(255, 255, 255, 0.16);
	stroke-width: 0.6;
}
.robin-hero-core-art--radar .rhc-sweep {
	position: absolute;
	inset: 2%;
	border-radius: 9999px;
	background: conic-gradient(from 0deg, transparent 0deg 290deg, rgba(255, 255, 255, 0.05) 300deg, rgba(255, 255, 255, 0.5) 360deg);
	animation: rhc-sweep 4.8s linear infinite;
}
@keyframes rhc-sweep {
	to { transform: rotate(360deg); }
}
/* Отметка «вспыхивает», когда луч проходит её угол:
   delay = длительность оборота × угол / 360 (угол — по часовой от верха). */
.robin-hero-core-art--radar .rhc-blip {
	fill: #fff;
	opacity: 0.15;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-blip 4.8s linear infinite;
	animation-delay: calc(4.8s * var(--a) / 360);
}
@keyframes rhc-blip {
	0%   { opacity: 1; transform: scale(1.6); }
	8%   { transform: scale(1); }
	60%  { opacity: 0.15; }
	100% { opacity: 0.15; transform: scale(1); }
}
.robin-hero-core-art--radar .rhc-hub {
	fill: #fff;
}
.robin-hero-core-art--radar .rhc-hub-halo {
	fill: none;
	stroke: rgba(255, 255, 255, 0.7);
	stroke-width: 0.8;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-halo 2.4s ease-out infinite;
}

/* ---------- --path: траектория обучения ---------- */
.robin-hero-core-art--path .rhc-track {
	fill: none;
	stroke: rgba(255, 255, 255, 0.2);
	stroke-width: 3;
}
.robin-hero-core-art--path .rhc-progress {
	fill: none;
	stroke: #fff;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-dasharray: 100;
	animation: rhc-progress 7s cubic-bezier(0.45, 0, 0.25, 1) infinite;
	filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.6));
}
@keyframes rhc-progress {
	0%, 6%    { stroke-dashoffset: 100; opacity: 1; }
	66%, 88%  { stroke-dashoffset: 0; opacity: 1; }
	96%       { stroke-dashoffset: 0; opacity: 0; }
	100%      { stroke-dashoffset: 100; opacity: 0; }
}
/* Контрольные точки модулей на 25/50/75/100% кольца — заливаются,
   когда до них дотягивается дуга прогресса. */
.robin-hero-core-art--path .rhc-node {
	fill: #c81f1a;
	stroke: rgba(255, 255, 255, 0.45);
	stroke-width: 1.4;
}
.robin-hero-core-art--path .rhc-node-on {
	fill: #fff;
	transform-box: fill-box;
	transform-origin: center;
	opacity: 0;
}
.robin-hero-core-art--path .rhc-node-on--1 { animation: rhc-node-1 7s ease-out infinite; }
.robin-hero-core-art--path .rhc-node-on--2 { animation: rhc-node-2 7s ease-out infinite; }
.robin-hero-core-art--path .rhc-node-on--3 { animation: rhc-node-3 7s ease-out infinite; }
.robin-hero-core-art--path .rhc-node-on--4 { animation: rhc-node-4 7s ease-out infinite; }
@keyframes rhc-node-1 { 0%, 24% { opacity: 0; transform: scale(0.3); } 27% { opacity: 1; transform: scale(1.35); } 30%, 88% { opacity: 1; transform: scale(1); } 96%, 100% { opacity: 0; } }
@keyframes rhc-node-2 { 0%, 37% { opacity: 0; transform: scale(0.3); } 40% { opacity: 1; transform: scale(1.35); } 43%, 88% { opacity: 1; transform: scale(1); } 96%, 100% { opacity: 0; } }
@keyframes rhc-node-3 { 0%, 50% { opacity: 0; transform: scale(0.3); } 53% { opacity: 1; transform: scale(1.35); } 56%, 88% { opacity: 1; transform: scale(1); } 96%, 100% { opacity: 0; } }
@keyframes rhc-node-4 { 0%, 64% { opacity: 0; transform: scale(0.3); } 67% { opacity: 1; transform: scale(1.35); } 70%, 88% { opacity: 1; transform: scale(1); } 96%, 100% { opacity: 0; } }

.robin-hero-core-art--path .rhc-cap {
	fill: none;
	stroke: #fff;
	stroke-width: 1.2;
	stroke-linecap: round;
	stroke-linejoin: round;
	transform-box: fill-box;
	transform-origin: 50% 100%;
	animation: rhc-cap 7s ease-in-out infinite;
}
@keyframes rhc-cap {
	0%, 62%  { transform: translateY(0) rotate(0deg); }
	68%      { transform: translateY(-5px) rotate(-6deg); }
	74%      { transform: translateY(0) rotate(0deg); }
	100%     { transform: translateY(0) rotate(0deg); }
}
.robin-hero-core-art--path .rhc-spark {
	fill: #fff;
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-spark 7s ease-out infinite;
}
.robin-hero-core-art--path .rhc-spark--2 { animation-delay: 0.12s; }
.robin-hero-core-art--path .rhc-spark--3 { animation-delay: 0.24s; }
@keyframes rhc-spark {
	0%, 66%  { opacity: 0; transform: scale(0) rotate(0deg); }
	71%      { opacity: 1; transform: scale(1) rotate(45deg); }
	80%,100% { opacity: 0; transform: scale(0.2) rotate(90deg); }
}

@media (prefers-reduced-motion: reduce) {
	.robin-hero-core-art *,
	.robin-hero-core-art .rhc-sweep {
		animation: none !important;
	}
	.robin-hero-core-art--chart .rhc-tip,
	.robin-hero-core-art--path .rhc-node-on { opacity: 1; transform: none; }
	.robin-hero-core-art--radar .rhc-blip { opacity: 0.8; }
	.robin-hero-core-art--path .rhc-progress { stroke-dashoffset: 0; }
}

/* ---------- --reel: «Видеотека» (/video/) ----------
   Плёночная перфорация медленно вращается, дуга-таймлайн «проигрывается»,
   кнопка Play дышит волнами, под ней — эквалайзер звука. */
.robin-hero-core-art--reel .rhc-perf {
	fill: none;
	stroke: rgba(255, 255, 255, 0.35);
	stroke-width: 2.4;
	stroke-dasharray: 1.6 2.4;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-reel-spin 30s linear infinite;
}
@keyframes rhc-reel-spin {
	to { transform: rotate(360deg); }
}
.robin-hero-core-art--reel .rhc-track {
	fill: none;
	stroke: rgba(255, 255, 255, 0.2);
	stroke-width: 2.2;
}
.robin-hero-core-art--reel .rhc-progress {
	fill: none;
	stroke: #fff;
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-dasharray: 100;
	animation: rhc-progress 8s linear infinite;
	filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.6));
}
.robin-hero-core-art--reel .rhc-btn {
	fill: rgba(255, 255, 255, 0.16);
	stroke: rgba(255, 255, 255, 0.85);
	stroke-width: 1.2;
}
.robin-hero-core-art--reel .rhc-tri {
	fill: #fff;
	stroke: #fff;
	stroke-width: 1.4;
	stroke-linejoin: round;
	transform-box: fill-box;
	transform-origin: 40% 50%;
	animation: rhc-reel-tap 4s ease-in-out infinite;
}
@keyframes rhc-reel-tap {
	0%, 80%, 100% { transform: scale(1); }
	86%           { transform: scale(0.82); }
	92%           { transform: scale(1.08); }
}
.robin-hero-core-art--reel .rhc-pulse {
	fill: none;
	stroke: rgba(255, 255, 255, 0.6);
	stroke-width: 0.8;
	transform-box: fill-box;
	transform-origin: center;
	animation: rhc-reel-pulse 3.2s ease-out infinite;
}
.robin-hero-core-art--reel .rhc-pulse--2 { animation-delay: 1.6s; }
@keyframes rhc-reel-pulse {
	0%   { transform: scale(1); opacity: 0.9; }
	100% { transform: scale(1.75); opacity: 0; }
}
.robin-hero-core-art--reel .rhc-eq-bar {
	fill: #fff;
	transform-box: fill-box;
	transform-origin: 50% 100%;
	animation: rhc-reel-eq 1.1s ease-in-out infinite alternate;
	animation-delay: var(--d, 0s);
}
@keyframes rhc-reel-eq {
	0%   { transform: scaleY(0.25); opacity: 0.6; }
	100% { transform: scaleY(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.robin-hero-core-art--reel .rhc-progress { stroke-dashoffset: 35; }
	.robin-hero-core-art--reel .rhc-pulse { opacity: 0; }
	.robin-hero-core-art--reel .rhc-eq-bar { transform: scaleY(0.6); }
}