html{scroll-behavior:smooth}body{font-size:16px}*:focus-visible{outline:none}a,button,input,select,textarea{outline:none}img{max-width:100%;height:auto;display:block}.

@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.motion-safe\:animate-none{animation:none!important;transition:none!important}}

.appear{opacity:0;transform:translateY(16px)}
.appear.is-visible{opacity:1;transform:translateY(0);transition:opacity 700ms ease-out,transform 700ms ease-out}

.case-card{transition:transform 200ms ease,box-shadow 200ms ease}
.case-card:hover,.case-card:focus{transform:translateY(-2px);box-shadow:0 14px 38px rgba(15,28,46,.18)}

.case-preview{transform-origin:top;animation:fadeUp 260ms ease-out both}

#mobileMenu .panel-enter{animation:menuIn 220ms ease-out both}
#mobileMenu .panel-exit{animation:menuOut 180ms ease-in both}

@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:translateY(0)}}
@keyframes menuIn{0%{opacity:0;transform:translateY(-8px)}100%{opacity:1;transform:translateY(0)}}
@keyframes menuOut{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-8px)}}
