:root {
  --navy-950: #0b1220;
  --navy-900: #101a2e;
  --navy-800: #16213e;
  --amber-400: #fbbf24;
  --amber-500: #f59e0b;
  --slate-500: #64748b;
  --slate-100: #f1f5f9;
  --border: #e2e8f0;
  --green-600: #16a34a;
  --radius: 12px;
  --shadow: 0 1px 3px rgba(15,23,42,.08);
  --shadow-md: 0 10px 30px rgba(15,23,42,.10);
}
* { box-sizing: border-box; }
html,body { margin:0; padding:0; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #1e293b; background: #fff; line-height: 1.55;
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
h1,h2,h3 { font-weight: 800; letter-spacing: -0.02em; margin: 0 0 .4em; }
.container { max-width: 1240px; margin: 0 auto; padding: 0 24px; }

/* HEADER */
.site-header {
  background: var(--navy-950); color: #fff; position: sticky; top:0; z-index: 40;
}
.site-header .inner { display:flex; align-items:center; justify-content:space-between; height: 74px; }
.site-logo { display:flex; align-items:center; gap:10px; font-weight:800; font-size:18px; }
.site-logo .mark { width:36px;height:36px;border-radius:9px;background:linear-gradient(135deg,var(--amber-400),var(--amber-500)); display:flex;align-items:center;justify-content:center;color:var(--navy-950); font-weight:800; }
.site-nav { display:flex; gap:26px; font-size:14px; font-weight:600; }
.site-nav a:hover { color: var(--amber-400); }
.site-header .cta { display:flex; gap:10px; }

/* HERO */
.hero {
  background: radial-gradient(circle at 15% 20%, #1c2b4d, var(--navy-950) 65%);
  color:#fff; padding: 56px 0 46px;
}
.hero h1 { font-size: 34px; max-width: 640px; }
.hero p { color: #94a3b8; font-size: 15.5px; max-width: 560px; }

/* FILTER BAR */
.filter-bar-wrap {
  display: flex;
  justify-content: center;
  margin-top: -34px;
  position: relative;
  z-index: 10;
}
.filter-bar {
  background:#fff; border:1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-md); padding: 20px 24px;
  display:grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 14px; align-items:end; width: 900px; max-width: 100%;
}
.filter-bar button { padding: 11px 28px; font-size: 14.5px; }
.filter-bar .field { display:flex; flex-direction:column; gap:4px; }
.filter-bar label { font-size:11.5px; font-weight:700; color:#475569; text-transform:uppercase; letter-spacing:.03em; }
.filter-bar select, .filter-bar input {
  padding:9px 10px; border:1px solid var(--border); border-radius:8px; font-size:13.6px; font-family:inherit; width:100%;
}
.filter-bar button {
  background: var(--amber-500); color:#1e1300; border:none; border-radius:8px; padding:10px 18px; font-weight:700;
  cursor:pointer; font-size:13.6px; white-space:nowrap;
}

/* LISTING */
.section-title { display:flex; align-items:center; justify-content:space-between; margin: 40px 0 20px; }
.section-title h2 { font-size: 22px; }
.result-count { color: var(--slate-500); font-size:13.5px; }

.car-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-bottom: 50px; }
.car-card {
  border:1px solid var(--border); border-radius: var(--radius); overflow:hidden; background:#fff;
  box-shadow: var(--shadow); transition: transform .18s, box-shadow .18s;
}
.car-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.car-card .thumb { position:relative; aspect-ratio: 4/3; background:#f1f5f9; overflow:hidden; }
.car-card .thumb img { width:100%; height:100%; object-fit:cover; }
.car-card .badge-status {
  position:absolute; top:10px; left:10px; padding:4px 10px; border-radius:20px; font-size:11px; font-weight:800;
  background: var(--amber-500); color:#1e1300;
}
.car-card .badge-status.rezerve { background:#8b5cf6; color:#fff; }
.car-card .badge-status.satildi { background:#334155; color:#fff; }
.car-card .body { padding:16px; }
.car-card h3 { font-size:16.5px; margin-bottom:2px; }
.car-card .sub { color:var(--slate-500); font-size:12.5px; margin-bottom:10px; }
.car-card .specs { display:flex; gap:12px; font-size:12px; color:#475569; margin-bottom:12px; flex-wrap:wrap; }
.car-card .specs span { display:flex; align-items:center; gap:4px; }
.car-card .price { font-size:19px; font-weight:800; color: var(--navy-900); }

.empty-state { text-align:center; padding: 60px 20px; color: var(--slate-500); }

/* DETAIL PAGE */
.gallery-main { border-radius: var(--radius); overflow:hidden; aspect-ratio: 16/10; max-height:440px; width:100%; background:#0b1220; margin-bottom:10px; display:flex; align-items:center; justify-content:center; }
.gallery-main img, .gallery-main video { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block; }
.gallery-main img { cursor:zoom-in; }
/* Lightbox: görsele tıklayınca büyük gösterim */
.lightbox { position:fixed; inset:0; background:rgba(2,6,23,.92); z-index:9999; display:none; align-items:center; justify-content:center; padding:24px; }
.lightbox.open { display:flex; }
.lightbox img { max-width:95vw; max-height:90vh; object-fit:contain; border-radius:8px; box-shadow:0 10px 40px rgba(0,0,0,.5); }
.lightbox .lb-close { position:absolute; top:16px; right:22px; color:#fff; font-size:38px; line-height:1; cursor:pointer; background:none; border:0; }
.lightbox .lb-nav { position:absolute; top:50%; transform:translateY(-50%); color:#fff; font-size:44px; background:rgba(255,255,255,.12); border:0; width:48px; height:64px; border-radius:10px; cursor:pointer; }
.lightbox .lb-prev { left:16px; } .lightbox .lb-next { right:16px; }
.gallery-thumbs { display:flex; gap:8px; overflow-x:auto; padding-bottom:6px; }
.gallery-thumbs img, .gallery-thumbs video { width:88px; height:64px; object-fit:cover; border-radius:8px; cursor:pointer; border:2px solid transparent; flex-shrink:0; }
.gallery-thumbs .active { border-color: var(--amber-500); }

.detail-grid { display:grid; grid-template-columns: 2fr 1fr; gap: 34px; margin-top: 26px; }
.spec-table { width:100%; border-collapse:collapse; font-size:13.8px; }
.spec-table td { padding:10px 0; border-bottom:1px solid #f1f5f9; }
.spec-table td:first-child { color: var(--slate-500); width:45%; }
.spec-table td:last-child { font-weight:700; }

.sticky-box { position: sticky; top: 96px; border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-md); padding:22px; }
.sticky-box .price { font-size:26px; font-weight:800; margin-bottom:4px; }
.sticky-box .plate { color:var(--slate-500); font-size:13px; margin-bottom:18px; }
.btn-block { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:13px; border-radius:9px; font-weight:700; font-size:14.5px; border:none; cursor:pointer; margin-bottom:10px; }
.btn-whatsapp { background:#25D366; color:#fff; }
.btn-call { background: var(--navy-900); color:#fff; }

.credit-calc { margin-top:18px; padding-top:18px; border-top:1px solid var(--border); }
.credit-calc label { font-size:12px; font-weight:700; color:#475569; display:block; margin-bottom:4px; }
.credit-calc input, .credit-calc select { width:100%; padding:8px 10px; border:1px solid var(--border); border-radius:7px; margin-bottom:10px; font-family:inherit; }
.credit-result { background:var(--slate-100); border-radius:8px; padding:12px; font-size:13.5px; }
.credit-result b { font-size: 17px; }

.map-embed { border-radius: var(--radius); overflow:hidden; border:1px solid var(--border); margin-top: 18px; height: 260px; }
.map-embed iframe { width:100%; height:100%; border:0; }

.similar-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 40px; }

footer.site-footer { background: var(--navy-950); color:#94a3b8; margin-top: 60px; padding: 40px 0; font-size:13.5px; }
footer.site-footer a { color:#fff; }

.equip-list { columns: 2; column-gap: 24px; font-size: 13.8px; }
.equip-list li { margin-bottom: 6px; break-inside: avoid; }

@media (max-width: 980px) {
  .car-grid, .similar-grid { grid-template-columns: repeat(2,1fr); }
  .filter-bar { grid-template-columns: repeat(2,1fr); }
  .detail-grid { grid-template-columns: 1fr; }
  .sticky-box { position: static; }
}
@media (max-width: 640px) {
  .car-grid, .similar-grid { grid-template-columns: 1fr; }
  .site-nav { display:none; }
}

/* Sayfalama (pagination) kontrolleri */
.page-link {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; height: 38px; padding: 0 12px; border-radius: 8px;
  border: 1px solid var(--border, #e2e8f0); background: #fff; color: var(--slate-700, #334155);
  font-weight: 700; font-size: 13.5px; text-decoration: none;
}
.page-link:hover { background: #f8fafc; }
.page-link.active { background: var(--amber-500, #f59e0b); color: #1e1300; border-color: var(--amber-500, #f59e0b); }
