/* ===== Liquid Glass — стеклянные карточки в духе iOS ===== */
:root {
  /* нейтральное стекло */
  --glass-bg: linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, 0) 38%),
              linear-gradient(145deg, rgba(255, 255, 255, .085), rgba(255, 255, 255, .025) 50%, rgba(255, 255, 255, .045));
  /* бургундское (тонированное) стекло */
  --glass-tint: linear-gradient(180deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, 0) 36%),
                linear-gradient(150deg, rgba(122, 30, 43, .62), rgba(66, 16, 24, .48) 55%, rgba(30, 7, 9, .55));
  /* кромка: блик сверху, толщина по краям, тень снизу, внутреннее свечение */
  --glass-rim: inset 0 1px 0 rgba(255, 255, 255, .30), inset 1px 0 0 rgba(255, 255, 255, .10), inset -1px 0 0 rgba(255, 255, 255, .05),
               inset 0 -1px 0 rgba(0, 0, 0, .28), inset 0 0 0 1px rgba(255, 255, 255, .07), inset 0 22px 34px -24px rgba(255, 255, 255, .18);
  --glass-shadow: 0 22px 44px -26px rgba(0, 0, 0, .8), 0 2px 6px -2px rgba(0, 0, 0, .35);
  /* Карточки не размывают фон: под ними только плавные градиенты, размытие их почти не меняет,
     а пересчёт на каждом кадре прокрутки тормозил страницу. Размытие оставлено шапке, меню и окнам. */
  --glass-blur: none;
}

/* Подложка — цветные пятна, которые стекло размывает и «преломляет» */
body::before {
  content: ''; position: fixed; inset: -10%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38% 32% at 10% 16%, rgba(122, 30, 43, .70), transparent 70%),
    radial-gradient(32% 28% at 90% 26%, rgba(201, 164, 106, .20), transparent 70%),
    radial-gradient(44% 40% at 72% 86%, rgba(168, 57, 74, .45), transparent 70%),
    radial-gradient(30% 30% at 22% 74%, rgba(201, 164, 106, .12), transparent 70%),
    radial-gradient(26% 24% at 50% 48%, rgba(94, 23, 32, .55), transparent 70%);
}

/* --- Нейтральное стекло --- */
:is(.h-dir, .box__wrap--light, .h-wrap, .h-promo, .review, .card, .h-car, .row, .filter, .trims__year, .trim, .perks li, .rw,
    .brands__item, .notice, .note-box, .feature, .contacts__info, .h-tg__img, .h-contacts__map, .empty, .tg__phone,
    .step:not(.step--cta), .dir, .trust__head, .drop, .modal__box, .fab__item, .theme-switch) {
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-rim), var(--glass-shadow);
  --glass-on: 1;
}

/* --- Бургундское стекло (фирменные блоки) --- */
:is(.h-trust__area:not(.h-trust__area--photo), .h-step, .h-promo__item, .h-widget, .h-tg__desc, .h-contacts__info, .specs,
    .box__wrap--dark, .cat-hero__text, .trust__item, .banner, .tg__text, .about__stats div, .footer__wrap, .fab__btn, .step--cta) {
  background: var(--glass-tint);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-rim), var(--glass-shadow);
}
/* Акцентный блок «Хотите заказать автомобиль?» — более насыщенное стекло */
.h-scheme__cta {
  background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 40%),
              radial-gradient(400px 220px at 100% 0%, rgba(201, 164, 106, .3), transparent 70%),
              linear-gradient(135deg, rgba(142, 36, 51, .85), rgba(85, 17, 30, .75));
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-rim), var(--glass-shadow);
}

/* Вложенные плашки внутри стекла — тоньше */
.row__price, .rates__card, .specs__price, .pb__input, .seg { background: rgba(255, 255, 255, .045); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), inset 0 0 0 1px rgba(255, 255, 255, .06); }
.specs__price--main { background: rgba(201, 164, 106, .12); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), inset 0 0 0 1px rgba(201, 164, 106, .35); }
.box__wrap--dark::after { display: none; }

/* Шапка и нижняя панель — стекло */
.header { background: rgba(30, 7, 9, .55); -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08); }
.mbar { background: rgba(30, 7, 9, .6); -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14); }

