/* =============================================================
   Атмосфера — страница /podbor/ (расширенная подборка ИИ)
   Использует переменные и базовые компоненты style.css сайта.
   ============================================================= */

.pb-body{background:var(--ink);color:var(--text);min-height:100vh;display:flex;flex-direction:column}

/* ---- шапка ---- */
.pb-header{position:sticky;top:0;z-index:40;background:rgba(17,20,19,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-2)}
.pb-header__inner{max-width:1280px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.pb-logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
.pb-logo__mark{display:inline-flex}
.pb-logo__mark img{width:40px;height:auto;display:block}
.pb-logo__text{display:flex;flex-direction:column;line-height:1.1}
.pb-logo__text b{color:var(--gold);font-weight:800;font-size:19px;letter-spacing:2.6px}
.pb-logo__text i{font-style:normal;color:var(--muted-2);font-size:10.5px;font-weight:600;letter-spacing:1.6px;margin-top:3px}
.pb-home{white-space:nowrap}

/* ---- заголовок ---- */
.pb-main{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:34px 24px 20px}
.pb-head{margin-bottom:22px}
.pb-title{color:var(--white);font-size:clamp(24px,3.4vw,34px);line-height:1.15;margin:0 0 8px}
.pb-sub{color:var(--muted);margin:0;font-size:15px}

/* ---- прогресс ---- */
.pb-progress{margin:8px 0 26px}
.fnd-progress{background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:20px 22px}
.pb-progress .fnd-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:16px 0 0;padding:0;list-style:none}
.pb-progress .fnd-steps li{font-size:12.5px;color:var(--muted-2);display:flex;gap:7px;align-items:center}
.pb-progress .fnd-steps li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:0 0 auto}
.pb-progress .fnd-steps li.is-active{color:var(--gold)}
.pb-progress .fnd-steps li.is-active::before{background:var(--gold);box-shadow:0 0 0 3px rgba(244,200,75,.22)}
.pb-progress .fnd-steps li.is-done{color:var(--muted)}
.pb-progress .fnd-steps li.is-done::before{background:var(--teal)}

/* ---- ошибка ---- */
.pb-error{background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:26px;text-align:center}
.pb-error p{color:var(--white);font-size:16px;margin:0 0 18px}
.pb-error__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---- капча-гейт прямо на странице ---- */
.pb-gate{display:flex;flex-direction:column;gap:10px;width:100%;max-width:340px;margin:0 auto}
.pb-gate__q{color:var(--white);font-size:15px;margin:0}
.pb-gate input{background:var(--ink);border:1px solid var(--line-2);border-radius:var(--r-md);color:var(--white);padding:12px 14px;font-size:15px;text-align:center}
.pb-gate input:focus{outline:none;border-color:var(--gold-deep)}

