/* ================================
   ZEMEZ PARALLAX - ARKA PLAN
   ================================ */

/* Arka plan resmi: her cihazda cover */
.rd-parallax-layer[data-type="media"] {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    min-height: 360px;
}

/* Yazının bulunduğu HTML layer beyaz blok olmasın */
.rd-parallax-layer[data-type="html"] {
    background: transparent !important;
    width: 100% !important;
}

/* ================================
   YAZI BLOĞU (7/24 YOL YARDIM)
   ================================ */

/* Masaüstü/gene l */
.parallax-yolyardim {
    position: absolute;
    top: 50%;
    right: 560px;
    transform: translateY(-50%);
    color: #ffffff;
    text-align: right;
    z-index: 10;
    max-width: 45%;
}

.parallax-yolyardim h2,
.parallax-yolyardim h1 {
    font-size: 60px;
    font-weight: 800;
    letter-spacing: 2px;
    margin-bottom: 15px;
    text-transform: uppercase;
    text-shadow: 0 2px 6px rgba(0,0,0,0.4);
}

.parallax-yolyardim p {
    font-size: 20px;
    margin: 6px 0;
    text-shadow: 0 2px 6px rgba(0,0,0,0.4);
}

.parallax-yolyardim p strong {
    font-size: 24px;
    color: #ffd800;
}

/* ================================
   MOBİL DÜZELTME
   ================================ */
@media (max-width: 768px) {

    .parallax-yolyardim {
        position: static !important;
        transform: none !important;
        right: auto !important;
        left: auto !important;
        max-width: 100% !important;
        padding: 10px 15px 20px !important; /* üst boşluğu biraz azalt */
        text-align: center !important;
        margin: -10px auto 0 auto !important; /* yazıyı hafif yukarı çeker */
    }

    .parallax-yolyardim h2,
    .parallax-yolyardim h1 {
        font-size: 28px !important;
        line-height: 32px !important;
    }

    .parallax-yolyardim p {
        font-size: 15px !important;
        line-height: 20px !important;
    }

    .parallax-yolyardim p strong {
        font-size: 17px !important;
    }

    /* Resim biraz daha dik ve ortalı dursun */
    .rd-parallax-layer[data-type="media"] {
        min-height: 280px !important;
        background-position: center center !important;
    }
}
/* ============ PARALLAX BACKGROUND FIX ============ */

/* Masaüstü için */
.rd-parallax-layer[data-type="media"] {
    background-size: cover !important;        /* tam ekran dolsun */
    background-position: center center !important;
    background-repeat: no-repeat !important;
    width: 100% !important;
    min-height: 450px !important;             /* slider yüksekliği */
    height: auto !important;
}

/* Mobil için ince ayar */
@media (max-width: 768px) {
    .rd-parallax-layer[data-type="media"] {
        min-height: 330px !important;
        background-size: cover !important;
        background-position: center 20% !important; 
        /* resmin üst tarafı daha fazla görünsün → VAN daha iyi kadraja girer */
    }
}






/* RD Parallax - Görsel katmanı her zaman görünsün (genel) */
#parallax_0 .rd-parallax-layer[data-type="media"]{
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  transform: none !important;
  -webkit-transform: none !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* Mobilde alanı sabitle: resim kesin görünür */
@media (max-width: 768px){

  #parallax_0,
  #parallax_0 .rd-parallax-inner{
    height: 260px !important;
    min-height: 260px !important;
    overflow: hidden !important;
    position: relative !important;
  }

  /* Tema html layer'ı zaten relative; onu bozma */
  #parallax_0 .rd-parallax-layer[data-type="html"]{
    min-height: 260px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    position: relative !important;
    z-index: 2 !important;
  }

  /* Yazıyı ortala */
  #parallax_0 .description{
    height: 260px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    padding: 0 14px !important;
    text-align: center !important;
  }
}
/* MOBİL – Sağdaki boşluk problemi (ZEMEZ) */
@media (max-width: 768px) {

  html, body {
    overflow-x: hidden !important;
  }

  /* ZEMEZ container zinciri */
  .tm-container,
  .tm-inner,
  .row,
  .row-inner,
  .row-level-1,
  .bottom-parallax,
  .col-inner.m1m {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  /* Parallax alanı ortalı ve dengeli */
  #parallax_0,
  #parallax_0 .rd-parallax-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;   /* ⬅️ SOL boşluk */
    padding-right: 15px !important;  /* ➡️ SAĞ boşluk */
    box-sizing: border-box;
  }

  /* Arka plan görseli padding içinde düzgün kalsın */
  #parallax_0 .rd-parallax-layer[data-type="media"] {
    background-position: center center !important;
    background-size: cover !important;
  }

}
/* ============================= */
/* 7/24 Yol Yardım Alanı         */
/* ============================= */

