/* ==========================================================================
   КАР СИТИ — тема в стиле СберАвто (строго зелёная)
   Overlay-слой поверх style.min.css. Грузится в шапке на каждой странице.
   Бренд Сбера не копируется — используется похожая зелёная палитра/стилистика.
   ========================================================================== */

:root {
  --sb-green:#21A038;
  --sb-green-dark:#1a8730;
  --sb-green-deep:#0f7a2b;
  --sb-green-soft:#e8f6ec;
  --sb-green-grad:linear-gradient(135deg,#21A038 0%,#1a8730 100%);
  --sb-teal:#0fa37f;
  --sb-teal-grad:linear-gradient(120deg,#0c8f76 0%,#1aa653 60%,#21A038 100%);
  --sb-ink:#1f2229;
  --sb-muted:#6b7280;
  --sb-line:#e9ecef;
  --sb-bg:#f4f6f8;
  --sb-card:#ffffff;
  --sb-radius:18px;
  --sb-radius-sm:12px;
  --sb-shadow:0 1px 4px rgba(20,30,40,.05),0 6px 24px rgba(20,30,40,.06);
  --sb-shadow-hover:0 8px 30px rgba(20,30,40,.13);
}

/* ==========================================================================
   ТИПОГРАФИКА — Golos Text (текст/UI) + Manrope (заголовки)
   ========================================================================== */
:root{
  --sb-font:'Golos Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --sb-font-display:'Manrope','Golos Text',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

body,
.input,.form__field,select,textarea,input,
button,.button,.site-list__group,
.catalog__detail-text,.catalog__car-price,.page-footer,.about__text{
  font-family:var(--sb-font) !important;
}
body{ letter-spacing:.1px; line-height:1.55; }

h1,h2,h3,h4,
.heading,.title,.section-title,
.sa-title,.sa-services__title,.sa-vykup__heading,.sa-credit__title,
.sa-smart__title,.sa-filter__title,.sa-partners__title,.sa-card__name,
.catalog__car-heading,.page-footer__title{
  font-family:var(--sb-font-display) !important;
  letter-spacing:-.3px;
  font-weight:800;
}
h1,.heading--h1,.sa-title{ line-height:1.12; }

/* Крупная читаемая цена и кнопки */
.catalog__car-price{ font-weight:800; letter-spacing:-.3px; }
.button,.button--green,.button--red,.button--slider,.sa-search-btn,
.sa-card__cnt,.catalog__mini-credit{ font-family:var(--sb-font) !important; letter-spacing:.2px; }

/* Тело SEO-текста — спокойнее и читабельнее */
.about__text,.sa-about,.page-main__week-text,.catalog__checked-text{
  line-height:1.65; color:var(--sb-muted);
}

/* ---------- Базовая поверхность ---------- */
body{
  background:var(--sb-bg);
  color:var(--sb-ink);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{transition:color .18s ease;}
a:hover{color:var(--sb-green-dark);}

/* ---------- Кнопки (зелёный pill) ---------- */
.button,
.button--green,
.button--red,
.button--slider,
button.button{
  border-radius:999px !important;
  font-weight:600 !important;
  letter-spacing:.1px;
  box-shadow:none !important;
  transition:background-color .18s ease,box-shadow .18s ease,transform .05s ease !important;
}
.button--green,
.button--red,
.button--slider,
button.button{
  background-color:var(--sb-green) !important;
  color:#fff !important;
  border:0 !important;
}
.button--green:hover,
.button--red:hover,
.button--slider:hover,
button.button:hover{ background-color:var(--sb-green-dark) !important; color:#fff !important; }
.button:active{ transform:translateY(1px); }

.button--outline,
.button--white{
  background:#fff !important;
  color:var(--sb-green) !important;
  border:1.5px solid var(--sb-green) !important;
}
.button--outline:hover,
.button--white:hover{ background:var(--sb-green-soft) !important; }

/* ---------- Поля форм ---------- */
.input,
.form__field,
.form__field--select,
select.form__field,
input.form__field,
textarea.form__field{
  border-radius:var(--sb-radius-sm) !important;
  border:1.5px solid var(--sb-line) !important;
  background:#fff !important;
  transition:border-color .18s ease,box-shadow .18s ease !important;
}
.input:focus,
.form__field:focus{
  border-color:var(--sb-green) !important;
  box-shadow:0 0 0 3px rgba(33,160,56,.15) !important;
  outline:none !important;
}

/* ==========================================================================
   ШАПКА — компактная, в стиле СберАвто (меню видимое, без соцсетей)
   ========================================================================== */
.page-header{
  background:#fff;
  box-shadow:0 1px 0 var(--sb-line),0 2px 12px rgba(20,30,40,.04);
  position:sticky; top:0; z-index:50;
}
.page-header__top{ background:#fff; color:var(--sb-muted); border-bottom:1px solid var(--sb-line); }
.page-header__top-wrap{ padding:7px 0; font-size:13px; }
.page-header__contacts a{ color:var(--sb-ink); }
.page-header__contacts a:hover{ color:var(--sb-green); }

.page-header__wrap{ align-items:center; padding:10px 0; gap:24px; }

/* Меню — показываем компактно (НЕ прячем) */
.main-nav,
.main-nav__list{ display:flex !important; }
.main-nav__list{
  gap:6px 4px; flex-wrap:wrap; align-items:center; list-style:none; margin:0; padding:0;
}
.main-nav__list .site-list__item > a,
.main-nav__list .site-list__group{
  font-weight:500; font-size:15px; color:var(--sb-ink);
  padding:9px 14px; border-radius:999px; display:inline-block;
  background:transparent; border:0; cursor:pointer; transition:background .15s,color .15s;
}
.main-nav__list .site-list__item > a:hover,
.main-nav__list .site-list__group:hover{ background:var(--sb-green-soft); color:var(--sb-green-dark); }
/* Кнопка «Продать» — зелёная пилюля-акцент */
.main-nav__list .banks-table__rating-number--red > a{
  background:var(--sb-green) !important; color:#fff !important;
}
.main-nav__list .banks-table__rating-number--red > a:hover{ background:var(--sb-green-dark) !important; }
.main-nav__list .banks-table__rating-number--yellow > a{ color:var(--sb-green-deep); }

/* «Мои авто» / кабинет в шапке */
.page-header__makes-btn2{
  background:var(--sb-green) !important; border-radius:14px !important;
}
.page-header__makes-btn2:hover{ background:var(--sb-green-dark) !important; }

/* ==========================================================================
   КАРТОЧКИ КАТАЛОГА И БЛОКИ
   ========================================================================== */
.catalog__car,
.card,
.product-card,
.banks-table,
.page-banner__item,
.catalog__item{
  border-radius:var(--sb-radius) !important;
  background:var(--sb-card);
  box-shadow:var(--sb-shadow);
  border:1px solid var(--sb-line);
  overflow:hidden;
  transition:box-shadow .2s ease,transform .2s ease;
}
.catalog__car:hover,
.product-card:hover,
.catalog__item:hover{
  box-shadow:var(--sb-shadow-hover);
  transform:translateY(-2px);
}
.catalog__car-weekend,
.catalog__car-label span,
.badge,.label{ border-radius:999px !important; }
.catalog__car-label span{ background:var(--sb-green) !important; color:#fff !important; }

/* Убрать оценку-звёздочки (catalog__stars--mobile НЕ трогаем — там кнопка «Рассрочка») */
.catalog__stars{ display:none !important; }

/* Фильтр марок на каталоге */
.makes__item--active a,
.makes__item a:hover{ color:var(--sb-green) !important; }
.makes__qty{ color:var(--sb-green); }

/* ---------- Заголовки ---------- */
h1,h2,h3,.heading,.title{ color:var(--sb-ink); letter-spacing:-.2px; }
.section-title::after,.title::after,.heading::after{ background:var(--sb-green) !important; }

/* ==========================================================================
   ПОДВАЛ — чистый тёмно-зелёный
   ========================================================================== */
.page-footer{ background:#10241a; color:#c4ccc6; }
.page-footer a{ color:#c4ccc6; }
.page-footer a:hover{ color:#fff; }
.page-footer__title{ color:#fff; }
.page-footer__count a{ color:#fff; }
.page-footer__social{ display:none !important; }
.page-footer__top{
  justify-content:flex-start !important;
  flex-wrap:wrap; gap:32px 64px;
}
.page-footer__top .page-footer__wrapper{ margin:0; }
.page-footer__wrapper--contacts{ max-width:300px; }
.page-footer__top .page-footer__title{ margin-bottom:10px; font-weight:700; }
.page-footer__link-list{ margin:0; padding:0; list-style:none; }
.page-footer__link-item{ margin-bottom:6px; }
@media(max-width:991px){ .page-footer__top{ gap:24px 40px; } }
@media(max-width:575px){
  .page-footer__top{ gap:20px; }
  .page-footer__wrapper--contacts{ max-width:100%; }
}

/* ---------- Cookie / уведомления ---------- */
.container-content-modal-coocke button,
.container-content-modal-coocke .button{
  background:var(--sb-green) !important; border-radius:999px !important; color:#fff !important;
}

/* ---------- Модалка подбора ---------- */
.modal-search__wrap{ background:var(--sb-bg); }
.modal-search h2{ color:var(--sb-ink); }

/* ==========================================================================
   Длинная отдельная кнопка-ссылка (главная)
   ========================================================================== */
.sa-longbtn{
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; text-align:center; box-sizing:border-box;
  background:#fff; color:var(--sb-ink) !important;
  font-weight:700; font-size:17px; padding:18px 24px;
  border-radius:999px; text-decoration:none; margin:8px 0 28px;
  border:1.5px solid var(--sb-line); box-shadow:var(--sb-shadow);
  transition:background .18s,transform .18s,color .15s,border-color .15s;
}
.sa-longbtn:hover{
  background:var(--sb-green-soft); color:var(--sb-green-dark) !important;
  border-color:var(--sb-green); transform:translateY(-2px); text-decoration:none;
}