/* Sanfte Bewegung; die ausdrueckliche Wahl geht vor der Systemvorgabe. */
:root { --kian-motion-ease: cubic-bezier(.22, 1, .36, 1); }
@media (hover: hover) and (pointer: fine) {
html[data-bewegung="an"] .product-item,
html[data-bewegung="an"] .brot-item { transition: background-color .45s ease, border-color .45s ease, translate .5s var(--kian-motion-ease), box-shadow .5s ease; }
html[data-bewegung="an"] .product-item:not(.flex-col) > :first-child,
html[data-bewegung="an"] .brot-item > :first-child { translate: 0 0; transition: translate .5s var(--kian-motion-ease); }
html[data-bewegung="an"] .product-item:not(.flex-col):is(:hover, :focus-visible) > :first-child,
html[data-bewegung="an"] .brot-item:is(:hover, :focus-visible) > :first-child { translate: 7px 0; }
html[data-bewegung="an"] .product-item::before { width: 2px; opacity: 0; transform: scaleY(.35); transform-origin: center; transition: opacity .4s ease, transform .5s var(--kian-motion-ease); }
html[data-bewegung="an"] .product-item:is(:hover, :focus-visible)::before { opacity: 1; transform: scaleY(1); }
html[data-bewegung="an"] .product-item.flex-col:is(:hover, :focus-visible) { translate: 0 -3px !important; }
html[data-bewegung="an"] .salat-card { transition: translate .5s var(--kian-motion-ease), background-color .45s ease, box-shadow .5s ease; }
html[data-bewegung="an"] .salat-card:is(:hover, :focus-within) { translate: 0 -3px !important; }
html[data-bewegung="an"] .gallery-item img { transform: scale(1); transform-origin: center; transition: transform .5s var(--kian-motion-ease), opacity .3s ease; }
html[data-bewegung="an"] .gallery-item:hover img,
html[data-bewegung="an"] .product-item:is(:hover, :focus-visible) .gallery-item img { transform: scale(1.025); }
html[data-bewegung="an"] .sortiment-kategorien a { transition: translate .4s var(--kian-motion-ease), background-color .3s ease, border-color .3s ease; }
html[data-bewegung="an"] .sortiment-kategorien a:is(:hover, :focus-visible) { translate: 0 -2px; }
html[data-bewegung="an"] .marktwoche-anrufen .marktwoche-pfeil,
html[data-bewegung="an"] .bewertungen-schreiben svg,
html[data-bewegung="an"] .bewertungen-leselink svg { translate: 0 0; transition: translate .45s var(--kian-motion-ease); }
html[data-bewegung="an"] .marktwoche-anrufen:is(:hover, :focus-visible) .marktwoche-pfeil,
html[data-bewegung="an"] .bewertungen-schreiben:is(:hover, :focus-visible) svg { translate: 4px 0; }
html[data-bewegung="an"] .bewertungen-leselink:is(:hover, :focus-visible) svg { translate: 2px -2px; }

}
html[data-bewegung="aus"] *, html[data-bewegung="aus"] *::before, html[data-bewegung="aus"] *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
.kian-bewegung-schalter { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 8px 0; color: inherit; font: inherit; font-size: 13px; background: transparent; border: 0; cursor: pointer; }
.kian-bewegung-schalter::before { content: ""; width: 7px; height: 7px; border-radius: 0; background: #8f9883; }
.kian-bewegung-schalter[aria-pressed="true"]::before { background: #d5c396; }
.kian-bewegung-schalter:hover { text-decoration: underline; text-underline-offset: 4px; }
.kian-bewegung-schalter:focus-visible { outline: 2px solid #d5c396; outline-offset: 4px; }