{"id":10252,"date":"2026-07-16T03:21:25","date_gmt":"2026-07-16T03:21:25","guid":{"rendered":"https:\/\/signature4.com\/?page_id=10252"},"modified":"2026-07-21T18:12:04","modified_gmt":"2026-07-21T18:12:04","slug":"knobs-handles","status":"publish","type":"page","link":"https:\/\/signature4.com\/4appliance\/knobs-handles\/","title":{"rendered":"Knobs &#038; Handles"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"10252\" class=\"elementor elementor-10252\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-5b3879a elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"5b3879a\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2bfb1188\" data-id=\"2bfb1188\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-4d8caa5d elementor-widget elementor-widget-html\" data-id=\"4d8caa5d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style id=\"s4-tokens\">\n:root {\n  --ink-pure:   #000000;\n  --ink-950:    #0c0c0c;\n  --ink-900:    #141414;\n  --ink-850:    #1c1c1c;\n  --ink-800:    #242424;\n  --ink-700:    #2e2e2e;\n  --ink-600:    #3a3a3a;\n\n  --paper-pure: #ffffff;\n  --paper-warm: #edede5;\n  --paper-warm-2:#e3e2d8;\n\n  --signal:        #e9e037;\n  --signal-bright: #f4ec55;\n  --signal-deep:   #cfc62c;\n  --signal-glow:   rgba(233, 224, 55, 0.28);\n\n  --fire:      #d9381e;\n  --appliance: #c9ccd2;\n\n  --text-primary:   #ffffff;\n  --text-secondary: rgba(255, 255, 255, 0.66);\n  --text-muted:     rgba(255, 255, 255, 0.45);\n  --text-faint:     rgba(255, 255, 255, 0.30);\n\n  --text-ink:        #1c1c1c;\n  --text-ink-soft:   rgba(28, 28, 28, 0.64);\n  --text-ink-muted:  rgba(28, 28, 28, 0.42);\n\n  --text-on-signal:  #161616;\n\n  --stroke-on-dark:   rgba(255, 255, 255, 0.14);\n  --stroke-on-dark-2: rgba(255, 255, 255, 0.08);\n  --stroke-on-light:  rgba(28, 28, 28, 0.16);\n  --stroke-signal:    var(--signal);\n\n  --bg-page:        var(--ink-pure);\n  --bg-surface:     var(--ink-850);\n  --bg-elevated:    var(--ink-800);\n  --bg-heritage:    var(--paper-warm);\n  --accent:         var(--signal);\n  --accent-contrast:var(--text-on-signal);\n  --divider:        var(--ink-600);\n\n  --font-sans:      \"Inter Tight\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  --font-signature: \"Allura\", \"Snell Roundhand\", cursive;\n\n  --fw-light:  300;\n  --fw-regular:400;\n  --fw-medium: 500;\n  --fw-semi:   600;\n  --fw-bold:   700;\n\n  --fs-display: clamp(3rem, 1.6rem + 5.6vw, 6rem);\n  --fs-h1:      clamp(2.4rem, 1.4rem + 3.6vw, 4rem);\n  --fs-h2:      clamp(1.9rem, 1.3rem + 2.4vw, 3rem);\n  --fs-h3:      clamp(1.4rem, 1.05rem + 1.3vw, 2rem);\n  --fs-h4:      clamp(1.15rem, 0.95rem + 0.7vw, 1.45rem);\n\n  --fs-lead:    clamp(1.05rem, 0.95rem + 0.5vw, 1.3rem);\n  --fs-body:    1.0625rem;\n  --fs-sm:      0.9375rem;\n  --fs-xs:      0.8125rem;\n\n  --fs-eyebrow: 0.75rem;\n  --fs-stat:    clamp(2.6rem, 1.6rem + 3.4vw, 4.25rem);\n\n  --lh-tight:  1.04;\n  --lh-snug:   1.18;\n  --lh-normal: 1.5;\n  --lh-loose:  1.65;\n\n  --ls-display:  -0.022em;\n  --ls-heading:  -0.015em;\n  --ls-body:      0em;\n  --ls-eyebrow:   0.22em;\n  --ls-ticker:    0.16em;\n\n  --space-0:  0;\n  --space-1:  0.25rem;\n  --space-2:  0.5rem;\n  --space-3:  0.75rem;\n  --space-4:  1rem;\n  --space-5:  1.5rem;\n  --space-6:  2rem;\n  --space-7:  3rem;\n  --space-8:  4rem;\n  --space-9:  6rem;\n  --space-10: 8rem;\n  --space-11: 11rem;\n\n  --section-y:    clamp(4rem, 2rem + 8vw, 9rem);\n  --section-y-lg: clamp(6rem, 3rem + 10vw, 11rem);\n\n  --container:      1280px;\n  --container-wide: 1480px;\n  --measure:        62ch;\n  --gutter:         clamp(1.25rem, 0.5rem + 3vw, 3rem);\n\n  --radius-pill: 999px;\n  --radius-0:    0px;\n  --radius-sm:   4px;\n  --radius-md:   8px;\n  --radius-lg:   14px;\n\n  --border-hair: 1px;\n  --border-cta:  1.5px;\n\n  --shadow-sm:  0 1px 2px rgba(0,0,0,0.40);\n  --shadow-md:  0 8px 24px rgba(0,0,0,0.45);\n  --shadow-lg:  0 24px 60px rgba(0,0,0,0.55);\n  --shadow-card:0 30px 80px rgba(0,0,0,0.60);\n\n  --focus-ring: 0 0 0 3px var(--signal-glow);\n\n  --scrim-bottom: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.55) 28%, rgba(0,0,0,0) 62%);\n  --scrim-full:   linear-gradient(to top, rgba(0,0,0,0.80) 0%, rgba(0,0,0,0.30) 50%, rgba(0,0,0,0.55) 100%);\n  --scrim-left:   linear-gradient(to right, rgba(0,0,0,0.80) 0%, rgba(0,0,0,0.30) 45%, rgba(0,0,0,0) 75%);\n\n  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1);\n  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);\n  --dur-fast:   140ms;\n  --dur-base:   240ms;\n  --dur-slow:   520ms;\n  --transition: all var(--dur-base) var(--ease-out);\n}\n\n@font-face { font-family:'Inter Tight'; font-style:normal; font-weight:300 700; font-display:swap;\n  src:url('_ds\/signature-4-design-system-42e36a41-d32e-45ae-996d-7bc5aa70a85b\/assets\/fonts\/intertight-latin.woff2') format('woff2');\n  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }\n@font-face { font-family:'Inter Tight'; font-style:normal; font-weight:300 700; font-display:swap;\n  src:url('_ds\/signature-4-design-system-42e36a41-d32e-45ae-996d-7bc5aa70a85b\/assets\/fonts\/intertight-latinext.woff2') format('woff2');\n  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }\n@font-face { font-family:'Inter Tight'; font-style:italic; font-weight:300 700; font-display:swap;\n  src:url('_ds\/signature-4-design-system-42e36a41-d32e-45ae-996d-7bc5aa70a85b\/assets\/fonts\/intertight-italic-latin.woff2') format('woff2');\n  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }\n@font-face { font-family:'Inter Tight'; font-style:italic; font-weight:300 700; font-display:swap;\n  src:url('_ds\/signature-4-design-system-42e36a41-d32e-45ae-996d-7bc5aa70a85b\/assets\/fonts\/intertight-italic-latinext.woff2') format('woff2');\n  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }\n@font-face { font-family:'Allura'; font-style:normal; font-weight:400; font-display:swap;\n  src:url('_ds\/signature-4-design-system-42e36a41-d32e-45ae-996d-7bc5aa70a85b\/assets\/fonts\/allura-latin.woff2') format('woff2');\n  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }\n@font-face { font-family:'Allura'; font-style:normal; font-weight:400; font-display:swap;\n  src:url('_ds\/signature-4-design-system-42e36a41-d32e-45ae-996d-7bc5aa70a85b\/assets\/fonts\/allura-latinext.woff2') format('woff2');\n  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }\n\n*, *::before, *::after { box-sizing: border-box; }\n.s4-page { font-family: var(--font-sans); background: var(--ink-pure); color: var(--text-primary); overflow-x: hidden; }\n.s4-page img { display: block; max-width: 100%; }\n.s4-page a { color: inherit; }\n\n.k-eyebrow { font-family: var(--font-sans); font-size: var(--fs-eyebrow); font-weight: var(--fw-medium);\n  letter-spacing: var(--ls-eyebrow); text-transform: uppercase; margin: 0 0 var(--space-5); color: var(--text-secondary); }\n.k-display { font-family: var(--font-sans); font-size: var(--fs-display); font-weight: var(--fw-regular); line-height: var(--lh-tight);\n  letter-spacing: var(--ls-display); margin: 0; }\n.k-h1 { font-family: var(--font-sans); font-size: var(--fs-h1); font-weight: var(--fw-regular); line-height: var(--lh-tight);\n  letter-spacing: var(--ls-display); margin: 0; }\n.k-h2 { font-family: var(--font-sans); font-size: var(--fs-h2); font-weight: var(--fw-regular); line-height: var(--lh-snug);\n  letter-spacing: var(--ls-heading); margin: 0; }\n.k-h3 { font-family: var(--font-sans); font-size: var(--fs-h3); font-weight: var(--fw-medium); line-height: var(--lh-snug);\n  letter-spacing: var(--ls-heading); margin: 0; }\n.k-h4 { font-family: var(--font-sans); font-size: var(--fs-h4); font-weight: var(--fw-regular); line-height: var(--lh-snug);\n  letter-spacing: var(--ls-heading); margin: 0; }\n.k-lead { font-family: var(--font-sans); font-size: var(--fs-lead); line-height: var(--lh-normal); color: var(--text-secondary); margin: 0; }\n.k-body { font-family: var(--font-sans); font-size: var(--fs-body); line-height: var(--lh-normal); color: var(--text-secondary); }\n.k-marker { background: var(--signal); color: var(--text-on-signal); padding: 0.02em 0.2em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }\n\n.k-btn { font-family: var(--font-sans); font-weight: var(--fw-medium); letter-spacing: -0.01em; line-height: 1;\n  border-radius: var(--radius-pill); border: var(--border-cta) solid transparent; cursor: pointer;\n  display: inline-flex; align-items: center; gap: 0.5rem; transition: var(--transition); text-decoration: none; white-space: nowrap; }\n.k-btn-sm { padding: 0.5rem 1.1rem; font-size: 0.875rem; }\n.k-btn-md { padding: 0.75rem 1.6rem; font-size: 1rem; }\n.k-btn-lg { padding: 1rem 2.1rem; font-size: 1.0625rem; }\n.k-btn-primary { background: var(--signal); color: var(--text-on-signal); }\n.k-btn-primary:hover { background: var(--signal-bright); transform: translateY(-1px); }\n.k-btn-primary:active { background: var(--signal-deep); transform: translateY(0); }\n.k-btn-ghost { background: transparent; color: var(--signal); border-color: var(--signal); }\n.k-btn-ghost:hover { background: rgba(233,224,55,0.1); }\n.k-btn-dark { background: var(--ink-800); color: #fff; border-color: var(--stroke-on-dark); }\n.k-btn-dark:hover { background: var(--ink-700); }\n.k-btn-ar { color: var(--signal); }\n.k-btn-primary .k-btn-ar { color: inherit; }\n.k-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }\n\n.k-alink { font-family: var(--font-sans); font-weight: var(--fw-medium); letter-spacing: -0.01em; text-decoration: none;\n  display: inline-flex; align-items: center; gap: 0.4em; transition: var(--transition); white-space: nowrap; }\n.k-alink-light { color: var(--text-primary); }\n.k-alink-signal { color: var(--signal); }\n.k-alink-md { font-size: 1.0625rem; } .k-alink-sm { font-size: 0.9375rem; } .k-alink-lg { font-size: 1.375rem; }\n.k-ar { color: var(--signal); font-size: 0.9em; transition: transform var(--dur-base) var(--ease-out); }\n.k-alink:hover .k-ar { transform: translate(3px,-3px); }\n\n.k-badge { display: inline-flex; align-items: center; gap: 0.4em; font-family: var(--font-sans); font-size: var(--fs-xs); font-weight: var(--fw-medium);\n  letter-spacing: 0.04em; line-height: 1; padding: 0.4rem 0.85rem; border-radius: var(--radius-pill); border: 1px solid transparent; }\n.k-badge-solid { background: var(--signal); color: var(--text-on-signal); }\n.k-badge-outline { background: transparent; color: var(--signal); border-color: var(--signal); }\n.k-badge-quiet { background: var(--ink-800); color: var(--text-secondary); border-color: var(--stroke-on-dark); }\n\n.k-ph { position: relative; overflow: hidden; background: repeating-linear-gradient(135deg, #262626 0 14px, #1e1e1e 14px 28px); }\n.k-ph-light { background: repeating-linear-gradient(135deg, #dedcd2 0 14px, #e7e5db 14px 28px); }\n.k-ph-metal { background: linear-gradient(115deg, #1a1a1a 0%, #4a4a4d 38%, #6c6c70 50%, #3a3a3c 64%, #141414 100%); }\n.k-ph-label { position: absolute; top: 12px; left: 14px; font-family: ui-monospace, Menlo, monospace;\n  font-size: 11px; letter-spacing: 0.04em; color: var(--text-muted); }\n.k-ph-light .k-ph-label { color: var(--text-ink-muted); }\n\n.k-section { position: relative; }\n.k-bg-page { background: var(--ink-pure); color: var(--text-primary); }\n.k-bg-surface { background: var(--ink-850); color: var(--text-primary); }\n.k-bg-heritage { background: var(--paper-warm); color: var(--text-ink); }\n.k-bg-heritage em { color: var(--text-ink); }\n.k-pad-lg { padding-top: var(--section-y-lg); padding-bottom: var(--section-y-lg); }\n.k-pad-md { padding-top: var(--section-y); padding-bottom: var(--section-y); }\n.k-pad-sm { padding-top: var(--space-8); padding-bottom: var(--space-8); }\n.k-container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); width: 100%; }\n.k-section em { font-style: italic; color: var(--text-primary); }\n\n.k-reveal { opacity: 1; }\n@media (prefers-reduced-motion: no-preference) {\n  .k-reveal.is-in { animation: k-rise 0.6s var(--ease-out) both; }\n}\n@keyframes k-rise { from { transform: translateY(18px); } to { transform: none; } }\n\n.k-ticker { overflow: hidden; border-top: 1px solid var(--stroke-on-dark-2); border-bottom: 1px solid var(--stroke-on-dark-2);\n  padding: 0.95rem 0; white-space: nowrap; background: var(--ink-pure); }\n.k-ticker-track { display: inline-flex; align-items: center; gap: 1.4rem; animation: k-tick linear infinite; }\n.k-ti { font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: var(--fw-medium); letter-spacing: var(--ls-ticker); text-transform: uppercase; color: var(--signal); }\n.k-bu { color: var(--signal); opacity: 0.45; }\n@keyframes k-tick { from { transform: translateX(0); } to { transform: translateX(-50%); } }\n@media (prefers-reduced-motion: reduce) { .k-ticker-track { animation: none; } }\n\n.products-menu { transition: opacity .24s cubic-bezier(0.22,1,0.36,1), transform .24s cubic-bezier(0.22,1,0.36,1), visibility .24s; }\n.products-nav:hover .products-menu, .products-nav:focus-within .products-menu { opacity:1 !important; visibility:visible !important; pointer-events:auto !important; transform:translateX(-50%) translateY(0) !important; }\n.products-nav:hover .pm-caret { transform: rotate(180deg); }\n<\/style>\n\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4ebf7496 elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"4ebf7496\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1860f59f\" data-id=\"1860f59f\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-53cc579f elementor-widget elementor-widget-html\" data-id=\"53cc579f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<header style=\"position:relative; display:grid; grid-template-columns:1fr 1fr; min-height:62vh; background:#000; isolation:isolate;\">\n  <div style=\"display:flex; flex-direction:column; justify-content:center; padding:clamp(2.5rem,5vw,4.5rem) clamp(2rem,4vw,3.5rem) clamp(2.5rem,5vw,4.5rem) clamp(1.5rem,4.5vw,5.5rem);\">\n    <p class=\"k-eyebrow k-reveal\" style=\"color:var(--signal);\"><a href=\"4appliance-home\/#products\" style=\"color:var(--text-muted); text-decoration:none;\">Products<\/a> &nbsp;\/&nbsp; Knobs &amp; Handles<\/p>\n    <h1 class=\"k-display k-reveal\" style=\"font-size:var(--fs-h1); max-width:14ch;\">Knobs &amp; <span style=\"font-style:italic; color:var(--signal);\">Handles<\/span><\/h1>\n    <p class=\"k-lead k-reveal\" style=\"margin-top:var(--space-5); max-width:44ch;\">The parts your customer reaches for first. We diecast, overmold, decorate, and finish control knobs and handles that feel substantial and hold their look for the life of the appliance.<\/p>\n    <div class=\"k-reveal\" style=\"margin-top:var(--space-7); display:flex; gap:var(--space-4); flex-wrap:wrap; align-items:center;\">\n      <button type=\"button\" class=\"k-btn k-btn-primary k-btn-lg kh-open-quote\">Get a Quote<\/button>\n      <a href=\"#variants\" class=\"k-btn k-btn-ghost k-btn-lg\">See the Range<span class=\"k-btn-ar\">\u2192<\/span><\/a>\n    <\/div>\n  <\/div>\n  <div style=\"position:relative; overflow:hidden; min-height:300px;\">\n    <img decoding=\"async\" src=\"https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/knobs-and-handles-hero.jpg\" alt=\"Brass control knobs and bar pull handles on a stainless range in a modern kitchen\" style=\"position:absolute; inset:0; width:100%; height:100%; object-fit:cover;\">\n  <\/div>\n<\/header>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1efd0f9f elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"1efd0f9f\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-232219ea\" data-id=\"232219ea\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5e8a4194 elementor-widget elementor-widget-html\" data-id=\"5e8a4194\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<section style=\"padding-top: var(--section-y); padding-bottom: var(--section-y); background-color: var(--ink-850)\">\n  <div class=\"k-container\" style=\"display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(2rem,5vw,5rem); align-items:center;\">\n    <div class=\"k-reveal\">\n      <p class=\"k-eyebrow\" style=\"color:var(--signal);\">Why It Matters<\/p>\n      <h2 class=\"k-h2\" style=\"max-width:15ch;\">Heft, grip, and a finish that <span style=\"font-style:italic; color:var(--signal);\">lasts<\/span><\/h2>\n      <p class=\"k-lead\" style=\"margin-top:var(--space-5); max-width:46ch;\">A knob is the one part of an appliance a customer touches every day. We engineer the weight, the rotational feel, and the decorative finish as one system \u2014 so it reads premium out of the box and stays that way for years.<\/p>\n      <ul style=\"list-style:none; margin:var(--space-7) 0 0; padding:0;\">\n          <li style=\"font-size:var(--fs-body); color:var(--text-secondary); padding:.85rem 0 .85rem 1.4rem; border-top:1px solid var(--stroke-on-dark); position:relative;\"><span style=\"position:absolute; left:0; color:var(--signal);\">\u2013<\/span>Weighted diecast cores for a premium, substantial feel<\/li>\n          <li style=\"font-size:var(--fs-body); color:var(--text-secondary); padding:.85rem 0 .85rem 1.4rem; border-top:1px solid var(--stroke-on-dark); position:relative;\"><span style=\"position:absolute; left:0; color:var(--signal);\">\u2013<\/span>Cool-touch overmolds that stay comfortable next to heat<\/li>\n          <li style=\"font-size:var(--fs-body); color:var(--text-secondary); padding:.85rem 0 .85rem 1.4rem; border-top:1px solid var(--stroke-on-dark); position:relative;\"><span style=\"position:absolute; left:0; color:var(--signal);\">\u2013<\/span>Decorative finishes color-matched and held run to run<\/li>\n      <\/ul>\n    <\/div>\n    <div class=\"k-reveal\" style=\"position:relative; aspect-ratio:4\/5; overflow:hidden; isolation:isolate;\">\n      <img decoding=\"async\" src=\"https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/cool-touch-overmold-grip.jpg\" alt=\"Cool-touch overmold grip with knurled brass bezel\" style=\"position:absolute; inset:0; width:100%; height:100%; object-fit:cover;\">\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-7a568407 elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"7a568407\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-44edc232\" data-id=\"44edc232\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2333ff4e elementor-widget elementor-widget-html\" data-id=\"2333ff4e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<section id=\"variants\" style=\"padding-top: var(--section-y); padding-bottom: var(--section-y); background-color: var(--ink-950)\">\n  <div class=\"k-container\">\n    <div style=\"display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; margin-bottom:var(--space-8);\">\n      <div class=\"k-reveal\" style=\"max-width:46ch;\">\n        <p class=\"k-eyebrow\" style=\"color:var(--signal);\">The Range<\/p>\n        <h2 class=\"k-h2\" style=\"width: 537px; height: 108px\">One process, every style of knob &amp; handle<\/h2>\n      <\/div>\n      <div class=\"k-reveal\" style=\"display:flex; gap:.6rem;\">\n        <button type=\"button\" id=\"kh-range-prev\" aria-label=\"Previous\" style=\"width:46px; height:46px; border-radius:999px; border:1px solid var(--stroke-on-dark); background:transparent; color:var(--signal); font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center;\">\u2190<\/button>\n        <button type=\"button\" id=\"kh-range-next\" aria-label=\"Next\" style=\"width:46px; height:46px; border-radius:999px; border:1px solid var(--stroke-on-dark); background:transparent; color:var(--signal); font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center;\">\u2192<\/button>\n      <\/div>\n    <\/div>\n    <div id=\"range-gallery\" class=\"line-gallery\" style=\"display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); padding-left:max(var(--gutter), calc((100vw - var(--container)) \/ 2 + var(--gutter))); padding-right:25vw; scroll-padding-left:max(var(--gutter), calc((100vw - var(--container)) \/ 2 + var(--gutter)));\">\n        <article class=\"k-reveal range-tile\" style=\"position:relative; overflow:hidden; aspect-ratio:4\/5; width:clamp(360px,42vw,500px); flex:none; scroll-snap-align:start; display:flex; align-items:flex-end; isolation:isolate;\">\n          <div class=\"k-ph k-ph-metal\" style=\"position:absolute; inset:0; z-index:-3;\"><span class=\"k-ph-label\">rotary control knob<\/span><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-2; background-image:url(https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/control-knobs.jpg); background-size:cover; background-position:center;\"><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-1; background:var(--scrim-bottom);\"><\/div>\n          <div style=\"width:100%; padding:clamp(1.6rem,2.4vw,2.2rem);\">\n            <h3 style=\"margin:0; font-size:var(--fs-h3); font-weight:var(--fw-medium); letter-spacing:-0.015em; line-height:1.05; color:#fff;\">Control Knobs<\/h3>\n            <p style=\"font-size:var(--fs-body); color:rgba(255,255,255,0.76); margin:.5rem 0 0; max-width:34ch;\">Rotary knobs with defined detents and a balanced turn.<\/p>\n          <\/div>\n        <\/article>\n        <article class=\"k-reveal range-tile\" style=\"position:relative; overflow:hidden; aspect-ratio:4\/5; width:clamp(360px,42vw,500px); flex:none; scroll-snap-align:start; display:flex; align-items:flex-end; isolation:isolate;\">\n          <div class=\"k-ph\" style=\"position:absolute; inset:0; z-index:-3;\"><span class=\"k-ph-label\">cool-touch overmold knob<\/span><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-2; background-image:url(https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/cool-touch-knob-1.jpg); background-size:cover; background-position:center;\"><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-1; background:var(--scrim-bottom);\"><\/div>\n          <div style=\"width:100%; padding:clamp(1.6rem,2.4vw,2.2rem);\">\n            <h3 style=\"margin:0; font-size:var(--fs-h3); font-weight:var(--fw-medium); letter-spacing:-0.015em; line-height:1.05; color:#fff;\">Cool-Touch Knobs<\/h3>\n            <p style=\"font-size:var(--fs-body); color:rgba(255,255,255,0.76); margin:.5rem 0 0; max-width:34ch;\">Overmolded grips that stay comfortable beside heat.<\/p>\n          <\/div>\n        <\/article>\n        <article class=\"k-reveal range-tile\" style=\"position:relative; overflow:hidden; aspect-ratio:4\/5; width:clamp(360px,42vw,500px); flex:none; scroll-snap-align:start; display:flex; align-items:flex-end; isolation:isolate;\">\n          <div class=\"k-ph k-ph-metal\" style=\"position:absolute; inset:0; z-index:-3;\"><span class=\"k-ph-label\">LED indicator knob<\/span><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-2; background-image:url(https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/led-indicator-knobs.jpg); background-size:cover; background-position:center;\"><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-1; background:var(--scrim-bottom);\"><\/div>\n          <div style=\"width:100%; padding:clamp(1.6rem,2.4vw,2.2rem);\">\n            <h3 style=\"margin:0; font-size:var(--fs-h3); font-weight:var(--fw-medium); letter-spacing:-0.015em; line-height:1.05; color:#fff;\">LED \/ Indicator Knobs<\/h3>\n            <p style=\"font-size:var(--fs-body); color:rgba(255,255,255,0.76); margin:.5rem 0 0; max-width:34ch;\">Integrated light pipes for backlit status and setting.<\/p>\n          <\/div>\n        <\/article>\n        <article class=\"k-reveal range-tile\" style=\"position:relative; overflow:hidden; aspect-ratio:4\/5; width:clamp(360px,42vw,500px); flex:none; scroll-snap-align:start; display:flex; align-items:flex-end; isolation:isolate;\">\n          <div class=\"k-ph\" style=\"position:absolute; inset:0; z-index:-3;\"><span class=\"k-ph-label\">bar pull handle<\/span><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-2; background-image:url(https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/handles.jpg); background-size:cover; background-position:center;\"><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-1; background:var(--scrim-bottom);\"><\/div>\n          <div style=\"width:100%; padding:clamp(1.6rem,2.4vw,2.2rem);\">\n            <h3 style=\"margin:0; font-size:var(--fs-h3); font-weight:var(--fw-medium); letter-spacing:-0.015em; line-height:1.05; color:#fff;\">Bar & Pull Handles<\/h3>\n            <p style=\"font-size:var(--fs-body); color:rgba(255,255,255,0.76); margin:.5rem 0 0; max-width:34ch;\">Knurled or smooth bars with diecast endcaps.<\/p>\n          <\/div>\n        <\/article>\n        <article class=\"k-reveal range-tile\" style=\"position:relative; overflow:hidden; aspect-ratio:4\/5; width:clamp(360px,42vw,500px); flex:none; scroll-snap-align:start; display:flex; align-items:flex-end; isolation:isolate;\">\n          <div class=\"k-ph k-ph-metal\" style=\"position:absolute; inset:0; z-index:-3;\"><span class=\"k-ph-label\">interchangeable-core knob<\/span><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-2; background-image:url(https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/interchangeable-core-knobs.jpg); background-size:cover; background-position:center;\"><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-1; background:var(--scrim-bottom);\"><\/div>\n          <div style=\"width:100%; padding:clamp(1.6rem,2.4vw,2.2rem);\">\n            <h3 style=\"margin:0; font-size:var(--fs-h3); font-weight:var(--fw-medium); letter-spacing:-0.015em; line-height:1.05; color:#fff;\">Interchangeable-Core Knobs<\/h3>\n            <p style=\"font-size:var(--fs-body); color:rgba(255,255,255,0.76); margin:.5rem 0 0; max-width:34ch;\">One body, swappable cores for multiple SKUs.<\/p>\n          <\/div>\n        <\/article>\n        <article class=\"k-reveal range-tile\" style=\"position:relative; overflow:hidden; aspect-ratio:4\/5; width:clamp(360px,42vw,500px); flex:none; scroll-snap-align:start; display:flex; align-items:flex-end; isolation:isolate;\">\n          <div class=\"k-ph\" style=\"position:absolute; inset:0; z-index:-3;\"><span class=\"k-ph-label\">weighted knob detail<\/span><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-2; background-image:url(https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/weighted-knobs.jpg); background-size:cover; background-position:center;\"><\/div>\n          <div style=\"position:absolute; inset:0; z-index:-1; background:var(--scrim-bottom);\"><\/div>\n          <div style=\"width:100%; padding:clamp(1.6rem,2.4vw,2.2rem);\">\n            <h3 style=\"margin:0; font-size:var(--fs-h3); font-weight:var(--fw-medium); letter-spacing:-0.015em; line-height:1.05; color:#fff;\">Weighted Knobs<\/h3>\n            <p style=\"font-size:var(--fs-body); color:rgba(255,255,255,0.76); margin:.5rem 0 0; max-width:34ch;\">Added mass for the heft customers read as quality.<\/p>\n          <\/div>\n        <\/article>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-228c521 elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"228c521\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-a4508b4\" data-id=\"a4508b4\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5fea13df elementor-widget elementor-widget-html\" data-id=\"5fea13df\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<section style=\"padding-top: var(--section-y); padding-bottom: var(--section-y); background-color: var(--ink-pure)\">\n  <div class=\"k-container\" style=\"display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:center;\">\n    <div class=\"k-reveal\" style=\"position:relative; min-height:560px; overflow:hidden; isolation:isolate; order:2;\">\n      <img decoding=\"async\" src=\"https:\/\/signature4.com\/wp-content\/uploads\/2026\/07\/exploded-view-knob.jpg\" alt=\"Exploded view of a control knob \u2014 index core, knurled bezel, brushed cap, and lit light pipe\" style=\"position:absolute; inset:0; width:100%; height:100%; object-fit:cover;\">\n    <\/div>\n    <div class=\"k-reveal\" style=\"order:1;\">\n      <p class=\"k-eyebrow\" style=\"color:var(--signal);\">How It's Built<\/p>\n      <h2 class=\"k-h2\" style=\"max-width:none; white-space:nowrap;\">Engineered layer by <span style=\"font-style:italic; color:var(--signal);\">layer<\/span><\/h2>\n      <p class=\"k-lead\" style=\"margin-top:var(--space-5); max-width:44ch;\">Every knob is a small assembly. We combine diecast, injection molding, decoration, and finishing in-house \u2014 so the layers are designed to work together, not sourced and hoped for.<\/p>\n      <ol style=\"list-style:none; margin:var(--space-7) 0 0; padding:0; counter-reset:layer;\">\n          <li style=\"display:flex; gap:1.1rem; padding:1rem 0; border-top:1px solid var(--stroke-on-dark);\">\n            <span style=\"flex:none; font-size:var(--fs-sm); font-weight:var(--fw-medium); color:var(--signal); width:1.5rem;\">01<\/span>\n            <span>\n              <span style=\"display:block; font-size:var(--fs-body); color:var(--text-primary);\">Diecast zinc core<\/span>\n              <span style=\"display:block; font-size:var(--fs-sm); color:var(--text-muted); margin-top:.2rem;\">Provides weight, rigidity, and a precise drive interface.<\/span>\n            <\/span>\n          <\/li>\n          <li style=\"display:flex; gap:1.1rem; padding:1rem 0; border-top:1px solid var(--stroke-on-dark);\">\n            <span style=\"flex:none; font-size:var(--fs-sm); font-weight:var(--fw-medium); color:var(--signal); width:1.5rem;\">02<\/span>\n            <span>\n              <span style=\"display:block; font-size:var(--fs-body); color:var(--text-primary);\">Injection overmold<\/span>\n              <span style=\"display:block; font-size:var(--fs-sm); color:var(--text-muted); margin-top:.2rem;\">Cool-touch grip surface, optional in-mold knurl.<\/span>\n            <\/span>\n          <\/li>\n          <li style=\"display:flex; gap:1.1rem; padding:1rem 0; border-top:1px solid var(--stroke-on-dark);\">\n            <span style=\"flex:none; font-size:var(--fs-sm); font-weight:var(--fw-medium); color:var(--signal); width:1.5rem;\">03<\/span>\n            <span>\n              <span style=\"display:block; font-size:var(--fs-body); color:var(--text-primary);\">Decorative cap or face<\/span>\n              <span style=\"display:block; font-size:var(--fs-sm); color:var(--text-muted); margin-top:.2rem;\">Chrome, brushed, or painted \u2014 the surface the customer sees.<\/span>\n            <\/span>\n          <\/li>\n          <li style=\"display:flex; gap:1.1rem; padding:1rem 0; border-top:1px solid var(--stroke-on-dark);\">\n            <span style=\"flex:none; font-size:var(--fs-sm); font-weight:var(--fw-medium); color:var(--signal); width:1.5rem;\">04<\/span>\n            <span>\n              <span style=\"display:block; font-size:var(--fs-body); color:var(--text-primary);\">Light pipe & core<\/span>\n              <span style=\"display:block; font-size:var(--fs-sm); color:var(--text-muted); margin-top:.2rem;\">Optional backlit indication and interchangeable stem.<\/span>\n            <\/span>\n          <\/li>\n      <\/ol>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-79c02a94 elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"79c02a94\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-74677c63\" data-id=\"74677c63\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-53899b11 elementor-widget elementor-widget-html\" data-id=\"53899b11\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<section style=\"padding-top: var(--section-y); padding-bottom: var(--section-y); background-color: var(--ink-850)\">\n  <div class=\"k-container\">\n    <div class=\"k-reveal\" style=\"display:flex; flex-direction:column; align-items:center; text-align:center; gap:var(--space-4); margin-bottom:var(--space-8);\">\n      <div>\n        <p class=\"k-eyebrow\" style=\"color:var(--signal);\">Finishes &amp; Decoration<\/p>\n        <h2 class=\"k-h2\">The look is yours to spec<\/h2>\n      <\/div>\n      <p class=\"k-lead\" style=\"max-width:48ch; margin:0;\">Pick a finish, layer on decoration \u2014 every option is done in-house and held consistent run to run.<\/p>\n    <\/div>\n\n    <div style=\"display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(1.5rem,4vw,3rem); align-items:start;\">\n\n      <!-- PREVIEW -->\n      <div class=\"k-reveal\" style=\"position:sticky; top:88px;\">\n        <div style=\"position:relative; overflow:hidden; min-height:clamp(380px,44vw,540px); display:flex; align-items:center; justify-content:center; border:1px solid var(--stroke-on-dark-2); isolation:isolate;\">\n          <span style=\"position:absolute; inset:0; z-index:-3; background:radial-gradient(circle at 50% 38%, #2a2a2c, #161617 70%);\"><\/span>\n          <!-- knob -->\n          <span id=\"kh-preview-knob\" class=\"preview-knob\" style=\"position:relative; width:clamp(210px,28vw,320px); height:clamp(210px,28vw,320px); border-radius:999px; background:linear-gradient(135deg,#f4f6f8,#aeb4ba 45%,#dfe3e7 60%,#82888e); box-shadow:0 30px 70px rgba(0,0,0,0.6), inset 0 2px 6px rgba(255,255,255,0.4), inset 0 -12px 28px rgba(0,0,0,0.45); transition:background .52s cubic-bezier(0.22,1,0.36,1); display:flex; align-items:center; justify-content:center;\">\n            <!-- spinning rim: knurl texture + pointer -->\n            <span class=\"knob-spin\" style=\"position:absolute; inset:0; border-radius:999px; background:repeating-conic-gradient(from 0deg, rgba(0,0,0,0.22) 0deg 2.2deg, rgba(255,255,255,0.10) 2.2deg 4.4deg); -webkit-mask:radial-gradient(circle, transparent 60%, #000 61%, #000 92%, transparent 94%); mask:radial-gradient(circle, transparent 60%, #000 61%, #000 92%, transparent 94%);\">\n              <span style=\"position:absolute; top:7%; left:50%; transform:translateX(-50%); width:5%; height:16%; border-radius:999px; background:rgba(0,0,0,0.55);\"><\/span>\n            <\/span>\n            <!-- center cap -->\n            <span style=\"position:relative; z-index:1; width:42%; height:42%; border-radius:999px; background:radial-gradient(circle at 50% 35%, rgba(255,255,255,0.22), rgba(0,0,0,0.18) 70%); box-shadow:inset 0 1px 3px rgba(255,255,255,0.35), inset 0 -4px 10px rgba(0,0,0,0.4);\"><\/span>\n            <span id=\"kh-preview-lit\" style=\"display:none; position:absolute; z-index:2; top:11%; left:50%; transform:translateX(-50%); width:11%; height:20%; border-radius:999px; background:var(--signal); box-shadow:0 0 16px 4px var(--signal-glow);\"><\/span>\n          <\/span>\n          <span style=\"position:absolute; left:1.2rem; bottom:1.1rem; font-size:var(--fs-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted);\">Live preview \u00b7 hover to spin<\/span>\n        <\/div>\n        <div style=\"margin-top:var(--space-5);\">\n          <h3 id=\"kh-preview-title\" class=\"k-h3\" style=\"margin:0; transition:color .3s;\">Bright Chrome<\/h3>\n          <p id=\"kh-preview-desc\" style=\"font-size:var(--fs-sm); color:var(--text-muted); margin:.3rem 0 0;\">High-shine plated face<\/p>\n          <div style=\"margin-top:var(--space-4); min-height:1.6rem;\">\n            <span id=\"kh-applied-chips-has\" style=\"display:none; flex-wrap:wrap; gap:.4rem; align-items:center;\">\n              <span style=\"font-size:var(--fs-xs); letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted);\">+ Decoration:<\/span>\n              <span id=\"kh-applied-chip-list\" style=\"display:inline-flex; flex-wrap:wrap; gap:.4rem;\"><\/span>\n            <\/span>\n            <span id=\"kh-applied-chips-none\" style=\"display:inline; font-size:var(--fs-xs); color:var(--text-faint);\">Tap a decoration option to layer it on \u2192<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- CONTROLS -->\n      <div>\n        <p class=\"k-reveal\" style=\"font-size:var(--fs-eyebrow); letter-spacing:var(--ls-eyebrow); text-transform:uppercase; color:var(--text-muted); margin:0 0 var(--space-4);\">Finish \u2014 pick one<\/p>\n        <div class=\"k-reveal\" style=\"display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px;\">\n            <button type=\"button\" class=\"finish-tile kh-finish-tile\" data-index=\"0\" style=\"position:relative; overflow:hidden; min-height:118px; display:flex; align-items:flex-end; isolation:isolate; cursor:pointer; padding:0; font-family:var(--font-sans); border-radius:2px; transition:transform .24s cubic-bezier(0.22,1,0.36,1), box-shadow .24s, outline-color .18s; outline:2px solid var(--signal); outline-offset:-2px; box-shadow:0 10px 28px rgba(0,0,0,0.5);\">\n              <span style=\"position:absolute; inset:0; z-index:-2; background:linear-gradient(135deg,#f4f6f8,#aeb4ba 45%,#dfe3e7 60%,#82888e);\"><\/span>\n              <span style=\"position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.02) 58%);\"><\/span>\n              <span class=\"kh-finish-check\" style=\"position:absolute; top:.6rem; right:.6rem; width:22px; height:22px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); font-size:.7rem; display:flex; align-items:center; justify-content:center; line-height:1;\">\u2713<\/span>\n              <span style=\"padding:1rem 1.1rem; text-align:left;\">\n                <span style=\"display:block; font-size:var(--fs-sm); color:#fff;\">Bright Chrome<\/span>\n              <\/span>\n            <\/button>\n            <button type=\"button\" class=\"finish-tile kh-finish-tile\" data-index=\"1\" style=\"position:relative; overflow:hidden; min-height:118px; display:flex; align-items:flex-end; isolation:isolate; cursor:pointer; padding:0; font-family:var(--font-sans); border-radius:2px; transition:transform .24s cubic-bezier(0.22,1,0.36,1), box-shadow .24s, outline-color .18s; outline:2px solid transparent; outline-offset:-2px; box-shadow:0 1px 0 rgba(255,255,255,0.05);\">\n              <span style=\"position:absolute; inset:0; z-index:-2; background:linear-gradient(135deg,#d6d3cd,#b0aca5 50%,#cbc8c2);\"><\/span>\n              <span style=\"position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.02) 58%);\"><\/span>\n              <span class=\"kh-finish-check\" style=\"position:absolute; top:.6rem; right:.6rem; width:22px; height:22px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); font-size:.7rem; display:none; align-items:center; justify-content:center; line-height:1;\">\u2713<\/span>\n              <span style=\"padding:1rem 1.1rem; text-align:left;\">\n                <span style=\"display:block; font-size:var(--fs-sm); color:#fff;\">Brushed Nickel<\/span>\n              <\/span>\n            <\/button>\n            <button type=\"button\" class=\"finish-tile kh-finish-tile\" data-index=\"2\" style=\"position:relative; overflow:hidden; min-height:118px; display:flex; align-items:flex-end; isolation:isolate; cursor:pointer; padding:0; font-family:var(--font-sans); border-radius:2px; transition:transform .24s cubic-bezier(0.22,1,0.36,1), box-shadow .24s, outline-color .18s; outline:2px solid transparent; outline-offset:-2px; box-shadow:0 1px 0 rgba(255,255,255,0.05);\">\n              <span style=\"position:absolute; inset:0; z-index:-2; background:linear-gradient(135deg,#cfd2d6,#9a9ea3 50%,#bcc0c4);\"><\/span>\n              <span style=\"position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.02) 58%);\"><\/span>\n              <span class=\"kh-finish-check\" style=\"position:absolute; top:.6rem; right:.6rem; width:22px; height:22px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); font-size:.7rem; display:none; align-items:center; justify-content:center; line-height:1;\">\u2713<\/span>\n              <span style=\"padding:1rem 1.1rem; text-align:left;\">\n                <span style=\"display:block; font-size:var(--fs-sm); color:#fff;\">PVD Stainless<\/span>\n              <\/span>\n            <\/button>\n            <button type=\"button\" class=\"finish-tile kh-finish-tile\" data-index=\"3\" style=\"position:relative; overflow:hidden; min-height:118px; display:flex; align-items:flex-end; isolation:isolate; cursor:pointer; padding:0; font-family:var(--font-sans); border-radius:2px; transition:transform .24s cubic-bezier(0.22,1,0.36,1), box-shadow .24s, outline-color .18s; outline:2px solid transparent; outline-offset:-2px; box-shadow:0 1px 0 rgba(255,255,255,0.05);\">\n              <span style=\"position:absolute; inset:0; z-index:-2; background:linear-gradient(135deg,#3a3a3c,#18181a 55%,#2c2c2e);\"><\/span>\n              <span style=\"position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.02) 58%);\"><\/span>\n              <span class=\"kh-finish-check\" style=\"position:absolute; top:.6rem; right:.6rem; width:22px; height:22px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); font-size:.7rem; display:none; align-items:center; justify-content:center; line-height:1;\">\u2713<\/span>\n              <span style=\"padding:1rem 1.1rem; text-align:left;\">\n                <span style=\"display:block; font-size:var(--fs-sm); color:#fff;\">Matte Black<\/span>\n              <\/span>\n            <\/button>\n            <button type=\"button\" class=\"finish-tile kh-finish-tile\" data-index=\"4\" style=\"position:relative; overflow:hidden; min-height:118px; display:flex; align-items:flex-end; isolation:isolate; cursor:pointer; padding:0; font-family:var(--font-sans); border-radius:2px; transition:transform .24s cubic-bezier(0.22,1,0.36,1), box-shadow .24s, outline-color .18s; outline:2px solid transparent; outline-offset:-2px; box-shadow:0 1px 0 rgba(255,255,255,0.05);\">\n              <span style=\"position:absolute; inset:0; z-index:-2; background:linear-gradient(135deg,#e6c98a,#a07c3c 50%,#cda85e);\"><\/span>\n              <span style=\"position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.02) 58%);\"><\/span>\n              <span class=\"kh-finish-check\" style=\"position:absolute; top:.6rem; right:.6rem; width:22px; height:22px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); font-size:.7rem; display:none; align-items:center; justify-content:center; line-height:1;\">\u2713<\/span>\n              <span style=\"padding:1rem 1.1rem; text-align:left;\">\n                <span style=\"display:block; font-size:var(--fs-sm); color:#fff;\">Brass \/ Bronze<\/span>\n              <\/span>\n            <\/button>\n            <button type=\"button\" class=\"finish-tile kh-finish-tile\" data-index=\"5\" style=\"position:relative; overflow:hidden; min-height:118px; display:flex; align-items:flex-end; isolation:isolate; cursor:pointer; padding:0; font-family:var(--font-sans); border-radius:2px; transition:transform .24s cubic-bezier(0.22,1,0.36,1), box-shadow .24s, outline-color .18s; outline:2px solid transparent; outline-offset:-2px; box-shadow:0 1px 0 rgba(255,255,255,0.05);\">\n              <span style=\"position:absolute; inset:0; z-index:-2; background:linear-gradient(135deg,#e8eaec,#9aa0a6 50%,#c4c8cc);\"><\/span>\n              <span style=\"position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.02) 58%);\"><\/span>\n              <span class=\"kh-finish-check\" style=\"position:absolute; top:.6rem; right:.6rem; width:22px; height:22px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); font-size:.7rem; display:none; align-items:center; justify-content:center; line-height:1;\">\u2713<\/span>\n              <span style=\"padding:1rem 1.1rem; text-align:left;\">\n                <span style=\"display:block; font-size:var(--fs-sm); color:#fff;\">Backlit Indicator<\/span>\n              <\/span>\n            <\/button>\n        <\/div>\n\n        <p class=\"k-reveal\" style=\"font-size:var(--fs-eyebrow); letter-spacing:var(--ls-eyebrow); text-transform:uppercase; color:var(--text-muted); margin:var(--space-7) 0 var(--space-4);\">Decoration \u2014 add any<\/p>\n        <div class=\"k-reveal\" style=\"display:flex; flex-wrap:wrap; gap:.6rem;\">\n            <button type=\"button\" class=\"deco-chip kh-deco-chip\" data-index=\"0\" style=\"font-size:var(--fs-sm); font-family:var(--font-sans); cursor:pointer; border-radius:999px; padding:.5rem .95rem; transition:var(--transition); background:transparent; color:var(--text-secondary); border:1px solid var(--stroke-on-dark);\">In-mold knurling<\/button>\n            <button type=\"button\" class=\"deco-chip kh-deco-chip\" data-index=\"1\" style=\"font-size:var(--fs-sm); font-family:var(--font-sans); cursor:pointer; border-radius:999px; padding:.5rem .95rem; transition:var(--transition); background:transparent; color:var(--text-secondary); border:1px solid var(--stroke-on-dark);\">Rotational screenprint<\/button>\n            <button type=\"button\" class=\"deco-chip kh-deco-chip\" data-index=\"2\" style=\"font-size:var(--fs-sm); font-family:var(--font-sans); cursor:pointer; border-radius:999px; padding:.5rem .95rem; transition:var(--transition); background:transparent; color:var(--text-secondary); border:1px solid var(--stroke-on-dark);\">Paint-fill \/ colorfill<\/button>\n            <button type=\"button\" class=\"deco-chip kh-deco-chip\" data-index=\"3\" style=\"font-size:var(--fs-sm); font-family:var(--font-sans); cursor:pointer; border-radius:999px; padding:.5rem .95rem; transition:var(--transition); background:transparent; color:var(--text-secondary); border:1px solid var(--stroke-on-dark);\">Laser etch<\/button>\n            <button type=\"button\" class=\"deco-chip kh-deco-chip\" data-index=\"4\" style=\"font-size:var(--fs-sm); font-family:var(--font-sans); cursor:pointer; border-radius:999px; padding:.5rem .95rem; transition:var(--transition); background:transparent; color:var(--text-secondary); border:1px solid var(--stroke-on-dark);\">Custom branding<\/button>\n        <\/div>\n\n        <div class=\"k-reveal\" style=\"margin-top:var(--space-8); display:flex; align-items:center; gap:1rem; flex-wrap:wrap;\">\n          <button type=\"button\" class=\"k-btn k-btn-primary k-btn-md kh-open-quote\">Quote This Spec<\/button>\n          <button type=\"button\" id=\"kh-reset-spec\" style=\"background:none; border:none; color:var(--text-muted); font-size:var(--fs-sm); cursor:pointer; text-decoration:underline; text-underline-offset:3px;\">Reset<\/button>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1f5e465b elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"1f5e465b\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-5390e527\" data-id=\"5390e527\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-69e3511b elementor-widget elementor-widget-html\" data-id=\"69e3511b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<section style=\"background:var(--ink-950); padding-top:var(--space-9); padding-bottom:var(--space-9); border-top:1px solid var(--stroke-on-dark-2);\">\n  <div class=\"k-container\" style=\"display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;\">\n    <div>\n      <p class=\"k-eyebrow\" style=\"margin-bottom:.4rem;\">Next Product<\/p>\n      <a href=\"https:\/\/signature4.com\/4appliance\/logo-badges-nameplates\/\" class=\"k-alink k-alink-light k-alink-lg\">Logo Badges &amp; Nameplates<span class=\"k-ar\">\u2197<\/span><\/a>\n    <\/div>\n    <a href=\"4appliance-home\/#products\" class=\"k-alink k-alink-light k-alink-md\">View all products<span class=\"k-ar\">\u2197<\/span><\/a>\n  <\/div>\n<\/section>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-27dc7143 elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no\" data-id=\"27dc7143\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-521eb67a\" data-id=\"521eb67a\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5539a14d elementor-widget elementor-widget-html\" data-id=\"5539a14d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"s4-page\">\n<div id=\"kh-quote-modal\" onclick=\"if(event.target===this){this.style.display='none';}\" style=\"display:none; position:fixed; inset:0; z-index:100; background:rgba(0,0,0,0.7); backdrop-filter:blur(6px); align-items:center; justify-content:center; padding:var(--gutter);\">\n  <div style=\"width:100%; max-width:520px; background:var(--ink-850); border:1px solid var(--stroke-on-dark); border-radius:var(--radius-lg); padding:clamp(1.75rem,4vw,2.5rem); position:relative; margin:auto;\">\n    <button type=\"button\" class=\"kh-close-quote\" aria-label=\"Close\" style=\"position:absolute; top:1rem; right:1rem; background:none; border:none; color:var(--text-muted); font-size:1.4rem; cursor:pointer; line-height:1;\">\u00d7<\/button>\n    <div id=\"kh-quote-form-step\" style=\"display:block;\">\n      <p class=\"k-eyebrow\" style=\"color:var(--signal); text-align:left;\">Start a Project<\/p>\n      <h3 class=\"k-h3\" style=\"margin:0 0 .4rem;\">Tell us what you're making.<\/h3>\n      <p style=\"font-size:var(--fs-sm); color:var(--text-secondary); margin:0 0 var(--space-6);\">We move ideas <span style=\"font-style:italic; color:var(--signal);\">Fourward<\/span> \u2014 manufactured, finished, assembled.<\/p>\n      <div style=\"margin-bottom:var(--space-4);\">\n        <label style=\"display:block; font-size:var(--fs-xs); letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.4rem;\">Name<\/label>\n        <input id=\"kh-input-name\" placeholder=\"Jordan Maker\" style=\"width:100%; background:var(--ink-900); border:1px solid var(--stroke-on-dark); border-radius:var(--radius-sm); color:#fff; font-family:var(--font-sans); font-size:var(--fs-body); padding:.7rem .85rem;\">\n      <\/div>\n      <div style=\"margin-bottom:var(--space-4);\">\n        <label style=\"display:block; font-size:var(--fs-xs); letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.4rem;\">Company<\/label>\n        <input id=\"kh-input-company\" placeholder=\"Acme Appliance\" style=\"width:100%; background:var(--ink-900); border:1px solid var(--stroke-on-dark); border-radius:var(--radius-sm); color:#fff; font-family:var(--font-sans); font-size:var(--fs-body); padding:.7rem .85rem;\">\n      <\/div>\n      <div style=\"margin-bottom:var(--space-4);\">\n        <label style=\"display:block; font-size:var(--fs-xs); letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.4rem;\">Project details<\/label>\n        <textarea id=\"kh-input-details\" rows=\"3\" placeholder=\"Volumes, materials, finishes, timeline\u2026\" style=\"width:100%; background:var(--ink-900); border:1px solid var(--stroke-on-dark); border-radius:var(--radius-sm); color:#fff; font-family:var(--font-sans); font-size:var(--fs-body); padding:.7rem .85rem; resize:vertical;\"><\/textarea>\n      <\/div>\n      <div style=\"margin-top:var(--space-5); display:flex; gap:var(--space-3);\">\n        <button type=\"button\" id=\"kh-quote-submit\" class=\"k-btn k-btn-md k-btn-primary\" style=\"opacity:.5; cursor:not-allowed;\">Submit RFQ<\/button>\n        <button type=\"button\" class=\"kh-close-quote k-btn k-btn-md k-btn-dark\">Cancel<\/button>\n      <\/div>\n    <\/div>\n    <div id=\"kh-quote-sent-step\" style=\"display:none; text-align:center; padding:var(--space-6) 0;\">\n      <div style=\"width:56px; height:56px; border-radius:999px; background:var(--signal); color:var(--text-on-signal); display:flex; align-items:center; justify-content:center; font-size:1.7rem; margin:0 auto var(--space-4);\">\u2197<\/div>\n      <h3 class=\"k-h3\" style=\"margin:0 0 .4rem;\">Thanks, <span id=\"kh-sent-firstname\">there<\/span>.<\/h3>\n      <p style=\"font-size:var(--fs-sm); color:var(--text-secondary); margin:0 0 var(--space-6);\">A real human will be in touch about your knob &amp; handle project.<\/p>\n      <button type=\"button\" class=\"kh-close-quote k-btn k-btn-md k-btn-primary\">Done<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n<script>\n(function(){\n  var finishesData = [{\"t\":\"Bright Chrome\",\"d\":\"High-shine plated face\",\"swatch\":\"linear-gradient(135deg,#f4f6f8,#aeb4ba 45%,#dfe3e7 60%,#82888e)\",\"lit\":false},{\"t\":\"Brushed Nickel\",\"d\":\"Soft satin directional grain\",\"swatch\":\"linear-gradient(135deg,#d6d3cd,#b0aca5 50%,#cbc8c2)\",\"lit\":false},{\"t\":\"PVD Stainless\",\"d\":\"Matched to a stainless line\",\"swatch\":\"linear-gradient(135deg,#cfd2d6,#9a9ea3 50%,#bcc0c4)\",\"lit\":false},{\"t\":\"Matte Black\",\"d\":\"Painted or coated\",\"swatch\":\"linear-gradient(135deg,#3a3a3c,#18181a 55%,#2c2c2e)\",\"lit\":false},{\"t\":\"Brass \/ Bronze\",\"d\":\"Warm decorative plate\",\"swatch\":\"linear-gradient(135deg,#e6c98a,#a07c3c 50%,#cda85e)\",\"lit\":false},{\"t\":\"Backlit Indicator\",\"d\":\"Chrome face with a lit light pipe\",\"swatch\":\"linear-gradient(135deg,#e8eaec,#9aa0a6 50%,#c4c8cc)\",\"lit\":true}];\n  var decoData = [\"In-mold knurling\",\"Rotational screenprint\",\"Paint-fill \/ colorfill\",\"Laser etch\",\"Custom branding\"];\n  var state = { activeFinish: 0, applied: [] };\n\n  function renderPreview(){\n    var f = finishesData[state.activeFinish];\n    var knob = document.getElementById('kh-preview-knob');\n    if (knob) knob.style.background = f.swatch;\n    var lit = document.getElementById('kh-preview-lit');\n    if (lit) lit.style.display = f.lit ? 'block' : 'none';\n    var title = document.getElementById('kh-preview-title');\n    if (title) title.textContent = f.t;\n    var desc = document.getElementById('kh-preview-desc');\n    if (desc) desc.textContent = f.d;\n    renderApplied();\n  }\n\n  function renderApplied(){\n    var hasWrap = document.getElementById('kh-applied-chips-has');\n    var noneWrap = document.getElementById('kh-applied-chips-none');\n    var list = document.getElementById('kh-applied-chip-list');\n    if (state.applied.length > 0) {\n      if (hasWrap) hasWrap.style.display = 'inline-flex';\n      if (noneWrap) noneWrap.style.display = 'none';\n      if (list) {\n        list.innerHTML = '';\n        state.applied.forEach(function(i){\n          var span = document.createElement('span');\n          span.style.cssText = 'font-size:var(--fs-xs); color:var(--signal); border:1px solid var(--signal); border-radius:999px; padding:.2rem .6rem;';\n          span.textContent = decoData[i];\n          list.appendChild(span);\n        });\n      }\n    } else {\n      if (hasWrap) hasWrap.style.display = 'none';\n      if (noneWrap) noneWrap.style.display = 'inline';\n    }\n  }\n\n  function renderTiles(){\n    var tiles = document.querySelectorAll('.kh-finish-tile');\n    for (var t = 0; t < tiles.length; t++) {\n      var btn = tiles[t];\n      var i = parseInt(btn.getAttribute('data-index'), 10);\n      var check = btn.querySelector('.kh-finish-check');\n      if (i === state.activeFinish) {\n        btn.style.outline = '2px solid var(--signal)';\n        btn.style.boxShadow = '0 10px 28px rgba(0,0,0,0.5)';\n        if (check) check.style.display = 'flex';\n      } else {\n        btn.style.outline = '2px solid transparent';\n        btn.style.boxShadow = '0 1px 0 rgba(255,255,255,0.05)';\n        if (check) check.style.display = 'none';\n      }\n    }\n  }\n\n  function renderChips(){\n    var chips = document.querySelectorAll('.kh-deco-chip');\n    for (var c = 0; c < chips.length; c++) {\n      var btn = chips[c];\n      var i = parseInt(btn.getAttribute('data-index'), 10);\n      var on = state.applied.indexOf(i) !== -1;\n      btn.style.background = on ? 'var(--signal)' : 'transparent';\n      btn.style.color = on ? 'var(--text-on-signal)' : 'var(--text-secondary)';\n      btn.style.borderColor = on ? 'var(--signal)' : 'var(--stroke-on-dark)';\n    }\n  }\n\n  function initFinishes(){\n    var tiles = document.querySelectorAll('.kh-finish-tile');\n    for (var t = 0; t < tiles.length; t++) {\n      (function(btn){\n        btn.addEventListener('click', function(){\n          state.activeFinish = parseInt(btn.getAttribute('data-index'), 10);\n          renderPreview();\n          renderTiles();\n        });\n      })(tiles[t]);\n    }\n    var chips = document.querySelectorAll('.kh-deco-chip');\n    for (var c = 0; c < chips.length; c++) {\n      (function(btn){\n        btn.addEventListener('click', function(){\n          var i = parseInt(btn.getAttribute('data-index'), 10);\n          var idx = state.applied.indexOf(i);\n          if (idx === -1) { state.applied.push(i); } else { state.applied.splice(idx, 1); }\n          renderApplied();\n          renderChips();\n        });\n      })(chips[c]);\n    }\n    var resetBtn = document.getElementById('kh-reset-spec');\n    if (resetBtn) {\n      resetBtn.addEventListener('click', function(){\n        state.activeFinish = 0;\n        state.applied = [];\n        renderPreview();\n        renderTiles();\n        renderChips();\n      });\n    }\n    renderPreview();\n    renderTiles();\n    renderChips();\n  }\n\n  function initGallery(){\n    var prev = document.getElementById('kh-range-prev');\n    var next = document.getElementById('kh-range-next');\n    function scrollByDir(dir){\n      var el = document.getElementById('range-gallery');\n      if (!el) return;\n      var c = el.firstElementChild;\n      var amt = (c ? c.getBoundingClientRect().width : 320) + 16;\n      el.scrollLeft += dir * amt;\n    }\n    if (prev) prev.addEventListener('click', function(){ scrollByDir(-1); });\n    if (next) next.addEventListener('click', function(){ scrollByDir(1); });\n  }\n\n  function initQuoteModal(){\n    var modal = document.getElementById('kh-quote-modal');\n    var formStep = document.getElementById('kh-quote-form-step');\n    var sentStep = document.getElementById('kh-quote-sent-step');\n    var nameInput = document.getElementById('kh-input-name');\n    var companyInput = document.getElementById('kh-input-company');\n    var submitBtn = document.getElementById('kh-quote-submit');\n    var sentName = document.getElementById('kh-sent-firstname');\n\n    function updateSubmitState(){\n      var valid = !!(nameInput && nameInput.value.trim() && companyInput && companyInput.value.trim());\n      if (submitBtn) {\n        submitBtn.style.opacity = valid ? '1' : '.5';\n        submitBtn.style.cursor = valid ? 'pointer' : 'not-allowed';\n        submitBtn.setAttribute('data-valid', valid ? '1' : '0');\n      }\n    }\n\n    function openModal(){\n      if (modal) modal.style.display = 'flex';\n      if (formStep) formStep.style.display = 'block';\n      if (sentStep) sentStep.style.display = 'none';\n      updateSubmitState();\n    }\n    function closeModal(){\n      if (modal) modal.style.display = 'none';\n    }\n\n    var openers = document.querySelectorAll('.kh-open-quote');\n    for (var o = 0; o < openers.length; o++) {\n      openers[o].addEventListener('click', function(e){ e.preventDefault(); openModal(); });\n    }\n    var closers = document.querySelectorAll('.kh-close-quote');\n    for (var cl = 0; cl < closers.length; cl++) {\n      closers[cl].addEventListener('click', function(){ closeModal(); });\n    }\n    document.addEventListener('keydown', function(e){ if (e.key === 'Escape') closeModal(); });\n\n    if (nameInput) nameInput.addEventListener('input', updateSubmitState);\n    if (companyInput) companyInput.addEventListener('input', updateSubmitState);\n\n    if (submitBtn) {\n      submitBtn.addEventListener('click', function(){\n        var valid = submitBtn.getAttribute('data-valid') === '1';\n        if (!valid) return;\n        var first = (nameInput.value.trim().split(' ')[0]) || 'there';\n        if (sentName) sentName.textContent = first;\n        if (formStep) formStep.style.display = 'none';\n        if (sentStep) sentStep.style.display = 'block';\n      });\n    }\n  }\n\n  function init(){\n    initFinishes();\n    initGallery();\n    initQuoteModal();\n  }\n\n  if (document.readyState === 'loading') {\n    document.addEventListener('DOMContentLoaded', init);\n  } else {\n    init();\n  }\n})();\n<\/script>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Products &nbsp;\/&nbsp; Knobs &amp; Handles Knobs &amp; Handles The parts your customer reaches for first. We diecast, overmold, decorate, and finish control knobs and handles that feel substantial and hold their look for the life of the appliance. Get a Quote See the Range\u2192 Why It Matters Heft, grip, and a finish that lasts A knob is the one part of an appliance a customer touches every day. We engineer the weight, the rotational feel, and the decorative finish as one system \u2014 so it reads premium out of the box and stays that way for years. \u2013Weighted diecast cores for a premium, substantial feel \u2013Cool-touch overmolds that stay comfortable next to heat \u2013Decorative finishes color-matched and held run to run The Range One process, every style of knob &amp; handle \u2190 \u2192 rotary control knob Control Knobs Rotary knobs with defined detents and a balanced turn. cool-touch overmold knob Cool-Touch Knobs Overmolded grips that stay comfortable beside heat. LED indicator knob LED \/ Indicator Knobs Integrated light pipes for backlit status and setting. bar pull handle Bar &#038; Pull Handles Knurled or smooth bars with diecast endcaps. interchangeable-core knob Interchangeable-Core Knobs One body, swappable cores for multiple SKUs. weighted knob detail Weighted Knobs Added mass for the heft customers read as quality. How It&#8217;s Built Engineered layer by layer Every knob is a small assembly. We combine diecast, injection molding, decoration, and finishing in-house \u2014 so the layers are designed to work together, not sourced and hoped for. 01 Diecast zinc core Provides weight, rigidity, and a precise drive interface. 02 Injection overmold Cool-touch grip surface, optional in-mold knurl. 03 Decorative cap or face Chrome, brushed, or painted \u2014 the surface the customer sees. 04 Light pipe &#038; core Optional backlit indication and interchangeable stem. Finishes &amp; Decoration The look is yours to spec Pick a finish, layer on decoration \u2014 every option is done in-house and held consistent run to run. Live preview \u00b7 hover to spin Bright Chrome High-shine plated face + Decoration: Tap a decoration option to layer it on \u2192 Finish \u2014 pick one \u2713 Bright Chrome \u2713 Brushed Nickel \u2713 PVD Stainless \u2713 Matte Black \u2713 Brass \/ Bronze \u2713 Backlit Indicator Decoration \u2014 add any In-mold knurling Rotational screenprint Paint-fill \/ colorfill Laser etch Custom branding Quote This Spec Reset Next Product Logo Badges &amp; Nameplates\u2197 View all products\u2197 \u00d7 Start a Project Tell us what you&#8217;re making. We move ideas Fourward \u2014 manufactured, finished, assembled. Name Company Project details Submit RFQ Cancel \u2197 Thanks, there. A real human will be in touch about your knob &amp; handle project. Done<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_theme","meta":{"footnotes":""},"class_list":["post-10252","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/pages\/10252","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/comments?post=10252"}],"version-history":[{"count":5,"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/pages\/10252\/revisions"}],"predecessor-version":[{"id":11858,"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/pages\/10252\/revisions\/11858"}],"wp:attachment":[{"href":"https:\/\/signature4.com\/4appliance\/wp-json\/wp\/v2\/media?parent=10252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}