/* ===========================
   car_detail.css — детальная страница авто (DESKTOP ONLY)
   Применяется только при ширине ≥ 861px
   =========================== */
@media (min-width: 861px) {

  /* Контейнер */
  .car-detail {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px;
  }

  /* Хлебные крошки / назад */
  .cd-breadcrumbs { margin-bottom: 10px; }
  .cd-back { text-decoration: none; opacity: .9; }
  .cd-back:hover { opacity: 1; }

  /* ===== Внешний лэйаут: левый блок + правая колонка 250px ===== */
  .cd-page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;
    gap: 18px;
    align-items: start;
  }

  /* ===== ЛЕВАЯ ОБЁРТКА (с заливкой) ===== */
  .cd-col-left {
    background: #2E364F;
    border-radius: 20px;
    display: grid;
    gap: 16px;
    box-sizing: border-box;
  }

  /* ===== ВЕРХНИЙ СЕКТОР В ЛЕВОЙ ОБЁРТКЕ ===== */
  .car-detail-grid {
    display: grid;
    grid-template-columns: 490px 1fr;  /* слева фикс 490 (галерея), справа — контент */
    column-gap: 24px;
    row-gap: 13px;
    align-items: start;
    background: transparent;
    border-radius: 0;
    padding: 32px;
  }

  /* Заголовок */
  .cd-header { margin: 0; }
  .car-detail-grid > .cd-header { grid-column: 1 / -1; }

  .cd-title-row{
    display:flex;
    align-items:center;
    gap:12px;               /* отступ между названием и плашкой у заголовка */
  }
  .cd-title{
    margin:0;
    padding:0;
    font-size:24px;
    font-weight:500;
    line-height:1;          /* без лишнего вертикального пространства */
    text-transform:uppercase;
    color:#fff;
  }

  .cd-badges{ display:inline-flex; align-items:center; gap:12px; }
  .cd-badge{
    display:inline-flex;
    align-items:center;
    padding:2px 8px;
    border-radius:9999px;
    background:#FFB900;
    color:#000;
    font-size:12px;
    font-weight:500;
    line-height:1;
    border:none;
  }

  /* Комплектация */
  .cd-subtitle{
    font-size:12px;
    font-weight:400;
    color:#F5F5F5;
    margin:6px 0 0 0;
  }

  /* ===== Галерея (база; детали в car_detail_galary.css) ===== */
  .cd-gallery{ width:490px; max-width:490px; display:grid; gap:12px; }
  .cd-main { border-radius:12px; overflow:hidden; }
  #cd-main-image { display:block; width:100%; height:auto; object-fit:cover; }
  .cd-thumbs { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; }
  .cd-thumb { border:none; padding:0; background:none; cursor:pointer; border-radius:8px; overflow:hidden; flex:0 0 auto; }
  .cd-thumb img { display:block; width:110px; height:70px; object-fit:cover; }

  /* ===== Правая колонка верхнего сектора ===== */

  .cd-aside{
    display:grid;
    gap:16px;
    justify-items:start;      /* по умолчанию — ширина по контенту */
  }

  /* Цена + чип; локация ниже — ширина по содержимому */
  .cd-pricebox{
    display:inline-grid;
    grid-template-columns:max-content max-content;
    column-gap:20px;          /* плашка от цены */
    row-gap:2px;              /* расстояние до «Во Владивостоке» */
    align-items:center;
    width:max-content;
    justify-self:start;
  }
  .cd-price{
    grid-column:1; grid-row:1;
    font-size:22px; font-weight:600;
    margin:0; padding:0; line-height:1;
    display:inline-block; white-space:nowrap;
  }
  .cd-chip-wrap{ grid-column:2; grid-row:1; display:flex; align-items:center; }
  .cd-local{ grid-column:1 / -1; grid-row:2; font-size:12px; opacity:.85; margin:0; padding:0; line-height:1.2; white-space:nowrap; }

  /* Чип «Хороший выбор» */
  .cd-chip{
    display:inline-flex; align-items:center;
    padding:2px 5px;          /* слева/справа 5px */
    border-radius:9999px;
    font-size:10px; font-weight:500; line-height:1;
    background:#74AF52; color:#fff; border:none; white-space:nowrap;
  }
  .cd-chip--good{ background:#74AF52; }

  /* ====== ВТОРОЙ БЛОК (краткие характеристики) ======
     — отступ СВЕРХУ 54px,
     — шрифт 14px / 400,
     — одинаковая ширина левой и правой колонок,
     — на всю доступную ширину колонки (растягивается) */
  .cd-specgrid{
    display:grid;
    grid-template-columns: 1fr 1fr;   /* одинаковые колонки */
    column-gap:18px;
    row-gap:8px;
    font-size:14px;
    font-weight:400;
    margin:54px 0 0 0;                /* отступ сверху 54px */
    width:100%;
    justify-self:stretch;             /* переопределяем justify-items:start у .cd-aside */
  }
  .cd-spec-names, .cd-spec-values{ display:grid; row-gap:8px; }
  .cd-spec-names > div{ color:#C5C9D6; }   /* цвет левой колонки */
  .cd-spec-values > div{ font-weight:400; }

  /* Кнопки (если вернёшь) */
  .cd-actions { display:grid; gap:10px; }
  .cd-btn{
    display:inline-flex; align-items:center; gap:8px;
    text-decoration:none; border-radius:10px; padding:10px 14px;
    border:1px solid rgba(255,255,255,.1);
    transition:transform .12s ease, border-color .12s ease;
  }
  .cd-btn:hover{ transform:translateY(-1px); border-color:rgba(255,255,255,.25); }

  /* ===== НИЖНИЙ БЛОК ЛЕВОЙ ОБЁРТКИ ===== */
  .cd-left-bottom { }
  .cd-left-bottom__inner{
    background:transparent; border-radius:0; padding:0 32px 32px 32px;
  }
  .cd-bottom-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 250px;
    gap:18px; align-items:start;
  }
  .cd-block-title{ font-size:18px; font-weight:600; margin:0 0 12px 0; }

  /* Правая колонка страницы (вне левой обёртки) */
  .cd-col-right { width:auto; }
}
