/* =========================================================
   site-motion-v1.css – dezente Animationen für die öffentliche Website
   Zurückhaltend: sanftes Einblenden beim Scrollen, kleine Hover-Effekte.
========================================================= */
html{scroll-behavior:smooth}

/* Beim Scrollen sanft einblenden (nur wenn JS aktiv ist: html.sm-on) */
html.sm-on .sm-reveal{
    opacity:0;transform:translateY(22px);
    transition:opacity .6s ease,transform .65s cubic-bezier(.2,.7,.2,1);
    transition-delay:var(--sm-d,0s);
}
html.sm-on .sm-reveal.sm-in{opacity:1;transform:none}
/* Personen-/Sponsorenkarten: leicht vergrößert einblenden, Foto folgt mit kleiner Verzögerung */
html.sm-on .vp-card.sm-reveal,html.sm-on .sponsor-card-v99.sm-reveal,html.sm-on .trainer-card.sm-reveal,html.sm-on .download-card.sm-reveal{transform:translateY(26px) scale(.96)}
html.sm-on .vp-card.sm-reveal.sm-in,html.sm-on .sponsor-card-v99.sm-reveal.sm-in,html.sm-on .trainer-card.sm-reveal.sm-in,html.sm-on .download-card.sm-reveal.sm-in{transform:none}
html.sm-on .vp-card.sm-in .vp-photo{animation:smPhoto .8s cubic-bezier(.2,.8,.2,1) .15s both}
@keyframes smPhoto{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:none}}

/* Buttons: leichtes Anheben, beim Klick kurz einfedern */
.green-button,.outline,.btn{transition:transform .18s ease,box-shadow .25s ease,background-color .25s ease,color .25s ease}
.green-button:hover,.outline:hover{transform:translateY(-2px)}
.green-button:active,.outline:active,.btn:active{transform:scale(.97)}

/* Karten: weicher Schatten beim Darüberfahren */
.dept-card,.news-card,.fact,.floating-card,.feature-card,.board-card,.vp-card,.sponsor-card-v99,.download-card,.trainer-card,.wp-day{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease}
.dept-card:hover,.news-card:hover,.feature-card:hover,.board-card:hover,.vp-card:hover,.sponsor-card-v99:hover,.download-card:hover,.trainer-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,60,25,.16)}

@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    html.sm-on .sm-reveal{opacity:1;transform:none;transition:none}
    *,*::before,*::after{animation:none!important;transition:none!important}
}