.chain-section {
  padding: calc(42.3 * var(--u)) 0 0;
}

.chain-section__title {
  margin-left: calc(var(--gutter) + 9.3 * var(--u));
  font-size: calc(16.7 * var(--u));
  line-height: 1;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--c-teal);
}

.chain {
  position: relative;
  height: calc(212.6 * var(--u));
}

.chain__icon {
  position: absolute;
  left: var(--icon-x);
  top: calc((var(--icon-y) + 1.8) * var(--u));
  width: calc(var(--icon-w) * var(--u));
}

.chain__label {
  position: absolute;
  left: var(--label-x);
  top: calc(160.6 * var(--u));
  font-size: calc(21.5 * var(--u));
  font-weight: 600;
  line-height: calc(27 * var(--u));
  text-align: center;
  white-space: nowrap;
  transform: translateX(-50%);
  color: var(--label-color);
}

.chain__item:not(:last-child)::after {
  content: "";
  position: absolute;
  left: var(--arrow-x);
  top: calc(168.9 * var(--u));
  margin-left: calc(-5 * var(--u));
  width: calc(14 * var(--u));
  height: calc(14 * var(--u));
  border-top: calc(2 * var(--u)) solid var(--c-chevron);
  border-right: calc(2 * var(--u)) solid var(--c-chevron);
  transform: translateX(-50%) rotate(45deg);
  transform-origin: center;
}

.chain__item--mining     { --icon-x: 4.229%;  --icon-y: 74.9; --icon-w: 96; --label-x: 7.604%;  --arrow-x: 11.764%; --label-color: var(--c-blue); }
.chain__item--processing { --icon-x: 16.729%; --icon-y: 74.9; --icon-w: 95; --label-x: 20.031%; --arrow-x: 27.979%; --label-color: var(--c-teal); }
.chain__item--powders    { --icon-x: 31.729%; --icon-y: 82.9; --icon-w: 88; --label-x: 34.753%; --arrow-x: 41.208%; --label-color: var(--c-green); }
.chain__item--components { --icon-x: 45.688%; --icon-y: 74.9; --icon-w: 77; --label-x: 48.354%; --arrow-x: 55.618%; --label-color: var(--c-teal); }
.chain__item--chips      { --icon-x: 59.229%; --icon-y: 76.9; --icon-w: 78; --label-x: 61.951%; --arrow-x: 69.785%; --label-color: var(--c-blue); }
.chain__item--ev         { --icon-x: 72.979%; --icon-y: 83.9; --icon-w: 74; --label-x: 75.559%; --arrow-x: 81.208%; --label-color: var(--c-blue); }
.chain__item--aerospace  { --icon-x: 86.938%; --icon-y: 83.9; --icon-w: 64; --label-x: 82.847%; --label-color: var(--c-teal); }

.chain__item--aerospace .chain__label {
  top: calc(161.8 * var(--u));
  line-height: calc(26.3 * var(--u));
  text-align: left;
  transform: none;
}

@media (max-width: 900px) {
  .chain-section {
    padding: var(--sp-8) var(--gutter) var(--section-y);
  }

  .chain-section__title {
    margin: 0 0 var(--sp-6);
    font-size: 15px;
  }

  .chain {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--sp-6) var(--sp-4);
    height: auto;
  }

  .chain__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-3);
  }

  .chain__item::after {
    display: none;
  }

  .chain__icon,
  .chain__label,
  .chain__item--aerospace .chain__label {
    position: static;
    transform: none;
    text-align: center;
  }

  .chain__icon {
    width: 64px;
  }

  .chain__label,
  .chain__item--aerospace .chain__label {
    font-size: 15px;
    line-height: 1.3;
    white-space: normal;
  }
}

@media (max-width: 560px) {
  .chain {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}