diff --git a/public/assets/images/dashboard.png b/public/assets/images/dashboard.png
index d016f59..83447c5 100644
Binary files a/public/assets/images/dashboard.png and b/public/assets/images/dashboard.png differ
diff --git a/resources/views/index.blade.php b/resources/views/index.blade.php
index 1f69502..78f6576 100644
--- a/resources/views/index.blade.php
+++ b/resources/views/index.blade.php
@@ -7,8 +7,8 @@
         <h1 class="mb-0 font-semibold text-[42px] md:text-[52px] lg:text-[72px]">Gas Rumah Kaca Daerah</h1>
         <p class="mb-0 text-[#878C91] md:w-[70%]">Platform terintegrasi untuk memantau, melaporkan, dan mengevaluasi status emisi GRK serta kemajuan Rencana Aksi Mitigasi di wilayah Jakarta. Akses data inventarisasi terbaru dan peran serta publik.</p>
         <div class="flex flex-col md:flex-row gap-10 md:gap-3 mt-20">
-            <div><a href="" class="rounded-full bg-[#2084FF] px-10 py-4 text-white">Lihat Rencana Aksi&nbsp;<i class="bx bx-right-arrow-alt"></i></a></div>
-            <div><a href="" class="rounded-full px-10 py-4 border">Akses Dashboard Terbaru</a></div>
+            <div><a href="" class="btn-minimal btn-primary rounded-full px-10 py-4 text-white">Lihat Rencana Aksi&nbsp;<i class="bx bx-right-arrow-alt"></i></a></div>
+            <div><a href="" class="btn-minimal btn-secondary rounded-full px-10 py-4">Akses Dashboard Terbaru</a></div>
         </div>
     </div>
 </section>
@@ -25,30 +25,30 @@
         <div class="info-card bg-[url({{ asset('assets/images/bg1.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px]">
             <div class="content">
                 <h4 class="text-[20px]">Energi</h4>
-                <p class="font-thin text-sm">We're a UK-based Laravel agency. We'll get your project moving so you can focus on what matters most. You'll have peac.</p>
+                <p class="font-thin text-sm">Meliputi emisi dari pembakaran bahan bakar fosil di sektor Transportasi, Pembangkit Listrik, Industri, Komersial, dan Rumah Tangga.</p>
             </div>
         </div>
         <div class="info-card bg-[url({{ asset('assets/images/bg2.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px]">
             <div class="content">
                 <h4 class="text-[20px]">Industrial Processes and Product Use</h4>
-                <p class="font-thin text-sm">As the largest on-shore Laravel development company in the United States, Active Logic is headquartered in.</p>
+                <p class="font-thin text-sm">Emisi yang dilepaskan dari proses kimia dan fisik dalam industri manufaktur, bukan dari pembakaran bahan bakar itu sendiri.</p>
             </div>
         </div>
         <div class="info-card bg-[url({{ asset('assets/images/bg3.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px]">
             <div class="content">
                 <h4 class="text-[20px]">Pertanian & Lahan</h4>
-                <p class="font-thin text-sm">We're the Laravel agency you couldn't afford locally. But we're based in Georgia, the country. So, you can.</p>
+                <p class="font-thin text-sm">Meliputi emisi dan serapan (penghilangan) GRK dari kegiatan pertanian, kehutanan, peternakan, dan perubahan tata guna lahan.</p>
             </div>
         </div>
         <div class="info-card bg-[url({{ asset('assets/images/bg4.png') }})] bg-no-repeat bg-cover flex flex-col items-start gap-3 text-white justify-end p-3 pb-[30px] rounded-[10px] h-[500px]">
             <div class="content">
                 <h4 class="text-[20px]">Limbah</h4>
-                <p class="font-thin text-sm">We're the experts in all things Laravel. If you need an app built or rescued, or you need your team built or leveled up, we'v</p>
+                <p class="font-thin text-sm">Emisi Metana yang dihasilkan dari penguraian sampah padat di TPA dan gas dari pengelolaan air limbah domestik serta industri.</p>
             </div>
         </div>
     </div>
     <div class="flex flex-col md:flex-row gap-4 justify-center items-center mt-[45px]">
-        <div><a href="" class="rounded-full bg-[#2084FF] px-10 py-4 text-white">Lihat Rencana Aksi&nbsp;<i class="bx bx-right-arrow-alt"></i></a></div>
+        <div><a href="" class="btn-minimal btn-primary rounded-full px-10 py-4 text-white">Lihat Rencana Aksi&nbsp;<i class="bx bx-right-arrow-alt"></i></a></div>
     </div>
 </section>
 
