/* LORENZO Colorlab — Iconos de servicio animados.
   Trazo 1.5px, bone opaco (--bone), movimiento lineal continuo. */

.sic-box { display: inline-flex; width: 48px; height: 48px; color: var(--bone); flex: none; }
.sic { width: 100%; height: 100%; overflow: visible; color: var(--bone); }
.sic * { transform-box: view-box; }

/* Workflow */
.sic-dash { stroke-dasharray: 6 4; opacity: .85; animation: sic-flow 2.6s linear infinite; }
@keyframes sic-flow { to { stroke-dashoffset: -10; } }

@keyframes sic-rot { to { transform: rotate(360deg); } }

/* Look design — ruedas que respiran y derivan */
.sic-wheel-a, .sic-wheel-b, .sic-wheel-c { animation: sic-wheel 5.2s ease-in-out infinite; }
.sic-wheel-b { animation-delay: -1.73s; }
.sic-wheel-c { animation-delay: -3.46s; }
@keyframes sic-wheel {
  0%, 100% { opacity: .62; transform: translate(0, 0); }
  50% { opacity: 1; transform: translate(1.4px, -1.2px); }
}
.sic-pivot { animation: sic-pivot 5.2s ease-in-out infinite; }
@keyframes sic-pivot { 0%, 100% { opacity: .5; } 50% { opacity: 1; } }

/* Dailies */
.sic-run-y { animation: sic-runy 1.9s linear infinite; }
@keyframes sic-runy { to { transform: translateY(8.5px); } }

/* Edición */
.sic-head { animation: sic-head 4.4s linear infinite; }
@keyframes sic-head { 0% { transform: translateX(0); } 100% { transform: translateX(40px); } }

/* Conformado */
.sic-slot { animation: sic-slot 4s ease-in-out infinite; }
@keyframes sic-slot {
  0%, 8% { transform: translateY(0); opacity: .6; }
  48%, 78% { transform: translateY(-21px); opacity: 1; }
  96%, 100% { transform: translateY(0); opacity: .6; }
}

/* Diseño gráfico — construcción de la A */
.sic-draw-a, .sic-draw-b, .sic-draw-c {
  stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: sic-draw 5.2s cubic-bezier(.16,1,.3,1) infinite;
}
.sic-draw-b { animation-delay: .26s; }
@keyframes sic-draw {
  0% { stroke-dashoffset: 1; }
  26%, 68% { stroke-dashoffset: 0; }
  94%, 100% { stroke-dashoffset: 1; }
}
.sic-node { animation: sic-node 5.2s linear infinite; }
@keyframes sic-node { 0%, 20% { opacity: 0; } 34%, 70% { opacity: 1; } 90%, 100% { opacity: 0; } }

/* Mastering — caja entregada */
.sic-crate { animation: sic-crate 4.6s ease-in-out infinite; }
@keyframes sic-crate {
  0%, 100% { transform: translateX(0); }
  46%, 62% { transform: translateX(2.6px); }
}
.sic-ship line { animation: sic-ship 4.6s linear infinite; }
.sic-ship line:nth-child(2) { animation-delay: .18s; }
.sic-ship line:nth-child(3) { animation-delay: .36s; }
@keyframes sic-ship {
  0% { opacity: 0; transform: translateX(6px); }
  22% { opacity: 1; transform: translateX(0); }
  62% { opacity: 1; transform: translateX(0); }
  84%, 100% { opacity: 0; transform: translateX(-5px); }
}

/* Archivado — actividad del rack y lectura de verificación */
.sic-led-1, .sic-led-2, .sic-led-3 { animation: sic-led 2.4s steps(1, end) infinite; }
.sic-led-2 { animation-delay: .8s; }
.sic-led-3 { animation-delay: 1.6s; }
@keyframes sic-led { 0%, 32% { opacity: 1; } 33%, 100% { opacity: .28; } }
.sic-scan { animation: sic-scan 4.8s linear infinite; }
@keyframes sic-scan {
  0% { opacity: 0; transform: translateY(0); }
  10% { opacity: .85; }
  86% { opacity: .85; }
  100% { opacity: 0; transform: translateY(36px); }
}

@media (prefers-reduced-motion: reduce) {
  .sic *, .sic { animation: none !important; }
}