{"id":4133,"date":"2026-05-19T09:07:22","date_gmt":"2026-05-19T09:07:22","guid":{"rendered":"https:\/\/dindex.net\/custom-store\/"},"modified":"2026-08-20T10:44:59","modified_gmt":"2026-08-20T10:44:59","slug":"custom-store","status":"publish","type":"page","link":"https:\/\/dindex.net\/en\/custom-store\/","title":{"rendered":"Custom Store"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"4133\" class=\"elementor elementor-4133 elementor-2914\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5e17acf e-flex e-con-boxed e-con e-parent\" data-id=\"5e17acf\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f658084 elementor-widget elementor-widget-html\" data-id=\"f658084\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-store-hero-en),\n.elementor-widget-html:has(#dx-custom-store-hero-en) > .elementor-widget-container,\n.dx-custom-store-hero-en-fullwidth,\n.dx-custom-store-hero-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-store-hero-en,\n#dx-custom-store-hero-en *,\n#dx-custom-store-hero-en *::before,\n#dx-custom-store-hero-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-store-hero-en {\n    --dx-dark: #09001f;\n    --dx-dark-secondary: #16053c;\n    --dx-white: #ffffff;\n    --dx-text: rgba(255, 255, 255, 0.76);\n    --dx-muted: rgba(255, 255, 255, 0.54);\n    --dx-purple: #6942d8;\n    --dx-purple-light: #9168ef;\n    --dx-yellow: #ffc441;\n    --dx-yellow-light: #ffd66e;\n    --dx-green: #54d696;\n    --dx-blue: #58a8f7;\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-white);\n\n    background:\n        radial-gradient(\n            circle at 10% 14%,\n            rgba(145, 104, 239, 0.28),\n            transparent 29%\n        ),\n        radial-gradient(\n            circle at 88% 84%,\n            rgba(105, 66, 216, 0.22),\n            transparent 31%\n        ),\n        linear-gradient(\n            145deg,\n            var(--dx-dark-secondary),\n            var(--dx-dark)\n        );\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-store-hero-en a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-store-hero-en img {\n    display: block;\n    max-width: 100%;\n}\n\n#dx-custom-store-hero-en .dx-csh-grid {\n    position: absolute;\n    z-index: -6;\n    inset: 0;\n    opacity: 0.11;\n\n    background-image:\n        linear-gradient(\n            rgba(255,255,255,.045) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(255,255,255,.045) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 15%,\n            transparent 84%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 15%,\n            transparent 84%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-store-hero-en .dx-csh-glow {\n    position: absolute;\n    z-index: -5;\n    border-radius: 50%;\n    filter: blur(110px);\n    pointer-events: none;\n}\n\n#dx-custom-store-hero-en .dx-csh-glow-one {\n    top: -170px;\n    right: 30%;\n    width: 430px;\n    height: 430px;\n    background: rgba(145, 104, 239, 0.18);\n}\n\n#dx-custom-store-hero-en .dx-csh-glow-two {\n    left: -170px;\n    bottom: -210px;\n    width: 470px;\n    height: 430px;\n    background: rgba(255, 196, 65, 0.055);\n}\n\n#dx-custom-store-hero-en .dx-csh-main {\n    position: relative;\n    z-index: 2;\n    width: 100%;\n    padding:\n        82px\n        clamp(22px, 5vw, 90px)\n        88px;\n}\n\n#dx-custom-store-hero-en .dx-csh-container {\n    width: min(1450px, 100%);\n    min-height: 650px;\n    margin: 0 auto;\n\n    display: grid;\n    grid-template-columns:\n        minmax(0, 0.92fr)\n        minmax(500px, 1.08fr);\n\n    align-items: center;\n    gap: clamp(55px, 7vw, 105px);\n}\n\n#dx-custom-store-hero-en .dx-csh-content {\n    position: relative;\n    z-index: 4;\n    min-width: 0;\n}\n\n#dx-custom-store-hero-en .dx-csh-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    margin-bottom: 15px;\n    color: var(--dx-yellow);\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-store-hero-en .dx-csh-eyebrow::before {\n    content: \"\";\n    width: 38px;\n    height: 2px;\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-store-hero-en .dx-csh-title {\n    max-width: 760px;\n    margin: 0;\n    color: var(--dx-white);\n\n    font-size: clamp(41px, 4.5vw, 66px);\n    font-weight: 900;\n    line-height: 1.38;\n    letter-spacing: -0.6px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-store-hero-en .dx-csh-title span {\n    display: block;\n    color: var(--dx-yellow);\n}\n\n#dx-custom-store-hero-en .dx-csh-description {\n    max-width: 690px;\n    margin: 20px 0 0;\n    color: var(--dx-text);\n    font-size: 16px;\n    font-weight: 500;\n    line-height: 2.05;\n    text-wrap: pretty;\n}\n\n#dx-custom-store-hero-en .dx-csh-description strong {\n    color: #ffffff;\n    font-weight: 900;\n}\n\n#dx-custom-store-hero-en .dx-csh-actions {\n    margin-top: 30px;\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n    gap: 12px;\n}\n\n#dx-custom-store-hero-en .dx-csh-button {\n    min-width: 205px;\n    min-height: 56px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 9px;\n\n    padding: 0 24px;\n\n    border: 1px solid transparent;\n    border-radius: 13px;\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1;\n\n    transition:\n        transform 0.25s ease,\n        box-shadow 0.25s ease,\n        border-color 0.25s ease,\n        background 0.25s ease;\n}\n\n#dx-custom-store-hero-en .dx-csh-button-primary {\n    color: #180b35;\n    border-color: rgba(255, 255, 255, 0.13);\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-yellow),\n            var(--dx-yellow-light)\n        );\n\n    box-shadow:\n        0 18px 40px rgba(255, 196, 65, 0.22);\n}\n\n#dx-custom-store-hero-en .dx-csh-button-secondary {\n    color: #ffffff;\n    border-color: rgba(255, 255, 255, 0.14);\n    background: rgba(255, 255, 255, 0.06);\n    box-shadow: 0 14px 34px rgba(2, 0, 20, 0.20);\n\n    -webkit-backdrop-filter: blur(8px);\n    backdrop-filter: blur(8px);\n}\n\n#dx-custom-store-hero-en .dx-csh-button:hover,\n#dx-custom-store-hero-en .dx-csh-button:focus-visible {\n    transform: translateY(-3px);\n}\n\n#dx-custom-store-hero-en .dx-csh-button-primary:hover,\n#dx-custom-store-hero-en .dx-csh-button-primary:focus-visible {\n    box-shadow:\n        0 24px 50px rgba(255, 196, 65, 0.31);\n}\n\n#dx-custom-store-hero-en .dx-csh-button-secondary:hover,\n#dx-custom-store-hero-en .dx-csh-button-secondary:focus-visible {\n    border-color: rgba(145, 104, 239, 0.42);\n    background: rgba(145, 104, 239, 0.12);\n}\n\n#dx-custom-store-hero-en .dx-csh-button svg {\n    width: 18px;\n    height: 18px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-hero-en .dx-csh-features {\n    margin-top: 24px;\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n    gap: 10px 22px;\n}\n\n#dx-custom-store-hero-en .dx-csh-feature {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: var(--dx-muted);\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1.6;\n}\n\n#dx-custom-store-hero-en .dx-csh-feature-icon {\n    width: 22px;\n    height: 22px;\n    flex: 0 0 22px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 8px;\n\n    color: #7ce3b3;\n    background: rgba(84, 214, 150, 0.12);\n}\n\n#dx-custom-store-hero-en .dx-csh-feature-icon svg {\n    width: 12px;\n    height: 12px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.3;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-hero-en .dx-csh-visual {\n    position: relative;\n    min-width: 0;\n    min-height: 610px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n#dx-custom-store-hero-en .dx-csh-visual-frame {\n    position: absolute;\n    inset: 40px 8px;\n\n    border: 1px solid rgba(255, 255, 255, 0.11);\n    border-radius: 40px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.07),\n            rgba(255, 255, 255, 0.025)\n        );\n\n    box-shadow:\n        inset 0 1px 0 rgba(255, 255, 255, 0.05);\n\n    -webkit-backdrop-filter: blur(10px);\n    backdrop-filter: blur(10px);\n}\n\n#dx-custom-store-hero-en .dx-csh-visual-frame::before {\n    content: \"\";\n    position: absolute;\n    top: -1px;\n    right: -1px;\n    width: 38%;\n    height: 38%;\n\n    border-top: 1px solid rgba(255, 196, 65, 0.38);\n    border-right: 1px solid rgba(255, 196, 65, 0.38);\n    border-radius: 0 40px 0 0;\n}\n\n#dx-custom-store-hero-en .dx-csh-visual-frame::after {\n    content: \"\";\n    position: absolute;\n    left: -1px;\n    bottom: -1px;\n    width: 38%;\n    height: 38%;\n\n    border-bottom: 1px solid rgba(145, 104, 239, 0.45);\n    border-left: 1px solid rgba(145, 104, 239, 0.45);\n    border-radius: 0 0 0 40px;\n}\n\n#dx-custom-store-hero-en .dx-csh-browser {\n    position: relative;\n    z-index: 4;\n\n    width: min(610px, 92%);\n\n    overflow: hidden;\n\n    border: 1px solid rgba(255, 255, 255, 0.14);\n    border-radius: 24px;\n\n    background: #0d0921;\n\n    box-shadow:\n        0 38px 85px rgba(0, 0, 0, 0.42),\n        0 0 0 1px rgba(105, 66, 216, 0.12);\n\n    transform:\n        perspective(1300px)\n        rotateY(-6deg)\n        rotateX(1deg);\n\n    transition:\n        transform 0.45s ease,\n        box-shadow 0.45s ease;\n}\n\n#dx-custom-store-hero-en .dx-csh-browser:hover {\n    transform:\n        perspective(1300px)\n        rotateY(0deg)\n        rotateX(0deg)\n        translateY(-5px);\n\n    box-shadow:\n        0 45px 95px rgba(0, 0, 0, 0.48),\n        0 0 0 1px rgba(145, 104, 239, 0.18);\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-bar {\n    height: 45px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    padding: 0 15px;\n\n    border-bottom: 1px solid rgba(255, 255, 255, 0.08);\n\n    background:\n        linear-gradient(\n            180deg,\n            #171127,\n            #0d091b\n        );\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-address {\n    width: 52%;\n    height: 11px;\n    border-radius: 999px;\n    background: rgba(255,255,255,.07);\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-dots {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    direction: ltr;\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-dot:nth-child(1) {\n    background: #ff6e6e;\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-dot:nth-child(2) {\n    background: var(--dx-yellow);\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-dot:nth-child(3) {\n    background: var(--dx-green);\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-screen {\n    position: relative;\n    overflow: hidden;\n    background: #0d0921;\n}\n\n#dx-custom-store-hero-en .dx-csh-browser-screen img {\n    width: 100%;\n    height: auto;\n    aspect-ratio: 4 \/ 3;\n    object-fit: cover;\n    object-position: top center;\n}\n\n#dx-custom-store-hero-en .dx-csh-code-pill {\n    position: absolute;\n    z-index: 6;\n\n    top: 83px;\n    left: 16px;\n\n    min-width: 180px;\n\n    padding: 14px 16px;\n\n    border: 1px solid rgba(255, 255, 255, 0.13);\n    border-radius: 15px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(30, 15, 70, 0.92),\n            rgba(11, 3, 35, 0.94)\n        );\n\n    box-shadow:\n        0 18px 45px rgba(0,0,0,.30);\n\n    -webkit-backdrop-filter: blur(12px);\n    backdrop-filter: blur(12px);\n}\n\n#dx-custom-store-hero-en .dx-csh-code-label {\n    display: block;\n    color: var(--dx-yellow);\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-store-hero-en .dx-csh-code-text {\n    display: block;\n    margin-top: 5px;\n    color: rgba(255,255,255,.66);\n\n    font-family:\n        Consolas,\n        Monaco,\n        monospace;\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.55;\n}\n\n#dx-custom-store-hero-en .dx-csh-api-pill {\n    position: absolute;\n    z-index: 6;\n\n    right: 14px;\n    bottom: 78px;\n\n    min-width: 188px;\n\n    display: flex;\n    align-items: center;\n    gap: 11px;\n\n    padding: 13px 15px;\n\n    border: 1px solid rgba(255, 255, 255, 0.13);\n    border-radius: 15px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(30, 15, 70, 0.92),\n            rgba(11, 3, 35, 0.94)\n        );\n\n    box-shadow:\n        0 18px 45px rgba(0,0,0,.30);\n\n    -webkit-backdrop-filter: blur(12px);\n    backdrop-filter: blur(12px);\n}\n\n#dx-custom-store-hero-en .dx-csh-api-icon {\n    width: 40px;\n    height: 40px;\n    flex: 0 0 40px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 12px;\n\n    color: #7ce3b3;\n    background: rgba(84, 214, 150, 0.12);\n}\n\n#dx-custom-store-hero-en .dx-csh-api-icon svg {\n    width: 20px;\n    height: 20px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.9;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-hero-en .dx-csh-api-title {\n    display: block;\n    color: #ffffff;\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-store-hero-en .dx-csh-api-text {\n    display: block;\n    margin-top: 3px;\n    color: rgba(255,255,255,.54);\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.5;\n}\n\n@media (max-width: 1120px) {\n    #dx-custom-store-hero-en .dx-csh-container {\n        grid-template-columns:\n            minmax(0, 0.9fr)\n            minmax(420px, 1.1fr);\n\n        gap: 45px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-browser {\n        width: min(560px, 94%);\n    }\n}\n\n@media (max-width: 900px) {\n    #dx-custom-store-hero-en .dx-csh-main {\n        padding:\n            74px\n            28px\n            80px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-container {\n        min-height: 0;\n        grid-template-columns: 1fr;\n        gap: 52px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-content {\n        text-align: center;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-eyebrow,\n    #dx-custom-store-hero-en .dx-csh-actions,\n    #dx-custom-store-hero-en .dx-csh-features {\n        justify-content: center;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-title,\n    #dx-custom-store-hero-en .dx-csh-description {\n        margin-right: auto;\n        margin-left: auto;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-visual {\n        min-height: 560px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-browser {\n        transform: none;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-browser:hover {\n        transform: translateY(-5px);\n    }\n}\n\n@media (max-width: 600px) {\n    #dx-custom-store-hero-en .dx-csh-main {\n        padding:\n            58px\n            16px\n            64px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-container {\n        gap: 40px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-eyebrow {\n        margin-bottom: 11px;\n        font-size: 14px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-eyebrow::before {\n        width: 27px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-title {\n        font-size: clamp(31px, 9vw, 40px);\n        line-height: 1.52;\n        letter-spacing: -0.2px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-description {\n        margin-top: 13px;\n        font-size: 14px;\n        line-height: 2;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-actions {\n        margin-top: 23px;\n        display: grid;\n        grid-template-columns: 1fr;\n        gap: 9px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-button {\n        width: 100%;\n        min-width: 0;\n        min-height: 51px;\n        font-size: 14px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-features {\n        margin-top: 18px;\n        gap: 8px 14px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-feature {\n        font-size: 14px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-visual {\n        min-height: 430px;\n        padding:\n            20px\n            0\n            10px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-visual-frame {\n        inset:\n            12px\n            4px;\n\n        border-radius: 25px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-browser {\n        width: min(100%, 390px);\n        border-radius: 18px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-browser-bar {\n        height: 36px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-code-pill {\n        top: 0;\n        left: 8px;\n        min-width: 155px;\n        padding: 10px 12px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-api-pill {\n        right: 8px;\n        bottom: 0;\n        min-width: 165px;\n        padding: 10px 12px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-api-icon {\n        width: 35px;\n        height: 35px;\n        flex-basis: 35px;\n        border-radius: 10px;\n    }\n}\n\n@media (max-width: 390px) {\n    #dx-custom-store-hero-en .dx-csh-visual {\n        min-height: 395px;\n    }\n\n    #dx-custom-store-hero-en .dx-csh-code-pill,\n    #dx-custom-store-hero-en .dx-csh-api-pill {\n        min-width: 145px;\n    }\n}\n\n#dx-custom-store-hero-en a:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-store-hero-en *,\n    #dx-custom-store-hero-en *::before,\n    #dx-custom-store-hero-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-store-hero-en\"\n    aria-labelledby=\"dx-custom-store-hero-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div\n        class=\"dx-csh-grid\"\n        aria-hidden=\"true\"\n    ><\/div>\n\n    <span\n        class=\"dx-csh-glow dx-csh-glow-one\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-csh-glow dx-csh-glow-two\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <div class=\"dx-csh-main\">\n\n        <div class=\"dx-csh-container\">\n\n            <div class=\"dx-csh-content\">\n\n                <span class=\"dx-csh-eyebrow\">\n                    Custom E-Commerce Development\n                <\/span>\n\n                <h1\n                    id=\"dx-custom-store-hero-title-en\"\n                    class=\"dx-csh-title\"\n                >\n                    A Custom Online Store\n                    <span>Built Around Your Business<\/span>\n                <\/h1>\n\n                <p class=\"dx-csh-description\">\n                    We develop your e-commerce platform from the ground up\n                    with a custom architecture that gives you\n                    <strong>full control over design, functionality, and integrations<\/strong>,\n                    while delivering a fast, scalable experience without\n                    forcing your business into the limitations of a\n                    pre-built template or platform.\n                <\/p>\n\n                <div class=\"dx-csh-actions\">\n\n                    <a\n                        href=\"https:\/\/dindex.net\/en\/contact\/\"\n                        class=\"dx-csh-button dx-csh-button-primary\"\n                    >\n                        <span>Discuss Your Store Project<\/span>\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M5 12h14\"><\/path>\n                            <path d=\"m13 6 6 6-6 6\"><\/path>\n                        <\/svg>\n                    <\/a>\n\n                    <a\n                        href=\"#dx-custom-store-audience\"\n                        class=\"dx-csh-button dx-csh-button-secondary\"\n                    >\n                        <span>Is Custom Development Right for You?<\/span>\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M12 5v14\"><\/path>\n                            <path d=\"m6 13 6 6 6-6\"><\/path>\n                        <\/svg>\n                    <\/a>\n\n                <\/div>\n\n                <div\n                    class=\"dx-csh-features\"\n                    aria-label=\"Custom e-commerce development benefits\"\n                >\n\n                    <span class=\"dx-csh-feature\">\n                        <span\n                            class=\"dx-csh-feature-icon\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m5 12 4 4L19 6\"><\/path>\n                            <\/svg>\n                        <\/span>\n                        Custom UI & Experience\n                    <\/span>\n\n                    <span class=\"dx-csh-feature\">\n                        <span\n                            class=\"dx-csh-feature-icon\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m5 12 4 4L19 6\"><\/path>\n                            <\/svg>\n                        <\/span>\n                        Custom Admin Dashboard\n                    <\/span>\n\n                    <span class=\"dx-csh-feature\">\n                        <span\n                            class=\"dx-csh-feature-icon\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m5 12 4 4L19 6\"><\/path>\n                            <\/svg>\n                        <\/span>\n                        Scalable API Integrations\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n            <div\n                class=\"dx-csh-visual\"\n                aria-label=\"Custom e-commerce administration dashboard preview\"\n            >\n\n                <div\n                    class=\"dx-csh-visual-frame\"\n                    aria-hidden=\"true\"\n                ><\/div>\n\n                <div class=\"dx-csh-browser\">\n\n                    <div\n                        class=\"dx-csh-browser-bar\"\n                        aria-hidden=\"true\"\n                    >\n                        <span class=\"dx-csh-browser-address\"><\/span>\n\n                        <span class=\"dx-csh-browser-dots\">\n                            <span class=\"dx-csh-browser-dot\"><\/span>\n                            <span class=\"dx-csh-browser-dot\"><\/span>\n                            <span class=\"dx-csh-browser-dot\"><\/span>\n                        <\/span>\n                    <\/div>\n\n                    <div class=\"dx-csh-browser-screen\">\n\n                        <img fetchpriority=\"high\"\n                            src=\"https:\/\/dindex.net\/wp-content\/uploads\/2026\/05\/Filament-Pulse-Dark-1024x767.png\"\n                            alt=\"Professional custom e-commerce administration dashboard\"\n                            width=\"1024\"\n                            height=\"767\"\n                            loading=\"eager\"\n                            fetchpriority=\"high\"\n                            decoding=\"async\"\n                        >\n\n                    <\/div>\n\n                <\/div>\n\n                <div class=\"dx-csh-code-pill\">\n\n                    <span class=\"dx-csh-code-label\">\n                        Custom Development\n                    <\/span>\n\n                    <span class=\"dx-csh-code-text\">\n                        Laravel \u00b7 React \u00b7 Next.js\n                    <\/span>\n\n                <\/div>\n\n                <div class=\"dx-csh-api-pill\">\n\n                    <span\n                        class=\"dx-csh-api-icon\"\n                        aria-hidden=\"true\"\n                    >\n                        <svg viewBox=\"0 0 24 24\">\n                            <path d=\"M8 3v4\"><\/path>\n                            <path d=\"M16 3v4\"><\/path>\n                            <path d=\"M7 7h10v4a5 5 0 0 1-10 0Z\"><\/path>\n                            <path d=\"M12 16v5\"><\/path>\n                        <\/svg>\n                    <\/span>\n\n                    <span>\n                        <span class=\"dx-csh-api-title\">\n                            Custom Integrations\n                        <\/span>\n\n                        <span class=\"dx-csh-api-text\">\n                            APIs \u00b7 Payments \u00b7 ERP\n                        <\/span>\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomStoreHeroEn() {\n        const section = document.getElementById(\n            \"dx-custom-store-hero-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-store-hero-en-fullwidth\"\n            );\n        }\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomStoreHeroEn\n        );\n    } else {\n        initDxCustomStoreHeroEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f28761e e-flex e-con-boxed e-con e-parent\" data-id=\"f28761e\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c95b25b elementor-widget elementor-widget-html\" data-id=\"c95b25b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-store-audience),\n.elementor-widget-html:has(#dx-custom-store-audience) > .elementor-widget-container,\n.dx-custom-store-audience-fullwidth,\n.dx-custom-store-audience-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-store-audience,\n#dx-custom-store-audience *,\n#dx-custom-store-audience *::before,\n#dx-custom-store-audience *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-store-audience {\n    --dx-bg: #f7f4fb;\n    --dx-white: #ffffff;\n    --dx-dark: #180b35;\n    --dx-text: #6d6478;\n    --dx-muted: #958d9f;\n    --dx-purple: #7045df;\n    --dx-purple-light: #966af0;\n    --dx-yellow: #ffc441;\n    --dx-green: #53cf92;\n    --dx-blue: #65aef7;\n    --dx-border: rgba(112, 69, 223, 0.12);\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-dark);\n\n    background:\n        radial-gradient(\n            circle at 7% 12%,\n            rgba(112, 69, 223, 0.08),\n            transparent 25%\n        ),\n        radial-gradient(\n            circle at 93% 88%,\n            rgba(255, 196, 65, 0.08),\n            transparent 28%\n        ),\n        var(--dx-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-store-audience a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-store-audience .dx-csa-grid-bg {\n    position: absolute;\n    z-index: -5;\n\n    inset: 0;\n\n    opacity: 0.16;\n\n    background-image:\n        linear-gradient(\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 17%,\n            transparent 83%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 17%,\n            transparent 83%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-store-audience .dx-csa-circle {\n    position: absolute;\n    z-index: -4;\n\n    border: 1px solid rgba(112, 69, 223, 0.08);\n    border-radius: 50%;\n\n    pointer-events: none;\n}\n\n#dx-custom-store-audience .dx-csa-circle-one {\n    top: -230px;\n    left: -190px;\n\n    width: 470px;\n    height: 470px;\n}\n\n#dx-custom-store-audience .dx-csa-circle-two {\n    right: -260px;\n    bottom: -310px;\n\n    width: 590px;\n    height: 590px;\n}\n\n#dx-custom-store-audience .dx-csa-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-store-audience .dx-csa-container {\n    width: min(1440px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-store-audience .dx-csa-header {\n    max-width: 900px;\n\n    margin:\n        0\n        auto\n        52px;\n\n    text-align: center;\n}\n\n#dx-custom-store-audience .dx-csa-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-store-audience .dx-csa-eyebrow::before,\n#dx-custom-store-audience .dx-csa-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-store-audience .dx-csa-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-store-audience .dx-csa-title span {\n    color: var(--dx-purple);\n}\n\n#dx-custom-store-audience .dx-csa-description {\n    max-width: 770px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-store-audience .dx-csa-layout {\n    display: grid;\n    grid-template-columns:\n        minmax(320px, 0.72fr)\n        minmax(0, 1.28fr);\n\n    align-items: stretch;\n\n    gap: 24px;\n}\n\n#dx-custom-store-audience .dx-csa-guide {\n    position: relative;\n    isolation: isolate;\n\n    min-height: 100%;\n\n    display: flex;\n    flex-direction: column;\n\n    overflow: hidden;\n\n    padding:\n        35px\n        31px;\n\n    border: 1px solid rgba(255, 255, 255, 0.13);\n    border-radius: 27px;\n\n    color: #ffffff;\n\n    background:\n        radial-gradient(\n            circle at 9% 8%,\n            rgba(150, 106, 240, 0.24),\n            transparent 34%\n        ),\n        linear-gradient(\n            145deg,\n            #1c0b40,\n            #0c0226\n        );\n\n    box-shadow:\n        0 27px 68px rgba(40, 18, 84, 0.17);\n}\n\n#dx-custom-store-audience .dx-csa-guide::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: -2;\n\n    right: -135px;\n    bottom: -180px;\n\n    width: 350px;\n    height: 350px;\n\n    border-radius: 50%;\n\n    background: rgba(255, 196, 65, 0.08);\n\n    filter: blur(95px);\n\n    pointer-events: none;\n}\n\n#dx-custom-store-audience .dx-csa-guide-icon {\n    width: 72px;\n    height: 72px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255, 255, 255, 0.14);\n    border-radius: 22px;\n\n    color: #180b35;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-yellow),\n            #ffd66e\n        );\n\n    box-shadow:\n        0 18px 38px rgba(255, 196, 65, 0.22);\n}\n\n#dx-custom-store-audience .dx-csa-guide-icon svg {\n    width: 34px;\n    height: 34px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-audience .dx-csa-guide-label {\n    display: block;\n\n    margin-top: 27px;\n\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-store-audience .dx-csa-guide-title {\n    margin:\n        8px\n        0\n        0;\n\n    color: #ffffff;\n\n    font-size: 29px;\n    font-weight: 900;\n    line-height: 1.55;\n\n    text-wrap: balance;\n}\n\n#dx-custom-store-audience .dx-csa-guide-text {\n    margin:\n        13px\n        0\n        0;\n\n    color: rgba(255, 255, 255, 0.7);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 2;\n}\n\n#dx-custom-store-audience .dx-csa-guide-list {\n    margin-top: 26px;\n    padding-top: 22px;\n\n    display: grid;\n\n    gap: 12px;\n\n    border-top: 1px solid rgba(255, 255, 255, 0.10);\n}\n\n#dx-custom-store-audience .dx-csa-guide-item {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 10px;\n\n    color: rgba(255, 255, 255, 0.76);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.85;\n}\n\n#dx-custom-store-audience .dx-csa-guide-check {\n    width: 25px;\n    height: 25px;\n    flex: 0 0 25px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 8px;\n\n    color: #7ce3b3;\n\n    background: rgba(83, 207, 146, 0.12);\n}\n\n#dx-custom-store-audience .dx-csa-guide-check svg {\n    width: 13px;\n    height: 13px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.3;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-audience .dx-csa-guide-button {\n    width: 100%;\n    min-height: 53px;\n\n    margin-top: auto;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 9px;\n\n    padding:\n        0\n        20px;\n\n    border: 1px solid rgba(255, 255, 255, 0.16);\n    border-radius: 12px;\n\n    color: #180b35;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-yellow),\n            #ffd66e\n        );\n\n    box-shadow:\n        0 17px 37px rgba(255, 196, 65, 0.21);\n\n    font-size: 14px;\n    font-weight: 900;\n\n    transition:\n        transform 0.25s ease,\n        box-shadow 0.25s ease;\n}\n\n#dx-custom-store-audience .dx-csa-guide-button:hover,\n#dx-custom-store-audience .dx-csa-guide-button:focus-visible {\n    box-shadow:\n        0 23px 47px rgba(255, 196, 65, 0.3);\n\n    transform: translateY(-3px);\n}\n\n#dx-custom-store-audience .dx-csa-guide-button svg {\n    width: 18px;\n    height: 18px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-audience .dx-csa-cards {\n    display: grid;\n    grid-template-columns:\n        repeat(2, minmax(0, 1fr));\n\n    gap: 17px;\n}\n\n#dx-custom-store-audience .dx-csa-card {\n    position: relative;\n    isolation: isolate;\n\n    min-width: 0;\n    min-height: 285px;\n\n    display: flex;\n    flex-direction: column;\n\n    overflow: hidden;\n\n    padding:\n        27px\n        24px;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 22px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.99),\n            rgba(250, 248, 254, 0.97)\n        );\n\n    box-shadow:\n        0 20px 52px rgba(40, 18, 84, 0.085),\n        inset 0 1px 0 #ffffff;\n\n    transition:\n        transform 0.32s ease,\n        border-color 0.32s ease,\n        box-shadow 0.32s ease;\n}\n\n#dx-custom-store-audience .dx-csa-card:hover,\n#dx-custom-store-audience .dx-csa-card:focus-within {\n    border-color: rgba(112, 69, 223, 0.34);\n\n    box-shadow:\n        0 30px 68px rgba(40, 18, 84, 0.14);\n\n    transform: translateY(-7px);\n}\n\n#dx-custom-store-audience .dx-csa-card::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: -2;\n\n    left: -100px;\n    bottom: -120px;\n\n    width: 240px;\n    height: 240px;\n\n    border-radius: 50%;\n\n    background: rgba(112, 69, 223, 0.09);\n\n    filter: blur(75px);\n\n    opacity: 0;\n\n    transition: opacity 0.32s ease;\n\n    pointer-events: none;\n}\n\n#dx-custom-store-audience .dx-csa-card:hover::before,\n#dx-custom-store-audience .dx-csa-card:focus-within::before {\n    opacity: 1;\n}\n\n#dx-custom-store-audience .dx-csa-card-top {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n\n    gap: 15px;\n}\n\n#dx-custom-store-audience .dx-csa-card-icon {\n    width: 58px;\n    height: 58px;\n    flex: 0 0 58px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 17px;\n\n    color: var(--dx-purple);\n\n    background: rgba(112, 69, 223, 0.10);\n\n    box-shadow:\n        inset 0 0 0 1px rgba(112, 69, 223, 0.07);\n\n    transition:\n        transform 0.3s ease;\n}\n\n#dx-custom-store-audience .dx-csa-card:nth-child(2)\n    .dx-csa-card-icon {\n    color: #936500;\n    background: rgba(255, 196, 65, 0.15);\n}\n\n#dx-custom-store-audience .dx-csa-card:nth-child(3)\n    .dx-csa-card-icon {\n    color: #16845a;\n    background: rgba(83, 207, 146, 0.13);\n}\n\n#dx-custom-store-audience .dx-csa-card:nth-child(4)\n    .dx-csa-card-icon {\n    color: #2172bd;\n    background: rgba(101, 174, 247, 0.13);\n}\n\n#dx-custom-store-audience .dx-csa-card:hover\n    .dx-csa-card-icon {\n    transform:\n        translateY(-4px)\n        rotate(-4deg);\n}\n\n#dx-custom-store-audience .dx-csa-card-icon svg {\n    width: 28px;\n    height: 28px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-audience .dx-csa-card-number {\n    color: rgba(112, 69, 223, 0.16);\n\n    font-size: 25px;\n    font-weight: 900;\n    line-height: 1;\n\n    direction: ltr;\n}\n\n#dx-custom-store-audience .dx-csa-card-label {\n    display: block;\n\n    margin-top: 20px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-store-audience .dx-csa-card:nth-child(2)\n    .dx-csa-card-label {\n    color: #936500;\n}\n\n#dx-custom-store-audience .dx-csa-card:nth-child(3)\n    .dx-csa-card-label {\n    color: #16845a;\n}\n\n#dx-custom-store-audience .dx-csa-card:nth-child(4)\n    .dx-csa-card-label {\n    color: #2172bd;\n}\n\n#dx-custom-store-audience .dx-csa-card-title {\n    margin:\n        5px\n        0\n        0;\n\n    color: var(--dx-dark);\n\n    font-size: 20px;\n    font-weight: 900;\n    line-height: 1.6;\n\n    text-wrap: balance;\n}\n\n#dx-custom-store-audience .dx-csa-card-text {\n    margin:\n        9px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 1.95;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-store-audience .dx-csa-card-tags {\n    margin-top: auto;\n    padding-top: 18px;\n\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n\n    gap: 7px;\n\n    border-top: 1px solid rgba(112, 69, 223, 0.09);\n}\n\n#dx-custom-store-audience .dx-csa-tag {\n    min-height: 30px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    padding:\n        0\n        10px;\n\n    border: 1px solid rgba(112, 69, 223, 0.10);\n    border-radius: 999px;\n\n    color: var(--dx-muted);\n\n    background: rgba(112, 69, 223, 0.045);\n\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1;\n}\n\n@media (max-width: 1050px) {\n    #dx-custom-store-audience .dx-csa-layout {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide {\n        min-height: 0;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide-button {\n        margin-top: 28px;\n    }\n}\n\n@media (max-width: 980px) {\n    #dx-custom-store-audience .dx-csa-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n}\n\n@media (max-width: 680px) {\n    #dx-custom-store-audience .dx-csa-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-store-audience .dx-csa-header {\n        margin-bottom: 34px;\n    }\n\n    #dx-custom-store-audience .dx-csa-eyebrow::before,\n    #dx-custom-store-audience .dx-csa-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-store-audience .dx-csa-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n        letter-spacing: -0.2px;\n    }\n\n    #dx-custom-store-audience .dx-csa-description {\n        margin-top: 10px;\n\n        font-size: 14px;\n        line-height: 2;\n    }\n\n    #dx-custom-store-audience .dx-csa-layout {\n        gap: 13px;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide {\n        padding:\n            25px\n            20px;\n\n        border-radius: 20px;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide-icon {\n        width: 60px;\n        height: 60px;\n\n        border-radius: 18px;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide-icon svg {\n        width: 29px;\n        height: 29px;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide-label {\n        margin-top: 21px;\n    }\n\n    #dx-custom-store-audience .dx-csa-guide-title {\n        font-size: 23px;\n        line-height: 1.6;\n    }\n\n    #dx-custom-store-audience .dx-csa-cards {\n        grid-template-columns: 1fr;\n\n        gap: 11px;\n    }\n\n    #dx-custom-store-audience .dx-csa-card {\n        min-height: 0;\n\n        padding:\n            21px\n            18px;\n\n        border-radius: 18px;\n    }\n\n    #dx-custom-store-audience .dx-csa-card-icon {\n        width: 52px;\n        height: 52px;\n        flex-basis: 52px;\n\n        border-radius: 15px;\n    }\n\n    #dx-custom-store-audience .dx-csa-card-icon svg {\n        width: 25px;\n        height: 25px;\n    }\n\n    #dx-custom-store-audience .dx-csa-card-label {\n        margin-top: 17px;\n    }\n\n    #dx-custom-store-audience .dx-csa-card-title {\n        font-size: 18px;\n    }\n\n    #dx-custom-store-audience .dx-csa-circle {\n        display: none;\n    }\n}\n\n#dx-custom-store-audience a:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-store-audience *,\n    #dx-custom-store-audience *::before,\n    #dx-custom-store-audience *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-store-audience\"\n    aria-labelledby=\"dx-custom-store-audience-title\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div\n        class=\"dx-csa-grid-bg\"\n        aria-hidden=\"true\"\n    ><\/div>\n\n    <span\n        class=\"dx-csa-circle dx-csa-circle-one\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-csa-circle dx-csa-circle-two\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <div class=\"dx-csa-main\">\n\n        <div class=\"dx-csa-container\">\n\n            <header class=\"dx-csa-header\">\n\n                <span class=\"dx-csa-eyebrow\">\n                    When Off-the-Shelf Solutions Are Not Enough\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-store-audience-title\"\n                    class=\"dx-csa-title\"\n                >\n                    Who Is\n                    <span>Custom E-Commerce Development For?<\/span>\n                <\/h2>\n\n                <p class=\"dx-csa-description\">\n                    Custom development is not necessary for every online\n                    store. It becomes the stronger option when your\n                    workflows, customer experience, integrations, or\n                    business model cannot be handled efficiently by\n                    an off-the-shelf platform.\n                <\/p>\n\n            <\/header>\n\n            <div class=\"dx-csa-layout\">\n\n                <aside class=\"dx-csa-guide\">\n\n                    <span\n                        class=\"dx-csa-guide-icon\"\n                        aria-hidden=\"true\"\n                    >\n                        <svg viewBox=\"0 0 24 24\">\n                            <path d=\"M8 3 4 7l4 4\"><\/path>\n                            <path d=\"m16 3 4 4-4 4\"><\/path>\n                            <path d=\"m14 2-4 10\"><\/path>\n                            <path d=\"M5 17h14\"><\/path>\n                            <path d=\"M8 21h8\"><\/path>\n                        <\/svg>\n                    <\/span>\n\n                    <span class=\"dx-csa-guide-label\">\n                        Do You Really Need Custom Development?\n                    <\/span>\n\n                    <h3 class=\"dx-csa-guide-title\">\n                        Custom Development Makes Sense When Your Business Starts Outgrowing Platform Limitations\n                    <\/h3>\n\n                    <p class=\"dx-csa-guide-text\">\n                        If your project depends on unique workflows,\n                        multiple permission levels, external integrations,\n                        or a non-standard purchasing experience, building\n                        around your requirements can be more flexible than\n                        forcing an existing platform to support a business\n                        model it was not designed for.\n                    <\/p>\n\n                    <div class=\"dx-csa-guide-list\">\n\n                        <div class=\"dx-csa-guide-item\">\n\n                            <span\n                                class=\"dx-csa-guide-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Your sales or operational workflow differs from a standard online store.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-csa-guide-item\">\n\n                            <span\n                                class=\"dx-csa-guide-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Your store needs to communicate with external systems or services.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-csa-guide-item\">\n\n                            <span\n                                class=\"dx-csa-guide-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                You expect to introduce new functionality as the business grows.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-csa-guide-item\">\n\n                            <span\n                                class=\"dx-csa-guide-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                You need greater control over the user experience and system architecture.\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n                    <a\n                        href=\"https:\/\/dindex.net\/en\/contact\/\"\n                        class=\"dx-csa-guide-button\"\n                    >\n                        <span>Discuss Your Requirements<\/span>\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M5 12h14\"><\/path>\n                            <path d=\"m13 6 6 6-6 6\"><\/path>\n                        <\/svg>\n                    <\/a>\n\n                <\/aside>\n\n                <div class=\"dx-csa-cards\">\n\n                    <article class=\"dx-csa-card\">\n\n                        <div class=\"dx-csa-card-top\">\n\n                            <span\n                                class=\"dx-csa-card-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M4 21V7l8-4 8 4v14\"><\/path>\n                                    <path d=\"M8 10h8\"><\/path>\n                                    <path d=\"M8 14h8\"><\/path>\n                                    <path d=\"M9 21v-3h6v3\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-csa-card-number\">\n                                01\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-csa-card-label\">\n                            Advanced Business Operations\n                        <\/span>\n\n                        <h3 class=\"dx-csa-card-title\">\n                            Businesses With Unique Operational Requirements\n                        <\/h3>\n\n                        <p class=\"dx-csa-card-text\">\n                            For businesses that need custom pricing,\n                            permissions, ordering rules, or internal\n                            workflows that do not fit comfortably within\n                            the standard flow of an off-the-shelf store.\n                        <\/p>\n\n                        <div class=\"dx-csa-card-tags\">\n                            <span class=\"dx-csa-tag\">Permissions<\/span>\n                            <span class=\"dx-csa-tag\">Custom Workflows<\/span>\n                            <span class=\"dx-csa-tag\">B2B<\/span>\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-csa-card\">\n\n                        <div class=\"dx-csa-card-top\">\n\n                            <span\n                                class=\"dx-csa-card-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 3a9 9 0 1 0 9 9c0-1.1-.9-2-2-2h-2.5A2.5 2.5 0 0 1 14 7.5V5c0-1.1-.9-2-2-2Z\"><\/path>\n                                    <circle cx=\"7.5\" cy=\"10.5\" r=\"1\"><\/circle>\n                                    <circle cx=\"10\" cy=\"7\" r=\"1\"><\/circle>\n                                    <circle cx=\"7\" cy=\"15\" r=\"1\"><\/circle>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-csa-card-number\">\n                                02\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-csa-card-label\">\n                            A Distinct Shopping Experience\n                        <\/span>\n\n                        <h3 class=\"dx-csa-card-title\">\n                            Brands That Want a Fully Custom Experience\n                        <\/h3>\n\n                        <p class=\"dx-csa-card-text\">\n                            For brands that do not want their store to\n                            feel template-based and need the browsing,\n                            purchasing, and interaction experience to\n                            be designed around their products, audience,\n                            and brand identity.\n                        <\/p>\n\n                        <div class=\"dx-csa-card-tags\">\n                            <span class=\"dx-csa-tag\">Custom UI<\/span>\n                            <span class=\"dx-csa-tag\">Custom UX<\/span>\n                            <span class=\"dx-csa-tag\">Brand Experience<\/span>\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-csa-card\">\n\n                        <div class=\"dx-csa-card-top\">\n\n                            <span\n                                class=\"dx-csa-card-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M4 19V5\"><\/path>\n                                    <path d=\"M4 19h16\"><\/path>\n                                    <path d=\"m7 15 4-4 3 3 5-6\"><\/path>\n                                    <path d=\"M16 8h3v3\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-csa-card-number\">\n                                03\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-csa-card-label\">\n                            Growth & Integrations\n                        <\/span>\n\n                        <h3 class=\"dx-csa-card-title\">\n                            Stores That Need a Scalable Architecture\n                        <\/h3>\n\n                        <p class=\"dx-csa-card-text\">\n                            For projects that expect to add new features,\n                            sales channels, applications, internal tools,\n                            or integrations and need an architecture that\n                            can evolve as business requirements change.\n                        <\/p>\n\n                        <div class=\"dx-csa-card-tags\">\n                            <span class=\"dx-csa-tag\">APIs<\/span>\n                            <span class=\"dx-csa-tag\">ERP \/ CRM<\/span>\n                            <span class=\"dx-csa-tag\">Scalability<\/span>\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-csa-card\">\n\n                        <div class=\"dx-csa-card-top\">\n\n                            <span\n                                class=\"dx-csa-card-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 2v6\"><\/path>\n                                    <path d=\"m8 6 4-4 4 4\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                    <path d=\"M5 16h9\"><\/path>\n                                    <path d=\"M5 20h6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-csa-card-number\">\n                                04\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-csa-card-label\">\n                            New Digital Business Model\n                        <\/span>\n\n                        <h3 class=\"dx-csa-card-title\">\n                            Startups & Non-Standard E-Commerce Concepts\n                        <\/h3>\n\n                        <p class=\"dx-csa-card-text\">\n                            For projects that are building more than a\n                            traditional store, such as a platform or new\n                            commerce model requiring custom rules,\n                            interfaces, and functionality that cannot be\n                            handled cleanly through ready-made plugins.\n                        <\/p>\n\n                        <div class=\"dx-csa-card-tags\">\n                            <span class=\"dx-csa-tag\">Marketplace<\/span>\n                            <span class=\"dx-csa-tag\">Subscriptions<\/span>\n                            <span class=\"dx-csa-tag\">Custom Model<\/span>\n                        <\/div>\n\n                    <\/article>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomStoreAudience() {\n        const section = document.getElementById(\n            \"dx-custom-store-audience\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-store-audience-fullwidth\"\n            );\n        }\n\n        if (\n            !(\"IntersectionObserver\" in window) ||\n            window.matchMedia(\n                \"(prefers-reduced-motion: reduce)\"\n            ).matches\n        ) {\n            return;\n        }\n\n        const guide = section.querySelector(\n            \".dx-csa-guide\"\n        );\n\n        const cards = section.querySelectorAll(\n            \".dx-csa-card\"\n        );\n\n        if (guide) {\n            guide.style.opacity = \"0\";\n            guide.style.transform =\n                \"translateX(-28px)\";\n\n            guide.style.transition =\n                \"opacity 0.7s ease, transform 0.7s ease\";\n        }\n\n        cards.forEach(function (card, index) {\n            card.style.opacity = \"0\";\n            card.style.transform =\n                \"translateY(25px)\";\n\n            card.style.transition =\n                \"opacity 0.62s ease \" +\n                (0.08 + index * 0.08) +\n                \"s, transform 0.62s ease \" +\n                (0.08 + index * 0.08) +\n                \"s\";\n        });\n\n        const observer = new IntersectionObserver(\n            function (entries, currentObserver) {\n                entries.forEach(function (entry) {\n                    if (!entry.isIntersecting) {\n                        return;\n                    }\n\n                    if (guide) {\n                        guide.style.opacity = \"1\";\n                        guide.style.transform =\n                            \"translateX(0)\";\n                    }\n\n                    cards.forEach(function (card) {\n                        card.style.opacity = \"1\";\n                        card.style.transform =\n                            \"translateY(0)\";\n                    });\n\n                    currentObserver.unobserve(\n                        entry.target\n                    );\n                });\n            },\n            {\n                threshold: 0.1\n            }\n        );\n\n        observer.observe(section);\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomStoreAudience\n        );\n    } else {\n        initDxCustomStoreAudience();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f294e89 e-flex e-con-boxed e-con e-parent\" data-id=\"f294e89\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-93a531b elementor-widget elementor-widget-html\" data-id=\"93a531b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-store-why-en),\n.elementor-widget-html:has(#dx-custom-store-why-en) > .elementor-widget-container,\n.dx-custom-store-why-en-fullwidth,\n.dx-custom-store-why-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-store-why-en,\n#dx-custom-store-why-en *,\n#dx-custom-store-why-en *::before,\n#dx-custom-store-why-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-store-why-en {\n    --dx-dark: #09001f;\n    --dx-dark-secondary: #17053d;\n    --dx-white: #ffffff;\n    --dx-text: rgba(255, 255, 255, 0.72);\n    --dx-muted: rgba(255, 255, 255, 0.50);\n    --dx-purple: #6942d8;\n    --dx-purple-light: #9168ef;\n    --dx-yellow: #ffc441;\n    --dx-yellow-light: #ffd66e;\n    --dx-green: #54d696;\n    --dx-blue: #58a8f7;\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-white);\n\n    background:\n        radial-gradient(\n            circle at 10% 12%,\n            rgba(145, 104, 239, 0.22),\n            transparent 27%\n        ),\n        radial-gradient(\n            circle at 91% 87%,\n            rgba(105, 66, 216, 0.18),\n            transparent 30%\n        ),\n        linear-gradient(\n            145deg,\n            var(--dx-dark-secondary),\n            var(--dx-dark)\n        );\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-store-why-en a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-store-why-en .dx-csw-grid {\n    position: absolute;\n    z-index: -6;\n    inset: 0;\n    opacity: 0.10;\n\n    background-image:\n        linear-gradient(\n            rgba(255, 255, 255, 0.045) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(255, 255, 255, 0.045) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 83%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 83%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-store-why-en .dx-csw-glow {\n    position: absolute;\n    z-index: -5;\n\n    border-radius: 50%;\n    filter: blur(110px);\n\n    pointer-events: none;\n}\n\n#dx-custom-store-why-en .dx-csw-glow-one {\n    top: -160px;\n    right: 28%;\n\n    width: 420px;\n    height: 420px;\n\n    background: rgba(145, 104, 239, 0.18);\n}\n\n#dx-custom-store-why-en .dx-csw-glow-two {\n    left: -180px;\n    bottom: -210px;\n\n    width: 480px;\n    height: 420px;\n\n    background: rgba(255, 196, 65, 0.055);\n}\n\n#dx-custom-store-why-en .dx-csw-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-store-why-en .dx-csw-container {\n    width: min(1440px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-store-why-en .dx-csw-header {\n    max-width: 900px;\n\n    margin:\n        0\n        auto\n        50px;\n\n    text-align: center;\n}\n\n#dx-custom-store-why-en .dx-csw-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-store-why-en .dx-csw-eyebrow::before,\n#dx-custom-store-why-en .dx-csw-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-store-why-en .dx-csw-title {\n    margin: 0;\n\n    color: #ffffff;\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-store-why-en .dx-csw-title span {\n    color: var(--dx-yellow);\n}\n\n#dx-custom-store-why-en .dx-csw-description {\n    max-width: 760px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-store-why-en .dx-csw-layout {\n    display: grid;\n    grid-template-columns:\n        repeat(3, minmax(0, 1fr));\n\n    gap: 18px;\n}\n\n#dx-custom-store-why-en .dx-csw-card {\n    position: relative;\n    isolation: isolate;\n\n    min-width: 0;\n    min-height: 285px;\n\n    display: flex;\n    flex-direction: column;\n\n    overflow: hidden;\n\n    padding:\n        28px\n        24px;\n\n    border: 1px solid rgba(255, 255, 255, 0.12);\n    border-radius: 22px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.085),\n            rgba(255, 255, 255, 0.035)\n        );\n\n    box-shadow:\n        0 22px 55px rgba(2, 0, 20, 0.25),\n        inset 0 1px 0 rgba(255, 255, 255, 0.055);\n\n    -webkit-backdrop-filter: blur(10px);\n    backdrop-filter: blur(10px);\n\n    transition:\n        transform 0.34s ease,\n        border-color 0.34s ease,\n        background 0.34s ease,\n        box-shadow 0.34s ease;\n}\n\n#dx-custom-store-why-en .dx-csw-card:hover,\n#dx-custom-store-why-en .dx-csw-card:focus-within {\n    border-color: rgba(145, 104, 239, 0.46);\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(145, 104, 239, 0.16),\n            rgba(255, 255, 255, 0.045)\n        );\n\n    box-shadow:\n        0 32px 74px rgba(2, 0, 20, 0.34),\n        inset 0 1px 0 rgba(255, 255, 255, 0.07);\n\n    transform: translateY(-7px);\n}\n\n#dx-custom-store-why-en .dx-csw-card::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: -2;\n\n    right: -100px;\n    bottom: -125px;\n\n    width: 240px;\n    height: 240px;\n\n    border-radius: 50%;\n\n    background: rgba(105, 66, 216, 0.13);\n\n    filter: blur(75px);\n\n    opacity: 0;\n\n    transition: opacity 0.34s ease;\n\n    pointer-events: none;\n}\n\n#dx-custom-store-why-en .dx-csw-card:hover::before,\n#dx-custom-store-why-en .dx-csw-card:focus-within::before {\n    opacity: 1;\n}\n\n#dx-custom-store-why-en .dx-csw-card-top {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n\n    gap: 14px;\n}\n\n#dx-custom-store-why-en .dx-csw-icon {\n    width: 60px;\n    height: 60px;\n    flex: 0 0 60px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255, 255, 255, 0.11);\n    border-radius: 18px;\n\n    color: #d6c9ff;\n\n    background: rgba(145, 104, 239, 0.13);\n\n    transition:\n        transform 0.3s ease,\n        background 0.3s ease;\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(2)\n    .dx-csw-icon,\n#dx-custom-store-why-en .dx-csw-card:nth-child(5)\n    .dx-csw-icon {\n    color: var(--dx-yellow);\n\n    background: rgba(255, 196, 65, 0.11);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(3)\n    .dx-csw-icon {\n    color: #7ce3b3;\n\n    background: rgba(84, 214, 150, 0.11);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(4)\n    .dx-csw-icon {\n    color: #8bc9ff;\n\n    background: rgba(88, 168, 247, 0.11);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(6)\n    .dx-csw-icon {\n    color: #d7c7ff;\n\n    background: rgba(145, 104, 239, 0.12);\n}\n\n#dx-custom-store-why-en .dx-csw-card:hover\n    .dx-csw-icon {\n    transform:\n        translateY(-4px)\n        rotate(-4deg);\n}\n\n#dx-custom-store-why-en .dx-csw-icon svg {\n    width: 29px;\n    height: 29px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-why-en .dx-csw-number {\n    color: rgba(255, 255, 255, 0.18);\n\n    font-size: 24px;\n    font-weight: 900;\n    line-height: 1;\n\n    direction: ltr;\n}\n\n#dx-custom-store-why-en .dx-csw-card-title {\n    margin:\n        21px\n        0\n        0;\n\n    color: #ffffff;\n\n    font-size: 20px;\n    font-weight: 900;\n    line-height: 1.6;\n\n    text-wrap: balance;\n}\n\n#dx-custom-store-why-en .dx-csw-card-text {\n    margin:\n        9px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 1.95;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-store-why-en .dx-csw-card-bottom {\n    margin-top: auto;\n    padding-top: 18px;\n\n    display: flex;\n    align-items: center;\n\n    gap: 9px;\n\n    border-top: 1px solid rgba(255, 255, 255, 0.09);\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1.7;\n}\n\n#dx-custom-store-why-en .dx-csw-dot {\n    width: 8px;\n    height: 8px;\n    flex: 0 0 8px;\n\n    border-radius: 50%;\n\n    background: var(--dx-purple-light);\n\n    box-shadow:\n        0 0 0 5px rgba(145, 104, 239, 0.10);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(2)\n    .dx-csw-dot,\n#dx-custom-store-why-en .dx-csw-card:nth-child(5)\n    .dx-csw-dot {\n    background: var(--dx-yellow);\n\n    box-shadow:\n        0 0 0 5px rgba(255, 196, 65, 0.10);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(3)\n    .dx-csw-dot {\n    background: var(--dx-green);\n\n    box-shadow:\n        0 0 0 5px rgba(84, 214, 150, 0.10);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(4)\n    .dx-csw-dot {\n    background: var(--dx-blue);\n\n    box-shadow:\n        0 0 0 5px rgba(88, 168, 247, 0.10);\n}\n\n#dx-custom-store-why-en .dx-csw-card:nth-child(6)\n    .dx-csw-dot {\n    background: var(--dx-purple-light);\n\n    box-shadow:\n        0 0 0 5px rgba(145, 104, 239, 0.10);\n}\n\n#dx-custom-store-why-en .dx-csw-bottom {\n    max-width: 1180px;\n\n    margin:\n        30px\n        auto\n        0;\n\n    display: grid;\n    grid-template-columns:\n        minmax(0, 1fr)\n        auto;\n\n    align-items: center;\n\n    gap: 24px;\n\n    padding:\n        24px\n        26px;\n\n    border: 1px solid rgba(255, 255, 255, 0.13);\n    border-radius: 20px;\n\n    background: rgba(255, 255, 255, 0.055);\n\n    box-shadow:\n        0 18px 44px rgba(2, 0, 20, 0.21);\n\n    -webkit-backdrop-filter: blur(10px);\n    backdrop-filter: blur(10px);\n}\n\n#dx-custom-store-why-en .dx-csw-bottom-copy {\n    display: flex;\n    align-items: center;\n\n    gap: 14px;\n\n    min-width: 0;\n}\n\n#dx-custom-store-why-en .dx-csw-bottom-icon {\n    width: 50px;\n    height: 50px;\n    flex: 0 0 50px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 15px;\n\n    color: var(--dx-yellow);\n\n    background: rgba(255, 196, 65, 0.10);\n}\n\n#dx-custom-store-why-en .dx-csw-bottom-icon svg {\n    width: 25px;\n    height: 25px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.9;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-store-why-en .dx-csw-bottom-title {\n    margin: 0;\n\n    color: #ffffff;\n\n    font-size: 16px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-store-why-en .dx-csw-bottom-text {\n    margin:\n        4px\n        0\n        0;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.8;\n}\n\n#dx-custom-store-why-en .dx-csw-button {\n    min-width: 220px;\n    min-height: 51px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 9px;\n\n    padding:\n        0\n        22px;\n\n    border: 1px solid rgba(255, 255, 255, 0.18);\n    border-radius: 12px;\n\n    color: #180b35;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-yellow),\n            var(--dx-yellow-light)\n        );\n\n    box-shadow:\n        0 16px 34px rgba(255, 196, 65, 0.21);\n\n    font-size: 14px;\n    font-weight: 900;\n    white-space: nowrap;\n\n    transition:\n        transform 0.25s ease,\n        box-shadow 0.25s ease;\n}\n\n#dx-custom-store-why-en .dx-csw-button:hover,\n#dx-custom-store-why-en .dx-csw-button:focus-visible {\n    box-shadow:\n        0 22px 44px rgba(255, 196, 65, 0.30);\n\n    transform: translateY(-3px);\n}\n\n#dx-custom-store-why-en .dx-csw-button svg {\n    width: 17px;\n    height: 17px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n@media (max-width: 1100px) {\n    #dx-custom-store-why-en .dx-csw-layout {\n        grid-template-columns:\n            repeat(2, minmax(0, 1fr));\n    }\n}\n\n@media (max-width: 980px) {\n    #dx-custom-store-why-en .dx-csw-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-bottom {\n        grid-template-columns: 1fr;\n\n        text-align: center;\n    }\n\n    #dx-custom-store-why-en .dx-csw-bottom-copy {\n        flex-direction: column;\n    }\n\n    #dx-custom-store-why-en .dx-csw-button {\n        width: 100%;\n    }\n}\n\n@media (max-width: 680px) {\n    #dx-custom-store-why-en .dx-csw-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-header {\n        margin-bottom: 35px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-eyebrow::before,\n    #dx-custom-store-why-en .dx-csw-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n        letter-spacing: -0.2px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-description {\n        margin-top: 10px;\n\n        font-size: 14px;\n        line-height: 2;\n    }\n\n    #dx-custom-store-why-en .dx-csw-layout {\n        grid-template-columns: 1fr;\n\n        gap: 12px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-card {\n        min-height: 0;\n\n        padding:\n            21px\n            18px;\n\n        border-radius: 18px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-icon {\n        width: 52px;\n        height: 52px;\n        flex-basis: 52px;\n\n        border-radius: 15px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-icon svg {\n        width: 25px;\n        height: 25px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-card-title {\n        margin-top: 17px;\n\n        font-size: 18px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-bottom {\n        margin-top: 18px;\n\n        gap: 16px;\n\n        padding:\n            19px\n            15px;\n\n        border-radius: 16px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-bottom-title {\n        font-size: 14px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-button {\n        min-width: 0;\n        min-height: 49px;\n    }\n\n    #dx-custom-store-why-en .dx-csw-glow {\n        display: none;\n    }\n}\n\n#dx-custom-store-why-en a:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-store-why-en *,\n    #dx-custom-store-why-en *::before,\n    #dx-custom-store-why-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-store-why-en\"\n    aria-labelledby=\"dx-custom-store-why-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div\n        class=\"dx-csw-grid\"\n        aria-hidden=\"true\"\n    ><\/div>\n\n    <span\n        class=\"dx-csw-glow dx-csw-glow-one\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-csw-glow dx-csw-glow-two\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <div class=\"dx-csw-main\">\n\n        <div class=\"dx-csw-container\">\n\n            <header class=\"dx-csw-header\">\n\n                <span class=\"dx-csw-eyebrow\">\n                    Why Build From the Ground Up?\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-store-why-title-en\"\n                    class=\"dx-csw-title\"\n                >\n                    When You Need the System to Adapt to Your Business\n                    <span>Not the Other Way Around<\/span>\n                <\/h2>\n\n                <p class=\"dx-csw-description\">\n                    Custom development gives you greater freedom to\n                    design the platform around how your business\n                    actually operates, rather than relying on a fixed\n                    combination of templates, plugins, and platform\n                    limitations.\n                <\/p>\n\n            <\/header>\n\n            <div class=\"dx-csw-layout\">\n\n                <article class=\"dx-csw-card\">\n\n                    <div class=\"dx-csw-card-top\">\n\n                        <span class=\"dx-csw-icon\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M4 4h16v16H4Z\"><\/path>\n                                <path d=\"M8 4v16\"><\/path>\n                                <path d=\"M8 10h12\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span class=\"dx-csw-number\">01<\/span>\n\n                    <\/div>\n\n                    <h3 class=\"dx-csw-card-title\">\n                        Full Control Over the User Experience\n                    <\/h3>\n\n                    <p class=\"dx-csw-card-text\">\n                        We design the interface, browsing flow, and\n                        purchasing journey around your products and\n                        customers rather than adapting the project\n                        to a pre-built theme.\n                    <\/p>\n\n                    <div class=\"dx-csw-card-bottom\">\n                        <span class=\"dx-csw-dot\"><\/span>\n                        An experience designed around the customer\n                    <\/div>\n\n                <\/article>\n\n                <article class=\"dx-csw-card\">\n\n                    <div class=\"dx-csw-card-top\">\n\n                        <span class=\"dx-csw-icon\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M8 3v4\"><\/path>\n                                <path d=\"M16 3v4\"><\/path>\n                                <path d=\"M7 7h10v4a5 5 0 0 1-10 0Z\"><\/path>\n                                <path d=\"M12 16v5\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span class=\"dx-csw-number\">02<\/span>\n\n                    <\/div>\n\n                    <h3 class=\"dx-csw-card-title\">\n                        Integrations Built Around Your Requirements\n                    <\/h3>\n\n                    <p class=\"dx-csw-card-text\">\n                        The platform can connect with payment, shipping,\n                        ERP, CRM, applications, and external services\n                        through APIs based on the actual needs of the project.\n                    <\/p>\n\n                    <div class=\"dx-csw-card-bottom\">\n                        <span class=\"dx-csw-dot\"><\/span>\n                        Deeper integration with business systems\n                    <\/div>\n\n                <\/article>\n\n                <article class=\"dx-csw-card\">\n\n                    <div class=\"dx-csw-card-top\">\n\n                        <span class=\"dx-csw-icon\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M4 19V5\"><\/path>\n                                <path d=\"M4 19h16\"><\/path>\n                                <path d=\"m7 15 4-4 3 3 5-6\"><\/path>\n                                <path d=\"M16 8h3v3\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span class=\"dx-csw-number\">03<\/span>\n\n                    <\/div>\n\n                    <h3 class=\"dx-csw-card-title\">\n                        Architecture Designed to Scale\n                    <\/h3>\n\n                    <p class=\"dx-csw-card-text\">\n                        The system can be planned from the beginning\n                        to support additional functionality, sales\n                        channels, and services as the project evolves.\n                    <\/p>\n\n                    <div class=\"dx-csw-card-bottom\">\n                        <span class=\"dx-csw-dot\"><\/span>\n                        Greater flexibility for future development\n                    <\/div>\n\n                <\/article>\n\n                <article class=\"dx-csw-card\">\n\n                    <div class=\"dx-csw-card-top\">\n\n                        <span class=\"dx-csw-icon\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m13 2-9 12h7l-1 8 9-12h-7Z\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span class=\"dx-csw-number\">04<\/span>\n\n                    <\/div>\n\n                    <h3 class=\"dx-csw-card-title\">\n                        Performance Optimized Around the Platform\n                    <\/h3>\n\n                    <p class=\"dx-csw-card-text\">\n                        Custom development provides greater control\n                        over how pages, data, and services are loaded\n                        and allows the technical architecture to be\n                        selected around the project itself.\n                    <\/p>\n\n                    <div class=\"dx-csw-card-bottom\">\n                        <span class=\"dx-csw-dot\"><\/span>\n                        Less dependence on unnecessary plugins\n                    <\/div>\n\n                <\/article>\n\n                <article class=\"dx-csw-card\">\n\n                    <div class=\"dx-csw-card-top\">\n\n                        <span class=\"dx-csw-icon\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M12 3 4 6v6c0 5 3.4 8 8 9 4.6-1 8-4 8-9V6Z\"><\/path>\n                                <path d=\"m8 12 3 3 5-6\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span class=\"dx-csw-number\">05<\/span>\n\n                    <\/div>\n\n                    <h3 class=\"dx-csw-card-title\">\n                        Greater Control Over Security & Permissions\n                    <\/h3>\n\n                    <p class=\"dx-csw-card-text\">\n                        Access levels, user roles, workflows, and data\n                        handling can be designed around the project\n                        rather than relying only on generic platform settings.\n                    <\/p>\n\n                    <div class=\"dx-csw-card-bottom\">\n                        <span class=\"dx-csw-dot\"><\/span>\n                        Custom roles and access policies\n                    <\/div>\n\n                <\/article>\n\n                <article class=\"dx-csw-card\">\n\n                    <div class=\"dx-csw-card-top\">\n\n                        <span class=\"dx-csw-icon\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M5 4h14v16H5Z\"><\/path>\n                                <path d=\"M9 8h6\"><\/path>\n                                <path d=\"M9 12h6\"><\/path>\n                                <path d=\"M9 16h4\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span class=\"dx-csw-number\">06<\/span>\n\n                    <\/div>\n\n                    <h3 class=\"dx-csw-card-title\">\n                        Better Ownership & Platform Control\n                    <\/h3>\n\n                    <p class=\"dx-csw-card-text\">\n                        Your project is structured around your own\n                        workflows, data, and functionality, reducing\n                        dependence on a theme or a large stack of\n                        third-party extensions.\n                    <\/p>\n\n                    <div class=\"dx-csw-card-bottom\">\n                        <span class=\"dx-csw-dot\"><\/span>\n                        A platform closer to your own digital asset\n                    <\/div>\n\n                <\/article>\n\n            <\/div>\n\n            <div class=\"dx-csw-bottom\">\n\n                <div class=\"dx-csw-bottom-copy\">\n\n                    <span class=\"dx-csw-bottom-icon\" aria-hidden=\"true\">\n                        <svg viewBox=\"0 0 24 24\">\n                            <path d=\"M8 3 4 7l4 4\"><\/path>\n                            <path d=\"m16 3 4 4-4 4\"><\/path>\n                            <path d=\"m14 2-4 10\"><\/path>\n                            <path d=\"M5 17h14\"><\/path>\n                        <\/svg>\n                    <\/span>\n\n                    <div>\n\n                        <h3 class=\"dx-csw-bottom-title\">\n                            Custom Development Is Not Automatically the Right Choice\n                        <\/h3>\n\n                        <p class=\"dx-csw-bottom-text\">\n                            The right technology should be selected based\n                            on your business model, required functionality,\n                            integrations, and growth plan.\n                        <\/p>\n\n                    <\/div>\n\n                <\/div>\n\n                <a\n                    href=\"https:\/\/dindex.net\/en\/contact\/\"\n                    class=\"dx-csw-button\"\n                >\n                    <span>Discuss the Right Solution<\/span>\n\n                    <svg\n                        viewBox=\"0 0 24 24\"\n                        aria-hidden=\"true\"\n                    >\n                        <path d=\"M5 12h14\"><\/path>\n                        <path d=\"m13 6 6 6-6 6\"><\/path>\n                    <\/svg>\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomStoreWhyEn() {\n        const section = document.getElementById(\n            \"dx-custom-store-why-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-store-why-en-fullwidth\"\n            );\n        }\n\n        if (\n            !(\"IntersectionObserver\" in window) ||\n            window.matchMedia(\n                \"(prefers-reduced-motion: reduce)\"\n            ).matches\n        ) {\n            return;\n        }\n\n        const cards = section.querySelectorAll(\n            \".dx-csw-card\"\n        );\n\n        const bottom = section.querySelector(\n            \".dx-csw-bottom\"\n        );\n\n        cards.forEach(function (card, index) {\n            card.style.opacity = \"0\";\n            card.style.transform = \"translateY(26px)\";\n\n            card.style.transition =\n                \"opacity 0.62s ease \" +\n                (index * 0.07) +\n                \"s, transform 0.62s ease \" +\n                (index * 0.07) +\n                \"s\";\n        });\n\n        if (bottom) {\n            bottom.style.opacity = \"0\";\n            bottom.style.transform = \"translateY(22px)\";\n\n            bottom.style.transition =\n                \"opacity 0.65s ease 0.30s, transform 0.65s ease 0.30s\";\n        }\n\n        const observer = new IntersectionObserver(\n            function (entries, currentObserver) {\n                entries.forEach(function (entry) {\n                    if (!entry.isIntersecting) {\n                        return;\n                    }\n\n                    cards.forEach(function (card) {\n                        card.style.opacity = \"1\";\n                        card.style.transform = \"translateY(0)\";\n                    });\n\n                    if (bottom) {\n                        bottom.style.opacity = \"1\";\n                        bottom.style.transform = \"translateY(0)\";\n                    }\n\n                    currentObserver.unobserve(entry.target);\n                });\n            },\n            {\n                threshold: 0.1\n            }\n        );\n\n        observer.observe(section);\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomStoreWhyEn\n        );\n    } else {\n        initDxCustomStoreWhyEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d15e2ab e-flex e-con-boxed e-con e-parent\" data-id=\"d15e2ab\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8282fa6 elementor-widget elementor-widget-html\" data-id=\"8282fa6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-capabilities-en),\n.elementor-widget-html:has(#dx-custom-capabilities-en) > .elementor-widget-container,\n.dx-custom-capabilities-en-fullwidth,\n.dx-custom-capabilities-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-capabilities-en,\n#dx-custom-capabilities-en *,\n#dx-custom-capabilities-en *::before,\n#dx-custom-capabilities-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-capabilities-en {\n    --dx-bg: #f7f4fb;\n    --dx-white: #ffffff;\n    --dx-dark: #180b35;\n    --dx-text: #6d6478;\n    --dx-muted: #958d9f;\n    --dx-purple: #7045df;\n    --dx-purple-light: #966af0;\n    --dx-yellow: #ffc441;\n    --dx-green: #53cf92;\n    --dx-blue: #65aef7;\n    --dx-border: rgba(112, 69, 223, 0.12);\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-dark);\n\n    background:\n        radial-gradient(\n            circle at 8% 13%,\n            rgba(112, 69, 223, 0.08),\n            transparent 25%\n        ),\n        radial-gradient(\n            circle at 93% 88%,\n            rgba(255, 196, 65, 0.08),\n            transparent 28%\n        ),\n        var(--dx-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-capabilities-en a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-capabilities-en .dx-cc-grid {\n    position: absolute;\n    z-index: -5;\n\n    inset: 0;\n\n    opacity: 0.15;\n\n    background-image:\n        linear-gradient(\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 18%,\n            transparent 83%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 18%,\n            transparent 83%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-capabilities-en .dx-cc-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-capabilities-en .dx-cc-container {\n    width: min(1420px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-capabilities-en .dx-cc-header {\n    max-width: 890px;\n\n    margin:\n        0\n        auto\n        50px;\n\n    text-align: center;\n}\n\n#dx-custom-capabilities-en .dx-cc-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-capabilities-en .dx-cc-eyebrow::before,\n#dx-custom-capabilities-en .dx-cc-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-capabilities-en .dx-cc-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-capabilities-en .dx-cc-title span {\n    color: var(--dx-purple);\n}\n\n#dx-custom-capabilities-en .dx-cc-description {\n    max-width: 760px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-capabilities-en .dx-cc-layout {\n    display: grid;\n    grid-template-columns:\n        minmax(300px, 0.38fr)\n        minmax(0, 1fr);\n\n    align-items: stretch;\n\n    gap: 24px;\n}\n\n#dx-custom-capabilities-en .dx-cc-intro {\n    position: relative;\n    isolation: isolate;\n\n    overflow: hidden;\n\n    display: flex;\n    flex-direction: column;\n\n    padding:\n        34px\n        30px;\n\n    border: 1px solid rgba(112, 69, 223, 0.14);\n    border-radius: 25px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.98),\n            rgba(247, 244, 252, 0.97)\n        );\n\n    box-shadow:\n        0 24px 62px rgba(40, 18, 84, 0.10);\n}\n\n#dx-custom-capabilities-en .dx-cc-intro::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: -2;\n\n    right: -130px;\n    bottom: -160px;\n\n    width: 320px;\n    height: 320px;\n\n    border-radius: 50%;\n\n    background: rgba(112, 69, 223, 0.10);\n\n    filter: blur(90px);\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-icon {\n    width: 70px;\n    height: 70px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 21px;\n\n    color: #ffffff;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    box-shadow:\n        0 18px 38px rgba(112, 69, 223, 0.22);\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-icon svg {\n    width: 33px;\n    height: 33px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-label {\n    display: block;\n\n    margin-top: 25px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-title {\n    margin:\n        7px\n        0\n        0;\n\n    color: var(--dx-dark);\n\n    font-size: 28px;\n    font-weight: 900;\n    line-height: 1.55;\n\n    text-wrap: balance;\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-text {\n    margin:\n        12px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 2;\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-list {\n    margin-top: 24px;\n    padding-top: 21px;\n\n    display: grid;\n    gap: 11px;\n\n    border-top: 1px solid rgba(112, 69, 223, 0.10);\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-item {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 9px;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.8;\n}\n\n#dx-custom-capabilities-en .dx-cc-check {\n    width: 24px;\n    height: 24px;\n    flex: 0 0 24px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 8px;\n\n    color: #16845a;\n\n    background: rgba(83, 207, 146, 0.13);\n}\n\n#dx-custom-capabilities-en .dx-cc-check svg {\n    width: 12px;\n    height: 12px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.3;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-capabilities-en .dx-cc-intro-note {\n    margin-top: auto;\n    padding-top: 26px;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.85;\n}\n\n#dx-custom-capabilities-en .dx-cc-system {\n    overflow: hidden;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 26px;\n\n    background: rgba(255, 255, 255, 0.94);\n\n    box-shadow:\n        0 26px 68px rgba(40, 18, 84, 0.10);\n}\n\n#dx-custom-capabilities-en .dx-cc-system-head {\n    min-height: 72px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    gap: 20px;\n\n    padding:\n        0\n        26px;\n\n    border-bottom: 1px solid rgba(112, 69, 223, 0.10);\n\n    background:\n        linear-gradient(\n            180deg,\n            #ffffff,\n            #fbf9fe\n        );\n}\n\n#dx-custom-capabilities-en .dx-cc-system-heading {\n    display: flex;\n    align-items: center;\n\n    gap: 11px;\n}\n\n#dx-custom-capabilities-en .dx-cc-system-mark {\n    width: 11px;\n    height: 11px;\n\n    border-radius: 50%;\n\n    background: var(--dx-green);\n\n    box-shadow:\n        0 0 0 6px rgba(83, 207, 146, 0.10);\n}\n\n#dx-custom-capabilities-en .dx-cc-system-title {\n    color: var(--dx-dark);\n\n    font-size: 15px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-capabilities-en .dx-cc-system-meta {\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 800;\n}\n\n#dx-custom-capabilities-en .dx-cc-rows {\n    display: grid;\n}\n\n#dx-custom-capabilities-en .dx-cc-row {\n    position: relative;\n\n    display: grid;\n    grid-template-columns:\n        72px\n        minmax(0, 0.72fr)\n        minmax(0, 1.28fr);\n\n    align-items: center;\n\n    gap: 20px;\n\n    min-height: 142px;\n\n    padding:\n        22px\n        26px;\n\n    border-bottom: 1px solid rgba(112, 69, 223, 0.09);\n\n    transition:\n        background 0.28s ease,\n        padding 0.28s ease;\n}\n\n#dx-custom-capabilities-en .dx-cc-row:last-child {\n    border-bottom: 0;\n}\n\n#dx-custom-capabilities-en .dx-cc-row:hover {\n    background: rgba(112, 69, 223, 0.035);\n}\n\n#dx-custom-capabilities-en .dx-cc-row::before {\n    content: \"\";\n\n    position: absolute;\n\n    top: 18%;\n    left: 0;\n    bottom: 18%;\n\n    width: 3px;\n\n    border-radius: 999px;\n\n    background: var(--dx-purple);\n\n    opacity: 0;\n\n    transform: scaleY(0.35);\n\n    transition:\n        opacity 0.28s ease,\n        transform 0.28s ease;\n}\n\n#dx-custom-capabilities-en .dx-cc-row:hover::before {\n    opacity: 1;\n    transform: scaleY(1);\n}\n\n#dx-custom-capabilities-en .dx-cc-row:nth-child(2)::before,\n#dx-custom-capabilities-en .dx-cc-row:nth-child(5)::before {\n    background: var(--dx-yellow);\n}\n\n#dx-custom-capabilities-en .dx-cc-row:nth-child(3)::before,\n#dx-custom-capabilities-en .dx-cc-row:nth-child(6)::before {\n    background: var(--dx-green);\n}\n\n#dx-custom-capabilities-en .dx-cc-row:nth-child(4)::before {\n    background: var(--dx-blue);\n}\n\n#dx-custom-capabilities-en .dx-cc-row-icon {\n    width: 58px;\n    height: 58px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 17px;\n\n    color: var(--dx-purple);\n\n    background: rgba(112, 69, 223, 0.09);\n}\n\n#dx-custom-capabilities-en .dx-cc-row:nth-child(2)\n    .dx-cc-row-icon,\n#dx-custom-capabilities-en .dx-cc-row:nth-child(5)\n    .dx-cc-row-icon {\n    color: #936500;\n\n    background: rgba(255, 196, 65, 0.15);\n}\n\n#dx-custom-capabilities-en .dx-cc-row:nth-child(3)\n    .dx-cc-row-icon,\n#dx-custom-capabilities-en .dx-cc-row:nth-child(6)\n    .dx-cc-row-icon {\n    color: #16845a;\n\n    background: rgba(83, 207, 146, 0.13);\n}\n\n#dx-custom-capabilities-en .dx-cc-row:nth-child(4)\n    .dx-cc-row-icon {\n    color: #2172bd;\n\n    background: rgba(101, 174, 247, 0.13);\n}\n\n#dx-custom-capabilities-en .dx-cc-row-icon svg {\n    width: 28px;\n    height: 28px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-capabilities-en .dx-cc-row-number {\n    display: block;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-capabilities-en .dx-cc-row-title {\n    margin:\n        5px\n        0\n        0;\n\n    color: var(--dx-dark);\n\n    font-size: 19px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-capabilities-en .dx-cc-row-content {\n    min-width: 0;\n}\n\n#dx-custom-capabilities-en .dx-cc-row-text {\n    margin: 0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 1.9;\n}\n\n#dx-custom-capabilities-en .dx-cc-tags {\n    margin-top: 10px;\n\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n\n    gap: 7px;\n}\n\n#dx-custom-capabilities-en .dx-cc-tag {\n    min-height: 28px;\n\n    display: inline-flex;\n    align-items: center;\n\n    padding:\n        0\n        9px;\n\n    border: 1px solid rgba(112, 69, 223, 0.10);\n    border-radius: 999px;\n\n    color: var(--dx-muted);\n\n    background: rgba(112, 69, 223, 0.04);\n\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1;\n}\n\n#dx-custom-capabilities-en .dx-cc-bottom {\n    margin-top: 24px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    gap: 24px;\n\n    padding:\n        23px\n        26px;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 19px;\n\n    background: rgba(255, 255, 255, 0.82);\n}\n\n#dx-custom-capabilities-en .dx-cc-bottom-copy {\n    min-width: 0;\n}\n\n#dx-custom-capabilities-en .dx-cc-bottom-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: 16px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-capabilities-en .dx-cc-bottom-text {\n    margin:\n        4px\n        0\n        0;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.8;\n}\n\n#dx-custom-capabilities-en .dx-cc-button {\n    min-width: 210px;\n    min-height: 51px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 9px;\n\n    padding:\n        0\n        21px;\n\n    border-radius: 12px;\n\n    color: #ffffff;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    box-shadow:\n        0 16px 34px rgba(112, 69, 223, 0.21);\n\n    font-size: 14px;\n    font-weight: 900;\n    white-space: nowrap;\n\n    transition:\n        transform 0.25s ease,\n        box-shadow 0.25s ease;\n}\n\n#dx-custom-capabilities-en .dx-cc-button:hover,\n#dx-custom-capabilities-en .dx-cc-button:focus-visible {\n    transform: translateY(-3px);\n\n    box-shadow:\n        0 22px 44px rgba(112, 69, 223, 0.30);\n}\n\n#dx-custom-capabilities-en .dx-cc-button svg {\n    width: 17px;\n    height: 17px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n@media (max-width: 1050px) {\n    #dx-custom-capabilities-en .dx-cc-layout {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-intro-note {\n        margin-top: 25px;\n    }\n}\n\n@media (max-width: 980px) {\n    #dx-custom-capabilities-en .dx-cc-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-row {\n        grid-template-columns:\n            64px\n            minmax(0, 0.8fr)\n            minmax(0, 1.2fr);\n    }\n}\n\n@media (max-width: 720px) {\n    #dx-custom-capabilities-en .dx-cc-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-header {\n        margin-bottom: 34px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-eyebrow::before,\n    #dx-custom-capabilities-en .dx-cc-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n        letter-spacing: -0.2px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-description {\n        margin-top: 10px;\n\n        font-size: 14px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-intro {\n        padding:\n            25px\n            20px;\n\n        border-radius: 20px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-intro-icon {\n        width: 60px;\n        height: 60px;\n\n        border-radius: 18px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-intro-icon svg {\n        width: 29px;\n        height: 29px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-intro-title {\n        font-size: 23px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-system {\n        border-radius: 20px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-system-head {\n        min-height: 64px;\n\n        padding:\n            0\n            16px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-system-meta {\n        display: none;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-row {\n        grid-template-columns:\n            52px\n            minmax(0, 1fr);\n\n        gap: 13px;\n\n        min-height: 0;\n\n        padding:\n            19px\n            16px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-row-content {\n        grid-column: 1 \/ -1;\n\n        padding-left: 65px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-row-icon {\n        width: 48px;\n        height: 48px;\n\n        border-radius: 14px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-row-icon svg {\n        width: 23px;\n        height: 23px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-row-title {\n        font-size: 17px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-bottom {\n        flex-direction: column;\n\n        align-items: stretch;\n\n        text-align: center;\n\n        padding:\n            20px\n            16px;\n    }\n\n    #dx-custom-capabilities-en .dx-cc-button {\n        width: 100%;\n        min-width: 0;\n    }\n}\n\n#dx-custom-capabilities-en a:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-capabilities-en *,\n    #dx-custom-capabilities-en *::before,\n    #dx-custom-capabilities-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-capabilities-en\"\n    aria-labelledby=\"dx-custom-capabilities-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div\n        class=\"dx-cc-grid\"\n        aria-hidden=\"true\"\n    ><\/div>\n\n    <div class=\"dx-cc-main\">\n\n        <div class=\"dx-cc-container\">\n\n            <header class=\"dx-cc-header\">\n\n                <span class=\"dx-cc-eyebrow\">\n                    Built Around Your Business Requirements\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-capabilities-title-en\"\n                    class=\"dx-cc-title\"\n                >\n                    What Can We Build Into Your\n                    <span>Custom E-Commerce Platform?<\/span>\n                <\/h2>\n\n                <p class=\"dx-cc-description\">\n                    Instead of starting with a fixed list of features,\n                    we define what your business actually needs and\n                    build the storefront, workflows, administration,\n                    and integrations around your real sales process.\n                <\/p>\n\n            <\/header>\n\n            <div class=\"dx-cc-layout\">\n\n                <aside class=\"dx-cc-intro\">\n\n                    <span\n                        class=\"dx-cc-intro-icon\"\n                        aria-hidden=\"true\"\n                    >\n                        <svg viewBox=\"0 0 24 24\">\n                            <path d=\"M4 4h6v6H4Z\"><\/path>\n                            <path d=\"M14 4h6v6h-6Z\"><\/path>\n                            <path d=\"M4 14h6v6H4Z\"><\/path>\n                            <path d=\"M14 14h6v6h-6Z\"><\/path>\n                        <\/svg>\n                    <\/span>\n\n                    <span class=\"dx-cc-intro-label\">\n                        Architecture Based on Your Business Model\n                    <\/span>\n\n                    <h3 class=\"dx-cc-intro-title\">\n                        Not a Store With Fixed Features, but an E-Commerce System Shaped Around Your Business\n                    <\/h3>\n\n                    <p class=\"dx-cc-intro-text\">\n                        Every part can be defined around your requirements,\n                        from products and pricing to customers, orders,\n                        permissions, administration, and external systems.\n                    <\/p>\n\n                    <div class=\"dx-cc-intro-list\">\n\n                        <div class=\"dx-cc-intro-item\">\n                            <span class=\"dx-cc-check\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n                            Features designed around real business operations.\n                        <\/div>\n\n                        <div class=\"dx-cc-intro-item\">\n                            <span class=\"dx-cc-check\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n                            New modules and functionality can be added over time.\n                        <\/div>\n\n                        <div class=\"dx-cc-intro-item\">\n                            <span class=\"dx-cc-check\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n                            Different interfaces for customers and administration.\n                        <\/div>\n\n                    <\/div>\n\n                    <p class=\"dx-cc-intro-note\">\n                        Final functionality depends on the project scope,\n                        commerce model, and required integrations.\n                    <\/p>\n\n                <\/aside>\n\n                <div class=\"dx-cc-system\">\n\n                    <div class=\"dx-cc-system-head\">\n\n                        <div class=\"dx-cc-system-heading\">\n                            <span class=\"dx-cc-system-mark\"><\/span>\n\n                            <span class=\"dx-cc-system-title\">\n                                Custom E-Commerce Architecture\n                            <\/span>\n                        <\/div>\n\n                        <span class=\"dx-cc-system-meta\">\n                            MODULES \/ APIs \/ WORKFLOWS\n                        <\/span>\n\n                    <\/div>\n\n                    <div class=\"dx-cc-rows\">\n\n                        <article class=\"dx-cc-row\">\n\n                            <span class=\"dx-cc-row-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M6 3h12l3 5-9 13L3 8Z\"><\/path>\n                                    <path d=\"M3 8h18\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <div>\n                                <span class=\"dx-cc-row-number\">01<\/span>\n\n                                <h3 class=\"dx-cc-row-title\">\n                                    Products & Pricing\n                                <\/h3>\n                            <\/div>\n\n                            <div class=\"dx-cc-row-content\">\n\n                                <p class=\"dx-cc-row-text\">\n                                    Build product types, pricing rules,\n                                    discounts, bundles, options, variants,\n                                    and pricing logic around your sales model.\n                                <\/p>\n\n                                <div class=\"dx-cc-tags\">\n                                    <span class=\"dx-cc-tag\">Products<\/span>\n                                    <span class=\"dx-cc-tag\">Pricing Rules<\/span>\n                                    <span class=\"dx-cc-tag\">Variants<\/span>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/article>\n\n                        <article class=\"dx-cc-row\">\n\n                            <span class=\"dx-cc-row-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M3 5h2l2 11h10l2-8H7\"><\/path>\n                                    <circle cx=\"9\" cy=\"20\" r=\"1\"><\/circle>\n                                    <circle cx=\"17\" cy=\"20\" r=\"1\"><\/circle>\n                                <\/svg>\n                            <\/span>\n\n                            <div>\n                                <span class=\"dx-cc-row-number\">02<\/span>\n\n                                <h3 class=\"dx-cc-row-title\">\n                                    Ordering & Checkout Flow\n                                <\/h3>\n                            <\/div>\n\n                            <div class=\"dx-cc-row-content\">\n\n                                <p class=\"dx-cc-row-text\">\n                                    Design the cart, checkout, ordering\n                                    stages, validation rules, and purchasing\n                                    process around the way your business sells.\n                                <\/p>\n\n                                <div class=\"dx-cc-tags\">\n                                    <span class=\"dx-cc-tag\">Cart<\/span>\n                                    <span class=\"dx-cc-tag\">Checkout<\/span>\n                                    <span class=\"dx-cc-tag\">Order Flow<\/span>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/article>\n\n                        <article class=\"dx-cc-row\">\n\n                            <span class=\"dx-cc-row-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <circle cx=\"9\" cy=\"8\" r=\"3\"><\/circle>\n                                    <path d=\"M3 21v-2a6 6 0 0 1 12 0v2\"><\/path>\n                                    <circle cx=\"17\" cy=\"9\" r=\"2\"><\/circle>\n                                    <path d=\"M16 15a5 5 0 0 1 5 5v1\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <div>\n                                <span class=\"dx-cc-row-number\">03<\/span>\n\n                                <h3 class=\"dx-cc-row-title\">\n                                    Customers & Permissions\n                                <\/h3>\n                            <\/div>\n\n                            <div class=\"dx-cc-row-content\">\n\n                                <p class=\"dx-cc-row-text\">\n                                    Customer accounts, user levels,\n                                    administration roles, staff access,\n                                    B2B customers, and other permission\n                                    models required by the system.\n                                <\/p>\n\n                                <div class=\"dx-cc-tags\">\n                                    <span class=\"dx-cc-tag\">Accounts<\/span>\n                                    <span class=\"dx-cc-tag\">Roles<\/span>\n                                    <span class=\"dx-cc-tag\">B2B<\/span>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/article>\n\n                        <article class=\"dx-cc-row\">\n\n                            <span class=\"dx-cc-row-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <rect\n                                        x=\"3\"\n                                        y=\"5\"\n                                        width=\"18\"\n                                        height=\"14\"\n                                        rx=\"2\"\n                                    ><\/rect>\n                                    <path d=\"M3 10h18\"><\/path>\n                                    <path d=\"M7 15h2\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <div>\n                                <span class=\"dx-cc-row-number\">04<\/span>\n\n                                <h3 class=\"dx-cc-row-title\">\n                                    Payments & Billing\n                                <\/h3>\n                            <\/div>\n\n                            <div class=\"dx-cc-row-content\">\n\n                                <p class=\"dx-cc-row-text\">\n                                    Connect suitable payment solutions\n                                    and manage payment states, invoices,\n                                    refunds, and project-specific financial logic.\n                                <\/p>\n\n                                <div class=\"dx-cc-tags\">\n                                    <span class=\"dx-cc-tag\">Payments<\/span>\n                                    <span class=\"dx-cc-tag\">Invoices<\/span>\n                                    <span class=\"dx-cc-tag\">Refunds<\/span>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/article>\n\n                        <article class=\"dx-cc-row\">\n\n                            <span class=\"dx-cc-row-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M3 7h11v10H3Z\"><\/path>\n                                    <path d=\"M14 10h4l3 3v4h-7Z\"><\/path>\n                                    <circle cx=\"7\" cy=\"18\" r=\"2\"><\/circle>\n                                    <circle cx=\"18\" cy=\"18\" r=\"2\"><\/circle>\n                                <\/svg>\n                            <\/span>\n\n                            <div>\n                                <span class=\"dx-cc-row-number\">05<\/span>\n\n                                <h3 class=\"dx-cc-row-title\">\n                                    Shipping & Fulfillment\n                                <\/h3>\n                            <\/div>\n\n                            <div class=\"dx-cc-row-content\">\n\n                                <p class=\"dx-cc-row-text\">\n                                    Shipping rules, delivery zones,\n                                    courier integrations, fulfillment\n                                    workflows, and order status logic\n                                    based on your operational process.\n                                <\/p>\n\n                                <div class=\"dx-cc-tags\">\n                                    <span class=\"dx-cc-tag\">Shipping<\/span>\n                                    <span class=\"dx-cc-tag\">Delivery APIs<\/span>\n                                    <span class=\"dx-cc-tag\">Fulfillment<\/span>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/article>\n\n                        <article class=\"dx-cc-row\">\n\n                            <span class=\"dx-cc-row-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M8 3v4\"><\/path>\n                                    <path d=\"M16 3v4\"><\/path>\n                                    <path d=\"M7 7h10v4a5 5 0 0 1-10 0Z\"><\/path>\n                                    <path d=\"M12 16v5\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <div>\n                                <span class=\"dx-cc-row-number\">06<\/span>\n\n                                <h3 class=\"dx-cc-row-title\">\n                                    Systems & Integrations\n                                <\/h3>\n                            <\/div>\n\n                            <div class=\"dx-cc-row-content\">\n\n                                <p class=\"dx-cc-row-text\">\n                                    Connect the platform with ERP,\n                                    CRM, inventory, accounting,\n                                    applications, and external services\n                                    through APIs where required.\n                                <\/p>\n\n                                <div class=\"dx-cc-tags\">\n                                    <span class=\"dx-cc-tag\">ERP<\/span>\n                                    <span class=\"dx-cc-tag\">CRM<\/span>\n                                    <span class=\"dx-cc-tag\">Custom APIs<\/span>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/article>\n\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n            <div class=\"dx-cc-bottom\">\n\n                <div class=\"dx-cc-bottom-copy\">\n\n                    <h3 class=\"dx-cc-bottom-title\">\n                        Need Functionality That Is Not Listed Here?\n                    <\/h3>\n\n                    <p class=\"dx-cc-bottom-text\">\n                        A custom project starts with the requirements,\n                        so additional workflows, integrations, and modules\n                        can be evaluated around your business model.\n                    <\/p>\n\n                <\/div>\n\n                <a\n                    href=\"https:\/\/dindex.net\/en\/contact\/\"\n                    class=\"dx-cc-button\"\n                >\n                    <span>Share Your System Requirements<\/span>\n\n                    <svg\n                        viewBox=\"0 0 24 24\"\n                        aria-hidden=\"true\"\n                    >\n                        <path d=\"M5 12h14\"><\/path>\n                        <path d=\"m13 6 6 6-6 6\"><\/path>\n                    <\/svg>\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomCapabilitiesEn() {\n        const section = document.getElementById(\n            \"dx-custom-capabilities-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-capabilities-en-fullwidth\"\n            );\n        }\n\n        if (\n            !(\"IntersectionObserver\" in window) ||\n            window.matchMedia(\n                \"(prefers-reduced-motion: reduce)\"\n            ).matches\n        ) {\n            return;\n        }\n\n        const intro = section.querySelector(\n            \".dx-cc-intro\"\n        );\n\n        const rows = section.querySelectorAll(\n            \".dx-cc-row\"\n        );\n\n        if (intro) {\n            intro.style.opacity = \"0\";\n            intro.style.transform = \"translateX(-28px)\";\n            intro.style.transition =\n                \"opacity 0.7s ease, transform 0.7s ease\";\n        }\n\n        rows.forEach(function (row, index) {\n            row.style.opacity = \"0\";\n            row.style.transform = \"translateY(18px)\";\n            row.style.transition =\n                \"opacity 0.56s ease \" +\n                (0.07 + index * 0.06) +\n                \"s, transform 0.56s ease \" +\n                (0.07 + index * 0.06) +\n                \"s\";\n        });\n\n        const observer = new IntersectionObserver(\n            function (entries, currentObserver) {\n                entries.forEach(function (entry) {\n                    if (!entry.isIntersecting) {\n                        return;\n                    }\n\n                    if (intro) {\n                        intro.style.opacity = \"1\";\n                        intro.style.transform = \"translateX(0)\";\n                    }\n\n                    rows.forEach(function (row) {\n                        row.style.opacity = \"1\";\n                        row.style.transform = \"translateY(0)\";\n                    });\n\n                    currentObserver.unobserve(entry.target);\n                });\n            },\n            {\n                threshold: 0.1\n            }\n        );\n\n        observer.observe(section);\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomCapabilitiesEn\n        );\n    } else {\n        initDxCustomCapabilitiesEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-00ce752 e-flex e-con-boxed e-con e-parent\" data-id=\"00ce752\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c377093 elementor-widget elementor-widget-html\" data-id=\"c377093\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-dashboard-en),\n.elementor-widget-html:has(#dx-custom-dashboard-en) > .elementor-widget-container,\n.dx-custom-dashboard-en-fullwidth,\n.dx-custom-dashboard-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-dashboard-en,\n#dx-custom-dashboard-en *,\n#dx-custom-dashboard-en *::before,\n#dx-custom-dashboard-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-dashboard-en {\n    --dx-dark: #09001f;\n    --dx-dark-secondary: #17053d;\n    --dx-white: #ffffff;\n    --dx-text: rgba(255, 255, 255, 0.72);\n    --dx-muted: rgba(255, 255, 255, 0.50);\n    --dx-purple: #6942d8;\n    --dx-purple-light: #9168ef;\n    --dx-yellow: #ffc441;\n    --dx-yellow-light: #ffd66e;\n    --dx-green: #54d696;\n    --dx-blue: #58a8f7;\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-white);\n\n    background:\n        radial-gradient(\n            circle at 10% 14%,\n            rgba(145, 104, 239, 0.22),\n            transparent 28%\n        ),\n        radial-gradient(\n            circle at 91% 86%,\n            rgba(105, 66, 216, 0.18),\n            transparent 30%\n        ),\n        linear-gradient(\n            145deg,\n            var(--dx-dark-secondary),\n            var(--dx-dark)\n        );\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-dashboard-en a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-dashboard-en img {\n    display: block;\n    max-width: 100%;\n}\n\n#dx-custom-dashboard-en .dx-cd-grid {\n    position: absolute;\n    z-index: -6;\n\n    inset: 0;\n\n    opacity: 0.10;\n\n    background-image:\n        linear-gradient(\n            rgba(255, 255, 255, 0.045) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(255, 255, 255, 0.045) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 83%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 83%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-dashboard-en .dx-cd-glow {\n    position: absolute;\n    z-index: -5;\n\n    border-radius: 50%;\n    filter: blur(110px);\n\n    pointer-events: none;\n}\n\n#dx-custom-dashboard-en .dx-cd-glow-one {\n    top: -170px;\n    right: 26%;\n\n    width: 430px;\n    height: 430px;\n\n    background: rgba(145, 104, 239, 0.18);\n}\n\n#dx-custom-dashboard-en .dx-cd-glow-two {\n    left: -190px;\n    bottom: -220px;\n\n    width: 500px;\n    height: 440px;\n\n    background: rgba(255, 196, 65, 0.055);\n}\n\n#dx-custom-dashboard-en .dx-cd-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-dashboard-en .dx-cd-container {\n    width: min(1420px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-dashboard-en .dx-cd-header {\n    max-width: 900px;\n\n    margin:\n        0\n        auto\n        50px;\n\n    text-align: center;\n}\n\n#dx-custom-dashboard-en .dx-cd-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-dashboard-en .dx-cd-eyebrow::before,\n#dx-custom-dashboard-en .dx-cd-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-dashboard-en .dx-cd-title {\n    margin: 0;\n\n    color: #ffffff;\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-dashboard-en .dx-cd-title span {\n    color: var(--dx-yellow);\n}\n\n#dx-custom-dashboard-en .dx-cd-description {\n    max-width: 770px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-dashboard-en .dx-cd-layout {\n    display: grid;\n    grid-template-columns:\n        minmax(330px, 0.72fr)\n        minmax(0, 1.28fr);\n\n    align-items: stretch;\n\n    gap: 25px;\n}\n\n#dx-custom-dashboard-en .dx-cd-info {\n    position: relative;\n    isolation: isolate;\n\n    min-height: 100%;\n\n    display: flex;\n    flex-direction: column;\n\n    overflow: hidden;\n\n    padding:\n        34px\n        30px;\n\n    border: 1px solid rgba(255, 255, 255, 0.12);\n    border-radius: 25px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.09),\n            rgba(255, 255, 255, 0.035)\n        );\n\n    box-shadow:\n        0 24px 60px rgba(2, 0, 20, 0.27),\n        inset 0 1px 0 rgba(255, 255, 255, 0.06);\n\n    -webkit-backdrop-filter: blur(10px);\n    backdrop-filter: blur(10px);\n}\n\n#dx-custom-dashboard-en .dx-cd-info::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: -2;\n\n    right: -140px;\n    bottom: -170px;\n\n    width: 350px;\n    height: 350px;\n\n    border-radius: 50%;\n\n    background: rgba(105, 66, 216, 0.14);\n\n    filter: blur(90px);\n\n    pointer-events: none;\n}\n\n#dx-custom-dashboard-en .dx-cd-info-icon {\n    width: 72px;\n    height: 72px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255, 255, 255, 0.14);\n    border-radius: 22px;\n\n    color: #180b35;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-yellow),\n            var(--dx-yellow-light)\n        );\n\n    box-shadow:\n        0 18px 38px rgba(255, 196, 65, 0.22);\n}\n\n#dx-custom-dashboard-en .dx-cd-info-icon svg {\n    width: 34px;\n    height: 34px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-dashboard-en .dx-cd-info-label {\n    display: block;\n\n    margin-top: 27px;\n\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-dashboard-en .dx-cd-info-title {\n    margin:\n        8px\n        0\n        0;\n\n    color: #ffffff;\n\n    font-size: 29px;\n    font-weight: 900;\n    line-height: 1.55;\n\n    text-wrap: balance;\n}\n\n#dx-custom-dashboard-en .dx-cd-info-text {\n    margin:\n        13px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 2;\n}\n\n#dx-custom-dashboard-en .dx-cd-info-list {\n    margin-top: 25px;\n    padding-top: 22px;\n\n    display: grid;\n\n    gap: 12px;\n\n    border-top: 1px solid rgba(255, 255, 255, 0.10);\n}\n\n#dx-custom-dashboard-en .dx-cd-info-item {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 10px;\n\n    color: rgba(255, 255, 255, 0.73);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.8;\n}\n\n#dx-custom-dashboard-en .dx-cd-info-check {\n    width: 25px;\n    height: 25px;\n    flex: 0 0 25px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 8px;\n\n    color: #7ce3b3;\n\n    background: rgba(84, 214, 150, 0.12);\n}\n\n#dx-custom-dashboard-en .dx-cd-info-check svg {\n    width: 13px;\n    height: 13px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.3;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-dashboard-en .dx-cd-button {\n    width: 100%;\n    min-height: 52px;\n\n    margin-top: auto;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 9px;\n\n    padding:\n        0\n        20px;\n\n    border: 1px solid rgba(255, 255, 255, 0.17);\n    border-radius: 12px;\n\n    color: #180b35;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-yellow),\n            var(--dx-yellow-light)\n        );\n\n    box-shadow:\n        0 17px 37px rgba(255, 196, 65, 0.21);\n\n    font-size: 14px;\n    font-weight: 900;\n\n    transition:\n        transform 0.25s ease,\n        box-shadow 0.25s ease;\n}\n\n#dx-custom-dashboard-en .dx-cd-button:hover,\n#dx-custom-dashboard-en .dx-cd-button:focus-visible {\n    box-shadow:\n        0 23px 47px rgba(255, 196, 65, 0.30);\n\n    transform: translateY(-3px);\n}\n\n#dx-custom-dashboard-en .dx-cd-button svg {\n    width: 18px;\n    height: 18px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-dashboard-en .dx-cd-visual {\n    min-width: 0;\n\n    display: flex;\n    flex-direction: column;\n\n    gap: 17px;\n}\n\n#dx-custom-dashboard-en .dx-cd-browser {\n    position: relative;\n\n    min-height: 560px;\n\n    overflow: hidden;\n\n    padding: 12px;\n\n    border: 1px solid rgba(255, 255, 255, 0.12);\n    border-radius: 27px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.09),\n            rgba(255, 255, 255, 0.035)\n        );\n\n    box-shadow:\n        0 28px 72px rgba(2, 0, 20, 0.34),\n        inset 0 1px 0 rgba(255, 255, 255, 0.06);\n\n    -webkit-backdrop-filter: blur(12px);\n    backdrop-filter: blur(12px);\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-inner {\n    height: 100%;\n\n    overflow: hidden;\n\n    border-radius: 19px;\n\n    background: #0c0918;\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-bar {\n    height: 44px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    padding:\n        0\n        15px;\n\n    border-bottom: 1px solid rgba(255, 255, 255, 0.07);\n\n    background:\n        linear-gradient(\n            180deg,\n            #171127,\n            #0d091b\n        );\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-address {\n    width: 50%;\n    height: 11px;\n\n    border-radius: 999px;\n\n    background: rgba(255, 255, 255, 0.07);\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-dots {\n    display: flex;\n    align-items: center;\n\n    gap: 6px;\n\n    direction: ltr;\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-dot {\n    width: 8px;\n    height: 8px;\n\n    border-radius: 50%;\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-dot:nth-child(1) {\n    background: #ff6e6e;\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-dot:nth-child(2) {\n    background: var(--dx-yellow);\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-dot:nth-child(3) {\n    background: var(--dx-green);\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-screen {\n    position: relative;\n\n    min-height: 504px;\n\n    overflow: hidden;\n\n    background: #0c0918;\n}\n\n#dx-custom-dashboard-en .dx-cd-browser-screen img {\n    width: 100%;\n    height: 100%;\n\n    min-height: 504px;\n\n    object-fit: cover;\n    object-position: top center;\n\n    background: #0c0918;\n}\n\n#dx-custom-dashboard-en .dx-cd-badge {\n    position: absolute;\n    z-index: 5;\n\n    display: flex;\n    align-items: center;\n\n    gap: 9px;\n\n    min-width: 176px;\n\n    padding:\n        12px\n        14px;\n\n    border: 1px solid rgba(255, 255, 255, 0.12);\n    border-radius: 14px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(28, 14, 64, 0.94),\n            rgba(10, 2, 31, 0.94)\n        );\n\n    box-shadow:\n        0 18px 42px rgba(0, 0, 0, 0.30);\n\n    -webkit-backdrop-filter: blur(12px);\n    backdrop-filter: blur(12px);\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-one {\n    top: 77px;\n    left: 25px;\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-two {\n    right: 25px;\n    bottom: 30px;\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-icon {\n    width: 38px;\n    height: 38px;\n    flex: 0 0 38px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 11px;\n\n    color: #d6c9ff;\n\n    background: rgba(145, 104, 239, 0.13);\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-two\n    .dx-cd-badge-icon {\n    color: #7ce3b3;\n\n    background: rgba(84, 214, 150, 0.11);\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-icon svg {\n    width: 19px;\n    height: 19px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.9;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-title {\n    display: block;\n\n    color: #ffffff;\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-dashboard-en .dx-cd-badge-text {\n    display: block;\n\n    margin-top: 2px;\n\n    color: rgba(255, 255, 255, 0.52);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.5;\n}\n\n#dx-custom-dashboard-en .dx-cd-modules {\n    display: grid;\n    grid-template-columns:\n        repeat(4, minmax(0, 1fr));\n\n    gap: 12px;\n}\n\n#dx-custom-dashboard-en .dx-cd-module {\n    min-height: 92px;\n\n    display: flex;\n    align-items: center;\n\n    gap: 10px;\n\n    padding:\n        14px\n        13px;\n\n    border: 1px solid rgba(255, 255, 255, 0.10);\n    border-radius: 15px;\n\n    background: rgba(255, 255, 255, 0.05);\n\n    box-shadow:\n        0 14px 34px rgba(2, 0, 20, 0.18);\n}\n\n#dx-custom-dashboard-en .dx-cd-module-icon {\n    width: 39px;\n    height: 39px;\n    flex: 0 0 39px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 12px;\n\n    color: #d6c9ff;\n\n    background: rgba(145, 104, 239, 0.12);\n}\n\n#dx-custom-dashboard-en .dx-cd-module:nth-child(2)\n    .dx-cd-module-icon {\n    color: var(--dx-yellow);\n\n    background: rgba(255, 196, 65, 0.10);\n}\n\n#dx-custom-dashboard-en .dx-cd-module:nth-child(3)\n    .dx-cd-module-icon {\n    color: #7ce3b3;\n\n    background: rgba(84, 214, 150, 0.10);\n}\n\n#dx-custom-dashboard-en .dx-cd-module:nth-child(4)\n    .dx-cd-module-icon {\n    color: #8bc9ff;\n\n    background: rgba(88, 168, 247, 0.10);\n}\n\n#dx-custom-dashboard-en .dx-cd-module-icon svg {\n    width: 20px;\n    height: 20px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.9;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-dashboard-en .dx-cd-module-title {\n    display: block;\n\n    color: #ffffff;\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-dashboard-en .dx-cd-module-text {\n    display: block;\n\n    margin-top: 3px;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.6;\n}\n\n@media (max-width: 1120px) {\n    #dx-custom-dashboard-en .dx-cd-layout {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-info {\n        min-height: 0;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-button {\n        margin-top: 28px;\n    }\n}\n\n@media (max-width: 980px) {\n    #dx-custom-dashboard-en .dx-cd-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-modules {\n        grid-template-columns:\n            repeat(2, minmax(0, 1fr));\n    }\n}\n\n@media (max-width: 680px) {\n    #dx-custom-dashboard-en .dx-cd-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-header {\n        margin-bottom: 34px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-eyebrow::before,\n    #dx-custom-dashboard-en .dx-cd-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n        letter-spacing: -0.2px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-description {\n        margin-top: 10px;\n\n        font-size: 14px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-info {\n        padding:\n            25px\n            20px;\n\n        border-radius: 20px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-info-icon {\n        width: 60px;\n        height: 60px;\n\n        border-radius: 18px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-info-icon svg {\n        width: 29px;\n        height: 29px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-info-title {\n        font-size: 23px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-browser {\n        min-height: 385px;\n\n        padding: 8px;\n\n        border-radius: 20px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-browser-inner {\n        border-radius: 14px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-browser-bar {\n        height: 35px;\n\n        padding:\n            0\n            10px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-browser-screen {\n        min-height: 332px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-browser-screen img {\n        min-height: 332px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-badge {\n        min-width: 150px;\n\n        padding:\n            9px\n            10px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-badge-one {\n        top: 55px;\n        left: 12px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-badge-two {\n        right: 12px;\n        bottom: 18px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-modules {\n        grid-template-columns: 1fr;\n\n        gap: 9px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-module {\n        min-height: 75px;\n    }\n\n    #dx-custom-dashboard-en .dx-cd-glow {\n        display: none;\n    }\n}\n\n#dx-custom-dashboard-en a:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-dashboard-en *,\n    #dx-custom-dashboard-en *::before,\n    #dx-custom-dashboard-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-dashboard-en\"\n    aria-labelledby=\"dx-custom-dashboard-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div\n        class=\"dx-cd-grid\"\n        aria-hidden=\"true\"\n    ><\/div>\n\n    <span\n        class=\"dx-cd-glow dx-cd-glow-one\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-cd-glow dx-cd-glow-two\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <div class=\"dx-cd-main\">\n\n        <div class=\"dx-cd-container\">\n\n            <header class=\"dx-cd-header\">\n\n                <span class=\"dx-cd-eyebrow\">\n                    An Admin Panel Built Around Your Operations\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-dashboard-title-en\"\n                    class=\"dx-cd-title\"\n                >\n                    Manage Your Platform Through a\n                    <span>Fully Custom Admin Dashboard<\/span>\n                <\/h2>\n\n                <p class=\"dx-cd-description\">\n                    Instead of relying on a generic administration\n                    area, the dashboard can be designed around the\n                    tasks, data, workflows, and permissions your team\n                    actually needs for day-to-day operations.\n                <\/p>\n\n            <\/header>\n\n            <div class=\"dx-cd-layout\">\n\n                <aside class=\"dx-cd-info\">\n\n                    <span\n                        class=\"dx-cd-info-icon\"\n                        aria-hidden=\"true\"\n                    >\n                        <svg viewBox=\"0 0 24 24\">\n                            <rect\n                                x=\"3\"\n                                y=\"3\"\n                                width=\"18\"\n                                height=\"18\"\n                                rx=\"2\"\n                            ><\/rect>\n                            <path d=\"M3 9h18\"><\/path>\n                            <path d=\"M9 21V9\"><\/path>\n                            <path d=\"M13 13h4\"><\/path>\n                            <path d=\"M13 17h3\"><\/path>\n                        <\/svg>\n                    <\/span>\n\n                    <span class=\"dx-cd-info-label\">\n                        Filament PHP Admin Panel\n                    <\/span>\n\n                    <h3 class=\"dx-cd-info-title\">\n                        An Admin Experience That Shows Your Team What They Actually Need\n                    <\/h3>\n\n                    <p class=\"dx-cd-info-text\">\n                        The administration area can be organized around\n                        products, orders, customers, reporting, settings,\n                        integrations, and the specific workflows used\n                        by different members of your team.\n                    <\/p>\n\n                    <div class=\"dx-cd-info-list\">\n\n                        <div class=\"dx-cd-info-item\">\n\n                            <span\n                                class=\"dx-cd-info-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Different permission levels for administrators and operational teams.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-info-item\">\n\n                            <span\n                                class=\"dx-cd-info-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Screens and reports designed around business requirements.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-info-item\">\n\n                            <span\n                                class=\"dx-cd-info-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Custom actions for products, customers, and orders.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-info-item\">\n\n                            <span\n                                class=\"dx-cd-info-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                New modules can be added as the platform grows.\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n                    <a\n                        href=\"https:\/\/dindex.net\/en\/contact\/\"\n                        class=\"dx-cd-button\"\n                    >\n                        <span>Discuss Your Admin Requirements<\/span>\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M5 12h14\"><\/path>\n                            <path d=\"m13 6 6 6-6 6\"><\/path>\n                        <\/svg>\n                    <\/a>\n\n                <\/aside>\n\n                <div class=\"dx-cd-visual\">\n\n                    <div class=\"dx-cd-browser\">\n\n                        <div class=\"dx-cd-browser-inner\">\n\n                            <div\n                                class=\"dx-cd-browser-bar\"\n                                aria-hidden=\"true\"\n                            >\n                                <span class=\"dx-cd-browser-address\"><\/span>\n\n                                <span class=\"dx-cd-browser-dots\">\n                                    <span class=\"dx-cd-browser-dot\"><\/span>\n                                    <span class=\"dx-cd-browser-dot\"><\/span>\n                                    <span class=\"dx-cd-browser-dot\"><\/span>\n                                <\/span>\n                            <\/div>\n\n                            <div class=\"dx-cd-browser-screen\">\n\n                                <img loading=\"lazy\"\n                                    src=\"https:\/\/dindex.net\/wp-content\/uploads\/2026\/05\/Filament-Pulse-Dark-1024x767.png\"\n                                    alt=\"Custom e-commerce administration dashboard built with Filament PHP\"\n                                    width=\"1024\"\n                                    height=\"767\"\n                                    loading=\"lazy\"\n                                    decoding=\"async\"\n                                >\n\n                            <\/div>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-badge dx-cd-badge-one\">\n\n                            <span\n                                class=\"dx-cd-badge-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <circle cx=\"9\" cy=\"8\" r=\"3\"><\/circle>\n                                    <path d=\"M3 21v-2a6 6 0 0 1 12 0v2\"><\/path>\n                                    <circle cx=\"17\" cy=\"9\" r=\"2\"><\/circle>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <span class=\"dx-cd-badge-title\">\n                                    Multiple Roles\n                                <\/span>\n\n                                <span class=\"dx-cd-badge-text\">\n                                    Roles & Permissions\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-badge dx-cd-badge-two\">\n\n                            <span\n                                class=\"dx-cd-badge-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M4 19V5\"><\/path>\n                                    <path d=\"M4 19h16\"><\/path>\n                                    <path d=\"M8 16v-5\"><\/path>\n                                    <path d=\"M12 16V8\"><\/path>\n                                    <path d=\"M16 16v-3\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <span class=\"dx-cd-badge-title\">\n                                    Custom Data Views\n                                <\/span>\n\n                                <span class=\"dx-cd-badge-text\">\n                                    Reports & Metrics\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n                    <div class=\"dx-cd-modules\">\n\n                        <div class=\"dx-cd-module\">\n\n                            <span\n                                class=\"dx-cd-module-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M6 3h12l3 5-9 13L3 8Z\"><\/path>\n                                    <path d=\"M3 8h18\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <span class=\"dx-cd-module-title\">\n                                    Products\n                                <\/span>\n\n                                <span class=\"dx-cd-module-text\">\n                                    Pricing, variants, and inventory\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-module\">\n\n                            <span\n                                class=\"dx-cd-module-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M6 3h12l2 4v14H4V7Z\"><\/path>\n                                    <path d=\"M4 7h16\"><\/path>\n                                    <path d=\"M9 11h6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <span class=\"dx-cd-module-title\">\n                                    Orders\n                                <\/span>\n\n                                <span class=\"dx-cd-module-text\">\n                                    Statuses, actions, and processing\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-module\">\n\n                            <span\n                                class=\"dx-cd-module-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <circle cx=\"9\" cy=\"8\" r=\"3\"><\/circle>\n                                    <path d=\"M3 21v-2a6 6 0 0 1 12 0v2\"><\/path>\n                                    <circle cx=\"17\" cy=\"9\" r=\"2\"><\/circle>\n                                    <path d=\"M16 15a5 5 0 0 1 5 5v1\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <span class=\"dx-cd-module-title\">\n                                    Customers\n                                <\/span>\n\n                                <span class=\"dx-cd-module-text\">\n                                    Accounts, data, and permissions\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cd-module\">\n\n                            <span\n                                class=\"dx-cd-module-icon\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M4 19V5\"><\/path>\n                                    <path d=\"M4 19h16\"><\/path>\n                                    <path d=\"m7 15 4-4 3 3 5-6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <span class=\"dx-cd-module-title\">\n                                    Reports\n                                <\/span>\n\n                                <span class=\"dx-cd-module-text\">\n                                    Data views aligned with management needs\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomDashboardEn() {\n        const section = document.getElementById(\n            \"dx-custom-dashboard-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-dashboard-en-fullwidth\"\n            );\n        }\n\n        if (\n            !(\"IntersectionObserver\" in window) ||\n            window.matchMedia(\n                \"(prefers-reduced-motion: reduce)\"\n            ).matches\n        ) {\n            return;\n        }\n\n        const info = section.querySelector(\n            \".dx-cd-info\"\n        );\n\n        const browser = section.querySelector(\n            \".dx-cd-browser\"\n        );\n\n        const modules = section.querySelectorAll(\n            \".dx-cd-module\"\n        );\n\n        if (info) {\n            info.style.opacity = \"0\";\n            info.style.transform = \"translateX(-28px)\";\n            info.style.transition =\n                \"opacity 0.7s ease, transform 0.7s ease\";\n        }\n\n        if (browser) {\n            browser.style.opacity = \"0\";\n            browser.style.transform = \"translateX(28px)\";\n            browser.style.transition =\n                \"opacity 0.75s ease 0.08s, transform 0.75s ease 0.08s\";\n        }\n\n        modules.forEach(function (module, index) {\n            module.style.opacity = \"0\";\n            module.style.transform = \"translateY(18px)\";\n            module.style.transition =\n                \"opacity 0.56s ease \" +\n                (0.18 + index * 0.07) +\n                \"s, transform 0.56s ease \" +\n                (0.18 + index * 0.07) +\n                \"s\";\n        });\n\n        const observer = new IntersectionObserver(\n            function (entries, currentObserver) {\n                entries.forEach(function (entry) {\n                    if (!entry.isIntersecting) {\n                        return;\n                    }\n\n                    if (info) {\n                        info.style.opacity = \"1\";\n                        info.style.transform = \"translateX(0)\";\n                    }\n\n                    if (browser) {\n                        browser.style.opacity = \"1\";\n                        browser.style.transform = \"translateX(0)\";\n                    }\n\n                    modules.forEach(function (module) {\n                        module.style.opacity = \"1\";\n                        module.style.transform = \"translateY(0)\";\n                    });\n\n                    currentObserver.unobserve(entry.target);\n                });\n            },\n            {\n                threshold: 0.1\n            }\n        );\n\n        observer.observe(section);\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomDashboardEn\n        );\n    } else {\n        initDxCustomDashboardEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cb1160d e-flex e-con-boxed e-con e-parent\" data-id=\"cb1160d\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f587c9 elementor-widget elementor-widget-html\" data-id=\"8f587c9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-ui-en),\n.elementor-widget-html:has(#dx-custom-ui-en) > .elementor-widget-container,\n.dx-custom-ui-en-fullwidth,\n.dx-custom-ui-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-ui-en,\n#dx-custom-ui-en *,\n#dx-custom-ui-en *::before,\n#dx-custom-ui-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-ui-en {\n    --dx-bg: #f7f4fb;\n    --dx-white: #ffffff;\n    --dx-dark: #180b35;\n    --dx-text: #6d6478;\n    --dx-muted: #958d9f;\n    --dx-purple: #7045df;\n    --dx-purple-light: #966af0;\n    --dx-yellow: #ffc441;\n    --dx-green: #53cf92;\n    --dx-blue: #65aef7;\n    --dx-border: rgba(112, 69, 223, 0.12);\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-dark);\n\n    background:\n        radial-gradient(\n            circle at 6% 12%,\n            rgba(112, 69, 223, 0.08),\n            transparent 26%\n        ),\n        radial-gradient(\n            circle at 94% 88%,\n            rgba(255, 196, 65, 0.08),\n            transparent 28%\n        ),\n        var(--dx-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-ui-en button {\n    font-family: inherit;\n}\n\n#dx-custom-ui-en .dx-cui-grid {\n    position: absolute;\n    z-index: -5;\n\n    inset: 0;\n\n    opacity: 0.15;\n\n    background-image:\n        linear-gradient(\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 18%,\n            transparent 83%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 18%,\n            transparent 83%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-ui-en .dx-cui-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-ui-en .dx-cui-container {\n    width: min(1420px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-ui-en .dx-cui-header {\n    max-width: 900px;\n\n    margin:\n        0\n        auto\n        45px;\n\n    text-align: center;\n}\n\n#dx-custom-ui-en .dx-cui-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-ui-en .dx-cui-eyebrow::before,\n#dx-custom-ui-en .dx-cui-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-ui-en .dx-cui-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-ui-en .dx-cui-title span {\n    color: var(--dx-purple);\n}\n\n#dx-custom-ui-en .dx-cui-description {\n    max-width: 770px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-ui-en .dx-cui-tabs {\n    max-width: 920px;\n\n    margin:\n        0\n        auto\n        26px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-wrap: wrap;\n\n    gap: 9px;\n}\n\n#dx-custom-ui-en .dx-cui-tab {\n    min-height: 45px;\n\n    padding:\n        0\n        18px;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 999px;\n\n    color: var(--dx-text);\n\n    background: rgba(255, 255, 255, 0.76);\n\n    font-size: 14px;\n    font-weight: 900;\n\n    cursor: pointer;\n\n    transition:\n        color 0.25s ease,\n        background 0.25s ease,\n        border-color 0.25s ease,\n        transform 0.25s ease;\n}\n\n#dx-custom-ui-en .dx-cui-tab:hover,\n#dx-custom-ui-en .dx-cui-tab:focus-visible {\n    color: var(--dx-purple);\n    border-color: rgba(112, 69, 223, 0.30);\n    transform: translateY(-2px);\n}\n\n#dx-custom-ui-en .dx-cui-tab.is-active {\n    color: #ffffff;\n\n    border-color: transparent;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    box-shadow:\n        0 13px 30px rgba(112, 69, 223, 0.20);\n}\n\n#dx-custom-ui-en .dx-cui-stage {\n    overflow: hidden;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 28px;\n\n    background: #ffffff;\n\n    box-shadow:\n        0 30px 78px rgba(40, 18, 84, 0.11);\n}\n\n#dx-custom-ui-en .dx-cui-browser-bar {\n    min-height: 55px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    gap: 20px;\n\n    padding:\n        0\n        20px;\n\n    border-bottom: 1px solid rgba(112, 69, 223, 0.09);\n\n    background:\n        linear-gradient(\n            180deg,\n            #ffffff,\n            #faf8fd\n        );\n}\n\n#dx-custom-ui-en .dx-cui-browser-dots {\n    display: flex;\n    align-items: center;\n\n    gap: 6px;\n}\n\n#dx-custom-ui-en .dx-cui-browser-dot {\n    width: 9px;\n    height: 9px;\n\n    border-radius: 50%;\n}\n\n#dx-custom-ui-en .dx-cui-browser-dot:nth-child(1) {\n    background: #ff6e6e;\n}\n\n#dx-custom-ui-en .dx-cui-browser-dot:nth-child(2) {\n    background: var(--dx-yellow);\n}\n\n#dx-custom-ui-en .dx-cui-browser-dot:nth-child(3) {\n    background: var(--dx-green);\n}\n\n#dx-custom-ui-en .dx-cui-browser-address {\n    width: min(420px, 56%);\n    height: 13px;\n\n    border-radius: 999px;\n\n    background: rgba(112, 69, 223, 0.07);\n}\n\n#dx-custom-ui-en .dx-cui-stage-body {\n    display: grid;\n    grid-template-columns:\n        minmax(0, 1.42fr)\n        minmax(300px, 0.58fr);\n\n    min-height: 610px;\n}\n\n#dx-custom-ui-en .dx-cui-preview {\n    position: relative;\n\n    min-width: 0;\n\n    padding:\n        29px\n        28px;\n\n    overflow: hidden;\n\n    background:\n        linear-gradient(\n            145deg,\n            #fbfafe,\n            #f3eef9\n        );\n}\n\n#dx-custom-ui-en .dx-cui-screen {\n    display: none;\n\n    width: 100%;\n    height: 100%;\n\n    min-height: 550px;\n\n    overflow: hidden;\n\n    border: 1px solid rgba(112, 69, 223, 0.11);\n    border-radius: 20px;\n\n    background: #ffffff;\n\n    box-shadow:\n        0 22px 55px rgba(40, 18, 84, 0.10);\n}\n\n#dx-custom-ui-en .dx-cui-screen.is-active {\n    display: block;\n}\n\n#dx-custom-ui-en .dx-demo-head {\n    min-height: 68px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    gap: 18px;\n\n    padding:\n        0\n        24px;\n\n    border-bottom: 1px solid rgba(112, 69, 223, 0.08);\n}\n\n#dx-custom-ui-en .dx-demo-brand {\n    display: flex;\n    align-items: center;\n\n    gap: 9px;\n\n    color: var(--dx-dark);\n\n    font-size: 16px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-brand-mark {\n    width: 36px;\n    height: 36px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 11px;\n\n    color: #ffffff;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    font-size: 15px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-nav {\n    display: flex;\n    align-items: center;\n\n    gap: 18px;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 800;\n}\n\n#dx-custom-ui-en .dx-demo-actions {\n    display: flex;\n    align-items: center;\n\n    gap: 8px;\n}\n\n#dx-custom-ui-en .dx-demo-action {\n    width: 36px;\n    height: 36px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 10px;\n\n    color: var(--dx-purple);\n\n    background: rgba(112, 69, 223, 0.07);\n}\n\n#dx-custom-ui-en .dx-demo-action svg {\n    width: 18px;\n    height: 18px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-ui-en .dx-demo-home-hero {\n    min-height: 250px;\n\n    display: grid;\n    grid-template-columns:\n        minmax(0, 1.05fr)\n        minmax(260px, 0.95fr);\n\n    align-items: center;\n\n    gap: 24px;\n\n    padding: 34px;\n\n    background:\n        radial-gradient(\n            circle at 90% 25%,\n            rgba(255, 196, 65, 0.15),\n            transparent 32%\n        ),\n        linear-gradient(\n            135deg,\n            #17083a,\n            #0c0225\n        );\n}\n\n#dx-custom-ui-en .dx-demo-home-copy {\n    color: #ffffff;\n}\n\n#dx-custom-ui-en .dx-demo-kicker {\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-home-title {\n    margin:\n        7px\n        0\n        0;\n\n    font-size: 30px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-ui-en .dx-demo-home-text {\n    margin:\n        8px\n        0\n        0;\n\n    color: rgba(255,255,255,.66);\n\n    font-size: 14px;\n    line-height: 1.8;\n}\n\n#dx-custom-ui-en .dx-demo-home-button {\n    min-height: 40px;\n\n    margin-top: 16px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    padding:\n        0\n        16px;\n\n    border-radius: 10px;\n\n    color: #180b35;\n\n    background: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-product-art {\n    min-height: 180px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255,255,255,.12);\n    border-radius: 20px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255,255,255,.15),\n            rgba(255,255,255,.04)\n        );\n}\n\n#dx-custom-ui-en .dx-demo-product-shape {\n    width: 150px;\n    height: 150px;\n\n    border-radius: 36% 64% 57% 43% \/ 45% 41% 59% 55%;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple-light),\n            var(--dx-yellow)\n        );\n\n    box-shadow:\n        0 24px 55px rgba(0,0,0,.22);\n}\n\n#dx-custom-ui-en .dx-demo-products {\n    display: grid;\n    grid-template-columns:\n        repeat(3, minmax(0, 1fr));\n\n    gap: 12px;\n\n    padding: 20px;\n}\n\n#dx-custom-ui-en .dx-demo-product-item {\n    min-height: 150px;\n\n    padding: 13px;\n\n    border: 1px solid rgba(112, 69, 223, 0.09);\n    border-radius: 15px;\n\n    background: #ffffff;\n}\n\n#dx-custom-ui-en .dx-demo-product-thumb {\n    height: 82px;\n\n    border-radius: 11px;\n\n    background:\n        linear-gradient(\n            135deg,\n            rgba(112, 69, 223, 0.14),\n            rgba(255, 196, 65, 0.16)\n        );\n}\n\n#dx-custom-ui-en .dx-demo-product-name {\n    margin-top: 9px;\n\n    color: var(--dx-dark);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-product-price {\n    margin-top: 3px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-product-page {\n    display: grid;\n    grid-template-columns:\n        minmax(0, 0.95fr)\n        minmax(0, 1.05fr);\n\n    gap: 28px;\n\n    padding: 30px;\n}\n\n#dx-custom-ui-en .dx-demo-gallery {\n    min-height: 355px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 18px;\n\n    background:\n        linear-gradient(\n            145deg,\n            #f0ebf8,\n            #faf8fd\n        );\n}\n\n#dx-custom-ui-en .dx-demo-gallery-shape {\n    width: 220px;\n    height: 270px;\n\n    border-radius: 28px;\n\n    background:\n        linear-gradient(\n            145deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    box-shadow:\n        0 30px 60px rgba(112,69,223,.22);\n}\n\n#dx-custom-ui-en .dx-demo-product-info {\n    padding-top: 15px;\n}\n\n#dx-custom-ui-en .dx-demo-category {\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-product-heading {\n    margin:\n        7px\n        0\n        0;\n\n    color: var(--dx-dark);\n\n    font-size: 28px;\n    font-weight: 900;\n    line-height: 1.5;\n}\n\n#dx-custom-ui-en .dx-demo-product-description {\n    margin:\n        10px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    line-height: 1.9;\n}\n\n#dx-custom-ui-en .dx-demo-price {\n    margin-top: 17px;\n\n    color: var(--dx-purple);\n\n    font-size: 22px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-options {\n    margin-top: 18px;\n\n    display: flex;\n    flex-wrap: wrap;\n\n    gap: 8px;\n}\n\n#dx-custom-ui-en .dx-demo-option {\n    min-width: 42px;\n    min-height: 36px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(112,69,223,.14);\n    border-radius: 9px;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 800;\n}\n\n#dx-custom-ui-en .dx-demo-option.is-selected {\n    color: #ffffff;\n    background: var(--dx-purple);\n}\n\n#dx-custom-ui-en .dx-demo-add {\n    width: 100%;\n    min-height: 47px;\n\n    margin-top: 20px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 11px;\n\n    color: #ffffff;\n    background: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-cart {\n    padding: 28px;\n}\n\n#dx-custom-ui-en .dx-demo-section-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: 24px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-cart-layout {\n    margin-top: 20px;\n\n    display: grid;\n    grid-template-columns:\n        minmax(0, 1.4fr)\n        minmax(240px, 0.6fr);\n\n    gap: 20px;\n}\n\n#dx-custom-ui-en .dx-demo-cart-items {\n    display: grid;\n    gap: 10px;\n}\n\n#dx-custom-ui-en .dx-demo-cart-item {\n    display: grid;\n    grid-template-columns:\n        68px\n        minmax(0, 1fr)\n        auto;\n\n    align-items: center;\n\n    gap: 14px;\n\n    min-height: 88px;\n\n    padding:\n        10px\n        12px;\n\n    border: 1px solid rgba(112,69,223,.09);\n    border-radius: 13px;\n}\n\n#dx-custom-ui-en .dx-demo-cart-thumb {\n    width: 68px;\n    height: 68px;\n\n    border-radius: 11px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(112,69,223,.18),\n            rgba(255,196,65,.18)\n        );\n}\n\n#dx-custom-ui-en .dx-demo-cart-name {\n    color: var(--dx-dark);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-cart-meta {\n    margin-top: 4px;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n}\n\n#dx-custom-ui-en .dx-demo-cart-price {\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-summary {\n    padding: 19px;\n\n    border-radius: 15px;\n\n    background: #f7f3fb;\n}\n\n#dx-custom-ui-en .dx-demo-summary-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    gap: 15px;\n\n    padding:\n        9px\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 700;\n}\n\n#dx-custom-ui-en .dx-demo-summary-row.is-total {\n    margin-top: 5px;\n\n    border-top: 1px solid rgba(112,69,223,.11);\n\n    color: var(--dx-dark);\n\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-checkout {\n    width: 100%;\n    min-height: 45px;\n\n    margin-top: 14px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 10px;\n\n    color: #180b35;\n    background: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-account {\n    display: grid;\n    grid-template-columns:\n        210px\n        minmax(0, 1fr);\n\n    min-height: 480px;\n}\n\n#dx-custom-ui-en .dx-demo-account-side {\n    padding:\n        24px\n        18px;\n\n    color: rgba(255,255,255,.75);\n\n    background:\n        linear-gradient(\n            145deg,\n            #19093e,\n            #0c0225\n        );\n}\n\n#dx-custom-ui-en .dx-demo-avatar {\n    width: 55px;\n    height: 55px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    margin-bottom: 18px;\n\n    border-radius: 16px;\n\n    color: #180b35;\n    background: var(--dx-yellow);\n\n    font-size: 18px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-account-user {\n    color: #ffffff;\n\n    font-size: 15px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-menu {\n    margin-top: 25px;\n\n    display: grid;\n\n    gap: 7px;\n}\n\n#dx-custom-ui-en .dx-demo-menu-item {\n    min-height: 40px;\n\n    display: flex;\n    align-items: center;\n\n    padding:\n        0\n        12px;\n\n    border-radius: 9px;\n\n    font-size: 14px;\n    font-weight: 700;\n}\n\n#dx-custom-ui-en .dx-demo-menu-item.is-active {\n    color: #ffffff;\n\n    background: rgba(145,104,239,.19);\n}\n\n#dx-custom-ui-en .dx-demo-account-main {\n    padding: 28px;\n}\n\n#dx-custom-ui-en .dx-demo-account-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: 24px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-order-list {\n    margin-top: 20px;\n\n    display: grid;\n\n    gap: 10px;\n}\n\n#dx-custom-ui-en .dx-demo-order {\n    display: grid;\n    grid-template-columns:\n        1fr\n        auto\n        auto;\n\n    align-items: center;\n\n    gap: 15px;\n\n    min-height: 68px;\n\n    padding:\n        12px\n        14px;\n\n    border: 1px solid rgba(112,69,223,.09);\n    border-radius: 12px;\n}\n\n#dx-custom-ui-en .dx-demo-order-id {\n    color: var(--dx-dark);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-demo-order-status {\n    min-height: 28px;\n\n    display: inline-flex;\n    align-items: center;\n\n    padding:\n        0\n        9px;\n\n    border-radius: 999px;\n\n    color: #16845a;\n    background: rgba(83,207,146,.13);\n\n    font-size: 14px;\n    font-weight: 800;\n}\n\n#dx-custom-ui-en .dx-demo-order-total {\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-cui-info {\n    padding:\n        34px\n        30px;\n\n    border-left: 1px solid rgba(112, 69, 223, 0.10);\n\n    background:\n        radial-gradient(\n            circle at 100% 0%,\n            rgba(112,69,223,.08),\n            transparent 32%\n        ),\n        #ffffff;\n}\n\n#dx-custom-ui-en .dx-cui-info-label {\n    display: block;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n}\n\n#dx-custom-ui-en .dx-cui-info-title {\n    margin:\n        7px\n        0\n        0;\n\n    color: var(--dx-dark);\n\n    font-size: 27px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-ui-en .dx-cui-info-text {\n    margin:\n        11px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    line-height: 1.95;\n}\n\n#dx-custom-ui-en .dx-cui-info-list {\n    margin-top: 22px;\n    padding-top: 20px;\n\n    display: grid;\n\n    gap: 11px;\n\n    border-top: 1px solid rgba(112,69,223,.10);\n}\n\n#dx-custom-ui-en .dx-cui-info-item {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 9px;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.8;\n}\n\n#dx-custom-ui-en .dx-cui-check {\n    width: 24px;\n    height: 24px;\n    flex: 0 0 24px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 8px;\n\n    color: #16845a;\n\n    background: rgba(83,207,146,.13);\n}\n\n#dx-custom-ui-en .dx-cui-check svg {\n    width: 12px;\n    height: 12px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.3;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-ui-en .dx-cui-note {\n    margin-top: 24px;\n\n    padding:\n        17px\n        18px;\n\n    border-radius: 14px;\n\n    color: var(--dx-text);\n\n    background: rgba(112,69,223,.055);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.85;\n}\n\n@media (max-width: 1050px) {\n    #dx-custom-ui-en .dx-cui-stage-body {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-ui-en .dx-cui-info {\n        border-left: 0;\n\n        border-top: 1px solid rgba(112,69,223,.10);\n    }\n}\n\n@media (max-width: 980px) {\n    #dx-custom-ui-en .dx-cui-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n}\n\n@media (max-width: 720px) {\n    #dx-custom-ui-en .dx-cui-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-ui-en .dx-cui-header {\n        margin-bottom: 32px;\n    }\n\n    #dx-custom-ui-en .dx-cui-eyebrow::before,\n    #dx-custom-ui-en .dx-cui-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-ui-en .dx-cui-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n    }\n\n    #dx-custom-ui-en .dx-cui-description {\n        font-size: 14px;\n    }\n\n    #dx-custom-ui-en .dx-cui-tabs {\n        justify-content: flex-start;\n\n        overflow-x: auto;\n        flex-wrap: nowrap;\n\n        padding-bottom: 4px;\n    }\n\n    #dx-custom-ui-en .dx-cui-tab {\n        flex: 0 0 auto;\n    }\n\n    #dx-custom-ui-en .dx-cui-stage {\n        border-radius: 20px;\n    }\n\n    #dx-custom-ui-en .dx-cui-browser-bar {\n        min-height: 46px;\n\n        padding:\n            0\n            13px;\n    }\n\n    #dx-custom-ui-en .dx-cui-preview {\n        padding:\n            14px\n            12px;\n    }\n\n    #dx-custom-ui-en .dx-cui-screen {\n        min-height: 460px;\n\n        border-radius: 15px;\n    }\n\n    #dx-custom-ui-en .dx-demo-head {\n        min-height: 57px;\n\n        padding:\n            0\n            13px;\n    }\n\n    #dx-custom-ui-en .dx-demo-nav {\n        display: none;\n    }\n\n    #dx-custom-ui-en .dx-demo-home-hero {\n        grid-template-columns: 1fr;\n\n        padding:\n            24px\n            18px;\n    }\n\n    #dx-custom-ui-en .dx-demo-product-art {\n        display: none;\n    }\n\n    #dx-custom-ui-en .dx-demo-products {\n        grid-template-columns: 1fr 1fr;\n\n        padding: 13px;\n    }\n\n    #dx-custom-ui-en .dx-demo-product-page {\n        grid-template-columns: 1fr;\n\n        padding: 16px;\n    }\n\n    #dx-custom-ui-en .dx-demo-gallery {\n        min-height: 230px;\n    }\n\n    #dx-custom-ui-en .dx-demo-gallery-shape {\n        width: 150px;\n        height: 185px;\n    }\n\n    #dx-custom-ui-en .dx-demo-cart {\n        padding: 17px;\n    }\n\n    #dx-custom-ui-en .dx-demo-cart-layout {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-ui-en .dx-demo-account {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-ui-en .dx-demo-account-side {\n        display: none;\n    }\n\n    #dx-custom-ui-en .dx-demo-account-main {\n        padding: 18px;\n    }\n\n    #dx-custom-ui-en .dx-demo-order {\n        grid-template-columns: 1fr auto;\n    }\n\n    #dx-custom-ui-en .dx-demo-order-total {\n        grid-column: 1 \/ -1;\n    }\n\n    #dx-custom-ui-en .dx-cui-info {\n        padding:\n            25px\n            20px;\n    }\n\n    #dx-custom-ui-en .dx-cui-info-title {\n        font-size: 23px;\n    }\n}\n\n#dx-custom-ui-en button:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 3px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-ui-en *,\n    #dx-custom-ui-en *::before,\n    #dx-custom-ui-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-ui-en\"\n    aria-labelledby=\"dx-custom-ui-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div class=\"dx-cui-grid\" aria-hidden=\"true\"><\/div>\n\n    <div class=\"dx-cui-main\">\n        <div class=\"dx-cui-container\">\n\n            <header class=\"dx-cui-header\">\n\n                <span class=\"dx-cui-eyebrow\">\n                    The Customer Experience Is Part of the System\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-ui-title-en\"\n                    class=\"dx-cui-title\"\n                >\n                    A Storefront Designed Around\n                    <span>How Your Customers Buy<\/span>\n                <\/h2>\n\n                <p class=\"dx-cui-description\">\n                    With a custom platform, we do not begin with a\n                    pre-built theme. We define the customer journey\n                    and design every screen around your products,\n                    audience, and sales process from discovery to\n                    checkout and post-purchase activity.\n                <\/p>\n\n            <\/header>\n\n            <div\n                class=\"dx-cui-tabs\"\n                role=\"tablist\"\n                aria-label=\"Custom storefront examples\"\n            >\n                <button\n                    type=\"button\"\n                    class=\"dx-cui-tab is-active\"\n                    role=\"tab\"\n                    aria-selected=\"true\"\n                    data-view=\"home\"\n                >\n                    Homepage\n                <\/button>\n\n                <button\n                    type=\"button\"\n                    class=\"dx-cui-tab\"\n                    role=\"tab\"\n                    aria-selected=\"false\"\n                    data-view=\"product\"\n                >\n                    Product Page\n                <\/button>\n\n                <button\n                    type=\"button\"\n                    class=\"dx-cui-tab\"\n                    role=\"tab\"\n                    aria-selected=\"false\"\n                    data-view=\"cart\"\n                >\n                    Cart & Checkout\n                <\/button>\n\n                <button\n                    type=\"button\"\n                    class=\"dx-cui-tab\"\n                    role=\"tab\"\n                    aria-selected=\"false\"\n                    data-view=\"account\"\n                >\n                    Customer Account\n                <\/button>\n            <\/div>\n\n            <div class=\"dx-cui-stage\">\n\n                <div class=\"dx-cui-browser-bar\" aria-hidden=\"true\">\n\n                    <div class=\"dx-cui-browser-dots\">\n                        <span class=\"dx-cui-browser-dot\"><\/span>\n                        <span class=\"dx-cui-browser-dot\"><\/span>\n                        <span class=\"dx-cui-browser-dot\"><\/span>\n                    <\/div>\n\n                    <span class=\"dx-cui-browser-address\"><\/span>\n\n                <\/div>\n\n                <div class=\"dx-cui-stage-body\">\n\n                    <div class=\"dx-cui-preview\">\n\n                        <div\n                            class=\"dx-cui-screen is-active\"\n                            data-screen=\"home\"\n                        >\n\n                            <div class=\"dx-demo-head\">\n\n                                <div class=\"dx-demo-brand\">\n                                    <span class=\"dx-demo-brand-mark\">S<\/span>\n                                    Store\n                                <\/div>\n\n                                <div class=\"dx-demo-nav\">\n                                    <span>Home<\/span>\n                                    <span>Products<\/span>\n                                    <span>Collections<\/span>\n                                <\/div>\n\n                                <div class=\"dx-demo-actions\">\n                                    <span class=\"dx-demo-action\">\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <circle cx=\"11\" cy=\"11\" r=\"7\"><\/circle>\n                                            <path d=\"m20 20-4-4\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n                                    <span class=\"dx-demo-action\">\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M3 5h2l2 11h10l2-8H7\"><\/path>\n                                            <circle cx=\"9\" cy=\"20\" r=\"1\"><\/circle>\n                                            <circle cx=\"17\" cy=\"20\" r=\"1\"><\/circle>\n                                        <\/svg>\n                                    <\/span>\n                                <\/div>\n\n                            <\/div>\n\n                            <div class=\"dx-demo-home-hero\">\n\n                                <div class=\"dx-demo-home-copy\">\n\n                                    <span class=\"dx-demo-kicker\">\n                                        NEW COLLECTION\n                                    <\/span>\n\n                                    <h3 class=\"dx-demo-home-title\">\n                                        A Shopping Experience That Reflects the Product\n                                    <\/h3>\n\n                                    <p class=\"dx-demo-home-text\">\n                                        A storefront designed to make\n                                        product discovery, browsing,\n                                        and purchasing clearer.\n                                    <\/p>\n\n                                    <span class=\"dx-demo-home-button\">\n                                        Explore Collection\n                                    <\/span>\n\n                                <\/div>\n\n                                <div class=\"dx-demo-product-art\">\n                                    <div class=\"dx-demo-product-shape\"><\/div>\n                                <\/div>\n\n                            <\/div>\n\n                            <div class=\"dx-demo-products\">\n\n                                <div class=\"dx-demo-product-item\">\n                                    <div class=\"dx-demo-product-thumb\"><\/div>\n                                    <div class=\"dx-demo-product-name\">Product One<\/div>\n                                    <div class=\"dx-demo-product-price\">AED 220<\/div>\n                                <\/div>\n\n                                <div class=\"dx-demo-product-item\">\n                                    <div class=\"dx-demo-product-thumb\"><\/div>\n                                    <div class=\"dx-demo-product-name\">Product Two<\/div>\n                                    <div class=\"dx-demo-product-price\">AED 310<\/div>\n                                <\/div>\n\n                                <div class=\"dx-demo-product-item\">\n                                    <div class=\"dx-demo-product-thumb\"><\/div>\n                                    <div class=\"dx-demo-product-name\">Product Three<\/div>\n                                    <div class=\"dx-demo-product-price\">AED 180<\/div>\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                        <div\n                            class=\"dx-cui-screen\"\n                            data-screen=\"product\"\n                        >\n\n                            <div class=\"dx-demo-head\">\n\n                                <div class=\"dx-demo-brand\">\n                                    <span class=\"dx-demo-brand-mark\">S<\/span>\n                                    Store\n                                <\/div>\n\n                                <div class=\"dx-demo-actions\">\n                                    <span class=\"dx-demo-action\">\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <circle cx=\"11\" cy=\"11\" r=\"7\"><\/circle>\n                                            <path d=\"m20 20-4-4\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n                                <\/div>\n\n                            <\/div>\n\n                            <div class=\"dx-demo-product-page\">\n\n                                <div class=\"dx-demo-gallery\">\n                                    <div class=\"dx-demo-gallery-shape\"><\/div>\n                                <\/div>\n\n                                <div class=\"dx-demo-product-info\">\n\n                                    <span class=\"dx-demo-category\">\n                                        New Collection\n                                    <\/span>\n\n                                    <h3 class=\"dx-demo-product-heading\">\n                                        A Product Experience Built Around the Details\n                                    <\/h3>\n\n                                    <p class=\"dx-demo-product-description\">\n                                        Product imagery, specifications,\n                                        variants, options, and supporting\n                                        content can be structured around how\n                                        customers evaluate the product.\n                                    <\/p>\n\n                                    <div class=\"dx-demo-price\">\n                                        AED 420\n                                    <\/div>\n\n                                    <div class=\"dx-demo-options\">\n                                        <span class=\"dx-demo-option\">S<\/span>\n                                        <span class=\"dx-demo-option is-selected\">M<\/span>\n                                        <span class=\"dx-demo-option\">L<\/span>\n                                        <span class=\"dx-demo-option\">XL<\/span>\n                                    <\/div>\n\n                                    <div class=\"dx-demo-add\">\n                                        Add to Cart\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                        <div\n                            class=\"dx-cui-screen\"\n                            data-screen=\"cart\"\n                        >\n\n                            <div class=\"dx-demo-head\">\n                                <div class=\"dx-demo-brand\">\n                                    <span class=\"dx-demo-brand-mark\">S<\/span>\n                                    Store\n                                <\/div>\n                            <\/div>\n\n                            <div class=\"dx-demo-cart\">\n\n                                <h3 class=\"dx-demo-section-title\">\n                                    Shopping Cart\n                                <\/h3>\n\n                                <div class=\"dx-demo-cart-layout\">\n\n                                    <div class=\"dx-demo-cart-items\">\n\n                                        <div class=\"dx-demo-cart-item\">\n\n                                            <div class=\"dx-demo-cart-thumb\"><\/div>\n\n                                            <div>\n                                                <div class=\"dx-demo-cart-name\">\n                                                    Product One\n                                                <\/div>\n\n                                                <div class=\"dx-demo-cart-meta\">\n                                                    Qty: 1 \u00b7 Size: M\n                                                <\/div>\n                                            <\/div>\n\n                                            <div class=\"dx-demo-cart-price\">\n                                                AED 220\n                                            <\/div>\n\n                                        <\/div>\n\n                                        <div class=\"dx-demo-cart-item\">\n\n                                            <div class=\"dx-demo-cart-thumb\"><\/div>\n\n                                            <div>\n                                                <div class=\"dx-demo-cart-name\">\n                                                    Product Two\n                                                <\/div>\n\n                                                <div class=\"dx-demo-cart-meta\">\n                                                    Qty: 2\n                                                <\/div>\n                                            <\/div>\n\n                                            <div class=\"dx-demo-cart-price\">\n                                                AED 360\n                                            <\/div>\n\n                                        <\/div>\n\n                                    <\/div>\n\n                                    <div class=\"dx-demo-summary\">\n\n                                        <div class=\"dx-demo-summary-row\">\n                                            <span>Products<\/span>\n                                            <span>AED 580<\/span>\n                                        <\/div>\n\n                                        <div class=\"dx-demo-summary-row\">\n                                            <span>Shipping<\/span>\n                                            <span>Calculated Later<\/span>\n                                        <\/div>\n\n                                        <div class=\"dx-demo-summary-row is-total\">\n                                            <span>Total<\/span>\n                                            <span>AED 580<\/span>\n                                        <\/div>\n\n                                        <div class=\"dx-demo-checkout\">\n                                            Continue to Checkout\n                                        <\/div>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                        <div\n                            class=\"dx-cui-screen\"\n                            data-screen=\"account\"\n                        >\n\n                            <div class=\"dx-demo-account\">\n\n                                <aside class=\"dx-demo-account-side\">\n\n                                    <div class=\"dx-demo-avatar\">\n                                        M\n                                    <\/div>\n\n                                    <div class=\"dx-demo-account-user\">\n                                        Customer Account\n                                    <\/div>\n\n                                    <div class=\"dx-demo-menu\">\n                                        <div class=\"dx-demo-menu-item is-active\">\n                                            Orders\n                                        <\/div>\n                                        <div class=\"dx-demo-menu-item\">\n                                            Addresses\n                                        <\/div>\n                                        <div class=\"dx-demo-menu-item\">\n                                            Payment Methods\n                                        <\/div>\n                                        <div class=\"dx-demo-menu-item\">\n                                            Account Settings\n                                        <\/div>\n                                    <\/div>\n\n                                <\/aside>\n\n                                <div class=\"dx-demo-account-main\">\n\n                                    <h3 class=\"dx-demo-account-title\">\n                                        My Orders\n                                    <\/h3>\n\n                                    <div class=\"dx-demo-order-list\">\n\n                                        <div class=\"dx-demo-order\">\n                                            <span class=\"dx-demo-order-id\">\n                                                #ORD-1028\n                                            <\/span>\n\n                                            <span class=\"dx-demo-order-status\">\n                                                Processing\n                                            <\/span>\n\n                                            <span class=\"dx-demo-order-total\">\n                                                AED 420\n                                            <\/span>\n                                        <\/div>\n\n                                        <div class=\"dx-demo-order\">\n                                            <span class=\"dx-demo-order-id\">\n                                                #ORD-0996\n                                            <\/span>\n\n                                            <span class=\"dx-demo-order-status\">\n                                                Delivered\n                                            <\/span>\n\n                                            <span class=\"dx-demo-order-total\">\n                                                AED 680\n                                            <\/span>\n                                        <\/div>\n\n                                        <div class=\"dx-demo-order\">\n                                            <span class=\"dx-demo-order-id\">\n                                                #ORD-0944\n                                            <\/span>\n\n                                            <span class=\"dx-demo-order-status\">\n                                                Delivered\n                                            <\/span>\n\n                                            <span class=\"dx-demo-order-total\">\n                                                AED 315\n                                            <\/span>\n                                        <\/div>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/div>\n\n                    <aside class=\"dx-cui-info\">\n\n                        <span\n                            class=\"dx-cui-info-label\"\n                            id=\"dx-cui-label-en\"\n                        >\n                            Homepage\n                        <\/span>\n\n                        <h3\n                            class=\"dx-cui-info-title\"\n                            id=\"dx-cui-info-title-en\"\n                        >\n                            A Storefront That Reflects the Brand and Guides Customers to Products\n                        <\/h3>\n\n                        <p\n                            class=\"dx-cui-info-text\"\n                            id=\"dx-cui-info-text-en\"\n                        >\n                            The homepage can be structured around the\n                            products, collections, and offers you want\n                            customers to discover instead of following\n                            a fixed theme layout.\n                        <\/p>\n\n                        <div\n                            class=\"dx-cui-info-list\"\n                            id=\"dx-cui-info-list-en\"\n                        >\n                            <div class=\"dx-cui-info-item\">\n                                <span class=\"dx-cui-check\">\n                                    <svg viewBox=\"0 0 24 24\">\n                                        <path d=\"m5 12 4 4L19 6\"><\/path>\n                                    <\/svg>\n                                <\/span>\n                                Content organized around the customer journey.\n                            <\/div>\n\n                            <div class=\"dx-cui-info-item\">\n                                <span class=\"dx-cui-check\">\n                                    <svg viewBox=\"0 0 24 24\">\n                                        <path d=\"m5 12 4 4L19 6\"><\/path>\n                                    <\/svg>\n                                <\/span>\n                                Highlight important products and offers.\n                            <\/div>\n\n                            <div class=\"dx-cui-info-item\">\n                                <span class=\"dx-cui-check\">\n                                    <svg viewBox=\"0 0 24 24\">\n                                        <path d=\"m5 12 4 4L19 6\"><\/path>\n                                    <\/svg>\n                                <\/span>\n                                Responsive experience across devices.\n                            <\/div>\n                        <\/div>\n\n                        <div class=\"dx-cui-note\">\n                            This is a visual concept only. The final\n                            storefront is designed around your brand,\n                            products, business model, and target audience.\n                        <\/div>\n\n                    <\/aside>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomUiEn() {\n        const section = document.getElementById(\n            \"dx-custom-ui-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-ui-en-fullwidth\"\n            );\n        }\n\n        const tabs = Array.from(\n            section.querySelectorAll(\".dx-cui-tab\")\n        );\n\n        const screens = Array.from(\n            section.querySelectorAll(\".dx-cui-screen\")\n        );\n\n        const label = section.querySelector(\n            \"#dx-cui-label-en\"\n        );\n\n        const title = section.querySelector(\n            \"#dx-cui-info-title-en\"\n        );\n\n        const text = section.querySelector(\n            \"#dx-cui-info-text-en\"\n        );\n\n        const list = section.querySelector(\n            \"#dx-cui-info-list-en\"\n        );\n\n        const content = {\n            home: {\n                label: \"Homepage\",\n                title: \"A Storefront That Reflects the Brand and Guides Customers to Products\",\n                text: \"The homepage can be structured around the products, collections, and offers you want customers to discover instead of following a fixed theme layout.\",\n                items: [\n                    \"Content organized around the customer journey.\",\n                    \"Highlight important products and offers.\",\n                    \"Responsive experience across devices.\"\n                ]\n            },\n            product: {\n                label: \"Product Page\",\n                title: \"Present Information in the Way Customers Need to Make a Decision\",\n                text: \"The product page can be structured around imagery, specifications, variants, options, and supporting content relevant to how customers evaluate the product.\",\n                items: [\n                    \"Flexible image and content presentation.\",\n                    \"Custom options and product variations.\",\n                    \"Additional information based on the product type.\"\n                ]\n            },\n            cart: {\n                label: \"Cart & Checkout\",\n                title: \"A Purchasing Flow Built Around Your Actual Sales Process\",\n                text: \"The cart, checkout, shipping rules, discounts, and order steps can be customized around the way your business sells and processes orders.\",\n                items: [\n                    \"Custom checkout experience.\",\n                    \"Project-specific payment and shipping rules.\",\n                    \"Additional validation or purchasing steps when needed.\"\n                ]\n            },\n            account: {\n                label: \"Customer Account\",\n                title: \"A Personal Area That Helps Customers Manage Their Relationship With the Store\",\n                text: \"Customer accounts can include orders, addresses, payment methods, subscriptions, and other information or services required by your business model.\",\n                items: [\n                    \"Track orders and statuses.\",\n                    \"Manage customer information and addresses.\",\n                    \"Add loyalty or subscription functionality when required.\"\n                ]\n            }\n        };\n\n        function renderInfo(key) {\n            const data = content[key];\n\n            if (!data) {\n                return;\n            }\n\n            label.textContent = data.label;\n            title.textContent = data.title;\n            text.textContent = data.text;\n\n            list.innerHTML = \"\";\n\n            data.items.forEach(function (itemText) {\n                const item = document.createElement(\"div\");\n\n                item.className = \"dx-cui-info-item\";\n\n                item.innerHTML =\n                    '<span class=\"dx-cui-check\" aria-hidden=\"true\">' +\n                    '<svg viewBox=\"0 0 24 24\">' +\n                    '<path d=\"m5 12 4 4L19 6\"><\/path>' +\n                    \"<\/svg>\" +\n                    \"<\/span>\" +\n                    \"<span><\/span>\";\n\n                item.querySelector(\"span:last-child\").textContent =\n                    itemText;\n\n                list.appendChild(item);\n            });\n        }\n\n        tabs.forEach(function (tab) {\n            tab.addEventListener(\"click\", function () {\n                const key = tab.dataset.view;\n\n                tabs.forEach(function (current) {\n                    current.classList.remove(\"is-active\");\n\n                    current.setAttribute(\n                        \"aria-selected\",\n                        \"false\"\n                    );\n                });\n\n                screens.forEach(function (screen) {\n                    screen.classList.toggle(\n                        \"is-active\",\n                        screen.dataset.screen === key\n                    );\n                });\n\n                tab.classList.add(\"is-active\");\n\n                tab.setAttribute(\n                    \"aria-selected\",\n                    \"true\"\n                );\n\n                renderInfo(key);\n            });\n        });\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomUiEn\n        );\n    } else {\n        initDxCustomUiEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0bedbce e-flex e-con-boxed e-con e-parent\" data-id=\"0bedbce\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9ea08bd elementor-widget elementor-widget-html\" data-id=\"9ea08bd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-process-en),\n.elementor-widget-html:has(#dx-custom-process-en) > .elementor-widget-container,\n.dx-custom-process-en-fullwidth,\n.dx-custom-process-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-process-en,\n#dx-custom-process-en *,\n#dx-custom-process-en *::before,\n#dx-custom-process-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-process-en {\n    --dx-bg: #f7f4fb;\n    --dx-white: #ffffff;\n    --dx-dark: #180b35;\n    --dx-text: #6d6478;\n    --dx-muted: #958d9f;\n    --dx-purple: #7045df;\n    --dx-purple-light: #966af0;\n    --dx-yellow: #ffc441;\n    --dx-green: #53cf92;\n    --dx-blue: #65aef7;\n    --dx-border: rgba(112, 69, 223, 0.12);\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-dark);\n\n    background:\n        radial-gradient(\n            circle at 7% 11%,\n            rgba(112, 69, 223, 0.08),\n            transparent 25%\n        ),\n        radial-gradient(\n            circle at 94% 88%,\n            rgba(255, 196, 65, 0.08),\n            transparent 28%\n        ),\n        var(--dx-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-process-en a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-process-en .dx-cp-grid {\n    position: absolute;\n    z-index: -5;\n\n    inset: 0;\n\n    opacity: 0.14;\n\n    background-image:\n        linear-gradient(\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 82%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 82%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-process-en .dx-cp-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-process-en .dx-cp-container {\n    width: min(1420px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-process-en .dx-cp-header {\n    max-width: 900px;\n\n    margin:\n        0\n        auto\n        54px;\n\n    text-align: center;\n}\n\n#dx-custom-process-en .dx-cp-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-process-en .dx-cp-eyebrow::before,\n#dx-custom-process-en .dx-cp-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-process-en .dx-cp-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-process-en .dx-cp-title span {\n    color: var(--dx-purple);\n}\n\n#dx-custom-process-en .dx-cp-description {\n    max-width: 780px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n\n    text-wrap: pretty;\n}\n\n#dx-custom-process-en .dx-cp-board {\n    position: relative;\n    isolation: isolate;\n\n    overflow: hidden;\n\n    padding:\n        42px\n        34px\n        38px;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 30px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255,255,255,.99),\n            rgba(249,247,253,.97)\n        );\n\n    box-shadow:\n        0 28px 72px rgba(40,18,84,.10);\n}\n\n#dx-custom-process-en .dx-cp-board::before {\n    content: \"\";\n\n    position: absolute;\n\n    top: 0;\n    right: 0;\n    left: 0;\n\n    height: 4px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-purple),\n            var(--dx-purple-light),\n            var(--dx-yellow),\n            var(--dx-green)\n        );\n}\n\n#dx-custom-process-en .dx-cp-track {\n    position: relative;\n\n    display: grid;\n    grid-template-columns:\n        repeat(5, minmax(0, 1fr));\n\n    gap: 22px;\n}\n\n#dx-custom-process-en .dx-cp-track::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: 0;\n\n    top: 41px;\n    right: 7%;\n    left: 7%;\n\n    height: 2px;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(112,69,223,.18),\n            var(--dx-purple),\n            var(--dx-purple-light),\n            var(--dx-yellow),\n            rgba(83,207,146,.42)\n        );\n}\n\n#dx-custom-process-en .dx-cp-step {\n    position: relative;\n    z-index: 2;\n\n    min-width: 0;\n\n    text-align: center;\n}\n\n#dx-custom-process-en .dx-cp-marker-wrap {\n    position: relative;\n\n    display: inline-flex;\n\n    margin-bottom: 19px;\n}\n\n#dx-custom-process-en .dx-cp-marker {\n    width: 84px;\n    height: 84px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 8px solid #ffffff;\n    border-radius: 50%;\n\n    color: #ffffff;\n\n    background: var(--dx-purple);\n\n    box-shadow:\n        0 14px 32px rgba(112,69,223,.20);\n\n    transition:\n        transform .3s ease,\n        box-shadow .3s ease;\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(2)\n    .dx-cp-marker {\n    color: #180b35;\n    background: var(--dx-yellow);\n    box-shadow:\n        0 14px 32px rgba(255,196,65,.22);\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(3)\n    .dx-cp-marker {\n    background: var(--dx-blue);\n    box-shadow:\n        0 14px 32px rgba(101,174,247,.22);\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(4)\n    .dx-cp-marker {\n    background: var(--dx-purple-light);\n    box-shadow:\n        0 14px 32px rgba(150,106,240,.22);\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(5)\n    .dx-cp-marker {\n    background: var(--dx-green);\n    box-shadow:\n        0 14px 32px rgba(83,207,146,.22);\n}\n\n#dx-custom-process-en .dx-cp-step:hover\n    .dx-cp-marker {\n    transform:\n        translateY(-6px)\n        scale(1.04);\n}\n\n#dx-custom-process-en .dx-cp-marker svg {\n    width: 31px;\n    height: 31px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.8;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-process-en .dx-cp-number {\n    position: absolute;\n\n    top: -8px;\n    right: -8px;\n\n    min-width: 30px;\n    height: 30px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    padding:\n        0\n        5px;\n\n    border: 3px solid #ffffff;\n    border-radius: 999px;\n\n    color: var(--dx-purple);\n\n    background: #ffffff;\n\n    box-shadow:\n        0 8px 20px rgba(40,18,84,.11);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1;\n}\n\n#dx-custom-process-en .dx-cp-step-label {\n    display: block;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(2)\n    .dx-cp-step-label {\n    color: #936500;\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(3)\n    .dx-cp-step-label {\n    color: #2172bd;\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(4)\n    .dx-cp-step-label {\n    color: var(--dx-purple-light);\n}\n\n#dx-custom-process-en .dx-cp-step:nth-child(5)\n    .dx-cp-step-label {\n    color: #16845a;\n}\n\n#dx-custom-process-en .dx-cp-step-title {\n    margin:\n        6px\n        0\n        0;\n\n    color: var(--dx-dark);\n\n    font-size: 18px;\n    font-weight: 900;\n    line-height: 1.6;\n\n    text-wrap: balance;\n}\n\n#dx-custom-process-en .dx-cp-step-text {\n    margin:\n        8px\n        0\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 1.9;\n}\n\n#dx-custom-process-en .dx-cp-details {\n    margin-top: 36px;\n\n    display: grid;\n    grid-template-columns:\n        minmax(0, 1.25fr)\n        minmax(310px, 0.75fr);\n\n    gap: 22px;\n}\n\n#dx-custom-process-en .dx-cp-checklist {\n    display: grid;\n    grid-template-columns:\n        repeat(2, minmax(0, 1fr));\n\n    gap: 12px;\n}\n\n#dx-custom-process-en .dx-cp-check {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 11px;\n\n    min-height: 104px;\n\n    padding:\n        16px\n        17px;\n\n    border: 1px solid rgba(112,69,223,.10);\n    border-radius: 15px;\n\n    background: rgba(112,69,223,.035);\n}\n\n#dx-custom-process-en .dx-cp-check-icon {\n    width: 39px;\n    height: 39px;\n    flex: 0 0 39px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 12px;\n\n    color: #16845a;\n\n    background: rgba(83,207,146,.13);\n}\n\n#dx-custom-process-en .dx-cp-check:nth-child(2)\n    .dx-cp-check-icon {\n    color: #2172bd;\n    background: rgba(101,174,247,.13);\n}\n\n#dx-custom-process-en .dx-cp-check:nth-child(3)\n    .dx-cp-check-icon {\n    color: #936500;\n    background: rgba(255,196,65,.15);\n}\n\n#dx-custom-process-en .dx-cp-check:nth-child(4)\n    .dx-cp-check-icon {\n    color: var(--dx-purple);\n    background: rgba(112,69,223,.10);\n}\n\n#dx-custom-process-en .dx-cp-check-icon svg {\n    width: 19px;\n    height: 19px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.9;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-process-en .dx-cp-check-title {\n    display: block;\n\n    color: var(--dx-dark);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-process-en .dx-cp-check-text {\n    display: block;\n\n    margin-top: 3px;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.75;\n}\n\n#dx-custom-process-en .dx-cp-result {\n    position: relative;\n    isolation: isolate;\n\n    overflow: hidden;\n\n    padding:\n        25px\n        23px;\n\n    border: 1px solid rgba(255,255,255,.11);\n    border-radius: 20px;\n\n    color: #ffffff;\n\n    background:\n        radial-gradient(\n            circle at 10% 10%,\n            rgba(150,106,240,.24),\n            transparent 34%\n        ),\n        linear-gradient(\n            145deg,\n            #1b0a3d,\n            #0c0225\n        );\n\n    box-shadow:\n        0 22px 55px rgba(40,18,84,.18);\n}\n\n#dx-custom-process-en .dx-cp-result::before {\n    content: \"\";\n\n    position: absolute;\n    z-index: -2;\n\n    left: -100px;\n    bottom: -120px;\n\n    width: 260px;\n    height: 260px;\n\n    border-radius: 50%;\n\n    background: rgba(255,196,65,.08);\n\n    filter: blur(80px);\n}\n\n#dx-custom-process-en .dx-cp-result-label {\n    display: block;\n\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-process-en .dx-cp-result-title {\n    margin:\n        7px\n        0\n        0;\n\n    color: #ffffff;\n\n    font-size: 22px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-process-en .dx-cp-result-text {\n    margin:\n        10px\n        0\n        0;\n\n    color: rgba(255,255,255,.68);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 1.9;\n}\n\n#dx-custom-process-en .dx-cp-result-list {\n    margin-top: 18px;\n    padding-top: 16px;\n\n    display: grid;\n\n    gap: 9px;\n\n    border-top: 1px solid rgba(255,255,255,.10);\n}\n\n#dx-custom-process-en .dx-cp-result-item {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 8px;\n\n    color: rgba(255,255,255,.72);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.75;\n}\n\n#dx-custom-process-en .dx-cp-result-dot {\n    width: 7px;\n    height: 7px;\n    flex: 0 0 7px;\n\n    margin-top: 8px;\n\n    border-radius: 50%;\n\n    background: var(--dx-green);\n}\n\n#dx-custom-process-en .dx-cp-bottom {\n    margin-top: 24px;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    gap: 24px;\n\n    padding:\n        22px\n        25px;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 18px;\n\n    background: rgba(255,255,255,.78);\n}\n\n#dx-custom-process-en .dx-cp-bottom-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: 16px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-process-en .dx-cp-bottom-text {\n    margin:\n        4px\n        0\n        0;\n\n    color: var(--dx-muted);\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.8;\n}\n\n#dx-custom-process-en .dx-cp-button {\n    min-width: 220px;\n    min-height: 51px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 9px;\n\n    padding:\n        0\n        22px;\n\n    border-radius: 12px;\n\n    color: #ffffff;\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    box-shadow:\n        0 16px 34px rgba(112,69,223,.21);\n\n    font-size: 14px;\n    font-weight: 900;\n    white-space: nowrap;\n\n    transition:\n        transform .25s ease,\n        box-shadow .25s ease;\n}\n\n#dx-custom-process-en .dx-cp-button:hover,\n#dx-custom-process-en .dx-cp-button:focus-visible {\n    transform: translateY(-3px);\n\n    box-shadow:\n        0 22px 44px rgba(112,69,223,.30);\n}\n\n#dx-custom-process-en .dx-cp-button svg {\n    width: 17px;\n    height: 17px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n@media (max-width: 1120px) {\n    #dx-custom-process-en .dx-cp-track {\n        grid-template-columns:\n            repeat(3, minmax(0, 1fr));\n    }\n\n    #dx-custom-process-en .dx-cp-track::before {\n        display: none;\n    }\n}\n\n@media (max-width: 980px) {\n    #dx-custom-process-en .dx-cp-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n\n    #dx-custom-process-en .dx-cp-details {\n        grid-template-columns: 1fr;\n    }\n}\n\n@media (max-width: 720px) {\n    #dx-custom-process-en .dx-cp-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-process-en .dx-cp-header {\n        margin-bottom: 34px;\n    }\n\n    #dx-custom-process-en .dx-cp-eyebrow::before,\n    #dx-custom-process-en .dx-cp-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-process-en .dx-cp-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n    }\n\n    #dx-custom-process-en .dx-cp-description {\n        font-size: 14px;\n    }\n\n    #dx-custom-process-en .dx-cp-board {\n        padding:\n            25px\n            17px\n            20px;\n\n        border-radius: 20px;\n    }\n\n    #dx-custom-process-en .dx-cp-track {\n        grid-template-columns: 1fr;\n\n        gap: 0;\n    }\n\n    #dx-custom-process-en .dx-cp-step {\n        display: grid;\n        grid-template-columns:\n            74px\n            minmax(0, 1fr);\n\n        column-gap: 15px;\n\n        min-height: 145px;\n\n        text-align: left;\n    }\n\n    #dx-custom-process-en .dx-cp-step:not(:last-child)::after {\n        content: \"\";\n\n        position: absolute;\n\n        top: 80px;\n        left: 36px;\n\n        width: 2px;\n        height: 63px;\n\n        background:\n            linear-gradient(\n                180deg,\n                rgba(112,69,223,.25),\n                rgba(112,69,223,.07)\n            );\n    }\n\n    #dx-custom-process-en .dx-cp-marker-wrap {\n        grid-row: 1 \/ span 3;\n\n        margin-bottom: 0;\n    }\n\n    #dx-custom-process-en .dx-cp-marker {\n        width: 72px;\n        height: 72px;\n\n        border-width: 7px;\n    }\n\n    #dx-custom-process-en .dx-cp-marker svg {\n        width: 27px;\n        height: 27px;\n    }\n\n    #dx-custom-process-en .dx-cp-number {\n        top: -5px;\n        right: -5px;\n\n        min-width: 28px;\n        height: 28px;\n    }\n\n    #dx-custom-process-en .dx-cp-step-label {\n        align-self: end;\n    }\n\n    #dx-custom-process-en .dx-cp-step-title {\n        margin-top: 3px;\n\n        font-size: 17px;\n    }\n\n    #dx-custom-process-en .dx-cp-step-text {\n        margin-top: 5px;\n    }\n\n    #dx-custom-process-en .dx-cp-details {\n        margin-top: 25px;\n    }\n\n    #dx-custom-process-en .dx-cp-checklist {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-process-en .dx-cp-bottom {\n        flex-direction: column;\n\n        align-items: stretch;\n\n        text-align: center;\n\n        padding:\n            19px\n            16px;\n    }\n\n    #dx-custom-process-en .dx-cp-button {\n        width: 100%;\n        min-width: 0;\n    }\n}\n\n#dx-custom-process-en a:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-process-en *,\n    #dx-custom-process-en *::before,\n    #dx-custom-process-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-process-en\"\n    aria-labelledby=\"dx-custom-process-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div class=\"dx-cp-grid\" aria-hidden=\"true\"><\/div>\n\n    <div class=\"dx-cp-main\">\n\n        <div class=\"dx-cp-container\">\n\n            <header class=\"dx-cp-header\">\n\n                <span class=\"dx-cp-eyebrow\">\n                    Custom Development Process\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-process-title-en\"\n                    class=\"dx-cp-title\"\n                >\n                    From Understanding the Business Model to\n                    <span>Launching the Platform<\/span>\n                <\/h2>\n\n                <p class=\"dx-cp-description\">\n                    Because a custom platform is not built around a\n                    pre-configured theme, we begin by understanding\n                    your operations and requirements, then define the\n                    architecture, design the experience, develop the\n                    system and integrations, and review everything\n                    before launch.\n                <\/p>\n\n            <\/header>\n\n            <div class=\"dx-cp-board\">\n\n                <div class=\"dx-cp-track\">\n\n                    <article class=\"dx-cp-step\">\n\n                        <div class=\"dx-cp-marker-wrap\">\n\n                            <span class=\"dx-cp-marker\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <circle cx=\"11\" cy=\"11\" r=\"7\"><\/circle>\n                                    <path d=\"m20 20-4-4\"><\/path>\n                                    <path d=\"M8 11h6\"><\/path>\n                                    <path d=\"M11 8v6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-cp-number\">\n                                01\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-cp-step-label\">\n                            Discovery\n                        <\/span>\n\n                        <h3 class=\"dx-cp-step-title\">\n                            Business & Project Analysis\n                        <\/h3>\n\n                        <p class=\"dx-cp-step-text\">\n                            We review your products, customers, sales\n                            model, internal processes, user roles, and\n                            required integrations before defining the\n                            technical solution.\n                        <\/p>\n\n                    <\/article>\n\n                    <article class=\"dx-cp-step\">\n\n                        <div class=\"dx-cp-marker-wrap\">\n\n                            <span class=\"dx-cp-marker\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M4 4h16v16H4Z\"><\/path>\n                                    <path d=\"M4 9h16\"><\/path>\n                                    <path d=\"M9 9v11\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-cp-number\">\n                                02\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-cp-step-label\">\n                            Architecture\n                        <\/span>\n\n                        <h3 class=\"dx-cp-step-title\">\n                            Architecture & Workflow Planning\n                        <\/h3>\n\n                        <p class=\"dx-cp-step-text\">\n                            We define the modules, data structure,\n                            ordering flows, permissions, integrations,\n                            and communication points between the\n                            platform and external systems.\n                        <\/p>\n\n                    <\/article>\n\n                    <article class=\"dx-cp-step\">\n\n                        <div class=\"dx-cp-marker-wrap\">\n\n                            <span class=\"dx-cp-marker\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M3 3h18v14H3Z\"><\/path>\n                                    <path d=\"M8 21h8\"><\/path>\n                                    <path d=\"M12 17v4\"><\/path>\n                                    <path d=\"m8 8 2 2 4-4\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-cp-number\">\n                                03\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-cp-step-label\">\n                            UX & UI\n                        <\/span>\n\n                        <h3 class=\"dx-cp-step-title\">\n                            Customer & Admin Experience Design\n                        <\/h3>\n\n                        <p class=\"dx-cp-step-text\">\n                            We design the purchasing journey and\n                            customer-facing interfaces, along with\n                            the administration screens required by\n                            your operational team.\n                        <\/p>\n\n                    <\/article>\n\n                    <article class=\"dx-cp-step\">\n\n                        <div class=\"dx-cp-marker-wrap\">\n\n                            <span class=\"dx-cp-marker\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M8 3 4 7l4 4\"><\/path>\n                                    <path d=\"m16 3 4 4-4 4\"><\/path>\n                                    <path d=\"m14 2-4 10\"><\/path>\n                                    <path d=\"M5 17h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-cp-number\">\n                                04\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-cp-step-label\">\n                            Development\n                        <\/span>\n\n                        <h3 class=\"dx-cp-step-title\">\n                            Development & Integrations\n                        <\/h3>\n\n                        <p class=\"dx-cp-step-text\">\n                            We develop the storefront, back-end,\n                            administration panel, and agreed integrations\n                            with payment, shipping, and external systems.\n                        <\/p>\n\n                    <\/article>\n\n                    <article class=\"dx-cp-step\">\n\n                        <div class=\"dx-cp-marker-wrap\">\n\n                            <span class=\"dx-cp-marker\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 3 4 6v6c0 5 3.4 8 8 9 4.6-1 8-4 8-9V6Z\"><\/path>\n                                    <path d=\"m8 12 3 3 5-6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span class=\"dx-cp-number\">\n                                05\n                            <\/span>\n\n                        <\/div>\n\n                        <span class=\"dx-cp-step-label\">\n                            QA & Launch\n                        <\/span>\n\n                        <h3 class=\"dx-cp-step-title\">\n                            Testing, Review & Launch\n                        <\/h3>\n\n                        <p class=\"dx-cp-step-text\">\n                            We review functionality, integrations,\n                            usability, permissions, and responsiveness\n                            across devices, then prepare the platform\n                            for deployment and operation.\n                        <\/p>\n\n                    <\/article>\n\n                <\/div>\n\n                <div class=\"dx-cp-details\">\n\n                    <div class=\"dx-cp-checklist\">\n\n                        <div class=\"dx-cp-check\">\n\n                            <span class=\"dx-cp-check-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <strong class=\"dx-cp-check-title\">\n                                    Functional & Workflow Review\n                                <\/strong>\n\n                                <span class=\"dx-cp-check-text\">\n                                    Test the core workflows and operational\n                                    scenarios the platform depends on.\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cp-check\">\n\n                            <span class=\"dx-cp-check-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <rect\n                                        x=\"4\"\n                                        y=\"3\"\n                                        width=\"16\"\n                                        height=\"18\"\n                                        rx=\"2\"\n                                    ><\/rect>\n                                    <path d=\"M9 17h6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <strong class=\"dx-cp-check-title\">\n                                    Cross-Device Testing\n                                <\/strong>\n\n                                <span class=\"dx-cp-check-text\">\n                                    Review the customer experience across\n                                    mobile, tablet, and desktop devices.\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cp-check\">\n\n                            <span class=\"dx-cp-check-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M8 3v4\"><\/path>\n                                    <path d=\"M16 3v4\"><\/path>\n                                    <path d=\"M7 7h10v4a5 5 0 0 1-10 0Z\"><\/path>\n                                    <path d=\"M12 16v5\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <strong class=\"dx-cp-check-title\">\n                                    Integration Testing\n                                <\/strong>\n\n                                <span class=\"dx-cp-check-text\">\n                                    Review data flow between the platform,\n                                    payment gateways, shipping providers,\n                                    and connected systems.\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cp-check\">\n\n                            <span class=\"dx-cp-check-icon\">\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 3 4 6v6c0 5 3.4 8 8 9 4.6-1 8-4 8-9V6Z\"><\/path>\n                                    <path d=\"M9 12h6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                <strong class=\"dx-cp-check-title\">\n                                    Security & Permissions Review\n                                <\/strong>\n\n                                <span class=\"dx-cp-check-text\">\n                                    Review user roles, access paths,\n                                    and core security configuration\n                                    before launch.\n                                <\/span>\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n                    <aside class=\"dx-cp-result\">\n\n                        <span class=\"dx-cp-result-label\">\n                            Final Outcome\n                        <\/span>\n\n                        <h3 class=\"dx-cp-result-title\">\n                            An E-Commerce Platform Built Around the Way Your Business Operates\n                        <\/h3>\n\n                        <p class=\"dx-cp-result-text\">\n                            The final platform brings together the\n                            customer experience, administration,\n                            agreed functionality, and integrations\n                            within one architecture designed around\n                            your business requirements.\n                        <\/p>\n\n                        <div class=\"dx-cp-result-list\">\n\n                            <div class=\"dx-cp-result-item\">\n                                <span class=\"dx-cp-result-dot\"><\/span>\n                                Customer interface designed around the purchasing journey.\n                            <\/div>\n\n                            <div class=\"dx-cp-result-item\">\n                                <span class=\"dx-cp-result-dot\"><\/span>\n                                Administration panel aligned with operational requirements.\n                            <\/div>\n\n                            <div class=\"dx-cp-result-item\">\n                                <span class=\"dx-cp-result-dot\"><\/span>\n                                Integrations and workflows connected to the business model.\n                            <\/div>\n\n                        <\/div>\n\n                    <\/aside>\n\n                <\/div>\n\n            <\/div>\n\n            <div class=\"dx-cp-bottom\">\n\n                <div>\n\n                    <h3 class=\"dx-cp-bottom-title\">\n                        Development Stages and Timeline Depend on the Platform Scope\n                    <\/h3>\n\n                    <p class=\"dx-cp-bottom-text\">\n                        The implementation plan is defined after reviewing\n                        the required functionality, integrations, and\n                        priority of each part of the platform.\n                    <\/p>\n\n                <\/div>\n\n                <a\n                    href=\"https:\/\/dindex.net\/en\/contact\/\"\n                    class=\"dx-cp-button\"\n                >\n                    <span>Start Discussing Your Project<\/span>\n\n                    <svg\n                        viewBox=\"0 0 24 24\"\n                        aria-hidden=\"true\"\n                    >\n                        <path d=\"M5 12h14\"><\/path>\n                        <path d=\"m13 6 6 6-6 6\"><\/path>\n                    <\/svg>\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomProcessEn() {\n        const section = document.getElementById(\n            \"dx-custom-process-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-process-en-fullwidth\"\n            );\n        }\n\n        if (\n            !(\"IntersectionObserver\" in window) ||\n            window.matchMedia(\n                \"(prefers-reduced-motion: reduce)\"\n            ).matches\n        ) {\n            return;\n        }\n\n        const steps = section.querySelectorAll(\n            \".dx-cp-step\"\n        );\n\n        const checks = section.querySelectorAll(\n            \".dx-cp-check\"\n        );\n\n        const result = section.querySelector(\n            \".dx-cp-result\"\n        );\n\n        steps.forEach(function (step, index) {\n            step.style.opacity = \"0\";\n            step.style.transform = \"translateY(22px)\";\n            step.style.transition =\n                \"opacity .58s ease \" +\n                (index * .07) +\n                \"s, transform .58s ease \" +\n                (index * .07) +\n                \"s\";\n        });\n\n        checks.forEach(function (check, index) {\n            check.style.opacity = \"0\";\n            check.style.transform = \"translateY(18px)\";\n            check.style.transition =\n                \"opacity .55s ease \" +\n                (.2 + index * .06) +\n                \"s, transform .55s ease \" +\n                (.2 + index * .06) +\n                \"s\";\n        });\n\n        if (result) {\n            result.style.opacity = \"0\";\n            result.style.transform = \"translateX(25px)\";\n            result.style.transition =\n                \"opacity .65s ease .28s, transform .65s ease .28s\";\n        }\n\n        const observer = new IntersectionObserver(\n            function (entries, currentObserver) {\n                entries.forEach(function (entry) {\n                    if (!entry.isIntersecting) {\n                        return;\n                    }\n\n                    steps.forEach(function (step) {\n                        step.style.opacity = \"1\";\n                        step.style.transform = \"translateY(0)\";\n                    });\n\n                    checks.forEach(function (check) {\n                        check.style.opacity = \"1\";\n                        check.style.transform = \"translateY(0)\";\n                    });\n\n                    if (result) {\n                        result.style.opacity = \"1\";\n                        result.style.transform = \"translateX(0)\";\n                    }\n\n                    currentObserver.unobserve(entry.target);\n                });\n            },\n            {\n                threshold: .1\n            }\n        );\n\n        observer.observe(section);\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomProcessEn\n        );\n    } else {\n        initDxCustomProcessEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-460c29c e-con-full e-flex e-con e-parent\" data-id=\"460c29c\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-10b0ad4 elementor-widget elementor-widget-html\" data-id=\"10b0ad4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- =========================================================\n     HOME TESTIMONIALS SECTION\n     Author: Mohamed El-Sehemy\n     Video + Text Testimonials\n     English LTR - Elementor Compatible\n========================================================== -->\n\n<style>\n\/* =========================================================\n   ELEMENTOR FULL WIDTH\n========================================================= *\/\n\n.elementor-widget-html:has(#dx-home-testimonials),\n.elementor-widget-html:has(#dx-home-testimonials) > .elementor-widget-container,\n.dx-testimonials-widget-fullwidth,\n.dx-testimonials-widget-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n\/* =========================================================\n   RESET\n========================================================= *\/\n\n#dx-home-testimonials,\n#dx-home-testimonials *,\n#dx-home-testimonials *::before,\n#dx-home-testimonials *::after {\n    box-sizing: border-box;\n}\n\n#dx-home-testimonials {\n    --dx-purple: #6942d8;\n    --dx-purple-light: #9168ef;\n    --dx-yellow: #ffc441;\n    --dx-dark: #160a31;\n    --dx-text: #625c6f;\n    --dx-muted: #85808e;\n    --dx-white: #ffffff;\n    --dx-bg: #f8f7fc;\n    --dx-border: rgba(105, 66, 216, 0.13);\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n\n    direction: ltr;\n\n    color: var(--dx-dark);\n\n    background:\n        radial-gradient(\n            circle at 8% 10%,\n            rgba(105, 66, 216, 0.075),\n            transparent 25%\n        ),\n        radial-gradient(\n            circle at 92% 92%,\n            rgba(145, 104, 239, 0.065),\n            transparent 28%\n        ),\n        var(--dx-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-home-testimonials button {\n    font: inherit;\n}\n\n\/* =========================================================\n   DECORATIONS\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-orbit {\n    position: absolute;\n    z-index: -3;\n\n    border: 1px solid rgba(105, 66, 216, 0.10);\n    border-radius: 50%;\n\n    pointer-events: none;\n}\n\n#dx-home-testimonials .dx-test-orbit-one {\n    top: -210px;\n    left: -180px;\n\n    width: 430px;\n    height: 430px;\n}\n\n#dx-home-testimonials .dx-test-orbit-two {\n    right: -190px;\n    bottom: -250px;\n\n    width: 480px;\n    height: 480px;\n}\n\n#dx-home-testimonials .dx-test-dots {\n    position: absolute;\n    z-index: -2;\n\n    width: 120px;\n    height: 120px;\n\n    opacity: 0.23;\n\n    background-image:\n        radial-gradient(\n            circle,\n            var(--dx-purple-light) 2px,\n            transparent 2.7px\n        );\n\n    background-size: 17px 17px;\n\n    pointer-events: none;\n}\n\n#dx-home-testimonials .dx-test-dots-one {\n    top: 70px;\n    right: 4%;\n}\n\n#dx-home-testimonials .dx-test-dots-two {\n    left: 3%;\n    bottom: 50px;\n}\n\n\/* =========================================================\n   SECTION LAYOUT\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        90px\n        clamp(22px, 5vw, 90px)\n        88px;\n}\n\n#dx-home-testimonials .dx-test-container {\n    width: min(1450px, 100%);\n    margin: 0 auto;\n}\n\n\/* =========================================================\n   MAIN HEADER\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-header {\n    max-width: 800px;\n\n    margin: 0 auto 48px;\n\n    text-align: center;\n}\n\n#dx-home-testimonials .dx-test-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 11px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1.6;\n}\n\n#dx-home-testimonials .dx-test-eyebrow::before,\n#dx-home-testimonials .dx-test-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-home-testimonials .dx-test-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: clamp(35px, 3.7vw, 56px);\n    font-weight: 900;\n    line-height: 1.25;\n    letter-spacing: -1px;\n}\n\n#dx-home-testimonials .dx-test-description {\n    max-width: 700px;\n\n    margin: 15px auto 0;\n\n    color: var(--dx-text);\n\n    font-size: 16px;\n    font-weight: 400;\n    line-height: 1.8;\n}\n\n\/* =========================================================\n   VIDEO TESTIMONIALS\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-video-grid {\n    width: min(1200px, 100%);\n\n    margin: 0 auto 62px;\n\n    display: grid;\n\n    grid-template-columns:\n        repeat(2, minmax(0, 1fr));\n\n    gap: 25px;\n}\n\n#dx-home-testimonials .dx-test-video-card {\n    position: relative;\n    isolation: isolate;\n\n    width: 100%;\n    aspect-ratio: 16 \/ 9;\n\n    padding: 0;\n\n    overflow: hidden;\n\n    border: 1px solid rgba(105, 66, 216, 0.12);\n    border-radius: 22px;\n\n    background: #13082f;\n\n    box-shadow:\n        0 24px 55px rgba(31, 13, 70, 0.18);\n\n    cursor: pointer;\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease,\n        border-color 0.35s ease;\n}\n\n#dx-home-testimonials .dx-test-video-card:hover,\n#dx-home-testimonials .dx-test-video-card:focus-visible {\n    border-color: rgba(105, 66, 216, 0.40);\n\n    box-shadow:\n        0 32px 70px rgba(31, 13, 70, 0.25);\n\n    transform: translateY(-7px);\n}\n\n#dx-home-testimonials .dx-test-video-image {\n    display: block;\n\n    width: 100%;\n    height: 100%;\n\n    object-fit: cover;\n    object-position: center;\n\n    transition:\n        transform 0.55s ease,\n        filter 0.55s ease;\n}\n\n#dx-home-testimonials .dx-test-video-card:hover .dx-test-video-image {\n    transform: scale(1.045);\n\n    filter: brightness(0.82);\n}\n\n#dx-home-testimonials .dx-test-video-overlay {\n    position: absolute;\n    z-index: 2;\n\n    inset: 0;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background:\n        linear-gradient(\n            180deg,\n            rgba(13, 4, 37, 0.08),\n            rgba(13, 4, 37, 0.35)\n        );\n}\n\n#dx-home-testimonials .dx-test-play {\n    position: relative;\n\n    width: 82px;\n    height: 82px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255, 255, 255, 0.55);\n    border-radius: 50%;\n\n    color: var(--dx-white);\n\n    background:\n        linear-gradient(\n            135deg,\n            rgba(105, 66, 216, 0.96),\n            rgba(145, 104, 239, 0.96)\n        );\n\n    box-shadow:\n        0 18px 42px rgba(58, 26, 132, 0.40);\n\n    transition:\n        transform 0.3s ease,\n        box-shadow 0.3s ease;\n}\n\n#dx-home-testimonials .dx-test-play::before {\n    content: \"\";\n\n    position: absolute;\n\n    inset: -12px;\n\n    border: 1px solid rgba(255, 255, 255, 0.27);\n    border-radius: 50%;\n\n    animation:\n        dxTestPulse\n        2.2s\n        ease-out\n        infinite;\n}\n\n#dx-home-testimonials .dx-test-video-card:hover .dx-test-play {\n    transform: scale(1.08);\n\n    box-shadow:\n        0 23px 50px rgba(58, 26, 132, 0.52);\n}\n\n#dx-home-testimonials .dx-test-play svg {\n    width: 31px;\n    height: 31px;\n\n    fill: currentColor;\n\n    transform: translateX(2px);\n}\n\n@keyframes dxTestPulse {\n\n    0% {\n        opacity: 0.75;\n\n        transform: scale(0.88);\n    }\n\n    100% {\n        opacity: 0;\n\n        transform: scale(1.35);\n    }\n}\n\n#dx-home-testimonials .dx-test-video-badge {\n    position: absolute;\n    z-index: 3;\n\n    left: 18px;\n    bottom: 17px;\n\n    display: inline-flex;\n    align-items: center;\n\n    gap: 7px;\n\n    padding:\n        8px\n        12px;\n\n    border:\n        1px solid rgba(255, 255, 255, 0.16);\n\n    border-radius:\n        999px;\n\n    color:\n        var(--dx-white);\n\n    background:\n        rgba(13, 4, 37, 0.70);\n\n    -webkit-backdrop-filter:\n        blur(12px);\n\n    backdrop-filter:\n        blur(12px);\n\n    font-size:\n        12px;\n\n    font-weight:\n        700;\n\n    line-height:\n        1.4;\n}\n\n#dx-home-testimonials .dx-test-video-badge svg {\n    width: 15px;\n    height: 15px;\n\n    fill: currentColor;\n}\n\n\/* =========================================================\n   TEXT TESTIMONIALS HEADER\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-text-section {\n    position: relative;\n\n    width: 100%;\n}\n\n#dx-home-testimonials .dx-test-subheader {\n    max-width: 720px;\n\n    margin: 0 auto 30px;\n\n    text-align: center;\n}\n\n#dx-home-testimonials .dx-test-subtitle {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size:\n        clamp(\n            25px,\n            2.4vw,\n            36px\n        );\n\n    font-weight: 900;\n    line-height: 1.3;\n}\n\n#dx-home-testimonials .dx-test-subdescription {\n    margin: 9px auto 0;\n\n    color: var(--dx-muted);\n\n    font-size: 15px;\n    font-weight: 400;\n    line-height: 1.75;\n}\n\n\/* =========================================================\n   SLIDER\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-slider {\n    position: relative;\n\n    width: 100%;\n\n    padding:\n        0\n        58px;\n}\n\n#dx-home-testimonials .dx-test-viewport {\n    width: 100%;\n\n    overflow: hidden;\n}\n\n#dx-home-testimonials .dx-test-track {\n    display: flex;\n\n    direction: ltr;\n\n    transition:\n        transform\n        1.05s\n        cubic-bezier(\n            0.22,\n            0.61,\n            0.36,\n            1\n        );\n\n    will-change: transform;\n}\n\n#dx-home-testimonials .dx-test-slide {\n    flex:\n        0\n        0\n        50%;\n\n    min-width: 0;\n\n    padding: 12px;\n}\n\n\/* =========================================================\n   REVIEW CARD\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-card {\n    position: relative;\n\n    height: 100%;\n    min-height: 320px;\n\n    padding:\n        31px\n        30px\n        28px;\n\n    display: flex;\n    flex-direction: column;\n\n    overflow: hidden;\n\n    border:\n        1px solid var(--dx-border);\n\n    border-radius:\n        21px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255, 255, 255, 0.98),\n            rgba(252, 250, 255, 0.96)\n        );\n\n    box-shadow:\n        0 20px 48px rgba(42, 20, 88, 0.09);\n\n    transition:\n        transform 0.3s ease,\n        box-shadow 0.3s ease,\n        border-color 0.3s ease;\n}\n\n#dx-home-testimonials .dx-test-card:hover {\n    border-color:\n        rgba(105, 66, 216, 0.28);\n\n    box-shadow:\n        0 27px 58px rgba(42, 20, 88, 0.14);\n\n    transform:\n        translateY(-5px);\n}\n\n#dx-home-testimonials .dx-test-quote-icon {\n    position: absolute;\n\n    top: 22px;\n    right: 24px;\n\n    width: 54px;\n    height: 54px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 17px;\n\n    color: var(--dx-purple);\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(105, 66, 216, 0.12),\n            rgba(145, 104, 239, 0.055)\n        );\n}\n\n#dx-home-testimonials .dx-test-quote-icon svg {\n    width: 27px;\n    height: 27px;\n\n    fill: currentColor;\n}\n\n#dx-home-testimonials .dx-test-stars {\n    display: flex;\n    align-items: center;\n\n    gap: 3px;\n\n    margin-bottom: 22px;\n\n    color: var(--dx-yellow);\n\n    font-size: 17px;\n    line-height: 1;\n}\n\n#dx-home-testimonials .dx-test-review {\n    flex-grow: 1;\n\n    margin: 0;\n\n    padding-right: 82px;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 400;\n    line-height: 1.9;\n}\n\n#dx-home-testimonials .dx-test-person {\n    margin-top: 27px;\n\n    padding-top: 21px;\n\n    display: flex;\n    align-items: center;\n\n    gap: 13px;\n\n    border-top:\n        1px solid rgba(105, 66, 216, 0.10);\n}\n\n#dx-home-testimonials .dx-test-avatar {\n    width: 54px;\n    height: 54px;\n    flex: 0 0 54px;\n\n    overflow: hidden;\n\n    border:\n        3px solid rgba(105, 66, 216, 0.11);\n\n    border-radius: 50%;\n\n    background: #eeeaf7;\n}\n\n#dx-home-testimonials .dx-test-avatar img {\n    display: block;\n\n    width: 100%;\n    height: 100%;\n\n    object-fit: cover;\n    object-position: center;\n}\n\n#dx-home-testimonials .dx-test-person-info {\n    min-width: 0;\n\n    display: flex;\n    flex-direction: column;\n\n    text-align: left;\n}\n\n#dx-home-testimonials .dx-test-person-name {\n    color: var(--dx-dark);\n\n    font-size: 15px;\n    font-weight: 800;\n    line-height: 1.5;\n}\n\n#dx-home-testimonials .dx-test-person-company {\n    margin-top: 3px;\n\n    color: var(--dx-muted);\n\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 1.5;\n}\n\n\/* =========================================================\n   SLIDER ARROWS\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-arrow {\n    position: absolute;\n    z-index: 10;\n\n    top: 50%;\n\n    width: 46px;\n    height: 46px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    padding: 0;\n\n    border:\n        1px solid rgba(105, 66, 216, 0.14);\n\n    border-radius: 50%;\n\n    color: var(--dx-purple);\n\n    background:\n        var(--dx-white);\n\n    box-shadow:\n        0 14px 30px rgba(41, 19, 87, 0.14);\n\n    cursor: pointer;\n\n    transform:\n        translateY(-50%);\n\n    transition:\n        color 0.25s ease,\n        background 0.25s ease,\n        box-shadow 0.25s ease;\n}\n\n#dx-home-testimonials .dx-test-arrow:hover,\n#dx-home-testimonials .dx-test-arrow:focus-visible {\n    color: var(--dx-white);\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n\n    box-shadow:\n        0 18px 38px rgba(105, 66, 216, 0.28);\n}\n\n#dx-home-testimonials .dx-test-arrow-prev {\n    left: 0;\n}\n\n#dx-home-testimonials .dx-test-arrow-next {\n    right: 0;\n}\n\n#dx-home-testimonials .dx-test-arrow svg {\n    width: 20px;\n    height: 20px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n\/* =========================================================\n   PAGINATION\n========================================================= *\/\n\n#dx-home-testimonials .dx-test-pagination {\n    margin-top: 24px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 8px;\n}\n\n#dx-home-testimonials .dx-test-dot {\n    width: 8px;\n    height: 8px;\n\n    padding: 0;\n\n    border: 0;\n    border-radius: 999px;\n\n    background:\n        rgba(105, 66, 216, 0.20);\n\n    cursor: pointer;\n\n    transition:\n        width 0.25s ease,\n        background 0.25s ease;\n}\n\n#dx-home-testimonials .dx-test-dot.is-active {\n    width: 28px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-purple),\n            var(--dx-purple-light)\n        );\n}\n\n\/* =========================================================\n   VIDEO MODAL\n========================================================= *\/\n\n.dx-test-modal {\n    position: fixed;\n    z-index: 999999;\n\n    inset: 0;\n\n    display: none;\n    align-items: center;\n    justify-content: center;\n\n    padding:\n        70px\n        28px\n        28px;\n\n    background:\n        rgba(5, 0, 20, 0.92);\n\n    -webkit-backdrop-filter:\n        blur(10px);\n\n    backdrop-filter:\n        blur(10px);\n}\n\n.dx-test-modal.is-open {\n    display: flex;\n\n    animation:\n        dxTestModalFade\n        0.25s\n        ease\n        both;\n}\n\n@keyframes dxTestModalFade {\n\n    from {\n        opacity: 0;\n    }\n\n    to {\n        opacity: 1;\n    }\n}\n\n.dx-test-modal-dialog {\n    position: relative;\n\n    width:\n        min(\n            1200px,\n            100%\n        );\n\n    aspect-ratio:\n        16 \/ 9;\n\n    overflow: hidden;\n\n    border:\n        1px solid rgba(255, 255, 255, 0.15);\n\n    border-radius:\n        20px;\n\n    background:\n        #000000;\n\n    box-shadow:\n        0 35px 100px rgba(0, 0, 0, 0.60);\n\n    animation:\n        dxTestModalScale\n        0.3s\n        ease\n        both;\n}\n\n@keyframes dxTestModalScale {\n\n    from {\n        opacity: 0;\n\n        transform:\n            scale(0.94)\n            translateY(10px);\n    }\n\n    to {\n        opacity: 1;\n\n        transform:\n            scale(1)\n            translateY(0);\n    }\n}\n\n.dx-test-modal-video {\n    width: 100%;\n    height: 100%;\n}\n\n.dx-test-modal-video iframe {\n    display: block;\n\n    width: 100%;\n    height: 100%;\n\n    border: 0;\n}\n\n\/* =========================================================\n   VIDEO MODAL CLOSE BUTTON\n========================================================= *\/\n\n.dx-test-modal-close {\n    position:\n        fixed !important;\n\n    z-index:\n        2147483647 !important;\n\n    top:\n        22px !important;\n\n    right:\n        24px !important;\n\n    width:\n        48px !important;\n\n    height:\n        48px !important;\n\n    display:\n        flex !important;\n\n    align-items:\n        center !important;\n\n    justify-content:\n        center !important;\n\n    margin:\n        0 !important;\n\n    padding:\n        0 !important;\n\n    border:\n        1px solid rgba(255, 255, 255, 0.35) !important;\n\n    border-radius:\n        14px !important;\n\n    background:\n        linear-gradient(\n            135deg,\n            #6942d8,\n            #9168ef\n        ) !important;\n\n    box-shadow:\n        0 12px 30px rgba(0, 0, 0, 0.38) !important;\n\n    cursor:\n        pointer !important;\n\n    appearance:\n        none !important;\n\n    -webkit-appearance:\n        none !important;\n\n    opacity:\n        1 !important;\n\n    visibility:\n        visible !important;\n\n    transition:\n        transform 0.25s ease,\n        background 0.25s ease,\n        box-shadow 0.25s ease !important;\n}\n\n.dx-test-modal-close::before,\n.dx-test-modal-close::after {\n    content:\n        \"\" !important;\n\n    position:\n        absolute !important;\n\n    top:\n        50% !important;\n\n    left:\n        50% !important;\n\n    width:\n        23px !important;\n\n    height:\n        3px !important;\n\n    display:\n        block !important;\n\n    border-radius:\n        999px !important;\n\n    background:\n        #ffffff !important;\n\n    transform-origin:\n        center !important;\n\n    opacity:\n        1 !important;\n\n    visibility:\n        visible !important;\n\n    pointer-events:\n        none !important;\n}\n\n.dx-test-modal-close::before {\n    transform:\n        translate(-50%, -50%)\n        rotate(45deg) !important;\n}\n\n.dx-test-modal-close::after {\n    transform:\n        translate(-50%, -50%)\n        rotate(-45deg) !important;\n}\n\n.dx-test-modal-close:hover,\n.dx-test-modal-close:focus-visible {\n    background:\n        linear-gradient(\n            135deg,\n            #9168ef,\n            #6942d8\n        ) !important;\n\n    box-shadow:\n        0 16px 38px rgba(105, 66, 216, 0.48) !important;\n\n    transform:\n        scale(1.08) !important;\n}\n\n.dx-test-modal-close:focus-visible {\n    outline:\n        3px solid #ffc441 !important;\n\n    outline-offset:\n        4px !important;\n}\n\n\/* =========================================================\n   RESPONSIVE\n========================================================= *\/\n\n@media (max-width: 900px) {\n\n    #dx-home-testimonials .dx-test-main {\n        padding:\n            76px\n            28px\n            74px;\n    }\n\n    #dx-home-testimonials .dx-test-video-grid {\n        gap: 18px;\n\n        margin-bottom:\n            52px;\n    }\n\n    #dx-home-testimonials .dx-test-slide {\n        flex-basis: 100%;\n    }\n\n    #dx-home-testimonials .dx-test-card {\n        min-height:\n            300px;\n    }\n}\n\n@media (max-width: 700px) {\n\n    #dx-home-testimonials .dx-test-video-grid {\n        grid-template-columns:\n            1fr;\n    }\n\n    #dx-home-testimonials .dx-test-slider {\n        padding:\n            0\n            37px;\n    }\n\n    #dx-home-testimonials .dx-test-arrow {\n        width:\n            40px;\n\n        height:\n            40px;\n    }\n\n    #dx-home-testimonials .dx-test-arrow-prev {\n        left:\n            -5px;\n    }\n\n    #dx-home-testimonials .dx-test-arrow-next {\n        right:\n            -5px;\n    }\n}\n\n@media (max-width: 600px) {\n\n    #dx-home-testimonials .dx-test-main {\n        padding:\n            64px\n            20px\n            62px;\n    }\n\n    #dx-home-testimonials .dx-test-header {\n        margin-bottom:\n            35px;\n    }\n\n    #dx-home-testimonials .dx-test-title {\n        font-size:\n            clamp(\n                29px,\n                9vw,\n                40px\n            );\n\n        line-height:\n            1.3;\n    }\n\n    #dx-home-testimonials .dx-test-description {\n        font-size:\n            15px;\n\n        line-height:\n            1.75;\n    }\n\n    #dx-home-testimonials .dx-test-video-grid {\n        margin-bottom:\n            47px;\n    }\n\n    #dx-home-testimonials .dx-test-video-card {\n        border-radius:\n            17px;\n    }\n\n    #dx-home-testimonials .dx-test-play {\n        width:\n            66px;\n\n        height:\n            66px;\n    }\n\n    #dx-home-testimonials .dx-test-play svg {\n        width:\n            26px;\n\n        height:\n            26px;\n    }\n\n    #dx-home-testimonials .dx-test-subtitle {\n        font-size:\n            27px;\n\n        line-height:\n            1.35;\n    }\n\n    #dx-home-testimonials .dx-test-subdescription {\n        font-size:\n            14px;\n\n        line-height:\n            1.7;\n    }\n\n    #dx-home-testimonials .dx-test-slider {\n        padding:\n            0;\n    }\n\n    #dx-home-testimonials .dx-test-slide {\n        padding:\n            6px;\n    }\n\n    #dx-home-testimonials .dx-test-card {\n        min-height:\n            0;\n\n        padding:\n            26px\n            22px\n            23px;\n\n        border-radius:\n            17px;\n    }\n\n    #dx-home-testimonials .dx-test-quote-icon {\n        top:\n            18px;\n\n        right:\n            18px;\n\n        width:\n            46px;\n\n        height:\n            46px;\n\n        border-radius:\n            14px;\n    }\n\n    #dx-home-testimonials .dx-test-review {\n        padding-right:\n            58px;\n\n        font-size:\n            14px;\n\n        line-height:\n            1.8;\n    }\n\n    #dx-home-testimonials .dx-test-arrow {\n        top:\n            auto;\n\n        bottom:\n            -58px;\n\n        width:\n            42px;\n\n        height:\n            42px;\n    }\n\n    #dx-home-testimonials .dx-test-arrow-prev {\n        left:\n            calc(50% - 50px);\n    }\n\n    #dx-home-testimonials .dx-test-arrow-next {\n        right:\n            calc(50% - 50px);\n    }\n\n    #dx-home-testimonials .dx-test-pagination {\n        margin-top:\n            73px;\n    }\n\n    .dx-test-modal {\n        padding:\n            65px\n            12px\n            20px;\n    }\n\n    .dx-test-modal-dialog {\n        border-radius:\n            13px;\n    }\n\n    .dx-test-modal-close {\n        top:\n            14px !important;\n\n        right:\n            14px !important;\n\n        width:\n            44px !important;\n\n        height:\n            44px !important;\n\n        border-radius:\n            12px !important;\n    }\n\n    .dx-test-modal-close::before,\n    .dx-test-modal-close::after {\n        width:\n            21px !important;\n\n        height:\n            3px !important;\n    }\n}\n\n\/* =========================================================\n   ACCESSIBILITY\n========================================================= *\/\n\n#dx-home-testimonials button:focus-visible {\n    outline:\n        2px solid var(--dx-yellow);\n\n    outline-offset:\n        4px;\n}\n\nbody.dx-test-modal-open {\n    overflow:\n        hidden !important;\n}\n\n@media (prefers-reduced-motion: reduce) {\n\n    #dx-home-testimonials *,\n    #dx-home-testimonials *::before,\n    #dx-home-testimonials *::after,\n    .dx-test-modal *,\n    .dx-test-modal *::before,\n    .dx-test-modal *::after {\n        animation-duration:\n            0.01ms !important;\n\n        animation-iteration-count:\n            1 !important;\n\n        transition-duration:\n            0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-home-testimonials\"\n    aria-labelledby=\"dx-testimonials-title\"\n    dir=\"ltr\"\n>\n\n    <span\n        class=\"dx-test-orbit dx-test-orbit-one\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-test-orbit dx-test-orbit-two\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-test-dots dx-test-dots-one\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <span\n        class=\"dx-test-dots dx-test-dots-two\"\n        aria-hidden=\"true\"\n    ><\/span>\n\n    <div class=\"dx-test-main\">\n\n        <div class=\"dx-test-container\">\n\n            <!-- =================================================\n                 HEADER\n            ================================================== -->\n\n            <header class=\"dx-test-header\">\n\n                <span class=\"dx-test-eyebrow\">\n                    Client Testimonials\n                <\/span>\n\n                <h2\n                    id=\"dx-testimonials-title\"\n                    class=\"dx-test-title\"\n                >\n                    What Our Clients Say\n                <\/h2>\n\n                <p class=\"dx-test-description\">\n                    Real experiences from clients who trusted us\n                    to build, improve, and support their digital projects.\n                <\/p>\n\n            <\/header>\n\n            <!-- =================================================\n                 VIDEO TESTIMONIALS\n            ================================================== -->\n\n            <div class=\"dx-test-video-grid\">\n\n                <button\n                    type=\"button\"\n                    class=\"dx-test-video-card\"\n                    data-video-id=\"dtCRXdp2qag\"\n                    aria-label=\"Play the first client video testimonial\"\n                >\n                    <img loading=\"lazy\"\n                        src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/06\/84ef21a8-e751-498c-be44-d2fdf0882d6d.webp\"\n                        class=\"dx-test-video-image\"\n                        alt=\"Client video testimonial\"\n                        width=\"1600\"\n                        height=\"900\"\n                        loading=\"lazy\"\n                        decoding=\"async\"\n                    >\n\n                    <span class=\"dx-test-video-overlay\">\n\n                        <span\n                            class=\"dx-test-play\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M8 5v14l11-7z\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                    <\/span>\n\n                    <span class=\"dx-test-video-badge\">\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M8 5v14l11-7z\"><\/path>\n                        <\/svg>\n\n                        <span>\n                            Watch Client Story\n                        <\/span>\n\n                    <\/span>\n                <\/button>\n\n                <button\n                    type=\"button\"\n                    class=\"dx-test-video-card\"\n                    data-video-id=\"tB7nBjjZoy8\"\n                    aria-label=\"Play the second client video testimonial\"\n                >\n                    <img loading=\"lazy\"\n                        src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/06\/e0eafccc-e822-4b9b-ace4-726086252662.webp\"\n                        class=\"dx-test-video-image\"\n                        alt=\"Client video testimonial\"\n                        width=\"1600\"\n                        height=\"900\"\n                        loading=\"lazy\"\n                        decoding=\"async\"\n                    >\n\n                    <span class=\"dx-test-video-overlay\">\n\n                        <span\n                            class=\"dx-test-play\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"M8 5v14l11-7z\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                    <\/span>\n\n                    <span class=\"dx-test-video-badge\">\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M8 5v14l11-7z\"><\/path>\n                        <\/svg>\n\n                        <span>\n                            Watch Client Story\n                        <\/span>\n\n                    <\/span>\n                <\/button>\n\n            <\/div>\n\n            <!-- =================================================\n                 TEXT TESTIMONIALS\n            ================================================== -->\n\n            <div class=\"dx-test-text-section\">\n\n                <header class=\"dx-test-subheader\">\n\n                    <h3 class=\"dx-test-subtitle\">\n                        Client Experiences\n                    <\/h3>\n\n                    <p class=\"dx-test-subdescription\">\n                        Feedback that reflects the quality of our work,\n                        communication, support, and overall client experience.\n                    <\/p>\n\n                <\/header>\n\n                <div\n                    class=\"dx-test-slider\"\n                    aria-roledescription=\"carousel\"\n                    aria-label=\"Client testimonials\"\n                >\n\n                    <!-- PREVIOUS -->\n\n                    <button\n                        type=\"button\"\n                        class=\"dx-test-arrow dx-test-arrow-prev\"\n                        aria-label=\"Previous testimonials\"\n                    >\n                        <svg viewBox=\"0 0 24 24\">\n                            <path d=\"m15 18-6-6 6-6\"><\/path>\n                        <\/svg>\n                    <\/button>\n\n                    <div class=\"dx-test-viewport\">\n\n                        <div class=\"dx-test-track\">\n\n                            <!-- =====================================\n                                 TESTIMONIAL 1\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        I would like to thank the team for the\n                                        overall experience. It was very positive.\n                                        They listened carefully to my needs,\n                                        understood the idea clearly from the\n                                        beginning, and made a real effort to\n                                        bring it to life. Every question was\n                                        handled professionally and responses\n                                        were always quick, which was very\n                                        important to me.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5856-scaled.jpg\"\n                                                alt=\"Waseem\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                Waseem\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                Go Coach\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 2\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        What I appreciated most was the genuine\n                                        knowledge and the strong relationship\n                                        throughout the work. Wishing the team\n                                        continued success.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5856-scaled.jpg\"\n                                                alt=\"Mohamed El Khouly\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                Mohamed El Khouly\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                LUM\u00c9A\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 3\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        Great team and excellent service.\n                                        If you need a professional website to\n                                        promote your business or location,\n                                        D-INDEX is an excellent choice.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5856-scaled.jpg\"\n                                                alt=\"James Swayze\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                James Swayze\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                GMCS Power Stations\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 4\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        I highly recommend D-INDEX.\n                                        The team is always ready to help\n                                        whenever you have a question or need\n                                        support.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5857-scaled.jpg\"\n                                                alt=\"Karina Salier\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                Karina Salier\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                High Performance Brain Training\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 5\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        Honest and professional to work with,\n                                        very cooperative, and fairly priced.\n                                        Thank you for the great effort and\n                                        excellent work.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5856-scaled.jpg\"\n                                                alt=\"DZ Daly\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                DZ Daly\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                DZ Store\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 6\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        One of the best companies I have worked\n                                        with. Great service and, more\n                                        importantly, great and honest people.\n                                        Truly a five-star experience.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5856-scaled.jpg\"\n                                                alt=\"Ibrahim Hassan\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                Ibrahim Hassan\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                R&amp;G\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 7\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        One of the most professional companies\n                                        I have worked with. They understood the\n                                        requirements from the first meeting,\n                                        were cooperative in finding solutions,\n                                        and responded quickly whenever an issue\n                                        came up. Their professionalism and\n                                        respectful communication were also\n                                        greatly appreciated.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5857-scaled.jpg\"\n                                                alt=\"Roaa Ahmed\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                Roaa Ahmed\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                My Soul Space\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                            <!-- =====================================\n                                 TESTIMONIAL 8\n                            ====================================== -->\n\n                            <article class=\"dx-test-slide\">\n\n                                <div class=\"dx-test-card\">\n\n                                    <span\n                                        class=\"dx-test-quote-icon\"\n                                        aria-hidden=\"true\"\n                                    >\n                                        <svg viewBox=\"0 0 24 24\">\n                                            <path d=\"M10 11H6.5A4.5 4.5 0 0 1 11 6.5V4a7 7 0 0 0-7 7v8h6v-8zm10 0h-3.5A4.5 4.5 0 0 1 21 6.5V4a7 7 0 0 0-7 7v8h6v-8z\"><\/path>\n                                        <\/svg>\n                                    <\/span>\n\n                                    <div\n                                        class=\"dx-test-stars\"\n                                        aria-label=\"5 out of 5 stars\"\n                                    >\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                        <span>\u2605<\/span>\n                                    <\/div>\n\n                                    <p class=\"dx-test-review\">\n                                        I am genuinely grateful for the success\n                                        I achieved while working with D-INDEX.\n                                        They have a creative touch that is\n                                        clearly noticeable when you work with\n                                        their team.\n                                    <\/p>\n\n                                    <div class=\"dx-test-person\">\n\n                                        <span class=\"dx-test-avatar\">\n\n                                            <img\n                                                src=\"https:\/\/dindex.net\/wp-content\/uploads\/2025\/02\/5857-scaled.jpg\"\n                                                alt=\"Laila Kandil\"\n                                                loading=\"lazy\"\n                                                decoding=\"async\"\n                                            >\n\n                                        <\/span>\n\n                                        <span class=\"dx-test-person-info\">\n\n                                            <strong class=\"dx-test-person-name\">\n                                                Laila Kandil\n                                            <\/strong>\n\n                                            <span class=\"dx-test-person-company\">\n                                                Educational Creativity Center\n                                            <\/span>\n\n                                        <\/span>\n\n                                    <\/div>\n\n                                <\/div>\n\n                            <\/article>\n\n                        <\/div>\n\n                    <\/div>\n\n                    <!-- NEXT -->\n\n                    <button\n                        type=\"button\"\n                        class=\"dx-test-arrow dx-test-arrow-next\"\n                        aria-label=\"Next testimonials\"\n                    >\n                        <svg viewBox=\"0 0 24 24\">\n                            <path d=\"m9 18 6-6-6-6\"><\/path>\n                        <\/svg>\n                    <\/button>\n\n                    <div\n                        class=\"dx-test-pagination\"\n                        aria-label=\"Testimonial navigation\"\n                    ><\/div>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<!-- =========================================================\n     VIDEO MODAL\n========================================================== -->\n\n<div\n    class=\"dx-test-modal\"\n    id=\"dx-test-video-modal\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-label=\"Client video testimonial\"\n    aria-hidden=\"true\"\n>\n\n    <button\n        type=\"button\"\n        class=\"dx-test-modal-close\"\n        aria-label=\"Close video\"\n    ><\/button>\n\n    <div class=\"dx-test-modal-dialog\">\n\n        <div class=\"dx-test-modal-video\"><\/div>\n\n    <\/div>\n\n<\/div>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxTestimonials() {\n\n        const section =\n            document.getElementById(\n                \"dx-home-testimonials\"\n            );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized =\n            \"true\";\n\n        const widget =\n            section.closest(\n                \".elementor-widget-html\"\n            );\n\n        if (widget) {\n\n            widget.classList.add(\n                \"dx-testimonials-widget-fullwidth\"\n            );\n        }\n\n        \/* =====================================================\n           VIDEO MODAL\n        ====================================================== *\/\n\n        const videoButtons =\n            Array.from(\n                section.querySelectorAll(\n                    \".dx-test-video-card\"\n                )\n            );\n\n        const modal =\n            document.getElementById(\n                \"dx-test-video-modal\"\n            );\n\n        const modalVideo =\n            modal\n                ? modal.querySelector(\n                    \".dx-test-modal-video\"\n                )\n                : null;\n\n        const modalClose =\n            modal\n                ? modal.querySelector(\n                    \".dx-test-modal-close\"\n                )\n                : null;\n\n        let lastFocusedElement =\n            null;\n\n        function openVideo(\n            videoId,\n            trigger\n        ) {\n\n            if (\n                !modal ||\n                !modalVideo ||\n                !videoId\n            ) {\n                return;\n            }\n\n            lastFocusedElement =\n                trigger || null;\n\n            const iframe =\n                document.createElement(\n                    \"iframe\"\n                );\n\n            iframe.src =\n                \"https:\/\/www.youtube.com\/embed\/\" +\n                encodeURIComponent(videoId) +\n                \"?feature=oembed\" +\n                \"&autoplay=1\" +\n                \"&controls=1\" +\n                \"&rel=0\" +\n                \"&playsinline=1\";\n\n            iframe.title =\n                \"Client video testimonial\";\n\n            iframe.allow =\n                \"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\";\n\n            iframe.allowFullscreen =\n                true;\n\n            iframe.referrerPolicy =\n                \"strict-origin-when-cross-origin\";\n\n            modalVideo.innerHTML =\n                \"\";\n\n            modalVideo.appendChild(\n                iframe\n            );\n\n            modal.classList.add(\n                \"is-open\"\n            );\n\n            modal.setAttribute(\n                \"aria-hidden\",\n                \"false\"\n            );\n\n            document.body.classList.add(\n                \"dx-test-modal-open\"\n            );\n\n            window.setTimeout(\n                function () {\n\n                    if (modalClose) {\n                        modalClose.focus();\n                    }\n\n                },\n                50\n            );\n        }\n\n        function closeVideo() {\n\n            if (\n                !modal ||\n                !modalVideo\n            ) {\n                return;\n            }\n\n            modal.classList.remove(\n                \"is-open\"\n            );\n\n            modal.setAttribute(\n                \"aria-hidden\",\n                \"true\"\n            );\n\n            modalVideo.innerHTML =\n                \"\";\n\n            document.body.classList.remove(\n                \"dx-test-modal-open\"\n            );\n\n            if (\n                lastFocusedElement &&\n                typeof lastFocusedElement.focus ===\n                    \"function\"\n            ) {\n                lastFocusedElement.focus();\n            }\n        }\n\n        videoButtons.forEach(\n            function (button) {\n\n                button.addEventListener(\n                    \"click\",\n                    function () {\n\n                        openVideo(\n                            button.getAttribute(\n                                \"data-video-id\"\n                            ),\n                            button\n                        );\n                    }\n                );\n            }\n        );\n\n        if (modalClose) {\n\n            modalClose.addEventListener(\n                \"click\",\n                closeVideo\n            );\n        }\n\n        if (modal) {\n\n            modal.addEventListener(\n                \"click\",\n                function (event) {\n\n                    if (\n                        event.target === modal\n                    ) {\n                        closeVideo();\n                    }\n                }\n            );\n        }\n\n        document.addEventListener(\n            \"keydown\",\n            function (event) {\n\n                if (\n                    event.key === \"Escape\" &&\n                    modal &&\n                    modal.classList.contains(\n                        \"is-open\"\n                    )\n                ) {\n                    closeVideo();\n                }\n            }\n        );\n\n        \/* =====================================================\n           TESTIMONIAL SLIDER\n        ====================================================== *\/\n\n        const slider =\n            section.querySelector(\n                \".dx-test-slider\"\n            );\n\n        const track =\n            section.querySelector(\n                \".dx-test-track\"\n            );\n\n        const slides =\n            Array.from(\n                section.querySelectorAll(\n                    \".dx-test-slide\"\n                )\n            );\n\n        const previousButton =\n            section.querySelector(\n                \".dx-test-arrow-prev\"\n            );\n\n        const nextButton =\n            section.querySelector(\n                \".dx-test-arrow-next\"\n            );\n\n        const pagination =\n            section.querySelector(\n                \".dx-test-pagination\"\n            );\n\n        if (\n            !slider ||\n            !track ||\n            slides.length === 0 ||\n            !pagination\n        ) {\n            return;\n        }\n\n        let currentIndex = 0;\n\n        let autoplayTimer =\n            null;\n\n        let touchStartX =\n            0;\n\n        let touchEndX =\n            0;\n\n        let resizeTimer =\n            null;\n\n        function getVisibleSlides() {\n\n            return window.innerWidth <= 900\n                ? 1\n                : 2;\n        }\n\n        function getPagesCount() {\n\n            return Math.max(\n                1,\n                Math.ceil(\n                    slides.length \/\n                    getVisibleSlides()\n                )\n            );\n        }\n\n        function normalizeIndex(\n            index\n        ) {\n\n            const pagesCount =\n                getPagesCount();\n\n            if (index < 0) {\n                return pagesCount - 1;\n            }\n\n            if (\n                index >= pagesCount\n            ) {\n                return 0;\n            }\n\n            return index;\n        }\n\n        function createPagination() {\n\n            pagination.innerHTML =\n                \"\";\n\n            const pagesCount =\n                getPagesCount();\n\n            for (\n                let index = 0;\n                index < pagesCount;\n                index += 1\n            ) {\n\n                const dot =\n                    document.createElement(\n                        \"button\"\n                    );\n\n                dot.type =\n                    \"button\";\n\n                dot.className =\n                    \"dx-test-dot\";\n\n                dot.setAttribute(\n                    \"aria-label\",\n                    \"Go to testimonial group \" +\n                    (index + 1)\n                );\n\n                dot.addEventListener(\n                    \"click\",\n                    function () {\n\n                        currentIndex =\n                            index;\n\n                        updateSlider();\n\n                        restartAutoplay();\n                    }\n                );\n\n                pagination.appendChild(\n                    dot\n                );\n            }\n        }\n\n        function updateSlider() {\n\n            const visibleSlides =\n                getVisibleSlides();\n\n            const slidePercentage =\n                100 \/ visibleSlides;\n\n            const offset =\n                currentIndex *\n                visibleSlides *\n                slidePercentage;\n\n            \/*\n             * LTR slider moves left as index increases.\n             *\/\n            track.style.transform =\n                \"translateX(-\" +\n                offset +\n                \"%)\";\n\n            const dots =\n                Array.from(\n                    pagination.querySelectorAll(\n                        \".dx-test-dot\"\n                    )\n                );\n\n            dots.forEach(\n                function (\n                    dot,\n                    index\n                ) {\n\n                    const isActive =\n                        index ===\n                        currentIndex;\n\n                    dot.classList.toggle(\n                        \"is-active\",\n                        isActive\n                    );\n\n                    dot.setAttribute(\n                        \"aria-current\",\n                        isActive\n                            ? \"true\"\n                            : \"false\"\n                    );\n                }\n            );\n        }\n\n        function goNext() {\n\n            currentIndex =\n                normalizeIndex(\n                    currentIndex + 1\n                );\n\n            updateSlider();\n        }\n\n        function goPrevious() {\n\n            currentIndex =\n                normalizeIndex(\n                    currentIndex - 1\n                );\n\n            updateSlider();\n        }\n\n        function stopAutoplay() {\n\n            if (autoplayTimer) {\n\n                window.clearInterval(\n                    autoplayTimer\n                );\n\n                autoplayTimer =\n                    null;\n            }\n        }\n\n        function startAutoplay() {\n\n            stopAutoplay();\n\n            autoplayTimer =\n                window.setInterval(\n                    goNext,\n                    5500\n                );\n        }\n\n        function restartAutoplay() {\n\n            stopAutoplay();\n\n            startAutoplay();\n        }\n\n        if (previousButton) {\n\n            previousButton.addEventListener(\n                \"click\",\n                function () {\n\n                    goPrevious();\n\n                    restartAutoplay();\n                }\n            );\n        }\n\n        if (nextButton) {\n\n            nextButton.addEventListener(\n                \"click\",\n                function () {\n\n                    goNext();\n\n                    restartAutoplay();\n                }\n            );\n        }\n\n        slider.addEventListener(\n            \"mouseenter\",\n            stopAutoplay\n        );\n\n        slider.addEventListener(\n            \"mouseleave\",\n            startAutoplay\n        );\n\n        slider.addEventListener(\n            \"focusin\",\n            stopAutoplay\n        );\n\n        slider.addEventListener(\n            \"focusout\",\n            startAutoplay\n        );\n\n        slider.addEventListener(\n            \"touchstart\",\n            function (event) {\n\n                touchStartX =\n                    event.changedTouches[0]\n                        .clientX;\n            },\n            {\n                passive: true\n            }\n        );\n\n        slider.addEventListener(\n            \"touchend\",\n            function (event) {\n\n                touchEndX =\n                    event.changedTouches[0]\n                        .clientX;\n\n                const distance =\n                    touchEndX -\n                    touchStartX;\n\n                if (\n                    Math.abs(distance) <\n                    45\n                ) {\n                    return;\n                }\n\n                \/*\n                 * LTR:\n                 * Swipe left  -> next\n                 * Swipe right -> previous\n                 *\/\n                if (\n                    distance < 0\n                ) {\n\n                    goNext();\n\n                } else {\n\n                    goPrevious();\n                }\n\n                restartAutoplay();\n            },\n            {\n                passive: true\n            }\n        );\n\n        window.addEventListener(\n            \"resize\",\n            function () {\n\n                window.clearTimeout(\n                    resizeTimer\n                );\n\n                resizeTimer =\n                    window.setTimeout(\n                        function () {\n\n                            currentIndex =\n                                0;\n\n                            createPagination();\n\n                            updateSlider();\n                        },\n                        150\n                    );\n            }\n        );\n\n        createPagination();\n        updateSlider();\n        startAutoplay();\n    }\n\n    if (\n        document.readyState ===\n        \"loading\"\n    ) {\n\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxTestimonials\n        );\n\n    } else {\n\n        initDxTestimonials();\n\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b622324 e-con-full e-flex e-con e-parent\" data-id=\"b622324\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3fa020d elementor-widget elementor-widget-html\" data-id=\"3fa020d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-faq-en),\n.elementor-widget-html:has(#dx-custom-faq-en) > .elementor-widget-container,\n.dx-custom-faq-en-fullwidth,\n.dx-custom-faq-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-faq-en,\n#dx-custom-faq-en *,\n#dx-custom-faq-en *::before,\n#dx-custom-faq-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-faq-en {\n    --dx-bg: #f7f4fb;\n    --dx-white: #ffffff;\n    --dx-dark: #180b35;\n    --dx-text: #62596e;\n    --dx-muted: #877e92;\n    --dx-purple: #7045df;\n    --dx-purple-light: #966af0;\n    --dx-yellow: #ffc441;\n    --dx-green: #53cf92;\n    --dx-border: rgba(112, 69, 223, 0.12);\n\n    position: relative;\n    isolation: isolate;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n    direction: ltr;\n\n    color: var(--dx-dark);\n\n    background:\n        radial-gradient(\n            circle at 8% 12%,\n            rgba(112, 69, 223, 0.08),\n            transparent 25%\n        ),\n        radial-gradient(\n            circle at 92% 88%,\n            rgba(255, 196, 65, 0.08),\n            transparent 28%\n        ),\n        var(--dx-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-faq-en button {\n    font-family: inherit;\n}\n\n#dx-custom-faq-en .dx-cfaq-grid {\n    position: absolute;\n    z-index: -5;\n\n    inset: 0;\n\n    opacity: 0.15;\n\n    background-image:\n        linear-gradient(\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(112, 69, 223, 0.04) 1px,\n            transparent 1px\n        );\n\n    background-size: 72px 72px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 82%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 16%,\n            transparent 82%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-faq-en .dx-cfaq-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        94px\n        clamp(22px, 5vw, 90px)\n        100px;\n}\n\n#dx-custom-faq-en .dx-cfaq-container {\n    width: min(1320px, 100%);\n    margin: 0 auto;\n}\n\n#dx-custom-faq-en .dx-cfaq-header {\n    max-width: 860px;\n\n    margin:\n        0\n        auto\n        48px;\n\n    text-align: center;\n}\n\n#dx-custom-faq-en .dx-cfaq-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 12px;\n\n    color: var(--dx-purple);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-faq-en .dx-cfaq-eyebrow::before,\n#dx-custom-faq-en .dx-cfaq-eyebrow::after {\n    content: \"\";\n\n    width: 31px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-yellow),\n            var(--dx-purple-light)\n        );\n}\n\n#dx-custom-faq-en .dx-cfaq-title {\n    margin: 0;\n\n    color: var(--dx-dark);\n\n    font-size: clamp(34px, 3.7vw, 52px);\n    font-weight: 900;\n    line-height: 1.55;\n    letter-spacing: -0.4px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-faq-en .dx-cfaq-title span {\n    color: var(--dx-purple);\n}\n\n#dx-custom-faq-en .dx-cfaq-description {\n    max-width: 760px;\n\n    margin:\n        14px\n        auto\n        0;\n\n    color: var(--dx-text);\n\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 2;\n}\n\n#dx-custom-faq-en .dx-cfaq-layout {\n    display: grid;\n    grid-template-columns:\n        minmax(300px, 0.42fr)\n        minmax(0, 1fr);\n\n    gap: 24px;\n\n    align-items: start;\n}\n\n#dx-custom-faq-en .dx-cfaq-intro {\n    position: sticky;\n    top: 110px;\n\n    overflow: hidden;\n\n    padding:\n        31px\n        27px;\n\n    border: 1px solid rgba(255, 255, 255, 0.11);\n    border-radius: 24px;\n\n    color: #ffffff;\n\n    background:\n        radial-gradient(\n            circle at 10% 8%,\n            rgba(150, 106, 240, 0.24),\n            transparent 34%\n        ),\n        linear-gradient(\n            145deg,\n            #1b0a3d,\n            #0c0225\n        );\n\n    box-shadow:\n        0 24px 60px rgba(40, 18, 84, 0.18);\n}\n\n#dx-custom-faq-en .dx-cfaq-intro-label {\n    display: block;\n\n    color: var(--dx-yellow);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1.6;\n}\n\n#dx-custom-faq-en .dx-cfaq-intro-title {\n    margin:\n        8px\n        0\n        0;\n\n    color: #ffffff;\n\n    font-size: 28px;\n    font-weight: 900;\n    line-height: 1.55;\n}\n\n#dx-custom-faq-en .dx-cfaq-intro-text {\n    margin:\n        12px\n        0\n        0;\n\n    color: rgba(255,255,255,.68);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 2;\n}\n\n#dx-custom-faq-en .dx-cfaq-intro-list {\n    margin-top: 23px;\n    padding-top: 19px;\n\n    display: grid;\n\n    gap: 10px;\n\n    border-top: 1px solid rgba(255,255,255,.10);\n}\n\n#dx-custom-faq-en .dx-cfaq-intro-item {\n    display: flex;\n    align-items: flex-start;\n\n    gap: 9px;\n\n    color: rgba(255,255,255,.72);\n\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.8;\n}\n\n#dx-custom-faq-en .dx-cfaq-check {\n    width: 24px;\n    height: 24px;\n    flex: 0 0 24px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 8px;\n\n    color: #7ce3b3;\n\n    background: rgba(83,207,146,.11);\n}\n\n#dx-custom-faq-en .dx-cfaq-check svg {\n    width: 12px;\n    height: 12px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.3;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-faq-en .dx-cfaq-list {\n    display: grid;\n    gap: 12px;\n}\n\n#dx-custom-faq-en .dx-cfaq-item {\n    overflow: hidden;\n\n    border: 1px solid var(--dx-border);\n    border-radius: 17px;\n\n    background: rgba(255,255,255,.88);\n\n    box-shadow:\n        0 14px 36px rgba(40,18,84,.055);\n\n    transition:\n        border-color .28s ease,\n        box-shadow .28s ease;\n}\n\n#dx-custom-faq-en .dx-cfaq-item.is-open {\n    border-color: rgba(112,69,223,.28);\n\n    box-shadow:\n        0 22px 48px rgba(40,18,84,.085);\n}\n\n#dx-custom-faq-en .dx-cfaq-question {\n    width: 100%;\n    min-height: 82px;\n\n    display: grid;\n    grid-template-columns:\n        48px\n        minmax(0, 1fr)\n        36px;\n\n    align-items: center;\n\n    gap: 13px;\n\n    padding:\n        0\n        20px;\n\n    border: 0;\n\n    color: var(--dx-dark);\n\n    background: transparent;\n\n    text-align: left;\n\n    cursor: pointer;\n}\n\n#dx-custom-faq-en .dx-cfaq-number {\n    color: rgba(112,69,223,.35);\n\n    font-size: 14px;\n    font-weight: 900;\n    line-height: 1;\n}\n\n#dx-custom-faq-en .dx-cfaq-question-text {\n    font-size: 16px;\n    font-weight: 900;\n    line-height: 1.75;\n}\n\n#dx-custom-faq-en .dx-cfaq-toggle {\n    width: 34px;\n    height: 34px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 10px;\n\n    color: var(--dx-purple);\n\n    background: rgba(112,69,223,.07);\n\n    transition:\n        transform .28s ease,\n        color .28s ease,\n        background .28s ease;\n}\n\n#dx-custom-faq-en .dx-cfaq-toggle svg {\n    width: 16px;\n    height: 16px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-faq-en .dx-cfaq-item.is-open\n    .dx-cfaq-toggle {\n    color: #ffffff;\n\n    background: var(--dx-purple);\n\n    transform: rotate(45deg);\n}\n\n#dx-custom-faq-en .dx-cfaq-answer {\n    display: grid;\n    grid-template-rows: 0fr;\n\n    transition:\n        grid-template-rows .32s ease;\n}\n\n#dx-custom-faq-en .dx-cfaq-item.is-open\n    .dx-cfaq-answer {\n    grid-template-rows: 1fr;\n}\n\n#dx-custom-faq-en .dx-cfaq-answer-inner {\n    overflow: hidden;\n}\n\n#dx-custom-faq-en .dx-cfaq-answer-content {\n    margin:\n        0\n        20px\n        0\n        81px;\n\n    padding:\n        0\n        0\n        22px;\n\n    color: var(--dx-text);\n\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 2;\n}\n\n#dx-custom-faq-en .dx-cfaq-answer-content p {\n    margin: 0;\n}\n\n#dx-custom-faq-en .dx-cfaq-answer-list {\n    margin:\n        11px\n        0\n        0;\n\n    padding: 0;\n\n    list-style: none;\n\n    display: grid;\n\n    gap: 7px;\n}\n\n#dx-custom-faq-en .dx-cfaq-answer-list li {\n    position: relative;\n\n    padding-left: 20px;\n}\n\n#dx-custom-faq-en .dx-cfaq-answer-list li::before {\n    content: \"\";\n\n    position: absolute;\n\n    top: 11px;\n    left: 0;\n\n    width: 7px;\n    height: 7px;\n\n    border-radius: 50%;\n\n    background: var(--dx-purple);\n}\n\n@media (max-width: 980px) {\n    #dx-custom-faq-en .dx-cfaq-main {\n        padding:\n            76px\n            28px\n            82px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-layout {\n        grid-template-columns: 1fr;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-intro {\n        position: relative;\n        top: auto;\n    }\n}\n\n@media (max-width: 680px) {\n    #dx-custom-faq-en .dx-cfaq-main {\n        padding:\n            59px\n            16px\n            65px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-header {\n        margin-bottom: 34px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-eyebrow::before,\n    #dx-custom-faq-en .dx-cfaq-eyebrow::after {\n        width: 22px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-title {\n        font-size: clamp(28px, 8.5vw, 37px);\n        line-height: 1.65;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-description {\n        font-size: 14px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-intro {\n        padding:\n            25px\n            20px;\n\n        border-radius: 20px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-intro-title {\n        font-size: 23px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-question {\n        min-height: 75px;\n\n        grid-template-columns:\n            35px\n            minmax(0, 1fr)\n            32px;\n\n        gap: 9px;\n\n        padding:\n            0\n            13px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-question-text {\n        font-size: 14px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-toggle {\n        width: 31px;\n        height: 31px;\n    }\n\n    #dx-custom-faq-en .dx-cfaq-answer-content {\n        margin:\n            0\n            13px\n            0\n            61px;\n\n        padding-bottom: 18px;\n    }\n}\n\n#dx-custom-faq-en button:focus-visible {\n    outline: 3px solid var(--dx-yellow);\n    outline-offset: 3px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-faq-en *,\n    #dx-custom-faq-en *::before,\n    #dx-custom-faq-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-faq-en\"\n    aria-labelledby=\"dx-custom-faq-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div class=\"dx-cfaq-grid\" aria-hidden=\"true\"><\/div>\n\n    <div class=\"dx-cfaq-main\">\n\n        <div class=\"dx-cfaq-container\">\n\n            <header class=\"dx-cfaq-header\">\n\n                <span class=\"dx-cfaq-eyebrow\">\n                    Frequently Asked Questions\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-faq-title-en\"\n                    class=\"dx-cfaq-title\"\n                >\n                    Answers to Common Questions About\n                    <span>Custom E-Commerce Development<\/span>\n                <\/h2>\n\n                <p class=\"dx-cfaq-description\">\n                    Custom e-commerce projects can vary significantly\n                    depending on the business model, required functionality,\n                    and integrations. These answers cover the main points\n                    to understand before defining the project scope.\n                <\/p>\n\n            <\/header>\n\n            <div class=\"dx-cfaq-layout\">\n\n                <aside class=\"dx-cfaq-intro\">\n\n                    <span class=\"dx-cfaq-intro-label\">\n                        Before You Get Started\n                    <\/span>\n\n                    <h3 class=\"dx-cfaq-intro-title\">\n                        A Custom Platform Starts With Requirements, Not a Pre-Built System\n                    <\/h3>\n\n                    <p class=\"dx-cfaq-intro-text\">\n                        The technology, architecture, and implementation\n                        plan are defined around the functionality,\n                        integrations, and operational model required by\n                        the project rather than a fixed package.\n                    <\/p>\n\n                    <div class=\"dx-cfaq-intro-list\">\n\n                        <div class=\"dx-cfaq-intro-item\">\n\n                            <span\n                                class=\"dx-cfaq-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Requirements are analyzed before selecting the technical solution.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cfaq-intro-item\">\n\n                            <span\n                                class=\"dx-cfaq-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                Functionality and integrations are defined around the business model.\n                            <\/span>\n\n                        <\/div>\n\n                        <div class=\"dx-cfaq-intro-item\">\n\n                            <span\n                                class=\"dx-cfaq-check\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"m5 12 4 4L19 6\"><\/path>\n                                <\/svg>\n                            <\/span>\n\n                            <span>\n                                The platform can be extended with new functionality later.\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n                <\/aside>\n\n                <div class=\"dx-cfaq-list\">\n\n                    <article class=\"dx-cfaq-item is-open\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"true\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                01\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                What Is the Difference Between a Custom Store and a Platform Like WooCommerce?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        With an off-the-shelf platform,\n                                        the project starts from an existing\n                                        system and is adapted through settings\n                                        and extensions. With custom development,\n                                        the architecture, functionality, and\n                                        workflows are designed around the\n                                        project requirements themselves.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                02\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                Does Every Online Store Need Custom Development?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        No. If the project requirements can\n                                        be handled efficiently by an existing\n                                        e-commerce platform, that may be the\n                                        more suitable option. Custom development\n                                        becomes more relevant when the business\n                                        has unique workflows, complex integrations,\n                                        or functionality that does not fit\n                                        comfortably within an off-the-shelf system.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                03\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                How Long Does It Take to Develop a Custom E-Commerce Platform?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        The development timeline depends on\n                                        the size of the platform, number of\n                                        interfaces and modules, complexity\n                                        of the workflows, and required\n                                        integrations. The implementation plan\n                                        is defined after reviewing the project\n                                        scope and requirements.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                04\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                Can the Platform Integrate With ERP, CRM, or Accounting Systems?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        Yes, provided the external system\n                                        offers a suitable integration method\n                                        such as an API or webhooks. The data\n                                        and processes that need to be exchanged\n                                        between systems are defined during\n                                        project analysis.\n                                    <\/p>\n\n                                    <ul class=\"dx-cfaq-answer-list\">\n                                        <li>\n                                            Products and inventory.\n                                        <\/li>\n\n                                        <li>\n                                            Orders and customers.\n                                        <\/li>\n\n                                        <li>\n                                            Invoices or operational data where applicable.\n                                        <\/li>\n                                    <\/ul>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                05\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                Can We Have a Custom Admin Dashboard for Our Team?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        Yes. The administration dashboard\n                                        can be designed around the team's\n                                        operational tasks, with different\n                                        permission levels and access to the\n                                        tools and data relevant to each role.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                06\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                Can New Features Be Added After Launch?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        Yes. One of the goals of a custom\n                                        architecture is to make future\n                                        development possible. Additional\n                                        modules, functionality, and integrations\n                                        can be evaluated and added as the\n                                        business requirements evolve.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                07\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                Will the Custom Store Work on Mobile and Tablet Devices?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        Yes. The interfaces are designed\n                                        responsively and the customer\n                                        experience is reviewed across mobile,\n                                        tablet, and desktop screen sizes.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                    <article class=\"dx-cfaq-item\">\n\n                        <button\n                            type=\"button\"\n                            class=\"dx-cfaq-question\"\n                            aria-expanded=\"false\"\n                        >\n                            <span class=\"dx-cfaq-number\">\n                                08\n                            <\/span>\n\n                            <span class=\"dx-cfaq-question-text\">\n                                How Is the Cost of a Custom E-Commerce Platform Determined?\n                            <\/span>\n\n                            <span\n                                class=\"dx-cfaq-toggle\"\n                                aria-hidden=\"true\"\n                            >\n                                <svg viewBox=\"0 0 24 24\">\n                                    <path d=\"M12 5v14\"><\/path>\n                                    <path d=\"M5 12h14\"><\/path>\n                                <\/svg>\n                            <\/span>\n                        <\/button>\n\n                        <div class=\"dx-cfaq-answer\">\n\n                            <div class=\"dx-cfaq-answer-inner\">\n\n                                <div class=\"dx-cfaq-answer-content\">\n\n                                    <p>\n                                        Cost depends on the project scope,\n                                        interfaces, functionality, integrations,\n                                        and required workflows. Once these\n                                        requirements are reviewed, the project\n                                        can be scoped clearly and an appropriate\n                                        proposal prepared.\n                                    <\/p>\n\n                                <\/div>\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/article>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomFaqEn() {\n        const section = document.getElementById(\n            \"dx-custom-faq-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-faq-en-fullwidth\"\n            );\n        }\n\n        const items = section.querySelectorAll(\n            \".dx-cfaq-item\"\n        );\n\n        items.forEach(function (item) {\n            const button = item.querySelector(\n                \".dx-cfaq-question\"\n            );\n\n            if (!button) {\n                return;\n            }\n\n            button.addEventListener(\n                \"click\",\n                function () {\n                    const isOpen =\n                        item.classList.contains(\n                            \"is-open\"\n                        );\n\n                    items.forEach(function (currentItem) {\n                        currentItem.classList.remove(\n                            \"is-open\"\n                        );\n\n                        const currentButton =\n                            currentItem.querySelector(\n                                \".dx-cfaq-question\"\n                            );\n\n                        if (currentButton) {\n                            currentButton.setAttribute(\n                                \"aria-expanded\",\n                                \"false\"\n                            );\n                        }\n                    });\n\n                    if (!isOpen) {\n                        item.classList.add(\"is-open\");\n\n                        button.setAttribute(\n                            \"aria-expanded\",\n                            \"true\"\n                        );\n                    }\n                }\n            );\n        });\n\n        if (\n            !(\"IntersectionObserver\" in window) ||\n            window.matchMedia(\n                \"(prefers-reduced-motion: reduce)\"\n            ).matches\n        ) {\n            return;\n        }\n\n        const intro = section.querySelector(\n            \".dx-cfaq-intro\"\n        );\n\n        if (intro) {\n            intro.style.opacity = \"0\";\n            intro.style.transform =\n                \"translateX(-25px)\";\n\n            intro.style.transition =\n                \"opacity .65s ease, transform .65s ease\";\n        }\n\n        items.forEach(function (item, index) {\n            item.style.opacity = \"0\";\n            item.style.transform =\n                \"translateY(18px)\";\n\n            item.style.transition =\n                \"opacity .55s ease \" +\n                (index * .05) +\n                \"s, transform .55s ease \" +\n                (index * .05) +\n                \"s\";\n        });\n\n        const observer = new IntersectionObserver(\n            function (entries, currentObserver) {\n                entries.forEach(function (entry) {\n                    if (!entry.isIntersecting) {\n                        return;\n                    }\n\n                    if (intro) {\n                        intro.style.opacity = \"1\";\n                        intro.style.transform =\n                            \"translateX(0)\";\n                    }\n\n                    items.forEach(function (item) {\n                        item.style.opacity = \"1\";\n                        item.style.transform =\n                            \"translateY(0)\";\n                    });\n\n                    currentObserver.unobserve(\n                        entry.target\n                    );\n                });\n            },\n            {\n                threshold: .08\n            }\n        );\n\n        observer.observe(section);\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomFaqEn\n        );\n    } else {\n        initDxCustomFaqEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d9687df e-con-full e-flex e-con e-parent\" data-id=\"d9687df\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d1c277f elementor-widget elementor-widget-html\" data-id=\"d1c277f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.elementor-widget-html:has(#dx-custom-final-cta-en),\n.elementor-widget-html:has(#dx-custom-final-cta-en) > .elementor-widget-container,\n.dx-custom-final-cta-en-fullwidth,\n.dx-custom-final-cta-en-fullwidth > .elementor-widget-container {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: visible !important;\n}\n\n#dx-custom-final-cta-en,\n#dx-custom-final-cta-en *,\n#dx-custom-final-cta-en *::before,\n#dx-custom-final-cta-en *::after {\n    box-sizing: border-box;\n}\n\n#dx-custom-final-cta-en {\n    --dx-cta-dark: #090020;\n    --dx-cta-dark-light: #20104b;\n    --dx-cta-purple: #6942d8;\n    --dx-cta-purple-light: #9168ef;\n    --dx-cta-yellow: #ffc441;\n    --dx-cta-yellow-light: #ffd66e;\n    --dx-cta-white: #ffffff;\n    --dx-cta-text: rgba(255, 255, 255, 0.74);\n    --dx-cta-border: rgba(255, 255, 255, 0.15);\n    --dx-cta-page-bg: #f8f7fc;\n\n    position: relative;\n    z-index: 2;\n    isolation: isolate;\n\n    display: block;\n    clear: both;\n\n    width: 100vw;\n    max-width: 100vw;\n\n    margin-right: calc(50% - 50vw);\n    margin-left: calc(50% - 50vw);\n\n    overflow: hidden;\n\n    direction: ltr;\n\n    color: var(--dx-cta-white);\n\n    background: var(--dx-cta-page-bg);\n\n    font-family:\n        \"Inter\",\n        \"Segoe UI\",\n        Arial,\n        sans-serif;\n}\n\n#dx-custom-final-cta-en a {\n    color: inherit;\n    text-decoration: none;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-main {\n    position: relative;\n    z-index: 2;\n\n    width: 100%;\n\n    padding:\n        58px\n        clamp(22px, 5vw, 90px)\n        62px;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-container {\n    position: relative;\n    isolation: isolate;\n\n    width: min(1580px, 100%);\n    min-height: 460px;\n\n    margin: 0 auto;\n\n    padding:\n        58px\n        clamp(28px, 5vw, 85px);\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    overflow: hidden;\n\n    border: 1px solid var(--dx-cta-border);\n    border-radius: 30px;\n\n    background:\n        radial-gradient(\n            circle at 18% 16%,\n            rgba(145, 104, 239, 0.28),\n            transparent 30%\n        ),\n        radial-gradient(\n            circle at 88% 82%,\n            rgba(105, 66, 216, 0.24),\n            transparent 35%\n        ),\n        linear-gradient(\n            145deg,\n            var(--dx-cta-dark-light),\n            var(--dx-cta-dark)\n        );\n\n    box-shadow:\n        0 30px 66px rgba(38, 17, 86, 0.20),\n        inset 0 1px 0 rgba(255, 255, 255, 0.08);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-grid {\n    position: absolute;\n    z-index: -5;\n\n    inset: 0;\n\n    opacity: 0.08;\n\n    background-image:\n        linear-gradient(\n            rgba(255, 255, 255, 0.05) 1px,\n            transparent 1px\n        ),\n        linear-gradient(\n            90deg,\n            rgba(255, 255, 255, 0.05) 1px,\n            transparent 1px\n        );\n\n    background-size: 68px 68px;\n\n    -webkit-mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 18%,\n            transparent 78%\n        );\n\n    mask-image:\n        radial-gradient(\n            ellipse at center,\n            #000 18%,\n            transparent 78%\n        );\n\n    pointer-events: none;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-center-orbit {\n    position: absolute;\n    z-index: -3;\n\n    top: -145px;\n    left: 50%;\n\n    width: 340px;\n    height: 340px;\n\n    border: 58px solid rgba(145, 104, 239, 0.10);\n    border-radius: 50%;\n\n    transform: translateX(-50%);\n\n    pointer-events: none;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-line {\n    position: absolute;\n    z-index: -2;\n\n    left: -90px;\n    bottom: 35px;\n\n    width: 350px;\n    height: 8px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(145, 104, 239, 0.58),\n            rgba(255, 196, 65, 0.38),\n            transparent\n        );\n\n    transform: rotate(45deg);\n\n    pointer-events: none;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-dots {\n    position: absolute;\n    z-index: -2;\n\n    right: 36px;\n    top: 30px;\n\n    width: 110px;\n    height: 110px;\n\n    opacity: 0.22;\n\n    background-image:\n        radial-gradient(\n            circle,\n            var(--dx-cta-purple-light) 2px,\n            transparent 2.7px\n        );\n\n    background-size: 17px 17px;\n\n    pointer-events: none;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-content {\n    position: relative;\n    z-index: 5;\n\n    width: min(920px, 100%);\n\n    text-align: center;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-label {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-bottom: 13px;\n\n    color: var(--dx-cta-yellow);\n\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1.6;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-label::before,\n#dx-custom-final-cta-en .dx-final-cta-label::after {\n    content: \"\";\n\n    width: 34px;\n    height: 2px;\n\n    border-radius: 999px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--dx-cta-yellow),\n            var(--dx-cta-purple-light)\n        );\n}\n\n#dx-custom-final-cta-en .dx-final-cta-title {\n    margin: 0;\n\n    color: var(--dx-cta-white);\n\n    font-size: clamp(34px, 4vw, 58px);\n    font-weight: 900;\n    line-height: 1.22;\n    letter-spacing: -1px;\n\n    text-wrap: balance;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-title-highlight {\n    color: var(--dx-cta-yellow);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-description {\n    max-width: 760px;\n\n    margin:\n        18px\n        auto\n        0;\n\n    color: var(--dx-cta-text);\n\n    font-size: 16px;\n    font-weight: 400;\n    line-height: 1.8;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-actions {\n    margin-top: 28px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-wrap: wrap;\n\n    gap: 13px;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button {\n    position: relative;\n\n    min-width: 220px;\n    min-height: 56px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    padding:\n        0\n        27px;\n\n    border: 1px solid transparent;\n    border-radius: 13px;\n\n    font-size: 14px;\n    font-weight: 800;\n    line-height: 1.5;\n\n    overflow: hidden;\n\n    transition:\n        transform 0.25s ease,\n        box-shadow 0.25s ease,\n        border-color 0.25s ease,\n        background 0.25s ease,\n        color 0.25s ease;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button-primary {\n    color: #190c32;\n\n    border-color: rgba(255, 255, 255, 0.25);\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-cta-yellow),\n            var(--dx-cta-yellow-light)\n        );\n\n    box-shadow:\n        0 17px 38px rgba(255, 196, 65, 0.24);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button-primary::before {\n    content: \"\";\n\n    position: absolute;\n\n    top: -50%;\n    left: -70%;\n\n    width: 35%;\n    height: 200%;\n\n    background:\n        linear-gradient(\n            90deg,\n            transparent,\n            rgba(255, 255, 255, 0.55),\n            transparent\n        );\n\n    transform: rotate(20deg);\n\n    transition: left 0.55s ease;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button-primary:hover::before {\n    left: 135%;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button-secondary {\n    color: var(--dx-cta-white);\n\n    border-color: rgba(255, 255, 255, 0.22);\n\n    background: rgba(255, 255, 255, 0.07);\n\n    -webkit-backdrop-filter: blur(10px);\n    backdrop-filter: blur(10px);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button:hover,\n#dx-custom-final-cta-en .dx-final-cta-button:focus-visible {\n    transform: translateY(-4px);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button-primary:hover,\n#dx-custom-final-cta-en .dx-final-cta-button-primary:focus-visible {\n    color: #120725;\n\n    box-shadow:\n        0 22px 48px rgba(255, 196, 65, 0.34);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button-secondary:hover,\n#dx-custom-final-cta-en .dx-final-cta-button-secondary:focus-visible {\n    border-color: rgba(145, 104, 239, 0.72);\n\n    background:\n        linear-gradient(\n            135deg,\n            var(--dx-cta-purple),\n            var(--dx-cta-purple-light)\n        );\n\n    box-shadow:\n        0 19px 42px rgba(105, 66, 216, 0.32);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-button svg {\n    position: relative;\n    z-index: 2;\n\n    width: 20px;\n    height: 20px;\n    flex: 0 0 20px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.9;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-trust {\n    margin-top: 24px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-wrap: wrap;\n\n    gap:\n        10px\n        22px;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-trust-item {\n    display: inline-flex;\n    align-items: center;\n\n    gap: 8px;\n\n    color: rgba(255, 255, 255, 0.66);\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.6;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-trust-icon {\n    width: 22px;\n    height: 22px;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255, 196, 65, 0.30);\n    border-radius: 50%;\n\n    color: var(--dx-cta-yellow);\n\n    background: rgba(255, 196, 65, 0.08);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-trust-icon svg {\n    width: 12px;\n    height: 12px;\n\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 2.2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-floating {\n    position: absolute;\n    z-index: 1;\n\n    pointer-events: none;\n\n    animation:\n        dxCustomFinalCtaFloatEn\n        5s\n        ease-in-out\n        infinite;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-floating-one {\n    top: 36px;\n    left: 48px;\n\n    width: 50px;\n    height: 50px;\n\n    border: 1px solid rgba(255, 255, 255, 0.18);\n    border-radius: 16px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(145, 104, 239, 0.72),\n            rgba(105, 66, 216, 0.20)\n        );\n\n    transform: rotate(-16deg);\n}\n\n#dx-custom-final-cta-en .dx-final-cta-floating-two {\n    right: 62px;\n    bottom: 44px;\n\n    width: 40px;\n    height: 40px;\n\n    border: 8px solid rgba(255, 196, 65, 0.60);\n    border-radius: 50%;\n\n    animation-delay: -2.3s;\n}\n\n#dx-custom-final-cta-en .dx-final-cta-floating-three {\n    top: 68px;\n    right: 82px;\n\n    width: 16px;\n    height: 16px;\n\n    border-radius: 50%;\n\n    background: var(--dx-cta-yellow);\n\n    box-shadow:\n        0 0 30px rgba(255, 196, 65, 0.50);\n\n    animation-delay: -1.2s;\n}\n\n@keyframes dxCustomFinalCtaFloatEn {\n    0%,\n    100% {\n        transform:\n            translateY(0)\n            rotate(-12deg);\n    }\n\n    50% {\n        transform:\n            translateY(-12px)\n            rotate(-18deg);\n    }\n}\n\n@media (max-width: 900px) {\n    #dx-custom-final-cta-en .dx-final-cta-main {\n        padding:\n            52px\n            28px\n            56px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-container {\n        min-height: 430px;\n\n        padding:\n            52px\n            34px;\n\n        border-radius: 27px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-title {\n        font-size: clamp(34px, 6.5vw, 50px);\n    }\n}\n\n@media (max-width: 600px) {\n    #dx-custom-final-cta-en .dx-final-cta-main {\n        padding:\n            38px\n            16px\n            42px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-container {\n        min-height: 0;\n\n        padding:\n            46px\n            18px\n            42px;\n\n        border-radius: 22px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-center-orbit {\n        top: -75px;\n\n        width: 220px;\n        height: 220px;\n\n        border-width: 40px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-label {\n        margin-bottom: 11px;\n\n        font-size: 14px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-label::before,\n    #dx-custom-final-cta-en .dx-final-cta-label::after {\n        width: 22px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-title {\n        font-size: clamp(28px, 8.5vw, 36px);\n        line-height: 1.3;\n        letter-spacing: -0.4px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-description {\n        margin-top: 14px;\n\n        font-size: 14px;\n        line-height: 1.8;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-actions {\n        margin-top: 23px;\n\n        gap: 10px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-button {\n        width: 100%;\n        min-width: 0;\n        min-height: 54px;\n\n        padding:\n            0\n            18px;\n\n        font-size: 14px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-trust {\n        margin-top: 21px;\n\n        display: grid;\n        grid-template-columns: 1fr;\n\n        gap: 9px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-trust-item {\n        justify-content: center;\n\n        font-size: 14px;\n    }\n\n    #dx-custom-final-cta-en .dx-final-cta-dots {\n        display: none;\n    }\n}\n\n#dx-custom-final-cta-en a:focus-visible {\n    outline:\n        3px solid var(--dx-cta-yellow);\n\n    outline-offset: 4px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    #dx-custom-final-cta-en *,\n    #dx-custom-final-cta-en *::before,\n    #dx-custom-final-cta-en *::after {\n        animation-duration: 0.01ms !important;\n        animation-iteration-count: 1 !important;\n        transition-duration: 0.01ms !important;\n    }\n}\n<\/style>\n\n<section\n    id=\"dx-custom-final-cta-en\"\n    aria-labelledby=\"dx-custom-final-cta-title-en\"\n    dir=\"ltr\"\n    lang=\"en\"\n>\n    <div class=\"dx-final-cta-main\">\n\n        <div class=\"dx-final-cta-container\">\n\n            <div\n                class=\"dx-final-cta-grid\"\n                aria-hidden=\"true\"\n            ><\/div>\n\n            <span\n                class=\"dx-final-cta-center-orbit\"\n                aria-hidden=\"true\"\n            ><\/span>\n\n            <span\n                class=\"dx-final-cta-line\"\n                aria-hidden=\"true\"\n            ><\/span>\n\n            <span\n                class=\"dx-final-cta-dots\"\n                aria-hidden=\"true\"\n            ><\/span>\n\n            <span\n                class=\"dx-final-cta-floating dx-final-cta-floating-one\"\n                aria-hidden=\"true\"\n            ><\/span>\n\n            <span\n                class=\"dx-final-cta-floating dx-final-cta-floating-two\"\n                aria-hidden=\"true\"\n            ><\/span>\n\n            <span\n                class=\"dx-final-cta-floating dx-final-cta-floating-three\"\n                aria-hidden=\"true\"\n            ><\/span>\n\n            <div class=\"dx-final-cta-content\">\n\n                <span class=\"dx-final-cta-label\">\n                    Let\u2019s Build Your Store\n                <\/span>\n\n                <h2\n                    id=\"dx-custom-final-cta-title-en\"\n                    class=\"dx-final-cta-title\"\n                >\n                    Does Your Business Need More Than\n                    <br>\n\n                    an Off-the-Shelf Store?\n\n                    <span class=\"dx-final-cta-title-highlight\">\n                        Let\u2019s Build Around Your Requirements\n                    <\/span>\n                <\/h2>\n\n                <p class=\"dx-final-cta-description\">\n                    Tell us about your business model, required\n                    functionality, and integrations. We can review\n                    the requirements and help define the right\n                    architecture for a custom e-commerce platform\n                    built around the way your business operates.\n                <\/p>\n\n                <div class=\"dx-final-cta-actions\">\n\n                    <a\n                        href=\"https:\/\/dindex.net\/en\/contact\/\"\n                        class=\"dx-final-cta-button dx-final-cta-button-primary\"\n                    >\n                        <span>\n                            Discuss Your Store Project\n                        <\/span>\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M8 3h8a3 3 0 0 1 3 3v6a3 3 0 0 1-3 3h-5l-4 4v-4a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3h1\"><\/path>\n                            <path d=\"M8 8h8\"><\/path>\n                            <path d=\"M8 11h5\"><\/path>\n                        <\/svg>\n                    <\/a>\n\n                    <a\n                        href=\"https:\/\/dindex.net\/en\/web-projects\/\"\n                        class=\"dx-final-cta-button dx-final-cta-button-secondary\"\n                    >\n                        <span>\n                            Explore Our Work\n                        <\/span>\n\n                        <svg\n                            viewBox=\"0 0 24 24\"\n                            aria-hidden=\"true\"\n                        >\n                            <path d=\"M5 12h14\"><\/path>\n                            <path d=\"m13 6 6 6-6 6\"><\/path>\n                        <\/svg>\n                    <\/a>\n\n                <\/div>\n\n                <div\n                    class=\"dx-final-cta-trust\"\n                    aria-label=\"Custom e-commerce project benefits\"\n                >\n\n                    <span class=\"dx-final-cta-trust-item\">\n\n                        <span\n                            class=\"dx-final-cta-trust-icon\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m6 12 4 4 8-8\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span>\n                            Requirements Analysis Before Development\n                        <\/span>\n\n                    <\/span>\n\n                    <span class=\"dx-final-cta-trust-item\">\n\n                        <span\n                            class=\"dx-final-cta-trust-icon\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m6 12 4 4 8-8\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span>\n                            Architecture Based on Your Business Model\n                        <\/span>\n\n                    <\/span>\n\n                    <span class=\"dx-final-cta-trust-item\">\n\n                        <span\n                            class=\"dx-final-cta-trust-icon\"\n                            aria-hidden=\"true\"\n                        >\n                            <svg viewBox=\"0 0 24 24\">\n                                <path d=\"m6 12 4 4 8-8\"><\/path>\n                            <\/svg>\n                        <\/span>\n\n                        <span>\n                            Ready for Future Features & Integrations\n                        <\/span>\n\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    \"use strict\";\n\n    function initDxCustomFinalCtaEn() {\n        const section = document.getElementById(\n            \"dx-custom-final-cta-en\"\n        );\n\n        if (\n            !section ||\n            section.dataset.dxInitialized === \"true\"\n        ) {\n            return;\n        }\n\n        section.dataset.dxInitialized = \"true\";\n\n        const widget = section.closest(\n            \".elementor-widget-html\"\n        );\n\n        if (widget) {\n            widget.classList.add(\n                \"dx-custom-final-cta-en-fullwidth\"\n            );\n        }\n    }\n\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initDxCustomFinalCtaEn\n        );\n    } else {\n        initDxCustomFinalCtaEn();\n    }\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Custom E-Commerce Development A Custom Online Store Built Around Your Business We develop your e-commerce platform from the ground up with a custom architecture that gives you full control over design, functionality, and integrations, while delivering a fast, scalable experience without forcing your business into the limitations of a pre-built template or platform. Discuss Your [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-4133","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/pages\/4133","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/comments?post=4133"}],"version-history":[{"count":28,"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/pages\/4133\/revisions"}],"predecessor-version":[{"id":4203,"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/pages\/4133\/revisions\/4203"}],"wp:attachment":[{"href":"https:\/\/dindex.net\/en\/wp-json\/wp\/v2\/media?parent=4133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}