/* CVH-ALMAS-GLOBAL v1.0 — Partículas almas ascendentes globales CVH
   Enqueue: wp_enqueue_style('cvh-almas-global', ..., [], '1.0.0')
   Container: <div class="cvh-almas-bg" aria-hidden="true" data-cvh-almas></div>
   Inyectado vía wp_body_open en child theme functions.php
   NO duplicar en post_content — este archivo reemplaza el bloque inline de embers */

/* ─── CONTENEDOR GLOBAL ─────────────────────────────────────────────────────── */
.cvh-almas-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.92;
  contain: paint;
  will-change: transform;
}

/* Radiales ambiente: capas estáticas de luz difusa */
.cvh-almas-bg::before {
  content: "";
  position: absolute;
  inset: -10vh -10vw;
  pointer-events: none;
  mix-blend-mode: screen;
  transform: translate3d(0,0,0);
  background:
    radial-gradient(ellipse 360px 190px at 12% 18%, rgba(255,192,77,0.13), transparent 66%),
    radial-gradient(ellipse 300px 180px at 82% 16%, rgba(212,175,55,0.10), transparent 68%),
    radial-gradient(ellipse 420px 220px at 70% 72%, rgba(255,165,0,0.09), transparent 70%),
    radial-gradient(ellipse 260px 170px at 20% 86%, rgba(240,234,214,0.055), transparent 72%);
  opacity: 0.72;
  filter: blur(0.25px);
  animation: cvhAlmasDrift 34s ease-in-out infinite alternate;
}

/* Puntos fijos de luz: estrellas estáticas del fondo */
.cvh-almas-bg::after {
  content: "";
  position: absolute;
  inset: -10vh -10vw;
  pointer-events: none;
  mix-blend-mode: screen;
  transform: translate3d(0,0,0);
  background:
    radial-gradient(circle at 18% 26%, rgba(255,222,148,0.26) 0 1.2px, transparent 3.4px),
    radial-gradient(circle at 38% 64%, rgba(212,175,55,0.20) 0 1px, transparent 3px),
    radial-gradient(circle at 74% 32%, rgba(255,192,77,0.24) 0 1.1px, transparent 3.2px),
    radial-gradient(circle at 88% 78%, rgba(240,234,214,0.16) 0 0.9px, transparent 2.8px),
    radial-gradient(circle at 8%  74%, rgba(212,175,55,0.18) 0 1px, transparent 3px);
  opacity: 0.42;
  filter: blur(0.18px);
  animation: cvhAlmasPulse 8s ease-in-out infinite;
}

/* ─── PARTÍCULA — ALMA ASCENDENTE ───────────────────────────────────────────── */
.cvh-alma {
  position: absolute;
  z-index: 1;
  bottom: -40px;
  width: var(--ember-size, 3px);
  height: var(--ember-size, 3px);
  border-radius: 999px;
  background: radial-gradient(circle,
    #ffffff 0 18%,
    #f8fdff 19% 30%,
    rgba(190,232,255,.95) 31% 46%,
    rgba(212,175,55,.42) 47% 68%,
    transparent 70%
  );
  box-shadow:
    0 0 calc(var(--ember-size) * .75) rgba(255,255,255,1),
    0 0 calc(var(--ember-size) * 1.6) rgba(235,250,255,.95),
    0 0 calc(var(--ember-size) * 3.2) rgba(120,200,255,.65),
    0 0 calc(var(--ember-size) * 5.4) rgba(212,175,55,.32);
  filter: saturate(1.25) brightness(1.35);
  opacity: var(--ember-opacity, .92);
  animation:
    cvhAlmaRise var(--ember-duration, 22s) linear infinite,
    cvhSoulPulse var(--ember-pulse, 3.8s) ease-in-out infinite;
  animation-delay: var(--ember-delay, 0s);
  will-change: transform, opacity, filter;
}

/* Núcleo: punto blanco central */
.cvh-alma::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(3px, calc(var(--ember-size) * .42));
  height: max(3px, calc(var(--ember-size) * .42));
  transform: translate(-50%,-50%);
  border-radius: 999px;
  background: #ffffff;
  box-shadow:
    0 0 3px #ffffff,
    0 0 8px rgba(255,255,255,1),
    0 0 16px rgba(210,245,255,.95),
    0 0 28px rgba(120,200,255,.72);
  opacity: .98;
  animation: cvhSoulCoreBeat var(--ember-pulse, 3.8s) ease-in-out infinite;
}

