.hero-art{--scene-accent:#ff6659;transform:none;perspective:1000px;overflow:hidden;border-color:#463337;background:radial-gradient(ellipse at 73% 43%,#54262955,transparent 66%),#14161b}.art-top{padding:17px 20px}.art-controls{display:flex;gap:8px;align-items:center}.motion-toggle{display:flex;align-items:center;justify-content:center;background:#24242c;border:1px solid #58525a;color:#dad5d9;border-radius:4px;width:33px;height:33px;font-size:17px;line-height:1}.motion-toggle:hover{border-color:var(--scene-accent)}.art-top .art-indicator{color:#ffb4a7}.car-scene{position:relative;min-width:0;isolation:isolate}.car-illustration{width:100%;height:auto;overflow:visible;transform:rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transform-origin:50% 65%;transition:transform .3s ease-out}.vehicle-outline{stroke:#aaaab4;stroke-width:1.1}.scene-grid{opacity:.45}.signal-line{fill:none;stroke:var(--scene-accent);stroke-width:1.8;stroke-dasharray:5 8;animation:signal-travel 6s linear infinite}.scanner-line{opacity:.75;transform-origin:center;animation:scan 7s ease-in-out infinite;stroke:var(--scene-accent);stroke-width:1.1}.glow-zone{opacity:.2;transition:opacity .35s}.hero-art[data-visual="hardware"] .hardware-glow,.hero-art[data-visual="ecu"] .ecu-glow,.hero-art[data-visual="data"] .data-glow{opacity:.7}.hero-art[data-visual="hardware"]{--scene-accent:#ffc778}.hero-art[data-visual="data"]{--scene-accent:#74d9d1}.hero-art[data-visual="hardware"] .art-top .art-indicator{color:#ffc778}.hero-art[data-visual="data"] .art-top .art-indicator{color:#a1e8e2}.scene-hotspot{position:absolute;display:flex;align-items:center;gap:6px;padding:6px 9px 6px 6px;background:#111318eb;border:1px solid #6f6267;border-radius:20px;color:#e6e2e4;font:10px "Courier New",monospace;min-height:34px;transition:background .2s,border-color .2s;white-space:nowrap;box-shadow:0 5px 15px #0008}.scene-hotspot span{border:1px solid currentColor;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;color:var(--scene-accent);font-size:10px}.scene-hotspot[aria-pressed=true]{border-color:var(--scene-accent);background:#332021;color:white}.scene-hotspot[aria-pressed=true] span{background:var(--scene-accent);color:#111318}.hotspot-ecu{left:49%;top:22%}.hotspot-hardware{right:3%;top:49%}.hotspot-data{left:6%;top:29%}.visual-hint{position:absolute;bottom:5px;left:20px;right:20px;display:flex;justify-content:space-between;font:8px "Courier New",monospace;letter-spacing:.025em;gap:10px;color:#9d97a3}.visual-hint span:last-child{text-align:right}.visual-detail{border-top:1px solid #3b3038;padding:22px 24px 19px;min-height:142px}.visual-detail .mono{color:var(--scene-accent);font-size:9px}.visual-detail h3{font-size:22px;letter-spacing:-.025em;font-weight:500;margin:10px 0}.visual-detail p:last-child{font-size:12px;line-height:1.8;color:#b9b2be;max-width:440px}.visual-nav{display:flex;align-items:center;gap:7px;border-top:1px solid #322d35;padding:13px 20px}.visual-nav button{background:#1c1d23;border:1px solid #42404b;border-radius:4px;min-height:37px;padding:8px 11px;font-size:10px;flex:1;white-space:nowrap}.visual-nav button[aria-pressed=true]{color:var(--scene-accent);border-color:var(--scene-accent);background:#322327}.visual-nav button:hover{background:#2b2830}.visual-nav button span{opacity:.65;margin-right:7px}.mini-visual{height:104px;margin:-4px -4px 19px;border-radius:4px;overflow:hidden;background:radial-gradient(ellipse at center,#3b242855,#12141955);border:1px solid #30313a}.mini-visual svg{height:100%;width:100%}.mini-visual .flow{stroke-dasharray:4 8;animation:signal-travel 5s linear infinite}.mini-visual .pulse{transform-origin:center;transform-box:fill-box;animation:component-pulse 4s ease-in-out infinite}.mini-visual .scan-wave{stroke-dasharray:270;stroke-dashoffset:270;animation:wave-draw 5s ease-in-out infinite}.mini-visual .logic-dot{animation:dot-light 4s ease-in-out infinite}.mini-visual .logic-dot:nth-of-type(2){animation-delay:1s}.mini-visual .logic-dot:nth-of-type(3){animation-delay:2s}.service-card:hover .mini-visual,.service-card:focus-within .mini-visual{border-color:#9b584f;background:radial-gradient(ellipse at center,#61323366,#17191e)}.scope-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.scope-tags span{padding:4px 7px;border:1px solid #7a4a44;border-radius:3px;color:#efb8ac;font:9px "Courier New",monospace;letter-spacing:.03em}.motion-paused .signal-line,.motion-paused .scanner-line,.motion-paused .mini-visual *{animation-play-state:paused!important}.motion-paused .car-illustration{transform:none!important}.motion-paused .scanner-line{opacity:.3}
@keyframes signal-travel{to{stroke-dashoffset:-104}}@keyframes scan{0%,100%{transform:translateX(-160px);opacity:0}10%,85%{opacity:.55}95%{transform:translateX(210px);opacity:0}}@keyframes component-pulse{0%,100%{opacity:.45}50%{opacity:1}}@keyframes wave-draw{0%,10%{stroke-dashoffset:270}70%,100%{stroke-dashoffset:0}}@keyframes dot-light{0%,100%{fill:#353642}50%{fill:#ff7c6b}}
@media(max-width:1100px){.hero-art .art-top .mono{font-size:8px}.hero-art .art-indicator{font-size:7px}.art-top{padding:14px}.art-controls{gap:6px}.visual-detail{padding:20px;min-height:154px}.visual-detail h3{font-size:20px}.visual-detail p:last-child{font-size:11px}.scene-hotspot{font-size:8px;padding:5px 7px 5px 5px;min-height:30px}.scene-hotspot span{width:18px;height:18px;font-size:9px}.visual-nav{padding:12px 14px}.visual-nav button{padding:8px;font-size:9px}.mini-visual{height:113px}}
@media(max-width:800px){.hero-art .art-top .mono{font-size:10px}.hero-art .art-indicator{font-size:9px}.visual-detail{min-height:136px}.visual-detail p:last-child{font-size:12px}.visual-nav button{font-size:11px;min-height:43px}.scene-hotspot{font-size:10px;min-height:36px}.scene-hotspot span{width:21px;height:21px}.hero-art{margin-bottom:0}}
@media(max-width:540px){.hero-art .art-top .mono{font-size:8px}.hero-art .art-indicator{font-size:7px}.motion-toggle{width:30px;height:30px}.art-top{gap:8px;padding:12px}.scene-hotspot{font-size:8px;padding:5px;gap:4px;min-height:34px}.scene-hotspot span{width:18px;height:18px;font-size:9px}.hotspot-ecu{left:43%;top:19%}.hotspot-data{left:4%;top:30%}.hotspot-hardware{right:2%;top:50%}.visual-hint{left:12px;right:12px;font-size:6.5px;bottom:4px}.visual-detail{padding:19px 16px;min-height:158px}.visual-detail h3{font-size:21px}.visual-detail p:last-child{font-size:11px}.visual-nav{padding:12px;gap:6px}.visual-nav button{font-size:10px;padding:8px 6px}.visual-nav button span{margin-right:3px}.mini-visual{height:112px;margin-bottom:18px}.scope-tags span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.signal-line,.scanner-line,.mini-visual *{animation:none!important}.car-illustration{transform:none!important;transition:none}.mini-visual .scan-wave{stroke-dashoffset:0}.scanner-line{opacity:.2}}

@media(max-width:800px){.motion-toggle{width:44px;height:44px;flex-shrink:0}.scene-hotspot{min-height:44px}.visual-nav button{min-height:44px}}