.elementor-5076 .elementor-element.elementor-element-d1b57c8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for shortcode, class: .elementor-element-9a91a03 *//*************************************************
 Fluent Forms #12 inside custom popup
 Полный стиль под карточки с картинками
*************************************************/

/* ===== POPUP BOX ===== */
#custom-popup-box{
  width: min(920px, 96vw) !important;
  max-height: 90vh !important;
  border-radius: 22px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 30px 90px rgba(15,23,42,.28) !important;
}

/* ===== БАЗА ФОРМЫ ===== */
#fluentform_12{
  margin: 0 !important;
  padding: 20px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #111827 !important;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  max-width: 100% !important;
}

/* ===== УБРАТЬ ЛИШНЕЕ ===== */
#fluentform_12 .ff-step-header .ff-step-title,
#fluentform_12 .ff-step-header .ff-el-progress-status{
  display: none !important;
}

/* ===== ПРОГРЕСС ===== */
#fluentform_12 .ff-step-header{
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#fluentform_12 .ff-el-progress-bar-wrap,
#fluentform_12 .ff-step-progress{
  width: 100% !important;
  height: 10px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: #eef2f7 !important;
}

#fluentform_12 .ff-el-progress-bar,
#fluentform_12 .ff-step-progress-bar{
  height: 100% !important;
  background: linear-gradient(90deg,#f97316,#fb923c) !important;
}

#fluentform_12 .ff-el-progress-bar-percentage{
  display: none !important;
}

/* ===== ЗАГОЛОВОК ВОПРОСА ===== */
#fluentform_12 .ff-el-label{
  display: block !important;
  margin: 0 0 16px !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  color: #111827 !important;
}

/* ===== КОНТЕЙНЕР ВАРИАНТОВ ===== */
#fluentform_12 .ff-el-input--content{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  width: 100% !important;
  align-items: stretch !important;
}

/* ===== КАРТОЧКА ===== */
#fluentform_12 .ff-el-form-check{
  margin: 0 !important;
  width: 100% !important;
  position: relative !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 10px 25px rgba(0,0,0,.06) !important;
  transition: .2s ease !important;
}

/* скрыть стандартный input */
#fluentform_12 .ff-el-form-check input{
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* label как контейнер карточки */
#fluentform_12 .ff-el-form-check .ff-el-form-check-label{
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #111827 !important;
  text-align: left !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

/* hover */
#fluentform_12 .ff-el-form-check:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 35px rgba(0,0,0,.1) !important;
  border-color: #d1d5db !important;
}

/* ===== КАРТИНКА СВЕРХУ ===== */
#fluentform_12 .ff-el-form-check img{
  display: block !important;
  width: 100% !important;
  height: 180px !important;
  object-fit: cover !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #f3f4f6 !important;
}

/* ===== ПОДПИСЬ СНИЗУ ===== */
#fluentform_12 .ff-el-form-check .ff-el-form-check-label span,
#fluentform_12 .ff-el-form-check .ff-el-form-check-label div,
#fluentform_12 .ff-el-form-check .ff-el-form-check-label p{
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 14px !important;
  text-align: center !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: #111827 !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ===== ВЫБРАННАЯ КАРТОЧКА ===== */
#fluentform_12 .ff-el-form-check.ff_item_selected,
#fluentform_12 .ff-el-form-check input:checked + .ff-el-form-check-label{
  border-color: #ff6a00 !important;
  box-shadow: 0 0 0 3px rgba(255,106,0,.15), 0 16px 35px rgba(255,106,0,.12) !important;
  background: #fff !important;
}

#fluentform_12 .ff-el-form-check.ff_item_selected .ff-el-form-check-label,
#fluentform_12 .ff-el-form-check.ff_item_selected .ff-el-form-check-label *{
  background: transparent !important;
  color: #111827 !important;
}

/* ===== УБРАТЬ СИНИЕ ACTIVE / FOCUS ===== */
#fluentform_12 *,
#fluentform_12 *:focus,
#fluentform_12 *:active{
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* ===== УБРАТЬ ВНУТРЕННИЕ РАМКИ ===== */
#fluentform_12 .ff-el-form-check-label::before,
#fluentform_12 .ff-el-form-check-label::after,
#fluentform_12 .ff-el-form-check-label *::before,
#fluentform_12 .ff-el-form-check-label *::after{
  display: none !important;
}

#fluentform_12 .ff-el-form-check-label *,
#fluentform_12 .ff-el-form-check-label span,
#fluentform_12 .ff-el-form-check-label div{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* ===== НАВИГАЦИЯ ===== */
#fluentform_12 .ff-btn-group,
#fluentform_12 .ff-step-nav{
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  margin-top: 20px !important;
  padding-top: 16px !important;
  border-top: 1px solid #e5e7eb !important;
}

/* назад */
#fluentform_12 .ff-btn-prev,
#fluentform_12 .ff-btn.ff-btn-secondary{
  background: #fff !important;
  color: #111827 !important;
  border: 1px solid #d1d5db !important;
  border-radius: 999px !important;
  padding: 12px 18px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  min-width: 120px !important;
}

/* дальше / submit */
#fluentform_12 .ff-btn-next,
#fluentform_12 .ff-btn-submit,
#fluentform_12 .ff-btn.ff-btn-primary{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 140px !important;
  background: linear-gradient(135deg,#f97316,#ea580c) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 13px 24px !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  box-shadow: 0 16px 36px rgba(249,115,22,.26) !important;
}

#fluentform_12 .ff-btn-next:hover,
#fluentform_12 .ff-btn-submit:hover,
#fluentform_12 .ff-btn.ff-btn-primary:hover{
  transform: translateY(-1px);
}

/* ===== АДАПТИВ ===== */
@media (max-width: 767px){
  #custom-popup-box{
    width: min(96vw, 96vw) !important;
    max-height: 92vh !important;
    border-radius: 18px !important;
  }

  #fluentform_12{
    padding: 14px !important;
  }

  #fluentform_12 .ff-el-label{
    font-size: 20px !important;
    margin-bottom: 12px !important;
  }

  #fluentform_12 .ff-el-input--content{
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  #fluentform_12 .ff-el-form-check img{
    height: 140px !important;
  }

  #fluentform_12 .ff-el-form-check .ff-el-form-check-label span,
  #fluentform_12 .ff-el-form-check .ff-el-form-check-label div,
  #fluentform_12 .ff-el-form-check .ff-el-form-check-label p{
    font-size: 15px !important;
    padding: 12px 10px 14px !important;
  }

  #fluentform_12 .ff-btn-group,
  #fluentform_12 .ff-step-nav{
    position: sticky !important;
    bottom: 0 !important;
    background: rgba(255,255,255,.96) !important;
    backdrop-filter: blur(8px);
    padding-bottom: 10px !important;
  }
}

@media (max-width: 520px){
  #fluentform_12 .ff-el-input--content{
    grid-template-columns: 1fr !important;
  }

  #fluentform_12 .ff-el-form-check img{
    height: 180px !important;
  }

  #fluentform_12 .ff-btn-prev,
  #fluentform_12 .ff-btn.ff-btn-secondary,
  #fluentform_12 .ff-btn-next,
  #fluentform_12 .ff-btn-submit,
  #fluentform_12 .ff-btn.ff-btn-primary{
    min-width: auto !important;
  }
}/* End custom CSS */