<!DOCTYPE html><html lang="pt" class="scroll-smooth"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="generator" content="Astro v5.18.1"><!-- Primary Meta --><title>iRoger.me</title><meta name="description" content="Rogério Chiavegatti — Technology Builder desde 1996. Arquitetura de sistemas, infraestrutura e decisões técnicas reais."><link rel="canonical" href="https://iroger.me/"><!-- Open Graph --><meta property="og:type" content="website"><meta property="og:url" content="https://iroger.me/"><meta property="og:title" content="iRoger.me"><meta property="og:description" content="Rogério Chiavegatti — Technology Builder desde 1996. Arquitetura de sistemas, infraestrutura e decisões técnicas reais."><meta property="og:image" content="https://iroger.me/og-default.png"><meta property="og:site_name" content="iRoger.me"><meta property="og:locale" content="pt_BR"><!-- Twitter --><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="iRoger.me"><meta name="twitter:description" content="Rogério Chiavegatti — Technology Builder desde 1996. Arquitetura de sistemas, infraestrutura e decisões técnicas reais."><meta name="twitter:image" content="https://iroger.me/og-default.png"><!-- Favicon --><link rel="icon" type="image/svg+xml" href="/favicon.svg"><link rel="apple-touch-icon" href="/apple-touch-icon.png"><!-- RSS --><link rel="alternate" type="application/rss+xml" title="iRoger.me" href="/rss.xml"><!-- Sitemap --><link rel="sitemap" href="/sitemap-index.xml"><!-- Analytics --><script defer src="https://umami.init4.io/script.js" data-website-id="130f6483-170a-4479-a149-2bca5edf2c20"></script><link rel="stylesheet" href="/_astro/_slug_.C82Ii500.css"></head> <body class="noise-bg min-h-screen flex flex-col"> <!-- WCAG 2.4.1 — Skip navigation link --> <a href="#main-content" class="skip-link">Ir para o conteúdo principal</a> <!-- ARIA landmark: banner --><header id="site-header" role="banner" class="fixed top-0 left-0 right-0 z-50 transition-all duration-300"> <div class="max-w-wide mx-auto px-6 h-16 flex items-center justify-between"> <!-- Logo --> <a href="/" class="flex items-center group" aria-label="iRoger.me — página inicial"> <img src="/brand-logo-white.svg" alt="iRoger.me" width="160" height="37" class="h-7 w-auto transition-opacity group-hover:opacity-70"> </a> <!-- Desktop navigation --> <nav aria-label="Navegação principal" class="hidden md:flex items-center gap-7"> <a href="/sobre" class="text-sm font-medium tracking-wide transition-colors duration-200 relative py-1 px-1 text-text-muted hover:text-text-primary"> sobre  </a><a href="/ecossistema" class="text-sm font-medium tracking-wide transition-colors duration-200 relative py-1 px-1 text-text-muted hover:text-text-primary"> ecossistema  </a><a href="/blog" class="text-sm font-medium tracking-wide transition-colors duration-200 relative py-1 px-1 text-text-muted hover:text-text-primary"> blog  </a><a href="/labs" class="text-sm font-medium tracking-wide transition-colors duration-200 relative py-1 px-1 text-text-muted hover:text-text-primary"> labs  </a><a href="/contato" class="text-sm font-medium tracking-wide transition-colors duration-200 relative py-1 px-1 text-text-muted hover:text-text-primary"> contato  </a> <!-- Language toggle --> <div class="flex items-center ml-2 border-l border-surface-border pl-4"> <a href="/en" class="text-xs font-mono text-text-muted hover:text-text-primary transition-colors px-2 py-2 min-w-[44px] text-center" lang="en" aria-label="Switch to English"> EN </a> </div> </nav> <!-- Mobile menu button — WCAG 2.5.8: min 44×44px touch target --> <button id="mobile-menu-btn" class="md:hidden flex flex-col justify-center items-center gap-1.5 w-11 h-11 -mr-2" aria-label="Abrir menu de navegação" aria-expanded="false" aria-controls="mobile-menu"> <span class="w-5 h-px bg-text-primary transition-all duration-200" aria-hidden="true"></span> <span class="w-5 h-px bg-text-primary transition-all duration-200" aria-hidden="true"></span> <span class="w-5 h-px bg-text-primary transition-all duration-200" aria-hidden="true"></span> </button> </div> <!-- Mobile menu --> <div id="mobile-menu" class="hidden md:hidden border-t border-surface-border bg-base/95 backdrop-blur-sm" role="dialog" aria-modal="false" aria-label="Menu de navegação"> <nav aria-label="Navegação mobile" class="max-w-wide mx-auto px-6 py-6 flex flex-col gap-1"> <a href="/sobre" class="text-base font-medium transition-colors py-3 border-b border-surface-border/50 text-text-secondary"> sobre </a><a href="/ecossistema" class="text-base font-medium transition-colors py-3 border-b border-surface-border/50 text-text-secondary"> ecossistema </a><a href="/blog" class="text-base font-medium transition-colors py-3 border-b border-surface-border/50 text-text-secondary"> blog </a><a href="/labs" class="text-base font-medium transition-colors py-3 border-b border-surface-border/50 text-text-secondary"> labs </a><a href="/contato" class="text-base font-medium transition-colors py-3 border-b border-surface-border/50 text-text-secondary"> contato </a> <div class="pt-4"> <a href="/en" lang="en" class="text-sm font-mono text-text-muted hover:text-text-primary transition-colors py-2 block"> View in English </a> </div> </nav> </div> </header> <script type="module">const e=document.getElementById("mobile-menu-btn"),t=document.getElementById("mobile-menu");e?.addEventListener("click",()=>{const n=t?.classList.toggle("hidden")===!1;e.setAttribute("aria-expanded",String(n)),e.setAttribute("aria-label",n?document.documentElement.lang==="pt"?"Fechar menu":"Close menu":document.documentElement.lang==="pt"?"Abrir menu de navegação":"Open navigation menu")});</script> <!-- ARIA landmark: main --> <main id="main-content" class="flex-1" tabindex="-1">   <section class="relative min-h-screen flex items-center pt-16 overflow-hidden"> <!-- Background grid --> <div class="absolute inset-0 pointer-events-none" aria-hidden="true"> <div class="absolute inset-0 opacity-[0.03]" style="background-image: linear-gradient(rgba(59,130,246,0.5) 1px, transparent 1px), linear-gradient(90deg, rgba(59,130,246,0.5) 1px, transparent 1px); background-size: 60px 60px;"></div> <!-- Gradient orb --> <div class="absolute top-1/3 right-1/4 w-[600px] h-[600px] rounded-full blur-[120px] opacity-[0.04]" style="background: radial-gradient(circle, #3B82F6, transparent)"></div> </div> <div class="max-w-wide mx-auto px-6 py-24 md:py-32 relative z-10"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center"> <!-- Left: Content --> <div> <!-- Overline --> <div class="flex items-center gap-3 mb-8 animate-on-scroll"> <span class="accent-line animate-line-grow"></span> <span class="text-xs font-mono text-accent uppercase tracking-widest"> Technology Builder desde 1996 </span> </div> <!-- Headline --> <h1 class="font-serif text-display text-text-primary mb-6 animate-on-scroll" style="animation-delay: 0.1s"> Rogério<br><em class="not-italic text-accent">Chiavegatti</em> </h1> <!-- Sub-headline --> <p class="text-lg md:text-xl text-text-secondary leading-relaxed max-w-[480px] mb-10 animate-on-scroll" style="animation-delay: 0.2s"> Sistemas reais, decisões reais — da infraestrutura e arquitetura à acessibilidade e estratégia de produto. </p> <!-- CTAs --> <div class="flex flex-wrap items-center gap-4 animate-on-scroll" style="animation-delay: 0.3s"> <a href="/blog" class="inline-flex items-center gap-2 px-5 py-2.5 bg-accent text-white text-sm font-medium hover:bg-accent-hover transition-colors"> Ler o blog <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1 7h12M7 1l6 6-6 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </a> <a href="/ecossistema" class="inline-flex items-center gap-2 px-5 py-2.5 border border-surface-border text-text-secondary text-sm font-medium hover:text-text-primary hover:border-text-muted transition-colors"> Ver ecossistema </a> </div> </div> <!-- Right: Terminal block with avatar --> <div class="hidden lg:block animate-on-scroll" style="animation-delay: 0.4s"> <div class="bg-surface border border-surface-border rounded-sm overflow-hidden"> <!-- Terminal bar with avatar --> <div class="flex items-center gap-2 px-4 py-3 border-b border-surface-border"> <div class="w-2.5 h-2.5 rounded-full bg-[#FF5F57]" aria-hidden="true"></div> <div class="w-2.5 h-2.5 rounded-full bg-[#FFBD2E]" aria-hidden="true"></div> <div class="w-2.5 h-2.5 rounded-full bg-[#28C840]" aria-hidden="true"></div> <span class="ml-2 text-xs font-mono text-text-muted flex-1">~/iroger.me</span> <img src="/avatar.jpg" alt="" aria-hidden="true" width="22" height="22" class="w-5 h-5 rounded-full object-cover object-top border border-surface-border"> </div> <!-- Terminal content --> <div class="p-6 font-mono text-sm leading-relaxed"> <div class="flex items-center gap-3 mb-5 pb-5 border-b border-surface-border"> <img src="/avatar.jpg" alt="Rogério Chiavegatti" width="48" height="48" class="w-12 h-12 rounded-full object-cover object-top border border-surface-border flex-shrink-0"> <div> <p class="text-text-primary text-sm font-medium">Rogério Chiavegatti</p> <p class="text-text-muted text-xs mt-0.5">Technology Builder · 1996 →</p> </div> </div> <p> <span class="text-text-muted">$</span> <span class="text-accent ml-2">whoami</span> </p> <p class="text-text-secondary mt-1 ml-4">rogério chiavegatti</p> <p class="mt-4"> <span class="text-text-muted">$</span> <span class="text-accent ml-2">cat experience.txt</span> </p> <p class="text-text-secondary mt-1 ml-4"> → 28+ anos construindo tecnologia </p> <p class="text-text-secondary mt-1 ml-4"> → Da infraestrutura e sistemas à IA aplicada </p> <p class="text-text-secondary ml-4"> → Fundador da INIT4 </p> <p class="text-text-secondary ml-4"> → Criador do sisteminhas.com </p> <p class="mt-4"> <span class="text-text-muted">$</span> <span class="text-accent ml-2">ls ./stack</span> </p> <p class="text-warm mt-1 ml-4 leading-loose"> 
infraestrutura / segurança / devops / isms<br>
sistemas / produtos / web / acessibilidade<br>
consultoria / estratégia
 </p> <p class="mt-4"> <span class="text-text-muted">$</span> <span class="text-accent ml-2 animate-pulse">_</span> </p> </div> </div> </div> </div> <!-- Scroll indicator --> <div class="absolute bottom-8 left-1/2 -translate-x-1/2 flex flex-col items-center gap-2 animate-bounce opacity-40"> <span class="text-xs font-mono text-text-muted">scroll</span> <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8 2v12M2 8l6 6 6-6" stroke="#A1A1AA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </div> </div> </section>  <section class="py-section px-6 border-t border-surface-border"> <div class="max-w-wide mx-auto"> <div class="flex items-center justify-between mb-12"> <div class="flex items-center gap-4"> <span class="accent-line"></span> <h2 class="font-serif text-2xl text-text-primary">
Últimos posts
</h2> </div> <a href="/blog" class="text-sm text-text-secondary hover:text-text-primary transition-colors flex items-center gap-1.5">
Ver todos
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1 6h10M6 1l5 5-5 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </a> </div> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"> <div class="animate-on-scroll col-span-full" style="transition-delay: 0s"> <article class="group"><a href="/blog/arquitetura-que-sobrevive" class="flex flex-col md:flex-row border border-surface-border hover:border-accent/30 hover:bg-surface/40 transition-all duration-300 overflow-hidden"><div class="md:w-64 lg:w-72 flex-shrink-0 bg-surface-raised p-6 flex flex-col justify-between gap-6 border-b md:border-b-0 md:border-r border-surface-border"><div><span class="text-xs font-mono text-accent uppercase tracking-widest block mb-4">— destaque</span><span class="text-xs font-mono text-text-muted uppercase tracking-wider block">Systems</span></div><div class="flex flex-col gap-3"><time datetime="2025-02-01T00:00:00.000Z" class="text-xs font-mono text-text-muted">1 de fev. de 2025</time><div class="flex flex-wrap gap-1.5"><span class="text-xs font-mono px-2 py-0.5 text-text-muted border border-surface-border">
#arquitetura</span><span class="text-xs font-mono px-2 py-0.5 text-text-muted border border-surface-border">
#sistemas</span><span class="text-xs font-mono px-2 py-0.5 text-text-muted border border-surface-border">
#decisoes</span></div></div></div><div class="flex-1 p-8 flex flex-col justify-between gap-6"><h2 class="font-serif text-headline text-text-primary group-hover:text-white transition-colors leading-tight">Arquitetura que sobrevive: decisões que não precisam ser refeitas</h2><div><p class="text-text-secondary leading-relaxed mb-6">As melhores decisões arquiteturais não são as mais inteligentes — são as que continuam certas quando o contexto muda.</p><span class="inline-flex items-center gap-2 text-sm text-accent">Ler post<svg width="14" height="14" viewBox="0 0 14 14" fill="none" class="transition-transform group-hover:translate-x-1"><path d="M1 7h12M7 1l6 6-6 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></span></div></div></a></article> </div><div class="animate-on-scroll" style="transition-delay: 0.1s"> <article class="group"><a href="/blog/isms-implementacao-real" class="flex flex-col p-6 border border-surface-border hover:border-accent/30 hover:bg-surface/50 transition-all duration-300 h-full"><span class="text-xs font-mono text-accent uppercase tracking-wider block mb-3">Systems</span><h2 class="font-serif text-title text-text-primary group-hover:text-white transition-colors mb-3 leading-snug">ISMS na prática: o que ninguém te conta na implementação</h2><p class="text-sm text-text-secondary leading-relaxed mb-5 flex-1">Implementar um Sistema de Gestão de Segurança da Informação de verdade é diferente do que a certificação te ensina. Aqui está o que aprendi no campo.</p><div class="flex items-center justify-between"><time datetime="2025-01-15T00:00:00.000Z" class="text-xs font-mono text-text-muted">15 de jan. de 2025</time><span class="text-accent text-xs flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">Ler<svg width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M1 5h8M5 1l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></span></div><div class="flex flex-wrap gap-1.5 mt-4 pt-4 border-t border-surface-border"><span class="text-xs font-mono px-2 py-0.5 text-text-muted border border-surface-border">
#isms</span><span class="text-xs font-mono px-2 py-0.5 text-text-muted border border-surface-border">
#seguranca</span><span class="text-xs font-mono px-2 py-0.5 text-text-muted border border-surface-border">
#iso27001</span></div></a></article> </div> </div> </div> </section> <section class="py-section px-6 border-t border-surface-border"> <div class="max-w-wide mx-auto"> <div class="flex items-center gap-4 mb-12 animate-on-scroll"> <span class="accent-line"></span> <h2 class="font-serif text-2xl text-text-primary">Ecossistema</h2> </div> <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> <div class="animate-on-scroll" style="transition-delay: 0.1s"> <article class="group"> <a href="https://init4.com.br" target="_blank" rel="noopener noreferrer" class="block p-8 border border-surface-border hover:border-accent/40 transition-all duration-300 hover:bg-surface/40 h-full"> <!-- Header --> <div class="flex items-start justify-between mb-6"> <div> <span class="text-xs font-mono text-accent uppercase tracking-widest block mb-2"> Consultoria </span> <h3 class="font-serif text-2xl text-text-primary group-hover:text-white transition-colors"> INIT4 </h3> </div> <div class="w-8 h-8 border border-surface-border flex items-center justify-center flex-shrink-0 group-hover:border-accent transition-colors mt-1"> <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="text-text-muted group-hover:text-accent transition-colors"> <path d="M1 11L11 1M11 1H3M11 1V9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </div> </div> <!-- Tagline --> <p class="text-base font-medium text-text-primary mb-3">Conformidade e segurança para a indústria audiovisual</p> <!-- Description --> <p class="text-sm text-text-secondary leading-relaxed mb-6">Consultoria especializada em TPN (Trusted Partner Network), segurança da informação e infraestrutura para estúdios e empresas que precisam atender aos padrões exigidos pela indústria cinematográfica.</p> <!-- Tags --> <div class="flex flex-wrap gap-2 pt-4 border-t border-surface-border"> <span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> TPN </span><span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> Segurança </span><span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> Pentest </span><span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> Observabilidade </span> </div> </a> </article> </div> <div class="animate-on-scroll" style="transition-delay: 0.2s"> <article class="group"> <a href="https://sisteminhas.com" target="_blank" rel="noopener noreferrer" class="block p-8 border border-surface-border hover:border-accent/40 transition-all duration-300 hover:bg-surface/40 h-full"> <!-- Header --> <div class="flex items-start justify-between mb-6"> <div> <span class="text-xs font-mono text-accent uppercase tracking-widest block mb-2"> Produto </span> <h3 class="font-serif text-2xl text-text-primary group-hover:text-white transition-colors"> Sisteminhas </h3> </div> <div class="w-8 h-8 border border-surface-border flex items-center justify-center flex-shrink-0 group-hover:border-accent transition-colors mt-1"> <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" class="text-text-muted group-hover:text-accent transition-colors"> <path d="M1 11L11 1M11 1H3M11 1V9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </div> </div> <!-- Tagline --> <p class="text-base font-medium text-text-primary mb-3">Software simples, direto e funcional</p> <!-- Description --> <p class="text-sm text-text-secondary leading-relaxed mb-6">Sistemas leves, práticos e sem complexidade desnecessária. Soluções pensadas para resolver problemas reais — muitas delas offline-first, sem dependência de assinaturas ou infraestrutura pesada.</p> <!-- Tags --> <div class="flex flex-wrap gap-2 pt-4 border-t border-surface-border"> <span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> Software </span><span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> Offline-first </span><span class="text-xs font-mono px-2 py-1 bg-surface-raised text-text-muted"> No SaaS </span> </div> </a> </article> </div> </div> <div class="mt-6 text-center animate-on-scroll" style="transition-delay: 0.3s"> <a href="/ecossistema" class="inline-flex items-center gap-2 text-sm text-text-secondary hover:text-text-primary transition-colors">
Ver ecossistema completo
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1 6h10M6 1l5 5-5 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </a> </div> </div> </section>  <section class="py-section px-6 border-t border-surface-border"> <div class="max-w-reading mx-auto"> <div class="animate-on-scroll"> <span class="text-xs font-mono text-accent uppercase tracking-widest block mb-6">sobre</span> <blockquote class="font-serif text-2xl md:text-3xl text-text-primary leading-[1.4] mb-8 text-balance">
"Estou na tecnologia desde 1996. Já passei por infraestrutura, segurança, sistemas, produtos e acessibilidade. No fim, o que importa é simples: fazer as coisas funcionarem de verdade."
</blockquote> <a href="/sobre" class="inline-flex items-center gap-2 text-sm text-text-secondary hover:text-text-primary transition-colors">
Conheça mais
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1 6h10M6 1l5 5-5 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </a> </div> </div> </section>  </main> <!-- ARIA landmark: contentinfo --> <footer class="border-t border-surface-border mt-auto"> <div class="max-w-wide mx-auto px-6 py-16"> <div class="grid grid-cols-1 md:grid-cols-4 gap-12 mb-16"> <!-- Identity --> <div class="md:col-span-1"> <a href="/" class="inline-block mb-4 group"> <img src="/brand-logo-white.svg" alt="iRoger.me" width="120" height="28" class="h-5 w-auto opacity-80 group-hover:opacity-100 transition-opacity"> </a> <p class="text-text-muted text-sm leading-relaxed mb-6"> Camada técnica e estratégica por trás da INIT4 e produtos relacionados. </p> <!-- Socials --> <div class="flex items-center gap-3"> <a href="https://www.linkedin.com/in/chiavegatti" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn" class="w-8 h-8 border border-surface-border flex items-center justify-center text-text-muted hover:text-text-primary hover:border-text-muted transition-colors"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" width="12" height="12" rx="2" stroke="currentColor" stroke-width="1.2"/><path d="M4 6v4M4 4.5v.01M7 10V7.5c0-.83.67-1.5 1.5-1.5S10 6.67 10 7.5V10M7 6v4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg></a><a href="https://x.com/iroger_me" target="_blank" rel="noopener noreferrer" aria-label="X / Twitter" class="w-8 h-8 border border-surface-border flex items-center justify-center text-text-muted hover:text-text-primary hover:border-text-muted transition-colors"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1.5l4.8 6.3L1 13h1.5l3.5-4 2.7 4H12l-5-6.6L12 1.5h-1.5L7 5.2 4.4 1.5H1Z" fill="currentColor"/></svg></a> </div> </div> <!-- Site Links --> <div> <p class="text-xs font-mono text-text-muted uppercase tracking-widest mb-4"> navegação </p> <ul class="flex flex-col gap-3"> <li> <a href="/sobre" class="text-sm text-text-secondary hover:text-text-primary transition-colors"> sobre </a> </li><li> <a href="/ecossistema" class="text-sm text-text-secondary hover:text-text-primary transition-colors"> ecossistema </a> </li><li> <a href="/blog" class="text-sm text-text-secondary hover:text-text-primary transition-colors"> blog </a> </li><li> <a href="/labs" class="text-sm text-text-secondary hover:text-text-primary transition-colors"> labs </a> </li><li> <a href="/contato" class="text-sm text-text-secondary hover:text-text-primary transition-colors"> contato </a> </li> </ul> </div> <!-- Ecosystem Links --> <div> <p class="text-xs font-mono text-text-muted uppercase tracking-widest mb-4"> ecossistema </p> <ul class="flex flex-col gap-3"> <li> <a href="https://init4.com.br" target="_blank" rel="noopener noreferrer" class="text-sm text-text-secondary hover:text-text-primary transition-colors flex items-center gap-1.5"> INIT4 <svg width="10" height="10" viewBox="0 0 10 10" fill="none" class="text-text-muted"> <path d="M1 9L9 1M9 1H3M9 1V7" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </a> </li><li> <a href="https://sisteminhas.com" target="_blank" rel="noopener noreferrer" class="text-sm text-text-secondary hover:text-text-primary transition-colors flex items-center gap-1.5"> Sisteminhas <svg width="10" height="10" viewBox="0 0 10 10" fill="none" class="text-text-muted"> <path d="M1 9L9 1M9 1H3M9 1V7" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"></path> </svg> </a> </li> </ul> </div> <!-- RSS + Lang --> <div> <p class="text-xs font-mono text-text-muted uppercase tracking-widest mb-4"> conteúdo </p> <ul class="flex flex-col gap-3"> <li> <a href="/rss.xml" class="text-sm text-text-secondary hover:text-text-primary transition-colors flex items-center gap-1.5">
RSS Feed
<svg width="10" height="10" viewBox="0 0 10 10" fill="currentColor" class="text-accent"> <circle cx="2" cy="8" r="1.5"></circle> <path d="M1 5.5C3.5 5.5 5.5 7.5 5.5 10" stroke="currentColor" stroke-width="1.2" fill="none" stroke-linecap="round"></path> <path d="M1 2C5.4 2 9 5.6 9 10" stroke="currentColor" stroke-width="1.2" fill="none" stroke-linecap="round"></path> </svg> </a> </li> <li> <a href="/en" class="text-sm text-text-secondary hover:text-text-primary transition-colors"> 🇺🇸 English </a> </li> </ul> </div> </div> <!-- Bottom bar --> <div class="border-t border-surface-border pt-8 flex flex-col md:flex-row items-start md:items-center justify-between gap-4"> <p class="text-xs font-mono text-text-muted">
© 2026 Rogério Chiavegatti
<span class="mx-2 opacity-30">·</span> Technology Builder desde 1996 </p> </div> </div> </footer> <script type="module">const o=document.getElementById("site-header");window.addEventListener("scroll",()=>{window.scrollY>20?o?.classList.add("header-scrolled"):o?.classList.remove("header-scrolled")},{passive:!0});const t=window.matchMedia("(prefers-reduced-motion: reduce)").matches;if(t)document.querySelectorAll(".animate-on-scroll").forEach(e=>{e.classList.add("visible")});else{const e=new IntersectionObserver(s=>{s.forEach(r=>{r.isIntersecting&&r.target.classList.add("visible")})},{threshold:.08,rootMargin:"0px 0px -40px 0px"});document.querySelectorAll(".animate-on-scroll").forEach(s=>{e.observe(s)})}</script> </body> </html>