
/* Scoped styling */
.models.vgcc-scope{max-width:1200px;margin:0 auto;padding:10px 0}
.models.vgcc-scope, .models.vgcc-scope *{box-sizing:border-box}

/* Tabs */
.models.vgcc-scope .models-tabs{display:flex;justify-content:center;margin:10px 0 40px}
.models.vgcc-scope .tabs{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.models.vgcc-scope .tab{display:inline-flex;align-items:center;justify-content:center;padding:12px 26px;border:1px solid #e6e8eb;text-decoration:none;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.models.vgcc-scope .tab.active{background:#009bb4;color:#fff;border-color:#009bb4}

/* Grid */
.models.vgcc-scope .models-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
@media (max-width: 991px){.models.vgcc-scope .models-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 575px){.models.vgcc-scope .models-list{grid-template-columns:repeat(1,minmax(0,1fr))}}

.models.vgcc-scope .model .inner{
  border:1px solid #ececed;
  background:#fff;
  display:flex;
  flex-direction:column;
  min-height:100%;
  transition:background-color .18s ease, box-shadow .18s ease;
}

/* Hover effect: gray background behind the vehicle (like reference hover) */
.models.vgcc-scope .model:hover .inner{
  background:#f1f2f4;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

/* Header/content */
.models.vgcc-scope .model .content{padding:34px 34px 0}
.models.vgcc-scope .model .title{margin:0 0 12px;font-size:34px;line-height:1.05;font-weight:800;text-transform:uppercase}
.models.vgcc-scope .model .title a{text-decoration:none;color:inherit}

/* Meta line */
.models.vgcc-scope .models-meta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.models.vgcc-scope .header-meta__label{display:inline-block;padding:6px 12px;border-radius:2px;background:#ff0044;color:#fff;font-weight:800;text-transform:uppercase;font-size:14px;letter-spacing:.02em}
.models.vgcc-scope .price{font-size:16px;font-weight:600;white-space:normal}
.models.vgcc-scope .price .sep{opacity:.7;margin:0 6px}

/* Image */
.models.vgcc-scope .model .image{padding:18px 20px 0;display:flex;align-items:center;justify-content:center}
.models.vgcc-scope .model .image img{max-width:100%;height:auto;display:block}

/* Button */
.models.vgcc-scope .btn-holder{margin-top:auto;padding:22px 34px 34px}
.models.vgcc-scope .btn.btn-primary-o{
  display:inline-flex;align-items:center;justify-content:center;width:100%;
  padding:16px 18px;border:2px solid #009bb4;color:#009bb4;
  text-decoration:none;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease;
}
.models.vgcc-scope .btn.btn-primary-o:hover{background:#009bb4;color:#fff}

/* AJAX loading */
.models.vgcc-scope.is-loading{pointer-events:none}
.models.vgcc-scope.is-loading .models-results{opacity:.5;transition:opacity .12s ease}

/* Pagination */
.models.vgcc-scope .models-pagination{margin:36px 0}
.models.vgcc-scope .models-pagination ul{display:flex;gap:10px;list-style:none;margin:0;padding:0;justify-content:center;flex-wrap:wrap}
.models.vgcc-scope .models-pagination li a,.models.vgcc-scope .models-pagination li span{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;border:1px solid #dfe3e8;text-decoration:none}
.models.vgcc-scope .models-pagination li span.current{background:#009bb4;color:#fff;border-color:#009bb4}

/* Empty */
.models.vgcc-scope .vgcc-empty{padding:30px;border:1px solid #ececed;background:#fff}
