/* Paso 3: movimiento solo con transform y opacity. */
@media(prefers-reduced-motion:no-preference){
 .motion-pending{opacity:0;transform:translateY(16px)}
 .motion-visible{animation:section-reveal .4s ease-out both}
 .products .product{animation:none;transition:transform .2s ease}
 .products .product.motion-pending{opacity:0;transform:translateY(16px)}
 .products .product.motion-visible{animation:section-reveal .38s ease-out both;animation-delay:var(--entry-delay,0ms)}
 @media(hover:hover) and (pointer:fine){
  .menu-card:hover{transform:translateY(-5px)}
  .menu-card:hover .card-icon{animation:icon-hop .35s ease-out}
  .card-media img{transition:transform .3s ease}
  .menu-card:hover .card-media img{transform:scale(1.025)}
 }
 .hero-note>span{animation:hero-float 4s ease-in-out infinite}
 .ticker-track{animation:ticker-travel 30s linear infinite}
 .ticker:hover .ticker-track,.ticker.is-paused .ticker-track{animation-play-state:paused}
 dialog{opacity:0;transform:translateY(12px) scale(.985);transition:opacity .18s ease,transform .18s ease,overlay .18s allow-discrete,display .18s allow-discrete}
 dialog[open]{opacity:1;transform:translateY(0) scale(1)}
 dialog::backdrop{opacity:0;transition:opacity .18s ease,overlay .18s allow-discrete,display .18s allow-discrete}
 dialog[open]::backdrop{opacity:1}
 @starting-style{dialog[open]{opacity:0;transform:translateY(12px) scale(.985)}dialog[open]::backdrop{opacity:0}}
}
.ticker{display:block;position:relative;overflow:hidden;padding-right:0}
.ticker-track{display:flex;width:max-content;gap:0;white-space:nowrap}
.ticker-copy{display:block;padding-right:3rem;flex-shrink:0}
.motion-pause{display:block;margin:8px auto 0;padding:8px 14px;min-height:44px;background:transparent;color:var(--ink);border:1px solid #b8a88d;border-radius:8px;font:inherit;font-size:.875rem;cursor:pointer}
@keyframes section-reveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-float{50%{transform:translateY(-5px) rotate(8deg)}}
@keyframes icon-hop{50%{transform:translateY(-6px) rotate(-3deg)}}
@keyframes ticker-travel{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
 .motion-pending{opacity:1!important;transform:none!important}
 .ticker-track{animation:none!important;white-space:normal;width:auto}
 .ticker-copy{white-space:normal}
 .ticker-copy+ .ticker-copy,.motion-pause{display:none}
}