{"id":114660,"date":"2025-11-18T16:59:15","date_gmt":"2025-11-18T09:59:15","guid":{"rendered":"https:\/\/jblstore.co.id\/?page_id=114660"},"modified":"2025-11-18T17:00:18","modified_gmt":"2025-11-18T10:00:18","slug":"bandbox-solo-trio-ai-amplifier","status":"publish","type":"page","link":"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/","title":{"rendered":"Bandbox Solo Trio AI Amplifier"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"114660\" class=\"elementor elementor-114660\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-fbda472 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"fbda472\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-796406f\" data-id=\"796406f\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-f198a6c elementor-widget elementor-widget-shortcode\" data-id=\"f198a6c\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\n    <link rel=\"stylesheet\" type=\"text\/css\" href=\"\/\/cdn.jsdelivr.net\/gh\/kenwheeler\/slick@1.8.1\/slick\/slick.css\"\/>\n    <link rel=\"stylesheet\" type=\"text\/css\" href=\"\/\/cdn.jsdelivr.net\/gh\/kenwheeler\/slick@1.8.1\/slick\/slick-theme.css\"\/>\n    \n    <style>\n        #title {\n            display: none;\n        }\n\n        @media (max-width: 768px) {\n            .is-desktop {\n                display: none!important;\n            }\n        }\n\n        @media (min-width: 769px) {\n            .is-mobile {\n                display: none!important;\n            }\n        }\n\n        .cta {\n            will-change: opacity;\n            transition: opacity .2s ease-in;\n\n            &:focus,\n            &:hover {\n                outline: none;\n            }\n\n            &:hover {\n                opacity: 0.8;\n            }\n        }\n\n        .bandbox {\n            max-width: var(--sizing-max-page);\n            margin-inline: auto;\n\n            #navbar-placeholder {\n                background-color: #000;\n\n                .nav-wrapper {\n                    display: flex;\n                    justify-content: space-between;\n                    align-items: center;\n                    padding: 10px 5%;\n                    max-width: var(--sizing-max-content);\n                    margin-inline: auto;\n\n                    @media (max-width: 768px) {\n                        padding-inline: 2%;\n                    }\n\n                    .logo-wrapper {\n                        img {\n                            width: 120px;\n                            height: auto;\n                        }\n                    }\n\n                    .nav-links {\n                        display: flex;\n                        gap: 30px;\n                        margin: 0;\n\n                        &::before {\n                            display: none;\n                        }\n\n                        @media (max-width: 768px) {\n                            display: block;\n                        }\n\n                        a {\n                            font-family: Grostesk-Medium, Arial, Helvetica, sans-serif;\n                            color: #fff;\n                            background-color: transparent;\n                            font-size: clamp(0.625rem, 0.693vw + 0.446rem, 1rem);\n                            text-decoration: none;\n                            text-transform: uppercase;\n                            padding: 16px 30px;\n                            display: flex;\n                            align-items: center;\n                            text-align: center;\n                            white-space: nowrap;\n\n                            &:hover {\n                                background-color: var(--colorMain);\n                                border-radius: 50px;\n                                text-transform: capitalize;\n                            }\n\n                            @media (max-width: 768px) {\n                                padding: 8px 20px;\n                                display: inline-block;\n                            }\n                        }\n\n                        \/* a:last-child {\n                            background-color: var(--colorMain);\n                            padding: 16px 30px;\n                            border-radius: 50px;\n                            text-transform: capitalize;\n\n                            @media (max-width: 768px) {\n                                padding: 8px 20px;\n                            }\n                        } *\/\n                    }\n                }\n            }\n\n            #banner {\n                position: relative;\n                \n                .img-wrapper {\n                    display: flex;\n                    \n                    img {\n                        width: 100%;\n                        height: auto;\n                        object-fit: cover;\n                    }\n                }\n\n                .text-wrapper {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    text-align: center;\n                    color: #FFFFFF;\n                    width: 44%;\n                    height: 80%;\n                    display: flex;\n                    flex-direction: column;\n                    justify-content: center;\n                    font-size: clamp(12px, calc(0.75rem + ((1vw - 3.7px) * 1.8065)), 40px);\n                    min-height: 0vw;\n\n                    @media (max-width: 768px) {\n                        font-size: clamp(18px, calc(1.125rem + ((1vw - 3.7px) * 0.9032)), 32px);\n                        width: 100%;\n                        height: 100%;\n                        background-color: rgba(0, 0, 0, 0.25);\n                    }\n\n                    .title-section {\n                        font-family: \"Kostic - Roc Grotesk Wide Bold\",Arial, Helvetica, sans-serif;\n                        font-weight: bold;\n                        color: #FFFFFF;\n                        margin-bottom: 0;\n\n                        .mark {\n                            font-family: \"Kostic - Roc Grotesk Wide Light\",Arial, Helvetica, sans-serif;\n                        }\n                    }\n                    \n                    .subtitle-section {\n                        font-weight: 500;\n                        color: #FFFFFF;\n                        margin-top: 0;\n                        font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                        font-size: 126%;\n\n                        @media (max-width: 767px) {\n                            font-size: 70%;\n                        }\n                    }\n                }\n            }\n\n            #trailer {\n                position: relative;\n\n                .decor {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    transform: translateY(55%);\n                    width: 100%;\n                    height: auto;\n                    z-index: 1;\n                    display: flex;\n                    user-select: none;\n\n                    @media (max-width: 767px) {\n                        transform: translateY(70%);\n                    }\n\n                    img {\n                        width: 100%;\n                        height: auto;\n                        object-fit: cover;\n                    }\n                }\n\n                .video-wrapper {\n                    position: relative;\n                    z-index: 2;\n                    display: flex;\n                    justify-content: center;\n                    align-items: center;\n                    padding: 150px 0;\n\n                    @media (max-width: 767px) {\n                        padding: 12% 0;\n                    }\n\n                    iframe {\n                        width: 70%;\n                        height: 508px;\n\n                        @media (max-width: 1024px) {\n                            width: 80%;\n                            height: auto;\n                            aspect-ratio: 16 \/ 9;\n                        }\n                    }\n                }\n            }\n\n            #introproducts {\n                position: relative;\n\n                .title-wrapper {\n                    text-align: center;\n                    margin-bottom: 40px;\n\n                    .title-section {\n                        font-family: \"Kostic - Roc Grotesk Condensed Bold\",Arial, Helvetica, sans-serif;\n                        font-weight: bold;\n                        font-size: clamp(38px, calc(2.375rem + ((1vw - 3.7px) * 2.8387)), 82px);\n                        text-transform: uppercase;\n                    }\n                }\n\n                .partition-wrapper {\n                    display: grid;\n                    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n                    \/* justify-content: center; *\/\n                    gap: 10px;\n\n                    .part-side {\n                        text-align: center;\n                        padding: 20px 4%;\n                        padding-top: 0px;\n                        padding-bottom: 30px;\n                        display: flex;\n                        flex-direction: column;\n\n                        .img-wrapper {\n                            margin-bottom: 20px;\n\n                            img {\n                                width: 80%;\n                                margin-inline: auto;\n                                height: auto;\n                                object-fit: cover;\n                            }\n                        }\n\n                        .text-wrapper {\n                            display: flex;\n                            flex-direction: column;\n                            justify-content: space-between;\n                            height: 100%;\n\n                            h3 {\n                                font-family: \"Kostic - Roc Grotesk Condensed Medium\",Arial, Helvetica, sans-serif;\n                                font-weight: bold;\n                                font-size: clamp(24px, calc(1.5rem + ((1vw - 3.7px) * 3.0968)), 72px);\n                                min-height: 0vw;\n                                margin-top: 0px;\n                                margin-bottom: 10px;\n                                text-transform: uppercase;\n                            }\n                            \n                            p {\n                                font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                                font-size: clamp(18px, calc(1.125rem + ((1vw - 3.7px) * 0.6452)), 28px);\n                                min-height: 0vw;\n                                margin-bottom: 70px;\n                                line-height: 100%;\n                                text-align: justify;\n\n                                @media (max-width: 767px) {\n                                    margin-bottom: 10px;\n                                }\n                            }\n\n                            .mycta {\n                                color: white;\n                                background-color: var(--colorMain);\n                                padding: 13px 40px;\n                                border-radius: 50px;\n                                text-transform: uppercase;\n                                font-family: Grostesk-Medium, Arial, Helvetica, sans-serif;\n                                font-size: clamp(12px, calc(0.75rem + ((1vw - 3.7px) * 0.7742)), 24px);\n                                width: fit-content;\n                                display: block;\n                                margin-inline: auto;\n                                \n                                @media (max-width: 768px) {\n                                    margin: 0 auto;\n                                    margin-top: 30px;\n                                    padding: 7px 25px;\n                                    display: block;\n                                }\n                            }\n                        }\n                    }\n                }\n            }\n\n            #test-music {\n                position: relative;\n\n                .inside {\n                    padding-block: 10%;\n                    position: relative;\n                    padding-inline: 5%;\n\n                    .title-wrapper {\n                        text-align: center;\n                        margin-bottom: 40px;\n\n                        .title-section {\n                            font-family: \"Kostic - Roc Grotesk Condensed Bold\",Arial, Helvetica, sans-serif;\n                            font-weight: bold;\n                            font-size: clamp(38px, calc(2.375rem + ((1vw - 3.7px) * 2.8387)), 82px);\n                            text-transform: uppercase;\n                            line-height: 90%;\n                        }\n                    }\n\n                    .music-wrapper {\n                        max-width: 900px;\n                        margin-inline: auto;\n                        margin-bottom: 70px;\n                        border-radius: 32px;\n                        overflow: hidden;\n                        border: 1px solid #000;\n                        box-shadow: 0 0 3px rgb(0 0 0%);\n\n                        .top-wrapper {\n                            padding: 50px;\n\n                            @media (max-width: 767px) {\n                                padding: 30px;\n                            }\n\n                            .title-section {\n                                margin-left: 20px;\n                                font-family: \"Kostic - Roc Grotesk Wide Bold\",Arial, Helvetica, sans-serif;\n                                text-wrap: balance;\n                                font-size: clamp(14px, calc(0.875rem + ((1vw - 3.7px) * 0.9032)), 28px);\n                                line-height: 100%;\n                            }\n\n                            label {\n                                width: 100%;\n                                font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                                font-size: clamp(14px, calc(0.875rem + ((1vw - 3.7px) * 0.5161)), 22px);\n                            }\n\n                            .audio-container input {\n                                appearance: none;\n                                -webkit-appearance: none;\n                                -moz-appearance: none;\n                                position: absolute;\n                                opacity: 0;\n                            }\n\n                            .audio-container label {\n                                display: flex;\n                                align-items: center;\n                                cursor: pointer;\n                                gap: 8px;\n                                font-size: 15px;\n                                line-height: 1.4;\n                                position: relative;\n                                margin-bottom: 12px;\n                            }\n\n                            \/* Bullet custom *\/\n                            .audio-container label .radio-bullet {\n                                width: 18px;\n                                height: 18px;\n                                border: 1px solid #c1c1c1ff;\n                                border-radius: 50%;\n                                display: inline-block;\n                                position: relative;\n                                transition: all 0.2s ease;\n                            }\n\n                            .audio-container label input[type=\"radio\"]:checked + .radio-bullet {\n                                border-color: #c1c1c1ff;\n                                background-color: #fff;\n                            }\n\n                            .audio-container label input[type=\"radio\"]:checked + .radio-bullet::after {\n                                content: \"\";\n                                position: absolute;\n                                top: 50%;\n                                left: 50%;\n                                width: 8px;\n                                height: 8px;\n                                background: var(--colorMain);\n                                border-radius: 50%;\n                                transform: translate(-50%, -50%);\n                            }\n\n                            .audio-container label:hover .radio-bullet {\n                                border-color: var(--colorMain);\n                            }\n                        }\n\n                        .bottom-wrapper {\n                            background-color: #ff4713;\n                            width: 100%;\n                            height: 160px;\n                            display: flex;\n                            position: relative;\n\n                            .img-wrapper {\n                                background: #000;\n                                position: relative;\n                                overflow: hidden;\n                                width: 210px;\n                                height: 100%;\n\n                                img {\n                                    object-fit: cover;\n                                    height: 100%;\n                                }\n                            }\n\n                            #playBtn, #playBtn2 {\n                                z-index: 1;\n                                background-color: #fff;\n                                position: absolute;\n                                height: 67px;\n                                width: 67px;\n                                top: 48px;\n                                left: 130px;\n                                border: none;\n                                border-radius: 50%;\n                                box-shadow: -7px 0 8px rgba(0,0,0,.25);\n                                backdrop-filter: blur(24px);\n                                background-size: 40%;\n                                background-repeat: no-repeat;\n                                background-position: center;\n                                float: left;\n                                outline: 0;\n\n                                @media (max-width: 767px) {\n                                    left: 90px;\n                                }\n                            }\n\n                            button.loading {\n                                opacity: 0.5;\n                                pointer-events: none;\n                                position: relative;\n                            }\n\n                            .play {\n                                background: url(\/wp-content\/uploads\/2025\/11\/play.png);\n                            }\n                            .pause {\n                                background: url(\/wp-content\/uploads\/2025\/11\/pause.png);\n                            }\n\n                            .timeline-wrapper {\n                                width: 100%;\n                                padding-inline: 50px;\n                                display: flex;\n                                flex-direction: column;\n                                justify-content: center;\n\n                                @media (max-width: 767px) {\n                                    padding-inline: 40px;\n                                }\n                            }\n                        }\n                    }\n                }\n            }\n\n            #introduction {\n                position: relative;\n\n                .inside {\n                    position: relative;\n\n                    .title-wrapper {\n                        text-align: center;\n                        padding-block: 2%;\n                        background-color: black;\n\n                        .title-section {\n                            font-family: \"Kostic - Roc Grotesk Condensed Bold\",Arial, Helvetica, sans-serif;\n                            font-weight: bold;\n                            font-size: clamp(38px, calc(2.375rem + ((1vw - 3.7px) * 2.8387)), 82px);\n                            text-transform: uppercase;\n                            margin: 0;\n                            color: #FFFFFF;\n                        }\n                    }\n\n                    .content-wrapper {\n                        background-color: var(--colorMain);\n                        color: #FFFFFF;\n                        padding-block: 3%;\n                        \n                        .side-wrapper {\n                            display: grid;\n                            grid-template-columns: 50% 50%;\n                            gap: 20px;\n                            padding-block: 70px;\n\n                            @media (max-width: 767px) {\n                                grid-template-columns: 1fr;\n                                gap: 40px;\n                                padding-block: 20px;\n                            }\n\n                            &:nth-child(even) {\n                                .img-wrapper {\n                                    order: 2;\n                                    justify-content: start;\n                                    padding-left: 8%;\n\n                                    @media (max-width: 768px) {\n                                        order: initial;\n                                        padding-left: 0;\n                                        justify-content: center;\n                                    }\n                                }\n\n                                .text-wrapper {\n                                    order: 1;\n                                    padding-left: 10.5%;\n\n                                    @media (max-width: 768px) {\n                                        order: initial;\n                                        padding-left: 0;\n                                        padding-inline: 6%;\n                                    }\n                                }\n                            }\n\n                            &:nth-child(odd) {\n                                .img-wrapper {\n                                    order: 1;\n                                    justify-content: end;\n                                    padding-right: 8%;\n                                    \n                                    @media (max-width: 768px) {\n                                        padding-right: 0;\n                                        order: initial;\n                                        justify-content: center;\n                                    }\n                                }\n\n                                .text-wrapper {\n                                    order: 2;\n                                    padding-right: 10.5%;\n\n                                    @media (max-width: 768px) {\n                                        order: initial;\n                                        padding-right: 0;\n                                        padding-inline: 6%;\n                                    }\n                                }\n                            }\n                            \n                            .img-wrapper {\n                                display: flex;\n\n                                img {\n                                    width: 100%;\n                                    height: auto;\n                                    max-width: 88%;\n                                    object-fit: contain;\n                                }\n                            }\n                            \n                            .text-wrapper {\n                                display: flex;\n                                flex-direction: column;\n                                justify-content: center;\n                                \n                                .title-side {\n                                    font-family: \"Kostic - Roc Grotesk Condensed Medium\",Arial, Helvetica, sans-serif;\n                                    font-weight: bold;\n                                    font-size: clamp(38px, calc(2.375rem + ((1vw - 3.7px) * 2.8387)), 82px);\n                                    text-transform: uppercase;\n                                    margin: 0;\n                                    color: #FFFFFF;\n                                    line-height: 90%;\n                                    margin-bottom: 20px;\n                                }\n\n                                .description-side {\n                                    font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                                    font-size: clamp(18px, calc(1.125rem + ((1vw - 3.7px) * 0.6452)), 28px);\n                                    line-height: 100%;\n                                    margin-bottom: 20px;\n                                }\n\n                                .small-text {\n                                    font-size: clamp(10px, calc(0.625rem + ((1vw - 3.7px) * 0.3871)), 16px);\n                                    font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                                    margin-top: 10px;\n                                    line-height: 120%;\n                                    max-width: 75%;\n                                }\n                            }\n                        }\n\n                        .btn-wrapper {\n                            margin-bottom: 20px;\n                            \n                            .mycta {\n                                color: var(--colorMain);\n                                background-color: #FFFFFF;\n                                padding: 12px 40px;\n                                border-radius: 50px;\n                                text-transform: uppercase;\n                                font-family: Grostesk-Medium, Arial, Helvetica, sans-serif;\n                                font-size: clamp(12px, calc(0.75rem + ((1vw - 3.7px) * 0.7742)), 24px);\n                                width: fit-content;\n                                display: block;\n                                margin-inline: auto;\n                                \n                                @media (max-width: 768px) {\n                                    margin: 0 auto;\n                                    margin-top: 30px;\n                                    padding: 7px 25px;\n                                    display: block;\n                                }\n                            }\n                        }\n                    }\n                }\n            }\n\n            #findyourfit {\n                position: relative;\n\n                .inside {\n                    margin: 0 auto;\n                    padding: 0 6%;\n\n                    .product-highlight {\n                        display: flex;\n                        gap: 64px;\n                        padding: 56px 0;\n                        overflow: hidden;\n                        position: relative;\n                        z-index: 2;\n                        justify-content: space-between;\n\n                        @media (max-width: 768px) {\n                            flex-wrap: wrap;\n                            gap: 14px;\n                        }\n\n                        .title-findyourfit {\n                            font-size: clamp(48px, 5vw, 54px);\n                            margin: 0;\n                            color: #000;\n                            line-height: normal;\n                            text-transform: uppercase;\n                            font-weight: 700;\n                            line-height: 110%;\n                            white-space: nowrap;\n                            \/* width: fit-content; *\/\n                            font-family: \"Kostic - Roc Grotesk Condensed Medium\", sans-serif;\n\n                            @media (max-width: 768px) {\n                                width: 100%;\n                            }\n                        }\n\n                        .arrow-right {\n                            position: absolute;\n                            top: 65%;\n                            right: 0;\n                            cursor: pointer;\n                            z-index: 4;\n\n                            &:hover {\n                                opacity: 0.6;\n                                outline: none;\n                            }\n\n                            &:focus {\n                                outline: none;\n                            }\n                        }\n\n                        .arrow-left {\n                            position: absolute;\n                            top: 65%;\n                            left: 0;\n                            cursor: pointer;\n                            z-index: 4;\n\n                            &:hover {\n                                opacity: 0.6;\n                                outline: none;\n                            }\n\n                            &:focus {\n                                outline: none;\n                            }\n                        }\n\n                        .product-list {\n                            display: flex;\n                            \/* flex: 1; *\/\n                            max-width: 550px;\n                            \n                            justify-content: space-between;\n\n                            @media (max-width: 768px) {\n                                width: 100%;\n                            }\n\n                            .slick-list {\n                                flex: 1;\n                            }\n\n                            .slick-track {\n                                display: flex;\n                                gap: 32px;\n\n                                @media (max-width: 768px) {\n                                    gap: 16px;\n                                }\n                            }\n\n                            .product-comparison {\n                                flex: 1;\n                                \/* max-width: 25%; *\/\n\n                                .title-product-comparison {\n                                    border-bottom: 2px solid var(--colorMain);\n                                    font-family: var(--font-body);\n                                    \/* 1200 -> 375 | 20 -> 16 *\/\n                                    font-size: clamp(16px, calc(1rem + ((1vw - 3.75px) * 0.4848)), 20px);\n                                    min-height: 0vw;\n                                    padding: 16px 8px 20px;\n                                    text-align: center;\n                                }\n\n                                .img-wrapper {\n                                    display: flex;\n\n                                    img {\n                                        margin: 0 auto;\n                                    }\n                                }\n\n                                .price {\n                                    text-align: center;\n\n                                    p {\n                                        margin: 0;\n                                        font-family: Grostesk-Bold, Arial, Helvetica, sans-serif;\n                                    }\n                                }\n\n                                .btn-wrapper {\n                                    text-align: center;\n\n                                    a {\n                                        color: var(--colorMain);\n                                        display: flex;\n                                        align-items: center;\n                                        justify-content: center;\n                                        gap: 10px;\n                                        font-family: Grostesk-Bold, Arial, Helvetica, sans-serif;\n                                    }\n                                }\n                            }\n                        }\n                    }\n\n                    .product-features {\n                        border-top: 2px solid var(--colorMain);\n                        padding: 20px 0 56px 0;\n\n                        .feature-head {\n                            margin: 0;\n                            color: #000;\n                            display: flex;\n                            cursor: pointer;\n                            justify-content: space-between;\n                            \n                            h3 {\n                                font-size: clamp(28px, 5vw, 38px);\n                                line-height: normal;\n                                text-transform: uppercase;\n                                font-weight: 700;\n                                line-height: 110%;\n                                font-family: \"Kostic - Roc Grotesk Condensed Medium\", sans-serif;\n                            }\n\n                            .toggle-icon {\n                                margin-right: 8px;\n                                display: inline-block;\n                                vertical-align: middle;\n                            }\n\n                            .plus-icon,\n                            .minus-icon {\n                                cursor: pointer;\n                            }\n                        }\n\n                        .feature-head.active {\n                            cursor: default;\n                        }\n\n                        .features {\n                            padding-top: 16px;\n\n                            &>*:not(:first-child) {\n                                border-top: 1px solid var(--colorMain);\n                            }\n\n                            .feature-wrapper {\n                                display: flex;\n                                gap: 64px;\n                                padding: 20px 0;\n                                justify-content: space-between;\n\n                                @media (max-width: 768px) {\n                                    flex-wrap: wrap;\n                                    gap: 14px;\n                                }\n\n                                .title-feature {\n                                    min-width: 250px;\n                                    font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                                    \/* 1200 -> 375 | 20 -> 16 *\/\n                                    font-size: clamp(16px, calc(1rem + ((1vw - 3.75px) * 0.4848)), 20px);\n                                    min-height: 0vw;\n                                    align-self: center;\n\n                                    @media (max-width: 768px) {\n                                        min-width: auto;\n                                        width: 100%;\n                                    }\n                                }\n\n                                .check-feature {\n                                    display: flex;\n                                    gap: 32px;\n                                    flex: 1;\n                                    justify-content: space-between;\n                                    max-width: 550px;\n\n                                    @media (max-width: 768px) {\n                                        width: 100%;\n                                    }\n\n                                    .slick-list {\n                                        flex: 1;\n                                    }\n\n                                    .slick-track {\n                                        display: flex;\n                                        gap: 32px;\n\n                                        @media (max-width: 768px) {\n                                            gap: 16px;\n                                        }\n                                    }\n\n                                    .slick-slide>div {\n                                        display: flex;\n                                    }\n\n                                    .checkmark {\n                                        flex: 1;\n                                        max-width: 25%;\n                                        display: flex !important;\n                                        justify-content: center;\n                                        margin: 0 auto;\n                                        align-items: center;\n\n                                        svg {\n                                            margin: 0 auto;\n                                        }\n\n                                        span {\n                                            font-size: 16px;\n                                            \/* 1200 -> 375 | 20 -> 16 *\/\n                                            font-size: 16px;\n                                            min-height: 0vw;\n                                            font-family: Grostesk-Regular, Arial, Helvetica, sans-serif;\n                                            white-space: nowrap;\n                                            text-align: center;\n                                        }\n                                    }\n                                    \n                                    .checkmark.text {\n                                        flex-direction: column;\n                                        gap: 0px;\n                                    }\n                                }\n                            }\n                        }\n                    }\n                }\n            }\n\n            #exploremore {\n                position: relative;\n\n                .inside {\n                    padding-bottom: 32px;\n\n                    @media (max-width: 768px) {\n                        & {\n                            padding-bottom: 16px;\n                        }\n                    }\n\n                    .inside-text {\n                        padding: 80px 6% 24px;\n\n                        @media (max-width: 768px) {\n                            & {\n                                padding: 48px 8% 24px;\n                            }\n                        }\n\n                        .title-exploremore {\n                            font-size: clamp(40px, 5vw, 72px);\n                            margin: 0;\n                            color: #000;\n                            line-height: normal;\n                            text-transform: uppercase;\n                            font-weight: 700;\n                            line-height: 110%;\n                            font-family: \"Kostic - Roc Grotesk Condensed Medium\", sans-serif;\n                        }\n\n                        .paragraph-exploremore {\n                            \/* 1200 -> 375 | 18 -> 16 *\/\n                            font-size: clamp(16px, calc(1rem + ((1vw - 3.75px) * 0.2424)), 18px);\n                            min-height: 0vw;\n                            \/* margin-top: 38px; *\/\n                            margin-bottom: 10px;\n                            font-family: var(--font-body);\n                            font-weight: 500;\n\n                            @media (max-width: 768px) {\n                                & {\n                                    margin-top: 24px;\n                                }\n                            }\n                        }\n                    }\n\n                    .product-lists {\n                        display: flex;\n                        margin-top: 18px;\n\n                        @media (max-width: 768px) {\n                            flex-wrap: wrap;\n                            margin-top: 0px;\n                        }\n\n                        &>*:not(:first-child) {\n                            border-left: 1px solid var(--colorMain);\n                        }\n\n                        .no-product-hightlight {\n                            display: flex;\n\n                            img {\n                                object-fit: cover;\n                            }\n                        }\n\n                        &>* {\n                            width: 25%;\n                            border-top: 1px solid var(--colorMain);\n                            border-bottom: 1px solid var(--colorMain);\n\n                            \/* &:hover {\n                                filter: grayscale(1);\n                            } *\/\n                            \n                            .img-wrapper {\n                                img {\n                                    margin: 0 auto;\n                                    display: block;\n                                }\n                            }\n                            \n                            .product-cta {\n                                text-align: center;\n                                margin-bottom: 32px;\n\n                                .act {\n                                    display: flex;\n                                    text-transform: uppercase;\n                                    align-items: center;\n                                    justify-content: center;\n                                    gap: 10px;\n                                    font-family: Grostesk-Bold, Arial, Helvetica, sans-serif;\n                                }\n                            }\n\n                            @media (max-width: 768px) {\n                                width: 50%;\n\n                                &:nth-child(odd) {\n                                    border-left: 0;\n                                }\n\n                                &:nth-child(even):not(:nth-child(2)),\n                                &:nth-child(odd):not(:nth-child(1)) {\n                                    border-top: 0;\n                                }\n                            }\n                        }\n                    }\n                }\n            }\n        }\n    <\/style>\n    <div class=\"bandbox\">\n        <section id=\"navbar-placeholder\">\n            <div class=\"nav-wrapper\">\n                <div class=\"logo-wrapper\"><\/div>\n                <div class=\"nav-links\">\n                    <a href=\"#introproducts\">Products<\/a>\n                    <a href=\"#introduction\">Features<\/a>\n                    <a href=\"#findyourfit\">Compare & Shop<\/a>\n                <\/div>\n            <\/div>\n        <\/section>\n        \n        <section id=\"banner\">\n            <div class=\"img-wrapper\">\n                <img fetchpriority=\"high\" decoding=\"async\" width=\"1400\" height=\"671\" src=\"\/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2.jpeg\" class=\"is-desktop\" alt=\"Bandbox Banner\" srcset=\"\/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2.jpeg 1400w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-300x144.jpeg 300w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-1024x491.jpeg 1024w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-768x368.jpeg 768w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-18x9.jpeg 18w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-364x174.jpeg 364w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-1140x546.jpeg 1140w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-600x288.jpeg 600w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-1200x575.jpeg 1200w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-175x84.jpeg 175w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-376x180.jpeg 376w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-284x136.jpeg 284w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-497x238.jpeg 497w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-576x276.jpeg 576w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-966x463.jpeg 966w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-462x221.jpeg 462w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-412x197.jpeg 412w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev2-721x346.jpeg 721w\" sizes=\"(max-width: 1400px) 100vw, 1400px\" \/>                <img decoding=\"async\" width=\"375\" height=\"180\" src=\"\/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1.webp\" class=\"is-mobile\" alt=\"Bandbox Banner\" srcset=\"\/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1.webp 375w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1-300x144.webp 300w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1-18x9.webp 18w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1-364x175.webp 364w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1-175x84.webp 175w, \/wp-content\/uploads\/2026\/04\/bandbox-banner-bgdesktop-rev1-284x136.webp 284w\" sizes=\"(max-width: 375px) 100vw, 375px\" \/>            <\/div>\n\n            <!-- <div class=\"text-wrapper\">\n                <h1 class=\"title-section\">BANDBOX <span class=\"mark is-mobile\">SOLO<\/span><\/h1>\n                <h2 class=\"subtitle-section\">Your AI-Powered bandmate.<\/h2>\n            <\/div> -->\n        <\/section>\n\n        <section id=\"trailer\">\n            <div class=\"decor\" aria-hidden=\"true\">\n                <img decoding=\"async\" width=\"1440\" height=\"312\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor.webp\" class=\"attachment-full size-full\" alt=\"Bandbox Trailer Decor\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor.webp 1440w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-300x65.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-1024x222.webp 1024w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-768x166.webp 768w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-18x4.webp 18w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-364x79.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-1140x247.webp 1140w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-600x130.webp 600w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-1200x260.webp 1200w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-175x38.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-376x81.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-497x108.webp 497w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-576x125.webp 576w, \/wp-content\/uploads\/2025\/11\/bandbox-trailer-decor-1335x289.webp 1335w\" sizes=\"(max-width: 1440px) 100vw, 1440px\" \/>            <\/div>\n            \n            <div class=\"video-wrapper\">\n                <iframe width=\"903\" height=\"508\" src=\"https:\/\/www.youtube.com\/embed\/Q9WT1T55Puk\" title=\"JBL Bandbox Trio\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n            <\/div>\n        <\/section>\n\n        <section id=\"introproducts\">\n            <div class=\"inside\">\n                <div class=\"title-wrapper\">\n                    <h2 class=\"title-section\">Join The Bandbox<\/h2>\n                <\/div>\n                <div class=\"partition-wrapper\">\n                                            <div class=\"part-side\">\n                            <div class=\"img-wrapper\">\n                                <img loading=\"lazy\" decoding=\"async\" width=\"1754\" height=\"1298\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3.webp\" class=\"attachment-full size-full\" alt=\"JBL Bandbox Solo\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3.webp 1754w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-300x222.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-1024x758.webp 1024w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-768x568.webp 768w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-1536x1137.webp 1536w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-16x12.webp 16w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-364x269.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-1140x844.webp 1140w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-600x444.webp 600w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-1205x892.webp 1205w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-904x669.webp 904w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-770x570.webp 770w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-175x130.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-376x278.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-497x368.webp 497w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-576x426.webp 576w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-solo-rev3-626x463.webp 626w\" sizes=\"(max-width: 1754px) 100vw, 1754px\" \/>                            <\/div>\n                            <div class=\"text-wrapper\">\n                                <div class=\"top-wrapper\">\n                                    <h3>JBL Bandbox Solo<\/h3>\n                                    <p>The JBL BandBox Solo lets you plug in and play along with the songs that inspired you to pick up an instrument. It is a compact practice amp and speaker with real-time AI that separates vocals and instruments, so you can solo, sing, or groove like you are already on stage. Bold JBL sound, built-in tools, you can easily bring it along anywhere.<\/p>\n                                <\/div>\n                                <div class=\"bottom-wrapper\">\n                                    <a href=\"\/en\/product\/jbl-bandbox-solo\/\" class=\"cta mycta\">Shop Now<\/a>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                                            <div class=\"part-side\">\n                            <div class=\"img-wrapper\">\n                                <img loading=\"lazy\" decoding=\"async\" width=\"1754\" height=\"1298\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3.webp\" class=\"attachment-full size-full\" alt=\"JBL Bandbox Trio\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3.webp 1754w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-300x222.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-1024x758.webp 1024w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-768x568.webp 768w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-1536x1137.webp 1536w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-16x12.webp 16w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-364x269.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-1140x844.webp 1140w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-600x444.webp 600w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-1205x892.webp 1205w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-904x669.webp 904w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-770x570.webp 770w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-175x130.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-376x278.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-497x368.webp 497w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-576x426.webp 576w, \/wp-content\/uploads\/2025\/11\/bandbox-introproducts-trio-rev3-626x463.webp 626w\" sizes=\"(max-width: 1754px) 100vw, 1754px\" \/>                            <\/div>\n                            <div class=\"text-wrapper\">\n                                <div class=\"top-wrapper\">\n                                    <h3>JBL Bandbox Trio<\/h3>\n                                    <p>JBL BandBox Trio is an AI-powered, all-in-one practice amp and speaker that separates vocals and instruments in real time, cranks out powerful, full-range JBL sound, comes loaded with a four-channel mixer, effects for guitar, vocals, and more. Built for all kinds of musicians to plug in, jam out, and level up\u2014anytime, anywhere.<\/p>\n                                <\/div>\n                                <div class=\"bottom-wrapper\">\n                                    <a href=\"\/en\/product\/jbl-bandbox-trio\/\" class=\"cta mycta\">Shop Now<\/a>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                                    <\/div>\n            <\/div>\n        <\/section>\n\n        <section id=\"test-music\">\n            <div class=\"inside\">\n                <div class=\"title-wrapper\">\n                    <h3 class=\"title-section\">Take The Mix Apart<\/h3>\n                <\/div>\n\n                <div class=\"music-wrapper stem-ai\">\n                    <div class=\"top-wrapper\">\n                        <h3 class=\"title-section\">\n                            STEM AI REAL-TIME VOCAL AND INSTRUMENT SEPARATION                        <\/h3>\n\n                        <div class=\"audio-container\">\n                            <label><input type=\"radio\" class=\"stem-ai\" name=\"audioOption1\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-original.mp3\" checked><span class=\"radio-bullet\"><\/span> Original Song<\/label>\n                            <label><input type=\"radio\" class=\"stem-ai\" name=\"audioOption1\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-guitar.mp3\"><span class=\"radio-bullet\"><\/span> Guitar Only<\/label>\n                            <label><input type=\"radio\" class=\"stem-ai\" name=\"audioOption1\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-guitarvocal.mp3\"><span class=\"radio-bullet\"><\/span> Guitar & Music Only<\/label>\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"bottom-wrapper\">\n                        <div class=\"img-wrapper\" data-active=\"1\">\n                            <img loading=\"lazy\" decoding=\"async\" width=\"304\" height=\"320\" src=\"\/wp-content\/uploads\/2025\/11\/sound-location-cafe-1.webp\" class=\"attachment-full size-full\" alt=\"Bandbox Music Player\" srcset=\"\/wp-content\/uploads\/2025\/11\/sound-location-cafe-1.webp 304w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-285x300.webp 285w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-11x12.webp 11w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-300x316.webp 300w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-166x175.webp 166w\" sizes=\"(max-width: 304px) 100vw, 304px\" \/>                        <\/div>\n                        <button class=\"play\" id=\"playBtn\"><\/button>\n                        <div class=\"timeline-wrapper\">\n                            <div id=\"waveform\"><\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"title-wrapper\">\n                    <h3 class=\"title-section\">A Better Way to<br> Explore Effects<\/h3>\n                <\/div>\n\n                <div class=\"music-wrapper effec\u2020s-explorer\">\n                    <div class=\"top-wrapper\">\n                        <h3 class=\"title-section\">\n                            GUITAR EFFETCS                        <\/h3>\n\n                        <div class=\"audio-container\" style=\"columns: 2;\">\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-feathered-blues.wav\" checked><span class=\"radio-bullet\"><\/span> Feathered Blues<\/label>\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-voodoo-hex.wav\"><span class=\"radio-bullet\"><\/span> Voodoo Hex<\/label>\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-industrial-metal.wav\"><span class=\"radio-bullet\"><\/span> Industrial Metal<\/label>\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-acoustic.wav\"><span class=\"radio-bullet\"><\/span> Acoustic<\/label>\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-studio-bass.wav\"><span class=\"radio-bullet\"><\/span> Studio Bass<\/label>\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-pop-clean.wav\"><span class=\"radio-bullet\"><\/span> Pop Clean<\/label>\n                            <label><input type=\"radio\" class=\"effects-explorer\" name=\"audioOption2\" value=\"\/wp-content\/uploads\/2025\/11\/bandbox-testmusic-soulful-verb.wav\"><span class=\"radio-bullet\"><\/span> Soulful Verb<\/label>\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"bottom-wrapper\">\n                        <div class=\"img-wrapper\" data-active=\"1\">\n                            <img loading=\"lazy\" decoding=\"async\" width=\"304\" height=\"320\" src=\"\/wp-content\/uploads\/2025\/11\/sound-location-cafe-1.webp\" class=\"attachment-full size-full\" alt=\"Bandbox Music Player\" srcset=\"\/wp-content\/uploads\/2025\/11\/sound-location-cafe-1.webp 304w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-285x300.webp 285w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-11x12.webp 11w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-300x316.webp 300w, \/wp-content\/uploads\/2025\/11\/sound-location-cafe-1-166x175.webp 166w\" sizes=\"(max-width: 304px) 100vw, 304px\" \/>                        <\/div>\n                        <button class=\"play\" id=\"playBtn2\"><\/button>\n                        <div class=\"timeline-wrapper\">\n                            <div id=\"waveform2\"><\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <section id=\"introduction\">\n            <div class=\"inside\">\n                <div class=\"title-wrapper\">\n                    <h2 class=\"title-section\">Take The Lead<\/h2>\n                <\/div>\n\n                <div class=\"content-wrapper\">\n                                            <div class=\"side-wrapper\">\n                            <div class=\"img-wrapper\">\n                                <img loading=\"lazy\" decoding=\"async\" width=\"562\" height=\"447\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai.webp\" class=\"attachment-full size-full\" alt=\"STEM AI REAL-TIME&lt;br&gt; VOCAL AND INSTRUMENT&lt;br&gt; SEPARATION\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai.webp 562w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai-300x239.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai-15x12.webp 15w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai-364x290.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai-175x139.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai-376x299.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-stemai-497x395.webp 497w\" sizes=\"(max-width: 562px) 100vw, 562px\" \/>                            <\/div>\n                            <div class=\"text-wrapper\">\n                                <h3 class=\"title-side\">STEM AI REAL-TIME<br> VOCAL AND INSTRUMENT<br> SEPARATION<\/h3>\n                                <p class=\"description-side\">Put yourself in the mix. Whatever the song, BandBox lets you jump right in. Stream any track and it will automatically split out the vocals, drums, and guitar in real time. Take the solo, front the band, or lock in with the groove. Whether you are sharpening your skills or just jamming for fun, BandBox makes every session feel like the real thing.*<\/p>\n                                                                    <p class=\"small-text\">*For non-commercial use only. It is your responsibility to know and abide by copyright laws in your country, and your use may require permission from the copyright holder(s). Review terms associated with use of prerecorded or licensed music, and streaming services, before using BandBox.<\/p>\n                                                            <\/div>\n                        <\/div>\n                                            <div class=\"side-wrapper\">\n                            <div class=\"img-wrapper\">\n                                <img loading=\"lazy\" decoding=\"async\" width=\"567\" height=\"451\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold.webp\" class=\"attachment-full size-full\" alt=\"BOLD JBL SOUND\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold.webp 567w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold-300x239.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold-15x12.webp 15w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold-364x290.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold-175x139.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold-376x299.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-bold-497x395.webp 497w\" sizes=\"(max-width: 567px) 100vw, 567px\" \/>                            <\/div>\n                            <div class=\"text-wrapper\">\n                                <h3 class=\"title-side\">BOLD JBL SOUND<\/h3>\n                                <p class=\"description-side\">It does not matter what you are practicing\u2014vocals, guitar, drums\u2014The JBL BandBox makes it sound great. Backed by decades of JBL audio know-how, it delivers full-range audio of clean, powerful sound with zero clipping or unwanted distortion.<\/p>\n                                                            <\/div>\n                        <\/div>\n                                            <div class=\"side-wrapper\">\n                            <div class=\"img-wrapper\">\n                                <img loading=\"lazy\" decoding=\"async\" width=\"562\" height=\"448\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps.webp\" class=\"attachment-full size-full\" alt=\"LEGENDARY GUITAR AMPS&lt;br&gt; AND EFFECTS MODELS\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps.webp 562w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps-300x239.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps-15x12.webp 15w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps-364x290.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps-175x140.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps-376x300.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-guitaramps-497x396.webp 497w\" sizes=\"(max-width: 562px) 100vw, 562px\" \/>                            <\/div>\n                            <div class=\"text-wrapper\">\n                                <h3 class=\"title-side\">LEGENDARY GUITAR AMPS<br> AND EFFECTS MODELS<\/h3>\n                                <p class=\"description-side\">JBL BandBox gives you a pedalboard\u2019s worth of effects and amp stack. It comes loaded with classic effects like phaser, chorus, tremolo, and reverb, plus vintage and modern amp models to match your mood. Everyone can lock in their go-to sound or try something new.<\/p>\n                                                            <\/div>\n                        <\/div>\n                                            <div class=\"side-wrapper\">\n                            <div class=\"img-wrapper\">\n                                <img loading=\"lazy\" decoding=\"async\" width=\"563\" height=\"448\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools.webp\" class=\"attachment-full size-full\" alt=\"BUILT-IN PRACTICE TOOLS\" srcset=\"\/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools.webp 563w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools-300x239.webp 300w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools-15x12.webp 15w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools-364x290.webp 364w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools-175x139.webp 175w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools-376x299.webp 376w, \/wp-content\/uploads\/2025\/11\/bandbox-introduction-practicetools-497x395.webp 497w\" sizes=\"(max-width: 563px) 100vw, 563px\" \/>                            <\/div>\n                            <div class=\"text-wrapper\">\n                                <h3 class=\"title-side\">BUILT-IN PRACTICE TOOLS<\/h3>\n                                <p class=\"description-side\">The JBL BandBox comes with all the tools your old practice routine wishes it had. Tuner? Check. Metronome? A full-featured drum machine with presets and a looper so you can mimic a full band too. Singing a little out of your range? Drop the key and pretend it was always meant to be yours. Smarter practice, better jams, and way fewer excuses.<\/p>\n                                                            <\/div>\n                        <\/div>\n                    \n                    <div class=\"btn-wrapper\">\n                        <a href=\"\/en\/product-category\/bandbox\/\" class=\"cta mycta\">Shop Now<\/a>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <section id=\"findyourfit\">\n            <div class=\"inside\">\n                <div class=\"product-highlight\">\n                    <h2 class=\"title-findyourfit\">\n                        Find your Fit                    <\/h2>\n                    <div class=\"product-list\" id=\"product-list\">\n                                                    <div class=\"product-comparison\">\n                                <h3 class=\"title-product-comparison\">\n                                    JBL BandBox Solo                                <\/h3>\n                                <div class=\"img-wrapper\">\n                                    <img decoding=\"async\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-findyourfit-solo.webp\" alt=\"JBL BandBox Solo Thumbnail\">\n                                <\/div>\n\n                                <div class=\"price\">\n                                    <p class=\"price-tag\">\n                                                                            <\/p>\n                                <\/div>\n\n                                <div class=\"btn-wrapper\">\n                                    <a href=\"\/en\/product\/jbl-bandbox-solo\/\" class=\"cta btn-comparison\">\n                                        <span>View details<\/span>\n                                        <svg width=\"16\" height=\"17\" viewbox=\"0 0 16 17\" fill=\"none\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path d=\"M8.66671 12.8002L13.3334 8.13356L8.66671 3.4667\" stroke=\"currentColor\"\n                                                stroke-width=\"2\" stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                                            <path d=\"M12.0001 8.13281L2.66679 8.13281\" stroke=\"currentColor\" stroke-width=\"2\"\n                                                stroke-miterlimit=\"10\" stroke-linecap=\"square\" stroke-linejoin=\"round\" \/>\n                                        <\/svg>\n                                    <\/a>\n                                <\/div>\n                            <\/div>\n                                                    <div class=\"product-comparison\">\n                                <h3 class=\"title-product-comparison\">\n                                    JBL BandBox Trio                                <\/h3>\n                                <div class=\"img-wrapper\">\n                                    <img decoding=\"async\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-findyourfit-trio.webp\" alt=\"JBL BandBox Trio Thumbnail\">\n                                <\/div>\n\n                                <div class=\"price\">\n                                    <p class=\"price-tag\">\n                                                                            <\/p>\n                                <\/div>\n\n                                <div class=\"btn-wrapper\">\n                                    <a href=\"\/en\/product\/jbl-bandbox-trio\/\" class=\"cta btn-comparison\">\n                                        <span>View details<\/span>\n                                        <svg width=\"16\" height=\"17\" viewbox=\"0 0 16 17\" fill=\"none\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path d=\"M8.66671 12.8002L13.3334 8.13356L8.66671 3.4667\" stroke=\"currentColor\"\n                                                stroke-width=\"2\" stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                                            <path d=\"M12.0001 8.13281L2.66679 8.13281\" stroke=\"currentColor\" stroke-width=\"2\"\n                                                stroke-miterlimit=\"10\" stroke-linecap=\"square\" stroke-linejoin=\"round\" \/>\n                                        <\/svg>\n                                    <\/a>\n                                <\/div>\n                            <\/div>\n                                            <\/div>\n                    <!-- <div class=\"is-mobile\">\n                        <button class=\"arrow-left\">\n                            <svg width=\"37\" height=\"38\" viewBox=\"0 0 37 38\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                <path d=\"M24.6667 30.275L13.875 19.4833L24.6667 8.69118\" stroke=\"black\" stroke-width=\"4\"\n                                    stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                            <\/svg>\n                        <\/button>\n\n                        <button class=\"arrow-right\">\n                            <svg width=\"37\" height=\"38\" viewBox=\"0 0 37 38\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                <path d=\"M12.3333 30.275L23.125 19.4833L12.3333 8.69118\" stroke=\"black\" stroke-width=\"4\"\n                                    stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                            <\/svg>\n                        <\/button>\n                    <\/div> -->\n                <\/div>\n\n                <div class=\"product-features\">\n                    <div class=\"feature-head active\">\n                        <h3>Features<\/h3>\n                        <span><\/span>\n                    <\/div>\n                    <div class=\"features\">\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Output Power                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        <span>18W<\/span>                                    <\/div>\n                                                                    <div class=\"checkmark\">\n                                        <span>135W<\/span>                                    <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Stem AI Real-time Vocal and Instrument Separation                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Legendary Guitar Amp and Effect Models                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Built-in Tools<br> (Tuner, Metronome, Looper, Drum Machine, Pitch Shifter)\n                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Battery Playtime                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        <span>Up to 6 hours<\/span>                                    <\/div>\n                                                                    <div class=\"checkmark\">\n                                        <span>Up to 10 hours<\/span>                                    <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Swappable Battery                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark text\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <line x1=\"12\" y1=\"12\" x2=\"36\" y2=\"36\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\"\/>\n                                                <line x1=\"36\" y1=\"12\" x2=\"12\" y2=\"36\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                                    <div class=\"checkmark text\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                            <span>(JBL Battery 400)<\/span>\n                                                                            <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                Auracast (Music Playback)\n                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                            <\/div>\n                        <\/div>\n                        <div class=\"feature-wrapper\">\n                            <div class=\"title-feature\">\n                                One App\n                            <\/div>\n                            <div class=\"check-feature\">\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                                    <div class=\"checkmark\">\n                                        \n                                            <svg width=\"48\" height=\"48\" viewbox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M14 24 L22 32 L34 16\" stroke=\"black\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n                                            <\/svg>\n                                                                            <\/div>\n                                                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <section id=\"exploremore\">\n            <div class=\"inside\">\n                <div class=\"inside-text\">\n                    <h2 class=\"title-exploremore\">Explore Other JBL Products<\/h2>\n                <\/div>\n\n                <div class=\"product-lists\">\n                                                                        <a href=\"\/en\/product\/jbl-clip-5\/\" title=\"JBL Clip 5\" class=\"product-hightlight\">\n                                <div class=\"img-wrapper\">\n                                    <img decoding=\"async\" src=\"\/wp-content\/uploads\/2025\/11\/jbl-clip-5-hero-grey-48150-x5-1.webp\" alt=\"JBL Clip 5 Thumbnail\">\n                                <\/div>\n                                <div class=\"product-cta\">\n                                    <span class=\"act\">\n                                        <span>\n                                            JBL Clip 5                                        <\/span>\n                                        <svg width=\"16\" height=\"17\" viewbox=\"0 0 16 17\" fill=\"none\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path d=\"M8.66671 12.8002L13.3334 8.13356L8.66671 3.4667\" stroke=\"currentColor\"\n                                                stroke-width=\"2\" stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                                            <path d=\"M12.0001 8.13281L2.66679 8.13281\" stroke=\"currentColor\" stroke-width=\"2\"\n                                                stroke-miterlimit=\"10\" stroke-linecap=\"square\" stroke-linejoin=\"round\" \/>\n                                        <\/svg>\n                                    <\/span>\n                                <\/div>\n                            <\/a>\n                                                                                                <a href=\"\/en\/product\/jbl-go-4\/\" title=\"JBL Go 4\" class=\"product-hightlight\">\n                                <div class=\"img-wrapper\">\n                                    <img decoding=\"async\" src=\"\/wp-content\/uploads\/2025\/11\/jbl-go-4-hero-sand-49712-x2-1-2.webp\" alt=\"JBL Go 4 Thumbnail\">\n                                <\/div>\n                                <div class=\"product-cta\">\n                                    <span class=\"act\">\n                                        <span>\n                                            JBL Go 4                                        <\/span>\n                                        <svg width=\"16\" height=\"17\" viewbox=\"0 0 16 17\" fill=\"none\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path d=\"M8.66671 12.8002L13.3334 8.13356L8.66671 3.4667\" stroke=\"currentColor\"\n                                                stroke-width=\"2\" stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                                            <path d=\"M12.0001 8.13281L2.66679 8.13281\" stroke=\"currentColor\" stroke-width=\"2\"\n                                                stroke-miterlimit=\"10\" stroke-linecap=\"square\" stroke-linejoin=\"round\" \/>\n                                        <\/svg>\n                                    <\/span>\n                                <\/div>\n                            <\/a>\n                                                                                                <a href=\"\/en\/product\/jbl-authentics-300\/\" title=\"JBL Authentics 300\" class=\"product-hightlight\">\n                                <div class=\"img-wrapper\">\n                                    <img decoding=\"async\" src=\"\/wp-content\/uploads\/2025\/11\/jbl-authentics-300-hero-42814-x4-1-1.webp\" alt=\"JBL Authentics 300 Thumbnail\">\n                                <\/div>\n                                <div class=\"product-cta\">\n                                    <span class=\"act\">\n                                        <span>\n                                            JBL Authentics 300                                        <\/span>\n                                        <svg width=\"16\" height=\"17\" viewbox=\"0 0 16 17\" fill=\"none\"\n                                            xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                            <path d=\"M8.66671 12.8002L13.3334 8.13356L8.66671 3.4667\" stroke=\"currentColor\"\n                                                stroke-width=\"2\" stroke-miterlimit=\"10\" stroke-linecap=\"square\" \/>\n                                            <path d=\"M12.0001 8.13281L2.66679 8.13281\" stroke=\"currentColor\" stroke-width=\"2\"\n                                                stroke-miterlimit=\"10\" stroke-linecap=\"square\" stroke-linejoin=\"round\" \/>\n                                        <\/svg>\n                                    <\/span>\n                                <\/div>\n                            <\/a>\n                                                                                                <div class=\"no-product-hightlight\">\n                                <img decoding=\"async\" src=\"\/wp-content\/uploads\/2025\/11\/bandbox-exploremore-img.webp\" alt=\"JBL Highlight\">\n                            <\/div>\n                                                            <\/div>\n            <\/div>\n        <\/section>\n    <\/div>\n    <script type=\"text\/javascript\" src=\"\/\/cdn.jsdelivr.net\/gh\/kenwheeler\/slick@1.8.1\/slick\/slick.min.js\" defer><\/script>\n    <script src=\"https:\/\/unpkg.com\/wavesurfer.js@7.11.1\/dist\/wavesurfer.min.js\" defer><\/script>\n    \n    <script>\n        jQuery(document).ready(function () {\n            jQuery('#product-list').slick({\n                slidesToShow: 2,\n                slidesToScroll: 1,\n                arrows: false,\n                autoplay: false,\n                infinite: false,\n                dots: false,\n                responsive: [\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 2,\n                            slidesToScroll: 1,\n                            arrows: false,\n                            infinite: false,\n                        }\n                    }\n                ],\n            });\n\n            jQuery('.feature-head').click(function () {\n                \/\/ Hapus kelas 'active' dari semua elemen yang bukan elemen yang diklik\n                jQuery('.feature-head').not(this).removeClass('active');\n                \n                \/\/ Sembunyikan semua elemen 'features' selain yang berhubungan dengan elemen yang diklik\n                jQuery('.features').not(jQuery(this).next()).css('visibility', 'hidden').css('height', '0');\n                \n                if (jQuery(this).next('.features').css('visibility') === 'hidden') {\n                    jQuery(this).next('.features').css('visibility', 'visible').css('height', 'auto');\n                } else {\n                    jQuery(this).next('.features').css('visibility', 'hidden').css('height', '0');\n                }\n\n                \/\/ Toggle kelas 'active' pada elemen yang diklik\n                jQuery(this).toggleClass('active');\n\n                \/\/ Toggle ikon plus\/minus pada elemen yang diklik\n                jQuery('.plus-icon', this).toggle(!jQuery(this).hasClass('active'));\n                jQuery('.minus-icon', this).toggle(jQuery(this).hasClass('active'));\n\n                \/\/ Set ulang ikon plus\/minus untuk semua elemen yang bukan elemen yang diklik\n                jQuery('.feature-head').not(this).each(function() {\n                    jQuery('.plus-icon', this).show();  \n                    jQuery('.minus-icon', this).hide();  \n                });\n\n                \/\/ Set ulang posisi Slick carousel setelah perubahan tampilan\n                setTimeout(() => {\n                    jQuery('#product-list').slick('setPosition');\n                }, 1000);\n            });\n        });\n    <\/script>\n    <script>\n        document.addEventListener('DOMContentLoaded', function () {\n            \/\/ hanya radio yang terkait audio\n            const allAudioRadios = document.querySelectorAll('input[name=\"audioOption1\"], input[name=\"audioOption2\"]');\n\n            \/\/ === GRUP 1 ===\n            const playBtn = document.getElementById('playBtn');\n            let wavesurfer = WaveSurfer.create({\n                container: '#waveform',\n                waveColor: '#fff',\n                progressColor: '#333',\n                cursorColor: '#fff',\n                height: 80,\n                barWidth: 2,\n                barGap: 1,\n                barRadius: 2,\n                url: document.querySelector('input[name=\"audioOption1\"].stem-ai:checked').value\n            });\n\n            playBtn.addEventListener('click', () => wavesurfer.playPause());\n\n            wavesurfer.on('play', () => {\n                playBtn.classList.remove('play');\n                playBtn.classList.add('pause');\n            });\n            wavesurfer.on('pause', () => {\n                playBtn.classList.remove('pause');\n                playBtn.classList.add('play');\n            });\n            wavesurfer.on('finish', () => {\n                playBtn.classList.remove('pause');\n                playBtn.classList.add('play');\n            });\n\n            \/\/ Disable hanya radio audio saat loading\n            wavesurfer.on('loading', () => {\n                allAudioRadios.forEach(r => r.disabled = true);\n                playBtn.classList.add('loading');\n            });\n\n            wavesurfer.on('ready', () => {\n                allAudioRadios.forEach(r => r.disabled = false);\n                playBtn.classList.remove('loading');\n            });\n\n            document.querySelectorAll('input[name=\"audioOption1\"].stem-ai').forEach((radio) => {\n                radio.addEventListener('change', (e) => {\n                    const newUrl = e.target.value;\n                    wavesurfer.stop();\n                    playBtn.classList.remove('pause');\n                    playBtn.classList.add('play');\n                    wavesurfer.load(newUrl);\n                });\n            });\n\n\n            \/\/ === GRUP 2 ===\n            const playBtn2 = document.getElementById('playBtn2');\n            let wavesurfer2 = WaveSurfer.create({\n                container: '#waveform2',\n                waveColor: '#fff',\n                progressColor: '#333',\n                cursorColor: '#fff',\n                height: 80,\n                barWidth: 2,\n                barGap: 1,\n                barRadius: 2,\n                url: document.querySelector('input[name=\"audioOption2\"].effects-explorer:checked').value\n            });\n\n            playBtn2.addEventListener('click', () => wavesurfer2.playPause());\n\n            wavesurfer2.on('play', () => {\n                playBtn2.classList.remove('play');\n                playBtn2.classList.add('pause');\n            });\n            wavesurfer2.on('pause', () => {\n                playBtn2.classList.remove('pause');\n                playBtn2.classList.add('play');\n            });\n            wavesurfer2.on('finish', () => {\n                playBtn2.classList.remove('pause');\n                playBtn2.classList.add('play');\n            });\n\n            wavesurfer2.on('loading', () => {\n                allAudioRadios.forEach(r => r.disabled = true);\n                playBtn2.classList.add('loading');\n            });\n\n            wavesurfer2.on('ready', () => {\n                allAudioRadios.forEach(r => r.disabled = false);\n                playBtn2.classList.remove('loading');\n            });\n\n            document.querySelectorAll('input[name=\"audioOption2\"].effects-explorer').forEach((radio) => {\n                radio.addEventListener('change', (e) => {\n                    const newUrl = e.target.value;\n                    wavesurfer2.stop();\n                    playBtn2.classList.remove('pause');\n                    playBtn2.classList.add('play');\n                    wavesurfer2.load(newUrl);\n                });\n            });\n\n            document.querySelectorAll('#navbar-placeholder .nav-wrapper .nav-links a[href^=\"#\"]').forEach(link => {\n                link.addEventListener('click', function (e) {\n                    e.preventDefault();\n\n                    const targetId = this.getAttribute('href').substring(1);\n                    const targetEl = document.getElementById(targetId);\n\n                    if (targetEl) {\n                        targetEl.scrollIntoView({ behavior: 'smooth', block: 'start' });\n                    }\n                });\n            });\n        });\n\n        document.addEventListener('DOMContentLoaded', function () {\n            const customNav = document.querySelector('#navbar-placeholder');\n            if (!customNav) return;\n\n            function getHeight(el) {\n                return el ? el.getBoundingClientRect().height : 0;\n            }\n\n            function stickBelowHeader() {\n                const topStrip   = document.querySelector('.header-topstrip');\n                const pencilNav  = document.querySelector('.pencil-nav');\n                const mainHeader = document.querySelector('header');\n\n                const totalHeight = getHeight(topStrip) + getHeight(pencilNav) + getHeight(mainHeader);\n                customNav.style.position = 'sticky';\n                customNav.style.top      = totalHeight + 'px';\n                customNav.style.zIndex   = '4';\n            }\n\n            function waitForElements(selectors, callback, timeout = 3000) {\n                const start = Date.now();\n\n                const interval = setInterval(() => {\n                    const allReady = selectors.every(sel => {\n                        const el = document.querySelector(sel);\n                        return el && el.getBoundingClientRect().height > 0; \/\/ pastikan sudah punya tinggi\n                    });\n\n                    if (allReady) {\n                        clearInterval(interval);\n                        callback();\n                    }\n\n                    \/\/ fallback: lewat 3 detik, jalankan saja\n                    if (Date.now() - start >= timeout) {\n                        clearInterval(interval);\n                        callback();\n                    }\n                }, 100); \/\/ cek setiap 100ms\n            }\n\n            waitForElements(\n                ['.header-topstrip', '.pencil-nav', 'header'],\n                function () {\n                    stickBelowHeader();\n                    window.addEventListener('resize', stickBelowHeader);\n                    window.addEventListener('scroll', stickBelowHeader);\n                }\n            );\n        });\n        <\/script>\n    \t\t<div class=\"elementor-shortcode\"><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":88637,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/full-width.php","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-114660","page","type-page","status-publish","hentry","no-post-thumbnail"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Bandbox Solo Trio AI Amplifier<\/title>\n<meta name=\"robots\" content=\"noindex, nofollow\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Bandbox Solo Trio AI Amplifier\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/\" \/>\n<meta property=\"og:site_name\" content=\"JBL Store\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/JBLAudioIndonesia\/\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-18T10:00:18+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/\",\"url\":\"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/\",\"name\":\"Bandbox Solo Trio AI Amplifier - JBL Store\",\"isPartOf\":{\"@id\":\"https:\/\/jblstore.co.id\/en\/#website\"},\"datePublished\":\"2025-11-18T09:59:15+00:00\",\"dateModified\":\"2025-11-18T10:00:18+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jblstore.co.id\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Bandbox Solo Trio AI Amplifier\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jblstore.co.id\/en\/#website\",\"url\":\"https:\/\/jblstore.co.id\/en\/\",\"name\":\"JBL Store\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/jblstore.co.id\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jblstore.co.id\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jblstore.co.id\/en\/#organization\",\"name\":\"JBL Store\",\"url\":\"https:\/\/jblstore.co.id\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jblstore.co.id\/en\/#\/schema\/logo\/image\/\",\"url\":\"\/wp-content\/uploads\/2025\/11\/cropped-logo-jbl-1536x1131_cropped.png\",\"contentUrl\":\"\/wp-content\/uploads\/2025\/11\/cropped-logo-jbl-1536x1131_cropped.png\",\"width\":70,\"height\":52,\"caption\":\"JBL Store\"},\"image\":{\"@id\":\"https:\/\/jblstore.co.id\/en\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/JBLAudioIndonesia\/\",\"https:\/\/www.instagram.com\/jblindonesia\/\",\"https:\/\/www.youtube.com\/c\/JBLIndonesia\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Bandbox Solo Trio AI Amplifier","robots":{"index":"noindex","follow":"nofollow"},"og_locale":"en_US","og_type":"article","og_title":"Bandbox Solo Trio AI Amplifier","og_url":"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/","og_site_name":"JBL Store","article_publisher":"https:\/\/www.facebook.com\/JBLAudioIndonesia\/","article_modified_time":"2025-11-18T10:00:18+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/","url":"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/","name":"Bandbox Solo Trio AI Amplifier - JBL Store","isPartOf":{"@id":"https:\/\/jblstore.co.id\/en\/#website"},"datePublished":"2025-11-18T09:59:15+00:00","dateModified":"2025-11-18T10:00:18+00:00","breadcrumb":{"@id":"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jblstore.co.id\/en\/bandbox-solo-trio-ai-amplifier\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jblstore.co.id\/"},{"@type":"ListItem","position":2,"name":"Bandbox Solo Trio AI Amplifier"}]},{"@type":"WebSite","@id":"https:\/\/jblstore.co.id\/en\/#website","url":"https:\/\/jblstore.co.id\/en\/","name":"JBL Store","description":"","publisher":{"@id":"https:\/\/jblstore.co.id\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jblstore.co.id\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jblstore.co.id\/en\/#organization","name":"JBL Store","url":"https:\/\/jblstore.co.id\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jblstore.co.id\/en\/#\/schema\/logo\/image\/","url":"\/wp-content\/uploads\/2025\/11\/cropped-logo-jbl-1536x1131_cropped.png","contentUrl":"\/wp-content\/uploads\/2025\/11\/cropped-logo-jbl-1536x1131_cropped.png","width":70,"height":52,"caption":"JBL Store"},"image":{"@id":"https:\/\/jblstore.co.id\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/JBLAudioIndonesia\/","https:\/\/www.instagram.com\/jblindonesia\/","https:\/\/www.youtube.com\/c\/JBLIndonesia"]}]}},"_links":{"self":[{"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/pages\/114660","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/users\/88637"}],"replies":[{"embeddable":true,"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/comments?post=114660"}],"version-history":[{"count":4,"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/pages\/114660\/revisions"}],"predecessor-version":[{"id":115005,"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/pages\/114660\/revisions\/115005"}],"wp:attachment":[{"href":"https:\/\/jblstore.co.id\/en\/wp-json\/wp\/v2\/media?parent=114660"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}