@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

/* По умолчанию прячем car-specs-mobile (для десктопа) */
.index-page .car-specs-mobile {
  display: none !important;
}

/* ===== MOBILE (<=768px) ===== */
@media (max-width: 768px) {
  html, body { overflow-x: hidden; }
  body.index-page { font-family: 'Roboto', sans-serif; background:#000; color:#fff; }
  .index-page, .index-page * { box-sizing: border-box; }

  /* Контейнер */
  .index-page .page-container {
    width:100%;
    max-width:100%;
    margin:0 auto;
    padding:0;
    background:#000;
  }

  /* Карточка */
  .index-page .car-card {
    padding:15px;
    background:#1c1c1c;
    min-height: unset; /* убрана минимальная высота */
  }

  /* Заголовки */
  .index-page .car-title    { font-size:19px; padding:0 0 4px; color:#fff; }
  .index-page .car-subtitle { font-size:12px; padding:0 0 4px; color:#9a9a9a; }

  /* Цена + плашка */
  .index-page .car-price-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 10px;
  }
  .index-page .car-price {
    font-size:24px;
    padding:0; /* убран паддинг */
  }
  .index-page .price-badge {
    display: inline-block;
    background-color: #FFDD2D; /* цвет как на Drom */
    color: #000;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 12px;
    line-height: 1;
    flex-shrink: 0;
    font-weight: 500;
  }

  /* Список карточек */
  .index-page .grid     { display:flex; flex-direction:column; gap:12px; padding:0; }
  .index-page .car-link { display:block; max-width:100%; text-decoration:none; color:inherit; }
  .index-page .image-wrapper { display:none; } /* прячем десктопное превью */

  /* === ГАЛЕРЕЯ === */
  .index-page .pro-gallery {
    display:block;
    padding:0;
    width:100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background:transparent;
  }
  .index-page .pro-track{
    display:flex;
    gap:2px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width:none;
    background:transparent;
  }
  .index-page .pro-track::-webkit-scrollbar { height:0; }
  .index-page .pro-gap-start{ flex:0 0 15px; scroll-snap-align:start; scroll-snap-stop:always; }
  .index-page .pro-gap-end{ flex:0 0 15px; scroll-snap-align:end; scroll-snap-stop:always; }

  /* Слайды */
  .index-page .pro-slide{
    flex:0 0 auto;
    height:180px;
    overflow:hidden;
    scroll-snap-align:start;
    background:transparent;
  }
  .index-page .pro-slide.no-snap { scroll-snap-align:none; }
  .index-page .pro-slide.first-slide img{
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
  }
  .index-page .pro-slide.last-slide img{
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
  }
  .index-page .pro-slide img{
    height:100%;
    width:auto;
    object-fit:cover;
    display:block;
  }

  /* Характеристики (таблица) */
  .index-page .car-specs {
    display: none; /* прячем таблицу на мобилке */
  }

  /* Новый вид характеристик одной строкой (только для мобилы) */
  .index-page .car-specs-mobile {
    display: block !important;
    width: 100%;
    font-size: 14px;
    color: #fff;
    background: #1c1c1c;
    padding: 15px 0 15px 2px;
    box-sizing: border-box;
  }

  /* Подвал */
  .index-page .card-footer{
    width:100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background:#1c1c1c;
    padding:0; /* паддинг убран */
    font-size:12px;
    display:flex;
    gap:12px;
    min-height: 0;
  }
  .index-page .card-footer span:last-child{
    margin-left:auto;
    white-space:nowrap;
  }
  .card-date { padding-right:15px; }
}