/* =========================================================================
   v2-rollout.css — единый override для всех страниц Отзыва.РФ (Phase 2)
   Подключается через <link> ПОСЛЕ inline <style> в каждой странице.
   !important на ключевых правилах перебивает inline-стили.
   Палитра: off-white #FAFAF9 + indigo #127C71 + чёрный #18181B + серая шкала.
   Шрифт: Geist + JetBrains Mono для чисел.
   Углы 4-6px, без gradient'ов и glassmorphism.
   ========================================================================= */

/* === Глобальная база === */
html, body {
  background: #FAFAF9 !important;
  color: #18181B !important;
}
body {
  font-family: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

/* === Уничтожаем все 135deg / 180deg gradients и glassmorphism === */
body [style*="linear-gradient(135"],
body [style*="linear-gradient(180"],
body [style*="linear-gradient(90"] {
  background-image: none !important;
}
body *, body *::before, body *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* === HEADER === */
.header, header.header {
  background: #FAFAF9 !important;
  border-bottom: 1px solid #E0DDD7 !important;
  box-shadow: none !important;
}
.logo-mark { display: none !important; }
.logo { font-weight: 700 !important; letter-spacing: -0.025em !important; }
.logo-text { text-transform: lowercase !important; }
.logo-text b { font-weight: 700 !important; }
.nav a { color: #57534E !important; font-weight: 500 !important; }
.nav a:hover { color: #18181B !important; }
.header-search {
  background: #F4F3F0 !important;
  border: 1px solid #E0DDD7 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

/* === BUTTONS === */
.btn { border-radius: 4px !important; font-weight: 500 !important; }
.btn-primary {
  background: #18181B !important;
  background-image: none !important;
  color: #FAFAF9 !important;
  border: 0 !important;
  box-shadow: none !important;
}
.btn-primary:hover { background: #333 !important; }
.btn-secondary, .btn-ghost {
  background: #FFFFFF !important;
  color: #18181B !important;
  border: 1px solid #E0DDD7 !important;
  box-shadow: none !important;
}
.btn-secondary:hover, .btn-ghost:hover {
  background: #F4F3F0 !important;
  border-color: #CDC9C1 !important;
}
.btn-danger { background: #B43F3F !important; color: #FAFAF9 !important; }
.btn-success { background: #527A4F !important; color: #FAFAF9 !important; }

/* «Спросить ИИ» (btn-mb-ai, btn-ai-desktop) — белая с indigo пульсацией */
.btn-ai-desktop,
.btn-mb-ai,
#btn-ask-ai {
  background: #FFFFFF !important;
  background-image: none !important;
  color: #127C71 !important;
  border: 1px solid #127C71 !important;
  border-radius: 4px !important;
  font-weight: 500 !important;
  animation: v2-ai-pulse 2.6s ease-in-out infinite !important;
}
.btn-ai-desktop:hover, .btn-mb-ai:hover {
  background: #E2F1EE !important; color: #0E655C !important; border-color: #0E655C !important;
}
.btn-ai-desktop svg, .btn-mb-ai svg { stroke: #127C71 !important; }
@keyframes v2-ai-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(91, 111, 232, 0); }
  50%      { box-shadow: 0 0 0 5px rgba(91, 111, 232, 0.18); }
}

/* === CARDS — все типы === */
.card, .rev-card, .top-card, .author-card, .cat, .reason, .review-card,
.biz-rev-card, .hstat-card, .expandable-card, .ai-summary, .ai-summary-card,
.summary-stub, .hash-notice, .side-card,
aside .card, aside > div,
[class*="-card"]:not(.btn) {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #E0DDD7 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  transition: border-color .12s !important;
}
.card:hover, .rev-card:hover, .top-card:hover, .author-card:hover,
.cat:hover, .review-card:hover {
  box-shadow: none !important;
  transform: none !important;
  border-color: #CDC9C1 !important;
}

/* === BADGES === */
.badge {
  border-radius: 3px !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  padding: 3px 8px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  box-shadow: none !important;
}
.badge.premium, .badge-premium,
.hbadge-premium, .tariff-badge, .premium-badge,
[class*="badge"][class*="premium"],
.co-tariff-premium {
  background: #E2F1EE !important;
  background-image: none !important;
  color: #127C71 !important;
  border: 0 !important;
}
.badge.verified, .badge-verified,
.verified-badge-v2, .hbadge-claimed, .co-tariff-start,
[class*="badge"][class*="verified"],
[class*="badge"][class*="start"] {
  background: #E8EEE5 !important;
  background-image: none !important;
  color: #527A4F !important;
  border: 0 !important;
}
.hbadge {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid #E0DDD7 !important;
  color: #57534E !important;
  border-radius: 3px !important;
  padding: 4px 10px !important;
}
.verified-badge-v2 .vbc-2, .verified-badge-v2 #vb-check-claimed { display: none !important; }

/* === TABS — pill → underline === */
.tabs, .tab-bar, .tab-list, [class*="tab-nav"] {
  border-bottom: 1px solid #E0DDD7 !important;
  background: transparent !important;
  gap: 0 !important;
  box-shadow: none !important;
}
.tabs > a, .tabs > button, .tab, [data-tab] {
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  padding: 12px 16px !important;
  color: #57534E !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.tabs > a.active, .tabs > button.active, .tab.active, [data-tab].active {
  background: transparent !important;
  color: #18181B !important;
  border-bottom-color: #18181B !important;
}

/* === CHIPS / FILTER CHIPS === */
.chip, .filter-chip, .chips .chip, .chip-row .chip,
[class*="chip"]:not([class*="-card"]):not([class*="chips"]) {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #E0DDD7 !important;
  color: #57534E !important;
  border-radius: 4px !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  padding: 4px 12px !important;
  box-shadow: none !important;
}
.chip.active, .chip[aria-pressed="true"], .filter-chip.active {
  background: #18181B !important;
  border-color: #18181B !important;
  color: #FAFAF9 !important;
}

/* === AI SUMMARY === */
.ai-badge {
  background: #18181B !important;
  background-image: none !important;
  color: #FAFAF9 !important;
  border-radius: 3px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 4px 10px !important;
}
.ai-text, #ai-summary-text { display: none !important; }
#ai-summary-tags {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px 32px !important;
  margin-top: 4px !important;
}
.ai-col-label {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 12px !important;
}
.ai-col-pros .ai-col-label { color: #527A4F !important; }
.ai-col-cons .ai-col-label { color: #B43F3F !important; }
.ai-col-tags { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
.ai-col-empty { font-size: 12px !important; color: #A8A29E !important; font-style: italic; }
.pc-tag.pos, .ai-tags .pos {
  background: #FFFFFF !important;
  border: 1px solid #BBD9B5 !important;
  color: #527A4F !important;
  border-radius: 3px !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  padding: 4px 10px !important;
}
.pc-tag.neg, .ai-tags .neg {
  background: #FFFFFF !important;
  border: 1px solid #E4BFBF !important;
  color: #B43F3F !important;
  border-radius: 3px !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  padding: 4px 10px !important;
}

/* === INPUTS === */
input[type="text"], input[type="search"], input[type="email"], input[type="tel"],
input[type="url"], input[type="password"], textarea, select {
  background: #FFFFFF !important;
  border: 1px solid #E0DDD7 !important;
  border-radius: 4px !important;
  color: #18181B !important;
  box-shadow: none !important;
  font-family: inherit !important;
}
input:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: #18181B !important;
}

/* === STARS — старое золото === */
.stars, .rating-stars, [class*="rating-stars"] {
  color: #C9A227 !important;
}

/* === DISTRIBUTION BARS / прогрессы === */
.dist-bar-fill, [id*="-fill"][id*="dist"], [id*="-fill"][id*="sd-"] {
  background: #127C71 !important;
  background-image: none !important;
  border-radius: 2px !important;
}
.dist-bar-bg { background: #F0EFEC !important; border-radius: 2px !important; }

/* === SIDEBAR / CONTACTS === */
.contact-row a, .contact-mega-cell a,
.contact-address-block a, .contact-hours-block a {
  color: #127C71 !important;
}
.side-card h3, aside h3, .card-title {
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #18181B !important;
  font-weight: 600 !important;
}

/* === HASH-CHAIN BANNER === */
.hash-notice {
  background: #F4F3F0 !important;
  border: 1px solid #E0DDD7 !important;
  border-radius: 6px !important;
  color: #57534E !important;
  box-shadow: none !important;
  padding: 12px 16px !important;
}
.hash-notice a, .hash-notice strong { color: #18181B !important; }

/* === MODALS === */
.modal {
  background: #FFFFFF !important;
  border: 1px solid #E0DDD7 !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(24,24,27,0.08) !important;
}
.modal-back {
  background: rgba(24, 24, 27, 0.55) !important;
  backdrop-filter: none !important;
}

/* === COMPETITORS BLOCK (загромождал company) === */
#competitors-block { display: none !important; }

/* === FOOTER (полная переделка для site-footer partial) === */
.footer, footer.footer, footer.site-footer, footer {
  background: #18181B !important;
  background-image: none !important;
  color: #A8A29E !important;
  border-top: 0 !important;
  padding: 56px 0 24px !important;
  margin-top: 80px !important;
  font-family: 'Geist', -apple-system, sans-serif !important;
}
.footer a, footer a { color: #FAFAF9 !important; text-decoration: none !important; }
.footer a:hover, footer a:hover { color: #7B8AED !important; }

/* Top section: brand + cols */
.footer .footer-top {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) 2.5fr !important;
  gap: 48px !important;
  padding-bottom: 40px !important;
  border-bottom: 1px solid #2A2A2D !important;
}

/* Brand column */
.footer-brand .footer-logo {
  display: inline-block !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  color: #FAFAF9 !important;
  text-decoration: none !important;
}
.footer-brand .footer-logo .dot {
  color: #7B8AED !important;
  font-weight: 800 !important;
}
.footer-brand .footer-tagline {
  margin-top: 14px !important;
  font-size: 13px !important;
  color: #8A847C !important;
  line-height: 1.55 !important;
  max-width: 260px !important;
}

/* Cols grid */
.footer-cols {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 32px !important;
}
.footer-col h5 {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #8A847C !important;
  margin: 0 0 14px !important;
}
.footer-col a {
  display: block !important;
  font-size: 13px !important;
  color: #E0DDD7 !important;
  text-decoration: none !important;
  padding: 4px 0 !important;
  line-height: 1.4 !important;
}
.footer-col a:hover { color: #7B8AED !important; }

/* Bottom bar */
.footer .footer-bottom {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding-top: 24px !important;
  gap: 20px !important;
  font-size: 12px !important;
  color: #57534E !important;
  flex-wrap: wrap !important;
}
.footer-bottom .footer-legal {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: -0.005em !important;
}

/* Mobile: cols 2x2, brand сверху */
@media (max-width: 768px) {
  .footer .footer-top {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .footer-cols {
    grid-template-columns: 1fr 1fr !important;
    gap: 24px 20px !important;
  }
  .footer-brand .footer-tagline { max-width: 100% !important; }
  .footer .footer-bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }
}

/* === Массовый фикс — большие радиусы и тени === */
[style*="border-radius:14px"], [style*="border-radius: 14px"],
[style*="border-radius:16px"], [style*="border-radius: 16px"],
[style*="border-radius:20px"], [style*="border-radius: 20px"],
[style*="border-radius:24px"], [style*="border-radius: 24px"],
[style*="border-radius:28px"], [style*="border-radius: 28px"] {
  border-radius: 6px !important;
}
[style*="box-shadow:0 20px"], [style*="box-shadow: 0 20px"],
[style*="box-shadow:0 24px"], [style*="box-shadow: 0 24px"] {
  box-shadow: 0 1px 3px rgba(24,24,27,0.08) !important;
}

/* === NUMERICS — JetBrains Mono с tabular numerics === */
.numeric, .rating-value, .counter, .stat-num, .hstat-num, .dist-num,
.hero-score-num, .review-rating, [data-numeric] {
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-feature-settings: 'tnum', 'lnum' !important;
  letter-spacing: -0.01em !important;
}

/* === Trust line («N отзывов · X% рекомендуют») — без зелёного pill'а === */
#trust-text {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #57534E !important;
  font-weight: 500 !important;
  padding: 0 !important;
}

/* === Категория-пилл в hero — plain text === */
#hero-category {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  color: #57534E !important;
  font-weight: 500 !important;
  font-size: 13px !important;
}

/* === Аватары авторов / company logos === */
.author-ava, .author-card .ava {
  background: #F4F3F0 !important;
  background-image: none !important;
  color: #18181B !important;
  border-radius: 50% !important;
  font-weight: 500 !important;
}
.hero-logo-fallback,
.rev-card .logo, .top-card .logo {
  background: #18181B !important;
  background-image: none !important;
  color: #FAFAF9 !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}
.hero-logo { border-radius: 6px !important; }

/* === Burger (мобильное меню) — статический в partials/header.html === */
.burger {
  display: none;
  width: 36px; height: 36px;
  border-radius: 4px;
  background: #FFFFFF;
  border: 1px solid #E0DDD7;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
  padding: 0;
  margin-left: 8px;
  flex-shrink: 0;
  transition: background .12s, border-color .12s;
}
.burger:hover { background: #F4F3F0; border-color: #CDC9C1; }
.burger span {
  display: block; width: 16px; height: 1.5px;
  background: #18181B;
  border-radius: 0;
}
@media (max-width: 1024px) {
  .burger { display: flex !important; }
  .header .nav { display: none !important; }
  .header .header-search { display: none !important; }
  .header .header-actions [data-mobile-hide] { display: none !important; }
}
@media (max-width: 480px) {
  .header .header-actions #headerAuthCta { display: none !important; }
}

/* === Адаптация для мобайла (≤ 720px) === */
@media (max-width: 720px) {
  #ai-summary-tags {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .tabs { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .tab { white-space: nowrap !important; }
  .hero h1, .hero-name { font-size: 24px !important; }
  .container { padding-left: 16px !important; padding-right: 16px !important; }
}

@media (max-width: 480px) {
  .btn, .btn-primary, .btn-secondary { font-size: 13px !important; padding: 8px 12px !important; }
  .modal { border-radius: 0 !important; max-width: 100% !important; }
}

/* ─── MAX webview контекст ───────────────────────────────────────────────
   Когда сайт открыт внутри мини-приложения MAX, у MAX свой chrome сверху-справа
   (× закрыть, ⋮ меню, ⤢ fullscreen) который перекрывает наш header.
   Mini-app при логине ставит sessionStorage.otz_in_max=1 и редиректит на
   /profile.html?max=1 — этот класс добавляется на body через JS в main.js.
   Тут даём место под MAX-chrome справа и сверху + safe-area-inset для notch. */
body[data-max="1"] {
  padding-top: env(safe-area-inset-top, 0);
  padding-right: env(safe-area-inset-right, 0);
  padding-left:  env(safe-area-inset-left, 0);
}
body[data-max="1"] .header,
body[data-max="1"] .header .container {
  padding-right: max(16px, calc(env(safe-area-inset-right, 0) + 80px)) !important;
}
body[data-max="1"] .header-actions .btn-sm { padding: 6px 10px !important; font-size: 12px !important; }
/* Скрываем «Кабинет» кнопку в шапке если уже внутри MAX (юзер и так в кабинете) */
body[data-max="1"] .header-actions a[data-when-auth] { display: none !important; }