diff --git a/app/Http/Controllers/HomeController.php b/app/Http/Controllers/HomeController.php
index e69de29..ec5a2d8 100644
--- a/app/Http/Controllers/HomeController.php
+++ b/app/Http/Controllers/HomeController.php
@@ -0,0 +1,26 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\File;
+
+class HomeController extends Controller
+{
+    public function index()
+    {
+        $popup = json_decode(File::get(public_path('assets/json/home/popup.json')), true);
+        $faqs = json_decode(File::get(public_path('assets/json/home/faq.json')), true);
+        $heros = json_decode(File::get(public_path('assets/json/home/hero.json')), true);
+        $konten = json_decode(File::get(public_path('assets/json/home/news.json')), true);
+
+         usort($konten, function($a, $b) {
+            return strcmp($b['date'], $a['date']);
+        });
+
+        $newsItems  = array_values(array_filter($konten, fn($i) => $i['type'] === 'news'));
+        $videoItems = array_values(array_filter($konten, fn($i) => $i['type'] === 'video'));
+
+        return view('frontend.home', compact('popup', 'heros','faqs', 'newsItems', 'videoItems'));
+    }
+}
diff --git a/app/Http/Controllers/NewsController.php b/app/Http/Controllers/NewsController.php
index 92158cb..2502a0d 100644
--- a/app/Http/Controllers/NewsController.php
+++ b/app/Http/Controllers/NewsController.php
@@ -16,4 +16,15 @@ class NewsController extends Controller
     {
         return view('frontend.news_detail');
     }
+
+    public function index_newsvideo()
+    {
+        return view('news.index_news');
+    }
+
+
+    public function create_newsvideo()
+    {
+        return view('news.create_news');
+    }
 }
