/* ═══════════════════════════════════════════════════════════════
   Zirve Teknik Servis — HOME (pages/index.php bölüm stilleri)
   Hex yok: yalnız tokens.css değişkenleri. Bölümler: hero, cats,
   steps, guide, dark-band, area, faq (+ reveal gecikmeleri).
   ═══════════════════════════════════════════════════════════════ */

/* ── Reveal gecikmeleri (base.css .zt-reveal + JS .is-in) ── */
.zt-reveal--1{transition-delay:0s}
.zt-reveal--2{transition-delay:.08s}
.zt-reveal--3{transition-delay:.16s}
.zt-reveal--4{transition-delay:.24s}
.zt-reveal--5{transition-delay:.32s}

/* ═══ 5.1 Hero — tam ekran (100vw x 100svh), video/poster arka plan ═══
   Header (şeffaf) bu bloğun ÜSTÜNE biner. Video: main.js kaynakları yalnız
   masaüstü + hareket serbest + veri tasarrufu kapalıyken yükler; aksi halde poster. */
.zt-hero{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;
  width:100%;min-height:70vh;min-height:70svh;
  background:var(--navy-deep);color:var(--white);
}
.zt-hero__bg{position:absolute;inset:0;z-index:-1}
.zt-hero__m{position:absolute;inset:0}
.zt-hero__m--mob{display:none}
@media (max-width:767.98px){
  .zt-hero--dual .zt-hero__m--desk{display:none}
  .zt-hero--dual .zt-hero__m--mob{display:block}
}
.zt-hero__poster,.zt-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zt-hero__poster{animation:zt-kenburns 26s ease-in-out infinite alternate}
.zt-hero__video{opacity:0;transition:opacity 1s var(--ease)}
.zt-hero.is-playing .zt-hero__video{opacity:1}
.zt-hero.is-playing .zt-hero__poster{animation:none}
@keyframes zt-kenburns{from{transform:scale(1)}to{transform:scale(1.06)}}
/* okunaklı koyu lacivert perde: solda güçlü, alt ve üstte ek koyuluk */
.zt-hero__shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,var(--deep-90) 0%,var(--deep-80) 38%,var(--deep-45) 72%,var(--deep-25) 100%),
    linear-gradient(180deg,var(--deep-45) 0%,var(--deep-00) 28%,var(--deep-00) 62%,var(--deep-80) 100%);
}
.zt-hero__in{
  flex:1;display:flex;align-items:center;
  padding-top:calc(var(--topbar-h) + var(--header-h) + clamp(12px,2.4vw,32px));
  padding-bottom:clamp(72px,7vw,88px); /* altta kaydır ipucuna yer */
}
.zt-hero__copy{display:grid;gap:14px;align-content:center;min-width:0;max-width:620px}
.zt-hero__copy h1{
  margin:0;color:var(--white);
  font-size:clamp(2rem,3.2vw,3rem);line-height:1.1;letter-spacing:-.025em;max-width:22ch;
  text-shadow:0 2px 30px var(--deep-45);
}
.zt-hero .zt-eye{color:var(--steel-soft)}
.zt-hero .zt-lead{margin:0;color:var(--white-85);max-width:52ch;font-size:1.0625rem;line-height:1.65}
.zt-hero__actions{display:flex;flex-wrap:nowrap;gap:12px;margin-top:10px;align-items:center}
.zt-hero .zt-btn{min-height:48px;padding:10px 24px}
/* kaydır ipucu: hero'nun alt ortasında */
.zt-hero__scroll{
  position:absolute;left:50%;bottom:clamp(20px,3.2vw,34px);z-index:2;
  transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:10px;
  min-width:44px;min-height:44px;padding:4px 10px;
  color:var(--white-85);text-decoration:none;
  font:700 .6875rem/1 var(--font-heading);letter-spacing:.2em;text-transform:uppercase;
  transition:color var(--tr-fast) var(--ease);
}
.zt-hero__scroll:hover,.zt-hero__scroll:focus-visible{color:var(--white)}
.zt-hero__scroll i{
  position:relative;display:block;width:24px;height:38px;
  border:1.5px solid var(--white-70);border-radius:13px;
  transition:border-color var(--tr-fast) var(--ease),background var(--tr-fast) var(--ease);
}
.zt-hero__scroll:hover i{border-color:var(--white);background:var(--white-08)}
.zt-hero__scroll i::after{
  content:'';position:absolute;left:50%;top:7px;width:3px;height:8px;margin-left:-1.5px;border-radius:2px;
  background:var(--white);animation:zt-scroll-dot 1.8s ease-in-out infinite;
}
@keyframes zt-scroll-dot{0%{transform:translateY(0);opacity:1}70%{transform:translateY(13px);opacity:0}100%{opacity:0}}

