/* Mobile-first responsive styles */
:root{
  --primary: #0b5ed7;
  --muted:#6c757d;
}
*{box-sizing:border-box}
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  margin:0;
  color:#222;
  background:#f7f7fb;
  -webkit-font-smoothing:antialiased;
}
.container{padding:16px; max-width:1100px; margin:0 auto;}
header.site-header{background:white; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; box-shadow:0 1px 0 rgba(0,0,0,0.06); position:sticky; top:0; z-index:50;}
.brand{font-weight:700; font-size:18px; color:var(--primary);}
nav a{margin-left:12px; text-decoration:none; color:var(--muted); font-weight:600;}
.hero{background:white; padding:18px; border-radius:10px; margin-top:12px;}
.card{background:white; padding:12px; border-radius:8px; margin:10px 0; box-shadow:0 6px 18px rgba(11,94,215,0.04);}
.search-row{display:flex; gap:8px; flex-direction:column;}
.form-control{padding:10px; border:1px solid #e6e6ee; border-radius:8px; width:100%;}
.btn{display:inline-block; padding:10px 14px; border-radius:8px; border:0; background:var(--primary); color:white; font-weight:700; cursor:pointer;}
.vehicle-list{display:grid; gap:10px; grid-template-columns:1fr;}
.vehicle-item{display:flex; gap:10px; align-items:center;}
.vehicle-item img{width:90px; height:60px; object-fit:cover; border-radius:6px;}
.muted{color:var(--muted); font-size:13px;}

/* Larger screens */
@media(min-width:700px){
  .search-row{flex-direction:row;}
  .vehicle-list{grid-template-columns:repeat(2,1fr);}
}
@media(min-width:1000px){
  .vehicle-list{grid-template-columns:repeat(3,1fr);}
}

footer{padding:18px; text-align:center; color:var(--muted); font-size:14px; margin-top:18px;}