{"id":23716,"date":"2026-05-06T05:11:38","date_gmt":"2026-05-06T05:11:38","guid":{"rendered":"https:\/\/zadigital.com.pk\/demo\/?page_id=23716"},"modified":"2026-05-06T08:15:28","modified_gmt":"2026-05-06T08:15:28","slug":"video-animation","status":"publish","type":"page","link":"https:\/\/zadigital.com.pk\/demo\/video-animation\/","title":{"rendered":"Video Animation"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"23716\" class=\"elementor elementor-23716\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6da2f70 elementor-section-full_width elementor-section-height-default elementor-section-height-default sc_fly_static\" data-id=\"6da2f70\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-extended\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4187ade sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"4187ade\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-6fdff0c sc_fly_static elementor-widget elementor-widget-html\" data-id=\"6fdff0c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n  .aigs-wrapper,\r\n  .aigs-wrapper *,\r\n  .aigs-wrapper *::before,\r\n  .aigs-wrapper *::after {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n  }\r\n  .aigs-wrapper {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 84vh;\r\n    min-height: 380px;\r\n    background:\r\n      radial-gradient(ellipse 45% 80% at 0% 70%, #4a1f8a 0%, transparent 60%),\r\n      radial-gradient(ellipse 20% 45% at 2% 90%, #2d0f5e 0%, transparent 55%),\r\n      #07071a;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    overflow: hidden;\r\n    font-family: 'Inter', sans-serif;\r\n  }\r\n  canvas#aigs-particles {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    opacity: 0.55;\r\n    pointer-events: none;\r\n  }\r\n  .aigs-arrow {\r\n    position: absolute;\r\n    bottom: 5%;\r\n    right: 4%;\r\n    width: clamp(28px, 4vw, 40px);\r\n    height: auto;\r\n    opacity: 0.35;\r\n    pointer-events: none;\r\n    z-index: 2;\r\n  }\r\n  .aigs-content {\r\n    position: relative;\r\n    z-index: 10;\r\n    padding: 0 7%;\r\n    width: 100%;\r\n    max-width: 1400px;\r\n    margin: 0 auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    text-align: center;\r\n  }\r\n  .aigs-headline {\r\n    font-size: clamp(32px, 7vw, 82px);\r\n    font-weight: 900;\r\n    line-height: 1.18;\r\n    letter-spacing: -0.025em;\r\n    color: #ffffff;\r\n    margin-bottom: clamp(10px, 1.8vh, 22px);\r\n  }\r\n  .aigs-gradient {\r\n    background: linear-gradient(135deg, #FF2DC8, #FF854E);\r\n    -webkit-background-clip: text;\r\n    -webkit-text-fill-color: transparent;\r\n    background-clip: text;\r\n  }\r\n  .aigs-subtitle {\r\n    font-size: clamp(13px, 1.05vw, 16px);\r\n    color: #ffffff;\r\n    font-weight: 400;\r\n    line-height: 1.5;\r\n    margin-bottom: clamp(16px, 2.5vh, 30px);\r\n    max-width: 760px;\r\n  }\r\n  .aigs-btn {\r\n    display: inline-block;\r\n    align-self: center;\r\n    background: #17144C;\r\n    color: #fff;\r\n    font-family: 'Inter', sans-serif;\r\n    font-size: clamp(13px, 0.95vw, 15px);\r\n    font-weight: 600;\r\n    padding: clamp(10px, 1.3vh, 14px) clamp(26px, 2.5vw, 38px);\r\n    border-radius: 10px;\r\n    text-decoration: none;\r\n    letter-spacing: 0.025em;\r\n    transition: background 0.3s ease, transform 0.3s ease;\r\n    cursor: pointer;\r\n    border: none;\r\n  }\r\n  .aigs-btn:hover {\r\n    background: #17144C;\r\n    color: white;\r\n    transform: translateY(-2px);\r\n  }\r\n  @media (max-height: 460px) {\r\n    .aigs-headline { font-size: 24px; margin-bottom: 8px; }\r\n    .aigs-subtitle { margin-bottom: 12px; font-size: 12px; }\r\n    .aigs-btn { padding: 7px 18px; }\r\n  }\r\n  @media (max-width: 480px) {\r\n    .aigs-content { padding: 0 8%; }\r\n  }\r\n<\/style>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700;800;900&display=swap\" rel=\"stylesheet\"\/>\r\n<div class=\"aigs-wrapper\" id=\"aigsWrapper\">\r\n  <canvas id=\"aigs-particles\"><\/canvas>\r\n  <div class=\"aigs-arrow\">\r\n    <svg viewBox=\"0 0 44 44\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n      <polyline points=\"4,4 40,4 40,40\" stroke=\"rgba(200,215,255,0.7)\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n      <line x1=\"4\" y1=\"40\" x2=\"40\" y2=\"4\" stroke=\"rgba(200,215,255,0.7)\" stroke-width=\"2.2\" stroke-linecap=\"round\"\/>\r\n    <\/svg>\r\n  <\/div>\r\n  <div class=\"aigs-content\">\r\n    <h1 class=\"aigs-headline\">\r\n      Explain It Once <span class=\"aigs-gradient\">Let the  <br>Animation<\/span> Do the Rest\r\n    <\/h1>\r\n    <p class=\"aigs-subtitle\">Some things are hard to explain with text. A well made animated video communicates your product, process or idea in under two minutes clearly, without needing someone to read three paragraphs to get it.<\/p>\r\n    <a href=\"#\" class=\"aigs-btn\">Let's Talk<\/a>\r\n  <\/div>\r\n<\/div>\r\n<script>\r\n(function() {\r\n  var canvas = document.getElementById('aigs-particles');\r\n  var wrapper = document.getElementById('aigsWrapper');\r\n  var ctx = canvas.getContext('2d');\r\n  var W, H, nodes, animId;\r\n  var NODE_COUNT = 55;\r\n  var MAX_DIST = 140;\r\n  var colors = ['#9b7fe8','#7ab5f7','#4ec9f8','#c084fc','#818cf8'];\r\n\r\n  function resize() {\r\n    W = canvas.width = wrapper.offsetWidth;\r\n    H = canvas.height = wrapper.offsetHeight;\r\n  }\r\n\r\n  function randColor() { return colors[Math.floor(Math.random() * colors.length)]; }\r\n\r\n  function initNodes() {\r\n    nodes = [];\r\n    for (var i = 0; i < NODE_COUNT; i++) {\r\n      nodes.push({\r\n        x: Math.random() * W,\r\n        y: Math.random() * H,\r\n        vx: (Math.random() - 0.5) * 0.45,\r\n        vy: (Math.random() - 0.5) * 0.45,\r\n        r: Math.random() * 1.8 + 1,\r\n        color: randColor(),\r\n        pulse: Math.random() * Math.PI * 2\r\n      });\r\n    }\r\n  }\r\n\r\n  function draw() {\r\n    ctx.clearRect(0, 0, W, H);\r\n\r\n    for (var i = 0; i < nodes.length; i++) {\r\n      var a = nodes[i];\r\n      for (var j = i + 1; j < nodes.length; j++) {\r\n        var b = nodes[j];\r\n        var dx = a.x - b.x, dy = a.y - b.y;\r\n        var dist = Math.sqrt(dx*dx + dy*dy);\r\n        if (dist < MAX_DIST) {\r\n          var alpha = (1 - dist \/ MAX_DIST) * 0.22;\r\n          ctx.beginPath();\r\n          ctx.strokeStyle = 'rgba(150,170,255,' + alpha + ')';\r\n          ctx.lineWidth = 0.7;\r\n          ctx.moveTo(a.x, a.y);\r\n          ctx.lineTo(b.x, b.y);\r\n          ctx.stroke();\r\n        }\r\n      }\r\n    }\r\n\r\n    for (var i = 0; i < nodes.length; i++) {\r\n      var n = nodes[i];\r\n      n.pulse += 0.018;\r\n      var pr = n.r + Math.sin(n.pulse) * 0.6;\r\n      ctx.beginPath();\r\n      ctx.arc(n.x, n.y, pr, 0, Math.PI * 2);\r\n      ctx.fillStyle = n.color;\r\n      ctx.globalAlpha = 0.75;\r\n      ctx.fill();\r\n      ctx.globalAlpha = 1;\r\n\r\n      n.x += n.vx;\r\n      n.y += n.vy;\r\n      if (n.x < 0 || n.x > W) n.vx *= -1;\r\n      if (n.y < 0 || n.y > H) n.vy *= -1;\r\n    }\r\n\r\n    animId = requestAnimationFrame(draw);\r\n  }\r\n\r\n  resize();\r\n  initNodes();\r\n  draw();\r\n\r\n  window.addEventListener('resize', function() {\r\n    resize();\r\n    initNodes();\r\n  });\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-69f2807 elementor-section-boxed elementor-section-height-default elementor-section-height-default sc_fly_static\" data-id=\"69f2807\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-extended\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-cb4a14e sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"cb4a14e\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-041b00b elementor--h-position-center elementor--v-position-middle sc_fly_static elementor-widget elementor-widget-slides\" data-id=\"041b00b\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;navigation&quot;:&quot;none&quot;,&quot;autoplay&quot;:&quot;yes&quot;,&quot;pause_on_hover&quot;:&quot;yes&quot;,&quot;pause_on_interaction&quot;:&quot;yes&quot;,&quot;autoplay_speed&quot;:5000,&quot;infinite&quot;:&quot;yes&quot;,&quot;transition&quot;:&quot;slide&quot;,&quot;transition_speed&quot;:500}\" data-widget_type=\"slides.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-swiper\">\n\t\t\t\t\t<div class=\"elementor-slides-wrapper elementor-main-swiper swiper\" role=\"region\" aria-roledescription=\"carousel\" aria-label=\"Slides\" dir=\"ltr\" data-animation=\"fadeInUp\">\n\t\t\t\t<div class=\"swiper-wrapper elementor-slides\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"elementor-repeater-item-83a2de5 swiper-slide\" role=\"group\" aria-roledescription=\"slide\"><div class=\"swiper-slide-bg\" role=\"img\" aria-label=\"img_184\"><\/div><div class=\"swiper-slide-inner\" ><div class=\"swiper-slide-contents\"><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-01de246 sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"01de246\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-62fc554 animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-trx_sc_title\" data-id=\"62fc554\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;,&quot;_animation_delay&quot;:200}\" data-widget_type=\"trx_sc_title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div\t\tclass=\"sc_title sc_title_default\" ><span class=\"sc_item_subtitle sc_title_subtitle sc_item_subtitle_above sc_item_title_style_default sc_item_subtitle_with_custom_color trx_addons_inline_1867475218\">Complete Services<\/span><h2 class=\"sc_item_title sc_title_title sc_item_title_style_default sc_item_title_tag\"\n\t\t\t><span class=\"sc_item_title_text\">What We Produce<\/span><\/h2><div class=\"sc_item_descr sc_title_descr\"><p>We create 2D animated explainer videos, motion graphics, product demo animations, whiteboard videos and animated social content. Every project starts with a script  because if the message is not clear in writing, the animation will not fix it. We write, animate and deliver videos that are built for the platform they will live on and sized correctly for wherever they will be viewed. <br \/>\nWe work with businesses that need to explain a complex product simply, launch something new or produce regular animated content for their marketing channels.<\/p>\n<\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b6bacdc sc_fly_static elementor-widget elementor-widget-spacer\" data-id=\"b6bacdc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-749a16c elementor-widget-divider--view-line animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-divider\" data-id=\"749a16c\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;,&quot;_animation_delay&quot;:300}\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-cf5b0fe bordered animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-accordion\" data-id=\"cf5b0fe\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;,&quot;_animation_delay&quot;:400}\" data-widget_type=\"accordion.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-accordion\">\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-2171\" class=\"elementor-tab-title\" data-tab=\"1\" role=\"button\" aria-controls=\"elementor-tab-content-2171\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M18,8.8l-5-5 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l3.6,3.6H2.4C2,8.6,1.6,8.9,1.6,9.4c0,0.4,0.3,0.8,0.8,0.8h13.2L12,13.8 c-0.3,0.3-0.3,0.8,0,1.1c0.3,0.3,0.8,0.3,1.1,0l5-5C18.3,9.6,18.3,9.1,18,8.8z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M16.1,15.3l0-7c0-0.4-0.3-0.8-0.8-0.8c-0.4,0-0.8,0.3-0.8,0.8l0,5.1L5.1,4.1 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l9.4,9.4l-5.1,0c-0.4,0-0.8,0.3-0.8,0.8c0,0.4,0.3,0.8,0.8,0.8l7,0 C15.7,16.1,16.1,15.7,16.1,15.3z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">Explainer Videos <\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-2171\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"region\" aria-labelledby=\"elementor-tab-title-2171\"><ul><li>60 to 90 second animated videos that explain what your product or service does and why it matters. Used on homepages, pitch decks and product pages.<\/li><\/ul><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-2172\" class=\"elementor-tab-title\" data-tab=\"2\" role=\"button\" aria-controls=\"elementor-tab-content-2172\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M18,8.8l-5-5 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l3.6,3.6H2.4C2,8.6,1.6,8.9,1.6,9.4c0,0.4,0.3,0.8,0.8,0.8h13.2L12,13.8 c-0.3,0.3-0.3,0.8,0,1.1c0.3,0.3,0.8,0.3,1.1,0l5-5C18.3,9.6,18.3,9.1,18,8.8z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M16.1,15.3l0-7c0-0.4-0.3-0.8-0.8-0.8c-0.4,0-0.8,0.3-0.8,0.8l0,5.1L5.1,4.1 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l9.4,9.4l-5.1,0c-0.4,0-0.8,0.3-0.8,0.8c0,0.4,0.3,0.8,0.8,0.8l7,0 C15.7,16.1,16.1,15.7,16.1,15.3z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">Motion Graphics <\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-2172\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"region\" aria-labelledby=\"elementor-tab-title-2172\"><ul><li>Animated graphics for intros, outros, lower thirds, data visualisations and branded content that moves. Works as standalone or layered onto live footage.<\/li><\/ul><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-2173\" class=\"elementor-tab-title\" data-tab=\"3\" role=\"button\" aria-controls=\"elementor-tab-content-2173\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M18,8.8l-5-5 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l3.6,3.6H2.4C2,8.6,1.6,8.9,1.6,9.4c0,0.4,0.3,0.8,0.8,0.8h13.2L12,13.8 c-0.3,0.3-0.3,0.8,0,1.1c0.3,0.3,0.8,0.3,1.1,0l5-5C18.3,9.6,18.3,9.1,18,8.8z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M16.1,15.3l0-7c0-0.4-0.3-0.8-0.8-0.8c-0.4,0-0.8,0.3-0.8,0.8l0,5.1L5.1,4.1 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l9.4,9.4l-5.1,0c-0.4,0-0.8,0.3-0.8,0.8c0,0.4,0.3,0.8,0.8,0.8l7,0 C15.7,16.1,16.1,15.7,16.1,15.3z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">Product Demo Animation <\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-2173\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"3\" role=\"region\" aria-labelledby=\"elementor-tab-title-2173\"><ul><li>Show how your product works step by step \u2014 without needing a camera, studio or live demo that goes wrong.<\/li><\/ul><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-abe6c44 bordered animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-accordion\" data-id=\"abe6c44\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;,&quot;_animation_delay&quot;:400}\" data-widget_type=\"accordion.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-accordion\">\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-1801\" class=\"elementor-tab-title\" data-tab=\"1\" role=\"button\" aria-controls=\"elementor-tab-content-1801\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M18,8.8l-5-5 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l3.6,3.6H2.4C2,8.6,1.6,8.9,1.6,9.4c0,0.4,0.3,0.8,0.8,0.8h13.2L12,13.8 c-0.3,0.3-0.3,0.8,0,1.1c0.3,0.3,0.8,0.3,1.1,0l5-5C18.3,9.6,18.3,9.1,18,8.8z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M16.1,15.3l0-7c0-0.4-0.3-0.8-0.8-0.8c-0.4,0-0.8,0.3-0.8,0.8l0,5.1L5.1,4.1 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l9.4,9.4l-5.1,0c-0.4,0-0.8,0.3-0.8,0.8c0,0.4,0.3,0.8,0.8,0.8l7,0 C15.7,16.1,16.1,15.7,16.1,15.3z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">Social Media Animation <\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1801\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"region\" aria-labelledby=\"elementor-tab-title-1801\"><ul><li>Short animated content designed for Instagram Reels, TikTok, LinkedIn and YouTube Shorts. Sized and formatted for each platform.<\/li><\/ul><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-1802\" class=\"elementor-tab-title\" data-tab=\"2\" role=\"button\" aria-controls=\"elementor-tab-content-1802\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M18,8.8l-5-5 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l3.6,3.6H2.4C2,8.6,1.6,8.9,1.6,9.4c0,0.4,0.3,0.8,0.8,0.8h13.2L12,13.8 c-0.3,0.3-0.3,0.8,0,1.1c0.3,0.3,0.8,0.3,1.1,0l5-5C18.3,9.6,18.3,9.1,18,8.8z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M16.1,15.3l0-7c0-0.4-0.3-0.8-0.8-0.8c-0.4,0-0.8,0.3-0.8,0.8l0,5.1L5.1,4.1 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l9.4,9.4l-5.1,0c-0.4,0-0.8,0.3-0.8,0.8c0,0.4,0.3,0.8,0.8,0.8l7,0 C15.7,16.1,16.1,15.7,16.1,15.3z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">Script & Voiceover <\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1802\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"region\" aria-labelledby=\"elementor-tab-title-1802\"><ul><li>We write the script and can source professional voiceover in the accent and tone that fits your audience UK, US or neutral.<\/li><\/ul><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-1803\" class=\"elementor-tab-title\" data-tab=\"3\" role=\"button\" aria-controls=\"elementor-tab-content-1803\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M18,8.8l-5-5 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l3.6,3.6H2.4C2,8.6,1.6,8.9,1.6,9.4c0,0.4,0.3,0.8,0.8,0.8h13.2L12,13.8 c-0.3,0.3-0.3,0.8,0,1.1c0.3,0.3,0.8,0.3,1.1,0l5-5C18.3,9.6,18.3,9.1,18,8.8z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 19.9 19.9\" style=\"enable-background:new 0 0 19.9 19.9;\" xml:space=\"preserve\"><path d=\"M16.1,15.3l0-7c0-0.4-0.3-0.8-0.8-0.8c-0.4,0-0.8,0.3-0.8,0.8l0,5.1L5.1,4.1 c-0.3-0.3-0.8-0.3-1.1,0c-0.3,0.3-0.3,0.8,0,1.1l9.4,9.4l-5.1,0c-0.4,0-0.8,0.3-0.8,0.8c0,0.4,0.3,0.8,0.8,0.8l7,0 C15.7,16.1,16.1,15.7,16.1,15.3z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">Branded Templates <\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1803\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"3\" role=\"region\" aria-labelledby=\"elementor-tab-title-1803\"><ul><li>Reusable animated templates built to your brand guidelines so you can produce consistent video content without starting from scratch every time.<\/li><\/ul><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-4aa2e4d elementor-widget-divider--view-line animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-divider\" data-id=\"4aa2e4d\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;,&quot;_animation_delay&quot;:500}\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-b32aa3a elementor-section-boxed elementor-section-height-default elementor-section-height-default sc_fly_static\" data-id=\"b32aa3a\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-extended\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-8a4cbf3 sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"8a4cbf3\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-bcfa6bb sc_layouts_hide_on_mobile sc_layouts_hide_on_notebook sc_layouts_hide_on_tablet sc_fly_static elementor-widget elementor-widget-spacer\" data-id=\"bcfa6bb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-eb392f6 sc_fly_static elementor-widget elementor-widget-text-editor\" data-id=\"eb392f6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><strong><b>OUR PROCESS<\/b><\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1fb3f5d sc_fly_static elementor-widget elementor-widget-heading\" data-id=\"1fb3f5d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">What we bring to the table<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-41379fe sc_fly_static elementor-widget elementor-widget-text-editor\" data-id=\"41379fe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Clear strategy, sharp execution, and outcomes you can actually measure<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-8cc31a3 elementor-section-full_width elementor-section-height-default elementor-section-height-default sc_fly_static\" data-id=\"8cc31a3\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-extended\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-316c3d8 sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"316c3d8\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-44ad974 sc_fly_static elementor-widget elementor-widget-html\" data-id=\"44ad974\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\">\r\n\r\n<style>\r\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');\r\n\r\n  * {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .cards-section {\r\n    font-family: 'DM Sans', sans-serif;\r\n    padding: 80px 24px;\r\n    background: #f4f4f9;\r\n    min-height: 100vh;\r\n    display: flex;\r\n    align-items: center;\r\n  }\r\n\r\n  .cards-wrapper {\r\n    max-width: 1240px;\r\n    margin: 0 auto;\r\n    width: 100%;\r\n  }\r\n\r\n  .cards-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(4, 1fr);\r\n    gap: 28px;\r\n  }\r\n\r\n  .card {\r\n    background: #ffffff;\r\n    border-radius: 24px;\r\n    padding: 44px 30px 40px;\r\n    text-align: center;\r\n    cursor: pointer;\r\n    position: relative;\r\n    overflow: hidden;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);\r\n    box-shadow:\r\n      0 2px 8px rgba(23, 20, 76, 0.06),\r\n      0 8px 32px rgba(23, 20, 76, 0.05);\r\n    border: 1.5px solid rgba(23, 20, 76, 0.07);\r\n  }\r\n\r\n  .card::before {\r\n    content: '';\r\n    position: absolute;\r\n    inset: 0;\r\n    background: linear-gradient(135deg, #17144c 0%, #2a2580 100%);\r\n    opacity: 0;\r\n    transition: opacity 0.4s ease;\r\n    z-index: 0;\r\n  }\r\n\r\n  .card:hover::before {\r\n    opacity: 1;\r\n  }\r\n\r\n  .card:hover {\r\n    transform: translateY(-10px);\r\n    border-color: transparent;\r\n    box-shadow:\r\n      0 20px 60px rgba(23, 20, 76, 0.35),\r\n      0 8px 24px rgba(23, 20, 76, 0.2);\r\n  }\r\n\r\n  \/* Step Number Badge *\/\r\n  .card-step {\r\n    position: absolute;\r\n    top: 18px;\r\n    right: 20px;\r\n    font-size: 11px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.08em;\r\n    color: #c0bedd;\r\n    text-transform: uppercase;\r\n    z-index: 1;\r\n    transition: color 0.4s ease;\r\n  }\r\n\r\n  .card:hover .card-step {\r\n    color: rgba(255,255,255,0.35);\r\n  }\r\n\r\n  \/* Icon Area *\/\r\n  .card-icon-wrap {\r\n    position: relative;\r\n    z-index: 1;\r\n    width: 76px;\r\n    height: 76px;\r\n    margin: 0 auto 28px;\r\n    border-radius: 20px;\r\n    background: linear-gradient(135deg, #fff0f4 0%, #ffe4ec 100%);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.4s ease;\r\n    box-shadow: 0 4px 16px rgba(232, 61, 107, 0.15);\r\n  }\r\n\r\n  .card:hover .card-icon-wrap {\r\n    background: rgba(255, 255, 255, 0.15);\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.2);\r\n  }\r\n\r\n  .card-icon-wrap i {\r\n    font-size: 30px;\r\n    color: #e83d6b;\r\n    transition: color 0.4s ease, transform 0.4s ease;\r\n  }\r\n\r\n  .card:hover .card-icon-wrap i {\r\n    color: #ffffff;\r\n    transform: scale(1.1) rotate(-5deg);\r\n  }\r\n\r\n  \/* Title *\/\r\n  .card-title {\r\n    position: relative;\r\n    z-index: 1;\r\n    font-size: 19px;\r\n    font-weight: 700;\r\n    color: #17144c;\r\n    margin-bottom: 16px;\r\n    line-height: 1.35;\r\n    transition: color 0.4s ease;\r\n    letter-spacing: -0.01em;\r\n  }\r\n\r\n  .card:hover .card-title {\r\n    color: #ffffff;\r\n  }\r\n\r\n  \/* Divider *\/\r\n  .card-divider {\r\n    position: relative;\r\n    z-index: 1;\r\n    width: 36px;\r\n    height: 3px;\r\n    background: #e83d6b;\r\n    border-radius: 99px;\r\n    margin: 0 auto 18px;\r\n    transition: background 0.4s ease, width 0.4s ease;\r\n  }\r\n\r\n  .card:hover .card-divider {\r\n    background: rgba(255,255,255,0.5);\r\n    width: 52px;\r\n  }\r\n\r\n  \/* Text *\/\r\n  .card-text {\r\n    position: relative;\r\n    z-index: 1;\r\n    font-size: 14.5px;\r\n    font-weight: 400;\r\n    color: #6e6e90;\r\n    line-height: 1.75;\r\n    transition: color 0.4s ease;\r\n  }\r\n\r\n  .card:hover .card-text {\r\n    color: rgba(255, 255, 255, 0.78);\r\n  }\r\n\r\n  \/* =====================\r\n     RESPONSIVE BREAKPOINTS\r\n     ===================== *\/\r\n\r\n  \/* Large Laptop *\/\r\n  @media (max-width: 1280px) {\r\n    .cards-grid {\r\n      gap: 22px;\r\n    }\r\n    .card {\r\n      padding: 38px 22px 34px;\r\n    }\r\n  }\r\n\r\n  \/* Tablet Landscape \/ Small Laptop *\/\r\n  @media (max-width: 1024px) {\r\n    .cards-grid {\r\n      grid-template-columns: repeat(2, 1fr);\r\n      gap: 22px;\r\n    }\r\n    .cards-section {\r\n      padding: 60px 20px;\r\n    }\r\n  }\r\n\r\n  \/* Tablet Portrait *\/\r\n  @media (max-width: 768px) {\r\n    .cards-grid {\r\n      grid-template-columns: repeat(2, 1fr);\r\n      gap: 18px;\r\n    }\r\n    .card {\r\n      padding: 34px 20px 30px;\r\n    }\r\n    .card-title {\r\n      font-size: 17px;\r\n    }\r\n    .card-text {\r\n      font-size: 13.5px;\r\n    }\r\n    .card-icon-wrap {\r\n      width: 66px;\r\n      height: 66px;\r\n    }\r\n    .card-icon-wrap i {\r\n      font-size: 26px;\r\n    }\r\n  }\r\n\r\n  \/* Large Phone *\/\r\n  @media (max-width: 600px) {\r\n    .cards-grid {\r\n      grid-template-columns: 1fr;\r\n      gap: 16px;\r\n    }\r\n    .cards-section {\r\n      padding: 48px 16px;\r\n    }\r\n    .card {\r\n      padding: 36px 28px 32px;\r\n      border-radius: 20px;\r\n    }\r\n    .card:hover {\r\n      transform: translateY(-5px);\r\n    }\r\n  }\r\n\r\n  \/* Small Phone *\/\r\n  @media (max-width: 390px) {\r\n    .card {\r\n      padding: 30px 20px 28px;\r\n    }\r\n    .card-title {\r\n      font-size: 16px;\r\n    }\r\n    .card-text {\r\n      font-size: 13px;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<section class=\"cards-section\">\r\n  <div class=\"cards-wrapper\">\r\n    <div class=\"cards-grid\">\r\n\r\n      <div class=\"card\">\r\n        <span class=\"card-step\">01<\/span>\r\n        <div class=\"card-icon-wrap\"><i class=\"fa-solid fa-pen-nib\"><\/i><\/div>\r\n        <div class=\"card-title\">Brief &<br>Script<\/div>\r\n        <div class=\"card-line\"><\/div>\r\n        <div class=\"card-text\">We discuss the message, the audience and the platform. Then we write the script. You review and approve before anything gets drawn or animated.<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"card\">\r\n        <span class=\"card-step\">02<\/span>\r\n        <div class=\"card-icon-wrap\"><i class=\"fa-solid fa-film\"><\/i><\/div>\r\n        <div class=\"card-title\">Story<br>board<\/div>\r\n        <div class=\"card-line\"><\/div>\r\n        <div class=\"card-text\">We sketch out how the video will look scene by scene. This is your chance to adjust the visual direction before the animation work begins.<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"card\">\r\n        <span class=\"card-step\">03<\/span>\r\n        <div class=\"card-icon-wrap\"><i class=\"fa-solid fa-clapperboard\"><\/i><\/div>\r\n        <div class=\"card-title\">Animation<\/div>\r\n        <div class=\"card-line\"><\/div>\r\n        <div class=\"card-text\">We animate, add music and voiceover and produce a first cut for your review. Feedback rounds are structured so revisions are clear and efficient.<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"card\">\r\n        <span class=\"card-step\">04<\/span>\r\n        <div class=\"card-icon-wrap\"><i class=\"fa-solid fa-file-video\"><\/i><\/div>\r\n        <div class=\"card-title\">Final<br>Delivery<\/div>\r\n        <div class=\"card-line\"><\/div>\r\n        <div class=\"card-text\">We deliver the final video in the formats and resolutions you need \u2014 MP4, MOV, web-optimised and platform-sized versions included.<\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-2af9de4 elementor-section-boxed elementor-section-height-default elementor-section-height-default sc_fly_static\" data-id=\"2af9de4\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-extended\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1ae9abe sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"1ae9abe\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-dbaeb7e sc_fly_static elementor-widget elementor-widget-heading\" data-id=\"dbaeb7e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Questions Clients Ask Us Most<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-30a376a animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-toggle\" data-id=\"30a376a\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;,&quot;_animation_delay&quot;:200}\" data-widget_type=\"toggle.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-toggle\">\n\t\t\t\t\t\t\t<div class=\"elementor-toggle-item\">\n\t\t\t\t\t<h5 id=\"elementor-tab-title-5101\" class=\"elementor-tab-title\" data-tab=\"1\" role=\"button\" aria-controls=\"elementor-tab-content-5101\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon elementor-toggle-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon-closed\"><i class=\"fas fa-plus\"><\/i><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon-opened\"><i class=\"elementor-toggle-icon-opened fas fa-minus\"><\/i><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-toggle-title\" tabindex=\"0\">How long does an animated video take to produce?<\/a>\n\t\t\t\t\t<\/h5>\n\n\t\t\t\t\t<div id=\"elementor-tab-content-5101\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"region\" aria-labelledby=\"elementor-tab-title-5101\"><p>A standard 60 to 90 second explainer takes 3 to 4 weeks from approved script to final delivery. Shorter social content takes less. Timelines depend on revision speed on your end as much as ours.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-toggle-item\">\n\t\t\t\t\t<h5 id=\"elementor-tab-title-5102\" class=\"elementor-tab-title\" data-tab=\"2\" role=\"button\" aria-controls=\"elementor-tab-content-5102\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon elementor-toggle-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon-closed\"><i class=\"fas fa-plus\"><\/i><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon-opened\"><i class=\"elementor-toggle-icon-opened fas fa-minus\"><\/i><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-toggle-title\" tabindex=\"0\">Can you match our existing brand style?id ads?<\/a>\n\t\t\t\t\t<\/h5>\n\n\t\t\t\t\t<div id=\"elementor-tab-content-5102\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"region\" aria-labelledby=\"elementor-tab-title-5102\"><p>Yes. We work from your brand guidelines and adapt the visual style to match. If you do not have guidelines, we develop a style that fits and document it for future use.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-toggle-item\">\n\t\t\t\t\t<h5 id=\"elementor-tab-title-5103\" class=\"elementor-tab-title\" data-tab=\"3\" role=\"button\" aria-controls=\"elementor-tab-content-5103\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon elementor-toggle-icon-right\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon-closed\"><i class=\"fas fa-plus\"><\/i><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-toggle-icon-opened\"><i class=\"elementor-toggle-icon-opened fas fa-minus\"><\/i><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-toggle-title\" tabindex=\"0\">Do we get the source files?<\/a>\n\t\t\t\t\t<\/h5>\n\n\t\t\t\t\t<div id=\"elementor-tab-content-5103\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"3\" role=\"region\" aria-labelledby=\"elementor-tab-title-5103\"><p>Yes. Source files are included so you can make minor text or data updates in future without commissioning a new video from scratch.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-ea736a4 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default sc_fly_static\" data-id=\"ea736a4\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-extended\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-c4878b6 sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"c4878b6\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div data-animation-type=\"block\" class=\"elementor-element elementor-element-35093b3 elementor-widget__width-initial animation_type_block sc_fly_static elementor-invisible elementor-widget elementor-widget-trx_sc_title\" data-id=\"35093b3\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;ann-fadein&quot;}\" data-widget_type=\"trx_sc_title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div\t\tclass=\"sc_title sc_title_default\" ><span class=\"sc_item_subtitle sc_title_subtitle sc_item_subtitle_above sc_item_title_style_default sc_item_subtitle_with_custom_color trx_addons_inline_1219785676\">Join the community<\/span><h1 class=\"sc_item_title sc_title_title sc_item_title_style_default sc_item_title_tag\"\n\t\t\t><span class=\"sc_item_title_text\">Have Something That Is Hard to Explain in Text?<\/span><\/h1><div class=\"sc_item_descr sc_title_descr\"><p>Tell us about it. We will tell you how long it would take, what it would cost and whether animation is the right format for what you are trying to communicate.<\/p>\n<\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-85e35eb sc_height_small sc_fly_static elementor-widget elementor-widget-spacer\" data-id=\"85e35eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-22b5f7a sc_fly_static elementor-widget elementor-widget-button\" data-id=\"22b5f7a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Get an Animation Quote \u2192<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-b934963 up-translateZ-wrap sc_content_align_inherit sc_layouts_column_icons_position_left sc_fly_static\" data-id=\"b934963\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c34b5e5 sc_fly_static elementor-widget elementor-widget-html\" data-id=\"c34b5e5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n.flag-wrap {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 420px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.flag-bubble {\r\n  position: absolute;\r\n  width: 74px; height: 74px; border-radius: 50%;\r\n  background: #fff; box-shadow: 0 4px 18px rgba(0,0,0,0.10);\r\n  display: flex; align-items: center; justify-content: center;\r\n  font-size: 38px; user-select: none; z-index: 2;\r\n  will-change: transform;\r\n}\r\n.flag-bubble.sm { width: 54px; height: 54px; font-size: 28px; }\r\n\r\n.f-uk { top: 3%;  left: 58%; }\r\n.f-ca { top: 16%; left: 15%; }\r\n.f-us { top: 38%; left: 42%; }\r\n.f-es { top: 28%; left: 80%; }\r\n.f-it { top: 58%; left: 18%; }\r\n.f-de { top: 60%; left: 60%; }\r\n.f-se { top: 82%; left: 35%; }\r\n\r\n\r\n<\/style>\r\n\r\n<div class=\"flag-wrap\" id=\"flagWrap\">\r\n  <svg style=\"position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;\" width=\"420\" height=\"420\" viewBox=\"0 0 420 420\" fill=\"none\">\r\n    <circle cx=\"210\" cy=\"210\" r=\"150\" stroke=\"rgba(100,100,130,0.22)\" stroke-width=\"1.5\" stroke-dasharray=\"7 8\"\/>\r\n    <circle cx=\"210\" cy=\"210\" r=\"95\"  stroke=\"rgba(100,100,130,0.18)\" stroke-width=\"1.5\" stroke-dasharray=\"5 7\"\/>\r\n  <\/svg>\r\n  <div class=\"flag-bubble f-uk\"    data-strength=\"22\">\ud83c\uddec\ud83c\udde7<\/div>\r\n  <div class=\"flag-bubble f-ca\"    data-strength=\"18\">\ud83c\udde8\ud83c\udde6<\/div>\r\n  <div class=\"flag-bubble f-us\"    data-strength=\"28\">\ud83c\uddfa\ud83c\uddf8<\/div>\r\n  <div class=\"flag-bubble f-es sm\" data-strength=\"14\">\ud83c\uddea\ud83c\uddf8<\/div>\r\n  <div class=\"flag-bubble f-it\"    data-strength=\"20\">\ud83c\uddee\ud83c\uddf9<\/div>\r\n  <div class=\"flag-bubble f-de\"    data-strength=\"25\">\ud83c\udde9\ud83c\uddea<\/div>\r\n  <div class=\"flag-bubble f-se\"    data-strength=\"16\">\ud83c\uddf8\ud83c\uddea<\/div>\r\n  <div class=\"dot\"><\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n  var wrap  = document.getElementById('flagWrap');\r\n  var flags = wrap.querySelectorAll('.flag-bubble');\r\n  var cur   = Array.from(flags).map(function(){ return {x:0,y:0}; });\r\n  var tgt   = Array.from(flags).map(function(){ return {x:0,y:0}; });\r\n\r\n  document.addEventListener('mousemove', function(e){\r\n    var rect = wrap.getBoundingClientRect();\r\n    var normX = ((e.clientX - rect.left)  \/ rect.width  - 0.5) * 2;\r\n    var normY = ((e.clientY - rect.top)   \/ rect.height - 0.5) * 2;\r\n    flags.forEach(function(flag, i){\r\n      var s = parseFloat(flag.dataset.strength);\r\n      tgt[i].x = normX * s * -1;\r\n      tgt[i].y = normY * s * -1;\r\n    });\r\n  });\r\n\r\n  document.addEventListener('mouseleave', function(){\r\n    flags.forEach(function(_, i){ tgt[i].x = 0; tgt[i].y = 0; });\r\n  });\r\n\r\n  function lerp(a,b,t){ return a+(b-a)*t; }\r\n\r\n  function tick(){\r\n    flags.forEach(function(flag, i){\r\n      var ease = 0.07 + i * 0.005;\r\n      cur[i].x = lerp(cur[i].x, tgt[i].x, ease);\r\n      cur[i].y = lerp(cur[i].y, tgt[i].y, ease);\r\n      flag.style.transform = 'translate('+cur[i].x.toFixed(2)+'px,'+cur[i].y.toFixed(2)+'px)';\r\n      var dist = Math.sqrt(cur[i].x*cur[i].x + cur[i].y*cur[i].y);\r\n      flag.style.boxShadow = '0 '+(4+dist*0.4)+'px '+(8+dist*0.8)+'px rgba(0,0,0,'+(0.08+dist*0.003)+')';\r\n    });\r\n    requestAnimationFrame(tick);\r\n  }\r\n  tick();\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Explain It Once Let the Animation Do the Rest Some things are hard to explain with text. A well made animated video communicates your product, process or idea in under&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pmpro_default_level":"","footnotes":""},"class_list":["post-23716","page","type-page","status-publish","hentry","pmpro-has-access"],"_links":{"self":[{"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/pages\/23716","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/comments?post=23716"}],"version-history":[{"count":28,"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/pages\/23716\/revisions"}],"predecessor-version":[{"id":23816,"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/pages\/23716\/revisions\/23816"}],"wp:attachment":[{"href":"https:\/\/zadigital.com.pk\/demo\/wp-json\/wp\/v2\/media?parent=23716"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}