/* Gentle motion across the site. Everything switches off for people who prefer reduced motion. */

/* scroll reveal (only when the script is running) */
.jt-js .jt-rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform .7s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.jt-js .jt-rv.is-in,.jt-reveal-all .jt-rv{opacity:1;transform:none}

/* hero: text slides up when its slide is shown, the shirt floats */
.jt-js .jt-slide .jt-wrap > div:first-child > *{opacity:0;transform:translateY(28px)}
.jt-js .jt-slide.is-active .jt-wrap > div:first-child > *{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.jt-js .jt-slide.is-active .jt-wrap > div:first-child > *:nth-child(1){transition-delay:.15s}
.jt-js .jt-slide.is-active .jt-wrap > div:first-child > *:nth-child(2){transition-delay:.3s}
.jt-js .jt-slide.is-active .jt-wrap > div:first-child > *:nth-child(3){transition-delay:.45s}
.jt-slide .art svg{animation:jtBob 5s ease-in-out infinite}
@keyframes jtBob{0%,100%{translate:0 0}50%{translate:0 -12px}}

/* menu */
@media (min-width:1301px){
  .jt-menu > li > a{position:relative}
  .jt-menu > li > a::after{content:"";position:absolute;left:0;right:100%;bottom:8px;height:2px;background:#F5B83D;transition:right .3s cubic-bezier(.3,.7,.2,1)}
  .jt-menu > li:hover > a::after,.jt-menu > li:focus-within > a::after{right:0}
  .jt-menu li:hover > .sub-menu,.jt-menu li:focus-within > .sub-menu{animation:jtDrop .24s ease both}
}
@keyframes jtDrop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* buttons and tiles */
.jt-btn,.woocommerce a.button,.woocommerce button.button,button.single_add_to_cart_button{transition:background .15s,color .15s,border-color .15s,translate .2s,scale .15s,box-shadow .2s}
.jt-btn:active,.woocommerce a.button:active,button.single_add_to_cart_button:active{scale:.97}
.jt-tile{transition:translate .3s cubic-bezier(.3,.7,.2,1),box-shadow .3s,border-color .2s}
.jt-tile span::after{content:"\2192";display:inline-block;margin-left:8px;transition:translate .3s}
.jt-tile.sm span::after{display:none}
@media (hover:hover){
  .jt-btn:hover{translate:0 -2px;box-shadow:0 8px 18px rgba(0,0,0,.18)}
  .jt-tile:hover{translate:0 -6px;box-shadow:0 14px 30px rgba(0,0,0,.18)}
  .jt-tile:hover span::after{translate:6px 0}
  ul.products li.product{transition:translate .3s cubic-bezier(.3,.7,.2,1)}
  ul.products li.product:hover{translate:0 -4px}
  ul.products li.product a img{transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .3s}
  ul.products li.product:hover a img{transform:scale(1.04);transform-origin:50% 0}
  .jt-foot a,.jt-more{transition:color .2s}
}
ul.products li.product .button{transition:background .15s,color .15s,translate .2s}

/* sale badge breathes */
span.onsale{animation:jtBadge 2.8s ease-in-out infinite}
@keyframes jtBadge{0%,100%{scale:1}50%{scale:1.08}}

/* product page */
.single-product .woocommerce-product-gallery{animation:jtFadeUp .7s cubic-bezier(.2,.7,.2,1) both}
.single-product .summary{animation:jtFadeUp .7s .12s cubic-bezier(.2,.7,.2,1) both}
@keyframes jtFadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.jt-chip input:checked + span{animation:jtPop .28s cubic-bezier(.3,1.6,.5,1)}
.jt-card,.jt-patch,.jt-toggle{transition:border-color .2s,box-shadow .25s,background .2s}
button.single_add_to_cart_button{position:relative;overflow:hidden}
button.single_add_to_cart_button::before{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-20deg);animation:jtSweep 5.5s ease-in-out 1.5s infinite;pointer-events:none}
@keyframes jtSweep{0%,70%{left:-60%}100%{left:130%}}

/* header gets a soft shadow once the page scrolls (class added by script) */
.jt-announce span{animation:jtFadeUp .6s both}

@media (prefers-reduced-motion:reduce){
  .jt-js .jt-rv,.jt-js .jt-slide .jt-wrap > div:first-child > *{opacity:1!important;transform:none!important;transition:none!important}
  .jt-slide .art svg,span.onsale,.single-product .woocommerce-product-gallery,.single-product .summary,.jt-chip input:checked + span,button.single_add_to_cart_button::before,.jt-announce span{animation:none!important}
  .jt-tile,.jt-btn,ul.products li.product,ul.products li.product a img{transition:none!important}
}
