diff --git a/app/category/page.tsx b/app/category/page.tsx
new file mode 100644
index 0000000..04bea7f
--- /dev/null
+++ b/app/category/page.tsx
@@ -0,0 +1,524 @@
+"use client";
+import React, { useState } from 'react';
+import Image from 'next/image';
+import { ThumbsUp, MessageCircle, Send, Share2, LinkIcon, Link2, ChevronRight } from 'lucide-react';
+import { TvoneAdBanner, TvoneFooter } from '../components/tvone-content';
+import { TvonePromoStrip } from '../components/tvone-promo-strip';
+import { TvoneSiteNav } from '../components/tvone-site-nav';
+import { SiWhatsapp, SiFacebook, SiX } from 'react-icons/si'; // Ícones oficiais de marca
+import { FiCopy } from 'react-icons/fi'; // Ícone de cópia mais limpo
+import Link from 'next/link';
+import { Users } from 'lucide-react';
+import { v4 as uuidv4 } from 'uuid';
+
+export default function NewsArticlePage() {
+  // Estado para controlar o play do vídeo customizado
+  const [isPlaying, setIsPlaying] = useState(false);
+  const recentes = [
+    {
+      cat: "EM FOCO",
+      readTime: "6",
+      catBg: "bg-pink-100 text-pink-700",
+      title: "Governo anuncia medidas para apoiar famílias e pequenas empresas.",
+      excerpt: "Pacote inclui linhas de crédito e simplificação de procedimentos.",
+      byline: "Por Redação",
+      date: "24 Mar 2025",
+      img: "https://images.unsplash.com/photo-1507679799987-c73779587ccf?w=200&q=80",
+    },
+    {
+      cat: "ECONOMIA",
+      readTime: "6",
+      catBg: "bg-amber-100 text-amber-800",
+      title: "Inflação desce pelo terceiro mês consecutivo, segundo dados preliminares.",
+      excerpt: "Analistas mantêm cautela face ao cenário internacional.",
+      byline: "Por Economia",
+      date: "24 Mar 2025",
+      img: "https://images.unsplash.com/photo-1611974789855-9c2a0a7236a3?w=200&q=80",
+    },
+    {
+      cat: "CULTURA",
+      readTime: "6",
+      catBg: "bg-violet-100 text-violet-800",
+      title: "Museu inaugura exposição com obras inéditas de artistas locais.",
+      excerpt: "Visitas guiadas e programa educativo arrancam no próximo fim de semana.",
+      byline: "Por Cultura",
+      date: "23 Mar 2025",
+      img: "https://images.unsplash.com/photo-1507679799987-c73779587ccf?w=200&q=80",
+    },
+    {
+      cat: "SAÚDE",
+      readTime: "6",
+      catBg: "bg-emerald-100 text-emerald-800",
+      title: "Campanha de vacinação alarga faixas etárias em todo o país.",
+      excerpt: "Autoridades de saúde reforçam importância da adesão às janelas recomendadas.",
+      byline: "Por Saúde",
+      date: "23 Mar 2025",
+      img: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1d?w=200&q=80",
+    },
+  ];
+
+  const destaques = [
+    {
+      id: uuidv4(),
+      cat: "FAMOSOS",
+      catColor: "text-pink-600",
+      title: "Cerimónia reúne estrelas nacionais e internacionais em Lisboa.",
+      date: "24 Mar 2025",
+      // High-quality video-style thumbnail
+      img: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80",
+    },
+    {
+      id: uuidv4(),
+      cat: "NEGÓCIOS",
+      catColor: "text-[#0066cc]",
+      title: "Mercados reagem às novas projeções de crescimento para a região.",
+      date: "24 Mar 2025",
+      img: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800&q=80",
+    },
+    {
+      id: uuidv4(),
+      cat: "DESPORTO",
+      catColor: "text-emerald-600",
+      title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.",
+      date: "23 Mar 2025",
+      img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=800&q=80",
+    },
+    {
+        id: uuidv4(),
+        cat: "NEGÓCIOS",
+        catColor: "text-[#0066cc]",
+        title: "Mercados reagem às novas projeções de crescimento para a região.",
+        date: "24 Mar 2025",
+        img: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800&q=80",
+    },
+    {
+        id: uuidv4(),
+        cat: "FAMOSOS",
+        catColor: "text-pink-600",
+        title: "Cerimónia reúne estrelas nacionais e internacionais em Lisboa.",
+        date: "24 Mar 2025",
+        // High-quality video-style thumbnail
+        img: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80",
+      },
+      {
+        id: uuidv4(),
+        cat: "NEGÓCIOS",
+        catColor: "text-[#0066cc]",
+        title: "Mercados reagem às novas projeções de crescimento para a região.",
+        date: "24 Mar 2025",
+        img: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800&q=80",
+      },
+      {
+        id: uuidv4(),
+        cat: "DESPORTO",
+        catColor: "text-emerald-600",
+        title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.",
+        date: "23 Mar 2025",
+        img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=800&q=80",
+      },
+      {
+          id: uuidv4(),
+          cat: "NEGÓCIOS",
+          catColor: "text-[#0066cc]",
+          title: "Mercados reagem às novas projeções de crescimento para a região.",
+          date: "24 Mar 2025",
+          img: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800&q=80",
+      },
+      {
+        id: uuidv4(),
+        cat: "FAMOSOS",
+        catColor: "text-pink-600",
+        title: "Cerimónia reúne estrelas nacionais e internacionais em Lisboa.",
+        date: "24 Mar 2025",
+        // High-quality video-style thumbnail
+        img: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80",
+      },
+      {
+        id: uuidv4(),
+        cat: "NEGÓCIOS",
+        catColor: "text-[#0066cc]",
+        title: "Mercados reagem às novas projeções de crescimento para a região.",
+        date: "24 Mar 2025",
+        img: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800&q=80",
+      },
+      {
+        id: uuidv4(),
+        cat: "DESPORTO",
+        catColor: "text-emerald-600",
+        title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.",
+        date: "23 Mar 2025",
+        img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=800&q=80",
+      },
+      {
+          id: uuidv4(),
+          cat: "NEGÓCIOS",
+          catColor: "text-[#0066cc]",
+          title: "Mercados reagem às novas projeções de crescimento para a região.",
+          date: "24 Mar 2025",
+          img: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800&q=80",
+      },
+    ];
+  
+  return (
+    <div className="min-h-screen bg-white font-sans text-[#1d1d1f] selection:bg-[#0066CC]/20">
+      <TvonePromoStrip />
+      <TvoneSiteNav />
+
+      <main className="mx-auto max-w-[1240px] px-6 py-12">
+        <div className="flex flex-col gap-16 lg:flex-row lg:items-start">
+          
+     
+          {/* --- COLUNA PRINCIPAL (ARTIGO) --- */}
+          <article className="flex-1 min-w-0"> 
+            <div className="mb-10 flex items-end justify-between border-b border-neutral-100 pb-6">
+                <div className="max-w-[600px]">
+                <h2 className="text-3xl font-bold tracking-tight text-neutral-900 md:text-4xl">
+                    Noticias Recentes
+                </h2>
+                <p className="mt-2 text-sm md:text-base text-neutral-500 leading-relaxed">
+                    Conversas exclusivas com as personalidades que movem o mercado, a tecnologia e a cultura em Angola.
+                </p>
+                </div>
+            </div>
+
+
+
+        <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-2">
+            {destaques.map((item, index) => (
+            <article
+                key={item.id}
+                className="group cursor-pointer bg-white transition"
+            >
+                <Link href="#" className="block">
+                <div className="relative aspect-[16/9] w-full overflow-hidden rounded-2xl bg-neutral-100 shadow-sm transition-all duration-300 group-hover:shadow-xl group-hover:shadow-neutral-200">
+                    <Image
+                    src={item.img}
+                    alt=""
+                    fill
+                    className="object-cover transition duration-500 group-hover:scale-105"
+                    sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 25vw"
+                    />
+                    
+                    <div className="absolute inset-0 flex flex-col items-center justify-center bg-black/10 opacity-0 transition-opacity duration-300 group-hover:opacity-100">
+                    <div className="flex h-12 w-12 items-center justify-center rounded-full bg-white/30 backdrop-blur-md border border-white/40">
+                        <svg className="h-5 w-5 text-white" fill="currentColor" viewBox="0 0 20 20">
+                        <path d="M6.3 2.841A1.5 1.5 0 004 4.11V15.89a1.5 1.5 0 002.3 1.269l9.344-5.89a1.5 1.5 0 000-2.538L6.3 2.841z" />
+                        </svg>
+                    </div>
+                    </div>
+                </div>
+
+                <div className="py-4">
+                    <h3 className="line-clamp-2 text-base font-bold leading-snug text-neutral-900 transition-colors group-hover:text-blue-600">
+                    {item.title}
+                    </h3>
+                    <p className="mt-1.5 text-xs font-medium text-neutral-500">{item.date}</p>
+                </div>
+                </Link>
+            </article>
+            ))}
+        </div>
+
+          </article>
+
+          {/* --- SIDEBAR REFINADA --- */}
+
+          {/* --- SIDEBAR REFINADA COM SOCIAL SHARE --- */}
+
+          <aside className="w-full lg:w-[340px]  flex flex-col justify-center align-center items-center shrink-0">
+            <div className="sticky top-10 space-y-10 max-w-[400px]">
+
+            <div className="bg-white p-5 rounded-xl border border-neutral-100 shadow-[0_2px_15px_rgba(0,0,0,0.03)]">
+              
+              {/* 1. Header: Adapted from your Share component */}
+              <div className="flex items-center gap-2 mb-4">
+                {/* Usando Users icon for Community */}
+                <Users size={15} className="text-neutral-400" />
+                <h3 className="text-[11px] font-bold text-neutral-400 uppercase tracking-widest">
+                  Community
+                </h3>
+              </div>
+              
+              {/* 2. Main Content Area: Simplified from the UI mockup */}
+              <div className="flex flex-col gap-5">
+                
+                {/* Column for Brand and Button */}
+                <div className="flex flex-col gap-4">
+                  
+                  {/* Brand Info */}
+                  {/* Brand Info - A highly stylized placeholder that looks 'premium' */}
+                  {/* Brand Info - FIXED to use your actual logo image */}
+                  <div className="flex items-center gap-3">
+                    {/* 1. Use Next/Image for your official icon */}
+                    <div className="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl overflow-hidden shadow-inner border border-neutral-100">
+                      <Image 
+                        src="/logo.png"  // <-- UPDATE THIS PATH to your square logo
+                        alt="TVone Icon Logo"
+                        width={48} // Width in pixels (matches h-12/w-12 class)
+                        height={48} // Height in pixels
+                        className="object-contain" // Ensures the logo doesn't stretch
+                      />
+                    </div>
+                    
+                    {/* 2. Brand text matches previous styling */}
+                    <div>
+                      <p className="text-sm font-bold text-neutral-900 leading-tight">TVone</p>
+                      <p className="text-[11px] font-medium text-neutral-500">500k seguidores</p>
+                    </div>
+                  </div>
+                  
+                  {/* Main Action Button */}
+                  <button className="flex h-11 w-full items-center justify-center gap-2.5 rounded-lg bg-[#1877F2] text-white font-semibold text-sm transition-all hover:bg-[#166fe5] active:scale-95 shadow-sm">
+              
+                    <SiFacebook size={16} />
+                    Gosto da TVone
+                  </button>
+                </div>
+
+              </div>
+            </div>
+                          
+            {/* 1. SEÇÃO DE SHARE (ESTILO APPLE NEWS) */}
+            {/* <div className="bg-white p-5 rounded-xl border border-neutral-100 shadow-[0_2px_15px_rgba(0,0,0,0.03)]">
+              <div className="flex items-center gap-2 mb-4">
+                <Share2 size={15} className="text-neutral-400" />
+                <h3 className="text-[11px] font-bold text-neutral-400 uppercase tracking-widest">
+                  Compartilhar
+                </h3>
+              </div>
+              
+              <div className="grid grid-cols-4 gap-3">
+                
+         
+                <button className="group flex flex-col items-center gap-2">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-full bg-neutral-100 text-neutral-600 transition-all group-hover:bg-neutral-200 active:scale-95">
+                    <SiWhatsapp size={20} />
+                  </div>
+                  <span className="text-[10px] font-medium text-neutral-500">WhatsApp</span>
+                </button>
+
+        
+                <button className="group flex flex-col items-center gap-2">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-full bg-neutral-100 text-neutral-600 transition-all group-hover:bg-neutral-200 active:scale-95">
+                    <SiFacebook size={20} />
+                  </div>
+                  <span className="text-[10px] font-medium text-neutral-500">Facebook</span>
+                </button>
+
+             
+                <button className="group flex flex-col items-center gap-2">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-full bg-neutral-100 text-neutral-600 transition-all group-hover:bg-neutral-200 active:scale-95">
+                    <SiX size={18} />
+                  </div>
+                  <span className="text-[10px] font-medium text-neutral-500">Twitter</span>
+                </button>
+
+    
+                <button className="group flex flex-col items-center gap-2">
+                  <div className="flex h-12 w-12 items-center justify-center rounded-full bg-neutral-100 text-neutral-600 transition-all group-hover:bg-neutral-200 active:scale-95">
+                    <Link2 size={20} />
+                  </div>
+                  <span className="text-[10px] font-medium text-neutral-500">Link</span>
+                </button>
+
+              </div>
+            </div> */}
+
+              {/* 2. ADVERTORIAL (CEO UNITEL) - REPLACING TV CARD */}
+              <div className="group cursor-pointer">
+                <div className="flex items-center justify-between mb-3 px-1">
+                  <span className="text-[10px] font-bold text-neutral-400 uppercase">Publicidade</span>
+                </div>
+                
+                <div className="relative aspect-[4/5] w-full overflow-hidden rounded-xl bg-neutral-100 shadow-sm transition-shadow">
+                  <Image 
+                    src="/zap.jpeg" // Substitua pelo path real da imagem do print
+                    alt="CEO da Unitel - O futuro do 5G em Angola"
+                    fill
+                    unoptimized
+                    className="object-contain"
+                  />
+                  {/* Overlay de gradiente para legibilidade do texto se estiver na imagem */}
+                  {/* <div className="absolute inset-0 bg-gradient-to-t from-black/80 via-transparent to-transparent opacity-60" /> */}
+                  
+                  {/* <div className="absolute bottom-6 left-6 right-6">
+                    <span className="text-[10px] font-bold text-[#007AFF] uppercase tracking-widest">CEO DA UNITEL</span>
+                    <h4 className="text-white text-xl font-bold mt-2 leading-tight">
+                      "ro do 5G em Angola e a expansão da conectividade rural"
+                    </h4>
+                  </div> */}
+                </div>
+                
+                {/* <div className="mt-4 px-1">
+                  <div className="flex items-center text-[13px] font-bold text-[#007AFF]">
+                    Ler entrevista completa <ChevronRight size={14} className="ml-1" />
+                  </div>
+                </div> */}
+              </div>
+
+              <div className="flex items-center justify-between mb-3 px-1">
+                <span className="text-[10px] font-bold text-neutral-400 uppercase">Publicidade</span>
+              </div>
+
+              {/* 3. PREMIUM SUBSCRIPTION - APPLE STYLE */}
+              <div className="bg-black p-7 rounded-xl relative overflow-hidden text-white shadow-xl">
+                <div className="relative z-10">
+                  <h4 className="text-[20px] font-bold leading-tight tracking-tight mb-2">
+                    Assine o Premium.
+                  </h4>
+                  <p className="text-[13px] text-[#8E8E93] font-medium mb-6">
+                    Acesso ilimitado às notícias e análises exclusivas.
+                  </p>
+                  
+                  <button className="flex w-full items-center justify-center gap-2 rounded-xl bg-white py-3 text-black font-bold text-[15px] transition-all hover:bg-neutral-100 active:scale-95">
+                    <svg viewBox="0 0 384 512" className="h-4 w-4 fill-black">
+                      <path d="M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"/>
+                    </svg>
+                    <span>Pay</span>
+                  </button>
+                </div>
+                {/* Sutil glow de fundo */}
+                <div className="absolute top-0 right-0 w-32 h-32 bg-blue-600/20 blur-[40px]" />
+              </div>
+
+
+
+              <div className="px-1">
+                <div className="flex items-center justify-between mb-4 border-b border-neutral-100 pb-2">
+                  <h3 className="text-[13px] font-bold text-black uppercase tracking-tight">Mais Lidas</h3>
+                  <span className="text-[11px] font-medium text-neutral-400">Últimas 24h</span>
+                </div>
+                
+                <div className="space-y-4">
+                  {[
+                    { id: "01", title: "Câmbio: Kwanza mantém trajetória de estabilidade frente ao Dólar", cat: "Economia" },
+                    { id: "02", title: "Novas infraestruturas no Porto de Luanda aumentam eficiência", cat: "Logística" },
+                    { id: "03", title: "Selecção Nacional prepara amistoso contra Marrocos", cat: "Desporto" }
+                  ].map((news) => (
+                    <div key={news.id} className="group cursor-pointer flex align-start justify-start gap-4 text-black">
+                      <span className="text-2xl font-black text-black group-hover:text-blue transition-colors leading-none">
+                        {news.id}
+                      </span>
+                      <div className="space-y-1 flex flex-col">
+                        <span className="text-[10px] font-bold text-blue-600 uppercase tracking-widest">{news.cat}</span>
+                        <h4 className="text-[14px] font-bold text-neutral-900 leading-tight group-hover:text-blue-600 transition-colors">
+                          {news.title}
+                        </h4>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+
+
+              <div className="grid gap-x-12 mt-12 gap-y-3 md:grid-cols-1">
+                <div className="flex items-center justify-between mb-2 border-b border-neutral-100 pb-2">
+                  <h3 className="text-[13px] font-bold text-black uppercase tracking-tight">Noticias Principais</h3>
+                  {/* <span className="text-[11px] font-medium text-neutral-400">Últimas 24h</span> */}
+                </div>
+
+                {recentes.map((item) => (
+                  <article key={item.title} className="group cursor-pointer mb-1">
+                    <Link href="#" className="flex flex-row items-start gap-6">
+                      
+                      {/* 1. LADO DA IMAGEM (Limpo e Minimalista) */}
+                      <div className="relative aspect-[4/3] w-25 shrink-0 overflow-hidden rounded-2xl bg-neutral-100 shadow-sm transition-all duration-500 group-hover:shadow-xl sm:w-25 md:w-25 lg:w-25">
+                        <Image 
+                          src={item.img} 
+                          alt="" 
+                          fill 
+                          className="object-cover transition duration-700 group-hover:scale-110" 
+                          sizes="(max-width: 60px) 60px, 64px" 
+                        />
+                      </div>
+
+                      {/* 2. LADO DO TEXTO (Categoria externa ao topo) */}
+                      <div className="flex flex-1 flex-col ">
+                        {/* CATEGORIA E DATA LADO A LADO */}
+                        <div className="gap-3 mb-2 flex flex-col justify-start items-start">
+                          <span className="text-[10px] font-bold uppercase tracking-wider text-[#0066CC]">
+                            {item.cat}
+                          </span>
+                          {/* <span className="h-1 w-1 rounded-2xl bg-neutral-300" /> */}
+                          {/* <span className="text-[10px] font-semibold text-neutral-400 uppercase tracking-tight">
+                            {item.date}
+                          </span>
+                          <span className="h-1 w-1 rounded-2xl bg-neutral-300" />
+                          <span className="text-[10px] font-bold uppercase text-neutral-400">
+                            {item.readTime} min
+                        </span> */}
+                        </div>
+
+                        <h3 className="line-clamp-3 text-[14px] font-bold leading-tight text-neutral-900 transition-colors group-hover:text-[#0066cc]">
+                          {item.title}
+                        </h3>
+                      
+
+                      </div>
+
+                    </Link>
+                  </article>
+                ))}
+              </div>
+
+              </div>
+
+
+
+              {/* 2. VIDEO - Minimalist Edge-to-Edge */}
+              <div className="group">
+                <div className="flex items-center justify-between mb-3 px-1">
+                  <h3 className="text-[13px] font-bold text-black tracking-tight">TV One Angola</h3>
+                  <div className="flex items-center gap-1.5">
+                    <span className="h-1.5 w-1.5 rounded-full bg-[#FF3B30] animate-pulse" />
+                    <span className="text-[11px] font-bold text-[#FF3B30] uppercase">Ao Vivo</span>
+                  </div>
+                </div>
+                
+                <div className="relative aspect-video w-full overflow-hidden rounded-xl bg-black shadow-sm group-hover:shadow-md transition-shadow">
+                  {!isPlaying ? (
+                    <div className="absolute inset-0 z-10 cursor-pointer" onClick={() => setIsPlaying(true)}>
+                      <Image 
+                        src="https://i.ytimg.com/vi/bfEYtb2O3iI/maxresdefault.jpg"
+                        alt="Workshop"
+                        fill
+                        className="object-cover transition-transform duration-500 group-hover:scale-105 opacity-90"
+                      />
+                      <div className="absolute inset-0 flex items-center justify-center">
+                        <div className="flex h-14 w-14 items-center justify-center rounded-full bg-white/20 backdrop-blur-md border border-white/30 text-white transition-all group-hover:bg-white group-hover:text-[#007AFF] group-hover:scale-110">
+                          <svg className="h-6 w-6 ml-0.5" fill="currentColor" viewBox="0 0 24 24">
+                            <path d="M8 5v14l11-7z" />
+                          </svg>
+                        </div>
+                      </div>
+                    </div>
+                  ) : (
+                    <iframe 
+                      className="absolute inset-0 h-full w-full"
+                      src="https://www.youtube.com/embed/bfEYtb2O3iI?autoplay=1" 
+                      frameBorder="0"
+                      allow="autoplay; encrypted-media" 
+                      allowFullScreen
+                    />
+                  )}
+                </div>
+                
+                <div className="mt-3.5 px-1">
+                  <h4 className="text-[16px] font-semibold text-black leading-snug tracking-tight group-hover:text-[#007AFF] transition-colors">
+                    Workshop “Acelere a Sua Empresa” impulsiona o empreendedorismo em Angola
+                  </h4>
+                  <p className="mt-2 text-[12px] text-[#8E8E93] font-medium tracking-tight">Publicado em 24 de Março, 2026</p>
+                </div>
+              </div>
+
+
+            </div>
+          </aside>
+
+        </div>
+      </main>
+
+      <TvoneAdBanner />
+      <TvoneFooter />
+    </div>
+  );
+}
\ No newline at end of file
diff --git a/app/components/tvone-promo-strip.tsx b/app/components/tvone-promo-strip.tsx
index b2e33e9..496a1a5 100644
--- a/app/components/tvone-promo-strip.tsx
+++ b/app/components/tvone-promo-strip.tsx
@@ -4,7 +4,6 @@ import Image from "next/image";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import type { CSSProperties } from "react";
 
-// Definição do tipo para garantir 100% de compatibilidade TS
 export interface SliderPhoto {
   src: string;
   alt: string;
@@ -13,13 +12,12 @@ export interface SliderPhoto {
 
 const ROTATE_MS = 5500;
 
-// --- 1. COMPONENTE DE SLIDE INDIVIDUAL ---
+// --- 1. SLIDE COMPONENT ---
 interface SlideProps {
   photo: SliderPhoto;
-  onRatioLoad: (src: string, ratio: number) => void;
 }
 
-function PromoStripSingleSlide({ photo, onRatioLoad }: SlideProps) {
+function PromoStripSingleSlide({ photo }: SlideProps) {
   return (
     <div className="relative h-full w-full">
       <Image
@@ -29,19 +27,12 @@ function PromoStripSingleSlide({ photo, onRatioLoad }: SlideProps) {
         priority
         className="object-cover object-center"
         sizes="100vw"
-        onLoad={(e) => {
-          const target = e.currentTarget;
-          if (target.naturalHeight > 0) {
-            onRatioLoad(photo.src, target.naturalWidth / target.naturalHeight);
-          }
-        }}
       />
-      
     </div>
   );
 }
 
-// --- 2. HOOK DE DADOS (Simulação de Fetch) ---
+// --- 2. DATA HOOK ---
 function useSliderPhotos(): { photos: SliderPhoto[]; loading: boolean } {
   const [photos, setPhotos] = useState<SliderPhoto[]>([]);
   const [loading, setLoading] = useState<boolean>(true);
@@ -72,14 +63,15 @@ function useSliderPhotos(): { photos: SliderPhoto[]; loading: boolean } {
   return { photos, loading };
 }
 
-// --- 3. COMPONENTE PRINCIPAL (O CARROSSEL) ---
+// --- 3. MAIN COMPONENT ---
 export function TvonePromoStrip() {
   const { photos, loading } = useSliderPhotos();
   const [index, setIndex] = useState<number>(0);
-  const [ratios, setRatios] = useState<Record<string, number>>({});
   const [reduceMotion, setReduceMotion] = useState<boolean>(false);
 
-  // Detetar preferência de movimento do sistema (iOS/MacOS/Windows)
+  // Constants for the 4.8:1 ratio
+  const FIXED_RATIO = 4.8 / 1;
+
   useEffect(() => {
     const mq = window.matchMedia("(prefers-reduced-motion: reduce)");
     const sync = () => setReduceMotion(mq.matches);
@@ -88,7 +80,6 @@ export function TvonePromoStrip() {
     return () => mq.removeEventListener("change", sync);
   }, []);
 
-  // Lógica de avanço automático
   const advance = useCallback(() => {
     if (photos.length <= 1) return;
     setIndex((i: number) => (i + 1) % photos.length);
@@ -100,54 +91,46 @@ export function TvonePromoStrip() {
     return () => window.clearInterval(id);
   }, [photos.length, reduceMotion, advance]);
 
-  // Handler para atualizar rácios de imagem
-  const handleRatio = useCallback((src: string, ratio: number) => {
-    setRatios((prev) => (prev[src] === ratio ? prev : { ...prev, [src]: ratio }));
-  }, []);
-
-  // Calcula a proporção do contentor baseado no slide ativo
-  const currentRatio = useMemo<number>(() => {
-    const activePhoto = photos[index];
-    return activePhoto ? (ratios[activePhoto.src] || 16 / 9) : 16 / 9;
-  }, [photos, index, ratios]);
-
+  // Loading state with fixed ratio
   if (loading && photos.length === 0) {
-    return <div className="aspect-[16/9] w-full animate-pulse bg-neutral-100 dark:bg-neutral-800" />;
+    return (
+      <div 
+        className="w-full animate-pulse bg-neutral-100 dark:bg-neutral-800" 
+        style={{ aspectRatio: "4.8 / 1" }}
+      />
+    );
   }
 
   if (photos.length === 0) return null;
 
   return (
     <section 
-      className="relative w-full overflow-hidden bg-neutral-100 dark:bg-neutral-900 transition-[aspect-ratio] duration-700 ease-[cubic-bezier(0.32,0.72,0,1)]"
-      style={{ aspectRatio: currentRatio } as CSSProperties}
+      className="relative w-full overflow-hidden bg-neutral-100 dark:bg-neutral-900 transition-all duration-700 ease-[cubic-bezier(0.32,0.72,0,1)]"
+      style={{ aspectRatio: "4.8 / 1" }} // Locked to 4.8:1
       role="region"
       aria-roledescription="carrossel"
     >
-      {/* O "ROLO" (A fita flexível) */}
+      {/* THE TRACK */}
       <div 
         className="flex h-full w-full transition-transform duration-1000 ease-[cubic-bezier(0.32,0.72,0,1)]"
         style={{ transform: `translateX(-${index * 100}%)` }}
       >
         {photos.map((photo: SliderPhoto, i: number) => (
           <div key={photo.src || i} className="h-full w-full flex-shrink-0">
-            <PromoStripSingleSlide 
-              photo={photo} 
-              onRatioLoad={handleRatio} 
-            />
+            <PromoStripSingleSlide photo={photo} />
           </div>
         ))}
       </div>
 
-      {/* INDICADORES (iOS Dot Style) */}
+      {/* INDICATORS */}
       {photos.length > 1 && (
-        <div className="absolute bottom-6 left-1/2 flex -translate-x-1/2 gap-2 z-20">
+        <div className="absolute bottom-4 left-1/2 flex -translate-x-1/2 gap-2 z-20">
           {photos.map((_, i: number) => (
             <button
               key={i}
               onClick={() => setIndex(i)}
-              className={`h-1.5 transition-all duration-500 ${
-                index === i ? "w-8 bg-white" : "w-1.5 bg-white/30 hover:bg-white/60"
+              className={`h-1 transition-all duration-500 ${
+                index === i ? "w-6 bg-white" : "w-1.5 bg-white/30 hover:bg-white/60"
               }`}
               aria-label={`Ir para slide ${i + 1}`}
             />
diff --git a/app/components/video-galary.tsx b/app/components/video-galary.tsx
index 0e50a50..adb59d5 100644
--- a/app/components/video-galary.tsx
+++ b/app/components/video-galary.tsx
@@ -6,7 +6,7 @@ import { motion } from "framer-motion";
 
 const recentes = [
     {
-      title: "Diddy na XB Label? Gerilson Israel responde após anúncio de nova música em conjunto.",
+      title: "Diddy na XB Label? Gerilson Israel responde após anúncio de nova música em conjunto",
       excerpt: "O artista angolano esclareceu os rumores sobre a sua possível entrada para a editora internacional...",
       cat: "Música",
       catBg: "bg-blue-50 text-blue-600",
@@ -16,7 +16,7 @@ const recentes = [
       img: "https://images.unsplash.com/photo-1598488035139-bdbb2231ce04?q=80&w=800&auto=format&fit=crop",
     },
     {
-      title: "Inflação desce pelo terceiro mês consecutivo em Angola, segundo dados preliminares.",
+      title: "Inflação desce pelo terceiro mês consecutivo em Angola, segundo dados preliminares.,",
       excerpt: "Os preços dos bens de consumo registaram uma ligeira queda, trazendo alívio para as famílias...",
       cat: "Economia",
       catBg: "bg-green-50 text-green-600",
@@ -36,7 +36,7 @@ const recentes = [
       img: "https://images.unsplash.com/photo-1507676184212-d03ab07a01bf?q=80&w=800&auto=format&fit=crop",
     },
     {
-        title: "Diddy na XB Label? Gerilson Israel responde após anúncio de nova música em conjunto.",
+        title: "Diddy na XB Label? Gerilson Israel responde após anúncio de nova música em conjunto,",
         excerpt: "O artista angolano esclareceu os rumores sobre a sua possível entrada para a editora internacional...",
         cat: "Música",
         catBg: "bg-blue-50 text-blue-600",
@@ -56,7 +56,7 @@ const recentes = [
         img: "https://images.unsplash.com/photo-1526304640581-d334cdbbf45e?q=80&w=800&auto=format&fit=crop",
       },
       {
-        title: "Inflação desce pelo terceiro mês consecutivo em Angola, segundo dados preliminares.",
+        title: "Inflação desce pelo terceiro mês consecutivo em Angola, segundo dados preliminares",
         excerpt: "Os preços dos bens de consumo registaram uma ligeira queda, trazendo alívio para as famílias...",
         cat: "Economia",
         catBg: "bg-green-50 text-green-600",
diff --git a/package.json b/package.json
index 5b41736..2b832f6 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,8 @@
     "react": "19.2.4",
     "react-dom": "19.2.4",
     "react-easy-crop": "^5.5.7",
-    "react-icons": "^5.6.0"
+    "react-icons": "^5.6.0",
+    "uuid": "^13.0.0"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f0f34f1..6833956 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -29,6 +29,9 @@ importers:
       react-icons:
         specifier: ^5.6.0
         version: 5.6.0(react@19.2.4)
+      uuid:
+        specifier: ^13.0.0
+        version: 13.0.0
     devDependencies:
       '@tailwindcss/postcss':
         specifier: ^4
@@ -1965,6 +1968,10 @@ packages:
   uri-js@4.4.1:
     resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
 
+  uuid@13.0.0:
+    resolution: {integrity: sha512-XQegIaBTVUjSHliKqcnFqYypAd4S+WCYt5NIeRs6w/UAry7z8Y9j5ZwRRL4kzq9U3sD6v+85er9FvkEaBpji2w==}
+    hasBin: true
+
   which-boxed-primitive@1.1.1:
     resolution: {integrity: sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==}
     engines: {node: '>= 0.4'}
@@ -4099,6 +4106,8 @@ snapshots:
     dependencies:
       punycode: 2.3.1
 
+  uuid@13.0.0: {}
+
   which-boxed-primitive@1.1.1:
     dependencies:
       is-bigint: 1.1.0