.snp{--snp-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000' preserveAspectRatio='none'%3E%3Cpath d='M0 40 C150 0 320 70 500 30 S850 0 1000 36 L1000 964 C860 1000 700 940 520 972 S160 1000 0 960 Z'/%3E%3C/svg%3E");container-type:inline-size;overflow:hidden;padding:var(--snp-pt, 28px) 12px var(--snp-pb, 36px);font-family:var(--font-body-family, Montserrat, sans-serif);color:#2a2120}.snp__head{text-align:center;margin:0 auto 6px;max-width:680px}.snp__title{margin:0;color:var(--snp-heading, #2a2120);text-transform:none;font-family:var(--font-body-family, Montserrat, sans-serif);font-weight:700;font-size:clamp(24px,6.2cqi,42px);line-height:1.15;letter-spacing:-.02em}.snp__hl{position:relative;white-space:nowrap;color:#e0457b}.snp__hl svg{position:absolute;left:-2%;bottom:-.3em;width:104%;height:.5em;overflow:visible}.snp__hl path{stroke-dasharray:260;stroke-dashoffset:260}.snp.is-in .snp__hl path{animation:snp-draw .9s .2s cubic-bezier(.6,0,.2,1) forwards}.snp__stage{position:relative;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;column-gap:8px;row-gap:4px;padding:18px 6px 26px}.snp__bg{position:absolute;top:58px;right:0;bottom:6px;left:0;border-radius:40px;background:radial-gradient(24% 20% at 25% 20%,#fff 40%,#fff0),radial-gradient(22% 16% at 75% 34%,#fffffff2,#fff0),radial-gradient(22% 16% at 25% 70%,#fffffff2,#fff0),radial-gradient(22% 16% at 75% 80%,#fffffff2,#fff0),radial-gradient(70% 45% at 5% 15%,var(--c1, #ffa9c6),transparent 100%),radial-gradient(70% 45% at 100% 20%,var(--c2, #ffc56e),transparent 100%),radial-gradient(70% 45% at 0% 88%,var(--c3, #a9e08a),transparent 100%),radial-gradient(70% 45% at 100% 95%,var(--c4, #dcb88c),transparent 100%),#fff4ea;-webkit-mask:var(--snp-wave) center / 100% 100% no-repeat;mask:var(--snp-wave) center / 100% 100% no-repeat}.snp__trail{position:absolute;left:0;top:58px;width:100%;height:calc(100% - 64px);pointer-events:none;overflow:visible}.snp__trail path{fill:none;stroke:#2a2120;stroke-opacity:.28;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:.1 11;vector-effect:non-scaling-stroke}.snp__trail--desk{display:none}.snp--js:not(.is-in) .snp__trail{clip-path:inset(0 100% 0 0)}.snp.is-in .snp__trail{clip-path:inset(0 0 0 0);transition:clip-path 1.6s cubic-bezier(.5,0,.2,1)}.snp__sprinkle{position:absolute;width:var(--s, 14px);height:var(--s, 14px);left:var(--x);top:var(--y);color:var(--c);animation:snp-bob 6s ease-in-out infinite;animation-delay:var(--d, 0s);pointer-events:none}.snp__sprinkle svg{width:100%;height:100%;display:block}.snp__sprinkle--desk{display:none}.snp__item{position:relative;display:flex;flex-direction:column;align-items:center;text-decoration:none!important;color:var(--ink);-webkit-tap-highlight-color:transparent}.snp__item--low{margin-top:34px}.snp__media{position:relative;display:block;width:100%;aspect-ratio:1;mix-blend-mode:multiply;transition:opacity .35s ease}.snp__item--hero .snp__media{width:118%;margin:-9% -9% 0}.snp__float{display:block;width:100%;height:100%;animation:snp-wave 4.8s ease-in-out infinite;animation-delay:calc(var(--i, 0) * -1.2s)}.snp__media img{width:100%;height:100%;max-width:none;object-fit:contain;display:block;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.snp__media--rund img{-webkit-mask-image:radial-gradient(closest-side,#000 78%,transparent 100%);mask-image:radial-gradient(closest-side,#000 78%,transparent 100%)}.snp__media--seitlich img{-webkit-mask-image:linear-gradient(90deg,transparent 8%,#000 22%,#000 78%,transparent 92%);mask-image:linear-gradient(90deg,transparent 8%,#000 22%,#000 78%,transparent 92%)}.snp__label{position:relative;display:block;margin-top:-10px;text-align:center;transform:rotate(var(--r, 0deg));transition:opacity .35s ease}.snp__name{display:block;margin:0;padding:0;color:var(--ink);text-transform:none;font-family:var(--font-body-family, Montserrat, sans-serif);font-weight:700;font-size:clamp(16px,4.6cqi,34px);line-height:1.05;letter-spacing:-.025em}.snp__cta{display:inline-flex;align-items:center;gap:5px;margin-top:5px;font-size:12px;font-weight:700;line-height:1.2;color:var(--ink);opacity:.8}.snp__cta svg{width:13px;height:13px;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.snp__squiggle{position:absolute;left:8%;bottom:-8px;width:84%;height:8px;overflow:visible}.snp__squiggle path{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-dasharray:140;stroke-dashoffset:140;transition:stroke-dashoffset .5s ease}.snp__item--beere{--ink: #8f1d4a;--accent: #e0457b}.snp__item--mango{--ink: #843a00;--accent: #ff9f2e}.snp__item--gruen{--ink: #1f5e23;--accent: #4fb82e}.snp__item--nuss{--ink: #5c3a1a;--accent: #c98f52}.snp__item--blau{--ink: #1f2f7a;--accent: #5b7bea}.snp__item--lila{--ink: #4a1f7a;--accent: #9a5be0}.snp__item--zitrone{--ink: #5e4a00;--accent: #e0b400}.snp__sticker{position:absolute;z-index:3;top:2%;right:0;width:46px;height:46px;transition:opacity .35s ease}.snp__sticker svg{width:100%;height:100%;animation:snp-spin 14s linear infinite;filter:drop-shadow(0 4px 8px rgba(224,69,123,.25))}.snp__sticker b{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font:700 13px/1 var(--font-body-family, Montserrat, sans-serif);color:#e0457b}@container (min-width: 720px){.snp{padding-left:20px;padding-right:20px}.snp__head{margin-bottom:8px}.snp__stage{grid-template-columns:repeat(4,1fr);column-gap:10px;padding:24px 2% 44px}.snp__item--low{margin-top:56px}.snp__bg{top:96px;right:0;bottom:0;left:0;border-radius:64px;background:radial-gradient(9% 48% at 12% 18%,#fff 45%,#fff0),radial-gradient(10% 24% at 37.5% 46%,#fffffff2,#fff0),radial-gradient(10% 24% at 62.5% 34%,#fffffff2,#fff0),radial-gradient(10% 24% at 87.5% 46%,#fffffff2,#fff0),radial-gradient(30% 75% at 4% 55%,var(--c1, #ffa9c6),transparent 100%),radial-gradient(30% 75% at 36% 100%,var(--c2, #ffc56e),transparent 100%),radial-gradient(30% 75% at 64% 0%,var(--c3, #a9e08a),transparent 100%),radial-gradient(30% 75% at 97% 60%,var(--c4, #dcb88c),transparent 100%),#fff4ea}.snp__trail{top:96px;height:calc(100% - 96px)}.snp__trail--mob{display:none}.snp__trail--desk,.snp__sprinkle--desk{display:block}.snp__label{margin-top:-18px}.snp__cta{font-size:14px;margin-top:8px}.snp__sticker{width:84px;height:84px;top:6%;right:2%}.snp__sticker b{font-size:20px}}@media(hover:hover){.snp__stage:has(.snp__item:hover) .snp__item:not(:hover) :is(.snp__media,.snp__label,.snp__sticker){opacity:.5}.snp__item:hover .snp__media img{transform:translateY(-10px) rotate(-5deg) scale(1.07)}.snp__item:hover .snp__squiggle path{stroke-dashoffset:0}.snp__item:hover .snp__cta svg{transform:translate(4px)}}.snp__item:active .snp__media img{transform:scale(.94);transition-duration:.12s}.snp__item:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:24px}.snp--js:not(.is-in) .snp__item>*{opacity:0}.snp.is-in .snp__item>*{animation:snp-pop .8s cubic-bezier(.3,1.5,.5,1) backwards;animation-delay:calc(.25s + var(--i, 0) * .16s)}@keyframes snp-pop{0%{opacity:0;transform:scale(.7) translateY(20px) rotate(var(--r, 0deg))}}@keyframes snp-wave{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-9px) rotate(-1.5deg)}}@keyframes snp-bob{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(20deg)}}@keyframes snp-spin{to{transform:rotate(360deg)}}@keyframes snp-draw{to{stroke-dashoffset:0}}@media(prefers-reduced-motion:reduce){.snp *,.snp *:before,.snp *:after{animation:none!important;transition:none!important}.snp__hl path{stroke-dashoffset:0}.snp--js .snp__trail{clip-path:none!important}}
/*# sourceMappingURL=/cdn/shop/t/37/assets/sbk-naschpfad.css.map */