:root{--motion-instant:120ms;--motion-fast:180ms;--motion-ui:240ms;--motion-reveal:560ms;--motion-ease:cubic-bezier(.22,1,.36,1);--motion-standard:cubic-bezier(.4,0,.2,1);--motion-rise:18px}
.motion-ready .motion-reveal{opacity:0;transform:translate3d(0,var(--motion-rise),0);transition:opacity var(--motion-reveal) var(--motion-ease),transform var(--motion-reveal) var(--motion-ease)}
.motion-ready .motion-reveal.is-visible{opacity:1;transform:none}
.motion-ready .motion-stagger>*{opacity:0;transform:translate3d(0,14px,0);transition:opacity 480ms var(--motion-ease),transform 480ms var(--motion-ease);transition-delay:var(--motion-delay,0ms)}
.motion-ready .motion-stagger.is-visible>*{opacity:1;transform:none}
.motion-ready .hero .hero-content>*{opacity:0;transform:translate3d(0,16px,0);transition:opacity 620ms var(--motion-ease),transform 620ms var(--motion-ease);transition-delay:var(--hero-delay,0ms)}
.motion-ready .hero.is-visible .hero-content>*{opacity:1;transform:none}
.motion-ready .hero .hero-content>*:nth-child(2){--hero-delay:70ms}.motion-ready .hero .hero-content>*:nth-child(3){--hero-delay:140ms}.motion-ready .hero .hero-content>*:nth-child(4){--hero-delay:210ms}.motion-ready .hero .hero-content>*:nth-child(n+5){--hero-delay:260ms}
.motion-ready .hero .hero-image{opacity:.86;transform:scale(1.025);transition:opacity 850ms var(--motion-ease),transform 1100ms var(--motion-ease)}
.motion-ready .hero.is-visible .hero-image{opacity:1;transform:none}
.button,.quick-add,.category-navigation a,.guide-jump-grid a,.problem-shop-grid a{transition:transform var(--motion-fast) var(--motion-ease),background-color var(--motion-fast) var(--motion-standard),border-color var(--motion-fast) var(--motion-standard),color var(--motion-fast) var(--motion-standard),box-shadow var(--motion-fast) var(--motion-standard)}
.button:active,.quick-add:active,.category-navigation a:active,.problem-shop-grid a:active{transform:translateY(1px) scale(.985)}
.product-card,.category-card,.shop-essential-card,.shop-pet-card,.guide-card,.finder-card{transition:transform var(--motion-ui) var(--motion-ease),border-color var(--motion-ui) var(--motion-standard),box-shadow var(--motion-ui) var(--motion-standard)}
@media(hover:hover) and (pointer:fine){.product-card:hover,.category-card:hover,.shop-essential-card:hover,.shop-pet-card:hover,.guide-card:hover,.finder-card:hover{transform:translateY(-3px)}.product-card:hover .product-photo,.category-card:hover,.shop-essential-card:hover,.shop-pet-card:hover{box-shadow:0 14px 34px rgba(6,42,69,.11)}}
dialog[open]{animation:dialog-enter var(--motion-ui) var(--motion-ease) both}dialog::backdrop{animation:backdrop-enter var(--motion-ui) ease-out both}details>summary+*{animation:details-enter var(--motion-ui) var(--motion-ease) both}
@keyframes dialog-enter{from{opacity:0;transform:translate3d(0,10px,0) scale(.985)}to{opacity:1;transform:none}}@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}@keyframes details-enter{from{opacity:0;transform:translate3d(0,-5px,0)}to{opacity:1;transform:none}}
@media(max-width:760px){:root{--motion-reveal:460ms;--motion-rise:12px}.motion-ready .motion-stagger>*{transition-delay:min(var(--motion-delay,0ms),90ms)}.motion-ready .hero .hero-content>*{transition-duration:500ms}.motion-ready .hero .hero-image{transition-duration:700ms}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.motion-ready .motion-reveal,.motion-ready .motion-stagger>*,.motion-ready .hero .hero-content>*,.motion-ready .hero .hero-image{opacity:1!important;transform:none!important;transition:none!important}.button,.quick-add,.product-card,.category-card,.shop-essential-card,.shop-pet-card,.guide-card,.finder-card,.category-navigation a,.guide-jump-grid a,.problem-shop-grid a{transition:none!important}dialog[open],dialog::backdrop,details>summary+*{animation:none!important}}