{"id":4350,"date":"2026-09-04T20:33:26","date_gmt":"2026-09-04T20:33:26","guid":{"rendered":"https:\/\/jpdirector.net\/?page_id=4350"},"modified":"2026-09-10T21:59:45","modified_gmt":"2026-09-10T21:59:45","slug":"resultados-de-campanas","status":"publish","type":"page","link":"https:\/\/jpdirector.net\/en\/resultados-de-campanas\/","title":{"rendered":"Results"},"content":{"rendered":"\n
\n\n\n\n\n\nResultados de campa\u00f1as publicitarias | JP Director<\/title>\n<meta name=\"description\" content=\"Resultados por categor\u00eda de negocio: servicios profesionales, salud y est\u00e9tica, empresas de alto volumen y educaci\u00f3n online. Un sistema probado, adaptado a cada industria.\">\n<link rel=\"canonical\" href=\"https:\/\/jpdirector.net\/resultados-de-campanas\/\">\n<meta name=\"robots\" content=\"index, follow, max-image-preview:large\">\n<meta name=\"theme-color\" content=\"#FFFEFE\">\n\n<meta property=\"og:type\" content=\"website\">\n<meta property=\"og:locale\" content=\"es_ES\">\n<meta property=\"og:site_name\" content=\"JP Director\">\n<meta property=\"og:title\" content=\"Resultados de campa\u00f1as publicitarias | JP Director\">\n<meta property=\"og:description\" content=\"Resultados construidos sobre decisiones estrat\u00e9gicas, datos y ejecuci\u00f3n constante. Presentados por categor\u00eda de negocio.\">\n<meta property=\"og:url\" content=\"https:\/\/jpdirector.net\/resultados-de-campanas\/\">\n<meta name=\"twitter:card\" content=\"summary_large_image\">\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Mono:wght@400&family=Poppins:wght@400;500;600&display=swap\">\n<style>\n\/* ============================================================================\n JP DIRECTOR \u2014 Resultados de campa\u00f1as\n Mismos tokens y mismos componentes de marca que la home. Lo propio de esta\n plantilla:\n\n \u00b7 6.3 el hero va sobre BLANCO, \u00fanico caso del sitio. Eso obliga a tres\n cambios que no son de gusto sino de f\u00edsica del color:\n - la aurora no se puede usar (ver el comentario en 4. TYPOGRAPHY);\n - el CTA principal es .btn--dark, porque un bot\u00f3n cian cuya cortina de\n hover es blanca se desvanecer\u00eda sobre un fondo blanco;\n - el fondo lleva ret\u00edcula de puntos, no de l\u00edneas: sobre claro, la l\u00ednea\n de 1px del resto del sitio se lee como suciedad y el punto no.\n \u00b7 6.5 dos paneles de VSL con la misma pieza: uno horizontal en el hero y uno\n vertical (9:16) en su propia secci\u00f3n.\n \u00b7 6.7 la rejilla que se ordena al hacer scroll, tra\u00edda de la home, aqu\u00ed con\n los seis elementos del sistema.\n ============================================================================ *\/\n\n\n\/* ============================================================================\n 1. VARIABLES\n ============================================================================ *\/\n\n:root {\n\n \/* --- Paleta de marca (\u00fanica fuente de color) --- *\/\n --c-ink: #00041C;\n --c-navy: #040D36;\n --c-cyan: #15E0FB;\n --c-white: #FFFEFE;\n\n \/* --- Derivados sobre fondo oscuro --- *\/\n --c-text: var(--c-white);\n --c-dim: color-mix(in srgb, var(--c-white) 66%, transparent);\n --c-dimmer: color-mix(in srgb, var(--c-white) 44%, transparent);\n --c-faint: color-mix(in srgb, var(--c-white) 22%, transparent);\n\n --c-line: color-mix(in srgb, var(--c-cyan) 16%, transparent);\n --c-line-hi: color-mix(in srgb, var(--c-cyan) 38%, transparent);\n --c-line-soft: color-mix(in srgb, var(--c-white) 9%, transparent);\n --c-cyan-dim: color-mix(in srgb, var(--c-cyan) 52%, transparent);\n\n --c-panel: color-mix(in srgb, var(--c-cyan) 4%, var(--c-navy));\n --c-panel-hi: color-mix(in srgb, var(--c-cyan) 9%, var(--c-navy));\n --c-glow: color-mix(in srgb, var(--c-cyan) 26%, transparent);\n --c-glow-soft: color-mix(in srgb, var(--c-cyan) 10%, transparent);\n\n \/* --- Derivados sobre fondo claro. En esta p\u00e1gina cargan con el hero\n entero, as\u00ed que hay uno m\u00e1s que en el resto de plantillas. --- *\/\n --c-on-light: var(--c-navy);\n --c-on-light-dim: color-mix(in srgb, var(--c-navy) 66%, var(--c-white));\n --c-on-light-faint: color-mix(in srgb, var(--c-navy) 42%, var(--c-white));\n --c-on-light-line: color-mix(in srgb, var(--c-navy) 14%, var(--c-white));\n --c-on-light-panel: color-mix(in srgb, var(--c-cyan) 5%, var(--c-white));\n\n \/* --- Tipograf\u00eda --- *\/\n --f-sans: \"Poppins\", system-ui, -apple-system, \"Segoe UI\", sans-serif;\n --f-mono: \"IBM Plex Mono\", ui-monospace, SFMono-Regular, Menlo, monospace;\n\n --t-xs: 0.6875rem;\n --t-sm: clamp(0.8125rem, 0.79rem + 0.12vw, 0.9rem);\n --t-base: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);\n --t-md: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);\n --t-lg: clamp(1.25rem, 1.12rem + 0.55vw, 1.6rem);\n --t-xl: clamp(1.5rem, 1.24rem + 1.1vw, 2.25rem);\n --t-2xl: clamp(2rem, 1.5rem + 2.2vw, 3.4rem);\n --t-3xl: clamp(2.5rem, 1.6rem + 4vw, 5rem);\n\n --lh-tight: 1.04;\n --lh-head: 1.14;\n --lh-body: 1.65;\n\n \/* --- Espacio y layout --- *\/\n --s-1: 0.25rem;\n --s-2: 0.5rem;\n --s-3: 0.75rem;\n --s-4: 1rem;\n --s-5: 1.5rem;\n --s-6: 2rem;\n --s-7: 2.5rem;\n --s-8: 3rem;\n --s-9: 4rem;\n\n --maxw: 1240px;\n --gutter: clamp(1.25rem, 0.7rem + 2.4vw, 3rem);\n --sec-y: clamp(4.5rem, 3rem + 6vw, 9rem);\n --hdr-h: 76px;\n\n --r-sm: 4px;\n --r-md: 10px;\n --r-lg: 20px;\n --r-full: 999px;\n\n \/* --- Movimiento --- *\/\n --e-out: cubic-bezier(0.16, 1, 0.3, 1);\n --e-in-out: cubic-bezier(0.65, 0, 0.35, 1);\n --d-fast: 0.22s;\n --d-mid: 0.45s;\n --d-slow: 0.8s;\n}\n\n\n\/* ============================================================================\n 2. RESET\n ============================================================================ *\/\n\n*, *::before, *::after { box-sizing: border-box; }\n\n* { margin: 0; padding: 0; }\n\nhtml {\n -webkit-text-size-adjust: 100%;\n scroll-behavior: smooth;\n scroll-padding-top: calc(var(--hdr-h) + 1rem);\n overflow-x: clip;\n}\n\nbody {\n min-height: 100vh;\n background: var(--c-ink);\n color: var(--c-text);\n font-family: var(--f-sans);\n font-size: var(--t-base);\n line-height: var(--lh-body);\n font-weight: 400;\n -webkit-font-smoothing: antialiased;\n \/* Sin text-rendering: optimizeLegibility. Fuerza el procesado completo de\n ligaduras y kerning en todo el documento y puede retrasar el primer\n pintado del texto; Poppins ya trae kerning por defecto. *\/\n overflow-x: clip;\n}\n\nimg, video, svg { display: block; max-width: 100%; height: auto; }\n\nul, ol { list-style: none; }\n\na { color: inherit; text-decoration: none; }\n\nbutton, input, label, summary { font: inherit; color: inherit; }\n\nh1, h2, h3, h4 { font-weight: 600; line-height: var(--lh-head); text-wrap: balance; }\n\np { text-wrap: pretty; }\n\n:focus-visible {\n outline: 2px solid var(--c-cyan);\n outline-offset: 3px;\n border-radius: var(--r-sm);\n}\n\n\n\/* ============================================================================\n 2.5 BLINDAJE FRENTE AL TEMA DE WORDPRESS\n ----------------------------------------------------------------------------\n El reset universal tiene especificidad 0-0-0 y lo gana cualquier regla de\n tipo del tema: p { margin-bottom: 1.6em }, ul { padding-left: 40px }...\n El espaciado vertical se resuelve con gap, as\u00ed que se anulan todos los\n m\u00e1rgenes. Salvedades, fuera de estas listas: .sec__head y .vsl__cap, que s\u00ed\n llevan margen propio.\n ============================================================================ *\/\n\n\/* --- A. Contenedores de lista: es donde el tema mete la sangr\u00eda de 40px --- *\/\n.pillars, .blocks, .sys__grid, .sectors, .conf__list {\n list-style: none !important;\n padding-inline-start: 0 !important;\n margin: 0 !important;\n}\n\n\/* --- B. Todo lo que se apila con gap: m\u00e1rgenes a cero, incluidos los hijos\n directos de cada caja, porque el hueco lo pone el contenedor --- *\/\n.stack > *,\n.vsl,\n.pillars li, .pillars li > *,\n.blocks li, .blocks li > *,\n.sys__cell, .sys__cell > *,\n.sectors li, .sectors li > *,\n.conf__list li,\n.hero__note, .hero__note > * {\n margin: 0 !important;\n}\n\n\n\/* ============================================================================\n 3. BASE\n ============================================================================ *\/\n\n.wrap {\n width: 100%;\n max-width: var(--maxw);\n margin-inline: auto;\n padding-inline: var(--gutter);\n}\n\n.vh {\n position: absolute;\n width: 1px; height: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n}\n\n\/* --- Pila vertical ---\n Todo el ritmo vertical sale de aqu\u00ed: un solo sitio que ajustar y ning\u00fan\n p\u00e1rrafo con margen propio que el tema pueda pisar. *\/\n.stack {\n display: grid;\n gap: var(--gap, var(--s-5));\n justify-items: start;\n align-content: start;\n}\n.stack--tight { --gap: var(--s-4); }\n.stack--loose { --gap: var(--s-6); }\n.stack--center { justify-items: center; text-align: center; }\n\n\n\/* ============================================================================\n 4. TYPOGRAPHY\n ============================================================================ *\/\n\n.mono {\n font-family: var(--f-mono);\n font-size: var(--t-xs);\n letter-spacing: 0.1em;\n text-transform: uppercase;\n font-weight: 400;\n}\n\n.eyebrow {\n font-family: var(--f-mono);\n font-size: var(--t-xs);\n letter-spacing: 0.16em;\n text-transform: uppercase;\n color: var(--c-cyan);\n}\n\n\/* Marcador de secci\u00f3n: el n\u00famero hace expl\u00edcito el recorrido de la p\u00e1gina *\/\n.sec__mark {\n display: inline-flex;\n align-items: center;\n gap: 0.8em;\n color: var(--c-cyan);\n letter-spacing: 0.16em;\n}\n.sec__mark::after {\n content: \"\";\n width: clamp(28px, 4vw, 56px);\n height: 1px;\n background: currentColor;\n opacity: 0.5;\n}\n.sec__mark--dark { color: var(--c-navy); }\n\nem { font-style: normal; color: var(--c-cyan); }\n\n\/* --- Realce sobre fondo claro -------------------------------------------\n Sobre blanco NO se puede usar la palabra con aurora del resto del sitio.\n Ese efecto apila manchas de color con mix-blend-mode: darken, que toma el\n canal m\u00e1s oscuro entre la mancha y el fondo: sobre texto blanco gana la\n mancha y sobre fondo profundo gana el fondo, y de ah\u00ed que el color quede\n encerrado dentro de las letras. Sobre blanco la mancha es m\u00e1s oscura que\n todo, incluido el espacio entre letras, as\u00ed que el color se derramar\u00eda por\n la caja entera. Aqu\u00ed el realce es el subrayado cian de las secciones claras.\n ------------------------------------------------------------------------- *\/\n.on-light em {\n color: var(--c-on-light);\n text-decoration: underline;\n text-decoration-color: var(--c-cyan);\n text-decoration-thickness: 4px;\n text-underline-offset: 6px;\n}\n\n\/* --- Palabra con aurora: solo en las secciones oscuras --- *\/\n.aurora-word {\n position: relative;\n display: inline-block;\n color: var(--c-white);\n vertical-align: baseline;\n \/* No se parte: el subrayado y la capa de mezcla asumen una sola l\u00ednea *\/\n white-space: nowrap;\n padding-block: 0.06em 0.24em;\n margin-block: -0.06em -0.24em;\n}\n\n.aurora-word::after {\n content: \"\";\n position: absolute;\n left: 0;\n right: 0;\n top: 0.99em;\n z-index: 3;\n height: 0.055em;\n border-radius: 999px;\n background:\n linear-gradient(90deg, transparent, var(--c-cyan), transparent) no-repeat,\n linear-gradient(color-mix(in srgb, var(--c-cyan) 26%, transparent) 0 100%) no-repeat;\n background-size: 34% 100%, 100% 100%;\n animation: underline-scan 3.6s var(--e-in-out) infinite;\n}\n\n.aurora {\n position: absolute;\n inset: 0;\n z-index: 2;\n overflow: hidden;\n mix-blend-mode: darken;\n pointer-events: none;\n}\n\n.aurora__item {\n position: absolute;\n top: -55%;\n left: 0;\n width: 13rem;\n height: 13rem;\n border-radius: 37% 29% 27% 27% \/ 28% 25% 41% 37%;\n filter: blur(1.1rem);\n mix-blend-mode: overlay;\n will-change: transform;\n}\n\n.aurora__item:nth-of-type(1) {\n background-color: var(--c-cyan);\n animation: aurora-border 7s var(--e-in-out) infinite,\n aurora-1 11s var(--e-in-out) infinite alternate;\n}\n.aurora__item:nth-of-type(2) {\n background-color: color-mix(in srgb, var(--c-cyan) 72%, var(--c-white));\n animation: aurora-border 7s var(--e-in-out) infinite,\n aurora-2 14s var(--e-in-out) infinite alternate;\n}\n.aurora__item:nth-of-type(3) {\n background-color: color-mix(in srgb, var(--c-cyan) 62%, var(--c-navy));\n animation: aurora-border 7s var(--e-in-out) infinite,\n aurora-3 9s var(--e-in-out) infinite alternate;\n}\n.aurora__item:nth-of-type(4) {\n background-color: color-mix(in srgb, var(--c-cyan) 88%, var(--c-navy));\n animation: aurora-border 7s var(--e-in-out) infinite,\n aurora-4 17s var(--e-in-out) infinite alternate;\n}\n.aurora--b .aurora__item { animation-delay: -3s, -5s; }\n\n\n\/* ============================================================================\n 5. LAYOUT \u2014 secciones y fondos\n ============================================================================ *\/\n\n\/* El hero es la \u00fanica secci\u00f3n clara del sitio junto a las rupturas de fondo *\/\n.hero { background: var(--c-white); color: var(--c-on-light); }\n.pill { background: var(--c-navy); padding-block: clamp(3rem, 2rem + 3vw, 5rem); border-bottom: 1px solid var(--c-line-soft); }\n\/* isolation en las secciones con aurora: la mezcla darken debe resolverse\n contra el fondo de la propia secci\u00f3n y no contra el orden de pintado global *\/\n.sys { background: var(--c-ink); padding-block: var(--sec-y); isolation: isolate; overflow-x: clip; }\n.reel { background: var(--c-navy); padding-block: var(--sec-y); border-block: 1px solid var(--c-line-soft); }\n.imp { background: var(--c-ink); padding-block: var(--sec-y); isolation: isolate; }\n.conf { background: var(--c-white); color: var(--c-on-light); padding-block: var(--sec-y); }\n.end { background: var(--c-navy); padding-block: var(--sec-y); position: relative; overflow: hidden; }\n\n\/* Cabecera de secci\u00f3n. Junto a .vsl__cap, lo \u00fanico con margen propio. *\/\n.sec__head { max-width: 64ch; margin-bottom: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }\n.sec__title { font-size: var(--t-2xl); letter-spacing: -0.02em; }\n.sec__lead { color: var(--c-dim); max-width: 62ch; }\n.on-light .sec__title { color: var(--c-on-light); }\n.on-light .sec__lead { color: var(--c-on-light-dim); }\n\n.hero__copy, .reel__copy, .conf__copy { min-width: 0; }\n\n\n\/* ============================================================================\n 6. COMPONENTS\n ============================================================================ *\/\n\n\/* ---------- 6.1 Botones ---------- *\/\n\n.btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.6em;\n padding: 0.95em 1.9em;\n background: var(--c-cyan);\n color: var(--c-ink);\n font-weight: 600;\n font-size: var(--t-sm);\n letter-spacing: 0.01em;\n border-radius: var(--r-full);\n border: 1px solid var(--c-cyan);\n position: relative;\n overflow: hidden;\n isolation: isolate;\n transition: transform var(--d-fast) var(--e-out), box-shadow var(--d-mid) var(--e-out);\n animation: btn-bounce 2.4s var(--e-in-out) infinite;\n}\n.btn::before {\n content: \"\";\n position: absolute;\n inset: 0;\n z-index: -1;\n background: var(--c-white);\n transform: translateY(101%);\n transition: transform var(--d-mid) var(--e-out);\n}\n.btn:hover, .btn:focus-visible {\n transform: translateY(-2px);\n box-shadow: 0 10px 34px var(--c-glow);\n animation-play-state: paused;\n}\n.btn:hover::before, .btn:focus-visible::before { transform: translateY(0); }\n.btn:active { transform: translateY(0); }\n\n\/* Latido de color en el mismo comp\u00e1s de 2.4s del rebote. Se excluyen las\n variantes que definen su propio fondo: una animaci\u00f3n de background-color\n gana a las declaraciones normales sea cual sea la especificidad. *\/\n.btn:not(.btn--ghost):not(.btn--dark) {\n animation: btn-bounce 2.4s var(--e-in-out) infinite,\n btn-tint 2.4s var(--e-in-out) infinite;\n}\n.btn:not(.btn--ghost):not(.btn--dark):hover,\n.btn:not(.btn--ghost):not(.btn--dark):focus-visible {\n animation: none;\n background-color: var(--c-cyan);\n border-color: var(--c-cyan);\n}\n\n.btn--ghost {\n background: transparent;\n color: var(--c-white);\n border-color: var(--c-line-hi);\n}\n.btn--ghost::before { background: var(--c-white); }\n.btn--ghost:hover, .btn--ghost:focus-visible { color: var(--c-ink); border-color: var(--c-cyan); }\n\n\/* La variante que manda en el hero claro: sobre blanco, el cian con cortina\n blanca se desvanecer\u00eda al pasar el cursor *\/\n.btn--dark {\n background: var(--c-navy);\n color: var(--c-white);\n border-color: var(--c-navy);\n}\n.btn--dark::before { background: var(--c-ink); }\n.btn--dark:hover, .btn--dark:focus-visible { color: var(--c-cyan); box-shadow: 0 10px 30px color-mix(in srgb, var(--c-navy) 26%, transparent); }\n\n\/* Fantasma sobre claro: el borde y el texto en tinta, la cortina en cian *\/\n.btn--outline {\n background: transparent;\n color: var(--c-on-light);\n border-color: var(--c-on-light-line);\n}\n.btn--outline::before { background: var(--c-cyan); }\n.btn--outline:hover, .btn--outline:focus-visible { color: var(--c-ink); border-color: var(--c-cyan); box-shadow: none; }\n\n.btn--lg { padding: 1.15em 2.6em; font-size: var(--t-md); }\n\n.btn--arrow { padding-left: 1.5em; }\n.btn__arrow {\n width: 1.15em;\n height: 1.15em;\n flex: none;\n display: grid;\n place-items: center;\n margin-right: -0.15em;\n animation: nudge 1.7s var(--e-in-out) infinite;\n}\n.btn__arrow svg { width: 100%; height: 100%; }\n.btn:hover .btn__arrow, .btn:focus-visible .btn__arrow { animation-play-state: paused; transform: translateX(4px); }\n\n\n\/* ---------- 6.5 Paneles de VSL ----------\n Una sola pieza para los dos v\u00eddeos. La proporci\u00f3n es lo \u00fanico que cambia:\n .vsl--v pasa la pantalla a 9:16 y limita el ancho, porque un vertical a\n ancho completo de columna en escritorio medir\u00eda casi dos pantallas de alto.\n -------------------------------------------------------------------------- *\/\n\n.vsl { position: relative; }\n\n.vsl__frame {\n position: relative;\n padding: 14px;\n background: linear-gradient(160deg, var(--c-panel-hi), var(--c-navy) 60%);\n border: 1px solid var(--c-line);\n border-radius: var(--r-lg);\n box-shadow: 0 30px 90px color-mix(in srgb, var(--c-ink) 80%, transparent);\n}\n\/* Sobre blanco la sombra profunda del resto del sitio se ve como una mancha\n sucia: aqu\u00ed se cambia por una m\u00e1s corta y en azul de marca *\/\n.hero .vsl__frame { box-shadow: 0 24px 60px color-mix(in srgb, var(--c-navy) 22%, transparent); }\n\n.vsl__screen {\n position: relative;\n aspect-ratio: 16 \/ 9;\n border-radius: var(--r-md);\n overflow: hidden;\n background:\n radial-gradient(90% 70% at 50% 40%, var(--c-glow-soft), transparent 70%),\n var(--c-ink);\n border: 1px solid var(--c-line-soft);\n}\n\n.vsl--v { max-width: 360px; margin-inline: auto; }\n.vsl--v .vsl__screen { aspect-ratio: 9 \/ 16; }\n\n.vsl__media { width: 100%; height: 100%; object-fit: cover; display: block; }\n\n\/* Ninguno de los dos v\u00eddeos de esta p\u00e1gina lleva sonido, as\u00ed que no lleva capa de\n activaci\u00f3n. Lo que s\u00ed necesita es una forma de detenerlo: es movimiento que\n arranca solo y se repite, y eso pide un control de pausa (WCAG 2.2.2).\n Mismo patr\u00f3n de glifos que el carrusel de cifras de la home. *\/\n.vsl__pause {\n position: absolute;\n bottom: 12px; right: 12px;\n z-index: 3;\n display: inline-flex;\n align-items: center;\n gap: 0.5em;\n padding: 0.45em 0.85em;\n border: 1px solid var(--c-line);\n border-radius: var(--r-full);\n background: color-mix(in srgb, var(--c-ink) 74%, transparent);\n color: var(--c-white);\n letter-spacing: 0.12em;\n cursor: pointer;\n backdrop-filter: blur(6px);\n transition: color var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);\n}\n.vsl__pause:hover { color: var(--c-cyan); border-color: var(--c-line-hi); }\n.vsl__pause::before { content: \"\u275a\u275a\"; font-size: 0.75em; letter-spacing: -0.1em; }\n.vsl__pause::after { content: \"Pausar\"; }\n.vsl__pause[aria-pressed=\"true\"]::before { content: \"\u25b6\"; }\n\/* \"Reproducir\" y no \"Reanudar\": con la carga diferida, la primera vez que\n se ve este bot\u00f3n el v\u00eddeo todav\u00eda no ha empezado nunca. *\/\n.vsl__pause[aria-pressed=\"true\"]::after { content: \"Reproducir\"; }\n\n.vsl__scan {\n position: absolute;\n left: 0; right: 0; top: 0;\n height: 30%;\n background: linear-gradient(to bottom, transparent, var(--c-glow-soft), transparent);\n animation: scan 5.5s var(--e-in-out) infinite;\n pointer-events: none;\n}\n\n.vsl__bracket {\n position: absolute;\n width: 20px; height: 20px;\n border: 1.5px solid var(--c-cyan);\n opacity: 0.85;\n}\n.vsl__bracket--tl { top: -1px; left: -1px; border-right: 0; border-bottom: 0; border-radius: var(--r-lg) 0 0 0; }\n.vsl__bracket--tr { top: -1px; right: -1px; border-left: 0; border-bottom: 0; border-radius: 0 var(--r-lg) 0 0; }\n.vsl__bracket--bl { bottom: -1px; left: -1px; border-right: 0; border-top: 0; border-radius: 0 0 0 var(--r-lg); }\n.vsl__bracket--br { bottom: -1px; right: -1px; border-left: 0; border-top: 0; border-radius: 0 0 var(--r-lg) 0; }\n\n.vsl__rec {\n position: absolute;\n top: 26px; left: 26px;\n display: inline-flex;\n align-items: center;\n gap: 0.5em;\n padding: 0.35em 0.75em;\n background: color-mix(in srgb, var(--c-ink) 72%, transparent);\n border: 1px solid var(--c-line);\n border-radius: var(--r-full);\n color: var(--c-cyan);\n \/* Sin backdrop-filter: la insignia mide 60\u00d724px sobre un fondo de tinta al\n 72% encima de un v\u00eddeo oscuro. El desenfoque no se distingue y cuesta una\n pasada de composici\u00f3n en el hero, que es lo \u00faltimo que conviene encarecer.\n El del bot\u00f3n de pausa s\u00ed se queda: ah\u00ed s\u00ed se lee. *\/\n}\n.vsl__dot {\n width: 6px; height: 6px;\n border-radius: 50%;\n background: var(--c-cyan);\n animation: pulse 2s ease-in-out infinite;\n}\n\n.vsl__cap {\n margin-top: var(--s-4);\n color: var(--c-dimmer);\n text-align: center;\n letter-spacing: 0.08em;\n}\n\/* En el hero el pie va sobre blanco *\/\n.hero .vsl__cap { color: var(--c-on-light-faint); }\n\n\n\/* ---------- 6.3 Hero claro ----------\n Ret\u00edcula de puntos y dos velos de cian. El punto en vez de la l\u00ednea es\n deliberado: sobre claro, la l\u00ednea de 1px del resto del sitio se percibe como\n suciedad de impresi\u00f3n, mientras que el punto se lee como trama.\n -------------------------------------------------------------------------- *\/\n\n.hero {\n position: relative;\n padding-block: clamp(3.5rem, 2rem + 7vw, 7rem) clamp(4rem, 2rem + 6vw, 7rem);\n overflow: hidden;\n isolation: isolate;\n}\n\n.hero__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }\n\n.hero__bg::before {\n content: \"\";\n position: absolute;\n inset: 0;\n background-image: radial-gradient(\n color-mix(in srgb, var(--c-navy) 16%, transparent) 1.4px, transparent 1.4px);\n background-size: 22px 22px;\n mask-image: radial-gradient(110% 80% at 76% 12%, #000 0%, transparent 68%);\n -webkit-mask-image: radial-gradient(110% 80% at 76% 12%, #000 0%, transparent 68%);\n}\n\n.hero__bg::after {\n content: \"\";\n position: absolute;\n inset: -20%;\n background:\n radial-gradient(38% 42% at 84% 10%, color-mix(in srgb, var(--c-cyan) 30%, transparent), transparent 68%),\n radial-gradient(44% 46% at 6% 92%, color-mix(in srgb, var(--c-cyan) 16%, transparent), transparent 70%);\n \/* Sin filter: blur(12px). Era una pasada de desenfoque sobre una caja del\n tama\u00f1o del hero al cargar, y sobre dos degradados que ya se desvanecen al\n 68% y al 70% el resultado es indistinguible. *\/\n}\n\n.hero__grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: clamp(2.5rem, 1rem + 5vw, 4.5rem);\n align-items: center;\n}\n\n.hero__title {\n font-size: clamp(2.15rem, 1.4rem + 3vw, 3.9rem);\n font-weight: 600;\n letter-spacing: -0.035em;\n line-height: var(--lh-tight);\n color: var(--c-on-light);\n}\n\n.hero__lead { max-width: 56ch; color: var(--c-on-light-dim); font-size: var(--t-md); }\n\n\/* Las dos frases de posicionamiento: no son un p\u00e1rrafo m\u00e1s, son la tesis de la\n p\u00e1gina, as\u00ed que van en su propia caja con el riel de acento *\/\n.hero__note {\n display: grid;\n gap: var(--s-2);\n padding: var(--s-4) var(--s-5);\n border: 1px solid var(--c-on-light-line);\n border-left: 3px solid var(--c-cyan);\n border-radius: var(--r-md);\n background: var(--c-on-light-panel);\n}\n.hero__note b { font-weight: 600; color: var(--c-on-light); }\n.hero__note span { color: var(--c-on-light-dim); font-size: var(--t-sm); }\n\n.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4); }\n\n\n\/* ---------- 6.5b Flechas que se\u00f1alan al v\u00eddeo ----------\n Tres galones apilados con una ola de opacidad que viaja de abajo arriba: el\n de abajo enciende primero, as\u00ed el movimiento apunta hacia el v\u00eddeo.\n\n En escritorio giran. Desde 960px .reel__grid es 0.8fr 1.2fr, o sea que el\n v\u00eddeo NO est\u00e1 arriba sino a la izquierda, y unas flechas apuntando al techo\n se\u00f1alar\u00edan al vac\u00edo. La ola se conserva sin tocar los retardos: en columna,\n el hijo 3 es el de abajo; en fila, el de la derecha. En ambos casos el\n primero en encenderse es el m\u00e1s lejano al texto.\n -------------------------------------------------------------------------- *\/\n.upto {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n gap: 1px;\n margin-left: 0.45em;\n vertical-align: middle;\n color: var(--c-cyan);\n}\n.upto svg {\n width: 0.5em;\n height: 0.5em;\n \/* Estado base visible: con \"reducir movimiento\" la animaci\u00f3n desaparece y\n los galones tienen que quedarse legibles, no a media opacidad. *\/\n opacity: 1;\n animation: upto-wave 1.7s var(--e-in-out) infinite;\n}\n.upto svg:nth-child(3) { animation-delay: 0s; }\n.upto svg:nth-child(2) { animation-delay: 0.15s; }\n.upto svg:nth-child(1) { animation-delay: 0.3s; }\n\n@media (min-width: 960px) {\n .upto { flex-direction: row; }\n .upto svg { rotate: -90deg; }\n}\n\n\n\/* ---------- 6.6 Los tres pilares ---------- *\/\n\n.pillars {\n display: grid;\n grid-template-columns: 1fr;\n gap: var(--s-4);\n counter-reset: pilar;\n}\n\n.pillars li {\n position: relative;\n display: grid;\n gap: var(--s-3);\n padding: clamp(1.35rem, 1rem + 1.2vw, 1.9rem);\n padding-top: clamp(2.6rem, 2.1rem + 1.6vw, 3.3rem);\n align-content: start;\n background: linear-gradient(180deg, var(--c-panel-hi), var(--c-panel));\n border: 1px solid var(--c-line);\n border-radius: var(--r-lg);\n box-shadow: 0 1px 0 0 color-mix(in srgb, var(--c-white) 6%, transparent) inset,\n 0 10px 24px -18px rgba(0, 0, 0, 0.9);\n transition: border-color var(--d-mid) var(--e-out), transform var(--d-mid) var(--e-out);\n}\n.pillars li:hover { border-color: var(--c-cyan-dim); transform: translateY(-4px); }\n\n\/* El n\u00famero lo genera un contador: si se a\u00f1ade o quita un pilar, la numeraci\u00f3n\n se recoloca sola y no queda un 04 hu\u00e9rfano en el marcado *\/\n.pillars li::before {\n counter-increment: pilar;\n content: \"0\" counter(pilar);\n position: absolute;\n top: clamp(1.15rem, 0.95rem + 0.6vw, 1.5rem);\n left: clamp(1.35rem, 1rem + 1.2vw, 1.9rem);\n font-family: var(--f-mono);\n font-size: var(--t-xs);\n letter-spacing: 0.16em;\n color: var(--c-cyan);\n}\n\n.pillars h3 { font-size: var(--t-lg); font-weight: 500; letter-spacing: -0.015em; }\n.pillars p { color: var(--c-dim); font-size: var(--t-sm); }\n\n\n\/* ---------- 6.7 El sistema: dos fases y la rejilla que se ordena ----------\n La rejilla es el componente firma de la home: las celdas entran\n desordenadas y se colocan al hacer scroll. Aqu\u00ed lleva los seis elementos.\n -------------------------------------------------------------------------- *\/\n\n.blocks {\n display: grid;\n grid-template-columns: 1fr;\n gap: var(--s-4);\n margin-top: clamp(2rem, 1.4rem + 2vw, 3rem) !important;\n}\n.blocks li {\n display: grid;\n gap: var(--s-3);\n align-content: start;\n padding: clamp(1.35rem, 1rem + 1.2vw, 1.9rem);\n border: 1px solid var(--c-line);\n border-left: 3px solid var(--c-cyan);\n border-radius: var(--r-md);\n background: linear-gradient(150deg, var(--c-glow-soft), transparent 60%), var(--c-panel);\n}\n.blocks h3 { font-size: var(--t-md); font-weight: 600; letter-spacing: -0.01em; }\n.blocks p { color: var(--c-dim); font-size: var(--t-sm); }\n\n.sys__sub {\n margin-top: clamp(3rem, 2rem + 3vw, 5rem);\n display: grid;\n gap: var(--s-5);\n justify-items: start;\n}\n.sys__subtitle { font-size: var(--t-xl); letter-spacing: -0.02em; }\n\n.sys__status {\n display: inline-flex;\n align-items: center;\n gap: 0.7em;\n color: var(--c-cyan);\n letter-spacing: 0.14em;\n}\n.sys__led {\n width: 6px; height: 6px;\n border-radius: 50%;\n background: var(--c-cyan);\n box-shadow: 0 0 0 0 var(--c-glow);\n animation: pulse 2.2s ease-in-out infinite;\n}\n\n.sys__grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: var(--s-4);\n width: 100%;\n}\n\n.sys__cell {\n position: relative;\n padding: clamp(1.35rem, 1rem + 1.4vw, 1.9rem);\n min-height: clamp(120px, 10vw, 155px);\n background: var(--c-panel);\n border: 1px solid var(--c-line-soft);\n border-radius: var(--r-md);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: var(--s-4);\n overflow: hidden;\n transition: border-color var(--d-mid) var(--e-out), background var(--d-mid) var(--e-out);\n}\n.sys__cell::after {\n content: \"\";\n position: absolute;\n right: -30%; bottom: -60%;\n width: 70%; aspect-ratio: 1;\n border-radius: 50%;\n background: radial-gradient(circle, var(--c-glow-soft), transparent 65%);\n opacity: 0;\n transition: opacity var(--d-slow) var(--e-out);\n}\n.sys__cell:hover { border-color: var(--c-line-hi); background: var(--c-panel-hi); }\n.sys__cell:hover::after { opacity: 1; }\n\n.sys__idx { color: var(--c-cyan); letter-spacing: 0.16em; }\n.sys__name { font-size: var(--t-md); font-weight: 500; letter-spacing: -0.015em; }\n\n\n\/* ---------- 6.8 Secci\u00f3n del VSL vertical ---------- *\/\n\n.reel__grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: clamp(2.5rem, 1.5rem + 3vw, 4rem);\n align-items: center;\n}\n\n\n\/* ---------- 6.9 Impacto por tipo de negocio ---------- *\/\n\n.sectors {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));\n gap: var(--s-4);\n min-width: 0;\n}\n\n.sectors li {\n position: relative;\n overflow: hidden;\n display: grid;\n gap: var(--s-3);\n align-content: start;\n padding: clamp(1.4rem, 1rem + 1.3vw, 2rem);\n background: linear-gradient(180deg, var(--c-panel-hi), var(--c-panel));\n border: 1px solid var(--c-line);\n border-radius: var(--r-lg);\n transition: border-color var(--d-mid) var(--e-out), transform var(--d-mid) var(--e-out);\n}\n\/* Riel de acento que crece al acercar el puntero *\/\n.sectors li::before {\n content: \"\";\n position: absolute;\n top: 0; left: 0;\n width: 3px; height: 100%;\n background: var(--c-cyan);\n transform: scaleY(0.001);\n transform-origin: bottom;\n transition: transform var(--d-mid) var(--e-out);\n}\n.sectors li:hover { border-color: var(--c-cyan-dim); transform: translateY(-4px); }\n.sectors li:hover::before { transform: scaleY(1); transform-origin: top; }\n\n.sectors h3 { font-size: var(--t-lg); font-weight: 500; letter-spacing: -0.015em; }\n.sectors p { color: var(--c-dim); font-size: var(--t-sm); }\n\n\n\/* ---------- 6.10 Confidencialidad (fondo claro) ----------\n Las barras tachadas de la home: dicen \"aqu\u00ed hay un nombre que no se\n muestra\" sin necesidad de explicarlo.\n -------------------------------------------------------------------------- *\/\n\n.conf__grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: clamp(2.5rem, 1.5rem + 4vw, 5rem);\n align-items: center;\n}\n\n.conf__title { font-size: var(--t-2xl); letter-spacing: -0.03em; color: var(--c-on-light); }\n\n.conf__list {\n display: grid;\n gap: var(--s-4);\n padding: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);\n border: 1px solid var(--c-on-light-line);\n border-radius: var(--r-lg);\n background: var(--c-on-light-panel);\n}\n.conf__list { padding-inline-start: clamp(1.75rem, 1.2rem + 2vw, 2.75rem) !important; }\n\n.redact {\n display: block;\n width: var(--w, 60%);\n height: 15px;\n border-radius: 3px;\n background: var(--c-cyan);\n position: relative;\n overflow: hidden;\n}\n.redact::after {\n content: \"\";\n position: absolute;\n inset: 0;\n background: linear-gradient(100deg, transparent 20%, color-mix(in srgb, var(--c-white) 55%, transparent) 50%, transparent 80%);\n transform: translateX(-120%);\n animation: shine 4.5s var(--e-in-out) infinite;\n}\n.conf__list li:nth-child(2) .redact::after { animation-delay: 0.3s; }\n.conf__list li:nth-child(3) .redact::after { animation-delay: 0.6s; }\n.conf__list li:nth-child(4) .redact::after { animation-delay: 0.9s; }\n.conf__list li:nth-child(5) .redact::after { animation-delay: 1.2s; }\n.conf__list li:nth-child(6) .redact::after { animation-delay: 1.5s; }\n.conf__list li:nth-child(7) .redact::after { animation-delay: 1.8s; }\n.conf__list li:nth-child(8) .redact::after { animation-delay: 2.1s; }\n\n\n\/* ---------- 6.11 CTA final ---------- *\/\n\n.end::before {\n content: \"\";\n position: absolute;\n bottom: -55%; left: 50%;\n translate: -50% 0;\n width: min(1100px, 130vw);\n aspect-ratio: 1;\n border-radius: 50%;\n background: radial-gradient(circle, var(--c-glow-soft), transparent 62%);\n pointer-events: none;\n}\n\n.end__inner { position: relative; justify-items: center; text-align: center; }\n.end__title { font-size: var(--t-3xl); letter-spacing: -0.04em; line-height: var(--lh-tight); }\n.end__lead { color: var(--c-dim); max-width: 50ch; font-size: var(--t-md); }\n.end__note { color: var(--c-faint); letter-spacing: 0.12em; }\n\n\n\/* ---------- 6.12 Salto de renderizado de la cola ----------\n content-visibility: auto permite al navegador no maquetar ni pintar estas\n secciones hasta que se acercan al viewport. contain-intrinsic-size da una\n altura estimada para que la barra de scroll no salte, y el \"auto\" hace que\n recuerde la medida real una vez calculada.\n\n .imp queda fuera: aloja una aurora y las entradas de .sectors ligadas al\n scroll, y no merece la pena arriesgar ese arranque por unos milisegundos.\n Si ves saltos de scroll, borra este bloque: nada depende de \u00e9l. *\/\n.conf { content-visibility: auto; contain-intrinsic-size: auto 720px; }\n.end { content-visibility: auto; contain-intrinsic-size: auto 620px; }\n\n\n\/* ============================================================================\n 7. ANIMATIONS\n ============================================================================ *\/\n\n@keyframes scan {\n 0% { transform: translateY(-110%); }\n 100% { transform: translateY(430%); }\n}\n\n@keyframes pulse {\n 0%, 100% { box-shadow: 0 0 0 0 var(--c-glow); opacity: 1; }\n 50% { box-shadow: 0 0 0 6px transparent; opacity: 0.55; }\n}\n\n@keyframes shine {\n 0%, 55% { transform: translateX(-120%); }\n 85%, 100% { transform: translateX(120%); }\n}\n\n@keyframes underline-scan {\n 0% { background-position: -45% 0, 0 0; }\n 100% { background-position: 145% 0, 0 0; }\n}\n\n@keyframes aurora-border {\n 0% { border-radius: 37% 29% 27% 27% \/ 28% 25% 41% 37%; }\n 25% { border-radius: 47% 29% 39% 49% \/ 61% 19% 66% 26%; }\n 50% { border-radius: 57% 23% 47% 72% \/ 63% 17% 66% 33%; }\n 75% { border-radius: 28% 49% 29% 100% \/ 93% 20% 64% 25%; }\n 100% { border-radius: 37% 29% 27% 27% \/ 28% 25% 41% 37%; }\n}\n\n@keyframes aurora-1 {\n 0% { transform: translate(-55%, -10%); }\n 50% { transform: translate(45%, 10%); }\n 100% { transform: translate(140%, -6%); }\n}\n@keyframes aurora-2 {\n 0% { transform: translate(130%, 8%); }\n 50% { transform: translate(25%, -11%); }\n 100% { transform: translate(-50%, 4%); }\n}\n@keyframes aurora-3 {\n 0% { transform: translate(35%, -12%); }\n 50% { transform: translate(135%, 9%); }\n 100% { transform: translate(-25%, -4%); }\n}\n@keyframes aurora-4 {\n 0% { transform: translate(95%, 6%); }\n 50% { transform: translate(-45%, -9%); }\n 100% { transform: translate(115%, 11%); }\n}\n\n\/* Sube y se ilumina. El recorrido es de 3px: m\u00e1s que eso, con galones de 0.5em\n el conjunto parece descoserse. *\/\n@keyframes upto-wave {\n 0%, 100% { opacity: 0.22; transform: translateY(3px); }\n 45% { opacity: 1; transform: translateY(-1px); }\n}\n\n@keyframes nudge {\n 0%, 100% { transform: translateX(0); opacity: 0.75; }\n 50% { transform: translateX(5px); opacity: 1; }\n}\n\n@keyframes btn-bounce {\n 0%, 40%, 100% { transform: translateY(0); }\n 20% { transform: translateY(-5px); }\n 30% { transform: translateY(-2px); }\n}\n\n@keyframes btn-tint {\n 0%, 40%, 100% {\n background-color: var(--c-cyan);\n border-color: var(--c-cyan);\n box-shadow: 0 0 0 0 transparent;\n }\n 20% {\n background-color: color-mix(in srgb, var(--c-cyan) 58%, var(--c-white));\n border-color: color-mix(in srgb, var(--c-cyan) 58%, var(--c-white));\n box-shadow: 0 8px 26px var(--c-glow);\n }\n}\n\n\/* --- Mejora progresiva: animaciones ligadas al scroll --- *\/\n@supports (animation-timeline: view()) {\n\n \/* Componente firma: del desorden al orden *\/\n .sys__cell {\n animation: snap linear both;\n animation-timeline: view();\n animation-range: entry 5% cover 42%;\n }\n @keyframes snap {\n from {\n transform: translate(var(--tx, 0), var(--ty, 0)) rotate(var(--rot, 0deg)) scale(0.92);\n opacity: 0.18;\n border-color: transparent;\n filter: saturate(0.2);\n }\n to {\n transform: translate(0, 0) rotate(0deg) scale(1);\n opacity: 1;\n border-color: var(--c-line-soft);\n filter: saturate(1);\n }\n }\n\n .sys__status {\n animation: fade-in linear both;\n animation-timeline: view();\n animation-range: entry 10% cover 30%;\n }\n @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }\n\n .pillars li, .blocks li, .sectors li, .conf__list, .vsl--v {\n animation: rise linear both;\n animation-timeline: view();\n animation-range: entry 0% cover 32%;\n }\n @keyframes rise {\n from { opacity: 0; transform: translateY(24px); }\n to { opacity: 1; transform: translateY(0); }\n }\n}\n\n\n\/* ============================================================================\n 8. RESPONSIVE\n ============================================================================ *\/\n\n@media (min-width: 640px) {\n .pillars { grid-template-columns: repeat(3, 1fr); }\n .blocks { grid-template-columns: repeat(2, 1fr); }\n .sys__grid { grid-template-columns: repeat(2, 1fr); }\n .conf__list { grid-template-columns: repeat(2, 1fr); }\n}\n\n@media (min-width: 960px) {\n .hero__grid { grid-template-columns: 1.02fr 0.98fr; }\n .sys__grid { grid-template-columns: repeat(3, 1fr); }\n .reel__grid { grid-template-columns: 0.8fr 1.2fr; }\n .conf__grid { grid-template-columns: 1.1fr 0.9fr; }\n}\n\n\/* La palabra con aurora no se parte, as\u00ed que en pantallas muy estrechas se baja\n un punto el cuerpo de los titulares que la contienen para que quepa *\/\n@media (max-width: 400px) {\n .sys .sec__title,\n .imp .sec__title { font-size: clamp(1.6rem, 1rem + 3vw, 2rem); }\n}\n\n\n\/* ============================================================================\n 9. PREFERENCIAS\n ============================================================================ *\/\n\n@media (prefers-reduced-motion: reduce) {\n html { scroll-behavior: auto; }\n *, *::before, *::after {\n animation-duration: 0.001ms !important;\n animation-iteration-count: 1 !important;\n animation-delay: 0s !important;\n transition-duration: 0.001ms !important;\n scroll-behavior: auto !important;\n }\n .vsl__scan, .redact::after, .aurora { display: none; }\n .aurora-word { color: var(--c-cyan); }\n .aurora-word::after { animation: none !important; background: var(--c-cyan); }\n .btn, .btn__arrow { animation: none !important; }\n \/* Las celdas nacen colocadas: sin scroll no hay quien las ordene *\/\n .sys__cell { transform: none !important; opacity: 1 !important; filter: none !important; }\n .pillars li, .blocks li, .sectors li, .conf__list, .vsl--v { transform: none !important; opacity: 1 !important; }\n}\n\n@media print {\n .hero__bg, .vsl__scan { display: none; }\n body { background: #fff; color: #000; }\n}\n\n<\/style>\n\n<script type=\"application\/ld+json\">\n{\n \"@context\": \"https:\/\/schema.org\",\n \"@type\": \"WebPage\",\n \"name\": \"Resultados de campa\u00f1as publicitarias\",\n \"url\": \"https:\/\/jpdirector.net\/resultados-de-campanas\/\",\n \"description\": \"Resultados de campa\u00f1as publicitarias presentados por categor\u00eda de negocio: servicios profesionales, salud y est\u00e9tica, empresas de alto volumen y educaci\u00f3n online.\",\n \"publisher\": {\n \"@type\": \"Person\",\n \"name\": \"Jorge P\u00e9rez\",\n \"alternateName\": \"JP Director\",\n \"url\": \"https:\/\/jpdirector.net\/\"\n }\n}\n<\/script>\n<\/head>\n\n<body>\n\n<main id=\"main\">\n\n<!-- ============================================================\n 01. HERO \u2014 fondo claro, VSL horizontal\n ============================================================ -->\n<section class=\"hero on-light\" id=\"inicio\" aria-labelledby=\"hero-title\">\n\n <div class=\"hero__bg\" aria-hidden=\"true\"><\/div>\n\n <div class=\"wrap hero__grid\">\n\n <div class=\"hero__copy stack\">\n <p class=\"sec__mark sec__mark--dark mono\">Resultados<\/p>\n\n <h1 class=\"hero__title\" id=\"hero-title\">\n Resultados de campa\u00f1as <em>publicitarias<\/em>\n <\/h1>\n\n <p class=\"hero__lead\">\n Los resultados que ves aqu\u00ed son el reflejo de un sistema probado, adaptado a\n cada industria y construido sobre decisiones estrat\u00e9gicas, datos y\n ejecuci\u00f3n constante.\n <\/p>\n\n <p class=\"hero__note\">\n <b>No todos los negocios parten del mismo punto.<\/b>\n <span>Por eso, nuestro trabajo comienza sistematizando y luego multiplicando resultados.<\/span>\n <\/p>\n\n <div class=\"hero__actions\">\n <a class=\"btn btn--dark btn--arrow\" href=\"https:\/\/jpdirector.net\/contact\/\"><span class=\"btn__arrow\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"><path d=\"M3.5 12h15\"\/><path d=\"M12.5 5.5 19 12l-6.5 6.5\"\/><\/svg><\/span>Solicita una llamada<\/a>\n <a class=\"btn btn--outline\" href=\"#impacto\">Ver impacto por sector<\/a>\n <\/div>\n <\/div>\n\n <!-- V\u00eddeo horizontal. No lleva sonido, as\u00ed que en lugar de capa de\n activaci\u00f3n va el control de pausa. -->\n <figure class=\"vsl\">\n <div class=\"vsl__frame\">\n <span class=\"vsl__bracket vsl__bracket--tl\" aria-hidden=\"true\"><\/span>\n <span class=\"vsl__bracket vsl__bracket--tr\" aria-hidden=\"true\"><\/span>\n <span class=\"vsl__bracket vsl__bracket--bl\" aria-hidden=\"true\"><\/span>\n <span class=\"vsl__bracket vsl__bracket--br\" aria-hidden=\"true\"><\/span>\n\n <div class=\"vsl__screen\">\n <!-- La URL va en data-src y sin autoplay: el archivo no se pide\n mientras el navegador a\u00fan est\u00e1 analizando el HTML y cargando la\n hoja de estilos y las fuentes. Muy recomendable a\u00f1adir\n poster=\"RUTA\" con el primer fotograma (JPEG o WebP, <60 kb):\n es lo que se ve en el marco durante el instante previo. -->\n <video class=\"vsl__media\" data-reel\n data-src=\"https:\/\/jpdirector.net\/wp-content\/uploads\/2026\/09\/0902.mp4\"\n muted loop playsinline preload=\"none\"\n aria-label=\"C\u00f3mo construimos los resultados que ves en esta p\u00e1gina\"><\/video>\n\n <button class=\"vsl__pause mono\" type=\"button\" aria-pressed=\"false\"\n data-reel-pause aria-label=\"Pausar el v\u00eddeo\"><\/button>\n\n <span class=\"vsl__scan\" aria-hidden=\"true\"><\/span>\n <\/div>\n\n <span class=\"vsl__rec mono\" aria-hidden=\"true\">\n <i class=\"vsl__dot\"><\/i> VSL\n <\/span>\n <\/div>\n <\/figure>\n\n <\/div>\n<\/section>\n\n<!-- ============================================================\n 02. LOS TRES PILARES\n ============================================================ -->\n<section class=\"pill\" aria-labelledby=\"pill-title\">\n <div class=\"wrap\">\n <h2 class=\"vh\" id=\"pill-title\">Sobre qu\u00e9 se apoyan estos resultados<\/h2>\n\n <ol class=\"pillars\">\n <li>\n <h3>Estrategia primero<\/h3>\n <p>\n Definimos objetivos, embudos y m\u00e9tricas antes de invertir un solo\n d\u00f3lar.\n <\/p>\n <\/li>\n <li>\n <h3>Sistemas escalables<\/h3>\n <p>\n Construimos sistemas que permiten crecer de forma sostenida, no campa\u00f1as\n aisladas.\n <\/p>\n <\/li>\n <li>\n <h3>Decisiones basadas en datos<\/h3>\n <p>\n Cada ajuste responde a m\u00e9tricas que impactan el negocio.\n <\/p>\n <\/li>\n <\/ol>\n <\/div>\n<\/section>\n\n<!-- ============================================================\n 03. EL SISTEMA \u2014 dos fases y la rejilla que se ordena\n ============================================================ -->\n<section class=\"sys\" id=\"sistema\" aria-labelledby=\"sys-title\">\n <div class=\"wrap\">\n\n <header class=\"sec__head stack\">\n <p class=\"sec__mark mono\">01 \u00b7 El sistema<\/p>\n <h2 class=\"sec__title\" id=\"sys-title\">\n De campa\u00f1as aisladas a sistemas de <em class=\"aurora-word\">crecimiento<span class=\"aurora\" aria-hidden=\"true\"><i class=\"aurora__item\"><\/i><i class=\"aurora__item\"><\/i><i class=\"aurora__item\"><\/i><i class=\"aurora__item\"><\/i><\/span><\/em>\n <\/h2>\n <p class=\"sec__lead\">\n Cada negocio parte de un contexto distinto: algunos nunca hab\u00edan invertido en\n publicidad digital, otros ya ten\u00edan campa\u00f1as activas pero sin estructura ni\n control de resultados.\n <\/p>\n <p class=\"sec__lead\">\n Nuestro trabajo comienza ordenando, midiendo y sistematizando, antes de escalar.\n <\/p>\n <\/header>\n\n <ol class=\"blocks\">\n <li>\n <h3>Sistematizaci\u00f3n inicial<\/h3>\n <p>Ordenamos campa\u00f1as, mensajes, m\u00e9tricas y procesos antes de escalar inversi\u00f3n.<\/p>\n <\/li>\n <li>\n <h3>Control y optimizaci\u00f3n continua<\/h3>\n <p>Seguimiento, an\u00e1lisis y ajustes constantes para maximizar resultados y objetivos deseados.<\/p>\n <\/li>\n <\/ol>\n\n <div class=\"sys__sub\">\n <h3 class=\"sys__subtitle\">Elementos del sistema de resultados<\/h3>\n <p class=\"sys__status mono\" aria-hidden=\"true\">\n <i class=\"sys__led\"><\/i> Alineando elementos del sistema\n <\/p>\n\n <!-- Las variables --tx, --ty y --rot son el punto de partida desordenado de\n cada celda: la animaci\u00f3n las lleva a cero al hacer scroll. -->\n <ol class=\"sys__grid\">\n <li class=\"sys__cell\" style=\"--tx:-12vw; --ty:4rem; --rot:-9deg\">\n <span class=\"sys__idx mono\">01<\/span>\n <h4 class=\"sys__name\">Objetivos claros<\/h4>\n <\/li>\n <li class=\"sys__cell\" style=\"--tx:9vw; --ty:-5rem; --rot:7deg\">\n <span class=\"sys__idx mono\">02<\/span>\n <h4 class=\"sys__name\">Mensajes alineados al negocio<\/h4>\n <\/li>\n <li class=\"sys__cell\" style=\"--tx:-7vw; --ty:6rem; --rot:10deg\">\n <span class=\"sys__idx mono\">03<\/span>\n <h4 class=\"sys__name\">Embudos definidos<\/h4>\n <\/li>\n <li class=\"sys__cell\" style=\"--tx:11vw; --ty:-4rem; --rot:-6deg\">\n <span class=\"sys__idx mono\">04<\/span>\n <h4 class=\"sys__name\">Seguimiento y automatizaci\u00f3n<\/h4>\n <\/li>\n <li class=\"sys__cell\" style=\"--tx:-10vw; --ty:-6rem; --rot:8deg\">\n <span class=\"sys__idx mono\">05<\/span>\n <h4 class=\"sys__name\">Optimizaci\u00f3n continua<\/h4>\n <\/li>\n <li class=\"sys__cell\" style=\"--tx:8vw; --ty:5rem; --rot:-11deg\">\n <span class=\"sys__idx mono\">06<\/span>\n <h4 class=\"sys__name\">M\u00e9tricas accionables<\/h4>\n <\/li>\n <\/ol>\n <\/div>\n\n <\/div>\n<\/section>\n\n<!-- ============================================================\n 04. VSL VERTICAL\n ============================================================ -->\n<section class=\"reel\" id=\"video\" aria-labelledby=\"reel-title\">\n <div class=\"wrap reel__grid\">\n\n <!-- V\u00eddeo vertical de antes y despu\u00e9s. Tampoco lleva sonido: control de\n pausa en lugar de capa de activaci\u00f3n. -->\n <figure class=\"vsl vsl--v\">\n <div class=\"vsl__frame\">\n <span class=\"vsl__bracket vsl__bracket--tl\" aria-hidden=\"true\"><\/span>\n <span class=\"vsl__bracket vsl__bracket--tr\" aria-hidden=\"true\"><\/span>\n <span class=\"vsl__bracket vsl__bracket--bl\" aria-hidden=\"true\"><\/span>\n <span class=\"vsl__bracket vsl__bracket--br\" aria-hidden=\"true\"><\/span>\n\n <div class=\"vsl__screen\">\n <!-- Este vive bajo la primera pantalla, as\u00ed que no se descarga hasta\n que el visitante se acerca a \u00e9l. Antes se ped\u00eda desde el primer\n momento y compet\u00eda con el v\u00eddeo del hero: eso era el cuello de\n botella en m\u00f3vil. -->\n <video class=\"vsl__media\" data-reel\n data-src=\"https:\/\/jpdirector.net\/wp-content\/uploads\/2026\/02\/RESULTADOS-2026-1.mp4\"\n muted loop playsinline preload=\"none\"\n aria-label=\"V\u00eddeo comparativo de resultados: antes y despu\u00e9s\"><\/video>\n\n <button class=\"vsl__pause mono\" type=\"button\" aria-pressed=\"false\"\n data-reel-pause aria-label=\"Pausar el v\u00eddeo\"><\/button>\n\n <span class=\"vsl__scan\" aria-hidden=\"true\"><\/span>\n <\/div>\n <\/div>\n <figcaption class=\"vsl__cap mono\">Antes y despu\u00e9s \u00b7 sin sonido<\/figcaption>\n <\/figure>\n\n <div class=\"reel__copy stack\">\n <p class=\"sec__mark mono\">02 \u00b7 Antes y despu\u00e9s<\/p>\n <h2 class=\"sec__title\" id=\"reel-title\">Mira estos resultados<span class=\"upto\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"><path d=\"m5 15 7-7 7 7\"\/><\/svg><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"><path d=\"m5 15 7-7 7 7\"\/><\/svg><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"><path d=\"m5 15 7-7 7 7\"\/><\/svg><\/span><\/h2>\n <p class=\"sec__lead\">\n La misma cuenta, antes y despu\u00e9s de ordenarla. Sin narraci\u00f3n: solo lo que\n cambia cuando las campa\u00f1as dejan de ser esfuerzos aislados.\n <\/p>\n <a class=\"btn btn--arrow\" href=\"https:\/\/jpdirector.net\/contact\/\"><span class=\"btn__arrow\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"><path d=\"M3.5 12h15\"\/><path d=\"M12.5 5.5 19 12l-6.5 6.5\"\/><\/svg><\/span>Solicita una llamada<\/a>\n <\/div>\n\n <\/div>\n<\/section>\n\n<!-- ============================================================\n 05. IMPACTO POR TIPO DE NEGOCIO\n ============================================================ -->\n<section class=\"imp\" id=\"impacto\" aria-labelledby=\"imp-title\">\n <div class=\"wrap\">\n\n <header class=\"sec__head stack\">\n <p class=\"sec__mark mono\">03 \u00b7 Impacto<\/p>\n <h2 class=\"sec__title\" id=\"imp-title\">\n Impacto por tipo de <em class=\"aurora-word\">negocio<span class=\"aurora aurora--b\" aria-hidden=\"true\"><i class=\"aurora__item\"><\/i><i class=\"aurora__item\"><\/i><i class=\"aurora__item\"><\/i><i class=\"aurora__item\"><\/i><\/span><\/em>\n <\/h2>\n <p class=\"sec__lead\">\n Aunque pertenecen a sectores muy distintos, todos estos casos comparten una\n misma base estrat\u00e9gica y un sistema dise\u00f1ado para escalar con control.\n <\/p>\n <\/header>\n\n <ul class=\"sectors\">\n\n <li>\n <h3>Servicios profesionales<\/h3>\n <p>\n Empresas de impuestos, seguros, limpieza, fotograf\u00eda, oratoria y entrenamiento\n personal multiplicaron su volumen de clientes con procesos claros de captaci\u00f3n\n y seguimiento.\n <\/p>\n <\/li>\n\n <li>\n <h3>Salud y est\u00e9tica<\/h3>\n <p>\n Med Spas, odont\u00f3logos y cirujanos pasaron del boca a boca a generar pacientes\n nuevos de forma constante, respetando regulaciones y comportamiento del\n paciente.\n <\/p>\n <\/li>\n\n <li>\n <h3>Empresas de alto volumen<\/h3>\n <p>\n Negocios con alta facturaci\u00f3n escalaron ventas priorizando rentabilidad y\n control sobre volumen sin estructura.\n <\/p>\n <\/li>\n\n <li>\n <h3>Educaci\u00f3n y formaci\u00f3n online<\/h3>\n <p>\n Academias digitales transformaron su flujo de leads con sistemas dise\u00f1ados\n para crecer sin sacrificar calidad.\n <\/p>\n <\/li>\n\n <\/ul>\n <\/div>\n<\/section>\n\n<!-- ============================================================\n 06. AVISO DE CONFIDENCIALIDAD \u2014 ruptura de fondo\n ============================================================ -->\n<section class=\"conf on-light\" aria-labelledby=\"conf-title\">\n <div class=\"wrap conf__grid\">\n\n <div class=\"conf__copy stack\">\n <p class=\"sec__mark sec__mark--dark mono\">04 \u00b7 Confidencialidad<\/p>\n <h2 class=\"conf__title\" id=\"conf-title\">\n Muchos de nuestros clientes prefieren mantener su identidad <em>en reserva<\/em>\n <\/h2>\n <p class=\"sec__lead\">\n Para nosotros, eso no es una limitaci\u00f3n, sino una muestra de la confianza que\n depositan en nuestro trabajo.\n <\/p>\n <p class=\"sec__lead\">\n Por eso presentamos resultados por categor\u00eda y no por nombre.\n <\/p>\n <a class=\"btn btn--dark\" href=\"https:\/\/jpdirector.net\/contact\/\">Solicita una llamada<\/a>\n <\/div>\n\n <ul class=\"conf__list\" aria-hidden=\"true\">\n <li><span class=\"redact\" style=\"--w:74%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:52%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:88%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:41%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:66%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:79%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:35%\"><\/span><\/li>\n <li><span class=\"redact\" style=\"--w:60%\"><\/span><\/li>\n <\/ul>\n\n <\/div>\n<\/section>\n\n<!-- ============================================================\n 07. CTA FINAL\n ============================================================ -->\n<section class=\"end\" id=\"contacto\" aria-labelledby=\"end-title\">\n <div class=\"wrap end__inner stack stack--loose\">\n <p class=\"eyebrow\">[ Siguiente paso ]<\/p>\n <h2 class=\"end__title\" id=\"end-title\">\n \u00bfD\u00f3nde est\u00e1 tu <em>punto de partida<\/em>?\n <\/h2>\n <p class=\"end__lead\">\n Cu\u00e9ntanos c\u00f3mo est\u00e1 tu publicidad hoy y te decimos qu\u00e9 toca ordenar antes de\n escalar.\n <\/p>\n <a class=\"btn btn--lg btn--arrow\" href=\"https:\/\/jpdirector.net\/contact\/\"><span class=\"btn__arrow\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"><path d=\"M3.5 12h15\"\/><path d=\"M12.5 5.5 19 12l-6.5 6.5\"\/><\/svg><\/span>Solicita una llamada<\/a>\n <p class=\"end__note mono\">Respuesta directa del equipo de JP Director<\/p>\n <\/div>\n<\/section>\n\n<\/main>\n\n<!-- ============================================================\n \u00danico script del documento. Hace tres cosas que CSS no puede:\n decidir CU\u00c1NDO se descarga cada v\u00eddeo, pausar el que se va de\n pantalla, y ofrecer el control de pausa que exige la pauta\n WCAG 2.2.2 para el movimiento que arranca solo.\n ============================================================ -->\n<script>\n(function () {\n var videos = Array.prototype.slice.call(document.querySelectorAll('[data-reel]'));\n if (!videos.length) return;\n\n var menosMovimiento = window.matchMedia &&\n window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n\n \/\/ En una conexi\u00f3n lenta o con ahorro de datos activado, dos v\u00eddeos en bucle\n \/\/ son varios megas que nadie ha pedido. No se descargan: los arranca el bot\u00f3n.\n var con = navigator.connection || {};\n var ahorro = con.saveData === true ||\n \/^(slow-2g|2g|3g)$\/.test(con.effectiveType || '');\n var arranqueManual = menosMovimiento || ahorro;\n\n function pintar(b, pausado) {\n b.setAttribute('aria-pressed', pausado ? 'true' : 'false');\n b.setAttribute('aria-label', pausado ? 'Reproducir el v\u00eddeo' : 'Pausar el v\u00eddeo');\n }\n\n videos.forEach(function (v) {\n var panel = v.closest('.vsl');\n var b = panel && panel.querySelector('[data-reel-pause]');\n if (!b) return;\n\n v._boton = b;\n \/\/ Distingue \"lo par\u00e9 yo\" de \"se paus\u00f3 al salir de pantalla\": sin esta\n \/\/ marca, un v\u00eddeo pausado a mano volver\u00eda a arrancar solo al hacer scroll.\n v._pausaDelUsuario = false;\n pintar(b, true);\n\n v._cargar = function () {\n if (!v.src && v.dataset.src) { v.src = v.dataset.src; }\n };\n\n v._reproducir = function () {\n v._cargar();\n var p = v.play();\n if (p && p.catch) { p.catch(function () { pintar(b, true); }); }\n };\n\n b.addEventListener('click', function () {\n if (v.paused) {\n v._pausaDelUsuario = false;\n v._reproducir();\n } else {\n v._pausaDelUsuario = true;\n v.pause();\n }\n });\n\n v.addEventListener('play', function () { pintar(b, false); });\n v.addEventListener('pause', function () { pintar(b, true); });\n });\n\n if (!('IntersectionObserver' in window)) {\n if (!arranqueManual) { videos.forEach(function (v) { v._reproducir(); }); }\n return;\n }\n\n var obs = new IntersectionObserver(function (entradas) {\n entradas.forEach(function (e) {\n var v = e.target;\n if (e.isIntersecting) {\n if (arranqueManual || v._pausaDelUsuario) return;\n v._reproducir();\n } else if (!v.paused) {\n \/\/ Un v\u00eddeo fuera de pantalla que sigue decodificando en bucle gasta\n \/\/ CPU y bater\u00eda sin que nadie lo vea. Al volver se reanuda solo,\n \/\/ porque esta pausa no la pidi\u00f3 el visitante.\n v.pause();\n v._pausaDelUsuario = false;\n }\n });\n \/\/ 200px de margen: el v\u00eddeo empieza a cargar justo antes de asomar, as\u00ed\n \/\/ llega con imagen en cuanto entra y no aparece un marco vac\u00edo.\n }, { rootMargin: '200px 0px', threshold: 0.01 });\n\n videos.forEach(function (v) { obs.observe(v); });\n})();\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\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":{"_gspb_post_css":".gspb_container-id-gsbp-489257e{flex-direction:column;box-sizing:border-box}#gspb_container-id-gsbp-489257e.gspb_container>p:last-of-type{margin-bottom:0}#gspb_container-id-gsbp-489257e.gspb_container{position:relative;box-sizing:border-box}","footnotes":""},"class_list":["post-4350","page","type-page","status-publish","hentry"],"blocksy_meta":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Casos de \u00c9xito en Publicidad Digital y Ads | JP Director<\/title>\n<meta name=\"description\" content=\"Descubre c\u00f3mo transformamos campa\u00f1as aisladas en sistemas de ventas rentables. Casos de \u00e9xito reales en distintas industrias con JP Director\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jpdirector.net\/en\/resultados-de-campanas\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Casos de \u00c9xito en Publicidad Digital y Ads | JP Director\" \/>\n<meta property=\"og:description\" content=\"Descubre c\u00f3mo transformamos campa\u00f1as aisladas en sistemas de ventas rentables. Casos de \u00e9xito reales en distintas industrias con JP Director\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jpdirector.net\/en\/resultados-de-campanas\/\" \/>\n<meta property=\"og:site_name\" content=\"JP Director\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/jpdirector\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-10T21:59:45+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/jpdirector.net\\\/resultados-de-campanas\\\/\",\"url\":\"https:\\\/\\\/jpdirector.net\\\/resultados-de-campanas\\\/\",\"name\":\"Casos de \u00c9xito en Publicidad Digital y Ads | JP Director\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/jpdirector.net\\\/#website\"},\"datePublished\":\"2026-09-04T20:33:26+00:00\",\"dateModified\":\"2026-09-10T21:59:45+00:00\",\"description\":\"Descubre c\u00f3mo transformamos campa\u00f1as aisladas en sistemas de ventas rentables. Casos de \u00e9xito reales en distintas industrias con JP Director\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/jpdirector.net\\\/resultados-de-campanas\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/jpdirector.net\\\/resultados-de-campanas\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/jpdirector.net\\\/resultados-de-campanas\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/jpdirector.net\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Resultados\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/jpdirector.net\\\/#website\",\"url\":\"https:\\\/\\\/jpdirector.net\\\/\",\"name\":\"JP Director\",\"description\":\"JP Director\",\"publisher\":{\"@id\":\"https:\\\/\\\/jpdirector.net\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/jpdirector.net\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/jpdirector.net\\\/#organization\",\"name\":\"JP Director\",\"url\":\"https:\\\/\\\/jpdirector.net\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/jpdirector.net\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/jpdirector.net\\\/wp-content\\\/uploads\\\/2025\\\/10\\\/Logo-home-08-1.png\",\"contentUrl\":\"https:\\\/\\\/jpdirector.net\\\/wp-content\\\/uploads\\\/2025\\\/10\\\/Logo-home-08-1.png\",\"width\":330,\"height\":76,\"caption\":\"JP Director\"},\"image\":{\"@id\":\"https:\\\/\\\/jpdirector.net\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/jpdirector\",\"https:\\\/\\\/www.instagram.com\\\/jp.director\\\/?hl=en\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/jpdirector\\\/?locale=en_US\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Casos de \u00c9xito en Publicidad Digital y Ads | JP Director","description":"Descubre c\u00f3mo transformamos campa\u00f1as aisladas en sistemas de ventas rentables. Casos de \u00e9xito reales en distintas industrias con JP Director","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jpdirector.net\/en\/resultados-de-campanas\/","og_locale":"en_US","og_type":"article","og_title":"Casos de \u00c9xito en Publicidad Digital y Ads | JP Director","og_description":"Descubre c\u00f3mo transformamos campa\u00f1as aisladas en sistemas de ventas rentables. Casos de \u00e9xito reales en distintas industrias con JP Director","og_url":"https:\/\/jpdirector.net\/en\/resultados-de-campanas\/","og_site_name":"JP Director","article_publisher":"https:\/\/www.facebook.com\/jpdirector","article_modified_time":"2026-09-10T21:59:45+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/jpdirector.net\/resultados-de-campanas\/","url":"https:\/\/jpdirector.net\/resultados-de-campanas\/","name":"Casos de \u00c9xito en Publicidad Digital y Ads | JP Director","isPartOf":{"@id":"https:\/\/jpdirector.net\/#website"},"datePublished":"2026-09-04T20:33:26+00:00","dateModified":"2026-09-10T21:59:45+00:00","description":"Descubre c\u00f3mo transformamos campa\u00f1as aisladas en sistemas de ventas rentables. Casos de \u00e9xito reales en distintas industrias con JP Director","breadcrumb":{"@id":"https:\/\/jpdirector.net\/resultados-de-campanas\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jpdirector.net\/resultados-de-campanas\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jpdirector.net\/resultados-de-campanas\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/jpdirector.net\/"},{"@type":"ListItem","position":2,"name":"Resultados"}]},{"@type":"WebSite","@id":"https:\/\/jpdirector.net\/#website","url":"https:\/\/jpdirector.net\/","name":"JP Director","description":"JP Director","publisher":{"@id":"https:\/\/jpdirector.net\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jpdirector.net\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jpdirector.net\/#organization","name":"JP Director","url":"https:\/\/jpdirector.net\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jpdirector.net\/#\/schema\/logo\/image\/","url":"https:\/\/jpdirector.net\/wp-content\/uploads\/2025\/10\/Logo-home-08-1.png","contentUrl":"https:\/\/jpdirector.net\/wp-content\/uploads\/2025\/10\/Logo-home-08-1.png","width":330,"height":76,"caption":"JP Director"},"image":{"@id":"https:\/\/jpdirector.net\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/jpdirector","https:\/\/www.instagram.com\/jp.director\/?hl=en","https:\/\/www.linkedin.com\/in\/jpdirector\/?locale=en_US"]}]}},"_links":{"self":[{"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/pages\/4350","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/comments?post=4350"}],"version-history":[{"count":3,"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/pages\/4350\/revisions"}],"predecessor-version":[{"id":4438,"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/pages\/4350\/revisions\/4438"}],"wp:attachment":[{"href":"https:\/\/jpdirector.net\/en\/wp-json\/wp\/v2\/media?parent=4350"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}