{"id":26,"date":"2023-08-29T09:18:19","date_gmt":"2023-08-29T09:18:19","guid":{"rendered":"https:\/\/flashklik.com\/?page_id=26"},"modified":"2026-08-18T07:50:20","modified_gmt":"2026-08-18T07:50:20","slug":"home","status":"publish","type":"page","link":"https:\/\/flashklik.com\/id\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"26\" class=\"elementor elementor-26\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-acf40db e-con-full e-flex e-con e-parent\" data-id=\"acf40db\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-245f3c6 elementor-widget elementor-widget-html\" data-id=\"245f3c6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- =========================================================\r\n     FLASHKLIK HOMEPAGE HERO V3\r\n     Premium \/ Dark Tech \/ Glassmorphism\r\n========================================================= -->\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto+Condensed:wght@400;500;600;700&family=Ubuntu:wght@300;400;500;700&display=swap\" rel=\"stylesheet\">\r\n\r\n\r\n<section class=\"fkh3-hero\">\r\n\r\n  <!-- Ambient Decoration -->\r\n  <div class=\"fkh3-ambient fkh3-ambient-blue\"><\/div>\r\n  <div class=\"fkh3-ambient fkh3-ambient-pink\"><\/div>\r\n\r\n  <div class=\"fkh3-container\">\r\n\r\n\r\n    <!-- =====================================================\r\n         LEFT SIDE\r\n    ====================================================== -->\r\n    <div class=\"fkh3-content\">\r\n\r\n\r\n      <!-- Eyebrow -->\r\n      <div class=\"fkh3-eyebrow\">\r\n\r\n        <div class=\"fkh3-eyebrow-icon\">\r\n\r\n          <svg viewBox=\"0 0 24 24\"\r\n               fill=\"none\"\r\n               stroke=\"currentColor\"\r\n               stroke-width=\"2\">\r\n\r\n            <path d=\"M13 2 3 14h9l-1 8 10-12h-9l1-8z\"><\/path>\r\n\r\n          <\/svg>\r\n\r\n        <\/div>\r\n\r\n        <span>SOLVE WITH FLASHKLIK<\/span>\r\n\r\n        <span class=\"fkh3-eyebrow-live\">\r\n          <i><\/i>\r\n          BUSINESS SOLUTIONS\r\n        <\/span>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n      <!-- Main Heading -->\r\n      <h1 class=\"fkh3-title\">\r\n\r\n        Built for\r\n        <span class=\"fkh3-title-soft\">Business.<\/span>\r\n\r\n        <span class=\"fkh3-title-second\">\r\n          Made for\r\n\r\n          <span class=\"fkh3-efficiency\">\r\n            Efficiency.\r\n\r\n            <!-- Hand-drawn style ring -->\r\n            <svg\r\n              class=\"fkh3-ring\"\r\n              viewBox=\"0 0 440 120\"\r\n              preserveAspectRatio=\"none\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              <path\r\n                d=\"M18 70\r\n                   C36 18, 132 7, 230 10\r\n                   C334 12, 410 31, 417 65\r\n                   C425 98, 350 108, 230 108\r\n                   C112 109, 28 99, 18 70Z\"\r\n              \/>\r\n            <\/svg>\r\n\r\n          <\/span>\r\n\r\n        <\/span>\r\n\r\n      <\/h1>\r\n\r\n\r\n\r\n      <!-- Description -->\r\n      <p class=\"fkh3-description\">\r\n\r\n        Helping businesses and organizations work smarter,\r\n        improve productivity, and simplify everyday operations\r\n        through connected digital solutions.\r\n\r\n      <\/p>\r\n\r\n\r\n\r\n      <!-- CTA -->\r\n      <div class=\"fkh3-actions\">\r\n\r\n        <a href=\"#solutions\"\r\n           class=\"fkh3-btn fkh3-btn-primary\">\r\n\r\n          Explore Solutions\r\n\r\n          <svg viewBox=\"0 0 24 24\"\r\n               fill=\"none\"\r\n               stroke=\"currentColor\"\r\n               stroke-width=\"2\">\r\n\r\n            <path d=\"M5 12h14\"><\/path>\r\n            <path d=\"m13 6 6 6-6 6\"><\/path>\r\n\r\n          <\/svg>\r\n\r\n        <\/a>\r\n\r\n\r\n        <a href=\"\/contact-us\"\r\n           class=\"fkh3-btn fkh3-btn-secondary\">\r\n\r\n          <span class=\"fkh3-btn-contact-icon\">\r\n\r\n            <svg viewBox=\"0 0 24 24\"\r\n                 fill=\"none\"\r\n                 stroke=\"currentColor\"\r\n                 stroke-width=\"2\">\r\n\r\n              <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"><\/path>\r\n\r\n            <\/svg>\r\n\r\n          <\/span>\r\n\r\n          Contact Us\r\n\r\n        <\/a>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n      <!-- Bottom Info -->\r\n      <div class=\"fkh3-info-row\">\r\n\r\n\r\n        <!-- Stat -->\r\n        <div class=\"fkh3-stat\">\r\n\r\n          <div class=\"fkh3-stat-number\">\r\n            30<span>+<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"fkh3-stat-copy\">\r\n            <strong>Users Downloaded<\/strong>\r\n            <span>and growing<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"fkh3-info-divider\"><\/div>\r\n\r\n\r\n        <!-- Info -->\r\n        <div class=\"fkh3-mini-info\">\r\n\r\n          <div class=\"fkh3-mini-icon\">\r\n\r\n            <svg viewBox=\"0 0 24 24\"\r\n                 fill=\"none\"\r\n                 stroke=\"currentColor\"\r\n                 stroke-width=\"2\">\r\n\r\n              <path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"><\/path>\r\n\r\n              <path d=\"m9 12 2 2 4-4\"><\/path>\r\n\r\n            <\/svg>\r\n\r\n          <\/div>\r\n\r\n          <div>\r\n            <strong>Business Ready<\/strong>\r\n            <span>Built for daily operations<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"fkh3-info-divider\"><\/div>\r\n\r\n\r\n        <!-- Info -->\r\n        <div class=\"fkh3-mini-info\">\r\n\r\n          <div class=\"fkh3-mini-icon\">\r\n\r\n            <svg viewBox=\"0 0 24 24\"\r\n                 fill=\"none\"\r\n                 stroke=\"currentColor\"\r\n                 stroke-width=\"2\">\r\n\r\n              <circle cx=\"12\" cy=\"12\" r=\"9\"><\/circle>\r\n              <path d=\"M12 7v5l3 2\"><\/path>\r\n\r\n            <\/svg>\r\n\r\n          <\/div>\r\n\r\n          <div>\r\n            <strong>Smarter Workflow<\/strong>\r\n            <span>Designed for efficiency<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n\r\n\r\n    <!-- =====================================================\r\n         RIGHT VISUAL\r\n    ====================================================== -->\r\n\r\n    <div class=\"fkh3-visual\">\r\n\r\n\r\n      <!-- Orbit -->\r\n      <div class=\"fkh3-orbit\">\r\n\r\n        <span class=\"fkh3-orbit-dot fkh3-orbit-dot-one\"><\/span>\r\n        <span class=\"fkh3-orbit-dot fkh3-orbit-dot-two\"><\/span>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n      <!-- Main Glow Mesh -->\r\n      <div class=\"fkh3-mesh\"><\/div>\r\n\r\n\r\n\r\n      <!-- =====================================================\r\n           DASHBOARD CARD\r\n      ====================================================== -->\r\n\r\n      <div class=\"fkh3-dashboard\">\r\n\r\n\r\n        <!-- Browser Header -->\r\n        <div class=\"fkh3-dashboard-top\">\r\n\r\n          <div class=\"fkh3-window-controls\">\r\n\r\n            <span><\/span>\r\n            <span><\/span>\r\n            <span><\/span>\r\n\r\n          <\/div>\r\n\r\n\r\n          <div class=\"fkh3-dashboard-name\">\r\n\r\n            <span class=\"fkh3-dashboard-logo\">\r\n              F\r\n            <\/span>\r\n\r\n            Flashklik Workspace\r\n\r\n          <\/div>\r\n\r\n\r\n          <div class=\"fkh3-dashboard-avatar\">\r\n            FK\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n\r\n        <!-- Dashboard Body -->\r\n        <div class=\"fkh3-dashboard-body\">\r\n\r\n\r\n          <!-- Sidebar -->\r\n          <div class=\"fkh3-sidebar\">\r\n\r\n            <span class=\"active\"><\/span>\r\n            <span><\/span>\r\n            <span><\/span>\r\n            <span><\/span>\r\n            <span><\/span>\r\n\r\n            <i><\/i>\r\n\r\n            <span><\/span>\r\n\r\n          <\/div>\r\n\r\n\r\n\r\n          <!-- Dashboard Main -->\r\n          <div class=\"fkh3-dashboard-main\">\r\n\r\n\r\n            <div class=\"fkh3-dashboard-heading\">\r\n\r\n              <div>\r\n\r\n                <span>BUSINESS OVERVIEW<\/span>\r\n\r\n                <strong>\r\n                  Good morning.\r\n                <\/strong>\r\n\r\n              <\/div>\r\n\r\n\r\n              <div class=\"fkh3-live\">\r\n\r\n                <i><\/i>\r\n\r\n                LIVE\r\n\r\n              <\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n\r\n            <!-- KPI Row -->\r\n            <div class=\"fkh3-kpis\">\r\n\r\n\r\n              <div class=\"fkh3-kpi\">\r\n\r\n                <span>Productivity<\/span>\r\n\r\n                <strong>\r\n                  84<span>%<\/span>\r\n                <\/strong>\r\n\r\n                <small class=\"up\">\r\n                  \u2197 Better\r\n                <\/small>\r\n\r\n              <\/div>\r\n\r\n\r\n              <div class=\"fkh3-kpi\">\r\n\r\n                <span>Operations<\/span>\r\n\r\n                <strong>\r\n                  24<span>\/7<\/span>\r\n                <\/strong>\r\n\r\n                <small>\r\n                  Connected\r\n                <\/small>\r\n\r\n              <\/div>\r\n\r\n\r\n              <div class=\"fkh3-kpi\">\r\n\r\n                <span>Efficiency<\/span>\r\n\r\n                <strong>\r\n                  +<span class=\"big\">Smart<\/span>\r\n                <\/strong>\r\n\r\n                <small class=\"up\">\r\n                  Optimized\r\n                <\/small>\r\n\r\n              <\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n\r\n            <!-- Chart -->\r\n            <div class=\"fkh3-chart-card\">\r\n\r\n\r\n              <div class=\"fkh3-chart-header\">\r\n\r\n                <div>\r\n\r\n                  <span>PERFORMANCE<\/span>\r\n                  <strong>Business Growth<\/strong>\r\n\r\n                <\/div>\r\n\r\n\r\n                <div class=\"fkh3-chart-period\">\r\n                  This Month\r\n                <\/div>\r\n\r\n              <\/div>\r\n\r\n\r\n\r\n              <div class=\"fkh3-chart\">\r\n\r\n\r\n                <div class=\"fkh3-chart-lines\">\r\n\r\n                  <span><\/span>\r\n                  <span><\/span>\r\n                  <span><\/span>\r\n                  <span><\/span>\r\n\r\n                <\/div>\r\n\r\n\r\n                <svg\r\n                  viewBox=\"0 0 500 160\"\r\n                  preserveAspectRatio=\"none\"\r\n                  class=\"fkh3-line-chart\"\r\n                >\r\n\r\n                  <defs>\r\n\r\n                    <linearGradient\r\n                      id=\"fkh3ChartGradient\"\r\n                      x1=\"0\"\r\n                      x2=\"1\"\r\n                    >\r\n\r\n                      <stop\r\n                        offset=\"0%\"\r\n                        stop-color=\"#24ccff\"\r\n                      \/>\r\n\r\n                      <stop\r\n                        offset=\"50%\"\r\n                        stop-color=\"#7553ff\"\r\n                      \/>\r\n\r\n                      <stop\r\n                        offset=\"100%\"\r\n                        stop-color=\"#ff3f8c\"\r\n                      \/>\r\n\r\n                    <\/linearGradient>\r\n\r\n\r\n                    <linearGradient\r\n                      id=\"fkh3ChartFill\"\r\n                      x1=\"0\"\r\n                      y1=\"0\"\r\n                      x2=\"0\"\r\n                      y2=\"1\"\r\n                    >\r\n\r\n                      <stop\r\n                        offset=\"0%\"\r\n                        stop-color=\"#6257ff\"\r\n                        stop-opacity=\".30\"\r\n                      \/>\r\n\r\n                      <stop\r\n                        offset=\"100%\"\r\n                        stop-color=\"#6257ff\"\r\n                        stop-opacity=\"0\"\r\n                      \/>\r\n\r\n                    <\/linearGradient>\r\n\r\n                  <\/defs>\r\n\r\n\r\n                  <!-- Area -->\r\n                  <path\r\n                    class=\"fkh3-chart-area\"\r\n                    d=\"\r\n                      M0 135\r\n                      C40 128, 62 115, 91 118\r\n                      C126 122, 139 85, 173 93\r\n                      C210 102, 226 64, 263 70\r\n                      C302 76, 310 45, 347 52\r\n                      C390 59, 408 23, 500 24\r\n                      L500 160\r\n                      L0 160\r\n                      Z\r\n                    \"\r\n                  ><\/path>\r\n\r\n\r\n                  <!-- Line -->\r\n                  <path\r\n                    class=\"fkh3-chart-path\"\r\n                    d=\"\r\n                      M0 135\r\n                      C40 128, 62 115, 91 118\r\n                      C126 122, 139 85, 173 93\r\n                      C210 102, 226 64, 263 70\r\n                      C302 76, 310 45, 347 52\r\n                      C390 59, 408 23, 500 24\r\n                    \"\r\n                  ><\/path>\r\n\r\n                <\/svg>\r\n\r\n\r\n                <!-- Current point -->\r\n                <span class=\"fkh3-chart-point\"><\/span>\r\n\r\n              <\/div>\r\n\r\n            <\/div>\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n\r\n      <!-- =====================================================\r\n           SMARTPHONE\r\n      ====================================================== -->\r\n\r\n      <div class=\"fkh3-phone\">\r\n\r\n        <!-- Physical side buttons -->\r\n        <div class=\"fkh3-phone-side-button fkh3-phone-side-button-one\"><\/div>\r\n        <div class=\"fkh3-phone-side-button fkh3-phone-side-button-two\"><\/div>\r\n\r\n        <div class=\"fkh3-phone-screen\">\r\n\r\n          <!-- Dynamic island \/ notch -->\r\n          <div class=\"fkh3-phone-notch\"><\/div>\r\n\r\n          <!-- =================================================\r\n               GANTI URL GAMBAR DI BAWAH INI DENGAN IMAGE KAMU\r\n               ================================================= -->\r\n          <img decoding=\"async\"\r\n            src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/08\/Splash-Screen-2.png\"\r\n            alt=\"Flashklik Mobile App\"\r\n            class=\"fkh3-phone-screen-image\"\r\n           title=\"Home\">\r\n\r\n          <!-- Subtle glossy reflection -->\r\n          <div class=\"fkh3-phone-screen-shine\"><\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n      <!-- =====================================================\r\n           FLOATING CARD 01\r\n      ====================================================== -->\r\n\r\n      <div class=\"fkh3-float-card fkh3-float-one\">\r\n\r\n        <div class=\"fkh3-float-icon cyan\">\r\n\r\n          <svg viewBox=\"0 0 24 24\"\r\n               fill=\"none\"\r\n               stroke=\"currentColor\"\r\n               stroke-width=\"2\">\r\n\r\n            <path d=\"M3 3v18h18\"><\/path>\r\n            <path d=\"m7 16 4-5 4 3 5-7\"><\/path>\r\n\r\n          <\/svg>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div>\r\n\r\n          <span>Performance<\/span>\r\n\r\n          <strong>\r\n            Smarter Insights\r\n          <\/strong>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n\r\n      <!-- =====================================================\r\n           FLOATING CARD 02\r\n      ====================================================== -->\r\n\r\n      <div class=\"fkh3-float-card fkh3-float-two\">\r\n\r\n        <div class=\"fkh3-float-icon pink\">\r\n\r\n          <svg viewBox=\"0 0 24 24\"\r\n               fill=\"none\"\r\n               stroke=\"currentColor\"\r\n               stroke-width=\"2\">\r\n\r\n            <circle cx=\"12\" cy=\"12\" r=\"9\"><\/circle>\r\n\r\n            <path d=\"m8 12 2.5 2.5L16 9\"><\/path>\r\n\r\n          <\/svg>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div>\r\n\r\n          <span>Business Operations<\/span>\r\n\r\n          <strong>\r\n            Connected & Simple\r\n          <\/strong>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n\r\n\r\n\r\n      <!-- Decorative dots -->\r\n      <span class=\"fkh3-dot fkh3-dot-one\"><\/span>\r\n      <span class=\"fkh3-dot fkh3-dot-two\"><\/span>\r\n      <span class=\"fkh3-dot fkh3-dot-three\"><\/span>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n\r\n\r\n  <!-- Bottom Fade -->\r\n  <div class=\"fkh3-bottom-fade\"><\/div>\r\n\r\n<\/section>\r\n\r\n\r\n\r\n\r\n\r\n<style>\r\n\r\n\/* =========================================================\r\n   ROOT HERO\r\n========================================================= *\/\r\n\r\n.fkh3-hero {\r\n\r\n  --fkh3-bg: #040406;\r\n\r\n  --fkh3-blue: #2453ff;\r\n  --fkh3-cyan: #20cfff;\r\n  --fkh3-purple: #843cff;\r\n  --fkh3-pink: #ff287f;\r\n\r\n  --fkh3-white: #ffffff;\r\n\r\n  --fkh3-muted:\r\n    rgba(255,255,255,.58);\r\n\r\n  --fkh3-border:\r\n    rgba(255,255,255,.09);\r\n\r\n\r\n  position: relative;\r\n\r\n  width: 100%;\r\n\r\n  min-height: 820px;\r\n\r\n  display: flex;\r\n\r\n  align-items: center;\r\n\r\n  overflow: hidden;\r\n\r\n  isolation: isolate;\r\n\r\n  color: white;\r\n\r\n  font-family:\r\n    'Ubuntu',\r\n    sans-serif;\r\n\r\n\r\n  background:\r\n\r\n    radial-gradient(\r\n      circle at 74% 42%,\r\n      rgba(78, 40, 255, .17),\r\n      transparent 28%\r\n    ),\r\n\r\n    radial-gradient(\r\n      circle at 93% 58%,\r\n      rgba(255, 22, 113, .09),\r\n      transparent 27%\r\n    ),\r\n\r\n    radial-gradient(\r\n      circle at 5% 45%,\r\n      rgba(15, 160, 255, .065),\r\n      transparent 28%\r\n    ),\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      #030304 0%,\r\n      #07070c 52%,\r\n      #040306 100%\r\n    );\r\n\r\n}\r\n\r\n\r\n.fkh3-hero,\r\n.fkh3-hero * {\r\n\r\n  box-sizing:\r\n    border-box;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   BACKGROUND GRID\r\n========================================================= *\/\r\n\r\n.fkh3-hero::before {\r\n\r\n  content: \"\";\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    0;\r\n\r\n  z-index:\r\n    -5;\r\n\r\n  opacity:\r\n    .36;\r\n\r\n\r\n  background-image:\r\n\r\n    linear-gradient(\r\n      rgba(255,255,255,.028) 1px,\r\n      transparent 1px\r\n    ),\r\n\r\n    linear-gradient(\r\n      90deg,\r\n      rgba(255,255,255,.028) 1px,\r\n      transparent 1px\r\n    );\r\n\r\n\r\n  background-size:\r\n    72px 72px;\r\n\r\n\r\n  -webkit-mask-image:\r\n\r\n    radial-gradient(\r\n      ellipse at center,\r\n      black,\r\n      transparent 75%\r\n    );\r\n\r\n\r\n  mask-image:\r\n\r\n    radial-gradient(\r\n      ellipse at center,\r\n      black,\r\n      transparent 75%\r\n    );\r\n\r\n}\r\n\r\n\r\n\r\n\/* Fine noise-like overlay *\/\r\n\r\n.fkh3-hero::after {\r\n\r\n  content: \"\";\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    0;\r\n\r\n  z-index:\r\n    -4;\r\n\r\n  pointer-events:\r\n    none;\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      120deg,\r\n      transparent 0%,\r\n      rgba(255,255,255,.012) 40%,\r\n      transparent 70%\r\n    );\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   AMBIENT\r\n========================================================= *\/\r\n\r\n.fkh3-ambient {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  filter:\r\n    blur(120px);\r\n\r\n  pointer-events:\r\n    none;\r\n\r\n  z-index:\r\n    -2;\r\n\r\n}\r\n\r\n\r\n.fkh3-ambient-blue {\r\n\r\n  width:\r\n    530px;\r\n\r\n  height:\r\n    530px;\r\n\r\n  right:\r\n    15%;\r\n\r\n  top:\r\n    13%;\r\n\r\n  background:\r\n    rgba(48, 47, 255, .13);\r\n\r\n}\r\n\r\n\r\n.fkh3-ambient-pink {\r\n\r\n  width:\r\n    430px;\r\n\r\n  height:\r\n    430px;\r\n\r\n  right:\r\n    -180px;\r\n\r\n  top:\r\n    28%;\r\n\r\n  background:\r\n    rgba(255, 20, 115, .11);\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   CONTAINER\r\n========================================================= *\/\r\n\r\n.fkh3-container {\r\n\r\n  position:\r\n    relative;\r\n\r\n  z-index:\r\n    5;\r\n\r\n  width:\r\n    min(\r\n      1320px,\r\n      calc(100% - 70px)\r\n    );\r\n\r\n  margin:\r\n    0 auto;\r\n\r\n  display:\r\n    grid;\r\n\r\n  grid-template-columns:\r\n    minmax(0, .95fr)\r\n    minmax(540px, 1.05fr);\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    72px;\r\n\r\n  padding:\r\n    110px 0 80px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   CONTENT\r\n========================================================= *\/\r\n\r\n.fkh3-content {\r\n\r\n  position:\r\n    relative;\r\n\r\n  z-index:\r\n    15;\r\n\r\n  max-width:\r\n    670px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   EYEBROW\r\n========================================================= *\/\r\n\r\n.fkh3-eyebrow {\r\n\r\n  width:\r\n    fit-content;\r\n\r\n  min-height:\r\n    42px;\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    10px;\r\n\r\n  margin-bottom:\r\n    27px;\r\n\r\n  padding:\r\n    6px 7px;\r\n\r\n  padding-right:\r\n    13px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.09);\r\n\r\n  border-radius:\r\n    999px;\r\n\r\n  background:\r\n    rgba(255,255,255,.04);\r\n\r\n  backdrop-filter:\r\n    blur(14px);\r\n\r\n  -webkit-backdrop-filter:\r\n    blur(14px);\r\n\r\n  box-shadow:\r\n    inset 0 1px 0\r\n    rgba(255,255,255,.07);\r\n\r\n}\r\n\r\n\r\n.fkh3-eyebrow-icon {\r\n\r\n  width:\r\n    29px;\r\n\r\n  height:\r\n    29px;\r\n\r\n  flex:\r\n    0 0 29px;\r\n\r\n  display:\r\n    grid;\r\n\r\n  place-items:\r\n    center;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  color:\r\n    white;\r\n\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      #17bdf6,\r\n      #3158ff 50%,\r\n      #8d3fff\r\n    );\r\n\r\n\r\n  box-shadow:\r\n    0 0 21px\r\n    rgba(32, 187, 255, .3);\r\n\r\n}\r\n\r\n\r\n.fkh3-eyebrow-icon svg {\r\n\r\n  width:\r\n    14px;\r\n\r\n  height:\r\n    14px;\r\n\r\n}\r\n\r\n\r\n.fkh3-eyebrow > span:nth-child(2) {\r\n\r\n  font-size:\r\n    11px;\r\n\r\n  font-weight:\r\n    700;\r\n\r\n  letter-spacing:\r\n    .075em;\r\n\r\n  color:\r\n    rgba(255,255,255,.83);\r\n\r\n}\r\n\r\n\r\n.fkh3-eyebrow-live {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    6px;\r\n\r\n  margin-left:\r\n    3px;\r\n\r\n  padding:\r\n    6px 9px;\r\n\r\n  border-radius:\r\n    999px;\r\n\r\n  color:\r\n    rgba(255,255,255,.42);\r\n\r\n  background:\r\n    rgba(255,255,255,.045);\r\n\r\n  font-size:\r\n    8px;\r\n\r\n  font-weight:\r\n    600;\r\n\r\n  letter-spacing:\r\n    .06em;\r\n\r\n}\r\n\r\n\r\n.fkh3-eyebrow-live i {\r\n\r\n  width:\r\n    5px;\r\n\r\n  height:\r\n    5px;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  background:\r\n    #37ddff;\r\n\r\n  box-shadow:\r\n    0 0 10px\r\n    #37ddff;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   TITLE\r\n========================================================= *\/\r\n\r\n.fkh3-title {\r\n\r\n  max-width:\r\n    760px;\r\n\r\n  margin:\r\n    0;\r\n\r\n  color:\r\n    white;\r\n\r\n  font-family:\r\n    'Roboto Condensed',\r\n    sans-serif;\r\n\r\n  font-size:\r\n    clamp(\r\n      58px,\r\n      5.3vw,\r\n      82px\r\n    );\r\n\r\n  font-weight:\r\n    700;\r\n\r\n  line-height:\r\n    .96;\r\n\r\n  letter-spacing:\r\n    -.035em;\r\n\r\n  text-transform:\r\n    uppercase;\r\n\r\n}\r\n\r\n\r\n.fkh3-title-soft {\r\n\r\n  color:\r\n    transparent;\r\n\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      95deg,\r\n      #ffffff 0%,\r\n      #bbd7ff 38%,\r\n      #7c98ff 100%\r\n    );\r\n\r\n\r\n  -webkit-background-clip:\r\n    text;\r\n\r\n  background-clip:\r\n    text;\r\n\r\n}\r\n\r\n\r\n.fkh3-title-second {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-top:\r\n    9px;\r\n\r\n}\r\n\r\n\r\n.fkh3-efficiency {\r\n\r\n  position:\r\n    relative;\r\n\r\n  display:\r\n    inline-block;\r\n\r\n  z-index:\r\n    2;\r\n\r\n  color:\r\n    transparent;\r\n\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      95deg,\r\n      #49d5ff 0%,\r\n      #748cff 30%,\r\n      #ba65ff 62%,\r\n      #ff5b9f 100%\r\n    );\r\n\r\n\r\n  -webkit-background-clip:\r\n    text;\r\n\r\n  background-clip:\r\n    text;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   HAND DRAWN RING\r\n========================================================= *\/\r\n\r\n.fkh3-ring {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  z-index:\r\n    -1;\r\n\r\n  width:\r\n    108%;\r\n\r\n  height:\r\n    128%;\r\n\r\n  left:\r\n    -4%;\r\n\r\n  top:\r\n    -10%;\r\n\r\n  overflow:\r\n    visible;\r\n\r\n  pointer-events:\r\n    none;\r\n\r\n}\r\n\r\n\r\n.fkh3-ring path {\r\n\r\n  fill:\r\n    none;\r\n\r\n  stroke:\r\n    #25c8fa;\r\n\r\n  stroke-width:\r\n    5;\r\n\r\n  stroke-linecap:\r\n    round;\r\n\r\n  stroke-dasharray:\r\n    1200;\r\n\r\n  stroke-dashoffset:\r\n    1200;\r\n\r\n  opacity:\r\n    .78;\r\n\r\n\r\n  filter:\r\n    drop-shadow(\r\n      0 0 8px\r\n      rgba(37, 200, 250, .26)\r\n    );\r\n\r\n\r\n  animation:\r\n    fkh3DrawRing\r\n    1.8s ease\r\n    .45s forwards;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   DESCRIPTION\r\n========================================================= *\/\r\n\r\n.fkh3-description {\r\n\r\n  max-width:\r\n    600px;\r\n\r\n  margin:\r\n    28px 0 0;\r\n\r\n  color:\r\n    var(--fkh3-muted);\r\n\r\n  font-size:\r\n    16px;\r\n\r\n  font-weight:\r\n    400;\r\n\r\n  line-height:\r\n    1.75;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   ACTIONS\r\n========================================================= *\/\r\n\r\n.fkh3-actions {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  flex-wrap:\r\n    wrap;\r\n\r\n  gap:\r\n    13px;\r\n\r\n  margin-top:\r\n    32px;\r\n\r\n}\r\n\r\n\r\n.fkh3-btn,\r\n.fkh3-btn:hover,\r\n.fkh3-btn:focus,\r\n.fkh3-btn:active {\r\n\r\n  min-height:\r\n    54px;\r\n\r\n  display:\r\n    inline-flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  justify-content:\r\n    center;\r\n\r\n  gap:\r\n    10px;\r\n\r\n  padding:\r\n    0 23px;\r\n\r\n  border:\r\n    1px solid\r\n    transparent;\r\n\r\n  border-radius:\r\n    14px;\r\n\r\n  font-size:\r\n    14px;\r\n\r\n  font-weight:\r\n    700;\r\n\r\n  line-height:\r\n    1;\r\n\r\n  text-decoration:\r\n    none !important;\r\n\r\n  transition:\r\n\r\n    transform .3s ease,\r\n\r\n    background .3s ease,\r\n\r\n    border-color .3s ease,\r\n\r\n    box-shadow .3s ease;\r\n\r\n}\r\n\r\n\r\n.fkh3-btn > svg {\r\n\r\n  width:\r\n    17px;\r\n\r\n  height:\r\n    17px;\r\n\r\n  transition:\r\n    transform .3s ease;\r\n\r\n}\r\n\r\n\r\n.fkh3-btn:hover > svg {\r\n\r\n  transform:\r\n    translateX(4px);\r\n\r\n}\r\n\r\n\r\n\r\n.fkh3-btn-primary {\r\n\r\n  color:\r\n    #fff;\r\n\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      #16bce9 0%,\r\n      #315aff 47%,\r\n      #783cff 100%\r\n    );\r\n\r\n\r\n  box-shadow:\r\n\r\n    0 15px 38px\r\n    rgba(42, 88, 255, .24),\r\n\r\n    inset\r\n    0 1px 0\r\n    rgba(255,255,255,.3);\r\n\r\n}\r\n\r\n\r\n.fkh3-btn-primary:hover {\r\n\r\n  color:\r\n    white;\r\n\r\n  transform:\r\n    translateY(-3px);\r\n\r\n  box-shadow:\r\n\r\n    0 22px 45px\r\n    rgba(42, 88, 255, .34),\r\n\r\n    inset\r\n    0 1px 0\r\n    rgba(255,255,255,.34);\r\n\r\n}\r\n\r\n\r\n\r\n.fkh3-btn-secondary {\r\n\r\n  color:\r\n    rgba(255,255,255,.83);\r\n\r\n  border-color:\r\n    rgba(255,255,255,.12);\r\n\r\n  background:\r\n    rgba(255,255,255,.045);\r\n\r\n  backdrop-filter:\r\n    blur(12px);\r\n\r\n}\r\n\r\n\r\n.fkh3-btn-secondary:hover {\r\n\r\n  color:\r\n    #fff;\r\n\r\n  border-color:\r\n    rgba(255,255,255,.25);\r\n\r\n  background:\r\n    rgba(255,255,255,.075);\r\n\r\n  transform:\r\n    translateY(-3px);\r\n\r\n}\r\n\r\n\r\n.fkh3-btn-contact-icon {\r\n\r\n  width:\r\n    25px;\r\n\r\n  height:\r\n    25px;\r\n\r\n  display:\r\n    grid;\r\n\r\n  place-items:\r\n    center;\r\n\r\n  border-radius:\r\n    8px;\r\n\r\n  color:\r\n    #61d9ff;\r\n\r\n  background:\r\n    rgba(38, 196, 255, .09);\r\n\r\n}\r\n\r\n\r\n.fkh3-btn-contact-icon svg {\r\n\r\n  width:\r\n    13px;\r\n\r\n  height:\r\n    13px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   INFO ROW\r\n========================================================= *\/\r\n\r\n.fkh3-info-row {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    18px;\r\n\r\n  margin-top:\r\n    43px;\r\n\r\n}\r\n\r\n\r\n.fkh3-stat {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    10px;\r\n\r\n}\r\n\r\n\r\n.fkh3-stat-number {\r\n\r\n  font-family:\r\n    'Roboto Condensed',\r\n    sans-serif;\r\n\r\n  font-size:\r\n    39px;\r\n\r\n  font-weight:\r\n    700;\r\n\r\n  line-height:\r\n    1;\r\n\r\n  letter-spacing:\r\n    -.03em;\r\n\r\n}\r\n\r\n\r\n.fkh3-stat-number span {\r\n\r\n  color:\r\n    #36cfff;\r\n\r\n}\r\n\r\n\r\n.fkh3-stat-copy strong,\r\n.fkh3-mini-info strong {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-bottom:\r\n    4px;\r\n\r\n  color:\r\n    rgba(255,255,255,.84);\r\n\r\n  font-size:\r\n    11px;\r\n\r\n  line-height:\r\n    1.1;\r\n\r\n}\r\n\r\n\r\n.fkh3-stat-copy span,\r\n.fkh3-mini-info span {\r\n\r\n  display:\r\n    block;\r\n\r\n  color:\r\n    rgba(255,255,255,.32);\r\n\r\n  font-size:\r\n    9px;\r\n\r\n  line-height:\r\n    1.15;\r\n\r\n}\r\n\r\n\r\n.fkh3-info-divider {\r\n\r\n  width:\r\n    1px;\r\n\r\n  height:\r\n    37px;\r\n\r\n  background:\r\n    rgba(255,255,255,.09);\r\n\r\n}\r\n\r\n\r\n.fkh3-mini-info {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    9px;\r\n\r\n}\r\n\r\n\r\n.fkh3-mini-icon {\r\n\r\n  width:\r\n    35px;\r\n\r\n  height:\r\n    35px;\r\n\r\n  flex:\r\n    0 0 35px;\r\n\r\n  display:\r\n    grid;\r\n\r\n  place-items:\r\n    center;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.07);\r\n\r\n  border-radius:\r\n    11px;\r\n\r\n  color:\r\n    #72dfff;\r\n\r\n  background:\r\n    rgba(255,255,255,.035);\r\n\r\n}\r\n\r\n\r\n.fkh3-mini-icon svg {\r\n\r\n  width:\r\n    16px;\r\n\r\n  height:\r\n    16px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   VISUAL AREA\r\n========================================================= *\/\r\n\r\n.fkh3-visual {\r\n\r\n  position:\r\n    relative;\r\n\r\n  min-height:\r\n    640px;\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  justify-content:\r\n    center;\r\n\r\n  perspective:\r\n    1300px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   ORBIT\r\n========================================================= *\/\r\n\r\n.fkh3-orbit {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  width:\r\n    570px;\r\n\r\n  height:\r\n    570px;\r\n\r\n  left:\r\n    50%;\r\n\r\n  top:\r\n    50%;\r\n\r\n  transform:\r\n    translate(-50%, -50%);\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.07);\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n}\r\n\r\n\r\n.fkh3-orbit::before {\r\n\r\n  content:\r\n    \"\";\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    47px;\r\n\r\n  border:\r\n    1px dashed\r\n    rgba(255,255,255,.095);\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  animation:\r\n    fkh3Orbit\r\n    28s linear\r\n    infinite;\r\n\r\n}\r\n\r\n\r\n.fkh3-orbit::after {\r\n\r\n  content:\r\n    \"\";\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    112px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(81, 89, 255, .12);\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n}\r\n\r\n\r\n.fkh3-orbit-dot {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  width:\r\n    9px;\r\n\r\n  height:\r\n    9px;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n}\r\n\r\n\r\n.fkh3-orbit-dot-one {\r\n\r\n  top:\r\n    70px;\r\n\r\n  left:\r\n    89px;\r\n\r\n  background:\r\n    #31cfff;\r\n\r\n  box-shadow:\r\n    0 0 20px\r\n    #31cfff;\r\n\r\n}\r\n\r\n\r\n.fkh3-orbit-dot-two {\r\n\r\n  right:\r\n    68px;\r\n\r\n  bottom:\r\n    95px;\r\n\r\n  background:\r\n    #ff3d8a;\r\n\r\n  box-shadow:\r\n    0 0 20px\r\n    #ff3d8a;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   MESH\r\n========================================================= *\/\r\n\r\n.fkh3-mesh {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  width:\r\n    500px;\r\n\r\n  height:\r\n    470px;\r\n\r\n  left:\r\n    50%;\r\n\r\n  top:\r\n    50%;\r\n\r\n  transform:\r\n    translate(-50%,-50%)\r\n    rotate(-6deg);\r\n\r\n  overflow:\r\n    hidden;\r\n\r\n  border-radius:\r\n    43% 57% 62% 38%\r\n    \/\r\n    42% 45% 55% 58%;\r\n\r\n\r\n  background:\r\n\r\n    radial-gradient(\r\n      circle at 24% 30%,\r\n      #1547ff,\r\n      transparent 37%\r\n    ),\r\n\r\n    radial-gradient(\r\n      circle at 76% 27%,\r\n      #bb1eff,\r\n      transparent 41%\r\n    ),\r\n\r\n    radial-gradient(\r\n      circle at 72% 80%,\r\n      #ff187e,\r\n      transparent 40%\r\n    ),\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      #144dff,\r\n      #7932ff 52%,\r\n      #ff217e\r\n    );\r\n\r\n\r\n  box-shadow:\r\n\r\n    0 0 100px\r\n    rgba(43, 66, 255, .19),\r\n\r\n    0 0 100px\r\n    rgba(255, 23, 126, .15);\r\n\r\n\r\n  opacity:\r\n    .52;\r\n\r\n  animation:\r\n    fkh3Mesh\r\n    8s ease-in-out\r\n    infinite;\r\n\r\n}\r\n\r\n\r\n.fkh3-mesh::before {\r\n\r\n  content:\r\n    \"\";\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    -30%;\r\n\r\n  opacity:\r\n    .26;\r\n\r\n\r\n  background-image:\r\n\r\n    linear-gradient(\r\n      rgba(255,255,255,.5) 1px,\r\n      transparent 1px\r\n    ),\r\n\r\n    linear-gradient(\r\n      90deg,\r\n      rgba(255,255,255,.5) 1px,\r\n      transparent 1px\r\n    );\r\n\r\n\r\n  background-size:\r\n    25px 25px;\r\n\r\n\r\n  transform:\r\n\r\n    perspective(520px)\r\n    rotateX(62deg)\r\n    rotateZ(-14deg);\r\n\r\n\r\n  mask-image:\r\n    radial-gradient(\r\n      circle,\r\n      black,\r\n      transparent 70%\r\n    );\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   DASHBOARD\r\n========================================================= *\/\r\n\r\n.fkh3-dashboard {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  z-index:\r\n    4;\r\n\r\n  width:\r\n    505px;\r\n\r\n  height:\r\n    385px;\r\n\r\n  left:\r\n    50%;\r\n\r\n  top:\r\n    48%;\r\n\r\n  overflow:\r\n    hidden;\r\n\r\n  transform:\r\n\r\n    translate(-50%,-50%)\r\n    rotateY(-8deg)\r\n    rotateX(3deg)\r\n    rotateZ(-2deg);\r\n\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.12);\r\n\r\n  border-radius:\r\n    23px;\r\n\r\n\r\n  background:\r\n    rgba(8,9,16,.92);\r\n\r\n\r\n  backdrop-filter:\r\n    blur(20px);\r\n\r\n\r\n  box-shadow:\r\n\r\n    0 50px 100px\r\n    rgba(0,0,0,.55),\r\n\r\n    0 0 60px\r\n    rgba(71, 60, 255, .13),\r\n\r\n    inset\r\n    0 1px 0\r\n    rgba(255,255,255,.10);\r\n\r\n\r\n  animation:\r\n    fkh3DashboardFloat\r\n    7s ease-in-out\r\n    infinite;\r\n\r\n}\r\n\r\n\r\n\r\n\/* Dashboard Top *\/\r\n\r\n.fkh3-dashboard-top {\r\n\r\n  height:\r\n    49px;\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  justify-content:\r\n    space-between;\r\n\r\n  padding:\r\n    0 15px;\r\n\r\n  border-bottom:\r\n    1px solid\r\n    rgba(255,255,255,.065);\r\n\r\n  background:\r\n    rgba(255,255,255,.025);\r\n\r\n}\r\n\r\n\r\n.fkh3-window-controls {\r\n\r\n  display:\r\n    flex;\r\n\r\n  gap:\r\n    5px;\r\n\r\n}\r\n\r\n\r\n.fkh3-window-controls span {\r\n\r\n  width:\r\n    6px;\r\n\r\n  height:\r\n    6px;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  background:\r\n    rgba(255,255,255,.18);\r\n\r\n}\r\n\r\n\r\n.fkh3-dashboard-name {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    6px;\r\n\r\n  color:\r\n    rgba(255,255,255,.55);\r\n\r\n  font-size:\r\n    8px;\r\n\r\n  font-weight:\r\n    500;\r\n\r\n}\r\n\r\n\r\n.fkh3-dashboard-logo {\r\n\r\n  width:\r\n    18px;\r\n\r\n  height:\r\n    18px;\r\n\r\n  display:\r\n    grid;\r\n\r\n  place-items:\r\n    center;\r\n\r\n  border-radius:\r\n    6px;\r\n\r\n  color:\r\n    white;\r\n\r\n  font-size:\r\n    8px;\r\n\r\n  font-weight:\r\n    700;\r\n\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      #17c8f6,\r\n      #4857ff\r\n    );\r\n\r\n}\r\n\r\n\r\n.fkh3-dashboard-avatar {\r\n\r\n  width:\r\n    24px;\r\n\r\n  height:\r\n    24px;\r\n\r\n  display:\r\n    grid;\r\n\r\n  place-items:\r\n    center;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  color:\r\n    rgba(255,255,255,.65);\r\n\r\n  background:\r\n    rgba(255,255,255,.06);\r\n\r\n  font-size:\r\n    7px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* Dashboard Body *\/\r\n\r\n.fkh3-dashboard-body {\r\n\r\n  height:\r\n    calc(100% - 49px);\r\n\r\n  display:\r\n    flex;\r\n\r\n}\r\n\r\n\r\n\/* Sidebar *\/\r\n\r\n.fkh3-sidebar {\r\n\r\n  width:\r\n    47px;\r\n\r\n  display:\r\n    flex;\r\n\r\n  flex-direction:\r\n    column;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    13px;\r\n\r\n  padding-top:\r\n    21px;\r\n\r\n  border-right:\r\n    1px solid\r\n    rgba(255,255,255,.055);\r\n\r\n}\r\n\r\n\r\n.fkh3-sidebar span {\r\n\r\n  width:\r\n    16px;\r\n\r\n  height:\r\n    16px;\r\n\r\n  border-radius:\r\n    5px;\r\n\r\n  background:\r\n    rgba(255,255,255,.055);\r\n\r\n}\r\n\r\n\r\n.fkh3-sidebar span.active {\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      #20ccff,\r\n      #5253ff\r\n    );\r\n\r\n  box-shadow:\r\n    0 0 12px\r\n    rgba(37, 182, 255, .24);\r\n\r\n}\r\n\r\n\r\n.fkh3-sidebar i {\r\n\r\n  flex:\r\n    1;\r\n\r\n}\r\n\r\n\r\n\r\n\/* Dashboard Main *\/\r\n\r\n.fkh3-dashboard-main {\r\n\r\n  flex:\r\n    1;\r\n\r\n  padding:\r\n    23px 21px;\r\n\r\n}\r\n\r\n\r\n.fkh3-dashboard-heading {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    flex-start;\r\n\r\n  justify-content:\r\n    space-between;\r\n\r\n}\r\n\r\n\r\n.fkh3-dashboard-heading span {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-bottom:\r\n    5px;\r\n\r\n  color:\r\n    rgba(255,255,255,.27);\r\n\r\n  font-size:\r\n    6px;\r\n\r\n  letter-spacing:\r\n    .12em;\r\n\r\n}\r\n\r\n\r\n.fkh3-dashboard-heading strong {\r\n\r\n  font-size:\r\n    16px;\r\n\r\n  line-height:\r\n    1;\r\n\r\n}\r\n\r\n\r\n.fkh3-live {\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    4px;\r\n\r\n  padding:\r\n    5px 7px;\r\n\r\n  border-radius:\r\n    999px;\r\n\r\n  color:\r\n    rgba(255,255,255,.45);\r\n\r\n  background:\r\n    rgba(255,255,255,.035);\r\n\r\n  font-size:\r\n    6px;\r\n\r\n}\r\n\r\n\r\n.fkh3-live i {\r\n\r\n  width:\r\n    4px;\r\n\r\n  height:\r\n    4px;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  background:\r\n    #48e4ff;\r\n\r\n  box-shadow:\r\n    0 0 8px\r\n    #48e4ff;\r\n\r\n}\r\n\r\n\r\n\r\n\/* KPI *\/\r\n\r\n.fkh3-kpis {\r\n\r\n  display:\r\n    grid;\r\n\r\n  grid-template-columns:\r\n    repeat(3,1fr);\r\n\r\n  gap:\r\n    9px;\r\n\r\n  margin-top:\r\n    19px;\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi {\r\n\r\n  min-height:\r\n    76px;\r\n\r\n  padding:\r\n    10px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.055);\r\n\r\n  border-radius:\r\n    11px;\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      135deg,\r\n      rgba(255,255,255,.045),\r\n      rgba(255,255,255,.015)\r\n    );\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi > span {\r\n\r\n  display:\r\n    block;\r\n\r\n  color:\r\n    rgba(255,255,255,.3);\r\n\r\n  font-size:\r\n    6px;\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi strong {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-top:\r\n    7px;\r\n\r\n  font-size:\r\n    18px;\r\n\r\n  line-height:\r\n    1;\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi strong span {\r\n\r\n  color:\r\n    #55dfff;\r\n\r\n  font-size:\r\n    10px;\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi strong .big {\r\n\r\n  font-size:\r\n    12px;\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi small {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-top:\r\n    7px;\r\n\r\n  color:\r\n    rgba(255,255,255,.25);\r\n\r\n  font-size:\r\n    5px;\r\n\r\n}\r\n\r\n\r\n.fkh3-kpi small.up {\r\n\r\n  color:\r\n    #53d9b3;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   CHART\r\n========================================================= *\/\r\n\r\n.fkh3-chart-card {\r\n\r\n  margin-top:\r\n    10px;\r\n\r\n  padding:\r\n    12px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.055);\r\n\r\n  border-radius:\r\n    12px;\r\n\r\n  background:\r\n    rgba(255,255,255,.018);\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-header {\r\n\r\n  display:\r\n    flex;\r\n\r\n  justify-content:\r\n    space-between;\r\n\r\n  align-items:\r\n    center;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-header span {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-bottom:\r\n    3px;\r\n\r\n  color:\r\n    rgba(255,255,255,.23);\r\n\r\n  font-size:\r\n    5px;\r\n\r\n  letter-spacing:\r\n    .1em;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-header strong {\r\n\r\n  display:\r\n    block;\r\n\r\n  font-size:\r\n    9px;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-period {\r\n\r\n  padding:\r\n    5px 7px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.05);\r\n\r\n  border-radius:\r\n    6px;\r\n\r\n  color:\r\n    rgba(255,255,255,.3);\r\n\r\n  font-size:\r\n    5px;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart {\r\n\r\n  position:\r\n    relative;\r\n\r\n  height:\r\n    120px;\r\n\r\n  margin-top:\r\n    10px;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-lines {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    0;\r\n\r\n  display:\r\n    flex;\r\n\r\n  flex-direction:\r\n    column;\r\n\r\n  justify-content:\r\n    space-between;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-lines span {\r\n\r\n  width:\r\n    100%;\r\n\r\n  height:\r\n    1px;\r\n\r\n  background:\r\n    rgba(255,255,255,.035);\r\n\r\n}\r\n\r\n\r\n.fkh3-line-chart {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  inset:\r\n    0;\r\n\r\n  width:\r\n    100%;\r\n\r\n  height:\r\n    100%;\r\n\r\n  overflow:\r\n    visible;\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-area {\r\n\r\n  fill:\r\n    url(#fkh3ChartFill);\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-path {\r\n\r\n  fill:\r\n    none;\r\n\r\n  stroke:\r\n    url(#fkh3ChartGradient);\r\n\r\n  stroke-width:\r\n    4;\r\n\r\n  vector-effect:\r\n    non-scaling-stroke;\r\n\r\n  filter:\r\n    drop-shadow(\r\n      0 0 5px\r\n      rgba(77,100,255,.35)\r\n    );\r\n\r\n}\r\n\r\n\r\n.fkh3-chart-point {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  width:\r\n    7px;\r\n\r\n  height:\r\n    7px;\r\n\r\n  right:\r\n    -1px;\r\n\r\n  top:\r\n    14px;\r\n\r\n  border:\r\n    2px solid\r\n    rgba(255,255,255,.65);\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  background:\r\n    #ff448f;\r\n\r\n  box-shadow:\r\n    0 0 11px\r\n    #ff448f;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   PHONE MOCKUP + REPLACEABLE SCREEN IMAGE\r\n========================================================= *\/\r\n\r\n.fkh3-phone {\r\n\r\n  position: absolute;\r\n\r\n  z-index: 7;\r\n\r\n  width: 184px;\r\n  height: 380px;\r\n\r\n  right: -7px;\r\n  bottom: 39px;\r\n\r\n  padding: 7px;\r\n\r\n  border: 1px solid rgba(255,255,255,.32);\r\n  border-radius: 34px;\r\n\r\n  transform:\r\n    rotate(7deg)\r\n    translateZ(40px);\r\n\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      #d5d7dc 0%,\r\n      #6c7078 6%,\r\n      #272a31 13%,\r\n      #0b0c10 35%,\r\n      #050609 76%,\r\n      #8a8d96 100%\r\n    );\r\n\r\n  box-shadow:\r\n    0 45px 90px rgba(0,0,0,.68),\r\n    0 0 38px rgba(68,70,255,.15),\r\n    0 0 26px rgba(255,38,125,.10),\r\n    inset 0 1px 0 rgba(255,255,255,.34);\r\n\r\n  animation:\r\n    fkh3PhoneFloat\r\n    5.6s ease-in-out\r\n    infinite;\r\n\r\n}\r\n\r\n\r\n\/* Metallic highlight on the body *\/\r\n.fkh3-phone::before {\r\n\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n\r\n  inset: 2px;\r\n\r\n  pointer-events: none;\r\n\r\n  border-radius: 32px;\r\n\r\n  border: 1px solid rgba(255,255,255,.08);\r\n\r\n  box-shadow:\r\n    inset 2px 0 3px rgba(255,255,255,.12),\r\n    inset -2px 0 3px rgba(0,0,0,.35);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SIDE BUTTONS\r\n========================================================= *\/\r\n\r\n.fkh3-phone-side-button {\r\n\r\n  position: absolute;\r\n\r\n  left: -4px;\r\n\r\n  width: 4px;\r\n\r\n  z-index: 10;\r\n\r\n  border-radius: 4px 0 0 4px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      to bottom,\r\n      #9699a1,\r\n      #4c5058 45%,\r\n      #2c2f35\r\n    );\r\n\r\n  box-shadow:\r\n    inset 0 1px 0 rgba(255,255,255,.2),\r\n    -1px 1px 2px rgba(0,0,0,.3);\r\n\r\n}\r\n\r\n.fkh3-phone-side-button-one {\r\n  top: 78px;\r\n  height: 28px;\r\n}\r\n\r\n.fkh3-phone-side-button-two {\r\n  top: 116px;\r\n  height: 46px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SCREEN\r\n========================================================= *\/\r\n\r\n.fkh3-phone-screen {\r\n\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  overflow: hidden;\r\n\r\n  border-radius: 28px;\r\n\r\n  background: #02040a;\r\n\r\n  box-shadow:\r\n    inset 0 0 0 1px rgba(255,255,255,.05),\r\n    inset 0 0 14px rgba(0,0,0,.6);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   DYNAMIC ISLAND \/ NOTCH\r\n========================================================= *\/\r\n\r\n.fkh3-phone-notch {\r\n\r\n  position: absolute;\r\n\r\n  z-index: 8;\r\n\r\n  width: 67px;\r\n  height: 19px;\r\n\r\n  top: 10px;\r\n  left: 50%;\r\n\r\n  transform: translateX(-50%);\r\n\r\n  border-radius: 20px;\r\n\r\n  background: #010205;\r\n\r\n  box-shadow:\r\n    inset 0 1px 1px rgba(255,255,255,.035),\r\n    0 1px 2px rgba(0,0,0,.35);\r\n\r\n}\r\n\r\n\r\n.fkh3-phone-notch::after {\r\n\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n\r\n  width: 4px;\r\n  height: 4px;\r\n\r\n  right: 10px;\r\n  top: 7px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background: #101a27;\r\n\r\n  box-shadow: 0 0 2px rgba(45,110,170,.4);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   USER-REPLACEABLE IMAGE INSIDE PHONE\r\n========================================================= *\/\r\n\r\n.fkh3-phone-screen-image {\r\n\r\n  position: relative;\r\n\r\n  z-index: 2;\r\n\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  object-fit: cover;\r\n  object-position: center top;\r\n\r\n  background: #02040a;\r\n\r\n}\r\n\r\n\r\n\/* Screen reflection so user image still feels inside glass *\/\r\n.fkh3-phone-screen-shine {\r\n\r\n  position: absolute;\r\n\r\n  z-index: 5;\r\n\r\n  inset: 0;\r\n\r\n  pointer-events: none;\r\n\r\n  border-radius: inherit;\r\n\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      rgba(255,255,255,.075) 0%,\r\n      rgba(255,255,255,.018) 16%,\r\n      transparent 34%,\r\n      transparent 72%,\r\n      rgba(255,255,255,.025) 100%\r\n    );\r\n\r\n}\r\n\r\n\/* =========================================================\r\n   FLOATING CARDS\r\n========================================================= *\/\r\n\r\n.fkh3-float-card {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  z-index:\r\n    10;\r\n\r\n  min-width:\r\n    180px;\r\n\r\n  display:\r\n    flex;\r\n\r\n  align-items:\r\n    center;\r\n\r\n  gap:\r\n    10px;\r\n\r\n  padding:\r\n    12px 13px;\r\n\r\n  border:\r\n    1px solid\r\n    rgba(255,255,255,.105);\r\n\r\n  border-radius:\r\n    15px;\r\n\r\n  background:\r\n    rgba(9,10,18,.73);\r\n\r\n  backdrop-filter:\r\n    blur(17px);\r\n\r\n  -webkit-backdrop-filter:\r\n    blur(17px);\r\n\r\n  box-shadow:\r\n\r\n    0 18px 45px\r\n    rgba(0,0,0,.34),\r\n\r\n    inset\r\n    0 1px 0\r\n    rgba(255,255,255,.075);\r\n\r\n}\r\n\r\n\r\n.fkh3-float-one {\r\n\r\n  top:\r\n    97px;\r\n\r\n  left:\r\n    10px;\r\n\r\n  animation:\r\n    fkh3CardFloat\r\n    4.8s ease-in-out\r\n    infinite;\r\n\r\n}\r\n\r\n\r\n.fkh3-float-two {\r\n\r\n  left:\r\n    -16px;\r\n\r\n  bottom:\r\n    95px;\r\n\r\n  animation:\r\n    fkh3CardFloat\r\n    5.1s ease-in-out\r\n    1s infinite;\r\n\r\n}\r\n\r\n\r\n.fkh3-float-icon {\r\n\r\n  width:\r\n    38px;\r\n\r\n  height:\r\n    38px;\r\n\r\n  flex:\r\n    0 0 38px;\r\n\r\n  display:\r\n    grid;\r\n\r\n  place-items:\r\n    center;\r\n\r\n  border-radius:\r\n    11px;\r\n\r\n}\r\n\r\n\r\n.fkh3-float-icon.cyan {\r\n\r\n  color:\r\n    #63dfff;\r\n\r\n  background:\r\n    rgba(31,194,255,.105);\r\n\r\n}\r\n\r\n\r\n.fkh3-float-icon.pink {\r\n\r\n  color:\r\n    #ff72ad;\r\n\r\n  background:\r\n    rgba(255,38,124,.10);\r\n\r\n}\r\n\r\n\r\n.fkh3-float-icon svg {\r\n\r\n  width:\r\n    17px;\r\n\r\n  height:\r\n    17px;\r\n\r\n}\r\n\r\n\r\n.fkh3-float-card span {\r\n\r\n  display:\r\n    block;\r\n\r\n  margin-bottom:\r\n    4px;\r\n\r\n  color:\r\n    rgba(255,255,255,.34);\r\n\r\n  font-size:\r\n    9px;\r\n\r\n}\r\n\r\n\r\n.fkh3-float-card strong {\r\n\r\n  display:\r\n    block;\r\n\r\n  color:\r\n    #fff;\r\n\r\n  font-size:\r\n    12px;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   DECORATIVE DOTS\r\n========================================================= *\/\r\n\r\n.fkh3-dot {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  z-index:\r\n    3;\r\n\r\n  width:\r\n    6px;\r\n\r\n  height:\r\n    6px;\r\n\r\n  border-radius:\r\n    50%;\r\n\r\n  background:\r\n    currentColor;\r\n\r\n  box-shadow:\r\n    0 0 16px\r\n    currentColor;\r\n\r\n}\r\n\r\n\r\n.fkh3-dot-one {\r\n\r\n  top:\r\n    60px;\r\n\r\n  right:\r\n    90px;\r\n\r\n  color:\r\n    #ff3c8a;\r\n\r\n}\r\n\r\n\r\n.fkh3-dot-two {\r\n\r\n  bottom:\r\n    72px;\r\n\r\n  left:\r\n    94px;\r\n\r\n  color:\r\n    #27d2ff;\r\n\r\n}\r\n\r\n\r\n.fkh3-dot-three {\r\n\r\n  top:\r\n    165px;\r\n\r\n  right:\r\n    3px;\r\n\r\n  color:\r\n    #fff;\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   BOTTOM FADE\r\n========================================================= *\/\r\n\r\n.fkh3-bottom-fade {\r\n\r\n  position:\r\n    absolute;\r\n\r\n  z-index:\r\n    2;\r\n\r\n  left:\r\n    0;\r\n\r\n  right:\r\n    0;\r\n\r\n  bottom:\r\n    0;\r\n\r\n  height:\r\n    110px;\r\n\r\n  pointer-events:\r\n    none;\r\n\r\n\r\n  background:\r\n\r\n    linear-gradient(\r\n      to bottom,\r\n      transparent,\r\n      #050507\r\n    );\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   ANIMATION\r\n========================================================= *\/\r\n\r\n@keyframes fkh3DrawRing {\r\n\r\n  to {\r\n\r\n    stroke-dashoffset:\r\n      0;\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n@keyframes fkh3Orbit {\r\n\r\n  from {\r\n\r\n    transform:\r\n      rotate(0deg);\r\n\r\n  }\r\n\r\n  to {\r\n\r\n    transform:\r\n      rotate(360deg);\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n@keyframes fkh3Mesh {\r\n\r\n  0%,\r\n  100% {\r\n\r\n    border-radius:\r\n      43% 57% 62% 38%\r\n      \/\r\n      42% 45% 55% 58%;\r\n\r\n\r\n    transform:\r\n\r\n      translate(-50%,-50%)\r\n      rotate(-6deg)\r\n      scale(1);\r\n\r\n  }\r\n\r\n\r\n  50% {\r\n\r\n    border-radius:\r\n      58% 42% 45% 55%\r\n      \/\r\n      57% 61% 39% 43%;\r\n\r\n\r\n    transform:\r\n\r\n      translate(-50%,-50%)\r\n      rotate(-1deg)\r\n      scale(1.035);\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n@keyframes fkh3DashboardFloat {\r\n\r\n  0%,\r\n  100% {\r\n\r\n    transform:\r\n\r\n      translate(-50%,-50%)\r\n      rotateY(-8deg)\r\n      rotateX(3deg)\r\n      rotateZ(-2deg)\r\n      translateY(0);\r\n\r\n  }\r\n\r\n\r\n  50% {\r\n\r\n    transform:\r\n\r\n      translate(-50%,-50%)\r\n      rotateY(-6deg)\r\n      rotateX(2deg)\r\n      rotateZ(-1deg)\r\n      translateY(-9px);\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n@keyframes fkh3PhoneFloat {\r\n\r\n  0%,\r\n  100% {\r\n\r\n    transform:\r\n      rotate(7deg)\r\n      translateY(0);\r\n\r\n  }\r\n\r\n\r\n  50% {\r\n\r\n    transform:\r\n      rotate(5deg)\r\n      translateY(-13px);\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n@keyframes fkh3CardFloat {\r\n\r\n  0%,\r\n  100% {\r\n\r\n    transform:\r\n      translateY(0);\r\n\r\n  }\r\n\r\n\r\n  50% {\r\n\r\n    transform:\r\n      translateY(-9px);\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   TABLET\r\n========================================================= *\/\r\n\r\n@media (max-width: 1100px) {\r\n\r\n  .fkh3-hero {\r\n\r\n    min-height:\r\n      auto;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-container {\r\n\r\n    width:\r\n      min(\r\n        900px,\r\n        calc(100% - 48px)\r\n      );\r\n\r\n    grid-template-columns:\r\n      1fr;\r\n\r\n    gap:\r\n      30px;\r\n\r\n    padding:\r\n      110px 0 60px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-content {\r\n\r\n    max-width:\r\n      800px;\r\n\r\n    margin:\r\n      0 auto;\r\n\r\n    text-align:\r\n      center;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-eyebrow {\r\n\r\n    margin-left:\r\n      auto;\r\n\r\n    margin-right:\r\n      auto;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-description {\r\n\r\n    margin-left:\r\n      auto;\r\n\r\n    margin-right:\r\n      auto;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-actions {\r\n\r\n    justify-content:\r\n      center;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-info-row {\r\n\r\n    justify-content:\r\n      center;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-visual {\r\n\r\n    width:\r\n      min(700px,100%);\r\n\r\n    min-height:\r\n      620px;\r\n\r\n    margin:\r\n      0 auto;\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 680px) {\r\n\r\n  .fkh3-container {\r\n\r\n    width:\r\n      calc(100% - 28px);\r\n\r\n    padding-top:\r\n      85px;\r\n\r\n    padding-bottom:\r\n      20px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-eyebrow-live {\r\n\r\n    display:\r\n      none;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-title {\r\n\r\n    font-size:\r\n      clamp(\r\n        43px,\r\n        13vw,\r\n        61px\r\n      );\r\n\r\n    line-height:\r\n      .97;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-title-second {\r\n\r\n    margin-top:\r\n      7px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-description {\r\n\r\n    font-size:\r\n      14px;\r\n\r\n    line-height:\r\n      1.7;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-actions {\r\n\r\n    width:\r\n      100%;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-btn {\r\n\r\n    width:\r\n      100%;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-info-row {\r\n\r\n    gap:\r\n      13px;\r\n\r\n    align-items:\r\n      flex-start;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-info-divider {\r\n\r\n    display:\r\n      none;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-stat,\r\n  .fkh3-mini-info {\r\n\r\n    width:\r\n      calc(33.333% - 9px);\r\n\r\n    flex-direction:\r\n      column;\r\n\r\n    text-align:\r\n      center;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-stat-number {\r\n\r\n    font-size:\r\n      31px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-mini-icon {\r\n\r\n    margin-bottom:\r\n      4px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-stat-copy span,\r\n  .fkh3-mini-info span {\r\n\r\n    display:\r\n      none;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-visual {\r\n\r\n    min-height:\r\n      510px;\r\n\r\n    transform:\r\n      scale(.78);\r\n\r\n    transform-origin:\r\n      center top;\r\n\r\n    margin-top:\r\n      10px;\r\n\r\n    margin-bottom:\r\n      -110px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-dashboard {\r\n\r\n    width:\r\n      470px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-orbit {\r\n\r\n    width:\r\n      520px;\r\n\r\n    height:\r\n      520px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-phone {\r\n\r\n    width: 170px;\r\n    height: 352px;\r\n\r\n    right: -30px;\r\n    bottom: 52px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-float-one {\r\n\r\n    left:\r\n      -25px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-float-two {\r\n\r\n    left:\r\n      -40px;\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   EXTRA SMALL\r\n========================================================= *\/\r\n\r\n@media (max-width: 420px) {\r\n\r\n  .fkh3-title {\r\n\r\n    font-size:\r\n      42px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-info-row {\r\n\r\n    margin-top:\r\n      34px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-stat-copy strong,\r\n  .fkh3-mini-info strong {\r\n\r\n    font-size:\r\n      9px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-visual {\r\n\r\n    transform:\r\n      scale(.70);\r\n\r\n    margin-bottom:\r\n      -155px;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-phone {\r\n\r\n    width: 160px;\r\n    height: 332px;\r\n\r\n    right: -35px;\r\n    bottom: 56px;\r\n\r\n  }\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n   REDUCED MOTION\r\n========================================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .fkh3-hero *,\r\n  .fkh3-hero *::before,\r\n  .fkh3-hero *::after {\r\n\r\n    animation:\r\n      none !important;\r\n\r\n  }\r\n\r\n\r\n  .fkh3-ring path {\r\n\r\n    stroke-dashoffset:\r\n      0;\r\n\r\n  }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-190c4b5 e-con-full e-flex e-con e-parent\" data-id=\"190c4b5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-db30207 e-con-full e-flex e-con e-child\" data-id=\"db30207\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a1f2ad8 fk-solve-heading elementor-widget elementor-widget-html\" data-id=\"a1f2ad8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"fk-solve-heading-html\">\r\n  <p>OUR MISSION<\/p> \r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8913d8b elementor-widget elementor-widget-heading\" data-id=\"8913d8b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Building Digital Solutions That Work for You<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0ae17a1 elementor-widget elementor-widget-text-editor\" data-id=\"0ae17a1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>We believe technology should empower, not overwhelm. That\u2019s why Flashklik focuses on building ready-to-use tools that solve real operational challenges faced by businesses every day without the heavy costs or steep learning curves.<\/p><p>Whether you&#8217;re managing a workspace, streamlining operations, or improving visibility, Flashklik helps you do it faster, easier, and smarter.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2bc7511 e-con-full e-flex e-con e-child\" data-id=\"2bc7511\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3176a8f elementor-widget elementor-widget-image\" data-id=\"3176a8f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"630\" height=\"630\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/image-39.png\" class=\"attachment-full size-full wp-image-3348\" alt=\"image 39\" srcset=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/image-39.png 630w, https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/image-39-300x300.png 300w, https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/image-39-150x150.png 150w\" sizes=\"(max-width: 630px) 100vw, 630px\"  title=\"Home\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-166e19e e-con-full e-flex e-con e-parent\" data-id=\"166e19e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-eb3d694 elementor-widget elementor-widget-html\" data-id=\"eb3d694\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"neo-scroll-section\">\r\n\r\n  <!-- CENTER WHY US -->\r\n  <div class=\"neo-intro-content active\">\r\n    <span class=\"neo-label\">Why Us<\/span>\r\n    <h2>Why Businesses Choose Flashklik.<\/h2>\r\n    <p>\r\n      Empowering businesses with smart, scalable, and purpose-driven solutions\u2014built to deliver results, not complexity.\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <div class=\"neo-scroll-wrapper\">\r\n\r\n    <!-- LEFT IMAGE DESKTOP -->\r\n    <div class=\"neo-image-sticky\">\r\n      <div class=\"neo-image-box\">\r\n        <img decoding=\"async\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/tool.png\" class=\"neo-img active\" alt=\"Image 1\" title=\"Home\">\r\n        <img decoding=\"async\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/grow.png\" class=\"neo-img\" alt=\"Image 2\" title=\"Home\">\r\n        <img decoding=\"async\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/bulb.png\" class=\"neo-img\" alt=\"Image 3\" title=\"Home\">\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- RIGHT TEXT -->\r\n    <div class=\"neo-content-list\">\r\n\r\n      <div class=\"neo-content active\" data-index=\"0\">\r\n        <div class=\"neo-mobile-visual\">\r\n          <img decoding=\"async\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/tool.png\" alt=\"Purpose-Built Tools\" title=\"Home\">\r\n        <\/div>\r\n\r\n        <span class=\"neo-label\">Purpose-Built Tools<\/span>\r\n        <h2>Solutions That Fit Your Business.<\/h2>\r\n        <p>\r\n          Tools designed around real business needs, helping teams work easier without unnecessary complexity.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <div class=\"neo-content\" data-index=\"1\">\r\n        <div class=\"neo-mobile-visual\">\r\n          <img decoding=\"async\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/grow.png\" alt=\"Built to Grow\" title=\"Home\">\r\n        <\/div>\r\n\r\n        <span class=\"neo-label\">Built to Grow<\/span>\r\n        <h2>Start Small. Scale Smarter.<\/h2>\r\n        <p>\r\n          Flexible solutions that grow with your business, whether used individually or connected together.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <div class=\"neo-content\" data-index=\"2\">\r\n        <div class=\"neo-mobile-visual\">\r\n          <img decoding=\"async\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/bulb.png\" alt=\"Smart Value\" title=\"Home\">\r\n        <\/div>\r\n\r\n        <span class=\"neo-label\">Smart Value<\/span>\r\n        <h2>High Impact Without High Cost.<\/h2>\r\n        <p>\r\n          Efficient digital tools built to deliver meaningful results while keeping things affordable and practical.\r\n        <\/p>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@700;800;900&family=Roboto+Condensed:wght@400;500;600;700;800&family=Ubuntu:wght@300;400;500;700&display=swap');\r\n\r\n.neo-scroll-section,\r\n.neo-scroll-section * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.neo-scroll-section {\r\n  width: 100%;\r\n  background: transparent;\r\n  padding: 80px 0;\r\n  overflow: visible;\r\n}\r\n\r\n\/* CENTER WHY US *\/\r\n.neo-intro-content {\r\n  width: min(900px, 90%);\r\n  min-height: 72vh;\r\n  margin: 0 auto;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: center;\r\n  text-align: center;\r\n}\r\n\r\n.neo-intro-content .neo-label,\r\n.neo-intro-content h2,\r\n.neo-intro-content p {\r\n  opacity: 0;\r\n  transform: translateY(36px);\r\n  transition: opacity 0.7s ease, transform 0.7s ease;\r\n}\r\n\r\n.neo-intro-content.active .neo-label,\r\n.neo-intro-content.active h2,\r\n.neo-intro-content.active p {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.neo-intro-content.active h2 {\r\n  transition-delay: 0.08s;\r\n}\r\n\r\n.neo-intro-content.active p {\r\n  transition-delay: 0.16s;\r\n}\r\n\r\n.neo-scroll-wrapper {\r\n  width: min(1200px, 90%);\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 80px;\r\n  align-items: flex-start;\r\n  overflow: visible;\r\n}\r\n\r\n.neo-image-sticky {\r\n  position: sticky;\r\n  top: 120px;\r\n  height: calc(100vh - 160px);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  overflow: visible;\r\n}\r\n\r\n.neo-image-box {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 560px;\r\n  border-radius: 0;\r\n  overflow: visible;\r\n  background: transparent;\r\n  box-shadow: none;\r\n}\r\n\r\n.neo-img {\r\n  position: absolute;\r\n  inset: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: contain;\r\n  object-position: center center;\r\n  padding: 0;\r\n  opacity: 0;\r\n  transform: translateY(24px) scale(0.96);\r\n  transition: opacity 0.75s ease, transform 0.85s ease;\r\n  pointer-events: none;\r\n}\r\n\r\n.neo-img.active {\r\n  opacity: 1;\r\n  transform: translateY(0) scale(1);\r\n}\r\n\r\n.neo-mobile-visual {\r\n  display: none;\r\n}\r\n\r\n.neo-content-list {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.neo-content {\r\n  min-height: 100vh;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  opacity: 0.15;\r\n  transition: opacity 0.7s ease;\r\n}\r\n\r\n.neo-content .neo-mobile-visual,\r\n.neo-content .neo-label,\r\n.neo-content h2,\r\n.neo-content p {\r\n  opacity: 0;\r\n  transform: translateY(36px);\r\n  transition: opacity 0.7s ease, transform 0.7s ease;\r\n}\r\n\r\n.neo-content.active {\r\n  opacity: 1;\r\n}\r\n\r\n.neo-content.active .neo-mobile-visual,\r\n.neo-content.active .neo-label,\r\n.neo-content.active h2,\r\n.neo-content.active p {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.neo-content.active .neo-label {\r\n  transition-delay: 0.06s;\r\n}\r\n\r\n.neo-content.active h2 {\r\n  transition-delay: 0.12s;\r\n}\r\n\r\n.neo-content.active p {\r\n  transition-delay: 0.18s;\r\n}\r\n\r\n.neo-label {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  width: fit-content;\r\n  font-family: 'Kanit', sans-serif !important;\r\n  font-size: 16px;\r\n  font-weight: 800;\r\n  line-height: 1;\r\n  letter-spacing: -0.8px;\r\n  text-transform: uppercase;\r\n  white-space: nowrap;\r\n  margin-bottom: 18px;\r\n\r\n  background: linear-gradient(90deg, #1EB6ED 0%, #00A2E8 100%);\r\n  -webkit-background-clip: text;\r\n  background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  color: transparent;\r\n\r\n  text-shadow: 0 0 16px rgba(37, 183, 232, 0.35);\r\n}\r\n\r\n.neo-content h2,\r\n.neo-intro-content h2 {\r\n  font-family: 'Roboto Condensed', sans-serif !important;\r\n  font-size: clamp(42px, 5vw, 72px);\r\n  line-height: 1;\r\n  letter-spacing: -0.05em;\r\n  color: #1d1d1f;\r\n  margin: 0 0 24px;\r\n  font-weight: 800;\r\n}\r\n\r\n.neo-content p,\r\n.neo-intro-content p {\r\n  font-family: 'Ubuntu', sans-serif !important;\r\n  font-size: 16px;\r\n  line-height: 1.45;\r\n  color: #6e6e73;\r\n  margin: 0;\r\n  max-width: 560px;\r\n  font-weight: 300;\r\n}\r\n\r\n\/* Mobile Responsive *\/\r\n@media (max-width: 768px) {\r\n  .neo-scroll-section {\r\n    padding: 50px 0 70px;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .neo-intro-content {\r\n    width: min(360px, 92%);\r\n    min-height: auto;\r\n    padding: 70px 0 80px;\r\n  }\r\n\r\n  .neo-intro-content .neo-label {\r\n    justify-content: center;\r\n  }\r\n\r\n  .neo-scroll-wrapper {\r\n    width: min(360px, 92%);\r\n    display: block;\r\n    overflow: hidden;\r\n  }\r\n\r\n  \/* Hide sticky image di mobile supaya tidak numpuk text *\/\r\n  .neo-image-sticky {\r\n    display: none;\r\n  }\r\n\r\n  .neo-content-list {\r\n    width: 100%;\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 0;\r\n  }\r\n\r\n  .neo-content {\r\n    min-height: auto;\r\n    padding: 70px 0 90px;\r\n    justify-content: flex-start;\r\n    align-items: center;\r\n    text-align: center;\r\n    opacity: 0.18;\r\n  }\r\n\r\n  .neo-content.active {\r\n    opacity: 1;\r\n  }\r\n\r\n  .neo-mobile-visual {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    width: 100%;\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .neo-mobile-visual img {\r\n    width: min(230px, 72vw);\r\n    height: auto;\r\n    display: block;\r\n    object-fit: contain;\r\n  }\r\n\r\n  .neo-label {\r\n    justify-content: center;\r\n    text-align: center;\r\n    font-size: 13px;\r\n    letter-spacing: -0.3px;\r\n    line-height: 1.1;\r\n    white-space: normal;\r\n    max-width: 100%;\r\n    margin-bottom: 14px;\r\n  }\r\n\r\n  .neo-content h2,\r\n  .neo-intro-content h2 {\r\n    font-size: clamp(34px, 10.5vw, 42px);\r\n    line-height: 0.98;\r\n    letter-spacing: -0.045em;\r\n    text-align: center;\r\n    max-width: 330px;\r\n    margin-bottom: 20px;\r\n  }\r\n\r\n  .neo-content p,\r\n  .neo-intro-content p {\r\n    font-size: 15px;\r\n    line-height: 1.55;\r\n    max-width: 320px;\r\n    text-align: center;\r\n  }\r\n\r\n  .neo-content .neo-mobile-visual,\r\n  .neo-content .neo-label,\r\n  .neo-content h2,\r\n  .neo-content p {\r\n    transform: translateY(28px);\r\n  }\r\n\r\n  .neo-content.active .neo-mobile-visual,\r\n  .neo-content.active .neo-label,\r\n  .neo-content.active h2,\r\n  .neo-content.active p {\r\n    transform: translateY(0);\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n  const contents = document.querySelectorAll(\".neo-content\");\r\n  const images = document.querySelectorAll(\".neo-img\");\r\n  const intro = document.querySelector(\".neo-intro-content\");\r\n  const isMobile = window.matchMedia(\"(max-width: 768px)\").matches;\r\n\r\n  if (intro) {\r\n    const introObserver = new IntersectionObserver(\r\n      function (entries) {\r\n        entries.forEach(function (entry) {\r\n          if (entry.isIntersecting) {\r\n            intro.classList.add(\"active\");\r\n          }\r\n        });\r\n      },\r\n      {\r\n        threshold: 0.25\r\n      }\r\n    );\r\n\r\n    introObserver.observe(intro);\r\n  }\r\n\r\n  function setActive(index) {\r\n    contents.forEach(function (content) {\r\n      content.classList.remove(\"active\");\r\n    });\r\n\r\n    images.forEach(function (img) {\r\n      img.classList.remove(\"active\");\r\n    });\r\n\r\n    if (contents[index]) {\r\n      contents[index].classList.add(\"active\");\r\n    }\r\n\r\n    if (images[index]) {\r\n      images[index].classList.add(\"active\");\r\n    }\r\n  }\r\n\r\n  const observer = new IntersectionObserver(\r\n    function (entries) {\r\n      entries.forEach(function (entry) {\r\n        if (entry.isIntersecting) {\r\n          const index = Number(entry.target.getAttribute(\"data-index\"));\r\n          setActive(index);\r\n        }\r\n      });\r\n    },\r\n    {\r\n      root: null,\r\n      threshold: isMobile ? 0.32 : 0.45,\r\n      rootMargin: isMobile ? \"-18% 0px -18% 0px\" : \"-15% 0px -15% 0px\"\r\n    }\r\n  );\r\n\r\n  contents.forEach(function (content) {\r\n    observer.observe(content);\r\n  });\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bef39b1 e-con-full e-flex e-con e-parent\" data-id=\"bef39b1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4e9877f fk-solve-heading elementor-widget elementor-widget-html\" data-id=\"4e9877f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"fk-solve-heading-html\">\r\n  <p>THE PRODUCTS<\/p>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-980a186 elementor-widget elementor-widget-html\" data-id=\"980a186\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"fk-heading-only\" id=\"fkHeadingOnly\">\r\n  <h2 class=\"fk-main-heading-only\">\r\n    <span class=\"fk-changing-word\">Smart Solutions<\/span> <br>\r\n    <span class=\"fk-normal-word\">For Modern Businesses<\/span>\r\n  <\/h2>\r\n<\/div>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Anton&family=Bebas+Neue&family=Chakra+Petch:wght@700;800&family=Oswald:wght@700&family=Roboto+Condensed:wght@700;800&family=Ubuntu:wght@700&display=swap');\r\n\r\n.fk-heading-only {\r\n  width: 100%;\r\n  background: #0b0b0b;\r\n  text-align: center;\r\n  color: #ffffff;\r\n  padding: 40px 20px 30px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fk-main-heading-only {\r\n  margin: 0;\r\n  font-family: 'Roboto Condensed', sans-serif;\r\n  font-size: clamp(54px, 7.2vw, 112px);\r\n  font-weight: 800;\r\n  line-height: 0.98;\r\n  letter-spacing: -2px;\r\n  color: #ffffff;\r\n}\r\n\r\n.fk-main-heading-only span {\r\n  display: inline-block;\r\n}\r\n\r\n.fk-changing-word {\r\n  transition:\r\n    opacity 0.25s ease,\r\n    transform 0.25s ease,\r\n    letter-spacing 0.25s ease,\r\n    text-shadow 0.25s ease;\r\n  will-change: transform, opacity;\r\n}\r\n\r\n.fk-changing-word.is-changing {\r\n  opacity: 0.65;\r\n  transform: scale(0.96);\r\n}\r\n\r\n.fk-changing-word.is-final {\r\n  font-family: 'Roboto Condensed', sans-serif !important;\r\n  font-weight: 800 !important;\r\n  letter-spacing: -2px !important;\r\n  transform: scale(1) !important;\r\n  opacity: 1 !important;\r\n  text-shadow: none !important;\r\n}\r\n\r\n.fk-normal-word {\r\n  font-family: 'Roboto Condensed', sans-serif !important;\r\n  font-weight: 800;\r\n  letter-spacing: -2px;\r\n}\r\n\r\n@media (max-width: 767px) {\r\n  .fk-heading-only {\r\n    padding: 30px 14px 20px;\r\n  }\r\n\r\n  .fk-main-heading-only {\r\n    font-size: 48px;\r\n    line-height: 1.05;\r\n    letter-spacing: -1px;\r\n  }\r\n\r\n  .fk-changing-word.is-final,\r\n  .fk-normal-word {\r\n    letter-spacing: -1px !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function initSmartSolutionsOnly() {\r\n    const section = document.querySelector(\"#fkHeadingOnly\");\r\n    if (!section) return;\r\n\r\n    const word = section.querySelector(\".fk-changing-word\");\r\n    if (!word) return;\r\n\r\n    const fontStyles = [\r\n      {\r\n        font: \"'Anton', sans-serif\",\r\n        letter: \"1px\",\r\n        transform: \"scale(1.03)\",\r\n        shadow: \"0 0 22px rgba(39,196,244,0.38)\"\r\n      },\r\n      {\r\n        font: \"'Bebas Neue', sans-serif\",\r\n        letter: \"3px\",\r\n        transform: \"scale(1)\",\r\n        shadow: \"0 0 16px rgba(255,255,255,0.22)\"\r\n      },\r\n      {\r\n        font: \"'Chakra Petch', sans-serif\",\r\n        letter: \"-1px\",\r\n        transform: \"scale(1.01)\",\r\n        shadow: \"0 0 20px rgba(39,196,244,0.32)\"\r\n      },\r\n      {\r\n        font: \"'Oswald', sans-serif\",\r\n        letter: \"0px\",\r\n        transform: \"scale(0.99)\",\r\n        shadow: \"0 0 14px rgba(255,255,255,0.18)\"\r\n      },\r\n      {\r\n        font: \"'Ubuntu', sans-serif\",\r\n        letter: \"-2px\",\r\n        transform: \"scale(1)\",\r\n        shadow: \"0 0 18px rgba(39,196,244,0.26)\"\r\n      }\r\n    ];\r\n\r\n    let hasPlayed = false;\r\n    let index = 0;\r\n\r\n    function changeFont() {\r\n      const style = fontStyles[index % fontStyles.length];\r\n\r\n      word.classList.add(\"is-changing\");\r\n\r\n      setTimeout(function () {\r\n        word.style.fontFamily = style.font;\r\n        word.style.letterSpacing = style.letter;\r\n        word.style.transform = style.transform;\r\n        word.style.textShadow = style.shadow;\r\n\r\n        word.classList.remove(\"is-changing\");\r\n        index++;\r\n      }, 90);\r\n    }\r\n\r\n    function playEffect() {\r\n      if (hasPlayed) return;\r\n      hasPlayed = true;\r\n\r\n      word.classList.remove(\"is-final\");\r\n\r\n      let count = 0;\r\n\r\n      const timer = setInterval(function () {\r\n        changeFont();\r\n        count++;\r\n\r\n        if (count >= 9) {\r\n          clearInterval(timer);\r\n\r\n          setTimeout(function () {\r\n            word.classList.add(\"is-final\");\r\n          }, 300);\r\n        }\r\n      }, 220);\r\n    }\r\n\r\n    const observer = new IntersectionObserver(function (entries) {\r\n      entries.forEach(function (entry) {\r\n        if (entry.isIntersecting) {\r\n          playEffect();\r\n        }\r\n      });\r\n    }, {\r\n      threshold: 0.45\r\n    });\r\n\r\n    observer.observe(section);\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n    document.addEventListener(\"DOMContentLoaded\", initSmartSolutionsOnly);\r\n  } else {\r\n    initSmartSolutionsOnly();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ad28df6 elementor-widget elementor-widget-text-editor\" data-id=\"ad28df6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Offers a range of solutions designed to streamline processes and support modern organizations.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-89390b8 elementor-widget elementor-widget-html\" data-id=\"89390b8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"fk-product-section\" id=\"fkProductSection\">\r\n\r\n  <div class=\"fk-slider-area\">\r\n    <button class=\"fk-nav fk-prev\" type=\"button\" aria-label=\"Previous product\">\u2039<\/button>\r\n\r\n    <div class=\"fk-slider\" id=\"fkSlider\">\r\n      <!-- Product akan otomatis muncul dari JavaScript -->\r\n    <\/div>\r\n\r\n    <button class=\"fk-nav fk-next\" type=\"button\" aria-label=\"Next product\">\u203a<\/button>\r\n  <\/div>\r\n\r\n  <div class=\"fk-trusted\">\r\n    <p>Trusted by:<\/p>\r\n\r\n    <div class=\"fk-marquee\">\r\n      <div class=\"fk-marquee-track\" id=\"fkLogoTrack\">\r\n        <!-- Logo trusted by akan otomatis muncul dari JavaScript -->\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<style>\r\n  .fk-product-section {\r\n    width: 100%;\r\n    background: #0b0b0b;\r\n    padding: 40px 20px 80px;\r\n    overflow: hidden;\r\n    color: #ffffff;\r\n    font-family: Ubuntu, sans-serif;\r\n  }\r\n\r\n  .fk-slider-area {\r\n    position: relative;\r\n    max-width: 1200px;\r\n    height: 640px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .fk-slider {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 100%;\r\n  }\r\n\r\n  .fk-slide {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 330px;\r\n    transform: translate(-50%, -50%) scale(0.68);\r\n    opacity: 0;\r\n    filter: brightness(0.35);\r\n    pointer-events: none;\r\n    transition: all 0.55s ease;\r\n  }\r\n\r\n  .fk-slide.active {\r\n    width: 380px;\r\n    transform: translate(-50%, -50%) scale(1);\r\n    opacity: 1;\r\n    filter: brightness(1);\r\n    z-index: 5;\r\n    pointer-events: auto;\r\n  }\r\n\r\n  .fk-slide.prev {\r\n    transform: translate(-155%, -50%) scale(0.68);\r\n    opacity: 0.58;\r\n    filter: brightness(0.45);\r\n    z-index: 2;\r\n  }\r\n\r\n  .fk-slide.next {\r\n    transform: translate(55%, -50%) scale(0.68);\r\n    opacity: 0.58;\r\n    filter: brightness(0.45);\r\n    z-index: 2;\r\n  }\r\n\r\n  .fk-product-img-wrap {\r\n    width: 100%;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n\r\n  .fk-product-img {\r\n    width: 100%;\r\n    max-width: 100%;\r\n    height: auto;\r\n    max-height: 620px;\r\n    display: block;\r\n    object-fit: contain;\r\n    user-select: none;\r\n    -webkit-user-drag: none;\r\n  }\r\n\r\n  .fk-nav {\r\n    position: absolute;\r\n    top: 50%;\r\n    transform: translateY(-50%);\r\n    z-index: 20;\r\n    width: 52px;\r\n    height: 52px;\r\n    border-radius: 999px;\r\n    border: 1px solid rgba(255,255,255,0.22);\r\n    background: rgba(255,255,255,0.10);\r\n    backdrop-filter: blur(14px);\r\n    -webkit-backdrop-filter: blur(14px);\r\n    color: #ffffff;\r\n    font-size: 0;\r\n    cursor: pointer;\r\n    transition: all 0.25s ease;\r\n    box-shadow: 0 12px 35px rgba(0,0,0,0.35);\r\n  }\r\n\r\n  .fk-nav::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    width: 13px;\r\n    height: 13px;\r\n    top: 50%;\r\n    left: 50%;\r\n    border-top: 3px solid #ffffff;\r\n    border-right: 3px solid #ffffff;\r\n    transition: all 0.25s ease;\r\n  }\r\n\r\n  .fk-prev::before {\r\n    transform: translate(-35%, -50%) rotate(-135deg);\r\n  }\r\n\r\n  .fk-next::before {\r\n    transform: translate(-65%, -50%) rotate(45deg);\r\n  }\r\n\r\n  .fk-nav:hover {\r\n    background: linear-gradient(135deg, #26bff2, #1076d8);\r\n    border-color: rgba(255,255,255,0.35);\r\n    transform: translateY(-50%) scale(1.08);\r\n  }\r\n\r\n  .fk-nav:hover::before {\r\n    border-color: #ffffff;\r\n  }\r\n\r\n  .fk-prev {\r\n    left: 95px;\r\n  }\r\n\r\n  .fk-next {\r\n    right: 95px;\r\n  }\r\n\r\n  .fk-trusted {\r\n    max-width: 1180px;\r\n    margin: 0px auto 0;\r\n    text-align: center;\r\n  }\r\n\r\n  .fk-trusted p {\r\n    font-size: 14px;\r\n    color: rgba(255,255,255,0.9);\r\n    margin: 0 0 26px;\r\n  }\r\n\r\n  .fk-marquee {\r\n    width: 100%;\r\n    overflow: hidden;\r\n    position: relative;\r\n    mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);\r\n    -webkit-mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);\r\n  }\r\n\r\n  .fk-marquee-track {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 75px;\r\n    width: max-content;\r\n    animation: fkLogoLoop 24s linear infinite;\r\n  }\r\n\r\n  .fk-marquee:hover .fk-marquee-track {\r\n    animation-play-state: paused;\r\n  }\r\n\r\n  .fk-logo-item {\r\n    flex: 0 0 auto;\r\n    min-width: 160px;\r\n    height: 75px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n\r\n  .fk-logo-item img {\r\n    max-width: 160px;\r\n    max-height: 65px;\r\n    object-fit: contain;\r\n    filter: grayscale(100%);\r\n    opacity: 0.8;\r\n    transition: 0.25s ease;\r\n  }\r\n\r\n  .fk-logo-item img:hover {\r\n    filter: grayscale(0%);\r\n    opacity: 1;\r\n  }\r\n\r\n  @keyframes fkLogoLoop {\r\n    from {\r\n      transform: translateX(0);\r\n    }\r\n\r\n    to {\r\n      transform: translateX(-50%);\r\n    }\r\n  }\r\n\r\n  @media (max-width: 1024px) {\r\n    .fk-slider-area {\r\n      height: 590px;\r\n    }\r\n\r\n    .fk-slide.active {\r\n      width: 340px;\r\n    }\r\n\r\n    .fk-slide.prev {\r\n      transform: translate(-140%, -50%) scale(0.62);\r\n    }\r\n\r\n    .fk-slide.next {\r\n      transform: translate(40%, -50%) scale(0.62);\r\n    }\r\n\r\n    .fk-product-img {\r\n      max-height: 570px;\r\n    }\r\n\r\n    .fk-prev {\r\n      left: 35px;\r\n    }\r\n\r\n    .fk-next {\r\n      right: 35px;\r\n    }\r\n  }\r\n\r\n  @media (max-width: 767px) {\r\n    .fk-product-section {\r\n      padding: 30px 12px 55px;\r\n    }\r\n\r\n    .fk-slider-area {\r\n      height: 500px;\r\n    }\r\n\r\n    .fk-slide {\r\n      width: 250px;\r\n    }\r\n\r\n    .fk-slide.active {\r\n      width: 280px;\r\n      transform: translate(-50%, -50%) scale(1);\r\n    }\r\n\r\n    .fk-slide.prev,\r\n    .fk-slide.next {\r\n      opacity: 0;\r\n      pointer-events: none;\r\n    }\r\n\r\n    .fk-product-img {\r\n      max-height: 480px;\r\n    }\r\n\r\n    .fk-nav {\r\n      width: 42px;\r\n      height: 42px;\r\n    }\r\n\r\n    .fk-nav::before {\r\n      width: 10px;\r\n      height: 10px;\r\n      border-top-width: 2.5px;\r\n      border-right-width: 2.5px;\r\n    }\r\n\r\n    .fk-prev {\r\n      left: 8px;\r\n    }\r\n\r\n    .fk-next {\r\n      right: 8px;\r\n    }\r\n\r\n    .fk-trusted {\r\n      margin-top: 0;\r\n    }\r\n\r\n    .fk-marquee-track {\r\n      gap: 45px;\r\n      animation-duration: 20s;\r\n    }\r\n\r\n    .fk-logo-item {\r\n      min-width: 120px;\r\n    }\r\n\r\n    .fk-logo-item img {\r\n      max-width: 120px;\r\n      max-height: 52px;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function initFlashklikProductSlider() {\r\n    const section = document.querySelector(\"#fkProductSection\");\r\n    if (!section) return;\r\n\r\n    const slider = section.querySelector(\"#fkSlider\");\r\n    const logoTrack = section.querySelector(\"#fkLogoTrack\");\r\n    const prevBtn = section.querySelector(\".fk-prev\");\r\n    const nextBtn = section.querySelector(\".fk-next\");\r\n\r\n    const products = [\r\n      {\r\n        name: \"RoomFlow\",\r\n        image: \"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/iPhone-17-Pro-Blue-Screen-Front-View-Mockup-5.png\",\r\n        trustedBy: [\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/kemenkes.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/rs-pon.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/swiss-belhotel.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/03\/tatarasa.png\"\r\n        ]\r\n      },\r\n      {\r\n        name: \"EasyPrint\",\r\n        image: \"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/iPhone-17-Pro-Blue-Screen-Front-View-Mockup-4.png\",\r\n        trustedBy: [\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/kemenkes.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/rs-pon.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/swiss-belhotel.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/03\/tatarasa.png\"\r\n        ]\r\n      },\r\n      {\r\n        name: \"CarePro\",\r\n        image: \"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/06\/iPhone-17-Pro-Blue-Screen-Front-View-Mockup-3.png\",\r\n        trustedBy: [\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/kemenkes.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/rs-pon.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/09\/swiss-belhotel.png\",\r\n          \"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/03\/tatarasa.png\"\r\n        ]\r\n      }\r\n    ];\r\n\r\n    let current = 1;\r\n\r\n    function renderSlides() {\r\n      slider.innerHTML = products.map(function (product, index) {\r\n        return `\r\n          <div class=\"fk-slide\" data-index=\"${index}\">\r\n            <div class=\"fk-product-img-wrap\">\r\n              <img decoding=\"async\" \r\n                class=\"fk-product-img\" \r\n                src=\"${product.image}\" \r\n                alt=\"${product.name}\"\r\n              >\r\n            <\/div>\r\n          <\/div>\r\n        `;\r\n      }).join(\"\");\r\n    }\r\n\r\n    function renderTrustedLogos() {\r\n      const activeProduct = products[current];\r\n      const logos = activeProduct.trustedBy;\r\n      const loopLogos = [...logos, ...logos, ...logos];\r\n\r\n      logoTrack.innerHTML = loopLogos.map(function (logo, index) {\r\n        return `\r\n          <div class=\"fk-logo-item\">\r\n            <img decoding=\"async\" src=\"${logo}\" alt=\"${activeProduct.name} trusted logo ${index + 1}\">\r\n          <\/div>\r\n        `;\r\n      }).join(\"\");\r\n    }\r\n\r\n    function restartLogoAnimation() {\r\n      logoTrack.style.animation = \"none\";\r\n      logoTrack.offsetHeight;\r\n      logoTrack.style.animation = \"\";\r\n    }\r\n\r\n    function updateSlider() {\r\n      const slides = section.querySelectorAll(\".fk-slide\");\r\n      const total = slides.length;\r\n\r\n      slides.forEach(function (slide) {\r\n        slide.classList.remove(\"active\", \"prev\", \"next\");\r\n      });\r\n\r\n      const prev = (current - 1 + total) % total;\r\n      const next = (current + 1) % total;\r\n\r\n      slides[current].classList.add(\"active\");\r\n      slides[prev].classList.add(\"prev\");\r\n      slides[next].classList.add(\"next\");\r\n\r\n      renderTrustedLogos();\r\n      restartLogoAnimation();\r\n    }\r\n\r\n    function goNext() {\r\n      current = (current + 1) % products.length;\r\n      updateSlider();\r\n    }\r\n\r\n    function goPrev() {\r\n      current = (current - 1 + products.length) % products.length;\r\n      updateSlider();\r\n    }\r\n\r\n    prevBtn.addEventListener(\"click\", goPrev);\r\n    nextBtn.addEventListener(\"click\", goNext);\r\n\r\n    let startX = 0;\r\n\r\n    section.addEventListener(\"touchstart\", function (e) {\r\n      startX = e.touches[0].clientX;\r\n    });\r\n\r\n    section.addEventListener(\"touchend\", function (e) {\r\n      const endX = e.changedTouches[0].clientX;\r\n      const diff = startX - endX;\r\n\r\n      if (Math.abs(diff) > 50) {\r\n        if (diff > 0) {\r\n          goNext();\r\n        } else {\r\n          goPrev();\r\n        }\r\n      }\r\n    });\r\n\r\n    renderSlides();\r\n    updateSlider();\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n    document.addEventListener(\"DOMContentLoaded\", initFlashklikProductSlider);\r\n  } else {\r\n    initFlashklikProductSlider();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-19bb4b1 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"19bb4b1\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-6a6ea57\" data-id=\"6a6ea57\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-23202ad elementor-widget elementor-widget-image\" data-id=\"23202ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"938\" height=\"1354\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/image-4.png\" class=\"attachment-full size-full wp-image-1633\" alt=\"Image 4\" srcset=\"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/image-4.png 938w, https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/image-4-208x300.png 208w, https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/image-4-709x1024.png 709w, https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/image-4-768x1109.png 768w\" sizes=\"(max-width: 938px) 100vw, 938px\"  title=\"Home\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-7d071a3\" data-id=\"7d071a3\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-03d8d38 elementor-widget elementor-widget-image\" data-id=\"03d8d38\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"775\" height=\"95\" src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/Flashklik-Logo.png\" class=\"attachment-full size-full wp-image-1558\" alt=\"Flashklik Logo\" srcset=\"https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/Flashklik-Logo.png 775w, https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/Flashklik-Logo-300x37.png 300w, https:\/\/flashklik.com\/wp-content\/uploads\/2025\/07\/Flashklik-Logo-768x94.png 768w\" sizes=\"(max-width: 775px) 100vw, 775px\"  title=\"Home\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b5b6219 elementor-widget elementor-widget-heading\" data-id=\"b5b6219\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">One Platform. Multiple Solutions.<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1c54494 elementor-widget elementor-widget-text-editor\" data-id=\"1c54494\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Whether you\u2019re running a small team or scaling your enterprise, Flashklik helps you implement the right technology to simplify, save, and succeed.<\/p><p>At Flashklik, we create practical tools that help businesses run smarter without the complexity. From workspace automation to operational control, we make digital transformation accessible and efficient.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t<div class=\"elementor-element elementor-element-bde23a3 e-con-full e-flex e-con e-parent\" data-id=\"bde23a3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ca64a31 elementor-widget elementor-widget-html\" data-id=\"ca64a31\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"fk-map-section\">\r\n  <div class=\"fk-map-container\">\r\n\r\n    <!-- TEXT -->\r\n    <div class=\"fk-map-text\">\r\n      <p class=\"fk-map-subtitle\">\r\n        Proudly developed in Indonesia, Flashklik is dedicated to helping local businesses\r\n        adopt digital solutions that are practical, efficient, and scalable.\r\n      <\/p>\r\n\r\n      <h2 class=\"fk-map-title\">\r\n        WE\u2019RE NOT JUST BUILDING TOOLS WE\u2019RE BUILDING SOLUTIONS\r\n      <\/h2>\r\n    <\/div>\r\n\r\n    <!-- IMAGE -->\r\n    <div class=\"fk-map-image-wrap\">\r\n      <img decoding=\"async\" \r\n        src=\"https:\/\/flashklik.com\/wp-content\/uploads\/2026\/07\/image-51-1-scaled.png\" \r\n        class=\"fk-map-image\" \r\n        alt=\"Indonesia Map\"\r\n       title=\"Home\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Roboto+Condensed:wght@400;500;600;700;800;900&family=Ubuntu:wght@300;400;500;700&display=swap');\r\n\r\n.fk-map-section,\r\n.fk-map-section * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.fk-map-section {\r\n  width: 100%;\r\n  min-height: 100vh;\r\n  background: #0b0b0b;\r\n  padding: 90px 0 120px;\r\n  overflow: hidden;\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\n.fk-map-container {\r\n  width: min(1320px, 92%);\r\n  margin: 0 auto;\r\n  text-align: center;\r\n}\r\n\r\n\/* TEXT DEFAULT *\/\r\n.fk-map-text {\r\n  position: relative;\r\n  z-index: 2;\r\n  margin-bottom: 80px;\r\n}\r\n\r\n.fk-map-subtitle,\r\n.fk-map-title {\r\n  opacity: 0;\r\n  transform: translateY(-40px);\r\n  transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n\r\n.fk-map-subtitle {\r\n  font-family: 'Ubuntu', sans-serif !important;\r\n  max-width: 850px;\r\n  margin: 0 auto 28px;\r\n  color: rgba(255, 255, 255, 0.9);\r\n  font-size: 16px;\r\n  line-height: 1.25;\r\n  font-weight: 400;\r\n}\r\n\r\n.fk-map-title {\r\n  font-family: 'Roboto Condensed', sans-serif !important;\r\n  max-width: 1240px;\r\n  margin: 0 auto;\r\n  color: #ffffff;\r\n  font-size: clamp(38px, 5vw, 58px);\r\n  line-height: 1;\r\n  letter-spacing: -0.02em;\r\n  font-weight: 900;\r\n  text-transform: uppercase;\r\n}\r\n\r\n\/* IMAGE DEFAULT *\/\r\n.fk-map-image-wrap {\r\n  position: relative;\r\n  z-index: 1;\r\n  width: 100%;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n\r\n  opacity: 0;\r\n  transform: scale(0.92) translateY(40px);\r\n  filter: blur(10px);\r\n  transition: \r\n    opacity 1s ease,\r\n    transform 1.1s ease,\r\n    filter 1.1s ease;\r\n}\r\n\r\n.fk-map-image {\r\n  width: min(100%, 1280px);\r\n  max-width: 1280px;\r\n  height: auto;\r\n  display: block;\r\n  margin: 0 auto;\r\n  object-fit: contain;\r\n  object-position: center center;\r\n}\r\n\r\n\/* ACTIVE ANIMATION *\/\r\n\r\n\/* gambar muncul dulu *\/\r\n.fk-map-section.active .fk-map-image-wrap {\r\n  opacity: 1;\r\n  transform: scale(1) translateY(0);\r\n  filter: blur(0);\r\n  transition-delay: 0s;\r\n}\r\n\r\n\/* text muncul belakangan dari atas ke bawah *\/\r\n.fk-map-section.active .fk-map-subtitle {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n  transition-delay: 0.55s;\r\n}\r\n\r\n.fk-map-section.active .fk-map-title {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n  transition-delay: 0.78s;\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (max-width: 1024px) {\r\n  .fk-map-section {\r\n    padding: 80px 0 100px;\r\n  }\r\n\r\n  .fk-map-text {\r\n    margin-bottom: 65px;\r\n  }\r\n\r\n  .fk-map-title {\r\n    font-size: clamp(36px, 6vw, 52px);\r\n    max-width: 860px;\r\n  }\r\n\r\n  .fk-map-image {\r\n    width: min(100%, 980px);\r\n  }\r\n}\r\n\r\n\/* Mobile Responsive *\/\r\n@media (max-width: 768px) {\r\n  .fk-map-section {\r\n    min-height: auto;\r\n    padding: 70px 0 80px;\r\n    align-items: flex-start;\r\n  }\r\n\r\n  .fk-map-container {\r\n    width: 100%;\r\n    padding: 0 18px;\r\n  }\r\n\r\n  .fk-map-text {\r\n    margin-bottom: 48px;\r\n  }\r\n\r\n  .fk-map-subtitle {\r\n    font-size: 14px;\r\n    line-height: 1.28;\r\n    max-width: 320px;\r\n    margin-bottom: 24px;\r\n  }\r\n\r\n  .fk-map-title {\r\n    font-size: clamp(30px, 9.6vw, 38px);\r\n    line-height: 1.05;\r\n    letter-spacing: -0.03em;\r\n    max-width: 330px;\r\n  }\r\n\r\n  .fk-map-image-wrap {\r\n    width: 100%;\r\n    justify-content: center;\r\n    overflow: visible;\r\n  }\r\n\r\n  .fk-map-image {\r\n    width: min(108vw, 520px);\r\n    max-width: none;\r\n    margin: 0 auto;\r\n    object-position: center center;\r\n    transform: translateX(0);\r\n  }\r\n}\r\n\r\n\/* Small Mobile *\/\r\n@media (max-width: 380px) {\r\n  .fk-map-container {\r\n    padding: 0 16px;\r\n  }\r\n\r\n  .fk-map-subtitle {\r\n    font-size: 13px;\r\n    max-width: 290px;\r\n  }\r\n\r\n  .fk-map-title {\r\n    font-size: clamp(28px, 9.2vw, 34px);\r\n    max-width: 300px;\r\n  }\r\n\r\n  .fk-map-image {\r\n    width: 106vw;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n  const mapSection = document.querySelector(\".fk-map-section\");\r\n\r\n  if (!mapSection) return;\r\n\r\n  const observer = new IntersectionObserver(\r\n    function (entries) {\r\n      entries.forEach(function (entry) {\r\n        if (entry.isIntersecting) {\r\n          mapSection.classList.add(\"active\");\r\n        }\r\n      });\r\n    },\r\n    {\r\n      threshold: 0.35\r\n    }\r\n  );\r\n\r\n  observer.observe(mapSection);\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\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>SOLVE WITH FLASHKLIK BUSINESS SOLUTIONS Built for Business. Made for Efficiency. Helping businesses and organizations work smarter, improve productivity, and simplify everyday operations through connected digital solutions. Explore Solutions Contact Us 30+ Users Downloaded and growing Business Ready Built for daily operations Smarter Workflow Designed for efficiency F Flashklik Workspace FK BUSINESS OVERVIEW Good morning. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-26","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/pages\/26","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/comments?post=26"}],"version-history":[{"count":586,"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/pages\/26\/revisions"}],"predecessor-version":[{"id":3888,"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/pages\/26\/revisions\/3888"}],"wp:attachment":[{"href":"https:\/\/flashklik.com\/id\/wp-json\/wp\/v2\/media?parent=26"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}