.hiw{position:relative;display:block;padding:3.5rem var(--hiw-pad, 20px) 4rem;background:var(--hiw-bg, #faf6ec);color:var(--hiw-ink, #383838)}.hiw__head{max-width:var(--hiw-max, 1100px);margin:0 auto 2.25rem}.hiw__heading{margin:0;font-size:clamp(1.5rem,3vw,2.25rem);font-weight:500;line-height:1.15}.hiw__subheading{margin:.4rem 0 0;font-size:.95rem;opacity:.6}.hiw__stage{position:relative;max-width:var(--hiw-max, 1100px);margin:0 auto;display:grid}.hiw__step{grid-area:1 / 1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:var(--hiw-gap, 56px)}.hiw__step .hiw__words{justify-self:var(--hiw-text-x, start);align-self:var(--hiw-text-y, center);text-align:var(--hiw-text-align, left)}.hiw__step[hidden]{display:none!important}.hiw__step--media-left .hiw__words{order:2}.hiw__step--media-left .hiw__media{order:1}.hiw__words{max-width:30rem}.hiw__title{margin:0 0 .7rem;font-size:clamp(1.35rem,2.6vw,2rem);font-weight:500;line-height:1.15;text-wrap:balance}.hiw__title p{margin:0}.hiw__title p+p{margin-top:.2em}.hiw__title a{color:inherit}.hiw__text{margin:0;font-size:1rem;line-height:1.6;opacity:.8}.hiw__text p{margin:0 0 .7rem}.hiw__text p:last-child{margin-bottom:0}.hiw__media{position:relative;width:100%;max-width:var(--hiw-media-max, 520px);margin-inline:auto;aspect-ratio:var(--hiw-media, 1 / 1);border-radius:var(--hiw-radius, 0px);overflow:hidden}.hiw__media{overflow:visible}.hiw__media[style*=--hiw-radius]{overflow:hidden}.hiw__still,.hiw__swap,.hiw__layer,.hiw__clip{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;display:block}.hiw__swap{opacity:0;transition:opacity .6s ease}.hiw__swap.is-on{opacity:1}.hiw__layer{opacity:0}.hiw__step.is-in .hiw__layer[data-motion=none]{opacity:1}.hiw__layer[data-motion=fade]{--in: hiw-in-fade;--out: hiw-out-fade;--cyc: hiw-cyc-fade}.hiw__layer[data-motion=write]{--in: hiw-in-write;--out: hiw-out-write;--cyc: hiw-cyc-write}.hiw__layer[data-motion=in-up]{--in: hiw-in-up;--out: hiw-out-up;--cyc: hiw-cyc-up}.hiw__layer[data-motion=in-down]{--in: hiw-in-down;--out: hiw-out-down;--cyc: hiw-cyc-down}.hiw__layer[data-motion=in-left]{--in: hiw-in-left;--out: hiw-out-left;--cyc: hiw-cyc-left}.hiw__layer[data-motion=in-right]{--in: hiw-in-right;--out: hiw-out-right;--cyc: hiw-cyc-right}.hiw__step.is-in .hiw__layer[data-then=stay]{animation:var(--in) var(--hiw-speed, .7s) cubic-bezier(.22,1,.36,1) var(--hiw-wait, .3s) both}.hiw__step.is-in .hiw__layer[data-then=back]{animation:var(--in) var(--hiw-speed, .7s) cubic-bezier(.22,1,.36,1) var(--hiw-wait, .3s) both,var(--out) var(--hiw-speed, .7s) cubic-bezier(.64,0,.78,0) var(--hiw-leave, 4s) forwards}.hiw__step.is-in .hiw__layer[data-then=loop]{animation:var(--cyc) var(--hiw-cycle, 5.4s) ease-in-out var(--hiw-wait, .3s) infinite}.hiw__step.is-in .hiw__layer[data-motion=drift]{animation:hiw-drift calc(var(--hiw-speed, .7s) * 4) ease-in-out var(--hiw-wait, .3s) infinite alternate}.hiw__step.is-in .hiw__layer[data-motion=drift-x]{animation:hiw-drift-x calc(var(--hiw-speed, .7s) * 4) ease-in-out var(--hiw-wait, .3s) infinite alternate}.hiw__step.is-in .hiw__layer[data-motion=tap]{animation:hiw-tap calc(var(--hiw-speed, .7s) * 3) ease-in-out var(--hiw-wait, .3s) infinite}@keyframes hiw-in-fade{0%{opacity:0}to{opacity:1}}@keyframes hiw-in-write{0%{opacity:1;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}@keyframes hiw-in-up{0%{opacity:0;transform:translateY(var(--hiw-amount, 12%))}to{opacity:1;transform:translateY(0)}}@keyframes hiw-in-down{0%{opacity:0;transform:translateY(calc(var(--hiw-amount, 12%) * -1))}to{opacity:1;transform:translateY(0)}}@keyframes hiw-in-left{0%{opacity:0;transform:translate(var(--hiw-amount, 12%))}to{opacity:1;transform:translate(0)}}@keyframes hiw-in-right{0%{opacity:0;transform:translate(calc(var(--hiw-amount, 12%) * -1))}to{opacity:1;transform:translate(0)}}@keyframes hiw-out-fade{0%{opacity:1}to{opacity:0}}@keyframes hiw-out-write{0%{opacity:1;clip-path:inset(0 0 0 0)}to{opacity:1;clip-path:inset(0 100% 0 0)}}@keyframes hiw-out-up{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--hiw-amount, 12%))}}@keyframes hiw-out-down{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(calc(var(--hiw-amount, 12%) * -1))}}@keyframes hiw-out-left{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(var(--hiw-amount, 12%))}}@keyframes hiw-out-right{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(calc(var(--hiw-amount, 12%) * -1))}}@keyframes hiw-cyc-fade{0%,to{opacity:0}18%,78%{opacity:1}}@keyframes hiw-cyc-write{0%,to{opacity:1;clip-path:inset(0 100% 0 0)}18%,78%{opacity:1;clip-path:inset(0 0 0 0)}}@keyframes hiw-cyc-up{0%,to{opacity:0;transform:translateY(var(--hiw-amount, 12%))}18%,78%{opacity:1;transform:translateY(0)}}@keyframes hiw-cyc-down{0%,to{opacity:0;transform:translateY(calc(var(--hiw-amount, 12%) * -1))}18%,78%{opacity:1;transform:translateY(0)}}@keyframes hiw-cyc-left{0%,to{opacity:0;transform:translate(var(--hiw-amount, 12%))}18%,78%{opacity:1;transform:translate(0)}}@keyframes hiw-cyc-right{0%,to{opacity:0;transform:translate(calc(var(--hiw-amount, 12%) * -1))}18%,78%{opacity:1;transform:translate(0)}}@keyframes hiw-drift{0%{opacity:1;transform:translateY(calc(var(--hiw-amount, 12%) * -.5))}to{opacity:1;transform:translateY(calc(var(--hiw-amount, 12%) * .5))}}@keyframes hiw-drift-x{0%{opacity:1;transform:translate(calc(var(--hiw-amount, 12%) * -.5))}to{opacity:1;transform:translate(calc(var(--hiw-amount, 12%) * .5))}}@keyframes hiw-tap{0%{opacity:1;transform:translateY(var(--hiw-amount, 12%))}22%{opacity:1;transform:translateY(0)}38%{opacity:1;transform:translateY(0)}58%{opacity:1;transform:translateY(var(--hiw-amount, 12%))}to{opacity:1;transform:translateY(var(--hiw-amount, 12%))}}.hiw__step .hiw__words,.hiw__step .hiw__media{opacity:0;transform:translate(var(--hiw-slide, 7%));transition:transform var(--hiw-change, .6s) cubic-bezier(.22,1,.36,1),opacity calc(var(--hiw-change, .6s) * .75) ease}.hiw__step.is-in .hiw__words,.hiw__step.is-in .hiw__media{opacity:1;transform:translate(0)}.hiw__step.is-in .hiw__media{transition-delay:.08s}.hiw__step.is-out{pointer-events:none}.hiw__step.is-out .hiw__words,.hiw__step.is-out .hiw__media{opacity:0;transform:translate(calc(var(--hiw-slide, 7%) * -1));transition:transform var(--hiw-change, .6s) cubic-bezier(.5,0,.75,0),opacity calc(var(--hiw-change, .6s) * .6) ease;transition-delay:0s}.hiw__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:40;width:2.6rem;height:2.6rem;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:none;color:inherit;font-size:1.8rem;line-height:1;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s ease}.hiw__arrow--prev{left:clamp(.5rem,2vw,2rem)}.hiw__arrow--next{right:clamp(.5rem,2vw,2rem)}.hiw.is-near-left .hiw__arrow--prev,.hiw.is-near-right .hiw__arrow--next,.hiw__arrow:focus-visible{opacity:.55;pointer-events:auto}.hiw__arrow:hover{opacity:1}@media(hover:none){.hiw__arrow{display:none}}.hiw__dots{display:flex;justify-content:center;gap:.6rem;max-width:var(--hiw-max, 1100px);margin:2.25rem auto 0}.hiw__dot{width:9px;height:9px;padding:0;border:1px solid currentColor;border-radius:50%;background:none;color:inherit;opacity:.35;cursor:pointer;transition:opacity .25s ease,background .25s ease}.hiw__dot:hover{opacity:.7}.hiw__dot.is-current{opacity:1;background:currentColor}@media(max-width:749px){.hiw__step{grid-template-columns:1fr;gap:1.5rem}.hiw__media{max-width:none}.hiw__step .hiw__media,.hiw__step--media-left .hiw__media{order:1}.hiw__step .hiw__words,.hiw__step--media-left .hiw__words{order:2;max-width:none}}@media(prefers-reduced-motion:reduce){.hiw__swap{transition:none}.hiw__layer,.hiw__step.is-in .hiw__layer{animation:none!important;opacity:1;transform:none}.hiw__step .hiw__words,.hiw__step .hiw__media,.hiw__step.is-out .hiw__words,.hiw__step.is-out .hiw__media{transition:none;transform:none}.hiw__step.is-in .hiw__words,.hiw__step.is-in .hiw__media{opacity:1}.hiw__step.is-out{display:none}.hiw__clip{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/11/assets/how-it-works.css.map */