@@ -60,10 +60,10 @@
             </div>
         </div>
         <div class="flex flex-col lg:flex-row justify-center items-center gap-4 mt-[35px] px-20 lg:w-[90%] mx-auto text-center">
-            <div class="rounded-full w-full border px-6 py-3 text-white"><a href="">Investasi Sektor</a></div>
-            <div class="rounded-full w-full border px-6 py-3 text-[#2084FF] bg-white"><a href="">Tren Tahun ke Tahun</a></div>
-            <div class="rounded-full w-full border px-6 py-3 text-white"><a href="">RAD GRK Interaktif</a></div>
-            <div class="rounded-full w-full border px-6 py-3 text-white"><a href="">Peta Geografis Aksi</a></div>
+            <div class="btn-minimal btn-tab rounded-full w-full border px-6 py-3 text-white"><a href="">Inventarisasi Sektor</a></div>
+            <div class="btn-minimal btn-tab rounded-full w-full border px-6 py-3 text-white"><a href="">Tren Tahun ke Tahun</a></div>
+            <div class="btn-minimal btn-tab rounded-full w-full border px-6 py-3 text-white"><a href="">RAD GRK Interaktif</a></div>
+            <div class="btn-minimal btn-tab rounded-full w-full border px-6 py-3 text-white"><a href="">Peta Geografis Aksi</a></div>
         </div>
         <div class="flex justify-center -mt-[50px]">
             <img src="{{ asset('assets/images/dashboard.png') }}" alt="">
@@ -87,9 +87,9 @@
                 </div>
             </div>
             <div class="flex justify-between gap-5">
-                <div><a class="p-3 rounded-full border" href=""><i class="bx bx-left-arrow-alt"></i></a></div>
+                <div><a class="btn-minimal btn-icon p-3 rounded-full border" href=""><i class="bx bx-left-arrow-alt"></i></a></div>
                 <div class="text-[#878C91]">01 &nbsp;/&nbsp; 05</div>
-                <div><a class="p-3 bg-[#2084FF] text-white rounded-full" href=""><i class="bx bx-right-arrow-alt"></i></a></div>
+                <div><a class="btn-minimal btn-icon p-3 bg-[#2084FF] text-white rounded-full" href=""><i class="bx bx-right-arrow-alt"></i></a></div>
             </div>
         </div>
     </div>
@@ -104,8 +104,8 @@
                     menjawab pertanyaan umum dari publik dan pemangku kepentingan mengenai data emisi dan upaya mitigasi daerah
                 </p>
                 <div class="flex gap-3 justify-center items-center mt-5">
-                    <a class="border px-6 py-3 rounded-full" href="">Akses Materi Edukasi</a>
-                    <a class="px-6 py-3 underline" href="">Hubungi Kami</a>
+                    <a class="btn-minimal btn-outline border px-6 py-3 rounded-full" href="">Akses Materi Edukasi</a>
+                    <a class="btn-minimal btn-link px-6 py-3 underline" href="">Hubungi Kami</a>
                 </div>
             </div>
             <div class="flex flex-col gap-3 lg:w-[60%]">
@@ -201,7 +201,7 @@
                         kondisi emisi serta efektifitas program mitigasi.
                     </p>
                 </div>
-                <div class="mt-5"><a class="border border-[#000] px-6 py-3 rounded-full" href="">Lihat Selengkapnya</a></div>
+                <div class="mt-5"><a class="btn-minimal btn-outline border border-[#000] px-6 py-3 rounded-full" href="">Lihat Selengkapnya</a></div>
             </div>
         </div>
         <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 mt-[50px]">
@@ -215,7 +215,7 @@
                         <div class="w-[70%]">
                             <p class="text-[#878C91]">Data yang akurat memudahkan perencanaan mitigasi dan adaptasi berbasis kebutuhan nyata.</p>
                         </div>
-                        <div class="w-[30%] text-right flex justify-center items-center"><a href="" class="px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
+                        <div class="w-[30%] text-right flex justify-center items-center"><a href="" class="btn-minimal btn-icon px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
                     </div>
                 </div>
             </div>
@@ -229,7 +229,7 @@
                         <div class="w-[70%]">
                             <p class="text-[#878C91]">Pelaporan inventarisasi GRK lebih konsisten dan dapat dibandingan antar-tahun.</p>
                         </div>
