.opp-process-wrap,
.opp-process-wrap * {
  box-sizing: border-box;
}

.opp-process-wrap {
  width: 100%;
  padding: 0;
  margin: 0 auto;
  background: transparent !important;
  overflow: visible;
}

.opp-process-stage {
  position: relative;
  width: min(100%, 1187px);
  aspect-ratio: 1187 / 785;
  margin: 0 auto;
  overflow: visible;
  background: transparent !important;
}

.opp-process-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  overflow: visible;
}

.opp-process-lines line {
  stroke: var(--opp-line, #07008b);
  stroke-width: 6;
  stroke-linecap: round;
}

.opp-center-circle {
  position: absolute;
  left: 50.04%;
  top: 79.23%;
  width: 20.9%;
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 45% 38%, #181818 0%, var(--opp-center, #060606) 58%, #000000 100%);
  color: var(--opp-text, #ffffff);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  border: clamp(6px, 0.75vw, 9px) solid #050505;
  box-shadow:
    0 0 0 clamp(2px, 0.32vw, 4px) rgba(0, 0, 0, 0.85),
    inset 0 0 clamp(12px, 2vw, 22px) rgba(255, 255, 255, 0.05),
    0 clamp(2px, 0.4vw, 5px) clamp(4px, 0.7vw, 9px) rgba(0, 0, 0, 0.24);
}

.opp-center-circle span {
  font-family: Georgia, 'Times New Roman', serif;
  color: var(--opp-text, #ffffff);
  font-size: clamp(24px, 5.15vw, 67px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
  text-shadow: 0 2px 1px rgba(255, 255, 255, 0.22);
}

.opp-node {
  position: absolute;
  width: 22.75%;
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  z-index: 3;
}

.opp-node-inner {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--opp-primary, #07008b);
  color: var(--opp-text, #ffffff);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 13% 8% 11%;
  overflow: hidden;
}

.opp-icon-holder {
  width: 37.5%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: #ffffff;
  color: var(--opp-primary, #07008b);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 auto;
  margin-bottom: 8.5%;
}

.opp-icon-holder img {
  width: 63%;
  height: 63%;
  object-fit: contain;
  display: block;
}

.opp-default-icon {
  width: 64%;
  height: 64%;
  display: block;
  color: var(--opp-primary, #07008b);
}

.opp-node-label {
  color: var(--opp-text, #ffffff);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(10px, 1.85vw, 25px);
  font-weight: 800;
  line-height: 1.12;
  max-width: 88%;
  word-break: normal;
  overflow-wrap: anywhere;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}

.opp-node-1 {
  left: 37.67%;
  top: 22.46%;
}

.opp-node-2 {
  left: 62.58%;
  top: 22.93%;
}

.opp-node-3 {
  left: 17.00%;
  top: 45.86%;
}

.opp-node-4 {
  left: 82.65%;
  top: 45.86%;
}

.opp-node-5 {
  left: 11.69%;
  top: 83.11%;
}

.opp-node-6 {
  left: 88.12%;
  top: 83.10%;
}

@media (max-width: 900px) {
  .opp-process-lines line {
    stroke-width: 5;
  }

  .opp-node-label {
    font-size: clamp(9px, 1.85vw, 16px);
  }
}

@media (max-width: 520px) {
  .opp-process-wrap {
    padding: 5px 0;
  }

  .opp-process-lines line {
    stroke-width: 4;
  }

  .opp-node-label {
    font-size: clamp(7px, 1.85vw, 11px);
  }

  .opp-center-circle span {
    font-size: clamp(18px, 5.15vw, 28px);
  }
}