/* ==========================================================================
   Lider Ambulans - ozellestirmeler
   style.css'ten SONRA yuklenir; tema dosyalarina dokunulmaz.
   ========================================================================== */

/* --- Hero arkaplan gorselleri (masaustu) --- */
.lider-hero__bg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.lider-hero__bg--1 { background-image: url(../img/hero/lider-hero-1.jpg); }
.lider-hero__bg--2 { background-image: url(../img/hero/lider-hero-2.jpg); }
.lider-hero__bg--3 { background-image: url(../img/hero/lider-hero-3.jpg); }

/* Mobilde dikey kadraj: ambulanslar kucuk ekranda da net gorunsun */
@media (max-width: 767px) {
  .lider-hero__bg--1 { background-image: url(../img/hero/lider-hero-1-m.jpg); }
  .lider-hero__bg--2 { background-image: url(../img/hero/lider-hero-2-m.jpg); }
  .lider-hero__bg--3 { background-image: url(../img/hero/lider-hero-3-m.jpg); }
}

/* --- Karartma: gece cekimi uzerinde beyaz metnin okunabilmesi icin --- */
.lider-hero__overlay {
  position: absolute;
  left: 0; top: 0; right: 0; bottom: 0;
  z-index: 2;
  background: linear-gradient(180deg,
              rgba(6, 17, 43, .78) 0%,
              rgba(6, 17, 43, .62) 45%,
              rgba(6, 17, 43, .85) 100%);
}

/* Beyaz ambulanslarin uzerine denk gelen metin icin ek okunabilirlik */
.hero-layout2 .hero-title,
.hero-layout2 .hero-subtitle,
.lider-hero__text {
  text-shadow: 0 2px 8px rgba(0, 0, 0, .5);
}

/* --- Hero yuksekligi: 980px cok fazlaydi, ekrana sigan bir olcuye cekildi --- */
.hero-layout2 .hero-inner { min-height: 760px; }
@media (max-width: 1399px) { .hero-layout2 .hero-inner { min-height: 660px; } }
@media (max-width: 991px)  { .hero-layout2 .hero-inner { min-height: 560px; padding: 60px 0 90px; } }
@media (max-width: 767px)  { .hero-layout2 .hero-inner { min-height: 520px; padding: 50px 0 75px; } }

/* --- Baslik: sabit 72px yerine akiskan olcek (mobilde tasiyordu) --- */
.hero-layout2 .hero-title {
  font-size: clamp(26px, 4.6vw, 62px);
  line-height: 1.15;
  max-width: 860px;
  margin: 0 auto 20px auto;
}
.hero-layout2 .hero-subtitle {
  font-size: clamp(13px, 1.2vw, 18px);
  letter-spacing: .5px;
  margin-bottom: 14px;
}

/* --- Slide aciklama metni --- */
.lider-hero__text {
  position: relative;
  z-index: 5;
  max-width: 620px;
  margin: 0 auto 32px auto;
  color: rgba(255, 255, 255, .92);
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 1.65;
  text-align: center;
}

/* --- Butonlar: mobilde tasmasin, dar ekranda alt alta --- */
.hero-layout2 .hero-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
}
.hero-layout2 .hero-btns .vs-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
@media (max-width: 575px) {
  .hero-layout2 .hero-btns { flex-direction: column; align-items: stretch; padding: 0 6px; }
  .hero-layout2 .hero-btns .vs-btn { width: 100%; justify-content: center; }
}