/* Halo: aureola difusa exterior */
.cvh-alma::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(var(--ember-size) * 5.5);
  height: calc(var(--ember-size) * 5.5);
  min-width: 18px;
  min-height: 18px;
  transform: translate(-50%,-50%);
  border-radius: 999px;
  background: radial-gradient(circle,
    rgba(255,255,255,.55) 0 6%,
    rgba(205,240,255,.38) 7% 24%,
    rgba(212,175,55,.20) 25% 48%,
    transparent 70%
  );
  filter: blur(2px);
  opacity: .75;
  mix-blend-mode: screen;
  animation: cvhSoulHaloBeat var(--ember-pulse, 3.8s) ease-in-out infinite;
}

/* Variante brillante */
.cvh-alma--bright {
  background: radial-gradient(circle at 50% 50%,
    #FFFFFF 0 30%,
    rgba(236,250,255,1) 31% 43%,
    rgba(255,255,255,0.54) 44% 49%,
    rgba(255,222,148,0.48) 60%,
    rgba(255,165,0,0.18) 75%,
    transparent 88%
  );
  box-shadow:
    0 0 7px rgba(255,255,255,1),
    0 0 17px rgba(226,250,255,0.90),
    0 0 34px rgba(255,207,112,0.54),
    0 0 62px rgba(212,175,55,0.30);
}

/* ─── CONTENIDO CVH SOBRE ALMAS ─────────────────────────────────────────────── */
/* Asegura que el contenido de la página esté siempre encima del fondo de almas */
#cvh-cd-page {
  position: relative;
  z-index: 2;
}

/* ─── @KEYFRAMES ────────────────────────────────────────────────────────────── */
@keyframes cvhAlmasDrift {
  0%   { transform: translate3d(-1.4vw,  1vh, 0) scale(1);     opacity: 0.58; }
  100% { transform: translate3d( 1.6vw, -1.8vh, 0) scale(1.035); opacity: 0.78; }
}

@keyframes cvhAlmasPulse {
  0%, 100% { opacity: 0.28; }
  48%       { opacity: 0.46; }
}

@keyframes cvhAlmaRise {
  0%   { opacity: 0;                          transform: translate3d(0, 18px, 0) scale(var(--ember-scale-start, 1)); }
  12%  { opacity: var(--ember-opacity, 0.66); }
  48%  { opacity: var(--ember-opacity-mid, 0.54); transform: translate3d(var(--ember-sway, 18px), -48vh, 0) scale(var(--ember-scale-mid, 1.04)); }
  76%  { opacity: var(--ember-opacity-late, 0.34); }
  100% { opacity: 0;                          transform: translate3d(var(--ember-drift, 26px), -116vh, 0) scale(var(--ember-scale-end, 1.08)); }
}

@keyframes cvhSoulPulse {
  0%, 100% { filter: saturate(1.15) brightness(1.18); opacity: .78; }
  45%, 55%  { filter: saturate(1.45) brightness(1.85); opacity: 1;   }
}

@keyframes cvhSoulCoreBeat {
  0%, 100% { transform: translate(-50%,-50%) scale(.82);  opacity: .82; }
  45%, 55%  { transform: translate(-50%,-50%) scale(1.35); opacity: 1;   }
}

@keyframes cvhSoulHaloBeat {
  0%, 100% { transform: translate(-50%,-50%) scale(.85);  opacity: .42; }
  45%, 55%  { transform: translate(-50%,-50%) scale(1.22); opacity: .92; }
}

/* ─── RESPONSIVE — REDUCCIÓN PARTÍCULAS VÍA VISIBILIDAD ─────────────────────── */
/* Nota: el conteo de partículas se controla en JS (28/16/8 según breakpoint).
   Aquí sólo se garantiza que el contenedor escala bien en móvil. */
@media (max-width: 480px) {
  .cvh-almas-bg { opacity: 0.72; }
}

/* ─── ACCESIBILIDAD — REDUCED MOTION ────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .cvh-almas-bg,
  .cvh-almas-bg::before,
  .cvh-almas-bg::after,
  .cvh-alma,
  .cvh-alma::before,
  .cvh-alma::after {
    animation: none !important;
    transition: none !important;
  }
  .cvh-almas-bg { opacity: 0 !important; }
}

/* ─── COMPAT SCROLL-FIX (inline legacy) ────────────────────────────────────── */
/* Preserva el comportamiento del bloque cvh-almas-scroll-fix que estaba inline */
.cvh-almas-bg {
  contain: paint !important;
}
.cvh-alma {
  pointer-events: none !important;
}