@keyframes nb-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes nb-rise-filter { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes nb-glow { 0%,100% { opacity: .25; transform: translateY(-50%) scale(1); } 50% { opacity: .48; transform: translateY(-50%) scale(1.035); } }
@keyframes nb-sheen { from { transform: translateX(-130%) skewX(-18deg); } to { transform: translateX(230%) skewX(-18deg); } }
@keyframes nb-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(228,38,42,.36); } 50% { box-shadow: 0 0 0 9px rgba(228,38,42,0); } }

.hero-copy { animation: nb-rise .8s cubic-bezier(.2,.75,.2,1) both; }
.hero-nb { animation: nb-glow 5s ease-in-out infinite; }
.perks p { animation: nb-rise .55s both; }
.perks p:nth-child(2) { animation-delay: .12s; }.perks p:nth-child(3) { animation-delay: .24s; }
.card { overflow: hidden; }
.btn { position: relative; overflow: hidden; transition: transform .25s ease, filter .25s ease !important; }
.btn:hover { transform: translateY(-3px) scale(1.015); filter: brightness(1.08); }
.btn.red:hover { animation: nb-pulse 1.1s infinite; }
.photo img, .product-photo img { transition: transform .55s cubic-bezier(.2,.75,.2,1) !important; }
.card:hover .photo img { transform: scale(1.08); }
.card.filter-enter{animation:nb-rise-filter .6s ease both!important;animation-delay:var(--filter-delay,0ms)!important}
@media(prefers-reduced-motion:reduce){.card.filter-enter{animation:none!important}}
.cart { transition: border-color .2s, background .2s; }.cart:hover { border-color: var(--red); background: rgba(228,38,42,.08); }
.js-scroll-ready .scroll-reveal{
  opacity:0;
  transform:translate3d(0,22px,0);
  transition:
    opacity .5s ease var(--reveal-delay,0ms),
    transform .76s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms);
  will-change:opacity,transform;
}
.js-scroll-ready .scroll-reveal.reveal-from-left{transform:translate3d(-30px,0,0)}
.js-scroll-ready .scroll-reveal.reveal-from-right{transform:translate3d(30px,0,0)}
.js-scroll-ready .scroll-reveal.reveal-scale{transform:translate3d(0,10px,0) scale(.985)}
.js-scroll-ready .scroll-reveal.reveal-clip{
  clip-path:inset(0 0 100% 0);
  transform:translate3d(0,12px,0);
  transition:
    opacity .42s ease var(--reveal-delay,0ms),
    transform .68s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms),
    clip-path .78s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms);
}
.js-scroll-ready .scroll-reveal.is-revealed{opacity:1;transform:translate3d(0,0,0) scale(1)}
.js-scroll-ready .scroll-reveal.reveal-clip.is-revealed{clip-path:inset(0)}
.js-scroll-ready .home-catalogue .grid .card.scroll-reveal{transition-duration:.58s,.72s}
.js-scroll-ready .scroll-reveal .photo img,.js-scroll-ready .scroll-reveal .category-visual-media img{transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
/* Catalogue : la photo et les informations se révèlent dans la carte, sans déplacer son cadre. */
.js-scroll-ready .home-catalogue .grid .card.scroll-reveal .photo{
  clip-path:inset(0 0 8% 0 round 10px 10px 0 0);
  transform:scale(.972);
  transition:
    clip-path .7s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms),
    transform .78s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms);
  will-change:clip-path,transform;
}
.js-scroll-ready .home-catalogue .grid .card.scroll-reveal>div{
  opacity:0;
  transform:translateY(10px);
  transition:
    opacity .38s ease calc(var(--reveal-delay,0ms) + 90ms),
    transform .56s cubic-bezier(.16,1,.3,1) calc(var(--reveal-delay,0ms) + 90ms);
  will-change:opacity,transform;
}
.js-scroll-ready .home-catalogue .grid .card.scroll-reveal.is-revealed .photo{
  clip-path:inset(0 round 10px 10px 0 0);
  transform:scale(1);
}
.js-scroll-ready .home-catalogue .grid .card.scroll-reveal.is-revealed>div{
  opacity:1;
  transform:translateY(0);
}
@media(prefers-reduced-motion:reduce){.js-scroll-ready .scroll-reveal,.js-scroll-ready .scroll-reveal.reveal-from-left,.js-scroll-ready .scroll-reveal.reveal-from-right,.js-scroll-ready .scroll-reveal.reveal-scale,.js-scroll-ready .scroll-reveal.reveal-clip{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}}
@media (prefers-reduced-motion: reduce) { *,*::after { animation: none !important; transition: none !important; } }