.rf-howto-sec{display:block}.rf-howto-sec:not(.rf-band--lift){background:var(--rf-paper)}.rf-howto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4.5vw,60px);align-items:center;margin-top:34px}.rf-howto__steps{display:flex;flex-direction:column}.rf-step{border-top:2px solid rgba(10,10,10,.16);padding:20px 0;transition:border-color .45s ease}.rf-step:last-child{border-bottom:2px solid rgba(10,10,10,.16)}.rf-step[data-on=true]{border-top-color:var(--rf-ink)}.rf-step__no{font-family:var(--rf-body);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--rf-muted);transition:color .45s ease}.rf-step[data-on=true] .rf-step__no{color:var(--rf-ink)}.rf-step h3{font-family:var(--rf-display);font-weight:400;text-transform:uppercase;font-size:26px;line-height:1;margin:8px 0 0;opacity:.42;transition:opacity .45s ease}.rf-step[data-on=true] h3{opacity:1}.rf-step p{margin:9px 0 0;font-size:15px;line-height:1.55;color:var(--rf-muted-2)}.rf-howto__video{width:100%;height:auto;border-radius:8px;display:block}.rf-vslot.rf-vslot--clip{aspect-ratio:1 / 1;padding:0}.rf-vslot--clip .rf-howto__video{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;object-fit:cover;border-radius:0}@media screen and (max-width:820px){.rf-vslot.rf-vslot--clip{aspect-ratio:16 / 9}}.rf-vslot{position:relative;background:#0b0b0a;border-radius:8px;overflow:hidden;aspect-ratio:4 / 5;display:grid;place-items:center}.rf-vslot__jar{position:relative;z-index:1;width:min(64%,250px);height:auto;filter:drop-shadow(0 26px 40px rgba(0,0,0,.62));animation:rf-vfloat 7.5s ease-in-out infinite}@keyframes rf-vfloat{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.035)}}.rf-vslot__wash{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:radial-gradient(52% 48% at 50% 46%,color-mix(in srgb,var(--rf-howto-accent, var(--rf-collagen)) 18%,transparent),transparent 72%)}.rf-vslot__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:20px;background:linear-gradient(0deg,rgba(6,6,5,.92),transparent)}.rf-vslot__phase{font-family:var(--rf-display);font-weight:400;text-transform:uppercase;color:#fff;font-size:30px;line-height:1;margin:0}.rf-vslot__say{margin:7px 0 0;font-size:14px;color:#c6c2b9;max-width:34ch}.rf-vslot__bar{display:flex;gap:5px;margin-top:14px}.rf-vslot__bar i{flex:1;height:2px;background:#ffffff3d;position:relative;overflow:hidden}.rf-vslot__bar i:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--rf-howto-accent, var(--rf-collagen));transform:scaleX(0);transform-origin:left}.rf-vslot__bar i[data-done=true]:after{transform:scaleX(1)}.rf-vslot__bar i[data-on=true]:after{animation:rf-vfill var(--rf-vfill, 3s) linear forwards}@keyframes rf-vfill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.rf-vslot__tag{position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:7px;background:#0b0b0ad1;border:1px solid rgba(255,255,255,.22);color:#efede6;padding:6px 11px;border-radius:99px;font-family:var(--rf-body);font-size:11px;letter-spacing:.1em;text-transform:uppercase}.rf-vslot__rec{width:6px;height:6px;border-radius:99px;background:var(--rf-howto-accent, var(--rf-collagen))}.rf-vslot__time{position:absolute;top:14px;right:14px;z-index:2;background:#0b0b0ad1;color:#efede6;padding:6px 10px;border-radius:2px;font-family:var(--rf-body);font-size:11px;letter-spacing:.09em}.rf-howto__note{margin:12px 0 0;font-family:var(--rf-body);font-size:11px;line-height:1.6;color:var(--rf-muted)}@media screen and (max-width:820px){.rf-howto{grid-template-columns:1fr;gap:28px}.rf-vslot{aspect-ratio:1}}@media(prefers-reduced-motion:reduce){.rf-vslot__jar{animation:none}.rf-step,.rf-step__no,.rf-step h3{transition-duration:.01ms}}.rf-vslot--video{aspect-ratio:1 / 1}.rf-vslot__clip{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;z-index:0;transition:opacity .6s ease}.rf-vslot__clip[data-on=true]{opacity:1;z-index:1}.rf-vslot__clip[data-prev=true]{opacity:1;z-index:0;transition:none}.rf-howto--clips .rf-vslot__bar i[data-on=true]:after{animation:none;transform:scaleX(var(--p, 0));transition:transform .25s linear}.rf-howto--clips .rf-vslot__phase,.rf-howto--clips .rf-vslot__say{display:none}.rf-howto--clips .rf-vslot__cap{padding:14px 16px;background:linear-gradient(0deg,rgba(6,6,5,.55),transparent)}.rf-howto--clips .rf-vslot__bar{margin-top:0}.rf-howto--clips .rf-step{cursor:pointer}.rf-howto--clips .rf-step:focus-visible{outline:2px solid var(--rf-ink);outline-offset:4px}@media screen and (max-width:820px){.rf-vslot--video{aspect-ratio:16 / 9}.rf-howto--clips .rf-howto__steps{order:2}}.rf-howto--static .rf-step h3{opacity:1}.rf-howto--static .rf-step__no{color:var(--rf-ink)}.rf-howto--static .rf-vslot__jar{animation:none}
/*# sourceMappingURL=/cdn/shop/t/5/assets/rf-howto.css.map */
