{"id":4989,"date":"2021-05-12T12:57:18","date_gmt":"2021-05-12T12:57:18","guid":{"rendered":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/?post_type=download&#038;p=4989"},"modified":"2026-10-13T12:14:03","modified_gmt":"2026-10-13T12:14:03","slug":"variations-radio-buttons-for-woocommerce","status":"publish","type":"download","link":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/","title":{"rendered":"Variations Radio Buttons for WooCommerce"},"content":{"rendered":"\n<nav aria-label=\"Variations Radio Buttons for WooCommerce sections\" class=\"sticky top-0 z-30 border-b border-hairline bg-surface\/95 backdrop-blur transition-shadow\"><div class=\"mx-auto flex max-w-7xl items-center gap-4 px-4 py-2.5 sm:px-6\"><p class=\"hidden min-w-0 shrink-0 truncate text-[13px] font-extrabold text-ink lg:block lg:max-w-[240px]\">Variations Radio Buttons<\/p><ul class=\"hidden min-w-0 flex-1 items-center gap-1 overflow-x-auto lg:flex\"><li><a aria-current=\"true\" class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors bg-brand\/10 text-brand\" href=\"#overview\">Overview<\/a><\/li><li><a class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors text-ink-soft hover:text-ink\" href=\"#features\">Features<\/a><\/li><li><a class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors text-ink-soft hover:text-ink\" href=\"#shop-page\">Shop Page<\/a><\/li><li><a class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors text-ink-soft hover:text-ink\" href=\"#display-options\">Display Options<\/a><\/li><li><a class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors text-ink-soft hover:text-ink\" href=\"#compatibility\">Compatibility<\/a><\/li><li><a class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors text-ink-soft hover:text-ink\" href=\"#pricing\">Pricing<\/a><\/li><li><a class=\"inline-flex rounded-md px-2.5 py-1.5 text-[13px] font-semibold whitespace-nowrap transition-colors text-ink-soft hover:text-ink\" href=\"#faq\">FAQ<\/a><\/li><\/ul><div class=\"relative min-w-0 flex-1 lg:hidden\"><label class=\"sr-only\" for=\"product-nav-select\">Jump to section<\/label><select class=\"w-full appearance-none rounded-md border border-hairline bg-surface py-2 pr-9 pl-3 text-[13px] font-semibold text-ink\" id=\"product-nav-select\"><option value=\"overview\">Overview<\/option><option value=\"features\">Features<\/option><option value=\"shop-page\">Shop Page<\/option><option value=\"display-options\">Display Options<\/option><option value=\"compatibility\">Compatibility<\/option><option value=\"pricing\">Pricing<\/option><option value=\"faq\">FAQ<\/option><\/select><svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down pointer-events-none absolute top-1\/2 right-3 h-4 w-4 -translate-y-1\/2 text-ink-soft\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"m6 9 6 6 6-6\"><\/path><\/svg><\/div><a class=\"inline-flex shrink-0 items-center rounded-md bg-brand px-3.5 py-2 text-[13px] font-semibold whitespace-nowrap text-brand-foreground transition-colors hover:bg-brand-deep\" href=\"#pricing\">Buy Now<\/a><\/div><\/nav>\n<section class=\"border-b border-hairline bg-brand\/4\" id=\"overview\">\n                        <div class=\"mx-auto max-w-7xl px-4 pt-9 pb-12 sm:px-6 lg:py-14\">\n                            <div class=\"grid items-start gap-9 lg:grid-cols-[minmax(0,0.85fr)_minmax(0,1.3fr)] lg:gap-12\">\n                                <div>\n                                    <div class=\"flex items-center gap-3\">\n                                        <img decoding=\"async\" alt=\"Original Variations Radio Buttons plugin icon\" class=\"h-14 w-14 object-contain\" height=\"56\" loading=\"eager\" src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-icon.png\" width=\"56\">\n                                        <p class=\"text-[12px] font-bold text-brand\">WooCommerce Variation Plugin<\/p>\n                                    <\/div>\n                                    <h1 class=\"mt-5 text-[32px] leading-tight font-extrabold sm:text-[40px]\">\n                                        Variations Radio Buttons for WooCommerce\n                                    <\/h1>\n                                    <p class=\"mt-5 text-[21px] leading-snug font-bold text-brand\">\n                                        Make product variations easier to see and choose.\n                                    <\/p>\n                                    <p class=\"mt-4 text-[15px] leading-relaxed text-ink-soft\">\n                                        Replace variation dropdowns with visible radio-button options. Show more choices\n                                        at once and let customers select variations directly from product, Shop and\n                                        Archive pages.\n                                    <\/p>\n                                    <div class=\"mt-6 flex flex-wrap gap-3\">\n                                        <a class=\"inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 bg-primary text-primary-foreground shadow hover:bg-primary\/90 h-10 rounded-md variation-cta px-5 py-3\" href=\"#pricing\">Buy Variations Radio Buttons<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M5 12h14\"><\/path>\n                                                <path d=\"m12 5 7 7-7 7\"><\/path><\/svg><\/a><a class=\"inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground h-10 rounded-md variation-cta px-5 py-3\" href=\"#variation-demo\">View Demo<\/a>\n                                    <\/div>\n                                    <div class=\"mt-4 flex flex-wrap gap-5 text-[12px] font-semibold text-brand\">\n                                        <a class=\"hover:underline\" href=\"https:\/\/imaginate-solutions.com\/contact\/\">Request Documentation<\/a><a class=\"hover:underline\" href=\"#screenshots\">Screenshots<\/a>\n                                    <\/div>\n                                    <ul class=\"mt-6 space-y-2\">\n                                        <li class=\"flex items-start gap-2 text-[12px] text-ink-soft\">\n                                            <svg aria-hidden=\"true\" class=\"lucide lucide-check h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M20 6 9 17l-5-5\"><\/path><\/svg>Product, Shop &amp; Archive pages\n                                        <\/li>\n                                        <li class=\"flex items-start gap-2 text-[12px] text-ink-soft\">\n                                            <svg aria-hidden=\"true\" class=\"lucide lucide-check h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M20 6 9 17l-5-5\"><\/path><\/svg>Separate or merged attributes\n                                        <\/li>\n                                        <li class=\"flex items-start gap-2 text-[12px] text-ink-soft\">\n                                            <svg aria-hidden=\"true\" class=\"lucide lucide-check h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M20 6 9 17l-5-5\"><\/path><\/svg>Variable subscriptions supported\n                                        <\/li>\n                                        <li class=\"flex items-start gap-2 text-[12px] text-ink-soft\">\n                                            <svg aria-hidden=\"true\" class=\"lucide lucide-check h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                <path d=\"M20 6 9 17l-5-5\"><\/path><\/svg>30-day money-back guarantee\n                                        <\/li>\n                                    <\/ul>\n                                <\/div>\n                                <div class=\"min-w-0\" id=\"variation-demo\">\n                                    <div class=\"grid gap-4 sm:grid-cols-2\">\n                                        <div class=\"rounded-lg border border-hairline bg-surface p-5\">\n                                            <p class=\"mb-5 flex items-center gap-2 text-[11px] font-bold text-ink-soft\">\n                                                BEFORE <span class=\"font-normal\">WooCommerce dropdowns<\/span>\n                                            <\/p>\n                                            <label class=\"mb-4 block text-[12px] font-bold text-ink-soft\">Size<select aria-label=\"Before Size\" class=\"mt-2 min-h-11 w-full rounded-md border border-hairline bg-surface-alt px-3 text-[13px] font-normal text-ink\">\n                                                    <option selected=\"\" value=\"\">Select an option<\/option>\n                                                    <option>Small<\/option>\n                                                    <option>Medium<\/option>\n                                                    <option>Large<\/option>\n                                                <\/select><\/label><label class=\"mb-4 block text-[12px] font-bold text-ink-soft\">Color<select aria-label=\"Before Color\" class=\"mt-2 min-h-11 w-full rounded-md border border-hairline bg-surface-alt px-3 text-[13px] font-normal text-ink\">\n                                                    <option selected=\"\" value=\"\">Select an option<\/option>\n                                                    <option>Black<\/option>\n                                                    <option>Blue<\/option>\n                                                    <option>White<\/option>\n                                                <\/select><\/label>\n                                            <p class=\"mt-5 text-[12px] text-ink-soft\">Choices behind each dropdown<\/p>\n                                        <\/div>\n                                        <div class=\"rounded-lg border border-brand\/30 bg-surface p-5 shadow-card\">\n                                            <p class=\"mb-5 flex items-center gap-2 text-[11px] font-bold text-brand\">\n                                                AFTER\n                                                <svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3 w-3\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                    <path d=\"M5 12h14\"><\/path>\n                                                    <path d=\"m12 5 7 7-7 7\"><\/path>\n                                                <\/svg>\n                                                Visible choices\n                                            <\/p>\n                                            <div class=\"space-y-4\">\n                                                <fieldset class=\"min-w-0\">\n                                                    <legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">\n                                                        Size\n                                                    <\/legend>\n                                                    <div class=\"flex flex-wrap gap-2\">\n                                                        <label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_0_\" type=\"radio\" value=\"Small\">Small<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_0_\" type=\"radio\" value=\"Medium\">Medium<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_0_\" type=\"radio\" value=\"Large\">Large<\/label>\n                                                    <\/div>\n                                                <\/fieldset>\n                                                <fieldset class=\"min-w-0\">\n                                                    <legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">\n                                                        Color\n                                                    <\/legend>\n                                                    <div class=\"flex flex-wrap gap-2\">\n                                                        <label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_1_\" type=\"radio\" value=\"Black\">Black<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_1_\" type=\"radio\" value=\"Blue\">Blue<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_1_\" type=\"radio\" value=\"White\">White<\/label>\n                                                    <\/div>\n                                                <\/fieldset>\n                                            <\/div>\n                                            <p class=\"mt-5 flex items-center gap-2 text-[12px] font-semibold text-brand\">\n                                                <svg aria-hidden=\"true\" class=\"lucide lucide-check h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                    <path d=\"M20 6 9 17l-5-5\"><\/path><\/svg>Options in plain sight\n                                            <\/p>\n                                        <\/div>\n                                    <\/div>\n                                    <div class=\"mt-4 flex flex-wrap items-center justify-between gap-3 border-b border-hairline pb-3 text-[12px] font-semibold text-brand\">\n                                        <span>Dropdowns \u2192 Visible choices \u2192 Add to Cart<\/span><span>Storefront preview<\/span>\n                                    <\/div>\n                                    <div class=\"mt-4\">\n                                        <article class=\"flex min-w-0 flex-col rounded-lg border border-hairline bg-surface p-5 shadow-card\">\n                                            <div class=\"mb-4 flex items-center gap-3 border-b border-hairline pb-4\">\n                                                <svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag h-6 w-6 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                    <path d=\"M16 10a4 4 0 0 1-8 0\"><\/path>\n                                                    <path d=\"M3.103 6.034h17.794\"><\/path>\n                                                    <path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path>\n                                                <\/svg>\n                                                <div>\n                                                    <p class=\"text-[11px] font-semibold text-ink-soft\">\n                                                        Variable product\n                                                    <\/p>\n                                                    <h3 class=\"text-[17px] font-extrabold text-ink\">Classic T-Shirt<\/h3>\n                                                <\/div>\n                                            <\/div>\n                                            <fieldset class=\"min-w-0\">\n                                                <legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Size<\/legend>\n                                                <div class=\"flex flex-wrap gap-2\">\n                                                    <label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_2_\" type=\"radio\" value=\"S\">S<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_2_\" type=\"radio\" value=\"M\">M<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_2_\" type=\"radio\" value=\"L\">L<\/label>\n                                                <\/div>\n                                            <\/fieldset>\n                                            <div class=\"mt-5\">\n                                                <button class=\"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 bg-primary text-primary-foreground shadow hover:bg-primary\/90 h-9 px-4 py-2 w-full\">\n                                                    <svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                                        <path d=\"M16 10a4 4 0 0 1-8 0\"><\/path>\n                                                        <path d=\"M3.103 6.034h17.794\"><\/path>\n                                                        <path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg>Add to Cart\n                                                <\/button>\n                                            <\/div>\n                                            <p aria-live=\"polite\" class=\"mt-2 min-h-5 text-center text-[11px] text-ink-soft\">\n                                                Illustrative storefront product\n                                            <\/p>\n                                        <\/article>\n                                    <\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/section>\n\n\n\t<section class=\"border-b border-hairline bg-surface\" aria-label='Compatibility and capability highlights'>\n\t\t<div class=\"mx-auto grid max-w-7xl grid-cols-2 gap-x-8 gap-y-8 px-4 py-11 sm:grid-cols-3 sm:px-6 lg:grid-cols-6 lg:py-12\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0 border-l-2 border-brand\/20 pl-4\">\n\t\t\t\t\t\t<p class=\"text-[14.5px] leading-snug font-extrabold text-ink\">\n\t\t\t\t\t\t\tRadio Button Variations\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[12.5px] leading-snug font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\tReplace standard dropdowns\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0 border-l-2 border-brand\/20 pl-4\">\n\t\t\t\t\t\t<p class=\"text-[14.5px] leading-snug font-extrabold text-ink\">\n\t\t\t\t\t\t\tShop Page Selection\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[12.5px] leading-snug font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\tChoose while browsing\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0 border-l-2 border-brand\/20 pl-4\">\n\t\t\t\t\t\t<p class=\"text-[14.5px] leading-snug font-extrabold text-ink\">\n\t\t\t\t\t\t\tFlexible Attribute Display\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[12.5px] leading-snug font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\tSeparate or merged options\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0 border-l-2 border-brand\/20 pl-4\">\n\t\t\t\t\t\t<p class=\"text-[14.5px] leading-snug font-extrabold text-ink\">\n\t\t\t\t\t\t\tCustom Styling\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[12.5px] leading-snug font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\tTemplates, HTML and CSS\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0 border-l-2 border-brand\/20 pl-4\">\n\t\t\t\t\t\t<p class=\"text-[14.5px] leading-snug font-extrabold text-ink\">\n\t\t\t\t\t\t\tSubscriptions Compatible\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[12.5px] leading-snug font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\tVariable subscription products\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0 border-l-2 border-brand\/20 pl-4\">\n\t\t\t\t\t\t<p class=\"text-[14.5px] leading-snug font-extrabold text-ink\">\n\t\t\t\t\t\t\tWPML &amp; Polylang\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[12.5px] leading-snug font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\tMultilingual compatibility\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t<\/section>\n\t\n\n<section class=\"border-b border-hairline bg-brand\/4\" id=\"problems\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-20\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">\n\t\t\t\t\tHidden options \u2192 visible choices\t\t\t\t<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">\n\t\t\t\t\tMake variation selection easier than opening one dropdown after another\t\t\t\t<\/h2>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<p class=\"mt-4 text-[15.5px] leading-[1.7] text-ink-soft\">\n\t\t\t\t\tKeep the WooCommerce product workflow. Give shoppers a clearer way to make their choices.\t\t\t\t<\/p>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<ul class=\"mt-10 space-y-4\">\n\t\t\t\t\t\t\t\t\t<li class=\"grid items-stretch gap-4 lg:grid-cols-[minmax(0,1fr)_44px_minmax(0,1fr)_minmax(0,230px)] lg:gap-5\">\n\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline border-l-4 border-l-ember\/30 bg-surface p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-ember uppercase\">Problem<\/p>\n\t\t\t\t\t\t\t<h3 class=\"mt-1.5 text-[16px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\tOptions are hidden behind several dropdowns.\t\t\t\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div aria-hidden=\"true\" class=\" items-center justify-center lg:flex\">\n\t\t\t\t\t\t\t<span class=\"inline-flex h-9 w-9 items-center justify-center rounded-full border border-hairline bg-surface text-brand shadow-sm\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex flex-col justify-center rounded-xl border border-hairline border-l-4 border-l-brand\/40 bg-brand\/6 p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-brand uppercase\">Solution<\/p>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[15px] leading-[1.6] font-semibold text-ink\">\n\t\t\t\t\t\t\t\tShow attributes as visible radio-button choices.\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex items-stretch\">\n\t\t\t\t\t\t\t<div class=\"flex w-full min-w-0 flex-col justify-center rounded-xl border border-dashed border-brand\/25 bg-surface px-4 py-3\">\n\t\t\t\t\t\t\t\t<p class=\"text-[10.5px] font-bold tracking-[0.12em] text-ink-soft uppercase\">Feature used<\/p>\n\t\t\t\t\t\t\t\t<p class=\"mt-1 flex items-start gap-2 text-[13px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-3.5 w-3.5 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t<span class=\"min-w-0\">Dropdown-to-radio conversion<\/span>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li class=\"grid items-stretch gap-4 lg:grid-cols-[minmax(0,1fr)_44px_minmax(0,1fr)_minmax(0,230px)] lg:gap-5\">\n\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline border-l-4 border-l-ember\/30 bg-surface p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-ember uppercase\">Problem<\/p>\n\t\t\t\t\t\t\t<h3 class=\"mt-1.5 text-[16px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\tEvery product needs another page visit.\t\t\t\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div aria-hidden=\"true\" class=\" items-center justify-center lg:flex\">\n\t\t\t\t\t\t\t<span class=\"inline-flex h-9 w-9 items-center justify-center rounded-full border border-hairline bg-surface text-brand shadow-sm\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex flex-col justify-center rounded-xl border border-hairline border-l-4 border-l-brand\/40 bg-brand\/6 p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-brand uppercase\">Solution<\/p>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[15px] leading-[1.6] font-semibold text-ink\">\n\t\t\t\t\t\t\t\tSelect variations directly from Shop and Archive pages.\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex items-stretch\">\n\t\t\t\t\t\t\t<div class=\"flex w-full min-w-0 flex-col justify-center rounded-xl border border-dashed border-brand\/25 bg-surface px-4 py-3\">\n\t\t\t\t\t\t\t\t<p class=\"text-[10.5px] font-bold tracking-[0.12em] text-ink-soft uppercase\">Feature used<\/p>\n\t\t\t\t\t\t\t\t<p class=\"mt-1 flex items-start gap-2 text-[13px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-3.5 w-3.5 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t<span class=\"min-w-0\">Shop-page selection<\/span>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li class=\"grid items-stretch gap-4 lg:grid-cols-[minmax(0,1fr)_44px_minmax(0,1fr)_minmax(0,230px)] lg:gap-5\">\n\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline border-l-4 border-l-ember\/30 bg-surface p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-ember uppercase\">Problem<\/p>\n\t\t\t\t\t\t\t<h3 class=\"mt-1.5 text-[16px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\tComplete combinations are hard to compare.\t\t\t\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div aria-hidden=\"true\" class=\" items-center justify-center lg:flex\">\n\t\t\t\t\t\t\t<span class=\"inline-flex h-9 w-9 items-center justify-center rounded-full border border-hairline bg-surface text-brand shadow-sm\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex flex-col justify-center rounded-xl border border-hairline border-l-4 border-l-brand\/40 bg-brand\/6 p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-brand uppercase\">Solution<\/p>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[15px] leading-[1.6] font-semibold text-ink\">\n\t\t\t\t\t\t\t\tPresent manageable sets of combinations together.\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex items-stretch\">\n\t\t\t\t\t\t\t<div class=\"flex w-full min-w-0 flex-col justify-center rounded-xl border border-dashed border-brand\/25 bg-surface px-4 py-3\">\n\t\t\t\t\t\t\t\t<p class=\"text-[10.5px] font-bold tracking-[0.12em] text-ink-soft uppercase\">Feature used<\/p>\n\t\t\t\t\t\t\t\t<p class=\"mt-1 flex items-start gap-2 text-[13px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-3.5 w-3.5 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t<span class=\"min-w-0\">Merged display<\/span>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li class=\"grid items-stretch gap-4 lg:grid-cols-[minmax(0,1fr)_44px_minmax(0,1fr)_minmax(0,230px)] lg:gap-5\">\n\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline border-l-4 border-l-ember\/30 bg-surface p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-ember uppercase\">Problem<\/p>\n\t\t\t\t\t\t\t<h3 class=\"mt-1.5 text-[16px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\tCustomers need to choose one attribute at a time.\t\t\t\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div aria-hidden=\"true\" class=\" items-center justify-center lg:flex\">\n\t\t\t\t\t\t\t<span class=\"inline-flex h-9 w-9 items-center justify-center rounded-full border border-hairline bg-surface text-brand shadow-sm\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex flex-col justify-center rounded-xl border border-hairline border-l-4 border-l-brand\/40 bg-brand\/6 p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-brand uppercase\">Solution<\/p>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[15px] leading-[1.6] font-semibold text-ink\">\n\t\t\t\t\t\t\t\tKeep size, color and other attributes independent.\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex items-stretch\">\n\t\t\t\t\t\t\t<div class=\"flex w-full min-w-0 flex-col justify-center rounded-xl border border-dashed border-brand\/25 bg-surface px-4 py-3\">\n\t\t\t\t\t\t\t\t<p class=\"text-[10.5px] font-bold tracking-[0.12em] text-ink-soft uppercase\">Feature used<\/p>\n\t\t\t\t\t\t\t\t<p class=\"mt-1 flex items-start gap-2 text-[13px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-3.5 w-3.5 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t<span class=\"min-w-0\">Separate display<\/span>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li class=\"grid items-stretch gap-4 lg:grid-cols-[minmax(0,1fr)_44px_minmax(0,1fr)_minmax(0,230px)] lg:gap-5\">\n\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline border-l-4 border-l-ember\/30 bg-surface p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-ember uppercase\">Problem<\/p>\n\t\t\t\t\t\t\t<h3 class=\"mt-1.5 text-[16px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\tStandard controls do not match your store.\t\t\t\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div aria-hidden=\"true\" class=\" items-center justify-center lg:flex\">\n\t\t\t\t\t\t\t<span class=\"inline-flex h-9 w-9 items-center justify-center rounded-full border border-hairline bg-surface text-brand shadow-sm\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex flex-col justify-center rounded-xl border border-hairline border-l-4 border-l-brand\/40 bg-brand\/6 p-4 shadow-sm\">\n\t\t\t\t\t\t\t<p class=\"text-[11px] font-bold tracking-[0.12em] text-brand uppercase\">Solution<\/p>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[15px] leading-[1.6] font-semibold text-ink\">\n\t\t\t\t\t\t\t\tAdjust the presentation with templates, HTML and CSS.\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<div class=\"flex items-stretch\">\n\t\t\t\t\t\t\t<div class=\"flex w-full min-w-0 flex-col justify-center rounded-xl border border-dashed border-brand\/25 bg-surface px-4 py-3\">\n\t\t\t\t\t\t\t\t<p class=\"text-[10.5px] font-bold tracking-[0.12em] text-ink-soft uppercase\">Feature used<\/p>\n\t\t\t\t\t\t\t\t<p class=\"mt-1 flex items-start gap-2 text-[13px] leading-snug font-bold text-ink\">\n\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-3.5 w-3.5 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t<span class=\"min-w-0\">Custom presentation<\/span>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t<\/ul>\n\t\t\t<\/div>\n<\/section>\n\n\n<section id=\"features\" class=\"border-b border-hairline\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-20\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Product features<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">Make variable products easier to understand and select<\/h2>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<p class=\"mt-4 text-[15.5px] leading-[1.7] text-ink-soft\">Radio-button presentation for the places your customers already shop.<\/p>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<div class=\"mt-12 space-y-14 lg:space-y-20\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<article class=\"grid items-center gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:gap-14\">\n\t\t\t\t\t\t<div class=\"\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"text-[12px] font-bold tracking-[0.14em] text-ink-soft uppercase\">01<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"mt-2 text-[21px] leading-snug font-extrabold text-ink sm:text-[24px]\">Show product choices instead of hiding them inside dropdowns<\/h3>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-3 max-w-[58ch] text-[15px] leading-[1.7] text-ink-soft\">Replace standard WooCommerce variation selectors with radio buttons so shoppers can see and compare available options directly.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"mt-5 space-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Visible attribute choices<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Familiar radio-button selection<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Keep your existing WooCommerce variations<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"504\" src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-01-1024x504.png\" class=\"rounded-xl shadow-card border border-hairline\" alt=\"\" srcset=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-01-1024x504.png 1024w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-01-300x148.png 300w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-01-768x378.png 768w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-01.png 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<article class=\"grid items-center gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:gap-14\">\n\t\t\t\t\t\t<div class=\"lg:order-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"text-[12px] font-bold tracking-[0.14em] text-ink-soft uppercase\">02<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"mt-2 text-[21px] leading-snug font-extrabold text-ink sm:text-[24px]\">Let customers choose before opening the product page<\/h3>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-3 max-w-[58ch] text-[15px] leading-[1.7] text-ink-soft\">Display variable product options directly on WooCommerce Shop and Archive pages, bringing selection closer to browsing.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"mt-5 space-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Shop and product-category pages<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Choose a variation before Add to Cart<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Fewer navigation steps<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"lg:order-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"515\" src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-02-1024x515.png\" class=\"rounded-xl shadow-card border border-hairline\" alt=\"\" srcset=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-02-1024x515.png 1024w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-02-300x151.png 300w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-02-768x386.png 768w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-02.png 1042w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<article class=\"grid items-center gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:gap-14\">\n\t\t\t\t\t\t<div class=\"\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"text-[12px] font-bold tracking-[0.14em] text-ink-soft uppercase\">03<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"mt-2 text-[21px] leading-snug font-extrabold text-ink sm:text-[24px]\">Keep each product attribute easy to scan<\/h3>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-3 max-w-[58ch] text-[15px] leading-[1.7] text-ink-soft\">Show attributes separately when customers should make one choice at a time. Size, color or material stay in their own groups.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"mt-5 space-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Independent attribute groups<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>ProClear labels for each choiceduct and category restrictions<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"381\" src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-03-1024x381.png\" class=\"rounded-xl shadow-card border border-hairline\" alt=\"\" srcset=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-03-1024x381.png 1024w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-03-300x112.png 300w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-03-768x286.png 768w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-03.png 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<article class=\"grid items-center gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:gap-14\">\n\t\t\t\t\t\t<div class=\"lg:order-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"text-[12px] font-bold tracking-[0.14em] text-ink-soft uppercase\">04<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"mt-2 text-[21px] leading-snug font-extrabold text-ink sm:text-[24px]\">Show complete variation combinations in one view<\/h3>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-3 max-w-[58ch] text-[15px] leading-[1.7] text-ink-soft\">Present combinations together when the set is small enough to compare comfortably. Choose the display that suits your products.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"mt-5 space-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Complete combinations in one list<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Best for a manageable number of options<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"lg:order-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"403\" src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-04-1024x403.png\" class=\"rounded-xl shadow-card border border-hairline\" alt=\"\" srcset=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-04-1024x403.png 1024w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-04-300x118.png 300w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-04-768x302.png 768w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-04.png 1042w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<article class=\"grid items-center gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:gap-14\">\n\t\t\t\t\t\t<div class=\"\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"text-[12px] font-bold tracking-[0.14em] text-ink-soft uppercase\">05<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"mt-2 text-[21px] leading-snug font-extrabold text-ink sm:text-[24px]\">Fit variation controls into your store design<\/h3>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-3 max-w-[58ch] text-[15px] leading-[1.7] text-ink-soft\">Use available display templates, custom HTML in the variations table and custom CSS to adjust the presentation.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"mt-5 space-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Multiple template options<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>Custom HTML and CSS support<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] font-medium text-ink\">\n\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t\t<span>No visual builder required<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"223\" src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-05-1024x223.png\" class=\"rounded-xl shadow-card border border-hairline\" alt=\"\" srcset=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-05-1024x223.png 1024w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-05-300x65.png 300w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-05-768x167.png 768w, https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/edd\/2026\/10\/Product-features-05.png 1278w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n<\/section>\n\n\n\n<section class=\"border-b border-hairline bg-brand\/4\" id=\"shop-page\"><div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-16\"><div class=\"max-w-3xl\"><p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Shop &amp; Archive pages<\/p><h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">Choose the variation while browsing the Shop<\/h2><p class=\"mt-4 text-[15.5px] leading-[1.7] text-ink-soft\">Customers can select what they want directly on Shop and Archive pages instead of opening each product first.<\/p><\/div><div class=\"mt-8 grid gap-5 md:grid-cols-3\"><article class=\"flex min-w-0 flex-col rounded-lg border border-hairline bg-surface p-5 shadow-card\"><div class=\"mb-4 flex items-center gap-3 border-b border-hairline pb-4\"><svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag h-6 w-6 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M16 10a4 4 0 0 1-8 0\"><\/path><path d=\"M3.103 6.034h17.794\"><\/path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg><div><p class=\"text-[11px] font-semibold text-ink-soft\">Variable product<\/p><h3 class=\"text-[17px] font-extrabold text-ink\">Classic Hoodie<\/h3><\/div><\/div><fieldset class=\"min-w-0\"><legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Size<\/legend><div class=\"flex flex-wrap gap-2\"><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_b_\" type=\"radio\" value=\"S\">S<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_b_\" type=\"radio\" value=\"M\">M<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_b_\" type=\"radio\" value=\"L\">L<\/label><\/div><\/fieldset><div class=\"mt-5\"><button class=\"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 bg-primary text-primary-foreground shadow hover:bg-primary\/90 h-9 px-4 py-2 w-full\"><svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M16 10a4 4 0 0 1-8 0\"><\/path><path d=\"M3.103 6.034h17.794\"><\/path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg>Add to Cart<\/button><\/div><p aria-live=\"polite\" class=\"mt-2 min-h-5 text-center text-[11px] text-ink-soft\">Illustrative storefront product<\/p><\/article><article class=\"flex min-w-0 flex-col rounded-lg border border-hairline bg-surface p-5 shadow-card\"><div class=\"mb-4 flex items-center gap-3 border-b border-hairline pb-4\"><svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag h-6 w-6 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M16 10a4 4 0 0 1-8 0\"><\/path><path d=\"M3.103 6.034h17.794\"><\/path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg><div><p class=\"text-[11px] font-semibold text-ink-soft\">Variable product<\/p><h3 class=\"text-[17px] font-extrabold text-ink\">Premium T-Shirt<\/h3><\/div><\/div><fieldset class=\"min-w-0\"><legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Color<\/legend><div class=\"flex flex-wrap gap-2\"><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_c_\" type=\"radio\" value=\"Black\">Black<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_c_\" type=\"radio\" value=\"White\">White<\/label><\/div><\/fieldset><div class=\"mt-5\"><button class=\"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 bg-primary text-primary-foreground shadow hover:bg-primary\/90 h-9 px-4 py-2 w-full\"><svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M16 10a4 4 0 0 1-8 0\"><\/path><path d=\"M3.103 6.034h17.794\"><\/path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg>Add to Cart<\/button><\/div><p aria-live=\"polite\" class=\"mt-2 min-h-5 text-center text-[11px] text-ink-soft\">Illustrative storefront product<\/p><\/article><article class=\"flex min-w-0 flex-col rounded-lg border border-hairline bg-surface p-5 shadow-card\"><div class=\"mb-4 flex items-center gap-3 border-b border-hairline pb-4\"><svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag h-6 w-6 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M16 10a4 4 0 0 1-8 0\"><\/path><path d=\"M3.103 6.034h17.794\"><\/path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg><div><p class=\"text-[11px] font-semibold text-ink-soft\">Variable product<\/p><h3 class=\"text-[17px] font-extrabold text-ink\">Coffee Box<\/h3><\/div><\/div><fieldset class=\"min-w-0\"><legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Pack size<\/legend><div class=\"flex flex-wrap gap-2\"><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_d_\" type=\"radio\" value=\"Small pack\">Small pack<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_d_\" type=\"radio\" value=\"Family pack\">Family pack<\/label><\/div><\/fieldset><div class=\"mt-5\"><button class=\"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 bg-primary text-primary-foreground shadow hover:bg-primary\/90 h-9 px-4 py-2 w-full\"><svg aria-hidden=\"true\" class=\"lucide lucide-shopping-bag\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M16 10a4 4 0 0 1-8 0\"><\/path><path d=\"M3.103 6.034h17.794\"><\/path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"><\/path><\/svg>Add to Cart<\/button><\/div><p aria-live=\"polite\" class=\"mt-2 min-h-5 text-center text-[11px] text-ink-soft\">Illustrative storefront product<\/p><\/article><\/div><\/div><\/section>\n\n\n\n<section class=\"border-b border-hairline\" id=\"display-options\"><div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-16\"><div class=\"max-w-3xl\"><p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Display options<\/p><h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">Choose how your variation options are presented<\/h2><p class=\"mt-4 text-[15.5px] leading-[1.7] text-ink-soft\">Use independent attributes or complete combinations. The right choice depends on your products and the number of available options.<\/p><\/div><div class=\"mt-8 grid items-start gap-6 md:grid-cols-2\"><div><div class=\"rounded-lg border border-hairline bg-surface p-6 shadow-card\"><p class=\"mb-5 text-[14px] font-bold text-brand\">Separate attributes<\/p><div class=\"space-y-4\"><fieldset class=\"min-w-0\"><legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Size<\/legend><div class=\"flex flex-wrap gap-2\"><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_e_\" type=\"radio\" value=\"Small\">Small<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_e_\" type=\"radio\" value=\"Medium\">Medium<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_e_\" type=\"radio\" value=\"Large\">Large<\/label><\/div><\/fieldset><fieldset class=\"min-w-0\"><legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Color<\/legend><div class=\"flex flex-wrap gap-2\"><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_f_\" type=\"radio\" value=\"Black\">Black<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_f_\" type=\"radio\" value=\"Blue\">Blue<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_f_\" type=\"radio\" value=\"White\">White<\/label><\/div><\/fieldset><\/div><\/div><p class=\"mt-4 text-[13px] leading-relaxed text-ink-soft\">For shoppers who should select each attribute independently.<\/p><\/div><div><div class=\"rounded-lg border border-hairline bg-surface p-6 shadow-card\"><p class=\"mb-5 text-[14px] font-bold text-brand\">Merged combinations<\/p><fieldset class=\"min-w-0\"><legend class=\"mb-2 text-[12px] font-bold text-ink-soft\">Available combinations<\/legend><div class=\"flex flex-wrap gap-2\"><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_g_\" type=\"radio\" value=\"Small \/ Black\">Small \/ Black<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_g_\" type=\"radio\" value=\"Small \/ Blue\">Small \/ Blue<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-brand bg-brand\/6 text-brand\"><input checked=\"\" class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_g_\" type=\"radio\" value=\"Medium \/ Blue\">Medium \/ Blue<\/label><label class=\"flex min-h-11 cursor-pointer items-center gap-2 rounded-md border px-3 py-2 text-[13px] font-semibold border-hairline bg-surface text-ink\"><input class=\"h-4 w-4 accent-brand export-style-871bc50d\" name=\"_r_g_\" type=\"radio\" value=\"Large \/ White\">Large \/ White<\/label><\/div><\/fieldset><\/div><p class=\"mt-4 text-[13px] leading-relaxed text-ink-soft\">For a manageable set of complete combinations that is easy to compare.<\/p><\/div><\/div><\/div><\/section>\n\n\n\n<section class=\"border-b border-hairline bg-surface-alt\" id=\"screenshots\">\n    <div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-16\">\n        <div class=\"max-w-3xl\">\n            <p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Inside the product<\/p>\n            <h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">\n                Original product visuals\n            <\/h2>\n        <\/div>\n        <div class=\"mt-8 grid items-start gap-8 md:grid-cols-3\">\n            <figure>\n                <a\n                    aria-label=\"Open full screenshot: Dropdown-to-radio variation presentation\"\n                    href=\"#\"\n                    rel=\"noreferrer\"\n                    target=\"_blank\"\n                    ><img decoding=\"async\"\n                        alt=\"Dropdown-to-radio variation presentation\"\n                        class=\"h-auto w-full rounded-lg border border-hairline bg-surface\"\n                        loading=\"eager\"\n                        src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-dropdown-radio.png\"\n                \/><\/a>\n                <figcaption class=\"mt-3 text-[12px] text-ink-soft\">\n                    Dropdown-to-radio variation presentation \u00b7 Original product visual\n                <\/figcaption>\n            <\/figure>\n            <figure>\n                <a\n                    aria-label=\"Open full screenshot: Shop-page variation selection\"\n                    href=\"#\"\n                    rel=\"noreferrer\"\n                    target=\"_blank\"\n                    ><img decoding=\"async\"\n                        alt=\"Shop-page variation selection\"\n                        class=\"h-auto w-full rounded-lg border border-hairline bg-surface\"\n                        loading=\"eager\"\n                        src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-shop.png\"\n                \/><\/a>\n                <figcaption class=\"mt-3 text-[12px] text-ink-soft\">\n                    Shop-page variation selection \u00b7 Original product visual\n                <\/figcaption>\n            <\/figure>\n            <figure>\n                <a\n                    aria-label=\"Open full screenshot: Product display and template options\"\n                    href=\"#\"\n                    rel=\"noreferrer\"\n                    target=\"_blank\"\n                    ><img decoding=\"async\"\n                        alt=\"Product display and template options\"\n                        class=\"h-auto w-full rounded-lg border border-hairline bg-surface\"\n                        loading=\"eager\"\n                        src=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-templates.png\"\n                \/><\/a>\n                <figcaption class=\"mt-3 text-[12px] text-ink-soft\">\n                    Product display and template options \u00b7 Original product visual\n                <\/figcaption>\n            <\/figure>\n        <\/div>\n    <\/div>\n<\/section>\n\n\n<section class=\"border-b border-hairline bg-surface-alt\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-10 sm:px-6 lg:py-14\">\n\t\t\t\t\t<h2 class=\"text-[12.5px] font-bold tracking-[0.14em] text-ink-soft uppercase\">\n\t\t\t\tMore of the essentials, built in\t\t\t<\/h2>\n\t\t\t\t\n\t\t\t\t\t<ul class=\"mt-5 grid gap-x-8 gap-y-2.5 sm:grid-cols-2 lg:grid-cols-4\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Product-page radio controls<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Shop-page selection<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Archive-page support<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Separate attributes<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Merged combinations<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Display templates<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Custom HTML<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Custom CSS<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Translation-ready<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Variable subscriptions<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>WPML compatibility<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Polylang compatibility<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[14px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Performance-focused code<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\t<\/div>\n<\/section>\n\n\n\n<section class=\"border-b border-hairline\"><div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-16\"><div class=\"max-w-3xl\"><p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">How it works<\/p><h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">From variable product to clearer product choices<\/h2><\/div><ol class=\"mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-4\"><li class=\"border-t-2 border-brand pt-4\"><p class=\"text-[12px] font-bold text-brand\">01<\/p><h3 class=\"mt-3 text-[17px] font-bold\">Keep your variable product<\/h3><p class=\"mt-2 text-[13px] leading-relaxed text-ink-soft\">Create products and variations using WooCommerce as usual.<\/p><\/li><li class=\"border-t-2 border-brand pt-4\"><p class=\"text-[12px] font-bold text-brand\">02<\/p><h3 class=\"mt-3 text-[17px] font-bold\">Choose your display<\/h3><p class=\"mt-2 text-[13px] leading-relaxed text-ink-soft\">Select radio-button presentation and the desired display style.<\/p><\/li><li class=\"border-t-2 border-brand pt-4\"><p class=\"text-[12px] font-bold text-brand\">03<\/p><h3 class=\"mt-3 text-[17px] font-bold\">Make options visible<\/h3><p class=\"mt-2 text-[13px] leading-relaxed text-ink-soft\">Customers see their choices without opening dropdowns.<\/p><\/li><li class=\"border-t-2 border-brand pt-4\"><p class=\"text-[12px] font-bold text-brand\">04<\/p><h3 class=\"mt-3 text-[17px] font-bold\">Select and add to cart<\/h3><p class=\"mt-2 text-[13px] leading-relaxed text-ink-soft\">The selected variation follows the normal WooCommerce cart workflow.<\/p><\/li><\/ol><p class=\"mt-8 flex flex-wrap items-center gap-3 text-[13px] font-bold text-brand\"><span>WooCommerce Variations<\/span><svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg><span>Radio Button Display<\/span><svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg><span>Customer Selection<\/span><svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg><span>Add to Cart<\/span><\/p><\/div><\/section>\n\n\n<section id=\"use-cases\" class=\"border-b border-hairline bg-surface-alt\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-20\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Use cases<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">A clearer variation experience for different product types<\/h2>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<div aria-label=\"Payment workflows\" class=\"mt-8 flex flex-wrap gap-2\" data-active-class=\"rounded-lg border px-4 py-2.5 text-[13.5px] font-semibold transition-colors border-brand bg-brand text-brand-foreground\" data-inactive-class=\"rounded-lg border px-4 py-2.5 text-[13.5px] font-semibold transition-colors border-hairline bg-surface text-ink-soft hover:text-ink\" data-tabs role=\"tablist\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button aria-controls=\"panel-uc_6ad043fa42d39_0\" aria-selected=\"true\" class=\"rounded-lg border px-4 py-2.5 text-[13.5px] font-semibold transition-colors border-brand bg-brand text-brand-foreground\" id=\"tab-uc_6ad043fa42d39_0\" role=\"tab\" type=\"button\">\n\t\t\t\t\t\tApparel\t\t\t\t\t<\/button>\n\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t\t\t\t\t<div aria-labelledby=\"tab-uc_6ad043fa42d39_0\" class=\"mt-8 rounded-2xl border border-hairline bg-surface p-6 shadow-card lg:p-9\"  id=\"panel-uc_6ad043fa42d39_0\" role=\"tabpanel\">\n\t\t\t\t\t<div class=\"grid gap-8 lg:grid-cols-[minmax(0,1fr)_minmax(0,1.15fr)] lg:gap-12\">\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"text-[20px] leading-snug font-extrabold text-ink sm:text-[23px]\">Size, color and fit in plain sight<\/h3>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mt-3 text-[14.5px] leading-[1.7] text-ink-soft\">Help shoppers compare product choices without opening several dropdowns.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t<ol class=\"space-y-3\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-center gap-3\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-full border border-hairline bg-surface-alt text-[12px] font-bold text-ink-soft\">1<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"flex-1 rounded-lg border border-hairline bg-surface-alt px-3.5 py-2.5 text-[14px] font-medium text-ink\">Browse a variable product<\/span>\n\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-center gap-3\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-full border border-hairline bg-surface-alt text-[12px] font-bold text-ink-soft\">2<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"flex-1 rounded-lg border border-hairline bg-surface-alt px-3.5 py-2.5 text-[14px] font-medium text-ink\">Select size, color and fit<\/span>\n\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-center gap-3\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-full border border-hairline bg-surface-alt text-[12px] font-bold text-ink-soft\">3<\/span>\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"flex-1 rounded-lg border border-hairline bg-surface-alt px-3.5 py-2.5 text-[14px] font-medium text-ink\">Add the chosen variation to cart<\/span>\n\t\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/ol>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n<\/section>\n\n\n<section class=\"border-b border-hairline bg-surface-alt\" id=\"compatibility\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-11 sm:px-6 lg:py-16\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Compatibility<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">Works with popular WooCommerce product workflows<\/h2>\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t<dl class=\"mt-7 grid gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline bg-surface px-4 py-3.5\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-bold tracking-[0.1em] text-ink-soft uppercase\">WooCommerce<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1.5 text-[14.5px] font-semibold text-ink\">Compatible<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline bg-surface px-4 py-3.5\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-bold tracking-[0.1em] text-ink-soft uppercase\">WooCommerce Subscriptions<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1.5 text-[14.5px] font-semibold text-ink\">Variable Subscription products<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline bg-surface px-4 py-3.5\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-bold tracking-[0.1em] text-ink-soft uppercase\">WPML<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1.5 text-[14.5px] font-semibold text-ink\">Compatible<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline bg-surface px-4 py-3.5\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-bold tracking-[0.1em] text-ink-soft uppercase\">Polylang<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1.5 text-[14.5px] font-semibold text-ink\">Compatible<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"rounded-xl border border-hairline bg-surface px-4 py-3.5\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-bold tracking-[0.1em] text-ink-soft uppercase\">Translation ready<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1.5 text-[14.5px] font-semibold text-ink\">Supported<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/dl>\n\t\t\t\t\n\t\t\t\t\t<p class=\"mt-5 text-[12.5px] text-ink-soft italic\">Test your theme and product configuration before going live. Current tested-version details are linked in technical information below.<\/p>\n\t\t\t<\/div>\n<\/section>\n\n\n<section id=\"support\" class=\"border-b border-hairline \">\n\t<div class=\"mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:py-24\">\n\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Customer stories<\/p>\n\t\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[28px] leading-tight font-extrabold text-ink sm:text-[36px]\">A clearer product experience. Support that follows through.<\/h2>\n\t\t\t\t\t\t\t\t<\/div>\n\n\t\t<div class=\"mt-10 grid gap-8 lg:grid-cols-[minmax(0,1.45fr)_minmax(0,1fr)] lg:gap-12\">\n\n\t\t\t\t\t\t<figure class=\"border-l-2 border-brand pl-6 lg:pl-8\">\n\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-quote h-7 w-7 text-brand\/30\" aria-hidden=\"true\"><path d=\"M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z\"><\/path><path d=\"M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z\"><\/path><\/svg>\t\t\t\t<blockquote class=\"mt-4 text-[22px] leading-[1.45] font-semibold text-ink text-balance sm:text-[27px]\">\n\t\t\t\t\t&ldquo;Not only a very useful and quality product, but the Support I got was far and away better than I\u2019ve ever experienced with any other plug-in product.&rdquo;\n\t\t\t\t<\/blockquote>\n\t\t\t\t<figcaption class=\"mt-6 text-[14px] text-ink-soft\">\n\t\t\t\t\t<span class=\"block font-bold text-ink\">Brian Walton<\/span>\n\t\t\t\t\t<span class=\"block\">Founder &amp; Marketing Director, e-Marketing Guru<\/span>\n\t\t\t\t\t<span class=\"mt-2 block text-[12.5px] font-semibold text-brand\">Shortened product-page review excerpt<\/span>\n\t\t\t\t<\/figcaption>\n\t\t\t<\/figure>\n\n\t\t\t\t\t\t\t<div class=\"flex flex-col gap-5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"border-t border-hairline pt-5\">\n\t\t\t\t\t\t\t<blockquote class=\"text-[14.5px] leading-[1.7] text-ink\">\n\t\t\t\t\t\t\t\t&ldquo;The plugin had incompatibility issues with another plugin, the support has reacted lightning fast, Dhruvin has debugged the plugin on the same day, now everything\u00b4s working perfectly.&rdquo;\n\t\t\t\t\t\t\t<\/blockquote>\n\t\t\t\t\t\t\t<figcaption class=\"mt-3 text-[13px] text-ink-soft\">\n\t\t\t\t\t\t\t\t<span class=\"font-semibold text-ink\">Attila Jaki<\/span>,\n\t\t\t\t\t\t\t\tFounder, Musamax\t\t\t\t\t\t\t\t<span class=\"mt-1.5 block text-[12px] font-semibold text-brand\">Shortened product-page review excerpt<\/span>\n\t\t\t\t\t\t\t<\/figcaption>\n\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\n\t\t\t\t\t<div class=\"rounded-xl border border-dashed border-hairline px-4 py-4 text-[12.5px] font-medium text-ink-soft\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t<\/div>\n<\/section>\n\n\n<section id=\"pricing\" class=\"border-b border-hairline bg-surface-alt\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-20\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Pricing<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">Choose the license that fits your store<\/h2>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<p class=\"mt-4 text-[15.5px] leading-[1.7] text-ink-soft\">The same product-selection tools, for one store or your whole portfolio. Prices in USD.<\/p>\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t<div aria-label=\"Billing term\" class=\"mt-8 inline-flex rounded-lg border border-hairline bg-surface p-1\" data-active-class=\"rounded-md px-4 py-2 text-[13.5px] font-semibold capitalize transition-colors bg-brand text-brand-foreground\" data-inactive-class=\"rounded-md px-4 py-2 text-[13.5px] font-semibold capitalize transition-colors text-ink-soft hover:text-ink\" data-term-toggle role=\"group\">\n\t\t\t\t<button aria-pressed=\"true\" class=\"rounded-md px-4 py-2 text-[13.5px] font-semibold capitalize transition-colors bg-brand text-brand-foreground\" data-term=\"annual\" type=\"button\">annual<\/button>\n\t\t\t\t<button aria-pressed=\"false\" class=\"rounded-md px-4 py-2 text-[13.5px] font-semibold capitalize transition-colors text-ink-soft hover:text-ink\" data-term=\"lifetime\" type=\"button\">lifetime<\/button>\n\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t<div class=\"mt-8 grid gap-5 lg:grid-cols-3\" data-term-panel=\"annual\">\n\t\t\t\t\t\t\t\t\t\t<article class=\"flex flex-col rounded-2xl border bg-surface p-6 lg:p-7 border-hairline shadow-card\">\n\t\t<div class=\"flex items-center justify-between gap-3\">\n\t\t\t<h3 class=\"text-[17px] font-extrabold text-ink\">\n\t\t\t\t1 Site\t\t\t<\/h3>\n\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<p class=\"mt-1.5 text-[13.5px] font-medium text-ink-soft\">\n\t\t\t\t1 website\t\t\t<\/p>\n\t\t\n\t\t<p class=\"mt-6 text-[32px] leading-none font-extrabold text-ink\">\n\t\t\t$39.99\t\t<\/p>\n\n\t\t\t\t\t<p class=\"mt-2 text-[13px] font-semibold text-ink-soft\">\n\t\t\t\tper year \u00b7 USD\t\t\t<\/p>\n\t\t\n\t\t\t\t\t<ul class=\"mt-6 space-y-2.5 border-t border-hairline pt-5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of updates<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of support<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Annual license term<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>30-day money-back guarantee<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\n\t\t\t\t\t<a class=\"mt-7 inline-flex items-center justify-center gap-2 rounded-lg px-5 py-3 text-[14.5px] font-semibold transition-colors border border-brand\/30 text-brand hover:bg-brand\/8\"\n\t\t\t\thref=\"https:\/\/imaginate-solutions.com\/downloads\/variations-radio-buttons-for-woocommerce\/\">\n\t\t\t\tBuy Variations Radio Buttons\t\t\t<\/a>\n\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t\t\t<article class=\"flex flex-col rounded-2xl border bg-surface p-6 lg:p-7 border-hairline shadow-card\">\n\t\t<div class=\"flex items-center justify-between gap-3\">\n\t\t\t<h3 class=\"text-[17px] font-extrabold text-ink\">\n\t\t\t\tUnlimited Sites\t\t\t<\/h3>\n\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<p class=\"mt-1.5 text-[13.5px] font-medium text-ink-soft\">\n\t\t\t\tUnlimited websites\t\t\t<\/p>\n\t\t\n\t\t<p class=\"mt-6 text-[32px] leading-none font-extrabold text-ink\">\n\t\t\t$79.99\t\t<\/p>\n\n\t\t\t\t\t<p class=\"mt-2 text-[13px] font-semibold text-ink-soft\">\n\t\t\t\tper year \u00b7 USD\t\t\t<\/p>\n\t\t\n\t\t\t\t\t<ul class=\"mt-6 space-y-2.5 border-t border-hairline pt-5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of updates<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of support<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Annual license term<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>30-day money-back guarantee<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\n\t\t\t\t\t<a class=\"mt-7 inline-flex items-center justify-center gap-2 rounded-lg px-5 py-3 text-[14.5px] font-semibold transition-colors border border-brand\/30 text-brand hover:bg-brand\/8\"\n\t\t\t\thref=\"https:\/\/imaginate-solutions.com\/downloads\/variations-radio-buttons-for-woocommerce\/\">\n\t\t\t\tBuy Variations Radio Buttons\t\t\t<\/a>\n\t\t\t<\/article>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t<div class=\"mt-8 grid gap-5 lg:grid-cols-3\" data-term-panel=\"lifetime\" hidden>\n\t\t\t\t\t\t\t\t\t\t<article class=\"flex flex-col rounded-2xl border bg-surface p-6 lg:p-7 border-hairline shadow-card\">\n\t\t<div class=\"flex items-center justify-between gap-3\">\n\t\t\t<h3 class=\"text-[17px] font-extrabold text-ink\">\n\t\t\t\tSingle Site\t\t\t<\/h3>\n\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<p class=\"mt-1.5 text-[13.5px] font-medium text-ink-soft\">\n\t\t\t\t1 Site\t\t\t<\/p>\n\t\t\n\t\t<p class=\"mt-6 text-[32px] leading-none font-extrabold text-ink\">\n\t\t\t$79.99\t\t<\/p>\n\n\t\t\t\t\t<p class=\"mt-2 text-[13px] font-semibold text-ink-soft\">\n\t\t\t\tper year \u00b7 USD\t\t\t<\/p>\n\t\t\n\t\t\t\t\t<ul class=\"mt-6 space-y-2.5 border-t border-hairline pt-5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of updates<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of support<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Annual license term<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>30-day money-back guarantee<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\n\t\t\t\t\t<a class=\"mt-7 inline-flex items-center justify-center gap-2 rounded-lg px-5 py-3 text-[14.5px] font-semibold transition-colors border border-brand\/30 text-brand hover:bg-brand\/8\"\n\t\t\t\thref=\"https:\/\/imaginate-solutions.com\/downloads\/variations-radio-buttons-for-woocommerce\/\">\n\t\t\t\tBuy Variations Radio Buttons\t\t\t<\/a>\n\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t\t\t<article class=\"flex flex-col rounded-2xl border bg-surface p-6 lg:p-7 border-hairline shadow-card\">\n\t\t<div class=\"flex items-center justify-between gap-3\">\n\t\t\t<h3 class=\"text-[17px] font-extrabold text-ink\">\n\t\t\t\tUnlimited Sites\t\t\t<\/h3>\n\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<p class=\"mt-1.5 text-[13.5px] font-medium text-ink-soft\">\n\t\t\t\tUnlimited websites\t\t\t<\/p>\n\t\t\n\t\t<p class=\"mt-6 text-[32px] leading-none font-extrabold text-ink\">\n\t\t\t$149.99\t\t<\/p>\n\n\t\t\t\t\t<p class=\"mt-2 text-[13px] font-semibold text-ink-soft\">\n\t\t\t\tper year \u00b7 USD\t\t\t<\/p>\n\t\t\n\t\t\t\t\t<ul class=\"mt-6 space-y-2.5 border-t border-hairline pt-5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of updates<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>1 year of support<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>Annual license term<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<li class=\"flex items-start gap-2 text-[13.5px] text-ink\">\n\t\t\t\t\t\t\t<svg aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclass=\"lucide lucide-check mt-0.5 h-4 w-4 shrink-0 text-brand\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M20 6 9 17l-5-5\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t<span>30-day money-back guarantee<\/span>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/ul>\n\t\t\n\t\t\t\t\t<a class=\"mt-7 inline-flex items-center justify-center gap-2 rounded-lg px-5 py-3 text-[14.5px] font-semibold transition-colors border border-brand\/30 text-brand hover:bg-brand\/8\"\n\t\t\t\thref=\"https:\/\/imaginate-solutions.com\/downloads\/variations-radio-buttons-for-woocommerce\/\">\n\t\t\t\tBuy Variations Radio Buttons\t\t\t<\/a>\n\t\t\t<\/article>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n<\/section>\n\n\n<section class=\"border-b border-hairline\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-10 sm:px-6 lg:py-12\">\n\t\t<div class=\"flex items-start gap-4 rounded-2xl border border-hairline bg-surface-alt p-5 lg:p-6\">\n\t\t\t<span class=\"inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-brand\/10 text-brand\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-shield-check h-5.5 w-5.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t<path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"><\/path>\n\t\t\t\t\t<path d=\"m9 12 2 2 4-4\"><\/path>\n\t\t\t\t<\/svg>\n\t\t\t<\/span>\n\t\t\t<div>\n\t\t\t\t\t\t\t\t\t<h2 class=\"text-[17px] font-extrabold text-ink\">Try it with confidence<\/h2>\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t<p class=\"mt-1.5 max-w-[70ch] text-[14px] leading-[1.7] text-ink-soft\">Your purchase is protected by a 30-day money-back guarantee according to the refund policy.<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n<\/section>\n\n\n<section id=\"faq\" class=\"border-b border-hairline bg-surface-alt\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:py-20\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">FAQ<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">Your variation-selection questions, answered<\/h2>\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t<div class=\"mt-9 grid gap-3 lg:grid-cols-2 lg:gap-x-6\">\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tWhat does Variations Radio Buttons for WooCommerce do?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">It replaces standard WooCommerce variation dropdowns with radio-button-style choices and offers flexible attribute display.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tDoes it replace WooCommerce variation dropdowns?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. It changes how variation choices are presented, not how the underlying WooCommerce variations are created.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tCan radio buttons appear on WooCommerce Shop pages?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Customers can select variable product options directly on Shop pages.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tDoes it work on product-category and Archive pages?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. The plugin supports variation selection on WooCommerce Archive pages.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tCan I display attributes separately?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Attributes can be shown as independent groups so customers select each one separately.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tCan I show complete variation combinations?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Merged display presents complete combinations in one view. This is most useful for a manageable number of choices.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tCan I customize the appearance?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Use available display templates and custom HTML or CSS to adjust the presentation.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tCan I add custom CSS?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Custom CSS is supported for store-specific styling.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tCan I add custom HTML?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Custom HTML is supported in the variations table.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tDoes it work with WooCommerce Subscriptions?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. The plugin supports Variable Subscription products.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tIs it compatible with WPML?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. WPML compatibility is listed for this product.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\t Is it compatible with Polylang?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Yes. Polylang compatibility is listed for this product.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tDoes it change how WooCommerce variations are created?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">No. Continue creating attributes and variations in WooCommerce. The plugin changes their storefront presentation.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tWhat support is included?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Annual licenses include one year of support and updates. Lifetime licenses include lifetime support and updates. Confirm annual renewal terms on the purchase page.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t\t\t<details class=\"group rounded-xl border border-hairline bg-surface px-4 py-1 open:border-brand\/30\">\n\t\t\t\t\t\t<summary class=\"flex cursor-pointer items-center justify-between gap-4 py-3.5 text-[14.5px] font-semibold text-ink marker:content-none\">\n\t\t\t\t\t\t\tWhat is the refund policy?\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-chevron-down h-4 w-4 shrink-0 text-ink-soft transition-transform group-open:rotate-180\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"m6 9 6 6 6-6\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t\t\t<p class=\"pb-4 text-[13.5px] leading-[1.7] text-ink-soft\">Purchases are covered by a 30-day money-back guarantee according to the published refund policy.<\/p>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n<\/section>\n\n\n<section id=\"technical\" class=\"border-b border-hairline\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-10 sm:px-6 lg:py-14\">\n\t\t\t\t\t<h2 class=\"text-[12.5px] font-bold tracking-[0.14em] text-ink-soft uppercase\">Technical information<\/h2>\n\t\t\t\t\n\t\t\t\t\t<dl class=\"mt-5 grid gap-x-8 gap-y-3 sm:grid-cols-2 lg:grid-cols-4\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">Current version<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">See current product metadata<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">Last updated<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">Confirm with product support<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">WordPress tested up to <\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">See current product metadata<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">WooCommerce tested up to <\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">See current product metadata<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">PHP requirement <\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">Confirm with product support<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">WooCommerce Subscriptions<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">Variable subscriptions supported<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">WPML<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">Compatible<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"border-t border-hairline pt-3\">\n\t\t\t\t\t\t\t<dt class=\"text-[12px] font-medium text-ink-soft\">Polylang<\/dt>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dd class=\"mt-1 text-[14px] font-semibold text-ink\">Compatible<\/dd>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/dl>\n\t\t\t\t\n\t\t\t\t\t<div class=\"mt-6 flex flex-wrap gap-x-6 gap-y-2\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"inline-flex items-center gap-1.5 text-[13.5px] font-semibold text-brand hover:underline\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\t\tCurrent product metadata\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3.5 w-3.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"inline-flex items-center gap-1.5 text-[13.5px] font-semibold text-brand hover:underline\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\t\tDocumentation &amp; changelog enquiries\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3.5 w-3.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"inline-flex items-center gap-1.5 text-[13.5px] font-semibold text-brand hover:underline\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\t\tRefund policy\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3.5 w-3.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewbox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t\t\t<p class=\"mt-4 text-[12px] text-ink-soft italic\">Current version, update, tested-version and PHP details require confirmation with product support. The original page currently links documentation and changelog for a different plugin; request product-specific references before relying on those links.<\/p>\n\t\t\t<\/div>\n<\/section>\n\n\n<section class=\"border-b border-hairline bg-surface-alt\">\n\t<div class=\"mx-auto max-w-7xl px-4 py-11 sm:px-6 lg:py-16\">\n\t\t<div class=\"max-w-3xl\">\n\t\t\t\t\t\t\t<p class=\"text-[12.5px] font-bold tracking-[0.14em] text-brand uppercase\">Related plugins<\/p>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h2 class=\"mt-3 text-[26px] leading-tight font-extrabold text-ink sm:text-[34px]\">More WooCommerce tools from Imaginate Solutions<\/h2>\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t<div class=\"mt-8 grid gap-5 lg:grid-cols-3\">\n\t\t\t\t\t\t\t\t\t<article class=\"flex items-start gap-4 rounded-xl border bg-surface p-5 transition-colors hover:border-brand\/30 border-brand\/30 shadow-card\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-brand\/10 text-brand\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"mb-3 h-6 w-6 text-brand\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" viewBox=\"0 0 24 24\"><path d=\"M12 16V6m0 0 3.5 3.5M12 6 8.5 9.5\"><\/path><path d=\"M4 15v3a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-3\"><\/path><\/svg>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"mb-1.5 inline-flex rounded bg-brand\/10 px-2 py-0.5 text-[10.5px] font-bold tracking-[0.06em] text-brand uppercase\">File Uploads Addon for WooCommerce<\/p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h3 class=\"text-[15.5px] leading-snug font-bold text-ink\">Collect customer artwork and documents on product pages.<\/h3>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[13px] leading-[1.6] text-ink-soft\">Show or hide payment methods based on the customer&#039;s user role.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"mt-3 inline-flex items-center gap-1.5 text-[13px] font-semibold text-brand hover:underline\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\t\t\t\tView Plugin\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3.5 w-3.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t<article class=\"flex items-start gap-4 rounded-xl border bg-surface p-5 transition-colors hover:border-brand\/30 border-hairline\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-brand\/10 text-brand\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"mb-3 h-6 w-6 text-brand\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" viewBox=\"0 0 24 24\"><path d=\"M3 7h10v9H3zM13 10h4l3 3v3h-7z\"><\/path><circle cx=\"7\" cy=\"18\" r=\"1.6\"><\/circle><circle cx=\"17\" cy=\"18\" r=\"1.6\"><\/circle><\/svg>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h3 class=\"text-[15.5px] leading-snug font-bold text-ink\">Custom Shipping Methods for WooCommerce<\/h3>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[13px] leading-[1.6] text-ink-soft\">Define shipping calculations around your delivery rules.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"mt-3 inline-flex items-center gap-1.5 text-[13px] font-semibold text-brand hover:underline\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\t\t\t\tView Plugin\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3.5 w-3.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t\t\t<article class=\"flex items-start gap-4 rounded-xl border bg-surface p-5 transition-colors hover:border-brand\/30 border-hairline\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-brand\/10 text-brand\">\n\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"mb-3 h-6 w-6 text-brand\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" viewBox=\"0 0 24 24\"><rect height=\"14\" rx=\"2\" width=\"18\" x=\"3\" y=\"5\"><\/rect><path d=\"M3 10h18M7 15h4\"><\/path><\/svg>\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"min-w-0\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t<h3 class=\"text-[15.5px] leading-snug font-bold text-ink\">Custom Payment Gateways for WooCommerce<\/h3>\n\t\t\t\t\t\t\t<p class=\"mt-1.5 text-[13px] leading-[1.6] text-ink-soft\">Add store-defined payment methods to checkout.<\/p>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"mt-3 inline-flex items-center gap-1.5 text-[13px] font-semibold text-brand hover:underline\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\t\t\t\tView Plugin\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-3.5 w-3.5\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/article>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n<\/section>\n\n\n<section class=\"relative overflow-hidden border-b border-hairline\">\n\t<div aria-hidden=\"true\" class=\"pointer-events-none absolute inset-0 bg-gradient-to-br from-brand\/8 via-surface to-magenta\/6\"><\/div>\n\t<div class=\"relative mx-auto max-w-3xl px-4 py-12 text-center sm:px-6 lg:py-20\">\n\t\t\t\t\t<h2 class=\"text-[27px] leading-tight font-extrabold text-ink sm:text-[36px]\">Make WooCommerce product variations easier to choose<\/h2>\n\t\t\t\t\n\t\t\t\t\t<p class=\"mx-auto mt-4 max-w-[58ch] text-[16px] leading-[1.7] text-ink-soft\">Replace dropdowns with visible radio-button options and give customers a clearer path from product choice to Add to Cart.<\/p>\n\t\t\t\t\n\t\t\t\t\t<div class=\"mt-8 flex flex-col items-center justify-center gap-3 sm:flex-row\">\n\t\t\t\t\t\t\t\t\t<a class=\"inline-flex w-full items-center justify-center gap-2 rounded-lg px-6 py-3.5 text-[15px] font-semibold transition-colors sm:w-auto bg-brand text-brand-foreground hover:bg-brand-deep\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\tBuy Variations Radio Buttons\t\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"lucide lucide-arrow-right h-4 w-4\" fill=\"none\" height=\"24\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n\t\t\t\t\t\t\t\t<path d=\"M5 12h14\"><\/path>\n\t\t\t\t\t\t\t\t<path d=\"m12 5 7 7-7 7\"><\/path>\n\t\t\t\t\t\t\t<\/svg>\n\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t<a class=\"inline-flex w-full items-center justify-center gap-2 rounded-lg px-6 py-3.5 text-[15px] font-semibold transition-colors sm:w-auto border border-brand\/30 bg-surface text-brand hover:bg-brand\/8\" href=\"#\" target=\"_self\">\n\t\t\t\t\t\tRequest Documentation\t\t\t\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>Variations Radio Buttons Overview Features Shop Page Display Options Compatibility Pricing FAQ Jump to sectionOverviewFeaturesShop PageDisplay OptionsCompatibilityPricingFAQ Buy Now WooCommerce Variation Plugin Variations Radio Buttons for WooCommerce Make product variations easier to see and choose. Replace variation dropdowns with visible radio-button options. Show more choices at once and let customers select variations directly from product, [&hellip;]<\/p>\n","protected":false},"author":110,"featured_media":0,"template":"","edd-categories":[12],"edd-tags":[36,2],"class_list":["post-4989","download","type-download","status-publish","hentry","download_category-premium-plugins","download_tag-variation-radio-buttons","download_tag-woocommerce","edd-download","edd-download-cat-premium-plugins","edd-download-tag-variation-radio-buttons","edd-download-tag-woocommerce"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Variations Radio Buttons for WooCommerce - Imaginate Solutions<\/title>\n<meta name=\"description\" content=\"Variation Radio Buttons for WooCommerce allows to replace dropdowns for your variations with radio buttons improving the shopping experience.\" \/>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Variations Radio Buttons for WooCommerce - Imaginate Solutions\" \/>\n<meta property=\"og:description\" content=\"Variation Radio Buttons for WooCommerce allows to replace dropdowns for your variations with radio buttons improving the shopping experience.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/\" \/>\n<meta property=\"og:site_name\" content=\"Imaginate Solutions\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-13T12:14:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-icon.png\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/\",\"url\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/\",\"name\":\"Variations Radio Buttons for WooCommerce - Imaginate Solutions\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/variations-icon.png\",\"datePublished\":\"2021-05-12T12:57:18+00:00\",\"dateModified\":\"2026-10-13T12:14:03+00:00\",\"description\":\"Variation Radio Buttons for WooCommerce allows to replace dropdowns for your variations with radio buttons improving the shopping experience.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/#primaryimage\",\"url\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/variations-icon.png\",\"contentUrl\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/variations-icon.png\",\"width\":600,\"height\":600},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/variations-radio-buttons-for-woocommerce\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Downloads\",\"item\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/downloads\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Variations Radio Buttons for WooCommerce\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/#website\",\"url\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/\",\"name\":\"Imaginate Solutions\",\"description\":\"Complete Web Solution for you\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/sandbox.imaginate-solutions.com\\\/imaginate\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Variations Radio Buttons for WooCommerce - Imaginate Solutions","description":"Variation Radio Buttons for WooCommerce allows to replace dropdowns for your variations with radio buttons improving the shopping experience.","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"Variations Radio Buttons for WooCommerce - Imaginate Solutions","og_description":"Variation Radio Buttons for WooCommerce allows to replace dropdowns for your variations with radio buttons improving the shopping experience.","og_url":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/","og_site_name":"Imaginate Solutions","article_modified_time":"2026-10-13T12:14:03+00:00","og_image":[{"url":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-icon.png","type":"","width":"","height":""}],"twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/","url":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/","name":"Variations Radio Buttons for WooCommerce - Imaginate Solutions","isPartOf":{"@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/#website"},"primaryImageOfPage":{"@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/#primaryimage"},"image":{"@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/#primaryimage"},"thumbnailUrl":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-icon.png","datePublished":"2021-05-12T12:57:18+00:00","dateModified":"2026-10-13T12:14:03+00:00","description":"Variation Radio Buttons for WooCommerce allows to replace dropdowns for your variations with radio buttons improving the shopping experience.","breadcrumb":{"@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/#primaryimage","url":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-icon.png","contentUrl":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-content\/uploads\/2026\/10\/variations-icon.png","width":600,"height":600},{"@type":"BreadcrumbList","@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/variations-radio-buttons-for-woocommerce\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/"},{"@type":"ListItem","position":2,"name":"Downloads","item":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/downloads\/"},{"@type":"ListItem","position":3,"name":"Variations Radio Buttons for WooCommerce"}]},{"@type":"WebSite","@id":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/#website","url":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/","name":"Imaginate Solutions","description":"Complete Web Solution for you","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/edd-downloads\/4989","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/edd-downloads"}],"about":[{"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/types\/download"}],"author":[{"embeddable":true,"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/users\/110"}],"version-history":[{"count":19,"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/edd-downloads\/4989\/revisions"}],"predecessor-version":[{"id":8607,"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/edd-downloads\/4989\/revisions\/8607"}],"wp:attachment":[{"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/media?parent=4989"}],"wp:term":[{"taxonomy":"download_category","embeddable":true,"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/edd-categories?post=4989"},{"taxonomy":"download_tag","embeddable":true,"href":"https:\/\/sandbox.imaginate-solutions.com\/imaginate\/wp-json\/wp\/v2\/edd-tags?post=4989"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}