:root{--images-with-text-scroll-master-image-ratio: 1;--images-with-text-scroll-text-alignment: left;--images-with-text-scroll-overlay: rgba(0, 0, 0, 0);--section-vertical-spacing: 2rem;--container-gutter: 1rem;--announcement-bar-is-sticky: 0;--announcement-bar-height: 0px;--header-is-sticky: 0;--header-height: 0px}.images-with-text-scroll{--sticky-area-height: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-height, 0px));position:relative;min-height:100vh;display:grid;padding-top:var(--section-top-padding, 4rem);padding-bottom:var(--section-bottom-padding, 4rem);margin-top:var(--section-top-margin, 2.5rem);margin-bottom:var(--section-bottom-margin, 2.5rem)}.images-with-text-scroll[data-background-type=image]{background-image:var(--background-image-url);background-size:var(--background-size, cover);background-position:var(--background-position, center);background-repeat:no-repeat;background-attachment:var(--background-attachment, fixed)}.images-with-text-scroll[data-background-type=color]{background-color:var(--background-color, #f8f8f8)}.images-with-text-scroll:before{content:"";background:rgb(var(--images-with-text-scroll-overlay));z-index:1;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0}.images-with-text-scroll__container{position:relative;z-index:1;place-items:start center;row-gap:2rem;padding-block-start:var(--section-vertical-spacing);padding-block-end:var(--section-vertical-spacing);display:grid}.images-with-text-scroll__item{display:contents}.images-with-text-scroll__item:not(:first-child)>.images-with-text-scroll__image{opacity:1}.images-with-text-scroll__image{grid-area:1 / 1;align-self:center;transition:opacity .5s ease;width:var(--images-with-text-scroll-image-width, 50%);max-width:var(--images-with-text-scroll-image-width, 50%)}.images-with-text-scroll__text{text-align:center;grid-area:2 / 1;max-width:375px;color:var(--text-color, #000);font-size:var(--images-with-text-scroll-text-size, 16px);z-index:2;position:relative;opacity:1;transition:opacity .3s ease,transform .3s ease;transform:translateY(0)}.button{display:inline-block;padding:12px 24px;background:#000;color:#fff;text-decoration:none;border-radius:4px;border:none;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease}.button:hover{background:#333;transform:translateY(-1px)}.button--secondary{background:transparent;color:#000;border:1px solid #000}.button--secondary:hover{background:#000;color:#fff}.button--tertiary{background:transparent;color:#000;border:none;text-decoration:underline}.button--tertiary:hover{background:transparent;color:#333}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.container--md{max-width:800px}.prose{line-height:1.6}.prose .h6{font-size:14px;font-weight:600;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px;color:var(--subheading-color, #666)}.prose .h1,.prose .h2,.prose .h3,.prose .h4,.prose .h5,.prose .h6{margin-bottom:16px;line-height:1.2;color:var(--heading-color, #000)}.prose p{margin-bottom:16px}.prose p:last-child{margin-bottom:0}.rte{line-height:1.6;color:var(--text-color, #333)}.rte p{margin-bottom:16px;color:var(--text-color, #333)}.rte p:last-child{margin-bottom:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.page-dots{display:none;justify-content:center;align-items:center;gap:8px;padding:16px 0;position:relative;z-index:10}.images-with-text-scroll[data-animation=fade] .images-with-text-scroll__item{transition:opacity var(--animation-duration, .6s) ease-in-out}.images-with-text-scroll[data-animation=slide] .images-with-text-scroll__item{transition:transform var(--animation-duration, .6s) ease-in-out}.images-with-text-scroll[data-animation=scale] .images-with-text-scroll__item{transition:transform var(--animation-duration, .6s) ease-in-out,opacity var(--animation-duration, .6s) ease-in-out}.images-with-text-scroll[data-animation=flip] .images-with-text-scroll__item{transition:transform var(--animation-duration, .6s) ease-in-out;transform-style:preserve-3d}.images-with-text-scroll[data-animation=slide-up] .images-with-text-scroll__item{transition:transform var(--animation-duration, .6s) ease-in-out,opacity var(--animation-duration, .6s) ease-in-out}.images-with-text-scroll__item{opacity:0;transform:translate(100%)}.images-with-text-scroll__item.is-selected{opacity:1;transform:translate(0)}.images-with-text-scroll[data-animation=fade] .images-with-text-scroll__item,.images-with-text-scroll[data-animation=fade] .images-with-text-scroll__item.is-selected{transform:none}.images-with-text-scroll[data-animation=slide] .images-with-text-scroll__item{transform:translate(100%)}.images-with-text-scroll[data-animation=slide] .images-with-text-scroll__item.is-selected{transform:translate(0)}.images-with-text-scroll[data-animation=scale] .images-with-text-scroll__item{transform:scale(.8)}.images-with-text-scroll[data-animation=scale] .images-with-text-scroll__item.is-selected{transform:scale(1)}.images-with-text-scroll[data-animation=flip] .images-with-text-scroll__item{transform:rotateY(90deg)}.images-with-text-scroll[data-animation=flip] .images-with-text-scroll__item.is-selected{transform:rotateY(0)}.images-with-text-scroll[data-animation=slide-up] .images-with-text-scroll__item{transform:translateY(50px)}.images-with-text-scroll[data-animation=slide-up] .images-with-text-scroll__item.is-selected{transform:translateY(0)}.page-dots .tap-area{width:8px;height:8px;border-radius:50%;background-color:#ffffff80;border:none;cursor:pointer;transition:all .3s ease;position:relative}.page-dots .tap-area:hover{background-color:#fffc;transform:scale(1.2)}.page-dots .tap-area[aria-current=true]{background-color:#fff;transform:scale(1.3)}.page-dots .tap-area:focus{outline:2px solid rgba(255,255,255,.8);outline-offset:2px}@media screen and (min-width: 1000px){.page-dots{display:none}}@media screen and (min-width: 700px){.images-with-text-scroll__container{row-gap:3rem}}@media screen and (max-width: 999px){.images-with-text-scroll{position:relative;min-height:auto;margin-top:var(--section-top-margin, 1.5rem);margin-bottom:var(--section-bottom-margin, 1.5rem)}.images-with-text-scroll__container{display:grid;place-items:start center;gap:var(--images-with-text-scroll-content-gap, 2rem);padding:1rem}.images-with-text-scroll__item{display:contents}.images-with-text-scroll__item:not(.is-selected){display:none}.images-with-text-scroll__image{width:var(--images-with-text-scroll-mobile-image-width, 80%);max-width:var(--images-with-text-scroll-mobile-image-width, 80%)}.images-with-text-scroll__text{text-align:center;max-width:375px;padding:0 1rem}.page-dots{display:flex;position:relative;bottom:auto;left:auto;transform:none;margin-top:1rem;padding:.75rem 0}}@media screen and (max-width: 480px){.images-with-text-scroll__container{padding:.5rem}.images-with-text-scroll__text{max-width:95%;padding:0 .5rem}}@media screen and (min-width: 1000px){.images-with-text-scroll{min-height:calc(100vh - var(--sticky-area-height))}.images-with-text-scroll__container{--image-width: min(50vw - var(--container-gutter), 575px);--image-height: min(var(--image-width), var(--image-width) / var(--images-with-text-scroll-master-image-ratio));--content-padding: calc((100vh - var(--image-height) - var(--sticky-area-height)) / 2);grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);align-items:center;gap:var(--images-with-text-scroll-content-gap, 40px);padding-block-start:var(--content-padding);padding-block-end:var(--content-padding)}.images-with-text-scroll__image{width:var(--images-with-text-scroll-image-width, 50%);max-width:var(--images-with-text-scroll-image-width, 50%);height:auto;object-fit:contain;object-position:center;position:sticky;inset-block-start:calc(var(--content-padding) + var(--sticky-area-height))}.images-with-text-scroll__text{text-align:var(--images-with-text-scroll-text-alignment);grid-area:auto / 2;transition:opacity .3s ease,transform .3s ease}.images-with-text-scroll--reverse .images-with-text-scroll__image{grid-column:2}.images-with-text-scroll--reverse .images-with-text-scroll__text{grid-column:1}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/images-with-text-scroll.css.map */