/* ---- результаты ---- */
.pb-results{margin-top:4px}
.pb-notes{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.pb-notes:empty{display:none}
.fnd-note-warn{background:rgba(231,125,103,.12);border:1px solid rgba(231,125,103,.35);color:#ffd9ce;border-radius:var(--r-md);padding:10px 14px;font-size:13.5px;margin:0}

.pb-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:26px 0 10px}
.pb-note{text-align:center;color:var(--muted-2);font-size:13px;margin:6px 0 0}

/* карточки товаров — переиспользуем fnd-grid/fnd-card из style.css модалки,
   на этой странице они всегда видимы (вне модалки) */
.pb-results .fnd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.pb-results .fnd-card{position:relative;display:flex;flex-direction:column;background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-lg);overflow:hidden;transition:transform .18s,box-shadow .18s}
.pb-results .fnd-card:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(0,0,0,.35)}
.pb-results .fnd-card__img{position:relative;aspect-ratio:1;background:#fff;display:flex;align-items:center;justify-content:center;cursor:zoom-in}
.pb-results .fnd-card__img img{max-width:100%;max-height:100%;object-fit:contain;padding:10px}
.pb-results .fnd-card__match{position:absolute;top:10px;left:10px;background:var(--gold-grad);color:#2b2410;font-weight:800;font-size:12.5px;border-radius:999px;padding:4px 10px;box-shadow:0 6px 18px rgba(244,200,75,.35)}
.pb-results .fnd-card__noimg{color:#b9b2a6;font-size:13px}
.pb-results .fnd-card__body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:10px;flex:1}
.pb-results .fnd-card__name{color:var(--white);font-size:14.5px;font-weight:700;line-height:1.35;margin:0}
.pb-results .fnd-card__actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pb-results .pcard__btn{background:transparent;border:1px solid var(--line-2);color:var(--muted);border-radius:999px;padding:7px 14px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.15s}
.pb-results .pcard__btn:hover{color:var(--gold);border-color:var(--gold-deep)}
.pb-results .fnd-card__more{border-top:1px dashed var(--line-2);padding-top:10px}
.pb-results .fnd-card__brief{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 8px}
.pb-results .fnd-card__brief--empty{opacity:.65}
.pb-results .fnd-card__chars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.pb-results .fnd-card__chars li{display:flex;justify-content:space-between;gap:12px;font-size:12.5px;border-bottom:1px solid rgba(255,255,255,.05);padding-bottom:4px}
.pb-results .fnd-card__chars li span{color:var(--muted-2)}
.pb-results .fnd-card__chars li b{color:var(--white);font-weight:600;text-align:right}

/* избранное — как на главной */
.pb-results .fav-btn{position:absolute;top:8px;right:8px;width:36px;height:36px;border-radius:50%;border:none;background:rgba(17,20,19,.55);backdrop-filter:blur(4px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;z-index:2}
.pb-results .fav-btn svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:1.8}
.pb-results .fav-btn:hover{background:rgba(244,200,75,.9)}
.pb-results .fav-btn:hover svg{stroke:#2b2410}
.pb-results .fav-btn.is-active{background:var(--gold-grad)}
.pb-results .fav-btn.is-active svg{fill:#a8621b;stroke:#a8621b}

/* ---- футер ---- */
.pb-footer{border-top:1px solid var(--line-2);background:var(--ink-2);padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;max-width:1280px;margin:0 auto;width:100%}
.pb-footer__phone{color:var(--muted);font-size:14px}
.pb-footer__phone a{color:var(--gold);font-weight:700;text-decoration:none}

/* ---- модалка ---- */
.pb-modal{position:fixed;inset:0;z-index:80;background:rgba(10,12,11,.72);display:none;align-items:center;justify-content:center;padding:20px}
.pb-modal.is-open{display:flex}
.pb-modal .modal__box{background:var(--paper);color:var(--text);border-radius:var(--r-lg);max-width:520px;width:100%;max-height:90vh;overflow:auto;padding:26px;position:relative}

/* ---- лайтбокс ---- */
.fnd-lightbox{position:fixed;inset:0;z-index:90;background:rgba(8,10,9,.86);display:none;align-items:center;justify-content:center;padding:24px}
.fnd-lightbox.is-open{display:flex}
.fnd-lightbox img{max-width:min(920px,94vw);max-height:88vh;object-fit:contain;background:#fff;border-radius:var(--r-md);padding:14px}
.fnd-lightbox__close{position:absolute;top:16px;right:20px;background:none;border:none;color:#fff;font-size:40px;line-height:1;cursor:pointer}

/* ---- адаптив ---- */
@media (max-width:760px){
  .pb-header__inner{padding:12px 16px}
  .pb-home{display:none}
  .pb-main{padding:22px 16px 16px}
  .pb-progress .fnd-steps{grid-template-columns:1fr 1fr}
  .pb-results .fnd-grid{grid-template-columns:1fr 1fr;gap:10px}
  .pb-footer{justify-content:center;text-align:center}
}
@media (max-width:520px){
  .pb-results .fnd-grid{grid-template-columns:1fr}
}
