/* =====================================================================
   Turunç Rent a Car - modern arayüz katmanı
   arackiralama.css'in üzerine biner; yapı korunur, görünüm yenilenir.
   Renk değişkenleri panelden (Genel Ayarlar > Tema Renk) beslenir.
   ===================================================================== */

:root {
  --marka:        #e3722e;
  --marka-koyu:   #c25c1d;
  --marka-acik:   #fff4ec;
  --metin:        #373737;
  --metin-soft:   #6b7280;
  --yazi-acik:    #9ca3af;
  --cizgi:        rgba(17, 24, 39, .10);
  --cizgi-soft:   rgba(17, 24, 39, .06);
  --zemin:        #ffffff;
  --zemin-alt:    #f7f8fa;
  --basari:       #157f3d;
  --hata:         #b3261e;
  --golge-sm:     0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .10);
  --golge-md:     0 4px 12px rgba(16, 24, 40, .08);
  --golge-lg:     0 12px 32px rgba(16, 24, 40, .12);
  --yuvarlak:     14px;
  --yuvarlak-sm:  10px;
  --gecis:        .22s cubic-bezier(.4, 0, .2, 1);
}

/* ---------- Temel ---------- */
* { box-sizing: border-box; }

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  line-height: 1.6;
}

img { max-width: 100%; height: auto; }

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--marka);
  outline: 3px solid color-mix(in srgb, var(--marka) 55%, white);
  outline-offset: 2px;
  border-radius: 6px;
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 10000;
  background: var(--marka);
  color: #fff;
  padding: 12px 18px;
  border-radius: 0 0 var(--yuvarlak-sm) 0;
  font-weight: 700;
}
.skip-link:focus { left: 0; }

.gorsel-gizli {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Tipografi ---------- */
h1, h2, h3, h4 {
  font-family: 'Exo 2', 'Dosis', sans-serif;
  line-height: 1.25;
  letter-spacing: -.01em;
  color: var(--metin);
}
h1 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); }
h2 { font-size: clamp(1.3rem, 1.05rem + 1vw, 1.7rem); }
h3 { font-size: clamp(1.05rem, .95rem + .5vw, 1.25rem); }

.blok-aciklama,
.iletisim-giris,
.sayfa-giris p {
  color: var(--metin-soft);
  font-size: 1.02rem;
  max-width: 68ch;
  margin: 0 0 18px;
}

/* ---------- Üst alan ---------- */
.header { position: relative; z-index: 20; }

.headinfo-link { display: inline-block; }
.headinfo .email { transition: transform var(--gecis); }
.headinfo-link:hover .email { transform: translateY(-2px); }

.site-dil-secici {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 10px;
  padding: 3px 8px;
  border: 1px solid var(--cizgi);
  border-radius: 999px;
  background: #fff;
  vertical-align: middle;
}
.site-dil-secici .dil-btn {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  padding: 3px 7px;
  border-radius: 999px;
  color: var(--metin-soft);
}
.site-dil-secici .dil-btn.tr-active {
  background: var(--marka);
  color: #fff;
}
.site-dil-secici .dil-ayrac { color: var(--yazi-acik); font-size: 11px; }

/* ---------- Menü ---------- */
.menu ul > li > a,
.menu ul > li > .menu-baslik {
  border-radius: var(--yuvarlak-sm);
  transition: background var(--gecis), color var(--gecis);
}
.menu ul > li > a[aria-current="page"] {
  color: var(--marka);
  font-weight: 700;
}
.menu .menu-baslik { display: block; cursor: default; }

button.menuAc {
  font: inherit;
  border: 0;
  cursor: pointer;
  letter-spacing: .06em;
}

/* ---------- Breadcrumb ---------- */
.breadcrumb {
  font-size: .85rem;
  color: var(--metin-soft);
  padding: 14px 0 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.breadcrumb a { color: var(--metin-soft); }
.breadcrumb a:hover { color: var(--marka); }
.breadcrumb [aria-current="page"] { color: var(--metin); font-weight: 600; }

/* ---------- Hero / slogan ---------- */
.slogan { padding: 34px 0; }
.slogan h1 {
  margin: 0 0 8px;
  color: inherit;
}
.slogan .slogan-alt {
  margin: 0 0 16px;
  opacity: .92;
  font-size: 1.05rem;
  max-width: 62ch;
}
.sloganbtn {
  display: inline-block;
  padding: 12px 24px;
  border-radius: 999px;
  font-weight: 700;
  box-shadow: var(--golge-md);
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.sloganbtn:hover { transform: translateY(-2px); box-shadow: var(--golge-lg); }

/* ---------- Kart / blok ---------- */
.rezervasyon,
.haberduyuru,
.onecikanarac,
.bigpage,
.sss,
.ekstralar,
.kisiselbilgiler,
.kosullar,
.iletisiminfo,
.pagecontent {
  background: var(--zemin);
  border: 1px solid var(--cizgi-soft);
  border-radius: var(--yuvarlak);
  box-shadow: var(--golge-sm);
  padding: 22px;
  margin-bottom: 26px;
}

.blokbaslik { margin-bottom: 6px; }
.blokbaslik h2,
.blokbaslik h3 { margin: 0 0 6px; display: flex; align-items: center; gap: 10px; }
.blokbaslik i { color: var(--marka); }

.titleline {
  height: 3px;
  width: 64px;
  border-radius: 3px;
  background: var(--marka);
  background: linear-gradient(90deg, var(--marka), color-mix(in srgb, var(--marka) 25%, white));
  margin-bottom: 14px;
}

.carouselarrow {
  width: 34px; height: 34px;
  display: inline-flex;
  align-items: center; justify-content: center;
  border: 1px solid var(--cizgi);
  border-radius: 50%;
  color: var(--metin-soft);
  margin-left: 6px;
  transition: all var(--gecis);
}
.carouselarrow:hover { background: var(--marka); border-color: var(--marka); color: #fff; }

/* ---------- Form alanları ---------- */
input, select, textarea {
  border-radius: var(--yuvarlak-sm) !important;
  border: 1px solid var(--cizgi) !important;
  background: #fff !important;
  font-size: 16px;
  min-height: 46px;
  transition: border-color var(--gecis), box-shadow var(--gecis);
}
textarea { min-height: 110px; }
input:focus, select:focus, textarea:focus {
  border-color: var(--marka) !important;
  box-shadow: 0 0 0 3px rgba(227, 114, 46, .18) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--marka) 18%, transparent) !important;
}
input[type="checkbox"], input[type="radio"] {
  min-height: 0;
  width: auto !important;
  accent-color: var(--marka);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px 20px;
  margin: 8px 0 4px;
}
.form-alan { margin: 0; }
.form-alan-tam { grid-column: 1 / -1; }
.form-alan label,
.form-alan .form-etiket {
  display: block;
  font-size: .86rem;
  font-weight: 700;
  color: var(--metin);
  margin-bottom: 6px;
  letter-spacing: .01em;
}
.form-alan input,
.form-alan textarea,
.form-alan select { width: 100%; }
.zorunlu { color: var(--hata); font-weight: 700; }

.radyo-grup { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.radyo-grup label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 500;
  margin: 0;
  padding: 9px 14px;
  border: 1px solid var(--cizgi);
  border-radius: 999px;
  cursor: pointer;
  transition: all var(--gecis);
}
.radyo-grup label:hover { border-color: var(--marka); background: var(--marka-acik); }

.form-gonder {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 14px;
}

/* ---------- Alış / dönüş blokları ---------- */
.rezersid { padding: 4px 0; }
.rezersid-baslik {
  font-size: .95rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--marka);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--cizgi-soft);
}
.rezersid select,
.rezersid input[type="text"],
.rezersid input[type="tel"] { width: 100%; margin-bottom: 10px; }
.rezersid label:not(.gorsel-gizli) {
  display: block;
  font-size: .84rem;
  font-weight: 700;
  margin: 8px 0 5px;
}

