Ripple Grid<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n html, body { background: #0a0a0a; overflow-x: hidden; }\n\n #wrap {\n position: relative;\n height: 400vh;\n }\n\n #sticky {\n position: sticky;\n top: 0;\n width: 100%;\n height: 100vh;\n overflow: hidden;\n }\n\n canvas {\n display: block;\n width: 100%;\n height: 100%;\n }\n <\/style>\n<\/head>\n<body>\n\n<div id=\"wrap\">\n <div id=\"sticky\">\n <canvas id=\"c\"><\/canvas>\n <\/div>\n<\/div>\n\n<script type=\"module\">\n import { Renderer, Program, Triangle, Mesh } from 'https:\/\/esm.sh\/ogl';\n\n const canvas = document.getElementById('c');\n const wrap = document.getElementById('wrap');\n const sticky = document.getElementById('sticky');\n\n const renderer = new Renderer({ canvas, dpr: Math.min(window.devicePixelRatio, 2), alpha: true });\n const gl = renderer.gl;\n gl.clearColor(0.04, 0.04, 0.04, 1);\n gl.enable(gl.BLEND);\n gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);\n\n const vert = `\n attribute vec2 position;\n varying vec2 vUv;\n void main() {\n vUv = position * 0.5 + 0.5;\n gl_Position = vec4(position, 0.0, 1.0);\n }`;\n\n const frag = `precision highp float;\n uniform float iTime;\n uniform vec2 iResolution;\n uniform vec3 gridColor;\n uniform float rippleIntensity;\n uniform float gridSize;\n uniform float gridThickness;\n uniform float fadeDistance;\n uniform float vignetteStrength;\n uniform float glowIntensity;\n uniform float opacity;\n uniform float gridRotation;\n uniform bool mouseInteraction;\n uniform vec2 mousePosition;\n uniform float mouseInfluence;\n uniform float mouseInteractionRadius;\n uniform float noiseIntensity;\n varying vec2 vUv;\n\n float pi = 3.141592;\n\n mat2 rotMat(float angle) {\n float s = sin(angle); float c = cos(angle);\n return mat2(c, -s, s, c);\n }\n\n float random(vec2 st) {\n return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n }\n\n void main() {\n vec2 uv = vUv * 2.0 - 1.0;\n uv.x *= iResolution.x \/ iResolution.y;\n\n float rot = gridRotation * pi \/ 180.0;\n if (rot != 0.0) uv = rotMat(rot) * uv;\n\n float dist = length(uv);\n float func = sin(pi * (iTime - dist));\n vec2 rippleUv = uv + uv * func * rippleIntensity;\n\n if (mouseInteraction && mouseInfluence > 0.0) {\n vec2 mouseUv = (mousePosition * 2.0 - 1.0);\n mouseUv.x *= iResolution.x \/ iResolution.y;\n float mouseDist = length(uv - mouseUv);\n float influence = mouseInfluence * exp(-mouseDist * mouseDist \/ (mouseInteractionRadius * mouseInteractionRadius));\n float mouseWave = sin(pi * (iTime * 2.0 - mouseDist * 3.0)) * influence;\n rippleUv += normalize(uv - mouseUv) * mouseWave * rippleIntensity * 0.3;\n }\n\n vec2 a = sin(gridSize * 0.5 * pi * rippleUv - pi \/ 2.0);\n vec2 b = abs(a);\n float aaWidth = 0.5;\n vec2 smoothB = vec2(\n smoothstep(0.0, aaWidth, b.x),\n smoothstep(0.0, aaWidth, b.y)\n );\n\n vec3 color = vec3(0.0);\n color += exp(-gridThickness * smoothB.x * (0.8 + 0.5 * sin(pi * iTime)));\n color += exp(-gridThickness * smoothB.y);\n color += 0.5 * exp(-(gridThickness \/ 4.0) * sin(smoothB.x));\n color += 0.5 * exp(-(gridThickness \/ 3.0) * smoothB.y);\n\n if (glowIntensity > 0.0) {\n color += glowIntensity * exp(-gridThickness * 0.5 * smoothB.x);\n color += glowIntensity * exp(-gridThickness * 0.5 * smoothB.y);\n }\n\n float ddd = exp(-2.0 * clamp(pow(dist, fadeDistance), 0.0, 1.0));\n vec2 vignetteCoords = vUv - 0.5;\n float vignetteDistance = length(vignetteCoords);\n float vignette = 1.0 - pow(vignetteDistance * 2.0, vignetteStrength);\n vignette = clamp(vignette, 0.0, 1.0);\n\n float finalFade = ddd * vignette;\n float baseAlpha = length(color) * finalFade * opacity;\n vec3 finalColor = color * gridColor * finalFade * opacity;\n\n float noiseValue = random(vUv * iResolution + fract(iTime));\n if (noiseIntensity > 0.0) finalColor += (noiseValue - 0.5) * noiseIntensity;\n\n float finalAlpha = clamp(baseAlpha + (noiseValue * noiseIntensity), 0.0, 1.0);\n gl_FragColor = vec4(finalColor, finalAlpha);\n }`;\n\n const uniforms = {\n iTime: { value: 0 },\n iResolution: { value: [1, 1] },\n gridColor: { value: [1, 1, 1] },\n rippleIntensity: { value: 0.02 },\n gridSize: { value: 15.0 },\n gridThickness: { value: 15.0 },\n fadeDistance: { value: 1.5 },\n vignetteStrength: { value: 0.2 },\n glowIntensity: { value: 3.0 },\n opacity: { value: 0.2 },\n gridRotation: { value: 0 },\n mouseInteraction: { value: true },\n mousePosition: { value: [0.5, 0.5] },\n mouseInfluence: { value: 0 },\n mouseInteractionRadius: { value: 1 },\n noiseIntensity: { value: 0.3 }\n };\n\n const geo = new Triangle(gl);\n const program = new Program(gl, { vertex: vert, fragment: frag, uniforms });\n const mesh = new Mesh(gl, { geometry: geo, program });\n\n const resize = () => {\n const w = sticky.clientWidth;\n const h = sticky.clientHeight;\n renderer.setSize(w, h);\n uniforms.iResolution.value = [w, h];\n };\n window.addEventListener('resize', resize);\n resize();\n\n let mouse = { x: 0.5, y: 0.5 };\n let targetMouse = { x: 0.5, y: 0.5 };\n let targetInfluence = 0;\n\n sticky.addEventListener('mousemove', e => {\n const r = sticky.getBoundingClientRect();\n targetMouse = {\n x: (e.clientX - r.left) \/ r.width,\n y: 1 - (e.clientY - r.top) \/ r.height\n };\n });\n sticky.addEventListener('mouseenter', () => targetInfluence = 1);\n sticky.addEventListener('mouseleave', () => targetInfluence = 0);\n\n \/*\n * Subtle scroll phases \u2014 gridSize only goes from 15 \u2192 12 (barely any zoom),\n * ripple and rotation change very gently too.\n *\/\n const phases = [\n { ripple: 0.02, gridSize: 15.0, thickness: 15, glow: 3.0, opacity: 0.20, rotation: 0, fade: 1.5 },\n { ripple: 0.03, gridSize: 14.0, thickness: 14, glow: 3.5, opacity: 0.23, rotation: 4, fade: 1.4 },\n { ripple: 0.04, gridSize: 13.0, thickness: 13, glow: 4.0, opacity: 0.26, rotation: 8, fade: 1.3 },\n { ripple: 0.05, gridSize: 12.0, thickness: 12, glow: 4.5, opacity: 0.29, rotation: 12, fade: 1.2 }\n ];\n\n const lerp = (a, b, t) => a + (b - a) * t;\n const ease = t => t < 0.5 ? 2*t*t : -1+(4-2*t)*t;\n\n let scrollP = 0;\n let targetScrollP = 0;\n\n window.addEventListener('scroll', () => {\n const maxScroll = wrap.scrollHeight - window.innerHeight;\n targetScrollP = Math.min(window.scrollY \/ maxScroll, 1);\n }, { passive: true });\n\n const render = t => {\n uniforms.iTime.value = t * 0.0005;\n\n scrollP += (targetScrollP - scrollP) * 0.06;\n\n const totalPhases = phases.length - 1;\n const rawIdx = scrollP * totalPhases;\n const phaseIdx = Math.floor(rawIdx);\n const phaseFrac = ease(rawIdx - phaseIdx);\n const p0 = phases[Math.min(phaseIdx, totalPhases)];\n const p1 = phases[Math.min(phaseIdx + 1, totalPhases)];\n\n uniforms.rippleIntensity.value = lerp(p0.ripple, p1.ripple, phaseFrac);\n uniforms.gridSize.value = lerp(p0.gridSize, p1.gridSize, phaseFrac);\n uniforms.gridThickness.value = lerp(p0.thickness, p1.thickness, phaseFrac);\n uniforms.glowIntensity.value = lerp(p0.glow, p1.glow, phaseFrac);\n uniforms.opacity.value = lerp(p0.opacity, p1.opacity, phaseFrac);\n uniforms.gridRotation.value = lerp(p0.rotation, p1.rotation, phaseFrac);\n uniforms.fadeDistance.value = lerp(p0.fade, p1.fade, phaseFrac);\n\n mouse.x += (targetMouse.x - mouse.x) * 0.1;\n mouse.y += (targetMouse.y - mouse.y) * 0.1;\n uniforms.mouseInfluence.value += (targetInfluence - uniforms.mouseInfluence.value) * 0.05;\n uniforms.mousePosition.value = [mouse.x, mouse.y];\n\n renderer.render({ scene: mesh });\n requestAnimationFrame(render);\n };\n\n requestAnimationFrame(render);\n<\/script>\n\n<\/body>\n<\/html>\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-aaca14f e-con-full e-flex e-con e-parent\" data-id=\"aaca14f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-e8be43d e-con-full e-flex elementor-invisible e-con e-child\" data-id=\"e8be43d\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"motion_fx_motion_fx_mouse":"yes","motion_fx_tilt_effect":"yes","motion_fx_tilt_speed":{"unit":"px","size":0.200000000000000011102230246251565404236316680908203125,"sizes":[]},"animation":"fadeInUp"}\">\n\t\t<div class=\"elementor-element elementor-element-be79476 e-con-full e-flex e-con e-child\" data-id=\"be79476\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9dca638 elementor-widget elementor-widget-heading\" data-id=\"9dca638\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Professional Video Editing Services<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-55f4a93 elementor-widget elementor-widget-heading\" data-id=\"55f4a93\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">\nFor Creators, Brands, and Businesses<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-296fa41 e-con-full e-flex e-con e-child\" data-id=\"296fa41\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4afb268 elementor-align-center elementor-invisible elementor-widget elementor-widget-button\" data-id=\"4afb268\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"fadeIn"}\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#contact1\" id=\"1\">\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\">Contact<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\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-758f856 e-con-full e-flex elementor-invisible e-con e-parent\" data-id=\"758f856\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"animation":"fadeInUp"}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-13d0c9f elementor-widget__width-inherit elementor-skin-carousel elementor-widget elementor-widget-media-carousel\" data-id=\"13d0c9f\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"Home\" data-settings=\"{"slides_per_view":"7","slides_to_scroll":"6","speed":7500,"autoplay_speed":1,"space_between":{"unit":"px","size":50,"sizes":[]},"skin":"carousel","effect":"slide","autoplay":"yes","loop":"yes","space_between_tablet":{"unit":"px","size":10,"sizes":[]},"space_between_mobile":{"unit":"px","size":10,"sizes":[]}}\" data-widget_type=\"media-carousel.default\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"elementor-main-swiper swiper\" role=\"region\" aria-roledescription=\"carousel\" aria-label=\"Slides\">\n\t\t\t\t<div class=\"swiper-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"sightscape_logo\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/sightscape_logo.svg')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"logo_main\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/logo_main.svg')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"658456f77aa15f21aaf0c0fb_Group 3509\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/658456f77aa15f21aaf0c0fb_Group-3509.svg')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"LOGO_01 (1)\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/LOGO_01-1.png')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"Design-sans-titre-13 (2)\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-13-2.png')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"logo-HypeTv-nuevo-blanco_Mesa-de-trabajo-1-copia-8-copy-3\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/logo-HypeTv-nuevo-blanco_Mesa-de-trabajo-1-copia-8-copy-3.png')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"Smart-target-Best-Digital-Marketing-Agency-In-Kuwait\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/Smart-target-Best-Digital-Marketing-Agency-In-Kuwait.webp')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fc902d1 e-flex e-con-boxed e-con e-parent\" data-id=\"fc902d1\" data-element_type=\"container\" data-e-type=\"container\" id=\"ourwork\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-7bb911e e-con-full e-flex e-con e-child\" data-id=\"7bb911e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-efbb26f elementor-widget elementor-widget-video\" data-id=\"efbb26f\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"youtube_url":"https:\\\/\\\/www.youtube.com\\\/watch?v=XHOmBV4js_E","video_type":"youtube","controls":"yes"}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cfc4f32 e-con-full e-flex e-con e-child\" data-id=\"cfc4f32\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c65bdc1 elementor-widget elementor-widget-video\" data-id=\"c65bdc1\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"youtube_url":"https:\\\/\\\/www.youtube.com\\\/watch?v=XHOmBV4js_E","video_type":"youtube","controls":"yes"}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-446ccfd e-con-full e-flex e-con e-child\" data-id=\"446ccfd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d09fc6 elementor-widget elementor-widget-video\" data-id=\"1d09fc6\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"youtube_url":"https:\\\/\\\/www.youtube.com\\\/watch?v=XHOmBV4js_E","video_type":"youtube","controls":"yes"}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1269339 elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con-boxed e-con e-parent\" data-id=\"1269339\" 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-258906a elementor-widget elementor-widget-html\" data-id=\"258906a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n \/* --- WRAPPER & LAYOUT --- *\/\n .infinite-video-gallery {\n position: relative;\n width: 100%;\n height: 80vh; \/* Adjust how tall you want the section to be *\/\n overflow: hidden;\n display: flex;\n justify-content: center;\n gap: 30px; \/* Space between columns *\/\n padding: 50px 0;\n \n \/* Creates the fade-out effect at the top and bottom *\/\n -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);\n mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);\n }\n\n \/* --- THE SCROLLING COLUMNS --- *\/\n .scrolling-column {\n display: flex;\n flex-direction: column;\n gap: 40px; \/* Space between cards vertically *\/\n \/* 30s is the speed. Lower number = faster scroll *\/\n animation: scrollVertical 30s linear infinite; \n }\n\n \/* Stagger the middle column so they don't look perfectly lined up *\/\n .col-middle {\n margin-top: -150px; \n }\n\n \/* Pause ALL columns when you hover over the gallery area *\/\n .infinite-video-gallery:hover .scrolling-column {\n animation-play-state: paused;\n }\n\n @keyframes scrollVertical {\n 0% { transform: translateY(0); }\n \/* Moves the column up exactly halfway, creating a seamless loop *\/\n 100% { transform: translateY(-50%); } \n }\n\n \/* --- THE VIDEO CARDS --- *\/\n .v-card {\n position: relative;\n border-radius: 20px;\n overflow: hidden;\n cursor: pointer;\n box-shadow: 0 10px 30px rgba(0,0,0,0.5);\n transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;\n border: 1px solid rgba(255, 255, 255, 0.1);\n }\n\n \/* Card Sizes *\/\n .card-vertical { width: 260px; height: 460px; }\n .card-landscape { width: 380px; height: 220px; }\n\n \/* Initial Tilts *\/\n .tilt-left { transform: rotate(-4deg); }\n .tilt-right { transform: rotate(4deg); }\n\n \/* Hover State: Straighten, Scale, and Glow *\/\n .v-card:hover {\n transform: scale(1.08) rotate(0deg) !important;\n z-index: 10;\n box-shadow: 0 15px 40px rgba(255, 36, 141, 0.3), 0 0 15px rgba(255, 36, 141, 0.5); \/* Pink glow *\/\n border-color: rgba(255, 36, 141, 0.8);\n }\n\n \/* The Image inside the card *\/\n .v-card img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform 0.4s ease;\n }\n\n \/* --- OVERLAY ELEMENTS (Play Button & Icon) --- *\/\n .play-btn-overlay {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: rgba(255, 36, 141, 0.85); \/* Your pink color *\/\n backdrop-filter: blur(4px);\n width: 65px;\n height: 45px;\n border-radius: 12px;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.3s ease, transform 0.3s ease;\n }\n\n \/* The little white triangle *\/\n .play-btn-overlay::after {\n content: '';\n display: block;\n border-left: 14px solid white;\n border-top: 9px solid transparent;\n border-bottom: 9px solid transparent;\n margin-left: 4px; \/* Centers triangle visually *\/\n }\n\n .v-card:hover .play-btn-overlay {\n background-color: rgba(255, 36, 141, 1);\n transform: translate(-50%, -50%) scale(1.1);\n }\n\n \/* Top Right Floating Icon (like the SVG in your video) *\/\n .floating-icon {\n position: absolute;\n top: -15px;\n right: -15px;\n width: 40px;\n height: 40px;\n background: white;\n border-radius: 50%;\n box-shadow: 0 4px 10px rgba(0,0,0,0.3);\n z-index: 5;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n \n \/* Just a placeholder icon shape *\/\n .floating-icon::before {\n content: 'S'; \/* Replace with your actual SVG or text later *\/\n font-weight: bold;\n color: black;\n }\n<\/style>\n\n<div class=\"infinite-video-gallery\">\n\n <div class=\"scrolling-column col-left\">\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1616423640778-28d1b53229bd?auto=format&fit=crop&w=400&q=80\" alt=\"Video 1\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1596704017254-9b121068fb31?auto=format&fit=crop&w=400&q=80\" alt=\"Video 2\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1512496015851-a90fb38ba796?auto=format&fit=crop&w=400&q=80\" alt=\"Video 3\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1616423640778-28d1b53229bd?auto=format&fit=crop&w=400&q=80\" alt=\"Video 1\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1596704017254-9b121068fb31?auto=format&fit=crop&w=400&q=80\" alt=\"Video 2\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1512496015851-a90fb38ba796?auto=format&fit=crop&w=400&q=80\" alt=\"Video 3\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"scrolling-column col-middle\">\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1533130061792-64b345e4a833?auto=format&fit=crop&w=800&q=80\" alt=\"Video 4\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-left\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1492691527719-9d1e07e534b4?auto=format&fit=crop&w=800&q=80\" alt=\"Video 5\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1518791841217-8f162f1e1131?auto=format&fit=crop&w=800&q=80\" alt=\"Video 6\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1533130061792-64b345e4a833?auto=format&fit=crop&w=800&q=80\" alt=\"Video 4\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-left\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1492691527719-9d1e07e534b4?auto=format&fit=crop&w=800&q=80\" alt=\"Video 5\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1518791841217-8f162f1e1131?auto=format&fit=crop&w=800&q=80\" alt=\"Video 6\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"scrolling-column col-right\">\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1522869635100-9f4c5e86aa37?auto=format&fit=crop&w=400&q=80\" alt=\"Video 7\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1516280440502-61f53a1a5b48?auto=format&fit=crop&w=400&q=80\" alt=\"Video 8\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1506126613408-eca07ce68773?auto=format&fit=crop&w=400&q=80\" alt=\"Video 9\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1522869635100-9f4c5e86aa37?auto=format&fit=crop&w=400&q=80\" alt=\"Video 7\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1516280440502-61f53a1a5b48?auto=format&fit=crop&w=400&q=80\" alt=\"Video 8\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1506126613408-eca07ce68773?auto=format&fit=crop&w=400&q=80\" alt=\"Video 9\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <\/div>\n\n<\/div>\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-53fcc07 e-con-full e-flex e-con e-parent\" data-id=\"53fcc07\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dae9f1e elementor-widget elementor-widget-html\" data-id=\"dae9f1e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"magic-section-container\" id=\"magic-section\">\n <div class=\"marquee-overlap-wrapper\">\n \n <div class=\"magic-marquee-wrapper layer-back\">\n <div class=\"magic-marquee-track\">\n <h1 class=\"magic-marquee-text\">\n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <\/h1>\n <h1 class=\"magic-marquee-text\">\n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <\/h1>\n <\/div>\n <\/div>\n\n <svg class=\"magic-sweeping-line\" viewBox=\"0 0 1200 150\" preserveAspectRatio=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <defs>\n <filter id=\"neonPinkGlow\" x=\"-20%\" y=\"-20%\" width=\"140%\" height=\"140%\">\n <feGaussianBlur stdDeviation=\"4\" result=\"blur1\" \/>\n <feGaussianBlur stdDeviation=\"8\" result=\"blur2\" \/>\n <feMerge>\n <feMergeNode in=\"blur2\" \/>\n <feMergeNode in=\"blur1\" \/>\n <feMergeNode in=\"SourceGraphic\" \/>\n <\/feMerge>\n <\/filter>\n <\/defs>\n <path class=\"animated-path\" \n d=\"M -50,100 C 300,120 800,30 1250,40\" \n fill=\"transparent\" \n stroke=\"#FF007F\" \n stroke-width=\"6\" \n stroke-linecap=\"round\" \n filter=\"url(#neonPinkGlow)\"\/>\n <\/svg>\n\n <div class=\"magic-marquee-wrapper layer-front\">\n <div class=\"magic-marquee-track\">\n <h1 class=\"magic-marquee-text\">\n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <\/h1>\n <h1 class=\"magic-marquee-text\">\n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <\/h1>\n <\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n<style>\n \/* 1. Container Layout *\/\n .magic-section-container {\n position: relative;\n width: 100%;\n padding: 60px 0; \n overflow: hidden; \n background-color: transparent; \n font-family: 'Montserrat', 'Poppins', 'Inter', sans-serif;\n }\n\n \/* 2. The Sandwich Wrapper *\/\n .marquee-overlap-wrapper {\n position: relative;\n width: 100%;\n display: flex;\n align-items: center;\n }\n\n \/* 3. Text Layers *\/\n .magic-marquee-wrapper {\n width: 100%;\n overflow: hidden;\n display: flex;\n white-space: nowrap;\n }\n \n \/* Pushes the back layer behind the line *\/\n .layer-back {\n position: relative;\n z-index: 2;\n }\n\n \/* Pulls the front layer over the line and positions it exactly over the back layer *\/\n .layer-front {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n z-index: 10;\n pointer-events: none; \/* Prevents invisible text from blocking clicks *\/\n }\n\n \/* THIS IS THE MAGIC TRICK: Hides front words so the line shows through *\/\n .hide-text {\n color: transparent;\n }\n\n .magic-marquee-track {\n display: flex;\n animation: scrollMarquee 20s linear infinite; \n }\n\n .magic-marquee-text {\n color: #ffffff;\n font-size: clamp(5rem, 9vw, 15rem);\n \/* Changed from 900 to normal to remove the bold effect *\/\n font-weight: bold; \n text-transform: uppercase;\n margin: 0;\n padding-right: 40px; \n line-height: 1;\n letter-spacing: -0.02em;\n flex-shrink: 0;\n }\n\n @keyframes scrollMarquee {\n 0% { transform: translateX(0); }\n 100% { transform: translateX(-100%); }\n }\n\n \/* 4. Sweeping Line Settings *\/\n .magic-sweeping-line {\n position: absolute;\n top: 50%; \n transform: translateY(-50%);\n left: 0;\n width: 100%;\n height: 150px;\n z-index: 5; \/* Sandwiched between Level 2 and Level 10 *\/\n opacity: 0; \n transition: opacity 0.4s ease;\n }\n\n .animated-path {\n stroke-dasharray: 1500;\n stroke-dashoffset: 1500;\n }\n\n \/* --- Scroll Animation Triggers --- *\/\n .magic-section-container.is-visible .magic-sweeping-line {\n opacity: 1;\n }\n\n .magic-section-container.is-visible .animated-path {\n animation: drawPinkLine 1.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;\n }\n\n @keyframes drawPinkLine {\n to { stroke-dashoffset: 0; }\n }\n\n @media (max-width: 768px) {\n .magic-sweeping-line { height: 90px; }\n }\n<\/style>\n\n<script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n const magicSection = document.getElementById('magic-section');\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('is-visible');\n } else {\n entry.target.classList.remove('is-visible'); \n }\n });\n }, { threshold: 0.4 });\n\n if (magicSection) {\n observer.observe(magicSection);\n }\n });\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d57caec e-con-full e-transform e-flex e-con e-parent\" data-id=\"d57caec\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"_transform_scale_effect":{"unit":"px","size":1.1999999999999999555910790149937383830547332763671875,"sizes":[]},"_transform_scale_effect_tablet":{"unit":"px","size":"","sizes":[]},"_transform_scale_effect_mobile":{"unit":"px","size":"","sizes":[]}}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8070da8 elementor-widget elementor-widget-html\" data-id=\"8070da8\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"howitwork\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n #How-It-Works { padding: 60px 24px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 700; }\n .hiw-wrapper { max-width: 1060px; margin: 0 auto; display: flex; align-items: stretch; justify-content: center; gap: 0; }\n .hiw-card {\n flex: 1;\n min-width: 0;\n background: rgba(255,255,255,0.015);\n border: 1px solid rgba(255,255,255,0.06);\n border-radius: 24px;\n padding: 20px;\n backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n position: relative;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n cursor: pointer;\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 4px 24px rgba(0,0,0,0.15);\n }\n .hiw-card:hover, .hiw-card:active {\n transform: scale(1.05);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 12px 40px rgba(0,0,0,0.25);\n z-index: 10;\n }\n .hiw-card::before {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: 24px;\n background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0) 50%);\n pointer-events: none;\n }\n .hiw-arrow {\n flex-shrink: 0;\n width: 64px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 -6px;\n position: relative;\n z-index: 2;\n }\n .hiw-arrow img { width: 64px; height: auto; display: block; }\n .card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }\n .step-label { font-size: 11px; color: rgba(255,255,255,0.55); font-weight: 700; }\n .step-label span { color: rgba(255,255,255,0.95); font-weight: 800; }\n .brand { display: flex; align-items: center; gap: 5px; font-size: 12px; color: rgba(255,255,255,0.65); font-weight: 700; }\n .chat-row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; }\n .avatar { width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0; overflow: hidden; border: 1.5px solid rgba(255,255,255,0.15); }\n .avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }\n .af-badge { width: 42px; height: 42px; border-radius: 10px; background: rgba(255,255,255,0.04); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1.5px solid #e91e8c; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 900; flex-shrink: 0; letter-spacing: -1px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); }\n .chat-name { font-size: 10px; color: rgba(255,255,255,0.5); margin-bottom: 3px; font-weight: 700; }\n .chat-msg { font-size: 18px; font-weight: 900; color: #fff; line-height: 1.2; }\n .list-item { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; padding: 10px 14px; font-size: 14px; color: rgba(255,255,255,0.65); margin-bottom: 6px; display: flex; align-items: center; justify-content: space-between; font-weight: 700; backdrop-filter: blur(30px) saturate(180%); -webkit-backdrop-filter: blur(30px) saturate(180%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); }\n .list-item.active { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.15); color: #fff; font-weight: 900; transform: rotate(-2deg); box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 4px 16px rgba(0,0,0,0.2); }\n .approved { color: #4ade80; font-size: 11px; font-weight: 800; }\n .video-box { border-radius: 16px; aspect-ratio: 16\/10; display: flex; align-items: center; justify-content: center; position: relative; border: 1px solid rgba(255,255,255,0.07); overflow: visible; flex: 1; box-shadow: inset 0 1px 0 rgba(255,255,255,0.08); }\n .video-box-inner { position: absolute; inset: 0; border-radius: 16px; overflow: hidden; }\n .video-box-inner img { width: 100%; height: 100%; object-fit: cover; display: block; }\n .play-btn { position: relative; z-index: 1; width: 54px; height: 54px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,0.5); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); background: rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 4px 20px rgba(0,0,0,0.3); flex-shrink: 0; }\n .feedback-bubble { position: absolute; bottom: -14px; right: -8px; background: rgba(255,255,255,0.06); backdrop-filter: blur(40px) saturate(200%); -webkit-backdrop-filter: blur(40px) saturate(200%); border: 1px solid rgba(255,255,255,0.1); border-radius: 12px 12px 2px 12px; padding: 8px 12px; font-size: 12px; font-weight: 900; color: #fff; display: flex; align-items: center; gap: 6px; white-space: nowrap; z-index: 2; box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 4px 16px rgba(0,0,0,0.2); }\n\n @media (max-width: 820px) {\n .hiw-wrapper { flex-direction: column; align-items: center; gap: 0; }\n .hiw-card { width: 100%; max-width: 480px; }\n .hiw-arrow { width: 100%; height: 50px; margin: -4px 0; transform: rotate(90deg); }\n .hiw-arrow img { width: 50px; }\n }\n @media (max-width: 480px) {\n #How-It-Works { padding: 40px 16px; }\n .hiw-card { padding: 16px; }\n .chat-msg { font-size: 16px; }\n .list-item { font-size: 13px; padding: 8px 12px; }\n .feedback-bubble { font-size: 11px; padding: 6px 10px; }\n }\n<\/style>\n\n<section id=\"How-It-Works\">\n <div class=\"hiw-wrapper\">\n\n \n <div class=\"hiw-card\">\n <div class=\"card-header\">\n <div class=\"step-label\">Step 1: <span>Comms + Submission<\/span><\/div>\n <div class=\"brand\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"#25D366\"\/><path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z\" fill=\"white\"\/><\/svg>\n WhatsApp\n <\/div>\n <\/div>\n <div class=\"chat-row\">\n <div class=\"avatar\"><img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/profile-scaled.jpg\" alt=\"You\"><\/div>\n <div>\n <div class=\"chat-name\">You<\/div>\n <div class=\"chat-msg\">We Need An<br>Awesome Video!<\/div>\n <\/div>\n <\/div>\n <div class=\"chat-row\">\n <div class=\"af-badge\"><span style=\"color:#fff;\">A<\/span><span style=\"color:#e91e8c;\">F<\/span><\/div>\n <div>\n <div class=\"chat-name\">Aymanframes<\/div>\n <div class=\"chat-msg\">On It!<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"hiw-arrow\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/658d8857bb42f3b846953316_Group-6356711.png\" loading=\"lazy\" alt=\"\">\n <\/div>\n\n \n <div class=\"hiw-card\">\n <div class=\"card-header\">\n <div class=\"step-label\">Step 2: <span>Project Management<\/span><\/div>\n <\/div>\n <div class=\"list-item\">Instagram Reel <span class=\"approved\">\u2713 Approved<\/span><\/div>\n <div class=\"list-item\">TikTok Video<\/div>\n <div class=\"list-item active\">Awesome Video<\/div>\n <div class=\"list-item\">Motion Design<\/div>\n <\/div>\n\n \n <div class=\"hiw-arrow\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/658d8857bb42f3b846953316_Group-6356711.png\" loading=\"lazy\" alt=\"\">\n <\/div>\n\n \n <div class=\"hiw-card\">\n <div class=\"card-header\">\n <div class=\"step-label\">Step 3: <span>Revision & Feedback<\/span><\/div>\n <div class=\"brand\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"rgba(255,255,255,0.6)\" stroke-width=\"1.8\"><rect x=\"2\" y=\"6\" width=\"14\" height=\"12\" rx=\"2\"\/><path d=\"M16 10l6-4v12l-6-4\" stroke-linejoin=\"round\"\/><\/svg>\n frame.io\n <\/div>\n <\/div>\n <div class=\"video-box\">\n <div class=\"video-box-inner\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/fiverr-cover_.jpg\" alt=\"Video preview\">\n <\/div>\n <div class=\"play-btn\">\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"white\" style=\"margin-left:3px;\"><path d=\"M8 5v14l11-7z\"\/><\/svg>\n <\/div>\n <div class=\"feedback-bubble\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"rgba(255,255,255,0.6)\" stroke-width=\"2\" style=\"flex-shrink:0;\"><path d=\"M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z\"\/><\/svg>\n This Is Amazing!!\n <\/div>\n <\/div>\n <\/div>\n\n <\/div>\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ceea29c e-con-full e-flex e-con e-parent\" data-id=\"ceea29c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-229662b elementor-widget__width-inherit elementor-widget elementor-widget-heading\" data-id=\"229662b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">From raw clips to polished, captivating videos, we master the art of storytelling Films<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f71dcc7 elementor-align-center elementor-invisible elementor-widget elementor-widget-button\" data-id=\"f71dcc7\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"fadeIn"}\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#contact1\" contact1=\"\" id=\"1\">\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\">Contact<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a517766 e-con-full e-flex e-con e-parent\" data-id=\"a517766\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-33bf0ff elementor-widget elementor-widget-html\" data-id=\"33bf0ff\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"ourservices\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>Our Services<\/title>\n <style>\n *, *::before, *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n body {\n background-color: #111010;\n color: #fff;\n font-family: sans-serif;\n }\n\n \/* \u2500\u2500 Section \u2500\u2500 *\/\n .section-our-work {\n padding: 80px 48px 100px;\n max-width: 1400px;\n margin: 0 auto;\n }\n\n \/* \u2500\u2500 Heading \u2500\u2500 *\/\n .heading-2 {\n font-size: clamp(56px, 9vw, 80px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.01em;\n line-height: 1;\n color: #ffffff;\n margin-bottom: 48px;\n }\n\n \/* \u2500\u2500 Pills grid \u2500\u2500 *\/\n .bottom-our-wok {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n }\n\n \/* \u2500\u2500 Each pill \u2500\u2500 *\/\n .item-our-work {\n display: inline-flex;\n align-items: center;\n border: 1.5px solid rgba(182, 170, 174, 0.55);\n border-radius: 12px;\n cursor: pointer;\n background: rgba(255, 255, 255, 0.04);\n transition: border-color 0.2s ease, background 0.2s ease;\n -webkit-tap-highlight-color: transparent;\n }\n\n \/* HOVER \u2014 hot pink border, slightly brighter bg, text stays white *\/\n .item-our-work:hover,\n .item-our-work:active {\n border-color: #ff2d78;\n background: rgba(255, 45, 120, 0.06);\n }\n\n .item-our-work:hover .plus-10,\n .item-our-work:active .plus-10 {\n transform: rotate(45deg);\n }\n\n .gap-10 {\n display: flex;\n align-items: center;\n gap: 10px;\n font-size: clamp(15px, 1.4vw, 20px);\n font-weight: 500;\n color: #ffffff;\n white-space: nowrap;\n padding: 16px 28px;\n }\n\n .plus-10 {\n width: 15px;\n height: 15px;\n flex-shrink: 0;\n transition: transform 0.25s ease;\n filter: brightness(0) invert(1);\n }\n\n \/* \u2500\u2500 Responsive \u2500\u2500 *\/\n @media (max-width: 991px) {\n .section-our-work {\n padding: 60px 32px 80px;\n }\n .gap-10 {\n padding: 14px 22px;\n }\n }\n\n @media (max-width: 767px) {\n .section-our-work {\n padding: 48px 20px 64px;\n }\n .gap-10 {\n padding: 12px 18px;\n font-size: 14px;\n }\n .bottom-our-wok {\n gap: 10px;\n }\n }\n\n @media (max-width: 479px) {\n .gap-10 {\n padding: 11px 15px;\n font-size: 13px;\n }\n .bottom-our-wok {\n gap: 8px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n<section class=\"section-our-work\">\n\n <div class=\"top-our-work\">\n <h2 class=\"heading-2\">OUR SERVICES<\/h2>\n <\/div>\n\n <div class=\"bottom-our-wok\">\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Cinematic Long-Form Editing<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Short-Form Video Editing<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Advanced Color Grading<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Motion Graphics & VFX<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>YouTube Video Editing<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Sound Design & Audio Mixing<\/div>\n <\/div>\n <\/div>\n\n <\/div>\n<\/section>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bdf57f6 e-con-full e-flex e-con e-parent\" data-id=\"bdf57f6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3d3e4f7 elementor-widget elementor-widget-image\" data-id=\"3d3e4f7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"490\" height=\"169\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/aymanframes-5stars-1.png\" class=\"attachment-full size-full wp-image-607\" alt=\"\" srcset=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/aymanframes-5stars-1.png 490w, https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/aymanframes-5stars-1-300x103.png 300w\" sizes=\"(max-width: 490px) 100vw, 490px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7f467c0 e-con-full e-flex e-con e-parent\" data-id=\"7f467c0\" data-element_type=\"container\" data-e-type=\"container\" id=\"testimonials\">\n\t\t\t\t<div class=\"elementor-element elementor-element-26d7b8c elementor-widget elementor-widget-heading\" data-id=\"26d7b8c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\nTESTIMONIALS<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-258bdc6 e-grid e-con-boxed e-con e-parent\" data-id=\"258bdc6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t\t\t\t\t<div data-id=\"638826d\" data-interaction-id=\"638826d\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"638826d\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"44dce0f\" data-interaction-id=\"44dce0f\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"44dce0f\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"e327c21\" data-interaction-id=\"e327c21\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"e327c21\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"369be23\" data-interaction-id=\"369be23\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"369be23\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"c60e5fe\" data-interaction-id=\"c60e5fe\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"c60e5fe\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"90edf17\" data-interaction-id=\"90edf17\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"90edf17\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-df91a0e e-flex e-con-boxed e-con e-parent\" data-id=\"df91a0e\" 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-8c99080 elementor-widget__width-inherit elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile elementor-widget elementor-widget-html\" data-id=\"8c99080\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n #af-pricing {\n padding: 80px 24px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n text-align: center;\n }\n #af-pricing .af-title {\n font-size: 13px;\n font-weight: 800;\n color: #e91e8c;\n letter-spacing: 0.15em;\n text-transform: uppercase;\n margin-bottom: 12px;\n }\n #af-pricing .af-heading {\n font-size: 42px;\n font-weight: 900;\n color: #fff;\n line-height: 1.1;\n margin-bottom: 16px;\n }\n #af-pricing .af-subheading {\n font-size: 16px;\n font-weight: 600;\n color: rgba(255,255,255,0.45);\n margin-bottom: 56px;\n }\n #af-pricing .plans-grid {\n display: flex;\n align-items: stretch;\n justify-content: center;\n gap: 20px;\n max-width: 1060px;\n margin: 0 auto;\n flex-wrap: wrap;\n }\n #af-pricing .plan-card {\n flex: 1;\n min-width: 260px;\n max-width: 320px;\n background: rgba(255,255,255,0.015);\n border: 1px solid rgba(255,255,255,0.07);\n border-radius: 24px;\n padding: 32px 28px;\n backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 4px 24px rgba(0,0,0,0.2);\n text-align: left;\n position: relative;\n overflow: hidden;\n transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n }\n #af-pricing .plan-card::before {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: 24px;\n background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0) 50%);\n pointer-events: none;\n }\n #af-pricing .plan-card:hover {\n transform: scale(1.05);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 16px 48px rgba(0,0,0,0.3);\n }\n #af-pricing .plan-card.featured {\n background: rgba(233,30,140,0.08);\n border: 1px solid rgba(233,30,140,0.35);\n box-shadow: inset 0 1px 0 rgba(233,30,140,0.2), 0 4px 40px rgba(233,30,140,0.15);\n }\n #af-pricing .plan-card.featured::before {\n background: linear-gradient(135deg, rgba(233,30,140,0.08) 0%, rgba(255,255,255,0) 50%);\n }\n #af-pricing .popular-badge {\n display: inline-block;\n background: linear-gradient(90deg, #e91e8c, #ff6eb4);\n color: #fff;\n font-size: 11px;\n font-weight: 800;\n letter-spacing: 0.1em;\n text-transform: uppercase;\n padding: 4px 12px;\n border-radius: 20px;\n margin-bottom: 20px;\n }\n #af-pricing .plan-name {\n font-size: 20px;\n font-weight: 900;\n color: #fff;\n margin-bottom: 8px;\n }\n #af-pricing .plan-desc {\n font-size: 13px;\n font-weight: 600;\n color: rgba(255,255,255,0.4);\n margin-bottom: 24px;\n line-height: 1.5;\n }\n #af-pricing .plan-price {\n display: flex;\n align-items: flex-end;\n gap: 4px;\n margin-bottom: 28px;\n }\n #af-pricing .price-currency {\n font-size: 20px;\n font-weight: 800;\n color: rgba(255,255,255,0.7);\n margin-bottom: 6px;\n }\n #af-pricing .price-amount {\n font-size: 52px;\n font-weight: 900;\n color: #fff;\n line-height: 1;\n }\n #af-pricing .price-period {\n font-size: 14px;\n font-weight: 700;\n color: rgba(255,255,255,0.4);\n margin-bottom: 8px;\n }\n #af-pricing .divider {\n height: 1px;\n background: rgba(255,255,255,0.07);\n margin-bottom: 24px;\n }\n #af-pricing .features-list {\n list-style: none;\n padding: 0;\n margin: 0 0 32px 0;\n flex: 1;\n }\n #af-pricing .features-list li {\n display: flex;\n align-items: center;\n gap: 10px;\n font-size: 14px;\n font-weight: 700;\n color: rgba(255,255,255,0.75);\n padding: 8px 0;\n border-bottom: 1px solid rgba(255,255,255,0.04);\n }\n #af-pricing .features-list li:last-child { border-bottom: none; }\n #af-pricing .check {\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: rgba(233,30,140,0.15);\n border: 1px solid rgba(233,30,140,0.3);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n }\n #af-pricing .check svg { width: 10px; height: 10px; }\n #af-pricing .plan-card.featured .check {\n background: rgba(233,30,140,0.25);\n border-color: rgba(233,30,140,0.5);\n }\n #af-pricing .plan-btn {\n display: block;\n width: 100%;\n padding: 14px;\n border-radius: 14px;\n font-size: 15px;\n font-weight: 900;\n text-align: center;\n text-decoration: none;\n cursor: pointer;\n border: none;\n background: rgba(255,255,255,0.06);\n border: 1px solid rgba(255,255,255,0.1);\n color: #fff;\n backdrop-filter: blur(20px);\n -webkit-backdrop-filter: blur(20px);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);\n transition: background 0.2s ease, transform 0.15s ease;\n letter-spacing: 0.03em;\n }\n #af-pricing .plan-btn:hover { background: rgba(255,255,255,0.1); transform: scale(1.02); }\n #af-pricing .plan-btn.pink {\n background: linear-gradient(135deg, #e91e8c, #c2185b);\n border: none;\n box-shadow: 0 4px 20px rgba(233,30,140,0.4), inset 0 1px 0 rgba(255,255,255,0.2);\n }\n #af-pricing .plan-btn.pink:hover { background: linear-gradient(135deg, #ff2d9b, #e91e8c); box-shadow: 0 6px 28px rgba(233,30,140,0.5); }\n\n @media (max-width: 860px) {\n #af-pricing .plans-grid { flex-direction: column; align-items: center; }\n #af-pricing .plan-card { max-width: 480px; width: 100%; }\n #af-pricing .af-heading { font-size: 32px; }\n }\n @media (max-width: 480px) {\n #af-pricing { padding: 50px 16px; }\n #af-pricing .af-heading { font-size: 26px; }\n #af-pricing .price-amount { font-size: 42px; }\n }\n<\/style>\n\n<section id=\"af-pricing\">\n\n <div class=\"af-title\">Simple Pricing<\/div>\n <h2 class=\"af-heading\">Pick Your Plan<\/h2>\n <p class=\"af-subheading\">No hidden fees. Cancel anytime.<\/p>\n\n <div class=\"plans-grid\">\n\n \n <div class=\"plan-card\">\n <div class=\"plan-name\">Starter<\/div>\n <div class=\"plan-desc\">Perfect for creators just getting started with short-form content.<\/div>\n <div class=\"plan-price\">\n <span class=\"price-currency\">$<\/span>\n <span class=\"price-amount\">297<\/span>\n <span class=\"price-period\">\/mo<\/span>\n <\/div>\n <div class=\"divider\"><\/div>\n <ul class=\"features-list\">\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 4 Short-Form Videos \/ Month<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Captions & Subtitles<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Music & Sound Design<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 2 Revision Rounds<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 5-Day Delivery<\/li>\n <\/ul>\n <a href=\"#contact\" class=\"plan-btn\">Get Started<\/a>\n <\/div>\n\n \n <div class=\"plan-card featured\">\n <div class=\"popular-badge\">Most Popular<\/div>\n <div class=\"plan-name\">Pro<\/div>\n <div class=\"plan-desc\">For brands & creators who want consistent, high-quality content.<\/div>\n <div class=\"plan-price\">\n <span class=\"price-currency\">$<\/span>\n <span class=\"price-amount\">597<\/span>\n <span class=\"price-period\">\/mo<\/span>\n <\/div>\n <div class=\"divider\"><\/div>\n <ul class=\"features-list\">\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 10 Short-Form Videos \/ Month<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Captions, Subtitles & B-Roll<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Custom Motion Graphics<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Unlimited Revisions<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 3-Day Delivery<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Dedicated Project Manager<\/li>\n <\/ul>\n <a href=\"#contact\" class=\"plan-btn pink\">Get Started<\/a>\n <\/div>\n\n \n <div class=\"plan-card\">\n <div class=\"plan-name\">Elite<\/div>\n <div class=\"plan-desc\">Full-scale content production for agencies and top-tier creators.<\/div>\n <div class=\"plan-price\">\n <span class=\"price-currency\">$<\/span>\n <span class=\"price-amount\">997<\/span>\n <span class=\"price-period\">\/mo<\/span>\n <\/div>\n <div class=\"divider\"><\/div>\n <ul class=\"features-list\">\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 20 Short-Form Videos \/ Month<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Full Post-Production Suite<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Custom Branding & Intros<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Unlimited Revisions<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Priority 48h Delivery<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Strategy & Content Planning<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Direct WhatsApp Access<\/li>\n <\/ul>\n <a href=\"#contact\" class=\"plan-btn\">Get Started<\/a>\n <\/div>\n\n <\/div>\n<\/section>\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-a6b3e1b e-flex e-con-boxed e-con e-parent\" data-id=\"a6b3e1b\" data-element_type=\"container\" data-e-type=\"container\" id=\"contact1\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d7c29c8 elementor-widget elementor-widget-html\" data-id=\"d7c29c8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"cta-glass-section\">\n\n <div class=\"cgs-box\">\n\n <div class=\"cgs-avail\">\n <div class=\"cgs-avail__left\">\n <span class=\"cgs-avail__label\">My schedule \u2014 April 2026<\/span>\n <span class=\"cgs-avail__status\">\n <span class=\"cgs-dot--live\"><\/span>\n Only 2 spots left this month\n <\/span>\n <\/div>\n <div class=\"cgs-avail__slots\">\n <div class=\"cgs-slot-row\">\n <div class=\"cgs-bars\">\n <div class=\"cgs-bar cgs-bar--taken\"><\/div>\n <div class=\"cgs-bar cgs-bar--taken\"><\/div>\n <div class=\"cgs-bar cgs-bar--taken\"><\/div>\n <div class=\"cgs-bar cgs-bar--open\"><\/div>\n <div class=\"cgs-bar cgs-bar--open\"><\/div>\n <\/div>\n <span class=\"cgs-slot-text cgs-slot-text--hot\">Filling fast \u2014 grab yours now<\/span>\n <\/div>\n <div class=\"cgs-slot-row\">\n <span class=\"cgs-slot-text\">Miss this → wait until <strong class=\"cgs-strong\">May 2026<\/strong><\/span>\n <\/div>\n <\/div>\n <\/div>\n\n <p class=\"cgs-eyebrow\">Limited spots available<\/p>\n <h2 class=\"cgs-headline\">Your footage.<br><span class=\"cgs-headline__accent\">Our obsession.<\/span><\/h2>\n <p class=\"cgs-sub\">Most editors deliver cuts. We deliver stories that make viewers stop scrolling, stay watching, and come back for more. Let's talk about what we can do for you.<\/p>\n\n <div class=\"cgs-buttons\">\n <a href=\"https:\/\/calendly.com\/aymanframes\/30min\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"cgs-btn-primary\">Book a Free Call →<\/a>\n <a href=\"https:\/\/wa.me\/212625182594\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"cgs-btn-ghost\">Contact<\/a>\n <\/div>\n\n <div class=\"cgs-trust\">\n <div class=\"cgs-trust__item\"><div class=\"cgs-trust__dot\"><\/div>Contract available \u2014 your call, your comfort.<\/div>\n <div class=\"cgs-trust__item\"><div class=\"cgs-trust__dot\"><\/div>First edit delivered in 48h.<\/div>\n <div class=\"cgs-trust__item\"><div class=\"cgs-trust__dot\"><\/div>Unlimited revisions.<\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n<style>\n.cta-glass-section {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 60px 24px;\n font-family: sans-serif;\n}\n\n.cta-glass-section .cgs-box {\n position: relative;\n z-index: 1;\n width: 100%;\n max-width: 780px;\n background: rgba(255,255,255,0.04);\n border: 1px solid rgba(255,255,255,0.10);\n border-radius: 28px;\n backdrop-filter: blur(24px) saturate(140%);\n -webkit-backdrop-filter: blur(24px) saturate(140%);\n box-shadow:\n inset 0 0 0 1px rgba(255,45,120,0.08),\n 0 32px 64px rgba(0,0,0,0.6),\n 0 0 80px rgba(255,45,120,0.07);\n padding: 64px 56px;\n text-align: center;\n}\n\n.cta-glass-section .cgs-avail {\n display: inline-flex;\n align-items: center;\n gap: 16px;\n background: rgba(255,255,255,0.05);\n border: 1px solid rgba(255,45,120,0.25);\n border-radius: 14px;\n padding: 14px 24px;\n margin-bottom: 40px;\n text-align: left;\n}\n\n.cta-glass-section .cgs-avail__left {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.cta-glass-section .cgs-avail__label {\n font-size: 11px;\n font-weight: 700;\n letter-spacing: 0.14em;\n text-transform: uppercase;\n color: rgba(255,255,255,0.35);\n}\n\n.cta-glass-section .cgs-avail__status {\n font-size: 13px;\n font-weight: 600;\n color: #ffffff;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.cta-glass-section .cgs-dot--live {\n display: inline-block;\n width: 7px;\n height: 7px;\n border-radius: 50%;\n background: #ff2d78;\n flex-shrink: 0;\n animation: cgs-pulse 1.6s ease-in-out infinite;\n}\n\n@keyframes cgs-pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.3; transform: scale(0.65); }\n}\n\n.cta-glass-section .cgs-avail__slots {\n display: flex;\n flex-direction: column;\n gap: 5px;\n border-left: 1px solid rgba(255,255,255,0.08);\n padding-left: 16px;\n}\n\n.cta-glass-section .cgs-slot-row {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.cta-glass-section .cgs-bars {\n display: flex;\n gap: 3px;\n}\n\n.cta-glass-section .cgs-bar {\n width: 18px;\n height: 6px;\n border-radius: 2px;\n background: rgba(255,255,255,0.08);\n}\n\n.cta-glass-section .cgs-bar--taken {\n background: #ff2d78;\n}\n\n.cta-glass-section .cgs-bar--open {\n background: rgba(255,255,255,0.08);\n border: 1px solid rgba(255,45,120,0.4);\n}\n\n.cta-glass-section .cgs-slot-text {\n font-size: 11px;\n color: rgba(255,255,255,0.4);\n white-space: nowrap;\n}\n\n.cta-glass-section .cgs-slot-text--hot {\n color: #ff2d78;\n font-weight: 700;\n font-size: 12px;\n}\n\n.cta-glass-section .cgs-strong {\n color: rgba(255,255,255,0.55);\n}\n\n.cta-glass-section .cgs-eyebrow {\n font-size: 12px;\n font-weight: 700;\n letter-spacing: 0.18em;\n text-transform: uppercase;\n color: #ff2d78;\n margin: 0 0 18px;\n padding: 0;\n}\n\n.cta-glass-section .cgs-headline {\n font-size: clamp(36px, 6vw, 72px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.02em;\n line-height: 1;\n color: #ffffff;\n margin: 0 0 20px;\n padding: 0;\n}\n\n.cta-glass-section .cgs-headline__accent {\n color: #ff2d78;\n}\n\n.cta-glass-section .cgs-sub {\n font-size: clamp(14px, 1.5vw, 17px);\n color: rgba(255,255,255,0.45);\n max-width: 500px;\n margin: 0 auto 44px;\n padding: 0;\n line-height: 1.65;\n font-weight: 400;\n}\n\n.cta-glass-section .cgs-buttons {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n}\n\n.cta-glass-section .cgs-btn-primary {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 17px 38px;\n background: #ff2d78;\n color: #ffffff !important;\n font-size: 15px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.07em;\n border: none;\n border-radius: 50px;\n cursor: pointer;\n text-decoration: none !important;\n transition: background 0.2s ease, transform 0.15s ease;\n line-height: 1;\n}\n\n.cta-glass-section .cgs-btn-primary:hover {\n background: #e0005f;\n transform: scale(1.03);\n color: #ffffff !important;\n}\n\n.cta-glass-section .cgs-btn-primary:active {\n transform: scale(0.97);\n}\n\n.cta-glass-section .cgs-btn-ghost {\n display: inline-flex;\n align-items: center;\n padding: 11px 24px;\n background: transparent;\n color: rgba(255,255,255,0.5) !important;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n border: 1px solid rgba(182,170,174,0.25);\n border-radius: 50px;\n cursor: pointer;\n text-decoration: none !important;\n transition: border-color 0.2s, color 0.2s;\n line-height: 1;\n}\n\n.cta-glass-section .cgs-btn-ghost:hover {\n border-color: #ff2d78;\n color: #ff2d78 !important;\n}\n\n.cta-glass-section .cgs-trust {\n margin-top: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 24px;\n flex-wrap: wrap;\n}\n\n.cta-glass-section .cgs-trust__item {\n display: flex;\n align-items: center;\n gap: 7px;\n font-size: 12px;\n color: rgba(255,255,255,0.3);\n}\n\n.cta-glass-section .cgs-trust__dot {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background: #ff2d78;\n flex-shrink: 0;\n}\n\n@media (max-width: 767px) {\n .cta-glass-section .cgs-box { padding: 40px 24px; }\n .cta-glass-section .cgs-avail { flex-direction: column; align-items: flex-start; gap: 12px; width: 100%; }\n .cta-glass-section .cgs-avail__slots { border-left: none; border-top: 1px solid rgba(255,255,255,0.08); padding-left: 0; padding-top: 12px; width: 100%; }\n .cta-glass-section .cgs-trust { gap: 12px; }\n}\n\n@media (max-width: 479px) {\n .cta-glass-section .cgs-box { padding: 32px 16px; }\n .cta-glass-section .cgs-btn-primary,\n .cta-glass-section .cgs-btn-ghost { width: 100%; justify-content: center; }\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-3fbb56b e-con-full e-flex e-con e-parent\" data-id=\"3fbb56b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-055e9db elementor-widget elementor-widget-html\" data-id=\"055e9db\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"abm-section\">\n <div class=\"abm-wrap\">\n\n <div class=\"abm-right\">\n <p class=\"abm-eyebrow\">About me<\/p>\n <h2 class=\"abm-headline\">Crafting stories.<br><span class=\"abm-headline__accent\">Frame by frame.<\/span><\/h2>\n\n <p class=\"abm-body\">\n At 26, I've built <strong class=\"abm-strong\">AymanFrames<\/strong> from Morocco into a professional studio where cinematic excellence isn't the goal \u2014 it's the baseline. Every project I take on carries the weight of over 500 completed works and a relentless obsession with quality.\n <\/p>\n <p class=\"abm-body\">\n I don't just edit footage. I take full ownership of the technical journey \u2014 from precision color grading and expert sound design to the final frame \u2014 so you never have to think about it. The process is effortless on your end because I handle everything with an elite level of care.\n <\/p>\n <p class=\"abm-body\">\n My goal is simple: a seamless creative partnership where your story is told with world-class quality, zero stress, and results you'll be proud to share.\n <\/p>\n\n <div class=\"abm-pills\">\n <span class=\"abm-pill\">Color Grading<\/span>\n <span class=\"abm-pill\">Sound Design<\/span>\n <span class=\"abm-pill\">Cinematic Editing<\/span>\n <span class=\"abm-pill\">Motion Graphics<\/span>\n <span class=\"abm-pill\">Short-Form Content<\/span>\n <\/div>\n\n <div class=\"abm-stats\">\n <div class=\"abm-stat\">\n <span class=\"abm-stat__num\">500<span class=\"abm-stat__plus\">+<\/span><\/span>\n <span class=\"abm-stat__label\">Projects completed<\/span>\n <\/div>\n <div class=\"abm-stat-divider\"><\/div>\n <div class=\"abm-stat\">\n <span class=\"abm-stat__num\">8<span class=\"abm-stat__plus\">+<\/span><\/span>\n <span class=\"abm-stat__label\">Years experience<\/span>\n <\/div>\n <div class=\"abm-stat-divider\"><\/div>\n <div class=\"abm-stat\">\n <span class=\"abm-stat__num\">100<span class=\"abm-stat__plus\">%<\/span><\/span>\n <span class=\"abm-stat__label\">Satisfaction<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"abm-left\">\n <div class=\"abm-img-wrap\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/PROFILE-PICTURE-scaled.png\" class=\"abm-photo\" alt=\"Ayman\">\n <div class=\"abm-img-badge\">\n <span class=\"abm-badge-dot\"><\/span>\n Available for projects\n <\/div>\n <\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n<style>\n.abm-section {\n font-family: sans-serif;\n padding: 60px 24px;\n display: flex;\n justify-content: center;\n}\n\n.abm-wrap {\n display: grid;\n grid-template-columns: 1fr 340px;\n gap: 64px;\n max-width: 1040px;\n width: 100%;\n align-items: center;\n}\n\n.abm-right {\n display: flex;\n flex-direction: column;\n}\n\n.abm-eyebrow {\n font-size: 12px;\n font-weight: 700;\n letter-spacing: 0.18em;\n text-transform: uppercase;\n color: #ff2d78;\n margin: 0 0 16px;\n padding: 0;\n}\n\n.abm-headline {\n font-size: clamp(30px, 3.5vw, 50px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.02em;\n line-height: 1.05;\n color: #ffffff;\n margin: 0 0 28px;\n padding: 0;\n}\n\n.abm-headline__accent { color: #ff2d78; }\n\n.abm-body {\n font-size: 15px;\n line-height: 1.75;\n color: rgba(255,255,255,0.5);\n margin: 0 0 14px;\n padding: 0;\n}\n\n.abm-strong {\n color: rgba(255,255,255,0.85);\n font-weight: 700;\n}\n\n.abm-pills {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n margin: 20px 0 32px;\n}\n\n.abm-pill {\n display: inline-block;\n padding: 7px 14px;\n border: 1px solid rgba(255,45,120,0.25);\n border-radius: 50px;\n font-size: 12px;\n font-weight: 600;\n color: rgba(255,255,255,0.45);\n letter-spacing: 0.04em;\n transition: border-color 0.2s, color 0.2s;\n cursor: default;\n}\n\n.abm-pill:hover { border-color: #ff2d78; color: #ff2d78; }\n\n.abm-stats {\n display: flex;\n align-items: center;\n background: rgba(255,255,255,0.04);\n border: 1px solid rgba(255,255,255,0.08);\n border-radius: 16px;\n padding: 20px 24px;\n gap: 0;\n}\n\n.abm-stat {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 5px;\n flex: 1;\n}\n\n.abm-stat__num {\n font-size: 26px;\n font-weight: 800;\n color: #ffffff;\n line-height: 1;\n}\n\n.abm-stat__plus { font-size: 18px; color: #ff2d78; }\n\n.abm-stat__label {\n font-size: 10px;\n color: rgba(255,255,255,0.35);\n text-align: center;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n font-weight: 600;\n}\n\n.abm-stat-divider {\n width: 1px;\n height: 36px;\n background: rgba(255,255,255,0.08);\n flex-shrink: 0;\n}\n\n.abm-left { display: flex; flex-direction: column; }\n\n.abm-img-wrap { position: relative; }\n\n.abm-img-placeholder {\n width: 100%;\n aspect-ratio: 3\/4;\n border-radius: 24px;\n border: 2px dashed rgba(255,45,120,0.3);\n background: rgba(255,255,255,0.03);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 12px;\n}\n\n.abm-photo {\n width: 100%;\n aspect-ratio: 3\/4;\n border-radius: 24px;\n object-fit: cover;\n display: block;\n}\n\n.abm-img-hint {\n font-size: 12px;\n color: rgba(255,255,255,0.2);\n letter-spacing: 0.05em;\n}\n\n.abm-img-badge {\n position: absolute;\n bottom: 20px;\n left: 50%;\n transform: translateX(-50%);\n white-space: nowrap;\n display: inline-flex;\n align-items: center;\n gap: 7px;\n background: rgba(17,16,16,0.88);\n border: 1px solid rgba(255,45,120,0.3);\n border-radius: 50px;\n padding: 9px 18px;\n font-size: 12px;\n font-weight: 600;\n color: rgba(255,255,255,0.7);\n backdrop-filter: blur(12px);\n -webkit-backdrop-filter: blur(12px);\n}\n\n.abm-badge-dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: #ff2d78;\n flex-shrink: 0;\n animation: abm-pulse 1.6s ease-in-out infinite;\n}\n\n@keyframes abm-pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.3; transform: scale(0.6); }\n}\n\n@media (max-width: 860px) {\n .abm-wrap {\n grid-template-columns: 1fr;\n gap: 40px;\n }\n .abm-left { order: -1; max-width: 320px; margin: 0 auto; width: 100%; }\n .abm-img-placeholder { aspect-ratio: 1\/1; }\n .abm-photo { aspect-ratio: 1\/1; }\n}\n\n@media (max-width: 479px) {\n .abm-section { padding: 40px 16px; }\n .abm-stat__num { font-size: 20px; }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ca46f31 e-con-full e-flex e-con e-parent\" data-id=\"ca46f31\" data-element_type=\"container\" data-e-type=\"container\" id=\"faq\" faq=\"\">\n\t\t\t\t<div class=\"elementor-element elementor-element-551ad60 elementor-widget elementor-widget-html\" data-id=\"551ad60\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>FAQ<\/title>\n <style>\n *, *::before, *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n body {\n background: transparent;\n font-family: sans-serif;\n color: #fff;\n }\n\n .faq-section {\n max-width: 1200px;\n margin: 0 auto;\n padding: 80px 48px;\n display: grid;\n grid-template-columns: 220px 1fr;\n gap: 80px;\n align-items: start;\n }\n\n .faq-title {\n font-size: clamp(40px, 5vw, 72px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.02em;\n line-height: 1;\n color: #ffffff;\n position: sticky;\n top: 40px;\n padding-top: 60px;\n }\n\n .faq-list {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n\n \/* \u2500\u2500 Each item \u2500\u2500 *\/\n .faq-item {\n border-radius: 0px;\n padding: 0;\n background: rgba(255,255,255,0);\n transition:\n background 0.45s ease,\n border-radius 0.45s ease,\n padding 0.45s ease,\n margin-bottom 0.45s ease;\n will-change: background, padding;\n }\n\n .faq-item.open {\n background: rgba(255,255,255,0.08);\n border-radius: 16px;\n padding: 0 24px;\n margin-bottom: 4px;\n }\n\n \/* \u2500\u2500 Question row \u2500\u2500 *\/\n .faq-question {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 24px;\n padding: 22px 0;\n cursor: pointer;\n user-select: none;\n -webkit-tap-highlight-color: transparent;\n }\n\n .faq-question span {\n font-size: clamp(15px, 1.5vw, 19px);\n font-weight: 500;\n color: #ffffff;\n line-height: 1.4;\n transition: color 0.25s ease;\n }\n\n .faq-question:hover span {\n color: rgba(255,255,255,0.65);\n }\n\n \/* \u2500\u2500 Icon \u2500\u2500 *\/\n .faq-icon {\n width: 34px;\n height: 34px;\n border-radius: 50%;\n background: rgba(255,255,255,0.15);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n position: relative;\n font-size: 22px;\n font-weight: 300;\n color: #fff;\n }\n\n .faq-icon .i-plus,\n .faq-icon .i-minus {\n position: absolute;\n transition: opacity 0.35s ease, transform 0.35s ease;\n line-height: 1;\n }\n\n .faq-icon .i-plus { opacity: 1; transform: rotate(0deg); }\n .faq-icon .i-minus { opacity: 0; transform: rotate(-45deg); }\n\n .faq-item.open .faq-icon .i-plus { opacity: 0; transform: rotate(45deg); }\n .faq-item.open .faq-icon .i-minus { opacity: 1; transform: rotate(0deg); }\n\n \/* \u2500\u2500 Answer \u2500\u2500 *\/\n .faq-answer {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows 0.45s ease;\n }\n\n .faq-item.open .faq-answer {\n grid-template-rows: 1fr;\n }\n\n .faq-answer-overflow {\n overflow: hidden;\n }\n\n .faq-answer-inner {\n padding: 0 0 22px 0;\n font-size: clamp(13px, 1.2vw, 15px);\n font-weight: 500;\n color: rgba(255,255,255,0.75);\n line-height: 1.75;\n opacity: 0;\n transform: translateY(-6px);\n transition:\n opacity 0.35s ease 0.08s,\n transform 0.35s ease 0.08s;\n }\n\n .faq-item.open .faq-answer-inner {\n opacity: 1;\n transform: translateY(0);\n }\n\n \/* \u2500\u2500 Responsive \u2500\u2500 *\/\n @media (max-width: 900px) {\n .faq-section {\n grid-template-columns: 1fr;\n gap: 40px;\n padding: 64px 32px;\n }\n .faq-title { position: static; }\n }\n\n @media (max-width: 480px) {\n .faq-section { padding: 48px 16px; }\n .faq-question { padding: 18px 0; }\n .faq-item.open { padding: 0 16px; }\n }\n <\/style>\n<\/head>\n<body>\n\n<section class=\"faq-section\">\n\n <h2 class=\"faq-title\">FAQ<\/h2>\n\n <div class=\"faq-list\">\n\n <div class=\"faq-item open\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What type of videos do you edit?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">I specialize in cinematic long-form videos, YouTube content, events, and high-quality branded edits.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How do I start a project with you?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">You send your footage and brief \u2192 I review \u2192 you receive a custom quote \u2192 we start after confirmation.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How long does delivery take?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Depending on the project, delivery ranges from 2 to 5 days on average.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Do you offer revisions?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Yes, I offer unlimited revisions within the original scope to ensure you're fully satisfied.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What if I want major changes?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Big changes like a new style or structure may require an additional fee or a new project.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What do I need to provide?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Raw footage, clear instructions, and any references or examples you like.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How can I send my footage?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">You can upload your files using any platform such as Google Drive, Dropbox, iCloud, OneDrive, or similar services.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Can you choose music for my video?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Yes, I can select music that fits your video, or you can provide your own.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What quality will my video be delivered in?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Up to 4K, depending on your original footage quality.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How do payments work?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">For new clients, 50% upfront and 50% after final delivery.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Do you offer monthly packages?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Yes, I offer custom monthly plans for clients who need consistent content.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Do you offer refunds?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Refunds are only available if the project is not delivered or if there is a significant delay from my side. Once work has been delivered as agreed, refunds are not provided. I always work closely with you through revisions to make sure you're fully satisfied with the final result.<\/p>\n <\/div><\/div>\n <\/div>\n\n <\/div>\n<\/section>\n\n<script>\n function toggle(btn) {\n const item = btn.closest('.faq-item');\n const isOpen = item.classList.contains('open');\n\n document.querySelectorAll('.faq-item.open').forEach(el => {\n el.classList.remove('open');\n });\n\n if (!isOpen) {\n item.classList.add('open');\n }\n }\n<\/script>\n\n<\/body>\n<\/html>\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>Ripple Grid Professional Video Editing Services For Creators, Brands, and Businesses Contact https:\/\/www.youtube.com\/watch?v=XHOmBV4js_Ehttps:\/\/www.youtube.com\/watch?v=XHOmBV4js_Ehttps:\/\/www.youtube.com\/watch?v=XHOmBV4js_E VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + Step 1: Comms + Submission WhatsApp You We Need AnAwesome Video! AF Aymanframes On It! Step 2: Project […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-17","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages\/17","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aymanframes.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=17"}],"version-history":[{"count":638,"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages\/17\/revisions"}],"predecessor-version":[{"id":768,"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages\/17\/revisions\/768"}],"wp:attachment":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=17"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Ripple Grid<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n html, body { background: #0a0a0a; overflow-x: hidden; }\n\n #wrap {\n position: relative;\n height: 400vh;\n }\n\n #sticky {\n position: sticky;\n top: 0;\n width: 100%;\n height: 100vh;\n overflow: hidden;\n }\n\n canvas {\n display: block;\n width: 100%;\n height: 100%;\n }\n <\/style>\n<\/head>\n<body>\n\n<div id=\"wrap\">\n <div id=\"sticky\">\n <canvas id=\"c\"><\/canvas>\n <\/div>\n<\/div>\n\n<script type=\"module\">\n import { Renderer, Program, Triangle, Mesh } from 'https:\/\/esm.sh\/ogl';\n\n const canvas = document.getElementById('c');\n const wrap = document.getElementById('wrap');\n const sticky = document.getElementById('sticky');\n\n const renderer = new Renderer({ canvas, dpr: Math.min(window.devicePixelRatio, 2), alpha: true });\n const gl = renderer.gl;\n gl.clearColor(0.04, 0.04, 0.04, 1);\n gl.enable(gl.BLEND);\n gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);\n\n const vert = `\n attribute vec2 position;\n varying vec2 vUv;\n void main() {\n vUv = position * 0.5 + 0.5;\n gl_Position = vec4(position, 0.0, 1.0);\n }`;\n\n const frag = `precision highp float;\n uniform float iTime;\n uniform vec2 iResolution;\n uniform vec3 gridColor;\n uniform float rippleIntensity;\n uniform float gridSize;\n uniform float gridThickness;\n uniform float fadeDistance;\n uniform float vignetteStrength;\n uniform float glowIntensity;\n uniform float opacity;\n uniform float gridRotation;\n uniform bool mouseInteraction;\n uniform vec2 mousePosition;\n uniform float mouseInfluence;\n uniform float mouseInteractionRadius;\n uniform float noiseIntensity;\n varying vec2 vUv;\n\n float pi = 3.141592;\n\n mat2 rotMat(float angle) {\n float s = sin(angle); float c = cos(angle);\n return mat2(c, -s, s, c);\n }\n\n float random(vec2 st) {\n return fract(sin(dot(st.xy, vec2(12.9898, 78.233))) * 43758.5453123);\n }\n\n void main() {\n vec2 uv = vUv * 2.0 - 1.0;\n uv.x *= iResolution.x \/ iResolution.y;\n\n float rot = gridRotation * pi \/ 180.0;\n if (rot != 0.0) uv = rotMat(rot) * uv;\n\n float dist = length(uv);\n float func = sin(pi * (iTime - dist));\n vec2 rippleUv = uv + uv * func * rippleIntensity;\n\n if (mouseInteraction && mouseInfluence > 0.0) {\n vec2 mouseUv = (mousePosition * 2.0 - 1.0);\n mouseUv.x *= iResolution.x \/ iResolution.y;\n float mouseDist = length(uv - mouseUv);\n float influence = mouseInfluence * exp(-mouseDist * mouseDist \/ (mouseInteractionRadius * mouseInteractionRadius));\n float mouseWave = sin(pi * (iTime * 2.0 - mouseDist * 3.0)) * influence;\n rippleUv += normalize(uv - mouseUv) * mouseWave * rippleIntensity * 0.3;\n }\n\n vec2 a = sin(gridSize * 0.5 * pi * rippleUv - pi \/ 2.0);\n vec2 b = abs(a);\n float aaWidth = 0.5;\n vec2 smoothB = vec2(\n smoothstep(0.0, aaWidth, b.x),\n smoothstep(0.0, aaWidth, b.y)\n );\n\n vec3 color = vec3(0.0);\n color += exp(-gridThickness * smoothB.x * (0.8 + 0.5 * sin(pi * iTime)));\n color += exp(-gridThickness * smoothB.y);\n color += 0.5 * exp(-(gridThickness \/ 4.0) * sin(smoothB.x));\n color += 0.5 * exp(-(gridThickness \/ 3.0) * smoothB.y);\n\n if (glowIntensity > 0.0) {\n color += glowIntensity * exp(-gridThickness * 0.5 * smoothB.x);\n color += glowIntensity * exp(-gridThickness * 0.5 * smoothB.y);\n }\n\n float ddd = exp(-2.0 * clamp(pow(dist, fadeDistance), 0.0, 1.0));\n vec2 vignetteCoords = vUv - 0.5;\n float vignetteDistance = length(vignetteCoords);\n float vignette = 1.0 - pow(vignetteDistance * 2.0, vignetteStrength);\n vignette = clamp(vignette, 0.0, 1.0);\n\n float finalFade = ddd * vignette;\n float baseAlpha = length(color) * finalFade * opacity;\n vec3 finalColor = color * gridColor * finalFade * opacity;\n\n float noiseValue = random(vUv * iResolution + fract(iTime));\n if (noiseIntensity > 0.0) finalColor += (noiseValue - 0.5) * noiseIntensity;\n\n float finalAlpha = clamp(baseAlpha + (noiseValue * noiseIntensity), 0.0, 1.0);\n gl_FragColor = vec4(finalColor, finalAlpha);\n }`;\n\n const uniforms = {\n iTime: { value: 0 },\n iResolution: { value: [1, 1] },\n gridColor: { value: [1, 1, 1] },\n rippleIntensity: { value: 0.02 },\n gridSize: { value: 15.0 },\n gridThickness: { value: 15.0 },\n fadeDistance: { value: 1.5 },\n vignetteStrength: { value: 0.2 },\n glowIntensity: { value: 3.0 },\n opacity: { value: 0.2 },\n gridRotation: { value: 0 },\n mouseInteraction: { value: true },\n mousePosition: { value: [0.5, 0.5] },\n mouseInfluence: { value: 0 },\n mouseInteractionRadius: { value: 1 },\n noiseIntensity: { value: 0.3 }\n };\n\n const geo = new Triangle(gl);\n const program = new Program(gl, { vertex: vert, fragment: frag, uniforms });\n const mesh = new Mesh(gl, { geometry: geo, program });\n\n const resize = () => {\n const w = sticky.clientWidth;\n const h = sticky.clientHeight;\n renderer.setSize(w, h);\n uniforms.iResolution.value = [w, h];\n };\n window.addEventListener('resize', resize);\n resize();\n\n let mouse = { x: 0.5, y: 0.5 };\n let targetMouse = { x: 0.5, y: 0.5 };\n let targetInfluence = 0;\n\n sticky.addEventListener('mousemove', e => {\n const r = sticky.getBoundingClientRect();\n targetMouse = {\n x: (e.clientX - r.left) \/ r.width,\n y: 1 - (e.clientY - r.top) \/ r.height\n };\n });\n sticky.addEventListener('mouseenter', () => targetInfluence = 1);\n sticky.addEventListener('mouseleave', () => targetInfluence = 0);\n\n \/*\n * Subtle scroll phases \u2014 gridSize only goes from 15 \u2192 12 (barely any zoom),\n * ripple and rotation change very gently too.\n *\/\n const phases = [\n { ripple: 0.02, gridSize: 15.0, thickness: 15, glow: 3.0, opacity: 0.20, rotation: 0, fade: 1.5 },\n { ripple: 0.03, gridSize: 14.0, thickness: 14, glow: 3.5, opacity: 0.23, rotation: 4, fade: 1.4 },\n { ripple: 0.04, gridSize: 13.0, thickness: 13, glow: 4.0, opacity: 0.26, rotation: 8, fade: 1.3 },\n { ripple: 0.05, gridSize: 12.0, thickness: 12, glow: 4.5, opacity: 0.29, rotation: 12, fade: 1.2 }\n ];\n\n const lerp = (a, b, t) => a + (b - a) * t;\n const ease = t => t < 0.5 ? 2*t*t : -1+(4-2*t)*t;\n\n let scrollP = 0;\n let targetScrollP = 0;\n\n window.addEventListener('scroll', () => {\n const maxScroll = wrap.scrollHeight - window.innerHeight;\n targetScrollP = Math.min(window.scrollY \/ maxScroll, 1);\n }, { passive: true });\n\n const render = t => {\n uniforms.iTime.value = t * 0.0005;\n\n scrollP += (targetScrollP - scrollP) * 0.06;\n\n const totalPhases = phases.length - 1;\n const rawIdx = scrollP * totalPhases;\n const phaseIdx = Math.floor(rawIdx);\n const phaseFrac = ease(rawIdx - phaseIdx);\n const p0 = phases[Math.min(phaseIdx, totalPhases)];\n const p1 = phases[Math.min(phaseIdx + 1, totalPhases)];\n\n uniforms.rippleIntensity.value = lerp(p0.ripple, p1.ripple, phaseFrac);\n uniforms.gridSize.value = lerp(p0.gridSize, p1.gridSize, phaseFrac);\n uniforms.gridThickness.value = lerp(p0.thickness, p1.thickness, phaseFrac);\n uniforms.glowIntensity.value = lerp(p0.glow, p1.glow, phaseFrac);\n uniforms.opacity.value = lerp(p0.opacity, p1.opacity, phaseFrac);\n uniforms.gridRotation.value = lerp(p0.rotation, p1.rotation, phaseFrac);\n uniforms.fadeDistance.value = lerp(p0.fade, p1.fade, phaseFrac);\n\n mouse.x += (targetMouse.x - mouse.x) * 0.1;\n mouse.y += (targetMouse.y - mouse.y) * 0.1;\n uniforms.mouseInfluence.value += (targetInfluence - uniforms.mouseInfluence.value) * 0.05;\n uniforms.mousePosition.value = [mouse.x, mouse.y];\n\n renderer.render({ scene: mesh });\n requestAnimationFrame(render);\n };\n\n requestAnimationFrame(render);\n<\/script>\n\n<\/body>\n<\/html>\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-aaca14f e-con-full e-flex e-con e-parent\" data-id=\"aaca14f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-e8be43d e-con-full e-flex elementor-invisible e-con e-child\" data-id=\"e8be43d\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"motion_fx_motion_fx_mouse":"yes","motion_fx_tilt_effect":"yes","motion_fx_tilt_speed":{"unit":"px","size":0.200000000000000011102230246251565404236316680908203125,"sizes":[]},"animation":"fadeInUp"}\">\n\t\t<div class=\"elementor-element elementor-element-be79476 e-con-full e-flex e-con e-child\" data-id=\"be79476\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9dca638 elementor-widget elementor-widget-heading\" data-id=\"9dca638\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Professional Video Editing Services<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-55f4a93 elementor-widget elementor-widget-heading\" data-id=\"55f4a93\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">\nFor Creators, Brands, and Businesses<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-296fa41 e-con-full e-flex e-con e-child\" data-id=\"296fa41\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4afb268 elementor-align-center elementor-invisible elementor-widget elementor-widget-button\" data-id=\"4afb268\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"fadeIn"}\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#contact1\" id=\"1\">\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\">Contact<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\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-758f856 e-con-full e-flex elementor-invisible e-con e-parent\" data-id=\"758f856\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"animation":"fadeInUp"}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-13d0c9f elementor-widget__width-inherit elementor-skin-carousel elementor-widget elementor-widget-media-carousel\" data-id=\"13d0c9f\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"Home\" data-settings=\"{"slides_per_view":"7","slides_to_scroll":"6","speed":7500,"autoplay_speed":1,"space_between":{"unit":"px","size":50,"sizes":[]},"skin":"carousel","effect":"slide","autoplay":"yes","loop":"yes","space_between_tablet":{"unit":"px","size":10,"sizes":[]},"space_between_mobile":{"unit":"px","size":10,"sizes":[]}}\" data-widget_type=\"media-carousel.default\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"elementor-main-swiper swiper\" role=\"region\" aria-roledescription=\"carousel\" aria-label=\"Slides\">\n\t\t\t\t<div class=\"swiper-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"sightscape_logo\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/sightscape_logo.svg')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"logo_main\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/logo_main.svg')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"658456f77aa15f21aaf0c0fb_Group 3509\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/658456f77aa15f21aaf0c0fb_Group-3509.svg')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"LOGO_01 (1)\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/LOGO_01-1.png')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"Design-sans-titre-13 (2)\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-13-2.png')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"logo-HypeTv-nuevo-blanco_Mesa-de-trabajo-1-copia-8-copy-3\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/03\/logo-HypeTv-nuevo-blanco_Mesa-de-trabajo-1-copia-8-copy-3.png')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"swiper-slide\" role=\"group\" aria-roledescription=\"slide\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-carousel-image\" role=\"img\" aria-label=\"Smart-target-Best-Digital-Marketing-Agency-In-Kuwait\" style=\"background-image: url('https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/Smart-target-Best-Digital-Marketing-Agency-In-Kuwait.webp')\">\n\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fc902d1 e-flex e-con-boxed e-con e-parent\" data-id=\"fc902d1\" data-element_type=\"container\" data-e-type=\"container\" id=\"ourwork\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-7bb911e e-con-full e-flex e-con e-child\" data-id=\"7bb911e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-efbb26f elementor-widget elementor-widget-video\" data-id=\"efbb26f\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"youtube_url":"https:\\\/\\\/www.youtube.com\\\/watch?v=XHOmBV4js_E","video_type":"youtube","controls":"yes"}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cfc4f32 e-con-full e-flex e-con e-child\" data-id=\"cfc4f32\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c65bdc1 elementor-widget elementor-widget-video\" data-id=\"c65bdc1\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"youtube_url":"https:\\\/\\\/www.youtube.com\\\/watch?v=XHOmBV4js_E","video_type":"youtube","controls":"yes"}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-446ccfd e-con-full e-flex e-con e-child\" data-id=\"446ccfd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d09fc6 elementor-widget elementor-widget-video\" data-id=\"1d09fc6\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"youtube_url":"https:\\\/\\\/www.youtube.com\\\/watch?v=XHOmBV4js_E","video_type":"youtube","controls":"yes"}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1269339 elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con-boxed e-con e-parent\" data-id=\"1269339\" 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-258906a elementor-widget elementor-widget-html\" data-id=\"258906a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n \/* --- WRAPPER & LAYOUT --- *\/\n .infinite-video-gallery {\n position: relative;\n width: 100%;\n height: 80vh; \/* Adjust how tall you want the section to be *\/\n overflow: hidden;\n display: flex;\n justify-content: center;\n gap: 30px; \/* Space between columns *\/\n padding: 50px 0;\n \n \/* Creates the fade-out effect at the top and bottom *\/\n -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);\n mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);\n }\n\n \/* --- THE SCROLLING COLUMNS --- *\/\n .scrolling-column {\n display: flex;\n flex-direction: column;\n gap: 40px; \/* Space between cards vertically *\/\n \/* 30s is the speed. Lower number = faster scroll *\/\n animation: scrollVertical 30s linear infinite; \n }\n\n \/* Stagger the middle column so they don't look perfectly lined up *\/\n .col-middle {\n margin-top: -150px; \n }\n\n \/* Pause ALL columns when you hover over the gallery area *\/\n .infinite-video-gallery:hover .scrolling-column {\n animation-play-state: paused;\n }\n\n @keyframes scrollVertical {\n 0% { transform: translateY(0); }\n \/* Moves the column up exactly halfway, creating a seamless loop *\/\n 100% { transform: translateY(-50%); } \n }\n\n \/* --- THE VIDEO CARDS --- *\/\n .v-card {\n position: relative;\n border-radius: 20px;\n overflow: hidden;\n cursor: pointer;\n box-shadow: 0 10px 30px rgba(0,0,0,0.5);\n transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;\n border: 1px solid rgba(255, 255, 255, 0.1);\n }\n\n \/* Card Sizes *\/\n .card-vertical { width: 260px; height: 460px; }\n .card-landscape { width: 380px; height: 220px; }\n\n \/* Initial Tilts *\/\n .tilt-left { transform: rotate(-4deg); }\n .tilt-right { transform: rotate(4deg); }\n\n \/* Hover State: Straighten, Scale, and Glow *\/\n .v-card:hover {\n transform: scale(1.08) rotate(0deg) !important;\n z-index: 10;\n box-shadow: 0 15px 40px rgba(255, 36, 141, 0.3), 0 0 15px rgba(255, 36, 141, 0.5); \/* Pink glow *\/\n border-color: rgba(255, 36, 141, 0.8);\n }\n\n \/* The Image inside the card *\/\n .v-card img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform 0.4s ease;\n }\n\n \/* --- OVERLAY ELEMENTS (Play Button & Icon) --- *\/\n .play-btn-overlay {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: rgba(255, 36, 141, 0.85); \/* Your pink color *\/\n backdrop-filter: blur(4px);\n width: 65px;\n height: 45px;\n border-radius: 12px;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.3s ease, transform 0.3s ease;\n }\n\n \/* The little white triangle *\/\n .play-btn-overlay::after {\n content: '';\n display: block;\n border-left: 14px solid white;\n border-top: 9px solid transparent;\n border-bottom: 9px solid transparent;\n margin-left: 4px; \/* Centers triangle visually *\/\n }\n\n .v-card:hover .play-btn-overlay {\n background-color: rgba(255, 36, 141, 1);\n transform: translate(-50%, -50%) scale(1.1);\n }\n\n \/* Top Right Floating Icon (like the SVG in your video) *\/\n .floating-icon {\n position: absolute;\n top: -15px;\n right: -15px;\n width: 40px;\n height: 40px;\n background: white;\n border-radius: 50%;\n box-shadow: 0 4px 10px rgba(0,0,0,0.3);\n z-index: 5;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n \n \/* Just a placeholder icon shape *\/\n .floating-icon::before {\n content: 'S'; \/* Replace with your actual SVG or text later *\/\n font-weight: bold;\n color: black;\n }\n<\/style>\n\n<div class=\"infinite-video-gallery\">\n\n <div class=\"scrolling-column col-left\">\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1616423640778-28d1b53229bd?auto=format&fit=crop&w=400&q=80\" alt=\"Video 1\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1596704017254-9b121068fb31?auto=format&fit=crop&w=400&q=80\" alt=\"Video 2\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1512496015851-a90fb38ba796?auto=format&fit=crop&w=400&q=80\" alt=\"Video 3\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1616423640778-28d1b53229bd?auto=format&fit=crop&w=400&q=80\" alt=\"Video 1\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1596704017254-9b121068fb31?auto=format&fit=crop&w=400&q=80\" alt=\"Video 2\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1512496015851-a90fb38ba796?auto=format&fit=crop&w=400&q=80\" alt=\"Video 3\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"scrolling-column col-middle\">\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1533130061792-64b345e4a833?auto=format&fit=crop&w=800&q=80\" alt=\"Video 4\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-left\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1492691527719-9d1e07e534b4?auto=format&fit=crop&w=800&q=80\" alt=\"Video 5\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1518791841217-8f162f1e1131?auto=format&fit=crop&w=800&q=80\" alt=\"Video 6\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1533130061792-64b345e4a833?auto=format&fit=crop&w=800&q=80\" alt=\"Video 4\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-left\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1492691527719-9d1e07e534b4?auto=format&fit=crop&w=800&q=80\" alt=\"Video 5\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-landscape tilt-right\">\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1518791841217-8f162f1e1131?auto=format&fit=crop&w=800&q=80\" alt=\"Video 6\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"scrolling-column col-right\">\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1522869635100-9f4c5e86aa37?auto=format&fit=crop&w=400&q=80\" alt=\"Video 7\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1516280440502-61f53a1a5b48?auto=format&fit=crop&w=400&q=80\" alt=\"Video 8\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1506126613408-eca07ce68773?auto=format&fit=crop&w=400&q=80\" alt=\"Video 9\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1522869635100-9f4c5e86aa37?auto=format&fit=crop&w=400&q=80\" alt=\"Video 7\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-left\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1516280440502-61f53a1a5b48?auto=format&fit=crop&w=400&q=80\" alt=\"Video 8\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <div class=\"v-card card-vertical tilt-right\">\n <div class=\"floating-icon\"><\/div>\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1506126613408-eca07ce68773?auto=format&fit=crop&w=400&q=80\" alt=\"Video 9\">\n <div class=\"play-btn-overlay\"><\/div>\n <\/div>\n <\/div>\n\n<\/div>\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-53fcc07 e-con-full e-flex e-con e-parent\" data-id=\"53fcc07\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dae9f1e elementor-widget elementor-widget-html\" data-id=\"dae9f1e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"magic-section-container\" id=\"magic-section\">\n <div class=\"marquee-overlap-wrapper\">\n \n <div class=\"magic-marquee-wrapper layer-back\">\n <div class=\"magic-marquee-track\">\n <h1 class=\"magic-marquee-text\">\n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <\/h1>\n <h1 class=\"magic-marquee-text\">\n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <span>VIDEO<\/span> <span>MAGIC<\/span> <span>+<\/span> \n <\/h1>\n <\/div>\n <\/div>\n\n <svg class=\"magic-sweeping-line\" viewBox=\"0 0 1200 150\" preserveAspectRatio=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <defs>\n <filter id=\"neonPinkGlow\" x=\"-20%\" y=\"-20%\" width=\"140%\" height=\"140%\">\n <feGaussianBlur stdDeviation=\"4\" result=\"blur1\" \/>\n <feGaussianBlur stdDeviation=\"8\" result=\"blur2\" \/>\n <feMerge>\n <feMergeNode in=\"blur2\" \/>\n <feMergeNode in=\"blur1\" \/>\n <feMergeNode in=\"SourceGraphic\" \/>\n <\/feMerge>\n <\/filter>\n <\/defs>\n <path class=\"animated-path\" \n d=\"M -50,100 C 300,120 800,30 1250,40\" \n fill=\"transparent\" \n stroke=\"#FF007F\" \n stroke-width=\"6\" \n stroke-linecap=\"round\" \n filter=\"url(#neonPinkGlow)\"\/>\n <\/svg>\n\n <div class=\"magic-marquee-wrapper layer-front\">\n <div class=\"magic-marquee-track\">\n <h1 class=\"magic-marquee-text\">\n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <\/h1>\n <h1 class=\"magic-marquee-text\">\n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <span class=\"hide-text\">VIDEO<\/span> <span>MAGIC<\/span> <span class=\"hide-text\">+<\/span> \n <\/h1>\n <\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n<style>\n \/* 1. Container Layout *\/\n .magic-section-container {\n position: relative;\n width: 100%;\n padding: 60px 0; \n overflow: hidden; \n background-color: transparent; \n font-family: 'Montserrat', 'Poppins', 'Inter', sans-serif;\n }\n\n \/* 2. The Sandwich Wrapper *\/\n .marquee-overlap-wrapper {\n position: relative;\n width: 100%;\n display: flex;\n align-items: center;\n }\n\n \/* 3. Text Layers *\/\n .magic-marquee-wrapper {\n width: 100%;\n overflow: hidden;\n display: flex;\n white-space: nowrap;\n }\n \n \/* Pushes the back layer behind the line *\/\n .layer-back {\n position: relative;\n z-index: 2;\n }\n\n \/* Pulls the front layer over the line and positions it exactly over the back layer *\/\n .layer-front {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n z-index: 10;\n pointer-events: none; \/* Prevents invisible text from blocking clicks *\/\n }\n\n \/* THIS IS THE MAGIC TRICK: Hides front words so the line shows through *\/\n .hide-text {\n color: transparent;\n }\n\n .magic-marquee-track {\n display: flex;\n animation: scrollMarquee 20s linear infinite; \n }\n\n .magic-marquee-text {\n color: #ffffff;\n font-size: clamp(5rem, 9vw, 15rem);\n \/* Changed from 900 to normal to remove the bold effect *\/\n font-weight: bold; \n text-transform: uppercase;\n margin: 0;\n padding-right: 40px; \n line-height: 1;\n letter-spacing: -0.02em;\n flex-shrink: 0;\n }\n\n @keyframes scrollMarquee {\n 0% { transform: translateX(0); }\n 100% { transform: translateX(-100%); }\n }\n\n \/* 4. Sweeping Line Settings *\/\n .magic-sweeping-line {\n position: absolute;\n top: 50%; \n transform: translateY(-50%);\n left: 0;\n width: 100%;\n height: 150px;\n z-index: 5; \/* Sandwiched between Level 2 and Level 10 *\/\n opacity: 0; \n transition: opacity 0.4s ease;\n }\n\n .animated-path {\n stroke-dasharray: 1500;\n stroke-dashoffset: 1500;\n }\n\n \/* --- Scroll Animation Triggers --- *\/\n .magic-section-container.is-visible .magic-sweeping-line {\n opacity: 1;\n }\n\n .magic-section-container.is-visible .animated-path {\n animation: drawPinkLine 1.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;\n }\n\n @keyframes drawPinkLine {\n to { stroke-dashoffset: 0; }\n }\n\n @media (max-width: 768px) {\n .magic-sweeping-line { height: 90px; }\n }\n<\/style>\n\n<script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n const magicSection = document.getElementById('magic-section');\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('is-visible');\n } else {\n entry.target.classList.remove('is-visible'); \n }\n });\n }, { threshold: 0.4 });\n\n if (magicSection) {\n observer.observe(magicSection);\n }\n });\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d57caec e-con-full e-transform e-flex e-con e-parent\" data-id=\"d57caec\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{"_transform_scale_effect":{"unit":"px","size":1.1999999999999999555910790149937383830547332763671875,"sizes":[]},"_transform_scale_effect_tablet":{"unit":"px","size":"","sizes":[]},"_transform_scale_effect_mobile":{"unit":"px","size":"","sizes":[]}}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8070da8 elementor-widget elementor-widget-html\" data-id=\"8070da8\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"howitwork\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n #How-It-Works { padding: 60px 24px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 700; }\n .hiw-wrapper { max-width: 1060px; margin: 0 auto; display: flex; align-items: stretch; justify-content: center; gap: 0; }\n .hiw-card {\n flex: 1;\n min-width: 0;\n background: rgba(255,255,255,0.015);\n border: 1px solid rgba(255,255,255,0.06);\n border-radius: 24px;\n padding: 20px;\n backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n position: relative;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n cursor: pointer;\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 4px 24px rgba(0,0,0,0.15);\n }\n .hiw-card:hover, .hiw-card:active {\n transform: scale(1.05);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 12px 40px rgba(0,0,0,0.25);\n z-index: 10;\n }\n .hiw-card::before {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: 24px;\n background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0) 50%);\n pointer-events: none;\n }\n .hiw-arrow {\n flex-shrink: 0;\n width: 64px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 -6px;\n position: relative;\n z-index: 2;\n }\n .hiw-arrow img { width: 64px; height: auto; display: block; }\n .card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }\n .step-label { font-size: 11px; color: rgba(255,255,255,0.55); font-weight: 700; }\n .step-label span { color: rgba(255,255,255,0.95); font-weight: 800; }\n .brand { display: flex; align-items: center; gap: 5px; font-size: 12px; color: rgba(255,255,255,0.65); font-weight: 700; }\n .chat-row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; }\n .avatar { width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0; overflow: hidden; border: 1.5px solid rgba(255,255,255,0.15); }\n .avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }\n .af-badge { width: 42px; height: 42px; border-radius: 10px; background: rgba(255,255,255,0.04); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1.5px solid #e91e8c; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 900; flex-shrink: 0; letter-spacing: -1px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); }\n .chat-name { font-size: 10px; color: rgba(255,255,255,0.5); margin-bottom: 3px; font-weight: 700; }\n .chat-msg { font-size: 18px; font-weight: 900; color: #fff; line-height: 1.2; }\n .list-item { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; padding: 10px 14px; font-size: 14px; color: rgba(255,255,255,0.65); margin-bottom: 6px; display: flex; align-items: center; justify-content: space-between; font-weight: 700; backdrop-filter: blur(30px) saturate(180%); -webkit-backdrop-filter: blur(30px) saturate(180%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); }\n .list-item.active { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.15); color: #fff; font-weight: 900; transform: rotate(-2deg); box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 4px 16px rgba(0,0,0,0.2); }\n .approved { color: #4ade80; font-size: 11px; font-weight: 800; }\n .video-box { border-radius: 16px; aspect-ratio: 16\/10; display: flex; align-items: center; justify-content: center; position: relative; border: 1px solid rgba(255,255,255,0.07); overflow: visible; flex: 1; box-shadow: inset 0 1px 0 rgba(255,255,255,0.08); }\n .video-box-inner { position: absolute; inset: 0; border-radius: 16px; overflow: hidden; }\n .video-box-inner img { width: 100%; height: 100%; object-fit: cover; display: block; }\n .play-btn { position: relative; z-index: 1; width: 54px; height: 54px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,0.5); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); background: rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 4px 20px rgba(0,0,0,0.3); flex-shrink: 0; }\n .feedback-bubble { position: absolute; bottom: -14px; right: -8px; background: rgba(255,255,255,0.06); backdrop-filter: blur(40px) saturate(200%); -webkit-backdrop-filter: blur(40px) saturate(200%); border: 1px solid rgba(255,255,255,0.1); border-radius: 12px 12px 2px 12px; padding: 8px 12px; font-size: 12px; font-weight: 900; color: #fff; display: flex; align-items: center; gap: 6px; white-space: nowrap; z-index: 2; box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 4px 16px rgba(0,0,0,0.2); }\n\n @media (max-width: 820px) {\n .hiw-wrapper { flex-direction: column; align-items: center; gap: 0; }\n .hiw-card { width: 100%; max-width: 480px; }\n .hiw-arrow { width: 100%; height: 50px; margin: -4px 0; transform: rotate(90deg); }\n .hiw-arrow img { width: 50px; }\n }\n @media (max-width: 480px) {\n #How-It-Works { padding: 40px 16px; }\n .hiw-card { padding: 16px; }\n .chat-msg { font-size: 16px; }\n .list-item { font-size: 13px; padding: 8px 12px; }\n .feedback-bubble { font-size: 11px; padding: 6px 10px; }\n }\n<\/style>\n\n<section id=\"How-It-Works\">\n <div class=\"hiw-wrapper\">\n\n \n <div class=\"hiw-card\">\n <div class=\"card-header\">\n <div class=\"step-label\">Step 1: <span>Comms + Submission<\/span><\/div>\n <div class=\"brand\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"#25D366\"\/><path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z\" fill=\"white\"\/><\/svg>\n WhatsApp\n <\/div>\n <\/div>\n <div class=\"chat-row\">\n <div class=\"avatar\"><img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/profile-scaled.jpg\" alt=\"You\"><\/div>\n <div>\n <div class=\"chat-name\">You<\/div>\n <div class=\"chat-msg\">We Need An<br>Awesome Video!<\/div>\n <\/div>\n <\/div>\n <div class=\"chat-row\">\n <div class=\"af-badge\"><span style=\"color:#fff;\">A<\/span><span style=\"color:#e91e8c;\">F<\/span><\/div>\n <div>\n <div class=\"chat-name\">Aymanframes<\/div>\n <div class=\"chat-msg\">On It!<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"hiw-arrow\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/658d8857bb42f3b846953316_Group-6356711.png\" loading=\"lazy\" alt=\"\">\n <\/div>\n\n \n <div class=\"hiw-card\">\n <div class=\"card-header\">\n <div class=\"step-label\">Step 2: <span>Project Management<\/span><\/div>\n <\/div>\n <div class=\"list-item\">Instagram Reel <span class=\"approved\">\u2713 Approved<\/span><\/div>\n <div class=\"list-item\">TikTok Video<\/div>\n <div class=\"list-item active\">Awesome Video<\/div>\n <div class=\"list-item\">Motion Design<\/div>\n <\/div>\n\n \n <div class=\"hiw-arrow\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/658d8857bb42f3b846953316_Group-6356711.png\" loading=\"lazy\" alt=\"\">\n <\/div>\n\n \n <div class=\"hiw-card\">\n <div class=\"card-header\">\n <div class=\"step-label\">Step 3: <span>Revision & Feedback<\/span><\/div>\n <div class=\"brand\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"rgba(255,255,255,0.6)\" stroke-width=\"1.8\"><rect x=\"2\" y=\"6\" width=\"14\" height=\"12\" rx=\"2\"\/><path d=\"M16 10l6-4v12l-6-4\" stroke-linejoin=\"round\"\/><\/svg>\n frame.io\n <\/div>\n <\/div>\n <div class=\"video-box\">\n <div class=\"video-box-inner\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/fiverr-cover_.jpg\" alt=\"Video preview\">\n <\/div>\n <div class=\"play-btn\">\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"white\" style=\"margin-left:3px;\"><path d=\"M8 5v14l11-7z\"\/><\/svg>\n <\/div>\n <div class=\"feedback-bubble\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"rgba(255,255,255,0.6)\" stroke-width=\"2\" style=\"flex-shrink:0;\"><path d=\"M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z\"\/><\/svg>\n This Is Amazing!!\n <\/div>\n <\/div>\n <\/div>\n\n <\/div>\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ceea29c e-con-full e-flex e-con e-parent\" data-id=\"ceea29c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-229662b elementor-widget__width-inherit elementor-widget elementor-widget-heading\" data-id=\"229662b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">From raw clips to polished, captivating videos, we master the art of storytelling Films<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f71dcc7 elementor-align-center elementor-invisible elementor-widget elementor-widget-button\" data-id=\"f71dcc7\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"fadeIn"}\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#contact1\" contact1=\"\" id=\"1\">\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\">Contact<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a517766 e-con-full e-flex e-con e-parent\" data-id=\"a517766\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-33bf0ff elementor-widget elementor-widget-html\" data-id=\"33bf0ff\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"ourservices\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>Our Services<\/title>\n <style>\n *, *::before, *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n body {\n background-color: #111010;\n color: #fff;\n font-family: sans-serif;\n }\n\n \/* \u2500\u2500 Section \u2500\u2500 *\/\n .section-our-work {\n padding: 80px 48px 100px;\n max-width: 1400px;\n margin: 0 auto;\n }\n\n \/* \u2500\u2500 Heading \u2500\u2500 *\/\n .heading-2 {\n font-size: clamp(56px, 9vw, 80px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.01em;\n line-height: 1;\n color: #ffffff;\n margin-bottom: 48px;\n }\n\n \/* \u2500\u2500 Pills grid \u2500\u2500 *\/\n .bottom-our-wok {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n }\n\n \/* \u2500\u2500 Each pill \u2500\u2500 *\/\n .item-our-work {\n display: inline-flex;\n align-items: center;\n border: 1.5px solid rgba(182, 170, 174, 0.55);\n border-radius: 12px;\n cursor: pointer;\n background: rgba(255, 255, 255, 0.04);\n transition: border-color 0.2s ease, background 0.2s ease;\n -webkit-tap-highlight-color: transparent;\n }\n\n \/* HOVER \u2014 hot pink border, slightly brighter bg, text stays white *\/\n .item-our-work:hover,\n .item-our-work:active {\n border-color: #ff2d78;\n background: rgba(255, 45, 120, 0.06);\n }\n\n .item-our-work:hover .plus-10,\n .item-our-work:active .plus-10 {\n transform: rotate(45deg);\n }\n\n .gap-10 {\n display: flex;\n align-items: center;\n gap: 10px;\n font-size: clamp(15px, 1.4vw, 20px);\n font-weight: 500;\n color: #ffffff;\n white-space: nowrap;\n padding: 16px 28px;\n }\n\n .plus-10 {\n width: 15px;\n height: 15px;\n flex-shrink: 0;\n transition: transform 0.25s ease;\n filter: brightness(0) invert(1);\n }\n\n \/* \u2500\u2500 Responsive \u2500\u2500 *\/\n @media (max-width: 991px) {\n .section-our-work {\n padding: 60px 32px 80px;\n }\n .gap-10 {\n padding: 14px 22px;\n }\n }\n\n @media (max-width: 767px) {\n .section-our-work {\n padding: 48px 20px 64px;\n }\n .gap-10 {\n padding: 12px 18px;\n font-size: 14px;\n }\n .bottom-our-wok {\n gap: 10px;\n }\n }\n\n @media (max-width: 479px) {\n .gap-10 {\n padding: 11px 15px;\n font-size: 13px;\n }\n .bottom-our-wok {\n gap: 8px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n<section class=\"section-our-work\">\n\n <div class=\"top-our-work\">\n <h2 class=\"heading-2\">OUR SERVICES<\/h2>\n <\/div>\n\n <div class=\"bottom-our-wok\">\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Cinematic Long-Form Editing<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Short-Form Video Editing<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Advanced Color Grading<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Motion Graphics & VFX<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>YouTube Video Editing<\/div>\n <\/div>\n <\/div>\n\n <div class=\"item-our-work\">\n <div class=\"gap-10\">\n <img decoding=\"async\" src=\"https:\/\/cdn.prod.website-files.com\/658d8857bb42f3b8469532e7\/658d8857bb42f3b8469532f7_%2B.svg\" loading=\"lazy\" alt=\"+\" class=\"plus-10\">\n <div>Sound Design & Audio Mixing<\/div>\n <\/div>\n <\/div>\n\n <\/div>\n<\/section>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bdf57f6 e-con-full e-flex e-con e-parent\" data-id=\"bdf57f6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3d3e4f7 elementor-widget elementor-widget-image\" data-id=\"3d3e4f7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"490\" height=\"169\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/aymanframes-5stars-1.png\" class=\"attachment-full size-full wp-image-607\" alt=\"\" srcset=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/aymanframes-5stars-1.png 490w, https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/aymanframes-5stars-1-300x103.png 300w\" sizes=\"(max-width: 490px) 100vw, 490px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7f467c0 e-con-full e-flex e-con e-parent\" data-id=\"7f467c0\" data-element_type=\"container\" data-e-type=\"container\" id=\"testimonials\">\n\t\t\t\t<div class=\"elementor-element elementor-element-26d7b8c elementor-widget elementor-widget-heading\" data-id=\"26d7b8c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\nTESTIMONIALS<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-258bdc6 e-grid e-con-boxed e-con e-parent\" data-id=\"258bdc6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t\t\t\t\t<div data-id=\"638826d\" data-interaction-id=\"638826d\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"638826d\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"44dce0f\" data-interaction-id=\"44dce0f\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"44dce0f\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"e327c21\" data-interaction-id=\"e327c21\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"e327c21\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"369be23\" data-interaction-id=\"369be23\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"369be23\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"c60e5fe\" data-interaction-id=\"c60e5fe\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"c60e5fe\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t\t\t\t\t<div data-id=\"90edf17\" data-interaction-id=\"90edf17\" data-e-type=\"e-youtube\" class=\"e-youtube-base\" data-e-type=\"widget\" data-id=\"90edf17\" data-settings=\"{"source":"https:\/\/www.youtube.com\/watch?v=XHOmBV4js_E","autoplay":false,"mute":false,"controls":true,"cc_load_policy":false,"loop":false,"rel":true,"start":null,"end":null,"privacy":false,"lazyload":false}\"><\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-df91a0e e-flex e-con-boxed e-con e-parent\" data-id=\"df91a0e\" 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-8c99080 elementor-widget__width-inherit elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile elementor-widget elementor-widget-html\" data-id=\"8c99080\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n #af-pricing {\n padding: 80px 24px;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n text-align: center;\n }\n #af-pricing .af-title {\n font-size: 13px;\n font-weight: 800;\n color: #e91e8c;\n letter-spacing: 0.15em;\n text-transform: uppercase;\n margin-bottom: 12px;\n }\n #af-pricing .af-heading {\n font-size: 42px;\n font-weight: 900;\n color: #fff;\n line-height: 1.1;\n margin-bottom: 16px;\n }\n #af-pricing .af-subheading {\n font-size: 16px;\n font-weight: 600;\n color: rgba(255,255,255,0.45);\n margin-bottom: 56px;\n }\n #af-pricing .plans-grid {\n display: flex;\n align-items: stretch;\n justify-content: center;\n gap: 20px;\n max-width: 1060px;\n margin: 0 auto;\n flex-wrap: wrap;\n }\n #af-pricing .plan-card {\n flex: 1;\n min-width: 260px;\n max-width: 320px;\n background: rgba(255,255,255,0.015);\n border: 1px solid rgba(255,255,255,0.07);\n border-radius: 24px;\n padding: 32px 28px;\n backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(1.1);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 4px 24px rgba(0,0,0,0.2);\n text-align: left;\n position: relative;\n overflow: hidden;\n transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n }\n #af-pricing .plan-card::before {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: 24px;\n background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0) 50%);\n pointer-events: none;\n }\n #af-pricing .plan-card:hover {\n transform: scale(1.05);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 16px 48px rgba(0,0,0,0.3);\n }\n #af-pricing .plan-card.featured {\n background: rgba(233,30,140,0.08);\n border: 1px solid rgba(233,30,140,0.35);\n box-shadow: inset 0 1px 0 rgba(233,30,140,0.2), 0 4px 40px rgba(233,30,140,0.15);\n }\n #af-pricing .plan-card.featured::before {\n background: linear-gradient(135deg, rgba(233,30,140,0.08) 0%, rgba(255,255,255,0) 50%);\n }\n #af-pricing .popular-badge {\n display: inline-block;\n background: linear-gradient(90deg, #e91e8c, #ff6eb4);\n color: #fff;\n font-size: 11px;\n font-weight: 800;\n letter-spacing: 0.1em;\n text-transform: uppercase;\n padding: 4px 12px;\n border-radius: 20px;\n margin-bottom: 20px;\n }\n #af-pricing .plan-name {\n font-size: 20px;\n font-weight: 900;\n color: #fff;\n margin-bottom: 8px;\n }\n #af-pricing .plan-desc {\n font-size: 13px;\n font-weight: 600;\n color: rgba(255,255,255,0.4);\n margin-bottom: 24px;\n line-height: 1.5;\n }\n #af-pricing .plan-price {\n display: flex;\n align-items: flex-end;\n gap: 4px;\n margin-bottom: 28px;\n }\n #af-pricing .price-currency {\n font-size: 20px;\n font-weight: 800;\n color: rgba(255,255,255,0.7);\n margin-bottom: 6px;\n }\n #af-pricing .price-amount {\n font-size: 52px;\n font-weight: 900;\n color: #fff;\n line-height: 1;\n }\n #af-pricing .price-period {\n font-size: 14px;\n font-weight: 700;\n color: rgba(255,255,255,0.4);\n margin-bottom: 8px;\n }\n #af-pricing .divider {\n height: 1px;\n background: rgba(255,255,255,0.07);\n margin-bottom: 24px;\n }\n #af-pricing .features-list {\n list-style: none;\n padding: 0;\n margin: 0 0 32px 0;\n flex: 1;\n }\n #af-pricing .features-list li {\n display: flex;\n align-items: center;\n gap: 10px;\n font-size: 14px;\n font-weight: 700;\n color: rgba(255,255,255,0.75);\n padding: 8px 0;\n border-bottom: 1px solid rgba(255,255,255,0.04);\n }\n #af-pricing .features-list li:last-child { border-bottom: none; }\n #af-pricing .check {\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: rgba(233,30,140,0.15);\n border: 1px solid rgba(233,30,140,0.3);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n }\n #af-pricing .check svg { width: 10px; height: 10px; }\n #af-pricing .plan-card.featured .check {\n background: rgba(233,30,140,0.25);\n border-color: rgba(233,30,140,0.5);\n }\n #af-pricing .plan-btn {\n display: block;\n width: 100%;\n padding: 14px;\n border-radius: 14px;\n font-size: 15px;\n font-weight: 900;\n text-align: center;\n text-decoration: none;\n cursor: pointer;\n border: none;\n background: rgba(255,255,255,0.06);\n border: 1px solid rgba(255,255,255,0.1);\n color: #fff;\n backdrop-filter: blur(20px);\n -webkit-backdrop-filter: blur(20px);\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);\n transition: background 0.2s ease, transform 0.15s ease;\n letter-spacing: 0.03em;\n }\n #af-pricing .plan-btn:hover { background: rgba(255,255,255,0.1); transform: scale(1.02); }\n #af-pricing .plan-btn.pink {\n background: linear-gradient(135deg, #e91e8c, #c2185b);\n border: none;\n box-shadow: 0 4px 20px rgba(233,30,140,0.4), inset 0 1px 0 rgba(255,255,255,0.2);\n }\n #af-pricing .plan-btn.pink:hover { background: linear-gradient(135deg, #ff2d9b, #e91e8c); box-shadow: 0 6px 28px rgba(233,30,140,0.5); }\n\n @media (max-width: 860px) {\n #af-pricing .plans-grid { flex-direction: column; align-items: center; }\n #af-pricing .plan-card { max-width: 480px; width: 100%; }\n #af-pricing .af-heading { font-size: 32px; }\n }\n @media (max-width: 480px) {\n #af-pricing { padding: 50px 16px; }\n #af-pricing .af-heading { font-size: 26px; }\n #af-pricing .price-amount { font-size: 42px; }\n }\n<\/style>\n\n<section id=\"af-pricing\">\n\n <div class=\"af-title\">Simple Pricing<\/div>\n <h2 class=\"af-heading\">Pick Your Plan<\/h2>\n <p class=\"af-subheading\">No hidden fees. Cancel anytime.<\/p>\n\n <div class=\"plans-grid\">\n\n \n <div class=\"plan-card\">\n <div class=\"plan-name\">Starter<\/div>\n <div class=\"plan-desc\">Perfect for creators just getting started with short-form content.<\/div>\n <div class=\"plan-price\">\n <span class=\"price-currency\">$<\/span>\n <span class=\"price-amount\">297<\/span>\n <span class=\"price-period\">\/mo<\/span>\n <\/div>\n <div class=\"divider\"><\/div>\n <ul class=\"features-list\">\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 4 Short-Form Videos \/ Month<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Captions & Subtitles<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Music & Sound Design<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 2 Revision Rounds<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 5-Day Delivery<\/li>\n <\/ul>\n <a href=\"#contact\" class=\"plan-btn\">Get Started<\/a>\n <\/div>\n\n \n <div class=\"plan-card featured\">\n <div class=\"popular-badge\">Most Popular<\/div>\n <div class=\"plan-name\">Pro<\/div>\n <div class=\"plan-desc\">For brands & creators who want consistent, high-quality content.<\/div>\n <div class=\"plan-price\">\n <span class=\"price-currency\">$<\/span>\n <span class=\"price-amount\">597<\/span>\n <span class=\"price-period\">\/mo<\/span>\n <\/div>\n <div class=\"divider\"><\/div>\n <ul class=\"features-list\">\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 10 Short-Form Videos \/ Month<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Captions, Subtitles & B-Roll<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Custom Motion Graphics<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Unlimited Revisions<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 3-Day Delivery<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Dedicated Project Manager<\/li>\n <\/ul>\n <a href=\"#contact\" class=\"plan-btn pink\">Get Started<\/a>\n <\/div>\n\n \n <div class=\"plan-card\">\n <div class=\"plan-name\">Elite<\/div>\n <div class=\"plan-desc\">Full-scale content production for agencies and top-tier creators.<\/div>\n <div class=\"plan-price\">\n <span class=\"price-currency\">$<\/span>\n <span class=\"price-amount\">997<\/span>\n <span class=\"price-period\">\/mo<\/span>\n <\/div>\n <div class=\"divider\"><\/div>\n <ul class=\"features-list\">\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> 20 Short-Form Videos \/ Month<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Full Post-Production Suite<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Custom Branding & Intros<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Unlimited Revisions<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Priority 48h Delivery<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Strategy & Content Planning<\/li>\n <li><span class=\"check\"><svg viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 6l3 3 5-5\" stroke=\"#e91e8c\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span> Direct WhatsApp Access<\/li>\n <\/ul>\n <a href=\"#contact\" class=\"plan-btn\">Get Started<\/a>\n <\/div>\n\n <\/div>\n<\/section>\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-a6b3e1b e-flex e-con-boxed e-con e-parent\" data-id=\"a6b3e1b\" data-element_type=\"container\" data-e-type=\"container\" id=\"contact1\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d7c29c8 elementor-widget elementor-widget-html\" data-id=\"d7c29c8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"cta-glass-section\">\n\n <div class=\"cgs-box\">\n\n <div class=\"cgs-avail\">\n <div class=\"cgs-avail__left\">\n <span class=\"cgs-avail__label\">My schedule \u2014 April 2026<\/span>\n <span class=\"cgs-avail__status\">\n <span class=\"cgs-dot--live\"><\/span>\n Only 2 spots left this month\n <\/span>\n <\/div>\n <div class=\"cgs-avail__slots\">\n <div class=\"cgs-slot-row\">\n <div class=\"cgs-bars\">\n <div class=\"cgs-bar cgs-bar--taken\"><\/div>\n <div class=\"cgs-bar cgs-bar--taken\"><\/div>\n <div class=\"cgs-bar cgs-bar--taken\"><\/div>\n <div class=\"cgs-bar cgs-bar--open\"><\/div>\n <div class=\"cgs-bar cgs-bar--open\"><\/div>\n <\/div>\n <span class=\"cgs-slot-text cgs-slot-text--hot\">Filling fast \u2014 grab yours now<\/span>\n <\/div>\n <div class=\"cgs-slot-row\">\n <span class=\"cgs-slot-text\">Miss this → wait until <strong class=\"cgs-strong\">May 2026<\/strong><\/span>\n <\/div>\n <\/div>\n <\/div>\n\n <p class=\"cgs-eyebrow\">Limited spots available<\/p>\n <h2 class=\"cgs-headline\">Your footage.<br><span class=\"cgs-headline__accent\">Our obsession.<\/span><\/h2>\n <p class=\"cgs-sub\">Most editors deliver cuts. We deliver stories that make viewers stop scrolling, stay watching, and come back for more. Let's talk about what we can do for you.<\/p>\n\n <div class=\"cgs-buttons\">\n <a href=\"https:\/\/calendly.com\/aymanframes\/30min\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"cgs-btn-primary\">Book a Free Call →<\/a>\n <a href=\"https:\/\/wa.me\/212625182594\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"cgs-btn-ghost\">Contact<\/a>\n <\/div>\n\n <div class=\"cgs-trust\">\n <div class=\"cgs-trust__item\"><div class=\"cgs-trust__dot\"><\/div>Contract available \u2014 your call, your comfort.<\/div>\n <div class=\"cgs-trust__item\"><div class=\"cgs-trust__dot\"><\/div>First edit delivered in 48h.<\/div>\n <div class=\"cgs-trust__item\"><div class=\"cgs-trust__dot\"><\/div>Unlimited revisions.<\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n<style>\n.cta-glass-section {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 60px 24px;\n font-family: sans-serif;\n}\n\n.cta-glass-section .cgs-box {\n position: relative;\n z-index: 1;\n width: 100%;\n max-width: 780px;\n background: rgba(255,255,255,0.04);\n border: 1px solid rgba(255,255,255,0.10);\n border-radius: 28px;\n backdrop-filter: blur(24px) saturate(140%);\n -webkit-backdrop-filter: blur(24px) saturate(140%);\n box-shadow:\n inset 0 0 0 1px rgba(255,45,120,0.08),\n 0 32px 64px rgba(0,0,0,0.6),\n 0 0 80px rgba(255,45,120,0.07);\n padding: 64px 56px;\n text-align: center;\n}\n\n.cta-glass-section .cgs-avail {\n display: inline-flex;\n align-items: center;\n gap: 16px;\n background: rgba(255,255,255,0.05);\n border: 1px solid rgba(255,45,120,0.25);\n border-radius: 14px;\n padding: 14px 24px;\n margin-bottom: 40px;\n text-align: left;\n}\n\n.cta-glass-section .cgs-avail__left {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.cta-glass-section .cgs-avail__label {\n font-size: 11px;\n font-weight: 700;\n letter-spacing: 0.14em;\n text-transform: uppercase;\n color: rgba(255,255,255,0.35);\n}\n\n.cta-glass-section .cgs-avail__status {\n font-size: 13px;\n font-weight: 600;\n color: #ffffff;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.cta-glass-section .cgs-dot--live {\n display: inline-block;\n width: 7px;\n height: 7px;\n border-radius: 50%;\n background: #ff2d78;\n flex-shrink: 0;\n animation: cgs-pulse 1.6s ease-in-out infinite;\n}\n\n@keyframes cgs-pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.3; transform: scale(0.65); }\n}\n\n.cta-glass-section .cgs-avail__slots {\n display: flex;\n flex-direction: column;\n gap: 5px;\n border-left: 1px solid rgba(255,255,255,0.08);\n padding-left: 16px;\n}\n\n.cta-glass-section .cgs-slot-row {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.cta-glass-section .cgs-bars {\n display: flex;\n gap: 3px;\n}\n\n.cta-glass-section .cgs-bar {\n width: 18px;\n height: 6px;\n border-radius: 2px;\n background: rgba(255,255,255,0.08);\n}\n\n.cta-glass-section .cgs-bar--taken {\n background: #ff2d78;\n}\n\n.cta-glass-section .cgs-bar--open {\n background: rgba(255,255,255,0.08);\n border: 1px solid rgba(255,45,120,0.4);\n}\n\n.cta-glass-section .cgs-slot-text {\n font-size: 11px;\n color: rgba(255,255,255,0.4);\n white-space: nowrap;\n}\n\n.cta-glass-section .cgs-slot-text--hot {\n color: #ff2d78;\n font-weight: 700;\n font-size: 12px;\n}\n\n.cta-glass-section .cgs-strong {\n color: rgba(255,255,255,0.55);\n}\n\n.cta-glass-section .cgs-eyebrow {\n font-size: 12px;\n font-weight: 700;\n letter-spacing: 0.18em;\n text-transform: uppercase;\n color: #ff2d78;\n margin: 0 0 18px;\n padding: 0;\n}\n\n.cta-glass-section .cgs-headline {\n font-size: clamp(36px, 6vw, 72px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.02em;\n line-height: 1;\n color: #ffffff;\n margin: 0 0 20px;\n padding: 0;\n}\n\n.cta-glass-section .cgs-headline__accent {\n color: #ff2d78;\n}\n\n.cta-glass-section .cgs-sub {\n font-size: clamp(14px, 1.5vw, 17px);\n color: rgba(255,255,255,0.45);\n max-width: 500px;\n margin: 0 auto 44px;\n padding: 0;\n line-height: 1.65;\n font-weight: 400;\n}\n\n.cta-glass-section .cgs-buttons {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n}\n\n.cta-glass-section .cgs-btn-primary {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 17px 38px;\n background: #ff2d78;\n color: #ffffff !important;\n font-size: 15px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.07em;\n border: none;\n border-radius: 50px;\n cursor: pointer;\n text-decoration: none !important;\n transition: background 0.2s ease, transform 0.15s ease;\n line-height: 1;\n}\n\n.cta-glass-section .cgs-btn-primary:hover {\n background: #e0005f;\n transform: scale(1.03);\n color: #ffffff !important;\n}\n\n.cta-glass-section .cgs-btn-primary:active {\n transform: scale(0.97);\n}\n\n.cta-glass-section .cgs-btn-ghost {\n display: inline-flex;\n align-items: center;\n padding: 11px 24px;\n background: transparent;\n color: rgba(255,255,255,0.5) !important;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n border: 1px solid rgba(182,170,174,0.25);\n border-radius: 50px;\n cursor: pointer;\n text-decoration: none !important;\n transition: border-color 0.2s, color 0.2s;\n line-height: 1;\n}\n\n.cta-glass-section .cgs-btn-ghost:hover {\n border-color: #ff2d78;\n color: #ff2d78 !important;\n}\n\n.cta-glass-section .cgs-trust {\n margin-top: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 24px;\n flex-wrap: wrap;\n}\n\n.cta-glass-section .cgs-trust__item {\n display: flex;\n align-items: center;\n gap: 7px;\n font-size: 12px;\n color: rgba(255,255,255,0.3);\n}\n\n.cta-glass-section .cgs-trust__dot {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background: #ff2d78;\n flex-shrink: 0;\n}\n\n@media (max-width: 767px) {\n .cta-glass-section .cgs-box { padding: 40px 24px; }\n .cta-glass-section .cgs-avail { flex-direction: column; align-items: flex-start; gap: 12px; width: 100%; }\n .cta-glass-section .cgs-avail__slots { border-left: none; border-top: 1px solid rgba(255,255,255,0.08); padding-left: 0; padding-top: 12px; width: 100%; }\n .cta-glass-section .cgs-trust { gap: 12px; }\n}\n\n@media (max-width: 479px) {\n .cta-glass-section .cgs-box { padding: 32px 16px; }\n .cta-glass-section .cgs-btn-primary,\n .cta-glass-section .cgs-btn-ghost { width: 100%; justify-content: center; }\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-3fbb56b e-con-full e-flex e-con e-parent\" data-id=\"3fbb56b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-055e9db elementor-widget elementor-widget-html\" data-id=\"055e9db\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"abm-section\">\n <div class=\"abm-wrap\">\n\n <div class=\"abm-right\">\n <p class=\"abm-eyebrow\">About me<\/p>\n <h2 class=\"abm-headline\">Crafting stories.<br><span class=\"abm-headline__accent\">Frame by frame.<\/span><\/h2>\n\n <p class=\"abm-body\">\n At 26, I've built <strong class=\"abm-strong\">AymanFrames<\/strong> from Morocco into a professional studio where cinematic excellence isn't the goal \u2014 it's the baseline. Every project I take on carries the weight of over 500 completed works and a relentless obsession with quality.\n <\/p>\n <p class=\"abm-body\">\n I don't just edit footage. I take full ownership of the technical journey \u2014 from precision color grading and expert sound design to the final frame \u2014 so you never have to think about it. The process is effortless on your end because I handle everything with an elite level of care.\n <\/p>\n <p class=\"abm-body\">\n My goal is simple: a seamless creative partnership where your story is told with world-class quality, zero stress, and results you'll be proud to share.\n <\/p>\n\n <div class=\"abm-pills\">\n <span class=\"abm-pill\">Color Grading<\/span>\n <span class=\"abm-pill\">Sound Design<\/span>\n <span class=\"abm-pill\">Cinematic Editing<\/span>\n <span class=\"abm-pill\">Motion Graphics<\/span>\n <span class=\"abm-pill\">Short-Form Content<\/span>\n <\/div>\n\n <div class=\"abm-stats\">\n <div class=\"abm-stat\">\n <span class=\"abm-stat__num\">500<span class=\"abm-stat__plus\">+<\/span><\/span>\n <span class=\"abm-stat__label\">Projects completed<\/span>\n <\/div>\n <div class=\"abm-stat-divider\"><\/div>\n <div class=\"abm-stat\">\n <span class=\"abm-stat__num\">8<span class=\"abm-stat__plus\">+<\/span><\/span>\n <span class=\"abm-stat__label\">Years experience<\/span>\n <\/div>\n <div class=\"abm-stat-divider\"><\/div>\n <div class=\"abm-stat\">\n <span class=\"abm-stat__num\">100<span class=\"abm-stat__plus\">%<\/span><\/span>\n <span class=\"abm-stat__label\">Satisfaction<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"abm-left\">\n <div class=\"abm-img-wrap\">\n <img decoding=\"async\" src=\"https:\/\/aymanframes.com\/wp-content\/uploads\/2026\/04\/PROFILE-PICTURE-scaled.png\" class=\"abm-photo\" alt=\"Ayman\">\n <div class=\"abm-img-badge\">\n <span class=\"abm-badge-dot\"><\/span>\n Available for projects\n <\/div>\n <\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n<style>\n.abm-section {\n font-family: sans-serif;\n padding: 60px 24px;\n display: flex;\n justify-content: center;\n}\n\n.abm-wrap {\n display: grid;\n grid-template-columns: 1fr 340px;\n gap: 64px;\n max-width: 1040px;\n width: 100%;\n align-items: center;\n}\n\n.abm-right {\n display: flex;\n flex-direction: column;\n}\n\n.abm-eyebrow {\n font-size: 12px;\n font-weight: 700;\n letter-spacing: 0.18em;\n text-transform: uppercase;\n color: #ff2d78;\n margin: 0 0 16px;\n padding: 0;\n}\n\n.abm-headline {\n font-size: clamp(30px, 3.5vw, 50px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.02em;\n line-height: 1.05;\n color: #ffffff;\n margin: 0 0 28px;\n padding: 0;\n}\n\n.abm-headline__accent { color: #ff2d78; }\n\n.abm-body {\n font-size: 15px;\n line-height: 1.75;\n color: rgba(255,255,255,0.5);\n margin: 0 0 14px;\n padding: 0;\n}\n\n.abm-strong {\n color: rgba(255,255,255,0.85);\n font-weight: 700;\n}\n\n.abm-pills {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n margin: 20px 0 32px;\n}\n\n.abm-pill {\n display: inline-block;\n padding: 7px 14px;\n border: 1px solid rgba(255,45,120,0.25);\n border-radius: 50px;\n font-size: 12px;\n font-weight: 600;\n color: rgba(255,255,255,0.45);\n letter-spacing: 0.04em;\n transition: border-color 0.2s, color 0.2s;\n cursor: default;\n}\n\n.abm-pill:hover { border-color: #ff2d78; color: #ff2d78; }\n\n.abm-stats {\n display: flex;\n align-items: center;\n background: rgba(255,255,255,0.04);\n border: 1px solid rgba(255,255,255,0.08);\n border-radius: 16px;\n padding: 20px 24px;\n gap: 0;\n}\n\n.abm-stat {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 5px;\n flex: 1;\n}\n\n.abm-stat__num {\n font-size: 26px;\n font-weight: 800;\n color: #ffffff;\n line-height: 1;\n}\n\n.abm-stat__plus { font-size: 18px; color: #ff2d78; }\n\n.abm-stat__label {\n font-size: 10px;\n color: rgba(255,255,255,0.35);\n text-align: center;\n text-transform: uppercase;\n letter-spacing: 0.08em;\n font-weight: 600;\n}\n\n.abm-stat-divider {\n width: 1px;\n height: 36px;\n background: rgba(255,255,255,0.08);\n flex-shrink: 0;\n}\n\n.abm-left { display: flex; flex-direction: column; }\n\n.abm-img-wrap { position: relative; }\n\n.abm-img-placeholder {\n width: 100%;\n aspect-ratio: 3\/4;\n border-radius: 24px;\n border: 2px dashed rgba(255,45,120,0.3);\n background: rgba(255,255,255,0.03);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 12px;\n}\n\n.abm-photo {\n width: 100%;\n aspect-ratio: 3\/4;\n border-radius: 24px;\n object-fit: cover;\n display: block;\n}\n\n.abm-img-hint {\n font-size: 12px;\n color: rgba(255,255,255,0.2);\n letter-spacing: 0.05em;\n}\n\n.abm-img-badge {\n position: absolute;\n bottom: 20px;\n left: 50%;\n transform: translateX(-50%);\n white-space: nowrap;\n display: inline-flex;\n align-items: center;\n gap: 7px;\n background: rgba(17,16,16,0.88);\n border: 1px solid rgba(255,45,120,0.3);\n border-radius: 50px;\n padding: 9px 18px;\n font-size: 12px;\n font-weight: 600;\n color: rgba(255,255,255,0.7);\n backdrop-filter: blur(12px);\n -webkit-backdrop-filter: blur(12px);\n}\n\n.abm-badge-dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: #ff2d78;\n flex-shrink: 0;\n animation: abm-pulse 1.6s ease-in-out infinite;\n}\n\n@keyframes abm-pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.3; transform: scale(0.6); }\n}\n\n@media (max-width: 860px) {\n .abm-wrap {\n grid-template-columns: 1fr;\n gap: 40px;\n }\n .abm-left { order: -1; max-width: 320px; margin: 0 auto; width: 100%; }\n .abm-img-placeholder { aspect-ratio: 1\/1; }\n .abm-photo { aspect-ratio: 1\/1; }\n}\n\n@media (max-width: 479px) {\n .abm-section { padding: 40px 16px; }\n .abm-stat__num { font-size: 20px; }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ca46f31 e-con-full e-flex e-con e-parent\" data-id=\"ca46f31\" data-element_type=\"container\" data-e-type=\"container\" id=\"faq\" faq=\"\">\n\t\t\t\t<div class=\"elementor-element elementor-element-551ad60 elementor-widget elementor-widget-html\" data-id=\"551ad60\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\" \/>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <title>FAQ<\/title>\n <style>\n *, *::before, *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n body {\n background: transparent;\n font-family: sans-serif;\n color: #fff;\n }\n\n .faq-section {\n max-width: 1200px;\n margin: 0 auto;\n padding: 80px 48px;\n display: grid;\n grid-template-columns: 220px 1fr;\n gap: 80px;\n align-items: start;\n }\n\n .faq-title {\n font-size: clamp(40px, 5vw, 72px);\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: -0.02em;\n line-height: 1;\n color: #ffffff;\n position: sticky;\n top: 40px;\n padding-top: 60px;\n }\n\n .faq-list {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n\n \/* \u2500\u2500 Each item \u2500\u2500 *\/\n .faq-item {\n border-radius: 0px;\n padding: 0;\n background: rgba(255,255,255,0);\n transition:\n background 0.45s ease,\n border-radius 0.45s ease,\n padding 0.45s ease,\n margin-bottom 0.45s ease;\n will-change: background, padding;\n }\n\n .faq-item.open {\n background: rgba(255,255,255,0.08);\n border-radius: 16px;\n padding: 0 24px;\n margin-bottom: 4px;\n }\n\n \/* \u2500\u2500 Question row \u2500\u2500 *\/\n .faq-question {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 24px;\n padding: 22px 0;\n cursor: pointer;\n user-select: none;\n -webkit-tap-highlight-color: transparent;\n }\n\n .faq-question span {\n font-size: clamp(15px, 1.5vw, 19px);\n font-weight: 500;\n color: #ffffff;\n line-height: 1.4;\n transition: color 0.25s ease;\n }\n\n .faq-question:hover span {\n color: rgba(255,255,255,0.65);\n }\n\n \/* \u2500\u2500 Icon \u2500\u2500 *\/\n .faq-icon {\n width: 34px;\n height: 34px;\n border-radius: 50%;\n background: rgba(255,255,255,0.15);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n position: relative;\n font-size: 22px;\n font-weight: 300;\n color: #fff;\n }\n\n .faq-icon .i-plus,\n .faq-icon .i-minus {\n position: absolute;\n transition: opacity 0.35s ease, transform 0.35s ease;\n line-height: 1;\n }\n\n .faq-icon .i-plus { opacity: 1; transform: rotate(0deg); }\n .faq-icon .i-minus { opacity: 0; transform: rotate(-45deg); }\n\n .faq-item.open .faq-icon .i-plus { opacity: 0; transform: rotate(45deg); }\n .faq-item.open .faq-icon .i-minus { opacity: 1; transform: rotate(0deg); }\n\n \/* \u2500\u2500 Answer \u2500\u2500 *\/\n .faq-answer {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows 0.45s ease;\n }\n\n .faq-item.open .faq-answer {\n grid-template-rows: 1fr;\n }\n\n .faq-answer-overflow {\n overflow: hidden;\n }\n\n .faq-answer-inner {\n padding: 0 0 22px 0;\n font-size: clamp(13px, 1.2vw, 15px);\n font-weight: 500;\n color: rgba(255,255,255,0.75);\n line-height: 1.75;\n opacity: 0;\n transform: translateY(-6px);\n transition:\n opacity 0.35s ease 0.08s,\n transform 0.35s ease 0.08s;\n }\n\n .faq-item.open .faq-answer-inner {\n opacity: 1;\n transform: translateY(0);\n }\n\n \/* \u2500\u2500 Responsive \u2500\u2500 *\/\n @media (max-width: 900px) {\n .faq-section {\n grid-template-columns: 1fr;\n gap: 40px;\n padding: 64px 32px;\n }\n .faq-title { position: static; }\n }\n\n @media (max-width: 480px) {\n .faq-section { padding: 48px 16px; }\n .faq-question { padding: 18px 0; }\n .faq-item.open { padding: 0 16px; }\n }\n <\/style>\n<\/head>\n<body>\n\n<section class=\"faq-section\">\n\n <h2 class=\"faq-title\">FAQ<\/h2>\n\n <div class=\"faq-list\">\n\n <div class=\"faq-item open\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What type of videos do you edit?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">I specialize in cinematic long-form videos, YouTube content, events, and high-quality branded edits.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How do I start a project with you?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">You send your footage and brief \u2192 I review \u2192 you receive a custom quote \u2192 we start after confirmation.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How long does delivery take?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Depending on the project, delivery ranges from 2 to 5 days on average.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Do you offer revisions?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Yes, I offer unlimited revisions within the original scope to ensure you're fully satisfied.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What if I want major changes?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Big changes like a new style or structure may require an additional fee or a new project.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What do I need to provide?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Raw footage, clear instructions, and any references or examples you like.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How can I send my footage?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">You can upload your files using any platform such as Google Drive, Dropbox, iCloud, OneDrive, or similar services.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Can you choose music for my video?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Yes, I can select music that fits your video, or you can provide your own.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>What quality will my video be delivered in?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Up to 4K, depending on your original footage quality.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>How do payments work?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">For new clients, 50% upfront and 50% after final delivery.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Do you offer monthly packages?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Yes, I offer custom monthly plans for clients who need consistent content.<\/p>\n <\/div><\/div>\n <\/div>\n\n <div class=\"faq-item\">\n <div class=\"faq-question\" onclick=\"toggle(this)\">\n <span>Do you offer refunds?<\/span>\n <div class=\"faq-icon\"><span class=\"i-plus\">+<\/span><span class=\"i-minus\">\u2212<\/span><\/div>\n <\/div>\n <div class=\"faq-answer\"><div class=\"faq-answer-overflow\">\n <p class=\"faq-answer-inner\">Refunds are only available if the project is not delivered or if there is a significant delay from my side. Once work has been delivered as agreed, refunds are not provided. I always work closely with you through revisions to make sure you're fully satisfied with the final result.<\/p>\n <\/div><\/div>\n <\/div>\n\n <\/div>\n<\/section>\n\n<script>\n function toggle(btn) {\n const item = btn.closest('.faq-item');\n const isOpen = item.classList.contains('open');\n\n document.querySelectorAll('.faq-item.open').forEach(el => {\n el.classList.remove('open');\n });\n\n if (!isOpen) {\n item.classList.add('open');\n }\n }\n<\/script>\n\n<\/body>\n<\/html>\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>Ripple Grid Professional Video Editing Services For Creators, Brands, and Businesses Contact https:\/\/www.youtube.com\/watch?v=XHOmBV4js_Ehttps:\/\/www.youtube.com\/watch?v=XHOmBV4js_Ehttps:\/\/www.youtube.com\/watch?v=XHOmBV4js_E VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + VIDEO MAGIC + Step 1: Comms + Submission WhatsApp You We Need AnAwesome Video! AF Aymanframes On It! Step 2: Project […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-17","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages\/17","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aymanframes.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=17"}],"version-history":[{"count":638,"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages\/17\/revisions"}],"predecessor-version":[{"id":768,"href":"https:\/\/aymanframes.com\/index.php?rest_route=\/wp\/v2\/pages\/17\/revisions\/768"}],"wp:attachment":[{"href":"https:\/\/aymanframes.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=17"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}