/* ===== PRELOADER SIMPLIA ===== */
#simplia-preloader {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background: transparent !important;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  pointer-events: none;
}

#simplia-preloader .preloader-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#simplia-preloader img {
  width: 520px;
  max-width: 80vw;
  opacity: 0;
  transform: translateY(70px) scale(0.98);
  animation: logo-in 1.65s 0.15s cubic-bezier(.65, .01, .21, 1.1) forwards;
}

#simplia-preloader.s--out img {
  animation: logo-out 1.1s 5.6s cubic-bezier(.73, .01, .27, 1.09) forwards;
}

#simplia-preloader .preloader-underline {
  height: 4px;
  width: 530px;
  background: linear-gradient(90deg, #e02984 0%, #4f9df7 100%);
  border-radius: 8px;
  margin-top: 20px;
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left;
  animation: underline-in-zen 1.6s 1.9s ease-in-out forwards;
}

#simplia-preloader.s--out .preloader-underline {
  transform-origin: left;
  animation: underline-out-zen 1.2s 4.1s ease-in-out forwards;
}

/* === Animacions === */
@keyframes logo-in {
  0%   { opacity: 0; transform: translateY(70px) scale(0.95); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes logo-out {
  0%   { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-60px) scale(0.93); }
}
@keyframes underline-in-zen {
  0%   { opacity: 0; transform: scaleX(0); }
  10%  { opacity: 1; transform: scaleX(0.1); }
  30%  { transform: scaleX(0.3); }
  60%  { transform: scaleX(0.65); }
  100% { transform: scaleX(1); opacity: 1; }
}
@keyframes underline-out-zen {
  0%   { opacity: 1; transform: scaleX(1); }
  100% { opacity: 0; transform: scaleX(0); }
}
@keyframes fadeout-container {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}

/* ✅ Sincronitzat amb JS (2.4s després de .s--out) */
#simplia-preloader.s--out {
  animation: fadeout-container 0.8s ease-out forwards;
  animation-delay: 1.2s;
  pointer-events: none !important;
}

.hidden-during-preload {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 1s cubic-bezier(.79, .06, .25, 1.12);
}

body.preload-done .hidden-during-preload {
  opacity: 1 !important;
  pointer-events: all !important;
  transition: opacity 1s cubic-bezier(.79, .06, .25, 1.12);
}

/* Eliminat display: none per evitar tallar el fadeout-container final */
 body.preload-done #simplia-preloader {
  display: none !important;
} 

/* === Responsive === */
@media (max-width: 1100px) {
  #simplia-preloader img { width: 200px; }
}

@media (max-width: 800px) {
  #simplia-preloader img { width: 100px; }
}

@media (max-width: 950px) {
  .simplia-header .logo-link {
    margin-left: 1.1rem !important;
    height: 34px !important;
  }
  .simplia-header .logo-link img {
    height: 34px !important;
    max-height: 34px !important;
    width: auto !important;
  }
}

body.preload-done .simplia-header .logo-link,
body.preload-done .simplia-header .logo-link img {
  opacity: 1 !important;
  display: flex !important;
  z-index: 10003 !important;
}

/* ➕ Visual skip sense eliminar DOM */
#simplia-preloader.preload-skip {
  opacity: 0 !important;
  pointer-events: none !important;
}