/*
|--------------------------------------------------------------------------
| SETTLEMENT-HOME-06A — Hero Illustration
|--------------------------------------------------------------------------
*/

.rw-exec-illustration {
  position: relative;
  width: min(100%, 680px);
  min-height: 620px;
  display: grid;
  place-items: center;
}

.rw-exec-svg {
  width: 100%;
  height: auto;
  overflow: visible;
}

.rw-flow {
  stroke: url(#rwMintBlue);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-dasharray: 9 12;
  animation: rwFlowPulse 3.4s ease-in-out infinite;
}

.rw-flow-b { animation-delay: .4s; }
.rw-flow-c { animation-delay: .8s; }
.rw-flow-d { animation-delay: 1.2s; }

.rw-pulse {
  fill: #00B894;
  filter: drop-shadow(0 0 12px rgba(0,184,148,.55));
  animation: rwParticleMove 2.8s ease-in-out infinite;
}

.rw-pulse-b { animation-delay: .5s; }
.rw-pulse-c { animation-delay: 1s; }
.rw-pulse-d { animation-delay: 1.5s; }

.rw-bank-node,
.rw-center-node {
  animation: rwHeroFloat 5s ease-in-out infinite;
}

.rw-bank-node:nth-of-type(2) { animation-delay: .4s; }
.rw-bank-node:nth-of-type(3) { animation-delay: .8s; }
.rw-bank-node:nth-of-type(4) { animation-delay: 1.2s; }

.rw-exec-kpis {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.rw-exec-kpi {
  position: absolute;
  width: 150px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(15,23,42,.075);
  box-shadow:
    0 18px 50px rgba(15,23,42,.09),
    inset 0 1px 0 rgba(255,255,255,.82);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  animation: rwHeroFloat 5.6s ease-in-out infinite;
}

.rw-exec-kpi span {
  display: block;
  color: var(--rw-paper-muted);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.rw-exec-kpi strong {
  display: block;
  margin-top: 6px;
  color: var(--rw-paper-heading);
  font-family: var(--rw-paper-mono);
  font-size: 20px;
  font-weight: 950;
}

.rw-exec-kpi small {
  display: block;
  margin-top: 2px;
  color: var(--rw-paper-primary);
  font-weight: 900;
}

.rw-exec-kpi-1 { top: 52px; left: 8px; }
.rw-exec-kpi-2 { top: 96px; right: 0; animation-delay: .5s; }
.rw-exec-kpi-3 { bottom: 100px; left: 18px; animation-delay: 1s; }
.rw-exec-kpi-4 { bottom: 56px; right: 40px; animation-delay: 1.5s; }

@media (max-width: 760px) {
  .rw-exec-illustration {
    min-height: 360px;
  }

  .rw-exec-kpi {
    width: 128px;
    padding: 12px;
  }

  .rw-exec-kpi strong {
    font-size: 16px;
  }

  .rw-exec-kpi-1 { top: 12px; left: 0; }
  .rw-exec-kpi-2 { top: 24px; right: 0; }
  .rw-exec-kpi-3 { bottom: 34px; left: 0; }
  .rw-exec-kpi-4 { bottom: 20px; right: 0; }
}