.studio-styles .banner-quiz {
  max-width: 100%;
  display: grid;
  align-items: center;
  text-align: center;
  overflow: hidden;
  background-color: var(--fe-c-bg);
  color: var(--fe-c-text);
}
@media (min-width: 85.625em) {
  .studio-styles .banner-quiz {
    padding-bottom: 6.25rem;
  }
}
@media (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (padding-bottom: clamp( 2.5rem , -2.2837696422rem  +  9.9664462975vw , 6.25rem )) {
    .studio-styles .banner-quiz {
      padding-bottom: clamp( 2.5rem , -2.2837696422rem  +  9.9664462975vw , 6.25rem );
    }
  }
  @supports not (padding-bottom: clamp( 2.5rem , -2.2837696422rem  +  9.9664462975vw , 6.25rem )) {
    .studio-styles .banner-quiz {
      padding-bottom: calc(2.5rem + 3.75 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz {
    padding-bottom: 2.5rem;
  }
}
.studio-styles .banner-quiz__images {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  align-items: start;
}
.studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(1) .image {
  padding-bottom: 93%;
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(1) .image {
    padding-bottom: 114.29%;
  }
}
@media (min-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(1) {
    grid-column: 1/3;
    width: 90%;
  }
}
.studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
  align-self: end;
}
.studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) .image {
  padding-bottom: 116.7%;
}
@media (min-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
    grid-column: 4/5;
  }
}
@media (min-width: 47.99875em) and (min-width: 85.625em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
    margin-bottom: 1.375rem;
  }
}
@media (min-width: 47.99875em) and (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (margin-bottom: clamp( 0.0000000625rem , -1.7540487266rem  +  3.6543634763vw , 1.375rem )) {
    .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
      margin-bottom: clamp( 0.0000000625rem , -1.7540487266rem  +  3.6543634763vw , 1.375rem );
    }
  }
  @supports not (margin-bottom: clamp( 0.0000000625rem , -1.7540487266rem  +  3.6543634763vw , 1.375rem )) {
    .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
      margin-bottom: calc(0.0000000625rem + 1.3749999375 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (min-width: 47.99875em) and (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
    margin-bottom: 0.0000000625rem;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(2) {
    display: none;
  }
}
.studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) .image {
  padding-bottom: 55.556%;
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) .image {
    padding-bottom: 66.67%;
  }
}
@media (min-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
    margin-bottom: var(--margin-image);
    grid-column: 8/11;
    width: 83.334%;
  }
}
@media (min-width: 47.99875em) and (min-width: 85.625em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
    margin-top: 6.25rem;
  }
}
@media (min-width: 47.99875em) and (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (margin-top: clamp( 3.125rem , -0.8614747018rem  +  8.3053719146vw , 6.25rem )) {
    .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
      margin-top: clamp( 3.125rem , -0.8614747018rem  +  8.3053719146vw , 6.25rem );
    }
  }
  @supports not (margin-top: clamp( 3.125rem , -0.8614747018rem  +  8.3053719146vw , 6.25rem )) {
    .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
      margin-top: calc(3.125rem + 3.125 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (min-width: 47.99875em) and (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
    margin-top: 3.125rem;
  }
}
@media (min-width: 47.99875em) and (min-width: 85.625em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
    margin-bottom: 6.25rem;
  }
}
@media (min-width: 47.99875em) and (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (margin-bottom: clamp( 1.875rem , -3.7060645826rem  +  11.6275206804vw , 6.25rem )) {
    .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
      margin-bottom: clamp( 1.875rem , -3.7060645826rem  +  11.6275206804vw , 6.25rem );
    }
  }
  @supports not (margin-bottom: clamp( 1.875rem , -3.7060645826rem  +  11.6275206804vw , 6.25rem )) {
    .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
      margin-bottom: calc(1.875rem + 4.375 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (min-width: 47.99875em) and (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
    margin-bottom: 1.875rem;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top .banner-quiz__image-wrapp:nth-child(3) {
    align-self: end;
    margin-top: 76%;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_top {
    grid-template-columns: 37.301% 47.96%;
    gap: 3.4375rem;
  }
}
.studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(1) .image {
  padding-bottom: 117%;
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(1) .image {
    padding-bottom: 125%;
  }
}
@media (min-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(1) {
    grid-column: 3/5;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(1) {
    margin-top: 50%;
  }
}
.studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(2) .image {
  padding-bottom: 79.17%;
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(2) .image {
    padding-bottom: 133.34%;
  }
}
@media (min-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(2) {
    grid-column: 8/10;
    width: 64.587%;
    margin-left: 4.375rem;
  }
}
.studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) {
  grid-column: 11/13;
  width: 90%;
  margin-left: auto;
}
@media (min-width: 85.625em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) {
    margin-top: -13.75rem;
  }
}
@media (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (margin-top: clamp( -13.75rem , -8.0608202385rem  +  -6.6442975316vw , -11.25rem )) {
    .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) {
      margin-top: clamp( -13.75rem , -8.0608202385rem  +  -6.6442975316vw , -11.25rem );
    }
  }
  @supports not (margin-top: clamp( -13.75rem , -8.0608202385rem  +  -6.6442975316vw , -11.25rem )) {
    .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) {
      margin-top: calc(-11.25rem + -2.5 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) {
    margin-top: -11.25rem;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) {
    display: none;
  }
}
.studio-styles .banner-quiz__images_bottom .banner-quiz__image-wrapp:nth-child(3) .image {
  padding-bottom: 112.556%;
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images_bottom {
    grid-template-columns: 48.88% 36.66%;
    gap: 2.9375rem;
    padding: 0 1.5rem;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__images {
    justify-content: space-between;
  }
}
.studio-styles .banner-quiz__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.25rem;
  justify-content: center;
  max-width: 43.75rem;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 1.25rem;
}
@media (min-width: 85.625em) {
  .studio-styles .banner-quiz__body {
    max-width: 37.5rem;
  }
}
@media (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (max-width: clamp( 25rem , 9.0541011927rem  +  33.2214876582vw , 37.5rem )) {
    .studio-styles .banner-quiz__body {
      max-width: clamp( 25rem , 9.0541011927rem  +  33.2214876582vw , 37.5rem );
    }
  }
  @supports not (max-width: clamp( 25rem , 9.0541011927rem  +  33.2214876582vw , 37.5rem )) {
    .studio-styles .banner-quiz__body {
      max-width: calc(25rem + 12.5 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__body {
    max-width: 25rem;
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz__body {
    padding: 2.75rem;
    gap: 1.875rem;
  }
}
.studio-styles .banner-quiz .title {
  align-items: center;
  justify-content: center;
  color: var(--fe-c-text);
}
@media (min-width: 85.625em) {
  .studio-styles .banner-quiz .h2 {
    font-size: 2.25rem;
  }
}
@media (min-width: 47.99875em) and (max-width: 85.625em) {
  @supports (font-size: clamp( 1.5625rem , 0.6854755656rem  +  1.8271818212vw , 2.25rem )) {
    .studio-styles .banner-quiz .h2 {
      font-size: clamp( 1.5625rem , 0.6854755656rem  +  1.8271818212vw , 2.25rem );
    }
  }
  @supports not (font-size: clamp( 1.5625rem , 0.6854755656rem  +  1.8271818212vw , 2.25rem )) {
    .studio-styles .banner-quiz .h2 {
      font-size: calc(1.5625rem + 0.6875 * (100vw - 47.99875rem) / 37.62625);
    }
  }
}
@media (max-width: 47.99875em) {
  .studio-styles .banner-quiz .h2 {
    font-size: 1.5625rem;
  }
}
.studio-styles .banner-quiz .image {
  position: relative;
}
.studio-styles .banner-quiz .image img {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