.rezer-saat { display: flex; gap: 10px; }
.rezer-saat select { width: 50%; margin-bottom: 0; }
.inputsaat, .inputdk { float: none !important; width: 100% !important; margin-right: 0 !important; }

/* ---------- Butonlar ---------- */
.rezerbtn, .rezbtn, .gonderbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-weight: 700;
  border-radius: 999px;
  padding: 13px 26px;
  transition: transform var(--gecis), box-shadow var(--gecis), background var(--gecis);
  box-shadow: var(--golge-sm);
  text-align: center;
}
.rezerbtn:hover, .rezbtn:hover, .gonderbtn:hover {
  transform: translateY(-2px);
  box-shadow: var(--golge-md);
}
.rezerbtn.disabled, .rezerbtn:disabled { opacity: .6; pointer-events: none; transform: none; }

.rezer-sonuc { margin-top: 12px; text-align: right; font-size: 1rem; }
.rezer-sonuc .hata, .hata { color: var(--hata); font-weight: 600; }
.rezer-sonuc .okey, .okey { color: var(--basari); font-weight: 600; }
.rezer-sonuc .bilgi, .bilgi { color: var(--marka); font-weight: 600; }

/* ---------- Araç kartı ---------- */
.arac {
  border: 1px solid var(--cizgi-soft);
  border-radius: var(--yuvarlak);
  box-shadow: var(--golge-sm);
  overflow: hidden;
  transition: box-shadow var(--gecis), transform var(--gecis);
  background: #fff;
  margin-bottom: 26px;
}
.arac:hover { box-shadow: var(--golge-lg); transform: translateY(-3px); }
.arac-detay:hover { transform: none; }

.aracfoto h1, .aracfoto h2 {
  margin: 0 0 10px;
  font-size: 1.15rem;
}
.aracfoto h1 strong, .aracfoto h2 strong { color: var(--marka); }
.aracfoto img { border-radius: var(--yuvarlak-sm); }

ul.ozellikler {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 14px 0;
}
ul.ozellikler li {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 78px;
  padding: 10px 12px;
  border: 1px solid var(--cizgi-soft);
  border-radius: var(--yuvarlak-sm);
  background: var(--zemin-alt);
  font-size: .82rem;
  text-align: center;
}
ul.ozellikler li i { font-size: 18px; color: var(--marka); }

.arac-mini-ozellik {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 6px 0 10px;
  margin: 0;
  font-size: .8rem;
  color: var(--metin-soft);
  justify-content: center;
}
.arac-mini-ozellik i { color: var(--marka); }
.arac-fiyat { margin: 4px 0 8px; font-size: 1.05rem; }
.arac-fiyat strong { color: var(--marka); font-size: 1.25rem; }

/* ---------- Fiyat tablosu ---------- */
.fiyat-tablosu {
  width: 100%;
  border-collapse: collapse;
  font-size: .92rem;
  margin-bottom: 10px;
}
.fiyat-tablosu thead th {
  background: var(--metin);
  color: #fff;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 9px 10px;
  text-align: center;
}
.fiyat-tablosu thead th:first-child { text-align: left; border-radius: var(--yuvarlak-sm) 0 0 0; }
.fiyat-tablosu thead th:last-child { border-radius: 0 var(--yuvarlak-sm) 0 0; }
.fiyat-tablosu tbody th {
  text-align: left;
  font-weight: 600;
  color: var(--metin-soft);
  padding: 9px 10px;
}
.fiyat-tablosu tbody td { text-align: center; padding: 9px 10px; }
.fiyat-tablosu tbody tr:nth-child(odd) { background: var(--zemin-alt); }
.fiyat-tablosu tbody tr:hover { background: var(--marka-acik); }
.fiyat-tablosu tbody td strong { color: var(--metin); }
.fiyat-notu {
  font-size: .82rem;
  color: var(--metin-soft);
  margin: 0 0 12px;
  padding-left: 10px;
  border-left: 3px solid var(--marka);
}

.ekstra-tablo { width: 100%; border-collapse: collapse; font-size: .95rem; }
.ekstra-tablo th,
.ekstra-tablo td { padding: 12px 10px; border-bottom: 1px solid var(--cizgi-soft); text-align: left; }
.ekstra-tablo th { font-weight: 700; }
.ekstra-tablo label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }

/* ---------- Kiralama koşulları ---------- */
.aylik-uyari {
  background: #fff8ed;
  border: 1px solid #ffe2bd;
  border-left: 4px solid var(--marka);
  border-radius: var(--yuvarlak-sm);
  padding: 14px 16px;
  font-size: .92rem;
  color: #7a4a12;
  margin-bottom: 16px;
}
.kosullar-baslik { font-size: 1.05rem; margin: 0 0 10px; }
.kosul-liste { margin: 0; padding-left: 20px; color: var(--metin-soft); font-size: .92rem; }
.kosul-liste li { margin-bottom: 7px; }

.sozlesme-onay {
  background: var(--marka-acik);
  border: 1px solid #fce3ca;
  border-radius: var(--yuvarlak-sm);
  padding: 15px;
  margin: 18px 0;
}
.sozlesme-onay label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; margin: 0; }
.sozlesme-onay input { margin-top: 3px; flex: 0 0 auto; }
.sozlesme-onay a { color: var(--marka-koyu); font-weight: 700; text-decoration: underline; }

