{"id":1270,"date":"2026-02-20T19:44:28","date_gmt":"2026-02-20T19:44:28","guid":{"rendered":"https:\/\/alternaagency.com\/?page_id=1270"},"modified":"2026-02-23T20:44:43","modified_gmt":"2026-02-23T20:44:43","slug":"a-i-portfolio","status":"publish","type":"page","link":"https:\/\/alternaagency.com\/es\/a-i-portfolio\/","title":{"rendered":"A.I. Portfolio"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1270\" class=\"elementor elementor-1270\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-67b485a e-flex e-con-boxed e-con e-parent\" data-id=\"67b485a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-8f7a14b e-con-full e-flex e-con e-child\" data-id=\"8f7a14b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-51f9b38 elementor-widget elementor-widget-html\" data-id=\"51f9b38\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n@import url('https:\/\/api.fontshare.com\/v2\/css?f[]=general-sans@600,700&display=swap');\n\n.av-title-wrap {\n    text-align: center;\n    padding: 0;\n    perspective: 600px;\n}\n\n.av-title-static {\n    font-family: 'General Sans', -apple-system, sans-serif;\n    font-weight: 700;\n    font-size: clamp(2.2rem, 5.5vw, 5rem);\n    color: #fff;\n    letter-spacing: -0.03em;\n    line-height: 1.15;\n    margin: 0;\n}\n\n.av-title-rotator {\n    display: block;\n    position: relative;\n    height: 1.2em;\n    overflow: hidden;\n    width: 100%;\n}\n\n.av-word {\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    opacity: 0;\n    color: #FCC917;\n    font-family: 'General Sans', -apple-system, sans-serif;\n    font-weight: 700;\n    font-size: inherit;\n    letter-spacing: inherit;\n    text-align: center;\n    white-space: nowrap;\n}\n\n.av-letter {\n    display: inline-block;\n    position: relative;\n    transform: rotateX(-90deg);\n    transform-origin: 50% 50% 25px;\n}\n\n.av-letter.space {\n    width: 0.3em;\n}\n\n.av-letter.out {\n    transform: rotateX(90deg);\n    transition: transform 0.32s cubic-bezier(0.55, 0.055, 0.675, 0.19);\n}\n\n.av-letter.behind {\n    transform: rotateX(-90deg);\n}\n\n.av-letter.in {\n    transform: rotateX(0deg);\n    transition: transform 0.38s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n}\n<\/style>\n\n<div class=\"av-title-wrap\">\n    <div class=\"av-title-static\">\n        The New Standard of\n        <span class=\"av-title-rotator\" id=\"avRotator\">\n            <span class=\"av-word\">Creativity<\/span>\n            <span class=\"av-word\">Intelligence<\/span>\n            <span class=\"av-word\">Innovation<\/span>\n            <span class=\"av-word\">Strategy<\/span>\n            <span class=\"av-word\">Vision<\/span>\n        <\/span>\n    <\/div>\n<\/div>\n\n<script>\n(function() {\n    var rotator = document.getElementById('avRotator');\n    var words = rotator.querySelectorAll('.av-word');\n    var wordArray = [];\n    var currentWord = 0;\n    var animating = false;\n\n    \/\/ Split each word into letter spans\n    words.forEach(function(word) {\n        var content = word.textContent;\n        word.innerHTML = '';\n        var letters = [];\n        for (var i = 0; i < content.length; i++) {\n            var span = document.createElement('span');\n            if (content.charAt(i) === ' ') {\n                span.className = 'av-letter space';\n                span.innerHTML = '\\u00A0';\n            } else {\n                span.className = 'av-letter';\n                span.textContent = content.charAt(i);\n            }\n            word.appendChild(span);\n            letters.push(span);\n        }\n        wordArray.push(letters);\n    });\n\n    \/\/ Show first word immediately\n    words[0].style.opacity = '1';\n    wordArray[0].forEach(function(l) { l.className = l.classList.contains('space') ? 'av-letter space in' : 'av-letter in'; });\n\n    function changeWord() {\n        if (animating) return;\n        animating = true;\n\n        var cw = wordArray[currentWord];\n        var cwEl = words[currentWord];\n        var nextIndex = (currentWord + 1) % words.length;\n        var nw = wordArray[nextIndex];\n        var nwEl = words[nextIndex];\n        var maxLen = Math.max(cw.length, nw.length);\n\n        \/\/ Animate current word OUT\n        cw.forEach(function(letter, i) {\n            setTimeout(function() {\n                letter.className = letter.classList.contains('space') ? 'av-letter space out' : 'av-letter out';\n            }, i * 50);\n        });\n\n        \/\/ After out animation, hide old word and show new\n        var outDone = cw.length * 50 + 350;\n\n        setTimeout(function() {\n            cwEl.style.opacity = '0';\n            nwEl.style.opacity = '1';\n\n            \/\/ Set all new letters to behind\n            nw.forEach(function(letter) {\n                letter.className = letter.classList.contains('space') ? 'av-letter space behind' : 'av-letter behind';\n            });\n\n            \/\/ Animate new word IN\n            nw.forEach(function(letter, i) {\n                setTimeout(function() {\n                    letter.className = letter.classList.contains('space') ? 'av-letter space in' : 'av-letter in';\n                }, i * 50);\n            });\n\n            \/\/ Done animating\n            setTimeout(function() {\n                animating = false;\n            }, nw.length * 50 + 400);\n\n        }, outDone);\n\n        currentWord = nextIndex;\n    }\n\n    setInterval(changeWord, 3500);\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5e99bc1 elementor-widget elementor-widget-heading\" data-id=\"5e99bc1\" 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\">Elevating the digital landscape through AI-powered craft and data-driven storytelling.<\/h2>\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b5e4b13 e-con-full e-flex e-con e-child\" data-id=\"b5e4b13\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1928400 elementor-widget elementor-widget-text-editor\" data-id=\"1928400\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p><strong>True innovation<\/strong> happens at the intersection of intuition and algorithm. Our AI Portfolio represents the peak of Alterna\u2019s co-exclusive works: a collection of high-impact videos, bespoke digital art, and intelligent data structures designed for the elite tier of the global market.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bb5eff1 e-con-full cwp-curved-slider e-flex e-con e-child\" data-id=\"bb5eff1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-be45545 elementor-widget elementor-widget-html\" data-id=\"be45545\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n[class^='cwp-curved-slider'],\n[class*=' cwp-curved-slider'] {\n    height: var(--min-height, 100vh);\n    \/* Pull the slider UP to eliminate the gap below the subtitle *\/\n    margin-top: -180px;\n    position: relative;\n    z-index: 1;\n}\n[class^='cwp-curved-slider'] canvas,\n[class*=' cwp-curved-slider'] canvas {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n\/* Hide the video elements used as texture sources *\/\n.cwp-video-sources {\n    display: none !important;\n}\n<\/style>\n<div class=\"cwp-video-sources\">\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Abuela-Cocina-15ssmp4.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Serenedge.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Abuela-Novela-15ss.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Anuncio-Entrevista-15ss.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-VIDEO-Youtube-University-.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Video-1-Es-mi-tiempo.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Video-2-Voy-por-mas.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Everyones-Pole-The-Movie-AlternaTV-1080p-h264.mp4\" muted loop playsinline autoplay crossorigin=\"anonymous\"><\/video>\n<\/div>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/0.160.0\/three.min.js\"><\/script>\n<script>\nif (!MDWNonce111Video) {\n    var MDWNonce111Video = true;\n    var selector = \"[class^='cwp-curved-slider'], [class*=' cwp-curved-slider']\",\n        scene = [],\n        renderer = [],\n        options = [],\n        time = [],\n        camera = [],\n        slideAmount = [],\n        currentContainerHeight = [],\n        previousContainerHeight = [],\n        planes = [],\n        videoTextures = [];\n    addEventListener('DOMContentLoaded', function () {\n        function getWidth(gap) {\n            return 1 + gap \/ 100;\n        }\n        function getPlaneWidth(el, camera) {\n            var vFov = (camera.fov * Math.PI) \/ 180,\n                height = 2 * Math.tan(vFov \/ 2) * camera.position.z,\n                aspect = el.clientWidth \/ el.clientHeight,\n                width = height * aspect;\n            return el.clientWidth \/ width;\n        }\n        function init(e = 'none') {\n            Array.from(document.querySelectorAll(selector)).forEach(function (el, index) {\n                if (e == 'none') {\n                    currentContainerHeight[index] = previousContainerHeight[index] = el.clientHeight;\n                } else {\n                    currentContainerHeight[index] = el.clientHeight;\n                    if (mobileHeightChage && currentContainerHeight[index] == previousContainerHeight[index])\n                        return;\n                }\n                previousContainerHeight[index] = currentContainerHeight[index];\n                var className = el.getAttribute('class'),\n                    classNameIndex = className.indexOf('cwp-curved-slider'),\n                    shortClass = className.substring(classNameIndex, className.indexOf(' ', classNameIndex) === -1 ? className.length : className.indexOf(' ', classNameIndex)),\n                    values = shortClass.split('-');\n                options[index] = {\n                    speed: 30,\n                    gap: 10,\n                    curve: 12,\n                    direction: -1,\n                };\n                values.forEach(function (value, i) {\n                    if (value == 'speed' && values[i + 1] && !isNaN(values[i + 1])) {\n                        options[index].speed = values[i + 1];\n                    }\n                    if (value == 'gap' && values[i + 1] && !isNaN(values[i + 1])) {\n                        options[index].gap = values[i + 1];\n                    }\n                    if (value == 'curve' && values[i + 1] && !isNaN(values[i + 1])) {\n                        options[index].curve = values[i + 1];\n                    }\n                    if (value == 'reverse') {\n                        options[index].direction = 1;\n                    }\n                });\n\n                \/\/ Collect media sources: check for videos first, then fall back to gallery images\n                var mediaSources = [];\n                videoTextures[index] = [];\n                \n                \/\/ Check for video elements in .cwp-video-sources\n                var videoContainer = document.querySelector('.cwp-video-sources');\n                if (videoContainer) {\n                    Array.from(videoContainer.querySelectorAll('video')).forEach(function (vid) {\n                        mediaSources.push({ type: 'video', element: vid });\n                    });\n                }\n                \n                \/\/ Fall back to gallery images if no videos found\n                if (mediaSources.length === 0) {\n                    Array.from(\n                        el.querySelectorAll('.elementor-widget-image-gallery .gallery-item')\n                    ).forEach(function (imgEl) {\n                        mediaSources.push({ type: 'image', src: imgEl.querySelector('img').getAttribute('src') });\n                    });\n                }\n\n                var allMedia = [];\n                time[index] = 0;\n                slideAmount[index] = mediaSources.length;\n                \n                scene[index] = new THREE.Scene();\n                camera[index] = new THREE.PerspectiveCamera(\n                    75,\n                    el.clientWidth \/ el.clientHeight,\n                    0.1,\n                    20\n                );\n                camera[index].position.z = 2;\n                renderer[index] = new THREE.WebGLRenderer({ alpha: true, antialias: true });\n                renderer[index].setSize(el.clientWidth, el.clientHeight);\n                renderer[index].setPixelRatio(window.devicePixelRatio);\n                var previousCanvas = el.querySelector('canvas');\n                if (previousCanvas) {\n                    el.removeChild(previousCanvas);\n                }\n                el.appendChild(renderer[index].domElement);\n                var geometry = new THREE.PlaneGeometry(1, 1, 20, 20),\n                    planeSpace = getPlaneWidth(el, camera[index]) * getWidth(options[index].gap),\n                    totalMedia = Math.ceil(el.clientWidth \/ planeSpace) + 1 + mediaSources.length,\n                    initialOffset = Math.ceil(el.clientWidth \/ (2 * planeSpace) - 0.5);\n\n                \/\/ Duplicate media to fill the slider\n                allMedia = mediaSources.slice();\n                for (var i = slideAmount[index]; i < totalMedia; i++) {\n                    allMedia.push(mediaSources[i % slideAmount[index]]);\n                }\n\n                planes[index] = [];\n                allMedia.forEach(function (media, i) {\n                    var texture;\n                    if (media.type === 'video') {\n                        \/\/ Start video playback\n                        media.element.play().catch(function(){});\n                        texture = new THREE.VideoTexture(media.element);\n                        texture.minFilter = THREE.LinearFilter;\n                        texture.magFilter = THREE.LinearFilter;\n                        texture.format = THREE.RGBAFormat;\n                        videoTextures[index].push(texture);\n                        createPlane(index, geometry, texture, i, initialOffset);\n                    } else {\n                        var loader = new THREE.TextureLoader();\n                        loader.load(media.src, function (tex) {\n                            createPlane(index, geometry, tex, i, initialOffset);\n                        });\n                    }\n                });\n\n                function createPlane(idx, geo, tex, i, offset) {\n                    var material = new THREE.ShaderMaterial({\n                        uniforms: {\n                            tex: { value: tex },\n                            curve: { value: options[idx].curve },\n                        },\n                        vertexShader: `\n                            uniform float curve;\n                            varying vec2 vertexUV;\n                            void main(){\n                                vertexUV = uv;\n                                vec3 newPosition = position;\n                                float distanceFromCenter = abs(modelMatrix*vec4(position, 1.0)).x;\n                                newPosition.y *= 1.0 + (curve\/100.0)*pow(distanceFromCenter,2.0);\n                                gl_Position = projectionMatrix * modelViewMatrix * vec4(newPosition, 1.0);\n                            }\n                        `,\n                        fragmentShader: `\n                            uniform sampler2D tex;\n                            varying vec2 vertexUV;\n                            void main(){\n                                gl_FragColor = texture2D(tex, vertexUV);\n                            }\n                        `,\n                    });\n                    planes[idx][i] = new THREE.Mesh(geo, material);\n                    planes[idx][i].position.x =\n                        -1 * options[idx].direction * (i - offset) * getWidth(options[idx].gap);\n                    scene[idx].add(planes[idx][i]);\n                }\n            });\n        }\n        init();\n        var currentWidth,\n            previousWidth = window.innerWidth,\n            mobileHeightChage = false;\n        function onResize() {\n            currentWidth = window.innerWidth;\n            mobileHeightChage = currentWidth < 768 && currentWidth == previousWidth;\n            init('resize');\n            previousWidth = currentWidth;\n        }\n        window.addEventListener('resize', function () {\n            onResize();\n            setTimeout(onResize, 100);\n        });\n        var previousTime = 0;\n        function animate(currentTime) {\n            var timePassed = currentTime - previousTime;\n            Array.from(document.querySelectorAll(selector)).forEach(function (el, index) {\n                if (\n                    Math.abs(scene[index].position.x) >=\n                    getWidth(options[index].gap) * slideAmount[index]\n                ) {\n                    time[index] = 0;\n                }\n                time[index] += options[index].direction * timePassed * 0.00001;\n                scene[index].position.x = time[index] * options[index].speed;\n                \n                \/\/ Update video textures each frame\n                if (videoTextures[index]) {\n                    videoTextures[index].forEach(function(vt) {\n                        if (vt.source && vt.source.data && !vt.source.data.paused) {\n                            vt.needsUpdate = true;\n                        }\n                    });\n                }\n                \n                renderer[index].render(scene[index], camera[index]);\n            });\n            previousTime = currentTime;\n            requestAnimationFrame(animate);\n        }\n        requestAnimationFrame(animate);\n    });\n}\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dde288e e-flex e-con-boxed e-con e-parent\" data-id=\"dde288e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-1172730 e-con-full e-flex e-con e-child\" data-id=\"1172730\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-b558aeb e-con-full e-flex e-con e-child\" data-id=\"b558aeb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6be0713 elementor-widget elementor-widget-html\" data-id=\"6be0713\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.av-single {\n    position: relative;\n    width: 100%;\n    max-width: 800px;\n    margin: 0 auto;\n    overflow: hidden;\n    border-radius: 20px;\n    background: #000;\n    aspect-ratio: 16\/9;\n}\n\n.av-single video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n}\n\n.av-single .av-play {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 72px;\n    height: 72px;\n    background: rgba(139, 92, 246, 0.3);\n    backdrop-filter: blur(12px);\n    -webkit-backdrop-filter: blur(12px);\n    border: 2px solid rgba(139, 92, 246, 0.5);\n    border-radius: 50%;\n    cursor: pointer;\n    z-index: 5;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.3s ease;\n}\n\n.av-single .av-play:hover {\n    background: rgba(139, 92, 246, 0.5);\n    transform: translate(-50%, -50%) scale(1.08);\n    border-color: rgba(139, 92, 246, 0.8);\n}\n\n.av-single .av-play svg {\n    width: 24px;\n    height: 24px;\n    fill: #fff;\n    margin-left: 3px;\n}\n\n.av-single.is-playing .av-play {\n    opacity: 0;\n    pointer-events: none;\n}\n\n@media (max-width: 768px) {\n    .av-single { border-radius: 14px; }\n    .av-single .av-play { width: 60px; height: 60px; }\n    .av-single .av-play svg { width: 20px; height: 20px; }\n}\n<\/style>\n\n<div class=\"av-single\" id=\"avSingle\">\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Serenedge.mp4\" preload=\"metadata\" playsinline webkit-playsinline><\/video>\n    <div class=\"av-play\"><svg viewBox=\"0 0 24 24\"><polygon points=\"6,3 20,12 6,21\"><\/polygon><\/svg><\/div>\n<\/div>\n\n<script>\n(function() {\n    var wrap = document.getElementById('avSingle');\n    var video = wrap.querySelector('video');\n    var playBtn = wrap.querySelector('.av-play');\n\n    playBtn.addEventListener('click', function() {\n        video.setAttribute('controls', 'controls');\n        video.play();\n        wrap.classList.add('is-playing');\n    });\n\n    video.addEventListener('pause', function() {\n        if (video.ended || video.paused) wrap.classList.remove('is-playing');\n    });\n\n    video.addEventListener('ended', function() {\n        wrap.classList.remove('is-playing');\n        video.removeAttribute('controls');\n    });\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ce6e1aa e-flex e-con-boxed e-con e-parent\" data-id=\"ce6e1aa\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-19414d3 e-con-full e-flex e-con e-child\" data-id=\"19414d3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-757fba3 e-con-full e-flex e-con e-child\" data-id=\"757fba3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5e33bff elementor-widget elementor-widget-image\" data-id=\"5e33bff\" 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=\"375\" height=\"374\" src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2025\/09\/6-1.svg\" class=\"attachment-large size-large wp-image-381\" alt=\"\" \/>\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-0690443 e-con-full e-flex e-con e-child\" data-id=\"0690443\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dccc3e5 elementor-widget elementor-widget-html\" data-id=\"dccc3e5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.av-carousel {\n    position: relative;\n    width: 100%;\n    max-width: 800px;\n    margin: 0 auto;\n    overflow: hidden;\n    border-radius: 20px;\n    background: #000;\n}\n\n.av-track {\n    display: flex;\n    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n}\n\n.av-slide {\n    min-width: 100%;\n    position: relative;\n    aspect-ratio: 16\/9;\n    background: #0a0a0a;\n}\n\n.av-slide video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n    border-radius: 0;\n}\n\n\/* Play button overlay *\/\n.av-play {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 72px;\n    height: 72px;\n    background: rgba(139, 92, 246, 0.3);\n    backdrop-filter: blur(12px);\n    -webkit-backdrop-filter: blur(12px);\n    border: 2px solid rgba(139, 92, 246, 0.5);\n    border-radius: 50%;\n    cursor: pointer;\n    z-index: 5;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.3s ease;\n}\n\n.av-play:hover {\n    background: rgba(139, 92, 246, 0.5);\n    transform: translate(-50%, -50%) scale(1.08);\n    border-color: rgba(139, 92, 246, 0.8);\n}\n\n.av-play svg {\n    width: 24px;\n    height: 24px;\n    fill: #fff;\n    margin-left: 3px;\n}\n\n.av-slide.is-playing .av-play {\n    opacity: 0;\n    pointer-events: none;\n}\n\n\/* Arrows *\/\n.av-arrow {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    width: 44px;\n    height: 44px;\n    background: rgba(255, 255, 255, 0.08);\n    backdrop-filter: blur(8px);\n    -webkit-backdrop-filter: blur(8px);\n    border: 1px solid rgba(255, 255, 255, 0.15);\n    border-radius: 50%;\n    cursor: pointer;\n    z-index: 10;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.3s ease;\n}\n\n.av-arrow:hover {\n    background: rgba(139, 92, 246, 0.3);\n    border-color: rgba(139, 92, 246, 0.5);\n}\n\n.av-arrow svg {\n    width: 18px;\n    height: 18px;\n    stroke: #fff;\n    stroke-width: 2.5;\n    fill: none;\n}\n\n.av-prev { left: 12px; }\n.av-next { right: 12px; }\n\n\/* Dots *\/\n.av-dots {\n    display: flex;\n    justify-content: center;\n    gap: 8px;\n    padding: 14px 0;\n    background: #000;\n}\n\n.av-dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background: rgba(255, 255, 255, 0.2);\n    border: none;\n    cursor: pointer;\n    transition: all 0.3s ease;\n    padding: 0;\n}\n\n.av-dot.active {\n    background: rgba(139, 92, 246, 0.8);\n    width: 24px;\n    border-radius: 4px;\n}\n\n\/* Mobile *\/\n@media (max-width: 768px) {\n    .av-carousel { border-radius: 14px; }\n    .av-arrow { width: 36px; height: 36px; }\n    .av-arrow svg { width: 14px; height: 14px; }\n    .av-prev { left: 8px; }\n    .av-next { right: 8px; }\n    .av-play { width: 60px; height: 60px; }\n    .av-play svg { width: 20px; height: 20px; }\n}\n<\/style>\n\n<div class=\"av-carousel\">\n    <div class=\"av-track\" id=\"avTrack\"><\/div>\n    \n    <div class=\"av-arrow av-prev\" id=\"avPrev\">\n        <svg viewBox=\"0 0 24 24\"><polyline points=\"15 18 9 12 15 6\"><\/polyline><\/svg>\n    <\/div>\n    <div class=\"av-arrow av-next\" id=\"avNext\">\n        <svg viewBox=\"0 0 24 24\"><polyline points=\"9 6 15 12 9 18\"><\/polyline><\/svg>\n    <\/div>\n    \n\n<\/div>\n<div class=\"av-dots\" id=\"avDots\"><\/div>\n\n<script>\n(function() {\n    var videos = [\n        \"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Abuela-Novela-15ss.mp4\",\n        \"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Anuncio-Entrevista-15ss.mp4\",\n        \"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-VIDEO-Youtube-University-.mp4\",\n        \"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Video-1-Es-mi-tiempo.mp4\",\n        \"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Video-2-Voy-por-mas.mp4\",\n        \"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Copy-of-Video-3-Lo-logr\u00e9-y-los-So\u00f1\u00e9.mp4\"\n    ];\n\n    var track = document.getElementById('avTrack');\n    var dots = document.getElementById('avDots');\n    var current = 0;\n\n    \/\/ Build slides\n    videos.forEach(function(src, i) {\n        var slide = document.createElement('div');\n        slide.className = 'av-slide';\n        slide.setAttribute('data-index', i);\n        slide.innerHTML =\n            '<video src=\"' + src + '\" preload=\"metadata\" playsinline webkit-playsinline><\/video>' +\n            '<div class=\"av-play\"><svg viewBox=\"0 0 24 24\"><polygon points=\"6,3 20,12 6,21\"><\/polygon><\/svg><\/div>';\n        track.appendChild(slide);\n\n        \/\/ Dot\n        var dot = document.createElement('button');\n        dot.className = 'av-dot' + (i === 0 ? ' active' : '');\n        dot.setAttribute('data-index', i);\n        dots.appendChild(dot);\n    });\n\n    function goTo(index) {\n        \/\/ Pause all videos\n        track.querySelectorAll('video').forEach(function(v) {\n            v.pause();\n            v.removeAttribute('controls');\n        });\n        track.querySelectorAll('.av-slide').forEach(function(s) {\n            s.classList.remove('is-playing');\n        });\n\n        current = index;\n        if (current < 0) current = videos.length - 1;\n        if (current >= videos.length) current = 0;\n\n        track.style.transform = 'translateX(-' + (current * 100) + '%)';\n\n        \/\/ Update dots\n        dots.querySelectorAll('.av-dot').forEach(function(d, i) {\n            d.classList.toggle('active', i === current);\n        });\n    }\n\n    \/\/ Arrow clicks\n    document.getElementById('avPrev').addEventListener('click', function() { goTo(current - 1); });\n    document.getElementById('avNext').addEventListener('click', function() { goTo(current + 1); });\n\n    \/\/ Dot clicks\n    dots.addEventListener('click', function(e) {\n        if (e.target.classList.contains('av-dot')) {\n            goTo(parseInt(e.target.getAttribute('data-index')));\n        }\n    });\n\n    \/\/ Play button clicks\n    track.addEventListener('click', function(e) {\n        var playBtn = e.target.closest('.av-play');\n        var slide = e.target.closest('.av-slide');\n        if (!slide) return;\n\n        var video = slide.querySelector('video');\n        if (playBtn) {\n            video.setAttribute('controls', 'controls');\n            video.play();\n            slide.classList.add('is-playing');\n        }\n    });\n\n    \/\/ When video ends, show play button again\n    track.querySelectorAll('video').forEach(function(v) {\n        v.addEventListener('pause', function() {\n            var slide = v.closest('.av-slide');\n            if (v.ended || v.paused) {\n                slide.classList.remove('is-playing');\n            }\n        });\n        v.addEventListener('ended', function() {\n            v.closest('.av-slide').classList.remove('is-playing');\n            v.removeAttribute('controls');\n        });\n    });\n\n    \/\/ Swipe support for mobile\n    var startX = 0, moveX = 0, dragging = false;\n    track.addEventListener('touchstart', function(e) {\n        startX = e.touches[0].clientX;\n        dragging = true;\n    }, { passive: true });\n    track.addEventListener('touchmove', function(e) {\n        if (dragging) moveX = e.touches[0].clientX - startX;\n    }, { passive: true });\n    track.addEventListener('touchend', function() {\n        if (Math.abs(moveX) > 50) {\n            if (moveX < 0) goTo(current + 1);\n            else goTo(current - 1);\n        }\n        moveX = 0;\n        dragging = false;\n    });\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a086d7f e-flex e-con-boxed e-con e-parent\" data-id=\"a086d7f\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;,&quot;background_video_link&quot;:&quot;https:\\\/\\\/alternaagency.com\\\/wp-content\\\/uploads\\\/2026\\\/02\\\/Cosmic-Moves-FInal.mp4&quot;,&quot;background_play_on_mobile&quot;:&quot;yes&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-background-video-container\">\n\t\t\t\t\t\t\t<video class=\"elementor-background-video-hosted\" role=\"presentation\" autoplay muted playsinline loop><\/video>\n\t\t\t\t\t<\/div>\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6ef55cf e-flex e-con-boxed e-con e-parent\" data-id=\"6ef55cf\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-c09712a e-con-full e-flex e-con e-child\" data-id=\"c09712a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-13fe84e e-con-full e-flex e-con e-child\" data-id=\"13fe84e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-01588df elementor-widget elementor-widget-html\" data-id=\"01588df\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n.av-single2 {\n    position: relative;\n    width: 100%;\n    max-width: 800px;\n    margin: 0 auto;\n    overflow: hidden;\n    border-radius: 20px;\n    background: #000;\n    aspect-ratio: 16\/9;\n}\n\n.av-single2 video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n}\n\n.av-single2 .av-play2 {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 72px;\n    height: 72px;\n    background: rgba(139, 92, 246, 0.3);\n    backdrop-filter: blur(12px);\n    -webkit-backdrop-filter: blur(12px);\n    border: 2px solid rgba(139, 92, 246, 0.5);\n    border-radius: 50%;\n    cursor: pointer;\n    z-index: 5;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.3s ease;\n}\n\n.av-single2 .av-play2:hover {\n    background: rgba(139, 92, 246, 0.5);\n    transform: translate(-50%, -50%) scale(1.08);\n    border-color: rgba(139, 92, 246, 0.8);\n}\n\n.av-single2 .av-play2 svg {\n    width: 24px;\n    height: 24px;\n    fill: #fff;\n    margin-left: 3px;\n}\n\n.av-single2.is-playing .av-play2 {\n    opacity: 0;\n    pointer-events: none;\n}\n\n@media (max-width: 768px) {\n    .av-single2 { border-radius: 14px; }\n    .av-single2 .av-play2 { width: 60px; height: 60px; }\n    .av-single2 .av-play2 svg { width: 20px; height: 20px; }\n}\n<\/style>\n\n<div class=\"av-single2\" id=\"avSingle2\">\n    <video src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2026\/02\/Everyones-Pole-The-Movie-AlternaTV-1080p-h264.mp4\" preload=\"metadata\" playsinline webkit-playsinline><\/video>\n    <div class=\"av-play2\"><svg viewBox=\"0 0 24 24\"><polygon points=\"6,3 20,12 6,21\"><\/polygon><\/svg><\/div>\n<\/div>\n\n<script>\n(function() {\n    var wrap = document.getElementById('avSingle2');\n    var video = wrap.querySelector('video');\n    var playBtn = wrap.querySelector('.av-play2');\n\n    playBtn.addEventListener('click', function() {\n        video.setAttribute('controls', 'controls');\n        video.play();\n        wrap.classList.add('is-playing');\n    });\n\n    video.addEventListener('pause', function() {\n        if (video.ended || video.paused) wrap.classList.remove('is-playing');\n    });\n\n    video.addEventListener('ended', function() {\n        wrap.classList.remove('is-playing');\n        video.removeAttribute('controls');\n    });\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ebc5d78 e-con-full e-flex e-con e-child\" data-id=\"ebc5d78\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bf86500 elementor-widget elementor-widget-image\" data-id=\"bf86500\" 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 decoding=\"async\" width=\"375\" height=\"374\" src=\"https:\/\/alternaagency.com\/wp-content\/uploads\/2025\/08\/Untitled-design-73.svg\" class=\"attachment-large size-large wp-image-46\" alt=\"\" \/>\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\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>The New Standard of Creativity Intelligence Innovation Strategy Vision Elevating the digital landscape through AI-powered craft and data-driven storytelling. True innovation happens at the intersection of intuition and algorithm. Our AI Portfolio represents the peak of Alterna\u2019s co-exclusive works: a collection of high-impact videos, bespoke digital art, and intelligent data structures designed for the elite [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1270","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/pages\/1270","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/comments?post=1270"}],"version-history":[{"count":25,"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/pages\/1270\/revisions"}],"predecessor-version":[{"id":1316,"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/pages\/1270\/revisions\/1316"}],"wp:attachment":[{"href":"https:\/\/alternaagency.com\/es\/wp-json\/wp\/v2\/media?parent=1270"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}