Chat with our AI assistant<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n \/* All styles below are scoped under .card-ai only \u2014 variables are\n declared on the card itself, not :root, so this card can safely\n sit next to the WhatsApp and Email cards without any bleed. *\/\n\n .card-ai {\n --card-bg: #512e35;\n --badge-bg: #65d071;\n --badge-text: #ffffff;\n --heading: #ffffff;\n --body-text: #e7dde1;\n --arrow-color: #568365;\n\n box-sizing: border-box;\n flex: 1 1 280px;\n width: 100%;\n max-width: 340px;\n min-width: 0;\n color: var(--body-text);\n display: flex;\n flex-direction: column;\n gap: 16px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n }\n\n .card-ai *,\n .card-ai *::before,\n .card-ai *::after {\n box-sizing: border-box;\n }\n\n .card-ai__badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n align-self: flex-start;\n background: var(--badge-bg);\n color: var(--badge-text);\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.68rem;\n font-weight: 700;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n padding: 7px 16px 7px 13px;\n border-radius: 999px;\n }\n\n .card-ai__badge svg {\n width: 11px;\n height: 11px;\n flex-shrink: 0;\n }\n\n .card-ai h2 {\n margin: 0;\n color: var(--heading);\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: clamp(1.3rem, 2.2vw, 1.55rem);\n font-weight: 700;\n line-height: 1.25;\n }\n\n .card-ai__desc {\n margin: 0;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.85rem;\n line-height: 1.6;\n color: var(--body-text);\n opacity: 0.92;\n }\n\n .card-ai__list {\n list-style: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n .card-ai__list li {\n display: flex;\n align-items: flex-start;\n gap: 10px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.82rem;\n line-height: 1.5;\n }\n\n .card-ai__list .arrow {\n color: var(--arrow-color);\n font-size: 0.88rem;\n line-height: 1.5;\n flex-shrink: 0;\n }\n\n @media (max-width: 480px) {\n .card-ai {\n max-width: 100%;\n gap: 14px;\n }\n\n .card-ai h2 {\n font-size: 1.25rem;\n }\n\n .card-ai__desc,\n .card-ai__list li {\n font-size: 0.8rem;\n }\n\n .card-ai__list {\n gap: 10px;\n }\n }\n\n \/* Standalone preview only \u2014 remove this whole block when dropping the\n card into your existing 3-box flex row on the live site. *\/\n body.standalone-preview {\n margin: 0;\n min-height: 100vh;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #512e35;\n padding: 40px 20px;\n box-sizing: border-box;\n }\n<\/style>\n<\/head>\n<body class=\"standalone-preview\">\n\n <div class=\"card-ai\">\n <span class=\"card-ai__badge\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n <path d=\"M12 1.5l2.9 6.6 7.1.6-5.4 4.7 1.7 6.9L12 16.6l-6.3 3.7 1.7-6.9L2 9.7l7.1-.6L12 1.5z\"\/>\n <\/svg>\n Recommended\n <\/span>\n\n <h2>Chat with our AI assistant<\/h2>\n\n <p class=\"card-ai__desc\">\n Ask anything about our portfolio, service model, or whether B.you is the right fit, instantly, in plain language, 24\/7.\n <\/p>\n\n <ul class=\"card-ai__list\">\n <li><span class=\"arrow\">\u2192<\/span><span>Product and portfolio questions (formats, specs, certs)<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Fit assessment, are you the right buyer profile?<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Private label eligibility and process overview<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Pilot and onboarding flow explained<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Routes you to a human when you're ready<\/span><\/li>\n <\/ul>\n <\/div>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e9e447b elementor-align-center elementor-widget elementor-widget-button\" data-id=\"e9e447b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-far-comments\" viewBox=\"0 0 576 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M532 386.2c27.5-27.1 44-61.1 44-98.2 0-80-76.5-146.1-176.2-157.9C368.3 72.5 294.3 32 208 32 93.1 32 0 103.6 0 192c0 37 16.5 71 44 98.2-15.3 30.7-37.3 54.5-37.7 54.9-6.3 6.7-8.1 16.5-4.4 25 3.6 8.5 12 14 21.2 14 53.5 0 96.7-20.2 125.2-38.8 9.2 2.1 18.7 3.7 28.4 4.9C208.1 407.6 281.8 448 368 448c20.8 0 40.8-2.4 59.8-6.8C456.3 459.7 499.4 480 553 480c9.2 0 17.5-5.5 21.2-14 3.6-8.5 1.9-18.3-4.4-25-.4-.3-22.5-24.1-37.8-54.8zm-392.8-92.3L122.1 305c-14.1 9.1-28.5 16.3-43.1 21.4 2.7-4.7 5.4-9.7 8-14.8l15.5-31.1L77.7 256C64.2 242.6 48 220.7 48 192c0-60.7 73.3-112 160-112s160 51.3 160 112-73.3 112-160 112c-16.5 0-33-1.9-49-5.6l-19.8-4.5zM498.3 352l-24.7 24.4 15.5 31.1c2.6 5.1 5.3 10.1 8 14.8-14.6-5.1-29-12.3-43.1-21.4l-17.1-11.1-19.9 4.6c-16 3.7-32.5 5.6-49 5.6-54 0-102.2-20.1-131.3-49.7C338 339.5 416 272.9 416 192c0-3.4-.4-6.7-.7-10C479.7 196.5 528 238.8 528 288c0 28.7-16.2 50.6-29.7 64z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Start chatting<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3e6aabd elementor-widget elementor-widget-text-editor\" data-id=\"3e6aabd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Available 24\/7 \u00b7 No forms \u00b7 No wait<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-db114eb e-con e-atomic-element e-flexbox-base e-db114eb-44b1b62 \" data-id=\"db114eb\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"db114eb\" data-e-type=\"e-flexbox\" data-id=\"db114eb\">\n \t\t<div class=\"elementor-element elementor-element-a6ac9e2 elementor-widget elementor-widget-html\" data-id=\"a6ac9e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>WhatsApp our team<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n \/* All styles below are scoped under .card-whatsapp only \u2014 variables\n are declared on the card itself, not :root, so this card can safely\n sit next to the AI Assistant and Email cards without any bleed. *\/\n\n .card-whatsapp {\n --card-bg: #512e35;\n --badge-bg: #65d071;\n --badge-text: #ffffff;\n --heading: #ffffff;\n --body-text: #e7dde1;\n --arrow-color: #568365;\n\n box-sizing: border-box;\n flex: 1 1 280px;\n width: 100%;\n max-width: 340px;\n min-width: 0;\n color: var(--body-text);\n display: flex;\n flex-direction: column;\n gap: 16px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n }\n\n .card-whatsapp *,\n .card-whatsapp *::before,\n .card-whatsapp *::after {\n box-sizing: border-box;\n }\n\n .card-whatsapp__badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n align-self: flex-start;\n background: var(--badge-bg);\n color: var(--badge-text);\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.68rem;\n font-weight: 700;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n padding: 7px 16px 7px 13px;\n border-radius: 999px;\n }\n\n .card-whatsapp__badge svg {\n width: 11px;\n height: 11px;\n flex-shrink: 0;\n }\n\n .card-whatsapp h2 {\n margin: 0;\n color: var(--heading);\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: clamp(1.3rem, 2.2vw, 1.55rem);\n font-weight: 700;\n line-height: 1.25;\n }\n\n .card-whatsapp__desc {\n margin: 0;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.85rem;\n line-height: 1.6;\n color: var(--body-text);\n opacity: 0.92;\n }\n\n .card-whatsapp__list {\n list-style: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n .card-whatsapp__list li {\n display: flex;\n align-items: flex-start;\n gap: 10px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.82rem;\n line-height: 1.5;\n }\n\n .card-whatsapp__list .arrow {\n color: var(--arrow-color);\n font-size: 0.88rem;\n line-height: 1.5;\n flex-shrink: 0;\n }\n\n @media (max-width: 480px) {\n .card-whatsapp {\n max-width: 100%;\n gap: 14px;\n }\n\n .card-whatsapp h2 {\n font-size: 1.25rem;\n }\n\n .card-whatsapp__desc,\n .card-whatsapp__list li {\n font-size: 0.8rem;\n }\n\n .card-whatsapp__list {\n gap: 10px;\n }\n }\n\n \/* Standalone preview only \u2014 remove this whole block when dropping the\n card into your existing 3-box flex row on the live site. *\/\n body.standalone-preview {\n margin: 0;\n min-height: 100vh;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #512e35;\n padding: 40px 20px;\n box-sizing: border-box;\n }\n<\/style>\n<\/head>\n<body class=\"standalone-preview\">\n\n <div class=\"card-whatsapp\">\n <span class=\"card-whatsapp__badge\">\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n <path d=\"M13 2L3 14h7l-1 8 11-13h-7l1-7z\"\/>\n <\/svg>\n Instant\n <\/span>\n\n <h2>WhatsApp our team<\/h2>\n\n <p class=\"card-whatsapp__desc\">\n Start a conversation on WhatsApp. Our assistant is available there too, and the team follows up when a commercial conversation is ready to happen.\n <\/p>\n\n <ul class=\"card-whatsapp__list\">\n <li><span class=\"arrow\">\u2192<\/span><span>Assistant available instantly, team follows up<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Scheduling a qualification call<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Existing partner support and logistics<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Urgent supply or delivery questions<\/span><\/li>\n <\/ul>\n <\/div>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-418fdc9 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"418fdc9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/wa.me\/5511912156667\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fab-whatsapp\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Open WhatsApp<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c0f144d elementor-widget elementor-widget-text-editor\" data-id=\"c0f144d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>+55 11 91215 6667 \u00b7 US business hours<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-f0f0f70 e-con e-atomic-element e-flexbox-base e-f0f0f70-53b3f0a \" data-id=\"f0f0f70\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"f0f0f70\" data-e-type=\"e-flexbox\" data-id=\"f0f0f70\">\n \t\t<div class=\"elementor-element elementor-element-c500d33 elementor-widget elementor-widget-html\" data-id=\"c500d33\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Email our commercial team<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n \/* All styles below are scoped under .card-email only \u2014 variables are\n declared on the card itself, not :root, so this card can safely\n sit next to the AI Assistant and WhatsApp cards without any bleed. *\/\n\n .card-email {\n --card-bg: #512e35;\n --badge-bg: #68404c;\n --badge-text: #e7dde1;\n --heading: #ffffff;\n --body-text: #e7dde1;\n --arrow-color: #568365;\n\n box-sizing: border-box;\n flex: 1 1 280px;\n width: 100%;\n max-width: 340px;\n min-width: 0;\n color: var(--body-text);\n display: flex;\n flex-direction: column;\n gap: 16px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n }\n\n .card-email *,\n .card-email *::before,\n .card-email *::after {\n box-sizing: border-box;\n }\n\n .card-email__badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n align-self: flex-start;\n background: var(--badge-bg);\n color: var(--badge-text);\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.68rem;\n font-weight: 700;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n padding: 7px 16px 7px 13px;\n border-radius: 999px;\n }\n\n .card-email__badge svg {\n width: 13px;\n height: 13px;\n flex-shrink: 0;\n }\n\n .card-email h2 {\n margin: 0;\n color: var(--heading);\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: clamp(1.3rem, 2.2vw, 1.55rem);\n font-weight: 700;\n line-height: 1.25;\n }\n\n .card-email__desc {\n margin: 0;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.85rem;\n line-height: 1.6;\n color: var(--body-text);\n opacity: 0.92;\n }\n\n .card-email__list {\n list-style: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n .card-email__list li {\n display: flex;\n align-items: flex-start;\n gap: 10px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.82rem;\n line-height: 1.5;\n }\n\n .card-email__list .arrow {\n color: var(--arrow-color);\n font-size: 0.88rem;\n line-height: 1.5;\n flex-shrink: 0;\n }\n\n @media (max-width: 480px) {\n .card-email {\n max-width: 100%;\n gap: 14px;\n }\n\n .card-email h2 {\n font-size: 1.25rem;\n }\n\n .card-email__desc,\n .card-email__list li {\n font-size: 0.8rem;\n }\n\n .card-email__list {\n gap: 10px;\n }\n }\n\n \/* Standalone preview only \u2014 remove this whole block when dropping the\n card into your existing 3-box flex row on the live site. *\/\n body.standalone-preview {\n margin: 0;\n min-height: 100vh;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #512e35;\n padding: 40px 20px;\n box-sizing: border-box;\n }\n<\/style>\n<\/head>\n<body class=\"standalone-preview\">\n\n <div class=\"card-email\">\n <span class=\"card-email__badge\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n <rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"\/>\n <path d=\"M22 6l-10 7L2 6\"\/>\n <\/svg>\n Async\n <\/span>\n\n <h2>Email our commercial team<\/h2>\n\n <p class=\"card-email__desc\">\n For formal inquiries, document sharing, or if you prefer to communicate by email. We respond within one business day.\n <\/p>\n\n <ul class=\"card-email__list\">\n <li><span class=\"arrow\">\u2192<\/span><span>Formal commercial inquiries and proposals<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Sharing RFPs or business documents<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Partnership and distributor inquiries<\/span><\/li>\n <li><span class=\"arrow\">\u2192<\/span><span>Press and brand partnerships<\/span><\/li>\n <\/ul>\n <\/div>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4d5b5be elementor-align-center elementor-widget elementor-widget-button\" data-id=\"4d5b5be\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"mailto:hello@byousuperfoods.com\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-far-envelope\" viewBox=\"0 0 512 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm0 48v40.805c-22.422 18.259-58.168 46.651-134.587 106.49-16.841 13.247-50.201 45.072-73.413 44.701-23.208.375-56.579-31.459-73.413-44.701C106.18 199.465 70.425 171.067 48 152.805V112h416zM48 400V214.398c22.914 18.251 55.409 43.862 104.938 82.646 21.857 17.205 60.134 55.186 103.062 54.955 42.717.231 80.509-37.199 103.053-54.947 49.528-38.783 82.032-64.401 104.947-82.653V400H48z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">hello@byousuperfoods.com<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-23b9ce8 e-flex e-con-boxed e-con e-parent\" data-id=\"23b9ce8\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-e4531ab e-con e-atomic-element e-flexbox-base e-e4531ab-92f43eb \" data-id=\"e4531ab\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"e4531ab\" data-e-type=\"e-flexbox\" data-id=\"e4531ab\">\n \t\t\t<h5 data-interaction-id=\"6faf759\" class=\"e-6faf759-f406df8 e-heading-base\" data-e-type=\"widget\" data-id=\"6faf759\"><strong>AI ASSISTANT PREVIEW<\/strong><\/h5>\n\t\t\t\t\t<h2 data-interaction-id=\"31e6635\" class=\"e-31e6635-f7bdaf5 e-heading-base\" data-e-type=\"widget\" data-id=\"31e6635\" ><strong>What the conversation looks like.<\/strong><\/h2>\n\t\t\t\t<div class=\"elementor-element elementor-element-548160f elementor-widget elementor-widget-text-editor\" data-id=\"548160f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Our assistant is trained on B.you’s full portfolio, service model, and qualification criteria. It can answer most questions on the spot, and knows when to route you to the commercial team.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ed24032 elementor-widget elementor-widget-html\" data-id=\"ed24032\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>How it works<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n \/* Scoped under .byou-steps so this can sit safely alongside your other\n components on the page without leaking variables or class names. *\/\n\n .byou-steps {\n --card-bg: #2b1b1f;\n --circle-bg: #589971;\n --circle-text: #ffffff;\n --heading: #ffffff;\n --body-text: #c4bfc0;\n --divider: #3c2d31;\n\n box-sizing: border-box;\n width: 100%;\n max-width: 640px;\n margin: 0 auto;\n background: var(--card-bg);\n border-radius: 18px;\n padding: 36px 32px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n }\n\n .byou-steps *,\n .byou-steps *::before,\n .byou-steps *::after {\n box-sizing: border-box;\n }\n\n .byou-steps__item {\n display: flex;\n gap: 20px;\n padding: 22px 0;\n }\n\n .byou-steps__item:first-child {\n padding-top: 0;\n }\n\n .byou-steps__item:last-child {\n padding-bottom: 0;\n }\n\n .byou-steps__item:not(:last-child) {\n border-bottom: 1px solid var(--divider);\n }\n\n .byou-steps__circle {\n width: 44px;\n height: 44px;\n border-radius: 50%;\n background: var(--circle-bg);\n color: var(--circle-text);\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 700;\n font-size: 1.1rem;\n flex-shrink: 0;\n }\n\n .byou-steps__content h3 {\n margin: 4px 0 8px;\n color: var(--heading);\n font-size: 1.15rem;\n font-weight: 700;\n line-height: 1.3;\n }\n\n .byou-steps__content p {\n margin: 0;\n color: var(--body-text);\n font-size: 0.92rem;\n line-height: 1.55;\n }\n\n @media (max-width: 480px) {\n .byou-steps {\n padding: 26px 22px;\n border-radius: 0;\n }\n\n .byou-steps__item {\n gap: 14px;\n padding: 18px 0;\n }\n\n .byou-steps__circle {\n width: 38px;\n height: 38px;\n font-size: 1rem;\n }\n\n .byou-steps__content h3 {\n font-size: 1.05rem;\n }\n\n .byou-steps__content p {\n font-size: 0.85rem;\n }\n }\n\n \/* Standalone preview only *\/\n body.standalone-preview {\n margin: 0;\n min-height: 100vh;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #180f12;\n padding: 30px 16px;\n box-sizing: border-box;\n }\n<\/style>\n<\/head>\n<body class=\"standalone-preview\">\n\n <div class=\"byou-steps\">\n\n <div class=\"byou-steps__item\">\n <div class=\"byou-steps__circle\">1<\/div>\n <div class=\"byou-steps__content\">\n <h3>Ask anything<\/h3>\n <p>Portfolio, specs, private label, switching, anything you'd normally put in a form.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"byou-steps__item\">\n <div class=\"byou-steps__circle\">2<\/div>\n <div class=\"byou-steps__content\">\n <h3>Get instant answers<\/h3>\n <p>No wait, no form submission, no auto-responder. Real answers from trained content.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"byou-steps__item\">\n <div class=\"byou-steps__circle\">3<\/div>\n <div class=\"byou-steps__content\">\n <h3>Connect when ready<\/h3>\n <p>When you're ready for a commercial conversation, the assistant routes you to the right commercial contact.<\/p>\n <\/div>\n <\/div>\n\n <\/div>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-41a210f e-con e-atomic-element e-flexbox-base e-41a210f-4f2abe9 \" data-id=\"41a210f\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"41a210f\" data-e-type=\"e-flexbox\" data-id=\"41a210f\">\n \t\t<div class=\"elementor-element elementor-element-3a9d2a9 elementor-widget elementor-widget-html\" data-id=\"3a9d2a9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>B.you Assistant<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n \/* Scoped under .byou-chat so this can sit safely alongside other\n components on the page without leaking variables or class names. *\/\n\n html, body {\n max-width: 100%;\n overflow-x: hidden;\n }\n\n .byou-chat {\n --outer-bg: #2b1b1f;\n --header-green: #589971;\n --bot-bubble: #413236;\n --user-bubble: #589971;\n --quick-reply-bg: #332428;\n --quick-reply-border: #5a464b;\n --input-bg: #3a2b2f;\n --text-light: #ffffff;\n --text-muted: #cdbfc3;\n --icon-green: #7cc79c;\n\n box-sizing: border-box;\n width: 100%;\n max-width: 420px;\n margin: 0 auto;\n background: var(--outer-bg);\n border-radius: 22px;\n overflow: hidden;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n color: var(--text-light);\n display: flex;\n flex-direction: column;\n box-shadow: 0 20px 50px rgba(0,0,0,0.35);\n }\n\n .byou-chat *,\n .byou-chat *::before,\n .byou-chat *::after {\n box-sizing: border-box;\n }\n\n \/* Header *\/\n .byou-chat__header {\n background: var(--header-green);\n padding: 20px 22px;\n display: flex;\n align-items: center;\n gap: 14px;\n }\n\n .byou-chat__back {\n width: 34px;\n height: 34px;\n border-radius: 50%;\n background: rgba(255,255,255,0.18);\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n flex-shrink: 0;\n color: #ffffff;\n transition: background 0.15s ease;\n }\n\n .byou-chat__back:hover,\n .byou-chat__back:focus-visible {\n background: rgba(255,255,255,0.3);\n }\n\n .byou-chat__back:focus-visible {\n outline: 2px solid #ffffff;\n outline-offset: 2px;\n }\n\n .byou-chat__back svg {\n width: 18px;\n height: 18px;\n }\n\n .byou-chat__avatar {\n width: 46px;\n height: 46px;\n border-radius: 50%;\n background: rgba(255,255,255,0.22);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n }\n\n .byou-chat__avatar svg {\n width: 22px;\n height: 22px;\n color: #ffffff;\n }\n\n .byou-chat__header-text h1 {\n margin: 0 0 3px;\n font-size: 1.05rem;\n font-weight: 700;\n }\n\n .byou-chat__status {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 0.78rem;\n color: rgba(255,255,255,0.85);\n font-weight: 500;\n }\n\n .byou-chat__status-dot {\n width: 7px;\n height: 7px;\n border-radius: 50%;\n background: #d8f5e3;\n flex-shrink: 0;\n }\n\n \/* Body *\/\n .byou-chat__body {\n padding: 20px 20px 8px;\n display: flex;\n flex-direction: column;\n gap: 14px;\n max-height: 560px;\n overflow-y: auto;\n }\n\n .byou-chat__eyebrow {\n font-size: 0.7rem;\n font-weight: 700;\n letter-spacing: 0.1em;\n text-transform: uppercase;\n color: var(--text-muted);\n opacity: 0.75;\n margin: 0 0 -2px 4px;\n }\n\n .byou-chat__bubble {\n background: var(--bot-bubble);\n border-radius: 16px;\n padding: 16px 18px;\n font-size: 0.92rem;\n line-height: 1.55;\n max-width: 88%;\n white-space: pre-line;\n word-wrap: break-word;\n overflow-wrap: break-word;\n }\n\n .byou-chat__bubble.bot {\n align-self: flex-start;\n }\n\n .byou-chat__bubble.user {\n align-self: flex-end;\n background: var(--user-bubble);\n font-weight: 600;\n }\n\n .byou-chat__quick-replies {\n display: flex;\n flex-direction: column;\n gap: 10px;\n margin-top: 2px;\n }\n\n .byou-chat__quick-reply {\n display: flex;\n align-items: center;\n gap: 12px;\n text-align: left;\n background: var(--quick-reply-bg);\n border: 1px solid var(--quick-reply-border);\n color: var(--text-light);\n border-radius: 14px;\n padding: 14px 16px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.9rem;\n font-weight: 600;\n cursor: pointer;\n transition: background 0.15s ease, border-color 0.15s ease;\n }\n\n .byou-chat__quick-reply:hover,\n .byou-chat__quick-reply:focus-visible {\n background: #423033;\n border-color: var(--icon-green);\n }\n\n .byou-chat__quick-reply:focus-visible {\n outline: 2px solid var(--icon-green);\n outline-offset: 2px;\n }\n\n .byou-chat__quick-reply span {\n min-width: 0;\n flex: 1;\n word-break: break-word;\n }\n\n .byou-chat__quick-reply svg {\n width: 18px;\n height: 18px;\n color: var(--icon-green);\n flex-shrink: 0;\n }\n\n \/* Input row *\/\n .byou-chat__footer {\n padding: 14px 20px 20px;\n border-top: 1px solid rgba(255,255,255,0.06);\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .byou-chat__input {\n flex: 1;\n min-width: 0;\n background: var(--input-bg);\n border: none;\n border-radius: 999px;\n padding: 14px 18px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n font-size: 0.9rem;\n color: var(--text-light);\n }\n\n .byou-chat__input::placeholder {\n color: var(--text-muted);\n opacity: 0.7;\n }\n\n .byou-chat__input:focus {\n outline: 2px solid var(--icon-green);\n outline-offset: 1px;\n }\n\n .byou-chat__send {\n width: 44px;\n height: 44px;\n border-radius: 50%;\n background: var(--header-green);\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n flex-shrink: 0;\n transition: background 0.15s ease, transform 0.15s ease;\n }\n\n .byou-chat__send:hover,\n .byou-chat__send:focus-visible {\n background: #4c8a63;\n transform: translateY(-1px);\n }\n\n .byou-chat__send svg {\n width: 18px;\n height: 18px;\n color: #ffffff;\n }\n\n @media (max-width: 480px) {\n .byou-chat {\n border-radius: 0;\n max-width: 100%;\n }\n\n .byou-chat__bubble {\n max-width: 92%;\n }\n }\n\n \/* Standalone preview only *\/\n body.standalone-preview {\n margin: 0;\n min-height: 100vh;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #180f12;\n padding: 30px 16px;\n box-sizing: border-box;\n }\n<\/style>\n<\/head>\n<body class=\"standalone-preview\">\n\n <div class=\"byou-chat\">\n\n <div class=\"byou-chat__header\">\n <button class=\"byou-chat__back\" id=\"byouChatBack\" aria-label=\"Go back\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"19\" y1=\"12\" x2=\"5\" y2=\"12\"\/><polyline points=\"12 19 5 12 12 5\"\/><\/svg>\n <\/button>\n <div class=\"byou-chat__avatar\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"\/><circle cx=\"12\" cy=\"7\" r=\"4\"\/><\/svg>\n <\/div>\n <div class=\"byou-chat__header-text\">\n <h1>B.you Assistant<\/h1>\n <div class=\"byou-chat__status\">\n <span class=\"byou-chat__status-dot\"><\/span>\n Online \u00b7 Answers instantly\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"byou-chat__body\" id=\"byouChatBody\">\n <div class=\"byou-chat__eyebrow\">B.you Assistant<\/div>\n\n <div class=\"byou-chat__bubble bot\">Hi! I'm the B.you assistant. I can help you learn about our a\u00e7a\u00ed portfolio, check if we're a good fit for your operation, and connect you with our team when you're ready.\n\nWhat brings you here today?<\/div>\n\n <div class=\"byou-chat__quick-replies\" id=\"quickReplies\">\n <button class=\"byou-chat__quick-reply\"\n data-reply=\"Tell me about your products and formats\"\n data-response=\"We offer organic a\u00e7a\u00ed sorbet in a few formats: 3-gallon foodservice buckets, retail-ready pints, and bulk pur\u00e9e for manufacturing. Everything is USDA Organic, Certified B Corp, and Kosher certified, with vegan-friendly recipes across the line.\n\nIs there a specific format or use case you're looking at?\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z\"\/><polyline points=\"3.27 6.96 12 12.01 20.73 6.96\"\/><line x1=\"12\" y1=\"22.08\" x2=\"12\" y2=\"12\"\/><\/svg>\n <span>Tell me about your products and formats<\/span>\n <\/button>\n <button class=\"byou-chat__quick-reply\"\n data-reply=\"Am I the right buyer profile for B.you?\"\n data-response=\"Great question. B.you works best with multi-unit operators, distributors building differentiated frozen portfolios, and brands exploring private-label a\u00e7a\u00ed programs.\n\nCan you tell me a bit about your operation, how many locations, and what you're currently using for a\u00e7a\u00ed?\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><circle cx=\"12\" cy=\"12\" r=\"6\"\/><circle cx=\"12\" cy=\"12\" r=\"2\"\/><\/svg>\n <span>Am I the right buyer profile for B.you?<\/span>\n <\/button>\n <button class=\"byou-chat__quick-reply\"\n data-reply=\"How does private label work?\"\n data-response=\"Private label typically starts with a short discovery call to understand your volume, packaging, and branding needs. From there we share formulation options, run a sample batch for approval, then move into production planning and packaging design.\n\nMost partners go from first call to first shipment in a few months, depending on packaging lead times. Want me to connect you with the team to scope your project?\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20.59 13.41 13 21l-9-9V3h9l7.59 8.59a2 2 0 0 1 0 2.82z\"\/><circle cx=\"7.5\" cy=\"7.5\" r=\"1.5\"\/><\/svg>\n <span>How does private label work?<\/span>\n <\/button>\n <button class=\"byou-chat__quick-reply\"\n data-reply=\"I'm currently with another supplier, how does switching work?\"\n data-response=\"Switching is usually smoother than people expect. We start by matching your current specs (format, sweetness, packaging) so the transition is seamless for your customers, then run a pilot order alongside your existing supply before fully cutting over.\n\nDo you know roughly when your current contract or PO cycle ends? That helps us plan timing.\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"1 4 1 10 7 10\"\/><path d=\"M3.51 15a9 9 0 1 0 2.13-9.36L1 10\"\/><\/svg>\n <span>I'm currently with another supplier, <br>how does switching work?<\/span>\n <\/button>\n <button class=\"byou-chat__quick-reply\"\n data-reply=\"Connect me with the commercial team\"\n data-response=\"Happy to connect you. You can reach our commercial team directly on WhatsApp for a fast response, or by email if you'd rather share documents or a formal proposal first.\n\nWant me to point you to the right one, or would you rather leave your contact info here and have someone reach out?\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"\/><circle cx=\"12\" cy=\"7\" r=\"4\"\/><\/svg>\n <span>Connect me with the commercial team<\/span>\n <\/button>\n <\/div>\n <\/div>\n\n <div class=\"byou-chat__footer\">\n <input type=\"text\" class=\"byou-chat__input\" id=\"byouChatInput\" placeholder=\"Type your question...\">\n <button class=\"byou-chat__send\" id=\"byouChatSend\" aria-label=\"Send message\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12 5 19 12 12 19\"\/><\/svg>\n <\/button>\n <\/div>\n\n <\/div>\n\n <script>\n \/\/ Front-end interaction only \u2014 this matches typed questions and quick\n \/\/ replies against a small set of canned answers by keyword. It is NOT\n \/\/ a real AI backend. Swap findResponse() for a call to your actual\n \/\/ chat API when you're ready to wire this up to something live.\n (function () {\n const body = document.getElementById('byouChatBody');\n const input = document.getElementById('byouChatInput');\n const sendBtn = document.getElementById('byouChatSend');\n const backBtn = document.getElementById('byouChatBack');\n\n \/\/ Reset the chat back to its opening message + quick replies.\n const initialBodyHTML = body.innerHTML;\n\n backBtn.addEventListener('click', function () {\n body.innerHTML = initialBodyHTML;\n input.value = '';\n body.scrollTop = 0;\n });\n\n \/\/ Keyword groups checked in order \u2014 first match wins. Extend this\n \/\/ list to cover more of the questions people actually type in.\n const KEYWORD_RESPONSES = [\n {\n keywords: ['product', 'format', 'flavor', 'flavour', 'size', 'pint', 'bucket', 'gallon', 'certif', 'organic', 'vegan', 'kosher'],\n response: \"We offer organic a\u00e7a\u00ed sorbet in a few formats: 3-gallon foodservice buckets, retail-ready pints, and bulk pur\u00e9e for manufacturing. Everything is USDA Organic, Certified B Corp, and Kosher certified, with vegan-friendly recipes across the line.\\n\\nIs there a specific format or use case you're looking at?\"\n },\n {\n keywords: ['right fit', 'right buyer', 'buyer profile', 'good fit', 'is this for me', 'right for us'],\n response: \"Great question. B.you works best with multi-unit operators, distributors building differentiated frozen portfolios, and brands exploring private-label a\u00e7a\u00ed programs.\\n\\nCan you tell me a bit about your operation, how many locations, and what you're currently using for a\u00e7a\u00ed?\"\n },\n {\n keywords: ['private label', 'private-label', 'white label', 'own brand', 'custom brand'],\n response: \"Private label typically starts with a short discovery call to understand your volume, packaging, and branding needs. From there we share formulation options, run a sample batch for approval, then move into production planning and packaging design.\\n\\nMost partners go from first call to first shipment in a few months, depending on packaging lead times. Want me to connect you with the team to scope your project?\"\n },\n {\n keywords: ['another supplier', 'switch', 'switching', 'current supplier', 'currently using', 'change supplier'],\n response: \"Switching is usually smoother than people expect. We start by matching your current specs (format, sweetness, packaging) so the transition is seamless for your customers, then run a pilot order alongside your existing supply before fully cutting over.\\n\\nDo you know roughly when your current contract or PO cycle ends? That helps us plan timing.\"\n },\n {\n keywords: ['connect', 'talk to', 'speak to', 'human', 'commercial team', 'sales', 'contact', 'email', 'whatsapp', 'call me'],\n response: \"Happy to connect you. You can reach our commercial team directly on WhatsApp for a fast response, or by email if you'd rather share documents or a formal proposal first.\\n\\nWant me to point you to the right one, or would you rather leave your contact info here and have someone reach out?\"\n },\n {\n keywords: ['price', 'pricing', 'cost', 'quote', 'moq', 'minimum order'],\n response: \"Pricing depends on format, volume, and whether you're looking at standard product or a private-label run, so it's best handled by our commercial team directly rather than a flat number here.\\n\\nWant me to connect you with them for a quote?\"\n }\n ];\n\n const FALLBACK_RESPONSE = \"I don't have a ready answer for that one yet \u2014 but our commercial team can help directly. Want me to connect you, or feel free to ask about our products, buyer fit, private label, switching suppliers, or pricing.\";\n\n function findResponse(text) {\n const normalized = text.toLowerCase();\n for (const group of KEYWORD_RESPONSES) {\n if (group.keywords.some(function (kw) { return normalized.includes(kw); })) {\n return group.response;\n }\n }\n return FALLBACK_RESPONSE;\n }\n\n function addUserBubble(text) {\n const bubble = document.createElement('div');\n bubble.className = 'byou-chat__bubble user';\n bubble.textContent = text;\n body.appendChild(bubble);\n }\n\n function addBotBubble(text) {\n const bubble = document.createElement('div');\n bubble.className = 'byou-chat__bubble bot';\n bubble.textContent = text;\n body.appendChild(bubble);\n body.scrollTop = body.scrollHeight;\n }\n\n \/\/ presetResponse: pass a button's exact canned answer directly so\n \/\/ quick replies always give their specific response, never the\n \/\/ keyword fallback.\n function handleSend(text, presetResponse) {\n if (!text.trim()) return;\n addUserBubble(text);\n const currentQuickReplies = document.getElementById('quickReplies');\n if (currentQuickReplies) currentQuickReplies.remove();\n input.value = '';\n const responseText = presetResponse || findResponse(text);\n setTimeout(function () {\n addBotBubble(responseText);\n }, 500);\n body.scrollTop = body.scrollHeight;\n }\n\n body.addEventListener('click', function (e) {\n const btn = e.target.closest('.byou-chat__quick-reply');\n if (!btn) return;\n handleSend(btn.dataset.reply, btn.dataset.response);\n });\n\n sendBtn.addEventListener('click', function () {\n handleSend(input.value);\n });\n\n input.addEventListener('keydown', function (e) {\n if (e.key === 'Enter') handleSend(input.value);\n });\n })();\n <\/script>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4f98c23 e-flex e-con-boxed e-con e-parent\" data-id=\"4f98c23\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-2c2b225 e-con-full e-flex e-con e-child\" data-id=\"2c2b225\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<h5 data-interaction-id=\"477b0c7\" class=\"e-477b0c7-489d95c e-heading-base\" data-e-type=\"widget\" data-id=\"477b0c7\"><strong>WHAT HAPPENS AFTER YOU CHAT<\/strong><\/h5>\n\t\t\t\t\t<h2 data-interaction-id=\"6b5e956\" class=\"e-6b5e956-a067e66 e-heading-base\" data-e-type=\"widget\" data-id=\"6b5e956\" ><strong>Your conversation, handled commercially.<\/strong><\/h2>\n\t\t<div class=\"elementor-element elementor-element-c29fc4f e-con e-atomic-element e-flexbox-base \" data-id=\"c29fc4f\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"c29fc4f\" data-e-type=\"e-flexbox\" data-id=\"c29fc4f\">\n \t\t<div class=\"elementor-element elementor-element-eac4dcc elementor-widget elementor-widget-html\" data-id=\"eac4dcc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>How it works<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n \/* Scoped under .byou-icon-steps so this can sit safely alongside your\n other components without leaking variables or class names. *\/\n\n .byou-icon-steps {\n --icon-color: #589971;\n --card-bg: #ffffff;\n --heading: #241a1d;\n --body-text: #6b6265;\n\n box-sizing: border-box;\n width: 100%;\n display: flex;\n flex-wrap: wrap;\n gap: 24px;\n font-family: \"Quicksand\", \"Segoe UI\", sans-serif;\n }\n\n .byou-icon-steps *,\n .byou-icon-steps *::before,\n .byou-icon-steps *::after {\n box-sizing: border-box;\n }\n\n .byou-icon-steps__card {\n flex: 1 1 220px;\n min-width: 0;\n background: var(--card-bg);\n border-radius: 16px;\n padding: 28px 22px 30px;\n text-align: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n box-shadow: 0 2px 10px rgba(30, 20, 20, 0.04);\n }\n\n .byou-icon-steps__icon {\n width: 32px;\n height: 32px;\n color: var(--icon-color);\n margin-bottom: 16px;\n }\n\n .byou-icon-steps__icon svg {\n width: 100%;\n height: 100%;\n }\n\n .byou-icon-steps__card h3 {\n margin: 0 0 8px;\n color: var(--heading);\n font-size: 1rem;\n font-weight: 700;\n }\n\n .byou-icon-steps__card p {\n margin: 0;\n color: var(--body-text);\n font-size: 0.82rem;\n line-height: 1.55;\n }\n\n @media (max-width: 640px) {\n .byou-icon-steps {\n flex-direction: column;\n gap: 14px;\n }\n\n .byou-icon-steps__card {\n flex: 1 1 auto;\n width: 100%;\n padding: 24px 20px 26px;\n }\n }\n\n \/* Standalone preview only *\/\n body.standalone-preview {\n margin: 0;\n min-height: 100vh;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #f3ece3;\n padding: 40px 20px;\n box-sizing: border-box;\n }\n<\/style>\n<\/head>\n<body class=\"standalone-preview\">\n\n <div class=\"byou-icon-steps\">\n\n <div class=\"byou-icon-steps__card\">\n <div class=\"byou-icon-steps__icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <path d=\"M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z\"\/>\n <\/svg>\n <\/div>\n <h3>Chat with assistant<\/h3>\n <p>Get instant answers on portfolio, fit, and process. No wait, no form.<\/p>\n <\/div>\n\n <div class=\"byou-icon-steps__card\">\n <div class=\"byou-icon-steps__icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <circle cx=\"12\" cy=\"12\" r=\"9.5\"\/>\n <circle cx=\"12\" cy=\"12\" r=\"5.5\"\/>\n <circle cx=\"12\" cy=\"12\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"\/>\n <\/svg>\n <\/div>\n <h3>Qualify your fit<\/h3>\n <p>The assistant assesses your buyer profile and readiness based on your answers.<\/p>\n <\/div>\n\n <div class=\"byou-icon-steps__card\">\n <div class=\"byou-icon-steps__icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.362 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.338 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/>\n <\/svg>\n <\/div>\n <h3>Connect with the team<\/h3>\n <p>When you're ready, the assistant routes you directly to the right commercial contact.<\/p>\n <\/div>\n\n <\/div>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Talk to us Start a conversation. We’ll find the fit. Our AI assistant is available around the clock to answer questions about our portfolio, help you assess fit, and route you to the right person when you’re ready to move forward. Chat with our AI assistant Recommended Chat with our AI assistant Ask anything about […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_angie_page":false,"footnotes":""},"class_list":["post-237","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/pages\/237","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/comments?post=237"}],"version-history":[{"count":22,"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/pages\/237\/revisions"}],"predecessor-version":[{"id":681,"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/pages\/237\/revisions\/681"}],"wp:attachment":[{"href":"https:\/\/byousuperfoods.com\/usa\/wp-json\/wp\/v2\/media?parent=237"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}