feat: implement carousel components for news section and update layout styles

app/pages/news/data.ts

@@ -16,7 +16,7 @@ export const SPOTLIGHT: TNews = {
       title: '02 Travelling as a way of self-discovery and progress',
       content:
         'Pengacara Kondang, Hotman Paris Hutapea, membuka sebuah perpustakaan baru di dalam diskotik nya yang berlokasi di daerah Jakarta Pusat, Hotman berkata Perpustakaan ini dibuka dengan harapan untuk meningkatkan gairah membaca masyarakat Indonesia, namun sayangnya..',
-      featured: 'https://placehold.co/600x400.png',
+      featured: 'https://placehold.co/800x500.png',
       slug: 'hotman-paris-membuka-perpustakaan-di-tengah-diskotik',
     },
     {
@@ -63,7 +63,7 @@ export const BERITA: TNews = {
       title: 'Travelling as a way of self-discovery and progress',
       content:
         'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros.',
-      featured: 'https://placehold.co/600x400.png',
+      featured: 'https://placehold.co/800x500.png',
       tags: ['Hukum Property'],
       slug: 'travelling-as-a-way-of-self-discovery-and-progress',
     },

app/pages/news/index.tsx

@@ -1,23 +1,21 @@
 import { Card } from '~/components/ui/card'
-import { Carousel } from '~/components/ui/carousel'
+import { CarouselHero } from '~/components/ui/carousel-hero'
+import { CarouselSection } from '~/components/ui/carousel-section'
 import { Newsletter } from '~/components/ui/newsletter'
 
-import { BERITA, KAJIAN, SPOTLIGHT } from './data'
+import { SPOTLIGHT, BERITA } from './data'
 
 export const NewsPage = () => {
   return (
     <div className="relative">
       <Card>
-        <Carousel {...SPOTLIGHT} />
+        <CarouselHero {...SPOTLIGHT} />
       </Card>
       <div className="min-h-[400px] sm:min-h-[300px]">
         <Newsletter className="mr-0 sm:-ml-14" />
       </div>
       <Card>
-        <Carousel {...BERITA} />
-      </Card>
-      <Card>
-        <Carousel {...KAJIAN} />
+        <CarouselSection {...BERITA} />
       </Card>
     </div>
   )