diff --git a/referencia.md b/referencia.md
new file mode 100644
index 0000000..9a2c4cc
--- /dev/null
+++ b/referencia.md
@@ -0,0 +1,189 @@
+### 1. **Variáveis CSS (Cores, Sombra, etc.)**
+
+As variáveis são essenciais para a consistência do design e permitem que você altere rapidamente o estilo de toda a aplicação ao modificar o valor das variáveis. Algumas variáveis importantes que podem ser reutilizadas são:
+
+```css
+:root {
+  --azul-principal: #006494;
+  --azul-escuro: #003554;
+  --azul-claro: #0582ca;
+  --azul-brilhante: #00a6fb;
+  --amarelo: #ffb700;
+  --cinza-claro: #f8f9fa;
+  --cinza: #e9ecef;
+  --preto: #212529;
+  --branco: #ffffff;
+  --sombra: 0 4px 6px rgba(0, 0, 0, 0.1);
+  --borda-radius: 8px;
+  --transicao: all 0.3s ease;
+}
+```
+
+Essas cores e efeitos podem ser reutilizados para manter o design consistente.
+
+### 2. **Tipografia**
+
+Fontes e tamanhos de texto podem ser extraídos e usados em outros projetos. Por exemplo:
+
+```css
+body {
+  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+}
+```
+
+Você também tem diferentes tamanhos de fonte definidos nas regras de texto, como para o título de posts:
+
+```css
+.post-title {
+  font-size: 2.2rem;
+  color: var(--azul-escuro);
+}
+```
+
+### 3. **Layout Responsivo**
+
+Esse código já tem um design responsivo com várias quebras de mídia. Você pode utilizar os padrões de grid e as regras de `@media` para garantir que seu projeto seja adaptável a diferentes tamanhos de tela. Um exemplo é o layout de grade no `.grid-layout`:
+
+```css
+.grid-layout {
+  display: grid;
+  grid-template-columns: 250px 1fr;
+  gap: 30px;
+}
+```
+
+E a adaptação responsiva para telas menores:
+
+```css
+@media (max-width: 900px) {
+  .grid-layout {
+    display: block;
+  }
+}
+```
+
+### 4. **Estilos para Botões e Links**
+
+Estilos para botões (`btn-primario`) e links (`.nav-principal a`, `.ver-tudo`) estão bem definidos e podem ser reutilizados:
+
+```css
+.btn-primario {
+  background: var(--branco);
+  color: var(--azul-principal);
+  padding: 12px 25px;
+  border-radius: var(--borda-radius);
+  font-weight: 600;
+  text-decoration: none;
+  transition: var(--transicao);
+}
+
+.nav-principal a:hover:after {
+  width: 100%;
+}
+```
+
+Esses estilos garantem que o comportamento dos links e botões seja consistente, com efeitos de transição.
+
+### 5. **Efeitos de Sombra e Transição**
+
+As sombras e transições são definidos com variáveis e podem ser facilmente reutilizados:
+
+```css
+.sombra {
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+.sombra-hover {
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
+}
+```
+
+### 6. **Card Layouts (ex: Atalhos, Notícias)**
+
+O estilo de cards, como no caso dos atalhos e das notícias, é bastante modular e pode ser reutilizado em diversos projetos. Por exemplo:
+
+```css
+.atalho-card {
+  background: var(--branco);
+  border-radius: var(--borda-radius);
+  padding: 25px 15px;
+  text-align: center;
+  box-shadow: var(--sombra);
+  cursor: pointer;
+}
+
+.atalho-card:hover {
+  transform: translateY(-5px);
+  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
+}
+```
+
+### 7. **Estilos de Ícones**
+
+Estilos de ícones também são importantes, especialmente para se integrar com o Font Awesome:
+
+```css
+.atalho-card i {
+  font-size: 2rem;
+  color: var(--azul-principal);
+  margin-bottom: 15px;
+}
+```
+
+### 8. **Componentes de Cabeçalho e Rodapé**
+
+Esses componentes têm um estilo bem definido, com a possibilidade de facilmente aplicar em outros projetos:
+
+```css
+.header-moderno {
+  background: var(--branco);
+  box-shadow: var(--sombra);
+  position: sticky;
+  top: 0;
+  z-index: 100;
+}
+
+.footer-moderno {
+  background: var(--azul-escuro);
+  color: var(--branco);
+  padding: 50px 0 20px;
+}
+```
+
+### 9. **Animações**
+
+As animações, como o efeito `fadeIn`, são reutilizáveis e podem ser aplicadas a outros elementos:
+
+```css
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.noticia-card, .stats-card, .atalho-card {
+  animation: fadeIn 0.5s ease-out forwards;
+}
+```
+
+---
+
+### Resumo:
+
+Você pode reutilizar e adaptar os seguintes elementos para outros projetos:
+
+1. **Cores e Variáveis CSS** (cores principais, bordas, transições)
+2. **Fontes e Tipografia** (fontes, tamanhos de texto)
+3. **Layouts Responsivos** (uso de `@media` e grids)
+4. **Botões e Links** (estilos interativos e transições)
+5. **Sombreamento e Transições** (efeitos de sombra, hover)
+6. **Card Layouts** (para atalhos, notícias, etc.)
+7. **Ícones** (estilo e cores dos ícones)
+8. **Componentes de Cabeçalho e Rodapé** (design de cabeçalhos fixos e rodapés)
+9. **Animações** (efeitos de entrada, transições animadas)
+
+
diff --git a/style.css b/style.css
index b9e98c6..adc13e2 100644
--- a/style.css
+++ b/style.css
@@ -12,33 +12,21 @@ Tags: notícias, corporativo, responsivo, moderno
 */
 
 /* Variáveis CSS atualizadas */
