/* Approved motion-only tuning, shared by all languages and device layouts.
 * No changes to resting geometry, media proportions, content or functions.
 */

/* Keyboard feedback */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #4e7a2e !important;
  outline-offset: 2px;
}

/* Initial page-load feedback */
main {
  animation: muller-motion-in 280ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

/* Hover feedback for pointer devices only */
@media (hover: hover) and (pointer: fine) {
  .grow {
    transition: transform 180ms cubic-bezier(0.2, 0.7, 0.2, 1),
      opacity 180ms ease !important;
  }

  .grow:hover {
    opacity: 0.97;
    transform: scale(1.015);
  }

  .design_template.productsfocus .product-list,
  .design_template.headline .headline-item,
  main div.product_list {
    transition: transform 180ms cubic-bezier(0.2, 0.7, 0.2, 1),
      box-shadow 180ms ease;
  }

  .design_template.productsfocus .product-list:hover,
  .design_template.productsfocus .product-list:focus-within,
  .design_template.headline .headline-item:hover,
  .design_template.headline .headline-item:focus-within,
  main div.product_list:hover,
  main div.product_list:focus-within {
    box-shadow: 0 6px 16px rgba(24, 35, 18, 0.12);
    transform: translateY(-1px);
  }

  .buttonbg a,
  .bgr-up a,
  .footer_design a,
  main a.btn,
  main button.btn,
  main .paginator a {
    transition: opacity 180ms ease;
  }

  .buttonbg a:hover,
  .bgr-up a:hover,
  .footer_design a:hover,
  main a.btn:hover,
  main button.btn:hover,
  main .paginator a:hover {
    opacity: 0.86;
  }
}

/* Reduced-motion fallback */
@media (prefers-reduced-motion: reduce) {
  main {
    animation: none !important;
  }

  .grow,
  .design_template.productsfocus .product-list,
  .design_template.headline .headline-item,
  .buttonbg a,
  .bgr-up a,
  .footer_design a,
  main div.product_list,
  main a.btn,
  main button.btn,
  main .paginator a {
    transition-duration: 0.01ms !important;
  }

  .grow:hover,
  .design_template.productsfocus .product-list:hover,
  .design_template.productsfocus .product-list:focus-within,
  .design_template.headline .headline-item:hover,
  .design_template.headline .headline-item:focus-within,
  main div.product_list:hover,
  main div.product_list:focus-within {
    transform: none !important;
  }
}

/* Animations */
@keyframes muller-motion-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
