.sc-wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.sc-scene { border-radius: 28px; border: 1px solid var(--charcoal-border); background: linear-gradient(160deg, rgba(67, 56, 202, 0.16), rgba(20, 21, 26, 0.6) 45%); padding: 26px; }
.sc-svg { display: block; width: 100%; height: auto; font-family: 'Poppins', sans-serif; direction: ltr; }
.sc-svg tspan { unicode-bidi: isolate; }
.sc-panel rect { fill: #191b22; stroke: #34384a; stroke-width: 1.4; }
.sc-pt { fill: #eef0fa; font-size: 21px; font-weight: 700; }
.sc-ps { fill: #86efac; font-size: 13px; font-weight: 700; letter-spacing: .16em; }
.sc-screen rect { fill: #0f1016; stroke: #4c5375; stroke-width: 1.4; }
.sc-screen .sc-stand { fill: #34384a; stroke: none; }
.sc-scr-t { fill: #c7d0fe; font-size: 14px; font-weight: 600; }
.sc-live { fill: #86efac; animation: sc-blink 1.6s ease-in-out infinite; }
.sc-tile rect { fill: #1c1e26; stroke: #34384a; }
.sc-tile-t { fill: #a3a8c3; font-size: 11.5px; font-weight: 500; }
.sc-bar { fill: #818cf8; }
.sc-line { fill: none; stroke: #a5b4fc; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.sc-ok { fill: #86efac; }
.sc-alarm { fill: #f87171; animation: sc-blink 1.2s ease-in-out infinite; }
.sc-warn { fill: #fbbf24; }
.sc-al-a { fill: #eef0fa; font-size: 13px; font-weight: 600; }
.sc-al-b { fill: #a3a8c3; font-size: 12px; }
.sc-person circle, .sc-person path { fill: #262a3a; stroke: #a5b4fc; stroke-width: 1.8; }
.sc-plbl { fill: #c3c7dc; font-size: 12.5px; font-weight: 500; }
.sc-note { fill: #a3a8c3; font-size: 14px; }
.sc-feed-line { fill: none; stroke: #a5b4fc; stroke-width: 2.4; stroke-linecap: round; }
.sc-arrow { fill: #a5b4fc; transform-box: fill-box; transform-origin: center; transform: rotate(180deg); }
.sc-none { fill: none; stroke: none; }
.sc-wire { fill: none; stroke: rgba(165, 180, 252, 0.32); stroke-width: 1.4; }
.sc-port { fill: #a5b4fc; }
.sc-pkt { fill: #c7d0fe; filter: drop-shadow(0 0 4px rgba(165, 180, 252, 0.9)); }
.sc-pkt-in { fill: #e0e7ff; }
.sc-rn { fill: #eef0fa; font-size: 16px; font-weight: 600; }
.sc-rd { fill: #a3a8c3; font-size: 12.5px; }
.sc-app { fill: #a5b4fc; font-weight: 600; }
.sc-ico { fill: none; stroke: #a5b4fc; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sc-ico .sc-fill { fill: rgba(165, 180, 252, 0.35); }
.sc-goods { fill: none; stroke: rgba(253, 224, 71, 0.55); stroke-width: 1.6; stroke-dasharray: 3 4; }
.sc-goods-ah { fill: rgba(253, 224, 71, 0.75); }
.sc-hub-ring { fill: none; stroke: rgba(165, 180, 252, 0.55); stroke-width: 1.6; stroke-dasharray: 3 7; transform-box: fill-box; transform-origin: center; animation: sc-spin 14s linear infinite; }
.sc-hub-core { fill: #0b1030; stroke: none; filter: drop-shadow(0 0 18px rgba(79, 110, 255, 0.55)); }
.sc-eye path { fill: none; stroke: #e0e7ff; stroke-width: 2.6; stroke-linejoin: round; }
.sc-eye circle { fill: #a5b4fc; }
.sc-eye-rim { fill: none; stroke: rgba(165, 180, 252, 0.85); stroke-width: 2; filter: drop-shadow(0 0 8px rgba(99, 132, 255, 0.75)); }
.sc-hub-n { fill: #c7d0fe; font-size: 22px; font-weight: 700; }
.sc-hub-s { fill: #c3c7dc; font-size: 14px; }
.sc-legend { font-size: 12.5px; }
.sc-lg-goods { fill: rgba(253, 224, 71, 0.85); }
.sc-lg-data { fill: #c7d0fe; }
.sc-caption { margin-top: 16px; text-align: center; font-size: 13.5px; color: rgba(255, 255, 255, 0.6); }
.sc-svg-m { display: none; }
@keyframes sc-blink { 50% { opacity: .35; } }
@keyframes sc-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
	.sc-live, .sc-alarm, .sc-hub-ring { animation: none; }
}
@media (max-width: 760px) {
	.sc-wrap { padding: 0 14px; }
	.sc-scene { padding: 10px; border-radius: 22px; }
	.sc-svg-d { display: none; }
	.sc-svg-m { display: block; max-width: 460px; margin: 0 auto; }
}

#supply-chain { scroll-margin-top: 90px; }
.sc-car { position: relative; }
.sc-viewport { overflow: hidden; }
.sc-track { display: flex; transition: transform .5s ease; direction: ltr; }
html[dir="rtl"] .sc-slide { direction: rtl; }
.sc-slide { flex: 0 0 100%; min-width: 0; }
.sc-slide-h { text-align: center; font-size: 20px; font-weight: 600; color: #eef0fa; margin: 0 0 14px; }
.sc-slide-h span { color: #a5b4fc; font-weight: 500; }
.sc-ctrl { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 18px; }
.sc-nav { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--charcoal-border); background: #191b22; color: #c7d0fe; cursor: pointer; font-size: 15px; flex: 0 0 auto; }
.sc-nav:hover, .sc-nav:focus-visible { border-color: #a5b4fc; color: #fff; }
.sc-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.sc-dot { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 6px; background: #34384a; cursor: pointer; transition: width .25s ease, background .25s ease; }
.sc-dot[aria-current="true"] { width: 28px; background: #a5b4fc; }
.ind-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; color: #a5b4fc; font-size: 14px; font-weight: 600; text-decoration: none; }
.ind-link:hover { color: #fff; }
@media (prefers-reduced-motion: reduce) { .sc-track, .sc-dot { transition: none; } }
@media (max-width: 760px) { .sc-slide-h { font-size: 17px; } .sc-slide-h > span { display: block; font-size: 14px; margin-top: 2px; } .sc-sep { display: none; } }