.quiz-inner {
  display: flex;
  justify-content: space-between;
}

.quiz-form {
  padding: 3.125rem;
  box-shadow: 0 1rem 2.875rem .3125rem rgba(211, 206, 204, 0.31);
  border-radius: 1.875rem;
  background-color: #fff;
  position: relative;
  width: 100%;
  height: 38.75rem;
  display: flex;
  flex-direction: column;
}

.quiz-form.is-semifinal {
  width: 100%;
  padding: 2.8125rem 9.375rem;
}

.quiz-form.is-semifinal .quiz-semifinal-items {
  display: block;
}

.quiz-form.is-semifinal::before {
  background-image: url(../img/bg-1.webp);
  background-size: cover;
}

.quiz-form::before {
  content: "";
  width: 99%;
  height: 98%;
  border-radius: 1.563rem;
  border: 1px solid #e5e5e5;
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.quiz-item__title {
  margin-bottom: 1.25rem;
  font-size: 1.5625rem;
}

.quiz-progress {
  position: relative;
  margin-bottom: 2.8125rem;
  z-index: 1;
}

.quiz-progress p {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  font-size: .8125rem;
}

.quiz-progress__bar {
  width: 100%;
  position: relative;
  overflow: hidden;
  height: 2.5rem;
  border-radius: 1.5rem;
  background-color: #f7f7f7;
}

.quiz-progress__inner {
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  height: 1.875rem;
  border-radius: 1.25rem;
  background-color: var(--color-elements);
  -webkit-animation: loadingBg 15s infinite linear;
  animation: loadingBg 15s infinite linear;
  background-image: url(../image/loading.png);
  width: 12%;
}

.quiz-items {
  position: relative;
  z-index: 1;
}

.quiz-options {
  display: flex;
  justify-content: center;
}

.quiz-options--num .quiz-option {
  width: auto;
  flex-direction: row;
  align-items: center;
  margin: 0;
}

.quiz-options--num .quiz-option__input {
  padding: 0;
  display: flex;
  text-align: center;
  width: 9.375vw;
  height: 3.90625vw;
  border-radius: 38px;
  background-color: #f7f7f7;
  border: none;
  margin-right: 1.198vw;
}

.quiz-options--num .quiz-option__input::-webkit-inner-spin-button,
.quiz-options--num .quiz-option__input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
  -moz-appearance: textfield;
}

.quiz-options--inline {
  justify-content: space-between;
  flex-wrap: wrap;
}

.quiz-options--inline .quiz-option {
  width: 49%;
  margin: 0;
  margin-bottom: .9375rem;
}

.quiz-options--inline .quiz-option__wrapper {
  padding: 1.25rem;
  border-radius: .8125rem;
  background-color: #f7f7f7;
  display: flex;
  align-items: center;
  margin-bottom: 0;
}

.quiz-options--inline .quiz-option__checkbox {
  position: relative;
  transform: none;
  left: unset;
  bottom: unset;
  margin-right: .625rem;
}

.quiz-option {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 12.24vw;
  margin: 0 2.083vw;
}

.quiz-option:hover .quiz-option__checkbox {
  background-color: #fff;
}

.quiz-option:hover .quiz-option__checkbox::before {
  background-color: var(--color-elements);
}

.quiz-option__input {
  display: none;
}

.quiz-option__input:checked~.quiz-option__wrapper .quiz-option__checkbox {
  background-color: #fff !important;
}

.quiz-option__input:checked~.quiz-option__wrapper .quiz-option__checkbox img:first-child {
  display: none;
}

.quiz-option__input:checked~.quiz-option__wrapper .quiz-option__checkbox img:last-child {
  display: block;
}

.quiz-option__input:checked~.quiz-option__wrapper .quiz-option__checkbox::before {
  background-color: var(--color-elements);
}

.quiz-option__wrapper {
  position: relative;
  margin-bottom: 1.40625vw;
  width: 100%;
}

