/* Black key faces, illuminated cyan rims and translucent legends from keys.png. */
.editorial #in-action{padding-bottom:clamp(112px,9vw,132px)}
.editorial #product{position:relative;overflow:visible}
.editorial #product>.keypad-section-border.key-loop-separator{position:absolute;top:0;left:0;z-index:4;width:100%;height:clamp(150px,13vw,194px);margin:0;transform:translateY(-50%);overflow:hidden;pointer-events:auto;background:transparent;isolation:isolate;contain:layout paint}
.key-loop-separator::before{content:none}
.key-loop-track{display:flex;width:max-content;height:100%;align-items:center;will-change:transform}
.key-loop-group{display:flex;align-items:center;gap:4px;padding:0 4px 0 0;flex:none}
.key-loop-cap{position:relative;display:grid;place-items:center;flex:none;width:112px;height:104px;padding:12px 10px;box-sizing:border-box;border:2px solid #81dce6;border-radius:13px;background:linear-gradient(145deg,#071013 0%,#010303 38%,#000 85%);color:#bdf4fa;text-shadow:0 0 1px #e9fcff,0 0 7px #74ddeb35;box-shadow:inset 0 0 0 2px #143a42,inset 0 -2px 3px #74ddeb4d,0 3px 0 #19383e,0 0 6px #74ddebab,0 0 14px #74ddeb66,0 0 28px #74ddeb2e;transform:none;font:700 19px/1.13 Arial,sans-serif;text-align:center;letter-spacing:-.025em}
.key-loop-cap span{display:block;transition:color .2s ease,text-shadow .2s ease}
@media(hover:hover) and (pointer:fine){
 .key-loop-cap:hover span{color:#effeff;text-shadow:0 0 3px #e5fcff,0 0 8px #74ddeb,0 0 18px #74ddebb3,0 0 28px #74ddeb66}
}
@media(prefers-reduced-motion:reduce){.key-loop-cap span{transition:none}}

@media(max-width:800px){.editorial #product>.keypad-section-border.key-loop-separator{height:142px}.key-loop-group{gap:4px;padding-right:4px}.key-loop-cap{width:94px;height:88px;font-size:16px;border-radius:11px}}
@media(prefers-reduced-motion:reduce){.key-loop-track{will-change:auto}}

.key-loop-cap-long{font-size:16px;padding-inline:5px}
@media(max-width:800px){.key-loop-cap-long{font-size:14px}}
