/* Подбор партнёрок: панель фильтра, лендинги /podbor, FAQ, SEO-блок. */

/* ---------- панель фильтра ---------- */
/* z-index обязателен: backdrop-filter создаёт stacking context, а карточки .page-header
   позиционированы с z-index:1 — без этого раскрытый список уезжает под первую карточку.
   40 < .xhero(100) и .sticky-menuv(110), поэтому шапка остаётся сверху. */
.hc-filter{position:relative;z-index:40;margin:18px 0 30px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:18px 20px;backdrop-filter:blur(4px)}
.hc-ftitle{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#9aa0ad;margin:0 0 14px}
.hc-ftitle .material-symbols-rounded{font-size:18px;color:#f4978e}
.hc-frow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end}
.hc-fcell{display:flex;flex-direction:column;gap:6px;min-width:0}
.hc-flabel{font-size:12px;color:#9aa0ad;letter-spacing:.03em}

/* выпадающий список на <details> */
.hc-dd{position:relative}
.hc-dd-trigger{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.28);color:#e7eaf0;font-size:14px;line-height:1.3;transition:border-color .15s}
.hc-dd-trigger::-webkit-details-marker{display:none}
.hc-dd-trigger::marker{content:''}
.hc-dd-trigger:hover{border-color:rgba(255,255,255,.30)}
.hc-dd-trigger:focus-visible{outline:none;border-color:#f4978e}
.hc-dd[open] .hc-dd-trigger{border-color:#f4978e}
.hc-dd-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9aa0ad}
.hc-dd-value.is-set{color:#e7eaf0;font-weight:600}
.hc-dd-caret{font-size:18px;color:#9aa0ad;flex-shrink:0;transition:transform .15s}
.hc-dd[open] .hc-dd-caret{transform:rotate(180deg)}
/* Список шире своей ячейки (названия длинные), но не шире экрана; у крайнего правого
   столбца выравниваем по правому краю, иначе он вылезает за панель. */
.hc-dd-list{position:absolute;z-index:60;top:calc(100% + 6px);left:0;width:max-content;min-width:100%;max-width:min(340px,86vw);max-height:320px;overflow-y:auto;padding:6px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:#232028;box-shadow:0 18px 44px rgba(0,0,0,.55)}
.hc-fcell:last-of-type .hc-dd-list{left:auto;right:0}
.hc-dd-opt{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;color:#d6dae1;font-size:14px;text-decoration:none;white-space:nowrap}
a.hc-dd-opt:hover{background:rgba(255,255,255,.07);color:#fff;text-decoration:none}
.hc-dd-opt.is-sel{background:rgba(244,151,142,.15);color:#fff;font-weight:600}
.hc-dd-opt.is-off{opacity:.4;cursor:default}
.hc-dd-name{flex:1;overflow:hidden;text-overflow:ellipsis}
.hc-tot{font-style:normal;font-size:12px;color:#8a919e}          /* всего в каталоге */
.hc-match{font-style:normal;font-size:12px;color:#f4978e;font-weight:600}  /* совпадает сейчас */
.hc-factions{display:flex;gap:10px;align-items:center}
.hc-fbtn{display:inline-flex;align-items:center;gap:7px;padding:11px 22px;border-radius:10px;border:0;background:#f4978e;color:#1b1f26;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;text-decoration:none;transition:filter .15s}
.hc-fbtn:hover{filter:brightness(1.08);text-decoration:none}
.hc-fbtn .material-symbols-rounded{font-size:18px}
.hc-fbtn-sec{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#d6dae1;font-weight:600}
.hc-fbtn-sec:hover{filter:none;border-color:rgba(255,255,255,.34);background:rgba(255,255,255,.11)}
.hc-fbtn-ico{padding:11px 13px}
.hc-fbtn-ico .material-symbols-rounded{font-size:19px}
.hc-fcount{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin-top:14px;font-size:13px;color:#9aa0ad}
.hc-fcount b{color:#e7eaf0}
.hc-fnum{white-space:nowrap}

/* пузыри выбранных фильтров */
.hc-chips{display:flex;flex-wrap:wrap;gap:8px}
.hc-chip{display:inline-flex;align-items:center;gap:2px;padding:4px 4px 4px 11px;border-radius:999px;background:rgba(244,151,142,.13);border:1px solid rgba(244,151,142,.28);color:#f7c5bf;font-size:12.5px;font-weight:600;white-space:nowrap}
.hc-chip-x{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;border-radius:50%;color:#f4978e;text-decoration:none;transition:background .15s,color .15s}
.hc-chip-x:hover{background:rgba(244,151,142,.3);color:#fff;text-decoration:none}
.hc-chip-x:focus-visible{outline:2px solid #f4978e;outline-offset:1px}
.hc-chip-x .material-symbols-rounded{font-size:14px}

/* плавная подмена контента */
#hc-main{transition:opacity .18s}
#hc-main.hc-loading{opacity:.45;pointer-events:none}

/* ---------- SEO-блок под списком ---------- */
.landing-seo{max-width:860px;margin:34px auto 0;padding:20px 24px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;color:#aab0bc;font-size:14px;line-height:1.65}
.landing-seo p{margin:0 0 10px}
.landing-seo p:last-child{margin:0}

/* ---------- FAQ ---------- */
.faq-block{max-width:860px;margin:34px auto 10px}
.faq-block h2{font-size:22px;color:#e7eaf0;margin:0 0 16px;text-align:center}
.faq-item{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:16px 20px;margin-bottom:10px}
.faq-q{margin:0 0 6px;font-size:15px;font-weight:600;color:#e7eaf0}
.faq-a{color:#aab0bc;font-size:14px;line-height:1.6}

@media(max-width:1100px){.hc-frow{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.hc-frow{grid-template-columns:1fr}.hc-factions{justify-content:stretch}.hc-fbtn{flex:1;justify-content:center}}