/* ============================================================================
   X RENT A CAR — footer (ayak) tasarimi
   Koyu gradient zemin, 4 sutunlu kurumsal duzen, yukari cik butonu.
   ========================================================================= */

.ayak {
  position: relative;
  margin-top: 0;
  padding: 0 0 22px;
  background: linear-gradient(160deg, #12303d 0%, #16394a 45%, #1d4557 100%);
  color: #cbd5da;
  overflow: hidden;
}

/* Ust kenarda ince marka vurgusu */
.ayak-cizgi {
  height: 3px;
  background: linear-gradient(90deg, var(--turuncu) 0%, var(--altin) 45%, var(--petrol) 100%);
}

/* Arkada cok hafif isik lekesi */
.ayak-desen {
  position: absolute;
  top: -180px; right: -140px;
  width: 520px; height: 520px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 255, 255, .06), transparent);
  pointer-events: none;
}

.ayak-ust {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
  gap: 40px;
  padding: 56px 0 44px;
}

.ayak-blok h3 {
  margin: 0 0 18px;
  font-family: var(--baslikYazi);
  font-size: 17px;
  color: #fff;
  position: relative;
  padding-bottom: 12px;
}
.ayak-blok h3::after {
  content: '';
  position: absolute; left: 0; bottom: 0;
  width: 34px; height: 2px;
  background: var(--turuncu);
  border-radius: 2px;
}

/* ------------------------------------------------------------ MARKA */
.ayak-logo {
  display: inline-block;
  margin-bottom: 14px;
  font-family: var(--baslikYazi);
  font-size: 26px; font-weight: 700; letter-spacing: -.02em;
  color: #fff; text-decoration: none;
}
.ayak-logo:hover, .ayak-logo:focus { color: var(--turuncu); text-decoration: none; }

.ayak-marka p {
  margin: 0 0 20px;
  font-size: 14.5px; line-height: 1.75;
  color: rgba(255, 255, 255, .62);
  max-width: 330px;
}

.ayak-sosyal { display: flex; gap: 9px; }
.ayak-sosyal a {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .14);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
  transition: background-color .22s ease, border-color .22s ease, transform .22s ease;
}
.ayak-sosyal a:hover {
  background-color: var(--turuncu);
  border-color: var(--turuncu);
  transform: translateY(-2px);
}

/* ------------------------------------------------------------ LISTELER */
.ayak-liste { margin: 0; padding: 0; list-style: none; }
.ayak-liste li { margin-bottom: 11px; }
.ayak-liste a {
  display: inline-flex; align-items: center; gap: 8px;
  color: rgba(255, 255, 255, .66);
  font-size: 14.5px;
  text-decoration: none;
  transition: color .2s ease, transform .2s ease;
}
.ayak-liste a::before {
  content: '';
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(255, 255, 255, .3);
  transition: background .2s ease, transform .2s ease;
}
.ayak-liste a:hover { color: #fff; text-decoration: none; transform: translateX(3px); }
.ayak-liste a:hover::before { background: var(--turuncu); transform: scale(1.5); }

/* ------------------------------------------------------------ ILETISIM */
.ayak-tel {
  display: inline-flex; align-items: center; gap: 12px;
  margin-bottom: 18px; padding: 12px 18px 12px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .14);
  color: #fff; text-decoration: none;
  transition: background .22s ease, border-color .22s ease, transform .18s ease;
}
.ayak-tel:hover {
  background: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .3);
  color: #fff; text-decoration: none; transform: translateY(-2px);
}
.ayak-tel-ikon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--turuncu); color: #fff; font-size: 15px;
  flex-shrink: 0;
}
.ayak-tel em {
  display: block; font-style: normal;
  font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: rgba(255, 255, 255, .6);
}
.ayak-tel b { display: block; font-size: 17.5px; letter-spacing: .01em; }

.ayak-bilgi { margin: 0; padding: 0; list-style: none; }
.ayak-bilgi li {
  display: flex; gap: 10px;
  margin-bottom: 11px;
  font-size: 14px; line-height: 1.6;
  color: rgba(255, 255, 255, .62);
}
.ayak-bilgi .glyphicon { margin-top: 3px; color: var(--turuncu); font-size: 13px; flex-shrink: 0; }
.ayak-bilgi a { color: rgba(255, 255, 255, .62); text-decoration: none; }
.ayak-bilgi a:hover { color: #fff; text-decoration: none; }

/* ------------------------------------------------- HIZMET BOLGELERI */
.ayak-bolge {
  position: relative; z-index: 2;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px;
  padding: 20px 0;
  border-top: 1px solid rgba(255, 255, 255, .10);
  border-bottom: 1px solid rgba(255, 255, 255, .10);
}
.ayak-bolge strong {
  font-size: 12.5px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  color: rgba(255, 255, 255, .5);
}
.ayak-bolge a {
  font-size: 13.5px;
  color: rgba(255, 255, 255, .62);
  text-decoration: none;
  transition: color .2s ease;
}
.ayak-bolge a:hover { color: var(--turuncu); text-decoration: none; }

/* ------------------------------------------------------------ ALT BAR */
.ayak-alt {
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px;
  padding-top: 20px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, .48);
}
.ayak-alt-sag { display: flex; align-items: center; gap: 16px; }
.ayak-alt a { color: rgba(255, 255, 255, .58); text-decoration: none; }
.ayak-alt a:hover { color: #fff; text-decoration: none; }

.ayak-yukari {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .07);
  color: #fff; font-size: 12px; cursor: pointer;
  transition: background .22s ease, border-color .22s ease, transform .22s ease;
}
.ayak-yukari:hover {
  background: var(--turuncu); border-color: var(--turuncu);
  transform: translateY(-3px);
}

/* --------------------------------------------------------------- MOBIL */
@media (max-width: 991px) {
  .ayak-ust { grid-template-columns: 1fr 1fr; gap: 32px; padding: 44px 0 34px; }
  .ayak-marka { grid-column: 1 / -1; }
  .ayak-marka p { max-width: 100%; }
}

@media (max-width: 575px) {
  .ayak-ust { grid-template-columns: 1fr; gap: 28px; }
  .ayak-bolge { flex-direction: column; align-items: flex-start; gap: 8px; }
  .ayak-alt { flex-direction: column; align-items: flex-start; }
  .ayak-alt-sag { width: 100%; justify-content: space-between; }
  .ayak-tel { width: 100%; }
}

/* RTL */
[dir="rtl"] .ayak-blok h3::after { left: auto; right: 0; }
[dir="rtl"] .ayak-desen { right: auto; left: -140px; }
[dir="rtl"] .ayak-liste a:hover { transform: translateX(-3px); }
