/* ===========================================================
   PetLumos motion layer  (appended by motion upgrade)
   Conventions:
   - html.pl-motion  = animations enabled (JS adds it)
   - html.pl-motion-off = reduced-motion / JS off -> everything visible
   =========================================================== */

/* ---------- guard: no JS or reduced motion => fully visible ---------- */
html:not(.pl-motion) .pl-reveal,
html:not(.pl-motion) .pl-w{opacity:1!important;transform:none!important;filter:none!important}

/* ---------- shared easing ---------- */
html.pl-motion{
  scroll-behavior:smooth;
}
.pl-ease{--pl-e:cubic-bezier(.22,.61,.36,1)}

/* ---------- scroll reveal ---------- */
html.pl-motion .pl-reveal{
  opacity:0;
  transform:translateY(26px);
  transition:
    opacity .75s cubic-bezier(.22,.61,.36,1),
    transform .75s cubic-bezier(.22,.61,.36,1),
    filter .75s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--pl-d,0ms);
  will-change:opacity,transform;
}
html.pl-motion .pl-reveal[data-pl-fx="blur"]{
  filter:blur(10px);
  transform:translateY(18px);
}
html.pl-motion .pl-reveal[data-pl-fx="left"]{transform:translateX(-34px)}
html.pl-motion .pl-reveal[data-pl-fx="right"]{transform:translateX(34px)}
html.pl-motion .pl-reveal[data-pl-fx="zoom"]{transform:scale(.94)}
html.pl-motion .pl-reveal.pl-in{
  opacity:1;
  transform:none;
  filter:none;
  will-change:auto;
}

/* ---------- hero word-by-word entrance ---------- */
html.pl-motion .pl-hero__title .pl-w{
  display:inline-block;
  opacity:0;
  transform:translateY(.55em) rotate(.5deg);
  filter:blur(7px);
  transform-origin:0 100%;
  transition:
    opacity .8s cubic-bezier(.22,.61,.36,1),
    transform .8s cubic-bezier(.22,.61,.36,1),
    filter .8s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--pl-d,0ms);
}
html.pl-motion .pl-in .pl-w{
  opacity:1;
  transform:none;
  filter:none;
}

/* ---------- header gains a shadow as you scroll ---------- */
html.pl-motion .ct-header{transition:box-shadow .35s ease}
html.pl-motion .pl-scrolled .ct-header{
  box-shadow:0 6px 24px rgba(42,36,32,.08);
}

/* ---------- marquee strip ---------- */
.pl-marquee{
  position:relative;
  overflow:hidden;
  padding:14px 0;
  background:var(--pl-ink);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.pl-marquee__track{
  display:flex;
  width:max-content;
  animation:pl-marquee 30s linear infinite;
}
.pl-marquee:hover .pl-marquee__track{animation-play-state:paused}
.pl-marquee__group{
  display:flex;
  align-items:center;
  gap:2.6rem;
  padding-right:2.6rem;
  white-space:nowrap;
}
.pl-marquee__group span{
  font-family:var(--pl-serif);
  font-size:.92rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#F6EEE4;
  opacity:.92;
}
.pl-marquee__group i{
  width:6px;height:6px;border-radius:50%;
  background:var(--pl-terra);
  flex:none;
}
@keyframes pl-marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .pl-marquee__track{animation:none;flex-wrap:wrap}
  .pl-marquee{overflow:auto}
}

/* ---------- product card motion ---------- */
html.pl-motion ul.products li.product{
  transition:transform .45s cubic-bezier(.22,.61,.36,1),box-shadow .45s ease;
}
html.pl-motion ul.products li.product:hover{
  transform:translateY(-8px);
}
html.pl-motion ul.products li.product img{
  transition:transform .7s cubic-bezier(.2,.6,.2,1),filter .7s ease;
}
html.pl-motion ul.products li.product:hover img{
  transform:scale(1.07);
  filter:saturate(1.06);
}

/* add-to-cart button slides up into view */
html.pl-motion ul.products li.product .button,
html.pl-motion ul.products li.product .added_to_cart{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .35s ease .05s,transform .35s cubic-bezier(.22,.61,.36,1) .05s,background .2s ease,color .2s ease;
}
html.pl-motion ul.products li.product:hover .button,
html.pl-motion ul.products li.product:hover .added_to_cart,
html.pl-motion ul.products li.product:focus-within .button{
  opacity:1;
  transform:none;
}
/* keep visible on touch devices */
@media (hover:none){
  html.pl-motion ul.products li.product .button,
  html.pl-motion ul.products li.product .added_to_cart{opacity:1;transform:none}
}