/* --- Slide gecis noktalari --- */
.lider-hero .slick-dots {
  position: absolute;
  left: 0; right: 0; bottom: 26px;
  z-index: 6;
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lider-hero .slick-dots li { line-height: 0; }
.lider-hero .slick-dots button {
  width: 12px; height: 12px;
  padding: 0;
  border: 2px solid rgba(255, 255, 255, .75);
  border-radius: 50%;
  background: transparent;
  font-size: 0;
  cursor: pointer;
  transition: all .3s ease;
}
.lider-hero .slick-dots .slick-active button {
  background: var(--theme-color);
  border-color: #fff;
  transform: scale(1.25);
}
@media (max-width: 767px) { .lider-hero .slick-dots { bottom: 16px; } }

/* --- Hero alt dalga sekli: karartmanin uzerinde kalsin --- */
.hero-layout2 .hero-shape1 { z-index: 3; }

/* ==========================================================================
   HEADER
   Logo 500x286 ve temada olcu siniri yoktu -> mobilde container'a yayilip
   ~206px yukseklige cikiyordu. Hamburger de ayri satirda kaliyordu.
   ========================================================================== */

/* --- Logo: makul olcuye cekildi --- */
.header-logo img,
.header-logo .logo {
  max-height: 78px;
  width: auto;
}
@media (max-width: 991px) { .header-logo img, .header-logo .logo { max-height: 62px; } }
@media (max-width: 767px) { .header-logo img, .header-logo .logo { max-height: 54px; } }
@media (max-width: 400px) { .header-logo img, .header-logo .logo { max-height: 44px; } }

.header-logo { padding: 12px 0; }
@media (max-width: 767px) { .header-logo { padding: 8px 0; } }

/* Off-canvas menu icindeki logo da tasiyordu */
.mobile-logo img, .mobile-logo .logo { max-height: 60px; width: auto; }
.mobile-logo { padding-top: 24px; padding-bottom: 20px; }

/* --- Mobil menu butonu: logo satirinda --- */
.lider-mobil-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--border-color);
  border-radius: 6px;
  background: var(--smoke-color);
  color: var(--title-color);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.lider-mobil-menu-btn:hover { background: var(--theme-color); border-color: var(--theme-color); color: #fff; }

/* Telefon ile buton dip dibeydi (12px). Tema `.header-layout1 .vs-menu-toggle{margin:10px 0}`
   ile margin'i sifirliyor ve (0,2,0) specificity ile tek sinifi eziyor -> ayirici
   ile birlikte iki sinif uzerinden yaziyoruz. Logo sutununda bos yer var,
   bosluk buyuyunce logo kirpilmiyor. */
.lider-menu-col .lider-mobil-menu-btn { margin: 0 0 0 22px; }

@media (max-width: 767px) {
  .menu-top .header-info_label { font-size: 12px; }
  .menu-top .header-info_link { font-size: 14px; }
  /* ince ayirici, masaustundeki header-info ayiricilariyla ayni dil */
  .lider-menu-col { border-left: 1px solid var(--border-color); padding-left: 16px; }
}
@media (max-width: 400px) {
  .lider-menu-col .lider-mobil-menu-btn { margin-left: 12px; }
  .lider-menu-col { padding-left: 10px; }
  .menu-top .header-info_link { font-size: 13px; }
}

/* --- Mobilde sticky serit: icinde sadece eski hamburger vardi, artik bos --- */
@media (max-width: 991px) {
  .sticky-wrapper { display: none; }
}

/* --- 404 sayfasi --- */
.lider-404 { text-align: center; }
.lider-404__kod {
  display: block;
  font-family: var(--title-font);
  font-weight: 700;
  font-size: clamp(84px, 16vw, 180px);
  line-height: 1;
  color: var(--theme-color);
  opacity: .18;
  margin-bottom: -10px;
}
.lider-404__metin { max-width: 560px; margin: 14px auto 32px; }
.lider-404__btns { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.lider-404__btns .vs-btn { display: inline-flex; align-items: center; gap: 8px; }

/* --- Hizmet kartlari: gorsel eklendi --- */
.lider-feature__img {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 22px;
  aspect-ratio: 16 / 10;
  background: var(--smoke-color);
}
.lider-feature__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.feature-style1:hover .lider-feature__img img { transform: scale(1.06); }
