/* Shared, restrained motion. Content and controls work without the motion script. */
:root{--motion-ease:cubic-bezier(.22,.68,.22,1);--motion-short:180ms;--motion-long:560ms}

.site-header nav a:after{content:'';position:absolute;bottom:0;left:50%;height:1px;width:13px;background:#c1a07f;transform:translateX(-50%);scale:0 1;transform-origin:center;transition:scale 240ms var(--motion-ease)}
.site-header nav a.nav-current:after{scale:1}
.nav-toggle>span{transition:transform 240ms var(--motion-ease)}
.landing-explore,.story-copy>a,.company-profile>a{transition:color 200ms,border-color 200ms,gap 300ms var(--motion-ease)}
.landing-explore span,.story-copy>a span{display:inline-block;transition:translate 300ms var(--motion-ease)}
.site-page .product-card{transition:translate 320ms var(--motion-ease),border-color 260ms,box-shadow 320ms}
.site-page .product-visual{overflow:hidden}
.site-page .product-visual img{transition:scale 600ms var(--motion-ease)}
.site-page .product-view{transition:translate 280ms var(--motion-ease),color 200ms}
.site-page .product-card:focus-within{border-color:#8bb8ce;box-shadow:0 0 0 1px #8bb8ce26}
.filters button,.admin-tabs button{transition:color 200ms,border-color 240ms,background 200ms}
:is(.btn,.add-button,.cart-button,.icon-button,.availability-button,.auth-button){transition:color 180ms,background 180ms,border-color 180ms,box-shadow 180ms,translate 180ms var(--motion-ease)}
:is(.btn,.add-button,.cart-button,.icon-button,.availability-button,.auth-button):active:not(:disabled){translate:0 1px}
:is(a,button,input,textarea,select,summary):focus-visible{outline:2px solid #b2d6e8;outline-offset:4px}
.admin-product,.order-card,.media-card{transition:background 200ms,border-color 200ms,box-shadow 200ms}
.toast{transition:opacity 220ms,transform 280ms var(--motion-ease)}

@media(hover:hover) and (pointer:fine){
  .site-header nav a:hover:after{scale:1}
  .site-page .product-card:hover{translate:0 -4px;border-color:#7099b0;box-shadow:0 16px 30px #00000029,0 0 22px #7bb9d009}
  .site-page .product-card:hover .product-visual img{scale:1.035}
  .site-page .product-card:hover .product-view{translate:2px -2px;color:#315e7a}
  .landing-explore:hover span,.story-copy>a:hover span{translate:4px -2px}
  .company-profile>a:hover{gap:40px}
}

@media(prefers-reduced-motion:no-preference){
  .landing-copy h1{animation:plb-enter 900ms var(--motion-ease) both}
  .landing-copy>p{animation:plb-enter 850ms 120ms var(--motion-ease) both}
  .landing-explore{animation:plb-enter 800ms 220ms var(--motion-ease) both}
  .landing-visual{animation:plb-visual-enter 1500ms var(--motion-ease) both}
  dialog[open]{animation:plb-dialog-enter 280ms var(--motion-ease)}
  dialog[open]::backdrop{animation:plb-fade 220ms ease-out}
  .drawer:not([hidden]){animation:plb-drawer-enter 340ms var(--motion-ease)}
  .scrim:not([hidden]){animation:plb-fade 220ms ease-out}
  details[open]>:not(summary){animation:plb-enter 250ms var(--motion-ease)}
  @media(max-width:760px){.site-header.menu-open nav{animation:plb-menu-enter 220ms var(--motion-ease)}}
}
@keyframes plb-enter{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@keyframes plb-visual-enter{from{opacity:.25;scale:1.035}to{opacity:1;scale:1}}
@keyframes plb-dialog-enter{from{opacity:0;translate:0 12px;scale:.99}to{opacity:1;translate:0 0;scale:1}}
@keyframes plb-drawer-enter{from{opacity:.35;translate:40px 0}to{opacity:1;translate:0 0}}
@keyframes plb-menu-enter{from{opacity:0;translate:0 -6px}to{opacity:1;translate:0 0}}
@keyframes plb-fade{from{opacity:0}to{opacity:1}}

@media(max-width:760px){.site-header nav a:after{display:none}}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .site-page .product-card:hover,.site-page .product-card:hover .product-view,.landing-explore:hover span,.story-copy>a:hover span{translate:none}
  .site-page .product-card:hover .product-visual img{scale:1}
  :is(.btn,.add-button,.cart-button,.icon-button,.availability-button,.auth-button):active:not(:disabled){translate:none}
}