/* Стеклянные кнопки-стрелки и иконки-плашки */
.icon-btn, .h-arrows button { background: rgba(255, 255, 255, .06); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), inset 0 0 0 1px rgba(255, 255, 255, .1); border-color: transparent; }
.h-trust__icon, .h-step__icon, .trust__item .ico, .h-promo__item > .ico {
  background: linear-gradient(180deg, rgba(255, 255, 255, .22), rgba(255, 255, 255, .04));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 0 0 1px rgba(255, 255, 255, .12), 0 10px 22px -12px rgba(0, 0, 0, .7);
}

/* При наведении — стекло «приподнимается», кромка ярче */
.fx--tilt.is-hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 0 0 1px rgba(255, 255, 255, .12), inset 0 24px 36px -24px rgba(255, 255, 255, .25),
              0 34px 60px -28px rgba(0, 0, 0, .9), 0 0 44px -12px rgba(168, 57, 74, .5) !important;
}

/* ===== Белая тема: матовое молочное стекло ===== */
:root[data-theme="light"] {
  /* бургундское стекло на белом — плотнее, иначе белый просвечивает и текст теряется */
  --glass-tint: linear-gradient(180deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, 0) 36%),
                linear-gradient(150deg, rgba(112, 27, 39, .95), rgba(70, 16, 25, .94) 55%, rgba(40, 9, 12, .96));
  --glass-bg: linear-gradient(180deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, .35) 40%),
              linear-gradient(145deg, rgba(255, 255, 255, .6), rgba(255, 255, 255, .38));
  --glass-rim: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 0 0 1px rgba(53, 13, 19, .08), inset 0 -1px 0 rgba(53, 13, 19, .06), inset 0 20px 30px -22px rgba(255, 255, 255, .9);
  --glass-shadow: 0 20px 40px -26px rgba(53, 13, 19, .35), 0 2px 6px -2px rgba(53, 13, 19, .1);
}
:root[data-theme="light"] body::before {
  background:
    radial-gradient(38% 32% at 10% 16%, rgba(122, 30, 43, .16), transparent 70%),
    radial-gradient(32% 28% at 90% 26%, rgba(201, 164, 106, .28), transparent 70%),
    radial-gradient(44% 40% at 72% 86%, rgba(168, 57, 74, .14), transparent 70%),
    radial-gradient(30% 30% at 22% 74%, rgba(201, 164, 106, .2), transparent 70%);
}
:root[data-theme="light"] .row__price { background: rgba(255, 255, 255, .5); }
:root[data-theme="light"] .header .theme-switch, :root[data-theme="light"] .drop { --glass-bg: linear-gradient(145deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .03)); --glass-rim: inset 0 1px 0 rgba(255, 255, 255, .25), inset 0 0 0 1px rgba(255, 255, 255, .08); }
:root[data-theme="light"] .header { background: rgba(37, 8, 9, .82); }
:root[data-theme="light"] :is(.icon-btn, .h-arrows button):not(.icon-btn--gold) { background: rgba(255, 255, 255, .6); box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(53, 13, 19, .1); }
:root[data-theme="light"] .fx--tilt.is-hover:not(:is(.h-trust__area, .h-step, .h-promo__item, .h-widget, .h-scheme__cta, .trust__item)) {
  box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(110, 26, 37, .14), 0 30px 50px -26px rgba(53, 13, 19, .4) !important;
}

/* Телефоны: чуть меньше размытие — легче для видеокарты */

