{"id":47441,"date":"2026-04-23T09:43:33","date_gmt":"2026-04-23T07:43:33","guid":{"rendered":"https:\/\/www.pickware.com\/?page_id=47441"},"modified":"2026-04-30T14:46:36","modified_gmt":"2026-04-30T12:46:36","slug":"pickware-ai","status":"publish","type":"page","link":"https:\/\/www.pickware.com\/de\/pickware-ai","title":{"rendered":"Pickware AI"},"content":{"rendered":"\n<style>\n\n.pw-main-menu.pw-main-menu--desktop {\n    background: #000826;\n}\n\n.pw-main-menu--desktop .pw-main-menu-primary-item__title {\n    color: white;\n}\n\n.pw-main-menu--desktop .pw-main-menu__secondary-menu-background {\n    background: rgba(255, 255, 255, 0.1);\n}\n\n.pw-main-menu--desktop .pw-main-menu-secondary__item,\n.pw-main-menu--desktop .wpml-ls-link>span {\n    color: rgba(255, 255, 255, 0.5);\n}\n\n.pw-main-menu--desktop .pw-main-menu-secondary__item:hover,\n.pw-main-menu--desktop .wpml-ls-link>span:hover {\n    color: rgba(255, 255, 255, 1);\n}\n\n.wpml-ls-current-language span {\n    color: white !important;\n}\n\n.pw-main-menu-buttons__button.pw-main-menu-buttons__button--order-500 {\n    background-color: #0f384f;\n    color: #fff;\n}\n\n.pw-main-menu-buttons__button.pw-main-menu-buttons__button--order-500:hover {\n    background-color: #092738;\n}\n\n\n.pw-main-menu.pw-main-menu--mobile {\n    background-color: #000826;\n}\n\n.pw-page-header--fixed .pw-main-menu.pw-main-menu--mobile {\n    background-color: white;\n}\n\n.new-home-hero--background-img {\n    background-image: linear-gradient(180deg, #000826, rgba(0, 8, 38, 0) 30%), url(https:\/\/pickware.com\/app\/uploads\/2025\/11\/home-ending-cta-background-03.svg);\n    background-size: cover;\n}\n<\/style>\n\n\n\n<style>\n    :root,\n    #pickware-ai-root {\n        \/* \u2500\u2500 Pickware color palette \u2500\u2500 *\/\n        --color--pink-500: #f155a0;\n        --color--pink-900: #360606;\n        --color--purple-500: #b56bf0;\n        --color--purple-900: #280d3f;\n        --color--violet-500: #836bff;\n        --color--violet-900: #200a2b;\n        --color--indigo-500: #536dfe;\n        --color--indigo-900: #0d1844;\n        --color--pickware-500: #09a7ff;\n        --color--pickware-900: #011a3d;\n        --color--cyan-500: #43ccd5;\n        --color--cyan-900: #042c35;\n        --color--mint-500: #1fd49e;\n        --color--mint-900: #012b20;\n        --color--green-500: #4be160;\n        --color--green-900: #0c330b;\n        --color--lime-500: #abed56;\n        --color--lime-900: #22330a;\n        --color--pear-500: #e2f13c;\n        --color--pear-900: #353407;\n        --color--yellow-500: #f6e015;\n        --color--yellow-900: #423500;\n        --color--amber-500: #ffc217;\n        --color--amber-900: #352203;\n        --color--marigold-500: #ffa802;\n        --color--marigold-900: #331a01;\n        --color--orange-500: #ff8807;\n        --color--orange-900: #3f1b02;\n        --color--coral-500: #ff6a38;\n        --color--coral-900: #471507;\n        --color--red-500: #ff5757;\n        --color--red-900: #570403;\n        --color--midnight: #000826;\n        --color--gray-50: #eceef1;\n        --color--gray-100: #cfd6dc;\n        --color--gray-200: #b0bac5;\n        --color--gray-300: #909fae;\n        --color--gray-600: #54677a;\n        --color--gray-700: #455564;\n        --color--gray-800: #37434f;\n        --color--gray-900: #262f38;\n\n        \/* \u2500\u2500 Semantic aliases \u2500\u2500 *\/\n        --black: var(--color--midnight);\n        --white: #ffffff;\n        --ink: var(--color--violet-900);\n        --olive: var(--color--lime-900);\n        --lime: var(--color--lime-500);\n        --purple: var(--color--violet-500);\n        --blue: var(--color--pickware-500);\n        --orange: var(--color--marigold-500);\n        --red: var(--color--red-500);\n        --dark-red: var(--color--red-900);\n        --green: var(--color--mint-500);\n        --slate: var(--color--gray-200);\n        --offwhite: #F3F0EA;\n        --gray-30: #1e1e1e;\n        --gray-line: rgba(255, 255, 255, 0.1);\n        --gray-text: #999999;\n    }\n\n    #pickware-ai-root * {\n        box-sizing: border-box;\n        margin: 0;\n        padding: 0;\n    }\n\n    #pickware-ai-root .sr-only {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n    }\n\n    #pickware-ai-root {\n        background: var(--black);\n        color: var(--white);\n        font-family: \"Roboto\", system-ui, sans-serif;\n        font-size: 16px;\n        line-height: 1.45;\n        -webkit-font-smoothing: antialiased;\n        scroll-behavior: smooth;\n    }\n\n    #pickware-ai-root .container {\n        max-width: 1364px;\n        margin: 0 auto;\n        padding: 0 64px;\n    }\n\n    #pickware-ai-root section.hero {\n        position: relative;\n        padding-top: 72px;\n        overflow: hidden;\n    }\n\n    #pickware-ai-root #hero-canvas {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        z-index: 0;\n        pointer-events: none;\n    }\n\n    #pickware-ai-root #hero-canvas>* {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        transition: opacity 0.6s ease;\n    }\n\n    #pickware-ai-root #hero-canvas .hero-layer[data-active=\"false\"] {\n        opacity: 0;\n        pointer-events: none;\n    }\n\n    #pickware-ai-root #hero-canvas .hero-layer[data-active=\"true\"] {\n        opacity: 1;\n    }\n\n    #pickware-ai-root .hero-inner {\n        position: relative;\n        z-index: 2;\n        text-align: center;\n    }\n\n    #pickware-ai-root .badge {\n        display: inline-flex;\n        align-items: center;\n        background: var(--red);\n        color: var(--dark-red);\n        border-radius: 23px;\n        padding: 0 20px;\n        height: 38px;\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 16px;\n        letter-spacing: -0.03em;\n        margin-bottom: 24px;\n        font-style: normal;\n    }\n\n    #pickware-ai-root .badge .led {\n        width: 22px;\n        height: 22px;\n        border-radius: 50%;\n        background: var(--dark-red);\n        margin: 0 8px;\n        display: grid;\n        place-items: center;\n        position: relative;\n    }\n\n    #pickware-ai-root .badge .led::after {\n        content: \"\";\n        width: 8px;\n        height: 8px;\n        border-radius: 50%;\n        background: var(--green);\n        box-shadow: 0 0 8px var(--green);\n        animation: pulse-led 1.8s ease-in-out infinite;\n    }\n\n    @keyframes pulse-led {\n\n        0%,\n        100% {\n            scale: 0.75;\n        }\n\n        50% {\n            scale: 1.5;\n        }\n    }\n\n    #pickware-ai-root .badge .slab-neu {\n        padding: 0 10px 0 0;\n    }\n\n    #pickware-ai-root .badge .divider {\n        width: 1px;\n        height: 38px;\n        background: var(--dark-red);\n        opacity: 0.2;\n    }\n\n    #pickware-ai-root .badge .slab-brand {\n        padding: 0 16px;\n    }\n\n    #pickware-ai-root h1.hero-title {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        font-family: \"Fira Sans\", sans-serif;\n        font-weight: 900;\n        font-style: italic;\n        font-size: clamp(64px, 10vw, 112px);\n        line-height: 1.06;\n        letter-spacing: -0.01em;\n        color: var(--white);\n        max-width: 900px;\n        margin: 0 auto;\n    }\n\n    #pickware-ai-root .hero-sub {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 400;\n        font-size: 22px;\n        line-height: 1.25;\n        letter-spacing: -0.03em;\n        color: var(--white);\n        max-width: 560px;\n        margin: 24px auto 32px;\n    }\n\n    #pickware-ai-root .btn-primary {\n        display: inline-flex;\n        align-items: center;\n        gap: 10px;\n        background: var(--blue);\n        color: var(--white);\n        padding: 20px 24px;\n        border-radius: 8px;\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 18px;\n        letter-spacing: -0.03em;\n        text-decoration: none;\n        border: none;\n        cursor: pointer;\n        transition: transform 0.15s, filter 0.15s;\n    }\n\n    #pickware-ai-root .btn-primary:hover {\n        transform: translateY(-1px);\n        filter: brightness(1.08);\n    }\n\n    #pickware-ai-root .screenshot {\n        position: relative;\n        z-index: 2;\n        margin: 56px auto 48px;\n        padding: 0;\n    }\n\n    #pickware-ai-root .screenshot .chat-window {\n        max-width: 1236px;\n        margin: 0 auto;\n        position: relative;\n        border-radius: 32px;\n        overflow: hidden;\n    }\n\n    #pickware-ai-root .screenshot .chat-window img {\n        width: 100%;\n        display: block;\n    }\n\n    #pickware-ai-root .screenshot .fade {\n        position: absolute;\n        left: 0;\n        right: 0;\n        bottom: -1px;\n        height: 80%;\n        background: linear-gradient(rgba(0, 8, 38, 0) 0%, var(--color--midnight) 80%);\n        pointer-events: none;\n        z-index: 2;\n    }\n\n    #pickware-ai-root .display-center-wrap {\n        text-align: center;\n        padding: 60px 20px 56px;\n    }\n\n    #pickware-ai-root .display-center {\n        font-family: \"Fira Sans\", sans-serif;\n        font-weight: 900;\n        font-style: italic;\n        font-size: clamp(44px, 5.2vw, 60px);\n        line-height: 1;\n        letter-spacing: -0.01em;\n        color: var(--white);\n        margin-bottom: 24px;\n        hyphens: auto;\n    }\n\n    #pickware-ai-root .display-center-lead {\n        font-size: 22px;\n        line-height: 1.25;\n        letter-spacing: -0.03em;\n        color: var(--white);\n        max-width: 780px;\n        margin: 0 auto;\n    }\n\n    #pickware-ai-root section.cases {\n        padding: 0 0 80px;\n    }\n\n    #pickware-ai-root .case-row {\n        display: grid;\n        grid-template-columns: 1fr 1fr;\n        gap: 24px;\n        margin-bottom: 24px;\n        align-items: stretch;\n    }\n\n    #pickware-ai-root .tile {\n        background: var(--black);\n        border: 1px solid var(--color--gray-800);\n        border-radius: 16px;\n        padding: 48px 16px;\n        display: grid;\n        place-items: center;\n        min-height: auto;\n        position: relative;\n        overflow: hidden;\n        isolation: isolate;\n        gap: 16px;\n    }\n\n    #pickware-ai-root .tile canvas.dither {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        z-index: 0;\n        display: block;\n    }\n\n    #pickware-ai-root .tile>.chat-card {\n        position: relative;\n        z-index: 1;\n    }\n\n    #pickware-ai-root .tile>.chat-stack {\n        position: relative;\n        z-index: 1;\n        width: 100%;\n        max-width: 521px;\n        min-height: 428px;\n        display: grid;\n    }\n\n    #pickware-ai-root .tile>.chat-stack>.chat-card {\n        grid-area: 1 \/ 1;\n        opacity: 0;\n        visibility: hidden;\n        pointer-events: none;\n        transition: opacity 0.25s ease;\n    }\n\n    #pickware-ai-root .tile>.chat-stack>.chat-card.is-active {\n        opacity: 1;\n        visibility: visible;\n        pointer-events: auto;\n    }\n\n    #pickware-ai-root .tile canvas.dither {\n        transition: opacity 0.5s ease;\n    }\n\n    #pickware-ai-root .cases .container {\n        position: relative;\n    }\n\n    #pickware-ai-root .chat-card {\n        background: rgba(255, 255, 255, 0.95);\n        border-radius: 15px;\n        width: 100%;\n        max-width: 521px;\n        padding: 0;\n        overflow: hidden;\n        color: var(--ink);\n        display: flex;\n        flex-direction: column;\n        min-height: 428px;\n    }\n\n    #pickware-ai-root .chat-card .topbar {\n        padding: 12px 20px 12px;\n        border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n        font-family: \"Roboto Mono\", monospace;\n        font-size: 12px;\n        color: rgba(0, 0, 0, 0.5);\n        letter-spacing: 0.02em;\n    }\n\n    #pickware-ai-root .chat-card .body {\n        padding: 20px;\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        gap: 18px;\n    }\n\n    #pickware-ai-root .chat-card .msg-user {\n        display: flex;\n        gap: 14px;\n        align-items: flex-start;\n    }\n\n    #pickware-ai-root .chat-card .msg-user .bubble {\n        background: var(--gray-30);\n        color: var(--white);\n        border-radius: 9px 4px 9px 9px;\n        padding: 15px;\n        font-size: 16px;\n        font-weight: 400;\n        flex: 1;\n    }\n\n    #pickware-ai-root .chat-card .avatar {\n        width: 30px;\n        height: 30px;\n        border-radius: 50%;\n        flex-shrink: 0;\n        display: grid;\n        place-items: center;\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 12px;\n        color: var(--white);\n    }\n\n    #pickware-ai-root .chat-card .avatar.user {\n        background: var(--gray-30);\n        order: 2;\n    }\n\n    #pickware-ai-root .chat-card .avatar.ai {\n        background: var(--blue);\n    }\n\n    #pickware-ai-root .chat-card .msg-ai {\n        display: flex;\n        gap: 14px;\n        align-items: flex-start;\n    }\n\n    #pickware-ai-root .chat-card .msg-ai .content {\n        flex: 1;\n        font-family: \"Roboto Mono\", monospace;\n        font-size: 12px;\n        font-weight: 400;\n        color: var(--ink);\n        line-height: 1.7;\n    }\n\n    #pickware-ai-root .chat-card .msg-ai .content .tool-line {\n        white-space: pre-line;\n        color: rgba(32, 10, 43, 0.5);\n        hyphens: auto;\n    }\n\n    #pickware-ai-root .chat-card .msg-ai .content .tool-foot {\n        color: rgba(32, 10, 43, 0.5);\n    }\n\n    #pickware-ai-root .chat-card .msg-ai .content .answer {\n        font-family: \"Roboto\", sans-serif;\n        font-size: 16px;\n        line-height: 1.45;\n        color: var(--ink);\n        margin-top: 12px;\n        font-weight: 400;\n    }\n\n    #pickware-ai-root .chat-card .msg-ai .content .answer strong {\n        font-weight: 600;\n        margin-top: 4px;\n        display: inline-block;\n    }\n\n    #pickware-ai-root .chat-card .msg-ai .content .answer .answer-action {\n        margin-top: 12px;\n        border-top: 1px solid #e8e1e4;\n        padding-top: 12px;\n    }\n\n    #pickware-ai-root .chat-card .footer {\n        border-top: 1px solid rgba(0, 0, 0, 0.1);\n        padding: 14px 20px;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 10px;\n        height: 60px;\n    }\n\n    #pickware-ai-root .chat-card .footer .ph {\n        font-size: 16px;\n        color: rgba(0, 0, 0, 0.3);\n    }\n\n    #pickware-ai-root .chat-card .send {\n        width: 32px;\n        height: 32px;\n        display: grid;\n        place-items: center;\n        color: var(--ink);\n    }\n\n    #pickware-ai-root .chat-card .send svg {\n        display: block;\n    }\n\n    #pickware-ai-root .chat-card[data-animate] .msg-user,\n    #pickware-ai-root .chat-card[data-animate] .msg-ai .avatar,\n    #pickware-ai-root .chat-card[data-animate] .tool-line,\n    #pickware-ai-root .chat-card[data-animate] .tool-foot,\n    #pickware-ai-root .chat-card[data-animate] .answer {\n        opacity: 0;\n        transform: translateY(8px);\n        transition: opacity 0.5s ease, transform 0.5s ease;\n    }\n\n    #pickware-ai-root .chat-card[data-animate] .msg-user {\n        transform: translateX(20px) translateY(0);\n    }\n\n    #pickware-ai-root .chat-card[data-animate].show-user .msg-user {\n        opacity: 1;\n        transform: translateX(0);\n    }\n\n    #pickware-ai-root .chat-card[data-animate].show-avatar .msg-ai .avatar {\n        opacity: 1;\n        transform: translateY(0);\n    }\n\n    #pickware-ai-root .chat-card[data-animate].show-tool .tool-line {\n        opacity: 1;\n        transform: translateY(0);\n    }\n\n    #pickware-ai-root .chat-card[data-animate].show-tool-foot .tool-foot {\n        opacity: 1;\n        transform: translateY(0);\n    }\n\n    #pickware-ai-root .chat-card[data-animate].show-answer .answer {\n        opacity: 1;\n        transform: translateY(0);\n        padding-right: 24px;\n    }\n\n    #pickware-ai-root .chat-card .footer .typing {\n        display: none;\n        gap: 4px;\n        align-items: center;\n        margin-left: auto;\n    }\n\n    #pickware-ai-root .chat-card[data-animate].thinking .footer .ph {\n        opacity: 0.4;\n    }\n\n    #pickware-ai-root .chat-card[data-animate].thinking .footer .send {\n        display: none;\n    }\n\n    #pickware-ai-root .chat-card[data-animate].thinking .footer .typing {\n        display: inline-flex;\n    }\n\n    #pickware-ai-root .chat-card .footer .typing span {\n        width: 6px;\n        height: 6px;\n        border-radius: 50%;\n        background: var(--ink);\n        animation: typing-bounce 1.1s infinite ease-in-out;\n    }\n\n    #pickware-ai-root .chat-card .footer .typing span:nth-child(2) {\n        animation-delay: 0.15s;\n    }\n\n    #pickware-ai-root .chat-card .footer .typing span:nth-child(3) {\n        animation-delay: 0.3s;\n    }\n\n    @keyframes typing-bounce {\n\n        0%,\n        60%,\n        100% {\n            transform: translateY(0);\n            opacity: 0.3;\n        }\n\n        30% {\n            transform: translateY(-4px);\n            opacity: 1;\n        }\n    }\n\n    #pickware-ai-root .chat-card {\n        position: relative;\n    }\n\n    #pickware-ai-root .chat-controls {\n        display: inline-flex;\n        align-items: center;\n        gap: 12px;\n        z-index: 4;\n    }\n\n    #pickware-ai-root .chat-controls .nav-btn {\n        width: 40px;\n        height: 40px;\n        border-radius: 50%;\n        background: var(--white);\n        color: var(--ink);\n        border: none;\n        cursor: pointer;\n        display: grid;\n        place-items: center;\n        padding: 0;\n        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);\n        transition: background 0.15s ease, transform 0.15s ease;\n    }\n\n    #pickware-ai-root .chat-controls .nav-btn:hover {\n        background: rgba(255, 255, 255, 0.92);\n        transform: scale(1.06);\n    }\n\n    #pickware-ai-root .chat-controls .nav-btn:active {\n        transform: scale(0.92);\n    }\n\n    #pickware-ai-root .chat-controls .nav-btn svg {\n        display: block;\n    }\n\n    #pickware-ai-root .chat-controls .dots {\n        display: inline-flex;\n        align-items: center;\n        gap: 20px;\n        height: 40px;\n        border-radius: 24px;\n        background: var(--white);\n        padding: 0 20px;\n    }\n\n    #pickware-ai-root .chat-controls .dots .dot {\n        width: 10px;\n        height: 10px;\n        border-radius: 50%;\n        background: #00000026;\n        border: none;\n        padding: 0;\n        cursor: pointer;\n        transition: background 0.2s ease, transform 0.2s ease;\n    }\n\n    #pickware-ai-root .chat-controls .dots .dot:hover {\n        background: rgba(0, 0, 0, 0.35);\n    }\n\n    #pickware-ai-root .chat-controls .dots .dot.is-active {\n        transform: scale(1.25);\n        background: black;\n    }\n\n    #pickware-ai-root .case-text {\n        padding: 64px 48px;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n    }\n\n    #pickware-ai-root .case-text .kicker {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 600;\n        font-size: 14px;\n        letter-spacing: 0.02em;\n        text-transform: uppercase;\n        color: rgba(255, 255, 255, 0.5);\n        margin-bottom: 16px;\n    }\n\n    #pickware-ai-root .case-text h3 {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 400;\n        font-size: 32px;\n        line-height: 1.1;\n        color: var(--white);\n        margin-bottom: 20px;\n        letter-spacing: -0.01em;\n    }\n\n    #pickware-ai-root .case-text p {\n        font-family: \"Roboto\", sans-serif;\n        font-size: 32px;\n        line-height: 1.1;\n        color: rgba(255, 255, 255, 0.75);\n        margin-bottom: 28px;\n        max-width: 38ch;\n        font-weight: 400;\n    }\n\n    #pickware-ai-root .case-text .cta-link {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 16px;\n        color: var(--white);\n        text-decoration: none;\n        display: inline-flex;\n        align-items: center;\n        gap: 10px;\n        letter-spacing: -0.01em;\n    }\n\n    #pickware-ai-root .case-text .cta-link:hover {\n        opacity: 0.75;\n    }\n\n    #pickware-ai-root .case-text .cta-link svg {\n        transition: transform 0.2s;\n    }\n\n    #pickware-ai-root .case-text .cta-link:hover svg {\n        transform: translateX(3px);\n    }\n\n    #pickware-ai-root section.whats-next {\n        background: #030d26;\n        color: var(--white);\n        padding: 140px 0 140px;\n        position: relative;\n        overflow: hidden;\n    }\n\n    #pickware-ai-root .whats-next .container {\n        position: relative;\n        z-index: 1;\n    }\n\n    #pickware-ai-root .wn-head {\n        display: flex;\n        align-items: flex-end;\n        justify-content: space-between;\n        gap: 48px;\n        margin: 0 0 96px;\n        flex-wrap: wrap;\n    }\n\n    #pickware-ai-root .whats-next h2 {\n        font-family: \"Fira Sans\", sans-serif;\n        font-weight: 900;\n        font-style: italic;\n        font-size: clamp(44px, 5.2vw, 60px);\n        line-height: 1;\n        letter-spacing: -0.01em;\n        color: var(--white);\n        margin: 0;\n        text-wrap: balance;\n        max-width: 740px;\n    }\n\n    #pickware-ai-root .whats-next h2 .accent {\n        color: var(--red);\n    }\n\n    #pickware-ai-root .wn-timeline {\n        position: relative;\n        padding: 60px 0 80px;\n    }\n\n    #pickware-ai-root .wn-line {\n        position: absolute;\n        left: 0;\n        right: 0;\n        top: 50%;\n        height: 2px;\n        transform: translateY(-50%);\n        background:\n            linear-gradient(to right,\n                rgba(255, 255, 255, 0.25) 0%,\n                rgba(255, 255, 255, 0.25) 18%,\n                var(--red) 32%,\n                var(--red) 100%);\n        z-index: 0;\n    }\n\n    #pickware-ai-root .wn-line::before {\n        \/* arrowhead at the far right *\/\n        content: '';\n        position: absolute;\n        right: -2px;\n        top: 50%;\n        width: 0;\n        height: 0;\n        border-left: 12px solid var(--red);\n        border-top: 8px solid transparent;\n        border-bottom: 8px solid transparent;\n        transform: translateY(-50%);\n    }\n\n    #pickware-ai-root .wn-line .pulse {\n        position: absolute;\n        top: -5px;\n        left: 18%;\n        width: 12px;\n        height: 12px;\n        border-radius: 50%;\n        background: var(--red);\n        box-shadow: 0 0 18px rgba(255, 87, 87, 0.8), 0 0 0 4px rgba(255, 87, 87, 0.25);\n        animation: wn-travel 5s linear infinite;\n    }\n\n    @keyframes wn-travel {\n        0% {\n            left: 18%;\n            opacity: 0;\n        }\n\n        8% {\n            opacity: 1;\n        }\n\n        92% {\n            opacity: 1;\n        }\n\n        100% {\n            left: 98%;\n            opacity: 0;\n        }\n    }\n\n    #pickware-ai-root .wn-ticks {\n        position: absolute;\n        inset: 0;\n        z-index: 1;\n        pointer-events: none;\n    }\n\n    #pickware-ai-root .wn-ticks .tick {\n        position: absolute;\n        top: 50%;\n        width: 1px;\n        height: 12px;\n        background: rgba(255, 255, 255, 0.18);\n        transform: translate(-50%, -50%);\n    }\n\n    #pickware-ai-root .wn-nodes {\n        position: relative;\n        z-index: 2;\n        display: grid;\n        grid-template-columns: repeat(3, 1fr);\n        align-items: center;\n        min-height: 320px;\n    }\n\n    #pickware-ai-root .wn-node {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        text-align: center;\n        padding: 0 12px;\n    }\n\n    #pickware-ai-root .wn-node.above {\n        transform: translateY(-120px);\n    }\n\n    #pickware-ai-root .wn-node.below {\n        transform: translateY(120px);\n    }\n\n    #pickware-ai-root .wn-node .dot-wrap {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        width: 24px;\n        height: 24px;\n        display: grid;\n        place-items: center;\n    }\n\n    #pickware-ai-root .wn-node .dot-wrap::before {\n        content: '';\n        position: absolute;\n        inset: 0;\n        border-radius: 50%;\n        background: var(--red);\n        box-shadow: 0 0 0 4px rgba(255, 87, 87, 0.22), 0 0 20px rgba(255, 87, 87, 0.6);\n        animation: wn-pulse 2.2s ease-in-out infinite;\n    }\n\n    @keyframes wn-pulse {\n\n        0%,\n        100% {\n            box-shadow: 0 0 0 4px rgba(255, 87, 87, 0.22), 0 0 20px rgba(255, 87, 87, 0.6);\n        }\n\n        50% {\n            box-shadow: 0 0 0 10px rgba(255, 87, 87, 0.05), 0 0 28px rgba(255, 87, 87, 0.9);\n        }\n    }\n\n    #pickware-ai-root .wn-node.now .dot-wrap::before {\n        background: rgba(255, 255, 255, 0.9);\n        box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.1);\n        animation: none;\n    }\n\n    #pickware-ai-root .wn-node .connector {\n        position: absolute;\n        left: 50%;\n        width: 1px;\n        background: repeating-linear-gradient(to bottom,\n                rgba(255, 87, 87, 0.6) 0 4px,\n                transparent 4px 8px);\n    }\n\n    #pickware-ai-root .wn-node.above .connector {\n        top: calc(50% + 12px);\n        height: 88px;\n    }\n\n    #pickware-ai-root .wn-node.below .connector {\n        bottom: calc(50% + 12px);\n        height: 88px;\n        background: repeating-linear-gradient(to top,\n                rgba(255, 87, 87, 0.6) 0 4px,\n                transparent 4px 8px);\n    }\n\n    #pickware-ai-root .wn-node.now .connector {\n        background: repeating-linear-gradient(to bottom,\n                rgba(255, 255, 255, 0.35) 0 4px,\n                transparent 4px 8px);\n    }\n\n    #pickware-ai-root .wn-node.now.above .connector {\n        background: repeating-linear-gradient(to bottom,\n                rgba(255, 255, 255, 0.35) 0 4px,\n                transparent 4px 8px);\n    }\n\n    #pickware-ai-root .wn-label {\n        position: relative;\n    }\n\n    #pickware-ai-root .wn-label .wn-when {\n        font-family: \"Roboto Mono\", monospace;\n        font-weight: 700;\n        font-size: 11px;\n        letter-spacing: 0.14em;\n        text-transform: uppercase;\n        color: var(--red);\n        margin-bottom: 10px;\n        display: inline-block;\n    }\n\n    #pickware-ai-root .wn-node.now .wn-label .wn-when {\n        color: rgba(255, 255, 255, 0.55);\n    }\n\n    #pickware-ai-root .wn-label h3 {\n        font-family: \"Fira Sans\", sans-serif;\n        font-weight: 900;\n        font-style: italic;\n        font-size: 40px;\n        line-height: 1.0;\n        letter-spacing: -0.01em;\n        color: var(--white);\n        margin: 0;\n        text-wrap: balance;\n        white-space: nowrap;\n    }\n\n    #pickware-ai-root .wn-node.now .wn-label h3 {\n        color: var(--white);\n    }\n\n    #pickware-ai-root .wn-node.below .wn-label h3 {\n        color: var(--red);\n    }\n\n    #pickware-ai-root .wn-node.above .wn-label {\n        margin-bottom: 100px;\n    }\n\n    #pickware-ai-root .wn-node.below .wn-label {\n        margin-top: 100px;\n    }\n\n    #pickware-ai-root .wn-label h3.wn-blur {\n        filter: blur(9px);\n        text-shadow: 0 0 18px rgba(255, 87, 87, 0.7), 0 0 40px rgba(255, 87, 87, 0.4);\n        animation: wn-blur-pulse 2.6s ease-in-out infinite;\n        user-select: none;\n        will-change: opacity;\n    }\n\n    @keyframes wn-blur-pulse {\n\n        0%,\n        100% {\n            opacity: 0.7;\n        }\n\n        50% {\n            opacity: 1;\n        }\n    }\n\n\n    #pickware-ai-root section.mcp {\n        background: var(--purple);\n        padding: 120px 0 100px;\n    }\n\n    #pickware-ai-root .mcp h2 {\n        font-family: \"Fira Sans\", sans-serif;\n        font-weight: 900;\n        font-style: italic;\n        font-size: clamp(44px, 5.2vw, 60px);\n        line-height: 1;\n        letter-spacing: -0.01em;\n        color: var(--white);\n        margin-bottom: 24px;\n    }\n\n    #pickware-ai-root .mcp p.lead {\n        font-size: 22px;\n        line-height: 1.25;\n        letter-spacing: -0.03em;\n        color: var(--white);\n        max-width: 780px;\n        margin-bottom: 64px;\n    }\n\n    #pickware-ai-root .mcp-stage {\n        background:\n            linear-gradient(rgba(131, 107, 255, .16) 1px, transparent 1px),\n            linear-gradient(90deg, rgba(131, 107, 255, .16) 1px, transparent 1px),\n            var(--ink);\n        background-size: 28px 28px, 28px 28px, auto;\n        border-radius: 16px;\n        padding: 61px 60px;\n        display: grid;\n        grid-template-columns: 1fr auto 1fr auto 1fr;\n        gap: 16px;\n        align-items: center;\n        min-height: 330px;\n        align-items: stretch;\n    }\n\n    #pickware-ai-root .mcp-card {\n        background: #331D55;\n        border-radius: 12px;\n        padding: 32px 30px;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n    }\n\n    #pickware-ai-root .mcp-card .tag,\n    #pickware-ai-root .mcp-center .tag {\n        font-family: \"Roboto Mono\", monospace;\n        font-weight: 700;\n        font-size: 12px;\n        color: var(--white);\n        opacity: 0.5;\n        margin: 8px 0;\n    }\n\n    #pickware-ai-root .mcp-card .name {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 22px;\n        line-height: 1.3;\n        color: var(--white);\n        white-space: pre-line;\n    }\n\n    #pickware-ai-root .mcp-card .name-list {\n        display: flex;\n        flex-direction: column;\n        gap: 6px;\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 22px;\n        line-height: 1.15;\n        color: var(--white);\n    }\n\n    #pickware-ai-root .mcp-card .name-list .row {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n    }\n\n    #pickware-ai-root .mcp-card .name-list .row .logo {\n        width: 22px;\n        height: 22px;\n        flex: 0 0 22px;\n        display: grid;\n        place-items: center;\n    }\n\n    #pickware-ai-root .mcp-card .name-list .row .logo svg {\n        display: block;\n        width: 100%;\n        height: 100%;\n    }\n\n\n    #pickware-ai-root .mcp-card.pickware {\n        border: 4px solid var(--purple);\n    }\n\n    #pickware-ai-root .mcp-card.pickware .pill {\n        display: inline-block;\n        background: var(--purple);\n        color: var(--white);\n        font-family: \"Roboto Mono\", monospace;\n        font-weight: 700;\n        font-size: 12px;\n        padding: 3px 10px;\n        border-radius: 4px;\n        margin-bottom: 8px;\n        align-self: flex-start;\n    }\n\n    #pickware-ai-root .mcp-center {\n        background: #331D55;\n        border-radius: 12px;\n        padding: 32px 30px;\n        display: flex;\n        flex-direction: column;\n        justify-content: space-between;\n    }\n\n    #pickware-ai-root .mcp-center .brand {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 22px;\n        line-height: 1.4;\n        color: var(--white);\n        display: flex;\n        align-items: center;\n        gap: 10px;\n    }\n\n    #pickware-ai-root .mcp-center .brand::before {\n        content: '';\n        display: inline-block;\n        width: 7px;\n        height: 7px;\n        border-radius: 50%;\n        background: var(--white);\n        opacity: 0.4;\n        flex-shrink: 0;\n    }\n\n    #pickware-ai-root .arrow {\n        display: grid;\n        place-items: center;\n    }\n\n    #pickware-ai-root .arrow-icon {\n        display: block;\n        line-height: 0;\n        transition: transform 0.3s ease;\n    }\n\n    #pickware-ai-root .arrow svg {\n        width: 32px;\n        height: 32px;\n        color: #846AFF;\n    }\n\n    #pickware-ai-root .mcp-benefits {\n        margin-top: 40px;\n        border: 1px solid var(--ink);\n        border-radius: 16px;\n        display: grid;\n        grid-template-columns: 1fr 1fr 1fr;\n        overflow: hidden;\n    }\n\n    #pickware-ai-root .benefit {\n        padding: 36px 38px;\n        border-right: 1px solid var(--ink);\n        display: flex;\n        flex-direction: column;\n        gap: 14px;\n    }\n\n    #pickware-ai-root .benefit:last-child {\n        border-right: none;\n    }\n\n\n    #pickware-ai-root .benefit .num {\n        font-family: \"Roboto Mono\", monospace;\n        font-weight: 700;\n        font-size: 14px;\n        color: var(--white);\n        opacity: 0.7;\n    }\n\n    #pickware-ai-root .benefit h4 {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 32px;\n        line-height: 1.1;\n        color: var(--color--violet-900);\n        letter-spacing: -0.01em;\n    }\n\n    #pickware-ai-root .benefit p {\n        font-size: 16px;\n        line-height: 1.4;\n        color: var(--color--violet-900);\n        font-weight: 500;\n    }\n\n    #pickware-ai-root section.webinar {\n        padding-bottom: 96px;\n        background: var(--black);\n        position: relative;\n        overflow: hidden;\n    }\n\n    #pickware-ai-root section.webinar>canvas.dither {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        pointer-events: none;\n        z-index: 0;\n    }\n\n    #pickware-ai-root section.webinar>.container {\n        position: relative;\n        z-index: 1;\n    }\n\n    #pickware-ai-root .webinar-card {\n        display: grid;\n        grid-template-columns: 617fr 600fr;\n        border-radius: 16px;\n        overflow: hidden;\n        min-height: 698px;\n        box-shadow:\n            0 4px 6px rgba(0, 0, 0, 0.07),\n            0 10px 20px rgba(0, 0, 0, 0.12),\n            0 30px 60px rgba(0, 0, 0, 0.18),\n            0 60px 100px rgba(0, 0, 0, 0.12);\n    }\n\n    #pickware-ai-root .webinar-left {\n        background: var(--slate);\n        color: var(--ink);\n        padding: 91px 61px;\n        display: flex;\n        flex-direction: column;\n    }\n\n    #pickware-ai-root .badge-webinar {\n        display: inline-flex;\n        align-items: center;\n        background: var(--color--lime-900);\n        color: #aced57;\n        border-radius: 23px;\n        height: 38px;\n        padding: 0 16px 0 8px;\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 16px;\n        letter-spacing: -0.03em;\n        margin-bottom: 40px;\n        align-self: flex-start;\n        gap: 10px;\n    }\n\n    #pickware-ai-root .badge-webinar .led {\n        width: 22px;\n        height: 22px;\n        border-radius: 50%;\n        background: #aced57;\n        display: grid;\n        place-items: center;\n        position: relative;\n    }\n\n    #pickware-ai-root .badge-webinar .led::after {\n        content: \"\";\n        width: 8px;\n        height: 8px;\n        border-radius: 50%;\n        background: var(--color--red-500);\n        animation: pulse-led 1.8s ease-in-out infinite;\n    }\n\n    #pickware-ai-root .webinar-left h2 {\n        font-family: \"Fira Sans\", sans-serif;\n        font-weight: 900;\n        font-style: italic;\n        font-size: clamp(60px, 7vw, 92px);\n        line-height: 0.95;\n        letter-spacing: -0.01em;\n        color: var(--color--lime-900);\n        margin-bottom: 32px;\n    }\n\n    #pickware-ai-root .webinar-left p.desc {\n        font-size: 18px;\n        line-height: 1.4;\n        color: var(--color--lime-900);\n        max-width: 44ch;\n        margin-bottom: 32px;\n        font-weight: 400;\n    }\n\n    #pickware-ai-root .speaker {\n        display: flex;\n        align-items: center;\n        gap: 14px;\n        margin-bottom: auto;\n    }\n\n    #pickware-ai-root .speaker .avatar {\n        width: 48px;\n        height: 48px;\n        border-radius: 50%;\n        background: url('https:\/\/www.pickware.com\/app\/uploads\/2026\/04\/samy.jpg') center\/cover no-repeat;\n    }\n\n    #pickware-ai-root .speaker .who strong {\n        display: block;\n        font-weight: 700;\n        font-size: 15px;\n        color: var(--color--lime-900);\n    }\n\n    #pickware-ai-root .speaker .who span {\n        font-size: 13px;\n        color: rgba(32, 10, 43, 0.65);\n    }\n\n    #pickware-ai-root .date-pills {\n        display: inline-flex;\n        background: var(--lime);\n        border: 1px solid rgba(34, 51, 10, 0.2);\n        border-radius: 8px;\n        height: 61px;\n        align-self: flex-start;\n        overflow: hidden;\n        margin-bottom: 24px;\n    }\n\n    #pickware-ai-root .date-pills .pill {\n        padding: 0 20px;\n        display: grid;\n        place-items: center;\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 500;\n        font-size: 16px;\n        color: var(--olive);\n        border-right: 1px solid rgba(34, 51, 10, 0.2);\n    }\n\n    #pickware-ai-root .date-pills .pill:last-child {\n        border-right: none;\n    }\n\n    #pickware-ai-root .webinar-right {\n        background: var(--lime);\n        color: var(--olive);\n        padding: 91px 61px;\n    }\n\n    #pickware-ai-root .webinar-right h3 {\n        font-family: \"Roboto\", sans-serif;\n        font-weight: 700;\n        font-size: 22px;\n        color: var(--olive);\n        margin-bottom: 28px;\n        letter-spacing: -0.01em;\n    }\n\n    \/* =============================================\n     MEDIA QUERIES \u2014 alle Breakpoints gesammelt\n     ============================================= *\/\n\n    @media (max-width: 984px) {\n\n        #pickware-ai-root .wn-line,\n        #pickware-ai-root .wn-ticks {\n            display: none;\n        }\n\n        #pickware-ai-root .wn-timeline {\n            padding: 0;\n        }\n\n        #pickware-ai-root .wn-nodes {\n            position: relative;\n            grid-template-columns: 1fr;\n            min-height: 0;\n            gap: 0;\n            padding-left: 48px;\n            border-left: 2px solid var(--red);\n        }\n\n        #pickware-ai-root .wn-nodes::after {\n            content: '';\n            position: absolute;\n            bottom: -12px;\n            left: -1px;\n            transform: translateX(-50%);\n            width: 0;\n            height: 0;\n            border-left: 8px solid transparent;\n            border-right: 8px solid transparent;\n            border-top: 12px solid var(--red);\n        }\n\n        #pickware-ai-root .wn-node {\n            flex-direction: row;\n            align-items: flex-start;\n            text-align: left;\n            transform: none;\n            padding: 28px 0;\n            gap: 0;\n        }\n\n        #pickware-ai-root .wn-node.above,\n        #pickware-ai-root .wn-node.below {\n            transform: none;\n        }\n\n        #pickware-ai-root .wn-node .dot-wrap {\n            position: absolute;\n            top: 30px;\n            left: -60px;\n            transform: none;\n        }\n\n        #pickware-ai-root .wn-node .connector {\n            display: none;\n        }\n\n        #pickware-ai-root .wn-node.above .wn-label,\n        #pickware-ai-root .wn-node.below .wn-label {\n            margin: 0;\n        }\n\n        #pickware-ai-root .wn-label h3 {\n            white-space: normal;\n            font-size: 32px;\n        }\n    }\n\n    @media (max-width: 981px) {\n        #pickware-ai-root .case-row {\n            grid-template-columns: 1fr;\n        }\n\n        #pickware-ai-root .case-row .case-text {\n            order: 2;\n        }\n\n        #pickware-ai-root .case-row .tile {\n            order: 1;\n        }\n    }\n\n    @media (max-width: 980px) {\n        #pickware-ai-root .mcp-stage {\n            grid-template-columns: 1fr;\n            gap: 32px;\n            padding: 40px 28px;\n        }\n\n        #pickware-ai-root .mcp-stage .arrow {\n            justify-self: center;\n        }\n\n        #pickware-ai-root .mcp-stage .arrow-icon {\n            transform: rotate(90deg);\n        }\n\n        #pickware-ai-root .webinar-card {\n            grid-template-columns: 1fr;\n        }\n    }\n\n    @media (max-width: 860px) {\n        #pickware-ai-root .mcp-benefits {\n            grid-template-columns: 1fr;\n        }\n\n        #pickware-ai-root .benefit {\n            border-right: none;\n            border-bottom: 1px solid var(--ink);\n        }\n\n        #pickware-ai-root .benefit:last-child {\n            border-bottom: none;\n        }\n    }\n\n    @media (max-width: 768px) {\n        #pickware-ai-root section.cases {\n            padding: 0;\n        }\n\n        #pickware-ai-root .case-text {\n            padding: 24px 0 48px 0;\n        }\n\n        #pickware-ai-root .case-text h3 {\n            font-size: 26px;\n            line-height: 1.1;\n            margin-bottom: 20px;\n        }\n\n        #pickware-ai-root .case-text p {\n            font-size: 26px;\n            line-height: 1.1;\n            margin-bottom: 28px;\n            max-width: 38ch;\n        }\n\n        #pickware-ai-root .tile {\n            padding: 8px 8px 16px 8px;\n            min-height: auto;\n            gap: 16px;\n        }\n\n        #pickware-ai-root h1.hero-title {\n            font-size: clamp(54px, 10vw, 112px);\n        }\n\n        #pickware-ai-root .benefit {\n            padding: 24px;\n            border-right: none;\n        }\n\n        #pickware-ai-root .benefit h4 {\n            font-size: 26px;\n        }\n\n        #pickware-ai-root .webinar-left {\n            padding: 48px 24px;\n        }\n\n        #pickware-ai-root .webinar-left h2 {\n            font-size: clamp(44px, 7vw, 92px);\n        }\n\n        #pickware-ai-root .webinar-right {\n            padding: 48px 24px;\n        }\n\n        #pickware-ai-root .screenshot .chat-window {\n            border-radius: 16px;\n        }\n    }\n\n    @media (max-width: 720px) {\n        #pickware-ai-root .container {\n            padding: 0 20px;\n        }\n\n        #pickware-ai-root .wn-timeline {\n            margin-left: 16px;\n        }\n    }\n\n    @media (max-width: 520px) {\n        #pickware-ai-root .facts .facts-grid {\n            grid-template-columns: 1fr;\n        }\n    }\n\n    @media (max-width: 500px) {\n        #pickware-ai-root .chat-card .footer {\n            display: none;\n        }\n\n        #pickware-ai-root .chat-card .avatar {\n            display: none;\n        }\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n\n        #pickware-ai-root .chat-card[data-animate] .msg-user,\n        #pickware-ai-root .chat-card[data-animate] .msg-ai .avatar,\n        #pickware-ai-root .chat-card[data-animate] .tool-line,\n        #pickware-ai-root .chat-card[data-animate] .tool-foot,\n        #pickware-ai-root .chat-card[data-animate] .answer {\n            opacity: 1 !important;\n            transform: none !important;\n            transition: none !important;\n        }\n\n        #pickware-ai-root .chat-controls {\n            display: none;\n        }\n\n        #pickware-ai-root .wn-label h3.wn-blur {\n            animation: none;\n        }\n    }\n<\/style>\n\n<div id=\"pickware-ai-root\">\n    <!-- ========= HERO ========= -->\n    <section class=\"hero\" aria-label=\"Pickware AI \u2013 AI f\u00fcr deine Warenwirtschaft\">\n        <div id=\"hero-canvas\" class=\"dither\">\n            <div class=\"hero-layer\" data-hero-fx=\"waves\" data-active=\"true\"><\/div>\n        <\/div>\n\n        <div class=\"container hero-inner\">\n            <h1 class=\"hero-title\"><span class=\"badge\">A NEW CHAPTER<\/span>Introducing Pickware AI<\/h1>\n            <p class=\"hero-sub\">Mit Pickware AI beginnt f\u00fcr dich eine neue Art, mit deinem ERP zu arbeiten. F\u00fcr mehr\n                Outcome \u2013\n                rund um die Uhr.<\/p>\n            <a href=\"#webinar\" class=\"btn-primary\" aria-label=\"Zum Pickware AI Webinar am 15. Mai anmelden\">Zum Webinar\n                anmelden<\/a>\n        <\/div>\n\n        <div class=\"container\">\n            <div class=\"screenshot\">\n                <div class=\"chat-window\">\n                    <!-- Hero UI Animation -->\n                    <div id=\"hwWrap\" class=\"hw-wrap\">\n                        <div id=\"hwStage\" class=\"hw-stage\">\n                            <div id=\"hwStageZoom\" class=\"hw-stage-zoom\">\n\n                                <div class=\"hw-bg-fullshot\"><\/div>\n                                <div class=\"hw-bg-table\"><\/div>\n                                <div class=\"hw-bg-ws1\"><\/div>\n                                <div class=\"hw-bg-ws2\"><\/div>\n\n                                <div class=\"hw-navi-bar\">\n                                    <div class=\"hw-navi-logo\">P<\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 22\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                                                d=\"M2.04938 11H3C3.55228 11 4 11.4477 4 12C4 12.5523 3.55228 13 3 13H2.04958C2.32821 15.7977 3.76679 18.3236 5.99885 20H7.97217C8.52445 20 8.97217 20.4477 8.97217 21C8.97217 21.5523 8.52445 22 7.97217 22H5.67384C5.46771 22 5.26661 21.9363 5.09808 21.8176C1.9267 19.5843 0 15.9533 0 12C0 5.37258 5.37258 0 12 0C18.6274 0 24 5.37258 24 12C24 15.9533 22.0733 19.5843 18.9019 21.8176C18.7334 21.9363 18.5323 22 18.3262 22H15.876C15.3237 22 14.876 21.5523 14.876 21C14.876 20.4477 15.3237 20 15.876 20H18.0011C20.2332 18.3236 21.6718 15.7977 21.9504 13H21C20.4477 13 20 12.5523 20 12C20 11.4477 20.4477 11 21 11H21.9506C21.4816 6.27558 17.7244 2.51844 13 2.04938V3C13 3.55228 12.5523 4 12 4C11.4477 4 11 3.55228 11 3V2.04938C6.27558 2.51844 2.51844 6.27558 2.04938 11zM12.7372 12.6757C12.364 13.0828 11.7314 13.1103 11.3243 12.7372C10.9172 12.364 10.8897 11.7314 11.2628 11.3243L15.3535 6.86175C15.7267 6.45463 16.3593 6.42713 16.7664 6.80032C17.1735 7.17352 17.201 7.80608 16.8278 8.2132L12.7372 12.6757z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                                                d=\"M5.89204 3.00002C6.44433 3.00002 6.89204 3.44774 6.89204 4.00002C6.89204 4.55231 6.44433 5.00002 5.89204 5.00002H3.78955C3.25769 5.00002 2.81888 5.41634 2.79093 5.94746L2.00146 20.9475C1.97243 21.499 2.39599 21.9696 3.00008 22H20.8103C21.3626 22 21.8103 21.5523 21.8089 20.9475L21.0195 5.94744C20.9915 5.41632 20.5527 5 20.0208 5H17.892C17.3398 5 16.892 4.55228 16.892 4C16.892 3.44772 17.3398 3 17.892 3H20.0208C21.6164 3 22.9328 4.24895 23.0167 5.84232L23.8062 20.8423C23.8096 20.9211 23.8096 20.9211 23.8103 21C23.8103 22.6569 22.4672 24 20.8103 24H3.00008C2.9212 23.9993 2.9212 23.9993 2.8424 23.9959C1.18783 23.9088 -0.0828608 22.4969 0.00422151 20.8423L0.793695 5.84235C0.877557 4.24897 2.19397 3.00002 3.78955 3.00002H5.89204ZM9.89204 5C9.89204 5.55228 9.44433 6 8.89204 6C8.33976 6 7.89204 5.55228 7.89204 5V3C7.89204 1.34315 9.23519 0 10.892 0H12.892C14.5489 0 15.892 1.34315 15.892 3V5C15.892 5.55228 15.4443 6 14.892 6C14.3398 6 13.892 5.55228 13.892 5V3C13.892 2.44772 13.4443 2 12.892 2H10.892C10.3398 2 9.89204 2.44772 9.89204 3V5Z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                                                d=\"M10 9C9.44771 9 9 9.44771 9 10V21C9 21.5523 9.44771 22 10 22H21C21.5523 22 22 21.5523 22 21V10C22 9.44771 21.5523 9 21 9H10ZM15 7V3C15 2.44772 14.5523 2 14 2H3C2.44772 2 2 2.44772 2 3V14C2 14.5523 2.44772 15 3 15H7V10C7 8.34315 8.34315 7 10 7H15ZM17 7H21C22.6569 7 24 8.34315 24 10V21C24 22.6569 22.6569 24 21 24H10C8.34315 24 7 22.6569 7 21V17H3C1.34315 17 0 15.6569 0 14V3C0 1.34315 1.34315 0 3 0H14C15.6569 0 17 1.34315 17 3V7Z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 22\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                                                d=\"M7.99978 1.99992C5.7907 1.99992 3.99989 3.79073 3.99989 5.9998C3.99989 8.20888 5.7907 9.9997 7.99978 9.9997C10.2089 9.9997 11.9997 8.20888 11.9997 5.9998C11.9997 3.79073 10.2089 1.99992 7.99978 1.99992zM7.99978 -0.000028C11.3134 -0.000028 13.9996 2.68619 13.9996 5.9998C13.9996 9.3134 11.3134 11.9996 7.99978 11.9996C4.68616 11.9996 1.99994 9.3134 1.99994 5.9998C1.99994 2.68619 4.68616 -0.000028 7.99978 -0.000028zM1.99994 21.0984C1.99994 21.6507 1.55224 22.0984 0.999972 22.0984C0.447703 22.0984 0 21.6507 0 21.0984V18.9994C0 16.2381 2.23851 13.9996 4.99986 13.9996H11.0004C13.7617 13.9996 16.0003 16.2381 16.0003 18.9994V21.0984C16.0003 21.6507 15.5526 22.0984 15.0003 22.0984C14.448 22.0984 14.0003 21.6507 14.0003 21.0984V18.9994C14.0003 17.3426 12.6572 15.9995 11.0004 15.9995H4.99986C3.34305 15.9995 1.99994 17.3426 1.99994 18.9994V21.0984zM15.8006 2.07995C15.2594 1.97008 14.9097 1.44226 15.0196 0.90103C15.1294 0.3598 15.6572 0.01011 16.1985 0.11997C18.9746 0.68349 20.9994 3.13329 20.9994 5.9998C20.9994 8.86632 18.9746 11.3161 16.1985 11.8796C15.6572 11.9895 15.1294 11.6398 15.0196 11.0986C14.9097 10.5573 15.2594 10.0295 15.8006 9.9197C17.649 9.5445 18.9995 7.91056 18.9995 5.9998C18.9995 4.08905 17.649 2.45514 15.8006 2.07995zM19.0002 15.9995C18.4479 15.9995 18.0002 15.5518 18.0002 14.9996C18.0002 14.4473 18.4479 13.9996 19.0002 13.9996C21.7615 13.9996 24 16.2381 24 18.9994V21.0984C24 21.6507 23.5523 22.0984 23.0001 22.0984C22.4478 22.0984 22.0001 21.6507 22.0001 21.0984V18.9994C22.0001 17.3426 20.657 15.9995 19.0002 15.9995z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path\n                                                d=\"M23.41,5.09l-11-5a1,1,0,0,0-.82,0l-11,5A1,1,0,0,0,0,6V23a1,1,0,0,0,1,1H23a1,1,0,0,0,1-1V6A1,1,0,0,0,23.41,5.09ZM6,16H18v2H6Zm12-2H6V12H18ZM6,20H18v2H6Zm16,2H20V11a1,1,0,0,0-1-1H5a1,1,0,0,0-1,1V22H2V6.64L12,2.1,22,6.64Z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path\n                                                d=\"M14.983 4a.88.88 0 01.876.775l.006.102v2.897l3.454.001c.157 0 .31.04.443.116l.097.063.088.077 3.797 3.776a.876.876 0 01.249.506l.007.115v5.393c0 .45-.34.82-.78.871l-.102.006h-1.342l-.006.027a2.765 2.765 0 01-2.344 2.088l-.181.017-.168.005a2.769 2.769 0 01-2.647-1.945l-.052-.193H7.695l-.001.012a2.764 2.764 0 01-2.387 2.27l-.174.016-.17.005a2.767 2.767 0 01-2.698-2.13l-.034-.173-1.349.001a.882.882 0 01-.857-.668l-.02-.107L0 17.82V4.877c0-.45.34-.82.78-.871L.881 4h14.1zM4.95 17.08c-.561 0-1.016.452-1.016 1.01S4.39 19.1 4.95 19.1c.56 0 1.016-.452 1.016-1.01s-.455-1.01-1.016-1.01zm14.1 0c-.56 0-1.016.452-1.016 1.01s.455 1.01 1.016 1.01c.561 0 1.016-.452 1.016-1.01s-.455-1.01-1.016-1.01zM14.1 5.755H1.765v11.188h.667l.052-.11a2.765 2.765 0 012.281-1.5l.185-.006c1.051 0 2 .592 2.466 1.507l.051.109H14.1V5.755zm4.858 3.775h-3.094v7.413h.668l.052-.11a2.765 2.765 0 012.282-1.5l.184-.006c1.052 0 2 .592 2.466 1.507l.051.109h.667v-4.155L18.958 9.53z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 32 32\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path\n                                                d=\"m31.08,2.6c-.61-.33-1.37-.1-1.69.51l-2.22,4.14h-4.54c-.69,0-1.25.56-1.25,1.25h0c0,.69.56,1.25,1.25,1.25h3.96v16.53c0,.5-.41.9-.9.9H6.3c-.5,0-.9-.41-.9-.9V9.75h3.96c.69,0,1.25-.56,1.25-1.25h0c0-.69-.56-1.25-1.25-1.25h-4.54L2.61,3.11c-.33-.61-1.08-.84-1.69-.51-.61.33-.84,1.08-.51,1.69l2.49,4.65v17.33c0,1.88,1.52,3.4,3.4,3.4h19.39c1.88,0,3.4-1.52,3.4-3.4V8.94l2.49-4.65c.33-.61.1-1.37-.51-1.69Z\" \/>\n                                            <path\n                                                d=\"m15.12,20.18c.49.49,1.28.49,1.77,0l3.96-3.96c.49-.49.49-1.28,0-1.77h0c-.49-.49-1.28-.49-1.77,0l-1.83,1.83V5.44c0-.69-.56-1.25-1.25-1.25h0c-.69,0-1.25.56-1.25,1.25v10.84l-1.83-1.83c-.49-.49-1.28-.49-1.77,0h0c-.49.49-.49,1.28,0,1.77l3.96,3.96Z\" \/>\n                                        <\/svg><\/div>\n                                    <div class=\"hw-navi-icon\"><svg viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                                                d=\"M11.1274 13.2868L5.70711 18.7071C5.31658 19.0976 4.68342 19.0976 4.29289 18.7071C3.90237 18.3166 3.90237 17.6834 4.29289 17.2929L10.2929 11.2929C10.63 10.9558 11.1581 10.9035 11.5547 11.1679L13.8726 12.7132L20.2929 6.29289C20.6834 5.90237 21.3166 5.90237 21.7071 6.29289C22.0976 6.68342 22.0976 7.31658 21.7071 7.70711L14.7071 14.7071C14.37 15.0442 13.8419 15.0965 13.4453 14.8321L11.1274 13.2868ZM0 1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1V21C2 21.5523 2.44772 22 3 22H23C23.5523 22 24 22.4477 24 23C24 23.5523 23.5523 24 23 24H3C1.34315 24 0 22.6569 0 21V1Z\" \/>\n                                        <\/svg><\/div>\n                                <\/div>\n                                <div class=\"hw-navi-trenner\"><\/div>\n\n                                <div class=\"hw-content-header\" id=\"hwContentHeader\" style=\"left:588px;\">\n                                    <div class=\"hw-header-mask\"><\/div>\n                                    <div class=\"hw-content-title\">Produkte (500)<\/div>\n                                <\/div>\n\n                                <div class=\"hw-pickware-ai\" id=\"hwPickwareAi\" style=\"left:2154px;\">\n                                    <div class=\"hw-pickware-ui\">\n                                        <div class=\"hw-pickware-bg\"><\/div>\n                                        <div class=\"hw-pickware-header\">\n                                            <div class=\"hw-pickware-header-bg\"><\/div>\n                                            <div class=\"hw-pickware-trenner\" style=\"opacity:0\"><\/div>\n                                            <div class=\"hw-pickware-title\">Pickware AI<\/div>\n                                        <\/div>\n                                        <div class=\"hw-input-area\">\n                                            <div class=\"hw-qa-question\" id=\"hwQaQuestion\">Wie lange reicht unser Bestand\n                                                vom Oversize Tee\n                                                Washed Black noch?<\/div>\n                                            <div class=\"hw-qa-loading\" id=\"hwQaLoading\">\n                                                <div class=\"dot\"><\/div>\n                                                <div class=\"dot\"><\/div>\n                                                <div class=\"dot\"><\/div>\n                                            <\/div>\n                                            <div class=\"hw-qa-tool hw-qa-tool-1\" id=\"hwQaTool1\">\n                                                <div class=\"hw-qa-tool-label\">stock.get(SKU-1042)<\/div>\n                                                <div class=\"hw-qa-tool-chevron\"><svg width=\"20\" height=\"11.4\"\n                                                        viewBox=\"0 0 20 11.4\"\n                                                        style=\"position:absolute;left:6px;top:10.6px;\" fill=\"#1C1C20\">\n                                                        <path\n                                                            d=\"M 10 11.4 L 0 1.4 L 1.4 0 L 10 8.6 L 18.6 0 L 20 1.4 L 10 11.4 Z\" \/>\n                                                    <\/svg><\/div>\n                                            <\/div>\n                                            <div class=\"hw-qa-tool hw-qa-tool-2\" id=\"hwQaTool2\">\n                                                <div class=\"hw-qa-tool-label\">sales.velocity(SKU-1042, 30d)<\/div>\n                                                <div class=\"hw-qa-tool-chevron\"><svg width=\"20\" height=\"11.4\"\n                                                        viewBox=\"0 0 20 11.4\"\n                                                        style=\"position:absolute;left:6px;top:10.6px;\" fill=\"#1C1C20\">\n                                                        <path\n                                                            d=\"M 10 11.4 L 0 1.4 L 1.4 0 L 10 8.6 L 18.6 0 L 20 1.4 L 10 11.4 Z\" \/>\n                                                    <\/svg><\/div>\n                                            <\/div>\n                                            <div class=\"hw-qa-answer\" id=\"hwQaAnswer\">Oversize Tee Washed Black \u2014\n                                                Reichweite nach\n                                                Variante:<br><br><strong>Gr. S ~22 Tage \u2705<\/strong><br>52 Stk. \u00b7 \u00d8 2,4\n                                                Verk\u00e4ufe\/Tag<br><strong>Gr. M ~8 Tage \u26a0\ufe0f<\/strong><br>24 Stk. \u00b7 \u00d8 3,0\n                                                Verk\u00e4ufe\/Tag<br><strong>Gr. L ~18 Tage \u2705<\/strong><br>43 Stk. \u00b7 \u00d8 2,4\n                                                Verk\u00e4ufe\/Tag<br><br>Gr\u00f6\u00dfe\n                                                M wird in ca. 8 Tagen ausverkauft \u2014 Lieferzeit bei TextilPro liegt bei\n                                                10 Tagen. Soll ich eine\n                                                Nachbestellung ansto\u00dfen?<\/div>\n                                            <div class=\"hw-input-box\" id=\"hwInputBox\" style=\"top:1274px;left:0;\">\n                                                <span class=\"hw-placeholder\" id=\"hwInputPlaceholder\">Frage mich\n                                                    etwas<\/span>\n                                                <span class=\"hw-typed\" id=\"hwInputTyped\" style=\"display:none;\"><\/span>\n                                                <div class=\"hw-send\" id=\"hwSendBtn\">\n                                                    <svg viewBox=\"0 0 24.029 23.996\" fill=\"currentColor\">\n                                                        <path\n                                                            d=\"M 23.485 11.106 L 1.485 0.106 C 1.312 0.019 1.118 -0.015 0.927 0.006 C 0.735 0.027 0.554 0.104 0.405 0.226 C 0.262 0.345 0.156 0.502 0.097 0.679 C 0.039 0.855 0.031 1.045 0.075 1.226 L 3.035 11.996 L 0.035 22.736 C -0.006 22.887 -0.011 23.045 0.021 23.198 C 0.052 23.352 0.119 23.495 0.217 23.618 C 0.314 23.74 0.439 23.838 0.581 23.904 C 0.723 23.97 0.878 24.001 1.035 23.996 C 1.191 23.995 1.345 23.957 1.485 23.886 L 23.485 12.886 C 23.648 12.802 23.786 12.674 23.882 12.517 C 23.978 12.36 24.029 12.18 24.029 11.996 C 24.029 11.812 23.978 11.631 23.882 11.474 C 23.786 11.317 23.648 11.19 23.485 11.106 Z M 2.585 21.106 L 4.795 12.996 L 14.035 12.996 L 14.035 10.996 L 4.795 10.996 L 2.585 2.886 L 20.795 11.996 L 2.585 21.106 Z\" \/>\n                                                    <\/svg>\n                                                <\/div>\n                                            <\/div>\n                                        <\/div>\n                                    <\/div>\n                                    <div class=\"hw-pickware-peek\"><\/div>\n                                    <div class=\"hw-ripple\" id=\"hwRipple1\"><\/div>\n                                    <div class=\"hw-ripple wave2\" id=\"hwRipple2\"><\/div>\n                                    <div class=\"hw-ripple wave3\" id=\"hwRipple3\"><\/div>\n                                    <div class=\"hw-pickware-icon\" id=\"hwPickwareIcon\">\n                                        <svg viewBox=\"0 0 41.753 42.386\" fill=\"currentColor\">\n                                            <path\n                                                d=\"M 21.847 0.348 C 21.663 -0.116 21.006 -0.116 20.823 0.348 L 19.608 3.43 C 19.552 3.572 19.439 3.684 19.298 3.74 L 16.215 4.956 C 15.751 5.139 15.751 5.796 16.215 5.979 L 19.298 7.195 C 19.439 7.251 19.552 7.363 19.608 7.505 L 20.823 10.587 C 21.006 11.051 21.663 11.051 21.847 10.587 L 23.062 7.505 C 23.118 7.363 23.23 7.251 23.372 7.195 L 26.454 5.979 C 26.918 5.796 26.918 5.139 26.454 4.956 L 23.372 3.74 C 23.23 3.684 23.118 3.572 23.062 3.43 L 21.847 0.348 Z M 7.649 6.713 C 7.954 5.939 9.049 5.939 9.354 6.713 L 11.207 11.412 C 11.301 11.648 11.488 11.835 11.724 11.928 L 16.423 13.782 C 17.196 14.087 17.196 15.182 16.423 15.487 L 11.724 17.34 C 11.488 17.434 11.301 17.621 11.207 17.857 L 9.354 22.556 C 9.049 23.329 7.954 23.329 7.649 22.556 L 5.796 17.857 C 5.702 17.621 5.515 17.434 5.279 17.34 L 0.58 15.487 C -0.193 15.182 -0.193 14.087 0.58 13.782 L 5.279 11.928 C 5.515 11.835 5.702 11.648 5.796 11.412 L 7.649 6.713 Z M 22.314 22.431 C 22.221 22.667 22.034 22.854 21.798 22.947 L 12.497 26.615 C 11.723 26.92 11.723 28.015 12.497 28.32 L 21.798 31.989 C 22.034 32.082 22.221 32.269 22.314 32.505 L 25.982 41.806 C 26.287 42.579 27.382 42.579 27.688 41.806 L 31.356 32.505 C 31.449 32.269 31.636 32.082 31.872 31.989 L 41.173 28.32 C 41.946 28.015 41.946 26.92 41.173 26.615 L 31.872 22.947 C 31.636 22.854 31.449 22.667 31.356 22.431 L 27.688 13.13 C 27.382 12.356 26.287 12.356 25.982 13.13 L 22.314 22.431 Z M 26.835 20.962 L 25.725 23.776 C 25.259 24.957 24.324 25.892 23.143 26.358 L 20.329 27.468 L 23.143 28.578 C 24.324 29.044 25.259 29.979 25.725 31.16 L 26.835 33.974 L 27.945 31.16 C 28.411 29.979 29.346 29.044 30.527 28.578 L 33.341 27.468 L 30.527 26.358 C 29.346 25.892 28.411 24.957 27.945 23.776 L 26.835 20.962 Z\" \/>\n                                        <\/svg>\n                                    <\/div>\n                                <\/div>\n\n                            <\/div>\n                        <\/div>\n\n                        <button id=\"hwPauseBtn\" class=\"hw-pause-btn\" aria-label=\"Pause\">\n                            <svg class=\"hw-icon-pause\" viewBox=\"0 0 24 24\">\n                                <rect x=\"6\" y=\"5\" width=\"4\" height=\"14\" rx=\"1\" \/>\n                                <rect x=\"14\" y=\"5\" width=\"4\" height=\"14\" rx=\"1\" \/>\n                            <\/svg>\n                            <svg class=\"hw-icon-play\" viewBox=\"0 0 24 24\">\n                                <path d=\"M7 4.5L19 12L7 19.5Z\" \/>\n                            <\/svg>\n                        <\/button>\n                    <\/div>\n\n                    <style>\n                        .hw-wrap {\n                            --hw-bg: #fff;\n                            --hw-panel-bg: #DCE2E8;\n                            --hw-panel-header: #EEF0F3;\n                            --hw-border: #CCD3DB;\n                            --hw-border-strong: #C6C7CE;\n                            --hw-text: #1C1C20;\n                            --hw-muted: #B0BAC7;\n                            --hw-blue: #3994F9;\n                            --hw-blue-soft: #EDF9FC;\n                            position: relative;\n                            width: 100%;\n                            aspect-ratio: 2488 \/ 1600;\n                            overflow: hidden;\n                            font-family: 'Inter', system-ui, -apple-system, sans-serif;\n                        }\n\n                        .hw-stage {\n                            position: absolute;\n                            top: 0;\n                            left: 0;\n                            width: 2488px;\n                            height: 1600px;\n                            background: #09A7FF;\n                            overflow: hidden;\n                            transform-origin: top left;\n                        }\n\n                        .hw-stage-zoom {\n                            position: absolute;\n                            inset: 0;\n                            width: 2488px;\n                            height: 1600px;\n                            overflow: hidden;\n                            transform-origin: 50% 50%;\n                            transform: scale(1);\n                            transition: transform 1100ms cubic-bezier(0.65, 0.05, 0.36, 1),\n                                transform-origin 1100ms cubic-bezier(0.65, 0.05, 0.36, 1);\n                            will-change: transform, transform-origin;\n                        }\n\n                        .hw-bg-fullshot {\n                            position: absolute;\n                            inset: 0;\n                            width: 2500px;\n                            height: 1600px;\n                            background: url('https:\/\/www.pickware.com\/app\/uploads\/2026\/04\/bg-main.webp') center\/cover no-repeat;\n                        }\n\n                        .hw-bg-table {\n                            position: absolute;\n                            left: 160px;\n                            top: 320px;\n                            width: 2006px;\n                            height: 1280px;\n                            overflow: hidden;\n                            background: #d9d9d9;\n                        }\n\n                        .hw-bg-table::before {\n                            content: \"\";\n                            position: absolute;\n                            left: -160px;\n                            top: -320px;\n                            width: 2500px;\n                            height: 2176px;\n                            background: url('https:\/\/www.pickware.com\/app\/uploads\/2026\/04\/table.webp') center\/cover no-repeat;\n                        }\n\n                        .hw-bg-ws1 {\n                            position: absolute;\n                            left: 185px;\n                            top: 0;\n                            width: 2312px;\n                            height: 146px;\n                            background: var(--hw-bg);\n                        }\n\n                        .hw-bg-ws2 {\n                            position: absolute;\n                            left: 185px;\n                            top: 162px;\n                            width: 2312px;\n                            height: 158px;\n                            background: var(--hw-bg);\n                        }\n\n                        .hw-content-header {\n                            position: absolute;\n                            top: 26px;\n                            width: 1324px;\n                            height: 240px;\n                            overflow: hidden;\n                            transition: left 900ms cubic-bezier(0.65, 0.05, 0.36, 1);\n                        }\n\n                        .hw-header-mask {\n                            position: relative;\n                            width: 1324px;\n                            height: 100px;\n                            border-radius: 8px;\n                            overflow: hidden;\n                            background: #d9d9d9;\n                        }\n\n                        .hw-header-mask::before {\n                            content: \"\";\n                            position: absolute;\n                            left: -206px;\n                            top: -30px;\n                            width: 1904px;\n                            height: 2176px;\n                            background: url('https:\/\/www.pickware.com\/app\/uploads\/2026\/04\/header.webp') center\/cover no-repeat;\n                        }\n\n                        .hw-content-title {\n                            position: absolute;\n                            left: 0;\n                            top: 196px;\n                            font-weight: 700;\n                            font-size: 36px;\n                            line-height: 100%;\n                            color: #000;\n                        }\n\n                        .hw-navi-trenner {\n                            position: absolute;\n                            left: 158px;\n                            top: 0;\n                            width: 2px;\n                            height: 1600px;\n                            background: var(--hw-border-strong);\n                        }\n\n                        .hw-navi-bar {\n                            position: absolute;\n                            left: 0;\n                            top: 0;\n                            width: 158px;\n                            height: 1600px;\n                            background: #fff;\n                            display: flex;\n                            flex-direction: column;\n                            align-items: center;\n                            padding-top: 36px;\n                            box-sizing: border-box;\n                        }\n\n                        .hw-navi-logo {\n                            width: 80px;\n                            height: 80px;\n                            border-radius: 50%;\n                            background: #3994F9;\n                            color: #fff;\n                            display: flex;\n                            align-items: center;\n                            justify-content: center;\n                            font-weight: 700;\n                            font-size: 38px;\n                            margin-bottom: 60px;\n                        }\n\n                        .hw-navi-icon {\n                            width: 110px;\n                            height: 70px;\n                            display: flex;\n                            align-items: center;\n                            justify-content: center;\n                            border-radius: 8px;\n                            margin-bottom: 28px;\n                            color: #758CA3;\n                        }\n\n                        .hw-navi-icon svg {\n                            width: 40px;\n                            height: 40px;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(2) {\n                            color: #69D6F0;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(3) {\n                            color: #A092F0;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(4) {\n                            color: #57D9A3;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(5) {\n                            color: #F88962;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(6) {\n                            color: #17A6EB;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(7) {\n                            color: #17A6EB;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(8) {\n                            color: #17A6EB;\n                        }\n\n                        .hw-navi-bar>.hw-navi-icon:nth-child(9) {\n                            color: #17A6EB;\n                        }\n\n                        .hw-pickware-ai {\n                            position: absolute;\n                            top: 0;\n                            width: 934px;\n                            height: 1600px;\n                            overflow: hidden;\n                            transition: left 900ms cubic-bezier(0.65, 0.05, 0.36, 1);\n                        }\n\n                        .hw-pickware-peek {\n                            position: absolute;\n                            left: 0;\n                            top: 320px;\n                            width: 336px;\n                            height: 1280px;\n                            overflow: hidden;\n                            background: #d9d9d9;\n                        }\n\n                        .hw-pickware-peek::before {\n                            content: \"\";\n                            position: absolute;\n                            left: -2164px;\n                            top: -320px;\n                            width: 2500px;\n                            height: 2176px;\n                            background: url('https:\/\/www.pickware.com\/app\/uploads\/2026\/04\/sidebar.webp') center\/cover no-repeat;\n                        }\n\n                        .hw-pickware-icon {\n                            position: absolute;\n                            left: 246px;\n                            top: 58px;\n                            width: 44px;\n                            height: 44px;\n                            color: #000;\n                            transition: color 700ms ease, transform 250ms cubic-bezier(0.5, 1.6, 0.4, 1);\n                            z-index: 5;\n                        }\n\n                        .hw-pickware-icon svg {\n                            position: absolute;\n                            left: 1.582px;\n                            top: 0.949px;\n                            width: 41.753px;\n                            height: 42.386px;\n                        }\n\n                        .hw-pickware-icon.pressed {\n                            transform: scale(0.78);\n                        }\n\n                        .hw-pickware-ui {\n                            position: absolute;\n                            left: 334px;\n                            top: 0;\n                            width: 600px;\n                            height: 1600px;\n                            overflow: hidden;\n                        }\n\n                        .hw-pickware-bg {\n                            position: absolute;\n                            left: 0;\n                            top: 162px;\n                            width: 600px;\n                            height: 1438px;\n                            background: var(--hw-panel-bg);\n                        }\n\n                        .hw-pickware-header {\n                            position: absolute;\n                            left: 0;\n                            top: 0;\n                            width: 600px;\n                            height: 162px;\n                            overflow: hidden;\n                        }\n\n                        .hw-pickware-header-bg {\n                            position: absolute;\n                            left: 0;\n                            top: 0;\n                            width: 600px;\n                            height: 160px;\n                            background: var(--hw-panel-header);\n                            border: 2px solid var(--hw-border);\n                            border-bottom: none;\n                            box-sizing: border-box;\n                        }\n\n                        .hw-pickware-trenner {\n                            position: absolute;\n                            left: 0;\n                            top: 160px;\n                            width: 600px;\n                            height: 2px;\n                            background: var(--hw-border-strong);\n                        }\n\n                        .hw-pickware-trenner::before {\n                            content: \"\";\n                            position: absolute;\n                            left: 0;\n                            top: 0;\n                            width: 2px;\n                            height: 2px;\n                            background: var(--hw-border);\n                        }\n\n                        .hw-pickware-title {\n                            position: absolute;\n                            left: 32px;\n                            top: 61px;\n                            font-weight: 700;\n                            font-size: 32px;\n                            line-height: 100%;\n                            color: #000;\n                        }\n\n                        .hw-input-area {\n                            position: absolute;\n                            left: 32px;\n                            top: 194px;\n                            width: 536px;\n                            height: 1374px;\n                            overflow: hidden;\n                        }\n\n                        .hw-qa-question {\n                            position: absolute;\n                            left: 0;\n                            top: 0;\n                            width: 536px;\n                            min-height: 132px;\n                            border-radius: 8px;\n                            background: var(--hw-blue-soft);\n                            box-sizing: border-box;\n                            padding: 25px 32px;\n                            font-size: 28px;\n                            line-height: 41px;\n                            color: var(--hw-text);\n                            opacity: 0;\n                            transform: translateY(8px);\n                            transition: opacity 350ms ease, transform 350ms ease;\n                        }\n\n                        .hw-qa-question.visible {\n                            opacity: 1;\n                            transform: translateY(0);\n                        }\n\n                        #pickware-ai-root .hw-qa-question {\n                            padding: 25px 32px;\n                        }\n\n                        #pickware-ai-root .hw-navi-bar {\n                            padding-top: 36px;\n                        }\n\n                        #pickware-ai-root .hw-navi-logo {\n                            margin-bottom: 60px;\n                        }\n\n                        #pickware-ai-root .hw-navi-icon {\n                            margin-bottom: 28px;\n                        }\n\n                        .hw-qa-tool {\n                            position: absolute;\n                            left: 0;\n                            width: 536px;\n                            height: 56px;\n                            border-radius: 7px;\n                            background: var(--hw-panel-bg);\n                            border: 2px solid var(--hw-border);\n                            box-sizing: border-box;\n                            opacity: 0;\n                            transform: translateY(8px);\n                            transition: opacity 350ms ease, transform 350ms ease;\n                        }\n\n                        .hw-qa-tool.visible {\n                            opacity: 1;\n                            transform: translateY(0);\n                        }\n\n                        .hw-qa-tool-label {\n                            position: absolute;\n                            left: 20px;\n                            top: 8px;\n                            font-weight: 500;\n                            font-size: 21px;\n                            line-height: 41px;\n                            color: var(--hw-text);\n                            opacity: 0.5;\n                        }\n\n                        .hw-qa-tool-chevron {\n                            position: absolute;\n                            right: 12px;\n                            top: 12px;\n                            width: 32px;\n                            height: 32px;\n                            opacity: 0.5;\n                        }\n\n                        .hw-qa-tool-chevron svg {\n                            display: block;\n                        }\n\n                        .hw-qa-tool-1 {\n                            top: 164px;\n                        }\n\n                        .hw-qa-tool-2 {\n                            top: 236px;\n                        }\n\n                        .hw-qa-answer {\n                            position: absolute;\n                            left: 0;\n                            top: 324px;\n                            width: 516px;\n                            font-size: 28px;\n                            line-height: 41px;\n                            color: var(--hw-text);\n                            opacity: 0;\n                            transform: translateY(8px);\n                            transition: opacity 400ms ease, transform 400ms ease;\n                        }\n\n                        .hw-qa-answer.visible {\n                            opacity: 1;\n                            transform: translateY(0);\n                        }\n\n                        .hw-input-box {\n                            position: absolute;\n                            left: 32px;\n                            width: 536px;\n                            height: 100px;\n                            border-radius: 8px;\n                            background: #fff;\n                            border: 2px solid var(--hw-blue);\n                            box-sizing: border-box;\n                            transition: top 250ms cubic-bezier(0.65, 0.05, 0.36, 1),\n                                height 250ms cubic-bezier(0.65, 0.05, 0.36, 1);\n                        }\n\n                        .hw-input-box.tall {\n                            height: 135px;\n                            top: 1239px !important;\n                        }\n\n                        .hw-input-box.taller {\n                            height: 175px;\n                            top: 1199px !important;\n                        }\n\n                        .hw-placeholder {\n                            position: absolute;\n                            left: 33px;\n                            top: 33px;\n                            font-size: 28px;\n                            line-height: 100%;\n                            color: var(--hw-muted);\n                            transition: opacity 200ms ease;\n                        }\n\n                        .hw-typed {\n                            position: absolute;\n                            left: 33px;\n                            top: 33px;\n                            width: 380px;\n                            font-size: 28px;\n                            line-height: 41px;\n                            color: var(--hw-text);\n                            white-space: normal;\n                            word-break: normal;\n                            overflow-wrap: break-word;\n                        }\n\n                        .hw-typed::after {\n                            content: \"\";\n                            display: inline-block;\n                            width: 2px;\n                            height: 28px;\n                            background: var(--hw-blue);\n                            margin-left: 2px;\n                            transform: translateY(5px);\n                            animation: hw-blink 1s steps(2) infinite;\n                        }\n\n                        .hw-typed.no-cursor::after {\n                            display: none;\n                        }\n\n                        @keyframes hw-blink {\n\n                            0%,\n                            50% {\n                                opacity: 1;\n                            }\n\n                            51%,\n                            100% {\n                                opacity: 0;\n                            }\n                        }\n\n                        .hw-send {\n                            position: absolute;\n                            right: 18px;\n                            bottom: 16px;\n                            width: 64px;\n                            height: 64px;\n                            border-radius: 7px;\n                            background: var(--hw-blue);\n                            display: flex;\n                            align-items: center;\n                            justify-content: center;\n                            color: #fff;\n                            transition: transform 120ms ease, filter 120ms ease;\n                        }\n\n                        .hw-send.pressed {\n                            transform: scale(0.92);\n                            filter: brightness(0.9);\n                        }\n\n                        .hw-send svg {\n                            width: 32px;\n                            height: 32px;\n                            color: #fff;\n                        }\n\n                        .hw-qa-loading {\n                            position: absolute;\n                            left: 0;\n                            top: 164px;\n                            height: 56px;\n                            display: flex;\n                            align-items: center;\n                            gap: 10px;\n                            opacity: 0;\n                            transition: opacity 250ms ease;\n                        }\n\n                        .hw-qa-loading.visible {\n                            opacity: 1;\n                        }\n\n                        .hw-qa-loading .dot {\n                            width: 14px;\n                            height: 14px;\n                            border-radius: 50%;\n                            background: var(--hw-blue);\n                            animation: hw-pulse 1.2s ease-in-out infinite;\n                        }\n\n                        .hw-qa-loading .dot:nth-child(2) {\n                            animation-delay: 0.15s;\n                        }\n\n                        .hw-qa-loading .dot:nth-child(3) {\n                            animation-delay: 0.30s;\n                        }\n\n                        @keyframes hw-pulse {\n\n                            0%,\n                            80%,\n                            100% {\n                                transform: scale(0.5);\n                                opacity: 0.4;\n                            }\n\n                            40% {\n                                transform: scale(1);\n                                opacity: 1;\n                            }\n                        }\n\n                        .hw-ripple {\n                            position: absolute;\n                            left: 246px;\n                            top: 58px;\n                            width: 44px;\n                            height: 44px;\n                            border-radius: 50%;\n                            border: 6px solid var(--hw-blue);\n                            pointer-events: none;\n                            opacity: 0;\n                            z-index: 4;\n                            transform-origin: center center;\n                        }\n\n                        .hw-ripple.go {\n                            animation: hw-ripple-anim 1100ms cubic-bezier(0.2, 0.6, 0.2, 1) forwards;\n                        }\n\n                        .hw-ripple.wave2 {\n                            animation-delay: 200ms;\n                            border-width: 4px;\n                        }\n\n                        .hw-ripple.wave3 {\n                            animation-delay: 400ms;\n                            border-width: 3px;\n                        }\n\n                        @keyframes hw-ripple-anim {\n                            0% {\n                                opacity: 1;\n                                transform: scale(0.8);\n                            }\n\n                            60% {\n                                opacity: 0.5;\n                            }\n\n                            100% {\n                                opacity: 0;\n                                transform: scale(4.2);\n                            }\n                        }\n\n                        .hw-pause-btn {\n                            position: absolute;\n                            bottom: 20px;\n                            left: 20px;\n                            z-index: 20;\n                            width: 44px;\n                            height: 44px;\n                            border: none;\n                            border-radius: 50%;\n                            background: rgba(2, 10, 38, 0.75);\n                            backdrop-filter: blur(12px);\n                            -webkit-backdrop-filter: blur(12px);\n                            cursor: pointer;\n                            display: flex;\n                            align-items: center;\n                            justify-content: center;\n                            padding: 0;\n                            opacity: 1;\n                            transition: background 150ms ease, transform 120ms ease, opacity 200ms ease;\n                        }\n\n                        .hw-pause-btn:hover {\n                            background: rgba(2, 10, 38, 0.92);\n                        }\n\n                        .hw-pause-btn:active {\n                            transform: scale(0.92);\n                        }\n\n                        .hw-pause-btn svg {\n                            width: 18px;\n                            height: 18px;\n                            fill: #fff;\n                        }\n\n                        .hw-icon-pause {\n                            display: block;\n                        }\n\n                        .hw-icon-play {\n                            display: none;\n                        }\n\n                        .hw-pause-btn.is-paused .hw-icon-pause {\n                            display: none;\n                        }\n\n                        .hw-pause-btn.is-paused .hw-icon-play {\n                            display: block;\n                        }\n                    <\/style>\n\n                    <script>\n                        (function () {\n                            var hwWrap = document.getElementById('hwWrap');\n                            var hwStage = document.getElementById('hwStage');\n                            var hwSZ = document.getElementById('hwStageZoom');\n                            var hwPAi = document.getElementById('hwPickwareAi');\n                            var hwPIcon = document.getElementById('hwPickwareIcon');\n                            var hwCH = document.getElementById('hwContentHeader');\n                            var hwIBox = document.getElementById('hwInputBox');\n                            var hwIPH = document.getElementById('hwInputPlaceholder');\n                            var hwITyped = document.getElementById('hwInputTyped');\n                            var hwSend = document.getElementById('hwSendBtn');\n                            var hwQQ = document.getElementById('hwQaQuestion');\n                            var hwQL = document.getElementById('hwQaLoading');\n                            var hwQT1 = document.getElementById('hwQaTool1');\n                            var hwQT2 = document.getElementById('hwQaTool2');\n                            var hwQA = document.getElementById('hwQaAnswer');\n                            var hwR1 = document.getElementById('hwRipple1');\n                            var hwR2 = document.getElementById('hwRipple2');\n                            var hwR3 = document.getElementById('hwRipple3');\n                            var hwPBtn = document.getElementById('hwPauseBtn');\n\n                            function hwFit() {\n                                var s = hwWrap.offsetWidth \/ 2488;\n                                hwStage.style.transform = 'scale(' + s + ')';\n                            }\n                            window.addEventListener('resize', hwFit);\n                            hwFit();\n\n                            var hwIsPaused = false;\n                            var hwPauseL = [], hwResumeL = [];\n\n                            function hwSetPaused(p) {\n                                if (hwIsPaused === p) return;\n                                hwIsPaused = p;\n                                if (p) {\n                                    hwPauseL.slice().forEach(function (f) { f(); });\n                                    hwPBtn.classList.add('is-paused');\n                                    hwPBtn.setAttribute('aria-label', 'Play');\n                                } else {\n                                    hwResumeL.slice().forEach(function (f) { f(); });\n                                    hwPBtn.classList.remove('is-paused');\n                                    hwPBtn.setAttribute('aria-label', 'Pause');\n                                }\n                            }\n                            hwPBtn.addEventListener('click', function (e) {\n                                e.stopPropagation();\n                                hwSetPaused(!hwIsPaused);\n                            });\n\n                            var hwSleep = function (ms) {\n                                return new Promise(function (resolve) {\n                                    var remaining = ms, lastStart = Date.now(), tid = null;\n                                    var start = function () { lastStart = Date.now(); tid = setTimeout(function () { tid = null; remaining = 0; resolve(); }, remaining); };\n                                    var stop = function () { if (tid !== null) { clearTimeout(tid); tid = null; remaining -= Date.now() - lastStart; if (remaining < 0) remaining = 0; } };\n                                    if (!hwIsPaused) start();\n                                    var op = function () { stop(); };\n                                    var or = function () { if (remaining > 0) start(); };\n                                    hwPauseL.push(op); hwResumeL.push(or);\n                                    var origRes = resolve;\n                                    resolve = function (v) { hwPauseL = hwPauseL.filter(function (f) { return f !== op; }); hwResumeL = hwResumeL.filter(function (f) { return f !== or; }); origRes(v); };\n                                });\n                            };\n\n                            function hwSetZoom(ox, oy, sc, dur, tx, ty) {\n                                dur = dur === undefined ? 1100 : dur; tx = tx || 0; ty = ty || 0;\n                                hwSZ.style.transition = 'transform ' + dur + 'ms cubic-bezier(0.65,0.05,0.36,1), transform-origin ' + dur + 'ms cubic-bezier(0.65,0.05,0.36,1)';\n                                hwSZ.style.transformOrigin = (ox \/ 2488 * 100) + '% ' + (oy \/ 1600 * 100) + '%';\n                                hwSZ.style.transform = 'translate(' + tx + 'px,' + ty + 'px) scale(' + sc + ')';\n                            }\n                            function hwResetZoom(dur) {\n                                dur = dur === undefined ? 1100 : dur;\n                                hwSZ.style.transition = 'transform ' + dur + 'ms cubic-bezier(0.65,0.05,0.36,1), transform-origin ' + dur + 'ms cubic-bezier(0.65,0.05,0.36,1)';\n                                hwSZ.style.transformOrigin = '50% 50%';\n                                hwSZ.style.transform = 'translate(0px,0px) scale(1)';\n                            }\n\n                            async function hwClick() {\n                                hwPIcon.classList.add('pressed');\n                                [hwR1, hwR2, hwR3].forEach(function (el) { el.classList.remove('go'); el.offsetHeight; el.classList.add('go'); });\n                                await hwSleep(220); hwPIcon.classList.remove('pressed'); await hwSleep(700);\n                            }\n                            function hwCollapse() { hwPAi.style.left = '2154px'; hwCH.style.left = '588px'; hwPIcon.style.color = '#000'; }\n                            function hwExpand() { hwPAi.style.left = '1554px'; hwCH.style.left = '361px'; hwPIcon.style.color = '#3994F9'; }\n                            function hwReset() {\n                                [hwQQ, hwQL, hwQT1, hwQT2, hwQA].forEach(function (el) { el.classList.remove('visible'); });\n                                hwIPH.style.opacity = '1'; hwITyped.style.display = 'none'; hwITyped.textContent = ''; hwITyped.classList.remove('no-cursor'); hwSend.classList.remove('pressed'); hwIBox.classList.remove('tall'); hwIBox.classList.remove('taller');\n                            }\n                            async function hwType(el, text, spd) {\n                                spd = spd || 60; el.textContent = ''; el.style.display = 'block'; hwIPH.style.opacity = '0';\n                                for (var i = 0; i < text.length; i++) {\n                                    el.textContent += text[i];\n                                    var len = el.textContent.length;\n                                    if (len > 56 && !hwIBox.classList.contains('taller')) { hwIBox.classList.remove('tall'); hwIBox.classList.add('taller'); }\n                                    else if (len > 26 && !hwIBox.classList.contains('tall') && !hwIBox.classList.contains('taller')) { hwIBox.classList.add('tall'); }\n                                    await hwSleep(spd + (Math.random() * 30 - 15));\n                                }\n                            }\n\n                            var hwZC = {\n                                z1: { ox: 2488, oy: 0, sc: 2.0, dur: 1100, tx: -473, ty: 300 },\n                                z2: { ox: 2488, oy: 1600, sc: 3.0, dur: 1100, tx: -473, ty: -600 },\n                                z3: { ox: 2488, oy: 0, sc: 1.7, dur: 1100, tx: -473, ty: -300 },\n                                reset: { dur: 1000 }\n                            };\n\n                            async function hwRun() {\n                                hwReset(); hwCollapse(); hwResetZoom(0);\n                                await hwSleep(800);\n                                [hwR1, hwR2, hwR3].forEach(function (el) { el.classList.remove('go'); });\n                                hwSetZoom(hwZC.z1.ox, hwZC.z1.oy, hwZC.z1.sc, hwZC.z1.dur, hwZC.z1.tx, hwZC.z1.ty); await hwSleep(1200);\n                                await hwClick(); await hwSleep(80);\n                                hwExpand(); await hwSleep(1100);\n                                hwSetZoom(hwZC.z2.ox, hwZC.z2.oy, hwZC.z2.sc, hwZC.z2.dur, hwZC.z2.tx, hwZC.z2.ty); await hwSleep(1200);\n                                await hwType(hwITyped, 'Wie lange reicht unser Bestand vom Oversize Tee Washed Black noch?', 45);\n                                hwITyped.classList.add('no-cursor'); await hwSleep(400);\n                                hwSend.classList.add('pressed'); await hwSleep(150); hwSend.classList.remove('pressed');\n                                hwQQ.classList.add('visible');\n                                hwITyped.style.display = 'none'; hwITyped.textContent = ''; hwITyped.classList.remove('no-cursor');\n                                hwIPH.style.opacity = '1'; hwIBox.classList.remove('tall'); hwIBox.classList.remove('taller');\n                                await hwSleep(400);\n                                hwSetZoom(hwZC.z3.ox, hwZC.z3.oy, hwZC.z3.sc, hwZC.z3.dur, hwZC.z3.tx, hwZC.z3.ty); await hwSleep(700);\n                                hwQL.classList.add('visible'); await hwSleep(900);\n                                hwQL.classList.remove('visible'); hwQT1.classList.add('visible'); await hwSleep(550);\n                                hwQT2.classList.add('visible'); await hwSleep(700);\n                                hwQA.classList.add('visible'); await hwSleep(2200);\n                                hwResetZoom(hwZC.reset.dur); await hwSleep(1100);\n                                hwCollapse(); await hwSleep(1100);\n                                [hwQA, hwQT2, hwQT1, hwQQ].forEach(function (el) { el.classList.remove('visible'); });\n                                await hwSleep(700);\n                                hwRun();\n                            }\n\n                            hwRun();\n                        })();\n                    <\/script>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n\n    <!-- ========= HEADLINE ========= -->\n    <div class=\"display-center-wrap\">\n        <div class=\"display-center\">Klicks sind Zeitverschwendung<\/div>\n        <p class=\"display-center-lead\">Frag die Pickware AI: Was sonst zehn Men\u00fcklicks braucht, hast du in Sekunden.<\/p>\n    <\/div>\n\n    <!-- ========= CASES ========= -->\n    <section class=\"cases\" aria-label=\"Use Cases\">\n        <div class=\"container\">\n            <h2 class=\"sr-only\">Use Cases<\/h2>\n\n            <!-- Row 1: Chat left, text right -->\n            <div class=\"case-row\">\n                <div class=\"tile\"><canvas class=\"dither\"><\/canvas>\n                    <div class=\"chat-stack\">\n                        <div class=\"chat-card\" data-idx=\"0\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">TextilPro hat die EK-Preise um 8 % erh\u00f6ht \u2014 wie wirkt sich das\n                                        auf unsere Marge\n                                        aus?<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.suppliers.products(TextilPro)\n                                            \u2014 pickware.products.margin()<\/div>\n                                        <div class=\"tool-foot\">\u2193 2 Tools \u00b7 612 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">TextilPro liefert 6 Artikel \u2014 so ver\u00e4ndert sich\n                                                die Marge bei 8 %\n                                                EK-Erh\u00f6hung:<\/div>\n                                            <strong>Oversize Tee Washed Black<\/strong><br>\n                                            Marge bisher: 48,0 % \u2192 neu: 42,5 %<br>\n                                            <strong>Cargo Pants Olive<\/strong><br>\n                                            Marge bisher: 44,0 % \u2192 neu: 38,3 %<br>\n                                            <strong>Basic Tee 3er-Bundle<\/strong><br>\n                                            Marge bisher: 36,0 % \u2192 neu: 29,9 % \u26a0\ufe0f<br>\n                                            <div class=\"answer-action\">3 weitere Artikel mit Margen \u00fcber 50 % \u2014 dort\n                                                bleibt genug Puffer. Beim\n                                                Basic Tee f\u00e4llt die Marge unter 30 %. Soll ich die VK-Preise\n                                                gegenrechnen, um die Marge zu\n                                                halten?<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"chat-card\" data-idx=\"1\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Wie lange reicht unser Bestand vom Oversize Tee Washed Black\n                                        noch?<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.stock.get(SKU-1042)\n                                            \u2014 pickware.sales.velocity(SKU-1042, 30d)<\/div>\n                                        <div class=\"tool-foot\">\u2193 2 Tools \u00b7 312 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">Oversize Tee Washed Black \u2014 Reichweite nach\n                                                Variante:<\/div>\n                                            <strong>Gr. S ~22 Tage \u2705<\/strong><br>\n                                            52 Stk. \u00b7 \u00d8 2,4 Verk\u00e4ufe\/Tag<br>\n                                            <strong>Gr. M ~8 Tage \u26a0\ufe0f<\/strong><br>\n                                            24 Stk. \u00b7 \u00d8 3,0 Verk\u00e4ufe\/Tag<br>\n                                            <strong>Gr. L ~18 Tage \u2705<\/strong><br>\n                                            43 Stk. \u00b7 \u00d8 2,4 Verk\u00e4ufe\/Tag<br>\n                                            <div class=\"answer-action\">Gr\u00f6\u00dfe M wird in ca. 8 Tagen ausverkauft \u2014\n                                                Lieferzeit bei TextilPro\n                                                liegt bei 10 Tagen. Soll ich eine Nachbestellung ansto\u00dfen?<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"chat-card\" data-idx=\"2\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Welche Produkte haben ein MHD, das in den n\u00e4chsten 30 Tagen\n                                        abl\u00e4uft?<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.stock.batches(expiry&lt;30d)<\/div>\n                                        <div class=\"tool-foot\">\u2193 1 Tool \u00b7 289 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">3 Chargen in 3 Produkten laufen bald ab:<\/div>\n                                            <strong>Bio-Proteinriegel Vanille \u2014 6 Tage \ud83d\udd34<\/strong><br>\n                                            CH-2024-0901 \u00b7 MHD 03.05. \u00b7 187 Stk.<br>\n                                            <strong>Gr\u00fcntee Matcha 100g \u2014 12 Tage \u26a0\ufe0f<\/strong><br>\n                                            CH-2024-1104 \u00b7 MHD 09.05. \u00b7 64 Stk.<br>\n                                            <strong>Bio-Proteinriegel Schoko \u2014 17 Tage \u26a0\ufe0f<\/strong><br>\n                                            CH-2024-0892 \u00b7 MHD 14.05. \u00b7 312 Stk.<br>\n                                            <div class=\"answer-action\">Die Vanille-Riegel sollten priorisiert raus \u2014\n                                                FEFO. Soll ich die Charge\n                                                in den Pickprofilen nach vorne stellen?<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div class=\"case-text\">\n                    <div class=\"kicker\">Lagerverwaltung &amp; Einkauf<\/div>\n                    <h3>Engp\u00e4sse erkennen, bevor sie entstehen.<\/h3>\n                    <p>Wann l\u00e4uft welche Variante aus? Was passiert mit der Marge, wenn der Lieferant die Preise erh\u00f6ht? Pickware\n                        AI kennt deinen Bestand, rechnet mit und warnt dich, bevor es zu sp\u00e4t ist.<\/p>\n                    <a href=\"#webinar\" class=\"cta-link\" aria-label=\"Zum Pickware AI Webinar am 15. Mai anmelden\">Zum\n                        Webinar\n                        anmelden <svg width=\"18\" height=\"15\" viewBox=\"0 0 18 15\" fill=\"currentColor\">\n                            <path\n                                d=\"M 10.5 0 L 9.427 1.045 L 15.112 6.75 L 0 6.75 L 0 8.25 L 15.112 8.25 L 9.427 13.93 L 10.5 15 L 18 7.5 L 10.5 0 Z\" \/>\n                        <\/svg><\/a>\n                <\/div>\n            <\/div>\n\n            <!-- Row 2: Text left, chat right -->\n            <div class=\"case-row\">\n                <div class=\"case-text\">\n                    <div class=\"kicker\">Versand &amp; Retouren<\/div>\n                    <h3>Was fr\u00fcher Pain war, l\u00e4uft jetzt.<\/h3>\n                    <p>Du sagst was gebraucht wird. Der Rest passiert. Pickware AI \u00fcbernimmt die Schritte, die dich t\u00e4glich Zeit kosten \u2014 vom Split einer Bestellung bis zur fertigen Retoure.<\/p>\n                    <a href=\"#webinar\" class=\"cta-link\" aria-label=\"Zum Pickware AI Webinar am 15. Mai anmelden\">Zum\n                        Webinar\n                        anmelden <svg width=\"18\" height=\"15\" viewBox=\"0 0 18 15\" fill=\"currentColor\">\n                            <path\n                                d=\"M 10.5 0 L 9.427 1.045 L 15.112 6.75 L 0 6.75 L 0 8.25 L 15.112 8.25 L 9.427 13.93 L 10.5 15 L 18 7.5 L 10.5 0 Z\" \/>\n                        <\/svg><\/a>\n                <\/div>\n                <div class=\"tile\"><canvas class=\"dither\"><\/canvas>\n                    <div class=\"chat-stack\">\n                        <div class=\"chat-card\" data-idx=\"0\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Erstelle eine Retoure f\u00fcr Bestellung #10087: Pulli blau M gegen\n                                        L umtauschen.\n                                    <\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.orders.get(#10087)\n                                            \u2014 pickware.stock.check(SKU-2291-L)\n                                            \u2014 pickware.returns.create(#10087)<\/div>\n                                        <div class=\"tool-foot\">\u2193 3 Tools \u00b7 523 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">Retoure f\u00fcr #10087 wird angelegt:<\/div>\n                                            <strong>Eingehend<\/strong><br>\n                                            Pulli blau \u2014 Gr\u00f6\u00dfe M<br>\n                                            <strong>Ausgehend<\/strong><br>\n                                            Pulli blau \u2014 Gr\u00f6\u00dfe L \u00b7 28 Stk. verf\u00fcgbar<br>\n                                            <strong>Ergebnis<\/strong><br>\n                                            \u2705 Retoure #R-2025-0892 erstellt<br>\n                                            \u2705 Umtausch-Bestellung #10234 angelegt<br>\n                                            <div class=\"answer-action\">Soll ich dem Kunden das Retourenlabel per E-Mail\n                                                zuschicken?<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"chat-card\" data-idx=\"1\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Wie war unsere Pickleistung diese Woche?<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.picking.stats(KW17)\n                                            \u2014 pickware.picking.by_user(KW17)<\/div>\n                                        <div class=\"tool-foot\">\u2193 2 Tools \u00b7 438 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">Pickleistung KW 17 \u2014 \u00d8 3:48\n                                                Min\/Bestellung<br>(Vorwoche 4:16, 11 %\n                                                schneller)<\/div>\n                                            <strong>\ud83e\udd47 Laura M. \u2014 173 Bestellungen<\/strong><br>\n                                            2:54 Min \u00b7 0,2 % Fehler<br>\n                                            <strong>\ud83e\udd48 Tobias K. \u2014 148 Bestellungen<\/strong><br>\n                                            3:32 Min \u00b7 0,4 % Fehler<br>\n                                            <strong>\ud83e\udd49 Markus W. \u2014 87 Bestellungen<\/strong><br>\n                                            5:41 Min \u00b7 0,8 % Fehler<br>\n                                            <div class=\"answer-action\">Bei Markus liegt die Pickzeit 31 % \u00fcber dem\n                                                Schnitt \u2014 evtl. Laufwege\n                                                pr\u00fcfen.<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"chat-card\" data-idx=\"2\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Bestellung #10099 kann nicht komplett raus \u2014 versende was da\n                                        ist.<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.orders.get(#10099)\n                                            \u2014 pickware.stock.check_positions(#10099)\n                                            \u2014 pickware.orders.split(#10099)<\/div>\n                                        <div class=\"tool-foot\">\u2193 3 Tools \u00b7 571 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">#10099 \u2014 Verf\u00fcgbarkeit gepr\u00fcft:<\/div>\n                                            <strong>\u2705 Oversize Tee Washed Black (L)<\/strong><br>\n                                            2\u00d7 verf\u00fcgbar<br>\n                                            <strong>\u2705 Cargo Pants Olive (M)<\/strong><br>\n                                            1\u00d7 verf\u00fcgbar<br>\n                                            <strong>\u274c Sneaker Classic Off-White (43)<\/strong><br>\n                                            nicht auf Lager<br>\n                                            <div class=\"answer-action\">Teillieferung #10099-A erstellt (Tee + Pants).\n                                                Restlieferung #10099-B\n                                                wartet auf Sneaker. Soll ich den Kunden \u00fcber die Teillieferung\n                                                informieren?<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Row 3: Chat left, text right -->\n            <div class=\"case-row\">\n                <div class=\"tile\"><canvas class=\"dither\"><\/canvas>\n                    <div class=\"chat-stack\">\n                        <div class=\"chat-card\" data-idx=\"0\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Zeig mir die Top-Kunden dieses Jahr inklusive Marge.<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.customers.ranking(2026)\n                                            \u2014 pickware.orders.margin_by_customer(2026)<\/div>\n                                        <div class=\"tool-foot\">\u2193 2 Tools \u00b7 761 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">Top 4 Kunden 2026 (Jan\u2013Apr):<\/div>\n                                            <strong>1. Fashion Store Berlin \u2014 31.840 \u20ac Umsatz<\/strong><br>\n                                            Marge 43,1 %<br>\n                                            <strong>2. Trendhub24 \u2014 27.390 \u20ac Umsatz<\/strong><br>\n                                            Marge 28,0 %<br>\n                                            <strong>3. StyleBox M\u00fcnchen \u2014 19.560 \u20ac Umsatz<\/strong><br>\n                                            Marge 47,0 %<br>\n                                            <strong>4. OnlineModehaus Meier \u2014 18.270 \u20ac Umsatz<\/strong><br>\n                                            Marge 15,0 %<br>\n                                            <div class=\"answer-action\">\u26a0\ufe0f Meier ist #4 nach Umsatz, aber mit 15 % Marge\n                                                am wenigsten\n                                                profitabel. StyleBox bringt bei weniger Umsatz 3,5\u00d7 so viel Marge.<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"chat-card\" data-idx=\"1\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">In welchem Lager habe ich am meisten Kapital in Ladenh\u00fctern\n                                        gebunden?<\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.stock.slow_movers(60d)\n                                            \u2014 pickware.stock.valuation()<\/div>\n                                        <div class=\"tool-foot\">\u2193 2 Tools \u00b7 583 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">53.470 \u20ac gebundenes Kapital in 31 Ladenh\u00fctern\n                                                (kein Verkauf seit &gt;60\n                                                Tagen):<\/div>\n                                            <strong>Hauptlager \u2014 38.210 \u20ac (71,5 %)<\/strong><br>\n                                            19 Produkte<br>\n                                            <strong>Au\u00dfenlager Nord \u2014 10.890 \u20ac (20,4 %)<\/strong><br>\n                                            8 Produkte<br>\n                                            <strong>Filiale Berlin \u2014 4.370 \u20ac (8,2 %)<\/strong><br>\n                                            4 Produkte<br>\n                                            <div class=\"answer-action\">Gr\u00f6\u00dfter Blocker: Winterjacke Navy im Hauptlager \u2014\n                                                1.280 Stk. \u00b7 21.760 \u20ac\n                                                \u00b7 letzter Verkauf 18. Feb. Alles Saisonware. Soll ich eine\n                                                Abverkaufsaktion vorschlagen?<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"chat-card\" data-idx=\"2\">\n                            <div class=\"topbar\">Pickware AI<\/div>\n                            <div class=\"body\">\n                                <div class=\"msg-user\">\n                                    <div class=\"bubble\">Welche Kunden haben \u00fcberf\u00e4llige Rechnungen? Starte den Mahnlauf.\n                                    <\/div>\n                                    <div class=\"avatar user\">DU<\/div>\n                                <\/div>\n                                <div class=\"msg-ai\">\n                                    <div class=\"avatar ai\">AI<\/div>\n                                    <div class=\"content\">\n                                        <div class=\"tool-line\">\u2014 pickware.invoices.overdue(14d)\n                                            \u2014 pickware.dunning.run()<\/div>\n                                        <div class=\"tool-foot\">\u2193 2 Tools \u00b7 934 ms<\/div>\n                                        <div class=\"answer\">\n                                            <div class=\"answer-intro\">17 Kunden mit \u00fcberf\u00e4lligen Rechnungen \u2014 offener\n                                                Gesamtbetrag: 14.680 \u20ac\n                                            <\/div>\n                                            <strong>Trendhub24 \u2014 3.920 \u20ac<\/strong><br>\n                                            29 Tage \u00fcberf\u00e4llig \u00b7 noch keine Mahnung<br>\n                                            <strong>ModeBoutique Schmidt \u2014 2.180 \u20ac<\/strong><br>\n                                            24 Tage \u00fcberf\u00e4llig \u00b7 1. Mahnung am 09.04.<br>\n                                            <strong>B2B-Partner Krause \u2014 1.740 \u20ac<\/strong><br>\n                                            17 Tage \u00fcberf\u00e4llig \u00b7 noch keine Mahnung<br>\n                                            \u2026 14 weitere Kunden (6.840 \u20ac)<br>\n                                            <div class=\"answer-action\">\u2705 Mahnlauf gestartet: 11\u00d7 Zahlungserinnerung \u00b7 6\u00d7\n                                                letzte Frist. E-Mails\n                                                gehen in den n\u00e4chsten Minuten raus.<\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                            <div class=\"footer\">\n                                <span class=\"ph\">Frag Pickware AI \u2026<\/span>\n                                <div class=\"send\">\n                                    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n                                        <path d=\"M3 20V4l19 8-19 8zm2-3l11.025-5L5 7v3.5l8 1.5-8 1.5V17z\"\n                                            fill=\"currentColor\" \/>\n                                    <\/svg>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div class=\"case-text\">\n                    <div class=\"kicker\">Finanzen &amp; \u00dcberblick<\/div>\n                    <h3>Wer schuldet dir Geld? Frag einfach.<\/h3>\n                    <p>Wer zahlt nicht? Wo steckt Kapital in Ladenh\u00fctern? Welcher Kunde klingt profitabel \u2014 ist es aber\n                        nicht? Pickware AI zieht die dir wichtigsten Zahlen zusammen.<\/p>\n                    <a href=\"#webinar\" class=\"cta-link\" aria-label=\"Zum Pickware AI Webinar am 15. Mai anmelden\">Zum\n                        Webinar\n                        anmelden <svg width=\"18\" height=\"15\" viewBox=\"0 0 18 15\" fill=\"currentColor\">\n                            <path\n                                d=\"M 10.5 0 L 9.427 1.045 L 15.112 6.75 L 0 6.75 L 0 8.25 L 15.112 8.25 L 9.427 13.93 L 10.5 15 L 18 7.5 L 10.5 0 Z\" \/>\n                        <\/svg><\/a>\n                <\/div>\n            <\/div>\n\n        <\/div>\n    <\/section>\n\n\n    <!-- ========= MCP ========= -->\n    <section class=\"mcp\" id=\"mcp\" aria-label=\"ChatBot und MCP-Server\">\n        <div class=\"container\">\n            <h2>Mach den MCP zu deinem MVP<\/h2>\n            <p class=\"lead\">Verbinde Claude, ChatGPT oder Gemini mit Pickware AI. Integriere die Tools, mit denen du eh\n                schon\n                arbeitest und bau dir Workflows in einer einzigen Oberfl\u00e4che.<\/p>\n            <div class=\"mcp-stage\">\n                <div class=\"mcp-card\">\n                    <span class=\"tag\">DEINE AI<\/span>\n                    <div class=\"name-list\">\n                        <div class=\"row\">\n                            <span class=\"logo\" aria-hidden=\"true\">\n                                <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.pickware.com\/app\/uploads\/2026\/04\/claude-icon.svg\" width=\"22\"\n                                    height=\"22\" alt=\"Claude AI Logo\">\n                            <\/span>\n                            <span>Claude<\/span>\n                        <\/div>\n                        <div class=\"row\">\n                            <span class=\"logo\" aria-hidden=\"true\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\">\n                                    <path\n                                        d=\"M22.282 9.821a5.985 5.985 0 00-.516-4.91 6.046 6.046 0 00-6.51-2.9A6.065 6.065 0 004.981 4.18a5.985 5.985 0 00-3.998 2.9 6.046 6.046 0 00.743 7.097 5.98 5.98 0 00.51 4.911 6.051 6.051 0 006.515 2.9A5.985 5.985 0 0013.26 24a6.056 6.056 0 005.772-4.206 5.99 5.99 0 003.997-2.9 6.056 6.056 0 00-.747-7.073zM13.26 22.43a4.476 4.476 0 01-2.876-1.04l.141-.081 4.779-2.758a.795.795 0 00.392-.681v-6.737l2.02 1.168a.071.071 0 01.038.052v5.583a4.504 4.504 0 01-4.494 4.494zM3.6 18.304a4.47 4.47 0 01-.535-3.014l.142.085 4.783 2.759a.771.771 0 00.78 0l5.843-3.369v2.332a.08.08 0 01-.033.062L9.74 19.95a4.5 4.5 0 01-6.14-1.646zM2.34 7.896a4.485 4.485 0 012.366-1.973v5.69a.77.77 0 00.388.677l5.815 3.355-2.02 1.168a.08.08 0 01-.071 0l-4.83-2.786A4.504 4.504 0 012.34 7.896zm16.597 3.855l-5.833-3.387L15.119 7.2a.08.08 0 01.071 0l4.83 2.791a4.494 4.494 0 01-.676 8.105v-5.69a.79.79 0 00-.407-.656zm2.01-3.023l-.141-.085-4.774-2.782a.776.776 0 00-.785 0L9.409 9.23V6.897a.066.066 0 01.028-.061l4.83-2.787a4.5 4.5 0 016.68 4.66zm-12.64 4.135l-2.02-1.164a.08.08 0 01-.038-.057V6.075a4.5 4.5 0 017.375-3.453l-.142.08-4.778 2.758a.795.795 0 00-.393.681l-.004 6.723zm1.097-2.365l2.602-1.5 2.607 1.5v3L10.005 13l-2.6-1.502z\"\n                                        fill=\"#fff\" \/>\n                                <\/svg>\n                            <\/span>\n                            <span>ChatGPT<\/span>\n                        <\/div>\n                        <div class=\"row\">\n                            <span class=\"logo\" aria-hidden=\"true\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\">\n                                    <path\n                                        d=\"M12 24A14.304 14.304 0 000 12 14.304 14.304 0 0012 0a14.304 14.304 0 0012 12 14.304 14.304 0 00-12 12z\"\n                                        fill=\"url(#gem-a)\" \/>\n                                    <defs>\n                                        <linearGradient id=\"gem-a\" x1=\"3\" y1=\"20\" x2=\"21\" y2=\"4\"\n                                            gradientUnits=\"userSpaceOnUse\">\n                                            <stop stop-color=\"#4796E3\" \/>\n                                            <stop offset=\"0.5\" stop-color=\"#9168C0\" \/>\n                                            <stop offset=\"1\" stop-color=\"#EE7776\" \/>\n                                        <\/linearGradient>\n                                    <\/defs>\n                                <\/svg>\n                            <\/span>\n                            <span>Gemini<\/span>\n                        <\/div>\n                    <\/div>\n                    <span class=\"tag\">beliebiger Client<\/span>\n                <\/div>\n                <div class=\"arrow\">\n                    <span class=\"arrow-icon\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"\n                            fill=\"currentColor\">\n                            <polygon\n                                points=\"18 6 16.57 7.393 24.15 15 4 15 4 17 24.15 17 16.57 24.573 18 26 28 16 18 6\" \/>\n                            <rect fill=\"none\" width=\"32\" height=\"32\" \/>\n                        <\/svg>\n                    <\/span>\n                <\/div>\n                <div class=\"mcp-center\">\n                    <span class=\"tag\">DEINE TOOLS<\/span>\n                    <span class=\"brand\">Pickware AI<\/span>\n                    <span class=\"brand\">CRM<\/span>\n                    <span class=\"brand\">Onlineshop<\/span>\n                    <span class=\"brand\">Messenger<\/span>\n                    <span class=\"tag\">VIA MCP VERBUNDEN<\/span>\n                <\/div>\n                <div class=\"arrow\">\n                    <span class=\"arrow-icon\">\n                        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"\n                            fill=\"currentColor\">\n                            <polygon\n                                points=\"18 6 16.57 7.393 24.15 15 4 15 4 17 24.15 17 16.57 24.573 18 26 28 16 18 6\" \/>\n                            <rect fill=\"none\" width=\"32\" height=\"32\" \/>\n                        <\/svg>\n                    <\/span>\n                <\/div>\n                <div class=\"mcp-card pickware\">\n                    <span class=\"pill\">ERGEBNIS<\/span>\n                    <span class=\"name\">Abverkaufskampagne live<\/span>\n                    <span class=\"tag\">4 Tools, 1 Prompt,1 Ergebnis<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"mcp-benefits\">\n                <div class=\"benefit\">\n                    <span class=\"num\">01<\/span>\n                    <h4>Nutze die AI, die du eh schon hast.<\/h4>\n                    <p>Claude, ChatGPT oder Gemini \u2014 verbinde einfach deinen bevorzugten Assistenten. Keine neue\n                        Oberfl\u00e4che, kein extra Abo, keine Einarbeitung. Du bleibst in den Tools, mit denen du eh schon\n                        arbeitest.<\/p>\n                <\/div>\n                <div class=\"benefit\">\n                    <span class=\"num\">02<\/span>\n                    <h4>Verbinde Pickware AI mit deinen Tools.<\/h4>\n                    <p>\u00dcber den MCP-Server bringst du Pickware AI mit den Konnektoren deiner Wahl zusammen \u2014\n                        Support-System, CRM, E-Mail-Marketing, Onlineshop. Alles findet auf einer Oberfl\u00e4che statt,\n                        ohne Bastelei und ohne neue Schnittstelle f\u00fcr jedes Tool.<\/p>\n                <\/div>\n                <div class=\"benefit\">\n                    <span class=\"num\">03<\/span>\n                    <h4>Vom Prompt zur fertigen Kampagne.<\/h4>\n                    <p>Beispiel Abverkauf: Pickware AI liest die Lagerbest\u00e4nde, das CRM setzt die Mailingkampagne auf,\n                        der Onlineshop rabattiert die Artikel und dein Marketing-Team bekommt die Kampagne zum Review\n                        vorgelegt. Vier Tools, ein Prompt, ein Ergebnis.<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- ========= WHATS-NEXT ========= -->\n    <section class=\"whats-next\" id=\"whats-next\" aria-label=\"Roadmap\">\n        <div class=\"container\">\n            <div class=\"wn-head\">\n                <h2>Das hier ist erst der Anfang. Stay tuned.<\/h2>\n            <\/div>\n\n            <!-- Sequential timeline -->\n            <div class=\"wn-timeline variant-a\">\n                <div class=\"wn-line\"><span class=\"pulse\"><\/span><\/div>\n                <div class=\"wn-nodes\">\n                    <div class=\"wn-node now above\">\n                        <div class=\"wn-label\">\n                            <span class=\"wn-when\">Heute<\/span>\n                            <h3>ChatBot &amp; MCP-Server<\/h3>\n                        <\/div>\n                        <span class=\"connector\"><\/span>\n                        <span class=\"dot-wrap\"><\/span>\n                    <\/div>\n                    <div class=\"wn-node below\">\n                        <span class=\"dot-wrap\"><\/span>\n                        <span class=\"connector\"><\/span>\n                        <div class=\"wn-label\">\n                            <span class=\"wn-when\">Next<\/span>\n                            <h3 style=\"font-family: &quot;Fira Sans&quot;; font-size: 40px;\">AI Agents<\/h3>\n                        <\/div>\n                    <\/div>\n                    <div class=\"wn-node above\">\n                        <div class=\"wn-label\">\n                            <span class=\"wn-when\">Coming soon<\/span>\n                            <h3 class=\"wn-blur\" aria-label=\"noch geheim\"\n                                style=\"font-family: &quot;Fira Sans&quot;; font-weight: 900; font-size: 40px; color: rgb(255, 87, 87);\">\n                                noch geheim<\/h3>\n                        <\/div>\n                        <span class=\"connector\"><\/span>\n                        <span class=\"dot-wrap\"><\/span>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n        <\/div>\n    <\/section>\n\n    <!-- ========= WEBINAR ========= -->\n    <section class=\"webinar\" id=\"webinar\" aria-label=\"Webinar Anmeldung\">\n        <canvas class=\"dither\" id=\"webinar-bg-canvas\"><\/canvas>\n        <div class=\"container\">\n            <div class=\"webinar-card\">\n                <div class=\"webinar-left\">\n                    <span class=\"badge-webinar\">\n                        <span class=\"led\"><\/span>\n                        <span>Webinar<\/span>\n                    <\/span>\n                    <h2>Pickware AI.<br>Am 09. Juni.<\/h2>\n\n                    <div class=\"date-pills\">\n                        <div class=\"pill\">Online<\/div>\n                        <div class=\"pill\">09. Juni<\/div>\n                        <div class=\"pill\">14:00 Uhr<\/div>\n                    <\/div>\n\n                    <p class=\"desc\">Wir zeigen dir den Chatbot und den MCP Server in Aktion \u2014 mit echten Beispielen aus\n                        Bestellungen, Lager und Buchhaltung. Plus Q&amp;A mit dem Team.<\/p>\n\n                    <div class=\"speaker\">\n                        <div class=\"avatar\"><\/div>\n                        <div class=\"who\">\n                            <strong>Samuel Vogel<\/strong>\n                            <span>CEO &#038; Founder, Pickware<\/span>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"webinar-right\">\n                    <div id=\"hs-form-container\"><\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n<\/div>\n\n<script charset=\"utf-8\" type=\"text\/javascript\" src=\"\/\/js-eu1.hsforms.net\/forms\/embed\/v2.js\" defer><\/script>\n<script src=\"https:\/\/unpkg.com\/three@0.160.0\/build\/three.min.js\"><\/script>\n<script>\n    \/\/ Dithering shader \u2014 tile backgrounds (WebGL2)\n    (function () {\n        const vertSrc = `#version 300 es\nprecision mediump float;\nlayout(location=0) in vec4 a_position;\nvoid main(){ gl_Position = a_position; }`;\n\n        const fragSrc = `#version 300 es\nprecision mediump float;\nuniform float u_time;\nuniform vec2 u_resolution;\nuniform vec4 u_colorBack;\nuniform vec4 u_colorFront;\nuniform float u_shape;\nuniform float u_type;\nuniform float u_pxSize;\nout vec4 fragColor;\n\n#define TWO_PI 6.28318530718\n#define PI 3.14159265358979323846\n\nfloat hash21(vec2 p){\n  p = fract(p * vec2(0.3183099, 0.3678794)) + 0.1;\n  p += dot(p, p + 19.19);\n  return fract(p.x * p.y);\n}\n\nconst int bayer2x2[4] = int[4](0,2,3,1);\nconst int bayer4x4[16] = int[16](0,8,2,10,12,4,14,6,3,11,1,9,15,7,13,5);\nconst int bayer8x8[64] = int[64](\n  0,32,8,40,2,34,10,42,\n  48,16,56,24,50,18,58,26,\n  12,44,4,36,14,46,6,38,\n  60,28,52,20,62,30,54,22,\n  3,35,11,43,1,33,9,41,\n  51,19,59,27,49,17,57,25,\n  15,47,7,39,13,45,5,37,\n  63,31,55,23,61,29,53,21\n);\n\nfloat getBayerValue(vec2 uv, int size){\n  ivec2 pos = ivec2(mod(uv, float(size)));\n  int index = pos.y * size + pos.x;\n  if (size == 2) return float(bayer2x2[index]) \/ 4.0;\n  else if (size == 4) return float(bayer4x4[index]) \/ 16.0;\n  else if (size == 8) return float(bayer8x8[index]) \/ 64.0;\n  return 0.0;\n}\n\nvoid main(){\n  float t = .5 * u_time;\n  vec2 uv = gl_FragCoord.xy \/ u_resolution.xy;\n  uv -= .5;\n\n  float pxSize = u_pxSize;\n  vec2 pxSizeUv = gl_FragCoord.xy;\n  pxSizeUv -= .5 * u_resolution;\n  pxSizeUv \/= pxSize;\n  vec2 pixelizedUv = floor(pxSizeUv) * pxSize \/ u_resolution.xy;\n  pixelizedUv += .5;\n  pixelizedUv -= .5;\n\n  vec2 shape_uv = pixelizedUv;\n  vec2 dithering_uv = pxSizeUv;\n\n  float shape = 0.;\n  if (u_shape < 4.5) {\n    \/\/ Sine wave\n    shape_uv *= 4.;\n    float wave = cos(.5 * shape_uv.x - 2. * t) * sin(1.5 * shape_uv.x + t) * (.75 + .25 * cos(3. * t));\n    shape = 1. - smoothstep(-1., 1., shape_uv.y + wave);\n  } else if (u_shape < 5.5) {\n    \/\/ Ripple\n    float dist = length(shape_uv);\n    shape = sin(pow(dist, 1.7) * 7. - 3. * t) * .5 + .5;\n  } else if (u_shape < 6.5) {\n    \/\/ Swirl\n    float l = length(shape_uv);\n    float angle = 6. * atan(shape_uv.y, shape_uv.x) + 4. * t;\n    float twist = 1.2;\n    float offset = pow(l, -twist) + angle \/ TWO_PI;\n    float mid = smoothstep(0., 1., pow(l, twist));\n    shape = mix(0., fract(offset), mid);\n  } else {\n    \/\/ Neural network \u2014 AI visualization\n    \/\/ Discrete \"neurons\" connected by dynamically-gated synapse edges.\n    \/\/ Neurons drift and fire, edges light up when the two endpoints are close.\n    vec2 p = shape_uv * 2.4;\n\n    \/\/ 7 neurons with distinct slow orbits\n    vec2 n[7];\n    float phase[7];\n    for (int i = 0; i < 7; i++) {\n      float fi = float(i);\n      float a = fi * 0.9 + t * (0.18 + fi * 0.04);\n      float r = 0.55 + 0.35 * sin(t * 0.4 + fi * 1.7);\n      n[i] = vec2(\n        cos(a * 1.1 + fi) * r + 0.28 * sin(t * 0.7 + fi * 2.3),\n        sin(a * 0.9 + fi * 0.6) * r + 0.28 * cos(t * 0.55 + fi * 1.9)\n      );\n      phase[i] = fract(t * (0.55 + fi * 0.09) + fi * 0.37);\n    }\n\n    float val = 0.0;\n\n    \/\/ Neuron cores + firing ring pulses\n    for (int i = 0; i < 7; i++) {\n      float d = length(p - n[i]);\n      \/\/ Always-on soft core glow\n      val = max(val, exp(-d * 22.0) * 0.9);\n      \/\/ Periodic firing ring \u2014 thin expanding circle\n      float ph = phase[i];\n      float ringR = ph * 0.9;\n      float ringA = pow(1.0 - ph, 1.3);\n      val = max(val, exp(-pow((d - ringR) * 40.0, 2.0)) * ringA * 0.75);\n    }\n\n    \/\/ Synapse edges \u2014 thin line between each pair of neurons,\n    \/\/ modulated by how close they are (closer = brighter\/active).\n    \/\/ Unrolled so GLSL stays happy without nested arrays.\n    for (int i = 0; i < 7; i++) {\n      for (int j = 0; j < 7; j++) {\n        if (j <= i) continue;\n        vec2 a = n[i];\n        vec2 b = n[j];\n        vec2 ab = b - a;\n        float L = length(ab);\n        \/\/ gate: edge active when neurons near each other\n        float gate = smoothstep(1.2, 0.3, L);\n        if (gate <= 0.001) continue;\n\n        \/\/ Distance from p to segment ab\n        vec2 ap = p - a;\n        float h = clamp(dot(ap, ab) \/ (L * L + 0.0001), 0.0, 1.0);\n        float dSeg = length(ap - ab * h);\n\n        \/\/ Thin line, sub-unit peak so Bayer dither makes a crisp stroke\n        float line = exp(-pow(dSeg * 55.0, 2.0)) * 0.65 * gate;\n\n        \/\/ Traveling spark pulse along the edge (signal flowing)\n        float sparkPos = fract(t * 0.8 + float(i) * 0.31 + float(j) * 0.17);\n        vec2 sparkPt = mix(a, b, sparkPos);\n        float dSpark = length(p - sparkPt);\n        float spark = exp(-dSpark * 28.0) * 0.85 * gate;\n\n        val = max(val, line);\n        val = max(val, spark);\n      }\n    }\n\n    shape = clamp(val, 0.0, 1.0);\n  }\n\n  int type = int(floor(u_type));\n  float dithering = 0.0;\n  if (type == 2) dithering = getBayerValue(dithering_uv, 2);\n  else if (type == 3) dithering = getBayerValue(dithering_uv, 4);\n  else dithering = getBayerValue(dithering_uv, 8);\n  dithering -= .5;\n  float res = step(.5, shape + dithering);\n\n  vec3 fgColor = u_colorFront.rgb * u_colorFront.a;\n  float fgOpacity = u_colorFront.a;\n  vec3 bgColor = u_colorBack.rgb * u_colorBack.a;\n  float bgOpacity = u_colorBack.a;\n  vec3 color = fgColor * res;\n  float opacity = fgOpacity * res;\n  color += bgColor * (1. - opacity);\n  opacity += bgOpacity * (1. - opacity);\n  fragColor = vec4(color, opacity);\n}`;\n\n        function hexToRgba(hex) {\n            const m = \/^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$\/i.exec(hex);\n            if (!m) return [0, 0, 0, 1];\n            return [parseInt(m[1], 16) \/ 255, parseInt(m[2], 16) \/ 255, parseInt(m[3], 16) \/ 255, 1];\n        }\n\n        function compileShader(gl, type, src) {\n            const s = gl.createShader(type);\n            gl.shaderSource(s, src);\n            gl.compileShader(s);\n            if (!gl.getShaderParameter(s, gl.COMPILE_STATUS)) {\n                console.error(gl.getShaderInfoLog(s));\n                gl.deleteShader(s);\n                return null;\n            }\n            return s;\n        }\n\n        function initTile(canvas, options) {\n            const gl = canvas.getContext('webgl2', { antialias: false, premultipliedAlpha: true });\n            if (!gl) return;\n\n            const vs = compileShader(gl, gl.VERTEX_SHADER, vertSrc);\n            const fs = compileShader(gl, gl.FRAGMENT_SHADER, fragSrc);\n            if (!vs || !fs) return;\n\n            const prog = gl.createProgram();\n            gl.attachShader(prog, vs);\n            gl.attachShader(prog, fs);\n            gl.linkProgram(prog);\n            if (!gl.getProgramParameter(prog, gl.LINK_STATUS)) {\n                console.error(gl.getProgramInfoLog(prog));\n                return;\n            }\n            gl.useProgram(prog);\n\n            const buf = gl.createBuffer();\n            gl.bindBuffer(gl.ARRAY_BUFFER, buf);\n            gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]), gl.STATIC_DRAW);\n            const locPos = gl.getAttribLocation(prog, 'a_position');\n            gl.enableVertexAttribArray(locPos);\n            gl.vertexAttribPointer(locPos, 2, gl.FLOAT, false, 0, 0);\n\n            const loc = {\n                u_time: gl.getUniformLocation(prog, 'u_time'),\n                u_resolution: gl.getUniformLocation(prog, 'u_resolution'),\n                u_colorBack: gl.getUniformLocation(prog, 'u_colorBack'),\n                u_colorFront: gl.getUniformLocation(prog, 'u_colorFront'),\n                u_shape: gl.getUniformLocation(prog, 'u_shape'),\n                u_type: gl.getUniformLocation(prog, 'u_type'),\n                u_pxSize: gl.getUniformLocation(prog, 'u_pxSize'),\n            };\n\n            const colorBack = hexToRgba(options.colorBack);\n            const colorFront = hexToRgba(options.colorFront);\n            const speed = options.speed || 1;\n            const pxSize = options.pxSize || 2;\n            const typeVal = options.type || 2; \/\/ 2x2\n            const shapeVal = options.shape || 5; \/\/ 5=ripple, 4=wave\n\n            let W = 0, H = 0;\n            function resize() {\n                const rect = canvas.getBoundingClientRect();\n                const DPR = Math.min(window.devicePixelRatio || 1, 2);\n                W = Math.max(1, Math.floor(rect.width * DPR));\n                H = Math.max(1, Math.floor(rect.height * DPR));\n                if (canvas.width !== W || canvas.height !== H) {\n                    canvas.width = W;\n                    canvas.height = H;\n                }\n                gl.viewport(0, 0, W, H);\n            }\n            resize();\n            const ro = new ResizeObserver(resize);\n            ro.observe(canvas);\n\n            const start = performance.now();\n            \/\/ Cancel any previous loop on this canvas before starting a new one\n            if (canvas._ditherRaf) cancelAnimationFrame(canvas._ditherRaf);\n            function render() {\n                const t = (performance.now() - start) * 0.001 * speed;\n                gl.clearColor(colorBack[0], colorBack[1], colorBack[2], 1);\n                gl.clear(gl.COLOR_BUFFER_BIT);\n                gl.useProgram(prog);\n                gl.bindBuffer(gl.ARRAY_BUFFER, buf);\n                gl.enableVertexAttribArray(locPos);\n                gl.vertexAttribPointer(locPos, 2, gl.FLOAT, false, 0, 0);\n                gl.uniform1f(loc.u_time, t);\n                gl.uniform2f(loc.u_resolution, W, H);\n                gl.uniform4fv(loc.u_colorBack, colorBack);\n                gl.uniform4fv(loc.u_colorFront, colorFront);\n                gl.uniform1f(loc.u_shape, shapeVal);\n                gl.uniform1f(loc.u_type, typeVal);\n                gl.uniform1f(loc.u_pxSize, pxSize);\n                gl.drawArrays(gl.TRIANGLES, 0, 6);\n                if (canvas._ditherVisible) canvas._ditherRaf = requestAnimationFrame(render);\n                else canvas._ditherRaf = null;\n            }\n            canvas._ditherVisible = false;\n            canvas._ditherStart = function () {\n                if (!canvas._ditherRaf) { canvas._ditherVisible = true; canvas._ditherRaf = requestAnimationFrame(render); }\n            };\n            canvas._ditherStop = function () { canvas._ditherVisible = false; };\n        }\n\n        \/\/ Apply to all tiles with varied color pairs\n        const palettes = [\n            { colorBack: '#000000', colorFront: '#FFC217', pxSize: 3, speed: 1.2, type: 2, shape: 5 }, \/\/ ripple\n            { colorBack: '#000000', colorFront: '#F155A0', pxSize: 3, speed: 0.6, type: 4, shape: 4 }, \/\/ wave\n            { colorBack: '#000000', colorFront: '#1FD49E', pxSize: 3, speed: 0.9, type: 3, shape: 6 }, \/\/ swirl\n        ];\n\n        const tiles = Array.from(document.querySelectorAll('.tile'));\n        tiles.forEach((tile, i) => {\n            const p = palettes[i % palettes.length];\n            tile.style.setProperty('--tile-color', p.colorFront);\n            const canvas = tile.querySelector('canvas.dither');\n            if (canvas) initTile(canvas, p);\n        });\n\n        const webinarCanvas = document.getElementById('webinar-bg-canvas');\n        if (webinarCanvas) initTile(webinarCanvas, { colorBack: '#030d26', colorFront: '#abed56', pxSize: 3, speed: 0.6, type: 4, shape: 4 });\n\n        \/\/ Pause WebGL loops when tiles scroll out of view\n        const ditherIO = new IntersectionObserver((entries) => {\n            entries.forEach(e => {\n                const canvas = e.target.tagName === 'CANVAS' ? e.target : e.target.querySelector('canvas.dither');\n                if (!canvas) return;\n                if (e.isIntersecting) canvas._ditherStart && canvas._ditherStart();\n                else canvas._ditherStop && canvas._ditherStop();\n            });\n        }, { rootMargin: '80px' });\n        tiles.forEach(t => ditherIO.observe(t));\n        if (webinarCanvas) ditherIO.observe(webinarCanvas);\n    })();\n\n    \/\/ Hero background \u2014 Three.js particle wave (red)\n    (function () {\n        const root = document.getElementById('hero-canvas');\n        if (!root || typeof THREE === 'undefined') return;\n\n        const layerWaves = root.querySelector('[data-hero-fx=\"waves\"]');\n        if (!layerWaves) return;\n\n        function startWaves(container) {\n            if (container._started) return; container._started = true;\n            const SEPARATION = 150, AMOUNTX = 60, AMOUNTY = 60;\n            const scene = new THREE.Scene();\n            const rect = container.getBoundingClientRect();\n            const W = rect.width || window.innerWidth;\n            const H = rect.height || 800;\n            const camera = new THREE.PerspectiveCamera(60, W \/ H, 1, 10000);\n            camera.position.set(0, 355, 1220);\n            camera.up.set(0, 1, 0);\n            camera.lookAt(0, 0, 0);\n\n            const renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });\n            renderer.setPixelRatio(Math.min(window.devicePixelRatio || 1, 2));\n            renderer.setSize(W, H);\n            renderer.setClearColor(0x000000, 0);\n            container.appendChild(renderer.domElement);\n            renderer.domElement.style.cssText = 'position:absolute;inset:0;width:100%;height:100%;';\n\n            const positions = [], colors = [];\n            for (let ix = 0; ix < AMOUNTX; ix++) {\n                for (let iy = 0; iy < AMOUNTY; iy++) {\n                    positions.push(ix * SEPARATION - (AMOUNTX * SEPARATION) \/ 2, 0, iy * SEPARATION - (AMOUNTY * SEPARATION) \/ 2);\n                    colors.push(1.0, 0.1, 0.1); \/\/ #FF1A1A\n                }\n            }\n            const geometry = new THREE.BufferGeometry();\n            geometry.setAttribute('position', new THREE.Float32BufferAttribute(positions, 3));\n            geometry.setAttribute('color', new THREE.Float32BufferAttribute(colors, 3));\n            const material = new THREE.PointsMaterial({ size: 8, vertexColors: true, sizeAttenuation: true });\n            const points = new THREE.Points(geometry, material);\n            scene.add(points);\n\n            let count = 0, wavesRunning = false, wavesRaf = null;\n            function animate() {\n                if (!wavesRunning) { wavesRaf = null; return; }\n                wavesRaf = requestAnimationFrame(animate);\n                const arr = geometry.attributes.position.array;\n                let i = 0;\n                for (let ix = 0; ix < AMOUNTX; ix++) {\n                    for (let iy = 0; iy < AMOUNTY; iy++) {\n                        arr[i * 3 + 1] = Math.sin((ix + count) * 0.3) * 50 + Math.sin((iy + count) * 0.5) * 50;\n                        i++;\n                    }\n                }\n                geometry.attributes.position.needsUpdate = true;\n                renderer.render(scene, camera);\n                count += 0.1;\n            }\n            container._wavesStart = function () { if (!wavesRunning) { wavesRunning = true; animate(); } };\n            container._wavesStop = function () { wavesRunning = false; };\n\n            new ResizeObserver(() => {\n                const r = container.getBoundingClientRect();\n                if (!r.width) return;\n                camera.aspect = r.width \/ r.height;\n                camera.updateProjectionMatrix();\n                renderer.setSize(r.width, r.height);\n            }).observe(container);\n        }\n\n        startWaves(layerWaves);\n\n        \/\/ Pause Three.js loop when hero is out of view\n        new IntersectionObserver((entries) => {\n            entries.forEach(e => {\n                if (e.isIntersecting) layerWaves._wavesStart && layerWaves._wavesStart();\n                else layerWaves._wavesStop && layerWaves._wavesStop();\n            });\n        }, { rootMargin: '120px' }).observe(layerWaves);\n    })();\n\n    \/\/ Chat-card animation loop (timeline, prev\/next navigation)\n    (function () {\n        const TIMELINE = [\n            { t: 0, set: [] },\n            { t: 400, set: ['show-user'] },\n            { t: 700, set: ['show-user', 'thinking'] },\n            { t: 1800, set: ['show-user', 'thinking', 'show-avatar'] },\n            { t: 2700, set: ['show-user', 'thinking', 'show-avatar', 'show-tool', 'show-tool-foot'] },\n            { t: 3200, set: ['show-user', 'show-avatar', 'show-tool', 'show-tool-foot'] },\n            { t: 3500, set: ['show-user', 'show-avatar', 'show-tool', 'show-tool-foot', 'show-answer'] },\n        ];\n        const TOTAL = 6800;\n        const ALL_CLASSES = ['show-user', 'show-avatar', 'show-tool', 'show-tool-foot', 'show-answer', 'thinking'];\n\n        function setClasses(card, classes) {\n            ALL_CLASSES.forEach(c => {\n                if (classes.includes(c)) card.classList.add(c);\n                else card.classList.remove(c);\n            });\n        }\n\n        const stacks = document.querySelectorAll('.chat-stack');\n\n        stacks.forEach(stack => {\n            const cards = Array.from(stack.querySelectorAll('.chat-card'));\n            if (!cards.length) return;\n\n            cards.forEach(card => {\n                card.setAttribute('data-animate', '');\n                const footer = card.querySelector('.footer');\n                if (footer && !footer.querySelector('.typing')) {\n                    const typing = document.createElement('span');\n                    typing.className = 'typing';\n                    typing.innerHTML = '<span><\/span><span><\/span><span><\/span>';\n                    footer.appendChild(typing);\n                }\n            });\n\n            const tile = stack.closest('.tile') || stack.parentElement;\n            if (!tile || tile.querySelector('.chat-controls')) return;\n\n            const controls = document.createElement('div');\n            controls.className = 'chat-controls';\n            controls.innerHTML = `\n      <button class=\"nav-btn prev-btn\" aria-label=\"Vorheriger Use Case\" type=\"button\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n          <path d=\"M10 3L5 8l5 5\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n        <\/svg>\n      <\/button>\n      <div class=\"dots\" role=\"tablist\" aria-label=\"Use Case ausw\u00e4hlen\"><\/div>\n      <button class=\"nav-btn next-btn\" aria-label=\"N\u00e4chster Use Case\" type=\"button\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n          <path d=\"M6 3l5 5-5 5\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n        <\/svg>\n      <\/button>\n    `;\n            tile.appendChild(controls);\n\n            const dotsHost = controls.querySelector('.dots');\n            cards.forEach((_, i) => {\n                const d = document.createElement('button');\n                d.type = 'button';\n                d.className = 'dot';\n                d.setAttribute('role', 'tab');\n                d.setAttribute('aria-label', 'Use Case ' + (i + 1));\n                d.dataset.idx = String(i);\n                dotsHost.appendChild(d);\n            });\n\n            const state = {\n                cards, controls, active: 0,\n                raf: null, startTime: 0, inView: false, finished: false,\n            };\n            stack._state = state;\n\n            function applyAt(ms) {\n                const card = state.cards[state.active];\n                if (!card) return;\n                let active = TIMELINE[0].set;\n                for (let i = 0; i < TIMELINE.length; i++) {\n                    if (TIMELINE[i].t <= ms) active = TIMELINE[i].set;\n                    else break;\n                }\n                setClasses(card, active);\n            }\n\n            function start() {\n                if (state.raf || state.finished) return;\n                state.startTime = performance.now();\n                function tick(now) {\n                    const elapsed = now - state.startTime;\n                    if (elapsed >= TOTAL) {\n                        applyAt(TOTAL);\n                        state.raf = null;\n                        state.finished = true;\n                        return;\n                    }\n                    applyAt(elapsed);\n                    state.raf = requestAnimationFrame(tick);\n                }\n                state.raf = requestAnimationFrame(tick);\n            }\n\n            function stop() {\n                if (state.raf) cancelAnimationFrame(state.raf);\n                state.raf = null;\n                if (state._advanceTimer) { clearTimeout(state._advanceTimer); state._advanceTimer = null; }\n            }\n            state._start = start;\n            state._stop = stop;\n\n            function showActive() {\n                state.cards.forEach((c, i) => c.classList.toggle('is-active', i === state.active));\n                Array.from(dotsHost.children).forEach((d, i) => d.classList.toggle('is-active', i === state.active));\n                state.cards.forEach((c, i) => {\n                    if (i !== state.active) setClasses(c, []);\n                });\n            }\n\n            function goTo(idx) {\n                const n = state.cards.length;\n                state.active = ((idx % n) + n) % n;\n                showActive();\n                setClasses(state.cards[state.active], []);\n                stop();\n                state.finished = false;\n                start();\n            }\n\n            controls.querySelector('.prev-btn').addEventListener('click', () => goTo(state.active - 1));\n            controls.querySelector('.next-btn').addEventListener('click', () => goTo(state.active + 1));\n            dotsHost.addEventListener('click', (e) => {\n                const dot = e.target.closest('.dot');\n                if (!dot) return;\n                goTo(parseInt(dot.dataset.idx, 10));\n            });\n\n            showActive();\n        });\n\n        const io = new IntersectionObserver((entries) => {\n            entries.forEach(e => {\n                const stack = e.target;\n                const state = stack._state;\n                if (!state) return;\n                if (e.isIntersecting) {\n                    state.inView = true;\n                    state._start();\n                } else {\n                    state.inView = false;\n                }\n            });\n        }, { threshold: 0.3 });\n\n        stacks.forEach(s => io.observe(s));\n\n    })();\n\n    \/\/ HubSpot form\n    (function () {\n        function initHsForm() {\n            if (typeof hbspt !== 'undefined') {\n                hbspt.forms.create({\n                    portalId: \"26748939\",\n                    formId: \"4b0e94e4-672f-4ce1-8893-653888ddaa48\",\n                    region: \"eu1\",\n                    target: \"#hs-form-container\"\n                });\n            } else {\n                setTimeout(initHsForm, 100);\n            }\n        }\n        initHsForm();\n    })();\n<\/script>\n\n<!-- GSAP + ScrollTrigger -->\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/gsap.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/ScrollTrigger.min.js\"><\/script>\n<script>\n    (function () {\n        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\n\n        gsap.registerPlugin(ScrollTrigger);\n\n        const R = '#pickware-ai-root';\n\n\n        \/\/ \u2500\u2500 MCP \u2014 headline, diagram, benefits \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n        gsap.from([`${R} .mcp h2`, `${R} .mcp p.lead`], {\n            scrollTrigger: { trigger: `${R} .mcp`, start: 'top 82%' },\n            y: 28, opacity: 0, duration: 0.65, ease: 'power2.out', stagger: 0.15\n        });\n\n        gsap.from(Array.from(document.querySelectorAll(`${R} .mcp-stage > *`)), {\n            scrollTrigger: { trigger: `${R} .mcp-stage`, start: 'top 82%' },\n            y: 24, opacity: 0, duration: 0.5, ease: 'power2.out', stagger: 0.08\n        });\n\n        gsap.from(`${R} .benefit`, {\n            scrollTrigger: { trigger: `${R} .mcp-benefits`, start: 'top 82%' },\n            y: 24, opacity: 0, duration: 0.6, ease: 'power2.out', stagger: 0.13\n        });\n\n        \/\/ \u2500\u2500 MCP arrows \u2014 looping data-flow pulse \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n        document.querySelectorAll(`${R} .mcp-stage .arrow`).forEach((arrow, i) => {\n            gsap.fromTo(arrow,\n                { scale: 0.8 },\n                { scale: 1.15, duration: 1.8, ease: 'sine.inOut', yoyo: true, repeat: -1, transformOrigin: '50% 50%' }\n            );\n        });\n\n\n\n    })();\n<\/script>\n\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"Event\",\n  \"name\": \"Pickware AI Webinar\",\n  \"startDate\": \"2026-05-15T14:00:00+02:00\",\n  \"eventAttendanceMode\": \"https:\/\/schema.org\/OnlineEventAttendanceMode\",\n  \"eventStatus\": \"https:\/\/schema.org\/EventScheduled\",\n  \"location\": {\n    \"@type\": \"VirtualLocation\",\n    \"url\": \"https:\/\/pickware.de\"\n  },\n  \"description\": \"Wir zeigen dir Pickware AI \u2013 den AI-Assistenten f\u00fcr deine Warenwirtschaft \u2013 in Aktion. Mit echten Beispielen aus Lager, Versand und Finanzen.\",\n  \"organizer\": {\n    \"@type\": \"Organization\",\n    \"name\": \"Pickware\",\n    \"url\": \"https:\/\/pickware.de\"\n  }\n}\n<\/script>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A NEW CHAPTERIntroducing Pickware AI Mit Pickware AI beginnt f\u00fcr dich eine neue Art, mit deinem ERP zu arbeiten. F\u00fcr mehr Outcome \u2013 rund um die Uhr. Zum Webinar anmelden P Produkte (500) Pickware AI Wie lange reicht unser Bestand vom Oversize Tee Washed Black noch? stock.get(SKU-1042) sales.velocity(SKU-1042, 30d) Oversize Tee Washed Black \u2014 Reichweite [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_stopmodifiedupdate":false,"_modified_date":"","footnotes":""},"class_list":["post-47441","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/pages\/47441","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/comments?post=47441"}],"version-history":[{"count":71,"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/pages\/47441\/revisions"}],"predecessor-version":[{"id":47611,"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/pages\/47441\/revisions\/47611"}],"wp:attachment":[{"href":"https:\/\/www.pickware.com\/de\/wp-json\/wp\/v2\/media?parent=47441"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}