{"id":2659,"date":"2025-02-09T05:42:37","date_gmt":"2025-02-09T05:42:37","guid":{"rendered":"https:\/\/navein.tanshcreative.com\/?page_id=7"},"modified":"2026-09-18T14:25:42","modified_gmt":"2026-09-18T14:25:42","slug":"home","status":"publish","type":"page","link":"https:\/\/brayanangarita.com\/es\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2659\" class=\"elementor elementor-2659\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f6dd176 e-flex e-con-boxed e-con e-parent\" data-id=\"f6dd176\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5fc688e elementor-widget elementor-widget-html\" data-id=\"5fc688e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ba-hero-v4\" aria-labelledby=\"ba-hero-title\">\n\n    <div class=\"ba-hero-v4__inner\">\n\n\n        <!-- ================================================\n             LEFT CONTENT\n        ================================================= -->\n\n        <div class=\"ba-hero-v4__content\">\n\n\n            <!-- EYEBROW -->\n\n            <div class=\"ba-hero-v4__eyebrow\">\n\n                <span\n                    class=\"ba-hero-v4__eyebrow-line\"\n                    aria-hidden=\"true\"\n                ><\/span>\n\n                <span>\n                    WordPress &amp; WooCommerce Developer\n                <\/span>\n\n            <\/div>\n\n\n            <!-- TITLE -->\n\n            <h1\n                class=\"ba-hero-v4__title\"\n                id=\"ba-hero-title\"\n            >\n                WordPress websites\n                built for real businesses.\n            <\/h1>\n\n\n            <!-- DESCRIPTION -->\n\n            <p class=\"ba-hero-v4__description\">\n                I'm Brayan Angarita, a WordPress &amp; WooCommerce\n                Developer based in Bogot\u00e1. I build, maintain and improve\n                websites and e-commerce stores for businesses, agencies\n                and marketing teams.\n            <\/p>\n\n\n            <!-- ACTIONS -->\n\n            <div class=\"ba-hero-v4__actions\">\n\n                <a\n                    href=\"#work\"\n                    class=\"ba-hero-v4__primary\"\n                >\n                    <span>\n                        View selected 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\n                <a\n                    href=\"#contact\"\n                    class=\"ba-hero-v4__secondary\"\n                >\n                    <span>\n                        Contact me\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\n\n\n        <!-- ================================================\n             PORTRAIT\n        ================================================= -->\n\n        <div class=\"ba-hero-v4__visual\">\n\n            <div class=\"ba-hero-v4__portrait\">\n\n                <div\n                    class=\"ba-hero-v4__portrait-accent\"\n                    aria-hidden=\"true\"\n                ><\/div>\n\n                <img fetchpriority=\"high\"\n                    src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/Red-Gradient-Profile-Photo-Instagram-Post-1.jpg\"\n                    alt=\"Brayan Angarita\"\n                    width=\"720\"\n                    height=\"900\"\n                    loading=\"eager\"\n                    fetchpriority=\"high\"\n                    decoding=\"async\"\n                >\n\n            <\/div>\n\n        <\/div>\n\n\n    <\/div>\n\n<\/section>\n\n\n<style>\n\n\/* =========================================================\n   HERO V4\n========================================================= *\/\n\n.ba-hero-v4,\n.ba-hero-v4 * {\n    box-sizing:\n        border-box;\n}\n\n\n.ba-hero-v4 {\n    width:\n        100%;\n\n    background:\n        var(--ba-bg);\n\n    color:\n        var(--ba-text);\n}\n\n\n\n\/* =========================================================\n   DESKTOP LAYOUT\n========================================================= *\/\n\n.ba-hero-v4__inner {\n    display:\n        grid;\n\n    grid-template-columns:\n        minmax(0, 1.52fr)\n        minmax(300px, .72fr);\n\n    align-items:\n        center;\n\n    column-gap:\n        76px;\n\n    width:\n        100%;\n\n    max-width:\n        var(--ba-content-max, 1140px);\n\n    min-height:\n        570px;\n\n    margin:\n        0 auto;\n\n    padding:\n        0;\n}\n\n\n\n\/* =========================================================\n   LEFT CONTENT\n\n   The complete block is vertically centered against\n   the portrait on desktop.\n========================================================= *\/\n\n.ba-hero-v4__content {\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    justify-content:\n        center;\n\n    min-width:\n        0;\n}\n\n\n\n\/* =========================================================\n   EYEBROW\n========================================================= *\/\n\n.ba-hero-v4__eyebrow {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        12px;\n\n    margin-bottom:\n        21px;\n\n    color:\n        var(--ba-accent);\n\n    font-family:\n        inherit;\n\n    font-size:\n        12px;\n\n    font-weight:\n        700;\n\n    line-height:\n        1.25;\n\n    letter-spacing:\n        .10em;\n\n    text-transform:\n        uppercase;\n\n    transition:\n        color\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n.ba-hero-v4__eyebrow-line {\n    display:\n        block;\n\n    flex:\n        0 0 32px;\n\n    width:\n        32px;\n\n    height:\n        2px;\n\n    background:\n        var(--ba-accent);\n\n    transition:\n        background-color\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n\n\/* =========================================================\n   TITLE\n========================================================= *\/\n\n.ba-hero-v4__title {\n    max-width:\n        720px;\n\n    margin:\n        0;\n\n    color:\n        var(--ba-text) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        clamp(52px, 5.25vw, 74px);\n\n    font-weight:\n        600;\n\n    line-height:\n        .99;\n\n    letter-spacing:\n        -.055em;\n\n    text-wrap:\n        balance;\n\n    transition:\n        color\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n\n\/* =========================================================\n   DESCRIPTION\n========================================================= *\/\n\n.ba-hero-v4__description {\n    max-width:\n        650px;\n\n    margin:\n        30px 0 0 !important;\n\n    color:\n        var(--ba-text-soft) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        17px;\n\n    font-weight:\n        400;\n\n    line-height:\n        1.7;\n\n    transition:\n        color\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n\n\/* =========================================================\n   ACTIONS\n========================================================= *\/\n\n.ba-hero-v4__actions {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        22px;\n\n    margin-top:\n        30px;\n}\n\n\n\n\/* =========================================================\n   PRIMARY CTA\n========================================================= *\/\n\n.ba-hero-v4__primary {\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    gap:\n        12px;\n\n    min-height:\n        48px;\n\n    padding:\n        11px 18px;\n\n    border:\n        1px solid\n        var(--ba-accent-fill);\n\n    border-radius:\n        var(--ba-radius-sm, 8px) !important;\n\n    background:\n        var(--ba-accent-fill);\n\n    color:\n        var(--ba-on-accent) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        14px;\n\n    font-weight:\n        650;\n\n    line-height:\n        1;\n\n    text-decoration:\n        none !important;\n\n    transition:\n        background-color\n        var(--ba-transition-fast, .16s ease),\n\n        border-color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-hero-v4__primary:hover {\n    background:\n        var(--ba-accent-fill-hover);\n\n    border-color:\n        var(--ba-accent-fill-hover);\n\n    color:\n        var(--ba-on-accent) !important;\n}\n\n\n\n\/* =========================================================\n   CTA ICONS\n========================================================= *\/\n\n.ba-hero-v4__primary svg,\n.ba-hero-v4__secondary svg {\n    display:\n        block;\n\n    width:\n        15px;\n\n    height:\n        15px;\n\n    flex:\n        0 0 auto;\n\n    fill:\n        none;\n\n    stroke:\n        currentColor;\n\n    stroke-width:\n        2;\n\n    stroke-linecap:\n        round;\n\n    stroke-linejoin:\n        round;\n\n    transition:\n        transform\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-hero-v4__primary:hover svg,\n.ba-hero-v4__secondary:hover svg {\n    transform:\n        translateX(3px);\n}\n\n\n\n\/* =========================================================\n   SECONDARY CTA\n========================================================= *\/\n\n.ba-hero-v4__secondary {\n    position:\n        relative;\n\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    gap:\n        8px;\n\n    min-height:\n        48px;\n\n    padding:\n        0 2px;\n\n    color:\n        var(--ba-text) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        14px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1;\n\n    text-decoration:\n        none !important;\n\n    transition:\n        color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-hero-v4__secondary::after {\n    content:\n        \"\";\n\n    position:\n        absolute;\n\n    right:\n        2px;\n\n    bottom:\n        7px;\n\n    left:\n        2px;\n\n    height:\n        1px;\n\n    background:\n        var(--ba-border);\n\n    transition:\n        background-color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-hero-v4__secondary:hover {\n    color:\n        var(--ba-accent) !important;\n}\n\n\n.ba-hero-v4__secondary:hover::after {\n    background:\n        var(--ba-accent);\n}\n\n\n\n\/* =========================================================\n   VISUAL\n========================================================= *\/\n\n.ba-hero-v4__visual {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        flex-end;\n\n    min-width:\n        0;\n}\n\n\n\n\/* =========================================================\n   PORTRAIT\n========================================================= *\/\n\n.ba-hero-v4__portrait {\n    position:\n        relative;\n\n    width:\n        100%;\n\n    max-width:\n        350px;\n\n    aspect-ratio:\n        4 \/ 5;\n\n    overflow:\n        hidden;\n\n    border:\n        1px solid\n        var(--ba-border);\n\n    border-radius:\n        var(--ba-radius-md, 12px);\n\n    background:\n        linear-gradient(\n            145deg,\n            var(--ba-accent-soft),\n            var(--ba-surface-2) 72%\n        );\n\n    box-shadow:\n        var(--ba-shadow);\n\n    isolation:\n        isolate;\n\n    transition:\n        border-color\n        var(--ba-transition-theme, .18s ease),\n\n        background-color\n        var(--ba-transition-theme, .18s ease),\n\n        box-shadow\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n.ba-hero-v4__portrait-accent {\n    position:\n        absolute;\n\n    z-index:\n        -1;\n\n    top:\n        44px;\n\n    left:\n        50%;\n\n    width:\n        260px;\n\n    height:\n        260px;\n\n    border-radius:\n        50%;\n\n    background:\n        rgba(\n            var(--ba-accent-rgb),\n            .20\n        );\n\n    transform:\n        translateX(-50%);\n}\n\n\n.ba-hero-v4__portrait img {\n    position:\n        absolute;\n\n    inset:\n        0;\n\n    display:\n        block;\n\n    width:\n        100%;\n\n    height:\n        100%;\n\n    margin:\n        0;\n\n    object-fit:\n        cover;\n\n    object-position:\n        center top;\n\n    border-radius:\n        0 !important;\n}\n\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (max-width: 960px) {\n\n    .ba-hero-v4__inner {\n        grid-template-columns:\n            minmax(0, 1.15fr)\n            minmax(250px, .75fr);\n\n        column-gap:\n            44px;\n\n        min-height:\n            550px;\n    }\n\n\n    .ba-hero-v4__title {\n        font-size:\n            clamp(46px, 6vw, 60px);\n    }\n\n\n    .ba-hero-v4__portrait {\n        max-width:\n            310px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (max-width: 720px) {\n\n    .ba-hero-v4__inner {\n        grid-template-columns:\n            1fr;\n\n        gap:\n            0;\n\n        width:\n            100%;\n\n        min-height:\n            0;\n\n        padding:\n            42px 0 46px;\n    }\n\n\n    .ba-hero-v4__content {\n        display:\n            contents;\n    }\n\n\n    \/* Eyebrow *\/\n\n    .ba-hero-v4__eyebrow {\n        grid-row:\n            1;\n\n        margin-bottom:\n            17px;\n\n        gap:\n            9px;\n\n        font-size:\n            10px;\n\n        letter-spacing:\n            .08em;\n    }\n\n\n    .ba-hero-v4__eyebrow-line {\n        width:\n            23px;\n\n        flex-basis:\n            23px;\n    }\n\n\n    \/* Title *\/\n\n    .ba-hero-v4__title {\n        grid-row:\n            2;\n\n        max-width:\n            600px;\n\n        font-size:\n            clamp(40px, 11.5vw, 52px);\n\n        line-height:\n            1;\n\n        letter-spacing:\n            -.047em;\n    }\n\n\n    \/* Image *\/\n\n    .ba-hero-v4__visual {\n        grid-row:\n            3;\n\n        display:\n            block;\n\n        width:\n            100%;\n\n        margin-top:\n            27px;\n    }\n\n\n    .ba-hero-v4__portrait {\n        width:\n            100%;\n\n        max-width:\n            none;\n\n        height:\n            clamp(175px, 52vw, 215px);\n\n        aspect-ratio:\n            auto;\n    }\n\n\n    .ba-hero-v4__portrait img {\n        object-position:\n            center 26%;\n    }\n\n\n    .ba-hero-v4__portrait-accent {\n        width:\n            190px;\n\n        height:\n            190px;\n\n        top:\n            -5px;\n\n        opacity:\n            .8;\n    }\n\n\n    \/* Description *\/\n\n    .ba-hero-v4__description {\n        grid-row:\n            4;\n\n        max-width:\n            none;\n\n        margin:\n            24px 0 0 !important;\n\n        font-size:\n            15.5px;\n\n        line-height:\n            1.65;\n    }\n\n\n    \/* Actions *\/\n\n    .ba-hero-v4__actions {\n        grid-row:\n            5;\n\n        margin-top:\n            27px;\n    }\n\n\n    .ba-hero-v4__primary {\n        min-height:\n            46px;\n\n        padding:\n            10px 16px;\n    }\n\n\n    .ba-hero-v4__secondary {\n        min-height:\n            42px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 480px) {\n\n    .ba-hero-v4__inner {\n        padding:\n            34px 0 40px;\n    }\n\n\n    .ba-hero-v4__eyebrow {\n        margin-bottom:\n            15px;\n\n        font-size:\n            9px;\n    }\n\n\n    .ba-hero-v4__eyebrow-line {\n        width:\n            18px;\n\n        flex-basis:\n            18px;\n    }\n\n\n    .ba-hero-v4__title {\n        font-size:\n            clamp(38px, 11.4vw, 44px);\n\n        line-height:\n            1.01;\n    }\n\n\n    .ba-hero-v4__visual {\n        margin-top:\n            23px;\n    }\n\n\n    .ba-hero-v4__portrait {\n        height:\n            clamp(160px, 52vw, 190px);\n    }\n\n\n    .ba-hero-v4__portrait img {\n        object-position:\n            center 24%;\n    }\n\n\n    .ba-hero-v4__description {\n        margin-top:\n            21px !important;\n\n        font-size:\n            15px;\n\n        line-height:\n            1.62;\n    }\n\n\n    .ba-hero-v4__actions {\n        display:\n            grid;\n\n        grid-template-columns:\n            1fr auto;\n\n        align-items:\n            center;\n\n        gap:\n            18px;\n\n        width:\n            100%;\n\n        margin-top:\n            25px;\n    }\n\n\n    .ba-hero-v4__primary {\n        width:\n            100%;\n\n        min-width:\n            0;\n\n        padding:\n            10px 14px;\n    }\n\n\n    .ba-hero-v4__secondary {\n        white-space:\n            nowrap;\n    }\n\n}\n\n\n\n\/* =========================================================\n   VERY SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 360px) {\n\n    .ba-hero-v4__title {\n        font-size:\n            36px;\n    }\n\n\n    .ba-hero-v4__actions {\n        grid-template-columns:\n            1fr;\n    }\n\n\n    .ba-hero-v4__secondary {\n        justify-self:\n            start;\n    }\n\n}\n\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    .ba-hero-v4 *,\n    .ba-hero-v4 *::before,\n    .ba-hero-v4 *::after {\n        transition:\n            none !important;\n    }\n\n}\n\n<\/style>\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-cfa6a28 e-flex e-con-boxed e-con e-parent\" data-id=\"cfa6a28\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9dd879d elementor-widget elementor-widget-html\" data-id=\"9dd879d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section\n    class=\"ba-credibility\"\n    aria-label=\"Professional credibility\"\n>\n\n    <div class=\"ba-credibility__grid\">\n\n\n        <!-- EXPERIENCE -->\n        <article class=\"ba-proof-card\">\n\n            <div class=\"ba-proof-card__value\">\n                3<span>+<\/span>\n            <\/div>\n\n            <p class=\"ba-proof-card__label\">\n                Years of experience\n            <\/p>\n\n        <\/article>\n\n\n        <!-- PROJECTS -->\n        <article class=\"ba-proof-card\">\n\n            <div class=\"ba-proof-card__value\">\n                41<span>+<\/span>\n            <\/div>\n\n            <p class=\"ba-proof-card__label\">\n                Projects completed\n            <\/p>\n\n        <\/article>\n\n\n        <!-- RATING -->\n        <article class=\"ba-proof-card\">\n\n            <div\n                class=\"\n                    ba-proof-card__value\n                    ba-proof-card__value--rating\n                \"\n            >\n                4.98<span>\/5<\/span>\n            <\/div>\n\n            <p class=\"ba-proof-card__label\">\n                Client rating\n            <\/p>\n\n        <\/article>\n\n\n        <!-- WORKANA -->\n        <article class=\"ba-proof-card\">\n\n            <div\n                class=\"\n                    ba-proof-card__value\n                    ba-proof-card__value--text\n                \"\n            >\n                Platinum\n            <\/div>\n\n            <p class=\"ba-proof-card__label\">\n                Workana level\n            <\/p>\n\n        <\/article>\n\n\n    <\/div>\n\n<\/section>\n\n\n<style>\n\n\/* =========================================================\n   CREDIBILITY\n========================================================= *\/\n\n.ba-credibility,\n.ba-credibility * {\n    box-sizing: border-box;\n}\n\n\n.ba-credibility {\n    width:\n        100%;\n\n    max-width:\n        var(--ba-content-max, 1140px);\n\n    margin:\n        0 auto;\n\n    padding:\n        0;\n}\n\n\n\n\/* =========================================================\n   GRID\n========================================================= *\/\n\n.ba-credibility__grid {\n    display:\n        grid;\n\n    grid-template-columns:\n        repeat(4, minmax(0, 1fr));\n\n    gap:\n        16px;\n\n    width:\n        100%;\n}\n\n\n\n\/* =========================================================\n   CARD\n========================================================= *\/\n\n.ba-credibility .ba-proof-card {\n    position:\n        relative;\n\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    align-items:\n        flex-start;\n\n    justify-content:\n        center;\n\n    min-width:\n        0;\n\n    min-height:\n        150px;\n\n    padding:\n        25px 26px;\n\n    overflow:\n        hidden;\n\n    border:\n        1px solid\n        var(--ba-border);\n\n    border-radius:\n        var(--ba-radius-md, 12px) !important;\n\n    background:\n        var(--ba-surface) !important;\n\n    box-shadow:\n        var(--ba-shadow-soft);\n\n    transition:\n        transform\n        var(--ba-transition-fast, .16s ease),\n\n        background-color\n        var(--ba-transition-theme, .18s ease),\n\n        border-color\n        var(--ba-transition-theme, .18s ease),\n\n        box-shadow\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n\n\/* Subtle accent at top *\/\n\n.ba-credibility .ba-proof-card::before {\n    content:\n        \"\";\n\n    position:\n        absolute;\n\n    top:\n        0;\n\n    left:\n        24px;\n\n    width:\n        34px;\n\n    height:\n        2px;\n\n    border-radius:\n        0 0 2px 2px;\n\n    background:\n        var(--ba-accent);\n\n    opacity:\n        .55;\n\n    transform:\n        scaleX(.65);\n\n    transform-origin:\n        left center;\n\n    transition:\n        opacity\n        var(--ba-transition-fast, .16s ease),\n\n        transform\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n\n\/* =========================================================\n   HOVER\n========================================================= *\/\n\n.ba-credibility .ba-proof-card:hover {\n    transform:\n        translateY(-2px);\n\n    border-color:\n        var(--ba-accent-border) !important;\n\n    background:\n        var(--ba-surface-hover) !important;\n\n    box-shadow:\n        var(--ba-shadow);\n}\n\n\n.ba-credibility .ba-proof-card:hover::before {\n    opacity:\n        1;\n\n    transform:\n        scaleX(1);\n}\n\n\n\n\/* =========================================================\n   VALUE\n========================================================= *\/\n\n.ba-credibility .ba-proof-card__value {\n    margin:\n        0 0 13px;\n\n    color:\n        var(--ba-text) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        clamp(42px, 3.7vw, 56px);\n\n    font-weight:\n        700;\n\n    line-height:\n        .95;\n\n    letter-spacing:\n        -.05em;\n\n    white-space:\n        nowrap;\n\n    transition:\n        color\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n\n\/* Accent part *\/\n\n.ba-credibility .ba-proof-card__value span {\n    color:\n        var(--ba-accent) !important;\n}\n\n\n\n\/* =========================================================\n   RATING\n========================================================= *\/\n\n.ba-credibility\n.ba-proof-card__value--rating {\n    font-size:\n        clamp(39px, 3.35vw, 52px);\n}\n\n\n\n\/* =========================================================\n   PLATINUM\n========================================================= *\/\n\n.ba-credibility\n.ba-proof-card__value--text {\n    color:\n        var(--ba-accent) !important;\n\n    font-size:\n        clamp(31px, 2.75vw, 40px);\n\n    letter-spacing:\n        -.04em;\n}\n\n\n\n\/* =========================================================\n   LABEL\n========================================================= *\/\n\n.ba-credibility .ba-proof-card__label {\n    margin:\n        0;\n\n    color:\n        var(--ba-text-muted) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        15px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.45;\n\n    transition:\n        color\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n.ba-credibility .ba-proof-card:hover\n.ba-proof-card__label {\n    color:\n        var(--ba-text-soft) !important;\n}\n\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (max-width: 1024px) {\n\n    .ba-credibility__grid {\n        grid-template-columns:\n            repeat(2, minmax(0, 1fr));\n\n        gap:\n            14px;\n    }\n\n\n    .ba-credibility .ba-proof-card {\n        min-height:\n            145px;\n\n        padding:\n            24px;\n    }\n\n\n    .ba-credibility .ba-proof-card__value {\n        font-size:\n            48px;\n    }\n\n\n    .ba-credibility\n    .ba-proof-card__value--rating {\n        font-size:\n            44px;\n    }\n\n\n    .ba-credibility\n    .ba-proof-card__value--text {\n        font-size:\n            36px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (max-width: 600px) {\n\n    .ba-credibility__grid {\n        grid-template-columns:\n            repeat(2, minmax(0, 1fr));\n\n        gap:\n            10px;\n    }\n\n\n    .ba-credibility .ba-proof-card {\n        min-height:\n            125px;\n\n        padding:\n            20px 17px;\n    }\n\n\n    .ba-credibility .ba-proof-card::before {\n        left:\n            17px;\n\n        width:\n            26px;\n    }\n\n\n    .ba-credibility .ba-proof-card__value {\n        margin-bottom:\n            10px;\n\n        font-size:\n            38px;\n    }\n\n\n    .ba-credibility\n    .ba-proof-card__value--rating {\n        font-size:\n            32px;\n    }\n\n\n    .ba-credibility\n    .ba-proof-card__value--text {\n        font-size:\n            27px;\n    }\n\n\n    .ba-credibility .ba-proof-card__label {\n        font-size:\n            13px;\n\n        line-height:\n            1.35;\n    }\n\n}\n\n\n\n\/* =========================================================\n   VERY SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 360px) {\n\n    .ba-credibility .ba-proof-card {\n        min-height:\n            118px;\n\n        padding:\n            18px 14px;\n    }\n\n\n    .ba-credibility .ba-proof-card__value {\n        font-size:\n            34px;\n    }\n\n\n    .ba-credibility\n    .ba-proof-card__value--rating {\n        font-size:\n            29px;\n    }\n\n\n    .ba-credibility\n    .ba-proof-card__value--text {\n        font-size:\n            24px;\n    }\n\n\n    .ba-credibility .ba-proof-card__label {\n        font-size:\n            12px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    .ba-credibility .ba-proof-card,\n    .ba-credibility .ba-proof-card::before {\n        transition:\n            none !important;\n    }\n\n\n    .ba-credibility .ba-proof-card:hover {\n        transform:\n            none;\n    }\n\n}\n\n<\/style>\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-5aaa634 e-flex e-con-boxed e-con e-parent\" data-id=\"5aaa634\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2f4b93b elementor-widget elementor-widget-html\" data-id=\"2f4b93b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section\n    class=\"ba-experience-v2\"\n    id=\"experience\"\n    aria-labelledby=\"ba-experience-title\"\n>\n\n    <!-- =====================================================\n         HEADER\n    ====================================================== -->\n\n    <div class=\"ba-experience-v2__header\">\n\n        <div class=\"ba-experience-v2__heading\">\n\n            <div class=\"ba-experience-v2__eyebrow\">\n\n                <span\n                    class=\"ba-experience-v2__eyebrow-line\"\n                    aria-hidden=\"true\"\n                ><\/span>\n\n                <span>\n                    Career\n                <\/span>\n\n            <\/div>\n\n\n            <h2\n                class=\"ba-experience-v2__title\"\n                id=\"ba-experience-title\"\n            >\n                Professional Experience\n            <\/h2>\n\n        <\/div>\n\n\n        <!-- Replace # with final CV URL -->\n\n        <a\n            href=\"#\"\n            class=\"ba-experience-v2__resume\"\n            target=\"_blank\"\n            rel=\"noopener\"\n        >\n            Download CV\n\n            <svg\n                viewBox=\"0 0 24 24\"\n                aria-hidden=\"true\"\n            >\n                <path d=\"M7 17 17 7\"><\/path>\n                <path d=\"M8 7h9v9\"><\/path>\n            <\/svg>\n        <\/a>\n\n    <\/div>\n\n\n\n    <!-- =====================================================\n         TIMELINE\n    ====================================================== -->\n\n    <div class=\"ba-experience-v2__timeline\">\n\n\n        <!-- =================================================\n             ABADESA\n        ================================================== -->\n\n        <article class=\"ba-experience-v2__item is-current\">\n\n            <div class=\"ba-experience-v2__marker\">\n                <span><\/span>\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__info\">\n\n                <h3>\n                    WordPress Developer &amp;\n                    Post-Production Support\n                <\/h3>\n\n\n                <a\n                    href=\"#\"\n                    class=\"ba-experience-v2__company\"\n                >\n                    Abadesa Export Center\n                <\/a>\n\n\n                <div class=\"ba-experience-v2__meta\">\n\n                    <span class=\"ba-experience-v2__date\">\n                        Sep 2025 \u2014 Present\n                    <\/span>\n\n                    <span class=\"ba-experience-v2__status\">\n                        Current\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__description\">\n\n                <p>\n                    WordPress developer working on websites delivered through\n                    Spain's Kit Digital program. My role combines WordPress\n                    website development with post-production support, helping\n                    with implementation and continued support after each site's\n                    initial development stage.\n                <\/p>\n\n            <\/div>\n\n        <\/article>\n\n\n\n        <!-- =================================================\n             ROSTAGNOL\n        ================================================== -->\n\n        <article class=\"ba-experience-v2__item is-current\">\n\n            <div class=\"ba-experience-v2__marker\">\n                <span><\/span>\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__info\">\n\n                <h3>\n                    Web Developer, Technical Support\n                    &amp; Project Manager\n                <\/h3>\n\n\n                <a\n                    href=\"#\"\n                    class=\"ba-experience-v2__company\"\n                >\n                    Rostagnol Media\n                <\/a>\n\n\n                <div class=\"ba-experience-v2__meta\">\n\n                    <span class=\"ba-experience-v2__date\">\n                        Dec 2023 \u2014 Present\n                    <\/span>\n\n                    <span class=\"ba-experience-v2__status\">\n                        Current\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__description\">\n\n                <p>\n                    Web developer and project manager for a marketing and\n                    advertising agency. My responsibilities include website\n                    development, WordPress maintenance, technical support,\n                    email marketing and project management, supporting both\n                    the implementation and ongoing operation of digital projects.\n                <\/p>\n\n            <\/div>\n\n        <\/article>\n\n\n\n        <!-- =================================================\n             NACER DIGITAL\n        ================================================== -->\n\n        <article class=\"ba-experience-v2__item\">\n\n            <div class=\"ba-experience-v2__marker\">\n                <span><\/span>\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__info\">\n\n                <h3>\n                    WordPress Developer\n                <\/h3>\n\n\n                <a\n                    href=\"#\"\n                    class=\"ba-experience-v2__company\"\n                >\n                    Nacer Digital\n                <\/a>\n\n\n                <div class=\"ba-experience-v2__meta\">\n\n                    <span class=\"ba-experience-v2__date\">\n                        Apr 2025 \u2014 Nov 2025\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__description\">\n\n                <p>\n                    Worked as a web developer focused on WordPress website\n                    implementation. My role centered on building sites according\n                    to the requirements of the agency's projects and supporting\n                    their delivery.\n                <\/p>\n\n            <\/div>\n\n        <\/article>\n\n\n\n        <!-- =================================================\n             FUNNEL GROWTH\n        ================================================== -->\n\n        <article class=\"ba-experience-v2__item\">\n\n            <div class=\"ba-experience-v2__marker\">\n                <span><\/span>\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__info\">\n\n                <h3>\n                    Operations Lead \u00b7 WordPress\n                    Designer &amp; Developer\n                <\/h3>\n\n\n                <a\n                    href=\"#\"\n                    class=\"ba-experience-v2__company\"\n                >\n                    Funnel Growth F\u00f3rmula Marketing Agency\n                <\/a>\n\n\n                <div class=\"ba-experience-v2__meta\">\n\n                    <span class=\"ba-experience-v2__date\">\n                        May 2024 \u2014 Sep 2024\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div class=\"ba-experience-v2__description\">\n\n                <p>\n                    Worked as Operations Lead while also taking responsibility\n                    for WordPress web design and development. The position\n                    combined operational coordination with the creation and\n                    implementation of websites for the agency's digital projects.\n                <\/p>\n\n            <\/div>\n\n        <\/article>\n\n\n    <\/div>\n\n<\/section>\n\n\n\n<style>\n\n\/* =========================================================\n   EXPERIENCE V2\n========================================================= *\/\n\n.ba-experience-v2,\n.ba-experience-v2 * {\n    box-sizing:\n        border-box;\n}\n\n\n.ba-experience-v2 {\n    width:\n        100%;\n\n    max-width:\n        var(--ba-content-max, 1140px);\n\n    margin:\n        0 auto;\n\n    padding:\n        76px 0;\n\n    color:\n        var(--ba-text);\n}\n\n\n\n\/* =========================================================\n   HEADER\n========================================================= *\/\n\n.ba-experience-v2__header {\n    display:\n        flex;\n\n    align-items:\n        flex-end;\n\n    justify-content:\n        space-between;\n\n    gap:\n        32px;\n\n    margin-bottom:\n        56px;\n}\n\n\n.ba-experience-v2__heading {\n    min-width:\n        0;\n}\n\n\n\n\/* =========================================================\n   EYEBROW\n========================================================= *\/\n\n.ba-experience-v2__eyebrow {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        10px;\n\n    margin-bottom:\n        14px;\n\n    color:\n        var(--ba-accent);\n\n    font-size:\n        11px;\n\n    font-weight:\n        700;\n\n    line-height:\n        1;\n\n    letter-spacing:\n        .12em;\n\n    text-transform:\n        uppercase;\n}\n\n\n.ba-experience-v2__eyebrow-line {\n    display:\n        block;\n\n    width:\n        28px;\n\n    height:\n        2px;\n\n    flex:\n        0 0 28px;\n\n    background:\n        var(--ba-accent);\n}\n\n\n\n\/* =========================================================\n   TITLE\n========================================================= *\/\n\n.ba-experience-v2__title {\n    margin:\n        0;\n\n    color:\n        var(--ba-text) !important;\n\n    font-family:\n        inherit;\n\n    font-size:\n        clamp(38px, 4vw, 52px);\n\n    font-weight:\n        650;\n\n    line-height:\n        1.06;\n\n    letter-spacing:\n        -.04em;\n}\n\n\n\n\/* =========================================================\n   DOWNLOAD CV\n========================================================= *\/\n\n.ba-experience-v2__resume {\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    gap:\n        8px;\n\n    flex:\n        0 0 auto;\n\n    padding-bottom:\n        3px;\n\n    color:\n        var(--ba-text-muted) !important;\n\n    font-size:\n        13px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1;\n\n    text-decoration:\n        none !important;\n\n    transition:\n        color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-experience-v2__resume svg {\n    width:\n        14px;\n\n    height:\n        14px;\n\n    fill:\n        none;\n\n    stroke:\n        var(--ba-accent);\n\n    stroke-width:\n        1.8;\n\n    stroke-linecap:\n        round;\n\n    stroke-linejoin:\n        round;\n\n    transition:\n        transform\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-experience-v2__resume:hover {\n    color:\n        var(--ba-text) !important;\n}\n\n\n.ba-experience-v2__resume:hover svg {\n    transform:\n        translate(2px, -2px);\n}\n\n\n\n\/* =========================================================\n   TIMELINE\n========================================================= *\/\n\n.ba-experience-v2__timeline {\n    position:\n        relative;\n}\n\n\n\n\/* Timeline line *\/\n\n.ba-experience-v2__timeline::before {\n    content:\n        \"\";\n\n    position:\n        absolute;\n\n    top:\n        9px;\n\n    bottom:\n        9px;\n\n    left:\n        7px;\n\n    width:\n        1px;\n\n    background:\n        linear-gradient(\n            to bottom,\n            var(--ba-accent) 0%,\n            var(--ba-border) 7%,\n            var(--ba-border) 93%,\n            transparent 100%\n        );\n}\n\n\n\n\/* =========================================================\n   ITEM\n========================================================= *\/\n\n.ba-experience-v2__item {\n    position:\n        relative;\n\n    display:\n        grid;\n\n    grid-template-columns:\n        16px\n        minmax(285px, .86fr)\n        minmax(0, 1.25fr);\n\n    column-gap:\n        38px;\n\n    padding-bottom:\n        58px;\n}\n\n\n.ba-experience-v2__item:last-child {\n    padding-bottom:\n        0;\n}\n\n\n\n\/* =========================================================\n   MARKER\n========================================================= *\/\n\n.ba-experience-v2__marker {\n    position:\n        relative;\n\n    z-index:\n        2;\n\n    display:\n        flex;\n\n    justify-content:\n        center;\n\n    padding-top:\n        7px;\n}\n\n\n.ba-experience-v2__marker span {\n    position:\n        relative;\n\n    display:\n        block;\n\n    width:\n        11px;\n\n    height:\n        11px;\n\n    border:\n        2px solid\n        var(--ba-bg);\n\n    border-radius:\n        50%;\n\n    background:\n        var(--ba-accent);\n\n    box-shadow:\n        0 0 0 4px\n        var(--ba-accent-soft);\n\n    transition:\n        transform\n        var(--ba-transition-fast, .16s ease),\n\n        box-shadow\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-experience-v2__item:hover\n.ba-experience-v2__marker span {\n    transform:\n        scale(1.1);\n\n    box-shadow:\n        0 0 0 5px\n        var(--ba-accent-soft);\n}\n\n\n\n\/* =========================================================\n   CURRENT POSITION PULSE\n========================================================= *\/\n\n.ba-experience-v2__item.is-current\n.ba-experience-v2__marker span::after {\n    content:\n        \"\";\n\n    position:\n        absolute;\n\n    top:\n        50%;\n\n    left:\n        50%;\n\n    width:\n        11px;\n\n    height:\n        11px;\n\n    border:\n        1px solid\n        var(--ba-accent);\n\n    border-radius:\n        50%;\n\n    transform:\n        translate(-50%, -50%);\n\n    animation:\n        ba-experience-v2-pulse\n        2.8s\n        ease-out\n        infinite;\n\n    pointer-events:\n        none;\n}\n\n\n@keyframes ba-experience-v2-pulse {\n\n    0% {\n        width:\n            11px;\n\n        height:\n            11px;\n\n        opacity:\n            .65;\n    }\n\n\n    75%,\n    100% {\n        width:\n            34px;\n\n        height:\n            34px;\n\n        opacity:\n            0;\n    }\n\n}\n\n\n\n\/* =========================================================\n   POSITION INFO\n========================================================= *\/\n\n.ba-experience-v2__info {\n    min-width:\n        0;\n}\n\n\n.ba-experience-v2__info h3 {\n    max-width:\n        360px;\n\n    margin:\n        0 0 8px;\n\n    color:\n        var(--ba-text) !important;\n\n    font-size:\n        18px;\n\n    font-weight:\n        650;\n\n    line-height:\n        1.35;\n\n    letter-spacing:\n        -.018em;\n\n    transition:\n        color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-experience-v2__item:hover\n.ba-experience-v2__info h3 {\n    color:\n        var(--ba-text) !important;\n}\n\n\n\n\/* =========================================================\n   COMPANY\n========================================================= *\/\n\n.ba-experience-v2__company {\n    display:\n        inline-block;\n\n    margin-bottom:\n        7px;\n\n    color:\n        var(--ba-accent) !important;\n\n    font-size:\n        13px;\n\n    font-weight:\n        650;\n\n    line-height:\n        1.4;\n\n    text-decoration:\n        none !important;\n\n    transition:\n        color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-experience-v2__company:hover {\n    color:\n        var(--ba-accent-hover) !important;\n}\n\n\n\n\/* =========================================================\n   META\n========================================================= *\/\n\n.ba-experience-v2__meta {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    flex-wrap:\n        wrap;\n\n    gap:\n        9px;\n}\n\n\n.ba-experience-v2__date {\n    color:\n        var(--ba-text-muted);\n\n    font-size:\n        12px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.4;\n}\n\n\n\n\/* =========================================================\n   CURRENT BADGE\n========================================================= *\/\n\n.ba-experience-v2__status {\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    min-height:\n        22px;\n\n    padding:\n        5px 8px !important;\n\n    border:\n        1px solid\n        var(--ba-accent-border) !important;\n\n    border-radius:\n        var(--ba-radius-xs, 6px) !important;\n\n    background:\n        var(--ba-accent-soft) !important;\n\n    color:\n        var(--ba-accent) !important;\n\n    font-size:\n        9px;\n\n    font-weight:\n        700;\n\n    line-height:\n        1;\n\n    letter-spacing:\n        .06em;\n\n    text-transform:\n        uppercase;\n}\n\n\n\n\/* =========================================================\n   DESCRIPTION\n========================================================= *\/\n\n.ba-experience-v2__description {\n    max-width:\n        610px;\n\n    padding-top:\n        0;\n}\n\n\n.ba-experience-v2__description p {\n    margin:\n        0;\n\n    color:\n        var(--ba-text-soft) !important;\n\n    font-size:\n        15px;\n\n    font-weight:\n        400;\n\n    line-height:\n        1.75;\n\n    letter-spacing:\n        -.003em;\n}\n\n\n\n\/* =========================================================\n   SUBTLE ROW DIVIDER\n========================================================= *\/\n\n.ba-experience-v2__item::after {\n    content:\n        \"\";\n\n    position:\n        absolute;\n\n    right:\n        0;\n\n    bottom:\n        29px;\n\n    left:\n        54px;\n\n    height:\n        1px;\n\n    background:\n        var(--ba-border-soft);\n\n    opacity:\n        .55;\n}\n\n\n.ba-experience-v2__item:last-child::after {\n    display:\n        none;\n}\n\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (max-width: 1024px) {\n\n    .ba-experience-v2 {\n        padding:\n            68px 0;\n    }\n\n\n    .ba-experience-v2__item {\n        grid-template-columns:\n            16px\n            minmax(240px, .82fr)\n            minmax(0, 1.18fr);\n\n        column-gap:\n            28px;\n    }\n\n\n    .ba-experience-v2__info h3 {\n        font-size:\n            17px;\n    }\n\n\n    .ba-experience-v2__description p {\n        font-size:\n            14.5px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (max-width: 720px) {\n\n    .ba-experience-v2 {\n        padding:\n            52px 0;\n    }\n\n\n    .ba-experience-v2__header {\n        align-items:\n            flex-start;\n\n        flex-direction:\n            column;\n\n        gap:\n            17px;\n\n        margin-bottom:\n            42px;\n    }\n\n\n    .ba-experience-v2__title {\n        font-size:\n            clamp(34px, 10vw, 42px);\n    }\n\n\n    .ba-experience-v2__resume {\n        font-size:\n            12px;\n    }\n\n\n    .ba-experience-v2__item {\n        grid-template-columns:\n            15px\n            minmax(0, 1fr);\n\n        column-gap:\n            18px;\n\n        padding-bottom:\n            48px;\n    }\n\n\n    .ba-experience-v2__info {\n        grid-column:\n            2;\n\n        margin-bottom:\n            15px;\n    }\n\n\n    .ba-experience-v2__description {\n        grid-column:\n            2;\n\n        max-width:\n            none;\n    }\n\n\n    .ba-experience-v2__info h3 {\n        max-width:\n            none;\n\n        font-size:\n            18px;\n\n        line-height:\n            1.35;\n    }\n\n\n    .ba-experience-v2__company {\n        font-size:\n            13px;\n    }\n\n\n    .ba-experience-v2__date {\n        font-size:\n            12px;\n    }\n\n\n    .ba-experience-v2__description p {\n        font-size:\n            15px;\n\n        line-height:\n            1.7;\n    }\n\n\n    .ba-experience-v2__item::after {\n        right:\n            0;\n\n        bottom:\n            24px;\n\n        left:\n            33px;\n    }\n\n\n    .ba-experience-v2__timeline::before {\n        left:\n            6px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 420px) {\n\n    .ba-experience-v2 {\n        padding:\n            46px 0;\n    }\n\n\n    .ba-experience-v2__eyebrow {\n        font-size:\n            10px;\n    }\n\n\n    .ba-experience-v2__title {\n        font-size:\n            34px;\n    }\n\n\n    .ba-experience-v2__item {\n        column-gap:\n            15px;\n\n        padding-bottom:\n            44px;\n    }\n\n\n    .ba-experience-v2__info h3 {\n        font-size:\n            17px;\n    }\n\n\n    .ba-experience-v2__description p {\n        font-size:\n            14.5px;\n    }\n\n\n    .ba-experience-v2__status {\n        font-size:\n            8px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    .ba-experience-v2__item.is-current\n    .ba-experience-v2__marker span::after {\n        animation:\n            none;\n    }\n\n\n    .ba-experience-v2__marker span,\n    .ba-experience-v2__resume,\n    .ba-experience-v2__company,\n    .ba-experience-v2__info h3 {\n        transition:\n            none !important;\n    }\n\n}\n\n<\/style>\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-9048239 e-flex e-con-boxed e-con e-parent\" data-id=\"9048239\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ad04443 elementor-widget elementor-widget-html\" data-id=\"ad04443\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ba-technologies\" aria-label=\"Technologies and tools\">\n\n    <div class=\"ba-marquee\">\n\n        <div class=\"ba-marquee__track\">\n\n            <!-- ==================================================\n                 GROUP 1\n            =================================================== -->\n            <div class=\"ba-marquee__group\">\n\n                <!-- WordPress -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/wordpress\"\n                        alt=\"WordPress\"\n                        loading=\"lazy\"\n                    >\n                    <span>WordPress<\/span>\n                <\/div>\n\n                <!-- WooCommerce -->\n                <div class=\"ba-tech ba-tech--woocommerce\">\n                    <span class=\"ba-tech__woo-icon\" aria-hidden=\"true\">Woo<\/span>\n                    <span>WooCommerce<\/span>\n                <\/div>\n\n                <!-- Elementor -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/elementor\"\n                        alt=\"Elementor\"\n                        loading=\"lazy\"\n                    >\n                    <span>Elementor<\/span>\n                <\/div>\n\n                <!-- PHP -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/php\"\n                        alt=\"PHP\"\n                        loading=\"lazy\"\n                    >\n                    <span>PHP<\/span>\n                <\/div>\n\n                <!-- JavaScript -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/javascript\"\n                        alt=\"JavaScript\"\n                        loading=\"lazy\"\n                    >\n                    <span>JavaScript<\/span>\n                <\/div>\n\n                <!-- HTML -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/html5\"\n                        alt=\"HTML5\"\n                        loading=\"lazy\"\n                    >\n                    <span>HTML5<\/span>\n                <\/div>\n\n                <!-- CSS -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/css\"\n                        alt=\"CSS\"\n                        loading=\"lazy\"\n                    >\n                    <span>CSS<\/span>\n                <\/div>\n\n                <!-- Git -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/git\"\n                        alt=\"Git\"\n                        loading=\"lazy\"\n                    >\n                    <span>Git<\/span>\n                <\/div>\n\n                <!-- GitHub -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/github\"\n                        alt=\"GitHub\"\n                        loading=\"lazy\"\n                    >\n                    <span>GitHub<\/span>\n                <\/div>\n\n                <!-- Figma -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/figma\"\n                        alt=\"Figma\"\n                        loading=\"lazy\"\n                    >\n                    <span>Figma<\/span>\n                <\/div>\n\n                <!-- MySQL -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/mysql\"\n                        alt=\"MySQL\"\n                        loading=\"lazy\"\n                    >\n                    <span>MySQL<\/span>\n                <\/div>\n\n                <!-- GA4 -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/googleanalytics\"\n                        alt=\"Google Analytics 4\"\n                        loading=\"lazy\"\n                    >\n                    <span>GA4<\/span>\n                <\/div>\n\n                <!-- GTM -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/googletagmanager\"\n                        alt=\"Google Tag Manager\"\n                        loading=\"lazy\"\n                    >\n                    <span>Google Tag Manager<\/span>\n                <\/div>\n\n                <!-- React -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/react\"\n                        alt=\"React\"\n                        loading=\"lazy\"\n                    >\n                    <span>React<\/span>\n                <\/div>\n\n                <!-- Tailwind -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/tailwindcss\"\n                        alt=\"Tailwind CSS\"\n                        loading=\"lazy\"\n                    >\n                    <span>Tailwind CSS<\/span>\n                <\/div>\n\n                <!-- Supabase -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/supabase\"\n                        alt=\"Supabase\"\n                        loading=\"lazy\"\n                    >\n                    <span>Supabase<\/span>\n                <\/div>\n\n                <!-- Vercel -->\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/vercel\"\n                        alt=\"Vercel\"\n                        loading=\"lazy\"\n                    >\n                    <span>Vercel<\/span>\n                <\/div>\n\n            <\/div>\n\n\n            <!-- ==================================================\n                 GROUP 2 \u2014 DUPLICATE FOR INFINITE LOOP\n            =================================================== -->\n            <div class=\"ba-marquee__group\" aria-hidden=\"true\">\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/wordpress\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>WordPress<\/span>\n                <\/div>\n\n                <div class=\"ba-tech ba-tech--woocommerce\">\n                    <span class=\"ba-tech__woo-icon\" aria-hidden=\"true\">Woo<\/span>\n                    <span>WooCommerce<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/elementor\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Elementor<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/php\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>PHP<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/javascript\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>JavaScript<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/html5\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>HTML5<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/css\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>CSS<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/git\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Git<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/github\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>GitHub<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/figma\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Figma<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/mysql\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>MySQL<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/googleanalytics\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>GA4<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/googletagmanager\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Google Tag Manager<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/react\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>React<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/tailwindcss\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Tailwind CSS<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/supabase\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Supabase<\/span>\n                <\/div>\n\n                <div class=\"ba-tech\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/cdn.simpleicons.org\/vercel\"\n                        alt=\"\"\n                        loading=\"lazy\"\n                    >\n                    <span>Vercel<\/span>\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<style>\n\n\/* ==================================================\n   TECHNOLOGIES\n================================================== *\/\n\n.ba-technologies {\n    --tech-text: #F5F7FA;\n    --tech-muted: #A8B0BF;\n    --tech-border: #272E3A;\n    --tech-accent: #7C83FF;\n    --tech-woo: #7F54B3;\n\n    width: 100%;\n    padding: 0;\n    overflow: hidden;\n}\n\n\n\/* ==================================================\n   MARQUEE WRAPPER\n================================================== *\/\n\n.ba-marquee {\n    position: relative;\n    width: 100%;\n    padding: 12px 0;\n    overflow: hidden;\n\n    -webkit-mask-image:\n        linear-gradient(\n            to right,\n            transparent 0%,\n            #000 7%,\n            #000 93%,\n            transparent 100%\n        );\n\n    mask-image:\n        linear-gradient(\n            to right,\n            transparent 0%,\n            #000 0%,\n            #000 %,\n            transparent 100%\n        );\n}\n\n\n\/* ==================================================\n   TRACK\n================================================== *\/\n\n.ba-marquee__track {\n    display: flex;\n    width: max-content;\n    will-change: transform;\n    animation: ba-marquee-scroll 42s linear infinite;\n}\n\n.ba-marquee:hover .ba-marquee__track {\n    animation-play-state: paused;\n}\n\n\n\/* ==================================================\n   GROUP\n================================================== *\/\n\n.ba-marquee__group {\n    display: flex;\n    align-items: center;\n    flex-shrink: 0;\n    gap: 18px;\n    padding-right: 18px;\n}\n\n\n\/* ==================================================\n   TECHNOLOGY CARD\n================================================== *\/\n\n.ba-tech {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    gap: 12px;\n\n    min-height: 70px;\n    padding: 15px 22px;\n\n    border: 1px solid var(--tech-border);\n    border-radius: 12px;\n\n    color: var(--tech-muted);\n\n    transition:\n        color .25s ease,\n        border-color .25s ease,\n        transform .25s ease,\n        background-color .25s ease;\n}\n\n\n\/* ==================================================\n   STANDARD LOGOS\n================================================== *\/\n\n.ba-tech img {\n    display: block;\n    width: auto;\n    height: 28px;\n    max-width: 32px;\n    flex-shrink: 0;\n    object-fit: contain;\n\n    filter: grayscale(1) brightness(0) invert(1);\n    opacity: .72;\n\n    transition:\n        opacity .25s ease,\n        filter .25s ease,\n        transform .25s ease;\n}\n\n\n\/* ==================================================\n   WOO BADGE\n================================================== *\/\n\n.ba-tech__woo-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n\n    width: 34px;\n    height: 34px;\n\n    border-radius: 50%;\n\n    \/* Same neutral treatment as other icons *\/\n    background: #D1D5DB;\n    color: #11151F;\n\n    font-size: 9px;\n    font-weight: 800;\n    line-height: 1;\n    letter-spacing: -0.03em;\n\n    opacity: .78;\n\n    transition:\n        transform .25s ease,\n        box-shadow .25s ease,\n        background-color .25s ease,\n        color .25s ease,\n        opacity .25s ease;\n}\n\n\n\/* WooCommerce hover *\/\n\n.ba-tech--woocommerce:hover .ba-tech__woo-icon {\n    background: var(--tech-accent);\n    color: #FFFFFF;\n\n    opacity: 1;\n\n    transform: scale(1.08);\n\n}\n\n\n\/* ==================================================\n   LABEL\n================================================== *\/\n\n.ba-tech span:not(.ba-tech__woo-icon) {\n    white-space: nowrap;\n    font-family: inherit;\n    font-size: 16px;\n    font-weight: 500;\n    line-height: 1;\n}\n\n\n\/* ==================================================\n   HOVER\n================================================== *\/\n\n.ba-tech:hover {\n    color: var(--tech-text);\n    border-color: rgba(124, 131, 255, .55);\n    background: rgba(124, 131, 255, .055);\n    transform: translateY(-3px);\n}\n\n.ba-tech:hover img {\n    opacity: 1;\n    transform: scale(1.08);\n    filter:\n        brightness(0)\n        saturate(100%)\n        invert(54%)\n        sepia(63%)\n        saturate(2899%)\n        hue-rotate(214deg)\n        brightness(101%)\n        contrast(101%);\n}\n\n.ba-tech--woocommerce:hover .ba-tech__woo-icon {\n    transform: scale(1.08);\n\n}\n\n\n\/* ==================================================\n   MARQUEE ANIMATION\n================================================== *\/\n\n@keyframes ba-marquee-scroll {\n    from {\n        transform: translateX(0);\n    }\n    to {\n        transform: translateX(-50%);\n    }\n}\n\n\n\/* ==================================================\n   TABLET\n================================================== *\/\n\n@media (max-width: 900px) {\n\n    .ba-tech {\n        min-height: 60px;\n        padding: 14px 19px;\n    }\n\n    .ba-tech img {\n        height: 25px;\n        max-width: 29px;\n    }\n\n    .ba-tech__woo-icon {\n        width: 31px;\n        height: 31px;\n        font-size: 8.5px;\n    }\n\n    .ba-tech span:not(.ba-tech__woo-icon) {\n        font-size: 15px;\n    }\n}\n\n\n\/* ==================================================\n   MOBILE\n================================================== *\/\n\n@media (max-width: 600px) {\n\n    .ba-marquee {\n        -webkit-mask-image:\n            linear-gradient(\n                to right,\n                transparent 0%,\n                #000 4%,\n                #000 96%,\n                transparent 100%\n            );\n\n        mask-image:\n            linear-gradient(\n                to right,\n                transparent 0%,\n                #000 4%,\n                #000 96%,\n                transparent 100%\n            );\n    }\n\n    .ba-marquee__track {\n        animation-duration: 35s;\n    }\n\n    .ba-marquee__group {\n        gap: 12px;\n        padding-right: 12px;\n    }\n\n    .ba-tech {\n        gap: 9px;\n        min-height: 54px;\n        padding: 12px 16px;\n        border-radius: 10px;\n    }\n\n    .ba-tech img {\n        height: 23px;\n        max-width: 27px;\n    }\n\n    .ba-tech__woo-icon {\n        width: 28px;\n        height: 28px;\n        font-size: 8px;\n    }\n\n    .ba-tech span:not(.ba-tech__woo-icon) {\n        font-size: 14px;\n    }\n}\n\n\n\/* ==================================================\n   REDUCED MOTION\n================================================== *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    .ba-marquee__track {\n        animation: none;\n    }\n\n    .ba-marquee {\n        overflow-x: auto;\n        -webkit-mask-image: none;\n        mask-image: none;\n        scrollbar-width: none;\n    }\n\n    .ba-marquee::-webkit-scrollbar {\n        display: none;\n    }\n\n    .ba-tech,\n    .ba-tech img,\n    .ba-tech__woo-icon {\n        transition: none;\n    }\n}\n\n<\/style>\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-a9a9624 e-flex e-con-boxed e-con e-parent\" data-id=\"a9a9624\" data-element_type=\"container\" data-e-type=\"container\" id=\"work\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-13be7bb e-con-full e-flex e-con e-child\" data-id=\"13be7bb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-9085e0a e-con-full e-flex e-con e-child\" data-id=\"9085e0a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d5d682a elementor-widget elementor-widget-dtr-subheading\" data-id=\"d5d682a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-subheading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t    <div class=\"dtr-subheading-wrapper \">\r\n                 \t<h2 class=\"dtr-subheading\">Select Works<\/h2>\r\n        \t\t<\/div>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-29dc32d elementor-widget elementor-widget-dtr-heading\" data-id=\"29dc32d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"dtr-heading-wrapper \">\r\n                \t<h2 class=\"dtr-heading\">Selected WordPress &amp; Web Projects<\/h2>\r\n        \t\t<\/div>\r\n\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-b3e67c9 e-con-full elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con e-child\" data-id=\"b3e67c9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5a19d18 elementor-widget elementor-widget-dtr-button\" data-id=\"5a19d18\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t       \t<a class=\"dtr-btn  dtr-btn--has-icon dtr-btn--icon-right dtr-radius--round \" href=\"https:\/\/navein.tanshcreative.com\/portfolio\/\" role=\"button\">\r\n        \t\t\t                <span class=\"dtr-icon dtr-btn__icon\"><i class=\"icon-login-circle-fill\" aria-hidden=\"true\"><\/i><\/span>\r\n                                        <span class=\"dtr-btn__text\">View All<\/span>\r\n                <\/a>\r\n\t\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<div class=\"elementor-element elementor-element-29cf134 e-con-full e-flex e-con e-child\" data-id=\"29cf134\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9578b5e elementor-widget elementor-widget-dtr-grid-portfolio\" data-id=\"9578b5e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-grid-portfolio.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\n            <div class=\"dtr-filter-nav-wrapper ba-project-filters\">\n                <ul class=\"dtr-filter-nav\">\n        <li>\n                <a\n                    class=\"dtr-filter-all active\"\n                    data-filter=\"*\"\n                    href=\"#\"\n                >\n                    All\n                <\/a>\n            <\/li><li>\n                    <a\n                        data-filter=\".wordpress\"\n                        href=\"#\"\n                    >\n                        WordPress\n                    <\/a>\n                <\/li><li>\n                    <a\n                        data-filter=\".figma--wp\"\n                        href=\"#\"\n                    >\n                        Figma \u2192 WP\n                    <\/a>\n                <\/li><li>\n                    <a\n                        data-filter=\".woocommerce\"\n                        href=\"#\"\n                    >\n                        WooCommerce\n                    <\/a>\n                <\/li><li>\n                    <a\n                        data-filter=\".technical\"\n                        href=\"#\"\n                    >\n                        Technical\n                    <\/a>\n                <\/li>\n                <\/ul>\n            <\/div>\n        <div class=\"dtr-portfolio-grid ba-project-grid dtr-portfolio-fitrows dtr-portfolio-grid-2col\"><article\n                class=\"dtr-portfolio-item isotope-item ba-project-card wordpress all\"\n            ><div\n                class=\"dtr-portfolio-item__wrapper ba-project-card__inner dtr-radius--rounded\"\n            >\n                <div\n                    class=\"dtr-portfolio-item__img ba-project-card__image\"\n                >\n            <a\n                        href=\"https:\/\/brayanangarita.com\/es\/portfolio\/eurolatam-partners\/\"\n                        aria-label=\"View case study: EUROLATAM PARTNERS\"\n                    >\n                        <img loading=\"lazy\"\n                                src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/09\/01-hero-1024x640.webp\"\n                                width=\"1024\"\n                                height=\"640\"\n                                alt=\"EUROLATAM PARTNERS\"\n                                loading=\"lazy\"\n                                decoding=\"async\"\n                            >\n                    <\/a><\/div>\n            <div\n                class=\"\n                    dtr-portfolio-item__content\n                    ba-project-card__content\n                \"\n            >\n        \n                <div\n                    class=\"ba-project-card__technologies\"\n                    aria-label=\"Technologies used\"\n                >\n            <span class=\"ba-project-tech\">\n                        CSS\n                    <\/span><span class=\"ba-project-tech\">\n                        Elementor\n                    <\/span><span class=\"ba-project-tech\">\n                        Gtranslate\n                    <\/span><span class=\"ba-project-tech\">\n                        HTML\n                    <\/span><span class=\"ba-project-tech\">\n                        WordPress\n                    <\/span><\/div><h4\n                    class=\"\n                        dtr-portfolio-item__heading\n                        ba-project-card__title\n                    \"\n                ><a href=\"https:\/\/brayanangarita.com\/es\/portfolio\/eurolatam-partners\/\">\n                        EUROLATAM PARTNERS\n                    <\/a><\/h4><p\n                    class=\"\n                        dtr-portfolio-item__excerpt\n                        ba-project-card__excerpt\n                    \"\n                >\n                    Corporate WordPress website for an international B2B consulting firm, featuring a custom responsive interface, interactive sections and a multi-page content structure.\n                <\/p>\n            <div class=\"ba-project-card__actions\">\n        <a\n                    class=\"\n                        ba-project-action\n                        ba-project-action--primary\n                    \"\n                    href=\"https:\/\/brayanangarita.com\/es\/portfolio\/eurolatam-partners\/\"\n                >\n                    <span>Case Study<\/span>\n                    <span aria-hidden=\"true\">\u2192<\/span>\n                <\/a><a\n                    class=\"ba-project-action\"\n                    href=\"https:\/\/eurolatampartners.com\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                >\n                    <span>Live Site<\/span>\n                    <span aria-hidden=\"true\">\u2197<\/span>\n                <\/a><\/div><\/div><\/div><\/article><article\n                class=\"dtr-portfolio-item isotope-item ba-project-card figma--wp woocommerce wordpress all\"\n            ><div\n                class=\"dtr-portfolio-item__wrapper ba-project-card__inner dtr-radius--rounded\"\n            >\n                <div\n                    class=\"dtr-portfolio-item__img ba-project-card__image\"\n                >\n            <a\n                        href=\"https:\/\/brayanangarita.com\/es\/portfolio\/natural-roast\/\"\n                        aria-label=\"View case study: NATURAL ROAST\"\n                    >\n                        <img loading=\"lazy\"\n                                src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/01-hero-4-1024x640.webp\"\n                                width=\"1024\"\n                                height=\"640\"\n                                alt=\"NATURAL ROAST\"\n                                loading=\"lazy\"\n                                decoding=\"async\"\n                            >\n                    <\/a><\/div>\n            <div\n                class=\"\n                    dtr-portfolio-item__content\n                    ba-project-card__content\n                \"\n            >\n        \n                <div\n                    class=\"ba-project-card__technologies\"\n                    aria-label=\"Technologies used\"\n                >\n            <span class=\"ba-project-tech\">\n                        CSS\n                    <\/span><span class=\"ba-project-tech\">\n                        Elementor\n                    <\/span><span class=\"ba-project-tech\">\n                        Figma\n                    <\/span><span class=\"ba-project-tech\">\n                        HTML\n                    <\/span><span class=\"ba-project-tech\">\n                        WooCommerce\n                    <\/span><span class=\"ba-project-tech\">\n                        WordPress\n                    <\/span><\/div><h4\n                    class=\"\n                        dtr-portfolio-item__heading\n                        ba-project-card__title\n                    \"\n                ><a href=\"https:\/\/brayanangarita.com\/es\/portfolio\/natural-roast\/\">\n                        NATURAL ROAST\n                    <\/a><\/h4><p\n                    class=\"\n                        dtr-portfolio-item__excerpt\n                        ba-project-card__excerpt\n                    \"\n                >\n                    Figma-to-WooCommerce implementation with a customized shopping experience, including tailored product layouts and variation selection directly from catalog listings.\n                <\/p>\n            <div class=\"ba-project-card__actions\">\n        <a\n                    class=\"\n                        ba-project-action\n                        ba-project-action--primary\n                    \"\n                    href=\"https:\/\/brayanangarita.com\/es\/portfolio\/natural-roast\/\"\n                >\n                    <span>Case Study<\/span>\n                    <span aria-hidden=\"true\">\u2192<\/span>\n                <\/a><a\n                    class=\"ba-project-action\"\n                    href=\"https:\/\/shop.natural-roast.com\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                >\n                    <span>Live Site<\/span>\n                    <span aria-hidden=\"true\">\u2197<\/span>\n                <\/a><\/div><\/div><\/div><\/article><article\n                class=\"dtr-portfolio-item isotope-item ba-project-card technical wordpress all\"\n            ><div\n                class=\"dtr-portfolio-item__wrapper ba-project-card__inner dtr-radius--rounded\"\n            >\n                <div\n                    class=\"dtr-portfolio-item__img ba-project-card__image\"\n                >\n            <a\n                        href=\"https:\/\/brayanangarita.com\/es\/portfolio\/laboratorio-ayacucho\/\"\n                        aria-label=\"View case study: LABORATORIO AYACUCHO\"\n                    >\n                        <img loading=\"lazy\"\n                                src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/01-hero-3-1024x640.webp\"\n                                width=\"1024\"\n                                height=\"640\"\n                                alt=\"LABORATORIO AYACUCHO\"\n                                loading=\"lazy\"\n                                decoding=\"async\"\n                            >\n                    <\/a><\/div>\n            <div\n                class=\"\n                    dtr-portfolio-item__content\n                    ba-project-card__content\n                \"\n            >\n        \n                <div\n                    class=\"ba-project-card__technologies\"\n                    aria-label=\"Technologies used\"\n                >\n            <span class=\"ba-project-tech\">\n                        CSS\n                    <\/span><span class=\"ba-project-tech\">\n                        Elementor\n                    <\/span><span class=\"ba-project-tech\">\n                        WordPress\n                    <\/span><\/div><h4\n                    class=\"\n                        dtr-portfolio-item__heading\n                        ba-project-card__title\n                    \"\n                ><a href=\"https:\/\/brayanangarita.com\/es\/portfolio\/laboratorio-ayacucho\/\">\n                        LABORATORIO AYACUCHO\n                    <\/a><\/h4><p\n                    class=\"\n                        dtr-portfolio-item__excerpt\n                        ba-project-card__excerpt\n                    \"\n                >\n                    Corporate WordPress website and KiviCare-based workflow adapted for a veterinary laboratory, with role-specific dashboards and digital test-result management.\n                <\/p>\n            <div class=\"ba-project-card__actions\">\n        <a\n                    class=\"\n                        ba-project-action\n                        ba-project-action--primary\n                    \"\n                    href=\"https:\/\/brayanangarita.com\/es\/portfolio\/laboratorio-ayacucho\/\"\n                >\n                    <span>Case Study<\/span>\n                    <span aria-hidden=\"true\">\u2192<\/span>\n                <\/a><a\n                    class=\"ba-project-action\"\n                    href=\"https:\/\/laboratorioayacucho.com\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                >\n                    <span>Live Site<\/span>\n                    <span aria-hidden=\"true\">\u2197<\/span>\n                <\/a><\/div><\/div><\/div><\/article><article\n                class=\"dtr-portfolio-item isotope-item ba-project-card woocommerce wordpress all\"\n            ><div\n                class=\"dtr-portfolio-item__wrapper ba-project-card__inner dtr-radius--rounded\"\n            >\n                <div\n                    class=\"dtr-portfolio-item__img ba-project-card__image\"\n                >\n            <a\n                        href=\"https:\/\/brayanangarita.com\/es\/portfolio\/naxu\/\"\n                        aria-label=\"View case study: NAXU\"\n                    >\n                        <img loading=\"lazy\"\n                                src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/01-hero-2-1024x640.webp\"\n                                width=\"1024\"\n                                height=\"640\"\n                                alt=\"NAXU\"\n                                loading=\"lazy\"\n                                decoding=\"async\"\n                            >\n                    <\/a><\/div>\n            <div\n                class=\"\n                    dtr-portfolio-item__content\n                    ba-project-card__content\n                \"\n            >\n        \n                <div\n                    class=\"ba-project-card__technologies\"\n                    aria-label=\"Technologies used\"\n                >\n            <span class=\"ba-project-tech\">\n                        CSS\n                    <\/span><span class=\"ba-project-tech\">\n                        Elementor\n                    <\/span><span class=\"ba-project-tech\">\n                        PWA\n                    <\/span><span class=\"ba-project-tech\">\n                        WooCommerce\n                    <\/span><span class=\"ba-project-tech\">\n                        WoodMart\n                    <\/span><span class=\"ba-project-tech\">\n                        WordPress\n                    <\/span><\/div><h4\n                    class=\"\n                        dtr-portfolio-item__heading\n                        ba-project-card__title\n                    \"\n                ><a href=\"https:\/\/brayanangarita.com\/es\/portfolio\/naxu\/\">\n                        NAXU\n                    <\/a><\/h4><p\n                    class=\"\n                        dtr-portfolio-item__excerpt\n                        ba-project-card__excerpt\n                    \"\n                >\n                    Feature-rich WooCommerce store configured and adapted for a large catalog, with multilingual and multi-currency support, advanced navigation, predictive search and PWA functionality.\n                <\/p>\n            <div class=\"ba-project-card__actions\">\n        <a\n                    class=\"\n                        ba-project-action\n                        ba-project-action--primary\n                    \"\n                    href=\"https:\/\/brayanangarita.com\/es\/portfolio\/naxu\/\"\n                >\n                    <span>Case Study<\/span>\n                    <span aria-hidden=\"true\">\u2192<\/span>\n                <\/a><a\n                    class=\"ba-project-action\"\n                    href=\"https:\/\/naxu.ai\/\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                >\n                    <span>Live Site<\/span>\n                    <span aria-hidden=\"true\">\u2197<\/span>\n                <\/a><\/div><\/div><\/div><\/article><article\n                class=\"dtr-portfolio-item isotope-item ba-project-card technical woocommerce wordpress all\"\n            ><div\n                class=\"dtr-portfolio-item__wrapper ba-project-card__inner dtr-radius--rounded\"\n            >\n                <div\n                    class=\"dtr-portfolio-item__img ba-project-card__image\"\n                >\n            <a\n                        href=\"https:\/\/brayanangarita.com\/es\/portfolio\/elemental-clothes\/\"\n                        aria-label=\"View case study: ELEMENTAL CLOTHES\"\n                    >\n                        <img loading=\"lazy\"\n                                src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/01-hero-colombia-1024x640.webp\"\n                                width=\"1024\"\n                                height=\"640\"\n                                alt=\"ELEMENTAL CLOTHES\"\n                                loading=\"lazy\"\n                                decoding=\"async\"\n                            >\n                    <\/a><\/div>\n            <div\n                class=\"\n                    dtr-portfolio-item__content\n                    ba-project-card__content\n                \"\n            >\n        \n                <div\n                    class=\"ba-project-card__technologies\"\n                    aria-label=\"Technologies used\"\n                >\n            <span class=\"ba-project-tech\">\n                        CSS\n                    <\/span><span class=\"ba-project-tech\">\n                        Inventory Sync\n                    <\/span><span class=\"ba-project-tech\">\n                        IP Geolocation\n                    <\/span><span class=\"ba-project-tech\">\n                        WooCommerce\n                    <\/span><span class=\"ba-project-tech\">\n                        WordPress\n                    <\/span><\/div><h4\n                    class=\"\n                        dtr-portfolio-item__heading\n                        ba-project-card__title\n                    \"\n                ><a href=\"https:\/\/brayanangarita.com\/es\/portfolio\/elemental-clothes\/\">\n                        ELEMENTAL CLOTHES\n                    <\/a><\/h4><p\n                    class=\"\n                        dtr-portfolio-item__excerpt\n                        ba-project-card__excerpt\n                    \"\n                >\n                    Multi-region WooCommerce setup for Colombia and Europe, with location-based redirection, synchronized inventory and independently managed pricing for each storefront.\n                <\/p>\n            <div class=\"ba-project-card__actions\">\n        <a\n                    class=\"\n                        ba-project-action\n                        ba-project-action--primary\n                    \"\n                    href=\"https:\/\/brayanangarita.com\/es\/portfolio\/elemental-clothes\/\"\n                >\n                    <span>Case Study<\/span>\n                    <span aria-hidden=\"true\">\u2192<\/span>\n                <\/a><a\n                    class=\"ba-project-action\"\n                    href=\"https:\/\/elementalclothes.com\/\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                >\n                    <span>Live Site<\/span>\n                    <span aria-hidden=\"true\">\u2197<\/span>\n                <\/a><\/div><\/div><\/div><\/article><article\n                class=\"dtr-portfolio-item isotope-item ba-project-card figma--wp technical wordpress all\"\n            ><div\n                class=\"dtr-portfolio-item__wrapper ba-project-card__inner dtr-radius--rounded\"\n            >\n                <div\n                    class=\"dtr-portfolio-item__img ba-project-card__image\"\n                >\n            <a\n                        href=\"https:\/\/brayanangarita.com\/es\/portfolio\/navien-mexico\/\"\n                        aria-label=\"View case study: NAVIEN M\u00c9XICO\"\n                    >\n                        <img loading=\"lazy\"\n                                src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/01-hero-1-1024x640.webp\"\n                                width=\"1024\"\n                                height=\"640\"\n                                alt=\"NAVIEN M\u00c9XICO\"\n                                loading=\"lazy\"\n                                decoding=\"async\"\n                            >\n                    <\/a><\/div>\n            <div\n                class=\"\n                    dtr-portfolio-item__content\n                    ba-project-card__content\n                \"\n            >\n        \n                <div\n                    class=\"ba-project-card__technologies\"\n                    aria-label=\"Technologies used\"\n                >\n            <span class=\"ba-project-tech\">\n                        CSS\n                    <\/span><span class=\"ba-project-tech\">\n                        Elementor\n                    <\/span><span class=\"ba-project-tech\">\n                        Figma\n                    <\/span><span class=\"ba-project-tech\">\n                        HTML\n                    <\/span><span class=\"ba-project-tech\">\n                        JavaScript\n                    <\/span><span class=\"ba-project-tech\">\n                        React\n                    <\/span><span class=\"ba-project-tech\">\n                        WordPress\n                    <\/span><\/div><h4\n                    class=\"\n                        dtr-portfolio-item__heading\n                        ba-project-card__title\n                    \"\n                ><a href=\"https:\/\/brayanangarita.com\/es\/portfolio\/navien-mexico\/\">\n                        NAVIEN M\u00c9XICO\n                    <\/a><\/h4><p\n                    class=\"\n                        dtr-portfolio-item__excerpt\n                        ba-project-card__excerpt\n                    \"\n                >\n                    Large-scale Figma-to-WordPress implementation of around 40 pages, delivered collaboratively with other developers and including complex interactive sections integrated from React.\n                <\/p>\n            <div class=\"ba-project-card__actions\">\n        <a\n                    class=\"\n                        ba-project-action\n                        ba-project-action--primary\n                    \"\n                    href=\"https:\/\/brayanangarita.com\/es\/portfolio\/navien-mexico\/\"\n                >\n                    <span>Case Study<\/span>\n                    <span aria-hidden=\"true\">\u2192<\/span>\n                <\/a><a\n                    class=\"ba-project-action\"\n                    href=\"https:\/\/www.navien.com.mx\/\"\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                >\n                    <span>Live Site<\/span>\n                    <span aria-hidden=\"true\">\u2197<\/span>\n                <\/a><\/div><\/div><\/div><\/article><\/div>\t\t\t\t<\/div>\n\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-92249b9 e-flex e-con-boxed e-con e-parent\" data-id=\"92249b9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a357c5a elementor-widget elementor-widget-html\" data-id=\"a357c5a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section\n    class=\"ba-about-v3\"\n    id=\"about\"\n    aria-labelledby=\"ba-about-title\"\n>\n\n    <div class=\"ba-about-v3__inner\">\n\n        <div class=\"ba-about-v3__panel\">\n\n\n            <!-- =================================================\n                 TOP\n            ================================================== -->\n\n            <div class=\"ba-about-v3__top\">\n\n\n                <!-- INTRO -->\n\n                <div class=\"ba-about-v3__intro\">\n\n                    <div class=\"ba-about-v3__eyebrow\">\n\n                        <span\n                            class=\"ba-about-v3__eyebrow-line\"\n                            aria-hidden=\"true\"\n                        ><\/span>\n\n                        <span>\n                            About\n                        <\/span>\n\n                    <\/div>\n\n\n                    <h2\n                        class=\"ba-about-v3__title\"\n                        id=\"ba-about-title\"\n                    >\n                        A little more about me\n                        and how I work.\n                    <\/h2>\n\n\n                    <p class=\"ba-about-v3__lead\">\n                        I'm a WordPress &amp; WooCommerce Developer based in Bogot\u00e1,\n                        Colombia, with 3+ years of experience working with businesses,\n                        agencies and marketing teams.\n                    <\/p>\n\n\n                    <p class=\"ba-about-v3__text\">\n                        Over the years, I've built and maintained corporate websites,\n                        e-commerce stores and Figma-to-WordPress projects, while also\n                        handling ongoing improvements, troubleshooting and project-specific\n                        customizations. I enjoy solving real web problems, learning from\n                        every project and continuously improving the way I build for the web.\n                    <\/p>\n\n                <\/div>\n\n\n\n                <!-- PHOTO -->\n\n                <div class=\"ba-about-v3__visual\">\n\n                    <div class=\"ba-about-v3__photo\">\n\n                        <div\n                            class=\"ba-about-v3__photo-accent\"\n                            aria-hidden=\"true\"\n                        ><\/div>\n\n                        <img loading=\"lazy\"\n                            src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/Red-Gradient-Profile-Photo-Instagram-Post-1.jpg\"\n                            alt=\"Brayan Angarita\"\n                            width=\"720\"\n                            height=\"900\"\n                            loading=\"lazy\"\n                            decoding=\"async\"\n                        >\n\n                    <\/div>\n\n                <\/div>\n\n\n            <\/div>\n\n\n\n            <!-- =================================================\n                 DIVIDER\n            ================================================== -->\n\n            <div\n                class=\"ba-about-v3__divider\"\n                aria-hidden=\"true\"\n            ><\/div>\n\n\n\n            <!-- =================================================\n                 BOTTOM\n            ================================================== -->\n\n            <div class=\"ba-about-v3__bottom\">\n\n\n                <!-- =================================================\n                     EDUCATION\n                ================================================== -->\n\n                <div class=\"ba-about-v3__education\">\n\n                    <div class=\"ba-about-v3__section-heading\">\n\n                        <div>\n\n                            <span class=\"ba-about-v3__section-label\">\n                                Background\n                            <\/span>\n\n                            <h3>\n                                Education\n                            <\/h3>\n\n                        <\/div>\n\n                    <\/div>\n\n\n\n                    <div class=\"ba-about-v3__education-list\">\n\n\n                        <!-- =========================================\n                             UNIVERSIDAD NACIONAL\n                        ========================================== -->\n\n                        <article class=\"ba-education-v3-item\">\n\n                            <div class=\"ba-education-v3-item__mark\">\n\n                                <img\n                                    src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/logo-universidad-nacional.webp\"\n                                    alt=\"Universidad Nacional de Colombia\"\n                                    loading=\"lazy\"\n                                    decoding=\"async\"\n                                >\n\n                            <\/div>\n\n\n                            <div class=\"ba-education-v3-item__content\">\n\n                                <h4>\n                                    Mechatronics Engineering\n                                <\/h4>\n\n                                <strong>\n                                    Universidad Nacional de Colombia\n                                <\/strong>\n\n                                <span>\n                                    2021 \u2014 Present \u00b7 Expected 2027\n                                <\/span>\n\n                            <\/div>\n\n                        <\/article>\n\n\n\n                        <!-- =========================================\n                             ALURA\n                        ========================================== -->\n\n                    <article class=\"ba-education-v3-item\">\n\n                    <div class=\"ba-education-v3-item__mark ba-education-v3-item__mark--alura\">\n                \n                        <img\n                            src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/logo-a.webp\"\n                            alt=\"Alura\"\n                            loading=\"lazy\"\n                            decoding=\"async\"\n                        >\n                \n                    <\/div>\n                \n                    <div class=\"ba-education-v3-item__content\">\n                \n                        <h4>\n                            Front-End Development\n                        <\/h4>\n                \n                        <strong>\n                            Alura\n                        <\/strong>\n                \n                        <span>\n                            Mar 2022 \u2014 Aug 2023\n                        <\/span>\n                \n                    <\/div>\n                \n                <\/article>\n\n                        <!-- =========================================\n                             SENA\n                        ========================================== -->\n\n                        <article class=\"ba-education-v3-item\">\n\n                            <div class=\"ba-education-v3-item__mark\">\n\n                                <img\n                                    src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2026\/08\/logo-sena.webp\"\n                                    alt=\"SENA\"\n                                    loading=\"lazy\"\n                                    decoding=\"async\"\n                                >\n\n                            <\/div>\n\n\n                            <div class=\"ba-education-v3-item__content\">\n\n                                <h4>\n                                    Systems Technology\n                                <\/h4>\n\n                                <strong>\n                                    SENA \u2014 Servicio Nacional de Aprendizaje\n                                <\/strong>\n\n                                <span>\n                                    Jan 2019 \u2014 Nov 2020\n                                <\/span>\n\n                            <\/div>\n\n                        <\/article>\n\n\n                    <\/div>\n\n                <\/div>\n\n\n\n                <!-- =================================================\n                     WORKANA\n                ================================================== -->\n\n                <div class=\"ba-about-v3__workana\">\n\n                    <div class=\"ba-about-v3__section-heading\">\n\n                        <div>\n\n                            <span class=\"ba-about-v3__section-label\">\n                                Client recognition\n                            <\/span>\n\n                            <h3>\n                                Workana Recognition\n                            <\/h3>\n\n                        <\/div>\n\n\n                        <a\n                            class=\"ba-about-v3__profile-link\"\n                            href=\"https:\/\/www.workana.com\/freelancer\/ea2b869fab8a6c869fdb11e210e89348\"\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                        >\n                            View profile\n\n                            <svg\n                                viewBox=\"0 0 24 24\"\n                                aria-hidden=\"true\"\n                            >\n                                <path d=\"M7 17 17 7\"><\/path>\n                                <path d=\"M8 7h9v9\"><\/path>\n                            <\/svg>\n                        <\/a>\n\n                    <\/div>\n\n\n\n                    <div class=\"ba-workana-v3-grid\">\n\n\n                        <!-- RATING -->\n\n                        <div class=\"ba-workana-v3-stat\">\n\n                            <strong>\n                                4.98<span>\/5<\/span>\n                            <\/strong>\n\n                            <small>\n                                Client rating\n                            <\/small>\n\n                        <\/div>\n\n\n\n                        <!-- RATINGS -->\n\n                        <div class=\"ba-workana-v3-stat\">\n\n                            <strong>\n                                45\n                            <\/strong>\n\n                            <small>\n                                Client ratings\n                            <\/small>\n\n                        <\/div>\n\n\n\n                        <!-- LEVEL -->\n\n                        <div class=\"ba-workana-v3-stat\">\n\n                            <strong class=\"ba-workana-v3-stat--accent\">\n                                Platinum\n                            <\/strong>\n\n                            <small>\n                                Current Workana level\n                            <\/small>\n\n                        <\/div>\n\n\n\n                        <!-- FORMER #1 -->\n\n                        <div class=\"ba-workana-v3-stat\">\n\n                            <strong class=\"ba-workana-v3-stat--accent\">\n                                Former #1\n                            <\/strong>\n\n                            <small>\n                                Programming &amp; Technology \u00b7 Colombia\n                            <\/small>\n\n                        <\/div>\n\n\n                    <\/div>\n\n\n                    <p class=\"ba-about-v3__workana-note\">\n                        A track record built through real client projects,\n                        recurring collaborations and consistently positive feedback.\n                    <\/p>\n\n                <\/div>\n\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n\n<style>\n\n\/* =========================================================\n   ABOUT V3\n========================================================= *\/\n\n.ba-about-v3,\n.ba-about-v3 * {\n    box-sizing:\n        border-box;\n}\n\n\n.ba-about-v3 {\n    width:\n        100%;\n\n    max-width:\n        var(--ba-content-max, 1140px);\n\n    margin:\n        0 auto;\n\n    color:\n        var(--ba-text);\n}\n\n\n.ba-about-v3__inner {\n    width:\n        100%;\n\n    max-width:\n        var(--ba-content-max, 1140px);\n\n    margin:\n        0 auto;\n}\n\n\n\n\/* =========================================================\n   PANEL\n========================================================= *\/\n\n.ba-about-v3__panel {\n    width:\n        100%;\n\n    max-width:\n        var(--ba-content-max, 1140px);\n\n    margin:\n        0 auto;\n\n    padding:\n        54px;\n\n    border:\n        1px solid\n        var(--ba-border);\n\n    border-radius:\n        var(--ba-radius-md, 12px);\n\n    background:\n        var(--ba-surface);\n\n    box-shadow:\n        var(--ba-shadow-soft);\n\n    transition:\n        background-color\n        var(--ba-transition-theme, .18s ease),\n\n        border-color\n        var(--ba-transition-theme, .18s ease),\n\n        box-shadow\n        var(--ba-transition-theme, .18s ease);\n}\n\n\n\n\/* =========================================================\n   TOP\n========================================================= *\/\n\n.ba-about-v3__top {\n    display:\n        grid;\n\n    grid-template-columns:\n        minmax(0, 1.25fr)\n        minmax(300px, .75fr);\n\n    align-items:\n        center;\n\n    gap:\n        72px;\n}\n\n\n\n\/* =========================================================\n   EYEBROW\n========================================================= *\/\n\n.ba-about-v3__eyebrow {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    gap:\n        11px;\n\n    margin-bottom:\n        20px;\n\n    color:\n        var(--ba-accent);\n\n    font-size:\n        12px;\n\n    font-weight:\n        700;\n\n    line-height:\n        1.2;\n\n    letter-spacing:\n        .10em;\n\n    text-transform:\n        uppercase;\n}\n\n\n.ba-about-v3__eyebrow-line {\n    width:\n        28px;\n\n    height:\n        2px;\n\n    flex:\n        0 0 28px;\n\n    background:\n        var(--ba-accent);\n}\n\n\n\n\/* =========================================================\n   TITLE\n========================================================= *\/\n\n.ba-about-v3__title {\n    max-width:\n        700px;\n\n    margin:\n        0;\n\n    color:\n        var(--ba-text) !important;\n\n    font-size:\n        clamp(44px, 4vw, 60px);\n\n    font-weight:\n        600;\n\n    line-height:\n        1.02;\n\n    letter-spacing:\n        -.045em;\n\n    text-wrap:\n        balance;\n}\n\n\n\n\/* =========================================================\n   COPY\n========================================================= *\/\n\n.ba-about-v3__lead {\n    max-width:\n        700px;\n\n    margin:\n        28px 0 0 !important;\n\n    color:\n        var(--ba-text) !important;\n\n    font-size:\n        19px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.72;\n}\n\n\n.ba-about-v3__text {\n    max-width:\n        700px;\n\n    margin:\n        18px 0 0 !important;\n\n    color:\n        var(--ba-text-soft) !important;\n\n    font-size:\n        16px;\n\n    font-weight:\n        400;\n\n    line-height:\n        1.85;\n}\n\n\n\n\/* =========================================================\n   PHOTO\n========================================================= *\/\n\n.ba-about-v3__visual {\n    display:\n        flex;\n\n    justify-content:\n        flex-end;\n}\n\n\n.ba-about-v3__photo {\n    position:\n        relative;\n\n    width:\n        100%;\n\n    max-width:\n        338px;\n\n    aspect-ratio:\n        4 \/ 5;\n\n    overflow:\n        hidden;\n\n    border:\n        1px solid\n        var(--ba-border);\n\n    border-radius:\n        var(--ba-radius-md, 12px);\n\n    background:\n        var(--ba-surface-2);\n\n    isolation:\n        isolate;\n}\n\n\n.ba-about-v3__photo-accent {\n    position:\n        absolute;\n\n    z-index:\n        -1;\n\n    top:\n        20px;\n\n    left:\n        50%;\n\n    width:\n        250px;\n\n    height:\n        250px;\n\n    border-radius:\n        50%;\n\n    background:\n        rgba(\n            var(--ba-accent-rgb),\n            .16\n        );\n\n    transform:\n        translateX(-50%);\n}\n\n\n.ba-about-v3__photo img {\n    position:\n        absolute;\n\n    inset:\n        0;\n\n    display:\n        block;\n\n    width:\n        100%;\n\n    height:\n        100%;\n\n    object-fit:\n        cover;\n\n    object-position:\n        center top;\n\n    border-radius:\n        0 !important;\n}\n\n\n\n\/* =========================================================\n   DIVIDER\n========================================================= *\/\n\n.ba-about-v3__divider {\n    width:\n        100%;\n\n    height:\n        1px;\n\n    margin:\n        50px 0;\n\n    background:\n        var(--ba-border);\n}\n\n\n\n\/* =========================================================\n   BOTTOM\n========================================================= *\/\n\n.ba-about-v3__bottom {\n    display:\n        grid;\n\n    grid-template-columns:\n        minmax(0, .95fr)\n        minmax(0, 1.05fr);\n\n    gap:\n        64px;\n}\n\n\n\n\/* =========================================================\n   SECTION HEADINGS\n========================================================= *\/\n\n.ba-about-v3__section-heading {\n    display:\n        flex;\n\n    align-items:\n        flex-end;\n\n    justify-content:\n        space-between;\n\n    gap:\n        20px;\n\n    min-height:\n        58px;\n\n    padding-bottom:\n        16px;\n\n    border-bottom:\n        1px solid\n        var(--ba-border);\n}\n\n\n.ba-about-v3__section-label {\n    display:\n        block;\n\n    margin-bottom:\n        6px;\n\n    color:\n        var(--ba-text-muted);\n\n    font-size:\n        11px;\n\n    font-weight:\n        700;\n\n    line-height:\n        1.2;\n\n    letter-spacing:\n        .08em;\n\n    text-transform:\n        uppercase;\n}\n\n\n.ba-about-v3__section-heading h3 {\n    margin:\n        0;\n\n    color:\n        var(--ba-text) !important;\n\n    font-size:\n        24px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1.25;\n\n    letter-spacing:\n        -.025em;\n}\n\n\n\n\/* =========================================================\n   EDUCATION\n========================================================= *\/\n\n.ba-about-v3__education-list {\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    margin-top:\n        10px;\n}\n\n\n.ba-education-v3-item {\n    display:\n        grid;\n\n    grid-template-columns:\n        56px\n        minmax(0, 1fr);\n\n    gap:\n        17px;\n\n    align-items:\n        center;\n\n    padding:\n        18px 0;\n\n    border-bottom:\n        1px solid\n        var(--ba-border-soft);\n}\n\n\n.ba-education-v3-item:last-child {\n    border-bottom:\n        0;\n}\n\n\n\n\/* =========================================================\n   EDUCATION LOGO BOX\n========================================================= *\/\n\n.ba-education-v3-item__mark {\n    display:\n        flex;\n\n    align-items:\n        center;\n\n    justify-content:\n        center;\n\n    width:\n        56px;\n\n    height:\n        56px;\n\n    padding:\n        8px;\n\n    overflow:\n        hidden;\n\n    border:\n        1px solid\n        var(--ba-border);\n\n    border-radius:\n        var(--ba-radius-sm, 8px);\n\n    background:\n        var(--ba-surface-2);\n\n    transition:\n        background-color\n        var(--ba-transition-fast, .16s ease),\n\n        border-color\n        var(--ba-transition-fast, .16s ease),\n\n        transform\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-education-v3-item:hover\n.ba-education-v3-item__mark {\n    border-color:\n        var(--ba-accent-border);\n\n    background:\n        var(--ba-accent-soft);\n\n    transform:\n        translateY(-1px);\n}\n\n\n\n\/* =========================================================\n   EDUCATION LOGOS\n========================================================= *\/\n\n.ba-education-v3-item__mark img {\n    display:\n        block;\n\n    width:\n        100%;\n\n    height:\n        100%;\n\n    max-width:\n        40px;\n\n    max-height:\n        40px;\n\n    object-fit:\n        contain;\n\n    object-position:\n        center;\n\n    border:\n        0;\n\n    border-radius:\n        0 !important;\n\n    box-shadow:\n        none;\n\n    transition:\n        transform\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-education-v3-item:hover\n.ba-education-v3-item__mark img {\n    transform:\n        scale(1.04);\n}\n\n\n\n\/* Universidad Nacional logo benefits from slightly more room *\/\n\n.ba-education-v3-item:first-child\n.ba-education-v3-item__mark img {\n    max-width:\n        42px;\n\n    max-height:\n        42px;\n}\n\n\n\n\/* Alura *\/\n\n.ba-education-v3-item:nth-child(2)\n.ba-education-v3-item__mark img {\n    max-width:\n        38px;\n\n    max-height:\n        38px;\n}\n\n\n\n\/* SENA *\/\n\n.ba-education-v3-item:nth-child(3)\n.ba-education-v3-item__mark img {\n    max-width:\n        42px;\n\n    max-height:\n        42px;\n}\n\n\n\n\/* =========================================================\n   EDUCATION TEXT\n========================================================= *\/\n\n.ba-education-v3-item__content {\n    min-width:\n        0;\n}\n\n\n.ba-education-v3-item__content h4 {\n    margin:\n        0 0 5px;\n\n    color:\n        var(--ba-text) !important;\n\n    font-size:\n        16.5px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1.35;\n}\n\n\n.ba-education-v3-item__content strong {\n    display:\n        block;\n\n    margin-bottom:\n        4px;\n\n    color:\n        var(--ba-text-soft);\n\n    font-size:\n        14px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1.45;\n}\n\n\n.ba-education-v3-item__content span {\n    display:\n        block;\n\n    color:\n        var(--ba-text-muted);\n\n    font-size:\n        13px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.45;\n}\n\n\n\/* =========================================================\n   ALURA LOGO\n   The original logo is light, so it needs a dark surface\n   in both themes to preserve its original appearance.\n========================================================= *\/\n\n.ba-education-v3-item__mark--alura {\n    background:\n        #171B22 !important;\n\n    border-color:\n        #2A3039 !important;\n}\n\n\n\/* Keep logo untouched *\/\n\n.ba-education-v3-item__mark--alura img {\n    filter:\n        none !important;\n\n    opacity:\n        1 !important;\n}\n\n\n\/* Hover *\/\n\n.ba-education-v3-item:hover\n.ba-education-v3-item__mark--alura {\n    background:\n        #1D222A !important;\n\n    border-color:\n        var(--ba-accent-border) !important;\n}\n\n\n\/* Light theme *\/\n\nhtml[data-theme=\"light\"]\n.ba-education-v3-item__mark--alura {\n    background:\n        #171B22 !important;\n\n    border-color:\n        #D8DDE3 !important;\n}\n\n\n\/* Dark theme *\/\n\nhtml[data-theme=\"dark\"]\n.ba-education-v3-item__mark--alura {\n    background:\n        #171B22 !important;\n\n    border-color:\n        var(--ba-border) !important;\n}\n\n\n\n\/* =========================================================\n   PROFILE LINK\n========================================================= *\/\n\n.ba-about-v3__profile-link {\n    display:\n        inline-flex;\n\n    align-items:\n        center;\n\n    gap:\n        7px;\n\n    padding-bottom:\n        2px;\n\n    color:\n        var(--ba-text-muted) !important;\n\n    font-size:\n        13px;\n\n    font-weight:\n        600;\n\n    line-height:\n        1;\n\n    text-decoration:\n        none !important;\n\n    transition:\n        color\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-about-v3__profile-link:hover {\n    color:\n        var(--ba-accent) !important;\n}\n\n\n.ba-about-v3__profile-link svg {\n    width:\n        13px;\n\n    height:\n        13px;\n\n    fill:\n        none;\n\n    stroke:\n        currentColor;\n\n    stroke-width:\n        1.8;\n\n    stroke-linecap:\n        round;\n\n    stroke-linejoin:\n        round;\n\n    transition:\n        transform\n        var(--ba-transition-fast, .16s ease);\n}\n\n\n.ba-about-v3__profile-link:hover svg {\n    transform:\n        translate(2px, -2px);\n}\n\n\n\n\/* =========================================================\n   WORKANA GRID\n========================================================= *\/\n\n.ba-workana-v3-grid {\n    display:\n        grid;\n\n    grid-template-columns:\n        repeat(2, minmax(0, 1fr));\n\n    margin-top:\n        0;\n}\n\n\n.ba-workana-v3-stat {\n    display:\n        flex;\n\n    flex-direction:\n        column;\n\n    justify-content:\n        center;\n\n    min-height:\n        118px;\n\n    padding:\n        24px 0;\n\n    border-bottom:\n        1px solid\n        var(--ba-border);\n}\n\n\n.ba-workana-v3-stat:nth-child(odd) {\n    padding-right:\n        30px;\n\n    border-right:\n        1px solid\n        var(--ba-border);\n}\n\n\n.ba-workana-v3-stat:nth-child(even) {\n    padding-left:\n        30px;\n}\n\n\n.ba-workana-v3-stat:nth-last-child(-n+2) {\n    border-bottom:\n        0;\n}\n\n\n\n\/* =========================================================\n   WORKANA VALUES\n========================================================= *\/\n\n.ba-workana-v3-stat strong {\n    display:\n        block;\n\n    color:\n        var(--ba-text);\n\n    font-size:\n        26px;\n\n    font-weight:\n        650;\n\n    line-height:\n        1.1;\n\n    letter-spacing:\n        -.035em;\n}\n\n\n.ba-workana-v3-stat strong span {\n    color:\n        var(--ba-accent);\n}\n\n\n.ba-workana-v3-stat--accent {\n    color:\n        var(--ba-accent) !important;\n}\n\n\n.ba-workana-v3-stat small {\n    display:\n        block;\n\n    margin-top:\n        8px;\n\n    color:\n        var(--ba-text-muted);\n\n    font-size:\n        13px;\n\n    font-weight:\n        500;\n\n    line-height:\n        1.5;\n}\n\n\n\n\/* =========================================================\n   WORKANA NOTE\n========================================================= *\/\n\n.ba-about-v3__workana-note {\n    margin:\n        20px 0 0 !important;\n\n    padding-top:\n        18px;\n\n    border-top:\n        1px solid\n        var(--ba-border-soft);\n\n    color:\n        var(--ba-text-muted) !important;\n\n    font-size:\n        13px;\n\n    line-height:\n        1.7;\n}\n\n\n\n\/* =========================================================\n   TABLET\n========================================================= *\/\n\n@media (max-width: 960px) {\n\n    .ba-about-v3__panel {\n        padding:\n            42px;\n    }\n\n\n    .ba-about-v3__top {\n        grid-template-columns:\n            minmax(0, 1.15fr)\n            minmax(260px, .75fr);\n\n        gap:\n            44px;\n    }\n\n\n    .ba-about-v3__bottom {\n        gap:\n            42px;\n    }\n\n\n    .ba-about-v3__title {\n        font-size:\n            clamp(40px, 5vw, 52px);\n    }\n\n\n    .ba-about-v3__photo {\n        max-width:\n            300px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   MOBILE\n========================================================= *\/\n\n@media (max-width: 720px) {\n\n    .ba-about-v3__panel {\n        padding:\n            28px;\n\n        border-radius:\n            var(--ba-radius-md, 12px);\n    }\n\n\n    .ba-about-v3__top {\n        grid-template-columns:\n            1fr;\n\n        gap:\n            32px;\n    }\n\n\n    .ba-about-v3__title {\n        max-width:\n            520px;\n\n        font-size:\n            clamp(38px, 11vw, 48px);\n    }\n\n\n    .ba-about-v3__lead {\n        margin-top:\n            22px !important;\n\n        font-size:\n            17px;\n    }\n\n\n    .ba-about-v3__text {\n        font-size:\n            15px;\n    }\n\n\n    .ba-about-v3__visual {\n        justify-content:\n            flex-start;\n    }\n\n\n    .ba-about-v3__photo {\n        width:\n            100%;\n\n        max-width:\n            none;\n\n        height:\n            250px;\n\n        aspect-ratio:\n            auto;\n    }\n\n\n    .ba-about-v3__photo img {\n        object-position:\n            center 26%;\n    }\n\n\n    .ba-about-v3__photo-accent {\n        width:\n            210px;\n\n        height:\n            210px;\n\n        top:\n            5px;\n    }\n\n\n    .ba-about-v3__divider {\n        margin:\n            38px 0;\n    }\n\n\n    .ba-about-v3__bottom {\n        grid-template-columns:\n            1fr;\n\n        gap:\n            44px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 480px) {\n\n    .ba-about-v3__panel {\n        padding:\n            22px 18px;\n    }\n\n\n    .ba-about-v3__title {\n        font-size:\n            38px;\n\n        line-height:\n            1.03;\n    }\n\n\n    .ba-about-v3__photo {\n        height:\n            210px;\n    }\n\n\n    .ba-about-v3__section-heading {\n        align-items:\n            flex-start;\n    }\n\n\n    .ba-about-v3__profile-link {\n        margin-top:\n            5px;\n\n        font-size:\n            12px;\n    }\n\n\n\n    \/* Education *\/\n\n    .ba-education-v3-item {\n        grid-template-columns:\n            50px\n            minmax(0, 1fr);\n\n        gap:\n            14px;\n\n        padding:\n            16px 0;\n    }\n\n\n    .ba-education-v3-item__mark {\n        width:\n            50px;\n\n        height:\n            50px;\n\n        padding:\n            7px;\n    }\n\n\n    .ba-education-v3-item__mark img {\n        max-width:\n            37px;\n\n        max-height:\n            37px;\n    }\n\n\n    .ba-education-v3-item__content h4 {\n        font-size:\n            15.5px;\n    }\n\n\n    .ba-education-v3-item__content strong {\n        font-size:\n            13px;\n    }\n\n\n    .ba-education-v3-item__content span {\n        font-size:\n            12px;\n    }\n\n\n\n    \/* Workana *\/\n\n    .ba-workana-v3-stat {\n        min-height:\n            104px;\n    }\n\n\n    .ba-workana-v3-stat:nth-child(odd) {\n        padding-right:\n            18px;\n    }\n\n\n    .ba-workana-v3-stat:nth-child(even) {\n        padding-left:\n            18px;\n    }\n\n\n    .ba-workana-v3-stat strong {\n        font-size:\n            23px;\n    }\n\n\n    .ba-workana-v3-stat small {\n        font-size:\n            12px;\n    }\n\n}\n\n\n\n\/* =========================================================\n   VERY SMALL MOBILE\n========================================================= *\/\n\n@media (max-width: 360px) {\n\n    .ba-workana-v3-grid {\n        grid-template-columns:\n            1fr;\n    }\n\n\n    .ba-workana-v3-stat,\n    .ba-workana-v3-stat:nth-child(odd),\n    .ba-workana-v3-stat:nth-child(even) {\n        min-height:\n            0;\n\n        padding:\n            17px 0;\n\n        border-right:\n            0;\n\n        border-bottom:\n            1px solid\n            var(--ba-border);\n    }\n\n\n    .ba-workana-v3-stat:last-child {\n        border-bottom:\n            0;\n    }\n\n}\n\n\n\n\/* =========================================================\n   REDUCED MOTION\n========================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    .ba-about-v3 *,\n    .ba-about-v3 *::before,\n    .ba-about-v3 *::after {\n        transition:\n            none !important;\n    }\n\n}\n\n<\/style>\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-3e79bb2 e-flex e-con-boxed e-con e-parent\" data-id=\"3e79bb2\" data-element_type=\"container\" data-e-type=\"container\" id=\"testimonials\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c8ff38f elementor-widget elementor-widget-html\" data-id=\"c8ff38f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ba-testimonials\" id=\"testimonials\">\n\n    <div class=\"ba-testimonials__header\">\n\n        <div class=\"ba-testimonials__heading\">\n            <span class=\"ba-testimonials__eyebrow\">TESTIMONIALS<\/span>\n\n            <h2 class=\"ba-testimonials__title\">\n                What clients say about working with me.\n            <\/h2>\n        <\/div>\n\n        <div class=\"ba-testimonials__proof\">\n\n            <div class=\"ba-testimonials__score\">\n                <strong class=\"ba-testimonials__score-value\">\n                    4.98<span>\/5<\/span>\n                <\/strong>\n\n                <div class=\"ba-testimonials__score-info\">\n                    <div\n                        class=\"ba-testimonials__score-stars\"\n                        aria-label=\"4.98 out of 5 stars\"\n                    >\n                        \u2605\u2605\u2605\u2605\u2605\n                    <\/div>\n\n                    <span class=\"ba-testimonials__score-label\">\n                        Average client rating on Workana\n                    <\/span>\n                <\/div>\n            <\/div>\n\n            <a\n                href=\"https:\/\/www.workana.com\/freelancer\/ea2b869fab8a6c869fdb11e210e89348\"\n                target=\"_blank\"\n                rel=\"noopener noreferrer\"\n                class=\"ba-testimonials__workana-link\"\n            >\n                View verified reviews\n                <span aria-hidden=\"true\">\u2197<\/span>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n\n\n    <div class=\"ba-testimonials__carousel\">\n\n        <div class=\"ba-testimonials__viewport\">\n\n            <div class=\"ba-testimonials__track\">\n\n                <!-- 01 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cIt was a pleasure working with Brayan. Communication was fluid,\n                        solutions were immediate, and he was always willing to improve\n                        things. Highly recommended.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n\n                            <!-- Si luego quieres poner foto, reemplaza NM por:\n                            <img decoding=\"async\" src=\"URL-DE-LA-FOTO\" alt=\"Nelson Medina\"> -->\n                            <div class=\"ba-testimonial__avatar\">NM<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Nelson Medina<\/strong>\n                                <span>WordPress &amp; WooCommerce<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 02 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cBrayan is an excellent professional. I've worked with him for some\n                        time maintaining my website. He's fast, professional and communicates\n                        well. I recommend him 100%.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">EV<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Elizabeth Vargas<\/strong>\n                                <span>Website Maintenance<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 03 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cA 10\/10 freelancer. He met the deadlines and delivered a great\n                        project. Throughout the process, he always looked for ways to add\n                        extra value. I would definitely work with him again.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">MA<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Marketing Agency<\/strong>\n                                <span>WordPress Development<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 04 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cHighly recommended. He leaves nothing unfinished, works very cleanly,\n                        communicates well, follows instructions and quickly understands what is required.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">RL<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Roberto Landeros<\/strong>\n                                <span>Web Development<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 05 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cExcellent developer, very responsible with his commitments and with\n                        excellent communication.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">JR<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Juan Pablo Rodr\u00edguez<\/strong>\n                                <span>WordPress Development<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 06 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cHis work is very high quality. He's receptive to feedback, contributes\n                        ideas and is genuinely committed to the project.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">DR<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>David Rodr\u00edguez<\/strong>\n                                <span>WordPress &amp; E-commerce<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 07 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cHighly recommended. He knew how to adapt to my needs and changes\n                        throughout the project. I consider him a very good professional.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">FD<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Francisco Javier Descalzo<\/strong>\n                                <span>Corporate WordPress Website<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n\n\n                <!-- 08 -->\n                <article class=\"ba-testimonial\">\n\n                    <div class=\"ba-testimonial__accent\" aria-hidden=\"true\"><\/div>\n\n                    <div class=\"ba-testimonial__top\">\n                        <div class=\"ba-testimonial__stars\" aria-label=\"5 out of 5 stars\">\n                            \u2605\u2605\u2605\u2605\u2605\n                        <\/div>\n\n                        <span class=\"ba-testimonial__verified\">Workana<\/span>\n                    <\/div>\n\n                    <div class=\"ba-testimonial__quote-mark\" aria-hidden=\"true\">\u201c<\/div>\n\n                    <blockquote class=\"ba-testimonial__quote\">\n                        \u201cExcellent professional. The work was very well done. I will hire\n                        his services again.\u201d\n                    <\/blockquote>\n\n                    <div class=\"ba-testimonial__footer\">\n                        <div class=\"ba-testimonial__client\">\n                            <div class=\"ba-testimonial__avatar\">MN<\/div>\n\n                            <div class=\"ba-testimonial__client-info\">\n                                <strong>Manuel N<\/strong>\n                                <span>Figma to WordPress<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n\n                    <span class=\"ba-testimonial__translation\">\n                        Translated from Spanish \u00b7 Verified on Workana\n                    <\/span>\n\n                <\/article>\n\n            <\/div>\n\n        <\/div>\n\n\n\n        <div class=\"ba-testimonials__controls\">\n\n            <div class=\"ba-testimonials__arrows\">\n                <button\n                    class=\"ba-testimonials__arrow ba-testimonials__arrow--prev\"\n                    type=\"button\"\n                    aria-label=\"Previous testimonials\"\n                >\n                    \u2190\n                <\/button>\n\n                <button\n                    class=\"ba-testimonials__arrow ba-testimonials__arrow--next\"\n                    type=\"button\"\n                    aria-label=\"Next testimonials\"\n                >\n                    \u2192\n                <\/button>\n            <\/div>\n\n            <div class=\"ba-testimonials__dots\" aria-label=\"Testimonials navigation\"><\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n\n<style>\n.ba-testimonials {\n    --test-text: #F5F7FA;\n    --test-muted: #B0B7C3;\n    --test-subtle: #858E9D;\n\n    --test-border: #222936;\n    --test-surface: #0C1017;\n    --test-surface-hover: #121823;\n\n    --test-accent: #D94B47;\n    --test-accent-strong: #F0625E;\n    --test-accent-soft: rgba(217, 75, 71, .10);\n    --test-accent-soft-2: rgba(217, 75, 71, .16);\n    --test-accent-border: rgba(217, 75, 71, .34);\n\n    width: 100%;\n    color: var(--test-text);\n}\n\n.ba-testimonials,\n.ba-testimonials * ,\n.ba-testimonials *::before,\n.ba-testimonials *::after {\n    box-sizing: border-box;\n}\n\n\/* =========================\n   HEADER\n========================= *\/\n\n.ba-testimonials__header {\n    display: flex;\n    align-items: flex-end;\n    justify-content: space-between;\n    gap: 48px;\n    margin-bottom: 42px;\n}\n\n.ba-testimonials__heading {\n    max-width: 760px;\n}\n\n.ba-testimonials__eyebrow {\n    display: block;\n    margin-bottom: 14px;\n    color: var(--test-accent);\n    font-size: 11px;\n    font-weight: 700;\n    line-height: 1;\n    letter-spacing: .16em;\n    text-transform: uppercase;\n}\n\n.ba-testimonials__title {\n    margin: 0;\n    color: var(--test-text);\n    font-family: inherit;\n    font-size: clamp(34px, 4vw, 52px);\n    font-weight: 650;\n    line-height: 1.08;\n    letter-spacing: -.04em;\n}\n\n\/* =========================\n   PROOF\n========================= *\/\n\n.ba-testimonials__proof {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n    gap: 16px;\n    flex-shrink: 0;\n}\n\n.ba-testimonials__score {\n    display: flex;\n    align-items: center;\n    gap: 18px;\n}\n\n.ba-testimonials__score-value {\n    color: var(--test-text);\n    font-size: 42px;\n    font-weight: 700;\n    line-height: 1;\n    letter-spacing: -.04em;\n    white-space: nowrap;\n}\n\n.ba-testimonials__score-value span {\n    color: var(--test-accent);\n}\n\n.ba-testimonials__score-info {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.ba-testimonials__score-stars {\n    color: var(--test-accent);\n    font-size: 17px;\n    line-height: 1;\n    letter-spacing: 3px;\n}\n\n.ba-testimonials__score-label {\n    color: var(--test-muted);\n    font-size: 15px;\n    line-height: 1.45;\n}\n\n.ba-testimonials__workana-link {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n\n    min-height: 42px;\n    padding: 11px 16px;\n\n    border: 1px solid var(--test-border);\n    border-radius: 12px;\n\n    background: transparent;\n    color: var(--test-text);\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 1;\n    text-decoration: none;\n\n    transition:\n        border-color .2s ease,\n        background-color .2s ease,\n        color .2s ease,\n        transform .2s ease;\n}\n\n.ba-testimonials__workana-link span {\n    color: var(--test-accent);\n    font-size: 15px;\n    transition: transform .2s ease;\n}\n\n.ba-testimonials__workana-link:hover {\n    border-color: var(--test-accent-border);\n    background: var(--test-accent-soft);\n    transform: translateY(-1px);\n}\n\n.ba-testimonials__workana-link:hover span {\n    transform: translate(2px, -2px);\n}\n\n\/* =========================\n   CAROUSEL\n========================= *\/\n\n.ba-testimonials__carousel {\n    width: 100%;\n}\n\n.ba-testimonials__viewport {\n    width: 100%;\n    overflow: hidden;\n    padding: 1px;\n}\n\n.ba-testimonials__track {\n    display: flex;\n    gap: 20px;\n    transition: transform .5s cubic-bezier(.22, .65, .25, 1);\n    will-change: transform;\n}\n\n\/* =========================\n   CARD\n========================= *\/\n\n.ba-testimonial {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    flex: 0 0 calc((100% - 40px) \/ 3);\n    min-width: 0;\n    min-height: 400px;\n    padding: 30px;\n    overflow: hidden;\n\n    border-radius: 14px;\n    background: var(--test-surface);\n    box-shadow: inset 0 0 0 1px var(--test-border);\n\n    opacity: 0;\n    transform: translateY(20px);\n\n    transition:\n        opacity .55s ease,\n        transform .55s ease,\n        background-color .25s ease,\n        box-shadow .25s ease;\n}\n\n.ba-testimonials.is-visible .ba-testimonial {\n    opacity: 1;\n    transform: translateY(0);\n}\n\n.ba-testimonials.is-visible .ba-testimonial:nth-child(1) { transition-delay: .04s; }\n.ba-testimonials.is-visible .ba-testimonial:nth-child(2) { transition-delay: .10s; }\n.ba-testimonials.is-visible .ba-testimonial:nth-child(3) { transition-delay: .16s; }\n\n.ba-testimonial:hover {\n    background: var(--test-surface-hover);\n    box-shadow:\n        inset 0 0 0 1px var(--test-accent-border),\n        0 12px 30px rgba(0, 0, 0, .14);\n    transform: translateY(-3px);\n}\n\n.ba-testimonial__accent {\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: 3;\n    width: 100%;\n    height: 2px;\n    background: linear-gradient(90deg, var(--test-accent), var(--test-accent-strong));\n    transform: scaleX(0);\n    transform-origin: left center;\n    transition: transform .35s cubic-bezier(.2, .7, .2, 1);\n    pointer-events: none;\n}\n\n.ba-testimonial:hover .ba-testimonial__accent {\n    transform: scaleX(1);\n}\n\n\/* =========================\n   CARD TOP\n========================= *\/\n\n.ba-testimonial__top {\n    position: relative;\n    z-index: 2;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 18px;\n    margin-bottom: 24px;\n}\n\n.ba-testimonial__stars {\n    color: var(--test-accent);\n    font-size: 14px;\n    line-height: 1;\n    letter-spacing: 3px;\n}\n\n.ba-testimonial__verified {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 28px;\n    padding: 6px 10px;\n    border: 1px solid var(--test-accent-border);\n    border-radius: 999px;\n    background: var(--test-accent-soft);\n    color: #F3B4B2;\n    font-size: 11px;\n    font-weight: 700;\n    line-height: 1;\n    letter-spacing: .03em;\n    text-transform: uppercase;\n}\n\n\/* =========================\n   QUOTE DECORATION\n========================= *\/\n\n.ba-testimonial__quote-mark {\n    position: absolute;\n    top: 56px;\n    right: 20px;\n    color: rgba(217, 75, 71, .07);\n    font-family: Georgia, serif;\n    font-size: 112px;\n    line-height: 1;\n    pointer-events: none;\n    transform: rotate(4deg);\n    transition:\n        color .3s ease,\n        transform .3s ease;\n}\n\n.ba-testimonial:hover .ba-testimonial__quote-mark {\n    color: rgba(217, 75, 71, .12);\n    transform: rotate(0deg) scale(1.04);\n}\n\n\/* =========================\n   QUOTE\n========================= *\/\n\n.ba-testimonial__quote {\n    position: relative;\n    z-index: 2;\n    flex: 1;\n    margin: 0 0 30px;\n    padding: 0;\n    border: 0;\n    color: var(--test-text);\n    font-size: 18px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1.72;\n    quotes: none;\n}\n\n\/* =========================\n   FOOTER\n========================= *\/\n\n.ba-testimonial__footer {\n    position: relative;\n    z-index: 2;\n    display: flex;\n    align-items: center;\n    width: 100%;\n}\n\n.ba-testimonial__client {\n    display: flex;\n    align-items: center;\n    gap: 13px;\n    min-width: 0;\n}\n\n.ba-testimonial__avatar {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    flex: 0 0 50px;\n    width: 50px;\n    height: 50px;\n    overflow: hidden;\n\n    border: 1px solid var(--test-accent-border);\n    border-radius: 50%;\n    background: var(--test-accent-soft);\n    color: #FFD8D6;\n    font-size: 13px;\n    font-weight: 700;\n    line-height: 1;\n}\n\n.ba-testimonial__avatar img {\n    display: block;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n}\n\n.ba-testimonial__client-info {\n    display: flex;\n    flex-direction: column;\n    gap: 5px;\n    min-width: 0;\n}\n\n.ba-testimonial__client-info strong {\n    overflow: hidden;\n    color: var(--test-text);\n    font-size: 15px;\n    font-weight: 600;\n    line-height: 1.3;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.ba-testimonial__client-info span {\n    color: var(--test-muted);\n    font-size: 13px;\n    line-height: 1.45;\n}\n\n.ba-testimonial__translation {\n    display: block;\n    margin-top: 18px;\n    padding-top: 15px;\n    border-top: 1px solid rgba(34, 41, 54, .9);\n    color: var(--test-subtle);\n    font-size: 12px;\n    line-height: 1.45;\n}\n\n\/* =========================\n   CONTROLS\n========================= *\/\n\n.ba-testimonials__controls {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 28px;\n    margin-top: 28px;\n}\n\n.ba-testimonials__arrows {\n    display: flex;\n    gap: 10px;\n}\n\n.ba-testimonials__arrow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    width: 46px;\n    height: 46px;\n    padding: 0;\n\n    border: 1px solid var(--test-border);\n    border-radius: 12px;\n\n    background: transparent;\n    color: var(--test-text);\n    font-size: 18px;\n    line-height: 1;\n    cursor: pointer;\n\n    transition:\n        color .2s ease,\n        border-color .2s ease,\n        background-color .2s ease,\n        transform .2s ease;\n}\n\n.ba-testimonials__arrow:hover:not(:disabled) {\n    border-color: var(--test-accent);\n    background: var(--test-accent);\n    color: #0A0D13;\n    transform: translateY(-1px);\n}\n\n.ba-testimonials__arrow:disabled {\n    opacity: .30;\n    cursor: default;\n}\n\n.ba-testimonials__dots {\n    display: flex;\n    align-items: center;\n    gap: 7px;\n}\n\n.ba-testimonials__dot {\n    width: 8px;\n    height: 8px;\n    margin: 0;\n    padding: 0;\n    border: 0;\n    border-radius: 999px;\n    background: #3A4350;\n    cursor: pointer;\n    transition:\n        width .2s ease,\n        background-color .2s ease,\n        transform .2s ease;\n}\n\n.ba-testimonials__dot:hover {\n    transform: scale(1.08);\n}\n\n.ba-testimonials__dot.is-active {\n    width: 24px;\n    background: var(--test-accent);\n}\n\n\/* =========================\n   TABLET\n========================= *\/\n\n@media (max-width: 1024px) {\n    .ba-testimonials__header {\n        align-items: flex-start;\n        gap: 34px;\n    }\n\n    .ba-testimonial {\n        flex-basis: calc((100% - 20px) \/ 2);\n    }\n}\n\n\/* =========================\n   MOBILE\n========================= *\/\n\n@media (max-width: 767px) {\n    .ba-testimonials__header {\n        flex-direction: column;\n        gap: 24px;\n        margin-bottom: 34px;\n    }\n\n    .ba-testimonials__title {\n        font-size: 34px;\n    }\n\n    .ba-testimonials__proof {\n        align-items: flex-start;\n    }\n\n    .ba-testimonials__score {\n        gap: 14px;\n        align-items: flex-start;\n        flex-direction: column;\n    }\n\n    .ba-testimonials__score-value {\n        font-size: 36px;\n    }\n\n    .ba-testimonials__score-stars {\n        font-size: 16px;\n    }\n\n    .ba-testimonials__score-label {\n        font-size: 14px;\n    }\n\n    .ba-testimonial {\n        flex-basis: 100%;\n        min-height: 360px;\n        padding: 24px;\n    }\n\n    .ba-testimonial__quote {\n        font-size: 17px;\n        line-height: 1.68;\n    }\n\n    .ba-testimonials__controls {\n        margin-top: 22px;\n    }\n}\n\n\/* =========================\n   REDUCED MOTION\n========================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n    .ba-testimonials__track,\n    .ba-testimonial,\n    .ba-testimonial__accent,\n    .ba-testimonial__quote-mark,\n    .ba-testimonials__workana-link span {\n        transition: none;\n    }\n\n    .ba-testimonial {\n        opacity: 1;\n        transform: none;\n    }\n\n    .ba-testimonial:hover {\n        transform: none;\n    }\n}\n<\/style>\n\n\n\n<script>\ndocument.addEventListener('DOMContentLoaded', function () {\n\n    \/* =========================\n       SCROLL REVEAL\n    ========================= *\/\n    const testimonialSections = document.querySelectorAll('.ba-testimonials');\n\n    if ('IntersectionObserver' in window) {\n        const observer = new IntersectionObserver(function (entries) {\n            entries.forEach(function (entry) {\n                if (entry.isIntersecting) {\n                    entry.target.classList.add('is-visible');\n                    observer.unobserve(entry.target);\n                }\n            });\n        }, {\n            threshold: 0.15\n        });\n\n        testimonialSections.forEach(function (section) {\n            observer.observe(section);\n        });\n    } else {\n        testimonialSections.forEach(function (section) {\n            section.classList.add('is-visible');\n        });\n    }\n\n    \/* =========================\n       CAROUSEL\n    ========================= *\/\n    const carousels = document.querySelectorAll('.ba-testimonials__carousel');\n\n    carousels.forEach(function (carousel) {\n\n        const track = carousel.querySelector('.ba-testimonials__track');\n        const cards = Array.from(carousel.querySelectorAll('.ba-testimonial'));\n        const prevButton = carousel.querySelector('.ba-testimonials__arrow--prev');\n        const nextButton = carousel.querySelector('.ba-testimonials__arrow--next');\n        const dotsContainer = carousel.querySelector('.ba-testimonials__dots');\n\n        if (!track || !cards.length) return;\n\n        let currentIndex = 0;\n        let visibleCards = getVisibleCards();\n        let pageCount = getPageCount();\n\n        function getVisibleCards() {\n            const width = window.innerWidth;\n            if (width <= 767) return 1;\n            if (width <= 1024) return 2;\n            return 3;\n        }\n\n        function getPageCount() {\n            return Math.max(1, Math.ceil(cards.length \/ visibleCards));\n        }\n\n        function updateCarousel() {\n            visibleCards = getVisibleCards();\n            pageCount = getPageCount();\n\n            if (currentIndex > pageCount - 1) {\n                currentIndex = pageCount - 1;\n            }\n\n            const cardWidth = cards[0].getBoundingClientRect().width;\n            const trackStyles = window.getComputedStyle(track);\n            const gap = parseFloat(trackStyles.columnGap || trackStyles.gap) || 0;\n            const offset = currentIndex * visibleCards * (cardWidth + gap);\n\n            track.style.transform = 'translate3d(-' + offset + 'px,0,0)';\n            prevButton.disabled = currentIndex === 0;\n            nextButton.disabled = currentIndex >= pageCount - 1;\n\n            updateDots();\n        }\n\n        function createDots() {\n            dotsContainer.innerHTML = '';\n\n            for (let i = 0; i < pageCount; i++) {\n                const dot = document.createElement('button');\n                dot.type = 'button';\n                dot.className = 'ba-testimonials__dot';\n                dot.setAttribute('aria-label', 'Go to testimonial group ' + (i + 1));\n\n                dot.addEventListener('click', function () {\n                    currentIndex = i;\n                    updateCarousel();\n                });\n\n                dotsContainer.appendChild(dot);\n            }\n        }\n\n        function updateDots() {\n            const dots = dotsContainer.querySelectorAll('.ba-testimonials__dot');\n\n            if (dots.length !== pageCount) {\n                createDots();\n                return updateDots();\n            }\n\n            dots.forEach(function (dot, index) {\n                dot.classList.toggle('is-active', index === currentIndex);\n            });\n        }\n\n        prevButton.addEventListener('click', function () {\n            if (currentIndex > 0) {\n                currentIndex--;\n                updateCarousel();\n            }\n        });\n\n        nextButton.addEventListener('click', function () {\n            if (currentIndex < pageCount - 1) {\n                currentIndex++;\n                updateCarousel();\n            }\n        });\n\n        let resizeTimer;\n\n        window.addEventListener('resize', function () {\n            clearTimeout(resizeTimer);\n\n            resizeTimer = setTimeout(function () {\n                const previousVisible = visibleCards;\n                visibleCards = getVisibleCards();\n\n                if (previousVisible !== visibleCards) {\n                    currentIndex = 0;\n                    createDots();\n                }\n\n                updateCarousel();\n            }, 150);\n        });\n\n        createDots();\n        updateCarousel();\n    });\n});\n<\/script>\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-9b96d90 elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con-boxed e-con e-parent\" data-id=\"9b96d90\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-0c79c1a e-con-full e-flex e-con e-child\" data-id=\"0c79c1a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-4770c21 e-con-full e-flex e-con e-child\" data-id=\"4770c21\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-51e9263 elementor-widget elementor-widget-dtr-subheading\" data-id=\"51e9263\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-subheading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t    <div class=\"dtr-subheading-wrapper \">\r\n                 \t<h2 class=\"dtr-subheading\">Latest Posts<\/h2>\r\n        \t\t<\/div>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4d7470b elementor-widget elementor-widget-dtr-heading\" data-id=\"4d7470b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"dtr-heading-wrapper \">\r\n                \t<h2 class=\"dtr-heading\">Get insights and ideas from my blog posts and articles<\/h2>\r\n        \t\t<\/div>\r\n\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-6a49fee e-con-full e-flex e-con e-child\" data-id=\"6a49fee\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1bb66c7 elementor-widget elementor-widget-dtr-button\" data-id=\"1bb66c7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t       \t<a class=\"dtr-btn  dtr-btn--has-icon dtr-btn--icon-right dtr-radius--round \" href=\"https:\/\/navein.tanshcreative.com\/blog\/\" role=\"button\">\r\n        \t\t\t                <span class=\"dtr-icon dtr-btn__icon\"><i class=\"icon-login-circle-fill\" aria-hidden=\"true\"><\/i><\/span>\r\n                                        <span class=\"dtr-btn__text\">More Posts<\/span>\r\n                <\/a>\r\n\t\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<div class=\"elementor-element elementor-element-dbfcf23 e-con-full e-flex e-con e-child\" data-id=\"dbfcf23\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a01d83d elementor-widget elementor-widget-dtr-posts-carousel\" data-id=\"a01d83d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"dtr-posts-carousel.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"swiper dtr-swiper swiper-container dtr-recentposts-carousel arrows\" data-swiper-autoplay-delay=\"7000\" data-swiper-autoplay=\"on\" data-swiper-loop=\"true\"><div class=\"swiper-wrapper dtr-radius--rounded\"><div class=\"swiper-slide dtr-post-block\" data-swiper-autoplay=\"7000\"><div class=\"dtr-post-block__content-wrapper\"><div class=\"dtr-post-block__img-wrapper\"><div class=\"dtr-overlay\"><\/div><a class=\"dtr-wrapping-link\" href=\"https:\/\/brayanangarita.com\/es\/design-high-converting-landing-page\/\" rel=\"bookmark\" aria-label=\"Design high converting landing page\"><\/a><img decoding=\"async\" src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2025\/02\/post-img9-1000x800.jpg\" alt=\"Design high converting landing page\"\/><\/div><div class=\"dtr-post-block__content\"><div class=\"dtr-post-block__meta dtr-meta\"><div class=\"dtr-meta-item dtr-meta-category\"><a href=\"https:\/\/brayanangarita.com\/es\/category\/visual\/\">Visual<\/a><\/div><a class=\"dtr-meta-item dtr-meta-author\" href=\"https:\/\/brayanangarita.com\/es\/author\/brayancamiloangaritagmail-com\/\">brayancamiloangarita@gmail.com<\/a><\/div><h4 class=\"dtr-post-block__title\"><a class=\"dtr-post-block__title-link\" href=\"https:\/\/brayanangarita.com\/es\/design-high-converting-landing-page\/\" rel=\"bookmark\">Design high converting landing page<\/a><\/h4><\/div><\/div><\/div><div class=\"swiper-slide dtr-post-block\" data-swiper-autoplay=\"7000\"><div class=\"dtr-post-block__content-wrapper\"><div class=\"dtr-post-block__img-wrapper\"><div class=\"dtr-overlay\"><\/div><a class=\"dtr-wrapping-link\" href=\"https:\/\/brayanangarita.com\/es\/treat-your-website-as-a-product\/\" rel=\"bookmark\" aria-label=\"Treat your website as a product\"><\/a><img decoding=\"async\" src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2025\/02\/post-img8-1000x800.jpg\" alt=\"Treat your website as a product\"\/><\/div><div class=\"dtr-post-block__content\"><div class=\"dtr-post-block__meta dtr-meta\"><div class=\"dtr-meta-item dtr-meta-category\"><a href=\"https:\/\/brayanangarita.com\/es\/category\/creative\/\">Creative<\/a><\/div><a class=\"dtr-meta-item dtr-meta-author\" href=\"https:\/\/brayanangarita.com\/es\/author\/brayancamiloangaritagmail-com\/\">brayancamiloangarita@gmail.com<\/a><\/div><h4 class=\"dtr-post-block__title\"><a class=\"dtr-post-block__title-link\" href=\"https:\/\/brayanangarita.com\/es\/treat-your-website-as-a-product\/\" rel=\"bookmark\">Treat your website as a product<\/a><\/h4><\/div><\/div><\/div><div class=\"swiper-slide dtr-post-block\" data-swiper-autoplay=\"7000\"><div class=\"dtr-post-block__content-wrapper\"><div class=\"dtr-post-block__img-wrapper\"><div class=\"dtr-overlay\"><\/div><a class=\"dtr-wrapping-link\" href=\"https:\/\/brayanangarita.com\/es\/essential-social-media-tips-for-small-business\/\" rel=\"bookmark\" aria-label=\"Essential social media tips for small business\"><\/a><img decoding=\"async\" src=\"https:\/\/brayanangarita.com\/wp-content\/uploads\/2025\/02\/post-img3-1000x800.jpg\" alt=\"Essential social media tips for small business\"\/><\/div><div class=\"dtr-post-block__content\"><div class=\"dtr-post-block__meta dtr-meta\"><div class=\"dtr-meta-item dtr-meta-category\"><a href=\"https:\/\/brayanangarita.com\/es\/category\/branding\/\">Branding<\/a><\/div><a class=\"dtr-meta-item dtr-meta-author\" href=\"https:\/\/brayanangarita.com\/es\/author\/brayancamiloangaritagmail-com\/\">brayancamiloangarita@gmail.com<\/a><\/div><h4 class=\"dtr-post-block__title\"><a class=\"dtr-post-block__title-link\" href=\"https:\/\/brayanangarita.com\/es\/essential-social-media-tips-for-small-business\/\" rel=\"bookmark\">Essential social media tips for small business<\/a><\/h4><\/div><\/div><\/div><\/div><div class=\"dtr-swiper-nav dtr-swiper-arrow-nav\"><div class=\"dtr-swiper-buttons-wrapper\"><div class=\"swiper-button-prev dtr-swiper-button dtr-recentposts__prev\"><\/div><div class=\"swiper-button-next dtr-swiper-button dtr-recentposts__next\"><\/div><\/div><\/div><\/div>\t\t\t\t<\/div>\n\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\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>WordPress &amp; WooCommerce Developer WordPress websites built for real businesses. I&#8217;m Brayan Angarita, a WordPress &amp; WooCommerce Developer based in Bogot\u00e1. I build, maintain and improve websites and e-commerce stores for businesses, agencies and marketing teams. View selected work Contact me 3+ Years of experience 41+ Projects completed 4.98\/5 Client rating Platinum Workana level Career [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_joinchat":[],"footnotes":""},"class_list":["post-2659","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/pages\/2659","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/comments?post=2659"}],"version-history":[{"count":493,"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/pages\/2659\/revisions"}],"predecessor-version":[{"id":3577,"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/pages\/2659\/revisions\/3577"}],"wp:attachment":[{"href":"https:\/\/brayanangarita.com\/es\/wp-json\/wp\/v2\/media?parent=2659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}