/* ═══ 5.2 Kategoriler — 6 kompakt kart (3 x 2) ═══ */
.zt-cats__head{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:var(--sp-5);align-items:end;
  margin-bottom:clamp(28px,4vw,48px);
}
.zt-cats__head h2{margin:12px 0 0;font-size:clamp(1.9rem,3.4vw,2.75rem)}
.zt-cats__intro{color:var(--ink-soft);margin:0;max-width:52ch}
.zt-cats__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.zt-cat{
  position:relative;display:flex;flex-direction:column;min-width:0;
  background:var(--white);border:1px solid var(--navy-10);border-radius:18px;overflow:hidden;
  box-shadow:var(--shadow-soft);
  transition:transform var(--tr) var(--ease),box-shadow var(--tr) var(--ease),border-color var(--tr) var(--ease);
}
.zt-cat:hover{transform:translateY(-5px);box-shadow:var(--shadow-lift);border-color:var(--navy-15)}
.zt-cat__media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--steel-soft)}
.zt-cat__media img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.zt-cat:hover .zt-cat__media img{transform:scale(1.06)}
.zt-cat__media::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--deep-00) 50%,var(--deep-45) 100%)}
.zt-cat__media .zt-noimg{position:absolute;inset:0;aspect-ratio:auto}
.zt-cat__no{
  position:absolute;right:12px;top:12px;z-index:1;
  font:800 .75rem/1 var(--font-heading);letter-spacing:.12em;color:var(--white);
  padding:6px 10px;border-radius:999px;background:var(--deep-65);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.zt-cat__body{display:flex;flex-direction:column;gap:10px;padding:18px 20px 20px;flex:1}
.zt-cat__top{display:flex;align-items:center;gap:12px}
.zt-cat__badge{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:11px;background:var(--navy);color:var(--white)}
.zt-cat__badge .zt-ico{width:19px;height:19px}
.zt-cat__body h3{margin:0;font-size:1.1875rem;line-height:1.25}
.zt-cat__body h3 a{color:var(--navy);text-decoration:none}
.zt-cat__body h3 a::after{content:'';position:absolute;inset:0;z-index:1} /* kartın tamamı tıklanır */
.zt-cat__body h3 a:hover{color:var(--navy-deep)}
.zt-cat__body>p{
  margin:0;color:var(--ink-soft);font-size:var(--fs-md);line-height:1.55;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.zt-cat__chips{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 0;padding:0;list-style:none}
.zt-cat__chips li{position:relative;z-index:2}
.zt-cat__chips :is(a,span){
  display:inline-flex;align-items:center;min-height:30px;padding:4px 11px;border-radius:999px;
  background:var(--gray);border:1px solid var(--line);
  color:var(--navy);font:600 var(--fs-xs)/1.2 var(--font-body);text-decoration:none;
  transition:background var(--tr-fast) var(--ease),color var(--tr-fast) var(--ease),border-color var(--tr-fast) var(--ease);
}
.zt-cat__chips a:hover,.zt-cat__chips a:focus-visible{background:var(--navy);border-color:var(--navy);color:var(--white)}
.zt-cat__more{
  position:relative;z-index:2;margin-top:auto;padding-top:6px;align-self:flex-start;
  display:inline-flex;align-items:center;gap:8px;min-height:36px;
  font:700 var(--fs-sm)/1 var(--font-body);color:var(--navy);text-decoration:none;
}
.zt-cat__more .zt-ico{width:16px;height:16px;color:var(--red);transition:transform var(--tr-fast) var(--ease)}
.zt-cat__more:hover{color:var(--red-deep)}
.zt-cat:hover .zt-cat__more .zt-ico,.zt-cat__more:hover .zt-ico{transform:translateX(4px)}

/* ═══ 5.3 Süreç (4 adım, çizgi .is-in ile dolar) ═══ */
.zt-steps__head{max-width:var(--measure)}
.zt-steps__head h2{margin:12px 0 10px}
.zt-steps__alt{color:var(--ink-soft);margin:0}
.zt-steps__track{
  position:relative;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--sp-3);margin-top:var(--sp-5);
}
.zt-steps__track::before{
  content:'';position:absolute;left:0;right:0;top:23px;height:2px;
  background:var(--steel-soft);
  transform:scaleX(0);transform-origin:left;
  transition:transform .9s var(--ease) .15s;
}
.zt-steps.is-in .zt-steps__track::before{transform:scaleX(1)}
.zt-steps__item{position:relative;display:grid;gap:10px;justify-items:start;min-width:0}
.zt-steps__num{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;background:var(--white);
  border:1px solid var(--navy);border-radius:50%;
  color:var(--navy);font:800 1.0625rem/1 var(--font-heading);
}
.zt-steps__item h3{margin:0;font-size:1.125rem}
.zt-steps__item p{margin:0;max-width:46ch;color:var(--ink-soft);font-size:var(--fs-md)}

/* ═══ 5.4 TV arıza rehberi ═══ */
.zt-guide__in{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:var(--sp-5);align-items:start;
}
.zt-guide__copy{min-width:0}
.zt-guide__copy h2{margin:12px 0 10px}
.zt-guide__intro{color:var(--ink-soft);margin:0 0 var(--sp-4)}
.zt-guide .zt-acc+.zt-acc{margin-top:10px}
/* akordeon chevron taşıyıcısı: tek birim döner (svg sınıfsız) */
.zt-acc .zt-acc__chev{display:inline-flex;align-items:center;justify-content:center;line-height:0}
/* akordeon içindeki küçük tel satırı */
.zt-acc[open] .zt-guide__tel{
  display:flex;align-items:center;gap:8px;
  color:var(--navy);font-weight:600;
}
.zt-acc .zt-guide__tel:hover,.zt-acc .zt-guide__tel:focus-visible{color:var(--red-deep)}
.zt-guide__tel .zt-ico{width:16px;height:16px;flex:none;color:var(--steel)}
.zt-guide__media img{
  width:100%;height:auto;border-radius:var(--radius-card);
  box-shadow:var(--shadow-soft);
}
.zt-guide__media .zt-noimg{border-radius:var(--radius-card)}

/* ═══ 5.5 Vurgu bandı (lacivert-deep, 2 kart) ═══ */
.zt-dark-band{background:var(--navy-deep);color:var(--white)}
.zt-dark-band .zt-container{padding-block:var(--sp-6)}
.zt-dark-band .zt-eye{color:var(--steel-soft)}
.zt-dark-band__grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--sp-2);margin-top:var(--sp-3);
}
.zt-dark-band__card{
  display:grid;gap:12px;align-content:start;min-width:0;
  background:var(--navy);
  border:1px solid var(--white-15);border-radius:var(--radius-card);
  padding:var(--sp-3);
}
.zt-dark-band__card h3{color:var(--white);margin:0;font-size:1.25rem}
.zt-dark-band__card .zt-img{--ar:16/10}
.zt-dark-band__vurgu{color:var(--white-70);font-size:var(--fs-md);margin:0}
.zt-dark-band__list{display:grid;gap:10px}
.zt-dark-band__list li{
  display:flex;align-items:flex-start;gap:10px;min-width:0;
  color:var(--white-70);font-size:var(--fs-md);
}
.zt-dark-band__list .zt-ico{width:17px;height:17px;margin-top:3px;flex:none;color:var(--steel-soft)}
.zt-dark-band__card .zt-btn--link{justify-self:start;color:var(--white)}
.zt-dark-band__card .zt-btn--link:hover,
.zt-dark-band__card .zt-btn--link:focus-visible{color:var(--steel-soft)}