/* ---------- Tanıtım blokları ---------- */
.tanitim { padding: 34px 0; }
.tanitim-baslik { text-align: center; margin: 0 0 24px; }
.tanblok {
  background: #fff;
  border: 1px solid var(--cizgi-soft);
  border-radius: var(--yuvarlak);
  box-shadow: var(--golge-sm);
  padding: 24px 20px;
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.tanblok:hover { transform: translateY(-4px); box-shadow: var(--golge-md); }
.tanblok i { font-size: 38px; color: var(--marka); display: block; margin-bottom: 12px; }
.tanblok h2, .tanblok h3 { font-size: 1.08rem; margin: 0 0 8px; }
.tanblok p { color: var(--metin-soft); font-size: .93rem; margin: 0; }

/* ---------- SSS ---------- */
.sss-liste { display: grid; gap: 10px; }
.sss-oge {
  border: 1px solid var(--cizgi-soft);
  border-radius: var(--yuvarlak-sm);
  background: var(--zemin-alt);
  overflow: hidden;
}
.sss-oge summary {
  cursor: pointer;
  padding: 15px 18px;
  font-weight: 700;
  font-size: .98rem;
  list-style: none;
  position: relative;
  padding-right: 46px;
}
.sss-oge summary::-webkit-details-marker { display: none; }
.sss-oge summary::after {
  content: '+';
  position: absolute;
  right: 18px; top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  line-height: 1;
  color: var(--marka);
  font-weight: 400;
}
.sss-oge[open] summary::after { content: '\2013'; }
.sss-oge[open] summary { background: #fff; }
.sss-cevap {
  padding: 0 18px 16px;
  color: var(--metin-soft);
  font-size: .94rem;
  background: #fff;
}

/* ---------- İletişim ---------- */
.iletisim-kolon { float: left; width: 48%; }
.iletisim-kolon + .iletisim-kolon { float: right; }
.iletisim-kolon h2 { font-size: 1.1rem; margin: 0 0 14px; }
.iletisim-liste { list-style: none; margin: 0; padding: 0; }
.iletisim-liste li {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 0;
  border-bottom: 1px solid var(--cizgi-soft);
}
.il-etiket {
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--yazi-acik);
  font-weight: 700;
}
.harita {
  clear: both;
  margin-top: 26px;
  border-radius: var(--yuvarlak);
  overflow: hidden;
  border: 1px solid var(--cizgi-soft);
}
.harita iframe { display: block; }

/* ---------- Galeri ---------- */
.sayfa-galerisi {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
}
.sayfa-galerisi a {
  display: block;
  border-radius: var(--yuvarlak-sm);
  overflow: hidden;
  box-shadow: var(--golge-sm);
}
.sayfa-galerisi img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform .4s var(--gecis);
}
.sayfa-galerisi a:hover img { transform: scale(1.06); }

/* ---------- Sayfa içeriği ---------- */
.sayfa-icerik { color: var(--metin); font-size: 1.02rem; }
.sayfa-icerik h2, .sayfa-icerik h3 { margin-top: 26px; }
.sayfa-icerik p { margin: 0 0 14px; }
.sayfa-icerik img { border-radius: var(--yuvarlak-sm); }
.sayfa-icerik ul, .sayfa-icerik ol { padding-left: 22px; margin-bottom: 14px; }
.sayfa-icerik table { width: 100%; border-collapse: collapse; margin-bottom: 16px; }
.sayfa-icerik th, .sayfa-icerik td { border: 1px solid var(--cizgi-soft); padding: 9px 11px; }
.sayfa-icerik a { color: var(--marka-koyu); text-decoration: underline; }

.arac-aciklama { margin: 8px 0 22px; }
.arac-aciklama h2 { font-size: 1.15rem; }
.arac-aciklama-metin { color: var(--metin-soft); }

.uyari-bos {
  padding: 26px;
  text-align: center;
  color: var(--metin-soft);
  background: var(--zemin-alt);
  border-radius: var(--yuvarlak-sm);
}
.hata-sayfa { text-align: center; padding: 50px 22px; }
.hata-sayfa h1 { margin-bottom: 10px; }
.hata-sayfa .rezerbtn, .hata-sayfa .rezbtn { margin: 8px 6px; }

