/* =========================================================
   FOOTER  (footer.php ile eşleşir)  — önek: ft
   Koyu marka mavisi, neon üst çizgi, mimari grid, cam kartlar
   ========================================================= */
.ft{
  --neon:#00d9ff; --cyan:#25c3fd; --ice:#7ae7ff; --blue:#0a7fe0;
  --txt:#d6e6f2; --mute:#8fb0c9; --line:rgba(255,255,255,.14);
  --ease:cubic-bezier(.16,1,.3,1);
  position:relative; z-index:5; overflow:hidden;
  margin-top:-36px; border-radius:36px 36px 0 0;
  padding:78px 0 0;
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Arial,sans-serif;
  color:var(--txt);
  background:
    radial-gradient(45% 50% at 92% 6%, rgba(0,200,255,.20), transparent 70%),
    radial-gradient(40% 45% at 4% 96%, rgba(10,127,224,.22), transparent 70%),
    linear-gradient(180deg,#0a2c50 0%,#071f3a 55%,#04162c 100%);
}
.ft *,.ft *::before,.ft *::after{box-sizing:border-box}
/* neon üst çizgi */
.ft::after{
  content:""; position:absolute; left:8%; right:8%; top:0; height:2px; z-index:3;
  background:linear-gradient(90deg,transparent,var(--neon),transparent);
  box-shadow:0 0 18px 2px rgba(0,217,255,.55);
}
/* mimari grid */
.ft::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(122,231,255,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(122,231,255,.06) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 85%);
          mask-image:linear-gradient(180deg,#000 0%,transparent 85%);
  animation:ftGrid 40s linear infinite;
}
@keyframes ftGrid{to{background-position:56px 56px}}

/* arka plan süsleri */
.ft-bg{position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden}
.ft-beam{
  position:absolute; left:-30%; top:var(--t); width:30%; height:1px;
  background:linear-gradient(90deg,transparent,var(--neon),transparent);
  opacity:.55; animation:ftBeam 14s linear infinite; animation-delay:var(--dl);
}
@keyframes ftBeam{to{transform:translateX(450%)}}
/* kule vinç (sağ alt) */
.ft-crane{
  position:absolute; right:3%; bottom:0; width:300px; height:auto;
  color:rgba(122,231,255,.30);
}
.ft-crane-arm{transform-box:view-box; transform-origin:90px 92px; animation:ftArm 16s ease-in-out infinite}
.ft-crane-hook{transform-box:view-box; transform-origin:200px 84px; animation:ftHook 4.5s ease-in-out infinite}
@keyframes ftArm{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}
@keyframes ftHook{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.ft-cube{
  position:absolute; left:var(--x); top:var(--y); width:var(--s); height:var(--s);
  color:rgba(122,231,255,.30); animation:ftFloat 9s ease-in-out infinite; animation-delay:var(--dl);
}
@keyframes ftFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(6deg)}}

/* yerleşim */
.ft-wrap{position:relative; z-index:2; width:min(1220px,100% - 48px); margin:0 auto}
.ft-grid{
  display:grid; gap:44px 40px; align-items:start;
  grid-template-columns:1.25fr 1fr 1.05fr 1.35fr;
  padding-bottom:56px;
}
.ft-col{min-width:0}

/* görünme animasyonu (JS varsa) */
.ft-js [data-ft]{opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease),transform .8s var(--ease); transition-delay:var(--d,0ms)}
.ft-js [data-ft].ft-in{opacity:1; transform:none}

/* başlıklar */
.ft-title{
  margin:0 0 22px; padding-left:14px; position:relative;
  font-size:15px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#fff;
}
.ft-title::before{
  content:""; position:absolute; left:0; top:2px; bottom:2px; width:4px; border-radius:2px;
  background:linear-gradient(180deg,var(--neon),var(--blue)); box-shadow:0 0 10px rgba(0,217,255,.6);
}

