/* ══════════════════════════════════════
   PRELOADER – Pantalla de carga premium
══════════════════════════════════════ */

.preloader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #0A1F44;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
              visibility 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}

/* Grid de fondo */
.preloader::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px;
  pointer-events: none;
}

/* Glow ambiental */
.preloader__glow {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.preloader__glow--1 {
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59,130,246,0.18) 0%, transparent 70%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: preloaderGlow1 3s ease-in-out infinite;
}

.preloader__glow--2 {
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(96,165,250,0.12) 0%, transparent 70%);
  top: 10%;
  right: 10%;
  animation: preloaderGlow2 4s ease-in-out 1s infinite;
}

@keyframes preloaderGlow1 {
  0%, 100% { opacity: 0.8; transform: translate(-50%, -50%) scale(1); }
  50%       { opacity: 1;   transform: translate(-50%, -50%) scale(1.12); }
}

@keyframes preloaderGlow2 {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50%       { opacity: 0.9; transform: scale(1.1); }
}

/* Contenido central */
.preloader__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
  animation: preloaderFadeIn 0.6s ease both;
}

@keyframes preloaderFadeIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Anillo giratorio */
.preloader__ring-wrap {
  position: relative;
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.preloader__ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(59,130,246,0.25);
  animation: preloaderSpin 3s linear infinite;
}

.preloader__ring::before {
  content: '';
  position: absolute;
  top: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 5px;
  height: 5px;
  background: #3B82F6;
  border-radius: 50%;
  box-shadow: 0 0 10px 3px rgba(59,130,246,0.6);
}

.preloader__ring--outer {
  inset: -14px;
  border-color: rgba(59,130,246,0.1);
  animation: preloaderSpin 6s linear infinite reverse;
}

.preloader__ring--outer::before {
  background: #60A5FA;
  box-shadow: 0 0 8px 2px rgba(96,165,250,0.5);
}

@keyframes preloaderSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Logo */
.preloader__logo {
  height: 58px;
  width: auto;
  animation: preloaderLogoPulse 2s ease-in-out infinite;
  display: block;
}

@keyframes preloaderLogoPulse {
  0%, 100% { opacity: 1;    transform: scale(1); }
  50%       { opacity: 0.8; transform: scale(0.96); }
}

/* Barra de progreso */
.preloader__bar-wrap {
  width: 220px;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: center;
}

.preloader__bar {
  width: 100%;
  height: 2px;
  background: rgba(255,255,255,0.07);
  border-radius: 9999px;
  overflow: hidden;
  position: relative;
}

.preloader__bar-fill {
  position: absolute;
  inset: 0;
  width: 0%;
  background: linear-gradient(90deg, #1D4ED8, #3B82F6, #60A5FA);
  background-size: 200% 100%;
  border-radius: 9999px;
  animation:
    preloaderBarGrow 2s cubic-bezier(0.4, 0, 0.2, 1) forwards,
    preloaderBarShimmer 1.2s linear infinite;
}

@keyframes preloaderBarGrow {
  0%   { width: 0%; }
  30%  { width: 45%; }
  65%  { width: 75%; }
  100% { width: 100%; }
}

@keyframes preloaderBarShimmer {
  0%   { background-position: 200% center; }
  100% { background-position: -200% center; }
}

.preloader__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  font-family: 'Inter', sans-serif;
  user-select: none;
}

/* ── Estado: oculto ── */
.preloader--done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}