diff --git a/app/Http/Controllers/Persetujuan/AddendumController.php b/app/Http/Controllers/Persetujuan/AddendumController.php
new file mode 100644
index 0000000..2a5c48b
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/AddendumController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class AddendumController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.addendum.index_addendum');
+    }
+
+    public function view()
+    {
+        return view('persetujuanlingkungan.addendum.view_addendum');
+    }
+}
diff --git a/app/Http/Controllers/Persetujuan/AmdalController.php b/app/Http/Controllers/Persetujuan/AmdalController.php
new file mode 100644
index 0000000..847d336
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/AmdalController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class AmdalController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.amdal.index_amdal');
+    }
+
+    public function view()
+    {
+        return view('persetujuanlingkungan.amdal.view_amdal');
+    }
+}
diff --git a/app/Http/Controllers/Persetujuan/DelhController.php b/app/Http/Controllers/Persetujuan/DelhController.php
new file mode 100644
index 0000000..98502e1
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/DelhController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class DelhController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.delh.index_delh');
+    }
+
+    public function view()
+    {
+        return view('persetujuanlingkungan.delh.view_delh');
+    }
+}
diff --git a/app/Http/Controllers/Persetujuan/DplhController.php b/app/Http/Controllers/Persetujuan/DplhController.php
new file mode 100644
index 0000000..d465b36
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/DplhController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class DplhController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.dplh.index_dplh');
+    }
+
+    public function view()
+    {
+        return view('persetujuanlingkungan.dplh.view_dplh');
+    }
+}
diff --git a/app/Http/Controllers/Persetujuan/KerangkaController.php b/app/Http/Controllers/Persetujuan/KerangkaController.php
new file mode 100644
index 0000000..902e1f3
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/KerangkaController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class KerangkaController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.kerangka_acuan.index_kerangka_acuan');
+    }
+
+    public function create()
+    {
+        return view('persetujuanlingkungan.kerangka_acuan.create_kerangka_acuan');
+    }
+}
diff --git a/app/Http/Controllers/Persetujuan/RklController.php b/app/Http/Controllers/Persetujuan/RklController.php
new file mode 100644
index 0000000..7761d1e
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/RklController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class RklController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.rkl.index_rkl');
+    }
+
+    public function view()
+    {
+        return view('persetujuanlingkungan.rkl.view_rkl');
+    }
+}
diff --git a/app/Http/Controllers/Persetujuan/UklController.php b/app/Http/Controllers/Persetujuan/UklController.php
new file mode 100644
index 0000000..4f2a4d5
--- /dev/null
+++ b/app/Http/Controllers/Persetujuan/UklController.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Http\Controllers\Persetujuan;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+
+class UklController extends Controller
+{
+    public function index()
+    {
+        return view('persetujuanlingkungan.ukl.index_ukl');
+    }
+
+    public function view()
+    {
+        return view('persetujuanlingkungan.ukl.view_ukl');
+    }
+}
diff --git a/app/Http/Controllers/PersetujuanTeknisController.php b/app/Http/Controllers/PersetujuanTeknisController.php
index d9ff248..3189a47 100644
--- a/app/Http/Controllers/PersetujuanTeknisController.php
+++ b/app/Http/Controllers/PersetujuanTeknisController.php
@@ -6,6 +6,8 @@ use Illuminate\Http\Request;
 
 class PersetujuanTeknisController extends Controller
 {
+
+    //Arahan
     public function index_arahan()
     {
         return view('pertek/arahan/index_arahan');
@@ -26,11 +28,20 @@ class PersetujuanTeknisController extends Controller
         return view('pertek/arahan/create_arahan');
     }
 
+
+    // Emisi
     public function index_emisi()
     {
         return view('pertek/emisi/index_emisi');
     }
 
+    public function detail_emisi()
+    {
+        return view('pertek/emisi/detail_emisi');
+    }
+
+     // Air Limbah
+
     public function index_airlimbah()
     {
         return view('pertek/airlimbah/index_airlimbah');
@@ -40,4 +51,15 @@ class PersetujuanTeknisController extends Controller
     {
         return view('pertek/limbahb3/index_limbahb3');
     }
+
+    // SLO
+
+    public function index_slo()
+    {
+        return view('pertek/slo/index_slo');
+    }
+    public function detail_slo()
+    {
+        return view('pertek/slo/detail_slo');
+    }
 }
diff --git a/public/assets/css/pertek/user_arahan.css b/public/assets/css/pertek/user_arahan.css
new file mode 100644
index 0000000..808ce32
--- /dev/null
+++ b/public/assets/css/pertek/user_arahan.css
@@ -0,0 +1,37 @@
+.timeline-status {
+    position: relative;
+    padding-left: 28px;
+}
+.timeline-status:before {
+    content: "";
+    position: absolute;
+    left: 9px;
+    top: 6px;
+    height: calc(100% - 12px);
+    width: 2px;
+    background: #e9ecef;
+}
+.timeline-item {
+    position: relative;
+    padding-bottom: 20px;
+}
+.timeline-marker {
+    position: absolute;
+    left: -25px;
+    top: 6px;
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    background: #e9ecef;
+    border: 2px solid #fff;
+}
+.timeline-item.completed .timeline-marker {
+    background: #28a745;
+}
+.timeline-item.active .timeline-marker {
+    background: #007bff;
+    box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.2);
+}
+.timeline-content {
+    padding-left: 10px;
+}
diff --git a/public/assets/images/home/banner.webp b/public/assets/images/home/banner.webp
new file mode 100644
index 0000000..2a7cf86
Binary files /dev/null and b/public/assets/images/home/banner.webp differ
diff --git a/public/assets/js/backend/news/embed.js b/public/assets/js/backend/news/embed.js
new file mode 100644
index 0000000..9939b97
--- /dev/null
+++ b/public/assets/js/backend/news/embed.js
@@ -0,0 +1,16 @@
+document.addEventListener("DOMContentLoaded", function () {
+    const categorySelect = document.getElementById("category-select");
+    const embedField = document.getElementById("embed-link-field");
+
+    function toggleEmbedField() {
+        if (categorySelect.value === "Video") {
+            embedField.classList.remove("d-none");
+        } else {
+            embedField.classList.add("d-none");
+        }
+    }
+
+    toggleEmbedField();
+
+    categorySelect.addEventListener("change", toggleEmbedField);
+});
diff --git a/public/assets/js/backend/news/script_upload.js b/public/assets/js/backend/news/script_upload.js
new file mode 100644
index 0000000..9d2c0a2
--- /dev/null
+++ b/public/assets/js/backend/news/script_upload.js
@@ -0,0 +1,142 @@
+// =============================== Upload Single Image js start here ================================================
+const fileInput = document.getElementById("upload-file");
+const imagePreview = document.getElementById("uploaded-img__preview");
+const uploadedImgContainer = document.querySelector(".uploaded-img");
+const removeButton = document.querySelector(".uploaded-img__remove");
+
+fileInput.addEventListener("change", (e) => {
+    if (e.target.files.length) {
+        const src = URL.createObjectURL(e.target.files[0]);
+        imagePreview.src = src;
+        uploadedImgContainer.classList.remove("d-none");
+    }
+});
+removeButton.addEventListener("click", () => {
+    imagePreview.src = "";
+    uploadedImgContainer.classList.add("d-none");
+    fileInput.value = "";
+});
+// =============================== Upload Single Image js End here ================================================
+
+// ================================================ Upload Multiple image js Start here ================================================
+const fileInputMultiple = document.getElementById("upload-file-multiple");
+const uploadedImgsContainer = document.querySelector(
+    ".uploaded-imgs-container"
+);
+
+fileInputMultiple.addEventListener("change", (e) => {
+    const files = e.target.files;
+
+    Array.from(files).forEach((file) => {
+        const src = URL.createObjectURL(file);
+
+        const imgContainer = document.createElement("div");
+        imgContainer.classList.add(
+            "position-relative",
+            "h-120-px",
+            "w-120-px",
+            "border",
+            "input-form-light",
+            "radius-8",
+            "overflow-hidden",
+            "border-dashed",
+            "bg-neutral-50"
+        );
+
+        const removeButton = document.createElement("button");
+        removeButton.type = "button";
+        removeButton.classList.add(
+            "uploaded-img__remove",
+            "position-absolute",
+            "top-0",
+            "end-0",
+            "z-1",
+            "text-2xxl",
+            "line-height-1",
+            "me-8",
+            "mt-8",
+            "d-flex"
+        );
+        removeButton.innerHTML =
+            "<iconify-icon icon='radix-icons:cross-2' class='text-xl text-danger-600'></iconify-icon>";
+
+        const imagePreview = document.createElement("img");
+        imagePreview.classList.add("w-100", "h-100", "object-fit-cover");
+        imagePreview.src = src;
+
+        imgContainer.appendChild(removeButton);
+        imgContainer.appendChild(imagePreview);
+        uploadedImgsContainer.appendChild(imgContainer);
+
+        removeButton.addEventListener("click", () => {
+            URL.revokeObjectURL(src);
+            imgContainer.remove();
+        });
+    });
+
+    // Clear the file input so the same file(s) can be uploaded again if needed
+    fileInputMultiple.value = "";
+});
+// ================================================ Upload Multiple image js End here  ================================================
+
+// ================================================ Upload image & show it\'s name js start  ================================================
+document
+    .getElementById("file-upload-name")
+    .addEventListener("change", function (event) {
+        var fileInput = event.target;
+        var fileList = fileInput.files;
+        var ul = document.getElementById("uploaded-img-names");
+
+        // Add show-uploaded-img-name class to the ul element if not already added
+        ul.classList.add("show-uploaded-img-name");
+
+        // Append each uploaded file name as a list item with Font Awesome and Iconify icons
+        for (var i = 0; i < fileList.length; i++) {
+            var li = document.createElement("li");
+            li.classList.add(
+                "uploaded-image-name-list",
+                "text-primary-600",
+                "fw-semibold",
+                "d-flex",
+                "align-items-center",
+                "gap-2"
+            );
+
+            // Create the Link Iconify icon element
+            var iconifyIcon = document.createElement("iconify-icon");
+            iconifyIcon.setAttribute("icon", "ph:link-break-light");
+            iconifyIcon.classList.add("text-xl", "text-secondary-light");
+
+            // Create the Cross Iconify icon element
+            var crossIconifyIcon = document.createElement("iconify-icon");
+            crossIconifyIcon.setAttribute("icon", "radix-icons:cross-2");
+            crossIconifyIcon.classList.add(
+                "remove-image",
+                "text-xl",
+                "text-secondary-light",
+                "text-hover-danger-600"
+            );
+
+            // Add event listener to remove the image on click
+            crossIconifyIcon.addEventListener(
+                "click",
+                (function (liToRemove) {
+                    return function () {
+                        ul.removeChild(liToRemove); // Remove the corresponding list item
+                    };
+                })(li)
+            ); // Pass the current list item as a parameter to the closure
+
+            // Append both icons to the list item
+            li.appendChild(iconifyIcon);
+
+            // Append the file name text to the list item
+            li.appendChild(document.createTextNode(" " + fileList[i].name));
+
+            li.appendChild(crossIconifyIcon);
+
+            // Append the list item to the unordered list
+            ul.appendChild(li);
+        }
+    });
+// ================================================ Upload image & show it\'s name js end ================================================
diff --git a/public/assets/js/backend/news/upload_image.js b/public/assets/js/backend/news/upload_image.js
new file mode 100644
index 0000000..2e64c58
--- /dev/null
+++ b/public/assets/js/backend/news/upload_image.js
@@ -0,0 +1,28 @@
+// Editor Js Start
+const quill = new Quill("#editor", {
+    modules: {
+        syntax: true,
+        toolbar: "#toolbar-container",
+    },
+    placeholder: "Compose an epic...",
+    theme: "snow",
+});
+// Editor Js End
+
+const fileInput = document.getElementById("upload-file");
+const imagePreview = document.getElementById("uploaded-img__preview");
+const uploadedImgContainer = document.querySelector(".uploaded-img");
+const removeButton = document.querySelector(".uploaded-img__remove");
+
+fileInput.addEventListener("change", (e) => {
+    if (e.target.files.length) {
+        const src = URL.createObjectURL(e.target.files[0]);
+        imagePreview.src = src;
+        uploadedImgContainer.classList.remove("d-none");
+    }
+});
+removeButton.addEventListener("click", () => {
+    imagePreview.src = "";
+    uploadedImgContainer.classList.add("d-none");
+    fileInput.value = "";
+});
diff --git a/public/assets/js/backend/pertek/script_arahan.js b/public/assets/js/backend/pertek/script_arahan.js
new file mode 100644
index 0000000..958cde9
--- /dev/null
+++ b/public/assets/js/backend/pertek/script_arahan.js
@@ -0,0 +1,134 @@
+// =============================== Wizard Step Js Start ================================
+$(document).ready(function () {
+    // click on next button
+    $(".form-wizard-next-btn").on("click", function () {
+        var parentFieldset = $(this).parents(".wizard-fieldset");
+        var currentActiveStep = $(this)
+            .parents(".form-wizard")
+            .find(".form-wizard-list .active");
+        var next = $(this);
+        var nextWizardStep = true;
+        parentFieldset.find(".wizard-required").each(function () {
+            var thisValue = $(this).val();
+
+            if (thisValue == "") {
+                $(this).siblings(".wizard-form-error").show();
+                nextWizardStep = false;
+            } else {
+                $(this).siblings(".wizard-form-error").hide();
+            }
+        });
+        if (nextWizardStep) {
+            next.parents(".wizard-fieldset").removeClass("show", "400");
+            currentActiveStep
+                .removeClass("active")
+                .addClass("activated")
+                .next()
+                .addClass("active", "400");
+            next.parents(".wizard-fieldset")
+                .next(".wizard-fieldset")
+                .addClass("show", "400");
+            $(document)
+                .find(".wizard-fieldset")
+                .each(function () {
+                    if ($(this).hasClass("show")) {
+                        var formAtrr = $(this).attr("data-tab-content");
+                        $(document)
+                            .find(".form-wizard-list .form-wizard-step-item")
+                            .each(function () {
+                                if ($(this).attr("data-attr") == formAtrr) {
+                                    $(this).addClass("active");
+                                    var innerWidth = $(this).innerWidth();
+                                    var position = $(this).position();
+                                    $(document)
+                                        .find(".form-wizard-step-move")
+                                        .css({
+                                            left: position.left,
+                                            width: innerWidth,
+                                        });
+                                } else {
+                                    $(this).removeClass("active");
+                                }
+                            });
+                    }
+                });
+        }
+    });
+    //click on previous button
+    $(".form-wizard-previous-btn").on("click", function () {
+        var counter = parseInt($(".wizard-counter").text());
+        var prev = $(this);
+        var currentActiveStep = $(this)
+            .parents(".form-wizard")
+            .find(".form-wizard-list .active");
+        prev.parents(".wizard-fieldset").removeClass("show", "400");
+        prev.parents(".wizard-fieldset")
+            .prev(".wizard-fieldset")
+            .addClass("show", "400");
+        currentActiveStep
+            .removeClass("active")
+            .prev()
+            .removeClass("activated")
+            .addClass("active", "400");
+        $(document)
+            .find(".wizard-fieldset")
+            .each(function () {
+                if ($(this).hasClass("show")) {
+                    var formAtrr = $(this).attr("data-tab-content");
+                    $(document)
+                        .find(".form-wizard-list .form-wizard-step-item")
+                        .each(function () {
+                            if ($(this).attr("data-attr") == formAtrr) {
+                                $(this).addClass("active");
+                                var innerWidth = $(this).innerWidth();
+                                var position = $(this).position();
+                                $(document)
+                                    .find(".form-wizard-step-move")
+                                    .css({
+                                        left: position.left,
+                                        width: innerWidth,
+                                    });
+                            } else {
+                                $(this).removeClass("active");
+                            }
+                        });
+                }
+            });
+    });
+    //click on form submit button
+    $(document).on("click", ".form-wizard .form-wizard-submit", function () {
+        var parentFieldset = $(this).parents(".wizard-fieldset");
+        var currentActiveStep = $(this)
+            .parents(".form-wizard")
+            .find(".form-wizard-list .active");
+        parentFieldset.find(".wizard-required").each(function () {
+            var thisValue = $(this).val();
+            if (thisValue == "") {
+                $(this).siblings(".wizard-form-error").show();
+            } else {
+                $(this).siblings(".wizard-form-error").hide();
+            }
+        });
+    });
+    // focus on input field check empty or not
+    $(".form-control")
+        .on("focus", function () {
+            var tmpThis = $(this).val();
+            if (tmpThis == "") {
+                $(this).parent().addClass("focus-input");
+            } else if (tmpThis != "") {
+                $(this).parent().addClass("focus-input");
+            }
+        })
+        .on("blur", function () {
+            var tmpThis = $(this).val();
+            if (tmpThis == "") {
+                $(this).parent().removeClass("focus-input");
+                $(this).siblings(".wizard-form-error").show();
+            } else if (tmpThis != "") {
+                $(this).parent().addClass("focus-input");
+                $(this).siblings(".wizard-form-error").hide();
+            }
+        });
+});
+// =============================== Wizard Step Js End ================================
diff --git a/public/assets/js/pertek/script_dropdown.js b/public/assets/js/backend/pertek/script_dropdown.js
similarity index 100%
rename from public/assets/js/pertek/script_dropdown.js
rename to public/assets/js/backend/pertek/script_dropdown.js
diff --git a/public/assets/js/pertek/script_fileUpload.js b/public/assets/js/backend/pertek/script_fileUpload.js
similarity index 100%
rename from public/assets/js/pertek/script_fileUpload.js
rename to public/assets/js/backend/pertek/script_fileUpload.js
diff --git a/public/assets/js/pertek/script_pertanyaan.js b/public/assets/js/backend/pertek/script_pertanyaan.js
similarity index 100%
rename from public/assets/js/pertek/script_pertanyaan.js
rename to public/assets/js/backend/pertek/script_pertanyaan.js
diff --git a/public/assets/js/frontend/home/layanan.js b/public/assets/js/frontend/home/layanan.js
index 62ecdd1..b361b42 100644
--- a/public/assets/js/frontend/home/layanan.js
+++ b/public/assets/js/frontend/home/layanan.js
@@ -1,19 +1,188 @@
-document.getElementById("filter-button").addEventListener("click", function () {
-    const filterSection = document.getElementById("filter-section");
-    filterSection.classList.toggle("hidden");
+// Fetch Wilayah JSON
+fetch("/assets/json/home/wilayah.json")
+    .then((response) => response.json())
+    .then((data) => populateFilters(data))
+    .catch((error) => console.error("Gagal load wilayah.json:", error));
+
+function populateFilters(data) {
+    populateSelect("kabkota", data.kabkota);
+    populateSelect("kecamatan", data.kecamatan);
+    populateSelect("kelurahan", data.kelurahan);
+}
+
+function populateSelect(id, options) {
+    const select = document.getElementById(id);
+    if (!select) return;
+
+    select.innerHTML = options
+        .map(
+            (opt) => `
+    <option value="${opt.value}">${opt.label}</option>
+  `
+        )
+        .join("");
+}
+
+// Fetch Layanan JSON
+document.addEventListener("DOMContentLoaded", function () {
+    fetch("/assets/json/home/layanan.json")
+        .then((response) => response.json())
+        .then((data) => {
+            initializeLayanan(data);
+            setupUIHandlers();
+        })
+        .catch((error) => console.error("Gagal load layanan.json:", error));
 });
 
-document.getElementById("clear-filter").addEventListener("click", function () {
-    // Reset province and city dropdowns
-    document.getElementById("kabkota").value = "";
-    document.getElementById("kecamatan").value = "";
-    document.getElementById("kelurahan").value = "";
+function initializeLayanan(data) {
+    renderHeader(data.header);
+    renderTabs(data.tabs);
+    renderContents(data.contents);
+    changeTab("pertek");
+}
 
-    // Reset search input
-    const searchInput = document.querySelector('input[placeholder="Search"]');
-    if (searchInput) searchInput.value = "";
-});
+// Data Header
+function renderHeader(header) {
+    const headerContainer = document.querySelector("#layanan-header");
+    if (!headerContainer) return;
 
+    headerContainer.innerHTML = `
+      <h1 class="text-2xl sm:text-4xl font-bold text-blue-900">${header.title}</h1>
+      <p class="text-gray-700 mt-1 text-sm sm:text-base">${header.subtitle}</p>
+    `;
+}
+
+// Data Tabs
+function renderTabs(tabs) {
+    const tabsContainer = document.querySelector("#layanan-tabs");
+    if (!tabsContainer) return;
+
+    tabsContainer.innerHTML = tabs
+        .map(
+            (tab) => `
+      <button id="tab-${tab.id}"
+              class="tab-btn bg-white border border-gray-300 px-3 sm:px-6 py-2 rounded text-sm sm:text-base"
+              onclick="changeTab('${tab.id}')">
+        ${tab.label}
+      </button>
+    `
+        )
+        .join("");
+}
+
+// Data Contents
+function renderContents(contents) {
+    const contentsContainer = document.querySelector("#layanan-contents");
+    if (!contentsContainer) return;
+
+    contentsContainer.innerHTML = Object.entries(contents)
+        .map(([key, items]) => {
+            if (key === "audit") {
+                return `
+          <div id="content-${key}" class="tab-content hidden bg-white rounded overflow-hidden shadow">
+            ${renderAuditTable(items)}
+          </div>
+        `;
+            } else {
+                return `
+          <div id="content-${key}" class="tab-content hidden bg-blue-900 rounded overflow-hidden">
+            ${items.map((item) => renderStandardItem(item)).join("")}
+          </div>
+        `;
+            }
+        })
+        .join("");
+}
+
+function renderStandardItem(item) {
+    return `
+      <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
+        <div class="flex gap-3 sm:gap-4 w-full">
+          <div class="flex-shrink-0">
+            <div class="bg-blue-500 p-2 rounded">
+              <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+              </svg>
+            </div>
+          </div>
+          <div>
+            <h2 class="text-white font-bold text-sm sm:text-base">${item.title}</h2>
+            <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">${item.description}</p>
+            <a href="${item.link}" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
+          </div>
+        </div>
+        <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
+          <div class="text-white text-xs sm:text-sm text-right">${item.periode}</div>
+          <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
+        </div>
+      </div>
+    `;
+}
+
+function renderAuditTable(items) {
+    return `
+      <div class="overflow-x-auto">
+        <table class="w-full text-xs sm:text-base">
+          <thead>
+            <tr class="bg-blue-800 text-white">
+              <th class="py-2 sm:py-3 px-2 sm:px-4 text-left w-12 sm:w-16">No</th>
+              <th class="py-2 sm:py-3 px-2 sm:px-4 text-left">Nama PT</th>
+              <th class="py-2 sm:py-3 px-2 sm:px-4 text-left">Judul</th>
+              <th class="py-2 sm:py-3 px-2 sm:px-4 text-left hidden md:table-cell">Deskripsi</th>
+              <th class="py-2 sm:py-3 px-2 sm:px-4 text-center w-20 sm:w-32">Aksi</th>
+            </tr>
+          </thead>
+          <tbody>
+            ${items
+                .map(
+                    (item) => `
+              <tr class="border-b border-gray-200">
+                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">${item.no}</td>
+                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">${item.company}</td>
+                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">${item.title}</td>
+                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top hidden md:table-cell">
+                  <div class="max-h-24 sm:max-h-32 overflow-y-auto pr-2">${item.description}</div>
+                </td>
+                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">
+                  <button class="bg-green-500 text-white px-2 sm:px-4 py-1.5 sm:py-2 rounded w-full text-xs sm:text-sm">Download</button>
+                </td>
+              </tr>
+            `
+                )
+                .join("")}
+          </tbody>
+        </table>
+      </div>
+    `;
+}
+
+function setupUIHandlers() {
+    // Toggle filter section
+    const filterButton = document.getElementById("filter-button");
+    if (filterButton) {
+        filterButton.addEventListener("click", function () {
+            const filterSection = document.getElementById("filter-section");
+            if (filterSection) filterSection.classList.toggle("hidden");
+        });
+    }
+
+    // Clear filter inputs
+    const clearButton = document.getElementById("clear-filter");
+    if (clearButton) {
+        clearButton.addEventListener("click", function () {
+            document.getElementById("kabkota").value = "";
+            document.getElementById("kecamatan").value = "";
+            document.getElementById("kelurahan").value = "";
+
+            const searchInput = document.querySelector(
+                'input[placeholder="Search"]'
+            );
+            if (searchInput) searchInput.value = "";
+        });
+    }
+}
+
+// Tab switching function
 function changeTab(tabName) {
     const contentSections = document.querySelectorAll(".tab-content");
     contentSections.forEach((section) => {
@@ -27,13 +196,13 @@ function changeTab(tabName) {
     });
 
     const selectedTab = document.getElementById("tab-" + tabName);
-    selectedTab.classList.remove("bg-white", "border", "border-gray-300");
-    selectedTab.classList.add("bg-blue-900", "text-white");
+    if (selectedTab) {
+        selectedTab.classList.remove("bg-white", "border", "border-gray-300");
+        selectedTab.classList.add("bg-blue-900", "text-white");
+    }
 
     const selectedContent = document.getElementById("content-" + tabName);
-    selectedContent.classList.remove("hidden");
+    if (selectedContent) {
+        selectedContent.classList.remove("hidden");
+    }
 }
-
-document.addEventListener("DOMContentLoaded", function () {
-    changeTab("pertek");
-});
diff --git a/public/assets/js/frontend/home/popup.js b/public/assets/js/frontend/home/popup.js
index d288fbf..fe41eb9 100644
--- a/public/assets/js/frontend/home/popup.js
+++ b/public/assets/js/frontend/home/popup.js
@@ -1,17 +1,14 @@
 document.addEventListener("DOMContentLoaded", function () {
-    // Show popup with slight delay after page load
     setTimeout(function () {
         document.getElementById("popupBanner").classList.remove("hidden");
     }, 800);
 
-    // Close popup when clicking the close button
     document
         .getElementById("closePopup")
         .addEventListener("click", function () {
             document.getElementById("popupBanner").classList.add("hidden");
         });
 
-    // Close popup when clicking outside the banner
     document
         .getElementById("popupBanner")
         .addEventListener("click", function (e) {
@@ -20,7 +17,6 @@ document.addEventListener("DOMContentLoaded", function () {
             }
         });
 
-    // Slider functionality
     const slides = document.querySelectorAll(".banner-slide");
     const dots = document.querySelectorAll(".dot-indicator");
     let currentSlide = 0;
@@ -34,13 +30,11 @@ document.addEventListener("DOMContentLoaded", function () {
         currentSlide = index;
     }
 
-    // Auto slide every 5 seconds
     let slideInterval = setInterval(() => {
         let nextSlide = (currentSlide + 1) % slides.length;
         showSlide(nextSlide);
     }, 5000);
 
-    // Navigation buttons
     document.getElementById("nextSlide").addEventListener("click", function () {
         clearInterval(slideInterval);
         let nextSlide = (currentSlide + 1) % slides.length;
diff --git a/public/assets/js/frontend/news/newsvideo.js b/public/assets/js/frontend/news/newsvideo.js
new file mode 100644
index 0000000..caf6af4
--- /dev/null
+++ b/public/assets/js/frontend/news/newsvideo.js
@@ -0,0 +1,212 @@
+document.addEventListener("DOMContentLoaded", function () {
+    const loadMoreBtn = document.getElementById("load-more-btn");
+    const newsContainer = document.getElementById("news-container");
+    const videoContainer = document.getElementById("video-container");
+    const newsContent = document.getElementById("news-content");
+    const videoContent = document.getElementById("videos-content");
+    const tabs = document.querySelectorAll(".tab-btn");
+    const tabIndicator = document.getElementById("tab-indicator");
+
+    let newsOffset = 0;
+    let videoOffset = 0;
+    const itemsPerLoad = 3;
+
+    setTabIndicatorPosition(tabs[0]);
+    tabs[0].classList.add("text-white", "font-medium");
+
+    tabs.forEach((tab) => {
+        tab.addEventListener("click", () => {
+            setTabIndicatorPosition(tab);
+
+            tabs.forEach((t) => {
+                t.classList.remove("text-white", "font-medium");
+                t.classList.add("text-gray-600");
+            });
+            tab.classList.add("text-white", "font-medium");
+            tab.classList.remove("text-gray-600");
+
+            const targetTab = tab.getAttribute("data-tab");
+            document.querySelectorAll(".tab-content").forEach((content) => {
+                content.classList.add("hidden");
+            });
+            document
+                .getElementById(`${targetTab}-content`)
+                .classList.remove("hidden");
+
+            // Update button visibility when switching tabs
+            updateLoadMoreButtonVisibility();
+        });
+    });
+
+    function setTabIndicatorPosition(activeTab) {
+        tabIndicator.style.width = `${activeTab.offsetWidth}px`;
+        tabIndicator.style.left = `${activeTab.offsetLeft}px`;
+    }
+
+    function updateLoadMoreButtonVisibility() {
+        if (newsContent.classList.contains("hidden") === false) {
+            if (newsOffset >= moreArticles.length) {
+                loadMoreBtn.classList.add("hidden");
+            } else {
+                loadMoreBtn.classList.remove("hidden");
+            }
+        } else {
+            if (videoOffset >= moreVideos.length) {
+                loadMoreBtn.classList.add("hidden");
+            } else {
+                loadMoreBtn.classList.remove("hidden");
+            }
+        }
+    }
+
+    const moreArticles = [
+        {
+            image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
+            title: "Panduan Lengkap Perizinan AMDAL Terbaru",
+            description:
+                "Prosedur dan persyaratan terbaru untuk mendapatkan persetujuan AMDAL dalam proyek pembangunan skala besar di Indonesia...",
+            published_date: "10 April 2025",
+            slug: "panduan-perizinan-amdal-terbaru",
+        },
+        {
+            image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
+            title: "Regulasi UKL-UPL: Apa yang Perlu Diketahui",
+            description:
+                "Panduan praktis tentang dokumen Upaya Pengelolaan Lingkungan dan Upaya Pemantauan Lingkungan untuk usaha skala menengah...",
+            published_date: "12 April 2025",
+            slug: "regulasi-ukl-upl-terbaru",
+        },
+        {
+            image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
+            title: "Perubahan Kebijakan Perizinan Lingkungan 2025",
+            description:
+                "Analisis mendalam tentang perubahan kebijakan perizinan lingkungan dan dampaknya terhadap sektor industri di Indonesia...",
+            published_date: "15 April 2025",
+            slug: "perubahan-kebijakan-perizinan-lingkungan-2025",
+        },
+    ];
+    const moreVideos = [
+        {
+            src: "https://www.w3schools.com/html/movie.mp4",
+            title: "Tutorial Pengisian Formulir Izin Lingkungan",
+            description:
+                "Panduan langkah demi langkah cara mengisi formulir perizinan lingkungan dengan benar dan efisien...",
+            date: "8 April 2025",
+        },
+        {
+            src: "https://www.w3schools.com/html/movie.mp4",
+            title: "Proses Sidang Perizinan Lingkungan: Apa yang Harus Dipersiapkan",
+            description:
+                "Penjelasan detail tentang tahapan sidang perizinan lingkungan dan tips sukses menghadapinya...",
+            date: "11 April 2025",
+        },
+        {
+            src: "https://www.w3schools.com/html/movie.mp4",
+            title: "Studi Kasus: Penolakan Izin Lingkungan dan Solusinya",
+            description:
+                "Analisis kasus penolakan izin lingkungan dan strategi untuk mengatasi masalah perizinan yang umum terjadi...",
+            date: "14 April 2025",
+        },
+    ];
+
+    loadMoreBtn.addEventListener("click", function () {
+        const loadingText = loadMoreBtn.innerHTML;
+        loadMoreBtn.innerHTML = `
+            <svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+                <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+                <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+            </svg>
+            Loading...
+        `;
+
+        setTimeout(() => {
+            if (newsContent.classList.contains("hidden") === false) {
+                const remainingArticles = moreArticles.slice(
+                    newsOffset,
+                    newsOffset + itemsPerLoad
+                );
+                remainingArticles.forEach((article) => {
+                    const articleElement = createArticleElement(article);
+                    newsContainer.appendChild(articleElement);
+                });
+                newsOffset += remainingArticles.length;
+            } else {
+                const remainingVideos = moreVideos.slice(
+                    videoOffset,
+                    videoOffset + itemsPerLoad
+                );
+                remainingVideos.forEach((video) => {
+                    const videoElement = createVideoElement(video);
+                    videoContainer.appendChild(videoElement);
+                });
+                videoOffset += remainingVideos.length;
+            }
+
+            loadMoreBtn.innerHTML = loadingText;
+
+            updateLoadMoreButtonVisibility();
+        }, 1000);
+    });
+
+    updateLoadMoreButtonVisibility();
+
+    function createArticleElement(article) {
+        const div = document.createElement("div");
+        div.className =
+            "bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group";
+        div.innerHTML = `
+                <div class="relative overflow-hidden">
+                    <img src="${article.image}" alt="${article.title}" class="w-full h-56 object-cover transition-transform duration-500 group-hover:scale-110">
+                    <div class="absolute top-4 left-4">
+                        <span class="bg-blue-600 text-white text-xs font-semibold px-3 py-1.5 rounded-full shadow-md">${article.published_date}</span>
+                    </div>
+                </div>
+                <div class="p-6">
+                    <h3 class="text-xl font-bold mb-3 text-gray-800 group-hover:text-blue-600 transition-colors">${article.title}</h3>
+                    <p class="text-gray-600 mb-5 line-clamp-3">${article.description}</p>
+                    <a href="/news/${article.slug}" class="inline-flex items-center text-blue-600 font-medium group-hover:text-blue-800 transition-colors">
+                        <span>Baca Selengkapnya</span>
+                        <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                        </svg>
+                    </a>
+                </div>
+            `;
+        return div;
+    }
+
+    function createVideoElement(video) {
+        const div = document.createElement("div");
+        div.className =
+            "bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group";
+        div.innerHTML = `
+                <div class="relative overflow-hidden">
+                    <video class="w-full h-56 object-cover" poster="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" controls>
+                        <source src="${video.src}" type="video/mp4">
+                        Your browser does not support the video tag.
+                    </video>
+                    <div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center">
+                        <div class="bg-white/20 backdrop-blur-sm p-3 rounded-full">
+                            <svg class="w-12 h-12 text-white" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                                <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM9.555 7.168A1 1 0 008 8v4a1 1 0 001.555.832l3-2a1 1 0 000-1.664l-3-2z" clip-rule="evenodd"></path>
+                            </svg>
+                        </div>
+                    </div>
+                </div>
+                <div class="p-6">
+                    <div class="flex items-center mb-3">
+                        <span class="bg-indigo-100 text-indigo-800 text-xs font-semibold px-3 py-1 rounded-full">${video.date}</span>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-indigo-600 transition-colors">${video.title}</h3>
+                    <p class="text-gray-600 mb-5 line-clamp-3">${video.description}</p>
+                    <a href="#" class="inline-flex items-center text-indigo-600 font-medium group-hover:text-indigo-800 transition-colors">
+                        <span>Tonton Video</span>
+                        <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                        </svg>
+                    </a>
+                </div>
+            `;
+        return div;
+    }
+});
diff --git a/public/assets/json/home/faq.json b/public/assets/json/home/faq.json
new file mode 100644
index 0000000..fa0f5ee
--- /dev/null
+++ b/public/assets/json/home/faq.json
@@ -0,0 +1,14 @@
+[
+    {
+        "question": "Bagaimana mekanisme penapisan dengan hasil jenis dokumen SPPL?",
+        "answer": "Proses penapisan dilakukan untuk menentukan jenis dokumen yang sesuai berdasarkan kegiatan yang diajukan. Jika hasil penapisan menunjukkan bahwa jenis dokumen yang diperlukan adalah SPPL (Surat Pernyataan Pengelolaan Lingkungan), pengguna dapat mengikuti panduan penggunaan (manual guide) SPPL yang tersedia."
+    },
+    {
+        "question": "Bagaimana cara Validator Administrasi melakukan uji administrasi?",
+        "answer": "Validator Administrasi memeriksa kesesuaian berkas administrasi dengan cara mengklik menu AMDAL atau UKL-UPL, memilih menu sebelum rapat, dan mengakses tab Uji Admin. Validator menentukan kelengkapan administrasi dengan memberikan keterangan di kolom yang sesuai."
+    },
+    {
+        "question": "Apa yang harus dilakukan jika dokumen tidak lengkap?",
+        "answer": "Jika dokumen tidak lengkap, Validator Administrasi dapat mengembalikan berkas kepada pengguna dengan memberikan keterangan yang jelas mengenai kekurangan dokumen tersebut. Pengguna kemudian dapat memperbaiki dan mengunggah kembali dokumen yang diperlukan."
+    }
+]
diff --git a/public/assets/json/home/hero.json b/public/assets/json/home/hero.json
new file mode 100644
index 0000000..8129c8c
--- /dev/null
+++ b/public/assets/json/home/hero.json
@@ -0,0 +1,7 @@
+{
+    "background_image": "assets/images/home/bg-home.png",
+    "title_one": "for Smarter",
+    "title_two": "Environmental Documents",
+    "badge": "Digital Hub",
+    "subtitle": "Create. Track. Integrate. All your environmental documents in one place."
+}
diff --git a/public/assets/json/home/layanan.json b/public/assets/json/home/layanan.json
new file mode 100644
index 0000000..3b98103
--- /dev/null
+++ b/public/assets/json/home/layanan.json
@@ -0,0 +1,83 @@
+{
+    "header": {
+        "title": "Daftar Pengumuman & Informasi",
+        "subtitle": "Daftar Pengumuman dan Informasi terkait kegiatan yang mengajukan izin lingkungan"
+    },
+    "tabs": [
+        { "id": "pertek", "label": "PERTEK" },
+        { "id": "rintek", "label": "RINTEK" },
+        { "id": "amdal", "label": "AMDAL" },
+        { "id": "addendum", "label": "Addendum" },
+        { "id": "ukl-upl", "label": "UKL - UPL" },
+        { "id": "audit", "label": "AUDIT" }
+    ],
+    "contents": {
+        "pertek": [
+            {
+                "title": "Kegiatan Penggalian Kuarsa/Pasir Kuarsa, LUKITO HARTONO LAWY",
+                "description": "Dampak Potensials: Penurunan Kualitas Udara, Peningkatan Kebisingan, Peningkatan Air Larian, Peningkatan Timbulan Sampah, Terjadinya Gangguan Lalu Lintas, Terbukanya Kes",
+                "link": "#",
+                "periode": "27 Maret - 10 April 2025"
+            },
+            {
+                "title": "Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W",
+                "description": "Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis",
+                "link": "#",
+                "periode": "26 Maret - 9 April 2025"
+            }
+        ],
+        "rintek": [
+            {
+                "title": "Test Penggalian Kuarsa/Pasir Kuarsa, LUKITO HARTONO LAWY",
+                "description": "Dampak Potensials: Penurunan Kualitas Udara, Peningkatan Kebisingan, Peningkatan Air Larian, Peningkatan Timbulan Sampah, Terjadinya Gangguan Lalu Lintas, Terbukanya Kes",
+                "link": "#",
+                "periode": "27 Maret - 10 April 2025"
+            },
+            {
+                "title": "Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W",
+                "description": "Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis",
+                "link": "#",
+                "periode": "26 Maret - 9 April 2025"
+            }
+        ],
+        "amdal": [
+            {
+                "title": "Kegiatan Penggalian Kuarsa/Pasir Kuarsa, LUKITO HARTONO LAWY",
+                "description": "Dampak Potensials: Penurunan Kualitas Udara, Peningkatan Kebisingan, Peningkatan Air Larian, Peningkatan Timbulan Sampah, Terjadinya Gangguan Lalu Lintas, Terbukanya Kes",
+                "link": "#",
+                "periode": "27 Maret - 10 April 2025"
+            },
+            {
+                "title": "Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W",
+                "description": "Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis",
+                "link": "#",
+                "periode": "26 Maret - 9 April 2025"
+            }
+        ],
+        "addendum": [
+            {
+                "title": "Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W",
+                "description": "Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis",
+                "link": "#",
+                "periode": "26 Maret - 9 April 2025"
+            }
+        ],
+        "ukl-upl": [
+            {
+                "title": "Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W",
+                "description": "Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis",
+                "link": "#",
+                "periode": "26 Maret - 9 April 2025"
+            }
+        ],
+        "audit": [
+            {
+                "no": 1,
+                "company": "PT PETROKIMIA GRESIK",
+                "title": "PENGUMUMAN AUDIT LINGKUNGAN HIDUP WAJIB BERKALA INDUSTRI PETROKIMIA",
+                "description": "PT Petrokimia Gresik merupakan Kegiatan pada sektor Industri Petrokimia : Industri Pupuk dan Bahan Kimia (Amonia, Pupuk, Asam Sulfat, Asam Fosfat, dan Asam Klorida)...",
+                "link": "#"
+            }
+        ]
+    }
+}
diff --git a/public/assets/json/home/news.json b/public/assets/json/home/news.json
new file mode 100644
index 0000000..fba9daa
--- /dev/null
+++ b/public/assets/json/home/news.json
@@ -0,0 +1,162 @@
+[
+    {
+        "type": "news",
+        "date": "2024-12-11",
+        "title": "Pengenalan dan Uji Coba Aplikasi Perling untuk Mendukung Sistem Persetujuan Lingkungan",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Bogor, 11 Desember 2024 - Dalam upaya meningkatkan efisiensi sistem persetujuan lingkungan di Indonesia...",
+        "url": "/news/perling-uji-coba"
+    },
+    {
+        "type": "news",
+        "date": "2024-12-10",
+        "title": "Implementasi Sistem Monitoring Lingkungan Terbaru",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Jakarta, 10 Desember 2024 - Kementerian Lingkungan Hidup memperkenalkan sistem baru untuk monitoring kualitas lingkungan...",
+        "url": "/news/monitoring-lingkungan"
+    },
+    {
+        "type": "news",
+        "date": "2024-12-09",
+        "title": "Peresmian Pusat Data Lingkungan Hidup Nasional",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Jakarta, 9 Desember 2024 - Presiden meresmikan pusat data lingkungan hidup terbaru yang akan menjadi referensi nasional...",
+        "url": "/news/pusat-data-lingkungan"
+    },
+    {
+        "type": "news",
+        "date": "2024-12-07",
+        "title": "Workshop Pemanfaatan Aplikasi Perling untuk Pelaku Usaha",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Bandung, 7 Desember 2024 - KLHK mengadakan workshop untuk memperkenalkan fitur-fitur Perling kepada pelaku usaha...",
+        "url": "/news/workshop-perling"
+    },
+    {
+        "type": "news",
+        "date": "2024-12-05",
+        "title": "Kolaborasi Internasional dalam Pengelolaan Data Lingkungan",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Bali, 5 Desember 2024 - Indonesia menjalin kerja sama dengan beberapa negara ASEAN untuk pengelolaan data lingkungan...",
+        "url": "/news/kolaborasi-internasional"
+    },
+    {
+        "type": "news",
+        "date": "2024-12-03",
+        "title": "Inovasi Teknologi dalam Pengawasan Lingkungan",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Jakarta, 3 Desember 2024 - KLHK mengadopsi teknologi AI dan IoT untuk meningkatkan efektivitas pengawasan lingkungan...",
+        "url": "/news/inovasi-teknologi-lingkungan"
+    },
+    {
+        "type": "news",
+        "date": "2024-12-01",
+        "title": "Forum Diskusi Kebijakan Lingkungan Hidup 2025",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Surabaya, 1 Desember 2024 - Para pakar lingkungan berkumpul untuk membahas arah kebijakan lingkungan hidup tahun 2025...",
+        "url": "/news/forum-kebijakan-2025"
+    },
+    {
+        "type": "news",
+        "date": "2024-11-28",
+        "title": "Evaluasi Dampak Lingkungan Proyek Strategis Nasional",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Jakarta, 28 November 2024 - KLHK melakukan evaluasi menyeluruh terhadap dampak lingkungan dari proyek strategis nasional...",
+        "url": "/news/evaluasi-dampak-lingkungan"
+    },
+    {
+        "type": "news",
+        "date": "2024-11-25",
+        "title": "Penghargaan Perusahaan Ramah Lingkungan 2024",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Jakarta, 25 November 2024 - KLHK memberikan penghargaan kepada perusahaan-perusahaan yang konsisten menerapkan praktik ramah lingkungan...",
+        "url": "/news/penghargaan-ramah-lingkungan"
+    },
+    {
+        "type": "news",
+        "date": "2024-11-22",
+        "title": "Peluncuran Program Edukasi Lingkungan untuk Sekolah",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "description": "Yogyakarta, 22 November 2024 - KLHK bekerja sama dengan Kemendikbud meluncurkan program edukasi lingkungan untuk sekolah...",
+        "url": "/news/program-edukasi-lingkungan"
+    },
+    {
+        "type": "video",
+        "date": "2024-12-12",
+        "title": "Tutorial Lengkap Penggunaan Aplikasi Perling",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/perling-tutorial"
+    },
+    {
+        "type": "video",
+        "date": "2024-12-08",
+        "title": "Wawancara dengan Menteri LHK",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/wawancara-menteri"
+    },
+    {
+        "type": "video",
+        "date": "2024-12-06",
+        "title": "Webinar: Dampak Perubahan Iklim terhadap Keanekaragaman Hayati",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/webinar-perubahan-iklim"
+    },
+    {
+        "type": "video",
+        "date": "2024-12-04",
+        "title": "Dokumenter: Restorasi Hutan Mangrove Indonesia",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/dokumenter-mangrove"
+    },
+    {
+        "type": "video",
+        "date": "2024-12-01",
+        "title": "Diskusi Panel: Kebijakan Pengelolaan Limbah B3",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/diskusi-limbah-b3"
+    },
+    {
+        "type": "video",
+        "date": "2024-11-29",
+        "title": "Sosialisasi Peraturan Baru tentang Kualitas Udara",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/sosialisasi-kualitas-udara"
+    },
+    {
+        "type": "video",
+        "date": "2024-11-27",
+        "title": "Liputan Khusus: Inovasi Teknologi Ramah Lingkungan",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/inovasi-ramah-lingkungan"
+    },
+    {
+        "type": "video",
+        "date": "2024-11-24",
+        "title": "Workshop Virtual: Penggunaan Sistem Informasi Lingkungan",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/workshop-sistem-informasi"
+    },
+    {
+        "type": "video",
+        "date": "2024-11-21",
+        "title": "Dokumenter: Upaya Konservasi Spesies Langka Indonesia",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/konservasi-spesies"
+    },
+    {
+        "type": "video",
+        "date": "2024-11-19",
+        "title": "Panduan Praktis: Pengolahan Sampah Rumah Tangga",
+        "thumbnail": "https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg",
+        "embedUrl": "https://www.youtube.com/embed/Mb93OtlApAQ?si=njiEfYKiv6SCQB_Z",
+        "url": "/videos/pengolahan-sampah"
+    }
+]
diff --git a/public/assets/json/home/popup.json b/public/assets/json/home/popup.json
new file mode 100644
index 0000000..55af4d2
--- /dev/null
+++ b/public/assets/json/home/popup.json
@@ -0,0 +1,11 @@
+[
+    {
+        "slide_image": "assets/images/home/slider.jpg"
+    },
+    {
+        "slide_image": "assets/images/home/banner.webp"
+    },
+    {
+        "slide_image": "assets/images/home/slider.jpg"
+    }
+]
diff --git a/public/assets/json/home/wilayah.json b/public/assets/json/home/wilayah.json
new file mode 100644
index 0000000..ab1553e
--- /dev/null
+++ b/public/assets/json/home/wilayah.json
@@ -0,0 +1,22 @@
+{
+    "kabkota": [
+        { "value": "", "label": "Semua Kabupaten/Kota" },
+        { "value": "kepseribu", "label": "ADM. KEP. SERIBU" },
+        { "value": "jakpus", "label": "KOTA ADM. JAKARTA PUSAT" },
+        { "value": "jakut", "label": "KOTA ADM. JAKARTA UTARA" },
+        { "value": "jakbar", "label": "KOTA ADM. JAKARTA BARAT" },
+        { "value": "jaksel", "label": "KOTA ADM. JAKARTA SELATAN" },
+        { "value": "jaktim", "label": "KOTA ADM. JAKARTA TIMUR" }
+    ],
+    "kecamatan": [
+        { "value": "", "label": "Semua Kecamatan" },
+        { "value": "kepseribuutara", "label": "KEPULAUAN SERIBU UTARA" },
+        { "value": "kepseribuselatan", "label": "KEPULAUAN SERIBU SELATAN" }
+    ],
+    "kelurahan": [
+        { "value": "", "label": "Semua Kelurahan" },
+        { "value": "pulau_panggung", "label": "PULAU PANGGANG" },
+        { "value": "pulau_kelapa", "label": "PULAU KELAPA" },
+        { "value": "pulau_harapan", "label": "PULAU HARAPAN" }
+    ]
+}
diff --git a/public/robots.txt b/public/robots.txt
index 917a2a8..eb05362 100644
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -1,2 +1,2 @@
 User-agent: *
-Disallow:/
+Disallow:
diff --git a/resources/views/components/footer.blade.php b/resources/views/components/footer.blade.php
index 22e9dd4..d22927b 100644
--- a/resources/views/components/footer.blade.php
+++ b/resources/views/components/footer.blade.php
@@ -1,7 +1,7 @@
 <footer class="d-footer">
     <div class="row align-items-center justify-content-between">
         <div class="col-auto">
-            <p class="mb-0">© 2025 Perizinan Lingkungan. All Rights Reserved.</p>
+            <p class="mb-0">© {{ date('Y') }} Perizinan Lingkungan. All Rights Reserved.</p>
         </div>
     </div>
 </footer>
diff --git a/resources/views/components/frontend/home/faq.blade.php b/resources/views/components/frontend/home/faq.blade.php
index 4592bb7..0069248 100644
--- a/resources/views/components/frontend/home/faq.blade.php
+++ b/resources/views/components/frontend/home/faq.blade.php
@@ -1,84 +1,59 @@
 @push('css')
-    <link rel="stylesheet" href="{{ asset('assets/css/frontend/home/faq.css') }}">
+<link rel="stylesheet" href="{{ asset('assets/css/frontend/home/faq.css') }}">
 @endpush
 
 @push('script')
-    <script src="{{ asset('assets/js/frontend/home/faq.js') }}"></script>
+<script src="{{ asset('assets/js/frontend/home/faq.js') }}"></script>
 @endpush
 
 <section class="bg-gradient-to-b from-gray-50 to-gray-100 font-sans py-6">
-    <div class="container mx-auto max-w-7xl px-4">
+  <div class="container mx-auto max-w-7xl px-4">
+    <div class="flex flex-col md:flex-row gap-8">
+      <div>
+        <h2 class="text-2xl font-bold custom-blue mb-4">Frequently Asked Questions</h2>
 
-      <div class="flex flex-col md:flex-row gap-8">
-        <div>
-          <h2 class="text-2xl font-bold custom-blue mb-4">Frequently Asked Questions</h2>
-
-
-          <div class="faq-item bg-white rounded-xl shadow-sm hover:shadow-lg mb-5 overflow-hidden transition-all duration-300">
-            <div class="faq-header flex justify-between items-center p-5 cursor-pointer">
-              <div class="flex items-center gap-3">
-                <div class="faq-icon bg-blue-50 text-custom-blue p-2 rounded-full">
-                  <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                    <path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="#003296" stroke-width="2"/>
-                    <path d="M12 17V17.01M12 14C12.5523 14 13 13.5523 13 13V9.5C13 8.94772 12.5523 8.5 12 8.5C11.4477 8.5 11 8.94772 11 9.5V13C11 13.5523 11.4477 14 12 14Z" stroke="#003296" stroke-width="2" stroke-linecap="round"/>
-                  </svg>
-                </div>
-                <h3 class="text-lg font-semibold custom-blue">Bagaimana mekanisme penapisan dengan hasil jenis dokumen SPPL?</h3>
-              </div>
-              <div class="faq-toggle w-8 h-8 flex items-center justify-center text-custom-blue rounded-full transition-all duration-300">
-                <svg width="20" height="20" viewBox="0 0 24 24" class="transform transition-transform duration-300">
-                  <path d="M12 5V19M5 12H19" stroke="#003296" stroke-width="2" stroke-linecap="round"/>
+        @foreach($faqs as $faq)
+        <div class="faq-item bg-white rounded-xl shadow-sm hover:shadow-lg mb-5 overflow-hidden transition-all duration-300">
+          <div class="faq-header flex justify-between items-center p-5 cursor-pointer">
+            <div class="flex items-center gap-3">
+              <div class="faq-icon bg-blue-50 text-custom-blue p-2 rounded-full">
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                  <path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="#003296" stroke-width="2"/>
+                  <path d="M12 17V17.01M12 14C12.5523 14 13 13.5523 13 13V9.5C13 8.94772 12.5523 8.5 12 8.5C11.4477 8.5 11 8.94772 11 9.5V13C11 13.5523 11.4477 14 12 14Z" stroke="#003296" stroke-width="2" stroke-linecap="round"/>
                 </svg>
               </div>
+              <h3 class="text-lg font-semibold custom-blue">{{ $faq['question'] }}</h3>
             </div>
-            <div class="faq-content overflow-hidden max-h-0 transition-all duration-500 px-5">
-              <div class="py-5 border-t border-gray-100">
-                <p class="text-gray-600">Proses penapisan dilakukan untuk menentukan jenis dokumen yang sesuai berdasarkan kegiatan yang diajukan. Jika hasil penapisan menunjukkan bahwa jenis dokumen yang diperlukan adalah SPPL (Surat Pernyataan Pengelolaan Lingkungan), pengguna dapat mengikuti panduan penggunaan (manual guide) SPPL yang t</p>
-              </div>
+            <div class="faq-toggle w-8 h-8 flex items-center justify-center text-custom-blue rounded-full transition-all duration-300">
+              <svg width="20" height="20" viewBox="0 0 24 24" class="transform transition-transform duration-300">
+                <path d="M12 5V19M5 12H19" stroke="#003296" stroke-width="2" stroke-linecap="round"/>
+              </svg>
             </div>
           </div>
-
-          <div class="faq-item bg-white rounded-xl shadow-sm hover:shadow-lg mb-5 overflow-hidden transition-all duration-300">
-            <div class="faq-header flex justify-between items-center p-5 cursor-pointer">
-              <div class="flex items-center gap-3">
-                <div class="faq-icon bg-blue-50 text-custom-blue p-2 rounded-full">
-                  <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                    <path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="#003296" stroke-width="2"/>
-                    <path d="M12 17V17.01M12 14C12.5523 14 13 13.5523 13 13V9.5C13 8.94772 12.5523 8.5 12 8.5C11.4477 8.5 11 8.94772 11 9.5V13C11 13.5523 11.4477 14 12 14Z" stroke="#003296" stroke-width="2" stroke-linecap="round"/>
-                  </svg>
-                </div>
-                <h3 class="text-lg font-semibold custom-blue">Bagaimana cara Validator Administrasi melakukan uji administrasi?</h3>
-              </div>
-              <div class="faq-toggle w-8 h-8 flex items-center justify-center text-custom-blue rounded-full transition-all duration-300">
-                <svg width="20" height="20" viewBox="0 0 24 24" class="transform transition-transform duration-300">
-                  <path d="M12 5V19M5 12H19" stroke="#003296" stroke-width="2" stroke-linecap="round"/>
-                </svg>
-              </div>
-            </div>
-            <div class="faq-content overflow-hidden max-h-0 transition-all duration-500 px-5">
-              <div class="py-5 border-t border-gray-100">
-                <p class="text-gray-600">Validator Administrasi memeriksa kesesuaian berkas administrasi dengan cara mengklik menu AMDAL atau UKL-UPL, memilih menu sebelum rapat, dan mengakses tab Uji Admin. Validator menentukan kelengkapan administrasi dengan memberikan keterangan di kolom yang sesuai</p>
-              </div>
+          <div class="faq-content overflow-hidden max-h-0 transition-all duration-500 px-5">
+            <div class="py-5 border-t border-gray-100">
+              <p class="text-gray-600">{{ $faq['answer'] }}</p>
             </div>
           </div>
         </div>
+        @endforeach
 
-        <div>
-          <div class="bg-white rounded-xl shadow-sm p-6 border-l-4 border-custom-blue">
-            <h2 class="text-2xl font-bold custom-blue mb-6">Track Your Document</h2>
+      </div>
 
-            <div class="mb-6">
-              <label for="documentNumber" class="block text-sm font-medium text-gray-700 mb-2">Nomor Registrasi Kegiatan</label>
-              <div class="flex">
-                <input type="text" id="documentNumber" class="flex-grow px-4 py-2 border border-gray-300 rounded-l-lg focus:ring-2 focus:ring-blue-200 focus:border-custom-blue outline-none" placeholder="Masukkan Nomor Registrasi Kegiatan...">
-                <button class="bg-green-500 text-white px-5 py-2 rounded-r-lg hover:bg-blue-800 transition">
-                  Track
-                </button>
-              </div>
+      <div>
+        <div class="bg-white rounded-xl shadow-sm p-6 border-l-4 border-custom-blue">
+          <h2 class="text-2xl font-bold custom-blue mb-6">Track Your Document</h2>
+          <div class="mb-6">
+            <label for="documentNumber" class="block text-sm font-medium text-gray-700 mb-2">Nomor Registrasi Kegiatan</label>
+            <div class="flex">
+              <input type="text" id="documentNumber" class="flex-grow px-4 py-2 border border-gray-300 rounded-l-lg focus:ring-2 focus:ring-blue-200 focus:border-custom-blue outline-none" placeholder="Masukkan Nomor Registrasi Kegiatan...">
+              <button class="bg-green-500 text-white px-5 py-2 rounded-r-lg hover:bg-blue-800 transition">
+                Track
+              </button>
             </div>
           </div>
         </div>
       </div>
     </div>
+  </div>
 </section>
-
diff --git a/resources/views/components/frontend/home/hero.blade.php b/resources/views/components/frontend/home/hero.blade.php
index 80ab897..3132f35 100644
--- a/resources/views/components/frontend/home/hero.blade.php
+++ b/resources/views/components/frontend/home/hero.blade.php
@@ -4,17 +4,17 @@
 
 <section class="relative w-full overflow-hidden min-h-[600px] md:min-h-[800px]">
     <div class="absolute inset-0 z-0">
-        <img src="{{ asset('assets/images/home/bg-home.png') }}" alt="Hero Background" class="w-full h-full object-contain md:object-cover rounded-b-2xl">
+        <img src="{{ asset($heros['background_image']) }}" alt="Hero Background" class="w-full h-full object-contain md:object-cover rounded-b-2xl">
     </div>
 
     <div class="relative z-10 max-w-7xl mx-auto px-4 mt-20 md:mt-10" style="z-index: 0;>
         <div class="grid grid-cols-1 items-center">
             <div class="text-center space-y-6 animate-fade-in-up">
                 <h1 class="text-2xl sm:text-3xl lg:text-4xl font-bold text-gray-900 leading-tight">
-                    <span class="bg-blue-600 px-4 py-1 rounded-full text-white">Digital Hub</span> for Smarter</br> Environmental Documents
+                    <span class="bg-blue-600 px-4 py-1 rounded-full text-white">{{ $heros['badge'] }}</span> {{ $heros['title_one'] }}</br>{{ $heros['title_two'] }}
                 </h1>
                 <h6 class="text-xl text-gray-700">
-                    Create. Track. Integrate. All your environmental documents in one place.
+                    {{ $heros['subtitle'] }}
                 </h6>
             </div>
         </div>
diff --git a/resources/views/components/frontend/home/layanan.blade.php b/resources/views/components/frontend/home/layanan.blade.php
index a0bf080..fd45324 100644
--- a/resources/views/components/frontend/home/layanan.blade.php
+++ b/resources/views/components/frontend/home/layanan.blade.php
@@ -5,298 +5,73 @@
 <section class="bg-gray-100">
     <div class="container mx-auto max-w-7xl px-4 py-8 sm:py-15">
       <!-- Header -->
-      <div class="mb-4">
-        <h1 class="text-2xl sm:text-4xl font-bold text-blue-900">Daftar Pengumuman & Informasi</h1>
-        <p class="text-gray-700 mt-1 text-sm sm:text-base">Daftar Pengumuman dan Informasi terkait kegiatan yang mengajukan izin lingkungan</p>
-      </div>
+      <div id="layanan-header" class="mb-4"></div>
 
-      <!-- Filter Buttons and Search -->
+    {{-- Tabs (PERTEK, RINTEK, AMDAL, dll) --}}
     <div class="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3 mb-6">
-        <div class="flex flex-wrap gap-2 w-full sm:w-auto">
-            <button id="tab-pertek" class="tab-btn bg-white border border-gray-300 px-3 sm:px-6 py-2 rounded text-sm sm:text-base" onclick="changeTab('pertek')">PERTEK</button>
-            <button id="tab-rintek" class="tab-btn bg-white border border-gray-300 px-3 sm:px-6 py-2 rounded text-sm sm:text-base" onclick="changeTab('rintek')">RINTEK</button>
-            <button id="tab-amdal" class="tab-btn bg-white border border-gray-300 px-3 sm:px-6 py-2 rounded text-sm sm:text-base" onclick="changeTab('amdal')">AMDAL</button>
-            <button id="tab-addendum" class="tab-btn bg-white border border-gray-300 px-3 sm:px-6 py-2 rounded text-sm sm:text-base" onclick="changeTab('addendum')">Addendum</button>
-            <button id="tab-ukl-upl" class="tab-btn bg-white border border-gray-300 px-3 sm:px-6 py-2 rounded text-sm sm:text-base" onclick="changeTab('ukl-upl')">UKL - UPL</button>
-            <button id="tab-audit" class="tab-btn bg-blue-800 text-white px-3 sm:px-6 py-2 rounded text-sm sm:text-base" onclick="changeTab('audit')">AUDIT</button>
-        </div>
+        <div id="layanan-tabs" class="flex flex-wrap gap-2 w-full sm:w-auto"></div>
+
+        {{-- Search + Filter Section --}}
         <div class="flex gap-2 w-full sm:w-auto mt-3 sm:mt-0">
-            <div class="relative flex-grow sm:flex-grow-0">
-                <input type="text" placeholder="Search" class="pl-10 pr-3 py-2 border border-gray-300 rounded w-full sm:w-64">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 absolute left-3 top-2.5 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
-                </svg>
-            </div>
-            <div class="relative">
-                <button id="filter-button" class="bg-yellow-500 text-white px-4 sm:px-6 py-2 rounded flex items-center text-sm sm:text-base whitespace-nowrap">
-                    <svg xmlns="http://www.w3.org/2000/svg" class="h-4 sm:h-5 w-4 sm:w-5 mr-1 sm:mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z" />
-                    </svg>
-                    Filters
-                </button>
-            </div>
+        <div class="relative flex-grow sm:flex-grow-0">
+            <input type="text" placeholder="Search" class="pl-10 pr-3 py-2 border border-gray-300 rounded w-full sm:w-64">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 absolute left-3 top-2.5 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+        </div>
+        <div class="relative">
+            <button id="filter-button" class="bg-yellow-500 text-white px-4 sm:px-6 py-2 rounded flex items-center text-sm sm:text-base whitespace-nowrap">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 sm:h-5 w-4 sm:w-5 mr-1 sm:mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z" />
+            </svg>
+            Filters
+            </button>
+        </div>
         </div>
     </div>
 
-    <!-- Filter dropdown section - positioned below the filters button -->
+    {{-- Filter Section --}}
     <div id="filter-section" class="hidden w-full mb-6 bg-white border border-gray-200 rounded-md p-4 shadow-md">
         <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
-            <div>
-                <label for="kabkota" class="block text-sm font-medium text-gray-700 mb-1">Kabupaten/Kota</label>
-                <select id="kabkota" name="kabkota" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500">
-                    <option value="">Semua Kabupaten/Kota</option>
-                    <option value="kepseribu">ADM. KEP. SERIBU</option>
-                    <option value="jakpus">KOTA ADM. JAKARTA PUSAT</option>
-                    <option value="jakut">KOTA ADM. JAKARTA UTARA</option>
-                    <option value="jakbar">KOTA ADM. JAKARTA BARAT</option>
-                    <option value="jaksel">KOTA ADM. JAKARTA SELATAN</option>
-                    <option value="jaktim">KOTA ADM. JAKARTA TIMUR</option>
-                </select>
-            </div>
-            <div>
-                <label for="kecamatan" class="block text-sm font-medium text-gray-700 mb-1">Kecamatan</label>
-                <select id="kecamatan" name="kecamatan" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500">
-                    <option value="">Semua Kecamatan</option>
-                    <option value="kepseribuutara">KEPULAUAN SERIBU UTARA</option>
-                    <option value="kepseribuselatan">KEPULAUAN SERIBU SELATAN</option>
-                </select>
-            </div>
-            <div>
-                <label for="kelurahan" class="block text-sm font-medium text-gray-700 mb-1">Kelurahan</label>
-                <select id="kelurahan" name="kelurahan" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500">
-                    <option value="">Semua Kelurahan</option>
-                    <option value="kepseribuutara">PULAU PANGGANG</option>
-                    <option value="kepseribuselatan">PULAU KELAPA</option>
-                    <option value="kepseribuselatan">PULAU HARAPAN</option>
-                </select>
-            </div>
+          <div>
+            <label for="kabkota" class="block text-sm font-medium text-gray-700 mb-1">Kabupaten/Kota</label>
+            <select id="kabkota" name="kabkota" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500">
+              <option value="">Semua Kabupaten/Kota</option>
+              <option value="kepseribu">ADM. KEP. SERIBU</option>
+              <option value="jakpus">KOTA ADM. JAKARTA PUSAT</option>
+              <option value="jakut">KOTA ADM. JAKARTA UTARA</option>
+              <option value="jakbar">KOTA ADM. JAKARTA BARAT</option>
+              <option value="jaksel">KOTA ADM. JAKARTA SELATAN</option>
+              <option value="jaktim">KOTA ADM. JAKARTA TIMUR</option>
+            </select>
+          </div>
+          <div>
+            <label for="kecamatan" class="block text-sm font-medium text-gray-700 mb-1">Kecamatan</label>
+            <select id="kecamatan" name="kecamatan" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500">
+              <option value="">Semua Kecamatan</option>
+              <option value="kepseribuutara">KEPULAUAN SERIBU UTARA</option>
+              <option value="kepseribuselatan">KEPULAUAN SERIBU SELATAN</option>
+            </select>
+          </div>
+          <div>
+            <label for="kelurahan" class="block text-sm font-medium text-gray-700 mb-1">Kelurahan</label>
+            <select id="kelurahan" name="kelurahan" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500">
+              <option value="">Semua Kelurahan</option>
+              <option value="pulau_panggung">PULAU PANGGANG</option>
+              <option value="pulau_kelapa">PULAU KELAPA</option>
+              <option value="pulau_harapan">PULAU HARAPAN</option>
+            </select>
+          </div>
         </div>
+
         <div class="mt-4 flex justify-end gap-2">
-            <button id="clear-filter" class="bg-gray-600 text-white px-4 py-2 rounded text-sm">Clear Filter</button>
-            <button class="bg-blue-600 text-white px-4 py-2 rounded text-sm">Terapkan Filter</button>
-        </div>
-        </div>
-
-      <!-- Pertek Content -->
-      <div id="content-pertek" class="tab-content hidden bg-blue-900 rounded overflow-hidden">
-        <!-- Announcement 1 -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Kegiatan Penggalian Kuarsa/Pasir Kuarsa, LUKITO HARTONO LAWY</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Penurunan Kualitas Udara, Peningkatan Kebisingan, Peningkatan Air Larian, Peningkatan Timbulan Sampah, Terjadinya Gangguan Lalu Lintas, Terbukanya Kes</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">27 Maret - 10 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
-
-        <!-- Announcement 2 -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">26 Maret - 9 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
+          <button id="clear-filter" class="bg-gray-600 text-white px-4 py-2 rounded text-sm">Clear Filter</button>
+          <button class="bg-blue-600 text-white px-4 py-2 rounded text-sm">Terapkan Filter</button>
         </div>
       </div>
 
-       <!-- Rintek Content -->
-       <div id="content-rintek" class="tab-content hidden bg-blue-900 rounded overflow-hidden">
-        <!-- Announcement 1 -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Test Penggalian Kuarsa/Pasir Kuarsa, LUKITO HARTONO LAWY</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Penurunan Kualitas Udara, Peningkatan Kebisingan, Peningkatan Air Larian, Peningkatan Timbulan Sampah, Terjadinya Gangguan Lalu Lintas, Terbukanya Kes</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">27 Maret - 10 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
+      {{-- Konten Layanan --}}
+      <div id="layanan-contents"></div>
 
-        <!-- Announcement 2 -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">26 Maret - 9 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
-      </div>
-
-      <!-- AMDAL Content -->
-      <div id="content-amdal" class="tab-content hidden bg-blue-900 rounded overflow-hidden">
-        <!-- Announcement 1 -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Kegiatan Penggalian Kuarsa/Pasir Kuarsa, LUKITO HARTONO LAWY</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Penurunan Kualitas Udara, Peningkatan Kebisingan, Peningkatan Air Larian, Peningkatan Timbulan Sampah, Terjadinya Gangguan Lalu Lintas, Terbukanya Kes</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">27 Maret - 10 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
-
-        <!-- Announcement 2 -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">26 Maret - 9 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
-      </div>
-
-      <!-- Addendum Content -->
-      <div id="content-addendum" class="tab-content hidden bg-blue-900 rounded overflow-hidden">
-        <!-- Similar content as AMDAL but for Addendum -->
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">26 Maret - 9 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
-      </div>
-
-      <!-- UKL-UPL Content -->
-      <div id="content-ukl-upl" class="tab-content hidden bg-blue-900 rounded overflow-hidden">
-        <div class="border-b border-blue-800 p-4 sm:p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
-          <div class="flex gap-3 sm:gap-4 w-full">
-            <div class="flex-shrink-0">
-              <div class="bg-blue-500 p-2 rounded">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 sm:h-8 sm:w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                </svg>
-              </div>
-            </div>
-            <div>
-              <h2 class="text-white font-bold text-sm sm:text-base">Pembangunan Waterfront Malalayang, TARCISIUS ASWIN JULIZAR, W</h2>
-              <p class="text-blue-200 mt-1 sm:mt-2 text-xs sm:text-sm">Dampak Potensials: Pra Konstruksi 1. Persepsi Masyarakat Tahap Konstruksi 1. Peningkatan Kesempatan Kerja dan Berusaha 2. Peningkatan Sedimentasi 3. Perubahan Garis</p>
-              <a href="#" class="text-green-300 mt-1 block text-xs sm:text-sm">Baca selengkapnya ...</a>
-            </div>
-          </div>
-          <div class="flex flex-row sm:flex-col items-center sm:items-end justify-between sm:justify-end gap-2 w-full sm:w-auto mt-2 sm:mt-0">
-            <div class="text-white text-xs sm:text-sm text-right">26 Maret - 9 April 2025</div>
-            <button class="bg-green-500 text-white px-3 sm:px-6 py-1.5 sm:py-2 rounded text-xs sm:text-sm whitespace-nowrap">Berikan Tanggapan</button>
-          </div>
-        </div>
-      </div>
-
-      <!-- AUDIT Content - Table View -->
-      <div id="content-audit" class="tab-content bg-white rounded overflow-hidden shadow">
-        <div class="overflow-x-auto">
-          <table class="w-full text-xs sm:text-base">
-            <thead>
-              <tr class="bg-blue-800 text-white">
-                <th class="py-2 sm:py-3 px-2 sm:px-4 text-left w-12 sm:w-16">No</th>
-                <th class="py-2 sm:py-3 px-2 sm:px-4 text-left">Nama PT</th>
-                <th class="py-2 sm:py-3 px-2 sm:px-4 text-left">Judul</th>
-                <th class="py-2 sm:py-3 px-2 sm:px-4 text-left hidden md:table-cell">Deskripsi</th>
-                <th class="py-2 sm:py-3 px-2 sm:px-4 text-center w-20 sm:w-32">Aksi</th>
-              </tr>
-            </thead>
-            <tbody>
-              <tr class="border-b border-gray-200">
-                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">1</td>
-                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">PT PETROKIMIA GRESIK</td>
-                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">PENGUMUMAN AUDIT LINGKUNGAN HIDUP WAJIB BERKALA INDUSTRI PETROKIMIA</td>
-                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top hidden md:table-cell">
-                  <div class="max-h-24 sm:max-h-32 overflow-y-auto pr-2">
-                    PT Petrokimia Gresik merupakan Kegiatan pada sektor Industri Petrokimia : Industri Pupuk dan Bahan Kimia (Amonia, Pupuk, Asam Sulfat, Asam Fosfat, dan Asam Klorida) yang telah dikenakan Audit Lingkungan Hidup Wajib Berkala untuk kegiatan berisiko tinggi terhadap lingkungan berdasarkan Lampiran I Peraturan
-                  </div>
-                </td>
-                <td class="py-3 sm:py-4 px-2 sm:px-4 align-top">
-                  <button class="bg-green-500 text-white px-2 sm:px-4 py-1.5 sm:py-2 rounded w-full text-xs sm:text-sm">Download</button>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
     </div>
   </section>
diff --git a/resources/views/components/frontend/home/news.blade.php b/resources/views/components/frontend/home/news.blade.php
index a333158..dfa0258 100644
--- a/resources/views/components/frontend/home/news.blade.php
+++ b/resources/views/components/frontend/home/news.blade.php
@@ -7,15 +7,21 @@
 <link rel="stylesheet" href="{{ asset('assets/css/frontend/home/news.css') }}">
 @endpush
 
+@php
+    $featuredNews = $newsItems[0] ?? null;
+    $otherNews    = array_slice($newsItems, 1, 3);
+
+    $featuredVideo = $videoItems[0] ?? null;
+    $otherVideos   = array_slice($videoItems, 1, 3);
+@endphp
+
 <section class="news-section relative overflow-hidden py-20 bg-gradient-to-b from-[#0c1a3f] via-[#0c2a6f] to-[#0c1a3f]">
-    <!-- Advanced particle background -->
     <div class="container max-w-6xl mx-auto">
     <div class="absolute inset-0">
         <div id="particles-js" class="absolute inset-0 opacity-30"></div>
         <div class="absolute inset-0 bg-[radial-gradient(circle_at_30%_30%,rgba(12,42,111,0.8),rgba(8,8,40,0.9))] mix-blend-multiply"></div>
     </div>
 
-    <!-- Enhanced 3D floating elements -->
     <div class="absolute w-full h-full overflow-hidden pointer-events-none">
         <div class="absolute top-1/5 left-10 w-80 h-80 rounded-full mix-blend-screen opacity-10 animate-float-slow" style="background: radial-gradient(circle, rgba(139,92,246,0.8) 0%, rgba(76,29,149,0) 70%); filter: blur(60px);"></div>
         <div class="absolute bottom-1/4 right-5 w-96 h-96 rounded-full mix-blend-screen opacity-10 animate-float-slow-reverse" style="background: radial-gradient(circle, rgba(72,127,255,0.8) 0%, rgba(8,145,178,0) 70%); filter: blur(70px); animation-delay: 2s;"></div>
@@ -23,9 +29,7 @@
     </div>
 
     <div class="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
-        <!-- 3D Floating Section Header with perspective -->
         <div class="flex flex-col lg:flex-row lg:items-center lg:justify-between mb-16 perspective-hero relative z-10">
-            <!-- Sisi Kiri: Title and subtitle -->
             <div class="mb-10 lg:mb-0 lg:w-1/2">
                 <div class="relative">
                     <h2 class="text-5xl sm:text-6xl font-extrabold bg-clip-text mb-3 tracking-tight text-white">
@@ -37,7 +41,6 @@
                 </p>
             </div>
 
-            <!-- Sisi Kanan: Interactive 3D Glass Tabs -->
             <div class="lg:w-auto transform transition-all duration-500 hover:translate-y-[-5px]">
                 <div class="relative flex flex-row sm:flex-row p-1 sm:p-1.5 bg-white/5 backdrop-blur-xl border border-white/10 rounded-2xl shadow-2xl z-10 tab-glass-container">
                     <div class="absolute inset-0 rounded-2xl bg-gradient-to-r from-[#487fff]/20 to-purple-500/20 blur-xl transform scale-[0.96] z-0"></div>
@@ -61,21 +64,20 @@
                         </div>
                     </button>
                 </div>
-                <!-- Decorative element - hidden on small screens -->
                 <div class="absolute -right-4 -bottom-4 w-20 h-20 bg-gradient-to-br from-[#00c950]/30 to-[#487fff]/30 rounded-full blur-xl opacity-70 animate-pulse-slow hidden lg:block"></div>
             </div>
         </div>
 
         <!-- Konten Berita -->
         <div id="beritaContent" class="transition-all transform duration-500 opacity-100">
-            <!-- Berita Utama -->
+            @if($featuredNews)
             <div class="mb-12 rounded-2xl transform transition-all duration-500 group">
             <div class="bg-gradient-to-br from-black/80 to-indigo-950/50 backdrop-blur-md border border-white/10 overflow-hidden rounded-2xl">
                 <div class="lg:flex">
                 <div class="lg:w-3/5 xl:w-2/3 relative overflow-hidden">
                     <div class="absolute inset-0 bg-gradient-to-tr from-[#00c950]/40 to-[#487fff]/40 mix-blend-overlay opacity-50"></div>
                     <div class="parallax-container h-[400px] lg:h-full overflow-hidden">
-                    <img src="https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg" alt="Featured news"
+                    <img src="{{ $featuredNews['thumbnail'] }}" alt="Featured news"
                          class="w-full h-full object-cover parallax-img transform transition-transform duration-1000">
                     <div class="absolute inset-0 bg-gradient-to-t from-black via-black/50 to-transparent"></div>
                     </div>
@@ -87,16 +89,16 @@
                         <svg class="w-5 h-5 text-[#00c950]" fill="currentColor" viewBox="0 0 20 20">
                         <path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path>
                         </svg>
-                        <span class="text-[#00c950] text-sm font-medium">11 Desember 2024</span>
+                        <span class="text-[#00c950] text-sm font-medium"> {{ \Carbon\Carbon::parse($featuredNews['date'])->locale('id')->isoFormat('D MMMM YYYY') }}</span>
                     </div>
                     <h3 class="text-white font-black text-3xl my-4 leading-tight group-hover:text-[#00c950] transition-colors duration-300">
-                        Pengenalan dan Uji Coba Aplikasi Perling untuk Mendukung Sistem Persetujuan Lingkungan
+                        {{ $featuredNews['title'] }}
                     </h3>
                     <p class="text-gray-300 mb-8 line-clamp-3 text-lg">
-                        Bogor, 11 Desember 2024 - Dalam upaya meningkatkan efisiensi sistem persetujuan lingkungan di Indonesia, Kementerian Lingkungan Hidup dan Kehutanan telah meluncurkan aplikasi Perling yang inovatif...
+                        {{ $featuredNews['description'] }}
                     </p>
                     <div>
-                        <a href="{{ route('news.index') }}" class="group inline-flex items-center px-6 py-3 bg-gradient-to-r from-[#00c950] to-[#00c950] text-white text-sm font-medium rounded-lg overflow-hidden relative transition-all duration-300 hover:pr-9 hover:shadow-lg hover:shadow-[#00c950]/20">
+                        <a href="{{ route('news.detail') }}" class="group inline-flex items-center px-6 py-3 bg-gradient-to-r from-[#00c950] to-[#00c950] text-white text-sm font-medium rounded-lg overflow-hidden relative transition-all duration-300 hover:pr-9 hover:shadow-lg hover:shadow-[#00c950]/20">
                         <span>Baca Selengkapnya</span>
                         <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 ml-2 transform translate-x-0 group-hover:translate-x-1 transition-transform duration-300" viewBox="0 0 20 20" fill="currentColor">
                             <path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
@@ -109,29 +111,27 @@
                 </div>
             </div>
             </div>
+            @endif
 
             <!-- 3 Berita Tambahan -->
             <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 lg:gap-8">
-            @for($i = 0; $i < 3; $i++)
+            @foreach($otherNews as $news)
             <div class="news-card group transform hover:-translate-y-1 transition-all duration-500 overflow-hidden">
                 <div class="h-full flex flex-col bg-gradient-to-br from-black/60 to-indigo-950/20 backdrop-filter backdrop-blur-md border border-white/10 rounded-2xl shadow-lg hover:shadow-[#00c950]/10 hover:border-[#00c950]/20 transition-all duration-300">
                 <div class="relative overflow-hidden">
-                    <img src="https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg" alt="News thumbnail"
+                    <img src="{{ $news['thumbnail'] }}" alt="News thumbnail"
                      class="w-full h-64 object-cover transform group-hover:scale-105 transition-all duration-700 ease-in-out">
                     <div class="absolute inset-0 bg-gradient-to-t from-black via-black/70 to-transparent opacity-80"></div>
                     <div class="absolute bottom-0 left-0 w-full p-5">
                     <div class="flex items-center space-x-2">
-                        <span class="bg-black/40 backdrop-blur-sm text-white/90 px-3 py-1 rounded-full text-xs font-medium border border-white/10">{{ 11 - $i % 10 }} Desember 2024</span>
+                        <span class="bg-black/40 backdrop-blur-sm text-white/90 px-3 py-1 rounded-full text-xs font-medium border border-white/10">{{ \Carbon\Carbon::parse($news['date'])->locale('id')->isoFormat('D MMMM YYYY') }}</span>
                     </div>
-                    <h3 class="text-white font-bold text-xl mt-3 group-hover:text-[#00c950] transition-colors duration-300 line-clamp-2">{{ ['Implementasi Sistem Monitoring Lingkungan Terbaru', 'Kebijakan Pengelolaan Limbah untuk Industri', 'Teknologi Hijau untuk Smart City', 'Mitigasi Perubahan Iklim di Indonesia'][$i % 4] }}</h3>
+                    <h3 class="text-white font-bold text-xl mt-3 group-hover:text-[#00c950] transition-colors duration-300 line-clamp-2">{{ $news['title'] }}</h3>
                     </div>
                 </div>
                 <div class="p-5 pt-4 flex-grow flex flex-col">
                     <p class="text-gray-300 text-sm mb-5 flex-grow line-clamp-3">
-                    {{ ['Jakarta, 11 Desember 2024 - Kementerian Lingkungan Hidup memperkenalkan sistem baru untuk monitoring kualitas lingkungan yang mengintegrasikan teknologi IoT dan AI untuk pemantauan real-time.',
-                    'Pemerintah mengeluarkan kebijakan baru terkait pengelolaan limbah industri yang bertujuan untuk mengurangi dampak negatif terhadap lingkungan dan mendorong ekonomi sirkular.',
-                    'Smart city di Indonesia mulai mengadopsi teknologi hijau untuk mengurangi emisi karbon dan meningkatkan efisiensi energi dalam pengelolaan kota.',
-                    'Program mitigasi perubahan iklim baru diluncurkan untuk mengurangi emisi gas rumah kaca dan mempersiapkan masyarakat menghadapi dampak perubahan iklim.'][$i % 4] }}
+                        {{ $news['description'] }}
                     </p>
                     <a href="#" class="inline-flex items-center text-[#00c950] hover:text-white font-medium text-sm transition-all duration-300 group-hover:translate-x-1 mt-auto">
                     Baca selengkapnya
@@ -142,12 +142,13 @@
                 </div>
                 </div>
             </div>
-            @endfor
+            @endforeach
             </div>
         </div>
 
         <!-- Konten Video -->
         <div id="videoContent" class="transition-all transform duration-500 opacity-0 hidden">
+            @if($featuredVideo)
             <!-- Video Utama -->
             <div class="mb-12 rounded-2xl transform transition-all duration-500 group">
                 <div class="bg-gradient-to-br from-black/80 to-blue-950/50 backdrop-blur-md border border-white/10 overflow-hidden rounded-2xl">
@@ -156,7 +157,7 @@
                             <div class="absolute inset-0 bg-gradient-to-tr from-[#487fff]/30 to-purple-500/30 mix-blend-overlay opacity-50"></div>
                             <div class="h-[400px] lg:h-full">
                                 <div class="featured-video-preview relative h-full group">
-                                    <img src="https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg" alt="Featured video thumbnail"
+                                    <img src="{{ $featuredVideo['thumbnail'] }}" alt="Featured video thumbnail"
                                          class="w-full h-full object-cover brightness-[0.8] group-hover:brightness-[0.9] transition-all duration-500 group-hover:scale-105">
                                     <div class="absolute inset-0 bg-gradient-to-t from-black via-black/60 to-transparent"></div>
                                     <div class="absolute inset-0 flex items-center justify-center">
@@ -182,14 +183,11 @@
                                     <svg class="w-5 h-5 text-[#487fff]" fill="currentColor" viewBox="0 0 20 20">
                                         <path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path>
                                     </svg>
-                                    <span class="text-[#487fff] text-sm font-medium">10 Desember 2024</span>
+                                    <span class="text-[#487fff] text-sm font-medium"> {{ \Carbon\Carbon::parse($news['date'])->locale('id')->isoFormat('D MMMM YYYY') }}</span>
                                 </div>
                                 <h3 class="text-white font-black text-3xl my-4 leading-tight group-hover:text-[#487fff] transition-colors duration-300">
-                                    Tutorial Lengkap Penggunaan Aplikasi Perling
+                                    {{ $featuredVideo['title'] }}
                                 </h3>
-                                <p class="text-gray-300 mb-8 line-clamp-3 text-lg">
-                                    Video tutorial lengkap ini akan membantu Anda memahami semua fitur dan kemampuan dari aplikasi Perling terbaru yang dikeluarkan Kementerian Lingkungan Hidup...
-                                </p>
                                 <div>
                                     <a href="#" class="group inline-flex items-center px-6 py-3 bg-gradient-to-r from-[#487fff] to-[#487fff] text-white text-sm font-medium rounded-lg overflow-hidden relative transition-all duration-300 hover:pr-9 hover:shadow-lg hover:shadow-[#487fff]/20">
                                         <span>Tonton Video</span>
@@ -204,15 +202,16 @@
                     </div>
                 </div>
             </div>
+            @endif
 
             <!-- Video Tambahan -->
             <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 lg:gap-8">
-                @for($i = 0; $i < 3; $i++)
+                @foreach($otherVideos as $video)
                 <div class="video-card perspective-card group transform hover:-translate-y-1 transition-all duration-500 overflow-hidden">
                     <div class="h-full flex flex-col bg-gradient-to-br from-black/60 to-blue-950/20 backdrop-filter backdrop-blur-md border border-white/10 rounded-2xl shadow-lg hover:shadow-[#487fff]/10 hover:border-[#487fff]/20 transition-all duration-300 transform-3d group-hover:rotate-y-2 group-hover:rotate-x-2">
                         <div class="relative overflow-hidden">
                             <div class="video-preview h-64 cursor-pointer">
-                                <img src="https://s3.palapacloud.id/amdalnet/public/berita/_DEC2485.jpg" alt="Video thumbnail"
+                                <img src="{{ $video['thumbnail'] }}" alt="Video thumbnail"
                                      class="w-full h-full object-cover brightness-[0.85] group-hover:brightness-100 transition-all duration-500 transform group-hover:scale-105">
                                 <div class="absolute inset-0 bg-gradient-to-t from-black via-black/70 to-transparent"></div>
                                 <div class="absolute inset-0 flex items-center justify-center">
@@ -228,24 +227,15 @@
                         </div>
                         <div class="p-5 flex-grow flex flex-col">
                             <h3 class="text-white font-bold text-xl mb-3 group-hover:text-[#487fff] transition-colors duration-300 line-clamp-2">
-                                {{ ['Wawancara dengan Menteri LHK', 'Pembahasan UU Perlindungan Lingkungan', 'Tips Implementasi Kebijakan Lingkungan', 'Diskusi Panel: Masa Depan Energi Hijau', 'Panduan Lengkap AMDAL', 'Workshop Perling untuk Pemda'][$i % 6] }}
+                               {{ $video['title'] }}
                             </h3>
-                            <p class="text-gray-300 text-sm mb-5 flex-grow line-clamp-2">
-                                {{ ['Menteri Lingkungan Hidup dan Kehutanan berbicara tentang kebijakan terbaru dan rencana strategis...',
-                                'Diskusi mendalam mengenai UU Perlindungan Lingkungan yang baru disahkan dan implikasinya...',
-                                'Panduan praktis untuk mengimplementasikan kebijakan lingkungan yang efektif di daerah...',
-                                'Para ahli membahas tren dan inovasi dalam pengembangan energi hijau di Indonesia...',
-                                'Penjelasan detail tentang proses AMDAL dan perubahan terbaru dalam regulasinya...',
-                                'Workshop khusus untuk pemerintah daerah dalam menggunakan aplikasi Perling...'][$i % 6] }}
-                            </p>
                         </div>
                     </div>
                 </div>
-                @endfor
+                @endforeach
             </div>
         </div>
 
-        <!-- Enhanced "See More" button with 3D effect -->
         <div class="flex justify-center mt-20">
             <a href="/news" class="inline-flex items-center px-8 py-3 bg-green-500 text-white font-medium rounded-lg transition-all duration-300 hover:shadow-lg hover:shadow-[#487fff]/20 hover:-translate-y-1">
             <span>Lihat Selengkapnya</span>
diff --git a/resources/views/components/frontend/home/popup.blade.php b/resources/views/components/frontend/home/popup.blade.php
index 5d7ce14..2458c9a 100644
--- a/resources/views/components/frontend/home/popup.blade.php
+++ b/resources/views/components/frontend/home/popup.blade.php
@@ -8,52 +8,40 @@
 
 <div id="popupBanner" class="fixed inset-0 z-50 flex items-center justify-center bg-black/85 hidden">
     <div class="relative bg-white w-11/12 max-w-6xl rounded-lg shadow-2xl overflow-hidden">
-        <!-- Close button (now floating on top of content) -->
         <button id="closePopup" class="absolute right-3 top-3 z-10 text-gray-600 hover:text-gray-900 bg-white/80 rounded-full p-2">
             <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
             </svg>
         </button>
 
-        <!-- Simplified Slider container -->
         <div id="bannerSlider" class="relative overflow-hidden rounded-lg h-[200px] md:h-[500px]">
-            <!-- Slide 1 -->
-            <div class="banner-slide absolute inset-0">
-                 <img src="{{ asset ('assets/images/home/slider.jpg') }}"
-                     alt="Banner Image" class="w-full h-full object-cover">
-            </div>
+            @foreach($popup as $popup)
+                <!-- Slide Image -->
+                <div class="banner-slide absolute inset-0">
+                    <img src="{{ asset($popup['slide_image']) }}"
+                        alt="Banner Image" class="w-full h-full object-cover">
+                </div>
+            @endforeach
+        </div>
 
-            <!-- Slide 2 -->
-            <div class="banner-slide absolute inset-0 hidden">
-                      <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png"
-                     alt="Banner Image" class="w-full h-full object-cover">
-            </div>
+        <!-- Navigation -->
+        <button id="prevSlide" class="absolute left-3 top-1/2 -translate-y-1/2 bg-white/80 text-gray-800 rounded-full p-2">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
+            </svg>
+        </button>
 
-            <!-- Slide 3 -->
-            <div class="banner-slide absolute inset-0 hidden">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png"
-                     alt="Banner Image" class="w-full h-full object-cover">
-            </div>
+        <button id="nextSlide" class="absolute right-3 top-1/2 -translate-y-1/2 bg-white/80 text-gray-800 rounded-full p-2">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+            </svg>
+        </button>
 
-            <!-- Navigation -->
-            <button id="prevSlide" class="absolute left-3 top-1/2 -translate-y-1/2 bg-white/80 text-gray-800 rounded-full p-2">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
-                </svg>
-            </button>
-
-            <button id="nextSlide" class="absolute right-3 top-1/2 -translate-y-1/2 bg-white/80 text-gray-800 rounded-full p-2">
-                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
-                </svg>
-            </button>
-
-            <!-- Dots -->
-            <div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2">
-                <button class="w-3 h-3 rounded-full bg-white/50 dot-indicator active"></button>
-                <button class="w-3 h-3 rounded-full bg-white/50 dot-indicator"></button>
-                <button class="w-3 h-3 rounded-full bg-white/50 dot-indicator"></button>
-            </div>
+        <!-- Dots -->
+        <div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2">
+            <button class="w-3 h-3 rounded-full bg-white/50 dot-indicator active"></button>
+            <button class="w-3 h-3 rounded-full bg-white/50 dot-indicator"></button>
+            <button class="w-3 h-3 rounded-full bg-white/50 dot-indicator"></button>
         </div>
     </div>
 </div>
diff --git a/resources/views/components/frontend/news/index_news.blade.php b/resources/views/components/frontend/news/index_news.blade.php
index 58e049d..7ac2e8a 100644
--- a/resources/views/components/frontend/news/index_news.blade.php
+++ b/resources/views/components/frontend/news/index_news.blade.php
@@ -1,252 +1,194 @@
-<section class="relative bg-gray-100 font-sans" style="z-index: 9;">
-    <div class="bg-gradient-to-r from-blue-600 to-indigo-800 text-white" >
-        <div class="container mx-auto px-4 py-16 md:py-24">
+<section class="relative bg-gradient-to-b from-gray-50 to-white font-sans" style="z-index: 9;">
+    <div class="relative overflow-hidden bg-gradient-to-r from-blue-700 to-indigo-900 text-white">
+        <div class="absolute inset-0">
+            <svg class="absolute bottom-0 left-0 right-0 text-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
+                <path fill="currentColor" fill-opacity="0.05" d="M0,192L48,202.7C96,213,192,235,288,229.3C384,224,480,192,576,181.3C672,171,768,181,864,197.3C960,213,1056,235,1152,229.3C1248,224,1344,192,1392,176L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
+            </svg>
+            <svg class="absolute bottom-0 left-0 right-0 text-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
+                <path fill="currentColor" fill-opacity="0.1" d="M0,256L48,240C96,224,192,192,288,181.3C384,171,480,181,576,186.7C672,192,768,192,864,181.3C960,171,1056,149,1152,149.3C1248,149,1344,171,1392,181.3L1440,192L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
+            </svg>
+        </div>
+        <div class="container mx-auto px-4 py-20 md:py-28 relative">
             <div class="max-w-3xl mx-auto text-center">
-                <h1 class="text-4xl md:text-5xl font-bold mb-4">Berita & Updates</h1>
-                <p class="text-xl md:text-2xl opacity-90">Temukan informasi terbaru dan video menarik seputar Sistem Pengelolaan Dokumen Lingkungan dan kebijakan lingkungan hidup</p>
+                <h1 class="text-4xl md:text-5xl font-extrabold mb-6 leading-tight tracking-tight">
+                    Berita & Updates
+                </h1>
+                <p class="text-xl md:text-2xl opacity-90 font-light leading-relaxed">Temukan informasi terbaru dan video menarik seputar Sistem Pengelolaan Dokumen Lingkungan dan kebijakan lingkungan hidup</p>
             </div>
         </div>
     </div>
+
     <div class="container mx-auto px-4 py-12 max-w-7xl">
-        <!-- News Articles Grid -->
-        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" id="news-container">
-            <!-- Sample article 1 -->
-            <div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Teknologi AI" class="w-full h-48 object-cover">
-                <div class="p-5">
-                    <div class="flex items-center mb-3">
-                        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">5 April 2025</span>
-                    </div>
-                    <h3 class="text-xl font-bold mb-2">Kemajuan AI dalam Industri Kesehatan</h3>
-                    <p class="text-gray-600 mb-4">Bagaimana kecerdasan buatan merevolusi diagnosis dan perawatan dalam bidang medis...</p>
-                    <a href="{{ route('news.detail') }}" class="inline-flex items-center text-blue-600 hover:underline">
-                        Baca Selengkapnya
-                        <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                        </svg>
-                    </a>
-                </div>
-            </div>
-
-            <!-- Sample article 2 -->
-            <div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Robotika" class="w-full h-48 object-cover">
-                <div class="p-5">
-                    <div class="flex items-center mb-3">
-                        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">2 April 2025</span>
-                    </div>
-                    <h3 class="text-xl font-bold mb-2">Robot Asisten Rumah Tangga Masa Depan</h3>
-                    <p class="text-gray-600 mb-4">Perkembangan terbaru dalam robotika yang membantu pekerjaan rumah tangga sehari-hari...</p>
-                    <a href="#" class="inline-flex items-center text-blue-600 hover:underline">
-                        Baca Selengkapnya
-                        <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                        </svg>
-                    </a>
-                </div>
-            </div>
-
-            <!-- Sample article 3 -->
-            <div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Eksplorasi Luar Angkasa" class="w-full h-48 object-cover">
-                <div class="p-5">
-                    <div class="flex items-center mb-3">
-                        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">30 Maret 2025</span>
-                    </div>
-                    <h3 class="text-xl font-bold mb-2">Misi Mars Pertama dengan Awak Manusia</h3>
-                    <p class="text-gray-600 mb-4">Persiapan dan tantangan untuk misi bersejarah pengiriman manusia ke planet merah...</p>
-                    <a href="#" class="inline-flex items-center text-blue-600 hover:underline">
-                        Baca Selengkapnya
-                        <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                        </svg>
-                    </a>
-                </div>
-            </div>
-
-            <!-- Sample article 4 -->
-            <div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Energi Terbarukan" class="w-full h-48 object-cover">
-                <div class="p-5">
-                    <div class="flex items-center mb-3">
-                        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">25 Maret 2025</span>
-                    </div>
-                    <h3 class="text-xl font-bold mb-2">Terobosan Baru dalam Teknologi Panel Surya</h3>
-                    <p class="text-gray-600 mb-4">Efisiensi panel surya mencapai level tertinggi dengan material nano-photonic...</p>
-                    <a href="#" class="inline-flex items-center text-blue-600 hover:underline">
-                        Baca Selengkapnya
-                        <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                        </svg>
-                    </a>
-                </div>
-            </div>
-
-            <!-- Sample article 5 -->
-            <div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Komputasi Kuantum" class="w-full h-48 object-cover">
-                <div class="p-5">
-                    <div class="flex items-center mb-3">
-                        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">20 Maret 2025</span>
-                    </div>
-                    <h3 class="text-xl font-bold mb-2">Komputer Kuantum Merevolusi Kriptografi</h3>
-                    <p class="text-gray-600 mb-4">Implikasi dari pengembangan komputer kuantum terhadap keamanan data global...</p>
-                    <a href="#" class="inline-flex items-center text-blue-600 hover:underline">
-                        Baca Selengkapnya
-                        <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                        </svg>
-                    </a>
-                </div>
-            </div>
-
-            <!-- Sample article 6 -->
-            <div class="bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1">
-                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Bioteknologi" class="w-full h-48 object-cover">
-                <div class="p-5">
-                    <div class="flex items-center mb-3">
-                        <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">15 Maret 2025</span>
-                    </div>
-                    <h3 class="text-xl font-bold mb-2">CRISPR Menjadi Pilihan Utama Terapi Gen</h3>
-                    <p class="text-gray-600 mb-4">Perkembangan terapi gen dengan teknologi CRISPR untuk mengobati penyakit genetik...</p>
-                    <a href="#" class="inline-flex items-center text-blue-600 hover:underline">
-                        Baca Selengkapnya
-                        <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                        </svg>
-                    </a>
-                </div>
+        <div class="flex justify-center mb-10 relative">
+            <div class="bg-gray-100 rounded-full p-1.5 inline-flex shadow-md relative">
+                <button class="tab-btn text-lg px-6 py-2 rounded-full transition-all duration-300 relative z-10 font-medium" data-tab="news">Berita</button>
+                <button class="tab-btn text-lg px-6 py-2 rounded-full transition-all duration-300 relative z-10 text-gray-600" data-tab="videos">Video</button>
+                <div id="tab-indicator" class="absolute h-full top-0 rounded-full transition-all duration-300 bg-gradient-to-r from-blue-600 to-indigo-600 z-0"></div>
             </div>
         </div>
 
-        <!-- Load More Button -->
-        <div class="flex justify-center mt-10">
-            <button id="load-more-btn" class="bg-indigo-600 hover:bg-indigo-700 text-white font-bold py-3 px-8 rounded-lg transition-all duration-300 transform hover:scale-105 flex items-center" data-page="1">
-                <span>Lihat Artikel Lainnya</span>
-                <svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
+
+        <!-- News Section -->
+        <div class="tab-content" id="news-content">
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8" id="news-container">
+            <div class="bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group">
+                <div class="relative overflow-hidden">
+                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Perizinan Lingkungan" class="w-full h-56 object-cover transition-transform duration-500 group-hover:scale-110">
+                <div class="absolute top-4 left-4">
+                    <span class="bg-blue-600 text-white text-xs font-semibold px-3 py-1.5 rounded-full shadow-md">5 April 2025</span>
+                </div>
+                </div>
+                <div class="p-6">
+                <h3 class="text-xl font-bold mb-3 text-gray-800 group-hover:text-blue-600 transition-colors">Perubahan Terbaru dalam Regulasi Perizinan Lingkungan</h3>
+                <p class="text-gray-600 mb-5 line-clamp-3">Informasi mengenai pembaruan kebijakan perizinan lingkungan dan bagaimana hal ini akan memengaruhi proses pengajuan izin untuk perusahaan di berbagai sektor industri...</p>
+                <a href="#" class="inline-flex items-center text-blue-600 font-medium group-hover:text-blue-800 transition-colors">
+                    <span>Baca Selengkapnya</span>
+                    <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                </a>
+                </div>
+            </div>
+
+            <div class="bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group">
+                <div class="relative overflow-hidden">
+                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Perizinan Lingkungan" class="w-full h-56 object-cover transition-transform duration-500 group-hover:scale-110">
+                <div class="absolute top-4 left-4">
+                    <span class="bg-blue-600 text-white text-xs font-semibold px-3 py-1.5 rounded-full shadow-md">5 April 2025</span>
+                </div>
+                </div>
+                <div class="p-6">
+                <h3 class="text-xl font-bold mb-3 text-gray-800 group-hover:text-blue-600 transition-colors">Panduan Praktis Pengajuan AMDAL dan UKL-UPL</h3>
+                <p class="text-gray-600 mb-5 line-clamp-3">Tahapan dan persyaratan terkini dalam pengajuan dokumen AMDAL dan UKL-UPL yang perlu diperhatikan untuk mempercepat proses perizinan lingkungan...</p>
+                <a href="#" class="inline-flex items-center text-blue-600 font-medium group-hover:text-blue-800 transition-colors">
+                    <span>Baca Selengkapnya</span>
+                    <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                </a>
+                </div>
+            </div>
+
+            <div class="bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group">
+                <div class="relative overflow-hidden">
+                <img src="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" alt="Perizinan Lingkungan" class="w-full h-56 object-cover transition-transform duration-500 group-hover:scale-110">
+                <div class="absolute top-4 left-4">
+                    <span class="bg-blue-600 text-white text-xs font-semibold px-3 py-1.5 rounded-full shadow-md">5 April 2025</span>
+                </div>
+                </div>
+                <div class="p-6">
+                <h3 class="text-xl font-bold mb-3 text-gray-800 group-hover:text-blue-600 transition-colors">Digitalisasi Sistem Perizinan Lingkungan Nasional</h3>
+                <p class="text-gray-600 mb-5 line-clamp-3">Pemerintah meluncurkan platform digital terpadu untuk memudahkan proses pengajuan, pemantauan, dan perpanjangan izin lingkungan bagi pelaku usaha...</p>
+                <a href="#" class="inline-flex items-center text-blue-600 font-medium group-hover:text-blue-800 transition-colors">
+                    <span>Baca Selengkapnya</span>
+                    <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                </a>
+                </div>
+            </div>
+            </div>
+        </div>
+
+        <!-- Video Section -->
+        <div class="tab-content hidden" id="videos-content">
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8" id="video-container">
+            <div class="bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group">
+                <div class="relative overflow-hidden">
+                <video class="w-full h-56 object-cover" poster="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" controls>
+                    <source src="https://www.w3schools.com/html/movie.mp4" type="video/mp4">
+                    Your browser does not support the video tag.
+                </video>
+                <div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center">
+                    <div class="bg-white/20 backdrop-blur-sm p-3 rounded-full">
+                    <svg class="w-12 h-12 text-white" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM9.555 7.168A1 1 0 008 8v4a1 1 0 001.555.832l3-2a1 1 0 000-1.664l-3-2z" clip-rule="evenodd"></path>
+                    </svg>
+                    </div>
+                </div>
+                </div>
+                <div class="p-6">
+                <div class="flex items-center mb-3">
+                    <span class="bg-indigo-100 text-indigo-800 text-xs font-semibold px-3 py-1 rounded-full">5 April 2025</span>
+                </div>
+                <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-indigo-600 transition-colors">Panduan Praktis Perizinan Lingkungan Hidup</h3>
+                <p class="text-gray-600 mb-5 line-clamp-3">Langkah-langkah lengkap mengurus dokumen perizinan lingkungan sesuai dengan regulasi terbaru dan praktik terbaik...</p>
+                <a href="#" class="inline-flex items-center text-indigo-600 font-medium group-hover:text-indigo-800 transition-colors">
+                    <span>Tonton Video</span>
+                    <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                </a>
+                </div>
+            </div>
+
+            <div class="bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group">
+                <div class="relative overflow-hidden">
+                <video class="w-full h-56 object-cover" poster="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" controls>
+                    <source src="https://www.w3schools.com/html/movie.mp4" type="video/mp4">
+                    Your browser does not support the video tag.
+                </video>
+                <div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center">
+                    <div class="bg-white/20 backdrop-blur-sm p-3 rounded-full">
+                    <svg class="w-12 h-12 text-white" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM9.555 7.168A1 1 0 008 8v4a1 1 0 001.555.832l3-2a1 1 0 000-1.664l-3-2z" clip-rule="evenodd"></path>
+                    </svg>
+                    </div>
+                </div>
+                </div>
+                <div class="p-6">
+                <div class="flex items-center mb-3">
+                    <span class="bg-indigo-100 text-indigo-800 text-xs font-semibold px-3 py-1 rounded-full">5 April 2025</span>
+                </div>
+                <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-indigo-600 transition-colors">Tutorial Penyusunan Dokumen AMDAL yang Benar</h3>
+                <p class="text-gray-600 mb-5 line-clamp-3">Penjelasan detail tentang cara menyusun dokumen AMDAL yang memenuhi standar dan persyaratan dari Kementerian Lingkungan Hidup...</p>
+                <a href="#" class="inline-flex items-center text-indigo-600 font-medium group-hover:text-indigo-800 transition-colors">
+                    <span>Tonton Video</span>
+                    <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                </a>
+                </div>
+            </div>
+
+            <div class="bg-white rounded-xl overflow-hidden shadow-lg transition-all duration-300 hover:shadow-2xl hover:-translate-y-2 group">
+                <div class="relative overflow-hidden">
+                <video class="w-full h-56 object-cover" poster="https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png" controls>
+                    <source src="https://www.w3schools.com/html/movie.mp4" type="video/mp4">
+                    Your browser does not support the video tag.
+                </video>
+                <div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center">
+                    <div class="bg-white/20 backdrop-blur-sm p-3 rounded-full">
+                    <svg class="w-12 h-12 text-white" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM9.555 7.168A1 1 0 008 8v4a1 1 0 001.555.832l3-2a1 1 0 000-1.664l-3-2z" clip-rule="evenodd"></path>
+                    </svg>
+                    </div>
+                </div>
+                </div>
+                <div class="p-6">
+                <div class="flex items-center mb-3">
+                    <span class="bg-indigo-100 text-indigo-800 text-xs font-semibold px-3 py-1 rounded-full">5 April 2025</span>
+                </div>
+                <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-indigo-600 transition-colors">Sistem Online Perizinan Lingkungan Terpadu</h3>
+                <p class="text-gray-600 mb-5 line-clamp-3">Demo penggunaan platform digital terbaru untuk mengajukan, melacak, dan memperbarui dokumen perizinan lingkungan secara efisien...</p>
+                <a href="#" class="inline-flex items-center text-indigo-600 font-medium group-hover:text-indigo-800 transition-colors">
+                    <span>Tonton Video</span>
+                    <svg class="w-4 h-4 ml-2 transition-transform group-hover:translate-x-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                </a>
+                </div>
+            </div>
+            </div>
+        </div>
+
+        <div class="flex justify-center mt-12">
+            <button id="load-more-btn" class="group bg-gradient-to-r from-blue-600 to-indigo-700 text-white font-bold py-3.5 px-10 rounded-full transition-all duration-300 transform hover:-translate-y-1 hover:shadow-lg flex items-center">
+                <span>Lihat Lainnya</span>
+                <svg class="w-5 h-5 ml-2 transition-transform group-hover:translate-x-1" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
                 </svg>
             </button>
         </div>
-
-        <!-- JavaScript for Load More functionality -->
-        <script>
-            document.addEventListener('DOMContentLoaded', function() {
-                const loadMoreBtn = document.getElementById('load-more-btn');
-                const newsContainer = document.getElementById('news-container');
-
-                // Sample data for demonstration
-                const moreArticles = [
-                    {
-                        image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
-                        published_date: "10 Maret 2025",
-                        title: "Virtual Reality untuk Pendidikan Jarak Jauh",
-                        excerpt: "Bagaimana teknologi VR mengubah cara kita belajar dan mengajar dalam era digital",
-                        slug: "virtual-reality-pendidikan"
-                    },
-                    {
-                        image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
-                        published_date: "5 Maret 2025",
-                        title: "Mobil Terbang Mulai Uji Coba di Perkotaan",
-                        excerpt: "Prototipe mobil terbang memasuki fase uji coba di lingkungan perkotaan untuk pertama kalinya",
-                        slug: "mobil-terbang-uji-coba"
-                    },
-                    {
-                        image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
-                        published_date: "1 Maret 2025",
-                        title: "Interface Otak-Komputer Generasi Baru",
-                        excerpt: "Perangkat non-invasif baru memungkinkan kendali komputer hanya dengan pikiran",
-                        slug: "brain-computer-interface"
-                    },
-                    {
-                        image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
-                        published_date: "25 Februari 2025",
-                        title: "Daging Kultur Laboratorium Memasuki Pasar Global",
-                        excerpt: "Produksi daging dalam laboratorium mencapai skala komersial dan mulai tersedia untuk konsumen",
-                        slug: "daging-laboratorium"
-                    },
-                    {
-                        image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
-                        published_date: "20 Februari 2025",
-                        title: "Drone Pengirim Bantuan Medis di Daerah Terpencil",
-                        excerpt: "Jaringan drone otonom menyediakan layanan medis darurat ke wilayah yang sulit dijangkau",
-                        slug: "drone-medis"
-                    },
-                    {
-                        image: "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
-                        published_date: "15 Februari 2025",
-                        title: "Material Super-Konduktor Bekerja pada Suhu Ruangan",
-                        excerpt: "Penemuan material super-konduktor yang bekerja pada suhu kamar membuka peluang untuk revolusi energi",
-                        slug: "super-konduktor"
-                    }
-                ];
-
-                let currentPage = 1;
-                const totalPages = 3;
-
-                loadMoreBtn.addEventListener('click', function() {
-                    currentPage++;
-                    const loadingText = loadMoreBtn.innerHTML;
-
-                    // Show loading state
-                    loadMoreBtn.innerHTML = `
-                        <svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
-                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
-                        </svg>
-                        Loading...
-                    `;
-
-                    // Simulate AJAX request with setTimeout
-                    setTimeout(() => {
-                        if (currentPage <= totalPages) {
-                            // For demo, we'll just use our sample data
-                            moreArticles.forEach(article => {
-                                const articleElement = createArticleElement(article);
-                                newsContainer.appendChild(articleElement);
-                            });
-
-                            // If reached the last page, hide the button
-                            if (currentPage === totalPages) {
-                                loadMoreBtn.style.display = 'none';
-                            } else {
-                                loadMoreBtn.innerHTML = loadingText;
-                            }
-                        } else {
-                            // No more articles
-                            loadMoreBtn.innerHTML = 'Tidak ada artikel lagi';
-                            loadMoreBtn.disabled = true;
-                            loadMoreBtn.classList.remove('bg-indigo-600', 'hover:bg-indigo-700');
-                            loadMoreBtn.classList.add('bg-gray-400', 'cursor-not-allowed');
-                        }
-                    }, 1000);
-                });
-
-                // Helper function to create an article element
-                function createArticleElement(article) {
-                    const div = document.createElement('div');
-                    div.className = 'bg-white rounded-lg overflow-hidden shadow-md transition-transform duration-300 hover:shadow-lg hover:-translate-y-1';
-
-                    div.innerHTML = `
-                        <img src="${article.image}" alt="${article.title}" class="w-full h-48 object-cover">
-                        <div class="p-5">
-                            <div class="flex items-center mb-3">
-                                <span class="bg-blue-100 text-blue-800 text-xs font-semibold px-2.5 py-0.5 rounded">${article.published_date}</span>
-                            </div>
-                            <h3 class="text-xl font-bold mb-2">${article.title}</h3>
-                            <p class="text-gray-600 mb-4">${article.excerpt}</p>
-                            <a href="/news/${article.slug}" class="inline-flex items-center text-blue-600 hover:underline">
-                                Baca Selengkapnya
-                                <svg class="w-3.5 h-3.5 ml-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                                </svg>
-                            </a>
-                        </div>
-                    `;
-
-                    return div;
-                }
-            });
-        </script>
     </div>
 </section>
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index fc876e8..8e1e71a 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -9,109 +9,10 @@
                 <button type="button" class="sidebar-mobile-toggle">
                     <iconify-icon icon="heroicons:bars-3-solid" class="icon"></iconify-icon>
                 </button>
-                {{-- <form class="navbar-search">
-                    <input type="text" name="search" placeholder="Search">
-                    <iconify-icon icon="ion:search-outline" class="icon"></iconify-icon>
-                </form> --}}
             </div>
         </div>
         <div class="col-auto">
             <div class="d-flex flex-wrap align-items-center gap-3">
-                {{-- <button type="button" data-theme-toggle class="w-40-px h-40-px bg-neutral-200 rounded-circle d-flex justify-content-center align-items-center"></button>
-                <div class="dropdown d-none d-sm-inline-block">
-                    <button class="has-indicator w-40-px h-40-px bg-neutral-200 rounded-circle d-flex justify-content-center align-items-center" type="button" data-bs-toggle="dropdown">
-                        <img src="{{ asset('assets/images/lang-flag.png') }}" alt="image" class="w-24 h-24 object-fit-cover rounded-circle">
-                    </button>
-                    <div class="dropdown-menu to-top dropdown-menu-sm">
-                        <div class="py-12 px-16 radius-8 bg-primary-50 mb-16 d-flex align-items-center justify-content-between gap-2">
-                            <div>
-                                <h6 class="text-lg text-primary-light fw-semibold mb-0">Choose Your Language</h6>
-                            </div>
-                        </div>
-
-                        <div class="max-h-400-px overflow-y-auto scroll-sm pe-8">
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="english">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag1.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">English</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="english">
-                            </div>
-
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="japan">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag2.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">Japan</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="japan">
-                            </div>
-
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="france">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag3.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">France</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="france">
-                            </div>
-
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="germany">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag4.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">Germany</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="germany">
-                            </div>
-
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="korea">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag5.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">South Korea</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="korea">
-                            </div>
-
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="bangladesh">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag6.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">Bangladesh</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="bangladesh">
-                            </div>
-
-                            <div class="form-check style-check d-flex align-items-center justify-content-between mb-16">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="india">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag7.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">India</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="india">
-                            </div>
-                            <div class="form-check style-check d-flex align-items-center justify-content-between">
-                                <label class="form-check-label line-height-1 fw-medium text-secondary-light" for="canada">
-                                    <span class="text-black hover-bg-transparent hover-text-primary d-flex align-items-center gap-3">
-                                        <img src="{{ asset('assets/images/flags/flag8.png') }}" alt="" class="w-36-px h-36-px bg-success-subtle text-success-main rounded-circle flex-shrink-0">
-                                        <span class="text-md fw-semibold mb-0">Canada</span>
-                                    </span>
-                                </label>
-                                <input class="form-check-input" type="radio" name="crypto" id="canada">
-                            </div>
-                        </div>
-                    </div>
-                </div> --}}
-                <!-- Language dropdown end -->
 
                 <div class="dropdown">
                     <button class="has-indicator w-40-px h-40-px bg-neutral-200 rounded-circle d-flex justify-content-center align-items-center" type="button" data-bs-toggle="dropdown">
diff --git a/resources/views/components/sidebar.blade.php b/resources/views/components/sidebar.blade.php
index 38e7163..b96fbc8 100644
--- a/resources/views/components/sidebar.blade.php
+++ b/resources/views/components/sidebar.blade.php
@@ -18,11 +18,18 @@
                 </a>
             </li>
 
-            <li class="sidebar-menu-group-title">Perizinan</li>
+            <li>
+                <a href="{{ route('jadwal.index') }}">
+                  <iconify-icon icon="bi:calendar-date" class="menu-icon"></iconify-icon>
+                  <span>Penjadwalan</span>
+                </a>
+            </li>
+
+            <li class="sidebar-menu-group-title">Persetujuan Teknis</li>
             <li class="dropdown">
                 <a href="javascript:void(0)">
                   <iconify-icon icon="bi:file-earmark-medical" class="menu-icon"></iconify-icon>
-                  <span>Persetujuan Teknis</span>
+                  <span>PERTEK</span>
                 </a>
                  {{-- submenu --}}
                  <ul class="sidebar-submenu">
@@ -32,6 +39,12 @@
                         <span>Permohonan Arahan</span>
                         </a>
                     </li>
+                    <li>
+                        <a href="{{ route('pertek.index_slo') }}"><i class="text-primary-600 w-auto"></i>
+                        <iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
+                        <span>Permohonan SLO</span>
+                        </a>
+                    </li>
                     <li>
                         <a href="{{ route('pertek.index_emisi') }}"><i class="text-primary-600 w-auto"></i>
                             <iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
@@ -53,10 +66,12 @@
                 </ul>
             </li>
 
+            <li class="sidebar-menu-group-title">Rincian Teknis</li>
+
             <li class="dropdown">
                 <a href="javascript:void(0)">
                   <iconify-icon icon="bi:card-text" class="menu-icon"></iconify-icon>
-                  <span>Rincian Teknis</span>
+                  <span>RINTEK</span>
                 </a>
                  {{-- submenu --}}
                  <ul class="sidebar-submenu">
@@ -69,193 +84,93 @@
                 </ul>
             </li>
 
+            <li class="sidebar-menu-group-title">Persetujuan Lingkungan</li>
+
+            <li class="dropdown">
+                <a href="javascript:void(0)">
+                  <iconify-icon icon="bi:card-text" class="menu-icon"></iconify-icon>
+                  <span>PERLING</span>
+                </a>
+                 {{-- submenu --}}
+                 <ul class="sidebar-submenu">
+                    <li>
+                        <a href="{{ route('persetujuan.kerangka.index') }}"><i class="text-primary-600 w-auto"></i>
+                           <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                           <span>Permohonan Kerangka Acuan</span>
+                         </a>
+                   </li>
+                   <li>
+                       <a href="{{ route ('persetujuan.amdal.index') }}"><i class="text-primary-600 w-auto"></i>
+                         <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                         <span>Amdal</span>
+                       </a>
+                   </li>
+                   <li>
+                   <a href="{{ route('persetujuan.rkl.index') }}"><i class="text-primary-600 w-auto"></i>
+                           <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                           <span>Andal RKL-RPL</span>
+                         </a>
+                   </li>
+                   <li>
+                         <a href="{{ route('persetujuan.ukl.index') }}"><i class="text-primary-600 w-auto"></i>
+                           <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                           <span>UKL-UPL</span>
+                         </a>
+                   </li>
+                   <li>
+                         <a href="{{ route('persetujuan.addendum.index') }}"><i class="text-primary-600 w-auto"></i>
+                           <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                           <span>ADDENDUM</span>
+                         </a>
+                       </li>
+                       <li>
+                         <a href="{{ route('persetujuan.delh.index') }}"><i class="text-primary-600 w-auto"></i>
+                           <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                           <span>DELH</span>
+                         </a>
+                       </li>
+                       <li>
+                         <a href="{{ route('persetujuan.dplh.index') }}"><i class="text-primary-600 w-auto"></i>
+                           <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
+                           <span>DPLH</span>
+                         </a>
+                       </li>
+                </ul>
+            </li>
+
+
+            <li class="sidebar-menu-group-title">Pengaturan</li>
+            <li class="dropdown">
+                <a href="javascript:void(0)">
+                  <iconify-icon icon="bi:person-fill" class="menu-icon"></iconify-icon>
+                  <span>User</span>
+                </a>
+                {{-- submenu --}}
+                <ul class="sidebar-submenu">
+                    <li>
+                        <a href="#"><i class="text-primary-600 w-auto"></i>
+                        <iconify-icon icon="bi:person-fill" class="menu-icon"></iconify-icon>
+                        <span>Pengguna</span>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#"><i class="text-primary-600 w-auto"></i>
+                            <iconify-icon icon="bi:person-gear" class="menu-icon"></iconify-icon>
+                            <span>Roles & Akses</span>
+                        </a>
+                    </li>
+                </ul>
+            </li>
+
+
+            <li class="sidebar-menu-group-title">Konten</li>
             <li>
-                <a href="{{ route('jadwal.index') }}">
-                  <iconify-icon icon="bi:calendar-date" class="menu-icon"></iconify-icon>
-                  <span>Penjadwalan</span>
-                </a>
-            </li>
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
-                  <iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
-                  <span>Penugasan</span>
-                </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="{{ route('penugasan.index') }}"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
-                        <span>Semua Kegiatan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
-                            <span>Kegiatan Belum Ditugaskan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:list-task" class="menu-icon"></iconify-icon>
-                        <span>Kegiatan Sudah Ditugaskan</span>
-                        </a>
-                    </li>
-                </ul>
-            </li>
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
-                  <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
-                  <span>Amdal</span>
-                </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
-                        <span>Semua Kegiatan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
-                            <span>Sebelum Rapat</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:journal-text" class="menu-icon"></iconify-icon>
-                        <span>Sesudah Rapat</span>
-                        </a>
-                    </li>
-                </ul>
-            </li>
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
-                  <iconify-icon icon="bi:file-earmark-break" class="menu-icon"></iconify-icon>
-                  <span>UKL-UPL</span>
-                </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:file-earmark-break" class="menu-icon"></iconify-icon>
-                        <span>Semua Kegiatan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:file-earmark-break" class="menu-icon"></iconify-icon>
-                            <span>Sebelum Rapat</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:file-earmark-break" class="menu-icon"></iconify-icon>
-                        <span>Sesudah Rapat</span>
-                        </a>
-                    </li>
-                </ul>
-            </li>
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
-                  <iconify-icon icon="bi:file-earmark-minus"" class="menu-icon"></iconify-icon>
-                  <span>SPPL</span>
-                </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:file-earmark-minus"" class="menu-icon"></iconify-icon>
-                        <span>Penapisan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:file-earmark-minus"" class="menu-icon"></iconify-icon>
-                            <span>Terbit Otomatis</span>
-                        </a>
-                    </li>
-                </ul>
-            </li>
-
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
-                  <iconify-icon icon="bi:file-earmark-post" class="menu-icon"></iconify-icon>
-                  <span>ADDENDUM</span>
-                </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:file-earmark-post" class="menu-icon"></iconify-icon>
-                        <span>Semua Kegiatan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:file-earmark-post" class="menu-icon"></iconify-icon>
-                            <span>Sebelum Rapat</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:file-earmark-post" class="menu-icon"></iconify-icon>
-                        <span>Sesudah Rapat</span>
-                        </a>
-                    </li>
-                </ul>
-            </li>
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
-                  <iconify-icon icon="bi:activity" class="menu-icon"></iconify-icon>
-                  <span>Kegiatan</span>
-                </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:person-video" class="menu-icon"></iconify-icon>
-                        <span>Daftar Kegiatan</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:person-video" class="menu-icon"></iconify-icon>
-                            <span>Perubahan Dengan Dokumen</span>
-                        </a>
-                    </li>
-                </ul>
-            </li>
-
-            <li class="dropdown">
-                <a href="javascript:void(0)">
+                <a href="{{ route('news.index_newsvideo') }}">
                   <iconify-icon icon="bi:pencil-square" class="menu-icon"></iconify-icon>
-                  <span>Perubahan Persetujuan Lingkungan</span>
+                  <span>News & Video</span>
                 </a>
-                {{-- submenu --}}
-                <ul class="sidebar-submenu">
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                        <iconify-icon icon="bi:pencil-square" class="menu-icon"></iconify-icon>
-                        <span>File Browser</span>
-                        </a>
-                    </li>
-                    <li>
-                        <a href="#"><i class="text-primary-600 w-auto"></i>
-                            <iconify-icon icon="bi:pencil-square" class="menu-icon"></iconify-icon>
-                            <span>Data Pemrakarsa</span>
-                        </a>
-                    </li>
-                </ul>
             </li>
 
-
             <li class="sidebar-menu-group-title">Data Master</li>
 
             <li class="dropdown">
@@ -295,12 +210,6 @@
                             <span>Data Konsultan</span>
                         </a>
                     </li>
-                    <li class="dropdown">
-                        <a href="#">
-                        <iconify-icon icon="bi:pencil-square" class="menu-icon"></iconify-icon>
-                        <span>Data TUK</span>
-                        </a>
-                    </li>
                 </ul>
             </li>
         </ul>
diff --git a/resources/views/frontend/home.blade.php b/resources/views/frontend/home.blade.php
index 082cdd0..509a93e 100644
--- a/resources/views/frontend/home.blade.php
+++ b/resources/views/frontend/home.blade.php
@@ -10,11 +10,11 @@
 
 @section('content')
 
-@include('components.frontend.home.popup')
-@include('components.frontend.home.hero')
+@include('components.frontend.home.popup', ['popup' => $popup])
+@include('components.frontend.home.hero', ['heros' => $heros])
 @include('components.frontend.home.layanan')
-@include('components.frontend.home.faq')
-@include('components.frontend.home.news')
+@include('components.frontend.home.faq', ['faqs' => $faqs])
+@include('components.frontend.home.news', ['newsItems' => $newsItems, 'videoItems' => $videoItems])
 @include('components.frontend.footer')
 
 @endsection
diff --git a/resources/views/frontend/news.blade.php b/resources/views/frontend/news.blade.php
index f1a7475..13086c0 100644
--- a/resources/views/frontend/news.blade.php
+++ b/resources/views/frontend/news.blade.php
@@ -14,3 +14,9 @@
 @include('components.frontend.footer')
 
 @endsection
+
+
+@push('script')
+<script src="{{ asset('assets/js/frontend/news/newsvideo.js') }}"></script>
+@endpush
+
diff --git a/resources/views/news/create_news.blade.php b/resources/views/news/create_news.blade.php
new file mode 100644
index 0000000..29e9c8b
--- /dev/null
+++ b/resources/views/news/create_news.blade.php
@@ -0,0 +1,126 @@
+@extends('layout.layout')
+@php
+    $title='News/Video';
+    $subTitle = 'News/Video';
+    $script = '<script src="' . asset('assets/js/editor.highlighted.min.js') . '"></script>
+                 <script src="' . asset('assets/js/editor.quill.js') . '"></script>
+                 <script src="' . asset('assets/js/editor.katex.min.js') . '"></script>
+                    <script src="' . asset('assets/js/backend/news/upload_image.js') . '"></script>
+                 <script src="' . asset('assets/js/backend/news/embed.js') . '"></script>
+';
+@endphp
+
+@section('content')
+            <div class="row gy-4">
+                <div class="col-lg-12">
+                    <div class="card mt-24">
+                        <div class="card-header border-bottom">
+                            <h6 class="text-xl mb-0">Tambah Postingan</h6>
+                        </div>
+                        <div class="card-body p-24">
+                            <form action="#" class="d-flex flex-column gap-20">
+                                <div>
+                                    <label class="form-label fw-bold text-neutral-900" for="title">Judul</label>
+                                    <input type="text" class="form-control border border-neutral-200 radius-8" id="title" placeholder="Masukkan judul disini">
+                                </div>
+                                <div>
+                                    <label class="form-label fw-bold text-neutral-900">Kategori </label>
+                                    <select id="category-select" class="form-control border border-neutral-200 radius-8">
+                                        <option value="News">News</option>
+                                        <option value="Video">Video</option>
+                                        <option value="Popup Home">Popup Home</option>
+                                    </select>
+                                </div>
+                                <div>
+                                    <label class="form-label fw-bold text-neutral-900">Deskripsi </label>
+                                    <div class="border border-neutral-200 radius-8 overflow-hidden">
+                                        <div class="height-200">
+                                            <!-- Editor Toolbar Start -->
+                                            <div id="toolbar-container">
+                                                <span class="ql-formats">
+                                                    <select class="ql-font"></select>
+                                                    <select class="ql-size"></select>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-bold"></button>
+                                                    <button class="ql-italic"></button>
+                                                    <button class="ql-underline"></button>
+                                                    <button class="ql-strike"></button>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <select class="ql-color"></select>
+                                                    <select class="ql-background"></select>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-script" value="sub"></button>
+                                                    <button class="ql-script" value="super"></button>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-header" value="1"></button>
+                                                    <button class="ql-header" value="2"></button>
+                                                    <button class="ql-blockquote"></button>
+                                                    <button class="ql-code-block"></button>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-list" value="ordered"></button>
+                                                    <button class="ql-list" value="bullet"></button>
+                                                    <button class="ql-indent" value="-1"></button>
+                                                    <button class="ql-indent" value="+1"></button>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-direction" value="rtl"></button>
+                                                    <select class="ql-align"></select>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-link"></button>
+                                                    <button class="ql-image"></button>
+                                                    <button class="ql-video"></button>
+                                                    <button class="ql-formula"></button>
+                                                </span>
+                                                <span class="ql-formats">
+                                                    <button class="ql-clean"></button>
+                                                </span>
+                                            </div>
+                                            <!-- Editor Toolbar Start -->
+
+                                            <!-- Editor start -->
+                                            <div id="editor">
+                                                <p class="">Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis dolores explicabo corrupti, fuga</p>
+                                                <p><br></p>
+                                            </div>
+                                            <!-- Edit End -->
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div>
+                                    <label class="form-label fw-bold text-neutral-900">Upload Thumbnail </label>
+                                    <div class="upload-image-wrapper d-flex gap-3">
+                                        <div class="uploaded-img d-none position-relative h-160-px w-50 border input-form-light radius-8 overflow-hidden border-dashed bg-neutral-50">
+                                            <button type="button" class="uploaded-img__remove position-absolute top-0 end-0 z-1 text-2xxl line-height-1 me-8 mt-8 d-flex bg-danger-600 w-40-px h-40-px justify-content-center align-items-center rounded-circle">
+                                                <iconify-icon icon="radix-icons:cross-2" class="text-2xl text-white"></iconify-icon>
+                                            </button>
+                                            <img id="uploaded-img__preview" class="w-100 h-100 object-fit-contain" src="{{ asset('assets/images/user.png') }}" alt="image">
+                                        </div>
+                                        <label class="upload-file h-160-px w-50 border input-form-light radius-8 overflow-hidden border-dashed bg-neutral-50 bg-hover-neutral-200 d-flex align-items-center flex-column justify-content-center gap-1" for="upload-file">
+                                            <iconify-icon icon="solar:camera-outline" class="text-xl text-secondary-light"></iconify-icon>
+                                            <span class="fw-semibold text-secondary-light">Upload</span>
+                                            <input id="upload-file" type="file" hidden>
+                                        </label>
+                                    </div>
+                                </div>
+
+                                <div id="embed-link-field" class="d-none mt-4">
+                                    <label class="form-label fw-bold text-neutral-900" for="embed_link">Link Embed</label>
+                                    <input type="text" name="embed_link" id="embed_link" class="form-control border border-neutral-200 radius-8" placeholder="Masukkan URL embed di sini">
+                                </div>
+
+
+                                <button type="submit" class="btn btn-primary-600 radius-8">Submit</button>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+@endsection
diff --git a/resources/views/news/index_news.blade.php b/resources/views/news/index_news.blade.php
new file mode 100644
index 0000000..9de9bf8
--- /dev/null
+++ b/resources/views/news/index_news.blade.php
@@ -0,0 +1,82 @@
+@extends('layout.layout')
+
+@php
+    $title='News & Video';
+    $subTitle = 'News & Video';
+    $script= '<script src="' . asset('assets/js/homeOneChart.js') . '"></script>';
+@endphp
+
+@section('content')
+
+<div class="card basic-data-table">
+    <div class="card-header d-flex justify-content-between align-items-center">
+        <h5 class="card-title mb-0">
+        </h5>
+        <a href="{{ route('news.create_newsvideo') }}">
+        <button type="button" class="btn btn-primary-600 radius-8 px-20 py-11">Tambah Postingan</button>
+        </a>
+    </div>
+    <div class="card-body">
+        <div class="table-responsive">
+            <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                <thead>
+                    <tr>
+                        <th scope="col">
+                            <div class="form-check style-check d-flex align-items-center">
+                                <label class="form-check-label">
+                                    No
+                                </label>
+                            </div>
+                        </th>
+                        <th scope="col">Judul</th>
+                        <th scope="col">Thumbnail</th>
+                        <th scope="col">Tanggal Upload</th>
+                        <th scope="col">Tipe</th>
+                        <th scope="col">Pemohon</th>
+                        <th scope="col">Tanggal</th>
+                        <th scope="col">Status</th>
+                        <th scope="col">Dok</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>
+                            <div class="form-check style-check d-flex align-items-center">
+                                <label class="form-check-label">
+                                    01
+                                </label>
+                            </div>
+                        </td>
+                        {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                        <td>
+                            <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                            <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                        </td>
+
+                        @include('pertek.arahan.modal_detail_arahan')
+                        {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                        <td>
+                            <div class="d-flex align-items-center">
+                                {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                            </div>
+                        </td>
+                        <td>Pembangungan Gedung Baru</td>
+                        <td>UKL-UPL</td>
+                        <td>Charles Hasibuan</td>
+                        <td>21 Maret 2025</td>
+                        <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                        <td>
+                            <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                            </a>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>
+
+@endsection
diff --git a/resources/views/pengguna/index_user.blade.php b/resources/views/pengguna/index_user.blade.php
new file mode 100644
index 0000000..e69de29
diff --git a/resources/views/pengguna/roles_user.blade.php b/resources/views/pengguna/roles_user.blade.php
new file mode 100644
index 0000000..e69de29
diff --git a/resources/views/penjadwalan/jadwal_sidang.blade.php b/resources/views/penjadwalan/jadwal_sidang.blade.php
index c29f9ab..33936f8 100644
--- a/resources/views/penjadwalan/jadwal_sidang.blade.php
+++ b/resources/views/penjadwalan/jadwal_sidang.blade.php
@@ -279,14 +279,35 @@
                                                 <input class="form-check-input" type="radio" name="label" id="Family">
                                                 <label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Family">
                                                     <span class="w-8-px h-8-px bg-warning-600 rounded-circle"></span>
-                                                    Amdal
+                                                    Andal RKL-RPL
+                                                </label>
+                                            </div>
+                                            <div class="form-check checked-secondary d-flex align-items-center gap-2">
+                                                <input class="form-check-input" type="radio" name="label" id="Important">
+                                                <label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
+                                                    <span class="w-8-px h-8-px bg-info-600 rounded-circle"></span>
+                                                    Addendum
+                                                </label>
+                                            </div>
+                                            <div class="form-check checked-secondary d-flex align-items-center gap-2">
+                                                <input class="form-check-input" type="radio" name="label" id="Important">
+                                                <label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
+                                                    <span class="w-8-px h-8-px bg-pink rounded-circle"></span>
+                                                  DPLH
                                                 </label>
                                             </div>
                                             <div class="form-check checked-secondary d-flex align-items-center gap-2">
                                                 <input class="form-check-input" type="radio" name="label" id="Important">
                                                 <label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
                                                     <span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
-                                                    UKL-UPL
+                                                  DELH
+                                                </label>
+                                            </div>
+                                            <div class="form-check checked-secondary d-flex align-items-center gap-2">
+                                                <input class="form-check-input" type="radio" name="label" id="Important">
+                                                <label class="form-check-label line-height-1 fw-medium text-secondary-light text-sm d-flex align-items-center gap-1" for="Important">
+                                                    <span class="w-8-px h-8-px bg-lilac-600 rounded-circle"></span>
+                                                  UKL-UPL
                                                 </label>
                                             </div>
                                             {{-- <div class="form-check checked-danger d-flex align-items-center gap-2">
diff --git a/resources/views/persetujuanlingkungan/addendum/index_addendum.blade.php b/resources/views/persetujuanlingkungan/addendum/index_addendum.blade.php
new file mode 100644
index 0000000..e69de29
diff --git a/resources/views/persetujuanlingkungan/addendum/view_addendum.blade.php b/resources/views/persetujuanlingkungan/addendum/view_addendum.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/addendum/view_addendum.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/amdal/index_amdal.blade.php b/resources/views/persetujuanlingkungan/amdal/index_amdal.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/amdal/index_amdal.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/amdal/view_amdal.blade.php b/resources/views/persetujuanlingkungan/amdal/view_amdal.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/amdal/view_amdal.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/delh/index_delh.blade.php b/resources/views/persetujuanlingkungan/delh/index_delh.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/delh/index_delh.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/delh/view_delh.blade.php b/resources/views/persetujuanlingkungan/delh/view_delh.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/delh/view_delh.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/dplh/index_dplh.blade.php b/resources/views/persetujuanlingkungan/dplh/index_dplh.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/dplh/index_dplh.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/dplh/view_dplh.blade.php b/resources/views/persetujuanlingkungan/dplh/view_dplh.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/dplh/view_dplh.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/kerangka_acuan/create_kerangka_acuan.blade.php b/resources/views/persetujuanlingkungan/kerangka_acuan/create_kerangka_acuan.blade.php
new file mode 100644
index 0000000..21ba617
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/kerangka_acuan/create_kerangka_acuan.blade.php
@@ -0,0 +1,81 @@
+@extends('layout.layout')
+@php
+    $title='Permohonan Kerangka Acuan';
+    $subTitle = 'Permohonan Kerangka Acuan';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+
+            <div class="card basic-data-table">
+                <div class="card-header d-flex justify-content-between align-items-center">
+                    <a href="{{ route('pertek.create_arahan') }}">
+                    <button type="button" class="btn btn-primary-600 radius-8 px-20 py-11">Buat Permohonan</button>
+                    </a>
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+
+@endsection
diff --git a/resources/views/persetujuanlingkungan/kerangka_acuan/index_kerangka_acuan.blade.php b/resources/views/persetujuanlingkungan/kerangka_acuan/index_kerangka_acuan.blade.php
new file mode 100644
index 0000000..21ba617
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/kerangka_acuan/index_kerangka_acuan.blade.php
@@ -0,0 +1,81 @@
+@extends('layout.layout')
+@php
+    $title='Permohonan Kerangka Acuan';
+    $subTitle = 'Permohonan Kerangka Acuan';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+
+            <div class="card basic-data-table">
+                <div class="card-header d-flex justify-content-between align-items-center">
+                    <a href="{{ route('pertek.create_arahan') }}">
+                    <button type="button" class="btn btn-primary-600 radius-8 px-20 py-11">Buat Permohonan</button>
+                    </a>
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+
+@endsection
diff --git a/resources/views/persetujuanlingkungan/rkl/index_rkl.blade.php b/resources/views/persetujuanlingkungan/rkl/index_rkl.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/rkl/index_rkl.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/rkl/view_rkl.blade.php b/resources/views/persetujuanlingkungan/rkl/view_rkl.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/rkl/view_rkl.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/ukl/index_ukl.blade.php b/resources/views/persetujuanlingkungan/ukl/index_ukl.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/ukl/index_ukl.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/persetujuanlingkungan/ukl/view_ukl.blade.php b/resources/views/persetujuanlingkungan/ukl/view_ukl.blade.php
new file mode 100644
index 0000000..42800fa
--- /dev/null
+++ b/resources/views/persetujuanlingkungan/ukl/view_ukl.blade.php
@@ -0,0 +1,74 @@
+@extends('layout.layout')
+@php
+    $title='Amdal';
+    $subTitle = 'Amdal';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>UKL-UPL</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+@endsection
diff --git a/resources/views/pertek/arahan/create_arahan.blade.php b/resources/views/pertek/arahan/create_arahan.blade.php
index 52eadf9..a4dcdd8 100644
--- a/resources/views/pertek/arahan/create_arahan.blade.php
+++ b/resources/views/pertek/arahan/create_arahan.blade.php
@@ -2,108 +2,7 @@
 @php
     $title='Permohonan Surat Arahan Persetujuan Teknis';
     $subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
-    $script = ' <script>
-        // =============================== Wizard Step Js Start ================================
-        $(document).ready(function() {
-            // click on next button
-            $(".form-wizard-next-btn").on("click", function() {
-                var parentFieldset = $(this).parents(".wizard-fieldset");
-                var currentActiveStep = $(this).parents(".form-wizard").find(".form-wizard-list .active");
-                var next = $(this);
-                var nextWizardStep = true;
-                parentFieldset.find(".wizard-required").each(function(){
-                    var thisValue = $(this).val();
-
-                    if( thisValue == "") {
-                        $(this).siblings(".wizard-form-error").show();
-                        nextWizardStep = false;
-                    }
-                    else {
-                        $(this).siblings(".wizard-form-error").hide();
-                    }
-                });
-                if( nextWizardStep) {
-                    next.parents(".wizard-fieldset").removeClass("show","400");
-                    currentActiveStep.removeClass("active").addClass("activated").next().addClass("active","400");
-                    next.parents(".wizard-fieldset").next(".wizard-fieldset").addClass("show","400");
-                    $(document).find(".wizard-fieldset").each(function(){
-                        if($(this).hasClass("show")){
-                            var formAtrr = $(this).attr("data-tab-content");
-                            $(document).find(".form-wizard-list .form-wizard-step-item").each(function(){
-                                if($(this).attr("data-attr") == formAtrr){
-                                    $(this).addClass("active");
-                                    var innerWidth = $(this).innerWidth();
-                                    var position = $(this).position();
-                                    $(document).find(".form-wizard-step-move").css({"left": position.left, "width": innerWidth});
-                                }else{
-                                    $(this).removeClass("active");
-                                }
-                            });
-                        }
-                    });
-                }
-            });
-            //click on previous button
-            $(".form-wizard-previous-btn").on("click",function() {
-                var counter = parseInt($(".wizard-counter").text());;
-                var prev =$(this);
-                var currentActiveStep = $(this).parents(".form-wizard").find(".form-wizard-list .active");
-                prev.parents(".wizard-fieldset").removeClass("show","400");
-                prev.parents(".wizard-fieldset").prev(".wizard-fieldset").addClass("show","400");
-                currentActiveStep.removeClass("active").prev().removeClass("activated").addClass("active","400");
-                $(document).find(".wizard-fieldset").each(function(){
-                    if($(this).hasClass("show")){
-                        var formAtrr = $(this).attr("data-tab-content");
-                        $(document).find(".form-wizard-list .form-wizard-step-item").each(function(){
-                            if($(this).attr("data-attr") == formAtrr){
-                                $(this).addClass("active");
-                                var innerWidth = $(this).innerWidth();
-                                var position = $(this).position();
-                                $(document).find(".form-wizard-step-move").css({"left": position.left, "width": innerWidth});
-                            }else{
-                                $(this).removeClass("active");
-                            }
-                        });
-                    }
-                });
-            });
-            //click on form submit button
-            $(document).on("click",".form-wizard .form-wizard-submit" , function(){
-                var parentFieldset = $(this).parents(".wizard-fieldset");
-                var currentActiveStep = $(this).parents(".form-wizard").find(".form-wizard-list .active");
-                parentFieldset.find(".wizard-required").each(function() {
-                    var thisValue = $(this).val();
-                    if( thisValue == "" ) {
-                        $(this).siblings(".wizard-form-error").show();
-                    }
-                    else {
-                        $(this).siblings(".wizard-form-error").hide();
-                    }
-                });
-            });
-            // focus on input field check empty or not
-            $(".form-control").on("focus", function(){
-                var tmpThis = $(this).val();
-                if(tmpThis == "" ) {
-                    $(this).parent().addClass("focus-input");
-                }
-                else if(tmpThis !="" ){
-                    $(this).parent().addClass("focus-input");
-                }
-            }).on("blur", function(){
-                var tmpThis = $(this).val();
-                if(tmpThis == "" ) {
-                    $(this).parent().removeClass("focus-input");
-                    $(this).siblings(".wizard-form-error").show();
-                }
-                else if(tmpThis !="" ){
-                    $(this).parent().addClass("focus-input");
-                    $(this).siblings(".wizard-form-error").hide();
-                }
-            });
-        });
-        // =============================== Wizard Step Js End ================================
-    </script>';
+    $script = '<script src="' . asset('assets/js/backend/pertek/script_arahan.js') . '"></script>';
     $css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
 
 @endphp
@@ -111,7 +10,6 @@
 @section('content')
 
             <div class="row gy-4">
-
                 <div class="col-md-12">
                     <div class="card">
                         <div class="card-body">
@@ -149,11 +47,6 @@
                                             </li>
                                         </ul>
                                     </div>
-
-
-
-
-
                                     <fieldset class="wizard-fieldset show">
                                         <div class="card h-100 p-0 radius-12 overflow-hidden">
                                             <div class="card-header bg-light py-3">
diff --git a/resources/views/pertek/arahan/index_arahan.blade.php b/resources/views/pertek/arahan/index_arahan.blade.php
index f55d8c6..bbe741e 100644
--- a/resources/views/pertek/arahan/index_arahan.blade.php
+++ b/resources/views/pertek/arahan/index_arahan.blade.php
@@ -24,7 +24,6 @@
                                 <tr>
                                     <th scope="col">
                                         <div class="form-check style-check d-flex align-items-center">
-                                            {{-- <input class="form-check-input" type="checkbox"> --}}
                                             <label class="form-check-label">
                                                 No
                                             </label>
@@ -44,7 +43,6 @@
                                 <tr>
                                     <td>
                                         <div class="form-check style-check d-flex align-items-center">
-                                            {{-- <input class="form-check-input" type="checkbox"> --}}
                                             <label class="form-check-label">
                                                 01
                                             </label>
@@ -53,7 +51,7 @@
                                     {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
                                     <td>
                                         <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a>
-                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600">K24/User</a>
+                                        <a href="{{ route('pertek.user_arahan') }}" class="text-primary-600 bg-amber-300 rounded-2xl">65D47C214422D</a>
                                     </td>
 
                                     @include('pertek.arahan.modal_detail_arahan')
diff --git a/resources/views/pertek/arahan/user_view_arahan.blade copy.php b/resources/views/pertek/arahan/user_view_arahan.blade copy.php
deleted file mode 100644
index fb7264e..0000000
--- a/resources/views/pertek/arahan/user_view_arahan.blade copy.php	
+++ /dev/null
@@ -1,1064 +0,0 @@
-@extends('layout.layout')
-@php
-    $title='Permohonan Surat Arahan Persetujuan Teknis';
-    $subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
-    $script = ' <script>
-        // =============================== Wizard Step Js Start ================================
-        $(document).ready(function() {
-            // click on next button
-            $(".form-wizard-next-btn").on("click", function() {
-                var parentFieldset = $(this).parents(".wizard-fieldset");
-                var currentActiveStep = $(this).parents(".form-wizard").find(".form-wizard-list .active");
-                var next = $(this);
-                var nextWizardStep = true;
-                parentFieldset.find(".wizard-required").each(function(){
-                    var thisValue = $(this).val();
-
-                    if( thisValue == "") {
-                        $(this).siblings(".wizard-form-error").show();
-                        nextWizardStep = false;
-                    }
-                    else {
-                        $(this).siblings(".wizard-form-error").hide();
-                    }
-                });
-                if( nextWizardStep) {
-                    next.parents(".wizard-fieldset").removeClass("show","400");
-                    currentActiveStep.removeClass("active").addClass("activated").next().addClass("active","400");
-                    next.parents(".wizard-fieldset").next(".wizard-fieldset").addClass("show","400");
-                    $(document).find(".wizard-fieldset").each(function(){
-                        if($(this).hasClass("show")){
-                            var formAtrr = $(this).attr("data-tab-content");
-                            $(document).find(".form-wizard-list .form-wizard-step-item").each(function(){
-                                if($(this).attr("data-attr") == formAtrr){
-                                    $(this).addClass("active");
-                                    var innerWidth = $(this).innerWidth();
-                                    var position = $(this).position();
-                                    $(document).find(".form-wizard-step-move").css({"left": position.left, "width": innerWidth});
-                                }else{
-                                    $(this).removeClass("active");
-                                }
-                            });
-                        }
-                    });
-                }
-            });
-            //click on previous button
-            $(".form-wizard-previous-btn").on("click",function() {
-                var counter = parseInt($(".wizard-counter").text());;
-                var prev =$(this);
-                var currentActiveStep = $(this).parents(".form-wizard").find(".form-wizard-list .active");
-                prev.parents(".wizard-fieldset").removeClass("show","400");
-                prev.parents(".wizard-fieldset").prev(".wizard-fieldset").addClass("show","400");
-                currentActiveStep.removeClass("active").prev().removeClass("activated").addClass("active","400");
-                $(document).find(".wizard-fieldset").each(function(){
-                    if($(this).hasClass("show")){
-                        var formAtrr = $(this).attr("data-tab-content");
-                        $(document).find(".form-wizard-list .form-wizard-step-item").each(function(){
-                            if($(this).attr("data-attr") == formAtrr){
-                                $(this).addClass("active");
-                                var innerWidth = $(this).innerWidth();
-                                var position = $(this).position();
-                                $(document).find(".form-wizard-step-move").css({"left": position.left, "width": innerWidth});
-                            }else{
-                                $(this).removeClass("active");
-                            }
-                        });
-                    }
-                });
-            });
-            //click on form submit button
-            $(document).on("click",".form-wizard .form-wizard-submit" , function(){
-                var parentFieldset = $(this).parents(".wizard-fieldset");
-                var currentActiveStep = $(this).parents(".form-wizard").find(".form-wizard-list .active");
-                parentFieldset.find(".wizard-required").each(function() {
-                    var thisValue = $(this).val();
-                    if( thisValue == "" ) {
-                        $(this).siblings(".wizard-form-error").show();
-                    }
-                    else {
-                        $(this).siblings(".wizard-form-error").hide();
-                    }
-                });
-            });
-            // focus on input field check empty or not
-            $(".form-control").on("focus", function(){
-                var tmpThis = $(this).val();
-                if(tmpThis == "" ) {
-                    $(this).parent().addClass("focus-input");
-                }
-                else if(tmpThis !="" ){
-                    $(this).parent().addClass("focus-input");
-                }
-            }).on("blur", function(){
-                var tmpThis = $(this).val();
-                if(tmpThis == "" ) {
-                    $(this).parent().removeClass("focus-input");
-                    $(this).siblings(".wizard-form-error").show();
-                }
-                else if(tmpThis !="" ){
-                    $(this).parent().addClass("focus-input");
-                    $(this).siblings(".wizard-form-error").hide();
-                }
-            });
-        });
-        // =============================== Wizard Step Js End ================================
-    </script>';
-    $css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
-
-@endphp
-
-@section('content')
-<div class="row gy-4">
-
-    <div class="col-md-8">
-        <div class="card">
-            <div class="card-body">
-                <div class="d-flex justify-content-between align-items-center">
-                </div>
-
-                <!-- Form Wizard Start -->
-                <div class="form-wizard">
-                    <form action="#" method="post">
-                        <div class="form-wizard-header overflow-x-auto scroll-sm pb-8 my-32">
-                            <ul class="list-unstyled form-wizard-list style-two">
-                                <li class="form-wizard-list__item active">
-                                    <div class="form-wizard-list__line">
-                                        <span class="count">1</span>
-                                    </div>
-                                    <span class="text text-xs fw-semibold">Isian Pemohon</span>
-                                </li>
-                                <li class="form-wizard-list__item">
-                                    <div class="form-wizard-list__line">
-                                        <span class="count">2</span>
-                                    </div>
-                                    <span class="text text-xs fw-semibold">Persyaratan Izin</span>
-                                </li>
-                                <li class="form-wizard-list__item">
-                                    <div class="form-wizard-list__line">
-                                        <span class="count">3</span>
-                                    </div>
-                                    <span class="text text-xs fw-semibold">Timeline Status</span>
-                                </li>
-                            </ul>
-                        </div>
-
-
-                        <fieldset class="wizard-fieldset show">
-                            <div class="card h-100 p-0 radius-12 overflow-hidden">
-                                <div class="card-header bg-light py-3">
-                                    <div class="d-flex align-items-center">
-                                        <iconify-icon icon="bi:file-earmark-medical" class="text-xl text-primary-600 me-2"></iconify-icon>
-                                        <h6 class="mb-0 fw-semibold">Informasi Permohonan</h6>
-                                    </div>
-                                </div>
-                                <div class="card-body p-40">
-                                        <!-- Section Card: Data Pemohon -->
-                                        <div class="section-card mb-8">
-                                            <div class="section-header active" data-bs-toggle="collapse" href="#dataPemohon" role="button" aria-expanded="true" aria-controls="dataPemohon">
-                                                <iconify-icon icon="bi:person-fill" class="section-icon"></iconify-icon>
-                                                <h6 class="text-md mb-0">Data Pemohon</h6>
-                                                <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow rotated"></iconify-icon>
-                                            </div>
-                                            <div class="collapse show" id="dataPemohon">
-                                                <div class="section-content p-3">
-                                                    <div class="row">
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="name" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Pemohon <span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="NamaPemohon" placeholder="Masukkan Nama Pemohon" value="Charles Hasibuan">
-                                                                <div class="wizard-form-error"></div>
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="name" class="form-label fw-semibold text-primary-light text-sm mb-8">Jabatan <span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="Jabatan" placeholder="Masukkan Jabatan" value="Manager Operasional">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="email" class="form-label fw-semibold text-primary-light text-sm mb-8">Email <span class="text-danger-600">*</span></label>
-                                                                <input type="email" class="form-control radius-8 " id="Email" placeholder="Masukkan email address" value="charles.hasibuan@permatahijau.co.id">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="number" class="form-label fw-semibold text-primary-light text-sm mb-8">Nomor Telepon</label>
-                                                                <input type="number" class="form-control radius-8 " id="Telepon" placeholder="Masukkan Nomor Telepon" value="082134567890">
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Section Card: Data Kegiatan -->
-                                        <div class="section-card mb-8">
-                                            <div class="section-header" data-bs-toggle="collapse" href="#dataKegiatan" role="button" aria-expanded="false" aria-controls="dataKegiatan">
-                                                <iconify-icon icon="bi:building" class="section-icon"></iconify-icon>
-                                                <h6 class="text-md mb-0">Data Kegiatan</h6>
-                                                <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
-                                            </div>
-                                            <div class="collapse" id="dataKegiatan">
-                                                <div class="section-content p-3">
-                                                    <div class="row">
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="name" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Kegiatan <span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="NamaKegiatan" placeholder="Masukkan Nama Kegiatan" value="Pembangunan Gedung Baru">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="name" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Kegiatan <span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="JenisKegiatan" placeholder="Masukkan Jenis Kegiatan" value="Konstruksi">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="number" class="form-label fw-semibold text-primary-light text-sm mb-8">Pelaksana Kegiatan</label>
-                                                                <input type="text" class="form-control radius-8 " id="PelaksanaKegiatan" placeholder="Masukkan Pelaksana Kegiatan" value="PT. Permata Hijau">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="name" class="form-label fw-semibold text-primary-light text-sm mb-8">Alamat Kegiatan <span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="AlamatKegiatan" placeholder="Masukkan Alamat Kegiatan" value="Jl. Sudirman No. 123, Jakarta Pusat">
-                                                            </div>
-                                                        </div>
-
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Section Card: Detail Informasi -->
-                                        <div class="section-card mb-8">
-                                            <div class="section-header" data-bs-toggle="collapse" href="#detailInformasi" role="button" aria-expanded="false" aria-controls="detailInformasi">
-                                                <iconify-icon icon="bi:info-circle-fill" class="section-icon"></iconify-icon>
-                                                <h6 class="text-md mb-0">Detail Informasi</h6>
-                                                <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
-                                            </div>
-                                            <div class="collapse" id="detailInformasi">
-                                                <div class="section-content p-3">
-                                                    <div class="row">
-
-
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="Jenis Izin Lingkungan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Izin Lingkungan <span class="text-danger-600">*</span> </label>
-                                                                <select class="form-control radius-8  form-select" id="JenisIzinLingkungan">
-                                                                    <option disabled>Select Jenis Izin Lingkungan</option>
-                                                                    <option selected>Persetujuan Teknis - Pemenuhan Baku Mutu Emisi</option>
-                                                                    <option>Persetujuan Teknis - Pemenuhan Baku Mutu Air Limbah (Pembuangan)</option>
-                                                                    <option>Persetujuan Teknis - Pemenuhan Baku Mutu Air Limbah (Pemanfaatan)</option>
-                                                                    <option>Persetujuan Teknis - Pemenuhan Baku Mutu Limbah B3</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="number" class="form-label fw-semibold text-primary-light text-sm mb-8">Status Pemodalan</label>
-                                                                <input type="text" class="form-control radius-8 " id="StatusPemodalan" placeholder="Masukkan Status Pemodalan" value="PMA">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="NIB" class="form-label fw-semibold text-primary-light text-sm mb-8">NIB<span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="NIB" placeholder="NIB" value="8120306789123">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="KBLI" class="form-label fw-semibold text-primary-light text-sm mb-8">KBLI <span class="text-danger-600">*</span> </label>
-                                                                <select class="form-control radius-8  form-select" id="KBLI">
-                                                                    <option disabled>Pilih KBLI</option>
-                                                                    <option>10293.A (lndustri Pembekuan Bióta Air Lainnya)</option>
-                                                                    <option>10299 (lndustri Pengolahan dan Pengawetan lainnya untuk Biota Air Lainnya)</option>
-                                                                    <option selected>49431 (Angkutan Bermotor untuk Barang Umum)</option>
-                                                                    <option>10293 (lndustri Pembekuan Biota Air Lainnya)</option>
-                                                                    <option>46324 (Perdagangan Besar Hasil Olahan Perikanan)</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="Operasional Kegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Operasional Kegiatan<span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="OperasionalKegiatan" placeholder="Operasional Kegiatan" value="24 Jam">
-                                                            </div>
-                                                        </div>
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="Skala" class="form-label fw-semibold text-primary-light text-sm mb-8">Skala<span class="text-danger-600">*</span></label>
-                                                                <input type="text" class="form-control radius-8 " id="OperasionalKegiatan" placeholder="Skala" value="Menengah">
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                </div>
-                            </div>
-
-                            <div class="card h-100 p-0 mt-10 radius-12 overflow-hidden">
-                                <div class="card-header bg-light py-3">
-                                    <div class="d-flex align-items-center">
-                                        <iconify-icon icon="bi:patch-question" class="text-xl text-primary-600 me-2"></iconify-icon>
-                                        <h6 class="mb-0 fw-semibold">Pertanyaan</h6>
-                                    </div>
-                                </div>
-                                <div class="card-body p-40">
-                                        <!-- Apply the same section pattern for the second card -->
-                                        <div class="section-card mb-8">
-                                            <div class="section-header active" data-bs-toggle="collapse" href="#dataPemohon2" role="button" aria-expanded="true" aria-controls="dataPemohon2">
-                                                <iconify-icon icon="bi:person-fill" class="section-icon"></iconify-icon>
-                                                <h6 class="text-md mb-0">List Pertanyaan</h6>
-                                                <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow rotated"></iconify-icon>
-                                            </div>
-                                            <div class="collapse show" id="dataPemohon2">
-                                                <div class="section-content p-3">
-                                                    <div class="row">
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="KawasanIndustri" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah berada di lokasi kawasan industri ? <span class="text-danger-600">*</span> </label>
-                                                                <select class="form-control radius-8  form-select" id="KawasanIndustri">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option selected>Ya</option>
-                                                                    <option>Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="KawasanIndustri" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam Kawasan Lindung ?<span class="text-danger-600">*</span> </label>
-                                                                <select class="form-control radius-8  form-select" id="KawasanIndustri">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option>Ya</option>
-                                                                    <option selected>Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="KawasanIndustri" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam PIPPIB?<span class="text-danger-600">*</span> </label>
-                                                                <select class="form-control radius-8  form-select" id="KawasanIndustri">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option>Ya</option>
-                                                                    <option selected>Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-                                                        <div class="col-sm-6">
-                                                            <div class="mb-20">
-                                                                <label for="KawasanIndustri" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengumpulan limbah B3?<span class="text-danger-600">*</span> </label>
-                                                                <select class="form-control radius-8  form-select" id="KawasanIndustri">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option selected>Ya</option>
-                                                                    <option>Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-                                                        <div class="col-sm-12">
-                                                            <div class="mb-20">
-                                                                <label for="pengolahanAirLimbah" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengolahan air limbah ?<span class="text-danger-600">*</span></label>
-                                                                <select class="form-control radius-8  form-select" id="pengolahanAirLimbah" onchange="togglePengolahanFields()">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option value="Ya" selected>Ya</option>
-                                                                    <option value="Tidak">Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-                                                        <!-- Additional fields that appear when "Ya" is selected -->
-                                                        <div id="pengolahanAdditionalFields" class="col-12">
-                                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20 animate__animated animate__fadeIn">
-                                                                <div class="row">
-                                                                    <div class="col-sm-12 mb-3">
-                                                                        <div class="mb-20">
-                                                                            <label for="Skala" class="form-label fw-semibold text-primary-light text-sm mb-8">Jumlah IPAL yang telah beroperasi?<span class="text-danger-600">*</span></label>
-                                                                            <input type="text" class="form-control radius-8 " id="OperasionalKegiatan" placeholder="berapa Unit" value="2 Unit">
-                                                                        </div>
-                                                                        <div class="mb-20">
-                                                                            <div class="d-flex align-items-center">
-                                                                            <label for="catatanPengolahan" class="d-flex align-items-center gap-1 form-label fw-semibold text-primary-light text-sm mb-8">
-                                                                                <iconify-icon icon="bi:pencil-square" class="me-1"></iconify-icon>
-                                                                                Keterangan</span>
-                                                                            </label>
-                                                                            </div>
-                                                                            <textarea class="form-control radius-8 " id="catatanPengolahan" rows="3" placeholder="Masukkan catatan pengolahan air limbah">IPAL 1 untuk proses produksi, IPAL 2 untuk kegiatan domestik</textarea>
-                                                                        </div>
-                                                                    </div>
-                                                                    <div class="col-sm-12">
-                                                                        <div class="mb-20">
-                                                                            <label for="jenisPengolahan" class="form-label fw-semibold text-primary-light text-sm mb-8">
-                                                                                Apakah sebelumnya mempunyai izin IPAL? <span class="text-danger-600">*</span>
-                                                                            </label>
-                                                                            <select class="form-control radius-8  form-select" id="jenisPengolahan">
-                                                                                <option disabled>Pilih Jawaban</option>
-                                                                                <option selected>Ya</option>
-                                                                                <option>Tidak</option>
-                                                                            </select>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-
-                                                        <div class="col-sm-12">
-                                                            <div class="mb-20">
-                                                                <label for="emisiAirLimbah" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan emisi ?<span class="text-danger-600">*</span></label>
-                                                                <select class="form-control radius-8  form-select" id="emisiAirLimbah" onchange="toggleEmisiFields()">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option value="Ya" selected>Ya</option>
-                                                                    <option value="Tidak">Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-                                                        <!-- Additional fields that appear when "Ya" is selected -->
-                                                        <div id="emisiAdditionalFields" class="col-12">
-                                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20 animate__animated animate__fadeIn">
-                                                                <div class="row">
-                                                                    <div class="col-sm-12 mb-3">
-                                                                        <div class="mb-20">
-                                                                            <div class="d-flex align-items-center">
-                                                                            <label for="catatanPengolahan" class="d-flex align-items-center gap-1 form-label fw-semibold text-primary-light text-sm mb-8">
-                                                                                <iconify-icon icon="bi:pencil-square" class="me-1"></iconify-icon>
-                                                                                Keterangan</span>
-                                                                            </label>
-                                                                            </div>
-                                                                            <textarea class="form-control radius-8 " id="catatanPengolahan" rows="3" placeholder="Masukkan catatan emisi">Emisi berasal dari kegiatan genset dan boiler</textarea>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-
-                                                        <div class="col-sm-12">
-                                                            <div class="mb-20">
-                                                                <label for="hasilLimbahB3" class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan Limbah B3 ?<span class="text-danger-600">*</span></label>
-                                                                <select class="form-control radius-8  form-select" id="hasilLimbahB3" onchange="toggleLimbahFields()">
-                                                                    <option disabled>Pilih Jawaban</option>
-                                                                    <option value="Ya" selected>Ya</option>
-                                                                    <option value="Tidak">Tidak</option>
-                                                                </select>
-                                                            </div>
-                                                        </div>
-
-                                                        <!-- Additional fields that appear when "Ya" is selected -->
-                                                        <div id="limbahAdditionalFields" class="col-12">
-                                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20 animate__animated animate__fadeIn">
-                                                                <div class="row">
-                                                                    <div class="col-sm-12 mb-3">
-                                                                        <div class="mb-20">
-                                                                            <div class="d-flex align-items-center">
-                                                                            <label for="catatanPengolahan" class="d-flex align-items-center gap-1 form-label fw-semibold text-primary-light text-sm mb-8">
-                                                                                <iconify-icon icon="bi:pencil-square" class="me-1"></iconify-icon>
-                                                                                Keterangan</span>
-                                                                            </label>
-                                                                            </div>
-                                                                            <textarea class="form-control radius-8 " id="catatanPengolahan" rows="3" placeholder="Masukkan catatan Limbah B3">Limbah B3 berupa oli bekas, bahan kimia kadaluarsa, dan material terkontaminasi</textarea>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-
-
-                                        <div class="form-group d-flex align-items-center justify-content-end gap-8">
-                                            <button type="button" class="form-wizard-previous-btn btn btn-neutral-500 border-neutral-100 px-32">Simpan</button>
-                                            <button type="button" class="form-wizard-next-btn btn btn-primary-600 px-32">Berikutnya</button>
-                                        </div>
-                                </div>
-                            </div>
-
-
-                        </fieldset>
-
-                        <fieldset class="wizard-fieldset">
-                            <!-- Dokumen Persyaratan Section -->
-                            <div class="section-card">
-                                <div class="section-header mb-3">
-                                    <iconify-icon icon="bi:file-earmark-text" class="section-icon"></iconify-icon>
-                                    <h6 class="text-md mb-0">Dokumen Persyaratan</h6>
-                                </div>
-                                <div class="section-content">
-                                    <div class="row gy-4">
-                                        <!-- Surat Permohonan -->
-                                        <div class="col-12">
-                                            <div class="card border">
-                                                <div class="card-body">
-                                                    <div class="d-flex align-items-center justify-content-between mb-3">
-                                                        <div class="d-flex align-items-center">
-                                                            <div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">1</div>
-                                                            <label class="form-label required-field mb-0">Surat Permohonan</label>
-                                                        </div>
-                                                        <div class="d-flex align-items-center">
-                                                            <span class="badge bg-success-100 text-success-600 text-lg d-flex align-items-center">
-                                                                <iconify-icon icon="bi:check-circle-fill" class="me-1"></iconify-icon>
-                                                                Disetujui
-                                                            </span>
-                                                        </div>
-                                                    </div>
-
-                                                    <!-- File Preview Section -->
-                                                    <div class="file-preview-container mt-3" id="suratPermohonanPreview">
-                                                        <div class="border rounded p-3 bg-light d-flex align-items-start">
-                                                            <div class="preview-image me-3">
-                                                                <div class="preview-icon">
-                                                                    <iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
-                                                                </div>
-                                                            </div>
-                                                            <div class="flex-grow-1">
-                                                                <div class="d-flex justify-content-between align-items-start">
-                                                                    <div>
-                                                                        <h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">surat_permohonan.pdf</h6>
-                                                                        <p class="preview-filesize text-sm text-muted mb-0">1.2 MB</p>
-                                                                    </div>
-                                                                    <button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="suratPermohonan">
-                                                                        <iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
-                                                                    </button>
-                                                                </div>
-                                                                <div class="progress mt-2" style="height: 5px;">
-                                                                    <div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
-                                                                </div>
-                                                                <span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div class="mt-2">
-                                                        <small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
-
-                                                         <!-- Message Section -->
-                                                         <div class="mt-3 border-top pt-3">
-                                                            <!-- Message History Container -->
-                                                            <div class="message-history mb-3">
-                                                                <div class="d-flex flex-column gap-3">
-                                                                    <!-- Admin Message -->
-                                                                    <div class="d-flex gap-2">
-                                                                        <div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
-                                                                            <iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
-                                                                        </div>
-                                                                        <div style="max-width: 85%;">
-                                                                            <div class="fw-semibold text-xs mb-1">Admin Perizinan</div>
-                                                                            <div class="bg-light rounded p-2 px-3">
-                                                                                <div>Silahkan upload dokumen pendukung lainnya jika ada</div>
-                                                                                <div class="text-muted text-xs mt-1">10:30 AM</div>
-                                                                            </div>
-                                                                        </div>
-                                                                    </div>
-
-                                                                    <!-- User Message -->
-                                                                    <div class="d-flex flex-row-reverse gap-2">
-                                                                        <div class="avatar avatar-sm bg-primary-600 rounded-circle d-flex align-items-center justify-content-center">
-                                                                            <iconify-icon icon="bi:person-fill" class="text-white"></iconify-icon>
-                                                                        </div>
-                                                                        <div style="max-width: 85%;">
-                                                                            <div class="fw-semibold text-xs mb-1 text-end">Budi Santoso</div>
-                                                                            <div class="bg-primary-50 rounded p-2 px-3">
-                                                                                <div>Baik, saya akan upload dokumen tambahan</div>
-                                                                                <div class="text-muted text-xs mt-1">10:45 AM</div>
-                                                                            </div>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-
-                                                            <!-- Message Input -->
-                                                            <div class="d-flex gap-2">
-                                                                <textarea class="form-control" rows="2" placeholder="Tulis Pesan..."></textarea>
-                                                                <button type="button" class="btn btn-sm btn-primary-600 d-flex align-items-center align-self-end">
-                                                                    Kirim
-                                                                    <iconify-icon icon="f7:paperplane" class="text-white me-1"></iconify-icon>
-
-                                                                </button>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Dokumen Teknis Kegiatan -->
-                                        <div class="col-12">
-                                            <div class="card border">
-                                                <div class="card-body">
-                                                    <div class="d-flex align-items-center justify-content-between mb-3">
-                                                        <div class="d-flex align-items-center">
-                                                            <div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">2</div>
-                                                            <label class="form-label required-field mb-0">Dokumen Teknis Kegiatan</label>
-                                                        </div>
-                                                        <div class="d-flex align-items-center">
-                                                            <span class="badge bg-warning-100 text-warning-600 text-lg d-flex align-items-center">
-                                                                <iconify-icon icon="bi:exclamation-triangle" class="me-1"></iconify-icon>
-                                                                Perlu Perbaikan
-                                                            </span>
-                                                        </div>
-                                                    </div>
-
-                                                    <!-- File Preview Section -->
-                                                    <div class="file-preview-container mt-3" id="dokumenTeknisPreview">
-                                                        <div class="border rounded p-3 bg-light d-flex align-items-start">
-                                                            <div class="preview-image me-3">
-                                                                <div class="preview-icon">
-                                                                    <iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
-                                                                </div>
-                                                            </div>
-                                                            <div class="flex-grow-1">
-                                                                <div class="d-flex justify-content-between align-items-start">
-                                                                    <div>
-                                                                        <h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">dokumen_teknis.pdf</h6>
-                                                                        <p class="preview-filesize text-sm text-muted mb-0">2.5 MB</p>
-                                                                    </div>
-                                                                    <button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="dokumenTeknis">
-                                                                        <iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
-                                                                    </button>
-                                                                </div>
-                                                                <div class="progress mt-2" style="height: 5px;">
-                                                                    <div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
-                                                                </div>
-                                                                <span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div class="mt-2">
-                                                        <small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
-
-                                                        <!-- Message Section -->
-                                                        <div class="mt-3 border-top pt-3">
-                                                            <!-- Message History -->
-                                                            <div class="message-history mb-3">
-                                                                <div class="d-flex gap-2">
-                                                                    <div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
-                                                                        <iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
-                                                                    </div>
-                                                                    <div style="max-width: 85%;">
-                                                                        <div class="fw-semibold text-xs mb-1">Admin Perizinan</div>
-                                                                        <div class="bg-light rounded p-2 px-3">
-                                                                            <div>Mohon untuk memperbaiki dokumen teknis dengan menambahkan rincian proses pengolahan limbah</div>
-                                                                            <div class="text-muted text-xs mt-1">11:20 AM</div>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-
-                                                            <!-- Message Input -->
-                                                            <div class="d-flex gap-2">
-                                                                <textarea class="form-control" rows="2" placeholder="Tulis Pesan..."></textarea>
-                                                                <button type="button" class="btn btn-sm btn-primary-600 d-flex align-items-center align-self-end">
-                                                                    <iconify-icon icon="bi:send" class="text-white me-1"></iconify-icon>
-                                                                    Kirim
-                                                                </button>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Surat Pernyataan Keabsahan Dokumen -->
-                                        <div class="col-12">
-                                            <div class="card border">
-                                                <div class="card-body">
-                                                    <div class="d-flex align-items-center justify-content-between mb-3">
-                                                        <div class="d-flex align-items-center">
-                                                            <div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">3</div>
-                                                            <label class="form-label required-field mb-0">Surat Pernyataan Keabsahan Dokumen</label>
-                                                        </div>
-                                                        <div class="d-flex align-items-center">
-                                                            <span class="badge bg-warning-100 text-warning-600 text-lg d-flex align-items-center">
-                                                                <iconify-icon icon="bi:exclamation-triangle" class="me-1"></iconify-icon>
-                                                                Perlu Perbaikan
-                                                            </span>
-                                                        </div>
-                                                    </div>
-
-                                                    <!-- File Preview Section -->
-                                                    <div class="file-preview-container mt-3" id="suratPernyataanPreview">
-                                                        <div class="border rounded p-3 bg-light d-flex align-items-start">
-                                                            <div class="preview-image me-3">
-                                                                <div class="preview-icon">
-                                                                    <iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
-                                                                </div>
-                                                            </div>
-                                                            <div class="flex-grow-1">
-                                                                <div class="d-flex justify-content-between align-items-start">
-                                                                    <div>
-                                                                        <h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">surat_pernyataan.pdf</h6>
-                                                                        <p class="preview-filesize text-sm text-muted mb-0">0.8 MB</p>
-                                                                    </div>
-                                                                    <button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="suratPernyataan">
-                                                                        <iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
-                                                                    </button>
-                                                                </div>
-                                                                <div class="progress mt-2" style="height: 5px;">
-                                                                    <div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
-                                                                </div>
-                                                                <span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div class="mt-2">
-                                                        <small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
-
-                                                        <!-- Message Section -->
-                                                        <div class="mt-3 border-top pt-3">
-                                                            <!-- Message History -->
-                                                            <div class="message-history mb-3">
-                                                                <div class="d-flex gap-2">
-                                                                    <div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
-                                                                        <iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
-                                                                    </div>
-                                                                    <div style="max-width: 85%;">
-                                                                        <div class="fw-semibold text-xs mb-1">Admin Perizinan</div>
-                                                                        <div class="bg-light rounded p-2 px-3">
-                                                                            <div>Mohon untuk melengkapi surat pernyataan dengan tanda tangan direktur dan stempel perusahaan</div>
-                                                                            <div class="text-muted text-xs mt-1">11:45 AM</div>
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                            </div>
-
-                                                            <!-- Message Input -->
-                                                            <div class="d-flex gap-2">
-                                                                <textarea class="form-control" rows="2" placeholder="Tulis Pesan..."></textarea>
-                                                                <button type="button" class="btn btn-sm btn-primary-600 d-flex align-items-center align-self-end">
-                                                                    <iconify-icon icon="bi:send" class="text-white me-1"></iconify-icon>
-                                                                    Kirim
-                                                                </button>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Dokumen Pendukung Lainnya -->
-                                        <div class="col-12">
-                                            <div class="card border">
-                                                <div class="card-body">
-                                                    <div class="d-flex align-items-center justify-content-between mb-3">
-                                                        <div class="d-flex align-items-center">
-                                                            <div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">4</div>
-                                                            <label class="form-label mb-0">Dokumen Pendukung Lainnya</label>
-                                                        </div>
-                                                        <div class="d-flex align-items-center">
-                                                            <span class="badge bg-neutral-200 text-neutral-600 text-lg d-flex align-items-center">
-                                                                <iconify-icon icon="bi:hourglass-bottom" class="me-1"></iconify-icon>
-                                                                Belum Diperiksa
-                                                            </span>
-                                                        </div>
-                                                    </div>
-
-                                                    <!-- File Preview Section -->
-                                                    <div class="file-preview-container mt-3" id="dokumenPendukungPreview">
-                                                        <div class="border rounded p-3 bg-light d-flex align-items-start">
-                                                            <div class="preview-image me-3">
-                                                                <div class="preview-icon">
-                                                                    <iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
-                                                                </div>
-                                                            </div>
-                                                            <div class="flex-grow-1">
-                                                                <div class="d-flex justify-content-between align-items-start">
-                                                                    <div>
-                                                                        <h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">dokumen_pendukung.pdf</h6>
-                                                                        <p class="preview-filesize text-sm text-muted mb-0">3.1 MB</p>
-                                                                    </div>
-                                                                    <button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="dokumenPendukung">
-                                                                        <iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
-                                                                    </button>
-                                                                </div>
-                                                                <div class="progress mt-2" style="height: 5px;">
-                                                                    <div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
-                                                                </div>
-                                                                <span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div class="mt-2">
-                                                        <small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-
-                            <div class="form-group d-flex align-items-center justify-content-end gap-8 mt-4">
-                                <button type="button" class="form-wizard-previous-btn btn btn-neutral-500 border-neutral-100 px-32">Sebelumnya</button>
-                                <button type="button" class="form-wizard-next-btn btn btn-primary-600 px-32">Berikutnya</button>
-                            </div>
-                        </fieldset>
-
-                        <fieldset class="wizard-fieldset">
-                            <!-- Timeline Status Section -->
-                            <div class="section-card">
-                                <div class="section-header mb-3">
-                                    <iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
-                                    <h6 class="text-md mb-0">Timeline Status Permohonan</h6>
-                                </div>
-                                <div class="section-content">
-                                    <div class="alert alert-info mb-4" role="alert">
-                                        <div class="d-flex">
-                                            <iconify-icon icon="bi:info-circle-fill" class="me-2 fs-5"></iconify-icon>
-                                            <div>
-                                                <strong>Status Permohonan:</strong> Berikut adalah timeline status permohonan Anda. Harap periksa secara berkala untuk mengetahui kemajuan permohonan.
-                                            </div>
-                                        </div>
-                                    </div>
-
-                                    <div class="card border p-12">
-                                        <div class="timeline-status">
-                                            <div class="timeline-item completed">
-                                                <div class="timeline-marker"></div>
-                                                <div class="timeline-content">
-                                                    <h6 class="mb-0">Permohonan Diajukan</h6>
-                                                    <p class="text-muted small mb-0">21 Maret 2025 - 09:30</p>
-                                                    <p class="small">Permohonan berhasil diajukan</p>
-                                                </div>
-                                            </div>
-                                            <div class="timeline-item completed">
-                                                <div class="timeline-marker"></div>
-                                                <div class="timeline-content">
-                                                    <h6 class="mb-0">Verifikasi Dokumen</h6>
-                                                    <p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
-                                                    <p class="small">Dokumen telah diverifikasi oleh admin</p>
-                                                </div>
-                                            </div>
-                                            <div class="timeline-item completed">
-                                                <div class="timeline-marker"></div>
-                                                <div class="timeline-content">
-                                                    <h6 class="mb-0">PembuatanSurat Tanggapan
-                                                        Arahan Persetujuan Teknis
-                                                        (12 Hari Kerja)</h6>
-                                                    <p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
-                                                    <p class="small">Dokumen telah diverifikasi oleh admin</p>
-                                                </div>
-                                            </div>
-                                            <div class="timeline-item active">
-                                                <div class="timeline-marker"></div>
-                                                <div class="timeline-content">
-                                                    <h6 class="mb-0">Proses Review Teknis</h6>
-                                                    <p class="text-muted small mb-0">23 Maret 2025 - 10:45</p>
-                                                    <p class="small">Sedang dalam proses review oleh tim teknis</p>
-                                                </div>
-                                            </div>
-                                            <div class="timeline-item">
-                                                <div class="timeline-marker"></div>
-                                                <div class="timeline-content">
-                                                    <h6 class="mb-0">Persetujuan Arahan</h6>
-                                                    <p class="text-muted small mb-0">-</p>
-                                                    <p class="small">Menunggu persetujuan arahan teknis</p>
-                                                </div>
-                                            </div>
-                                            <div class="timeline-item">
-                                                <div class="timeline-marker"></div>
-                                                <div class="timeline-content">
-                                                    <h6 class="mb-0">Selesai</h6>
-                                                    <p class="text-muted small mb-0">-</p>
-                                                    <p class="small">Proses permohonan selesai</p>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-
-                                </div>
-                            </div>
-
-                            <div class="form-group d-flex align-items-center justify-content-end gap-8 mt-4">
-                                <button type="button" class="form-wizard-previous-btn btn btn-neutral-500 border-neutral-100 px-32">Sebelumnya</button>
-                                <a href="{{ route('pertek.index_arahan') }}" class="btn btn-primary-600 px-32">Lihat Semua Permohonan</a>
-                            </div>
-                        </fieldset>
-
-                            {{-- <fieldset class="wizard-fieldset">
-                              <!-- Timeline Status Section -->
-                              <div class="section-card">
-                                <div class="section-header mb-4">
-                                  <iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
-                                  <h5 class="m-0">Timeline Status Permohonan</h5>
-                                </div>
-
-                                <div class="section-content">
-                                  <div class="alert alert-info mb-4" role="alert">
-                                    <div class="d-flex align-items-center">
-                                      <iconify-icon icon="bi:info-circle-fill" style="font-size: 1.25rem; margin-right: 0.75rem;"></iconify-icon>
-                                      <div>
-                                        <strong>Status Permohonan:</strong> Berikut adalah timeline status permohonan Anda. Harap periksa secara berkala untuk mengetahui kemajuan permohonan.
-                                      </div>
-                                    </div>
-                                  </div>
-
-                                  <div class="timeline-wrapper">
-                                    <div class="timeline-status">
-                                      <div class="timeline-item completed">
-                                        <div class="timeline-marker"></div>
-                                        <div class="timeline-content">
-                                          <h6 class="timeline-title">Permohonan Diajukan</h6>
-                                          <p class="timeline-date">21 Maret 2025 - 09:30</p>
-                                          <p class="timeline-description">Permohonan berhasil diajukan</p>
-                                        </div>
-                                      </div>
-
-                                      <div class="timeline-item completed">
-                                        <div class="timeline-marker"></div>
-                                        <div class="timeline-content">
-                                          <h6 class="timeline-title">Verifikasi Dokumen</h6>
-                                          <p class="timeline-date">22 Maret 2025 - 14:15</p>
-                                          <p class="timeline-description">Dokumen telah diverifikasi oleh admin</p>
-                                        </div>
-                                      </div>
-
-                                      <div class="timeline-item active">
-                                        <div class="timeline-marker"></div>
-                                        <div class="timeline-content">
-                                          <h6 class="timeline-title">Proses Review Teknis</h6>
-                                          <p class="timeline-date">23 Maret 2025 - 10:45</p>
-                                          <p class="timeline-description">Sedang dalam proses review oleh tim teknis</p>
-                                        </div>
-                                      </div>
-
-                                      <div class="timeline-item">
-                                        <div class="timeline-marker"></div>
-                                        <div class="timeline-content">
-                                          <h6 class="timeline-title">Persetujuan Arahan</h6>
-                                          <p class="timeline-date">-</p>
-                                          <p class="timeline-description">Menunggu persetujuan arahan teknis</p>
-                                        </div>
-                                      </div>
-
-                                      <div class="timeline-item">
-                                        <div class="timeline-marker"></div>
-                                        <div class="timeline-content">
-                                          <h6 class="timeline-title">Selesai</h6>
-                                          <p class="timeline-date">-</p>
-                                          <p class="timeline-description">Proses permohonan selesai</p>
-                                        </div>
-                                      </div>
-                                    </div>
-                                  </div>
-
-                                </div>
-                              </div>
-
-                              <div class="d-flex justify-content-end gap-3 mt-4">
-                                <button type="button" class="btn btn-outline-secondary">
-                                  <i class="bi bi-arrow-left me-1"></i> Sebelumnya
-                                </button>
-                                <a href="#" class="btn btn-primary">
-                                  Lihat Semua Permohonan <i class="bi bi-arrow-right ms-1"></i>
-                                </a>
-                              </div>
-                            </fieldset> --}}
-                    </form>
-                </div>
-                <!-- Form Wizard End -->
-            </div>
-        </div>
-    </div>
-
-     <!-- Informasi Permohonan -->
-     <div class="col-md-4">
-                    <div class="card">
-                        <div class="card-header bg-light py-3">
-                            <div class="d-flex align-items-center">
-                                <iconify-icon icon="bi:file-earmark-medical" class="text-xl text-primary-600 me-2"></iconify-icon>
-                                <h6 class="mb-0 fw-semibold">Informasi Permohonan</h6>
-                            </div>
-                        </div>
-                        <div class="card-body">
-                            <div class="mb-3">
-                                <span class="d-block text-neutral-500 mb-1 text-sm">Nomor Pengajuan</span>
-                                <span class="text-md fw-medium">K24/250319E5CC8C330</span>
-                            </div>
-                            <div class="mb-3">
-                                <span class="d-block text-neutral-500 mb-1 text-sm">Jenis Izin</span>
-                                <span class="text-md fw-medium">PERSETUJUAN TEKNIS - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</span>
-                            </div>
-                            <div class="mb-3">
-                                <span class="d-block text-neutral-500 mb-1 text-sm">Tipe Perizinan</span>
-                                <span class="text-md fw-medium">Perusahaan/Yayasan/Pemerintahan</span>
-                            </div>
-                            <div class="mb-3">
-                                <span class="d-block text-neutral-500 mb-1 text-sm">Status</span>
-                                <span class="badge bg-warning-100 text-warning-600">Draft</span>
-                            </div>
-                            <div class="mb-3">
-                                <span class="d-block text-neutral-500 mb-1 text-sm">Kantor/Wilayah</span>
-                                <span class="text-md fw-medium">DPMPTSP DKI JAKARTA
-                                    Gedung Mal Pelayanan Publik. Jl.HR. Rasuna Said Kav. 22, Telp. 021-50810900 Website: pelayanan.jakarta.go.id, email: dpmptsp@jakarta.go.id</span>
-                            </div>
-                            <div class="mb-3">
-                                <span class="d-block text-neutral-500 mb-1 text-sm">Tanggal Pengajuan</span>
-                                <span class="text-md">{{ date('d/m/Y') }}</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-    </div>
-
-    <style>
-        .timeline-status {
-            position: relative;
-            padding-left: 28px;
-        }
-        .timeline-status:before {
-            content: '';
-            position: absolute;
-            left: 9px;
-            top: 6px;
-            height: calc(100% - 12px);
-            width: 2px;
-            background: #e9ecef;
-        }
-        .timeline-item {
-            position: relative;
-            padding-bottom: 20px;
-        }
-        .timeline-marker {
-            position: absolute;
-            left: -25px;
-            top: 6px;
-            width: 14px;
-            height: 14px;
-            border-radius: 50%;
-            background: #e9ecef;
-            border: 2px solid #fff;
-        }
-        .timeline-item.completed .timeline-marker {
-            background: #28a745;
-        }
-        .timeline-item.active .timeline-marker {
-            background: #007bff;
-            box-shadow: 0 0 0 4px rgba(0,123,255,0.2);
-        }
-        .timeline-content {
-            padding-left: 10px;
-        }
-
-
-    </style>
-
-<script src="{{ asset('assets/js/pertek/script_dropdown.js') }}"></script>
-<script src="{{ asset('assets/js/pertek/script_fileUpload.js') }}"></script>
-<script src="{{ asset('assets/js/pertek/script_pertanyaan.js') }}"></script>
-
-
-@endsection
diff --git a/resources/views/pertek/arahan/user_view_arahan.blade.php b/resources/views/pertek/arahan/user_view_arahan.blade.php
index 8dfe381..91068ca 100644
--- a/resources/views/pertek/arahan/user_view_arahan.blade.php
+++ b/resources/views/pertek/arahan/user_view_arahan.blade.php
@@ -1,8 +1,11 @@
 @extends('layout.layout')
 @php
-    $title='Permohonan Surat Arahan Persetujuan Teknis';
+    $title= 'Permohonan Surat Arahan Persetujuan Teknis';
     $subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
-    $css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
+    $css = '
+    <link rel="stylesheet" href="' . asset('assets/css/pertek/user_arahan.css') . '">
+    <link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">
+    ';
 @endphp
 
 @section('content')
@@ -521,46 +524,4 @@
                 </div>
     </div>
     </div>
-
-    <style>
-        .timeline-status {
-            position: relative;
-            padding-left: 28px;
-        }
-        .timeline-status:before {
-            content: '';
-            position: absolute;
-            left: 9px;
-            top: 6px;
-            height: calc(100% - 12px);
-            width: 2px;
-            background: #e9ecef;
-        }
-        .timeline-item {
-            position: relative;
-            padding-bottom: 20px;
-        }
-        .timeline-marker {
-            position: absolute;
-            left: -25px;
-            top: 6px;
-            width: 14px;
-            height: 14px;
-            border-radius: 50%;
-            background: #e9ecef;
-            border: 2px solid #fff;
-        }
-        .timeline-item.completed .timeline-marker {
-            background: #28a745;
-        }
-        .timeline-item.active .timeline-marker {
-            background: #007bff;
-            box-shadow: 0 0 0 4px rgba(0,123,255,0.2);
-        }
-        .timeline-content {
-            padding-left: 10px;
-        }
-
-
-    </style>
 @endsection
diff --git a/resources/views/pertek/create_arahan_awal.blade.php b/resources/views/pertek/create_arahan_awal.blade.php
index e7d5748..e214608 100644
--- a/resources/views/pertek/create_arahan_awal.blade.php
+++ b/resources/views/pertek/create_arahan_awal.blade.php
@@ -3,6 +3,7 @@
     $title='Permohonan Surat Arahan Persetujuan Teknis';
     $subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
     $css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
+    $script = '<script src="' . asset('assets/js/dashboard/script_dropdown.js') . '"></script>';
 @endphp
 
 @section('content')
@@ -350,8 +351,9 @@
 </div>
 
 
-<script src="{{ asset('assets/js/dashboard/script_dropdown.js') }}"></script>
+{{-- <script src="{{ asset('assets/js/dashboard/script_dropdown.js') }}"></script> --}}
 
+<script>
     function toggleLimbahFields() {
         const selection = document.getElementById('hasilLimbahB3').value;
         const additionalFields = document.getElementById('limbahAdditionalFields');
diff --git a/resources/views/pertek/emisi/detail_emisi.blade.php b/resources/views/pertek/emisi/detail_emisi.blade.php
new file mode 100644
index 0000000..88e99d2
--- /dev/null
+++ b/resources/views/pertek/emisi/detail_emisi.blade.php
@@ -0,0 +1,565 @@
+@extends('layout.layout')
+@php
+    $title='Permohonan Surat Arahan Persetujuan Teknis';
+    $subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
+    $css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
+@endphp
+
+@section('content')
+    <div class="row gy-4">
+        <div class="col-md-8">
+            <div class="card p-0 overflow-hidden position-relative radius-12 h-100">
+                <div class="card-header py-16 px-24 bg-base border border-end-0 border-start-0 border-top-0">
+                    <h6 class="text-lg mb-0">Detail Permohonan</h6>
+                </div>
+                <div class="card-body p-24 pt-10">
+                    <!-- Tab Navigation -->
+                    <ul class="nav button-tab nav-pills mb-16" id="permohonan-tabs" role="tablist">
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10 active" id="info-pemohon-tab" data-bs-toggle="pill" data-bs-target="#info-pemohon" type="button" role="tab" aria-controls="info-pemohon" aria-selected="true">
+                                <iconify-icon icon="bi:person-fill" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Informasi Pemohon</span>
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="persyaratan-tab" data-bs-toggle="pill" data-bs-target="#persyaratan" type="button" role="tab" aria-controls="persyaratan" aria-selected="false">
+                                <iconify-icon icon="bi:file-earmark-text" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Persyaratan Izin</span>
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="pertanyaan-tab" data-bs-toggle="pill" data-bs-target="#pertanyaan" type="button" role="tab" aria-controls="pertanyaan" aria-selected="false">
+                                <iconify-icon icon="bi:patch-question" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Pertanyaan</span>
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="timeline-tab" data-bs-toggle="pill" data-bs-target="#timeline" type="button" role="tab" aria-controls="timeline" aria-selected="false">
+                                <iconify-icon icon="material-symbols:timeline" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Timeline</span>
+                            </button>
+                        </li>
+                    </ul>
+
+                    <!-- Tab Content -->
+                    <div class="tab-content" id="permohonan-tabs-content">
+                        <!-- Tab 1: Informasi Pemohon -->
+                        <div class="tab-pane fade show active" id="info-pemohon" role="tabpanel" aria-labelledby="info-pemohon-tab" tabindex="0">
+                            <!-- Section Card: Data Pemohon -->
+                            <div class="section-card mb-8">
+                                <div class="section-header active" data-bs-toggle="collapse" href="#dataPemohon" role="button" aria-expanded="true" aria-controls="dataPemohon">
+                                    <iconify-icon icon="bi:person-fill" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Data Pemohon</h6>
+                                    <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow rotated"></iconify-icon>
+                                </div>
+                                <div class="collapse show" id="dataPemohon">
+                                    <div class="section-content p-3">
+                                        <div class="row">
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="NamaPemohon" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Pemohon <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="NamaPemohon" value="John Doe">
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Jabatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jabatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="Jabatan" value="Direktur">
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Email" class="form-label fw-semibold text-primary-light text-sm mb-8">Email <span class="text-danger-600">*</span></label>
+                                                    <input type="email" class="form-control radius-8" id="Email" value="john.doe@example.com">
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Telepon" class="form-label fw-semibold text-primary-light text-sm mb-8">Nomor Telepon</label>
+                                                    <input type="text" class="form-control radius-8" id="Telepon" value="08123456789">
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Section Card: Data Kegiatan -->
+                            <div class="section-card mb-8">
+                                <div class="section-header" data-bs-toggle="collapse" href="#dataKegiatan" role="button" aria-expanded="false" aria-controls="dataKegiatan">
+                                    <iconify-icon icon="bi:building" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Data Kegiatan</h6>
+                                    <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
+                                </div>
+                                <div class="collapse" id="dataKegiatan">
+                                    <div class="section-content p-3">
+                                        <div class="row">
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="NamaKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Kegiatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="NamaKegiatan" value="Pengolahan Limbah Industri" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="JenisKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Kegiatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="JenisKegiatan" value="Industri Pengolahan" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="PelaksanaKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Pelaksana Kegiatan</label>
+                                                    <input type="text" class="form-control radius-8" id="PelaksanaKegiatan" value="PT Example Industries" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="AlamatKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Alamat Kegiatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="AlamatKegiatan" value="Jl. Industri No. 123, Jakarta Utara" >
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Section Card: Detail Informasi -->
+                            <div class="section-card mb-8">
+                                <div class="section-header" data-bs-toggle="collapse" href="#detailInformasi" role="button" aria-expanded="false" aria-controls="detailInformasi">
+                                    <iconify-icon icon="bi:info-circle-fill" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Detail Informasi</h6>
+                                    <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
+                                </div>
+                                <div class="collapse" id="detailInformasi">
+                                    <div class="section-content p-3">
+                                        <div class="row">
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="JenisIzinLingkungan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Izin Lingkungan <span class="text-danger-600">*</span></label>
+                                                    <select class="form-control radius-8 form-select" id="JenisIzinLingkungan" >
+                                                        <option selected>Persetujuan Teknis - Pemenuhan Baku Mutu Air Limbah (Pemanfaatan)</option>
+                                                    </select>
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="StatusPemodalan" class="form-label fw-semibold text-primary-light text-sm mb-8">Status Pemodalan</label>
+                                                    <input type="text" class="form-control radius-8" id="StatusPemodalan" value="PMDN" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="NIB" class="form-label fw-semibold text-primary-light text-sm mb-8">NIB<span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="NIB" value="8123456789012" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="KBLI" class="form-label fw-semibold text-primary-light text-sm mb-8">KBLI <span class="text-danger-600">*</span></label>
+                                                    <select class="form-control radius-8 form-select" id="KBLI" >
+                                                        <option selected>10293 (lndustri Pembekuan Biota Air Lainnya)</option>
+                                                    </select>
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="OperasionalKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Operasional Kegiatan<span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="OperasionalKegiatan" value="24 Jam" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Skala" class="form-label fw-semibold text-primary-light text-sm mb-8">Skala<span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="Skala" value="Menengah" >
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Tab 2: Persyaratan Izin -->
+                        <div class="tab-pane fade" id="persyaratan" role="tabpanel" aria-labelledby="persyaratan-tab" tabindex="0">
+                         <fieldset class="wizard-fieldset">
+                            <!-- Dokumen Persyaratan Section -->
+                            <div class="section-card">
+                                <div class="section-header mb-3">
+                                    <iconify-icon icon="bi:file-earmark-text" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Dokumen Persyaratan</h6>
+                                </div>
+                                <div class="section-content">
+                                    <div class="row gy-4">
+                                        <!-- Surat Permohonan -->
+                                        <div class="col-12">
+                                            <div class="card border">
+                                                <div class="card-body">
+                                                    <div class="d-flex align-items-center justify-content-between mb-3">
+                                                        <div class="d-flex align-items-center">
+                                                            <div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">1</div>
+                                                            <label class="form-label required-field mb-0">Surat Permohonan</label>
+                                                        </div>
+                                                        <div class="d-flex align-items-center">
+                                                            <span class="badge bg-success-100 text-success-600 text-lg d-flex align-items-center">
+                                                                <iconify-icon icon="bi:check-circle-fill" class="me-1"></iconify-icon>
+                                                                Disetujui
+                                                            </span>
+                                                        </div>
+                                                    </div>
+
+                                                    <!-- File Preview Section -->
+                                                    <div class="file-preview-container mt-3" id="suratPermohonanPreview">
+                                                        <div class="border rounded p-3 bg-light d-flex align-items-start">
+                                                            <div class="preview-image me-3">
+                                                                <div class="preview-icon">
+                                                                    <iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
+                                                                </div>
+                                                            </div>
+                                                            <div class="flex-grow-1">
+                                                                <div class="d-flex justify-content-between align-items-start">
+                                                                    <div>
+                                                                        <h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">surat_permohonan.pdf</h6>
+                                                                        <p class="preview-filesize text-sm text-muted mb-0">1.2 MB</p>
+                                                                    </div>
+                                                                    <button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="suratPermohonan">
+                                                                        <iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
+                                                                    </button>
+                                                                </div>
+                                                                <div class="progress mt-2" style="height: 5px;">
+                                                                    <div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
+                                                                </div>
+                                                                <span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div class="mt-2">
+                                                        <small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
+
+                                                         <!-- Message Section -->
+                                                         <div class="mt-3 border-top pt-3">
+                                                            <!-- Message History Container -->
+                                                            <div class="message-history mb-3">
+                                                                <div class="d-flex flex-column gap-3">
+                                                                    <!-- Admin Message -->
+                                                                    <div class="d-flex gap-2">
+                                                                        <div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
+                                                                            <iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
+                                                                        </div>
+                                                                        <div style="max-width: 85%;">
+                                                                            <div class="fw-semibold text-xs mb-1">Admin Perizinan</div>
+                                                                            <div class="bg-light rounded p-2 px-3">
+                                                                                <div>Silahkan upload dokumen pendukung lainnya jika ada</div>
+                                                                                <div class="text-muted text-xs mt-1">10:30 AM</div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+
+                                                                    <!-- User Message -->
+                                                                    <div class="d-flex flex-row-reverse gap-2">
+                                                                        <div class="avatar avatar-sm bg-primary-600 rounded-circle d-flex align-items-center justify-content-center">
+                                                                            <iconify-icon icon="bi:person-fill" class="text-white"></iconify-icon>
+                                                                        </div>
+                                                                        <div style="max-width: 85%;">
+                                                                            <div class="fw-semibold text-xs mb-1 text-end">Budi Santoso</div>
+                                                                            <div class="bg-primary-50 rounded p-2 px-3">
+                                                                                <div>Baik, saya akan upload dokumen tambahan</div>
+                                                                                <div class="text-muted text-xs mt-1">10:45 AM</div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+
+                                                            <!-- Message Input -->
+                                                            <div class="d-flex gap-2">
+                                                                <textarea class="form-control" rows="2" placeholder="Tulis Pesan..."></textarea>
+                                                                <button type="button" class="btn btn-sm btn-primary-600 d-flex align-items-center align-self-end">
+                                                                    Kirim
+                                                                    <iconify-icon icon="f7:paperplane" class="text-white me-1"></iconify-icon>
+
+                                                                </button>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="form-group d-flex align-items-center justify-content-end gap-8 mt-4">
+                                <button type="button" class="form-wizard-previous-btn btn btn-neutral-500 border-neutral-100 px-32">Sebelumnya</button>
+                                <button type="button" class="form-wizard-next-btn btn btn-primary-600 px-32">Berikutnya</button>
+                            </div>
+                        </fieldset>
+                        </div>
+
+                        <!-- Tab 3: Pertanyaan -->
+                        <div class="tab-pane fade" id="pertanyaan" role="tabpanel" aria-labelledby="pertanyaan-tab" tabindex="0">
+                            <div class="section-card mb-8">
+                                <div class="section-header active">
+                                    <iconify-icon icon="bi:question-circle-fill" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Pertanyaan dan Jawaban</h6>
+                                </div>
+                                <div class="section-content p-3">
+                                    <div class="row">
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah berada di lokasi kawasan industri?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam Kawasan Lindung?</label>
+                                                <div class="form-control-plaintext">Tidak</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam PIPPIB?</label>
+                                                <div class="form-control-plaintext">Tidak</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengumpulan limbah B3?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-12">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengolahan air limbah?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Additional details for "Ya" response -->
+                                        <div class="col-12">
+                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20">
+                                                <div class="row">
+                                                    <div class="col-sm-12 mb-3">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Jumlah IPAL yang telah beroperasi?</label>
+                                                            <div class="form-control-plaintext">2 Unit</div>
+                                                        </div>
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
+                                                            <div class="form-control-plaintext">IPAL beroperasi sejak tahun 2020 dengan kapasitas 100 m³/hari</div>
+                                                        </div>
+                                                    </div>
+                                                    <div class="col-sm-12">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">
+                                                                Apakah sebelumnya mempunyai izin IPAL?
+                                                            </label>
+                                                            <div class="form-control-plaintext">Ya</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-12">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan emisi?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Additional details for emisi -->
+                                        <div class="col-12">
+                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20">
+                                                <div class="row">
+                                                    <div class="col-sm-12 mb-3">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
+                                                            <div class="form-control-plaintext">Emisi dari mesin diesel dan proses produksi</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-12">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan Limbah B3?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Additional details for limbah B3 -->
+                                        <div class="col-12">
+                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20">
+                                                <div class="row">
+                                                    <div class="col-sm-12 mb-3">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
+                                                            <div class="form-control-plaintext">Limbah B3 berupa oli bekas, kemasan bekas bahan kimia, dan sludge dari IPAL</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Tab 4: Timeline -->
+                        <div class="tab-pane fade" id="timeline" role="tabpanel" aria-labelledby="timeline-tab" tabindex="0">
+                            <fieldset class="wizard-fieldset">
+                                <!-- Timeline Status Section -->
+                                <div class="section-card">
+                                    <div class="section-header mb-3">
+                                        <iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
+                                        <h6 class="text-md mb-0">Timeline Status Permohonan</h6>
+                                    </div>
+                                    <div class="section-content">
+                                        <div class="alert alert-info mb-4" role="alert">
+                                            <div class="d-flex">
+                                                <iconify-icon icon="bi:info-circle-fill" class="me-2 fs-5"></iconify-icon>
+                                                <div>
+                                                    <strong>Status Permohonan:</strong> Berikut adalah timeline status permohonan Anda. Harap periksa secara berkala untuk mengetahui kemajuan permohonan.
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="card border p-12">
+                                            <div class="timeline-status">
+                                                <div class="timeline-item completed">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Permohonan Diajukan</h6>
+                                                        <p class="text-muted small mb-0">21 Maret 2025 - 09:30</p>
+                                                        <p class="small">Permohonan berhasil diajukan</p>
+                                                    </div>
+                                                </div>
+                                                <div class="timeline-item completed">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Verifikasi Dokumen</h6>
+                                                        <p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
+                                                        <p class="small">Dokumen telah diverifikasi oleh admin</p>
+                                                    </div>
+                                                </div>
+                                                <div class="timeline-item completed">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Pembuatan Surat Tanggapan
+                                                            Arahan Persetujuan Teknis
+                                                        </h6>
+                                                        <p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
+                                                        <p class="small">Dokumen telah diverifikasi oleh admin</p>
+                                                    </div>
+                                                </div>
+                                                <div class="timeline-item">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Penerbitan Surat Tanggapan
+                                                            Arahan Persetujuan Teknis</h6>
+                                                            <p class="text-muted small mb-0">22 Maret 2025 - 15:00</p>
+                                                        <p class="small">Proses permohonan selesai</p>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                    </div>
+                                </div>
+
+                            </fieldset>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Informasi Permohonan -->
+     <div class="col-md-4">
+                    <div class="card">
+                        <div class="card-header bg-light py-3">
+                            <div class="d-flex align-items-center">
+                                <iconify-icon icon="bi:file-earmark-medical" class="text-xl text-primary-600 me-2"></iconify-icon>
+                                <h6 class="mb-0 fw-semibold">Informasi Permohonan</h6>
+                            </div>
+                        </div>
+                        <div class="card-body">
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Nomor Pengajuan</span>
+                                <span class="text-md fw-medium">K23/250120CAEFC3A7E</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Jenis Izin</span>
+                                <span class="text-md fw-medium">SERTIFIKAT LAIK OPERASI - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Tipe Perizinan</span>
+                                <span class="text-md fw-medium">Perusahaan/Yayasan/Pemerintahan</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Status</span>
+                                <span class="badge bg-warning-100 text-warning-600">Substansi Disetujui Tim Sekre LH</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Alamat Maps</span>
+                                <span class="text-md fw-medium">Jl. Kapten Tendean No.20C, RW.3, Kuningan Bar., Kec. Mampang Prpt., Kota Jakarta Selatan, Daerah Khusus Ibukota Jakarta 12710, Indonesia</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Tanggal Pengajuan</span>
+                                <span class="text-md">{{ date('d/m/Y') }}</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+    </div>
+    </div>
+
+    <style>
+        .timeline-status {
+            position: relative;
+            padding-left: 28px;
+        }
+        .timeline-status:before {
+            content: '';
+            position: absolute;
+            left: 9px;
+            top: 6px;
+            height: calc(100% - 12px);
+            width: 2px;
+            background: #e9ecef;
+        }
+        .timeline-item {
+            position: relative;
+            padding-bottom: 20px;
+        }
+        .timeline-marker {
+            position: absolute;
+            left: -25px;
+            top: 6px;
+            width: 14px;
+            height: 14px;
+            border-radius: 50%;
+            background: #e9ecef;
+            border: 2px solid #fff;
+        }
+        .timeline-item.completed .timeline-marker {
+            background: #28a745;
+        }
+        .timeline-item.active .timeline-marker {
+            background: #007bff;
+            box-shadow: 0 0 0 4px rgba(0,123,255,0.2);
+        }
+        .timeline-content {
+            padding-left: 10px;
+        }
+
+
+    </style>
+@endsection
diff --git a/resources/views/pertek/emisi/index_emisi.blade.php b/resources/views/pertek/emisi/index_emisi.blade.php
index 480c159..798a0a1 100644
--- a/resources/views/pertek/emisi/index_emisi.blade.php
+++ b/resources/views/pertek/emisi/index_emisi.blade.php
@@ -10,13 +10,6 @@
 @section('content')
 
             <div class="card basic-data-table">
-                <div class="card-header d-flex justify-content-between align-items-center">
-                    <h5 class="card-title mb-0">
-                    </h5>
-                    <a href="{{ route('pertek.create_arahan') }}">
-                    <button type="button" class="btn btn-primary-600 radius-8 px-20 py-11">Buat Permohonan</button>
-                    </a>
-                </div>
                 <div class="card-body">
                     <div class="table-responsive">
                         <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
@@ -24,7 +17,6 @@
                                 <tr>
                                     <th scope="col">
                                         <div class="form-check style-check d-flex align-items-center">
-                                            {{-- <input class="form-check-input" type="checkbox"> --}}
                                             <label class="form-check-label">
                                                 No
                                             </label>
@@ -32,8 +24,7 @@
                                     </th>
                                     <th scope="col">Nomor Permohonan</th>
                                     <th scope="col">Perusahaan</th>
-                                    <th scope="col">Nama Kegiatan</th>
-                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Jenis Izin</th>
                                     <th scope="col">Pemohon</th>
                                     <th scope="col">Tanggal</th>
                                     <th scope="col">Status</th>
@@ -44,26 +35,22 @@
                                 <tr>
                                     <td>
                                         <div class="form-check style-check d-flex align-items-center">
-                                            {{-- <input class="form-check-input" type="checkbox"> --}}
                                             <label class="form-check-label">
                                                 01
                                             </label>
                                         </div>
                                     </td>
-                                    <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td>
-                                    @include('pertek.arahan.modal_detail_arahan')
-
                                     <td>
-                                        <div class="d-flex align-items-center">
-                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
-                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
-                                        </div>
+                                        {{-- <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a> --}}
+                                        <a href="{{ route('pertek.detail_emisi') }}" class="text-primary-600 bg-amber-300 rounded-2xl">K23/250120CAEFC3A7E</a>
                                     </td>
-                                    <td>Pembangungan Gedung Baru</td>
-                                    <td>UKL-UPL</td>
+                                    <td>
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT ANEKA TAMBANG TBK</h6>
+                                    </td>
+                                    <td>PERSETUJUAN TEKNIS - PEMENUHAN BAKU MUTU EMISI</td>
                                     <td>Charles Hasibuan</td>
                                     <td>21 Maret 2025</td>
-                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Perbaikan Berkas Dikirim Pemohon</span> </td>
                                     <td>
                                         <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
                                             <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
diff --git a/resources/views/pertek/slo/detail_slo.blade.php b/resources/views/pertek/slo/detail_slo.blade.php
new file mode 100644
index 0000000..88e99d2
--- /dev/null
+++ b/resources/views/pertek/slo/detail_slo.blade.php
@@ -0,0 +1,565 @@
+@extends('layout.layout')
+@php
+    $title='Permohonan Surat Arahan Persetujuan Teknis';
+    $subTitle = 'Permohonan Surat Arahan Persetujuan Teknis';
+    $css = '<link rel="stylesheet" href="' . asset('assets/css/custom.css') . '">';
+@endphp
+
+@section('content')
+    <div class="row gy-4">
+        <div class="col-md-8">
+            <div class="card p-0 overflow-hidden position-relative radius-12 h-100">
+                <div class="card-header py-16 px-24 bg-base border border-end-0 border-start-0 border-top-0">
+                    <h6 class="text-lg mb-0">Detail Permohonan</h6>
+                </div>
+                <div class="card-body p-24 pt-10">
+                    <!-- Tab Navigation -->
+                    <ul class="nav button-tab nav-pills mb-16" id="permohonan-tabs" role="tablist">
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10 active" id="info-pemohon-tab" data-bs-toggle="pill" data-bs-target="#info-pemohon" type="button" role="tab" aria-controls="info-pemohon" aria-selected="true">
+                                <iconify-icon icon="bi:person-fill" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Informasi Pemohon</span>
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="persyaratan-tab" data-bs-toggle="pill" data-bs-target="#persyaratan" type="button" role="tab" aria-controls="persyaratan" aria-selected="false">
+                                <iconify-icon icon="bi:file-earmark-text" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Persyaratan Izin</span>
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="pertanyaan-tab" data-bs-toggle="pill" data-bs-target="#pertanyaan" type="button" role="tab" aria-controls="pertanyaan" aria-selected="false">
+                                <iconify-icon icon="bi:patch-question" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Pertanyaan</span>
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link d-flex align-items-center gap-2 fw-semibold text-primary-light radius-4 px-16 py-10" id="timeline-tab" data-bs-toggle="pill" data-bs-target="#timeline" type="button" role="tab" aria-controls="timeline" aria-selected="false">
+                                <iconify-icon icon="material-symbols:timeline" class="text-xl"></iconify-icon>
+                                <span class="line-height-1">Timeline</span>
+                            </button>
+                        </li>
+                    </ul>
+
+                    <!-- Tab Content -->
+                    <div class="tab-content" id="permohonan-tabs-content">
+                        <!-- Tab 1: Informasi Pemohon -->
+                        <div class="tab-pane fade show active" id="info-pemohon" role="tabpanel" aria-labelledby="info-pemohon-tab" tabindex="0">
+                            <!-- Section Card: Data Pemohon -->
+                            <div class="section-card mb-8">
+                                <div class="section-header active" data-bs-toggle="collapse" href="#dataPemohon" role="button" aria-expanded="true" aria-controls="dataPemohon">
+                                    <iconify-icon icon="bi:person-fill" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Data Pemohon</h6>
+                                    <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow rotated"></iconify-icon>
+                                </div>
+                                <div class="collapse show" id="dataPemohon">
+                                    <div class="section-content p-3">
+                                        <div class="row">
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="NamaPemohon" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Pemohon <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="NamaPemohon" value="John Doe">
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Jabatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jabatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="Jabatan" value="Direktur">
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Email" class="form-label fw-semibold text-primary-light text-sm mb-8">Email <span class="text-danger-600">*</span></label>
+                                                    <input type="email" class="form-control radius-8" id="Email" value="john.doe@example.com">
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Telepon" class="form-label fw-semibold text-primary-light text-sm mb-8">Nomor Telepon</label>
+                                                    <input type="text" class="form-control radius-8" id="Telepon" value="08123456789">
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Section Card: Data Kegiatan -->
+                            <div class="section-card mb-8">
+                                <div class="section-header" data-bs-toggle="collapse" href="#dataKegiatan" role="button" aria-expanded="false" aria-controls="dataKegiatan">
+                                    <iconify-icon icon="bi:building" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Data Kegiatan</h6>
+                                    <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
+                                </div>
+                                <div class="collapse" id="dataKegiatan">
+                                    <div class="section-content p-3">
+                                        <div class="row">
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="NamaKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Nama Kegiatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="NamaKegiatan" value="Pengolahan Limbah Industri" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="JenisKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Kegiatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="JenisKegiatan" value="Industri Pengolahan" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="PelaksanaKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Pelaksana Kegiatan</label>
+                                                    <input type="text" class="form-control radius-8" id="PelaksanaKegiatan" value="PT Example Industries" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="AlamatKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Alamat Kegiatan <span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="AlamatKegiatan" value="Jl. Industri No. 123, Jakarta Utara" >
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Section Card: Detail Informasi -->
+                            <div class="section-card mb-8">
+                                <div class="section-header" data-bs-toggle="collapse" href="#detailInformasi" role="button" aria-expanded="false" aria-controls="detailInformasi">
+                                    <iconify-icon icon="bi:info-circle-fill" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Detail Informasi</h6>
+                                    <iconify-icon icon="bi:chevron-down" class="ms-auto dropdown-arrow"></iconify-icon>
+                                </div>
+                                <div class="collapse" id="detailInformasi">
+                                    <div class="section-content p-3">
+                                        <div class="row">
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="JenisIzinLingkungan" class="form-label fw-semibold text-primary-light text-sm mb-8">Jenis Izin Lingkungan <span class="text-danger-600">*</span></label>
+                                                    <select class="form-control radius-8 form-select" id="JenisIzinLingkungan" >
+                                                        <option selected>Persetujuan Teknis - Pemenuhan Baku Mutu Air Limbah (Pemanfaatan)</option>
+                                                    </select>
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="StatusPemodalan" class="form-label fw-semibold text-primary-light text-sm mb-8">Status Pemodalan</label>
+                                                    <input type="text" class="form-control radius-8" id="StatusPemodalan" value="PMDN" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="NIB" class="form-label fw-semibold text-primary-light text-sm mb-8">NIB<span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="NIB" value="8123456789012" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="KBLI" class="form-label fw-semibold text-primary-light text-sm mb-8">KBLI <span class="text-danger-600">*</span></label>
+                                                    <select class="form-control radius-8 form-select" id="KBLI" >
+                                                        <option selected>10293 (lndustri Pembekuan Biota Air Lainnya)</option>
+                                                    </select>
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="OperasionalKegiatan" class="form-label fw-semibold text-primary-light text-sm mb-8">Operasional Kegiatan<span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="OperasionalKegiatan" value="24 Jam" >
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="mb-20">
+                                                    <label for="Skala" class="form-label fw-semibold text-primary-light text-sm mb-8">Skala<span class="text-danger-600">*</span></label>
+                                                    <input type="text" class="form-control radius-8" id="Skala" value="Menengah" >
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Tab 2: Persyaratan Izin -->
+                        <div class="tab-pane fade" id="persyaratan" role="tabpanel" aria-labelledby="persyaratan-tab" tabindex="0">
+                         <fieldset class="wizard-fieldset">
+                            <!-- Dokumen Persyaratan Section -->
+                            <div class="section-card">
+                                <div class="section-header mb-3">
+                                    <iconify-icon icon="bi:file-earmark-text" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Dokumen Persyaratan</h6>
+                                </div>
+                                <div class="section-content">
+                                    <div class="row gy-4">
+                                        <!-- Surat Permohonan -->
+                                        <div class="col-12">
+                                            <div class="card border">
+                                                <div class="card-body">
+                                                    <div class="d-flex align-items-center justify-content-between mb-3">
+                                                        <div class="d-flex align-items-center">
+                                                            <div class="d-flex align-items-center justify-content-center bg-primary-600 rounded-circle text-white fw-bold me-2" style="width: 24px; height: 24px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">1</div>
+                                                            <label class="form-label required-field mb-0">Surat Permohonan</label>
+                                                        </div>
+                                                        <div class="d-flex align-items-center">
+                                                            <span class="badge bg-success-100 text-success-600 text-lg d-flex align-items-center">
+                                                                <iconify-icon icon="bi:check-circle-fill" class="me-1"></iconify-icon>
+                                                                Disetujui
+                                                            </span>
+                                                        </div>
+                                                    </div>
+
+                                                    <!-- File Preview Section -->
+                                                    <div class="file-preview-container mt-3" id="suratPermohonanPreview">
+                                                        <div class="border rounded p-3 bg-light d-flex align-items-start">
+                                                            <div class="preview-image me-3">
+                                                                <div class="preview-icon">
+                                                                    <iconify-icon icon="bi:file-earmark-pdf" class="text-danger fs-1"></iconify-icon>
+                                                                </div>
+                                                            </div>
+                                                            <div class="flex-grow-1">
+                                                                <div class="d-flex justify-content-between align-items-start">
+                                                                    <div>
+                                                                        <h6 class="preview-filename mb-1 text-truncate" style="max-width: 200px;">surat_permohonan.pdf</h6>
+                                                                        <p class="preview-filesize text-sm text-muted mb-0">1.2 MB</p>
+                                                                    </div>
+                                                                    <button type="button" class="btn btn-sm btn-neutral-200 remove-file" data-target="suratPermohonan">
+                                                                        <iconify-icon icon="bi:x" class="text-muted"></iconify-icon>
+                                                                    </button>
+                                                                </div>
+                                                                <div class="progress mt-2" style="height: 5px;">
+                                                                    <div class="progress-bar bg-success" role="progressbar" style="width: 100%"></div>
+                                                                </div>
+                                                                <span class="text-success text-xs mt-1 d-block">Berhasil diupload</span>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div class="mt-2">
+                                                        <small class="text-muted d-block">Maks. berukuran 20 MB dan berformat pdf</small>
+
+                                                         <!-- Message Section -->
+                                                         <div class="mt-3 border-top pt-3">
+                                                            <!-- Message History Container -->
+                                                            <div class="message-history mb-3">
+                                                                <div class="d-flex flex-column gap-3">
+                                                                    <!-- Admin Message -->
+                                                                    <div class="d-flex gap-2">
+                                                                        <div class="avatar avatar-sm bg-primary-100 rounded-circle d-flex align-items-center justify-content-center">
+                                                                            <iconify-icon icon="bi:person-fill" class="text-primary-600"></iconify-icon>
+                                                                        </div>
+                                                                        <div style="max-width: 85%;">
+                                                                            <div class="fw-semibold text-xs mb-1">Admin Perizinan</div>
+                                                                            <div class="bg-light rounded p-2 px-3">
+                                                                                <div>Silahkan upload dokumen pendukung lainnya jika ada</div>
+                                                                                <div class="text-muted text-xs mt-1">10:30 AM</div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+
+                                                                    <!-- User Message -->
+                                                                    <div class="d-flex flex-row-reverse gap-2">
+                                                                        <div class="avatar avatar-sm bg-primary-600 rounded-circle d-flex align-items-center justify-content-center">
+                                                                            <iconify-icon icon="bi:person-fill" class="text-white"></iconify-icon>
+                                                                        </div>
+                                                                        <div style="max-width: 85%;">
+                                                                            <div class="fw-semibold text-xs mb-1 text-end">Budi Santoso</div>
+                                                                            <div class="bg-primary-50 rounded p-2 px-3">
+                                                                                <div>Baik, saya akan upload dokumen tambahan</div>
+                                                                                <div class="text-muted text-xs mt-1">10:45 AM</div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+
+                                                            <!-- Message Input -->
+                                                            <div class="d-flex gap-2">
+                                                                <textarea class="form-control" rows="2" placeholder="Tulis Pesan..."></textarea>
+                                                                <button type="button" class="btn btn-sm btn-primary-600 d-flex align-items-center align-self-end">
+                                                                    Kirim
+                                                                    <iconify-icon icon="f7:paperplane" class="text-white me-1"></iconify-icon>
+
+                                                                </button>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="form-group d-flex align-items-center justify-content-end gap-8 mt-4">
+                                <button type="button" class="form-wizard-previous-btn btn btn-neutral-500 border-neutral-100 px-32">Sebelumnya</button>
+                                <button type="button" class="form-wizard-next-btn btn btn-primary-600 px-32">Berikutnya</button>
+                            </div>
+                        </fieldset>
+                        </div>
+
+                        <!-- Tab 3: Pertanyaan -->
+                        <div class="tab-pane fade" id="pertanyaan" role="tabpanel" aria-labelledby="pertanyaan-tab" tabindex="0">
+                            <div class="section-card mb-8">
+                                <div class="section-header active">
+                                    <iconify-icon icon="bi:question-circle-fill" class="section-icon"></iconify-icon>
+                                    <h6 class="text-md mb-0">Pertanyaan dan Jawaban</h6>
+                                </div>
+                                <div class="section-content p-3">
+                                    <div class="row">
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah berada di lokasi kawasan industri?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam Kawasan Lindung?</label>
+                                                <div class="form-control-plaintext">Tidak</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah masuk dalam PIPPIB?</label>
+                                                <div class="form-control-plaintext">Tidak</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-6">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengumpulan limbah B3?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-12">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah melakukan pengolahan air limbah?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Additional details for "Ya" response -->
+                                        <div class="col-12">
+                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20">
+                                                <div class="row">
+                                                    <div class="col-sm-12 mb-3">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Jumlah IPAL yang telah beroperasi?</label>
+                                                            <div class="form-control-plaintext">2 Unit</div>
+                                                        </div>
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
+                                                            <div class="form-control-plaintext">IPAL beroperasi sejak tahun 2020 dengan kapasitas 100 m³/hari</div>
+                                                        </div>
+                                                    </div>
+                                                    <div class="col-sm-12">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">
+                                                                Apakah sebelumnya mempunyai izin IPAL?
+                                                            </label>
+                                                            <div class="form-control-plaintext">Ya</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-12">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan emisi?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Additional details for emisi -->
+                                        <div class="col-12">
+                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20">
+                                                <div class="row">
+                                                    <div class="col-sm-12 mb-3">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
+                                                            <div class="form-control-plaintext">Emisi dari mesin diesel dan proses produksi</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="col-sm-12">
+                                            <div class="mb-20">
+                                                <label class="form-label fw-semibold text-primary-light text-sm mb-8">Apakah menghasilkan Limbah B3?</label>
+                                                <div class="form-control-plaintext">Ya</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Additional details for limbah B3 -->
+                                        <div class="col-12">
+                                            <div class="card border border-primary-100 rounded-3 p-3 mb-20">
+                                                <div class="row">
+                                                    <div class="col-sm-12 mb-3">
+                                                        <div class="mb-20">
+                                                            <label class="form-label fw-semibold text-primary-light text-sm mb-8">Keterangan</label>
+                                                            <div class="form-control-plaintext">Limbah B3 berupa oli bekas, kemasan bekas bahan kimia, dan sludge dari IPAL</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Tab 4: Timeline -->
+                        <div class="tab-pane fade" id="timeline" role="tabpanel" aria-labelledby="timeline-tab" tabindex="0">
+                            <fieldset class="wizard-fieldset">
+                                <!-- Timeline Status Section -->
+                                <div class="section-card">
+                                    <div class="section-header mb-3">
+                                        <iconify-icon icon="material-symbols:timeline" class="section-icon"></iconify-icon>
+                                        <h6 class="text-md mb-0">Timeline Status Permohonan</h6>
+                                    </div>
+                                    <div class="section-content">
+                                        <div class="alert alert-info mb-4" role="alert">
+                                            <div class="d-flex">
+                                                <iconify-icon icon="bi:info-circle-fill" class="me-2 fs-5"></iconify-icon>
+                                                <div>
+                                                    <strong>Status Permohonan:</strong> Berikut adalah timeline status permohonan Anda. Harap periksa secara berkala untuk mengetahui kemajuan permohonan.
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="card border p-12">
+                                            <div class="timeline-status">
+                                                <div class="timeline-item completed">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Permohonan Diajukan</h6>
+                                                        <p class="text-muted small mb-0">21 Maret 2025 - 09:30</p>
+                                                        <p class="small">Permohonan berhasil diajukan</p>
+                                                    </div>
+                                                </div>
+                                                <div class="timeline-item completed">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Verifikasi Dokumen</h6>
+                                                        <p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
+                                                        <p class="small">Dokumen telah diverifikasi oleh admin</p>
+                                                    </div>
+                                                </div>
+                                                <div class="timeline-item completed">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Pembuatan Surat Tanggapan
+                                                            Arahan Persetujuan Teknis
+                                                        </h6>
+                                                        <p class="text-muted small mb-0">22 Maret 2025 - 14:15</p>
+                                                        <p class="small">Dokumen telah diverifikasi oleh admin</p>
+                                                    </div>
+                                                </div>
+                                                <div class="timeline-item">
+                                                    <div class="timeline-marker"></div>
+                                                    <div class="timeline-content">
+                                                        <h6 class="mb-0">Penerbitan Surat Tanggapan
+                                                            Arahan Persetujuan Teknis</h6>
+                                                            <p class="text-muted small mb-0">22 Maret 2025 - 15:00</p>
+                                                        <p class="small">Proses permohonan selesai</p>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                    </div>
+                                </div>
+
+                            </fieldset>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Informasi Permohonan -->
+     <div class="col-md-4">
+                    <div class="card">
+                        <div class="card-header bg-light py-3">
+                            <div class="d-flex align-items-center">
+                                <iconify-icon icon="bi:file-earmark-medical" class="text-xl text-primary-600 me-2"></iconify-icon>
+                                <h6 class="mb-0 fw-semibold">Informasi Permohonan</h6>
+                            </div>
+                        </div>
+                        <div class="card-body">
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Nomor Pengajuan</span>
+                                <span class="text-md fw-medium">K23/250120CAEFC3A7E</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Jenis Izin</span>
+                                <span class="text-md fw-medium">SERTIFIKAT LAIK OPERASI - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Tipe Perizinan</span>
+                                <span class="text-md fw-medium">Perusahaan/Yayasan/Pemerintahan</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Status</span>
+                                <span class="badge bg-warning-100 text-warning-600">Substansi Disetujui Tim Sekre LH</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Alamat Maps</span>
+                                <span class="text-md fw-medium">Jl. Kapten Tendean No.20C, RW.3, Kuningan Bar., Kec. Mampang Prpt., Kota Jakarta Selatan, Daerah Khusus Ibukota Jakarta 12710, Indonesia</span>
+                            </div>
+                            <div class="mb-3">
+                                <span class="d-block text-neutral-500 mb-1 text-sm">Tanggal Pengajuan</span>
+                                <span class="text-md">{{ date('d/m/Y') }}</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+    </div>
+    </div>
+
+    <style>
+        .timeline-status {
+            position: relative;
+            padding-left: 28px;
+        }
+        .timeline-status:before {
+            content: '';
+            position: absolute;
+            left: 9px;
+            top: 6px;
+            height: calc(100% - 12px);
+            width: 2px;
+            background: #e9ecef;
+        }
+        .timeline-item {
+            position: relative;
+            padding-bottom: 20px;
+        }
+        .timeline-marker {
+            position: absolute;
+            left: -25px;
+            top: 6px;
+            width: 14px;
+            height: 14px;
+            border-radius: 50%;
+            background: #e9ecef;
+            border: 2px solid #fff;
+        }
+        .timeline-item.completed .timeline-marker {
+            background: #28a745;
+        }
+        .timeline-item.active .timeline-marker {
+            background: #007bff;
+            box-shadow: 0 0 0 4px rgba(0,123,255,0.2);
+        }
+        .timeline-content {
+            padding-left: 10px;
+        }
+
+
+    </style>
+@endsection
diff --git a/resources/views/pertek/slo/index_slo.blade.php b/resources/views/pertek/slo/index_slo.blade.php
new file mode 100644
index 0000000..b980dfc
--- /dev/null
+++ b/resources/views/pertek/slo/index_slo.blade.php
@@ -0,0 +1,76 @@
+@extends('layout.layout')
+@php
+    $title='Permohonan Dokumen Surat Kelayakan Operasional';
+    $subTitle = 'Permohonan Dokumen Surat Kelayakan Operasional';
+    $script = '<script>
+                    let table = new DataTable("#dataTable");
+               </script>';
+@endphp
+
+@section('content')
+
+            <div class="card basic-data-table">
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table bordered-table mb-0" id="dataTable" data-page-length='10'>
+                            <thead>
+                                <tr>
+                                    <th scope="col">
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                No
+                                            </label>
+                                        </div>
+                                    </th>
+                                    <th scope="col">Nomor Permohonan</th>
+                                    <th scope="col">Perusahaan</th>
+                                    <th scope="col">Nama Kegiatan</th>
+                                    <th scope="col">Tipe Perizinan</th>
+                                    <th scope="col">Pemohon</th>
+                                    <th scope="col">Tanggal</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col">Dok</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="form-check style-check d-flex align-items-center">
+                                            <label class="form-check-label">
+                                                01
+                                            </label>
+                                        </div>
+                                    </td>
+                                    {{-- <td><a href="javascript:void(0)" class="text-primary-600" data-bs-toggle="modal" data-bs-target="#detailModal">K24/250319E5CC8C330</a></td> --}}
+                                    <td>
+                                        {{-- <a href="{{ route('pertek.verifikator_arahan') }}" class="text-primary-600">K24/Verifikator</a> --}}
+                                        <a href="{{ route('pertek.detail_slo') }}" class="text-primary-600 bg-amber-300 rounded-2xl">K23/250120CAEFC3A7E</a>
+                                    </td>
+
+                                    @include('pertek.arahan.modal_detail_arahan')
+                                    {{-- @include('pertek.arahan.admin_modal_detail_arahan') --}}
+
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            {{-- <img src="{{ asset('assets/images/user-list/user-list1.png') }}" alt="" class="flex-shrink-0 me-12 radius-8"> --}}
+                                            <h6 class="text-md mb-0 fw-medium flex-grow-1">PT. Permata Hijau</h6>
+                                        </div>
+                                    </td>
+                                    <td>Pembangungan Gedung Baru</td>
+                                    <td>SERTIFIKAT LAIK OPERASI - PEMENUHAN BAKU MUTU AIR LIMBAH (PEMANFAATAN)</td>
+                                    <td>Charles Hasibuan</td>
+                                    <td>21 Maret 2025</td>
+                                    <td> <span class="bg-success-focus text-success-main px-24 py-4 rounded-pill fw-medium text-sm">Proses Review Teknis</span> </td>
+                                    <td>
+                                        <a href="#" class="btn btn-sm btn-light-primary text-success" title="Download Dokumen" download>
+                                            <iconify-icon icon="material-symbols:description" class="text-xl"></iconify-icon>
+                                        </a>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+
+@endsection
diff --git a/resources/views/pertek/subkel/surat_penerimaan.blade.php b/resources/views/pertek/subkel/surat_penerimaan.blade.php
new file mode 100644
index 0000000..a3963db
--- /dev/null
+++ b/resources/views/pertek/subkel/surat_penerimaan.blade.php
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="id">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Surat Tanggapan</title>
+    <style>
+        body {
+            font-family: 'Times New Roman', Times, serif;
+            font-size: 12pt;
+            line-height: 1.5;
+        }
+
+        .kop-surat {
+            text-align: center;
+            padding-bottom: 10px;
+            margin-bottom: 20px;
+        }
+
+        .kop-surat img {
+            width: 100%;
+        }
+
+        .surat-details {
+            width: 100%;
+        }
+
+        .details-table {
+            width: 100%;
+            border-collapse: collapse;
+        }
+
+        .details-table td {
+            padding: 5px 0;
+        }
+
+        .details-table .label {
+            width: 120px;
+        }
+
+        .details-table .colon {
+            width: 20px;
+            text-align: center;
+        }
+
+        .content-surat {
+            margin-top: 20px;
+            text-align: justify;
+        }
+
+        .ttd-section {
+            margin-top: 30px;
+            text-align: right;
+            width: 40%;
+            float: right;
+        }
+
+        .ttd-section p {
+            margin: 5px 0;
+        }
+    </style>
+</head>
+<body>
+    <div class="surat-details">
+        <table class="details-table">
+            <tr>
+                <td class="label">Nomor</td>
+                <td class="colon">:</td>
+                <td class="value">Test</td>
+            </tr>
+            <tr>
+                <td class="label">Sifat</td>
+                <td class="colon">:</td>
+                <td class="value">test</td>
+            </tr>
+            <tr>
+                <td class="label">Lampiran</td>
+                <td class="colon">:</td>
+                <td class="value">test</td>
+            </tr>
+            <tr>
+                <td class="label">Hal</td>
+                <td class="colon">:</td>
+                <td class="value">test</td>
+            </tr>
+            <tr>
+                <td class="label">Tanggal</td>
+                <td class="colon">:</td>
+                <td class="value">test</td>
+            </tr>
+            <tr>
+                <td class="label">Kepada</td>
+                <td class="colon">:</td>
+                <td class="value">test</td>
+            </tr>
+        </table>
+
+        <!-- Isi Surat -->
+        <div class="content-surat">
+            <p>test</p>
+        </div>
+
+        <!-- Tanda Tangan -->
+        <div class="ttd-section">
+            <p>Jakarta, test</p>
+            <p>Kepala Dinas Lingkungan Hidup</p>
+            <br><br><br>
+            <p><u>Nama Pejabat</u></p>
+            <p>NIP. 19700101 199001 1 001</p>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/routes/web.php b/routes/web.php
index 71b71ac..c8b648b 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -1,11 +1,19 @@
 <?php
 
 use App\Http\Controllers\DashboardController;
+use App\Http\Controllers\HomeController;
 use App\Http\Controllers\JadwalSidangController;
 use App\Http\Controllers\LoginController;
 use App\Http\Controllers\NewsController;
 use App\Http\Controllers\PenugasanController;
 use App\Http\Controllers\PerizinanLingkunganController;
+use App\Http\Controllers\Persetujuan\AddendumController;
+use App\Http\Controllers\Persetujuan\AmdalController;
+use App\Http\Controllers\Persetujuan\DelhController;
+use App\Http\Controllers\Persetujuan\DplhController;
+use App\Http\Controllers\Persetujuan\KerangkaController;
+use App\Http\Controllers\Persetujuan\RklController;
+use App\Http\Controllers\Persetujuan\UklController;
 use App\Http\Controllers\PersetujuanTeknisController;
 use App\Http\Controllers\ProfileController;
 use App\Http\Controllers\RincianTeknisController;
@@ -20,6 +28,9 @@ Route::get('/', function () {
     return view('/frontend/home');
 });
 
+Route::get('/', [HomeController::class, 'index'])->name('home');
+
+
 Route::get('/news/detail', function () {
     return view('/frontend/news_detail');
 });
@@ -28,6 +39,10 @@ Route::get('/news', function () {
     return view('/frontend/news');
 });
 
+Route::get('/surat/pertek/penerimaan', function () {
+    return view('/pertek/subkel/surat_penerimaan');
+});
+
 Route::get('/news', [NewsController::class, 'index'])->name('news.index');
 Route::get('/news/detail', [NewsController::class, 'detail'])->name('news.detail');
 
@@ -51,10 +66,13 @@ Route::get('/auth/login', [LoginController::class, 'index'])->name('login.index'
 // Pertek
 Route::prefix('admin')->group(function () {
     Route::get('/pertek/arahan', [PersetujuanTeknisController::class, 'index_arahan'])->name('pertek.index_arahan');
+    Route::get('/pertek/slo', [PersetujuanTeknisController::class, 'index_slo'])->name('pertek.index_slo');
+    Route::get('/pertek/detail-slo', [PersetujuanTeknisController::class, 'detail_slo'])->name('pertek.detail_slo');
     Route::get('/pertek/create-arahan', [PersetujuanTeknisController::class, 'create_arahan'])->name('pertek.create_arahan');
     Route::get('/pertek/verifikator/arahan', [PersetujuanTeknisController::class, 'verifikator_arahan'])->name('pertek.verifikator_arahan');
     Route::get('/pertek/user/arahan', [PersetujuanTeknisController::class, 'user_arahan'])->name('pertek.user_arahan');
     Route::get('/pertek/emisi', [PersetujuanTeknisController::class, 'index_emisi'])->name('pertek.index_emisi');
+    Route::get('/pertek/emisi/detail', [PersetujuanTeknisController::class, 'detail_emisi'])->name('pertek.detail_emisi');
     Route::get('/pertek/airlimbah', [PersetujuanTeknisController::class, 'index_airlimbah'])->name('pertek.index_airlimbah');
     Route::get('/pertek/limbahb3', [PersetujuanTeknisController::class, 'index_limbahb3'])->name('pertek.index_limbahb3');
 });
@@ -80,3 +98,45 @@ Route::prefix('admin')->group(function () {
 Route::prefix('admin')->group(function () {
     Route::get('/profile', [ProfileController::class, 'index'])->name('profile.index');
 });
+
+Route::prefix('admin')->group(function () {
+    Route::get('/news', [NewsController::class, 'index_newsvideo'])->name('news.index_newsvideo');
+    Route::get('/news/create', [NewsController::class, 'create_newsvideo'])->name('news.create_newsvideo');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/kerangka', [KerangkaController::class, 'index'])->name('persetujuan.kerangka.index');
+    Route::get('/kerangka/create', [KerangkaController::class, 'create'])->name('persetujuan.kerangka.create');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/amdal', [AmdalController::class, 'index'])->name('persetujuan.amdal.index');
+    Route::get('/amdal/detail', [AmdalController::class, 'detail'])->name('persetujuan.amdal.detail');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/ukl', [UklController::class, 'index'])->name('persetujuan.ukl.index');
+    Route::get('/ukl/detail', [UklController::class, 'detail'])->name('persetujuan.ukl.detail');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/rkl', [RklController::class, 'index'])->name('persetujuan.rkl.index');
+    Route::get('/rkl/detail', [RklController::class, 'detail'])->name('persetujuan.rkl.detail');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/addendum', [AddendumController::class, 'index'])->name('persetujuan.addendum.index');
+    Route::get('/addendum/detail', [AddendumController::class, 'detail'])->name('persetujuan.addendum.detail');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/delh', [DelhController::class, 'index'])->name('persetujuan.delh.index');
+    Route::get('/delh/detail', [DelhController::class, 'detail'])->name('persetujuan.delh.detail');
+});
+
+Route::prefix('admin')->group(function () {
+    Route::get('/dplh', [DplhController::class, 'index'])->name('persetujuan.dplh.index');
+    Route::get('/dplh/detail', [DplhController::class, 'detail'])->name('persetujuan.dplh.detail');
+});
+
+