@media (max-width: 700px) {
  .quiz-hero {
    min-height: 92svh !important;
    padding: 3.9rem 1.35rem 4.8rem !important;
    background-size: auto 100% !important;
    background-position: 70% center !important;
    background-repeat: no-repeat !important;
  }

  .quiz-hero::before {
    background: linear-gradient(
      90deg,
      rgba(30, 20, 16, 0.62) 0%,
      rgba(30, 20, 16, 0.4) 48%,
      rgba(30, 20, 16, 0.18) 100%
    ) !important;
  }

  .quiz-hero img,
  .quiz-hero picture img,
  .quiz-hero__image,
  .quiz-hero .hero-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: 70% center !important;
  }

  .quiz-hero .section-kicker,
  .quiz-hero .eyebrow,
  .quiz-hero__eyebrow {
    width: max-content !important;
    max-width: none !important;
    color: #fffdfb !important;
    font-size: 0.78rem !important;
    line-height: 1.35 !important;
    letter-spacing: 0.13em !important;
    white-space: nowrap !important;
  }

  .quiz-hero h1 {
    max-width: 18.4rem !important;
    margin-top: 3.4rem !important;
    font-size: clamp(3.55rem, 15vw, 4.35rem) !important;
    line-height: 0.91 !important;
    letter-spacing: 0 !important;
  }

  .quiz-hero p:not(.eyebrow),
  .quiz-hero .hero-copy,
  .quiz-hero__copy {
    max-width: 100% !important;
    width: 100% !important;
    font-size: 0.98rem !important;
    line-height: 1.55 !important;
  }
}

@media (max-width: 430px) {
  .quiz-hero {
    padding: 2.9rem 1.25rem 4.8rem !important;
  }

  .quiz-hero .eyebrow {
    transform: translateY(-0.25rem) !important;
  }

  .quiz-hero p:not(.eyebrow) {
    width: calc(100vw - 2.5rem) !important;
    max-width: none !important;
  }
}

@media (max-width: 380px) {
  .quiz-hero {
    background-position: 72% center !important;
  }

  .quiz-hero img,
  .quiz-hero picture img,
  .quiz-hero__image,
  .quiz-hero .hero-media img {
    object-position: 72% center !important;
  }

  .quiz-hero h1 {
    max-width: 17.4rem !important;
    font-size: clamp(3.3rem, 14.5vw, 4rem) !important;
  }

  .quiz-hero p:not(.eyebrow),
  .quiz-hero .hero-copy,
  .quiz-hero__copy {
    max-width: 100% !important;
    width: 100% !important;
    font-size: 0.94rem !important;
  }
}

/* Keep the mobile quiz crop focused on the boots and book stack. */
@media (max-width: 700px) {
  .quiz-hero {
    background-position: 70% center !important;
  }

  .quiz-hero img,
  .quiz-hero picture img,
  .quiz-hero__image,
  .quiz-hero .hero-media img {
    object-position: 70% center !important;
  }
}

@media (max-width: 380px) {
  .quiz-hero {
    background-position: 72% center !important;
  }

  .quiz-hero img,
  .quiz-hero picture img,
  .quiz-hero__image,
  .quiz-hero .hero-media img {
    object-position: 72% center !important;
  }
}