/* ============================================================================
   X RENT A CAR — bolum basligi + arac karti (modern surum)
   tema.css'teki eski .akart / .bolum-basi kurallarini gunceller.
   ========================================================================= */

/* ------------------------------------------------------- BOLUM BASLIGI */
.bolum-basi { margin-bottom: 40px; text-align: center; }

.bolum-etiket {
  display: inline-flex; align-items: center; gap: 8px;
  margin-bottom: 14px;
  padding: 7px 16px;
  border-radius: 100px;
  background: rgba(255, 114, 0, .09);
  border: 1px solid rgba(255, 114, 0, .22);
  color: var(--turuncu);
  font-size: 11.5px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
}
.bolum-etiket::before {
  content: '';
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--turuncu);
}

.bolum-h,
.bolum-basi h1,
.bolum-basi h2 {
  margin: 0 0 14px;
  font-family: var(--baslikYazi);
  font-size: 40px; line-height: 1.15; font-weight: 700;
  letter-spacing: -.02em;
  color: var(--lacivert);
}

/* Baslik altindaki kisa dekoratif cizgi */
.bolum-cizgi {
  display: block;
  width: 62px; height: 3px;
  margin: 0 auto 16px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--turuncu), var(--altin));
}

.bolum-basi p {
  margin: 0 auto;
  max-width: 560px;
  font-size: 16px; line-height: 1.7;
  color: var(--soluk);
}

/* -------------------------------------------------------------- FILO */
.filo { background: linear-gradient(180deg, var(--zemin) 0%, #fff 100%); }
.filo-cta { margin-top: 42px; text-align: center; }

.kartizgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }

/* --------------------------------------------------------- ARAC KARTI */
.akart {
  display: flex; flex-direction: column;
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  transition: transform .24s cubic-bezier(.22, .61, .36, 1),
              box-shadow .24s ease, border-color .24s ease;
}
.akart:hover {
  transform: translateY(-6px);
  border-color: transparent;
  box-shadow: 0 18px 44px rgba(16, 24, 40, .15);
}

/* ---- gorsel ---- */
.akart-gorsel {
  position: relative; display: block;
  aspect-ratio: 4 / 3;
  background: #eef0ee;
  overflow: hidden;
}
.akart-gorsel img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s cubic-bezier(.22, .61, .36, 1);
}
.akart:hover .akart-gorsel img { transform: scale(1.07); }

.akart-perde {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: linear-gradient(180deg, rgba(12, 32, 42, 0) 45%, rgba(12, 32, 42, .55) 100%);
  pointer-events: none;
}

/* Kategori rozeti — cam efekti */
.akart-rozet {
  position: absolute; top: 12px; left: 12px;
  padding: 6px 13px;
  border-radius: 100px;
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--lacivert);
  font-size: 11.5px; font-weight: 700;
  letter-spacing: .03em;
  box-shadow: 0 2px 8px rgba(16, 24, 40, .12);
}

/* ---- icerik ---- */
.akart-ic { display: flex; flex-direction: column; flex: 1; padding: 18px 18px 18px; }

.akart-ic h3 { margin: 0 0 3px; font-size: 19px; line-height: 1.3; }
.akart-ic h3 a { color: var(--lacivert); text-decoration: none; transition: color .2s ease; }
.akart:hover .akart-ic h3 a { color: var(--turuncu); }
.akart-ic h3 a:hover { text-decoration: none; }

.akart-sinif {
  margin: 0 0 14px;
  font-size: 12.5px; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase;
  color: #9aa3ae;
}

/* Ozellikler — ikonlu satir */
.akart-ozellik {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0 0 16px; padding: 0; list-style: none;
}
.akart-ozellik li {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 11px;
  border-radius: 8px;
  background: #f5f4f1;
  border: 1px solid #eceae5;
  font-size: 12.5px; color: #4b5563; white-space: nowrap;
}
.akart-ozellik .glyphicon { font-size: 11px; color: var(--petrol); }

