12-05-2026 Frontend dev
This commit is contained in:
parent
405df0a122
commit
5b8bdf4182
779 changed files with 480564 additions and 6241 deletions
875
dev/frontend/tailwind_v3/Branchenseite Tailwind.html
Normal file
875
dev/frontend/tailwind_v3/Branchenseite Tailwind.html
Normal file
|
|
@ -0,0 +1,875 @@
|
|||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<title>businessportal24 — Branche · Energie & Klima</title>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600;8..60,700&family=Inter+Tight:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
||||
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms"></script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
bg:"#F6F4EF","bg-elev":"#FBFAF6","bg-rule":"#E5E0D5","bg-rule-strong":"#1C1A17",
|
||||
"bg-dark":"#14202E","bg-card-warm":"#F1ECE2","bg-card-warm-border":"#D9CDB6",
|
||||
"bg-footer":"#0F1216","bg-strip":"#1A1F26",
|
||||
topbar:"#1A1F26",topbar2:"#232A33",
|
||||
ink:"#1C1A17","ink-2":"#3D3935","ink-3":"#6E6862","ink-4":"#9A958D",
|
||||
"ink-on-dark":"#F6F4EF","ink-on-dark-2":"#B8B3AA",
|
||||
brand:"#C84A1E","brand-deep":"#A23814","brand-soft":"#F4E5DD",
|
||||
live:"#E03A1A",gain:"#2E8540",loss:"#C8341E",ok:"#2E8540",
|
||||
},
|
||||
fontFamily: {
|
||||
sans:['"Inter Tight"','"Söhne"','Inter','system-ui','sans-serif'],
|
||||
serif:['"Source Serif 4"','"Source Serif Pro"','Charter','Georgia','serif'],
|
||||
mono:['"JetBrains Mono"','"SF Mono"','ui-monospace','monospace'],
|
||||
},
|
||||
maxWidth:{ layout:"1280px" },
|
||||
backgroundImage:{
|
||||
"topbar-grad":"linear-gradient(135deg,#1A1F26 0%,#232A33 100%)",
|
||||
"hero-ocean":"linear-gradient(135deg,#14202E 0%,#1A2D44 60%,#2A4566 100%)",
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html,body{margin:0;padding:0;} body{background:#E8E4DA;font-family:"Inter Tight",system-ui,sans-serif;}
|
||||
.eyebrow{font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:#C84A1E;}
|
||||
.eyebrow.muted{color:#6E6862;}
|
||||
.bp-cat{font-size:11px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#C84A1E;}
|
||||
.bp-tag{display:inline-flex;align-items:center;padding:3px 8px;font-size:10.5px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;background:#C84A1E;color:white;}
|
||||
.bp-tag.verified{background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.3);color:white;backdrop-filter:blur(4px);}
|
||||
.rule-strong{height:1px;background:#1C1A17;border:0;margin:0;}
|
||||
.rule{height:1px;background:#E5E0D5;border:0;margin:0;}
|
||||
@keyframes bp-pulse{0%,100%{opacity:1}50%{opacity:.3}} .pulse-dot{animation:bp-pulse 1.6s ease-in-out infinite;}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="bg-bg text-ink font-sans antialiased">
|
||||
<div class="mx-auto bg-bg" style="width:1280px;">
|
||||
|
||||
<!-- ============== TOP UTILITY BAR ============== -->
|
||||
<div class="bg-topbar-grad text-ink-on-dark-2 border-b border-black">
|
||||
<div class="max-w-layout mx-auto px-8 flex items-stretch text-[11.5px] tracking-wide">
|
||||
<span class="flex items-center pr-4 py-2 whitespace-nowrap border-r border-[#2A2723]">Mi, 6. Mai 2026</span>
|
||||
<span class="flex items-center px-3.5 text-[9.5px] uppercase font-semibold tracking-[0.16em] text-[#6E6862] whitespace-nowrap">Ausgabe</span>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-semibold text-ink-on-dark bg-white/[0.06] border-b-2 border-brand -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🇩🇪</span><span>DE</span></button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🇦🇹</span><span>AT</span></button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🇨🇭</span><span>CH</span></button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🌐</span><span>EN</span></button>
|
||||
<span class="flex-1"></span>
|
||||
<span class="flex items-center gap-4 py-2 whitespace-nowrap">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none" class="opacity-60"><circle cx="6" cy="6" r="5" stroke="currentColor" stroke-width="1"/><path d="M1 6h10M6 1c2 1.5 2 8.5 0 10M6 1c-2 1.5-2 8.5 0 10" stroke="currentColor" stroke-width="1" fill="none"/></svg>
|
||||
<strong class="text-ink-on-dark font-semibold">Deutsch</strong>
|
||||
</span>
|
||||
<span class="w-px h-[14px] bg-[#2A2723]"></span>
|
||||
<a href="#" class="hover:text-ink-on-dark">Newsletter</a>
|
||||
<a href="#" class="hover:text-ink-on-dark">RSS</a>
|
||||
<a href="#" class="hover:text-ink-on-dark">API</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== HEADER ============== -->
|
||||
<header class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-[18px] grid items-center gap-6" style="grid-template-columns:auto 1fr auto auto;">
|
||||
<div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none tracking-[-0.5px]">businessportal<span class="text-brand">24</span></div>
|
||||
<div class="eyebrow muted mt-1 text-[9.5px] tracking-[0.18em]">Pressemitteilungen · DACH</div>
|
||||
</div>
|
||||
<div class="w-full max-w-[540px]">
|
||||
<div class="flex items-center gap-2.5 px-3.5 py-2.5 border border-bg-rule bg-bg-elev text-[13px] text-ink-3">
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"><circle cx="7" cy="7" r="5" stroke="currentColor" stroke-width="1.5"/><path d="M11 11l3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
<span class="flex-1">Suche in „Energie & Klima" — Unternehmen, ISIN, Standort…</span>
|
||||
<span class="text-[10.5px] text-ink-4 border border-bg-rule px-1.5 py-0.5 font-mono">⌘K</span>
|
||||
</div>
|
||||
<div class="flex justify-between mt-1.5 text-[11px] text-ink-3">
|
||||
<span>Schnellfilter: <a class="text-brand font-semibold">Verifiziert</a> · <a class="text-brand font-semibold">Mit ISIN</a> · <a class="text-brand font-semibold">Letzte 24 h</a></span>
|
||||
<a class="text-brand font-semibold">Erweiterte Suche →</a>
|
||||
</div>
|
||||
</div>
|
||||
<button class="px-4 py-2.5 text-[13px] font-semibold text-ink">Anmelden</button>
|
||||
<button class="inline-flex items-center gap-2 px-[18px] py-2.5 text-[13px] font-semibold text-white bg-brand hover:bg-brand-deep transition-colors">
|
||||
Veröffentlichen
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M3 6h6M6 3l3 3-3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- ============== MAIN NAV ============== -->
|
||||
<nav class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 flex items-stretch">
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Startseite</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Wirtschaft</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Technologie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Finanzen</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Industrie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-semibold text-ink border-b-2 border-brand -mb-px">Energie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Gesundheit</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Handel</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Immobilien</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Mobilität</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Alle Rubriken</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- ============== BRANCHEN-SCHLAGZEILEN STRIP ============== -->
|
||||
<div class="bg-strip text-ink-on-dark" style="background:#1A1F26;">
|
||||
<div class="max-w-layout mx-auto px-8 py-2.5 grid items-center gap-5 text-[12.5px]" style="grid-template-columns:auto 1fr auto;">
|
||||
<span class="inline-flex items-center gap-2 text-ink-on-dark-2 font-semibold text-[10px] tracking-[0.18em] uppercase font-mono">
|
||||
<svg width="10" height="10" viewBox="0 0 12 12" fill="none" class="opacity-70"><path d="M1 3h10M1 6h10M1 9h6" stroke="currentColor" stroke-width="1.2"/></svg>
|
||||
Top-Schlagzeilen · Energie
|
||||
</span>
|
||||
<div class="flex gap-6 overflow-hidden whitespace-nowrap">
|
||||
<span class="inline-flex gap-2 items-baseline"><span class="font-mono text-[11px] text-[#8A847B]">14:32</span><span class="text-ink-on-dark">Siemens Energy hebt Jahresprognose an — Auftragsbestand Rekord</span></span>
|
||||
<span class="inline-flex gap-2 items-baseline"><span class="font-mono text-[11px] text-[#8A847B]">13:55</span><span class="text-ink-on-dark">Fluence eröffnet Gigafactory Halle (Saale)</span></span>
|
||||
<span class="inline-flex gap-2 items-baseline"><span class="font-mono text-[11px] text-[#8A847B]">12:47</span><span class="text-ink-on-dark">TenneT vergibt 2,3-Mrd-Auftrag SuedLink</span></span>
|
||||
</div>
|
||||
<a class="inline-flex items-center gap-1.5 text-ink-on-dark-2 text-[11.5px]">
|
||||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none"><rect x="2" y="2" width="8" height="8" stroke="currentColor" stroke-width="1" fill="none"/><path d="M4 5.5h4M4 7.5h2.5" stroke="currentColor" stroke-width="1"/></svg>
|
||||
RSS für diese Branche
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== BREADCRUMB ============== -->
|
||||
<div class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-2.5 flex items-center gap-2 text-[11.5px] text-ink-3">
|
||||
<a href="#" class="hover:text-ink">Startseite</a>
|
||||
<svg width="8" height="8" viewBox="0 0 8 8" class="opacity-60"><path d="M2.5 1.5l3 2.5-3 2.5" stroke="currentColor" stroke-width="1.3" fill="none"/></svg>
|
||||
<a href="#" class="hover:text-ink">Branchen</a>
|
||||
<svg width="8" height="8" viewBox="0 0 8 8" class="opacity-60"><path d="M2.5 1.5l3 2.5-3 2.5" stroke="currentColor" stroke-width="1.3" fill="none"/></svg>
|
||||
<span class="text-ink font-semibold">Energie & Klima</span>
|
||||
<span class="flex-1"></span>
|
||||
<span class="font-mono text-ink-4">/branche/energie-klima</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main class="max-w-layout mx-auto px-8 pt-9 pb-12">
|
||||
|
||||
<!-- ============== MASTHEAD ============== -->
|
||||
<section>
|
||||
<div class="grid gap-12 items-end mb-[18px]" style="grid-template-columns:1.5fr 1fr;">
|
||||
<div>
|
||||
<div class="eyebrow mb-3">Branche</div>
|
||||
<h1 class="font-serif text-[56px] font-semibold m-0 mb-4 leading-[1.02]" style="letter-spacing:-1.2px;">Energie & Klima</h1>
|
||||
<p class="font-serif text-[16px] leading-[1.55] m-0 mb-[18px] max-w-[620px] text-ink-2">
|
||||
Aktuelle Pressemitteilungen, Studien und Termine aus der Energiewirtschaft, der Wasserstoff-Industrie, dem Klima- und Netzsektor. Redaktionell geprüft, mit Investitionsvolumen, Standorten und ISIN-Bezug.
|
||||
</p>
|
||||
<div class="text-[11.5px] text-ink-3 flex items-center gap-2.5">
|
||||
<span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>
|
||||
1 482 Meldungen in den letzten 30 Tagen · 47 heute · Aktualisiert 14:38 Uhr
|
||||
</div>
|
||||
</div>
|
||||
<aside class="flex flex-col gap-2.5">
|
||||
<button class="w-full px-4 py-3 inline-flex items-center justify-center gap-2 text-[13px] font-semibold text-white bg-brand hover:bg-brand-deep transition-colors">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M3 7h8M7 3v8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
Branche folgen
|
||||
</button>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<button class="inline-flex items-center justify-center gap-1.5 px-3 py-2.5 text-[12px] font-semibold border border-bg-rule-strong bg-white">
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M1.5 3.5l4.5 3 4.5-3M1.5 3.5v6h9v-6M1.5 3.5L6 .5l4.5 3" stroke="currentColor" stroke-width="1" fill="none"/></svg>
|
||||
E-Mail-Alert
|
||||
</button>
|
||||
<button class="inline-flex items-center justify-center gap-1.5 px-3 py-2.5 text-[12px] font-semibold border border-bg-rule-strong bg-white">
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"><circle cx="2.5" cy="9.5" r="1.2" fill="currentColor"/><path d="M2 2c4.5 0 8 3.5 8 8M2 5c2.8 0 5 2.2 5 5" stroke="currentColor" stroke-width="1.2" fill="none"/></svg>
|
||||
RSS-Feed
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-1.5 pt-3.5 border-t border-bg-rule flex justify-between items-baseline text-[11px] text-ink-3">
|
||||
<div>
|
||||
<div class="eyebrow muted text-[9px] mb-1">Redaktions-Ansprech</div>
|
||||
<span class="text-[12px] text-ink-2"><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0a6f646f786d636f4a687a383e246e6f">[email protected]</a></span>
|
||||
</div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] text-ink-3 font-mono cursor-help" style="border-bottom:1px dotted #9A958D;" title="NACE C-35 · D · E">
|
||||
<svg width="10" height="10" viewBox="0 0 12 12" fill="none"><circle cx="6" cy="6" r="5" stroke="currentColor" stroke-width="1"/><path d="M6 5.5v3M6 3.5v.5" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>
|
||||
NACE-Code
|
||||
</span>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
<hr class="rule-strong" />
|
||||
</section>
|
||||
|
||||
<!-- ============== TOPIC CHIPS ============== -->
|
||||
<div class="mt-6 mb-6 flex flex-wrap items-center gap-2">
|
||||
<span class="eyebrow muted text-[10px] mr-1.5">Sub-Themen</span>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-semibold bg-ink text-bg border border-ink">Alle <span class="font-mono text-[10.5px] text-white/65 font-medium">1.482</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Erneuerbare <span class="font-mono text-[10.5px] text-ink-3 font-medium">412</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Wasserstoff <span class="font-mono text-[10.5px] text-ink-3 font-medium">184</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Netze <span class="font-mono text-[10.5px] text-ink-3 font-medium">156</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Speicher <span class="font-mono text-[10.5px] text-ink-3 font-medium">98</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Klimapolitik <span class="font-mono text-[10.5px] text-ink-3 font-medium">174</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Wärme & Gebäude <span class="font-mono text-[10.5px] text-ink-3 font-medium">121</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Atomkraft <span class="font-mono text-[10.5px] text-ink-3 font-medium">47</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">Öl & Gas <span class="font-mono text-[10.5px] text-ink-3 font-medium">92</span></button>
|
||||
<button class="inline-flex items-baseline gap-[7px] px-3.5 py-2 text-[12.5px] font-medium border border-bg-rule-strong text-ink">E-Mobilität & Laden <span class="font-mono text-[10.5px] text-ink-3 font-medium">198</span></button>
|
||||
</div>
|
||||
|
||||
<!-- ============== STAT STRIP ============== -->
|
||||
<div class="grid grid-cols-4 border-y border-bg-rule mb-8">
|
||||
<div class="px-6 py-5 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-2.5">Meldungen heute</div>
|
||||
<div class="font-serif text-[36px] font-semibold leading-none" style="letter-spacing:-0.6px;">47</div>
|
||||
<div class="flex items-center gap-1.5 mt-2 text-[11.5px]">
|
||||
<span class="inline-flex items-center text-gain font-semibold"><svg width="9" height="9" viewBox="0 0 9 9"><path d="M4.5 1.5l3 3.5h-2v3h-2v-3h-2z" fill="currentColor"/></svg></span>
|
||||
<span class="text-ink-3">+18 ggü. Wochenschnitt</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-6 py-5 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-2.5">Letzte 7 Tage</div>
|
||||
<div class="font-serif text-[36px] font-semibold leading-none" style="letter-spacing:-0.6px;">284</div>
|
||||
<div class="flex items-center gap-1.5 mt-2 text-[11.5px]">
|
||||
<span class="inline-flex items-center text-gain font-semibold"><svg width="9" height="9" viewBox="0 0 9 9"><path d="M4.5 1.5l3 3.5h-2v3h-2v-3h-2z" fill="currentColor"/></svg></span>
|
||||
<span class="text-ink-3">+12 % ggü. Vorwoche</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-6 py-5 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-2.5">Aktive Unternehmen</div>
|
||||
<div class="font-serif text-[36px] font-semibold leading-none" style="letter-spacing:-0.6px;">112</div>
|
||||
<div class="flex items-center gap-1.5 mt-2 text-[11.5px]">
|
||||
<span class="inline-flex items-center text-gain font-semibold"><svg width="9" height="9" viewBox="0 0 9 9"><path d="M4.5 1.5l3 3.5h-2v3h-2v-3h-2z" fill="currentColor"/></svg></span>
|
||||
<span class="text-ink-3">+9 neu in dieser Woche</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-6 py-5">
|
||||
<div class="eyebrow muted text-[10px] mb-2.5">Branchen-Reichweite</div>
|
||||
<div class="font-serif text-[36px] font-semibold leading-none" style="letter-spacing:-0.6px;">4,2 Mio.</div>
|
||||
<div class="flex items-center gap-1.5 mt-2 text-[11.5px]">
|
||||
<span class="inline-flex items-center text-gain font-semibold"><svg width="9" height="9" viewBox="0 0 9 9"><path d="M4.5 1.5l3 3.5h-2v3h-2v-3h-2z" fill="currentColor"/></svg></span>
|
||||
<span class="text-ink-3">Leser-Impressionen / 30 Tage</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== TOP-MELDUNG + 2 BEGLEITER ============== -->
|
||||
<section>
|
||||
<div class="grid gap-9" style="grid-template-columns:1.7fr 1fr;">
|
||||
<article>
|
||||
<div>
|
||||
<div class="relative overflow-hidden bg-hero-ocean" style="height:440px;">
|
||||
<svg width="100%" height="100%" viewBox="0 0 800 440" preserveAspectRatio="xMidYMid slice" class="absolute inset-0">
|
||||
<defs>
|
||||
<linearGradient id="bp-sky" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#7BA0C4" stop-opacity="0.25" />
|
||||
<stop offset="100%" stop-color="#0E1825" stop-opacity="0" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<rect width="800" height="440" fill="url(#bp-sky)" />
|
||||
<path d="M 0 320 L 800 290" stroke="#3D5878" stroke-width="1" opacity="0.6" />
|
||||
<circle cx="640" cy="180" r="48" fill="#C84A1E" opacity="0.7" />
|
||||
<circle cx="640" cy="180" r="72" fill="#C84A1E" opacity="0.18" />
|
||||
<g transform="translate(80 200)" opacity="0.55"><line x1="0" y1="0" x2="0" y2="140" stroke="#B8D2E6" stroke-width="2"/><circle cx="0" cy="0" r="4" fill="#E2EEF6"/><line x1="0" y1="0" x2="36" y2="-22" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="32" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="-30" stroke="#E2EEF6" stroke-width="2.5"/></g>
|
||||
<g transform="translate(180 230) scale(0.85)" opacity="0.61"><line x1="0" y1="0" x2="0" y2="140" stroke="#B8D2E6" stroke-width="2"/><circle cx="0" cy="0" r="4" fill="#E2EEF6"/><line x1="0" y1="0" x2="36" y2="-22" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="32" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="-30" stroke="#E2EEF6" stroke-width="2.5"/></g>
|
||||
<g transform="translate(290 215) scale(0.95)" opacity="0.67"><line x1="0" y1="0" x2="0" y2="140" stroke="#B8D2E6" stroke-width="2"/><circle cx="0" cy="0" r="4" fill="#E2EEF6"/><line x1="0" y1="0" x2="36" y2="-22" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="32" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="-30" stroke="#E2EEF6" stroke-width="2.5"/></g>
|
||||
<g transform="translate(410 240) scale(0.8)" opacity="0.73"><line x1="0" y1="0" x2="0" y2="140" stroke="#B8D2E6" stroke-width="2"/><circle cx="0" cy="0" r="4" fill="#E2EEF6"/><line x1="0" y1="0" x2="36" y2="-22" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="32" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="-30" stroke="#E2EEF6" stroke-width="2.5"/></g>
|
||||
<g transform="translate(510 220) scale(0.9)" opacity="0.79"><line x1="0" y1="0" x2="0" y2="140" stroke="#B8D2E6" stroke-width="2"/><circle cx="0" cy="0" r="4" fill="#E2EEF6"/><line x1="0" y1="0" x2="36" y2="-22" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="32" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="-30" stroke="#E2EEF6" stroke-width="2.5"/></g>
|
||||
<g transform="translate(710 250) scale(0.75)" opacity="0.85"><line x1="0" y1="0" x2="0" y2="140" stroke="#B8D2E6" stroke-width="2"/><circle cx="0" cy="0" r="4" fill="#E2EEF6"/><line x1="0" y1="0" x2="36" y2="-22" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="32" stroke="#E2EEF6" stroke-width="2.5"/><line x1="0" y1="0" x2="-18" y2="-30" stroke="#E2EEF6" stroke-width="2.5"/></g>
|
||||
<rect x="0" y="320" width="800" height="120" fill="#0A121C" opacity="0.5"/>
|
||||
<path d="M0 380 H800 M0 400 H800 M0 420 H800" stroke="#1F3A56" stroke-width="1" opacity="0.4"/>
|
||||
</svg>
|
||||
<div class="absolute top-5 left-5 flex gap-2">
|
||||
<span class="bp-tag">Top-Meldung</span>
|
||||
<span class="bp-tag verified">✓ Verifiziert</span>
|
||||
</div>
|
||||
<div class="absolute left-0 right-0 bottom-0 px-9 pb-8 pt-[70px] text-white" style="background:linear-gradient(180deg,transparent,rgba(0,0,0,0.92));">
|
||||
<div class="eyebrow mb-3" style="color:#FF8B6F;">Wasserstoff · Offshore</div>
|
||||
<h1 class="font-serif text-[34px] font-semibold m-0 leading-[1.12] tracking-[-0.6px] max-w-[680px]">
|
||||
RWE startet 1,8-GW-Offshore-Windpark vor Helgoland — größtes Nordsee-Projekt 2025 geht in die Bauphase
|
||||
</h1>
|
||||
<p class="font-serif text-[14.5px] leading-[1.5] mt-3.5 max-w-[600px] text-white/85">
|
||||
Mit einem Investitionsvolumen von 4,1 Milliarden Euro entsteht in der deutschen Bucht der bislang größte zusammenhängende Offshore-Komplex des Konzerns. Die Inbetriebnahme der ersten 600 MW ist für Q4 2027 vorgesehen; eine Hybrid-Anbindung an den geplanten Wasserstoff-Cluster Wilhelmshaven ist Teil des Konzeptes.
|
||||
</p>
|
||||
<div class="mt-[18px] flex items-center gap-3.5 text-[12px] text-white/70 flex-wrap">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 11 11" style="color:#5BC07A;"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg>
|
||||
RWE AG
|
||||
</span>
|
||||
<span>· Essen</span><span>·</span><span class="font-mono">17.10.2026 · 09:30</span>
|
||||
<span>·</span><span>5 Min. Lesezeit</span>
|
||||
<span>·</span><span class="font-mono">Volumen 4,1 Mrd. €</span>
|
||||
<span>·</span><span class="font-mono text-white/85">ISIN DE0007037129</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<figcaption class="flex items-baseline justify-between gap-4 pt-2.5 pb-2.5 text-[11.5px] text-ink-3 border-b border-bg-rule">
|
||||
<span><strong class="text-ink-2 font-semibold">Pressefoto:</strong> Offshore-Windpark Nordsee, RWE AG — bezieht sich auf die nebenstehende Top-Meldung</span>
|
||||
<span class="font-mono text-ink-4 whitespace-nowrap">© RWE AG / Pressebild</span>
|
||||
</figcaption>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<aside>
|
||||
<div class="eyebrow muted mb-3.5">Weitere Top-Meldungen heute</div>
|
||||
|
||||
<article class="py-[18px] border-t border-bg-rule-strong border-b border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2">
|
||||
<span class="bp-cat">Wasserstoff</span>
|
||||
<span class="font-mono text-[11px] text-ink-3">12:28</span>
|
||||
</div>
|
||||
<h3 class="font-serif text-[17px] leading-[1.28] m-0 font-semibold tracking-[-0.2px]">EnBW unterzeichnet Wasserstoff-Lieferabkommen mit Air Liquide — 120 000 t pro Jahr ab 2028</h3>
|
||||
<div class="mt-2.5 text-[11.5px] text-ink-3 flex items-center gap-2">
|
||||
<svg width="11" height="11" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg>
|
||||
<span>EnBW Energie Baden-Württemberg AG</span>
|
||||
<span class="text-ink-4">·</span>
|
||||
<span class="text-[9.5px] font-bold tracking-[0.1em] uppercase text-brand border border-brand/25 px-1.5 py-px font-mono" style="background:rgba(204,55,51,0.04);">Verifiziert</span>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="py-[18px] border-b border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2">
|
||||
<span class="bp-cat">Klimapolitik</span>
|
||||
<span class="font-mono text-[11px] text-ink-3">10:55</span>
|
||||
</div>
|
||||
<h3 class="font-serif text-[17px] leading-[1.28] m-0 font-semibold tracking-[-0.2px]">Stadtwerke München erreichen 100-%-Ökostrom-Ziel für alle Privatkunden — drei Jahre vor Plan</h3>
|
||||
<div class="mt-2.5 text-[11.5px] text-ink-3 flex items-center gap-2">
|
||||
<svg width="11" height="11" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg>
|
||||
<span>SWM Versorgungs GmbH</span>
|
||||
<span class="text-ink-4">·</span>
|
||||
<span class="text-[9.5px] font-bold tracking-[0.1em] uppercase text-brand border border-brand/25 px-1.5 py-px font-mono" style="background:rgba(204,55,51,0.04);">Redaktion</span>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Pressekontakt Top-Meldung -->
|
||||
<div class="mt-[22px] px-[22px] py-5" style="background:#F1ECE2;border-top:3px solid #C84A1E;">
|
||||
<div class="eyebrow mb-2.5">Pressekontakt · Top-Meldung</div>
|
||||
<div class="flex items-center gap-3 mb-3">
|
||||
<div class="w-[42px] h-[42px] rounded-full text-white inline-flex items-center justify-center text-[14px] font-semibold font-serif" style="background:linear-gradient(135deg,#1A2D44,#2A4566);">SK</div>
|
||||
<div>
|
||||
<div class="font-serif text-[15px] font-semibold leading-[1.2]">Stephanie Klein</div>
|
||||
<div class="text-[11.5px] text-ink-3 mt-0.5">Leitung Konzernkommunikation · RWE AG</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-[12px] text-ink-2 leading-[1.55] mb-3">
|
||||
<div><span class="font-mono text-ink-3">Tel.</span> +49 201 5179-5111</div>
|
||||
<div><span class="font-mono text-ink-3">Mail</span> <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="cebebcabbdbdab8ebcb9abe0ada1a3">[email protected]</a></div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<button class="px-2.5 py-2 text-[12px] font-semibold border border-ink text-ink bg-white">Pressemappe</button>
|
||||
<button class="px-2.5 py-2 text-[12px] font-semibold bg-brand hover:bg-brand-deep text-white">Anfrage senden</button>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== AKTUELLE MELDUNGEN ============== -->
|
||||
<section class="mt-16 grid gap-9" style="grid-template-columns:1.7fr 1fr;">
|
||||
<div>
|
||||
<header class="flex items-baseline justify-between mb-4 min-h-[34px]">
|
||||
<h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px]">
|
||||
Aktuelle Meldungen <span class="text-[14px] text-ink-3 font-normal ml-1.5">· Energie & Klima</span>
|
||||
</h2>
|
||||
<div class="flex gap-[18px] text-[12.5px] text-ink-3">
|
||||
<a class="text-ink border-b-[1.5px] border-brand pb-0.5 cursor-pointer">Alle</a>
|
||||
<a class="cursor-pointer">Heute</a>
|
||||
<a class="cursor-pointer">Diese Woche</a>
|
||||
<a class="cursor-pointer">Diesen Monat</a>
|
||||
</div>
|
||||
</header>
|
||||
<hr class="rule-strong" />
|
||||
|
||||
<!-- FEED ROWS -->
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">14:32</span>
|
||||
<span class="bp-cat text-[10.5px]">Erneuerbare</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium flex items-baseline gap-2 flex-wrap">
|
||||
<span>Siemens Energy hebt Jahresprognose an — Auftragsbestand Gas Services auf Rekordhoch</span>
|
||||
<span class="inline-flex items-center gap-1 text-[9.5px] font-bold tracking-[0.1em] uppercase text-brand font-mono border border-brand/30 px-1.5 py-px" style="background:rgba(204,55,51,0.04);">
|
||||
<svg width="9" height="9" viewBox="0 0 12 12"><path d="M6 1l1.5 3.2 3.5.4-2.6 2.4.7 3.5L6 8.8l-3.1 1.7.7-3.5L1 4.6l3.5-.4z" fill="currentColor"/></svg>Empfehlung
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Siemens Energy AG · München</span></div>
|
||||
</div>
|
||||
<span class="font-mono text-[10.5px] text-ink-3 bg-bg-elev px-1.5 py-0.5 border border-bg-rule whitespace-nowrap">ISIN</span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">14:18</span>
|
||||
<span class="bp-cat text-[10.5px]">Klimapolitik</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium flex items-baseline gap-2 flex-wrap">
|
||||
<span>BMWK kündigt 12-Mrd-Programm zur Industrie-Dekarbonisierung an — erste Tranche 4,8 Mrd. ab Q3 2026</span>
|
||||
<span class="inline-flex items-center gap-1 text-[9.5px] font-bold tracking-[0.1em] uppercase text-brand font-mono border border-brand/30 px-1.5 py-px" style="background:rgba(204,55,51,0.04);">
|
||||
<svg width="9" height="9" viewBox="0 0 12 12"><path d="M6 1l1.5 3.2 3.5.4-2.6 2.4.7 3.5L6 8.8l-3.1 1.7.7-3.5L1 4.6l3.5-.4z" fill="currentColor"/></svg>Empfehlung
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Bundesministerium für Wirtschaft und Klimaschutz · Berlin</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">13:55</span>
|
||||
<span class="bp-cat text-[10.5px]">Speicher</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">Fluence eröffnet europäische Gigafactory für Batteriespeicher in Halle (Saale) — 380 neue Stellen</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Fluence Energy GmbH · Halle (Saale)</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">13:14</span>
|
||||
<span class="bp-cat text-[10.5px]">Erneuerbare</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">Verbund AG bestätigt 4-Mrd-Investitionsplan für österreichischen Wasserkraft-Ausbau bis 2030</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Verbund AG · Wien</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">12:47</span>
|
||||
<span class="bp-cat text-[10.5px]">Netze</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">TenneT vergibt 2,3-Mrd-Auftrag für HGÜ-Korridor SuedLink an Konsortium Siemens Energy / Hitachi</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>TenneT TSO GmbH · Bayreuth</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">11:50</span>
|
||||
<span class="bp-cat text-[10.5px]">Wärme & Gebäude</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">Vaillant kündigt 700-Mio-Investition in europäische Wärmepumpen-Produktion an — Erweiterung Remscheid</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Vaillant Group · Remscheid</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">11:20</span>
|
||||
<span class="bp-cat text-[10.5px]">E-Mobilität</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">Ionity erweitert Ultraschnellladenetz auf 1 000 Stationen in DACH — Schwerpunkt Autobahn-Knotenpunkte</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Ionity GmbH · München</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<!-- FEED-AD nach Position 6 -->
|
||||
<div class="my-2">
|
||||
<div class="flex items-center gap-2.5">
|
||||
<span class="h-px flex-1" style="background:#C8BDA8;"></span>
|
||||
<span class="text-[9px] font-bold tracking-[0.22em] uppercase font-mono" style="color:#8A847B;">Anzeige</span>
|
||||
<span class="h-px flex-1" style="background:#C8BDA8;"></span>
|
||||
</div>
|
||||
<a class="grid items-baseline p-4 gap-4" style="grid-template-columns:60px 120px 1fr auto; background:#F1ECE2;">
|
||||
<span class="font-mono text-[12px]" style="color:#6E6862;">Promotion</span>
|
||||
<span class="text-[10.5px] font-bold tracking-[0.14em] uppercase" style="color:#6E6862;">Anzeige · Energie</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium" style="color:#3A332B;">Webinar 19. Nov: Wie Industrie-CFOs CCfD-Verträge richtig kalkulieren</div>
|
||||
<div class="text-[11px] mt-1" style="color:#6E6862;">PwC Deutschland · Carbon Advisory</div>
|
||||
</div>
|
||||
<span class="text-[9.5px] font-bold tracking-[0.1em] uppercase font-mono whitespace-nowrap px-1.5 py-0.5" style="color:#8A847B;border:1px solid #C8BDA8;">Promotion</span>
|
||||
</a>
|
||||
<div class="flex items-center gap-2.5">
|
||||
<span class="h-px flex-1" style="background:#C8BDA8;"></span>
|
||||
<span class="text-[9px] font-bold tracking-[0.22em] uppercase font-mono" style="color:#8A847B;">Ende Anzeige</span>
|
||||
<span class="h-px flex-1" style="background:#C8BDA8;"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">10:48</span>
|
||||
<span class="bp-cat text-[10.5px]">Erneuerbare</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">BayWa r.e. veräußert 660-MW-Solar-Portfolio Spanien an Allianz Capital Partners</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>BayWa r.e. AG · München</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">09:33</span>
|
||||
<span class="bp-cat text-[10.5px]">Wasserstoff</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium flex items-baseline gap-2 flex-wrap">
|
||||
<span>Linde plc und Sasol vereinbaren Joint Venture für grünen Wasserstoff in Mitteldeutschland</span>
|
||||
<span class="inline-flex items-center gap-1 text-[9.5px] font-bold tracking-[0.1em] uppercase text-brand font-mono border border-brand/30 px-1.5 py-px" style="background:rgba(204,55,51,0.04);">
|
||||
<svg width="9" height="9" viewBox="0 0 12 12"><path d="M6 1l1.5 3.2 3.5.4-2.6 2.4.7 3.5L6 8.8l-3.1 1.7.7-3.5L1 4.6l3.5-.4z" fill="currentColor"/></svg>Empfehlung
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Linde plc · Dublin</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">09:18</span>
|
||||
<span class="bp-cat text-[10.5px]">Klimapolitik</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">EU-Kommission notifiziert deutsches Carbon-Contracts-for-Difference-Programm — Auszahlung ab Juli möglich</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Bundesnetzagentur · Bonn</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">08:15</span>
|
||||
<span class="bp-cat text-[10.5px]">Speicher</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">Northvolt Germany sichert sich 1,1 Mrd. € Finanzierung für Zellfabrik Heide — Baubeginn verschoben auf Q2 2026</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Northvolt Germany GmbH · Heide</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<a class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 120px 1fr auto; gap:16px;">
|
||||
<span class="font-mono text-[12px] text-ink-3">07:42</span>
|
||||
<span class="bp-cat text-[10.5px]">Öl & Gas</span>
|
||||
<div>
|
||||
<div class="font-serif text-[15.5px] leading-[1.3] font-medium">Wintershall Dea schliesst Trennung des russischen Geschäfts ab — Bilanzwirkung im Q3-Bericht erwartet</div>
|
||||
<div class="text-[11px] text-ink-3 mt-1 flex items-center gap-1.5"><svg width="9" height="9" viewBox="0 0 11 11" class="text-ok"><circle cx="5.5" cy="5.5" r="5" fill="currentColor"/><path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round"/></svg><span>Wintershall Dea GmbH · Kassel</span></div>
|
||||
</div>
|
||||
<span></span>
|
||||
</a>
|
||||
|
||||
<div class="flex justify-between items-center mt-7">
|
||||
<span class="text-[11.5px] text-ink-3">12 von 284 Meldungen · letzte 7 Tage</span>
|
||||
<button class="px-3.5 py-2.5 text-[13px] font-semibold border border-bg-rule-strong bg-white text-ink hover:bg-bg-elev">Weitere 272 Meldungen anzeigen →</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SIDEBAR -->
|
||||
<aside class="flex flex-col gap-9">
|
||||
<!-- Meistgelesen -->
|
||||
<div>
|
||||
<header class="flex items-baseline justify-between mb-3 min-h-[34px]">
|
||||
<h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px]">Meistgelesen</h2>
|
||||
<span class="eyebrow muted text-[10px]">in dieser Branche</span>
|
||||
</header>
|
||||
<div class="inline-flex mb-3 border border-bg-rule-strong bg-bg-elev">
|
||||
<button class="px-3 py-1.5 text-[11px] font-semibold font-mono uppercase tracking-wider text-ink-2">24 h</button>
|
||||
<button class="px-3 py-1.5 text-[11px] font-semibold font-mono uppercase tracking-wider bg-ink text-bg border-l border-bg-rule">7 Tage</button>
|
||||
<button class="px-3 py-1.5 text-[11px] font-semibold font-mono uppercase tracking-wider text-ink-2 border-l border-bg-rule">30 Tage</button>
|
||||
</div>
|
||||
<hr class="rule-strong mb-1" />
|
||||
|
||||
<div class="py-3.5 border-b border-bg-rule">
|
||||
<div class="grid items-baseline gap-2.5 mb-1.5" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="font-serif text-[18px] text-brand font-semibold leading-none">1</div>
|
||||
<div class="font-serif text-[14px] leading-[1.3] font-medium">RWE: 1,8-GW-Offshore-Park Helgoland startet</div>
|
||||
<span class="font-mono text-[11px] text-ink-3">9.842</span>
|
||||
</div>
|
||||
<div class="ml-[42px] h-[3px] bg-bg-rule"><div class="h-full bg-brand" style="width:100%;"></div></div>
|
||||
</div>
|
||||
<div class="py-3.5 border-b border-bg-rule">
|
||||
<div class="grid items-baseline gap-2.5 mb-1.5" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="font-serif text-[18px] text-brand font-semibold leading-none">2</div>
|
||||
<div class="font-serif text-[14px] leading-[1.3] font-medium">BMWK: 12-Mrd-Programm Industrie-Dekarbonisierung</div>
|
||||
<span class="font-mono text-[11px] text-ink-3">8.214</span>
|
||||
</div>
|
||||
<div class="ml-[42px] h-[3px] bg-bg-rule"><div class="h-full bg-brand" style="width:83%;"></div></div>
|
||||
</div>
|
||||
<div class="py-3.5 border-b border-bg-rule">
|
||||
<div class="grid items-baseline gap-2.5 mb-1.5" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="font-serif text-[18px] text-brand font-semibold leading-none">3</div>
|
||||
<div class="font-serif text-[14px] leading-[1.3] font-medium">Fluence Gigafactory Halle — 380 neue Stellen</div>
|
||||
<span class="font-mono text-[11px] text-ink-3">6.428</span>
|
||||
</div>
|
||||
<div class="ml-[42px] h-[3px] bg-bg-rule"><div class="h-full bg-brand" style="width:65%;"></div></div>
|
||||
</div>
|
||||
<div class="py-3.5 border-b border-bg-rule">
|
||||
<div class="grid items-baseline gap-2.5 mb-1.5" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="font-serif text-[18px] text-brand font-semibold leading-none">4</div>
|
||||
<div class="font-serif text-[14px] leading-[1.3] font-medium">TenneT vergibt 2,3-Mrd-Auftrag SuedLink</div>
|
||||
<span class="font-mono text-[11px] text-ink-3">5.102</span>
|
||||
</div>
|
||||
<div class="ml-[42px] h-[3px] bg-bg-rule"><div class="h-full bg-brand" style="width:52%;"></div></div>
|
||||
</div>
|
||||
<div class="py-3.5">
|
||||
<div class="grid items-baseline gap-2.5 mb-1.5" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="font-serif text-[18px] text-brand font-semibold leading-none">5</div>
|
||||
<div class="font-serif text-[14px] leading-[1.3] font-medium">Linde / Sasol JV für grünen Wasserstoff</div>
|
||||
<span class="font-mono text-[11px] text-ink-3">3.914</span>
|
||||
</div>
|
||||
<div class="ml-[42px] h-[3px] bg-bg-rule"><div class="h-full bg-brand" style="width:40%;"></div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Newsletter CTA -->
|
||||
<div class="p-6 bg-strip text-ink-on-dark" style="background:#1A1F26;">
|
||||
<div class="eyebrow mb-2" style="color:#FF8B6F;">Branchen-Briefing</div>
|
||||
<h3 class="font-serif text-[20px] font-semibold m-0 mb-2 text-white leading-[1.2]" style="letter-spacing:-0.2px;">Energie & Klima — kompakt im Postfach</h3>
|
||||
<p class="text-[12.5px] leading-[1.55] m-0 mb-4 text-white/85">Jeden Freitag · Top-Meldungen, Studien, Termine · 8 Min. Lesezeit</p>
|
||||
<input type="email" placeholder="ihre@firma.de" readonly class="w-full px-3 py-2.5 text-[12px] text-white mb-2.5 outline-none" style="border:1px solid rgba(255,255,255,0.18);background:rgba(255,255,255,0.06);" />
|
||||
<button class="w-full px-3 py-2.5 text-[13px] font-semibold bg-brand text-white hover:bg-brand-deep">Kostenlos abonnieren →</button>
|
||||
<div class="mt-2.5 text-[10.5px] text-white/55 leading-[1.45]">DSGVO-konform · Abbestellung jederzeit möglich</div>
|
||||
</div>
|
||||
|
||||
<!-- Top-Newsrooms -->
|
||||
<div>
|
||||
<header class="flex items-baseline justify-between mb-3.5 min-h-[34px]">
|
||||
<h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px]">Top-Newsrooms</h2>
|
||||
<span class="eyebrow muted text-[10px]">letzte 7 Tage</span>
|
||||
</header>
|
||||
<hr class="rule-strong mb-1" />
|
||||
|
||||
<a class="grid items-center gap-3 py-3 border-b border-bg-rule" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="w-8 h-8 inline-flex items-center justify-center text-white text-[14px] font-bold font-serif" style="background:#1D4E8B;">R</div>
|
||||
<div><div class="text-[13.5px] font-semibold leading-[1.2]">RWE AG</div><div class="text-[11px] text-ink-3 mt-0.5"><span class="font-mono">12</span> Meldungen letzte 7 Tage</div></div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] font-semibold text-ink-2 px-2 py-[3px] whitespace-nowrap" style="background:rgba(204,55,51,0.06);border:1px solid rgba(204,55,51,0.18);"><span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>heute aktiv</span>
|
||||
</a>
|
||||
<a class="grid items-center gap-3 py-3 border-b border-bg-rule" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="w-8 h-8 inline-flex items-center justify-center text-white text-[14px] font-bold font-serif" style="background:#005C32;">E</div>
|
||||
<div><div class="text-[13.5px] font-semibold leading-[1.2]">EnBW Energie</div><div class="text-[11px] text-ink-3 mt-0.5"><span class="font-mono">9</span> Meldungen letzte 7 Tage</div></div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] font-semibold text-ink-2 px-2 py-[3px] whitespace-nowrap" style="background:rgba(204,55,51,0.06);border:1px solid rgba(204,55,51,0.18);"><span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>heute aktiv</span>
|
||||
</a>
|
||||
<a class="grid items-center gap-3 py-3 border-b border-bg-rule" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="w-8 h-8 inline-flex items-center justify-center text-white text-[14px] font-bold font-serif" style="background:#0098A6;">S</div>
|
||||
<div><div class="text-[13.5px] font-semibold leading-[1.2]">Siemens Energy</div><div class="text-[11px] text-ink-3 mt-0.5"><span class="font-mono">11</span> Meldungen letzte 7 Tage</div></div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] font-semibold text-ink-2 px-2 py-[3px] whitespace-nowrap" style="background:rgba(204,55,51,0.06);border:1px solid rgba(204,55,51,0.18);"><span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>heute aktiv</span>
|
||||
</a>
|
||||
<a class="grid items-center gap-3 py-3 border-b border-bg-rule" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="w-8 h-8 inline-flex items-center justify-center text-white text-[14px] font-bold font-serif" style="background:#000000;">B</div>
|
||||
<div><div class="text-[13.5px] font-semibold leading-[1.2]">BMWK</div><div class="text-[11px] text-ink-3 mt-0.5"><span class="font-mono">7</span> Meldungen letzte 7 Tage</div></div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] font-semibold text-ink-2 px-2 py-[3px] whitespace-nowrap" style="background:rgba(204,55,51,0.06);border:1px solid rgba(204,55,51,0.18);"><span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>heute aktiv</span>
|
||||
</a>
|
||||
<a class="grid items-center gap-3 py-3 border-b border-bg-rule" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="w-8 h-8 inline-flex items-center justify-center text-white text-[14px] font-bold font-serif" style="background:#D85C28;">T</div>
|
||||
<div><div class="text-[13.5px] font-semibold leading-[1.2]">TenneT</div><div class="text-[11px] text-ink-3 mt-0.5"><span class="font-mono">6</span> Meldungen letzte 7 Tage</div></div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] font-semibold text-ink-2 px-2 py-[3px] whitespace-nowrap" style="background:rgba(204,55,51,0.06);border:1px solid rgba(204,55,51,0.18);"><span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>heute aktiv</span>
|
||||
</a>
|
||||
<a class="grid items-center gap-3 py-3" style="grid-template-columns:32px 1fr auto;">
|
||||
<div class="w-8 h-8 inline-flex items-center justify-center text-white text-[14px] font-bold font-serif" style="background:#1F1F1F;">V</div>
|
||||
<div><div class="text-[13.5px] font-semibold leading-[1.2]">Vaillant</div><div class="text-[11px] text-ink-3 mt-0.5"><span class="font-mono">4</span> Meldungen letzte 7 Tage</div></div>
|
||||
<span class="inline-flex items-center gap-1 text-[10.5px] font-semibold text-ink-2 px-2 py-[3px] whitespace-nowrap" style="background:rgba(204,55,51,0.06);border:1px solid rgba(204,55,51,0.18);"><span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>heute aktiv</span>
|
||||
</a>
|
||||
<a class="block mt-3 text-[12px] text-brand font-semibold">Alle 312 Newsrooms in Energie & Klima →</a>
|
||||
</div>
|
||||
</aside>
|
||||
</section>
|
||||
|
||||
<!-- ============== SUB-INDEX ============== -->
|
||||
<section class="mt-16">
|
||||
<header class="flex items-baseline justify-between mb-4">
|
||||
<h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px]">Sub-Branchen <span class="text-[14px] text-ink-3 font-normal ml-1.5">· Volumen letzte 30 Tage</span></h2>
|
||||
<span class="eyebrow muted">7-Tage-Trend</span>
|
||||
</header>
|
||||
<hr class="rule-strong" />
|
||||
<div class="grid grid-cols-4 border-b border-bg-rule">
|
||||
<a class="block px-[22px] py-5 border-r border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Erneuerbare</span><span class="font-mono text-[12px] text-gain font-semibold">+18%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">412</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€3,2 Mrd.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:100%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5 border-r border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Wasserstoff</span><span class="font-mono text-[12px] text-gain font-semibold">+24%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">184</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€1,4 Mrd.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:78%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5 border-r border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Klimapolitik</span><span class="font-mono text-[12px] text-gain font-semibold">+6%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">174</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€2,1 Mrd.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:60%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">E-Mobilität</span><span class="font-mono text-[12px] text-gain font-semibold">+11%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">198</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€840 Mio.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:70%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5 border-t border-r border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Netze</span><span class="font-mono text-[12px] text-gain font-semibold">+4%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">156</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€1,8 Mrd.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:55%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5 border-t border-r border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Wärme & Gebäude</span><span class="font-mono text-[12px] text-gain font-semibold">+9%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">121</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€720 Mio.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:48%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5 border-t border-r border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Speicher</span><span class="font-mono text-[12px] text-gain font-semibold">+15%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">98</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€640 Mio.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-gain" style="width:38%;"></div></div>
|
||||
</a>
|
||||
<a class="block px-[22px] py-5 border-t border-bg-rule">
|
||||
<div class="flex justify-between items-baseline mb-2"><span class="text-[14px] font-semibold">Öl & Gas</span><span class="font-mono text-[12px] text-loss font-semibold">-3%</span></div>
|
||||
<div class="flex items-baseline gap-2 mb-1.5"><span class="font-serif text-[24px] font-semibold tracking-[-0.3px]">92</span><span class="text-[11px] text-ink-3">Meldungen</span></div>
|
||||
<div class="text-[11px] text-ink-3 mb-2.5">Volumen <span class="font-mono text-ink-2">€410 Mio.</span></div>
|
||||
<div class="h-[3px] bg-bg-rule"><div class="h-full bg-brand" style="width:36%;"></div></div>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== STUDIEN & WHITEPAPER ============== -->
|
||||
<section class="mt-16">
|
||||
<header class="flex items-baseline justify-between mb-4">
|
||||
<h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px]">Studien & Whitepaper</h2>
|
||||
<a class="text-[12.5px] text-brand font-semibold">Alle 38 Publikationen →</a>
|
||||
</header>
|
||||
<hr class="rule-strong mb-6" />
|
||||
<div class="grid grid-cols-2 gap-6">
|
||||
<div class="p-[22px] grid gap-[18px] items-start" style="grid-template-columns:auto 1fr; background:#F1ECE2; border-top:3px solid #C84A1E;">
|
||||
<div class="relative flex flex-col w-20 h-[104px] bg-white border border-bg-rule-strong flex-shrink-0">
|
||||
<div class="h-3 bg-brand"></div>
|
||||
<div class="px-2 pt-2 flex-1 flex flex-col gap-1">
|
||||
<div style="height:2.5px;width:100%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:85%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:70%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:95%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:60%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:50%;background:#D6D2C8;"></div>
|
||||
</div>
|
||||
<div class="absolute bottom-1.5 right-1.5 text-[8px] font-mono text-ink-4">PDF</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="eyebrow mb-2 text-[10px]">Studie · Branchen-Monitor</div>
|
||||
<h3 class="font-serif text-[18px] font-semibold m-0 mb-2.5 tracking-[-0.2px] leading-[1.25]">Energiewende-Monitor 2025 — Investitionen, Engpässe, Potenziale im DACH-Raum</h3>
|
||||
<div class="text-[12px] text-ink-3 mb-3.5">
|
||||
Fraunhofer-Institut für Solare Energiesysteme<br />
|
||||
<span class="font-mono text-[11px]">84 Seiten · Veröffentlicht 11. November 2025</span>
|
||||
</div>
|
||||
<div class="flex gap-2 items-center">
|
||||
<button class="px-3.5 py-2 text-[12px] font-semibold border border-ink text-ink bg-transparent">↓ Herunterladen</button>
|
||||
<span class="text-[10.5px] text-ink-3 inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none" style="color:#8A847B;"><rect x="2.5" y="5.5" width="7" height="5" stroke="currentColor" stroke-width="1"/><path d="M4 5.5V4a2 2 0 014 0v1.5" stroke="currentColor" stroke-width="1" fill="none"/></svg>
|
||||
Anmeldung per E-Mail
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-[22px] grid gap-[18px] items-start" style="grid-template-columns:auto 1fr; background:#F1ECE2; border-top:3px solid #C84A1E;">
|
||||
<div class="relative flex flex-col w-20 h-[104px] bg-white border border-bg-rule-strong flex-shrink-0">
|
||||
<div class="h-3 bg-brand"></div>
|
||||
<div class="px-2 pt-2 flex-1 flex flex-col gap-1">
|
||||
<div style="height:2.5px;width:100%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:85%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:70%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:95%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:60%;background:#D6D2C8;"></div>
|
||||
<div style="height:2.5px;width:50%;background:#D6D2C8;"></div>
|
||||
</div>
|
||||
<div class="absolute bottom-1.5 right-1.5 text-[8px] font-mono text-ink-4">PDF</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="eyebrow mb-2 text-[10px]">Whitepaper · Wasserstoff</div>
|
||||
<h3 class="font-serif text-[18px] font-semibold m-0 mb-2.5 tracking-[-0.2px] leading-[1.25]">Grüner Wasserstoff in der Stahl- und Chemieindustrie — Roadmap 2026 – 2032</h3>
|
||||
<div class="text-[12px] text-ink-3 mb-3.5">
|
||||
BDI / Boston Consulting Group<br />
|
||||
<span class="font-mono text-[11px]">42 Seiten · Veröffentlicht 28. Oktober 2025</span>
|
||||
</div>
|
||||
<div class="flex gap-2 items-center">
|
||||
<button class="px-3.5 py-2 text-[12px] font-semibold border border-ink text-ink bg-transparent">↓ Herunterladen</button>
|
||||
<span class="text-[10.5px] text-ink-3 inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none" style="color:#8A847B;"><rect x="2.5" y="5.5" width="7" height="5" stroke="currentColor" stroke-width="1"/><path d="M4 5.5V4a2 2 0 014 0v1.5" stroke="currentColor" stroke-width="1" fill="none"/></svg>
|
||||
Anmeldung per E-Mail
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== TERMINE ============== -->
|
||||
<section class="mt-16">
|
||||
<header class="flex items-baseline justify-between mb-4">
|
||||
<h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px]">Branchen-Termine</h2>
|
||||
<span class="eyebrow muted">Nächste 7 Tage · Quelle: Bundesanzeiger, Veranstalter</span>
|
||||
</header>
|
||||
<hr class="rule-strong" />
|
||||
<div class="grid grid-cols-5 border-b border-bg-rule">
|
||||
<div class="px-5 py-[18px] border-r border-bg-rule">
|
||||
<div class="flex items-baseline gap-1.5 mb-2.5"><span class="text-[10px] font-bold tracking-[0.12em] text-ink-3 uppercase">Mi</span><span class="font-serif text-[22px] font-semibold tracking-[-0.3px] leading-none">12. Nov</span></div>
|
||||
<span class="bp-cat text-[10px]">Hauptversammlung</span>
|
||||
<h3 class="font-serif text-[14.5px] leading-[1.25] m-0 my-2 font-semibold">RWE AG · Außerordentliche Hauptversammlung</h3>
|
||||
<div class="text-[11px] text-ink-3">Essen · Grugahalle</div>
|
||||
</div>
|
||||
<div class="px-5 py-[18px] border-r border-bg-rule">
|
||||
<div class="flex items-baseline gap-1.5 mb-2.5"><span class="text-[10px] font-bold tracking-[0.12em] text-ink-3 uppercase">Do</span><span class="font-serif text-[22px] font-semibold tracking-[-0.3px] leading-none">13. Nov</span></div>
|
||||
<span class="bp-cat text-[10px]">Q3-Bericht</span>
|
||||
<h3 class="font-serif text-[14.5px] leading-[1.25] m-0 my-2 font-semibold">Siemens Energy · Q4 / Jahresergebnis</h3>
|
||||
<div class="text-[11px] text-ink-3">München · 07:00 Uhr</div>
|
||||
</div>
|
||||
<div class="px-5 py-[18px] border-r border-bg-rule">
|
||||
<div class="flex items-baseline gap-1.5 mb-2.5"><span class="text-[10px] font-bold tracking-[0.12em] text-ink-3 uppercase">Mo</span><span class="font-serif text-[22px] font-semibold tracking-[-0.3px] leading-none">17. Nov</span></div>
|
||||
<span class="bp-cat text-[10px]">Konferenz</span>
|
||||
<h3 class="font-serif text-[14.5px] leading-[1.25] m-0 my-2 font-semibold">Handelsblatt Energie-Gipfel 2025</h3>
|
||||
<div class="text-[11px] text-ink-3">Berlin · CityCube</div>
|
||||
</div>
|
||||
<div class="px-5 py-[18px] border-r border-bg-rule">
|
||||
<div class="flex items-baseline gap-1.5 mb-2.5"><span class="text-[10px] font-bold tracking-[0.12em] text-ink-3 uppercase">Di</span><span class="font-serif text-[22px] font-semibold tracking-[-0.3px] leading-none">18. Nov</span></div>
|
||||
<span class="bp-cat text-[10px]">Messe</span>
|
||||
<h3 class="font-serif text-[14.5px] leading-[1.25] m-0 my-2 font-semibold">Hydrogen Technology Expo Europe</h3>
|
||||
<div class="text-[11px] text-ink-3">Hamburg · Messehallen</div>
|
||||
</div>
|
||||
<div class="px-5 py-[18px]">
|
||||
<div class="flex items-baseline gap-1.5 mb-2.5"><span class="text-[10px] font-bold tracking-[0.12em] text-ink-3 uppercase">Mi</span><span class="font-serif text-[22px] font-semibold tracking-[-0.3px] leading-none">19. Nov</span></div>
|
||||
<span class="bp-cat text-[10px]">Bekanntmachung</span>
|
||||
<h3 class="font-serif text-[14.5px] leading-[1.25] m-0 my-2 font-semibold">BNetzA · Ausschreibungsergebnis Offshore</h3>
|
||||
<div class="text-[11px] text-ink-3">Bonn · 11:00 Uhr</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3.5 text-[12.5px]"><a class="text-brand font-semibold">Alle Termine im Branchen-Kalender →</a></div>
|
||||
</section>
|
||||
|
||||
<!-- ============== VERWANDTE BRANCHEN ============== -->
|
||||
<section class="mt-16">
|
||||
<header class="mb-4"><h2 class="font-serif text-[22px] font-semibold m-0 tracking-[-0.2px]">Verwandte Branchen</h2></header>
|
||||
<hr class="rule mb-5" />
|
||||
<div class="flex flex-wrap gap-2.5">
|
||||
<a class="inline-flex items-baseline gap-2 px-3.5 py-2.5 text-[13px] font-semibold bg-bg-elev border border-bg-rule-strong">Industrie & Maschinenbau <span class="font-mono text-[11px] text-ink-3 font-medium">248</span></a>
|
||||
<a class="inline-flex items-baseline gap-2 px-3.5 py-2.5 text-[13px] font-semibold bg-bg-elev border border-bg-rule-strong">Chemie & Werkstoffe <span class="font-mono text-[11px] text-ink-3 font-medium">184</span></a>
|
||||
<a class="inline-flex items-baseline gap-2 px-3.5 py-2.5 text-[13px] font-semibold bg-bg-elev border border-bg-rule-strong">Automobil & Mobilität <span class="font-mono text-[11px] text-ink-3 font-medium">312</span></a>
|
||||
<a class="inline-flex items-baseline gap-2 px-3.5 py-2.5 text-[13px] font-semibold bg-bg-elev border border-bg-rule-strong">Bauen & Immobilien <span class="font-mono text-[11px] text-ink-3 font-medium">156</span></a>
|
||||
<a class="inline-flex items-baseline gap-2 px-3.5 py-2.5 text-[13px] font-semibold bg-bg-elev border border-bg-rule-strong">Finanzen & Versicherung <span class="font-mono text-[11px] text-ink-3 font-medium">421</span></a>
|
||||
<a class="inline-flex items-baseline gap-2 px-3.5 py-2.5 text-[13px] font-semibold bg-bg-elev border border-bg-rule-strong">Politik & Verwaltung <span class="font-mono text-[11px] text-ink-3 font-medium">198</span></a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== PUBLISHER-CTA ============== -->
|
||||
<section class="mt-16 p-9 text-ink-on-dark" style="background:#1A1F26;">
|
||||
<div class="grid gap-9 items-center" style="grid-template-columns:1.4fr 1fr;">
|
||||
<div>
|
||||
<div class="eyebrow mb-2.5" style="color:#FF8B6F;">Für Unternehmen aus Energie & Klima</div>
|
||||
<h3 class="font-serif text-[28px] font-semibold m-0 mb-2.5 leading-[1.15] text-white" style="letter-spacing:-0.3px;">Veröffentlichen Sie Ihre Pressemitteilung gezielt in der Energiewirtschaft.</h3>
|
||||
<p class="text-[14px] leading-[1.55] m-0 max-w-[540px] text-white/80">
|
||||
Reichweite über 312 aktive Newsrooms · Distribution an Fach- und Wirtschaftsredaktionen · Strukturierte Daten mit ISIN-, Standort- und Volumen-Bezug.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-col gap-2.5">
|
||||
<button class="w-full px-[18px] py-3.5 text-[14px] font-semibold bg-brand text-white hover:bg-brand-deep">Pressemitteilung einreichen →</button>
|
||||
<button class="w-full px-[18px] py-3 text-[14px] font-semibold text-white" style="border:1px solid rgba(255,255,255,0.3);background:transparent;">Tarife & Branchen-Pakete ansehen</button>
|
||||
<div class="text-[11px] text-white/55 text-center mt-1">Redaktionelle Prüfung · DSGVO-konform · Erst-Veröffentlichung kostenfrei</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- ============== FOOTER MINI ============== -->
|
||||
<footer class="bg-bg-footer text-ink-on-dark-2 pt-8 pb-6">
|
||||
<div class="max-w-layout mx-auto px-8 flex justify-between items-center text-[12px]">
|
||||
<div class="font-serif text-[18px] text-white font-semibold">businessportal<span class="text-brand">24</span></div>
|
||||
<div class="flex gap-[18px]">
|
||||
<a href="#" class="hover:text-white">Impressum</a>
|
||||
<a href="#" class="hover:text-white">Datenschutz</a>
|
||||
<a href="#" class="hover:text-white">AGB</a>
|
||||
<a href="#" class="hover:text-white">Mediadaten</a>
|
||||
<a href="#" class="hover:text-white">Kontakt</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script></body>
|
||||
</html>
|
||||
716
dev/frontend/tailwind_v3/Detailseite Tailwind.html
Normal file
716
dev/frontend/tailwind_v3/Detailseite Tailwind.html
Normal file
|
|
@ -0,0 +1,716 @@
|
|||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<title>businessportal24 — Detailseite · Pressemitteilung</title>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600;8..60,700&family=Inter+Tight:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
||||
|
||||
<!-- Tailwind v3 CDN + projekt-eigene Konfiguration -->
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms"></script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
/* Surfaces */
|
||||
bg: "#F6F4EF",
|
||||
"bg-elev": "#FBFAF6",
|
||||
"bg-rule": "#E5E0D5",
|
||||
"bg-rule-strong": "#1C1A17",
|
||||
"bg-dark": "#14202E",
|
||||
"bg-card-warm": "#F1ECE2",
|
||||
"bg-card-warm-border": "#D9CDB6",
|
||||
"bg-footer": "#0F1216",
|
||||
topbar: "#1A1F26",
|
||||
topbar2: "#232A33",
|
||||
/* Ink */
|
||||
ink: "#1C1A17",
|
||||
"ink-2": "#3D3935",
|
||||
"ink-3": "#6E6862",
|
||||
"ink-4": "#9A958D",
|
||||
"ink-on-dark": "#F6F4EF",
|
||||
"ink-on-dark-2": "#B8B3AA",
|
||||
/* Brand */
|
||||
brand: "#C84A1E",
|
||||
"brand-deep": "#A23814",
|
||||
"brand-soft": "#F4E5DD",
|
||||
live: "#E03A1A",
|
||||
gain: "#2E8540",
|
||||
loss: "#C8341E",
|
||||
ok: "#2E8540",
|
||||
/* Status accents */
|
||||
"warn-bg": "#FFF8E1",
|
||||
"warn-border": "#E8C77A",
|
||||
"warn-ink": "#7A5A0F",
|
||||
"warn-ink-deep": "#3D2F0F",
|
||||
"verify-bg": "#E8F4EC",
|
||||
"verify-border": "#1B8E3A",
|
||||
"verify-ink": "#0F5E26",
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['"Inter Tight"','"Söhne"','Inter','system-ui','sans-serif'],
|
||||
serif: ['"Source Serif 4"','"Source Serif Pro"','Charter','"Iowan Old Style"','Georgia','serif'],
|
||||
mono: ['"JetBrains Mono"','"SF Mono"','ui-monospace','monospace'],
|
||||
},
|
||||
maxWidth: { layout: "1280px" },
|
||||
backgroundImage: {
|
||||
"topbar-grad": "linear-gradient(135deg,#1A1F26 0%,#232A33 100%)",
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html,body { margin:0; padding:0; }
|
||||
body { background:#E8E4DA; font-family:"Inter Tight",system-ui,sans-serif; }
|
||||
|
||||
/* Helper utilities, da Tailwind-CDN keine Custom-Plugins kompiliert */
|
||||
.eyebrow {
|
||||
font-size: 11px; font-weight: 600;
|
||||
letter-spacing: 0.12em; text-transform: uppercase;
|
||||
color: #C84A1E;
|
||||
}
|
||||
.eyebrow.muted { color:#6E6862; }
|
||||
.bp-cat {
|
||||
font-size: 11px; font-weight: 700;
|
||||
letter-spacing: 0.14em; text-transform: uppercase;
|
||||
color:#C84A1E;
|
||||
}
|
||||
.rule-strong { height:1px; background:#1C1A17; border:0; margin:0; }
|
||||
.rule { height:1px; background:#E5E0D5; border:0; margin:0; }
|
||||
|
||||
/* Hatch-pattern (Hero-Bildplatzhalter) */
|
||||
.hatch-dark { background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.04) 0 10px, transparent 10px 20px); }
|
||||
.hatch-light { background-image: repeating-linear-gradient(135deg, rgba(0,0,0,0.04) 0 6px, transparent 6px 12px); }
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="bg-bg text-ink font-sans antialiased">
|
||||
|
||||
<!-- ===================================================================
|
||||
ROOT — 1280px Artboard · Detailseite Pressemitteilung (Variante A)
|
||||
=================================================================== -->
|
||||
<article class="mx-auto bg-bg relative" style="width:1280px;">
|
||||
|
||||
<!-- Reading progress bar -->
|
||||
<div class="absolute top-0 left-0 right-0 h-0.5 bg-bg-rule z-10">
|
||||
<div class="h-full bg-brand" style="width:32%;"></div>
|
||||
</div>
|
||||
|
||||
<!-- ============== TOP UTILITY BAR ============== -->
|
||||
<div class="bg-topbar-grad text-ink-on-dark-2 border-b border-black">
|
||||
<div class="max-w-layout mx-auto px-8 flex items-stretch text-[11.5px] tracking-wide">
|
||||
<span class="flex items-center pr-4 py-2 whitespace-nowrap border-r border-[#2A2723]">
|
||||
Do, 7. Mai 2026
|
||||
</span>
|
||||
<span class="flex items-center px-3.5 text-[9.5px] uppercase font-semibold tracking-[0.16em] text-[#6E6862] whitespace-nowrap">
|
||||
Ausgabe
|
||||
</span>
|
||||
|
||||
<!-- Edition tabs -->
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-semibold text-ink-on-dark bg-white/[0.06] border-b-2 border-brand -mb-px whitespace-nowrap">
|
||||
<span class="text-[12px] leading-none">🇩🇪</span><span>DE</span>
|
||||
</button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap">
|
||||
<span class="text-[12px] leading-none">🇦🇹</span><span>AT</span>
|
||||
</button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap">
|
||||
<span class="text-[12px] leading-none">🇨🇭</span><span>CH</span>
|
||||
</button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap">
|
||||
<span class="text-[12px] leading-none">🌐</span><span>EN</span>
|
||||
</button>
|
||||
|
||||
<span class="flex-1"></span>
|
||||
|
||||
<span class="flex items-center gap-4 py-2 whitespace-nowrap">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none" class="opacity-60">
|
||||
<circle cx="6" cy="6" r="5" stroke="currentColor" stroke-width="1" />
|
||||
<path d="M1 6h10M6 1c2 1.5 2 8.5 0 10M6 1c-2 1.5-2 8.5 0 10" stroke="currentColor" stroke-width="1" fill="none" />
|
||||
</svg>
|
||||
<strong class="text-ink-on-dark font-semibold">Deutsch</strong>
|
||||
</span>
|
||||
<span class="w-px h-[14px] bg-[#2A2723]"></span>
|
||||
<a href="#" class="hover:text-ink-on-dark">Newsletter</a>
|
||||
<a href="#" class="hover:text-ink-on-dark">RSS</a>
|
||||
<a href="#" class="hover:text-ink-on-dark">API</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== HEADER ============== -->
|
||||
<header class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-[18px] grid items-center gap-6"
|
||||
style="grid-template-columns:auto 1fr auto auto;">
|
||||
<div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none tracking-[-0.5px]">
|
||||
businessportal<span class="text-brand">24</span>
|
||||
</div>
|
||||
<div class="eyebrow muted mt-1 text-[9.5px] tracking-[0.18em]">
|
||||
Pressemitteilungen · DACH
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full max-w-[460px]">
|
||||
<div class="flex items-center gap-2.5 px-3.5 py-2.5 border border-bg-rule bg-bg-elev text-[13px] text-ink-3 rounded-[2px]">
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
|
||||
<circle cx="7" cy="7" r="5" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M11 11l3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
</svg>
|
||||
<span class="flex-1">Pressemitteilungen, Unternehmen, Branchen, ISIN…</span>
|
||||
<span class="text-[10.5px] text-ink-4 border border-bg-rule px-1.5 py-0.5 rounded-[2px] font-mono">⌘K</span>
|
||||
</div>
|
||||
<div class="flex justify-end mt-1.5">
|
||||
<button class="inline-flex items-center gap-1.5 text-[11.5px] text-ink-3 underline underline-offset-2 decoration-bg-rule-strong/40">
|
||||
<svg width="10" height="10" viewBox="0 0 12 12" fill="none">
|
||||
<path d="M2 3h8M3.5 6h5M5 9h2" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" />
|
||||
</svg>
|
||||
Erweiterte Suche
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="inline-flex items-center gap-2 px-4 py-2.5 text-[13px] font-semibold text-ink rounded-[2px]">
|
||||
Anmelden
|
||||
</button>
|
||||
<button class="inline-flex items-center gap-2 px-[18px] py-2.5 text-[13px] font-semibold text-white bg-brand hover:bg-brand-deep rounded-[2px] transition-colors">
|
||||
Veröffentlichen
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none">
|
||||
<path d="M3 6h6M6 3l3 3-3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- ============== MAIN NAV ============== -->
|
||||
<nav class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 flex items-stretch">
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Startseite</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Wirtschaft</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Technologie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Finanzen</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Industrie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-semibold text-ink border-b-2 border-brand -mb-px">Energie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Gesundheit</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Handel</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Immobilien</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Mobilität</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Alle Rubriken</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- ============== BREADCRUMBS ============== -->
|
||||
<div class="max-w-layout mx-auto px-8 pt-7">
|
||||
<nav class="flex gap-2 text-[11.5px] text-ink-3 mb-2 font-mono tracking-wide">
|
||||
<a href="#" class="hover:text-ink">Startseite</a>
|
||||
<span>/</span>
|
||||
<a href="#" class="hover:text-ink">Branchen</a>
|
||||
<span>/</span>
|
||||
<a href="#" class="text-brand hover:text-brand-deep">Energie & Klima</a>
|
||||
<span>/</span>
|
||||
<span>Pressemitteilung</span>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<!-- ============== HERO META BLOCK ============== -->
|
||||
<section class="max-w-layout mx-auto px-8">
|
||||
<div class="pt-[18px] pb-8 border-b border-bg-rule">
|
||||
|
||||
<!-- Embargo -->
|
||||
<div class="flex items-center gap-2.5 mb-3.5">
|
||||
<span class="text-[9.5px] font-bold tracking-[0.18em] uppercase text-brand px-2.5 py-[3px] border border-brand font-mono">
|
||||
● Embargo aufgehoben
|
||||
</span>
|
||||
<span class="text-[11px] text-ink-3 font-mono">7. Mai 2026, 14:32</span>
|
||||
</div>
|
||||
|
||||
<!-- Rubrik + Audience -->
|
||||
<div class="flex items-center gap-3.5 mb-4">
|
||||
<a href="#" class="bp-cat hover:text-brand-deep">Energie & Klima</a>
|
||||
<span class="w-1 h-1 rounded-full bg-ink-4"></span>
|
||||
<span class="text-[11px] text-ink-3 italic font-serif">Für Wirtschaftsjournalisten</span>
|
||||
</div>
|
||||
|
||||
<!-- Headline -->
|
||||
<h1 class="font-serif text-[48px] font-semibold m-0 mb-[22px] tracking-[-0.8px] leading-[1.1] max-w-[980px]" style="text-wrap:balance;">
|
||||
Energiewende 2030: BMWK kündigt 12-Milliarden-Programm zur Industrie-Dekarbonisierung an
|
||||
</h1>
|
||||
|
||||
<!-- Lead -->
|
||||
<p class="font-serif text-[21px] leading-[1.45] m-0 mb-7 text-ink-2 max-w-[880px] font-normal" style="text-wrap:pretty;">
|
||||
Das neue Förderprogramm soll deutsche Industrie-Cluster bis 2030 klimaneutral aufstellen. Erste Tranche von 4,8 Mrd. Euro fließt ab dem dritten Quartal 2026 in Stahl-, Chemie- und Zementwerke. Bundesminister Habeck spricht von „strukturellem Wendepunkt" für den Industriestandort Deutschland.
|
||||
</p>
|
||||
|
||||
<!-- Meta-Zeile -->
|
||||
<div class="flex flex-wrap items-center text-[12.5px] text-ink-2" style="gap:10px 22px;">
|
||||
<span class="inline-flex items-center gap-2">
|
||||
<span class="w-7 h-7 bg-black text-white inline-flex items-center justify-center text-[13px] font-bold font-serif">B</span>
|
||||
<span class="font-semibold">Bundesministerium für Wirtschaft und Klimaschutz</span>
|
||||
</span>
|
||||
<span class="w-px h-[14px] bg-bg-rule-strong"></span>
|
||||
<span class="font-mono text-[11.5px] text-ink-3">7. Mai 2026 · 14:32 Uhr</span>
|
||||
<span class="font-mono text-[11.5px] text-ink-3">4 Min. Lesezeit · 712 Wörter</span>
|
||||
<span class="inline-flex items-center gap-1.5 font-mono text-[11.5px] text-ink-3">
|
||||
<svg width="11" height="11" viewBox="0 0 14 14" fill="none"><path d="M7 1a5 5 0 015 5c0 4-5 7-5 7s-5-3-5-7a5 5 0 015-5z" stroke="currentColor" stroke-width="1.3" fill="none" /><circle cx="7" cy="6" r="1.5" fill="currentColor" /></svg>
|
||||
Deutschland · Berlin
|
||||
</span>
|
||||
|
||||
<!-- Redaktionsempfehlung -->
|
||||
<span class="inline-flex items-center gap-1.5 px-2 py-[3px] text-[9.5px] font-bold tracking-[0.14em] uppercase text-brand bg-brand/[0.04] border border-brand/30 font-mono cursor-help"
|
||||
title="Diese Pressemitteilung wurde von der Redaktion empfohlen — basierend auf Quellenqualität, Verifizierungsstatus und redaktioneller Relevanz.">
|
||||
<svg width="10" height="10" viewBox="0 0 24 24" fill="none">
|
||||
<path d="M12 2l9 4v6c0 5-3.5 9-9 10-5.5-1-9-5-9-10V6z" stroke="currentColor" stroke-width="2" fill="none" />
|
||||
<path d="M8 12l3 3 5-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
Redaktionsempfehlung
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== HERO IMAGE ============== -->
|
||||
<section class="max-w-layout mx-auto px-8 pt-8">
|
||||
<div class="relative flex items-end p-[18px] bg-bg-dark hatch-dark" style="aspect-ratio:21/9;">
|
||||
<span class="text-[10px] font-mono tracking-wider uppercase text-white/50">
|
||||
Bild · Pressefoto BMWK (16:9)
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-[11.5px] text-ink-3 mt-2.5 italic max-w-[720px]">
|
||||
Bundesminister Habeck bei der Vorstellung des Programms im Bundestag · Foto: BMWK / Susanne Eriksson
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== BODY + SIDEBAR ============== -->
|
||||
<section class="max-w-layout mx-auto px-8 pt-10 grid" style="grid-template-columns:1fr 280px; gap:56px;">
|
||||
|
||||
<!-- ============== BODY ============== -->
|
||||
<div>
|
||||
<!-- Korrektur-Hinweis -->
|
||||
<div class="mb-6 px-4 py-3 bg-warn-bg border border-warn-border flex gap-3 items-start">
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" class="flex-shrink-0 mt-0.5 text-warn-ink">
|
||||
<path d="M12 3l10 18H2z" stroke="currentColor" stroke-width="1.6" fill="none" />
|
||||
<path d="M12 10v5M12 17.5v.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" />
|
||||
</svg>
|
||||
<div class="text-[13px] leading-[1.5] text-warn-ink-deep">
|
||||
<strong class="block mb-0.5 font-mono text-[10.5px] tracking-[0.14em] uppercase text-warn-ink">
|
||||
Korrektur · 7. Mai 2026, 16:08
|
||||
</strong>
|
||||
Die zunächst genannte Förderhöhe von 11,5 Mrd. Euro wurde nach einer Klarstellung des BMWK auf 12 Mrd. Euro berichtigt.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Article Body -->
|
||||
<div class="max-w-[680px]">
|
||||
<p class="font-serif text-[17px] leading-[1.65] m-0 mb-[18px] text-ink" style="text-wrap:pretty;">
|
||||
Berlin · Das Bundesministerium für Wirtschaft und Klimaschutz hat heute ein 12-Milliarden-Euro-Förderprogramm vorgestellt, das die Dekarbonisierung der deutschen Schwerindustrie bis 2030 entscheidend beschleunigen soll. Die Mittel stammen aus dem Klima- und Transformationsfonds (KTF) und werden in drei Tranchen über die kommenden 36 Monate ausgereicht.
|
||||
</p>
|
||||
<p class="font-serif text-[17px] leading-[1.65] m-0 mb-[18px] text-ink" style="text-wrap:pretty;">
|
||||
Im Zentrum des Programms steht die Umstellung von Stahl-, Chemie- und Zementproduktion auf grüne Verfahren. Erste 4,8 Milliarden Euro sollen ab dem dritten Quartal 2026 in konkrete Vorhaben fließen — darunter Wasserstoff-Direktreduktion bei thyssenkrupp und elektrische Lichtbogenöfen bei der Salzgitter AG.
|
||||
</p>
|
||||
|
||||
<h2 class="font-serif text-[22px] font-semibold mt-8 mb-3.5 tracking-[-0.3px] leading-[1.25]">
|
||||
Drei Förderlinien, klare Schwerpunkte
|
||||
</h2>
|
||||
<p class="font-serif text-[17px] leading-[1.65] m-0 mb-[18px] text-ink" style="text-wrap:pretty;">
|
||||
Die Mittel verteilen sich auf drei Förderlinien: Carbon Contracts for Difference (CCfD) für die energieintensive Schwerindustrie, Investitionszuschüsse für mittelständische Industriecluster, und Forschungsförderung für skalierbare Speicher- und CCS-Technologien. Anträge können ab dem 1. Juli 2026 über die Bundesförderbank KfW gestellt werden.
|
||||
</p>
|
||||
|
||||
<!-- Zitat -->
|
||||
<blockquote class="my-7 pl-6 border-l-[3px] border-brand">
|
||||
<p class="font-serif text-[21px] font-medium leading-[1.4] italic text-ink m-0 mb-3 tracking-[-0.2px]" style="text-wrap:balance;">
|
||||
„Wir reden hier nicht über Symbolpolitik. Diese 12 Milliarden sind die Brücke zwischen Klimazielen und Industriestandort. Wer jetzt nicht investiert, fährt 2030 mit veralteter Technik gegen die Wand."
|
||||
</p>
|
||||
<cite class="not-italic text-[12px] text-ink-3 font-mono tracking-wide">
|
||||
— Robert Habeck, Bundesminister für Wirtschaft und Klimaschutz
|
||||
</cite>
|
||||
</blockquote>
|
||||
|
||||
<h2 class="font-serif text-[22px] font-semibold mt-8 mb-3.5 tracking-[-0.3px] leading-[1.25]">
|
||||
Reaktionen aus Wirtschaft und Wissenschaft
|
||||
</h2>
|
||||
<p class="font-serif text-[17px] leading-[1.65] m-0 mb-[18px] text-ink" style="text-wrap:pretty;">
|
||||
Die Bundesvereinigung der Deutschen Arbeitgeberverbände (BDA) begrüßte das Programm grundsätzlich, mahnte jedoch eine schnellere Auszahlung an. „Die Industrie braucht Planungssicherheit für die Investitionsentscheidungen 2026 und 2027 — der Zeitplan muss straff bleiben", sagte BDA-Hauptgeschäftsführer Steffen Kampeter.
|
||||
</p>
|
||||
<p class="font-serif text-[17px] leading-[1.65] m-0 mb-[18px] text-ink" style="text-wrap:pretty;">
|
||||
Aus der Wissenschaft kam differenziertes Lob: Das Fraunhofer-Institut für System- und Innovationsforschung (ISI) bewertet das Volumen als angemessen, sieht aber methodische Lücken bei der Wirkungskontrolle. Eine Begleitstudie soll ab 2027 die tatsächliche CO₂-Einsparung messen.
|
||||
</p>
|
||||
|
||||
<h2 class="font-serif text-[22px] font-semibold mt-8 mb-3.5 tracking-[-0.3px] leading-[1.25]">
|
||||
Zeitplan und nächste Schritte
|
||||
</h2>
|
||||
<p class="font-serif text-[17px] leading-[1.65] m-0 mb-[18px] text-ink" style="text-wrap:pretty;">
|
||||
Die Förderrichtlinien werden in den kommenden vier Wochen final ausgearbeitet und Anfang Juni 2026 im Bundesanzeiger veröffentlicht. Ab dem 1. Juli ist die Antragsstellung über die KfW möglich. Die zweite Tranche von 4 Milliarden Euro folgt im ersten Quartal 2027, die dritte im Verlauf von 2028.
|
||||
</p>
|
||||
|
||||
<!-- Boilerplate -->
|
||||
<div class="mt-9 pt-5 border-t border-bg-rule-strong">
|
||||
<div class="eyebrow muted text-[9.5px] mb-2.5">Über das Unternehmen</div>
|
||||
<p class="text-[13px] leading-[1.6] text-ink-3 m-0 max-w-[620px]">
|
||||
Über das Bundesministerium für Wirtschaft und Klimaschutz: Das BMWK gestaltet die Wirtschafts- und Klimaschutzpolitik der Bundesregierung. Zu den Aufgaben gehören Industriepolitik, Außenhandel, Energie- und Klimapolitik, Mittelstand und Innovation. Sitz des Ministeriums ist Berlin, mit einem Dienstsitz in Bonn. Geleitet wird das Haus seit Dezember 2021 von Bundesminister Robert Habeck.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== INLINE AD ============== -->
|
||||
<div class="my-8">
|
||||
<div class="flex items-center gap-2.5 mb-2.5">
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
<span class="text-[9px] font-bold tracking-[0.22em] text-[#8A847B] uppercase font-mono">Anzeige</span>
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
</div>
|
||||
<a href="#" class="grid px-[22px] py-5 bg-bg-card-warm items-center gap-[22px]" style="grid-template-columns:120px 1fr;">
|
||||
<div class="aspect-square bg-white hatch-light flex items-center justify-center text-[9px] text-[#8A847B] font-mono">
|
||||
LOGO
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-[9.5px] font-bold tracking-[0.16em] uppercase mb-1.5" style="color:#6E6862;">SAP · Branchen-Whitepaper</div>
|
||||
<h3 class="font-serif text-[18px] leading-[1.3] m-0 mb-2 font-semibold tracking-[-0.2px]" style="color:#2A2520;">
|
||||
CO₂-Reporting nach CSRD: Was Industriebetriebe jetzt automatisieren müssen
|
||||
</h3>
|
||||
<div class="text-[12px] leading-[1.5] mb-2.5" style="color:#5A544E;">
|
||||
Whitepaper · 32 Seiten · Praxisleitfaden für Mittelstand und Konzerne
|
||||
</div>
|
||||
<span class="text-[12px] font-semibold underline" style="color:#3A332B;">Studie kostenfrei anfordern →</span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="flex items-center gap-2.5 mt-2.5">
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
<span class="text-[9px] font-bold tracking-[0.22em] text-[#8A847B] uppercase font-mono">Ende Anzeige</span>
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== PRESSEKONTAKT-BLOCK ============== -->
|
||||
<div class="mt-8 px-7 py-6 bg-white border border-bg-rule-strong">
|
||||
<div class="eyebrow mb-3 text-[10.5px]">Pressekontakt</div>
|
||||
|
||||
<div class="flex gap-1.5 items-center mb-1">
|
||||
<strong class="font-serif text-[19px] font-semibold tracking-[-0.2px]">Dr. Annika Werthmann</strong>
|
||||
<span title="Verifizierter Publisher — Identität und Domain bestätigt" class="inline-flex items-center text-verify-border flex-shrink-0">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="none">
|
||||
<path d="M12 1l2.5 3 3.8-.4-.5 3.8L21 9l-2.6 2.5L19 15l-3.8.4L12 19l-2.5-3.6L5.7 15 5.6 11.4 3 9l2.5-1.6L4.7 4 8.5 4z" fill="currentColor" />
|
||||
<path d="M7.5 12l3 3 6-6" stroke="white" stroke-width="2.2" fill="none" stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-[12.5px] text-ink-3 mb-3.5 leading-[1.5]">
|
||||
Pressesprecherin · Referat Öffentlichkeitsarbeit<br />
|
||||
Bundesministerium für Wirtschaft und Klimaschutz
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-2 text-[12.5px] font-mono">
|
||||
<span class="flex items-center gap-2">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><path d="M7 1a5 5 0 015 5c0 4-5 7-5 7s-5-3-5-7a5 5 0 015-5zm0 3.5a1.5 1.5 0 100 3 1.5 1.5 0 000-3z" fill="currentColor" /></svg>
|
||||
<span class="text-ink-2">Scharnhorststraße 34–37 · 10115 Berlin</span>
|
||||
</span>
|
||||
<span class="flex items-center gap-2">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><path d="M2 3l3-1 1.5 3-1.5 1c.5 2 2 3.5 4 4l1-1.5L13 10l-1 3c-5 0-10-5-10-10z" fill="currentColor" /></svg>
|
||||
<span class="text-ink-2">+49 30 18 615 - 6121</span>
|
||||
</span>
|
||||
<span class="flex items-center gap-2">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><path d="M1 3h12v8H1zM1 3l6 4 6-4" stroke="currentColor" stroke-width="1.2" fill="none" /></svg>
|
||||
<a href="/cdn-cgi/l/email-protection#bfcfcddaccccdaffddd2c8d491ddcad1db91dbda" class="text-ink underline underline-offset-2"><span class="__cf_email__" data-cfemail="e6969483959583a6848b918dc884938882c88283">[email protected]</span></a>
|
||||
</span>
|
||||
<span class="flex items-center gap-2">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><circle cx="7" cy="7" r="5.5" stroke="currentColor" stroke-width="1.2" fill="none" /><path d="M1.5 7h11M7 1.5c2 1.5 2 9.5 0 11M7 1.5c-2 1.5-2 9.5 0 11" stroke="currentColor" stroke-width="1" fill="none" /></svg>
|
||||
<a href="#" class="text-ink underline underline-offset-2">bmwk.bund.de</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="mt-4 pt-3.5 border-t border-bg-rule text-[10.5px] text-ink-4 leading-[1.5]">
|
||||
Sie sind als Pressekontakt für diese Mitteilung hinterlegt?
|
||||
<a href="#" class="text-ink-3 underline">Pressemitteilung verwalten →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== SIDEBAR (rechts) ============== -->
|
||||
<aside class="flex flex-col gap-7">
|
||||
|
||||
<!-- Publisher Box -->
|
||||
<div class="p-4 bg-white border border-bg-rule-strong">
|
||||
<div class="eyebrow muted text-[9.5px] mb-3">Veröffentlicht von</div>
|
||||
<div class="flex gap-3 items-start mb-3">
|
||||
<span class="w-11 h-11 bg-black text-white inline-flex items-center justify-center text-[20px] font-bold font-serif flex-shrink-0">B</span>
|
||||
<div class="min-w-0">
|
||||
<strong class="block font-serif text-[14px] font-semibold leading-[1.25] tracking-[-0.1px] mb-0.5">BMWK</strong>
|
||||
<div class="text-[11px] text-ink-3 leading-[1.4]">
|
||||
Bundesministerium für Wirtschaft und Klimaschutz
|
||||
</div>
|
||||
<div class="text-[10.5px] text-ink-4 mt-1 font-mono">Berlin</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2 px-2.5 py-2 mb-3 bg-verify-bg border border-verify-border text-verify-ink cursor-help"
|
||||
title="Identität und Domain durch businessportal24 bestätigt">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" class="text-verify-border flex-shrink-0">
|
||||
<path d="M12 1l2.5 3 3.8-.4-.5 3.8L21 9l-2.6 2.5L19 15l-3.8.4L12 19l-2.5-3.6L5.7 15 5.6 11.4 3 9l2.5-1.6L4.7 4 8.5 4z" fill="currentColor" />
|
||||
<path d="M7.5 12l3 3 6-6" stroke="white" stroke-width="2.2" fill="none" stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
<span class="text-[11.5px] font-semibold">Verifizierter Publisher</span>
|
||||
</div>
|
||||
|
||||
<div class="pt-3 border-t border-bg-rule flex flex-col gap-2">
|
||||
<button class="px-2.5 py-2 text-[11.5px] font-semibold bg-ink text-white hover:bg-black transition-colors">
|
||||
+ Newsroom folgen
|
||||
</button>
|
||||
<a href="#" class="text-[11.5px] text-ink-2 text-center py-1.5 underline underline-offset-2">
|
||||
Alle Mitteilungen →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar Share -->
|
||||
<div>
|
||||
<div class="eyebrow muted text-[9.5px] mb-2.5">Teilen</div>
|
||||
<div class="grid grid-cols-2 gap-1.5">
|
||||
<button class="inline-flex items-center gap-[7px] px-2.5 py-2 text-[11.5px] font-medium bg-white border border-bg-rule-strong text-ink hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 16 16"><path d="M3 6h2.5v8H3V6zm1.25-3a1.25 1.25 0 110 2.5 1.25 1.25 0 010-2.5zM7 6h2.4v1.1c.4-.7 1.3-1.3 2.6-1.3 2.7 0 3 1.7 3 3.9V14h-2.5v-3.7c0-.9 0-2-1.3-2s-1.5 1-1.5 2V14H7V6z" fill="currentColor" /></svg>
|
||||
LinkedIn
|
||||
</button>
|
||||
<button class="inline-flex items-center gap-[7px] px-2.5 py-2 text-[11.5px] font-medium bg-white border border-bg-rule-strong text-ink hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 16 16"><path d="M2 2l5.5 7.2L2 14h1.6l4.7-3.7L11.5 14H14L8.2 6.4 13.6 2H12L7.5 5.5 4.5 2H2z" fill="currentColor" /></svg>
|
||||
X
|
||||
</button>
|
||||
<button class="inline-flex items-center gap-[7px] px-2.5 py-2 text-[11.5px] font-medium bg-white border border-bg-rule-strong text-ink hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 16 16"><rect x="2" y="3" width="12" height="10" stroke="currentColor" stroke-width="1.3" fill="none" /><path d="M2 4l6 4 6-4" stroke="currentColor" stroke-width="1.3" fill="none" /></svg>
|
||||
E-Mail
|
||||
</button>
|
||||
<button class="inline-flex items-center gap-[7px] px-2.5 py-2 text-[11.5px] font-medium bg-white border border-bg-rule-strong text-ink hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 16 16"><path d="M6 9l4-4M5 4h2a3 3 0 010 6h-1M11 12H9a3 3 0 010-6h1" stroke="currentColor" stroke-width="1.3" fill="none" stroke-linecap="round" /></svg>
|
||||
Link kopieren
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar Tags -->
|
||||
<div>
|
||||
<div class="eyebrow muted text-[9.5px] mb-2.5">Schlagwörter</div>
|
||||
<div class="flex flex-wrap gap-[5px]">
|
||||
<a href="#" class="px-2.5 py-1 text-[11px] font-medium bg-white border border-bg-rule-strong text-ink-2 hover:text-ink">Energiewende</a>
|
||||
<a href="#" class="px-2.5 py-1 text-[11px] font-medium bg-white border border-bg-rule-strong text-ink-2 hover:text-ink">Dekarbonisierung</a>
|
||||
<a href="#" class="px-2.5 py-1 text-[11px] font-medium bg-white border border-bg-rule-strong text-ink-2 hover:text-ink">Industriepolitik</a>
|
||||
<a href="#" class="px-2.5 py-1 text-[11px] font-medium bg-white border border-bg-rule-strong text-ink-2 hover:text-ink">Wasserstoff</a>
|
||||
<a href="#" class="px-2.5 py-1 text-[11px] font-medium bg-white border border-bg-rule-strong text-ink-2 hover:text-ink">thyssenkrupp</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Newsletter Box (dark) -->
|
||||
<div class="p-4 bg-ink text-white">
|
||||
<div class="eyebrow text-[9.5px] mb-2" style="color:#FF8B6F;">Newsletter</div>
|
||||
<h4 class="font-serif text-[17px] font-semibold m-0 mb-2 leading-[1.25]">
|
||||
Energie & Klima · ab Score 80
|
||||
</h4>
|
||||
<p class="text-[11.5px] text-white/70 leading-[1.5] m-0 mb-3">
|
||||
Höchstens 2 Mails pro Woche. Nur Meldungen ab Content-Score 80.
|
||||
</p>
|
||||
<button class="w-full py-2.5 text-[12px] font-semibold bg-brand hover:bg-brand-deep text-white transition-colors">
|
||||
Abonnieren →
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar Ad -->
|
||||
<div>
|
||||
<div class="flex items-center gap-2.5 mb-2.5">
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
<span class="text-[9px] font-bold tracking-[0.22em] text-[#8A847B] uppercase font-mono">Anzeige</span>
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
</div>
|
||||
<article class="px-3.5 py-4 bg-bg-card-warm border border-bg-card-warm-border">
|
||||
<div class="text-[9px] tracking-[0.16em] uppercase mb-1.5 font-mono" style="color:#6E6862;">Cloud · Software</div>
|
||||
<h3 class="font-serif text-[15px] leading-[1.3] m-0 mb-2 font-medium" style="color:#3A332B;">
|
||||
Microsoft Azure: Neue EU-Region Frankfurt mit DSGVO-zertifizierter KI-Infrastruktur
|
||||
</h3>
|
||||
<div class="text-[11px] mt-1.5" style="color:#6E6862;">Microsoft Deutschland GmbH</div>
|
||||
</article>
|
||||
<div class="flex items-center gap-2.5 mt-2.5">
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
<span class="text-[9px] font-bold tracking-[0.22em] text-[#8A847B] uppercase font-mono">Ende Anzeige</span>
|
||||
<span class="h-px bg-bg-rule-strong flex-1"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar Secondary Actions -->
|
||||
<div>
|
||||
<div class="eyebrow muted text-[9.5px] mb-2.5">Weiterführend</div>
|
||||
<div class="flex flex-col border border-bg-rule-strong bg-white">
|
||||
<a href="#" class="flex items-center gap-2.5 px-3 py-2.5 text-[12px] text-ink-2 hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><path d="M2 1h7l3 3v9H2z" stroke="currentColor" stroke-width="1.3" fill="none" /><path d="M9 1v3h3" stroke="currentColor" stroke-width="1.3" fill="none" /></svg>
|
||||
<span class="flex-1">Permalink & Zitiervorschlag</span>
|
||||
<svg width="9" height="9" viewBox="0 0 12 12" fill="none" class="text-ink-4"><path d="M4 2l4 4-4 4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" /></svg>
|
||||
</a>
|
||||
<a href="#" class="flex items-center gap-2.5 px-3 py-2.5 text-[12px] text-ink-2 border-t border-bg-rule hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><path d="M2 4h10v8H2zM2 4V2h10v2" stroke="currentColor" stroke-width="1.3" fill="none" /></svg>
|
||||
<span class="flex-1">Drucken & PDF</span>
|
||||
<svg width="9" height="9" viewBox="0 0 12 12" fill="none" class="text-ink-4"><path d="M4 2l4 4-4 4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" /></svg>
|
||||
</a>
|
||||
<a href="#" class="flex items-center gap-2.5 px-3 py-2.5 text-[12px] text-ink-2 border-t border-bg-rule hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><path d="M3 11V3l8 4z" fill="currentColor" /></svg>
|
||||
<span class="flex-1">RSS-Feed von Bundesministerium</span>
|
||||
<svg width="9" height="9" viewBox="0 0 12 12" fill="none" class="text-ink-4"><path d="M4 2l4 4-4 4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" /></svg>
|
||||
</a>
|
||||
<a href="#" class="flex items-center gap-2.5 px-3 py-2.5 text-[12px] text-ink-2 border-t border-bg-rule hover:bg-bg-elev">
|
||||
<svg width="13" height="13" viewBox="0 0 14 14" class="text-ink-3 flex-shrink-0"><circle cx="7" cy="7" r="5.5" stroke="currentColor" stroke-width="1.3" fill="none" /><path d="M7 4v3.5M7 9.5v.5" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" /></svg>
|
||||
<span class="flex-1">Pressemitteilung melden</span>
|
||||
<svg width="9" height="9" viewBox="0 0 12 12" fill="none" class="text-ink-4"><path d="M4 2l4 4-4 4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</section>
|
||||
|
||||
<!-- ============== RECOMMENDATIONS ============== -->
|
||||
<section class="max-w-layout mx-auto px-8 mt-14">
|
||||
<div class="grid grid-cols-2 gap-10">
|
||||
|
||||
<!-- Mehr von BMWK -->
|
||||
<div>
|
||||
<h3 class="font-serif text-[20px] font-semibold m-0 mb-1 tracking-[-0.2px]">Mehr von BMWK</h3>
|
||||
<div class="text-[11.5px] text-ink-3 mb-3.5">Aktuelle Mitteilungen aus diesem Newsroom</div>
|
||||
<hr class="rule-strong mb-1" />
|
||||
|
||||
<a href="#" class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 1fr; gap:14px;">
|
||||
<span class="font-mono text-[11px] text-ink-3">5. Mai</span>
|
||||
<div>
|
||||
<span class="bp-cat text-[9px]">Wasserstoff</span>
|
||||
<h4 class="font-serif text-[15px] font-medium m-0 mt-1 leading-[1.3]">
|
||||
Wasserstoff-Importstrategie: BMWK präsentiert Partnerländer-Liste
|
||||
</h4>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 1fr; gap:14px;">
|
||||
<span class="font-mono text-[11px] text-ink-3">29. April</span>
|
||||
<div>
|
||||
<span class="bp-cat text-[9px]">Klima</span>
|
||||
<h4 class="font-serif text-[15px] font-medium m-0 mt-1 leading-[1.3]">
|
||||
EU-Emissionshandel: Deutschland fordert Verschärfung der Industrie-Quoten
|
||||
</h4>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="grid items-baseline py-3.5" style="grid-template-columns:60px 1fr; gap:14px;">
|
||||
<span class="font-mono text-[11px] text-ink-3">22. April</span>
|
||||
<div>
|
||||
<span class="bp-cat text-[9px]">Industrie</span>
|
||||
<h4 class="font-serif text-[15px] font-medium m-0 mt-1 leading-[1.3]">
|
||||
Industriestrompreis: Habeck konkretisiert Subventionsmodell für 2027
|
||||
</h4>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="block mt-3.5 text-[12.5px] font-semibold text-brand hover:text-brand-deep">
|
||||
Alle Mitteilungen von BMWK →
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Verwandte Meldungen -->
|
||||
<div>
|
||||
<h3 class="font-serif text-[20px] font-semibold m-0 mb-1 tracking-[-0.2px]">Verwandte Meldungen</h3>
|
||||
<div class="text-[11.5px] text-ink-3 mb-3.5">Reaktionen, ähnliche Themen, Branchenkontext</div>
|
||||
<hr class="rule-strong mb-1" />
|
||||
|
||||
<a href="#" class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 1fr; gap:14px;">
|
||||
<span class="font-mono text-[11px] text-ink-3">Heute</span>
|
||||
<div>
|
||||
<div class="flex items-baseline gap-2 flex-wrap">
|
||||
<span class="bp-cat text-[9px]">Stahl</span>
|
||||
<span class="text-[10.5px] text-ink-3 font-mono">thyssenkrupp AG</span>
|
||||
</div>
|
||||
<h4 class="font-serif text-[15px] font-medium m-0 mt-1 leading-[1.3]">
|
||||
thyssenkrupp begrüßt BMWK-Programm — Direktreduktions-Anlage Duisburg ab 2028
|
||||
</h4>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="grid items-baseline py-3.5 border-b border-bg-rule" style="grid-template-columns:60px 1fr; gap:14px;">
|
||||
<span class="font-mono text-[11px] text-ink-3">Heute</span>
|
||||
<div>
|
||||
<div class="flex items-baseline gap-2 flex-wrap">
|
||||
<span class="bp-cat text-[9px]">Stahl</span>
|
||||
<span class="text-[10.5px] text-ink-3 font-mono">Salzgitter AG</span>
|
||||
</div>
|
||||
<h4 class="font-serif text-[15px] font-medium m-0 mt-1 leading-[1.3]">
|
||||
SALCOS-Programm: Salzgitter erwartet Förderzusage im dritten Quartal
|
||||
</h4>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="grid items-baseline py-3.5" style="grid-template-columns:60px 1fr; gap:14px;">
|
||||
<span class="font-mono text-[11px] text-ink-3">Gestern</span>
|
||||
<div>
|
||||
<div class="flex items-baseline gap-2 flex-wrap">
|
||||
<span class="bp-cat text-[9px]">Forschung</span>
|
||||
<span class="text-[10.5px] text-ink-3 font-mono">Fraunhofer ISI</span>
|
||||
</div>
|
||||
<h4 class="font-serif text-[15px] font-medium m-0 mt-1 leading-[1.3]">
|
||||
Studie: 12 Mrd. Euro reichen für 38% der Schwerindustrie-Transformation
|
||||
</h4>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="block mt-3.5 text-[12.5px] font-semibold text-brand hover:text-brand-deep">
|
||||
Alle Meldungen aus Energie & Klima →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== FOOTER ============== -->
|
||||
<footer class="bg-bg-footer text-ink-on-dark-2 mt-16 pt-10 pb-6">
|
||||
<div class="max-w-layout mx-auto px-8">
|
||||
<div class="grid gap-8 mb-8" style="grid-template-columns:1.5fr 1fr 1fr 1fr;">
|
||||
|
||||
<div>
|
||||
<div class="font-serif text-[22px] font-semibold text-ink-on-dark">
|
||||
businessportal<span class="text-brand">24</span>
|
||||
</div>
|
||||
<p class="text-[12.5px] leading-[1.5] mt-3 max-w-[320px]">
|
||||
Pressemitteilungen aus Deutschland, Österreich und der Schweiz. Redaktionell geprüft. Strukturiert distribuiert.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="eyebrow text-ink-on-dark mb-3" style="color:#F6F4EF;">Redaktion</div>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Über uns</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Redaktionsrichtlinien</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Kontakt</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Impressum</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="eyebrow text-ink-on-dark mb-3" style="color:#F6F4EF;">Service</div>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Pressemitteilung einreichen</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">API-Dokumentation</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Newsletter</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">RSS-Feeds</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="eyebrow text-ink-on-dark mb-3" style="color:#F6F4EF;">Rechtliches</div>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Datenschutz</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">AGB</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Cookie-Einstellungen</a>
|
||||
<a href="#" class="block py-1 text-[12.5px] hover:text-ink-on-dark">Werbung</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr style="border:0;border-top:1px solid rgba(255,255,255,0.12);" />
|
||||
|
||||
<div class="flex justify-between mt-4 text-[11.5px]">
|
||||
<span>© 2026 businessportal24 GmbH</span>
|
||||
<span>DACH · DE · AT · CH</span>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</article>
|
||||
|
||||
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script></body>
|
||||
</html>
|
||||
1268
dev/frontend/tailwind_v3/Startseite Tailwind.html
Normal file
1268
dev/frontend/tailwind_v3/Startseite Tailwind.html
Normal file
File diff suppressed because it is too large
Load diff
1268
dev/frontend/tailwind_v3/Startseite presseecho Tailwind.html
Normal file
1268
dev/frontend/tailwind_v3/Startseite presseecho Tailwind.html
Normal file
File diff suppressed because it is too large
Load diff
642
dev/frontend/tailwind_v3/Veröffentlichen Tailwind.html
Normal file
642
dev/frontend/tailwind_v3/Veröffentlichen Tailwind.html
Normal file
|
|
@ -0,0 +1,642 @@
|
|||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<title>businessportal24 — Pressemitteilung veröffentlichen</title>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600;8..60,700&family=Inter+Tight:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
||||
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms"></script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
bg:"#F6F4EF","bg-elev":"#FBFAF6","bg-rule":"#E5E0D5","bg-rule-strong":"#1C1A17",
|
||||
"bg-card-warm":"#F1ECE2","bg-card-warm-border":"#D9CDB6",
|
||||
"bg-footer":"#0F1216","bg-strip":"#1A1F26",
|
||||
topbar:"#1A1F26",topbar2:"#232A33",
|
||||
ink:"#1C1A17","ink-2":"#3D3935","ink-3":"#6E6862","ink-4":"#9A958D",
|
||||
"ink-on-dark":"#F6F4EF","ink-on-dark-2":"#B8B3AA",
|
||||
brand:"#C84A1E","brand-deep":"#A23814","brand-soft":"#F4E5DD",
|
||||
live:"#E03A1A",gain:"#2E8540",loss:"#C8341E",ok:"#2E8540",
|
||||
},
|
||||
fontFamily: {
|
||||
sans:['"Inter Tight"','"Söhne"','Inter','system-ui','sans-serif'],
|
||||
serif:['"Source Serif 4"','"Source Serif Pro"','Charter','Georgia','serif'],
|
||||
mono:['"JetBrains Mono"','"SF Mono"','ui-monospace','monospace'],
|
||||
},
|
||||
maxWidth:{ layout:"1280px" },
|
||||
backgroundImage:{
|
||||
"topbar-grad":"linear-gradient(135deg,#1A1F26 0%,#232A33 100%)",
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html,body{margin:0;padding:0;} body{background:#E8E4DA;font-family:"Inter Tight",system-ui,sans-serif;}
|
||||
.eyebrow{font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:#C84A1E;}
|
||||
.eyebrow.muted{color:#6E6862;}
|
||||
.bp-cat{font-size:11px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#C84A1E;}
|
||||
.rule-strong{height:1px;background:#1C1A17;border:0;margin:0;}
|
||||
.rule{height:1px;background:#E5E0D5;border:0;margin:0;}
|
||||
@keyframes bp-pulse{0%,100%{opacity:1}50%{opacity:.3}} .pulse-dot{animation:bp-pulse 1.6s ease-in-out infinite;}
|
||||
details > summary{list-style:none;cursor:pointer;}
|
||||
details > summary::-webkit-details-marker{display:none;}
|
||||
details[open] .faq-plus::before{content:"−";}
|
||||
details:not([open]) .faq-plus::before{content:"+";}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="bg-bg text-ink font-sans antialiased">
|
||||
<div class="mx-auto bg-bg" style="width:1280px;">
|
||||
|
||||
<!-- ============== TOP UTILITY BAR ============== -->
|
||||
<div class="bg-topbar-grad text-ink-on-dark-2 border-b border-black">
|
||||
<div class="max-w-layout mx-auto px-8 flex items-stretch text-[11.5px] tracking-wide">
|
||||
<span class="flex items-center pr-4 py-2 whitespace-nowrap border-r border-[#2A2723]">Mi, 6. Mai 2026</span>
|
||||
<span class="flex items-center px-3.5 text-[9.5px] uppercase font-semibold tracking-[0.16em] text-[#6E6862] whitespace-nowrap">Ausgabe</span>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-semibold text-ink-on-dark bg-white/[0.06] border-b-2 border-brand -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🇩🇪</span><span>DE</span></button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🇦🇹</span><span>AT</span></button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🇨🇭</span><span>CH</span></button>
|
||||
<button class="flex items-center gap-1.5 px-2.5 py-2 text-[11.5px] font-medium text-ink-on-dark-2 border-b-2 border-transparent -mb-px whitespace-nowrap"><span class="text-[12px] leading-none">🌐</span><span>EN</span></button>
|
||||
<span class="flex-1"></span>
|
||||
<span class="flex items-center gap-4 py-2 whitespace-nowrap">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none" class="opacity-60"><circle cx="6" cy="6" r="5" stroke="currentColor" stroke-width="1"/><path d="M1 6h10M6 1c2 1.5 2 8.5 0 10M6 1c-2 1.5-2 8.5 0 10" stroke="currentColor" stroke-width="1" fill="none"/></svg>
|
||||
<strong class="text-ink-on-dark font-semibold">Deutsch</strong>
|
||||
</span>
|
||||
<span class="w-px h-[14px] bg-[#2A2723]"></span>
|
||||
<a href="#" class="hover:text-ink-on-dark">Newsletter</a>
|
||||
<a href="#" class="hover:text-ink-on-dark">RSS</a>
|
||||
<a href="#" class="hover:text-ink-on-dark">API</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============== HEADER ============== -->
|
||||
<header class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-[18px] grid items-center gap-6" style="grid-template-columns:auto 1fr auto auto;">
|
||||
<div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none tracking-[-0.5px]">businessportal<span class="text-brand">24</span></div>
|
||||
<div class="eyebrow muted mt-1 text-[9.5px] tracking-[0.18em]">Pressemitteilungen · DACH</div>
|
||||
</div>
|
||||
<div class="w-full max-w-[540px]">
|
||||
<div class="flex items-center gap-2.5 px-3.5 py-2.5 border border-bg-rule bg-bg-elev text-[13px] text-ink-3">
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"><circle cx="7" cy="7" r="5" stroke="currentColor" stroke-width="1.5"/><path d="M11 11l3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
<span class="flex-1">Suche — Unternehmen, ISIN, Standort, Mitteilung…</span>
|
||||
<span class="text-[10.5px] text-ink-4 border border-bg-rule px-1.5 py-0.5 font-mono">⌘K</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="px-4 py-2.5 text-[13px] font-semibold text-ink">Anmelden</button>
|
||||
<button class="inline-flex items-center gap-2 px-[18px] py-2.5 text-[13px] font-semibold text-white bg-brand hover:bg-brand-deep transition-colors">
|
||||
Veröffentlichen
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M3 6h6M6 3l3 3-3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- ============== MAIN NAV ============== -->
|
||||
<nav class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 flex items-stretch">
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Startseite</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Wirtschaft</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Technologie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Finanzen</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Industrie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Energie</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Gesundheit</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Handel</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Immobilien</a>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-medium text-ink-2 border-b-2 border-transparent hover:text-ink">Mobilität</a>
|
||||
<span class="flex-1"></span>
|
||||
<a href="#" class="px-4 py-3.5 text-[13.5px] font-semibold text-ink border-b-2 border-brand -mb-px">Pressestelle</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- ============== PUB SUBNAV ============== -->
|
||||
<div class="bg-bg border-b border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-2.5 flex items-center justify-between text-[12px] text-ink-3">
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="#" class="text-ink-3 hover:text-ink">businessportal24</a>
|
||||
<span class="text-ink-4">›</span>
|
||||
<span class="text-ink">Veröffentlichen</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-[18px]">
|
||||
<span class="inline-flex items-center gap-1.5">
|
||||
<svg width="11" height="11" viewBox="0 0 11 11"><path d="M2 5.5l2.2 2.2L9 3" stroke="#2E8540" stroke-width="1.6" fill="none" stroke-linecap="round"/></svg>
|
||||
<span>Redaktionell geprüft seit 2012</span>
|
||||
</span>
|
||||
<span class="text-ink-4">·</span>
|
||||
<a href="#" class="text-ink-2 hover:text-ink">Hilfe & Support</a>
|
||||
<a href="#" class="text-ink-2 hover:text-ink">Mediadaten</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main>
|
||||
|
||||
<!-- ============== HERO ============== -->
|
||||
<section class="bg-bg">
|
||||
<div class="max-w-layout mx-auto px-8 pt-14 pb-12 grid items-start" style="grid-template-columns:1.35fr 1fr; gap:72px;">
|
||||
<!-- LEFT — editorial copy -->
|
||||
<div>
|
||||
<div class="flex items-center gap-3 mb-7">
|
||||
<span class="w-7 h-px bg-brand"></span>
|
||||
<span class="eyebrow text-[11px]">Pressestelle · Veröffentlichen</span>
|
||||
</div>
|
||||
|
||||
<h1 class="font-serif text-[58px] font-semibold m-0 text-ink" style="line-height:1.05;letter-spacing:-1.2px;text-wrap:balance;">
|
||||
Pressemitteilung veröffentlichen.<br />
|
||||
Geprüft. Dauerhaft auffindbar.
|
||||
</h1>
|
||||
|
||||
<p class="font-serif mt-7 text-[19px] leading-[1.5] text-ink-2 max-w-[560px] font-normal">
|
||||
businessportal24 ist die Presseplattform für mittelständische Unternehmen, Selbstständige und PR-Agenturen aus Deutschland, Österreich und der Schweiz. Jede Mitteilung wird auf Qualität geprüft und bleibt dauerhaft im Archiv auffindbar.
|
||||
</p>
|
||||
|
||||
<!-- STÖRER — Hub-CTA -->
|
||||
<div class="relative mt-9 grid items-center overflow-hidden text-ink-on-dark" style="background:#1A1F26;grid-template-columns:1.4fr auto;gap:28px;padding:28px 32px 30px;">
|
||||
<span class="absolute left-0 top-0 bottom-0 w-[3px] bg-brand"></span>
|
||||
<div>
|
||||
<div class="eyebrow mb-2.5 text-[10.5px]" style="color:#FF8B6F;">Einreichen im Publisher-Bereich</div>
|
||||
<h3 class="font-serif m-0 text-[23px] font-semibold leading-[1.25] tracking-[-0.3px] text-ink-on-dark">Die Einreichung läuft über presseportale.com.</h3>
|
||||
<p class="mt-2.5 mb-0 text-[13.5px] leading-[1.55] text-ink-on-dark-2 max-w-[540px]">Dort verwalten Sie Mitteilungen, Credits und Newsroom — einmaliges Konto, beide Portale nutzbar (businessportal24 & presseecho.de).</p>
|
||||
</div>
|
||||
<div class="flex flex-col items-end gap-2.5">
|
||||
<button class="inline-flex items-center gap-2 px-[22px] py-3.5 text-[14px] font-semibold text-white bg-brand hover:bg-brand-deep">
|
||||
Zum Publisher-Bereich
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" class="ml-0.5"><path d="M4 8L8.5 3.5M8.5 3.5H5M8.5 3.5V7" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</button>
|
||||
<span class="text-[11.5px] text-ink-on-dark-2">Login per Magic-Link · ohne Vertragsbindung</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="rule mt-2 mb-0" />
|
||||
|
||||
<!-- Faktenleiste -->
|
||||
<div class="grid grid-cols-4 border-b border-bg-rule">
|
||||
<div class="py-5 pr-5 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-2 inline-flex items-center gap-1.5">Seit</div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none text-ink" style="letter-spacing:-0.4px;">2012</div>
|
||||
<div class="mt-2 text-[12px] leading-[1.4] text-ink-3">im Betrieb · über ein Jahrzehnt durchgehende Archivierung</div>
|
||||
</div>
|
||||
<div class="py-5 px-5 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-2 inline-flex items-center gap-1.5">Archiv</div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none text-ink" style="letter-spacing:-0.4px;">100.000+</div>
|
||||
<div class="mt-2 text-[12px] leading-[1.4] text-ink-3">Mitteilungen weiterhin abrufbar — auch ältere Jahrgänge</div>
|
||||
</div>
|
||||
<div class="py-5 px-5 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-2 inline-flex items-center gap-1.5">Reichweite</div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none text-ink" style="letter-spacing:-0.4px;">DACH</div>
|
||||
<div class="mt-2 text-[12px] leading-[1.4] text-ink-3">Deutschland, Österreich, Schweiz · vier Sprach-Ausgaben</div>
|
||||
</div>
|
||||
<div class="py-5 pl-5">
|
||||
<div class="eyebrow muted text-[10px] mb-2 inline-flex items-center gap-1.5">
|
||||
<span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>Heute
|
||||
</div>
|
||||
<div class="font-serif text-[28px] font-semibold leading-none text-ink" style="letter-spacing:-0.4px;">12 / 4</div>
|
||||
<div class="mt-2 text-[12px] leading-[1.4] text-ink-3">veröffentlicht / in redaktioneller Prüfung — Stand 14:42 Uhr</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- RIGHT — Beispiel-Mitteilung -->
|
||||
<aside class="sticky top-6">
|
||||
<div class="text-[11px] tracking-[0.14em] uppercase text-ink-3 font-semibold mb-2.5">So sieht eine veröffentlichte Mitteilung aus</div>
|
||||
<article class="bg-bg-elev border border-bg-rule" style="padding:22px 24px 24px;">
|
||||
<div class="flex items-center justify-between mb-3.5">
|
||||
<span class="bp-cat text-[10.5px]">Industrie · Maschinenbau</span>
|
||||
<span class="inline-flex items-center gap-1.5 text-[10.5px] text-ok font-semibold">
|
||||
<svg width="11" height="11" viewBox="0 0 11 11"><path d="M2 5.5l2.2 2.2L9 3" stroke="currentColor" stroke-width="1.7" fill="none" stroke-linecap="round"/></svg>
|
||||
Geprüft
|
||||
</span>
|
||||
</div>
|
||||
<h3 class="font-serif m-0 text-[22px] leading-[1.2] font-semibold text-ink" style="letter-spacing:-0.3px;">Mittelständische Fertiger eröffnet Werk im Westmünsterland und schafft 84 Arbeitsplätze</h3>
|
||||
<p class="font-serif mt-3.5 mb-0 text-[14px] leading-[1.55] text-ink-2">Coesfeld · Die Brinkmann Präzisionstechnik GmbH hat einen Erweiterungsbau in Betrieb genommen. Investitionsvolumen: 9,4 Mio. Euro. Geschäftsführer Michael Brinkmann nennt die regionale Anbindung als entscheidenden Faktor.</p>
|
||||
<hr class="rule" style="margin:18px 0 14px;" />
|
||||
<div class="flex flex-wrap text-[11.5px] text-ink-3" style="gap:8px 18px;">
|
||||
<span>Brinkmann Präzisionstechnik GmbH</span>
|
||||
<span class="text-ink-4">·</span>
|
||||
<span class="font-mono">14. Mai 2026, 09:30</span>
|
||||
<span class="text-ink-4">·</span>
|
||||
<span>3 Min. Lesezeit</span>
|
||||
</div>
|
||||
<div class="mt-3.5 px-3 py-2.5 bg-bg border border-bg-rule text-[11px] text-ink-3 font-mono flex items-center justify-between gap-2.5">
|
||||
<span>businessportal24.com/p/brinkmann-werk-coesfeld</span>
|
||||
<span class="text-ink-4">Permanent</span>
|
||||
</div>
|
||||
</article>
|
||||
<div class="mt-3.5 text-[11.5px] text-ink-3 leading-[1.5]">Beispiel. Jede Mitteilung erhält eine permanente URL, ein strukturiertes Datenblatt und bleibt im durchsuchbaren Archiv.</div>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== NEWSROOMS — Fließtext ============== -->
|
||||
<section class="bg-bg border-t border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-[22px] grid items-baseline" style="grid-template-columns:auto 1fr auto; gap:28px;">
|
||||
<span class="eyebrow muted text-[10.5px] flex-shrink-0">Aktive Newsrooms heute</span>
|
||||
<p class="m-0 text-[13.5px] leading-[1.6] text-ink-2">
|
||||
<span class="text-ink font-medium">Siemens AG</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">BASF SE</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">Deutsche Telekom</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">Volkswagen AG</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">Allianz SE</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">Deutsche Bank</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">RWE</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">OMV</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">Voestalpine</span><span class="text-ink-4"> · </span>
|
||||
<span class="text-ink font-medium">Roche</span>
|
||||
<span class="text-ink-3"> — und 187 weitere veröffentlichende Unternehmen im laufenden Monat.</span>
|
||||
</p>
|
||||
<a href="#" class="text-[12px] text-brand font-medium border-b border-brand pb-px flex-shrink-0">Alle Newsrooms →</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== TRUST — vier Prinzipien ============== -->
|
||||
<section class="bg-bg" style="border-top:1px solid #1C1A17;">
|
||||
<div class="max-w-layout mx-auto px-8 py-14">
|
||||
<header class="grid items-end" style="grid-template-columns:auto 1fr auto; gap:32px;">
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<span class="font-mono text-[11px] text-ink-4" style="letter-spacing:0.1em;">§ 01</span>
|
||||
<div>
|
||||
<div class="eyebrow text-[10.5px] mb-2.5">Was uns ausmacht</div>
|
||||
<h2 class="font-serif m-0 text-[36px] font-semibold leading-[1.1] text-ink max-w-[720px]" style="letter-spacing:-0.6px;text-wrap:balance;">Vier Prinzipien, die diese Plattform tragen</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</header>
|
||||
|
||||
<div class="grid grid-cols-4 mt-9" style="border-top:1px solid #1C1A17;">
|
||||
<div class="py-7 pr-6 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-3.5">Qualität</div>
|
||||
<h3 class="font-serif m-0 text-[22px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Geprüfte Mitteilungen</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.55] text-ink-2">Jede Mitteilung durchläuft eine Qualitätsprüfung, bevor sie online geht. Keine SEO-Spam-Texte, keine reinen Werbeanzeigen.</p>
|
||||
</div>
|
||||
<div class="py-7 px-6 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-3.5">Auffindbarkeit</div>
|
||||
<h3 class="font-serif m-0 text-[22px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Dauerhaft im Archiv</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.55] text-ink-2">Pressemitteilungen bleiben im Archiv – auch nach Jahren. Über 100.000 Mitteilungen aus mehr als einem Jahrzehnt sind weiterhin abrufbar.</p>
|
||||
</div>
|
||||
<div class="py-7 px-6 border-r border-bg-rule">
|
||||
<div class="eyebrow muted text-[10px] mb-3.5">Konditionen</div>
|
||||
<h3 class="font-serif m-0 text-[22px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Faire Preise, keine Bindung</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.55] text-ink-2">Transparente Preise, kein Abo-Zwang, keine Vertragsfallen. Sie zahlen, was Sie einreichen.</p>
|
||||
</div>
|
||||
<div class="py-7 pl-6">
|
||||
<div class="eyebrow muted text-[10px] mb-3.5">Umgang mit Fehlern</div>
|
||||
<h3 class="font-serif m-0 text-[22px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Korrektur statt Löschung</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.55] text-ink-2">Fehler in einer Mitteilung? Wir korrigieren statt zu löschen – damit Verweise und Verlinkungen bestehen bleiben.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== ABLAUF ============== -->
|
||||
<section id="ablauf" class="bg-bg-elev border-t border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-16">
|
||||
<header class="grid items-end" style="grid-template-columns:auto 1fr auto; gap:32px;">
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<span class="font-mono text-[11px] text-ink-4" style="letter-spacing:0.1em;">§ 02</span>
|
||||
<div>
|
||||
<div class="eyebrow text-[10.5px] mb-2.5">Ablauf</div>
|
||||
<h2 class="font-serif m-0 text-[36px] font-semibold leading-[1.1] text-ink max-w-[720px]" style="letter-spacing:-0.6px;text-wrap:balance;">So funktioniert's — drei Schritte</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div class="text-[12.5px] text-ink-3 max-w-[280px] text-right leading-[1.55]">Keine Magic-Sprache. Was hier passiert, passiert sichtbar.</div>
|
||||
</header>
|
||||
|
||||
<div class="grid grid-cols-3 mt-10" style="gap:1px;background:#E5E0D5;border-top:1px solid #1C1A17;border-bottom:1px solid #1C1A17;">
|
||||
<div class="bg-bg-elev px-7 pt-8 pb-9">
|
||||
<div class="flex items-baseline justify-between mb-[22px]">
|
||||
<span class="font-mono text-[13px] text-brand font-semibold">01</span>
|
||||
<span class="eyebrow muted text-[10px]">≈ 2 Minuten</span>
|
||||
</div>
|
||||
<h3 class="font-serif m-0 text-[24px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Konto anlegen</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.6] text-ink-2">Mit E-Mail-Adresse. Kein Passwort nötig — Login per Magic-Link. Konto und Abrechnung liegen im zentralen Publisher-Bereich.</p>
|
||||
</div>
|
||||
<div class="bg-bg-elev px-7 pt-8 pb-9">
|
||||
<div class="flex items-baseline justify-between mb-[22px]">
|
||||
<span class="font-mono text-[13px] text-brand font-semibold">02</span>
|
||||
<span class="eyebrow muted text-[10px]">üblich werktags · innerhalb 24 h</span>
|
||||
</div>
|
||||
<h3 class="font-serif m-0 text-[24px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Mitteilung einreichen</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.6] text-ink-2">Text, Bild, Ansprechpartner. Eine automatische Qualitätsprüfung läuft parallel zu einer kurzen redaktionellen Sichtung.</p>
|
||||
</div>
|
||||
<div class="bg-bg-elev px-7 pt-8 pb-9">
|
||||
<div class="flex items-baseline justify-between mb-[22px]">
|
||||
<span class="font-mono text-[13px] text-brand font-semibold">03</span>
|
||||
<span class="eyebrow muted text-[10px]">permanent · indexiert</span>
|
||||
</div>
|
||||
<h3 class="font-serif m-0 text-[24px] leading-[1.2] font-semibold" style="letter-spacing:-0.3px;">Veröffentlichung</h3>
|
||||
<p class="mt-3.5 mb-0 text-[14px] leading-[1.6] text-ink-2">Nach Freigabe online und im Archiv. Bei Bedarf jederzeit korrigierbar — die URL bleibt stabil, Verweise und Verlinkungen bestehen weiter.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="mt-4.5 mb-0 text-[12px] text-ink-3" style="margin-top:18px;">
|
||||
Die Veröffentlichung erfolgt über den zentralen Publisher-Bereich auf
|
||||
<a href="#" class="text-brand font-medium border-b border-brand">presseportale.com</a>.
|
||||
Cross-Publishing nach presseecho.de ist optional verfügbar.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== ANLÄSSE ============== -->
|
||||
<section class="bg-bg border-t border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-16">
|
||||
<header class="grid items-end" style="grid-template-columns:auto 1fr auto; gap:32px;">
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<span class="font-mono text-[11px] text-ink-4" style="letter-spacing:0.1em;">§ 03</span>
|
||||
<div>
|
||||
<div class="eyebrow text-[10.5px] mb-2.5">Für wen</div>
|
||||
<h2 class="font-serif m-0 text-[36px] font-semibold leading-[1.1] text-ink max-w-[720px]" style="letter-spacing:-0.6px;text-wrap:balance;">Typische Anlässe einer Veröffentlichung</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div class="text-[12.5px] text-ink-3 max-w-[280px] text-right leading-[1.55]">Anhaltspunkt für die Eignung. Eine Aufzählung, keine Liste der Möglichkeiten.</div>
|
||||
</header>
|
||||
|
||||
<div class="grid mt-10 items-start" style="grid-template-columns:1.05fr 1fr; gap:64px;">
|
||||
<!-- Anlässe-Liste -->
|
||||
<ol class="list-none p-0 m-0">
|
||||
<li class="grid items-start gap-4 py-[18px] border-t border-bg-rule-strong border-b border-bg-rule" style="grid-template-columns:44px 1fr;">
|
||||
<span class="font-mono text-[12px] text-ink-4 pt-1">01</span>
|
||||
<div>
|
||||
<div class="font-serif text-[18px] font-semibold leading-[1.25] text-ink" style="letter-spacing:-0.2px;">Neue Produkte oder Dienstleistungen</div>
|
||||
<div class="mt-1.5 text-[13px] text-ink-3 leading-[1.5]">Markteinführungen, Produktupdates, neue Services.</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid items-start gap-4 py-[18px] border-b border-bg-rule" style="grid-template-columns:44px 1fr;">
|
||||
<span class="font-mono text-[12px] text-ink-4 pt-1">02</span>
|
||||
<div>
|
||||
<div class="font-serif text-[18px] font-semibold leading-[1.25] text-ink" style="letter-spacing:-0.2px;">Personalien und Geschäftsleitungs-Wechsel</div>
|
||||
<div class="mt-1.5 text-[13px] text-ink-3 leading-[1.5]">Berufungen, Bestellungen, Verabschiedungen.</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid items-start gap-4 py-[18px] border-b border-bg-rule" style="grid-template-columns:44px 1fr;">
|
||||
<span class="font-mono text-[12px] text-ink-4 pt-1">03</span>
|
||||
<div>
|
||||
<div class="font-serif text-[18px] font-semibold leading-[1.25] text-ink" style="letter-spacing:-0.2px;">Auszeichnungen und Zertifizierungen</div>
|
||||
<div class="mt-1.5 text-[13px] text-ink-3 leading-[1.5]">Awards, ISO- und Branchen-Zertifikate, Audits.</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid items-start gap-4 py-[18px] border-b border-bg-rule" style="grid-template-columns:44px 1fr;">
|
||||
<span class="font-mono text-[12px] text-ink-4 pt-1">04</span>
|
||||
<div>
|
||||
<div class="font-serif text-[18px] font-semibold leading-[1.25] text-ink" style="letter-spacing:-0.2px;">Standort-Eröffnungen, Expansionen, Aufträge</div>
|
||||
<div class="mt-1.5 text-[13px] text-ink-3 leading-[1.5]">Werke, Niederlassungen, Großaufträge, Investitionen.</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid items-start gap-4 py-[18px] border-b border-bg-rule" style="grid-template-columns:44px 1fr;">
|
||||
<span class="font-mono text-[12px] text-ink-4 pt-1">05</span>
|
||||
<div>
|
||||
<div class="font-serif text-[18px] font-semibold leading-[1.25] text-ink" style="letter-spacing:-0.2px;">Veranstaltungs-Ankündigungen</div>
|
||||
<div class="mt-1.5 text-[13px] text-ink-3 leading-[1.5]">Tage der offenen Tür, Fachtage, Hauptversammlungen.</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="grid items-start gap-4 py-[18px] border-b border-bg-rule" style="grid-template-columns:44px 1fr;">
|
||||
<span class="font-mono text-[12px] text-ink-4 pt-1">06</span>
|
||||
<div>
|
||||
<div class="font-serif text-[18px] font-semibold leading-[1.25] text-ink" style="letter-spacing:-0.2px;">Studien und Marktanalysen</div>
|
||||
<div class="mt-1.5 text-[13px] text-ink-3 leading-[1.5]">Eigene Erhebungen, Trendberichte, Branchenkennzahlen.</div>
|
||||
</div>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
<!-- Abgrenzung -->
|
||||
<aside class="border border-bg-rule" style="padding:28px 30px 32px;background:#FBF6EF;border-left:3px solid #C84A1E;">
|
||||
<div class="eyebrow text-[10.5px] mb-3.5">Wichtig zur Eingrenzung</div>
|
||||
<h3 class="font-serif m-0 text-[22px] leading-[1.25] font-semibold" style="letter-spacing:-0.3px;">
|
||||
Nicht geeignet sind reine Werbeanzeigen, SEO-Linkbuilding-Texte oder Inhalte ohne nachvollziehbaren Pressewert.
|
||||
</h3>
|
||||
<p class="mt-4.5 mb-0 text-[13.5px] leading-[1.6] text-ink-2" style="margin-top:18px;">
|
||||
Die redaktionelle Sichtung soll den Charakter der Plattform sichern. Mitteilungen, die diese Schwelle nicht erreichen, werden mit einer kurzen Begründung zurückgegeben — meist mit einem konkreten Korrekturvorschlag.
|
||||
</p>
|
||||
<hr class="rule" style="margin:22px 0 16px;" />
|
||||
<div class="grid gap-2.5 text-[13px] text-ink-2">
|
||||
<div class="flex items-start gap-2.5">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="mt-[3px] flex-shrink-0"><path d="M3 7l3 3 5-6" stroke="#2E8540" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
<span class="text-ink">Mitteilungen mit klarem Anlass und Quelle</span>
|
||||
</div>
|
||||
<div class="flex items-start gap-2.5">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="mt-[3px] flex-shrink-0"><path d="M3 7l3 3 5-6" stroke="#2E8540" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
<span class="text-ink">Ansprechpartner mit Funktion und Kontakt</span>
|
||||
</div>
|
||||
<div class="flex items-start gap-2.5">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="mt-[3px] flex-shrink-0"><path d="M3.5 3.5l7 7M10.5 3.5l-7 7" stroke="#6E6862" stroke-width="1.6" stroke-linecap="round"/></svg>
|
||||
<span class="text-ink-3">Reine Verkaufs- und Rabatt-Texte</span>
|
||||
</div>
|
||||
<div class="flex items-start gap-2.5">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" class="mt-[3px] flex-shrink-0"><path d="M3.5 3.5l7 7M10.5 3.5l-7 7" stroke="#6E6862" stroke-width="1.6" stroke-linecap="round"/></svg>
|
||||
<span class="text-ink-3">Anonyme oder Quellen-lose Inhalte</span>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== PREISE ============== -->
|
||||
<section class="bg-bg-elev border-t border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-14">
|
||||
<header class="grid items-end" style="grid-template-columns:auto 1fr auto; gap:32px;">
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<span class="font-mono text-[11px] text-ink-4" style="letter-spacing:0.1em;">§ 04</span>
|
||||
<div>
|
||||
<div class="eyebrow text-[10.5px] mb-2.5">Preise</div>
|
||||
<h2 class="font-serif m-0 text-[36px] font-semibold leading-[1.1] text-ink max-w-[720px]" style="letter-spacing:-0.6px;text-wrap:balance;">Sie zahlen, was Sie einreichen.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</header>
|
||||
|
||||
<div class="grid mt-9" style="grid-template-columns:1.3fr 1fr 1fr; border-top:1px solid #1C1A17; border-bottom:1px solid #1C1A17;">
|
||||
<!-- Logik -->
|
||||
<div class="pr-8 pt-7 pb-8 border-r border-bg-rule" style="padding-right:32px;">
|
||||
<div class="eyebrow muted text-[10px] mb-3">Logik</div>
|
||||
<p class="font-serif m-0 text-[19px] leading-[1.5] text-ink" style="letter-spacing:-0.1px;">
|
||||
Sie kaufen Credits, die für Veröffentlichungen eingesetzt werden. Keine Mindestlaufzeit, keine versteckten Gebühren.
|
||||
</p>
|
||||
<ul class="list-none p-0 mt-5 text-[13px] text-ink-2 grid gap-2.5">
|
||||
<li class="flex items-start gap-2.5"><span class="w-1.5 h-px bg-brand mt-2.5 flex-shrink-0"></span><span>Credits verfallen nicht.</span></li>
|
||||
<li class="flex items-start gap-2.5"><span class="w-1.5 h-px bg-brand mt-2.5 flex-shrink-0"></span><span>Korrekturen sind kostenfrei.</span></li>
|
||||
<li class="flex items-start gap-2.5"><span class="w-1.5 h-px bg-brand mt-2.5 flex-shrink-0"></span><span>Mengenrabatte ab dem zweiten Paket.</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Anker -->
|
||||
<div class="px-8 pt-7 pb-8 border-r border-bg-rule flex flex-col justify-between">
|
||||
<div>
|
||||
<div class="eyebrow muted text-[10px] mb-3">Anker</div>
|
||||
<div class="font-serif text-[16px] leading-[1.4] text-ink-2">Eine Veröffentlichung</div>
|
||||
<div class="mt-2 flex items-baseline gap-2">
|
||||
<span class="font-serif text-[48px] font-semibold leading-none text-ink" style="letter-spacing:-1.5px;">ab 89 €</span>
|
||||
</div>
|
||||
<div class="mt-2.5 text-[12px] text-ink-3">netto · zzgl. USt. · Mengenrabatte verfügbar.</div>
|
||||
</div>
|
||||
<div class="mt-5 text-[11.5px] text-ink-3 leading-[1.5]">Beispiel-Pakete: 5er ab 79 € / Mitteilung · 25er ab 64 € / Mitteilung.</div>
|
||||
</div>
|
||||
<!-- Hub-Verweis -->
|
||||
<div class="pl-8 pt-7 pb-8 flex flex-col justify-between">
|
||||
<div>
|
||||
<div class="eyebrow muted text-[10px] mb-3">Vollständige Übersicht</div>
|
||||
<p class="m-0 text-[14px] leading-[1.6] text-ink-2">Pakete, Cross-Publishing nach presseecho.de, Agentur-Konditionen und Rechnungseinstellungen finden Sie im zentralen Publisher-Bereich.</p>
|
||||
</div>
|
||||
<a href="#" class="mt-5 inline-flex items-center gap-2 text-[13.5px] font-semibold text-brand border-b border-brand self-start pb-0.5">
|
||||
Preisübersicht im Publisher-Bereich
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M3 6h6M6 3l3 3-3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== FAQ ============== -->
|
||||
<section class="bg-bg border-t border-bg-rule">
|
||||
<div class="max-w-layout mx-auto px-8 py-16">
|
||||
<header class="grid items-end" style="grid-template-columns:auto 1fr auto; gap:32px;">
|
||||
<div class="flex flex-col gap-3.5">
|
||||
<span class="font-mono text-[11px] text-ink-4" style="letter-spacing:0.1em;">§ 05</span>
|
||||
<div>
|
||||
<div class="eyebrow text-[10.5px] mb-2.5">Häufige Fragen</div>
|
||||
<h2 class="font-serif m-0 text-[36px] font-semibold leading-[1.1] text-ink max-w-[720px]" style="letter-spacing:-0.6px;text-wrap:balance;">Kurz beantwortet</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div class="text-[12.5px] text-ink-3 max-w-[280px] text-right leading-[1.55]">Eine ausführliche Wissensdatenbank liegt im Publisher-Bereich.</div>
|
||||
</header>
|
||||
|
||||
<div class="grid mt-9 items-start" style="grid-template-columns:1fr 1.6fr; gap:64px;">
|
||||
<div class="sticky top-6 pt-2">
|
||||
<p class="font-serif m-0 text-[16px] leading-[1.55] text-ink-2">Sie finden hier keine Antwort?</p>
|
||||
<a href="#" class="mt-3.5 inline-flex items-center gap-1.5 text-[13.5px] font-medium text-brand border-b border-brand pb-0.5">Redaktion direkt anschreiben</a>
|
||||
<div class="mt-3.5 text-[12px] text-ink-3 leading-[1.55]"><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="55273031343e213c3a3b153720263c3b302626253a2721343967617b363a38">[email protected]</a><br />Mo–Fr · 09:00–17:00 Uhr (MEZ)</div>
|
||||
</div>
|
||||
|
||||
<div style="border-top:1px solid #1C1A17;">
|
||||
<details open class="border-b border-bg-rule">
|
||||
<summary class="grid items-center py-5.5 gap-4" style="grid-template-columns:44px 1fr 24px; padding:22px 0;">
|
||||
<span class="font-mono text-[12px] text-ink-4">01</span>
|
||||
<span class="font-serif text-[19px] font-semibold text-ink leading-[1.3]" style="letter-spacing:-0.2px;">Wie schnell wird meine Mitteilung veröffentlicht?</span>
|
||||
<span class="faq-plus inline-flex items-center justify-center w-[22px] h-[22px] border border-bg-rule-strong text-[14px] text-ink font-medium"></span>
|
||||
</summary>
|
||||
<div class="text-[14px] leading-[1.6] text-ink-2 max-w-[640px]" style="padding:0 0 22px 60px;">Werktags üblicherweise innerhalb von 24 Stunden nach Einreichung. Bei zeitkritischen Mitteilungen ist eine vorab-Absprache möglich.</div>
|
||||
</details>
|
||||
<details class="border-b border-bg-rule">
|
||||
<summary class="grid items-center gap-4" style="grid-template-columns:44px 1fr 24px; padding:22px 0;">
|
||||
<span class="font-mono text-[12px] text-ink-4">02</span>
|
||||
<span class="font-serif text-[19px] font-semibold text-ink leading-[1.3]" style="letter-spacing:-0.2px;">Bleibt meine Mitteilung dauerhaft online?</span>
|
||||
<span class="faq-plus inline-flex items-center justify-center w-[22px] h-[22px] border border-bg-rule-strong text-[14px] text-ink font-medium"></span>
|
||||
</summary>
|
||||
<div class="text-[14px] leading-[1.6] text-ink-2 max-w-[640px]" style="padding:0 0 22px 60px;">Ja. Mitteilungen werden nicht gelöscht. Korrekturen sind jederzeit möglich — die URL bleibt erhalten.</div>
|
||||
</details>
|
||||
<details class="border-b border-bg-rule">
|
||||
<summary class="grid items-center gap-4" style="grid-template-columns:44px 1fr 24px; padding:22px 0;">
|
||||
<span class="font-mono text-[12px] text-ink-4">03</span>
|
||||
<span class="font-serif text-[19px] font-semibold text-ink leading-[1.3]" style="letter-spacing:-0.2px;">Kann ich auch auf presseecho.de veröffentlichen?</span>
|
||||
<span class="faq-plus inline-flex items-center justify-center w-[22px] h-[22px] border border-bg-rule-strong text-[14px] text-ink font-medium"></span>
|
||||
</summary>
|
||||
<div class="text-[14px] leading-[1.6] text-ink-2 max-w-[640px]" style="padding:0 0 22px 60px;">Ja, über den zentralen Publisher-Bereich. Cross-Publishing ist optional verfügbar und wird separat abgerechnet.</div>
|
||||
</details>
|
||||
<details class="border-b border-bg-rule">
|
||||
<summary class="grid items-center gap-4" style="grid-template-columns:44px 1fr 24px; padding:22px 0;">
|
||||
<span class="font-mono text-[12px] text-ink-4">04</span>
|
||||
<span class="font-serif text-[19px] font-semibold text-ink leading-[1.3]" style="letter-spacing:-0.2px;">Brauche ich ein Abo?</span>
|
||||
<span class="faq-plus inline-flex items-center justify-center w-[22px] h-[22px] border border-bg-rule-strong text-[14px] text-ink font-medium"></span>
|
||||
</summary>
|
||||
<div class="text-[14px] leading-[1.6] text-ink-2 max-w-[640px]" style="padding:0 0 22px 60px;">Nein. Sie kaufen Credits nach Bedarf, ohne Vertragsbindung. Nicht eingesetzte Credits verfallen nicht.</div>
|
||||
</details>
|
||||
<details class="border-b border-bg-rule">
|
||||
<summary class="grid items-center gap-4" style="grid-template-columns:44px 1fr 24px; padding:22px 0;">
|
||||
<span class="font-mono text-[12px] text-ink-4">05</span>
|
||||
<span class="font-serif text-[19px] font-semibold text-ink leading-[1.3]" style="letter-spacing:-0.2px;">Was passiert bei einem Fehler in der Mitteilung?</span>
|
||||
<span class="faq-plus inline-flex items-center justify-center w-[22px] h-[22px] border border-bg-rule-strong text-[14px] text-ink font-medium"></span>
|
||||
</summary>
|
||||
<div class="text-[14px] leading-[1.6] text-ink-2 max-w-[640px]" style="padding:0 0 22px 60px;">Korrektur statt Löschung: Inhalte werden aktualisiert, die URL bleibt erhalten, Verlinkungen und Verweise bestehen weiter.</div>
|
||||
</details>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== FINAL CTA ============== -->
|
||||
<section class="bg-bg" style="border-top:1px solid #1C1A17;">
|
||||
<div class="max-w-layout mx-auto px-8 pt-14 pb-[72px]">
|
||||
<div class="relative overflow-hidden grid items-end text-ink-on-dark" style="background:#1A1F26;padding:56px 56px 60px;grid-template-columns:1.3fr 1fr;gap:56px;">
|
||||
<span class="absolute left-0 top-0 bottom-0 w-1 bg-brand"></span>
|
||||
<div>
|
||||
<div class="eyebrow mb-3.5 text-[10.5px]" style="color:#FF8B6F;">Mitteilung einreichen · Schritt eins</div>
|
||||
<h2 class="font-serif m-0 text-[48px] font-semibold leading-[1.08] text-ink-on-dark max-w-[700px]" style="letter-spacing:-0.9px;text-wrap:balance;">Bereit, Ihre Mitteilung einzureichen?</h2>
|
||||
<p class="font-serif mt-5.5 mb-0 text-[17px] leading-[1.55] text-ink-on-dark-2 max-w-[580px]" style="margin-top:22px;">
|
||||
Konto in zwei Minuten anlegen, Text und Bild einreichen, nach redaktioneller Sichtung veröffentlicht. Einmaliges Konto — beide Portale (businessportal24 & presseecho.de) nutzbar.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-col items-start gap-3.5">
|
||||
<button class="inline-flex items-center gap-2 px-7 py-4 text-[15px] font-semibold text-white bg-brand hover:bg-brand-deep">
|
||||
Zum Publisher-Bereich
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" class="ml-0.5"><path d="M4 8L8.5 3.5M8.5 3.5H5M8.5 3.5V7" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</button>
|
||||
<span class="text-[12px] text-ink-on-dark-2">Einreichung läuft über presseportale.com · Login per Magic-Link</span>
|
||||
<a href="#" class="mt-1.5 text-[13px] text-ink-on-dark border-b pb-0.5" style="border-color:rgba(255,255,255,0.35);">Oder zuerst Beispiele ansehen →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- ============== FOOTER ============== -->
|
||||
<footer class="bg-bg-footer text-ink-on-dark border-t border-black">
|
||||
<div class="max-w-layout mx-auto px-8 pt-11 pb-7">
|
||||
<div class="grid pb-7" style="grid-template-columns:1.5fr 1fr 1fr 1fr;gap:56px;border-bottom:1px solid rgba(255,255,255,0.08);">
|
||||
<div>
|
||||
<div class="font-serif text-[22px] font-semibold" style="letter-spacing:-0.4px;">businessportal<span class="text-brand">24</span></div>
|
||||
<p class="mt-3 text-[12.5px] text-ink-on-dark-2 leading-[1.6] max-w-[380px]">businessportal24 ist ein Service der Presseportale-Gruppe. Plattform für Pressemitteilungen mittelständischer Unternehmen, Selbstständiger und PR-Agenturen im deutschsprachigen Raum.</p>
|
||||
</div>
|
||||
<div>
|
||||
<div class="eyebrow mb-3.5 text-[10px]" style="color:rgba(255,255,255,0.5);">Einreichen</div>
|
||||
<ul class="list-none p-0 m-0 grid gap-2.5">
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Mitteilung einreichen</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Ablauf</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Preise</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Beispiele</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<div class="eyebrow mb-3.5 text-[10px]" style="color:rgba(255,255,255,0.5);">Plattform</div>
|
||||
<ul class="list-none p-0 m-0 grid gap-2.5">
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Startseite</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Branchen</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Newsletter</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">RSS / API</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<div class="eyebrow mb-3.5 text-[10px]" style="color:rgba(255,255,255,0.5);">Unternehmen</div>
|
||||
<ul class="list-none p-0 m-0 grid gap-2.5">
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Über uns</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Impressum</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">Datenschutz</a></li>
|
||||
<li><a href="#" class="text-[13px] text-ink-on-dark">AGB</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5.5 flex justify-between items-center flex-wrap gap-4 text-[12px] text-ink-on-dark-2" style="margin-top:22px;">
|
||||
<div>© 2026 Presseportale-Gruppe · Alle Rechte vorbehalten</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<span class="text-ink-on-dark-2">Für fachlich-spezifische Themen:</span>
|
||||
<a href="#" class="text-ink-on-dark border-b pb-px" style="border-color:rgba(255,255,255,0.3);">presseecho.de →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script></body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue