/* Selected EC1 visual; the existing solution console owns the outer frame. */
.solutions-detail-page .capability-panel .hearing-protection-visual {
  container-type: inline-size;
  isolation: isolate;
}
.hearing-protection-visual::after { content: none; }
.hearing-protection-visual[data-motion-playing="false"] *,
.hearing-protection-visual[data-motion-playing="false"] *::before,
.hearing-protection-visual[data-motion-playing="false"] *::after { animation-play-state: paused !important; }

.hearing-protection-art { position:absolute; top:0; right:0; bottom:0; left:0; inset:0; overflow:hidden; background:#f2f0eb; color:#101413; font-family:Arial,Helvetica,sans-serif; }
.hearing-protection-art .hearing-protection-header { position:absolute; z-index:3; top:6%; left:4.2%; right:4.2%; display:flex; justify-content:space-between; align-items:center; gap:12px; gap:3cqw; }
.hearing-protection-art .hearing-protection-header span { font:400 11px/1.4 Arial,Helvetica,sans-serif; font:400 clamp(9px,1.2cqw,12px)/1.4 Arial,Helvetica,sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#59635c; }
.hearing-protection-art .hearing-protection-header span:last-child { text-align:right; }
.hearing-protection-art .hearing-protection-product { position:absolute; z-index:2; left:25%; top:2%; width:55%; height:92%; object-fit:contain; transform:scale(1.18); mix-blend-mode:multiply; }
.hearing-protection-art .hearing-protection-flow { position:absolute; top:0; right:0; bottom:0; left:0; inset:0; width:100%; height:100%; }
.hearing-protection-art .hearing-protection-input { fill:#f75c27; transform-origin:center; transform-box:fill-box; animation:hearing-protection-incoming calc(var(--d,1.5s) * 1.5) ease-in-out calc(var(--o,0s) * 1.5) infinite; }
.hearing-protection-art .hearing-protection-output { fill:#101413; transform-origin:center; transform-box:fill-box; animation:hearing-protection-output calc(var(--d,1.8s) * 1.5) ease-in-out calc(var(--o,0s) * 1.5) infinite; }
.hearing-protection-art .hearing-protection-quiet-cut { fill:none; stroke:#f75c27; stroke-width:1.2; stroke-dasharray:3 7; opacity:.6; animation:hearing-protection-cut 3.3s ease-out infinite; }
.hearing-protection-art .hearing-protection-model { position:absolute; left:44%; right:39%; bottom:6.5%; text-align:center; margin:0; font:400 11px/1.4 var(--font-frontier); font:400 clamp(10px,1.3cqw,13px)/1.4 var(--font-frontier); letter-spacing:.12em; }
.hearing-protection-art .hearing-protection-label { position:absolute; top:64%; margin:0; font:400 11px/1.4 Arial,Helvetica,sans-serif; font:400 clamp(9px,1.2cqw,12px)/1.4 Arial,Helvetica,sans-serif; }
.hearing-protection-art .hearing-protection-label--in { left:4.2%; color:#b83d0d; }
.hearing-protection-art .hearing-protection-label--out { right:4.2%; color:#28382f; }
@container (max-width: 400px) {
  .hearing-protection-art .hearing-protection-header span { white-space: nowrap; }
  .hearing-protection-art .hearing-protection-header span:last-child { display: none; }
}
@keyframes hearing-protection-incoming {
  0%,100% { transform:scaleY(.3); opacity:.7; }
  22% { transform:scaleY(1.7); opacity:1; }
  48% { transform:scaleY(.5); opacity:.8; }
  72% { transform:scaleY(1.2); opacity:.95; }
}
@keyframes hearing-protection-output {
  0%,100% { transform:scaleY(.4); }
  28% { transform:scaleY(1.5); }
  52% { transform:scaleY(.6); }
  76% { transform:scaleY(1.15); }
}
@keyframes hearing-protection-cut { 0% { opacity:0; transform:translateX(-8px); } 25% { opacity:.7; } 100% { opacity:0; transform:translateX(10px); } }

/* Older Safari keeps compact labels without container-query support. */
@supports not (container-type: inline-size) {
  @media (max-width: 600px) {
    .hearing-protection-art .hearing-protection-header span:last-child { display: none; }
  }
}

/* The scrolling page's frame contains only positioned artwork. Keep its
   height even when the later frame rule's aspect-ratio is unsupported. */
@supports not (aspect-ratio: 16 / 9) {
  .solutions-scroll-page .solution-visual.hearing-protection-visual::before {
    display: block;
    padding-top: 56.25%;
    content: "";
  }
}

@media (forced-colors: active) {
  /* Multiply would darken the product into a user-selected black surface. */
  .hearing-protection-art .hearing-protection-product {
    mix-blend-mode: normal;
  }
}