/* ═══ 5.6 Çalışma alanı (adres kartı + harita) ═══ */
.zt-area__in{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:var(--sp-5);align-items:center;
}
.zt-area__copy{min-width:0}
.zt-area__copy h2{margin:12px 0 10px}
.zt-area__intro{color:var(--ink-soft);margin:0}
.zt-area__card{
  display:grid;gap:var(--sp-3);align-content:start;
  background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius-card);
  box-shadow:var(--shadow-soft);
  padding:var(--sp-3);
}
.zt-area__rows{display:grid}
.zt-area__row{
  display:flex;align-items:flex-start;gap:12px;min-height:44px;
  padding-block:12px;min-width:0;text-decoration:none;
}
.zt-area__row+.zt-area__row{border-top:1px solid var(--line)}
.zt-area__row>.zt-ico{width:19px;height:19px;margin-top:2px;flex:none;color:var(--steel)}
.zt-area__rowbody{display:grid;gap:2px;min-width:0}
.zt-area__rowlabel{
  display:block;font:600 var(--fs-xs)/1.4 var(--font-body);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);
}
.zt-area__rowval{color:var(--ink);font-size:var(--fs-md);overflow-wrap:break-word}
a.zt-area__row .zt-area__rowval{font:700 1.1875rem/1.25 var(--font-heading);color:var(--navy)}
a.zt-area__row:hover .zt-area__rowval,a.zt-area__row:focus-visible .zt-area__rowval{color:var(--red-deep)}
.zt-area__card .zt-btn--outline{justify-self:start}
.zt-area__map{
  margin-top:var(--sp-5);overflow:hidden;
  border:1px solid var(--line);border-radius:var(--radius-card);
  background:var(--steel-soft);
}
.zt-area__map iframe{display:block}
.zt-area__map-fallback{
  aspect-ratio:auto;
  display:flex;align-items:center;justify-content:center;
  gap:16px;min-height:240px;padding:var(--sp-3);
}
.zt-area__map-fallback p{margin:0;color:var(--ink);font-size:var(--fs-md)}

