/* Three local sneaker photos appear through the letter shapes, without canvas. */
.hero-copy{overflow:clip}
.hero h1.sneaker-title{position:relative;isolation:isolate}
.title-photo-layer{display:block}
.title-photo-layer:not(:first-child){position:absolute;inset:0;pointer-events:none;opacity:0}
.hero h1.sneaker-title em{background:none;-webkit-text-fill-color:inherit;color:inherit;animation:none}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
 .title-photo-layer{background-color:#b98b9d;background-image:url('assets/sneaker-red.jpg');background-size:cover;background-position:50% 50%;background-blend-mode:multiply;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:.45px #68112f;animation:title-photo-pan 16s ease-in-out infinite alternate}
 .title-photo-2{background-image:url('assets/sneakers.jpg');background-position:50% 48%;animation:title-second 21s ease-in-out infinite,title-photo-pan 18s ease-in-out infinite alternate}
 .title-photo-3{background-image:url('assets/leather-shoes.jpg');animation:title-third 21s ease-in-out infinite,title-photo-pan 20s ease-in-out infinite alternate}
}
@keyframes title-photo-pan{from{background-position:42% 42%;background-size:110% auto}to{background-position:59% 59%;background-size:125% auto}}
@keyframes title-second{0%,25%{opacity:0}34%,57%{opacity:1}66%,100%{opacity:0}}
@keyframes title-third{0%,58%{opacity:0}67%,90%{opacity:1}100%{opacity:0}}
html[data-motion=off] .title-photo-layer{animation:none}
html[data-motion=off] .title-photo-layer:not(:first-child){display:none}
@media(prefers-reduced-motion:reduce){.title-photo-layer{animation:none!important}.title-photo-layer:not(:first-child){display:none}}
@media(forced-colors:active){.title-photo-layer{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText;-webkit-text-stroke:0;animation:none}.title-photo-layer:not(:first-child){display:none}}