.equipment-banner{font-family:var(--font-kanit),ui-sans-serif,system-ui,sans-serif;color:#1a1a1a;background:#fff;width:100%}.equipment-banner__inner{max-width:1280px;margin:0 auto;padding:32px 16px}.equipment-banner__header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.equipment-banner__title{color:#f0532d;letter-spacing:.02em;font-size:clamp(22px,2.4vw,32px);font-weight:700;line-height:1.2}.equipment-banner__see-all{color:#f0532d;flex-shrink:0;align-items:center;gap:4px;font-size:14px;font-weight:500;text-decoration:none;transition:opacity .15s;display:inline-flex}.equipment-banner__see-all:hover{opacity:.8}.equipment-banner *,.equipment-banner :before,.equipment-banner :after{transition-property:none}.equipment-banner *{box-sizing:border-box;margin:0;padding:0}.equipment-banner .group-label{letter-spacing:1.5px;text-transform:uppercase;color:#888;align-items:center;gap:8px;margin:14px 0 7px;padding:10px 0;font-size:12px;font-weight:700;display:flex}.equipment-banner .group-label:after{content:"";background:#e5e5e5;flex:1;height:1px}.equipment-banner .group-label .pip{background:#f0532d;border-radius:50%;width:4px;height:4px}.equipment-banner .group-label:first-of-type{margin-top:0}.equipment-banner .grid{grid-template-columns:repeat(5,1fr);gap:7px;display:grid}.equipment-banner .grid--four{grid-template-columns:repeat(4,1fr)}@media (max-width:540px){.equipment-banner .grid,.equipment-banner .grid--four{grid-template-columns:repeat(2,1fr)}}@media (max-width:380px){.equipment-banner .grid,.equipment-banner .grid--four{grid-template-columns:repeat(2,1fr);gap:5px}}@media (max-width:640px){.equipment-banner__header{flex-direction:column;align-items:flex-start;gap:8px}}.equipment-banner .card{aspect-ratio:3/5;cursor:pointer;border-radius:8px;text-decoration:none;transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s;display:block;position:relative;overflow:hidden}.equipment-banner .card:hover{transform:translateY(-4px);box-shadow:0 10px 25px #00000040}.equipment-banner .card--components{background:radial-gradient(circle at 50% 70%,#1e90ff 0%,#0052cc 60%,#003d99 100%)}.equipment-banner .card--memory{background:radial-gradient(circle at 50% 70%,#ef4444 0%,#b91c1c 60%,#7f1d1d 100%)}.equipment-banner .card--storage{background:radial-gradient(circle at 50% 70%,#fbbf24 0%,#d97706 60%,#92400e 100%)}.equipment-banner .card--psu{background:radial-gradient(circle at 50% 70%,#22c55e 0%,#15803d 60%,#14532d 100%)}.equipment-banner .card--fan{background:radial-gradient(circle at 50% 70%,#06b6d4 0%,#0891b2 60%,#155e75 100%)}.equipment-banner .card--chassis{background:radial-gradient(circle at 50% 70%,#4b5563 0%,#1f2937 60%,#0a0e1a 100%)}.equipment-banner .card--monitor{background:radial-gradient(circle at 50% 70%,#8b5cf6 0%,#6d28d9 60%,#4c1d95 100%)}.equipment-banner .card--camera{background:radial-gradient(circle at 50% 70%,#ec4899 0%,#be185d 60%,#831843 100%)}.equipment-banner .card--ev{background:radial-gradient(circle at 50% 70%,#78716c 0%,#44403c 60%,#1c1917 100%)}.equipment-banner .card:before{content:"";pointer-events:none;background:radial-gradient(#ffffff2e 0%,#0000 60%);width:140%;height:60%;position:absolute;top:-30%;left:-20%}.equipment-banner .card:after{content:"";pointer-events:none;background:linear-gradient(#0000 0%,#00000059 100%);height:40%;position:absolute;bottom:0;left:0;right:0}.equipment-banner .tag{z-index:3;color:#1a1a1a;letter-spacing:.2px;background:#fffffff2;border-radius:4px;align-items:center;gap:4px;padding:4px 7px 4px 5px;font-size:12px;font-weight:700;display:inline-flex;position:absolute;top:9px;left:7px;box-shadow:0 2px 6px #00000040}.equipment-banner .tag svg{flex-shrink:0;width:12px;height:12px}.equipment-banner .illu{z-index:2;width:80%;transition:transform .5s cubic-bezier(.22,1,.36,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.equipment-banner .card:hover .illu{transform:translate(-50%,-52%)scale(1.05)}.equipment-banner .label{z-index:3;color:#fff;padding:7px 8px 9px;position:absolute;bottom:0;left:0;right:0}.equipment-banner .label__name{letter-spacing:.5px;text-transform:uppercase;text-shadow:0 1px 4px #0006;margin:0;font-size:16px;font-weight:800}.equipment-banner .label__sub{color:#ffffffd9;letter-spacing:.2px;margin-top:1px;font-size:12px;font-weight:500}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}@keyframes pulseFill{0%,to{fill-opacity:.4}50%{fill-opacity:1}}@keyframes dash{to{stroke-dashoffset:-40px}}@keyframes rgbCycle{0%{fill:#ef4444}25%{fill:#ec4899}50%{fill:#8b5cf6}75%{fill:#06b6d4}to{fill:#ef4444}}@keyframes glowSeq{0%,to{fill:#22c55e}50%{fill:#86efac}}@keyframes wifiWave{0%{opacity:0;transform:scale(.6)}40%{opacity:1}to{opacity:0;transform:scale(1.4)}}@keyframes scan{0%{opacity:0;transform:translateY(-100%)}20%{opacity:.8}to{opacity:0;transform:translateY(280px)}}@keyframes hueShift{0%{filter:hue-rotate()}to{filter:hue-rotate(360deg)}}@keyframes blink{0%,49%{opacity:1}50%,to{opacity:.2}}@keyframes boltPulse{0%,to{filter:drop-shadow(0 0 #fbbf24);transform:scale(1)}50%{filter:drop-shadow(0 0 8px #fde68a);transform:scale(1.1)}}@keyframes chargeBar{0%{fill:#44403c}20%{fill:#22c55e}80%{fill:#22c55e}to{fill:#44403c}}@keyframes pulseHalo{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.6;transform:scale(1.08)}}@keyframes glowBar{0%,to{filter:brightness()}50%{filter:brightness(1.4)}}.equipment-banner .comp-led{transform-box:fill-box;transform-origin:50%;animation:2s ease-in-out infinite pulse}.equipment-banner .comp-led:nth-child(2){animation-delay:.3s}.equipment-banner .comp-led:nth-child(3){animation-delay:.6s}.equipment-banner .comp-trace{stroke-dasharray:6 4;animation:2s linear infinite dash}.equipment-banner .card--components:hover .comp-trace,.equipment-banner .card--components:hover .comp-led{animation-duration:.8s}.equipment-banner .comp-cpu{animation:2.4s ease-in-out infinite pulseFill}.equipment-banner .comp-fan{transform-box:fill-box;transform-origin:50%;animation:5s linear infinite spin}.equipment-banner .card--components:hover .comp-fan{animation-duration:1.4s}.equipment-banner .comp-rgb{animation:5s linear infinite rgbCycle}.equipment-banner .mem-rgb{animation:4s linear infinite rgbCycle}.equipment-banner .mem-rgb-2{animation:4s linear -2s infinite rgbCycle}.equipment-banner .card--memory:hover .mem-rgb,.equipment-banner .card--memory:hover .mem-rgb-2{animation-duration:1.5s}.equipment-banner .mem-halo{transform-box:fill-box;transform-origin:50%;animation:2.4s ease-in-out infinite pulseHalo}.equipment-banner .mem-glow{animation:1.8s ease-in-out infinite glowBar}.equipment-banner .card--memory:hover .mem-glow{animation-duration:.9s}.equipment-banner .hdd-platter{transform-box:fill-box;transform-origin:50%;animation:6s linear infinite spin}.equipment-banner .card--storage:hover .hdd-platter{animation-duration:1.8s}.equipment-banner .storage-led{transform-box:fill-box;transform-origin:50%;animation:1.5s ease-in-out infinite pulse}.equipment-banner .storage-activity{transform-box:fill-box;transform-origin:50%;animation:.8s steps(2,end) infinite blink}.equipment-banner .psu-fan{transform-origin:100px 135px;animation:5s linear infinite spin}.equipment-banner .card--psu:hover .psu-fan{animation-duration:1.2s}.equipment-banner .psu-led{transform-box:fill-box;transform-origin:50%;animation:1.8s ease-in-out infinite pulse}.equipment-banner .fan-blades{transform-origin:100px 140px;animation:4s linear infinite spin}.equipment-banner .card--fan:hover .fan-blades{animation-duration:1s}.equipment-banner .fan-ring{transform-origin:100px 140px;animation:8s linear infinite reverse spin}.equipment-banner .chassis-strip{animation:5s linear infinite rgbCycle}.equipment-banner .chassis-strip-2{animation:5s linear -2.5s infinite rgbCycle}.equipment-banner .chassis-fan{transform-origin:100px 195px;animation:6s linear infinite spin}.equipment-banner .card--chassis:hover .chassis-fan{animation-duration:1.5s}.equipment-banner .chassis-power{transform-box:fill-box;transform-origin:50%;animation:1.6s ease-in-out infinite pulse}.equipment-banner .monitor-screen{animation:6s linear infinite hueShift}.equipment-banner .monitor-scan{transform-origin:50%;animation:3s ease-in-out infinite scan}.equipment-banner .card--monitor:hover .monitor-scan{animation-duration:1.2s}.equipment-banner .cam-rec{transform-box:fill-box;transform-origin:50%;animation:1.2s steps(2,end) infinite blink}.equipment-banner .cam-lens-glow{transform-box:fill-box;transform-origin:50%;animation:2.4s ease-in-out infinite pulse}.equipment-banner .wifi-wave{transform-origin:160px 95px;animation:2s ease-out infinite wifiWave}.equipment-banner .wifi-wave:nth-child(2){animation-delay:.5s}.equipment-banner .wifi-wave:nth-child(3){animation-delay:1s}.equipment-banner .ev-bolt{transform-box:fill-box;transform-origin:50%;animation:1.6s ease-in-out infinite boltPulse}.equipment-banner .ev-led{animation:2.5s ease-in-out infinite chargeBar}.equipment-banner .ev-led:first-of-type{animation-delay:0s}.equipment-banner .ev-led:nth-of-type(2){animation-delay:.25s}.equipment-banner .ev-led:nth-of-type(3){animation-delay:.5s}.equipment-banner .ev-led:nth-of-type(4){animation-delay:.75s}.equipment-banner .ev-led:nth-of-type(5){animation-delay:1s}.equipment-banner .card--ev:hover .ev-led{animation-duration:1.2s}@media (prefers-reduced-motion:reduce){.equipment-banner *,.equipment-banner :before,.equipment-banner :after{animation:none!important}}