markemacht/_markemacht.de/index.html
Kevin Adametz 2a617e09cc
Some checks are pending
linter / quality (push) Waiting to run
tests / ci (8.3) (push) Waiting to run
tests / ci (8.4) (push) Waiting to run
tests / ci (8.5) (push) Waiting to run
Initial commit: Laravel-Skelett + Markenwissen-Verfassung + markemacht.de Web
Erfasst den vollständigen Projektstand mit drei Hauptbereichen:

1. Laravel 11 Application-Skelett
   - Standard-Setup (app/, bootstrap/, config/, database/, public/, resources/, routes/, storage/, tests/)
   - Composer + npm Konfiguration
   - Devcontainer für Laravel Sail (PHP/MySQL/Redis)
   - GitHub Actions Workflows (lint + tests)
   - Tailwind/Vite Build-Pipeline

2. docs/ – Wissensbasis "Marke macht." (Methodik-Verfassung)
   Stand nach Pflegerunde 2026-05-28:
   - 00_Methodik-Verfassung: Dok. 000 (v2.0.2) bis Dok. 013 (NEU) + Anhänge
   - 10_Quellen-Original: Wala, Sharp, Simon (read-only Quellen)
   - 20_Markenwissen: 25 abgeleitete MW-Dokumente (Wala_MW-WAL, Sharp_MW-HBG, Simon_MW-SIM)
   - 30_Synthese: Markenwissen_I_Synthese_Gesamt + Scorecard-Regeln
   - 40_Implementierung: 011b-Erweiterung
   - _Steuerung: 00_START_HIER, Serienübersicht, CHANGELOG.md

   Letzte methodische Eingriffe:
   - Methodik-Update v2.0 (Ownership Autorenschaft/Anwendung, Geltungsbereich Kernthese,
     Score-Ebenen DNA-Reifegrad, Preislogik Governance-Scope)
   - Dok. 013 NEU: Akquise- & Conversion-Logik (Auffahrten statt Funnel)
   - Rebranding brandwork.io → Brand Rules (brand-rules.com)
   - Schichtverletzungen behoben, Ordner-Symmetrie hergestellt, Verweise konsolidiert

3. _markemacht.de/ – Web-Frontend Design-Sandbox
   - Statische HTML-Entwürfe (Startseite, Methode, Manifest, Denken, Blog)
   - Design-System (warm_intellectualism, based_web_design)
   - Assets (CSS, JS, Favicon)

Konfiguration:
- .gitignore um .DS_Store und Thumbs.db erweitert
- Lokale Git-Identity gesetzt: Kevin Adametz <kevin.adametz@me.com>
- .env wird ignoriert (nur .env.example versioniert)

Konfliktregel: Bei Spannung zwischen Code und Methodik gilt die Methodik (Dok. 000).
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-05-28 16:01:54 +00:00

288 lines
13 KiB
HTML

