/* Direction-aware scroll reveals: a reusable, lightweight motion layer for subpages. */
body.has-immersive-motion.has-motion [data-immersive-kind="section"]{
  opacity:.16;
  transform:translate3d(0,38px,0) scale(.99);
  filter:blur(1px);
  transition:opacity .76s cubic-bezier(.2,.72,.22,1),transform .84s cubic-bezier(.2,.72,.22,1),filter .76s ease;
}
body.has-immersive-motion.has-motion [data-immersive-kind="section"][data-immersive-origin="above"]:not(.is-immersive-visible){
  transform:translate3d(0,-38px,0) scale(.99);
}
body.has-immersive-motion.has-motion [data-immersive-kind="section"].is-immersive-visible{
  opacity:1;
  transform:none;
  filter:none;
}

/* Product cards enter like small floating panels; direction reverses on upward scroll. */
body.has-immersive-motion.has-motion [data-immersive-kind="card"]{
  transition:opacity .58s cubic-bezier(.2,.72,.22,1),transform .72s cubic-bezier(.2,.72,.22,1),box-shadow .35s ease;
}
body.has-immersive-motion.has-motion [data-immersive-kind="card"][data-immersive-origin="below"]:not(.is-immersive-visible){
  opacity:.08;
  transform:perspective(1000px) translate3d(0,38px,-20px) rotateX(7deg) scale(.975);
}
body.has-immersive-motion.has-motion [data-immersive-kind="card"][data-immersive-origin="above"]:not(.is-immersive-visible){
  opacity:.08;
  transform:perspective(1000px) translate3d(0,-38px,-20px) rotateX(-7deg) scale(.975);
}
body.has-immersive-motion.has-motion [data-immersive-kind="card"].is-immersive-visible{
  opacity:1;
  transform:none;
}
body.has-immersive-motion.has-motion [data-immersive-kind="card"].is-immersive-visible:hover{
  transform:translateY(-7px);
}

/* On product and category heroes, copy and photography travel in opposite directions. */
body.has-immersive-motion.has-motion [data-immersive-kind="section"].product-hero:not(.is-immersive-visible) .product-hero-copy,
body.has-immersive-motion.has-motion [data-immersive-kind="section"].category-hero:not(.is-immersive-visible) .category-hero-copy{
  opacity:0;
  transform:translate3d(-32px,0,0) rotateY(2deg);
}
body.has-immersive-motion.has-motion [data-immersive-kind="section"].product-hero:not(.is-immersive-visible) .product-hero-photo,
body.has-immersive-motion.has-motion [data-immersive-kind="section"].category-hero:not(.is-immersive-visible) .category-hero-image{
  opacity:0;
  transform:perspective(1000px) translate3d(32px,0,0) rotateY(-3deg) scale(.98);
}
body.has-immersive-motion.has-motion [data-immersive-kind="section"][data-immersive-origin="above"].product-hero:not(.is-immersive-visible) .product-hero-copy,
body.has-immersive-motion.has-motion [data-immersive-kind="section"][data-immersive-origin="above"].category-hero:not(.is-immersive-visible) .category-hero-copy{
  transform:translate3d(32px,0,0) rotateY(-2deg);
}
body.has-immersive-motion.has-motion [data-immersive-kind="section"][data-immersive-origin="above"].product-hero:not(.is-immersive-visible) .product-hero-photo,
body.has-immersive-motion.has-motion [data-immersive-kind="section"][data-immersive-origin="above"].category-hero:not(.is-immersive-visible) .category-hero-image{
  transform:perspective(1000px) translate3d(-32px,0,0) rotateY(3deg) scale(.98);
}
body.has-immersive-motion.has-motion [data-immersive-kind="section"] .product-hero-copy,
body.has-immersive-motion.has-motion [data-immersive-kind="section"] .category-hero-copy,
body.has-immersive-motion.has-motion [data-immersive-kind="section"] .product-hero-photo,
body.has-immersive-motion.has-motion [data-immersive-kind="section"] .category-hero-image{
  transition:opacity .82s cubic-bezier(.2,.72,.22,1),transform .92s cubic-bezier(.2,.72,.22,1);
}

/* Gentle depth drift on existing product/category photography, with no asset or fact changes. */
body.has-immersive-motion.has-motion .product-hero-photo>img,
body.has-immersive-motion.has-motion .category-hero-image>img{
  transform:translate3d(0,var(--tb-immersive-image-y,0px),0) scale(1.035);
  transition:transform .18s linear;
  will-change:transform;
}
body.motion-paused .product-hero-photo>img,
body.motion-paused .category-hero-image>img{
  transform:none!important;
  will-change:auto;
}

/* A slim gold travel-progress line makes long product and editorial pages legible. */
body .header .scroll-progress{
  position:absolute!important;
  z-index:130!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  width:100%!important;
  height:2px!important;
  background:linear-gradient(90deg,#9d773b 0%,#ecd89d 52%,#b9853d 100%)!important;
  transform:scaleX(0);
  transform-origin:left center;
  opacity:.92;
  pointer-events:none;
  box-shadow:0 0 11px rgba(216,182,102,.28);
}

body.motion-paused [data-immersive-kind],
body.motion-paused [data-immersive-kind="section"] .product-hero-copy,
body.motion-paused [data-immersive-kind="section"] .category-hero-copy,
body.motion-paused [data-immersive-kind="section"] .product-hero-photo,
body.motion-paused [data-immersive-kind="section"] .category-hero-image{
  opacity:1!important;
  transform:none!important;
  filter:none!important;
  transition:none!important;
}
@media(prefers-reduced-motion:reduce){
  [data-immersive-kind],
  [data-immersive-kind="section"] .product-hero-copy,
  [data-immersive-kind="section"] .category-hero-copy,
  [data-immersive-kind="section"] .product-hero-photo,
  [data-immersive-kind="section"] .category-hero-image{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    transition:none!important;
    will-change:auto!important;
  }
  .product-hero-photo>img,.category-hero-image>img{transform:none!important;will-change:auto!important}
  body .header .scroll-progress{box-shadow:none}
}
@media(max-width:720px){
  body.has-immersive-motion.has-motion [data-immersive-kind="section"]{transform:translate3d(0,25px,0) scale(.995)}
  body.has-immersive-motion.has-motion [data-immersive-kind="section"][data-immersive-origin="above"]:not(.is-immersive-visible){transform:translate3d(0,-25px,0) scale(.995)}
  body.has-immersive-motion.has-motion [data-immersive-kind="card"][data-immersive-origin="below"]:not(.is-immersive-visible){transform:perspective(850px) translate3d(0,28px,-10px) rotateX(5deg) scale(.985)}
  body.has-immersive-motion.has-motion [data-immersive-kind="card"][data-immersive-origin="above"]:not(.is-immersive-visible){transform:perspective(850px) translate3d(0,-28px,-10px) rotateX(-5deg) scale(.985)}
}