/* HorizonX stage with native Storenow demo links. */
.sv-tunnel-showcase{max-width:1600px;margin:auto;padding:48px 0 36px;background:#fff}
.sv-tunnel-showcase .sv-showcase-intro{padding:0 24px;max-width:800px;margin:0 auto 12px;text-align:center}
.sv-tunnel-showcase .sv-showcase-intro h2{font-size:clamp(34px,4vw,55px);letter-spacing:-2px}
.sv-tunnel-showcase .sv-showcase-intro p{font-size:14px;color:#747082;margin-top:15px}
.sv-tunnel-showcase .sv-kicker{color:#786398;margin-bottom:15px}
.sv-theme-tunnel{position:relative;margin-top:20px}
.sv-tunnel-stage{position:relative;width:100%;height:clamp(380px,45vw,650px);overflow:hidden;touch-action:pan-y;cursor:grab;outline-offset:-4px;background:#fff}
.sv-tunnel-stage:active{cursor:grabbing}
.sv-tunnel-stage:focus-visible{outline:2px solid #7661d9}
.tf-gl,.tf-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.tf-live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.sv-tunnel-cards{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;padding:18px 5% 24px}
.sv-home .sv-tunnel-card{display:block;position:relative;flex:0 0 155px;scroll-snap-align:start;overflow:hidden;background:#f7f5fa;border:1px solid #ece7f1;border-radius:8px;color:#544668;text-decoration:none}
.sv-tunnel-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.sv-tunnel-card-name{display:block;padding:9px 12px 2px;font-size:12px}
.sv-tunnel-card-type{display:block;padding:0 12px 10px;font-size:10px;line-height:1.5;color:#81778f}
.sv-tunnel-card:focus-visible{outline:2px solid #7661d9;outline-offset:3px}
.sv-tunnel-footer{padding:0 5%;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#83798f}
.sv-tunnel-hint{display:flex;align-items:center;gap:8px}.sv-tunnel-hint .icon{width:15px;height:15px}
[data-tunnel-state="loading"] .sv-tunnel-stage,[data-tunnel-state="fallback"] .sv-tunnel-stage,.sv-tunnel-stage[data-tf-fallback]{display:none}
[data-tunnel-state="fallback"] .sv-tunnel-card,.sv-theme-tunnel:has([data-tf-fallback]) .sv-tunnel-card{flex-basis:clamp(240px,32vw,420px)}
@media(max-width:720px){.sv-tunnel-showcase{padding:36px 0}.sv-tunnel-showcase .sv-showcase-intro h2{font-size:35px;letter-spacing:-1.4px}.sv-tunnel-showcase .sv-showcase-intro p{line-height:1.65;max-width:310px;margin:12px auto 0}.sv-tunnel-stage{height:54svh;min-height:340px;max-height:530px}.sv-tunnel-card{flex-basis:140px}.sv-tunnel-footer{font-size:10px}.sv-tunnel-selected{max-width:45%;text-align:right}}
@media(prefers-reduced-motion:reduce){.sv-tunnel-stage{display:none}}

/* Native touch swiping plus mouse grab scrolling for the demo strip. */
.sv-tunnel-cards{max-width:100%;min-width:0;box-sizing:border-box;touch-action:pan-x pan-y;overscroll-behavior-x:contain;cursor:grab;-webkit-overflow-scrolling:touch}
.sv-tunnel-cards[data-dragging]{cursor:grabbing;scroll-snap-type:none;user-select:none}
.sv-tunnel-cards[data-dragging] .sv-tunnel-card{cursor:grabbing}
.sv-tunnel-card img{-webkit-user-drag:none;user-select:none}
