.soundtrack-stage {
  position: relative;
}

.soundtrack-stage h2 { font-family: Quicksand, sans-serif; font-size: 24px; font-weight: 400; }
.soundtrack-stage #relaxmoods { max-width: 100%; white-space: normal; }
.soundtrack-stage #relaxmoods img { max-width: 100%; height: auto; }

.soundtrack-gutter {
  width: 288px;
  max-width: calc(100% - 32px);
  margin: 32px auto 0;
}

.soundtrack-gutter iframe {
  display: block;
  width: 100%;
  height: 1500px;
  border: 0;
}

.soundtrack-download {
  white-space: normal;
  text-decoration: none;
}

.soundtrack-download:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.soundtrack-album {
  display: flex;
  gap: 6px;
  align-items: center;
  margin: 8px 0 0;
  text-align: left;
  justify-content: space-between;
  width: 100%;
}

.soundtrack-gutter .soundtrack-album {
  background: #000;
  color: #fff;
  border-color: #444;
  text-shadow: none;
}

.soundtrack-gutter .soundtrack-album:hover,
.soundtrack-gutter .soundtrack-album:focus {
  background: #151515;
  color: #fff;
  border-color: #777;
}

.soundtrack-gutter .soundtrack-album .soundtrack-glyphs img { filter: invert(1); }

.soundtrack-glyphs { display: inline-flex; align-items: center; justify-content: center; gap: 4px; vertical-align: middle; }
.soundtrack-glyphs img { flex: 0 0 auto; width: auto; height: auto; image-rendering: pixelated; }
.soundtrack-trigger .soundtrack-glyphs { display: flex; margin-top: 3px; }
.soundtrack-trigger { vertical-align: middle; }
.browser-format-logo { width: auto; height: auto; image-rendering: pixelated; }
.soundtrack-modal-glyphs { margin-top: 6px; }
.soundtrack-stream { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; color: #c8c3e8; font-size: 12px; }
.soundtrack-stream:hover { color: #fff; }

.soundtrack-download small {
  display: block;
  font-size: 11px;
}

.soundtrack-album small { white-space: nowrap; }

#sountrackpop .modal-dialog { max-width: 440px; margin: 110px auto 24px; }
#sountrackpop .modal-content { background: #0d0d17; color: #d9deed; border: 1px solid #666d92; border-radius: 2px; }
#sountrackpop .modal-header { border-bottom: 1px solid #35374c; }
#sountrackpop .modal-title { font-family: Quicksand, sans-serif; font-size: 18px; font-weight: 400; text-shadow: none; color: #d9deed; }
#sountrackpop .modal-body { font-size: 14px; }
#sountrackpop .modal-body p:last-child { margin-bottom: 0; color: #a4abc4; }
#sountrackpop .modal-footer { border-top: 0; }
#sountrackpop .close { opacity: 1; color: #c8d5e6; text-shadow: none; }
#sountrackpop .soundtrack-cancel { font-size: 13px; padding: 7px 12px; color: #c8d5e6; background: #1a1a2c; border: 1px solid #666d92; text-shadow: none; }

/* Equal reserved gutters keep the original hero centered in the viewport. */
@media (min-width: 1440px) {
  .soundtrack-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, min(1170px, calc(100% - 672px))) minmax(0, 1fr);
    align-items: start;
  }

  .soundtrack-stage { grid-column: 1 / -1; grid-row: 1; }

  .soundtrack-stage > .container {
    width: calc(100% - 672px);
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
  }

  .soundtrack-gutter {
    grid-column: 3;
    grid-row: 1 / 3;
    justify-self: end;
    margin: 12px 24px 24px 0;
    z-index: 1;
  }

  .soundtrack-news { grid-column: 2; grid-row: 2; width: 100%; }
  .soundtrack-news iframe { max-width: 100%; }
  .soundtrack-news .btn { white-space: normal; }
  .soundtrack-intro > br { display: none; }
}