/* Без поддержки размытия фона — плотнее, чтобы текст читался */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root { --glass-bg: linear-gradient(145deg, #3a0f15, #2a0a0e); --glass-tint: var(--grad-wine); }
  :root[data-theme="light"] { --glass-bg: linear-gradient(145deg, #fff, #f6f1ee); }
}

/* Растворение длинного отзыва — маской, а не заливкой цветом фона (на стекле заливка дала бы полосу) */
.review__text::after, .grid-reviews .review__text::after { display: none; }
.review__text { -webkit-mask-image: linear-gradient(#000 65%, transparent); mask-image: linear-gradient(#000 65%, transparent); }
.review.is-open .review__text, .review.is-short .review__text { -webkit-mask-image: none; mask-image: none; }

/* Размытие — только там, где под стеклом движется содержимое страницы */
.drop, .modal__box, .fab__item { -webkit-backdrop-filter: blur(20px) saturate(170%); backdrop-filter: blur(20px) saturate(170%); }
/* Меню шапки: размытие внутри шапки (у неё своё размытие) браузеры не применяют к тому, что под шапкой,
   поэтому сквозь полупрозрачное меню был виден заголовок на видео. Фон — плотный бургунди, в обеих темах */
.header .drop, :root[data-theme="light"] .header .drop {
  background: linear-gradient(160deg, rgba(58, 14, 21, .985), rgba(30, 7, 9, .985));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), inset 0 0 0 1px rgba(201, 164, 106, .16), 0 30px 60px -20px rgba(0, 0, 0, .85);
}

/* Блоки с логотипом — то же бургундское стекло, что у остальных карточек */
.h-photo-ph, .h-scheme__img, .h-social__img {
  background: var(--glass-tint);
  box-shadow: var(--glass-rim), var(--glass-shadow);
}
.h-trust__area--photo { background: none; box-shadow: none; }
.h-photo-ph { border-radius: inherit; }

/* Соцсети — фирменные цвета: белый значок на круге цвета сети */
.soc { color: #fff !important; transition: transform .2s, filter .2s, box-shadow .2s; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 6px 14px -8px rgba(0, 0, 0, .6); }
.soc:hover { transform: translateY(-2px); filter: brightness(1.12); }
.soc--tg  { background: #26a5e4 !important; }
.soc--wa  { background: #25d366 !important; }
.soc--max { background: linear-gradient(135deg, #3f8cff, #7a4bff 55%, #b04bff) !important; }
.soc--vk  { background: #0077ff !important; }
.soc--wechat { background: #07c160 !important; }
.soc--tiktok { background: #010101 !important; }
.soc--tiktok .ico { filter: drop-shadow(1px 1px 0 #fe2c55) drop-shadow(-1px -1px 0 #25f4ee); }  /* фирменная бирюзово-красная обводка */
button.soc, button.msg { border: 0; padding: 0; font: inherit; cursor: pointer; }
.soc--yt  { background: #ff0000 !important; }
.soc--ig  { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%) !important; }
.footer__note { grid-column: 1 / -1; font-size: 11px; opacity: .6; }

/* ===== Калькулятор: поля на бургундском фоне — читаемо в обеих темах ===== */
.field--dark { color: rgba(255, 255, 255, .78); }
.field--dark input, .field--dark select {
  background: rgba(0, 0, 0, .28) !important; color: #fff !important; border-color: rgba(201, 164, 106, .35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}
.field--dark input::placeholder { color: rgba(255, 255, 255, .45); }
.field--dark input:focus, .field--dark select:focus { border-color: var(--gold); background: rgba(0, 0, 0, .38) !important; }
/* выпадающий список — свой контрастный вид, независимо от темы ОС */
.field--dark select option, .field--dark select optgroup, .pb__input--select option, .pb__input--select optgroup { background: #2a0a0e; color: #f3ece4; }
.rates__label { color: var(--gold); }
.rates__row span { color: rgba(255, 255, 255, .7); }
.rates__row b { color: #fff; }
.structure__legend { color: rgba(255, 255, 255, .8); }

/* Белая тема: шапка плотная и одного цвета — раскрыта она или прилипла (раньше сквозь неё просвечивал белый фон) */
:root[data-theme="light"] .header,
:root[data-theme="light"] .header.is-scrolled { background: rgba(37, 8, 9, .97); }

/* ===== Форма заявки: мессенджеры и критерии ===== */
#modal-order .modal__box { width: min(580px, 100%); }
.mchips { display: flex; flex-wrap: wrap; gap: 6px; }
.mchip { position: relative; cursor: pointer; }
.mchip input { position: absolute; opacity: 0; pointer-events: none; }
.mchip span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 8px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--ink-2); background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--line); transition: .2s; }
.mchip .ico { width: 22px; height: 22px; padding: 4px; border-radius: 50%; color: #fff; }
.mchip--tg .ico { background: #26a5e4; } .mchip--max .ico { background: linear-gradient(135deg, #3f8cff, #7a4bff 55%, #b04bff); }
.mchip--vk .ico { background: #0077ff; } .mchip--viber .ico { background: #7360f2; } .mchip--wa .ico { background: #25d366; } .mchip--wechat .ico { background: #07c160; }
.mchip input:checked + span { color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--gold), 0 4px 14px -6px rgba(201, 164, 106, .5); background: rgba(201, 164, 106, .12); }
.mchip input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.omode { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.omode[hidden] { display: none; }
.crit { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 4px 0 0; padding: 16px; border: 0; border-radius: 16px; background: rgba(201, 164, 106, .07); box-shadow: inset 0 0 0 1px rgba(201, 164, 106, .22); }
.crit__title { grid-column: 1 / -1; margin: 0 0 2px; padding: 0; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.crit .field--wide { grid-column: 1 / -1; }
.field.is-error input, .field.is-error select { border-color: #d24a5c !important; box-shadow: 0 0 0 3px rgba(210, 74, 92, .15); }
.field.is-error > span { color: #d24a5c; }
@media (max-width: 520px) { .crit { grid-template-columns: 1fr; padding: 12px; } }
.rates__src { font-size: 11px; color: rgba(255, 255, 255, .55); margin-top: 2px; }

/* ===== Карта Baidu: превью в контактах и окно ===== */
.nr__city, .contacts__row--btn, .h-contacts__item--btn, .footer__addr { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
.nr__city:hover b, .contacts__row--btn:hover b, .h-contacts__item--btn:hover span, .footer__addr:hover span { color: var(--gold); }
.contacts__row--btn { width: 100%; padding: 12px 0; }
.footer__addr { display: flex; align-items: center; gap: 8px; }

.map-card { position: relative; display: flex; flex-direction: column; gap: 36px; width: 100%; height: 100%; min-height: inherit; padding: 32px; border: 0; border-radius: inherit; overflow: hidden; cursor: pointer; text-align: left; color: #f3ece4;
  background: radial-gradient(420px 260px at 50% 42%, rgba(201, 164, 106, .18), transparent 70%), var(--glass-tint); box-shadow: var(--glass-rim), var(--glass-shadow); }
.map-card__grid { position: absolute; inset: 0; opacity: .35; pointer-events: none;
  background-image: linear-gradient(rgba(201, 164, 106, .25) 1px, transparent 1px), linear-gradient(90deg, rgba(201, 164, 106, .25) 1px, transparent 1px),
    linear-gradient(32deg, transparent 47%, rgba(246, 226, 179, .35) 48%, rgba(246, 226, 179, .35) 50%, transparent 51%),
    linear-gradient(-58deg, transparent 63%, rgba(246, 226, 179, .25) 64%, rgba(246, 226, 179, .25) 65.5%, transparent 66.5%);
  background-size: 46px 46px, 46px 46px, 100% 100%, 100% 100%; -webkit-mask-image: radial-gradient(circle at 50% 40%, #000 30%, transparent 75%); mask-image: radial-gradient(circle at 50% 40%, #000 30%, transparent 75%); }
/* метка — в потоке над текстом: по центру свободного места, на узком экране не наезжает на адрес */
.map-card__pin { position: relative; flex: none; align-self: center; margin: auto 0; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; color: #fff;
  background: linear-gradient(135deg, #8e2433, #4a1219); box-shadow: 0 0 0 10px rgba(168, 57, 74, .22), 0 0 0 22px rgba(168, 57, 74, .1), 0 14px 30px -8px rgba(0, 0, 0, .7); transition: transform .3s; }
.map-card__pin .ico { width: 30px; height: 30px; }
.map-card:hover .map-card__pin { transform: translateY(-6px); }
.map-card__body { position: relative; display: flex; flex-direction: column; gap: 6px; max-width: 520px; }
.map-card__body b { font-size: 22px; }
.map-card__body > span:not(.btn) { color: rgba(255, 255, 255, .78); }
.map-card__body small { color: var(--gold-100); font-size: 14px; letter-spacing: .02em; }
.map-card__body .btn { align-self: flex-start; margin-top: 10px; }
:root[data-theme="light"] .map-card { --gold: #c9a46a; --gold-100: #f6e2b3; --ink: #f3ece4; color: #f3ece4; }

.modal__box--map { width: min(1000px, 100%); padding: 28px; text-align: left; }
.map-modal__head { display: flex; flex-direction: column; gap: 4px; margin-bottom: 16px; padding-right: 44px; }
.map-modal__head p { color: var(--ink-2); }
.map-modal__cn { font-size: 15px; color: var(--gold) !important; }
.map-modal__btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.map-modal__frame { position: relative; height: min(60vh, 540px); border-radius: 16px; overflow: hidden; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.map-modal__frame iframe { position: relative; width: 100%; height: 100%; border: 0; display: block; }
.map-modal__loading { position: absolute; inset: 0; display: grid; place-items: center; color: var(--ink-3); }
#modal-map.is-loaded .map-modal__loading { display: none; }
.map-modal__note { display: block; margin-top: 10px; color: var(--ink-3); font-size: 12px; }
@media (max-width: 768px) {
  .modal__box--map { padding: 20px 14px; }
  .map-modal__frame { height: 58vh; }
  .map-card { padding: 22px; min-height: 320px; }
  .map-card__body b { font-size: 18px; }
}