{"id":7907,"date":"2026-07-28T14:53:20","date_gmt":"2026-07-28T11:53:20","guid":{"rendered":"https:\/\/tafejd.com\/?page_id=7907"},"modified":"2026-08-04T13:24:36","modified_gmt":"2026-08-04T10:24:36","slug":"drive-innovation-and-transformation","status":"publish","type":"page","link":"https:\/\/tafejd.com\/ar\/drive-innovation-and-transformation\/","title":{"rendered":"Drive Innovation and Transformation"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><div class=\"vc-custom-col-spacing clearfix vc-col-spacing-30\"><section class=\"wpb_row vc_row-fluid vc_custom_1712345678906 vc_row-has-fill row-content-position-Default\"><div class=\"finax-container\"><div class=\"row-inner clearfix\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\">\n\t<div class=\"wpb_raw_code wpb_raw_html wpb_content_element\" >\n\t\t<div class=\"wpb_wrapper\">\n\t\t\t<!-- =========================================================\n     COPY EVERYTHING FROM <style> TO <\/section> (keep them together)\n     Paste into a WPBakery \"Raw HTML\" element (not a Text Block).\n     ========================================================= -->\n<style>\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&family=Sora:wght@600;700;800&display=swap');\n\n    \/* =========================================================\n       INNOVATION SECTION \u2014 self-contained, drop-in component\n       Palette:  navy #16324f \u00b7 gold #c4a768 \u00b7 slate #3a6475\n       Type:     Sora (display) \u00b7 Inter (body)  [+ safe fallbacks]\n       ========================================================= *\/\n\n    .innovation-section,\n    .innovation-section * {\n        box-sizing: border-box;\n    }\n\n    .innovation-section {\n        --navy: #16324f;\n        --gold: #c4a768;\n        --gold-deep: #9b7c3a;\n        --slate: #3a6475;\n        --ink: #23394d;\n        --muted: #5d6d7e;\n        --line: #e4eaf0;\n        --card-bg: #ffffff;\n        --font-display: \"Sora\", \"Segoe UI\", system-ui, -apple-system, Arial, sans-serif;\n        --font-body: \"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Arial, sans-serif;\n\n        padding: 64px 12px;\n        background:\n            radial-gradient(circle at 80% 10%, rgba(58, 100, 117, 0.08), transparent 40%),\n            radial-gradient(circle at 20% 90%, rgba(196, 167, 104, 0.07), transparent 38%),\n            #f6f9fc;\n        font-family: var(--font-body);\n        -webkit-font-smoothing: antialiased;\n        color: var(--ink);\n        line-height: 1.5;\n    }\n\n    .innovation-section .innovation-container {\n        width: 100%;\n        max-width: 1120px;\n        margin: 0 auto;\n    }\n\n    .innovation-section .innovation-wrapper {\n        position: relative;\n        overflow: hidden;\n        padding: 48px 34px;\n        background: linear-gradient(150deg, #ffffff 0%, #f8fbfe 100%);\n        border: 1px solid var(--line);\n        border-radius: 26px;\n        box-shadow: 0 24px 60px rgba(22, 50, 79, 0.09);\n    }\n\n    .innovation-section .innovation-wrapper::before {\n        content: \"\";\n        position: absolute;\n        top: 26px;\n        bottom: 26px;\n        left: 0;\n        width: 4px;\n        border-radius: 0 4px 4px 0;\n        background: linear-gradient(to bottom, var(--slate), rgba(58, 100, 117, 0.15));\n    }\n\n    .innovation-section .innovation-wrapper::after {\n        content: \"\";\n        position: absolute;\n        bottom: -140px;\n        left: -140px;\n        width: 320px;\n        height: 320px;\n        border-radius: 50%;\n        border: 1px solid rgba(58, 100, 117, 0.16);\n        box-shadow: inset 0 0 0 28px rgba(58, 100, 117, 0.04);\n        pointer-events: none;\n    }\n\n    \/* ---------------- Header ---------------- *\/\n    .innovation-section .innovation-header {\n        position: relative;\n        z-index: 1;\n        max-width: 760px;\n        margin: 0 auto 40px;\n        text-align: center;\n    }\n\n    .innovation-section .innovation-label {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        margin-bottom: 18px;\n        padding: 7px 15px;\n        color: var(--slate);\n        background: rgba(58, 100, 117, 0.10);\n        border: 1px solid rgba(58, 100, 117, 0.25);\n        border-radius: 40px;\n        font-size: 11.5px;\n        font-weight: 700;\n        letter-spacing: 1.6px;\n        text-transform: uppercase;\n    }\n    .innovation-section .innovation-label::before {\n        content: \"\";\n        width: 6px;\n        height: 6px;\n        border-radius: 50%;\n        background: var(--slate);\n    }\n\n    .innovation-section .innovation-main-title {\n        margin: 0 0 16px;\n        font-family: var(--font-display);\n        color: var(--navy);\n        font-size: clamp(29px, 4.4vw, 46px);\n        font-weight: 800;\n        line-height: 1.14;\n        letter-spacing: -0.8px;\n    }\n    .innovation-section .innovation-main-title span {\n        position: relative;\n        color: var(--slate);\n        white-space: nowrap;\n    }\n    .innovation-section .innovation-main-title span::after {\n        content: \"\";\n        position: absolute;\n        left: 0;\n        right: 0;\n        bottom: 3px;\n        height: 8px;\n        background: rgba(58, 100, 117, 0.18);\n        border-radius: 4px;\n        z-index: -1;\n    }\n\n    .innovation-section .innovation-sub-text {\n        max-width: 620px;\n        margin: 0 auto;\n        color: var(--muted);\n        font-size: 16.5px;\n        font-weight: 400;\n        line-height: 1.75;\n    }\n\n    \/* ---------------- Cards ---------------- *\/\n    .innovation-section .innovation-grid-2col {\n        position: relative;\n        z-index: 1;\n        display: grid;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 22px;\n    }\n\n    .innovation-section .innovation-box {\n        --accent: var(--slate);\n        position: relative;\n        min-width: 0;\n        display: flex;\n        align-items: flex-start;\n        gap: 16px;\n        padding: 26px 26px 26px 24px;\n        background: var(--card-bg);\n        border: 1px solid var(--line);\n        border-radius: 18px;\n        box-shadow: 0 6px 20px rgba(22, 50, 79, 0.04);\n        transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;\n    }\n    .innovation-section .innovation-box::before {\n        content: \"\";\n        position: absolute;\n        top: 0;\n        left: 24px;\n        right: 24px;\n        height: 3px;\n        background: var(--accent);\n        border-radius: 0 0 3px 3px;\n        transform: scaleX(.4);\n        transform-origin: left;\n        transition: transform .28s ease;\n    }\n    .innovation-section .innovation-box:hover {\n        transform: translateY(-6px);\n        border-color: rgba(58, 100, 117, 0.35);\n        box-shadow: 0 20px 40px rgba(22, 50, 79, 0.12);\n    }\n    .innovation-section .innovation-box:hover::before {\n        transform: scaleX(1);\n    }\n\n    .innovation-section .innovation-step {\n        position: absolute;\n        top: 20px;\n        right: 22px;\n        font-family: var(--font-display);\n        font-size: 13px;\n        font-weight: 700;\n        letter-spacing: 1px;\n        color: rgba(22, 50, 79, 0.20);\n    }\n\n    .innovation-section .innovation-icon {\n        display: inline-flex;\n        flex: 0 0 50px;\n        align-items: center;\n        justify-content: center;\n        width: 50px;\n        height: 50px;\n        color: var(--accent);\n        background: var(--icon-bg, rgba(58, 100, 117, 0.11));\n        border: 1px solid rgba(58, 100, 117, 0.16);\n        border-radius: 14px;\n    }\n    .innovation-section .innovation-icon svg {\n        width: 24px;\n        height: 24px;\n    }\n\n    .innovation-section .innovation-content {\n        min-width: 0;\n        flex: 1;\n    }\n    .innovation-section .innovation-content h3 {\n        margin: 3px 0 7px;\n        padding-right: 26px;\n        font-family: var(--font-display);\n        color: var(--navy);\n        font-size: 18.5px;\n        font-weight: 700;\n        line-height: 1.3;\n    }\n    .innovation-section .innovation-content p {\n        margin: 0;\n        color: var(--muted);\n        font-size: 15px;\n        line-height: 1.72;\n    }\n\n    \/* ---------------- Conclusion ---------------- *\/\n    .innovation-section .innovation-conclusion {\n        position: relative;\n        z-index: 1;\n        margin-top: 30px;\n        display: flex;\n        align-items: center;\n        gap: 16px;\n        padding: 22px 28px;\n        background: linear-gradient(135deg, var(--navy), #1f4568);\n        border-radius: 16px;\n        box-shadow: 0 14px 30px rgba(22, 50, 79, 0.22);\n    }\n    .innovation-section .innovation-conclusion .mark {\n        flex: 0 0 auto;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        width: 42px;\n        height: 42px;\n        color: var(--navy);\n        background: var(--gold);\n        border-radius: 12px;\n    }\n    .innovation-section .innovation-conclusion .mark svg {\n        width: 22px;\n        height: 22px;\n    }\n    .innovation-section .innovation-conclusion p {\n        margin: 0;\n        color: #eaf1f8;\n        font-size: 16px;\n        font-weight: 500;\n        line-height: 1.6;\n    }\n    .innovation-section .innovation-conclusion p b {\n        color: #fff;\n        font-weight: 700;\n    }\n\n    \/* ---------------- Responsive ---------------- *\/\n    @media (max-width: 900px) {\n        .innovation-section {\n            padding: 48px 10px;\n        }\n        .innovation-section .innovation-wrapper {\n            padding: 38px 22px;\n            border-radius: 22px;\n        }\n        .innovation-section .innovation-grid-2col {\n            gap: 18px;\n        }\n        .innovation-section .innovation-box {\n            padding: 24px 22px;\n        }\n    }\n\n    @media (max-width: 680px) {\n        .innovation-section {\n            padding: 32px 8px;\n        }\n        .innovation-section .innovation-wrapper {\n            padding: 28px 14px;\n            border-radius: 18px;\n        }\n        .innovation-section .innovation-wrapper::before {\n            top: 18px;\n            bottom: 18px;\n        }\n        .innovation-section .innovation-wrapper::after {\n            width: 200px;\n            height: 200px;\n            bottom: -90px;\n            left: -90px;\n        }\n        .innovation-section .innovation-header {\n            margin-bottom: 26px;\n        }\n        .innovation-section .innovation-sub-text {\n            font-size: 15px;\n        }\n        .innovation-section .innovation-grid-2col {\n            grid-template-columns: 1fr;\n            gap: 13px;\n        }\n        .innovation-section .innovation-box {\n            padding: 20px 18px;\n            border-radius: 15px;\n            gap: 14px;\n        }\n        .innovation-section .innovation-box:hover {\n            transform: none;\n        }\n        .innovation-section .innovation-icon {\n            flex-basis: 46px;\n            width: 46px;\n            height: 46px;\n            border-radius: 12px;\n        }\n        .innovation-section .innovation-icon svg {\n            width: 22px;\n            height: 22px;\n        }\n        .innovation-section .innovation-content h3 {\n            font-size: 17px;\n            margin-top: 2px;\n        }\n        .innovation-section .innovation-content p {\n            font-size: 14.5px;\n        }\n        .innovation-section .innovation-step {\n            top: 16px;\n            right: 18px;\n            font-size: 12px;\n        }\n        .innovation-section .innovation-conclusion {\n            flex-direction: column;\n            text-align: center;\n            gap: 14px;\n            padding: 22px 18px;\n        }\n    }\n\n    @media (max-width: 400px) {\n        .innovation-section .innovation-box {\n            gap: 12px;\n            padding: 18px 15px;\n        }\n        .innovation-section .innovation-icon {\n            flex-basis: 42px;\n            width: 42px;\n            height: 42px;\n        }\n        .innovation-section .innovation-content h3 {\n            font-size: 16px;\n            padding-right: 20px;\n        }\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n        .innovation-section .innovation-box,\n        .innovation-section .innovation-box::before {\n            transition: none;\n        }\n    }\n<\/style>\n\n<section class=\"innovation-section\">\n    <div class=\"innovation-container\">\n        <div class=\"innovation-wrapper\">\n\n            <!-- Header -->\n            <div class=\"innovation-header\">\n                <span class=\"innovation-label\">Innovation &amp; Transformation<\/span>\n                <h2 class=\"innovation-main-title\">\n                    Drive Innovation and <span>Transformation<\/span>\n                <\/h2>\n                <p class=\"innovation-sub-text\">\n                    Innovation is the foundation of sustainable growth. Organizations\n                    that integrate technology, industrial capabilities, and strategic\n                    expertise are better positioned to strengthen competitiveness,\n                    improve performance, and create long-term value.\n                <\/p>\n            <\/div>\n\n            <!-- Cards -->\n            <div class=\"innovation-grid-2col\">\n\n                <!-- 01 - Technology Transformation -->\n                <div class=\"innovation-box\" style=\"--accent:#3a6475; --icon-bg:rgba(58,100,117,0.11);\">\n                    <span class=\"innovation-step\">01<\/span>\n                    <span class=\"innovation-icon\" style=\"color:#3a6475; border-color:rgba(58,100,117,0.2);\">\n                        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                            <rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"\/>\n                            <line x1=\"8\" y1=\"21\" x2=\"16\" y2=\"21\"\/>\n                            <line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"21\"\/>\n                            <path d=\"M6 9h.01M10 9h.01M14 9h.01M18 9h.01\"\/>\n                            <path d=\"M6 13h.01M10 13h.01M14 13h.01M18 13h.01\"\/>\n                        <\/svg>\n                    <\/span>\n                    <div class=\"innovation-content\">\n                        <h3>Technology Transformation<\/h3>\n                        <p>Accelerate business performance by integrating advanced technologies that enhance efficiency, digital capability, and organizational effectiveness.<\/p>\n                    <\/div>\n                <\/div>\n\n                <!-- 02 - Industrial Innovation -->\n                <div class=\"innovation-box\" style=\"--accent:#b8933f; --icon-bg:rgba(196,167,104,0.13);\">\n                    <span class=\"innovation-step\">02<\/span>\n                    <span class=\"innovation-icon\">\n                        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                            <path d=\"M6 6L4 10l2 4 4-4z\"\/>\n                            <path d=\"M18 6l2 4-2 4-4-4z\"\/>\n                            <path d=\"M12 2v6\"\/>\n                            <path d=\"M12 16v6\"\/>\n                            <path d=\"M4 10h16\"\/>\n                        <\/svg>\n                    <\/span>\n                    <div class=\"innovation-content\">\n                        <h3>Industrial Innovation<\/h3>\n                        <p>Advance manufacturing capabilities through automation, robotics, advanced production technologies, and smart industrial solutions.<\/p>\n                    <\/div>\n                <\/div>\n\n                <!-- 03 - Knowledge & Capability Development -->\n                <div class=\"innovation-box\" style=\"--accent:#3a6475; --icon-bg:rgba(58,100,117,0.11);\">\n                    <span class=\"innovation-step\">03<\/span>\n                    <span class=\"innovation-icon\" style=\"color:#3a6475; border-color:rgba(58,100,117,0.2);\">\n                        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                            <path d=\"M12 2L2 7l10 5 10-5-10-5z\"\/>\n                            <path d=\"M2 17l10 5 10-5\"\/>\n                            <path d=\"M2 12l10 5 10-5\"\/>\n                        <\/svg>\n                    <\/span>\n                    <div class=\"innovation-content\">\n                        <h3>Knowledge &amp; Capability Development<\/h3>\n                        <p>Build future-ready organizations through specialized training, knowledge transfer, and workforce capability development aligned with evolving industry needs.<\/p>\n                    <\/div>\n                <\/div>\n\n                <!-- 04 - Strategic Transformation -->\n                <div class=\"innovation-box\" style=\"--accent:#b8933f; --icon-bg:rgba(196,167,104,0.13);\">\n                    <span class=\"innovation-step\">04<\/span>\n                    <span class=\"innovation-icon\">\n                        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                            <path d=\"M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z\"\/>\n                            <path d=\"M16 8L8 16\"\/>\n                            <path d=\"M16 16L8 8\"\/>\n                        <\/svg>\n                    <\/span>\n                    <div class=\"innovation-content\">\n                        <h3>Strategic Transformation<\/h3>\n                        <p>Align technology, people, and business strategy to create resilient organizations capable of adapting to changing markets and driving sustainable growth.<\/p>\n                    <\/div>\n                <\/div>\n\n            <\/div>\n\n            <!-- Conclusion -->\n            <div class=\"innovation-conclusion\">\n                <span class=\"mark\">\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M20 6L9 17l-5-5\"\/>\n                    <\/svg>\n                <\/span>\n                <p>Innovation creates lasting value when <b>technology<\/b>, <b>capability<\/b>, and <b>strategy<\/b> advance together.<\/p>\n            <\/div>\n\n        <\/div>\n    <\/div>\n<\/section>\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><\/section><\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"Innovation &amp; Transformation Drive Innovation and Transformation Innovation is the foundation of sustainable growth. Organizations that integrate technology, industrial capabilities, and strategic expertise are better positioned to strengthen competitiveness, improve performance, and create long-term value. 01 Technology Transformation Accelerate business performance by integrating advanced technologies that enhance efficiency, digital capability,","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7907","page","type-page","status-publish","hentry"],"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"tafejd","author_link":"https:\/\/tafejd.com\/ar\/author\/tafejd\/"},"rttpg_comment":0,"rttpg_category":null,"rttpg_excerpt":null,"_links":{"self":[{"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/pages\/7907","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/comments?post=7907"}],"version-history":[{"count":4,"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/pages\/7907\/revisions"}],"predecessor-version":[{"id":8056,"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/pages\/7907\/revisions\/8056"}],"wp:attachment":[{"href":"https:\/\/tafejd.com\/ar\/wp-json\/wp\/v2\/media?parent=7907"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}