diff --git a/src/views/components/retrospective-slides.tsx b/src/views/components/retrospective-slides.tsx
index 9bfea94..b78342e 100644
--- a/src/views/components/retrospective-slides.tsx
+++ b/src/views/components/retrospective-slides.tsx
@@ -4,7 +4,7 @@ import {
 } from '@/app/hooks/useMetrics';
 import logoAImg from '@/assets/images/a-agape.png';
 import logoImg from '@/assets/images/agape-logo.png';
-import { BuildingIcon, ClockIcon, SpinnerIcon } from '@phosphor-icons/react';
+import { BuildingIcon, ChartLineUpIcon, ClockIcon, SpinnerIcon } from '@phosphor-icons/react';
 import { motion } from 'framer-motion';
 import * as React from 'react';
 import { useSearchParams } from 'react-router-dom';
@@ -149,235 +149,263 @@ export function RetrospectiveSlides() {
             </StorySlide>
 
             {metricsPortal && metricsPortal.length > 0 && (
-              <StorySlide className="bg-linear-to-br from-slate-50 to-blue-50">
-                <div className="flex flex-col items-center justify-center h-full space-y-16">
-                  <motion.div
-                    initial={{ scale: 0 }}
-                    whileInView={{ scale: 1 }}
-                    viewport={{ once: true }}
-                    transition={{ type: 'spring', duration: 0.6 }}>
-                    <BuildingIcon className="h-20 w-20 text-[#145190]" />
-                  </motion.div>
-
-                  <div className="text-center space-y-8 max-w-4xl px-6">
-                    <motion.div
-                      initial={{ opacity: 0, y: 20 }}
-                      whileInView={{ opacity: 1, y: 0 }}
-                      viewport={{ once: true }}
-                      transition={{ duration: 0.6 }}>
-                      <p className="text-2xl md:text-3xl font-light text-[#0e233d]">
-                        Você acessou
-                      </p>
-                    </motion.div>
-
-                    <motion.div
-                      className="space-y-4"
-                      initial={{ opacity: 0, scale: 0.8 }}
-                      whileInView={{ opacity: 1, scale: 1 }}
-                      viewport={{ once: true }}
-                      transition={{
-                        type: 'spring',
-                        duration: 0.8,
-                        delay: 0.2,
-                      }}>
-                      <div className="text-6xl md:text-8xl font-bold text-[#145190]">
-                        {metricsPortal
-                          .reduce((acc, p) => acc + p.totalAcessos, 0)
-                          .toLocaleString('pt-BR')}
-                      </div>
-                      <p className="text-3xl md:text-4xl font-semibold text-[#0e233d]">
-                        vezes
-                      </p>
-                    </motion.div>
-
-                    <motion.div
-                      initial={{ opacity: 0, y: 20 }}
-                      whileInView={{ opacity: 1, y: 0 }}
-                      viewport={{ once: true }}
-                      transition={{ duration: 0.6, delay: 0.4 }}>
-                      <p className="text-2xl md:text-3xl font-light text-[#0e233d]">
-                        o{' '}
-                        <span className="font-bold text-[#145190]">
-                          {metricsPortal[0]?.nomeSistema || 'Portal'}
-                        </span>
-                      </p>
-                      <p className="text-xl md:text-2xl font-light text-[#0e233d] mt-2">
-                        durante o ano de {ano}
-                      </p>
-                    </motion.div>
-
-                    <motion.div
-                      className="pt-8"
-                      initial={{ opacity: 0 }}
-                      whileInView={{ opacity: 1 }}
-                      viewport={{ once: true }}
-                      transition={{ duration: 0.6, delay: 0.6 }}>
-                      <div className="flex items-center justify-center gap-2">
-                        {[...Array(3)].map((_, i) => (
-                          <motion.span
-                            key={i}
-                            className="h-2 w-2 bg-[#145190] rounded-full"
-                            animate={{ scale: [1, 1.2, 1] }}
-                            transition={{
-                              duration: 1.5,
-                              repeat: Infinity,
-                              delay: i * 0.2,
-                            }}
-                          />
-                        ))}
-                      </div>
-                    </motion.div>
-                  </div>
-                </div>
-              </StorySlide>
-            )}
-
-            {topItems.length > 0 && (
               <StorySlide className="bg-linear-to-br from-[#0e233d] via-[#173b63] to-[#145190] text-white overflow-hidden">
                 <div className="flex flex-col md:flex-row items-center justify-between h-full px-6 py-8 md:py-12 md:px-8">
-                  {/* Coluna esquerda - Título e informações */}
+                  {/* Coluna esquerda - Ícone e números principais */}
                   <motion.div
                     className="md:w-2/5 flex flex-col items-center md:items-start mb-8 md:mb-0 md:pr-8"
                     initial={{ opacity: 0, x: -30 }}
                     whileInView={{ opacity: 1, x: 0 }}
                     viewport={{ once: true }}
                     transition={{ duration: 0.6 }}>
+                    {/* Ícone com efeito */}
                     <motion.div
                       initial={{ scale: 0 }}
                       whileInView={{ scale: 1 }}
                       viewport={{ once: true }}
                       transition={{ type: 'spring', duration: 0.6 }}
                       className="mb-6 md:mb-8">
-                      <ClockIcon className="h-14 w-14 md:h-16 md:w-16 text-yellow-300" />
+                      <div className="relative">
+                        <div className="absolute inset-0 bg-white/20 rounded-full blur-lg animate-pulse"></div>
+                        <BuildingIcon className="h-14 w-14 md:h-16 md:w-16 text-white drop-shadow-lg relative z-10" />
+                      </div>
                     </motion.div>
 
+                    {/* Título */}
                     <motion.h2
-                      className="text-3xl md:text-4xl lg:text-5xl font-bold text-center md:text-left mb-6 md:mb-8"
+                      className="text-2xl md:text-3xl lg:text-4xl font-bold text-center md:text-left mb-4"
                       initial={{ opacity: 0, y: -20 }}
                       whileInView={{ opacity: 1, y: 0 }}
                       viewport={{ once: true }}
                       transition={{ duration: 0.6, delay: 0.1 }}>
-                      Seus Aplicativos Favoritos
+                      Portal Corporativo
                     </motion.h2>
 
                     <motion.p
-                      className="text-lg md:text-xl text-white/80 text-center md:text-left mb-6"
+                      className="text-base md:text-lg text-white/80 text-center md:text-left mb-6"
                       initial={{ opacity: 0 }}
                       whileInView={{ opacity: 1 }}
                       viewport={{ once: true }}
                       transition={{ duration: 0.6, delay: 0.2 }}>
-                      Os sistemas mais acessados em {ano}
+                      A porta de entrada para todas as aplicações
                     </motion.p>
 
+                    {/* Número principal */}
                     <motion.div
-                      className="mt-6 md:mt-auto p-6 rounded-xl backdrop-blur-sm bg-white/10 border border-white/20 w-full"
+                      className="space-y-3 mb-6"
+                      initial={{ opacity: 0, scale: 0.8 }}
+                      whileInView={{ opacity: 1, scale: 1 }}
+                      viewport={{ once: true }}
+                      transition={{ duration: 0.8, delay: 0.4 }}>
+                      <div className="text-5xl md:text-6xl lg:text-7xl font-black text-white tracking-tighter">
+                        {metricsPortal
+                          .reduce((acc, p) => acc + p.totalAcessos, 0)
+                          .toLocaleString('pt-BR')}
+                      </div>
+                      <p className="text-xl md:text-2xl font-semibold text-blue-200">
+                        acessos em {ano}
+                      </p>
+                    </motion.div>
+
+                    {/* Estatísticas rápidas */}
+                    <motion.div
+                      className="mt-4 md:mt-auto w-full"
                       initial={{ opacity: 0 }}
                       whileInView={{ opacity: 1 }}
                       viewport={{ once: true }}
-                      transition={{ duration: 0.6, delay: 0.8 }}>
-                      <div className="text-center md:text-left">
-                        <p className="text-4xl md:text-5xl font-bold text-yellow-300 mb-2">
-                          {totalAcessos.toLocaleString('pt-BR')}
-                        </p>
-                        <p className="text-white/70 text-sm md:text-base">
-                          acessos totais no ano
-                        </p>
+                      transition={{ duration: 0.6, delay: 0.6 }}>
+                      <div className="grid grid-cols-3 gap-3">
+                        <div className="bg-white/10 backdrop-blur-sm rounded-lg p-3 border border-white/20 text-center">
+                          <div className="text-lg font-bold text-white mb-1">
+                            {Math.round(
+                              metricsPortal.reduce(
+                                (acc, p) => acc + p.totalAcessos,
+                                0,
+                              ) / 365,
+                            )}
+                          </div>
+                          <div className="text-xs text-blue-100 opacity-90">
+                            Por dia
+                          </div>
+                        </div>
+
+                        <div className="bg-white/10 backdrop-blur-sm rounded-lg p-3 border border-white/20 text-center">
+                          <div className="text-lg font-bold text-white mb-1">
+                            {Math.round(
+                              metricsPortal.reduce(
+                                (acc, p) => acc + p.totalAcessos,
+                                0,
+                              ) / 12,
+                            ).toLocaleString('pt-BR')}
+                          </div>
+                          <div className="text-xs text-blue-100 opacity-90">
+                            Por mês
+                          </div>
+                        </div>
+
+                        <div className="bg-white/10 backdrop-blur-sm rounded-lg p-3 border border-white/20 text-center">
+                          <div className="text-lg font-bold text-white mb-1">
+                            {Math.round(
+                              metricsPortal.reduce(
+                                (acc, p) => acc + p.totalAcessos,
+                                0,
+                              ) / 2920,
+                            )}
+                          </div>
+                          <div className="text-xs text-blue-100 opacity-90">
+                            Por hora*
+                          </div>
+                        </div>
                       </div>
                     </motion.div>
                   </motion.div>
 
-                  {/* Coluna direita - Lista vertical compacta */}
+                  {/* Coluna direita - Sistemas mais acessados (mantendo seu design) */}
                   <div className="md:w-3/5 h-full flex items-center">
-                    <div className="w-full grid grid-cols-1 gap-3 md:gap-4 max-h-full">
-                      {topItems.slice(0, 6).map((item, index) => {
-                        const medalColors = [
-                          'bg-yellow-400 text-yellow-900',
-                          'bg-gray-300 text-gray-900',
-                          'bg-orange-400 text-orange-900',
-                          'bg-blue-400/20 text-blue-300',
-                          'bg-purple-400/20 text-purple-300',
-                          'bg-green-400/20 text-green-300',
-                        ];
-                        const isMedal = index < 3;
-                        const medalColor = medalColors[index] || 'bg-white/20';
+                    <div className="w-full">
+                      <motion.div
+                        className="mb-6 text-center md:text-left"
+                        initial={{ opacity: 0, y: 20 }}
+                        whileInView={{ opacity: 1, y: 0 }}
+                        viewport={{ once: true }}
+                        transition={{ duration: 0.6 }}>
+                        <div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-white/10 backdrop-blur-sm border border-white/20 mb-2">
+                          <ChartLineUpIcon  className="h-4 w-4 text-yellow-300" />
+                          <span className="text-sm font-semibold text-white">
+                            Aplicativos Mais Acessados
+                          </span>
+                        </div>
+                        <p className="text-base text-white/70">
+                          Os sistemas que mais acessaram o portal
+                        </p>
+                      </motion.div>
 
-                        return (
-                          <motion.div
-                            key={index}
-                            className={`flex items-center p-4 md:p-5 rounded-xl backdrop-blur-sm border border-white/20 ${
-                              isMedal
-                                ? 'bg-white/15'
-                                : 'bg-white/10 hover:bg-white/15'
-                            } transition-all`}
-                            initial={{ x: 50, opacity: 0 }}
-                            whileInView={{ x: 0, opacity: 1 }}
-                            viewport={{ once: true }}
-                            transition={{
-                              duration: 0.5,
-                              delay: index * 0.1,
-                            }}>
-                            <div
-                              className={`w-10 h-10 md:w-12 md:h-12 rounded-full flex items-center justify-center font-bold text-base md:text-lg mr-4 ${medalColor}`}>
-                              {index === 0 && '🥇'}
-                              {index === 1 && '🥈'}
-                              {index === 2 && '🥉'}
-                              {index >= 3 && `#${index + 1}`}
-                            </div>
-
-                            <div className="flex-1 min-w-0">
-                              <p className="text-base md:text-lg font-semibold truncate">
-                                {item.nomeSistema}
-                              </p>
-                              <p className="text-sm text-white/70">
-                                {item.totalAcessos.toLocaleString('pt-BR')}{' '}
-                                acessos
-                              </p>
-                            </div>
+                      {/* Lista de sistemas */}
+                      <div className="w-full grid grid-cols-1 gap-3 md:gap-4 max-h-full">
+                        {topItems.slice(0, 6).map((item, index) => {
+                          const medalColors = [
+                            'bg-yellow-400 text-yellow-900',
+                            'bg-gray-300 text-gray-900',
+                            'bg-orange-400 text-orange-900',
+                            'bg-blue-400/20 text-blue-300',
+                            'bg-purple-400/20 text-purple-300',
+                            'bg-green-400/20 text-green-300',
+                          ];
+                          const isMedal = index < 3;
+                          const medalColor =
+                            medalColors[index] || 'bg-white/20';
 
+                          return (
                             <motion.div
-                              className="ml-4 flex flex-col items-end"
-                              initial={{ scale: 0 }}
-                              whileInView={{ scale: 1 }}
+                              key={index}
+                              className={`flex items-center p-4 md:p-5 rounded-xl backdrop-blur-sm border border-white/20 ${
+                                isMedal
+                                  ? 'bg-white/15'
+                                  : 'bg-white/10 hover:bg-white/15'
+                              } transition-all`}
+                              initial={{ x: 50, opacity: 0 }}
+                              whileInView={{ x: 0, opacity: 1 }}
                               viewport={{ once: true }}
                               transition={{
-                                type: 'spring',
-                                delay: index * 0.1 + 0.2,
+                                duration: 0.5,
+                                delay: index * 0.1,
                               }}>
-                              <p className="text-xl md:text-2xl font-bold text-yellow-300 mb-1">
-                                {(
-                                  (item.totalAcessos /
-                                    (topItems[0]?.totalAcessos || 1)) *
-                                  100
-                                ).toFixed(0)}
-                                %
-                              </p>
-                              <div className="w-24 md:w-32 h-1.5 bg-white/20 rounded-full overflow-hidden">
-                                <motion.div
-                                  className="h-full bg-yellow-400 rounded-full"
-                                  initial={{ width: 0 }}
-                                  whileInView={{
-                                    width: `${
-                                      (item.totalAcessos /
-                                        (topItems[0]?.totalAcessos || 1)) *
-                                      100
-                                    }%`,
-                                  }}
-                                  viewport={{ once: true }}
-                                  transition={{
-                                    duration: 1,
-                                    delay: index * 0.1 + 0.3,
-                                  }}
-                                />
+                              <div
+                                className={`w-10 h-10 md:w-12 md:h-12 rounded-full flex items-center justify-center font-bold text-base md:text-lg mr-4 ${medalColor}`}>
+                                {index === 0 && '🥇'}
+                                {index === 1 && '🥈'}
+                                {index === 2 && '🥉'}
+                                {index >= 3 && `#${index + 1}`}
                               </div>
+
+                              <div className="flex-1 min-w-0">
+                                <p className="text-base md:text-lg font-semibold truncate">
+                                  {item.nomeSistema}
+                                </p>
+                                <p className="text-sm text-white/70">
+                                  {item.totalAcessos.toLocaleString('pt-BR')}{' '}
+                                  acessos
+                                </p>
+                              </div>
+
+                              <motion.div
+                                className="ml-4 flex flex-col items-end"
+                                initial={{ scale: 0 }}
+                                whileInView={{ scale: 1 }}
+                                viewport={{ once: true }}
+                                transition={{
+                                  type: 'spring',
+                                  delay: index * 0.1 + 0.2,
+                                }}>
+                                <p className="text-xl md:text-2xl font-bold text-yellow-300 mb-1">
+                                  {(
+                                    (item.totalAcessos /
+                                      (topItems[0]?.totalAcessos || 1)) *
+                                    100
+                                  ).toFixed(0)}
+                                  %
+                                </p>
+                                <div className="w-24 md:w-32 h-1.5 bg-white/20 rounded-full overflow-hidden">
+                                  <motion.div
+                                    className="h-full bg-yellow-400 rounded-full"
+                                    initial={{ width: 0 }}
+                                    whileInView={{
+                                      width: `${
+                                        (item.totalAcessos /
+                                          (topItems[0]?.totalAcessos || 1)) *
+                                        100
+                                      }%`,
+                                    }}
+                                    viewport={{ once: true }}
+                                    transition={{
+                                      duration: 1,
+                                      delay: index * 0.1 + 0.3,
+                                    }}
+                                  />
+                                </div>
+                              </motion.div>
                             </motion.div>
-                          </motion.div>
-                        );
-                      })}
+                          );
+                        })}
+                      </div>
+
+                      {/* Indicador de progresso */}
+                      <motion.div
+                        className="pt-4"
+                        initial={{ opacity: 0 }}
+                        whileInView={{ opacity: 1 }}
+                        viewport={{ once: true }}
+                        transition={{ duration: 0.6, delay: 0.8 }}>
+                        <div className="flex flex-col items-center gap-2">
+                          <div className="text-xs text-blue-200 font-medium">
+                            Próxima análise
+                          </div>
+                          <div className="flex items-center gap-2">
+                            {[...Array(3)].map((_, i) => (
+                              <motion.div
+                                key={i}
+                                className="h-1.5 w-1.5 rounded-full bg-white/60"
+                                animate={{
+                                  opacity: [0.3, 1, 0.3],
+                                  scale: [1, 1.2, 1],
+                                }}
+                                transition={{
+                                  duration: 1.5,
+                                  repeat: Infinity,
+                                  delay: i * 0.2,
+                                }}
+                              />
+                            ))}
+                          </div>
+                        </div>
+                      </motion.div>
                     </div>
                   </div>
                 </div>
               </StorySlide>
             )}
+
+          
             <StorySlide className="bg-linear-to-br from-slate-50 to-blue-50">
               <div className="h-full flex flex-col md:flex-row items-center justify-center px-6 gap-12 py-12">
                 <div className="space-y-8 w-full md:w-1/2 text-center md:text-left">