{"id":5323,"date":"2026-05-16T16:31:08","date_gmt":"2026-05-16T16:31:08","guid":{"rendered":"https:\/\/ramoadigital.com\/?page_id=5323"},"modified":"2026-05-22T17:38:05","modified_gmt":"2026-05-22T17:38:05","slug":"code-beratung","status":"publish","type":"page","link":"https:\/\/ramoadigital.com\/de\/servicos\/code-consulting\/","title":{"rendered":"Code &amp; Consulting"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5323\" class=\"elementor elementor-5323\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-388f297 e-con-full e-flex e-con e-parent\" data-id=\"388f297\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bb9d54a elementor-widget elementor-widget-html\" data-id=\"bb9d54a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ramoa-page-hero\" aria-labelledby=\"ramoaPageHeroTitle\">\n  <div class=\"ramoa-page-hero__glow\" aria-hidden=\"true\"><\/div>\n  <div class=\"ramoa-page-hero__grid\" aria-hidden=\"true\"><\/div>\n  <div class=\"ramoa-page-hero__rings\" aria-hidden=\"true\"><\/div>\n  <div class=\"ramoa-page-hero__inner\">\n    <nav class=\"ramoa-page-hero__breadcrumb\" aria-label=\"Breadcrumb\">\n      <a href=\"\/\">Home<\/a>\n            <span aria-hidden=\"true\">\/<\/span>\n      <a href=\"\/servicos\/\">Servi\u00e7os<\/a>\n      <span aria-hidden=\"true\">\/<\/span>\n      <span>Code & Consulting<\/span>\n    <\/nav>\n    <span class=\"ramoa-page-hero__chip\">Code & Consulting<\/span>\n     <h1 class=\"ramoa-page-hero__title\" id=\"ramoaPageHeroTitle\">\n  Sistemas & automa\u00e7\u00f5es <br> que transformam opera\u00e7\u00e3o em escala.\n    <\/h1>\n    <p class=\"ramoa-page-hero__lead\">\n  Desenvolvimento de software sob medida, automa\u00e7\u00f5es, integra\u00e7\u00f5es e consultoria t\u00e9cnica <br>para transformar processos manuais em <span>opera\u00e7\u00f5es mais inteligentes e produtivas.<\/span>    <\/p>\n  <\/div>\n<\/section>\n\n<style>\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     RAMOA \u2014 INTERNAL PAGE HERO \/ BREADCRUMB\n     Background inspirado na ramoa-discovery-section\n     com rede quadriculada e predomin\u00e2ncia azul dark\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  .ramoa-page-hero,\n  .ramoa-page-hero * {\n    box-sizing: border-box;\n  }\n\n  .ramoa-page-hero {\n    --ramoa-bg-1: #070210;\n    --ramoa-bg-2: #071022;\n    --ramoa-bg-3: #0b0218;\n    --ramoa-pink: #ff2fda;\n    --ramoa-purple: #a855f7;\n    --ramoa-blue: #2dd4ff;\n    --ramoa-deep-blue: #011129;\n\n    position: relative;\n    width: 100%;\n    min-height: clamp(320px, 42vh, 480px);\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding:\n      clamp(128px, 16vh, 168px)\n      clamp(18px, 5vw, 72px)\n      clamp(72px, 10vh, 110px);\n\n    overflow: hidden;\n    isolation: isolate;\n\n    color: #ffffff;\n\n    background:\n      radial-gradient(\n        120% 80% at 82% 8%,\n        rgba(45, 212, 255, 0.13) 0%,\n        rgba(18, 28, 77, 0.22) 30%,\n        rgba(11, 2, 24, 0) 62%\n      ),\n      radial-gradient(\n        90% 68% at 8% 88%,\n        rgba(45, 212, 255, 0.085) 0%,\n        rgba(1, 17, 41, 0.24) 34%,\n        rgba(11, 2, 24, 0) 64%\n      ),\n      radial-gradient(\n        80% 60% at 50% 48%,\n        rgba(89, 75, 231, 0.080) 0%,\n        rgba(1, 17, 41, 0.18) 36%,\n        rgba(11, 2, 24, 0) 68%\n      ),\n      radial-gradient(\n        70% 56% at 16% 18%,\n        rgba(255, 47, 218, 0.045) 0%,\n        rgba(255, 47, 218, 0.016) 34%,\n        rgba(11, 2, 24, 0) 68%\n      ),\n      linear-gradient(\n        180deg,\n        #070210 0%,\n        #071022 38%,\n        #050914 72%,\n        #0b0218 100%\n      );\n  }\n\n  .ramoa-page-hero::after {\n    content: \"\";\n    position: absolute;\n    inset: auto 0 0 0;\n\n    height: 1px;\n\n    background:\n      linear-gradient(\n        90deg,\n        transparent,\n        rgba(45, 212, 255, 0.22),\n        rgba(89, 75, 231, 0.24),\n        rgba(255, 47, 218, 0.16),\n        transparent\n      );\n\n    box-shadow:\n      0 -1px 20px rgba(45, 212, 255, 0.12),\n      0 -1px 34px rgba(89, 75, 231, 0.10);\n\n    pointer-events: none;\n    z-index: 3;\n  }\n\n  .ramoa-page-hero__glow {\n    position: absolute;\n    inset: 0;\n\n    background:\n      radial-gradient(\n        ellipse at 50% 42%,\n        rgba(45, 212, 255, 0.070),\n        rgba(89, 75, 231, 0.060) 34%,\n        rgba(11, 2, 24, 0) 66%\n      ),\n      radial-gradient(\n        ellipse at 50% 92%,\n        rgba(1, 17, 41, 0.60),\n        rgba(1, 17, 41, 0.22) 34%,\n        rgba(11, 2, 24, 0) 68%\n      ),\n      linear-gradient(\n        180deg,\n        rgba(7, 2, 16, 0.10) 0%,\n        rgba(7, 16, 34, 0.10) 44%,\n        rgba(11, 2, 24, 0.46) 100%\n      );\n\n    pointer-events: none;\n    z-index: 0;\n  }\n\n  .ramoa-page-hero__grid {\n    position: absolute;\n    inset: 0;\n\n    background-image:\n      linear-gradient(\n        transparent 95%,\n        rgba(45, 212, 255, 0.105) 95%\n      ),\n      linear-gradient(\n        90deg,\n        transparent 95%,\n        rgba(45, 212, 255, 0.105) 95%\n      ),\n      linear-gradient(\n        transparent 95%,\n        rgba(168, 85, 247, 0.055) 95%\n      ),\n      linear-gradient(\n        90deg,\n        transparent 95%,\n        rgba(168, 85, 247, 0.055) 95%\n      );\n\n    background-size:\n      48px 48px,\n      48px 48px,\n      96px 96px,\n      96px 96px;\n\n    background-position: center center;\n\n    mask-image:\n      radial-gradient(\n        ellipse at center,\n        #000 18%,\n        rgba(0, 0, 0, 0.82) 42%,\n        rgba(0, 0, 0, 0.44) 68%,\n        transparent 92%\n      );\n    -webkit-mask-image:\n      radial-gradient(\n        ellipse at center,\n        #000 18%,\n        rgba(0, 0, 0, 0.82) 42%,\n        rgba(0, 0, 0, 0.44) 68%,\n        transparent 92%\n      );\n\n    opacity: 0.46;\n    pointer-events: none;\n    z-index: 0;\n  }\n\n  \/* Removido visualmente para evitar c\u00edrculos\/rings no background *\/\n  .ramoa-page-hero__rings {\n    display: none !important;\n  }\n\n  .ramoa-page-hero__inner {\n    position: relative;\n    z-index: 2;\n\n    width: min(1120px, 100%);\n\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n\n  \/* Breadcrumb *\/\n  .ramoa-page-hero__breadcrumb {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 9px;\n\n    margin-bottom: 18px;\n\n    color: rgba(255, 255, 255, 0.58);\n\n    font-family: \"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n    font-size: 12px;\n    line-height: 1;\n    font-weight: 700;\n    letter-spacing: 0.08em;\n    text-transform: uppercase;\n  }\n\n  .ramoa-page-hero__breadcrumb a {\n    color: rgba(255, 255, 255, 0.66);\n    text-decoration: none;\n\n    transition: color 0.22s ease;\n  }\n\n  .ramoa-page-hero__breadcrumb a:hover {\n    color: #2dd4ff;\n  }\n\n  .ramoa-page-hero__breadcrumb span:last-child {\n    color: rgba(241, 131, 199, 0.92);\n  }\n\n  \/* Chip *\/\n  .ramoa-page-hero__chip {\n    display: inline-flex;\n    width: fit-content;\n    align-items: center;\n    justify-content: center;\n\n    margin-bottom: 18px;\n    padding: 8px 15px;\n\n    border-radius: 999px;\n    border: 1px solid rgba(255, 47, 218, 0.62);\n\n    color: rgba(255, 255, 255, 0.94);\n\n    background:\n      linear-gradient(\n        135deg,\n        rgba(45, 212, 255, 0.12),\n        rgba(89, 75, 231, 0.30) 46%,\n        rgba(255, 47, 218, 0.16)\n      );\n\n    box-shadow:\n      0 0 18px rgba(45, 212, 255, 0.12),\n      0 0 22px rgba(255, 47, 218, 0.22),\n      0 0 34px rgba(89, 75, 231, 0.18),\n      inset 0 0 14px rgba(255, 255, 255, 0.055);\n\n    font-family: \"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n    font-size: 10px;\n    line-height: 1;\n    font-weight: 900;\n    letter-spacing: 0.16em;\n    text-transform: uppercase;\n  }\n\n  \/* T\u00edtulo *\/\n  .ramoa-page-hero__title {\n    margin: 0;\n\n    color: #ffffff;\n\n    font-family: \"Outfit\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n    font-size: 48px;\n    line-height: 1.2em;\n    font-weight: 600;\n    letter-spacing: -0.045em;\n\n    text-shadow:\n      0 0 14px rgba(45, 212, 255, 0.16),\n      0 0 24px rgba(89, 75, 231, 0.20),\n      0 2px 16px rgba(5, 0, 11, 0.74);\n  }\n\n  .ramoa-page-hero__title::after {\n    content: \"\";\n    display: block;\n\n    width: 72px;\n    height: 2px;\n\n    margin: 24px auto 0;\n\n    background: linear-gradient(\n      90deg,\n      transparent,\n      #ff2fda,\n      #a855f7,\n      #2dd4ff,\n      transparent\n    );\n\n    box-shadow:\n      0 0 14px rgba(45, 212, 255, 0.30),\n      0 0 16px rgba(255, 47, 218, 0.32),\n      0 0 24px rgba(89, 75, 231, 0.20);\n  }\n\n  \/* Descri\u00e7\u00e3o *\/\n  .ramoa-page-hero__lead {\n    position: relative;\n    max-width: 780px;\n\n    margin: 26px auto 0;\n    padding: 14px 24px;\n\n    color: rgba(255, 255, 255, 0.76);\n\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n    font-size: clamp(14px, 1.08vw, 17px);\n    line-height: 1.68;\n    font-weight: 450;\n    letter-spacing: 0.006em;\n\n    text-align: center;\n\n    background:\n      linear-gradient(\n        180deg,\n        rgba(255, 255, 255, 0.042) 0%,\n        rgba(255, 255, 255, 0.018) 100%\n      );\n\n    border: 1px solid rgba(45, 212, 255, 0.105);\n    border-radius: 18px;\n\n    box-shadow:\n      0 14px 38px rgba(1, 17, 41, 0.30),\n      0 0 22px rgba(45, 212, 255, 0.060),\n      0 0 22px rgba(255, 47, 218, 0.040),\n      inset 0 0 0 1px rgba(255, 255, 255, 0.026);\n\n    backdrop-filter: blur(8px);\n    -webkit-backdrop-filter: blur(8px);\n\n    text-shadow:\n      0 1px 18px rgba(1, 17, 41, 0.56);\n  }\n\n  .ramoa-page-hero__lead::before {\n    content: \"\";\n    position: absolute;\n\n    left: 50%;\n    top: -1px;\n\n    width: 48%;\n    height: 1px;\n\n    transform: translateX(-50%);\n\n    background:\n      linear-gradient(\n        90deg,\n        transparent,\n        rgba(255, 47, 218, 0.62),\n        rgba(168, 85, 247, 0.58),\n        rgba(45, 212, 255, 0.58),\n        transparent\n      );\n\n    box-shadow:\n      0 0 12px rgba(45, 212, 255, 0.26),\n      0 0 12px rgba(255, 47, 218, 0.22),\n      0 0 18px rgba(89, 75, 231, 0.16);\n\n    pointer-events: none;\n  }\n\n  .ramoa-page-hero__lead span {\n    color: transparent;\n\n    background:\n      linear-gradient(\n        90deg,\n        #ff2fda,\n        #a855f7 58%,\n        #2dd4ff\n      );\n\n    -webkit-background-clip: text;\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n\n    font-weight: 800;\n    white-space: nowrap;\n  }\n\n  \/* Mobile *\/\n  @media (max-width: 767px) {\n    .ramoa-page-hero {\n      min-height: clamp(300px, 46vh, 420px);\n\n      padding:\n        112px\n        18px\n        68px;\n    }\n\n    .ramoa-page-hero__grid {\n      opacity: 0.36;\n\n      background-size:\n        42px 42px,\n        42px 42px,\n        84px 84px,\n        84px 84px;\n    }\n\n    .ramoa-page-hero__breadcrumb {\n      flex-wrap: wrap;\n      margin-bottom: 14px;\n      font-size: 10px;\n      letter-spacing: 0.07em;\n    }\n\n    .ramoa-page-hero__chip {\n      margin-bottom: 16px;\n      padding: 7px 13px;\n      font-size: 10px;\n      letter-spacing: 0.13em;\n    }\n\n    .ramoa-page-hero__title {\n      font-size: clamp(38px, 12vw, 48px);\n      line-height: 1.14em;\n      font-weight: 400 !important;\n      letter-spacing: -0.04em;\n    }\n\n    .ramoa-page-hero__title::after {\n      width: 58px;\n      margin-top: 20px;\n    }\n\n    .ramoa-page-hero__lead {\n      max-width: 94%;\n      margin-top: 22px;\n      padding: 14px 18px;\n\n      font-size: 14px;\n      line-height: 1.62;\n\n      border-radius: 16px;\n    }\n\n    .ramoa-page-hero__lead::before {\n      width: 68%;\n    }\n\n    .ramoa-page-hero__rings {\n      display: none !important;\n    }\n  }\n\n  \/* Reduced Motion *\/\n  @media (prefers-reduced-motion: reduce) {\n    .ramoa-page-hero__breadcrumb a {\n      transition: none;\n    }\n  }\n<\/style>\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5186b25 e-con-full e-flex e-con e-child\" data-id=\"5186b25\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-5e22b8a e-con-full e-flex e-con e-child\" data-id=\"5e22b8a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-afbde64 elementor-widget elementor-widget-html\" data-id=\"afbde64\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  RAMOA \u2014 LETREIRO 1 (apenas HTML)\n  \n  Pr\u00e9-requisito: o CSS+JS global da marquee precisa estar carregado\n  na p\u00e1gina (ramoa-marquee-global.html).\n  \n  Para variar a lista de termos, basta editar os <span> abaixo \u2014\n  n\u00e3o precisa mexer em CSS ou JS.\n-->\n<div class=\"ramoa-marquee\" aria-label=\"Servi\u00e7os RAMOA\">\n  <div class=\"ramoa-marquee-track\">\n    <span>DESENVOLVIMENTO WEB<\/span>\n    <span>IDENTIDADE VISUAL<\/span>\n    <span>SOFTWARE SOB MEDIDA<\/span>\n    <span>LOJA VIRTUAL<\/span>\n    <span>TR\u00c1FEGO PAGO<\/span>\n    <span>WORDPRESS<\/span>\n    <span>REDES SOCIAIS<\/span>\n    <span>LANDING PAGES<\/span>\n    <span>SEO<\/span>\n    <span>INFRAESTRUTURA DIGITAL<\/span>\n    <span>CRM &amp; ERP<\/span>\n    <span>GOOGLE ADS<\/span>\n  <\/div>\n<\/div>\n\n<!--\n  RAMOA \u2014 MARQUEE \/ SERVICES STRIP \u2014 CSS GLOBAL (v2)\n  \n  COLE ESTE BLOCO UMA \u00daNICA VEZ na p\u00e1gina (em \"Custom CSS\" do tema,\n  Elementor \u2192 Site Settings \u2192 Custom CSS, ou no header HTML widget).\n  \n  Ele serve TODOS os letreiros da p\u00e1gina (.ramoa-marquee), bastando\n  cada letreiro ter sua pr\u00f3pria <div class=\"ramoa-marquee\">\u2026<\/div>\n  com a lista de termos espec\u00edfica.\n  \n  Por que separar:\n  - DRY: lista de estilos definida uma vez, manuten\u00e7\u00e3o centralizada\n  - Performance: o CSS \u00e9 cacheado pelo browser (se inserido via tema)\n  - Visual consistente entre todos os letreiros da p\u00e1gina\n-->\n\n<style>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   RAMOA \u2014 MARQUEE \/ SERVICES STRIP (estilos globais)\n   Dark blue tech + neon cyan\/purple\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n.ramoa-marquee {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n\n  background:\n    radial-gradient(\n      circle at 18% 50%,\n      rgba(45, 212, 255, 0.10) 0%,\n      rgba(45, 212, 255, 0.035) 26%,\n      transparent 58%\n    ),\n    radial-gradient(\n      circle at 82% 50%,\n      rgba(89, 75, 231, 0.12) 0%,\n      rgba(89, 75, 231, 0.040) 30%,\n      transparent 62%\n    ),\n    linear-gradient(\n      90deg,\n      rgba(1, 17, 41, 0.94) 0%,\n      rgba(12, 28, 68, 0.88) 34%,\n      rgba(18, 28, 77, 0.82) 50%,\n      rgba(12, 28, 68, 0.88) 66%,\n      rgba(1, 17, 41, 0.94) 100%\n    );\n\n  padding: 14px 0;\n\n  border-top: 1px solid rgba(45, 212, 255, 0.26);\n  border-bottom: 1px solid rgba(89, 75, 231, 0.28);\n\n  box-shadow:\n    0 0 18px rgba(45, 212, 255, 0.10),\n    0 0 30px rgba(89, 75, 231, 0.08),\n    inset 0 1px 0 rgba(255, 255, 255, 0.045),\n    inset 0 -1px 0 rgba(255, 255, 255, 0.030);\n\n  contain: layout paint style;\n}\n\n\/* brilho horizontal sutil *\/\n.ramoa-marquee::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n\n  background:\n    linear-gradient(\n      90deg,\n      transparent 0%,\n      rgba(45, 212, 255, 0.075) 28%,\n      rgba(255, 255, 255, 0.040) 50%,\n      rgba(89, 75, 231, 0.085) 72%,\n      transparent 100%\n    );\n\n  opacity: 0.70;\n  pointer-events: none;\n}\n\n\/* fade nas laterais *\/\n.ramoa-marquee::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n\n  background:\n    linear-gradient(\n      90deg,\n      rgba(1, 17, 41, 0.98) 0%,\n      rgba(1, 17, 41, 0.72) 6%,\n      transparent 16%,\n      transparent 84%,\n      rgba(1, 17, 41, 0.72) 94%,\n      rgba(1, 17, 41, 0.98) 100%\n    );\n\n  pointer-events: none;\n  z-index: 2;\n}\n\n.ramoa-marquee-track {\n  position: relative;\n  z-index: 1;\n\n  display: flex;\n  align-items: center;\n  width: max-content;\n\n  animation: ramoaMarqueeMove 26s linear infinite;\n  will-change: transform;\n  animation-play-state: paused;\n}\n\n\/* Track s\u00f3 anima quando a marquee est\u00e1 vis\u00edvel na viewport *\/\n.ramoa-marquee.is-visible .ramoa-marquee-track {\n  animation-play-state: running;\n}\n\n.ramoa-marquee-track span {\n  position: relative;\n\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n\n  margin-right: 46px;\n\n  color: rgba(235, 246, 255, 0.88);\n\n  font-family: \"Inter\", sans-serif;\n  font-size: 14px;\n  font-weight: 750;\n  text-transform: uppercase;\n  letter-spacing: 0.13em;\n  white-space: nowrap;\n\n  text-shadow:\n    0 0 10px rgba(45, 212, 255, 0.24),\n    0 0 18px rgba(89, 75, 231, 0.16);\n}\n\n.ramoa-marquee-track span::after {\n  content: \"\u2022\";\n\n  margin-left: 46px;\n\n  color: #2dd4ff;\n\n  text-shadow:\n    0 0 8px rgba(45, 212, 255, 0.85),\n    0 0 16px rgba(89, 75, 231, 0.38),\n    0 0 22px rgba(241, 131, 199, 0.18);\n\n  opacity: 0.92;\n}\n\n\/* Pequeno destaque alternado para dar vida sem ficar rosa demais *\/\n.ramoa-marquee-track span:nth-child(3n) {\n  color: rgba(219, 225, 255, 0.90);\n\n  text-shadow:\n    0 0 10px rgba(89, 75, 231, 0.32),\n    0 0 18px rgba(45, 212, 255, 0.14);\n}\n\n.ramoa-marquee-track span:nth-child(4n)::after {\n  color: #8b7cff;\n\n  text-shadow:\n    0 0 8px rgba(89, 75, 231, 0.80),\n    0 0 14px rgba(45, 212, 255, 0.28);\n}\n\n@keyframes ramoaMarqueeMove {\n  from { transform: translate3d(0, 0, 0); }\n  to   { transform: translate3d(-50%, 0, 0); }\n}\n\n\/* Pausa no hover *\/\n.ramoa-marquee:hover .ramoa-marquee-track {\n  animation-play-state: paused;\n}\n\n\/* Mobile *\/\n@media (max-width: 767px) {\n  .ramoa-marquee {\n    padding: 12px 0;\n  }\n\n  .ramoa-marquee-track {\n    animation-duration: 22s;\n  }\n\n  .ramoa-marquee-track span {\n    font-size: 12px;\n    letter-spacing: 0.11em;\n    margin-right: 34px;\n  }\n\n  .ramoa-marquee-track span::after {\n    margin-left: 34px;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .ramoa-marquee-track {\n    animation: none !important;\n  }\n}\n<\/style>\n\n<!--\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  JS GLOBAL \u2014 tamb\u00e9m cole UMA \u00daNICA VEZ na p\u00e1gina.\n  Ele inicializa TODOS os .ramoa-marquee da p\u00e1gina automaticamente.\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n-->\n<script>\n(function(){\n  \/\/ Espera o DOM estar pronto antes de procurar pelos letreiros.\n  \/\/ Importante: este <script> pode estar inserido ANTES dos\n  \/\/ .ramoa-marquee na p\u00e1gina (ex: cole o CSS+JS no header e os\n  \/\/ letreiros nas sections do meio). Sem este wait, o querySelectorAll\n  \/\/ retornaria 0 elementos e nenhum letreiro seria inicializado.\n  if (document.readyState === 'loading') {\n    document.addEventListener('DOMContentLoaded', init);\n  } else {\n    init();\n  }\n\n  function init(){\n    var marquees = document.querySelectorAll('.ramoa-marquee');\n    if (!marquees.length) return;\n\n  \/\/ Fallback p\/ browsers sem IntersectionObserver: anima sempre.\n  var hasIO = ('IntersectionObserver' in window);\n  var io = null;\n\n  if (hasIO) {\n    io = new IntersectionObserver(function(entries){\n      entries.forEach(function(entry){\n        if (entry.isIntersecting) {\n          entry.target.classList.add('is-visible');\n        } else {\n          entry.target.classList.remove('is-visible');\n        }\n      });\n    }, { rootMargin: '120px 0px', threshold: 0 });\n  }\n\n  marquees.forEach(function(marquee){\n    var track = marquee.querySelector('.ramoa-marquee-track');\n    if (!track) return;\n\n    \/\/ ===== 1) Duplica\u00e7\u00e3o autom\u00e1tica da lista para o loop visual =====\n    \/\/ S\u00f3 duplica se ainda n\u00e3o foi duplicado (evita rodar 2x se o script\n    \/\/ for chamado mais de uma vez por algum motivo).\n    if (!marquee.dataset.ramoaCloned) {\n      var originals = Array.prototype.slice.call(track.children);\n      originals.forEach(function(node){\n        var clone = node.cloneNode(true);\n        clone.setAttribute('aria-hidden', 'true');\n        track.appendChild(clone);\n      });\n      marquee.dataset.ramoaCloned = '1';\n    }\n\n    \/\/ ===== 2) Pause-offscreen via IntersectionObserver =====\n    if (hasIO) {\n      io.observe(marquee);\n    } else {\n      marquee.classList.add('is-visible');\n    }\n  });\n\n  \/\/ ===== 3) Pause em aba inativa (Page Visibility API) =====\n  \/\/ Aplica a TODOS os tracks da p\u00e1gina de uma vez.\n  document.addEventListener('visibilitychange', function(){\n    var tracks = document.querySelectorAll('.ramoa-marquee-track');\n    tracks.forEach(function(track){\n      if (document.hidden) {\n        track.style.animationPlayState = 'paused';\n      } else {\n        track.style.animationPlayState = '';\n      }\n    });\n  });\n  } \/\/ end of init()\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-201e71f e-con-full e-flex e-con e-parent\" data-id=\"201e71f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e03b33 elementor-widget elementor-widget-html\" data-id=\"9e03b33\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  .rcc {\n    --ramoa-bg-deep:   #070210;\n    --ramoa-bg-blue:   #071022;\n    --ramoa-bg-dark:   #050914;\n    --ramoa-bg-purple: #0b0218;\n    --ramoa-cyan:      #2dd4ff;\n    --ramoa-blue:      #594be7;\n    --ramoa-pink:      #ff2fda;\n    --ramoa-purple:    #a855f7;\n    --ramoa-text:      rgba(255,255,255,0.92);\n    --ramoa-text-soft: rgba(255,255,255,0.72);\n    --ramoa-text-faint:rgba(255,255,255,0.55);\n    --ramoa-font: \"Outfit\",\"Inter\",-apple-system,system-ui,sans-serif;\n    font-family: var(--ramoa-font);\n    color: var(--ramoa-text);\n    line-height: 1.5;\n  }\n  .rcc *, .rcc *::before, .rcc *::after { box-sizing: border-box; }\n\n  \/* Sections *\/\n  .rcc-section {\n    position: relative;\n    padding: clamp(72px, 10vh, 120px) clamp(18px, 5vw, 72px);\n    overflow: hidden;\n  }\n  .rcc-section--a {\n    background: linear-gradient(180deg, #070210 0%, #071022 50%, #050914 100%);\n  }\n  .rcc-section--b {\n    isolation: isolate;\n    background:\n      radial-gradient(80% 60% at 50% 0%, rgba(45,212,255,0.10), transparent 65%),\n      radial-gradient(60% 50% at 100% 100%, rgba(89,75,231,0.08), transparent 65%),\n      radial-gradient(50% 40% at 0% 100%, rgba(255,47,218,0.05), transparent 65%),\n      linear-gradient(180deg, #070210 0%, #071022 50%, #050914 100%);\n  }\n  .rcc-section--grade::before {\n    content: \"\";\n    position: absolute; inset: 0;\n    background-image:\n      linear-gradient(transparent 95%, rgba(45,212,255,0.10) 95%),\n      linear-gradient(90deg, transparent 95%, rgba(45,212,255,0.10) 95%);\n    background-size: 48px 48px;\n    -webkit-mask-image: radial-gradient(ellipse at center, #000 18%, rgba(0,0,0,0.6) 50%, transparent 90%);\n            mask-image: radial-gradient(ellipse at center, #000 18%, rgba(0,0,0,0.6) 50%, transparent 90%);\n    opacity: 0.30;\n    pointer-events: none;\n    z-index: 0;\n  }\n  .rcc-wrap { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; }\n\n  \/* Eyebrow \/ Headings *\/\n  .rcc-eyebrow {\n    display: inline-flex; align-items: center; gap: 8px;\n    font-size: 11px; font-weight: 900; letter-spacing: 0.18em;\n    text-transform: uppercase; color: var(--ramoa-cyan);\n    padding: 6px 12px; border-radius: 999px;\n    background: rgba(45,212,255,0.06);\n    border: 1px solid rgba(45,212,255,0.25);\n    margin-bottom: 18px;\n  }\n  .rcc-eyebrow::before {\n    content: \"\"; width: 6px; height: 6px; border-radius: 50%;\n    background: var(--ramoa-cyan);\n    box-shadow: 0 0 8px var(--ramoa-cyan);\n    animation: rcc-pulse 1.6s ease-in-out infinite;\n  }\n  @keyframes rcc-pulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:0.4;transform:scale(0.75);} }\n\n  .rcc-h2 {\n    font-size: clamp(28px, 3.4vw, 44px);\n    font-weight: 600; letter-spacing: -0.02em;\n    line-height: 1.15; margin: 0 0 18px;\n    color: var(--ramoa-text);\n  }\n  .rcc-grad {\n    background: linear-gradient(90deg, var(--ramoa-cyan), var(--ramoa-purple));\n    -webkit-background-clip: text; background-clip: text;\n    color: transparent;\n  }\n  .rcc-lead {\n    font-size: 15.5px; line-height: 1.65;\n    color: var(--ramoa-text-soft);\n    max-width: 760px; margin: 0 0 40px;\n  }\n\n  \/* Cards base *\/\n  .rcc-card {\n    position: relative;\n    background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.01));\n    border: 1px solid rgba(255,255,255,0.08);\n    border-radius: 20px;\n    padding: 28px;\n    transition: border-color .25s ease, transform .25s ease;\n  }\n  .rcc-card:hover {\n    border-color: rgba(45,212,255,0.35);\n    transform: translateY(-2px);\n  }\n  .rcc-card h3 {\n    font-size: 20px; font-weight: 700; margin: 14px 0 10px;\n    color: var(--ramoa-text);\n  }\n  .rcc-card p {\n    font-size: 15.5px; line-height: 1.65;\n    color: var(--ramoa-text-soft); margin: 0;\n  }\n  .rcc-ico {\n    width: 44px; height: 44px; border-radius: 12px;\n    display: inline-flex; align-items: center; justify-content: center;\n    background: rgba(45,212,255,0.08);\n    border: 1px solid rgba(45,212,255,0.25);\n    color: var(--ramoa-cyan);\n    box-shadow: 0 0 20px rgba(45,212,255,0.18);\n  }\n  .rcc-ico svg { width: 22px; height: 22px; }\n\n  \/* SECTION 1 \u2014 micro-cards *\/\n  .rcc-micro {\n    display: grid; gap: 22px;\n    grid-template-columns: repeat(3, 1fr);\n    margin-top: 36px;\n  }\n  @media (max-width: 820px) { .rcc-micro { grid-template-columns: 1fr; } }\n\n  \/* SECTION 2 \u2014 types grid *\/\n  .rcc-types {\n    display: grid; gap: 24px;\n    grid-template-columns: repeat(2, 1fr);\n  }\n  @media (max-width: 820px) { .rcc-types { grid-template-columns: 1fr; } }\n  .rcc-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }\n  .rcc-tag {\n    font-size: 11.5px; font-weight: 600; letter-spacing: 0.04em;\n    padding: 5px 10px; border-radius: 999px;\n    color: var(--ramoa-text-soft);\n    background: rgba(45,212,255,0.05);\n    border: 1px solid rgba(45,212,255,0.18);\n  }\n\n  \/* SECTION 3 \u2014 cases *\/\n  .rcc-cases {\n    display: grid; gap: 24px;\n    grid-template-columns: repeat(3, 1fr);\n  }\n  @media (max-width: 980px) { .rcc-cases { grid-template-columns: 1fr; } }\n  .rcc-case-tag {\n    display: inline-block;\n    font-size: 10.5px; font-weight: 900; letter-spacing: 0.18em;\n    color: var(--ramoa-cyan); text-transform: uppercase;\n    padding: 5px 10px; border-radius: 6px;\n    background: rgba(45,212,255,0.08);\n    border: 1px solid rgba(45,212,255,0.25);\n    margin-bottom: 16px;\n  }\n  .rcc-case h4 {\n    font-size: 12px; font-weight: 700; letter-spacing: 0.14em;\n    text-transform: uppercase; color: var(--ramoa-text-faint);\n    margin: 18px 0 8px;\n  }\n  .rcc-case p { font-size: 14.5px; line-height: 1.6; color: var(--ramoa-text-soft); margin: 0; }\n\n  \/* SECTION 4 \u2014 timeline *\/\n  .rcc-timeline {\n    position: relative;\n    display: grid; gap: 28px;\n    grid-template-columns: repeat(4, 1fr);\n    margin-top: 20px;\n  }\n  .rcc-timeline::before {\n    content: \"\";\n    position: absolute; top: 28px; left: 5%; right: 5%; height: 1px;\n    background: linear-gradient(90deg, transparent 0%, var(--ramoa-cyan) 25%, var(--ramoa-purple) 75%, transparent 100%);\n    background-size: 200% 100%;\n    animation: rcc-flow 7s linear infinite;\n    z-index: 0;\n  }\n  @keyframes rcc-flow { 0%{background-position:0% 0;} 100%{background-position:200% 0;} }\n  .rcc-step { position: relative; z-index: 1; }\n  .rcc-step-n {\n    display: inline-flex; align-items: center; justify-content: center;\n    width: 56px; height: 56px; border-radius: 14px;\n    background: rgba(7,16,34,0.95);\n    border: 1px solid rgba(45,212,255,0.3);\n    font-size: 18px; font-weight: 700;\n    color: var(--ramoa-cyan);\n    margin-bottom: 16px;\n  }\n  .rcc-step h3 { font-size: 19px; font-weight: 700; margin: 0 0 8px; }\n  .rcc-step p { font-size: 14.5px; line-height: 1.6; color: var(--ramoa-text-soft); margin: 0; }\n  @media (max-width: 820px) {\n    .rcc-timeline { grid-template-columns: 1fr; gap: 22px; }\n    .rcc-timeline::before {\n      top: 0; bottom: 0; left: 27px; right: auto; width: 1px; height: auto;\n      background: linear-gradient(180deg, transparent 0%, var(--ramoa-cyan) 25%, var(--ramoa-purple) 75%, transparent 100%);\n    }\n  }\n\n  \/* SECTION 5 \u2014 stack columns *\/\n  .rcc-stack {\n    display: grid; gap: 24px;\n    grid-template-columns: repeat(4, 1fr);\n  }\n  @media (max-width: 980px) { .rcc-stack { grid-template-columns: repeat(2, 1fr); } }\n  @media (max-width: 560px) { .rcc-stack { grid-template-columns: 1fr; } }\n  .rcc-stack h3 {\n    font-size: 12px; font-weight: 900; letter-spacing: 0.18em;\n    text-transform: uppercase; color: var(--ramoa-cyan);\n    margin: 0 0 16px;\n  }\n  .rcc-stack ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }\n  .rcc-stack li {\n    font-size: 13.5px; font-weight: 500;\n    padding: 7px 12px; border-radius: 999px;\n    color: var(--ramoa-text);\n    background: rgba(255,255,255,0.03);\n    border: 1px solid rgba(255,255,255,0.1);\n  }\n  .rcc-stack-note {\n    margin-top: 36px; text-align: center;\n    font-size: 13.5px; color: var(--ramoa-text-faint);\n    max-width: 720px; margin-left: auto; margin-right: auto; line-height: 1.6;\n  }\n\n  \/* SECTION 6 \u2014 profiles *\/\n  .rcc-profiles {\n    display: grid; gap: 24px;\n    grid-template-columns: repeat(3, 1fr);\n  }\n  @media (max-width: 980px) { .rcc-profiles { grid-template-columns: 1fr; } }\n\n  \/* SECTION 7 \u2014 CTA *\/\n  .rcc-cta-card {\n    position: relative;\n    max-width: 720px; margin: 0 auto;\n    padding: 2px; border-radius: 24px;\n    background: conic-gradient(from 0deg, var(--ramoa-cyan), var(--ramoa-purple), var(--ramoa-pink), var(--ramoa-cyan));\n    animation: rcc-spin 9s linear infinite;\n  }\n  @keyframes rcc-spin { to { transform: rotate(360deg); } }\n  .rcc-cta-inner {\n    background: linear-gradient(180deg, #071022 0%, #050914 100%);\n    border-radius: 22px;\n    padding: clamp(36px, 5vw, 56px);\n    text-align: center;\n    animation: rcc-spin 9s linear infinite reverse;\n  }\n  .rcc-cta-inner h3 {\n    font-size: clamp(24px, 3vw, 34px); font-weight: 700;\n    letter-spacing: -0.01em; margin: 0 0 14px;\n  }\n  .rcc-cta-inner p {\n    font-size: 15.5px; line-height: 1.65;\n    color: var(--ramoa-text-soft);\n    max-width: 540px; margin: 0 auto 28px;\n  }\n  .rcc-btn {\n    display: inline-flex; align-items: center; gap: 12px;\n    padding: 14px 28px; border-radius: 999px;\n    font-size: 15px; font-weight: 600;\n    color: var(--ramoa-text); text-decoration: none;\n    background: transparent;\n    border: 1px solid rgba(45,212,255,0.45);\n    transition: all .25s ease;\n  }\n  .rcc-btn:hover {\n    border-color: var(--ramoa-cyan);\n    box-shadow: 0 0 24px rgba(45,212,255,0.25);\n  }\n  .rcc-btn-dot {\n    width: 8px; height: 8px; border-radius: 50%;\n    background: var(--ramoa-cyan);\n    box-shadow: 0 0 8px var(--ramoa-cyan);\n    animation: rcc-pulse 1.6s ease-in-out infinite;\n  }\n  .rcc-btn-arrow { transition: transform .25s ease; }\n  .rcc-btn:hover .rcc-btn-arrow { transform: translateX(4px); }\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     RAMOA \u2014 FAQ SECTION SUPPORT\n     Estilos necess\u00e1rios para a se\u00e7\u00e3o FAQ\n     Classes usadas: rrs-section, rrs-section--a, rrs-inner,\n     rrs-eyebrow, rrs-h2, rrs-faq\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  .rcc .rrs-section{\n    position:relative;\n    isolation:isolate;\n    padding:clamp(72px,10vh,120px) clamp(18px,5vw,72px);\n    overflow:hidden;\n  }\n\n  .rcc .rrs-section--a{\n    background:\n      radial-gradient(80% 60% at 50% 0%, rgba(45,212,255,0.075), transparent 65%),\n      radial-gradient(60% 50% at 100% 100%, rgba(89,75,231,0.065), transparent 65%),\n      radial-gradient(50% 40% at 0% 100%, rgba(168,85,247,0.045), transparent 65%),\n      linear-gradient(180deg,#070210 0%,#071022 50%,#050914 100%) !important;\n  }\n\n  .rcc .rrs-inner{\n    position:relative;\n    z-index:1;\n    max-width:1200px;\n    margin:0 auto;\n  }\n\n  .rcc .rrs-eyebrow{\n    display:inline-flex;\n    align-items:center;\n    gap:8px;\n    font-size:10.5px;\n    font-weight:900;\n    letter-spacing:.18em;\n    text-transform:uppercase;\n    color:var(--ramoa-cyan);\n    padding:7px 12px;\n    border-radius:999px;\n    background:rgba(45,212,255,0.06);\n    border:1px solid rgba(45,212,255,0.22);\n  }\n\n  .rcc .rrs-eyebrow::before{\n    content:\"\";\n    width:6px;\n    height:6px;\n    border-radius:50%;\n    background:var(--ramoa-cyan);\n    box-shadow:0 0 10px rgba(45,212,255,0.8);\n    animation:rcc-pulse 1.6s ease-in-out infinite;\n  }\n\n  .rcc .rrs-h2{\n    font-size:clamp(28px,3.4vw,44px);\n    font-weight:600;\n    letter-spacing:-0.02em;\n    line-height:1.15;\n    margin:18px 0 18px;\n    max-width:880px;\n    color:var(--ramoa-text);\n  }\n\n  .rcc .rrs-faq{\n    margin-top:36px;\n    display:flex;\n    flex-direction:column;\n    gap:12px;\n    max-width:880px;\n  }\n\n  .rcc .rrs-faq details{\n    background:rgba(255,255,255,0.02);\n    border:1px solid rgba(255,255,255,0.08);\n    border-radius:14px;\n    padding:18px 22px;\n    transition:border-color .25s ease, background .25s ease;\n  }\n\n  .rcc .rrs-faq details[open]{\n    border-color:rgba(45,212,255,0.35);\n    background:rgba(45,212,255,0.025);\n  }\n\n  .rcc .rrs-faq summary{\n    cursor:pointer;\n    list-style:none;\n    display:flex;\n    justify-content:space-between;\n    align-items:center;\n    gap:16px;\n    font-size:15.5px;\n    font-weight:600;\n    color:var(--ramoa-text);\n  }\n\n  .rcc .rrs-faq summary::-webkit-details-marker{\n    display:none;\n  }\n\n  .rcc .rrs-faq summary::after{\n    content:\"+\";\n    font-size:22px;\n    font-weight:300;\n    color:var(--ramoa-cyan);\n    transition:transform .25s ease;\n  }\n\n  .rcc .rrs-faq details[open] summary::after{\n    transform:rotate(45deg);\n  }\n\n  .rcc .rrs-faq p{\n    margin-top:12px;\n    font-size:14.5px;\n    line-height:1.7;\n    color:var(--ramoa-text-soft);\n  }\n<\/style>\n\n<div class=\"rcc\">\n\n  <!-- SECTION 1 \u2014 Intro -->\n  <section class=\"rcc-section rcc-section--a\">\n    <div class=\"rcc-wrap\">\n      <span class=\"rcc-eyebrow\">O QUE FAZEMOS<\/span>\n      <h2 class=\"rcc-h2\">Software, automa\u00e7\u00f5es e arquitetura t\u00e9cnica feitos <span class=\"rcc-grad\">sob medida<\/span> para seu neg\u00f3cio.<\/h2>\n      <p class=\"rcc-lead\">Nem toda empresa precisa do mesmo sistema. Algumas precisam automatizar processos manuais, outras precisam de plataformas pr\u00f3prias, outras precisam de uma segunda opini\u00e3o t\u00e9cnica antes de uma decis\u00e3o grande. A RAMOA atua nas tr\u00eas frentes, sempre com crit\u00e9rio, transpar\u00eancia t\u00e9cnica e foco em sustentabilidade do c\u00f3digo entregue.<\/p>\n\n      <div class=\"rcc-micro\">\n        <div class=\"rcc-card\">\n          <span class=\"rcc-ico\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polygon points=\"12 2 2 7 12 12 22 7 12 2\"\/><polyline points=\"2 17 12 22 22 17\"\/><polyline points=\"2 12 12 17 22 12\"\/><\/svg>\n          <\/span>\n          <h3>Arquitetura<\/h3>\n          <p>Decis\u00f5es t\u00e9cnicas pensadas para escalar, n\u00e3o s\u00f3 para entregar r\u00e1pido.<\/p>\n        <\/div>\n        <div class=\"rcc-card\">\n          <span class=\"rcc-ico\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\"\/><path d=\"M7 11V7a5 5 0 0 1 9.9-1\"\/><\/svg>\n          <\/span>\n          <h3>Autonomia<\/h3>\n          <p>C\u00f3digo documentado, sem amarras t\u00e9cnicas. Sua empresa n\u00e3o fica ref\u00e9m da ag\u00eancia.<\/p>\n        <\/div>\n        <div class=\"rcc-card\">\n          <span class=\"rcc-ico\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><polyline points=\"12 7 12 12 15 14\"\/><\/svg>\n          <\/span>\n          <h3>Longevidade<\/h3>\n          <p>Solu\u00e7\u00f5es constru\u00eddas para durar anos, n\u00e3o para serem refeitas em um.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 2 \u2014 Tipos de projeto -->\n  <section class=\"rcc-section rcc-section--a rcc-section--grade\">\n    <div class=\"rcc-wrap\">\n      <span class=\"rcc-eyebrow\">TIPOS DE PROJETO<\/span>\n      <h2 class=\"rcc-h2\">Quatro frentes de atua\u00e7\u00e3o. Mesmo m\u00e9todo t\u00e9cnico.<\/h2>\n      <p class=\"rcc-lead\">Cada projeto come\u00e7a com uma pergunta diferente, mas todos seguem o mesmo rigor de arquitetura, documenta\u00e7\u00e3o e qualidade de c\u00f3digo. Conhe\u00e7a as principais frentes de atua\u00e7\u00e3o da RAMOA em desenvolvimento e consultoria t\u00e9cnica.<\/p>\n\n      <div class=\"rcc-types\">\n        <div class=\"rcc-card\">\n          <h3>Automa\u00e7\u00e3o de Processos<\/h3>\n          <p>Automatiza\u00e7\u00e3o de fluxos repetitivos, integra\u00e7\u00e3o entre sistemas diferentes, scripts customizados e bots para eliminar tarefas manuais e reduzir erro humano em opera\u00e7\u00f5es cr\u00edticas.<\/p>\n          <div class=\"rcc-tags\">\n            <span class=\"rcc-tag\">n8n<\/span><span class=\"rcc-tag\">Make<\/span><span class=\"rcc-tag\">Zapier<\/span><span class=\"rcc-tag\">Scripts<\/span>\n          <\/div>\n        <\/div>\n        <div class=\"rcc-card\">\n          <h3>Sistemas Sob Medida<\/h3>\n          <p>Desenvolvimento de plataformas web exclusivas: CRM interno, dashboards, \u00e1reas de membro, pain\u00e9is administrativos e sistemas que resolvem regras de neg\u00f3cio espec\u00edficas do seu modelo.<\/p>\n          <div class=\"rcc-tags\">\n            <span class=\"rcc-tag\">React<\/span><span class=\"rcc-tag\">Node.js<\/span><span class=\"rcc-tag\">Postgres<\/span><span class=\"rcc-tag\">APIs<\/span>\n          <\/div>\n        <\/div>\n        <div class=\"rcc-card\">\n          <h3>Integra\u00e7\u00f5es T\u00e9cnicas<\/h3>\n          <p>Conex\u00e3o entre ferramentas que sua empresa j\u00e1 usa, via API, webhook ou middleware customizado. CRM falando com ERP, e-commerce com estoque, formul\u00e1rio com automa\u00e7\u00e3o de marketing.<\/p>\n          <div class=\"rcc-tags\">\n            <span class=\"rcc-tag\">REST<\/span><span class=\"rcc-tag\">GraphQL<\/span><span class=\"rcc-tag\">Webhooks<\/span><span class=\"rcc-tag\">APIs<\/span>\n          <\/div>\n        <\/div>\n        <div class=\"rcc-card\">\n          <h3>Consultoria T\u00e9cnica<\/h3>\n          <p>An\u00e1lise t\u00e9cnica neutra para decis\u00f5es importantes: escolha de tecnologia, revis\u00e3o de arquitetura, due diligence em sistemas herdados, segunda opini\u00e3o antes de contratar dev ou ag\u00eancia.<\/p>\n          <div class=\"rcc-tags\">\n            <span class=\"rcc-tag\">Stack<\/span><span class=\"rcc-tag\">Arquitetura<\/span><span class=\"rcc-tag\">Due Diligence<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 3 \u2014 Casos -->\n  <section class=\"rcc-section rcc-section--b\">\n    <div class=\"rcc-wrap\">\n      <span class=\"rcc-eyebrow\">CASOS REAIS<\/span>\n      <h2 class=\"rcc-h2\">Como esses projetos aparecem na pr\u00e1tica.<\/h2>\n      <p class=\"rcc-lead\">A maior parte das empresas chega \u00e0 RAMOA com um problema operacional, n\u00e3o com um pedido t\u00e9cnico. Os cen\u00e1rios abaixo s\u00e3o exemplos comuns de como nosso trabalho se aplica no dia a dia de um neg\u00f3cio.<\/p>\n\n      <div class=\"rcc-cases\">\n        <div class=\"rcc-card rcc-case\">\n          <span class=\"rcc-case-tag\">AUTOMA\u00c7\u00c3O<\/span>\n          <h4>Cen\u00e1rio<\/h4>\n          <p>Empresa de servi\u00e7os recebia leads em 3 canais diferentes (site, Instagram, WhatsApp) e atualizava manualmente em planilha. Tempo m\u00e9dio por lead: 8 minutos. Erros frequentes.<\/p>\n          <h4>Solu\u00e7\u00e3o RAMOA<\/h4>\n          <p>Integra\u00e7\u00e3o entre todos os canais e CRM com regras de qualifica\u00e7\u00e3o autom\u00e1tica. Tempo por lead: 0 minuto. Zero erro de digita\u00e7\u00e3o. Hist\u00f3rico unificado e dispon\u00edvel para an\u00e1lise.<\/p>\n        <\/div>\n        <div class=\"rcc-card rcc-case\">\n          <span class=\"rcc-case-tag\">SISTEMA SOB MEDIDA<\/span>\n          <h4>Cen\u00e1rio<\/h4>\n          <p>Escrit\u00f3rio de advocacia gerenciava prazos processuais em Excel compartilhado entre 8 advogados. Conflitos de vers\u00e3o, alertas perdidos, retrabalho frequente.<\/p>\n          <h4>Solu\u00e7\u00e3o RAMOA<\/h4>\n          <p>Sistema web pr\u00f3prio com cadastro de processo, lembrete autom\u00e1tico de prazo, atribui\u00e7\u00e3o de respons\u00e1vel e log de altera\u00e7\u00e3o. Acesso multiusu\u00e1rio com permiss\u00f5es por n\u00edvel.<\/p>\n        <\/div>\n        <div class=\"rcc-card rcc-case\">\n          <span class=\"rcc-case-tag\">CONSULTORIA<\/span>\n          <h4>Cen\u00e1rio<\/h4>\n          <p>Empresa em crescimento recebeu or\u00e7amento de R$ 180 mil de uma f\u00e1brica de software para refazer seu sistema interno. N\u00e3o sabia se o valor era justo nem se a tecnologia proposta era a melhor.<\/p>\n          <h4>Solu\u00e7\u00e3o RAMOA<\/h4>\n          <p>Auditoria t\u00e9cnica neutra em 2 semanas. Valida\u00e7\u00e3o de escopo, an\u00e1lise de stack proposta, identifica\u00e7\u00e3o de redund\u00e2ncias. Resultado: escopo reduzido em 40% e renegocia\u00e7\u00e3o informada com o fornecedor.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 4 \u2014 Processo -->\n  <section class=\"rcc-section rcc-section--a\">\n    <div class=\"rcc-wrap\">\n      <span class=\"rcc-eyebrow\">NOSSO PROCESSO<\/span>\n      <h2 class=\"rcc-h2\">M\u00e9todo estruturado para reduzir risco t\u00e9cnico.<\/h2>\n      <p class=\"rcc-lead\">Projetos de software falham por motivos previs\u00edveis: escopo mal definido, decis\u00f5es t\u00e9cnicas precipitadas, aus\u00eancia de documenta\u00e7\u00e3o, depend\u00eancia de pessoa. A RAMOA segue 4 etapas pensadas para eliminar cada um desses riscos antes que se tornem problema.<\/p>\n\n      <div class=\"rcc-timeline\">\n        <div class=\"rcc-step\">\n          <div class=\"rcc-step-n\">01<\/div>\n          <h3>Discovery<\/h3>\n          <p>Levantamento t\u00e9cnico e de neg\u00f3cio. Mapeamos fluxos, integra\u00e7\u00f5es existentes, restri\u00e7\u00f5es e o resultado esperado em m\u00e9tricas concretas.<\/p>\n        <\/div>\n        <div class=\"rcc-step\">\n          <div class=\"rcc-step-n\">02<\/div>\n          <h3>Arquitetura<\/h3>\n          <p>Documento t\u00e9cnico com decis\u00f5es justificadas: stack, estrutura de dados, fluxos cr\u00edticos, pontos de integra\u00e7\u00e3o e plano de testes.<\/p>\n        <\/div>\n        <div class=\"rcc-step\">\n          <div class=\"rcc-step-n\">03<\/div>\n          <h3>Constru\u00e7\u00e3o<\/h3>\n          <p>Desenvolvimento com entregas incrementais, revis\u00e3o cont\u00ednua, testes automatizados e versionamento controlado em reposit\u00f3rio acess\u00edvel.<\/p>\n        <\/div>\n        <div class=\"rcc-step\">\n          <div class=\"rcc-step-n\">04<\/div>\n          <h3>Handover<\/h3>\n          <p>Entrega com documenta\u00e7\u00e3o t\u00e9cnica completa, treinamento da equipe e acesso total ao c\u00f3digo. Acompanhamento t\u00e9cnico opcional ap\u00f3s o lan\u00e7amento.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 5 \u2014 Stack -->\n  <section class=\"rcc-section rcc-section--a rcc-section--grade\">\n    <div class=\"rcc-wrap\">\n      <span class=\"rcc-eyebrow\">TRANSPAR\u00caNCIA T\u00c9CNICA<\/span>\n      <h2 class=\"rcc-h2\">Tecnologias que usamos. <span class=\"rcc-grad\">Sem caixa-preta<\/span>, sem fornecedor \u00fanico.<\/h2>\n      <p class=\"rcc-lead\">Acreditamos que o cliente tem direito de saber em qual stack seu software est\u00e1 sendo constru\u00eddo. Trabalhamos com tecnologias maduras, amplamente adotadas no mercado, para garantir que voc\u00ea possa contratar outro time no futuro sem ficar ref\u00e9m da RAMOA.<\/p>\n\n      <div class=\"rcc-stack\">\n        <div>\n          <h3>Backend<\/h3>\n          <ul>\n            <li>Node.js<\/li><li>Python<\/li><li>PHP (CMS)<\/li><li>Postgres \/ MySQL<\/li><li>Redis<\/li>\n          <\/ul>\n        <\/div>\n        <div>\n          <h3>Frontend<\/h3>\n          <ul>\n            <li>React<\/li><li>Next.js<\/li><li>TypeScript<\/li><li>Tailwind CSS<\/li>\n          <\/ul>\n        <\/div>\n        <div>\n          <h3>Automa\u00e7\u00e3o<\/h3>\n          <ul>\n            <li>n8n (self-hosted)<\/li><li>Make<\/li><li>Zapier<\/li><li>Scripts Python<\/li>\n          <\/ul>\n        <\/div>\n        <div>\n          <h3>Infra e DevOps<\/h3>\n          <ul>\n            <li>Docker<\/li><li>Git \/ GitHub<\/li><li>CI\/CD b\u00e1sico<\/li><li>AWS \/ DigitalOcean<\/li>\n          <\/ul>\n        <\/div>\n      <\/div>\n\n      <p class=\"rcc-stack-note\">Outras tecnologias podem ser avaliadas conforme o contexto do projeto. O crit\u00e9rio da RAMOA \u00e9 sempre: estabilidade, comunidade ativa e baixa fric\u00e7\u00e3o para manuten\u00e7\u00e3o futura.<\/p>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 6 \u2014 Para quem \u00e9 -->\n  <section class=\"rcc-section rcc-section--a\">\n    <div class=\"rcc-wrap\">\n      <span class=\"rcc-eyebrow\">PARA QUEM \u00c9<\/span>\n      <h2 class=\"rcc-h2\">Para empresas que tratam tecnologia como ativo estrat\u00e9gico.<\/h2>\n      <p class=\"rcc-lead\">A RAMOA atende empresas em momentos espec\u00edficos, onde decis\u00e3o t\u00e9cnica errada custa caro e decis\u00e3o t\u00e9cnica certa libera crescimento.<\/p>\n\n      <div class=\"rcc-profiles\">\n        <div class=\"rcc-card\">\n          <span class=\"rcc-ico\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"3\"\/><path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.6 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.6a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\"\/><\/svg>\n          <\/span>\n          <h3>Empresas operacionalmente travadas<\/h3>\n          <p>Para neg\u00f3cios cujo crescimento esbarra em processo manual, planilha compartilhada ou sistema legado.<\/p>\n        <\/div>\n        <div class=\"rcc-card\">\n          <span class=\"rcc-ico\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><ellipse cx=\"12\" cy=\"5\" rx=\"9\" ry=\"3\"\/><path d=\"M3 5v6c0 1.66 4 3 9 3s9-1.34 9-3V5\"\/><path d=\"M3 11v6c0 1.66 4 3 9 3s9-1.34 9-3v-6\"\/><\/svg>\n          <\/span>\n          <h3>Neg\u00f3cios sem sistema pr\u00f3prio<\/h3>\n          <p>Para empresas que usam ferramentas gen\u00e9ricas e precisam de plataforma pr\u00f3pria com regras espec\u00edficas.<\/p>\n        <\/div>\n        <div class=\"rcc-card\">\n          <span class=\"rcc-ico\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"7\"\/><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"\/><\/svg>\n          <\/span>\n          <h3>Lideran\u00e7as precisando validar decis\u00e3o t\u00e9cnica<\/h3>\n          <p>Para CEOs, CTOs e gestores que precisam de an\u00e1lise neutra antes de contratar f\u00e1brica de software ou refatorar sistema.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 7 \u2014 FAQ -->\n  <section class=\"rrs-section rrs-section--a\">\n    <div class=\"rrs-inner\">\n      <span class=\"rrs-eyebrow\">D\u00daVIDAS COMUNS<\/span>\n      <h2 class=\"rrs-h2\">Perguntas frequentes sobre desenvolvimento e consultoria t\u00e9cnica.<\/h2>\n\n      <div class=\"rrs-faq\">\n        <details>\n          <summary>Quanto tempo leva um projeto de software sob medida?<\/summary>\n          <p>Depende totalmente do escopo. Automa\u00e7\u00f5es simples e integra\u00e7\u00f5es ficam prontas em 2 a 4 semanas. Sistemas web sob medida levam de 2 a 6 meses, conforme complexidade das regras de neg\u00f3cio. Consultorias t\u00e9cnicas pontuais s\u00e3o entregues em 1 a 3 semanas. Definimos cronograma realista logo na etapa de discovery.<\/p>\n        <\/details>\n        <details>\n          <summary>O c\u00f3digo fica em meu nome ou da RAMOA?<\/summary>\n          <p>100% em seu nome. Todo c\u00f3digo produzido pela RAMOA \u00e9 entregue com acesso completo ao reposit\u00f3rio, documenta\u00e7\u00e3o t\u00e9cnica e direito total de uso, modifica\u00e7\u00e3o e contrata\u00e7\u00e3o de outro time no futuro. Nenhuma amarra contratual ou t\u00e9cnica.<\/p>\n        <\/details>\n        <details>\n          <summary>Voc\u00eas usam alguma tecnologia propriet\u00e1ria ou plataforma fechada?<\/summary>\n          <p>N\u00e3o. Trabalhamos exclusivamente com tecnologias amplamente adotadas no mercado (Node.js, Python, React, Postgres, n8n self-hosted, entre outras) justamente para que voc\u00ea possa contratar qualquer desenvolvedor ou ag\u00eancia no futuro sem precisar refazer o sistema.<\/p>\n        <\/details>\n        <details>\n          <summary>Como funciona se eu j\u00e1 tenho um sistema legado funcionando mal?<\/summary>\n          <p>Avaliamos o sistema atual em uma an\u00e1lise t\u00e9cnica antes de propor qualquer a\u00e7\u00e3o. Em muitos casos, refatora\u00e7\u00e3o parcial ou integra\u00e7\u00e3o com novas camadas resolve sem precisar refazer do zero. Quando refazer \u00e9 o caminho certo, justificamos tecnicamente com dado, n\u00e3o com opini\u00e3o.<\/p>\n        <\/details>\n        <details>\n          <summary>A RAMOA continua dispon\u00edvel depois da entrega?<\/summary>\n          <p>Sim, mas sem amarras. Oferecemos suporte t\u00e9cnico cont\u00ednuo opcional para evolu\u00e7\u00e3o, manuten\u00e7\u00e3o e novas funcionalidades, com escopo definido em contrato separado. Se preferir levar o projeto para outro time, entregamos tudo documentado para garantir transi\u00e7\u00e3o limpa.<\/p>\n        <\/details>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 8 \u2014 CTA -->\n  <section class=\"rcc-section rcc-section--b\">\n    <div class=\"rcc-wrap\">\n      <div class=\"rcc-cta-card\">\n        <div class=\"rcc-cta-inner\">\n          <h3>Tem um projeto t\u00e9cnico em mente?<\/h3>\n          <p>Conte sobre seu cen\u00e1rio, seu sistema atual ou o problema que precisa resolver. Avaliamos juntos se \u00e9 caso de automa\u00e7\u00e3o, desenvolvimento sob medida ou consultoria. Resposta em at\u00e9 24 horas \u00fateis.<\/p>\n          <a href=\"\/contato\" class=\"rcc-btn\">\n            <span class=\"rcc-btn-dot\"><\/span>\n            Vamos Conversar\n            <span class=\"rcc-btn-arrow\">\u2192<\/span>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n    <div class=\"xs_social_share_widget xs_share_url after_content \t\tmain_content  wslu-style-1 wslu-share-box-shaped wslu-fill-colored wslu-none wslu-share-horizontal wslu-theme-font-no wslu-main_content\">\n\n\t\t\n        <ul>\n\t\t\t        <\/ul>\n    <\/div> \n","protected":false},"excerpt":{"rendered":"<p>Home \/ Servi\u00e7os \/ Code &#038; Consulting Code &#038; Consulting Sistemas &#038; automa\u00e7\u00f5es que transformam opera\u00e7\u00e3o em escala. Desenvolvimento de software sob medida, automa\u00e7\u00f5es, integra\u00e7\u00f5es e consultoria t\u00e9cnica para transformar processos manuais em opera\u00e7\u00f5es mais inteligentes e produtivas. DESENVOLVIMENTO WEB IDENTIDADE VISUAL SOFTWARE SOB MEDIDA LOJA VIRTUAL TR\u00c1FEGO PAGO WORDPRESS REDES SOCIAIS LANDING PAGES SEO [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1947,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5323","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/pages\/5323","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/comments?post=5323"}],"version-history":[{"count":22,"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/pages\/5323\/revisions"}],"predecessor-version":[{"id":5447,"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/pages\/5323\/revisions\/5447"}],"up":[{"embeddable":true,"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/pages\/1947"}],"wp:attachment":[{"href":"https:\/\/ramoadigital.com\/de\/wp-json\/wp\/v2\/media?parent=5323"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}