/* ============================================================
   ALPAGU SAVUNMA — intro.css
   "Sinematik Kartal" giriş animasyonu (yalnızca ana sayfa)
   Vanilla CSS · No frameworks
   ============================================================ */

:root {
  --au-dark:    #1A0A0A;
  --au-darker:  #0B0506;
  --au-primary: #8B1C1C;
  --au-accent:  #C0453D;
  --au-gold:    #B89A4A;
  --au-silver:  #D6DADD;
}

/* ── Scroll kilidi (intro oynarken) — END'e kadar ───────────── */
html.au-lock,
html.au-lock body {
  overflow: hidden !important;
  height: 100%;
}
/* body fade-in animasyonunu intro sırasında bypass et — overlay zaten kaplıyor */
html.au-lock body {
  opacity: 1 !important;
  animation: none !important;
}

/* Hero içeriğini intro boyunca gizle; kapı açılırken (DOORS_START) kalkar */
html.au-intro-active .hero-content { opacity: 0; }
.hero-content { transition: opacity 0.9s ease 0.05s; }

/* ============================================================
   OVERLAY KÖKÜ
   ============================================================ */
.au-intro {
  display: none;                   /* JS yoksa hiç gösterme → sayfa kilitlenmesin */
  position: fixed;
  inset: 0;
  z-index: 99999;
  overflow: hidden;
  pointer-events: none;            /* tıklamaları engelleme, sadece görsel */
  font-family: 'DM Sans', sans-serif;
}
html.au-js .au-intro { display: block; }
.au-intro.au-done { display: none; }

/* ── Zırhlı kapı panelleri (koyu zemin = iki yarım) ─────────── */
.au-door {
  position: absolute;
  top: 0;
  width: 50.4%;                    /* hafif bindirme → ortada çizgi görünmesin */
  height: 100%;
  background: radial-gradient(120% 120% at center,
              #2a1011 0%, var(--au-dark) 42%, var(--au-darker) 100%);
  background-attachment: fixed;    /* iki panel ortak merkez → kusursuz birleşim */
  background-size: 100vw 100vh;
  will-change: transform;
}
.au-door--l { left: 0;  transform: translateX(0); }
.au-door--r { right: 0; transform: translateX(0); }

/* iç metalik kenar (kapı açılınca görünen kalın çelik kenar) */
.au-door::after {
  content: "";
  position: absolute;
  top: 0;
  width: 3px;
  height: 100%;
  opacity: 0;
}
.au-door--l::after {
  right: 0;
  background: linear-gradient(to right, transparent, rgba(192,69,61,0.0), var(--au-silver));
}
.au-door--r::after {
  left: 0;
  background: linear-gradient(to left, transparent, rgba(192,69,61,0.0), var(--au-silver));
}

/* açılış tetiklendiğinde kapılar ayrılır */
.au-intro.au-open .au-door--l { transform: translateX(-101%); }
.au-intro.au-open .au-door--r { transform: translateX(101%); }
.au-intro.au-open .au-door {
  transition: transform 1.0s cubic-bezier(0.76, 0, 0.24, 1);
}
.au-intro.au-open .au-door::after { opacity: 1; }

/* ── Ortadaki ışıklı dikiş (seam) ───────────────────────────── */
.au-seam {
  display: none;
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  transform: translateX(-50%) scaleY(0);
  transform-origin: center;
  background: linear-gradient(to bottom,
              transparent, var(--au-accent) 30%, var(--au-gold) 50%, var(--au-accent) 70%, transparent);
  box-shadow: 0 0 18px 3px rgba(192,69,61,0.7);
  opacity: 0;
  z-index: 6;
}
.au-intro .au-seam { animation: auSeam 2.3s ease forwards; }
@keyframes auSeam {
  0%   { opacity: 0; transform: translateX(-50%) scaleY(0); }
  55%  { opacity: 0; transform: translateX(-50%) scaleY(0); }
  72%  { opacity: 1; transform: translateX(-50%) scaleY(1); }
  100% { opacity: 1; transform: translateX(-50%) scaleY(1); }
}
.au-intro.au-open .au-seam { opacity: 0; transition: opacity 0.45s ease; }

/* ============================================================
   SAHNE (kartal + yazı) — kapıların üstünde
   ============================================================ */
.au-stage {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 26px;
  transform: translateZ(0);
}
.au-intro.au-open .au-stage {
  opacity: 0;
  transition: opacity 0.5s ease;
}

/* ── Arka plan ışıma + radyal ışınlar ───────────────────────── */
.au-rays {
  position: absolute;
  top: 50%; left: 50%;
  width: 150vmax; height: 150vmax;
  transform: translate(-50%, -50%) scale(0.3);
  background:
    repeating-conic-gradient(from 0deg at 50% 50%,
      rgba(192,69,61,0.10) 0deg, rgba(192,69,61,0.10) 1.4deg,
      transparent 1.4deg, transparent 7deg);
  opacity: 0;
  z-index: -2;
  animation: auRays 2.4s ease-out forwards;
}
@keyframes auRays {
  0%   { opacity: 0; transform: translate(-50%,-50%) scale(0.2) rotate(0deg); }
  35%  { opacity: 0.9; }
  70%  { opacity: 0.5; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1) rotate(22deg); }
}

