/*
 * Dinamik katman: kaydırma ile beliren bölümler, hero hareketi, kart hover fiziği.
 * Her hareketin bir nedeni var: hiyerarşi (ne önce okunur), geri bildirim (hover/basma),
 * hikâye (bölümlerin sırayla gelişi). Hareket azaltma tercihi olan kullanıcılarda tamamen kapalıdır.
 * Tek vurgu rengi: #ff5e14 (mevcut marka rengi).
 */
:root {
  --dyn-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dyn-lift-shadow: 0 22px 44px -22px rgba(110, 40, 0, 0.38);
}

@keyframes dyn-up {
  from { opacity: 0; transform: translate3d(0, 26px, 0); }
  to   { opacity: 1; transform: none; }
}

@keyframes dyn-zoom-hero {
  from { transform: scale(1); }
  to   { transform: scale(1.09); }
}

@keyframes dyn-zoom-page {
  from { transform: scale(1); }
  to   { transform: scale(1.05); }
}

/* ---------- Kart ve görsel hover fiziği (fare olan cihazlar) ---------- */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .service-item {
    transition: transform 0.6s var(--dyn-ease), box-shadow 0.6s var(--dyn-ease);
  }
  .service-item:hover {
    transform: translate3d(0, -8px, 0);
    box-shadow: var(--dyn-lift-shadow);
  }
  .service-item .service__img { overflow: hidden; }
  .service-item .service__img img {
    transition: transform 1.2s var(--dyn-ease);
  }
  .service-item:hover .service__img img { transform: scale(1.06); }

  .blog-item {
    transition: transform 0.6s var(--dyn-ease), box-shadow 0.6s var(--dyn-ease);
  }
  .blog-item:hover {
    transform: translate3d(0, -6px, 0);
    box-shadow: var(--dyn-lift-shadow);
  }
  .blog-item .blog__img { overflow: hidden; }
  .blog-item .blog__img img { transition: transform 1s var(--dyn-ease); }
  .blog-item:hover .blog__img img { transform: scale(1.05); }

  .projects-gallery .project-item .project__img { overflow: hidden; }
  .projects-gallery .project-item .project__img img {
    transition: transform 1s var(--dyn-ease);
  }
  .projects-gallery .project-item:hover .project__img img { transform: scale(1.07); }

  .video__player { transition: transform 0.45s var(--dyn-ease); }
  a:hover > .video__player { transform: scale(1.1); }
}

/* Basma geri bildirimi */
.btn:active { transform: scale(0.98); }

/* ---------- Hareket tercihi serbestse ---------- */
@media (prefers-reduced-motion: no-preference) {

  /* Kaydırınca beliren bölümler (JS sınıfları ekler; JS yoksa içerik zaten görünür) */
  html.js .dyn-rv {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity 0.8s var(--dyn-ease) var(--dyn-d, 0ms),
                transform 0.95s var(--dyn-ease) var(--dyn-d, 0ms);
    will-change: opacity, transform;
  }
  html.js .dyn-rv.dyn-in {
    opacity: 1;
    transform: none;
  }

  /* Hero: yavaş yakınlaşma + metnin sırayla gelişi */
  .slider .slide-item { isolation: isolate; overflow: hidden; }
  .slider .slide-item::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: inherit;
    transform-origin: 50% 45%;
  }
  .slider .owl-item.active .slide-item::after {
    animation: dyn-zoom-hero 18s linear both;
  }
  .slider .owl-item.active .slide__title   { animation: dyn-up 1s var(--dyn-ease) 0.2s both; }
  .slider .owl-item.active .slide__desc    { animation: dyn-up 1s var(--dyn-ease) 0.38s both; }
  .slider .owl-item.active .slide__content .btn { animation: dyn-up 1s var(--dyn-ease) 0.56s both; }

  /* Hero kaydırılınca içerik hafifçe geri çekilir (destekleyen tarayıcılarda) */
  @supports (animation-timeline: scroll()) {
    .slider-1 .slide__content {
      animation: dyn-hero-out linear both;
      animation-timeline: scroll(root);
      animation-range: 0 75vh;
    }
    @keyframes dyn-hero-out {
      to { transform: translate3d(0, 9vh, 0); opacity: 0.1; }
    }
  }

  /* İç sayfa hero: başlık girişi + arka plan yavaş yakınlaşma */
  .page-title { isolation: isolate; overflow: hidden; }
  .page-title::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: inherit;
    transform-origin: 50% 40%;
    animation: dyn-zoom-page 24s ease-out both;
  }
  .page-title .breadcrumb        { animation: dyn-up 0.9s var(--dyn-ease) both; }
  .page-title .pagetitle__heading { animation: dyn-up 1s var(--dyn-ease) 0.12s both; }
}

/* Üst menü: sayfa kaydırılınca buzlu cam (yalnızca masaüstü; mobil panel fixed olduğu için etkilenmesin) */
@media (min-width: 992px) {
  .fixed-navbar {
    background-color: rgba(255, 255, 255, 0.86) !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    backdrop-filter: saturate(180%) blur(14px);
  }
}

@media (prefers-reduced-transparency: reduce) {
  .fixed-navbar {
    background-color: #ffffff !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* Hero okunabilirliği: metnin geldiği sol tarafa yumuşak koyulaştırma (WCAG kontrastı için) */
.slider .slide-item.bg-overlay::before {
  background: linear-gradient(90deg, rgba(14, 16, 20, 0.62) 0%, rgba(14, 16, 20, 0.30) 55%, rgba(14, 16, 20, 0.08) 100%);
}

@media (max-width: 767px) {
  .slider .slide-item.bg-overlay::before {
    background: linear-gradient(180deg, rgba(14, 16, 20, 0.35) 0%, rgba(14, 16, 20, 0.6) 100%);
  }
}

/* Temadaki degrade geçersiz yazılmıştı (linear-gradient(top, ...)), bu yüzden hiç çizilmiyordu.
   Kart başlıklarının parlak görsellerin üstünde okunması için alt tarafa koyu degrade. */
.service-item .service__img::before {
  opacity: 1;
  background-image: linear-gradient(180deg, rgba(14, 16, 20, 0) 30%, rgba(14, 16, 20, 0.78) 100%);
}

.project-item .project__img::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), #1b1a1a 100%);
}