/* MARKA */
.ft-logo{display:inline-block; margin-bottom:22px}
.ft-logo img{display:block; max-width:240px; width:100%; height:auto; max-height:90px; object-fit:contain; object-position:left center}
.ft-slogan{
  margin:0 0 14px; font-size:22px; line-height:1.3; font-weight:700; color:#fff; max-width:340px;
  padding-left:16px; border-left:4px solid var(--cyan);
}
.ft-about{margin:0; font-size:14.5px; line-height:1.7; color:var(--mute); max-width:340px}

/* HIZLI MENÜ */
.ft-links{list-style:none; margin:0; padding:0; display:grid; gap:8px; align-items:start}
.ft-link{
  display:flex; align-items:center; gap:11px;
  padding:10px 12px; border-radius:12px; text-decoration:none;
  color:var(--txt); font-size:14.5px; font-weight:600;
  background:rgba(255,255,255,.05); border:1px solid var(--line); border-left:3px solid var(--cyan);
  transition:transform .35s var(--ease),background .3s,color .3s,border-color .3s;
}
.ft-link span{flex:1; min-width:0}
.ft-link-ico{width:19px; height:19px; flex:none; color:var(--ice)}
.ft-link-arr{width:14px; height:14px; flex:none; color:var(--ice); opacity:.8; transition:transform .35s var(--ease)}
.ft-link:hover,.ft-link:focus-visible{
  transform:translateX(6px); color:#fff; border-left-color:var(--neon);
  background:linear-gradient(90deg,rgba(0,217,255,.20),rgba(255,255,255,.05));
  outline:none;
}
.ft-link:hover .ft-link-arr,.ft-link:focus-visible .ft-link-arr{transform:translateX(3px)}
.ft-link.is-active{color:#fff; border-left-color:var(--neon); background:linear-gradient(90deg,rgba(0,217,255,.26),rgba(10,127,224,.12))}
/* alt menü: küçük hap bağlantılar */
.ft-sub{list-style:none; margin:7px 0 2px 14px; padding:0; display:flex; flex-wrap:wrap; gap:6px}
.ft-sublink{
  display:inline-block; padding:5px 11px; border-radius:999px; text-decoration:none;
  font-size:12.5px; font-weight:600; color:var(--mute);
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  transition:background .3s,color .3s,border-color .3s;
}
.ft-sublink:hover,.ft-sublink:focus-visible,.ft-sublink.is-active{color:#fff; border-color:rgba(122,231,255,.5); background:rgba(0,217,255,.16); outline:none}

/* ÇALIŞMA SAATLERİ — tek kart: üstte durum, altta sıkı satırlar */
.ft-hours-card{
  padding:14px 16px 6px; border-radius:16px;
  background:rgba(255,255,255,.06); border:1px solid var(--line); border-left:4px solid var(--cyan);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.ft-status{
  display:inline-flex; align-items:center; gap:8px; margin:0 0 6px;
  padding:5px 12px; border-radius:999px; font-size:12.5px; font-weight:700; color:#ffd3d3;
  background:rgba(255,90,90,.14); border:1px solid rgba(255,120,120,.35);
}
.ft-status i{width:8px; height:8px; border-radius:50%; background:#ff6464; box-shadow:0 0 8px #ff6464}
.ft-status.is-open{color:#c8ffe3; background:rgba(40,220,140,.14); border-color:rgba(70,230,160,.4)}
.ft-status.is-open i{background:#2be08f; box-shadow:0 0 10px #2be08f; animation:ftPulse 1.8s ease-in-out infinite}
@keyframes ftPulse{50%{transform:scale(1.5); opacity:.55}}
.ft-hours-list{list-style:none; margin:0; padding:0}
.ft-hours-list li{
  display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:nowrap;
  padding:10px 0; font-size:13.5px; border-bottom:1px dashed rgba(255,255,255,.14);
}
.ft-hours-list li:last-child{border-bottom:0}
.ft-hours-list span{color:var(--mute); min-width:0}
.ft-hours-list b{flex:none; color:#fff; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap}
.ft-hours-list .is-closed b{color:#ff9d9d}
/* bugünün satırı: yazı büyümez, sadece vurgulanır */
.ft-hours-list .is-today{
  margin:0 -9px; padding-left:9px; padding-right:9px; border-radius:10px; border-bottom-color:transparent;
  background:linear-gradient(90deg,rgba(0,217,255,.18),rgba(0,217,255,.04));
  box-shadow:inset 3px 0 0 var(--neon);
}
.ft-hours-list .is-today span{color:#fff; font-weight:700}
.ft-hours-list .is-today b{color:var(--ice)}
.ft-hours-list .is-today.is-closed b{color:#ff9d9d}

/* İLETİŞİM */
.ft-rows{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.ft-item{display:flex; gap:8px; align-items:stretch}
.ft-row{
  flex:1; min-width:0;
  display:flex; align-items:center; gap:11px; padding:8px 12px 8px 8px; border-radius:16px;
  text-decoration:none; color:var(--txt);
  background:rgba(255,255,255,.06); border:1px solid var(--line);
  transition:transform .35s var(--ease),background .3s,border-color .3s;
}
.ft-row:hover,.ft-row:focus-visible{transform:translateX(5px); background:rgba(0,217,255,.16); border-color:rgba(122,231,255,.5); outline:none}
.ft-row-ico{
  flex:none; width:36px; height:36px; border-radius:11px; display:grid; place-items:center; color:#fff;
  background:linear-gradient(135deg,#1aa7ff,#0a7fe0); box-shadow:0 4px 12px rgba(10,127,224,.45);
}
.ft-row-ico svg{display:block; width:18px; height:18px}
.ft-row-txt{min-width:0; display:flex; flex-direction:column; line-height:1.25}
.ft-row-txt small{font-size:11px; color:var(--mute); letter-spacing:.05em; text-transform:uppercase; font-weight:600}
.ft-row-txt b{font-size:14px; color:#fff; font-weight:700; overflow-wrap:anywhere}
/* adres: çok satırlı, normal ağırlık, ikon üstte */
.ft-row-adr{align-items:flex-start}
.ft-row-adr .ft-row-txt b{font-size:13.5px; font-weight:500; line-height:1.5; color:var(--txt)}
/* WhatsApp: telefon satırının İÇİNDE, sağda küçük yuvarlak düğme (tek kart) */
.ft-item-wa{
  align-items:center; gap:6px; padding-right:8px; border-radius:16px;
  background:rgba(255,255,255,.06); border:1px solid var(--line);
  transition:background .3s,border-color .3s,transform .35s var(--ease);
}
.ft-item-wa .ft-row{background:none; border:0; padding-right:4px}
.ft-item-wa .ft-row:hover,.ft-item-wa .ft-row:focus-visible{transform:none; background:none}
.ft-item-wa:hover,.ft-item-wa:focus-within{transform:translateX(5px); background:rgba(0,217,255,.16); border-color:rgba(122,231,255,.5)}
.ft-wa-btn{
  flex:none; width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; text-decoration:none;
  background:linear-gradient(135deg,#2be08f,#119c5a); box-shadow:0 4px 12px rgba(17,156,90,.45);
  transition:transform .35s var(--ease),box-shadow .3s;
}
.ft-wa-btn svg{display:block; width:20px; height:20px}
.ft-wa-btn:hover,.ft-wa-btn:focus-visible{transform:scale(1.1); box-shadow:0 8px 18px rgba(17,156,90,.6); outline:none}

/* SOSYAL */
.ft-social-wrap{margin-top:22px}
.ft-social-label{display:block; margin-bottom:12px; font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--mute)}
.ft-social{display:flex; gap:12px; flex-wrap:wrap}
.ft-soc{
  width:42px; height:42px; border-radius:50%; display:grid; place-items:center; color:#fff; text-decoration:none;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.22);
  transition:transform .35s var(--ease),background .3s,border-color .3s,box-shadow .3s;
}
.ft-soc svg{width:19px; height:19px}
.ft-soc:hover,.ft-soc:focus-visible{transform:translateY(-4px) scale(1.06); border-color:transparent; outline:none; box-shadow:0 10px 22px rgba(0,0,0,.35)}
.ft-ig:hover,.ft-ig:focus-visible{background:linear-gradient(45deg,#f9a825,#e1306c 55%,#833ab4)}
.ft-fb:hover,.ft-fb:focus-visible{background:#1877f2}
.ft-yt:hover,.ft-yt:focus-visible{background:#ff0000}

/* ALT ŞERİT */
.ft-bottom{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
  padding:22px 0 26px; border-top:1px solid var(--line);
}
.ft-copy{margin:0; text-align:center; font-size:13.5px; color:var(--mute)}
.ft-right{justify-self:end; display:flex; align-items:center; gap:16px}
.ft-by{
  display:inline-flex; align-items:center; gap:9px; padding:7px 14px; border-radius:999px;
  text-decoration:none; color:var(--txt); font-size:13px; font-weight:700;
  background:rgba(255,255,255,.92); border:1px solid rgba(255,255,255,.5);
  transition:transform .35s var(--ease),box-shadow .3s;
}
.ft-by small{font-size:11px; color:#3b4d5e; letter-spacing:.06em; text-transform:uppercase; font-weight:600}
.ft-by img{display:block; height:24px; width:auto; max-width:110px; object-fit:contain}
.ft-by:hover,.ft-by:focus-visible{transform:translateY(-3px); box-shadow:0 8px 20px rgba(0,217,255,.35); outline:none}
.ft-top{
  display:inline-flex; align-items:center; gap:9px; cursor:pointer;
  padding:10px 16px; border-radius:999px; font:700 13px/1 'Segoe UI',system-ui,sans-serif; color:#fff;
  background:rgba(255,255,255,.08); border:1px solid var(--line); border-left:3px solid var(--cyan);
  transition:transform .35s var(--ease),background .3s;
}
.ft-top svg{width:15px; height:15px; transition:transform .35s var(--ease)}
.ft-top:hover,.ft-top:focus-visible{background:rgba(0,217,255,.22); transform:translateY(-3px); outline:none}
.ft-top:hover svg{transform:translateY(-3px)}

/* --- dinamik footer eklemeleri --- */
.ft-tw:hover,.ft-tw:focus-visible{background:#000}
.ft-li:hover,.ft-li:focus-visible{background:#0a66c2}
.ft-tt:hover,.ft-tt:focus-visible{background:linear-gradient(45deg,#25f4ee,#111 50%,#fe2c55)}
.ft-row-wa .ft-row-ico{background:linear-gradient(135deg,#2be08f,#119c5a); box-shadow:0 4px 12px rgba(17,156,90,.45)}
/* çalışma saatleri yoksa 3 sütun */
@media (min-width:1101px){
  .ft-grid.ft-grid-3{grid-template-columns:1.4fr 1fr 1.3fr}
}

/* TABLET */
@media (max-width:1100px){
  .ft-grid{grid-template-columns:1fr 1fr; gap:42px 32px}
  .ft-brand,.ft-contact{grid-column:1 / -1}
  .ft-rows{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
}
@media (max-width:900px){
  .ft{padding-top:64px}
  .ft-crane{width:230px}
}

/* MOBİL */
@media (max-width:700px){
  .ft{margin-top:-28px; border-radius:28px 28px 0 0; padding-top:56px}
  .ft-wrap{width:min(1220px,100% - 36px)}
  .ft-grid{grid-template-columns:1fr; gap:38px; padding-bottom:40px}
  .ft-slogan{font-size:20px}
  .ft-links{grid-template-columns:1fr 1fr; gap:8px}
  .ft-sub{margin-left:6px}
  .ft-link{padding:10px 11px; font-size:13.5px; gap:9px}
  .ft-rows{grid-template-columns:1fr}
  .ft-cube{display:none}
  /* sabit .qc (sol alt) ve .hsm butonlarının altta kalmaması için boşluk */
  .ft-bottom{grid-template-columns:1fr; justify-items:center; gap:14px; padding:20px 0 86px}
  .ft-bottom-side{display:none}
  .ft-right{justify-self:center; order:-1; flex-wrap:wrap; justify-content:center}
  .ft-copy{order:1}
}
@media (max-width:380px){
  .ft-links{grid-template-columns:1fr}
}

/* hareket azaltma */
@media (prefers-reduced-motion:reduce){
  .ft::before,.ft-beam,.ft-crane-arm,.ft-crane-hook,.ft-cube,.ft-status.is-open i{animation:none}
  .ft [data-ft]{opacity:1; transform:none; transition:none}
  .ft-link,.ft-row,.ft-soc,.ft-top,.ft-wa-btn,.ft-sublink,.ft-item-wa{transition:none}
}
/* =========================================================
   DESIGN BY — koyu cam hap + dönen neon çerçeve + ışık süpürmesi
   (dosyanın sonunda olduğu için yukarıdaki .ft-by kurallarını ezer)
   Logo tek renk koyuysa beyaza çevrilir. Logo zaten beyaz/renkliyse:
   .ft-by{ --ft-by-tone:none }  yazman yeterli.
   ========================================================= */
@property --ft-a{syntax:'<angle>'; inherits:false; initial-value:0deg}

.ft-by{
  --ft-by-tone:brightness(0) invert(1);
  position:relative; isolation:isolate; overflow:hidden;
  gap:11px; padding:9px 18px 9px 15px; border-radius:999px;
  color:#fff;
  background:linear-gradient(180deg,rgba(50,88,116,.55) 0%,rgba(8,28,52,.9) 100%);
  border:1px solid rgba(135,208,255,.22);
  box-shadow:0 0 16px rgba(0,190,255,.14), inset 0 1px 0 rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;
}
/* dönen neon çerçeve */
.ft-by::before{
  content:""; position:absolute; inset:0; z-index:1; border-radius:inherit; padding:1.5px; pointer-events:none;
  background:conic-gradient(from var(--ft-a),transparent 0 62%,var(--neon) 84%,#fff 92%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:ftSpin 4.5s linear infinite;
}
@keyframes ftSpin{to{--ft-a:360deg}}
/* ışık süpürmesi (birkaç saniyede bir geçer) */
.ft-by-glow{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.26) 50%,transparent 62%);
  transform:translateX(-130%); animation:ftShine 6s ease-in-out infinite;
}
@keyframes ftShine{0%,55%{transform:translateX(-130%)} 85%,100%{transform:translateX(130%)}}

.ft-by small,.ft-by-sep,.ft-by img{position:relative; z-index:2}
.ft-by small{
  display:inline-flex; align-items:center; gap:8px;
  font-size:10.5px; font-weight:700; letter-spacing:.22em; color:var(--ice); text-transform:uppercase;
}
/* canlı nokta */
.ft-by small::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--neon);
  box-shadow:0 0 8px 1px rgba(0,217,255,.9); animation:ftPulse 2s ease-in-out infinite;
}
.ft-by-sep{width:1px; height:20px; background:linear-gradient(180deg,transparent,rgba(122,231,255,.7),transparent)}
.ft-by img{
  height:22px; max-width:110px;
  filter:var(--ft-by-tone) drop-shadow(0 0 0 rgba(0,217,255,0));
  animation:ftLogoGlow 3.6s ease-in-out infinite;
  transition:transform .35s var(--ease);
}
@keyframes ftLogoGlow{50%{filter:var(--ft-by-tone) drop-shadow(0 0 7px rgba(0,217,255,.75))}}

.ft-by:hover,.ft-by:focus-visible{
  transform:translateY(-3px); border-color:rgba(122,231,255,.5);
  box-shadow:0 10px 26px rgba(0,217,255,.38), 0 0 18px rgba(0,190,255,.3), inset 0 1px 0 rgba(255,255,255,.18);
}
.ft-by:hover::before,.ft-by:focus-visible::before{animation-duration:1.6s}
.ft-by:hover .ft-by-glow{animation-duration:2.2s}
.ft-by:hover img,.ft-by:focus-visible img{transform:scale(1.07)}

@media (max-width:700px){
  .ft-by{padding:8px 15px 8px 13px; gap:9px}
  .ft-by img{height:20px}
}
@media (prefers-reduced-motion:reduce){
  .ft-by::before,.ft-by-glow,.ft-by img,.ft-by small::before{animation:none}
}