/* ============================================================
   footer.css — açık zemin, modern; güven şeridi + kolonlar + alt bar
   ============================================================ */
.site-footer{ background:var(--footer-menu-bg-color); border-top:1px solid var(--seperator-color); margin-top:48px; }

/* üst güven şeridi */
.footer-trust{ border-bottom:1px solid var(--seperator-color); }
.footer-trust .container{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; padding:28px 18px; }
.ft-trust-item{ display:flex; align-items:center; gap:13px; }
.ft-trust-item .ft-ico{
  width:44px; height:44px; flex:0 0 auto; border-radius:13px;
  background:var(--primary-tint); color:var(--primary-color);
  display:flex; align-items:center; justify-content:center; font-size:18px;
}
.ft-trust-item .ft-ico .fa-star{ color:var(--star-color); }
.ft-trust-item b{ display:block; color:var(--primary-color); font-size:14px; font-weight:700; }
.ft-trust-item small{ font-size:12px; color:var(--muted); }

/* menü kolonları */
.footer-main{ padding:44px 18px 36px; }
/* Sütun sayısı SABİT DEĞİL: ilk parça tanıtım bloğu, kalanlar
   navigator_bottom ağacındaki etkin grup sayısına göre değişiyor
   (yönetim panelinden grup açılıp kapanabiliyor). Sabit dört parça
   yazılırsa beşinci grup eklendiğinde ızgaranın dışına taşıyor,
   iki grup kalınca da sütunlar gereksiz daralıyordu.
   auto-fit + minmax ikisini de kendiliğinden çözüyor. */
/* DİKKAT: ilk track `fr` OLAMAZ.
   `1.4fr repeat(auto-fit, minmax(150px,1fr))` yazılmıştı ve grid
   spesifikasyonu otomatik tekrarı (auto-fit/auto-fill) esnek (`fr`)
   boyutlarla aynı track listesinde kabul etmiyor: bildirim tamamen
   düşüyor, grid tek kolona iniyor ve kolonlar ALT ALTA yığılıyor.
   Tarayıcıda ölçüldü (1440px pencere, 1204px kapsayıcı):
     1.4fr repeat(auto-fit,…)  -> hesaplanan "1204px", 1 track, 4 satır
     280px  repeat(auto-fit,…) -> "280px 274 274 274", 1 satır
   Sabit ilk track seçildi: geniş tanıtım kolonu korunuyor ve menü
   kolonu sayısı değişse de (navigator ağacından dinamik geliyor)
   uyum sağlıyor. */
.footer-grid{ display:grid; grid-template-columns:280px repeat(auto-fit, minmax(150px, 1fr)); gap:34px; }
.footer-about .ft-logo{ height:36px; margin-bottom:16px; }
.footer-about p{ font-size:13px; line-height:1.65; color:var(--muted); margin:0 0 18px; max-width:300px; }
.footer-contact{ display:flex; flex-direction:column; gap:10px; }
.footer-contact a, .footer-contact span{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--muted); font-weight:500; }
.footer-contact i{ width:16px; color:var(--accent-color); }
.footer-contact a:hover{ color:var(--primary-color); }

.footer-col h5{
  color:var(--footer-menu-label-color); font-size:11.5px; font-family:var(--font-body);
  font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin:4px 0 16px;
}
.footer-col ul{ list-style:none; margin:0; padding:0; }
.footer-col li{ padding:var(--footer-menu-padding); }
.footer-col a{ font-size:13.5px; color:var(--footer-menu-color); font-weight:500; }
.footer-col a:hover{ color:var(--footer-menu-hover-color); }

/* sosyal */
.footer-social{ display:flex; gap:9px; margin-top:18px; }
.footer-social a{
  width:36px; height:36px; border-radius:11px;
  background:#fff; border:1px solid var(--seperator-color);
  display:flex; align-items:center; justify-content:center; font-size:15px; color:var(--primary-color);
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.footer-social a:hover{ background:var(--primary-color); border-color:var(--primary-color); color:#fff; }

/* alt bar */
.footer-bottom{ background:var(--light-gray); border-top:1px solid var(--seperator-color); }
.footer-bottom .container{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 18px; flex-wrap:wrap; }
.footer-copy{ font-size:12.5px; color:var(--muted); }

/* Çerez tercihleri bağlantısı — telif satırının içinde.
   Altı çizili duruyor: bu bir eylem bağlantısı, düz metin değil.
   Rızayı geri almanın görünür olması uyum gereği, bu yüzden
   .footer-copy'nin soluk rengini DEVRALMIYOR, bir ton koyu. */
.footer-ayrac{ margin:0 6px; color:var(--muted-soft); }
.footer-cerez{
  font-size:12.5px; color:var(--ink);
  text-decoration:underline; text-underline-offset:2px;
}
.footer-cerez:hover{ color:var(--primary-color); }
.footer-cerez:focus-visible{ outline:2px solid var(--accent-color); outline-offset:2px; border-radius:3px; }
.footer-pay{ display:flex; align-items:center; gap:7px; }
.footer-pay .pay-chip{
  height:26px; padding:0 10px; border-radius:7px; background:#fff;
  border:1px solid var(--seperator-color);
  display:flex; align-items:center; font-size:10.5px; font-weight:800; color:var(--primary-color);
  font-family:var(--font-head); letter-spacing:.03em;
}
.footer-secure{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); }
.footer-secure i{ color:var(--success-color); }

@media (max-width:991px){
  .footer-trust .container{ grid-template-columns:repeat(2,1fr); gap:20px; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:26px; }
  .footer-about{ grid-column:1/-1; }
}
@media (max-width:575px){
  .footer-trust .container{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .footer-bottom .container{ flex-direction:column; align-items:flex-start; }
}

/* ---------- Scroll-top ---------- */
#ScrollTop{
  position:fixed; right:22px; bottom:24px; z-index:150;
  width:46px; height:46px; border-radius:14px; background:var(--primary-color); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:18px; cursor:pointer;
  box-shadow:var(--shadow-md); opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s, background .15s;
}
#ScrollTop.active{ opacity:1; visibility:visible; transform:translateY(0); }
#ScrollTop:hover{ background:var(--accent-color); }

/* WhatsApp destek */
#WhatsApp{
  position:fixed; right:22px; bottom:78px; z-index:150;
  width:46px; height:46px; border-radius:14px; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:22px;
  box-shadow:var(--shadow-md);
}
#WhatsApp:hover{ filter:brightness(.95); }
