/* ---------- КВИЗ ---------- */
.quiz{
  position:fixed;
  z-index:20;
  inset:0;
  display:grid;
  place-items:center;
  padding:16px;
  background:rgba(3,12,10,.58);
  backdrop-filter:blur(6px);
  opacity:0;
  visibility:hidden;
  transition:.28s;
}
.quiz.open{opacity:1;visibility:visible}
.quiz-box{
  width:min(820px,100%);
  max-height:calc(100vh - 32px);
  overflow:auto;
  border:1px solid rgba(142,224,202,.42);
  border-radius:28px;
  background:linear-gradient(145deg,#1f3933,#101b18);
  box-shadow:0 35px 100px #000a;
}
.quiz-sticky{
  position:sticky;
  z-index:2;
  top:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:14px 22px;
  border-bottom:1px solid rgba(142,224,202,.28);
  background:rgba(20,49,42,.94);
  backdrop-filter:blur(16px);
  font-size:18px;
  line-height:1.35;
  color:#e5fff7;
}
.quiz-promo-date{color:var(--aqua);font-weight:800}
.quiz-close{
  width:32px;
  height:32px;
  border:0;
  border-radius:10px;
  background:#fff1;
  color:#fff;
  cursor:pointer;
  font-size:25px;
  line-height:1;
}
.quiz-body{display:grid;grid-template-columns:218px 1fr;gap:27px;padding:26px}
.consultant{
  align-self:start;
  padding:16px;
  border:1px solid rgba(142,224,202,.28);
  border-radius:19px;
  background:linear-gradient(145deg,rgba(55,120,104,.4),rgba(15,34,29,.78));
}
.consultant-photo{
  display:block;
  width:100%;
  height:174px;
  margin:0 0 13px;
  object-fit:cover;
  object-position:center top;
  border:1px solid rgba(142,224,202,.28);
  border-radius:13px;
}
.consultant strong{display:block;margin-bottom:6px;font-size:15px}
.consultant p{margin:0;color:#c9ddd7;font-size:13px;line-height:1.45}
.quiz-step{color:var(--light);font-size:13px}
.quiz h2,.quiz-form-heading{margin:13px 0 8px;font-size:34px;line-height:1.1;letter-spacing:-.05em}
.quiz-help{min-height:42px;margin:0 0 19px;color:#c9ddd7;font-size:14px;line-height:1.45}
.answers{display:grid;gap:9px}
.answer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px;
  border:1px solid rgba(142,224,202,.26);
  border-radius:15px;
  background:#fff1;
  color:var(--paper);
  text-align:left;
  cursor:pointer;
  transition:.2s;
}
.answer:after{content:'→';flex:0 0 24px;color:var(--light);font-size:19px;text-align:center}
@media (hover:hover) and (pointer:fine){
  .answers:not(.suppress-hover) .answer:hover{transform:translateX(4px);border-color:var(--light);background:rgba(142,224,202,.12)}
}
.answers.is-transitioning{pointer-events:none}
.answers.is-transitioning .answer.selected{animation:answer-confirm .65s ease both}
.answer.selected{
  border-color:var(--light);
  background:rgba(142,224,202,.22);
  box-shadow:0 0 0 2px rgba(142,224,202,.17),inset 0 1px rgba(255,255,255,.12);
  transform:none;
}
.answer.selected:after{
  content:'✓';
  display:grid;
  width:22px;
  height:22px;
  place-items:center;
  border-radius:50%;
  background:var(--light);
  color:#0c1513;
  font-size:14px;
  font-weight:900;
}
.quiz-nav{display:flex;justify-content:space-between;gap:10px;margin-top:16px}
.quiz-nav button{
  min-height:44px;
  padding:10px 17px;
  border:1px solid rgba(142,224,202,.38);
  border-radius:13px;
  background:rgba(255,255,255,.06);
  color:#e8fff8;
  font-weight:700;
  cursor:pointer;
}
.quiz-nav .quiz-next{margin-left:auto;background:rgba(72,157,137,.42)}
.quiz-nav button:disabled{opacity:.38;cursor:not-allowed}
.quiz-nav .quiz-next:disabled{background:rgba(255,255,255,.06)}
.quiz-form{display:none}
.quiz-form.show{display:block;animation:quiz-rise .42s cubic-bezier(.2,.8,.2,1) both}
.phone-fields{display:block;opacity:1}
.phone-fields-inner{padding-top:0}
.phone-input-wrap{position:relative;margin-top:2px}
.phone-input-wrap label{
  position:absolute;
  z-index:1;
  top:50%;
  left:20px;
  transform:translateY(-50%);
  color:#c9ddd7;
  font-size:18px;
  line-height:1;
  pointer-events:none;
  transition:top .18s ease,transform .18s ease,font-size .18s ease,color .18s ease;
}
.phone-input-wrap:not(.is-floating) label{top:0;height:60px;transform:none;display:flex;align-items:center}
.phone-input-wrap.is-floating label{
  top:0;
  height:auto;
  display:block;
  transform:translateY(-50%);
  padding:0 2px;
  background:transparent;
  text-shadow:-3px 0 #0c1513,3px 0 #0c1513;
  color:#bfe8dc;
  font-size:12px;
  letter-spacing:.01em;
}
.phone-input-wrap.is-floating input[type="tel"]::placeholder{color:transparent!important;opacity:0!important}
.theme--a .phone-input-wrap.is-floating label{background:transparent;text-shadow:-3px 0 #d8dfd9,3px 0 #d8dfd9}
.quiz-form input[type="tel"]{
  width:100%;
  padding:18px 20px;
  border:1px solid rgba(142,224,202,.5);
  border-radius:15px;
  background:#0c1513;
  color:#fff;
  font-size:18px;
  letter-spacing:.02em;
  transition:.2s;
}
.phone-input-wrap.is-floating input[type="tel"]{padding-top:22px;padding-bottom:14px}
.quiz-form input[type="tel"]::placeholder{color:transparent;opacity:1}
.phone-input-wrap:not(.is-floating) input[type="tel"]::placeholder{color:transparent}
.phone-input-wrap.is-complete input[type="tel"]{border-color:rgba(158,229,209,.9);box-shadow:0 0 0 3px rgba(142,224,202,.1)}
.quiz-form input[type="tel"]:focus{outline:none;border-color:var(--light);box-shadow:0 0 0 3px rgba(142,224,202,.18)}
.phone-error{min-height:18px;margin:7px 0 -2px;color:#ffc9c1;font-size:13px;line-height:1.35}
.phone-input-wrap.has-error input[type="tel"]{border-color:#f09588;box-shadow:0 0 0 3px rgba(240,149,136,.14)}
.quiz-form .cta{width:100%;margin-top:14px;animation:turquoise-pulse 1s infinite}
.quiz-final-benefits{display:grid;gap:7px;margin:0 0 15px;padding:0;list-style:none;color:var(--paper);font-size:14px;line-height:1.35}
.quiz-final-offer-note{margin:0 0 16px;color:#c9ddd7;font-size:14px;line-height:1.45}
.quiz-form-note{margin:10px 0 0;color:#b7d0c9;text-align:center;font-size:12px;line-height:1.4}
.quiz-coupons{margin:17px 0 0;color:#c9ddd7;font-size:13px;line-height:1.4}
.quiz-coupons strong{color:var(--light);font-weight:800}
.quiz-loader{display:none;min-height:360px;padding:32px 24px;text-align:center;color:#f4fffc}
.quiz-loader.show{display:block;animation:quiz-rise .35s ease both}
.quiz-loader-ring{position:relative;width:120px;height:120px;margin:0 auto 24px}
.quiz-loader-ring svg{display:block;width:120px;height:120px;transform:rotate(-90deg)}
.quiz-loader-track,.quiz-loader-bar{fill:none;stroke-width:8}
.quiz-loader-track{stroke:rgba(142,224,202,.18)}
.quiz-loader-bar{stroke:var(--light);stroke-linecap:round;transition:stroke-dashoffset .1s linear}
.quiz-loader-ring span{position:absolute;inset:0;display:grid;place-items:center;font-size:25px;font-weight:800}
.quiz-loader h2{margin:0 0 7px;font-size:23px;letter-spacing:-.03em;color:inherit}
.quiz-loader p{margin:0;color:#c9ddd7;font-size:14px}
.quiz-loader-steps{display:grid;gap:10px;max-width:340px;margin:24px auto 0;padding:0;list-style:none;text-align:left}
.quiz-loader-steps li{display:flex;align-items:center;gap:10px;color:rgba(201,221,215,.52);font-size:14px;opacity:.35;transform:translateY(7px);transition:opacity .35s ease,transform .35s ease,color .35s ease}
.quiz-loader-steps li:before{content:'';display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border:2px solid rgba(142,224,202,.3);border-radius:50%;box-sizing:border-box}
.quiz-loader-steps li.is-current{color:inherit;opacity:1;transform:translateY(0)}
.quiz-loader-steps li.is-current:before{border-color:transparent;border-top-color:var(--light);animation:quiz-loader-spin .7s linear infinite}
.quiz-loader-steps li.is-done{color:#b8d9d0;opacity:1;transform:translateY(0)}
.quiz-loader-steps li.is-done:before{content:'✓';border-color:var(--light);background:var(--light);color:#12342d;font-size:14px;font-weight:800;animation:none}
@keyframes quiz-loader-spin{to{transform:rotate(360deg)}}
.quiz-loader p{margin:0;color:#c9ddd7;font-size:15px}

@keyframes quiz-rise{
  from{opacity:0;transform:translateY(36px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes question-enter{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes answer-confirm{
  0%{transform:scale(1)}
  35%{transform:scale(1.015)}
  100%{transform:scale(1)}
}
.question-enter{animation:question-enter .32s ease both}

@media (max-width:680px){
  .quiz{align-items:center;padding:16px;background:rgba(2,13,11,.5)}
  .quiz-box{width:100%;max-height:calc(100dvh - 32px);border-radius:24px}
  .quiz-sticky{align-items:flex-start;gap:10px;padding:12px 16px;font-size:16px;line-height:1.4}
  .quiz-close{flex:0 0 auto;width:34px;height:34px}
  .quiz-body{display:block;padding:16px}
  .consultant{display:grid;grid-template-columns:70px minmax(0,1fr);gap:11px;align-items:center;padding:10px;margin-bottom:18px}
  .consultant-photo{width:70px;height:76px;margin:0;border-radius:10px}
  .consultant strong{font-size:14px}
  .consultant p{font-size:12px;line-height:1.4}
  .quiz h2,.quiz-form-heading{margin:8px 0 7px;font-size:28px;line-height:1.08}
  .quiz-help{min-height:0;margin:0 0 15px;font-size:14px}
  .quiz-final-benefits{gap:6px;margin-bottom:14px;font-size:14px}
  .quiz-final-offer-note{margin-bottom:14px;font-size:13px}
  .quiz-coupons{margin-top:14px;font-size:12px}
  .quiz-loader{min-height:310px;padding:26px 16px}
  .quiz-loader-ring,.quiz-loader-ring svg{width:108px;height:108px}
  .quiz-loader h2{font-size:21px}
  .answers{gap:8px}
  .answer{min-height:54px;padding:14px;border-radius:14px;font-size:14px}
  .quiz-nav{position:sticky;bottom:-16px;margin:14px -16px -16px;padding:11px 16px;background:linear-gradient(180deg,rgba(16,27,24,0),#101b18 35%)}
}
