Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi!<\/title> \r\n <link rel=\"icon\" type=\"image\/png\" sizes=\"32x32\" href=\"\/favicon.png\"> \r\n <script src=\"https:\/\/cdn.tailwindcss.com\/3.4.16\"><\/script> \r\n\r\n \r\n <meta name=\"description\" content=\"Sistem Absensi Dosen & Karyawan terbaik! Lacak kehadiran, kelola data, ekspor laporan dengan mudah. Coba demo gratis & rasakan perbedaannya!\">\r\n \r\n \r\n <meta property=\"og:type\" content=\"website\">\r\n <meta property=\"og:url\" content=\"\/\/id.tapsite.ai\/sistem-absensi-kampus-dosen-karyawan-1753538068095\">\r\n <meta property=\"og:title\" content=\"Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi!\">\r\n <meta property=\"og:description\" content=\"Sistem Absensi Dosen & Karyawan terbaik! Lacak kehadiran, kelola data, ekspor laporan dengan mudah. Coba demo gratis & rasakan perbedaannya!\">\r\n <meta property=\"og:image\" content=\"https:\/\/placehold.co\/600x400?text=tapsite.ai\">\r\n\r\n \r\n <meta property=\"twitter:card\" content=\"summary_large_image\">\r\n <meta property=\"twitter:url\" content=\"\/\/id.tapsite.ai\/sistem-absensi-kampus-dosen-karyawan-1753538068095\">\r\n <meta property=\"twitter:title\" content=\"Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi!\">\r\n <meta property=\"twitter:description\" content=\"Sistem Absensi Dosen & Karyawan terbaik! Lacak kehadiran, kelola data, ekspor laporan dengan mudah. Coba demo gratis & rasakan perbedaannya!\">\r\n <meta property=\"twitter:image\" content=\"https:\/\/placehold.co\/600x400?text=tapsite.ai\">\r\n\r\n <meta name=\"robots\" content=\"index, follow\">\r\n\r\n <meta name=\"page_id\" content=\"01984703-7380-7-9b34-51094504c6b796f9\">\r\n <meta name=\"slug\" content=\"sistem-absensi-kampus-dosen-karyawan-1753538068095\">\r\n <meta name=\"user_id\" content=\"d4381967-72af-4627-a373-6cdb2a3990a9\">\r\n <meta name=\"submit_event\" content=\"null\">\r\n <meta name=\"click_event\" content=\"null\">\r\n <meta name=\"watermark\" content=\"1\">\r\n\r\n\r\n \r\n <script>\r\n tailwind.config = {\r\n darkMode: 'class',\r\n }\r\n <\/script>\r\n <script type=\"module\" crossorigin src=\"\/assets\/page-DgHeHVcW.js\"><\/script>\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/modulepreload-polyfill-B5Qt9EMX.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/helper-BnwCSuOS.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/index-QsbY2dIo.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/axios-CCb-kr4I.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/ChatBox-Ch-MoypT.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/chat-CHfbbg5O.js\">\r\n <link rel=\"stylesheet\" crossorigin href=\"\/assets\/ChatBox-D4AsBpfo.css\">\r\n<\/head>\r\n<body status=\"draft\">\r\n<section class=\"relative overflow-hidden bg-gradient-to-br from-blue-900 to-blue-700 text-white py-16 md:py-24\">\r\n <div class=\"container mx-auto px-4 flex flex-col md:flex-row items-center justify-between gap-12\">\r\n <div class=\"md:w-1\/2 text-center md:text-left\">\r\n <h1 class=\"text-4xl md:text-5xl lg:text-6xl font-extrabold leading-tight mb-6 custom-cursor\">\r\n Sistem Absensi Karyawan & Dosen - <span class=\"text-blue-200 custom-cursor\">Solusi Terbaik untuk Kampus Modern<\/span>\r\n <\/h1>\r\n <p class=\"text-lg md:text-xl text-blue-100 mb-8 max-w-lg mx-auto md:mx-0 custom-cursor\">\r\n Aplikasi web inovatif untuk mengelola absensi dosen dan karyawan di kampus dengan akurasi tinggi, fitur lengkap, dan antarmuka modern yang intuitif. Optimalkan manajemen absensi Anda sekarang juga.\r\n <\/p>\r\n <a href=\"#demo\" class=\"inline-block bg-orange-500 hover:bg-orange-600 text-white font-bold py-3 px-8 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:scale-105 text-lg custom-cursor\">\r\n Coba Demo Gratis\r\n <\/a>\r\n <a href=\"#features\" class=\"inline-block ml-4 text-blue-200 hover:text-blue-50 font-semibold py-3 px-8 rounded-full transition duration-300 ease-in-out text-lg border border-blue-200 hover:border-blue-50 custom-cursor\">\r\n Lihat Fitur Lengkap\r\n <\/a>\r\n <\/div>\r\n <div class=\"md:w-1\/2 mt-12 md:mt-0 flex justify-center\">\r\n <img decoding=\"async\" src=\"https:\/\/storage.tapsite.ai\/media\/assets\/01984706-b5cf-7-aa6b-ce5fce897cd25aaf.webp\" alt=\"Antarmuka modern sistem absensi pada perangkat desktop atau tablet\" class=\"rounded-xl shadow-2xl border-4 border-blue-300 transform transition-transform duration-500 hover:scale-102 custom-cursor\">\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"absolute bottom-0 left-0 w-full h-1\/3 bg-gradient-to-t from-blue-900 to-transparent pointer-events-none\"><\/div>\r\n<\/section><section class=\"py-16 md:py-24 bg-gray-50\">\r\n <div class=\"container mx-auto px-4 text-center\">\r\n <h2 class=\"text-3xl md:text-4xl font-extrabold text-blue-900 mb-8 custom-cursor\">\r\n Memperkenalkan Sistem Absensi Karyawan & Dosen: <span class=\"text-blue-600 custom-cursor\">Efisiensi di Genggaman Anda<\/span>\r\n <\/h2>\r\n <div class=\"flex flex-col md:flex-row items-center justify-center gap-10 md:gap-16 max-w-4xl mx-auto\">\r\n <div class=\"md:w-1\/2\">\r\n <p class=\"text-lg md:text-xl text-gray-700 leading-relaxed mb-6 custom-cursor\">\r\n Dirancang khusus untuk kebutuhan unik institusi pendidikan, aplikasi web kami menyediakan solusi komprehensif untuk pengelolaan absensi dosen dan karyawan. Dengan fitur mutakhir dan desain yang user-friendly, kami membantu kampus Anda mencapai efisiensi administrasi yang belum pernah ada sebelumnya.\r\n <\/p>\r\n <p class=\"text-base text-gray-600 custom-cursor\">\r\n Kami memahami bahwa waktu adalah aset berharga. Oleh karena itu, sistem kami dirancang untuk menyederhanakan proses, mengurangi beban administratif, dan meningkatkan akurasi data kehadiran.\r\n <\/p>\r\n <\/div>\r\n <div class=\"md:w-1\/2 flex justify-center\">\r\n <img decoding=\"async\" src=\"https:\/\/storage.tapsite.ai\/media\/assets\/01984706-b5cf-7-aa6b-ce5fce897cd25aaf.webp\" alt=\"Ilustrasi konsep efisiensi dan sistem terintegrasi\" class=\"rounded-lg shadow-lg custom-cursor\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 md:py-24 bg-white\">\r\n <div class=\"container mx-auto px-4\">\r\n <h2 class=\"text-3xl md:text-4xl font-extrabold text-blue-900 text-center mb-12 custom-cursor\">\r\n Hadapi Tantangan Absensi dengan <span class=\"text-blue-600 custom-cursor\">Solusi Cerdas<\/span>\r\n <\/h2>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-10 lg:gap-16 max-w-6xl mx-auto\">\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/fecaca\/991b1b?text=\u23f3\" alt=\"Icon Waktu Memakan\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Pencatatan Manual yang Memakan Waktu?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Sistem kami mengotomatiskan pencatatan, membebaskan waktu berharga Anda untuk fokus pada hal yang lebih penting.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/fef08a\/92400e?text=\u23f1\ufe0f\" alt=\"Icon Keterlambatan\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Kesulitan Melacak Keterlambatan dan Kehadiran?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Deteksi keterlambatan otomatis dan statistik real-time memberikan visibilitas penuh terhadap kehadiran.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/ede9fe\/6b21a8?text=\ud83d\udcca\" alt=\"Icon Laporan Tidak Akurat\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Laporan Absensi yang Tidak Akurat?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Laporan akurat yang dapat diekspor menjamin keandalan data untuk pengambilan keputusan.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/dcfce7\/166534?text=\ud83d\udccb\" alt=\"Icon Administrasi Rumit\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Administrasi Absensi yang Rumit dan Ribet?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Antarmuka intuitif dan manajemen terpusat menyederhanakan seluruh proses absensi.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 px-4 sm:px-6 lg:px-8 bg-white\">\r\n <div class=\"max-w-7xl mx-auto text-center\">\r\n <h2 class=\"text-4xl font-extrabold text-gray-900 mb-12 custom-cursor\">Fitur Unggulan untuk Produktivitas Maksimal<\/h2>\r\n\r\n \r\n <div class=\"mb-16\">\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-8 custom-cursor\">Sistem Multi-Role yang Terintegrasi<\/h3>\r\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-8 text-left\">\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center mr-4 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/32x32\/FFFFFF\/000000?text=A\" alt=\"Admin Icon\" class=\"filter invert custom-cursor\" aria-label=\"Admin Icon\">\r\n <\/div>\r\n <h4 class=\"text-2xl font-semibold text-gray-800 custom-cursor\">Admin<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Kontrol penuh atas seluruh sistem, manajemen pengguna, dan akses laporan mendalam untuk pengambilan keputusan yang strategis.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center mr-4 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/32x32\/FFFFFF\/000000?text=D\" alt=\"Dosen Icon\" class=\"filter invert custom-cursor\" aria-label=\"Dosen Icon\">\r\n <\/div>\r\n <h4 class=\"text-2xl font-semibold text-gray-800 custom-cursor\">Dosen<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Kemudahan absensi dan riwayat kehadiran pribadi yang selalu terbarui, memastikan transparansi dan aksesibilitas informasi.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center mr-4 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/32x32\/FFFFFF\/000000?text=K\" alt=\"Karyawan Icon\" class=\"filter invert custom-cursor\" aria-label=\"Karyawan Icon\">\r\n <\/div>\r\n <h4 class=\"text-2xl font-semibold text-gray-800 custom-cursor\">Karyawan<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Pencatatan absensi yang cepat dan akses mudah ke riwayat personal, menyederhanakan proses administrasi harian.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"mb-16\">\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-8 custom-cursor\">Manajemen Absensi yang Cerdas<\/h3>\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 text-left\">\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u23f0\" alt=\"Real-Time Icon\" class=\"filter invert custom-cursor\" aria-label=\"Real-Time Absensi Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Absensi Real-Time<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Catat waktu masuk dan keluar secara instan dan akurat, memastikan data kehadiran yang valid dan terkini.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u23f1\ufe0f\" alt=\"Delay Detection Icon\" class=\"filter invert custom-cursor\" aria-label=\"Deteksi Keterlambatan Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Deteksi Keterlambatan Otomatis<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Identifikasi keterlambatan secara presisi, meminimalisir kesalahan manual dan meningkatkan disiplin.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\udcca\" alt=\"Statistics Icon\" class=\"filter invert custom-cursor\" aria-label=\"Statistik Absensi Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Statistik Absensi Bulanan<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Dapatkan gambaran kinerja kehadiran dalam bentuk grafik yang mudah dipahami untuk evaluasi cepat.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\udcf1\" alt=\"Responsive Icon\" class=\"filter invert custom-cursor\" aria-label=\"Desain Responsif Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Desain Responsif Mobile<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Absensi dan akses fitur nyaman dari perangkat apa pun, kapan saja, dan di mana saja.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u231a\" alt=\"Clock Icon\" class=\"filter invert custom-cursor\" aria-label=\"Jam Real-Time Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Jam Real-Time Terintegrasi<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Sinkronisasi waktu yang akurat untuk pencatatan absensi yang valid dan dapat dipertanggungjawabkan.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div>\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-8 custom-cursor\">Kemudahan Manajemen Administratif<\/h3>\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 text-left\">\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\uddc3\ufe0f\" alt=\"Data Management Icon\" class=\"filter invert custom-cursor\" aria-label=\"Kelola Data Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Kelola Data Lengkap<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Pengelolaan data dosen dan karyawan yang terpusat dan efisien, memudahkan pembaruan informasi.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\udcc4\" alt=\"Report Icon\" class=\"filter invert custom-cursor\" aria-label=\"Laporan Absensi Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Laporan Absensi Komprehensif<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Hasilkan laporan detail untuk analisis dan audit, mendukung pengambilan keputusan yang informatif.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u2699\ufe0f\" alt=\"Settings Icon\" class=\"filter invert custom-cursor\" aria-label=\"Pengaturan Jam Kerja Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Pengaturan Jam Kerja Fleksibel<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Sesuaikan jam kerja sesuai kebijakan institusi Anda, memberikan fleksibilitas administratif.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u2b07\ufe0f\" alt=\"Export Icon\" class=\"filter invert custom-cursor\" aria-label=\"Export Data Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Export Data Mudah<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Ekspor laporan ke PDF, Excel, atau CSV untuk integrasi data yang lancar dengan sistem lain.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 px-4 sm:px-6 lg:px-8 bg-gray-100\">\r\n <div class=\"max-w-7xl mx-auto flex flex-col lg:flex-row items-center gap-12\">\r\n <div class=\"lg:w-1\/2 text-center lg:text-left\">\r\n <h2 class=\"text-4xl font-extrabold text-gray-900 mb-8 leading-tight custom-cursor\">Solusi Ideal untuk Institusi Anda<\/h2>\r\n <p class=\"text-lg text-gray-700 mb-8 max-w-xl lg:max-w-none custom-cursor\">\r\n Sistem Absensi Karyawan & Dosen ini dirancang secara spesifik untuk memenuhi kebutuhan manajemen absensi di berbagai jenis institusi pendidikan, memastikan efisiensi dan akurasi yang Anda butuhkan.\r\n <\/p>\r\n <ul class=\"text-lg text-gray-700 space-y-3 font-medium custom-cursor\">\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Universitas<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Politeknik<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Sekolah Tinggi<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Akademi<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Lembaga Pendidikan Tinggi lainnya<\/span>\r\n <\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"lg:w-1\/2 mt-10 lg:mt-0 flex justify-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x400\/87CEEB\/FFFFFF\/B0C4DE?text=Lingkungan+Kampus+Modern\" alt=\"Ilustrasi Lingkungan Kampus Modern\" class=\"rounded-xl shadow-2xl transition-transform duration-500 ease-in-out hover:scale-105 custom-cursor\" aria-label=\"Modern Campus Environment Illustration\">\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-900 to-blue-700\">\r\n <div class=\"max-w-4xl mx-auto text-center\">\r\n <h2 class=\"text-4xl font-extrabold text-white mb-12 custom-cursor\">Investasi Cerdas untuk Efisiensi Jangka Panjang<\/h2>\r\n <div class=\"bg-white rounded-xl shadow-2xl p-8 sm:p-10 lg:p-12 border-4 border-teal-400 transform transition-all duration-500 hover:scale-[1.02] hover:shadow-3xl\">\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-4 custom-cursor\">Paket Profesional<\/h3>\r\n <p class=\"text-gray-600 text-lg mb-6 custom-cursor\">Solusi komprehensif untuk manajemen absensi yang akurat dan efisien di seluruh institusi Anda.<\/p>\r\n <div class=\"flex items-baseline justify-center mb-8\">\r\n <span class=\"text-5xl font-extrabold text-blue-900 custom-cursor\">Rp 1.500.000<\/span>\r\n <span class=\"text-xl font-medium text-gray-500 ml-2 custom-cursor\">(Satu Kali Pembayaran)<\/span>\r\n <\/div>\r\n\r\n <ul class=\"text-left text-gray-700 space-y-4 mb-10 text-lg custom-cursor\">\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Lisensi Penggunaan Tanpa Batas Waktu<\/strong> untuk keberlanjutan investasi Anda.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Akses Penuh <strong class=\"text-blue-800\">Fitur Multi-Role<\/strong> (Admin, Dosen, Karyawan) yang terintegrasi.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Modul <strong class=\"text-blue-800\">Absensi Real-Time Lengkap<\/strong> untuk pencatatan akurat.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Modul <strong class=\"text-blue-800\">Pelaporan dan Ekspor Data<\/strong> komprehensif untuk analisis.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Pembaruan Software Gratis<\/strong> selama 1 Tahun untuk fitur terkini.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Dukungan Teknis Awal<\/strong> (Instalasi dan Konfigurasi) untuk kemudahan awal.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Tutorial Penggunaan Software<\/strong> untuk membantu Anda memulai.<\/span>\r\n <\/li>\r\n <\/ul>\r\n\r\n <button class=\"w-full py-4 px-8 bg-orange-500 text-white font-bold text-xl rounded-lg shadow-lg hover:bg-orange-600 transition-colors duration-300 transform hover:scale-105 focus:outline-none focus:ring-4 focus:ring-orange-300 custom-cursor\">\r\n Dapatkan Paket Ini Sekarang\r\n <\/button>\r\n <\/div>\r\n <p class=\"mt-8 text-white text-sm opacity-90 custom-cursor\">Harga belum termasuk biaya kustomisasi fitur tambahan atau layanan hosting eksternal.<\/p>\r\n <\/div>\r\n<\/section><section class=\"py-16 bg-gradient-to-r from-blue-900 to-blue-700 text-white relative overflow-hidden\">\r\n <div class=\"absolute inset-0 z-0 opacity-10\">\r\n <svg class=\"w-full h-full custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\">\r\n <defs>\r\n <pattern id=\"pattern-zigzag\" x=\"0\" y=\"0\" width=\"20\" height=\"20\" patternUnits=\"userSpaceOnUse\" patternTransform=\"rotate(45)\">\r\n <path d=\"M0 10 L10 0 L20 10 L10 20 Z\" fill=\"rgba(255,255,255,0.05)\"><\/path>\r\n <\/pattern>\r\n <\/defs>\r\n <rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"url(#pattern-zigzag)\"><\/rect>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center relative z-10\">\r\n <h2 class=\"text-4xl sm:text-5xl font-extrabold mb-6 leading-tight custom-cursor\">Buktikan Sendiri Kemudahannya<\/h2>\r\n <p class=\"text-xl mb-8 opacity-90 custom-cursor\">Ingin melihat bagaimana Sistem Absensi Karyawan & Dosen dapat mengubah manajemen absensi di kampus Anda? Segera hubungi kami untuk sesi demo eksklusif.<\/p>\r\n <a href=\"https:\/\/wa.me\/6282136068256\" target=\"_blank\" class=\"inline-flex items-center justify-center px-8 py-4 border border-transparent text-lg font-semibold rounded-full shadow-lg text-white bg-orange-500 hover:bg-orange-600 focus:outline-none focus:ring-4 focus:ring-orange-300 transition-all duration-300 ease-in-out transform hover:scale-105 custom-cursor\">\r\n <svg class=\"w-6 h-6 mr-3 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M12.04 2c-5.46 0-9.91 4.45-9.91 9.91 0 1.75.5 3.4 1.36 4.86l-1.4 5.16 5.25-1.37c1.37.74 2.92 1.14 4.7 1.14h.01c5.45 0 9.91-4.45 9.91-9.91s-4.46-9.91-9.91-9.91zm.04 1.5c4.67 0 8.48 3.8 8.48 8.48S16.7 20.46 12.04 20.46a8.4 8.4 0 0 1-4.28-1.15l-.3-.18-3.13.82.83-3.04-.2-.31a8.4 8.4 0 0 1-1.29-4.44c0-4.67 3.8-8.48 8.48-8.48zm-3.32 5.14c-.16-.06-.5-.22-.72-.25-.21-.03-.46-.03-.66.25-.2.27-.77.95-.94 1.14-.17.18-.34.2-.63.08-.29-.12-1.22-.45-2.32-1.42-.85-.75-1.42-1.68-1.59-1.95-.16-.26-.02-.39.11-.63.12-.2.25-.45.38-.63.13-.18.17-.34.25-.5.08-.15.04-.29-.02-.42-.06-.13-.5-.31-1.22-.65-.73-.34-1.77-.92-2.15-1.03-.39-.12-.67-.1-.94-.1-.28 0-.59.04-.9.41-.3.38-1.15 1.12-1.15 2.76 0 1.63 1.18 3.2 1.34 3.42.17.21 2.36 3.65 5.7 5.04 3.33 1.38 3.98 1.15 4.75 1.07.77-.09 2.4-.98 2.72-1.82.32-.84.32-1.55.22-1.73-.1-.18-.36-.29-.74-.48z\"><\/path>\r\n <\/svg>\r\n Hubungi Kami Via WhatsApp Sekarang\r\n <\/a>\r\n <\/div>\r\n<\/section><section class=\"py-16 bg-gray-50\">\r\n <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-4xl sm:text-5xl font-extrabold text-center text-blue-900 mb-12 custom-cursor\">Pertanyaan Umum<\/h2>\r\n <div class=\"space-y-4\">\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-1\">\r\n <span class=\" custom-cursor\">Apakah software ini bisa diinstal di server internal kampus?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-1\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Ya, software ini dirancang fleksibel dan dapat diimplementasikan di server internal kampus maupun cloud sesuai kebutuhan Anda.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-2\">\r\n <span class=\" custom-cursor\">Bagaimana proses instalasi dan dukungan purna jual?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-2\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Kami menyediakan panduan instalasi lengkap dan dukungan teknis awal. Untuk dukungan purna jual jangka panjang, tersedia opsi kontrak layanan.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-3\">\r\n <span class=\" custom-cursor\">Apakah data absensi aman?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-3\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Keamanan data adalah prioritas kami. Software ini dilengkapi dengan fitur keamanan standar industri untuk melindungi informasi Anda.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-4\">\r\n <span class=\" custom-cursor\">Bisakah fitur disesuaikan dengan kebutuhan spesifik kampus kami?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-4\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Software kami memiliki modularitas yang memungkinkan kustomisasi. Silakan diskusikan kebutuhan spesifik Anda dengan tim kami.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <script>\r\n document.addEventListener('DOMContentLoaded', function() {\r\n const faqButtons = document.querySelectorAll('.faq-item button');\r\n\r\n faqButtons.forEach(button => {\r\n button.addEventListener('click', function() {\r\n const content = this.nextElementSibling;\r\n const svg = this.querySelector('svg');\r\n const isExpanded = this.getAttribute('aria-expanded') === 'true';\r\n\r\n faqButtons.forEach(otherButton => {\r\n if (otherButton !== this && otherButton.getAttribute('aria-expanded') === 'true') {\r\n const otherContent = otherButton.nextElementSibling;\r\n const otherSvg = otherButton.querySelector('svg');\r\n \r\n otherButton.setAttribute('aria-expanded', 'false');\r\n otherContent.style.maxHeight = '0';\r\n otherSvg.style.transform = 'rotate(0deg)';\r\n }\r\n });\r\n\r\n if (isExpanded) {\r\n this.setAttribute('aria-expanded', 'false');\r\n content.style.maxHeight = '0';\r\n svg.style.transform = 'rotate(0deg)';\r\n } else {\r\n this.setAttribute('aria-expanded', 'true');\r\n content.style.maxHeight = content.scrollHeight + 'px';\r\n svg.style.transform = 'rotate(45deg)';\r\n }\r\n });\r\n });\r\n });\r\n <\/script>\r\n<\/section><section class=\"bg-blue-900 text-white py-12\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 grid grid-cols-1 md:grid-cols-3 gap-8\">\r\n \r\n <div>\r\n <h3 class=\"text-xl font-bold mb-4 text-teal-300 custom-cursor\">Informasi Kontak<\/h3>\r\n <p class=\"mb-2 custom-cursor\">Email: <a href=\"\/cdn-cgi\/l\/email-protection#bcd5d2dad3fccfc8ddcedad5d9d0d892d5d8\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\"><span class=\"__cf_email__\" data-cfemail=\"472e2921280734332635212e222b23692e23\">[email protected]<\/span><\/a><\/p>\r\n <p class=\"mb-2 custom-cursor\">Telepon: <a href=\"tel:+6282136068256\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">0821-3606-8256<\/a><\/p>\r\n <p class=\"mb-2 custom-cursor\">Alamat: Villa Ciomas Indah Blok H-3 No.6 | Ciomas \u2013 Bogor<\/p>\r\n <\/div>\r\n\r\n \r\n <div>\r\n <h3 class=\"text-xl font-bold mb-4 text-teal-300 custom-cursor\">Navigasi Cepat<\/h3>\r\n <ul class=\"space-y-2 custom-cursor\">\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Tentang Kami<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Fitur<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Harga<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Demo<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">FAQ<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n \r\n <div>\r\n <h3 class=\"text-xl font-bold mb-4 text-teal-300 custom-cursor\">Ikuti Kami<\/h3>\r\n <div class=\"flex space-x-4\">\r\n <a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\" aria-label=\"Facebook\">\r\n <svg class=\"w-7 h-7 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M9 8h-3v4h3v12h5v-12h3.642l.358-4h-4v-1.667c0-.955.243-1.333 1.103-1.333h2.897v-5h-3.972c-3.122 0-4.028 1.488-4.028 4.156v2.844z\"><\/path><\/svg>\r\n <\/a>\r\n <a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\" aria-label=\"Twitter\">\r\n <svg class=\"w-7 h-7 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.795-1.574 2.163-2.723-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.322 0-6.002 2.68-6.002 6 0 .464.053.913.157 1.345-4.99-.25-9.43-2.64-12.4-6.26-.517.882-.815 1.905-.815 3.004 0 2.083 1.056 3.92 2.66 4.99-.781-.025-1.517-.24-2.164-.597v.075c0 2.912 2.08 5.343 4.83 5.9-1.396.38-2.898.47-4.39.176.765 2.395 2.986 4.137 5.631 4.182-2.074 1.625-4.678 2.59-7.525 2.59-.489 0-.97-.029-1.442-.084 2.685 1.76 5.874 2.78 9.27 2.78 11.12 0 17.227-9.292 17.227-17.227 0-.263-.008-.526-.019-.787.94-.678 1.758-1.555 2.413-2.548z\"><\/path><\/svg>\r\n <\/a>\r\n <a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\" aria-label=\"Instagram\">\r\n <svg class=\"w-7 h-7 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M12 0C8.74 0 8.333.014 7.053.072 5.775.132 4.905.333 4.14.636 3.375.94 2.686 1.38 2.052 2.015.798 3.26.085 4.903.022 7.05.008 7.37.002 7.689 0 8.006v7.988c.002.317.008.636.022.954.063 2.15.776 3.792 2.03 5.047.635.634 1.324 1.074 2.088 1.378.765.304 1.634.505 2.912.565 1.28.058 1.69.072 4.02.072s2.74-.014 4.02-.072c1.28-.06 2.148-.261 2.912-.565.764-.304 1.453-.744 2.088-1.378 1.254-1.255 1.967-2.897 2.03-5.047.014-.318.02-1.267.022-3.048V8.006c-.002-.317-.008-.636-.022-.954-.063-2.15-.776-3.792-2.03-5.047C21.94 1.38 21.25 1 20.485.636c-.765-.304-1.634-.505-2.912-.565C16.333.014 15.923 0 12 0zm0 2.163c3.21 0 3.58.014 4.85.072 1.15.053 1.8.243 2.14.373.34.13.62.3.9.57.28.28.44.56.57.9.13.34.32.99.37 2.14.058 1.27.072 1.64.072 4.85s-.014 3.58-.072 4.85c-.053 1.15-.243 1.8-.373 2.14-.13.34-.3.62-.57.9-.28.28-.56.44-.9.57-.34.13-.99.32-2.14.37-.26.012-1.29.022-2.73.022s-2.47-.01-2.73-.022c-1.15-.053-1.8-.243-2.14-.373-.34-.13-.62-.3-.9-.57-.28-.28-.44-.56-.57-.9-.13-.34-.32-.99-.37-2.14-.058-1.27-.072-1.64-.072-4.85s.014-3.58.072-4.85c.053-1.15.243-1.8.373-2.14.13.34.3.62.57.9.28.28.56.44.9.57.34-.13.99-.32 2.14-.37C8.42 2.177 8.79 2.163 12 2.163z\"><\/path><path d=\"M12 6.556c-3.003 0-5.444 2.441-5.444 5.444s2.441 5.444 5.444 5.444 5.444-2.441 5.444-5.444-2.441-5.444-5.444-5.444zm0 8.93c-1.921 0-3.486-1.565-3.486-3.486s1.565-3.486 3.486-3.486 3.486 1.565 3.486 3.486-1.565 3.486-3.486 3.486zM17.846 4.31a1.055 1.055 0 0 0 1.055 1.055 1.055 1.055 0 0 0 1.055-1.055 1.055 1.055 0 0 0-1.055-1.055 1.055 1.055 0 0 0-1.055 1.055z\"><\/path><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"text-center text-gray-400 mt-10 text-sm\">\r\n <p class=\" custom-cursor\">Hak Cipta 2024 Starfield.id. Semua Hak Dilindungi.<\/p>\r\n <\/div>\r\n<\/section>\r\n\r\n \r\n \r\n\r\n<script data-cfasync=\"false\" src=\"\/cdn-cgi\/scripts\/5c5dd728\/cloudflare-static\/email-decode.min.js\"><\/script><\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi! Sistem Absensi Karyawan & Dosen – Solusi Terbaik untuk Kampus Modern Aplikasi web inovatif untuk mengelola absensi dosen dan karyawan di kampus dengan akurasi tinggi, fitur lengkap, dan antarmuka modern yang intuitif. Optimalkan manajemen absensi Anda sekarang juga. Coba Demo Gratis Lihat Fitur Lengkap Memperkenalkan Sistem Absensi …<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/starfield.id\/?page_id=12257\"> <span class=\"screen-reader-text\">sofwtare absensi dosen<\/span> Selengkapnya »<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-12257","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/pages\/12257","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/starfield.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12257"}],"version-history":[{"count":0,"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/pages\/12257\/revisions"}],"wp:attachment":[{"href":"https:\/\/starfield.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12257"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n \r\n \r\n Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi!<\/title> \r\n <link rel=\"icon\" type=\"image\/png\" sizes=\"32x32\" href=\"\/favicon.png\"> \r\n <script src=\"https:\/\/cdn.tailwindcss.com\/3.4.16\"><\/script> \r\n\r\n \r\n <meta name=\"description\" content=\"Sistem Absensi Dosen & Karyawan terbaik! Lacak kehadiran, kelola data, ekspor laporan dengan mudah. Coba demo gratis & rasakan perbedaannya!\">\r\n \r\n \r\n <meta property=\"og:type\" content=\"website\">\r\n <meta property=\"og:url\" content=\"\/\/id.tapsite.ai\/sistem-absensi-kampus-dosen-karyawan-1753538068095\">\r\n <meta property=\"og:title\" content=\"Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi!\">\r\n <meta property=\"og:description\" content=\"Sistem Absensi Dosen & Karyawan terbaik! Lacak kehadiran, kelola data, ekspor laporan dengan mudah. Coba demo gratis & rasakan perbedaannya!\">\r\n <meta property=\"og:image\" content=\"https:\/\/placehold.co\/600x400?text=tapsite.ai\">\r\n\r\n \r\n <meta property=\"twitter:card\" content=\"summary_large_image\">\r\n <meta property=\"twitter:url\" content=\"\/\/id.tapsite.ai\/sistem-absensi-kampus-dosen-karyawan-1753538068095\">\r\n <meta property=\"twitter:title\" content=\"Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi!\">\r\n <meta property=\"twitter:description\" content=\"Sistem Absensi Dosen & Karyawan terbaik! Lacak kehadiran, kelola data, ekspor laporan dengan mudah. Coba demo gratis & rasakan perbedaannya!\">\r\n <meta property=\"twitter:image\" content=\"https:\/\/placehold.co\/600x400?text=tapsite.ai\">\r\n\r\n <meta name=\"robots\" content=\"index, follow\">\r\n\r\n <meta name=\"page_id\" content=\"01984703-7380-7-9b34-51094504c6b796f9\">\r\n <meta name=\"slug\" content=\"sistem-absensi-kampus-dosen-karyawan-1753538068095\">\r\n <meta name=\"user_id\" content=\"d4381967-72af-4627-a373-6cdb2a3990a9\">\r\n <meta name=\"submit_event\" content=\"null\">\r\n <meta name=\"click_event\" content=\"null\">\r\n <meta name=\"watermark\" content=\"1\">\r\n\r\n\r\n \r\n <script>\r\n tailwind.config = {\r\n darkMode: 'class',\r\n }\r\n <\/script>\r\n <script type=\"module\" crossorigin src=\"\/assets\/page-DgHeHVcW.js\"><\/script>\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/modulepreload-polyfill-B5Qt9EMX.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/helper-BnwCSuOS.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/index-QsbY2dIo.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/axios-CCb-kr4I.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/ChatBox-Ch-MoypT.js\">\r\n <link rel=\"modulepreload\" crossorigin href=\"\/assets\/chat-CHfbbg5O.js\">\r\n <link rel=\"stylesheet\" crossorigin href=\"\/assets\/ChatBox-D4AsBpfo.css\">\r\n<\/head>\r\n<body status=\"draft\">\r\n<section class=\"relative overflow-hidden bg-gradient-to-br from-blue-900 to-blue-700 text-white py-16 md:py-24\">\r\n <div class=\"container mx-auto px-4 flex flex-col md:flex-row items-center justify-between gap-12\">\r\n <div class=\"md:w-1\/2 text-center md:text-left\">\r\n <h1 class=\"text-4xl md:text-5xl lg:text-6xl font-extrabold leading-tight mb-6 custom-cursor\">\r\n Sistem Absensi Karyawan & Dosen - <span class=\"text-blue-200 custom-cursor\">Solusi Terbaik untuk Kampus Modern<\/span>\r\n <\/h1>\r\n <p class=\"text-lg md:text-xl text-blue-100 mb-8 max-w-lg mx-auto md:mx-0 custom-cursor\">\r\n Aplikasi web inovatif untuk mengelola absensi dosen dan karyawan di kampus dengan akurasi tinggi, fitur lengkap, dan antarmuka modern yang intuitif. Optimalkan manajemen absensi Anda sekarang juga.\r\n <\/p>\r\n <a href=\"#demo\" class=\"inline-block bg-orange-500 hover:bg-orange-600 text-white font-bold py-3 px-8 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:scale-105 text-lg custom-cursor\">\r\n Coba Demo Gratis\r\n <\/a>\r\n <a href=\"#features\" class=\"inline-block ml-4 text-blue-200 hover:text-blue-50 font-semibold py-3 px-8 rounded-full transition duration-300 ease-in-out text-lg border border-blue-200 hover:border-blue-50 custom-cursor\">\r\n Lihat Fitur Lengkap\r\n <\/a>\r\n <\/div>\r\n <div class=\"md:w-1\/2 mt-12 md:mt-0 flex justify-center\">\r\n <img decoding=\"async\" src=\"https:\/\/storage.tapsite.ai\/media\/assets\/01984706-b5cf-7-aa6b-ce5fce897cd25aaf.webp\" alt=\"Antarmuka modern sistem absensi pada perangkat desktop atau tablet\" class=\"rounded-xl shadow-2xl border-4 border-blue-300 transform transition-transform duration-500 hover:scale-102 custom-cursor\">\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"absolute bottom-0 left-0 w-full h-1\/3 bg-gradient-to-t from-blue-900 to-transparent pointer-events-none\"><\/div>\r\n<\/section><section class=\"py-16 md:py-24 bg-gray-50\">\r\n <div class=\"container mx-auto px-4 text-center\">\r\n <h2 class=\"text-3xl md:text-4xl font-extrabold text-blue-900 mb-8 custom-cursor\">\r\n Memperkenalkan Sistem Absensi Karyawan & Dosen: <span class=\"text-blue-600 custom-cursor\">Efisiensi di Genggaman Anda<\/span>\r\n <\/h2>\r\n <div class=\"flex flex-col md:flex-row items-center justify-center gap-10 md:gap-16 max-w-4xl mx-auto\">\r\n <div class=\"md:w-1\/2\">\r\n <p class=\"text-lg md:text-xl text-gray-700 leading-relaxed mb-6 custom-cursor\">\r\n Dirancang khusus untuk kebutuhan unik institusi pendidikan, aplikasi web kami menyediakan solusi komprehensif untuk pengelolaan absensi dosen dan karyawan. Dengan fitur mutakhir dan desain yang user-friendly, kami membantu kampus Anda mencapai efisiensi administrasi yang belum pernah ada sebelumnya.\r\n <\/p>\r\n <p class=\"text-base text-gray-600 custom-cursor\">\r\n Kami memahami bahwa waktu adalah aset berharga. Oleh karena itu, sistem kami dirancang untuk menyederhanakan proses, mengurangi beban administratif, dan meningkatkan akurasi data kehadiran.\r\n <\/p>\r\n <\/div>\r\n <div class=\"md:w-1\/2 flex justify-center\">\r\n <img decoding=\"async\" src=\"https:\/\/storage.tapsite.ai\/media\/assets\/01984706-b5cf-7-aa6b-ce5fce897cd25aaf.webp\" alt=\"Ilustrasi konsep efisiensi dan sistem terintegrasi\" class=\"rounded-lg shadow-lg custom-cursor\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 md:py-24 bg-white\">\r\n <div class=\"container mx-auto px-4\">\r\n <h2 class=\"text-3xl md:text-4xl font-extrabold text-blue-900 text-center mb-12 custom-cursor\">\r\n Hadapi Tantangan Absensi dengan <span class=\"text-blue-600 custom-cursor\">Solusi Cerdas<\/span>\r\n <\/h2>\r\n\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-10 lg:gap-16 max-w-6xl mx-auto\">\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/fecaca\/991b1b?text=\u23f3\" alt=\"Icon Waktu Memakan\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Pencatatan Manual yang Memakan Waktu?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Sistem kami mengotomatiskan pencatatan, membebaskan waktu berharga Anda untuk fokus pada hal yang lebih penting.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/fef08a\/92400e?text=\u23f1\ufe0f\" alt=\"Icon Keterlambatan\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Kesulitan Melacak Keterlambatan dan Kehadiran?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Deteksi keterlambatan otomatis dan statistik real-time memberikan visibilitas penuh terhadap kehadiran.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/ede9fe\/6b21a8?text=\ud83d\udcca\" alt=\"Icon Laporan Tidak Akurat\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Laporan Absensi yang Tidak Akurat?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Laporan akurat yang dapat diekspor menjamin keandalan data untuk pengambilan keputusan.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"flex flex-col md:flex-row items-start bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300\">\r\n <div class=\"flex-shrink-0 mb-4 md:mb-0 md:mr-6\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/60x60\/dcfce7\/166534?text=\ud83d\udccb\" alt=\"Icon Administrasi Rumit\" class=\"w-16 h-16 object-contain custom-cursor\">\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 mb-3 custom-cursor\">Administrasi Absensi yang Rumit dan Ribet?<\/h3>\r\n <p class=\"text-lg text-gray-600 custom-cursor\">\r\n <span class=\"font-semibold text-blue-700 custom-cursor\">Solusi:<\/span> Antarmuka intuitif dan manajemen terpusat menyederhanakan seluruh proses absensi.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 px-4 sm:px-6 lg:px-8 bg-white\">\r\n <div class=\"max-w-7xl mx-auto text-center\">\r\n <h2 class=\"text-4xl font-extrabold text-gray-900 mb-12 custom-cursor\">Fitur Unggulan untuk Produktivitas Maksimal<\/h2>\r\n\r\n \r\n <div class=\"mb-16\">\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-8 custom-cursor\">Sistem Multi-Role yang Terintegrasi<\/h3>\r\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-8 text-left\">\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center mr-4 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/32x32\/FFFFFF\/000000?text=A\" alt=\"Admin Icon\" class=\"filter invert custom-cursor\" aria-label=\"Admin Icon\">\r\n <\/div>\r\n <h4 class=\"text-2xl font-semibold text-gray-800 custom-cursor\">Admin<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Kontrol penuh atas seluruh sistem, manajemen pengguna, dan akses laporan mendalam untuk pengambilan keputusan yang strategis.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center mr-4 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/32x32\/FFFFFF\/000000?text=D\" alt=\"Dosen Icon\" class=\"filter invert custom-cursor\" aria-label=\"Dosen Icon\">\r\n <\/div>\r\n <h4 class=\"text-2xl font-semibold text-gray-800 custom-cursor\">Dosen<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Kemudahan absensi dan riwayat kehadiran pribadi yang selalu terbarui, memastikan transparansi dan aksesibilitas informasi.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center mr-4 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/32x32\/FFFFFF\/000000?text=K\" alt=\"Karyawan Icon\" class=\"filter invert custom-cursor\" aria-label=\"Karyawan Icon\">\r\n <\/div>\r\n <h4 class=\"text-2xl font-semibold text-gray-800 custom-cursor\">Karyawan<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Pencatatan absensi yang cepat dan akses mudah ke riwayat personal, menyederhanakan proses administrasi harian.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"mb-16\">\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-8 custom-cursor\">Manajemen Absensi yang Cerdas<\/h3>\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 text-left\">\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u23f0\" alt=\"Real-Time Icon\" class=\"filter invert custom-cursor\" aria-label=\"Real-Time Absensi Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Absensi Real-Time<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Catat waktu masuk dan keluar secara instan dan akurat, memastikan data kehadiran yang valid dan terkini.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u23f1\ufe0f\" alt=\"Delay Detection Icon\" class=\"filter invert custom-cursor\" aria-label=\"Deteksi Keterlambatan Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Deteksi Keterlambatan Otomatis<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Identifikasi keterlambatan secara presisi, meminimalisir kesalahan manual dan meningkatkan disiplin.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\udcca\" alt=\"Statistics Icon\" class=\"filter invert custom-cursor\" aria-label=\"Statistik Absensi Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Statistik Absensi Bulanan<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Dapatkan gambaran kinerja kehadiran dalam bentuk grafik yang mudah dipahami untuk evaluasi cepat.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\udcf1\" alt=\"Responsive Icon\" class=\"filter invert custom-cursor\" aria-label=\"Desain Responsif Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Desain Responsif Mobile<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Absensi dan akses fitur nyaman dari perangkat apa pun, kapan saja, dan di mana saja.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-teal-500 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u231a\" alt=\"Clock Icon\" class=\"filter invert custom-cursor\" aria-label=\"Jam Real-Time Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Jam Real-Time Terintegrasi<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Sinkronisasi waktu yang akurat untuk pencatatan absensi yang valid dan dapat dipertanggungjawabkan.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div>\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-8 custom-cursor\">Kemudahan Manajemen Administratif<\/h3>\r\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 text-left\">\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\uddc3\ufe0f\" alt=\"Data Management Icon\" class=\"filter invert custom-cursor\" aria-label=\"Kelola Data Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Kelola Data Lengkap<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Pengelolaan data dosen dan karyawan yang terpusat dan efisien, memudahkan pembaruan informasi.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\ud83d\udcc4\" alt=\"Report Icon\" class=\"filter invert custom-cursor\" aria-label=\"Laporan Absensi Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Laporan Absensi Komprehensif<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Hasilkan laporan detail untuk analisis dan audit, mendukung pengambilan keputusan yang informatif.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u2699\ufe0f\" alt=\"Settings Icon\" class=\"filter invert custom-cursor\" aria-label=\"Pengaturan Jam Kerja Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Pengaturan Jam Kerja Fleksibel<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Sesuaikan jam kerja sesuai kebijakan institusi Anda, memberikan fleksibilitas administratif.<\/p>\r\n <\/div>\r\n <div class=\"bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 transform hover:-translate-y-1\">\r\n <div class=\"flex items-center mb-4\">\r\n <div class=\"w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center mr-3 shadow-lg\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/FFFFFF\/000000?text=\u2b07\ufe0f\" alt=\"Export Icon\" class=\"filter invert custom-cursor\" aria-label=\"Export Data Icon\">\r\n <\/div>\r\n <h4 class=\"text-xl font-semibold text-gray-800 custom-cursor\">Export Data Mudah<\/h4>\r\n <\/div>\r\n <p class=\"text-gray-600 custom-cursor\">Ekspor laporan ke PDF, Excel, atau CSV untuk integrasi data yang lancar dengan sistem lain.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 px-4 sm:px-6 lg:px-8 bg-gray-100\">\r\n <div class=\"max-w-7xl mx-auto flex flex-col lg:flex-row items-center gap-12\">\r\n <div class=\"lg:w-1\/2 text-center lg:text-left\">\r\n <h2 class=\"text-4xl font-extrabold text-gray-900 mb-8 leading-tight custom-cursor\">Solusi Ideal untuk Institusi Anda<\/h2>\r\n <p class=\"text-lg text-gray-700 mb-8 max-w-xl lg:max-w-none custom-cursor\">\r\n Sistem Absensi Karyawan & Dosen ini dirancang secara spesifik untuk memenuhi kebutuhan manajemen absensi di berbagai jenis institusi pendidikan, memastikan efisiensi dan akurasi yang Anda butuhkan.\r\n <\/p>\r\n <ul class=\"text-lg text-gray-700 space-y-3 font-medium custom-cursor\">\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Universitas<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Politeknik<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Sekolah Tinggi<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Akademi<\/span>\r\n <\/li>\r\n <li class=\"flex items-center justify-center lg:justify-start\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/1D4ED8\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Lembaga Pendidikan Tinggi lainnya<\/span>\r\n <\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"lg:w-1\/2 mt-10 lg:mt-0 flex justify-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x400\/87CEEB\/FFFFFF\/B0C4DE?text=Lingkungan+Kampus+Modern\" alt=\"Ilustrasi Lingkungan Kampus Modern\" class=\"rounded-xl shadow-2xl transition-transform duration-500 ease-in-out hover:scale-105 custom-cursor\" aria-label=\"Modern Campus Environment Illustration\">\r\n <\/div>\r\n <\/div>\r\n<\/section><section class=\"py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-900 to-blue-700\">\r\n <div class=\"max-w-4xl mx-auto text-center\">\r\n <h2 class=\"text-4xl font-extrabold text-white mb-12 custom-cursor\">Investasi Cerdas untuk Efisiensi Jangka Panjang<\/h2>\r\n <div class=\"bg-white rounded-xl shadow-2xl p-8 sm:p-10 lg:p-12 border-4 border-teal-400 transform transition-all duration-500 hover:scale-[1.02] hover:shadow-3xl\">\r\n <h3 class=\"text-3xl font-bold text-blue-800 mb-4 custom-cursor\">Paket Profesional<\/h3>\r\n <p class=\"text-gray-600 text-lg mb-6 custom-cursor\">Solusi komprehensif untuk manajemen absensi yang akurat dan efisien di seluruh institusi Anda.<\/p>\r\n <div class=\"flex items-baseline justify-center mb-8\">\r\n <span class=\"text-5xl font-extrabold text-blue-900 custom-cursor\">Rp 1.500.000<\/span>\r\n <span class=\"text-xl font-medium text-gray-500 ml-2 custom-cursor\">(Satu Kali Pembayaran)<\/span>\r\n <\/div>\r\n\r\n <ul class=\"text-left text-gray-700 space-y-4 mb-10 text-lg custom-cursor\">\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Lisensi Penggunaan Tanpa Batas Waktu<\/strong> untuk keberlanjutan investasi Anda.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Akses Penuh <strong class=\"text-blue-800\">Fitur Multi-Role<\/strong> (Admin, Dosen, Karyawan) yang terintegrasi.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Modul <strong class=\"text-blue-800\">Absensi Real-Time Lengkap<\/strong> untuk pencatatan akurat.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\">Modul <strong class=\"text-blue-800\">Pelaporan dan Ekspor Data<\/strong> komprehensif untuk analisis.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Pembaruan Software Gratis<\/strong> selama 1 Tahun untuk fitur terkini.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Dukungan Teknis Awal<\/strong> (Instalasi dan Konfigurasi) untuk kemudahan awal.<\/span>\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <img decoding=\"async\" src=\"https:\/\/placehold.co\/24x24\/20B2AA\/FFFFFF?text=\u2714\ufe0f\" alt=\"Checkmark icon\" class=\"mr-3 flex-shrink-0 custom-cursor\" aria-label=\"Checkmark\">\r\n <span class=\" custom-cursor\"><strong class=\"text-blue-800\">Tutorial Penggunaan Software<\/strong> untuk membantu Anda memulai.<\/span>\r\n <\/li>\r\n <\/ul>\r\n\r\n <button class=\"w-full py-4 px-8 bg-orange-500 text-white font-bold text-xl rounded-lg shadow-lg hover:bg-orange-600 transition-colors duration-300 transform hover:scale-105 focus:outline-none focus:ring-4 focus:ring-orange-300 custom-cursor\">\r\n Dapatkan Paket Ini Sekarang\r\n <\/button>\r\n <\/div>\r\n <p class=\"mt-8 text-white text-sm opacity-90 custom-cursor\">Harga belum termasuk biaya kustomisasi fitur tambahan atau layanan hosting eksternal.<\/p>\r\n <\/div>\r\n<\/section><section class=\"py-16 bg-gradient-to-r from-blue-900 to-blue-700 text-white relative overflow-hidden\">\r\n <div class=\"absolute inset-0 z-0 opacity-10\">\r\n <svg class=\"w-full h-full custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\">\r\n <defs>\r\n <pattern id=\"pattern-zigzag\" x=\"0\" y=\"0\" width=\"20\" height=\"20\" patternUnits=\"userSpaceOnUse\" patternTransform=\"rotate(45)\">\r\n <path d=\"M0 10 L10 0 L20 10 L10 20 Z\" fill=\"rgba(255,255,255,0.05)\"><\/path>\r\n <\/pattern>\r\n <\/defs>\r\n <rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"url(#pattern-zigzag)\"><\/rect>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center relative z-10\">\r\n <h2 class=\"text-4xl sm:text-5xl font-extrabold mb-6 leading-tight custom-cursor\">Buktikan Sendiri Kemudahannya<\/h2>\r\n <p class=\"text-xl mb-8 opacity-90 custom-cursor\">Ingin melihat bagaimana Sistem Absensi Karyawan & Dosen dapat mengubah manajemen absensi di kampus Anda? Segera hubungi kami untuk sesi demo eksklusif.<\/p>\r\n <a href=\"https:\/\/wa.me\/6282136068256\" target=\"_blank\" class=\"inline-flex items-center justify-center px-8 py-4 border border-transparent text-lg font-semibold rounded-full shadow-lg text-white bg-orange-500 hover:bg-orange-600 focus:outline-none focus:ring-4 focus:ring-orange-300 transition-all duration-300 ease-in-out transform hover:scale-105 custom-cursor\">\r\n <svg class=\"w-6 h-6 mr-3 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M12.04 2c-5.46 0-9.91 4.45-9.91 9.91 0 1.75.5 3.4 1.36 4.86l-1.4 5.16 5.25-1.37c1.37.74 2.92 1.14 4.7 1.14h.01c5.45 0 9.91-4.45 9.91-9.91s-4.46-9.91-9.91-9.91zm.04 1.5c4.67 0 8.48 3.8 8.48 8.48S16.7 20.46 12.04 20.46a8.4 8.4 0 0 1-4.28-1.15l-.3-.18-3.13.82.83-3.04-.2-.31a8.4 8.4 0 0 1-1.29-4.44c0-4.67 3.8-8.48 8.48-8.48zm-3.32 5.14c-.16-.06-.5-.22-.72-.25-.21-.03-.46-.03-.66.25-.2.27-.77.95-.94 1.14-.17.18-.34.2-.63.08-.29-.12-1.22-.45-2.32-1.42-.85-.75-1.42-1.68-1.59-1.95-.16-.26-.02-.39.11-.63.12-.2.25-.45.38-.63.13-.18.17-.34.25-.5.08-.15.04-.29-.02-.42-.06-.13-.5-.31-1.22-.65-.73-.34-1.77-.92-2.15-1.03-.39-.12-.67-.1-.94-.1-.28 0-.59.04-.9.41-.3.38-1.15 1.12-1.15 2.76 0 1.63 1.18 3.2 1.34 3.42.17.21 2.36 3.65 5.7 5.04 3.33 1.38 3.98 1.15 4.75 1.07.77-.09 2.4-.98 2.72-1.82.32-.84.32-1.55.22-1.73-.1-.18-.36-.29-.74-.48z\"><\/path>\r\n <\/svg>\r\n Hubungi Kami Via WhatsApp Sekarang\r\n <\/a>\r\n <\/div>\r\n<\/section><section class=\"py-16 bg-gray-50\">\r\n <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-4xl sm:text-5xl font-extrabold text-center text-blue-900 mb-12 custom-cursor\">Pertanyaan Umum<\/h2>\r\n <div class=\"space-y-4\">\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-1\">\r\n <span class=\" custom-cursor\">Apakah software ini bisa diinstal di server internal kampus?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-1\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Ya, software ini dirancang fleksibel dan dapat diimplementasikan di server internal kampus maupun cloud sesuai kebutuhan Anda.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-2\">\r\n <span class=\" custom-cursor\">Bagaimana proses instalasi dan dukungan purna jual?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-2\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Kami menyediakan panduan instalasi lengkap dan dukungan teknis awal. Untuk dukungan purna jual jangka panjang, tersedia opsi kontrak layanan.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-3\">\r\n <span class=\" custom-cursor\">Apakah data absensi aman?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-3\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Keamanan data adalah prioritas kami. Software ini dilengkapi dengan fitur keamanan standar industri untuk melindungi informasi Anda.<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"border border-gray-200 rounded-lg shadow-sm overflow-hidden transition-all duration-300 faq-item\">\r\n <button class=\"w-full flex justify-between items-center p-6 text-lg font-semibold text-left text-blue-800 hover:bg-blue-50 focus:outline-none focus:bg-blue-50 transition-colors duration-200 custom-cursor\" aria-expanded=\"false\" aria-controls=\"faq-content-4\">\r\n <span class=\" custom-cursor\">Bisakah fitur disesuaikan dengan kebutuhan spesifik kampus kami?<\/span>\r\n <svg class=\"w-6 h-6 transform transition-transform duration-300 custom-cursor\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path d=\"M12 5v14M5 12h14\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n <div id=\"faq-content-4\" class=\"px-6 pb-6 pt-0 text-gray-700 leading-relaxed overflow-hidden max-h-0 transition-all duration-300 ease-in-out\">\r\n <p class=\" custom-cursor\">Software kami memiliki modularitas yang memungkinkan kustomisasi. Silakan diskusikan kebutuhan spesifik Anda dengan tim kami.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <script>\r\n document.addEventListener('DOMContentLoaded', function() {\r\n const faqButtons = document.querySelectorAll('.faq-item button');\r\n\r\n faqButtons.forEach(button => {\r\n button.addEventListener('click', function() {\r\n const content = this.nextElementSibling;\r\n const svg = this.querySelector('svg');\r\n const isExpanded = this.getAttribute('aria-expanded') === 'true';\r\n\r\n faqButtons.forEach(otherButton => {\r\n if (otherButton !== this && otherButton.getAttribute('aria-expanded') === 'true') {\r\n const otherContent = otherButton.nextElementSibling;\r\n const otherSvg = otherButton.querySelector('svg');\r\n \r\n otherButton.setAttribute('aria-expanded', 'false');\r\n otherContent.style.maxHeight = '0';\r\n otherSvg.style.transform = 'rotate(0deg)';\r\n }\r\n });\r\n\r\n if (isExpanded) {\r\n this.setAttribute('aria-expanded', 'false');\r\n content.style.maxHeight = '0';\r\n svg.style.transform = 'rotate(0deg)';\r\n } else {\r\n this.setAttribute('aria-expanded', 'true');\r\n content.style.maxHeight = content.scrollHeight + 'px';\r\n svg.style.transform = 'rotate(45deg)';\r\n }\r\n });\r\n });\r\n });\r\n <\/script>\r\n<\/section><section class=\"bg-blue-900 text-white py-12\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 grid grid-cols-1 md:grid-cols-3 gap-8\">\r\n \r\n <div>\r\n <h3 class=\"text-xl font-bold mb-4 text-teal-300 custom-cursor\">Informasi Kontak<\/h3>\r\n <p class=\"mb-2 custom-cursor\">Email: <a href=\"\/cdn-cgi\/l\/email-protection#bcd5d2dad3fccfc8ddcedad5d9d0d892d5d8\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\"><span class=\"__cf_email__\" data-cfemail=\"472e2921280734332635212e222b23692e23\">[email protected]<\/span><\/a><\/p>\r\n <p class=\"mb-2 custom-cursor\">Telepon: <a href=\"tel:+6282136068256\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">0821-3606-8256<\/a><\/p>\r\n <p class=\"mb-2 custom-cursor\">Alamat: Villa Ciomas Indah Blok H-3 No.6 | Ciomas \u2013 Bogor<\/p>\r\n <\/div>\r\n\r\n \r\n <div>\r\n <h3 class=\"text-xl font-bold mb-4 text-teal-300 custom-cursor\">Navigasi Cepat<\/h3>\r\n <ul class=\"space-y-2 custom-cursor\">\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Tentang Kami<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Fitur<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Harga<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">Demo<\/a><\/li>\r\n <li><a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\">FAQ<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n \r\n <div>\r\n <h3 class=\"text-xl font-bold mb-4 text-teal-300 custom-cursor\">Ikuti Kami<\/h3>\r\n <div class=\"flex space-x-4\">\r\n <a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\" aria-label=\"Facebook\">\r\n <svg class=\"w-7 h-7 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M9 8h-3v4h3v12h5v-12h3.642l.358-4h-4v-1.667c0-.955.243-1.333 1.103-1.333h2.897v-5h-3.972c-3.122 0-4.028 1.488-4.028 4.156v2.844z\"><\/path><\/svg>\r\n <\/a>\r\n <a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\" aria-label=\"Twitter\">\r\n <svg class=\"w-7 h-7 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.795-1.574 2.163-2.723-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.322 0-6.002 2.68-6.002 6 0 .464.053.913.157 1.345-4.99-.25-9.43-2.64-12.4-6.26-.517.882-.815 1.905-.815 3.004 0 2.083 1.056 3.92 2.66 4.99-.781-.025-1.517-.24-2.164-.597v.075c0 2.912 2.08 5.343 4.83 5.9-1.396.38-2.898.47-4.39.176.765 2.395 2.986 4.137 5.631 4.182-2.074 1.625-4.678 2.59-7.525 2.59-.489 0-.97-.029-1.442-.084 2.685 1.76 5.874 2.78 9.27 2.78 11.12 0 17.227-9.292 17.227-17.227 0-.263-.008-.526-.019-.787.94-.678 1.758-1.555 2.413-2.548z\"><\/path><\/svg>\r\n <\/a>\r\n <a href=\"#\" class=\"text-gray-300 hover:text-white transition-colors duration-200 custom-cursor\" aria-label=\"Instagram\">\r\n <svg class=\"w-7 h-7 custom-cursor\" fill=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M12 0C8.74 0 8.333.014 7.053.072 5.775.132 4.905.333 4.14.636 3.375.94 2.686 1.38 2.052 2.015.798 3.26.085 4.903.022 7.05.008 7.37.002 7.689 0 8.006v7.988c.002.317.008.636.022.954.063 2.15.776 3.792 2.03 5.047.635.634 1.324 1.074 2.088 1.378.765.304 1.634.505 2.912.565 1.28.058 1.69.072 4.02.072s2.74-.014 4.02-.072c1.28-.06 2.148-.261 2.912-.565.764-.304 1.453-.744 2.088-1.378 1.254-1.255 1.967-2.897 2.03-5.047.014-.318.02-1.267.022-3.048V8.006c-.002-.317-.008-.636-.022-.954-.063-2.15-.776-3.792-2.03-5.047C21.94 1.38 21.25 1 20.485.636c-.765-.304-1.634-.505-2.912-.565C16.333.014 15.923 0 12 0zm0 2.163c3.21 0 3.58.014 4.85.072 1.15.053 1.8.243 2.14.373.34.13.62.3.9.57.28.28.44.56.57.9.13.34.32.99.37 2.14.058 1.27.072 1.64.072 4.85s-.014 3.58-.072 4.85c-.053 1.15-.243 1.8-.373 2.14-.13.34-.3.62-.57.9-.28.28-.56.44-.9.57-.34.13-.99.32-2.14.37-.26.012-1.29.022-2.73.022s-2.47-.01-2.73-.022c-1.15-.053-1.8-.243-2.14-.373-.34-.13-.62-.3-.9-.57-.28-.28-.44-.56-.57-.9-.13-.34-.32-.99-.37-2.14-.058-1.27-.072-1.64-.072-4.85s.014-3.58.072-4.85c.053-1.15.243-1.8.373-2.14.13.34.3.62.57.9.28.28.56.44.9.57.34-.13.99-.32 2.14-.37C8.42 2.177 8.79 2.163 12 2.163z\"><\/path><path d=\"M12 6.556c-3.003 0-5.444 2.441-5.444 5.444s2.441 5.444 5.444 5.444 5.444-2.441 5.444-5.444-2.441-5.444-5.444-5.444zm0 8.93c-1.921 0-3.486-1.565-3.486-3.486s1.565-3.486 3.486-3.486 3.486 1.565 3.486 3.486-1.565 3.486-3.486 3.486zM17.846 4.31a1.055 1.055 0 0 0 1.055 1.055 1.055 1.055 0 0 0 1.055-1.055 1.055 1.055 0 0 0-1.055-1.055 1.055 1.055 0 0 0-1.055 1.055z\"><\/path><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"text-center text-gray-400 mt-10 text-sm\">\r\n <p class=\" custom-cursor\">Hak Cipta 2024 Starfield.id. Semua Hak Dilindungi.<\/p>\r\n <\/div>\r\n<\/section>\r\n\r\n \r\n \r\n\r\n<script data-cfasync=\"false\" src=\"\/cdn-cgi\/scripts\/5c5dd728\/cloudflare-static\/email-decode.min.js\"><\/script><\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Absensi Kampus Modern: Akhiri Absensi Manual, Raih Efisiensi! Sistem Absensi Karyawan & Dosen – Solusi Terbaik untuk Kampus Modern Aplikasi web inovatif untuk mengelola absensi dosen dan karyawan di kampus dengan akurasi tinggi, fitur lengkap, dan antarmuka modern yang intuitif. Optimalkan manajemen absensi Anda sekarang juga. Coba Demo Gratis Lihat Fitur Lengkap Memperkenalkan Sistem Absensi …<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/starfield.id\/?page_id=12257\"> <span class=\"screen-reader-text\">sofwtare absensi dosen<\/span> Selengkapnya »<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-12257","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/pages\/12257","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/starfield.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12257"}],"version-history":[{"count":0,"href":"https:\/\/starfield.id\/index.php?rest_route=\/wp\/v2\/pages\/12257\/revisions"}],"wp:attachment":[{"href":"https:\/\/starfield.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12257"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}