.sticky-scroll-grid-wrapper{--gap: clamp(10px, 2vw, 40px);--gutter: 2rem;--offset: 0}@media (max-width: 600px){.sticky-scroll-grid-wrapper{--gutter: 1rem;--gap: clamp(5px, 1vw, 15px)}}@media (min-width: 1920px){.sticky-scroll-grid-wrapper{--gap: clamp(15px, 2.5vw, 50px)}}@media (min-width: 2560px){.sticky-scroll-grid-wrapper{--gap: clamp(20px, 2vw, 60px)}}.sticky-scroll-grid-header{min-height:20vh;display:flex;align-items:center;justify-content:center}.sticky-scroll-grid-header h1{line-height:.9}.sticky-scroll-grid-section{min-height:240vh;position:relative;background:var(--color-off-white, #F9F8F4)}.sticky-scroll-grid-content{min-height:100vh;width:100vw;display:flex;place-items:center;align-content:center;position:sticky;top:0;overflow:visible;z-index:2}@media (max-width: 768px){.sticky-scroll-grid-content{padding:0;justify-content:center;align-items:center;width:100vw;overflow-x:hidden}}.sticky-scroll-grid-main{width:calc(100% - (2 * var(--gutter)));height:calc(100vh - (2 * var(--gutter)));max-width:calc(100vw - (2 * var(--gutter)));padding:0;box-sizing:border-box;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(3,1fr);gap:var(--gap);margin:0 auto;align-content:stretch;position:relative;overflow:visible}@media (max-width: 1024px) and (min-width: 769px){.sticky-scroll-grid-main{grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(3,1fr);width:calc(100% - 2rem);max-width:calc(100vw - 2rem);margin:0 auto}}@media (max-width: 768px){.sticky-scroll-grid-main{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));width:calc(100vw - 2rem);height:auto;max-width:calc(100vw - 2rem);max-height:calc(100vh - 4rem);padding:0;margin:1rem;box-sizing:border-box;gap:clamp(5px,2vw,15px)}}.sticky-scroll-layer{display:grid;grid-column:1 / -1;grid-row:1 / -1;grid-template-columns:subgrid;grid-template-rows:subgrid}.sticky-scroll-image-wrapper{width:100%;height:100%;position:relative;overflow:hidden}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(1){grid-column:1;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(2){grid-column:2;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(3){grid-column:3;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(4){grid-column:4;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(5){grid-column:5;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(6){grid-column:1;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(7){grid-column:2;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(8){grid-column:4;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(9){grid-column:5;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(10){grid-column:1;grid-row:3}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(11){grid-column:2;grid-row:3}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(12){grid-column:3;grid-row:3}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(13){grid-column:4;grid-row:3}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(14){grid-column:5;grid-row:3}@media (max-width: 1024px) and (min-width: 769px){.sticky-scroll-scaler{grid-area:2 / 3}}@media (max-width: 768px){.sticky-scroll-layer[data-layer="1"] div:nth-of-type(1){grid-column:1;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(2){grid-column:2;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(3){grid-column:3;grid-row:1}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(4){grid-column:1;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(5){grid-column:2;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(6){grid-column:3;grid-row:2}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(7){grid-column:1;grid-row:3}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(8){grid-column:3;grid-row:3}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(9){grid-column:1;grid-row:4}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(10){grid-column:2;grid-row:4}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(11){grid-column:3;grid-row:4}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(12){grid-column:1;grid-row:5}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(13){grid-column:2;grid-row:5}.sticky-scroll-layer[data-layer="1"] div:nth-of-type(14){grid-column:3;grid-row:5}.sticky-scroll-scaler{grid-area:3 / 2}}@media (min-width: 1025px){.sticky-scroll-scaler{grid-area:2 / 3}}.sticky-scroll-scaler{position:relative;z-index:2;width:100%;height:100%;overflow:visible}.sticky-scroll-scaler-image{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);object-fit:cover;border-radius:1rem;aspect-ratio:auto;width:100%;height:100%;max-width:none;max-height:90vh;z-index:10}.sticky-scroll-image-wrapper img{width:100%;height:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:1rem;box-shadow:0 10px 30px #0000001a;transition:transform .3s cubic-bezier(.4,0,.2,1)}@media (max-width: 768px){.sticky-scroll-image-wrapper{height:auto}.sticky-scroll-image-wrapper img{aspect-ratio:4 / 5;border-radius:.5rem}}.sticky-scroll-image-wrapper a:hover img{transform:scale(1.05)}@keyframes sticky-scroll-fade{0%,55%{opacity:0}to{opacity:1}}@keyframes sticky-scroll-reveal{0%,30%{scale:0}to{scale:1}}@keyframes sticky-scroll-scale-x{0%,10%{width:calc(100vw - 3rem)}to{width:100%}}@keyframes sticky-scroll-scale-y{0%,10%{height:calc(100vh - 3rem)}to{height:100%}}@media (max-width: 768px){@keyframes sticky-scroll-scale-x{0%,10%{width:calc(100vw - 2rem)}to{width:100%}}@keyframes sticky-scroll-scale-y{0%,10%{height:calc(100vh - 2rem)}to{height:100%}}}:root{--power-1-out: cubic-bezier(.5, 0, .75, 1);--power-2-out: cubic-bezier(.5, 0, .5, 1);--power-3-out: cubic-bezier(.5, 0, .25, 1);--power-4-out: cubic-bezier(.5, 0, .1, 1);--sine: cubic-bezier(.4, 0, .6, 1)}@media (prefers-reduced-motion: no-preference){@supports (animation-timeline: scroll()) and (animation-range: 0 100%){.sticky-scroll-grid-wrapper[data-enhanced=true] .sticky-scroll-grid-section{view-timeline:--sticky-scroll-runner}.sticky-scroll-grid-wrapper[data-enhanced=true][data-center=true] .sticky-scroll-scaler-image{animation-name:sticky-scroll-scale-x,sticky-scroll-scale-y;animation-fill-mode:both;animation-timing-function:var(--power-2-out),var(--power-1-out);animation-timeline:--sticky-scroll-runner,--sticky-scroll-runner;animation-range:entry 100% exit -20%}.sticky-scroll-grid-wrapper[data-enhanced=true][data-layers=true] .sticky-scroll-layer{animation-name:sticky-scroll-fade,sticky-scroll-reveal;animation-fill-mode:both;animation-timeline:--sticky-scroll-runner,--sticky-scroll-runner;animation-timing-function:var(--sine),var(--power-1-out);animation-range:entry 100% exit 0%}.sticky-scroll-grid-wrapper[data-layers=true] .sticky-scroll-layer[data-layer="1"]{animation-timing-function:var(--sine),var(--power-1-out);animation-range:entry 100% exit 0%}}}.sticky-scroll-followup{min-height:20vh;display:flex;align-items:center;justify-content:center;position:relative;z-index:3}@media (max-width: 1024px){.sticky-scroll-scaler-image{max-width:none;max-height:85vh}}@media (max-width: 768px){.sticky-scroll-scaler-image{max-width:none;max-height:80vh}}@media (prefers-reduced-motion: reduce){.sticky-scroll-layer,.sticky-scroll-scaler-image{animation:none!important}.sticky-scroll-image-wrapper img{transition:none}}@media (hover: none) and (pointer: coarse){.sticky-scroll-layer{animation-duration:.3s!important}.sticky-scroll-image-wrapper img{transition-duration:.15s}}.sticky-scroll-image-wrapper a:focus-visible{outline:3px solid var(--color-neon, #D7FF01);outline-offset:4px;border-radius:1rem}.sticky-scroll-grid-wrapper[data-loading=true] .sticky-scroll-layer{opacity:0;transition:opacity .3s ease-in-out}.sticky-scroll-grid-wrapper:not([data-loading]) .sticky-scroll-layer{transition:opacity .5s ease-in-out}
/*# sourceMappingURL=/cdn/shop/t/10/assets/sticky-scroll-grid.css.map */