{"id":5231,"date":"2025-07-15T14:43:32","date_gmt":"2025-07-15T14:43:32","guid":{"rendered":"https:\/\/visionbridge.eu\/?page_id=5231"},"modified":"2026-02-18T11:19:33","modified_gmt":"2026-02-18T11:19:33","slug":"apps","status":"publish","type":"page","link":"https:\/\/visionbridge.eu\/?page_id=5231","title":{"rendered":"apps-ai"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5231\" class=\"elementor elementor-5231\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e7f6065 elementor-hidden-mobile e-flex e-con-boxed e-con e-parent\" data-id=\"e7f6065\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ac09b3c e-con-full e-flex e-con e-child\" data-id=\"ac09b3c\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8ebc758 elementor-invisible elementor-widget elementor-widget-image\" data-id=\"8ebc758\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;,&quot;_animation_delay&quot;:1000}\" 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\t<a href=\"https:\/\/visionbridge.eu\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1523\" height=\"211\" src=\"https:\/\/visionbridge.eu\/wp-content\/uploads\/2024\/09\/white_version2_150.png\" class=\"attachment-large size-large wp-image-4830\" alt=\"\" \/>\t\t\t\t\t\t\t\t<\/a>\n\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<div class=\"elementor-element elementor-element-302c9a2 e-con-full e-grid e-con e-child\" data-id=\"302c9a2\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7dec318 animated-fast desk-links elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"7dec318\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;,&quot;_animation_delay&quot;:1500}\" 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\"><a href=\"\/services\">services<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-59cd902 animated-fast desk-links elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"59cd902\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;,&quot;_animation_delay&quot;:1500}\" 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\"><a href=\"\/work\">work<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f74c77a animated-fast desk-links elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"f74c77a\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;,&quot;_animation_delay&quot;:1500}\" 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\"><a href=\"\/apps\">apps<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-696c9b8 animated-fast desk-links elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"696c9b8\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;,&quot;_animation_delay&quot;:1500}\" 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\"><a href=\"\/contact\">contact<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1278744 e-con-full elementor-hidden-desktop elementor-hidden-tablet e-flex e-con e-parent\" data-id=\"1278744\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c9e4092 elementor-widget elementor-widget-html\" data-id=\"c9e4092\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<head>\n    <script>\n        if ('scrollRestoration' in history) {\n            history.scrollRestoration = 'manual';\n        }\n\n        window.addEventListener('beforeunload', function () {\n            window.scrollTo(0, 0);\n        });\n    <\/script>\n<\/head>\n\n<div class=\"selector-top\"><\/div> <!-- Dieser Abschnitt schrumpft von oben nach unten -->\n<header class=\"header\" id=\"header\" class=\"visible\"> <!-- Added visible class initially -->\n    <div class=\"nav-content\" id=\"nav-content\">\n        <div class=\"logo\">\n            <img decoding=\"async\" src=\"https:\/\/visionbridge.eu\/wp-content\/uploads\/2024\/09\/logo_browser.png\" alt=\"Visionbridge Logo\" class=\"logo-img\">\n            <a href=\"\/\" class='vb_text'>\n                visionbridge\n            <\/a>\n        <\/div>\n        <div class=\"menu\">\n            <a href=\"#\" id=\"menu-toggle\" class=\"heading-menu\">menu<\/a>\n        <\/div>\n    <\/div>\n    <div class=\"menu-items\" id=\"menu-items\">\n        <ul>\n            <li><a href=\"\/services\">services<\/a><\/li>\n            <li><a href=\"\/work\">work<\/a><\/li>\n            <li><a href=\"\/apps\">apps<\/a><\/li>\n            <li><a href=\"\/contact\">contact<\/a><\/li>\n        <\/ul>\n        <div class=\"close\">\n            <a href=\"#\" id=\"close-toggle\">close<\/a>\n        <\/div>\n    <\/div>\n<\/header>\n<div class=\"selector\"><\/div> <!-- Dieser Abschnitt schrumpft von unten nach oben -->\n\n<script>\n    document.addEventListener('DOMContentLoaded', () => {\n        const header      = document.getElementById('header');\n        const menuToggle  = document.getElementById('menu-toggle');\n        const closeToggle = document.getElementById('close-toggle');\n        const navContent  = document.getElementById('nav-content');\n        const menuItems   = document.getElementById('menu-items');\n\n        \/\/ Header is already visible by default\n        header.classList.add('visible');\n\n        \/\/ Simulate menu open\/close instantly on load to prime the animation\n        menuToggle.click();\n        setTimeout(() => {\n            closeToggle.click();\n        }, 0); \/\/ Minimal delay to allow open animation to start before closing\n\n        \/\/ Men\u00fc-Open\/Close Logik\n        function simulateMenuClicks() {\n            menuToggle.addEventListener('click', (e) => {\n                e.preventDefault();\n                header.classList.add('is-open');\n                setTimeout(() => {\n                    navContent.style.display = 'none';\n                    menuItems.style.display  = 'flex';\n                }, 500);\n            });\n            closeToggle.addEventListener('click', (e) => {\n                e.preventDefault();\n                menuItems.style.display  = 'none';\n                navContent.style.display = 'flex';\n                setTimeout(() => {\n                    header.classList.remove('is-open');\n                }, 50);\n            });\n        }\n        simulateMenuClicks();\n\n        \/\/ Scroll-Handler (only hide when scrolling down, keep visible at top)\n        let lastY = window.pageYOffset;\n        window.addEventListener('scroll', () => {\n            const currentY = window.pageYOffset;\n            if (currentY < lastY) {\n                header.classList.add('visible');\n            } else if (currentY > 0) {\n                header.classList.remove('visible');\n            }\n            lastY = currentY;\n        });\n\n        \/\/ Ensure header stays visible at top on load\n        if (window.pageYOffset === 0) {\n            header.classList.add('visible');\n        }\n    });\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-3583e9e e-con-full e-flex e-con e-parent\" data-id=\"3583e9e\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ae666ed elementor-widget elementor-widget-html\" data-id=\"ae666ed\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"de\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>Unsere Apps - KI-Agentur<\/title>\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r134\/three.min.js\"><\/script>\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/gsap.min.js\"><\/script>\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/ScrollTrigger.min.js\"><\/script>\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n  <style>\n\n    \/* ---------- GLOBAL ---------- *\/\n    * {\n      margin: 0;\n      padding: 0;\n      box-sizing: border-box;\n    }\n    body {\n      font-family: 'Montserrat', sans-serif;\n      background: linear-gradient(135deg, #390879, #000000);\n      color: #ffffff;\n      overflow-x: hidden;\n    }\n    h1, h2, h3 {\n      font-family: 'Playfair Display', sans-serif;\n    }\n    \/* Hero Section *\/\n    #hero {\n      height: 100vh; \/* Adjusted to full height without header offset *\/\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n      align-items: center;\n      position: relative;\n      overflow: hidden;\n    }\n    #hero h1 {\n      font-size: 4rem;\n      color: #B8DF10;\n      text-shadow: 0 0 20px rgba(184, 223, 16, 0.7);\n      z-index: 2;\n      animation: glow 2s ease-in-out infinite alternate;\n    }\n    #hero p {\n      font-size: 1.5rem;\n      color: #ffffff;\n      max-width: 600px;\n      text-align: center;\n      margin-top: 1rem;\n      z-index: 2;\n    }\n    #canvas-container {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      z-index: 1;\n    }\n    @keyframes glow {\n      0% { text-shadow: 0 0 10px rgba(184, 223, 16, 0.7); }\n      100% { text-shadow: 0 0 30px rgba(184, 223, 16, 1); }\n    }\n    \/* Apps Section *\/\n    #apps {\n      padding: 5rem 2rem;\n      background: url('data:image\/svg+xml;utf8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"100\" height=\"100\" viewBox=\"0 0 100 100\"><g stroke=\"%23B8DF10\" stroke-width=\"0.5\" opacity=\"0.2\"><line x1=\"0\" y1=\"0\" x2=\"100\" y2=\"0\" \/><line x1=\"0\" y1=\"20\" x2=\"100\" y2=\"20\" \/><line x1=\"0\" y1=\"40\" x2=\"100\" y2=\"40\" \/><line x1=\"0\" y1=\"60\" x2=\"100\" y2=\"60\" \/><line x1=\"0\" y1=\"80\" x2=\"100\" y2=\"80\" \/><line x1=\"0\" y1=\"0\" x2=\"0\" y2=\"100\" \/><line x1=\"20\" y1=\"0\" x2=\"20\" y2=\"100\" \/><line x1=\"40\" y1=\"0\" x2=\"40\" y2=\"100\" \/><line x1=\"60\" y1=\"0\" x2=\"60\" y2=\"100\" \/><line x1=\"80\" y1=\"0\" x2=\"80\" y2=\"100\" \/><\/g><\/svg>') repeat;\n      background-color: rgba(57, 8, 121, 0.8);\n            box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);\n      backdrop-filter: blur(10px);\n      display: flex;\n      justify-content: center;\n      position: relative;\n    }\n    .apps-container {\n      max-width: 1140px;\n      width: 100%;\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n      gap: 2rem;\n      opacity: 0;\n      transform: translateY(50px);\n    }\n    .app-card {\n      background: rgba(255, 255, 255, 0.1);\n      border: 2px solid #B8DF10;\n      border-radius: 12px;\n      padding: 2rem;\n      text-align: center;\n      transition: all 0.3s ease;\n      position: relative;\n      overflow: hidden;\n      cursor: pointer;\n    }\n    .app-card:hover {\n      transform: scale(1.05);\n      box-shadow: 0 0 20px rgba(184, 223, 16, 0.7);\n      background: rgba(255, 255, 255, 0.2);\n    }\n    .app-card img {\n      width: 100px;\n      height: 100px;\n      border-radius: 12px;\n      margin-bottom: 1rem;\n      object-fit: cover;\n      loading: lazy;\n    }\n    .app-card h3 {\n      font-size: 1.8rem;\n      color: #B8DF10;\n      margin-bottom: 0.5rem;\n    }\n    .app-card p {\n      font-size: 1rem;\n      color: #ffffff;\n      margin-bottom: 1rem;\n    }\n    .app-card .platform {\n      font-size: 0.9rem;\n      color: #B8DF10;\n      font-weight: bold;\n    }\n    .app-card::before {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      background: linear-gradient(45deg, rgba(184, 223, 16, 0.2), rgba(57, 8, 121, 0.2));\n      opacity: 0;\n      transition: opacity 0.3s ease;\n    }\n    .app-card:hover::before {\n      opacity: 1;\n    }\n    \/* Footer Section *\/\n    #footer {\n      padding: 3rem 2rem;\n      text-align: center;\n      background: #390879;\n    }\n    #footer .social-icons {\n      display: flex;\n      justify-content: center;\n      gap: 1.5rem;\n      margin-top: 1rem;\n    }\n    #footer .social-icons a {\n      color: #B8DF10;\n      font-size: 1.5rem;\n      transition: all 0.3s ease;\n    }\n    #footer .social-icons a:hover {\n      color: #ffffff;\n      transform: scale(1.2);\n      text-shadow: 0 0 10px rgba(184, 223, 16, 0.7);\n    }\n    \n    \n          #language-switcher {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  background: linear-gradient(135deg, #B8DF10, #ffffff);\n  color: #390879;\n  font-size: 1.5rem;\n  padding: 12px 16px;\n  border-radius: 50px;\n  box-shadow: 0 0 15px rgba(184, 223, 16, 0.5);\n  cursor: pointer;\n  z-index: 99999;\n  transition: all 0.3s ease-in-out;\n  animation: pulseLangBtn 3s infinite ease-in-out;\n}\n#language-switcher:hover {\n  transform: scale(1.1);\n  box-shadow: 0 0 25px rgba(255, 255, 255, 0.8);\n}\n\n@keyframes pulseLangBtn {\n  0% { box-shadow: 0 0 5px rgba(184,223,16,0.3); }\n  50% { box-shadow: 0 0 20px rgba(184,223,16,0.9); }\n  100% { box-shadow: 0 0 5px rgba(184,223,16,0.3); }\n}\n    \n    \/* Responsive Design *\/\n    @media (max-width: 768px) {\n      #hero h1 {\n        font-size: 2.5rem;\n        text-align: center;\n      }\n      #hero p {\n        font-size: 1.2rem;\n        padding: 0 1rem;\n      }\n      .apps-container {\n        grid-template-columns: 1fr;\n      }\n      .app-card {\n        padding: 1.5rem;\n      }\n      \n          #language-switcher {\n        top: auto;          \/* oben zur\u00fccksetzen *\/\n        right: auto;        \/* rechts zur\u00fccksetzen *\/\n        bottom: 20px;       \/* 20px vom unteren Rand *\/\n        left: 50%;          \/* genau in der Mitte *\/\n        transform: translateX(-50%);  \/* zentrieren *\/\n        font-size: 1.2rem;  \/* evtl. etwas kleiner *\/\n        padding: 8px 12px;  \/* kompakter *\/\n        opacity: 0.85;      \/* leicht transparent, damit es weniger aufdringlich wirkt *\/\n        transition: transform 0.3s ease, opacity 0.3s ease;\n  }\n  \n    #language-switcher.hidden {\n    transform: translate(-50%, 100%);\n    opacity: 0;\n  }\n  \n    \/* und null Hover *\/\n  #language-switcher:hover {\n    transform: translateX(-50%); \/* nur zentriert, keine Skalierung *\/\n    box-shadow: 0 0 15px rgba(184,223,16,0.5);\n  }\n    }\n  <\/style>\n<\/head>\n<body>\n  <!-- Sprache wechseln -->\n  <div id=\"language-switcher\"><i class=\"fas fa-globe\"><\/i><\/div>\n\n  <!-- Hero Section -->\n  <section id=\"hero\">\n    <div id=\"canvas-container\"><\/div>\n    <h1 data-i18n-key=\"heroTitle\">Unsere innovativen Apps<\/h1>\n    <p data-i18n-key=\"heroText\">\n      Entdecke unsere vielf\u00e4ltigen iOS- und macOS-Apps \u2013 von KI-gest\u00fctzten L\u00f6sungen bis hin zu smarten Anwendungen f\u00fcr jeden Bedarf.<br> Wir gestalten die Zukunft der Automatisierung, direkt aus Wien!\n    <\/p>\n  <\/section>\n\n  <!-- Apps Section -->\n  <section id=\"apps\">\n    <div class=\"apps-container\">\n      <div class=\"app-card\">\n        <img decoding=\"async\" src=\"https:\/\/visionbridge.eu\/wp-content\/uploads\/2025\/07\/1024.png\" alt=\"FolderQuickOpener Icon\">\n        <h3 data-i18n-key=\"app1Title\">FolderQuickOpener<\/h3>\n        <p data-i18n-key=\"app1Desc\">\n          Schneller Zugriff auf deine wichtigsten Ordner direkt aus der macOS-Statusleiste. <br>Bis zu f\u00fcnf (free tier) Ordner mit einem Klick \u00f6ffnen \u2013 effizient und unkompliziert!\n        <\/p>\n        <div class=\"platform\">\uf8ff macOS<\/div>\n      <\/div>\n      <div class=\"app-card\">\n        <img decoding=\"async\" src=\"https:\/\/visionbridge.eu\/wp-content\/uploads\/2025\/07\/btc-1-512.png\" alt=\"BTCPriceTracker Icon\">\n        <h3 data-i18n-key=\"app2Title\">BTCPriceTracker<\/h3>\n        <p data-i18n-key=\"app2Desc\">\n          Verfolge den Bitcoin-Preis in Echtzeit direkt aus der macOS-Statusleiste. <br>Gib deine Best\u00e4nde ein und behalte den Wert im Blick \u2013 modern und \u00fcbersichtlich!\n        <\/p>\n        <div class=\"platform\">\uf8ff macOS<\/div>\n      <\/div>\n      <div class=\"app-card\">\n        <img decoding=\"async\" src=\"https:\/\/visionbridge.eu\/wp-content\/uploads\/2025\/07\/cctv.png\" alt=\"MyIPtopBar Icon\">\n        <h3 data-i18n-key=\"app3Title\">MyIPtopBar<\/h3>\n        <p data-i18n-key=\"app3Desc\">\n          Behalte deine VPN-Verbindung im Blick! <br>MyIPtopBar zeigt deine aktuelle IP-Adresse in der macOS-Men\u00fcleiste \u2013 gr\u00fcn f\u00fcr VPN-gesch\u00fctzt, rot f\u00fcr ungesch\u00fctzt.\n        <\/p>\n        <div class=\"platform\">\uf8ff macOS<\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- Footer Section -->\n  <section id=\"footer\">\n    <p data-i18n-key=\"footerText\">Follow us for the latest AI innovations<\/p>\n    <div class=\"social-icons\">\n      <a href=\"#\"><i class=\"fab fa-twitter\"><\/i><\/a>\n      <a href=\"#\"><i class=\"fab fa-linkedin\"><\/i><\/a>\n      <a href=\"#\"><i class=\"fab fa-github\"><\/i><\/a>\n    <\/div>\n  <\/section>\n\n  <script>\n    \/\/ 1) Initial language or fallback\n    let currentLang = localStorage.getItem('lang') || 'de';\n\n    \/\/ 2) All translations\n    const translations = {\n      de: {\n        heroTitle: \"Unsere innovativen Apps\",\n        heroText:  \"Entdecke unsere vielf\u00e4ltigen iOS- und macOS-Apps \u2013 von KI-gest\u00fctzten L\u00f6sungen bis hin zu smarten Anwendungen f\u00fcr jeden Bedarf.<br> Wir gestalten die Zukunft der Automatisierung, direkt aus Wien!\",\n        app1Title: \"FolderQuickOpener\",\n        app1Desc:  \"Schneller Zugriff auf deine wichtigsten Ordner direkt aus der macOS-Statusleiste. <br>Bis zu f\u00fcnf (free tier) Ordner mit einem Klick \u00f6ffnen \u2013 effizient und unkompliziert!\",\n        app2Title: \"BTCPriceTracker\",\n        app2Desc:  \"Verfolge den Bitcoin-Preis in Echtzeit direkt aus der macOS-Statusleiste. <br>Gib deine Best\u00e4nde ein und behalte den Wert im Blick \u2013 modern und \u00fcbersichtlich!\",\n        app3Title: \"MyIPtopBar\",\n        app3Desc:  \"Behalte deine VPN-Verbindung im Blick! <br>MyIPtopBar zeigt deine aktuelle IP-Adresse in der macOS-Men\u00fcleiste \u2013 gr\u00fcn f\u00fcr VPN-gesch\u00fctzt, rot f\u00fcr ungesch\u00fctzt.\",\n        footerText:\"Follow us for the latest AI innovations\"\n      },\n      en: {\n        heroTitle: \"Our Innovative Apps\",\n        heroText:  \"Discover our versatile iOS and macOS apps \u2013 from AI-powered solutions to smart utilities for every need.<br>We shape the future of automation, right from Vienna!\",\n        app1Title: \"FolderQuickOpener\",\n        app1Desc:  \"Quick access to your top folders right from the macOS menu bar.<br>Open up to five (free tier) folders with one click \u2013 efficient and hassle-free!\",\n        app2Title: \"BTCPriceTracker\",\n        app2Desc:  \"Track the Bitcoin price in real-time right from the macOS menu bar.<br>Enter your holdings and monitor the value \u2013 modern and clear!\",\n        app3Title: \"MyIPtopBar\",\n        app3Desc:  \"Keep an eye on your VPN connection!<br>MyIPtopBar displays your current IP address in the macOS menu bar \u2013 green if VPN-protected, red if not.\",\n        footerText:\"Follow us for the latest AI innovations\"\n      }\n    };\n\n    \/\/ 3) Apply translations\n    function applyLanguage() {\n      document.querySelectorAll('[data-i18n-key]').forEach(el => {\n        const key = el.getAttribute('data-i18n-key');\n        el.innerHTML = translations[currentLang][key] || el.innerHTML;\n      });\n      document.documentElement.lang = currentLang;\n    }\n\n    \/\/ 4) Toggle handler\n    document.getElementById('language-switcher').addEventListener('click', () => {\n      currentLang = currentLang === 'de' ? 'en' : 'de';\n      localStorage.setItem('lang', currentLang);\n      applyLanguage();\n    });\n\n    \/\/ 5) On load\n    document.addEventListener('DOMContentLoaded', () => {\n      applyLanguage();\n\n      \/\/ GSAP Hero\n      gsap.from(\"#hero h1\", {\n        opacity: 0,\n        y: 100,\n        duration: 1.5,\n        ease: \"power3.out\"\n      });\n      gsap.from(\"#hero p\", {\n        opacity: 0,\n        y: 50,\n        duration: 1.5,\n        delay: 0.5,\n        ease: \"power3.out\"\n      });\n\n      \/\/ GSAP Apps\n      ScrollTrigger.create({\n        trigger: \"#apps\",\n        start: \"top 80%\",\n        onEnter: () => {\n          gsap.to(\".apps-container\", { opacity: 1, y: 0, duration: 1, ease: \"power3.out\" });\n          gsap.to(\".app-card\",   { opacity: 1, y: 0, duration: 0.8, stagger: 0.2, ease: \"power3.out\" });\n        }\n      });\n\n      \/\/ Three.js Holographic Wave Animation\n      const scene = new THREE.Scene();\n      const camera = new THREE.PerspectiveCamera(75, window.innerWidth \/ window.innerHeight, 0.1, 1000);\n      const renderer = new THREE.WebGLRenderer({ alpha: true });\n      renderer.setSize(window.innerWidth, window.innerHeight);\n      document.getElementById('canvas-container').appendChild(renderer.domElement);\n\n      const particlesGeometry = new THREE.BufferGeometry();\n      const particlesCount    = 1000;\n      const posArray          = new Float32Array(particlesCount * 3);\n      const velocities        = new Float32Array(particlesCount * 3);\n      const amplitudes        = new Float32Array(particlesCount);\n      for (let i = 0; i < particlesCount; i++) {\n        posArray[i * 3]     = (Math.random() - 0.5) * 20;\n        posArray[i * 3 + 1] = (Math.random() - 0.5) * 10;\n        posArray[i * 3 + 2] = (Math.random() - 0.5) * 20;\n        velocities[i * 3]     = (Math.random() - 0.5) * 0.02;\n        velocities[i * 3 + 1] = (Math.random() - 0.5) * 0.02;\n        velocities[i * 3 + 2] = (Math.random() - 0.5) * 0.02;\n        amplitudes[i]         = Math.random() * 0.5 + 0.5;\n      }\n      particlesGeometry.setAttribute('position', new THREE.BufferAttribute(posArray, 3));\n      const particlesMaterial = new THREE.PointsMaterial({\n        size: 0.08,\n        color: 0xB8DF10,\n        transparent: true,\n        opacity: 0.7,\n        blending: THREE.AdditiveBlending\n      });\n      const particlesMesh = new THREE.Points(particlesGeometry, particlesMaterial);\n      scene.add(particlesMesh);\n\n      \/\/ Scroll-driven amplitude control\n      let scrollProgress = 0;\n      ScrollTrigger.create({\n        trigger: '#hero',\n        start: 'top top',\n        end: 'bottom top',\n        onUpdate: (self) => scrollProgress = self.progress\n      });\n\n      \/\/ Mouse\/Touch Interaction\n      let mouseX = 0, mouseY = 0;\n      document.addEventListener('mousemove', (e) => {\n        mouseX = (e.clientX \/ window.innerWidth) * 2 - 1;\n        mouseY = -(e.clientY \/ window.innerHeight) * 2 + 1;\n      });\n      document.addEventListener('touchmove', (e) => {\n        e.preventDefault();\n        const touch = e.touches[0];\n        mouseX = (touch.clientX \/ window.innerWidth) * 2 - 1;\n        mouseY = -(touch.clientY \/ window.innerHeight) * 2 + 1;\n      }, { passive: true });\n\n      camera.position.z = 15;\n      function animate() {\n        requestAnimationFrame(animate);\n        const positions = particlesGeometry.attributes.position.array;\n        const time = Date.now() * 0.001;\n        for (let i = 0; i < particlesCount; i++) {\n          const x = positions[i * 3];\n          const z = positions[i * 3 + 2];\n          \/\/ Wave effect\n          positions[i * 3 + 1] = amplitudes[i] * Math.sin(time + x * 0.5 + z * 0.5) * (1 + scrollProgress);\n          \/\/ Movement\n          positions[i * 3]     += velocities[i * 3];\n          positions[i * 3 + 2] += velocities[i * 3 + 2];\n          \/\/ Bounce off boundaries\n          if (Math.abs(positions[i * 3]) > 10) velocities[i * 3] *= -1;\n          if (Math.abs(positions[i * 3 + 2]) > 10) velocities[i * 3 + 2] *= -1;\n        }\n        particlesGeometry.attributes.position.needsUpdate = true;\n        particlesMesh.rotation.y += 0.001;\n        renderer.render(scene, camera);\n      }\n      animate();\n\n      \/\/ Resize Handler\n      window.addEventListener('resize', () => {\n        camera.aspect = window.innerWidth \/ window.innerHeight;\n        camera.updateProjectionMatrix();\n        renderer.setSize(window.innerWidth, window.innerHeight);\n      });\n    });\n    \n                  \/\/ nur auf Mobilen aktivieren\n    if (window.matchMedia(\"(max-width: 768px)\").matches) {\n      let lastScroll = window.pageYOffset;\n      const langBtn   = document.getElementById(\"language-switcher\");\n      window.addEventListener(\"scroll\", () => {\n        const current = window.pageYOffset;\n        if (current > lastScroll) {\n          \/\/ runterscrollen \u2192 einklappen\n          langBtn.classList.add(\"hidden\");\n        } else {\n          \/\/ hochscrollen \u2192 wieder ausfahren\n          langBtn.classList.remove(\"hidden\");\n        }\n        lastScroll = current <= 0 ? 0 : current;\n      }, { passive: true });\n    }\n  <\/script>\n<\/body>\n<\/html>\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-dde1d00 e-con-full e-flex e-con e-parent\" data-id=\"dde1d00\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6a2fa5a elementor-widget elementor-widget-html\" data-id=\"6a2fa5a\" data-element_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=\"visionbridge-footer\">\n  <div class=\"footer-grid\">\n    <div class=\"footer-logo\">\n      <img decoding=\"async\" src=\"https:\/\/visionbridge.eu\/wp-content\/uploads\/2024\/09\/white_version2_150.png\" alt=\"VisionBridge Logo\" class=\"footer-logo-img\">\n    <\/div>\n    <div class=\"footer-info\">\n      <h3>Kontakt<\/h3>\n      <p><a href=\"mailto:connect@visionbridge.eu\">connect@visionbridge.eu<\/a><\/p>\n<p>Tel: <a href=\"tel:+436648342424\">+43 664 8342424<\/a><\/p>\n      <p>Klagenfurt, \u00d6sterreich<\/p>\n    <\/div>\n    <div class=\"footer-links\">\n      <h3>Navigation<\/h3>\n      <ul>\n        <li><a href=\"\/apps\">Apps<\/a><\/li>\n        <li><a href=\"\/contact\">Kontakt<\/a><\/li>\n        <li><a href=\"\/services\">Services<\/a><\/li>\n        <li><a href=\"\/work\">Work<\/a><\/li>\n        <li><a href=\"\/playground\">Playground \ud83c\udfa1<\/a><\/li>\n      <\/ul>\n    <\/div>\n    <div class=\"footer-legal\">\n      <h3>Rechtliches<\/h3>\n      <ul>\n        <li><a href=\"\/impressum\">Impressum<\/a><\/li>\n        <li><a href=\"\/datenschutz\">Datenschutz<\/a><\/li>\n      <\/ul>\n    <\/div>\n  <\/div>\n  <div class=\"footer-bottom\">\n    <p>\u00a9 2025 VisionBridge. Alle Rechte vorbehalten. <br>Programmiert von <a href=\"mailto:dev@stefane9.pro\">stefane9 \ud83e\udd77<\/a><\/p>\n  <\/div>\n<\/div>\n<style>\n  .footer-legal {\n    text-align: center;\n  }\n  .footer-legal h3 {\n    font-family: 'Playfair Display', sans-serif;\n    color: #B8DF10;\n    font-size: 1.3rem;\n    margin-bottom: 0.6rem;\n    text-shadow: 0 0 10px rgba(184, 223, 16, 0.6);\n  }\n  .footer-legal ul {\n    list-style: none;\n    padding: 0;\n    margin: 0;\n  }\n  .footer-legal ul li {\n    padding: 0.3rem 0;\n    opacity: 0.8;\n    transition: opacity 0.3s ease;\n    display: block; \/* \u00c4nderung: Untereinander statt nebeneinander *\/\n  }\n  .footer-legal ul li a {\n    color: #ffffff;\n    text-decoration: none;\n  }\n  .footer-legal ul li:hover {\n    opacity: 1;\n  }\n  .footer-legal ul li a:hover {\n    color: #B8DF10;\n    text-shadow: 0 0 8px rgba(184, 223, 16, 0.5);\n  }\n  .visionbridge-footer {\n    background: linear-gradient(135deg, #2a065e, #390879);\n    color: #ffffff;\n    padding: 2rem 1rem;\n    font-family: 'Montserrat', sans-serif;\n    position: relative;\n    overflow: hidden;\n    box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);\n  }\n  .footer-grid {\n    display: grid;\n    grid-template-columns: minmax(150px, auto) repeat(3, 1fr); \/* Logo etwas kleiner *\/\n    gap: 2rem;\n    max-width: 1200px;\n    margin: 0 auto;\n    text-align: center;\n    padding: 2rem 0;\n    align-items: start; \/* Alle Inhalte beginnen auf der gleichen H\u00f6he *\/\n  }\n  .footer-logo {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    padding: 1rem 0;\n  }\n  .footer-logo-img {\n    max-height: 40px; \/* Logo verkleinert f\u00fcr besseren Abstand *\/\n    width: auto;\n    transition: transform 0.3s ease;\n  }\n  .footer-logo-img:hover {\n    transform: scale(1.1);\n  }\n  .footer-info h3, .footer-links h3, .footer-legal h3 {\n    font-family: 'Playfair Display', sans-serif;\n    color: #B8DF10;\n    font-size: 1.4rem;\n    margin-bottom: 0.8rem;\n    text-shadow: 0 0 12px rgba(184, 223, 16, 0.7);\n    text-align: center; \/* Mittige Ausrichtung der \u00dcberschriften *\/\n  }\n  .footer-info p {\n    margin: 0.5rem 0;\n    font-size: 0.9rem;\n    opacity: 0.9;\n    transition: opacity 0.3s ease;\n    text-align: center; \/* Mittige Ausrichtung des Textes *\/\n  }\n  .footer-info p:hover {\n    opacity: 1;\n    color: #B8DF10;\n  }\n  .footer-info p a {\n    color: #B8DF10;\n    text-decoration: none;\n  }\n  .footer-info p a:hover {\n    color: #ffffff;\n    text-shadow: 0 0 10px rgba(184, 223, 16, 0.7);\n  }\n  .footer-links ul, .footer-legal ul {\n    list-style: none;\n    padding: 0;\n    margin: 0;\n    text-align: center; \/* Mittige Ausrichtung der Listen *\/\n  }\n  .footer-links ul li, .footer-legal ul li {\n    padding: 0.4rem 0;\n    opacity: 0.8;\n    transition: opacity 0.3s ease;\n    display: block; \/* \u00c4nderung: Untereinander statt nebeneinander *\/\n  }\n  .footer-links ul li a, .footer-legal ul li a {\n    color: #ffffff;\n    text-decoration: none;\n  }\n  .footer-links ul li:hover, .footer-legal ul li:hover {\n    opacity: 1;\n  }\n  .footer-links ul li a:hover, .footer-legal ul li a:hover {\n    color: #B8DF10;\n    text-shadow: 0 0 10px rgba(184, 223, 16, 0.6);\n  }\n  .footer-bottom {\n    text-align: center;\n    margin-top: 1.5rem;\n    font-size: 0.75rem;\n    opacity: 0.7;\n    padding-top: 0.7rem;\n    border-top: 1px solid rgba(184, 223, 16, 0.3);\n    transition: opacity 0.3s ease;\n  }\n  .footer-bottom:hover {\n    opacity: 1;\n  }\n  .footer-bottom a {\n    color: #B8DF10;\n    text-decoration: none;\n  }\n  .footer-bottom a:hover {\n    color: #ffffff;\n    text-shadow: 0 0 12px rgba(184, 223, 16, 0.8);\n  }\n  \n  #footer-glow {\n      display:none;\n  }\n\n  \/* Responsive Design *\/\n  @media (max-width: 768px) {\n    .footer-grid {\n      grid-template-columns: 1fr;\n    }\n    .footer-info h3, .footer-links h3, .footer-legal h3 {\n      font-size: 1.1rem;\n    }\n    .footer-info p {\n      font-size: 0.8rem;\n    }\n    .footer-links ul li, .footer-legal ul li {\n      font-size: 0.75rem;\n      display: block; \/* Auf Mobile bleibt es untereinander *\/\n    }\n    .footer-logo-img {\n      max-height: 30px;\n    }\n    .footer-grid {\n      padding: 1rem 0;\n    }\n  }\n  @media (min-width: 769px) and (max-width: 1024px) {\n    .footer-grid {\n      grid-template-columns: repeat(2, 1fr);\n    }\n    .footer-info h3, .footer-links h3, .footer-legal h3 {\n      font-size: 1.2rem;\n    }\n    .footer-info p {\n      font-size: 0.85rem;\n    }\n    .footer-links ul li, .footer-legal ul li {\n      font-size: 0.8rem;\n      display: block; \/* Auf Tablet auch untereinander *\/\n    }\n    .footer-logo-img {\n      max-height: 35px;\n    }\n  }\n  @media (min-width: 1025px) {\n    .footer-grid {\n      grid-template-columns: minmax(150px, auto) repeat(3, 1fr); \/* Logo angepasst *\/\n    }\n    .footer-logo {\n      padding: 1rem 0;\n    }\n    .footer-logo-img {\n      max-height: 50px; \/* Verkleinertes Logo auf Desktop *\/\n    }\n  }\n<\/style>\n<script>\n  \/\/ Subtle Glow Animation for Footer Background\n  const footer = document.querySelector('.visionbridge-footer');\n  const canvas = document.createElement('canvas');\n  canvas.id = 'footer-glow';\n  footer.insertBefore(canvas, footer.firstChild);\n  const ctx = canvas.getContext('2d');\n\n  function resizeCanvas() {\n    canvas.width = footer.offsetWidth;\n    canvas.height = footer.offsetHeight;\n  }\n  window.addEventListener('resize', resizeCanvas);\n  resizeCanvas();\n\n  function drawGlow() {\n    ctx.clearRect(0, 0, canvas.width, canvas.height);\n    const gradient = ctx.createRadialGradient(\n      canvas.width \/ 2, canvas.height \/ 2, 0,\n      canvas.width \/ 2, canvas.height \/ 2, canvas.width \/ 2\n    );\n    gradient.addColorStop(0, 'rgba(184, 223, 16, 0.15)');\n    gradient.addColorStop(1, 'rgba(57, 8, 121, 0)');\n    ctx.fillStyle = gradient;\n    ctx.fillRect(0, 0, canvas.width, canvas.height);\n    requestAnimationFrame(drawGlow);\n  }\n  drawGlow();\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>services work apps contact visionbridge menu services work apps contact close Unsere Apps &#8211; KI-Agentur Unsere innovativen Apps Entdecke unsere vielf\u00e4ltigen iOS- und macOS-Apps \u2013 von KI-gest\u00fctzten L\u00f6sungen bis hin zu smarten Anwendungen f\u00fcr jeden Bedarf. Wir gestalten die Zukunft der Automatisierung, direkt aus Wien! FolderQuickOpener Schneller Zugriff auf deine wichtigsten Ordner direkt aus der [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-5231","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/visionbridge.eu\/index.php?rest_route=\/wp\/v2\/pages\/5231","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/visionbridge.eu\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/visionbridge.eu\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/visionbridge.eu\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/visionbridge.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5231"}],"version-history":[{"count":155,"href":"https:\/\/visionbridge.eu\/index.php?rest_route=\/wp\/v2\/pages\/5231\/revisions"}],"predecessor-version":[{"id":7645,"href":"https:\/\/visionbridge.eu\/index.php?rest_route=\/wp\/v2\/pages\/5231\/revisions\/7645"}],"wp:attachment":[{"href":"https:\/\/visionbridge.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5231"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}