/* Hoja completa; la parte crítica está inline en PHP para evitar destello, esto complementa/afina */
:root{
  /* Puedes cambiar la imagen desde aquí si lo prefieres */
  --sp-loading-bg-image: url('/wp-content/uploads/2025/08/BackgroundTheme.jpg');
}

.sp_loader-container{
  position:fixed; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;
  background:#00392E;
  background-image: var(--sp-loading-bg-image);
  background-position:center; background-size:cover; background-repeat:no-repeat;
  z-index:999999999;
  opacity:1; visibility:visible;
}

.sp-loading-active{ overflow:hidden; }

.sp_loader{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; }

.sp_loader-logo{
  width:min(28vw, 180px);
  height:auto;
  border:0; outline:0; object-fit:contain;
}

.sp_loader-text{
  position:absolute;
  bottom:40px;
  left:50%;
  transform: translateX(-50%);
  display:flex; align-items:baseline; gap:8px;
}

/* Tipografías declarativas (reemplaza por tus @font-face si usas archivos) */
@font-face { font-family:"EVJournal"; src: local("EVJournal"); font-style: italic; font-weight: 400; }
@font-face { font-family:"EvieJournal"; src: local("EvieJournal"); font-style: normal; font-weight: 400; }

.sp_loader-word{
  font-family: "EVJournal", serif;
  font-weight: 400;
  font-style: italic;
  font-size: 36px;
  line-height: 45px;
  letter-spacing: -0.025em;
  color: #FFFFFF !important;
}

.sp_loader-dots{
  display:inline-block; min-width: 1ch;
  font-family: "EVJournal", serif;
  font-weight: 400;
  font-style: italic;
  font-size: 36px;
  line-height: 45px;
  letter-spacing: -0.025em;
  color: #FFFFFF !important;
}

.sp_loader-percent{
  font-family: "EvieJournal", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 60px;
  line-height: 72px;
  letter-spacing: -0.025em;
  color: #FFFFFF !important;
}

.sp_loader-container.desvanecer{
  opacity:0; visibility:hidden;
  transition: opacity .35s ease, visibility .35s ease;
}

@media (max-width: 480px){
  .sp_loader-word, .sp_loader-dots{ font-size: 28px; line-height: 36px; }
  .sp_loader-percent{ font-size: 44px; line-height: 54px; }
}