/* Bewegung am Handy (Moritz, 07.11.2026; Kay: Animationen nach Emil-Kowalski-Regeln prüfen, „Ja, vorbereiten“).
   Wird als letzte Theme-Datei geladen und überschreibt nur Bewegung. Farben, Rahmen und Layout bleiben unverändert. */
:root{--fo-ease-out:cubic-bezier(.23,1,.32,1);--fo-ease-drawer:cubic-bezier(.32,.72,0,1)}

/* 1. Hover-Bewegung nur mit Maus: Am Handy löst Antippen :hover aus, dann bleiben Karte oder Knopf angehoben bzw. das Bild bleibt gezoomt. */
@media (hover:none),(pointer:coarse),(pointer:none){
  .button:hover,
  .product-card:hover .product-art img,
  .appearance-image-button:hover img,
  .cfg-start:hover,
  #main.kn .ds-sw:hover,
  #main.kn.kat .kat-way:hover,
  #main.kn.kat .kat-cat:hover,
  #main.kn .hp-prod:hover .hp-prod-img img,
  #main.kn .hp-sport-tiles a:hover .hp-st-img img{transform:none}
  #main.kn .hp-hcard:hover,
  #main.kn .hp-path:hover{transform:none;box-shadow:var(--kn-shadow)}
  #main.kn .hp-sport-tiles a:hover{transform:none;box-shadow:none}
}

/* 2. Druck-Feedback: Knöpfe geben beim Antippen sichtbar nach. */
.button:not(:disabled):not(.disabled):not([aria-disabled="true"]):active{transform:scale(.97);transition-duration:.1s}
#main.kn .kn-btn{transition:background .15s,border-color .15s,transform .16s var(--fo-ease-out)}
#main.kn .kn-btn:not(:disabled):active{transform:scale(.97);transition-duration:.1s}

/* 3. Handy-Kaufleiste fährt von unten ein, statt hart aufzuspringen; heraus etwas schneller.
   Ältere Browser ohne @starting-style bzw. allow-discrete zeigen sie wie bisher ohne Übergang. */
@media (max-width:800px){
  .pd-mobile-checkout{transition:transform .25s var(--fo-ease-drawer),display .25s allow-discrete}
  .pd-mobile-checkout[hidden]{transform:translateY(100%);transition-duration:.18s;pointer-events:none}
  @starting-style{.pd-mobile-checkout{transform:translateY(100%)}}
}

/* 4. Handy-Menü blendet kurz ein (200 ms) und schneller aus (150 ms). */
@media (max-width:960px){
  #mega.fo-mega{transition:opacity .2s var(--fo-ease-out),transform .2s var(--fo-ease-out),display .2s allow-discrete}
  #mega.fo-mega[hidden]{opacity:0;transform:translateY(-8px);transition-duration:.15s;pointer-events:none}
  @starting-style{#mega.fo-mega{opacity:0;transform:translateY(-8px)}}
}

/* „Bewegung reduzieren“: keine Positionsbewegung, nur Ein- und Ausblenden. Weiches Scrollen regelt das Skript in index.php. */
@media (prefers-reduced-motion:reduce){
  .pd-mobile-checkout,#mega.fo-mega{transition-property:opacity,display}
  .pd-mobile-checkout[hidden],#mega.fo-mega[hidden]{transform:none;opacity:0}
  @starting-style{.pd-mobile-checkout,#mega.fo-mega{transform:none;opacity:0}}
  #main.kn .hp-hcard:hover,#main.kn .hp-path:hover,#main.kn .hp-sport-tiles a:hover,#main.kn.kat .kat-way:hover,#main.kn.kat .kat-cat:hover,.cfg-start:hover,.button:hover,
  #main.kn .hp-prod:hover .hp-prod-img img,#main.kn .hp-sport-tiles a:hover .hp-st-img img,.product-card:hover .product-art img,.appearance-image-button:hover img,#main.kn .ds-sw:hover{transform:none}
  /* wie im Studio (Joe, 07.11.): auch kein Nachgeben beim Drücken */
  .button:not(:disabled):not(.disabled):not([aria-disabled="true"]):active,#main.kn .kn-btn:not(:disabled):active{transform:none}
}