/* ==========================================================================
   Efekt katmanları: arka plan parçacıkları, ışık küreleri, fare parıltısı,
   sahne açılışları. "Efektler" anahtarı (data-fx="off") hepsini kapatır.
   ========================================================================== */

.fx-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
}
.fx-bg { z-index: 0; overflow: hidden; }

#fx-particles {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .9;
}
html[data-theme="light"] #fx-particles { opacity: .7; }

/* Yavaş hareket eden ışık küreleri (yalnızca transform animasyonu) */
.fx-orb {
  position: absolute;
  border-radius: 50%;
  will-change: transform;
  opacity: calc(.35 + .65 * var(--glow));
}
.fx-orb--1 {
  width: 58vmax;
  height: 58vmax;
  top: -26vmax;
  left: -18vmax;
  background: radial-gradient(circle, rgba(var(--gold-rgb), .13) 0%, rgba(var(--gold-rgb), .04) 40%, transparent 68%);
  animation: orb-drift-a 38s ease-in-out infinite alternate;
}
.fx-orb--2 {
  width: 50vmax;
  height: 50vmax;
  top: 30vh;
  right: -24vmax;
  background: radial-gradient(circle, rgba(255, 215, 106, .08) 0%, rgba(201, 154, 46, .03) 45%, transparent 68%);
  animation: orb-drift-b 46s ease-in-out infinite alternate;
}
.fx-orb--3 {
  width: 36vmax;
  height: 36vmax;
  bottom: -18vmax;
  left: 30vw;
  background: radial-gradient(circle, rgba(255, 255, 255, .045) 0%, transparent 65%);
  animation: orb-drift-a 52s ease-in-out infinite alternate-reverse;
}
html[data-theme="light"] .fx-orb--1 { background: radial-gradient(circle, rgba(var(--gold-rgb), .2) 0%, rgba(var(--gold-rgb), .06) 40%, transparent 68%); }
html[data-theme="light"] .fx-orb--3 { display: none; }
@keyframes orb-drift-a { to { transform: translate3d(14vw, 10vh, 0) scale(1.08); } }
@keyframes orb-drift-b { to { transform: translate3d(-12vw, -8vh, 0) scale(.92); } }

/* Fareyi takip eden yumuşak gold ışık */
.fx-glow {
  position: absolute;
  top: 0;
  left: 0;
  width: 560px;
  height: 560px;
  margin: -280px 0 0 -280px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--gold-rgb), calc(.12 * var(--glow))) 0%, rgba(var(--gold-rgb), calc(.04 * var(--glow))) 35%, transparent 65%);
  opacity: 0;
  transition: opacity .6s var(--ease);
  will-change: transform;
}
.fx-glow.is-visible { opacity: 1; }
html[data-theme="light"] .fx-glow { background: radial-gradient(circle, rgba(var(--gold-rgb), calc(.18 * var(--glow))) 0%, transparent 60%); }

/* Fare izi tuvali içeriğin üzerinde, tıklamaları engellemez */
#fx-trail { z-index: 100; width: 100vw; height: 100vh; }

/* Kaydırınca beliren gruplar (yalnızca efektler açıkken JS ekler) */
.reveal-ready [data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .8s var(--ease-out), transform .8s var(--ease-out);
  transition-delay: calc(var(--i, 0) * 80ms);
}
.reveal-ready [data-reveal].is-visible { opacity: 1; transform: none; }

/* ---------------------------------------------------------------- efektler kapalı */

html[data-fx="off"] .fx-layer,
html[data-fx="off"] .hero__slash,
html[data-fx="off"] .hero__rack i { display: none !important; }

html[data-fx="off"] *,
html[data-fx="off"] *::before,
html[data-fx="off"] *::after {
  animation-duration: .001ms !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
}
html[data-fx="off"] [data-depth],
html[data-fx="off"] [data-tilt] { transform: none !important; }
/* Kapalıyken sürekli animasyonlar ilk karede değil, anlamlı son hâlinde durur */
html[data-fx="off"] .stage__links .pulse,
html[data-fx="off"] .topology .t-flow { display: none; }
html[data-fx="off"] .gold-border.is-lit::before { animation: none; }

/* İşletim sistemi "hareketi azalt" diyorsa ve kullanıcı efektleri açıkça açmadıysa */
@media (prefers-reduced-motion: reduce) {
  html:not([data-fx-user="on"]) *,
  html:not([data-fx-user="on"]) *::before,
  html:not([data-fx-user="on"]) *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* Dokunmatik ve küçük ekranlarda ağır katmanlar hafifletilir */
@media (max-width: 760px), (pointer: coarse) {
  #fx-trail, .fx-glow { display: none; }
  .fx-orb--3 { display: none; }
  .fx-orb { animation-duration: 70s; }
}