{"id":19,"date":"2025-11-20T03:41:32","date_gmt":"2025-11-20T03:41:32","guid":{"rendered":"https:\/\/soporteempresario.com.ar\/resource\/"},"modified":"2026-02-09T06:20:17","modified_gmt":"2026-02-09T06:20:17","slug":"casosexito","status":"publish","type":"page","link":"https:\/\/site.soporteempresario.com.ar\/en\/casosexito\/","title":{"rendered":"Success Stories"},"content":{"rendered":"\n<div class=\"wp-block-uagb-container uagb-block-8f19cd48 alignfull uagb-is-root-container\"><div class=\"uagb-container-inner-blocks-wrap\">\n<div class=\"wp-block-uagb-advanced-heading uagb-block-d05703c3\"><h1 class=\"uagb-heading-text\">Casos de \u00e9xito<\/h1><p class=\"uagb-desc-text\">Estos son algunos de los proyectos en los que nos integramos a la vida empresaria de nuestros clientes y los ayudamos a transformar problemas cotidianos en resultados medibles.<\/p><\/div>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-uagb-container uagb-block-0536dd09 alignfull uagb-is-root-container\">\n<!-- ==========<!-- ===================== CASOS DE \u00c9XITO  ===================== -->\n<section class=\"se-casos\" id=\"casos-exito\" aria-labelledby=\"casos-title\">\n  <link rel=\"preconnect\" href=\"http:\/\/fonts.gstatic.com\" crossorigin>\n  <link href=\"http:\/\/fonts.googleapis.com\/css2?family=Lato:wght@300;400;600;700;900&#038;display=swap\" rel=\"stylesheet\">\n\n  <style>\n    :root{\n      --se-font: \"Lato\", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;\n      --se-primary:#00a9c8;\n      --se-primary2:#4fd0e6;\n      --se-ink:#0b1b22;\n      --se-text:#0f2430;\n      --se-muted: rgba(15,36,48,.68);\n      --se-card: rgba(255,255,255,.74);\n      --se-card2: rgba(255,255,255,.58);\n      --se-radius: 22px;\n      --se-marqueeDur: 95s;\n\n      \/* Autoplay: duraci\u00f3n por caso (barra + avance) *\/\n      --se-panelAnimMs: 8000;\n\n      \/* En m\u00f3vil: m\u00e1s lento *\/\n      --se-panelAnimMsMobile: 12000;\n    }\n\n    \/* ===================== BASE + FX ===================== *\/\n    .se-casos{\n      font-family: var(--se-font);\n      color: var(--se-text);\n      position: relative;\n      overflow: clip;\n      padding: clamp(60px, 5.4vw, 102px) clamp(16px, 4.8vw, 66px);\n      background:\n        radial-gradient(900px at 14% 10%, rgba(0,169,200,.22) 0%, transparent 68%),\n        radial-gradient(820px at 86% 18%, rgba(120,230,255,.20) 0%, transparent 66%),\n        radial-gradient(900px at 50% 110%, rgba(0,169,200,.16) 0%, transparent 70%),\n        linear-gradient(to bottom, rgba(255,255,255,.98) 0%, rgba(255,255,255,.92) 35%, rgba(255,255,255,.98) 100%);\n      border-top: 1px solid rgba(0,169,200,.10);\n      border-bottom: 1px solid rgba(0,169,200,.10);\n    }\n    .se-casos::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      pointer-events:none;\n      background:\n        radial-gradient(520px at 22% 24%, rgba(0,169,200,.18), transparent 62%),\n        radial-gradient(680px at 78% 34%, rgba(79,208,230,.14), transparent 66%);\n      filter: blur(12px);\n      opacity:.95;\n      animation: seDrift 12s ease-in-out infinite alternate;\n    }\n    .se-casos::after{\n      content:\"\";\n      position:absolute; inset:0;\n      pointer-events:none;\n      background-image:\n        radial-gradient(circle at 10% 20%, rgba(0,0,0,.035) 0 1px, transparent 1px),\n        radial-gradient(circle at 70% 50%, rgba(0,0,0,.03) 0 1px, transparent 1px),\n        radial-gradient(circle at 40% 80%, rgba(0,0,0,.03) 0 1px, transparent 1px);\n      background-size: 120px 120px, 160px 160px, 220px 220px;\n      mix-blend-mode: multiply;\n      opacity:.20;\n    }\n    @keyframes seDrift{\n      from{ transform: translate3d(0,0,0) scale(1); }\n      to{ transform: translate3d(12px,-10px,0) scale(1.02); }\n    }\n\n    .se-casos__wrap{ position: relative; max-width: 1260px; margin: 0 auto; z-index: 1; }\n\n    \/* ===== Head ===== *\/\n    .se-casos__head{\n      display:flex;\n      align-items:flex-end;\n      justify-content:space-between;\n      gap: 18px;\n      margin-bottom: clamp(22px, 2.8vw, 40px);\n    }\n    .se-casos__kicker{\n      display:inline-flex;\n      align-items:center;\n      gap:10px;\n      font-size: 13px;\n      letter-spacing:.14em;\n      text-transform: uppercase;\n      color: rgba(15,36,48,.72);\n      margin-bottom: 12px;\n    }\n    .se-casos__dot{\n      width:10px;height:10px;border-radius:999px;\n      background: radial-gradient(circle at 30% 30%, #fff 0%, var(--se-primary) 55%, #0b7a8e 100%);\n      box-shadow: 0 0 0 6px rgba(0,169,200,.12);\n    }\n    .se-casos__title{\n      font-size: clamp(26px, 3.2vw, 46px);\n      line-height: 1.06;\n      margin: 0;\n      font-weight: 900;\n      letter-spacing: -0.02em;\n      color: var(--se-ink);\n    }\n    .se-casos__title .grad{\n      background: linear-gradient(90deg, var(--se-primary), #1aaed0, #69d7ee);\n      -webkit-background-clip:text;\n      background-clip:text;\n      color: transparent;\n    }\n    .se-casos__sub{\n      margin: 12px 0 0;\n      color: var(--se-muted);\n      max-width: 82ch;\n      font-size: 16px;\n      line-height: 1.68;\n    }\n\n    .se-casos__actions{\n      display:flex;\n      gap:10px;\n      flex-wrap: wrap;\n      justify-content:flex-end;\n    }\n    .se-btn{\n      appearance:none;\n      border: 1px solid rgba(0,169,200,.22);\n      background: rgba(255,255,255,.65);\n      color: var(--se-ink);\n      padding: 11px 16px;\n      border-radius: 999px;\n      font-weight: 900;\n      font-size: 13px;\n      cursor:pointer;\n      transition: transform .18s ease, box-shadow .18s ease, background .18s ease;\n      backdrop-filter: blur(12px);\n    }\n    .se-btn:hover{ transform: translateY(-1px); box-shadow: 0 12px 30px rgba(0,169,200,.12); }\n    .se-btn--solid{\n      background: linear-gradient(180deg, rgba(0,169,200,.95), rgba(0,169,200,.78));\n      color: #fff;\n      border-color: rgba(0,169,200,.38);\n      box-shadow: 0 16px 34px rgba(0,169,200,.20);\n    }\n\n    \/* ===== Aparecer\/desaparecer (reversible) ===== *\/\n    .se-io{\n      opacity: 0;\n      transform: translateY(14px);\n      filter: blur(10px);\n      transition: opacity .6s ease, transform .6s ease, filter .6s ease;\n      will-change: opacity, transform, filter;\n    }\n    .se-io.is-visible{ opacity:1; transform:translateY(0); filter: blur(0); }\n\n    \/* ===================== Selector ===================== *\/\n    .se-selector{ margin-top: 6px; }\n    .se-tabsShell{ position: relative; margin-top: 2px; }\n\n    .se-edgeBtn{\n      appearance:none;\n      border: 1px solid rgba(0,169,200,.18);\n      background: rgba(255,255,255,.72);\n      backdrop-filter: blur(12px);\n      width: 44px;\n      height: 44px;\n      border-radius: 999px;\n      display:grid;\n      place-items:center;\n      cursor:pointer;\n      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;\n      position:absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      z-index: 5;\n      box-shadow: 0 16px 36px rgba(0,169,200,.12);\n    }\n    .se-edgeBtn:hover{ transform: translateY(-50%) translateY(-1px); box-shadow: 0 20px 44px rgba(0,169,200,.16); border-color: rgba(0,169,200,.30); }\n    .se-edgeBtn svg{ width: 18px; height: 18px; opacity:.9; }\n    .se-edgeBtn.left{ left: -6px; }\n    .se-edgeBtn.right{ right: -6px; }\n\n    .se-tabsShell::before,\n    .se-tabsShell::after{\n      content:\"\";\n      position:absolute; top:0; bottom:0;\n      width: 56px;\n      pointer-events:none;\n      z-index: 4;\n    }\n    .se-tabsShell::before{\n      left:0;\n      background: linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,0));\n    }\n    .se-tabsShell::after{\n      right:0;\n      background: linear-gradient(270deg, rgba(255,255,255,.92), rgba(255,255,255,0));\n    }\n\n    .se-tabs{\n      display:flex;\n      gap: 12px;\n      overflow-x: auto;\n      padding: 6px 54px 14px;\n      scroll-snap-type: x mandatory;\n      -webkit-overflow-scrolling: touch;\n    }\n    .se-tabs::-webkit-scrollbar{ height: 8px; }\n    .se-tabs::-webkit-scrollbar-thumb{ background: rgba(0,169,200,.18); border-radius: 999px; }\n\n    \/* shine\/iluminaci\u00f3n *\/\n    .se-tab{\n      flex: 0 0 auto;\n      min-width: 290px;\n      scroll-snap-align: start;\n      display:flex;\n      align-items:center;\n      gap: 14px;\n      border-radius: var(--se-radius);\n      border: 1px solid rgba(0,169,200,.18);\n      background: linear-gradient(180deg, var(--se-card), var(--se-card2));\n      box-shadow: 0 12px 30px rgba(5,20,28,.10);\n      backdrop-filter: blur(14px);\n      padding: 16px 16px;\n      cursor: pointer;\n      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;\n      position: relative;\n      overflow:hidden;\n    }\n    .se-tab::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      background: radial-gradient(520px at 18% 22%, rgba(0,169,200,.18), transparent 62%);\n      filter: blur(16px);\n      opacity:.55;\n      pointer-events:none;\n    }\n    .se-tab::after{\n      content:\"\";\n      position:absolute;\n      inset:-45%;\n      background: linear-gradient(120deg, transparent 32%, rgba(255,255,255,.28) 48%, transparent 64%);\n      transform: translateX(-55%);\n      opacity: 0;\n      transition: transform .7s ease, opacity .7s ease;\n      pointer-events:none;\n    }\n    .se-tab:hover::after{ transform: translateX(55%); opacity: .95; }\n    .se-tab:hover{ transform: translateY(-1px); box-shadow: 0 18px 44px rgba(0,169,200,.14); border-color: rgba(0,169,200,.30); }\n    .se-tab.is-active{ border-color: rgba(0,169,200,.56); box-shadow: 0 18px 50px rgba(0,169,200,.18); }\n\n    .se-logoSlot{\n      width: 58px;\n      height: 58px;\n      border-radius: 16px;\n      border: 1px solid rgba(0,169,200,.18);\n      background: rgba(255,255,255,.55);\n      display:grid;\n      place-items:center;\n      overflow:hidden;\n      flex: 0 0 auto;\n      box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);\n      position: relative;\n      z-index: 1;\n    }\n    .se-logoSlot img{ width: 100%; height: 100%; object-fit: contain; padding: 10px; display:block; }\n\n    .se-tab__txt{ display:flex; flex-direction:column; gap: 5px; min-width: 0; position:relative; z-index:1; }\n    .se-tab__name{\n      margin:0;\n      font-weight: 900;\n      color: var(--se-ink);\n      font-size: 15.5px;\n      line-height: 1.15;\n      letter-spacing:-.01em;\n      white-space: nowrap; overflow:hidden; text-overflow: ellipsis;\n    }\n    .se-tab__role{\n      margin:0;\n      color: rgba(15,36,48,.70);\n      font-size: 13.2px;\n      line-height: 1.2;\n      white-space: nowrap; overflow:hidden; text-overflow: ellipsis;\n    }\n\n    \/* ===== Panel oscuro ===== *\/\n    .se-panel{\n      margin-top: 16px;\n      border-radius: calc(var(--se-radius) + 6px);\n      background: linear-gradient(180deg, rgba(12,24,30,.92), rgba(12,24,30,.86));\n      color: rgba(255,255,255,.92);\n      border: 1px solid rgba(79,208,230,.18);\n      box-shadow: 0 24px 70px rgba(5,20,28,.26);\n      overflow:hidden;\n      position:relative;\n      user-select: none;\n      touch-action: manipulation;\n    }\n    .se-panel::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      background:\n        radial-gradient(740px at 18% 20%, rgba(0,169,200,.38), transparent 64%),\n        radial-gradient(680px at 82% 10%, rgba(79,208,230,.20), transparent 66%);\n      filter: blur(18px);\n      opacity:.95;\n      pointer-events:none;\n    }\n    .se-panel__inner{ position:relative; padding: 24px 22px 22px; }\n\n    \/* barra *\/\n    .se-progress{\n      height: 4px;\n      width: 100%;\n      background: rgba(255,255,255,.10);\n      border-radius: 999px;\n      overflow:hidden;\n      margin: 0 0 14px;\n      border: 1px solid rgba(79,208,230,.14);\n    }\n    .se-progress > i{\n      display:block;\n      height: 100%;\n      width: 0%;\n      background: linear-gradient(90deg, rgba(0,169,200,.95), rgba(79,208,230,.85));\n      border-radius: 999px;\n      animation: none;\n      animation-play-state: running;\n      will-change: width;\n    }\n    @keyframes seFill{ from{ width: 0%; } to{ width: 100%; } }\n\n    .se-panel__top{\n      display:flex;\n      align-items:flex-start;\n      justify-content:space-between;\n      gap: 12px;\n      flex-wrap:wrap;\n      margin-bottom: 14px;\n    }\n    .se-panel__who h3{\n      margin:0;\n      font-weight: 900;\n      color:#fff;\n      letter-spacing:-.01em;\n      font-size: 18px;\n      line-height: 1.2;\n    }\n    .se-panel__who p{\n      margin:8px 0 0;\n      color: rgba(255,255,255,.78);\n      line-height:1.45;\n      font-size: 14px;\n      max-width: 90ch;\n    }\n\n    .se-chiprow{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }\n    .se-chip{\n      font-size: 12px;\n      padding: 6px 10px;\n      border-radius: 999px;\n      border: 1px solid rgba(79,208,230,.18);\n      background: rgba(255,255,255,.10);\n      color: rgba(255,255,255,.86);\n      font-weight: 900;\n      letter-spacing: .01em;\n    }\n\n    .se-panel__grid{\n      display:grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 14px;\n    }\n\n    \/* TESTIMONIO (panel oscuro) *\/\n    .se-quoteWrap{\n      position: relative;\n      padding-left: 16px;\n      border-left: 2px solid rgba(79,208,230,.30);\n    }\n    .se-quoteWrap::before{\n      content:\"\u201c\";\n      position:absolute;\n      left:-2px;\n      top:-12px;\n      font-size: 38px;\n      line-height: 1;\n      color: rgba(79,208,230,.28);\n      font-weight: 900;\n      pointer-events:none;\n    }\n    .se-quoteText{\n      margin:0;\n      font-size: 14.7px;\n      line-height: 1.75;\n      color: rgba(255,255,255,.88);\n    }\n    .se-box{\n      border-radius: 16px;\n      border: 1px solid rgba(79,208,230,.14);\n      background: rgba(255,255,255,.08);\n      padding: 16px 16px 15px;\n      backdrop-filter: blur(12px);\n      position: relative;\n      overflow: hidden;\n    }\n    .se-box h4{\n      margin:0 0 10px;\n      font-size: 12px;\n      letter-spacing:.12em;\n      text-transform: uppercase;\n      color: rgba(255,255,255,.76);\n      display:flex;\n      align-items:center;\n      gap:8px;\n    }\n    .se-box h4::before{\n      content:\"\u275d\";\n      color: rgba(79,208,230,.58);\n      font-size: 12px;\n      transform: translateY(-1px);\n      opacity:.55;\n    }\n\n    \/* ===================== GRID + FILTROS ===================== *\/\n    .se-gridwrap{\n      margin-top: clamp(32px, 4.4vw, 64px);\n      padding-top: clamp(22px, 3vw, 40px);\n      border-top: 1px solid rgba(0,169,200,.12);\n    }\n    .se-filters{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between; margin-bottom: 16px; }\n    .se-filters__left{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }\n    .se-filter{\n      border: 1px solid rgba(0,169,200,.18);\n      background: rgba(255,255,255,.60);\n      backdrop-filter: blur(12px);\n      color: rgba(15,36,48,.86);\n      padding: 10px 14px;\n      border-radius: 999px;\n      font-weight: 900;\n      cursor:pointer;\n      transition: transform .18s ease, box-shadow .18s ease, background .18s ease;\n      font-size: 13px;\n    }\n    .se-filter:hover{ transform: translateY(-1px); box-shadow: 0 14px 30px rgba(0,169,200,.10); }\n    .se-filter.is-on{\n      background: rgba(0,169,200,.10);\n      border-color: rgba(0,169,200,.34);\n      color: rgba(0,110,130,.98);\n    }\n\n    .se-grid{ display:grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }\n    .se-card{\n      grid-column: span 6;\n      border-radius: var(--se-radius);\n      background: linear-gradient(180deg, rgba(255,255,255,.74), rgba(255,255,255,.58));\n      border: 1px solid rgba(0,169,200,.18);\n      box-shadow: 0 12px 34px rgba(5,20,28,.10);\n      padding: 18px 18px 16px;\n      backdrop-filter: blur(14px);\n      overflow:hidden;\n      position:relative;\n      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;\n      will-change: transform, opacity, filter;\n    }\n    .se-card::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      background: radial-gradient(620px at 18% 22%, rgba(0,169,200,.18), transparent 62%);\n      filter: blur(16px);\n      opacity:.55;\n      pointer-events:none;\n    }\n    .se-card::after{\n      content:\"\";\n      position:absolute; inset:-50%;\n      background: linear-gradient(120deg, transparent 34%, rgba(255,255,255,.30) 50%, transparent 66%);\n      transform: translateX(-55%);\n      opacity: 0;\n      transition: transform .8s ease, opacity .8s ease;\n      pointer-events:none;\n    }\n    .se-card:hover::after{ transform: translateX(55%); opacity: .9; }\n    .se-card:hover{\n      transform: translateY(-2px);\n      box-shadow: 0 20px 54px rgba(0,169,200,.16);\n      border-color: rgba(0,169,200,.32);\n    }\n    .se-card__top{ display:flex; align-items:flex-start; justify-content:space-between; gap: 10px; position:relative; z-index:1; }\n    .se-card__name{ margin:0; font-weight: 900; color: var(--se-ink); font-size: 16.5px; line-height:1.25; }\n    .se-card__role{ margin:7px 0 0; color: rgba(15,36,48,.72); font-size: 13.5px; line-height:1.35; }\n\n    \/* grilla: solo testimonio *\/\n    .se-card__quote{\n      margin: 14px 0 0;\n      position:relative;\n      z-index:1;\n      padding-left: 16px;\n      border-left: 2px solid rgba(0,169,200,.28);\n    }\n    .se-card__quote::before{\n      content:\"\u201c\";\n      position:absolute;\n      left:-2px;\n      top:-10px;\n      font-size: 34px;\n      line-height: 1;\n      color: rgba(0,169,200,.22);\n      font-weight: 900;\n      pointer-events:none;\n    }\n    .se-card__quote p{\n      margin:0;\n      color: rgba(15,36,48,.86);\n      font-size: 14.6px;\n      line-height:1.75;\n    }\n    .se-card__chips{ display:flex; gap:8px; flex-wrap:wrap; margin-top: 14px; position:relative; z-index:1; }\n    .se-card__chips .se-chip{ background: rgba(0,169,200,.10); border-color: rgba(0,169,200,.22); color: rgba(0,110,130,.95); }\n\n    @keyframes seCardIn{ from{ opacity:0; transform: translateY(14px); filter: blur(8px); } to{ opacity:1; transform: translateY(0); filter: blur(0); } }\n    @keyframes seCardOut{ from{ opacity:1; transform: translateY(0); filter: blur(0); } to{ opacity:0; transform: translateY(10px); filter: blur(8px); } }\n    .se-card.is-entering{ animation: seCardIn .55s ease both; animation-delay: var(--d, 0ms); }\n    .se-card.is-leaving{ animation: seCardOut .28s ease both; }\n    .se-card.is-hidden{ display:none !important; }\n\n    \/* ===================== ANTES \/ DESPU\u00c9S (flip) ===================== *\/\n    .se-flip{\n      margin-top: clamp(22px, 3.2vw, 46px);\n      border-radius: calc(var(--se-radius) + 10px);\n      background: linear-gradient(180deg, rgba(12,24,30,.94), rgba(12,24,30,.88));\n      border: 1px solid rgba(79,208,230,.18);\n      box-shadow: 0 26px 76px rgba(5,20,28,.28);\n      overflow:hidden;\n      position:relative;\n    }\n    .se-flip::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      background:\n        radial-gradient(760px at 18% 18%, rgba(0,169,200,.34), transparent 64%),\n        radial-gradient(680px at 86% 26%, rgba(79,208,230,.18), transparent 66%),\n        radial-gradient(780px at 50% 120%, rgba(0,169,200,.16), transparent 70%);\n      filter: blur(18px);\n      opacity:.95;\n      pointer-events:none;\n      animation: seDrift2 10s ease-in-out infinite alternate;\n    }\n    @keyframes seDrift2{\n      from{ transform: translate3d(-6px,2px,0) scale(1); }\n      to{ transform: translate3d(10px,-6px,0) scale(1.03); }\n    }\n    .se-flip__inner{ position:relative; padding: 22px 20px 22px; }\n    .se-flip__head{ display:flex; align-items:flex-end; justify-content:space-between; gap: 12px; flex-wrap:wrap; margin-bottom: 14px; }\n    .se-flip__head h3{ margin:0; color:#fff; font-weight: 900; letter-spacing:-.01em; font-size: 20px; }\n    .se-flip__head p{ margin:10px 0 0; color: rgba(255,255,255,.78); line-height:1.6; max-width: 80ch; font-size: 14.5px; }\n    .se-flip__hint{ color: rgba(255,255,255,.72); font-size: 13px; font-weight: 900; display:flex; align-items:center; gap: 8px; }\n    .se-flip__hint i{ width:10px;height:10px;border-radius:999px; background: radial-gradient(circle at 30% 30%, #fff 0%, var(--se-primary2) 52%, #0e8ea8 100%); box-shadow: 0 0 0 7px rgba(79,208,230,.12); display:inline-block; }\n\n    .se-flipGrid{ display:grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }\n    .se-flipCol{ grid-column: span 4; }\n    .se-flipCard{ border-radius: 20px; position: relative; height: 220px; perspective: 1000px; }\n    .se-flipInner{ position:absolute; inset:0; border-radius: 20px; transform-style: preserve-3d; transition: transform .65s cubic-bezier(.2,.8,.2,1); }\n    @media (hover:hover){ .se-flipCard:hover .se-flipInner{ transform: rotateY(180deg); } }\n    .se-flipCard.is-flipped .se-flipInner{ transform: rotateY(180deg); }\n\n    .se-face{\n      position:absolute; inset:0;\n      border-radius: 20px;\n      backface-visibility: hidden;\n      border: 1px solid rgba(79,208,230,.16);\n      background: rgba(255,255,255,.08);\n      backdrop-filter: blur(14px);\n      padding: 16px 16px 14px;\n      overflow:hidden;\n    }\n    .se-front{ transform: rotateY(0deg); }\n    .se-back{\n      transform: rotateY(180deg);\n      background: rgba(255,255,255,.88);\n      border-color: rgba(0,169,200,.18);\n      color: var(--se-ink);\n    }\n    .se-face h4{\n      margin:0 0 8px;\n      font-weight: 900;\n      letter-spacing:-.01em;\n      font-size: 16px;\n      display:flex;\n      align-items:center;\n      justify-content:space-between;\n      gap: 10px;\n    }\n    .se-pillTag{\n      font-size: 11px;\n      font-weight: 900;\n      padding: 6px 10px;\n      border-radius: 999px;\n      background: rgba(255,255,255,.10);\n      border: 1px solid rgba(255,255,255,.12);\n      white-space: nowrap;\n    }\n    .se-front h4{ color:#fff; }\n    .se-front ul, .se-front p{ color: rgba(255,255,255,.86); }\n    .se-back h4{ color: var(--se-ink); }\n    .se-back .se-pillTag{\n      background: rgba(0,169,200,.10);\n      border-color: rgba(0,169,200,.18);\n      color: rgba(0,110,130,.98);\n    }\n    .se-back ul{ color: rgba(15,36,48,.88); }\n    .se-back p{ color: rgba(15,36,48,.72); }\n    .se-face ul{ margin:0; padding-left: 18px; line-height: 1.7; font-size: 14px; }\n    .se-face p{ margin: 8px 0 0; line-height: 1.55; font-size: 13.5px; }\n\n    \/* ===================== LOGOS ===================== *\/\n    .se-logos{\n      margin-top: clamp(24px, 3.2vw, 48px);\n      border-radius: calc(var(--se-radius) + 6px);\n      border: 1px solid rgba(0,169,200,.14);\n      background: linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.55));\n      box-shadow: 0 20px 56px rgba(0,169,200,.14);\n      backdrop-filter: blur(14px);\n      overflow:hidden;\n      position:relative;\n    }\n    .se-logos::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      background: radial-gradient(720px at 20% 20%, rgba(0,169,200,.14), transparent 66%);\n      filter: blur(18px);\n      opacity:.95;\n      pointer-events:none;\n    }\n    .se-logos__head{\n      position:relative;\n      padding: 20px 20px 12px;\n      display:flex;\n      align-items:flex-end;\n      justify-content:space-between;\n      gap: 10px;\n      flex-wrap:wrap;\n      z-index:1;\n    }\n    .se-logos__head h3{ margin:0; font-weight: 900; color: var(--se-ink); letter-spacing:-.01em; font-size: 18px; }\n    .se-logos__head p{ margin:8px 0 0; color: var(--se-muted); font-size: 14px; line-height:1.55; max-width: 96ch; }\n\n    ..se-marquee{\n      position: relative;\n      z-index: 1;\n      padding: 14px 16px 22px;   \/* ???? el padding va ac\u00e1 *\/\n      overflow: hidden;\n    }\n\n    .se-track{\n      display:flex;\n      gap: 14px;\n      width: max-content;\n      animation: seScroll var(--se-marqueeDur) linear infinite;\n      will-change: transform;\n      padding: 0;                \/* ???? sacalo del track *\/\n    }\n    .se-marquee:hover .se-track{ animation-play-state: paused; }\n    @keyframes seScroll{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }\n\n    .se-logoCard{\n      width: 190px;\n      height: 102px;\n      border-radius: 22px;\n      border: 1px solid rgba(0,169,200,.16);\n      background: rgba(255,255,255,.62);\n      overflow: hidden;\n      backdrop-filter: blur(12px);\n      box-shadow: 0 14px 34px rgba(5,20,28,.10);\n      padding: 16px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .se-logoCard img{\n      \/* ???? importante *\/\n      padding: 0;\n      width: auto;\n      height: auto;\n      max-width: 100%;\n      max-height: 100%;\n      object-fit: contain;\n      display: block;\n    }\n    .se-logoCard span{ color: rgba(15,36,48,.55); font-weight: 900; font-size: 12px; letter-spacing:.06em; text-transform: uppercase; }\n\n    \/* ===================== CTA ===================== *\/\n    .se-cta{\n      margin-top: clamp(24px, 3.2vw, 48px);\n      border-radius: calc(var(--se-radius) + 6px);\n      background: linear-gradient(180deg, rgba(12,24,30,.92), rgba(12,24,30,.86));\n      color: rgba(255,255,255,.92);\n      border: 1px solid rgba(79,208,230,.18);\n      box-shadow: 0 24px 70px rgba(5,20,28,.24);\n      overflow:hidden;\n      position:relative;\n    }\n    .se-cta::before{\n      content:\"\";\n      position:absolute; inset:-2px;\n      background:\n        radial-gradient(720px at 18% 20%, rgba(0,169,200,.34), transparent 64%),\n        radial-gradient(720px at 82% 10%, rgba(79,208,230,.18), transparent 66%);\n      filter: blur(18px);\n      opacity:.95;\n      pointer-events:none;\n    }\n    .se-cta__inner{\n      position:relative;\n      padding: 24px 22px 22px;\n      display:flex; align-items:center; justify-content:space-between;\n      gap: 12px; flex-wrap:wrap;\n    }\n    .se-cta__text h3{ margin:0; font-weight: 900; color:#fff; letter-spacing:-.01em; font-size: 20px; }\n    .se-cta__text p{ margin:10px 0 0; color: rgba(255,255,255,.78); line-height:1.65; max-width: 78ch; font-size: 14.8px; }\n\n    @media (max-width: 980px){\n      .se-casos__actions{ justify-content:flex-start; }\n      .se-card{ grid-column: span 12; }\n      .se-panel__grid{ grid-template-columns: 1fr; }\n      .se-tab{ min-width: 250px; }\n      .se-flipCol{ grid-column: span 12; }\n      .se-flipCard{ height: 210px; }\n      .se-edgeBtn.left{ left: -2px; }\n      .se-edgeBtn.right{ right: -2px; }\n    }\n\n    @media (prefers-reduced-motion: reduce){\n      .se-io, .se-tab, .se-card, .se-btn, .se-filter, .se-edgeBtn{ transition:none !important; }\n      .se-track{ animation: none !important; transform: none !important; }\n      .se-casos::before, .se-panel::before, .se-logos::before, .se-flip::before{ filter:none !important; animation:none !important; }\n      .se-card.is-entering, .se-card.is-leaving{ animation:none !important; }\n      .se-flipInner{ transition:none !important; }\n      .se-progress > i{ animation:none !important; width: 0% !important; }\n    }\n  <\/style>\n\n  <div class=\"se-casos__wrap\">\n    <div class=\"se-casos__head se-io\">\n      <div>\n        <div class=\"se-casos__kicker\"><span class=\"se-casos__dot\"><\/span> Casos de \u00e9xito<\/div>\n        <h2 class=\"se-casos__title\" id=\"casos-title\"><span class=\"grad\">Lo que dicen de nosotros<\/span><\/h2>\n        <p class=\"se-casos__sub\">\n          Testimonios reales de empresas que trabajaron con Soporte Empresario: m\u00e1s orden, m\u00e1s claridad y una base s\u00f3lida para crecer.\n        <\/p>\n      <\/div>\n\n      <div class=\"se-casos__actions\">\n        <button class=\"se-btn se-btn--solid\" type=\"button\" data-scroll=\"#casos-grid\">Ver testimonios<\/button>\n        <button class=\"se-btn\" type=\"button\" onclick=\"window.location.href='\/contact'\">Solicitar diagn\u00f3stico<\/button>\n      <\/div>\n    <\/div>\n\n    <!-- SELECTOR -->\n    <div class=\"se-selector se-io\" aria-label=\"Selector de casos\">\n      <div class=\"se-tabsShell\">\n        <button class=\"se-edgeBtn left\" type=\"button\" id=\"se-prev\" aria-label=\"Caso anterior\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n            <path d=\"M15 18l-6-6 6-6\" stroke=\"rgba(15,36,48,.85)\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n          <\/svg>\n        <\/button>\n\n        <div class=\"se-tabs\" id=\"se-tabs\" role=\"tablist\" aria-label=\"Casos destacados\"><\/div>\n\n        <button class=\"se-edgeBtn right\" type=\"button\" id=\"se-next\" aria-label=\"Siguiente caso\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n            <path d=\"M9 6l6 6-6 6\" stroke=\"rgba(15,36,48,.85)\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n          <\/svg>\n        <\/button>\n      <\/div>\n\n      <div class=\"se-panel se-io\" id=\"se-panel\" role=\"region\" aria-live=\"polite\">\n        <div class=\"se-panel__inner\" id=\"se-panel-inner\"><\/div>\n      <\/div>\n    <\/div>\n\n    <!-- GRID + FILTROS -->\n    <div class=\"se-gridwrap\" id=\"casos-grid\">\n      <div class=\"se-filters se-io\">\n        <div class=\"se-filters__left\" aria-label=\"Filtros de casos\">\n          <button class=\"se-filter is-on\" type=\"button\" data-filter=\"all\">Todos<\/button>\n          <button class=\"se-filter\" type=\"button\" data-filter=\"Recursos humanos\">Recursos humanos<\/button>\n          <button class=\"se-filter\" type=\"button\" data-filter=\"Comercializaci\u00f3n\">Comercializaci\u00f3n<\/button>\n          <button class=\"se-filter\" type=\"button\" data-filter=\"Huella de carbono\">Huella de carbono<\/button>\n        <\/div>\n      <\/div>\n\n      <div class=\"se-grid se-io\" id=\"se-grid\" aria-label=\"Listado de testimonios\"><\/div>\n\n      <!-- ANTES \/ DESPU\u00c9S (restaurado) -->\n      <div class=\"se-flip se-io\" id=\"se-flip\" aria-label=\"Antes y despu\u00e9s\">\n        <div class=\"se-flip__inner\">\n          <div class=\"se-flip__head\">\n            <div>\n              <h3>Antes \/ Despu\u00e9s<\/h3>\n              <p>Tres escenas t\u00edpicas que aparecen en los casos. Pas\u00e1 el mouse o toc\u00e1 la tarjeta para ver el \u201cdespu\u00e9s\u201d.<\/p>\n            <\/div>\n            <div class=\"se-flip__hint\"><i aria-hidden=\"true\"><\/i> Hover o tap para girar<\/div>\n          <\/div>\n\n          <div class=\"se-flipGrid\" role=\"list\">\n            <div class=\"se-flipCol\" role=\"listitem\">\n              <div class=\"se-flipCard\" data-flip>\n                <div class=\"se-flipInner\">\n                  <div class=\"se-face se-front\">\n                    <h4>Orden interno <span class=\"se-pillTag\">ANTES<\/span><\/h4>\n                    <ul>\n                      <li>Procesos \u201cen la cabeza\u201d de alguien<\/li>\n                      <li>Urgencias todo el d\u00eda<\/li>\n                      <li>Tareas repetidas y poco foco<\/li>\n                    <\/ul>\n                    <p>Se trabaja mucho\u2026 pero cuesta avanzar.<\/p>\n                  <\/div>\n                  <div class=\"se-face se-back\">\n                    <h4>Orden interno <span class=\"se-pillTag\">DESPU\u00c9S<\/span><\/h4>\n                    <ul>\n                      <li>Roles claros y responsables<\/li>\n                      <li>Procesos m\u00ednimos documentados<\/li>\n                      <li>Rutina de seguimiento simple<\/li>\n                    <\/ul>\n                    <p>Menos caos, m\u00e1s control y previsibilidad.<\/p>\n                  <\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n\n            <div class=\"se-flipCol\" role=\"listitem\">\n              <div class=\"se-flipCard\" data-flip>\n                <div class=\"se-flipInner\">\n                  <div class=\"se-face se-front\">\n                    <h4>Decisiones <span class=\"se-pillTag\">ANTES<\/span><\/h4>\n                    <ul>\n                      <li>Prioridades cambian cada semana<\/li>\n                      <li>\u201cProbemos\u201d sin medir<\/li>\n                      <li>Se discute, pero no se define<\/li>\n                    <\/ul>\n                    <p>Movimiento, pero sin direcci\u00f3n.<\/p>\n                  <\/div>\n                  <div class=\"se-face se-back\">\n                    <h4>Decisiones <span class=\"se-pillTag\">DESPU\u00c9S<\/span><\/h4>\n                    <ul>\n                      <li>Diagn\u00f3stico claro (sin distracciones)<\/li>\n                      <li>Plan realista con prioridades<\/li>\n                      <li>Seguimiento con indicadores simples<\/li>\n                    <\/ul>\n                    <p>Menos duda, m\u00e1s ejecuci\u00f3n.<\/p>\n                  <\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n\n            <div class=\"se-flipCol\" role=\"listitem\">\n              <div class=\"se-flipCard\" data-flip>\n                <div class=\"se-flipInner\">\n                  <div class=\"se-face se-front\">\n                    <h4>Equipos <span class=\"se-pillTag\">ANTES<\/span><\/h4>\n                    <ul>\n                      <li>Falta de confianza y m\u00e9todo<\/li>\n                      <li>Dependencia de \u201clos de siempre\u201d<\/li>\n                      <li>Capacitaci\u00f3n sin continuidad<\/li>\n                    <\/ul>\n                    <p>El sistema no se sostiene solo.<\/p>\n                  <\/div>\n                  <div class=\"se-face se-back\">\n                    <h4>Equipos <span class=\"se-pillTag\">DESPU\u00c9S<\/span><\/h4>\n                    <ul>\n                      <li>Herramientas + h\u00e1bitos instalados<\/li>\n                      <li>Autoconfianza y motivaci\u00f3n<\/li>\n                      <li>Acompa\u00f1amiento y soporte real<\/li>\n                    <\/ul>\n                    <p>El cambio queda andando.<\/p>\n                  <\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n\n        <\/div>\n      <\/div>\n\n      <!-- LOGOS -->\n      <div class=\"se-logos se-io\" id=\"se-logos\">\n        <div class=\"se-logos__head\">\n          <div>\n            <h3>Empresas que conf\u00edan<\/h3>\n            <p><\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"se-marquee\" aria-label=\"Carrusel de logos\">\n          <div class=\"se-track\" id=\"se-track\">\n            <div class=\"se-track\" id=\"se-track\">\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/312045747_543253784467643_4763978158282255203_n.webp\" alt=\"Logo cliente 01\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/allianz.webp\" alt=\"Logo cliente 02\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/disco.webp\" alt=\"Logo cliente 03\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/cencosud.webp\" alt=\"Logo cliente 04\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/bmc-seguros.webp\" alt=\"Logo cliente 05\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/easy.webp\" alt=\"Logo cliente 06\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/fresh-point.png\" alt=\"Logo cliente 07\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/giuffre-maderas.webp\" alt=\"Logo cliente 08\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/hb-services.webp\" alt=\"Logo cliente 09\"><\/div>\n\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/hiperceramico.webp\" alt=\"Logo cliente 10\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/honesty-seguros.webp\" alt=\"Logo cliente 11\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/infoxel.webp\" alt=\"Logo cliente 12\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/jumbo.webp\" alt=\"Logo cliente 13\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/krisol.webp\" alt=\"Logo cliente 14\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/Logo-ivai-blanco-1.webp\" alt=\"Logo cliente 15\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/maipu-srl.webp\" alt=\"Logo cliente 16\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/mercure-logistics.webp\" alt=\"Logo cliente 17\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/metro.webp\" alt=\"Logo cliente 18\"><\/div>\n\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/red-valor.webp\" alt=\"Logo cliente 19\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/sandra-marzzan.webp\" alt=\"Logo cliente 20\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/satus-fertilizantes.webp\" alt=\"Logo cliente 21\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/sendas-turismo.webp\" alt=\"Logo cliente 22\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/siw-cargo.webp\" alt=\"Logo cliente 23\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/tevecoa.webp\" alt=\"Logo cliente 24\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/vea-cencosud.webp\" alt=\"Logo cliente 25\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/wong.webp\" alt=\"Logo cliente 26\"><\/div>\n              <div class=\"se-logoCard\"><img loading=\"eager\" decoding=\"async\" src=\"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/xerox.webp\" alt=\"Logo cliente 27\"><\/div>\n            <\/div>\n\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- CTA FINAL -->\n      <div class=\"se-cta se-io\" id=\"casos-cta\">\n        <div class=\"se-cta__inner\">\n          <div class=\"se-cta__text\">\n            <h3>\u00bfHacemos un diagn\u00f3stico de tu empresa?<\/h3>\n            <p>Te damos una mirada clara y accionable: d\u00f3nde est\u00e1s, qu\u00e9 priorizar y cu\u00e1l es el primer paso para ordenar y crecer.<\/p>\n          <\/div>\n          <div style=\"display:flex; gap:10px; flex-wrap:wrap;\">\n            <a class=\"se-btn se-btn--solid\" href=\"\/contact\" style=\"text-decoration:none;\">Solcit\u00e1 un diagn\u00f3stico<\/a>\n            <a class=\"se-btn\" href=\"http:\/\/wa.me\/5492617138107?text=Hola%20Soporte%20Empresario%2C%20quiero%20agendar%20una%20llamada.\"\n               style=\"text-decoration:none;\">Escrib\u00ed por WhatsApp<\/a>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n\n  <script>\n    (() => {\n      const CASES = [\n        {\n          key: \"formacion\",\n          name: \"Florencia Claret\",\n          role: \"Escuelas y Academias\",\n          tags: [\"Recursos humanos\", \"Comercializaci\u00f3n\"],\n          logo: \"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/AVATAR.webp\",\n          change: \"Notamos una mejora clara en la organizaci\u00f3n y el seguimiento de los procesos de formaci\u00f3n. La plataforma permiti\u00f3 ordenar contenidos, centralizar informaci\u00f3n y facilitar el acceso, mejorando la experiencia de aprendizaje y la participaci\u00f3n.\",\n          helped: \"Lo m\u00e1s valioso fue el acompa\u00f1amiento durante todo el proceso. La flexibilidad de la plataforma y la r\u00e1pida respuesta ante consultas nos permiti\u00f3 adaptar contenidos y sostener el programa de forma fluida y eficiente.\"\n        },\n        {\n          key: \"claridad\",\n          name: \"Testimonio an\u00f3nimo\",\n          role: \"Empresa (confidencial)\",\n          tags: [\"Comercializaci\u00f3n\"],\n          logo: \"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/AVATAR.webp\",\n          change: \"Despu\u00e9s de trabajar juntos, ganamos claridad sobre d\u00f3nde est\u00e1bamos parados. M\u00e1s all\u00e1 del shock, nos mostr\u00f3 que deb\u00edamos tomar decisiones. El asesoramiento ayud\u00f3 a ordenar ideas, identificar prioridades y avanzar con un enfoque m\u00e1s estrat\u00e9gico.\",\n          helped: \"Lo que m\u00e1s sirvi\u00f3 fue el acompa\u00f1amiento y el an\u00e1lisis personalizado: no fueron recomendaciones te\u00f3ricas, sino nuestra situaci\u00f3n real, sin distractores ni soluciones m\u00e1gicas.\"\n        },\n        {\n          key: \"cencosud\",\n          name: \"Carlos Matoc\",\n          role: \"Gerente Regional de Operaciones \u2014 Cencosud Argentina\",\n          tags: [\"Recursos humanos\"],\n          logo: \"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/cencosud.webp\",\n          change: \"El trabajo fue altamente positivo. Lo m\u00e1s sobresaliente fue el impacto motivacional en los equipos: conocimiento t\u00e9cnico y herramientas en \u00e1reas blandas aumentaron la autoconfianza e impulsaron la transformaci\u00f3n.\",\n          helped: \"El diagn\u00f3stico completo, con participaci\u00f3n de todas las \u00e1reas, permiti\u00f3 construir una gu\u00eda de ruta integral. Adem\u00e1s, los manuales con m\u00e9todos y procedimientos facilitaron un marco de trabajo m\u00e1s organizado.\"\n        },\n        {\n          key: \"sandra\",\n          name: \"Sandra Marzzan\",\n          role: \"Directora \u2014 Sandra Marzzan\",\n          tags: [\"Recursos humanos\", \"Comercializaci\u00f3n\"],\n          logo: \"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/sandra-marzzan.webp\",\n          change: \"Volvimos a analizar temas que por falta de tiempo se postergaban. Revisamos cada puesto de trabajo, eliminamos tareas innecesarias y optimizamos procesos en todas las \u00e1reas.\",\n          helped: \"Fue clave para hacer el lugar y el momento de planificar el crecimiento con m\u00e1s orden y foco.\"\n        },\n        {\n          key: \"siw\",\n          name: \"Federico Badui\",\n          role: \"Due\u00f1o \u2014 SIW\",\n          tags: [\"Comercializaci\u00f3n\"],\n          logo: \"http:\/\/site.soporteempresario.com.ar\/wp-content\/uploads\/2026\/01\/siw-cargo.webp\",\n          change: \"Trabajar con SE es hacer un viaje al interior de tu empresa: tener las discusiones que ten\u00e9s que tener, bien guiadas y dirigidas.\",\n          helped: \"Pudimos construir un plan a 10 a\u00f1os que se ajust\u00f3 mucho a la realidad. Ese es el mejor ejemplo del valor del proceso.\"\n        }\n      ];\n\n      const esc = (s=\"\") => String(s).replace(\/[&<>\"']\/g, m => ({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'}[m]));\n\n      const tabs = document.getElementById(\"se-tabs\");\n      const panel = document.getElementById(\"se-panel\");\n      const panelInner = document.getElementById(\"se-panel-inner\");\n      const grid = document.getElementById(\"se-grid\");\n      const prevBtn = document.getElementById(\"se-prev\");\n      const nextBtn = document.getElementById(\"se-next\");\n\n      \/\/ ===== autoplay state =====\n      let idx = 0;\n      let paused = false;\n      let userInteracting = false;\n      let interactTimer = null;\n\n      function getDurationMs(){\n        const isMobile = window.matchMedia(\"(max-width: 980px)\").matches;\n        const root = getComputedStyle(document.documentElement);\n        const desktop = parseInt(root.getPropertyValue(\"--se-panelAnimMs\")) || 8000;\n        const mobile  = parseInt(root.getPropertyValue(\"--se-panelAnimMsMobile\")) || (desktop + 3000);\n        return isMobile ? mobile : desktop;\n      }\n\n      function renderTabs(){\n        tabs.innerHTML = CASES.map((c, i) => `\n          <button class=\"se-tab ${i===0?'is-active':''}\" type=\"button\" role=\"tab\"\n                  aria-selected=\"${i===0?'true':'false'}\" data-key=\"${esc(c.key)}\">\n            <div class=\"se-logoSlot\" aria-hidden=\"true\">\n              ${\n          c.logo\n            ? `<img src=\"${esc(c.logo)}\" alt=\"\" decoding=\"async\">`\n            : `<span style=\"color:rgba(15,36,48,.55);font-weight:900;font-size:11px;letter-spacing:.08em;text-transform:uppercase;\">Logo<\/span>`\n        }\n            <\/div>\n            <div class=\"se-tab__txt\">\n              <p class=\"se-tab__name\">${esc(c.name)}<\/p>\n              <p class=\"se-tab__role\">${esc(c.role)}<\/p>\n            <\/div>\n          <\/button>\n        `).join(\"\");\n      }\n\n      function centerActiveTab(){\n        const active = tabs.querySelector(\".se-tab.is-active\");\n        if(!active) return;\n        const tabsRect = tabs.getBoundingClientRect();\n        const actRect  = active.getBoundingClientRect();\n        const targetLeft =\n          (actRect.left - tabsRect.left) + tabs.scrollLeft - (tabsRect.width\/2 - actRect.width\/2);\n        tabs.scrollTo({ left: targetLeft, behavior: \"smooth\" });\n      }\n\n      function animateBar(durationMs){\n        const bar = document.getElementById(\"se-progress-bar\");\n        if(!bar) return;\n\n        bar.onanimationend = null;\n        bar.style.animation = \"none\";\n        bar.style.width = \"0%\";\n        void bar.offsetWidth;\n\n        bar.style.animation = `seFill ${durationMs}ms linear forwards`;\n        bar.style.animationPlayState = paused ? \"paused\" : \"running\";\n\n        bar.onanimationend = () => {\n          if(paused) return;\n          if(userInteracting) return;\n          setActiveByIndex(idx + 1, { fromAuto:true });\n        };\n      }\n\n      function renderPanel(c){\n        panelInner.innerHTML = `\n          <div class=\"se-progress\" aria-hidden=\"true\"><i id=\"se-progress-bar\"><\/i><\/div>\n\n          <div class=\"se-panel__top\">\n            <div class=\"se-panel__who\">\n              <h3>${esc(c.name)}<\/h3>\n              <p>${esc(c.role)}<\/p>\n            <\/div>\n            <div class=\"se-chiprow\">\n              ${c.tags.map(t => `<span class=\"se-chip\">${esc(t)}<\/span>`).join(\"\")}\n            <\/div>\n          <\/div>\n\n          <div class=\"se-panel__grid\">\n            <div class=\"se-box\">\n              <h4>Qu\u00e9 cambi\u00f3<\/h4>\n              <div class=\"se-quoteWrap\">\n                <p class=\"se-quoteText\">${esc(c.change)}<\/p>\n              <\/div>\n            <\/div>\n\n            <div class=\"se-box\">\n              <h4>Qu\u00e9 fue lo m\u00e1s \u00fatil<\/h4>\n              <div class=\"se-quoteWrap\">\n                <p class=\"se-quoteText\">${esc(c.helped)}<\/p>\n              <\/div>\n            <\/div>\n          <\/div>\n        `;\n\n        animateBar(getDurationMs());\n      }\n\n      function setActiveByIndex(i, opts = {}){\n        idx = (i + CASES.length) % CASES.length;\n        const c = CASES[idx];\n\n        renderPanel(c);\n\n        Array.from(tabs.querySelectorAll(\".se-tab\")).forEach(btn => {\n          const on = btn.dataset.key === c.key;\n          btn.classList.toggle(\"is-active\", on);\n          btn.setAttribute(\"aria-selected\", on ? \"true\" : \"false\");\n        });\n\n        requestAnimationFrame(centerActiveTab);\n\n        if(!opts.fromAuto){\n          userInteracting = true;\n          clearTimeout(interactTimer);\n          interactTimer = setTimeout(() => userInteracting = false, 2000);\n        }\n      }\n\n      function renderGrid(){\n        grid.innerHTML = CASES.map((c, i) => `\n          <article class=\"se-card\" data-tags=\"${esc(c.tags.join('|'))}\" style=\"--d:${i*70}ms\">\n            <div class=\"se-card__top\">\n              <div>\n                <h3 class=\"se-card__name\">${esc(c.name)}<\/h3>\n                <p class=\"se-card__role\">${esc(c.role)}<\/p>\n              <\/div>\n              <span class=\"se-chip\" style=\"background:rgba(0,169,200,.10);border-color:rgba(0,169,200,.22);color:rgba(0,110,130,.95);\">Testimonio<\/span>\n            <\/div>\n\n            <div class=\"se-card__quote\">\n              <p>${esc(c.change)}<\/p>\n            <\/div>\n\n            <div class=\"se-card__chips\">\n              ${c.tags.map(t => `<span class=\"se-chip\" style=\"background:rgba(0,169,200,.10);border-color:rgba(0,169,200,.22);color:rgba(0,110,130,.95);\">${esc(t)}<\/span>`).join(\"\")}\n            <\/div>\n          <\/article>\n        `).join(\"\");\n      }\n\n      \/\/ filtros con entrada\/salida\n      const filterBtns = Array.from(document.querySelectorAll(\".se-filter\"));\n      function showCard(card, delayMs){\n        card.classList.remove(\"is-hidden\", \"is-leaving\");\n        card.style.setProperty(\"--d\", `${delayMs}ms`);\n        card.classList.remove(\"is-entering\");\n        void card.offsetWidth;\n        card.classList.add(\"is-entering\");\n        window.setTimeout(() => card.classList.remove(\"is-entering\"), 650 + delayMs);\n      }\n      function hideCard(card){\n        if(card.classList.contains(\"is-hidden\")) return;\n        card.classList.remove(\"is-entering\");\n        card.classList.add(\"is-leaving\");\n        window.setTimeout(() => {\n          card.classList.add(\"is-hidden\");\n          card.classList.remove(\"is-leaving\");\n        }, 280);\n      }\n      function applyFilter(tag){\n        filterBtns.forEach(b => b.classList.toggle(\"is-on\", b.dataset.filter === tag));\n        const cards = Array.from(document.querySelectorAll(\".se-card\"));\n        const visible = [];\n        cards.forEach(card => {\n          const tags = (card.dataset.tags || \"\").split(\"|\").map(s => s.trim()).filter(Boolean);\n          const match = (tag === \"all\") || tags.includes(tag);\n          if(match) visible.push(card);\n          else hideCard(card);\n        });\n        visible.forEach((card, i) => showCard(card, i*70));\n      }\n\n      \/\/ IO reversible\n      const io = new IntersectionObserver((entries) => {\n        entries.forEach(e => {\n          if(e.isIntersecting) e.target.classList.add(\"is-visible\");\n          else e.target.classList.remove(\"is-visible\");\n        });\n      }, { threshold: 0.14 });\n      document.querySelectorAll(\".se-io\").forEach(el => io.observe(el));\n\n      \/\/ smooth scroll\n      document.querySelectorAll(\"[data-scroll]\").forEach(btn => {\n        btn.addEventListener(\"click\", () => {\n          const target = document.querySelector(btn.getAttribute(\"data-scroll\"));\n          if(target) target.scrollIntoView({behavior:\"smooth\", block:\"start\"});\n        });\n      });\n\n      \/\/ marquee loop\n      function setupMarquee(){\n        const track = document.getElementById(\"se-track\");\n        if(!track) return;\n\n        \/\/ Duplicamos elementos para loop infinito\n        const items = Array.from(track.children);\n\n        const frag = document.createDocumentFragment();\n        items.forEach((item) => {\n          const clone = item.cloneNode(true);\n\n          \/\/ Accesibilidad: las copias no deben leerse\n          clone.setAttribute(\"aria-hidden\", \"true\");\n          const img = clone.querySelector(\"img\");\n          if(img) img.setAttribute(\"alt\", \"\"); \/\/ evita repetir \"Logo cliente X\" dos veces\n\n          frag.appendChild(clone);\n        });\n\n        track.appendChild(frag);\n      }\n\n      \/\/ pausa barra + autoplay (hover \/ tap)\n      function pauseBar(){\n        const bar = document.getElementById(\"se-progress-bar\");\n        if(bar) bar.style.animationPlayState = \"paused\";\n      }\n      function resumeBar(){\n        const bar = document.getElementById(\"se-progress-bar\");\n        if(bar) bar.style.animationPlayState = \"running\";\n      }\n      panel.addEventListener(\"mouseenter\", () => { paused = true; pauseBar(); });\n      panel.addEventListener(\"mouseleave\", () => { paused = false; resumeBar(); });\n      panel.addEventListener(\"click\", () => {\n        paused = !paused;\n        paused ? pauseBar() : resumeBar();\n      });\n\n      \/\/ click tab\n      tabs.addEventListener(\"click\", (e) => {\n        const btn = e.target.closest(\".se-tab\");\n        if(!btn) return;\n        const i = CASES.findIndex(x => x.key === btn.dataset.key);\n        if(i >= 0) setActiveByIndex(i);\n      });\n\n      \/\/ si el usuario scrollea\/arrastra el tablist\n      const markInteract = () => {\n        userInteracting = true;\n        clearTimeout(interactTimer);\n        interactTimer = setTimeout(() => userInteracting = false, 2000);\n      };\n      tabs.addEventListener(\"scroll\", markInteract, { passive:true });\n      tabs.addEventListener(\"pointerdown\", markInteract, { passive:true });\n\n      \/\/ flechas\n      prevBtn.addEventListener(\"click\", () => setActiveByIndex(idx - 1));\n      nextBtn.addEventListener(\"click\", () => setActiveByIndex(idx + 1));\n\n      \/\/ flip tap\n      document.querySelectorAll(\"[data-flip]\").forEach(card => {\n        card.addEventListener(\"click\", () => card.classList.toggle(\"is-flipped\"));\n      });\n\n      \/\/ init\n      renderTabs();\n      renderGrid();\n      setupMarquee();\n\n      requestAnimationFrame(() => {\n        const cards = Array.from(document.querySelectorAll(\".se-card\"));\n        cards.forEach((c,i) => showCard(c, i*70));\n      });\n\n      filterBtns.forEach(btn => btn.addEventListener(\"click\", () => applyFilter(btn.dataset.filter)));\n\n      \/\/ start autoplay cycle via barra\n      setActiveByIndex(0, { fromAuto:true });\n\n      \/\/ al cambiar tama\u00f1o, reiniciamos barra con nueva duraci\u00f3n sin cambiar caso\n      window.addEventListener(\"resize\", () => {\n        renderPanel(CASES[idx]);\n      });\n    })();\n  <\/script>\n<\/section>\n<!-- ===================== \/CASOS DE \u00c9XITO -->\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Casos de \u00e9xito Estos son algunos de los proyectos en los que nos integramos a la vida empresaria de nuestros clientes y los ayudamos a transformar problemas cotidianos en resultados medibles. Casos de \u00e9xito Lo que dicen de nosotros Testimonios reales de empresas que trabajaron con Soporte Empresario: m\u00e1s orden, m\u00e1s claridad y una base [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"no-sidebar","site-content-layout":"plain-container","ast-site-content-layout":"normal-width-container","site-content-style":"unboxed","site-sidebar-style":"unboxed","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"enabled","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-19","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"gamesfran570@gmail.com","author_link":"https:\/\/site.soporteempresario.com.ar\/en\/author\/gamesfran570gmail-com\/"},"uagb_comment_info":0,"uagb_excerpt":"Casos de \u00e9xito Estos son algunos de los proyectos en los que nos integramos a la vida empresaria de nuestros clientes y los ayudamos a transformar problemas cotidianos en resultados medibles. Casos de \u00e9xito Lo que dicen de nosotros Testimonios reales de empresas que trabajaron con Soporte Empresario: m\u00e1s orden, m\u00e1s claridad y una base&hellip;","_links":{"self":[{"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/pages\/19","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/comments?post=19"}],"version-history":[{"count":47,"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/pages\/19\/revisions"}],"predecessor-version":[{"id":3121,"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/pages\/19\/revisions\/3121"}],"wp:attachment":[{"href":"https:\/\/site.soporteempresario.com.ar\/en\/wp-json\/wp\/v2\/media?parent=19"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}