/* 首页业务卡片内部动效：不覆盖卡片尺寸、文字排版或四列网格。 */
.home-it-node,
.home-it-hub,
.home-office-printer,
.home-office-output-paper,
.home-office-flying-paper,
.home-office-paper-stack,
.home-office-consumable-fill,
.home-office-crumbs,
.home-ops-node,
.home-ops-alert,
.home-ops-halo,
.home-ops-ring-progress,
.home-ops-center-fill,
.home-ops-check-flash,
.home-cloud-node,
.home-cloud-hub {
  transform-box: fill-box;
  transform-origin: center;
}

.home-it-node rect { fill: #fff; stroke: #2b70db; stroke-width: 2; }
.home-it-node circle,
.home-it-node path { fill: #2b70db; }
.home-it-node.is-sending rect { fill: #edfaff; stroke: #27c7e5; filter: drop-shadow(0 0 8px rgba(39, 199, 229, .65)); }
.home-it-routes path { transition: stroke .16s ease, opacity .16s ease; }
.home-it-routes path.is-live { stroke: #2ad2e9; stroke-width: 3; stroke-dasharray: 5 5; animation: home-route-flow .42s linear infinite; }
.home-it-hub-wave { fill: none; stroke: #4bd9ef; stroke-width: 3; opacity: 0; transform-box: fill-box; transform-origin: center; }
.home-it-particle { opacity: 0; pointer-events: none; }
.home-it-particle.is-visible { opacity: 1; }
.home-it-particle-spin { transform-box: fill-box; transform-origin: center; animation: home-particle-spin .48s linear infinite; }
.home-it-particle circle { fill: #fff; stroke: #2cd1e8; stroke-width: 2; }
.home-it-particle ellipse { fill: none; stroke: #fff; stroke-width: 1.5; }

.home-office-roller { transform-box: fill-box; transform-origin: center; }
.home-office-flying-paper { opacity: 0; }
.home-office-flight-path { opacity: .6; }
.home-office-consumable-fill { transform-origin: left center; }
.home-office-crumbs { fill: #ffb66f; opacity: 0; }

/* 运维维保：四节点依次报警，中心完成一次修复闭环。 */
.home-ops-connectors path { transition: stroke .18s ease, opacity .18s ease; }
.home-ops-node > rect { fill: #fff; stroke: #8bd8be; stroke-width: 2; }
.home-ops-icon { fill: none; stroke: #20b47f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.home-ops-icon circle { fill: #f2fcf8; }
.home-ops-node.is-alert > rect { fill: #fff8f1; stroke: #ff8a45; filter: drop-shadow(0 0 8px rgba(255, 138, 69, .5)); }
.home-ops-node.is-repaired > rect { fill: #e8fbf3; stroke: #20b47f; filter: drop-shadow(0 0 8px rgba(32, 180, 127, .42)); }
.home-ops-alert { opacity: 0; }
.home-ops-alert > circle:first-child { fill: #ff7043; stroke: #fff; stroke-width: 3; }
.home-ops-alert path { fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; }
.home-ops-alert > circle:last-child { fill: #fff; }
.home-ops-ring-progress { transform: rotate(-90deg); stroke-dasharray: 100; stroke-dashoffset: 100; }
.home-ops-center-fill { opacity: 0; }
.home-ops-check-base { opacity: .72; }
.home-ops-check-flash { opacity: 0; stroke-dasharray: 100; stroke-dashoffset: 100; filter: drop-shadow(0 0 6px rgba(255, 255, 255, .95)); }

/* 软件云服务：沿四条线路把软件与数据送入云端中心。 */
.home-cloud-node > rect { fill: #fff; stroke: #845be3; stroke-width: 2; }
.home-cloud-node path,
.home-cloud-node ellipse,
.home-cloud-node circle { fill: none; stroke: #845be3; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.home-cloud-node circle { fill: #f4efff; }
.home-cloud-node.is-sending > rect { fill: #faf7ff; stroke: #b069ef; filter: drop-shadow(0 0 8px rgba(132, 91, 227, .58)); }
.home-cloud-routes path { transition: stroke .16s ease, opacity .16s ease; }
.home-cloud-routes path.is-live { stroke: #a864f0; stroke-width: 3; stroke-dasharray: 5 5; animation: home-cloud-route-flow .42s linear infinite; }
.home-cloud-hub-wave { fill: none; stroke: #bb78f2; stroke-width: 3; opacity: 0; transform-box: fill-box; transform-origin: center; }
.home-cloud-particle { opacity: 0; pointer-events: none; }
.home-cloud-particle.is-visible { opacity: 1; }
.home-cloud-particle-spin { transform-box: fill-box; transform-origin: center; animation: home-cloud-particle-spin .48s linear infinite; }
.home-cloud-particle circle { fill: #fff; stroke: #a864f0; stroke-width: 2; }
.home-cloud-particle ellipse { fill: none; stroke: #fff; stroke-width: 1.5; }

@keyframes home-route-flow { to { stroke-dashoffset: -20; } }
@keyframes home-particle-spin { to { transform: rotate(360deg); } }
@keyframes home-cloud-route-flow { to { stroke-dashoffset: -20; } }
@keyframes home-cloud-particle-spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  .home-it-particle-spin,
  .home-it-routes path.is-live,
  .home-cloud-particle-spin,
  .home-cloud-routes path.is-live { animation: none !important; }
}
