{"id":946,"date":"2026-08-11T15:08:07","date_gmt":"2026-08-11T15:08:07","guid":{"rendered":"https:\/\/togrowagencia.com\/en\/?page_id=946"},"modified":"2026-08-14T22:27:05","modified_gmt":"2026-08-14T22:27:05","slug":"home","status":"publish","type":"page","link":"https:\/\/togrowagencia.com\/en\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"946\" class=\"elementor elementor-946\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5a6f745 e-flex e-con-boxed e-con e-parent\" data-id=\"5a6f745\" 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-f4cd3a8 elementor-widget elementor-widget-html\" data-id=\"f4cd3a8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 hero.html (v3 \u2014 headline con reveal-sweep, sub con fade-in,\r\n  botones portados del estilo de aa-hero: letras animadas por JS con\r\n  stagger + glow de borde con --hue, en vez del componente dexter-st\r\n  con spans hardcodeados)\r\n  Se mantiene intacto: video con fade loop por JS, blur shape, liquid\r\n  glass del marquee, nav eliminada (a pedido).\r\n  Prefijo CSS: #tgus-hero\r\n  Pegar en widget HTML de Elementor (hero principal del sitio, home)\r\n\r\n  CONTENIDO: video y logos del marquee siguen siendo placeholders\r\n  (el deck marca \"m\u00ednimo 4 capturas de Smart Go Up\" y logos reales de\r\n  clientes como bloqueantes de lanzamiento) \u2014 reemplazar antes de\r\n  publicar. El copy de texto (headline\/sub\/CTAs\/microcopy) es final,\r\n  tomado del deck (secci\u00f3n 01.1 Home Hero, opci\u00f3n A).\r\n============================================================= -->\r\n<section id=\"tgus-hero\">\r\n  <style>\r\n    #tgus-hero{\r\n      --tgus-bg: hsl(222, 87%, 4%);\r\n      --tgus-fg: hsl(40, 6%, 95%);\r\n      --tgus-fg-90: hsla(40, 6%, 95%, .9);\r\n      --tgus-fg-60: hsla(40, 6%, 95%, .6);\r\n      --tgus-fg-50: hsla(40, 6%, 95%, .5);\r\n      --tgus-fg-20: hsla(40, 6%, 95%, .2);\r\n      --tgus-sub: #c7c7d3;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-blue-d: #2563eb;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      min-height: 100vh;\r\n      display: flex;\r\n      flex-direction: column;\r\n      overflow: hidden;\r\n      background: var(--tgus-bg);\r\n      color: var(--tgus-fg);\r\n      font-family: var(--tgus-font-body);\r\n    }\r\n    #tgus-hero *{ box-sizing: border-box; }\r\n\r\n    \/* ---------- video de fondo ---------- *\/\r\n    #tgus-hero .tgus-h__video{\r\n      position: absolute; inset: 0;\r\n      width: 100%; height: 100%;\r\n      object-fit: cover;\r\n      opacity: 0;\r\n      z-index: 0;\r\n    }\r\n\r\n    \/* ---------- blur shape centrado ---------- *\/\r\n    #tgus-hero .tgus-h__blur{\r\n      position: absolute;\r\n      top: 50%; left: 50%;\r\n      transform: translate(-50%, -50%);\r\n      width: 984px; height: 527px;\r\n      max-width: 92vw;\r\n      opacity: .9;\r\n      background: #010a1f;\r\n      filter: blur(82px);\r\n      pointer-events: none;\r\n      z-index: 1;\r\n    }\r\n\r\n    #tgus-hero .tgus-h__inner{ position: relative; z-index: 10; display: flex; flex-direction: column; min-height: 100vh; width: 100%; }\r\n\r\n    \/* ---------- degradado negro al pie, para que no se note el corte con la siguiente secci\u00f3n ---------- *\/\r\n    #tgus-hero .tgus-h__bottom-fade{\r\n      position: absolute;\r\n      left: 0; right: 0; bottom: 0;\r\n      height: clamp(120px, 22vh, 260px);\r\n      background: linear-gradient(to bottom, transparent 0%, rgba(1,4,10,.55) 55%, #010409 100%);\r\n      pointer-events: none;\r\n      z-index: 5;\r\n    }\r\n\r\n    \/* ---------- contenido central ---------- *\/\r\n    #tgus-hero .tgus-h__content{\r\n      flex: 1;\r\n      display: flex; align-items: center; justify-content: center;\r\n      text-align: center;\r\n      padding: 32px 24px;\r\n    }\r\n    #tgus-hero .tgus-h__eyebrow{\r\n      display: block;\r\n      font-size: 13px; font-weight: 600; letter-spacing: .04em;\r\n      color: var(--tgus-fg-60);\r\n      margin-bottom: 18px;\r\n    }\r\n\r\n    \/* ---------- headline: reveal-sweep (portado de aa-hero) ---------- *\/\r\n    #tgus-hero .tgus-h__headline{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-weight: 500;\r\n      font-size: clamp(40px, 7.5vw, 84px);\r\n      line-height: 1.2 !important;\r\n      letter-spacing: -0.02em;\r\n      margin: 0;\r\n      max-width: 20ch;\r\n      margin-left: auto; margin-right: auto;\r\n      opacity: 0; transform: translateY(16px);\r\n      animation: tgus-h-in .8s var(--tgus-ease) .08s forwards;\r\n    }\r\n    #tgus-hero .tgus-h__reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      transform: translateY(-2px);\r\n      padding-bottom: .1em;\r\n    }\r\n    #tgus-hero .tgus-h__grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .1em;\r\n    }\r\n    #tgus-hero .tgus-h__grad-word.tgus-h__grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-h-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-h-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n    @keyframes tgus-h-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    \/* ---------- subheadline: fade-in (portado de tgus-aa-sub) ---------- *\/\r\n    #tgus-hero .tgus-h__sub{\r\n      font-size: clamp(1.05rem, 2vw, 1.25rem) !important;\r\n      line-height: 1.6 !important;\r\n      color: var(--tgus-sub) !important;\r\n      max-width: 42rem;\r\n      margin: 22px auto 0 !important;\r\n      opacity: 0; transform: translateY(16px);\r\n      animation: tgus-h-in .8s var(--tgus-ease) .18s forwards;\r\n    }\r\n    #tgus-hero .tgus-h__sub strong{\r\n      color: var(--tgus-fg) !important;\r\n      font-weight: 700 !important;\r\n    }\r\n\r\n    #tgus-hero .tgus-h__ctas{\r\n      display: flex; align-items: center; justify-content: center;\r\n      gap: 14px; flex-wrap: wrap;\r\n      margin-top: 28px;\r\n      opacity: 0; transform: translateY(16px);\r\n      animation: tgus-h-in .8s var(--tgus-ease) .28s forwards;\r\n    }\r\n\r\n    \/* ==========================================================\r\n       botones \u2014 portados de aa-hero: glow de borde v\u00eda --hue en\r\n       ::before\/::after + letras animadas por JS (stagger de entrada\r\n       + text-shadow shimmer en hover), sin spans hardcodeados.\r\n    ========================================================== *\/\r\n    #tgus-hero .tgus-btn-wrap{ position: relative; display: inline-block; isolation: isolate; }\r\n    #tgus-hero .tgus-btn{\r\n      --border-radius: 999px;\r\n      --pad: 4px;\r\n      --transition: .4s;\r\n      --hue: 210deg;\r\n      position: relative;\r\n      isolation: isolate;\r\n      user-select: none;\r\n      display: flex; align-items: center; justify-content: center;\r\n      gap: .5em;\r\n      padding: .75em .95em .75em 1.15em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: 15px !important;\r\n      font-weight: 600 !important;\r\n      text-decoration: none !important;\r\n      color: var(--tgus-fg) !important;\r\n      background-color: #111219;\r\n      border: solid 1px rgba(255,255,255,.14);\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      box-shadow:\r\n        inset 0 1px 1px rgba(255,255,255,.2),\r\n        inset 0 2px 2px rgba(255,255,255,.15),\r\n        inset 0 4px 4px rgba(255,255,255,.08),\r\n        inset 0 8px 8px rgba(255,255,255,.04);\r\n      transition: box-shadow var(--transition), border-color var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    #tgus-hero .tgus-btn::before{\r\n      content: ''; position: absolute; z-index: -1;\r\n      top: calc(-1 * var(--pad)); left: calc(-1 * var(--pad));\r\n      width: calc(100% + var(--pad) * 2); height: calc(100% + var(--pad) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--pad));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      box-shadow: 1px 1px 1px #fff2, 2px 2px 2px #fff1, -1px -1px 1px #0002, -2px -2px 2px #0001;\r\n      transition: box-shadow var(--transition);\r\n    }\r\n    #tgus-hero .tgus-btn::after{\r\n      content: ''; position: absolute; inset: 0; z-index: 1;\r\n      border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, hsl(var(--hue) 100% 70%), hsla(var(--hue),100%,70%,.5) 8%, transparent);\r\n      opacity: 0;\r\n      transition: opacity var(--transition);\r\n    }\r\n    #tgus-hero .tgus-btn:hover{ border-color: hsla(var(--hue),100%,80%,.4); transform: translateY(-1px); }\r\n    #tgus-hero .tgus-btn:hover::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); }\r\n    #tgus-hero .tgus-btn:active{ border-color: hsla(var(--hue),100%,80%,.7); background-color: hsla(var(--hue),50%,20%,.5); }\r\n    #tgus-hero .tgus-btn:active::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); filter: brightness(180%); }\r\n    #tgus-hero .tgus-btn:focus-visible{ outline: 2px solid var(--tgus-cyan); outline-offset: 3px; }\r\n\r\n    #tgus-hero .tgus-btn--primary{\r\n      --hue: 262deg;\r\n      background-image: linear-gradient(180deg, #f4f4f8, #e4e4ec);\r\n      border-color: rgba(255,255,255,.22);\r\n      color: #05050a !important;\r\n    }\r\n    #tgus-hero .tgus-btn--primary::after{ background-image: linear-gradient(0deg, #fff, hsl(190 100% 75%), hsla(190,100%,75%,.5) 8%, transparent); }\r\n    #tgus-hero .tgus-btn--primary:active{ background-color: #f4f4f8; }\r\n\r\n    #tgus-hero .tgus-btn-svg{ width: 1.1em; height: 1.1em; flex-shrink: 0; fill: currentColor; }\r\n    #tgus-hero .tgus-btn--primary .tgus-btn-svg{ fill: #05050a; }\r\n\r\n    #tgus-hero .tgus-letters{ position: relative; z-index: 2; display: inline-flex; }\r\n    #tgus-hero .tgus-letter{\r\n      position: relative;\r\n      display: inline-block;\r\n      color: currentColor;\r\n      opacity: 0;\r\n      transform: translateY(4px);\r\n      animation: tgus-h-letter-in .4s var(--tgus-ease) forwards;\r\n      animation-delay: calc(var(--i, 0) * 22ms);\r\n      transition: text-shadow .3s var(--tgus-ease);\r\n    }\r\n    #tgus-hero .tgus-btn:hover .tgus-letter{ text-shadow: 0 0 6px rgba(255,255,255,.55); }\r\n    @keyframes tgus-h-letter-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    #tgus-hero .tgus-h__microcopy{\r\n      margin-top: 22px;\r\n      font-size: 12.5px; font-weight: 500;\r\n      letter-spacing: .02em;\r\n      color: var(--tgus-fg-50);\r\n    }\r\n\r\n    \/* ---------- marquee de logos (CSS puro: @keyframes + pausa en hover, centrado, sin copy) ---------- *\/\r\n    #tgus-hero .tgus-h__marquee-wrap{\r\n      position: relative;\r\n      z-index: 6;\r\n      padding-bottom: 40px;\r\n    }\r\n    #tgus-hero .tgus-h__marquee-inner{\r\n      max-width: 72rem; margin: 0 auto;\r\n      padding: 0 24px;\r\n    }\r\n    #tgus-hero .tgus-logoloop{\r\n      position: relative;\r\n      overflow: hidden;\r\n      -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);\r\n      mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);\r\n    }\r\n    #tgus-hero .tgus-logoloop__track{\r\n      display: flex;\r\n      align-items: center;\r\n      width: max-content;\r\n      gap: 72px;\r\n      animation: tgus-h-logoloop-scroll 42s linear infinite;\r\n    }\r\n    #tgus-hero .tgus-logoloop:hover .tgus-logoloop__track{\r\n      animation-play-state: paused;\r\n    }\r\n    @keyframes tgus-h-logoloop-scroll{\r\n      from{ transform: translate3d(0,0,0); }\r\n      to{ transform: translate3d(-50%,0,0); }\r\n    }\r\n    #tgus-hero .tgus-logoloop__item{\r\n      flex: 0 0 auto;\r\n      display: inline-flex; align-items: center; justify-content: center;\r\n    }\r\n    #tgus-hero .tgus-logoloop__item img{\r\n      height: 52px;\r\n      width: auto;\r\n      max-width: 200px;\r\n      display: block;\r\n      object-fit: contain;\r\n      filter: brightness(0) invert(1);\r\n      opacity: .9;\r\n      transition: opacity .3s ease, transform .3s cubic-bezier(.4,0,.2,1);\r\n      pointer-events: none;\r\n      -webkit-user-drag: none;\r\n    }\r\n    #tgus-hero .tgus-logoloop__item:hover img{\r\n      opacity: 1;\r\n      transform: scale(1.06);\r\n    }\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-hero .tgus-logoloop__track{ animation: none; }\r\n    }\r\n\r\n    \/* ---------- liquid glass ---------- *\/\r\n    #tgus-hero .tgus-liquid-glass{\r\n      background: rgba(255,255,255,.01);\r\n      background-blend-mode: luminosity;\r\n      -webkit-backdrop-filter: blur(4px);\r\n      backdrop-filter: blur(4px);\r\n      border: none;\r\n      box-shadow: inset 0 1px 1px rgba(255,255,255,.1);\r\n      position: relative;\r\n      overflow: hidden;\r\n    }\r\n    #tgus-hero .tgus-liquid-glass::before{\r\n      content: \"\";\r\n      position: absolute; inset: 0;\r\n      border-radius: inherit;\r\n      padding: 1.4px;\r\n      background: linear-gradient(180deg,\r\n        rgba(255,255,255,.45) 0%,\r\n        rgba(255,255,255,.15) 20%,\r\n        rgba(255,255,255,0) 40%,\r\n        rgba(255,255,255,0) 60%,\r\n        rgba(255,255,255,.15) 80%,\r\n        rgba(255,255,255,.45) 100%);\r\n      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);\r\n      -webkit-mask-composite: xor;\r\n      mask-composite: exclude;\r\n      pointer-events: none;\r\n    }\r\n\r\n    @media(max-width: 640px){\r\n      #tgus-hero .tgus-h__nav{ padding: 16px 20px; }\r\n    }\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-hero .tgus-h__headline, #tgus-hero .tgus-h__sub, #tgus-hero .tgus-h__ctas, #tgus-hero .tgus-letter{\r\n        animation-duration: .01ms !important; opacity: 1 !important; transform: none !important;\r\n      }\r\n    }\r\n  <\/style>\r\n\r\n  <!-- Bricolage Grotesque + Plus Jakarta Sans (Google Fonts) \u2014 mismas fuentes que aa-hero, para coherencia entre secciones -->\r\n  <link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Bricolage+Grotesque:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap\">\r\n\r\n  <!-- IMG\/VIDEO HERO \u2014 placeholder, el deck marca capturas reales de Smart Go Up como bloqueante de lanzamiento -->\r\n  <video class=\"tgus-h__video\" id=\"tgus-h-video\" src=\"https:\/\/d8j0ntlcm91z4.cloudfront.net\/user_38xzZboKViGWJOttwIXH07lWA1P\/hf_20260328_065045_c44942da-53c6-4804-b734-f9e07fc22e08.mp4\" muted playsinline preload=\"auto\"><\/video>\r\n\r\n  <div class=\"tgus-h__blur\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"tgus-h__inner\">\r\n\r\n    <div class=\"tgus-h__content\">\r\n      <div>\r\n        <h1 class=\"tgus-h__headline\"><span class=\"tgus-h__reveal\" id=\"tgus-h-reveal-1\">The work that <span class=\"tgus-h__grad-word\">repeats<\/span> shouldn't need a person.<\/span><\/h1>\r\n\r\n        <p class=\"tgus-h__sub\">ToGrow builds <strong>AI agents<\/strong> and custom software that take over the manual, repetitive parts of your operation \u2014 and one platform to run them from. <strong>Five in-house engineers.<\/strong> A U.S. company. A team that works your hours.<\/p>\r\n\r\n        <div class=\"tgus-h__ctas\">\r\n          <span class=\"tgus-btn-wrap\">\r\n            <a href=\"https:\/\/api.whatsapp.com\/send?phone=573103597580\" class=\"tgus-btn tgus-btn--primary\" aria-label=\"Book a call\" target=\"_blank\" rel=\"noopener\">\r\n              <svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" fill=\"currentColor\" d=\"M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.894 20.567 16.5 21.75l-.394-1.183a2.25 2.25 0 0 0-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 0 0 1.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 0 0 1.423 1.423l1.183.394-1.183.394a2.25 2.25 0 0 0-1.423 1.423Z\"\/><\/svg>\r\n              <span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>Book a call<\/span>\r\n            <\/a>\r\n          <\/span>\r\n          <span class=\"tgus-btn-wrap\">\r\n            <a href=\"\/en\/ai-automation\/\" class=\"tgus-btn\" aria-label=\"See how it works\">\r\n              <span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>See how it works<\/span>\r\n              <svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n            <\/a>\r\n          <\/span>\r\n        <\/div>\r\n\r\n        <p class=\"tgus-h__microcopy\">Google Partner \u00b7 Five in-house engineers \u00b7 Clients in more than ten countries<\/p>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-h__marquee-wrap\">\r\n      <div class=\"tgus-h__marquee-inner\">\r\n        <div class=\"tgus-logoloop\">\r\n          <div class=\"tgus-logoloop__track\">\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/descarga.png\" alt=\"Cliente ToGrow\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-6-e1684512931169.avif\" alt=\"Cliente ToGrow\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logo-Color-Adatec.avif\" alt=\"Adatec\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-01-e1684512985926.avif\" alt=\"Cliente ToGrow\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Cliente-Carlos-Recio.avif\" alt=\"Dr. Carlos Recio\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-09-e1684512900285-1.avif\" alt=\"Cliente ToGrow\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-7-e1684512919254.avif\" alt=\"Cliente ToGrow\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-5-e1684512943709.avif\" alt=\"Cliente ToGrow\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Ecar.avif\" alt=\"Ecar\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/logo-verde-cliente-Notaria-1.avif\" alt=\"Notaria Mundo Latino\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/tecnology_video-02_230x_2x_54db5cda-5d07-4a87-86af-bdb318f76bd9-_3_0.webp\" alt=\"Technology Video\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <!-- duplicado para el loop sin corte -->\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/descarga.png\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-6-e1684512931169.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logo-Color-Adatec.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-01-e1684512985926.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Cliente-Carlos-Recio.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-09-e1684512900285-1.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-7-e1684512919254.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Logos-de-Clientes-Buho_.-5-e1684512943709.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/Ecar.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/logo-verde-cliente-Notaria-1.avif\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n            <span class=\"tgus-logoloop__item\" aria-hidden=\"true\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/tecnology_video-02_230x_2x_54db5cda-5d07-4a87-86af-bdb318f76bd9-_3_0.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-h__bottom-fade\" aria-hidden=\"true\"><\/div>\r\n\r\n  <\/div>\r\n\r\n  <script>\r\n  (function(){\r\n    try{\r\n      var root = document.getElementById('tgus-hero');\r\n      if(!root) return;\r\n      var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n      \/* ---------- video fade loop ---------- *\/\r\n      var video = document.getElementById('tgus-h-video');\r\n      if(video){\r\n        var FADE_MS = 500;\r\n        var videoRaf = null;\r\n\r\n        var fade = function(from, to, duration, onDone){\r\n          if(videoRaf !== null){ cancelAnimationFrame(videoRaf); }\r\n          var start = performance.now();\r\n          function step(now){\r\n            var t = Math.min(1, (now - start) \/ duration);\r\n            video.style.opacity = String(from + (to - from) * t);\r\n            if(t < 1){\r\n              videoRaf = requestAnimationFrame(step);\r\n            } else {\r\n              videoRaf = null;\r\n              if(onDone) onDone();\r\n            }\r\n          }\r\n          videoRaf = requestAnimationFrame(step);\r\n        };\r\n\r\n        var startPlayback = function(){\r\n          video.currentTime = 0;\r\n          video.style.opacity = '0';\r\n          var playPromise = video.play();\r\n          if(playPromise && playPromise.catch){ playPromise.catch(function(){}); }\r\n          fade(0, 1, FADE_MS);\r\n        };\r\n\r\n        video.addEventListener('timeupdate', function(){\r\n          if(!video.duration) return;\r\n          var remaining = video.duration - video.currentTime;\r\n          if(remaining <= FADE_MS \/ 1000 && video.style.opacity !== '0' && !video.dataset.fadingOut){\r\n            video.dataset.fadingOut = '1';\r\n            fade(1, 0, Math.max(0, remaining * 1000));\r\n          }\r\n        });\r\n\r\n        video.addEventListener('ended', function(){\r\n          video.style.opacity = '0';\r\n          delete video.dataset.fadingOut;\r\n          setTimeout(startPlayback, 100);\r\n        });\r\n\r\n        video.addEventListener('loadedmetadata', function(){\r\n          if(reduceMotion){\r\n            video.style.opacity = '1';\r\n            video.play().catch(function(){});\r\n            return;\r\n          }\r\n          startPlayback();\r\n        });\r\n\r\n        if(video.readyState >= 1){\r\n          video.dispatchEvent(new Event('loadedmetadata'));\r\n        }\r\n      }\r\n\r\n      \/* ---------- letras animadas de los botones ---------- *\/\r\n      root.querySelectorAll('[data-tgus-letters]').forEach(function(el){\r\n        var text = el.textContent;\r\n        el.textContent = '';\r\n        text.split('').forEach(function(ch, i){\r\n          var span = document.createElement('span');\r\n          span.className = 'tgus-letter';\r\n          span.style.setProperty('--i', i);\r\n          span.textContent = ch === ' ' ? '\\u00A0' : ch;\r\n          el.appendChild(span);\r\n        });\r\n      });\r\n\r\n      \/* ---------- reveal-sweep del headline ---------- *\/\r\n      var revealLines = [root.querySelector('#tgus-h-reveal-1')].filter(Boolean);\r\n\r\n      if(revealLines.length){\r\n        var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n        var TGUS_TEXT_COLOR = '#f4f4f8';\r\n        var BAND_HALF = 17;\r\n        var SWEEP_START = -BAND_HALF;\r\n        var SWEEP_END = 100 + BAND_HALF;\r\n\r\n        var sweepEase = function(t){\r\n          return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2;\r\n        };\r\n        var buildGradient = function(pos){\r\n          var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n          if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n          var n = TGUS_COLORS.length, parts = [];\r\n          if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n          TGUS_COLORS.forEach(function(c, i){\r\n            var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n            parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n          });\r\n          if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n          return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n        };\r\n        var activateGradWord = function(lineEl){\r\n          var word = lineEl.querySelector('.tgus-h__grad-word');\r\n          if(word) word.classList.add('tgus-h__grad-active');\r\n        };\r\n        var sweepOne = function(el, duration, onDone){\r\n          var start = performance.now();\r\n          el.style.backgroundImage = buildGradient(SWEEP_START);\r\n          function tick(){\r\n            var t = Math.min((performance.now() - start) \/ duration, 1);\r\n            var pos = SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t);\r\n            el.style.backgroundImage = buildGradient(pos);\r\n            if(t < 1) requestAnimationFrame(tick);\r\n            else {\r\n              activateGradWord(el);\r\n              if(onDone) onDone();\r\n            }\r\n          }\r\n          requestAnimationFrame(tick);\r\n        };\r\n        var runSweepSequence = function(){\r\n          sweepOne(revealLines[0], 650);\r\n        };\r\n\r\n        if(reduceMotion){\r\n          revealLines.forEach(function(el){\r\n            el.style.backgroundImage = buildGradient(SWEEP_END);\r\n            activateGradWord(el);\r\n          });\r\n        } else if('IntersectionObserver' in window){\r\n          var revealFired = false;\r\n          var revealIo = new IntersectionObserver(function(entries){\r\n            entries.forEach(function(e){\r\n              if(e.isIntersecting && !revealFired){\r\n                revealFired = true;\r\n                setTimeout(runSweepSequence, 300);\r\n              }\r\n            });\r\n          }, { threshold: .1 });\r\n          revealIo.observe(revealLines[0]);\r\n        } else {\r\n          revealLines.forEach(function(el){\r\n            el.style.backgroundImage = buildGradient(SWEEP_END);\r\n            activateGradWord(el);\r\n          });\r\n        }\r\n      }\r\n    }catch(err){\r\n      console.error('[tgus-hero] error:', err);\r\n    }\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ac7307b elementor-widget elementor-widget-html\" data-id=\"ac7307b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 04-pillars.html (Home \u2014 secci\u00f3n 01.4 \u00b7 The two pillars, firma)\r\n  Copy final del deck v2. Composici\u00f3n adaptada de un componente\r\n  \"Features\" (shadcn-style): header centrado + grid de cards mudas\r\n  con CardDecorator (patr\u00f3n de grid punteado enmascarado + caja\r\n  interior con borde superior\/izquierdo, \u00edcono centrado), portado a\r\n  vanilla y a la paleta oscura del sitio. Reveal-sweep en el headline,\r\n  mismo sistema del resto de las secciones.\r\n  Prefijo CSS: #tgus-pillars\r\n  Pegar en widget HTML de Elementor, cuarta secci\u00f3n del home.\r\n============================================================= -->\r\n<section id=\"tgus-pillars\">\r\n  <style>\r\n    #tgus-pillars{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-blue-d: #2563eb;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-violet-d: #6d5ef0;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-pillars *, #tgus-pillars *::before, #tgus-pillars *::after{ box-sizing: border-box; }\r\n\r\n    #tgus-pillars .tgus-wrap{ max-width: 1080px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n    #tgus-pillars .tgus-head{ max-width: 640px; margin: 0 auto clamp(2.75rem, 6vw, 4rem); text-align: center; }\r\n    #tgus-pillars .tgus-eyebrow{\r\n      display: inline-block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 1rem !important;\r\n    }\r\n    #tgus-pillars h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.9rem, 4.2vw, 2.85rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.18 !important;\r\n      margin: 0 0 1.1rem !important;\r\n    }\r\n    #tgus-pillars .tgus-reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-pillars .tgus-grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-pillars .tgus-grad-word.tgus-grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n    #tgus-pillars .tgus-intro{\r\n      font-size: 1.05rem !important;\r\n      line-height: 1.6 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 !important;\r\n    }\r\n\r\n    \/* ---------- grid de 2 pilares ---------- *\/\r\n    #tgus-pillars .tgus-grid{\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap: clamp(1.25rem, 3vw, 1.75rem);\r\n    }\r\n\r\n    \/* ---- glow border (portado de un componente Uiverse \u2014 SelfMadeSystem):\r\n       en vez de blur+feColorMatrix sobre gradientes lineales rotados con\r\n       transform, se anima el \u00e1ngulo de un conic-gradient v\u00eda custom\r\n       property registrada (@property), que es lo que ya usa el resto del\r\n       sitio (tgus-aa-types) \u2014 mismo resultado visual, sin depender de\r\n       filtros SVG ni de recortes ajustados a mano. ---- *\/\r\n    @property --tgus-pillar-angle{\r\n      syntax: '<angle>';\r\n      initial-value: 0deg;\r\n      inherits: false;\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap{\r\n      position: relative;\r\n      isolation: isolate;\r\n      height: 100%;\r\n      opacity: 0;\r\n      transform: translateY(18px);\r\n      transition: opacity .7s var(--tgus-ease), transform .7s var(--tgus-ease);\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap.tgus-in-view{ opacity: 1; transform: translateY(0); }\r\n    #tgus-pillars .tgus-grid > .tgus-glow-wrap:nth-child(2){ transition-delay: .12s; }\r\n\r\n    #tgus-pillars .tgus-pspin{\r\n      position: absolute;\r\n      pointer-events: none;\r\n      --tgus-pillar-angle: 0deg;\r\n      animation: tgus-pillar-speen 7s ease-in-out infinite;\r\n    }\r\n    @keyframes tgus-pillar-speen{\r\n      0%{ --tgus-pillar-angle: 0deg; }\r\n      60%{ --tgus-pillar-angle: 270deg; }\r\n      75%{ --tgus-pillar-angle: 270deg; }\r\n      100%{ --tgus-pillar-angle: 360deg; }\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap[data-paused=\"true\"] .tgus-pspin{ animation-play-state: paused; }\r\n\r\n    #tgus-pillars .tgus-pspin-blur{ inset: -8px; z-index: -2; border-radius: 30px; filter: blur(11px); }\r\n    #tgus-pillars .tgus-pspin-intense{ inset: -3px; z-index: -1; border-radius: 26px; filter: blur(4px); }\r\n\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(1) .tgus-pspin-blur{\r\n      background: conic-gradient(from var(--tgus-pillar-angle), var(--tgus-blue-d), transparent 25%, transparent 50%, var(--tgus-cyan), transparent 75%, var(--tgus-blue-d));\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(1) .tgus-pspin-intense{\r\n      background: conic-gradient(from var(--tgus-pillar-angle), var(--tgus-cyan), transparent 25%, transparent 50%, #ffffff, transparent 75%, var(--tgus-cyan));\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(2) .tgus-pspin-blur{\r\n      background: conic-gradient(from var(--tgus-pillar-angle), var(--tgus-violet-d), transparent 25%, transparent 50%, var(--tgus-violet), transparent 75%, var(--tgus-violet-d));\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(2) .tgus-pspin-intense{\r\n      background: conic-gradient(from var(--tgus-pillar-angle), var(--tgus-violet), transparent 25%, transparent 50%, #ffffff, transparent 75%, var(--tgus-violet));\r\n    }\r\n\r\n    #tgus-pillars .tgus-card{\r\n      position: relative;\r\n      z-index: 1;\r\n      height: 100%;\r\n      display: flex;\r\n      flex-direction: column;\r\n      align-items: center;\r\n      background: var(--tgus-bg-2);\r\n      border-radius: 24px;\r\n      padding: clamp(2rem, 4vw, 2.75rem) clamp(1.75rem, 4vw, 2.25rem) clamp(2.25rem, 4vw, 2.75rem);\r\n      text-align: center;\r\n      box-shadow: 0 0 40px -10px rgba(0,0,0,.5);\r\n    }\r\n    #tgus-pillars .tgus-card-link{\r\n      margin-top: auto;\r\n    }\r\n\r\n    \/* ---- CardDecorator: patr\u00f3n de grid punteado enmascarado + caja interior ---- *\/\r\n    #tgus-pillars .tgus-decorator{\r\n      position: relative;\r\n      margin: 0 auto;\r\n      width: 148px; height: 148px;\r\n      -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 70%, transparent 100%);\r\n      mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 70%, transparent 100%);\r\n    }\r\n    #tgus-pillars .tgus-decorator-grid{\r\n      position: absolute; inset: 0;\r\n      background-image:\r\n        linear-gradient(to right, rgba(255,255,255,.5) 1px, transparent 1px),\r\n        linear-gradient(to bottom, rgba(255,255,255,.5) 1px, transparent 1px);\r\n      background-size: 24px 24px;\r\n      opacity: .12;\r\n    }\r\n    #tgus-pillars .tgus-decorator-box{\r\n      position: absolute; inset: 0;\r\n      margin: auto;\r\n      width: 52px; height: 52px;\r\n      display: flex; align-items: center; justify-content: center;\r\n      border-top: 1px solid var(--tgus-border);\r\n      border-left: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-2);\r\n    }\r\n    #tgus-pillars .tgus-decorator-box svg{\r\n      width: 26px; height: 26px;\r\n      stroke: currentColor; fill: none; stroke-width: 1.6;\r\n      stroke-linecap: round; stroke-linejoin: round;\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(1) .tgus-decorator-box{ color: var(--tgus-cyan); }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(2) .tgus-decorator-box{ color: var(--tgus-violet); }\r\n\r\n    #tgus-pillars .tgus-card h3{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: 1.35rem !important;\r\n      font-weight: 700 !important;\r\n      margin: 1.5rem 0 .85rem !important;\r\n      color: var(--tgus-text) !important;\r\n    }\r\n    #tgus-pillars .tgus-card p{\r\n      font-size: .98rem !important;\r\n      line-height: 1.65 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 !important;\r\n    }\r\n    #tgus-pillars .tgus-card p + p{ margin-top: .9rem !important; }\r\n    #tgus-pillars .tgus-card strong{ color: var(--tgus-text) !important; font-weight: 700 !important; }\r\n\r\n    #tgus-pillars .tgus-card-link{\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: .4rem;\r\n      margin-top: auto;\r\n      padding-top: 1.4rem;\r\n      font-size: .92rem !important;\r\n      font-weight: 700 !important;\r\n      color: var(--tgus-text) !important;\r\n      text-decoration: none !important;\r\n      border-bottom: 1px solid transparent;\r\n      transition: border-color .25s var(--tgus-ease), color .25s var(--tgus-ease), gap .25s var(--tgus-ease);\r\n    }\r\n    #tgus-pillars .tgus-card-link:hover{\r\n      border-color: currentColor;\r\n      gap: .6rem;\r\n    }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(1) .tgus-card-link{ color: var(--tgus-cyan) !important; }\r\n    #tgus-pillars .tgus-glow-wrap:nth-child(2) .tgus-card-link{ color: var(--tgus-violet) !important; }\r\n    #tgus-pillars .tgus-card-link svg{ width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; transition: transform .25s var(--tgus-ease); }\r\n    #tgus-pillars .tgus-card-link:hover svg{ transform: translateX(3px); }\r\n\r\n    \/* ---------- cierre ---------- *\/\r\n    #tgus-pillars .tgus-close{\r\n      text-align: center;\r\n      max-width: 46ch;\r\n      margin: clamp(2.5rem, 5vw, 3.25rem) auto 0 !important;\r\n      font-size: 1.02rem !important;\r\n      line-height: 1.6 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      opacity: 0;\r\n      transform: translateY(14px);\r\n      transition: opacity .7s var(--tgus-ease) .22s, transform .7s var(--tgus-ease) .22s;\r\n    }\r\n    #tgus-pillars .tgus-close.tgus-in-view{ opacity: 1; transform: translateY(0); }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-pillars .tgus-glow-wrap, #tgus-pillars .tgus-close{\r\n        transition-duration: .01ms !important; opacity: 1 !important; transform: none !important;\r\n      }\r\n      #tgus-pillars .tgus-pspin{ animation-duration: 45s !important; }\r\n      #tgus-pillars .tgus-grad-word.tgus-grad-active{ animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n    @media(max-width: 768px){\r\n      #tgus-pillars .tgus-grid{ grid-template-columns: 1fr; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-head\">\r\n      <span class=\"tgus-eyebrow\">what we build<\/span>\r\n      <h2><span class=\"tgus-reveal\" id=\"tgus-pillars-reveal\">Automate your operation on a platform we built. <span class=\"tgus-grad-word\">Build what doesn't exist yet.<\/span><\/span><\/h2>\r\n      <p class=\"tgus-intro\">Two things. One is a product we own. The other is an engineering team you get direct access to.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-grid\">\r\n      <div class=\"tgus-glow-wrap\" data-paused=\"true\">\r\n        <div class=\"tgus-pspin tgus-pspin-blur\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"tgus-pspin tgus-pspin-intense\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"tgus-card\">\r\n        <div class=\"tgus-decorator\" aria-hidden=\"true\">\r\n          <div class=\"tgus-decorator-grid\"><\/div>\r\n          <div class=\"tgus-decorator-box\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M13 2 3 14h7l-1 8 10-12h-7l1-8z\"\/><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n        <h3>AI automation, running on Smart Go Up<\/h3>\r\n        <p>Agents that answer calls, messages and inquiries around the clock. Workflows that move data between your systems on their own.<\/p>\r\n        <a class=\"tgus-card-link\" href=\"\/en\/ai-automation\/\">AI Automation <svg viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/a>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-glow-wrap\" data-paused=\"true\">\r\n        <div class=\"tgus-pspin tgus-pspin-blur\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"tgus-pspin tgus-pspin-intense\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"tgus-card\">\r\n        <div class=\"tgus-decorator\" aria-hidden=\"true\">\r\n          <div class=\"tgus-decorator-grid\"><\/div>\r\n          <div class=\"tgus-decorator-box\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M4 6h16M4 6l4-4M4 6l4 4M20 18H4M20 18l-4-4M20 18l-4 4\"\/><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n        <h3>Custom software<\/h3>\r\n        <p>Five in-house engineers building the apps, integrations and internal tools no platform covers.<\/p>\r\n        <a class=\"tgus-card-link\" href=\"\/en\/custom-software\/\">Custom Software <svg viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n  (function(){\r\n    var root = document.getElementById('tgus-pillars');\r\n    if(!root) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    \/* ---------- fade-in de cards + cierre ---------- *\/\r\n    var fadeEls = root.querySelectorAll('.tgus-glow-wrap, .tgus-close');\r\n    if(reduceMotion || !('IntersectionObserver' in window)){\r\n      fadeEls.forEach(function(el){ el.classList.add('tgus-in-view'); });\r\n    } else {\r\n      var io = new IntersectionObserver(function(entries){\r\n        entries.forEach(function(e){\r\n          if(e.isIntersecting){ e.target.classList.add('tgus-in-view'); io.unobserve(e.target); }\r\n        });\r\n      }, { threshold: .2 });\r\n      fadeEls.forEach(function(el){ io.observe(el); });\r\n    }\r\n\r\n    \/* ---------- pausar el glow de borde cuando la card sale de viewport ---------- *\/\r\n    var glowWraps = root.querySelectorAll('.tgus-glow-wrap');\r\n    if(glowWraps.length && !reduceMotion && 'IntersectionObserver' in window){\r\n      var spinIo = new IntersectionObserver(function(entries){\r\n        entries.forEach(function(e){ e.target.setAttribute('data-paused', e.isIntersecting ? 'false' : 'true'); });\r\n      }, { threshold: .1 });\r\n      glowWraps.forEach(function(el){ spinIo.observe(el); });\r\n    }\r\n\r\n    \/* ---------- reveal-sweep del headline ---------- *\/\r\n    var revealEl = root.querySelector('#tgus-pillars-reveal');\r\n    if(revealEl){\r\n      var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n      var TGUS_TEXT_COLOR = '#f4f4f8';\r\n      var BAND_HALF = 17;\r\n      var SWEEP_START = -BAND_HALF;\r\n      var SWEEP_END = 100 + BAND_HALF;\r\n\r\n      var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n      var buildGradient = function(pos){\r\n        var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n        if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n        var n = TGUS_COLORS.length, parts = [];\r\n        if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n        TGUS_COLORS.forEach(function(c, i){\r\n          var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n          parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n        });\r\n        if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n        return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n      };\r\n      var activateGradWord = function(lineEl){\r\n        var word = lineEl.querySelector('.tgus-grad-word');\r\n        if(word) word.classList.add('tgus-grad-active');\r\n      };\r\n      var sweepOne = function(el, duration){\r\n        var start = performance.now();\r\n        el.style.backgroundImage = buildGradient(SWEEP_START);\r\n        function tick(){\r\n          var t = Math.min((performance.now() - start) \/ duration, 1);\r\n          var pos = SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t);\r\n          el.style.backgroundImage = buildGradient(pos);\r\n          if(t < 1) requestAnimationFrame(tick);\r\n          else activateGradWord(el);\r\n        }\r\n        requestAnimationFrame(tick);\r\n      };\r\n\r\n      if(reduceMotion){\r\n        revealEl.style.backgroundImage = buildGradient(SWEEP_END);\r\n        activateGradWord(revealEl);\r\n      } else if('IntersectionObserver' in window){\r\n        var revealFired = false;\r\n        var revealIo = new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){\r\n            if(e.isIntersecting && !revealFired){\r\n              revealFired = true;\r\n              setTimeout(function(){ sweepOne(revealEl, 900); }, 150);\r\n            }\r\n          });\r\n        }, { threshold: .3 });\r\n        revealIo.observe(revealEl);\r\n      } else {\r\n        revealEl.style.backgroundImage = buildGradient(SWEEP_END);\r\n        activateGradWord(revealEl);\r\n      }\r\n    }\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5e5f98a elementor-widget elementor-widget-html\" data-id=\"5e5f98a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 10-tools-stack.html (Home \u2014 secci\u00f3n adicional: Our stack)\r\n  Portada de un componente de referencia (Integrations): contenido a\r\n  la izq (eyebrow+headline+lead+CTA) + grid disperso de logos de\r\n  herramientas a la der (posicionamiento absoluto en celdas de 72px,\r\n  m\u00e1scara radial), como el que ya usa togrowagencia.com\/ en su home.\r\n  Los logos son los mismos assets reales ya en uso en esa p\u00e1gina.\r\n  CTA dirige a la pesta\u00f1a de Custom Software.\r\n  Prefijo CSS: #tgus-tools\r\n  Pegar en widget HTML de Elementor (secci\u00f3n independiente del home,\r\n  despu\u00e9s de 01.7 Inside the platform o donde el usuario prefiera).\r\n============================================================= -->\r\n<section id=\"tgus-tools\">\r\n  <style>\r\n    #tgus-tools{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-bg-3: #1b1b27;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-tools *, #tgus-tools *::before, #tgus-tools *::after{ box-sizing: border-box; }\r\n\r\n    #tgus-tools .tgus-wrap{\r\n      max-width: 1180px; margin: 0 auto;\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      align-items: center;\r\n      gap: clamp(2.5rem, 6vw, 4rem);\r\n      position: relative; z-index: 1;\r\n    }\r\n\r\n    #tgus-tools .tgus-eyebrow{\r\n      display: inline-block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 1rem !important;\r\n    }\r\n    #tgus-tools h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.9rem, 4vw, 2.6rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.2 !important;\r\n      margin: 0 0 1.1rem !important;\r\n    }\r\n    #tgus-tools .tgus-reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-tools .tgus-grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-tools .tgus-grad-word.tgus-grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n\r\n    #tgus-tools .tgus-lead{\r\n      font-size: 1.02rem !important;\r\n      line-height: 1.65 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 0 1.75rem !important;\r\n      max-width: 42ch;\r\n    }\r\n    #tgus-tools .tgus-lead strong{ color: var(--tgus-text) !important; font-weight: 700 !important; }\r\n\r\n    \/* ---------- bot\u00f3n: mismo componente del hero ---------- *\/\r\n    #tgus-tools .tgus-btn-wrap{ position: relative; display: inline-block; isolation: isolate; }\r\n    #tgus-tools .tgus-btn{\r\n      --border-radius: 999px; --pad: 4px; --transition: .4s; --hue: 210deg;\r\n      position: relative; isolation: isolate; user-select: none;\r\n      display: flex; align-items: center; justify-content: center; gap: .5em;\r\n      padding: .7em .95em .7em 1.15em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .95rem !important; font-weight: 600 !important;\r\n      text-decoration: none !important; color: var(--tgus-text) !important;\r\n      background-color: #111219;\r\n      border: solid 1px rgba(255,255,255,.14);\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      box-shadow: inset 0 1px 1px rgba(255,255,255,.2), inset 0 2px 2px rgba(255,255,255,.15), inset 0 4px 4px rgba(255,255,255,.08);\r\n      transition: box-shadow var(--transition), border-color var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    #tgus-tools .tgus-btn::before{\r\n      content: ''; position: absolute; z-index: -1;\r\n      top: calc(-1 * var(--pad)); left: calc(-1 * var(--pad));\r\n      width: calc(100% + var(--pad) * 2); height: calc(100% + var(--pad) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--pad));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      box-shadow: 1px 1px 1px #fff2, 2px 2px 2px #fff1, -1px -1px 1px #0002, -2px -2px 2px #0001;\r\n      transition: box-shadow var(--transition);\r\n    }\r\n    #tgus-tools .tgus-btn::after{\r\n      content: ''; position: absolute; inset: 0; z-index: 1;\r\n      border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, hsl(var(--hue) 100% 70%), hsla(var(--hue),100%,70%,.5) 8%, transparent);\r\n      opacity: 0;\r\n      transition: opacity var(--transition);\r\n    }\r\n    #tgus-tools .tgus-btn:hover{ border-color: hsla(var(--hue),100%,80%,.4); transform: translateY(-1px); }\r\n    #tgus-tools .tgus-btn:hover::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); }\r\n    #tgus-tools .tgus-btn:active{ border-color: hsla(var(--hue),100%,80%,.7); background-color: hsla(var(--hue),50%,20%,.5); }\r\n    #tgus-tools .tgus-btn:focus-visible{ outline: 2px solid var(--tgus-cyan); outline-offset: 3px; }\r\n    #tgus-tools .tgus-btn-svg{ width: 1em; height: 1em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; }\r\n    #tgus-tools .tgus-letters{ position: relative; z-index: 2; display: inline-flex; }\r\n    #tgus-tools .tgus-letter{\r\n      position: relative; display: inline-block; color: currentColor;\r\n      opacity: 0; transform: translateY(4px);\r\n      animation: tgus-tools-letter-in .4s var(--tgus-ease) forwards;\r\n      animation-delay: calc(var(--i, 0) * 22ms);\r\n      transition: text-shadow .3s var(--tgus-ease);\r\n    }\r\n    #tgus-tools .tgus-btn:hover .tgus-letter{ text-shadow: 0 0 6px rgba(255,255,255,.55); }\r\n    @keyframes tgus-tools-letter-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    \/* ---------- grid disperso de logos ---------- *\/\r\n    #tgus-tools .tgus-tiles-outer{\r\n      display: flex;\r\n      justify-content: center;\r\n    }\r\n    #tgus-tools .tgus-tiles{\r\n      position: relative;\r\n      width: 360px; height: 360px;\r\n      -webkit-mask-image: radial-gradient(ellipse at center, #000, #000, transparent 78%);\r\n      mask-image: radial-gradient(ellipse at center, #000, #000, transparent 78%);\r\n      opacity: 0;\r\n      transform: translateY(18px);\r\n      transition: opacity .8s var(--tgus-ease), transform .8s var(--tgus-ease);\r\n    }\r\n    #tgus-tools .tgus-tiles.tgus-in-view{ opacity: 1; transform: translateY(0); }\r\n\r\n    #tgus-tools .tgus-tile{\r\n      position: absolute;\r\n      display: flex; align-items: center; justify-content: center;\r\n      width: 72px; height: 72px;\r\n      border-radius: 12px;\r\n      border: 1px solid var(--tgus-border);\r\n    }\r\n    #tgus-tools .tgus-tile.tgus-tile--logo{\r\n      background: var(--tgus-bg-2);\r\n      box-shadow: 0 2px 10px -4px rgba(0,0,0,.4);\r\n      transition: transform .3s var(--tgus-ease), border-color .3s var(--tgus-ease);\r\n    }\r\n    #tgus-tools .tgus-tile.tgus-tile--logo:hover{\r\n      transform: translateY(-3px);\r\n      border-color: rgba(94,200,242,.4);\r\n    }\r\n    #tgus-tools .tgus-tile.tgus-tile--empty{\r\n      background: rgba(255,255,255,.02);\r\n      border-style: dashed;\r\n    }\r\n    #tgus-tools .tgus-tile img{\r\n      width: 32px; height: 32px;\r\n      object-fit: contain;\r\n      pointer-events: none;\r\n      user-select: none;\r\n    }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-tools .tgus-tiles{ transition-duration: .01ms !important; opacity: 1 !important; transform: none !important; }\r\n      #tgus-tools .tgus-tile.tgus-tile--logo{ transition: none; }\r\n      #tgus-tools .tgus-grad-word.tgus-grad-active{ animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n    @media(max-width: 860px){\r\n      #tgus-tools .tgus-wrap{ grid-template-columns: 1fr; }\r\n      #tgus-tools .tgus-tiles-outer{ order: -1; }\r\n      #tgus-tools .tgus-tiles{ width: 300px; height: 300px; }\r\n      #tgus-tools .tgus-tile{ width: 60px; height: 60px; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div>\r\n      <span class=\"tgus-eyebrow\">our stack<\/span>\r\n      <h2><span class=\"tgus-reveal\" id=\"tgus-tools-reveal\">Built with the tools that <span class=\"tgus-grad-word\">actually scale<\/span><\/span><\/h2>\r\n      <p class=\"tgus-lead\">Smart Go Up for automation, and a modern engineering stack \u2014 React, Node.js, Go, Java \u2014 for everything we build custom. <strong>No shortcuts, no unfamiliar tooling.<\/strong><\/p>\r\n\r\n      <span class=\"tgus-btn-wrap\">\r\n        <a class=\"tgus-btn\" href=\"\/en\/custom-software\/\" aria-label=\"See our software services\">\r\n          <span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>See our software services<\/span>\r\n          <svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n        <\/a>\r\n      <\/span>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-tiles-outer\">\r\n      <div class=\"tgus-tiles\" id=\"tgus-tools-tiles\">\r\n        <!-- coordenadas en celdas de 72px, mismo patr\u00f3n disperso del componente de referencia -->\r\n        <div class=\"tgus-tile tgus-tile--empty\" style=\"left:72px; top:0px;\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:216px; top:0px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-2.png\" alt=\"Smart Go Up\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n\r\n        <div class=\"tgus-tile tgus-tile--empty\" style=\"left:0px; top:72px;\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:144px; top:72px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-11.png\" alt=\"React\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:288px; top:72px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-15.png\" alt=\"Node.js\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:72px; top:144px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-16.png\" alt=\"WordPress\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:216px; top:144px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-1.png\" alt=\"Go High Level\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n\r\n        <div class=\"tgus-tile tgus-tile--empty\" style=\"left:0px; top:216px;\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:144px; top:216px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-13.png\" alt=\"Go\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:288px; top:216px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-14.png\" alt=\"Java\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:72px; top:288px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-10.png\" alt=\"Elementor\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n        <div class=\"tgus-tile tgus-tile--logo\" style=\"left:216px; top:288px;\"><img src=\"https:\/\/togrowagencia.com\/wp-content\/uploads\/2025\/11\/Logo-tg-6.png\" alt=\"Google Analytics\" loading=\"lazy\" decoding=\"async\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n  (function(){\r\n    var root = document.getElementById('tgus-tools');\r\n    if(!root) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    root.querySelectorAll('[data-tgus-letters]').forEach(function(el){\r\n      var text = el.textContent;\r\n      el.textContent = '';\r\n      text.split('').forEach(function(ch, i){\r\n        var span = document.createElement('span');\r\n        span.className = 'tgus-letter';\r\n        span.style.setProperty('--i', i);\r\n        span.textContent = ch === ' ' ? '\\u00A0' : ch;\r\n        el.appendChild(span);\r\n      });\r\n    });\r\n\r\n    var tiles = root.querySelector('#tgus-tools-tiles');\r\n    if(tiles){\r\n      if(reduceMotion || !('IntersectionObserver' in window)){\r\n        tiles.classList.add('tgus-in-view');\r\n      } else {\r\n        var io = new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){\r\n            if(e.isIntersecting){ tiles.classList.add('tgus-in-view'); io.unobserve(tiles); }\r\n          });\r\n        }, { threshold: .2 });\r\n        io.observe(tiles);\r\n      }\r\n    }\r\n\r\n    var revealEl = root.querySelector('#tgus-tools-reveal');\r\n    if(revealEl){\r\n      var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n      var TGUS_TEXT_COLOR = '#f4f4f8';\r\n      var BAND_HALF = 17;\r\n      var SWEEP_START = -BAND_HALF;\r\n      var SWEEP_END = 100 + BAND_HALF;\r\n      var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n      var buildGradient = function(pos){\r\n        var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n        if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n        var n = TGUS_COLORS.length, parts = [];\r\n        if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n        TGUS_COLORS.forEach(function(c, i){\r\n          var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n          parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n        });\r\n        if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n        return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n      };\r\n      var activateGradWord = function(lineEl){ var w = lineEl.querySelector('.tgus-grad-word'); if(w) w.classList.add('tgus-grad-active'); };\r\n      var sweepOne = function(el, duration){\r\n        var start = performance.now();\r\n        el.style.backgroundImage = buildGradient(SWEEP_START);\r\n        function tick(){\r\n          var t = Math.min((performance.now() - start) \/ duration, 1);\r\n          el.style.backgroundImage = buildGradient(SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t));\r\n          if(t < 1) requestAnimationFrame(tick); else activateGradWord(el);\r\n        }\r\n        requestAnimationFrame(tick);\r\n      };\r\n      if(reduceMotion){ revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n      else if('IntersectionObserver' in window){\r\n        var revealFired = false;\r\n        new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){ if(e.isIntersecting && !revealFired){ revealFired = true; setTimeout(function(){ sweepOne(revealEl, 900); }, 150); } });\r\n        }, { threshold: .3 }).observe(revealEl);\r\n      } else { revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n    }\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fee1648 elementor-widget elementor-widget-html\" data-id=\"fee1648\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 05-process.html (Home \u2014 secci\u00f3n 01.5 \u00b7 How we work, v3)\r\n  Estructura de card completa, fiel al componente de referencia\r\n  (TimeLine_01): imagen arriba, t\u00edtulo + descripci\u00f3n (2 l\u00edneas\r\n  colapsada \/ completa activa), caja de bullets y bot\u00f3n de salida \u2014\r\n  visibles solo cuando la card est\u00e1 activa, no solo texto que se\r\n  trunca. Columna izquierda sticky con \u00edcono+n\u00famero+t\u00edtulo.\r\n  Reveal-sweep en el headline, coherente con el resto del sitio.\r\n  Prefijo CSS: #tgus-process\r\n  Pegar en widget HTML de Elementor, quinta secci\u00f3n del home.\r\n\r\n  CONTENIDO: las im\u00e1genes de cada card son placeholders abstractos\r\n  (mock de dashboard, no capturas reales) \u2014 reemplazar por capturas\r\n  reales de Smart Go Up \/ del proceso antes de publicar. Los bullets\r\n  son una estructuraci\u00f3n del copy del deck (no agregan datos nuevos,\r\n  no hay cifras).\r\n============================================================= -->\r\n<section id=\"tgus-process\">\r\n  <style>\r\n    #tgus-process{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-bg-3: #1b1b27;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-process *, #tgus-process *::before, #tgus-process *::after{ box-sizing: border-box; }\r\n\r\n    #tgus-process .tgus-wrap{ max-width: 860px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n    #tgus-process .tgus-head{ margin: 0 0 clamp(3.5rem, 7vw, 5rem); text-align: center; }\r\n    #tgus-process .tgus-eyebrow{\r\n      display: inline-block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 1rem !important;\r\n    }\r\n    #tgus-process h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.9rem, 4.2vw, 2.85rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.18 !important;\r\n      margin: 0 !important;\r\n    }\r\n    #tgus-process .tgus-reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-process .tgus-grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-process .tgus-grad-word.tgus-grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n\r\n    \/* ---------- timeline: filas meta(sticky) + card ---------- *\/\r\n    #tgus-process .tgus-entries{\r\n      display: flex;\r\n      flex-direction: column;\r\n      gap: clamp(2.5rem, 5vw, 3.5rem);\r\n    }\r\n    #tgus-process .tgus-entry{\r\n      position: relative;\r\n      display: flex;\r\n      flex-direction: column;\r\n      gap: 1rem;\r\n    }\r\n    @media(min-width: 720px){\r\n      #tgus-process .tgus-entry{ flex-direction: row; gap: clamp(1.5rem, 3vw, 2.25rem); }\r\n    }\r\n\r\n    #tgus-process .tgus-meta{\r\n      display: flex;\r\n      align-items: center;\r\n      gap: .85rem;\r\n      flex-shrink: 0;\r\n      width: 100%;\r\n    }\r\n    @media(min-width: 720px){\r\n      #tgus-process .tgus-meta{ position: sticky; top: 2rem; width: 168px; height: min-content; align-self: flex-start; }\r\n    }\r\n    #tgus-process .tgus-meta-icon{\r\n      display: flex; align-items: center; justify-content: center;\r\n      width: 38px; height: 38px;\r\n      border-radius: 11px;\r\n      flex-shrink: 0;\r\n      background: var(--tgus-bg-2);\r\n      color: #ffffff;\r\n      transition: background .3s var(--tgus-ease);\r\n    }\r\n    #tgus-process .tgus-entry[data-active=\"true\"] .tgus-meta-icon{\r\n      background: linear-gradient(135deg, var(--tgus-cyan), var(--tgus-violet));\r\n    }\r\n    #tgus-process .tgus-meta-icon svg{ width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.8; }\r\n    #tgus-process .tgus-meta-num{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: .78rem !important;\r\n      font-weight: 700 !important;\r\n      color: var(--tgus-cyan);\r\n      display: block;\r\n    }\r\n    #tgus-process .tgus-meta-title{\r\n      font-size: .92rem !important;\r\n      font-weight: 700 !important;\r\n      color: var(--tgus-text) !important;\r\n      display: block;\r\n    }\r\n\r\n    \/* ---------- card completa: imagen + t\u00edtulo\/desc + bullets + cta ---------- *\/\r\n    #tgus-process .tgus-card{\r\n      position: relative;\r\n      flex: 1;\r\n      min-width: 0;\r\n      border-radius: 20px;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-2);\r\n      padding: .6rem;\r\n      opacity: .55;\r\n      transform: scale(.98);\r\n      transition: opacity .4s var(--tgus-ease), transform .4s var(--tgus-ease), border-color .4s var(--tgus-ease), box-shadow .4s var(--tgus-ease);\r\n    }\r\n    #tgus-process .tgus-entry[data-active=\"true\"] .tgus-card{\r\n      opacity: 1;\r\n      transform: scale(1);\r\n      border-color: rgba(94,200,242,.35);\r\n      box-shadow: 0 20px 50px -30px rgba(94,200,242,.4);\r\n    }\r\n\r\n    \/* imagen: si alg\u00fan paso queda sin src real, el borde punteado y fondo\r\n       oscuro sirven de placeholder visual b\u00e1sico *\/\r\n    #tgus-process .tgus-card-media{\r\n      position: relative;\r\n      width: 100%;\r\n      aspect-ratio: 16\/9;\r\n      border-radius: 14px;\r\n      overflow: hidden;\r\n      margin-bottom: 1.1rem;\r\n      background: var(--tgus-bg-0);\r\n      border: 1px solid var(--tgus-border);\r\n    }\r\n    #tgus-process .tgus-card-media img{\r\n      position: absolute; inset: 0;\r\n      width: 100%; height: 100%;\r\n      object-fit: cover;\r\n      display: block;\r\n    }\r\n    #tgus-process .tgus-card-media::after{\r\n      content: '';\r\n      position: absolute; inset: 0;\r\n      background: linear-gradient(180deg, rgba(5,5,10,.1) 0%, rgba(5,5,10,.45) 100%);\r\n      pointer-events: none;\r\n    }\r\n\r\n    #tgus-process .tgus-card-body{ padding: .35rem .6rem .8rem; }\r\n\r\n    #tgus-process .tgus-card h3{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: 1.08rem !important;\r\n      font-weight: 700 !important;\r\n      margin: 0 0 .5rem !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      transition: color .35s var(--tgus-ease);\r\n    }\r\n    #tgus-process .tgus-entry[data-active=\"true\"] .tgus-card h3{ color: var(--tgus-text) !important; }\r\n\r\n    #tgus-process .tgus-card p{\r\n      font-size: .92rem !important;\r\n      line-height: 1.6 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      opacity: .8;\r\n      margin: 0 !important;\r\n      display: -webkit-box;\r\n      -webkit-box-orient: vertical;\r\n      overflow: hidden;\r\n      -webkit-line-clamp: 2;\r\n      transition: -webkit-line-clamp .3s var(--tgus-ease), opacity .35s var(--tgus-ease);\r\n    }\r\n    #tgus-process .tgus-entry[data-active=\"true\"] .tgus-card p{\r\n      -webkit-line-clamp: 10;\r\n      opacity: 1;\r\n    }\r\n\r\n    \/* bloque expandible: bullets + cta, solo visible en la card activa *\/\r\n    #tgus-process .tgus-card-expand{\r\n      display: grid;\r\n      grid-template-rows: 0fr;\r\n      opacity: 0;\r\n      transition: grid-template-rows .45s var(--tgus-ease), opacity .35s var(--tgus-ease);\r\n    }\r\n    #tgus-process .tgus-entry[data-active=\"true\"] .tgus-card-expand{\r\n      grid-template-rows: 1fr;\r\n      opacity: 1;\r\n    }\r\n    #tgus-process .tgus-card-expand-inner{ overflow: hidden; }\r\n    #tgus-process .tgus-card-list{\r\n      list-style: none;\r\n      margin: .9rem 0 0;\r\n      padding: .9rem 1rem;\r\n      border-radius: 12px;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-3);\r\n      display: grid;\r\n      gap: .55rem;\r\n    }\r\n    #tgus-process .tgus-card-list li{\r\n      display: flex;\r\n      align-items: flex-start;\r\n      gap: .55rem;\r\n      font-size: .88rem !important;\r\n      line-height: 1.5 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n    }\r\n    #tgus-process .tgus-card-list li::before{\r\n      content: '';\r\n      flex-shrink: 0;\r\n      margin-top: .5em;\r\n      width: 5px; height: 5px;\r\n      border-radius: 50%;\r\n      background: var(--tgus-cyan);\r\n    }\r\n\r\n    #tgus-process .tgus-card-cta{\r\n      display: flex;\r\n      justify-content: flex-start;\r\n      margin-top: .9rem;\r\n    }\r\n\r\n    \/* ---------- bot\u00f3n: mismo componente del hero (glow de borde v\u00eda --hue + letras animadas por JS) ---------- *\/\r\n    #tgus-process .tgus-btn-wrap{ position: relative; display: inline-block; isolation: isolate; }\r\n    #tgus-process .tgus-btn{\r\n      --border-radius: 999px;\r\n      --pad: 4px;\r\n      --transition: .4s;\r\n      --hue: 210deg;\r\n      position: relative;\r\n      isolation: isolate;\r\n      user-select: none;\r\n      display: flex; align-items: center; justify-content: center;\r\n      gap: .5em;\r\n      padding: .6em .85em .6em 1em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .85rem !important;\r\n      font-weight: 600 !important;\r\n      text-decoration: none !important;\r\n      color: var(--tgus-text) !important;\r\n      background-color: #111219;\r\n      border: solid 1px rgba(255,255,255,.14);\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      box-shadow:\r\n        inset 0 1px 1px rgba(255,255,255,.2),\r\n        inset 0 2px 2px rgba(255,255,255,.15),\r\n        inset 0 4px 4px rgba(255,255,255,.08);\r\n      transition: box-shadow var(--transition), border-color var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    #tgus-process .tgus-btn::before{\r\n      content: ''; position: absolute; z-index: -1;\r\n      top: calc(-1 * var(--pad)); left: calc(-1 * var(--pad));\r\n      width: calc(100% + var(--pad) * 2); height: calc(100% + var(--pad) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--pad));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      box-shadow: 1px 1px 1px #fff2, 2px 2px 2px #fff1, -1px -1px 1px #0002, -2px -2px 2px #0001;\r\n      transition: box-shadow var(--transition);\r\n    }\r\n    #tgus-process .tgus-btn::after{\r\n      content: ''; position: absolute; inset: 0; z-index: 1;\r\n      border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, hsl(var(--hue) 100% 70%), hsla(var(--hue),100%,70%,.5) 8%, transparent);\r\n      opacity: 0;\r\n      transition: opacity var(--transition);\r\n    }\r\n    #tgus-process .tgus-btn:hover{ border-color: hsla(var(--hue),100%,80%,.4); transform: translateY(-1px); }\r\n    #tgus-process .tgus-btn:hover::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); }\r\n    #tgus-process .tgus-btn:active{ border-color: hsla(var(--hue),100%,80%,.7); background-color: hsla(var(--hue),50%,20%,.5); }\r\n    #tgus-process .tgus-btn:focus-visible{ outline: 2px solid var(--tgus-cyan); outline-offset: 3px; }\r\n    #tgus-process .tgus-btn-svg{ width: 1em; height: 1em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; }\r\n\r\n    #tgus-process .tgus-letters{ position: relative; z-index: 2; display: inline-flex; }\r\n    #tgus-process .tgus-letter{\r\n      position: relative;\r\n      display: inline-block;\r\n      color: currentColor;\r\n      opacity: 0;\r\n      transform: translateY(4px);\r\n      animation: tgus-process-letter-in .4s var(--tgus-ease) forwards;\r\n      animation-delay: calc(var(--i, 0) * 22ms);\r\n      transition: text-shadow .3s var(--tgus-ease);\r\n    }\r\n    #tgus-process .tgus-btn:hover .tgus-letter{ text-shadow: 0 0 6px rgba(255,255,255,.55); }\r\n    @keyframes tgus-process-letter-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-process .tgus-card, #tgus-process .tgus-meta-icon, #tgus-process .tgus-card h3, #tgus-process .tgus-card-expand{\r\n        transition: none; opacity: 1 !important; transform: none !important; grid-template-rows: 1fr !important;\r\n      }\r\n      #tgus-process .tgus-grad-word.tgus-grad-active{ animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-head\">\r\n      <span class=\"tgus-eyebrow\">the process<\/span>\r\n      <h2><span class=\"tgus-reveal\" id=\"tgus-process-reveal\">We'll tell you <span class=\"tgus-grad-word\">what's worth automating<\/span> \u2014 and what isn't<\/span><\/h2>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-entries\" id=\"tgus-process-entries\">\r\n\r\n      <!-- 01 \u00b7 Discovery -->\r\n      <div class=\"tgus-entry\" data-active=\"true\">\r\n        <div class=\"tgus-meta\">\r\n          <span class=\"tgus-meta-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M11 4a7 7 0 1 0 4.9 12.02l4.54 4.54M11 4a7 7 0 0 1 7 7\"\/><path d=\"M11 4v7l4.9 5.02\"\/><\/svg><\/span>\r\n          <span><span class=\"tgus-meta-num\">01<\/span><span class=\"tgus-meta-title\">Discovery<\/span><\/span>\r\n        <\/div>\r\n        <div class=\"tgus-card\">\r\n          <div class=\"tgus-card-media\" aria-hidden=\"true\">\r\n            <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/business-team-brainstorm-idea-while-leader-write-sticky-notes-tracery-scaled.webp\" alt=\"Discovery\" loading=\"lazy\" decoding=\"async\">\r\n          <\/div>\r\n          <div class=\"tgus-card-body\">\r\n            <h3>Map how work actually moves<\/h3>\r\n            <p>We map how work actually moves through your business today: which steps are manual, which systems don't talk, where things get stuck. You get the map whether or not you hire us.<\/p>\r\n            <div class=\"tgus-card-expand\">\r\n              <div class=\"tgus-card-expand-inner\">\r\n                <ul class=\"tgus-card-list\">\r\n                  <li>Every manual step and disconnected system, laid out<\/li>\r\n                  <li>What's already working, flagged so we don't touch it<\/li>\r\n                  <li>A written map of your operation \u2014 yours to keep either way<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- 02 \u00b7 Scope -->\r\n      <div class=\"tgus-entry\">\r\n        <div class=\"tgus-meta\">\r\n          <span class=\"tgus-meta-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M9 11 12 14 22 4\"\/><path d=\"M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11\"\/><\/svg><\/span>\r\n          <span><span class=\"tgus-meta-num\">02<\/span><span class=\"tgus-meta-title\">Scope<\/span><\/span>\r\n        <\/div>\r\n        <div class=\"tgus-card\">\r\n          <div class=\"tgus-card-media\" aria-hidden=\"true\">\r\n            <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/streamlining-business-process-can-lead-greater-efficiency-cost-savings-scaled.webp\" alt=\"Scope\" loading=\"lazy\" decoding=\"async\">\r\n          <\/div>\r\n          <div class=\"tgus-card-body\">\r\n            <h3>What's worth building<\/h3>\r\n            <p>We come back with what's worth building, what it costs, and what it saves. Some things aren't worth automating. We'll say so.<\/p>\r\n            <div class=\"tgus-card-expand\">\r\n              <div class=\"tgus-card-expand-inner\">\r\n                <ul class=\"tgus-card-list\">\r\n                  <li>A prioritized list of what's worth building first<\/li>\r\n                  <li>Real cost and real savings \u2014 no guessing after the fact<\/li>\r\n                  <li>What we'd recommend leaving alone, and why<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- 03 \u00b7 Build -->\r\n      <div class=\"tgus-entry\">\r\n        <div class=\"tgus-meta\">\r\n          <span class=\"tgus-meta-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M13 2 3 14h7l-1 8 10-12h-7l1-8z\"\/><\/svg><\/span>\r\n          <span><span class=\"tgus-meta-num\">03<\/span><span class=\"tgus-meta-title\">Build<\/span><\/span>\r\n        <\/div>\r\n        <div class=\"tgus-card\">\r\n          <div class=\"tgus-card-media\" aria-hidden=\"true\">\r\n            <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/abstract-modern-tech-programming-code-screen-developer-c-programming-language-computer-script-scaled.webp\" alt=\"Build\" loading=\"lazy\" decoding=\"async\">\r\n          <\/div>\r\n          <div class=\"tgus-card-body\">\r\n            <h3>Delivered in stages<\/h3>\r\n            <p>We build in stages, and you see working software throughout. No six-month black box.<\/p>\r\n            <div class=\"tgus-card-expand\">\r\n              <div class=\"tgus-card-expand-inner\">\r\n                <ul class=\"tgus-card-list\">\r\n                  <li>Working software at every stage, not one big reveal<\/li>\r\n                  <li>You test and give feedback as we go<\/li>\r\n                  <li>No six-month build with no visibility in between<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- 04 \u00b7 Run and improve -->\r\n      <div class=\"tgus-entry\">\r\n        <div class=\"tgus-meta\">\r\n          <span class=\"tgus-meta-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 24 24\"><path d=\"M3 12a9 9 0 0 1 15.3-6.4L21 8M21 3v5h-5\"\/><path d=\"M21 12a9 9 0 0 1-15.3 6.4L3 16M3 21v-5h5\"\/><\/svg><\/span>\r\n          <span><span class=\"tgus-meta-num\">04<\/span><span class=\"tgus-meta-title\">Run and improve<\/span><\/span>\r\n        <\/div>\r\n        <div class=\"tgus-card\">\r\n          <div class=\"tgus-card-media\" aria-hidden=\"true\">\r\n            <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/programmer-colleague-office-training-machine-learning-algorithms-scaled.webp\" alt=\"Run and improve\" loading=\"lazy\" decoding=\"async\">\r\n          <\/div>\r\n          <div class=\"tgus-card-body\">\r\n            <h3>Same engineers, ongoing<\/h3>\r\n            <p>We monitor, tune and extend. Same engineers, same contact, no handoff to a support queue.<\/p>\r\n            <div class=\"tgus-card-expand\">\r\n              <div class=\"tgus-card-expand-inner\">\r\n                <ul class=\"tgus-card-list\">\r\n                  <li>The same engineers who built it keep monitoring and tuning it<\/li>\r\n                  <li>One point of contact, not a rotating support queue<\/li>\r\n                  <li>Extended as your operation changes, not left to age<\/li>\r\n                <\/ul>\r\n                <div class=\"tgus-card-cta\">\r\n                  <span class=\"tgus-btn-wrap\">\r\n                    <a class=\"tgus-btn\" href=\"https:\/\/api.whatsapp.com\/send?phone=573103597580\" aria-label=\"Talk to our team\" target=\"_blank\" rel=\"noopener\">\r\n                      <span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>Talk to our team<\/span>\r\n                      <svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n                    <\/a>\r\n                  <\/span>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n  (function(){\r\n    var root = document.getElementById('tgus-process');\r\n    if(!root) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    \/* ---------- letras animadas del bot\u00f3n (mismo mecanismo del hero) ---------- *\/\r\n    root.querySelectorAll('[data-tgus-letters]').forEach(function(el){\r\n      var text = el.textContent;\r\n      el.textContent = '';\r\n      text.split('').forEach(function(ch, i){\r\n        var span = document.createElement('span');\r\n        span.className = 'tgus-letter';\r\n        span.style.setProperty('--i', i);\r\n        span.textContent = ch === ' ' ? '\\u00A0' : ch;\r\n        el.appendChild(span);\r\n      });\r\n    });\r\n\r\n    \/* ---------- detecci\u00f3n de proximidad al scroll (portado del original React) ----------\r\n       En vez de sentinels + IntersectionObserver, se mide directamente la\r\n       distancia del centro de cada .tgus-meta al tercio superior del\r\n       viewport en cada frame \u2014 misma l\u00f3gica que el componente de\r\n       referencia (centerY = innerHeight\/3, distancia m\u00ednima gana). *\/\r\n    var entries = Array.prototype.slice.call(root.querySelectorAll('.tgus-entry'));\r\n    if(!entries.length) return;\r\n\r\n    if(reduceMotion){\r\n      entries.forEach(function(el){ el.setAttribute('data-active', 'true'); });\r\n    } else {\r\n      var metas = entries.map(function(el){ return el.querySelector('.tgus-meta'); });\r\n      var raf = null;\r\n      var lastActive = 0;\r\n\r\n      var tick = function(){\r\n        raf = requestAnimationFrame(tick);\r\n        var centerY = window.innerHeight \/ 3;\r\n        var bestIndex = 0;\r\n        var bestDist = Infinity;\r\n        metas.forEach(function(node, i){\r\n          if(!node) return;\r\n          var rect = node.getBoundingClientRect();\r\n          var mid = rect.top + rect.height \/ 2;\r\n          var dist = Math.abs(mid - centerY);\r\n          if(dist < bestDist){ bestDist = dist; bestIndex = i; }\r\n        });\r\n        if(bestIndex !== lastActive){\r\n          entries[lastActive].setAttribute('data-active', 'false');\r\n          entries[bestIndex].setAttribute('data-active', 'true');\r\n          lastActive = bestIndex;\r\n        }\r\n      };\r\n\r\n      if('IntersectionObserver' in window){\r\n        var runner = new IntersectionObserver(function(ioEntries){\r\n          ioEntries.forEach(function(e){\r\n            if(e.isIntersecting && raf === null){ raf = requestAnimationFrame(tick); }\r\n            else if(!e.isIntersecting && raf !== null){ cancelAnimationFrame(raf); raf = null; }\r\n          });\r\n        }, { rootMargin: '20% 0px 20% 0px' });\r\n        runner.observe(root);\r\n      } else {\r\n        raf = requestAnimationFrame(tick);\r\n      }\r\n    }\r\n\r\n    \/* ---------- reveal-sweep del headline ---------- *\/\r\n    var revealEl = root.querySelector('#tgus-process-reveal');\r\n    if(revealEl){\r\n      var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n      var TGUS_TEXT_COLOR = '#f4f4f8';\r\n      var BAND_HALF = 17;\r\n      var SWEEP_START = -BAND_HALF;\r\n      var SWEEP_END = 100 + BAND_HALF;\r\n\r\n      var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n      var buildGradient = function(pos){\r\n        var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n        if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n        var n = TGUS_COLORS.length, parts = [];\r\n        if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n        TGUS_COLORS.forEach(function(c, i){\r\n          var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n          parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n        });\r\n        if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n        return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n      };\r\n      var activateGradWord = function(lineEl){\r\n        var word = lineEl.querySelector('.tgus-grad-word');\r\n        if(word) word.classList.add('tgus-grad-active');\r\n      };\r\n      var sweepOne = function(el, duration){\r\n        var start = performance.now();\r\n        el.style.backgroundImage = buildGradient(SWEEP_START);\r\n        function tickSweep(){\r\n          var t = Math.min((performance.now() - start) \/ duration, 1);\r\n          var pos = SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t);\r\n          el.style.backgroundImage = buildGradient(pos);\r\n          if(t < 1) requestAnimationFrame(tickSweep);\r\n          else activateGradWord(el);\r\n        }\r\n        requestAnimationFrame(tickSweep);\r\n      };\r\n\r\n      if(reduceMotion){\r\n        revealEl.style.backgroundImage = buildGradient(SWEEP_END);\r\n        activateGradWord(revealEl);\r\n      } else if('IntersectionObserver' in window){\r\n        var revealFired = false;\r\n        var revealIo = new IntersectionObserver(function(ioEntries){\r\n          ioEntries.forEach(function(e){\r\n            if(e.isIntersecting && !revealFired){\r\n              revealFired = true;\r\n              setTimeout(function(){ sweepOne(revealEl, 900); }, 150);\r\n            }\r\n          });\r\n        }, { threshold: .3 });\r\n        revealIo.observe(revealEl);\r\n      } else {\r\n        revealEl.style.backgroundImage = buildGradient(SWEEP_END);\r\n        activateGradWord(revealEl);\r\n      }\r\n    }\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2d4b639 elementor-widget elementor-widget-html\" data-id=\"2d4b639\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 08-why-us.html (Home \u2014 secci\u00f3n 01.8 \u00b7 Why us, v4 \u00b7 banner\r\n  con globo interactivo, mecanismo d3-geo probado en producci\u00f3n)\r\n  Portado del globo 3D ya usado en la landing de SEO\r\n  (tgseo-bento-section): d3.geoOrthographic + canvas, dot-matrix de\r\n  continentes desde GeoJSON real (Natural Earth), drag para rotar,\r\n  auto-rotaci\u00f3n, tooltip por hit-detection en screen-space (mucho m\u00e1s\r\n  robusto que proyectar manualmente cada marcador cuadro a cuadro).\r\n  Layout banner: contenido a la izq (3 puntos numerados), globo a la\r\n  derecha. Ancho ampliado a 1360px (consistente con el resto del sitio).\r\n  Prefijo CSS: #tgus-why-us\r\n  Pegar en widget HTML de Elementor, octava secci\u00f3n del home.\r\n\r\n  CAMBIOS v4:\r\n  - max-width del wrap: 1180px \u2192 1360px.\r\n  - Los 3 \"facts\" (same working day \/ five engineers \/ Miami LLC) se\r\n    reemplazan por 3 puntos numerados (estrategia \/ procesos \/ crecimiento),\r\n    siguiendo el layout de referencia provisto por el usuario.\r\n  - Globo: array CITIES reemplazado por COUNTRIES \u2014 14 pa\u00edses reales\r\n    confirmados (Colombia = equipo de ingenier\u00eda \/ HQ t\u00e9cnico; el resto,\r\n    presencia de clientes). Tooltip simplificado: solo nombre del pa\u00eds,\r\n    sin sub-info.\r\n  - Los 3 hechos verificables que antes viv\u00edan en .tgus-facts (same\r\n    working day \/ five engineers \/ Miami LLC) siguen siendo reales y\r\n    verificados \u2014 si se quieren reincorporar en otra secci\u00f3n, est\u00e1n\r\n    documentados en el CONTEXTO del proyecto.\r\n============================================================= -->\r\n<section id=\"tgus-why-us\">\r\n  <style>\r\n    #tgus-why-us{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-why-us *, #tgus-why-us *::before, #tgus-why-us *::after{ box-sizing: border-box; }\r\n\r\n    \/* ---------- glow-frame: envoltorio con glow rotativo (portado del\r\n       componente Uiverse \"SelfMadeSystem\", v\u00eda SVG feColorMatrix + 3\r\n       capas de gradiente rotando). Envuelve .tgus-wrap. ---------- *\/\r\n    #tgus-why-us .tgus-glow-frame{\r\n      position: relative;\r\n      width: 100%;\r\n      max-width: 1360px; margin: 0 auto;\r\n      border-radius: 28px;\r\n    }\r\n    #tgus-why-us .tgus-glow-spin{\r\n      position: absolute;\r\n      inset: 0;\r\n      z-index: -2;\r\n      overflow: hidden;\r\n      border-radius: inherit;\r\n    }\r\n    #tgus-why-us .tgus-glow-spin-blur{ filter: blur(3em) url(#tgus-why-us-unopaq); }\r\n    #tgus-why-us .tgus-glow-spin-intense{\r\n      inset: -0.125em;\r\n      filter: blur(0.5em) url(#tgus-why-us-unopaq2);\r\n      border-radius: 29px;\r\n    }\r\n    #tgus-why-us .tgus-glow-spin-inside{\r\n      inset: -2px;\r\n      border-radius: inherit;\r\n      filter: blur(2px) url(#tgus-why-us-unopaq3);\r\n      z-index: 0;\r\n    }\r\n    #tgus-why-us .tgus-glow-spin::before{\r\n      content: \"\";\r\n      position: absolute;\r\n      inset: -30%;\r\n      animation: tgus-glow-speen 8s cubic-bezier(0.56, 0.15, 0.28, 0.86) infinite;\r\n    }\r\n    #tgus-why-us .tgus-glow-spin-blur::before{\r\n      background: linear-gradient(-45deg, var(--tgus-violet), #0000 46% 54%, var(--tgus-cyan));\r\n    }\r\n    #tgus-why-us .tgus-glow-spin-intense::before{\r\n      background: linear-gradient(-45deg, #a78cf9, #0000 35% 65%, #7fd4f7);\r\n    }\r\n    #tgus-why-us .tgus-glow-spin-inside::before{\r\n      background: linear-gradient(-45deg, #d6c8ff, #0000 35% 65%, #cdeeff);\r\n    }\r\n    @keyframes tgus-glow-speen{\r\n      0%{ rotate: 10deg; }\r\n      50%{ rotate: 190deg; }\r\n      to{ rotate: 370deg; }\r\n    }\r\n    #tgus-why-us .tgus-glow-border{\r\n      position: absolute;\r\n      inset: 0;\r\n      background: #0005;\r\n      border-radius: inherit;\r\n    }\r\n    #tgus-why-us .tgus-glow-spin.tgus-glow-paused::before{ animation-play-state: paused; }\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-why-us .tgus-glow-spin::before{ animation: none !important; rotate: 190deg !important; }\r\n    }\r\n\r\n    #tgus-why-us .tgus-wrap{\r\n      position: relative;\r\n      border-radius: 26px;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-2);\r\n      overflow: hidden;\r\n      padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.75rem, 5vw, 4rem);\r\n    }\r\n\r\n    \/* ---------- fondo de rayos WebGL (portado de SideRays, ogl.js),\r\n       esquina superior derecha, paleta cian\/violeta del sitio.\r\n       Vive detr\u00e1s del contenido pero encima del fondo de la card. ---------- *\/\r\n    #tgus-why-us .tgus-rays-container{\r\n      position: absolute;\r\n      inset: 0;\r\n      pointer-events: none;\r\n      z-index: 0;\r\n      overflow: hidden;\r\n    }\r\n    #tgus-why-us .tgus-rays-container canvas{\r\n      width: 100% !important;\r\n      height: 100% !important;\r\n      display: block;\r\n    }\r\n    #tgus-why-us .tgus-banner, #tgus-why-us .tgus-bucket{ position: relative; z-index: 1; }\r\n\r\n    #tgus-why-us .tgus-banner{\r\n      display: grid;\r\n      grid-template-columns: 1.05fr 1fr;\r\n      align-items: center;\r\n      gap: clamp(2rem, 5vw, 3.5rem);\r\n    }\r\n\r\n    #tgus-why-us .tgus-eyebrow{\r\n      display: inline-block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 1rem !important;\r\n    }\r\n    #tgus-why-us h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.75rem, 3.6vw, 2.5rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.2 !important;\r\n      margin: 0 0 1.1rem !important;\r\n    }\r\n    #tgus-why-us .tgus-reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-why-us .tgus-grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-why-us .tgus-grad-word.tgus-grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n\r\n    #tgus-why-us .tgus-lead{\r\n      font-size: 1rem !important;\r\n      line-height: 1.65 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 0 2rem !important;\r\n      max-width: 46ch;\r\n    }\r\n    #tgus-why-us .tgus-lead strong{ color: var(--tgus-text) !important; font-weight: 700 !important; }\r\n\r\n    \/* ---------- \"Bucket\": caja 3D abierta (CSS, isom\u00e9trica) + chip\r\n       flotante \u00fanico que rota entre los 3 puntos cada 2s, portado\r\n       del componente de referencia (React\/Framer Motion \u2192 vanilla\r\n       JS\/CSS). El chip entra deslizando desde arriba con scale,\r\n       permanece, y sale hacia abajo antes de que entre el siguiente. ---------- *\/\r\n    #tgus-why-us .tgus-bucket{\r\n      position: relative;\r\n      width: 100%;\r\n      max-width: 460px;\r\n      aspect-ratio: 655\/352;\r\n      margin: 0;\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip-zone{\r\n      position: absolute;\r\n      top: 0; left: 0; right: 0;\r\n      height: 34%;\r\n      display: flex; align-items: flex-start; justify-content: center;\r\n      z-index: 3;\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip{\r\n      position: absolute;\r\n      top: -18%;\r\n      display: flex; align-items: center; gap: .65rem;\r\n      padding: .6rem 1.1rem .6rem .6rem;\r\n      border-radius: 999px;\r\n      background: rgba(21,21,31,.88);\r\n      border: 1px solid rgba(255,255,255,.1);\r\n      backdrop-filter: blur(14px);\r\n      -webkit-backdrop-filter: blur(14px);\r\n      box-shadow: 0 18px 40px -14px rgba(0,0,0,.6), 0 1px 0 rgba(255,255,255,.06) inset;\r\n      width: max-content;\r\n      max-width: min(92%, 340px);\r\n      opacity: 0;\r\n      transform: translateY(-64px) scale(.82);\r\n      transition: opacity .5s cubic-bezier(.455,.03,.515,.955), transform .5s cubic-bezier(.455,.03,.515,.955);\r\n      pointer-events: none;\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip.is-active{\r\n      opacity: 1;\r\n      transform: translateY(0) scale(1);\r\n      transition: opacity .5s cubic-bezier(.455,.03,.515,.955), transform .5s cubic-bezier(.455,.03,.515,.955);\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip.is-leaving{\r\n      opacity: 0;\r\n      transform: translateY(48px) scale(.86);\r\n      transition: opacity .35s ease, transform .35s ease;\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip-icon{\r\n      flex-shrink: 0;\r\n      width: 36px; height: 36px;\r\n      display: flex; align-items: center; justify-content: center;\r\n      border-radius: 50%;\r\n      background: rgba(94,200,242,.14);\r\n      color: var(--tgus-cyan) !important;\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip-icon svg{ display: block; }\r\n    #tgus-why-us .tgus-bucket-chip-text{ display: flex; flex-direction: column; gap: .1rem; min-width: 0; }\r\n    #tgus-why-us .tgus-bucket-chip-title{\r\n      font-size: .88rem !important; font-weight: 700 !important;\r\n      color: var(--tgus-text) !important; line-height: 1.25 !important; margin: 0 !important;\r\n      white-space: normal;\r\n    }\r\n    #tgus-why-us .tgus-bucket-chip-desc{\r\n      font-size: .76rem !important; color: var(--tgus-text-dim) !important;\r\n      line-height: 1.3 !important; margin: 0 !important;\r\n      white-space: normal;\r\n    }\r\n\r\n    \/* caja de vidrio (SVG con paths\/filtros exactos del componente\r\n       original de referencia, namespaced tgus-wu-*) *\/\r\n    #tgus-why-us .tgus-box-svg{\r\n      position: absolute;\r\n      inset: 0;\r\n      z-index: 1;\r\n      overflow: visible;\r\n    }\r\n    #tgus-why-us .tgus-box-svg .tgus-box-panel{ fill: var(--tgus-bg-2); }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-why-us .tgus-bucket-chip{ transition: none !important; }\r\n    }\r\n    @media(max-width: 520px){\r\n      #tgus-why-us .tgus-bucket{ max-width: 340px; }\r\n      #tgus-why-us .tgus-bucket-chip{ max-width: 220px; padding: .45rem .8rem .45rem .45rem; }\r\n      #tgus-why-us .tgus-bucket-chip-icon{ width: 30px; height: 30px; }\r\n    }\r\n\r\n    \/* ---------- globo (d3-geo, canvas, dot-matrix) ---------- *\/\r\n    #tgus-why-us .tgus-globe-wrap{\r\n      position: relative;\r\n      display: flex; align-items: center; justify-content: center;\r\n      min-height: 320px;\r\n    }\r\n    #tgus-why-us .tgus-globe-canvas{\r\n      width: min(100%, 420px);\r\n      aspect-ratio: 1\/1;\r\n      cursor: grab;\r\n      opacity: 0;\r\n      transition: opacity 1s ease;\r\n      touch-action: none;\r\n    }\r\n    #tgus-why-us .tgus-globe-canvas:active{ cursor: grabbing; }\r\n\r\n    #tgus-why-us .tgus-globe-tooltip{\r\n      position: absolute; z-index: 5; pointer-events: none;\r\n      display: flex; align-items: center; gap: .4rem;\r\n      background: rgba(5,5,10,.92);\r\n      border: 1px solid rgba(255,255,255,.16);\r\n      padding: .4rem .75rem; border-radius: 10px;\r\n      font-size: .85rem !important; font-weight: 700 !important;\r\n      color: var(--tgus-text) !important;\r\n      white-space: nowrap;\r\n      transform: translate(-50%, -135%);\r\n      opacity: 0;\r\n      transition: opacity .15s ease;\r\n      box-shadow: 0 10px 24px -8px rgba(0,0,0,.6);\r\n    }\r\n    #tgus-why-us .tgus-globe-tooltip.is-visible{ opacity: 1; }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-why-us .tgus-grad-word.tgus-grad-active{ animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n    @media(max-width: 860px){\r\n      #tgus-why-us .tgus-banner{ grid-template-columns: 1fr; }\r\n      #tgus-why-us .tgus-globe-wrap{ order: -1; min-height: 280px; }\r\n    }\r\n  <\/style>\r\n\r\n  <svg style=\"position:absolute; width:0; height:0;\">\r\n    <filter id=\"tgus-why-us-unopaq\" y=\"-100%\" height=\"300%\" x=\"-100%\" width=\"300%\">\r\n      <feColorMatrix values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 5 0\"><\/feColorMatrix>\r\n    <\/filter>\r\n    <filter id=\"tgus-why-us-unopaq2\" y=\"-100%\" height=\"300%\" x=\"-100%\" width=\"300%\">\r\n      <feColorMatrix values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 10 0\"><\/feColorMatrix>\r\n    <\/filter>\r\n    <filter id=\"tgus-why-us-unopaq3\" y=\"-100%\" height=\"300%\" x=\"-100%\" width=\"300%\">\r\n      <feColorMatrix values=\"1 0 0 1 0  0 1 0 1 0  0 0 1 1 0  0 0 0 2 0\"><\/feColorMatrix>\r\n    <\/filter>\r\n  <\/svg>\r\n\r\n  <div class=\"tgus-glow-frame\">\r\n    <div class=\"tgus-glow-spin tgus-glow-spin-blur\"><\/div>\r\n    <div class=\"tgus-glow-spin tgus-glow-spin-intense\"><\/div>\r\n    <div class=\"tgus-glow-border\"><\/div>\r\n    <div class=\"tgus-glow-spin tgus-glow-spin-inside\"><\/div>\r\n    <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-rays-container\" id=\"tgus-why-us-rays\"><\/div>\r\n    <div class=\"tgus-banner\">\r\n      <div>\r\n        <span class=\"tgus-eyebrow\">why ToGrow<\/span>\r\n        <h2><span class=\"tgus-reveal\" id=\"tgus-why-us-reveal\">A U.S. company with an engineering team that <span class=\"tgus-grad-word\">works your hours<\/span><\/span><\/h2>\r\n        <p class=\"tgus-lead\">You're not hiring an agency that hands your project to a subcontractor. <strong>You're working directly with the people who build it.<\/strong><\/p>\r\n\r\n        <div class=\"tgus-bucket\" id=\"tgus-why-us-bucket\">\r\n      <div class=\"tgus-bucket-chip-zone\">\r\n        <div class=\"tgus-bucket-chip\" id=\"tgus-why-us-chip\">\r\n          <span class=\"tgus-bucket-chip-icon\" id=\"tgus-why-us-chip-icon\"><\/span>\r\n          <span class=\"tgus-bucket-chip-text\">\r\n            <span class=\"tgus-bucket-chip-title\" id=\"tgus-why-us-chip-title\"><\/span>\r\n            <span class=\"tgus-bucket-chip-desc\" id=\"tgus-why-us-chip-desc\"><\/span>\r\n          <\/span>\r\n        <\/div>\r\n      <\/div>\r\n      <svg class=\"tgus-box-svg\" viewBox=\"0 0 655 352\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" preserveAspectRatio=\"xMidYMid meet\">\r\n        <foreignObject x=\"443.561\" y=\"-10.5141\" width=\"211.24\" height=\"166.977\">\r\n          <div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" style=\"backdrop-filter:blur(11.03px); -webkit-backdrop-filter:blur(11.03px); clip-path:url(#tgus-wu-bgblur0-clip); height:100%; width:100%;\"><\/div>\r\n        <\/foreignObject>\r\n        <g filter=\"url(#tgus-wu-filter1)\">\r\n          <path d=\"M535.59 78.7427L487.973 42.8776L558.738 13.9516C562.902 12.2494 564.984 11.3984 567.143 11.5597C569.301 11.7211 571.233 12.8723 575.098 15.1747L590.22 24.1832C603.923 32.347 610.775 36.4289 610.372 42.0779C609.97 47.7269 602.609 50.7964 587.887 56.9354L535.59 78.7427Z\" fill=\"#c9d3dc\" fill-opacity=\"0.5\" shape-rendering=\"crispEdges\"\/>\r\n        <\/g>\r\n        <foreignObject x=\"-3.43323e-05\" y=\"-10.9516\" width=\"215.96\" height=\"167.786\">\r\n          <div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" style=\"backdrop-filter:blur(11.03px); -webkit-backdrop-filter:blur(11.03px); clip-path:url(#tgus-wu-bgblur1-clip); height:100%; width:100%;\"><\/div>\r\n        <\/foreignObject>\r\n        <g filter=\"url(#tgus-wu-filter2)\">\r\n              <path d=\"M123.116 79.1145L171.548 42.8776L97.2715 12.5164C94.8305 11.5186 93.61 11.0197 92.3446 11.1143C91.0793 11.2089 89.9465 11.8837 87.681 13.2334L56.155 32.0149C48.1832 36.7641 44.1973 39.1386 44.4205 42.4378C44.6438 45.737 48.9132 47.553 57.4522 51.1849L123.116 79.1145Z\" fill=\"#c9d3dc\" fill-opacity=\"0.5\" shape-rendering=\"crispEdges\"\/>\r\n            <\/g>\r\n            <foreignObject x=\"78.7048\" y=\"20.823\" width=\"501.297\" height=\"136.012\">\r\n              <div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" style=\"backdrop-filter:blur(11.03px); -webkit-backdrop-filter:blur(11.03px); clip-path:url(#tgus-wu-bgblur2-clip); height:100%; width:100%;\"><\/div>\r\n            <\/foreignObject>\r\n            <g filter=\"url(#tgus-wu-filter3)\">\r\n              <path d=\"M487.973 42.8774L171.548 42.8775L123.116 79.1144L535.59 78.7424L487.973 42.8774Z\" fill=\"url(#tgus-wu-grad0)\" fill-opacity=\"0.72\" shape-rendering=\"crispEdges\"\/>\r\n            <\/g>\r\n            <foreignObject x=\"78.7048\" y=\"20.823\" width=\"137.255\" height=\"136.012\">\r\n              <div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" style=\"backdrop-filter:blur(11.03px); -webkit-backdrop-filter:blur(11.03px); clip-path:url(#tgus-wu-bgblur3-clip); height:100%; width:100%;\"><\/div>\r\n            <\/foreignObject>\r\n            <g filter=\"url(#tgus-wu-filter4)\">\r\n              <path d=\"M171.548 78.9088V42.8774L123.116 79.1144L171.548 78.9088Z\" fill=\"#c9d3dc\" fill-opacity=\"0.38\" shape-rendering=\"crispEdges\"\/>\r\n            <\/g>\r\n            <g filter=\"url(#tgus-wu-filter5)\">\r\n              <path d=\"M487.973 78.9088V42.8774L536.404 79.1144L487.973 78.9088Z\" fill=\"#c9d3dc\" fill-opacity=\"0.38\" shape-rendering=\"crispEdges\"\/>\r\n            <\/g>\r\n\r\n            <g filter=\"url(#tgus-wu-filter0)\">\r\n              <path d=\"M512.766 79.1595L147.766 79.1624C136.453 79.1625 130.796 79.1626 127.281 82.6773C123.766 86.192 123.766 91.8488 123.766 103.162V327.159C123.766 338.473 123.766 344.13 127.281 347.645C130.796 351.159 136.453 351.159 147.766 351.159H512.766C524.08 351.159 529.737 351.159 533.252 347.645C536.766 344.13 536.766 338.473 536.766 327.159V103.159C536.766 91.8457 536.766 86.1888 533.252 82.6741C529.737 79.1594 524.08 79.1594 512.766 79.1595Z\" class=\"tgus-box-panel\"\/>\r\n            <\/g>\r\n\r\n            <g clip-path=\"url(#tgus-wu-center-clip)\">\r\n              <foreignObject x=\"0\" y=\"0\" width=\"655\" height=\"352\">\r\n                <div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" style=\"backdrop-filter:blur(60.03px); -webkit-backdrop-filter:blur(60.03px); height:100%; width:100%; background:rgba(255,255,255,.02); clip-path:path('M74.6011 164.033L123.116 79.1138L535.59 78.7419L581.532 164.469C588.006 176.55 591.243 182.59 588.568 187.06C585.892 191.529 579.039 191.529 565.333 191.529H90.5591C76.4759 191.529 69.4343 191.529 66.7781 186.953C64.1219 182.376 67.615 176.262 74.6011 164.033Z');\"><\/div>\r\n              <\/foreignObject>\r\n            <\/g>\r\n            <g filter=\"url(#tgus-wu-filter6)\">\r\n              <path d=\"M74.6011 164.033L123.116 79.1138L535.59 78.7419L581.532 164.469C588.006 176.55 591.243 182.59 588.568 187.06C585.892 191.529 579.039 191.529 565.333 191.529H90.5591C76.4759 191.529 69.4343 191.529 66.7781 186.953C64.1219 182.376 67.615 176.262 74.6011 164.033Z\" fill=\"#c9d3dc\" fill-opacity=\"0.5\" shape-rendering=\"crispEdges\"\/>\r\n            <\/g>\r\n\r\n            <defs>\r\n              <filter id=\"tgus-wu-filter0\" x=\"123.766\" y=\"79.1595\" width=\"413\" height=\"275.676\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"BackgroundImageFix\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/>\r\n                <feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i0\"\/>\r\n              <\/filter>\r\n              <filter id=\"tgus-wu-filter1\" x=\"443.561\" y=\"-10.5141\" width=\"211.24\" height=\"166.977\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"33.3087\"\/><feGaussianBlur stdDeviation=\"22.2058\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"tgus-wu-d1a\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"1.27808\"\/><feGaussianBlur stdDeviation=\"1.27808\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.22 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d1a\" result=\"tgus-wu-d1b\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"8.94656\"\/><feGaussianBlur stdDeviation=\"4.47328\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.09 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d1b\" result=\"tgus-wu-d1c\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"tgus-wu-d1c\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/><feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i1\"\/>\r\n              <\/filter>\r\n              <clipPath id=\"tgus-wu-bgblur0-clip\" transform=\"translate(-443.561 10.5141)\">\r\n                <path d=\"M535.59 78.7427L487.973 42.8776L558.738 13.9516C562.902 12.2494 564.984 11.3984 567.143 11.5597C569.301 11.7211 571.233 12.8723 575.098 15.1747L590.22 24.1832C603.923 32.347 610.775 36.4289 610.372 42.0779C609.97 47.7269 602.609 50.7964 587.887 56.9354L535.59 78.7427Z\"\/>\r\n              <\/clipPath>\r\n              <filter id=\"tgus-wu-filter2\" x=\"-3.43323e-05\" y=\"-10.9516\" width=\"215.96\" height=\"167.786\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"33.3087\"\/><feGaussianBlur stdDeviation=\"22.2058\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"tgus-wu-d2a\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"1.27808\"\/><feGaussianBlur stdDeviation=\"1.27808\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.22 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d2a\" result=\"tgus-wu-d2b\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"8.94656\"\/><feGaussianBlur stdDeviation=\"4.47328\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.09 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d2b\" result=\"tgus-wu-d2c\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"tgus-wu-d2c\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/><feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i2\"\/>\r\n              <\/filter>\r\n              <clipPath id=\"tgus-wu-bgblur1-clip\" transform=\"translate(3.43323e-05 10.9516)\">\r\n                <path d=\"M123.116 79.1145L171.548 42.8776L97.2715 12.5164C94.8305 11.5186 93.61 11.0197 92.3446 11.1143C91.0793 11.2089 89.9465 11.8837 87.681 13.2334L56.155 32.0149C48.1832 36.7641 44.1973 39.1386 44.4205 42.4378C44.6438 45.737 48.9132 47.553 57.4522 51.1849L123.116 79.1145Z\"\/>\r\n              <\/clipPath>\r\n              <filter id=\"tgus-wu-filter3\" x=\"78.7048\" y=\"20.823\" width=\"501.297\" height=\"136.012\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"33.3087\"\/><feGaussianBlur stdDeviation=\"22.2058\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"tgus-wu-d3a\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"1.27808\"\/><feGaussianBlur stdDeviation=\"1.27808\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.22 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d3a\" result=\"tgus-wu-d3b\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"8.94656\"\/><feGaussianBlur stdDeviation=\"4.47328\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.09 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d3b\" result=\"tgus-wu-d3c\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"tgus-wu-d3c\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/><feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i3\"\/>\r\n              <\/filter>\r\n              <clipPath id=\"tgus-wu-bgblur2-clip\" transform=\"translate(-78.7048 -20.823)\">\r\n                <path d=\"M487.973 42.8774L171.548 42.8775L123.116 79.1144L535.59 78.7424L487.973 42.8774Z\"\/>\r\n              <\/clipPath>\r\n              <filter id=\"tgus-wu-filter4\" x=\"78.7048\" y=\"20.823\" width=\"137.255\" height=\"136.012\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"33.3087\"\/><feGaussianBlur stdDeviation=\"22.2058\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"tgus-wu-d4a\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"1.27808\"\/><feGaussianBlur stdDeviation=\"1.27808\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.22 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d4a\" result=\"tgus-wu-d4b\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"8.94656\"\/><feGaussianBlur stdDeviation=\"4.47328\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.09 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d4b\" result=\"tgus-wu-d4c\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"tgus-wu-d4c\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/><feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i4\"\/>\r\n              <\/filter>\r\n              <clipPath id=\"tgus-wu-bgblur3-clip\" transform=\"translate(-78.7048 -20.823)\">\r\n                <path d=\"M171.548 78.9088V42.8774L123.116 79.1144L171.548 78.9088Z\"\/>\r\n              <\/clipPath>\r\n              <filter id=\"tgus-wu-filter5\" x=\"443.561\" y=\"20.823\" width=\"137.255\" height=\"136.012\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"33.3087\"\/><feGaussianBlur stdDeviation=\"22.2058\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"tgus-wu-d5a\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"1.27808\"\/><feGaussianBlur stdDeviation=\"1.27808\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.22 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d5a\" result=\"tgus-wu-d5b\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"8.94656\"\/><feGaussianBlur stdDeviation=\"4.47328\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.09 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d5b\" result=\"tgus-wu-d5c\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"tgus-wu-d5c\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/><feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i5\"\/>\r\n              <\/filter>\r\n              <filter id=\"tgus-wu-filter6\" x=\"21.477\" y=\"56.6875\" width=\"612.444\" height=\"212.562\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n                <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"33.3087\"\/><feGaussianBlur stdDeviation=\"22.2058\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"tgus-wu-d6a\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"1.27808\"\/><feGaussianBlur stdDeviation=\"1.27808\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.22 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d6a\" result=\"tgus-wu-d6b\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"8.94656\"\/><feGaussianBlur stdDeviation=\"4.47328\"\/><feComposite in2=\"hardAlpha\" operator=\"out\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.37  0 0 0 0 0.78  0 0 0 0 0.95  0 0 0 0.09 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"tgus-wu-d6b\" result=\"tgus-wu-d6c\"\/>\r\n                <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"tgus-wu-d6c\" result=\"shape\"\/>\r\n                <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 127 0\" result=\"hardAlpha\"\/>\r\n                <feOffset dy=\"5.51362\"\/><feGaussianBlur stdDeviation=\"1.83787\"\/>\r\n                <feComposite in2=\"hardAlpha\" operator=\"arithmetic\" k2=\"-1\" k3=\"1\"\/>\r\n                <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.16 0\"\/>\r\n                <feBlend mode=\"normal\" in2=\"shape\" result=\"tgus-wu-i6\"\/>\r\n              <\/filter>\r\n              <clipPath id=\"tgus-wu-center-clip\">\r\n                <rect x=\"123.766\" y=\"0\" width=\"413\" height=\"352\"\/>\r\n              <\/clipPath>\r\n              <linearGradient id=\"tgus-wu-grad0\" x1=\"329.353\" y1=\"42.8774\" x2=\"329.353\" y2=\"79.1144\" gradientUnits=\"userSpaceOnUse\">\r\n                <stop stop-color=\"#c9d3dc\" stop-opacity=\"0.35\"\/>\r\n                <stop offset=\"1\" stop-color=\"#c9d3dc\" stop-opacity=\"0.15\"\/>\r\n              <\/linearGradient>\r\n            <\/defs>\r\n          <\/svg>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-globe-wrap\" id=\"tgus-why-us-globe-wrap\">\r\n        <div class=\"tgus-globe-tooltip\" id=\"tgus-why-us-tooltip\"><\/div>\r\n        <canvas id=\"tgus-why-us-globe\" role=\"img\" aria-label=\"Map showing the countries where ToGrow has a team or clients\"><\/canvas>\r\n      <\/div>\r\n    <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n\r\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/d3\/7.9.0\/d3.min.js\" defer><\/script>\r\n\r\n  <script type=\"module\">\r\n  (function(){\r\n    var root = document.getElementById('tgus-why-us');\r\n    var container = root && root.querySelector('#tgus-why-us-rays');\r\n    if(!container) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    if(reduceMotion) return; \/* fondo est\u00e1tico: se omite el shader animado, la card queda solo con su fondo base *\/\r\n\r\n    function hexToRgb(hex){\r\n      var m = \/^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$\/i.exec(hex);\r\n      return m ? [parseInt(m[1],16)\/255, parseInt(m[2],16)\/255, parseInt(m[3],16)\/255] : [1,1,1];\r\n    }\r\n\r\n    var VERT = 'attribute vec2 position;\\nvoid main() {\\n  gl_Position = vec4(position, 0.0, 1.0);\\n}';\r\n    var FRAG = 'precision highp float;\\n\\n'\r\n      + 'uniform float iTime;\\nuniform vec2 iResolution;\\nuniform float iSpeed;\\n'\r\n      + 'uniform vec3 iRayColor1;\\nuniform vec3 iRayColor2;\\nuniform float iIntensity;\\nuniform float iSpread;\\n'\r\n      + 'uniform float iFlipX;\\nuniform float iFlipY;\\nuniform float iTilt;\\nuniform float iSaturation;\\n'\r\n      + 'uniform float iBlend;\\nuniform float iFalloff;\\nuniform float iOpacity;\\n\\n'\r\n      + 'float rayStrength(vec2 raySource, vec2 rayRefDirection, vec2 coord, float seedA, float seedB, float speed) {\\n'\r\n      + '  vec2 sourceToCoord = coord - raySource;\\n'\r\n      + '  float cosAngle = dot(normalize(sourceToCoord), rayRefDirection);\\n'\r\n      + '  return clamp(\\n'\r\n      + '    (0.45 + 0.15 * sin(cosAngle * seedA + iTime * speed)) +\\n'\r\n      + '    (0.3 + 0.2 * cos(-cosAngle * seedB + iTime * speed)),\\n'\r\n      + '    0.0, 1.0) *\\n'\r\n      + '    clamp((iResolution.x - length(sourceToCoord)) \/ iResolution.x, 0.5, 1.0);\\n'\r\n      + '}\\n\\n'\r\n      + 'void main() {\\n'\r\n      + '  vec2 fragCoord = gl_FragCoord.xy;\\n'\r\n      + '  if (iFlipX > 0.5) fragCoord.x = iResolution.x - fragCoord.x;\\n'\r\n      + '  if (iFlipY > 0.5) fragCoord.y = iResolution.y - fragCoord.y;\\n\\n'\r\n      + '  vec2 coord = vec2(fragCoord.x, iResolution.y - fragCoord.y);\\n'\r\n      + '  vec2 rayPos = vec2(iResolution.x * 1.1, -0.5 * iResolution.y);\\n\\n'\r\n      + '  float tiltRad = iTilt * 3.14159265 \/ 180.0;\\n'\r\n      + '  float cs = cos(tiltRad);\\n'\r\n      + '  float sn = sin(tiltRad);\\n'\r\n      + '  vec2 rel = coord - rayPos;\\n'\r\n      + '  vec2 tiltedCoord = vec2(rel.x * cs - rel.y * sn, rel.x * sn + rel.y * cs) + rayPos;\\n\\n'\r\n      + '  float halfSpread = iSpread * 0.275;\\n'\r\n      + '  vec2 rayRefDir1 = normalize(vec2(cos(0.785398 + halfSpread), sin(0.785398 + halfSpread)));\\n'\r\n      + '  vec2 rayRefDir2 = normalize(vec2(cos(0.785398 - halfSpread), sin(0.785398 - halfSpread)));\\n\\n'\r\n      + '  vec4 rays1 = vec4(iRayColor1, 1.0) * rayStrength(rayPos, rayRefDir1, tiltedCoord, 36.2214, 21.11349, iSpeed);\\n'\r\n      + '  vec4 rays2 = vec4(iRayColor2, 1.0) * rayStrength(rayPos, rayRefDir2, tiltedCoord, 22.3991, 18.0234, iSpeed * 0.2);\\n\\n'\r\n      + '  vec4 color = rays1 * (1.0 - iBlend) * 0.9 + rays2 * iBlend * 0.9;\\n\\n'\r\n      + '  float distanceToLight = length(fragCoord.xy - vec2(rayPos.x, iResolution.y - rayPos.y)) \/ iResolution.y;\\n'\r\n      + '  float brightness = iIntensity * 0.4 \/ pow(max(distanceToLight, 0.001), iFalloff);\\n'\r\n      + '  color.rgb *= brightness;\\n\\n'\r\n      + '  float gray = dot(color.rgb, vec3(0.299, 0.587, 0.114));\\n'\r\n      + '  color.rgb = mix(vec3(gray), color.rgb, iSaturation);\\n\\n'\r\n      + '  color.a = max(color.r, max(color.g, color.b)) * iOpacity;\\n'\r\n      + '  gl_FragColor = color;\\n'\r\n      + '}';\r\n\r\n    \/* config: paleta del sitio (cian + violeta), esquina top-right *\/\r\n    var CFG = {\r\n      speed: 1.6,\r\n      rayColor1: '#5ec8f2',\r\n      rayColor2: '#8b7cf6',\r\n      intensity: 1.1,\r\n      spread: 2,\r\n      flipX: 0, flipY: 0, \/* top-right *\/\r\n      tilt: 0,\r\n      saturation: 1.3,\r\n      blend: 0.6,\r\n      falloff: 1.7,\r\n      opacity: 0.5\r\n    };\r\n\r\n    import('https:\/\/cdn.jsdelivr.net\/npm\/ogl@1.0.3\/+esm').then(function(OGL){\r\n      var Renderer = OGL.Renderer, Program = OGL.Program, Triangle = OGL.Triangle, Mesh = OGL.Mesh;\r\n\r\n      var renderer = new Renderer({ dpr: Math.min(window.devicePixelRatio, 2), alpha: true });\r\n      var gl = renderer.gl;\r\n      gl.canvas.style.width = '100%';\r\n      gl.canvas.style.height = '100%';\r\n      container.appendChild(gl.canvas);\r\n\r\n      var uniforms = {\r\n        iTime: { value: 0 },\r\n        iResolution: { value: [1, 1] },\r\n        iSpeed: { value: CFG.speed },\r\n        iRayColor1: { value: hexToRgb(CFG.rayColor1) },\r\n        iRayColor2: { value: hexToRgb(CFG.rayColor2) },\r\n        iIntensity: { value: CFG.intensity },\r\n        iSpread: { value: CFG.spread },\r\n        iFlipX: { value: CFG.flipX },\r\n        iFlipY: { value: CFG.flipY },\r\n        iTilt: { value: CFG.tilt },\r\n        iSaturation: { value: CFG.saturation },\r\n        iBlend: { value: CFG.blend },\r\n        iFalloff: { value: CFG.falloff },\r\n        iOpacity: { value: CFG.opacity }\r\n      };\r\n\r\n      var geometry = new Triangle(gl);\r\n      var program = new Program(gl, { vertex: VERT, fragment: FRAG, uniforms: uniforms });\r\n      var mesh = new Mesh(gl, { geometry: geometry, program: program });\r\n\r\n      var running = false;\r\n      var rafId = null;\r\n\r\n      function updateSize(){\r\n        renderer.dpr = Math.min(window.devicePixelRatio, 2);\r\n        var w = container.clientWidth, h = container.clientHeight;\r\n        renderer.setSize(w, h);\r\n        uniforms.iResolution.value = [w * renderer.dpr, h * renderer.dpr];\r\n      }\r\n\r\n      function loop(t){\r\n        if(!running) return;\r\n        uniforms.iTime.value = t * 0.001;\r\n        try{ renderer.render({ scene: mesh }); rafId = requestAnimationFrame(loop); }\r\n        catch(e){ \/* contexto perdido u otro error de render: detener silenciosamente *\/ }\r\n      }\r\n\r\n      function start(){\r\n        if(running) return;\r\n        running = true;\r\n        updateSize();\r\n        rafId = requestAnimationFrame(loop);\r\n      }\r\n      function stop(){\r\n        running = false;\r\n        if(rafId){ cancelAnimationFrame(rafId); rafId = null; }\r\n      }\r\n\r\n      window.addEventListener('resize', updateSize);\r\n\r\n      if('IntersectionObserver' in window){\r\n        new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){ if(e.isIntersecting) start(); else stop(); });\r\n        }, { threshold: .05 }).observe(container);\r\n      } else {\r\n        start();\r\n      }\r\n    }).catch(function(){ \/* fallo al cargar ogl (red bloqueada, etc.): la card sigue vi\u00e9ndose bien sin el fondo de rayos *\/ });\r\n  })();\r\n  <\/script>\r\n\r\n  <script defer>\r\n  (function(){\r\n    var root = document.getElementById('tgus-why-us');\r\n    if(!root) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    \/* ---------- reveal-sweep del headline (mismo sistema del resto del sitio) ---------- *\/\r\n    var revealEl = root.querySelector('#tgus-why-us-reveal');\r\n    if(revealEl){\r\n      var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n      var TGUS_TEXT_COLOR = '#f4f4f8';\r\n      var BAND_HALF = 17;\r\n      var SWEEP_START = -BAND_HALF;\r\n      var SWEEP_END = 100 + BAND_HALF;\r\n      var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n      var buildGradient = function(pos){\r\n        var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n        if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n        var n = TGUS_COLORS.length, parts = [];\r\n        if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n        TGUS_COLORS.forEach(function(c, i){\r\n          var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n          parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n        });\r\n        if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n        return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n      };\r\n      var activateGradWord = function(lineEl){ var w = lineEl.querySelector('.tgus-grad-word'); if(w) w.classList.add('tgus-grad-active'); };\r\n      var sweepOne = function(el, duration){\r\n        var start = performance.now();\r\n        el.style.backgroundImage = buildGradient(SWEEP_START);\r\n        function tick(){\r\n          var t = Math.min((performance.now() - start) \/ duration, 1);\r\n          el.style.backgroundImage = buildGradient(SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t));\r\n          if(t < 1) requestAnimationFrame(tick); else activateGradWord(el);\r\n        }\r\n        requestAnimationFrame(tick);\r\n      };\r\n      if(reduceMotion){ revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n      else if('IntersectionObserver' in window){\r\n        var revealFired = false;\r\n        new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){ if(e.isIntersecting && !revealFired){ revealFired = true; setTimeout(function(){ sweepOne(revealEl, 900); }, 150); } });\r\n        }, { threshold: .3 }).observe(revealEl);\r\n      } else { revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n    }\r\n\r\n    \/* ---------- pausar el glow rotativo fuera de viewport (performance) ---------- *\/\r\n    var glowFrame = root.querySelector('.tgus-glow-frame');\r\n    if(glowFrame && 'IntersectionObserver' in window && !reduceMotion){\r\n      new IntersectionObserver(function(entries){\r\n        entries.forEach(function(e){\r\n          glowFrame.querySelectorAll('.tgus-glow-spin').forEach(function(s){\r\n            s.classList.toggle('tgus-glow-paused', !e.isIntersecting);\r\n          });\r\n        });\r\n      }, { threshold: .01 }).observe(glowFrame);\r\n    }\r\n\r\n    \/* ---------- \"Bucket\": chip flotante \u00fanico rotando entre los 3\r\n       puntos cada 2s (enter desde arriba con scale, leave hacia\r\n       abajo). Pausa fuera de viewport; con reduced-motion muestra\r\n       solo el primer punto fijo, sin animar. ---------- *\/\r\n    var BUCKET_ITEMS = [\r\n      {\r\n        title: 'Strategies built for your market',\r\n        desc: 'Adapted to how your market behaves',\r\n        icon: '<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><circle cx=\"12\" cy=\"12\" r=\"4.5\"\/><circle cx=\"12\" cy=\"12\" r=\"1\"\/><\/svg>'\r\n      },\r\n      {\r\n        title: 'Automated, measurable processes',\r\n        desc: 'Visibility into what is happening in real time',\r\n        icon: '<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 12h-4l-3 9L9 3l-3 9H2\"\/><\/svg>'\r\n      },\r\n      {\r\n        title: 'Growth that scales with you',\r\n        desc: 'Keeps working as your business grows',\r\n        icon: '<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M23 6l-9.5 9.5-5-5L1 18\"\/><path d=\"M17 6h6v6\"\/><\/svg>'\r\n      }\r\n    ];\r\n    var bucketEl = root.querySelector('#tgus-why-us-bucket');\r\n    var chipEl = root.querySelector('#tgus-why-us-chip');\r\n    if(bucketEl && chipEl){\r\n      var chipIconEl = root.querySelector('#tgus-why-us-chip-icon');\r\n      var chipTitleEl = root.querySelector('#tgus-why-us-chip-title');\r\n      var chipDescEl = root.querySelector('#tgus-why-us-chip-desc');\r\n      var bucketIndex = 0;\r\n      var bucketRunning = false;\r\n      var bucketTimer = null;\r\n\r\n      function paintChip(item){\r\n        chipIconEl.innerHTML = item.icon;\r\n        chipTitleEl.textContent = item.title;\r\n        chipDescEl.textContent = item.desc;\r\n      }\r\n\r\n      paintChip(BUCKET_ITEMS[0]);\r\n\r\n      if(reduceMotion){\r\n        chipEl.classList.add('is-active');\r\n      } else {\r\n        function cycleChip(){\r\n          chipEl.classList.remove('is-active');\r\n          chipEl.classList.add('is-leaving');\r\n          setTimeout(function(){\r\n            bucketIndex = (bucketIndex + 1) % BUCKET_ITEMS.length;\r\n            paintChip(BUCKET_ITEMS[bucketIndex]);\r\n            chipEl.classList.remove('is-leaving');\r\n            requestAnimationFrame(function(){ chipEl.classList.add('is-active'); });\r\n          }, 350);\r\n        }\r\n        function startBucket(){\r\n          if(bucketRunning) return;\r\n          bucketRunning = true;\r\n          requestAnimationFrame(function(){ chipEl.classList.add('is-active'); });\r\n          bucketTimer = setInterval(cycleChip, 2000);\r\n        }\r\n        function stopBucket(){\r\n          bucketRunning = false;\r\n          if(bucketTimer){ clearInterval(bucketTimer); bucketTimer = null; }\r\n        }\r\n        if('IntersectionObserver' in window){\r\n          new IntersectionObserver(function(entries){\r\n            entries.forEach(function(e){\r\n              if(e.isIntersecting) startBucket(); else stopBucket();\r\n            });\r\n          }, { threshold: .25 }).observe(bucketEl);\r\n        } else {\r\n          startBucket();\r\n        }\r\n      }\r\n    }\r\n  })();\r\n  <\/script>\r\n\r\n  <script defer>\r\n  (function(){\r\n    var canvas = document.getElementById('tgus-why-us-globe');\r\n    var tooltip = document.getElementById('tgus-why-us-tooltip');\r\n    if(!canvas) return;\r\n\r\n    var reduced = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    \/* presencia real confirmada en el proyecto \u2014 14 pa\u00edses.\r\n       Colombia = equipo de ingenier\u00eda \/ HQ t\u00e9cnico. El resto,\r\n       presencia de clientes confirmada. Agregar aqu\u00ed si se\r\n       confirman m\u00e1s pa\u00edses. Tooltip muestra solo el nombre. *\/\r\n    var COUNTRIES = [\r\n      { name: 'United States',       flag: '\ud83c\uddfa\ud83c\uddf8', lon: -98.58, lat: 39.83 },\r\n      { name: 'Colombia',            flag: '\ud83c\udde8\ud83c\uddf4', lon: -74.30, lat: 4.57  },\r\n      { name: 'Mexico',               flag: '\ud83c\uddf2\ud83c\uddfd', lon: -102.55, lat: 23.63 },\r\n      { name: 'Peru',                 flag: '\ud83c\uddf5\ud83c\uddea', lon: -75.02, lat: -9.19 },\r\n      { name: 'Dominican Republic',   flag: '\ud83c\udde9\ud83c\uddf4', lon: -70.16, lat: 18.74 },\r\n      { name: 'Panama',               flag: '\ud83c\uddf5\ud83c\udde6', lon: -80.78, lat: 8.54  },\r\n      { name: 'Guatemala',            flag: '\ud83c\uddec\ud83c\uddf9', lon: -90.23, lat: 15.78 },\r\n      { name: 'Argentina',            flag: '\ud83c\udde6\ud83c\uddf7', lon: -63.62, lat: -38.42 },\r\n      { name: 'El Salvador',          flag: '\ud83c\uddf8\ud83c\uddfb', lon: -88.90, lat: 13.79 },\r\n      { name: 'Chile',                flag: '\ud83c\udde8\ud83c\uddf1', lon: -71.54, lat: -35.68 },\r\n      { name: 'Switzerland',          flag: '\ud83c\udde8\ud83c\udded', lon: 8.23,   lat: 46.82 },\r\n      { name: 'Spain',                flag: '\ud83c\uddea\ud83c\uddf8', lon: -3.75,  lat: 40.46 },\r\n      { name: 'Australia',            flag: '\ud83c\udde6\ud83c\uddfa', lon: 133.78, lat: -25.27 },\r\n      { name: 'Netherlands',          flag: '\ud83c\uddf3\ud83c\uddf1', lon: 5.29,   lat: 52.13 }\r\n    ];\r\n\r\n    function startWhenReady(){\r\n      if(!window.d3){ setTimeout(startWhenReady, 50); return; }\r\n      boot();\r\n    }\r\n    startWhenReady();\r\n\r\n    function boot(){\r\n      var ctx = canvas.getContext('2d');\r\n      var wrap = canvas.parentElement;\r\n\r\n      var W = 0, H = 0, dpr = Math.min(window.devicePixelRatio || 1, 2);\r\n      var radius = 0;\r\n      var projection = d3.geoOrthographic().clipAngle(90);\r\n      var path = d3.geoPath(projection, ctx);\r\n      var graticule = d3.geoGraticule();\r\n\r\n      var rotation = [80, -12];\r\n      var autoRotate = !reduced;\r\n      var speed = 0.045;\r\n      var land = null;\r\n      var dots = [];\r\n      var markerScreenPos = [];\r\n\r\n      function sizeCanvas(){\r\n        W = wrap.clientWidth || 300;\r\n        H = W;\r\n        radius = (Math.min(W, H) \/ 2) * 0.94;\r\n        canvas.width = W * dpr;\r\n        canvas.height = H * dpr;\r\n        canvas.style.width = W + 'px';\r\n        canvas.style.height = H + 'px';\r\n        ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\r\n        projection.scale(radius).translate([W \/ 2, H \/ 2]);\r\n      }\r\n      sizeCanvas();\r\n      if('ResizeObserver' in window){\r\n        new ResizeObserver(function(){ sizeCanvas(); draw(); }).observe(wrap);\r\n      } else {\r\n        window.addEventListener('resize', function(){ sizeCanvas(); draw(); });\r\n      }\r\n\r\n      \/* ---- dot-matrix sobre las masas de tierra ---- *\/\r\n      function pointInRing(pt, ring){\r\n        var x = pt[0], y = pt[1], inside = false;\r\n        for(var i=0, j=ring.length-1; i<ring.length; j=i++){\r\n          var xi=ring[i][0], yi=ring[i][1], xj=ring[j][0], yj=ring[j][1];\r\n          var intersect = ((yi > y) !== (yj > y)) && (x < (xj - xi) * (y - yi) \/ (yj - yi) + xi);\r\n          if(intersect) inside = !inside;\r\n        }\r\n        return inside;\r\n      }\r\n      function pointInFeature(pt, feature){\r\n        var g = feature.geometry;\r\n        if(g.type === 'Polygon'){\r\n          if(!pointInRing(pt, g.coordinates[0])) return false;\r\n          for(var i=1;i<g.coordinates.length;i++){ if(pointInRing(pt, g.coordinates[i])) return false; }\r\n          return true;\r\n        }\r\n        if(g.type === 'MultiPolygon'){\r\n          for(var p=0;p<g.coordinates.length;p++){\r\n            var poly = g.coordinates[p];\r\n            if(pointInRing(pt, poly[0])){\r\n              var inHole = false;\r\n              for(var k=1;k<poly.length;k++){ if(pointInRing(pt, poly[k])){ inHole = true; break; } }\r\n              if(!inHole) return true;\r\n            }\r\n          }\r\n          return false;\r\n        }\r\n        return false;\r\n      }\r\n      function dotsForFeature(feature, spacingDeg){\r\n        var out = [];\r\n        var bounds = d3.geoBounds(feature);\r\n        var minLng = bounds[0][0], minLat = bounds[0][1], maxLng = bounds[1][0], maxLat = bounds[1][1];\r\n        for(var lng = minLng; lng <= maxLng; lng += spacingDeg){\r\n          for(var lat = minLat; lat <= maxLat; lat += spacingDeg){\r\n            if(pointInFeature([lng, lat], feature)) out.push([lng, lat]);\r\n          }\r\n        }\r\n        return out;\r\n      }\r\n\r\n      fetch('https:\/\/raw.githubusercontent.com\/martynafford\/natural-earth-geojson\/refs\/heads\/master\/110m\/physical\/ne_110m_land.json')\r\n        .then(function(r){ return r.json(); })\r\n        .then(function(json){\r\n          land = json;\r\n          var spacing = 1.3;\r\n          land.features.forEach(function(f){\r\n            dotsForFeature(f, spacing).forEach(function(d){ dots.push(d); });\r\n          });\r\n          draw();\r\n        })\r\n        .catch(function(){ draw(); });\r\n\r\n      function draw(){\r\n        ctx.clearRect(0, 0, W, H);\r\n\r\n        ctx.beginPath();\r\n        ctx.arc(W\/2, H\/2, radius, 0, 2*Math.PI);\r\n        ctx.fillStyle = '#0d0d16';\r\n        ctx.fill();\r\n        ctx.lineWidth = 1.1;\r\n        ctx.strokeStyle = 'rgba(255,255,255,.16)';\r\n        ctx.stroke();\r\n\r\n        ctx.beginPath(); path(graticule());\r\n        ctx.strokeStyle = 'rgba(255,255,255,.08)'; ctx.lineWidth = .6; ctx.stroke();\r\n\r\n        ctx.fillStyle = 'rgba(94,200,242,.55)';\r\n        for(var i=0;i<dots.length;i++){\r\n          var pr = projection(dots[i]);\r\n          if(!pr) continue;\r\n          ctx.beginPath();\r\n          ctx.arc(pr[0], pr[1], 1.15, 0, 2*Math.PI);\r\n          ctx.fill();\r\n        }\r\n\r\n        markerScreenPos = [];\r\n        for(var c=0;c<COUNTRIES.length;c++){\r\n          var country = COUNTRIES[c];\r\n          var vis = isFrontFacing([country.lon, country.lat]);\r\n          var pm = projection([country.lon, country.lat]);\r\n          if(!pm || !vis) continue;\r\n          ctx.save();\r\n          ctx.shadowColor = '#5ec8f2'; ctx.shadowBlur = 8;\r\n          ctx.fillStyle = '#5ec8f2';\r\n          ctx.beginPath(); ctx.arc(pm[0], pm[1], 3.4, 0, 2*Math.PI); ctx.fill();\r\n          ctx.restore();\r\n          markerScreenPos.push({ x: pm[0], y: pm[1], country: country });\r\n        }\r\n      }\r\n\r\n      function isFrontFacing(coord){\r\n        var r = projection.rotate();\r\n        var angle = d3.geoDistance(coord, [-r[0], -r[1]]);\r\n        return angle < Math.PI\/2;\r\n      }\r\n\r\n      \/* ---- animaci\u00f3n \/ auto-rotaci\u00f3n ---- *\/\r\n      var timer = d3.timer(function(){\r\n        if(autoRotate){\r\n          rotation[0] += speed;\r\n          projection.rotate(rotation);\r\n          draw();\r\n        }\r\n      });\r\n\r\n      if('IntersectionObserver' in window){\r\n        var io = new IntersectionObserver(function(es){\r\n          var visible = es[0].isIntersecting;\r\n          if(!dragging) autoRotate = visible && !reduced;\r\n        }, { threshold: .01 });\r\n        io.observe(canvas);\r\n      }\r\n\r\n      \/* ---- interacci\u00f3n: drag para rotar ---- *\/\r\n      var dragging = false, lastX = 0, lastY = 0;\r\n      function pointerDown(x, y){\r\n        dragging = true; autoRotate = false; lastX = x; lastY = y;\r\n        canvas.style.cursor = 'grabbing';\r\n      }\r\n      function pointerMove(x, y){\r\n        if(!dragging) return;\r\n        var dx = x - lastX, dy = y - lastY;\r\n        rotation[0] += dx * 0.35;\r\n        rotation[1] = Math.max(-85, Math.min(85, rotation[1] - dy * 0.35));\r\n        lastX = x; lastY = y;\r\n        projection.rotate(rotation);\r\n        draw();\r\n      }\r\n      function pointerUp(){\r\n        dragging = false;\r\n        canvas.style.cursor = 'grab';\r\n        setTimeout(function(){ if(!reduced) autoRotate = true; }, 400);\r\n      }\r\n\r\n      canvas.addEventListener('pointerdown', function(e){ pointerDown(e.clientX, e.clientY); });\r\n      window.addEventListener('pointermove', function(e){ pointerMove(e.clientX, e.clientY); });\r\n      window.addEventListener('pointerup', pointerUp);\r\n\r\n      \/* ---- tooltip de ubicaci\u00f3n (hover, hit-detection en screen-space) ---- *\/\r\n      if(tooltip){\r\n        canvas.addEventListener('mousemove', function(e){\r\n          if(dragging){ tooltip.classList.remove('is-visible'); return; }\r\n          var rect = canvas.getBoundingClientRect();\r\n          var mx = e.clientX - rect.left, my = e.clientY - rect.top;\r\n          var hit = null, best = 12;\r\n          for(var i=0;i<markerScreenPos.length;i++){\r\n            var m = markerScreenPos[i];\r\n            var d = Math.hypot(mx - m.x, my - m.y);\r\n            if(d < best){ best = d; hit = m; }\r\n          }\r\n          if(hit){\r\n            tooltip.textContent = hit.country.flag + '  ' + hit.country.name;\r\n            tooltip.style.left = hit.x + 'px';\r\n            tooltip.style.top = hit.y + 'px';\r\n            tooltip.classList.add('is-visible');\r\n            canvas.style.cursor = 'pointer';\r\n          } else {\r\n            tooltip.classList.remove('is-visible');\r\n            canvas.style.cursor = dragging ? 'grabbing' : 'grab';\r\n          }\r\n        });\r\n        canvas.addEventListener('mouseleave', function(){\r\n          tooltip.classList.remove('is-visible');\r\n        });\r\n      }\r\n\r\n      setTimeout(function(){ canvas.style.opacity = 1; }, 60);\r\n\r\n      window.addEventListener('beforeunload', function(){ timer.stop(); });\r\n    }\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9ca2d45 elementor-widget elementor-widget-html\" data-id=\"9ca2d45\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 06-featured-cases.html (Home \u2014 secci\u00f3n 01.6 \u00b7 Featured cases,\r\n  CONECTADO a WordPress\/JetEngine \u2014 muestra siempre los 3 casos m\u00e1s\r\n  recientes publicados como CPT \"case\")\r\n  Prefijo CSS: #tgus-featured-cases\r\n  Pegar en widget HTML de Elementor, sexta secci\u00f3n del home.\r\n\r\n  REQUIERE: tgus-cases-connect.php + el add-on\r\n  tgus-cases-connect-ADDON-home.php (shortcodes tgus_home_featured_cases\r\n  y tgus_home_featured_dots) pegados en el mismo snippet, \"Run everywhere\".\r\n============================================================= -->\r\n<section id=\"tgus-featured-cases\">\r\n  <style>\r\n    #tgus-featured-cases{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-1: #0d0d16;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-featured-cases *, #tgus-featured-cases *::before, #tgus-featured-cases *::after{ box-sizing: border-box; }\r\n\r\n    #tgus-featured-cases .tgus-wrap{ max-width: 1180px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n    #tgus-featured-cases .tgus-head{\r\n      display: flex;\r\n      align-items: flex-end;\r\n      justify-content: space-between;\r\n      gap: 1rem;\r\n      margin-bottom: clamp(1.75rem, 4vw, 2.5rem);\r\n    }\r\n    #tgus-featured-cases .tgus-eyebrow{\r\n      display: block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 .5rem !important;\r\n    }\r\n    #tgus-featured-cases h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.6rem, 3.2vw, 2.2rem) !important;\r\n      font-weight: 700 !important;\r\n      margin: 0 !important;\r\n    }\r\n\r\n    #tgus-featured-cases .tgus-carousel-controls{ display: flex; align-items: center; gap: .8rem; flex-shrink: 0; }\r\n    #tgus-featured-cases .tgus-car-dots{ display: flex; align-items: center; gap: .4rem; margin-right: .3rem; }\r\n    #tgus-featured-cases .tgus-car-dot{\r\n      width: 6px; height: 6px;\r\n      border-radius: 50%;\r\n      background: rgba(255,255,255,.18);\r\n      border: none;\r\n      padding: 0;\r\n      cursor: pointer;\r\n      transition: background .25s var(--tgus-ease), width .25s var(--tgus-ease);\r\n    }\r\n    #tgus-featured-cases .tgus-car-dot.is-active{ background: var(--tgus-cyan); width: 18px; border-radius: 3px; }\r\n    #tgus-featured-cases .tgus-car-btn{\r\n      width: 38px; height: 38px;\r\n      border-radius: 50%;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-2);\r\n      color: var(--tgus-text-dim);\r\n      display: flex; align-items: center; justify-content: center;\r\n      cursor: pointer;\r\n      transition: background .2s var(--tgus-ease), color .2s var(--tgus-ease), border-color .2s var(--tgus-ease);\r\n    }\r\n    #tgus-featured-cases .tgus-car-btn svg{ width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }\r\n    #tgus-featured-cases .tgus-car-btn:hover{ background: rgba(255,255,255,.06); color: var(--tgus-text); border-color: rgba(255,255,255,.18); }\r\n    #tgus-featured-cases .tgus-car-btn:disabled{ opacity: .35; cursor: default; }\r\n\r\n    #tgus-featured-cases .tgus-carousel-viewport{\r\n      overflow: hidden;\r\n      border-radius: 26px;\r\n    }\r\n    #tgus-featured-cases .tgus-carousel-track{\r\n      display: flex;\r\n      transition: transform .55s var(--tgus-ease);\r\n      will-change: transform;\r\n    }\r\n\r\n    #tgus-featured-cases .tgus-case{\r\n      flex: 0 0 100%;\r\n      width: 100%;\r\n      display: grid;\r\n      grid-template-columns: 1.05fr 1fr;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-2);\r\n    }\r\n\r\n    #tgus-featured-cases .tgus-case-media{ position: relative; min-height: 340px; }\r\n    #tgus-featured-cases .tgus-case-media img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }\r\n    #tgus-featured-cases .tgus-case-badge{\r\n      position: absolute; top: 18px; left: 18px; z-index: 3;\r\n      font-size: 11px !important; font-weight: 700 !important; letter-spacing: .04em;\r\n      padding: 6px 12px;\r\n      border-radius: 999px;\r\n      color: var(--tgus-text) !important;\r\n      background: rgba(20,20,30,.38);\r\n      border: 1px solid rgba(255,255,255,.28);\r\n      -webkit-backdrop-filter: blur(10px) saturate(160%);\r\n      backdrop-filter: blur(10px) saturate(160%);\r\n      box-shadow: inset 0 1px 0 rgba(255,255,255,.2);\r\n    }\r\n\r\n    #tgus-featured-cases .tgus-case-body{\r\n      padding: clamp(2rem, 4vw, 2.75rem);\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: center;\r\n    }\r\n    #tgus-featured-cases .tgus-case-headline{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.4rem, 2.6vw, 1.75rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.25 !important;\r\n      margin: 0 0 1.25rem !important;\r\n    }\r\n\r\n    #tgus-featured-cases .tgus-metric{\r\n      position: relative;\r\n      isolation: isolate;\r\n      overflow: hidden;\r\n      border-radius: 18px;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-1);\r\n      margin: 0 0 1.5rem;\r\n    }\r\n    #tgus-featured-cases .tgus-metric-region{ position: absolute; inset-block: 0; right: 0; z-index: 0; width: 62%; }\r\n    #tgus-featured-cases .tgus-metric-wash{ position: absolute; inset: 0; }\r\n    #tgus-featured-cases .tgus-metric-dots{\r\n      position: absolute; inset: 0;\r\n      -webkit-mask-image: linear-gradient(to right, transparent, #000 55%);\r\n      mask-image: linear-gradient(to right, transparent, #000 55%);\r\n      opacity: .5;\r\n    }\r\n    #tgus-featured-cases .tgus-metric-chart{ position: absolute; inset: 0; width: 100%; height: 100%; }\r\n    #tgus-featured-cases .tgus-metric-chart path.tgus-metric-line{ filter: drop-shadow(0 0 4px rgba(94,200,242,.55)); }\r\n\r\n    #tgus-featured-cases .tgus-metric-top{\r\n      position: relative; z-index: 1;\r\n      display: flex; align-items: flex-start; justify-content: space-between;\r\n      gap: .75rem;\r\n      padding: 1.2rem 1.3rem 0;\r\n    }\r\n    #tgus-featured-cases .tgus-metric-title{ font-size: .88rem !important; font-weight: 600 !important; color: var(--tgus-text) !important; }\r\n    #tgus-featured-cases .tgus-metric-change{\r\n      display: inline-flex; align-items: center; gap: .2rem;\r\n      font-size: .84rem !important; font-weight: 700 !important;\r\n      color: var(--tgus-cyan) !important;\r\n      flex-shrink: 0;\r\n    }\r\n    #tgus-featured-cases .tgus-metric-change svg{ width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2.4; }\r\n    #tgus-featured-cases .tgus-metric-total{\r\n      position: relative; z-index: 1;\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: 2.3rem !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1 !important;\r\n      color: var(--tgus-text) !important;\r\n      margin: 1rem 0 0 !important;\r\n      padding: 0 1.3rem;\r\n    }\r\n    #tgus-featured-cases .tgus-metric-footer{\r\n      position: relative; z-index: 1;\r\n      display: flex; align-items: center; justify-content: space-between;\r\n      gap: .75rem;\r\n      margin-top: 1.5rem;\r\n      padding: .75rem 1.3rem;\r\n      border-top: 1px solid rgba(255,255,255,.06);\r\n      background: rgba(9,9,16,.55);\r\n      -webkit-backdrop-filter: blur(2px);\r\n      backdrop-filter: blur(2px);\r\n    }\r\n    #tgus-featured-cases .tgus-metric-delta{ font-size: .84rem !important; }\r\n    #tgus-featured-cases .tgus-metric-delta b{ color: var(--tgus-cyan) !important; font-weight: 700 !important; }\r\n    #tgus-featured-cases .tgus-metric-delta span{ color: var(--tgus-text-dim) !important; }\r\n    #tgus-featured-cases .tgus-metric-stats{ display: flex; align-items: center; gap: .55rem; font-size: .76rem !important; color: var(--tgus-text-dim) !important; }\r\n    #tgus-featured-cases .tgus-metric-stats b{ color: var(--tgus-text) !important; font-weight: 700 !important; }\r\n    #tgus-featured-cases .tgus-metric-stats .tgus-metric-dot-sep{ opacity: .4; }\r\n\r\n    #tgus-featured-cases .tgus-testi{\r\n      display: flex;\r\n      align-items: flex-start;\r\n      gap: 1rem;\r\n      margin: 0 0 1.75rem;\r\n    }\r\n    #tgus-featured-cases .tgus-testi-avatar{\r\n      flex-shrink: 0;\r\n      width: 52px; height: 52px;\r\n      border-radius: 12px;\r\n      overflow: hidden;\r\n      background: var(--tgus-bg-1);\r\n      border: 1px solid var(--tgus-border);\r\n    }\r\n    #tgus-featured-cases .tgus-testi-avatar img{ width: 100%; height: 100%; object-fit: cover; display: block; }\r\n    #tgus-featured-cases .tgus-testi-body{ min-width: 0; }\r\n    #tgus-featured-cases .tgus-testi-quote{\r\n      font-size: .98rem !important;\r\n      line-height: 1.55 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 0 .6rem !important;\r\n    }\r\n    #tgus-featured-cases .tgus-testi-quote strong{ color: var(--tgus-text) !important; font-weight: 700 !important; }\r\n    #tgus-featured-cases .tgus-testi-name{ font-size: .9rem !important; font-weight: 700 !important; color: var(--tgus-text) !important; }\r\n    #tgus-featured-cases .tgus-testi-role{ font-size: .82rem !important; color: var(--tgus-cyan) !important; }\r\n\r\n    #tgus-featured-cases .tgus-btn-wrap{ position: relative; display: inline-block; isolation: isolate; align-self: flex-start; }\r\n    #tgus-featured-cases .tgus-btn{\r\n      --border-radius: 999px;\r\n      --pad: 4px;\r\n      --transition: .4s;\r\n      --hue: 210deg;\r\n      position: relative;\r\n      isolation: isolate;\r\n      user-select: none;\r\n      display: flex; align-items: center; justify-content: center;\r\n      gap: .5em;\r\n      padding: .7em .95em .7em 1.15em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .92rem !important;\r\n      font-weight: 600 !important;\r\n      text-decoration: none !important;\r\n      color: var(--tgus-text) !important;\r\n      background-color: #111219;\r\n      border: solid 1px rgba(255,255,255,.14);\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      box-shadow: inset 0 1px 1px rgba(255,255,255,.2), inset 0 2px 2px rgba(255,255,255,.15), inset 0 4px 4px rgba(255,255,255,.08);\r\n      transition: box-shadow var(--transition), border-color var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    #tgus-featured-cases .tgus-btn::before{\r\n      content: ''; position: absolute; z-index: -1;\r\n      top: calc(-1 * var(--pad)); left: calc(-1 * var(--pad));\r\n      width: calc(100% + var(--pad) * 2); height: calc(100% + var(--pad) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--pad));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      box-shadow: 1px 1px 1px #fff2, 2px 2px 2px #fff1, -1px -1px 1px #0002, -2px -2px 2px #0001;\r\n      transition: box-shadow var(--transition);\r\n    }\r\n    #tgus-featured-cases .tgus-btn::after{\r\n      content: ''; position: absolute; inset: 0; z-index: 1;\r\n      border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, hsl(var(--hue) 100% 70%), hsla(var(--hue),100%,70%,.5) 8%, transparent);\r\n      opacity: 0;\r\n      transition: opacity var(--transition);\r\n    }\r\n    #tgus-featured-cases .tgus-btn:hover{ border-color: hsla(var(--hue),100%,80%,.4); transform: translateY(-1px); }\r\n    #tgus-featured-cases .tgus-btn:hover::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); }\r\n    #tgus-featured-cases .tgus-btn:active{ border-color: hsla(var(--hue),100%,80%,.7); background-color: hsla(var(--hue),50%,20%,.5); }\r\n    #tgus-featured-cases .tgus-btn:focus-visible{ outline: 2px solid var(--tgus-cyan); outline-offset: 3px; }\r\n    #tgus-featured-cases .tgus-btn-svg{ width: 1em; height: 1em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; }\r\n    #tgus-featured-cases .tgus-letters{ position: relative; z-index: 2; display: inline-flex; }\r\n    #tgus-featured-cases .tgus-letter{\r\n      position: relative; display: inline-block; color: currentColor;\r\n      opacity: 0; transform: translateY(4px);\r\n      animation: tgus-fc-letter-in .4s var(--tgus-ease) forwards;\r\n      animation-delay: calc(var(--i, 0) * 22ms);\r\n      transition: text-shadow .3s var(--tgus-ease);\r\n    }\r\n    #tgus-featured-cases .tgus-btn:hover .tgus-letter{ text-shadow: 0 0 6px rgba(255,255,255,.55); }\r\n    @keyframes tgus-fc-letter-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-featured-cases .tgus-carousel-track{ transition: none; }\r\n    }\r\n    @media(max-width: 860px){\r\n      #tgus-featured-cases .tgus-case{ grid-template-columns: 1fr; }\r\n      #tgus-featured-cases .tgus-case-media{ min-height: 260px; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-head\">\r\n      <div>\r\n        <span class=\"tgus-eyebrow\">case studies<\/span>\r\n        <h2>Three teams that stopped doing this by hand<\/h2>\r\n      <\/div>\r\n      <div class=\"tgus-carousel-controls\">\r\n        <div class=\"tgus-car-dots\" id=\"tgus-fc-dots\">\r\n          <button class=\"tgus-car-dot is-active\" type=\"button\" data-goto=\"0\" aria-label=\"Case 1\"><\/button>\r\n        <\/div>\r\n        <button class=\"tgus-car-btn\" type=\"button\" data-dir=\"-1\" aria-label=\"Previous case\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M15 18 9 12l6-6\"\/><\/svg>\r\n        <\/button>\r\n        <button class=\"tgus-car-btn\" type=\"button\" data-dir=\"1\" aria-label=\"Next case\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M9 18l6-6-6-6\"\/><\/svg>\r\n        <\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-carousel-viewport\">\r\n      <div class=\"tgus-carousel-track\" id=\"tgus-fc-track\">\r\n        <div class=\"tgus-case\"><div class=\"tgus-case-media\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/casoapple12-717x1024.webp\" alt=\"A custom CRM built for how a travel agency actually sells\" loading=\"lazy\" decoding=\"async\"><span class=\"tgus-case-badge\">Software development<\/span><\/div><div class=\"tgus-case-body\"><h3 class=\"tgus-case-headline\">A custom CRM built for how a travel agency actually sells<\/h3><div class=\"tgus-metric\"><div class=\"tgus-metric-region\"><div class=\"tgus-metric-wash\" aria-hidden=\"true\"><\/div><svg class=\"tgus-metric-dots\" viewBox=\"0 0 200 140\" aria-hidden=\"true\"><defs><pattern id=\"tgus-fc-dots-1\" width=\"14\" height=\"14\" patternUnits=\"userSpaceOnUse\"><circle cx=\"1\" cy=\"1\" r=\"1\" fill=\"#ffffff\"\/><\/pattern><\/defs><rect width=\"100%\" height=\"100%\" fill=\"url(#tgus-fc-dots-1)\"\/><\/svg><svg class=\"tgus-metric-chart\" viewBox=\"0 0 200 140\" fill=\"none\" preserveAspectRatio=\"none\" aria-hidden=\"true\" data-points=\"160,180,175,210,240,235,280,310,295,340,380,365,420\"><path class=\"tgus-metric-area\" fill=\"url(#tgus-fc-metric-fill)\"\/><path class=\"tgus-metric-line\" stroke=\"#5ec8f2\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" fill=\"none\"\/><\/svg><\/div><div class=\"tgus-metric-top\"><span class=\"tgus-metric-title\">Tickets resolved per agent<\/span><span class=\"tgus-metric-change\"><svg viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M12 19V5M5 12l7-7 7 7\"\/><\/svg>31.4%<\/span><\/div><p class=\"tgus-metric-total\">1,860<\/p><div class=\"tgus-metric-footer\"><div class=\"tgus-metric-delta\"><b>+14<\/b> <span>today<\/span><\/div><div class=\"tgus-metric-stats\"><span><b>420<\/b> peak<\/span><span class=\"tgus-metric-dot-sep\">\u00b7<\/span><span><b>160<\/b> low<\/span><span class=\"tgus-metric-dot-sep\">\u00b7<\/span><span><b>290<\/b> avg<\/span><\/div><\/div><\/div><div class=\"tgus-testi\"><span class=\"tgus-testi-avatar\"><img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/medium-shot-woman-posing-office-683x1024.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\"><\/span><div class=\"tgus-testi-body\"><p class=\"tgus-testi-quote\">Before, every quote lived in someone&#039;s WhatsApp. Now the whole team can see where every trip stands, and nothing gets lost between &quot;I&#039;ll check and get back to you.&quot;<\/p><p class=\"tgus-testi-name\">Laura G\u00f3mez<\/p><p class=\"tgus-testi-role\">Client Service Coordinator, Apple Travel<\/p><\/div><\/div><span class=\"tgus-btn-wrap\"><a class=\"tgus-btn\" href=\"https:\/\/togrowagencia.com\/en\/case\/apple-travel\/\" aria-label=\"See the full case\"><span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>See the full case<\/span><svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/a><\/span><\/div><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- gradiente compartido para el \u00e1rea de las gr\u00e1ficas -->\r\n  <svg width=\"0\" height=\"0\" style=\"position:absolute\">\r\n    <defs>\r\n      <linearGradient id=\"tgus-fc-metric-fill\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\r\n        <stop offset=\"0%\" stop-color=\"#5ec8f2\" stop-opacity=\".22\"\/>\r\n        <stop offset=\"100%\" stop-color=\"#5ec8f2\" stop-opacity=\"0\"\/>\r\n      <\/linearGradient>\r\n    <\/defs>\r\n  <\/svg>\r\n\r\n  <script>\r\n  (function(){\r\n    var root = document.getElementById('tgus-featured-cases');\r\n    if(!root) return;\r\n\r\n    \/* ---------- letras animadas de los botones ---------- *\/\r\n    root.querySelectorAll('[data-tgus-letters]').forEach(function(el){\r\n      var text = el.textContent;\r\n      el.textContent = '';\r\n      text.split('').forEach(function(ch, i){\r\n        var span = document.createElement('span');\r\n        span.className = 'tgus-letter';\r\n        span.style.setProperty('--i', i);\r\n        span.textContent = ch === ' ' ? '\\u00A0' : ch;\r\n        el.appendChild(span);\r\n      });\r\n    });\r\n\r\n    \/* ---------- dibujar cada gr\u00e1fica de l\u00ednea a partir de data-points ---------- *\/\r\n    root.querySelectorAll('.tgus-metric-chart').forEach(function(svg){\r\n      var raw = svg.getAttribute('data-points');\r\n      if(!raw) return;\r\n      var vals = raw.split(',').map(Number).filter(function(n){ return !isNaN(n); });\r\n      if(!vals.length) return;\r\n      var W = 200, H = 140, PAD = 10;\r\n      var min = Math.min.apply(null, vals), max = Math.max.apply(null, vals);\r\n      var range = (max - min) || 1;\r\n      var stepX = (W - PAD * 2) \/ (vals.length - 1 || 1);\r\n      var pts = vals.map(function(v, i){\r\n        var x = PAD + i * stepX;\r\n        var y = PAD + (1 - (v - min) \/ range) * (H - PAD * 2);\r\n        return [x, y];\r\n      });\r\n      var line = 'M' + pts.map(function(p){ return p[0].toFixed(1) + ',' + p[1].toFixed(1); }).join(' L');\r\n      var area = line + ' L' + pts[pts.length - 1][0].toFixed(1) + ',' + H + ' L' + pts[0][0].toFixed(1) + ',' + H + ' Z';\r\n      var lineEl = svg.querySelector('.tgus-metric-line');\r\n      var areaEl = svg.querySelector('.tgus-metric-area');\r\n      if(lineEl) lineEl.setAttribute('d', line);\r\n      if(areaEl) areaEl.setAttribute('d', area);\r\n    });\r\n\r\n    \/* ---------- carrusel: 1 slide completo, con flechas + dots ---------- *\/\r\n    var track = document.getElementById('tgus-fc-track');\r\n    var slides = Array.prototype.slice.call(root.querySelectorAll('.tgus-case'));\r\n    var prevBtn = root.querySelector('.tgus-car-btn[data-dir=\"-1\"]');\r\n    var nextBtn = root.querySelector('.tgus-car-btn[data-dir=\"1\"]');\r\n    var dots = Array.prototype.slice.call(root.querySelectorAll('.tgus-car-dot'));\r\n    if(!track || !slides.length) return;\r\n\r\n    var index = 0;\r\n    function goTo(i){\r\n      index = Math.max(0, Math.min(slides.length - 1, i));\r\n      track.style.transform = 'translateX(-' + (index * 100) + '%)';\r\n      dots.forEach(function(d, di){ d.classList.toggle('is-active', di === index); });\r\n      if(prevBtn) prevBtn.disabled = index === 0;\r\n      if(nextBtn) nextBtn.disabled = index === slides.length - 1;\r\n    }\r\n    if(prevBtn) prevBtn.addEventListener('click', function(){ goTo(index - 1); });\r\n    if(nextBtn) nextBtn.addEventListener('click', function(){ goTo(index + 1); });\r\n    dots.forEach(function(d){\r\n      d.addEventListener('click', function(){ goTo(parseInt(d.getAttribute('data-goto'), 10)); });\r\n    });\r\n    goTo(0);\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-54a3b6c elementor-widget elementor-widget-html\" data-id=\"54a3b6c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 07-platform.html (Home \u2014 secci\u00f3n 01.7 \u00b7 Inside the platform)\r\n  Copy final del deck v2. Reutiliza el mecanismo bento grid ya\r\n  construido en la p\u00e1gina de AI Automation (tgus-aa-platform: hero\r\n  card con glow rotativo + capturas, cards con \u00edcono flip 3D),\r\n  namespaced a #tgus-platform para el home, con el copy y los 5\r\n  bullets que pide esta secci\u00f3n del deck.\r\n  Prefijo CSS: #tgus-platform\r\n  Pegar en widget HTML de Elementor, s\u00e9ptima secci\u00f3n del home.\r\n\r\n  CONTENIDO: capturas reales de Smart Go Up (m\u00ednimo 3) son\r\n  bloqueantes de lanzamiento seg\u00fan el deck \u2014 las im\u00e1genes actuales\r\n  son las mismas ya usadas en la p\u00e1gina de AI Automation.\r\n============================================================= -->\r\n<section id=\"tgus-platform\">\r\n  <style>\r\n    #tgus-platform {\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-blue-d: #2563eb;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-violet-d: #6d5ef0;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-lilac: #a99bff;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-platform *, #tgus-platform *::before, #tgus-platform *::after { box-sizing: border-box; }\r\n\r\n    #tgus-platform .tgus-wrap { max-width: 1200px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n    #tgus-platform .tgus-head { max-width: 720px; margin: 0 auto 3rem; text-align: center; }\r\n    #tgus-platform .tgus-eyebrow {\r\n      display: inline-block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 1rem !important;\r\n    }\r\n    #tgus-platform h2 {\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.9rem, 4vw, 2.75rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.15 !important;\r\n      margin: 0 0 1.25rem !important;\r\n    }\r\n    #tgus-platform p.tgus-lead {\r\n      font-size: 1.05rem !important;\r\n      line-height: 1.65 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 !important;\r\n    }\r\n    #tgus-platform p.tgus-lead strong { color: var(--tgus-text) !important; font-weight: 700 !important; }\r\n    #tgus-platform .tgus-reveal {\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-platform .tgus-grad-word {\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-platform .tgus-grad-word.tgus-grad-active {\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } }\r\n\r\n    #tgus-platform .tgus-bento-grid {\r\n      display: grid;\r\n      grid-template-columns: repeat(4, 1fr);\r\n      grid-auto-rows: 200px;\r\n      gap: 1.25rem;\r\n    }\r\n\r\n    #tgus-platform .tgus-bento-hero {\r\n      position: relative;\r\n      isolation: isolate;\r\n      grid-column: span 2;\r\n      grid-row: span 2;\r\n      border-radius: 22px;\r\n      overflow: hidden;\r\n      background: var(--tgus-bg-2);\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: flex-end;\r\n      padding: clamp(1.5rem, 3vw, 2.25rem);\r\n    }\r\n    #tgus-platform .tgus-spin {\r\n      position: absolute;\r\n      inset: -10%;\r\n      z-index: 0;\r\n      overflow: hidden;\r\n      filter: blur(42px);\r\n      opacity: .55;\r\n      pointer-events: none;\r\n    }\r\n    #tgus-platform .tgus-spin::before {\r\n      content: '';\r\n      position: absolute;\r\n      inset: -30%;\r\n      background: conic-gradient(from 0deg, var(--tgus-violet-d), transparent 30% 70%, var(--tgus-blue));\r\n      animation: tgus-spin 10s linear infinite;\r\n    }\r\n    #tgus-platform .tgus-spin.tgus-spin-inner {\r\n      inset: -4%;\r\n      filter: blur(20px);\r\n      opacity: .5;\r\n    }\r\n    #tgus-platform .tgus-spin.tgus-spin-inner::before {\r\n      background: conic-gradient(from 90deg, var(--tgus-lilac), transparent 30% 70%, var(--tgus-cyan));\r\n      animation-duration: 8s;\r\n      animation-direction: reverse;\r\n    }\r\n    @keyframes tgus-spin { to { transform: rotate(360deg); } }\r\n    #tgus-platform .tgus-bento-hero[data-paused=\"true\"] .tgus-spin::before { animation-play-state: paused; }\r\n\r\n    #tgus-platform .tgus-glow-card {\r\n      position: absolute;\r\n      inset: 3px;\r\n      border-radius: 20px;\r\n      z-index: 1;\r\n      overflow: hidden;\r\n    }\r\n    #tgus-platform .tgus-glow-card img {\r\n      position: absolute; inset: 0;\r\n      width: 100%; height: 100%;\r\n      object-fit: cover;\r\n      display: block;\r\n    }\r\n    #tgus-platform .tgus-glow-card::after {\r\n      content: '';\r\n      position: absolute; inset: 0;\r\n      background: linear-gradient(0deg, rgba(5,5,10,.92) 0%, rgba(5,5,10,.55) 45%, rgba(5,5,10,.15) 75%);\r\n    }\r\n\r\n    #tgus-platform .tgus-bento-hero-content { position: relative; z-index: 2; }\r\n    #tgus-platform .tgus-bento-hero .tgus-eyebrow { margin-bottom: .6rem !important; }\r\n    #tgus-platform .tgus-bento-hero h2 { font-size: clamp(1.5rem, 3vw, 2.1rem) !important; margin-bottom: .6rem !important; }\r\n    #tgus-platform .tgus-bento-hero p.tgus-lead { font-size: .98rem !important; max-width: 46ch; }\r\n\r\n    #tgus-platform .tgus-bento-card {\r\n      position: relative;\r\n      overflow: hidden;\r\n      background: var(--tgus-bg-2);\r\n      border: 1px solid var(--tgus-border);\r\n      border-radius: 22px;\r\n      padding: 1.5rem;\r\n      transition: transform .3s var(--tgus-ease), border-color .3s var(--tgus-ease);\r\n    }\r\n    #tgus-platform .tgus-bento-card:hover {\r\n      transform: translateY(-3px);\r\n      border-color: rgba(255,255,255,.2);\r\n    }\r\n    #tgus-platform .tgus-bento-card-media { position: absolute; inset: 0; z-index: 0; }\r\n    #tgus-platform .tgus-bento-card-media::after {\r\n      content: '';\r\n      position: absolute; inset: 0;\r\n      background: linear-gradient(180deg, rgba(21,21,31,.4) 0%, rgba(21,21,31,.88) 100%);\r\n    }\r\n    #tgus-platform .tgus-bento-card-media img {\r\n      position: relative; z-index: 0;\r\n      width: 100%; height: 100%;\r\n      object-fit: cover;\r\n      opacity: .55;\r\n      display: block;\r\n    }\r\n    #tgus-platform .tgus-bento-card-content {\r\n      position: relative; z-index: 1; height: 100%;\r\n      display: flex; flex-direction: column; justify-content: space-between;\r\n    }\r\n\r\n    #tgus-platform .tgus-icon-btn {\r\n      background: transparent;\r\n      border: none;\r\n      position: relative;\r\n      width: 3.4em; height: 3.4em;\r\n      perspective: 24em;\r\n      cursor: default;\r\n      font-size: 16px;\r\n    }\r\n    #tgus-platform .tgus-icon-back, #tgus-platform .tgus-icon-front {\r\n      position: absolute; inset: 0;\r\n      border-radius: 1.05em;\r\n      transition: transform .35s var(--tgus-ease);\r\n    }\r\n    #tgus-platform .tgus-icon-back {\r\n      transform: rotate(12deg);\r\n      transform-origin: 100% 100%;\r\n      box-shadow: .4em -.4em .6em rgba(0,0,0,.25);\r\n    }\r\n    #tgus-platform .tgus-icon-front {\r\n      background: rgba(255,255,255,.1);\r\n      box-shadow: 0 0 0 .08em rgba(255,255,255,.22) inset;\r\n      backdrop-filter: blur(.7em);\r\n      -webkit-backdrop-filter: blur(.7em);\r\n      display: flex; align-items: center; justify-content: center;\r\n      transform-origin: 80% 50%;\r\n    }\r\n    #tgus-platform .tgus-icon-front svg { width: 1.4em; height: 1.4em; stroke: #fff; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }\r\n    #tgus-platform .tgus-bento-card:hover .tgus-icon-back { transform: rotate(20deg) translate3d(-.3em,-.3em,.4em); }\r\n    #tgus-platform .tgus-bento-card:hover .tgus-icon-front { transform: translate3d(0,0,1.4em); }\r\n\r\n    #tgus-platform .tgus-bento-label {\r\n      font-size: .95rem !important;\r\n      line-height: 1.5 !important;\r\n      font-weight: 600 !important;\r\n      color: var(--tgus-text) !important;\r\n      margin: 1rem 0 0 !important;\r\n    }\r\n    #tgus-platform .tgus-bento-wide { grid-column: span 2; }\r\n    #tgus-platform .tgus-bento-full { grid-column: span 4; }\r\n\r\n    #tgus-platform .tgus-cta-row{ display: flex; justify-content: center; margin-top: 2.5rem; }\r\n    #tgus-platform .tgus-btn-wrap{ position: relative; display: inline-block; isolation: isolate; }\r\n    #tgus-platform .tgus-btn{\r\n      --border-radius: 999px; --pad: 4px; --transition: .4s; --hue: 210deg;\r\n      position: relative; isolation: isolate; user-select: none;\r\n      display: flex; align-items: center; justify-content: center; gap: .5em;\r\n      padding: .7em .95em .7em 1.15em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .95rem !important; font-weight: 600 !important;\r\n      text-decoration: none !important; color: var(--tgus-text) !important;\r\n      background-color: #111219;\r\n      border: solid 1px rgba(255,255,255,.14);\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      box-shadow: inset 0 1px 1px rgba(255,255,255,.2), inset 0 2px 2px rgba(255,255,255,.15), inset 0 4px 4px rgba(255,255,255,.08);\r\n      transition: box-shadow var(--transition), border-color var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    #tgus-platform .tgus-btn::before{\r\n      content: ''; position: absolute; z-index: -1;\r\n      top: calc(-1 * var(--pad)); left: calc(-1 * var(--pad));\r\n      width: calc(100% + var(--pad) * 2); height: calc(100% + var(--pad) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--pad));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      box-shadow: 1px 1px 1px #fff2, 2px 2px 2px #fff1, -1px -1px 1px #0002, -2px -2px 2px #0001;\r\n      transition: box-shadow var(--transition);\r\n    }\r\n    #tgus-platform .tgus-btn::after{\r\n      content: ''; position: absolute; inset: 0; z-index: 1;\r\n      border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, hsl(var(--hue) 100% 70%), hsla(var(--hue),100%,70%,.5) 8%, transparent);\r\n      opacity: 0;\r\n      transition: opacity var(--transition);\r\n    }\r\n    #tgus-platform .tgus-btn:hover{ border-color: hsla(var(--hue),100%,80%,.4); transform: translateY(-1px); }\r\n    #tgus-platform .tgus-btn:hover::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); }\r\n    #tgus-platform .tgus-btn:active{ border-color: hsla(var(--hue),100%,80%,.7); background-color: hsla(var(--hue),50%,20%,.5); }\r\n    #tgus-platform .tgus-btn:focus-visible{ outline: 2px solid var(--tgus-cyan); outline-offset: 3px; }\r\n    #tgus-platform .tgus-btn-svg{ width: 1em; height: 1em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; }\r\n    #tgus-platform .tgus-letters{ position: relative; z-index: 2; display: inline-flex; }\r\n    #tgus-platform .tgus-letter{\r\n      position: relative; display: inline-block; color: currentColor;\r\n      opacity: 0; transform: translateY(4px);\r\n      animation: tgus-pf-letter-in .4s var(--tgus-ease) forwards;\r\n      animation-delay: calc(var(--i, 0) * 22ms);\r\n      transition: text-shadow .3s var(--tgus-ease);\r\n    }\r\n    #tgus-platform .tgus-btn:hover .tgus-letter{ text-shadow: 0 0 6px rgba(255,255,255,.55); }\r\n    @keyframes tgus-pf-letter-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      #tgus-platform .tgus-spin::before { animation-duration: 40s !important; }\r\n      #tgus-platform .tgus-bento-card, #tgus-platform .tgus-icon-back, #tgus-platform .tgus-icon-front { transition: none; }\r\n      #tgus-platform .tgus-grad-word.tgus-grad-active { animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n    @media (max-width: 1024px) {\r\n      #tgus-platform .tgus-bento-grid { grid-template-columns: repeat(2, 1fr); }\r\n      #tgus-platform .tgus-bento-hero { grid-column: span 2; grid-row: span 1; }\r\n      #tgus-platform .tgus-bento-wide { grid-column: span 2; }\r\n      #tgus-platform .tgus-bento-full { grid-column: span 2; }\r\n    }\r\n    @media (max-width: 768px) {\r\n      #tgus-platform .tgus-bento-grid { grid-template-columns: 1fr; grid-auto-rows: auto; }\r\n      #tgus-platform .tgus-bento-hero { grid-column: span 1; aspect-ratio: 4\/3; }\r\n      #tgus-platform .tgus-bento-card { grid-column: span 1; min-height: 160px; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-head\">\r\n      <span class=\"tgus-eyebrow\">smart go up<\/span>\r\n      <h2><span class=\"tgus-reveal\" id=\"tgus-platform-reveal\">Most agencies resell. <span class=\"tgus-grad-word\">We built ours.<\/span><\/span><\/h2>\r\n      <p class=\"tgus-lead\">\r\n        Smart Go Up is the platform every agent, workflow, conversation and report we build runs on.\r\n        <strong>It's ours \u2014 not a white-label license from a vendor we don't control.<\/strong> When your\r\n        operation needs something it doesn't do yet, we build it instead of filing a feature request.\r\n      <\/p>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-bento-grid\">\r\n      <div class=\"tgus-bento-hero\" data-paused=\"true\">\r\n        <div class=\"tgus-spin\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"tgus-spin tgus-spin-inner\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"tgus-glow-card\">\r\n          <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-05-at-12.58.29-PM.webp\" alt=\"Smart Go Up platform dashboard\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n        <div class=\"tgus-bento-hero-content\">\r\n          <span class=\"tgus-eyebrow\">smart go up<\/span>\r\n          <h2>Most agencies resell. We built ours.<\/h2>\r\n          <p class=\"tgus-lead\">Every agent, workflow, conversation and report runs on one platform we own and can change.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-bento-card\">\r\n        <div class=\"tgus-bento-card-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-05-at-12.58.30-PM-1.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n        <div class=\"tgus-bento-card-content\">\r\n          <button class=\"tgus-icon-btn\" type=\"button\" aria-label=\"One inbox for every channel\">\r\n            <span class=\"tgus-icon-back\" style=\"background:linear-gradient(#3b82f6,#2563eb)\"><\/span>\r\n            <span class=\"tgus-icon-front\"><svg viewBox=\"0 0 24 24\"><path d=\"M3 5h18v14H3z\"\/><path d=\"M3 5l9 7 9-7\"\/><\/svg><\/span>\r\n          <\/button>\r\n          <p class=\"tgus-bento-label\">One inbox, every channel<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-bento-card\">\r\n        <div class=\"tgus-bento-card-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-05-at-12.58.30-PM-2.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n        <div class=\"tgus-bento-card-content\">\r\n          <button class=\"tgus-icon-btn\" type=\"button\" aria-label=\"Pipelines\">\r\n            <span class=\"tgus-icon-back\" style=\"background:linear-gradient(#8b7cf6,#6d5ef0)\"><\/span>\r\n            <span class=\"tgus-icon-front\"><svg viewBox=\"0 0 24 24\"><path d=\"M4 6h16M4 12h10M4 18h6\"\/><\/svg><\/span>\r\n          <\/button>\r\n          <p class=\"tgus-bento-label\">Pipelines that show where deals are<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-bento-card\">\r\n        <div class=\"tgus-bento-card-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-05-at-12.58.30-PM.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n        <div class=\"tgus-bento-card-content\">\r\n          <button class=\"tgus-icon-btn\" type=\"button\" aria-label=\"Automations\">\r\n            <span class=\"tgus-icon-back\" style=\"background:linear-gradient(#3b82f6,#2563eb)\"><\/span>\r\n            <span class=\"tgus-icon-front\"><svg viewBox=\"0 0 24 24\"><path d=\"M13 2 3 14h7l-1 8 10-12h-7l1-8z\"\/><\/svg><\/span>\r\n          <\/button>\r\n          <p class=\"tgus-bento-label\">Automations running in the background<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-bento-card\">\r\n        <div class=\"tgus-bento-card-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-05-at-1.02.35-PM-2.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n        <div class=\"tgus-bento-card-content\">\r\n          <button class=\"tgus-icon-btn\" type=\"button\" aria-label=\"Reporting\">\r\n            <span class=\"tgus-icon-back\" style=\"background:linear-gradient(#8b7cf6,#6d5ef0)\"><\/span>\r\n            <span class=\"tgus-icon-front\"><svg viewBox=\"0 0 24 24\"><path d=\"M4 20V10M12 20V4M20 20v-7\"\/><\/svg><\/span>\r\n          <\/button>\r\n          <p class=\"tgus-bento-label\">Reporting that connects work to revenue<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-bento-card tgus-bento-full\">\r\n        <div class=\"tgus-bento-card-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-05-at-1.01.21-PM.webp\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n        <div class=\"tgus-bento-card-content\">\r\n          <button class=\"tgus-icon-btn\" type=\"button\" aria-label=\"AI agents native to the platform\">\r\n            <span class=\"tgus-icon-back\" style=\"background:linear-gradient(#5ec8f2,#3b82f6)\"><\/span>\r\n            <span class=\"tgus-icon-front\"><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"3\"\/><path d=\"M12 2v4M12 18v4M2 12h4M18 12h4\"\/><\/svg><\/span>\r\n          <\/button>\r\n          <p class=\"tgus-bento-label\">AI agents native to the platform<\/p>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-cta-row\">\r\n      <span class=\"tgus-btn-wrap\">\r\n        <a class=\"tgus-btn\" href=\"\/en\/ai-automation\/\" aria-label=\"See how it works\">\r\n          <span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>See how it works<\/span>\r\n          <svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n        <\/a>\r\n      <\/span>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n    (function(){\r\n      var root = document.getElementById('tgus-platform');\r\n      if(!root) return;\r\n      var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n      root.querySelectorAll('[data-tgus-letters]').forEach(function(el){\r\n        var text = el.textContent;\r\n        el.textContent = '';\r\n        text.split('').forEach(function(ch, i){\r\n          var span = document.createElement('span');\r\n          span.className = 'tgus-letter';\r\n          span.style.setProperty('--i', i);\r\n          span.textContent = ch === ' ' ? '\\u00A0' : ch;\r\n          el.appendChild(span);\r\n        });\r\n      });\r\n\r\n      var revealEl = root.querySelector('#tgus-platform-reveal');\r\n      if(revealEl){\r\n        var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n        var TGUS_TEXT_COLOR = '#f4f4f8';\r\n        var BAND_HALF = 17;\r\n        var SWEEP_START = -BAND_HALF;\r\n        var SWEEP_END = 100 + BAND_HALF;\r\n\r\n        var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n        var buildGradient = function(pos){\r\n          var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n          if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n          var n = TGUS_COLORS.length, parts = [];\r\n          if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n          TGUS_COLORS.forEach(function(c, i){\r\n            var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n            parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n          });\r\n          if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n          return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n        };\r\n        var activateGradWord = function(lineEl){\r\n          var word = lineEl.querySelector('.tgus-grad-word');\r\n          if(word) word.classList.add('tgus-grad-active');\r\n        };\r\n        var sweepOne = function(el, duration){\r\n          var start = performance.now();\r\n          el.style.backgroundImage = buildGradient(SWEEP_START);\r\n          function tick(){\r\n            var t = Math.min((performance.now() - start) \/ duration, 1);\r\n            var pos = SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t);\r\n            el.style.backgroundImage = buildGradient(pos);\r\n            if(t < 1) requestAnimationFrame(tick);\r\n            else activateGradWord(el);\r\n          }\r\n          requestAnimationFrame(tick);\r\n        };\r\n\r\n        if(reduceMotion){\r\n          revealEl.style.backgroundImage = buildGradient(SWEEP_END);\r\n          activateGradWord(revealEl);\r\n        } else if('IntersectionObserver' in window){\r\n          var revealFired = false;\r\n          var revealIo = new IntersectionObserver(function(entries){\r\n            entries.forEach(function(e){\r\n              if(e.isIntersecting && !revealFired){\r\n                revealFired = true;\r\n                setTimeout(function(){ sweepOne(revealEl, 900); }, 150);\r\n              }\r\n            });\r\n          }, { threshold: .3 });\r\n          revealIo.observe(revealEl);\r\n        } else {\r\n          revealEl.style.backgroundImage = buildGradient(SWEEP_END);\r\n          activateGradWord(revealEl);\r\n        }\r\n      }\r\n\r\n      var hero = root.querySelector('.tgus-bento-hero');\r\n      if(!hero || !('IntersectionObserver' in window)) return;\r\n      var io = new IntersectionObserver(function(entries){\r\n        entries.forEach(function(e){\r\n          hero.setAttribute('data-paused', e.isIntersecting ? 'false' : 'true');\r\n        });\r\n      }, { threshold: .1 });\r\n      io.observe(hero);\r\n    })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f74c210 elementor-widget elementor-widget-html\" data-id=\"f74c210\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 09-blog-teaser.html (Home \u2014 secci\u00f3n 01.9, reemplaza Team \u00b7\r\n  Blog teaser)\r\n  El deck original ped\u00eda una secci\u00f3n de Team (bloqueada por falta de\r\n  fotos\/perfiles reales). A pedido del usuario, se reemplaza por un\r\n  teaser del blog: header + 3 posts destacados + CTA a \/blog\/.\r\n  Mismo sistema visual del sitio (reveal-sweep, paleta, tipograf\u00edas).\r\n  Prefijo CSS: #tgus-blog-teaser\r\n  Pegar en widget HTML de Elementor, novena secci\u00f3n del home.\r\n\r\n  CONECTADO A WORDPRESS: usa shortcode [tgus_home_blog_teaser]\r\n  (\u00faltimos 3 posts reales, ver tgus-blog-connect.php).\r\n============================================================= -->\r\n<section id=\"tgus-blog-teaser\">\r\n  <style>\r\n    #tgus-blog-teaser{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-blog-teaser *, #tgus-blog-teaser *::before, #tgus-blog-teaser *::after{ box-sizing: border-box; }\r\n\r\n    #tgus-blog-teaser .tgus-wrap{ max-width: 1180px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n    #tgus-blog-teaser .tgus-head{\r\n      display: flex;\r\n      align-items: flex-end;\r\n      justify-content: space-between;\r\n      gap: 1.5rem;\r\n      flex-wrap: wrap;\r\n      margin-bottom: clamp(2.25rem, 5vw, 3rem);\r\n    }\r\n    #tgus-blog-teaser .tgus-eyebrow{\r\n      display: block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 .6rem !important;\r\n    }\r\n    #tgus-blog-teaser h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.75rem, 3.6vw, 2.4rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.2 !important;\r\n      margin: 0 !important;\r\n      max-width: 26ch;\r\n    }\r\n    #tgus-blog-teaser .tgus-reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-blog-teaser .tgus-grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-blog-teaser .tgus-grad-word.tgus-grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n\r\n    \/* ---------- bot\u00f3n: mismo componente del hero ---------- *\/\r\n    #tgus-blog-teaser .tgus-btn-wrap{ position: relative; display: inline-block; isolation: isolate; flex-shrink: 0; }\r\n    #tgus-blog-teaser .tgus-btn{\r\n      --border-radius: 999px; --pad: 4px; --transition: .4s; --hue: 210deg;\r\n      position: relative; isolation: isolate; user-select: none;\r\n      display: flex; align-items: center; justify-content: center; gap: .5em;\r\n      padding: .7em .95em .7em 1.15em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .92rem !important; font-weight: 600 !important;\r\n      text-decoration: none !important; color: var(--tgus-text) !important;\r\n      background-color: #111219;\r\n      border: solid 1px rgba(255,255,255,.14);\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      box-shadow: inset 0 1px 1px rgba(255,255,255,.2), inset 0 2px 2px rgba(255,255,255,.15), inset 0 4px 4px rgba(255,255,255,.08);\r\n      transition: box-shadow var(--transition), border-color var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    #tgus-blog-teaser .tgus-btn::before{\r\n      content: ''; position: absolute; z-index: -1;\r\n      top: calc(-1 * var(--pad)); left: calc(-1 * var(--pad));\r\n      width: calc(100% + var(--pad) * 2); height: calc(100% + var(--pad) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--pad));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      box-shadow: 1px 1px 1px #fff2, 2px 2px 2px #fff1, -1px -1px 1px #0002, -2px -2px 2px #0001;\r\n      transition: box-shadow var(--transition);\r\n    }\r\n    #tgus-blog-teaser .tgus-btn::after{\r\n      content: ''; position: absolute; inset: 0; z-index: 1;\r\n      border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, hsl(var(--hue) 100% 70%), hsla(var(--hue),100%,70%,.5) 8%, transparent);\r\n      opacity: 0;\r\n      transition: opacity var(--transition);\r\n    }\r\n    #tgus-blog-teaser .tgus-btn:hover{ border-color: hsla(var(--hue),100%,80%,.4); transform: translateY(-1px); }\r\n    #tgus-blog-teaser .tgus-btn:hover::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg, #fff, transparent); mask-image: linear-gradient(0deg, #fff, transparent); }\r\n    #tgus-blog-teaser .tgus-btn:active{ border-color: hsla(var(--hue),100%,80%,.7); background-color: hsla(var(--hue),50%,20%,.5); }\r\n    #tgus-blog-teaser .tgus-btn:focus-visible{ outline: 2px solid var(--tgus-cyan); outline-offset: 3px; }\r\n    #tgus-blog-teaser .tgus-btn-svg{ width: 1em; height: 1em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; }\r\n    #tgus-blog-teaser .tgus-letters{ position: relative; z-index: 2; display: inline-flex; }\r\n    #tgus-blog-teaser .tgus-letter{\r\n      position: relative; display: inline-block; color: currentColor;\r\n      opacity: 0; transform: translateY(4px);\r\n      animation: tgus-bt-letter-in .4s var(--tgus-ease) forwards;\r\n      animation-delay: calc(var(--i, 0) * 22ms);\r\n      transition: text-shadow .3s var(--tgus-ease);\r\n    }\r\n    #tgus-blog-teaser .tgus-btn:hover .tgus-letter{ text-shadow: 0 0 6px rgba(255,255,255,.55); }\r\n    @keyframes tgus-bt-letter-in{ to{ opacity: 1; transform: translateY(0); } }\r\n\r\n    \/* ---------- grid de 3 posts ---------- *\/\r\n    \/* ---------- grid de 3 posts (mismo componente de 09c-blog-grid.html) ---------- *\/\r\n    #tgus-blog-teaser .tgus-grid{\r\n      display: grid;\r\n      grid-template-columns: repeat(3, 1fr);\r\n      gap: 24px;\r\n    }\r\n    #tgus-blog-teaser .tgus-post{\r\n      display: flex; flex-direction: column;\r\n      text-decoration: none; color: inherit;\r\n      opacity: 0; transform: translateY(24px);\r\n      transition: opacity .7s var(--tgus-ease), transform .7s var(--tgus-ease);\r\n    }\r\n    #tgus-blog-teaser .tgus-post.tgus-in-view{ opacity: 1; transform: translateY(0); }\r\n    #tgus-blog-teaser .tgus-grid > .tgus-post:nth-child(2){ transition-delay: .1s; }\r\n    #tgus-blog-teaser .tgus-grid > .tgus-post:nth-child(3){ transition-delay: .2s; }\r\n\r\n    #tgus-blog-teaser .tgus-post-media{\r\n      position: relative;\r\n      border-radius: 18px; overflow: hidden;\r\n      aspect-ratio: 3\/4;\r\n      background: #0b0b14;\r\n      display: flex; flex-direction: column; justify-content: flex-end;\r\n      isolation: isolate;\r\n      box-shadow: 0px -16px 24px 0px rgba(255,255,255,.14) inset;\r\n    }\r\n    \/* glow de borde animado \u2014 @property + conic-gradient, per\u00edmetro completo *\/\r\n    @property --tgus-post-angle{ syntax: '<angle>'; inherits: false; initial-value: 0deg; }\r\n    #tgus-blog-teaser .tgus-post-media::before{\r\n      content: \"\";\r\n      position: absolute; inset: -1px; z-index: 3;\r\n      border-radius: inherit;\r\n      padding: 2px;\r\n      background: conic-gradient(from var(--tgus-post-angle,0deg),\r\n        rgba(59,130,246,.35) 0deg,\r\n        rgba(59,130,246,.35) 40deg,\r\n        #fff 60deg,\r\n        var(--tgus-cyan) 75deg,\r\n        var(--tgus-violet) 95deg,\r\n        rgba(139,124,246,.35) 115deg,\r\n        rgba(59,130,246,.35) 360deg);\r\n      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);\r\n      -webkit-mask-composite: xor;\r\n      mask-composite: exclude;\r\n      pointer-events: none;\r\n      animation: tgusPostBorderSpin 4s linear infinite;\r\n    }\r\n    @keyframes tgusPostBorderSpin{ to{ --tgus-post-angle: 360deg; } }\r\n\r\n    \/* bloom de color desde abajo, overlay blend para que ti\u00f1a tambi\u00e9n fotos claras *\/\r\n    #tgus-blog-teaser .tgus-post-glass{\r\n      position: absolute; inset: 0; z-index: 2;\r\n      background: linear-gradient(0deg,\r\n        rgba(59,130,246,.85) 0%,\r\n        rgba(139,124,246,.65) 32%,\r\n        rgba(94,200,242,.4) 58%,\r\n        transparent 88%);\r\n      mix-blend-mode: overlay;\r\n      opacity: .55;\r\n      transition: opacity .5s ease;\r\n      pointer-events: none;\r\n    }\r\n    #tgus-blog-teaser .tgus-post:hover .tgus-post-glass{ opacity: 1; }\r\n\r\n    #tgus-blog-teaser .tgus-post-media img{\r\n      position: absolute; inset: 0; z-index: 0;\r\n      width: 100%; height: 100%; object-fit: cover; display: block;\r\n      transform: scale(1.02);\r\n      transition: transform .7s var(--tgus-ease);\r\n    }\r\n    #tgus-blog-teaser .tgus-post:hover .tgus-post-media img{ transform: scale(1.08); }\r\n\r\n    \/* scrim permanente para legibilidad *\/\r\n    #tgus-blog-teaser .tgus-post-scrim{\r\n      position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;\r\n      height: 62%;\r\n      background: linear-gradient(0deg, rgba(5,5,10,.96) 0%, rgba(5,5,10,.78) 45%, rgba(5,5,10,0) 100%);\r\n      pointer-events: none;\r\n    }\r\n\r\n    #tgus-blog-teaser .tgus-post-cat{\r\n      position: absolute; top: 14px; left: 14px; z-index: 4;\r\n      font-size: 11px !important; font-weight: 700 !important; letter-spacing: .05em; text-transform: uppercase;\r\n      padding: 6px 11px; border-radius: 999px;\r\n      color: #eaf3ff !important;\r\n      background: rgba(8,8,16,.55);\r\n      border: 1px solid rgba(255,255,255,.16);\r\n      -webkit-backdrop-filter: blur(6px);\r\n      backdrop-filter: blur(6px);\r\n    }\r\n\r\n    #tgus-blog-teaser .tgus-post-body{ position: relative; z-index: 4; padding: 0 18px 18px; }\r\n    #tgus-blog-teaser .tgus-post-date{\r\n      font-size: .76rem !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 0 .3rem !important;\r\n    }\r\n    #tgus-blog-teaser .tgus-post h3{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-weight: 600 !important;\r\n      font-size: 18px !important; line-height: 1.28 !important;\r\n      letter-spacing: -.005em;\r\n      color: var(--tgus-text) !important;\r\n      margin: 0 0 10px !important;\r\n      transition: margin-bottom .4s var(--tgus-ease);\r\n    }\r\n    #tgus-blog-teaser .tgus-post p.tgus-post-excerpt{\r\n      font-size: 13px !important; line-height: 1.55 !important;\r\n      color: #c3c3ce !important;\r\n      max-height: 0; opacity: 0; overflow: hidden;\r\n      display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;\r\n      margin: 0 !important;\r\n      transition: max-height .4s var(--tgus-ease), opacity .3s ease, margin-bottom .4s var(--tgus-ease);\r\n    }\r\n    #tgus-blog-teaser .tgus-post:hover p.tgus-post-excerpt{\r\n      max-height: 56px; opacity: 1; margin-bottom: 14px !important;\r\n    }\r\n\r\n    \/* bot\u00f3n \"Read article\" (dexter-st, degradado azul\u2192violeta) *\/\r\n    #tgus-blog-teaser .tgus-post-btn-wrap{ position: relative; display: inline-block; }\r\n    #tgus-blog-teaser .tgus-post-btn{\r\n      --tgus-pbtn-radius: 20px; --tgus-pbtn-padding: 3px; --tgus-pbtn-transition: .4s;\r\n      position: relative; user-select: none;\r\n      display: flex; align-items: center; justify-content: center;\r\n      padding: .5em 1.05em .5em .9em;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .82em !important; font-weight: 600 !important;\r\n      color: inherit;\r\n      background: linear-gradient(135deg, var(--tgus-blue), var(--tgus-violet));\r\n      box-shadow:\r\n        inset 0px 1px 1px rgba(255,255,255,.35),\r\n        inset 0px 2px 2px rgba(255,255,255,.2),\r\n        inset 0px 4px 4px rgba(255,255,255,.12),\r\n        inset 0px 8px 8px rgba(255,255,255,.06),\r\n        0px -1px 1px rgba(0,0,0,.05),\r\n        0px -4px 6px rgba(0,0,0,.08),\r\n        0px -10px 14px rgba(0,0,0,.12);\r\n      border: solid 1px rgba(255,255,255,.35);\r\n      border-radius: var(--tgus-pbtn-radius);\r\n      cursor: pointer; text-decoration: none;\r\n      transition: box-shadow var(--tgus-pbtn-transition), border var(--tgus-pbtn-transition), transform .2s ease;\r\n    }\r\n    #tgus-blog-teaser .tgus-post-btn::before{\r\n      content: \"\";\r\n      position: absolute;\r\n      top: calc(0px - var(--tgus-pbtn-padding)); left: calc(0px - var(--tgus-pbtn-padding));\r\n      width: calc(100% + var(--tgus-pbtn-padding) * 2); height: calc(100% + var(--tgus-pbtn-padding) * 2);\r\n      border-radius: calc(var(--tgus-pbtn-radius) + var(--tgus-pbtn-padding));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg,#0004,#000a);\r\n      z-index: -1;\r\n      transition: box-shadow var(--tgus-pbtn-transition), filter var(--tgus-pbtn-transition);\r\n      box-shadow:\r\n        1px 1px 1px rgba(255,255,255,.15),\r\n        2px 2px 2px rgba(255,255,255,.08),\r\n        -1px -1px 1px rgba(0,0,0,.15),\r\n        -2px -2px 2px rgba(0,0,0,.08);\r\n    }\r\n    #tgus-blog-teaser .tgus-post-btn::after{\r\n      content: \"\"; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;\r\n      background-image: linear-gradient(0deg,#fff, var(--tgus-cyan) 40%, transparent 80%);\r\n      opacity: 0;\r\n      transition: opacity var(--tgus-pbtn-transition), filter var(--tgus-pbtn-transition);\r\n    }\r\n    #tgus-blog-teaser .tgus-post-btn-svg{\r\n      width: 14px; height: 14px; margin-right: .5rem;\r\n      fill: #fff;\r\n      filter: drop-shadow(0 0 2px rgba(255,255,255,.6));\r\n      transition: fill var(--tgus-pbtn-transition), filter var(--tgus-pbtn-transition);\r\n    }\r\n    #tgus-blog-teaser .tgus-post-btn-txt{ position: relative; color: #fff !important; white-space: nowrap; }\r\n    #tgus-blog-teaser .tgus-post:hover .tgus-post-btn{ border-color: rgba(255,255,255,.6); }\r\n    #tgus-blog-teaser .tgus-post:hover .tgus-post-btn::after{ opacity: .7; -webkit-mask-image: linear-gradient(0deg,#fff,transparent); mask-image: linear-gradient(0deg,#fff,transparent); }\r\n    #tgus-blog-teaser .tgus-post:hover .tgus-post-btn .tgus-post-btn-svg{ filter: drop-shadow(0 0 4px var(--tgus-cyan)); }\r\n    #tgus-blog-teaser .tgus-post-btn:active{ transform: scale(.97); border-color: rgba(255,255,255,.7); }\r\n    #tgus-blog-teaser .tgus-post-btn:active::after{ opacity: 1; -webkit-mask-image: linear-gradient(0deg,#fff,transparent); mask-image: linear-gradient(0deg,#fff,transparent); filter: brightness(140%); }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-blog-teaser .tgus-post{ transition-duration: .01ms !important; opacity: 1 !important; transform: none !important; }\r\n      #tgus-blog-teaser .tgus-post-media img{ transition: none; }\r\n      #tgus-blog-teaser .tgus-post-media::before{ animation: none; }\r\n      #tgus-blog-teaser .tgus-post-glass{ transition: none; }\r\n      #tgus-blog-teaser .tgus-grad-word.tgus-grad-active{ animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n    @media(max-width: 860px){\r\n      #tgus-blog-teaser .tgus-grid{ grid-template-columns: 1fr; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-head\">\r\n      <div>\r\n        <span class=\"tgus-eyebrow\">from the blog<\/span>\r\n        <h2><span class=\"tgus-reveal\" id=\"tgus-blog-teaser-reveal\">Notes on <span class=\"tgus-grad-word\">automation and software<\/span>, from the team building it<\/span><\/h2>\r\n      <\/div>\r\n      <span class=\"tgus-btn-wrap\">\r\n        <a class=\"tgus-btn\" href=\"\/en\/blog\/\" aria-label=\"Visit the blog\">\r\n          <span class=\"tgus-letters\" aria-hidden=\"true\" data-tgus-letters>Visit the blog<\/span>\r\n          <svg class=\"tgus-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n        <\/a>\r\n      <\/span>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-grid\">\r\n\r\n              <a class=\"tgus-post\" href=\"https:\/\/togrowagencia.com\/en\/como-crear-presencia-digital-para-tu-empresa-desde-cero-guia-practica-2026\/\">\n          <div class=\"tgus-post-media\">\n            <img src=\"https:\/\/togrowagencia.com\/en\/wp-content\/uploads\/2026\/08\/persona-que-gestiona-la-optimizacion-de-motores-de-busqueda-seo-para-marketing-digital-con-contenido-de-redes-sociales-2048x1152-1-1024x576.webp\" alt=\"How to Build a Digital Presence for Your Business From Scratch: A Practical 2026 Guide\" loading=\"lazy\" decoding=\"async\">\n            <span class=\"tgus-post-glass\"><\/span>\n            <span class=\"tgus-post-scrim\"><\/span>\n            <span class=\"tgus-post-cat\">Automation<\/span>\n            <div class=\"tgus-post-body\">\n              <p class=\"tgus-post-date\">Aug 14, 2026<\/p>\n              <h3>How to Build a Digital Presence for Your Business From Scratch: A Practical 2026 Guide<\/h3>\n              <p class=\"tgus-post-excerpt\">In a world where customers research, compare, and decide in a matter of seconds, building a solid digital presence is no longer optional \u2014 it&#8217;s the foundation for any company&#8217;s sustainable growth. As experts in positioning and digital strategy, we&#8217;ve guided numerous companies through this journey, and we know that starting from zero can feel [&hellip;]<\/p>\n              <span class=\"tgus-post-btn-wrap\">\n                <span class=\"tgus-post-btn\">\n                  <svg class=\"tgus-post-btn-svg\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.894 20.567 16.5 21.75l-.394-1.183a2.25 2.25 0 0 0-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 0 0 1.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 0 0 1.423 1.423l1.183.394-1.183.394a2.25 2.25 0 0 0-1.423 1.423Z\"\/><\/svg>\n                  <span class=\"tgus-post-btn-txt\">Read article<\/span>\n                <\/span>\n              <\/span>\n            <\/div>\n          <\/div>\n        <\/a>\n    \r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n  (function(){\r\n    var root = document.getElementById('tgus-blog-teaser');\r\n    if(!root) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    root.querySelectorAll('[data-tgus-letters]').forEach(function(el){\r\n      var text = el.textContent;\r\n      el.textContent = '';\r\n      text.split('').forEach(function(ch, i){\r\n        var span = document.createElement('span');\r\n        span.className = 'tgus-letter';\r\n        span.style.setProperty('--i', i);\r\n        span.textContent = ch === ' ' ? '\\u00A0' : ch;\r\n        el.appendChild(span);\r\n      });\r\n    });\r\n\r\n    var posts = root.querySelectorAll('.tgus-post');\r\n    if(reduceMotion || !('IntersectionObserver' in window)){\r\n      posts.forEach(function(el){ el.classList.add('tgus-in-view'); });\r\n    } else {\r\n      var io = new IntersectionObserver(function(entries){\r\n        entries.forEach(function(e){\r\n          if(e.isIntersecting){ e.target.classList.add('tgus-in-view'); io.unobserve(e.target); }\r\n        });\r\n      }, { threshold: .2 });\r\n      posts.forEach(function(el){ io.observe(el); });\r\n    }\r\n\r\n    var revealEl = root.querySelector('#tgus-blog-teaser-reveal');\r\n    if(revealEl){\r\n      var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n      var TGUS_TEXT_COLOR = '#f4f4f8';\r\n      var BAND_HALF = 17;\r\n      var SWEEP_START = -BAND_HALF;\r\n      var SWEEP_END = 100 + BAND_HALF;\r\n      var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n      var buildGradient = function(pos){\r\n        var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n        if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n        var n = TGUS_COLORS.length, parts = [];\r\n        if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n        TGUS_COLORS.forEach(function(c, i){\r\n          var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n          parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n        });\r\n        if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n        return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n      };\r\n      var activateGradWord = function(lineEl){ var w = lineEl.querySelector('.tgus-grad-word'); if(w) w.classList.add('tgus-grad-active'); };\r\n      var sweepOne = function(el, duration){\r\n        var start = performance.now();\r\n        el.style.backgroundImage = buildGradient(SWEEP_START);\r\n        function tick(){\r\n          var t = Math.min((performance.now() - start) \/ duration, 1);\r\n          el.style.backgroundImage = buildGradient(SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t));\r\n          if(t < 1) requestAnimationFrame(tick); else activateGradWord(el);\r\n        }\r\n        requestAnimationFrame(tick);\r\n      };\r\n      if(reduceMotion){ revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n      else if('IntersectionObserver' in window){\r\n        var revealFired = false;\r\n        new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){ if(e.isIntersecting && !revealFired){ revealFired = true; setTimeout(function(){ sweepOne(revealEl, 900); }, 150); } });\r\n        }, { threshold: .3 }).observe(revealEl);\r\n      } else { revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n    }\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bcdb232 elementor-widget elementor-widget-html\" data-id=\"bcdb232\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 12-testimonials.html (Home \u2014 secci\u00f3n de testimonios, v2 \u00b7\r\n  Scroll Reel)\r\n  Portado de un componente de referencia (ScrollReelTestimonials):\r\n  carrete de retratos que se desliza en 3 columnas (la del medio con\r\n  fotos reales, las laterales contra-desplaz\u00e1ndose con celdas\r\n  \"blur\" de relleno) sincronizado con un texto que entra\r\n  car\u00e1cter por car\u00e1cter con stagger. Controles prev\/next.\r\n  Prefijo CSS: #tgus-testi-reel\r\n  Pegar en widget HTML de Elementor (despu\u00e9s de FAQ, antes del CTA\r\n  final \u2014 mismo lugar que ocupaba la versi\u00f3n anterior de 3 columnas).\r\n\r\n  CONTENIDO: testimonios ficticios escritos a partir de clientes\r\n  reales de ToGrow (mismos nombres ya usados en el proyecto) \u2014 las\r\n  fotos son de personas gen\u00e9ricas (Unsplash), pendiente de\r\n  autorizaci\u00f3n y fotos reales antes de publicar.\r\n============================================================= -->\r\n<section id=\"tgus-testi-reel\">\r\n  <style>\r\n    #tgus-testi-reel{\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-1: #0d0d16;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.1);\r\n      --tgus-ease-io: cubic-bezier(.65,0,.35,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      min-width: 0;\r\n    }\r\n    #tgus-testi-reel *, #tgus-testi-reel *::before, #tgus-testi-reel *::after{ box-sizing: border-box; }\r\n\r\n    #tgus-testi-reel .tgus-head{ max-width: 640px; margin: 0 auto clamp(2.5rem, 5vw, 3.25rem); text-align: center; }\r\n    #tgus-testi-reel .tgus-eyebrow{\r\n      display: inline-block;\r\n      font-size: .8125rem !important;\r\n      font-weight: 600 !important;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      color: var(--tgus-cyan);\r\n      margin: 0 0 1rem !important;\r\n    }\r\n    #tgus-testi-reel h2{\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.75rem, 3.6vw, 2.4rem) !important;\r\n      font-weight: 700 !important;\r\n      margin: 0 !important;\r\n    }\r\n    #tgus-testi-reel .tgus-reveal{\r\n      display: inline-block;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n      background-size: 100% 100%;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-testi-reel .tgus-grad-word{\r\n      display: inline-block;\r\n      color: transparent;\r\n      padding-bottom: .08em;\r\n    }\r\n    #tgus-testi-reel .tgus-grad-word.tgus-grad-active{\r\n      background-image: linear-gradient(to right, var(--tgus-cyan), var(--tgus-blue), var(--tgus-violet), var(--tgus-cyan));\r\n      background-size: 300% 100%;\r\n      background-clip: text; -webkit-background-clip: text;\r\n      animation: tgus-grad-move 3.2s ease-in-out infinite alternate;\r\n    }\r\n    @keyframes tgus-grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 100% 50%; } }\r\n\r\n    \/* ---------- carrete: contenedor ---------- *\/\r\n    #tgus-testi-reel .tgus-reel{\r\n      position: relative;\r\n      max-width: 1060px;\r\n      margin: 0 auto;\r\n      display: flex;\r\n      flex-direction: column;\r\n      align-items: stretch;\r\n      gap: .6rem;\r\n      overflow: hidden;\r\n      border-radius: 20px;\r\n      border: 1px solid var(--tgus-border);\r\n      background: var(--tgus-bg-1);\r\n    }\r\n    @media(min-width: 768px){\r\n      #tgus-testi-reel .tgus-reel{ flex-direction: row; min-height: 320px; }\r\n    }\r\n\r\n    #tgus-testi-reel .tgus-reel-viewport{\r\n      position: relative;\r\n      height: 220px;\r\n      width: 100%;\r\n      flex-shrink: 0;\r\n      overflow: hidden;\r\n      -webkit-mask-image:\r\n        linear-gradient(to right, transparent 0%, black 14%, black 86%, transparent 100%),\r\n        linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%);\r\n      mask-image:\r\n        linear-gradient(to right, transparent 0%, black 14%, black 86%, transparent 100%),\r\n        linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%);\r\n      -webkit-mask-composite: source-in;\r\n      mask-composite: intersect;\r\n    }\r\n    @media(min-width: 768px){\r\n      #tgus-testi-reel .tgus-reel-viewport{ height: auto; width: 380px; }\r\n    }\r\n\r\n    #tgus-testi-reel .tgus-reel-inner{\r\n      position: absolute; inset: 0;\r\n      display: flex; align-items: center; justify-content: center;\r\n      gap: 8px;\r\n    }\r\n    #tgus-testi-reel .tgus-reel-col{\r\n      display: flex; flex-direction: column; gap: 8px;\r\n      flex-shrink: 0;\r\n      will-change: transform;\r\n    }\r\n\r\n    #tgus-testi-reel .tgus-cell{\r\n      flex-shrink: 0;\r\n      width: 96px; height: 96px;\r\n      border-radius: 12px;\r\n      border: 1px solid var(--tgus-border);\r\n      background: linear-gradient(180deg, var(--tgus-bg-2), var(--tgus-bg-1));\r\n      filter: blur(1px);\r\n    }\r\n    #tgus-testi-reel .tgus-featured{\r\n      position: relative;\r\n      flex-shrink: 0;\r\n      width: 96px; height: 96px;\r\n      border-radius: 12px;\r\n      overflow: hidden;\r\n      background: var(--tgus-bg-2);\r\n      box-shadow: 0 12px 28px -10px rgba(0,0,0,.55);\r\n    }\r\n    #tgus-testi-reel .tgus-featured img{\r\n      position: absolute; inset: 0;\r\n      width: 100%; height: 100%;\r\n      object-fit: cover; object-position: center 30%;\r\n      filter: saturate(.35);\r\n    }\r\n    #tgus-testi-reel .tgus-featured::after{\r\n      content: '';\r\n      position: absolute; inset: 0;\r\n      mix-blend-mode: overlay;\r\n      filter: blur(6px);\r\n      background: linear-gradient(221deg,\r\n        rgba(94,200,242,0) 32%,\r\n        rgba(94,200,242,.9) 41%,\r\n        rgba(139,124,246,.75) 47%,\r\n        rgba(94,200,242,.5) 54%,\r\n        rgba(94,200,242,0) 65%);\r\n    }\r\n\r\n    \/* ---------- panel de texto ---------- *\/\r\n    #tgus-testi-reel .tgus-content{\r\n      flex: 1;\r\n      min-width: 0;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: space-between;\r\n      padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1.25rem, 3vw, 1.5rem);\r\n    }\r\n    #tgus-testi-reel .tgus-quote-icon{\r\n      width: 40px; height: 40px;\r\n      color: var(--tgus-cyan);\r\n      opacity: .55;\r\n      margin-bottom: .5rem;\r\n    }\r\n    #tgus-testi-reel .tgus-stage{\r\n      position: relative;\r\n      width: 100%;\r\n      max-width: 390px;\r\n      min-height: 150px;\r\n    }\r\n    #tgus-testi-reel .tgus-block{\r\n      display: flex;\r\n      flex-direction: column;\r\n      gap: 1rem;\r\n    }\r\n    #tgus-testi-reel .tgus-quote{\r\n      font-size: 1.15rem !important;\r\n      font-weight: 600 !important;\r\n      line-height: 1.35 !important;\r\n      letter-spacing: -.01em;\r\n      color: var(--tgus-text) !important;\r\n      margin: 0 !important;\r\n    }\r\n    #tgus-testi-reel .tgus-author{\r\n      font-size: .88rem !important;\r\n      font-weight: 600 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 !important;\r\n    }\r\n    #tgus-testi-reel .tgus-char{\r\n      display: inline-block;\r\n      opacity: 0;\r\n      transform: translateY(60%);\r\n      animation: tgus-char-rise .5s var(--tgus-ease-io) forwards;\r\n    }\r\n    @keyframes tgus-char-rise{ to{ opacity: 1; transform: translateY(0); } }\r\n    #tgus-testi-reel .tgus-block.tgus-exiting{\r\n      animation: tgus-block-exit .22s ease forwards;\r\n    }\r\n    #tgus-testi-reel .tgus-block.tgus-exiting .tgus-char{ animation: none; opacity: 0; }\r\n    @keyframes tgus-block-exit{ to{ opacity: 0; transform: translateY(-8%); } }\r\n\r\n    #tgus-testi-reel .tgus-controls{\r\n      display: flex; align-items: center; gap: .45rem;\r\n      margin-top: 1.5rem;\r\n    }\r\n    #tgus-testi-reel .tgus-dot{\r\n      width: 7px; height: 7px;\r\n      border-radius: 50%;\r\n      border: none;\r\n      padding: 0;\r\n      background: rgba(94,200,242,.28);\r\n      cursor: pointer;\r\n      transition: background .25s var(--tgus-ease-io), width .25s var(--tgus-ease-io), border-radius .25s var(--tgus-ease-io);\r\n    }\r\n    #tgus-testi-reel .tgus-dot:hover{ background: rgba(94,200,242,.5); }\r\n    #tgus-testi-reel .tgus-dot.is-active{ background: var(--tgus-cyan); width: 18px; border-radius: 4px; }\r\n\r\n    @media(prefers-reduced-motion: reduce){\r\n      #tgus-testi-reel .tgus-reel-col{ transition: none !important; }\r\n      #tgus-testi-reel .tgus-char{ animation-duration: .01ms !important; opacity: 1 !important; transform: none !important; }\r\n      #tgus-testi-reel .tgus-block.tgus-exiting{ animation: none !important; opacity: 1 !important; }\r\n      #tgus-testi-reel .tgus-grad-word.tgus-grad-active{ animation: none !important; background-position: 50% 50% !important; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-head\">\r\n    <span class=\"tgus-eyebrow\">testimonials<\/span>\r\n    <h2><span class=\"tgus-reveal\" id=\"tgus-testi-reel-reveal\">What <span class=\"tgus-grad-word\">our clients<\/span> say<\/span><\/h2>\r\n  <\/div>\r\n\r\n  <!--\r\n    CONTENIDO: testimonios ficticios a partir de clientes reales del\r\n    proyecto, fotos gen\u00e9ricas de Unsplash \u2014 reemplazar por citas y\r\n    fotos reales, con autorizaci\u00f3n, antes de publicar.\r\n  -->\r\n  <div class=\"tgus-reel\" id=\"tgus-testi-reel-root\">\r\n    <script type=\"application\/json\" id=\"tgus-testi-reel-data\">\r\n    [\r\n      {\"quote\":\"Patients used to call three times before getting a straight answer about scheduling. Now the follow-up happens on its own.\",\"author\":\"Dr. Carlos Recio, Physician\",\"image\":\"https:\/\/images.unsplash.com\/photo-1612349317150-e413f6a5b16d?w=400&q=80&auto=format&fit=crop\"},\r\n      {\"quote\":\"Every quote we send now looks the same, sounds the same, and lands the same, no matter who handles the conversation.\",\"author\":\"Dr. Alejandro Afanador, La Nariz\",\"image\":\"https:\/\/images.unsplash.com\/photo-1560250097-0b93528c311a?w=400&q=80&auto=format&fit=crop\"},\r\n      {\"quote\":\"Bookings went up the same month we launched. The new site made it easy to trust us before ever visiting.\",\"author\":\"Marcela R\u00edos, Villa Nogalito\",\"image\":\"https:\/\/images.unsplash.com\/photo-1544005313-94ddf0286df2?w=400&q=80&auto=format&fit=crop\"},\r\n      {\"quote\":\"Filing documents used to mean back-and-forth emails for days. Now every client stays informed automatically.\",\"author\":\"Liliana G\u00f3mez, Notaria Mundo Latino\",\"image\":\"https:\/\/images.unsplash.com\/photo-1531123897727-8f129e1688ce?w=400&q=80&auto=format&fit=crop\"},\r\n      {\"quote\":\"They did not just automate our order process, they fixed how confusing it was first.\",\"author\":\"Paula Jaramillo, Jabones Artesanos\",\"image\":\"https:\/\/images.unsplash.com\/photo-1573497019940-1c28c88b4f3e?w=400&q=80&auto=format&fit=crop\"},\r\n      {\"quote\":\"We used to lose an entire afternoon answering the same three questions. Now that time goes into the work our clients actually hire us for.\",\"author\":\"Andr\u00e9s Mu\u00f1oz, Technology Video\",\"image\":\"https:\/\/images.unsplash.com\/photo-1472099645785-5658abf4ff4e?w=400&q=80&auto=format&fit=crop\"}\r\n    ]\r\n    <\/script>\r\n    <div class=\"tgus-reel-viewport\">\r\n      <div class=\"tgus-reel-inner\">\r\n        <div class=\"tgus-reel-col\" id=\"tgus-reel-col-left\"><\/div>\r\n        <div class=\"tgus-reel-col\" id=\"tgus-reel-col-mid\"><\/div>\r\n        <div class=\"tgus-reel-col\" id=\"tgus-reel-col-right\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-content\">\r\n      <div>\r\n        <svg class=\"tgus-quote-icon\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\"><path d=\"M4.58 17.32C3.55 16.23 3 15 3 13.01c0-3.5 2.46-6.64 6.03-8.19l.9 1.38c-3.34 1.8-4 4.15-4.25 5.62.54-.28 1.24-.38 1.93-.31 1.8.17 3.23 1.65 3.23 3.49a3.5 3.5 0 0 1-3.5 3.5c-1.07 0-2.1-.49-2.75-1.18zm10 0C13.55 16.23 13 15 13 13.01c0-3.5 2.46-6.64 6.03-8.19l.9 1.38c-3.34 1.8-4 4.15-4.25 5.62.54-.28 1.24-.38 1.93-.31 1.8.17 3.23 1.65 3.23 3.49a3.5 3.5 0 0 1-3.5 3.5c-1.07 0-2.1-.49-2.75-1.18z\"\/><\/svg>\r\n        <div class=\"tgus-stage\" id=\"tgus-reel-stage\"><\/div>\r\n      <\/div>\r\n      <div class=\"tgus-controls\" id=\"tgus-reel-dots\"><\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n  (function(){\r\n    var revealEl = document.getElementById('tgus-testi-reel-reveal');\r\n    if(revealEl){\r\n      var reduceMotionReveal = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n      var TGUS_COLORS = ['#5ec8f2', '#3b82f6', '#8b7cf6', '#ffffff', '#6d5ef0'];\r\n      var TGUS_TEXT_COLOR = '#f4f4f8';\r\n      var BAND_HALF = 17;\r\n      var SWEEP_START = -BAND_HALF;\r\n      var SWEEP_END = 100 + BAND_HALF;\r\n      var sweepEase = function(t){ return t < 0.5 ? 4 * t*t*t : 1 - Math.pow(-2*t+2, 3) \/ 2; };\r\n      var buildGradient = function(pos){\r\n        var bandStart = pos - BAND_HALF, bandEnd = pos + BAND_HALF;\r\n        if(bandStart >= 100) return 'linear-gradient(90deg,' + TGUS_TEXT_COLOR + ',' + TGUS_TEXT_COLOR + ')';\r\n        var n = TGUS_COLORS.length, parts = [];\r\n        if(bandStart > 0) parts.push(TGUS_TEXT_COLOR + ' 0%', TGUS_TEXT_COLOR + ' ' + bandStart.toFixed(2) + '%');\r\n        TGUS_COLORS.forEach(function(c, i){\r\n          var pct = n === 1 ? pos : bandStart + (i \/ (n - 1)) * BAND_HALF * 2;\r\n          parts.push(c + ' ' + pct.toFixed(2) + '%');\r\n        });\r\n        if(bandEnd < 100) parts.push('transparent ' + bandEnd.toFixed(2) + '%', 'transparent 100%');\r\n        return 'linear-gradient(90deg,' + parts.join(',') + ')';\r\n      };\r\n      var activateGradWord = function(lineEl){ var w = lineEl.querySelector('.tgus-grad-word'); if(w) w.classList.add('tgus-grad-active'); };\r\n      var sweepOne = function(el, duration){\r\n        var start = performance.now();\r\n        el.style.backgroundImage = buildGradient(SWEEP_START);\r\n        function tick(){\r\n          var t = Math.min((performance.now() - start) \/ duration, 1);\r\n          el.style.backgroundImage = buildGradient(SWEEP_START + (SWEEP_END - SWEEP_START) * sweepEase(t));\r\n          if(t < 1) requestAnimationFrame(tick); else activateGradWord(el);\r\n        }\r\n        requestAnimationFrame(tick);\r\n      };\r\n      if(reduceMotionReveal){ revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n      else if('IntersectionObserver' in window){\r\n        var revealFired = false;\r\n        new IntersectionObserver(function(entries){\r\n          entries.forEach(function(e){ if(e.isIntersecting && !revealFired){ revealFired = true; setTimeout(function(){ sweepOne(revealEl, 900); }, 150); } });\r\n        }, { threshold: .3 }).observe(revealEl);\r\n      } else { revealEl.style.backgroundImage = buildGradient(SWEEP_END); activateGradWord(revealEl); }\r\n    }\r\n  })();\r\n  <\/script>\r\n\r\n  <script>\r\n  (function(){\r\n    var root = document.getElementById('tgus-testi-reel-root');\r\n    if(!root) return;\r\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n    var testimonials;\r\n    try{\r\n      var dataEl = document.getElementById('tgus-testi-reel-data');\r\n      testimonials = JSON.parse(dataEl.textContent);\r\n    }catch(e){ console.error('[tgus-testi-reel] error parsing testimonials:', e); return; }\r\n    if(!testimonials || !testimonials.length) return;\r\n\r\n    var CELL = 96, GAP = 8;\r\n    var STEP = 3 * (CELL + GAP);\r\n    var EXIT_MS = 220;\r\n    var SLIDE_MS = 800;\r\n\r\n    var colLeft = document.getElementById('tgus-reel-col-left');\r\n    var colMid = document.getElementById('tgus-reel-col-mid');\r\n    var colRight = document.getElementById('tgus-reel-col-right');\r\n    var stage = document.getElementById('tgus-reel-stage');\r\n    var dotsWrap = document.getElementById('tgus-reel-dots');\r\n\r\n    var count = testimonials.length;\r\n    var index = 0, displayIndex = 0, animating = false;\r\n\r\n    \/* ---------- construir columnas ---------- *\/\r\n    function makeCell(){\r\n      var d = document.createElement('div');\r\n      d.className = 'tgus-cell';\r\n      return d;\r\n    }\r\n    function makeFeatured(t){\r\n      var d = document.createElement('div');\r\n      d.className = 'tgus-featured';\r\n      var img = document.createElement('img');\r\n      img.src = t.image; img.alt = ''; img.loading = 'lazy'; img.decoding = 'async';\r\n      d.appendChild(img);\r\n      return d;\r\n    }\r\n\r\n    var sideCellCount = 4 + 2 * count;\r\n    for(var s = 0; s < sideCellCount; s++){\r\n      colLeft.appendChild(makeCell());\r\n      colRight.appendChild(makeCell());\r\n    }\r\n    for(var i = 0; i < 3; i++){ colMid.appendChild(makeCell()); }\r\n    testimonials.forEach(function(t, i){\r\n      colMid.appendChild(makeFeatured(t));\r\n      if(i < count - 1){ colMid.appendChild(makeCell()); colMid.appendChild(makeCell()); }\r\n    });\r\n    for(var j = 0; j < 3; j++){ colMid.appendChild(makeCell()); }\r\n\r\n    var centerIdx = (count - 1) \/ 2;\r\n    function applyPositions(){\r\n      var middleY = (centerIdx - index) * STEP;\r\n      var sideY = -middleY;\r\n      var transition = reduceMotion ? 'none' : 'transform ' + SLIDE_MS + 'ms cubic-bezier(.65,0,.35,1)';\r\n      [colMid, colLeft, colRight].forEach(function(el){ el.style.transition = transition; });\r\n      colMid.style.transform = 'translateY(' + middleY + 'px)';\r\n      colLeft.style.transform = 'translateY(' + sideY + 'px)';\r\n      colRight.style.transform = 'translateY(' + sideY + 'px)';\r\n    }\r\n\r\n    \/* ---------- texto animado ---------- *\/\r\n    function buildChars(text, container){\r\n      var words = text.split(' ');\r\n      var idx = 0;\r\n      words.forEach(function(word, wi){\r\n        var wordSpan = document.createElement('span');\r\n        wordSpan.style.display = 'inline-block';\r\n        wordSpan.style.whiteSpace = 'nowrap';\r\n        word.split('').forEach(function(ch){\r\n          var span = document.createElement('span');\r\n          span.className = 'tgus-char';\r\n          span.style.animationDelay = (idx * 6) + 'ms';\r\n          span.textContent = ch;\r\n          wordSpan.appendChild(span);\r\n          idx++;\r\n        });\r\n        container.appendChild(wordSpan);\r\n        if(wi < words.length - 1){ container.appendChild(document.createTextNode(' ')); idx++; }\r\n      });\r\n    }\r\n\r\n    function renderStage(i){\r\n      var t = testimonials[i];\r\n      var block = document.createElement('div');\r\n      block.className = 'tgus-block';\r\n      var q = document.createElement('p');\r\n      q.className = 'tgus-quote';\r\n      buildChars(t.quote, q);\r\n      var a = document.createElement('p');\r\n      a.className = 'tgus-author';\r\n      buildChars(t.author, a);\r\n      block.appendChild(q);\r\n      block.appendChild(a);\r\n      stage.innerHTML = '';\r\n      stage.appendChild(block);\r\n    }\r\n    renderStage(displayIndex);\r\n\r\n    \/* ---------- dots ---------- *\/\r\n    var dots = [];\r\n    testimonials.forEach(function(t, i){\r\n      var b = document.createElement('button');\r\n      b.type = 'button';\r\n      b.className = 'tgus-dot';\r\n      b.setAttribute('aria-label', 'Testimonial ' + (i + 1));\r\n      b.addEventListener('click', function(){ goTo(i, true); });\r\n      dotsWrap.appendChild(b);\r\n      dots.push(b);\r\n    });\r\n    function updateDots(){\r\n      dots.forEach(function(d, i){ d.classList.toggle('is-active', i === index); });\r\n    }\r\n    updateDots();\r\n\r\n    function goTo(next, userInitiated){\r\n      if(animating || next === index) return;\r\n      animating = true;\r\n      index = next;\r\n      applyPositions();\r\n      updateDots();\r\n      if(userInitiated) restartAutoplay();\r\n\r\n      if(reduceMotion){\r\n        displayIndex = next;\r\n        renderStage(displayIndex);\r\n        animating = false;\r\n        return;\r\n      }\r\n\r\n      var current = stage.querySelector('.tgus-block');\r\n      if(current) current.classList.add('tgus-exiting');\r\n\r\n      setTimeout(function(){\r\n        displayIndex = next;\r\n        renderStage(displayIndex);\r\n      }, EXIT_MS);\r\n\r\n      setTimeout(function(){ animating = false; }, SLIDE_MS);\r\n    }\r\n\r\n    \/* ---------- autoplay: avanza cada 5s, pausa en hover\/focus, se reinicia al navegar a mano ---------- *\/\r\n    var AUTOPLAY_MS = 5000;\r\n    var autoplayTimer = null;\r\n    function startAutoplay(){\r\n      if(reduceMotion) return;\r\n      stopAutoplay();\r\n      autoplayTimer = setInterval(function(){\r\n        goTo((index + 1) % count, false);\r\n      }, AUTOPLAY_MS);\r\n    }\r\n    function stopAutoplay(){\r\n      if(autoplayTimer){ clearInterval(autoplayTimer); autoplayTimer = null; }\r\n    }\r\n    function restartAutoplay(){ startAutoplay(); }\r\n\r\n    root.addEventListener('mouseenter', stopAutoplay);\r\n    root.addEventListener('mouseleave', startAutoplay);\r\n    root.addEventListener('focusin', stopAutoplay);\r\n    root.addEventListener('focusout', startAutoplay);\r\n\r\n    if('IntersectionObserver' in window){\r\n      new IntersectionObserver(function(entries){\r\n        entries.forEach(function(e){ if(e.isIntersecting) startAutoplay(); else stopAutoplay(); });\r\n      }, { threshold: .2 }).observe(root);\r\n    } else {\r\n      startAutoplay();\r\n    }\r\n\r\n    root.setAttribute('tabindex', '0');\r\n    root.addEventListener('keydown', function(e){\r\n      if(e.key === 'ArrowRight'){ e.preventDefault(); goTo((index + 1) % count, true); }\r\n      if(e.key === 'ArrowLeft'){ e.preventDefault(); goTo((index - 1 + count) % count, true); }\r\n    });\r\n\r\n    \/* posici\u00f3n inicial sin transici\u00f3n *\/\r\n    colMid.style.transition = 'none';\r\n    colLeft.style.transition = 'none';\r\n    colRight.style.transition = 'none';\r\n    applyPositions();\r\n    requestAnimationFrame(function(){\r\n      requestAnimationFrame(function(){\r\n        colMid.style.transition = '';\r\n        colLeft.style.transition = '';\r\n        colRight.style.transition = '';\r\n      });\r\n    });\r\n  })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f8c2769 elementor-widget elementor-widget-html\" data-id=\"f8c2769\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 11-faq.html (Home \u2014 secci\u00f3n 01.10 \u00b7 FAQ)\r\n  Layout: heading a la izquierda + 2 columnas de FAQ en formato\r\n  pill-card (acorde\u00f3n), replicando el widget real del home ES\r\n  (togrowagencia.com) con las 12 preguntas, traducidas al ingl\u00e9s.\r\n  Sin form\/CTA.\r\n  Prefijo CSS: #tgus-faq\r\n  Pegar en widget HTML de Elementor, d\u00e9cima secci\u00f3n del home.\r\n============================================================= -->\r\n<section id=\"tgus-faq\">\r\n  <style>\r\n    #tgus-faq {\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-card-bg: #0c0c14;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.12);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4rem, 8vw, 6rem) clamp(1.25rem, 5vw, 4rem);\r\n      min-width: 0;\r\n    }\r\n    #tgus-faq *, #tgus-faq *::before, #tgus-faq *::after { box-sizing: border-box; }\r\n\r\n    #tgus-faq .tgus-wrap { max-width: 1320px; margin: 0 auto; }\r\n\r\n    #tgus-faq .tgus-heading-col { min-width: 0; text-align: center; max-width: 640px; margin: 0 auto clamp(2.5rem, 5vw, 3.5rem); }\r\n    #tgus-faq h2 {\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(1.7rem,2.6vw,2.1rem) !important;\r\n      font-weight: 800 !important;\r\n      line-height: 1.15 !important;\r\n      margin: 0 0 1.25rem !important;\r\n    }\r\n    #tgus-faq h2 .tgus-grad {\r\n      background-image: linear-gradient(100deg, var(--tgus-cyan), var(--tgus-blue) 55%, var(--tgus-violet));\r\n      background-clip: text; -webkit-background-clip: text;\r\n      color: transparent;\r\n    }\r\n    #tgus-faq .tgus-sub { font-size: .96rem !important; line-height: 1.6 !important; color: var(--tgus-text-dim) !important; margin: 0 auto !important; max-width: 46ch; }\r\n\r\n    #tgus-faq .tgus-faq-shell {\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap: clamp(1.5rem, 3vw, 2.5rem);\r\n      align-items: start;\r\n    }\r\n\r\n    #tgus-faq .tgus-faq-col { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }\r\n\r\n    \/* ---- pill card \/ native <details>, zero JS ---- *\/\r\n    #tgus-faq details {\r\n      background: var(--tgus-card-bg);\r\n      border: 1px solid var(--tgus-border);\r\n      border-radius: 26px;\r\n      padding: 1.1rem 1.4rem;\r\n      transition: border-color .25s var(--tgus-ease);\r\n    }\r\n    #tgus-faq details[open] { border-color: rgba(94,200,242,.4); }\r\n    #tgus-faq summary {\r\n      cursor: pointer;\r\n      list-style: none;\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      gap: 1rem;\r\n      font-weight: 700 !important;\r\n      font-size: .96rem !important;\r\n      line-height: 1.4 !important;\r\n      color: var(--tgus-text) !important;\r\n    }\r\n    #tgus-faq summary::-webkit-details-marker { display: none; }\r\n    #tgus-faq .tgus-plus {\r\n      flex-shrink: 0;\r\n      width: 30px; height: 30px;\r\n      border-radius: 50%;\r\n      border: 1.5px solid var(--tgus-cyan);\r\n      display: flex; align-items: center; justify-content: center;\r\n      position: relative;\r\n      transition: transform .3s var(--tgus-ease), background .25s var(--tgus-ease);\r\n    }\r\n    #tgus-faq .tgus-plus::before,\r\n    #tgus-faq .tgus-plus::after {\r\n      content: '';\r\n      position: absolute;\r\n      background: var(--tgus-cyan);\r\n      transition: transform .3s var(--tgus-ease);\r\n    }\r\n    #tgus-faq .tgus-plus::before { width: 12px; height: 1.5px; }\r\n    #tgus-faq .tgus-plus::after { width: 1.5px; height: 12px; }\r\n    #tgus-faq details[open] .tgus-plus { background: rgba(94,200,242,.15); transform: rotate(45deg); }\r\n    #tgus-faq details p {\r\n      margin: .9rem 0 0 !important;\r\n      font-size: .9rem !important;\r\n      line-height: 1.6 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n    }\r\n    #tgus-faq summary:focus-visible { outline: 2px solid var(--tgus-blue); outline-offset: 4px; border-radius: 8px; }\r\n\r\n    @media (max-width: 768px) {\r\n      #tgus-faq .tgus-faq-shell { grid-template-columns: 1fr; }\r\n    }\r\n    @media (max-width: 420px) {\r\n      #tgus-faq details { padding: 1rem 1.1rem; border-radius: 20px; }\r\n      #tgus-faq summary { font-size: .92rem !important; }\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      #tgus-faq details, #tgus-faq .tgus-plus, #tgus-faq .tgus-plus::before, #tgus-faq .tgus-plus::after { transition: none; }\r\n    }\r\n  <\/style>\r\n\r\n  <div class=\"tgus-wrap\">\r\n    <div class=\"tgus-heading-col\">\r\n      <h2>Frequently Asked <span class=\"tgus-grad\">Questions at ToGrow<\/span> Agencia<\/h2>\r\n      <p class=\"tgus-sub\">We answer the most common questions about AI, software and digital marketing. Can't find yours? Contact us.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"tgus-faq-shell\">\r\n      <div class=\"tgus-faq-col\">\r\n        <details open>\r\n          <summary><span>How can digital marketing help my business grow?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Digital marketing increases your company's visibility online, attracts potential customers, and converts them into sales. Through strategies like SEO, social media and Google Ads, email marketing and automation, an agency can help you outperform your competition and improve your business's profitability.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>How long does it take to see results with digital marketing?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>It depends on the strategy. SEO, for example, can take 3 to 6 months to generate sustainable results, while Google Ads and social media campaigns can bring customers within the first few days. The most effective approach combines short- and long-term tactics for continuous growth.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>How does automation with AI agents work?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Our AI agents are autonomous tools that optimize marketing and sales processes in real time. For example, they automate lead funnels, predictive chatbots and data analysis inside CRMs. We integrate AI with your existing software to cut costs by up to 40% and increase conversions, adapting to your industry.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>How do you measure the success of digital marketing campaigns?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>We use key metrics like website traffic, conversions, click-through rate (CTR), return on investment (ROI) and social media engagement. We also run periodic reports with detailed performance analysis and adjust strategy based on results to maximize impact on your business.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>What is Google Ads and how does it work?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Google Ads is Google's online advertising platform, letting businesses show ads on Google search results, YouTube and partner sites. It runs on a pay-per-click (PPC) model, meaning advertisers only pay when someone clicks their ad.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>How much does it cost to advertise on Google Ads?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>The cost varies based on factors like keyword competitiveness, ad quality and daily budget. There's no mandatory minimum spend, and advertisers can adjust their budget to fit their needs and goals.<\/p>\r\n        <\/details>\r\n      <\/div>\r\n\r\n      <div class=\"tgus-faq-col\">\r\n        <details>\r\n          <summary><span>How can I measure the success of my Google Ads campaigns?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Campaign success is measured through metrics like impressions, clicks, click-through rate (CTR), cost per click (CPC) and conversions. Google Ads provides detailed analytics tools that let advertisers evaluate ad performance and make adjustments to optimize results.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>How long does it take to see results with Google Ads?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Results can vary by industry, competition and campaign quality. Even so, many businesses start seeing results within the first few weeks of running their campaigns.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>Is Google Ads suitable for small businesses?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Yes, Google Ads works well for small and medium businesses since it lets you control ad spend effectively, target specific audiences, and measure results to optimize investment.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>Why should I hire an agency to manage my social media?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>Managing social media goes beyond posting content. A professional agency builds strategies aligned with your business goals, creates engaging content, manages customer interaction, and analyzes metrics to improve results. We also optimize paid campaigns to maximize return on investment.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>What kind of content will you publish on my social media?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>We create custom content tailored to your brand and target audience \u2014 images, videos, infographics, stories, reels, and promotional or educational posts. We also plan engagement strategies to grow your audience's participation and strengthen your online presence.<\/p>\r\n        <\/details>\r\n        <details>\r\n          <summary><span>How long does it take to see the impact of a social media strategy?<\/span><span class=\"tgus-plus\" aria-hidden=\"true\"><\/span><\/summary>\r\n          <p>It depends on your goals and strategy. Organic growth takes time and consistency, while paid ads can generate faster results. Generally, improvements in engagement and brand recognition appear within the first three months, with sustained growth long-term.<\/p>\r\n        <\/details>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9989893 elementor-widget elementor-widget-html\" data-id=\"9989893\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  TGUS \u2014 13-final-cta.html (Home \u2014 secci\u00f3n 01.11 \u00b7 Final CTA)\r\n  Adaptaci\u00f3n 1:1 del componente de referencia que pas\u00f3 el usuario\r\n  (mismo fondo con dot-grid + glow ambiental a la deriva, mismos\r\n  botones \"glass\" primario\/ghost, mismo bloque de \"related services\"),\r\n  solo con el copy y los links ajustados al home.\r\n  Prefijo CSS: #tgus-finalcta-section\r\n  Pegar en widget HTML de Elementor, \u00faltima secci\u00f3n del home.\r\n\r\n  CONTENIDO: el bot\u00f3n principal va a \"Book a call\" (\/contact\/) en vez\r\n  de WhatsApp \u2014 el proyecto ya defini\u00f3 que WhatsApp es canal de\r\n  soporte, no CTA de conversi\u00f3n. Reemplazar [LINK_*] por las URLs\r\n  reales antes de publicar.\r\n============================================================= -->\r\n<section id=\"tgus-finalcta-section\" class=\"tgus-finalcta-section\">\r\n  <style>\r\n    #tgus-finalcta-section {\r\n      --tgus-bg-0: #05050a;\r\n      --tgus-bg-2: #15151f;\r\n      --tgus-blue: #3b82f6;\r\n      --tgus-blue-400: #3b82f6;\r\n      --tgus-blue-500: #2563eb;\r\n      --tgus-blue-600: #1d4ed8;\r\n      --tgus-violet: #8b7cf6;\r\n      --tgus-violet-d: #6d5ef0;\r\n      --tgus-cyan: #5ec8f2;\r\n      --tgus-cyan-300: #5ec8f2;\r\n      --tgus-text: #f4f4f8;\r\n      --tgus-text-dim: #9a9aa8;\r\n      --tgus-border: rgba(255,255,255,.08);\r\n      --tgus-ease: cubic-bezier(.16,1,.3,1);\r\n      --tgus-font-display: 'Bricolage Grotesque', system-ui, sans-serif;\r\n      --tgus-font-body: 'Plus Jakarta Sans', system-ui, sans-serif;\r\n\r\n      position: relative;\r\n      background: var(--tgus-bg-0);\r\n      color: var(--tgus-text);\r\n      font-family: var(--tgus-font-body) !important;\r\n      padding: clamp(4.5rem, 9vw, 7.5rem) clamp(1.25rem, 5vw, 4rem);\r\n      overflow: hidden;\r\n      isolation: isolate;\r\n      min-width: 0;\r\n    }\r\n    #tgus-finalcta-section *, #tgus-finalcta-section *::before, #tgus-finalcta-section *::after { box-sizing: border-box; }\r\n\r\n    #tgus-finalcta-grid {\r\n      position: absolute; inset: 0; z-index: 0;\r\n      background-image: radial-gradient(circle, rgba(255,255,255,.05) 1px, transparent 1.4px);\r\n      background-size: 26px 26px;\r\n      -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black, transparent 75%);\r\n      mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black, transparent 75%);\r\n      pointer-events: none;\r\n    }\r\n    #tgus-finalcta-ambient {\r\n      position: absolute; inset: 0; z-index: 0;\r\n      pointer-events: none;\r\n      overflow: hidden;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n    }\r\n    #tgus-finalcta-ambient span {\r\n      width: 58rem; height: 34rem;\r\n      border-radius: 50%;\r\n      background: radial-gradient(ellipse, rgba(37,99,235,.28) 0%, rgba(109,94,240,.14) 45%, transparent 75%);\r\n      filter: blur(28px);\r\n      animation: tgus-finalcta-drift 24s cubic-bezier(.16,1,.3,1) infinite alternate;\r\n    }\r\n    @keyframes tgus-finalcta-drift {\r\n      from { transform: translate(0, 0); }\r\n      to { transform: translate(-2rem, 1.5rem); }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      #tgus-finalcta-ambient span { animation: none !important; }\r\n    }\r\n\r\n    #tgus-finalcta-inner {\r\n      position: relative; z-index: 2;\r\n      max-width: 720px;\r\n      margin: 0 auto;\r\n      text-align: center;\r\n    }\r\n\r\n    #tgus-finalcta-title {\r\n      font-family: var(--tgus-font-display) !important;\r\n      font-size: clamp(2rem, 4vw, 3rem) !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.15 !important;\r\n      letter-spacing: -0.02em !important;\r\n      margin: 0 0 1.1rem !important;\r\n      color: var(--tgus-text) !important;\r\n      text-wrap: balance;\r\n    }\r\n    #tgus-finalcta-inner > p {\r\n      font-size: 1.05rem !important;\r\n      line-height: 1.65 !important;\r\n      color: var(--tgus-text-dim) !important;\r\n      margin: 0 auto clamp(2rem, 4vw, 2.5rem) !important;\r\n      max-width: 56ch;\r\n    }\r\n\r\n    #tgus-finalcta-actions {\r\n      display: flex;\r\n      gap: .9rem;\r\n      justify-content: center;\r\n      flex-wrap: wrap;\r\n      margin-bottom: clamp(3rem, 6vw, 4.5rem);\r\n    }\r\n\r\n    .tgus-finalcta-btn {\r\n      --border-radius: 24px;\r\n      --padding: 4px;\r\n      --transition: .4s;\r\n\r\n      position: relative;\r\n      isolation: isolate;\r\n      user-select: none;\r\n      display: flex !important;\r\n      align-items: center;\r\n      justify-content: center;\r\n      gap: .6rem;\r\n      padding: .9rem .9rem .9rem 1.5rem !important;\r\n      font-family: var(--tgus-font-body) !important;\r\n      font-size: .95rem !important;\r\n      font-weight: 600 !important;\r\n      text-decoration: none !important;\r\n      color: #fff !important;\r\n      border-radius: var(--border-radius);\r\n      cursor: pointer;\r\n      outline: none;\r\n      -webkit-tap-highlight-color: transparent;\r\n      transition: box-shadow var(--transition), border var(--transition), background-image var(--transition), background-color var(--transition), transform var(--transition);\r\n    }\r\n    .tgus-finalcta-btn::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      top: calc(0px - var(--padding));\r\n      left: calc(0px - var(--padding));\r\n      width: calc(100% + var(--padding) * 2);\r\n      height: calc(100% + var(--padding) * 2);\r\n      border-radius: calc(var(--border-radius) + var(--padding));\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #0004, #000a);\r\n      z-index: -1;\r\n      transition: box-shadow var(--transition), filter var(--transition);\r\n      box-shadow:\r\n        1px 1px 1px rgba(255,255,255,.12),\r\n        2px 2px 2px rgba(255,255,255,.06),\r\n        -1px -1px 1px rgba(0,0,0,.13),\r\n        -2px -2px 2px rgba(0,0,0,.06);\r\n    }\r\n    .tgus-finalcta-btn::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      top: 0; left: 0;\r\n      width: 100%; height: 100%;\r\n      border-radius: inherit;\r\n      pointer-events: none;\r\n      background-image: linear-gradient(0deg, #fff, var(--tgus-cyan-300), var(--tgus-blue-500) 50%, transparent 85%);\r\n      opacity: 0;\r\n      transition: opacity var(--transition), filter var(--transition);\r\n    }\r\n    .tgus-finalcta-btn:focus-visible {\r\n      outline: 2px solid var(--tgus-cyan-300);\r\n      outline-offset: 3px;\r\n    }\r\n    .tgus-finalcta-btn .tgus-btn-letters {\r\n      position: relative; z-index: 2;\r\n      color: rgba(255,255,255,.92);\r\n      text-shadow: 0 1px 1px rgba(0,0,0,.25);\r\n    }\r\n    .tgus-finalcta-btn svg {\r\n      position: relative; z-index: 2;\r\n      width: 16px; height: 16px;\r\n      flex-shrink: 0;\r\n      fill: none;\r\n      stroke: #fff;\r\n      stroke-width: 2;\r\n      filter: drop-shadow(0 1px 1px rgba(0,0,0,.25));\r\n      transition: transform var(--transition);\r\n    }\r\n    .tgus-finalcta-btn:hover svg { transform: translateX(2px); }\r\n\r\n    .tgus-finalcta-btn.tgus-primary {\r\n      background-image: linear-gradient(180deg, var(--tgus-blue-400) 0%, var(--tgus-blue-600) 100%);\r\n      box-shadow:\r\n        inset 0px 1px 1px rgba(255,255,255,.45),\r\n        inset 0px 2px 3px rgba(255,255,255,.3),\r\n        inset 0px 4px 6px rgba(255,255,255,.15),\r\n        inset 0px 10px 14px rgba(255,255,255,.08),\r\n        0px -1px 1px rgba(0,0,0,.05),\r\n        0px -3px 4px rgba(0,0,0,.1),\r\n        0px -8px 14px rgba(0,0,0,.18),\r\n        0px 8px 20px -6px rgba(10,40,110,.55);\r\n      border: solid 1px rgba(255,255,255,.28) !important;\r\n    }\r\n    .tgus-finalcta-btn.tgus-primary:hover {\r\n      border-color: rgba(94,200,242,.5) !important;\r\n      background-image: linear-gradient(180deg, var(--tgus-cyan-300) 0%, var(--tgus-blue-500) 100%);\r\n      transform: translateY(-1px);\r\n    }\r\n    .tgus-finalcta-btn.tgus-primary:hover::after {\r\n      opacity: 1;\r\n      -webkit-mask-image: linear-gradient(0deg, #fff, transparent);\r\n      mask-image: linear-gradient(0deg, #fff, transparent);\r\n    }\r\n    .tgus-finalcta-btn.tgus-primary:active {\r\n      border-color: rgba(94,200,242,.7) !important;\r\n      background-image: linear-gradient(180deg, var(--tgus-blue-500) 0%, var(--tgus-blue-600) 100%);\r\n      transform: translateY(0) scale(.99);\r\n    }\r\n    .tgus-finalcta-btn.tgus-primary:active::after {\r\n      opacity: 1;\r\n      filter: brightness(200%);\r\n      -webkit-mask-image: linear-gradient(0deg, #fff, transparent);\r\n      mask-image: linear-gradient(0deg, #fff, transparent);\r\n    }\r\n\r\n    .tgus-finalcta-btn.tgus-ghost {\r\n      background-color: #111219;\r\n      box-shadow:\r\n        inset 0px 1px 1px rgba(255,255,255,.16),\r\n        inset 0px 2px 3px rgba(255,255,255,.1),\r\n        inset 0px 4px 6px rgba(255,255,255,.05),\r\n        0px -1px 1px rgba(0,0,0,.05),\r\n        0px -3px 4px rgba(0,0,0,.1);\r\n      border: solid 1px var(--tgus-border) !important;\r\n    }\r\n    .tgus-finalcta-btn.tgus-ghost .tgus-btn-letters {\r\n      color: var(--tgus-text) !important;\r\n    }\r\n    .tgus-finalcta-btn.tgus-ghost:hover {\r\n      border-color: rgba(94,200,242,.4) !important;\r\n      background-color: #15161f;\r\n      transform: translateY(-1px);\r\n    }\r\n    .tgus-finalcta-btn.tgus-ghost:hover::after {\r\n      opacity: .5;\r\n      -webkit-mask-image: linear-gradient(0deg, #fff, transparent);\r\n      mask-image: linear-gradient(0deg, #fff, transparent);\r\n    }\r\n    .tgus-finalcta-btn.tgus-ghost:active {\r\n      transform: translateY(0) scale(.99);\r\n    }\r\n\r\n    @media (max-width: 480px) {\r\n      #tgus-finalcta-actions { flex-direction: column; align-items: stretch; }\r\n      .tgus-finalcta-btn { justify-content: center; }\r\n    }\r\n  <\/style>\r\n\r\n  <div id=\"tgus-finalcta-grid\" aria-hidden=\"true\"><\/div>\r\n  <div id=\"tgus-finalcta-ambient\" aria-hidden=\"true\"><span><\/span><\/div>\r\n\r\n  <div id=\"tgus-finalcta-inner\">\r\n    <h2 id=\"tgus-finalcta-title\">The work that repeats shouldn't need a person. Let's find out what's worth automating.<\/h2>\r\n    <p>Fifteen minutes. We'll look at how work moves through your business and tell you honestly what's worth automating, what's worth building custom, and what isn't worth touching at all.<\/p>\r\n\r\n    <div id=\"tgus-finalcta-actions\">\r\n      <a class=\"tgus-finalcta-btn tgus-primary\" href=\"https:\/\/api.whatsapp.com\/send?phone=573103597580\" target=\"_blank\" rel=\"noopener\">\r\n        <span class=\"tgus-btn-letters\">Book a call<\/span>\r\n        <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>\r\n      <\/a>\r\n      <a class=\"tgus-finalcta-btn tgus-ghost\" href=\"\/en\/cases\/\">\r\n        <span class=\"tgus-btn-letters\">See our work<\/span>\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>The work that repeats shouldn&#8217;t need a person. ToGrow builds AI agents and custom software that take over the manual, repetitive parts of your operation \u2014 and one platform to run them from. Five in-house engineers. A U.S. company. A team that works your hours. Book a call See how it works Google Partner \u00b7 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-946","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/pages\/946","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/comments?post=946"}],"version-history":[{"count":151,"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/pages\/946\/revisions"}],"predecessor-version":[{"id":1302,"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/pages\/946\/revisions\/1302"}],"wp:attachment":[{"href":"https:\/\/togrowagencia.com\/en\/wp-json\/wp\/v2\/media?parent=946"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}