-                        <div class="w-[30%] text-right flex justify-center items-center"><a href="" class="px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
+                        <div class="w-[30%] text-right flex justify-center items-center"><a href="" class="btn-minimal btn-icon px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
                     </div>
                 </div>
             </div>
@@ -243,7 +243,7 @@
                         <div class="w-[70%]">
                             <p class="text-[#878C91]">Transparansi pelaporan membantu evaluasi dan memastikan efektivitas program iklim daerah.</p>
                         </div>
-                        <div class="w-[30%] text-right flex justify-center items-center"><a href="" class="px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
+                        <div class="w-[30%] text-right flex justify-center items-center"><a href="" class="btn-minimal btn-icon px-8 py-3 border rounded-full border-[#000]"><i class="bx bx-right-arrow-alt text-2xl"></i></a></div>
                     </div>
                 </div>
             </div>
diff --git a/resources/views/layouts/front.blade.php b/resources/views/layouts/front.blade.php
index 1872a74..15e4387 100644
--- a/resources/views/layouts/front.blade.php
+++ b/resources/views/layouts/front.blade.php
@@ -38,58 +38,96 @@
                 transform: translateY(0);
             }
 
-            /* Button hover animations */
-            .btn-hover {
+            /* Modern Minimalist Button Hover Animations */
+            .btn-minimal {
                 transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
                 position: relative;
-                overflow: hidden;
             }
 
-            .btn-hover:hover {
+            .btn-minimal:hover {
                 transform: translateY(-2px);
-                box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
             }
 
-            .btn-hover:active {
-                transform: translateY(0);
-                box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+            .btn-minimal:active {
+                transform: translateY(-1px);
+                transition-duration: 0.1s;
             }
 
-            /* Primary button (blue background) hover effect */
-            .btn-hover.btn-primary:hover {
+            /* Primary button (blue background) */
+            .btn-minimal.btn-primary {
+                background-color: #2084FF;
+            }
+
+            .btn-minimal.btn-primary:hover {
                 background-color: #1a6fd9;
-                transform: translateY(-3px);
-                box-shadow: 0 12px 30px rgba(32, 132, 255, 0.4);
+                transform: scale(1.05);
             }
 
-            /* Secondary button (border only) hover effect */
-            .btn-hover.btn-secondary:hover {
-                background-color: #f8fafc;
+            /* Secondary button (border only) */
+            .btn-minimal.btn-secondary {
+                border: 1px solid currentColor;
+                background-color: transparent;
+            }
+
+            .btn-minimal.btn-secondary:hover {
+                background-color: #2084FF;
+                color: white;
+                border-color: #2084FF;
+                transform: scale(1.02);
+            }
+
+            /* Outline button */
+            .btn-minimal.btn-outline:hover {
+                background-color: rgba(32, 132, 255, 0.1);
                 border-color: #2084FF;
                 color: #2084FF;
-                transform: translateY(-2px);
-                box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+                transform: translateX(4px);
             }
 
-            /* Icon button hover effects */
-            .btn-hover.btn-icon:hover {
-                transform: scale(1.1);
-                box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
+            /* Icon button */
+            .btn-minimal.btn-icon:hover {
+                transform: rotate(5deg) scale(1.1);
             }
 
-            /* Tab button hover effects */
-            .btn-hover.btn-tab:hover {
-                background-color: rgba(255, 255, 255, 0.9);
-                color: #2084FF;
-                transform: translateY(-1px);
-                box-shadow: 0 4px 15px rgba(255, 255, 255, 0.3);
+            /* Tab button */
+            .btn-minimal.btn-tab {
+                display: block;
+                width: 100%;
+                color: white;
+                text-decoration: none;
+                background-color: transparent;
+                border-color: white;
+                font-weight: 500;
+            }
+
+            .btn-minimal.btn-tab:hover {
+                background-color: white !important;
+                color: #2084FF !important;
+                border-color: white;
+                transform: scale(1.02);
+            }
+
+            /* Link button */
+            .btn-minimal.btn-link:hover {
+                transform: translateX(8px);
+            }
+
+            .btn-minimal.btn-link::after {
+                content: '';
+                position: absolute;
+                bottom: 0;
+                left: 0;
+                width: 0;
+                height: 1px;
+                background-color: currentColor;
+                transition: width 0.3s ease;
+            }
+
+            .btn-minimal.btn-link:hover::after {
+                width: 100%;
             }
 
             /* FAQ Static Styles */
-            .faq-item {
-                /* Static display - no animations */
-            }
-
             .faq-content {
                 /* Always visible */
                 display: block;