.of-spray{display:block;background:#edede8;color:#111;overflow:hidden;padding:54px 4% 30px;border-top:1px solid #1111}.of-spray-intro{text-align:center}.of-spray-intro .of-eyebrow{font-size:10px;margin:0 0 12px}.of-spray-intro h2{font:900 clamp(30px,4.2vw,60px)/1 Impact,'Arial Narrow',Arial,sans-serif;letter-spacing:-.025em;color:inherit;margin:0}.of-spray-intro>p:last-child{font:500 11px/1.5 Arial,sans-serif;margin:14px 0 0;color:#555}.of-spray-stage{position:relative;max-width:1200px;height:480px;margin:0 auto;isolation:isolate}.of-spray-device{position:absolute;top:20px;width:38%;aspect-ratio:1;z-index:2;user-select:none}.of-spray-device--clog{left:0}.of-spray-device--og{right:0}.of-spray-device>img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;filter:drop-shadow(0 14px 12px #0002)}.of-spray-trigger{position:absolute;left:var(--control-x);top:var(--control-y);transform:translate(-50%,-50%);width:46px;height:46px;border:1px solid #ffffffb3;border-radius:50%;background:#1113;color:#fff;display:grid;place-items:center;font:400 26px/1 Arial,sans-serif;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;box-shadow:0 0 0 5px #ffffff18;transition:background .18s,box-shadow .18s}.of-spray-trigger:hover,.of-spray-trigger:focus-visible{background:#1118;box-shadow:0 0 0 7px #fff3;outline:2px solid #111;outline-offset:5px}.of-spray-trigger[aria-pressed=true]{background:#fff;color:#111;box-shadow:0 0 0 8px #1112}.of-spray-device--clog{--control-x:45.2%;--control-y:39.4%;--source-x:87.1%;--source-y:14%;transform:translateY(3%) scale(1.02);transform-origin:50% 100%}.of-spray-device--og{--control-x:44.9%;--control-y:17.3%;--source-x:20.3%;--source-y:23.4%;transform:none}.of-spray-source{position:absolute;left:var(--source-x);top:var(--source-y);width:1px;height:1px;pointer-events:none}.of-spray-mark{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);width:28%;max-width:320px;z-index:1;line-height:0}.of-spray-mark img{display:block;width:100%;height:auto;max-height:260px;object-fit:contain;mix-blend-mode:multiply}.of-spray-logo-base{opacity:.13}.of-spray-mark .of-spray-logo-ink{position:absolute;inset:0;opacity:var(--ink-opacity,0);transform:translateY(var(--ink-run,0px));transition:opacity .08s linear}.of-spray-fallback{font:900 100px/1 Impact,sans-serif}.of-spray-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}.of-spray-footer{max-width:1050px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;position:relative;z-index:4}.of-spray-footer>a{font:700 11px/1.5 Arial,sans-serif;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid #1115;padding:12px 0;text-decoration:none;color:inherit}.of-spray-footer>a:last-child{text-align:right}.of-spray-footer>a span{margin-left:10px}.of-spray-reset{border:0;background:none;text-decoration:underline;text-underline-offset:4px;font:400 10px/1.5 Arial,sans-serif;color:#666;padding:12px;cursor:pointer}.of-spray-reset:focus-visible{outline:2px solid #111;outline-offset:2px}@media(max-width:1000px){.of-spray-stage{height:37vw;min-height:280px}.of-spray-device{width:41%}}@media(max-width:700px){.of-spray{padding:38px 3% 25px}.of-spray-stage{height:320px;margin:12px -8% 0}.of-spray-device{width:45%;top:30px}.of-spray-mark{width:27%;top:42%}.of-spray-trigger{width:44px;height:44px;font-size:22px}.of-spray-footer{gap:4px;margin:0}.of-spray-footer>a{font-size:9px;letter-spacing:0}.of-spray-reset{font-size:9px;padding:12px 5px}.of-spray-intro>p:last-child{font-size:10px}}@media(max-width:420px){.of-spray-stage{height:250px}.of-spray-device{top:25px}.of-spray-mark{top:40%}}@media(prefers-reduced-motion:reduce){.of-spray-logo-ink,.of-spray-trigger{transition:none}.of-spray-canvas{display:none}}

.of-spray-footer>a small{display:block;font:400 10px/1.5 Arial,sans-serif;letter-spacing:0;text-transform:none;margin-top:5px;color:#555}.of-spray-device--clog .of-spray-trigger{touch-action:manipulation}.of-spray-device--clog .of-spray-trigger[aria-pressed=true]{box-shadow:0 0 0 7px #1112;background:#111;color:#fff}.of-spray-device--clog .of-spray-trigger[aria-pressed=true] span{font-size:0}.of-spray-device--clog .of-spray-trigger[aria-pressed=true] span:after{content:"";display:block;width:9px;height:9px;background:currentColor}@media(max-width:700px){.of-spray-footer>a small{font-size:9px}}

@media(max-width:700px){.of-spray-device{width:41%}.of-spray-device--clog{left:3%}}@media(max-width:420px){.of-spray-stage{height:230px}}

.of-spray-filter-surface{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}

.of-spray-purchase{display:flex;align-items:center;gap:18px;justify-content:space-between;font:600 12px/1.4 Arial,sans-serif;margin:12px 0 4px;letter-spacing:0;text-transform:none}.of-spray-purchase>span{font-size:10px;text-decoration:underline;text-underline-offset:4px}.of-spray-card-offer{display:flex;align-items:center;gap:18px;max-width:1050px;margin:24px auto 0;padding:12px 0;border-top:1px solid #1112;color:inherit;text-decoration:none}.of-spray-card-offer img{width:64px;height:64px;object-fit:cover;mix-blend-mode:multiply}.of-spray-card-offer strong{display:block;font:600 12px/1.5 Arial,sans-serif}.of-spray-card-offer small{display:block;font:400 10px/1.4 Arial,sans-serif;color:#555;margin-bottom:4px}.of-card-price{margin-left:auto;font:500 12px/1.4 Arial,sans-serif}.of-card-link{font:600 10px/1.4 Arial,sans-serif;text-decoration:underline;text-underline-offset:4px}@media(max-width:700px){.of-spray-purchase{display:block;font-size:11px;margin-top:9px}.of-spray-purchase>span{display:block;font-size:9px;margin:5px 0 0}.of-spray-card-offer{gap:10px;margin-top:18px}.of-spray-card-offer img{width:50px;height:50px}.of-card-link{max-width:90px;font-size:9px}.of-spray-card-offer strong{font-size:10px}.of-card-price{font-size:11px}}

.of-spray-stage,.of-spray-stage *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.of-spray-device>img{-webkit-user-drag:none}.of-spray-trigger,.of-spray-trigger *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.of-spray-trigger>span{pointer-events:none}


.of-spray-stage{height:auto;min-height:0;aspect-ratio:1.55;margin:26px auto 8px}
.of-spray-device{width:43%;aspect-ratio:1;overflow:hidden;transform:none;background:transparent;contain:layout paint}
.of-spray-camera{position:absolute;inset:0;transform-origin:0 0}
.of-spray-device--clog{left:0;top:26.64%;--control-x:45.2%;--control-y:39.4%;--source-x:87.1%;--source-y:14%}
.of-spray-device--og{right:0;top:0;--control-x:42%;--control-y:50%;--source-x:3.6%;--source-y:60.3%}
.of-spray-device--clog .of-spray-camera{transform:translate(-2.752%,4.65%) scale(1.12)}
.of-spray-device--og .of-spray-camera{transform:none}
.of-spray-camera>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:none;pointer-events:none}
.of-spray-device .of-spray-moving-control{transition:transform 150ms cubic-bezier(.2,.7,.2,1);will-change:transform}
.of-spray-device--og{aspect-ratio:1 / 1.22}
.of-spray-device--og .of-spray-camera{bottom:auto;width:100%;height:auto;aspect-ratio:1}
.of-spray-device--og .of-spray-photo{clip-path:inset(0 0 22%)}
.of-spray-device--og .of-spray-lower-extension{clip-path:inset(33.5% 0 0);inset:auto;left:-13.7%;top:34.45%;width:130%;max-width:none;height:130%;object-fit:fill;transform:none}
.of-spray-device--og .of-spray-moving-control{clip-path:none;top:5.3%;bottom:auto;height:88%;scale:.66;transform-origin:43.6% 56.6%;transform:translate3d(var(--og-pull,0px),var(--og-push,0px),0) rotate(var(--og-tilt,0deg))}

.of-spray-device--og.is-pulling .of-spray-moving-control{transition:transform 180ms cubic-bezier(.2,.7,.2,1)}
.of-spray-device--clog .of-spray-photo{clip-path:none}
.of-spray-device--clog .of-spray-moving-control{clip-path:ellipse(.8% 2.2% at 45.2% 39.4%);transform-origin:44.5% 39.4%}
.of-spray-device--clog.is-pressing .of-spray-moving-control{transform:translate3d(-.3%,0,0) scaleX(.8)}
.of-spray-trigger,.of-spray-trigger:hover,.of-spray-trigger[aria-pressed=true],.of-spray-device--clog .of-spray-trigger[aria-pressed=true]{width:10%;height:16%;min-width:44px;min-height:44px;border:0;border-radius:50%;background:transparent;box-shadow:none;color:#111;transition:none}
.of-spray-device--og .of-spray-trigger{width:17%;height:14%}
.of-spray-trigger:focus-visible{outline:1px solid #111;outline-offset:3px}
.of-spray-trigger>span{display:none}
.of-spray-device--og .of-spray-trigger>span{display:block;position:absolute;left:95%;top:0;font:400 15px/1 Arial,sans-serif;color:#555;pointer-events:none;transition:opacity .15s}
.of-spray-device--og.is-pulling .of-spray-trigger>span{opacity:0}
.of-spray-mark{width:14%;max-width:200px;top:40.2%}
@media(max-width:700px){.of-spray-stage{height:auto;min-height:0;aspect-ratio:1.5;margin:24px -2% 8px}.of-spray-device{width:44%}.of-spray-device--clog{left:0;top:26.38%}.of-spray-device--og{top:0}.of-spray-mark{width:14%;top:39.8%}.of-spray-device--og .of-spray-trigger>span{font-size:11px;left:90%;top:-4px}.of-spray-footer>a small{font-size:9px;max-width:135px}.of-spray-footer>a:last-child small{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.of-spray-device .of-spray-moving-control{transition:none}}

.of-spray-device--clog{-webkit-mask-image:linear-gradient(to top,transparent 18%,#000 38%);mask-image:linear-gradient(to top,transparent 18%,#000 38%)}
.of-spray-device--og{-webkit-mask-image:linear-gradient(to top,transparent,#000 10%);mask-image:linear-gradient(to top,transparent,#000 10%)}

.of-spray-device--clog .of-spray-trigger{min-width:52px;min-height:52px}

.of-spray-intro>p:last-child{max-width:460px;margin-left:auto;margin-right:auto}
.of-spray-trigger::before{content:"";position:absolute;left:50%;top:50%;width:23px;height:23px;transform:translate(-50%,-50%);border:1px solid #1119;border-radius:50%;background:#edede820;box-shadow:0 0 0 3px #edede860;pointer-events:none}
.of-spray-trigger:hover::before,.of-spray-trigger:focus-visible::before{border-color:#111;background:#edede850}
.of-spray-trigger[aria-pressed=true]::before{background:#1113;border-color:#111}
.of-spray-device .of-spray-trigger>span{display:none}
@media(max-width:700px){.of-spray-trigger::before{width:20px;height:20px}}

/* Finishing products sit directly beneath the interactive guns. */
.of-spray-finishing{display:grid;grid-template-columns:1.15fr 1fr;max-width:1200px;margin:38px auto 0;border-top:1px solid #1112}
.of-spray-finishing>a{display:grid;grid-template-columns:minmax(130px,42%) 1fr;align-items:center;gap:24px;padding:32px 26px 26px 0;margin:0;max-width:none;border:0;color:inherit;text-decoration:none;min-width:0}
.of-spray-finishing>a+a{border-left:1px solid #1112;padding-left:30px;padding-right:0}
.of-finish-image{height:230px;display:flex;align-items:center;justify-content:center}
.of-spray-finishing .of-finish-image img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .25s ease}
.of-finish-image--paint{overflow:hidden;mask-image:radial-gradient(ellipse at center,#000 45%,transparent 74%)}
.of-spray-finishing .of-finish-image--paint img{width:150%;max-width:none;flex-shrink:0;height:150%;object-fit:contain;transform:translateY(-15%)}
.of-finish-copy small{display:block;font:500 10px/1.5 Arial,sans-serif;text-transform:uppercase;letter-spacing:1.5px;color:#555;margin:0 0 12px}
.of-finish-copy h3{font:400 clamp(22px,2.2vw,32px)/1.05 Impact,'Arial Narrow',sans-serif;text-transform:uppercase;margin:0 0 14px;letter-spacing:.2px}
.of-finish-copy p{font:400 12px/1.6 Arial,sans-serif;color:#555;margin:0 0 18px;max-width:230px}
.of-spray-finishing .of-finish-price{display:block;font:600 14px/1.4 Arial,sans-serif;margin:0 0 14px}
.of-finish-link{display:inline-flex;gap:14px;font:600 11px/1.5 Arial,sans-serif;border-bottom:1px solid #111;padding-bottom:4px}
.of-spray-finishing>a:focus-visible{outline:2px solid #111;outline-offset:4px}
.of-spray-finishing>a:hover .of-finish-link{opacity:.6}
@media(max-width:700px){.of-spray-finishing{grid-template-columns:1fr;margin-top:26px}.of-spray-finishing>a{grid-template-columns:38% 1fr;gap:22px;padding:26px 0}.of-spray-finishing>a+a{border-left:0;border-top:1px solid #1112;padding:26px 0}.of-finish-image{height:185px}.of-finish-copy h3{font-size:26px}.of-finish-copy small{font-size:9px;margin-bottom:10px}.of-finish-copy p{font-size:11px}.of-spray-finishing .of-finish-price{font-size:13px}.of-finish-link{font-size:10px}}

.of-finish-copy{min-width:0}.of-finish-copy h3{overflow-wrap:anywhere}@media(max-width:700px){.of-finish-copy h3{font-size:22px}}

.of-spray-finishing{grid-template-columns:1.3fr 1fr}
.of-spray-finishing>.of-spray-paint-offer{grid-row:span 2;grid-template-columns:43% 1fr;padding-right:34px}
.of-spray-paint-offer .of-finish-image{height:330px}
.of-spray-paint-offer .of-finish-copy h3{font-size:clamp(32px,3.3vw,46px);margin-bottom:12px}
.of-finish-format{display:block;font:600 11px/1.5 Arial,sans-serif;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px}
.of-spray-finishing>.of-spray-hevie-offer,.of-spray-finishing>.of-spray-card-offer{grid-template-columns:34% 1fr;gap:24px;padding:24px 0 24px 28px}
.of-spray-hevie-offer .of-finish-image,.of-spray-card-offer .of-finish-image{height:160px}
.of-spray-hevie-offer .of-finish-copy h3,.of-spray-card-offer .of-finish-copy h3{font-size:26px}
.of-spray-finishing>.of-spray-card-offer{border-top:1px solid #1112}
.of-finish-image--hevie{overflow:hidden;mask-image:radial-gradient(ellipse at center,#000 50%,transparent 85%)}
.of-spray-finishing .of-finish-image--hevie img{width:150%;height:150%;max-width:none;flex-shrink:0;transform:translateY(-10%)}
@media(max-width:700px){.of-spray-finishing{grid-template-columns:1fr}.of-spray-finishing>.of-spray-paint-offer{grid-row:auto;grid-template-columns:38% 1fr;padding:30px 0}.of-spray-paint-offer .of-finish-image{height:245px}.of-spray-paint-offer .of-finish-copy h3{font-size:32px}.of-spray-finishing>.of-spray-hevie-offer,.of-spray-finishing>.of-spray-card-offer{grid-template-columns:38% 1fr;gap:22px;padding:26px 0;border-left:0;border-top:1px solid #1112}.of-spray-hevie-offer .of-finish-copy h3,.of-spray-card-offer .of-finish-copy h3{font-size:22px}}

.of-hevie-stock{display:block;font:600 11px/1.5 Arial,sans-serif;margin:0 0 8px;color:#555}.of-spray-hevie-offer .of-finish-copy p{font-size:11px;margin-bottom:12px;max-width:240px}

/* Keep fingers above the animation, with one control per gun. */
.of-spray-controls{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:1200px;margin:28px auto 0;position:relative;z-index:4}
.of-spray-control-unit{display:flex;flex-direction:column;align-items:center;gap:8px}
.of-spray-control-name{font:600 10px/1.4 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.of-spray-controls .of-spray-trigger--remote{position:relative;inset:auto;transform:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:152px;width:auto;height:auto;min-height:46px;padding:12px 20px;border:1px solid #111;border-radius:999px;background:transparent;color:#111;box-shadow:none;font:600 11px/1.4 Arial,sans-serif;letter-spacing:.02em;touch-action:manipulation;transition:background .18s,color .18s,transform .18s}
.of-spray-controls .of-spray-trigger--remote::before,.of-spray-controls .of-spray-trigger--remote::after{content:none}
.of-spray-controls .of-spray-trigger--remote>span{display:block;pointer-events:none}
.of-spray-controls .of-spray-trigger--remote .of-spray-control-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.of-spray-controls .of-spray-trigger--remote:hover{background:#111;color:#edede8}
.of-spray-controls .of-spray-trigger--remote[aria-pressed=true]{background:#111;color:#edede8;box-shadow:none}
.of-spray-controls .of-spray-trigger--remote[aria-pressed=true] .of-spray-control-dot{border-radius:1px}
.of-spray-controls .of-spray-trigger--remote:focus-visible{outline:2px solid #111;outline-offset:4px}
.of-spray-control-unit small{font:400 10px/1.4 Arial,sans-serif;color:#555}
.of-spray-controls+.of-spray-stage{margin-top:8px}
@media(max-width:700px){.of-spray-controls{margin-top:24px;gap:12px}.of-spray-controls .of-spray-trigger--remote{min-width:0;max-width:100%;padding:12px 16px;font-size:11px}.of-spray-control-name{font-size:9px;letter-spacing:.07em}.of-spray-control-unit{gap:7px}.of-spray-controls+.of-spray-stage{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.of-spray-controls .of-spray-trigger--remote{transition:none}}

/* Match the reference cup and keep the upper assembly proportional. */
.of-spray-device--og .of-spray-upper{position:absolute;inset:0;transform:scale(.86);transform-origin:50% 78%}
.of-spray-upper>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.of-spray-device--og .of-spray-upper>.of-spray-photo{top:2.4%}
