/* Mobile first screen: design-showcase replaces legacy hero on phones only */

body.quiz-is-active .design-showcase,
body.quiz-is-active .quiz__first-screen {
  display: none !important;
}

@media (max-width: 818px) {
  body:not(.quiz-is-active) .design-showcase {
    display: block;
  }

  body:not(.quiz-is-active) .quiz__first-screen:not(.hide) {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    min-height: 0;
  }
}

@media (min-width: 819px) {
  body:not(.quiz-is-active) .design-showcase {
    display: none !important;
  }
}