/* ============================================
   LOADER & CURSOR & DRONE INTRO
   ============================================ */

/* Custom Cursor */
.cursor {
  width: 12px; height: 12px;
  background: var(--gold);
  border-radius: 50%;
  position: fixed; top: 0; left: 0;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%, -50%);
  transition: transform 0.1s, width 0.3s, height 0.3s, background 0.3s;
  mix-blend-mode: difference;
}
.cursor-ring {
  width: 36px; height: 36px;
  border: 1px solid rgba(201,168,76,0.5);
  border-radius: 50%;
  position: fixed; top: 0; left: 0;
  pointer-events: none; z-index: 9998;
  transform: translate(-50%, -50%);
  transition: transform 0.15s ease-out, width 0.3s, height 0.3s;
}

/* Page Loader */
#loader {
  position: fixed; inset: 0;
  background: var(--black);
  z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: 20px;
}
.loader-logo {
  font-family: 'Cinzel', serif;
  font-size: clamp(24px, 5vw, 42px);
  color: var(--gold);
  letter-spacing: 0.3em;
  opacity: 0;
  animation: loaderFade 0.8s ease 0.3s forwards;
}
.loader-bar {
  width: 200px; height: 1px;
  background: var(--dark3);
  position: relative; overflow: hidden;
}
.loader-progress {
  height: 100%;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold), var(--gold-light));
  width: 0;
  animation: loaderProgress 2s ease-in-out 0.5s forwards;
}
.loader-sub {
  font-size: 10px; letter-spacing: 0.4em;
  color: var(--muted); text-transform: uppercase;
  opacity: 0;
  animation: loaderFade 0.8s ease 0.6s forwards;
}
@keyframes loaderFade { to { opacity: 1; } }
@keyframes loaderProgress { to { width: 100%; } }

/* Drone Intro */
#drone-intro {
  position: fixed; inset: 0; z-index: 9001;
  background: var(--black);
  display: flex; align-items: center; justify-content: center;
  animation: droneIntroOut 0.8s ease 2.2s forwards;
  pointer-events: none;
}
@keyframes droneIntroOut { to { opacity: 0; pointer-events: none; } }

.drone-circle {
  position: absolute; border-radius: 50%;
  border: 1px solid rgba(201,168,76,0.2);
  animation: droneExpand 2s ease-out forwards;
}
.dc1 { width: 100px; height: 100px; animation-delay: 0.1s; }
.dc2 { width: 200px; height: 200px; animation-delay: 0.3s; }
.dc3 { width: 400px; height: 400px; animation-delay: 0.5s; }
.dc4 { width: 700px; height: 700px; animation-delay: 0.7s; }
@keyframes droneExpand {
  from { transform: scale(0); opacity: 1; }
  to   { transform: scale(1); opacity: 0; }
}

.drone-crosshair {
  width: 60px; height: 60px; position: relative;
  animation: droneFade 2s ease forwards;
}
.drone-crosshair::before,
.drone-crosshair::after {
  content: ''; position: absolute; background: var(--gold);
}
.drone-crosshair::before { width: 1px; height: 100%; left: 50%; top: 0; }
.drone-crosshair::after  { width: 100%; height: 1px; top: 50%; left: 0; }
@keyframes droneFade {
  0%   { opacity: 0; transform: scale(2); }
  30%  { opacity: 1; transform: scale(1); }
  80%  { opacity: 1; }
  100% { opacity: 0; }
}