/* Sony careers abstract pattern (behind media) */

.sm-abstract-pattern {
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 0;
  pointer-events: none;
}

.sm-abstract-pattern--horizontal {
  flex-direction: row;
}

.sm-abstract-pattern__box {
  flex-shrink: 0;
  transform: scaleY(var(--pattern-flip-vertical, 1)) scaleX(var(--pattern-flip-horizontal, 1));
}

.sm-abstract-pattern svg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}

.sm-abstract-pattern--large .sm-abstract-pattern__box {
  width: 128px;
  height: 128px;
}

@media (min-width: 900px) {
  .sm-abstract-pattern--large .sm-abstract-pattern__box {
    width: 248px;
    height: 248px;
  }
}

@media (max-width: 899px) {
  .sm-abstract-pattern__box {
    transform: rotate(90deg) scaleY(var(--pattern-flip-vertical, 1)) scaleX(var(--pattern-flip-horizontal, 1));
  }

  .sm-abstract-pattern__box:last-of-type {
    transform: rotate(270deg) scaleY(var(--pattern-flip-vertical, 1)) scaleX(var(--pattern-flip-horizontal, 1));
  }
}

/* Teams — pattern flush to viewport right, behind image */
#teams {
  position: relative;
  overflow: visible;
}

#teams > .sm-abstract-pattern {
  position: absolute;
  top: 0%;
  right: 0;
  left: auto;
  justify-content: flex-end;
  transform: none;
  z-index: 0;
}

#teams .sm-split__inner {
  position: relative;
  overflow: visible;
}

#teams .sm-split__visual--square {
  position: relative;
  z-index: 1;
  overflow: visible;
}

@media (max-width: 899px) {
  #teams .sm-abstract-pattern__box {
    transform: scaleY(var(--pattern-flip-vertical, 1)) scaleX(var(--pattern-flip-horizontal, 1));
  }

  #teams .sm-abstract-pattern__box:last-of-type {
    transform: scaleY(var(--pattern-flip-vertical, 1)) scaleX(var(--pattern-flip-horizontal, 1));
  }
}