/* Defolt Health & Retail Systems - 0.5x Slow-Mo Splash Screen */
#defolt-splash {
  position: fixed;
  inset: 0;
  background: #f8f9fb;
  z-index: 9999999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: opacity 0.5s ease;
  pointer-events: auto;
  user-select: none;
  -webkit-user-select: none;
}

#defolt-splash .splash-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

#defolt-splash .stage-wrap {
  perspective: 800px;
  transform-style: preserve-3d;
  width: 220px;
  height: 220px;
  position: relative;
  margin-bottom: 24px;
}

#defolt-splash .logo-stage {
  width: 100%;
  height: 100%;
  position: relative;
}

#defolt-splash .slice {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  transform-origin: center center;
}

/* normal speed animations (1.4s duration) */
#defolt-splash .s0 { animation: defoltDepth0 1.4s cubic-bezier(0.2, 0.9, 0.3, 1) forwards; }
#defolt-splash .s1 { animation: defoltDepth1 1.4s cubic-bezier(0.2, 0.9, 0.3, 1) 0.1s forwards; }
#defolt-splash .s2 { animation: defoltDepthNode 1.4s cubic-bezier(0.2, 0.9, 0.3, 1) 0.2s forwards; }
#defolt-splash .s3 { animation: defoltDepth3 1.4s cubic-bezier(0.2, 0.9, 0.3, 1) 0.15s forwards; }
#defolt-splash .s4 { animation: defoltDepth4 1.4s cubic-bezier(0.2, 0.9, 0.3, 1) 0.25s forwards; }
#defolt-splash .s5 { animation: defoltDepth5 1.4s cubic-bezier(0.2, 0.9, 0.3, 1) 0.3s forwards; }

@keyframes defoltDepth0 {
  0% { opacity: 0; transform: translate3d(0, -80px, 180px) rotateX(40deg); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotateX(0deg); }
}
@keyframes defoltDepth1 {
  0% { opacity: 0; transform: translate3d(60px, 0, 140px) rotateY(-30deg); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0deg); }
}
@keyframes defoltDepthNode {
  0% { opacity: 0; transform: translate3d(-120px, 40px, 220px) rotateZ(180deg); }
  70% { transform: translate3d(10px, -5px, 20px) rotateZ(-20deg); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotateZ(0deg); }
}
@keyframes defoltDepth3 {
  0% { opacity: 0; transform: translate3d(-60px, 0, 100px) rotateY(30deg); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0deg); }
}
@keyframes defoltDepth4 {
  0% { opacity: 0; transform: translate3d(70px, 20px, 80px) rotateX(-25deg); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotateX(0deg); }
}
@keyframes defoltDepth5 {
  0% { opacity: 0; transform: translate3d(-50px, 80px, 150px) scale(0.5); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

#defolt-splash .brand-title {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
  opacity: 0;
  animation: defoltTextFade 0.6s ease forwards 0.8s;
}

#defolt-splash .brand-subtitle {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #eb5d1e;
  margin-top: 4px;
  opacity: 0;
  animation: defoltTextFade 0.6s ease forwards 0.95s;
}

@keyframes defoltTextFade {
  to { opacity: 1; }
}
