/* ===== EVO.OS — el sistema vivo de nodos =====
   Un solo lenguaje visual con memoria, no una ilustración que se reinicia en cada sección:
   hero (nace) · problema (se fragmenta) · método (se ordena por etapas) ·
   capacidades (se coordina) · cierre (cierra el ciclo).
   Todo es SVG real (sin canvas/WebGL): funciona sin JS, con lector de pantalla y con reduced-motion. */

.evo-system { position: relative; width: 100%; }
.evo-system svg { width: 100%; height: auto; overflow: visible; }

/* ---------- vocabulario común ---------- */
.sys-node text {
  font: 700 2.5px var(--ev-font-data);
  letter-spacing: 0.04em;
  fill: rgba(238, 241, 236, 0.62);
}
.sys-node .sys-dot { fill: var(--ev-verdin); }
.sys-node--core .sys-dot { fill: var(--ev-liquen); }
.sys-node--core text { fill: rgba(238, 241, 236, 0.9); }
.sys-halo { fill: none; stroke: var(--ev-verdin); stroke-width: 1.4; opacity: 0.35; }

/* pathLength=100 normaliza cualquier trazo: mismo dasharray para líneas de cualquier largo */
.sys-edge { fill: none; stroke: var(--ev-verdin); stroke-width: 0.55; opacity: 0.8; }
.sys-edge.is-broken { stroke: rgba(238, 241, 236, 0.38); stroke-dasharray: 1.8 2.2; opacity: 0.55; }
.sys-edge.is-stub { stroke: rgba(238, 241, 236, 0.34); stroke-width: 0.5; }
.sys-edge.is-drawn { stroke-dasharray: 100; stroke-dashoffset: 0; }
.sys-x { fill: rgba(238, 241, 236, 0.5); font: 700 3.6px var(--ev-font-data); }
.stub-end { fill: none; stroke: rgba(238, 241, 236, 0.34); stroke-width: 0.4; }

/* ---------- 01 · HERO: el nacimiento del sistema ----------
   Las piezas llegan dispersas, encuentran su lugar y trazan una primera estructura.
   Resuelve en ~1.5s y después solo respira. */
.evo-system--nace .sys-tilt {
  transform: translate(var(--px, 0px), var(--py, 0px));
  transition: transform 520ms var(--ev-ease-out);
}
.evo-system--nace .sys-atmosphere,
.evo-system--nace .sys-edge-field,
.evo-system--nace .sys-node-field {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform 620ms var(--ev-ease-out);
}
.evo-system--nace .sys-atmosphere { transform: translate(var(--back-x, 0px), var(--back-y, 0px)); }
.evo-system--nace .sys-edge-field { transform: translate(var(--edge-x, 0px), var(--edge-y, 0px)); }
.evo-system--nace .sys-node-field { transform: translate(var(--front-x, 0px), var(--front-y, 0px)); }