/* ---------- category card motion ---------- */
html.pl-motion .pl-cats .wp-block-column .wp-block-image img{
  transition:transform .8s cubic-bezier(.2,.6,.2,1);
}
html.pl-motion .pl-cats .wp-block-column:hover .wp-block-image img{
  transform:scale(1.08) rotate(.4deg);
}
html.pl-motion .pl-cats .wp-block-column{
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
}
html.pl-motion .pl-cats .wp-block-column:hover{transform:translateY(-6px)}

/* ---------- story image parallax-lite (hover tilt) ---------- */
html.pl-motion .pl-story__img img{
  transition:transform .9s cubic-bezier(.2,.6,.2,1);
}
html.pl-motion .pl-story__img:hover img{transform:scale(1.04)}

/* ---------- button micro-interactions ---------- */
html.pl-motion .wp-block-button__link,
html.pl-motion .button{
  transition:transform .25s cubic-bezier(.22,.61,.36,1),box-shadow .25s ease,background-color .25s ease,color .25s ease;
}
html.pl-motion .wp-block-button__link:hover,
html.pl-motion .pl-btn:hover{
  transform:translateY(-2px);
}
html.pl-motion .wp-block-button__link:active,
html.pl-motion .pl-btn:active{
  transform:translateY(0) scale(.985);
}

/* ---------- reviews cards breathe on hover ---------- */
html.pl-motion .pl-reviews__grid .wp-block-column{
  transition:transform .4s cubic-bezier(.22,.61,.36,1),box-shadow .4s ease;
}
html.pl-motion .pl-reviews__grid .wp-block-column:hover{
  transform:translateY(-5px);
  box-shadow:var(--pl-shadow-h);
}

/* ---------- inputs: focus glow ---------- */
html.pl-motion input[type="text"]:focus,
html.pl-motion input[type="email"]:focus,
html.pl-motion input[type="tel"]:focus,
html.pl-motion input[type="password"]:focus,
html.pl-motion textarea:focus{
  transition:box-shadow .25s ease,border-color .25s ease;
  box-shadow:0 0 0 4px rgba(224,118,90,.12);
}

/* ---------- footer link underline sweep ---------- */
html.pl-motion .pl-footer-links a{
  position:relative;
}
html.pl-motion .pl-footer-links a::after{
  content:"";
  position:absolute;
  left:0;bottom:-2px;
  width:100%;height:1.5px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:0 50%;
  transition:transform .3s cubic-bezier(.22,.61,.36,1);
}
html.pl-motion .pl-footer-links a:hover::after{transform:scaleX(1)}

/* ---------- nav link underline sweep ---------- */
html.pl-motion .ct-header .menu > li > a{
  position:relative;
}
html.pl-motion .ct-header .menu > li > a::after{
  content:"";
  position:absolute;
  left:12%;right:12%;bottom:2px;
  height:2px;border-radius:2px;
  background:var(--pl-terra);
  transform:scaleX(0);
  transform-origin:50% 50%;
  transition:transform .3s cubic-bezier(.22,.61,.36,1);
}
html.pl-motion .ct-header .menu > li:hover > a::after,
html.pl-motion .ct-header .menu > li.current-menu-item > a::after{
  transform:scaleX(1);
}

/* ---------- price subtle emphasis on sale badge ---------- */
html.pl-motion ul.products li.product .onsale{
  animation:pl-pop .45s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes pl-pop{
  from{opacity:0;transform:scale(.6)}
  to{opacity:1;transform:scale(1)}
}

/* ---------- mobile: lighter transforms only ---------- */
@media (max-width:768px){
  html.pl-motion .pl-reveal{transform:translateY(16px)}
  html.pl-motion .pl-reveal[data-pl-fx="left"],
  html.pl-motion .pl-reveal[data-pl-fx="right"]{transform:translateY(16px)}
}

/* ---------- accessibility: user prefers reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html.pl-motion .pl-reveal,
  html.pl-motion .pl-w,
  html.pl-motion ul.products li.product,
  html.pl-motion ul.products li.product img,
  html.pl-motion .wp-block-button__link{
    transition:none!important;
    animation:none!important;
    opacity:1!important;
    transform:none!important;
    filter:none!important;
  }
  html.pl-motion{scroll-behavior:auto}
}