/* ═══ 5.7 SSS (başlık + yardım kartı solda, numaralı akordeon sağda) ═══ */
.zt-faq{
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(180deg,var(--white) 0%,var(--gray) 100%);
}
.zt-faq__deco{position:absolute;inset:0;z-index:-1;pointer-events:none}
.zt-faq__deco::before{ /* topografik kontur, sağ üst */
  content:'';position:absolute;right:-60px;top:-30px;width:min(620px,68%);aspect-ratio:520/360;
  background:url("../images/deco/topo-ink.svg") right top/contain no-repeat;
}
.zt-faq__deco::after{ /* nokta ızgarası, sol alt (maskeli) */
  content:'';position:absolute;left:0;bottom:0;width:min(520px,60%);height:62%;
  background-image:radial-gradient(var(--navy-15) 1.2px,transparent 1.6px);background-size:22px 22px;
  -webkit-mask-image:radial-gradient(80% 90% at 0% 100%,var(--ink) 0%,transparent 72%);
  mask-image:radial-gradient(80% 90% at 0% 100%,var(--ink) 0%,transparent 72%);
}
.zt-faq__deco i{position:absolute;border-radius:50%;border:1px solid var(--navy-10)}
.zt-faq__deco i:nth-child(1){width:360px;height:360px;right:6%;bottom:-170px}
.zt-faq__deco i:nth-child(2){width:560px;height:560px;right:-6%;bottom:-270px;border-style:dashed}
.zt-faq__in{
  display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(32px,5vw,72px);align-items:start;
}
.zt-faq__copy{min-width:0;display:grid;gap:14px;align-content:start}
.zt-faq__copy h2{margin:0;font-size:clamp(1.9rem,3.2vw,2.6rem)}
.zt-faq__intro{margin:0;color:var(--ink-soft);max-width:44ch}
.zt-faq__help{
  position:relative;isolation:isolate;overflow:hidden;margin-top:10px;
  display:grid;gap:10px;justify-items:start;
  padding:clamp(22px,2.6vw,30px);border-radius:20px;
  background:var(--navy-grad);color:var(--white);
  box-shadow:var(--shadow-lift);
}
.zt-faq__help::before{
  content:'';position:absolute;right:-70px;bottom:-60px;z-index:-1;width:280px;aspect-ratio:520/360;
  background:url("../images/deco/topo.svg") center/contain no-repeat;opacity:.7;
}
.zt-faq__help-ico{
  display:grid;place-items:center;width:46px;height:46px;border-radius:14px;
  background:var(--red);color:var(--white);box-shadow:0 8px 18px var(--red-30);
}
.zt-faq__help-ico .zt-ico{width:22px;height:22px}
.zt-faq__help h3{margin:4px 0 0;color:var(--white);font-size:1.3125rem}
.zt-faq__help p{margin:0;color:var(--white-85);font-size:var(--fs-md);max-width:34ch}
.zt-faq__help-tel{
  color:var(--white);text-decoration:none;
  font:800 clamp(1.375rem,2.2vw,1.625rem)/1.2 var(--font-heading);letter-spacing:.01em;
  min-height:44px;display:inline-flex;align-items:center;
}
.zt-faq__help-tel:hover,.zt-faq__help-tel:focus-visible{color:var(--white);text-decoration:underline;text-underline-offset:5px}
.zt-faq__help-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.zt-faq__list{min-width:0}
.zt-faq__list .zt-qa:nth-child(2){transition-delay:.06s}
.zt-faq__list .zt-qa:nth-child(3){transition-delay:.12s}
.zt-faq__list .zt-qa:nth-child(4){transition-delay:.18s}

