{"id":3498,"date":"2026-07-24T07:49:26","date_gmt":"2026-07-24T07:49:26","guid":{"rendered":"https:\/\/uisb.com\/?page_id=3498"},"modified":"2026-09-24T06:17:20","modified_gmt":"2026-09-24T06:17:20","slug":"products-overview-2","status":"publish","type":"page","link":"https:\/\/uisb.com\/zh\/products-overview-2\/","title":{"rendered":"Products Overview aff"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3498\" class=\"elementor elementor-3498\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f9da7d3 e-con-full e-flex jltma-glass-effect-no e-con e-parent\" data-id=\"f9da7d3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f4cd3f5 jltma-glass-effect-no elementor-widget elementor-widget-html\" data-id=\"f4cd3f5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Google Fonts -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=DM+Sans:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300&family=Nunito:wght@300;400;500;600;700;800;900&family=Syne:wght@400;600;700;800&family=DM+Mono:wght@400&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/gsap.min.js\" defer><\/script>\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/ScrollTrigger.min.js\" defer><\/script>\r\n<style>\r\n\/* \u2500\u2500 RESET \u2500\u2500 *\/\r\n*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}\r\nhtml{scroll-behavior:smooth;font-size:16px}\r\nbody{font-family:'DM Sans',Arial,sans-serif;background:#fff;color:#0f172a;overflow-x:hidden;-webkit-font-smoothing:antialiased}\r\na{text-decoration:none;color:inherit}\r\n.ast-single-post .entry-content a {\r\n    text-decoration: none;\r\n}\r\n\r\n\/* \u2500\u2500 NAV \u2500\u2500 *\/\r\n.ov-nav{\r\n  position:fixed;top:0;left:0;right:0;z-index:1000;\r\n  height:68px;padding:0 6%;\r\n  display:flex;align-items:center;justify-content:space-between;\r\n  transition:background .45s,backdrop-filter .45s,border-color .45s;\r\n  border-bottom:1px solid transparent;\r\n}\r\n.ov-nav.scrolled{\r\n  background:rgba(2,8,23,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);\r\n  border-color:rgba(255,255,255,.07);\r\n}\r\n.ov-nav-logo{font-size:.72rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.9);}\r\n.ov-nav-links{display:flex;gap:32px;align-items:center;}\r\n.ov-nav-link{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);transition:color .25s;}\r\n.ov-nav-link:hover{color:#fff;}\r\n.ov-nav-enquire{\r\n  padding:9px 22px;border-radius:4px;font-size:.72rem;font-weight:700;\r\n  letter-spacing:.08em;text-transform:uppercase;\r\n  background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff;\r\n  transition:all .25s;cursor:pointer;\r\n}\r\n.ov-nav-enquire:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5);}\r\n\r\n\/* \u2500\u2500 HERO \u2500\u2500 *\/\r\n.ov-hero{\r\n  position:relative;height:100vh;min-height:640px;\r\n  display:flex;flex-direction:column;align-items:center;justify-content:center;\r\n  overflow:hidden;background:#020817;\r\n}\r\n\r\n\/* Animated CSS blobs *\/\r\n.ov-blobs{position:absolute;inset:0;pointer-events:none;overflow:hidden;}\r\n.ov-blob{position:absolute;border-radius:50%;mix-blend-mode:screen;will-change:transform;}\r\n.blob-1{\r\n  width:80vw;height:80vw;top:-30%;left:-20%;\r\n  background:radial-gradient(circle at 50% 50%,rgba(30,64,175,.55),rgba(30,64,175,.1) 55%,transparent 70%);\r\n  animation:b1 16s ease-in-out infinite alternate;\r\n}\r\n.blob-2{\r\n  width:65vw;height:65vw;top:10%;right:-15%;\r\n  background:radial-gradient(circle at 50% 50%,rgba(6,182,212,.35),rgba(6,182,212,.07) 55%,transparent 70%);\r\n  animation:b2 13s ease-in-out infinite alternate;\r\n}\r\n.blob-3{\r\n  width:55vw;height:55vw;bottom:-20%;left:30%;\r\n  background:radial-gradient(circle at 50% 50%,rgba(99,102,241,.3),rgba(99,102,241,.05) 55%,transparent 70%);\r\n  animation:b3 11s ease-in-out infinite alternate;\r\n}\r\n.blob-4{\r\n  width:40vw;height:40vw;top:20%;left:40%;\r\n  background:radial-gradient(circle at 50% 50%,rgba(147,197,253,.18),transparent 70%);\r\n  animation:b4 18s ease-in-out infinite alternate;\r\n}\r\n@keyframes b1{0%{transform:translate(0,0) scale(1)}100%{transform:translate(8%,-14%) scale(1.18)}}\r\n@keyframes b2{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-10%,12%) scale(.88)}}\r\n@keyframes b3{0%{transform:translate(0,0) scale(1)}100%{transform:translate(6%,8%) scale(1.12)}}\r\n@keyframes b4{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-5%,-8%) scale(.92)}}\r\n\r\n\/* Canvas particle overlay *\/\r\n#ovCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.6;}\r\n\r\n\/* Noise grain overlay *\/\r\n.ov-grain{\r\n  position:absolute;inset:0;pointer-events:none;opacity:.028;\r\n  background-image:url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'\/%3E%3C\/svg%3E\");\r\n  background-size:256px 256px;\r\n}\r\n\r\n\/* Hero gradient overlays *\/\r\n.ov-hero::before{\r\n  content:'';position:absolute;inset:0;pointer-events:none;\r\n  background:radial-gradient(ellipse at 50% 0%,rgba(147,197,253,.06) 0%,transparent 60%);\r\n}\r\n.ov-hero::after{\r\n  content:'';position:absolute;bottom:0;left:0;right:0;height:180px;pointer-events:none;\r\n  background:linear-gradient(to top,#020817,transparent);\r\n}\r\n\r\n\/* Hero content *\/\r\n.ov-hero-content{\r\n  position:relative;z-index:2;\r\n  text-align:center;display:flex;flex-direction:column;align-items:center;\r\n  padding:0 4%;\r\n}\r\n.ov-eyebrow{\r\n  font-size:.68rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase;\r\n  color:rgba(255,255,255,.35);margin-bottom:36px;\r\n  display:flex;align-items:center;gap:14px;\r\n}\r\n.ov-eyebrow::before,.ov-eyebrow::after{content:'';display:block;width:36px;height:1px;background:rgba(255,255,255,.2);}\r\n\r\n.ov-hero-title{\r\n  display:flex;flex-direction:column;align-items:center;\r\n  font-size:clamp(5rem,13vw,11rem);font-weight:900;line-height:.86;\r\n  letter-spacing:-.055em;color:#fff;margin-bottom:36px;\r\n  overflow:hidden;\r\n}\r\n.ov-hero-title .t-line{\r\n  display:block;overflow:hidden;\r\n}\r\n.ov-hero-title .t-inner{\r\n  display:block;transform:translateY(110%);opacity:0;\r\n}\r\n.ov-hero-title .t-accent{\r\n  background:linear-gradient(90deg,#60a5fa,#38bdf8);\r\n  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;\r\n}\r\n\r\n.ov-hero-sub{\r\n  font-size:clamp(.9rem,1.8vw,1.1rem);font-weight:300;\r\n  color:rgba(255,255,255,.42);letter-spacing:.03em;\r\n  max-width:480px;line-height:1.7;margin-bottom:60px;\r\n  opacity:0;transform:translateY(16px);\r\n}\r\n.ov-hero-stats{\r\n  display:flex;gap:0;align-items:center;\r\n  opacity:0;transform:translateY(16px);\r\n}\r\n.ov-hstat{\r\n  padding:14px 28px;border:1px solid rgba(255,255,255,.1);\r\n  background:rgba(255,255,255,.04);backdrop-filter:blur(10px);\r\n  text-align:center;\r\n}\r\n.ov-hstat:first-child{border-radius:6px 0 0 6px;}\r\n.ov-hstat:last-child{border-radius:0 6px 6px 0;}\r\n.ov-hstat+.ov-hstat{border-left:none;}\r\n.ov-hstat-val{font-size:1.25rem;font-weight:800;color:#fff;letter-spacing:-.03em;line-height:1;}\r\n.ov-hstat-lbl{font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-top:5px;}\r\n\r\n\/* Scroll indicator *\/\r\n.ov-scroll{\r\n  position:absolute;bottom:40px;left:50%;transform:translateX(-50%);\r\n  z-index:3;display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;\r\n}\r\n.ov-scroll-line{\r\n  width:1px;height:48px;\r\n  background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,.5));\r\n  animation:scrollpulse 2s ease-in-out infinite;\r\n}\r\n@keyframes scrollpulse{\r\n  0%{transform:scaleY(0);transform-origin:top;opacity:0}\r\n  40%{opacity:1}\r\n  50%{transform:scaleY(1);transform-origin:top}\r\n  51%{transform:scaleY(1);transform-origin:bottom}\r\n  100%{transform:scaleY(0);transform-origin:bottom;opacity:0}\r\n}\r\n.ov-scroll-lbl{font-size:.58rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.28);}\r\n\r\n\/* \u2500\u2500 PRODUCT GRID \u2500\u2500 *\/\r\n.ov-grid{\r\n  position:relative;\r\n  display:flex;flex-direction:column;\r\n  background:#fff;\r\n}\r\n\r\n\/* Card background image layer \u2014 sits beneath the hover fill *\/\r\n.ov-cell-bg{\r\n  position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;\r\n}\r\n.ov-cell-bg img{\r\n  width:100%;height:100%;object-fit:cover;display:block;\r\n  transition:transform .7s cubic-bezier(.16,1,.3,1);\r\n}\r\n.ov-cell:hover .ov-cell-bg img{transform:scale(1.1);}\r\n.ov-cell-bg::after{\r\n  content:'';position:absolute;inset:0;\r\n  background:rgba(0,0,0,.48);\r\n  transition:background .4s ease;\r\n}\r\n.ov-cell:hover .ov-cell-bg::after{background:rgba(0,0,0,.35);}\r\n\r\n\/* Default text to white on image-backed cells *\/\r\n.ov-cell .ov-cell-num{color:rgba(255,255,255,.55);}\r\n.ov-cell .ov-cell-badge{color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.3);}\r\n.ov-cell .ov-cell-name{color:#fff;}\r\n.ov-cell .ov-explore{color:#fff;border-color:rgba(255,255,255,.45);}\r\n.ov-cell:hover .ov-cell-badge{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1);}\r\n\r\n.ov-row{\r\n  display:flex;flex:1;\r\n  min-height:50vh;position:relative;\r\n  border-top:1px solid #d1d5db;\r\n}\r\n.ov-row:first-child{border-top:none;}\r\n\r\n\/* Diagonal SVG per row *\/\r\n.row-diag{\r\n  position:absolute;inset:0;width:100%;height:100%;\r\n  pointer-events:none;z-index:3;overflow:visible;\r\n}\r\n.diag-line{\r\n  stroke-dasharray:2000;stroke-dashoffset:2000;\r\n  transition:stroke-dashoffset 1.4s cubic-bezier(.25,.46,.45,.94);\r\n}\r\n.diag-line.drawn{stroke-dashoffset:0;}\r\n\r\n\/* Grid cells *\/\r\n.ov-cell{\r\n  flex:1;position:relative;overflow:hidden;\r\n  padding:clamp(32px,4vw,56px) clamp(32px,4.5vw,64px);\r\n  display:flex;flex-direction:column;justify-content:space-between;\r\n  cursor:pointer;border-right:1px solid #d1d5db;\r\n  min-height:50vh;\r\n}\r\n.ov-cell.right{border-right:none;align-items:flex-end;text-align:right;}\r\n\r\n\/* Cell content layers above bg image *\/\r\n.ov-cell-c{\r\n  position:relative;z-index:2;\r\n  width:100%;height:100%;\r\n  display:flex;flex-direction:column;justify-content:space-between;\r\n}\r\n.ov-cell.right .ov-cell-c{align-items:flex-end;}\r\n\r\n\/* Top: number + badge *\/\r\n.ov-cell-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}\r\n.ov-cell.right .ov-cell-top{flex-direction:row-reverse;}\r\n.ov-cell-num{\r\n  font-size:.65rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase;\r\n  color:rgba(0,0,0,.22);transition:color .35s;\r\n}\r\n.ov-cell-badge{\r\n  display:inline-block;font-size:.62rem;font-weight:800;letter-spacing:.12em;\r\n  text-transform:uppercase;padding:5px 12px;border-radius:3px;\r\n  border:1px solid rgba(0,0,0,.12);color:rgba(0,0,0,.4);\r\n  transition:color .35s,border-color .35s,background .35s;\r\n}\r\n\r\n\/* Product name \u2014 the hero of the cell *\/\r\n.ov-cell-name{\r\n  font-size:clamp(2.8rem,5vw,5rem);font-weight:900;\r\n  letter-spacing:-.055em;line-height:.88;\r\n  color:#0f172a;transition:color .35s;\r\n  margin:auto 0;padding:28px 0;\r\n  \/* stagger reveal *\/\r\n  opacity:0;transform:translateY(32px);\r\n}\r\n.ov-cell-name.visible{opacity:1;transform:translateY(0);}\r\n\r\n\/* Material line *\/\r\n.ov-cell-material{\r\n  font-size:.68rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;\r\n  color:rgba(0,0,0,.3);transition:color .35s;margin-bottom:16px;display:block;\r\n}\r\n\r\n\/* Explore button \u2014 pill style *\/\r\n.ov-explore{\r\n  display:inline-flex;align-items:center;gap:8px;\r\n  font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;\r\n  color:#0f172a;\r\n  border:1.5px solid currentColor;\r\n  border-radius:100px;\r\n  padding:9px 18px;\r\n  transition:color .3s,background .3s,border-color .3s,gap .3s;\r\n}\r\n.ov-explore svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s;}\r\n.ov-cell:hover .ov-explore svg{transform:translateX(5px);}\r\n\r\n\/* Hover: explore button highlight *\/\r\n.ov-cell:hover .ov-explore{border-color:rgba(255,255,255,.8);background:rgba(255,255,255,.15);}\r\n.ov-cell:hover .ov-cell-badge{background:rgba(255,255,255,.1);}\r\n\r\n\/* Thin vertical line at 50% for emphasis (on wider screens) *\/\r\n.ov-grid-vline{\r\n  position:absolute;top:0;bottom:0;left:50%;\r\n  width:1px;background:#d1d5db;pointer-events:none;z-index:1;\r\n}\r\n\r\n\/* \u2500\u2500 PRODUCT OVERVIEW SECTION \u2500\u2500 *\/\r\n:root{\r\n  --white:#ffffff;--soft-blue:#eff6ff;--light-blue:#dbeafe;--sky:#93c5fd;\r\n  --blue:#3b82f6;--deep-blue:#1e40af;--navy:#071a3d;--navy-2:#0f172a;\r\n  --muted:#64748b;--border:rgba(147,197,253,.42);\r\n  --shadow:0 22px 70px rgba(30,64,175,.14);--shadow-strong:0 34px 110px rgba(30,64,175,.25);\r\n}\r\n.eco-label{\r\n  display:inline-flex;align-items:center;gap:8px;\r\n  padding:7px 18px;border-radius:999px;\r\n  background:var(--soft-blue);border:1px solid var(--border);\r\n  color:var(--deep-blue);font-family:'DM Mono',monospace;\r\n  font-size:12px;letter-spacing:1.5px;text-transform:uppercase;\r\n  margin-bottom:22px;transition:all .6s cubic-bezier(.4,0,.2,1);\r\n}\r\n.eco-label::before{\r\n  content:\"\";width:6px;height:6px;border-radius:50%;\r\n  background:var(--blue);flex-shrink:0;animation:eco-pulse-dot 2s ease infinite;\r\n}\r\n@keyframes eco-pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.6)}}\r\n.scroll-product-overview{\r\n  display:grid;grid-template-columns:1.2fr .8fr;gap:70px;\r\n  padding:100px 8%;background:#ffffff;position:relative;overflow:visible;\r\n}\r\n.scroll-product-overview::before{\r\n  content:\"\";position:absolute;inset:0;\r\n  background:radial-gradient(circle at 10% 18%,rgba(147,197,253,.18),transparent 28%),\r\n    linear-gradient(115deg,transparent 0 50%,rgba(219,234,254,.22) 50% 51%,transparent 51%);\r\n  pointer-events:none;\r\n}\r\n.sticky-car-area{position:sticky;top:120px;height:fit-content;align-self:start;z-index:5;width:100%;}\r\n.sticky-car-area h2{\r\n  font-family:'Syne',sans-serif;font-size:clamp(20px,2.5vw,32px);color:#071a3d;\r\n  display:flex;align-items:center;gap:14px;margin-bottom:30px;letter-spacing:-0.3px;\r\n}\r\n.sticky-car-area h2 span{width:58px;height:4px;background:linear-gradient(90deg,#1e40af,#93c5fd);display:inline-block;border-radius:20px;}\r\n.car-wrap{position:relative;width:100%;min-height:0;}\r\n.car-video-stage{\r\n  position:relative;width:100%;aspect-ratio:16\/9;border-radius:22px;overflow:hidden;\r\n  background:radial-gradient(ellipse at 50% 58%,rgba(219,234,254,.7),rgba(240,247,255,.97) 72%);\r\n  border:1px solid rgba(147,197,253,.42);\r\n  box-shadow:0 24px 70px rgba(30,64,175,.13),inset 0 1px 0 rgba(255,255,255,.8);\r\n}\r\n.car-canvas{position:absolute;inset:0;width:100%!important;height:100%!important;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;mix-blend-mode:multiply;display:block;}\r\n.dot-set{position:absolute;inset:0;pointer-events:none;opacity:0;z-index:15;}\r\n.cdot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);z-index:30;cursor:pointer;pointer-events:auto;}\r\n.cdot:hover{z-index:200;}\r\n.cdot__ring{\r\n  width:20px;height:20px;background:#1e40af;border:3px solid rgba(255,255,255,.9);border-radius:50%;\r\n  box-shadow:0 0 0 0 rgba(59,130,246,.5);animation:cdotPulse 2s ease-out infinite;\r\n  transition:transform .2s ease,background .2s ease;position:relative;z-index:2;\r\n}\r\n.cdot:hover .cdot__ring{transform:scale(1.3);background:#3b82f6;}\r\n@keyframes cdotPulse{0%{box-shadow:0 0 0 0 rgba(59,130,246,.55)}60%{box-shadow:0 0 0 10px rgba(59,130,246,0)}100%{box-shadow:0 0 0 0 rgba(59,130,246,0)}}\r\n.cdot__tip{\r\n  position:absolute;width:200px;background:rgba(255,255,255,.97);\r\n  border:1px solid rgba(147,197,253,.5);border-radius:16px;\r\n  box-shadow:0 16px 40px rgba(30,64,175,.18);\r\n  opacity:0;visibility:hidden;pointer-events:none;\r\n  transition:opacity .2s ease,transform .2s ease;z-index:50;\r\n  display:flex;flex-direction:column;overflow:hidden;\r\n}\r\n.cdot:hover .cdot__tip,.cdot:focus-within .cdot__tip,.cdot.is-active .cdot__tip{opacity:1;visibility:visible;pointer-events:auto;}\r\n.cdot--right .cdot__tip{left:10px;top:50%;transform:translateY(-50%) translateX(6px);}\r\n.cdot--right:hover .cdot__tip{transform:translateY(-50%) translateX(0);}\r\n.cdot--right.is-active .cdot__tip,.cdot--right:focus-within .cdot__tip{transform:translateY(-50%) translateX(0);}\r\n.cdot--left .cdot__tip{right:10px;top:50%;transform:translateY(-50%) translateX(-6px);}\r\n.cdot--left:hover .cdot__tip{transform:translateY(-50%) translateX(0);}\r\n.cdot--left.is-active .cdot__tip,.cdot--left:focus-within .cdot__tip{transform:translateY(-50%) translateX(0);}\r\n.cdot--up .cdot__tip{bottom:10px;left:50%;transform:translateX(-50%) translateY(-6px);}\r\n.cdot--up:hover .cdot__tip{transform:translateX(-50%) translateY(0);}\r\n.cdot--up.is-active .cdot__tip,.cdot--up:focus-within .cdot__tip{transform:translateX(-50%) translateY(0);}\r\n.cdot--down .cdot__tip{top:10px;left:50%;transform:translateX(-50%) translateY(6px);}\r\n.cdot--down:hover .cdot__tip{transform:translateX(-50%) translateY(0);}\r\n.cdot--down.is-active .cdot__tip,.cdot--down:focus-within .cdot__tip{transform:translateX(-50%) translateY(0);}\r\n.cdot__img-wrap{width:100%;height:72px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(219,234,254,.6),rgba(239,246,255,.8));padding:8px;flex-shrink:0;cursor:zoom-in;text-decoration:none;}\r\n.cdot__img-wrap img{max-width:100%;max-height:56px;object-fit:contain;display:block;cursor:zoom-in;transition:transform .2s ease,opacity .2s ease;}\r\n.cdot__img-wrap img:hover{transform:scale(1.06);opacity:.9;}\r\n.pinpoint-lightbox{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:clamp(18px,4vw,56px);background:rgba(4,12,30,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility .25s ease;}\r\n.pinpoint-lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto;}\r\n.pinpoint-lightbox__dialog{position:relative;display:flex;align-items:center;justify-content:center;width:min(100%,1100px);height:min(86vh,820px);transform:scale(.94);transition:transform .3s cubic-bezier(.16,1,.3,1);}\r\n.pinpoint-lightbox.is-open .pinpoint-lightbox__dialog{transform:scale(1);}\r\n.pinpoint-lightbox__image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 30px 100px rgba(0,0,0,.45);}\r\n.pinpoint-lightbox__close{position:absolute;top:-14px;right:-14px;width:44px;height:44px;border:1px solid rgba(255,255,255,.28);border-radius:50%;display:grid;place-items:center;background:rgba(7,26,61,.92);color:#fff;font-size:28px;line-height:1;cursor:pointer;box-shadow:0 10px 35px rgba(0,0,0,.28);transition:transform .2s ease,background .2s ease;}\r\n.pinpoint-lightbox__close:hover{transform:scale(1.08);background:var(--blue);}\r\nbody.pinpoint-lightbox-open{overflow:hidden;}\r\n.cdot__body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px;}\r\n.cdot__tag{font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#3b82f6;}\r\n.cdot__body strong{font-size:12px;font-weight:800;color:#071a3d;line-height:1.3;}\r\n.cdot__body p{font-size:11px;color:#64748b;line-height:1.5;margin:0;}\r\n.hud-corner{position:absolute;width:18px;height:18px;border-color:rgba(59,130,246,.55);border-style:solid;z-index:10;pointer-events:none;}\r\n.hud-tl{top:10px;left:10px;border-width:2px 0 0 2px;border-radius:4px 0 0 0;}\r\n.hud-tr{top:10px;right:10px;border-width:2px 2px 0 0;border-radius:0 4px 0 0;}\r\n.hud-bl{bottom:10px;left:10px;border-width:0 0 2px 2px;border-radius:0 0 0 4px;}\r\n.hud-br{bottom:10px;right:10px;border-width:0 2px 2px 0;border-radius:0 0 4px 0;}\r\n.hud-scan{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(59,130,246,.03) 50%,transparent 100%);background-size:100% 60px;animation:hudScan 3.5s linear infinite;pointer-events:none;z-index:5;}\r\n@keyframes hudScan{0%{background-position:0 -60px}100%{background-position:0 130%}}\r\n.hud-status{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;background:rgba(7,26,61,.78);border:1px solid rgba(147,197,253,.28);border-radius:50px;padding:5px 14px;z-index:20;white-space:nowrap;backdrop-filter:blur(10px);}\r\n.hud-label{font-size:10px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;color:rgba(255,255,255,.82);}\r\n.hud-pulse{width:6px;height:6px;background:#22d3ee;border-radius:50%;flex-shrink:0;animation:hudBlink 1.6s ease-in-out infinite;}\r\n@keyframes hudBlink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.75)}}\r\n.hud-pips{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:7px;align-items:center;z-index:20;}\r\n.hud-pip{width:28px;height:3px;border-radius:2px;background:rgba(147,197,253,.35);transition:background .4s ease,width .35s ease;}\r\n.hud-pip.active{background:#1e40af;width:44px;}\r\n.scroll-info-area{display:flex;flex-direction:column;gap:120px;padding:200px 0 0;position:relative;z-index:2;}\r\n.info-panel{\r\n  min-height:420px;background:rgba(255,255,255,.86);padding:45px;border-radius:26px;\r\n  border:1px solid rgba(147,197,253,.42);box-shadow:0 18px 45px rgba(30,64,175,.12);\r\n  display:flex;flex-direction:column;justify-content:center;backdrop-filter:blur(14px);\r\n  position:relative;overflow:hidden;transition:.35s ease;\r\n}\r\n.info-panel::before{content:\"\";position:absolute;width:180px;height:180px;right:-80px;bottom:-80px;background:radial-gradient(circle,rgba(147,197,253,.38),transparent 68%);}\r\n.info-panel:hover{transform:translateY(-8px);box-shadow:0 28px 70px rgba(59,130,246,.2);}\r\n.info-panel h3{font-family:'Syne',sans-serif;font-size:clamp(24px,3vw,34px);color:#071a3d;margin-bottom:20px;position:relative;z-index:2;letter-spacing:-0.5px;}\r\n.info-panel p{font-size:18px;line-height:1.8;color:#334155;margin-bottom:14px;position:relative;z-index:2;}\r\n.product-list{margin-top:20px;display:grid;gap:12px;position:relative;z-index:2;}\r\n.product-list span{background:#ffffff;padding:14px 18px;border-radius:12px;font-weight:700;color:#071a3d;border-left:5px solid #3b82f6;box-shadow:0 10px 25px rgba(30,64,175,.08);}\r\n@media(max-width:900px){\r\n  html{overflow-x:hidden;}\r\n  .scroll-product-overview{grid-template-columns:1fr;}\r\n  .sticky-car-area{position:relative;top:0;}\r\n  .scroll-info-area{gap:35px;padding:20px 0;}\r\n  .info-panel{min-height:auto;}\r\n  .cdot--left .cdot__tip,.cdot--right .cdot__tip{left:50%;right:auto;top:10px;bottom:auto;transform:translateX(-50%) translateY(6px);}\r\n  .cdot--left:hover .cdot__tip,.cdot--right:hover .cdot__tip,.cdot--left.is-active .cdot__tip,.cdot--right.is-active .cdot__tip,.cdot--left:focus-within .cdot__tip,.cdot--right:focus-within .cdot__tip{transform:translateX(-50%) translateY(0);}\r\n}\r\n@media(max-width:768px){\r\n  .sticky-car-area{display:none;}\r\n  .scroll-product-overview{grid-template-columns:1fr;}\r\n}\r\n\r\n\/* \u2500\u2500 CTA \u2500\u2500 *\/\r\n.ov-cta{\r\n  position:relative;overflow:hidden;\r\n  background:#fff;\r\n  padding:clamp(80px,12vw,160px) 6%;\r\n  display:flex;flex-direction:column;align-items:center;\r\n  text-align:center;\r\n  border-top:1px solid #e2e8f0;\r\n}\r\n.ov-cta-eyebrow{\r\n  font-size:.65rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase;\r\n  color:rgba(0,0,0,.3);margin-bottom:32px;\r\n  display:flex;align-items:center;gap:14px;\r\n  position:relative;z-index:2;\r\n}\r\n.ov-cta-eyebrow::before,.ov-cta-eyebrow::after{content:'';display:block;width:28px;height:1px;background:rgba(0,0,0,.15);}\r\n.ov-cta-title{\r\n  font-size:clamp(3.8rem,9vw,8.5rem);font-weight:900;\r\n  line-height:.88;letter-spacing:-.055em;\r\n  color:#0f172a;margin-bottom:32px;\r\n  position:relative;z-index:2;\r\n  opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s ease;\r\n}\r\n.ov-cta-title.visible{opacity:1;transform:translateY(0);}\r\n.ov-cta-title span{\r\n  background:linear-gradient(90deg,#1e40af 0%,#3b82f6 50%,#60a5fa 100%);\r\n  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;\r\n}\r\n.ov-cta-sub{\r\n  font-size:clamp(.95rem,1.8vw,1.15rem);font-weight:300;\r\n  color:rgba(0,0,0,.42);letter-spacing:.02em;line-height:1.75;\r\n  max-width:460px;margin-bottom:56px;\r\n  position:relative;z-index:2;\r\n  opacity:0;transform:translateY(16px);transition:opacity .8s ease .15s,transform .8s ease .15s;\r\n}\r\n.ov-cta-sub.visible{opacity:1;transform:translateY(0);}\r\n.ov-cta-actions{\r\n  position:relative;z-index:2;\r\n  opacity:0;transform:translateY(16px);transition:opacity .7s ease .28s,transform .7s ease .28s;\r\n}\r\n.ov-cta-actions.visible{opacity:1;transform:translateY(0);}\r\n.ov-cta-btn-primary{\r\n  display:inline-flex;align-items:center;gap:10px;\r\n  padding:16px 40px;border-radius:4px;\r\n  font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;\r\n  background:#0f172a;color:#fff;\r\n  transition:background .25s,gap .25s;\r\n}\r\n.ov-cta-btn-primary:hover{background:#1e3a8a;gap:14px;}\r\n.ov-cta-btn-primary svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s;}\r\n.ov-cta-btn-primary:hover svg{transform:translateX(4px);}\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media(max-width:900px){\r\n  .ov-hero-title{font-size:clamp(3.5rem,10vw,7rem);}\r\n  .ov-hstat{padding:12px 18px;}\r\n  .ov-nav-links{display:none;}\r\n  .ov-row{flex-direction:column;min-height:auto;}\r\n  .ov-cell{min-height:45vh;border-right:none;border-bottom:1px solid #d1d5db;}\r\n  .ov-cell.right{align-items:flex-start;text-align:left;}\r\n  .ov-cell.right .ov-cell-c{align-items:flex-start;}\r\n  .ov-cell.right .ov-cell-top{flex-direction:row;}\r\n  .row-diag{display:none;}\r\n}\r\n@media(max-width:600px){\r\n  .ov-hero-stats{display:none;}\r\n  .ov-hero-sub{margin-bottom:40px;}\r\n  .ov-cell{padding:32px 28px;min-height:42vh;}\r\n  .ov-cell-name{font-size:clamp(2.4rem,9vw,4rem);}\r\n}\r\n<\/style>\r\n\r\n<!-- \u2500\u2500 HERO \u2500\u2500 -->\r\n<section class=\"ov-hero\" id=\"ovHero\">\r\n\r\n  <!-- Animated blobs -->\r\n  <div class=\"ov-blobs\">\r\n    <div class=\"ov-blob blob-1\"><\/div>\r\n    <div class=\"ov-blob blob-2\"><\/div>\r\n    <div class=\"ov-blob blob-3\"><\/div>\r\n    <div class=\"ov-blob blob-4\"><\/div>\r\n  <\/div>\r\n\r\n  <!-- Particle canvas -->\r\n  <canvas id=\"ovCanvas\"><\/canvas>\r\n\r\n  <!-- Grain texture -->\r\n  <div class=\"ov-grain\"><\/div>\r\n\r\n  <!-- Content -->\r\n  <div class=\"ov-hero-content\">\r\n\r\n    <h1 class=\"ov-hero-title\">\r\n      <span class=\"t-line\"><span class=\"t-inner\">OUR<\/span><\/span>\r\n      <span class=\"t-line\"><span class=\"t-inner t-accent\">SPECIALIZED<\/span><\/span>\r\n      <span class=\"t-line\"><span class=\"t-inner\">PRODUCTS<\/span><\/span>\r\n    <\/h1>\r\n\r\n    <p class=\"ov-hero-sub\">\r\n      Four material grades \u2014 from standard automotive to industrial-grade double-wall containment. One manufacturing standard. Precision-formed for every environment.\r\n    <\/p>\r\n\r\n  <\/div>\r\n\r\n  <div class=\"ov-scroll\" id=\"ovScroll\">\r\n    <div class=\"ov-scroll-line\"><\/div>\r\n    <div class=\"ov-scroll-lbl\">Explore Range<\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 PRODUCT OVERVIEW \u2500\u2500 -->\r\n<section class=\"scroll-product-overview\" id=\"productOverview\">\r\n  <div class=\"sticky-car-area\">\r\n    <div class=\"eco-label\">Product Overview<\/div>\r\n    <h2><span><\/span>Product Overview<\/h2>\r\n    <div class=\"car-wrap\">\r\n      <div class=\"car-video-stage\">\r\n        <div class=\"hud-corner hud-tl\"><\/div>\r\n        <div class=\"hud-corner hud-tr\"><\/div>\r\n        <div class=\"hud-corner hud-bl\"><\/div>\r\n        <div class=\"hud-corner hud-br\"><\/div>\r\n        <div class=\"hud-scan\"><\/div>\r\n        <div class=\"hud-status\">\r\n          <span class=\"hud-pulse\"><\/span>\r\n        <\/div>\r\n        <div class=\"hud-pips\">\r\n          <div class=\"hud-pip active\" id=\"pip0\"><\/div>\r\n          <div class=\"hud-pip\" id=\"pip1\"><\/div>\r\n          <div class=\"hud-pip\" id=\"pip2\"><\/div>\r\n        <\/div>\r\n        <canvas id=\"carCanvas\" class=\"car-canvas\"><\/canvas>\r\n      <\/div>\r\n      <div class=\"dot-set\" id=\"dotSet0\">\r\n        <div class=\"cdot cdot--left\" style=\"--x:25%;--y:44%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-08_39_16-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-08_39_16-AM.png\" alt=\"Support assy hood\"><\/a><div class=\"cdot__body\"><strong>Support Assy Hood<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--down\" style=\"--x:33%;--y:57%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923081822.jpeg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923081822.jpeg\" alt=\"Battery clamp\"><\/a><div class=\"cdot__body\"><strong>Battery Clamp<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--up\" style=\"--x:34%;--y:45%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_and_change_background_2K_20260923081835.jpeg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_and_change_background_2K_20260923081835.jpeg\" alt=\"Clamp Clutch Cable\"><\/a><div class=\"cdot__body\"><strong>Clamp Clutch Cable<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--Right\" style=\"--x:40%;--y:45%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923082030.jpeg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923082030.jpeg\" alt=\"Instrument Panel\"><\/a><div class=\"cdot__body\"><strong>Reinforcement Instrument Panel<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--left\" style=\"--x:63%;--y:50%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923081845.jpeg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923081845.jpeg\" alt=\"Rod FR Door Lock Open LH\/RH\"><\/a><div class=\"cdot__body\"><strong>Rod FR Door Lock Open LH\/RH<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--up\" style=\"--x:73%;--y:40%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923081859.jpeg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/Upscale_image_with_white_background_2K_20260923081859.jpeg\" alt=\"Rod RR Door Lock Open LH\/RH\"><\/a><div class=\"cdot__body\"><strong>Rod RR Door Lock Open LH\/RH<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--down\" style=\"--x:80%;--y:50%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-08_33_16-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-08_33_16-AM.png\" alt=\"Exhaust System\"><\/a><div class=\"cdot__body\"><strong>Exhaust System<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--up\" style=\"--x:65%;--y:40%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/Enhance_and_upscale_image_2K_20260923081908.jpeg\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/Enhance_and_upscale_image_2K_20260923081908.jpeg\" alt=\"Reinforcement RR Side Member\"><\/a><div class=\"cdot__body\"><strong>Reinforcement RR Side Member<\/strong><\/div><\/div><\/div>\r\n      <\/div>\r\n      <div class=\"dot-set\" id=\"dotSet1\">\r\n        <div class=\"cdot cdot--down\" style=\"--x:14%;--y:63%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_19-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_19-AM.png\" alt=\"Cross Member\"><\/a><div class=\"cdot__body\"><strong>Cross member<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--left\" style=\"--x:18%;--y:47%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_26-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_26-AM.png\" alt=\"Metal Fuel Tank\"><\/a><div class=\"cdot__body\"><strong>Electric water pump<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--right\" style=\"--x:20%;--y:56%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_31_07-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_31_07-AM.png\" alt=\"Transmission Case\"><\/a><div class=\"cdot__body\"><strong>Transmission Case<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--right\" style=\"--x:22%;--y:42%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_34-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_34-AM.png\" alt=\"Bracket Engine Mounting\"><\/a><div class=\"cdot__body\"><strong>Bracket Engine Mounting<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--up\" style=\"--x:18%;--y:40%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_40-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_40-AM.png\" alt=\"Panel Cowl Top Side LH\/RH\"><\/a><div class=\"cdot__body\"><strong>Panel Cowl Top Side LH\/RH<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--right\" style=\"--x:29%;--y:38%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_45-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_30_45-AM.png\" alt=\"Bracket Throttle Body\"><\/a><div class=\"cdot__body\"><strong>Bracket Throttle Body<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--left\" style=\"--x:55%;--y:60%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_31_02-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-10_31_02-AM.png\" alt=\"Jack S\/A Pantograph\"><\/a><div class=\"cdot__body\"><strong>Jack S\/A Pantograph<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--down\" style=\"--x:65%;--y:55%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-9-2026-02_27_59-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-9-2026-02_27_59-PM.png\" alt=\"Fuel Tank\"><\/a><div class=\"cdot__body\"><strong>Fuel Tank<\/strong><\/div><\/div><\/div>\r\n\t\t<div class=\"cdot cdot--up\" style=\"--x:70%;--y:44%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-11_22_33-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-11_22_33-AM.png\" alt=\"Center Member\"><\/a><div class=\"cdot__body\"><strong>Center Member<\/strong><\/div><\/div><\/div>\r\n      <\/div>\r\n      <div class=\"dot-set\" id=\"dotSet2\">\r\n        <div class=\"cdot cdot--top\" style=\"--x:26%;--y:33%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_17_13-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_17_13-PM.png\" alt=\"Brake Tube\"><\/a><div class=\"cdot__body\"><strong>Oil Level Gauge<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--left\" style=\"--x:23%;--y:36%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_17_07-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_17_07-PM.png\" alt=\"Water Cooler Pipe\"><\/a><div class=\"cdot__body\"><strong>Water Cooler Pipe<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--right\" style=\"--x:30%;--y:33%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2024\/08\/Single-Pipe_Tube-Assy.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2024\/08\/Single-Pipe_Tube-Assy.png\" alt=\"Tube Assy Engine Compartment\"><\/a><div class=\"cdot__body\"><strong>Tube Assy Engine Compartment<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--left\" style=\"--x:63%;--y:68%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_54-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_54-PM.png\" alt=\"Brake Tube\"><\/a><div class=\"cdot__body\"><strong>Brake Tube<\/strong><\/div><\/div><\/div>\r\n        \r\n        <div class=\"cdot cdot--top\" style=\"--x:66%;--y:49%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-10-2026-09_18_29-AM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-10-2026-09_18_29-AM.png\" alt=\"Neck Assy Filler\"><\/a><div class=\"cdot__body\"><strong>Neck Assy Filler<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--up\" style=\"--x:69%;--y:44%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_29-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_29-PM.png\" alt=\"Tube S\/A Evaporation\"><\/a><div class=\"cdot__body\"><strong>Tube S\/A Evaporation<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--right\" style=\"--x:70%;--y:50%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_37-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_37-PM.png\" alt=\"Tube Fuel Suction\"><\/a><div class=\"cdot__body\"><strong>Tube Fuel Suction<\/strong><\/div><\/div><\/div>\r\n        <div class=\"cdot cdot--left\" style=\"--x:63%;--y:52%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_40-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_16_40-PM.png\" alt=\"Tube S\/A Fuel\"><\/a><div class=\"cdot__body\"><strong>Tube S\/A Fuel<\/strong><\/div><\/div><\/div>\r\n      \r\n        <div class=\"cdot cdot--bottom\" style=\"--x:32%;--y:57%;\"><div class=\"cdot__ring\"><\/div><div class=\"cdot__tip\"><a class=\"cdot__img-wrap\" onclick=\"return window.uigEnlargePinpoint ? window.uigEnlargePinpoint(this,event) : true\" href=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_17_00-PM.png\" target=\"_blank\" rel=\"noopener\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-23-2026-05_17_00-PM.png\" alt=\"Tube Assy Fuel\"><\/a><div class=\"cdot__body\"><strong>Tube Assy Fuel<\/strong><\/div><\/div><\/div>\r\n\t  <\/div>\r\n    <\/div>\r\n  <\/div>\r\n  <div class=\"scroll-info-area\">\r\n    <div class=\"info-panel\" id=\"panel0\">\r\n      <h3>United Industries Sdn. Bhd.<\/h3>\r\n      <p>United Industries Sdn. Bhd. was founded on 28 February 1973 as UI Group\u2019s first company. \r\n\t    In the mid-1970s, it began supplying exhaust systems to Asia Automobile Industries Sdn. Bhd. and later to other car assemblers.\r\n\t\tThe company expanded into other automotive parts, including beam axles, lateral rods and battery trays. \r\n\t\tToday, it focuses on cross center beams and tubular products for OEMs in Malaysia. \r\n\t\tIt also plans to increase its capacity and capabilities for new projects from Perodua and Honda.\r\n\t  <\/p>\r\n      <!--\r\n\t  <div class=\"product-list\"><span>Fuel Filler Neck<\/span><span>Door Lock Assy<\/span><span>Instrument Panel<\/span><\/div> \r\n\t  -->\r\n    <\/div>\r\n    <div class=\"info-panel\" id=\"panel1\">\r\n      <h3>United Vehicles Industries Sdn. Bhd.<\/h3>\r\n      <p>United Vehicles Industries Sdn. Bhd. was founded on 7 September 1982 and began making fuel tanks in 1984. In 1985, it secured a contract to supply fuel tanks for Malaysia\u2019s first national car, the Proton Saga. It later supplied fuel tanks to most car manufacturers and assemblers in Malaysia.\r\n\t    In 2002, the company worked with Kautex Textron GmbH & Co. of Germany to develop plastic fuel tanks. It then built a blow moulding facility in Malaysia to produce them for the Proton Waja. In 2010, it exported more than 50,000 plastic fuel tanks to General Motors in China.\r\n\t    The company also makes stamped parts, including cross members, floor cross members and radiator supports. Its engineering team uses CNC machines to make tools and dies in house. A recent collaboration with Yachiyo Industry Co., Ltd. of Japan has strengthened its plastic fuel tank capabilities. The company is also investing in a new plant in Pegoh to meet demand.\r\n\t  <\/p>\r\n\t  <!--\r\n      <div class=\"product-list\"><span>Fuel Tank<\/span><span>Screw Jack Assy<\/span><span>Assy Parts<\/span><\/div>\r\n\t  -->\r\n    <\/div>\r\n    <div class=\"info-panel\" id=\"panel2\">\r\n      <h3>United Sanoh Industries Sdn. Bhd.<\/h3>\r\n      <p>United Sanoh Industries Sdn Bhd was established on 26 July 1978 as a joint venture between UI Group, Sanoh Industrial Co Ltd and Shinsho Corporation of Japan.\r\n\t  It began manufacturing automotive tubing and pipes in 1985 with technical support from Sanoh Industrial. The company later planned a new plant in Pegoh with United Vehicles Industries Sdn Bhd, near Honda Malaysia, targeting operations in 2020.<\/p>\r\n      <!--\r\n\t  <div class=\"product-list\"><span>Brake Tube<\/span><span>Oil Level Gauge<\/span><span>Engine Compartment Tubing<\/span><\/div>\r\n\t  -->\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<div class=\"pinpoint-lightbox\" id=\"pinpointLightbox\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Enlarged product image\" aria-hidden=\"true\">\r\n  <div class=\"pinpoint-lightbox__dialog\">\r\n    <img class=\"pinpoint-lightbox__image\" id=\"pinpointLightboxImage\" alt=\"\">\r\n    <button class=\"pinpoint-lightbox__close\" id=\"pinpointLightboxClose\" type=\"button\" aria-label=\"Close enlarged image\">&times;<\/button>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- \u2500\u2500 PRODUCT GRID \u2500\u2500 -->\r\n<section class=\"ov-grid\" id=\"ovGrid\">\r\n\r\n  <!-- \u2500\u2500 ROW 1 \u2500\u2500 -->\r\n  <div class=\"ov-row\" id=\"row1\">\r\n\r\n    <!-- Diagonal SVG for Row 1 -->\r\n    <svg class=\"row-diag\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\" aria-hidden=\"true\">\r\n      <defs>\r\n        <linearGradient id=\"dg1\" x1=\"0%\" y1=\"100%\" x2=\"100%\" y2=\"0%\">\r\n          <stop offset=\"0%\" stop-color=\"#3b82f6\" stop-opacity=\".5\"\/>\r\n          <stop offset=\"100%\" stop-color=\"#06b6d4\" stop-opacity=\".5\"\/>\r\n        <\/linearGradient>\r\n      <\/defs>\r\n      <line class=\"diag-line\" x1=\"37\" y1=\"100\" x2=\"63\" y2=\"0\" stroke=\"url(#dg1)\" stroke-width=\".5\" vector-effect=\"non-scaling-stroke\"\/>\r\n    <\/svg>\r\n\r\n    <!-- Cell 01 \u2014 Standard Series -->\r\n    <a class=\"ov-cell\" href=\"\/uig\/fuel-tank-range\/\">\r\n      <div class=\"ov-cell-bg\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/07\/IMG_20260723_171851_868_edit_307551195367782-scaled.jpg\" alt=\"\" loading=\"lazy\"\/><\/div>\r\n      <div class=\"ov-cell-c\">\r\n        <div class=\"ov-cell-top\">\r\n        <\/div>\r\n        <h2 class=\"ov-cell-name\">Fuel<br>Tank<\/h2>\r\n        <div>\r\n          <div class=\"ov-explore\">\r\n            Explore\r\n            <svg viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12,5 19,12 12,19\"\/><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Cell 02 \u2014 Stainless Pro -->\r\n    <a class=\"ov-cell right\" href=\"\/uig\/tubing\/\">\r\n      <div class=\"ov-cell-bg\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-10-2026-08_18_30-AM.png\" alt=\"\" loading=\"lazy\"\/><\/div>\r\n      <div class=\"ov-cell-c\">\r\n        <div class=\"ov-cell-top\">\r\n        <\/div>\r\n        <h2 class=\"ov-cell-name\">Tube<br>Assy<\/h2>\r\n        <div>\r\n          <div class=\"ov-explore\">\r\n            Explore\r\n            <svg viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12,5 19,12 12,19\"\/><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/a>\r\n\r\n  <\/div><!-- end row 1 -->\r\n\r\n  <!-- \u2500\u2500 ROW 2 \u2500\u2500 -->\r\n  <div class=\"ov-row\" id=\"row2\">\r\n\r\n    <!-- Diagonal SVG for Row 2 -->\r\n    <svg class=\"row-diag\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\" aria-hidden=\"true\">\r\n      <defs>\r\n        <linearGradient id=\"dg2\" x1=\"0%\" y1=\"100%\" x2=\"100%\" y2=\"0%\">\r\n          <stop offset=\"0%\" stop-color=\"#f59e0b\" stop-opacity=\".5\"\/>\r\n          <stop offset=\"100%\" stop-color=\"#10b981\" stop-opacity=\".5\"\/>\r\n        <\/linearGradient>\r\n      <\/defs>\r\n      <line class=\"diag-line\" x1=\"37\" y1=\"100\" x2=\"63\" y2=\"0\" stroke=\"url(#dg2)\" stroke-width=\".5\" vector-effect=\"non-scaling-stroke\"\/>\r\n    <\/svg>\r\n\r\n    <!-- Cell 03 \u2014 Aluminised Heavy -->\r\n    <a class=\"ov-cell\" href=\"\/uig\/instrument-panel-aff\/\">\r\n      <div class=\"ov-cell-bg\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/07\/IMG_20260723_171710_315_edit_307564118181891-scaled.jpg\" alt=\"\" loading=\"lazy\"\/><\/div>\r\n      <div class=\"ov-cell-c\">\r\n        <div class=\"ov-cell-top\">\r\n        <\/div>\r\n        <h2 class=\"ov-cell-name\">Instrument<br>Panel<\/h2>\r\n        <div>\r\n          <div class=\"ov-explore\">\r\n            Explore\r\n            <svg viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12,5 19,12 12,19\"\/><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/a>\r\n\r\n    <!-- Cell 04 \u2014 Bunded Industrial -->\r\n    <a class=\"ov-cell right\" href=\"\/uig\/fuel-filler-pipe\/\">\r\n      <div class=\"ov-cell-bg\"><img decoding=\"async\" src=\"\/uig\/wp-content\/uploads\/2026\/07\/IMG_20260723_171435_761_edit_307587875995528-scaled.jpg\" alt=\"\" loading=\"lazy\" style=\"object-position:center 50%;\"\/><\/div>\r\n      <div class=\"ov-cell-c\">\r\n        <div class=\"ov-cell-top\">\r\n        <\/div>\r\n        <h2 class=\"ov-cell-name\">Fuel Filler<br>Neck<\/h2>\r\n        <div>\r\n          <div class=\"ov-explore\">\r\n            Explore\r\n            <svg viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12,5 19,12 12,19\"\/><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/a>\r\n\r\n  <\/div><!-- end row 2 -->\r\n\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 CTA \u2500\u2500 -->\r\n<section class=\"ov-cta\" id=\"ovCta\">\r\n  <div class=\"ov-cta-eyebrow\">Work With Us<\/div>\r\n  <h2 class=\"ov-cta-title\" id=\"ctaTitle\">\r\n    Let's Build<br><span>Something Precise.<\/span>\r\n  <\/h2>\r\n  <p class=\"ov-cta-sub\" id=\"ctaSub\">\r\n    OEM-grade components engineered to spec. Talk to our team about your requirements, timelines, and custom configurations.\r\n  <\/p>\r\n  <div class=\"ov-cta-actions\" id=\"ctaActions\">\r\n    <a href=\"\/uig\/elementor-page-2971\/\" class=\"ov-cta-btn-primary\">\r\n      Enquire Now\r\n      <svg viewBox=\"0 0 24 24\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12,5 19,12 12,19\"\/><\/svg>\r\n    <\/a>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n\/\/ \u2500\u2500 PARTICLE CANVAS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n(function(){\r\n  var canvas = document.getElementById('ovCanvas');\r\n  if(!canvas) return;\r\n  var ctx = canvas.getContext('2d');\r\n  var W, H, pts = [], mouse = {x:null, y:null}, animId;\r\n\r\n  function resize(){\r\n    W = canvas.width = canvas.offsetWidth;\r\n    H = canvas.height = canvas.offsetHeight;\r\n  }\r\n  function Pt(){ this.reset(); }\r\n  Pt.prototype.reset = function(){\r\n    this.x = Math.random()*W; this.y = Math.random()*H;\r\n    this.vx = (Math.random()-.5)*.25; this.vy = (Math.random()-.5)*.25;\r\n    this.r = Math.random()*1.4+.3;\r\n    this.op = Math.random()*.5+.1;\r\n    this.ph = Math.random()*Math.PI*2;\r\n    this.ps = Math.random()*.012+.005;\r\n  };\r\n\r\n  function init(){ resize(); pts=[]; for(var i=0;i<80;i++) pts.push(new Pt()); }\r\n\r\n  function tick(){\r\n    ctx.clearRect(0,0,W,H);\r\n    for(var i=0;i<pts.length;i++){\r\n      var p=pts[i]; p.ph+=p.ps;\r\n      var op = p.op*(.7+.3*Math.sin(p.ph));\r\n      \/\/ connections\r\n      for(var j=i+1;j<pts.length;j++){\r\n        var q=pts[j], dx=p.x-q.x, dy=p.y-q.y, d=Math.sqrt(dx*dx+dy*dy);\r\n        if(d<120){ ctx.beginPath(); ctx.strokeStyle='rgba(147,197,253,'+((.12)*(1-d\/120))+')'; ctx.lineWidth=.5; ctx.moveTo(p.x,p.y); ctx.lineTo(q.x,q.y); ctx.stroke(); }\r\n      }\r\n      if(mouse.x!==null){ var dx=p.x-mouse.x, dy=p.y-mouse.y, d=Math.sqrt(dx*dx+dy*dy); if(d<150){ ctx.beginPath(); ctx.strokeStyle='rgba(147,197,253,'+((.22)*(1-d\/150))+')'; ctx.lineWidth=.7; ctx.moveTo(p.x,p.y); ctx.lineTo(mouse.x,mouse.y); ctx.stroke(); } }\r\n      \/\/ draw dot\r\n      ctx.beginPath(); ctx.arc(p.x,p.y,p.r,0,Math.PI*2);\r\n      ctx.fillStyle='rgba(147,197,253,'+op+')'; ctx.fill();\r\n      \/\/ move\r\n      p.x+=p.vx; p.y+=p.vy;\r\n      if(p.x<-8) p.x=W+8; if(p.x>W+8) p.x=-8;\r\n      if(p.y<-8) p.y=H+8; if(p.y>H+8) p.y=-8;\r\n      \/\/ mouse repel\r\n      if(mouse.x!==null){ var dx=p.x-mouse.x, dy=p.y-mouse.y, d=Math.sqrt(dx*dx+dy*dy); if(d<90){ var f=(90-d)\/90*.3; p.vx+=(dx\/d)*f; p.vy+=(dy\/d)*f; var spd=Math.sqrt(p.vx*p.vx+p.vy*p.vy); if(spd>.7){p.vx*=.7\/spd; p.vy*=.7\/spd;} } }\r\n    }\r\n    animId = requestAnimationFrame(tick);\r\n  }\r\n\r\n  window.addEventListener('resize', function(){ resize(); });\r\n  document.getElementById('ovHero').addEventListener('mousemove', function(e){ var r=canvas.getBoundingClientRect(); mouse.x=e.clientX-r.left; mouse.y=e.clientY-r.top; });\r\n  document.getElementById('ovHero').addEventListener('mouseleave', function(){ mouse.x=null; mouse.y=null; });\r\n\r\n  init(); tick();\r\n})();\r\n\r\n\/\/ \u2500\u2500 NAV SCROLL \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n(function(){\r\n  var nav = document.getElementById('ovNav');\r\n  window.addEventListener('scroll', function(){ nav.classList.toggle('scrolled', window.scrollY > 50); }, {passive:true});\r\n})();\r\n\r\n\/\/ \u2500\u2500 SCROLL HINT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\ndocument.getElementById('ovScroll').addEventListener('click', function(){\r\n  document.getElementById('ovGrid').scrollIntoView({behavior:'smooth'});\r\n});\r\n\r\n\/\/ \u2500\u2500 HERO REVEAL + GSAP \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\nwindow.addEventListener('load', function(){\r\n  var hasGsap = typeof gsap !== 'undefined';\r\n\r\n  \/\/ Hero text stagger\r\n  if(hasGsap){\r\n    gsap.to('.ov-hero-title .t-inner', {\r\n      y: 0, opacity: 1, duration: 1.1,\r\n      ease: 'power4.out', stagger: .14, delay: .2\r\n    });\r\n    gsap.to('.ov-hero-sub', { y: 0, opacity: 1, duration: .9, ease: 'power3.out', delay: .65 });\r\n    gsap.to('.ov-hero-stats', { y: 0, opacity: 1, duration: .8, ease: 'power3.out', delay: .82 });\r\n\r\n    \/\/ Cell name reveal on scroll\r\n    gsap.registerPlugin(ScrollTrigger);\r\n    document.querySelectorAll('.ov-cell-name').forEach(function(el, i){\r\n      gsap.to(el, {\r\n        y: 0, opacity: 1, duration: .9, ease: 'power4.out',\r\n        delay: (i % 2) * .15,\r\n        scrollTrigger: { trigger: el, start: 'top 85%', once: true }\r\n      });\r\n    });\r\n\r\n\r\n  } else {\r\n    \/\/ Fallback \u2014 just show the text\r\n    document.querySelectorAll('.ov-hero-title .t-inner').forEach(function(el){ el.style.transform='none'; el.style.opacity='1'; });\r\n    document.querySelector('.ov-hero-sub').style.opacity='1';\r\n    document.querySelector('.ov-hero-stats').style.opacity='1';\r\n    document.querySelectorAll('.ov-cell-name').forEach(function(el){ el.style.transform='none'; el.style.opacity='1'; });\r\n  }\r\n\r\n  \/\/ \u2500\u2500 DIAGONAL LINE DRAW IN \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n  var diagObs = new IntersectionObserver(function(entries){\r\n    entries.forEach(function(e){\r\n      if(e.isIntersecting){\r\n        e.target.querySelectorAll('.diag-line').forEach(function(l){ l.classList.add('drawn'); });\r\n        diagObs.unobserve(e.target);\r\n      }\r\n    });\r\n  }, {threshold: .25});\r\n  document.querySelectorAll('.ov-row').forEach(function(row){ diagObs.observe(row); });\r\n\r\n  \/\/ CTA reveal\r\n  var ctaObs = new IntersectionObserver(function(entries){\r\n    entries.forEach(function(e){\r\n      if(e.isIntersecting){\r\n        ['ctaTitle','ctaSub','ctaActions'].forEach(function(id){ var el=document.getElementById(id); if(el) el.classList.add('visible'); });\r\n        ctaObs.disconnect();\r\n      }\r\n    });\r\n  },{threshold:.25});\r\n  var ctaEl = document.getElementById('ovCta');\r\n  if(ctaEl) ctaObs.observe(ctaEl);\r\n});\r\n\r\n\/* Independent pinpoint lightbox \u2014 runs even if another page animation fails. *\/\r\n(function(){\r\n  var lightbox=document.getElementById('pinpointLightbox');\r\n  var preview=document.getElementById('pinpointLightboxImage');\r\n  var closeBtn=document.getElementById('pinpointLightboxClose');\r\n  if(!lightbox||!preview||!closeBtn)return;\r\n  document.body.appendChild(lightbox);\r\n  var lastTrigger=null;\r\n  function openLightbox(img){\r\n    lastTrigger=img;\r\n    preview.src=img.currentSrc||img.src;\r\n    preview.alt=img.alt||'Product image';\r\n    lightbox.style.setProperty('display','flex','important');\r\n    lightbox.style.setProperty('visibility','visible','important');\r\n    lightbox.style.setProperty('opacity','1','important');\r\n    lightbox.style.setProperty('pointer-events','auto','important');\r\n    lightbox.style.setProperty('position','fixed','important');\r\n    lightbox.style.setProperty('inset','0','important');\r\n    lightbox.style.setProperty('z-index','2147483647','important');\r\n    lightbox.classList.add('is-open');\r\n    lightbox.setAttribute('aria-hidden','false');\r\n    document.body.classList.add('pinpoint-lightbox-open');\r\n    closeBtn.focus({preventScroll:true});\r\n  }\r\n  window.uigEnlargePinpoint=function(link,e){\r\n    var img=link&&link.querySelector?link.querySelector('img'):null;\r\n    if(!img)return true;\r\n    if(e){e.preventDefault();e.stopPropagation();}\r\n    openLightbox(img);\r\n    return false;\r\n  };\r\n  function closeLightbox(){\r\n    var scrollX=window.scrollX,scrollY=window.scrollY;\r\n    lightbox.classList.remove('is-open');\r\n    lightbox.style.setProperty('visibility','hidden','important');\r\n    lightbox.style.setProperty('opacity','0','important');\r\n    lightbox.style.setProperty('pointer-events','none','important');\r\n    lightbox.setAttribute('aria-hidden','true');\r\n    document.body.classList.remove('pinpoint-lightbox-open');\r\n    if(lastTrigger&&lastTrigger.focus)lastTrigger.focus({preventScroll:true});\r\n    window.scrollTo(scrollX,scrollY);\r\n  }\r\n  document.querySelectorAll('.cdot__img-wrap').forEach(function(wrap){\r\n    var img=wrap.querySelector('img');\r\n    if(!img)return;\r\n    wrap.setAttribute('aria-label','Enlarge '+(img.alt||'product image'));\r\n    wrap.addEventListener('keydown',function(e){if(e.key==='Enter'||e.key===' '){e.preventDefault();openLightbox(img);}});\r\n  });\r\n  document.addEventListener('click',function(e){\r\n    var wrap=e.target.closest&&e.target.closest('.cdot__img-wrap');\r\n    if(!wrap)return;\r\n    var img=wrap.querySelector('img');\r\n    if(!img)return;\r\n    e.preventDefault();e.stopPropagation();openLightbox(img);\r\n  },true);\r\n  document.querySelectorAll('.cdot').forEach(function(dot){\r\n    var hideTimer=0,tip=dot.querySelector('.cdot__tip');\r\n    function show(){clearTimeout(hideTimer);dot.classList.add('is-active');}\r\n    function hide(){clearTimeout(hideTimer);hideTimer=setTimeout(function(){if(!dot.matches(':hover')&&!(tip&&tip.matches(':hover')))dot.classList.remove('is-active');},220);}\r\n    dot.addEventListener('pointerenter',show);\r\n    dot.addEventListener('pointerleave',hide);\r\n    if(tip){tip.addEventListener('pointerenter',show);tip.addEventListener('pointerleave',hide);}\r\n  });\r\n  closeBtn.addEventListener('click',closeLightbox);\r\n  lightbox.addEventListener('click',function(e){if(e.target===lightbox)closeLightbox();});\r\n  document.addEventListener('keydown',function(e){if(e.key==='Escape'&&lightbox.classList.contains('is-open'))closeLightbox();});\r\n})();\r\n\r\n\/\/ \u2500\u2500 CAR SCRUB (Product Overview) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n(function(){\r\n  var SITE_URL='https:\/\/uisb.com';\r\n  var FRAMES_JS_URL=SITE_URL+'\/wp-content\/themes\/astra\/js\/frames_data.js';\r\n  var TOTAL_FRAMES=96;\r\n  var SECTION_FRAMES=[0,47,95];\r\n  var LABELS=['OEM TURNTABLE \u00b7 SECTION 01','OEM TURNTABLE \u00b7 SECTION 02','OEM TURNTABLE \u00b7 SECTION 03'];\r\n  function getDotOpacity(s,f){if(s===0){if(f<=10)return 1;if(f<=37)return 1-(f-10)\/27;return 0;}if(s===1){if(f<37)return 0;if(f<=47)return(f-37)\/10;if(f<=57)return 1;if(f<=84)return 1-(f-57)\/27;return 0;}if(s===2){if(f<84)return 0;if(f<=95)return(f-84)\/11;return 1;}return 0;}\r\n  function initCarScrub(){\r\n    var canvas=document.getElementById('carCanvas');\r\n    var ctx=canvas?canvas.getContext('2d'):null;\r\n    var panels=['panel0','panel1','panel2'].map(function(id){return document.getElementById(id);});\r\n    var dotSets=['dotSet0','dotSet1','dotSet2'].map(function(id){return document.getElementById(id);});\r\n    var pips=['pip0','pip1','pip2'].map(function(id){return document.getElementById(id);});\r\n    var hudLabel=document.getElementById('hudLabel');\r\n    if(!canvas||!ctx)return;\r\n    canvas.width=1280;canvas.height=720;\r\n    var images=new Array(TOTAL_FRAMES);\r\n    var currentFrame=0,targetFrame=0,rafId=null,scrollRaf=0,sectionVisible=false;\r\n    function drawFrame(idx){var i=Math.max(0,Math.min(TOTAL_FRAMES-1,Math.round(idx))),img=images[i];if(!img||!img.complete||!img.naturalWidth)return;ctx.clearRect(0,0,canvas.width,canvas.height);ctx.drawImage(img,0,0,canvas.width,canvas.height);}\r\n    function updateDots(frame){dotSets.forEach(function(d,i){if(!d)return;var op=getDotOpacity(i,frame);d.style.opacity=op;d.style.pointerEvents=op>0.05?'auto':'none';});}\r\n    function animLoop(){var diff=targetFrame-currentFrame;if(Math.abs(diff)<0.25){currentFrame=targetFrame;drawFrame(currentFrame);updateDots(currentFrame);rafId=null;return;}currentFrame+=diff*0.18;drawFrame(currentFrame);updateDots(currentFrame);rafId=requestAnimationFrame(animLoop);}\r\n    function goToFrame(f){targetFrame=Math.max(0,Math.min(TOTAL_FRAMES-1,f));if(!rafId)rafId=requestAnimationFrame(animLoop);}\r\n    function loadFrames(){\r\n      var order=[0,47,95],i;for(i=1;i<TOTAL_FRAMES;i++)if(order.indexOf(i)===-1)order.push(i);\r\n      var cursor=0,active=0,limit=window.innerWidth<768?3:6;\r\n      function next(){while(active<limit&&cursor<order.length){(function(idx){var img=new Image();active++;img.onload=function(){active--;if(idx===0){drawFrame(0);updateDots(0);}next();};img.onerror=function(){active--;next();};img.decoding='async';img.src=CAR_FRAMES[idx];images[idx]=img;})(order[cursor++]);}}\r\n      next();\r\n    }\r\n    loadFrames();\r\n    var currentSection=-1;\r\n    function setSection(idx){if(idx===currentSection)return;currentSection=idx;pips.forEach(function(p,i){if(p)p.classList.toggle('active',i===idx);});if(hudLabel)hudLabel.textContent=LABELS[idx];}\r\n    function onScroll(){if(!sectionVisible)return;var vh=window.innerHeight,rects=panels.map(function(p){return p?p.getBoundingClientRect():null;}),targetSectionFrame=SECTION_FRAMES[0],newSection=0;for(var i=0;i<panels.length-1;i++){var nr=rects[i+1];if(!nr)continue;var tStart=vh,tEnd=vh*.35;if(nr.top<=tStart){if(nr.top<=tEnd){newSection=i+1;targetSectionFrame=SECTION_FRAMES[i+1];}else{var p=1-(nr.top-tEnd)\/(tStart-tEnd);p=Math.max(0,Math.min(1,p));p=p<.5?2*p*p:1-Math.pow(-2*p+2,2)\/2;targetSectionFrame=SECTION_FRAMES[i]+(SECTION_FRAMES[i+1]-SECTION_FRAMES[i])*p;newSection=i;}}}var lr=rects[rects.length-1];if(lr&&lr.bottom<vh*.35){newSection=panels.length-1;targetSectionFrame=SECTION_FRAMES[panels.length-1];}setSection(newSection);goToFrame(targetSectionFrame);}\r\n    function requestScroll(){if(!scrollRaf){scrollRaf=requestAnimationFrame(function(){scrollRaf=0;onScroll();});}}\r\n    var productSection=document.getElementById('productOverview');\r\n    if(productSection)new IntersectionObserver(function(entries){sectionVisible=entries[0].isIntersecting;if(sectionVisible)requestScroll();},{rootMargin:'100% 0px'}).observe(productSection);\r\n    window.addEventListener('scroll',requestScroll,{passive:true});\r\n    window.addEventListener('load',onScroll);\r\n    onScroll();\r\n  }\r\n  function bootstrap(){var script=document.createElement('script');script.src=FRAMES_JS_URL;script.async=true;script.onload=function(){if(typeof CAR_FRAMES!=='undefined'){initCarScrub();}};script.onerror=function(){console.error('[CarScrub] 404: '+FRAMES_JS_URL);};document.head.appendChild(script);}\r\n  function lazyBootstrap(){var target=document.getElementById('productOverview');if(!target){bootstrap();return;}var io=new IntersectionObserver(function(entries){if(entries[0].isIntersecting){io.disconnect();bootstrap();}},{rootMargin:'700px 0px'});io.observe(target);}\r\n  if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',lazyBootstrap,{once:true});}else{lazyBootstrap();}\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>OUR SPECIALIZED PRODUCTS Four material grades \u2014 from standard automotive to industrial-grade double-wall containment. One manufacturing standard. Precision-formed for every [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-3498","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/pages\/3498","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/comments?post=3498"}],"version-history":[{"count":83,"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/pages\/3498\/revisions"}],"predecessor-version":[{"id":4405,"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/pages\/3498\/revisions\/4405"}],"wp:attachment":[{"href":"https:\/\/uisb.com\/zh\/wp-json\/wp\/v2\/media?parent=3498"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}