/* Hardware Hero (Seite 207): Scanner, Druck, Kasse */
[data-id="41d875bc"]{position:relative;isolation:isolate;overflow:hidden;}
[data-id="4abb93f7"]{position:relative;z-index:2!important;}
.vh-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0;transition:opacity 1.6s ease;}
.vh-canvas.is-ready{opacity:1;}

/* Text */
html.vh-anim [data-id="14811482"],
html.vh-anim [data-id="44e074a3"],
html.vh-anim [data-id="71554226"]{opacity:0;translate:0 16px;animation:vhUp 1s cubic-bezier(.2,.7,.2,1) forwards;}
html.vh-anim [data-id="14811482"]{animation-delay:.05s;}
html.vh-anim [data-id="44e074a3"]{animation-delay:.8s;}
html.vh-anim [data-id="71554226"]{animation-delay:1s;}
html.vh-anim [data-id="310523df"]{opacity:0;animation:vhShow .01s 1.5s forwards;}
html.vh-anim [data-id="310523df"].is-split{opacity:1;animation:none;}
.vh-word{display:inline-block;opacity:0;translate:0 .4em;filter:blur(8px);animation:vhWord 1s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(.15s + var(--i) * .08s);}
@keyframes vhUp{to{opacity:1;translate:0 0}}
@keyframes vhShow{to{opacity:1}}
@keyframes vhWord{to{opacity:1;translate:0 0;filter:blur(0)}}

/* Karte: ersetzt "Scale In", ruhiges Schweben */
[data-id="cc7ecd1"]{transform:rotate(-2deg)!important;transition:box-shadow .45s!important;}
html.vh-anim [data-id="cc7ecd1"]{opacity:0;translate:0 22px;animation:vhUp 1.2s cubic-bezier(.2,.7,.2,1) .35s forwards,vhFloat 9s ease-in-out 1.8s infinite;}
@keyframes vhFloat{0%,100%{translate:0 0}50%{translate:0 -8px}}

/* Geraet */
[data-id="1b731326"]{position:relative;transition:border-color .5s ease,box-shadow .5s ease!important;}
[data-id="1b731326"].vh-ok{border-color:#1F9D6B!important;box-shadow:0 1.5rem 3rem rgba(7,46,80,.22),0 0 0 6px rgba(31,157,107,.12)!important;}
.vh-led{display:inline-block;width:.42rem;height:.42rem;margin-right:.45rem;border-radius:50%;background:#14A8C8;vertical-align:.08em;box-shadow:0 0 6px rgba(20,168,200,.8);animation:vhLed 1.6s ease-in-out infinite;}
@keyframes vhLed{50%{opacity:.35}}
[data-id="4013b052"]{position:relative;overflow:hidden;transition:background-color .5s ease!important;}
[data-id="4013b052"].vh-ok{background-color:#E6F6EF!important;}
[data-id="721645fb"]{min-height:4.4rem;display:flex;align-items:center;justify-content:center;}
[data-id="63fe443"]{transition:opacity .25s ease;white-space:nowrap;}
[data-id="63fe443"].vh-fade,[data-id="721645fb"].vh-fade{opacity:0;}
[data-id="721645fb"]{transition:opacity .25s ease;}
[data-id="4013b052"].vh-ok [data-id="721645fb"]{color:#1F9D6B!important;}
.vh-pop{display:inline-block;animation:vhPop .5s cubic-bezier(.3,1.7,.5,1);}
@keyframes vhPop{0%{scale:.3;opacity:0}100%{scale:1;opacity:1}}

/* Modus 1: QR + Scanlinie */
.vh-qr{position:relative;display:grid;grid-template-columns:repeat(9,1fr);width:3.6rem;height:3.6rem;padding:.2rem;background:#fff;border-radius:.3rem;box-shadow:0 0 0 1px #D4E6EF;}
.vh-qr i{display:block;}
.vh-qr i.on{background:#0E2A49;}
.vh-laser{position:absolute;left:-12%;right:-12%;top:0;height:2px;background:#E5484D;box-shadow:0 0 8px 2px rgba(229,72,77,.55);animation:vhLaser 1.1s ease-in-out 1;}
@keyframes vhLaser{0%{top:0;opacity:0}12%{opacity:1}50%{top:100%}88%{opacity:1}100%{top:0;opacity:0}}

/* Modus 2: Drucker */
.vh-printer{position:relative;width:4.2rem;height:4.2rem;}
.vh-printer .body{position:absolute;left:0;right:0;top:.9rem;height:1.6rem;border-radius:.4rem;background:#1E3B5D;}
.vh-printer .body::after{content:"";position:absolute;right:.4rem;top:.5rem;width:.3rem;height:.3rem;border-radius:50%;background:#6CE3B4;}
.vh-printer .slot{position:absolute;left:.55rem;right:.55rem;top:2.25rem;height:.25rem;border-radius:.2rem;background:#0E2A49;}
.vh-printer .paper{position:absolute;left:.75rem;right:.75rem;top:2.3rem;height:1.7rem;border-radius:0 0 .25rem .25rem;background:#fff;box-shadow:0 0 0 1px #CFE0ED;clip-path:inset(0 0 100% 0);animation:vhPrint 1.4s steps(7,end) .15s forwards;}
.vh-printer .paper::before{content:"";position:absolute;left:.3rem;right:.3rem;top:.35rem;height:.18rem;background:#1764AA;border-radius:.1rem;box-shadow:0 .38rem 0 #CFE0ED,0 .72rem 0 #CFE0ED;}
@keyframes vhPrint{to{clip-path:inset(0 0 0 0)}}

/* Modus 3: Kasse */
.vh-amount{font-size:1.6rem;font-weight:800;color:#18334F;letter-spacing:-.01em;}
.vh-card{display:inline-block;width:2.4rem;height:1.55rem;margin-left:.6rem;border-radius:.3rem;background:linear-gradient(135deg,#1764AA,#14A8C8);vertical-align:-.2rem;position:relative;animation:vhTap 1.2s ease-in-out 1;}
.vh-card::after{content:"";position:absolute;left:.3rem;top:.35rem;width:.5rem;height:.38rem;border-radius:.1rem;background:#F6D27A;}
@keyframes vhTap{0%{translate:1.2rem -.6rem;opacity:0}40%{translate:0 0;opacity:1}70%{translate:0 0}100%{translate:0 0}}

/* Fusszeile: aktiver Einsatzbereich */
.vh-modes{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;}
.vh-mode{padding:.25rem .7rem;border-radius:999px;transition:background-color .4s ease,color .4s ease;}
.vh-mode.on{background:#1764AA;color:#fff;}
.vh-dot{color:#B9CCDA;}

@media (prefers-reduced-motion: reduce){
  .vh-canvas{display:none;}
  .vh-led{animation:none;}
}