.au-glow {
  position: absolute;
  top: 46%; left: 50%;
  width: min(60vw, 620px); height: min(60vw, 620px);
  transform: translate(-50%, -50%) scale(0.4);
  background: radial-gradient(circle,
              rgba(192,69,61,0.55) 0%, rgba(139,28,28,0.28) 35%, transparent 68%);
  filter: blur(8px);
  opacity: 0;
  z-index: -1;
  animation: auGlow 2.6s ease-out forwards;
}
@keyframes auGlow {
  0%   { opacity: 0; transform: translate(-50%,-50%) scale(0.4); }
  30%  { opacity: 0.9; transform: translate(-50%,-50%) scale(1); }
  60%  { opacity: 0.6; }
  100% { opacity: 0.35; transform: translate(-50%,-50%) scale(1.05); }
}

/* ── Kartal (logo PNG) — kanat açılma + netleşme ────────────── */
.au-eagle {
  position: relative;
  width: clamp(190px, 30vw, 360px);
  aspect-ratio: 585 / 597;
  clip-path: inset(0 49% 0 49%);
  transform: scale(0.62);
  opacity: 0;
  animation: auEagle 1.35s cubic-bezier(0.16, 1, 0.3, 1) 0.15s forwards;
}
@keyframes auEagle {
  0%   { clip-path: inset(0 49% 0 49%); transform: scale(0.62); opacity: 0; }
  18%  { opacity: 1; }
  100% { clip-path: inset(0 0 0 0);     transform: scale(1);    opacity: 1; }
}

.au-eagle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: none;
  animation: auEagleSharpen 1.0s ease 0.2s forwards;
}
@keyframes auEagleSharpen {
  0%   { filter: none; }
  100% { filter: drop-shadow(0 10px 34px rgba(192,69,61,0.45)); }
}

/* metalik parlama süpürmesi — kartal silüetine maskeli */
.au-eagle-shine {
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg,
              transparent 38%, rgba(255,255,255,0.0) 44%,
              rgba(255,255,255,0.92) 50%, rgba(255,255,255,0.0) 56%, transparent 62%);
  background-size: 260% 100%;
  background-position: 180% 0;
  -webkit-mask: url('logo.png') center / contain no-repeat;
          mask: url('logo.png') center / contain no-repeat;
  opacity: 0;
  mix-blend-mode: screen;
  animation: auShine 1.5s ease-in-out 0.65s forwards;
}
@keyframes auShine {
  0%   { background-position: 180% 0;  opacity: 0; }
  20%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { background-position: -120% 0; opacity: 0; }
}

/* ── Marka tipografisi ──────────────────────────────────────── */
.au-brand {
  text-align: center;
  line-height: 1;
}
.au-brand-name {
  display: flex;
  justify-content: center;
  gap: 0.02em;
  font-family: 'DM Sans', sans-serif;
  font-weight: 800;
  font-size: clamp(30px, 6.4vw, 68px);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 2px 30px rgba(192,69,61,0.45);
  margin-left: 0.16em;            /* letter-spacing dengesi */
}
.au-brand-name .au-ch {
  display: inline-block;
  opacity: 0;
  transform: translateY(40px) rotateX(-90deg);
  transform-origin: bottom;
  animation: auChar 0.62s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.au-brand-name .au-sp { width: 0.38em; }
@keyframes auChar {
  to { opacity: 1; transform: translateY(0) rotateX(0); }
}

.au-brand-sub {
  margin-top: 16px;
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  font-size: clamp(10px, 1.4vw, 14px);
  letter-spacing: 0.62em;
  text-transform: uppercase;
  color: var(--au-silver);
  opacity: 0;
  animation: auSub 0.9s ease 1.45s forwards;
}
@keyframes auSub { to { opacity: 0.85; } }

/* altı çizen ince hat */
.au-brand-line {
  margin: 18px auto 0;
  width: clamp(150px, 26vw, 300px);
  height: 2px;
  background: linear-gradient(to right,
              transparent, var(--au-gold), var(--au-accent), var(--au-gold), transparent);
  transform: scaleX(0);
  transform-origin: center;
  animation: auLine 0.9s cubic-bezier(0.22, 1, 0.36, 1) 1.25s forwards;
}
@keyframes auLine { to { transform: scaleX(1); } }

/* ── Işık patlaması (climax flash) — devre dışı ─────────────── */
.au-burst {
  display: none;
}

/* ── Yüzen parçacıklar (kor/kıvılcım) ───────────────────────── */
#au-particles {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}
.au-particle {
  position: absolute;
  bottom: -10px;
  width: 3px; height: 3px;
  border-radius: 50%;
  background: var(--au-accent);
  box-shadow: 0 0 8px 1px rgba(192,69,61,0.8);
  opacity: 0;
  z-index: 0;
  animation: auFloat linear infinite;
}
@keyframes auFloat {
  0%   { opacity: 0;    transform: translateY(0) translateX(0); }
  12%  { opacity: 0.9; }
  80%  { opacity: 0.6; }
  100% { opacity: 0;    transform: translateY(-102vh) translateX(var(--au-drift, 20px)); }
}

/* ============================================================
   ERİŞİLEBİLİRLİK — hareketi azalt
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  .au-rays, .au-glow, .au-particle, .au-eagle-shine,
  .au-seam, .au-brand-line { animation: none !important; }
  .au-eagle { clip-path: none; transform: none; opacity: 1; animation: none !important; }
  .au-eagle img { filter: none; animation: none !important; }
  .au-brand-name .au-ch { opacity: 1; transform: none; animation: none !important; }
  .au-brand-sub { opacity: 0.85; animation: none !important; }
  .au-brand-line { transform: scaleX(1); }
}