.quiz-option__img {
  display: flex;
  position: relative;
  width: 100%;
  height: 13.021vw;
  transition: 0.3s;
  border-radius: 1.5625rem;
  overflow: hidden;
}

.quiz-option__img img {
  position: absolute;
  max-width: unset;
  max-height: unset;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  -o-object-fit: cover;
  object-fit: cover;
}

.quiz-option__checkbox {
  width: 2.083vw;
  height: 2.083vw;
  border-radius: 50%;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -0.885vw;
  transition: 0.3s;
  z-index: 2;
}

.quiz-option__checkbox img {
  width: 0.573vw;
  z-index: 1;
}

.quiz-option__checkbox img:last-child {
  display: none;
}

.quiz-option__checkbox::before {
  content: "";
  width: 1.354vw;
  height: 1.354vw;
  background-color: #f7f7f7;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}

.quiz-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  position: relative;
  z-index: 1;
}

.quiz-click {
  display: flex;
  align-items: center;
}

.quiz-click__img {
  display: flex;
  width: 1.71875vw;
  margin-right: 0.885vw;
}

.quiz-btn {
  position: relative;
}

.quiz-btn__hint {
  position: absolute;
  left: 0;
  top: -3.125rem;
  transform: translateX(-30%);
  color: #282828;
  box-shadow: .25rem .4375rem 1.0625rem -0.375rem #000;
  background-color: #fff;
  text-align: center;
  padding: .875rem;
  border-radius: .375rem;
  z-index: 33;
  opacity: 0;
  transition: opacity 0.6s;
}

.btn-arrows {
  display: flex;
  gap: 0.104vw;
  margin-left: 0.625vw;
}

.btn-arrow {
  -webkit-animation: opacity 2s ease-in infinite;
  animation: opacity 2s ease-in infinite;
}

