JobmakerSite/index.html
Ricardo Carneiro 4a3392a764
All checks were successful
Build and Deploy JobMaker / build (push) Successful in 1m33s
Build and Deploy JobMaker / deploy (push) Successful in 22s
Build and Deploy JobMaker / notify (push) Successful in 0s
fix: refresh louco
2025-08-17 22:21:55 -03:00

983 lines
38 KiB
HTML

<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Meta Description Otimizada (máximo 160 caracteres) -->
<meta name="description" content="Especialista em integrações de sistemas C#/.NET. 20+ anos conectando SAP, Salesforce e sistemas legados. São Bernardo do Campo, SP." />
<!-- Meta Keywords -->
<meta name="keywords" content="integração sistemas, automação, C#, .NET, SAP, Salesforce, API, São Bernardo Campo, modernização sistemas" />
<!-- Open Graph para redes sociais -->
<meta property="og:title" content="JobMaker - Integrações de Sistemas & Automação" />
<meta property="og:description" content="Especialista em integrações de sistemas C#/.NET. 20+ anos conectando SAP, Salesforce e sistemas legados." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://jobmaker.com.br" />
<meta property="og:image" content="https://jobmaker.com.br/assets/img/jobmaker-og-image.jpg" />
<meta property="og:locale" content="pt_BR" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="JobMaker - Integrações de Sistemas & Automação" />
<meta name="twitter:description" content="Especialista em integrações de sistemas C#/.NET. 20+ anos conectando SAP, Salesforce e sistemas legados." />
<!-- Canonical URL -->
<link rel="canonical" href="https://jobmaker.com.br" />
<meta name="author" content="JobMaker - Ricardo Carneiro" />
<meta name="robots" content="index, follow" />
<title>JobMaker - Integrações de Sistemas & Automação | C#/.NET Enterprise</title>
<!-- Resto do head mantém igual... -->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
<script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700" rel="stylesheet" type="text/css" />
<link href="css/styles.css" rel="stylesheet" />
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-L1GX4ZNZ5M"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-L1GX4ZNZ5M');
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "ProfessionalService",
"name": "JobMaker - Integrações de Sistemas & Automação",
"description": "Especialista em integrações de sistemas e automação empresarial. 20+ anos conectando SAP, Salesforce, sistemas legados com C#/.NET. Modernização e automação de processos.",
"url": "https://jobmaker.com.br",
"telephone": "+55-11-XXXXX-XXXX",
"address": {
"@type": "PostalAddress",
"addressLocality": "São Bernardo do Campo",
"addressRegion": "SP",
"addressCountry": "BR"
},
"areaServed": [
"Brasil", "São Paulo", "ABC Paulista", "Grande São Paulo"
],
"serviceType": [
"Integrações de Sistemas",
"Automação Empresarial",
"Modernização de Sistemas",
"APIs e Web Services",
"Consultoria RAG/IA"
],
"inLanguage": "pt-BR",
"sameAs": [
"https://linkedin.com/in/ricardo-carneiro"
]
}
</script>
<style>
/* CSS mantido igual - apenas ajustes de conteúdo */
:root {
--bs-primary: #667eea;
--bs-primary-rgb: 102, 126, 234;
}
body {
font-family: 'Roboto Slab', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
line-height: 1.6;
}
/* Navbar styles profissionais */
#mainNav {
background-color: #212529;
transition: all 0.3s;
padding-top: 1rem;
padding-bottom: 1rem;
}
#mainNav .navbar-brand {
color: #ffc800;
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-weight: 700;
letter-spacing: 0.0625em;
text-transform: uppercase;
font-size: 1.5rem;
}
#mainNav .navbar-brand:hover {
color: #ffc800;
}
#mainNav .navbar-nav .nav-item .nav-link {
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-size: 0.95rem;
color: #fff;
letter-spacing: 0.0625em;
font-weight: 400;
transition: color 0.3s;
}
#mainNav .navbar-nav .nav-item .nav-link.active,
#mainNav .navbar-nav .nav-item .nav-link:hover {
color: #ffc800;
}
#mainNav.navbar-shrink {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
#mainNav.navbar-shrink .navbar-brand {
font-size: 1.25rem;
}
.masthead {
padding-top: 10.5rem;
padding-bottom: 6rem;
text-align: center;
color: #fff;
background: linear-gradient(to bottom, rgba(22, 22, 22, 0.3) 0%, rgba(22, 22, 22, 0.7) 75%, #161616 100%), url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23667eea' fill-opacity='0.1'%3E%3Ccircle cx='30' cy='30' r='4'/%3E%3Ccircle cx='0' cy='30' r='4'/%3E%3Ccircle cx='60' cy='30' r='4'/%3E%3Ccircle cx='30' cy='0' r='4'/%3E%3Ccircle cx='30' cy='60' r='4'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-attachment: scroll;
background-position: center center;
background-repeat: repeat;
background-size: 60px 60px;
}
.masthead .masthead-subheading {
font-size: 4rem;
font-style: normal;
line-height: 4rem;
margin-bottom: 25px;
color: #ffc800;
text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-weight: 700;
text-transform: uppercase;
}
.masthead .masthead-heading {
font-size: 1.8rem;
font-weight: 400;
line-height: 2.2rem;
margin-bottom: 2rem;
color: #ffc800;
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.btn-primary {
background: linear-gradient(45deg, #667eea, #764ba2);
border: none;
transition: transform 0.3s, box-shadow 0.3s;
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-weight: 700;
letter-spacing: 0.0625em;
padding: 1.25rem 2.5rem;
font-size: 0.875rem;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(102, 126, 234, 0.4);
}
.btn-outline-light {
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-weight: 700;
letter-spacing: 0.0625em;
padding: 1.25rem 2.5rem;
font-size: 0.875rem;
transition: all 0.3s;
}
.btn-outline-light:hover {
background-color: #ffc800;
border-color: #ffc800;
color: #212529;
}
.section-heading {
color: #333;
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-weight: 700;
}
.text-muted { color: #6c757d !important; }
/* Comparativo Integrações vs Desenvolvimento Tradicional */
.comparison-section {
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
padding: 80px 0;
}
.comparison-table {
background: white;
border-radius: 15px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
margin: 3rem 0;
}
.table-header {
background: linear-gradient(45deg, #667eea, #764ba2);
color: white;
padding: 1.5rem;
text-align: center;
font-size: 1.5rem;
font-weight: bold;
}
.comparison-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0;
}
.comparison-header {
background: #f8f9fa;
padding: 1rem;
font-weight: bold;
text-align: center;
border-bottom: 2px solid #e9ecef;
}
.comparison-item {
padding: 1rem;
border-bottom: 1px solid #e9ecef;
border-right: 1px solid #e9ecef;
text-align: center;
}
.comparison-item:nth-child(3n) { border-right: none; }
.advantage {
background: linear-gradient(45deg, #d4edda, #c3e6cb);
color: #155724;
font-weight: bold;
}
.cost-highlight {
background: linear-gradient(45deg, #fff3cd, #ffeaa7);
color: #856404;
font-weight: bold;
}
/* Serviços com layout melhorado */
.page-section {
padding: 6rem 0;
}
.row.text-center {
margin-top: 3rem;
}
.service-col {
margin-bottom: 3rem;
}
.service-card {
background: white;
padding: 2rem;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
height: 100%;
border-left: 5px solid #667eea;
transition: transform 0.3s;
}
.service-card:hover {
transform: translateY(-5px);
}
.service-card .service-icon {
font-size: 3rem;
color: #667eea;
margin-bottom: 1rem;
}
.service-card ul {
text-align: left;
padding-left: 0;
list-style: none;
}
.service-card ul li {
margin-bottom: 0.5rem;
padding-left: 1.5rem;
position: relative;
}
.service-card ul li::before {
content: "✅";
position: absolute;
left: 0;
}
.pricing-tier {
display: inline-block;
background: linear-gradient(45deg, #667eea, #764ba2);
color: white;
padding: 0.5rem 1rem;
border-radius: 20px;
font-size: 0.9rem;
margin: 1rem 0;
}
/* Timeline styles - mantidos iguais */
.timeline {
list-style: none;
padding: 0;
position: relative;
}
.timeline:before {
top: 0;
bottom: 0;
position: absolute;
content: "";
width: 2px;
background-color: #e9ecef;
left: 40px;
margin-left: -1.5px;
}
.timeline > li {
margin-bottom: 50px;
position: relative;
min-height: 50px;
}
.timeline > li:after,
.timeline > li:before {
content: " ";
display: table;
}
.timeline > li:after {
clear: both;
}
.timeline > li .timeline-panel {
width: 100%;
float: right;
padding: 0 20px 0 100px;
position: relative;
text-align: left;
}
.timeline > li .timeline-panel:before {
border-left-width: 0;
border-right-width: 15px;
left: -15px;
right: auto;
}
.timeline > li .timeline-panel:after {
border-left-width: 0;
border-right-width: 14px;
left: -14px;
right: auto;
}
.timeline > li .timeline-image {
left: 0;
margin-left: 0;
width: 80px;
height: 80px;
position: absolute;
z-index: 100;
background-color: #667eea;
color: white;
border-radius: 100%;
border: 7px solid #e9ecef;
text-align: center;
}
.timeline > li .timeline-image h4 {
font-size: 10px;
margin-top: 12px;
line-height: 14px;
}
.timeline > li.timeline-inverted > .timeline-panel {
float: right;
text-align: left;
padding: 0 20px 0 100px;
}
.timeline > li.timeline-inverted > .timeline-panel:before {
border-left-width: 0;
border-right-width: 15px;
left: -15px;
right: auto;
}
.timeline > li.timeline-inverted > .timeline-panel:after {
border-left-width: 0;
border-right-width: 14px;
left: -14px;
right: auto;
}
.timeline-heading h4 {
margin-top: 0;
color: inherit;
}
.timeline-heading h4.subheading {
text-transform: none;
}
.timeline-body > p,
.timeline-body > ul {
margin-bottom: 0;
}
/* WhatsApp Button */
.whatsapp-float {
position: fixed;
width: 60px;
height: 60px;
bottom: 40px;
right: 40px;
background-color: #25d366;
color: #FFF;
border-radius: 50px;
text-align: center;
font-size: 30px;
box-shadow: 2px 2px 3px #999;
z-index: 100;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
}
@media (max-width: 768px) {
.masthead .masthead-subheading {
font-size: 2.5rem;
line-height: 2.5rem;
}
.masthead .masthead-heading {
font-size: 1.6rem;
line-height: 1.6rem;
}
}
.whatsapp-float:hover {
transform: scale(1.1);
color: #FFF;
text-decoration: none;
}
.footer {
text-align: center;
font-size: 0.9rem;
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
background-color: #212529;
color: #fff;
}
/* Responsive */
@media (max-width: 768px) {
.comparison-grid { grid-template-columns: 1fr; }
.comparison-header { display: none; }
.masthead { min-height: 70vh; }
.masthead .masthead-heading { font-size: 2.25rem; line-height: 2.25rem; }
.masthead .masthead-subheading { font-size: 1.25rem; }
.timeline:before { left: 40px; }
.timeline > li > .timeline-panel { width: 100%; float: right; padding: 0 20px 0 100px; }
.timeline > li > .timeline-image { left: 0; width: 80px; height: 80px; }
}
@media (min-width: 768px) {
.timeline:before { left: 50%; }
.timeline > li { margin-bottom: 100px; min-height: 100px; }
.timeline > li > .timeline-panel { width: 41%; float: left; padding: 0 20px 20px 30px; text-align: right; }
.timeline > li > .timeline-image { width: 100px; height: 100px; left: 50%; margin-left: -50px; }
.timeline > li > .timeline-image h4 { font-size: 13px; margin-top: 16px; line-height: 18px; }
.timeline > li.timeline-inverted > .timeline-panel { float: right; text-align: left; padding: 0 30px 20px 20px; }
}
@media (min-width: 992px) {
.timeline > li { min-height: 150px; }
.timeline > li > .timeline-panel { padding: 0 20px 20px; }
.timeline > li > .timeline-image { width: 150px; height: 150px; margin-left: -75px; }
.timeline > li > .timeline-image h4 { font-size: 18px; margin-top: 30px; line-height: 26px; }
.timeline > li.timeline-inverted > .timeline-panel { padding: 0 20px 20px; }
}
</style>
</head>
<body id="page-top">
<!-- Navigation-->
<nav class="navbar navbar-expand-lg navbar-dark fixed-top" id="mainNav">
<div class="container">
<a class="navbar-brand" href="#page-top"><img src="assets/img/jobmaker_logo.png" alt="..." /></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fas fa-bars ms-1"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav text-uppercase ms-auto py-4 py-lg-0">
<li class="nav-item"><a class="nav-link" href="#vantagens">Vantagens</a></li>
<li class="nav-item"><a class="nav-link" href="#services">Serviços</a></li>
<li class="nav-item"><a class="nav-link" href="#about">Expertise</a></li>
<li class="nav-item"><a class="nav-link" href="#contact">Contato</a></li>
</ul>
</div>
</div>
</nav>
<!-- Masthead-->
<header class="masthead">
<div class="container">
<div class="masthead-subheading">Integrações de Sistemas & Automação</div>
<div class="masthead-heading text-uppercase">20+ Anos Conectando Sistemas Impossíveis</div>
<a class="btn btn-primary btn-xl text-uppercase" href="#services">Descubra as Soluções</a>
</div>
</header>
<!-- Services-->
<section class="page-section" id="vantagens">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Por Que Especialista em Integrações?</h2>
<h3 class="section-subheading text-muted">Diferença entre integração especializada vs desenvolvimento convencional.</h3>
</div>
<div class="row text-center">
<div class="comparison-table">
<div class="table-header">
Integração Especializada vs Desenvolvimento Convencional
</div>
<div class="comparison-grid">
<div class="comparison-header">Aspecto</div>
<div class="comparison-header">Especialista em Integrações</div>
<div class="comparison-header">Desenvolvimento Tradicional</div>
<div class="comparison-item"><strong>Tempo de Implementação</strong></div>
<div class="comparison-item advantage">60-80% mais rápido<br>Experiência comprovada</div>
<div class="comparison-item">Curva de aprendizado<br>Trial & error</div>
<div class="comparison-item"><strong>Custo do Projeto</strong></div>
<div class="comparison-item cost-highlight">40-60% menor<br>Menos retrabalho</div>
<div class="comparison-item">Custo padrão<br>Mais iterações</div>
<div class="comparison-item"><strong>Compatibilidade</strong></div>
<div class="comparison-item advantage">Sistemas legados + modernos<br>APIs antigas e novas</div>
<div class="comparison-item">Foco em tecnologias novas<br>Limitações legadas</div>
<div class="comparison-item"><strong>Suporte Técnico</strong></div>
<div class="comparison-item advantage">Conhecimento profundo<br>Troubleshooting avançado</div>
<div class="comparison-item">Suporte básico<br>Dependência fornecedor</div>
<div class="comparison-item"><strong>Escalabilidade</strong></div>
<div class="comparison-item advantage">Arquitetura enterprise<br>Performance otimizada</div>
<div class="comparison-item">Soluções pontuais<br>Limitações técnicas</div>
</div>
</div>
</div>
<div class="text-center mt-4">
<p class="lead"><strong>Resultado:</strong> Integração mais rápida, confiável e econômica com 20+ anos de experiência comprovada</p>
</div>
</div>
</section>
<!-- Portfolio Grid-->
<section class="page-section bg-light" id="services">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Serviços Especializados</h2>
<h3 class="section-subheading text-muted">Soluções de integração e automação para conectar seus sistemas.</h3>
</div>
<div class="row text-center">
<div class="col-md-3 service-col">
<div class="service-card">
<div class="service-icon">
<i class="fas fa-plug"></i>
</div>
<h4>Integrações Enterprise</h4>
<div class="pricing-tier">Conectividade Total</div>
<p>Conecte SAP, Salesforce, sistemas legados e APIs modernas. Integração bidirecional com sincronização em tempo real.</p>
<ul>
<li>SAP ↔ Sistema interno</li>
<li>Salesforce ↔ ERP</li>
<li>APIs REST/SOAP/GraphQL</li>
<li>Sistemas legados ↔ Cloud</li>
</ul>
</div>
</div>
<div class="col-md-3 service-col">
<div class="service-card">
<div class="service-icon">
<i class="fas fa-robot"></i>
</div>
<h4>Automação & RPA</h4>
<div class="pricing-tier">Eficiência Máxima</div>
<p>Automatize processos manuais com web scraping, robôs de dados e workflows inteligentes usando PuppeteerSharp e C#.</p>
<ul>
<li>Web scraping inteligente</li>
<li>Automação de formulários</li>
<li>Processamento de documentos</li>
<li>Workflows automatizados</li>
</ul>
</div>
</div>
<div class="col-md-3 service-col">
<div class="service-card">
<div class="service-icon">
<i class="fas fa-sync-alt"></i>
</div>
<h4>Modernização de Sistemas</h4>
<div class="pricing-tier">Evolução Segura</div>
<p>Migre sistemas legados (ASP 3.0, VB6) para tecnologias modernas (.NET Core) mantendo funcionalidade e dados.</p>
<ul>
<li>ASP 3.0 → .NET Core</li>
<li>Migração de bancos de dados</li>
<li>Refatoração de código legado</li>
<li>Teste e validação completa</li>
</ul>
</div>
</div>
<div class="col-md-3 service-col">
<div class="service-card">
<div class="service-icon">
<i class="fas fa-brain"></i>
</div>
<h4>IA & Automação Inteligente</h4>
<div class="pricing-tier">Inovação Aplicada</div>
<p>Integre IA/RAG aos seus sistemas existentes para automação inteligente de documentos e atendimento.</p>
<ul>
<li>RAG para busca inteligente</li>
<li>Chatbots integrados</li>
<li>Processamento de documentos</li>
<li>Automação com IA</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- About-->
<section class="page-section" id="about">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Expertise Técnica</h2>
<h3 class="section-subheading text-muted">20+ anos conectando sistemas impossíveis - do microscópio digital ao SAP.</h3>
</div>
<ul class="timeline">
<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><rect width='100' height='100' fill='%23667eea'/><text x='50' y='55' text-anchor='middle' fill='white' font-size='20' font-family='Arial'>SAP</text></svg>" alt="SAP Integration" />
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>2010-2024</h4>
<h4 class="subheading">Integrações Enterprise</h4>
</div>
<div class="timeline-body">
<p class="text-muted">Integração C# ↔ SAP (UnitedHealth Group), Salesforce APIs, Facebook Graph API, sistemas legados. Especialização em conectar sistemas incompatíveis.</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><rect width='100' height='100' fill='%23667eea'/><text x='50' y='55' text-anchor='middle' fill='white' font-size='16' font-family='Arial'>AUTO</text></svg>" alt="Automação" />
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>2015-2024</h4>
<h4 class="subheading">Automação & Web Scraping</h4>
</div>
<div class="timeline-body">
<p class="text-muted">Desenvolvimento de robôs de automação com PuppeteerSharp, web scraping de sites complexos, automação de formulários e processamento de dados em larga escala.</p>
</div>
</div>
</li>
<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><rect width='100' height='100' fill='%23667eea'/><text x='50' y='55' text-anchor='middle' fill='white' font-size='14' font-family='Arial'>LEGACY</text></svg>" alt="Legacy Systems" />
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>2014</h4>
<h4 class="subheading">Modernização Sistemas Legados</h4>
</div>
<div class="timeline-body">
<p class="text-muted">Migração completa ASP 3.0 → ASP.NET MVC Core + SQL Server. Modernização de sistemas críticos mantendo 100% da funcionalidade e dados.</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><rect width='100' height='100' fill='%23667eea'/><text x='50' y='55' text-anchor='middle' fill='white' font-size='16' font-family='Arial'>IOT</text></svg>" alt="Hardware Integration" />
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>2008</h4>
<h4 class="subheading">Integração Hardware Especializado</h4>
</div>
<div class="timeline-body">
<p class="text-muted">Integração C# ↔ microscópio digital para laboratório. Controle de hardware especializado, captura de imagens e integração com sistema de laudos.</p>
</div>
</div>
</li>
<li>
<div class="timeline-image">
<h4>
Seu
<br />
Projeto
<br />
Aqui!
</h4>
</div>
</li>
</ul>
</div>
</section>
<!-- Contact-->
<section class="page-section bg-light" id="integracao">
<div class="container">
<div class="text-center">
<h3 class="section-subheading">Cases Reais de Integração</h3>
<p class="text-muted">Exemplos de projetos executados com sucesso:</p>
</div>
<div class="row text-center">
<div class="col-md-4">
<i class="fas fa-hospital fa-2x mb-3" style="color: #667eea;"></i>
<h5>UnitedHealth Group</h5>
<p><strong>Integração C# ↔ SAP</strong><br>Sistema de benefícios integrado com ERP corporativo</p>
</div>
<div class="col-md-4">
<i class="fas fa-microscope fa-2x mb-3" style="color: #667eea;"></i>
<h5>Laboratório Especializado</h5>
<p><strong>Hardware ↔ Sistema</strong><br>Microscópio digital integrado ao sistema de laudos</p>
</div>
<div class="col-md-4">
<i class="fas fa-chart-line fa-2x mb-3" style="color: #667eea;"></i>
<h5>Sistema Legado</h5>
<p><strong>ASP 3.0 → .NET Core</strong><br>Modernização completa mantendo funcionalidades</p>
</div>
</div>
</div>
</section>
<section class="page-section" id="contact">
<div class="row align-items-stretch">
<div class="col-lg-6">
<div class="d-flex flex-column justify-content-between h-100 text-center">
<div>
<h4 style="color: #667eea;">Especialista em Integrações</h4>
<p class="lead text-white">Ricardo Carneiro</p>
<p class="text-white">20+ anos desenvolvimento enterprise<br>
Especialista em Integrações de Sistemas<br>
São Bernardo do Campo, SP</p>
</div>
<div class="mt-auto">
<a href="https://www.linkedin.com/in/ricardo-carneiro" target="_blank" class="btn btn-outline-light me-3">
<i class="fab fa-linkedin-in me-2"></i>LinkedIn
</a>
<a id="btnEmail2" onclick="openEmail(); return false;" target="_blank" class="btn btn-outline-light me-3">
<i class="fas fa-envelope me-2"></i>E-mail
</a>
<a href="https://www.upwork.com/freelancers/~01aa5eed59c1535ac0?viewMode=1" target="_blank" class="btn btn-outline-light">
<i class="fas fa-globe me-2"></i>Upwork
</a>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="d-flex flex-column justify-content-between h-100 text-center">
<div>
<h4 style="color: #667eea;">Portfolio Técnico</h4>
<p class="text-white">Veja exemplos de integrações realizadas:</p>
</div>
<div class="mt-auto">
<a href="https://youtu.be/76MCfwDVXHE" target="_blank" class="btn btn-primary btn-lg">
<i class="fas fa-play me-2"></i>Ver Demonstrações
</a>
<div class="mt-4">
<p class="text-white"><small>SAP • Salesforce • Sistemas Legados • Automação<br>
C#/.NET • Azure • Microsserviços • APIs</small></p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer-->
<footer class="footer py-4">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-4 text-lg-start" style="color: white;">
Copyright &copy; 2024 JobMaker
</div>
<div class="col-lg-4 my-3 my-lg-0">
<a class="btn btn-dark btn-social mx-2" href="https://www.linkedin.com/in/ricardo-jobmaker" target="_blank">
<i class="fab fa-linkedin-in"></i>
</a>
<a class="btn btn-dark btn-social mx-2" id="btnEmail1" onclick="openEmail(); return false;" target="_blank">
<i class="fas fa-envelope"></i>
</a>
<a class="btn btn-dark btn-social mx-2" href="https://www.upwork.com/freelancers/ricardo-jobmaker" target="_blank">
<i class="fas fa-globe"></i>
</a>
</div>
<div class="col-lg-4 text-lg-end">
<span style="color: #adb5bd;">Ricardo Carneiro • Integrações & Automação • C#/.NET</span>
</div>
</div>
</div>
</footer>
<div class="modal fade" id="emailModal" tabindex="-1" aria-labelledby="emailModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content bg-dark text-light">
<div class="modal-header border-secondary">
<h5 class="modal-title" id="emailModalLabel">
<i class="fas fa-envelope me-2 text-primary"></i>Informações de Contato
</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="mb-6">
<label class="form-label fw-bold text-primary">
<i class="fas fa-at me-2"></i>Email:
</label>
<div class="input-group">
<input type="text" id="showEmail" class="form-control bg-secondary text-light border-secondary" id="emailAddress" readonly>
<button class="btn btn-outline-primary" type="button" onclick="copyEmail()">
<i class="fas fa-copy"></i>
</button>
</div>
</div>
</div>
<div class="modal-footer border-secondary">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Fechar</button>
<small class="text-muted">
<i class="fas fa-info-circle me-1"></i>
Se o cliente de email não abriu automaticamente, use as informações acima para entrar em contato.
</small>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- Core theme JS-->
<script src="js/scripts.js"></script>
<!-- WhatsApp Float Button -->
<a href="#" onclick="openWhatsApp()" class="whatsapp-float" title="WhatsApp">
<i class="fab fa-whatsapp"></i>
</a>
<!-- Bootstrap core JS-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Navbar shrink function
window.addEventListener('DOMContentLoaded', event => {
var navbarShrink = function () {
const navbarCollapsible = document.body.querySelector('#mainNav');
if (!navbarCollapsible) return;
if (window.scrollY === 0) {
navbarCollapsible.classList.remove('navbar-shrink')
} else {
navbarCollapsible.classList.add('navbar-shrink')
}
};
navbarShrink();
document.addEventListener('scroll', navbarShrink);
// Smooth scrolling
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
target.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
});
// Bootstrap ScrollSpy
const mainNav = document.body.querySelector('#mainNav');
if (mainNav) {
new bootstrap.ScrollSpy(document.body, {
target: '#mainNav',
rootMargin: '0px 0px -40%',
});
}
// Collapse responsive navbar when toggler is visible
const navbarToggler = document.body.querySelector('.navbar-toggler');
const responsiveNavItems = [].slice.call(
document.querySelectorAll('#navbarResponsive .nav-link')
);
responsiveNavItems.map(function (responsiveNavItem) {
responsiveNavItem.addEventListener('click', () => {
if (window.getComputedStyle(navbarToggler).display !== 'none') {
navbarToggler.click();
}
});
});
});
function openEmail() {
const parts = ['ricardo', '.carneiro', '@', 'jobmaker.com.br'];
const email = parts.join('');
const subject = 'Interesse em Integração de Sistemas';
const body = 'Olá,\n\nTenho interesse em saber mais sobre seus serviços de integração de sistemas e automação.\n\nAguardo seu contato.';
const mailto = `mailto:${email}?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
// Tenta abrir o cliente de email
const link = document.createElement('a');
link.href = mailto;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
const showText = document.getElementById('showEmail');
showText.setAttribute('value',email);
// Mostra o modal após 1.5 segundos
setTimeout(() => {
const modal = new bootstrap.Modal(document.getElementById('emailModal'));
modal.show();
}, 1500);
}
function openWhatsApp() {
const parts = ['5511', '9', '7079', '2602'];
const number = parts.join('');
const message = encodeURIComponent('Olá! Vi seu site e gostaria de conversar sobre integração de sistemas. Quando podemos agendar uma conversa?');
const url = `https://api.whatsapp.com/send?phone=${number}&text=${message}`;
window.open(url, '_blank');
}
function copyEmail() {
const emailField = document.getElementById('showEmail');
emailField.select();
emailField.setSelectionRange(0, 99999);
navigator.clipboard.writeText(emailField.value);
}
</script>
</body>
</html>