/* Прототип: экран результата квиза с превью подборки.
   Дополняет боевой quiz.css, ничего в нём не переопределяя без нужды. */

.nv-quiz__found {
    display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
    margin: 0 0 4px;
}
.nv-quiz__found-num { font: 700 34px/1.1 Geologica, sans-serif; color: #6c2bd9; }
.nv-quiz__found-txt { font: 500 16px/1.35 Mulish, sans-serif; color: #1b1b28; }
.nv-quiz__found-sub { margin: 0 0 16px; font: 400 14px/1.45 Mulish, sans-serif; color: #6b6b80; }

/* лента карточек: две открытые + третья пригашенная.
   Класс .nv-podbor занят ещё и блоком «Мы подобрали для вас» внутри статей,
   поэтому сетка обязана быть под .nv-quiz — иначе она ломает блок в статье. */
.nv-quiz .nv-podbor {
    display: grid; grid-template-columns: 1fr 1fr 88px; gap: 12px;
    margin: 0 0 18px;
}
.nv-podbor__card {
    position: relative; overflow: hidden; border-radius: 14px;
    background: #fff; border: 1px solid #ece9f6; min-width: 0;
    display: flex; flex-direction: column;
}
.nv-podbor__pic { position: relative; aspect-ratio: 16 / 10; background: #f2f0fa; }
.nv-podbor__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nv-podbor__price {
    position: absolute; left: 8px; bottom: 8px;
    background: rgba(27, 27, 40, .82); color: #fff; backdrop-filter: blur(4px);
    padding: 4px 9px; border-radius: 8px; font: 600 13px/1 Mulish, sans-serif;
}
.nv-podbor__body { padding: 10px 12px 12px; }
.nv-podbor__name { margin: 0 0 4px; font: 600 15px/1.25 Geologica, sans-serif; color: #1b1b28; }
.nv-podbor__meta { margin: 0; font: 400 13px/1.4 Mulish, sans-serif; color: #6b6b80; }

/* третья карточка — «есть ещё»: та же вёрстка, но пригашена и закрыта */
.nv-podbor__more {
    border-style: dashed; border-color: #d9d2f2; background: #faf9ff;
    align-items: center; justify-content: center; text-align: center;
    cursor: default; padding: 10px 6px;
}
.nv-podbor__more-stack {
    position: relative; width: 40px; height: 34px; margin: 0 auto 8px;
}
.nv-podbor__more-stack i {
    position: absolute; left: 0; right: 0; height: 9px; border-radius: 3px;
    background: #ded7f5; display: block;
}
.nv-podbor__more-stack i:nth-child(1) { top: 0;  transform: scale(.82); background: #eae5fb; }
.nv-podbor__more-stack i:nth-child(2) { top: 12px; transform: scale(.91); background: #ded7f5; }
.nv-podbor__more-stack i:nth-child(3) { top: 24px; background: #c9bcf0; }
.nv-podbor__more-num { font: 700 18px/1 Geologica, sans-serif; color: #6c2bd9; }
.nv-podbor__more-txt { margin: 4px 0 0; font: 400 12px/1.3 Mulish, sans-serif; color: #6b6b80; }

/* обещание под кнопкой */
.nv-quiz__promise {
    display: flex; gap: 8px; align-items: flex-start;
    margin: 10px 0 0; font: 400 13px/1.45 Mulish, sans-serif; color: #4a4a5c;
}
.nv-quiz__promise svg { flex: 0 0 auto; margin-top: 1px; }
.nv-quiz__legal { color: #8a8a9e; }

/* счётчик подходящих по ходу вопросов */
.nv-quiz__live {
    display: inline-flex; align-items: center; gap: 7px;
    margin: 0 0 14px; padding: 5px 11px; border-radius: 999px;
    background: #f4f1fe; color: #4b2ba8;
    font: 500 13px/1 Mulish, sans-serif;
}
.nv-quiz__live b { font: 700 13px/1 Mulish, sans-serif; }
.nv-quiz__live[hidden] { display: none; }   /* класс с display перебивает [hidden] — гасим явно */
.nv-quiz__live--pulse { animation: nvLive .45s ease; }
@keyframes nvLive { 0% { transform: scale(1); } 40% { transform: scale(1.06); } 100% { transform: scale(1); } }

@media (max-width: 700px) {
    .nv-quiz .nv-podbor { grid-template-columns: 1fr 1fr; }
    .nv-podbor__more { grid-column: 1 / -1; flex-direction: row; gap: 12px; padding: 12px; }
    .nv-podbor__more-stack { margin: 0; }
    .nv-podbor__more-txt { margin: 0; text-align: left; }
    .nv-quiz__found-num { font-size: 26px; }
    .nv-quiz__found-txt { font-size: 15px; }
}

/* нечётная последняя кнопка на телефоне не висит половинкой — занимает строку целиком */
@media (max-width: 700px) {
    .nv-quiz__opts[data-cols="3"] .nv-quiz__opt:nth-child(3):last-child { grid-column: 1 / -1; }
}

/* видимая ошибка вместо молчащей кнопки */
.nv-quiz__err {
    margin: 8px 0 0; color: #d92b4b;
    font: 400 13px/1.4 Mulish, sans-serif;
}
.nv-quiz__field--phone input[aria-invalid="true"] { border-color: #d92b4b; }

/* ---------- страница подборки /podbor/ ---------- */
.nv-pod { padding: 36px 0 64px; }
.nv-pod__kicker {
    display: inline-block; margin: 0 0 10px; padding: 5px 11px; border-radius: 999px;
    background: #f4f1fe; color: #4b2ba8; font: 600 13px/1 Mulish, sans-serif;
}
.nv-pod__h1 { margin: 0 0 8px; }
.nv-pod__lead { margin: 0 0 6px; font: 500 17px/1.4 Mulish, sans-serif; color: #1b1b28; }
.nv-pod__note { margin: 0 0 26px; font: 400 14px/1.5 Mulish, sans-serif; color: #6b6b80; max-width: 620px; }

.nv-pod__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.nv-pod__card {
    display: flex; flex-direction: column; overflow: hidden;
    border: 1px solid #ece9f6; border-radius: 16px; background: #fff;
    text-decoration: none; color: inherit; transition: box-shadow .18s ease, transform .18s ease;
}
.nv-pod__card:hover { box-shadow: 0 10px 30px rgba(76, 43, 168, .12); transform: translateY(-2px); }
.nv-pod__pic { position: relative; display: block; aspect-ratio: 16 / 10; background: #f2f0fa; }
.nv-pod__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nv-pod__price {
    position: absolute; left: 10px; bottom: 10px;
    background: rgba(27, 27, 40, .82); color: #fff; padding: 5px 10px;
    border-radius: 8px; font: 600 14px/1 Mulish, sans-serif;
}
.nv-pod__body { display: block; padding: 14px 16px 18px; }
.nv-pod__name { display: block; margin: 0 0 6px; font: 600 17px/1.25 Geologica, sans-serif; color: #1b1b28; }
.nv-pod__meta { display: block; font: 400 14px/1.45 Mulish, sans-serif; color: #6b6b80; }

.nv-pod__foot { display: flex; gap: 12px; flex-wrap: wrap; margin: 28px 0 0; }
.nv-pod__btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 14px 26px; border: 0; border-radius: 12px; cursor: pointer;
    background: #6c2bd9; color: #fff; text-decoration: none;
    font: 600 16px/1 Mulish, sans-serif;
}
.nv-pod__btn--ghost { background: #f4f1fe; color: #4b2ba8; }

@media (max-width: 1000px) { .nv-pod__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px)  {
    /* один столбец растягивал страницу на 13 000 px — держим два */
    .nv-pod__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .nv-pod__name { font-size: 15px; }
    .nv-pod__meta { font-size: 13px; }
    .nv-pod__price { font-size: 13px; padding: 4px 8px; }
    .nv-pod__body { padding: 10px 12px 14px; }
    .nv-pod__foot .nv-pod__btn { flex: 1 1 100%; }
}
@media print {
    header, footer, .nv-pod__foot, .cookie { display: none !important; }
    .nv-pod__card { break-inside: avoid; }
    .nv-pod__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}