/* SAMUI · подбор программы /podbor-spa-programmy/ */
.quiz-hero{padding-bottom:110px}
.quiz-sec{padding-top:0;margin-top:-70px;position:relative;z-index:2}
.quiz{gap:26px;padding:30px 40px 40px;min-height:420px}
.quiz__top{display:flex;align-items:center;gap:16px;min-height:36px}
.quiz__back{display:inline-flex;align-items:center;gap:6px;font:600 13px/1 var(--sm-font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--sm-muted)}
.quiz__back:hover{color:var(--sm-text)}
.quiz__back .ico{width:16px;height:16px;transform:rotate(180deg)}
.quiz__dots{display:flex;gap:8px;margin:0 auto;list-style:none}
.quiz__dots li{width:44px;height:6px;border-radius:3px;background:var(--sm-line-soft);transition:background .3s}
.quiz__dots li.is-on{background:var(--sm-blue)}
.quiz__dots li.is-done{background:var(--sm-brown)}
.quiz__n{font-size:14px;color:var(--sm-muted);min-width:90px;text-align:right}
.quiz__back[hidden]+.quiz__dots{margin-left:0}
.quiz__q{border:0;padding:0;margin:0;min-width:0;display:flex;flex-direction:column;gap:24px;animation:quiz-in .35s ease both}
.quiz__q[hidden],.quiz__res[hidden]{display:none}
.quiz__h{padding:0;font:700 clamp(26px,calc(3vw / var(--zf,1)),40px)/1.1 var(--sm-font-display);text-transform:uppercase;letter-spacing:-.005em;outline:0}
.quiz__opts{display:grid;gap:14px}
.quiz__opts--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.quiz__opts--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.quiz__opts--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.quiz__opts--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}
.quiz__opt[hidden]{display:none}
.quiz__opt{display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 14px 20px;border-radius:24px;background:var(--sm-sand);box-shadow:inset 0 0 0 1px var(--sm-line-soft);text-align:center;transition:transform .2s,box-shadow .2s,background .2s}
.quiz__opt:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 2px var(--sm-blue),0 12px 22px rgba(43,26,16,.1)}
.quiz__opt.is-on{background:var(--sm-brown);color:var(--sm-on-dark);box-shadow:none}
.quiz__opt.is-on small{color:var(--sm-on-dark-muted,#C9AE8F)}
.quiz__art{height:96px;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.quiz__art img{max-height:96px;width:auto;max-width:130px;height:auto;filter:drop-shadow(0 6px 6px rgba(43,26,16,.18));transition:transform .3s}
.quiz__opt:hover .quiz__art img{transform:scale(1.08) rotate(-3deg)}
.quiz__opt b{font:700 17px/1.2 var(--sm-font-display);text-transform:uppercase;letter-spacing:.02em}
.quiz__opt small{font-size:14px;line-height:1.35;color:var(--sm-muted)}
.quiz__opts--txt .quiz__opt{padding:30px 16px;justify-content:center;min-height:120px}
.quiz__opts--txt .quiz__opt b{font-size:20px}
.quiz__res{display:flex;flex-direction:column;gap:22px;animation:quiz-in .4s ease both}
.quiz__note{font-size:16px;color:var(--sm-muted);margin-top:-10px}
.quiz__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none}
.quiz__card{background:var(--sm-sand);animation:quiz-in .45s ease both;animation-delay:calc(var(--i) * .09s)}
.quiz__card .pcard__title a::after{display:none}
.quiz__best{left:14px;right:auto}
.quiz__why{display:flex;flex-wrap:wrap;gap:6px}
.quiz__why span{height:28px;padding:0 11px;display:inline-flex;align-items:center;border-radius:var(--sm-r-pill);box-shadow:inset 0 0 0 1px var(--sm-line);font-size:13px}
.quiz__card .pcard__foot{padding-top:6px}
.quiz__btns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:6px}
.quiz__btns .btn{padding:0 10px;gap:8px;height:48px;font-size:13.5px}
.quiz__btns .ico{width:18px;height:18px;flex:none}
.quiz__vip{display:flex;align-items:center;gap:16px;padding:18px 22px;border-radius:22px;background:var(--sm-brown);color:var(--sm-on-dark)}
.quiz__vip>.ico:first-child{width:34px;height:34px;flex:none;color:#7FCBE3}
.quiz__vip span{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.quiz__vip b{font:700 17px/1.2 var(--sm-font-display);text-transform:uppercase}
.quiz__vip small{font-size:14.5px;line-height:1.4;color:var(--sm-on-dark-muted,#C9AE8F)}
.quiz__vip>.ico:last-child{width:22px;height:22px;flex:none}
.quiz__acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
@keyframes quiz-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .quiz__q,.quiz__res,.quiz__card{animation:none} }
@media (max-width:1100px){
  .quiz__opts--5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .quiz__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .quiz-hero{padding-bottom:84px}
  .quiz-sec{margin-top:-56px}
  .quiz{padding:20px 16px 24px;gap:18px;min-height:0}
  .quiz__dots li{width:28px}
  .quiz__n{min-width:0;font-size:13px}
  .quiz__q{gap:16px}
  .quiz__opts,.quiz__opts--5,.quiz__opts--4,.quiz__opts--3,.quiz__opts--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .quiz__opt{padding:14px 10px 16px;border-radius:20px}
  .quiz__art{height:68px}.quiz__art img{max-height:68px;max-width:96px}
  .quiz__opt b{font-size:14px}.quiz__opt small{font-size:12.5px}
  .quiz__opts--txt .quiz__opt{padding:20px 10px;min-height:92px}
  .quiz__opts--txt .quiz__opt b{font-size:16px}
  .quiz__grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .quiz__vip{padding:14px 16px;gap:12px}
  .quiz__acts .btn{flex:1 1 calc(50% - 10px);padding:0 10px;font-size:13px}
}
/* компактная шапка: вопросы видны сразу на первом экране */
.quiz-hero{padding:calc(var(--sm-header) + 4px) 0 104px}
.quiz-hero .wrap{gap:10px}
.quiz-hero .h1{font-size:clamp(30px,calc(4vw / var(--zf,1)),56px)}
.quiz-hero .page-hero__lead{font-size:18px;max-width:640px}
.quiz__q>legend{margin-bottom:22px;float:left;width:100%}
.quiz__q>legend+*{clear:both}
.quiz__q{gap:0}
.quiz__card .pcard__ph{aspect-ratio:16/11}
@media (max-width:760px){
  .quiz-hero{padding-bottom:76px}
  .quiz-hero .page-hero__lead{font-size:15px}
  .quiz__q>legend{margin-bottom:14px}
  .quiz__card{flex-direction:row}
  .quiz__card .pcard__ph{flex:0 0 34%;aspect-ratio:auto;min-height:100%}
  .quiz__card .pcard__b{padding:12px 12px 14px;gap:6px;min-width:0}
  .quiz__card .pcard__title{font-size:16px}
  .quiz__card .pcard__kicker{font-size:10px}
  .quiz__btns .btn{height:42px;font-size:11.5px;gap:5px;padding:0 6px;letter-spacing:0}
  .quiz__btns .ico{display:none}
  .quiz__best{left:8px;top:8px;height:22px;padding:0 8px;font-size:9px}
}
.quiz__card .pcard__badge{z-index:3}
