{"id":165,"date":"2026-07-16T09:09:23","date_gmt":"2026-07-16T09:09:23","guid":{"rendered":"https:\/\/taughtyouso.com\/?page_id=165"},"modified":"2026-07-16T09:30:51","modified_gmt":"2026-07-16T09:30:51","slug":"start-espanol","status":"publish","type":"page","link":"https:\/\/taughtyouso.com\/?page_id=165&lang=es","title":{"rendered":"Start &#8211; Espa\u00f1ol"},"content":{"rendered":"\n<script>\n\n\/**\n * Script de fondo Camera Sweep para WordPress - Versi\u00f3n 13 (Transici\u00f3n suave y fondo oscurecido)\n * Transici\u00f3n de medios fluida sin ca\u00edda de transparencia en la mirilla.\n * Brillo del fondo atenuado al 50% para un contraste m\u00e1ximo.\n * (c) Taughtyouso UG (haftungsbeschr\u00e4nkt) 2026\n *\/\n\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n    \/\/ 1. CONFIGURACI\u00d3N\n    \/\/ IMPORTANTE: \u00a1Introduzca aqu\u00ed la URL de su PNG de m\u00e1scara transparente!\n    const maskImageURL = 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/06\/outlined-sw-large-transparent.png';\n\n    const mediaList = [\n        { type: 'image', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Gemini_Generated_Image_1k7v1r1k7v1r1k7v-scaled.jpg' },\n        { type: 'video', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Sanfte_Wellen_Video_Generiert.mp4' },\n        { type: 'image', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Gemini_Generated_Image_qe5hv2qe5hv2qe5h-1-scaled.jpg' },\n        { type: 'image', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Gemini_Generated_Image_i790qmi790qmi790-scaled.jpg' },\n        { type: 'image', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Gemini_Generated_Image_a1aemda1aemda1ae-scaled.jpg' },\n        { type: 'video', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Video_202604062334.mp4' },\n        { type: 'video', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Ba-86-A-4-E-9-5-Ccb-4-D-1-D-A-64-A-8286-B-9-B-82835.mp4' },\n        { type: 'video', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/100-C-83-E-0-7838-4-E-21-8573-Bdd-99031934-C.mp4' },\n        { type: 'video', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Video_Loop_Sanfte_Wellen_am_Strand.mp4' },\n        { type: 'video', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/E-64661-E-8-A-0-E-4-4-Cd-4-8-Ac-0-7-F-6-Dd-282-Bbee.mp4' },\n        { type: 'image', url: 'https:\/\/taughtyouso.com\/wp-content\/uploads\/2026\/04\/Gemini_Generated_Image_qe5hv2qe5hv2qe5h-scaled.jpg' }\n    ];\n\n    const textLines = [\n        \"\u00a1Oye, t\u00fa!\",\n        \"\u00bfQu\u00e9 haces aqu\u00ed?\",\n        \"Esta es solo otra p\u00e1gina de inicio de empresa\",\n        \"La p\u00e1gina de inicio de taughtyouso\",\n        \"Ellos operan la plataforma de cuestionarios quoozle.com\",\n        \"Es buena, s\u00ed, \u00a1realmente buena!\",\n        \"Pero por lo dem\u00e1s no hay nada que ver aqu\u00ed\",\n        \"No desperdicies tu vida\",\n        \"\u00a1Sigue navegando!\",\n        \"(...)\",\n        \"(..)\",\n        \"(.)\",\n        \"\u00a1Oye, todav\u00eda est\u00e1s aqu\u00ed!\",\n        \"Antes que nada: Dedico esta p\u00e1gina web a Tatjana, a quien conoc\u00ed en St. Barth hace dos a\u00f1os.\",\n        \"Bromas aparte. Eso fue, por supuesto, una cita de 39,90 o 99 francos.\",\n        \"\u00bfNo lo conoces? Deber\u00edas echarle un vistazo\",\n        \"Al menos, si tienes algo que ver con la publicidad\",\n        \"Siempre se debe empezar por aligerar el ambiente con una broma tonta\",\n        \"Pero, por supuesto, la verdadera pregunta sigue siendo:\",\n        \"\u00bfQu\u00e9 buscas realmente aqu\u00ed?\",\n        \"\u00bfProbablemente me conoces en persona de la vida real?\",\n        \"\u00bfO es realmente algo de negocios?\",\n        \"Si es as\u00ed: Prueba con el correo electr\u00f3nico o LinkedIn\",\n        \"Si quieres informarte sobre Quoozle, mira arriba en Productos\",\n        \"Sinceramente: Ahora mismo aqu\u00ed solo hay Quoozle, obviamente, pero qu\u00e9 m\u00e1s da\",\n        \"Es realmente bueno, al menos eso creo\",\n        \"Pero, por supuesto, de todos modos averiguar\u00e9 qu\u00e9 te interesa\",\n        \"Porque lo rastreo aqu\u00ed. Pero no te preocupes, lo hago yo mismo\",\n        \"Con Matomo, as\u00ed que no es parte de ninguna conspiraci\u00f3n mundial\",\n        \"Lo prometo. (Aunque, por supuesto, todos dir\u00edan eso)\",\n        \"Pero bueno, \u00a1ha sido un honor!\",\n        \"\u00a1Hasta pronto!\",\n        \"Ah s\u00ed, mi nombre es Nils Peters\"\n    ];\n\n    const sweepDuration = 8000; \n    const fadeDuration = 1500;  \n    const textDisplayDuration = 5200; \n    const textPauseDuration = 1800;   \n\n    \/\/ 2. CREAR CONTENEDOR\n    const container = document.createElement('div');\n    container.id = 'camera-sweep-container';\n    Object.assign(container.style, {\n        position: 'fixed', top: '0', left: '0', width: '100vw', height: '100vh', zIndex: '-1', overflow: 'hidden', backgroundColor: '#ffffff'\n    });\n    document.body.appendChild(container);\n\n    \/\/ VI\u00d1ETA\n    const vignette = document.createElement('div');\n    vignette.id = 'sweep-vignette';\n    Object.assign(vignette.style, {\n        position: 'absolute', top: '0', left: '0', width: '100%', height: '100%', zIndex: '20', pointerEvents: 'none',\n        background: 'radial-gradient(circle, rgba(0,0,0,0) 30%, rgba(0,0,0,0.55) 100%)'\n    });\n    container.appendChild(vignette);\n\n    \/\/ ELEMENTO DE TEXTO\n    const textOverlay = document.createElement('div');\n    textOverlay.id = 'sweep-text-overlay';\n    container.appendChild(textOverlay);\n\n    \/\/ 3. REGLAS DE DISE\u00d1O CSS (CON FILTRO DE BRILLO DEL 50%)\n    const style = document.createElement('style');\n    style.innerHTML = `\n        #camera-sweep-container .sweep-layer {\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            opacity: 0;\n            transition: opacity ${fadeDuration}ms ease-in-out;\n            will-change: opacity;\n        }\n        \n        \/* CAPA DE FONDO ATENUADA AL 50% DE BRILLO *\/\n        #camera-sweep-container .sweep-layer.base {\n            filter: brightness(0.5);\n        }\n        #camera-sweep-container .sweep-layer.base.active { opacity: 1; z-index: 1; }\n        \n        \/* CONTENEDOR SUPERPUESTO CON M\u00c1SCARA DEL 75% *\/\n        #camera-sweep-container .sweep-layer.overlay {\n            isolation: isolate; \n            transform: translateZ(0); \n            -webkit-transform: translateZ(0);\n            backface-visibility: hidden;\n            -webkit-backface-visibility: hidden;\n            \n            -webkit-mask: url('${maskImageURL}') center \/ 75% no-repeat;\n            mask: url('${maskImageURL}') center \/ 75% no-repeat;\n            -webkit-mask-image: url('${maskImageURL}');\n            mask-image: url('${maskImageURL}');\n            -webkit-mask-size: 75%;\n            mask-size: 75%;\n            -webkit-mask-position: center;\n            mask-position: center;\n            -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n            -webkit-mask-type: alpha;\n            mask-type: alpha;\n        }\n        \n        \/* EL V\u00cdDEO SELECCIONADO EN LA MIRILLA ES 100% OPACO *\/\n        #camera-sweep-container .sweep-layer.overlay.active { opacity: 1; z-index: 2; }\n        \n        #camera-sweep-container .sweep-media {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            display: block;\n            will-change: transform, filter;\n        }\n\n        \/* ESTILO DE TEXTO *\/\n        #sweep-text-overlay {\n            position: absolute; top: 50%; left: 50%; z-index: 25; color: #ffffff;\n            font-family: var(--wp--preset--font-family--heading), \"Arial Black\", Impact, sans-serif;\n            font-weight: 900; text-transform: uppercase; font-size: 1.9rem; line-height: 1.2; text-align: center;\n            text-shadow: 3px 3px 15px rgba(0, 0, 0, 0.75), 0 0 8px rgba(0, 0, 0, 0.4); width: 90%; max-width: 800px;\n            pointer-events: none; transform: translate(-50%, -50%); will-change: transform;\n        }\n        @media (max-width: 768px) { #sweep-text-overlay { font-size: 1.15rem; } }\n\n        .ydkj-puff-wrapper { display: inline-block; width: 100%; opacity: 0; will-change: transform, opacity, filter; }\n        .ydkj-active { animation: ydkjLinearDrift ${textDisplayDuration}ms linear forwards; }\n        .ydkj-active .ydkj-puff-wrapper { animation: ydkjPuffExplosion ${textDisplayDuration}ms cubic-bezier(0.16, 1, 0.3, 1) forwards; }\n\n        @keyframes ydkjLinearDrift {\n            0% { transform: translate(calc(-50% + var(--startX)), calc(-50% + var(--startY))); }\n            100% { transform: translate(calc(-50% + var(--endX)), calc(-50% + var(--endY))); }\n        }\n        @keyframes ydkjPuffExplosion {\n            0% { opacity: 0; transform: scale(0.7); filter: blur(5px); }\n            15% { opacity: 1; transform: scale(1); filter: blur(0px); }\n            78% { opacity: 1; transform: scale(1.02); filter: blur(0px); }\n            100% { opacity: 0; transform: scale(3.0); filter: blur(12px); }\n        }\n\n        body, .site, #page, .site-content, #content, .main-container, .elementor-page {\n            background-color: transparent !important;\n        }\n    `;\n    document.head.appendChild(style);\n\n    \/\/ 4. MATRICES DE MOVIMIENTO\n    const baseDesktopMovements = [\n        { start: 'scale(1.5) rotate(6deg) translate(-4%, -1%)', startBlur: '4px', end: 'scale(1.3) rotate(-3deg) translate(4%, 1%)', endBlur: '0px' },\n        { start: 'scale(1.3) rotate(-5deg) translate(4%, -2%)', startBlur: '0px', end: 'scale(1.6) rotate(4deg) translate(-4%, 2%)', endBlur: '5px' },\n        { start: 'scale(1.6) rotate(4deg) translate(-2%, 2%)', startBlur: '3px', end: 'scale(1.3) rotate(-4deg) translate(2%, -2%)', endBlur: '0px' },\n        { start: 'scale(1.4) rotate(-4deg) translate(-4%, 0%)', startBlur: '0px', end: 'scale(1.5) rotate(5deg) translate(4%, 0%)', endBlur: '3px' }\n    ];\n    const baseMobileMovements = [\n        { start: 'scale(2.1) rotate(6deg) translate(-18%, -1%)', startBlur: '5px', end: 'scale(1.9) rotate(-4deg) translate(18%, 2%)', endBlur: '0px' },\n        { start: 'scale(2.0) rotate(-5deg) translate(16%, -2%)', startBlur: '0px', end: 'scale(2.2) rotate(5deg) translate(-16%, 2%)', endBlur: '6px' },\n        { start: 'scale(2.2) rotate(4deg) translate(-20%, 1%)', startBlur: '4px', end: 'scale(1.9) rotate(-5deg) translate(20%, -1%)', endBlur: '0px' },\n        { start: 'scale(1.9) rotate(-6deg) translate(18%, -2%)', startBlur: '0px', end: 'scale(2.1) rotate(6deg) translate(-18%, 2%)', endBlur: '4px' }\n    ];\n\n    const overlayDesktopMovements = [\n        { start: 'scale(2.2) rotate(-3deg) translate(4%, 1%)', startBlur: '0px', end: 'scale(2.5) rotate(6deg) translate(-4%, -1%)', endBlur: '4px' },\n        { start: 'scale(2.5) rotate(4deg) translate(-4%, 2%)', startBlur: '5px', end: 'scale(2.0) rotate(-5deg) translate(4%, -2%)', endBlur: '0px' },\n        { start: 'scale(2.0) rotate(-4deg) translate(2%, -2%)', startBlur: '0px', end: 'scale(2.4) rotate(4deg) translate(-2%, 2%)', endBlur: '3px' },\n        { start: 'scale(2.3) rotate(5deg) translate(4%, 0%)', startBlur: '3px', end: 'scale(2.1) rotate(-4deg) translate(-4%, 0%)', endBlur: '0px' }\n    ];\n    const overlayMobileMovements = [\n        { start: 'scale(2.9) rotate(-4deg) translate(18%, 2%)', startBlur: '0px', end: 'scale(3.2) rotate(6deg) translate(-18%, -1%)', endBlur: '5px' },\n        { start: 'scale(3.2) rotate(5deg) translate(-16%, 2%)', startBlur: '6px', end: 'scale(2.8) rotate(-5deg) translate(16%, -2%)', endBlur: '0px' },\n        { start: 'scale(2.8) rotate(-5deg) translate(20%, -1%)', startBlur: '0px', end: 'scale(3.2) rotate(4deg) translate(-20%, 1%)', endBlur: '4px' },\n        { start: 'scale(3.1) rotate(6deg) translate(-18%, 2%)', startBlur: '4px', end: 'scale(2.8) rotate(-6deg) translate(18%, -2%)', endBlur: '0px' }\n    ];\n\n    let currentBaseIdx = -1, currentOverlayIdx = -1;\n    let baseMovementCounter = 0, overlayMovementCounter = 0;\n    let activeBaseLayer = null, activeOverlayLayer = null;\n\n    \/\/ 5. MOTOR DE MEDIOS (SOLUCI\u00d3N DE TRANSICI\u00d3N SUPERPUESTA FLUIDA)\n    function executeSweep(isOverlay) {\n        if (mediaList.length === 0) return;\n\n        let chosenIdx;\n        if (!isOverlay) {\n            let nextBase = currentBaseIdx;\n            while (nextBase === currentBaseIdx || nextBase === currentOverlayIdx) {\n                nextBase = Math.floor(Math.random() * mediaList.length);\n            }\n            currentBaseIdx = nextBase; chosenIdx = currentBaseIdx;\n        } else {\n            let nextOverlay = currentOverlayIdx;\n            while (nextOverlay === currentOverlayIdx || nextOverlay === currentBaseIdx) {\n                nextOverlay = Math.floor(Math.random() * mediaList.length);\n            }\n            currentOverlayIdx = nextOverlay; chosenIdx = currentOverlayIdx;\n        }\n\n        const mediaItem = mediaList[chosenIdx];\n        const layer = document.createElement('div');\n        layer.className = `sweep-layer ${isOverlay ? 'overlay' : 'base'}`;\n        \n        let mediaEl;\n        if (mediaItem.type === 'video') {\n            mediaEl = document.createElement('video'); mediaEl.src = mediaItem.url;\n            mediaEl.autoplay = true; mediaEl.loop = true; mediaEl.muted = true; mediaEl.playsInline = true; \n            mediaEl.className = 'sweep-media';\n        } else {\n            mediaEl = document.createElement('img'); mediaEl.src = mediaItem.url; mediaEl.className = 'sweep-media';\n        }\n        \n        mediaEl.style.transition = `transform ${sweepDuration}ms linear, filter ${sweepDuration}ms ease-out`;\n        \n        const isMobile = window.innerWidth <= 768;\n        \n        \/\/ Asignaci\u00f3n del conjunto de movimientos\n        let move;\n        if (!isOverlay) {\n            const currentSet = isMobile ? baseMobileMovements : baseDesktopMovements;\n            move = currentSet[baseMovementCounter % currentSet.length]; baseMovementCounter++;\n        } else {\n            const currentSet = isMobile ? overlayMobileMovements : overlayDesktopMovements;\n            move = currentSet[overlayMovementCounter % currentSet.length]; overlayMovementCounter++;\n        }\n        \n        mediaEl.style.transform = move.start; \n        mediaEl.style.filter = `blur(${move.startBlur})`;\n        \n        layer.appendChild(mediaEl); container.appendChild(layer);\n        layer.offsetHeight; layer.classList.add('active');\n        \n        setTimeout(() => {\n            mediaEl.style.transform = move.end; mediaEl.style.filter = `blur(${move.endBlur})`;\n        }, 50);\n\n        \/\/ --- SOLUCI\u00d3N: TRANSICI\u00d3N FLUIDA SIN CA\u00cdDA DE TRANSPARENCIA ---\n        \/\/ El nuevo elemento se superpone y aparece gradualmente. \n        \/\/ El elemento antiguo permanece intacto y totalmente visible debajo, hasta que el nuevo est\u00e9 al 100%.\n        if (!isOverlay) {\n            const oldLayer = activeBaseLayer; activeBaseLayer = layer;\n            if (oldLayer) { \n                setTimeout(() => oldLayer.remove(), fadeDuration); \n            }\n            setTimeout(() => executeSweep(false), sweepDuration);\n        } else {\n            const oldLayer = activeOverlayLayer; activeOverlayLayer = layer;\n            if (oldLayer) { \n                \/\/ El antiguo v\u00eddeo de m\u00e1scara se elimina en segundo plano, solo DESPU\u00c9S de que el nuevo haya aparecido al 100%\n                setTimeout(() => oldLayer.remove(), fadeDuration); \n            }\n            setTimeout(() => executeSweep(true), sweepDuration);\n        }\n    }\n\n    \/\/ 6. SALTO DE L\u00cdNEA\n    function wrapTextAtLimit(str, limit = 20) {\n        return str.split(' ').reduce((acc, word) => {\n            if (!acc.length) return [word];\n            let lastLine = acc[acc.length - 1];\n            if ((lastLine + ' ' + word).length <= limit) { acc[acc.length - 1] = lastLine + ' ' + word; } else { acc.push(word); }\n            return acc;\n        }, []).join('<br>');\n    }\n\n    \/\/ 7. MOTOR DE TEXTO\n    let textIdx = 0;\n    function playNextTextLine() {\n        if (textLines.length === 0) return;\n        const formattedText = wrapTextAtLimit(textLines[textIdx], 20);\n        textOverlay.innerHTML = `<div class=\"ydkj-puff-wrapper\">${formattedText}<\/div>`;\n\n        const randomAngle = Math.random() * Math.PI * 2;\n        const isMobile = window.innerWidth <= 768;\n        const travelDistance = isMobile ? 60 : 120; \n\n        const startX = -Math.cos(randomAngle) * (travelDistance \/ 2);\n        const startY = -Math.sin(randomAngle) * (travelDistance \/ 2);\n        const endX = Math.cos(randomAngle) * (travelDistance \/ 2);\n        const endY = Math.sin(randomAngle) * (travelDistance \/ 2);\n\n        textOverlay.style.setProperty('--startX', `${startX}px`);\n        textOverlay.style.setProperty('--startY', `${startY}px`);\n        textOverlay.style.setProperty('--endX', `${endX}px`);\n        textOverlay.style.setProperty('--endY', `${endY}px`);\n\n        textOverlay.classList.remove('ydkj-active');\n        textOverlay.offsetHeight; textOverlay.classList.add('ydkj-active');\n\n        textIdx = (textIdx + 1) % textLines.length;\n        setTimeout(playNextTextLine, textDisplayDuration + textPauseDuration);\n    }\n\n    \/\/ INICIO\n    executeSweep(false);\n    setTimeout(function() { executeSweep(true); }, sweepDuration \/ 2);\n    setTimeout(function() { playNextTextLine(); }, 1500);\n});\n\n<\/script>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"disable","_kad_post_title":"hide","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-165","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/taughtyouso.com\/index.php?rest_route=\/wp\/v2\/pages\/165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/taughtyouso.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/taughtyouso.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/taughtyouso.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/taughtyouso.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=165"}],"version-history":[{"count":1,"href":"https:\/\/taughtyouso.com\/index.php?rest_route=\/wp\/v2\/pages\/165\/revisions"}],"predecessor-version":[{"id":175,"href":"https:\/\/taughtyouso.com\/index.php?rest_route=\/wp\/v2\/pages\/165\/revisions\/175"}],"wp:attachment":[{"href":"https:\/\/taughtyouso.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}