/* Fiyat + buton */
.akart-alt { margin-top: auto; padding-top: 16px; border-top: 1px solid #f0eee9; }

.akart-fiyat {
  display: block;
  margin: 0 0 14px;
  padding-top: 0;
  border-top: 0;              /* tek ayirici cizgi: sadece .akart-alt */
}
.akart-fiyat em {
  display: block; font-style: normal;
  font-size: 11.5px; font-weight: 600;
  letter-spacing: .05em; text-transform: uppercase;
  color: #9aa3ae;
  margin-bottom: 3px;
}
.akart-fiyat b {
  display: flex; align-items: baseline; gap: 5px;
  font-family: var(--baslikYazi);
  font-size: 27px; line-height: 1; font-weight: 700;
  color: var(--lacivert);
  letter-spacing: -.02em;
}
.akart-fiyat i {
  font-style: normal; font-family: var(--govdeYazi);
  font-size: 13px; font-weight: 600; color: var(--soluk);
}

/* Kart butonu */
.kartiletisim .kartara {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; padding: 13px;
  border-radius: 11px; border: 0;
  background: linear-gradient(135deg, var(--turuncu), #ff8c2b);
  color: #fff; font-weight: 700; font-size: 14.5px;
  letter-spacing: .01em; text-decoration: none;
  box-shadow: 0 4px 14px rgba(255, 114, 0, .26);
  transition: box-shadow .25s ease, transform .18s ease, filter .25s ease;
}
.kartiletisim .kartara:hover {
  color: #fff; text-decoration: none;
  filter: brightness(1.05);
  box-shadow: 0 8px 22px rgba(255, 114, 0, .38);
  transform: translateY(-1px);
}
.kartiletisim .kartara .glyphicon { font-size: 13px; }

/* --------------------------------------------------------------- MOBIL */
@media (max-width: 991px) {
  .kartizgara { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .bolum-h, .bolum-basi h1, .bolum-basi h2 { font-size: 30px; }
}

@media (max-width: 575px) {
  .kartizgara { grid-template-columns: 1fr; }
  .bolum-basi { margin-bottom: 28px; }
  .bolum-h, .bolum-basi h1, .bolum-basi h2 { font-size: 26px; }
  .bolum-basi p { font-size: 15px; }
  .akart-fiyat b { font-size: 24px; }
}

/* RTL */
[dir="rtl"] .akart-rozet { left: auto; right: 12px; }

/* ---------------------- OZELLIKLER: TEK HIZADA ---------------------- */
/* Uc ozellik (yakit / vites / kisi) her zaman tek satirda kalir. Kutucuklar
   icerige gore genisler; yalnizca sigmadiklarinda esit oranda kucululer. */
.akart-ozellik {
  display: flex;
  flex-wrap: nowrap;
  gap: 5px;
}
.akart-ozellik li {
  flex: 0 1 auto;
  justify-content: center;
  gap: 5px;
  padding: 7px 9px;
  font-size: 12px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.akart-ozellik .glyphicon { flex-shrink: 0; }

/* ------------------- VALE: MINIMAL METIN SATIRI --------------------- */
/* Gorselin uzerindeki yesil rozet yerine, icerikte ince bir onay satiri. */
.akart-vale {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: #1f8a52;
  letter-spacing: .01em;
}
.akart-vale .glyphicon {
  font-size: 13px;
  color: #23a35f;
}

/* ==================== KART: 3 PARCALI ODEME BLOGU ====================
   Solda "Hemen Ode", yaninda "Ofiste Ode", altinda depozito satiri.
   Ofis fiyati adminden 0 birakilirsa tek sutuna duser.
   ==================================================================== */
.akart-odeme {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.akart-odeme.tekli { grid-template-columns: 1fr; }

.odeme-kutu {
  padding: 10px 10px 9px;
  border-radius: 11px;
  border: 1px solid #eceae5;
  background: #faf9f6;
  text-align: center;
  min-width: 0;
}
/* "Hemen Ode" one cikan secenek */
.odeme-kutu.odeme-simdi {
  border-color: rgba(255, 114, 0, .28);
  background: rgba(255, 114, 0, .06);
}

.odeme-kutu em {
  display: block;
  font-style: normal;
  font-size: 10.5px; font-weight: 700;
  letter-spacing: .07em; text-transform: uppercase;
  color: #9aa3ae;
  margin-bottom: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.odeme-kutu.odeme-simdi em { color: var(--turuncu); }

/* Tutar tek satirda; para birimi ve gun ifadesi alt satira alinir ki
   4 sutunlu masaustu izgarada dar kutuya da sigsin. */
.odeme-kutu b {
  display: block;
  font-family: var(--baslikYazi);
  font-size: 17px; line-height: 1.15; font-weight: 700;
  color: var(--lacivert);
  letter-spacing: -.03em;
  white-space: nowrap;
}
.odeme-kutu i {
  display: block;
  font-style: normal;
  font-size: 10.5px; color: #9aa3ae;
  margin-top: 3px;
  white-space: nowrap;
}

/* Depozito satiri */
.akart-depozito {
  display: flex; align-items: center; justify-content: center;
  gap: 6px;
  margin: 0 0 14px;
  padding: 7px 10px;
  border-radius: 9px;
  background: #f5f4f1;
  font-size: 12px; color: #4b5563;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.akart-depozito .glyphicon { font-size: 11px; color: #9aa3ae; flex-shrink: 0; }
.akart-depozito strong { color: var(--lacivert); font-weight: 700; }

/* Tek sutuna dusunce (ofis fiyati girilmemisse) daha genis alan var */
.akart-odeme.tekli .odeme-kutu b { font-size: 21px; }

@media (max-width: 400px) {
  .odeme-kutu { padding: 9px 5px 8px; }
  .odeme-kutu b { font-size: 16px; }
  .odeme-kutu em { font-size: 10px; letter-spacing: .04em; }
}

/* 992-1199 arasi: kap 970px oldugundan 4 sutun cok darliyor (kart ~217px) ve
   iki odeme kutusu yan yana sigmiyor. Bu araligi 3 sutuna alalim. */
@media (min-width: 992px) and (max-width: 1199px) {
  .kartizgara { grid-template-columns: repeat(3, 1fr); }
}