.parallax-yolyardim{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    max-width:100%;
}

/* ============================= */
/* HEMEN ARA BUTONU (KÜÇÜK)     */
/* ============================= */

.btn-call{
    display:flex;
    align-items:center;
    gap:8px;
    background:#ffcc00;
    color:#111;
    text-decoration:none;
    padding:8px 14px;
    border-radius:10px;
    font-weight:700;
    box-shadow:0 3px 8px rgba(0,0,0,.18);
    width:auto;                 /* tam genişlik YOK */
    max-width:280px;            /* gerçek buton */
    margin:0 auto;
    position:relative;
    z-index:5;
}

/* Telefon ikon kutusu */
.call-icon-wrap{
    flex:0 0 26px;
    width:26px;
    height:26px;
    background:#000;
    border-radius:7px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.call-icon{
    width:14px;
    height:14px;
    fill:#ffcc00;
}

/* Yazı alanı */
.call-text{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.call-title{
    font-size:11px;
    font-weight:700;
}

.call-number{
    font-size:13px;
    font-weight:800;
    white-space:nowrap;
}

/* Hover */
.btn-call:hover{
    filter:brightness(0.95);
}

/* ============================= */
/* WHATSAPP BUTONU (KÜÇÜK)      */
/* ============================= */

.btn-wa{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#25D366;
    color:#fff;
    text-decoration:none;
    padding:8px 14px;
    border-radius:10px;
    font-weight:700;
    font-size:13px;
    box-shadow:0 3px 8px rgba(0,0,0,.18);
    width:auto;                 /* tam genişlik YOK */
    max-width:280px;
    margin:0 auto;
    position:relative;
    z-index:4;
}

.btn-wa:hover{
    filter:brightness(0.95);
}

/* ============================= */
/* SADECE MOBİL AYAR            */
/* ============================= */

@media (max-width:768px){

    /* Başlık ve metin mobilde ortalı */
    .parallax-yolyardim h2,
    .parallax-yolyardim p{
        text-align:center !important;
        width:100%;
    }

    /* Butonlar mobilde biraz daha nefes alsın */
    .btn-call,
    .btn-wa{
        max-width:90%;
    }

    /* Numara biraz daha küçük */
    .call-number{
        font-size:12px;
    }
}

/* Logo kırmızısı */
:root{
    --logo-red:#e10600;
}

/* Üst mavi bar -> logo kırmızısı */
.header-top,
.top-panel,
.top-bar,
.header-top-panel,
header .header-top,
.stuck-menu .header-top{
    background-color: var(--logo-red) !important;
}

/* Yazı ve ikonlar beyaz */
.header-top,
.header-top a,
.header-top span,
.header-top i{
    color:#ffffff !important;
}

/* ========================================= */
/* FOOTER: Bize Ulaşın + Bağlantılar düzelt  */
/* ========================================= */

/* Başlıklar */
#html-module2 .box-heading h5,
#html-module3 .box-heading h5{
  margin: 0 0 12px 0 !important;
  line-height: 1.2 !important;
}

/* İçerik genel */
#html-module2 .content,
#html-module3 .content{
  font-size: 13px;
  line-height: 1.45;
}

/* Paragraf aralıkları */
#html-module2 .content p,
#html-module3 .content p{
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
}

/* 🔥 Kelime kelime bölünmeyi engelle */
#html-module2 .content,
#html-module2 .content *{
  word-break: normal !important;
  overflow-wrap: normal !important;  /* break-word / anywhere kapansın */
  white-space: normal !important;
  hyphens: none !important;
}

/* Telefon ve mail mümkünse tek satır */
#html-module2 .content a,
#html-module2 .content{
  word-break: keep-all !important;
}

/* Bağlantılar: br boşluklarını sil */
#html-module3 .content p br{
  display:none !important;
}

/* Bağlantılar daha sıkı */
#html-module3 .content p{
  margin-bottom: 6px !important;
}
/* ========================================= */
/* FOOTER - html-module genişlik çakışması fix */
/* ========================================= */

/* Footer içinde html-module'lerin %33'e düşmesini engelle */
footer .accordion-footer .html-module{
  width: 100% !important;
  float: none !important;
}

