PageSourceSearch

https://www.dexindonesia.com/

html dexindonesia.com collected 2026-09-24 11:07:36 UTC 128,447 bytes, 1,624 lines download raw bytes

1<html lang="en">
2
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <meta property="og:image" content="https://www.dexindonesia.com/images/dex-logo.png">
7    <title>DEX Pump Official Website</title>
8    <link rel="icon" type="image/png" href="/images/dex-logo.png">
9    
9<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.js"></script>
9
10    
10<script src="https://cdn.maptiler.com/mapbox-gl-js/v1.5.1/mapbox-gl.js"></script>
10
11    
11<script src="https://cdn.maptiler.com/mapbox-gl-leaflet/latest/leaflet-mapbox-gl.js"></script>
11
12    
12<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
12
13    
13<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ScrollTrigger.min.js"></script>
13
14    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.css" />
15    <link rel="stylesheet" href="https://cdn.maptiler.com/mapbox-gl-js/v1.5.1/mapbox-gl.css" />
16
17    <!-- Google tag (gtag.js) -->
vendor: 68 bytes, lines 17-18
17
18    <script async src="https://www.googletagmanager.com/gtag/js?id=
18G-E746BT8Z1C
vendor: 16 bytes, lines 18-19
18"></script>
19    
19<script>
20        
vendor: 176 bytes, lines 20-27
20window.dataLayer = window.dataLayer || [];
21
22        function gtag() {
23            dataLayer.push(arguments);
24        }
25        gtag('js', new Date());
26
27        gtag('config', '
27G-E746BT8Z1C
vendor: 8 bytes, lines 27-28
27');
28    
28</script>
28
29
30</head>
31
32<!-- Fonts -->
33<link rel="preconnect" href="https://fonts.bunny.net">
34<link href="https://fonts.bunny.net/css?family=poppins:300,400,500,600,700" rel="stylesheet" />
35
36<link rel="preconnect" href="https://fonts.googleapis.com">
37<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
38<link
39    href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
40    rel="stylesheet">
41
42<!-- Flowbite -->
43<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/flowbite.min.css" rel="stylesheet" />
44<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/flowbite.min.js"></script>
44
45
46
47<script src="https://cdn.tailwindcss.com/"></script>
47
48
49
50<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css">
51
52
53<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
54
55
56
57<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
vendor: 1 bytes, line 57
57
58<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
58
59
60
61<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
62<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
62
63
64
65<link rel="stylesheet" href="https://cdn.datatables.net/2.0.2/css/dataTables.dataTables.css" />
66
67
68<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
68
69
70<!-- Loader -->
71<link rel="stylesheet" href="/css/loader.css">
72
73<style>
74    body {
75        font-family: 'Poppins', sans-serif;
76    }
77
78    .poppins {
79        font-family: 'Poppins', sans-serif;
80    }
81
82    .inter {
83        font-family: 'Inter', serif;
84    }
85</style>
86
87<body>
88    <!-- Navbar -->
89    <header class="fixed top-0 z-[80] w-full">
90    <nav class="bg-black border-gray-200 px-4 md:px-6 py-2.5">
91        <div class="flex flex-wrap justify-between md:justify-center items-center mx-auto max-w-screen-xl">
92            <a href="#" class="flex items-center md:hidden ">
93                <img src="/images/logo-white.png" class="mr-3 h-6 md:h-9" alt="Flowbite Logo" />
94            </a>
95            <div class="flex items-center md:order-2 md:hidden">
96                <button data-collapse-toggle="mobile-menu-2" type="button" class="inline-flex items-center p-2 ml-1 text-sm text-gray-500 rounded-lg md:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600" aria-controls="mobile-menu-2" aria-expanded="false">
97                    <span class="sr-only">Open main menu</span>
98                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path></svg>
99                    <svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
100                </button>
101            </div>
102            <div class="hidden justify-between items-center w-full md:flex md:w-auto md:order-1" id="mobile-menu-2">
103                <ul class="flex flex-col mt-4 font-medium md:flex-row md:space-x-8 md:mt-0 items-center">
104                    <li>
105                        <a href="/" class="block py-2 pr-4 pl-3 text-white  rounded bg-primary-700 md:bg-transparent md:text-primary-700 md:p-0" aria-current="page">Beranda</a>
106                    </li>
107
108                    <li>
109                        <a href="/tentang" class="block py-2 pr-4 pl-3 text-white font-thin border-b border-gray-100 hover:bg-gray-50 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 md:p-0">Tentang</a>
110                    </li>
111                    <li>
112                        <a href="/produk" class="block py-2 pr-4 pl-3 text-white font-thin border-b border-gray-100 hover:bg-gray-50 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 md:p-0 ">Produk</a>
113                    </li>
114                    <li class="md:block hidden">
115                        <a href="/" class="flex items-center">
116                            <img src="/images/logo-white.png" class="h-6 md:h-9" alt="Flowbite Logo" />
117                        </a>
118                    </li>
119                    <li>
120                        <a href="/project&galeri" class="block py-2 pr-4 pl-3 text-white font-thin border-b border-gray-100 hover:bg-gray-50 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 md:p-0   ">Project & Galeri</a>
121                    </li>
122                    <li>
123                        <a href="/artikel&event" class="block py-2 pr-4 pl-3 text-white font-thin border-b border-gray-100 hover:bg-gray-50 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 md:p-0    ">Artikel & Event</a>
124                    </li>
125                    <li>
126                        <a href="/kontak" class="block py-2 pr-4 pl-3 text-white font-thin border-b border-gray-100 hover:bg-gray-50 md:hover:bg-transparent md:border-0 md:hover:text-primary-700 md:p-0 ">Kontak</a>
127                    </li>
128                </ul>
129            </div>
130        </div>
131    </nav>
132</header>
133
134    <!-- Content -->
135
136        <section class="bg-white">
137        <div class="grid lg:gap-8 xl:gap-0 lg:grid-cols-12">
138            <div class="mr-auto lg:col-span-7 mt-[30px] px-4 py-8 lg:py-16 lg:px-16 min-[1300px]:h-[700px]">
139                <div class="lg:pt-10 lg:pl-10">
140                    <h1
141                        class="max-[641px]:mt-5 text-center sm:text-left inter max-w-2xl mb-[30px] sm:mb-[65px] text-4xl font-extrabold leading-10 md:text-5xl xl:text-6xl">
142                        Bersama <span class="text-[#0756FF]">DEX</span> Membangun <br>Indonesia</h1>
143
144
145                    <img src="/images/company-profile/line-hero.png" alt="mockup" class="mb-10 w-[400px]">
146
147                <p class="text-center sm:text-left max-w-xl mb-6 font-light !leading-snug text-gray-500 lg:mb-8 md:text-lg lg:text-[16
147px] dark:text-gray-400">Selama bertahun-tahun DEX telah berkontribusi dalam memberikan solusi pendistribusian pompa dengan memberikan inovasi & fasilitas terbaik pada produk & layanan</p>
148                <div class="flex flex-col space-y-7 sm:pr-[230px] sm:justify-start">
149                    <div class="flex flex-row justify-evenly">
150                        <a href="/tentang" class="max-[427px]:!text-[14px] px-5 py-3 text-base font-medium text-center hover:text-[#0756FF] transition text-white border border-[#0756FF] rounded-full hover:bg-transparent focus:ring-4 bg-[#0756FF]">
151                            Tentang
152                        </a>
153                        <a href="/produk" class="max-[427px]:!text-[14px] px-5 py-3 text-base font-medium text-center transition text-gray-900 border border-gray-300 rounded-full hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 bg-[]">
154                            Produk
155                        </a>
156                        <a href="/kontak" class="max-[427px]:!text-[14px] px-5 py-3 text-base font-medium text-center hover:text-[#0756FF] transition text-white border border-[#0756FF] rounded-full hover:bg-transparent focus:ring-4 bg-[#0756FF]">
157                            Kontak
158                        </a>
159                    </div>
160                    <div class="flex">
161                        <a href="/flood-viser" class="flex items-center justify-center gap-3 w-full px-6 py-3 text-base font-semibold text-white rounded-full transition-all duration-500 bg-gradient-to-r from-[#0756FF] via-[#0c9ec6] to-[#0756FF] animate-water hover:shadow-lg transform hover:scale-105 focus:ring-4 focus:ring-blue-300">
162                            <span>
163                                <!-- <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
164                                    <path d="M12.1409 15.7309C11.9764 15.9023 11.7439 16 11.5 16C11.2561 16 11.0236 15.9023 10.8591 15.7309L6.22751 10.9033C5.90388 10.566 5.92847 10.0425 6.28244 9.73407C6.63642 9.42566 7.18571 9.44905 7.50934 9.78637L10.6316 13.0408V0.827586C10.6316 0.370527 11.0204 0 11.5 0C11.9796 0 12.3684 0.370527 12.3684 0.827586V13.0408L15.4907 9.78637C15.8143 9.44905 16.3636 9.42566 16.7176 9.73407C17.0716 10.0425 17.0961 10.566 16.7725 10.9033L12.1409 15.7309Z" fill="#1C274C" />
165                                    <path d="M1.69231 13.9C1.69231 13.403 1.31348 13 0.846154 13C0.378841 13 5.91126e-07 13.403 5.91126e-07 13.9V13.9659C-2.1973e-05 15.607 -4.46179e-05 16.9298 0.131459 17.9702C0.267994 19.0503 0.560075 19.9596 1.23916 20.6819C1.91825 21.4043 2.77329 21.715 3.7888 21.8602C4.76692 22 6.01056 22 7.55348 22H14.4466C15.9895 22 17.2331 22 18.2113 21.8602C19.2268 21.715 20.0817 21.4043 20.7609 20.6819C21.44 19.9596 21.7321 19.0503 21.8686 17.9702C22 16.9298 22 15.607 22 13.9659V13.9C22 13.403 21.6211 13 21.1538 13C20.6865 13 20.3077 13.403 20.3077 13.9C20.3077 15.6225 20.3059 16.8238 20.1914 17.7303C20.08 18.6108 19.8765 19.077 19.5642 19.4092C19.2519 19.7414 18.8136 19.9578 17.9857 20.0763C17.1335 20.1981 16.004 20.2 14.3846 20.2H7.61539C5.99595 20.2 4.86648 20.1981 4.01429 20.0763C3.18645 19.9578 2.74805 19.7414 2.43581 19.4092C2.12356 19.077 1.91998 18.6108 1.80868 17.7303C1.6941 16.8238 1.69231 15.6225 1.69231 13.9Z" fill="#1C274C" />
166                                </svg> -->
167                                <svg width="21.6" height="26.8" viewBox="0 0 54 67" fill="none" xmlns="http://www.w3.org/2000/svg">
168                                    <path fill-rule="evenodd" clip-rule="evenodd" d="M25.8241 0.129691C25.0912 0.314019 24.2111 0.910192 22.6152 2.30342C11.5057 12.0017 4.71688 20.6054 1.70956 28.7978C0.88789 31.036 0.572132 32.2935 0.144102 35.0327C-0.0852031 36.5005 -0.0321883 40.783 0.241666 42.9114C1.48046 52.5382 6.44867 60.2191 13.9072 64.0382C17.8626 66.0635 22.0547 67.0031 27.1232 67C33.1901 66.9965 38.5275 65.4346 42.8935 62.3852C48.3264 58.5907 52.1704 52.1358 53.4292 44.6936C54.6504 37.4742 53.9533 32.1651 50.9392 25.7281C49.4941 22.6421 47.1285 18.9393 44.4991 15.6477C42.8636 13.6002 38.6384 9.02345 36.2978 6.76379C34.3765 4.90872 30.4906 1.43812 29.6003 0.781866C28.6595 0.0885395 27.0756 -0.185004 25.8241 0.129691ZM28.6345 8.81758C32.8282 12.5189 35.4683 15.2005 38.6517 18.9919C43.7956 25.1182 46.8785 31.0764 47.4585 36.0119C47.6232 37.4148 47.5282 41.173 47.2925 42.5713C46.4596 47.5133 44.7355 51.2983 41.9487 54.3026C40.5832 55.7746 39.2227 56.8269 37.5573 57.6994C35.5668 58.742 33.5713 59.4085 31.2486 59.8066C29.5381 60.0997 25.4213 60.1619 23.6356 59.9218C21.4145 59.6231 17.9295 58.6863 17.3499 58.2323C17.176 58.096 17.2712 58.0681 18.1487 57.9986C22.8407 57.627 26.969 55.7993 29.9875 52.7571C32.4903 50.2349 34.0951 47.1952 35.0681 43.1342C35.6188 40.8355 35.7459 39.5365 35.6775 36.905C35.6275 34.982 35.5869 34.6086 35.301 33.4456C34.4149 29.8392 33.1725 27.2111 30.6121 23.5264C28.4778 20.455 25.1075 16.7046 21.9224 13.8566C21.4134 13.4014 20.9987 12.9678 21.0008 12.893C21.0031 12.8182 21.1876 12.6039 21.4111 12.4169C21.6345 12.2298 22.6208 11.3356 23.6028 10.4297C25.0899 9.05803 26.9449 7.38287 26.9862 7.37436C26.9921 7.37323 27.7338 8.02268 28.6345 8.81758ZM16.8226 18.2845C18.8424 20.0147 22.5434 23.8414 24.0853 25.7937C27.3755 29.9598 29.0558 33.5013 29.3136 36.8125C29.4352 38.3734 29.0684 41.0038 28.4769 42.814C28.09 43.9981 27.7983 44.6349 27.1611 45.6863C25.6725 48.1421 23.4473 49.8056 20.6336 50.5658C16.8274 51.5942 12.3878 51.1666 9.50858 49.4941C8.76543 49.0624 8.63771 48.9395 8.3938 48.4211C8.06492 47.7221 7.45574 45.7293 7.09067 44.1584C6.4219 41.2808 6.2909 37.6095 6.76263 34.9679C7.37182 31.5575 9.27261 27.4574 12.2488 23.1344C13.2398 21.6951 16.1974 17.9137 16.3304 17.9161C16.3653 17.9166 16.5869 18.0825 16.8226 18.2845Z" fill="white" />
169                                </svg>
170                            </span>
171                            Kontrol Pompa & Pantau Cuaca – Lihat disini!
172                        </a>
173                    </div>
174                    <style>
175                        @keyframes waterFlow {
176                            0% {
177                                background-position: 0% 50%;
178                            }
179
180                                50% {
181                                    background-position: 100% 50%;
182                                }
183
184                                100% {
185                                    background-position: 0% 50%;
186                                }
187                            }
188
189                            .animate-water {
190                                background-size: 200% 200%;
191                                animation: waterFlow 5s infinite linear;
192                            }
193                        </style>
194                    </div>
195                </div>
196            </div>
197            <div class="max-lg:hidden lg:mt-0 lg:col-span-5 lg:flex overflow-hidden bg-[#0756FF] xl:min-h-screen">
198                <svg class="z-10 relative left-[320px] top-[70px]" width="496" height="614" viewBox="0 0 552 683"
199                    fill="none" xmlns="http://www.w3.org/2000/svg">
200                    <path fill-rule="evenodd" clip-rule="evenodd"
201                        d="M263.979 1.32158C256.488 3.19991 247.491 9.27502 231.177 23.4722C117.613 122.3 48.217 209.972 17.4755 293.454C9.07621 316.262 5.84846 329.077 1.47304 356.989C-0.870965 371.947 -0.329036 415.586 2.47036 437.275C15.1336 535.373 65.9198 613.643 142.162 652.56C182.596 673.198 225.448 682.773 277.259 682.741C339.277 682.706 393.837 666.789 438.467 635.716C494.003 597.05 533.297 531.272 546.165 455.435C558.649 381.869 551.522 327.768 520.712 262.174C505.939 230.726 481.758 192.995 454.879 159.453C438.161 138.589 394.97 91.9505 371.045 68.9242C351.404 50.0207 311.682 14.6547 302.58 7.96735C292.964 0.902233 276.773 -1.88522 263.979 1.32158ZM292.708 89.8527C335.577 127.57 362.565 154.895 395.107 193.531C447.688 255.959 479.202 316.673 485.131 366.968C486.815 381.263 485.844 419.56 483.435 433.809C474.921 484.168 457.296 522.739 428.809 553.352C414.851 568.353 400.943 579.076 383.919 587.966C363.572 598.591 343.173 605.383 319.43 609.439C301.945 612.426 259.863 613.061 241.608 610.614C218.903 607.57 183.279 598.023 177.355 593.397C175.577 592.008 176.55 591.724 185.521 591.016C233.482 587.229 275.683 568.604 306.539 537.604C332.123 511.902 348.528 480.927 358.474 439.545C364.103 416.121 365.402 402.884 364.704 376.068C364.192 356.473 363.777 352.668 360.855 340.817C351.797 304.067 339.097 277.286 312.923 239.738C291.106 208.439 256.654 170.222 224.096 141.201C218.893 136.563 214.654 132.144 214.675 131.382C214.698 130.619 216.584 128.436 218.869 126.53C221.152 124.624 231.235 115.512 241.273 106.281C256.475 92.3029 275.437 75.2327 275.858 75.146C275.919 75.1345 283.501 81.7525 292.708 89.8527ZM171.965 186.322C192.611 203.953 230.444 242.948 246.205 262.842C279.838 305.296 297.015 341.384 299.65 375.126C300.893 391.032 297.144 417.835 291.097 436.283C287.143 448.348 284.16 454.837 277.647 465.551C262.43 490.576 239.684 507.527 210.922 515.274C172.014 525.754 126.63 521.397 97.1989 504.353C89.6022 499.954 88.2966 498.702 85.8033 493.419C82.4414 486.296 76.2142 465.989 72.4824 449.982C65.6461 420.659 64.307 383.247 69.129
2011 356.329C75.3564 321.576 94.7867 279.795 125.21 235.743C135.34 221.077 165.573 182.544 166.933 182.568C167.29 182.574 169.555 184.264 171.965 186.322Z"
202                        fill="#4983FE" />
203                </svg>
204                                <img src="/storage/hero_section/wX9OJjnWlidwJ2OncrGeed33i3rF9EBmv1kJPzph.png" alt=""
205                    class="z-[20] w-[617px] h-[480px] absolute top-[90px] right-[150px] max-[1396px]:right-[60px] max-[1400px]:top-[200px] max-[1400px]:right-[300px]  max-[1400px]:w-[405px] max-[1400px]:h-[317px] min-[1430px]:hover:w-[650px] min-[1430px]:hover:h-[500px] transition-all duration-200 hover:right-[130px]"
206                    draggable="false">
207
208            </div>
209        </div>
210    </section>
211
212    <section data-aos="fade-up">
213        <div class="max-w-screen-xl px-4 py-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12">
214            <div class="text-center mb-10">
215                <h1 class="text-2xl font-bold inter">Visi dan Misi <span class="text-[#0756FF]">DEX</span></h1>
216                <p class="text-[18px] inter mt-3 text-[#596780]">Setiap langkah yang kami ambil selalu didorong oleh visi
217                    yang jelas dan misi yang kuat.</p>
218            </div>
219            <div class="flex md:flex-row flex-col gap-10 align-bottom">
220                <div class="basis-1/2">
221                    <div class="flex items-end gap-5 mb-2 md:justify-end justify-center">
222                        <h2 class="text-2xl text-[#0756FF] text-center font-bold">Visi</h2>
223                        <div class="pb-1">
224                            <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16"
225                                height="16" viewBox="0 0 16 16">
226                                <image
227                                    xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAKBJREFUOE+lk9ENgyAQhv97MNQtXKU7aNIx3MRV3MBRZIwmtr3miBol4J3KI/B9cNwPITFcwyOAKrUWzXm6KUBSkDv58eKKvxi2tzMLItgvEpMghmnCkwvIO+klpOB3T941zKogBwuoCo5gVaDBhwILnBVY4Vmw78IZeBu0kIOrcGjjHTgIyprbH6ED4CVhEhLDL1y3hBJczS190J+Fhf0DoJGEr32l35gAAAAASUVORK5CYII="
228                                    x="0" y="0" width="16" height="16" />
229                            </svg>
230                        </div>
231                    </div>
232                    <ul>
233                        <li class="grid grid-cols-12 items-start min-h-[130px]">
234                            <svg class="col-span-2 sm:col-span-1" xmlns="http://www.w3.org/2000/svg"
235                                xmlns:xlink="http://www.w3.org/1999/xlink" width="29" height="29" viewBox="0 0 29 29">
236                                <image
237                                    xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAAAXNSR0IArs4c6QAAASpJREFUSEvt1r9Kw1AUx/Hv8W9HF2fdBfEJJC4+QeImzeKiryAk2R3t1EFdS2dXg0+gDoJb38AuglT0p7dpQYcaI0kczB0SCIfzuTn3XDjGZC348uaNSLBlsDL9XtI7fTPOX3p24fKZe7T2FEnEJQEz08iIRz1LbDFQOAdnVYPT/K9ix5YDXQFeXeiHlTpUNYKOGv4FSoPmHvNxAGurcDuA08vc8C8Bhcu7vQEnbdhcz/Jc38NuwRteCHV/9tCB4RPcDcBtoBa0ewQHnQzsHtaAfj6Yfa9B8zu5UCM15a30nv7P8ub36OyIX3dvg/6kArYU6LGCOfdbu/5pUKTW8uXJcGNoLcuMMJvwfcUyoqpViWTUt3iMjuFAoUQbK3fwlptzxY1B8ty31Fnvukea9jLNnqkAAAAASUVORK5CYII="
238                                    x="0" y="0" width="29" height="29" />
239                            </svg>
240                            <div class="col-span-10 sm:col-span-11 text-[#596780]">
241                                Menjadi Perusahaan Nasional terdepan dalam pemberian Solusi bagi permasalahan banjir.
242                                Bersama arus inovasi yang terus mengalir, kami teguh sebagai penyedia Solusi Nasional yang
243                                komprehensif. Bertekad efektif mengatasi permasalahan banjir, kami menjadi Sungai utama
244                                dalam Solusi
245                            </div>
246                        </li>
247                    </ul>
248                </div>
249                <div class="mt-10 md:block hidden">
250                    <img src="/images/company-profile/stepper.png" alt="" height="100px">
251                </div>
252                <div class="basis-1/2">
253                    <div class="flex items-end gap-5 mb-2 md:justify-start justify-center">
254                        <h2 class="text-2xl text-[#0756FF] text-center font-bold">Misi</h2>
255                        <div class="pb-1">
256                            <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16"
257                                height="16" viewBox="0 0 16 16">
258                                <image
259                                    xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAKBJREFUOE+lk9ENgyAQhv97MNQtXKU7aNIx3MRV3MBRZIwmtr3miBol4J3KI/B9cNwPITFcwyOAKrUWzXm6KUBSkDv58eKKvxi2tzMLItgvEpMghmnCkwvIO+klpOB3T941zKogBwuoCo5gVaDBhwILnBVY4Vmw78IZeBu0kIOrcGjjHTgIyprbH6ED4CVhEhLDL1y3hBJczS190J+Fhf0DoJGEr32l35gAAAAASUVORK5CYII="
260                                    x="0" y="0" width="16" height="16" />
261                            </svg>
262                        </div>
263                    </div>
264                    <ul>
265                        <div class="mb-10 text-[#596780]">
266                            <li class="grid grid-cols-12 items-start min-h-[130px]">
267                                <svg class="col-span-2 sm:col-span-1" xmlns="http://www.w3.org/2000/svg"
268                                    xmlns:xlink="http://www.w3.org/1999/xlink" width="29" height="29" viewBox="0 0 29 29">
269                                    <image
270                                        xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAAAXNSR0IArs4c6QAAASpJREFUSEvt1r9Kw1AUx/Hv8W9HF2fdBfEJJC4+QeImzeKiryAk2R3t1EFdS2dXg0+gDoJb38AuglT0p7dpQYcaI0kczB0SCIfzuTn3XDjGZC348uaNSLBlsDL9XtI7fTPOX3p24fKZe7T2FEnEJQEz08iIRz1LbDFQOAdnVYPT/K9ix5YDXQFeXeiHlTpUNYKOGv4FSoPmHvNxAGurcDuA08vc8C8Bhcu7vQEnbdhcz/Jc38NuwRteCHV/9tCB4RPcDcBtoBa0ewQHnQzsHtaAfj6Yfa9B8zu5UCM15a30nv7P8ub36OyIX3dvg/6kArYU6LGCOfdbu/5pUKTW8uXJcGNoLcuMMJvwfcUyoqpViWTUt3iMjuFAoUQbK3fwlptzxY1B8ty31Fnvukea9jLNnqkAAAAASUVORK5CYII="
271                                        x="0" y="0" width="29" height="29" />
272                                </svg>
273                                <div class="col-span-10 sm:col-span-11">
274                                    Menciptakan dan mengembangkan produk berteknologi untuk penanganan banjir yang tepat
275                                    guna
276                                </div>
277                            </li>
278                            <li class="grid grid-cols-12 items-start min-h-[130px] -mt-3">
279                                <svg class="col-span-2 sm:col-span-1" xmlns="http://www.w3.org/2000/svg"
280                                    xmlns:xlink="http://www.w3.org/1999/xlink" width="29" height="29" viewBox="0 0 29 29">
281                                    <image
282                                        xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAAAXNSR0IArs4c6QAAAY1JREFUSEvt1i9IA1EcB/Dvz78Dy4p5awZh2mxylgWtuzXxikVZNN8dmDSKFoOKba5aVjzWbCpMMF42uCKMif70t+dwoNve2+7OoD/YHhyP74f357Yf4bMmCmyNE1wGFglId55HNAZvhNOXMp1JHslXqsguM7yIgJ4xTPBaZfJp0mZnDDiJG+zkvzJWaNrmKwBWUuiHFQjKCYJCNX4DxT/a85gzs0BpDchl1JS7EDi4BMJH/ZthtL25LFB1gfQM0HhWo5SAeU8fNkKv94CFLLB7oT5S+w5QWgXOA2DzSG+1RujDoQqd2/4KX55Xq5fVdj/vxxuhPwWtW8DxFlC7V1usUyOhcqmqHiDj0g5wG+qQGP497Qa7z1iHHWqlo4DtvzbT395RQWM0CtAYlVdGYKla/fvp5X2dEzXc3ma5f2iqGAOqFzl4lvFFGhw5eMYfQqdsfoqhz+27x8l3g4yAUgW2mCBtaCJFBEd1+AX2mODGrTLDb1XIa6Nt2GaHGRugaBtvlj6XcUOA36xQINY7Jo2e9nTavoQAAAAASUVORK5CYII="
283                                        x="0" y="0" width="29" height="29" />
284                                </svg>
285                                <div class="col-span-10 sm:col-span-11">
286                                    Menyediakan produk dan layanan yang prima di seluruh wilayah Indonesia
287
288                                </div>
289                            </li>
290                            <li class="grid grid-cols-12 items-start min-h-[130px]">
291                                <svg class="col-span-2 sm:col-span-1" xmlns="http://www.w3.org/2000/svg"
292                                    xmlns:xlink="http://www.w3.org/1999/xlink" width="29" height="29" viewBox="0 0 29 29">
293                                    <image
294                                        xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAAAXNSR0IArs4c6QAAAd9JREFUSEvtlj9MFFEQh7/xHwQKr5HQHZ0FCbGh1bOxIXS3doSjwEKwozS5vcSOUs6GAozdSUXCFTRc6IQGSCCh4zqDhVBACEZH5x6bnBFxuNythf6S3bd5eZnvzbx5syNc6FZeczeFosIDgUwy36ax9k1Y/FKRt2ZP7NX9VIuqxG0C/NaMCvF5RUpyO9LCDVjoNDCx/1V5LF2RrgG5tKA/WDWDaopAQx39DSj/oZcec6YHpkdgKAuZXqh/grkV2K5fLyvc4c3eg9UYbGxkw0kAm2YWYa7qB7uh889hLAfLm/CsDEen8GIEZsfDBvonOgA1oHn5rhbCmuisEr76C2EjHrk9vczY2COYn4L6Idyf9uDCmpagq8VwnkMDsL4Hk+Wfvf8TviXofhnu9gTwzgG8roawe9USNDH+cBAqMwH+pATruz6sG5rtCwbt/JqVZPWr92CPR27ox4VfPbJi8WE2ZPXkG3+I3dDkTponyxtwfAqjwxeV6TCEt/kqXeWxG2pGXkZg1yQJtc2llr1JKTw+8ReEZs+v5aknSTxr/iHonUg/d6DPvTLK6XeDSk2685pTwdrQVCRCIXT4eY1VKHaaqkrpfEniBrQBjrSgyjjS3sZbrc9VtgRKZ0vS+Bd9B5yBuPbnuw8lAAAAAElFTkSuQmCC"
295                                        x="0" y="0" width="29" height="29" />
296                                </svg>
297                                <div class="col-span-10 sm:col-span-11">
298                                    Membagikan pengetahuan dan pengalaman mengenai penanganan permasalahan banjir kepada
299                                    stakeholder serta Masyarakat
300
301                                </div>
302                            </li>
303                        </div>
304                    </ul>
305                </div>
306            </div>
307        </div>
308    </section>
309
310    <section data-aos="fade-up">
311        <div class="max-w-screen-xl px-4 py-8 mx-auto mb-10 lg:gap-8 xl:gap-0 lg:grid-cols-12">
312            <div class="text-center mb-10 inter">
313                <h1 class="text-2xl font-bold">Galeri <span class="text-[#0756FF]">DEX</span> Pump</h1>
314                <p class="text-[#596780] mt-3 text-[18px]">Kumpulan dokumentasi visual dari berbagai proyek pemasangan,
315                    distribusi, dan pemeliharaan pompa kami.</p>
316            </div>
317
318            <!-- Scroller Style -->
319<style>
320    .scroller {
321        max-width: 100%;
322        height: auto;
323    }
324
325    .scroller__inner {
326        padding-block: 1rem;
327        display: flex;
328        flex-wrap: wrap;
329        gap: 1rem;
330    }
331
332    .scroller__inner>div {
333        position: relative;
334        width: 550px;
335        height: 300px;
336        border-radius: 10px;
337        overflow: hidden;
338        box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
339        transition: all 0.3s ease;
340    }
341
342    .scroller__inner>div img {
343        width: 100%;
344        height: 100%;
345        object-fit: cover;
346        transition: all 0.3s ease;
347    }
348
349    .scroller__inner>div::after {
350        content: attr(data-caption);
351        position: absolute;
352        bottom: 0;
353        left: 0;
354        width: 100%;
355        padding: 5px;
356        background: #0756FF;
357        color: white;
358        text-align: center;
359        opacity: 0;
360        transition: opacity 0.3s ease;
361        border-radius: 0 0 10px 10px;
362    }
363
364    .scroller__inner>div:hover::after {
365        opacity: 1;
366    }
367
368    .scroller[data-animated="true"] {
369        overflow: hidden;
370        -webkit-mask: linear-gradient(90deg,
371                transparent,
372                white 20%,
373                white 80%,
374                transparent);
375        mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
376    }
377
378    .scroller[data-animated="true"] .scroller__inner {
379        width: max-content;
380        flex-wrap: nowrap;
381        animation: scroll var(--_animation-duration, 40s) var(--_animation-direction, forwards) linear infinite;
382    }
383
384    .scroller[data-direction="right"] {
385        --_animation-direction: reverse;
386    }
387
388    .scroller[data-direction="left"] {
389        --_animation-direction: forwards;
390    }
391
392    .scroller[data-speed="fast"] {
393        --_animation-duration: 42s;
394    }
395
396    .scroller[data-speed="slow"] {
397        --_animation-duration: 60s;
398    }
399
400    @keyframes scroll {
401        to {
402            transform: translate(calc(-50% - 0.5rem));
403        }
404    }
405</style>
406
407
408<div class="scroller" data-animated="true" data-direction="left" data-speed="fast">
409    <div class="scroller__inner *:max-[500px]:!h-[200px]">
410                <div data-caption="Pemasangan Pompa Axial" class="max-[500px]:!w-[250px]">
411            <img src="/images/company-profile/foto dex 1.jpg">
412        </div>
413        <div class="max-[500px]:!w-[250px]" data-caption="Pompa Axial di Kebon Agung">
414            <img src="/images/company-profile/foto dex 2.jpg">
415        </div>
416        <div data-caption="Program CSR oleh DEX" class="max-[500px]:!w-[250px]">
417            <img src="/images/company-profile/foto dex 3.jpg">
418        </div>
419        <div data-caption="Serah Terima dengan Klien" class="max-[500px]:!w-[250px]">
420            <img src="/images/company-profile/foto dex 4.jpg">
421        </div>
422        <div data-caption="Quality Check Pompa" class="max-[500px]:!w-[250px]">
423            <img src="/images/company-profile/foto dex 5.jpg">
424        </div>
425            </div>
426</div>
427            <div class="flex justify-center mt-10">
428                <a class="px-3 py-2 min-w-[120px] text-center text-[#0756FF] bg-transparent border border-[#0756FF] rounded active:text-[#0756FF] hover:bg-[#0756FF] hover:text-white transition focus:outline-none focus:ring"
429                    href="https://www.dexindonesia.com/project&amp;galeri">
430                    Lihat Semua
431                </a>
432            </div>
433        </div>
434    </section>
435
436    <section>
437        <section class="overflow-hidden">
438    <div class="max-w-screen-xl px-4 lg:py-16 mx-auto lg:gap-8 xl:gap-0 lg:grid-cols-12">
439        <div class="text-center inter mb-8 sm:mb-10" data-aos="fade-up">
440            <h1 class="text-3xl sm:text-4xl font-extrabold tracking-tight text-slate-900">
441                Peta Sebaran Proyek <span class="text-[#0756FF]">DEX</span>
442            </h1>
443            <p class="mt-3 text-lg text-slate-600 max-w-3xl mx-auto">
444                Berikut Merupakan Wilayah Yang Sudah Mempercayakan Solusi Permasalahan Banjir Ke Pompa Dex.
445            </p>
446        </div>
447
448        <div class="grid grid-cols-2 gap-8 max-[500px]:grid-cols-1 max-[500px]:grid-rows-2">
449            <div data-aos="fade-right" class="map rounded-xl !z-10" id="map">
450
451            </div>
452
453            <div data-aos="fade-left" class="flex flex-col justify-center mt-2">
454                <div class="grid grid-cols-2 gap-4">
455                                            <div class="flex flex-col gap-2">
456                            <div class="flex flex-row gap-2">
457                                <svg width="12" height="21" viewBox="0 0 12 21" fill="none"
458                                    xmlns="http://www.w3.org/2000/svg">
459                                    <rect width="12" height="21" rx="2" fill="#0756FF" />
460                                </svg>
461                                <a href="" data-latitude="" data-longitude=""
462                                    onclick="event.preventDefault(); zoomLocationProv(this);"
463                                    class="hover:text-[17px] transition-all duration-200 text-[#0756FF] font-semibold">Jawa Timur</a>
464                            </div>
465                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
466                                        data-latitude="-7.24614037" data-longitude="112.73778759"
467                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Surabaya</a>
468                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
469                                        data-latitude="-7.44599422" data-longitude="112.71775876"
470                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Sidoarjo</a>
471                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
472                                        data-latitude="-7.15254473" data-longitude="111.88694717"
473                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Bojonegoro</a>
474                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
475                                        data-latitude="-7.47054661" data-longitude="112.43982952"
476                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Mojokerto</a>
477                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
478                                        data-latitude="-7.11812202" data-longitude="112.41453488"
479                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Lamongan</a>
480                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    </div>
481                                            <div class="flex flex-col gap-2">
482                            <div class="flex flex-row gap-2">
483                                <svg width="12" height="21" viewBox="0 0 12 21" fill="none"
484                                    xmlns="http://www.w3.org/2000/svg">
485                                    <rect width="12" height="21" rx="2" fill="#0756FF" />
486                                </svg>
487                                <a href="" data-latitude="" data-longitude=""
488                                    onclick="event.preventDefault(); zoomLocationProv(this);"
489                                    class="hover:text-[17px] transition-all duration-200 text-[#0756FF] font-semibold">Jawa Tengah</a>
490                            </div>
491                                                                                                                                                                                                                                                                                                                                                                                                            <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
492                                        data-latitude="-6.89017170" data-longitude="109.67435662"
493                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Kota Pekalongan</a>
494                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
495                                        data-latitude="-7.04389605" data-longitude="109.61221243"
496                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Kabupaten Pekalongan</a>
497                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
498                                        data-latitude="-6.86727628" data-longitude="109.13782230"
499                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Kota Tegal</a>
500                                                                                                                                                                                                                                                                                                                                                                                                </div>
501                                            <div class="flex flex-col gap-2">
502                            <div class="flex flex-row gap-2">
503                                <svg width="12" height="21" viewBox="0 0 12 21" fill="none"
504                                    xmlns="http://www.w3.org/2000/svg">
505                                    <rect width="12" height="21" rx="2" fill="#0756FF" />
506                                </svg>
507                                <a href="" data-latitude="" data-longitude=""
508                                    onclick="event.preventDefault(); zoomLocationProv(this);"
509                                    class="hover:text-[17px] transition-all duration-200 text-[#0756FF] font-semibold">Sumatera Utara</a>
510                            </div>
511                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
512                                        data-latitude="3.59426538" data-longitude="98.67224089"
513                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Medan</a>
514                                                                                                                                                                                                                                                                                                                                    </div>
515                                            <div class="flex flex-col gap-2">
516                            <div class="flex flex-row gap-2">
517                                <svg width="12" height="21" viewBox="0 0 12 21" fill="none"
518                                    xmlns="http://www.w3.org/2000/svg">
519                                    <rect width="12" height="21" rx="2" fill="#0756FF" />
520                                </svg>
521                                <a href="" data-latitude="" data-longitude=""
522                                    onclick="event.preventDefault(); zoomLocationProv(this);"
523                                    class="hover:text-[17px] transition-all duration-200 text-[#0756FF] font-semibold">Kalimantan Timur</a>
524                            </div>
525                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
526                                        data-latitude="-3.31704922" data-longitude="114.58991988"
527                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Banjarmasin</a>
528                                                                                                                                                                                                                                                        <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
529                                        data-latitude="-0.49619710" data-longitude="117.14348688"
530                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Samarinda</a>
531                                                                                    </div>
532                                            <div class="flex flex-col gap-2">
533                            <div class="flex flex-row gap-2">
534                                <svg width="12" height="21" viewBox="0 0 12 21" fill="none"
535                                    xmlns="http://www.w3.org/2000/svg">
536                                    <rect width="12" height="21" rx="2" fill="#0756FF" />
537                                </svg>
538                                <a href="" data-latitude="" data-longitude=""
539                                    onclick="event.preventDefault(); zoomLocationProv(this);"
540                                    class="hover:text-[17px] transition-all duration-200 text-[#0756FF] font-semibold">Banten</a>
541                            </div>
542                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
543                                        data-latitude="-6.17565722" data-longitude="106.63080319"
544                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Tangerang</a>
545                                                                                                                                                                                                            </div>
546                                            <div class="flex flex-col gap-2">
547                            <div class="flex flex-row gap-2">
548                                <svg width="12" height="21" viewBox="0 0 12 21" fill="none"
549                                    xmlns="http://www.w3.org/2000/svg">
550                                    <rect width="12" height="21" rx="2" fill="#0756FF" />
551                                </svg>
552                                <a href="" data-latitude="" data-longitude=""
553                                    onclick="event.preventDefault(); zoomLocationProv(this);"
554                                    class="hover:text-[17px] transition-all duration-200 text-[#0756FF] font-semibold">Jawa Barat</a>
555                            </div>
556                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           
556                         <a href="" onclick="event.preventDefault(); zoomLocationCity(this);"
557                                        data-latitude="-6.91751756" data-longitude="107.61874148"
558                                        class="hover:text-[17px] transition-all duration-200 text-[#596780]">Bandung</a>
559                                                                                                                                                </div>
560                                    </div>
561
562                <div class="col-span-2 mt-2">
563                    <p class="text-[15px] text-gray-500">*Tekan nama provinsi atau kota untuk melihat lebih jelas</p>
564                </div>
565            </div>
566        </div>
567    </div>
568    </div>
569</section>
570
571<script>
572    var map = L.map('map').setView([-1, 117], 4);
573
574
575    L.tileLayer('https://api.maptiler.com/maps/streets/{z}/{x}/{y}.png?key=1h7e1Z9S76PGy92uF3c5', {
576        attribution: '&copy; MapTiler & OpenStreetMap contributors'
577    }).addTo(map);;
578
579
580    var pumpHouses = [{"id":1,"name_city":"Surabaya","province_id":1,"latitude":"-7.24614037","longitude":"112.73778759"},{"id":2,"name_city":"Sidoarjo","province_id":1,"latitude":"-7.44599422","longitude":"112.71775876"},{"id":3,"name_city":"Bojonegoro","province_id":1,"latitude":"-7.15254473","longitude":"111.88694717"},{"id":4,"name_city":"Mojokerto","province_id":1,"latitude":"-7.47054661","longitude":"112.43982952"},{"id":5,"name_city":"Lamongan","province_id":1,"latitude":"-7.11812202","longitude":"112.41453488"},{"id":6,"name_city":"Kota Pekalongan","province_id":2,"latitude":"-6.89017170","longitude":"109.67435662"},{"id":7,"name_city":"Kabupaten Pekalongan","province_id":2,"latitude":"-7.04389605","longitude":"109.61221243"},{"id":8,"name_city":"Kota Tegal","province_id":2,"latitude":"-6.86727628","longitude":"109.13782230"},{"id":9,"name_city":"Medan","province_id":3,"latitude":"3.59426538","longitude":"98.67224089"},{"id":10,"name_city":"Banjarmasin","province_id":4,"latitude":"-3.31704922","longitude":"114.58991988"},{"id":11,"name_city":"Tangerang","province_id":5,"latitude":"-6.17565722","longitude":"106.63080319"},{"id":12,"name_city":"Bandung","province_id":6,"latitude":"-6.91751756","longitude":"107.61874148"},{"id":13,"name_city":"Samarinda","province_id":4,"latitude":"-0.49619710","longitude":"117.14348688"}];
581
582
583    pumpHouses.forEach(function (pump) {
584        if (pump.latitude != null || pump.longitude != null) {
585            L.marker([pump.latitude, pump.longitude])
586                .addTo(map)
587        }
588    });
589
590    document.querySelectorAll('.leaflet-marker-icon').forEach(function (marker) {
591        marker.style.filter = 'saturate(30%) contrast(400%)'; // Adjust these values to approximate dark blue
592    });
593
594    function zoomLocationCity(el) {
595        latitude = el.getAttribute('data-latitude');
596        longitude = el.getAttribute('data-longitude');
597        map.setView([latitude, longitude], 11);
598    }
599
600    function zoomLocationProv(el) {
601        latitude = el.getAttribute('data-latitude');
602        longitude = el.getAttribute('data-longitude');
603        map.setView([latitude, longitude], 8);
604    }
605</script>
605    </section>
606
607    <section class="mt-[40px]" data-aos="fade-up">
608        <!-- jQuery & Nanogallery2 -->
609<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
609
610<link href="https://cdn.jsdelivr.net/npm/nanogallery2@3/dist/css/nanogallery2.min.css" rel="stylesheet">
611<script src="https://cdn.jsdelivr.net/npm/nanogallery2@3/dist/jquery.nanogallery2.min.js"></script>
611
612
613
614
615<!-- Container slider (overflow-hidden untuk menyembunyikan slide yang tidak aktif) -->
616<div class="relative overflow-hidden max-lg:hidden">
617    <!-- Slider track: gunakan flex dan transisi untuk animasi slide -->
618    <div id="slider" class="flex transition-transform duration-500 ">
619        <!-- Slide 1: Axial Flow (misal section daf) -->
620        <section id="daf" class="min-w-full bg-white">
621            <div class="grid lg:gap-8 xl:gap-0 lg:grid-cols-12">
622                <div class="max-lg:hidden lg:mt-0 lg:col-span-3 lg:flex lg:justify-end lg:items-center overflow-hidden bg-cover bg-center bg-no-repeat xl:min-h-screen">
623                    <img src="/images/company-profile/product-2.png" alt="" class="z-[20] drop-shadow-xl w-[230px] h-[509px] absolute left-[150px] max-[1380px]:left-[50px]" draggable="false">
624                </div>
625                <div class="max-[1188px]:hidden ">
626
627                </div>
628                <div class="mr-auto lg:col-span-7 mt-[30px] px-4 py-8 ml-10 lg:py-16 min-[1300px]:h-[700px]">
629                    <div class="inter">
630                        <div class="mb-10 space-x-4">
631                            <!-- Tab button: Axial Flow aktif -->
632                            <button class="text-[#FFFFFF] bg-[#0756ff] px-5 py-2 font-medium text-base tab-axial">
633                                AXIAL FLOW
634                            </button>
635                            <button class="text-[#0756FF] border-[#0756FF] border-2 px-5 py-2 font-medium text-base tab-sewage">
636                                SEWAGE CENTRIFUGAL
637                            </button>
638                        </div>
639                        <div class="flex flex-col space-y-[-20px]">
640                            <h1 class="text-[30px] font-semibold">SUBMERSIBLE</h1>
641                            <h1 class="text-[80px] font-semibold">AXIAL FLOW</h1>
642                            <h1 class="text-[30px] font-semibold">PUMP</h1>
643                        </div>
644                        <p class="lg:py-4 text-center sm:text-left max-w-xl font-light !leading-snug text-gray-700 md:text-lg lg:text-[20px]">
645                            Rumah pompa perkotaan (mengalirkan air hingga volume besar pada saluran drainase), pengelolaan air limbah & produksi industri, irigasi, pertambangan, dan lain sebagainya.
646                        </p>
647                        <div class="flex flex-col space-y-7 sm:pr-[230px] sm:justify-start">
648                            <div class="flex flex-row gap-[100px] mt-5">
649                                <!-- Contoh info (Flow, Head, Power) -->
650                                <div class="flex flex-col gap-2">
651                                    <div class="flex flex-row gap-2">
652                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
653                                            <rect width="12" height="21" rx="2" fill="#000000" />
654                                        </svg>
655                                        <a href="" class="text-[20px] -mt-1 transition-all duration-200 text-[#000000] font-semibold">Flow</a>
656                                    </div>
657                                    <h1>
658                                        Up to<br>
659                                        <span class="font-semibold text-[24px]">54,000m³/h</span><br>
660                                        (15,000 l/s)
661                                    </h1>
662                                </div>
663                                <div class="flex flex-col gap-2">
664                                    <div class="flex flex-row gap-2">
665                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
666                                            <rect width="12" height="21" rx="2" fill="#000000" />
667                                        </svg>
668                                        <a href="" class="text-[20px] -mt-1 transition-all duration-200 text-[#000000] font-semibold">Head</a>
669                                    </div>
670                                    <h1>
671                                        Up to<br>
672                                        <span class="font-semibold text-[24px]">18 m</span>
673                                    </h1>
674                                </div>
675                                <div class="flex flex-col gap-2">
676                                    <div class="flex flex-row gap-2">
677                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
678                                            <rect width="12" height="21" rx="2" fill="#000000" />
679                                        </svg>
680                                        <a href="" class="text-[20px] -mt-1 transition-all duration-200 text-[#000000] font-semibold">Power</a>
681                                    </div>
682                                    <h1>
683                                        Up to<br>
684                                        <span class="font-semibold text-[24px]">1,500 kW</span>
685                                    </h1>
686                                </div>
687                            </div>
688                        </div>
689                    </div>
690                    <!-- Tombol download flyer -->
691                    <div class="mt-7">
692                        <div class="mt-7">
693                            
694                            <a href="/produk" class="max-[1188px]:w-[450px] relative overflow-hidden group w-full border-2 border-[#0756FF] bg-transparent py-2.5 px-5 font-medium uppercase transition-colors">
695                                <span class="absolute inset-0 bg-[#0756FF] transform scale-y-0 origin-top transition-transform duration-300 group-hover:scale-y-100"></span>
696                                <span class="relative text-[#0756FF] font-medium group-hover:text-white">LIHAT SELENGKAPNYA</span>
697                            </a>
698                            
699                        </div>
700                    </div>
701                </div>
702                <div class="flex lg:items-center">
703                    <!-- Tombol panah kanan sebagai bagian dalam slide Axial Flow -->
704                    <svg width="63" height="63" viewBox="0 0 63 63" fill="none" class="hover:cursor-pointer" xmlns="http://www.w3.org/2000/svg" id="click-right">
705                        <circle cx="31.5" cy="31.5" r="31.5" fill="#0756FF" />
706                        <path d="M28 21L37.5 30.5L28 40" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
707                    </svg>
708                </div>
709            </div>
710            
711        </section>
712
713        <!-- Slide 2: Sewage Centrifugal -->
714        <section id="dcs" class="min-w-full bg-white">
715            <div class="grid lg:grid-cols-12">
716                <div class="flex justify-center xl:pl-4 lg:items-center">
717                    <!-- Tombol panah kiri sebagai bagian dalam slide Sewage Centrifugal -->
718                    <svg width="63" height="63" viewBox="0 0 63 63" fill="none" xmlns="http://www.w3.org/2000/svg" class="hover:cursor-pointer" id="click-left">
719                        <circle cx="31.5" cy="31.5" r="31.5" transform="matrix(-1 0 0 1 63 0)" fill="#0756FF" />
720                        <path d="M33.5 21L24 30.5L33.5 40" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
721                    </svg>
722                </div>
723                <div class="mr-auto lg:col-span-8 mt-[30px] px-4 py-8 ml-10 lg:py-16 min-[1300px]:h-[700px]">
724                    <div class="inter">
725                        <div class="mb-10 space-x-4">
726                            <!-- Tab button: Sewage Centrifugal aktif -->
727                            <button class="text-[#0756FF] border-[#0756FF] border-2  px-5 py-2 font-medium text-base tab-axial">
728                                AXIAL FLOW
729                            </button>
730                            <button class="text-[#FFFFFF] bg-[#0756ff] px-5 py-2 font-medium text-base tab-sewage">
731                                SEWAGE CENTRIFUGAL
732                            </button>
733                        </div>
734                        <div class="flex flex-col space-y-[-20px] max-[1188px]:space-y-[5px]">
735                            <h1 class="text-[30px] font-semibold">SUBMERSIBLE</h1>
736                            <h1 class="text-[65px] font-semibold max-[1188px]:leading-none max-[1188px]:text-[50px]  ">SEWAGE CENTRIFUGAL</h1>
737                            <h1 class="text-[30px] font-semibold">PUMP</h1>
738                        </div>
739                        <p class="lg:py-4 text-center sm:text-left max-w-xl font-light !leading-snug text-gray-700 md:text-lg lg:text-[20px]">
740                            Rumah pompa perkotaan (mengalirkan air pekat hingga lumpur pada saluran drainase), pengelolaan air limbah kawasan industri, pertambangan, bandar udara, pelabuhan dan lain 
740sebagainya.
741                        </p>
742                        <div class="flex flex-col space-y-7 sm:justify-start">
743                            <div class="flex flex-row gap-[100px] mt-5">
744                                <!-- Info Flow, Head, Power -->
745                                <div class="flex flex-col gap-2 ">
746                                    <div class="flex flex-row gap-2">
747                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
748                                            <rect width="12" height="21" rx="2" fill="#000000" />
749                                        </svg>
750                                        <a href="" class="text-[20px] -mt-1 transition-all duration-200 text-[#000000] font-semibold">Flow</a>
751                                    </div>
752                                    <h1>
753                                        Up to<br>
754                                        <span class="font-semibold text-[24px]">7,920 m³/h</span><br>
755                                        (2,200 l/s)
756                                    </h1>
757                                </div>
758                                <div class="flex flex-col gap-2">
759                                    <div class="flex flex-row gap-2">
760                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
761                                            <rect width="12" height="21" rx="2" fill="#000000" />
762                                        </svg>
763                                        <a href="" class="text-[20px] -mt-1 transition-all duration-200 text-[#000000] font-semibold">Head</a>
764                                    </div>
765                                    <h1>
766                                        Up to<br>
767                                        <span class="font-semibold text-[24px]">62 m</span>
768                                    </h1>
769                                </div>
770                                <div class="flex flex-col gap-2">
771                                    <div class="flex flex-row gap-2">
772                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
773                                            <rect width="12" height="21" rx="2" fill="#000000" />
774                                        </svg>
775                                        <a href="" class="text-[20px] -mt-1 transition-all duration-200 text-[#000000] font-semibold">Power</a>
776                                    </div>
777                                    <h1>
778                                        Up to<br>
779                                        <span class="font-semibold text-[24px]">355 kW</span>
780                                    </h1>
781                                </div>
782                            </div>
783                        </div>
784                    </div>
785                    <!-- Tombol download flyer -->
786                    <div class="mt-7">
787                        <div class="mt-7">
788                            
789                            <a href="/produk" class="max-[1188px]:w-1/2 relative overflow-hidden group w-full border-2 border-[#0756FF] bg-transparent py-2.5 px-5 font-medium uppercase transition-colors">
790                                <span class="absolute inset-0 bg-[#0756FF] transform scale-y-0 origin-top transition-transform duration-300 group-hover:scale-y-100"></span>
791                                <span class="relative text-[#0756FF] font-medium group-hover:text-white">LIHAT SELENGKAPNYA</span>
792                            </a>
793                           
794                        </div>
795                    </div>
796                </div>
797                <div class="flex max-lg:hidden lg:mt-0 lg:col-span-3 lg:flex lg:justify-end lg:items-center overflow-hidden bg-cover bg-center bg-no-repeat xl:min-h-screen" >
798                    <div class="absolute">
799                        <img src="/images/company-profile/product-1.png" alt="" class="z-[20] max-[1380px]:right-3 max-[1380px]:bottom-[50px] drop-shadow-xl w-[300px] h-[509px] right-[230px] relative" draggable="false">
800                    </div>
801                </div>
802            </div>
803     
804        </section>
805    </div>
806</div>
807<div class="lg:hidden">
808<section class="min-[1400px]:mt-5 overflow-x-hidden" data-aos="fade-zoom-in"
809    data-aos-easing="ease-in-back"
810    data-aos-delay="300"
811    data-aos-offset="0">
812    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12">
813        <div class="text-center mb-10">
814            <h1 class="inter text-2xl font-bold">Produk <span class="text-[#0756FF]">DEX</span> Pump</h1>
815        </div>
816        <div class="mb-4 border-b border-gray-200">
817            <ul class="flex flex-wrap justify-center -mb-px text-sm font-medium text-center inter" id="default-tab" data-tabs-toggle="#default-tab-content" role="tablist">
818                <li class="me-2" role="presentation">
819                    <button class="inline-block p-4 border-b-2 roun
819ded-t-lg" id="profile-tab" data-tabs-target="#profile" type="button" role="tab" aria-controls="profile" aria-selected="false">Submersible Axial Flow Pump</button>
820                </li>
821                <li class="me-2" role="presentation">
822                    <button class="inline-block p-4 border-b-2 rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300" id="dashboard-tab" data-tabs-target="#dashboard" type="button" role="tab" aria-controls="dashboard" aria-selected="false">Submersible Sewage Centrifugal Pump</button>
823                </li>
824            </ul>
825        </div>
826        <div id="default-tab-content">
827            <div class="hidden p-4" id="profile" role="tabpanel" aria-labelledby="profile-tab">
828                <div class="flex md:gap-20 gap-0 md:flex-row flex-col">
829
830                    <div class="md:order-none order-first grid justify-center p-10">
831                        <img src="/images/company-profile/product-2.png" class="max-[500px]:w-[100px]" alt="">
832                    </div>
833                    <div class="basis-1/2 min-[767px]:mt-[50px]">
834                        <ul class="text-gray-500 list-inside dark:text-gray-400 ">
835                            <div class="mb-10 space-y-2">
836                                <div class="flex space-x-2">
837                                    <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
838                                        <rect width="12" height="21" rx="2" fill="#0756FF" />
839                                    </svg>
840                                    <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
841                                        Aplikasi
842                                    </span>
843                                </div>
844
845                                <p class="text-[#596780]">
846                                    Rumah pompa perkotaan (mengalirkan air hingga volume besar pada saluran drainase), pengelolaan air limbah & produksi industri, irigasi, pertambangan, dan lain sebagainya.
847                                </p>
848                            </div>
849                            <div class="mb-10 max-lg:justify-between flex flex-row">
850                                <div class="flex flex-col">
851                                    <li class="flex items-center space-x-2">
852                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
853                                            <rect width="12" height="21" rx="2" fill="#0756FF" />
854                                        </svg>
855                                        <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
856                                            Flow
857                                        </span>
858                                    </li>
859                                    <h1 class="text-black ml-3">
860                                        Up to<br>
861                                        <span class="font-semibold text-[24px] max-[500px]:!text-[18px]">54,000 m³/h</span><br>
862                                        (15,000 l/s)
863                                    </h1>
864                                </div>
865                                <div class="flex flex-col">
866                                    <li class="flex items-center space-x-2">
867                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
868                                            <rect width="12" height="21" rx="2" fill="#0756FF" />
869                                        </svg>
870                                        <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
871                                            Head
872                                        </span>
873                                    </li>
874                                    <h1 class="text-black ml-3">
875                                        Up to<br>
876                                        <span class="font-semibold text-[24px] max-[500px]:!text-[18px]">18 m</span><br>
877
878                                    </h1>
879                                </div>
880                                <div class="flex flex-col">
881                                    <li class="flex items-center space-x-2">
882                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
883                                            <rect width="12" height="21" rx="2" fill="#0756FF" />
884                                        </svg>
885                                        <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
886                                            Power
887                                        </span>
888                                    </li>
889                                    <h1 class="text-black ml-3">
890                                        Up to<br>
891                                        <span class="font-semibold text-[24px] max-[500px]:!text-[18px]">1,500 kW</span><br>
892
893                                    </h1>
894                                </div>
895                            </div>
896                        </ul>
897                        <div class="mt-7">
898                            
899                            <a href="/produk" class="relative overflow-hidden group w-full border-2 border-[#0756FF] bg-transparent py-2.5 px-5 font-medium uppercase transition-colors">
900                                <span class="absolute inset-0 bg-[#0756FF] transform scale-y-0 origin-top transition-transform duration-300 group-hover:scale-y-100"></span>
901                                <span class="relative text-[#0756FF] font-medium group-hover:text-white">LIHAT SELENGKAPNYA</span>
902                            </a>
903                            
904                        </div>
905                    </div>
906
907                </div>
908                
909            </div>
910            <div class="hidden p-4 rounded-lg" id="dashboard" role="tabpanel" aria-labelledby="dashboard-tab">
911                <div class="flex md:gap-20 gap-0 md:flex-row flex-col">
912
913                    <div class="md:order-none order-first grid justify-center p-10">
914                        <img src="/images/company-profile/product-1.png" class="max-[500px]:w-[100px]" alt="">
915                    </div>
916                    <div class="basis-1/2 min-[767px]:mt-[50px]">
917                        <ul class="text-gray-500 list-inside dark:text-gray-400 ">
918                            <div class="mb-10 space-y-2">
919                                <div class="flex space-x-2">
920                                    <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
921                                        <rect width="12" height="21" rx="2" fill="#0756FF" />
922                                    </svg>
923                                    <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
924                                        Aplikasi
925                                    </span>
926                                </div>
927
928                                <p class="text-[#596780]">
929                                    Rumah pompa perkotaan (mengalirkan air pekat hingga lumpur pada saluran drainase), pengelolaan air limbah kawasan industri, pertambangan, bandar udara, pelabuhan dan lain sebagainya.
930                                </p>
931                            </div>
932                            <div class="mb-10 max-lg:justify-between flex flex-row">
933                                <div class="flex flex-col">
934                                    <li class="flex items-center space-x-2">
935                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
936                                            <rect width="12" height="21" rx="2" fill="#0756FF" />
937                                        </svg>
938                                        <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
939                                            Flow
940                                        </span>
941                                    </li>
942                                    <h1 class="text-black ml-3">
943                                        Up to<br>
944                                        <span class="font-semibold text-[24px] max-[500px]:!text-[18px]">7,920 m³/h</span><br>
945                                        (2,200 l/s)
946                                    </h1>
947                                </div>
948                                <div class="flex flex-col">
949                                    <li class="flex items-center space-x-2">
950                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
951                                            <rect width="12" height="21" rx="2" fill="#0756FF" />
952                                        </svg>
953                                        <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
954                                            Head
955                                        </span>
956                                    </li>
957                                    <h1 class="text-black ml-3">
958                                        Up to<br>
959                                        <span class="font-semibold text-[24px] max-[500px]:!text-[18px]">62 m</span><br>
960
961                                    </h1>
962                                </div>
963                                <div class="flex flex-col">
964                                    <li class="flex items-center space-x-2">
965                                        <svg width="12" height="21" viewBox="0 0 12 21" fill="none" xmlns="http://www.w3.org/2000/svg">
966                                            <rect width="12" height="21" rx="2" fill="#0756FF" />
967                                        </svg>
968                                        <span class="font-medium text-[#0756FF] dark:text-[#0756FF]">
969                                            Power
970                                        </span>
971                                    </li>
972                                    <h1 class="text-black ml-3">
973                                        Up to<br>
974                                        <span class="font-semibold text-[24px] max-[500px]:!text-[18px]">355 kW</span><br>
975
976                                    </h1>
977                                </div>
978                            </div>
979                        </ul>
980                        <div class="mt-7">
981                            
982                            <a href="/produk" class="relative overflow-hidden group w-full border-2 border-[#0756FF] bg-transparent py-2.5 px-5 font-medium uppercase transition-colors">
983                                <span class="absolute inset-0 bg-[#0756FF] transform scale-y-0 origin-top transition-transform duration-300 group-hover:scale-y-100"></span>
984                                <span class="relative text-[#0756FF] font-medium group-hover:text-white">LIHAT SELENGKAPNYA</span>
985                            </a>
986                            
987                        </div>
988                    </div>
989                </div>
990                   
991            </div>
992        </div>
993    </div>
994</section>
995</div>
996
997
998
999<script>
1000    $(document).ready(function() {
1001        let currentIndex = 0; // 0: slide Axial Flow (daf), 1: slide Sewage Centrifugal (dcs)
1002        const totalSlides = 2; // Jumlah slide
1003
1004        // Fungsi untuk update transform slider
1005        function updateSlider() {
1006            // Sembunyikan navigation element (tab dan panah) sebelum perpindahan slide
1007            $('.tab-sewage, .tab-axial, #click-right, #click-left').css('opacity', 0);
1008
1009            // Lakukan perpindahan slide
1010            $('#slider').css('transform', 'translateX(' + (-currentIndex * 100) + '%)');
1011
1012            // Setelah 1 detik (waktu transisi slider), tampilkan navigation element secara smooth selama 1 detik
1013            setTimeout(function() {
1014                $('.tab-sewage, .tab-axial, #click-right, #click-left').animate({
1015                    opacity: 1
1016                }, 500);
1017            }, 500);
1018        }
1019
1020        // Event click panah dalam slide
1021        $('#click-right').click(function() {
1022            if (currentIndex < totalSlides - 1) {
1023                currentIndex++;
1024                updateSlider();
1025            }
1026        });
1027        $('#click-left').click(function() {
1028            if (currentIndex > 0) {
1029                currentIndex--;
1030                updateSlider();
1031            }
1032        });
1033
1034        // Event click pada tab button
1035        $('.tab-sewage').click(function() {
1036            currentIndex = 1;
1037            updateSlider();
1038        });
1039        $('.tab-axial').click(function() {
1040            currentIndex = 0;
1041            updateSlider();
1042        });
1043    });
1044</script>
1044    </section>
1045            <section data-aos="fade-up" data-aos-duration="1000">
1046            <div class="max-w-screen-xl px-4 py-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12">
1047                <div class="flex justify-between border-b border-gray-200 dark:border-gray-700 mb-10">
1048                    <h1 class="inter text-2xl font-bold mb-5">Artikel <span class="text-[#0756FF]">DEX</span></h1>
1049                    <button type="button" class="text-[#0756FF] border-1 border-[#0756FF]"
1050                        onclick="window.location.href='/artikel&event'">Lihat Semua</button>
1051                </div>
1052                <div class="flex md:flex-row flex-col gap-5">
1053                                            <div
1054                            class="max-w-sm hover:border hover:border-gray-300 rounded-lg p-3 hover:shadow-lg transition-all duration-300">
1055                            <div class="h-[200px] flex items-center rounded-lg"
1056                                style="background-repeat: no-repeat; background-size: cover; background-position: center; background-image: url('/storage/article/0OxdHdDX7nTiSX3cdiilm5jFI5rlKzQMFq76NnJZ.jpg')">
1057                            </div>
1058                            <div class="p-2">
1059                                <a
1060                                    href="https://www.dexindonesia.com/artikel&amp;event/culture/5/dex-pump-solusi-terdepan-untuk-pengendalian-banjir-di-indonesia">
1061                                    <h5 class="inter mb-2 text-[18px] font-bold tracking-tight text-gray-900">DEX Pump: Solusi Terdepan untuk Pengendalian Banjir di Indonesia</h5>
1062                                </a>
1063                                <div class="flex items-center gap-2">
1064                                    <svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
1065                                        <g clip-path="url(#clip0_2177_10676)">
1066                                            <path
1067                                                d="M14.1849 1.45616H12.7449V0.709492C12.7449 0.567269 12.7004 0.451714 12.6116 0.362825C12.5227 0.273936 12.4071 0.229492 12.2649 0.229492C12.1227 0.229492 12.0071 0.273936 11.9182 0.362825C11.8293 0.451714 11.7849 0.567269 11.7849 0.709492V1.45616H4.74489V0.709492C4.74489 0.567269 4.70045 0.451714 4.61156 0.362825C4.52267 0.273936 4.40711 0.229492 4.26489 0.229492C4.12267 0.229492 4.00711 0.273936 3.91823 0.362825C3.82934 0.451714 3.78489 0.567269 3.78489 0.709492V1.45616H2.34489C1.776 1.45616 1.28711 1.6606 0.878226 2.06949C0.469337 2.47838 0.264893 2.96727 0.264893 3.53616V14.1495C0.264893 14.7184 0.469337 15.2073 0.878226 15.6162C1.28711 16.025 1.776 16.2295 2.34489 16.2295H14.1849C14.7538 16.2295 15.2427 16.025 15.6516 15.6162C16.0604 15.2073 16.2649 14.7184 16.2649 14.1495V3.53616C16.2649 2.96727 16.0604 2.47838 15.6516 2.06949C15.2427 1.6606 14.7538 1.45616 14.1849 1.45616ZM2.34489 2.46949H3.78489V3.00282C3.78489 3.10949 3.82934 3.21616 3.91823 3.32283C4.00711 3.42949 4.12267 3.48283 4.26489 3.48283C4.40711 3.48283 4.52267 3.42949 4.61156 3.32283C4.70045 3.21616 4.74489 3.10949 4.74489 3.00282V2.46949H11.7849V3.00282C11.7849 3.10949 11.8293 3.21616 11.9182 3.32283C12.0071 3.42949 12.1227 3.48283 12.2649 3.48283C12.4071 3.48283 12.5227 3.42949 12.6116 3.32283C12.7004 3.21616 12.7449 3.10949 12.7449 3.00282V2.46949H14.1849C14.5049 2.46949 14.7627 2.57616 14.9582 2.78949C15.1538 3.00282 15.2516 3.25171 15.2516 3.53616V4.70949H1.27823V3.53616C1.27823 3.25171 1.376 3.00282 1.57156 2.78949C1.76711 2.57616 2.02489 2.46949 2.34489 2.46949ZM14.1849 15.2162H2.34489C2.02489 15.2162 1.76711 15.1184 1.57156 14.9228C1.376 14.7273 1.27823 14.4695 1.27823 14.1495V5.72283H15.2516V14.1495C15.2516 14.4695 15.1538 14.7273 14.9582 14.9228C14.7627 15.1184 14.5049 15.2162 14.1849 15.2162Z"
1068                                                fill="#6D757F" />
1069                                        </g>
1070                                        <defs>
1071                                            <clipPath id="clip0_2177_10676">
1072                                                <rect width="16.53" height="16" fill="white"
1073                                                    transform="matrix(1 0 0 -1 0 16.2295)" />
1074                                            </clipPath>
1075                                        </defs>
1076                                    </svg>
1077                                    <span class="inter font-medium text-[#6D757F]">25 Mar 2025</span>
1078                                </div>
1079                                <p class="mb-3 font-normal inter text-gray-500">
1080                                    
1081                                    <a href="https://www.dexindonesia.com/artikel&amp;event/culture/5/dex-pump-solusi-terdepan-untuk-pengendalian-banjir-di-indonesia"
1082                                        class="text-[#0756FF]">Baca Selengkapnya</a>
1083                                </p>
1084                            </div>
1085                        </div>
1086                                    </div>
1087            </div>
1088        </section>
1089    
1090    <!-- JavaScript Counter Animation -->
1091    
1091<script>
1092        document.addEventListener('DOMContentLoaded', function () {
1093            function animateCounter(elementId, targetValue, duration = 2000) {
1094                const element = document.getElementById(elementId);
1095                if (!element) return;
1096
1097                const startValue = 0;
1098                const increment = targetValue / (duration / 16);
1099                let currentValue = startValue;
1100
1101                const updateCounter = () => {
1102                    currentValue += increment;
1103                    if (currentValue >= targetValue) {
1104                        element.textContent = Math.floor(targetValue);
1105                    } else {
1106                        element.textContent = Math.floor(currentValue);
1107                        requestAnimationFrame(updateCounter);
1108                    }
1109                };
1110                updateCounter();
1111            }
1112
1113            const observerOptions = {
1114                threshold: 0.3,
1115                rootMargin: '0px 0px -50px 0px'
1116            };
1117
1118            const observer = new IntersectionObserver((entries) => {
1119                entries.forEach(entry => {
1120                    if (entry.isIntersecting) {
1121                        setTimeout(() => animateCounter('counter1', 100), 500);
1122                        setTimeout(() => animateCounter('counter2', 15), 800);
1123                        setTimeout(() => animateCounter('counter3', 6), 1100);
1124                        observer.unobserve(entry.target);
1125                    }
1126                });
1127            }, observerOptions);
1128
1129            const heroContainer = document.querySelector('.bg-\\[\\#0756FF\\]');
1130            if (heroContainer) {
1131                observer.observe(heroContainer);
1132            }
1133        });
1134    </script>
1134
1135
1136
1137    <!-- Footer -->
1138    <!-- Fonts -->
1139<link rel="preconnect" href="https://fonts.bunny.net">
1140<link href="https://fonts.bunny.net/css?family=poppins:300,400,500,600,700" rel="stylesheet" />
1141
1142<style>
1143    footer {
1144        font-family: 'Poppins', sans-serif;
1145    }
1146
1147    /* Perbesar social icons tanpa menyentuh inline SVGs */
1148    footer .social-icons svg {
1149        width: 28px;
1150        height: 28px;
1151        transition: transform 0.2s ease, color 0.2s ease;
1152    }
1153
1154    /* Hover effects untuk social icons */
1155    footer .social-icons a:hover svg {
1156        transform: scale(1.1);
1157    }
1158
1159    /* Focus states untuk aksesibilitas */
1160    footer a:focus {
1161        outline: none;
1162        background-color: rgba(255, 255, 255, 0.1);
1163        border-radius: 4px;
1164    }
1165
1166    /* Hover effects untuk link footer */
1167    footer a {
1168        transition: color 0.2s ease;
1169    }
1170
1171    /* Konsistensi spacing */
1172    footer .grid-section {
1173        gap: 1.5rem;
1174    }
1175
1176    .logo-dex-pump:hover {
1177        transform: scale(1.05);
1178        transition: transform 0.3s ease;
1179    }
1180
1181    /* Disabled: Company Profile toast styles (hidden per request) */
1182    #toast-pdf {
1183        visibility: hidden;
1184        min-width: 200px;
1185        background-color: red;
1186        color: #fff;
1187        text-align: center;
1188        border-radius: 4px;
1189        padding: 12px;
1190        position: fixed;
1191        z-index: 100;
1192        left: 50%;
1193        bottom: 30px;
1194        transform: translateX(-50%);
1195        font-size: 16px;
1196    }
1197
1198    #toast-pdf.show {
1199        visibility: visible;
1200        -webkit-animation: Pfadein 0.5s, Pfadeout 0.5s 2.5s;
1201        animation: Pfadein 0.5s, Pfadeout 0.5s 2.5s;
1202    }
1203
1204    @-webkit-keyframes Pfadein {
1205        from { bottom: 0; opacity: 0; }
1206        to { bottom: 30px; opacity: 1; }
1207    }
1208    @keyframes Pfadein {
1209        from { bottom: 0; opacity: 0; }
1210        to { bottom: 30px; opacity: 1; }
1211    }
1212    @-webkit-keyframes Pfadeout {
1213        from { bottom: 30px; opacity: 1; }
1214        to { bottom: 0; opacity: 0; }
1215    }
1216    @keyframes Pfadeout {
1217        from { bottom: 30px; opacity: 1; }
1218        to { bottom: 0; opacity: 0; }
1219    }
1220    */
1221</style>
1222
1223<footer class="bg-black px-4 py-8 sm:px-6 lg:px-8" role="contentinfo" aria-label="Footer">
1224    <div class="mx-auto max-w-screen-xl">
1225        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 lg:gap-12 mb-6">
1226            <!-- Navigasi + Informasi (Dual-Header) -->
1227            <div>
1228                <!-- Navigasi -->
1229                <div>
1230                    <h2 class="mb-4 text-base font-bold text-white tracking-wider" id="nav-heading">Navigasi</h2>
1231                    <ul class="space-y-2 mb-4" role="list" aria-labelledby="nav-heading">
1232                        <li>
1233                            <a href="/" class="text-gray-300 hover:underline hover:text-white transition-colors"
1234                                aria-label="Halaman beranda">Beranda</a>
1235                        </li>
1236                        <li>
1237                            <a href="/tentang" class="text-gray-300 hover:underline hover:text-white transition-colors"
1238                                aria-label="Tentang perusahaan">Tentang Kami</a>
1239                        </li>
1240                        <li>
1241                            <a href="/produk" class="text-gray-300 hover:underline hover:text-white transition-colors"
1242                                aria-label="Produk yang tersedia">Produk</a>
1243                        </li>
1244                        <li>
1245                            <a href="/project&galeri" class="text-gray-300 hover:underline hover:text-white transition-colors"
1246                                aria-label="Proyek dan galeri">Proyek &amp; Galeri</a>
1247                        </li>
1248                        <li>
1249                            <a href="/artikel&event" class="text-gray-300 hover:underline hover:text-white transition-colors"
1250                                aria-label="Artikel dan event">Artikel &amp; Event</a>
1251                        </li>
1252                        <li>
1253                            <a href="/kontak" class="text-gray-300 hover:underline hover:text-white transition-colors"
1254                                aria-label="Hubungi kami">Kontak</a>
1255                        </li>
1256                    </ul>
1257                </div>
1258
1259                <!-- Informasi -->
1260                <div>
1261                    <h2 class="mb-4 text-base font-bold text-white tracking-wider" id="info-heading">Informasi</h2>
1262                    <ul class="space-y-2" role="list" aria-labelledby="info-heading">
1263                        <li>
1264                            <a href="/career" class="text-gray-300 hover:underline hover:text-white transition-colors"
1265                                aria-label="Karir dan lowongan kerja">Karir</a>
1266                        </li>
1267                    </ul>
1268                </div>
1269            </div>
1270
1271            <!-- Kontak -->
1272            <div>
1273                <h2 class="mb-4 text-base font-bold text-white tracking-wider" id="contact-heading">Kontak</h2>
1274                <div class="space-y-4" aria-labelledby="contact-heading">
1275                                            <div>
1276                            <p class="text-gray-400 text-sm mb-1">Alamat:</p>
1277                            <a href="https://www.google.com/maps/search/Dex+Pump" target="_blank" rel="noopener"
1278                                class="text-gray-300 hover:underline hover:text-white transition-colors block leading-relaxed"
1279                                style="max-width: 200px;" aria-label="Lihat alamat di peta">Ruko Section One, Jl. Rungkut Industri Raya No.1 Blok A-10, Kendangsari, Tenggilis Mejoyo, Surabaya, East Java</a>
1280                        </div>
1281                                                                <div>
1282                            <p class="text-gray-400 text-sm mb-1">Telepon:</p>
1283                            <span class="text-gray-300">(031)5953529</span>
1284                        </div>
1285                                    </div>
1286            </div>
1287
1288            <!-- Terhubung dengan Kami -->
1289            <div>
1290                <div>
1291                    <a href="/" class="inline-block" aria-label="Kembali ke beranda">
1292                        <img src="/images/logo-white.png" class="h-16 logo-dex-pump" alt="Logo DEX Pump" />
1293                    </a>
1294                </div>
1295                <h2 class="mb-4 mt-5 text-base font-bold text-white tracking-wider" id="connect-heading">Terhubung dengan
1296                    Kami</h2>
1297                <div class="space-y-3" aria-labelledby="connect-heading">
1298                    <!-- Sub-section: Unduh Aplikasi Kami -->
1299                    <div>
1300                        <p class="text-gray-400 text-sm mb-1">Unduh Aplikasi Kami:</p>
1301                        <div class="space-y-1">
1302                            <a href="https://apps.apple.com/id/app/flood-viser/id6747161524"
1303                                class="inline-block transition-transform hover:scale-105"
1304                                aria-label="Unduh di App Store">
1305                                <svg width="129" height="39" viewBox="0 0 154 46" fill="none"
1306                                    xmlns="http://www.w3.org/2000/svg">
1307                                    <rect x="0.5" y="0.5" width="153" height="45" rx="4.5" fill="black" />
1308                                    <rect x="0.5" y="0.5" width="153" height="45" rx="4.5"
1309                                        stroke="#A6A6A6" />
1310                                    <path
1311                                        d="M102.158 20.4535V23.0881H100.52V24.8159H102.158V30.6867C102.158 32.6913 103.057 33.4932 105.321 33.4932C105.718 33.4932 106.097 33.4454 106.428 33.3882V31.6795C106.144 31.7081 105.964 31.7272 105.652 31.7272C104.639 31.7272 104.194 31.2499 104.194 30.1617V24.8159H106.428V23.0881H104.194V20.4535H102.158Z"
1312                                        fill="white" />
1313                                    <path
1314                                        d="M112.194 33.6364C115.205 33.6364 117.051 31.6031 117.051 28.2334C117.051 24.8828 115.195 22.8399 112.194 22.8399C109.182 22.8399 107.327 24.8828 10
13147.327 28.2334C107.327 31.6031 109.173 33.6364 112.194 33.6364ZM112.194 31.8131C110.423 31.8131 109.429 30.5053 109.429 28.2334C109.429 25.9805 110.423 24.6632 112.194 24.6632C113.955 24.6632 114.959 25.9805 114.959 28.2334C114.959 30.4958 113.955 31.8131 112.194 31.8131Z"
1315                                        fill="white" />
1316                                    <path
1317                                        d="M118.631 33.4359H120.667V27.2979C120.667 25.8374 121.756 24.8541 123.299 24.8541C123.659 24.8541 124.265 24.921 124.436 24.9782V22.9545C124.218 22.8972 123.83 22.8686 123.527 22.8686C122.182 22.8686 121.036 23.6132 120.743 24.6346H120.591V23.0404H118.631V33.4359Z"
1318                                        fill="white" />
1319                                    <path
1320                                        d="M129.491 24.5868C130.996 24.5868 131.981 25.6464 132.028 27.2788H126.82C126.934 25.656 127.985 24.5868 129.491 24.5868ZM132.019 30.6294C131.64 31.4408 130.797 31.8895 129.566 31.8895C127.938 31.8895 126.887 30.7344 126.82 28.9111V28.7966H134.102V28.0806C134.102 24.8159 132.369 22.8399 129.5 22.8399C126.593 22.8399 124.747 24.9496 124.747 28.2716C124.747 31.5935 126.555 33.6364 129.509 33.6364C131.867 33.6364 133.515 32.4909 133.979 30.6294H132.019Z"
1321                                        fill="white" />
1322                                    <path
1323                                        d="M88.8072 29.597C88.9642 32.1497 91.0743 33.7822 94.2149 33.7822C97.5714 33.7822 99.6717 32.0705 99.6717 29.3398C99.6717 27.1928 98.4743 26.0055 95.5693 25.3228L94.0088 24.9369C92.1637 24.5016 91.4178 23.9178 91.4178 22.8987C91.4178 21.6125 92.5759 20.7715 94.313 20.7715C95.9619 20.7715 97.1003 21.5927 97.3064 22.9086H99.446C99.3184 20.5044 97.2181 18.8125 94.3425 18.8125C91.251 18.8125 89.1899 20.5044 89.1899 23.0472C89.1899 25.1447 90.3578 26.3913 92.9194 26.9949L94.7449 27.4401C96.6194 27.8853 97.4438 28.5383 97.4438 29.6267C97.4438 30.8931 96.1483 31.8133 94.3817 31.8133C92.4876 31.8133 91.1724 30.9525 90.986 29.597H88.8072Z"
1324                                        fill="white" />
1325                                    <path
1326                                        d="M67.7179 22.8686C66.3165 22.8686 65.1045 23.575 64.4795 24.7587H64.328V23.0404H62.3679V36.8915H64.4038V31.8608H64.5647C65.1045 32.9586 66.2692 33.6077 67.7369 33.6077C70.3408 33.6077 71.9979 31.5363 71.9979 28.2334C71.9979 24.9305 70.3408 22.8686 67.7179 22.8686ZM67.1403 31.7654C65.4359 31.7654 64.3659 30.4098 64.3659 28.2429C64.3659 26.0665 65.4359 24.7109 67.1498 24.7109C68.8731 24.7109 69.9053 26.0378 69.9053 28.2334C69.9053 30.4385 68.8731 31.7654 67.1403 31.7654Z"
1327                                        fill="white" />
1328                                    <path
1329                                        d="M79.1217 22.8686C77.7203 22.8686 76.5082 23.575 75.8833 24.7587H75.7318V23.0404H73.7717V36.8915H75.8075V31.8608H75.9685C76.5082 32.9586 77.6729 33.6077 79.1406 33.6077C81.7446 33.6077 83.4017 31.5363 83.4017 28.2334C83.4017 24.9305 81.7446 22.8686 79.1217 22.8686ZM78.5441 31.7654C76.8396 31.7654 75.7696 30.4098 75.7696 28.2429C75.7696 26.0665 76.8396 24.7109 78.5535 24.7109C80.2769 24.7109 81.309 26.0378 81.309 28.2334C81.309 30.4385 80.2769 31.7654 78.5441 31.7654Z"
1330                                        fill="white" />
1331                                    <path
1332                                        d="M58.7153 33.4359H61.0511L55.9378 19.1588H53.5725L48.4592 33.4359H50.7165L52.0218 29.6465H57.4198L58.7153 33.4359ZM54.6423 21.751H54.8091L56.8603 27.7864H52.5813L54.6423 21.751Z"
1333                                        fill="white" />
1334                                    <path
1335                                        d="M49.8271 8.38868V15.276H52.2938C54.3297 15.276 55.5086 14.0112 55.5086 11.8109C55.5086 9.64397 54.3202 8.38868 52.2938 8.38868H49.8271ZM50.8877 9.36237H52.1755C53.5911 9.36237 54.4291 10.2692 54.4291 11.8252C54.4291 13.4051 53.6053 14.3024 52.1755 14.3024H50.8877V9.36237Z"
1336                                        fill="white" />
1337                                    <path
1338                                        d="M59.1191 15.3763C60.6247 15.3763 61.5479 14.3596 61.5479 12.6748C61.5479 10.9995 60.62 9.97808 59.1191 9.97808C57.6135 9.97808 56.6856 10.9995 56.6856 12.6748C56.6856 14.3596 57.6088 15.3763 59.1191 15.3763ZM59.1191 14.4646C58.2338 14.4646 57.7366 13.8108 57.7366 12.6748C57.7366 11.5484 58.2338 10.8897 59.1191 10.8897C59.9997 10.8897 60.5016 11.5484 60.5016 12.6748C60.5016 13.806 59.9997 14.4646 59.1191 14.4646Z"
1339                                        fill="white" />
1340                                    <path
1341                                        d="M69.4101 10.0783H68.3921L67.4737 14.0446H67.3932L66.3326 10.0783H65.3573L64.2968 14.0446H64.221L63.2978 10.0783H62.2657L63.686 15.276H64.7324L65.7929 11.4481H65.8734L66.9387 15.276H67.9944L69.4101 10.0783Z"
1342                                        fill="white" />
1343                                    <path
1344                                        d="M70.5823 15.276H71.6003V12.2357C71.6003 11.4243 72.0784 10.9183 72.8312 10.9183C73.584 10.9183 73.9438 11.3336 73.9438 12.1689V15.276H74.9618V11.9111C74.9618 10.6749 74.3273 9.97808 73.1769 9.97808C72.4004 9.97808 71.8891 10.3265 71.6381 10.904H71.5624V10.0783H70.5823V15.276Z"
1345                                        fill="white" />
1346                                    <path d="M76.5649 15.276H77.5828V8.0498H76.5649V15.276Z" fill="white" />
1347                                    <path
1348                                        d="M81.4111 15.3763C82.9167 15.3763 83.8399 14.3596 83.8399 12.6748C83.8399 10.9995 82.912 9.97808 81.4111 9.97808C79.9056 9.97808 78.9776 10.9995 78.9776 12.6748C78.9776 14.3596 79.9008 15.3763 81.4111 15.3763ZM81.4111 14.4646C80.5258 14.4646 80.0287 13.8108 80.0287 12.6748C80.0287 11.5484 80.5258 10.8897 81.4111 10.8897C82.2918 10.8897 82.7936 11.5484 82.7936 12.6748C82.7936 13.806 82.2918 14.4646 81.4111 14.4646Z"
1349                                        fill="white" />
1350                                    <path
1351                                        d="M86.8729 14.4981C86.3189 14.4981 85.9165 14.226 85.9165 13.7583C85.9165 13.3 86.2384 13.0566 86.9486 13.0089L88.208 12.9278V13.3621C88.208 14.0064 87.6399 14.4981 86.8729 14.4981ZM86.6125 15.362C87.2895 15.362 87.8529 15.066 88.1607 14.5458H88.2411V15.276H89.2212V11.725C89.2212 10.6272 88.4921 9.97808 87.1996 9.97808C86.0301 9.97808 85.1969 10.5508 85.0927 11.4434H86.0775C86.1911 11.0759 86.5841 10.8658 87.1522 10.8658C87.8482 10.8658 88.208 11.1761 88.208 11.725V12.1736L86.8113 12.2548C85.5851 12.3311 84.8938 12.8705 84.8938 13.806C84.8938 14.7558 85.6182 15.362 86.6125 15.362Z"
1352                                        fill="white" />
1353                                    <path
1354                                        d="M92.6755 15.362C93.3857 15.362 93.987 15.0231 94.2947 14.4551H94.3752V15.276H95.3505V8.0498H94.3326V10.904H94.2568C93.9775 10.3313 93.3809 9.99239 92.6755 9.99239C91.3735 9.99239 90.5355 11.0329 90.5355 12.6748C90.5355 14.3215 91.364 15.362 92.6755 15.362ZM92.9643 10.9136C93.8165 10.9136 94.3515 11.5961 94.3515 12.6796C94.3515 13.7678 93.8213 14.4408 92.9643 14.4408C92.1026 14.4408 91.5866 13.7773 91.5866 12.6748C91.5866 11.5818 92.1074 10.9136 92.9643 10.9136Z"
1355                                        fill="white" />
1356                                    <path
1357                                        d="M101.951 15.3763C103.457 15.3763 104.38 14.3596 104.38 12.6748C104.38 10.9995 103.452 9.97808 101.951 9.97808C100.446 9.97808 99.5178 10.9995 99.5178 12.6748C99.5178 14.3596 100.441 15.3763 101.951 15.3763ZM101.951 14.4646C101.066 14.4646 100.569 13.8108 100.569 12.6748C100.569 11.5484 101.066 10.8897 101.951 10.8897C102.832 10.8897 103.334 11.5484 103.334 12.6748C103.334 13.806 102.832 14.4646 101.951 14.4646Z"
1358                                        fill="white" />
1359                                    <path
1360                                        d="M105.728 15.276H106.746V12.2357C106.746 11.4243 107.224 10.9183 107.977 10.9183C108.729 10.9183 109.089 11.3336 109.089 12.1689V15.276H110.107V11.9111C110.107 10.6749 109.473 9.97808 108.322 9.97808C107.546 9.97808 107.034 10.3265 106.783 10.904H106.708V10.0783H105.728V15.276Z"
1361                                        fill="white" />
1362                                    <path
1363                                        d="M114.795 8.78484V10.1022H113.976V10.9661H114.795V13.9014C114.795 14.9038 115.245 15.3047 116.377 15.3047C116.575 15.3047 116.765 15.2808 116.93 15.2522V14.3978C116.788 14.4121 116.698 14.4217 116.542 14.4217C116.036 14.4217 115.813 14.183 115.813 13.6389V10.9661H116.93V10.1022H115.813V8.78484H114.795Z"
1364                                        fill="white" />
1365                                    <path
1366                                        d="M118.297 15.276H119.315V12.2405C119.315 11.4529 119.779 10.9231 120.612 10.9231C121.332 10.9231 121.715 11.3431 121.715 12.1736V15.276H122.733V11.9207C122.733 10.6845 122.056 9.98285 120.958 9.98285C120.181 9.98285 119.637 10.3313 119.386 10.9136H119.305V8.0498H118.297V15.276Z"
1367                                        fill="white" />
1368                                    <path
1369                                        d="M126.405 10.8515C127.158 10.8515 127.65 11.3813 127.674 12.1975H125.07C125.127 11.3861 125.652 10.8515 126.405 10.8515ZM127.669 13.8728C127.48 14.2785 127.059 14.5028 126.443 14.5028C125.629 14.5028 125.103 13.9253 125.07 13.0137V12.9564H128.711V12.5984C128.711 10.9661 127.844 9.97808 126.41 9.97808C124.956 9.97808 124.033 11.
13690329 124.033 12.6939C124.033 14.3549 124.937 15.3763 126.415 15.3763C127.594 15.3763 128.417 14.8035 128.649 13.8728H127.669Z"
1370                                        fill="white" />
1371                                    <path
1372                                        d="M37.4132 21.7178C37.4379 19.7847 38.4678 17.9555 40.1014 16.9429C39.0708 15.4591 37.3446 14.5183 35.5486 14.4616C33.633 14.2589 31.7759 15.6172 30.7998 15.6172C29.8047 15.6172 28.3018 14.4817 26.6834 14.5153C24.5739 14.584 22.6073 15.7931 21.581 17.6523C19.3748 21.503 21.0204 27.1622 23.1337 30.2748C24.1911 31.799 25.4268 33.5015 27.0438 33.4411C28.6261 33.375 29.217 32.424 31.127 32.424C33.0192 32.424 33.5736 33.4411 35.2234 33.4027C36.9212 33.375 37.9909 31.8718 39.0112 30.3332C39.7709 29.2472 40.3555 28.0469 40.7433 26.7768C38.748 25.9261 37.4156 23.9018 37.4132 21.7178Z"
1373                                        fill="white" />
1374                                    <path
1375                                        d="M34.2971 12.4146C35.2228 11.2943 35.6789 9.85426 35.5685 8.40039C34.1542 8.55014 32.8477 9.23159 31.9095 10.3089C30.992 11.3616 30.5145 12.7762 30.6048 14.1745C32.0196 14.1892 33.4105 13.5263 34.2971 12.4146Z"
1376                                        fill="white" />
1377                                </svg>
1378                            </a>
1379                            <a href="https://play.google.com/store/apps/details?id=com.floodviser.app&amp;hl=id"
1380                                class="inline-block transition-transform hover:scale-105"
1381                                aria-label="Unduh di Google Play">
1382                                <svg width="129" height="39" viewBox="0 0 155 46" fill="none"
1383                                    xmlns="http://www.w3.org/2000/svg">
1384                                    <rect x="0.5" y="0.5" width="154" height="45" rx="4.5"
1385                                        fill="black" />
1386                                    <rect x="0.5" y="0.5" width="154" height="45" rx="4.5"
1387                                        stroke="#A6A6A6" />
1388                                    <path
1389                                        d="M78.23 25.0136C75.5296 25.0136 73.3286 27.071 73.3286 29.9046C73.3286 32.7209 75.5296 34.7955 78.23 34.7955C80.9316 34.7955 83.1326 32.7209 83.1326 29.9046C83.1314 27.071 80.9304 25.0136 78.23 25.0136ZM78.23 32.8704C76.75 32.8704 75.4744 31.648 75.4744 29.9057C75.4744 28.1451 76.7512 26.941 78.23 26.941C79.71 26.941 80.9856 28.1451 80.9856 29.9057C80.9856 31.6468 79.71 32.8704 78.23 32.8704ZM67.5361 25.0136C64.8357 25.0136 62.6347 27.071 62.6347 29.9046C62.6347 32.7209 64.8357 34.7955 67.5361 34.7955C70.2377 34.7955 72.4387 32.7209 72.4387 29.9046C72.4387 27.071 70.2377 25.0136 67.5361 25.0136ZM67.5361 32.8704C66.0562 32.8704 64.7806 31.648 64.7806 29.9057C64.7806 28.1451 66.0573 26.941 67.5361 26.941C69.0161 26.941 70.2917 28.1451 70.2917 29.9057C70.2929 31.6468 69.0161 32.8704 67.5361 32.8704ZM54.817 26.5155V28.5901H59.7747C59.6266 29.7574 59.2385 30.6095 58.646 31.2018C57.925 31.924 56.7964 32.7209 54.817 32.7209C51.7652 32.7209 49.3793 30.2565 49.3793 27.1998C49.3793 24.1431 51.7652 21.6786 54.817 21.6786C56.4634 21.6786 57.6655 22.3272 58.553 23.161L60.0146 21.697C58.7746 20.5114 57.1293 19.604 54.817 19.604C50.6366 19.604 47.1221 23.0126 47.1221 27.1998C47.1221 31.3869 50.6366 34.7955 54.817 34.7955C57.0731 34.7955 58.7758 34.0538 60.1065 32.6646C61.4751 31.2938 61.901 29.3664 61.901 27.8104C61.901 27.3297 61.8643 26.8847 61.7897 26.5144H54.817V26.5155ZM106.837 28.1267C106.431 27.0342 105.191 25.0136 102.657 25.0136C100.141 25.0136 98.0505 26.9962 98.0505 29.9046C98.0505 32.6462 100.123 34.7955 102.897 34.7955C105.135 34.7955 106.43 33.4247 106.967 32.6278L105.302 31.5157C104.748 32.3311 103.989 32.8681 102.897 32.8681C101.806 32.8681 101.029 32.3679 100.529 31.3858L107.059 28.681L106.837 28.1267Z
1389M100.178 29.7574C100.123 27.8668 101.64 26.9042 102.731 26.9042C103.582 26.9042 104.303 27.3309 104.544 27.9415L100.178 29.7574ZM94.8701 34.5H97.0149V20.1238H94.8701V34.5ZM91.3545 26.1073H91.281C90.7999 25.5323 89.8745 25.0136 88.7103 25.0136C86.2682 25.0136 84.0304 27.163 84.0304 29.9241C84.0304 32.6657 86.2682 34.7967 88.7103 34.7967C89.8757 34.7967 90.7999 34.278 91.281 33.6858H91.3545V34.3896C91.3545 36.2606 90.3556 37.2611 88.747 37.2611C87.4336 37.2611 86.6195 36.317 86.2866 35.52L84.4185 36.2986C84.9547 37.5946 86.3784 39.1885 88.747 39.1885C91.2626 39.1885 93.3901 37.7062 93.3901 34.0929V25.3115H91.3556V26.1073H91.3545ZM88.8952 32.8704C87.4152 32.8704 86.1763 31.6284 86.1763 29.9241C86.1763 28.2003 87.4152 26.941 88.8952 26.941C90.3556 26.941 91.5026 28.2003 91.5026 29.9241C91.5026 31.6284 90.3556 32.8704 88.8952 32.8704ZM116.888 20.1238H111.755V34.5H113.896V29.0536H116.887C119.261 29.0536 121.597 27.332 121.597 24.5893C121.597 21.8465 119.263 20.1238 116.888 20.1238ZM116.943 27.0526H113.896V22.1248H116.943C118.545 22.1248 119.454 23.4531 119.454 24.5893C119.454 25.7025 118.545 27.0526 116.943 27.0526ZM130.184 24.9883C128.633 24.9883 127.026 25.6726 126.362 27.1894L128.263 27.9841C128.669 27.1894 129.427 26.9295 130.22 26.9295C131.328 26.9295 132.455 27.5954 132.473 28.7787V28.9271C132.085 28.7051 131.254 28.3728 130.239 28.3728C128.189 28.3728 126.102 29.5009 126.102 31.6089C126.102 33.5328 127.783 34.7714 129.666 34.7714C131.106 34.7714 131.9 34.1239 132.398 33.3649H132.472V34.4747H134.541V28.9627C134.542 26.412 132.638 24.9883 130.184 24.9883ZM129.924 32.867C129.224 32.867 128.244 32.5151 128.244 31.6457C128.244 30.5359 129.464 30.1104 130.517 30.1104C131.457 30.1104 131.901 30.314 132.473 30.5911C132.307 31.924 131.162 32.867 129.924 32.867ZM142.075 25.3023L139.619 31.5353H139.546L136.997 25.3023H134.689L138.511 34.0135L136.332 38.8596H138.566L144.457 25.3023H142.075ZM122.779 34.5H124.921V20.1238H122.779V34.5Z"
1390                                        fill="white" />
1391                                    <path
1392                                        d="M54.4432 11.7792C54.4432 12.7429 54.1584 13.5099 53.5878 14.0826C52.9403 14.7634 52.0952 15.1038 51.0573 15.1038C50.063 15.1038 49.2168 14.7588 48.5222 14.0688C47.8264 13.3777 47.4785 12.5221 47.4785 11.5009C47.4785 10.4785 47.8264 9.62293 48.5222 8.93293C49.2168 8.24178 50.063 7.89678 51.0573 7.89678C51.551 7.89678 52.0229 7.99338 52.4707 8.18543C52.9196 8.37863 53.279 8.63508 53.5476 8.95593L52.9426 9.56313C52.4867 9.01688 51.8587 8.74433 51.0561 8.74433C50.3305 8.74433 49.7036 8.99963 49.1743 9.51023C48.645 10.0208 48.381 10.6844 48.381 11.4997C48.381 12.3151 48.645 12.9786 49.1743 13.4892C49.7036 13.9998 50.3305 14.2551 51.0561 14.2551C51.8254 14.2551 52.4672 13.9987 52.9804 13.4846C53.3134 13.15 53.5063 12.6842 53.558 12.0874H51.0561V11.2582H54.3938C54.4283 11.4388 54.4432 11.6124 54.4432 11.7792Z"
1393                                        fill="white" />
1394                                    <path
1395                                        d="M59.7363 8.89734H56.5995V11.0846H59.4285V11.9138H56.5995V14.1011H59.7363V14.9498H55.7143V8.04979H59.7363V8.89734Z"
1396                                        fill="white" />
1397                                    <path
1398                                        d="M63.4688 14.9498H62.5835V8.89734H60.6592V8.04979H65.3931V8.89734H63.4688V14.9498Z"
1399                                        fill="white" />
1400                                    <path d="M68.8179 14.9498V8.04979H69.7031V14.9498H68.8179Z" fill="white" />
1401                                    <path
1402                                        d="M73.6289 14.9498H72.7436V8.89734H70.8193V8.04979H75.5532V8.89734H73.6289V14.9498Z"
1403                                        fill="white" />
1404                                    <path
1405                                        d="M84.5142 14.0585C83.8368 14.7554 82.9952 15.1039 81.9883 15.1039C80.9813 15.1039 80.1397 14.7554 79.4635 14.0585C78.7861 13.3616 78.4485 12.5083 78.4485 11.4998C78.4485 10.4912 78.7861 9.63793 79.4635 8.94103C80.1397 8.24413 80.9813 7.89453 81.9883 7.89453C82.9894 7.89453 83.8299 8.24528 84.5096 8.94563C85.1893 9.64598 85.5291 10.497 85.5291 11.4998C85.5291 12.5083 85.1905 13.3616 84.5142 14.0585ZM80.1168 13.4801C80.6266 13.9976 81.25 14.2552 81.9883 14.2552C82.7265 14.2552 83.3511 13.9964 83.8597 13.4801C84.3695 12.9626 84.6256 12.3025 84.6256 11.4998C84.6256 10.6971 84.3695 10.037 83.8597 9.51948C83.3511 9.00198 82.7265 8.74438 81.9883 8.74438C81.25 8.74438 80.6266 9.00313 80.1168 9.51948C79.6082 10.037 79.3521 10.6971 79.3521 11.4998C79.3521 12.3025 79.6082 12.9626 80.1168 13.4801Z"
1406                                        fill="white" />
1407                                    <path
1408                                        d="M86.7715 14.9498V8.04979H87.8484L91.1964 13.4168H91.2343L91.1964 12.0874V8.04979H92.0817V14.9498H91.1574L87.6544 9.32169H87.6165L87.6544 10.6511V14.9498H86.7715Z"
1409                                        fill="white" />
1410                                    <path
1411                                        d="M54.4432 11.7792C54.4432 12.7429 54.1584 13.5099 53.5878 14.0826C52.9403 14.7634 52.0952 15.1038 51.0573 15.1038C50.063 15.1038 49.2168 14.7588 48.5222 14.0688C47.8264 13.3777 47.4785 12.5221 47.4785 11.5009C47.4785 10.4785 47.8264 9.62293 48.5222 8.93293C49.2168 8.24178 50.063 7.89678 51.0573 7.89678C51.551 7.89678 52.0229 7.99338 52.4707 8.18543C52.9196 8.37863 53.279 8.63508 53.5476 8.95593L52.9426 9.56313C52.4867 9.01688 51.8587 8.74433 51.0561 8.74433C50.3305 8.74433 49.7036 8.99963 49.1743 9.51023C48.645 10.0208 48.381 10.6844 48.381 11.4997C48.381 12.3151 48.645 12.9786 49.1743 13.4892C49.7036 13.9998 50.3305 14.2551 51.0561 14.2551C51.8254 14.2551 52.4672 13.9987 52.9804 13.4846C53.3134 13.15 53.5063 12.6842 53.558 12.0874H51.0561V11.2582H54.3938C54.4283 11.4388 54.4432 11.6124 54.4432 11.7792Z"
1412                                        stroke="white" stroke-width="0.2" stroke-miterlimit="10" />
1413                                    <path
1414                                        d="M59.7363 8.89734H56.5995V11.0846H59.4285V11.9138H56.5995V14.1011H59.7363V14.9498H55.7143V8.04979H59.7363V8.89734Z"
1415                                        stroke="white" stroke-width="0.2" stroke-miterlimit="10" />
1416                                    <path
1417                                        d="M63.4688 14.9498H62.5835V8.89734H60.6592V8.04979H65.3931V8.89734H63.4688V14.9498Z"
1418                                        stroke="white" stroke-width="0.2" stroke-miterlimit="10" />
1419                                    <path d="M68.8179 14.9498V8.04979H69.7031V14.9498H68.8179Z" stroke="white"
1420                                        stroke-width="0.2" stroke-miterlimit="10" />
1421                                    <path
1422                                        d="M73.6289 14.9498H72.7436V8.89734H70.8193V8.04979H75.5532V8.89734H73.6289V14.9498Z"
1423                                        stroke="white" stroke-width="0.2" stroke-miterlimit="10" />
1424                                    <path
1425                                        d="M84.5142 14.0585C83.8368 14.7554 82.9952 15.1039 81.9883 15.1039C80.9813 15.1039 80.1397 14.7554 79.4635 14.0585C78.7861 13.3616 78.4485 12.5083 78.4485 11.4998C78.4485 10.4912 78.7861 9.63793 79.4635 8.94103C80.1397 8.24413 80.9813 7.89453 81.9883 7.89453C82.9894 7.89453 83.8299 8.24528 84.5096 8.94563C85.1893 9.64598 85.5291 10.497 85.5291 11.4998C85.5291 12.5083 85.1905 13.3616 84.5142 14.0585ZM80.1168 13.4801C80.6266 13.9976 81.25 14.2552 81.9883 14.2552C82.7265 14.2552 83.3511 13.9964 83.8597 13.4801C84.3695 12.9626 84.6256 12.3025 84.6256 11.4998C84.6256 10.6971 84.3695 10.037 83.8597 9.51948C83.3511 9.00198 82.7265 8.74438 81.9883 8.74438C81.25 8.74438 80.6266 9.00313 80.1168 9.51948C79.6082 10.037 79.3521 10.6971 79.3521 11.4998C79.3521 12.3025 79.6082 12.9626 80.1168 13.4801Z"
1426                                        stroke="white" stroke-width="0.2" stroke-miterlimit="10" />
1427                                    <path
1428                                        d="M86.7715 14.9498V8.04979H87.8484L91.1964 13.4168H91.2343L91.1964 12.0874V8.04979H92.0817V14.9498H91.1574L87.6544 9.32169H87.6165L87.6544 10.6511V14.9498H86.7715Z"
1429                                        stroke="white" stroke-width="0.2" stroke-miterlimit="10" />
1430                                    <g filter="url(#filter0_ii_2420_912)">
1431                                        <path
1432                                            d="M11.9818 8.66842C11.6477 9.02262 11.4502 9.57232 11.4502 10.2842V35.7176C11.4502 36.4306 11.6477 36.9791 11.9818 37.3333L12.0668 37.4161L26.2912 23.1688V23.0009V22.833L12.0668 8.58447L11.9818 8.66842Z"
1433                                            fill="url(#paint0_linear_2420_912)" />
1434                                        <path
1435                                            d="M31.0317 27.9194L26.291 23.1688V23.0009V22.833L31.0329 18.0835L31.1396 18.1444L36.7575 21.3414C38.3615 22.2545 38.3615 23.7484 36.7575 24.6626L31.1396 27.8596L31.0317 27.9194Z"
1436                                            fill="url(#paint1_linear_2420_912)" />
1437                                        <g filter="url(#filter1_i_2420_912)">
1438                                            <path
1439                                                d="M31.1394 27.8586L26.2897 23.001L11.9814 37.3334C12.5096 37.8946 13.3833 37.9636 14.3673 37.4047L31.1394 27.8586Z"
1440                                                fill="url(#paint2_linear_2420_912)" />
1441                                        </g>
1442                                        <path
1443                                            d="M31.1394 18.1434L14.3673 8.5984C13.3833 8.03835 12.5096 8.1085 11.9814 8.6697L26.2908 23.0022L31.1394 18.1434Z"
1444                                            fill="url(#paint3_linear_2420_912)" />
1445                                    </g>
1446                                    <defs>
1447                                        <filter id="filter0_ii_2420_912" x="11.4502" y="8.21191" width="26.5107"
1448                                            height="29.5786" filterUnits="userSpaceOnUse"
1449                                            color-interpolation-filters="sRGB">
1450                                            <feFlood flood-opacity="0" result="BackgroundImageFix" />
1451                                            <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix"
1452                                                result="shape" />
1453                                            <feColorMatrix in="SourceAlpha" type="matrix"
1454                                                values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
1455                                                result="hardAlpha" />
1456                                            <feOffset dy="-0.15" />
1457                                            <feComposite in2="hardAlpha" operator="arithmetic" k2="-1"
1458                                                k3="1" />
1459                                            <feColorMatrix type="matrix"
1460                                                values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
1461                                            <feBlend mode="normal" in2="shape"
1462                                                result="effect1_innerShadow_2420_912" />
1463                                            <feColorMatrix in="SourceAlpha" type="matrix"
1464                                                values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
1465                                                result="hardAlpha" />
1466                                            <feOffset dy="0.15" />
1467                                            <feComposite in2="hardAlpha" operator="arithmetic" k2="-1"
1468                                                k3="1" />
1469                                            <feColorMatrix type="matrix"
1470                                                values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0" />
1471                                            <feBlend mode="normal" in2="effect1_innerShadow_2420_912"
1472                                                result="effect2_innerShadow_2420_912" />
1473                                        </filter>
1474                                        <filter id="filter1_i_2420_912" x="11.9814" y="23.001" width="19.1582"
1475                                            height="14.7896" filterUnits="userSpaceOnUse"
1476                                            color-interpolation-filters="sRGB">
1477                                            <feFlood flood-opacity="0" result="Backgroun
1477dImageFix" />
1478                                            <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix"
1479                                                result="shape" />
1480                                            <feColorMatrix in="SourceAlpha" type="matrix"
1481                                                values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
1482                                                result="hardAlpha" />
1483                                            <feOffset dy="-0.15" />
1484                                            <feComposite in2="hardAlpha" operator="arithmetic" k2="-1"
1485                                                k3="1" />
1486                                            <feColorMatrix type="matrix"
1487                                                values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0" />
1488                                            <feBlend mode="normal" in2="shape"
1489                                                result="effect1_innerShadow_2420_912" />
1490                                        </filter>
1491                                        <linearGradient id="paint0_linear_2420_912" x1="25.0303" y1="10.0151"
1492                                            x2="5.73099" y2="29.2833" gradientUnits="userSpaceOnUse">
1493                                            <stop stop-color="#00A0FF" />
1494                                            <stop offset="0.0066" stop-color="#00A1FF" />
1495                                            <stop offset="0.2601" stop-color="#00BEFF" />
1496                                            <stop offset="0.5122" stop-color="#00D2FF" />
1497                                            <stop offset="0.7604" stop-color="#00DFFF" />
1498                                            <stop offset="1" stop-color="#00E3FF" />
1499                                        </linearGradient>
1500                                        <linearGradient id="paint1_linear_2420_912" x1="38.8454" y1="23.0009"
1501                                            x2="11.065" y2="23.0009" gradientUnits="userSpaceOnUse">
1502                                            <stop stop-color="#FFE000" />
1503                                            <stop offset="0.4087" stop-color="#FFBD00" />
1504                                            <stop offset="0.7754" stop-color="#FFA500" />
1505                                            <stop offset="1" stop-color="#FF9C00" />
1506                                        </linearGradient>
1507                                        <linearGradient id="paint2_linear_2420_912" x1="28.5057" y1="25.639"
1508                                            x2="2.33347" y2="51.7691" gradientUnits="userSpaceOnUse">
1509                                            <stop stop-color="#FF3A44" />
1510                                            <stop offset="1" stop-color="#C31162" />
1511                                        </linearGradient>
1512                                        <linearGradient id="paint3_linear_2420_912" x1="8.37787" y1="0.203171"
1513                                            x2="20.0645" y2="11.871" gradientUnits="userSpaceOnUse">
1514                                            <stop stop-color="#32A071" />
1515                                            <stop offset="0.0685" stop-color="#2DA771" />
1516                                            <stop offset="0.4762" stop-color="#15CF74" />
1517                                            <stop offset="0.8009" stop-color="#06E775" />
1518                                            <stop offset="1" stop-color="#00F076" />
1519                                        </linearGradient>
1520                                    </defs>
1521                                </svg>
1522                            </a>
1523                        </div>
1524                    </div>
1525
1526                    <!-- Sub-section: Ikuti Kami -->
1527                    <div>
1528                        <p class="text-gray-400 text-sm mb-1">Ikuti Kami:</p>
1529                        <div class="flex space-x-4 social-icons">
1530                            <a href="https://www.youtube.com/@dexpumpindonesia6971" target="_blank" rel="noopener"
1531                                class="text-gray-400 hover:text-white transition-colors"
1532                                aria-label="Ikuti di YouTube">
1533                                <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewB
1533ox="0 0 24 24">
1534                                    <path fill="#e5e7e7" fill-opacity="0" d="M12 11L12 12L12 13z">
1535                                        <animate fill="freeze" attributeName="d" begin="0.6s" dur="0.2s"
1536                                            values="M12 11L12 12L12 13z;M10 8.5L16 12L10 15.5z" />
1537                                        <set fill="freeze" attributeName="fill-opacity" begin="0.6s"
1538                                            to="1" />
1539                                    </path>
1540                                    <path fill="none" stroke="#e5e7e7" stroke-dasharray="64"
1541                                        stroke-dashoffset="64" stroke-linecap="round" stroke-linejoin="round"
1542                                        stroke-width="2"
1543                                        d="M12 5c9 0 9 0 9 7c0 7 0 7 -9 7c-9 0 -9 0 -9 -7c0 -7 0 -7 9 -7Z">
1544                                        <animate fill="freeze" attributeName="stroke-dashoffset" dur="0.6s"
1545                                            values="64;0" />
1546                                    </path>
1547                                </svg>
1548                            </a>
1549                            <a href="https://www.instagram.com/dexpumpid/" target="_blank" rel="noopener"
1550                                class="text-gray-400 hover:text-white transition-colors"
1551                                aria-label="Ikuti di Instagram">
1552                                <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 24 24">
1553                                    <g fill="none">
1554                                        <path stroke="#e5e7e7" stroke-width="2"
1555                                            d="M3 11c0-3.771 0-5.657 1.172-6.828S7.229 3 11 3h2c3.771 0 5.657 0 6.828 1.172S21 7.229 21 11v2c0 3.771 0 5.657-1.172 6.828S16.771 21 13 21h-2c-3.771 0-5.657 0-6.828-1.172S3 16.771 3 13z" />
1556                                        <circle cx="16.5" cy="7.5" r="1.5" fill="#e5e7e7" />
1557                                        <circle cx="12" cy="12" r="3" stroke="#e5e7e7"
1558                                            stroke-width="2" />
1559                                    </g>
1560                                </svg>
1561                            </a>
1562                        </div>
1563                    </div>
1564                </div>
1565            </div>
1566        </div>
1567    </div>
1568    <div class="text-white py-10 flex self-end justify-center items-center gap-5 -mb-10 -mt-10">
1569        <p class="text-center">Download Company Profile PT Pompa DEX Indoguna </p>
1570                    <a class="px-6 py-2 min-w-[120px] text-center text-white bg-[#0756FF] border border-[#0756FF] rounded active:text-[#0756FF] hover:bg-transparent hover:[#0756FF] focus:outline-none focus:ring"
1571                href="https://www.dexindonesia.com/download/compro/3">
1572                Download
1573            </a>
1574            </div>
1575    <div id="toast-pdf" class="px-3">File Company Profile belum tersedia</div>
1576    <hr class="my-6 border-gray-700" role="separator" />
1577    <div class="text-center">
1578        <span class="text-sm text-gray-400">
1579            Copyright &copy; 2025 <a href="https://www.dexindonesia.com"
1580                class="hover:underline hover:text-white transition-colors" aria-label="Kembali ke beranda">DEX
1581                Pump</a>. All Rights Reserved.
1582        </span>
1583    </div>
1584    </div>
1585</footer>
1586
1587
1588<script>
1589    function showToast() {
1590        event.preventDefault();
1591        const toast = document.getElementById('toast-pdf');
1592        toast.classList.add('show');
1593        setTimeout(() => {
1594            toast.classList.remove('show');
1595        }, 3000);
1596    }
1597</script>
1597
1598
1599    <div class="loader-wrapper z-[99]" id="loaderWrapper">
1600        <svg width="924" height="1080" viewBox="0 0 924 1080" fill="none" xmlns="http://www.w3.org/2000/svg">
1601<path fill-rule="evenodd" clip-rule="evenodd" d="M441.879 2.09055C429.338 5.0618 414.279 14.6718 386.971 37.1298C196.875 193.46 80.711 332.146 29.2524 464.203C15.1928 500.282 9.78981 520.552 2.46575 564.706C-1.45792 588.367 -0.550777 657.398 4.13517 691.707C25.3324 846.884 110.344 970.696 237.967 1032.26C305.649 1064.9 377.38 1080.05 464.108 1080C567.919 1079.94 659.248 1054.77 733.956 1005.61C826.918 944.448 892.693 840.397 914.233 720.434C935.129 604.062 923.201 518.482 871.626 414.722C846.898 364.976 806.421 305.29 761.429 252.231C733.443 219.228 661.146 145.453 621.096 109.028C588.22 79.1257 521.728 23.1817 506.493 12.6032C490.397 1.4272 463.293 -2.98215 441.879 2.09055ZM489.968 142.134C561.727 201.797 606.903 245.023 661.374 306.138C749.391 404.891 802.143 500.932 812.067 580.491C814.886 603.104 813.26 663.684 809.228 686.225C794.976 765.886 765.474 826.899 717.788 875.325C694.424 899.053 671.144 916.016 642.647 930.079C608.588 946.885 574.441 957.63 534.698 964.046C505.43 968.771 434.987 969.775 404.431 965.904C366.425 961.089 306.794 945.988 296.877 938.67C293.9 936.473 295.53 936.024 310.545 934.904C390.829 928.914 461.47 899.451 513.12 850.413C555.946 809.756 583.406 760.758 600.055 695.297C609.477 658.244 611.652 637.305 610.482 594.887C609.626 563.89 608.931 557.87 604.04 539.124C588.878 480.991 567.619 438.627 523.807 379.231C487.286 329.722 429.617 269.268 375.116 223.359C366.407 216.023 359.311 209.033 359.348 207.827C359.386 206.621 362.543 203.167 366.367 200.152C370.19 197.137 387.067 182.723 403.87 168.121C429.316 146.01 461.057 119.007 461.763 118.87C461.865 118.852 474.555 129.321 489.968 142.134ZM287.854 294.735C322.414 322.624 385.743 384.31 412.126 415.778C468.424 482.935 497.178 540.021 501.588 593.396C503.669 618.556 497.393 660.956 487.271 690.137C480.652 709.223 475.66 719.488 464.756 736.436C439.286 776.022 401.21 802.836 353.065 815.09C287.936 831.668 211.968 824.775 162.702 797.815C149.986 790.856 147.801 788.875 143.627 780.519C138 769.251 127.576 737.129 121.329 711.807C109.886 665.422 107.644 606.242 115.716 563.661C126.14 508.688 158.665 442.596 209.591 372.913C226.548 349.713 277.155 288.758 279.431 288.796C280.029 288.806 283.82 291.479 287.854 294.735Z" fill="black"/>
1602</svg>
1603    </div>
1604
1605</body>
1606
1607<script>
1608    var loaderWrapper = document.getElementById("loaderWrapper");
1609
1610
1611    window.addEventListener("load", function() {
1612        loaderWrapper.classList.add("hide");
1613        document.documentElement.classList.remove("noscroll");
1614        document.body.classList.remove("noscroll");
1615
1616    });
1617</script>
1617
1618
1619<script>
1620    AOS.init();
1621</script>
1621
1622
1623
1624</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.