Personal Portfolio \u2013 Lighter Concept<\/title>\r\n <meta name=\"description\" content=\"Lighter - Creative & Digital Agency Minimalist Portfolio\">\r\n \r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n fontFamily: {\r\n sans: ['Arial', 'Helvetica', 'sans-serif'],\r\n },\r\n colors: {\r\n brandBg: '#fafafa',\r\n brandLine: '#e5e5e5'\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n \r\n <style>\r\n \/* Institutionelle Typografie & Border-System-Feinheiten *\/\r\n .text-giant {\r\n font-size: clamp(2.5rem, 8vw, 6.5rem);\r\n line-height: 0.9;\r\n }\r\n .nav-link-anim {\r\n position: relative;\r\n }\r\n .nav-link-anim::after {\r\n content: '';\r\n position: absolute;\r\n width: 100%;\r\n transform: scaleX(0);\r\n height: 1px;\r\n bottom: -2px;\r\n left: 0;\r\n background-color: #000;\r\n transform-origin: bottom right;\r\n transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n }\r\n .nav-link-anim:hover::after {\r\n transform: scaleX(1);\r\n transform-origin: bottom left;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-brandBg text-black font-sans antialiased selection:bg-black selection:text-white\">\r\n\r\n <header class=\"fixed top-0 left-0 w-full bg-brandBg\/80 backdrop-blur-md border-b border-gray-200 z-50\">\r\n <div class=\"max-w-7xl mx-auto px-6 h-24 flex items-center justify-between\">\r\n <a href=\"#\" class=\"text-xl font-black tracking-tighter uppercase\">\r\n Mike <span class=\"font-normal text-gray-400\">Horst<\/span>\r\n <\/a>\r\n \r\n <nav class=\"hidden md:flex items-center space-x-10 text-xs font-bold tracking-widest uppercase text-gray-500\">\r\n <a href=\"#about\" class=\"nav-link-anim text-black\">\u00dcber mich<\/a>\r\n <a href=\"#works\" class=\"nav-link-anim hover:text-black\">Projekte<\/a>\r\n <a href=\"#services\" class=\"nav-link-anim hover:text-black\">Leistungen<\/a>\r\n <\/nav>\r\n\r\n <div>\r\n <a href=\"#contact\" class=\"inline-block text-[11px] font-bold tracking-widest uppercase border border-black px-6 py-3.5 hover:bg-black hover:text-white transition-colors duration-300\">\r\n Gespr\u00e4ch Buchen\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/header>\r\n\r\n <main class=\"pt-24\">\r\n\r\n <section id=\"about\" class=\"pt-24 pb-20 border-b border-gray-200\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n \r\n <div class=\"flex flex-wrap gap-2.5 mb-12 text-[10px] font-bold tracking-widest uppercase text-black\">\r\n <span class=\"border border-gray-300 px-3 py-1.5 bg-white\">Branding<\/span>\r\n <span class=\"border border-gray-300 px-3 py-1.5 bg-white\">UI\/UX Design<\/span>\r\n <span class=\"border border-gray-300 px-3 py-1.5 bg-white\">Creative Direction<\/span>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-12 gap-8 items-start\">\r\n <div class=\"lg:col-span-9\">\r\n <h1 class=\"text-giant font-black tracking-tighter uppercase text-black\">\r\n Projekte <br \/> die Strukturen <br \/> erz\u00e4hlen.\r\n <\/h1>\r\n <\/div>\r\n <div class=\"lg:col-span-3 text-xs text-gray-500 font-medium tracking-wide space-y-4 pt-4 lg:border-t lg:border-black\">\r\n <div class=\"flex items-center gap-2\">\r\n <span class=\"w-1.5 h-1.5 bg-black rounded-full animate-pulse\"><\/span>\r\n <span class=\"uppercase font-bold tracking-wider text-black\">Standort<\/span>\r\n <\/div>\r\n <p class=\"text-gray-600\">Verf\u00fcgbar f\u00fcr internationale Mandate und strategische Partnerschaften.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-20 max-w-3xl\">\r\n <p class=\"text-xl md:text-3xl text-gray-900 font-light leading-relaxed\">\r\n Ich konzipiere intuitive Daten-Interfaces und klare visuelle Identit\u00e4ten, die technologische Innovationen und komplexe Systeme verst\u00e4ndlich auf den Punkt bringen.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"works\" class=\"py-24 md:py-32 bg-white border-b border-gray-200\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n \r\n <div class=\"flex items-baseline justify-between mb-20 border-b border-black pb-4\">\r\n <h2 class=\"text-xs font-bold tracking-widest uppercase text-gray-400\">Ausgew\u00e4hlte Case Studies<\/h2>\r\n <span class=\"text-sm font-mono text-gray-400\">\/26<\/span>\r\n <\/div>\r\n\r\n <div class=\"space-y-32\">\r\n \r\n <article class=\"group grid grid-cols-1 lg:grid-cols-12 gap-12 items-center\">\r\n <div class=\"lg:col-span-7 aspect-[16\/10] bg-brandBg border border-gray-200 overflow-hidden flex items-center justify-center relative group-hover:border-black transition-colors duration-500\">\r\n <div class=\"text-center p-8\">\r\n <span class=\"text-xs font-mono text-gray-400 uppercase tracking-widest block mb-2\">[ Interface Mockup ]<\/span>\r\n <span class=\"text-lg font-bold uppercase tracking-tight block\">Luma Health Application<\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:col-span-5 flex flex-col justify-between h-full py-4\">\r\n <div>\r\n <span class=\"text-[10px] font-mono uppercase tracking-widest text-gray-400 block mb-2\">01 \/ UI\/UX Design<\/span>\r\n <h3 class=\"text-3xl font-bold uppercase tracking-tight text-black mb-4 group-hover:underline decoration-1\">\r\n Luma Health App\r\n <\/h3>\r\n <p class=\"text-gray-600 text-sm leading-relaxed max-w-md\">\r\n Plattform\u00fcbergreifendes Interface-System zur pr\u00e4zisen Erfassung und Visualisierung komplexer medizinischer Daten und Biomarker.\r\n <\/p>\r\n <\/div>\r\n <div class=\"mt-8 grid grid-cols-2 gap-4 pt-6 border-t border-gray-100 text-[11px] font-mono uppercase text-gray-500\">\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Industrie<\/span>\r\n Healthcare & Medicine\r\n <\/div>\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Jahr<\/span>\r\n 2026\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"group grid grid-cols-1 lg:grid-cols-12 gap-12 items-center\">\r\n <div class=\"lg:col-span-7 lg:order-2 aspect-[16\/10] bg-brandBg border border-gray-200 overflow-hidden flex items-center justify-center relative group-hover:border-black transition-colors duration-500\">\r\n <div class=\"text-center p-8\">\r\n <span class=\"text-xs font-mono text-gray-400 uppercase tracking-widest block mb-2\">[ Identity Mockup ]<\/span>\r\n <span class=\"text-lg font-bold uppercase tracking-tight block\">Horizon Corporate System<\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:col-span-5 lg:order-1 flex flex-col justify-between h-full py-4\">\r\n <div>\r\n <span class=\"text-[10px] font-mono uppercase tracking-widest text-gray-400 block mb-2\">02 \/ Corporate Identity<\/span>\r\n <h3 class=\"text-3xl font-bold uppercase tracking-tight text-black mb-4 group-hover:underline decoration-1\">\r\n Horizon Finance Rebrand\r\n <\/h3>\r\n <p class=\"text-gray-600 text-sm leading-relaxed max-w-md\">\r\n Institutioneller Markenauftritt und reduziertes Corporate Design f\u00fcr ein europ\u00e4isches Fintech-\u00d6kosystem.\r\n <\/p>\r\n <\/div>\r\n <div class=\"mt-8 grid grid-cols-2 gap-4 pt-6 border-t border-gray-100 text-[11px] font-mono uppercase text-gray-500\">\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Industrie<\/span>\r\n Fintech \/ Venture Capital\r\n <\/div>\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Leistung<\/span>\r\n Creative Direction\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"services\" class=\"py-24 md:py-32 bg-brandBg\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n \r\n <div class=\"flex items-baseline justify-between mb-20 border-b border-gray-300 pb-4\">\r\n <h2 class=\"text-xs font-bold tracking-widest uppercase text-gray-400\">Leistungsspektrum<\/h2>\r\n <span class=\"text-sm font-mono text-gray-400\">(Expertise)<\/span>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-12 gap-12\">\r\n <div class=\"lg:col-span-4\">\r\n <h3 class=\"text-3xl font-black uppercase tracking-tight leading-tight text-black\">\r\n Strategische <br \/> L\u00f6sungen.\r\n <\/h3>\r\n <p class=\"text-sm text-gray-500 mt-4 max-w-xs leading-relaxed\">\r\n Kombination aus analytischer Pr\u00e4zision und kompromissloser minimalistischer \u00c4sthetik.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"lg:col-span-8 divide-y divide-gray-300 border-t border-b border-gray-300\">\r\n \r\n <div class=\"py-8 grid grid-cols-1 md:grid-cols-12 gap-4 items-baseline group hover:bg-gray-100\/60 px-4 transition-colors duration-200\">\r\n <span class=\"text-xs font-mono text-gray-400 md:col-span-2\">(01)<\/span>\r\n <h4 class=\"text-lg font-bold uppercase tracking-tight md:col-span-4 text-black\">Brand Identity<\/h4>\r\n <p class=\"text-sm text-gray-600 md:col-span-6 leading-relaxed\">\r\n Entwicklung stringenter Markenrichtlinien, Typografie-Systeme und Asset-Bibliotheken f\u00fcr institutionelle Plattformen.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"py-8 grid grid-cols-1 md:grid-cols-12 gap-4 items-baseline group hover:bg-gray-100\/60 px-4 transition-colors duration-200\">\r\n <span class=\"text-xs font-mono text-gray-400 md:col-span-2\">(02)<\/span>\r\n <h4 class=\"text-lg font-bold uppercase tracking-tight md:col-span-4 text-black\">UI\/UX Design<\/h4>\r\n <p class=\"text-sm text-gray-600 md:col-span-6 leading-relaxed\">\r\n Konzeption hochperformanter Architekturen, RAG-Dashboards und responsiver Benutzeroberfl\u00e4chen f\u00fcr datenintensive Anwendungen.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"py-8 grid grid-cols-1 md:grid-cols-12 gap-4 items-baseline group hover:bg-gray-100\/60 px-4 transition-colors duration-200\">\r\n <span class=\"text-xs font-mono text-gray-400 md:col-span-2\">(03)<\/span>\r\n <h4 class=\"text-lg font-bold uppercase tracking-tight md:col-span-4 text-black\">Creative Direction<\/h4>\r\n <p class=\"text-sm text-gray-600 md:col-span-6 leading-relaxed\">\r\n Ganzheitliche Betreuung digitaler Produkte \u2013 von der initialen Struktur-Analyse bis zur finalen Deployment-\u00dcberwachung.\r\n <\/p>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <\/main>\r\n\r\n <footer id=\"contact\" class=\"bg-black text-white py-24\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n <div class=\"flex flex-col md:flex-row justify-between items-start md:items-center gap-12\">\r\n <div>\r\n <span class=\"text-[10px] font-mono text-gray-500 uppercase tracking-widest block mb-3\">N\u00e4chste Schritte<\/span>\r\n <h3 class=\"text-3xl md:text-4xl font-bold uppercase tracking-tight\">Kollaboration initiieren.<\/h3>\r\n <\/div>\r\n <div>\r\n <a href=\"#\" class=\"inline-block text-xs font-bold tracking-widest uppercase bg-white text-black px-8 py-4 hover:bg-gray-200 transition-colors duration-200\">\r\n Verbindung Aufbauen\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"mt-24 pt-8 border-t border-zinc-900 flex flex-col sm:flex-row justify-between gap-4 text-[11px] font-mono text-gray-600\">\r\n <span>© 2026 Mike Horst. Alle Rechte vorbehalten.<\/span>\r\n <span class=\"uppercase tracking-wider\">Due-Diligence Aesthetic \/\/ Clean Architecture<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\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>Personal Portfolio \u2013 Lighter Concept Mike Horst \u00dcber mich Projekte Leistungen Gespr\u00e4ch Buchen Branding UI\/UX Design Creative Direction Projekte die Strukturen erz\u00e4hlen. Standort Verf\u00fcgbar f\u00fcr internationale Mandate und strategische Partnerschaften. Ich konzipiere intuitive Daten-Interfaces und klare visuelle Identit\u00e4ten, die technologische Innovationen und komplexe Systeme verst\u00e4ndlich auf den Punkt bringen. Ausgew\u00e4hlte Case Studies \/26 Interface Mockup Luma Health Application …<\/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-16","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages\/16","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aiq.ventures\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16"}],"version-history":[{"count":5,"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions"}],"predecessor-version":[{"id":33,"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions\/33"}],"wp:attachment":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Personal Portfolio \u2013 Lighter Concept<\/title>\r\n <meta name=\"description\" content=\"Lighter - Creative & Digital Agency Minimalist Portfolio\">\r\n \r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n fontFamily: {\r\n sans: ['Arial', 'Helvetica', 'sans-serif'],\r\n },\r\n colors: {\r\n brandBg: '#fafafa',\r\n brandLine: '#e5e5e5'\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n \r\n <style>\r\n \/* Institutionelle Typografie & Border-System-Feinheiten *\/\r\n .text-giant {\r\n font-size: clamp(2.5rem, 8vw, 6.5rem);\r\n line-height: 0.9;\r\n }\r\n .nav-link-anim {\r\n position: relative;\r\n }\r\n .nav-link-anim::after {\r\n content: '';\r\n position: absolute;\r\n width: 100%;\r\n transform: scaleX(0);\r\n height: 1px;\r\n bottom: -2px;\r\n left: 0;\r\n background-color: #000;\r\n transform-origin: bottom right;\r\n transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n }\r\n .nav-link-anim:hover::after {\r\n transform: scaleX(1);\r\n transform-origin: bottom left;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-brandBg text-black font-sans antialiased selection:bg-black selection:text-white\">\r\n\r\n <header class=\"fixed top-0 left-0 w-full bg-brandBg\/80 backdrop-blur-md border-b border-gray-200 z-50\">\r\n <div class=\"max-w-7xl mx-auto px-6 h-24 flex items-center justify-between\">\r\n <a href=\"#\" class=\"text-xl font-black tracking-tighter uppercase\">\r\n Mike <span class=\"font-normal text-gray-400\">Horst<\/span>\r\n <\/a>\r\n \r\n <nav class=\"hidden md:flex items-center space-x-10 text-xs font-bold tracking-widest uppercase text-gray-500\">\r\n <a href=\"#about\" class=\"nav-link-anim text-black\">\u00dcber mich<\/a>\r\n <a href=\"#works\" class=\"nav-link-anim hover:text-black\">Projekte<\/a>\r\n <a href=\"#services\" class=\"nav-link-anim hover:text-black\">Leistungen<\/a>\r\n <\/nav>\r\n\r\n <div>\r\n <a href=\"#contact\" class=\"inline-block text-[11px] font-bold tracking-widest uppercase border border-black px-6 py-3.5 hover:bg-black hover:text-white transition-colors duration-300\">\r\n Gespr\u00e4ch Buchen\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/header>\r\n\r\n <main class=\"pt-24\">\r\n\r\n <section id=\"about\" class=\"pt-24 pb-20 border-b border-gray-200\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n \r\n <div class=\"flex flex-wrap gap-2.5 mb-12 text-[10px] font-bold tracking-widest uppercase text-black\">\r\n <span class=\"border border-gray-300 px-3 py-1.5 bg-white\">Branding<\/span>\r\n <span class=\"border border-gray-300 px-3 py-1.5 bg-white\">UI\/UX Design<\/span>\r\n <span class=\"border border-gray-300 px-3 py-1.5 bg-white\">Creative Direction<\/span>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-12 gap-8 items-start\">\r\n <div class=\"lg:col-span-9\">\r\n <h1 class=\"text-giant font-black tracking-tighter uppercase text-black\">\r\n Projekte <br \/> die Strukturen <br \/> erz\u00e4hlen.\r\n <\/h1>\r\n <\/div>\r\n <div class=\"lg:col-span-3 text-xs text-gray-500 font-medium tracking-wide space-y-4 pt-4 lg:border-t lg:border-black\">\r\n <div class=\"flex items-center gap-2\">\r\n <span class=\"w-1.5 h-1.5 bg-black rounded-full animate-pulse\"><\/span>\r\n <span class=\"uppercase font-bold tracking-wider text-black\">Standort<\/span>\r\n <\/div>\r\n <p class=\"text-gray-600\">Verf\u00fcgbar f\u00fcr internationale Mandate und strategische Partnerschaften.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-20 max-w-3xl\">\r\n <p class=\"text-xl md:text-3xl text-gray-900 font-light leading-relaxed\">\r\n Ich konzipiere intuitive Daten-Interfaces und klare visuelle Identit\u00e4ten, die technologische Innovationen und komplexe Systeme verst\u00e4ndlich auf den Punkt bringen.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"works\" class=\"py-24 md:py-32 bg-white border-b border-gray-200\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n \r\n <div class=\"flex items-baseline justify-between mb-20 border-b border-black pb-4\">\r\n <h2 class=\"text-xs font-bold tracking-widest uppercase text-gray-400\">Ausgew\u00e4hlte Case Studies<\/h2>\r\n <span class=\"text-sm font-mono text-gray-400\">\/26<\/span>\r\n <\/div>\r\n\r\n <div class=\"space-y-32\">\r\n \r\n <article class=\"group grid grid-cols-1 lg:grid-cols-12 gap-12 items-center\">\r\n <div class=\"lg:col-span-7 aspect-[16\/10] bg-brandBg border border-gray-200 overflow-hidden flex items-center justify-center relative group-hover:border-black transition-colors duration-500\">\r\n <div class=\"text-center p-8\">\r\n <span class=\"text-xs font-mono text-gray-400 uppercase tracking-widest block mb-2\">[ Interface Mockup ]<\/span>\r\n <span class=\"text-lg font-bold uppercase tracking-tight block\">Luma Health Application<\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:col-span-5 flex flex-col justify-between h-full py-4\">\r\n <div>\r\n <span class=\"text-[10px] font-mono uppercase tracking-widest text-gray-400 block mb-2\">01 \/ UI\/UX Design<\/span>\r\n <h3 class=\"text-3xl font-bold uppercase tracking-tight text-black mb-4 group-hover:underline decoration-1\">\r\n Luma Health App\r\n <\/h3>\r\n <p class=\"text-gray-600 text-sm leading-relaxed max-w-md\">\r\n Plattform\u00fcbergreifendes Interface-System zur pr\u00e4zisen Erfassung und Visualisierung komplexer medizinischer Daten und Biomarker.\r\n <\/p>\r\n <\/div>\r\n <div class=\"mt-8 grid grid-cols-2 gap-4 pt-6 border-t border-gray-100 text-[11px] font-mono uppercase text-gray-500\">\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Industrie<\/span>\r\n Healthcare & Medicine\r\n <\/div>\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Jahr<\/span>\r\n 2026\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"group grid grid-cols-1 lg:grid-cols-12 gap-12 items-center\">\r\n <div class=\"lg:col-span-7 lg:order-2 aspect-[16\/10] bg-brandBg border border-gray-200 overflow-hidden flex items-center justify-center relative group-hover:border-black transition-colors duration-500\">\r\n <div class=\"text-center p-8\">\r\n <span class=\"text-xs font-mono text-gray-400 uppercase tracking-widest block mb-2\">[ Identity Mockup ]<\/span>\r\n <span class=\"text-lg font-bold uppercase tracking-tight block\">Horizon Corporate System<\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:col-span-5 lg:order-1 flex flex-col justify-between h-full py-4\">\r\n <div>\r\n <span class=\"text-[10px] font-mono uppercase tracking-widest text-gray-400 block mb-2\">02 \/ Corporate Identity<\/span>\r\n <h3 class=\"text-3xl font-bold uppercase tracking-tight text-black mb-4 group-hover:underline decoration-1\">\r\n Horizon Finance Rebrand\r\n <\/h3>\r\n <p class=\"text-gray-600 text-sm leading-relaxed max-w-md\">\r\n Institutioneller Markenauftritt und reduziertes Corporate Design f\u00fcr ein europ\u00e4isches Fintech-\u00d6kosystem.\r\n <\/p>\r\n <\/div>\r\n <div class=\"mt-8 grid grid-cols-2 gap-4 pt-6 border-t border-gray-100 text-[11px] font-mono uppercase text-gray-500\">\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Industrie<\/span>\r\n Fintech \/ Venture Capital\r\n <\/div>\r\n <div>\r\n <span class=\"block text-[9px] text-gray-400 tracking-wider\">Leistung<\/span>\r\n Creative Direction\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"services\" class=\"py-24 md:py-32 bg-brandBg\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n \r\n <div class=\"flex items-baseline justify-between mb-20 border-b border-gray-300 pb-4\">\r\n <h2 class=\"text-xs font-bold tracking-widest uppercase text-gray-400\">Leistungsspektrum<\/h2>\r\n <span class=\"text-sm font-mono text-gray-400\">(Expertise)<\/span>\r\n <\/div>\r\n\r\n <div class=\"grid grid-cols-1 lg:grid-cols-12 gap-12\">\r\n <div class=\"lg:col-span-4\">\r\n <h3 class=\"text-3xl font-black uppercase tracking-tight leading-tight text-black\">\r\n Strategische <br \/> L\u00f6sungen.\r\n <\/h3>\r\n <p class=\"text-sm text-gray-500 mt-4 max-w-xs leading-relaxed\">\r\n Kombination aus analytischer Pr\u00e4zision und kompromissloser minimalistischer \u00c4sthetik.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"lg:col-span-8 divide-y divide-gray-300 border-t border-b border-gray-300\">\r\n \r\n <div class=\"py-8 grid grid-cols-1 md:grid-cols-12 gap-4 items-baseline group hover:bg-gray-100\/60 px-4 transition-colors duration-200\">\r\n <span class=\"text-xs font-mono text-gray-400 md:col-span-2\">(01)<\/span>\r\n <h4 class=\"text-lg font-bold uppercase tracking-tight md:col-span-4 text-black\">Brand Identity<\/h4>\r\n <p class=\"text-sm text-gray-600 md:col-span-6 leading-relaxed\">\r\n Entwicklung stringenter Markenrichtlinien, Typografie-Systeme und Asset-Bibliotheken f\u00fcr institutionelle Plattformen.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"py-8 grid grid-cols-1 md:grid-cols-12 gap-4 items-baseline group hover:bg-gray-100\/60 px-4 transition-colors duration-200\">\r\n <span class=\"text-xs font-mono text-gray-400 md:col-span-2\">(02)<\/span>\r\n <h4 class=\"text-lg font-bold uppercase tracking-tight md:col-span-4 text-black\">UI\/UX Design<\/h4>\r\n <p class=\"text-sm text-gray-600 md:col-span-6 leading-relaxed\">\r\n Konzeption hochperformanter Architekturen, RAG-Dashboards und responsiver Benutzeroberfl\u00e4chen f\u00fcr datenintensive Anwendungen.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"py-8 grid grid-cols-1 md:grid-cols-12 gap-4 items-baseline group hover:bg-gray-100\/60 px-4 transition-colors duration-200\">\r\n <span class=\"text-xs font-mono text-gray-400 md:col-span-2\">(03)<\/span>\r\n <h4 class=\"text-lg font-bold uppercase tracking-tight md:col-span-4 text-black\">Creative Direction<\/h4>\r\n <p class=\"text-sm text-gray-600 md:col-span-6 leading-relaxed\">\r\n Ganzheitliche Betreuung digitaler Produkte \u2013 von der initialen Struktur-Analyse bis zur finalen Deployment-\u00dcberwachung.\r\n <\/p>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <\/main>\r\n\r\n <footer id=\"contact\" class=\"bg-black text-white py-24\">\r\n <div class=\"max-w-7xl mx-auto px-6\">\r\n <div class=\"flex flex-col md:flex-row justify-between items-start md:items-center gap-12\">\r\n <div>\r\n <span class=\"text-[10px] font-mono text-gray-500 uppercase tracking-widest block mb-3\">N\u00e4chste Schritte<\/span>\r\n <h3 class=\"text-3xl md:text-4xl font-bold uppercase tracking-tight\">Kollaboration initiieren.<\/h3>\r\n <\/div>\r\n <div>\r\n <a href=\"#\" class=\"inline-block text-xs font-bold tracking-widest uppercase bg-white text-black px-8 py-4 hover:bg-gray-200 transition-colors duration-200\">\r\n Verbindung Aufbauen\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"mt-24 pt-8 border-t border-zinc-900 flex flex-col sm:flex-row justify-between gap-4 text-[11px] font-mono text-gray-600\">\r\n <span>© 2026 Mike Horst. Alle Rechte vorbehalten.<\/span>\r\n <span class=\"uppercase tracking-wider\">Due-Diligence Aesthetic \/\/ Clean Architecture<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\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>Personal Portfolio \u2013 Lighter Concept Mike Horst \u00dcber mich Projekte Leistungen Gespr\u00e4ch Buchen Branding UI\/UX Design Creative Direction Projekte die Strukturen erz\u00e4hlen. Standort Verf\u00fcgbar f\u00fcr internationale Mandate und strategische Partnerschaften. Ich konzipiere intuitive Daten-Interfaces und klare visuelle Identit\u00e4ten, die technologische Innovationen und komplexe Systeme verst\u00e4ndlich auf den Punkt bringen. Ausgew\u00e4hlte Case Studies \/26 Interface Mockup Luma Health Application …<\/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-16","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages\/16","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aiq.ventures\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16"}],"version-history":[{"count":5,"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions"}],"predecessor-version":[{"id":33,"href":"https:\/\/aiq.ventures\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions\/33"}],"wp:attachment":[{"href":"https:\/\/aiq.ventures\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}