/* Tres planos visibles incluso sin movimiento: atmósfera, conexiones y nodos elevados. */
.evo-system--nace .hero-depth-aura { fill: url(#hero-aura); }
.evo-system--nace .hero-floor-shadow {
  fill: rgba(2, 8, 6, 0.58);
  filter: url(#hero-floor-blur);
}
.evo-system--nace .hero-orbit {
  fill: none;
  stroke: rgba(185, 228, 212, 0.13);
  stroke-width: 0.34;
  stroke-dasharray: 1.2 2.8;
}
.evo-system--nace .hero-orbit--b { stroke: rgba(94, 150, 131, 0.1); }
.evo-system--nace .sys-connected-edges { filter: url(#hero-edge-glow); }
.evo-system--nace .sys-edge.is-drawn {
  stroke: url(#hero-edge-surface);
  stroke-width: 0.72;
  opacity: 0.92;
}
.evo-system--nace .sys-energy {
  fill: none;
  stroke: #e7fff6;
  stroke-width: 1.05;
  stroke-linecap: round;
  stroke-dasharray: 3 97;
  opacity: 0.8;
  filter: url(#hero-edge-glow);
}
.evo-system--nace .sys-node .sys-dot {
  fill: url(#hero-node-surface);
  stroke: rgba(219, 247, 237, 0.58);
  stroke-width: 0.28;
  filter: url(#hero-node-depth);
}
.evo-system--nace .sys-node--core .sys-dot {
  fill: url(#hero-core-surface);
  stroke: rgba(255, 255, 255, 0.82);
  stroke-width: 0.38;
  filter: url(#hero-core-depth);
}
.evo-system--nace .sys-node-shadow {
  fill: rgba(1, 6, 4, 0.52);
  filter: url(#hero-floor-blur);
}
.evo-system--nace .sys-shine {
  fill: rgba(255, 255, 255, 0.74);
  pointer-events: none;
}
.evo-system--nace .sys-node--core .sys-shine { fill: rgba(255, 255, 255, 0.94); }
.evo-system--nace .sys-node text {
  fill: rgba(238, 241, 236, 0.72);
  paint-order: stroke;
  stroke: rgba(7, 13, 10, 0.62);
  stroke-width: 0.45;
  stroke-linejoin: round;
}
.evo-system--nace .sys-node--core text { fill: rgba(255, 255, 255, 0.96); }
.evo-system--nace .sys-node {
  transition: opacity var(--ev-dur-reveal) var(--ev-ease-out) var(--d, 0ms),
              transform var(--ev-dur-system) var(--ev-ease-out) var(--d, 0ms);
}
.evo-system--nace .sys-edge.is-drawn {
  transition: stroke-dashoffset var(--ev-dur-reveal) var(--ev-ease-out) var(--d, 0ms);
}
.evo-system--nace .sys-gap {
  transition: opacity var(--ev-dur-reveal) var(--ev-ease-out) 1080ms;
}
/* estado inicial con JS: disperso. La clase .evo-ready (la pone el script en línea del
   <head>, no un archivo externo) resuelve el nacimiento — si algo fallara, el sitio
   nunca queda con el hero invisible más allá del arranque. */
.js .evo-system--nace .sys-node { opacity: 0; transform: translate(var(--bx, 0px), var(--by, 0px)); }
.js .evo-system--nace .sys-edge.is-drawn { stroke-dashoffset: 100; }
.js .evo-system--nace .sys-gap { opacity: 0; }
.evo-ready .evo-system--nace .sys-node { opacity: 1; transform: none; }
.evo-ready .evo-system--nace .sys-edge.is-drawn { stroke-dashoffset: 0; }
.evo-ready .evo-system--nace .sys-gap { opacity: 1; }

/* Respiración y pulsos de información: lentos, pequeños y subordinados al mensaje. */
@keyframes ev-respira {
  0%, 100% { opacity: 0.2; stroke-width: 1.2; }
  50%      { opacity: 0.5; stroke-width: 2.6; }
}
@keyframes ev-energia {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -100; }
}
@keyframes ev-orbita {
  0%, 100% { opacity: 0.45; }
  50% { opacity: 0.9; }
}
.evo-system--nace .sys-halo,
.evo-system--cierre .sys-halo { animation: ev-respira var(--ev-dur-ambient) var(--ev-ease-in-out) infinite; }
.evo-ready .evo-system--nace .sys-energy {
  animation: ev-energia 6.8s linear var(--energy-delay, 0s) infinite;
}
.evo-ready .evo-system--nace .hero-orbit { animation: ev-orbita 8s var(--ev-ease-in-out) infinite; }
.evo-ready .evo-system--nace .hero-orbit--b { animation-delay: -4s; }

/* ---------- 02 · PROBLEMA: la fragmentación se ve ---------- */
.evo-system--friccion .problem-depth-field { fill: url(#problem-field); }
.evo-system--friccion .problem-depth-orbit {
  fill: none; stroke: rgba(182, 226, 209, 0.1); stroke-width: 0.34; stroke-dasharray: 1.2 3;
}
.evo-system--friccion .problem-floor-shadow {
  fill: rgba(2, 7, 5, 0.5); filter: blur(2.3px);
}
.evo-system--friccion .sys-node .sys-dot {
  fill: url(#problem-node-surface);
  stroke: rgba(218, 246, 235, 0.48);
  stroke-width: 0.25;
  filter: url(#problem-node-depth);
}
.evo-system--friccion .sys-shine { fill: rgba(255, 255, 255, 0.68); }
.evo-system--friccion .sys-node text {
  fill: rgba(238, 241, 236, 0.72);
  paint-order: stroke; stroke: rgba(5, 10, 8, 0.66); stroke-width: 0.45; stroke-linejoin: round;
}
.sys-ghost { fill: url(#problem-node-surface); opacity: 0.2; filter: url(#problem-node-depth); }
.sys-isolate { fill: none; stroke: rgba(198, 231, 219, 0.36); stroke-width: 0.46; stroke-dasharray: 1 2.4; }
.sys-friction { opacity: 1; }
.js .evo-system--friccion .sys-friction {
  opacity: 0;
  transition: opacity var(--ev-dur-state) var(--ev-ease-out) var(--d, 0ms);
}
/* NO tocar la propiedad CSS transform aquí: el <g> ya trae transform="translate(...)"
   como atributo SVG y la propiedad CSS lo pisaría — las tres etiquetas colapsarían
   al origen (mismo bug detectado en la v0.1). Solo se anima la opacidad. */
.js .evo-system--friccion.is-live .sys-friction { opacity: 1; }
.sys-friction rect {
  fill: url(#problem-friction-surface);
  stroke: rgba(255, 211, 162, 0.46);
  stroke-width: 0.24;
  filter: url(#problem-friction-depth);
}
.sys-friction text {
  font: 800 2.3px var(--ev-font-data); fill: #201106;
  paint-order: stroke; stroke: rgba(255, 210, 159, 0.14); stroke-width: 0.35;
}
.js .evo-system--friccion .sys-stub line,
.js .evo-system--friccion .sys-stub circle { opacity: 0; transition: opacity var(--ev-dur-reveal) var(--ev-ease-out) 200ms; }
.js .evo-system--friccion.is-live .sys-stub line,
.js .evo-system--friccion.is-live .sys-stub circle { opacity: 1; }

/* ---------- 04 · MÉTODO: el sistema se ordena por etapas ---------- */
.evo-system--metodo .sys-edge.is-drawn {
  stroke-dashoffset: 100;
  opacity: 0.48;
  filter: url(#method-edge-glow);
  transition: stroke-dashoffset var(--ev-dur-system) var(--ev-ease-out), stroke var(--ev-dur-state) var(--ev-ease-out), opacity var(--ev-dur-state) var(--ev-ease-out);
}
.evo-system--metodo .sys-edge.is-drawn.is-active { stroke-dashoffset: 0; opacity: 0.95; }
.sys-edge.is-loop.is-active { stroke: var(--ev-ambar); }

.evo-system--metodo .method-depth-field { fill: url(#method-field); }
.evo-system--metodo .method-floor-shadow { fill: rgba(1, 6, 4, 0.55); filter: blur(2.8px); }
.evo-system--metodo .method-orbit {
  fill: none; stroke: rgba(181, 224, 207, 0.12); stroke-width: 0.34; stroke-dasharray: 1.2 3;
}
.evo-system--metodo .method-orbit--inner { stroke: rgba(94, 150, 131, 0.09); stroke-dasharray: 0.8 3.8; }

.stage-node .node-core {
  fill: var(--ev-dark-1); stroke: rgba(238, 241, 236, 0.3); stroke-width: 0.5;
  filter: url(#method-node-depth);
  transition: fill var(--ev-dur-state) var(--ev-ease-out), stroke var(--ev-dur-state) var(--ev-ease-out), stroke-width var(--ev-dur-state) var(--ev-ease-out);
}
.stage-node .stage-shadow {
  fill: rgba(1, 6, 4, 0.48); filter: blur(1.7px);
  transition: opacity var(--ev-dur-state) var(--ev-ease-out);
}
.stage-node .node-shine {
  fill: rgba(255, 255, 255, 0.1);
  transition: fill var(--ev-dur-state) var(--ev-ease-out), opacity var(--ev-dur-state) var(--ev-ease-out);
}
.stage-node .node-memory {
  fill: none; stroke: var(--ev-verdin); stroke-width: 0.4;
  opacity: 0;
  transition: opacity var(--ev-dur-state) var(--ev-ease-out);
}
.stage-node text {
  font: 800 2.4px var(--ev-font-data);
  fill: rgba(238, 241, 236, 0.45);
  transition: fill var(--ev-dur-state) var(--ev-ease-out);
}
/* etapas ya recorridas: memoria del sistema, visibles pero sin protagonismo */
.stage-node.is-reached .node-core { fill: url(#method-node-surface); stroke: rgba(195, 235, 220, 0.52); }
.stage-node.is-reached text { fill: rgba(238, 241, 236, 0.75); }
.stage-node.is-reached .node-memory { opacity: 0.28; }
.stage-node.is-reached .node-shine { fill: rgba(255, 255, 255, 0.58); }
/* etapa activa: máxima presencia */
.stage-node.is-active .node-core {
  fill: url(#method-node-active); stroke: rgba(255, 255, 255, 0.88); stroke-width: 0.75;
  filter: url(#method-active-depth);
}
.stage-node.is-active .node-memory { opacity: 0.65; }
.stage-node.is-active .node-shine { fill: rgba(255, 255, 255, 0.94); }
.stage-node.is-active text { fill: #fff; }

.sys-seed circle { fill: rgba(238, 241, 236, 0.35); transition: fill var(--ev-dur-state) var(--ev-ease-out); }
.sys-seed text { font: 700 2px var(--ev-font-data); fill: rgba(238, 241, 236, 0.38); letter-spacing: 0.12em; }
.seed-edge {
  fill: none; stroke: rgba(238, 241, 236, 0.3); stroke-width: 0.4; stroke-dasharray: 1.6 2;
  transition: stroke var(--ev-dur-state) var(--ev-ease-out), stroke-dasharray var(--ev-dur-state) var(--ev-ease-out);
}
/* al llegar a "evolucionar", lo aprendido vuelve a entrar: las líneas de la realidad se cierran */
.evo-system--metodo[data-active-stage="5"] .seed-edge { stroke: var(--ev-verdin); stroke-dasharray: 100; }
.evo-system--metodo[data-active-stage="5"] .sys-seed circle { fill: var(--ev-verdin); }

/* ---------- 05 · CAPACIDADES: el campo coordinado ---------- */
.cap-field {
  position: relative;
  width: 100%;
  max-width: 820px;
  aspect-ratio: 1.5 / 1;
  min-height: 420px;
}
.cap-web { position: absolute; inset: 0; width: 100%; height: 100%; }
.cap-edge {
  fill: none;
  stroke: var(--ev-campo); stroke-width: 1; opacity: 0.38;
  stroke-linejoin: round; stroke-linecap: round;
  transition: stroke var(--ev-dur-state) var(--ev-ease-out), opacity var(--ev-dur-state) var(--ev-ease-out), stroke-width var(--ev-dur-state) var(--ev-ease-out);
  stroke-dasharray: 100; stroke-dashoffset: 0;
}
.cap-edge.is-active { stroke: var(--ev-verdin); opacity: 1; stroke-width: 1.6; }
.cap-edge.is-linked { stroke: var(--ev-verdin); opacity: 0.55; stroke-width: 1.2; }
.js .cap-field.is-priming .cap-edge { stroke-dashoffset: 100; transition: stroke-dashoffset var(--ev-dur-system) var(--ev-ease-out); }

.cap-hub {
  position: absolute; left: 12%; top: 50%;
  transform: translate(-50%, -50%);
  width: 108px; height: 108px;
  border-radius: 50%;
  background: var(--ev-grafito);
  color: var(--ev-liquen);
  display: grid; place-items: center; text-align: center;
  padding: 0.5rem;
  box-shadow: 0 10px 30px rgba(22, 26, 23, 0.16);
}
.cap-hub strong { display: block; font: 600 0.82rem var(--ev-font-display); letter-spacing: 0.02em; }
.cap-hub span { display: block; margin-top: 0.25rem; font: 700 0.56rem var(--ev-font-data); color: var(--ev-verdin-claro); letter-spacing: 0.08em; }

.cap-group { display: contents; }
.cap-family {
  position: absolute;
  font: 800 0.62rem var(--ev-font-data);
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ev-campo-texto);
  margin: 0;
}
.cap-family--a { left: 29%; top: 0; }
.cap-family--b { left: 53%; top: 0; }
.cap-family--c { left: 77%; top: 0; }

.cap-node {
  position: absolute;
  left: var(--x); top: var(--y);
  transform: translateY(-50%);
  min-height: 44px;
  display: inline-flex; align-items: center;
  padding: 0.5rem 0.85rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--ev-line);
  font: 700 0.66rem / 1.25 var(--ev-font-body);
  color: var(--ev-ink);
  max-width: 150px;
  text-align: left;
  box-shadow: 0 4px 14px rgba(22, 26, 23, 0.05);
  transition: transform var(--ev-dur-fast) var(--ev-ease-out),
              border-color var(--ev-dur-fast) var(--ev-ease-out),
              box-shadow var(--ev-dur-fast) var(--ev-ease-out),
              background var(--ev-dur-fast) var(--ev-ease-out),
              color var(--ev-dur-fast) var(--ev-ease-out);
}
.cap-node::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--ev-line); margin-right: 0.5rem;
  transition: background var(--ev-dur-fast) var(--ev-ease-out), transform var(--ev-dur-fast) var(--ev-ease-out);
}
@media (hover: hover) {
  .cap-node:hover { border-color: var(--ev-verdin); transform: translateY(-50%) translateX(3px); box-shadow: var(--ev-shadow-card); }
}
.cap-node:active { transition-duration: var(--ev-dur-instant); background: var(--ev-verdin-soft); }
.cap-node.is-linked { border-color: rgba(94, 150, 131, 0.55); }
.cap-node.is-linked::before { background: var(--ev-verdin); opacity: 0.5; }
.cap-node.is-active {
  background: var(--ev-grafito); color: var(--ev-liquen); border-color: var(--ev-grafito);
  box-shadow: var(--ev-shadow-card);
}
.cap-node.is-active::before { background: var(--ev-verdin-claro); transform: scale(1.25); }

/* ---------- 09/10 · CIERRE: el ciclo se cierra ---------- */
.evo-system--cierre .sys-edge.is-drawn {
  transition: stroke-dashoffset var(--ev-dur-system) var(--ev-ease-out) var(--d, 0ms);
}
.js .evo-system--cierre.is-priming .sys-edge.is-drawn { stroke-dashoffset: 100; }
.evo-system--cierre .sys-edge.is-loop { stroke: var(--ev-ambar); }
.evo-system--cierre .sys-dot { fill: var(--ev-verdin); }

/* ---------- microdiagramas de la transformación (sección 03) ---------- */
.transf-art circle { fill: var(--ev-verdin); opacity: 0.85; }
.transf-art .tr-edge {
  fill: none; stroke: var(--ev-campo); stroke-width: 0.9; opacity: 0.55;
  stroke-dasharray: 100; stroke-dashoffset: 0;
  transition: stroke-dashoffset var(--ev-dur-system) var(--ev-ease-out) var(--d, 0ms);
}
.js .transf-step:not(.in) .tr-edge { stroke-dashoffset: 100; }
.transf-step[data-step="1"] .transf-art circle { opacity: 0.45; }
.transf-step[data-step="3"] .transf-art .tr-edge { stroke: var(--ev-verdin); opacity: 0.75; }

/* ---------- 08 · el ciclo dirigido ----------
   Misma gramática que el resto del sistema vivo (nodo = pieza, arista = relación),
   aplicada a la organización: la realidad entra, la decisión es humana, dos capacidades
   producen algo verificable y la tercera devuelve lo aprendido a la dirección. */
.ciclo svg { width: 100%; height: auto; overflow: visible; }

.cic-label { font: 800 2.5px var(--ev-font-data); letter-spacing: 0.16em; fill: rgba(238, 241, 236, 0.42); }
.cic-label--loop { fill: rgba(201, 127, 59, 0.62); letter-spacing: 0.12em; }

.cic-in { fill: none; stroke: rgba(238, 241, 236, 0.34); stroke-width: 0.5; stroke-dasharray: 100; stroke-dashoffset: 0; transition: stroke-dashoffset var(--ev-dur-system) var(--ev-ease-out); }

.cic-branch {
  fill: none; stroke: var(--ev-verdin); stroke-width: 0.55; opacity: 0.42;
  stroke-dasharray: 100; stroke-dashoffset: 0;
  transition: stroke-dashoffset var(--ev-dur-system) var(--ev-ease-out) var(--d, 0ms),
              opacity var(--ev-dur-state) var(--ev-ease-out),
              stroke-width var(--ev-dur-state) var(--ev-ease-out);
}
.cic-branch.is-on { opacity: 1; stroke-width: 0.85; }

.cic-return {
  fill: none; stroke: rgba(201, 127, 59, 0.42); stroke-width: 0.5; stroke-dasharray: 1.6 2.2;
  transition: stroke var(--ev-dur-state) var(--ev-ease-out), stroke-width var(--ev-dur-state) var(--ev-ease-out);
}
.cic-return.is-on { stroke: var(--ev-ambar); stroke-width: 0.8; }

/* el punto de decisión: ámbar, contenido, nunca el elemento más grande */
.cic-core-ring { fill: none; stroke: var(--ev-ambar); stroke-width: 0.5; opacity: 0.5; }
.cic-core-dot { fill: var(--ev-ambar); }
.cic-core-text { font: 800 2.3px var(--ev-font-data); letter-spacing: 0.06em; fill: #24160a; }

.cic-node-dot {
  fill: var(--ev-dark-1); stroke: var(--ev-verdin); stroke-width: 0.55;
  transition: fill var(--ev-dur-state) var(--ev-ease-out), stroke var(--ev-dur-state) var(--ev-ease-out);
}
.cic-node-halo {
  fill: none; stroke: var(--ev-verdin); stroke-width: 0.4; opacity: 0;
  transition: opacity var(--ev-dur-state) var(--ev-ease-out);
}
.cic-node-num { font: 800 2.6px var(--ev-font-data); fill: rgba(238, 241, 236, 0.78); transition: fill var(--ev-dur-state) var(--ev-ease-out); }
.cic-node-cap { font: 800 2.3px var(--ev-font-data); letter-spacing: 0.14em; fill: rgba(238, 241, 236, 0.45); transition: fill var(--ev-dur-state) var(--ev-ease-out); }
.cic-node.is-on .cic-node-dot { fill: var(--ev-verdin); stroke: var(--ev-verdin); }
.cic-node.is-on .cic-node-halo { opacity: 0.5; }
.cic-node.is-on .cic-node-num { fill: #0f1512; }
.cic-node.is-on .cic-node-cap { fill: var(--ev-verdin-claro); }
.cic-node--memoria .cic-node-dot { stroke: var(--ev-ambar); }
.cic-node--memoria .cic-node-halo { stroke: var(--ev-ambar); }
.cic-node--memoria.is-on .cic-node-dot { fill: var(--ev-ambar); stroke: var(--ev-ambar); }
.cic-node--memoria.is-on .cic-node-num { fill: #24160a; }
.cic-node--memoria.is-on .cic-node-cap { fill: #daa06a; }

.cic-result rect {
  fill: none; stroke: rgba(238, 241, 236, 0.28); stroke-width: 0.4;
  transition: stroke var(--ev-dur-state) var(--ev-ease-out), fill var(--ev-dur-state) var(--ev-ease-out);
}
.cic-result text { font: 800 2.6px var(--ev-font-data); letter-spacing: 0.1em; fill: rgba(238, 241, 236, 0.72); transition: fill var(--ev-dur-state) var(--ev-ease-out); }
.cic-result.is-on rect { stroke: var(--ev-verdin); fill: rgba(94, 150, 131, 0.12); }
.cic-result.is-on text { fill: #fff; }

/* lo aprendido regresando: única animación ambiental de este viewport */
.cic-pulse { fill: none; stroke: var(--ev-ambar); stroke-width: 0.9; stroke-dasharray: 7 93; stroke-dashoffset: 100; opacity: 0; }
.js .ciclo.is-live .cic-pulse { animation: ev-retorno var(--ev-dur-ambient) linear infinite; }
@keyframes ev-retorno {
  0%   { stroke-dashoffset: 100; opacity: 0; }
  8%   { opacity: 0.85; }
  70%  { stroke-dashoffset: 0; opacity: 0.85; }
  78%, 100% { stroke-dashoffset: 0; opacity: 0; }
}
/* entrada secuencial: el ciclo se traza al llegar a la sección */
.js .ciclo:not(.is-live) .cic-branch,
.js .ciclo:not(.is-live) .cic-in { stroke-dashoffset: 100; }

@media (prefers-reduced-motion: reduce) {
  .evo-system--nace .sys-halo,
  .evo-system--nace .sys-energy,
  .evo-system--nace .hero-orbit,
  .evo-system--cierre .sys-halo,
  .cic-pulse { animation: none !important; }
  .evo-system--nace .sys-energy { opacity: 0; }
  .cic-pulse { opacity: 0; }
}