/* Bootstrap kolon içinde daralma olmasın */
footer .accordion-footer .col-inner > .html-module{
  max-width: 100% !important;
}


#html-module3 .content a:hover{
    color:#e10600; /* logo kırmızısı */
    text-decoration:underline;
}


/* Hesabım (toggle_cont) açılır menü yazıları görünür olsun */
#top-links .toggle_cont{
  background:#fff !important;
}

#top-links .toggle_cont a{
  color:#111 !important;
}

/* Hover */
#top-links .toggle_cont a:hover{
  background:#f3f3f3 !important;
  color:#111 !important;
}

/* Eğer li arası çizgi/kenarlık istersen */
#top-links .toggle_cont li + li{
  border-top:1px solid #eee;
}
/* Hesabım (üstteki buton) görünür olsun */
#top-links > .toggle{                 /* sağdaki kullanıcı ikonu */
  color:#fff !important;
}

#top-links > .toggle i{
  color:#fff !important;
}

/* "Hesabım" yazısı ve ikonu (menüyü açan link) */
#top-links .toggle-wrap > a.toggle{
  color:#fff !important;
}

#top-links .toggle-wrap > a.toggle i,
#top-links .toggle-wrap > a.toggle span{
  color:#fff !important;
}

/* Sadece açılan menünün içindeki linkler siyah kalsın */
#top-links .toggle_cont.toggle_cont__right a{
  color:#111 !important;
}
/* ============================= */
/* HESABIM: Mobilde gizlenmesin  */
/* ============================= */

/* Tema mobilde .toggle linkini gizliyor, biz geri açıyoruz */
@media (max-width: 767px){
  #top-links .toggle-wrap > a.toggle{
    display: inline-block !important;
  }
}

/* 1. seviye container (ul.toggle_cont) arkaplanını bozma */
#top-links > .toggle_cont{
  background: transparent !important;
  padding: 0 !important;
}

/* "Hesabım" (menüyü açan link) üst barda beyaz kalsın */
#top-links .toggle-wrap > a.toggle,
#top-links .toggle-wrap > a.toggle i,
#top-links .toggle-wrap > a.toggle span{
  color: #fff !important;
}

/* Sadece açılan asıl menü (sağ dropdown) beyaz zemin + siyah yazı */
#top-links .toggle_cont.toggle_cont__right{
  background:#fff !important;
  border-radius: 8px;
  overflow: hidden;
}

#top-links .toggle_cont.toggle_cont__right a{
  color:#111 !important;
}

#top-links .toggle_cont.toggle_cont__right a:hover{
  background:#f3f3f3 !important;
  color:#111 !important;
}

/* =========================================
   NAV DROPDOWN (Superfish) - bersanotolastik
   ========================================= */

/* Üst menü linkleri */
.navigation .sf-menu > li > a{
  padding: 14px 16px !important;
  font-weight: 600;
}

/* Dropdown kutusu */
.navigation .sf-menu > li > ul.simple_menu{
  min-width: 220px;
  margin-top: 10px;                 /* menü ile kutu arası */
  padding: 10px 0 !important;
  background: #ffffff !important;
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
  border: 1px solid rgba(0,0,0,.08);
  overflow: hidden;
  z-index: 9999;
}

