/*
 * Last modified: 09/12/2026 06:12 PM
 *
 * Hero and capabilities refresh. Continuous cycles: hero 13.5s, capabilities 11s.
 * Loaded after azt-motion.css, on the homepage only.
 */
.azt-motion-roi--v2 {
  opacity: 1;
  top: 125px;
  height: auto;
  aspect-ratio: 560 / 360;
}
.azt-motion-roi--v2 .azt-motion-roi__grid {
  background-size: 32px 32px;
  opacity: .6;
}
.azt-roi-v2 { --roi-blue: #7597ff; --roi-gold: #e3bc61; }
.azt-roi-v2__orbit { fill: none; stroke: #8ca1c2; stroke-opacity: .12; stroke-dasharray: 2 8; }
.azt-roi-v2__rail { fill: none; stroke: #6b86b8; stroke-opacity: .38; stroke-width: 1.5; }
.azt-roi-v2__flow {
  fill: none;
  stroke: var(--roi-blue);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 14 100;
  stroke-dashoffset: 14;
  opacity: 0;
  animation: azt-roi-flow 13.5s linear infinite;
}
.azt-roi-v2__flow--2 { animation-delay: 1.485s; }
.azt-roi-v2__flow--3 { animation-delay: 4.455s; }
.azt-roi-v2__flow--4 { animation-delay: 2.97s; }
.azt-roi-v2__panel { fill: #141e2b; stroke: #344761; stroke-width: 1; }
.azt-roi-v2__input { --roi-delay: 0s; }
.azt-roi-v2__input--2 { --roi-delay: 1.485s; }
.azt-roi-v2__input--3 { --roi-delay: 4.455s; }
.azt-roi-v2__input--4 { --roi-delay: 2.97s; }
.azt-roi-v2__input .azt-roi-v2__panel { animation: azt-roi-panel 13.5s ease-in-out var(--roi-delay) infinite; }
.azt-roi-v2__accent { fill: none; stroke: var(--roi-blue); stroke-width: 3; stroke-linecap: round; }
.azt-roi-v2 text { font-family: var(--azt-font); }
.azt-roi-v2__label { fill: #e7edf7; font-size: 16px; font-weight: 600; }
.azt-roi-v2__detail { fill: #afc0d8; font-size: 13px; }
.azt-roi-v2__track { fill: #101924; stroke: #344761; stroke-width: 3; }
.azt-roi-v2__charge {
  fill: none;
  stroke: var(--roi-blue);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  /* Begin at Performance's exact contact, then fill clockwise. */
  transform: rotate(-135deg);
  transform-origin: 280px 180px;
  animation: azt-roi-charge 13.5s ease-in-out infinite;
}
.azt-roi-v2__core { fill: #19263a; stroke: #5873a0; stroke-width: 1; }
.azt-roi-v2__hub { fill: #fff; font-size: 28px; font-weight: 750; letter-spacing: 1px; }
.azt-roi-v2__caption { fill: #b9c8dd; font-size: 11px; text-transform: uppercase; letter-spacing: 2px; }
.azt-roi-v2__growth-track { fill: none; stroke: #e3bc61; stroke-opacity: .22; stroke-width: 2; }
.azt-roi-v2__growth {
  fill: none;
  stroke: var(--roi-gold);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  animation: azt-roi-growth 13.5s ease-in-out infinite;
}
.azt-roi-v2__arrow { fill: none; stroke: var(--roi-gold); stroke-width: 2; opacity: .2; animation: azt-roi-result 13.5s ease-in-out infinite; }
.azt-roi-v2__outcome { fill: var(--roi-gold); font-size: 14px; font-weight: 500; }
@keyframes azt-roi-flow {
  0%, 5% { stroke-dashoffset: 14; opacity: 0; }
  7% { opacity: 1; }
  14% { stroke-dashoffset: -100; opacity: 1; }
  16%, 100% { stroke-dashoffset: -100; opacity: 0; }
}
@keyframes azt-roi-panel {
  0%, 3%, 25%, 100% { fill: #141e2b; stroke: #344761; }
  8%, 17% { fill: #1c3152; stroke: #7597ff; }
}
/* Each arc begins as its incoming pulse reaches the ring (13%, +11%).
 * Contacts and quarter-turn boundaries: Performance, Conversion, Reach, Reliability. */
@keyframes azt-roi-charge {
  0%, 12.9% { stroke-dashoffset: 100; stroke: #7597ff; opacity: 0; }
  13% { stroke-dashoffset: 100; stroke: #7597ff; opacity: 1; }
  20%, 24% { stroke-dashoffset: 75; }
  31%, 35% { stroke-dashoffset: 50; }
  42%, 46% { stroke-dashoffset: 25; }
  53% { stroke-dashoffset: 0; stroke: #7597ff; }
  56%, 82% { stroke-dashoffset: 0; stroke: #e3bc61; opacity: 1; }
  94%, 100% { stroke-dashoffset: 0; stroke: #e3bc61; opacity: 0; }
}
@keyframes azt-roi-growth {
  0%, 50% { stroke-dashoffset: 100; opacity: 0; }
  53% { opacity: 1; }
  67%, 82% { stroke-dashoffset: 0; opacity: 1; }
  94%, 100% { stroke-dashoffset: 0; opacity: 0; }
}
@keyframes azt-roi-result {
  0%, 60%, 100% { opacity: .2; }
  68%, 82% { opacity: 1; }
}

/* Each capability receives an equal turn; labels never dim or move. */
.azt-motion-caps .azt-motion-scan { display: none; }
.azt-motion-caps .azt-proof__grid { gap: 10px; background: transparent; }
.azt-motion-caps .azt-proof__item {
  --cap-delay: 0s;
  position: relative;
  display: flex;
  align-items: center;
  min-height: 76px;
  padding: 18px 14px 18px 24px;
  overflow: hidden;
  border: 1px solid #344151;
  border-radius: 8px;
  background: #121c27;
  color: #edf2fa;
  animation: azt-cap-panel 11s ease-in-out var(--cap-delay) infinite;
}
.azt-motion-caps .azt-proof__item:nth-child(2) { --cap-delay: 1.833333s; }
.azt-motion-caps .azt-proof__item:nth-child(3) { --cap-delay: 3.666667s; }
.azt-motion-caps .azt-proof__item:nth-child(4) { --cap-delay: 5.5s; }
.azt-motion-caps .azt-proof__item:nth-child(5) { --cap-delay: 7.333333s; }
.azt-motion-caps .azt-proof__item:nth-child(6) { --cap-delay: 9.166667s; }
.azt-motion-caps .azt-proof__item:nth-child(n) { animation-delay: var(--cap-delay); }
.azt-motion-caps .azt-proof__item::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #7597ff, #e3bc61);
  transform: scaleX(0);
  transform-origin: left;
  animation: azt-cap-progress 11s linear var(--cap-delay) infinite;
}
.azt-motion-caps .azt-proof__item:nth-child(n)::after {
  top: 50%;
  left: 11px;
  width: 3px;
  height: 16px;
  margin-top: -8px;
  border: 0;
  border-radius: 2px;
  background: #536987;
  animation: azt-cap-accent 11s ease-in-out var(--cap-delay) infinite;
}
@keyframes azt-cap-panel {
  0%, 18%, 100% { background: #121c27; border-color: #344151; }
  3%, 14% { background: #1a2c44; border-color: #7597ff; }
}
@keyframes azt-cap-progress {
  0% { transform: scaleX(0); opacity: 1; }
  15% { transform: scaleX(1); opacity: 1; }
  18%, 100% { transform: scaleX(1); opacity: 0; }
}
@keyframes azt-cap-accent {
  0%, 18%, 100% { background: #536987; }
  3%, 14% { background: #e3bc61; }
}
.azt-motion-paused .azt-roi-v2 *,
.azt-motion-paused .azt-motion-caps .azt-proof__item,
.azt-motion-paused .azt-motion-caps .azt-proof__item::before,
.azt-motion-paused .azt-motion-caps .azt-proof__item::after { animation-play-state: paused; }
@media (min-width: 1081px) {
  .azt-motion-hero .azt-hero__copy { max-width: 57%; }
}
@media (max-width: 1080px) {
  .azt-motion-roi--v2 { top: auto; max-width: 560px; min-height: 0; margin: 36px auto 8px; }
}
@media (max-width: 760px) {
  .azt-motion-caps .azt-proof__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .azt-motion-caps .azt-proof__item { font-size: 14px; }
  .azt-roi-v2__label { font-size: 19px; }
  .azt-roi-v2__detail { font-size: 17px; letter-spacing: -.35px; }
  .azt-roi-v2__outcome { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .azt-roi-v2 *, .azt-motion-caps .azt-proof__item,
  .azt-motion-caps .azt-proof__item::before,
  .azt-motion-caps .azt-proof__item::after { animation: none !important; }
  .azt-roi-v2__flow, .azt-motion-caps .azt-proof__item::before { display: none; }
  .azt-roi-v2__charge, .azt-roi-v2__growth { stroke-dashoffset: 0; stroke: #e3bc61; opacity: 1; }
  .azt-roi-v2__arrow { opacity: 1; }
  .azt-motion-roi--v2 .azt-motion-roi__depth { transform: none !important; }
}

/* Center the complete vertical pipeline, including its stage labels. */
@media (max-width: 1080px) {
  .azt-delivery-pipe.azt-motion-pipe {
    width: max-content;
    max-width: 100%;
    margin-inline: auto;
  }
}