.draggable-cards{position:relative;width:100%;background-color:#000;color:var(--dc-text-color, #ffffff);overflow:hidden}.draggable-cards__background-wrapper{position:relative;background:#000}.draggable-cards__background{position:relative;top:0;right:0;bottom:0;left:0;z-index:0}.draggable-cards__background-desktop{display:block}.draggable-cards__background-mobile,.draggable-cards__background-tablet{display:none}.draggable-cards__background-img{width:100%;height:100%;object-fit:cover;object-position:center;position:absolute}.draggable-cards__background-overlay{position:absolute;top:0;right:0;bottom:0;left:0}.draggable-cards__container{position:absolute;z-index:1;width:100%;margin:0 auto;display:flex;flex-direction:column;top:0;height:100%}.draggable-cards__header{position:absolute;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px;flex-shrink:0;width:100%;z-index:2;pointer-events:none}.draggable-cards__titles{display:flex;justify-content:space-between;align-items:flex-start;flex:1;padding-top:90px;transform:translateY(30px);transition:transform .8s ease,opacity .8s ease;opacity:0}.draggable-cards__titles.active{transform:translateY(0);opacity:1}.draggable-cards__title{font-family:Space Grotesk,sans-serif;font-weight:700;font-size:24px;line-height:1;letter-spacing:0}.draggable-cards__title--description{font-family:Plus Jakarta Sans,sans-serif;font-weight:400;font-size:16px;line-height:1.25;opacity:.8;max-width:500px;margin:0}.draggable-cards__title--description-desktop{display:block}.draggable-cards__title--description-mobile{display:none}.draggable-cards__arena{position:relative;flex:1;width:100%;touch-action:pan-y;-webkit-user-select:none;user-select:none;z-index:1}.draggable-cards__card{position:absolute;cursor:grab;border-radius:0;overflow:hidden;-webkit-perspective:800px;perspective:800px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;will-change:transform,left,top;touch-action:none;-webkit-backface-visibility:hidden;backface-visibility:hidden}.draggable-cards__card--1{width:25%;height:25%;left:calc((100% - 1200px)/2 + 25px);top:33%;max-width:300px;max-height:300px;transition:transform .8s ease}.draggable-cards__card--2{width:calc(100% / 3);height:calc(100% / 3);left:calc((100% - 1200px)/2 + 300px);top:29%;max-width:400px;max-height:400px;transition:transform .8s ease}.draggable-cards__card--3{width:calc(100% / 3);height:calc(100% / 3);left:calc((100% - 1200px)/2 + 500px);top:46%;max-width:400px;max-height:400px;transition:transform .8s ease}.draggable-cards__card--4{width:25%;height:25%;left:calc((100% - 1200px)/2 + 875px);top:53%;max-width:300px;max-height:300px;transition:transform .8s ease}@media screen and (max-width:1200px)and (min-width:901px){.draggable-cards__card--1{width:25%;height:25%;left:85px;top:28%;transition:transform .8s ease;max-width:234px;max-height:234px}.draggable-cards__card--2{width:calc(100% / 3);height:calc(100% / 3);left:26%;top:24%;transition:transform .8s ease;max-width:312px;max-height:312px}.draggable-cards__card--3{width:calc(100% / 3);height:calc(100% / 3);left:41%;top:40%;transition:transform .8s ease;max-width:312px;max-height:312px}.draggable-cards__card--4{width:25%;height:25%;left:unset;right:85px;top:48%;transition:transform .8s ease;max-width:234px;max-height:234px}}@media screen and (min-width:769px){.draggable-cards__arena.active .draggable-cards__card--1{transform:translate(-25px)}.draggable-cards__arena.active .draggable-cards__card--2{transform:translateY(-20px)}.draggable-cards__arena.active .draggable-cards__card--3{transform:translateY(20px)}.draggable-cards__arena.active .draggable-cards__card--4{transform:translate(25px)}}.draggable-cards__card.dragging{cursor:grabbing}.draggable-cards__card-inner{width:100%;height:100%;position:relative;overflow:hidden;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;transition:transform .1s ease-out;will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}.draggable-cards__card-img{width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);display:block}.draggable-cards__card .placeholder-svg{width:100%;height:100%;background:#ffffff1a}.draggable-cards__card--1{z-index:10}.draggable-cards__card--2{z-index:40}.draggable-cards__card--3{z-index:30}.draggable-cards__card--4{z-index:20}.draggable-cards__card.dragging{z-index:100}@media screen and (min-width:901px)and (max-width:1280px){.draggable-cards__title{font-size:18px}.draggable-cards__title--description{font-size:12px;max-width:390px}.draggable-cards__titles{padding-top:70px}}@media screen and (max-width:900px){.draggable-cards__background-desktop,.draggable-cards__background-tablet{display:none}.draggable-cards__container{position:absolute;padding:40px 0;top:0;height:100%}.draggable-cards__header{flex-direction:column;align-items:center;margin-bottom:20px}.draggable-cards__titles{width:100%;justify-content:space-between;padding-top:0}.draggable-cards__title{font-size:20px;line-height:1.2}.draggable-cards__title--description-desktop{display:none}.draggable-cards__title--description-mobile{display:block;text-align:center;max-width:283px;font-size:14px;margin:auto auto 0;opacity:.8}.draggable-cards__container{padding:40px 0}.draggable-cards__title{font-size:18px}.draggable-cards__title--right{text-align:right}.draggable-cards__title--description-mobile{font-size:14px;max-width:335px}html[lang=de] .draggable-cards__title--description-mobile,html[lang=nl] .draggable-cards__title--description-mobile,html[lang=fr] .draggable-cards__title--description-mobile{font-size:12px}.draggable-cards__card{cursor:default;touch-action:auto}.draggable-cards__arena{touch-action:auto}.draggable-cards__arena.active .draggable-cards__card--1{transform:translate(20px,-70px);animation:breathe1 8s ease-in-out infinite;animation-delay:.8s}.draggable-cards__arena.active .draggable-cards__card--2{transform:translate(-30px,-20px);animation:breathe2 8s ease-in-out infinite;animation-delay:.8s}.draggable-cards__arena.active .draggable-cards__card--3{transform:translate(30px,20px);animation:breathe3 8s ease-in-out infinite;animation-delay:.8s}.draggable-cards__arena.active .draggable-cards__card--4{transform:translate(-10px,60px);animation:breathe4 8s ease-in-out infinite;animation-delay:.8s}.draggable-cards__card.dragging{animation-play-state:paused}}@media screen and (min-width:768px)and (max-width:900px)and (min-height:1000px){.draggable-cards__titles{padding:0 50px}.draggable-cards__background-tablet{display:block}.draggable-cards__card--1{left:44%;top:24%;transition:transform .8s ease;max-width:180px;max-height:180px;width:100%;height:auto}.draggable-cards__card--2{left:20%;top:31%;transition:transform .8s ease;max-width:298px;max-height:298px;width:100%;height:auto}.draggable-cards__card--3{left:40%;top:43%;transition:transform .8s ease;max-width:298px;max-height:298px;width:100%;height:auto}.draggable-cards__card--4{left:31%;top:64%;transition:transform .8s ease;max-width:180px;max-height:180px;width:100%;height:auto}.draggable-cards__title--description-mobile{max-width:500px}}@media screen and (max-width:750px){.draggable-cards__background-desktop{display:none}.draggable-cards__background-mobile{display:block}.draggable-cards__arena{position:absolute;top:0;left:0;width:100%;height:100%}.draggable-cards__card--1{left:41.73333%;top:32%;height:110px;width:110px}.draggable-cards__card--2{left:16.848%;top:35%;height:180px;width:180px}.draggable-cards__card--3{left:36.35%;top:40%;transition:transform .8s ease;height:180px;width:180px}.draggable-cards__card--4{left:30%;bottom:32%;transition:transform .8s ease;height:110px;width:110px;top:unset}}@media(prefers-reduced-motion:reduce){.draggable-cards__card{transition:none!important;animation:none!important}}@keyframes breathe1{0%,to{transform:translate(20px,-70px)}50%{transform:translate(30px,-80px)}}@keyframes breathe2{0%,to{transform:translate(-30px,-20px)}50%{transform:translate(-35px,-30px)}}@keyframes breathe3{0%,to{transform:translate(30px,20px)}50%{transform:translate(35px,30px)}}@keyframes breathe4{0%,to{transform:translate(-10px,60px)}50%{transform:translate(-20px,70px)}}
/*# sourceMappingURL=/cdn/shop/t/33/assets/section-draggable-cards.css.map */