/* ═══════════════════════════════════════════════════════════════
   Zirve Teknik Servis — MODERN (son katman, EN SON yüklenir)
   CTA parallax · sticky WhatsApp/telefon düğmeleri · hizmetler sayfası
   bölümleri · ince hareket/tutarlılık düzeltmeleri.
   Renkler tokens.css'ten; hex yok.
   ═══════════════════════════════════════════════════════════════ */

/* ═══ CTA bandı — sabit (parallax) arka plan ═══
   Teknik: bölüm clip-path:inset(0) ile kırpılır, içindeki fixed görsel katmanı
   yalnız bu bölümün kutusunda görünür → sayfa kayarken görsel sabit, içerik kayar.
   background-attachment:fixed kullanılmaz (iOS'ta çalışmaz); katman 100lvh olduğu için
   adres çubuğu değişse de boşluk/kesik oluşmaz. Footer kısa olsa da görsel viewport'u
   tamamen kapladığından scroll sonunda boşluk kalmaz. */
.zt-cta{
  position:relative;isolation:isolate;
  clip-path:inset(0);
  display:grid;align-items:center;
  min-height:clamp(440px,70vh,680px);
  background:var(--navy-deep);color:var(--white);
}
.zt-cta__bg{
  position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;
  z-index:-1;background:var(--navy-grad);overflow:hidden;
}
.zt-cta__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zt-cta__bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,var(--deep-90) 0%,var(--deep-80) 50%,var(--deep-65) 100%);
}
.zt-cta:not(.has-bg) .zt-cta__bg::after{
  background:radial-gradient(60% 120% at 85% 20%,var(--steel-glow),transparent 70%),url("../images/deco/topo.svg") right -20px bottom -30px/min(560px,70%) no-repeat;
}
.zt-cta__in{
  display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:clamp(28px,5vw,64px);
  padding-block:clamp(72px,9vw,120px);
}
.zt-cta .zt-eye{color:var(--steel-soft);margin-bottom:14px}
.zt-cta h2{color:var(--white);font-size:clamp(2rem,4vw,3rem);line-height:1.12;letter-spacing:-.02em;margin:0 0 14px;max-width:18ch}
.zt-cta p{color:var(--white-85);max-width:52ch;margin:0}
.zt-cta__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--sp-3)}
.zt-cta .zt-btn--wa{background:var(--white-08);border:1px solid var(--white-40);color:var(--white);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.zt-cta .zt-btn--wa:hover{background:var(--white);border-color:var(--white);color:var(--navy)}
.zt-cta__actions{
  display:grid;gap:14px;justify-items:start;align-content:center;
  padding:clamp(22px,3vw,34px);border-radius:20px;
  background:var(--white-08);border:1px solid var(--white-25);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.zt-cta__tels{display:grid;gap:10px}
.zt-cta__tels .zt-tel{display:flex;align-items:center;gap:12px;color:var(--white);text-decoration:none;font:800 clamp(1.25rem,2.2vw,1.625rem)/1.2 var(--font-heading);letter-spacing:.01em}
.zt-cta__tels .zt-tel .zt-ico{width:22px;height:22px;color:var(--steel-soft)}
.zt-cta__tels .zt-tel:hover{text-decoration:underline;text-underline-offset:5px}
.zt-cta__tels .zt-tel+.zt-tel{font-size:var(--fs-lead)}
.zt-cta__note{display:flex;align-items:center;gap:8px;color:var(--white-70);font-size:var(--fs-sm)}
.zt-cta__note .zt-ico{width:16px;height:16px}
@media (max-width:900px){
  .zt-cta__in{grid-template-columns:1fr}
  .zt-cta__tels .zt-tel+.zt-tel{display:flex}
}
/* kırpma desteklenmiyorsa ya da hareket azaltılmışsa: klasik (kayan) arka plan */
@supports not (clip-path:inset(0)){
  .zt-cta{overflow:hidden}
  .zt-cta__bg{position:absolute;height:100%}
}
@media (prefers-reduced-motion:reduce){
  .zt-cta__bg{position:absolute;height:100%}
}

/* ═══ Sticky iletişim düğmeleri: sol WhatsApp, sağ telefon (mobil + masaüstü) ═══ */
.zt-fab{
  position:fixed;z-index:75;bottom:calc(20px + env(safe-area-inset-bottom));
  isolation:isolate;
  display:grid;place-items:center;
  width:var(--fab);height:var(--fab);border-radius:50%;
  color:var(--white);text-decoration:none;
  box-shadow:0 10px 26px var(--deep-45),0 2px 6px var(--deep-25);
  transition:transform var(--tr) var(--ease),box-shadow var(--tr) var(--ease);
}
.zt-fab--wa{left:20px;background:var(--wa)}
.zt-fab--tel{right:20px;background:var(--red)}
.zt-fab:hover{transform:translateY(-3px) scale(1.05);color:var(--white);box-shadow:0 16px 34px var(--deep-45)}
.zt-fab--wa:hover{background:var(--wa-deep)}
.zt-fab--tel:hover{background:var(--red-deep)}
.zt-fab:focus-visible{outline:3px solid var(--white);outline-offset:3px;box-shadow:0 0 0 6px var(--navy)}
.zt-fab__ico{display:grid;place-items:center;position:relative;z-index:1}
.zt-fab .zt-ico{width:30px;height:30px}
.zt-fab--tel .zt-ico{width:26px;height:26px;animation:zt-ring 2.6s ease-in-out infinite;transform-origin:50% 50%}
/* wave: iki halka dönüşümlü yayılır */
.zt-fab::before,.zt-fab::after{
  content:'';position:absolute;inset:0;z-index:-1;border-radius:50%;
  background:inherit;opacity:0;
  animation:zt-wave 2.8s cubic-bezier(.2,.6,.3,1) infinite;
}
.zt-fab::after{animation-delay:1.4s}
@keyframes zt-wave{0%{transform:scale(1);opacity:.5}80%,100%{transform:scale(1.85);opacity:0}}
@keyframes zt-ring{0%,60%,100%{transform:rotate(0)}66%{transform:rotate(-14deg)}72%{transform:rotate(12deg)}78%{transform:rotate(-10deg)}84%{transform:rotate(8deg)}90%{transform:rotate(0)}}
/* masaüstünde üzerine gelince açıklama etiketi */
.zt-fab__tip{
  position:absolute;top:50%;white-space:nowrap;
  padding:9px 14px;border-radius:999px;background:var(--navy-deep);color:var(--white);
  font:600 var(--fs-sm)/1 var(--font-body);box-shadow:var(--shadow-soft);
  opacity:0;pointer-events:none;visibility:hidden;
  transition:opacity var(--tr-fast) var(--ease),transform var(--tr) var(--ease),visibility 0s linear var(--tr);
}
.zt-fab--wa .zt-fab__tip{left:calc(100% + 12px);transform:translate(-8px,-50%)}
.zt-fab--tel .zt-fab__tip{right:calc(100% + 12px);transform:translate(8px,-50%)}
@media (hover:hover) and (min-width:768px){
  .zt-fab:hover .zt-fab__tip,.zt-fab:focus-visible .zt-fab__tip{opacity:1;visibility:visible;transform:translate(0,-50%);transition-delay:0s}
}
@media (max-width:767.98px){
  :root{--fab:52px;--totop-b:80px}
  .zt-fab{bottom:calc(16px + env(safe-area-inset-bottom))}
  .zt-fab--wa{left:16px}
  .zt-fab--tel{right:16px}
  .zt-fab .zt-ico{width:28px;height:28px}
  .zt-fab--tel .zt-ico{width:24px;height:24px}
  .zt-totop{right:20px;width:40px;height:40px}
}
@media (min-width:768px){:root{--totop-b:96px}}
.zt-mnav-open .zt-fab,body.is-locked .zt-fab{opacity:0;pointer-events:none}

/* ═══ Hizmetler sayfası: kategori bölümleri ═══ */
.zt-cat-sec{padding-block:clamp(40px,5vw,60px)}
.zt-cat-sec .zt-services{gap:clamp(24px,3vw,36px)}
.zt-services__head{grid-template-columns:auto minmax(0,1fr);gap:clamp(14px,2vw,22px);align-items:center}
.zt-services__icon{
  display:grid;place-items:center;width:56px;height:56px;border-radius:16px;
  background:var(--navy);color:var(--white);box-shadow:0 10px 24px var(--navy-15);
}
.zt-services__icon .zt-ico{width:26px;height:26px}
.zt-services__head h2{margin:0 0 4px;display:block}
.zt-services__head p{max-width:62ch}
.zt-page-hizmetler .zt-services{padding:0;background:none;border:0;box-shadow:none}
.zt-cat-sec{scroll-margin-top:calc(var(--header-h) + 8px)}

/* ═══ Genel tutarlılık / mikro etkileşim ═══ */
.zt-card,.zt-cat,.zt-services__card{will-change:auto}
a,button{-webkit-tap-highlight-color:transparent}
img{height:auto}
.zt-img>img,.zt-cat__media img,.zt-services__card .zt-img img{height:100%}
.zt-footer h4{color:var(--white)}
.zt-footer a{transition:color var(--tr-fast) var(--ease)}
.zt-footer__logo img{transition:opacity var(--tr-fast) var(--ease)}
.zt-footer__logo:hover img{opacity:.85}
/* reveal: kartlar küçük kademeyle girer */
.zt-cats__grid>.zt-reveal:nth-child(3n+2){transition-delay:.08s}
.zt-cats__grid>.zt-reveal:nth-child(3n+3){transition-delay:.16s}
@media (max-width:991.98px){
  .zt-cats__grid>.zt-reveal:nth-child(n){transition-delay:0s}
  .zt-cats__grid>.zt-reveal:nth-child(2n){transition-delay:.08s}
}
/* yatay taşma güvencesi */
html,body{max-width:100%;overflow-x:clip}
@media (max-width:767.98px){
  .zt-footer__bar{padding-bottom:calc(16px + 72px + env(safe-area-inset-bottom))}
}


/* ═══ Footer arka planı: sade SVG (sinyal halkaları, sağ alttan yayılır; sol taraf temiz kalır) ═══ */
.zt-footer{
  background-color:var(--navy-deep);
  background-image:url("../images/deco/footer-bg.svg");
  background-repeat:no-repeat;
  background-position:right bottom;
  background-size:auto 100%;
}
@media (max-width:767.98px){.zt-footer{background-size:auto 38%;background-position:right bottom}}

/* ═══ Açılır menü (panel menüsü alt öğeleri / dinamik blog yazıları): tek sütunlu dar panel ═══ */
.zt-nav__item--mega:has(>.zt-mega--simple){position:relative}
.zt-mega--simple{width:min(360px,calc(100vw - 2*var(--pad)))}
.zt-mega--simple .zt-mega__grid{grid-template-columns:1fr;padding:10px}
.zt-mega--simple .zt-mega__group{padding:0;background:none}
.zt-mega--simple .zt-mega__group ul{padding-left:0;gap:2px}
.zt-mega--simple .zt-mega__group li a{min-height:44px;padding:10px 14px;border-radius:10px;font-size:var(--fs-md);font-weight:600;color:var(--ink)}
.zt-mega--simple .zt-mega__group li a:hover,.zt-mega--simple .zt-mega__group li a:focus-visible{background:var(--gray);color:var(--navy);transform:none}
.zt-mega--simple .zt-mega__group li a::after{display:none}
.zt-mega--simple .zt-mega__group li:last-child a{margin-top:6px;border-top:1px solid var(--line);border-radius:0 0 10px 10px;color:var(--navy);font-weight:700}


/* ═══ Üstte/altta boşluk düzeltmeleri ═══ */
/* Scroll'da katlanan topbar'ın 1px şeffaf alt çizgisi header'ın üstünde ince boşluk bırakıyordu */
.zt-top.is-scrolled .zt-topbar{border-bottom-width:0;padding:0}
.zt-top.is-scrolled .zt-header{background:var(--white)}
/* Overscroll / adres çubuğu daralınca görünen zemin: üst kapak ve footer lacivert olduğundan html lacivert; gövde beyaz kalır */
html{background-color:var(--navy-deep)}
body{background-color:var(--white);min-height:100vh;min-height:100dvh}
/* Çentik / durum çubuğu (viewport-fit=cover): sabit üst alan güvenli bölgeyi kendi zeminiyle doldurur */
.zt-top{padding-top:env(safe-area-inset-top)}
.zt-top--over:not(.is-scrolled){padding-top:env(safe-area-inset-top)}
.zt-top.is-scrolled{background:var(--white)}
.zt-top--over:not(.is-scrolled){background:transparent}
/* Footer güvenli alt bölgeyi (ev çubuğu) kendi lacivert zeminiyle kapatır */
.zt-footer{padding-bottom:env(safe-area-inset-bottom)}
/* Mobil menü tam ekran: dinamik viewport + güvenli bölgeler */
.zt-mnav{height:100vh;height:100dvh;padding-top:env(safe-area-inset-top)}