/* ═══ 5.8 Son blog yazıları ═══ */
.zt-lblog__head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-3);margin-bottom:clamp(24px,3vw,36px)}
.zt-lblog__head h2{margin:12px 0 0;font-size:clamp(1.9rem,3.2vw,2.6rem)}
.zt-lblog__head .zt-btn{flex:none}
@media (max-width:639.98px){
  .zt-lblog__head{flex-direction:column;align-items:flex-start}
}

/* ═══════════════════════════════════════════════════════════════
   Kırılımlar
   ═══════════════════════════════════════════════════════════════ */

/* ≥1200: rehber görseli sabit */
@media (min-width:1200px){
  .zt-guide__media{position:sticky;top:calc(var(--topbar-h) + var(--header-h) + 16px)}
}
@media (min-width:900px){
  .zt-faq__copy{position:sticky;top:calc(var(--header-h) + 24px)}
}

/* 900–1199: kap %92 (layout) — boşlukları topla */
@media (min-width:900px) and (max-width:1199.98px){
  .zt-steps__track{gap:var(--sp-2)}
  .zt-guide__in,.zt-area__in,.zt-faq__in{gap:var(--sp-4)}
  .zt-guide__media{position:sticky;top:calc(var(--header-h) + 16px)}
}

/* <900: tek kolon (hero görseli ALTA), dikey süreç zaman çizgisi */
@media (max-width:899.98px){
  .zt-cats__head{grid-template-columns:1fr;gap:var(--sp-2)}

  .zt-steps__track{grid-template-columns:1fr;gap:var(--sp-3);margin-top:var(--sp-4)}
  .zt-steps__track::before{
    left:23px;right:auto;top:0;bottom:0;width:2px;height:auto;
    transform:scaleY(0);transform-origin:top;
  }
  .zt-steps.is-in .zt-steps__track::before{transform:scaleY(1)}
  .zt-steps__item{
    grid-template-columns:48px minmax(0,1fr);
    column-gap:var(--sp-2);row-gap:6px;justify-items:start;
  }
  .zt-steps__num{grid-column:1;grid-row:1}
  .zt-steps__item h3{grid-column:2;grid-row:1;align-self:center}
  .zt-steps__item p{grid-column:2;grid-row:2}

  .zt-guide__in{grid-template-columns:1fr;gap:var(--sp-4)}
  .zt-dark-band__grid{grid-template-columns:1fr}
  .zt-area__in{grid-template-columns:1fr;gap:var(--sp-4)}
  .zt-faq__in{grid-template-columns:1fr;gap:var(--sp-4)}
}

/* 640–991: kategoriler 2 kolon */
@media (min-width:640px) and (max-width:991.98px){
  .zt-cats__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* <640: dokunma ve sıkıştırma */
@media (max-width:639.98px){
  .zt-hero__actions{display:flex;flex-direction:row;flex-wrap:nowrap;gap:10px;align-items:center;width:100%}
  .zt-hero__actions .zt-btn{flex:1 1 0;min-width:0;width:auto;padding:11px 12px;font-size:14px;justify-content:center}
  .zt-hero__actions .zt-btn span{white-space:nowrap}
  .zt-hero__scroll span{display:none}
  .zt-hero__in{padding-bottom:96px}
  .zt-cats__grid{grid-template-columns:1fr}
  .zt-area__card{padding:var(--sp-2)}
  .zt-dark-band .zt-container{padding-block:var(--sp-5)}
  .zt-area__map{margin-top:var(--sp-4)}
}