/* gsb-quiz.css — стили квиза, вынесены из инлайна /podbor/ 20260820-031137.
   Подключать вместе с /assets/js/gsb-quiz.js и leaflet. */


/* ---- квиз ---- */
.qz{margin:26px 0 0;border:1px solid var(--hair2);border-radius:22px;background:rgba(255,255,255,.55);overflow:hidden}

.qz-head{display:flex;align-items:center;gap:14px;padding:15px 22px;border-bottom:1px solid var(--hair);font-size:.85rem;color:var(--label)}

.qz-head b{font-family:var(--m);color:var(--ink)}

.qz-bar{flex:1;height:4px;border-radius:4px;background:var(--hair);overflow:hidden}

.qz-bar i{display:block;height:100%;width:0;background:var(--blue2);transition:width .35s var(--ease)}

.qz-step{display:none;padding:clamp(20px,3.4vw,32px)}

.qz-step.is-on{display:block}

.qz-step h2{margin:0 0 16px;font-size:clamp(1.2rem,2.4vw,1.6rem);letter-spacing:-.02em;color:var(--ink)}

.qz-err{animation:qzshake .5s}


/* фото-карточки объектов: ч/б кадры «с камер» */
.qz-objs{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(148px,1fr))}

.qz-obj{display:flex;flex-direction:column;padding:0;border:1px solid var(--hair);border-radius:14px;background:var(--paper);cursor:pointer;overflow:hidden;text-align:left;font:inherit;color:var(--ink);transition:border-color .22s var(--ease),transform .22s var(--ease)}

.qz-obj:hover{border-color:var(--ink);transform:translateY(-2px)}

.qz-obj.is-sel{border-color:var(--blue2);box-shadow:0 0 0 2px var(--blue2)}

.qz-ic{display:flex;align-items:center;justify-content:center;padding:20px 0 15px;background:var(--paper2)}

.qz-ic svg{width:62px;height:62px;stroke:var(--ink2);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

.qz-ic .acc{stroke:var(--blue2);opacity:.55}

.qz-obj.is-sel .acc,.qz-obj:hover .acc{opacity:1}

.qz-obj>span:last-child{display:flex;align-items:center;min-height:52px;padding:11px 13px;font-size:.9rem;font-weight:500;line-height:1.25;border-top:1px solid var(--hair)}


.qz-sub{font-size:.85rem;color:var(--label);letter-spacing:.06em;text-transform:uppercase;margin:20px 0 10px}

.qz-sub:first-of-type{margin-top:0}

.qz-chips{display:flex;flex-wrap:wrap;gap:10px}

.qz-chip{padding:12px 20px;border:1px solid var(--hair2);border-radius:100px;background:var(--paper);cursor:pointer;font:inherit;font-size:.94rem;color:var(--ink2);transition:border-color .2s}

.qz-chip:hover{border-color:var(--ink)}

.qz-chip.is-sel{border-color:var(--blue2);box-shadow:0 0 0 2px var(--blue2);color:var(--ink)}

.qz-guardnote{margin-top:16px;padding:13px 16px;border:1px solid var(--hair2);border-radius:12px;background:var(--paper2);font-size:.9rem;color:var(--mut)}

.qz-guardnote b{color:var(--ink)}


.qz-map{margin-top:16px;border:1px solid var(--hair);border-radius:14px;overflow:hidden}

.qz-map{height:260px;cursor:crosshair}

.qz-pin{background:none;border:none}

.qz-pin svg{filter:drop-shadow(0 2px 3px rgba(18,19,16,.35))}
.qz-map:empty::before{content:"Карта загружается…";display:flex;align-items:center;justify-content:center;height:100%;color:var(--faint);font-size:.9rem}

.qz input[type=text],.qz input[type=tel]{width:100%;min-height:50px;padding:0 16px;border:1px solid var(--hair2);border-radius:12px;background:var(--paper);font:inherit;font-size:1rem;color:var(--ink)}

.qz input:focus-visible{border-color:var(--blue2)}

.qz-note{font-size:.85rem;color:var(--faint);margin-top:10px;max-width:60ch}


.qz-nav{display:flex;align-items:center;gap:12px;margin-top:24px}

.qz-nav .spacer{flex:1}

.qz-back{width:46px;height:46px;border:1px solid var(--hair2);border-radius:100px;background:transparent;cursor:pointer;color:var(--ink);font-size:1.1rem}

.qz-enter{font-size:.78rem;color:var(--faint)}


/* результат */
.qz-est{margin:0 0 20px;border:1px solid var(--hair2);border-radius:16px;background:var(--paper2);padding:18px 20px}

.qz-est-row{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--hair);font-size:.95rem;color:var(--mut)}

.qz-est-row b{color:var(--ink);font-family:var(--m);font-weight:500;text-align:right}

.qz-est-row:last-of-type{border-bottom:none}

.qz-est-main{font-size:1.05rem}

.qz-est-main b{font-size:1.25rem}

.qz-est-note{margin:12px 0 0;font-size:.84rem;color:var(--faint);line-height:1.55}

.qz-est-win{color:var(--blue);font-weight:500}


.qz-form{display:grid;gap:14px;max-width:460px}

.qz-cap{display:flex;align-items:center;gap:12px;font-size:.92rem;color:var(--mut)}

.qz-cap b{color:var(--ink);font-family:var(--m)}

.qz-cap input{max-width:110px}

.qz-final.is-sent .qz-form,.qz-final.is-sent .qz-nav,.qz-final.is-sent h2,.qz-final.is-sent .qz-note,.qz-final.is-sent .qz-est{display:none}

.qz-done{display:none;text-align:center;padding:30px 10px}

.qz-final.is-sent .qz-done{display:block}

.qz-done b{display:block;font-size:1.4rem;color:var(--ink);margin-bottom:10px}

.qz-done p{color:var(--mut)}



/* фон квиза: мягкая аврора + призрачная пиктограмма выбранного объекта */
.qz{position:relative}

.qz-ghost{position:absolute;right:-30px;bottom:-40px;width:min(360px,55%);aspect-ratio:1;opacity:.07;pointer-events:none;transition:opacity .4s}

.qz-ghost svg{width:100%;height:100%;stroke:var(--ink);fill:none;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}

.qz-ghost .acc{stroke:var(--blue2)}

.qz[data-step="0"] .qz-ghost{opacity:0}

.qz-embed body{background:
  radial-gradient(560px 400px at 90% 8%, #e2e7ee 0%, transparent 60%),
  radial-gradient(680px 500px at 4% 100%, #eee7d3 0%, transparent 62%),
  var(--paper)}


/* embed-режим (попап) */
.qz-embed .rhdr,.qz-embed .rdrawer,.qz-embed .rscrim,.qz-embed .rfoot,.qz-embed .crumbs,.qz-embed .pgh h1,.qz-embed .pgh .lead,.qz-embed .sec,.qz-embed .aurora{display:none!important}

.qz-embed body::after{display:none}

.qz-embed .pgh{padding:10px 0 0}

.qz-embed .qz{margin-top:0;border:none;border-radius:0;background:transparent}

.qz-embed .qz-map{height:220px}