/* ══════════════════════════════════════════════
   Global Loading Screen — "Corporate Frost"
   ══════════════════════════════════════════════ */

/* ── Container ─────────────────────────────── */
#app-loading-screen {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 40%, #e8ecf1 100%);
}
#app-loading-screen.fade-out {
  opacity: 0;
  transition: opacity .45s cubic-bezier(.4,0,.2,1);
  pointer-events: none;
}

/* ── Entry — fade only, no translate to avoid position jump ── */
.als-c {
  text-align: center;
  animation: als-enter .5s cubic-bezier(.16,1,.3,1) both;
}
@keyframes als-enter {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── SVG rings ─────────────────────────────── */
.als-r1 {
  fill: none; stroke: rgba(0,0,0,.04); stroke-width: .5;
  stroke-dasharray: 3 7;
  transform-origin: 60px 60px;
  animation: als-spin 25s linear infinite;
}
.als-r2 {
  fill: none; stroke: rgba(0,0,0,.06); stroke-width: .75;
  transform-origin: 60px 60px;
  animation: als-spin 18s linear infinite reverse;
}
.als-r3 {
  fill: none; stroke: #E20613; stroke-width: 2.5; stroke-linecap: round;
  stroke-dasharray: 55 228;
  transform-origin: 60px 60px;
  animation: als-spin 1.8s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes als-spin { to { transform: rotate(360deg) } }

/* ── Core dot ──────────────────────────────── */
.als-dot {
  fill: #E20613;
  animation: als-pulse 2.4s ease-in-out infinite;
}
@keyframes als-pulse {
  0%, 100% { opacity: .35; r: 3; }
  50%      { opacity:  1;  r: 5; }
}

/* ── Brand "CRM" ─────────────────────────── */
.als-brand {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: rgba(0,0,0,.25);
  letter-spacing: .32em;
  text-transform: uppercase;
  margin: 28px 0 0;
  animation: als-text-in .5s .1s cubic-bezier(.16,1,.3,1) both;
}

/* ── Name "Contacta" ──────────────────────── */
.als-name {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 26px;
  font-weight: 700;
  color: rgba(15, 23, 42, .88);
  letter-spacing: -.01em;
  margin: 2px 0 0;
  animation: als-text-in .5s .18s cubic-bezier(.16,1,.3,1) both;
}

/* ── Shared text entrance — subtle fade only ── */
@keyframes als-text-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Shimmer bar ───────────────────────────── */
.als-bar {
  width: 100px; height: 2px;
  background: rgba(0,0,0,.06);
  border-radius: 1px;
  margin: 20px auto 0;
  overflow: hidden;
  animation: als-text-in .4s .28s cubic-bezier(.16,1,.3,1) both;
}
.als-fill {
  width: 35%; height: 100%;
  background: linear-gradient(90deg, transparent, #E20613 50%, transparent);
  border-radius: 1px;
  animation: als-shimmer 1.5s ease-in-out infinite;
}
@keyframes als-shimmer {
  0%   { transform: translateX(-300%) }
  100% { transform: translateX(500%) }
}

/* ── Subtitle ─────────────────────────────── */
.als-sub {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 400;
  color: rgba(0,0,0,.28);
  margin: 10px 0 0;
  animation: als-text-in .4s .38s cubic-bezier(.16,1,.3,1) both;
}