.btn-arrow:nth-child(2) {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

.btn-arrow:nth-child(3) {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

.quiz-btn--next:hover:disabled .quiz-btn__hint {
  opacity: 1;
}

.quiz-socials {
  display: flex;
  gap: 0.78125vw;
}

.quiz-social {
  cursor: pointer;
}

.quiz-social__input {
  display: none;
}

.quiz-social__wrapper {
  padding: 0.677vw 0.9375vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.521vw;
  transition: 0.3s;
  border-radius: .9375rem;
}

.quiz-social__input:checked~.quiz-social__wrapper {
  box-shadow: 0 .4375rem 1.6875rem rgba(40, 40, 40, 0.1);
  background-color: #fff;
}

.quiz-social:hover .quiz-social__wrapper {
  box-shadow: 0 .4375rem 1.6875rem rgba(40, 40, 40, 0.1);
  background-color: #fff;
}

.quiz-social__img {
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.604vw;
  height: 2.604vw;
}

.quiz-semifinal {
  display: flex;
  flex-direction: column;
}

.quiz-semifinal-items {
  display: none;
  z-index: 1;
  pointer-events: none;
}

.quiz-semifinal-img {
  display: flex;
  width: 37.083vw;
  position: absolute;
  right: -1.7vw;
  bottom: -3.1vw;
}

.quiz-gift {
  text-align: center;
  padding: 2vw 1.74vw;
  box-shadow: 0 20px 40px rgb(0 0 0 / 9%);
  border-radius: 0.84vw;
  background-color: #fff;
  position: absolute;
  left: 38.854vw;
  bottom: 10.573vw;
  z-index: 1;
}

.quiz-gift__lock {
  width: 2.03125vw;
  height: 2.03125vw;
  box-shadow: 0 6px 13px rgba(232, 169, 97, 0.43);
  background-color: #e8a961;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: -0.9375vw;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}

.quiz-gift__lock img {
  width: 0.573vw;
}

.quiz-right {
  padding-top: 3.65vw;
  padding-bottom: 3.44vw;
  border-radius: 1.563vw;
  background-size: cover;
  width: 24.53125vw;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.quiz-right__name {
  margin-top: auto;
}

.quiz-right__gift {
  width: 18.2vw;
  padding: 1.25vw 1.24vw;
  position: relative;
  border-radius: 0.833vw;
  background-color: rgba(255, 255, 255, 0.8);

}

.quiz-right__gift-lock {
  width: 2.03125vw;
  height: 2.03125vw;
  box-shadow: 0 6px 13px rgba(232, 169, 97, 0.43);
  background-color: #e8a961;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: -0.9375vw;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}

.quiz-right__gift-lock img {
  width: 0.573vw;
}

.quiz-bg {
  bottom: -5vw;
}

.reviews-videos {
  width: 36.51vw;
  position: relative;
  z-index: 1;
}

.reviews-video.slick-slide {
  display: flex;
}

.quiz-semifinal__socials {
  border: none;
  padding: 0;
  display: flex;
  gap: .9375rem;
  margin-bottom: 1.875rem;
}

.quiz-semifinal__socials input {
  display: none;
}

.quiz-semifinal__socials .wpcf7-list-item-label {

  text-indent: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .9375rem;
  font-size: .8125rem;
  padding: .9375rem;
  border: .0625rem solid #f1f1f1;
  border-radius: .8125rem;
  min-width: 6.25rem;
}

.quiz-semifinal__socials .wpcf7-list-item-label::before {
  content: "";
  width: 2.75rem;
  height: 2.75rem;
  background-repeat: no-repeat;
}

.quiz-semifinal__socials input[value="Telegram"]+.wpcf7-list-item-label::before {
  background-image: url('../image/telegram.svg');
}

.quiz-semifinal__socials input[value="Viber"]+.wpcf7-list-item-label::before {
  background-image: url('../image/viber.svg');
}

.quiz-semifinal__socials input[value="WhatsApp"]+.wpcf7-list-item-label::before {
  background-image: url('../image/whatsapp.svg');
}

.quiz-semifinal__socials input[value="Позвоните"]+.wpcf7-list-item-label::before {
  background-image: url('../image/phone.svg');
}

.quiz-semifinal__socials .wpcf7-list-item label:hover .wpcf7-list-item-label {
  box-shadow: 0 .4375rem 1.6875rem rgba(40, 40, 40, 0.1);
  background-color: #fff;
  border-color: transparent;
}

.quiz-semifinal__socials input[type="radio"]:checked+.wpcf7-list-item-label {
  box-shadow: 0 .4375rem 1.6875rem rgba(40, 40, 40, 0.1);
  background-color: #fff;
  border-color: transparent;
}

.quiz-semifinal .form__agreement {
  margin-top: 1.0625rem;
}

.quiz-semifinal__title {
  font-size: 2.9375rem;
  line-height: 1.2;
  margin-bottom: .8125rem;
}

.quiz-semifinal__subtitle {
  margin-bottom: 1.875rem;
  font-size: 1.25rem;
}

@keyframes loadingBg {
  0% {
    background-position: 2%;
  }

  100% {
    background-position: 100%;
  }
}


@media (max-width: 900px) {
  .reviews-videos {
    width: 100%;
  }

  .quiz {
    padding-top: 6rem;
  }

  .quiz-form {
    padding: 2.25rem 1.5625rem;
    border-radius: 1.375rem;
    width: 100%;
    height: auto;
  }

  .quiz-form::before {
    border-radius: 1.1875rem;
    width: 98%;
  }

  .quiz-form.is-semifinal {
    padding: 2rem;
  }

  .quiz-progress {
    margin-bottom: 1.375rem;
  }

  .quiz-item__title {
    font-size: 1.1875rem;
  }

  .quiz-progress__bar {
    height: 1.9375rem;
  }

  .quiz-progress__inner {
    left: .26rem;
    height: 1.375rem;
  }

  .quiz-options--num .quiz-option__input {
    width: 9.375rem;
    height: 3.9063rem;
    margin-right: 1.198rem;
  }

  .quiz-options--inline .quiz-option {
    width: 100%;
    margin-bottom: .9375rem;
  }

  .quiz-options--inline .quiz-option__wrapper {
    padding: .625rem;
    border-radius: .8rem;
  }

  .quiz-options--inline .quiz-option__checkbox {
    margin-right: .729rem;
  }

  .quiz-option {
    width: 12.24rem;
    margin: 0 2.083rem;
  }

  .quiz-option__wrapper {
    margin-bottom: 1.4063rem;
  }

  .quiz-option__img {
    height: 13.021rem;
  }

  .quiz-option__checkbox {
    width: 2.083rem;
    height: 2.083rem;
    bottom: -0.885rem;
  }

  .quiz-option__checkbox img {
    width: .573rem;
  }

  .quiz-option__checkbox::before {
    width: 1.354rem;
    height: 1.354rem;
  }

  .quiz-click__img {
    width: 1.7188rem;
    margin-right: .885rem;
  }



  .btn-arrows {
    gap: .104rem;
    margin-left: .625rem;
  }

  .quiz-socials {
    gap: .7813rem;
  }

  .quiz-social__wrapper {
    padding: .677rem .9375rem;
    gap: .521rem;
  }

  .quiz-social__img {
    width: 2.604rem;
    height: 2.604rem;
  }

  .quiz-semifinal .btn,
  .quiz-semifinal .input {
    width: 100%;
    height: 4.5rem;
  }

  .quiz-semifinal .btn {
    height: 4.5rem;
  }

  .policy {
    gap: .625rem;
  }

  .policy__check {
    width: 1.3rem;
    height: 1.3rem;
  }

  .policy__check img {
    width: .6rem;
  }

  .quiz-semifinal-img {
    width: 28.083rem;
    right: -0.3rem;
    bottom: -1.7rem;
  }

  .quiz-gift {
    padding: 2.24rem 2.083rem;
    left: 38.854rem;
    bottom: 10.573rem;
    z-index: 1;
    display: none;
  }

  .quiz-gift__lock {
    width: 2.0313rem;
    height: 2.0313rem;
    left: -0.9375rem;
  }

  .quiz-gift__lock img {
    width: .573rem;
  }

  .quiz-right {
    display: none;
  }

  .quiz-bg {
    bottom: 21rem;
  }

  .quiz-click {
    display: none;
  }

  .quiz-options {
    justify-content: space-between;
  }

  .quiz-option {
    width: 49%;
    margin: 0;
    margin-bottom: 1.5rem;
  }

  .quiz-bottom {
    justify-content: center;
  }

  .quiz-btn {
    margin-left: 0;
  }

  .quiz-btn--prev {
    margin-right: 1rem;
  }

  .quiz-btns {
    display: flex;
    margin-top: 1.5rem;
  }

  .quiz-btn__hint {
    display: none;
  }

  .quiz-options.quiz-options--num {
    justify-content: center;
  }

  .quiz-semifinal .fz24 br,
  .quiz-semifinal .fz30 br {
    display: none;
  }

  .to_top {
    display: none;
  }

  .quiz-form.is-semifinal {
    padding: 1.25rem;
  }

  .quiz-semifinal__socials {
    justify-content: space-between;
    gap: .625rem;
  }

  .quiz-semifinal__socials .wpcf7-list-item-label {
    font-size: .75rem;
    padding: .625rem;
    min-width: 100%;
  }

  .quiz-semifinal__socials span.wpcf7-list-item {
    width: 100%;
  }

  .quiz-semifinal__socials .wpcf7-list-item-label::before {
    width: 2rem;
    height: 2rem;
    background-size: contain;
  }
}




@media (max-width: 35.9375rem) {

  .quiz-semifinal__title {
    font-size: 2rem;
  }

  .quiz-semifinal__subtitle {
    font-size: 1rem;
  }

  .quiz-progress p {
    font-size: .625rem;
  }

  .quiz-semifinal__socials .wpcf7-list-item-label {
    font-size: .5625rem;
  }
}