/* ---------- Sayfalama ---------- */
.sayfalama { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; padding: 8px 0 26px; }
.sayfalama span { display: inline-block; }
.sayfalama span a {
  display: inline-block;
  min-width: 40px;
  text-align: center;
  padding: 9px 13px;
  border: 1px solid var(--cizgi);
  border-radius: var(--yuvarlak-sm);
  color: var(--metin-soft);
  font-weight: 600;
  transition: all var(--gecis);
}
.sayfalama span a:hover { border-color: var(--marka); color: var(--marka); }
.sayfalama span.sayfalama-active a { background: var(--marka); border-color: var(--marka); color: #fff; }

/* ---------- Footer ---------- */
.footer h3 {
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0 0 14px;
  color: inherit;
}
.foot-links { list-style: none; margin: 0; padding: 0; }
.foot-links li { margin-bottom: 9px; }
.foot-links a { display: inline-flex; align-items: flex-start; gap: 8px; transition: color var(--gecis); }
.foot-links a:hover { color: var(--marka); }
.foot-iletisim i { color: var(--marka); margin-top: 3px; }
.foot-saat { font-size: .88rem; opacity: .85; margin-top: 12px; }
.copyright { display: block; padding-top: 18px; font-size: .84rem; opacity: .8; }

/* ---------- Sabit butonlar ---------- */
.floating-btn {
  position: fixed;
  bottom: 20px;
  padding: 12px 20px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  font-size: 15px;
  box-shadow: var(--golge-lg);
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff !important;
  transition: transform var(--gecis);
}
.floating-btn:hover { transform: scale(1.04); }
.floating-btn svg { width: 20px; height: 20px; fill: currentColor; flex: 0 0 auto; }
.btn-whatsapp { left: 20px; background-color: #16be45; }
.btn-call { right: 20px; background-color: #1f6feb; display: none; }

@media screen and (max-width: 1000px) {
  .btn-call { display: flex; }
}

/* ---------- Mobil ---------- */
@media (max-width: 860px) {
  .iletisim-kolon { float: none; width: 100%; }
  .iletisim-kolon + .iletisim-kolon { float: none; margin-top: 26px; }
  .rezersid, .rezersid-sag { float: none !important; width: 100% !important; border: none !important; }
  .rezersid-sag { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--cizgi-soft) !important; }
  .rezervasyon, .haberduyuru, .onecikanarac, .bigpage, .sss,
  .ekstralar, .kisiselbilgiler, .kosullar, .iletisiminfo, .pagecontent { padding: 16px; }
  .fiyat-tablosu { font-size: .85rem; }
  .fiyat-tablosu thead th, .fiyat-tablosu tbody th, .fiyat-tablosu tbody td { padding: 7px 6px; }
  /* Mobilde metin gizlenip yalnizca ikon kaliyordu; sonuc 52x42px'lik
     cok kucuk bir dokunma hedefiydi. Artik 54x54px yuvarlak buton:
     erisilebilirlik icin onerilen 44px esiginin uzerinde. */
  .floating-btn {
    width: 54px;
    height: 54px;
    padding: 0;
    justify-content: center;
    border-radius: 50%;
  }
  .floating-btn span { display: none; }
  .floating-btn svg { width: 26px; height: 26px; }
  .site-dil-secici { margin-left: 0; margin-top: 8px; }
  ul.ozellikler li { min-width: 70px; padding: 8px; font-size: .76rem; }
  .form-gonder { justify-content: stretch; }
  .form-gonder .gonderbtn { width: 100%; }
}

@media (max-width: 520px) {
  .slogan { padding: 22px 0; }
  .sayfa-galerisi { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
  .radyo-grup label { width: 100%; }
}

/* ---------- Yazdırma ---------- */
@media print {
  .header, .footer, .floating-btn, #slider, .breadcrumb, .sayfalama, form { display: none !important; }
  .arac, .bigpage { box-shadow: none; border: 1px solid #ddd; }
}

/* ---------- Hareket azaltma ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* =====================================================================
   Hafif lightbox (prettyPhoto yerine)
   ===================================================================== */
.lb-katman {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: rgba(10, 12, 16, .92);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.lb-katman.acik { display: flex; }
body.lb-kilit { overflow: hidden; }

.lb-icerik {
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lb-gorsel {
  max-width: min(94vw, 1400px);
  max-height: 86vh;
  width: auto;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
  background: #111;
}

.lb-btn {
  position: absolute;
  border: 0;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  transition: background var(--gecis), transform var(--gecis);
}
.lb-btn:hover { background: rgba(255, 255, 255, .24); transform: scale(1.06); }
.lb-kapat   { top: 18px; right: 18px; font-size: 30px; }
.lb-onceki  { left: 18px;  top: 50%; transform: translateY(-50%); }
.lb-sonraki { right: 18px; top: 50%; transform: translateY(-50%); }
.lb-onceki:hover  { transform: translateY(-50%) scale(1.06); }
.lb-sonraki:hover { transform: translateY(-50%) scale(1.06); }

.lb-sayac {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, .8);
  font-size: 13px;
  letter-spacing: .06em;
  background: rgba(0, 0, 0, .35);
  padding: 6px 14px;
  border-radius: 999px;
}

@media (max-width: 640px) {
  .lb-katman { padding: 10px; }
  .lb-btn { width: 42px; height: 42px; font-size: 22px; }
  .lb-kapat { top: 10px; right: 10px; }
  .lb-onceki { left: 8px; }
  .lb-sonraki { right: 8px; }
  .lb-gorsel { max-height: 78vh; }
}

/* =====================================================================
   DUZEN DUZELTMELERI
   Eski tema CSS'i float tabanlidir ve belirli bir HTML yapisina
   baglidir. Yeni anlamsal yapi (main/section/nav/ul) icin duzenler
   burada grid ve flex ile yeniden tanimlanir.
   ===================================================================== */

/* ---------- Ust alan ---------- */
.header .head { display: flow-root; }
.header .head #wrapper { display: flex; align-items: flex-start; flex-wrap: wrap; }
.headsocial { display: flex; align-items: center; gap: 6px; }
.headsocial a { float: none !important; }
.headinfo { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.headinfo .email { float: none !important; margin-left: 28px; }
.headinfo-link { text-decoration: none; }

/* Menu: nav sarmalayici eklendi, ul yine saga yerlesir */
.menu #wrapper { display: flow-root; }
.menu nav { float: right; }
.menu nav ul { float: none; display: flex; flex-wrap: wrap; justify-content: flex-end; }
.menu li a,
.menu li .menu-baslik { float: none !important; display: block; }
.menu li .menu-baslik {
  color: var(--metin);
  padding: 0 35px;
  line-height: 65px;
  font-weight: 700;
  font-size: 18px;
  opacity: .75;
}
button.menuAc { background: transparent; border: 0; }

/* ---------- Slogan / hero ---------- */
.slogan {
  height: auto !important;
  padding: 26px 0;
  float: none !important;
  display: block;
  color: #fff;
}
.slogan #wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 26px;
}
.slogan h1,
.slogan h2 {
  line-height: 1.25 !important;
  float: none !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(1.35rem, 1.1rem + 1.1vw, 1.9rem);
  flex: 1 1 380px;
}
.slogan .slogan-alt {
  flex: 1 1 100%;
  order: 3;
  color: rgba(255, 255, 255, .82);
  font-size: .98rem;
  margin: 0;
  max-width: 78ch;
}
.slogan .sloganbtn { float: none !important; flex: 0 0 auto; }

/* ---------- Anasayfa: rezervasyon + haberler ---------- */
main#icerik > #wrapper { display: flow-root; }
.rezervasyon,
.haberduyuru { box-sizing: border-box; }
.rezervasyon .blokbaslik,
.haberduyuru .blokbaslik { border-bottom: 0 !important; margin-bottom: 4px; }

/* Alis / donus kolonlari */
.rezervasyon .rezersid { width: 48% !important; margin-top: 0; }
.rezersid-sag { float: right !important; border-right: 0 !important; }
.rezersid select,
.rezersid input[type="text"],
.rezersid input[type="tel"] {
  width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}
.rezer-saat { display: flex; gap: 10px; }
.rezer-saat select { width: auto !important; flex: 1 1 0; min-width: 0; margin-bottom: 0 !important; }
.rezerbtn { float: none !important; display: flex; width: 100%; }

/* ---------- Haber / one cikan arac karuselleri ---------- */
.haberduyuru .list_carousel ul,
.onecikanarac .list_carousel ul { margin: 0; padding: 0; list-style: none; }
.haberduyuru .list_carousel li { display: flex; gap: 12px; align-items: flex-start; }
.haberduyuru .list_carousel li img { border-radius: 8px; flex: 0 0 auto; }
.haberduyuru .list_carousel li h3 { font-size: .98rem; margin: 0 0 5px; }
.haberduyuru .list_carousel li p { font-size: .86rem; color: var(--metin-soft); margin: 0; }
.onecikanarac .list_carousel li { text-align: center; }
.onecikanarac .list_carousel li img { border-radius: 10px; }
.onecikanarac .list_carousel li h3 { font-size: 1rem; margin: 10px 0 2px; }

/* ---------- Tanitim bloklari ---------- */
.tanitim #wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 22px;
  align-items: start;
  padding-top: 34px;
}
.tanitim .tanitim-baslik {
  grid-column: 1 / -1;
  text-align: center;
  color: var(--metin);
  margin: 0;
}
.tanblok {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
.tanblok h2, .tanblok h3, .tanblok a h1 { font-size: 1.08rem; margin: 0 0 8px; font-weight: 600; }
.tanblok i { font-size: 52px !important; margin-bottom: 14px !important; }

/* ---------- SSS ---------- */
.sss { float: none; clear: both; }

/* ---------- Arac karti (liste + detay) ---------- */
.arac {
  display: grid;
  grid-template-columns: minmax(260px, 34%) minmax(180px, 24%) minmax(260px, 1fr);
  gap: 22px;
  align-items: start;
  float: none !important;
  width: auto !important;
  text-align: left !important;
  margin: 0 0 24px !important;
}
.aracfoto,
ul.ozellikler,
.rezerinfo {
  float: none !important;
  width: auto !important;
  margin-top: 0 !important;
  text-align: left !important;
}
.aracfoto img { width: 100%; height: auto; aspect-ratio: 35 / 20; object-fit: cover; }
.rezerinfo .rezbtn { float: none !important; width: 100%; margin-top: 12px; }

/* ---------- Ic sayfa kapsayicisi ---------- */
.bigpage { overflow: visible; }
.sayfa-giris { margin-bottom: 20px; }
.sayfa-giris h1 { margin: 0 0 8px; }

/* ---------- Rezervasyon sayfasi ---------- */
.rezervasyonpage { padding: 0 !important; }
.rezervasyonpage .rezervasyon,
.rezervasyonpage .ekstralar,
.rezervasyonpage .kisiselbilgiler,
.rezervasyonpage .kosullar {
  float: none !important;
  width: 100% !important;
  margin-top: 0 !important;
}
.rezervasyonpage .rezervasyon .rezersid { width: 48% !important; }
.ekstra-tablo tr td { line-height: normal !important; }

/* ---------- Iletisim ---------- */
.iletisiminfo { float: none; width: auto; }
.iletisiminfo #contact_form { display: flow-root; }

/* ---------- Galeri ---------- */
.sayfa-galerisi { float: none !important; width: auto !important; }

/* ---------- Markalar ---------- */
.markalar { height: auto !important; padding: 18px 0; }
.markalar .marka-seridi ul,
.markalar .list_carousel ul { margin: 0; padding: 0; list-style: none; }
.markalar img { margin: 14px !important; max-height: 60px; width: auto; }

/* ---------- Footer ---------- */
.footer { height: auto !important; padding-bottom: 20px; }
.footer #wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px 32px;
  padding-top: 34px;
}
.footblok {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
.footer h3 {
  color: #d9d9d9 !important;
  padding-bottom: 12px;
  border-bottom: 1px solid #353535;
}
.footer .copyright { grid-column: 1 / -1; border-top: 1px solid #353535; margin-top: 12px; }
.foot-links a { color: #bcbcbc; }
.foot-iletisim strong { font-weight: 700; }

/* ---------- Mobil duzeltmeler ---------- */
@media (max-width: 1024px) {
  .header .head #wrapper { flex-direction: column; align-items: center; }
  .headinfo { margin-left: 0; flex-direction: column; gap: 4px; }
  .headinfo .email { margin-left: 0 !important; }
  .menu nav { float: none; }
  .menu nav ul { display: none; flex-direction: column; }
  .menu nav ul li,
  .menu nav ul li a { width: 100%; text-align: left; }
  .menu li a, .menu li .menu-baslik { line-height: 2.6; padding: 0 12px; }
  button.menuAc { display: block; width: 100%; text-align: left; }
  .arac { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .rezervasyon,
  .haberduyuru { float: none !important; width: 100% !important; margin-top: 20px !important; }
  .rezervasyon .rezersid,
  .rezervasyonpage .rezervasyon .rezersid { width: 100% !important; }
  .slogan #wrapper { flex-direction: column; align-items: flex-start; }
  .slogan .sloganbtn { width: 100%; }

  /* MOBILDE GRI SLOGAN ALANINDAKI DEVASA BOSLUGUN SEBEBI:
     Masaustunde "flex: 1 1 380px" ve "flex: 1 1 100%" yatay eksende
     genislik tabani olarak calisiyor. Yukaridaki satirda yon "column"
     olunca flex-basis artik YUKSEKLIK tabani haline geliyor; tek satirlik
     baslik 380px, alt metin de %100 yer kapliyordu. Olculen sonuc:
     390px ekranda h1 yuksekligi 380px, bolumun tamami 588px ve bunun
     ~102px'i tamamen bos. Dikey eksende taban yuksekligi sifirlaniyor. */
  .slogan h1,
  .slogan h2,
  .slogan .slogan-alt { flex: 0 0 auto !important; width: 100%; }

  /* Icerik yukseklige gore yayilmasin, ustten alta sirali dursun */
  .slogan #wrapper { justify-content: flex-start; gap: 12px; }
}

/* ---------- Ince ayarlar ---------- */
/* Eski tema .bigpage'i slider uzerine bindiriyordu; artik ustunde
   breadcrumb ve sayfa girisi var, bindirme metni kesiyordu. */
.bigpage { margin-top: 0 !important; }
main#icerik > #wrapper > .breadcrumb:first-child { padding-top: 18px; }

/* Rezervasyon butonlari marka rengine hizalandi */
.rezbtn {
  background-color: var(--marka) !important;
  color: #fff !important;
}
.rezbtn:hover { background-color: var(--marka-koyu) !important; }
.rezerbtn { background-color: var(--basari) !important; color: #fff !important; }
.rezerbtn:hover { background-color: #0f6a31 !important; }

/* Ozellik kutulari iki kolonlu duzenli izgara */
ul.ozellikler {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
ul.ozellikler li { min-width: 0; width: auto; }

/* Slider yuksekligi */
#slider img, .sy-slide img { display: block; width: 100%; height: auto; }

@media (max-width: 1024px) {
  ul.ozellikler { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
}

/* =====================================================================
   DUZELTMELER - 2. TUR
   ===================================================================== */

/* ---------- 1. Dil secici: pasif dugme gorunur olsun ----------
   Ust bar koyu; eski .headsocial a{color:#FFF} kurali pasif dugmeyi
   beyaz zemin uzerinde beyaz birakiyordu. */
.site-dil-secici {
  background: rgba(255, 255, 255, .12) !important;
  border: 1px solid rgba(255, 255, 255, .25) !important;
  padding: 3px 5px !important;
}
.site-dil-secici .dil-btn {
  color: #fff !important;
  background: transparent !important;
  opacity: .72;
  font-size: 12.5px;
  padding: 4px 10px;
  transition: all var(--gecis);
}
.site-dil-secici .dil-btn:hover { opacity: 1; background: rgba(255, 255, 255, .18) !important; }
.site-dil-secici .dil-btn.tr-active {
  background: var(--marka) !important;
  color: #fff !important;
  opacity: 1;
  font-weight: 700;
}
.site-dil-secici .dil-ayrac { color: rgba(255, 255, 255, .45); }

/* ---------- 2. Rezervasyon + haberler esit yukseklikte ---------- */
.ust-bloklar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
  margin-top: 40px;
}
.ust-bloklar.tek-blok { grid-template-columns: 1fr; }
.ust-bloklar > .rezervasyon,
.ust-bloklar > .haberduyuru {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
/* Rezervasyon: buton her zaman en altta */
.ust-bloklar > .rezervasyon .rezerbtn { margin-top: auto; }
.ust-bloklar > .rezervasyon > .clear { display: none; }

/* Haber listesi: kart yuksekligini asarsa kendi icinde kayar */
.haber-liste { flex: 1 1 auto; overflow-y: auto; max-height: 420px; padding-right: 4px; }
.haber-liste ul { list-style: none; margin: 0; padding: 0; }
.haber-liste li {
  display: flex;
  gap: 13px;
  align-items: flex-start;
  padding: 13px 0;
  border-bottom: 1px solid var(--cizgi-soft);
}
.haber-liste li:last-child { border-bottom: 0; }
.haber-liste li img {
  width: 96px;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  flex: 0 0 auto;
}
.haber-liste li h3 { font-size: .96rem; margin: 0 0 5px; line-height: 1.35; }
.haber-liste li p { font-size: .84rem; color: var(--metin-soft); margin: 0; line-height: 1.45; }
.haber-liste::-webkit-scrollbar { width: 6px; }
.haber-liste::-webkit-scrollbar-thumb { background: var(--cizgi); border-radius: 6px; }

/* ---------- 3. One cikan araclar: duyarli izgara ---------- */
.onecikanarac { clear: both; margin-top: 26px; }
.arac-izgara {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 20px;
}
.arac-kart {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #fff;
  border: 1px solid var(--cizgi-soft);
  border-radius: var(--yuvarlak);
  box-shadow: var(--golge-sm);
  padding: 16px;
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.arac-kart:hover { transform: translateY(-4px); box-shadow: var(--golge-md); }
.arac-kart-gorsel { display: block; width: 100%; }
.arac-kart-gorsel img {
  width: 100%;
  height: auto;
  aspect-ratio: 220 / 134;
  object-fit: contain;
  border-radius: 10px;
}
.arac-kart h3 { font-size: 1rem; margin: 12px 0 8px; min-height: 2.6em; display: flex; align-items: center; }
.arac-kart .arac-mini-ozellik { margin-bottom: 10px; }
.arac-kart .arac-fiyat { margin: 0 0 12px; }
.arac-kart .arac-fiyat span { color: var(--metin-soft); font-size: .88rem; }
.arac-kart .rezbtn { margin-top: auto; width: 100%; }

/* ---------- 4. Tanitim bloklari: esit yukseklik, duzgun hizalama ---------- */
.tanitim #wrapper { align-items: stretch; }
.tanblok {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 26px 20px !important;
}
.tanblok i {
  font-size: 46px !important;
  line-height: 1;
  margin: 0 0 16px !important;
  height: 52px;
  display: flex !important;
  align-items: center;
}
.tanblok img { margin-bottom: 16px; }
.tanblok h2, .tanblok h3, .tanblok a h1 {
  font-size: 1.05rem;
  margin: 0 0 10px;
  min-height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tanblok p {
  font-size: .92rem !important;
  line-height: 1.55;
  margin: 0;
  color: var(--metin-soft);
}

/* ---------- 5. Marka seridi: tekrarlayan arkaplan gorseli kaldirildi ---------- */
.markalar {
  background-image: none !important;
  background: linear-gradient(180deg, #fafbfc, #f2f4f6) !important;
  border-top: 1px solid var(--cizgi-soft);
  border-bottom: 1px solid var(--cizgi-soft);
  box-shadow: none !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 26px 0 !important;
  margin-top: 30px !important;
}
.markalar .list_carousel { height: auto !important; }
.markalar .marka-seridi ul,
.markalar .list_carousel ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 26px;
  margin: 0;
  padding: 0;
  list-style: none;
  width: auto !important;
}
.markalar li { float: none !important; width: auto !important; }
.markalar img {
  margin: 0 !important;
  max-height: 52px;
  width: auto;
  filter: grayscale(1);
  opacity: .62;
  transition: all var(--gecis);
}
.markalar img:hover { filter: none; opacity: 1; }

/* ---------- 6. Sozlesme onay kutusu ---------- */
.sozlesme-onay {
  clear: both;
  display: block;
  overflow: visible;
  padding: 16px 18px;
}
.sozlesme-onay label {
  display: block !important;
  position: relative;
  padding-left: 32px;
  margin: 0;
  line-height: 1.6;
  font-size: .95rem;
  cursor: pointer;
}
.sozlesme-onay input[type="checkbox"] {
  position: absolute;
  left: 0;
  top: 3px;
  width: 19px !important;
  height: 19px;
  min-height: 0;
  margin: 0 !important;
  float: none !important;
  flex: none;
}
.sozlesme-onay span { display: inline; }

/* ---------- 7. Ic sayfalarda cift cerceve ve ortalama ---------- */
.bigpage .pagecontent,
.bigpage .iletisiminfo {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
  width: 100% !important;
  text-align: left !important;
  backdrop-filter: none !important;
}
.bigpage .iletisiminfo h1,
.bigpage .pagecontent h1 { text-align: left; }
.iletisim-giris { text-align: left; }
.iletisiminfo .blokbaslik { border-bottom: 0 !important; }
.iletisim-kolon h2 { text-align: left; }
.iletisim-liste li { text-align: left; }
.form-alan label, .form-alan .form-etiket { text-align: left; }
.gonderbtn {
  background-color: var(--marka) !important;
  color: #fff !important;
}
.gonderbtn:hover { background-color: var(--marka-koyu) !important; }

/* ---------- Mobil ---------- */
@media (max-width: 900px) {
  .ust-bloklar { grid-template-columns: 1fr; gap: 20px; }
  .haber-liste { max-height: none; overflow: visible; }
}
@media (max-width: 560px) {
  .arac-izgara { grid-template-columns: 1fr; }
  .arac-kart h3 { min-height: 0; }
  .tanblok h2, .tanblok h3, .tanblok a h1 { min-height: 0; }
  .haber-liste li img { width: 76px; height: 58px; }
}

/* ---------- Alis / donus iki kolon (flex sarmalayicidan bagimsiz) ---------- */
.alis-donus {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  align-items: start;
}
.alis-donus > .rezersid,
.ust-bloklar .rezersid,
.rezervasyonpage .rezervasyon .rezersid {
  float: none !important;
  width: auto !important;
  min-width: 0;
  border-right: 0 !important;
  margin-top: 0 !important;
}
.alis-donus > .rezersid + .rezersid { padding-left: 22px; border-left: 1px solid var(--cizgi-soft); }

@media (max-width: 760px) {
  .alis-donus { grid-template-columns: 1fr; gap: 6px; }
  .alis-donus > .rezersid + .rezersid {
    padding-left: 0;
    border-left: 0;
    padding-top: 16px;
    border-top: 1px solid var(--cizgi-soft);
  }
}

/* ---------- Son rotuslar ---------- */
/* Sozlesme etiketi eski .kisiselbilgiler label{float:left} yuzunden
   kutudan tasiyordu; float kaldirildi. */
.sozlesme-onay label { float: none !important; margin-right: 0 !important; }
.sozlesme-onay { overflow: visible; }

/* Marka seridinde eski sabit yukseklik kaldirildi */
.markalar .marka-seridi,
.markalar .list_carousel,
.markalar .caroufredsel_wrapper { height: auto !important; min-height: 0 !important; }

/* One cikan arac kartinda buton tek satir */
.arac-kart .rezbtn {
  white-space: nowrap;
  font-size: .9rem;
  padding: 11px 16px;
  gap: 7px;
}
.arac-kart .arac-mini-ozellik {
  gap: 4px 10px;
  font-size: .78rem;
  justify-content: center;
  min-height: 2.6em;
  align-items: center;
}

/* Haber karti: liste ustten baslasin */
.ust-bloklar > .haberduyuru { justify-content: flex-start; }

/* Baslik alti cizgi her zaman solda.
   .blokbaslik eski CSS'te float:left idi; kendisinden sonra gelen
   display:grid/flex bloklar (ornegin .alis-donus) yeni bir bicimlendirme
   baglami actigi icin float'un yanina sigmaya calisip 0 genislige
   duserdi. Float tamamen kaldirildi. */
.blokbaslik { display: flow-root; float: none !important; width: auto !important; clear: both; }
.blokbaslik .titleline { float: none !important; clear: both; margin-right: auto; }
.blokbaslik h1, .blokbaslik h2, .blokbaslik h3 { float: none !important; }

/* =====================================================================
   3. TUR DUZELTMELER
   ===================================================================== */

/* ---------- A. One cikan araclar: tek sira, kayan serit (en fazla 5) ---------- */
.arac-serit-sar { position: relative; padding: 0 2px; }

.arac-serit {
  --gorunen: 5;
  --bosluk: 18px;
  list-style: none;
  margin: 0;
  padding: 4px 2px 12px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - (var(--gorunen) - 1) * var(--bosluk)) / var(--gorunen));
  gap: var(--bosluk);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.arac-serit::-webkit-scrollbar { display: none; }
.arac-serit > .arac-kart { scroll-snap-align: start; min-width: 0; }
.arac-serit:focus-visible { outline: 2px solid var(--marka); outline-offset: 4px; border-radius: var(--yuvarlak); }

.onecikanarac .blokbaslik { position: relative; }
.serit-kontrol {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  gap: 8px;
  z-index: 3;
}
.serit-ok {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  flex: 0 0 auto;
  border: 1px solid var(--cizgi-soft);
  background: #fff;
  color: var(--marka);
  font-size: 21px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(15, 23, 42, .22);
  transition: background var(--gecis), color var(--gecis), opacity var(--gecis);
}
.serit-ok:hover { background: var(--marka); color: #fff; border-color: var(--marka); }
.serit-ok[disabled] { opacity: .32; cursor: default; pointer-events: none; }
.serit-ok[hidden] { display: none; }

@media (max-width: 1240px) { .arac-serit { --gorunen: 4; } }
@media (max-width: 1000px) { .arac-serit { --gorunen: 3; } }
@media (max-width: 760px)  { .arac-serit { --gorunen: 2; } }
@media (max-width: 520px)  { .arac-serit { --gorunen: 1; } .serit-ok { width: 34px; height: 34px; font-size: 17px; } }
@media (max-width: 560px)  { .serit-kontrol { position: static; justify-content: flex-end; margin-bottom: 8px; } }
@media (prefers-reduced-motion: reduce) { .arac-serit { scroll-behavior: auto; } }

/* ---------- B. Haberler ve duyurular: duzenli iki kolonlu satir ---------- */
.haber-liste li.haber-oge {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  grid-template-areas:
    "gorsel baslik"
    "gorsel ozet";
  align-content: start;
  column-gap: 14px;
  row-gap: 4px;
  align-items: start;
  padding: 14px 2px;
}
.haber-liste li.haber-gorselsiz {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "baslik" "ozet";
}
.haber-liste li .haber-gorsel {
  grid-area: gorsel;
  display: block;
  width: 96px;
  border-radius: 8px;
  overflow: hidden;
  background: var(--zemin-soft, #f2f4f6);
}
.haber-liste li .haber-gorsel img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  margin: 0 !important;
  float: none !important;
  border-radius: 0;
}
.haber-liste li h3 {
  grid-area: baslik;
  margin: 0;
  font-size: .95rem;
  line-height: 1.35;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.haber-liste li h3 a { color: var(--metin); }
.haber-liste li h3 a:hover { color: var(--marka); }
.haber-liste li p {
  grid-area: ozet;
  margin: 0;
  font-size: .84rem;
  line-height: 1.5;
  color: var(--metin-soft);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 560px) {
  .haber-liste li.haber-oge { grid-template-columns: 76px minmax(0, 1fr); }
  .haber-liste li .haber-gorsel { width: 76px; }
}

/* ---------- C. Neden Turunc: sola hizali, duzenli bloklar ---------- */
.tanitim { position: relative; }
.tanitim::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, .74);
  pointer-events: none;
}
.tanitim #wrapper { position: relative; z-index: 1; }
.tanitim .tanitim-baslik { margin-bottom: 6px !important; }
.tanblok {
  align-items: flex-start !important;
  text-align: left !important;
  justify-content: flex-start;
  padding: 24px 22px !important;
}
.tanblok i {
  margin: 0 0 14px !important;
  height: auto;
  font-size: 40px !important;
  justify-content: flex-start;
}
.tanblok img { margin: 0 0 14px !important; }
.tanblok h2, .tanblok h3, .tanblok a h1 {
  min-height: 0 !important;
  display: block !important;
  justify-content: flex-start;
  font-size: 1.06rem;
  margin: 0 0 8px !important;
  line-height: 1.3;
}
.tanblok p {
  text-align: left !important;
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tanblok a { display: block; }

/* ---------- D. Marka seridi: surekli kayan ---------- */
.markalar .marka-kaydirma {
  position: relative;
  overflow: hidden;
  width: 100%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
.markalar .marka-kaydirma ul {
  display: flex;
  align-items: center;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  width: max-content;
  gap: 0 !important;
  margin: 0;
  padding: 0;
  list-style: none;
}
.markalar .marka-kaydirma.kayiyor ul { animation: marka-kay var(--kay-sure, 34s) linear infinite; }
.markalar .marka-kaydirma:hover ul,
.markalar .marka-kaydirma:focus-within ul { animation-play-state: paused; }
.markalar .marka-kaydirma li {
  flex: 0 0 auto;
  padding: 0 34px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.markalar .marka-kaydirma img { max-height: 54px; width: auto; }
@keyframes marka-kay { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .markalar .marka-kaydirma.kayiyor ul { animation: none; }
  .markalar .marka-kaydirma { -webkit-mask-image: none; mask-image: none; }
  .markalar .marka-kaydirma ul { justify-content: center !important; width: 100%; flex-wrap: wrap !important; }
}
@media (max-width: 560px) { .markalar .marka-kaydirma li { padding: 0 22px; } }

/* ---------- E. Footer: sayfa genisligine ortalanmis 3 kolon ---------- */
.footer #wrapper {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px 44px !important;
  align-items: start;
}
.footer .footblok { max-width: 100%; }
.footer .clearmob { display: none; }
.footer .copyright {
  grid-column: 1 / -1;
  text-align: center;
  padding-top: 16px;
}
@media (max-width: 860px) {
  .footer #wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 4px 28px !important; }
}
@media (max-width: 600px) {
  .footer #wrapper { grid-template-columns: minmax(0, 1fr) !important; }
  .footer .footblok { text-align: center; }
  .footer .foot-links { display: inline-block; text-align: left; }
}

/* ---------- Form: eksik alan isareti ve buton durumlari ---------- */
.alan-hatali {
  border-color: var(--hata) !important;
  box-shadow: 0 0 0 3px rgba(220, 53, 69, .14) !important;
}
.gonderbtn { border: 0; cursor: pointer; font: inherit; }
.gonderbtn.disabled, .rezerbtn.disabled, .rezerbtn[disabled] {
  opacity: .62;
  cursor: progress;
  pointer-events: none;
}
.rezer-sonuc, #contact_form_status { text-align: left; }
.rezer-sonuc .hata, .rezer-sonuc .okey, .rezer-sonuc .bilgi,
#contact_form_status .hata, #contact_form_status .okey, #contact_form_status .bilgi {
  display: block;
  padding: 12px 14px;
  border-radius: 10px;
  margin-top: 6px;
  font-size: .95rem;
  line-height: 1.5;
}
.rezer-sonuc .hata, #contact_form_status .hata { background: #fdeceb; border: 1px solid #f6d4d1; }
.rezer-sonuc .okey, #contact_form_status .okey { background: #e9f7ee; border: 1px solid #cbead6; }
.rezer-sonuc .bilgi, #contact_form_status .bilgi { background: #fff5eb; border: 1px solid #fadfc3; }

/* ---------- Dokunma hedefleri (mobil) ---------- */
.sozlesme-onay input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-width: 20px;
  accent-color: var(--marka);
}
.radyo-grup input[type="radio"] { width: 18px; height: 18px; accent-color: var(--marka); }

@media (max-width: 760px) {
  .site-dil-secici .dil-btn { min-height: 40px; display: inline-flex; align-items: center; padding: 0 14px; }
  .menu ul li a, .foot-links a, .iletisim-liste a { min-height: 40px; display: flex; align-items: center; }
  .breadcrumb a { padding: 6px 0; display: inline-block; }
  .headsocial a { min-width: 40px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; }
}

/* ---------- Panelden gelen "ek kod" alani ---------- */
/* Bu alana yalnizca script degil, gorunen bag/metin de girilebiliyor.
   Bicimsiz sekilde sayfa altinda asili kalmasin diye toparlandi. */
.ek-kod-alani {
  text-align: center;
  padding: 10px 16px 18px;
  font-size: .78rem;
  line-height: 1.6;
  background: var(--zemin-koyu, #1f1f1f);
  color: #8a8a8a;
}
.ek-kod-alani:empty { display: none; }
.ek-kod-alani a {
  color: #9aa1a8;
  text-decoration: none;
  display: inline-block;
  padding: 8px 10px;
  min-height: 34px;
  line-height: 20px;
}
.ek-kod-alani a:hover { color: var(--marka); text-decoration: underline; }

/* Ekstra hizmet ve odeme tipi kutulari: dokunulabilir boyut */
.ekstra-tablo input[type="checkbox"],
.ekstralar input[type="checkbox"],
.radyo-grup input[type="radio"],
.sozlesme-onay input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-width: 20px;
  accent-color: var(--marka);
  vertical-align: middle;
}
.ekstra-tablo label,
.ekstralar label,
.radyo-grup label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  cursor: pointer;
}

/* Rezervasyon butonu form genisligini kaplasin ve ortali dursun */
.rezervasyonpage .rezerbtn,
#rezBtn {
  width: 100% !important;
  max-width: 480px;
  margin: 18px auto 0 !important;
  justify-content: center;
  float: none !important;
}

/* =====================================================================
   E. Duzeltmeler — 2026-09 revizyonu
   ===================================================================== */

/* --- E1. "Neden Turunc" bloklari: anasayfa ile ic sayfalar ayni olsun ---
   Eskiden .tanitim #wrapper'in kendisi grid'di ve baslik da bir grid
   ogesiydi. Iki sorun cikiyordu:
     1) Basligin ardindaki bos <div class="clear"> bir hucre kapiyor,
        butun bloklari bir kolon saga kaydiriyordu ("kayik" gorunum).
     2) Baslik grid-column:1/-1 ile tum kolonlari kapsadigi icin
        auto-fit bos son kolonu birakamiyor, anasayfada 5 kolon olusup
        bloklar ic sayfalardan (4 kolon) daha ince kaliyordu.
   Cozum: grid artik sadece bloklari saran .tanitim-izgara. Baslik
   grid'in disinda normal bir blok. Boylece anasayfa ve ic sayfalar
   birebir ayni kolon sayisi ve blok genisligini kullanir.            */
.tanitim #wrapper {
  display: block;
  padding-top: 34px;
}
.tanitim #wrapper > .clear,
.tanitim #wrapper > br { display: none !important; }

.tanitim .tanitim-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 22px;
  align-items: stretch;
}
.tanitim #wrapper > .tanitim-baslik {
  display: block;
  text-align: center;
  width: auto;
  margin: 0 0 18px !important;
}

/* --- E2. Saat / Dakika kutulari her ekran boyutunda yan yana --- */
.rezer-saat {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 10px;
  align-items: center;
}
.rezer-saat > select,
.rezer-saat select.inputsaat,
.rezer-saat select.inputdk {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  float: none !important;
  margin: 0 !important;
}
/* Cok dar ekranlarda ic bosluklari kisalt ki metin tasmasin */
@media (max-width: 400px) {
  .rezer-saat > select { padding-left: 8px !important; padding-right: 8px !important; }
}

/* --- E3. Minimum kiralama gunu bilgisi / uyarisi --- */
.min-gun-bilgi {
  margin: 10px 0 0;
  font-size: .86rem;
  color: var(--metin-soft, #6b7280);
  line-height: 1.4;
}
.min-gun-bilgi.min-gun-uyari {
  color: #b3261e;
  font-weight: 600;
}

/* --- E4. Lokasyon: sehir secilmeden mevki kutusu kilitli --- */
select.lokasyon-mevki:disabled {
  background-color: #f4f4f5;
  color: #9ca3af;
  cursor: not-allowed;
}

/* --- E5. Slayt metinleri (baslik + aciklama) ---
   Bu alanlar panelde giriliyor ama sitede hic gosterilmiyordu.
   Artik gorsel uzerinde okunabilir bir kutu olarak basiliyor. */
/* DIKKAT — SLIPPRY ILE CAKISMA:
   Slippry her <li>'ye .sy-slide sinifini verir ve onlari
   "position: absolute" ile ust uste bindirir. Burada onceden
   "#slider li { position: relative; }" yaziyordu; ID iceren secici
   (1,0,1) slippry'nin sinif secicisini (0,1,0) EZDIGI icin butun
   slaytlar akisa donuyor, yalnizca ilk gorsel goruluyor ve altinda
   devasa bir bosluk olusuyordu.
   Cozum: konumlandirmayi yalnizca slippry HENUZ devreye girmemisken
   (ya da JS kapaliyken) uygula. .sy-slide zaten absolute oldugu icin
   basligi konumlandirmak icin gereken kapsayici blogu kendisi saglar. */
#slider li:not(.sy-slide) { position: relative; }
#slider li .slayt-bag { display: block; }

.slayt-yazi {
  position: absolute;
  inset: auto 0 0 0;
  display: flex;
  justify-content: center;
  padding: 0;
  /* Metin her gorselde okunsun diye alttan yumusak bir karartma */
  background: linear-gradient(to top, rgba(0, 0, 0, .68) 0%, rgba(0, 0, 0, .38) 55%, transparent 100%);
  pointer-events: none;
}
.slayt-yazi-ic {
  width: 1280px;
  max-width: 95%;
  padding: 26px 0 22px;
  color: #fff;
  text-align: left;
}
.slayt-baslik {
  margin: 0 0 6px;
  font-size: clamp(1.15rem, 2.4vw, 1.9rem);
  font-weight: 700;
  line-height: 1.22;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}
.slayt-aciklama {
  margin: 0;
  font-size: clamp(.86rem, 1.3vw, 1rem);
  line-height: 1.5;
  color: rgba(255, 255, 255, .94);
  text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
  max-width: 62ch;
  /* Uzun aciklamalar slaytin yuksekligini tasirmasin */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 560px) {
  .slayt-yazi-ic { padding: 14px 0 12px; }
  .slayt-aciklama { -webkit-line-clamp: 2; }
}
/* Slayt cok kisaysa (mobilde) metin gorseli tamamen kaplamasin */
@media (max-width: 380px) {
  .slayt-aciklama { display: none; }
}
