fea7998835
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>
210 lines
11 KiB
HTML
210 lines
11 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Kontakt & FAQ – Bayerischer Mittelstandspreis</title>
|
||
<meta name="description" content="Kontaktieren Sie das Team des Bayerischen Mittelstandspreises. Antworten auf häufig gestellte Fragen zu Bewerbung, Kriterien und Ablauf sowie wichtige Fristen.">
|
||
<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 class="bg-light">
|
||
|
||
<!-- ── 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">Teilnahme</a>
|
||
<a href="preistraeger.html" class="nav__link">Der BMP</a>
|
||
<a href="jury.html" class="nav__link">Jury & Partner</a>
|
||
<a href="presse.html" class="nav__link">Presse</a>
|
||
<a href="kontakt.html" class="nav__link active">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">Dialog & Service</span>
|
||
</div>
|
||
<h1 class="hero-title">Wir sind für Sie da.</h1>
|
||
<div class="gold-divider"></div>
|
||
<p class="hero-subtitle">Haben Sie Fragen zum Bewerbungsprozess, zur Preisverleihung oder zu Partner-Möglichkeiten? Unser Team begleitet Sie gerne persönlich.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Kontakt & Formular ── -->
|
||
<section class="section" id="kontakt-info">
|
||
<div class="container">
|
||
<div class="grid grid--2 reveal" style="gap: var(--space-4xl);">
|
||
|
||
<!-- Linke Spalte: Details -->
|
||
<div class="stagger-item">
|
||
<span class="overline">Direktkontakt</span>
|
||
<h2>Kontaktmöglichkeiten</h2>
|
||
<div class="gold-divider gold-divider--left"></div>
|
||
<p>Wir begleiten Sie kompetent durch alle Phasen Ihrer Bewerbung – von der ersten Frage bis zur Preisverleihung.</p>
|
||
|
||
<div class="contact-details" style="margin-top: var(--space-2xl);">
|
||
<div class="contact-item" style="margin-bottom: var(--space-xl);">
|
||
<h4 style="color: var(--color-accent); margin-bottom: 4px;">Geschäftsstelle München</h4>
|
||
<p>Maximilianstraße 42, 80538 München</p>
|
||
</div>
|
||
<div class="contact-item" style="margin-bottom: var(--space-xl);">
|
||
<h4 style="color: var(--color-accent); margin-bottom: 4px;">E-Mail & Telefon</h4>
|
||
<p>info@bmp-bayern.de<br>+49 89 123 456 78</p>
|
||
</div>
|
||
<div class="contact-item">
|
||
<h4 style="color: var(--color-accent); margin-bottom: 4px;">Bürozeiten</h4>
|
||
<p>Montag – Freitag: 09:00 – 17:00 Uhr</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Rechte Spalte: Formular -->
|
||
<div class="form-card stagger-item" style="background: var(--color-white); padding: var(--space-3xl); border-radius: var(--radius-lg); box-shadow: var(--shadow-xl);">
|
||
<h3 style="margin-bottom: var(--space-xl);">Schreiben Sie uns</h3>
|
||
<form id="contact-page-form">
|
||
<div class="form-group">
|
||
<label class="form-label">Name *</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">
|
||
<label class="form-label">Betreff</label>
|
||
<select class="form-input">
|
||
<option value="allgemein">Allgemeine Anfrage</option>
|
||
<option value="bewerbung">Frage zur Bewerbung</option>
|
||
<option value="presse">Presseanfrage</option>
|
||
<option value="sponsoring">Sponsoring</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Ihre Nachricht *</label>
|
||
<textarea class="form-textarea" style="min-height: 120px;" required></textarea>
|
||
</div>
|
||
<button type="submit" class="btn btn--primary btn--full">Anfrage senden →</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Fristen ── -->
|
||
<section class="section">
|
||
<div class="container">
|
||
<div class="section-header reveal">
|
||
<span class="overline">Fahrplan 2026</span>
|
||
<h2>Wichtige Fristen</h2>
|
||
<div class="gold-divider"></div>
|
||
</div>
|
||
|
||
<div class="grid grid--3 reveal">
|
||
<div class="card card--gold-top stagger-item" style="padding: var(--space-xl); text-align: center; background: white;">
|
||
<div class="badge badge--blue" style="margin-bottom: var(--space-md);">Bewerbungsschluss</div>
|
||
<h3 style="margin-bottom: var(--space-sm);">30. Juni 2026</h3>
|
||
<p style="color: var(--color-gray-dark); font-size: var(--fs-small);">Letzte Möglichkeit zur Einreichung der vollständigen Bewerbungsunterlagen.</p>
|
||
</div>
|
||
<div class="card card--gold-top stagger-item" style="padding: var(--space-xl); text-align: center; background: white;">
|
||
<div class="badge badge--gold" style="margin-bottom: var(--space-md);">Nominierung</div>
|
||
<h3 style="margin-bottom: var(--space-sm);">15. August 2026</h3>
|
||
<p style="color: var(--color-gray-dark); font-size: var(--fs-small);">Bekanntgabe der Nominierten nach der ersten Jury-Sichtung.</p>
|
||
</div>
|
||
<div class="card card--gold-top stagger-item" style="padding: var(--space-xl); text-align: center; background: white;">
|
||
<div class="badge badge--dark" style="margin-bottom: var(--space-md);">Preisverleihung</div>
|
||
<h3 style="margin-bottom: var(--space-sm);">22. Oktober 2026</h3>
|
||
<p style="color: var(--color-gray-dark); font-size: var(--fs-small);">Festliche Gala und feierliche Bekanntgabe der Preisträger in München.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── FAQ (Accordion Style Refined) ── -->
|
||
<section class="section section--light" id="faq">
|
||
<div class="container">
|
||
<div class="section-header reveal">
|
||
<span class="overline">Antworten</span>
|
||
<h2>FAQ – Häufige Fragen</h2>
|
||
<div class="gold-divider"></div>
|
||
</div>
|
||
|
||
<div class="faq-container reveal" style="max-width: 900px; margin: 0 auto;">
|
||
<!-- Kosten -->
|
||
<div class="faq-item stagger-item" style="margin-bottom: var(--space-md); background: var(--color-white); border: 1px solid var(--color-gray-light); border-radius: var(--radius-md); padding: var(--space-lg);">
|
||
<h4 style="margin-bottom: 8px; color: var(--color-primary);">Was kostet die Teilnahme am BMP?</h4>
|
||
<p style="color: var(--color-gray-dark);">Die Teilnahme am Bayerischen Mittelstandspreis ist für alle Unternehmen <strong>vollständig kostenfrei</strong>. Wir finanzieren uns durch Partner und Sponsoren, um exzellenten Mittelstand ohne finanzielle Hürden zu fördern.</p>
|
||
</div>
|
||
|
||
<!-- Kriterien -->
|
||
<div class="faq-item stagger-item" style="margin-bottom: var(--space-md); background: var(--color-white); border: 1px solid var(--color-gray-light); border-radius: var(--radius-md); padding: var(--space-lg);">
|
||
<h4 style="margin-bottom: 8px; color: var(--color-primary);">Nach welchen Kriterien wird bewertet?</h4>
|
||
<p style="color: var(--color-gray-dark);">Die Bewertung basiert auf vier Säulen: <strong>Zukunftsfähigkeit & Innovation</strong>, <strong>Nachhaltigkeit & Verantwortung</strong>, <strong>Unternehmenskultur</strong> sowie <strong>Regionale Verwurzelung</strong>. Jede Säule fließt mit 25% in das Gesamtergebnis ein.</p>
|
||
</div>
|
||
|
||
<!-- Ablauf -->
|
||
<div class="faq-item stagger-item" style="margin-bottom: var(--space-md); background: var(--color-white); border: 1px solid var(--color-gray-light); border-radius: var(--radius-md); padding: var(--space-lg);">
|
||
<h4 style="margin-bottom: 8px; color: var(--color-primary);">Wie läuft der Bewerbungsprozess ab?</h4>
|
||
<p style="color: var(--color-gray-dark);">Der Prozess ist mehrstufig: 1. Online-Bewerbung oder Vorschlag, 2. Formale Prüfung & erste Jury-Sichtung, 3. Fach-Audits bei den Finalisten vor Ort, 4. Finale Jury-Sitzung und abschließende Preisverleihung.</p>
|
||
</div>
|
||
|
||
<!-- Weiteres -->
|
||
<div class="faq-item stagger-item" style="margin-bottom: var(--space-md); background: var(--color-white); border: 1px solid var(--color-gray-light); border-radius: var(--radius-md); padding: var(--space-lg);">
|
||
<h4 style="margin-bottom: 8px; color: var(--color-primary);">Wie lange dauert die Bewerbung?</h4>
|
||
<p style="color: var(--color-gray-dark);">Dank unseres optimierten Bewerbungsformulars benötigen Sie für die erste Einreichung ca. 30-45 Minuten. Tiefergehende Unterlagen werden erst in der Audit-Phase angefordert.</p>
|
||
</div>
|
||
</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>
|