{"id":363880,"date":"2025-09-03T11:42:29","date_gmt":"2025-09-03T15:42:29","guid":{"rendered":"https:\/\/exmweb.com\/?page_id=363880"},"modified":"2026-01-28T08:49:24","modified_gmt":"2026-01-28T13:49:24","slug":"custom-solutions","status":"publish","type":"page","link":"https:\/\/exmweb.com\/fr-ca\/custom-solutions\/","title":{"rendered":"Custom Solutions"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"363880\" class=\"elementor elementor-363880\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-54564fe e-con-full e-flex e-con e-parent\" data-id=\"54564fe\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ab13031 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"ab13031\" 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<style>\n  :root {\n    --bg-dark: #000;\n    --text-light: #fff;\n    --accent: #4db2ff;\n    --font-main: \"Albert Sans\", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;\n  }\n\n  \/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 HERO Section \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  .custom-hero {\n    background: var(--bg-dark);\n    color: var(--text-light);\n    min-height: 80vh;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    padding: 0 15px;\n    font-family: var(--font-main);\n    position: relative;\n    overflow: hidden;\n  }\n\n  .hero-content {\n    max-width: 1600px;\n    margin: 0 auto;\n  }\n\n  .hero-title {\n    font-size: 210px;\n    font-weight: 400;\n    margin: 0;\n    line-height: 1;\n    color: #fff !important;\n  }\n\n  .hero-subtitle {\n    margin: 32px 0 0;\n    font-size: 26px;\n    color: var(--accent);\n    line-height: 1.6;\n    font-weight: 300;\n  }\n\n  .hero-scroll {\n    display: inline-block;\n    margin-top: 40px;\n    font-size: 15px;\n    color: #aaa;\n    letter-spacing: 0.08em;\n    text-decoration: none;\n    transition: color 0.3s ease;\n    position: relative;\n  }\n\n  .hero-scroll::after {\n    content: \"\";\n    display: block;\n    width: 22px;\n    height: 22px;\n    border: 1.5px solid #aaa;\n    border-radius: 50%;\n    margin: 8px auto 0;\n    transition: border-color 0.3s ease, transform 0.3s ease;\n  }\n\n  .hero-scroll:hover {\n    color: var(--accent);\n  }\n\n  .hero-scroll:hover::after {\n    border-color: var(--accent);\n    transform: translateY(3px);\n  }\n\n  @media (max-width: 768px) {\n    .hero-title {\n      font-size: clamp(60px, 18vw, 130px);\n    }\n    .hero-subtitle {\n      font-size: 18px;\n    }\n  }\n  \n  .hero-icon {\n  display: block;\n  margin: 30px auto 8px;\n  max-width: 100px !important;\n  height: 100px !important;\n  filter: drop-shadow(0 10px 30px rgba(0,0,0,0.45));\n}\n\n\/* Optional: slightly smaller on mobile *\/\n@media (max-width: 768px) {\n  .hero-icon {\n    max-width: 110px;\n    margin: 24px auto 10px;\n  }\n}\n\n\n  \/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 SECTION 2: Custom Dimension \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  .custom-dimension-section {\n    background: var(--bg-dark);\n    color: var(--text-light);\n    font-family: var(--font-main);\n    padding: 120px 15px 140px;\n  }\n\n  .dimension-inner {\n    max-width: 1600px;\n    margin: 0 auto;\n  }\n\n  .dimension-title {\n    font-size: 70px;\n    font-weight: 400;\n    margin: 0 0 60px;\n    text-align: left;\n    padding-left: calc((100% - 1200px) \/ 2);\n    background: linear-gradient(90deg, #ffffff, #4db2ff, #ffffff, #4db2ff);\n    background-size: 300% 300%;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n    animation: gradient-wave 6s ease-in-out infinite;\n  }\n\n  @keyframes gradient-wave {\n    0% {\n      background-position: 0% 50%;\n    }\n    50% {\n      background-position: 100% 50%;\n    }\n    100% {\n      background-position: 0% 50%;\n    }\n  }\n\n  .dimension-video-wrap {\n    max-width: 1200px;\n    margin: 0 auto 80px;\n    border-radius: 0px;\n    overflow: hidden;\n    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);\n  }\n\n  .dimension-video {\n    display: block;\n    width: 100%;\n    height: auto;\n    object-fit: contain;\n  }\n\n  .dimension-grid {\n    max-width: 1200px;\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 48px;\n    text-align: center;\n  }\n\n  .dimension-card {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n  }\n\n  .dimension-card-top {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: flex-start;\n    flex-grow: 1;\n  }\n\n  .dimension-card p {\n    font-size: 17px;\n    line-height: 1.6;\n    margin: 0;\n    align-self: stretch;\n    margin-top: auto;\n  }\n\n  .dimension-icon {\n    width: 120px;\n    height: auto;\n    margin-bottom: 24px;\n    filter: brightness(1.2);\n  }\n\n  .dimension-card-title {\n    color: #fff !important;\n    font-size: 40px;\n    font-weight: 600;\n    margin-bottom: 10px;\n  }\n\n  @media (max-width: 1200px) {\n    .dimension-title {\n      padding-left: 0;\n      text-align: center;\n    }\n  }\n\n  @media (max-width: 992px) {\n    .dimension-grid {\n      grid-template-columns: 1fr;\n      gap: 36px;\n    }\n    .dimension-video-wrap {\n      margin-bottom: 60px;\n    }\n  }\n\n  html {\n    scroll-behavior: smooth;\n  }\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 SECTION 3: Custom Colour & Textures \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.custom-color-section {\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n\n.color-inner {\n  max-width: 1600px;\n  margin: 0 auto;\n}\n\n.color-title {\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 60px;\n  text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg, #ffffff, #4db2ff, #ffffff, #4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n\n.color-flex {\n  max-width: 1200px;\n  margin: 0 auto 80px;\n  display: flex;\n  gap: 80px;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.color-options {\n  flex: 1 1 400px;\n  display: flex;\n  flex-direction: column;\n  gap: 40px;\n}\n\n.color-option-group {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.color-option-group h4 {\n  font-size: 20px;\n  font-weight: 500;\n  color: #fff;\n  margin: 15px 0;\n}\n\n\/* ===== MATERIAL HORIZONTAL STACK (FULL-WIDTH, ONE-BAR LOOK, UPWARD EXPAND) ===== *\/\n.material-stack {\n  position: relative;\n  width: 100%;\n  height: 60px;\n  overflow: visible;\n}\n\n\/* All layers share the same baseline and stretch to the right edge *\/\n.material-layer {\n  position: absolute;\n  bottom: 0;\n  right: 0;\n  height: 60px;\n  border-radius: 10px 10px 0 0;\n  overflow: hidden;\n  cursor: pointer;\n  transition: height 0.35s ease, box-shadow 0.35s ease;\n  will-change: height;\n}\n\n\/* Left offsets (0% \/ 15% \/ 30%) while still touching the right edge *\/\n.material-layer:nth-child(1) { left: 0%;   z-index: 1; }\n.material-layer:nth-child(2) { left: 15%;  z-index: 2; }\n.material-layer:nth-child(3) { left: 30%;  z-index: 3; }\n.material-layer:nth-child(4){ left: 45%; z-index: 4; }\n\n\/* Mild steel solid color *\/\n.material-layer.mild { background-color: #7A8278; }\n\n\/* Media fills the layer *\/\n.material-layer img {\n  width: 100%;\n  height: 100%;\n  object-fit: fill;\n  display: block;\n}\n\n\/* Hover expands upward only (bottom fixed) *\/\n.material-layer:hover {\n  height: 90px;\n}\n\n\/* Labels sit inside the bar, near the bottom-left *\/\n.material-layer .label {\n  position: absolute;\n  top: 2px;\n  left: 10px;\n  bottom: auto;\n  font-size: 16px;\n  font-weight: 400;\n  color: #fff;\n  text-shadow: 0 1px 3px rgba(0,0,0,.7);\n  opacity: 0;\n  transform: translateY(-6px);\n  transition: opacity .25s ease, transform .25s ease;\n  pointer-events: none;\n}\n\n.material-layer:hover .label {\n  opacity: 1;\n  transform: translateY(0);\n}\n\n\/* (Optional) keep corners behavior consistent *\/\n.material-layer { border-radius: 10px 10px 0 0; }\n.material-layer img { border-radius: inherit; }\n\n\n.material-layer.is-active{\n  height: 90px;\n}\n.material-layer.is-active .label{ opacity: 1; transform: translateY(0); }\n\n\/* === OVERRIDE: Paint Textures as layered bars (4 items) === *\/\n.texture-row{\n  position: relative !important;\n  height: 60px !important;\n  display: block !important;\n  overflow: visible !important;\n}\n\n.texture-row .texture-item{\n  position: absolute !important;\n  bottom: 0 !important;\n  right: 0 !important;\n  height: 60px !important;\n  border-radius: 10px 10px 0 0 !important;\n  width: auto !important;\n  overflow: hidden !important;\n  cursor: pointer;\n  transition: height .35s ease, box-shadow .35s ease;\n  will-change: height;\n}\n\n\/* Left offsets so all bars reach the right edge but start later on the left *\/\n.texture-row .texture-item:nth-child(1){ left: 0%  !important; z-index: 1; }\n.texture-row .texture-item:nth-child(2){ left: 10% !important; z-index: 2; }\n.texture-row .texture-item:nth-child(3){ left: 20% !important; z-index: 3; }\n\n\/* Fill each bar with its image *\/\n.texture-row .texture-item img{\n  position: absolute !important;\n  inset: 0 !important;\n  width: 100% !important;\n  height: 100% !important;\n  object-fit: cover !important;\n  border-radius: inherit !important;\n}\n\n\/* Upward-only expand on hover (baseline stays fixed) *\/\n.texture-row .texture-item:hover{\n  height: 90px !important;\n}\n\n.texture-row .texture-item::after{\n  position: absolute;\n  top: 2px;\n  left: 10px;\n  font-size: 14px;\n  font-weight: 500;\n  color: #fff;\n  text-shadow: 0 1px 3px rgba(0,0,0,.7);\n  opacity: 0;\n  transform: translateY(-6px);\n  transition: opacity .25s ease, transform .25s ease;\n  pointer-events: none;\n  content: \"\";\n}\n\n\/* Map names per bar (1..4) *\/\n.texture-row .texture-item:nth-child(1)::after { content: \"Smooth Texture\"; }\n.texture-row .texture-item:nth-child(2)::after { content: \"Rough Texture\"; }\n.texture-row .texture-item:nth-child(3)::after { content: \"SandTex\"; }\n\n\/* Show on hover *\/\n.texture-row .texture-item:hover::after{\n  opacity: 1;\n  transform: translateY(0);\n}\n\n\n.texture-row .texture-item.is-active{\n  height: 90px !important;\n}\n.texture-row .texture-item.is-active::after{\n  opacity: 1; transform: translateY(0);\n}\n\n\/* ============ LAYERED PAINT COLORS (match Materials\/Textures hover) ============ *\/\n.color-swatches-row{\n  position: relative !important;\n  height: 60px !important;\n  display: block !important;\n  overflow: visible !important;\n  isolation: isolate;\n}\n\n\/* Base bar *\/\n.color-swatches-row .paint-color-block{\n  position: absolute !important;\n  bottom: 0 !important;\n  right: 0 !important;\n  height: 60px !important;\n  border-radius: 10px 10px 0 0 !important;\n  overflow: hidden !important;\n  cursor: pointer;\n  transition: height .35s ease, box-shadow .35s ease;\n  will-change: height;\n  transform-origin: bottom center;\n  z-index: 1;\n}\n\n\/* Upward-only expand on hover\/focus \u2014 same lift + shadow as Materials *\/\n.color-swatches-row .paint-color-block:is(:hover, :focus-visible){\n  height: 90px !important;\n  z-index: 999;\n}\n\n\/* Staggered left insets so all bars share right edge but different widths *\/\n.color-swatches-row .paint-color-block:nth-child(1)  { left: 0%;  z-index: 1;  }\n.color-swatches-row .paint-color-block:nth-child(2)  { left: 5%;  z-index: 2;  }\n.color-swatches-row .paint-color-block:nth-child(3)  { left: 10%; z-index: 3;  }\n.color-swatches-row .paint-color-block:nth-child(4)  { left: 15%; z-index: 4;  }\n.color-swatches-row .paint-color-block:nth-child(5)  { left: 20%; z-index: 5;  }\n.color-swatches-row .paint-color-block:nth-child(6)  { left: 25%; z-index: 6;  }\n.color-swatches-row .paint-color-block:nth-child(7)  { left: 30%; z-index: 7;  }\n.color-swatches-row .paint-color-block:nth-child(8)  { left: 35%; z-index: 8;  }\n.color-swatches-row .paint-color-block:nth-child(9)  { left: 40%; z-index: 9;  }\n.color-swatches-row .paint-color-block:nth-child(10) { left: 45%; z-index: 10; }\n.color-swatches-row .paint-color-block:nth-child(11) { left: 50%; z-index: 11; }\n.color-swatches-row .paint-color-block:nth-child(12) { left: 55%; z-index: 12; }\n.color-swatches-row .paint-color-block:nth-child(13) { left: 60%; z-index: 13; }\n.color-swatches-row .paint-color-block:nth-child(14) { left: 65%; z-index: 14; }\n.color-swatches-row .paint-color-block:nth-child(15) { left: 70%; z-index: 15; }\n.color-swatches-row .paint-color-block:nth-child(16) { left: 75%; z-index: 16; }\n.color-swatches-row .paint-color-block:nth-child(17) { left: 80%; z-index: 17; }\n.color-swatches-row .paint-color-block:nth-child(18) { left: 85%; z-index: 18; }\n.color-swatches-row .paint-color-block:nth-child(19) { left: 90%; z-index: 19; }\n\n    \/* Optional: keep labels behavior you already have *\/\n    .color-swatches-row .paint-color-block::after{\n      position: absolute;\n      top: 2px; left: 10px; right: 10px;\n      font-size: 12.5px; line-height: 1.2; font-weight: 500;\n      color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.7);\n      opacity: 0; transform: translateY(-6px);\n      transition: opacity .25s ease, transform .25s ease;\n      pointer-events: none;\n      content: \"\";\n      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;\n    }\n    .color-swatches-row .paint-color-block:is(:hover, :focus-visible)::after{\n      opacity: 1; transform: translateY(0);\n    }\n\n\n    \/* Map names by order (1..19) \u2014 keep in this exact sequence *\/\n    .color-swatches-row .paint-color-block:nth-child(1)::after  { content: \"White (RAL 9003)\"; }\n    .color-swatches-row .paint-color-block:nth-child(2)::after  { content: \"Grey White (RAL 9002)\"; }\n    .color-swatches-row .paint-color-block:nth-child(3)::after  { content: \"Light Grey (RAL 7035)\"; }\n    .color-swatches-row .paint-color-block:nth-child(4)::after  { content: \"Stone Grey (RAL 7030)\"; }\n    .color-swatches-row .paint-color-block:nth-child(5)::after  { content: \"ANSI-ASA 70 Light Grey (RAL 7038)\"; }\n    .color-swatches-row .paint-color-block:nth-child(6)::after  { content: \"ANSI-ASA 61 Standard Grey (RAL 7042)\"; }\n    .color-swatches-row .paint-color-block:nth-child(7)::after  { content: \"Graphite Grey (RAL 7024)\"; }\n    .color-swatches-row .paint-color-block:nth-child(8)::after  { content: \"Vista Green (RAL 6011)\"; }\n    .color-swatches-row .paint-color-block:nth-child(9)::after  { content: \"Hydro Green #14241\"; }\n    .color-swatches-row .paint-color-block:nth-child(10)::after { content: \"Hydro Green #503-114\"; }\n    .color-swatches-row .paint-color-block:nth-child(11)::after { content: \"Signal Blue (RAL 5005)\"; }\n    .color-swatches-row .paint-color-block:nth-child(12)::after { content: \"Light Blue (RAL 5012)\"; }\n    .color-swatches-row .paint-color-block:nth-child(13)::after { content: \"Carmine Red (RAL 3002)\"; }\n    .color-swatches-row .paint-color-block:nth-child(14)::after { content: \"Traffic Yellow (RAL 1023)\"; }\n    .color-swatches-row .paint-color-block:nth-child(15)::after { content: \"Sierra Tan Sand (RAL Sierra Tan)\"; }\n    .color-swatches-row .paint-color-block:nth-child(16)::after { content: \"Light Ivory (RAL 1015)\"; }\n    .color-swatches-row .paint-color-block:nth-child(17)::after { content: \"Cream (RAL 9001)\"; }\n    .color-swatches-row .paint-color-block:nth-child(18)::after { content: \"Off White\"; }\n    .color-swatches-row .paint-color-block:nth-child(19)::after { content: \"Black (RAL 9005)\"; }\n\n\/* Colors: active mirrors hover *\/\n.color-swatches-row .paint-color-block.is-active{\n  height: 80px !important;\n  box-shadow: 0 10px 25px rgba(77,178,255,.35);\n  z-index: 999;\n}\n\n    \/* --- Video Preview --- *\/\n    .color-preview{\n      position: relative;\n      flex: 1 1 500px;\n      display: block;\n      width: 100%;\n      aspect-ratio: 16 \/ 9;\n      max-width: 100%;\n      overflow: hidden;\n      border-radius: 10px;\n      box-shadow: 0 20px 60px rgba(0,0,0,.4);\n      min-height: 640px;\n    }\n    \n    .color-preview video {\n      width: 100%;\n      height: auto;\n      border-radius: 10px;\n      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);\n    }\n\n  \/* Final frame image sits on top but stays hidden until the video ends *\/\n.color-preview video,\n.color-preview .final-frame{\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: inherit;\n  transition: opacity 5s ease;\n}\n\n\/* Start: video visible, image hidden *\/\n.color-preview video{ opacity: 1; z-index: 1; }\n.color-preview .final-frame{ opacity: 0; z-index: 2;}\n\n\/* Finished: fade video out, image in (no layout collapse) *\/\n.color-preview.finished video{ opacity: 0; pointer-events: none; }\n.color-preview.finished .final-frame{ opacity: 1; }\n\n\n    \/* Circular magnifying lens inside Custom Colour & Textures *\/\n.color-preview-lens {\n  position: absolute;\n  width: 180px;\n  height: 180px;\n  border-radius: 50%;\n  border: 2px solid #4db2ff;\n  box-shadow: 0 10px 25px rgba(0,0,0,0.6);\n  overflow: hidden;\n  pointer-events: none;\n  background-repeat: no-repeat;\n  background-position: 0 0;\n  background-size: cover;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: opacity 0.15s ease;\n  z-index: 5; \/* above final-frame *\/\n}\n\n\n\n\n    \n\/* ========== SECTION 4: Custom Cutouts (Tabbed) ========== *\/\n.cutouts-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 100px 15px 140px;\n}\n.cutouts-inner{ max-width: 1200px; margin: 0 auto; }\n\n.cutouts-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 28px;\n  background: linear-gradient(90deg,#fff,#4db2ff,#fff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n\n\/* preview (no radius) *\/\n.cutouts-preview{\n  position: relative;\n  border-radius: 0;\n  overflow: hidden;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  background: #0b0b0b;\n}\n.cutouts-preview img{\n  display:block;\n  width:100%;\n  height:auto;\n  object-fit: cover;\n  border-radius: 0;\n}\n\n\/* Tabs container (unchanged) *\/\n.cutouts-tabs{\n  display:flex;\n  gap: 150px;\n  justify-content:center;\n  align-items:center;\n  margin:18px auto 22px;\n  padding: 10px 20px;\n  max-width:700px;\n}\n\n\/* Base pill (inactive style) *\/\n.cutout-tab{\n  appearance:none;\n  border:0;\n  background:#313131;\n  color:#9aa0a6;\n  font-size: 22px;\n  padding: 10px 30px;\n  border-radius:999px;\n  line-height: 1.1; \n  cursor:pointer;\n  transition: background .25s ease, color .25s ease, box-shadow .25s ease;\n  position: relative;\n  z-index: 0;\n}\n\n\/* No hover effects *\/\n.cutout-tab:hover{\n  color: inherit;\n  background: inherit;\n  box-shadow: none;\n}\n\n\/* \ud83d\udd35 Active pill: transparent bg + blue text *\/\n.cutout-tab[aria-selected=\"true\"]{\n  background: transparent;\n  color:#4db2ff;\n  box-shadow:none;\n}\n\n\/* Outer animated blue ring *\/\n.cutout-tab[aria-selected=\"true\"]::before{\n  content:\"\";\n  position:absolute;\n  inset:-1px;\n  border-radius:999px;\n  background:linear-gradient(90deg,#1a6fbf,#4db2ff,#1a6fbf);\n  background-size:300% 300%;\n  animation:gradient-wave 6s ease-in-out infinite;\n  z-index:-2;\n}\n\n\/* Inner mask: matches section background so only the ring is visible *\/\n.cutout-tab[aria-selected=\"true\"]::after{\n  content:\"\";\n  position:absolute;\n  inset:1px;\n  border-radius:999px;\n  background: var(--bg-dark, #000); \/* section background *\/\n  z-index:-1;\n}\n\n\/* Keyboard focus *\/\n.cutout-tab:focus-visible{\n  outline:none;\n  box-shadow:0 0 0 2px rgba(77,178,255,.6);\n}\n\n\n\/* Keyboard focus *\/\n.cutout-tab:focus-visible{\n  outline: none;\n  box-shadow: 0 0 0 2px rgba(77,178,255,.45);\n  color:#fff;\n}\n\n\/* description *\/\n.cutouts-desc{\n  max-width: 980px;\n  margin: 10px auto 0;\n  color:#c9d2dc;\n  font-size:17px;\n  line-height:1.7;\n  text-align: center;\n}\n.cutouts-desc b{ color:#fff; }\n\n\n\/* ========== SECTION 5: Certified Custom Windows ========== *\/\n.windows-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.windows-inner{ max-width: 1600px; margin: 0 auto; }\n\n\/* Title \u2014 same look as other H2s *\/\n.windows-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 36px;\n  text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg, #ffffff, #4db2ff, #ffffff, #4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n  white-space: nowrap;\n}\n@media (max-width: 1200px){ .windows-title{ padding-left: 0; } }\n@media (max-width: 992px){ .windows-title{ font-size: 46px; white-space: normal; } }\n\n\/* Layout *\/\n.windows-flex{\n  max-width: 1200px;\n  margin: 0 auto;\n  display: flex;\n  gap: 72px;\n  align-items: stretch;  \n  flex-wrap: nowrap;\n}\n.windows-copy{\n  flex: 1 1 520px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.windows-media{ flex: 1 1 720px; }\n\n\/* Copy *\/\n.windows-intro{\n  color:#c9d2dc;\n  font-size: 16px;\n  margin: 0 0 18px;\n}\n.windows-body{\n  color:#c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n  margin: 18px 0 0;\n}\n.windows-body strong{ color:#fff; }\n\n\/* Certifications *\/\n.cert-list{\n  list-style: none;\n  padding: 0; margin: 0 0 10px;\n  display: grid;\n  gap: 18px;\n}\n.cert-item{\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n.cert-item img{\n  width: 72px;\n  height: 72px;\n  object-fit: contain;\n  filter: brightness(1.1);\n}\n.cert-text{\n  font-size: 28px;\n  color: #fff;\n}\n\n.windows-intro{ font-size: 18px; }\n.windows-body{  font-size: 17px; }\n\n\/* Video frame *\/\n.video-frame{\n  border-radius: 14px;\n  overflow: hidden;\n  background: #0b0b0b;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  transition: transform .6s ease;\n}\n.video-frame.playing { transform: none; }\n\n.video-frame video{\n  display: block;\n  width: 100%;\n  height: auto;\n  aspect-ratio: 4 \/ 4;\n  object-fit: cover;\n}\n@media (max-width: 768px){\n  .video-frame video{ aspect-ratio: 16 \/ 9; }\n}\n\n\/* ===== SECTION 6:Custom Inner Panels ===== *\/\n.panels-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.panels-inner{ max-width: 1200px; margin: 0 auto; }\n\n.panels-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 28px;\n  background: linear-gradient(90deg,#ffffff,#4db2ff,#ffffff);\n  background-size:300% 300%;\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n.panels-title span{ -webkit-text-fill-color: inherit; }\n\n\/* Video *\/\n.panels-video-wrap{\n  border-radius: 14px;\n  overflow: hidden;\n  background:#0b0b0b;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  margin: 0 0 36px;\n}\n.panels-video{\n  display:block;\n  width:100%;\n  height:auto;\n  object-fit: cover;\n}\n\n\/* Features grid *\/\n.panels-grid{\n  max-width: 1200px;\n  margin: 0 auto;\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 48px;\n  text-align: center;\n}\n\n.panel-card{\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n.panel-ico{\n  width: 120px;\n  height: auto;\n  margin-bottom: 24px;\n  filter: brightness(1.2);\n}\n.panel-ico img{\n  width: 150px;\n  height: auto;\n  display: block;\n}\n\n.panel-title{\n  color: #fff !important;\n  font-size: 40px;\n  font-weight: 600;\n  margin-bottom: 10px;\n  letter-spacing: 0;\n  text-transform: none;\n}\n\n.panel-text{\n  font-size: 17px;\n  line-height: 1.6;\n  margin: 0;\n  align-self: stretch;\n  margin-top: auto;\n  color: #c9d2dc;\n}\n\n@media (max-width: 992px){\n  .panels-grid{\n    grid-template-columns: 1fr;\n    gap: 36px;\n  }\n}\n\n\/* ===== SECTION 7: Factory-Installed Fastening Solutions ===== *\/\n.fasteners-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 100px 15px 140px;\n}\n.fasteners-inner{ max-width: 1200px; margin: 0 auto; }\n\n.fasteners-preview{\n  position: relative;\n  border-radius: 0;\n  overflow: hidden;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  background: #0b0b0b;\n}\n.fasteners-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 28px;\n  background: linear-gradient(90deg,#fff,#4db2ff,#fff);\n  background-size:300% 300%;\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n\n\/* Make the preview a fixed-ratio frame *\/\n#factory-fasteners .cutouts-preview{\n  max-width: 1200px;\n  margin: 0 auto 22px;\n  aspect-ratio: 16 \/ 10;\n  border-radius: 0;\n  overflow: hidden;\n  background:#0b0b0b;\n}\n\n\/* Force every image to exactly fill the frame area *\/\n#factory-fasteners .cutouts-preview img{\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  display: block;\n}\n\n#factory-fasteners .cutouts-preview img{ object-fit: cover; }\n\n\n\/* ===== SECTION 8: Custom Welded Support Struts ===== *\/\n\n\/* Container *\/\n.struts-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.struts-inner{ max-width: 1200px; margin: 0 auto; }\n\n\/* Title *\/\n.struts-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 36px;\n  text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg,#fff,#4db2ff,#fff,#4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n@media (max-width: 1200px){ .struts-title{ padding-left: 0; } }\n@media (max-width: 992px){ .struts-title{ font-size: 46px; } }\n\n\/* Layout (true 50\/50 that respects the 72px gap) *\/\n.struts-flex{\n  display: flex;\n  gap: 72px;\n  align-items: center;\n  max-width: 1200px;\n  margin: 0 auto;\n  flex-wrap: nowrap;\n  width: 100%;\n}\n.struts-copy,\n.struts-media{\n  flex: 0 1 calc((100% - 72px) \/ 2) !important; \/* \u2190 prevents overflow *\/\n  min-width: 0;\n  box-sizing: border-box;\n}\n\n\/* Left column *\/\n.struts-intro{ color:#c9d2dc; font-size:16px; margin:0 0 18px; }\n.struts-list{\n  list-style:none;\n  padding:0;\n  margin:0 0 16px;\n  display:grid;\n  gap:26px;\n}\n.struts-item{ display:flex; align-items:center; gap:18px; }\n.struts-ico{ width:148px; height:148px; object-fit:contain; }\n.struts-head{\n  margin:0;\n  font-size:36px;\n  font-weight:500;\n  color:#fff !important;\n  line-height:1.2;\n}\n.struts-body{ color:#c9d2dc; font-size:17px; line-height:1.75; margin:16px 0 0; }\n.struts-body b{ color:#fff; }\n\n\n\/\/* Frame wrapper (image or video) *\/\n.struts-video-wrap{\n  position: relative;\n  border-radius:14px;\n  overflow:hidden;\n  background:#0b0b0b;\n  box-shadow:0 20px 60px rgba(0,0,0,.45);\n  width: 100%;\n}\n\n\/* Taller look *\/\n.struts-video-wrap.taller{\n  aspect-ratio: 3 \/ 4;\n  min-height: 460px;\n}\n\n\/* Make the image fill the box *\/\n.struts-video-wrap img.struts-image{\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  display: block;\n}\n\n\n\n\/* Optional subtle grow while playing *\/\n.struts-video-wrap.playing{\n  transition: transform .6s ease;\n  transform: scale(1.02);\n}\n\n\/* Responsive *\/\n@media (max-width: 992px){\n  .struts-flex{\n    flex-wrap: wrap;\n    gap: 36px;\n  }\n  .struts-copy,\n  .struts-media{\n    flex: 1 1 100% !important;   \/* stack *\/\n  }\n  .struts-ico{ width:120px; height:120px; }\n  .struts-head{ font-size:30px; }\n}\n\n\/* ===== SECTION 9: Gland Plates ===== *\/\n.gland-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.gland-inner{ max-width: 1200px; margin: 0 auto; }\n\n\/* Title \u2013 same look as other H2s *\/\n.gland-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 32px;\n  text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg,#ffffff,#4db2ff,#ffffff,#4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n  line-height: 1.1;\n}\n.gland-title span{ -webkit-text-fill-color: inherit; }\n@media (max-width:1200px){ .gland-title{ padding-left: 0; } }\n@media (max-width:992px){ .gland-title{ font-size: 46px; } }\n\n\/* Video frame *\/\n.gland-video-wrap{\n  border-radius: 14px;\n  overflow: hidden;\n  background: #0b0b0b;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  margin: 0 auto 18px;\n  max-width: 1200px;\n}\n.gland-video-wrap video{\n  display: block;\n  width: 100%;\n  height: auto;\n  aspect-ratio: 16 \/ 9;\n  object-fit: cover;\n}\n.gland-video-wrap.playing{ transition: transform .6s ease; transform: scale(1.015); }\n\n\/* Body copy *\/\n.gland-copy{\n  max-width: 980px;\n  margin: 30px auto 0;\n  color: #c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n  text-align: center;\n}\n.gland-copy b{ color:#fff; }\n\n\n\/* ===== SECTION 10: Welded Brackets ===== *\/\n.brackets-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.brackets-inner{ max-width: 1200px; margin: 0 auto; }\n\n\/* Title (same system) *\/\n.brackets-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 32px;\n  text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg,#ffffff,#4db2ff,#ffffff,#4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n  line-height: 1.1;\n}\n.brackets-title span{ -webkit-text-fill-color: inherit; }\n@media (max-width:1200px){ .brackets-title{ padding-left: 0; } }\n@media (max-width:992px){ .brackets-title{ font-size: 46px; } }\n\n\/* Video frame *\/\n.brackets-video-wrap{\n  border-radius: 14px;\n  overflow: hidden;\n  background: #0b0b0b;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  margin: 0 auto 24px;\n  max-width: 1200px;\n}\n.brackets-video-wrap video{\n  display: block;\n  width: 100%;\n  height: auto;\n  aspect-ratio: 16 \/ 9;\n  object-fit: cover;\n}\n.brackets-video-wrap.playing{ transition: transform .6s ease; transform: scale(1.015); }\n\n\/* Copy *\/\n.brackets-intro{\n  max-width: 980px;\n  margin: 4px auto 26px;\n  color: #c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n  text-align: center;\n}\n\n\/* Three feature columns *\/\n\/* Feature grid \u2013 same style as drip shields *\/\n.brackets-grid{\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 48px;\n  max-width: 1100px;\n  margin: 0 auto;\n}\n\n.brackets-item{ \n  min-width: 0;\n  text-align: center;\n}\n\n.brackets-head{\n  margin: 0 0 8px;\n  color: #fff !important;\n  font-size: 22px;\n  font-weight: 600;\n  letter-spacing: .02em;\n}\n\n.brackets-divider{\n  display: block;\n  width: 100%;\n  height: 1px;\n  background: rgba(255,255,255,.14);\n  margin: 10px 0 14px;\n}\n\n.brackets-text{\n  margin: 0;\n  color: #c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n}\n\n@media (max-width: 992px){\n  .brackets-grid{\n    grid-template-columns: 1fr;\n    gap: 28px;\n  }\n}\n\n\n\/* ===== SECTION 11: Dead-Front & Swing-Out Panels ===== *\/\n.swing-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.swing-inner{ max-width: 1200px; margin: 0 auto; }\n\n\/* Title (same 70px gradient style) *\/\n.swing-title{\n  font-size: 70px;\n  font-weight: 400;\n  margin: 0 0 32px;\n  text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg,#ffffff,#4db2ff,#ffffff,#4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n  line-height: 1.1;\n}\n.swing-title span{ -webkit-text-fill-color: inherit; }\n@media (max-width:1200px){ .swing-title{ padding-left: 0; } }\n@media (max-width:992px){ .swing-title{ font-size: 46px; } }\n\n\/* Video frame *\/\n.swing-video-wrap{\n  position: relative;\n  max-width: 1200px;\n  margin: 0 auto 24px;\n  background: #000;\n  aspect-ratio: 16 \/ 9;\n  overflow: hidden;\n  border-radius: 0;\n}\n.swing-video-wrap video{\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;            \/* fills the box *\/\n  object-position: center bottom; \/* \ud83d\udc48 bias framing to the bottom *\/\n  display: block;\n}\n.swing-video-wrap.playing{ transform: none; }\n\n\n\/* Body copy *\/\n.swing-intro{\n  max-width: 980px;\n  margin: 10px auto 0;\n  color: #c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n  text-align: center;\n}\n.swing-intro strong{ color:#fff; }\n\n\/* ===== Section 12: Door Stop & Gas Spring Additions ===== *\/\n.door-gas-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.door-gas-inner{ max-width: 1200px; margin: 0 auto; }\n\n\/* Title: same 70px gradient style *\/\n.door-gas-title{\n  font-size: 70px; font-weight: 400; margin: 0 0 28px; text-align: left;\n  padding-left: calc((100% - 1200px)\/2);\n  background: linear-gradient(90deg,#ffffff,#4db2ff,#ffffff,#4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text; -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n@media (max-width:1200px){ .door-gas-title{ padding-left:0; } }\n@media (max-width:992px){ .door-gas-title{ font-size:46px; } }\n\n\/* Rows *\/\n.dg-row{\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 48px;\n  align-items: center;\n  margin: 22px 0 42px;\n}\n.dg-media, .dg-copy{ min-width: 0; }\n\n\/* Video frame *\/\n.dg-frame{\n  border-radius: 14px;\n  overflow: hidden;\n  background: #0b0b0b;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n}\n.dg-frame video{\n  display: block;\n  width: 100%;\n  height: auto;\n  aspect-ratio: 16 \/ 9;\n  object-fit: cover;\n}\n.dg-frame.playing{ transition: transform .6s ease; transform: scale(1.015); }\n\n\/* Copy *\/\n.dg-h3{\n  margin: 0 0 8px;\n  font-size: 26px;\n  font-weight: 600;\n  color: #fff !important;\n}\n.dg-p{\n  margin: 0;\n  color: #c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n}\n\n\/* Footer paragraph *\/\n.dg-foot{\n  max-width: 980px;\n  margin: 8px auto 0;\n  color:#c9d2dc;\n  font-size: 17px;\n  line-height: 1.75;\n  text-align: center;\n}\n\n@media (max-width: 992px){\n  .dg-row{ grid-template-columns: 1fr; gap: 24px; }\n}\n\n\n\/* ===== Section 13: Custom Drip Shields ===== *\/\n.drip-section{\n  background: var(--bg-dark);\n  color: var(--text-light);\n  font-family: var(--font-main);\n  padding: 120px 15px 140px;\n}\n.drip-inner{ max-width: 1200px; margin: 0 auto; }\n\n\/* Title (same system) *\/\n.drip-title{\n  font-size: 70px; font-weight: 400; margin: 0 0 28px; text-align: left;\n  padding-left: calc((100% - 1200px) \/ 2);\n  background: linear-gradient(90deg,#ffffff,#4db2ff,#ffffff,#4db2ff);\n  background-size: 300% 300%;\n  -webkit-background-clip: text; -webkit-text-fill-color: transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n@media (max-width:1200px){ .drip-title{ padding-left:0; } }\n@media (max-width:992px){ .drip-title{ font-size:46px; } }\n\n\/* Hero image (crop bottom) *\/\n.drip-image-wrap{\n  position: relative;\n  \/* pick the framing you like *\/\n  aspect-ratio: 16 \/ 9;           \/* or 21 \/ 9, 4 \/ 3, etc. *\/\n  overflow: hidden;\n  background: #0b0b0b;\n  box-shadow: 0 20px 60px rgba(0,0,0,.45);\n  margin: 0 0 22px;\n  border-radius: 0;                \/* if you want no radius *\/\n}\n\n\/* Fill the frame, no squish, keep top visible *\/\n.drip-image{\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: top center;\n  display: block;\n}\n\n\/* Intro copy *\/\n.drip-intro{\n  color:#c9d2dc; font-size:17px; line-height:1.75; margin: 8px 0 28px;\n  text-align: center;\n}\n\n\/* Feature grid *\/\n.drip-grid{\n  display:grid;\n  grid-template-columns: repeat(3,1fr);\n  gap: 48px;\n}\n.ds-item{ min-width:0; text-align: center;}\n.ds-h3{\n  margin:0 0 8px; color:#fff !important; font-size:22px; font-weight:600; letter-spacing:.02em;\n}\n.ds-divider{\n  display:block; width:100%; height:1px; background:rgba(255,255,255,.14);\n  margin: 10px 0 14px;\n}\n.ds-p{\n  margin:0; color:#c9d2dc; font-size:17px; line-height:1.75;\n}\n\n@media (max-width:992px){\n  .drip-grid{ grid-template-columns:1fr; gap:28px; }\n}\n\n  \/* ===== Section 14: Pre-Installed Insulation (match site styling) ===== *\/\n  .insul2-section{ background:var(--bg-dark); color:var(--text-light); font-family:var(--font-main); padding:120px 15px 140px; }\n  .insul2-inner{ max-width:1600px; margin:0 auto; }\n  .insul2-title{\n    font-size:70px; font-weight:400; margin:0 0 36px; text-align:left;\n    padding-left:calc((100% - 1200px)\/2);\n    background:linear-gradient(90deg,#fff,#4db2ff,#fff,#4db2ff);\n    background-size:300% 300%;\n    -webkit-background-clip:text; -webkit-text-fill-color:transparent;\n    animation:gradient-wave 6s ease-in-out infinite;\n  }\n  @media (max-width:1200px){ .insul2-title{ padding-left:0; } }\n  @media (max-width:992px){ .insul2-title{ font-size:46px; } }\n\n  \/* Video frame *\/\n  .insul2-video-wrap{\n    max-width:1200px; margin:0 auto 22px; border-radius:14px; overflow:hidden;\n    background:#0b0b0b; box-shadow:0 20px 60px rgba(0,0,0,.45);\n    aspect-ratio: 21 \/ 9; \/* tall-ish wide look like the screenshot *\/\n  }\n  .insul2-video-wrap video{ width:100%; height:100%; display:block; object-fit:cover; }\n\n  .insul2-intro{\n    max-width:1200px; margin:10px auto 40px; text-align:center;\n    color:#c9d2dc; font-size:17px; line-height:1.7;\n  }\n\n  \/* Features *\/\n  .insul2-grid{\n    max-width:1200px; margin:0 auto;\n    display:grid; grid-template-columns:repeat(3,1fr); gap:48px; text-align:center;\n  }\n  @media (max-width:992px){ .insul2-grid{ grid-template-columns:1fr; gap:32px; } }\n\n  .insul2-card{ display:flex; flex-direction:column; align-items:center; }\n  .insul2-ico{ width:120px; height:120px; margin-bottom:16px; filter:brightness(1.1); }\n  .insul2-h4{ font-size:40px; font-weight:600; margin:0 0 8px; color:#fff !important; }\n  .insul2-text{ color:#c9d2dc; font-size:17px; line-height:1.7; margin:0; }\n\n  \/* ===== Section 15: Louver ===== *\/\n  .louver-section{ background:var(--bg-dark); color:var(--text-light); font-family:var(--font-main); padding:120px 15px 140px; }\n  .louver-inner{ max-width:1600px; margin:0 auto; }\n  .louver-title{\n    font-size:70px; font-weight:400; margin:0 0 36px; text-align:left;\n    padding-left:calc((100% - 1200px)\/2);\n    background:linear-gradient(90deg,#fff,#4db2ff,#fff,#4db2ff);\n    background-size:300% 300%;\n    -webkit-background-clip:text; -webkit-text-fill-color:transparent;\n    animation:gradient-wave 6s ease-in-out infinite;\n  }\n  @media (max-width:1200px){ .louver-title{ padding-left:0; } }\n  @media (max-width:992px){ .louver-title{ font-size:46px; } }\n\n  .louver-flex{\n    max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start;\n  }\n  @media (max-width:992px){ .louver-flex{ grid-template-columns:1fr; } }\n\n  .louver-media{\n    border-radius:14px; overflow:hidden; background:#000; box-shadow:0 20px 60px rgba(0,0,0,.45);\n  }\n\n  .louver-img{ display:block; width:100%; height:auto; object-fit:cover; aspect-ratio: 16 \/ 10;}\n  .louver-caption{\n    margin:60px 0 0; padding:0 0 0; color:#c9d2dc; font-size:17px; line-height:1.7;\n    background:#000; box-shadow:none; border-radius:0;\n  }\n\n  .louver-video{ display:block; width:100%; height:100%; object-fit:cover; aspect-ratio: 4 \/ 5; }\n  @media (max-width:992px){ .louver-video{ aspect-ratio:16\/9; } }\n  \n  \/* ===== Section 16: Partition Panel ===== *\/\n.partition-section{ background:var(--bg-dark); color:var(--text-light); font-family:var(--font-main); padding:120px 15px 140px; }\n.partition-inner{ max-width:1600px; margin:0 auto; }\n\n.partition-title{\n  font-size:70px; font-weight:400; margin:0 0 36px; text-align:left;\n  padding-left:calc((100% - 1200px)\/2);\n  background:linear-gradient(90deg,#fff,#4db2ff,#fff,#4db2ff);\n  background-size:300% 300%;\n  -webkit-background-clip:text; -webkit-text-fill-color:transparent;\n  animation:gradient-wave 6s ease-in-out infinite;\n}\n@media (max-width:1200px){ .partition-title{ padding-left:0; } }\n@media (max-width:992px){ .partition-title{ font-size:46px; } }\n\n.partition-flex{\n  max-width:1200px; margin:0 auto;\n  display:flex; gap:72px; align-items:center; flex-wrap:nowrap;\n}\n.partition-copy, .partition-media{ flex:0 0 50%; min-width:0; }\n\n.partition-intro{ color:#c9d2dc; font-size:15.5px; line-height:1.75; margin:0 0 22px; }\n\n.partition-list{ list-style:none; padding:0; margin:0; display:grid; gap:24px; }\n.partition-item{ display:flex; align-items:center; gap:18px; }\n.partition-ico{ width:148px; height:148px; object-fit:contain; filter:brightness(1); }\n.partition-head{ color:#fff; font-size:40px; font-weight:500; line-height:1.25; }\n\n\/* Video frame *\/\n.partition-video-wrap{\n  width: 100%;\n  border-radius: 0;\n  overflow: hidden;\n  background:#0b0b0b;\n  box-shadow:0 20px 60px rgba(0,0,0,.45);\n  position: relative;\n}\n.partition-video-wrap video{\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100% !important;\n  object-fit: cover;\n  object-position: center;\n}\n\/* Make it taller via aspect-ratio (adjust as you like) *\/\n.partition-video-wrap.taller{\n  aspect-ratio: 3 \/ 4 !important;\n}\n.partition-video-wrap.playing{ transition:transform .6s ease; transform:scale(1.015); }\n\n\/* Responsive *\/\n@media (max-width:992px){\n  .partition-flex{ flex-wrap:wrap; gap:36px; }\n  .partition-copy, .partition-media{ flex:1 1 100%; }\n}\n\n\/* ===== Last Section: Configurator Ticker ===== *\/\n.ticker{\n  --speed: 18s;\n  --gap: 12.2ch;\n  background:#000;\n  border-radius:16px;\n  overflow:hidden;\n  padding:18px 24px;\n}\n\n\/* The moving rail that contains two identical tracks *\/\n.ticker-viewport{\n  display:flex;\n  width:max-content;\n  will-change: transform;\n  animation: marquee var(--speed) linear infinite;\n}\n\n\/* Each track = your original content *\/\n.ticker-track{\n  display:flex;\n  align-items:center;\n  gap: var(--gap);\n  padding-right: var(--gap);\n  white-space: nowrap;\n}\n\n.ticker-text{\n  font: 600 226px\/1 \"Albert Sans\", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;\n  letter-spacing:.02em;\n  background: linear-gradient(90deg, #ffffff, #4db2ff, #ffffff, #4db2ff);\n  background-size:300% 300%;\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  animation: gradient-wave 6s ease-in-out infinite;\n}\n\n\/* Logo scales with text, stays aligned to baseline *\/\n.ticker-logo{\n  width: 40em;\n  height: auto;\n  object-fit: contain;\n  vertical-align: middle;\n  opacity:.95;\n  pointer-events:none;\n  user-select:none;\n  flex-shrink: 0;\n}\n\n@media (max-width: 768px){\n  .ticker-text{ font-size:28px; }\n  .ticker-logo{ width: 4.5em; }\n}\n\n\/* Continuous loop: move exactly one track width to the left *\/\n@keyframes marquee{\n  0%   { transform: translateX(0); }\n  100% { transform: translateX(-50%); }\n}\n\n\/* Keep if not global *\/\n@keyframes gradient-wave{\n  0%{background-position:0% 50%}\n  50%{background-position:100% 50%}\n  100%{background-position:0% 50%}\n}\n\n\n\/* Update all *\/\n\n\/* === 1) Always size by the WRAPPER, never the <video> intrinsic size === *\/\n.video-frame,\n.gland-video-wrap,\n.brackets-video-wrap,\n.swing-video-wrap,\n.dg-frame,\n#louverWrap,\n.partition-video-wrap,\n#dimensionVideoWrap,\n.insul2-video-wrap,\n.struts-video-wrap,\n.color-preview {\n  position: relative;\n  overflow: hidden;\n}\n\n\/* Give wrappers their aspect ratios (match your current design) *\/\n.video-frame{ aspect-ratio: 4 \/ 4; }\n.gland-video-wrap{ aspect-ratio: 16 \/ 9; }\n.brackets-video-wrap{ aspect-ratio: 16 \/ 9; }\n.swing-video-wrap{ aspect-ratio: 16 \/ 9; }\n.dg-frame{ aspect-ratio: 16 \/ 9; }\n#louverWrap{ aspect-ratio: 4 \/ 5; }\n@media (max-width: 992px){ #louverWrap{ aspect-ratio: 16 \/ 9; } }\n.partition-video-wrap.taller{ aspect-ratio: 4 \/ 3; }\n#dimensionVideoWrap{ aspect-ratio: 16 \/ 9; }      \/* you had none here *\/\n.insul2-video-wrap{ aspect-ratio: 21 \/ 9; }\n.struts-video-wrap{ aspect-ratio: 4 \/ 3; }\n.color-preview{ aspect-ratio: 16 \/ 9; }           \/* your JS may update this *\/\n\n\/* Make the media fill the wrapper, ignore any video aspect-ratio declarations *\/\n.video-frame video,\n.gland-video-wrap video,\n.brackets-video-wrap video,\n.swing-video-wrap video,\n.dg-frame > video,\n#louverWrap > video,\n.partition-video-wrap video,\n#dimensionVideoWrap > video,\n.insul2-video-wrap > video,\n.struts-video-wrap > video,\n.color-preview > video,\n.color-preview > .final-frame {\n  position: absolute;\n  inset: 0;\n  width: 100% !important;\n  height: 100% !important;\n  object-fit: cover;               \/* use 'contain' only if you truly want letterboxing *\/\n  display: block;\n  aspect-ratio: auto !important;   \/* kill any AR set on the <video> itself *\/\n}\n\n\/* If you want a single section to be 'contain' (e.g., Dimension): *\/\n#dimensionVideoWrap > video { object-fit: contain; }\n\n\/* === 2) Remove the scale \u201csnap back\u201d at end === *\/\n.video-frame.playing,\n.gland-video-wrap.playing,\n.brackets-video-wrap.playing,\n.swing-video-wrap.playing,\n.dg-frame.playing,\n.partition-video-wrap.playing,\n.struts-video-wrap.playing {\n  transform: none !important;      \/* no grow-on-play *\/\n}\n\n\/* Remove border radius on all media wrappers and their children *\/\n.video-frame,\n.gland-video-wrap,\n.brackets-video-wrap,\n.swing-video-wrap,\n.dg-frame,\n#louverWrap,\n.partition-video-wrap,\n#dimensionVideoWrap,\n.insul2-video-wrap,\n.struts-video-wrap,\n.color-preview,\n.panels-video-wrap,\n.louver-media,\n.drip-image-wrap {\n  border-radius: 0 !important;\n  overflow: hidden; \/* keep for object-fit cropping *\/\n}\n\n.video-frame video,\n.gland-video-wrap video,\n.brackets-video-wrap video,\n.swing-video-wrap video,\n.dg-frame > video,\n#louverWrap > video,\n.partition-video-wrap video,\n#dimensionVideoWrap > video,\n.insul2-video-wrap > video,\n.struts-video-wrap > video,\n.color-preview > video,\n.color-preview > .final-frame,\n.panels-video-wrap video,\n.louver-media img,\n.drip-image-wrap img {\n  border-radius: 0 !important;\n}\n\n<\/style>\n\n<!-- ========== HERO Section 1 ========== -->\n<section class=\"custom-hero\">\n  <div class=\"hero-content\">\n    <h1 class=\"hero-title\">CUSTOM<br \/>SOLUTIONS<\/h1>\n    <p class=\"hero-subtitle\">\n      From concept to completion, flexible solutions tailored<br \/>\n      to your exact needs.\n    <\/p>\n    \n    <img decoding=\"async\"\n      src=\"https:\/\/exmweb.b-cdn.net\/BOXCAD-LOGO.webp\"\n      alt=\"BOXCAD custom solutions\"\n      class=\"hero-icon\"\n    \/>\n    <a href=\"#custom-dimension\" class=\"hero-scroll\">Discover<\/a>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 2: Custom Dimension ========== -->\n<section id=\"custom-dimension\" class=\"custom-dimension-section\">\n  <div class=\"dimension-inner\">\n    <h2 class=\"dimension-title\">Custom Dimension<\/h2>\n\n<div class=\"dimension-video-wrap\" id=\"dimensionVideoWrap\">\n  <video class=\"dimension-video\" id=\"dimensionVideo\" muted playsinline preload=\"metadata\">\n    <source src=\"https:\/\/exmweb.b-cdn.net\/Compressed%20Vid%20for%20Custom%20Solutions%20Page\/sizes_short_option_sm.mp4\" type=\"video\/mp4\" \/>\n  <\/video>\n<\/div>\n\n\n    <div class=\"dimension-grid\">\n      <div class=\"dimension-card\">\n        <div class=\"dimension-card-top\">\n          <img decoding=\"async\"\n            src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-Size.webp\"\n            alt=\"Range of Formats\"\n            class=\"dimension-icon\"\n          \/>\n          <h3 class=\"dimension-card-title\">RANGE OF FORMATS<\/h3>\n        <\/div>\n        <p>\n          Each standard enclosure type supports full dimensional customization\n          across height, width, and depth.\n        <\/p>\n      <\/div>\n\n      <div class=\"dimension-card\">\n        <div class=\"dimension-card-top\">\n          <img decoding=\"async\"\n            src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-positioned-2.webp\"\n            alt=\"Precision Fit\"\n            class=\"dimension-icon\"\n          \/>\n          <h3 class=\"dimension-card-title\">PRECISION FIT<\/h3>\n        <\/div>\n        <p>\n          Engineered to match the exact space requirements of each design,\n          minimizing footprint and unused volume.\n        <\/p>\n      <\/div>\n\n      <div class=\"dimension-card\">\n        <div class=\"dimension-card-top\">\n          <img decoding=\"async\"\n            src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/11\/Verified-\u2028Fit.png\"\n            alt=\"Consistent Mounting Geometry\"\n            class=\"dimension-icon\"\n          \/>\n          <h3 class=\"dimension-card-title\">CONSISTENT MOUNTING GEOMETRY<\/h3>\n        <\/div>\n        <p>\n          Maintain uniform hinge, panel, and mounting alignments across enclosure\n          sizes for scalable, system-wide compatibility.\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 3: Custom Colour & Textures ========== -->\n<section id=\"custom-color\" class=\"custom-color-section\">\n  <div class=\"color-inner\">\n    <h2 class=\"color-title\">Custom Colour &amp; Textures<\/h2>\n\n    <div class=\"color-flex\">\n      <div class=\"color-options\">\n        <div class=\"color-option-group\">\n          <h4>Materials<\/h4>\n          <div class=\"material-stack\">\n            <div class=\"material-layer mild\">\n              <span class=\"label\">Mild Steel<\/span>\n            <\/div>\n            <div class=\"material-layer\">\n              <img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Mild%20steel_SS_.webp\" \/>\n              <span class=\"label\">Painted Stainless Steel<\/span>\n            <\/div>\n            <div class=\"material-layer\">\n              <img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Mild%20steel_AL_.webp\" alt=\"Aluminum\" \/>\n              <span class=\"label\">Painted Aluminum<\/span>\n            <\/div>\n            <div class=\"material-layer\">\n              <img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/shutterstock_2224436281.webp\" alt=\"Brushed Stainless\" \/>\n              <span class=\"label\">Brushed Stainless<\/span>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"color-option-group\">\n          <h4>Paint Textures<\/h4>\n          <div class=\"texture-row\">\n            <div class=\"texture-item\"><img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Smooth%20textured.webp\" alt=\"Smooth Textured\" \/><\/div>\n            <div class=\"texture-item\"><img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Light%20textured.webp\" alt=\"Light Textured\" \/><\/div>\n            <div class=\"texture-item\"><img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Sand%20textured.webp\" alt=\"Sand Textured\" \/><\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"color-option-group\">\n          <h4>Paint Colors<\/h4>\n          <div class=\"color-swatches-row\">\n            <div class=\"paint-color-block\" style=\"background:#ffffff;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#dadad3;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#cdcccc;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#c4c6c5;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#a7a9ac;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#45494f;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#393d41;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#435741;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#44674e;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#a3b49d;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#22275b;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#314c97;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#942521;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#dc6628;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#f1c637;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#e2c675;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#efdfba;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#fcf6e8;\"><\/div>\n            <div class=\"paint-color-block\" style=\"background:#000000;\"><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n        <div class=\"color-preview\" id=\"colorPreview\">\n          <video id=\"customOptionsVideo\" muted playsinline preload=\"auto\">\n            <source src=\"https:\/\/exmweb.b-cdn.net\/Compressed%20Vid%20for%20Custom%20Solutions%20Page\/custom_color_sequence_2_sm20(online-video-cutter.com).mp4\" type=\"video\/mp4\" \/>\n          <\/video>\n          <img decoding=\"async\"\n            class=\"final-frame\"\n            src=\"https:\/\/exmweb.b-cdn.net\/Smooth\/Smooth_5.webp\"\n            alt=\"Final frame\"\n          \/>\n        <\/div>\n    <\/div>\n  <\/div>\n\n  <!-- 3-feature grid under Custom Colour & Textures -->\n<div class=\"dimension-grid color-grid\">\n  <div class=\"dimension-card\">\n    <div class=\"dimension-card-top\">\n      <img decoding=\"async\"\n        src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-Color-accuracy.webp\"\n        alt=\"Color & Finishing Options\"\n        class=\"dimension-icon\"\n      \/>\n      <h3 class=\"dimension-card-title\">COLOR &amp; FINISHING OPTIONS<\/h3>\n    <\/div>\n    <p>\n      Any specified RAL color can be matched to project requirements.\n      Available in smooth, textured, or sand-grain (Sandtex) surface\n      finishes for aesthetic and practical flexibility.\n    <\/p>\n  <\/div>\n\n  <div class=\"dimension-card\">\n    <div class=\"dimension-card-top\">\n      <img decoding=\"async\"\n        src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-Durability.webp\"\n        alt=\"Protective Coating Options\"\n        class=\"dimension-icon\"\n      \/>\n      <h3 class=\"dimension-card-title\">PROTECTIVE COATING OPTIONS<\/h3>\n    <\/div>\n    <p>\n      Zinc-rich primers, UV-resistant topcoats, and graffiti-proof\n      systems provide enhanced protection and long-term durability\n      in demanding environments.\n    <\/p>\n  <\/div>\n\n  <div class=\"dimension-card\">\n    <div class=\"dimension-card-top\">\n      <img decoding=\"async\"\n        src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-Layout.webp\"\n        alt=\"Materials Options\"\n        class=\"dimension-icon\"\n      \/>\n      <h3 class=\"dimension-card-title\">MATERIALS OPTIONS<\/h3>\n    <\/div>\n    <p>\nChoose from brushed stainless steel or painted aluminum in various gauges for mechanical strength and corrosion resistance applications.\n    <\/p>\n  <\/div>\n<\/div>\n<\/section>\n\n\n<!-- ========== SECTION 4: Custom Cutouts (Tabbed) ========== -->\n<section class=\"cutouts-section\" id=\"custom-cutouts\">\n  <div class=\"cutouts-inner\">\n    <h2 class=\"cutouts-title\">Custom Cutouts<\/h2>\n\n    <!-- Preview (no radius per CSS) -->\n    <div class=\"cutouts-preview\">\n      <!-- First tab is the default\/active state -->\n      <img\n        id=\"cutoutsPreview\"\n        src=\"https:\/\/exmweb.b-cdn.net\/Cutouts_HMI_2_lq.webp\"\n        alt=\"HMI cutout preview\"\n        decoding=\"async\"\n        fetchpriority=\"high\"\n      \/>\n    <\/div>\n\n    <!-- Tabs -->\n    <div class=\"cutouts-tabs\" role=\"tablist\" aria-label=\"Cutout types\">\n      <button\n        class=\"cutout-tab\"\n        id=\"tab-hmi\"\n        role=\"tab\"\n        aria-selected=\"true\"\n        aria-controls=\"cutoutsPreview\"\n        data-img=\"https:\/\/exmweb.b-cdn.net\/Cutouts_HMI_2_lq.webp\"\n        data-alt=\"HMI cutout preview\"\n        data-desc=\"Simplify enclosure customization with <b>precision factory-cut openings, finished with the same powder coat as the enclosure to seal edges, prevent corrosion, and eliminate the need for on-site touch-up<\/b>. Using Box CAD, you can drag and drop from an extensive library of pre-formatted component shapes\u2014covering everything from push buttons and switches to fans, vents, meters, HMIs, connectors, and more\u2014or <b>design your own cutouts from scratch<\/b>. Factory cutting ensures clean edges, perfect alignment, and repeatable accuracy across multiple units, saving labor, reducing tooling costs, and ensuring a professional, ready-to-install finish every time.\"\n      >\n        HMI\n      <\/button>\n\n      <button\n        class=\"cutout-tab\"\n        id=\"tab-pb\"\n        role=\"tab\"\n        aria-selected=\"false\"\n        aria-controls=\"cutoutsPreview\"\n        data-img=\"https:\/\/exmweb.b-cdn.net\/Cutouts_Buttons.webp\"\n        data-alt=\"Pushbutton cutout preview\"\n        data-desc=\"Simplify enclosure customization with <b>precision factory-cut openings, finished with the same powder coat as the enclosure to seal edges, prevent corrosion, and eliminate the need for on-site touch-up<\/b>. Using Box CAD, you can drag and drop from an extensive library of pre-formatted component shapes\u2014covering everything from push buttons and switches to fans, vents, meters, HMIs, connectors, and more\u2014or <b>design your own cutouts from scratch<\/b>. Factory cutting ensures clean edges, perfect alignment, and repeatable accuracy across multiple units, saving labor, reducing tooling costs, and ensuring a professional, ready-to-install finish every time.\"\n      >\n        Pushbutton\n      <\/button>\n\n      <button\n        class=\"cutout-tab\"\n        id=\"tab-cabling\"\n        role=\"tab\"\n        aria-selected=\"false\"\n        aria-controls=\"cutoutsPreview\"\n        data-img=\"https:\/\/exmweb.b-cdn.net\/Cabeling_knockOuts_1433x748_4.png\"\n        data-alt=\"Cabling cutout preview\"\n        data-desc=\"Simplify enclosure customization with <b>precision factory-cut openings, finished with the same powder coat as the enclosure to seal edges, prevent corrosion, and eliminate the need for on-site touch-up<\/b>. Using Box CAD, you can drag and drop from an extensive library of pre-formatted component shapes\u2014covering everything from push buttons and switches to fans, vents, meters, HMIs, connectors, and more\u2014or <b>design your own cutouts from scratch<\/b>. Factory cutting ensures clean edges, perfect alignment, and repeatable accuracy across multiple units, saving labor, reducing tooling costs, and ensuring a professional, ready-to-install finish every time.\"\n      >\n        Cabling\n      <\/button>\n    <\/div>\n\n    <!-- Description -->\n    <p class=\"cutouts-desc\" id=\"cutoutsDesc\">\n      Simplify enclosure customization with <b>precision factory-cut openings, finished with the same powder coat as the enclosure to seal edges, prevent corrosion, and eliminate the need for on-site touch-up<\/b>. Using Box CAD, you can drag and drop from an extensive library of pre-formatted component shapes\u2014covering everything from push buttons and switches to fans, vents, meters, HMIs, connectors, and more\u2014or <b>design your own cutouts from scratch<\/b>. Factory cutting ensures clean edges, perfect alignment, and repeatable accuracy across multiple units, saving labor, reducing tooling costs, and ensuring a professional, ready-to-install finish every time.\n    <\/p>\n  <\/div>\n<\/section>\n\n\n<!-- ========== SECTION 5: Certified Custom Windows ========== -->\n<section class=\"windows-section\">\n  <div class=\"windows-inner\">\n    <h2 class=\"windows-title\">Certified Custom Windows<\/h2>\n\n    <div class=\"windows-flex\">\n      <div class=\"windows-copy\">\n        <p class=\"windows-intro\">\n          Our custom windows are built from high-impact, UV-resistant polycarbonate that is both\n        <\/p>\n\n        <ul class=\"cert-list\">\n          <li class=\"cert-item\">\n            <img decoding=\"async\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/CSA-1.webp\" alt=\"CSA icon\" \/>\n            <span class=\"cert-text\"><strong>CSA Certified<\/strong><\/span>\n          <\/li>\n          <li class=\"cert-item\">\n            <img decoding=\"async\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/UL.webp\" alt=\"UL icon\" \/>\n            <span class=\"cert-text\"><strong>UL Recognized<\/strong><\/span>\n          <\/li>\n        <\/ul>\n\n        <p class=\"windows-body\">\n          ensuring long-lasting clarity and durability in demanding environments. These windows can be\n          <strong>tailored in size and positioned anywhere on the enclosure<\/strong> while preserving all relevant\n          electrical ratings. Ideal for monitoring equipment, displays, or indicators without opening the enclosure,\n          they help maintain safety, prevent contamination, and reduce downtime. By integrating them into the enclosure build,\n          you eliminate the need for aftermarket modifications and ensure a precise, professional finish.\n        <\/p>\n      <\/div>\n\n      <div class=\"windows-media\">\n        <div class=\"video-frame\" id=\"windowsVideoFrame\">\n          <video id=\"windowsVideo\" muted playsinline preload=\"metadata\">\n            <source src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/window_kit_small_.mp4\" type=\"video\/mp4\" \/>\n          <\/video>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 6: Custom Inner Panels ========== -->\n<section class=\"panels-section\">\n  <div class=\"panels-inner\">\n    <h2 class=\"panels-title\">Custom <span>Inner Panels<\/span><\/h2>\n\n    <div class=\"panels-video-wrap\">\n      <video id=\"innerPanelsVideo\" class=\"panels-video\" muted playsinline preload=\"auto\">\n        <source src=\"https:\/\/exmweb.b-cdn.net\/inner_panel_3_TH_lq.mp4\" type=\"video\/mp4\" \/>\n      <\/video>\n    <\/div>\n\n    <div class=\"panels-grid\">\n      <div class=\"panel-card\">\n        <div class=\"panel-ico\" aria-hidden=\"true\">\n        <img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Mounting-option.webp\" alt=\"\" \/>\n        <\/div>\n        <h3 class=\"panel-title\">MOUNTING OPTIONS<\/h3>\n        <p class=\"panel-text\">\n          Backplates can be supplied with precision laser-cut holes, optionally threaded (pre-tapped), or equipped with factory-installed rivet nuts\u2014minimizing component mounting time and eliminating field drilling.\n        <\/p>\n      <\/div>\n\n      <div class=\"panel-card\">\n        <div class=\"panel-ico\" aria-hidden=\"true\">\n        <img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Integrated%20Mounting%20Studs.png\" alt=\"\" \/>\n        <\/div>\n        <h3 class=\"panel-title\">INTEGRATED MOUNTING STUDS<\/h3>\n        <p class=\"panel-text\">\n          Factory-installed welded or self-clinching studs provide durable anchor points for mounting components and cable supports, improving consistency and reducing overall assembly time.\n        <\/p>\n      <\/div>\n\n      <div class=\"panel-card\">\n        <div class=\"panel-ico\" aria-hidden=\"true\">\n        <img decoding=\"async\" src=\"https:\/\/exmweb.b-cdn.net\/Pre-Installed%20DIN%20Rails.png\" alt=\"\" \/>\n        <\/div>\n        <h3 class=\"panel-title\">PRE-INSTALLED DIN RAILS<\/h3>\n        <p class=\"panel-text\">\n          Our DIN rails can be pre-mounted on backplates to accelerate panel assembly and maintain standardized component spacing, and simplify future modifications or expansions on site.\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 7: Factory-Installed Fastening Solutions ========== -->\n<section class=\"fasteners-section\" id=\"factory-fasteners\">\n  <div class=\"fasteners-inner\">\n    <h2 class=\"fasteners-title\">\n      Factory-Installed Fastening<br>Solutions\u2014Tailored To Your Build\n    <\/h2>\n\n    <!-- Preview (fixed frame; image swaps instantly via JS) -->\n    <div class=\"fasteners-preview\">\n      <img decoding=\"async\"\n        id=\"fastenersPreview\"\n        src=\"https:\/\/exmweb.b-cdn.net\/rivet%20nut_resize.webp\"\n        alt=\"Rivet nuts installed flush in panel\"\n      >\n    <\/div>\n\n    <!-- Tabs -->\n    <div class=\"cutouts-tabs\" role=\"tablist\" aria-label=\"Fastener types\">\n      <button class=\"cutout-tab\" role=\"tab\" aria-selected=\"false\"\n        data-img=\"https:\/\/exmweb.b-cdn.net\/Self-clinching%20nuts%20(1).webp\"\n        data-alt=\"Self-clinching nuts on sheet metal\"\n        data-desc=\"EXM offers a range of fastening options\u2014including self-clinching nuts, rivet nuts, and studs\u2014installed directly into your enclosure according to your exact specifications. Whether you\u2019re mounting components, securing internal hardware, or preparing for field assembly, our fastener integration service ensures accuracy, consistency, and durability from the start. <b>Available in multiple sizes and formats<\/b>, these fastening solutions can be positioned precisely per your drawing requirements. By integrating them during manufacturing, EXM helps you reduce installation time, improve alignment, and ensure every enclosure arrives ready for streamlined assembly.\">\n        Self-clinching Standoffs\n      <\/button>\n\n      <button class=\"cutout-tab\" role=\"tab\" aria-selected=\"true\"\n        data-img=\"https:\/\/exmweb.b-cdn.net\/rivet%20nut_resize.webp\"\n        data-alt=\"Rivet nuts installed flush in panel\"\n        data-desc=\"EXM offers a range of fastening options\u2014including self-clinching nuts, rivet nuts, and studs\u2014installed directly into your enclosure according to your exact specifications. Whether you\u2019re mounting components, securing internal hardware, or preparing for field assembly, our fastener integration service ensures accuracy, consistency, and durability from the start. <b>Available in multiple sizes and formats<\/b>, these fastening solutions can be positioned precisely per your drawing requirements. By integrating them during manufacturing, EXM helps you reduce installation time, improve alignment, and ensure every enclosure arrives ready for streamlined assembly.\">\n        Rivet nuts\n      <\/button>\n\n      <button class=\"cutout-tab\" role=\"tab\" aria-selected=\"false\"\n        data-img=\"https:\/\/exmweb.b-cdn.net\/studs%20(2).webp\"\n        data-alt=\"Welded\/self-clinching studs on backplate\"\n        data-desc=\"EXM offers a range of fastening options\u2014including self-clinching nuts, rivet nuts, and studs\u2014installed directly into your enclosure according to your exact specifications. Whether you\u2019re mounting components, securing internal hardware, or preparing for field assembly, our fastener integration service ensures accuracy, consistency, and durability from the start. <b>Available in multiple sizes and formats<\/b>, these fastening solutions can be positioned precisely per your drawing requirements. By integrating them during manufacturing, EXM helps you reduce installation time, improve alignment, and ensure every enclosure arrives ready for streamlined assembly.\">\n        Studs\n      <\/button>\n    <\/div>\n\n    <!-- Description -->\n    <p class=\"cutouts-desc\" id=\"fastenersDesc\">\n      EXM offers a range of fastening options\u2014including self-clinching nuts, rivet nuts, and studs\u2014installed directly into your enclosure according to your exact specifications. Whether you\u2019re mounting components, securing internal hardware, or preparing for field assembly, our fastener integration service ensures accuracy, consistency, and durability from the start. <b>Available in multiple sizes and formats<\/b>, these fastening solutions can be positioned precisely per your drawing requirements. By integrating them during manufacturing, EXM helps you reduce installation time, improve alignment, and ensure every enclosure arrives ready for streamlined assembly.\n    <\/p>\n  <\/div>\n<\/section>\n\n\n<!-- ========== SECTION 8: Custom Welded Support Struts ========== -->\n<section class=\"struts-section\" id=\"support-struts\">\n  <div class=\"struts-inner\">\n    <h2 class=\"struts-title\">Custom Welded Struts \u2014 <br> Dependable Support for Heavy Equipment<\/h2>\n\n    <div class=\"struts-flex\">\n      <!-- LEFT -->\n      <div class=\"struts-copy\">\n        <p class=\"struts-intro\">EXM can equip your enclosure or free-standing cabinet with\u2026<\/p>\n\n        <ul class=\"struts-list\">\n          <li class=\"struts-item\">\n            <img decoding=\"async\" class=\"struts-ico\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-Welded-support.webp\" alt=\"\">\n            <h3 class=\"struts-head\">Welded Support<br>Struts<\/h3>\n          <\/li>\n          <li class=\"struts-item\">\n            <img decoding=\"async\" class=\"struts-ico\" src=\"https:\/\/exmweb.b-cdn.net\/Custom-sized.png\" alt=\"\">\n            <h3 class=\"struts-head\">Custom-sized<\/h3>\n          <\/li>\n          <li class=\"struts-item\">\n            <img decoding=\"async\" class=\"struts-ico\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-positioned.webp\" alt=\"\">\n            <h3 class=\"struts-head\">Precisely positioned<\/h3>\n          <\/li>\n        <\/ul>\n\n        <p class=\"struts-body\">\n          Designed for strength and stability, these struts provide peace of mind when mounting heavy-duty components\u2014eliminating the need for\n          <b>field modifications and ensuring your enclosure is ready from day one<\/b>.\n        <\/p>\n      <\/div>\n\n      <!-- RIGHT: taller Image -->\n<div class=\"struts-media\">\n  <div class=\"struts-video-wrap taller\">\n    <img decoding=\"async\"\n      src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/welded_support_struts.webp\"\n      alt=\"Custom welded support struts\"\n      class=\"struts-image\"\n    \/>\n  <\/div>\n<\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 9: Gland Plates ========== -->\n<section class=\"gland-section\">\n  <div class=\"gland-inner\">\n    <h2 class=\"gland-title\">\n      Design Gland Plates To<br>\n      <span>Match Your Exact Needs<\/span>\n    <\/h2>\n\n    <div class=\"gland-video-wrap\" id=\"glandVideoFrame\">\n      <video id=\"glandVideo\" muted playsinline preload=\"metadata\">\n        <source src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/GlandPlate_lq.mp4\" type=\"video\/mp4\" \/>\n      <\/video>\n    <\/div>\n\n    <p class=\"gland-copy\">\n      Design gland plates to match your exact needs\u2014whether that\u2019s pre-cut openings for known cable\n      entry points to speed up installation, or keeping the plate solid to <b>allow last-minute decisions\n      on cutout placement at the installation site<\/b>. Each plate is fully gasketed and can be positioned\n      anywhere on the enclosure, making modifications simple\u2014just remove, cut, and reinstall.\n    <\/p>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 10: Welded Brackets ========== -->\n<section class=\"brackets-section\">\n  <div class=\"brackets-inner\">\n    <h2 class=\"brackets-title\">\n      Welded Brackets For Your<br><span>Toughest Equipment<\/span>\n    <\/h2>\n\n    <div class=\"brackets-video-wrap\" id=\"bracketsVideoFrame\">\n      <video id=\"bracketsVideo\" muted playsinline preload=\"metadata\">\n        <source src=\"https:\/\/exmweb.b-cdn.net\/brackets_sm.mp4\" type=\"video\/mp4\" \/>\n      <\/video>\n    <\/div>\n\n    <p class=\"brackets-intro\">\n      Our welded mounting brackets are engineered to handle your toughest equipment. They provide the structural\n      reinforcement needed to keep large control gear, such as inverters, transformers, and motor drives, stable during\n      operation, transport, and installation.\n    <\/p>\n\n<div class=\"brackets-grid\">\n  <div class=\"brackets-item\">\n    <h3 class=\"brackets-head\">Custom-Designed<\/h3>\n    <span class=\"brackets-divider\" aria-hidden=\"true\"><\/span>\n    <p class=\"brackets-text\">\n      Each bracket is designed and positioned to your exact specifications.\n    <\/p>\n  <\/div>\n\n  <div class=\"brackets-item\">\n    <h3 class=\"brackets-head\">Saves Time and Money<\/h3>\n    <span class=\"brackets-divider\" aria-hidden=\"true\"><\/span>\n    <p class=\"brackets-text\">\n      Integrating them directly into the enclosure build eliminates the time and cost of field modifications.\n    <\/p>\n  <\/div>\n\n  <div class=\"brackets-item\">\n    <h3 class=\"brackets-head\">Professional Finish<\/h3>\n    <span class=\"brackets-divider\" aria-hidden=\"true\"><\/span>\n    <p class=\"brackets-text\">\n      Ensures a clean, professional fit from the start.\n    <\/p>\n  <\/div>\n<\/div>\n\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 11: Dead-Front & Swing-Out Panels ========== -->\n<section class=\"swing-section\">\n  <div class=\"swing-inner\">\n    <h2 class=\"swing-title\">Custom Dead-Front &<br><span>Swing-Out Panels<\/span><\/h2>\n\n    <div class=\"swing-video-wrap\" id=\"swingVideoFrame\">\n      <video id=\"swingVideo\" muted playsinline preload=\"metadata\">\n        <source src=\"https:\/\/exmweb.b-cdn.net\/Swing-out%2BZOOM_2_lq.mp4\" type=\"video\/mp4\" \/>\n      <\/video>\n    <\/div>\n\n    <p class=\"swing-intro\">\n      Built to spec, our dead-front (swing-out) panels create a secure barrier between users and high-risk components,\n      allowing <strong>safe access to approved areas while restricting critical equipment to authorized personnel<\/strong>.\n      Options for lockable hardware, tailored layouts, and precise cutouts ensure compliance, improve efficiency, and\n      deliver a clean, professional finish\u2014straight from the factory.\n    <\/p>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 12: Door Stop & Gas Spring Additions ========== -->\n<section class=\"door-gas-section\">\n  <div class=\"door-gas-inner\">\n    <h2 class=\"door-gas-title\">Door Stop &amp; Gas Spring Additions<\/h2>\n\n    <!-- Row 1: Door stop (video left, copy right) -->\n    <div class=\"dg-row\">\n      <div class=\"dg-media\">\n        <div class=\"dg-frame\">\n          <video class=\"vp-video\" muted playsinline preload=\"metadata\">\n            <source src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/Door_Stop_lq.mp4\" type=\"video\/mp4\" \/>\n          <\/video>\n        <\/div>\n      <\/div>\n      <div class=\"dg-copy\">\n        <h3 class=\"dg-h3\">Door stop<\/h3>\n        <p class=\"dg-p\">\n          Built for reliability, this full stainless steel door kit includes a \u00bc-inch solid rod\n          to deliver exceptional durability and strength in demanding, heavy-duty environments.\n        <\/p>\n      <\/div>\n    <\/div>\n\n    <!-- Row 2: Gas springs (copy left, video right) -->\n    <div class=\"dg-row\">\n      <div class=\"dg-copy\">\n        <h3 class=\"dg-h3\">Gas springs<\/h3>\n        <p class=\"dg-p\">\n          Pre-installed gas springs are available in 25, 50, 80, and 125 lbf force options to provide smooth,\n          assisted opening and closing for doors, covers, and consoles. Different forces are selected based on the\n          weight and orientation of mounted accessories.\n        <\/p>\n      <\/div>\n      <div class=\"dg-media\">\n        <div class=\"dg-frame\">\n          <video class=\"vp-video\" muted playsinline preload=\"metadata\">\n            <source src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/Gas_Spring_lq.mp4\" type=\"video\/mp4\" \/>\n          <\/video>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <p class=\"dg-foot\">\n      Both options can be positioned to suit your specific enclosure design, improving operator safety, reducing wear\n      and tear, and extending the life of your enclosure. Factory integration ensures precise fit, consistent\n      performance, and eliminates the need for aftermarket modifications.\n    <\/p>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 13: Custom Drip Shields ========== -->\n<section class=\"drip-section\">\n  <div class=\"drip-inner\">\n    <h2 class=\"drip-title\">Custom Drip Shields<\/h2>\n\n    <div class=\"drip-image-wrap\">\n      <img decoding=\"async\"\n        src=\"https:\/\/exmweb.b-cdn.net\/DripShield.webp\"\n        alt=\"EXM custom drip shield installed on enclosure\"\n        class=\"drip-image\"\n        loading=\"lazy\"\n      \/>\n    <\/div>\n\n    <p class=\"drip-intro\">\n      Custom-made to fit your exact dimensions, our drip shields are the perfect solution to\n      safeguard your enclosure from environmental wear and water intrusion.\n    <\/p>\n\n    <div class=\"drip-grid\">\n      <div class=\"ds-item\">\n        <h3 class=\"ds-h3\">Superior Protection<\/h3>\n        <span class=\"ds-divider\" aria-hidden=\"true\"><\/span>\n        <p class=\"ds-p\">\n          These shields channel rain, snow, and condensation away from door openings, which helps\n          maintain electrical integrity and extends the life of your components.\n        <\/p>\n      <\/div>\n\n      <div class=\"ds-item\">\n        <h3 class=\"ds-h3\">Versatile Applications<\/h3>\n        <span class=\"ds-divider\" aria-hidden=\"true\"><\/span>\n        <p class=\"ds-p\">\n          Ideal for both indoor and outdoor use, including washdown areas, exposed installations,\n          and moisture-prone spaces.\n        <\/p>\n      <\/div>\n\n      <div class=\"ds-item\">\n        <h3 class=\"ds-h3\">Tailored to Your Needs<\/h3>\n        <span class=\"ds-divider\" aria-hidden=\"true\"><\/span>\n        <p class=\"ds-p\">\n          Available in a wide range of formats to meet your specific protection, durability, and\n          aesthetic requirements.\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 14: Pre-Installed Insulation ========== -->\n<section class=\"insul2-section\">\n  <div class=\"insul2-inner\">\n    <h2 class=\"insul2-title\">Pre-Installed Insulation<\/h2>\n\n    <!-- Video -->\n    <div class=\"insul2-video-wrap\" id=\"insul2Wrap\">\n      <video id=\"insul2Video\" muted playsinline preload=\"metadata\">\n        <source src=\"https:\/\/exmweb.b-cdn.net\/Compressed%20Vid%20for%20Custom%20Solutions%20Page\/Insulations_sm.mp4\" type=\"video\/mp4\" \/>\n      <\/video>\n    <\/div>\n\n    <p class=\"insul2-intro\">\n      Boost thermal efficiency and equipment protection with premium foil-faced polyisocyanurate insulation.\n    <\/p>\n\n    <!-- 3 feature columns -->\n    <div class=\"insul2-grid\">\n      <div class=\"insul2-card\">\n        <img decoding=\"async\" class=\"insul2-ico\" alt=\"High performance\"\n             src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-high-performance.webp\" \/>\n        <h3 class=\"insul2-h4\">High Performance<\/h3>\n        <p class=\"insul2-text\">\n          The rigid foam core provides a high R-value, helping maintain stable internal\n          temperatures and preventing condensation by reducing heat transfer.\n        <\/p>\n      <\/div>\n\n      <div class=\"insul2-card\">\n        <img decoding=\"async\" class=\"insul2-ico\" alt=\"Precision fit\"\n             src=\"https:\/\/exmweb.b-cdn.net\/Precision%20Fit.png\" \/>\n        <h3 class=\"insul2-h4\">Precision Fit<\/h3>\n        <p class=\"insul2-text\">\nOur insulation is factory-cut for precise, full coverage, eliminating on-site fitting challenges and saving you installation time.\n        <\/p>\n      <\/div>\n\n      <div class=\"insul2-card\">\n        <img decoding=\"async\" class=\"insul2-ico\" alt=\"Safety standards\"\n             src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/custom-parts-icon-versatile-apllications.webp\" \/>\n        <h3 class=\"insul2-h4\">Safety Standards<\/h3>\n        <p class=\"insul2-text\">\nIt meets key safety and performance standards, including ASTM E84 and CAN\/ULC-S102, for flame spread and smoke development, ensuring a professional and reliable finish.\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 15: Louver ========== -->\n<section class=\"louver-section\">\n  <div class=\"louver-inner\">\n    <h2 class=\"louver-title\">Louver<\/h2>\n\n    <div class=\"louver-flex\">\n      <!-- Left: Image + caption -->\n      <figure class=\"louver-media\">\n        <img decoding=\"async\"\n          src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/09\/Louver.webp\"\n          alt=\"Louvered panel\"\n          class=\"louver-img\"\n          loading=\"lazy\"\n        \/>\n        <figcaption class=\"louver-caption\">\n          Custom louver patterns can be integrated directly into cabinets or onto mountable plates, with optional\n          aluminum mesh filters for added protection. Designed to combine airflow efficiency with a clean, functional\n          aesthetic, they\u2019re available with weather-resistant, sound-dampening, and finish customization options.\n        <\/figcaption>\n      <\/figure>\n\n      <!-- Right: Video -->\n      <div class=\"louver-media\" id=\"louverWrap\">\n        <video id=\"louverVideo\" muted playsinline preload=\"metadata\" class=\"louver-video\">\n          <source src=\"https:\/\/exmweb.b-cdn.net\/louver_sm.mp4\" type=\"video\/mp4\" \/>\n        <\/video>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== SECTION 16: Partition Panel ========== -->\n<section class=\"partition-section\">\n  <div class=\"partition-inner\">\n    <h2 class=\"partition-title\">Partition Panel<\/h2>\n\n    <div class=\"partition-flex\">\n      <!-- LEFT: copy + bullets -->\n      <div class=\"partition-copy\">\n        <p class=\"partition-intro\">\n          Internal partitions create independent compartments within the enclosure, improving\n          organization and safety. Commonly used to separate high and low voltage components,\n          they eliminate the need to combine multiple enclosures while maintaining clear\n          segregation.\n        <\/p>\n\n        <ul class=\"partition-list\">\n          <li class=\"partition-item\">\n            <img decoding=\"async\" class=\"partition-ico\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/11\/Simplifies-wiring-layouts.png\" alt=\"\" \/>\n            <span class=\"partition-head\">Simplifies wiring layouts<\/span>\n          <\/li>\n          <li class=\"partition-item\">\n            <img decoding=\"async\" class=\"partition-ico\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/11\/Reduces-installation-time.png\" alt=\"\" \/>\n            <span class=\"partition-head\">Reduces installation time<\/span>\n          <\/li>\n          <li class=\"partition-item\">\n            <img decoding=\"async\" class=\"partition-ico\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/11\/Enhances-accessibility.png\" alt=\"\" \/>\n            <span class=\"partition-head\">Enhances accessibility<\/span>\n          <\/li>\n          <li class=\"partition-item\">\n            <img decoding=\"async\" class=\"partition-ico\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/11\/Enhances-thermal-management.png\" alt=\"\" \/>\n            <span class=\"partition-head\">Enhances thermal management<\/span>\n          <\/li>\n        <\/ul>\n      <\/div>\n\n      <!-- RIGHT: video -->\n      <div class=\"partition-media\">\n        <div class=\"partition-video-wrap taller\" id=\"partitionVideoWrap\">\n          <video id=\"partitionVideo\" muted playsinline preload=\"metadata\">\n            <source src=\"https:\/\/exmweb.b-cdn.net\/PartitionPanel_sm.mp4\" type=\"video\/mp4\" \/>\n          <\/video>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========== Last SECTION: Configurator Ticker ========== -->\n<div class=\"ticker\">\n  <div class=\"ticker-viewport\">\n    <div class=\"ticker-track\">\n      <span class=\"ticker-text\">DISCOVER OUR CONFIGURATOR<\/span>\n      <img decoding=\"async\" class=\"ticker-logo\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/07\/BOXCAD-logo_two-sec_white-scaled.png\" alt=\"BOXCAD\" \/>\n    <\/div>\n    <!-- Clone for seamless loop -->\n    <div class=\"ticker-track\" aria-hidden=\"true\">\n      <span class=\"ticker-text\">DISCOVER OUR CONFIGURATOR<\/span>\n      <img decoding=\"async\" class=\"ticker-logo\" src=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/07\/BOXCAD-logo_two-sec_white-scaled.png\" alt=\"\" \/>\n    <\/div>\n  <\/div>\n<\/div>\n\n\n<script>\n\/**\n * Generic viewport-controlled video helper.\n * - Plays when in view (>= threshold)\n * - Optionally freezes on last frame\n * - Optionally plays only once\n * - Optionally toggles a `playing` class on a frame wrapper\n *\/\n(function () {\n  function setupViewportVideo(options) {\n    const {\n      video,\n      wrapper = null,\n      frame = null,\n      threshold = 0.5,\n      freezeLastFrame = true,\n      playOnce = true,\n    } = options || {};\n\n    if (!video) return;\n    const target = wrapper || video;\n\n    video.loop = false;\n    video.muted = true;\n    video.playsInline = true;\n\n    let locked = false;\n\n    const io = new IntersectionObserver(\n      (entries) => {\n        const entry = entries[0];\n        if (!entry) return;\n\n        \/\/ If we've locked and only play once, do nothing.\n        if (playOnce && locked) return;\n\n        if (\n          entry.isIntersecting &&\n          entry.intersectionRatio >= threshold &&\n          !video.ended &&\n          !(playOnce && locked)\n        ) {\n          const p = video.play();\n          if (p && typeof p.catch === \"function\") p.catch(() => {});\n          if (frame) frame.classList.add(\"playing\");\n        } else {\n          if (!video.paused && !(playOnce && locked && video.ended)) {\n            video.pause();\n          }\n          if (frame) frame.classList.remove(\"playing\");\n        }\n      },\n      { threshold: [0, threshold, 1] }\n    );\n\n    io.observe(target);\n\n    function lockLastFrame() {\n      if (locked) return;\n      locked = true;\n\n      try {\n        video.pause();\n        if (freezeLastFrame && isFinite(video.duration) && video.duration > 0) {\n          \/\/ Snap just before the end to avoid black frame on some browsers\n          video.currentTime = Math.max(0, video.duration - 0.05);\n        }\n      } catch (e) {}\n\n      if (frame) frame.classList.remove(\"playing\");\n      if (playOnce) io.disconnect();\n    }\n\n    \/\/ Only attach if we care about locking\/freeze\n    if (freezeLastFrame || playOnce) {\n      video.addEventListener(\"ended\", lockLastFrame);\n      video.addEventListener(\"timeupdate\", () => {\n        if (locked) return;\n        if (video.duration && video.duration - video.currentTime < 0.08) {\n          lockLastFrame();\n        }\n      });\n    }\n\n    return { lockLastFrame, observer: io };\n  }\n\n  \/* ============================\n     1) Dimension video (Section 2)\n     ============================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"dimensionVideo\"),\n    wrapper: document.getElementById(\"dimensionVideoWrap\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ===================================\n     2) Certified Custom Windows video\n     =================================== *\/\n  setupViewportVideo({\n    video: document.getElementById(\"windowsVideo\"),\n    wrapper: document.getElementById(\"windowsVideoFrame\"),\n    frame: document.getElementById(\"windowsVideoFrame\"),\n    \/\/ Original behavior: play once, NO forced seek to last frame\n    freezeLastFrame: false,\n    playOnce: true,\n  });\n\n  \/* ============================\n     3) Custom Inner Panels video\n     ============================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"innerPanelsVideo\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ============================\n     4) Gland Plates video\n     ============================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"glandVideo\"),\n    wrapper: document.getElementById(\"glandVideoFrame\"),\n    frame: document.getElementById(\"glandVideoFrame\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ============================\n     5) Welded Brackets video\n     ============================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"bracketsVideo\"),\n    wrapper: document.getElementById(\"bracketsVideoFrame\"),\n    frame: document.getElementById(\"bracketsVideoFrame\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ========================================\n     6) Dead-Front & Swing-Out Panels video\n     ======================================== *\/\n  setupViewportVideo({\n    video: document.getElementById(\"swingVideo\"),\n    wrapper: document.getElementById(\"swingVideoFrame\"),\n    frame: document.getElementById(\"swingVideoFrame\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ====================================\n     7) Door Stop & Gas Springs videos\n        (class=\"vp-video\" inside .dg-frame)\n     ==================================== *\/\n  document.querySelectorAll(\".vp-video\").forEach((v) => {\n    const frame = v.closest(\".dg-frame\") || null;\n    setupViewportVideo({\n      video: v,\n      wrapper: frame || v,\n      frame,\n      freezeLastFrame: true,\n      playOnce: true,\n    });\n  });\n\n  \/* ================================\n     8) Insulation video (insul2Wrap)\n     ================================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"insul2Video\"),\n    wrapper: document.getElementById(\"insul2Wrap\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ============================\n     9) Louver video (right column)\n     ============================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"louverVideo\"),\n    wrapper: document.getElementById(\"louverWrap\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n\n  \/* ============================\n     10) Partition Panel video\n     ============================ *\/\n  setupViewportVideo({\n    video: document.getElementById(\"partitionVideo\"),\n    wrapper: document.getElementById(\"partitionVideoWrap\"),\n    frame: document.getElementById(\"partitionVideoWrap\"),\n    freezeLastFrame: true,\n    playOnce: true,\n  });\n})();\n<\/script>\n\n<script>\n\/* ===============================\n   Custom Colour & Textures logic\n   =============================== *\/\n(function () {\n  const wrapper = document.getElementById(\"colorPreview\");\n  const video = document.getElementById(\"customOptionsVideo\");\n  const finishedClass = \"finished\";\n\n  if (!wrapper || !video) return;\n\n  video.muted = true;\n  video.playsInline = true;\n\n  let hasFinished = false;\n\n  \/\/ Viewport play\/pause just for this video\n  const io = new IntersectionObserver(\n    (entries) => {\n      const entry = entries[0];\n      if (!entry) return;\n      if (hasFinished) return;\n\n      if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {\n        const p = video.play();\n        if (p && typeof p.catch === \"function\") p.catch(() => {});\n      } else {\n        if (!video.paused) video.pause();\n      }\n    },\n    { threshold: [0, 0.5, 1] }\n  );\n\n  io.observe(wrapper);\n\n  video.addEventListener(\"ended\", () => {\n    hasFinished = true;\n    wrapper.classList.add(finishedClass);\n    try {\n      video.pause();\n    } catch (e) {}\n  });\n\n  video.addEventListener(\"timeupdate\", () => {\n    if (hasFinished) return;\n    const nearEnd =\n      video.duration && video.duration - video.currentTime < 0.15;\n    if (nearEnd) {\n      hasFinished = true;\n      wrapper.classList.add(finishedClass);\n      try {\n        video.pause();\n      } catch (e) {}\n    }\n  });\n\n  const finalFrame = wrapper.querySelector(\".final-frame\");\n\n  \/\/ Lock aspect ratio\n  video.addEventListener(\"loadedmetadata\", () => {\n    if (video.videoWidth && video.videoHeight) {\n      wrapper.style.aspectRatio = `${video.videoWidth} \/ ${video.videoHeight}`;\n    }\n  });\n\n  if (finalFrame) {\n    finalFrame.addEventListener(\"load\", () => {\n      if (\n        !wrapper.style.aspectRatio &&\n        finalFrame.naturalWidth &&\n        finalFrame.naturalHeight\n      ) {\n        wrapper.style.aspectRatio = `${finalFrame.naturalWidth} \/ ${finalFrame.naturalHeight}`;\n      }\n    });\n  }\n\n  if (!wrapper.style.aspectRatio) {\n    wrapper.style.aspectRatio = \"16 \/ 9\";\n  }\n\n  \/* ============ MATERIAL \/ TEXTURE \/ COLOR STATE ============ *\/\n  const materialEls = document.querySelectorAll(\n    \".material-stack .material-layer\"\n  );\n  const textureEls = document.querySelectorAll(\".texture-row .texture-item\");\n  const colorEls = document.querySelectorAll(\n    \".color-swatches-row .paint-color-block\"\n  );\n\n  if (!finalFrame || !materialEls.length || !textureEls.length || !colorEls.length)\n    return;\n\n  const materialKeys = [\"mild\", \"stainless\", \"aluminum\", \"brushed\"];\n  const textureKeys = [\"smooth\", \"light\", \"sand\"];\n\n  materialEls.forEach((el, idx) => {\n    el.dataset.materialKey = materialKeys[idx] || \"mat-\" + idx;\n  });\n\n  textureEls.forEach((el, idx) => {\n    el.dataset.textureKey = textureKeys[idx] || \"tex-\" + idx;\n  });\n\n  colorEls.forEach((el, idx) => {\n    el.dataset.colorIndex = String(idx + 1); \/\/ 1..19\n  });\n\n  const state = {\n    material: null,\n    texture: null,\n    colorIndex: null,\n  };\n\n  materialEls.forEach((el) => {\n    el.addEventListener(\"click\", () => {\n      const key = el.dataset.materialKey;\n      if (!key) return;\n\n      state.material = key;\n\n      materialEls.forEach((m) => m.classList.remove(\"is-active\"));\n      el.classList.add(\"is-active\");\n\n      updatePreviewImage();\n    });\n  });\n\n  textureEls.forEach((el) => {\n    el.addEventListener(\"click\", () => {\n      const key = el.dataset.textureKey;\n      if (!key) return;\n\n      state.texture = key;\n\n      textureEls.forEach((t) => t.classList.remove(\"is-active\"));\n      el.classList.add(\"is-active\");\n\n      updatePreviewImage();\n    });\n  });\n\n  colorEls.forEach((el) => {\n    el.addEventListener(\"click\", () => {\n      const idx = parseInt(el.dataset.colorIndex || \"1\", 10);\n      if (Number.isNaN(idx)) return;\n\n      state.colorIndex = idx;\n\n      \/\/ \u274c removed .is-active toggling on colours to avoid layout overlap\n      \/\/ colorEls.forEach((c) => c.classList.remove(\"is-active\"));\n      \/\/ el.classList.add(\"is-active\");\n\n      updatePreviewImage();\n    });\n  });\n\n  function buildPaintedImageUrl(materialKey, textureKey, colorIndex) {\n    let folderName = \"\";\n    let prefix = \"\";\n\n    if (textureKey === \"smooth\") {\n      folderName = \"Smooth\";\n      prefix = \"Smooth\";\n    } else if (textureKey === \"light\") {\n      folderName = \"Regular\";\n      prefix = \"textured\";\n    } else if (textureKey === \"sand\") {\n      folderName = \"SandTex\";\n      prefix = \"SandTex\";\n    }\n\n    if (!folderName || !prefix) return finalFrame.src;\n\n    return `https:\/\/exmweb.b-cdn.net\/${folderName}\/${prefix}_${colorIndex}.webp`;\n  }\n\n  function updatePreviewImage() {\n    if (!state.material) return;\n\n    let src = \"\";\n\n    \/\/ Only BRUSHED is a fixed image\n    if (state.material === \"brushed\") {\n      src = \"https:\/\/exmweb.b-cdn.net\/brushedSteel%20(1).webp\";\n    } else {\n      \/\/ Mild, Painted Stainless AND Painted Aluminum use textures + colours\n      if (!state.texture || !state.colorIndex) return;\n      src = buildPaintedImageUrl(state.material, state.texture, state.colorIndex);\n    }\n\n    if (!src) return;\n\n    if (finalFrame.src !== src) {\n      finalFrame.src = src;\n    }\n\n    wrapper.classList.add(finishedClass);\n    hasFinished = true;\n    try {\n      video.pause();\n    } catch (e) {}\n  }\n\n  \/* ============ Magnifying lens ============ *\/\n  if (wrapper && finalFrame) {\n    if (!wrapper.style.overflow) {\n      wrapper.style.overflow = \"hidden\";\n    }\n\n    const lens = document.createElement(\"div\");\n    lens.className = \"color-preview-lens\";\n    wrapper.appendChild(lens);\n\n    const ZOOM = 3.2;\n\n    function handleEnter() {\n      if (!wrapper.classList.contains(finishedClass)) return;\n\n      wrapper.style.cursor = \"none\";\n      lens.style.backgroundImage = `url(\"${finalFrame.src}\")`;\n      lens.style.opacity = \"1\";\n    }\n\n    function handleMove(e) {\n      if (!wrapper.classList.contains(finishedClass)) return;\n\n      const rect = wrapper.getBoundingClientRect();\n      const x = e.clientX - rect.left;\n      const y = e.clientY - rect.top;\n\n      lens.style.left = `${x}px`;\n      lens.style.top = `${y}px`;\n\n      const lensW = lens.offsetWidth || 140;\n      const lensH = lens.offsetHeight || 140;\n\n      const bgW = rect.width * ZOOM;\n      const bgH = rect.height * ZOOM;\n\n      lens.style.backgroundSize = `${bgW}px ${bgH}px`;\n\n      const bgPosX = -(x * ZOOM - lensW \/ 2);\n      const bgPosY = -(y * ZOOM - lensH \/ 2);\n\n      lens.style.backgroundPosition = `${bgPosX}px ${bgPosY}px`;\n    }\n\n    function handleLeave() {\n      if (!wrapper.classList.contains(finishedClass)) return;\n      lens.style.opacity = \"0\";\n      wrapper.style.cursor = \"\";\n    }\n\n    wrapper.addEventListener(\"mouseenter\", handleEnter);\n    wrapper.addEventListener(\"mousemove\", handleMove);\n    wrapper.addEventListener(\"mouseleave\", handleLeave);\n  }\n})();\n<\/script>\n\n\n<script>\n\/* ============================\n   Custom Cutouts Tabs (HMI\/PB\/Cabling)\n   ============================ *\/\n(function () {\n  const preview = document.getElementById(\"cutoutsPreview\");\n  const desc = document.getElementById(\"cutoutsDesc\");\n  const tabs = document.querySelectorAll(\n    \"#custom-cutouts .cutout-tab\"\n  );\n\n  if (!preview || !tabs.length) return;\n\n  const preloaded = new Map();\n\n  tabs.forEach((tab) => {\n    const url = tab.dataset.img;\n    if (url && !preloaded.has(url)) {\n      const im = new Image();\n      im.decoding = \"async\";\n      im.referrerPolicy = \"no-referrer-when-downgrade\";\n      im.onload = () => preloaded.set(url, im);\n      im.onerror = () => preloaded.set(url, null);\n      im.src = url;\n    }\n  });\n\n  const active = document.querySelector(\n    \"#custom-cutouts .cutout-tab[aria-selected='true']\"\n  );\n  if (active) {\n    preview.src = active.dataset.img || preview.src;\n    preview.alt = active.dataset.alt || preview.alt || \"Cutout preview\";\n    if (active.dataset.desc) desc.innerHTML = active.dataset.desc;\n  }\n\n  function activateTab(tab) {\n    tabs.forEach((t) => t.setAttribute(\"aria-selected\", \"false\"));\n    tab.setAttribute(\"aria-selected\", \"true\");\n\n    const src = tab.dataset.img;\n    const alt = tab.dataset.alt || \"Cutout preview\";\n\n    if (src) {\n      const cached = preloaded.get(src);\n      if (cached && cached.complete) {\n        preview.src = cached.src;\n      } else {\n        preview.src = src;\n      }\n      preview.alt = alt;\n    }\n\n    if (tab.dataset.desc && desc) desc.innerHTML = tab.dataset.desc;\n  }\n\n  tabs.forEach((tab) => {\n    tab.addEventListener(\"click\", () => activateTab(tab));\n\n    tab.addEventListener(\"keydown\", (e) => {\n      if (e.key !== \"ArrowRight\" && e.key !== \"ArrowLeft\") return;\n      const arr = Array.from(tabs);\n      const i = arr.indexOf(tab);\n      const next =\n        e.key === \"ArrowRight\"\n          ? arr[(i + 1) % arr.length]\n          : arr[(i - 1 + arr.length) % arr.length];\n      next.focus();\n      activateTab(next);\n    });\n  });\n\n  if (active) activateTab(active);\n})();\n<\/script>\n\n<script>\n\/* =======================================\n   Fasteners tabs (Self-clinching \/ Rivet \/ Studs)\n   ======================================= *\/\n(function initFastenerTabs() {\n  const section = document.getElementById(\"factory-fasteners\");\n  if (!section) return;\n\n  const preview = section.querySelector(\"#fastenersPreview\");\n  const desc = section.querySelector(\"#fastenersDesc\");\n  const tabs = Array.from(section.querySelectorAll(\".cutout-tab\"));\n\n  if (!preview || !tabs.length) return;\n\n  const cache = new Map();\n\n  tabs.forEach((tab) => {\n    const src = tab.dataset.img;\n    if (!src || cache.has(src)) return;\n    const img = new Image();\n    img.decoding = \"async\";\n    img.loading = \"eager\";\n    img.src = src;\n    img.addEventListener(\"load\", () => cache.set(src, img));\n    img.addEventListener(\"error\", () => {});\n  });\n\n  const active =\n    tabs.find((t) => t.getAttribute(\"aria-selected\") === \"true\") || tabs[0];\n  if (active) active.setAttribute(\"aria-selected\", \"true\");\n\n  function swapTo(tab) {\n    tabs.forEach((t) => t.setAttribute(\"aria-selected\", \"false\"));\n    tab.setAttribute(\"aria-selected\", \"true\");\n\n    const src = tab.dataset.img;\n    const alt = tab.dataset.alt || \"Fastener preview\";\n\n    if (desc && tab.dataset.desc) {\n      desc.innerHTML = tab.dataset.desc;\n    }\n\n    if (!src) return;\n\n    const cached = cache.get(src);\n    if (cached && cached.complete) {\n      preview.src = src;\n      preview.alt = alt;\n      return;\n    }\n\n    const img = new Image();\n    img.decoding = \"async\";\n    img.loading = \"eager\";\n    img.src = src;\n    img.addEventListener(\n      \"load\",\n      () => {\n        cache.set(src, img);\n        preview.src = src;\n        preview.alt = alt;\n      },\n      { once: true }\n    );\n  }\n\n  tabs.forEach((tab) => {\n    tab.addEventListener(\"click\", () => swapTo(tab));\n    tab.addEventListener(\"keydown\", (e) => {\n      if (e.key !== \"ArrowRight\" && e.key !== \"ArrowLeft\") return;\n      const i = tabs.indexOf(tab);\n      const next =\n        e.key === \"ArrowRight\"\n          ? tabs[(i + 1) % tabs.length]\n          : tabs[(i - 1 + tabs.length) % tabs.length];\n      next.focus();\n      swapTo(next);\n    });\n  });\n\n  if (active) swapTo(active);\n})();\n<\/script>\n\n<script>\n    \/\/ \ud83d\udd27 Speed up image loading in \"Custom Colour & Textures\" section\n(function warmUpCustomColorImages() {\n  function run() {\n    const section = document.getElementById('custom-color');\n    if (!section || section.dataset.ccImgsWarm === '1') return;\n\n    \/\/ Prevent double-run\n    section.dataset.ccImgsWarm = '1';\n\n    const imgs = Array.from(section.querySelectorAll('img'));\n\n    imgs.forEach(img => {\n      try {\n        \/\/ 1) If a lazy-load plugin stored the real URL in data-src, promote it\n        if (img.dataset.src && (!img.src || img.src.startsWith('data:'))) {\n          img.src = img.dataset.src;\n        }\n\n        \/\/ 2) Disable lazy loading for these important visuals\n        if (img.loading === 'lazy') {\n          img.loading = 'eager';\n        }\n\n        \/\/ 3) Give the browser a hint that these are important\n        img.setAttribute('fetchpriority', 'high');\n\n        const src = img.currentSrc || img.src;\n        if (!src) return;\n\n        \/\/ 4) Manually warm them into cache\n        const preloader = new Image();\n        preloader.src = src;\n\n        \/\/ 5) Decode early so they\u2019re ready to paint\n        if (typeof img.decode === 'function') {\n          img.decode().catch(() => {});\n        }\n      } catch (e) {\n        \/\/ Fail silently - don't break the page\n      }\n    });\n  }\n\n  \/\/ Run when DOM is ready\n  if (document.readyState === 'loading') {\n    document.addEventListener('DOMContentLoaded', run);\n  } else {\n    run();\n  }\n\n  \/\/ Safety: run once more after full load (in case section is injected late)\n  window.addEventListener('load', run);\n})();\n\n<\/script>\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>CUSTOMSOLUTIONS From concept to completion, flexible solutions tailored to your exact needs. Discover Custom Dimension RANGE OF FORMATS Each standard enclosure type supports full dimensional customization across height, width, and depth. PRECISION FIT Engineered to match the exact space requirements of each design, minimizing footprint and unused volume. CONSISTENT MOUNTING GEOMETRY Maintain uniform hinge, panel, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":364964,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"rs_blank_template":"","rs_page_bg_color":"","slide_template_v7":"","footnotes":""},"class_list":["post-363880","page","type-page","status-publish","has-post-thumbnail","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Custom Solutions - EXM Manufacturing<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/exmweb.com\/fr-ca\/custom-solutions\/\" \/>\n<meta property=\"og:locale\" content=\"fr_CA\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Custom Solutions by EXM Manufacturing\" \/>\n<meta property=\"og:description\" content=\"CUSTOMSOLUTIONS From concept to completion, flexible solutions tailored to your exact needs. Discover Custom Dimension RANGE OF FORMATS Each standard enclosure type supports full dimensional customization across height, width, and depth. PRECISION FIT Engineered to match the exact space requirements of each design, minimizing footprint and unused volume. CONSISTENT MOUNTING GEOMETRY Maintain uniform hinge, panel, [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/exmweb.com\/fr-ca\/custom-solutions\/\" \/>\n<meta property=\"og:site_name\" content=\"EXM Manufacturing\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-28T13:49:24+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/12\/custom-solutions-cover-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1000\" \/>\n\t<meta property=\"og:image:height\" content=\"1000\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Estimation du temps de lecture\" \/>\n\t<meta name=\"twitter:data1\" content=\"14 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/\",\"url\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/\",\"name\":\"Custom Solutions - EXM Manufacturing\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/exmweb.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/exmweb.com\\\/wp-content\\\/uploads\\\/2025\\\/12\\\/custom-solutions-cover-1.png\",\"datePublished\":\"2025-09-03T15:42:29+00:00\",\"dateModified\":\"2026-01-28T13:49:24+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/#breadcrumb\"},\"inLanguage\":\"fr-CA\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-CA\",\"@id\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/#primaryimage\",\"url\":\"https:\\\/\\\/exmweb.com\\\/wp-content\\\/uploads\\\/2025\\\/12\\\/custom-solutions-cover-1.png\",\"contentUrl\":\"https:\\\/\\\/exmweb.com\\\/wp-content\\\/uploads\\\/2025\\\/12\\\/custom-solutions-cover-1.png\",\"width\":1000,\"height\":1000},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/exmweb.com\\\/custom-solutions\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/exmweb.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Custom Solutions\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/exmweb.com\\\/#website\",\"url\":\"https:\\\/\\\/exmweb.com\\\/\",\"name\":\"EXM Manufacturing\",\"description\":\"EXM Manufacturing - Custom Enclosure\",\"publisher\":{\"@id\":\"https:\\\/\\\/exmweb.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/exmweb.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-CA\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/exmweb.com\\\/#organization\",\"name\":\"EXM Manufacturing LTD\",\"url\":\"https:\\\/\\\/exmweb.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-CA\",\"@id\":\"https:\\\/\\\/exmweb.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/exmweb.com\\\/wp-content\\\/uploads\\\/2024\\\/07\\\/logo-150x150-1.png\",\"contentUrl\":\"https:\\\/\\\/exmweb.com\\\/wp-content\\\/uploads\\\/2024\\\/07\\\/logo-150x150-1.png\",\"width\":150,\"height\":150,\"caption\":\"EXM Manufacturing LTD\"},\"image\":{\"@id\":\"https:\\\/\\\/exmweb.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/ca.linkedin.com\\\/company\\\/exm-manufacturing\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Custom Solutions - EXM Manufacturing","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/exmweb.com\/fr-ca\/custom-solutions\/","og_locale":"fr_CA","og_type":"article","og_title":"Custom Solutions by EXM Manufacturing","og_description":"CUSTOMSOLUTIONS From concept to completion, flexible solutions tailored to your exact needs. Discover Custom Dimension RANGE OF FORMATS Each standard enclosure type supports full dimensional customization across height, width, and depth. PRECISION FIT Engineered to match the exact space requirements of each design, minimizing footprint and unused volume. CONSISTENT MOUNTING GEOMETRY Maintain uniform hinge, panel, [&hellip;]","og_url":"https:\/\/exmweb.com\/fr-ca\/custom-solutions\/","og_site_name":"EXM Manufacturing","article_modified_time":"2026-01-28T13:49:24+00:00","og_image":[{"width":1000,"height":1000,"url":"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/12\/custom-solutions-cover-1.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Estimation du temps de lecture":"14 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/exmweb.com\/custom-solutions\/","url":"https:\/\/exmweb.com\/custom-solutions\/","name":"Custom Solutions - EXM Manufacturing","isPartOf":{"@id":"https:\/\/exmweb.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/exmweb.com\/custom-solutions\/#primaryimage"},"image":{"@id":"https:\/\/exmweb.com\/custom-solutions\/#primaryimage"},"thumbnailUrl":"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/12\/custom-solutions-cover-1.png","datePublished":"2025-09-03T15:42:29+00:00","dateModified":"2026-01-28T13:49:24+00:00","breadcrumb":{"@id":"https:\/\/exmweb.com\/custom-solutions\/#breadcrumb"},"inLanguage":"fr-CA","potentialAction":[{"@type":"ReadAction","target":["https:\/\/exmweb.com\/custom-solutions\/"]}]},{"@type":"ImageObject","inLanguage":"fr-CA","@id":"https:\/\/exmweb.com\/custom-solutions\/#primaryimage","url":"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/12\/custom-solutions-cover-1.png","contentUrl":"https:\/\/exmweb.com\/wp-content\/uploads\/2025\/12\/custom-solutions-cover-1.png","width":1000,"height":1000},{"@type":"BreadcrumbList","@id":"https:\/\/exmweb.com\/custom-solutions\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/exmweb.com\/"},{"@type":"ListItem","position":2,"name":"Custom Solutions"}]},{"@type":"WebSite","@id":"https:\/\/exmweb.com\/#website","url":"https:\/\/exmweb.com\/","name":"EXM Manufacturing","description":"EXM Manufacturing - Custom Enclosure","publisher":{"@id":"https:\/\/exmweb.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/exmweb.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-CA"},{"@type":"Organization","@id":"https:\/\/exmweb.com\/#organization","name":"EXM Manufacturing LTD","url":"https:\/\/exmweb.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-CA","@id":"https:\/\/exmweb.com\/#\/schema\/logo\/image\/","url":"https:\/\/exmweb.com\/wp-content\/uploads\/2024\/07\/logo-150x150-1.png","contentUrl":"https:\/\/exmweb.com\/wp-content\/uploads\/2024\/07\/logo-150x150-1.png","width":150,"height":150,"caption":"EXM Manufacturing LTD"},"image":{"@id":"https:\/\/exmweb.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/ca.linkedin.com\/company\/exm-manufacturing"]}]}},"_links":{"self":[{"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/pages\/363880","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/comments?post=363880"}],"version-history":[{"count":987,"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/pages\/363880\/revisions"}],"predecessor-version":[{"id":364993,"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/pages\/363880\/revisions\/364993"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/media\/364964"}],"wp:attachment":[{"href":"https:\/\/exmweb.com\/fr-ca\/wp-json\/wp\/v2\/media?parent=363880"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}