{"id":5882,"date":"2025-11-18T07:12:57","date_gmt":"2025-11-18T07:12:57","guid":{"rendered":"https:\/\/www.yalpro.com\/home-espanol\/"},"modified":"2025-11-18T07:27:04","modified_gmt":"2025-11-18T07:27:04","slug":"home-espanol","status":"publish","type":"page","link":"https:\/\/www.yalpro.com\/es\/home-espanol\/","title":{"rendered":"Home &#8211; Espa\u00f1ol"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"5882\" class=\"elementor elementor-5882\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f66f17d e-con-full e-flex e-con e-parent\" data-id=\"f66f17d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-bd3cae4 e-con-full e-flex e-con e-child\" data-id=\"bd3cae4\" data-element_type=\"container\" data-e-type=\"container\" id=\"column1\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f61658 ylp-text elementor-widget elementor-widget-html\" data-id=\"8f61658\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n\/* ===== Portrait phones (<=767px) ===== *\/\r\n@media (max-width: 767px){\r\n  \/* put text + CTA + socials first *\/\r\n  #column1{ order:1; flex:0 0 100%; max-width:100%; z-index:4; }\r\n\r\n  \/* carousel columns below *\/\r\n  #column2, #column3, #column4{\r\n    order:3; margin-top:16px; z-index:1;\r\n    flex:0 0 calc(33.333% - 10px); max-width:calc(33.333% - 10px);\r\n  }\r\n\r\n  \/* make sure CTA & socials can never be hidden *\/\r\n  #ylp-hero .elementor-widget-button,\r\n  #ylp-hero .ylp-socials{\r\n    display:block !important; visibility:visible !important;\r\n  }\r\n\r\n  \/* small spacing *\/\r\n  #ylp-hero .elementor-widget-button{ margin-top:16px; }\r\n  #ylp-hero .ylp-socials{ margin-top:12px; }\r\n}\r\n\r\n\/* keep desktop\/tablet overlap tight *\/\r\n@media (min-width: 768px){\r\n  :root{ --h-gap:-7px; }\r\n  #column3, #column4{ margin-left: var(--h-gap) !important; }\r\n}\r\n<\/style>\r\n\r\n\r\n\r\n<!-- YALPRO \u2014 Build & scroll reels inside #column2\/#column3\/#column4 -->\r\n<style>\r\n  :root{\r\n    --col-w: 200px;    \/* column width (desktop) *\/\r\n    --ph:    233px;    \/* each image frame height *\/\r\n    --v-gap: 5px;      \/* vertical gap between images *\/\r\n    --h-gap: -14px;     \/* horizontal gap between columns (negative = overlap) *\/\r\n  }\r\n\r\n  \/* Size\/clip only the three columns *\/\r\n  #column2, #column3, #column4{\r\n    width: var(--col-w);\r\n    height: calc(3 * var(--ph) + 2 * var(--v-gap));   \/* \u2248699px window *\/\r\n    max-height: calc(3 * var(--ph) + 2 * var(--v-gap));\r\n    overflow: hidden;\r\n    position: relative;\r\n  }\r\n  \/* fake column gap *\/\r\n  #column3{ margin-left: var(--h-gap); }\r\n  #column4{ margin-left: var(--h-gap); }\r\n\r\n  \/* Reel stack created by JS *\/\r\n  #column2 .reel, #column3 .reel, #column4 .reel{\r\n    display:flex; flex-direction:column; gap:var(--v-gap);\r\n    will-change: transform; backface-visibility:hidden; transform: translate3d(0,0,0);\r\n  }\r\n  #column2 .reel img, #column3 .reel img, #column4 .reel img{\r\n    display:block; width:100%; height:var(--ph); object-fit:contain; margin:0; border:0;\r\n    pointer-events:none;\r\n  }\r\n\r\n  \/* Responsive *\/\r\n  @media (max-width:1024px){ :root{ --col-w:160px; --ph:210px; } }\r\n  @media (max-width:767px) { :root{ --col-w:120px; --ph:180px; --h-gap:-6px; } }\r\n  @media (max-width:360px) { :root{ --col-w:100px;  --ph:150px; --h-gap:-5px; } }\r\n<\/style>\r\n\r\n<script>\r\n\/* Build images from arrays + RAF seamless scroll (\u2191 = +speed, \u2193 = -speed) *\/\r\n(function(){\r\n  const DATA = {\r\n    column2: [\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-71.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-1.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-77.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-64.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-72.jpg\"\r\n    ],\r\n    column3: [\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-70.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-66.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-76.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-63.png\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-73.jpg\"\r\n    ],\r\n    column4: [\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-69.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-67.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-75.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-65.jpg\",\r\n      \"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Ivory-Green-Minimalist-Phone-Mockup-Mood-Board-Beauty-Pinterest-Pin-74.jpg\"\r\n    ]\r\n  };\r\n\r\n  function createReel(col){\r\n    \/\/ clear old\r\n    col.querySelectorAll('.reel').forEach(n=>n.remove());\r\n    const reel = document.createElement('div');\r\n    reel.className = 'reel';\r\n    (DATA[col.id] || []).forEach(src=>{\r\n      const img = document.createElement('img'); img.src = src; img.alt = '';\r\n      reel.appendChild(img);\r\n    });\r\n    col.appendChild(reel);\r\n    return reel;\r\n  }\r\n\r\n  function dupOnce(reel){\r\n    if (reel.dataset.duped === '1') return;\r\n    [...reel.children].forEach(k => reel.appendChild(k.cloneNode(true)));\r\n    reel.dataset.duped = '1';\r\n  }\r\n\r\n  function whenReady(imgs){\r\n    if (!imgs.length) return Promise.resolve();\r\n    let n=0; return new Promise(res=>{\r\n      imgs.forEach(img=>{\r\n        if (img.complete) { if(++n===imgs.length) res(); }\r\n        else {\r\n          img.addEventListener('load',  ()=>{ if(++n===imgs.length) res(); }, {once:true});\r\n          img.addEventListener('error', ()=>{ if(++n===imgs.length) res(); }, {once:true});\r\n        }\r\n      });\r\n    });\r\n  }\r\n\r\n  function init(col, speed){\r\n    const reel = createReel(col);\r\n    if (!reel) return;\r\n    dupOnce(reel);\r\n\r\n    const st = { y:0, half:0, speed };\r\n    function measure(){ st.half = reel.scrollHeight\/2 || 1; st.y = ((st.y%st.half)+st.half)%st.half; apply(); }\r\n    function apply(){ reel.style.transform = `translate3d(0, ${-st.y}px, 0)`; }\r\n\r\n    let last = performance.now();\r\n    function tick(now){\r\n      const dt = (now-last)\/1000; last = now;\r\n      if (window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches)\r\n        return requestAnimationFrame(tick);\r\n      st.y += st.speed * dt; while(st.y>=st.half) st.y-=st.half; while(st.y<0) st.y+=st.half;\r\n      apply(); requestAnimationFrame(tick);\r\n    }\r\n\r\n    whenReady([...reel.querySelectorAll('img')]).then(()=>{\r\n      measure();\r\n      let t; window.addEventListener('resize', ()=>{ clearTimeout(t); t=setTimeout(measure,120); });\r\n      requestAnimationFrame(tick);\r\n    });\r\n  }\r\n\r\n  document.addEventListener('DOMContentLoaded', ()=>{\r\n    const c2 = document.getElementById('column2');\r\n    const c3 = document.getElementById('column3');\r\n    const c4 = document.getElementById('column4');\r\n    if (c2) init(c2,  24);   \/\/ up\r\n    if (c3) init(c3, -22);   \/\/ down\r\n    if (c4) init(c4,  24);   \/\/ up\r\n  });\r\n})();\r\n<\/script>\r\n\r\n<style>\r\n  \/* force tight columns *\/\r\n  :root{ --h-gap: -67px; }           \/* or --col-overlap: -7px if that var is in your code *\/\r\n  #column3, #column4{ margin-left: var(--h-gap) !important; }\r\n\r\n  \/* safety: remove any column padding\/gap from Elementor *\/\r\n  #column2, #column3, #column4{ padding:0 !important; }\r\n  @media (max-width:767px){ :root{ --h-gap:-6px; } }  \/* optional mobile *\/\r\n<\/style>\r\n\r\n<style>\r\n\/* ===== YALPRO \u2014 Column edge fade (pro + fallback) ===== *\/\r\n:root{\r\n  --fade-h: 44px;               \/* fade height on top\/bottom *\/\r\n  --fade-bg: #0e1726;           \/* page\/hero bg color (fallback overlay) *\/\r\n}\r\n\r\n\/* 1) Primary: mask fade (best quality) *\/\r\n#column2, #column3, #column4{\r\n  position: relative;                         \/* already there, keep it *\/\r\n  -webkit-mask-image: linear-gradient(\r\n      to bottom,\r\n      transparent 0,\r\n      #000 var(--fade-h),\r\n      #000 calc(100% - var(--fade-h)),\r\n      transparent 100%\r\n  );\r\n          mask-image: linear-gradient(\r\n      to bottom,\r\n      transparent 0,\r\n      #000 var(--fade-h),\r\n      #000 calc(100% - var(--fade-h)),\r\n      transparent 100%\r\n  );\r\n  -webkit-mask-size: 100% 100%;\r\n          mask-size: 100% 100%;\r\n  -webkit-mask-repeat: no-repeat;\r\n          mask-repeat: no-repeat;\r\n}\r\n\r\n\/* 2) Fallback overlay for older browsers (kept super light) *\/\r\n#column2::before, #column2::after,\r\n#column3::before, #column3::after,\r\n#column4::before, #column4::after{\r\n  content:\"\";\r\n  position:absolute; left:0; right:0; z-index:3; pointer-events:none;\r\n  display:block;\r\n}\r\n#column2::before, #column3::before, #column4::before{\r\n  top:0; height:var(--fade-h);\r\n  background: linear-gradient(to bottom, var(--fade-bg) 0%, rgba(14,23,38,0) 100%);\r\n}\r\n#column2::after, #column3::after, #column4::after{\r\n  bottom:0; height:var(--fade-h);\r\n  background: linear-gradient(to top, var(--fade-bg) 0%, rgba(14,23,38,0) 100%);\r\n}\r\n\r\n\/* 3) Mobile tweak: slightly smaller fade if you like *\/\r\n@media (max-width: 767px){\r\n  :root{ --fade-h: 36px; }\r\n}\r\n<\/style>\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n<section id=\"ylp-hero\" class=\"ylp-hero on-image\" role=\"banner\" aria-labelledby=\"ylp-hero-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\">\r\n    <h2 id=\"ylp-hero-title\" class=\"ylp-title\">\r\n      <span class=\"line line1\"><span class=\"ylp-motion\">Y<\/span>our<\/span>\r\n      <span class=\"line line2\"><span class=\"ylp-motion\">A<\/span>ccelerated<\/span>\r\n      <span class=\"line line3\"><span class=\"ylp-motion\">L<\/span>eads for <span class=\"ylp-motion pro\"><\/span><\/span>\r\n        <span class=\"ylp-motion pro\">Pro<\/span>fessionals.<\/span>\r\n      <span class=\"line line4\">Your Digital Edge.<\/span>\r\n    <\/h2>\r\n\r\n    <p class=\"ylp-tagline\">Impulsando negocios locales en J\u00e1vea, D\u00e9nia, Moraira y alrededores.<\/p>\r\n\r\n    <p class=\"ylp-desc\">\r\n      En Yalpro, ayudamos a las peque\u00f1as empresas a prosperar. Lo hacemos con sitios web atractivos, generando clientes a trav\u00e9s de Instagram y Facebook, y captando nuevos clientes (leads). Ahora, incorporamos automatizaciones impulsadas por IA que trabajan para ti 24\/7. Esto significa que convertimos las visitas en clientes, los clientes potenciales en reservas y de esta manera, te ahorramos horas de trabajo cada semana.\r\n    <\/p>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== HERO (scoped) \u2014 transparent background ===== *\/\r\n#ylp-hero[data-ylp-lock]{\r\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  margin:0; padding:0;\r\n}\r\n#ylp-hero .ylp-wrap{\r\n  max-width: 980px; margin: 0 auto; padding: 56px 16px 40px;\r\n  text-align: left; \/* left aligned *\/\r\n}\r\n\r\n\/* Colors over image *\/\r\n#ylp-hero.on-image{ --text:#fff; --muted:rgba(255,255,255,.92); --accent-1:#22c55e; --accent-2:#60a5fa; --accent-3:#f43f5e; }\r\n\r\n\/* Title *\/\r\n#ylp-hero .ylp-title{\r\n  color: var(--text); margin:0;\r\n  line-height:1.15; letter-spacing:-0.02em;\r\n  font-weight:800; font-size:clamp(34px,5vw,64px);\r\n  text-shadow: 0 2px 10px rgba(0,0,0,.35);\r\n  opacity:0; transform:translateY(14px); animation: ylpFadeUp .8s ease-out .05s forwards;\r\n}\r\n#ylp-hero .ylp-title .line{ display:block; margin-top:6px; }\r\n\r\n\/* Highlighted motion letters *\/\r\n#ylp-hero .ylp-motion{\r\n  display:inline;\r\n  background:linear-gradient(90deg,var(--accent-1),var(--accent-2));\r\n  -webkit-background-clip:text; background-clip:text; color:transparent;\r\n  background-size:200% 100%;\r\n  animation: ylpSheen 2.5s ease-in-out infinite alternate, ylpGlow 2.5s ease-in-out infinite alternate;\r\n}\r\n#ylp-hero .ylp-motion.pro{\r\n  background:linear-gradient(90deg,var(--accent-3),var(--accent-2));\r\n  -webkit-background-clip:text; background-clip:text; color:transparent;\r\n}\r\n\r\n\/* Gradient text for \"Your Digital Edge.\" *\/\r\n#ylp-hero .ylp-title .line4{\r\n  background:linear-gradient(90deg,var(--accent-1),var(--accent-2));\r\n  -webkit-background-clip:text; background-clip:text; color:transparent;\r\n  background-size:200% 100%;\r\n  text-shadow:none;\r\n  animation: ylpSheen 2.4s ease .45s both, ylpHue 6s linear .45s infinite alternate;\r\n}\r\n\r\n\/* Divider line *\/\r\n#ylp-hero .ylp-title::after{\r\n  content:\"\"; display:block; width:clamp(120px,18vw,220px); height:3px; margin:16px 0;\r\n  border-radius:999px; background:linear-gradient(90deg,var(--accent-1),var(--accent-2)); opacity:.9;\r\n}\r\n\r\n\/* Tagline \u2014 PURPLE + motion *\/\r\n#ylp-hero .ylp-tagline{\r\n  margin:22px 0 0; font-weight:700; font-size:clamp(18px,2.4vw,28px);\r\n  background:linear-gradient(90deg,#a855f7,#7c3aed,#a855f7);\r\n  -webkit-background-clip:text; background-clip:text; color:transparent; display:inline-block;\r\n  background-size:200% 100%;\r\n  text-shadow:none;\r\n  opacity:0; transform:translateY(14px);\r\n  \/* fade-up + animated sheen + subtle hue shift *\/\r\n  animation:\r\n    ylpFadeUp .8s ease .3s forwards,\r\n    ylpSheen 3s ease-in-out .9s infinite alternate,\r\n    ylpHue 8s linear .9s infinite alternate;\r\n}\r\n\r\n\/* Description *\/\r\n#ylp-hero .ylp-desc{\r\n  margin:22px 0 0; max-width:720px; color:var(--muted);\r\n  line-height:1.65; font-size:clamp(15px,1.8vw,20px); font-weight:450; letter-spacing:.01em;\r\n  text-shadow: 0 2px 8px rgba(0,0,0,.35);\r\n  opacity:0; transform:translateY(14px); animation: ylpFadeUp .8s ease .55s forwards;\r\n}\r\n\r\n\/* Animations *\/\r\n@keyframes ylpFadeUp{to{opacity:1; transform:translateY(0)}}\r\n@keyframes ylpSheen{0%{background-position:0% 50%}100%{background-position:100% 50%}}\r\n@keyframes ylpHue{0%{filter:hue-rotate(0)}100%{filter:hue-rotate(10deg)}}\r\n@keyframes ylpGlow{\r\n  0%{ text-shadow: 0 0 0 rgba(255,255,255,0.0); }\r\n  100%{ text-shadow: 0 0 14px rgba(255,255,255,0.4); }\r\n}\r\n\r\n\/* Reduced motion *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  #ylp-hero .ylp-title, #ylp-hero .ylp-motion, #ylp-hero .ylp-tagline, #ylp-hero .ylp-desc{\r\n    animation:none !important; opacity:1 !important; transform:none !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ad8e833 elementor-align-left e-transform ylp-cta elementor-invisible elementor-widget elementor-widget-button\" data-id=\"ad8e833\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInUp&quot;,&quot;_animation_delay&quot;:0.1,&quot;_transform_scale_effect_hover&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:1.02,&quot;sizes&quot;:[]},&quot;_transform_scale_effect_hover_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_scale_effect_hover_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm elementor-animation-grow\" href=\"https:\/\/wa.me\/34623057355\" target=\"_blank\" rel=\"noopener\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Iniciar conversaci\u00f3n de WhatsApp<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-baca753 ylp-socials elementor-widget elementor-widget-html\" data-id=\"baca753\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Social Media Channels (hover = grow + glow, NOT clickable) -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\"\/>\r\n\r\n<section class=\"ylp-social\" aria-labelledby=\"ylp-social-title\">\r\n  <h2 id=\"ylp-social-title\">Canales de Redes Sociales con los que trabajamos<\/h2>\r\n\r\n  <div class=\"ylp-icons\">\r\n    <span class=\"ylp-icon fb\" role=\"img\" aria-label=\"Facebook\"><i class=\"fab fa-facebook-f\"><\/i><\/span>\r\n    <span class=\"ylp-icon ig\" role=\"img\" aria-label=\"Instagram\"><i class=\"fab fa-instagram\"><\/i><\/span>\r\n    <span class=\"ylp-icon li\" role=\"img\" aria-label=\"LinkedIn\"><i class=\"fab fa-linkedin-in\"><\/i><\/span>\r\n    <span class=\"ylp-icon tt\" role=\"img\" aria-label=\"TikTok\"><i class=\"fab fa-tiktok\"><\/i><\/span>\r\n    <span class=\"ylp-icon pin\" role=\"img\" aria-label=\"Pinterest\"><i class=\"fab fa-pinterest-p\"><\/i><\/span>\r\n    <span class=\"ylp-icon google\" role=\"img\" aria-label=\"Google\"><i class=\"fab fa-google\"><\/i><\/span>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* --- Container --- *\/\r\n.ylp-social{ text-align:left; margin-top:20px; }\r\n.ylp-social h2{ font-size:18px; font-weight:600; margin:0 0 18px; color:#fff; }\r\n.ylp-icons{ display:flex; align-items:center; }\r\n\r\n\/* spacing (no CSS gap for max compatibility) *\/\r\n.ylp-icons .ylp-icon + .ylp-icon{ margin-left:16px; }\r\n\r\n\/* --- Base icon pill --- *\/\r\n.ylp-icon{\r\n  position:relative;\r\n  display:inline-flex; align-items:center; justify-content:center;\r\n  width:46px; height:46px; border-radius:50%;\r\n  background:#ffffff; color:#1a1a1a;\r\n  box-shadow:0 4px 14px rgba(0,0,0,.16);\r\n  transition: transform .22s ease, box-shadow .22s ease, background-color .22s ease, color .22s ease;\r\n  -webkit-tap-highlight-color:transparent;\r\n  cursor: default;                \/* not a link *\/\r\n  user-select: none;\r\n}\r\n.ylp-icon i{ color:inherit; font-size:18px; line-height:1; }\r\n\r\n\/* Glow ring *\/\r\n.ylp-icon::after{\r\n  content:\"\";\r\n  position:absolute; inset:-4px; border-radius:inherit; pointer-events:none;\r\n  box-shadow:0 0 0 0 rgba(255,255,255,0);\r\n  transition: box-shadow .28s ease, transform .28s ease, opacity .28s ease;\r\n  opacity:0; transform: scale(.92);\r\n}\r\n\r\n\/* Desktop hover = grow + glow *\/\r\n@media (hover:hover) and (pointer:fine){\r\n  .ylp-icon:hover{\r\n    transform: scale(1.12);\r\n    box-shadow:0 10px 28px rgba(0,0,0,.28);\r\n  }\r\n  .ylp-icon:hover::after{\r\n    opacity:1; transform: scale(1.05);\r\n  }\r\n}\r\n\r\n\/* Touch feedback *\/\r\n@media (hover:none) and (pointer:coarse){\r\n  .ylp-icon:active{ transform: scale(.96); box-shadow:0 6px 18px rgba(0,0,0,.24); }\r\n}\r\n\r\n\/* Brand hover fills + matching glow *\/\r\n.ylp-icon.fb:hover{ background:#1877f2; color:#fff; }\r\n.ylp-icon.fb:hover::after{ box-shadow:0 0 16px 4px rgba(24,119,242,.45); }\r\n\r\n.ylp-icon.ig:hover{ background:#e1306c; color:#fff; }\r\n.ylp-icon.ig:hover::after{ box-shadow:0 0 16px 4px rgba(225,48,108,.45); }\r\n\r\n.ylp-icon.li:hover{ background:#0077b5; color:#fff; }\r\n.ylp-icon.li:hover::after{ box-shadow:0 0 16px 4px rgba(0,119,181,.45); }\r\n\r\n.ylp-icon.tt:hover{ background:#000; color:#fff; }\r\n.ylp-icon.tt:hover::after{ box-shadow:0 0 16px 4px rgba(0,0,0,.45); }\r\n\r\n.ylp-icon.pin:hover{ background:#bd081c; color:#fff; }\r\n.ylp-icon.pin:hover::after{ box-shadow:0 0 16px 4px rgba(189,8,28,.45); }\r\n\r\n.ylp-icon.google:hover{ background:#4285f4; color:#fff; }\r\n.ylp-icon.google:hover::after{ box-shadow:0 0 16px 4px rgba(66,133,244,.45); }\r\n<\/style>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-740b40c e-con-full reel reel-1 e-flex e-con e-child\" data-id=\"740b40c\" data-element_type=\"container\" data-e-type=\"container\" id=\"column2\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-27bd67d e-con-full reel reel-2 e-flex e-con e-child\" data-id=\"27bd67d\" data-element_type=\"container\" data-e-type=\"container\" id=\"column3\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9227db8 e-con-full reel reel-3 e-flex e-con e-child\" data-id=\"9227db8\" data-element_type=\"container\" data-e-type=\"container\" id=\"column4\">\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-22938b1 e-flex e-con-boxed e-con e-parent\" data-id=\"22938b1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5cce361 elementor-widget elementor-widget-html\" data-id=\"5cce361\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- PRICING HEADER + LIMITED-TIME OFFER (Scoped, premium) -->\r\n<section id=\"ylp-pricing-head\" class=\"ylp-ph\" aria-labelledby=\"ylp-ph-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\">\r\n\r\n    <!-- Heading -->\r\n    <h2 id=\"ylp-ph-title\" class=\"ylp-title ylp-reveal\">\r\n      <span class=\"light\">Simples Planes Mensuales <\/span>\r\n      <span class=\"accent-sheen\">Cancela cuando quieras<\/span>\r\n    <\/h2>\r\n\r\n    <!-- Sub -->\r\n    <p class=\"ylp-sub ylp-reveal\">\r\n      Elige el plan que se adapta a tu negocio. Todos los planes incluyen\r\n      <strong>Facebook + Instagram<\/strong> posts.\r\n    <\/p>\r\n\r\n    <!-- OFFER Banner -->\r\n    <div class=\"ylp-coupon ylp-reveal\" role=\"note\" aria-label=\"C\u00f3digo promocional\">\r\n      <!-- Badge -->\r\n      <div class=\"ylp-coupon-badge\">\r\n        <!-- Sparkle icon -->\r\n        <svg class=\"spark\" width=\"16\" height=\"16\" viewbox=\"0 0 24 24\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M12 2l1.8 4.3L18 8l-4.2 1.7L12 14l-1.8-4.3L6 8l4.2-1.7L12 2Zm7 9l.9 2.1L22 14l-2.1.9L19 17l-.9-2.1L16 14l2.1-.9L19 11ZM5 16l1.2 2.8L9 20l-2.8 1.2L5 24l-1.2-2.8L1 20l2.8-1.2L5 16Z\"\/><\/svg>\r\n        Solo esta semana\r\n      <\/div>\r\n\r\n      <div class=\"ylp-coupon-main\">\r\n        <span class=\"label\">Pruebe Plan De Crecimiento esta semana por tan solo<\/span>\r\n\r\n        <!-- Prices -->\r\n        <span class=\"old\" aria-label=\"Precio normal\">\u20ac249<\/span>\r\n        <span class=\"arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n        <span class=\"price\" aria-label=\"Precio de oferta\">\u20ac99<\/span>\r\n        \r\n\r\n        <!-- Save chip -->\r\n        <span class=\"save\">Ahorra 150<\/span>\r\n\r\n       \r\n\r\n        <!-- Code + Copy -->\r\n        \r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Scoped to #ylp-pricing-head only ===== *\/\r\n#ylp-pricing-head[data-ylp-lock]{\r\n  --ink:#111827; --white:#fff;\r\n  --blue:#60a5fa; --green:#22c55e;\r\n  --accent:#ffd166;\r\n\r\n  \/* Offer panel *\/\r\n  --coupon-top: rgba(34,197,94,.18);\r\n  --coupon-bot: rgba(96,165,250,.18);\r\n  --coupon-stroke: rgba(96,165,250,.45);\r\n\r\n  \/* Chip style *\/\r\n  --chip-bg: #11111110;\r\n  --chip-stroke: var(--coupon-stroke);\r\n\r\n  \/* Badge gradient *\/\r\n  --badge-grad: linear-gradient(90deg, rgba(34,197,94,.95), rgba(96,165,250,.95));\r\n\r\n  font-family: \"Inter\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  margin:0; padding:0;\r\n}\r\n#ylp-pricing-head .ylp-wrap{ max-width:1100px; margin:0 auto; padding:32px 16px 12px; text-align:center; }\r\n\r\n\/* Heading *\/\r\n#ylp-pricing-head .ylp-title{\r\n  margin:0 0 8px; line-height:1.06; letter-spacing:-0.02em;\r\n  font-weight:800; font-size:clamp(28px,4.8vw,56px); color:var(--white);\r\n  text-wrap:balance; filter: drop-shadow(0 2px 16px rgba(0,0,0,.35));\r\n}\r\n#ylp-pricing-head .ylp-title .accent-sheen{\r\n  background: linear-gradient(90deg, var(--green), var(--blue));\r\n  -webkit-background-clip:text; background-clip:text; color:transparent;\r\n  display:inline-block; background-size:200% 100%;\r\n  animation: sheen 2.4s ease .4s both, hue 6s linear .4s infinite alternate;\r\n}\r\n\r\n\/* Paragraph *\/\r\n#ylp-pricing-head .ylp-sub{\r\n  margin:12px auto 22px; max-width:900px;\r\n  color:var(--white); opacity:.92;\r\n  font-size:clamp(15px,2vw,20px); line-height:1.6;\r\n}\r\n\r\n\/* Coupon Banner *\/\r\n#ylp-pricing-head .ylp-coupon{\r\n  position:relative;\r\n  display:grid; gap:10px; justify-items:center;\r\n  background: linear-gradient(180deg, var(--coupon-top), var(--coupon-bot));\r\n  border:1px solid var(--coupon-stroke);\r\n  box-shadow: 0 12px 32px rgba(12,15,25,.12);\r\n  border-radius:18px; padding:18px 18px;\r\n  width:min(920px, 100%); margin:0 auto;\r\n  overflow:hidden;\r\n}\r\n#ylp-pricing-head .ylp-coupon::after{\r\n  \/* soft glow behind price *\/\r\n  content:\"\"; position:absolute; inset:auto -20% -40px -20%;\r\n  height:120px; background:radial-gradient(60% 90% at 50% 50%, rgba(255,255,255,.18), transparent 60%);\r\n  filter:blur(18px); pointer-events:none;\r\n}\r\n\r\n\/* Badge *\/\r\n#ylp-pricing-head .ylp-coupon-badge{\r\n  display:inline-flex; align-items:center; gap:8px;\r\n  background: var(--badge-grad);\r\n  color:#0b1120;\r\n  padding:6px 12px; border-radius:999px; font-weight:800; font-size:12.5px; letter-spacing:.04em;\r\n  box-shadow: 0 10px 22px rgba(0,0,0,.25);\r\n  animation: floaty 3.2s ease-in-out infinite;\r\n}\r\n#ylp-pricing-head .spark{ filter:drop-shadow(0 2px 6px rgba(0,0,0,.25)); }\r\n\r\n\/* Main line *\/\r\n#ylp-pricing-head .ylp-coupon-main{\r\n  display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; justify-content:center;\r\n  color:var(--white); font-size:clamp(15px,2vw,18px);\r\n}\r\n#ylp-pricing-head .ylp-coupon-main .label{ opacity:.95; }\r\n\r\n\/* Prices *\/\r\n#ylp-pricing-head .old{\r\n  position:relative; color:#e5e7eb; opacity:.55;\r\n  font-weight:800; font-size:clamp(18px,3.3vw,24px);\r\n}\r\n#ylp-pricing-head .old::after{\r\n  content:\"\"; position:absolute; left:-4px; right:-4px; top:50%;\r\n  height:2px; background:linear-gradient(90deg, transparent, #e5e7eb, transparent);\r\n  transform:rotate(-6deg);\r\n}\r\n#ylp-pricing-head .arrow{ opacity:.6; font-weight:800; }\r\n#ylp-pricing-head .price{\r\n  position:relative;\r\n  font-weight:900; font-size:clamp(26px,5vw,42px); letter-spacing:-.02em; color:#ffffff;\r\n}\r\n#ylp-pricing-head .price::before{\r\n  \/* shine swipe *\/\r\n  content:\"\"; position:absolute; inset:-4px -10px; transform:skewX(-18deg) translateX(-120%);\r\n  background:linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);\r\n  animation: shineSwipe 3.8s ease-in-out 1.2s infinite;\r\n}\r\n\r\n\/* Save chip *\/\r\n#ylp-pricing-head .save{\r\n  display:inline-block; padding:.28em .7em; border-radius:999px;\r\n  background:rgba(255,255,255,.12); border:1px dashed rgba(255,255,255,.35);\r\n  font-weight:800; letter-spacing:.02em; white-space:nowrap;\r\n  box-shadow:0 8px 18px rgba(0,0,0,.18);\r\n}\r\n\r\n\/* Code + Copy *\/\r\n#ylp-pricing-head .code-wrap{ display:inline-flex; align-items:center; gap:8px; }\r\n#ylp-pricing-head .code{\r\n  background:#0b1220; color:#fff; border-radius:10px; padding:6px 10px;\r\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace;\r\n  box-shadow: 0 6px 18px rgba(0,0,0,.18);\r\n}\r\n#ylp-pricing-head .copy{\r\n  display:inline-flex; align-items:center; gap:6px;\r\n  background:#0b1220; color:#fff; border:none; cursor:pointer;\r\n  border-radius:10px; padding:6px 10px; font-weight:700; font-size:13px;\r\n  box-shadow: 0 10px 18px rgba(0,0,0,.22);\r\n  transition: transform .15s ease, box-shadow .15s ease, background .25s ease;\r\n}\r\n#ylp-pricing-head .copy:hover{ transform: translateY(-1px); box-shadow: 0 14px 22px rgba(0,0,0,.25); }\r\n#ylp-pricing-head .copy:active{ transform: translateY(0); }\r\n\r\n\/* Reveal on scroll *\/\r\n.ylp-reveal{ opacity:0; transform: translateY(14px) scale(.98); }\r\n.ylp-reveal.ylp-in{ opacity:1; transform: none; transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }\r\n\r\n\/* Animations *\/\r\n@keyframes sheen{0%{background-position:0% 50%}100%{background-position:100% 50%}}\r\n@keyframes hue{0%{filter:hue-rotate(0)}100%{filter:hue-rotate(10deg)}}\r\n@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}\r\n@keyframes shineSwipe{0%{transform:skewX(-18deg) translateX(-120%)}60%{transform:skewX(-18deg) translateX(120%)}100%{transform:skewX(-18deg) translateX(120%)}}\r\n\r\n\/* Mobile *\/\r\n@media (max-width:600px){\r\n  #ylp-pricing-head .ylp-wrap{ padding:26px 14px 10px; }\r\n  #ylp-pricing-head .save{ display:none; } \/* keep it clean on small screens *\/\r\n}\r\n\r\n\/* Reduced motion *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  .ylp-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }\r\n  #ylp-pricing-head .ylp-title .accent-sheen{ animation:none !important; }\r\n  #ylp-pricing-head .ylp-coupon-badge{ animation:none !important; }\r\n  #ylp-pricing-head .price::before{ display:none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* Copy to clipboard with feedback *\/\r\n(function(){\r\n  const btn = document.querySelector('#ylp-pricing-head .copy');\r\n  if(!btn) return;\r\n  btn.addEventListener('click', function(){\r\n    const target = document.querySelector(this.dataset.copy);\r\n    if(!target) return;\r\n    const text = target.textContent.trim();\r\n    navigator.clipboard?.writeText(text).then(()=>{\r\n      const label = this.querySelector('.copy-label');\r\n      const old = label.textContent;\r\n      label.textContent = 'Copied!';\r\n      this.classList.add('copied');\r\n      setTimeout(()=>{ label.textContent = old; this.classList.remove('copied'); }, 1200);\r\n    });\r\n  });\r\n})();\r\n\r\n\/* Scroll-in reveal *\/\r\n(function(){\r\n  const items = document.querySelectorAll('#ylp-pricing-head .ylp-reveal');\r\n  if(!('IntersectionObserver' in window)){ items.forEach(el=>el.classList.add('ylp-in')); return; }\r\n  const io = new IntersectionObserver((entries)=>{\r\n    entries.forEach(e=>{ if(e.isIntersecting){ e.target.classList.add('ylp-in'); io.unobserve(e.target); }});\r\n  }, {threshold: .15});\r\n  items.forEach(el=>io.observe(el));\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1a918ec elementor-widget elementor-widget-html\" data-id=\"1a918ec\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro Pricing 3-Column (Starter \/ Growth \/ Pro) \u2014 card-click + button-click navigate -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@500;700;800&family=Poppins:wght@500;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n<section id=\"pricing\" class=\"ylp-pricing\" aria-label=\"Planes Yalpro\">\r\n  <!-- Column 1: Starter -->\r\n  <div class=\"plan-col\">\r\n    <div class=\"plan-card starter\">\r\n      <h2>Presencia inicial<\/h2>\r\n      <p class=\"price\">\u20ac99<span>\/mes<\/span><\/p>\r\n      <p class=\"subline\">Ideal para negocios nuevos que quieren tener presencia constante.<\/p>\r\n      <ul class=\"features\">\r\n        <li>Facebook + Instagram<\/li>\r\n        <li>10 publicaciones al mes<\/li>\r\n        <li>Instant\u00e1nea de an\u00e1lisis b\u00e1sicos<\/li>\r\n        <li>Optimizaci\u00f3n de perfiles (FB + IG)<\/li>\r\n        <li>Una ronda de revisiones por lote de contenido.<\/li>\r\n      <\/ul>\r\n      <div class=\"btnwrap\">\r\n        <a class=\"btn btn-gradient\" href=\"https:\/\/www.yalpro.com\/es\/starter-select-services\/\" aria-label=\"Elegir la presencia inicial\">Elegir Plan B\u00e1sico<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Column 2: Growth -->\r\n  <div class=\"plan-col\">\r\n    <div class=\"plan-card growth\">\r\n      <div class=\"badge\">\u2b50 M\u00e1s Popular \u2b50<\/div>\r\n      <h2>Plan De Crecimiento<\/h2>\r\n      <p class=\"price promo\">\r\n  <span class=\"old\">\u20ac249<\/span>\r\n  <span class=\"arrow\">\u2192<\/span>\r\n  <span class=\"new\">\u20ac99<\/span><span class=\"per\">\/mes<\/span>\r\n<\/p>\r\n<p class=\"offer-note\" aria-live=\"polite\">\r\n  <span class=\"ico\" aria-hidden=\"true\">\r\n    <!-- % icon -->\r\n    \r\n  <\/span>\r\n  <span>Solo esta semana<\/span>\r\n  <span class=\"save-chip\" aria-label=\"Ahorra un 60\">60% de descuento<\/span>\r\n<\/p>\r\n\r\n\r\n\r\n      <p class=\"subline\">Para negocios en crecimiento que buscan m\u00e1s interacci\u00f3n y visibilidad.<\/p>\r\n      <ul class=\"features\">\r\n        <li>5 publicaciones a la semana (1 Reel, 1 Carrusel y 3 im\u00e1genes)<\/li>\r\n        \r\n        <li>Optimizaci\u00f3n de perfiles (FB + IG)<\/li>\r\n        <li>Informe elaborado de resultados<\/li>\r\n        <li>Asistencia continua<\/li>\r\n        <li>Llamada mensual de seguimiento<\/li>\r\n      <\/ul>\r\n      <div class=\"btnwrap\">\r\n        <a class=\"btn btn-gradient\" href=\"https:\/\/www.yalpro.com\/es\/growth-builder-select-services\/\" aria-label=\"Elija el generador de crecimiento\">Elegir Plan de Crecimiento<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Column 3: Pro -->\r\n  <div class=\"plan-col\">\r\n    <div class=\"plan-card pro\">\r\n      <h2>Clientes potenciales<\/h2>\r\n      <p class=\"price\">\u20ac495<span>\/mes<\/span><\/p>\r\n      <p class=\"subline\">Para empresas que buscan crecer r\u00e1pidamente con anuncios pagados y procesos de automatizaci\u00f3n.<\/p>\r\n      <ul class=\"features\">\r\n        <li>Incluye Plan de Crecimiento<\/li>\r\n        <li>Gesti\u00f3n de campa\u00f1as Meta Ads (FB + IG)<\/li>\r\n        <li>Informe mensual de publicidad+ sesi\u00f3n de estrategia<\/li>\r\n        <li>Asistencia prioritaria<\/li>\r\n        <li>Enfocado en resultados<\/li>\r\n      <\/ul>\r\n      <div class=\"btnwrap\">\r\n        <a class=\"btn btn-gradient\" href=\"https:\/\/www.yalpro.com\/es\/pro-leads-select-services\/\" aria-label=\"Elegir Pro Leads\">Elegir Pro Leads<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ====== Layout: container + responsive calc fix ====== *\/\r\n#pricing.ylp-pricing{\r\n  display:flex; flex-wrap:wrap; justify-content:center; align-items:stretch;\r\n  gap:24px; max-width:1400px; margin:0 auto; padding:40px 16px;\r\n  box-sizing:border-box;\r\n}\r\n#pricing .plan-col{ display:flex; }\r\n\r\n\/* Desktop\/Laptop \u2265992px \u2192 3 columns *\/\r\n@media (min-width:992px){\r\n  #pricing .plan-col{\r\n    flex:0 0 calc((100% - 48px)\/3) !important;\r\n    max-width:calc((100% - 48px)\/3) !important;\r\n  }\r\n}\r\n\/* Tablet 600\u2013991px \u2192 2 columns *\/\r\n@media (max-width:991px) and (min-width:600px){\r\n  #pricing .plan-col{\r\n    flex:0 0 calc((100% - 24px)\/2) !important;\r\n    max-width:calc((100% - 24px)\/2) !important;\r\n  }\r\n}\r\n\/* Mobile <600px \u2192 1 column *\/\r\n@media (max-width:599px){\r\n  #pricing .plan-col{ flex:0 0 100% !important; max-width:100% !important; }\r\n}\r\n\r\n\/* ====== Base Card ====== *\/\r\n#pricing .plan-card{\r\n  display:flex; flex-direction:column; height:100%;\r\n  border-radius:20px; box-shadow:0 20px 40px rgba(0,0,0,.08);\r\n  padding:32px 26px; width:100%;\r\n  filter:none !important; opacity:1 !important;\r\n  cursor:pointer;                    \/* whole card looks clickable *\/\r\n  position:relative;\r\n}\r\n#pricing .plan-card:focus-within,\r\n#pricing .plan-card[aria-current=\"true\"]{ outline:3px solid rgba(96,165,250,.55); outline-offset:2px; }\r\n#pricing .plan-card:hover{ box-shadow:0 26px 54px rgba(0,0,0,.12); }\r\n#pricing .plan-card .btnwrap{ margin-top:auto; padding-top:14px; }\r\n#pricing .plan-card .btn{\r\n  display:inline-block; width:100%; text-align:center; text-decoration:none;\r\n  padding:12px 20px; border-radius:10px; font-weight:800; letter-spacing:.01em;\r\n  background:#111827; color:#fff; box-shadow:0 10px 20px rgba(0,0,0,.12);\r\n  pointer-events:auto;               \/* button remains clickable *\/\r\n}\r\n\r\n\/* ====== Animated Gradient CTA ====== *\/\r\n#pricing .plan-card .btn.btn-gradient{\r\n  color:#0b1220 !important;\r\n  background:linear-gradient(90deg,#60a5fa 0%,#22c55e 100%) !important;\r\n  border:1px solid rgba(255,255,255,.18);\r\n  background-size:200% 200%;\r\n  animation: ylp-pillShift 6s ease infinite;\r\n  box-shadow:0 10px 22px rgba(34,197,94,.28), inset 0 1px 0 rgba(255,255,255,.45);\r\n  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;\r\n}\r\n#pricing .plan-card .btn.btn-gradient:hover{\r\n  transform:translateY(-2px);\r\n  filter:saturate(1.08) brightness(1.02);\r\n  box-shadow:0 16px 36px rgba(34,197,94,.40), inset 0 1px 0 rgba(255,255,255,.55);\r\n}\r\n#pricing .plan-card .btn.btn-gradient:active{ transform:translateY(0); }\r\n#pricing .plan-card .btn.btn-gradient:focus-visible{ outline:2px solid #fff; outline-offset:2px; }\r\n@keyframes ylp-pillShift{\r\n  0%{   background-position:0% 50%; }\r\n  50%{  background-position:100% 50%; }\r\n  100%{ background-position:0% 50%; }\r\n}\r\n@media (prefers-reduced-motion: reduce){\r\n  #pricing .plan-card .btn.btn-gradient{ animation:none; }\r\n}\r\n\r\n\/* ====== Starter (solid black text) ====== *\/\r\n#pricing .plan-card.starter{\r\n  background:#ffffff; color:#0b1220 !important;\r\n  font-family:\"Plus Jakarta Sans\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n}\r\n#pricing .plan-card.starter h2,\r\n#pricing .plan-card.starter .price,\r\n#pricing .plan-card.starter .features li{ color:#0b1220 !important; text-shadow:none; }\r\n#pricing .plan-card.starter h2{ font-size:30px; font-weight:800; margin:0 0 8px; }\r\n#pricing .plan-card.starter .price{ font-size:34px; font-weight:800; margin:0 0 8px; }\r\n#pricing .plan-card.starter .price span{ font-size:16px; font-weight:600; }\r\n#pricing .plan-card.starter .subline{\r\n  color:#334155; font-size:18px; line-height:1.55; margin:10px auto 18px; max-width:520px;\r\n}\r\n#pricing .plan-card.starter .features{\r\n  list-style:none; padding:0; margin:0 0 10px; display:grid; gap:10px; text-align:left;\r\n}\r\n#pricing .plan-card.starter .features li{\r\n  font-size:17px; font-weight:600; padding-left:28px; position:relative;\r\n}\r\n#pricing .plan-card.starter .features li::before{\r\n  content:\"\"; width:18px; height:18px; position:absolute; left:0; top:3px;\r\n  background:url(\"data:image\/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' fill='none' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23059669' fill-opacity='0.12'\/%3E%3Cpath d='M8.5 12.5l2.2 2.2 4.8-5.2' stroke='%23059669' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'\/%3E%3C\/svg%3E\") no-repeat center\/contain;\r\n}\r\n\/* --- Promo price (249 -> 99) --- *\/\r\n#pricing .plan-card.growth .price.promo{\r\n  display:flex; align-items:baseline; justify-content:center; gap:10px;\r\n  margin:0 0 10px; color:#fff;\r\n}\r\n#pricing .plan-card.growth .price.promo .old{\r\n  position:relative; font-weight:800; font-size:22px; color:rgba(255,255,255,.65);\r\n}\r\n#pricing .plan-card.growth .price.promo .old::after{\r\n  content:\"\"; position:absolute; left:-6px; right:-6px; top:50%;\r\n  height:2px; background:linear-gradient(90deg,transparent,#e5e7eb,transparent);\r\n  transform:rotate(-8deg);\r\n}\r\n#pricing .plan-card.growth .price.promo .arrow{\r\n  opacity:.7; font-weight:800;\r\n}\r\n#pricing .plan-card.growth .price.promo .new{\r\n  font-weight:900; font-size:36px; letter-spacing:-.02em; color:#fff;\r\n}\r\n#pricing .plan-card.growth .price.promo .per{\r\n  font-size:16px; font-weight:600; opacity:.95; margin-left:4px;\r\n}\r\n\r\n\/* --- Offer note (bold + hover effects) --- *\/\r\n#pricing .plan-card.growth .offer-note{\r\n  display:inline-block; font-weight:900; letter-spacing:.2px;\r\n  color:#0b1220; background:linear-gradient(90deg,#60a5fa,#22c55e);\r\n  padding:8px 14px; border-radius:999px; box-shadow:0 10px 22px rgba(0,0,0,.18);\r\n  border:1px solid rgba(255,255,255,.28);\r\n  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;\r\n}\r\n#pricing .plan-card.growth .offer-note:hover{\r\n  transform:translateY(-2px);\r\n  filter:saturate(1.05) brightness(1.02);\r\n  box-shadow:0 16px 36px rgba(0,0,0,.25);\r\n}\r\n\r\n\/* Mobile tweak: reduce new price size a bit *\/\r\n@media (max-width:599px){\r\n  #pricing .plan-card.growth .price.promo .new{ font-size:32px; }\r\n}\r\n\r\n\/* ---- Premium Offer Pill ---- *\/\r\n#pricing .plan-card.growth .offer-note{\r\n  display:inline-flex; align-items:center; gap:10px;\r\n  font-weight:900; letter-spacing:.2px; color:#0b1220;\r\n  \/* Gradient pill that *moves* on hover *\/\r\n  background:linear-gradient(90deg,#7dd3fc,#34d399);\r\n  background-size:200% 100%;\r\n  padding:10px 18px; border-radius:999px;\r\n  border:1px solid rgba(255,255,255,.28);\r\n  box-shadow:0 10px 22px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.45);\r\n  position:relative; isolation:isolate;\r\n  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, background-position .5s ease;\r\n}\r\n\r\n\/* Shine sweep *\/\r\n#pricing .plan-card.growth .offer-note::after{\r\n  content:\"\"; position:absolute; inset:-2px; border-radius:inherit;\r\n  background:linear-gradient(90deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);\r\n  transform:skewX(-20deg) translateX(-120%);\r\n  transition:transform .6s ease;\r\n  pointer-events:none; z-index:0;\r\n}\r\n#pricing .plan-card.growth .offer-note:hover{\r\n  transform:translateY(-2px);\r\n  background-position:100% 0%;\r\n  box-shadow:0 16px 36px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.6);\r\n  filter:saturate(1.06) brightness(1.02);\r\n}\r\n#pricing .plan-card.growth .offer-note:hover::after{\r\n  transform:skewX(-20deg) translateX(120%);\r\n}\r\n\r\n\/* Icon + text layering *\/\r\n#pricing .plan-card.growth .offer-note .ico{ display:inline-flex; align-items:center; opacity:.9; }\r\n#pricing .plan-card.growth .offer-note > *{ position:relative; z-index:1; }\r\n\r\n\/* Optional \u201cSave 60%\u201d chip *\/\r\n#pricing .plan-card.growth .offer-note .save-chip{\r\n  display:inline-block; font-weight:800; font-size:12px;\r\n  color:#fff; background:rgba(11,18,32,.28);\r\n  border:1px dashed rgba(255,255,255,.6);\r\n  padding:4px 8px; border-radius:999px;\r\n}\r\n\r\n\/* Color variants (pick one by swapping gradient) *\/\r\n\/* Calm green: linear-gradient(90deg,#86efac,#22c55e) *\/\r\n\/* Urgency orange: linear-gradient(90deg,#fca5a5,#fb923c) *\/\r\n\/* Finance blue\/green (current): linear-gradient(90deg,#7dd3fc,#34d399) *\/\r\n\r\n@media (prefers-reduced-motion: reduce){\r\n  #pricing .plan-card.growth .offer-note,\r\n  #pricing .plan-card.growth .offer-note::after{ transition:none !important; }\r\n}\r\n\/* ===== Premium Offer Pill \u2014 heartbeat + hover shine ===== *\/\r\n#pricing .plan-card.growth .offer-note{\r\n  display:inline-flex; align-items:center; gap:12px;\r\n  font-weight:900; letter-spacing:.2px; color:#0b1220;\r\n  background:linear-gradient(90deg,#7dd3fc,#34d399); \/* blue\u2192green (trust) *\/\r\n  background-size:200% 100%;\r\n  padding:12px 20px; border-radius:999px;\r\n  border:1px solid rgba(255,255,255,.30);\r\n  box-shadow:0 10px 22px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.45);\r\n  position:relative; isolation:isolate;\r\n\r\n  \/* Always-on heartbeat *\/\r\n  animation: ylp-heartbeat 2.6s ease-in-out infinite;\r\n  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, background-position .5s ease;\r\n}\r\n\r\n\/* remove accidental list markers\/dots anywhere *\/\r\n#pricing .plan-card.growth .offer-note::marker{ content:\"\"; }\r\n#pricing .plan-card.growth .offer-note,\r\n#pricing .plan-card.growth .offer-note *{ list-style:none; }\r\n\r\n\/* Shine sweep layer *\/\r\n#pricing .plan-card.growth .offer-note::after{\r\n  content:\"\"; position:absolute; inset:-2px; border-radius:inherit;\r\n  background:linear-gradient(90deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);\r\n  transform:skewX(-20deg) translateX(-120%);\r\n  transition:transform .6s ease; pointer-events:none; z-index:0;\r\n}\r\n\r\n\/* Icon tidy *\/\r\n#pricing .plan-card.growth .offer-note .ico{ display:inline-flex; align-items:center; opacity:.9; }\r\n#pricing .plan-card.growth .offer-note .ico svg{ display:block; }\r\n\r\n\/* Save chip *\/\r\n#pricing .plan-card.growth .offer-note .save-chip{\r\n  display:inline-block; font-weight:800; font-size:12px; color:#fff;\r\n  background:rgba(11,18,32,.28); border:1px dashed rgba(255,255,255,.6);\r\n  padding:4px 10px; border-radius:999px;\r\n}\r\n\r\n\/* Hover: stronger lift + faster shine *\/\r\n#pricing .plan-card.growth .offer-note:hover{\r\n  transform:translateY(-2px);\r\n  background-position:100% 0%;\r\n  box-shadow:0 16px 36px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.60);\r\n  filter:saturate(1.06) brightness(1.02);\r\n}\r\n#pricing .plan-card.growth .offer-note:hover::after{\r\n  transform:skewX(-20deg) translateX(120%);\r\n}\r\n\r\n\/* Heartbeat keyframes (gentle) *\/\r\n@keyframes ylp-heartbeat{\r\n  0%   { transform:scale(1); }\r\n  10%  { transform:scale(1.03); }\r\n  20%  { transform:scale(1); }\r\n  30%  { transform:scale(1.04); }\r\n  40%  { transform:scale(1); }\r\n  100% { transform:scale(1); }\r\n}\r\n\r\n\/* Motion-safe *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  #pricing .plan-card.growth .offer-note{ animation:none !important; transition:none !important; }\r\n  #pricing .plan-card.growth .offer-note::after{ display:none !important; }\r\n}\r\n\r\n\/* OPTIONAL color variants:\r\n   Urgency (orange): background:linear-gradient(90deg,#fca5a5,#fb923c);\r\n   Calm green:       background:linear-gradient(90deg,#86efac,#22c55e);\r\n*\/\r\n\r\n\r\n\r\n\/* ====== Growth (white ticks) ====== *\/\r\n#pricing .plan-card.growth{\r\n  background:#2563eb; color:#ffffff;\r\n  box-shadow:0 24px 50px rgba(0,0,0,.15);\r\n  font-family:\"Poppins\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  text-align:center;\r\n}\r\n#pricing .plan-card.growth .badge{\r\n  background:#fde68a; color:#111827; display:inline-block;\r\n  padding:6px 14px; border-radius:999px; font-size:12px; font-weight:700; margin-bottom:12px;\r\n}\r\n#pricing .plan-card.growth h2{ font-size:28px; font-weight:800; margin:0 0 6px; color:#fff; }\r\n#pricing .plan-card.growth .price{ font-size:32px; font-weight:800; margin:0 0 10px; color:#fff; }\r\n#pricing .plan-card.growth .price span{ font-size:16px; font-weight:600; opacity:.95; }\r\n#pricing .plan-card.growth .subline{\r\n  font-size:17px; line-height:1.55; margin:8px auto 18px; color:rgba(255,255,255,.95); max-width:520px;\r\n}\r\n#pricing .plan-card.growth .features{\r\n  list-style:none; padding:0; margin:0 0 14px; display:grid; gap:10px; text-align:left;\r\n}\r\n#pricing .plan-card.growth .features li{\r\n  font-size:17px; font-weight:700; color:#ffffff; padding-left:28px; position:relative;\r\n}\r\n#pricing .plan-card.growth .features li::before{\r\n  content:\"\"; width:18px; height:18px; position:absolute; left:0; top:3px;\r\n  background:url(\"data:image\/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23ffffff' fill-opacity='0.20'\/%3E%3Cpath d='M8.5 12.5l2.2 2.2 4.8-5.2' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'\/%3E%3C\/svg%3E\") no-repeat center\/contain;\r\n}\r\n#pricing .plan-card.growth .promo-box{\r\n  margin-top:8px; background:rgba(255,255,255,.12);\r\n  border:1px solid rgba(255,255,255,.22); border-radius:16px;\r\n  padding:12px 16px; display:grid; gap:8px; text-align:left;\r\n}\r\n#pricing .plan-card.growth .promo-box .promo-item{\r\n  font-size:15px; font-weight:700; color:#fff; padding-left:28px; position:relative;\r\n}\r\n#pricing .plan-card.growth .promo-box .promo-item::before{\r\n  content:\"\"; width:18px; height:18px; position:absolute; left:0; top:2px;\r\n  background:url(\"data:image\/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23ffffff' fill-opacity='0.20'\/%3E%3Cpath d='M8.5 12.5l2.2 2.2 4.8-5.2' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'\/%3E%3C\/svg%3E\") no-repeat center\/contain;\r\n}\r\n\r\n\/* ====== Pro (solid black text) ====== *\/\r\n#pricing .plan-card.pro{\r\n  background:#ffffff; color:#0b1220 !important;\r\n  font-family:\"Plus Jakarta Sans\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n}\r\n#pricing .plan-card.pro h2,\r\n#pricing .plan-card.pro .price,\r\n#pricing .plan-card.pro .features li{ color:#0b1220 !important; text-shadow:none; }\r\n#pricing .plan-card.pro h2{ font-size:30px; font-weight:800; margin:0 0 8px; }\r\n#pricing .plan-card.pro .price{ font-size:34px; font-weight:800; margin:0 0 10px; }\r\n#pricing .plan-card.pro .price span{ font-size:16px; font-weight:600; }\r\n#pricing .plan-card.pro .subline{\r\n  color:#334155; font-size:18px; line-height:1.55; margin:10px auto 18px; max-width:520px;\r\n}\r\n#pricing .plan-card.pro .features{\r\n  list-style:none; padding:0; margin:0 0 10px; display:grid; gap:10px; text-align:left;\r\n}\r\n#pricing .plan-card.pro .features li{\r\n  font-size:17px; font-weight:600; padding-left:28px; position:relative;\r\n}\r\n#pricing .plan-card.pro .features li::before{\r\n  content:\"\"; width:18px; height:18px; position:absolute; left:0; top:3px;\r\n  background:url(\"data:image\/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' fill='none' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23059669' fill-opacity='0.12'\/%3E%3Cpath d='M8.5 12.5l2.2 2.2 4.8-5.2' stroke='%23059669' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'\/%3E%3C\/svg%3E\") no-repeat center\/contain;\r\n}\r\n\r\n\/* Clean Elementor HTML widget chrome (if any) *\/\r\n#pricing .elementor-widget-html>.elementor-widget-container{\r\n  background:transparent!important; padding:0!important; box-shadow:none!important; border:0!important;\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* Make entire plan-card clickable to the same URL as its button. *\/\r\n(function(){\r\n  var cards = document.querySelectorAll('#pricing .plan-card');\r\n  cards.forEach(function(card){\r\n    var btn = card.querySelector('a.btn[href]');\r\n    if(!btn) return;\r\n    var url = btn.getAttribute('href');\r\n\r\n    \/\/ Accessibility\r\n    card.setAttribute('role','link');\r\n    card.setAttribute('aria-label', card.querySelector('h2')?.textContent.trim() + ' plan');\r\n    card.setAttribute('tabindex','0');\r\n\r\n    \/\/ Click anywhere on the card (except on an <a>) \u2192 go to url\r\n    card.addEventListener('click', function(e){\r\n      if (e.target.closest('a')) return;      \/\/ let real links work normally\r\n      window.location.href = url;\r\n    });\r\n\r\n    \/\/ Keyboard support (Enter \/ Space)\r\n    card.addEventListener('keydown', function(e){\r\n      if (e.key === 'Enter' || e.key === ' ') {\r\n        e.preventDefault();\r\n        window.location.href = url;\r\n      }\r\n    });\r\n  });\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-89ab399 elementor-widget elementor-widget-html\" data-id=\"89ab399\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2022 How it works (gradient heading + 3 real images) -->\r\n<section id=\"ylp-how-img\" aria-labelledby=\"how-title\">\r\n  <header class=\"hw-head\">\r\n    <h2 id=\"how-title\" class=\"grad-text\">C\u00d3MO FUNCIONA<\/h2>\r\n    <p class=\"sub\">3 sencillos pasos para empezar<\/p>\r\n  <\/header>\r\n\r\n  <div class=\"hw-grid\">\r\n    <!-- 1) Select Plan -->\r\n    <article class=\"hw-card\">\r\n      <figure class=\"pic\">\r\n        <img\r\n          src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/Screenshot-2025-09-11-165556.png\"\r\n          alt=\"Choose your subscription plan\" loading=\"lazy\" decoding=\"async\">\r\n        <span class=\"shade\"><\/span>\r\n      <\/figure>\r\n      <div class=\"copy\">\r\n        <h3><span class=\"num\">01.<\/span> Selecciona tu Plan<\/h3>\r\n        <p>Selecciona tu plan + los extras. Cancela cuando quieras.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <!-- 2) Intake Form -->\r\n    <article class=\"hw-card\">\r\n      <figure class=\"pic\">\r\n        <img\r\n          src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/2.png\"\r\n          alt=\"Complete a short intake form\" loading=\"lazy\" decoding=\"async\">\r\n        <span class=\"shade\"><\/span>\r\n      <\/figure>\r\n      <div class=\"copy\">\r\n        <h3><span class=\"num\">02.<\/span> Rellena el Formulario<\/h3>\r\n        <p>Comparte la informaci\u00f3n esencial de tu negocio: datos b\u00e1sicos, enlaces sociales, tono de comunicaci\u00f3n y material gr\u00e1fico (logos, im\u00e1genes, etc.) (3\u20135 minutos)<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <!-- 3) Content & Growth -->\r\n    <article class=\"hw-card\">\r\n      <figure class=\"pic\">\r\n        <img\r\n          src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/09\/3.png\"\r\n          alt=\"Receive custom content and growth\" loading=\"lazy\" decoding=\"async\">\r\n        <span class=\"shade\"><\/span>\r\n      <\/figure>\r\n      <div class=\"copy\">\r\n        <h3><span class=\"num\">03.<\/span> Recibe tu Contenido Personalizado... \u00a1Y a Crecer!<\/h3>\r\n        <p>En 2 a 3 d\u00edas laborables te entregamos tu primer pack de contenidos y activamos tu plan.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Theme tokens ===== *\/\r\n#ylp-how-img{\r\n  --bg1:#08131e;\r\n  --bg2:#07131C;\r\n  --ink:#fff;\r\n  --muted:rgba(255,255,255,.85);\r\n  --edge:rgba(255,255,255,.10);\r\n  --card:rgba(255,255,255,.06);\r\n  --accent:#6f3ff5;\r\n  --gstart:#22c55e; \/* gradient start *\/\r\n  --gend:#60a5fa;  \/* gradient end   *\/\r\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Arial, sans-serif;\r\n  color:var(--ink);\r\n}\r\n\r\n\/* Section background *\/\r\n#ylp-how-img{\r\n  padding:28px 18px 20px;\r\n  border-radius:22px;\r\n  background:\r\n    radial-gradient(1000px 55% at 50% -20%, rgba(111,63,245,.12), transparent 65%),\r\n    linear-gradient(180deg,var(--bg1),var(--bg2));\r\n}\r\n\r\n\/* Heading *\/\r\n#ylp-how-img .hw-head{ margin:0 8px 16px; }\r\n#ylp-how-img .grad-text{\r\n  margin:0;\r\n  font-weight:800;\r\n  font-size:clamp(32px,6vw,72px);\r\n  line-height:1.15;\r\n  \/* animated gradient text + glow (same as other sections) *\/\r\n  background: linear-gradient(90deg,var(--gstart),var(--gend));\r\n  -webkit-background-clip:text!important; background-clip:text!important;\r\n  -webkit-text-fill-color:transparent!important; color:transparent!important;\r\n  background-size:200% 100%;\r\n  animation: sheenMove 5.5s ease-in-out infinite alternate;\r\n  text-shadow:0 10px 34px rgba(96,165,250,.22);\r\n}\r\n#ylp-how-img .sub{\r\n  margin:6px 0 0; color:var(--muted);\r\n  font-weight:600; font-size:16px; line-height:1.6;\r\n}\r\n\r\n\/* Grid: desktop 3, tablet 2, mobile 1 *\/\r\n#ylp-how-img .hw-grid{\r\n  display:grid; grid-template-columns:repeat(3,1fr); gap:22px;\r\n}\r\n@media (max-width:1024px){ #ylp-how-img .hw-grid{ grid-template-columns:repeat(2,1fr); } }\r\n@media (max-width:640px){  #ylp-how-img .hw-grid{ grid-template-columns:1fr; } }\r\n\r\n\/* Card *\/\r\n#ylp-how-img .hw-card{\r\n  background:var(--card);\r\n  border:1px solid var(--edge);\r\n  border-radius:22px; overflow:hidden;\r\n  box-shadow:0 12px 28px rgba(0,0,0,.28);\r\n  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background-color .22s ease;\r\n}\r\n#ylp-how-img .hw-card:hover{\r\n  transform:translateY(-6px);\r\n  box-shadow:0 22px 50px rgba(0,0,0,.38);\r\n  border-color:rgba(111,63,245,.35);\r\n  background:rgba(255,255,255,.08);\r\n}\r\n\r\n\/* Section background \u2192 transparent *\/\r\n#ylp-how-img{\r\n  padding:28px 18px 20px;\r\n  border-radius:0;              \/* remove rounded corners *\/\r\n  background: transparent !important;  \/* no bg *\/\r\n  color:var(--ink);\r\n}\r\n\r\n\r\n\/* Image block *\/\r\n#ylp-how-img .pic{ position:relative; overflow:hidden; aspect-ratio:16\/9; }\r\n#ylp-how-img .pic img{\r\n  width:100%; height:100%; object-fit:cover; display:block;\r\n  transform:scale(1.02);\r\n  transition:transform .5s ease, filter .5s ease;\r\n  filter:saturate(1.05) contrast(1.02) brightness(.92);\r\n}\r\n#ylp-how-img .hw-card:hover .pic img{ transform:scale(1.06); filter:saturate(1.12) contrast(1.06) brightness(.98); }\r\n\r\n\/* Readability shade *\/\r\n#ylp-how-img .shade{ position:absolute; inset:0; pointer-events:none;\r\n  background:linear-gradient(180deg, rgba(7,19,28,.15) 0%, rgba(7,19,28,.45) 70%, rgba(7,19,28,.65) 100%); }\r\n\r\n\/* Copy *\/\r\n#ylp-how-img .copy{ padding:18px 18px 22px; }\r\n#ylp-how-img .copy h3{ margin:0 0 8px; font-weight:800; font-size:26px; line-height:1.25; color:var(--ink); }\r\n#ylp-how-img .copy .num{ color:var(--accent); margin-right:6px; }\r\n#ylp-how-img .copy p{ margin:0; color:var(--muted); font-weight:500; font-size:16px; line-height:1.7; }\r\n\r\n\/* Animations *\/\r\n@keyframes sheenMove{ 0%{background-position:0% 50%} 100%{background-position:100% 50%} }\r\n@media (prefers-reduced-motion:reduce){ #ylp-how-img .grad-text{ animation:none } }\r\n<\/style>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-19108d1 elementor-widget elementor-widget-html\" data-id=\"19108d1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2014 Custom Services (transparent, no image) + Trust Boxes -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@700;800&family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<section id=\"ylp-custom-simple\" class=\"on-dark\" aria-labelledby=\"ylp-custom-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\" data-animate>\r\n    <h2 id=\"ylp-custom-title\" class=\"ylp-kicker\">Servicios Personalizados y Automatizaciones basadas en IA<\/h2>\r\n\r\n    <p class=\"ylp-sub\">\u00bfNecesitas ahorrar tiempo o mejorar tus procesos?<\/p>\r\n\r\n    <p class=\"ylp-desc\">\r\n      \u00bfNecesitas ahorrar tiempo o mejorar procesos?\nCreamos soluciones personalizadas: desde estrategia en LinkedIn hasta automatizaciones avanzadas.\r\n    <\/p>\r\n\r\n    <div class=\"ylp-price\">\r\n      <span class=\"pill\">A partir de 195 \u20ac \/ m\u00f3dulo<\/span>\r\n      <span class=\"muted\">Agentes n8n y Automatizaci\u00f3n de Procesos Empresariales<\/span>\r\n    <\/div>\r\n\r\n    <ul class=\"ylp-list\">\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Automatizaci\u00f3n de Reservas y Recordatorios\r\n      <\/li>\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Captaci\u00f3n de Clientes Potenciales \u2192 Cualificaci\u00f3n \u2192 Sincronizaci\u00f3n con CRM\r\n      <\/li>\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Seguimiento por Correo Electr\u00f3nico \/ WhatsApp \/ SMS\r\n      <\/li>\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Estrategia para LinkedIn y Contenidos Espec\u00edficos de la Plataforma\r\n      <\/li>\r\n    <\/ul>\r\n\r\n    <!-- TRUST BOXES (3 items, radius 16px + hover) -->\r\n    <div class=\"ylp-trust-grid\">\r\n      <div class=\"trust-item\">Sin Costes de Configuraci\u00f3n<\/div>\r\n      <div class=\"trust-item\">Sin Contratos<\/div>\r\n      <div class=\"trust-item\">Sin Falsas Promesas<\/div>\r\n    <\/div>\r\n\r\n    <!-- CTA BUTTON (scroll to contact form) -->\r\n    <div class=\"ylp-cta\">\r\n      <a id=\"cta-custom-quote\" href=\"#contact\" class=\"ylp-btn\" aria-label=\"Solicitar presupuesto\">\r\n       Inicia la Automatizaci\u00f3n Ahora\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Scoped base (transparent) ===== *\/\r\n#ylp-custom-simple[data-ylp-lock]{\r\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  background: transparent;\r\n  padding: 0;\r\n}\r\n#ylp-custom-simple .ylp-wrap{\r\n  max-width: 1100px; margin: 0 auto; padding: 0 16px; text-align: left;\r\n}\r\n\r\n\/* Tokens for dark page *\/\r\n#ylp-custom-simple.on-dark{ --text:#eaf2ff; --muted:#c8d2e6; --accent1:#22c55e; --accent2:#60a5fa; --line:rgba(255,255,255,.12); }\r\n#ylp-custom-simple{ color: var(--text); }\r\n\r\n\/* H2 gradient *\/\r\n#ylp-custom-simple .ylp-kicker{\r\n  font-family: \"Plus Jakarta Sans\", Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  font-weight: 800; letter-spacing: -0.02em;\r\n  font-size: clamp(28px,4.5vw,56px); line-height: 1.1; margin: 0 0 18px 0;\r\n  background: linear-gradient(90deg,var(--accent1),var(--accent2));\r\n  -webkit-background-clip: text; background-clip: text; color: transparent;\r\n  background-size: 200% 100%; animation: sheen 5s ease-in-out infinite alternate;\r\n  text-shadow: 0 8px 28px rgba(96,165,250,.22);\r\n}\r\n\r\n\/* Subheading *\/\r\n#ylp-custom-simple .ylp-sub{\r\n  font-weight: 700; font-size: clamp(20px,2.6vw,30px); margin: 6px 0 14px 0; color:#ffffff;\r\n}\r\n\r\n\/* Body *\/\r\n#ylp-custom-simple .ylp-desc{\r\n  max-width: 70ch; color: var(--muted); line-height: 1.7;\r\n  font-size: clamp(15px,1.6vw,18px); margin: 0 0 16px 0;\r\n}\r\n\r\n\/* Price pill *\/\r\n#ylp-custom-simple .ylp-price{ display:flex; align-items:center; gap:12px; margin: 16px 0 8px; }\r\n#ylp-custom-simple .pill{\r\n  display:inline-flex; align-items:center; gap:8px;\r\n  background: linear-gradient(90deg,var(--accent2),var(--accent1));\r\n  color:#0b1220; font-weight:800; letter-spacing:.02em;\r\n  padding: 8px 14px; border-radius: 999px;\r\n  box-shadow: 0 6px 24px rgba(34,197,94,.25), 0 1px 0 rgba(255,255,255,.25) inset;\r\n}\r\n#ylp-custom-simple .muted{ color: var(--muted); font-size: 14px; }\r\n\r\n\/* Bullets *\/\r\n#ylp-custom-simple .ylp-list{ list-style:none; padding:0; margin: 12px 0 14px 0; max-width: 70ch; }\r\n#ylp-custom-simple .ylp-list li{\r\n  display:flex; align-items:center; gap:10px; padding: 10px 0;\r\n  border-bottom: 1px dashed var(--line);\r\n}\r\n#ylp-custom-simple .ylp-list li:last-child{ border-bottom: 0; }\r\n#ylp-custom-simple .ylp-list svg{ width:20px; height:20px; color:#8cf29b; flex:0 0 20px; }\r\n\r\n\/* Trust boxes *\/\r\n#ylp-custom-simple .ylp-trust-grid{\r\n  display:grid; grid-template-columns: repeat(3, minmax(0,1fr));\r\n  gap: 12px; margin: 14px 0 0 0; max-width: 860px;\r\n}\r\n#ylp-custom-simple .trust-item{\r\n  border-radius: 16px; border: 1px solid var(--line);\r\n  background: rgba(255,255,255,.04);\r\n  color: #fff; font-weight: 800; letter-spacing:.01em;\r\n  text-align: center; padding: 12px 14px;\r\n  transition: transform .18s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;\r\n  backdrop-filter: blur(2px) saturate(110%);\r\n}\r\n#ylp-custom-simple .trust-item:hover{\r\n  transform: translateY(-3px);\r\n  background: rgba(255,255,255,.06);\r\n  border-color: rgba(255,255,255,.22);\r\n  box-shadow: 0 14px 36px rgba(0,0,0,.45);\r\n}\r\n\r\n\/* CTA button *\/\r\n#ylp-custom-simple .ylp-cta{ margin-top: 16px; }\r\n#ylp-custom-simple .ylp-btn{\r\n  display:inline-block; padding:12px 18px; border-radius:12px; text-decoration:none;\r\n  font-weight:800; letter-spacing:.01em; color:#0b1220;\r\n  background: linear-gradient(90deg,var(--accent2),var(--accent1));\r\n  box-shadow: 0 10px 28px rgba(34,197,94,.25);\r\n  transition: transform .18s ease, box-shadow .25s ease;\r\n}\r\n#ylp-custom-simple .ylp-btn:hover{\r\n  transform: translateY(-1px);\r\n  box-shadow: 0 14px 36px rgba(34,197,94,.32);\r\n}\r\n@media (max-width:480px){\r\n  #ylp-custom-simple .ylp-btn{ display:block; text-align:center; width:100%; }\r\n}\r\n\r\n\/* Motion *\/\r\n@keyframes sheen{ 0%{background-position:0% 50%} 100%{background-position:100% 50%} }\r\n@keyframes fadeUp{ from{opacity:0; transform:translateY(12px)} to{opacity:1; transform:none} }\r\n#ylp-custom-simple [data-animate]{ opacity:0; transform:translateY(12px); }\r\n#ylp-custom-simple [data-animate].in{ animation: fadeUp .6s ease forwards; }\r\n\r\n\/* Responsive *\/\r\n@media (max-width: 840px){\r\n  #ylp-custom-simple .ylp-trust-grid{ grid-template-columns: 1fr; }\r\n}\r\n\r\n\/* Reduced motion *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  #ylp-custom-simple .ylp-kicker{ animation:none !important; }\r\n  #ylp-custom-simple [data-animate]{ opacity:1 !important; transform:none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* Tiny reveal (scoped) *\/\r\n(function(){\r\n  const el = document.querySelector('#ylp-custom-simple .ylp-wrap');\r\n  if(!el || !('IntersectionObserver' in window)) return;\r\n  const io = new IntersectionObserver(e => {\r\n    e.forEach(x => { if(x.isIntersecting){ x.target.classList.add('in'); io.unobserve(x.target); } });\r\n  }, { threshold: 0.12 });\r\n  io.observe(el);\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e69f88e elementor-widget elementor-widget-html\" data-id=\"e69f88e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2014 Freelance Project Model (fixed CTA position) -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@700;800&family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<section id=\"ylp-freelance\" class=\"on-dark\" aria-labelledby=\"ylp-free-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\" data-animate>\r\n    <!-- Headline + subhead -->\r\n    <h2 id=\"ylp-free-title\" class=\"ylp-kicker\">Modelo de Trabajo por Proyecto<\/h2>\r\n    <p class=\"ylp-sub\">Proyectos puntuales, resultados respaldados por agencias<\/p>\r\n\r\n    <!-- Intro -->\r\n    <p class=\"ylp-desc\">\r\n      \u00bfNecesitas ayuda experta para un solo proyecto sin necesidad de firmar un contrato? Consiga la flexibilidad de un aut\u00f3nomo con la fiabilidad de un equipo completo detr\u00e1s de su trabajo.\r\n    <\/p>\r\n\r\n    <!-- Price pill -->\r\n    <div class=\"ylp-price\">\r\n      <span class=\"pill\">Desde 199 \u20ac \/ proyecto<\/span>\r\n      <span class=\"muted\">Presupuestos a Medida: le Garantizamos que Superaremos Cualquier Oferta por Escrito.<\/span>\r\n    <\/div>\r\n\r\n    <!-- Bullets -->\r\n    <ul class=\"ylp-list\">\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Lanzamiento o Reestructuraci\u00f3n de Meta Ads\r\n      <\/li>\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Sprint de Contenidos (10-30 Publicaciones)\r\n      <\/li>\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Landing Page + Tracking\r\n      <\/li>\r\n      <li>\r\n        <svg aria-hidden=\"true\" viewbox=\"0 0 24 24\"><path d=\"M20 7L9 18l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n        Configuraci\u00f3n R\u00e1pida de CRM y Automatizaci\u00f3n\r\n      <\/li>\r\n    <\/ul>\r\n\r\n    <!-- CTA (keep INSIDE .ylp-wrap) -->\r\n    <div class=\"ylp-cta\">\r\n      <a id=\"cta-freelance-quote\" href=\"#contact\" class=\"ylp-btn\" aria-label=\"Solicitar presupuesto\">\r\n        Solicitar presupuesto\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Same visual language as your Automations block ===== *\/\r\n#ylp-freelance[data-ylp-lock]{ font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background:transparent; padding:0; }\r\n#ylp-freelance .ylp-wrap{ max-width:1100px; margin:0 auto; padding:0 16px; text-align:left; }\r\n\r\n#ylp-freelance.on-dark{ --text:#eaf2ff; --muted:#c8d2e6; --accent1:#22c55e; --accent2:#60a5fa; --line:rgba(255,255,255,.12); }\r\n#ylp-freelance{ color:var(--text); }\r\n\r\n#ylp-freelance .ylp-kicker{\r\n  font-family:\"Plus Jakarta Sans\", Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  font-weight:800; letter-spacing:-.02em;\r\n  font-size:clamp(28px,4.5vw,56px); line-height:1.1; margin:0 0 18px 0;\r\n  background:linear-gradient(90deg,var(--accent1),var(--accent2));\r\n  -webkit-background-clip:text; background-clip:text; color:transparent;\r\n  background-size:200% 100%; animation:sheen 5s ease-in-out infinite alternate;\r\n  text-shadow:0 8px 28px rgba(96,165,250,.22);\r\n}\r\n#ylp-freelance .ylp-sub{ font-weight:700; font-size:clamp(20px,2.6vw,30px); margin:6px 0 14px 0; color:#fff; }\r\n#ylp-freelance .ylp-desc{ max-width:70ch; color:var(--muted); line-height:1.7; font-size:clamp(15px,1.6vw,18px); margin:0 0 16px 0; }\r\n\r\n\/* Price pill *\/\r\n#ylp-freelance .ylp-price{ display:flex; align-items:center; gap:12px; margin:16px 0 10px; }\r\n#ylp-freelance .pill{\r\n  display:inline-flex; align-items:center; gap:8px;\r\n  background:linear-gradient(90deg,var(--accent2),var(--accent1));\r\n  color:#0b1220; font-weight:800; letter-spacing:.02em;\r\n  padding:8px 14px; border-radius:999px;\r\n  box-shadow:0 6px 24px rgba(34,197,94,.25), 0 1px 0 rgba(255,255,255,.25) inset;\r\n}\r\n#ylp-freelance .muted{ color:var(--muted); font-size:14px; }\r\n\r\n\/* List *\/\r\n#ylp-freelance .ylp-list{ list-style:none; padding:0; margin:12px 0 16px 0; max-width:70ch; }\r\n#ylp-freelance .ylp-list li{ display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px dashed var(--line); }\r\n#ylp-freelance .ylp-list li:last-child{ border-bottom:0; }\r\n#ylp-freelance .ylp-list svg{ width:20px; height:20px; color:#8cf29b; flex:0 0 20px; }\r\n\r\n\/* CTA (space neatly below list, aligned left) *\/\r\n#ylp-freelance .ylp-cta{ margin-top:12px; }\r\n#ylp-freelance .ylp-btn{\r\n  display:inline-block; padding:12px 18px; border-radius:12px; text-decoration:none;\r\n  font-weight:800; letter-spacing:.01em; color:#0b1220;\r\n  background:linear-gradient(90deg,var(--accent2),var(--accent1));\r\n  box-shadow:0 10px 28px rgba(34,197,94,.25);\r\n}\r\n\r\n\/* Motion + responsive *\/\r\n@keyframes sheen{0%{background-position:0% 50%}100%{background-position:100% 50%}}\r\n@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}\r\n#ylp-freelance [data-animate]{opacity:0;transform:translateY(12px)}\r\n#ylp-freelance [data-animate].in{animation:fadeUp .6s ease forwards}\r\n\r\n@media (max-width:840px){ #ylp-freelance .ylp-trust-grid{ grid-template-columns:1fr; } }\r\n@media (prefers-reduced-motion:reduce){\r\n  #ylp-freelance .ylp-kicker{ animation:none !important; }\r\n  #ylp-freelance [data-animate]{ opacity:1 !important; transform:none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* Reveal on view (scoped) *\/\r\n(function(){\r\n  const el = document.querySelector('#ylp-freelance .ylp-wrap');\r\n  if(!el || !('IntersectionObserver' in window)) return;\r\n  const io = new IntersectionObserver(e=>e.forEach(x=>{ if(x.isIntersecting){ x.target.classList.add('in'); io.unobserve(x.target); } }),{threshold:.12});\r\n  io.observe(el);\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-522acd5 elementor-widget elementor-widget-html\" data-id=\"522acd5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2014 HOW WE DO IT (single HTML widget: HTML+CSS+JS, transparent background) --> \r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@700;800&family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<section id=\"ylp-how\" class=\"on-dark\" aria-labelledby=\"ylp-how-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\">\r\n    <h2 id=\"ylp-how-title\" class=\"ylp-title\" data-animate>\r\n      <span class=\"sheen\">Nuestro enfoque<\/span>\r\n    <\/h2>\r\n\r\n    <div class=\"how-grid\">\r\n      <!-- Row 1 -->\r\n      <article class=\"how-card text\" data-animate>\r\n        <p class=\"kicker\">Soporte Digital Local y Personal<\/p>\r\n        <h3>Conectados Contigo<\/h3>\r\n        <p>\r\n          No somos una agencia lejana. Vivimos aqu\u00ed. Conocemos la zona, los barrios, las temporadas y el tipo de cliente que entra en tu negocio. Por eso lo que hacemos encaja contigo de verdad.\r\n        <\/p>\r\n      <\/article>\r\n      <figure class=\"how-media\" data-animate>\r\n        <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1551836022-d5d88e9218df?q=80&w=1600&auto=format&fit=crop\"\r\n             alt=\"Local team collaborating with a small business owner\"\r\n             width=\"1200\" height=\"800\">\r\n        <figcaption aria-hidden=\"true\" class=\"overlay\">La Comunidad en Primer Lugar<\/figcaption>\r\n      <\/figure>\r\n\r\n     <!-- Row 2 (UPDATED IMAGE - FIXED URL) -->\r\n<figure class=\"how-media\" data-animate>\r\n  <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/10\/pexels-michael-burrows-7129717-scaled.jpg\"\r\n       alt=\"Bookings calendar and call insights dashboard for more visibility\"\r\n       width=\"1200\" height=\"800\">\r\n  <figcaption aria-hidden=\"true\" class=\"overlay\">Resultados que Importan<\/figcaption>\r\n<\/figure>\r\n<article class=\"how-card text\" data-animate>\r\n  <p class=\"kicker\">M\u00e1s Llamadas, M\u00e1s Reservas, M\u00e1s Visibilidad<\/p>\r\n  <h3>Sin Humo ni Tecnicismos<\/h3>\r\n  <p>\r\n    Solo resultados. M\u00e1s clientes, m\u00e1s movimiento y m\u00e1s reputaci\u00f3n online. Nos encargamos de que tu negocio destaque cuando alguien busque lo que t\u00fa ofreces.\r\n  <\/p>\r\n<\/article>\r\n\r\n      <!-- Row 3 -->\r\n      <article class=\"how-card text\" data-animate>\r\n        <p class=\"kicker\">Soluciones Digitales que Crecen Contigo<\/p>\r\n        <h3>Accesible. Honesto. Escalable.<\/h3>\r\n        <p>\r\n          Hemos creado planes claros, flexibles y pensados para negocios reales. Empieza con lo que necesites hoy y sube de nivel cuando llegue el momento. Sin sorpresas ni letras peque\u00f1as.\r\n        <\/p>\r\n      <\/article>\r\n      <figure class=\"how-media\" data-animate>\r\n        <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/10\/pexels-artempodrez-5716031-scaled.jpg\"\r\n             alt=\"Beautiful website mockups and brand assets neatly laid out\"\r\n             width=\"1200\" height=\"800\">\r\n        <figcaption aria-hidden=\"true\" class=\"overlay\">Construido a Escala<\/figcaption>\r\n      <\/figure>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Base (transparent section) ===== *\/\r\n#ylp-how[data-ylp-lock]{\r\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  background: transparent;\r\n  color: #eaf2ff;\r\n}\r\n#ylp-how.on-dark{ --muted:#c8d2e6; --line:rgba(255,255,255,.12); --panel:rgba(255,255,255,.04); --panel-b:rgba(255,255,255,.08); --accent1:#22c55e; --accent2:#60a5fa; }\r\n#ylp-how .ylp-wrap{ max-width: 1200px; margin: 0 auto; padding: 0 16px; }\r\n\r\n\/* ===== Title ===== *\/\r\n#ylp-how .ylp-title{ margin: 0 0 22px 0; font-weight: 800; letter-spacing:-0.02em; }\r\n#ylp-how .ylp-title .sheen{\r\n  display:inline-block;\r\n  font-family:\"Plus Jakarta Sans\", Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  font-size: clamp(36px,7vw,96px); line-height: 1;\r\n  background: linear-gradient(90deg,var(--accent1),var(--accent2));\r\n  -webkit-background-clip:text; background-clip:text; color: transparent;\r\n  background-size: 200% 100%; animation: sheen 5.5s ease-in-out infinite alternate;\r\n  text-shadow: 0 10px 34px rgba(96,165,250,.22);\r\n}\r\n\r\n\/* ===== Grid ===== *\/\r\n#ylp-how .how-grid{\r\n  display:grid; grid-template-columns: 1fr 1fr; gap: 0;\r\n  border: 1px solid var(--panel-b); border-left: 0; border-right: 0;\r\n}\r\n#ylp-how .how-card,\r\n#ylp-how .how-media{\r\n  padding: 26px; min-height: 320px;\r\n  border-top: 1px solid var(--panel-b);\r\n  border-right: 1px solid var(--panel-b);\r\n}\r\n#ylp-how .how-grid > *:nth-child(2n){ border-right: 0; }\r\n\r\n\/* ===== Text cards ===== *\/\r\n#ylp-how .how-card .kicker{\r\n  text-transform: none; font-weight: 700; font-size: 13px; letter-spacing:.06em;\r\n  color: #a9b9d6; margin: 4px 0 6px 0;\r\n}\r\n#ylp-how .how-card h3{\r\n  margin: 0 0 10px 0; font-size: clamp(20px,2.6vw,28px); line-height:1.2; color:#fff; font-weight: 800;\r\n}\r\n#ylp-how .how-card p{ color: var(--muted); line-height:1.75; font-size: clamp(14px,1.6vw,18px); max-width: 60ch; }\r\n#ylp-how .how-card{ position:relative; background: linear-gradient(180deg, transparent, transparent); }\r\n#ylp-how .how-card::before{\r\n  content:\"\"; position:absolute; left:0; top:26px; bottom:26px; width:3px;\r\n  background: linear-gradient(180deg,var(--accent2),var(--accent1)); border-radius:999px; opacity:.8;\r\n}\r\n\r\n\/* ===== Media cards ===== *\/\r\n#ylp-how .how-media{ position:relative; overflow:hidden; }\r\n#ylp-how .how-media img{\r\n  width:100%; height:100%; object-fit: cover; border-radius: 0;\r\n  transform: scale(1.02); transition: transform .5s ease, filter .5s ease;\r\n  filter: saturate(1.05) contrast(1.02);\r\n}\r\n#ylp-how .how-media:hover img{ transform: scale(1.06); }\r\n#ylp-how .how-media .overlay{\r\n  position:absolute; right:16px; bottom:16px; padding:6px 10px; font-weight:800; font-size:12px; letter-spacing:.08em;\r\n  color:#05101f; background: linear-gradient(90deg,var(--accent1),var(--accent2));\r\n  border-radius: 999px; box-shadow: 0 10px 30px rgba(0,0,0,.45);\r\n}\r\n\r\n\/* ===== Motion \/ Reveal ===== *\/\r\n#ylp-how [data-animate]{ opacity:0; transform: translateY(16px); will-change: transform, opacity; }\r\n#ylp-how [data-animate].is-in{ animation: fadeUp .7s ease forwards; }\r\n#ylp-how .how-card.is-in{ animation-delay:.05s; }\r\n#ylp-how .how-media.is-in{ animation-delay:.12s; }\r\n\r\n\/* ===== Animations ===== *\/\r\n@keyframes sheen{ 0%{ background-position:0% 50% } 100%{ background-position:100% 50% } }\r\n@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }\r\n\r\n\/* ===== Responsive ===== *\/\r\n@media (max-width: 980px){\r\n  #ylp-how .how-grid{ grid-template-columns: 1fr; }\r\n  #ylp-how .how-grid > *{ border-right: 0; }\r\n  #ylp-how .how-grid > :nth-child(1){ order:1 }\r\n  #ylp-how .how-grid > :nth-child(2){ order:2 }\r\n  #ylp-how .how-grid > :nth-child(3){ order:3 }\r\n  #ylp-how .how-grid > :nth-child(4){ order:4 }\r\n  #ylp-how .how-grid > :nth-child(5){ order:5 }\r\n  #ylp-how .how-grid > :nth-child(6){ order:6 }\r\n  #ylp-how .how-card{ padding:22px 18px; }\r\n}\r\n\r\n\/* Reduced motion *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  #ylp-how .ylp-title .sheen{ animation:none !important; }\r\n  #ylp-how [data-animate]{ opacity:1 !important; transform:none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* IntersectionObserver reveal (scoped to this section) *\/\r\n(function(){\r\n  const root = document.querySelector('#ylp-how');\r\n  if(!root || !('IntersectionObserver' in window)) return;\r\n  const io = new IntersectionObserver((entries)=>{\r\n    entries.forEach(e=>{\r\n      if(e.isIntersecting){ e.target.classList.add('is-in'); io.unobserve(e.target); }\r\n    });\r\n  }, { rootMargin: '0px 0px -10% 0px', threshold: 0.12 });\r\n  root.querySelectorAll('[data-animate]').forEach(el=> io.observe(el));\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0ddabb7 elementor-widget elementor-widget-html\" data-id=\"0ddabb7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2014 OUR WORK IN ACTION (text-only, transparent bg) -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@700;800&family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<section id=\"ylp-work-simple\" class=\"on-dark\" aria-labelledby=\"ylp-work-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\">\r\n    <!-- Heading (same gradient\/motion as earlier) -->\r\n    <h2 id=\"ylp-work-title\" class=\"ylp-title\" data-animate>\r\n      <span class=\"sheen\">Nuestro Trabajo en Acci\u00f3n<\/span>\r\n    <\/h2>\r\n\r\n    <!-- Lead line -->\r\n    <p class=\"ylp-lead\" data-animate>\r\n      Cada negocio tiene una historia. Aqu\u00ed te mostramos c\u00f3mo hemos ayudado a escribir algunas.\r\n    <\/p>\r\n\r\n    <!-- Body copy -->\r\n    <p class=\"ylp-desc\" data-animate>\r\n      Actualmente estamos trabajando con nuestras primeras 10 empresas para construir transformaciones digitales que marquen la diferencia.\r\n      Pronto, esta secci\u00f3n contar\u00e1 con historias reales de crecimiento bares locales, entrenadores de bienestar, empresas de mudanzas, y m\u00e1s\r\n      que se asociaron con nosotros para pasar de invisibles a impactantes. <strong>Permanezca atento.<\/strong>\r\n    <\/p>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Base (transparent) ===== *\/\r\n#ylp-work-simple[data-ylp-lock]{\r\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  background: transparent; \/* no BG *\/\r\n  color: #eaf2ff;\r\n}\r\n#ylp-work-simple.on-dark{ --muted:#c8d2e6; --accent1:#22c55e; --accent2:#60a5fa; }\r\n#ylp-work-simple .ylp-wrap{ max-width: 1200px; margin: 0 auto; padding: 0 16px; text-align: left; }\r\n\r\n\/* ===== Heading (same gradient colour) ===== *\/\r\n#ylp-work-simple .ylp-title{ margin: 0 0 10px 0; font-weight: 800; letter-spacing:-0.02em; }\r\n#ylp-work-simple .ylp-title .sheen{\r\n  display:inline-block;\r\n  font-family:\"Plus Jakarta Sans\", Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  font-size: clamp(36px,7vw,88px); line-height: 1;\r\n  background: linear-gradient(90deg,var(--accent1),var(--accent2));\r\n  -webkit-background-clip:text; background-clip:text; color: transparent;\r\n  background-size: 200% 100%;\r\n  animation: sheen 5.5s ease-in-out infinite alternate;\r\n  text-shadow: 0 10px 34px rgba(96,165,250,.22);\r\n}\r\n\r\n\/* ===== Text ===== *\/\r\n#ylp-work-simple .ylp-lead{\r\n  margin: 6px 0 6px 0; font-weight: 800; color:#ffffff;\r\n  font-size: clamp(20px,2.6vw,34px); line-height: 1.25;\r\n}\r\n#ylp-work-simple .ylp-desc{\r\n  margin: 0 0 16px 0; color: var(--muted);\r\n  max-width: 80ch; line-height: 1.75; font-size: clamp(14px,1.6vw,18px);\r\n}\r\n\r\n\/* ===== Motion \/ Reveal ===== *\/\r\n#ylp-work-simple [data-animate]{ opacity:0; transform: translateY(14px); will-change: transform, opacity; }\r\n#ylp-work-simple [data-animate].is-in{ animation: fadeUp .65s ease forwards; }\r\n\r\n\/* Animations *\/\r\n@keyframes sheen{ 0%{ background-position:0% 50% } 100%{ background-position:100% 50% } }\r\n@keyframes fadeUp{ from{ opacity:0; transform:translateY(14px) } to{ opacity:1; transform:none } }\r\n\r\n\/* Reduced motion *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  #ylp-work-simple .ylp-title .sheen{ animation:none !important; }\r\n  #ylp-work-simple [data-animate]{ opacity:1 !important; transform:none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* Tiny scroll-reveal (scoped) *\/\r\n(function(){\r\n  const root = document.querySelector('#ylp-work-simple');\r\n  if(!root || !('IntersectionObserver' in window)) return;\r\n  const io = new IntersectionObserver((entries)=>{\r\n    entries.forEach(e=>{ if(e.isIntersecting){ e.target.classList.add('is-in'); io.unobserve(e.target); } });\r\n  }, { threshold: 0.12, rootMargin: '0px 0px -10% 0px' });\r\n  root.querySelectorAll('[data-animate]').forEach(el=> io.observe(el));\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b33ca9d elementor-widget elementor-widget-html\" data-id=\"b33ca9d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2014 ABOUT US (lead split into 3 lines + 3 vertical CENTERED cards with equal left\/right gap) --> <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@700;800&family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\"> <section id=\"ylp-about-v2\" class=\"on-dark\" aria-labelledby=\"ylp-about-title\" data-ylp-lock> <div class=\"ylp-wrap\"> <!-- TEXT --> <div class=\"col text\" data-animate> <p class=\"kicker\">Qui\u00e9nes somos<\/p> <h2 id=\"ylp-about-title\" class=\"title\"><span class=\"sheen\">Sobre Nosotros<\/span><\/h2> <!-- Lead split into 3 lines with small gaps --> <div class=\"lead-lines\"> <p>Tecnolog\u00eda Con Coraz\u00f3n Empresarial<\/p> <p>Ayudamos a negocios locales a crecer con claridad, estrategia y un enfoque humano.<\/p> <p>Herramientas digitales pensadas para la comunidad y enfocadas en resultados.<\/p> <\/div> <ul class=\"motto\"> <li>Sabemos de Tecnolog\u00eda.<\/li> <li>Valoramos a las Personas.<\/li> <li>Hacemos Crecer Negocios<\/li> <\/ul> <!-- 3 VERTICAL CARDS \u2014 CENTERED with side gaps --> <div class=\"cards\" data-animate> <article class=\"card\"> <h3>Basados en la Experiencia, Impulsados por un Prop\u00f3sito<\/h3> <p>Con m\u00e1s de 20 a\u00f1os en tecnolog\u00eda, estrategia y emprendimiento, hemos lanzado y escalado negocios multimillonarios en sectores como inmobiliaria e importaci\u00f3n\/exportaci\u00f3n. Nuestro equipo combina ciencia inform\u00e1tica con visi\u00f3n empresarial para ofrecerte soluciones digitales inteligentes y pr\u00e1cticas.<\/p> <\/article> <article class=\"card\"> <h3>Tecnolog\u00eda inteligente, centrada en las personas<\/h3> <p>Es la primera vez que ofrecemos servicios digitales directamente a clientes, pero no somos nuevos en generar resultados. Usamos las \u00faltimas herramientas de IA, plataformas de automatizaci\u00f3n y sistemas de generaci\u00f3n de leads con un objetivo claro: crecimiento real, no solo likes.<\/p> <\/article> <article class=\"card\"> <h3>Justo, flexible y centrado en ti<\/h3> <p>Sin contratos. Sin cuotas de alta. Sin agendas ocultas. Trabajamos mes a mes, as\u00ed que nunca est\u00e1s atado. Con sede en J\u00e1vea, damos soporte tanto a negocios locales como a peque\u00f1os equipos remotos.<\/p> <\/article> <\/div> <\/div> <!-- IMAGE --> <div class=\"col visual\" data-animate> <div class=\"blob\" aria-hidden=\"true\"><\/div> <figure class=\"shot\"> <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/10\/pexels-fauxels-3182804-scaled.jpg\" alt=\"Our team collaborating with a local business owner in J\u00e1vea\" width=\"1600\" height=\"1066\"> <figcaption class=\"tag\" aria-hidden=\"true\">J\u00e1vea - Espa\u00f1a<\/figcaption> <\/figure> <\/div> <\/div> <\/section> <style> \/* ===== Tokens (dark page, transparent section) ===== *\/ #ylp-about-v2.on-dark{ --text:#eaf2ff; --muted:#c8d2e6; --accent1:#22c55e; --accent2:#60a5fa; --line:rgba(255,255,255,.14); --cards-max: 600px; \/* << width of the cards column (controls left\/right gap) *\/ --cards-gap: 14px; \/* spacing between the three boxes *\/ } #ylp-about-v2[data-ylp-lock]{ font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background: transparent; color: var(--text); } \/* ===== Layout ===== *\/ #ylp-about-v2 .ylp-wrap{ max-width: 1200px; margin: 0 auto; padding: 0 16px; display:grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(24px,4vw,48px); align-items: start; } #ylp-about-v2 .col.text{ text-align:left; } #ylp-about-v2 .col.visual{ position:relative; } \/* ===== Headings & lead (3 lines) ===== *\/ #ylp-about-v2 .kicker{ \/* INCREASED SIZE *\/ margin:0 0 6px 0; color:#a9b9d6; font-weight:800; font-size: clamp(16px,1.8vw,22px); \/* was 13px -> now bigger\/responsive *\/ letter-spacing:.08em; } #ylp-about-v2 .title{ margin:0 0 10px 0; font-weight:800; letter-spacing:-.02em; } #ylp-about-v2 .title .sheen{ display:inline-block; font-family:\"Plus Jakarta Sans\", Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; font-size: clamp(36px,7vw,88px); line-height:1; background: linear-gradient(90deg,var(--accent1),var(--accent2)); -webkit-background-clip:text; background-clip:text; color:transparent; background-size:200% 100%; animation: sheen 5.5s ease-in-out infinite alternate; text-shadow: 0 10px 34px rgba(96,165,250,.22); } \/* Three-line lead with small gaps *\/ #ylp-about-v2 .lead-lines{ margin:8px 0 16px 0; } #ylp-about-v2 .lead-lines p{ margin:0 0 8px 0; color:#fff; font-weight:700; font-size: clamp(18px,2.4vw,28px); line-height:1.35; } #ylp-about-v2 .lead-lines p:last-child{ margin-bottom:0; } \/* Motto chips *\/ #ylp-about-v2 .motto{ display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; margin:4px 0 18px 0; } #ylp-about-v2 .motto li{ font-weight:800; font-size:14px; letter-spacing:.02em; color:#05101f; background: linear-gradient(90deg,var(--accent2),var(--accent1)); padding:8px 12px; border-radius:999px; } \/* ===== VERTICAL CARDS \u2014 CENTERED with equal side gaps ===== *\/ #ylp-about-v2 .cards{ width: min(100%, var(--cards-max)); \/* make the cards column narrower than text area *\/ margin-inline: auto; \/* center the column \u2192 creates equal left\/right gap *\/ display:flex; flex-direction:column; gap: var(--cards-gap); align-items: stretch; padding-inline: 4px; \/* tiny inner breathing space *\/ } #ylp-about-v2 .card{ width:100%; text-align:center; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius:16px; padding:16px 18px; box-shadow:0 10px 30px rgba(0,0,0,.25); backdrop-filter: blur(2px); } #ylp-about-v2 .card h3{ margin:0 0 6px 0; color:#fff; font-weight:800; letter-spacing:-.01em; font-size: clamp(18px,2.2vw,22px); line-height:1.25; } #ylp-about-v2 .card p{ margin:0; color:var(--muted); font-size: clamp(14px,1.6vw,17px); line-height:1.65; } \/* ===== Visual (image) ===== *\/ #ylp-about-v2 .blob{ position:absolute; inset:-6% -18% auto auto; width:420px; height:420px; background: radial-gradient(circle at 30% 30%, rgba(96,165,250,.48), transparent 55%), radial-gradient(circle at 70% 70%, rgba(34,197,94,.35), transparent 60%); filter: blur(42px); opacity:.55; animation: float 10s ease-in-out infinite alternate; border-radius:50%; } #ylp-about-v2 .shot{ position:relative; border-radius:18px; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.06) inset; transform: perspective(1200px) rotateY(-6deg) rotateX(1deg); } #ylp-about-v2 .shot img{ display:block; width:100%; height:auto; aspect-ratio:3\/2; object-fit:cover; } #ylp-about-v2 .shot .tag{ position:absolute; right:14px; bottom:14px; padding:6px 10px; color:#05101f; font-weight:800; font-size:12px; letter-spacing:.08em; background: linear-gradient(90deg,var(--accent1),var(--accent2)); border-radius:999px; box-shadow:0 12px 30px rgba(0,0,0,.45); } \/* ===== Motion \/ Reveal ===== *\/ #ylp-about-v2 [data-animate]{ opacity:0; transform: translateY(16px); } #ylp-about-v2 [data-animate].is-in{ animation: fadeUp .7s ease forwards; } @keyframes sheen{ 0%{background-position:0% 50%} 100%{background-position:100% 50%} } @keyframes float{ 0%{ transform: translateY(0) } 100%{ transform: translateY(16px) } } @keyframes fadeUp{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } } \/* ===== Responsive ===== *\/ @media (max-width: 980px){ #ylp-about-v2 .ylp-wrap{ grid-template-columns: 1fr; } #ylp-about-v2 .col.visual{ order:-1; margin-bottom: 8px; } #ylp-about-v2.on-dark{ --cards-max: 640px; } } @media (max-width: 560px){ #ylp-about-v2.on-dark{ --cards-max: 100%; } \/* small screens la kicker aana size still readable *\/ #ylp-about-v2 .kicker{ font-size: clamp(15px,4.6vw,18px); } } \/* Reduced motion *\/ @media (prefers-reduced-motion: reduce){ #ylp-about-v2 .title .sheen{ animation:none !important; } #ylp-about-v2 [data-animate]{ opacity:1 !important; transform:none !important; } #ylp-about-v2 .blob{ animation:none !important; } } <\/style> <script> \/* Scroll reveal (scoped) *\/ (function(){ const root = document.querySelector('#ylp-about-v2'); if(!root || !('IntersectionObserver' in window)) return; const io = new IntersectionObserver((entries)=>{ entries.forEach(e=>{ if(e.isIntersecting){ e.target.classList.add('is-in'); io.unobserve(e.target); } }); }, { rootMargin:'0px 0px -10% 0px', threshold:0.12 }); root.querySelectorAll('[data-animate]').forEach(el=> io.observe(el)); })(); <\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0c80716 elementor-widget elementor-widget-html\" data-id=\"0c80716\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2014 CTA Banner BEFORE FORM (single HTML widget: HTML+CSS+JS, transparent bg) -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@700;800&family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<section id=\"ylp-cta\" class=\"on-dark\" aria-labelledby=\"ylp-cta-title\" data-ylp-lock>\r\n  <div class=\"ylp-wrap\">\r\n    <!-- Text column -->\r\n    <div class=\"cta-text\" data-animate>\r\n      <h2 id=\"ylp-cta-title\" class=\"cta-title\">\r\n        <span class=\"sheen\">\u00bfListo para hacer crecer tu negocio?<\/span>\r\n      <\/h2>\r\n\r\n      <p class=\"cta-sub\">Hablemos, la primera consulta es <strong>gratis<\/strong>.<\/p>\r\n\r\n  \r\n\r\n  \r\n\r\n      <p class=\"cta-micro\">Revisaremos tus objetivos y te daremos soluciones r\u00e1pidas que puedes aplicar de inmediato.<\/p>\r\n    <\/div>\r\n\r\n    <!-- Visual column -->\r\n    <div class=\"cta-visual\" data-animate>\r\n      <div class=\"blob\" aria-hidden=\"true\"><\/div>\r\n\r\n      <figure class=\"shot\">\r\n        <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.yalpro.com\/wp-content\/uploads\/2025\/10\/pexels-silverkblack-23496869-scaled.jpg\"\r\n             alt=\"Consultation meeting with a small business owner\"\r\n             width=\"1600\" height=\"1066\">\r\n        <figcaption class=\"badge\" aria-hidden=\"true\">Primera Consulta - Gratuita<\/figcaption>\r\n\r\n        <!-- Floating ticks -->\r\n        <div class=\"float-notes\" aria-hidden=\"true\">\r\n          <div class=\"note\" style=\"--i:0\">Claridad sobre los pr\u00f3ximos pasos<\/div>\r\n          \r\n          <div class=\"note\" style=\"--i:2\">Hoja de ruta de acciones r\u00e1pidas<\/div>\r\n        <\/div>\r\n      <\/figure>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\/* ===== Theme tokens (dark page, transparent section) ===== *\/\r\n#ylp-cta.on-dark{\r\n  --text:#eaf2ff; --muted:#c8d2e6;\r\n  --accent1:#22c55e; --accent2:#60a5fa;\r\n  --line:rgba(255,255,255,.14); --panel:rgba(255,255,255,.06);\r\n}\r\n#ylp-cta[data-ylp-lock]{\r\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  background: transparent; color: var(--text);\r\n}\r\n\r\n\/* ===== Layout ===== *\/\r\n#ylp-cta .ylp-wrap{\r\n  max-width: 1200px; margin: 0 auto; padding: 0 16px;\r\n  display:grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(24px,4vw,48px);\r\n  align-items: center;\r\n}\r\n#ylp-cta .cta-text{ text-align: left; }\r\n#ylp-cta .cta-visual{ position: relative; }\r\n\r\n\/* ===== Heading & copy ===== *\/\r\n#ylp-cta .cta-title{ margin: 0 0 10px 0; font-weight:800; letter-spacing:-.02em; }\r\n#ylp-cta .cta-title .sheen{\r\n  display:inline-block;\r\n  font-family:\"Plus Jakarta Sans\", Inter, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  font-size: clamp(32px,6.4vw,72px); line-height:1.05;\r\n  background: linear-gradient(90deg,var(--accent1),var(--accent2));\r\n  -webkit-background-clip:text; background-clip:text; color:transparent;\r\n  background-size:200% 100%; animation: sheen 5.2s ease-in-out infinite alternate;\r\n  text-shadow: 0 10px 34px rgba(96,165,250,.22);\r\n}\r\n#ylp-cta .cta-sub{\r\n  margin: 6px 0 12px 0; font-weight:700; color:#fff;\r\n  font-size: clamp(18px,2.4vw,28px); line-height:1.3;\r\n}\r\n#ylp-cta .cta-micro{\r\n  margin: 10px 0 0 0; color: var(--muted); font-size: 14px;\r\n}\r\n\r\n\/* Pills *\/\r\n#ylp-cta .cta-pills{ display:flex; gap:10px; flex-wrap:wrap; margin: 6px 0 16px 0; }\r\n#ylp-cta .pill{\r\n  display:inline-flex; align-items:center; gap:8px; padding:8px 12px;\r\n  border-radius:999px; font-weight:800; letter-spacing:.02em; color:#05101f;\r\n  background: linear-gradient(90deg,var(--accent2),var(--accent1));\r\n  box-shadow: 0 6px 24px rgba(34,197,94,.25), 0 1px 0 rgba(255,255,255,.25) inset;\r\n}\r\n#ylp-cta .pill.ghost{\r\n  color:#eaf2ff; background: transparent; border:1px solid var(--line);\r\n  box-shadow: none;\r\n}\r\n\r\n\/* Buttons *\/\r\n#ylp-cta .cta-actions{ display:flex; gap:12px; flex-wrap:wrap; }\r\n#ylp-cta .btn{\r\n  position:relative; display:inline-flex; align-items:center; justify-content:center;\r\n  font-weight:800; letter-spacing:.02em; text-decoration:none;\r\n  padding: 12px 18px; border-radius: 12px; transition: transform .15s ease, box-shadow .25s ease, background .25s ease;\r\n  border: 1px solid transparent; will-change: transform;\r\n}\r\n#ylp-cta .btn.primary{\r\n  color:#0b1220; background: linear-gradient(90deg,var(--accent2),var(--accent1));\r\n  box-shadow: 0 10px 30px rgba(96,165,250,.35), 0 2px 0 rgba(255,255,255,.3) inset;\r\n}\r\n#ylp-cta .btn.primary:hover{ transform: translateY(-2px) scale(1.01); }\r\n#ylp-cta .btn.primary .shine{\r\n  position:absolute; inset:-2px; border-radius:12px; background:\r\n    radial-gradient(60% 120% at 20% 0%, rgba(255,255,255,.25), transparent 50%),\r\n    linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,0) 45%, rgba(255,255,255,.18) 55%, rgba(255,255,255,0));\r\n  mix-blend-mode: overlay; pointer-events:none; opacity:.65; transition: opacity .3s ease;\r\n}\r\n#ylp-cta .btn.primary:hover .shine{ opacity:.9; }\r\n#ylp-cta .btn.ghost{\r\n  color:#eaf2ff; background: transparent; border-color: var(--line);\r\n}\r\n#ylp-cta .btn.ghost:hover{ background: var(--panel); transform: translateY(-2px); }\r\n\r\n\/* ===== Visual side ===== *\/\r\n#ylp-cta .blob{\r\n  position:absolute; inset:-8% -16% auto auto; width: 420px; height: 420px;\r\n  background:\r\n    radial-gradient(circle at 30% 30%, rgba(96,165,250,.48), transparent 55%),\r\n    radial-gradient(circle at 70% 70%, rgba(34,197,94,.35), transparent 60%);\r\n  filter: blur(42px); opacity:.55; animation: float 10s ease-in-out infinite alternate;\r\n  border-radius:50%;\r\n}\r\n#ylp-cta .shot{\r\n  position:relative; border-radius:18px; overflow:hidden;\r\n  box-shadow: 0 20px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.06) inset;\r\n  transform: perspective(1200px) rotateY(-6deg) rotateX(1deg);\r\n}\r\n#ylp-cta .shot img{ display:block; width:100%; height:auto; aspect-ratio:3\/2; object-fit:cover; }\r\n#ylp-cta .shot .badge{\r\n  position:absolute; right:14px; bottom:14px; padding:6px 10px;\r\n  color:#05101f; font-weight:800; font-size:12px; letter-spacing:.08em;\r\n  background: linear-gradient(90deg,var(--accent1),var(--accent2)); border-radius:999px;\r\n  box-shadow: 0 12px 30px rgba(0,0,0,.45);\r\n}\r\n\r\n\/* Floating notes *\/\r\n#ylp-cta .float-notes{\r\n  position:absolute; left:14px; top:14px; display:grid; gap:8px;\r\n}\r\n#ylp-cta .note{\r\n  font-weight:700; color:#eaf2ff; background: rgba(8,12,22,.78);\r\n  border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:6px 10px;\r\n  backdrop-filter: blur(8px);\r\n  transform: translateY(0); opacity:.95;\r\n  animation: bob 6s ease-in-out infinite calc(var(--i,0) * .6s);\r\n  font-size:12px;\r\n}\r\n\r\n\/* ===== Motion \/ Reveal ===== *\/\r\n#ylp-cta [data-animate]{ opacity:0; transform: translateY(16px); will-change: transform, opacity; }\r\n#ylp-cta [data-animate].is-in{ animation: fadeUp .7s ease forwards; }\r\n\r\n\/* Animations *\/\r\n@keyframes sheen{ 0%{ background-position:0% 50% } 100%{ background-position:100% 50% } }\r\n@keyframes float{ 0%{ transform: translateY(0) } 100%{ transform: translateY(18px) } }\r\n@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }\r\n@keyframes bob{ 0%,100%{ transform: translateY(0)} 50%{ transform: translateY(-6px)} }\r\n\r\n\/* ===== Responsive ===== *\/\r\n@media (max-width: 980px){\r\n  #ylp-cta .ylp-wrap{ grid-template-columns: 1fr; }\r\n  #ylp-cta .cta-visual{ order:-1; margin-bottom: 6px; } \/* image on top mobile *\/\r\n}\r\n\r\n\/* Reduced motion *\/\r\n@media (prefers-reduced-motion: reduce){\r\n  #ylp-cta .cta-title .sheen{ animation:none !important; }\r\n  #ylp-cta [data-animate]{ opacity:1 !important; transform:none !important; }\r\n  #ylp-cta .blob, #ylp-cta .note{ animation:none !important; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n\/* Scroll reveal (scoped) *\/\r\n(function(){\r\n  const root = document.querySelector('#ylp-cta');\r\n  if(!root || !('IntersectionObserver' in window)) return;\r\n  const io = new IntersectionObserver((entries)=>{\r\n    entries.forEach(e=>{\r\n      if(e.isIntersecting){ e.target.classList.add('is-in'); io.unobserve(e.target); }\r\n    });\r\n  }, { rootMargin:'0px 0px -10% 0px', threshold:0.12 });\r\n  root.querySelectorAll('[data-animate]').forEach(el=> io.observe(el));\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-52b79dd e-flex e-con-boxed e-con e-child\" data-id=\"52b79dd\" 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-7cb27a4 e-flex e-con-boxed e-con e-child\" data-id=\"7cb27a4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-355c3c3 ylp-heading-sheen elementor-widget elementor-widget-heading\" data-id=\"355c3c3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Contacta Con Nosotros<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-55cdb23 elementor-widget elementor-widget-heading\" data-id=\"55cdb23\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h4 class=\"elementor-heading-title elementor-size-default\">Cu\u00e9ntanos sobre tu empresa y te responderemos en un d\u00eda laborable.<\/h4>\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-0347c0c e-flex e-con-boxed e-con e-child\" data-id=\"0347c0c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d783610 elementor-widget elementor-widget-html\" data-id=\"d783610\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Yalpro \u2013 WPForms(1501) \u2192 n8n webhook bridge -->\r\n<div id=\"ylp-webhook-bridge\" data-webhook=\"https:\/\/n8n.yalpro.dev\/webhook-test\/yalpro_contact_form\"><\/div>\r\n\r\n<script>\r\n(function () {\r\n  const FORM_ID = 1501;\r\n  const BRIDGE = document.getElementById('ylp-webhook-bridge');\r\n  const WEBHOOK = BRIDGE?.dataset.webhook;\r\n\r\n  if (!WEBHOOK) return;\r\n\r\n  \/\/ --- utilities ---\r\n  const nowISO = () => new Date().toISOString();\r\n\r\n  function serializeForm(form) {\r\n    \/\/ Collect all fields safely\r\n    const fd = new FormData(form);\r\n    const entries = {};\r\n    fd.forEach((v, k) => {\r\n      if (entries[k] !== undefined) {\r\n        if (!Array.isArray(entries[k])) entries[k] = [entries[k]];\r\n        entries[k].push(v);\r\n      } else {\r\n        entries[k] = v;\r\n      }\r\n    });\r\n\r\n    \/\/ Try to extract common fields if your WPForms field names are standard\r\n    const guess = (keys) => {\r\n      for (const k of Object.keys(entries)) {\r\n        const kn = k.toLowerCase();\r\n        if (keys.some(needle => kn.includes(needle))) return entries[k];\r\n      }\r\n      return null;\r\n    };\r\n\r\n    return {\r\n      raw: entries,                                          \/\/ full dump\r\n      lead_name: guess(['name', 'first', 'fullname']) || '', \/\/ best-effort\r\n      email: guess(['email']) || '',\r\n      phone: guess(['phone', 'tel', 'mobile']) || '',\r\n      interest: guess(['interest', 'service', 'reason']) || '',\r\n    };\r\n  }\r\n\r\n  function contextMeta() {\r\n    const params = Object.fromEntries(new URLSearchParams(location.search).entries());\r\n    return {\r\n      page_url: location.href,\r\n      page_title: document.title,\r\n      utm: {\r\n        source: params.utm_source || '',\r\n        medium: params.utm_medium || '',\r\n        campaign: params.utm_campaign || '',\r\n        term: params.utm_term || '',\r\n        content: params.utm_content || ''\r\n      },\r\n      user_agent: navigator.userAgent,\r\n      ts: nowISO(),\r\n      tz: Intl.DateTimeFormat().resolvedOptions().timeZone || ''\r\n    };\r\n  }\r\n\r\n  \/\/ Fire the webhook (AJAX)\r\n  async function postWebhook(payload) {\r\n    try {\r\n      await fetch(WEBHOOK, {\r\n        method: 'POST',\r\n        headers: { 'Content-Type': 'application\/json' },\r\n        body: JSON.stringify(payload),\r\n        keepalive: true\r\n      });\r\n    } catch (e) {\r\n      \/\/ fallback with sendBeacon (fires even on unload)\r\n      try {\r\n        const blob = new Blob([JSON.stringify(payload)], { type: 'application\/json' });\r\n        navigator.sendBeacon(WEBHOOK, blob);\r\n      } catch (_) {}\r\n    }\r\n  }\r\n\r\n  \/\/ Attach when the form is present (handles delayed render)\r\n  function attach() {\r\n    const form = document.querySelector(`#wpforms-form-${FORM_ID}`);\r\n    if (!form) return false;\r\n\r\n    let lastSubmissionData = null;\r\n\r\n    \/\/ 1) Capture data right at submit (works for AJAX & non-AJAX)\r\n    form.addEventListener('submit', (ev) => {\r\n      \/\/ Snapshot the form values at submit time\r\n      const data = serializeForm(form);\r\n      lastSubmissionData = {\r\n        source: 'wpforms',\r\n        form_id: FORM_ID,\r\n        submitted_at: nowISO(),\r\n        ...data,\r\n        meta: contextMeta(),\r\n        status: 'submitted'\r\n      };\r\n\r\n      \/\/ For NON-AJAX forms you can already dispatch; WPForms is usually AJAX.\r\n      \/\/ We'll still wait for success event when available.\r\n      \/\/ Uncomment to also send immediately on submit:\r\n      \/\/ postWebhook(lastSubmissionData);\r\n    }, { capture: true });\r\n\r\n    \/\/ 2) WPForms AJAX success hook (preferred)\r\n    \/\/ WPForms dispatches a custom event: 'wpformsAjaxSubmitSuccess'\r\n    document.addEventListener('wpformsAjaxSubmitSuccess', (e) => {\r\n      try {\r\n        const { detail } = e || {};\r\n        const { data, form } = detail || {};\r\n        const thisId = Number(form?.dataset?.formid || form?.id?.replace('wpforms-form-',''));\r\n        if (thisId !== FORM_ID) return;\r\n\r\n        const payload = Object.assign({}, lastSubmissionData || {}, {\r\n          status: 'success',\r\n          wpforms_response: data || {}\r\n        });\r\n        postWebhook(payload);\r\n      } catch (err) {\r\n        \/\/ silent\r\n      }\r\n    });\r\n\r\n    \/\/ 3) WPForms AJAX error hook (optional)\r\n    document.addEventListener('wpformsAjaxSubmitError', (e) => {\r\n      try {\r\n        const { detail } = e || {};\r\n        const { data, form } = detail || {};\r\n        const thisId = Number(form?.dataset?.formid || form?.id?.replace('wpforms-form-',''));\r\n        if (thisId !== FORM_ID) return;\r\n\r\n        const payload = Object.assign({}, lastSubmissionData || {}, {\r\n          status: 'error',\r\n          wpforms_response: data || {}\r\n        });\r\n        postWebhook(payload);\r\n      } catch (err) {\r\n        \/\/ silent\r\n      }\r\n    });\r\n\r\n    \/\/ 4) Non-AJAX fallback: send on page unload if we never saw success\r\n    window.addEventListener('beforeunload', () => {\r\n      if (lastSubmissionData && lastSubmissionData.status === 'submitted') {\r\n        postWebhook(lastSubmissionData);\r\n      }\r\n    });\r\n\r\n    return true;\r\n  }\r\n\r\n  \/\/ Try immediately, then via MutationObserver if needed\r\n  if (!attach()) {\r\n    const mo = new MutationObserver(() => attach() && mo.disconnect();\r\n    );\r\n    mo.observe(document.documentElement, { childList: true, subtree: true });\r\n  }\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5cf3c51 elementor-widget elementor-widget-shortcode\" data-id=\"5cf3c51\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\t<div class=\"wpforms-container\" id=\"wpforms-1501\"><form id=\"wpforms-form-1501\" class=\"wpforms-validate wpforms-form wpforms-ajax-form\" data-formid=\"1501\" method=\"post\" enctype=\"multipart\/form-data\" action=\"\/es\/wp-json\/wp\/v2\/pages\/5882\" data-token=\"4ca7ca423459f718a6ee315e01f223fb\" data-token-time=\"1780903184\" data-trp-original-action=\"\/es\/wp-json\/wp\/v2\/pages\/5882\"><noscript class=\"wpforms-error-noscript\">Por favor, activa JavaScript en tu navegador para completar este formulario.<\/noscript><div class=\"wpforms-field-container\"><div id=\"wpforms-1501-field_4-container\" class=\"wpforms-field wpforms-field-text\" data-field-id=\"4\"><label class=\"wpforms-field-label\" for=\"wpforms-1501-field_4\">Nombre:  <span class=\"wpforms-required-label\">*<\/span><\/label><input type=\"text\" id=\"wpforms-1501-field_4\" class=\"wpforms-field-large wpforms-field-required\" name=\"wpforms[fields][4]\" placeholder=\"john\" required><\/div><div id=\"wpforms-1501-field_5-container\" class=\"wpforms-field wpforms-field-text\" data-field-id=\"5\"><label class=\"wpforms-field-label\" for=\"wpforms-1501-field_5\">Apellido:<\/label><input type=\"text\" id=\"wpforms-1501-field_5\" class=\"wpforms-field-large\" name=\"wpforms[fields][5]\" placeholder=\"smta\" ><\/div><div id=\"wpforms-1501-field_6-container\" class=\"wpforms-field wpforms-field-text\" data-field-id=\"6\"><label class=\"wpforms-field-label\" for=\"wpforms-1501-field_6\">Nombre del Negocio: <span class=\"wpforms-required-label\">*<\/span><\/label><input type=\"text\" id=\"wpforms-1501-field_6\" class=\"wpforms-field-large wpforms-field-required\" name=\"wpforms[fields][6]\" placeholder=\"Nombre de la empresa\" required><\/div><div id=\"wpforms-1501-field_2-container\" class=\"wpforms-field wpforms-field-email\" data-field-id=\"2\"><label class=\"wpforms-field-label\" for=\"wpforms-1501-field_2\">Correo Electr\u00f3nico: <span class=\"wpforms-required-label\">*<\/span><\/label><input type=\"email\" id=\"wpforms-1501-field_2\" class=\"wpforms-field-large wpforms-field-required\" name=\"wpforms[fields][2]\" spellcheck=\"false\" required><\/div>\t\t<div id=\"wpforms-1501-field_1-container\"\n\t\t\tclass=\"wpforms-field wpforms-field-text\"\n\t\t\tdata-field-type=\"text\"\n\t\t\tdata-field-id=\"1\"\n\t\t\t>\n\t\t\t<label class=\"wpforms-field-label\" for=\"wpforms-1501-field_1\" >WhatsApp Name Name<\/label>\n\t\t\t<input type=\"text\" id=\"wpforms-1501-field_1\" class=\"wpforms-field-medium\" name=\"wpforms[fields][1]\" >\n\t\t<\/div>\n\t\t<div id=\"wpforms-1501-field_7-container\" class=\"wpforms-field wpforms-field-text\" data-field-id=\"7\"><label class=\"wpforms-field-label\" for=\"wpforms-1501-field_7\">Tel\u00e9fono \/ WhatsApp<\/label><input type=\"text\" id=\"wpforms-1501-field_7\" class=\"wpforms-field-large\" name=\"wpforms[fields][7]\" ><\/div><div id=\"wpforms-1501-field_3-container\" class=\"wpforms-field wpforms-field-textarea\" data-field-id=\"3\"><label class=\"wpforms-field-label\" for=\"wpforms-1501-field_3\">Mensaje: <span class=\"wpforms-required-label\">*<\/span><\/label><textarea id=\"wpforms-1501-field_3\" class=\"wpforms-field-large wpforms-field-required\" name=\"wpforms[fields][3]\" placeholder=\"Dinos lo que necesitas...\" required><\/textarea><\/div><script>\n\t\t\t\t( function() {\n\t\t\t\t\tconst style = document.createElement( 'style' );\n\t\t\t\t\tstyle.appendChild( document.createTextNode( '#wpforms-1501-field_1-container { position: absolute !important; overflow: hidden !important; display: inline !important; height: 1px !important; width: 1px !important; z-index: -1000 !important; padding: 0 !important; } #wpforms-1501-field_1-container input { visibility: hidden; } #wpforms-conversational-form-page #wpforms-1501-field_1-container label { counter-increment: none; }' ) );\n\t\t\t\t\tdocument.head.appendChild( style );\n\t\t\t\t\tdocument.currentScript?.remove();\n\t\t\t\t} )();\n\t\t\t<\/script><\/div><!-- .wpforms-field-container --><div class=\"wpforms-recaptcha-container wpforms-is-recaptcha wpforms-is-recaptcha-type-v2\" ><div class=\"g-recaptcha\" data-sitekey=\"6LcAoKwrAAAAAA8VRLaykwuQUvTjos_6EVP4IjcD\"><\/div><input type=\"text\" name=\"g-recaptcha-hidden\" class=\"wpforms-recaptcha-hidden\" style=\"position:absolute!important;clip:rect(0,0,0,0)!important;height:1px!important;width:1px!important;border:0!important;overflow:hidden!important;padding:0!important;margin:0!important;\" data-rule-recaptcha=\"1\"><\/div><div class=\"wpforms-submit-container\" ><input type=\"hidden\" name=\"wpforms[id]\" value=\"1501\"><input type=\"hidden\" name=\"page_title\" value=\"\"><input type=\"hidden\" name=\"page_url\" value=\"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/pages\/5882\"><input type=\"hidden\" name=\"url_referer\" value=\"\"><button type=\"submit\" name=\"wpforms[submit]\" id=\"wpforms-submit-1501\" class=\"wpforms-submit\" data-alt-text=\"Sending...\" data-submit-text=\"Submit\" aria-live=\"assertive\" value=\"wpforms-submit\">Enviar<\/button><img decoding=\"async\" src=\"https:\/\/www.yalpro.com\/wp-content\/plugins\/wpforms-lite\/assets\/images\/submit-spin.svg\" class=\"wpforms-submit-spinner\" style=\"display: none;\" width=\"26\" height=\"26\" alt=\"Cargando\"><\/div><input type=\"hidden\" name=\"trp-form-language\" value=\"es\"\/><\/form><\/div>  <!-- .wpforms-container --><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\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>","protected":false},"excerpt":{"rendered":"<p>Your Accelerated Leads for Professionals. Your Digital Edge. Empowering local businesses in J\u00e1vea, D\u00e9nia, Moraira &amp; beyond. At Yalpro, we help small businesses thrive with beautiful websites, customer generating Instagram\/Facebook accounts, and done for you lead generation. Now with AI powered automations that work 24\/7, turning clicks into customers, leads into bookings, and saving you [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-5882","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/pages\/5882","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/comments?post=5882"}],"version-history":[{"count":6,"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/pages\/5882\/revisions"}],"predecessor-version":[{"id":5891,"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/pages\/5882\/revisions\/5891"}],"wp:attachment":[{"href":"https:\/\/www.yalpro.com\/es\/wp-json\/wp\/v2\/media?parent=5882"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}