/* Shared visual language for the OPC presentation site's product illustrations. */
:root {
  --visual-line: rgba(169, 208, 196, .34);
  --visual-line-soft: rgba(169, 208, 196, .18);
  --visual-panel: #223b4c;
  --visual-panel-raised: #294657;
  --visual-mint: #a9d0c4;
}

.hero-art {
  display: grid;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  place-items: center;
  transform: none;
}

.hero-workflow {
  display: block;
  width: min(100%, 640px);
  margin: 0 auto;
}

.hero-workflow img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 18px 34px rgba(0, 0, 0, .16));
}

.feature-icon {
  border: 1px solid #d7e7e1;
  background: #e7f0ed;
  color: #24596c;
}

.icon-field:after {
  background: #e7f0ed;
}

.data-ring {
  border-color: var(--visual-line-soft);
}

.data-core {
  border: 1px solid var(--visual-line);
  background: var(--visual-panel);
  box-shadow: 0 0 0 12px rgba(130, 184, 178, .045), 0 0 44px rgba(119, 177, 173, .12);
}

.training-emblem {
  border-color: var(--visual-line);
}

.training-emblem:before,
.training-emblem:after {
  border-color: var(--visual-line-soft);
}

@media (max-width: 760px) {
  .hero-art {
    margin: 12px auto 0;
  }

  .hero-workflow {
    width: min(100%, 420px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .feature-card {
    transition: none;
  }
}