<!DOCTYPE html>
<html lang="de" data-theme="monolith">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<title>MARKE MACHT · Denkraum für Unternehmer</title>
<meta name="description" content="Wenn Sie Ihr Unternehmen nicht erklären können, haben Sie kein Marketingproblem. Sie haben ein Markenproblem. Denkraum für Unternehmer im Mittelstand." />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="MARKE MACHT" />
<meta property="og:title" content="MARKE MACHT · Denkraum für Unternehmer" />
<meta property="og:description" content="Marke ist die Fähigkeit eines Unternehmens, sich selbst eindeutig zu erklären." />
<meta property="og:url" content="https://markemacht.de/" />
<meta property="og:locale" content="de_DE" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="theme-color" content="#0A0A0A" media="(prefers-color-scheme: dark)" />
<meta name="theme-color" content="#FBFAF2" media="(prefers-color-scheme: light)" />
<link rel="icon" type="image/svg+xml" href="./assets/favicon.svg" />
<link rel="canonical" href="https://markemacht.de/" />
<script>
(function () {
try {
var v = localStorage.getItem('mm-wirkung');
if (v !== 'monolith' && v !== 'editorial') v = 'monolith';
document.documentElement.setAttribute('data-theme', v);
} catch (_) {}
})();
</script>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300..800;1,6..72,300..800&family=Noto+Serif:ital,wght@0,400;0,700;1,400&family=Outfit:wght@300..800&family=Plus+Jakarta+Sans:wght@400..700&family=Space+Grotesk:wght@400..600&family=Work+Sans:wght@300..600&display=swap" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&display=swap" />
<link rel="stylesheet" href="./assets/css/app.css" />
</head>
<body>
<a class="visually-hidden" href="#main" style="position:absolute;left:-9999px;">Zum Inhalt springen</a>
<!-- Navigation -->
<nav class="nav" aria-label="Hauptnavigation">
<div class="nav-inner">
<a class="nav-brand" href="./index.html">MARKE MACHT</a>
<div class="nav-links">
<a class="nav-link is-active" href="./index.html">Start</a>
<a class="nav-link" href="./manifest.html">Manifest</a>
<a class="nav-link" href="./methode.html">Methode</a>
<a class="nav-link" href="./denken.html">Denken</a>
</div>
<div class="wirkung-switch" role="group" aria-label="Wirkung wechseln">
<span class="wirkung-label">Wirkung:</span>
<button type="button" class="wirkung-option" data-wirkung="monolith" aria-pressed="true">monolithisch</button>
<span class="wirkung-sep" aria-hidden="true">·</span>
<button type="button" class="wirkung-option" data-wirkung="editorial" aria-pressed="false">editorial</button>
</div>
<a class="nav-cta" href="#audit">Audit anfragen</a>
<button class="menu-btn" data-drawer-open aria-label="Menü öffnen" aria-controls="mobile-drawer" aria-expanded="false">
<span class="material-symbols-outlined" aria-hidden="true">menu</span>
</button>
</div>
</nav>
<!-- Mobile Drawer -->
<aside id="mobile-drawer" class="mobile-drawer" data-mobile-drawer aria-hidden="true" aria-label="Mobile Navigation">
<div class="mobile-drawer-head">
<span class="nav-brand">MARKE MACHT</span>
<button class="menu-btn" data-drawer-close aria-label="Menü schließen">
<span class="material-symbols-outlined" aria-hidden="true">close</span>
</button>
</div>
<nav class="mobile-drawer-links" aria-label="Mobile Hauptnavigation">
<a class="mobile-drawer-link is-active" href="./index.html">Start</a>
<a class="mobile-drawer-link" href="./manifest.html">Manifest</a>
<a class="mobile-drawer-link" href="./methode.html">Methode</a>
<a class="mobile-drawer-link" href="./denken.html">Denken</a>
</nav>
<div class="mobile-drawer-footer">
<div class="wirkung-switch" role="group" aria-label="Wirkung wechseln">
<span class="wirkung-label">Wirkung:</span>
<button type="button" class="wirkung-option" data-wirkung="monolith">monolithisch</button>
<span class="wirkung-sep" aria-hidden="true">·</span>
<button type="button" class="wirkung-option" data-wirkung="editorial">editorial</button>
</div>
<a class="link-arrow" href="#audit">
Audit anfragen
<span class="material-symbols-outlined" aria-hidden="true">arrow_forward</span>
</a>
</div>
</aside>
<main id="main">
<!-- Hero -->
<header class="hero">
<div class="hero-keyvisual" aria-hidden="true">
<div class="monolith"></div>
</div>
<div class="shell hero-grid grid-12">
<div class="col-12" data-reveal>
<div class="stack-32">
<span class="meta">[00] Denkraum · markemacht.de</span>
<h1 class="hero-headline" style="max-width: 16ch;">
Wenn Sie Ihr Unternehmen nicht erklären können, haben Sie kein <span class="accent">Marketingproblem</span>.
</h1>
<p class="editorial dim" style="max-width: 28ch;">
Sie haben ein Markenproblem.
</p>
<div class="btn-row">
<a class="btn" href="#symptome">
Warum das so ist
<span class="material-symbols-outlined" aria-hidden="true">south</span>
</a>
<a class="btn btn-ghost only-editorial" href="./manifest.html">
Manifest lesen
<span class="material-symbols-outlined" aria-hidden="true">east</span>
</a>
</div>
</div>
</div>
</div>
</header>
<!-- Symptome -->
<section class="section" id="symptome" style="background: rgb(var(--color-bg-surface));">
<div class="shell grid-12">
<div class="col-12 stack-48" data-reveal>
<div class="stack-16">
<span class="meta">[01] Diagnose</span>
<h2 class="section-headline" style="max-width: 20ch;">
Drei Anzeichen, dass Ihr Unternehmen sprachlich handlungsunfähig ist.
</h2>
</div>
<!-- Monolithisch: asymmetrische Offsets -->
<div class="symptoms-mono">
<div class="sym-row" data-reveal>
<div class="col-12 md:col-3">
<span class="meta accent">Symptom Eins</span>
</div>
<div class="card col-12 md:col-9">
<h3 class="editorial" style="margin-bottom: 16px; color: rgb(var(--color-text-primary));">Jeder erklärt anders.</h3>
<p class="body-text" style="max-width: 50ch;">
Wenn drei Geschäftsführer drei unterschiedliche Antworten auf die Frage nach dem Kernangebot geben, fehlt das strategische Fundament. Die Folge: Verzettelung im Vertrieb.
</p>
</div>
</div>
<div class="sym-row" data-reveal>
<div class="col-12 md:col-3" aria-hidden="true"></div>
<div class="col-12 md:col-3">
<span class="meta accent">Symptom Zwei</span>
</div>
<div class="card col-12 md:col-6">
<h3 class="editorial" style="margin-bottom: 16px; color: rgb(var(--color-text-primary));">Kommunikation hängt an Personen.</h3>
<p class="body-text" style="max-width: 58ch;">
Das Wissen über den Wert des Unternehmens existiert nur in den Köpfen weniger Experten. Es gibt kein dokumentiertes Regelwerk für neue Mitarbeiter oder Agenturen.
</p>
</div>
</div>
<div class="sym-row" data-reveal>
<div class="col-12 md:col-3">
<span class="meta accent">Symptom Drei</span>
</div>
<div class="card card-accent-border col-12 md:col-8">
<h3 class="editorial" style="margin-bottom: 16px; color: rgb(var(--color-text-primary));">Mehr Content, weniger Wirkung.</h3>
<p class="body-text" style="max-width: 58ch;">
Marketing produziert blindlings Material, das keine Haltung vermittelt. Die Lautstärke wird erhöht, weil die Substanz fehlt.
</p>
</div>
</div>
</div>
<!-- Editorial: Bento -->
<div class="symptoms-editorial">
<article class="card" data-reveal>
<span class="tag">Symptom 01</span>
<h3 class="sub-headline" style="margin-top: 16px; margin-bottom: 12px;">Jeder erklärt anders.</h3>
<p class="body-text">
Wenn drei Geschäftsführer drei unterschiedliche Antworten auf die Frage nach dem Kernangebot geben, fehlt das strategische Fundament. Die Folge: Verzettelung im Vertrieb.
</p>
</article>
<article class="card" data-reveal data-reveal-delay="80">
<span class="tag">Symptom 02</span>
<h3 class="sub-headline" style="margin-top: 16px; margin-bottom: 12px;">Kommunikation hängt an Personen.</h3>
<p class="body-text">
Das Wissen über den Wert des Unternehmens existiert nur in den Köpfen weniger Experten. Es gibt kein dokumentiertes Regelwerk für neue Mitarbeiter oder Agenturen.
</p>
</article>
<article class="card card-accent-border" data-reveal data-reveal-delay="160">
<span class="tag">Symptom 03</span>
<h3 class="sub-headline" style="margin-top: 16px; margin-bottom: 12px;">Mehr Content, weniger Wirkung.</h3>
<p class="body-text">
Marketing produziert blindlings Material, das keine Haltung vermittelt. Die Lautstärke wird erhöht, weil die Substanz fehlt.
</p>
</article>
</div>
</div>
</div>
</section>
<!-- Quote -->
<section class="quote-block" data-reveal>
<div class="shell">
<div class="quote-wrap">
<span class="quote-mark" aria-hidden="true"></span>
<blockquote class="quote">
Marke ist kein Gefühl.<br />
<span class="quote-dim">Marke ist ein Regelwerk.</span>
</blockquote>
</div>
</div>
</section>
<!-- Kernthese -->
<section class="section" style="background: rgb(var(--color-bg-surface));">
<div class="shell grid-12">
<div class="col-12" data-reveal>
<span class="meta">[02] Kernthese</span>
</div>
<div class="col-12 stack-32" data-reveal>
<h2 class="section-headline" style="max-width: 18ch;">
Textklarheit erzwingt Denkklarheit.
</h2>
<div class="stack-24 max-prose">
<p class="body-text">
Die meisten Markenprojekte scheitern, weil sie mit Farben und Logos beginnen. Sie verwechseln Dekoration mit Identität. Wir drehen den Prozess um.
</p>
<p class="body-text">
Bevor etwas gestaltet wird, muss es präzise formuliert sein. Ein Monolith aus Sprache, der nicht wackelt, wenn der Wind der Trends weht.
</p>
</div>
<div>
<a class="link-arrow" href="./manifest.html">
Das Manifest lesen
<span class="material-symbols-outlined" aria-hidden="true">east</span>
</a>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="section text-center" id="audit">
<div class="shell flex-col items-center stack-32" data-reveal>
<span class="meta">[03] Der nächste Schritt</span>
<h2 class="section-headline" style="max-width: 20ch;">
Bereit für Klarheit?
</h2>
<p class="editorial dim max-prose">
Das Marken-Klarheits-Audit. Eine schonungslose Diagnose Ihres aktuellen Status Quo.
</p>
<div>
<a class="btn" href="./methode.html#audit">
Audit anfragen
<span class="material-symbols-outlined" aria-hidden="true">arrow_forward</span>
</a>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer class="site-footer">
<div class="footer-inner">
<div class="footer-meta">
<p class="footer-copy">© MARKE MACHT · Denkraum für Unternehmer</p>
<p class="footer-note">Keine Cookies, kein Tracking.</p>
</div>
<div class="footer-links">
<a class="footer-link" href="#">Impressum</a>
<a class="footer-link" href="#">Datenschutz</a>
<a class="footer-link" href="#">Kontakt</a>
</div>
</div>
</footer>
<script src="./assets/js/app.js" defer></script>
</body>
</html>