/* Главная страница — редизайн 29.09.2026.
   Подключается только в views/site/index.php, всё под .pb-home, чтобы не
   задевать Bootstrap 3 и site.css. Классы с префиксом hp- нарочно не совпадают
   с bootstrap-овскими (panel, form, tabs, row, wrap).
   Макет: design/home-20260929/index.html в рабочей папке проекта. */

@font-face { font-family: "PBSans"; src: url("/fonts/SFUIDisplay-Light.otf"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "PBSans"; src: url("/fonts/SFUIDisplay-Regular.otf"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "PBSans"; src: url("/fonts/SFUIDisplay-Medium.otf"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "PBSans"; src: url("/fonts/SFUIDisplay-Semibold.otf"); font-weight: 600; font-style: normal; font-display: swap; }

.pb-home {
    --pb-brand: #0077ff; --pb-brand-tint: #e8f2ff;
    --pb-accent: #ffa300; --pb-accent-dark: #e89400;
    --pb-ink: #1f2530; --pb-muted: #6b7280; --pb-line: #e3e6eb; --pb-soft: #f5f7fa;
    --pb-pos: #3aa655; --pb-neu: #9aa1ab; --pb-neg: #e04848;
    --pb-fraud: #b42318; --pb-fraud-bg: #fff1ef;
    font-family: "PBSans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-weight: 400;
    font-synthesis: none;
    font-size: 16px;
    line-height: 1.55;
    color: var(--pb-ink);
    background: #fff;
    -webkit-font-smoothing: antialiased;
}
.pb-home *, .pb-home *::before, .pb-home *::after { box-sizing: border-box; }
.pb-home section { padding-top: 0; padding-bottom: 0; }
.pb-home a { color: var(--pb-brand); text-decoration: none; }
.pb-home a:hover, .pb-home a:focus { text-decoration: underline; }
.pb-home h1, .pb-home h2, .pb-home h3 {
    margin: 0; line-height: 1.2; font-family: inherit; letter-spacing: normal; text-transform: none; color: inherit;
}
.pb-home p { margin: 0; }
.pb-home ul { margin: 0; padding: 0; list-style: none; }
.pb-home .hp-in { max-width: 1140px; margin: 0 auto; padding: 0 16px; }

/* строка-заголовок */
.pb-home .hp-title { padding: 18px 0; }
.pb-home .hp-title h1 { font-size: 22px; font-weight: 500; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.pb-home .hp-brand { font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.pb-home .hp-badge { background: var(--pb-brand); color: #fff; font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; padding: 3px 10px; border-radius: 6px; }
.pb-home .hp-rest { color: var(--pb-muted); font-weight: 400; }

/* первый экран */
.pb-home .hp-hero { position: relative; background: url("/images/teaser.png") center / cover no-repeat, #6a7f99; }
.pb-home .hp-hero::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, rgba(14,27,51,.35), rgba(14,27,51,.05)); }
.pb-home .hp-hero .hp-in { position: relative; padding-top: 56px; padding-bottom: 56px; }
.pb-home .hp-panel { max-width: 760px; background: rgba(0,119,255,.86); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; border-radius: 16px; padding: 30px 32px 28px; box-shadow: 0 20px 50px rgba(0,40,100,.28); }
.pb-home .hp-panel h2 { font-size: 30px; font-weight: 500; text-transform: uppercase; letter-spacing: .01em; }
.pb-home .hp-panel-lead { margin: 6px 0 20px; color: rgba(255,255,255,.85); font-size: 17px; }

/* .row нужен company-search.js (closest('.row')), поэтому сбрасываем его сетку */
.pb-home .hp-search.row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.pb-home .hp-search.row::before, .pb-home .hp-search.row::after { content: none; display: none; }
.pb-home .hp-search input.company-search {
    flex: 1 1 auto; min-width: 0; width: auto; height: auto; border: 0; border-radius: 10px; box-shadow: none;
    font: inherit; font-size: 17px; padding: 15px 18px; color: var(--pb-ink); background: #fff; outline: 0;
}
.pb-home .hp-search input.company-search:focus { box-shadow: 0 0 0 3px rgba(255,163,0,.6); }
.pb-home .hp-search a.company-search-button {
    flex: none; display: block; border: 0; border-radius: 10px; background: var(--pb-accent); color: #1a1400;
    font: inherit; font-size: 17px; font-weight: 600; padding: 15px 30px; line-height: 1.3; cursor: pointer; text-align: center;
}
.pb-home .hp-search a.company-search-button:hover { background: var(--pb-accent-dark); text-decoration: none; color: #1a1400; }
.pb-home .hp-search .company-search-not-found { flex: 0 0 100%; margin: 4px 0 0; padding: 0; border: 0; background: none; color: #fff; }
.pb-home .hp-search .company-search-not-found p { font-size: 14px; }
.pb-home .hp-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 18px; font-size: 15px; }
.pb-home .hp-links a { color: #fff; border-bottom: 1px solid rgba(255,255,255,.45); }
.pb-home .hp-links a:hover { text-decoration: none; border-bottom-color: #fff; }

/* секции */
.pb-home .hp-block { padding: 48px 0; }
.pb-home .hp-soft { background: var(--pb-soft); }
.pb-home .hp-add-sec { padding-top: 32px; }
.pb-home .hp-sec-title { font-size: 24px; font-weight: 500; text-transform: uppercase; letter-spacing: .01em; }
.pb-home .hp-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.pb-home .hp-sec-head p { margin: 4px 0 0; color: var(--pb-muted); }
.pb-home .hp-sec-head > a { white-space: nowrap; font-weight: 500; }

/* разоблачения */
.pb-home .hp-cases { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pb-home .case { position: relative; background: #fff; border: 1px solid var(--pb-line); border-top: 4px solid var(--pb-fraud); border-radius: 12px; padding: 22px 24px; transition: box-shadow .15s; }
.pb-home .case--self { border-top-color: var(--pb-accent); }
.pb-home .case:hover { box-shadow: 0 10px 28px rgba(20,30,50,.08); }
.pb-home .tag { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 4px 9px; border-radius: 6px; background: var(--pb-fraud-bg); color: var(--pb-fraud); }
.pb-home .case--self .tag { background: #fff4de; color: #9a5b00; }
.pb-home .case h3 { font-size: 21px; font-weight: 600; margin: 12px 0 8px; }
.pb-home .case h3 a { color: var(--pb-ink); }
.pb-home .case h3 a::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.pb-home .case p { margin: 0 0 14px; color: #4b5363; font-size: 15px; }
.pb-home .case .go { font-weight: 500; color: var(--pb-brand); }

/* вкладки: механика Bootstrap pills */
.pb-home .hp-tabs.nav { display: flex; background: #fff; border: 1px solid var(--pb-line); border-radius: 12px; padding: 5px; gap: 5px; margin: 0 0 22px; }
.pb-home .hp-tabs.nav::before, .pb-home .hp-tabs.nav::after { content: none; display: none; }
.pb-home .hp-tabs.nav > li { flex: 1; float: none; margin: 0; display: block; }
.pb-home .hp-tabs.nav > li > a {
    display: block; height: 100%; text-align: center; background: none; border: 0; border-radius: 8px; margin: 0;
    padding: 12px 10px; color: var(--pb-muted); cursor: pointer;
}
.pb-home .hp-tabs.nav > li > a h2 { font-size: 16px; font-weight: 500; text-transform: uppercase; letter-spacing: .02em; color: inherit; margin: 0; }
.pb-home .hp-tabs.nav > li > a:hover, .pb-home .hp-tabs.nav > li > a:focus { color: var(--pb-ink); background: var(--pb-soft); text-decoration: none; }
.pb-home .hp-tabs.nav > li.active > a, .pb-home .hp-tabs.nav > li.active > a:hover, .pb-home .hp-tabs.nav > li.active > a:focus { background: var(--pb-accent); color: #fff; }

/* карточки отзывов */
.pb-home .hp-reviews { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pb-home .rv { background: #fff; border: 1px solid var(--pb-line); border-left: 4px solid var(--c); border-radius: 12px; padding: 18px 20px; display: flex; flex-direction: column; min-width: 0; }
.pb-home .rv.pos { --c: var(--pb-pos); }
.pb-home .rv.neg { --c: var(--pb-neg); }
.pb-home .rv.neu { --c: var(--pb-neu); }
.pb-home .rv-head { display: flex; gap: 14px; align-items: center; }
.pb-home .rv-head > div:last-child { min-width: 0; }
.pb-home .logo-box { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 10px; border: 1px solid var(--pb-line); background: #fff center / contain no-repeat; font-size: 20px; font-weight: 600; color: var(--pb-brand); }
.pb-home .logo-box.letter { background: var(--pb-brand-tint); border-color: transparent; }
.pb-home a.logo-box:hover { text-decoration: none; }
.pb-home .rv-name { color: var(--pb-ink); font-weight: 600; font-size: 17px; line-height: 1.3; overflow-wrap: anywhere; }
.pb-home .rv-name:hover { color: var(--pb-brand); text-decoration: none; }
.pb-home .rv-head small { display: block; color: var(--pb-muted); font-size: 13px; margin-top: 2px; }
.pb-home .rv-head small b { font-weight: 600; color: var(--c); text-transform: uppercase; font-size: 11px; letter-spacing: .06em; }
.pb-home .rv-text { margin: 12px 0 14px; font-size: 15px; color: #353c49; overflow-wrap: anywhere; word-break: break-word; }
.pb-home .rv-foot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14px; }
.pb-home .rv-foot > a:first-child { font-weight: 500; }
/* существующая кнопка жалобы (виджет ReviewComplain) — как тихая ссылка */
.pb-home .rv-foot .complain-button {
    background: none; border: 0; box-shadow: none; padding: 0; color: var(--pb-muted); font-size: 13px; font-weight: 400; text-transform: none; white-space: nowrap;
}
.pb-home .rv-foot .complain-button:hover, .pb-home .rv-foot .complain-button:focus { color: var(--pb-neg); text-decoration: underline; background: none; }

/* компании */
.pb-home .hp-companies { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pb-home .co { display: flex; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--pb-line); border-radius: 12px; padding: 12px 14px; color: var(--pb-ink); min-width: 0; }
.pb-home .co:hover { text-decoration: none; border-color: #bcd6f7; }
.pb-home .co .logo-box { width: 44px; height: 44px; font-size: 17px; }
.pb-home .co-body { min-width: 0; }
.pb-home .co b { display: block; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pb-home .co small { display: block; color: var(--pb-muted); font-size: 13px; }
.pb-home .co-desc {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
    margin-top: 2px; color: #4b5363; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere;
}
/* стрелки и «назад/вперёд» из tabs-pagination.php оставлены как есть */
.pb-home .summary-cards-pagination { text-align: center; margin-top: 22px; }

/* добавить отзыв */
.pb-home .hp-add { background: var(--pb-brand); color: #fff; border-radius: 18px; padding: 36px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px 40px; align-items: start; grid-template-areas: 'intro form' 'why form'; }
.pb-home .hp-intro { grid-area: intro; }
.pb-home .hp-why { grid-area: why; display: grid; gap: 16px; }
.pb-home .hp-form { grid-area: form; }
.pb-home .hp-intro h2 { font-size: 28px; font-weight: 500; text-transform: uppercase; }
.pb-home .hp-eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: .08em; opacity: .8; margin-bottom: 8px; }
.pb-home .hp-lead { margin: 10px 0 0; font-size: 17px; color: rgba(255,255,255,.9); }
.pb-home .hp-why li { display: flex; gap: 14px; }
.pb-home .hp-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; background: rgba(255,255,255,.16); display: grid; place-items: center; }
.pb-home .hp-why b { display: block; font-weight: 600; font-size: 16px; }
.pb-home .hp-why li span:not(.hp-ic) { color: rgba(255,255,255,.82); font-size: 15px; }

.pb-home .hp-form { background: #fff; color: var(--pb-ink); border-radius: 14px; padding: 24px; box-shadow: 0 16px 40px rgba(0,40,100,.25); position: relative; margin: 0; }
.pb-home .hp-form h3 { font-size: 18px; font-weight: 600; }
.pb-home .hp-form .form-group, .pb-home .hp-form .panel-row-wrapper { margin: 0; padding: 0; }
.pb-home .hp-form .form-group + label { margin-top: 14px; }
.pb-home .hp-tones { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 14px 0 16px; }
.pb-home .hp-tones .review-type-changer {
    display: flex; flex-direction: column; align-items: center; gap: 4px; border: 1.5px solid var(--pb-line); background: #fff;
    border-radius: 10px; padding: 12px 6px; font-size: 15px; font-weight: 500; color: var(--pb-ink); cursor: pointer; text-decoration: none;
}
.pb-home .hp-tones .review-type-changer i { width: 12px; height: 12px; border-radius: 50%; background: var(--t); }
.pb-home .hp-tones .review-type-changer:hover { border-color: var(--t); text-decoration: none; }
.pb-home .hp-tones .review-type-changer.active { border-color: var(--t); background: #f7fbf8; background: color-mix(in srgb, var(--t) 10%, #fff); }
.pb-home .hp-tones .green { --t: var(--pb-pos); }
.pb-home .hp-tones .grey { --t: var(--pb-neu); }
.pb-home .hp-tones .pink { --t: var(--pb-neg); }
.pb-home .hp-form label { display: block; font-size: 14px; font-weight: 500; margin: 0 0 6px; color: var(--pb-ink); text-transform: none; }
.pb-home .hp-form label small { color: var(--pb-muted); font-weight: 400; }
.pb-home .hp-form input.form-control, .pb-home .hp-form textarea.form-control {
    display: block; width: 100%; height: auto; border: 1.5px solid var(--pb-line); border-radius: 10px; box-shadow: none;
    font: inherit; font-size: 16px; padding: 12px 14px; color: var(--pb-ink); background: #fff; outline: 0;
}
.pb-home .hp-form input.form-control:focus, .pb-home .hp-form textarea.form-control:focus { border-color: var(--pb-brand); }
.pb-home .hp-form textarea.form-control { min-height: 120px; resize: vertical; }
.pb-home .hp-form .has-feedback { position: relative; }
.pb-home .hp-form .error-icon { top: 0; right: 4px; }
.pb-home .hp-form .alert-info-text { margin: 6px 0 0; padding: 0; border: 0; background: none; color: var(--pb-neg); font-size: 13px; }
.pb-home .hp-form .alert-info-text p { margin: 0; }
.pb-home .hp-hint { font-size: 13px; color: var(--pb-muted); margin: 6px 0 14px; }
.pb-home .hp-hint b { color: var(--pb-ink); font-weight: 500; }
.pb-home .hp-form .hp-send {
    display: block; width: 100%; border: 0; border-radius: 10px; background: var(--pb-accent); color: #1a1400;
    font: inherit; font-size: 17px; font-weight: 600; padding: 14px; cursor: pointer; margin-top: 8px; white-space: normal;
}
.pb-home .hp-form .hp-send:hover { background: var(--pb-accent-dark); }
.pb-home .hp-fine { font-size: 12px; color: var(--pb-muted); margin: 10px 0 0; text-align: center; }
.pb-home .hp-fine a { color: var(--pb-muted); text-decoration: underline; }
.pb-home .review-privacy-note { color: var(--pb-muted); margin: 8px 0 0; font-size: 12px; line-height: 1.4; text-align: center; }
.pb-home .review-privacy-note a { color: var(--pb-muted); text-decoration: underline; }

.pb-home .hp-bottom-text { overflow-wrap: anywhere; }

@media (max-width: 860px) {
    .pb-home .hp-title { padding: 14px 0; }
    .pb-home .hp-title h1 { font-size: 17px; }
    .pb-home .hp-badge { font-size: 13px; }
    .pb-home .hp-hero .hp-in { padding-top: 20px; padding-bottom: 20px; }
    .pb-home .hp-panel { padding: 22px 18px; border-radius: 14px; }
    .pb-home .hp-panel h2 { font-size: 22px; }
    .pb-home .hp-panel-lead { font-size: 15px; margin-bottom: 16px; }
    .pb-home .hp-search.row { flex-direction: column; }
    .pb-home .hp-search input.company-search { font-size: 16px; padding: 13px 14px; }
    .pb-home .hp-search a.company-search-button { padding: 13px; }
    .pb-home .hp-cases, .pb-home .hp-reviews, .pb-home .hp-companies { grid-template-columns: 1fr; }
    .pb-home .hp-block { padding: 32px 0; }
    .pb-home .hp-sec-title { font-size: 20px; }
    .pb-home .hp-sec-head { flex-direction: column; gap: 4px; }
    .pb-home .hp-tabs.nav > li > a { padding: 10px 6px; }
    .pb-home .hp-tabs.nav > li > a h2 { font-size: 13px; }
    .pb-home .hp-add { grid-template-columns: 1fr; padding: 24px 16px; gap: 24px; border-radius: 0; margin: 0 -16px; grid-template-areas: 'intro' 'form' 'why'; }
    .pb-home .hp-intro h2 { font-size: 22px; }
    .pb-home .hp-form { padding: 18px; }
}

/* Тон не выбран: подсказка вместо молчаливого «отрицательного» по умолчанию */
.pb-home .hp-tone-error { margin: -6px 0 12px; color: var(--pb-neg, #e04848); font-size: 14px; font-weight: 500; }
.pb-home .hp-tone-error:empty { display: none; }
.pb-home .hp-tones--need .review-type-changer { border-color: var(--pb-neg, #e04848); }
