/* One benefit at a time on mobile; keep the existing currency selector usable. */
@media (max-width: 760px) {
  .announcement { min-height: 44px; padding: 6px 10px; }
  .announcement > span {
    display: grid; width: calc(100% - 52px); max-width: none;
    gap: 0; align-items: center; overflow: hidden;
    font-size: clamp(10px, 3.1vw, 14px); line-height: 1.4;
  }
  .announcement > span > span {
    grid-area: 1 / 1; justify-content: center; gap: 7px;
    white-space: nowrap; min-width: 0;
    animation: mobile-usp-rotate 8s ease-in-out infinite;
  }
  .announcement > span > span:nth-child(2) { animation-delay: -4s; }
  .announcement .announcement-delivery { width: 22px; height: 22px; flex-shrink: 0; }
  .announcement .announcement-guarantee { width: 17px; height: 20px; flex-shrink: 0; }
  .announcement .region-label { right: 10px; }
  .announcement select { font-size: 11px; }
  .announcement:hover > span > span,
  .announcement:focus-within > span > span { animation-play-state: paused; }
}
@keyframes mobile-usp-rotate {
  0%, 42% { opacity: 1; transform: translateY(0); }
  49%, 92% { opacity: 0; transform: translateY(-12px); }
  93% { opacity: 0; transform: translateY(12px); }
  100% { opacity: 1; transform: translateY(0); }
}
@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  .announcement > span { display: flex; flex-direction: column; gap: 3px; }
  .announcement > span > span { animation: none; }
}