/* Motion enhances content; nothing depends on it to remain visible. */
.button,.order,.text-link,.categories a,.contact{transition:background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .25s ease}
.card{transition:box-shadow .35s ease,background-color .35s ease}
.card-image img,.feature-art img,.product-visual img{transition:transform .65s cubic-bezier(.22,1,.36,1)}
.categories a:active,.button:active{transform:scale(.98)}
@media(hover:hover) and (pointer:fine){
 .card:hover{box-shadow:0 12px 34px rgba(0,0,0,.065)}
 .card:hover .card-image img{transform:scale(1.045)}
 .feature:hover .feature-art img,.product-visual:hover img{transform:scale(1.025)}
 .button:hover{transform:translateY(-2px);box-shadow:0 7px 18px rgba(0,0,0,.13)}
 .text-link:hover,.order:hover{color:#005bb5}
}
@media(prefers-reduced-motion:no-preference){
 .motion-enter{animation:gsm-arrive .68s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--arrival-delay,0ms)}
 .checkout[open]{animation:gsm-dialog .22s ease-out}
 .checkout[open]::backdrop{animation:gsm-backdrop .22s ease-out}
 .product-policies details[open]>:not(summary){animation:gsm-detail .25s ease-out}
 @keyframes gsm-arrive{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
 @keyframes gsm-dialog{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
 @keyframes gsm-backdrop{from{opacity:0}to{opacity:1}}
 @keyframes gsm-detail{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .card-image img,.feature-art img,.product-visual img,.button{transform:none!important}
}

@media(prefers-reduced-motion:no-preference){.sell-faq[open]>p,.question-help[open]>p{animation:gsm-detail .25s ease-out}.sell-process article:nth-child(2){--arrival-delay:70ms}.sell-process article:nth-child(3){--arrival-delay:140ms}}
