Vollständiges Redesign mit Gold-Formularen, BMP-Logo, multi-step Forms (Bewerbung, Kontakt, Sponsoring), Netlify-Deployment. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
261 lines
12 KiB
HTML
261 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Teilnahme 2026 – Bayerischer Mittelstandspreis</title>
|
||
<meta name="description" content="Ihr Weg zum Bayerischen Mittelstandspreis 2026. Erfahren Sie die Voraussetzungen, Bewertungskriterien und bewerben Sie sich jetzt kostenlos.">
|
||
<link rel="stylesheet" href="/css/variables.css">
|
||
<link rel="stylesheet" href="/css/base.css">
|
||
<link rel="stylesheet" href="/css/components.css">
|
||
<link rel="stylesheet" href="/css/layout.css">
|
||
<link rel="stylesheet" href="/css/pages.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ── Navigation ── -->
|
||
<nav class="nav" id="main-nav">
|
||
<div class="nav__inner">
|
||
<a href="index.html" class="nav__brand">
|
||
<div class="nav__brand-text">
|
||
<span class="nav__brand-name">Bayerischer Mittelstandspreis</span>
|
||
<span class="nav__brand-sub">Exzellenz seit 2005</span>
|
||
</div>
|
||
</a>
|
||
<div class="nav__links" id="nav-links">
|
||
<a href="index.html" class="nav__link">Startseite</a>
|
||
<a href="teilnahme.html" class="nav__link active">Teilnahme</a>
|
||
<a href="preistraeger.html" class="nav__link">Der BMP</a>
|
||
<a href="jury.html" class="nav__link">Jury & Partner</a>
|
||
<a href="kontakt.html" class="nav__link">Kontakt</a>
|
||
<a href="teilnahme.html#bewerben" class="btn btn--gold btn--sm nav__cta">Bewerben</a>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- ── Page Hero ── -->
|
||
<section class="page-hero">
|
||
<div class="container reveal">
|
||
<div class="hero__badge reveal">
|
||
<span class="badge badge--gold">Phase 2026</span>
|
||
</div>
|
||
<h1 class="hero-title">Gestalten Sie Bayerns Zukunft.</h1>
|
||
<div class="gold-divider"></div>
|
||
<p class="hero-subtitle">Alles, was Sie für Ihre erfolgreiche Bewerbung zum Bayerischen Mittelstandspreis wissen müssen.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Teilnahmevoraussetzungen (Berechtigung) ── -->
|
||
<section class="section" id="voraussetzungen">
|
||
<div class="container">
|
||
<div class="split reveal">
|
||
<div class="split__visual">
|
||
<div class="split__image-stack">
|
||
<div class="split__image-card split__image-card--1 reveal">
|
||
<img src="https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&q=80&w=800" alt="Bayerische Wirtschaft" class="fit-image">
|
||
</div>
|
||
<div class="split__image-card split__image-card--2 reveal">
|
||
<img src="https://images.unsplash.com/photo-1507679799987-c73779587ccf?auto=format&fit=crop&q=80&w=600" alt="Erfolg im Team" class="fit-image">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="split__content reveal">
|
||
<span class="overline">Berechtigung</span>
|
||
<h2>Wer kann teilnehmen?</h2>
|
||
<div class="gold-divider gold-divider--left"></div>
|
||
<p>Der Bayerische Mittelstandspreis richtet sich an Unternehmen, die den Wirtschaftsstandort Bayern mit Leidenschaft und Weitblick prägen.</p>
|
||
<ul class="check-list" style="margin-top: var(--space-xl);">
|
||
<li class="stagger-item">Unternehmenssitz oder wesentliche Betriebsstätte in Bayern.</li>
|
||
<li class="stagger-item">Mitarbeiterzahl zwischen 10 und 500 Beschäftigten (KMU).</li>
|
||
<li class="stagger-item">Mindestens drei volle Geschäftsjahre am Markt aktiv.</li>
|
||
<li class="stagger-item">Keine Zugehörigkeit zu rein öffentlichen Trägern.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Kriterien & Bewertung ── -->
|
||
<section class="section section--dark" id="kriterien">
|
||
<div class="container">
|
||
<div class="section-header reveal">
|
||
<span class="overline">Bewertung</span>
|
||
<h2>Unsere Kriterien</h2>
|
||
<div class="gold-divider"></div>
|
||
<p style="color: rgba(255,255,255,0.7); margin: 0 auto;">Eine unabhängige Expertenjury bewertet Ihre Einreichung basierend auf vier gleichgewichteten Säulen der Exzellenz.</p>
|
||
</div>
|
||
<div class="grid grid--4 reveal">
|
||
<div class="feature-box stagger-item">
|
||
<div class="step__number">25%</div>
|
||
<h4>Innovationskraft</h4>
|
||
<p>Zukunftsweisende Produkte, Dienstleistungen oder interne Prozessinnovationen.</p>
|
||
</div>
|
||
<div class="feature-box stagger-item">
|
||
<div class="step__number">25%</div>
|
||
<h4>Nachhaltigkeit</h4>
|
||
<p>Ökologische Verantwortung und Ressourcen-Effizienz im operativen Kern.</p>
|
||
</div>
|
||
<div class="feature-box stagger-item">
|
||
<div class="step__number">25%</div>
|
||
<h4>Unternehmenskultur</h4>
|
||
<p>Mitarbeiterbindung, Aus- und Weiterbildung sowie wertebasierte Führung.</p>
|
||
</div>
|
||
<div class="feature-box stagger-item">
|
||
<div class="step__number">25%</div>
|
||
<h4>Regionale Wurzeln</h4>
|
||
<p>Engagement am Standort Bayern und Beitrag zur regionalen Wertschöpfung.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Bewerbungsprozess Schritt für Schritt ── -->
|
||
<section class="section section--light" id="prozess-detail">
|
||
<div class="container">
|
||
<div class="section-header reveal">
|
||
<span class="overline">Schritt für Schritt</span>
|
||
<h2>Ihr Weg zur Auszeichnung</h2>
|
||
<div class="gold-divider"></div>
|
||
</div>
|
||
|
||
<div class="timeline reveal">
|
||
<div class="timeline__item stagger-item">
|
||
<div class="timeline__dot"></div>
|
||
<p class="timeline__date">Schritt 01</p>
|
||
<h4 class="timeline__title">Online-Einreichung</h4>
|
||
<p class="timeline__text">Füllen Sie das Bewerbungs- oder Vorschlagsformular vollständig aus. Die Teilnahme ist kostenfrei.</p>
|
||
</div>
|
||
<div class="timeline__item stagger-item">
|
||
<div class="timeline__dot"></div>
|
||
<p class="timeline__date">Schritt 02</p>
|
||
<h4 class="timeline__title">Vorprüfung</h4>
|
||
<p class="timeline__text">Unser Gremium sichtet alle Unterlagen auf Vollständigkeit und Konformität mit den KMU-Kriterien.</p>
|
||
</div>
|
||
<div class="timeline__item stagger-item">
|
||
<div class="timeline__dot"></div>
|
||
<p class="timeline__date">Schritt 03</p>
|
||
<h4 class="timeline__title">Audit & Jury-Sitzung</h4>
|
||
<p class="timeline__text">Die besten Unternehmen werden durch Audits (Besuche vor Ort) tiefergehend evaluiert.</p>
|
||
</div>
|
||
<div class="timeline__item stagger-item">
|
||
<div class="timeline__dot"></div>
|
||
<p class="timeline__date">Schritt 04</p>
|
||
<h4 class="timeline__title">Preisverleihung</h4>
|
||
<p class="timeline__text">Die Gewinner werden im Rahmen der feierlichen Gala in München geehrt.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Fristen / Termine zur Verleihung ── -->
|
||
<section class="section--sm" id="termine" style="background: var(--color-primary-light); color: var(--color-white);">
|
||
<div class="container">
|
||
<div class="flex-between reveal" style="flex-wrap: wrap; gap: var(--space-xl);">
|
||
<div>
|
||
<h3 style="color: var(--color-white); margin-bottom: var(--space-xs);">Wichtige Termine 2026</h3>
|
||
<p style="color: rgba(255,255,255,0.7);">Planen Sie Ihre Teilnahme rechtzeitig.</p>
|
||
</div>
|
||
<div class="grid grid--3" style="flex-grow: 1; text-align: center;">
|
||
<div class="stagger-item">
|
||
<p style="font-weight: var(--fw-bold); color: var(--color-accent);">30. Juni 2026</p>
|
||
<p style="font-size: var(--fs-xs);">Bewerbungsschluss</p>
|
||
</div>
|
||
<div class="stagger-item">
|
||
<p style="font-weight: var(--fw-bold); color: var(--color-accent);">August 2026</p>
|
||
<p style="font-size: var(--fs-xs);">Bekanntgabe Nominierte</p>
|
||
</div>
|
||
<div class="stagger-item">
|
||
<p style="font-weight: var(--fw-bold); color: var(--color-accent);">Oktober 2026</p>
|
||
<p style="font-size: var(--fs-xs);">Gala-Verleihung</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Bewerbungsformular / Vorschlagsformular ── -->
|
||
<section class="section" id="bewerben">
|
||
<div class="container">
|
||
<div class="form-card reveal" style="max-width: 900px; margin: 0 auto; background: var(--color-white); padding: var(--space-4xl); box-shadow: var(--shadow-2xl); border: 1px solid var(--color-gray-light);">
|
||
<div class="section-header">
|
||
<span class="overline">Direktbewerbung</span>
|
||
<h2>Bewerben oder Vorschlagen</h2>
|
||
<div class="gold-divider"></div>
|
||
<p>Sie können sich selbst bewerben oder ein herausragendes Unternehmen vorschlagen.</p>
|
||
</div>
|
||
<form id="bewerbungsformular" class="grid grid--2" style="gap: var(--space-xl);">
|
||
<div class="form-group" style="grid-column: span 2;">
|
||
<label class="form-label">Art der Einreichung *</label>
|
||
<select class="form-input" required>
|
||
<option value="">Bitte wählen...</option>
|
||
<option value="selbst">Eigenbewerbung</option>
|
||
<option value="vorschlag">Vorschlag eines anderen Unternehmens</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Firmenname *</label>
|
||
<input type="text" class="form-input" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Branche *</label>
|
||
<input type="text" class="form-input" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Kontaktperson *</label>
|
||
<input type="text" class="form-input" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">E-Mail *</label>
|
||
<input type="email" class="form-input" required>
|
||
</div>
|
||
<div class="form-group" style="grid-column: span 2;">
|
||
<label class="form-label">Warum verdient dieses Unternehmen den Preis? *</label>
|
||
<textarea class="form-textarea" placeholder="Kurze Begründung..." required></textarea>
|
||
</div>
|
||
<div style="grid-column: span 2; text-align: center; margin-top: var(--space-xl);">
|
||
<button type="submit" class="btn btn--gold btn--lg">Bewerbung absenden →</button>
|
||
<p style="margin-top: var(--space-md); font-size: var(--fs-xs); color: var(--color-gray-dark);">
|
||
Noch unsicher? Schauen Sie in unsere <a href="kontakt.html#faq" style="text-decoration: underline;">FAQ</a> oder <a href="kontakt.html" style="text-decoration: underline;">kontaktieren Sie uns</a>.
|
||
</p>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Footer ── -->
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<div class="footer__grid">
|
||
<div class="footer__brand">
|
||
<h3 class="nav__brand-name">Bayerischer Mittelstandspreis</h3>
|
||
<p class="nav__brand-sub">Exzellenz seit 2005</p>
|
||
</div>
|
||
<div>
|
||
<h4 class="footer__heading">BMP 2026</h4>
|
||
<a href="index.html" class="footer__link">Startseite</a>
|
||
<a href="teilnahme.html" class="footer__link">Teilnahme</a>
|
||
<a href="preistraeger.html" class="footer__link">Preisträger</a>
|
||
</div>
|
||
<div>
|
||
<h4 class="footer__heading">Engagement</h4>
|
||
<a href="jury.html" class="footer__link">Jury & Partner</a>
|
||
<a href="presse.html" class="footer__link">Presse</a>
|
||
<a href="kontakt.html" class="footer__link">Kontakt</a>
|
||
</div>
|
||
<div>
|
||
<h4 class="footer__heading">Legal</h4>
|
||
<a href="datenschutz.html" class="footer__link">Datenschutz</a>
|
||
<a href="datenschutz.html#impressum" class="footer__link">Impressum</a>
|
||
</div>
|
||
</div>
|
||
<div class="footer__bottom">
|
||
<p>© 2026 Bayerischer Mittelstandspreis. Alle Rechte vorbehalten.</p>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script type="module" src="/js/main.js"></script>
|
||
</body>
|
||
</html>
|