+/* Variáveis baseadas no referencia.md */
 :root {
-    /* Sistema de cores renovado */
-    --primary: #2563eb;
-    --primary-dark: #1e40af;
-    --primary-light: #93c5fd;
-    --primary-extra-light: #eff6ff;
-    --secondary: #475569;
-    --secondary-dark: #334155;
-    --accent: #f59e0b;
-    --accent-dark: #d97706;
-    --success: #10b981;
-    --warning: #f59e0b;
-    --danger: #ef4444;
-    --info: #3b82f6;
-    
-    /* Escala de cinza refinada */
-    --white: #ffffff;
-    --gray-50: #f8fafc;
-    --gray-100: #f1f5f9;
-    --gray-200: #e2e8f0;
-    --gray-300: #cbd5e1;
-    --gray-400: #94a3b8;
-    --gray-500: #64748b;
-    --gray-600: #475569;
-    --gray-700: #334155;
-    --gray-800: #1e293b;
-    --gray-900: #0f172a;
+    --azul-principal: #006494;
+    --azul-escuro: #003554;
+    --azul-claro: #0582ca;
+    --azul-brilhante: #00a6fb;
+    --amarelo: #ffb700;
+    --cinza-claro: #f8f9fa;
+    --cinza: #e9ecef;
+    --preto: #212529;
+    --branco: #ffffff;
+    --sombra: 0 4px 6px rgba(0, 0, 0, 0.1);
+    --sombra-hover: 0 8px 24px rgba(0, 0, 0, 0.12);
+    --borda-radius: 8px;
+    --transicao: all 0.3s ease;
     
     /* Espaçamentos */
     --spacing-xs: 0.25rem;
@@ -48,23 +36,11 @@ Tags: notícias, corporativo, responsivo, moderno
     --spacing-xl: 3rem;
     --spacing-2xl: 4rem;
     --spacing-3xl: 6rem;
-    
-    /* Border radius */
-    --radius-sm: 0.375rem;
-    --radius-md: 0.5rem;
-    --radius-lg: 0.75rem;
-    --radius-xl: 1rem;
-    --radius-2xl: 1.5rem;
-    
-    /* Sombras */
-    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
-    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
-    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
-    
-    /* Transições */
-    --transition-base: all 0.3s ease;
-    --transition-smooth: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+
+    /* Mapeamento para nomes genéricos */
+    --primary: var(--azul-principal);
+    --primary-dark: var(--azul-escuro);
+    --primary-light: var(--azul-claro);
     
     /* Container */
     --container-width: 1280px;
@@ -89,21 +65,21 @@ html {
 body {
     font-family: var(--font-sans);
     font-size: 1rem;
-    line-height: 1.7;
-    color: var(--gray-800);
-    background-color: var(--gray-50);
+    line-height: 1.6;
+    color: var(--preto);
+    background-color: var(--cinza-claro);
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
 }
 
 a {
     text-decoration: none;
-    color: var(--primary);
-    transition: var(--transition-base);
+    color: var(--azul-principal);
+    transition: var(--transicao);
 }
 
 a:hover {
-    color: var(--primary-dark);
+    color: var(--azul-brilhante);
 }
 
 img {
@@ -122,7 +98,7 @@ h1, h2, h3, h4, h5, h6 {
     line-height: 1.2;
     margin-bottom: var(--spacing-md);
     letter-spacing: -0.01em;
-    color: var(--gray-900);
+    color: var(--azul-escuro);
 }
 
 h1 {
@@ -153,7 +129,7 @@ h6 {
 
 p {
     margin-bottom: var(--spacing-md);
-    color: var(--gray-700);
+    color: var(--preto);
 }
 
 /* Container */
@@ -169,12 +145,12 @@ p {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    padding: 0.875rem 1.75rem;
-    border-radius: var(--radius-md);
+    padding: 12px 25px;
+    border-radius: var(--borda-radius);
     font-weight: 600;
     text-align: center;
     cursor: pointer;
-    transition: var(--transition-base);
+    transition: var(--transicao);
     border: none;
     outline: none;
     gap: 0.5rem;
@@ -182,42 +158,42 @@ p {
 }
 
 .btn-primary {
-    background-color: var(--primary);
-    color: var(--white);
-    box-shadow: var(--shadow-md);
+    background-color: var(--azul-principal);
+    color: var(--branco);
+    box-shadow: var(--sombra);
 }
 
 .btn-primary:hover {
-    background-color: var(--primary-dark);
-    color: var(--white);
+    background-color: var(--azul-brilhante);
+    color: var(--branco);
     transform: translateY(-2px);
-    box-shadow: var(--shadow-lg);
+    box-shadow: var(--sombra-hover);
 }
 
 .btn-secondary {
-    background-color: var(--secondary);
-    color: var(--white);
-    box-shadow: var(--shadow-md);
+    background-color: var(--azul-escuro);
+    color: var(--branco);
+    box-shadow: var(--sombra);
 }
 
 .btn-secondary:hover {
-    background-color: var(--secondary-dark);
-    color: var(--white);
+    background-color: var(--azul-claro);
+    color: var(--branco);
     transform: translateY(-2px);
-    box-shadow: var(--shadow-lg);
+    box-shadow: var(--sombra-hover);
 }
 
 .btn-white {
-    background-color: var(--white);
-    color: var(--primary);
-    box-shadow: var(--shadow-md);
+    background-color: var(--branco);
+    color: var(--azul-principal);
+    box-shadow: var(--sombra);
 }
 
 .btn-white:hover {
-    background-color: var(--gray-50);
-    color: var(--primary-dark);
+    background-color: var(--cinza);
+    color: var(--azul-brilhante);
     transform: translateY(-2px);
-    box-shadow: var(--shadow-lg);
+    box-shadow: var(--sombra-hover);
 }
 
 /* Seções */
@@ -236,21 +212,21 @@ p {
     transform: translateX(-50%);
     width: 80px;
     height: 4px;
-    background: linear-gradient(90deg, var(--primary), var(--accent));
+    background: linear-gradient(90deg, var(--azul-principal), var(--amarelo));
     border-radius: 2px;
 }
 
 /* Header */
 .site-header {
-    box-shadow: var(--shadow-md);
+    box-shadow: var(--sombra);
     position: relative;
     z-index: 100;
-    background: var(--white);
+    background: var(--branco);
 }
 
 .top-bar {
-    background-color: var(--gray-800);
-    color: var(--gray-300);
+    background-color: var(--azul-escuro);
+    color: var(--cinza);
     padding: var(--spacing-sm) 0;
     font-size: 0.875rem;
 }
@@ -269,15 +245,15 @@ p {
 }
 
 .top-bar-contact a {
-    color: var(--gray-300);
+    color: var(--cinza);
     display: flex;
     align-items: center;
     gap: var(--spacing-xs);
-    transition: var(--transition-base);
+    transition: var(--transicao);
 }
 
 .top-bar-contact a:hover {
-    color: var(--white);
+    color: var(--branco);
 }
 
 .top-bar-social {
@@ -286,12 +262,12 @@ p {
 }
 
 .top-bar-social a {
-    color: var(--gray-300);
-    transition: var(--transition-base);
+    color: var(--cinza);
+    transition: var(--transicao);
 }
 
 .top-bar-social a:hover {
-    color: var(--white);
+    color: var(--branco);
     transform: translateY(-2px);
 }
 
@@ -323,7 +299,7 @@ p {
 .site-title {
     font-size: 1.75rem;
     margin-bottom: 0;
-    color: var(--primary);
+    color: var(--azul-principal);
 }
 
 .site-title a {
@@ -332,7 +308,7 @@ p {
 
 .site-description {
     font-size: 0.875rem;
-    color: var(--gray-500);
+    color: var(--preto);
     margin-bottom: 0;
 }
 
@@ -346,15 +322,15 @@ p {
     background: none;
     border: none;
     font-size: 1.5rem;
-    color: var(--gray-700);
+    color: var(--azul-escuro);
     cursor: pointer;
     padding: var(--spacing-xs);
-    border-radius: var(--radius-sm);
-    transition: var(--transition-base);
+    border-radius: var(--borda-radius);
+    transition: var(--transicao);
 }
 
 .menu-toggle:hover {
-    background-color: var(--gray-100);
+    background-color: var(--cinza);
 }
 
 .primary-menu {
@@ -363,19 +339,19 @@ p {
 }
 
 .primary-menu a {
-    color: var(--gray-700);
+    color: var(--azul-escuro);
     font-weight: 500;
     position: relative;
     padding: var(--spacing-xs) 0;
-    transition: var(--transition-base);
+    transition: var(--transicao);
 }
 
 .primary-menu a:hover {
-    color: var(--primary);
+    color: var(--azul-principal);
 }
 
 .primary-menu .current-menu-item a {
-    color: var(--primary);
+    color: var(--azul-principal);
     font-weight: 600;
 }
 
@@ -386,14 +362,14 @@ p {
     left: 0;
     width: 100%;
     height: 2px;
-    background-color: var(--primary);
+    background-color: var(--azul-brilhante);
     border-radius: 1px;
 }
 
 /* Hero Section */
 .hero-section {
-    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
-    color: var(--white);
+    background: linear-gradient(135deg, var(--azul-principal) 0%, var(--azul-escuro) 100%);
+    color: var(--branco);
     padding: var(--spacing-3xl) 0;
     position: relative;
     overflow: hidden;
@@ -421,13 +397,13 @@ p {
     font-size: 3.5rem;
     line-height: 1.1;
     margin-bottom: var(--spacing-lg);
-    color: var(--white);
+    color: var(--branco);
 }
 
 .hero-content p {
     font-size: 1.25rem;
     margin-bottom: var(--spacing-xl);
-    color: var(--gray-100);
+    color: var(--cinza);
     opacity: 0.9;
 }
 
@@ -439,9 +415,9 @@ p {
 
 /* Quick Access Buttons */
 .quick-access {
-    background-color: var(--white);
+    background-color: var(--branco);
     padding: var(--spacing-xl) 0;
-    box-shadow: var(--shadow-md);
+    box-shadow: var(--sombra);
     position: relative;
     z-index: 10;
 }
@@ -457,18 +433,18 @@ p {
     flex-direction: column;
     align-items: center;
     padding: var(--spacing-lg);
-    background: var(--white);
-    border-radius: var(--radius-lg);
-    box-shadow: var(--shadow-md);
-    transition: var(--transition-base);
+    background: var(--branco);
+    border-radius: var(--borda-radius);
+    box-shadow: var(--sombra);
+    transition: var(--transicao);
     text-align: center;
-    border: 1px solid var(--gray-100);
+    border: 1px solid var(--cinza);
 }
 
 .quick-access-button:hover {
     transform: translateY(-4px);
-    box-shadow: var(--shadow-lg);
-    border-color: var(--primary-light);
+    box-shadow: var(--sombra-hover);
+    border-color: var(--azul-claro);
 }
 
 .quick-access-icon {
@@ -477,10 +453,10 @@ p {
     display: flex;
     align-items: center;
     justify-content: center;
-    background: var(--primary-extra-light);
-    border-radius: var(--radius-xl);
+    background: rgba(0, 100, 148, 0.1);
+    border-radius: var(--borda-radius);
     margin-bottom: var(--spacing-md);
-    color: var(--primary);
+    color: var(--azul-principal);
     font-size: 1.5rem;
 }
 
@@ -488,11 +464,11 @@ p {
     font-size: 1.25rem;
     font-weight: 600;
     margin-bottom: var(--spacing-sm);
-    color: var(--gray-800);
+    color: var(--azul-escuro);
 }
 
 .quick-access-description {
-    color: var(--gray-600);
+    color: var(--preto);
     margin-bottom: var(--spacing-md);
     font-size: 0.95rem;
 }
@@ -500,7 +476,7 @@ p {
 /* Featured News */
 .featured-news {
     padding: var(--spacing-3xl) 0;
-    background-color: var(--gray-50);
+    background-color: var(--cinza-claro);
 }
 
 .featured-news-container {
@@ -517,11 +493,11 @@ p {
 }
 
 .featured-news-item {
-    background: var(--white);
-    border-radius: var(--radius-xl);
+    background: var(--branco);
+    border-radius: var(--borda-radius);
     overflow: hidden;
-    box-shadow: var(--shadow-lg);
-    transition: var(--transition-base);
+    box-shadow: var(--sombra);
+    transition: var(--transicao);
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: var(--spacing-lg);
@@ -529,7 +505,7 @@ p {
 
 .featured-news-item:hover {
     transform: translateY(-4px);
-    box-shadow: var(--shadow-xl);
+    box-shadow: var(--sombra-hover);
 }
 
 .featured-thumbnail {
@@ -541,7 +517,7 @@ p {
     width: 100%;
     height: 100%;
     object-fit: cover;
-    transition: var(--transition-smooth);
+    transition: all 0.5s ease;
 }
 
 .featured-news-item:hover .featured-thumbnail img {
@@ -552,10 +528,10 @@ p {
     position: absolute;
     top: var(--spacing-md);
     left: var(--spacing-md);
-    background: var(--accent);
-    color: var(--white);
+    background: var(--amarelo);
+    color: var(--azul-escuro);
     padding: 0.5rem 1rem;
-    border-radius: var(--radius-md);
+    border-radius: var(--borda-radius);
     font-size: 0.875rem;
     font-weight: 600;
     text-transform: uppercase;
@@ -580,16 +556,16 @@ p {
 }
 
 .featured-title a {
-    color: var(--gray-900);
-    transition: var(--transition-base);
+    color: var(--azul-escuro);
+    transition: var(--transicao);
 }
 
 .featured-title a:hover {
-    color: var(--primary);
+    color: var(--azul-brilhante);
 }
 
 .featured-excerpt {
-    color: var(--gray-600);
+    color: var(--preto);
     margin-bottom: var(--spacing-lg);
     line-height: 1.6;
 }
@@ -609,33 +585,29 @@ p {
 }
 
 .sidebar-widget {
-    background: var(--white);
-    border-radius: var(--radius-lg);
+    background: var(--branco);
+    border-radius: var(--borda-radius);
     padding: var(--spacing-lg);
-    box-shadow: var(--shadow-sm);
-    border: 1px solid var(--gray-200);
-    transition: var(--transition-base);
+    box-shadow: var(--sombra);
+    border: 1px solid var(--cinza);
+    transition: var(--transicao);
 }
 
 .sidebar-widget:hover {
-    box-shadow: var(--shadow-lg);
+    box-shadow: var(--sombra-hover);
 }
 
 .widget-title {
     font-size: 1.5rem;
     padding-bottom: var(--spacing-sm);
-    border-bottom: 1px solid var(--gray-200);
-    color: var(--gray-800);
+    border-bottom: 1px solid var(--cinza);
+    color: var(--azul-escuro);
 }
 
 /* Calendário Widget */
-.calendar-widget {
-    background: linear-gradient(145deg, var(--white) 0%, var(--gray-50) 100%);
-    border: 1px solid var(--gray-200);
-}
 
 .calendar-container {
-    border-radius: var(--radius-lg);
+    border-radius: var(--borda-radius);
     overflow: hidden;
 }
 
@@ -650,17 +622,17 @@ p {
     display: flex;
     gap: var(--spacing-md);
     padding: var(--spacing-lg);
-    background: var(--gray-50);
-    border-radius: var(--radius-lg);
-    transition: var(--transition-base);
-    border: 1px solid var(--gray-200);
+    background: var(--cinza-claro);
+    border-radius: var(--borda-radius);
+    transition: var(--transicao);
+    border: 1px solid var(--cinza);
 }
 
 .event-item:hover {
-    background: var(--white);
+    background: var(--branco);
     transform: translateY(-4px);
-    box-shadow: var(--shadow-lg);
-    border-color: var(--primary-light);
+    box-shadow: var(--sombra-hover);
+    border-color: var(--azul-claro);
 }
 
 .event-date {
@@ -669,9 +641,9 @@ p {
     align-items: center;
     justify-content: center;
     min-width: 60px;
-    background: var(--primary-extra-light);
-    color: var(--primary-dark);
-    border-radius: var(--radius-md);
+    background: rgba(0, 100, 148, 0.1);
+    color: var(--azul-escuro);
+    border-radius: var(--borda-radius);
     padding: var(--spacing-sm);
     text-align: center;
 }
@@ -696,12 +668,12 @@ p {
     font-size: 1.1rem;
     font-weight: 600;
     margin-bottom: var(--spacing-xs);
-    color: var(--gray-800);
+    color: var(--azul-escuro);
 }
 
 .event-time {
     font-size: 0.875rem;
-    color: var(--gray-600);
+    color: var(--preto);
     display: flex;
     align-items: center;
     gap: var(--spacing-xs);
@@ -710,7 +682,7 @@ p {
 /* Latest News */
 .latest-news {
     padding: var(--spacing-3xl) 0;
-    background: var(--white);
+    background: var(--branco);
 }
 
 .news-grid {
@@ -721,19 +693,19 @@ p {
 }
 
 .news-card {
-    background: var(--white);
-    border-radius: var(--radius-lg);
+    background: var(--branco);
+    border-radius: var(--borda-radius);
     overflow: hidden;
-    box-shadow: var(--shadow-sm);
-    transition: var(--transition-base);
+    box-shadow: var(--sombra);
+    transition: var(--transicao);
     display: flex;
     flex-direction: column;
-    border: 1px solid var(--gray-200);
+    border: 1px solid var(--cinza);
 }
 
 .news-card:hover {
     transform: translateY(-2px);
-    box-shadow: var(--shadow-lg);
+    box-shadow: var(--sombra-hover);
 }
 
 .news-thumbnail {
@@ -746,7 +718,7 @@ p {
     width: 100%;
     height: 100%;
     object-fit: cover;
-    transition: var(--transition-smooth);
+    transition: all 0.5s ease;
 }
 
 .news-card:hover .news-thumbnail img {
@@ -771,19 +743,19 @@ p {
 }
 
 .news-title a {
-    color: var(--gray-900);
-    transition: var(--transition-base);
+    color: var(--azul-escuro);
+    transition: var(--transicao);
 }
 
 .news-title a:hover {
-    color: var(--primary);
+    color: var(--azul-brilhante);
 }
 
 .news-meta {
     display: flex;
     gap: var(--spacing-md);
     font-size: 0.875rem;
-    color: var(--gray-500);
+    color: var(--azul-claro);
 }
 
 .news-meta span {
@@ -792,13 +764,6 @@ p {
     gap: var(--spacing-xs);
 }
 
-.news-excerpt {
-    color: var(--gray-600);
-    margin-bottom: var(--spacing-lg);
-    line-height: 1.6;
-    flex: 1;
-}
-
 .news-footer {
     margin-top: auto;
 }
@@ -809,10 +774,10 @@ p {
 
 /* Footer */
 .site-footer {
-    background: var(--gray-900);
-    color: var(--gray-400);
+    background: var(--azul-escuro);
+    color: var(--cinza);
     padding: var(--spacing-3xl) 0 var(--spacing-xl);
-    margin-top: var(--spacing-3xl); /* Adiciona espaço acima do rodapé */
+    margin-top: var(--spacing-3xl);
 }
 
 .footer-widgets {
@@ -828,7 +793,7 @@ p {
 }
 
 .footer-widget-title {
-    color: var(--white);
+    color: var(--branco);
     font-size: 1.25rem;
     margin-bottom: var(--spacing-lg);
     position: relative;
@@ -842,7 +807,7 @@ p {
     left: 0;
     width: 40px;
     height: 2px;
-    background: var(--primary);
+    background: var(--azul-brilhante);
 }
 
 .footer-menu {
@@ -852,15 +817,15 @@ p {
 }
 
 .footer-menu a {
-    color: var(--gray-400);
-    transition: var(--transition-base);
+    color: var(--cinza);
+    transition: var(--transicao);
     display: flex;
     align-items: center;
     gap: var(--spacing-xs);
 }
 
 .footer-menu a:hover {
-    color: var(--primary-light);
+    color: var(--branco);
     transform: translateX(4px);
 }
 
@@ -874,7 +839,7 @@ p {
     display: flex;
     align-items: center;
     gap: var(--spacing-md);
-    color: var(--gray-400);
+    color: var(--cinza);
 }
 
 .footer-contact-icon {
@@ -883,17 +848,17 @@ p {
     display: flex;
     align-items: center;
     justify-content: center;
-    background: var(--gray-800);
-    border-radius: var(--radius-md);
-    color: var(--primary);
+    background: var(--azul-principal);
+    border-radius: var(--borda-radius);
+    color: var(--branco);
     flex-shrink: 0;
 }
 
 .footer-bottom {
-    border-top: 1px solid var(--gray-800);
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
     padding-top: var(--spacing-xl);
     text-align: center;
-    color: var(--gray-500);
+    color: var(--cinza);
     font-size: 0.875rem;
 }
 
@@ -912,9 +877,9 @@ p {
 .post-content-area {
     max-width: 840px;
     margin: 0 auto var(--spacing-2xl) auto;
-    background: var(--white);
-    border-radius: var(--radius-xl);
-    box-shadow: var(--shadow-lg);
+    background: var(--branco);
+    border-radius: var(--borda-radius);
+    box-shadow: var(--sombra);
     overflow: hidden;
 }
 
@@ -940,25 +905,25 @@ p {
 
 .post-category {
     display: inline-block;
-    background: var(--primary-extra-light);
-    color: var(--primary);
+    background: var(--azul-claro);
+    color: var(--branco);
     padding: 0.5rem 1.25rem;
     border-radius: 999px;
     font-size: 0.875rem;
     font-weight: 600;
     margin-bottom: var(--spacing-md);
-    transition: var(--transition-base);
+    transition: var(--transicao);
 }
 
 .post-category:hover {
-    background: var(--primary-light);
-    color: var(--primary-dark);
+    background: var(--azul-brilhante);
+    transform: translateY(-2px);
 }
 
 .entry-title {
     font-size: 2.75rem;
     line-height: 1.2;
-    color: var(--gray-900);
+    color: var(--preto);
     margin-bottom: var(--spacing-lg);
 }
 
@@ -967,7 +932,7 @@ p {
     justify-content: center;
     gap: var(--spacing-lg);
     font-size: 0.9rem;
-    color: var(--gray-500);
+    color: var(--azul-principal);
 }
 
 .post-meta span {
@@ -979,7 +944,7 @@ p {
 .entry-content {
     font-size: 1.1rem;
     line-height: 1.8;
-    color: var(--gray-800);
+    color: var(--azul-escuro);
 }
 
 .entry-content p {
@@ -993,7 +958,7 @@ p {
     margin-top: 2em;
     margin-bottom: 1em;
     line-height: 1.3;
-    color: var(--gray-900);
+    color: var(--azul-escuro);
 }
 
 .entry-content ul,
@@ -1007,18 +972,18 @@ p {
 }
 
 .entry-content blockquote {
-    border-left: 4px solid var(--primary);
+    border-left: 4px solid var(--azul-principal);
     padding-left: 1.5em;
     margin: 2em 0;
     font-style: italic;
     font-size: 1.2rem;
-    color: var(--gray-600);
+    color: var(--preto);
 }
 
 .entry-footer {
     margin-top: var(--spacing-2xl);
-    padding-top: var(--spacing-lg);
-    border-top: 1px solid var(--gray-200);
+    padding-top: var(--spacing-xl);
+    border-top: 1px solid var(--cinza-claro);
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -1032,23 +997,23 @@ p {
 
 .post-tags .tags-label {
     font-weight: 600;
-    color: var(--gray-800);
+    color: var(--preto);
     margin-right: var(--spacing-sm);
 }
 
 .post-tags a {
     display: inline-block;
-    background: var(--gray-100);
-    color: var(--gray-700);
+    background: var(--cinza-claro);
+    color: var(--azul-principal);
     padding: 0.3rem 0.8rem;
-    border-radius: var(--radius-sm);
+    border-radius: var(--borda-radius);
     margin: 0.2rem;
-    transition: var(--transition-base);
+    transition: var(--transicao);
 }
 
 .post-tags a:hover {
-    background: var(--primary);
-    color: var(--white);
+    background: var(--azul-principal);
+    color: var(--branco);
 }
 
 .post-share {
@@ -1059,7 +1024,7 @@ p {
 
 .share-label {
     font-weight: 600;
-    color: var(--gray-800);
+    color: var(--preto);
     font-size: 0.9rem;
 }
 
@@ -1075,9 +1040,9 @@ p {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    color: var(--white);
+    color: var(--branco);
     font-size: 1rem;
-    transition: var(--transition-base);
+    transition: var(--transicao);
     border: none;
     cursor: pointer;
 }
@@ -1091,7 +1056,7 @@ p {
 .share-btn.twitter { background: #1DA1F2; }
 .share-btn.linkedin { background: #0A66C2; }
 .share-btn.whatsapp { background: #25D366; }
-.share-btn.print-btn { background: var(--secondary); }
+.share-btn.print-btn { background: var(--preto); }
 
 /* Post Navigation */
 .post-navigation-container {
@@ -1119,26 +1084,26 @@ p {
     display: flex;
     flex-direction: column;
     padding: var(--spacing-lg);
-    border: 1px solid var(--gray-200);
-    border-radius: var(--radius-lg);
-    background: var(--white);
-    box-shadow: var(--shadow-sm);
-    transition: var(--transition-base);
+    border: 1px solid var(--cinza);
+    border-radius: var(--borda-radius);
+    background: var(--branco);
+    box-shadow: var(--sombra);
+    transition: var(--transicao);
     width: 100%;
 }
 
 .nav-previous a:hover,
 .nav-next a:hover {
     transform: translateY(-4px);
-    box-shadow: var(--shadow-md);
-    border-color: var(--primary-light);
-    color: var(--primary);
+    box-shadow: var(--sombra-hover);
+    border-color: var(--azul-claro);
+    color: var(--azul-principal);
 }
 
 .nav-subtitle {
     font-size: 0.875rem;
     font-weight: 500;
-    color: var(--gray-500);
+    color: var(--azul-principal);
     margin-bottom: var(--spacing-sm);
     display: flex;
     align-items: center;
@@ -1147,7 +1112,7 @@ p {
 
 .nav-title {
     font-weight: 600;
-    color: var(--gray-800);
+    color: var(--preto);
 }
 
 /* Responsividade */
@@ -1185,10 +1150,10 @@ p {
         top: 100%;
         left: 0;
         right: 0;
-        background: var(--white);
+        background: var(--branco);
         flex-direction: column;
         padding: var(--spacing-lg);
-        box-shadow: var(--shadow-lg);
+        box-shadow: var(--sombra);
         gap: var(--spacing-md);
     }