/* ==========================================================================
   IC Nükleer Teknoloji — Açılış ekranı
   Atom animasyonu, marka imzası ve ilerleme çizgisi
   ========================================================================== */

.site-loader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(145deg, #f8fbf9 0%, #edf5f1 48%, #fff 100%);
  color: #07523e;
  clip-path: inset(0);
  opacity: 1;
  transition: clip-path 0.8s cubic-bezier(0.76, 0, 0.24, 1), opacity 0.55s 0.15s;
}

/* Perde yukarı kalkarken alt köşeleri yuvarlanır */
.site-loader.is-leaving {
  clip-path: inset(0 0 100% round 0 0 38% 38%);
  opacity: 0.98;
  pointer-events: none;
}

/* Açılış ekranı görünürken sayfa kaydırılamaz */
.site-is-loading {
  overflow: hidden;
}

/* --------------------------------------------------------------------------
   Arka plan katmanları
   -------------------------------------------------------------------------- */
.loader-grid {
  position: absolute;
  inset: 0;
  opacity: 0.13;
  background-image:
    linear-gradient(#07523e2e 1px, #0000 1px),
    linear-gradient(90deg, #07523e2e 1px, #0000 1px);
  background-size: 76px 76px;
  -webkit-mask-image: radial-gradient(circle, #000 0, #0000 67%);
  mask-image: radial-gradient(circle, #000 0, #0000 67%);
}

.loader-orbit-halo {
  position: absolute;
  width: min(76vw, 920px);
  aspect-ratio: 1;
  border: 1px solid #086e5217;
  border-radius: 50%;
  box-shadow: 0 0 0 90px #086e5206, 0 0 0 180px #086e5205;
  animation: loader-halo 2.2s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

/* --------------------------------------------------------------------------
   Merkez
   -------------------------------------------------------------------------- */
.loader-center {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateY(-1vh);
  transition: transform 0.75s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.5s;
}

.site-loader.is-leaving .loader-center {
  opacity: 0;
  transform: translateY(-34px) scale(1.08);
}

/* --------------------------------------------------------------------------
   Atom
   Yörüngeler sabit durur; elektronlar SVG <animateMotion> ile yörünge yolu
   üzerinde ilerler. Derinlik hissi elektronun yarıçap ve saydamlığından gelir.
   -------------------------------------------------------------------------- */
.loader-atom {
  width: clamp(126px, 13vw, 190px);
  overflow: visible;
  filter: drop-shadow(0 18px 28px #07513c1f);
}

/* Atomun tamamı çok yavaşça salınır */
.atom-shell {
  transform-origin: 120px 120px;
  animation: atom-sway 22s ease-in-out infinite;
}

.atom-orbit {
  fill: none;
  stroke: #087456;
  stroke-width: 1.8px;
  opacity: 0.4;
  animation: orbit-breathe 6s ease-in-out infinite;
}

.atom-shell > g:nth-child(2) .atom-orbit {
  animation-delay: -2s;
}

.atom-shell > g:nth-child(3) .atom-orbit {
  animation-delay: -4s;
}

/* Elektron, yörünge yolu üzerinde ilk kareden itibaren doğru konumda durur.
   Derinlik: yolun uzak yarısında küçülüp saydamlaşır, yakın yarısında büyür. */
.atom-electron {
  offset-path: path('M28,120 A92,35 0 1,0 212,120 A92,35 0 1,0 28,120');
  offset-rotate: 0deg;
  offset-distance: 0%;
  fill: #0b8f6a;
  stroke: none;
  filter: drop-shadow(0 0 6px #12b18396);
  animation:
    electron-run var(--tur, 3.6s) linear infinite,
    electron-depth var(--tur, 3.6s) ease-in-out infinite;
  animation-delay: var(--faz, 0s);
}

/* offset-path desteklenmeyen tarayıcılarda elektron yolun sol ucunda durur;
   animasyon yerine sabit bir nokta görünür, düzen bozulmaz. */
@supports not (offset-path: path('M0,0 L1,1')) {
  .atom-electron {
    transform: translate(28px, 120px);
    animation: electron-depth var(--tur, 3.6s) ease-in-out infinite;
  }
}

/* Çekirdek */
.atom-nucleus {
  fill: #087456;
  stroke: none;
  animation: nucleus-pulse 2.4s ease-in-out infinite;
  transform-origin: 120px 120px;
}

.atom-nucleus-glow {
  fill: #12b183;
  stroke: none;
  opacity: 0.16;
  transform-origin: 120px 120px;
  animation: nucleus-halo 2.4s ease-in-out infinite;
}

/* Marka imzası */
.loader-wordmark {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 19px;
  color: #07523e;
  opacity: 0;
  animation: loader-rise 0.65s 0.28s forwards;
}

.loader-wordmark strong {
  font-family: Georgia, serif;
  font-size: 43px;
  font-weight: 400;
  letter-spacing: -0.06em;
  line-height: 1;
}

.loader-wordmark span {
  padding-left: 12px;
  border-left: 1px solid #07523e38;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.2em;
  line-height: 1.22;
}

/* İlerleme çizgisi */
.loader-progress {
  width: clamp(185px, 18vw, 260px);
  height: 1px;
  margin-top: 31px;
  overflow: hidden;
  background: #07523e26;
}

.loader-progress i {
  display: block;
  width: 100%;
  height: 100%;
  background: #0b8060;
  transform: translateX(-100%);
  animation: loader-progress 2s cubic-bezier(0.5, 0, 0.25, 1) forwards;
}

.loader-center p {
  margin: 13px 0 0;
  color: #07523e80;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  opacity: 0;
  animation: loader-rise 0.6s 0.48s forwards;
}

/* --------------------------------------------------------------------------
   Animasyonlar
   -------------------------------------------------------------------------- */
@keyframes electron-run {
  from {
    offset-distance: 0%;
  }
  to {
    offset-distance: 100%;
  }
}

/* Yolun ilk yarısı kürenin uzak tarafı, ikinci yarısı yakın tarafıdır */
@keyframes electron-depth {
  0%,
  100% {
    r: 7px;
    opacity: 0.9;
  }
  25% {
    r: 4.2px;
    opacity: 0.38;
  }
  50% {
    r: 7px;
    opacity: 0.9;
  }
  75% {
    r: 9.2px;
    opacity: 1;
  }
}

@keyframes atom-sway {
  0%,
  100% {
    transform: rotate(-5deg);
  }
  50% {
    transform: rotate(5deg);
  }
}

@keyframes orbit-breathe {
  0%,
  100% {
    opacity: 0.3;
  }
  50% {
    opacity: 0.58;
  }
}

@keyframes nucleus-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.16);
  }
}

@keyframes nucleus-halo {
  0%,
  100% {
    opacity: 0.12;
    transform: scale(0.9);
  }
  50% {
    opacity: 0.3;
    transform: scale(1.25);
  }
}

@keyframes loader-progress {
  to {
    transform: translateX(0);
  }
}

@keyframes loader-rise {
  0% {
    opacity: 0;
    transform: translateY(9px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes loader-halo {
  0% {
    opacity: 0;
    transform: scale(0.72);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* --------------------------------------------------------------------------
   Duyarlı davranış
   -------------------------------------------------------------------------- */
@media (max-width: 700px) {
  .loader-grid {
    background-size: 54px 54px;
  }

  .loader-atom {
    width: 132px;
  }

  .loader-orbit-halo {
    width: 130vw;
  }

  .loader-wordmark strong {
    font-size: 38px;
  }

  .loader-wordmark span {
    font-size: 8px;
  }

  .loader-center p {
    font-size: 7px;
    letter-spacing: 0.18em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-loader {
    display: none;
  }

  .site-is-loading {
    overflow: auto !important;
  }
}