#tumex-product-scenes{--tx-accent:#20a6d8;--tx-dark:#102b43;--tx-ink:#102438;--tx-white:#fff;font-family:Arial,Helvetica,sans-serif;background:var(--tx-dark);color:var(--tx-white);overflow:hidden;border-radius:12px}
#tumex-product-scenes *{box-sizing:border-box}
#tumex-product-scenes .tx-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 30px;background:#081a2a;border-bottom:1px solid #ffffff16}
#tumex-product-scenes .tx-logo{width:138px;height:42px;object-fit:contain}
#tumex-product-scenes .tx-demo{font-size:11px;letter-spacing:2px;color:#c5cbd0}
#tumex-product-scenes .tx-nav{display:flex;background:#14344f;padding:0 22px;gap:3px;overflow:hidden}
#tumex-product-scenes button{font:inherit;cursor:pointer}
#tumex-product-scenes .tx-nav button{flex:1;min-width:0;border:0;border-bottom:3px solid transparent;background:none;color:#c4cbd2;padding:16px 8px;font-size:12px;text-align:left;transition:color .25s,border-color .25s}
#tumex-product-scenes .tx-nav button[aria-pressed="true"]{color:#fff;border-color:var(--tx-accent)}
#tumex-product-scenes .tx-nav b{color:var(--tx-accent);margin-right:7px;font-weight:400}
#tumex-product-scenes .tx-scroll{height:560px;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y proximity;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#20a6d8 #14344f;position:relative;overscroll-behavior-y:contain}
#tumex-product-scenes .tx-scene{position:relative;isolation:isolate;min-height:560px;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;padding:56px 48px 72px;overflow:hidden;background:#102b43}
#tumex-product-scenes .tx-scene > .tx-bg:before{content:"";position:absolute;inset:0;z-index:-2;opacity:.14;background-image:linear-gradient(#a1b7c728 1px,transparent 1px),linear-gradient(90deg,#a1b7c728 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(90deg,#000,transparent)}
#tumex-product-scenes .tx-scene > .tx-bg:after{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 20% 50%,#20a6d829,transparent 65%)}
#tumex-product-scenes .tx-layout{display:grid;grid-template-columns:1.35fr 1fr;align-items:center;gap:38px}
#tumex-product-scenes .tx-art{position:relative;min-width:0;transform:translateX(-150px) rotate(-3deg);opacity:0;transition:transform 1.05s cubic-bezier(.16,1,.3,1),opacity .65s}
#tumex-product-scenes .tx-image{display:block;width:100%;height:290px;object-fit:contain;position:relative;z-index:2;background:#fff;border-radius:3px;padding:12px;box-shadow:0 24px 48px #0003}
#tumex-product-scenes .tx-art:before{content:"";position:absolute;inset:-18px 18px -18px -18px;background:var(--tx-accent);transform:skewY(-6deg);opacity:.85}
#tumex-product-scenes .tx-copy{position:relative;transform:translateX(150px);opacity:0;transition:transform 1.05s cubic-bezier(.16,1,.3,1) .13s,opacity .65s .13s}
#tumex-product-scenes .tx-label{display:block;font-size:10px;letter-spacing:2.5px;color:var(--tx-accent);margin-bottom:18px;font-weight:600}
#tumex-product-scenes h2{font-size:clamp(30px,4.7vw,48px);letter-spacing:-1.6px;line-height:1.02;margin:0 0 20px;font-weight:700;color:inherit}
#tumex-product-scenes h2 em{font-style:normal;color:var(--tx-accent)}
#tumex-product-scenes p{font-size:14px;line-height:1.7;color:#bbc6cf;margin:0 0 22px;max-width:340px}
#tumex-product-scenes .tx-tags{display:flex;flex-wrap:wrap;gap:8px}
#tumex-product-scenes .tx-tags span{border:1px solid #ffffff26;padding:7px 10px;font-size:11px;color:#d5dee4}
#tumex-product-scenes .tx-footer{position:absolute;left:48px;right:48px;bottom:24px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #ffffff24;padding-top:16px}
#tumex-product-scenes .tx-footer small{font-size:10px;letter-spacing:2px;color:#a9b8c2}
#tumex-product-scenes .tx-next{color:inherit;border:0;background:none;font-size:12px;min-height:30px;padding:3px 0}
#tumex-product-scenes .tx-active .tx-art,#tumex-product-scenes .tx-active .tx-copy{opacity:1;transform:translateX(0) rotate(0)}
#tumex-product-scenes .tx-reverse .tx-art{grid-column:2;grid-row:1;transform:translateX(150px) rotate(3deg)}
#tumex-product-scenes .tx-reverse .tx-copy{grid-column:1;grid-row:1;transform:translateX(-150px)}
#tumex-product-scenes .tx-reverse .tx-layout{grid-template-columns:1fr 1.35fr}
#tumex-product-scenes .tx-reverse.tx-active .tx-art,#tumex-product-scenes .tx-reverse.tx-active .tx-copy{transform:none}
#tumex-product-scenes .tx-light{background:#14344f;color:var(--tx-ink)}
#tumex-product-scenes .tx-light p{color:#57656e}
#tumex-product-scenes .tx-light .tx-tags span{color:#394751;border-color:#14344f26}
#tumex-product-scenes .tx-light .tx-footer{border-color:#14344f26}
#tumex-product-scenes .tx-light .tx-footer small{color:#63717a}
#tumex-product-scenes .tx-light > .tx-bg:after{background:linear-gradient(135deg,transparent 60%,#20a6d81a 60%,#20a6d81a 73%,transparent 73%)}
#tumex-product-scenes .tx-light .tx-art:before{inset:25px -18px -18px 18px;transform:skewY(6deg)}
#tumex-product-scenes .tx-tube{background:#102b43}
#tumex-product-scenes .tx-tube > .tx-bg:after{background:repeating-radial-gradient(circle at 9% 52%,transparent 0px,transparent 52px,#20a6d81e 53px,transparent 54px),linear-gradient(90deg,#20a6d810,transparent)}
#tumex-product-scenes .tx-tube .tx-art:before{transform:skewX(-10deg);inset:20px -15px -20px 15px;background:#20a6d8}
#tumex-product-scenes .tx-weld{background:#14344f}
#tumex-product-scenes .tx-weld > .tx-bg:after{background:linear-gradient(135deg,transparent 40%,#20a6d820 40%,#20a6d820 41%,transparent 41%,transparent 70%,#20a6d838 70%,transparent 70.5%)}
#tumex-product-scenes .tx-weld .tx-image{height:310px}
#tumex-product-scenes .tx-progress{height:3px;background:#274a65}
#tumex-product-scenes .tx-progress span{display:block;height:100%;width:25%;background:var(--tx-accent);transition:width .5s}
@media(max-width:620px){#tumex-product-scenes .tx-header{padding:13px 18px}#tumex-product-scenes .tx-demo{font-size:9px;letter-spacing:1px}#tumex-product-scenes .tx-logo{width:112px;height:34px}#tumex-product-scenes .tx-nav{padding:0 10px}#tumex-product-scenes .tx-nav button{font-size:10px;padding:12px 5px}#tumex-product-scenes .tx-nav b{display:block;margin-bottom:5px}#tumex-product-scenes .tx-scroll{height:650px}#tumex-product-scenes .tx-scene{min-height:650px;padding:36px 27px 74px}#tumex-product-scenes .tx-layout,#tumex-product-scenes .tx-reverse .tx-layout{grid-template-columns:1fr;gap:32px}#tumex-product-scenes .tx-reverse .tx-art,#tumex-product-scenes .tx-reverse .tx-copy{grid-column:auto;grid-row:auto}#tumex-product-scenes .tx-image,#tumex-product-scenes .tx-weld .tx-image{height:215px}#tumex-product-scenes h2{font-size:34px;margin-bottom:12px}#tumex-product-scenes h2 br{display:none}#tumex-product-scenes .tx-label{margin-bottom:10px}#tumex-product-scenes p{margin-bottom:13px;max-width:100%}#tumex-product-scenes .tx-footer{left:27px;right:27px;bottom:17px}#tumex-product-scenes .tx-art{transform:translateX(-55px)}#tumex-product-scenes .tx-copy{transform:translateX(55px)}}
@media(prefers-reduced-motion:reduce){#tumex-product-scenes .tx-scroll{scroll-behavior:auto}#tumex-product-scenes .tx-art,#tumex-product-scenes .tx-copy{transition:none;transform:none!important;opacity:1}#tumex-product-scenes .tx-progress span{transition:none}}

#tumex-product-scenes .tx-scene{color:#fff}
#tumex-product-scenes .tx-light p{color:#bbc6cf}
#tumex-product-scenes .tx-light .tx-tags span{color:#d5dee4;border-color:#ffffff26}
#tumex-product-scenes .tx-light .tx-footer{border-color:#ffffff24}
#tumex-product-scenes .tx-light .tx-footer small{color:#a9b8c2}
#tumex-product-scenes .tx-image{background:transparent;box-shadow:none;border-radius:0;padding:0;filter:drop-shadow(0 20px 16px #06182766);height:330px}
#tumex-product-scenes .tx-art:before,#tumex-product-scenes .tx-light .tx-art:before,#tumex-product-scenes .tx-tube .tx-art:before{inset:-45px;background:radial-gradient(ellipse,#35698c99 0,#1f4b6933 45%,transparent 72%);transform:none;opacity:1}
#tumex-product-scenes .tx-weld .tx-image{height:340px}
@media(max-width:620px){#tumex-product-scenes .tx-image,#tumex-product-scenes .tx-weld .tx-image{height:230px}}
#tumex-product-scenes .tx-scene > .tx-bg:before{inset:-60px;opacity:.32;pointer-events:none;animation:tx-grid-drift 7s linear infinite;animation-play-state:paused}
#tumex-product-scenes .tx-scene > .tx-bg:after{inset:-55px;pointer-events:none;transform-origin:50% 50%;animation:tx-pattern-drift 8s ease-in-out infinite alternate;animation-play-state:paused}
#tumex-product-scenes .tx-tube > .tx-bg:after{animation-name:tx-ring-drift;animation-duration:9s}
#tumex-product-scenes .tx-weld > .tx-bg:after{animation-direction:alternate-reverse;animation-duration:7s}
#tumex-product-scenes .tx-active > .tx-bg:before,#tumex-product-scenes .tx-active > .tx-bg:after{animation-play-state:running}
#tumex-product-scenes .tx-art:after{content:none}
@keyframes tx-grid-drift{from{transform:translate(0,0)}to{transform:translate(48px,48px)}}
@keyframes tx-pattern-drift{from{transform:translate(-22px,-10px) scale(1.02)}to{transform:translate(28px,18px) scale(1.07)}}
@keyframes tx-ring-drift{from{transform:translate(-12px,4px) scale(1)}to{transform:translate(24px,-12px) scale(1.12)}}
@media(prefers-reduced-motion:reduce){#tumex-product-scenes .tx-scene > .tx-bg:before,#tumex-product-scenes .tx-scene > .tx-bg:after{animation:none;transform:none}}

/* First scene: moving cyan technical grid and diagonal light bands. */
#tumex-product-scenes .tx-laser > .tx-bg:before{opacity:.48;background-image:linear-gradient(#20a6d84d 1px,transparent 1px),linear-gradient(90deg,#20a6d84d 1px,transparent 1px);mask-image:linear-gradient(90deg,#000 15%,#0005 100%)}
#tumex-product-scenes .tx-laser > .tx-bg:after{inset:-50%;background:linear-gradient(135deg,transparent 28%,#20a6d808 29%,#20a6d82b 34%,#56cfff66 34.15%,transparent 34.4%,transparent 57%,#20a6d814 57.2%,#20a6d838 63%,#56cfff55 63.15%,transparent 63.4%),radial-gradient(ellipse at 30% 45%,#20a6d82b,transparent 55%);animation:tx-laser-sweep 6s ease-in-out infinite alternate;animation-play-state:paused}
#tumex-product-scenes .tx-laser.tx-active > .tx-bg:after{animation-play-state:running}
@keyframes tx-laser-sweep{from{transform:translate(-9%,-4%)}to{transform:translate(9%,4%)}}
@media(prefers-reduced-motion:reduce){#tumex-product-scenes .tx-laser > .tx-bg:after{animation:none;transform:none}}
/* Full-page production layout. */
#tumex-product-scenes{border-radius:0;overflow:visible}
#tumex-product-scenes .tx-scene{height:var(--tx-screen,calc(100svh - 86px));min-height:0;padding:40px max(28px,calc((100% - 1280px)/2)) 112px;overflow-y:auto}
#tumex-product-scenes .tx-layout{max-width:1280px;width:100%;margin:auto;gap:50px;flex:1;min-height:0}
#tumex-product-scenes .tx-image,#tumex-product-scenes .tx-weld .tx-image{height:clamp(160px,42vh,440px);max-width:100%;object-fit:contain}
#tumex-product-scenes .tx-footer{left:max(28px,calc((100% - 1280px)/2));right:max(28px,calc((100% - 1280px)/2));bottom:68px}
#tumex-product-scenes .tx-next{font-size:14px;text-decoration:none}
#tumex-product-scenes .tx-next:focus-visible{outline:2px solid #20a6d8;outline-offset:5px}
#tumex-product-scenes .tx-art,#tumex-product-scenes .tx-copy{opacity:1;transform:none}
.tx-paged #tumex-product-scenes .tx-art{opacity:0;transform:translateX(-100px)}
.tx-paged #tumex-product-scenes .tx-copy{opacity:0;transform:translateX(100px)}
.tx-paged #tumex-product-scenes .tx-reverse .tx-art{transform:translateX(100px)}
.tx-paged #tumex-product-scenes .tx-reverse .tx-copy{transform:translateX(-100px)}
.tx-paged #tumex-product-scenes .tx-active .tx-art,.tx-paged #tumex-product-scenes .tx-active .tx-copy{opacity:1;transform:none}
@media(max-width:620px){
#tumex-product-scenes .tx-scene{padding:22px 24px 112px;justify-content:flex-start}
#tumex-product-scenes .tx-layout{display:flex;flex-direction:column;justify-content:center;gap:18px;flex:1 0 auto}
#tumex-product-scenes .tx-art,#tumex-product-scenes .tx-copy{width:100%}
#tumex-product-scenes .tx-image,#tumex-product-scenes .tx-weld .tx-image{height:clamp(125px,24vh,220px)}
#tumex-product-scenes h2{font-size:30px;margin-bottom:12px}
#tumex-product-scenes p{font-size:13px;line-height:1.5;margin-bottom:12px}
#tumex-product-scenes .tx-label{margin-bottom:10px}
#tumex-product-scenes .tx-footer{position:static;margin-top:22px;gap:8px;flex-wrap:wrap;flex-shrink:0}
}
@media(max-height:650px) and (min-width:621px){#tumex-product-scenes h2{font-size:32px}#tumex-product-scenes .tx-image,#tumex-product-scenes .tx-weld .tx-image{height:200px}}
@media(prefers-reduced-motion:reduce){.tx-paged #tumex-product-scenes .tx-art,.tx-paged #tumex-product-scenes .tx-copy{opacity:1;transform:none!important}}

#tumex-product-scenes .tx-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
/* Touch layouts must never depend on desktop scene activation to reveal products. */
@media(max-width:980px),(hover:none) and (pointer:coarse){
.tx-paged #tumex-product-scenes .tx-scene .tx-art,
.tx-paged #tumex-product-scenes .tx-scene .tx-copy{opacity:1;visibility:visible;transform:none;transition:none}
#tumex-product-scenes .tx-art{flex-shrink:0;min-height:160px}
#tumex-product-scenes .tx-image{display:block;visibility:visible;opacity:1;width:100%;min-height:160px;object-fit:contain}
}
#tumex-product-scenes .tx-product-link{color:inherit;text-decoration:none;cursor:pointer;border-radius:8px}
#tumex-product-scenes .tx-product-link:focus-visible{outline:2px solid #20a6d8;outline-offset:8px}
/* Leave room for the floating contact button beneath the product link. */
@media(min-width:621px){#tumex-product-scenes .tx-footer{bottom:108px}#tumex-product-scenes .tx-scene{padding-bottom:152px}}