/* Квиз «Рассчитаем ваш тираж» — внизу страницы, перед подвалом.
   Логика шагов — quiz.js. Без JS видна только первая карточка с вопросом. */
.quiz {
  max-width:1800px;
  margin:0 auto;
  padding:78px 4.4% 88px;
  background:#1b1e21;
  color:#e9eef1;
  font-family:'Golos Text',Arial,sans-serif;
  scroll-margin-top:20px;
}
.quiz-inner {max-width:1260px;margin:0 auto}
.quiz label {margin:0}
.quiz-intro {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);align-items:end;gap:20px 60px;margin-bottom:40px}
.quiz-kicker {grid-column:1/-1;display:flex;align-items:center;gap:10px;margin:0;color:#c9ad78;font-size:12px;font-weight:650;letter-spacing:.16em}
.quiz-kicker span {width:28px;height:1px;background:currentColor}
.quiz h2 {margin:0;font:400 clamp(46px,5.2vw,78px)/.98 Impact,'Arial Narrow',sans-serif;letter-spacing:.005em}
.quiz h2 em {color:#cdb17b;font-style:normal}
.quiz-intro>p:last-child {margin:0;color:#aebbc3;font-size:16px;line-height:1.55}

.quiz-layout {display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:stretch}

/* Карточка с вопросами */
.quiz-shell {
  position:relative;display:flex;flex-direction:column;min-height:560px;
  padding:34px 38px 30px;
  border:1px solid #c7ac7840;border-radius:18px;
  background:linear-gradient(160deg,#222a31,#181d22);
}
.quiz-progress {position:relative;height:4px;margin:0 0 34px;border-radius:4px;background:#ffffff14}
.quiz-progress-fill {position:absolute;inset:0 auto 0 0;width:0;border-radius:inherit;background:linear-gradient(90deg,#b8995f,#eacb8a);transition:width .45s cubic-bezier(.2,.7,.2,1)}
.quiz-progress-label {position:absolute;right:0;top:14px;color:#8f9ca7;font-size:12px;letter-spacing:.04em}
.quiz-progress-label b {color:#e2c68e;font-weight:600}

.quiz-step {display:none;margin:0;padding:0;border:0;min-width:0}
.quiz-step.is-active {display:block;animation:quiz-in .4s cubic-bezier(.2,.7,.2,1)}
@keyframes quiz-in {from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
.quiz-step legend {display:grid;gap:10px;padding:0;margin:0 0 24px}
.quiz-step-number {color:#c9ad78;font-size:12px;font-weight:650;letter-spacing:.14em;text-transform:uppercase}
.quiz-step legend>span:last-child {font-size:clamp(22px,2vw,28px);font-weight:500;line-height:1.25;letter-spacing:-.02em;color:#f0f3f5}
.quiz-step-hint {margin:-12px 0 20px;color:#8f9ca7;font-size:14px}

.quiz-options {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.quiz-option {
  position:relative;display:flex;align-items:center;gap:14px;min-height:62px;padding:14px 18px;
  border:1px solid #aab7be2e;border-radius:12px;background:#ffffff05;
  color:#dfe6eb;font-size:15px;line-height:1.35;cursor:pointer;
  transition:border-color .2s ease,background .2s ease,color .2s ease;
}
.quiz-option input {position:absolute;opacity:0;pointer-events:none}
.quiz-option:hover {border-color:#cdb17b80;background:#cdb17b0d}
.quiz-option-mark {flex:none;display:grid;place-items:center;width:22px;height:22px;border:1px solid #87949d;border-radius:50%;transition:all .2s ease}
.quiz-option-mark.is-check {border-radius:6px}
.quiz-option-mark::after {content:'';width:10px;height:6px;border:solid #172026;border-width:0 0 2px 2px;rotate:-45deg;translate:0 -1px;opacity:0;transition:opacity .15s}
.quiz-option:has(input:checked) {border-color:#cdb17b;background:#cdb17b14;color:#f6ead0}
.quiz-option:has(input:checked) .quiz-option-mark {border-color:#eacb8a;background:#eacb8a}
.quiz-option:has(input:checked) .quiz-option-mark::after {opacity:1}
.quiz-option:has(input:focus-visible) {outline:2px solid #dfc58f;outline-offset:2px}

.quiz-detail,.quiz-fields label {display:grid;gap:8px;color:#9fadb7;font-size:13px}
.quiz .quiz-detail {margin-top:18px}
.quiz-detail input,.quiz-fields input,.quiz-fields textarea {
  width:100%;box-sizing:border-box;padding:13px 15px;
  border:1px solid #aab7be33;border-radius:10px;background:#11161a;
  color:#eef2f4;font:15px/1.4 'Golos Text',Arial,sans-serif;
  transition:border-color .2s ease;
}
.quiz-fields textarea {resize:vertical;min-height:84px}
.quiz-detail input:focus,.quiz-fields input:focus,.quiz-fields textarea:focus {outline:0;border-color:#cdb17b}
.quiz-fields input::placeholder,.quiz-fields textarea::placeholder,.quiz-detail input::placeholder {color:#66737d}
.quiz-fields .is-invalid {border-color:#d97a6a}

/* Последний шаг */
.quiz-methods {display:grid;gap:10px;margin-bottom:20px}
.quiz-methods>span {color:#9fadb7;font-size:13px}
.quiz-methods>div {display:flex;flex-wrap:wrap;gap:8px}
.quiz-methods label {position:relative;cursor:pointer}
.quiz-methods input {position:absolute;opacity:0;pointer-events:none}
.quiz-methods label span {display:block;padding:9px 16px;border:1px solid #aab7be33;border-radius:999px;color:#cfd8de;font-size:14px;transition:all .2s ease}
.quiz-methods label:hover span {border-color:#cdb17b80}
.quiz-methods input:checked+span {border-color:#cdb17b;background:#cdb17b;color:#172026;font-weight:600}
.quiz-methods input:focus-visible+span {outline:2px solid #dfc58f;outline-offset:2px}
.quiz-fields {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.quiz-fields-wide {grid-column:1/-1}
.quiz-fields label>span {color:#66737d}
.quiz .quiz-consent {display:flex;align-items:flex-start;gap:10px;margin:18px 0 22px;color:#9fadb7;font-size:13px;line-height:1.45;cursor:pointer}
.quiz-consent input {flex:none;width:18px;height:18px;margin:0;accent-color:#cdb17b}
.quiz-submit {
  display:flex;align-items:center;justify-content:space-between;gap:24px;width:min(100%,340px);min-height:62px;
  padding:10px 10px 10px 26px;border:0;border-radius:999px;
  background:linear-gradient(135deg,#f6e2b4,#eacb8a);color:#172026;
  font:700 16px/1.2 'Golos Text',Arial,sans-serif;cursor:pointer;
  box-shadow:0 10px 30px -12px #eacb8a80;transition:transform .2s ease,filter .2s ease;
}
.quiz-submit:hover {transform:translateY(-2px);filter:brightness(1.05)}
.quiz-submit-arrow {display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#10182024;font-size:20px;font-weight:400}

/* Навигация */
.quiz-error {margin:16px 0 0;color:#e59a8b;font-size:14px}
.quiz-navigation {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:auto;padding-top:28px}
.quiz-back,.quiz-next {display:inline-flex;align-items:center;gap:10px;border-radius:999px;font:500 15px/1 'Golos Text',Arial,sans-serif;cursor:pointer;transition:all .2s ease}
.quiz-back {padding:12px 4px;border:0;background:none;color:#9fadb7}
.quiz-back:hover {color:#e2c68e}
.quiz-next {margin-left:auto;padding:15px 26px;border:1px solid #cdb17b;background:transparent;color:#e2c68e}
.quiz-next:hover {background:#cdb17b;color:#172026}
.quiz-back[hidden],.quiz-next[hidden] {display:none}

/* Готово */
.quiz-done {display:grid;justify-items:start;gap:12px;margin:auto 0;outline:0}
.quiz-done[hidden] {display:none}
.quiz-done-icon {display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#eacb8a;color:#172026;font-size:26px;font-weight:700}
.quiz-done .quiz-done-title {margin:6px 0 0;max-width:none;font:400 44px/1 Impact,'Arial Narrow',sans-serif;color:#f0f3f5}
.quiz-done p {margin:0;max-width:440px;color:#aebbc3;font-size:16px;line-height:1.55}
.quiz-shell.is-done .quiz-progress,.quiz-shell.is-done .quiz-navigation {display:none}

/* Карточка справа */
.quiz-aside {display:flex;flex-direction:column;overflow:hidden;border:1px solid #c7ac7840;border-radius:18px;background:#181d22}
.quiz-aside-photo {position:relative;height:250px;flex:none}
.quiz-aside-photo img {width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
.quiz-aside-photo::after {content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#181d22)}
.quiz-aside-status {position:absolute;top:16px;left:16px;z-index:1;display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:#10161bcc;backdrop-filter:blur(6px);color:#e9eef1;font-size:12px}
.quiz-aside-status i {width:8px;height:8px;border-radius:50%;background:#5fd38a;box-shadow:0 0 0 0 #5fd38a99;animation:quiz-online 2s infinite}
@keyframes quiz-online {70%{box-shadow:0 0 0 7px #5fd38a00}100%{box-shadow:0 0 0 0 #5fd38a00}}
.quiz-aside-body {display:flex;flex-direction:column;gap:12px;padding:6px 26px 26px;flex:1}
.quiz-aside-body p {margin:0;color:#aebbc3;font-size:14px;line-height:1.55}
.quiz .quiz-aside-name {color:#f0f3f5;font-size:18px;font-weight:500}
.quiz .quiz-aside-title {margin-top:8px;color:#c9ad78;font-size:12px;font-weight:650;letter-spacing:.14em;text-transform:uppercase}
.quiz-aside ul {display:grid;gap:10px;margin:0;padding:0;list-style:none}
.quiz-aside li {position:relative;padding-left:28px;color:#dfe6eb;font-size:15px}
.quiz-aside li::before {content:'✓';position:absolute;left:0;top:1px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#cdb17b26;color:#e2c68e;font-size:11px}
.quiz-aside-phone {display:grid;gap:3px;margin-top:auto;padding-top:18px;border-top:1px solid #99a8b330;color:#f0f3f5;font-size:21px;font-weight:500;text-decoration:none}
.quiz-aside-phone small {color:#8f9ca7;font-size:13px;font-weight:400}
.quiz-aside-phone:hover {color:#e3cb9a}

@media(max-width:1023px){
  .quiz-layout {grid-template-columns:1fr}
  .quiz-aside {flex-direction:row}
  .quiz-aside-photo {width:38%;height:auto}
  .quiz-aside-photo::after {inset:0 0 0 40%;background:linear-gradient(90deg,transparent,#181d22)}
  .quiz-aside-body {padding:24px 26px}
}
@media(max-width:767px){
  .quiz {padding:52px 24px 60px}
  .quiz-intro {grid-template-columns:1fr;margin-bottom:28px}
  .quiz h2 {font-size:clamp(42px,11vw,60px)}
  .quiz-intro>p:last-child {font-size:15px}
  .quiz-shell {min-height:0;padding:26px 20px 22px}
  .quiz-progress {margin-bottom:30px}
  .quiz-options,.quiz-fields {grid-template-columns:1fr}
  .quiz-option {min-height:54px;font-size:14px}
  .quiz-step legend>span:last-child {font-size:21px}
  .quiz-submit {width:100%}
  .quiz-next {padding:14px 22px}
  .quiz-aside {flex-direction:column}
  .quiz-aside-photo {width:auto;height:180px}
  .quiz-aside-photo::after {inset:40% 0 0;background:linear-gradient(transparent,#181d22)}
  .quiz-aside-body {padding:4px 20px 22px}
}
@media(prefers-reduced-motion:reduce){
  .quiz-step.is-active,.quiz-aside-status i {animation:none}
  .quiz-progress-fill,.quiz-option,.quiz-submit {transition:none}
}

/* На телефоне карточка менеджера скрыта — остаётся только квиз */
@media(max-width:767px){.quiz-aside{display:none}}

/* Способ связи: иконки, три кнопки в ряд */
.quiz-methods>div {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:520px}
.quiz-methods label span {display:flex;align-items:center;justify-content:center;gap:9px;padding:12px 14px;font-size:15px}
.quiz-methods svg {width:20px;height:20px;flex:none}
@media(max-width:767px){.quiz-methods>div {gap:8px}.quiz-methods label span {gap:7px;padding:11px 8px;font-size:14px}.quiz-methods svg {width:18px;height:18px}}

.quiz-consent a{color:#cdb17b;text-decoration:underline;text-underline-offset:2px}
.quiz-consent a:hover{color:#dfc58f}
