.dj-split {
  display: grid;
  position: relative;
}

.dj-main-btn,
.dj-split-options {
  grid-area: 1 / 1;
}

.dj-main-btn {
  z-index: 2;
  transition: opacity 220ms ease, visibility 220ms ease;
}

.dj-split-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 340ms ease, visibility 340ms ease;
}

.dj-split .landing-sub-btn {
  font-size: 1rem;
  padding: 12px 14px;
  opacity: 0;
  transition: opacity 340ms ease;
}

.dj-split.dj-split--expanded .dj-main-btn {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.dj-split.dj-split--expanded .dj-split-options {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.dj-split.dj-split--expanded .landing-sub-btn {
  opacity: 1;
}

.dj-split.dj-split--expanded .landing-sub-btn:nth-child(2) {
  transition-delay: 80ms;
}

.dj-split.dj-split--instant .dj-main-btn,
.dj-split.dj-split--instant .dj-split-options,
.dj-split.dj-split--instant .landing-sub-btn {
  transition: none !important;
}