/* Dropdown ok gibi küçük bir detay (istersen kapatırız) */
.navigation .sf-menu > li > ul.simple_menu:before{
  content:"";
  position:absolute;
  top:-8px;
  left: 28px;
  width: 16px;
  height: 16px;
  background:#fff;
  transform: rotate(45deg);
  border-left: 1px solid rgba(0,0,0,.08);

/* ===============================
   DROPDOWN YAZI BOYUTU BÜYÜTME
   =============================== */

/* Alt menü linkleri */
.navigation .sf-menu > li > ul.simple_menu li a{
  font-size: 15px;        /* önce 13–14 civarıydı */
  font-weight: 500;
  padding: 10px 18px;     /* yazı büyüyünce nefes alsın */
}

/* Hover durumunda daha net olsun */
.navigation .sf-menu > li > ul.simple_menu li a:hover{
  font-weight: 600;
}

/* Dropdown kutusunu biraz genişlet */
.navigation .sf-menu > li > ul.simple_menu{
  min-width: 240px;       /* yazı büyüyünce dar durmasın */
}
/* ======================================
   DROPDOWN HOVER: KIRMIZI + BEYAZ YAZI
   ====================================== */

/* Hover efekti */
.navigation .sf-menu > li > ul.simple_menu li a{
  transition: all .2s ease;
  border-radius: 6px;
}

.navigation .sf-menu > li > ul.simple_menu li a:hover{
  background-color: var(--logo-red); /* #e10600 */
  color: #ffffff !important;
  padding-left: 22px;                /* hafif kayma efekti */
}

/* Aktif / hover durumunda ikon varsa */
.navigation .sf-menu > li > ul.simple_menu li a:hover i{
  color: #ffffff !important;
}

/* Liste elemanı hover taşmasın */
.navigation .sf-menu > li > ul.simple_menu li{
  margin: 4px 8px;
}
/* ============================= */
/* DROPDOWN (simple_menu) TASARIM */
/* ============================= */

:root{
  --logo-red:#e10600; /* logo kırmızısı */
}

/* Dropdown kutusu */
.navigation .megamenu ul.sf-menu li > ul.simple_menu{
  background:#fff !important;
  border-radius:12px;
  padding:10px 0 !important;
  min-width:220px;
  box-shadow:0 14px 32px rgba(0,0,0,.18);
  border:1px solid rgba(0,0,0,.08);
}

/* Dropdown linkleri (yazı büyüsün) */
.navigation .megamenu ul.sf-menu li > ul.simple_menu li > a{
  display:block;
  padding:10px 16px !important;
  font-size:15px !important;     /* yazı büyüklüğü */
  font-weight:600;
  color:#111 !important;
  background:transparent !important;
  border-radius:0;
}

/* Hover: kırmızı arka plan + beyaz yazı (spesifik + !important) */
.navigation .megamenu ul.sf-menu li > ul.simple_menu li:hover > a,
.navigation .megamenu ul.sf-menu li > ul.simple_menu li > a:hover{
  background:var(--logo-red) !important;
  color:#fff !important;
}

/* İlk ve son elemana yumuşak köşe */
.navigation .megamenu ul.sf-menu li > ul.simple_menu li:first-child > a{
  border-top-left-radius:10px;
  border-top-right-radius:10px;
}
.navigation .megamenu ul.sf-menu li > ul.simple_menu li:last-child > a{
  border-bottom-left-radius:10px;
  border-bottom-right-radius:10px;
}

/* İstersen: hover'da hafif kayma efekti */
.navigation .megamenu ul.sf-menu li > ul.simple_menu li > a{
  transition: background-color .15s ease, color .15s ease, padding-left .15s ease;
}
.navigation .megamenu ul.sf-menu li > ul.simple_menu li:hover > a{
  padding-left:18px !important;
}
.navigation .sfHover > ul.simple_menu a:hover{ background:var(--logo-red) !important; color:#fff !important; }
.navigation .sfHover > ul.simple_menu li:hover > a{ background:var(--logo-red) !important; color:#fff !important; }
:root{ --logo-red:#e10600; }

/* Dropdown link temel */
.navigation .megamenu .sf-menu li ul.simple_menu li > a{
  display:block !important;
  padding:10px 16px !important;
  font-size:15px !important;
  font-weight:600 !important;
  color:#111 !important;
  background:transparent !important;
}

/* Tema span'a renk veriyorsa onu da ez */
.navigation .megamenu .sf-menu li ul.simple_menu li > a span{
  color:#111 !important;
}

/* HOVER (asıl) */
.navigation .megamenu .sf-menu li ul.simple_menu li:hover > a,
.navigation .megamenu .sf-menu li ul.simple_menu li > a:hover,
.navigation .megamenu .sf-menu li ul.simple_menu li.sfHover > a{
  background-color:var(--logo-red) !important;
  background-image:none !important;
  color:#fff !important;
}

/* HOVER'da span da beyaz olsun */
.navigation .megamenu .sf-menu li ul.simple_menu li:hover > a span,
.navigation .megamenu .sf-menu li ul.simple_menu li > a:hover span,
.navigation .megamenu .sf-menu li ul.simple_menu li.sfHover > a span{
  color:#fff !important;
}

/* Bazı temalar li'ye background basar, onu da yakala */
.navigation .megamenu .sf-menu li ul.simple_menu li:hover{
  background-color:var(--logo-red) !important;
}

/* Ufak görsel iyileştirme */
.navigation .megamenu .sf-menu li ul.simple_menu{
  border-radius:12px !important;
  overflow:hidden !important; /* kırmızı taşmasın */
}
:root { --logo-red:#e10600; }

/* Dropdown (simple_menu) yazıları büyüt */
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li > a{
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: #222 !important;
  background: #fff !important;
  padding: 10px 16px !important;
  border-radius: 0 !important;
}

/* HOVER: kırmızı arka plan + beyaz yazı (hem li:hover hem a:hover yakala) */
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li:hover > a,
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li > a:hover,
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li > a:focus{
  background: var(--logo-red) !important;
  color: #fff !important;
}

/* Tema span'a ayrı renk veriyorsa onu da beyaz yap */
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li:hover > a span,
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li > a:hover span{
  color:#fff !important;
}

/* Eğer hover rengi pseudo element ile geliyorsa (bazı temalarda) onu da kapat */
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li > a:before,
.navigation .megamenu ul.sf-menu > li > ul.simple_menu > li > a:after{
  background: none !important;
}

:root{
  --footer-bg:#222;
  --footer-bottom-bg:#111;
  --footer-text:#dcdcdc;
  --footer-title:#ffffff;
  --footer-red:#e10600;
}

:root{
  --footer-bg:#222;
  --footer-bottom-bg:#111;
  --footer-text:#dcdcdc;
  --footer-title:#ffffff;
  --footer-red:#e10600;
}

/* Genel footer */
.site-footer{
  background:var(--footer-bg);
  color:var(--footer-text);
  font-size:14px;
  padding-top:40px;
}

/* Grid yapısı */
.footer-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:40px;
  padding-bottom:30px;
}

/* İlk modül tam genişlik kullanmak isterse */
.footer-col-full{
  grid-column:1/-1;
}

/* Modül içi başlıkları biraz güçlendir */
.site-footer .box-heading h5,
.site-footer h4{
  color:var(--footer-title);
  margin:0 0 12px 0;
  font-weight:700;
  border-bottom:2px solid var(--footer-red);
  display:inline-block;
  padding-bottom:4px;
}

/* Modül içeriği */
.footer_modules{
  font-size:13px;
  line-height:1.5;
}

.footer_modules a{
  color:var(--footer-text);
}

.footer_modules a:hover{
  color:var(--footer-red);
}

/* Alt satır (powered + design) */
.footer-bottom{
  background:var(--footer-bottom-bg);
  padding:15px 0;
  font-size:13px;
}

.footer-bottom-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.footer-bottom-inner a{
  color:var(--footer-text);
}

.footer-bottom-inner a:hover{
  color:var(--footer-red);
}

/* Mobil düzen */
@media (max-width:768px){
  .footer-bottom-inner{
    flex-direction:column;
    text-align:center;
    gap:8px;
  }
}

/* ==== FOOTER HİZA DÜZELTME – BERSANOTO LASTİK ==== */

/* Footer grid override */
footer .row,
footer .footer_modules {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important;
}

/* Her modül eşit genişlik */
footer .footer_modules {
    flex: 1 1 300px !important;
    max-width: 350px !important;
}

/* Başlık solda dursun */
footer .footer_modules .box-heading h5 {
    text-align: left !important;
    width: 100%;
    margin-bottom: 12px !important;
}

/* İçerik metni hizası */
footer .footer_modules .content {
    text-align: left !important;
    line-height: 1.45;
}

/* Mobil – alt alta gelsin */
@media (max-width: 768px) {
    footer .footer_modules {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}
/* ================================
   FOOTER KESİN HİZA DÜZELTME
   (HTML değiştirmeden)
================================ */

/* Footer genel alan */
footer{
  background:#2b2b2b;
  color:#ddd;
}

/* Footer içindeki row flex olsun */
footer .container > .row{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:space-between;
  gap:40px;
}

/* Her footer modülü */
footer .footer_modules{
  flex:1 1 280px !important;
  max-width:320px !important;
  float:none !important;
}

/* Başlıklar */
footer .footer_modules .box-heading h5{
  color:#fff;
  font-weight:700;
  margin-bottom:12px;
  border-bottom:2px solid #e10600;
  display:inline-block;
  padding-bottom:4px;
}

/* İçerik */
footer .footer_modules .content,
footer .footer_modules p,
footer .footer_modules a{
  color:#dcdcdc;
  font-size:13px;
  line-height:1.6;
  text-align:left;
}

/* Link hover */
footer .footer_modules a:hover{
  color:#e10600;
  text-decoration:underline;
}

/* Ödeme ikonları alta sabitlensin */
footer img{
  margin-top:10px;
  max-width:260px;
}

/* MOBİL */
@media (max-width:768px){
  footer .container > .row{
    flex-direction:column;
    gap:25px;
  }

  footer .footer_modules{
    max-width:100% !important;
  }
}

