presseportale/resources/views/web/pressekonto.blade.php
Kevin Adametz d1939f6f2a Web-Frontend: Umbau Spokes/Hub, Kontakt-Widget (contact-launcher)
Startseiten/Feeds/Kategorie/Rechtsseiten ueberarbeitet, Kontakt-Modal durch
schwebendes contact-launcher-Widget ersetzt, legal-language-notice ergaenzt;
Platzhalter-SVGs + Theme-CSS angepasst.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-09 15:45:58 +00:00

946 lines
63 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@extends('web.layouts.web-master')
@php
$brand = config('domains.domains.pressekonto.brand', []);
$from = request()->query('from');
$todayDate = now()->locale('de')->isoFormat('dddd, D. MMMM YYYY');
$fmtEuro = static fn (int $cents): string => number_format($cents / 100, $cents % 100 === 0 ? 0 : 2, ',', '.');
$fmtCount = static fn (int $value): string => number_format($value, 0, ',', '.');
$minPlanMonthlyCents = $plans->min('monthly_price_cents');
@endphp
@section('title', $brand['meta_title'] ?? 'pressekonto – Publisher-Hub')
@section('meta_description',
$brand['meta_description'] ??
'Der gemeinsame Publisher-Hub für presseecho und
businessportal24.')
@section('content')
<x-web.hub.top-utility-bar :date="$todayDate" />
<x-web.hub.site-header />
<x-web.hub.brand-context-banner :from="$from" />
<main class="bg-bg text-ink">
{{-- ============== HERO ============== --}}
<section class="hero-grid">
<div
class="max-w-layout mx-auto px-8 pt-16 lg:pt-20 pb-20 lg:pb-24 grid items-start gap-10 lg:gap-12 grid-cols-1 lg:grid-cols-[1.4fr_1fr]">
<div>
<div class="section-eyebrow mb-6">Publisher-Hub</div>
<h1
class="text-[40px] sm:text-[48px] lg:text-[56px] font-bold leading-[1.05] tracking-[-1.2px] text-ink m-0">
Ein Konto.<br />
Zwei Reichweiten.<br />
<x-web.brand-mark brand="presseecho" /> und <x-web.brand-mark brand="businessportal24" />.
</h1>
<p class="text-[16px] lg:text-[17px] leading-[1.55] text-ink-2 mt-7 m-0 max-w-[560px]">
<x-web.brand-mark brand="pressekonto" :serif="false" /> ist der gemeinsame Publisher-Bereich für
unsere beiden Pressefachportale. Pressemitteilungen schreiben, automatisiert prüfen lassen, auf
beiden Reichweiten veröffentlichen — und Mitteilungen, Newsrooms und Abrechnung an einem Ort
verwalten.
</p>
<div class="mt-8 flex flex-wrap items-center gap-3">
@auth
<a href="{{ \App\Support\LoginRedirect::homeFor(auth()->user()) }}"
class="inline-flex items-center gap-2.5 px-7 py-3.5 text-[15px] font-semibold text-white bg-hub hover:bg-hub-2 rounded-[6px] transition-colors cursor-pointer">
Zum pressekonto
<svg width="13" height="13" viewBox="0 0 16 16" fill="none">
<path d="M3 13L13 3M13 3H6M13 3v7" stroke="currentColor" stroke-width="1.6"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
@else
<a href="{{ route('register') }}"
class="inline-flex items-center gap-2.5 px-7 py-3.5 text-[15px] font-semibold text-white bg-hub hover:bg-hub-2 rounded-[6px] transition-colors cursor-pointer">
Konto erstellen
<svg width="13" height="13" viewBox="0 0 16 16" fill="none">
<path d="M3 13L13 3M13 3H6M13 3v7" stroke="currentColor" stroke-width="1.6"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
<a href="{{ route('login') }}"
class="inline-flex items-center gap-2 px-6 py-3.5 text-[15px] font-semibold text-hub border border-hub/25 hover:border-hub/60 rounded-[6px] transition-colors cursor-pointer">
Anmelden
</a>
@endauth
</div>
<div class="mt-9 flex flex-wrap items-center gap-x-7 gap-y-3 text-[12.5px] text-ink-3">
<span class="flex items-center gap-2">
<svg width="14" height="14" viewBox="0 0 16 16" fill="none" class="text-hub">
<path d="M8 1.5l5.5 2.5v4c0 3.3-2.2 5.8-5.5 6.5C4.7 13.8 2.5 11.3 2.5 8V4z"
stroke="currentColor" stroke-width="1.3" fill="none" />
<path d="M5.5 8l2 2 3.5-4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
Prüfung inklusive
</span>
<span class="flex items-center gap-2">
<svg width="14" height="14" viewBox="0 0 16 16" fill="none" class="text-hub">
<rect x="2" y="3" width="12" height="10" stroke="currentColor" stroke-width="1.3" />
<path d="M2 6h12" stroke="currentColor" stroke-width="1.3" />
</svg>
Transparente Tarife
</span>
<span class="flex items-center gap-2">
<svg width="14" height="14" viewBox="0 0 16 16" fill="none" class="text-hub">
<circle cx="8" cy="8" r="6" stroke="currentColor" stroke-width="1.3" />
<path d="M8 4v4l2.5 1.5" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" />
</svg>
Monats- oder Jahrestarife
</span>
</div>
</div>
{{-- Architektur-Diagramm --}}
<div class="relative">
<div class="relative bg-bg-elev border border-bg-rule rounded-[4px] p-7">
<div class="eyebrow muted mb-5">Architektur</div>
<div class="relative mx-auto" style="width:100%;height:320px;">
<svg class="absolute inset-0" width="100%" height="100%" viewBox="0 0 380 320"
preserveAspectRatio="none">
<line x1="190" y1="160" x2="80" y2="60" stroke="var(--color-hub)"
stroke-width="1" stroke-dasharray="3 3" opacity="0.45" />
<line x1="190" y1="160" x2="300" y2="60" stroke="var(--color-hub)"
stroke-width="1" stroke-dasharray="3 3" opacity="0.45" />
<line x1="190" y1="160" x2="80" y2="260" stroke="var(--color-hub)"
stroke-width="1" stroke-dasharray="3 3" opacity="0.3" />
<line x1="190" y1="160" x2="300" y2="260" stroke="var(--color-hub)"
stroke-width="1" stroke-dasharray="3 3" opacity="0.3" />
</svg>
<div class="absolute" style="top:50%;left:50%;transform:translate(-50%,-50%);">
<div
class="w-[140px] h-[140px] rounded-full bg-hub-grad flex flex-col items-center justify-center text-white shadow-lg shadow-hub/30 text-center">
<div class="text-[10px] font-bold tracking-[0.22em] uppercase text-hub-line">Hub</div>
<div class="text-[15px] font-bold tracking-[-0.3px] mt-1">
<x-web.brand-mark brand="pressekonto" variant="on-dark" :serif="false" />
</div>
</div>
</div>
<div class="absolute" style="top:10px;left:0;">
<div class="px-3.5 py-2.5 bg-white border border-bg-rule rounded-[3px] min-w-[160px]">
<div class="text-[10px] font-bold tracking-[0.18em] uppercase text-ink-3">Brand-Portal
</div>
<div class="text-[14px] font-bold text-ink mt-0.5 tracking-[-0.2px]">
<x-web.brand-mark brand="presseecho" />
</div>
<div class="text-[10.5px] text-ink-3 mt-0.5">Branchen-Presse · Archiv</div>
</div>
</div>
<div class="absolute" style="top:10px;right:0;">
<div
class="px-3.5 py-2.5 bg-white border border-bg-rule rounded-[3px] min-w-[160px] text-right">
<div class="text-[10px] font-bold tracking-[0.18em] uppercase text-ink-3">Brand-Portal
</div>
<div class="text-[14px] font-bold text-ink mt-0.5 tracking-[-0.2px]">
<x-web.brand-mark brand="businessportal24" />
</div>
<div class="text-[10.5px] text-ink-3 mt-0.5">Wirtschaft · Live</div>
</div>
</div>
<div class="absolute" style="bottom:10px;left:0;">
<div class="px-3.5 py-2 bg-bg border border-bg-rule rounded-[3px]">
<div class="text-[10px] text-ink-3 tracking-[0.14em] uppercase font-semibold">
Veröffentlichung</div>
<div class="font-mono text-[13px] font-semibold text-ink mt-0.5">2× Portale, 1× Klick
</div>
</div>
</div>
<div class="absolute" style="bottom:10px;right:0;">
<div class="px-3.5 py-2 bg-bg border border-bg-rule rounded-[3px] text-right">
<div class="text-[10px] text-ink-3 tracking-[0.14em] uppercase font-semibold">
Reichweite</div>
<div class="font-mono text-[13px] font-semibold text-ink mt-0.5">zusammengeführt</div>
</div>
</div>
</div>
<hr class="rule mt-2" />
<div class="grid grid-cols-3 gap-4 mt-4">
<div>
<div
class="font-mono text-[20px] font-semibold text-hub leading-none tracking-[-0.3px] tabular-nums">
{{ $fmtCount($hubStats['releases_total']) }}</div>
<div class="text-[10.5px] text-ink-3 mt-1 leading-tight">Mitteilungen<br />im Archiv</div>
</div>
<div>
<div
class="font-mono text-[20px] font-semibold text-hub leading-none tracking-[-0.3px] tabular-nums">
{{ $fmtCount($hubStats['newsrooms']) }}</div>
<div class="text-[10.5px] text-ink-3 mt-1 leading-tight">aktive<br />Newsrooms</div>
</div>
<div>
<div
class="font-mono text-[20px] font-semibold text-hub leading-none tracking-[-0.3px] tabular-nums">
{{ $fmtCount($hubStats['categories']) }}</div>
<div class="text-[10.5px] text-ink-3 mt-1 leading-tight">Branchen-<br />Rubriken</div>
</div>
</div>
</div>
<div
class="absolute -bottom-3 -right-3 px-3 py-1.5 bg-accent-soft border border-accent/30 text-accent-deep text-[10.5px] font-bold tracking-[0.14em] uppercase rounded-[2px]">
Live-Architektur
</div>
</div>
</div>
</section>
<hr class="rule" />
{{-- ============== WAS SIE HIER KÖNNEN ============== --}}
<section class="max-w-layout mx-auto px-8 pt-16 lg:pt-20 pb-12 lg:pb-16">
<header class="mb-10 flex flex-col lg:flex-row lg:items-baseline lg:justify-between gap-3">
<div>
<div class="section-eyebrow mb-4">Was Sie hier können</div>
<h2
class="text-[28px] lg:text-[34px] font-bold m-0 tracking-[-0.7px] text-ink leading-[1.15] max-w-[700px]">
Pressearbeit von der Mitteilung bis zur Auswertung — an einem zentralen Ort.
</h2>
</div>
<a href="#funktion"
class="text-[12.5px] font-semibold text-hub hover:underline whitespace-nowrap cursor-pointer">
So funktioniert es im Detail →
</a>
</header>
<div class="grid gap-6 grid-cols-1 md:grid-cols-2 lg:grid-cols-3">
<article class="bg-bg-card border border-bg-rule rounded-[4px] p-7 flex flex-col">
<div
class="w-11 h-11 rounded-[4px] bg-hub-soft border border-hub-soft-2 flex items-center justify-center text-hub mb-5">
<svg width="22" height="22" viewBox="0 0 24 24" fill="none">
<path d="M4 4h12l4 4v12H4z" stroke="currentColor" stroke-width="1.6"
stroke-linejoin="round" />
<path d="M16 4v4h4" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round" />
<path d="M7 11h10M7 14h10M7 17h6" stroke="currentColor" stroke-width="1.4"
stroke-linecap="round" />
</svg>
</div>
<div class="eyebrow mb-2">01 · Veröffentlichen</div>
<h3 class="text-[19px] font-semibold m-0 tracking-[-0.3px] text-ink leading-[1.25]">
Pressemitteilungen auf beiden Portalen
</h3>
<p class="text-[13.5px] leading-[1.6] text-ink-2 mt-3 m-0">
Eine Mitteilung schreiben, Inhaltsprüfung durchlaufen lassen, auf <x-web.brand-mark brand="presseecho"
:serif="false" /> und <x-web.brand-mark brand="businessportal24" :serif="false" />
gleichzeitig veröffentlichen. Vorschau und Qualitäts-Checkliste inklusive.
</p>
<ul class="mt-5 space-y-1.5 text-[12.5px] text-ink-3 list-none p-0">
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Editor mit
Qualitäts-Checkliste</li>
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Geplante
Veröffentlichung mit Wunschtermin</li>
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Bilder und
Pressekontakt je Mitteilung</li>
</ul>
</article>
<article class="bg-bg-card border border-bg-rule rounded-[4px] p-7 flex flex-col">
<div
class="w-11 h-11 rounded-[4px] bg-hub-soft border border-hub-soft-2 flex items-center justify-center text-hub mb-5">
<svg width="22" height="22" viewBox="0 0 24 24" fill="none">
<rect x="3" y="5" width="18" height="14" stroke="currentColor" stroke-width="1.6" />
<path d="M3 9h18" stroke="currentColor" stroke-width="1.6" />
<circle cx="6.5" cy="7" r="0.6" fill="currentColor" />
<circle cx="8.5" cy="7" r="0.6" fill="currentColor" />
<path d="M6 12h7M6 15h10" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" />
</svg>
</div>
<div class="eyebrow mb-2">02 · Newsrooms verwalten</div>
<h3 class="text-[19px] font-semibold m-0 tracking-[-0.3px] text-ink leading-[1.25]">
Eigene Unternehmens-Pressestelle
</h3>
<p class="text-[13.5px] leading-[1.6] text-ink-2 mt-3 m-0">
Jeder Newsroom mit Logo, Kontaktperson, Themen-Schwerpunkten und vollständiger Mitteilungs-Historie.
Mehrere Newsrooms pro Konto möglich — etwa für Agenturen mit mehreren Marken.
</p>
<ul class="mt-5 space-y-1.5 text-[12.5px] text-ink-3 list-none p-0">
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Eigene
Newsroom-Seite auf beiden Portalen</li>
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Logo und
Pressekontakte je Newsroom</li>
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Vollständige
Mitteilungs-Historie</li>
</ul>
</article>
<article class="bg-bg-card border border-bg-rule rounded-[4px] p-7 flex flex-col">
<div
class="w-11 h-11 rounded-[4px] bg-hub-soft border border-hub-soft-2 flex items-center justify-center text-hub mb-5">
<svg width="22" height="22" viewBox="0 0 24 24" fill="none">
<path d="M4 20V8M10 20v-6M16 20V4M22 20V12" stroke="currentColor" stroke-width="1.7"
stroke-linecap="round" />
<path d="M3 21h19" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" />
</svg>
</div>
<div class="eyebrow mb-2">03 · Überblick behalten</div>
<h3 class="text-[19px] font-semibold m-0 tracking-[-0.3px] text-ink leading-[1.25]">
Aufrufe, Status und Abrechnung zentral
</h3>
<p class="text-[13.5px] leading-[1.6] text-ink-2 mt-3 m-0">
Aufrufe je Mitteilung über beide Portale. Prüf-Status und Feedback direkt an der
Mitteilung, Buchungen und Rechnungen zentral im Konto.
</p>
<ul class="mt-5 space-y-1.5 text-[12.5px] text-ink-3 list-none p-0">
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Aufrufe je
Mitteilung</li>
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Prüf-Status
&amp; Feedback</li>
<li class="flex items-center gap-2"><span class="w-1 h-1 bg-hub rounded-full"></span> Buchungen
&amp; Rechnungen zentral</li>
</ul>
</article>
</div>
</section>
{{-- ============== SO FUNKTIONIERT ES — 4 STEPS ============== --}}
<section id="funktion" class="max-w-layout mx-auto px-8 pt-8 lg:pt-10 pb-16 lg:pb-20">
<header class="mb-8">
<div class="section-eyebrow mb-4">So funktioniert es</div>
<h2
class="text-[26px] lg:text-[30px] font-bold m-0 tracking-[-0.6px] text-ink leading-[1.18] max-w-[680px]">
Vier Schritte von der Registrierung bis zur veröffentlichten Mitteilung.
</h2>
</header>
<hr class="rule-strong" />
<ol class="grid gap-0 list-none p-0 m-0 grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
<li class="relative px-7 py-7 border-r border-b lg:border-b-0 border-bg-rule">
<div class="flex items-baseline gap-3 mb-3">
<span class="font-mono text-[11px] font-bold tracking-[0.18em] text-accent">01</span>
<span class="h-px flex-1 bg-bg-rule"></span>
</div>
<div class="text-[16.5px] font-semibold text-ink tracking-[-0.2px] mb-2">Registrieren</div>
<p class="text-[12.5px] text-ink-2 leading-[1.55] m-0">
Konto in unter zwei Minuten anlegen — mit E-Mail und Passwort, Anmeldung wahlweise
auch passwortlos per Magic-Link. Nach Bestätigung Ihrer E-Mail-Adresse ist das Konto
für beide Portale freigeschaltet.
</p>
</li>
<li class="relative px-7 py-7 border-r border-b lg:border-b-0 border-bg-rule">
<div class="flex items-baseline gap-3 mb-3">
<span class="font-mono text-[11px] font-bold tracking-[0.18em] text-accent">02</span>
<span class="h-px flex-1 bg-bg-rule"></span>
</div>
<div class="text-[16.5px] font-semibold text-ink tracking-[-0.2px] mb-2">Erstellen</div>
<p class="text-[12.5px] text-ink-2 leading-[1.55] m-0">
Mitteilung im Editor verfassen — mit Quellenangaben, Anhängen, Pressekontakt. Newsroom und
Themen-Tags zuweisen.
</p>
</li>
<li class="relative px-7 py-7 border-r border-bg-rule bg-accent-soft/40">
<div class="flex flex-wrap items-baseline gap-3 mb-3">
<span class="font-mono text-[11px] font-bold tracking-[0.18em] text-accent-deep">03</span>
<span
class="inline-flex items-center gap-1.5 text-[9.5px] font-bold tracking-[0.16em] uppercase text-accent-deep px-1.5 py-0.5 border border-accent/35 rounded-[2px]">
<span class="w-1 h-1 bg-accent-deep rounded-full"></span> Unsere Qualitätssicherung
</span>
<span class="h-px flex-1 bg-accent/25"></span>
</div>
<div class="text-[16.5px] font-semibold text-ink tracking-[-0.2px] mb-2">Prüfen lassen</div>
<p class="text-[12.5px] text-ink-2 leading-[1.55] m-0">
Prüfung auf Quellenqualität, Relevanz und formale Korrektheit — werktags in der
Regel am selben Tag. Feedback direkt an der Mitteilung.
</p>
</li>
<li class="relative px-7 py-7">
<div class="flex items-baseline gap-3 mb-3">
<span class="font-mono text-[11px] font-bold tracking-[0.18em] text-accent">04</span>
<span class="h-px flex-1 bg-bg-rule"></span>
</div>
<div class="text-[16.5px] font-semibold text-ink tracking-[-0.2px] mb-2">Veröffentlichen</div>
<p class="text-[12.5px] text-ink-2 leading-[1.55] m-0">
Auf <x-web.brand-mark brand="presseecho" :serif="false" /> und <x-web.brand-mark
brand="businessportal24" :serif="false" /> gleichzeitig live. Themen-Verknüpfung im Archiv
automatisch. Statistik beginnt zu laufen.
</p>
</li>
</ol>
<hr class="rule-strong" />
<div class="mt-5 px-5 py-3 bg-bg-card-warm border-l-2 border-accent text-[12.5px] text-ink-2 leading-[1.55]">
<strong class="text-ink font-semibold">Die Inhaltsprüfung</strong> ist Teil unseres
Qualitätsversprechens: Jede Mitteilung wird vor der Veröffentlichung gegen unsere
Veröffentlichungsrichtlinien geprüft — bei einer Ablehnung erhalten Sie die Begründung und können eine
Überprüfung verlangen. Das gilt für alle Tarife, auch den Starter.
</div>
</section>
{{-- ============== TARIFE ============== --}}
<section id="tarife" class="bg-hub-soft/40 border-y border-bg-rule" x-data="{ interval: 'monthly' }">
<div class="max-w-layout mx-auto px-8 pt-16 lg:pt-20 pb-16 lg:pb-20">
<header class="mb-10 lg:mb-12 grid items-end gap-6 grid-cols-1 lg:grid-cols-[1fr_auto]">
<div>
<div class="section-eyebrow mb-4">Tarife</div>
<h2
class="text-[28px] lg:text-[34px] font-bold m-0 tracking-[-0.7px] text-ink leading-[1.15] max-w-[760px]">
Ein Konto, beide Portale. Keine versteckten Aufschläge für Reichweite.
</h2>
<p class="text-[14.5px] text-ink-2 leading-[1.55] m-0 mt-4 max-w-[640px]">
Alle Tarife enthalten die Inhaltsprüfung, Ihren eigenen Newsroom und die
Veröffentlichung auf <strong class="text-ink font-semibold"><x-web.brand-mark
brand="presseecho" :serif="false" /></strong> und <strong
class="text-ink font-semibold"><x-web.brand-mark brand="businessportal24"
:serif="false" /></strong> ohne Mehrkosten. Unser Angebot richtet sich
ausschließlich an Unternehmen, Selbstständige und Agenturen — die Veröffentlichung
erfolgt stets über Ihr Firmenprofil.
</p>
</div>
<div class="flex items-center gap-1 p-1 bg-white border border-bg-rule rounded-[4px] w-fit">
<button type="button" @click="interval = 'monthly'"
:class="interval === 'monthly' ? 'text-white bg-hub' : 'text-ink-3'"
class="px-4 py-2 text-[12.5px] font-semibold rounded-[3px] cursor-pointer transition-colors">Monatlich</button>
<button type="button" @click="interval = 'yearly'"
:class="interval === 'yearly' ? 'text-white bg-hub' : 'text-ink-3'"
class="px-4 py-2 text-[12.5px] font-semibold rounded-[3px] cursor-pointer transition-colors">Jährlich
· 2 Monate gratis</button>
</div>
</header>
<div class="grid gap-5 grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
@foreach ($plans as $plan)
@php($isPopular = $plan->slug === 'business')
<article
class="relative bg-white rounded-[4px] p-7 flex flex-col {{ $isPopular ? 'border-2 border-hub pt-12 shadow-lg shadow-hub/10' : 'border border-bg-rule' }}">
@if ($isPopular)
<div class="ribbon-recommend">Empfohlen</div>
@endif
<div class="eyebrow {{ $isPopular ? '' : 'muted' }} mb-3">{{ $plan->name }}</div>
<div class="mt-4">
<div class="flex items-baseline gap-1.5" x-show="interval === 'monthly'">
<span
class="text-[38px] font-bold {{ $isPopular ? 'text-hub' : 'text-ink' }} tracking-[-1.2px] leading-none">{{ $fmtEuro((int) $plan->monthly_price_cents) }}&nbsp;€</span>
<span class="text-[12.5px] text-ink-3">/ Monat</span>
</div>
<div class="flex items-baseline gap-1.5" x-show="interval === 'yearly'" x-cloak>
<span
class="text-[38px] font-bold {{ $isPopular ? 'text-hub' : 'text-ink' }} tracking-[-1.2px] leading-none">{{ $fmtEuro((int) $plan->yearly_price_cents) }}&nbsp;€</span>
<span class="text-[12.5px] text-ink-3">/ Jahr</span>
</div>
<div class="text-[11.5px] text-ink-3 mt-1.5 min-h-[16px]">netto zzgl. USt.</div>
</div>
<a href="{{ route('register') }}"
class="mt-6 inline-flex items-center justify-center gap-2 px-4 py-2.5 text-[13px] font-semibold rounded-[4px] transition-colors cursor-pointer {{ $isPopular ? 'text-white bg-hub hover:bg-hub-2' : 'text-hub border border-hub/30 hover:border-hub' }}">
Tarif wählen
</a>
<hr class="rule my-6" />
<ul class="space-y-2.5 text-[12.5px] text-ink-2 list-none p-0 m-0">
<li class="flex items-start gap-2.5">
<svg width="14" height="14" viewBox="0 0 16 16" fill="none"
class="text-hub flex-shrink-0 mt-[3px]">
<path d="M3 8.5L6.5 12 13 4" stroke="currentColor" stroke-width="1.7"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
<span><strong class="font-semibold">{{ $plan->press_release_quota }}
Mitteilungen</strong> pro Monat</span>
</li>
<li class="flex items-start gap-2.5">
<svg width="14" height="14" viewBox="0 0 16 16" fill="none"
class="text-hub flex-shrink-0 mt-[3px]">
<path d="M3 8.5L6.5 12 13 4" stroke="currentColor" stroke-width="1.7"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
<span>{{ $plan->daily_limit ? 'max. '.$plan->daily_limit.' Veröffentlichungen pro Tag' : 'Ohne Tageslimit' }}</span>
</li>
@foreach ($plan->benefitsList() as $benefit)
<li class="flex items-start gap-2.5">
<svg width="14" height="14" viewBox="0 0 16 16" fill="none"
class="text-hub flex-shrink-0 mt-[3px]">
<path d="M3 8.5L6.5 12 13 4" stroke="currentColor" stroke-width="1.7"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
<span>{{ $benefit }}</span>
</li>
@endforeach
</ul>
</article>
@endforeach
</div>
{{-- Enterprise-Streifen --}}
<article
class="mt-6 bg-hub text-ink-on-dark rounded-[4px] px-8 py-7 grid items-center gap-6 grid-cols-1 lg:grid-cols-[1fr_auto]">
<div>
<div class="eyebrow on-dark mb-2">Enterprise</div>
<div class="text-[13.5px] text-ink-on-dark-2 leading-[1.6] max-w-[720px]">
Mehr als 60 Mitteilungen pro Monat, mehrere Marken oder Sonderkonditionen?
Wir erstellen Ihnen ein Angebot auf Anfrage — Prüfung und die
Veröffentlichung auf beiden Portalen inklusive.
</div>
</div>
<button type="button" x-data @click="$dispatch('open-contact-modal')"
class="inline-flex items-center justify-center gap-2 px-5 py-3 text-[13.5px] font-semibold text-hub bg-white hover:bg-bg rounded-[4px] whitespace-nowrap transition-colors cursor-pointer">
Anfrage senden
<svg width="11" height="11" viewBox="0 0 12 12" fill="none">
<path d="M3 9L9 3M9 3H4M9 3v5" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</button>
</article>
<div
class="mt-10 grid items-center gap-5 px-6 py-5 bg-white border border-bg-rule rounded-[4px] grid-cols-1 lg:grid-cols-[auto_1fr_auto]">
<div
class="w-10 h-10 rounded-full bg-hub-soft border border-hub-soft-2 flex items-center justify-center text-hub flex-shrink-0">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none">
<circle cx="12" cy="12" r="9" stroke="currentColor" stroke-width="1.6" />
<path d="M12 8v5l3 2" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" />
</svg>
</div>
<div class="text-[13px] text-ink-2 leading-[1.55]">
<strong class="text-ink font-semibold">Monatstarife monatlich kündbar, Jahrestarife zum Ende der Laufzeit.</strong>
Preise netto zzgl. USt. Buchung und Verwaltung direkt im Publisher-Konto,
die Abrechnung läuft sicher über Stripe. Auch ohne Abo möglich: eine
Einzel-Pressemitteilung für {{ $fmtEuro($singlePmPriceCents) }}&nbsp;€ netto.
</div>
@auth
<a href="{{ \App\Support\LoginRedirect::homeFor(auth()->user()) }}"
class="text-[12.5px] font-semibold text-hub whitespace-nowrap hover:underline cursor-pointer">
Zum pressekonto →
</a>
@else
<a href="{{ route('register') }}"
class="text-[12.5px] font-semibold text-hub whitespace-nowrap hover:underline cursor-pointer">
Jetzt Konto erstellen →
</a>
@endauth
</div>
</div>
</section>
{{-- ============== PLATTFORM-FAMILIE ============== --}}
<section id="familie" class="max-w-layout mx-auto px-8 pt-16 lg:pt-20 pb-12 lg:pb-16">
<header class="mb-10">
<div class="section-eyebrow mb-4">Hinter pressekonto</div>
<h2
class="text-[26px] lg:text-[32px] font-bold m-0 tracking-[-0.6px] text-ink leading-[1.18] max-w-[820px]">
Zwei eigenständige Pressefachportale. Eine kuratierte Verlags-Familie.
</h2>
<p class="text-[14.5px] text-ink-2 leading-[1.55] m-0 mt-4 max-w-[760px]">
<x-web.brand-mark brand="pressekonto" :serif="false" /> ist nicht „irgendein Tool" — es ist die
zentrale Plattform für unsere beiden Pressefachportale. Jedes Portal hat einen
eigenen Charakter, eigene Leserschaft und eigene Themen-Schwerpunkte.
</p>
</header>
<div class="grid gap-6 grid-cols-1 lg:grid-cols-2">
{{-- presseecho --}}
<article class="bg-bg-card border border-bg-rule rounded-[4px] overflow-hidden">
<div class="px-7 pt-7 pb-6 text-white"
style="background:linear-gradient(135deg, rgb(26, 61, 46) 0%, rgb(18, 45, 34) 100%);">
<div class="text-[11px] font-bold tracking-[0.20em] uppercase mb-3" style="color:#9BD5B2;">
Brand-Portal · 01</div>
<div class="flex items-baseline gap-3 mb-2">
<span class="text-[28px] lg:text-[34px] font-bold tracking-[-0.8px] leading-none">
<x-web.brand-mark brand="presseecho" variant="on-dark" />
</span>
</div>
<div class="text-[12.5px] tracking-[0.12em] uppercase font-semibold" style="color:#9BD5B2;">
Branchen-Presse · Themen-Archiv
</div>
</div>
<div class="px-7 py-7">
<p class="text-[13.5px] leading-[1.6] text-ink-2 m-0">
Themen-Sammlung und Langzeit-Archiv für Pressemitteilungen aus DACH. Editorial-Charakter,
Themen-Tiefe, nach Branchen erschlossen — der Ort, an dem eine Mitteilung über Jahre auffindbar
bleibt.
</p>
<hr class="rule my-5" />
<div class="grid gap-4 mb-5 grid-cols-2">
<div>
<div class="font-mono text-[18px] font-semibold text-ink leading-none tabular-nums">
{{ $fmtCount($hubStats['releases_presseecho']) }}</div>
<div class="text-[11px] text-ink-3 mt-1">Mitteilungen im Archiv</div>
</div>
<div>
<div class="font-mono text-[18px] font-semibold text-ink leading-none tabular-nums">
{{ $fmtCount($hubStats['categories']) }} Branchen</div>
<div class="text-[11px] text-ink-3 mt-1">nach Branchen erschlossen</div>
</div>
</div>
<a href="{{ config('domains.domain_presseecho_url') }}"
class="inline-flex items-center gap-2 text-[13px] font-semibold hover:underline"
style="color:#1F4D3A;">
Zur Plattform: <x-web.brand-mark brand="presseecho" :serif="false"
class="font-semibold" />
<svg width="12" height="12" viewBox="0 0 12 12" fill="none">
<path d="M3 9L9 3M9 3H4M9 3v5" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
</div>
</article>
{{-- businessportal24 --}}
<article class="bg-bg-card border border-bg-rule rounded-[4px] overflow-hidden">
<div class="px-7 pt-7 pb-6 text-white"
style="background:linear-gradient(135deg, rgb(26, 31, 38) 0%, rgb(35, 42, 51) 100%);">
<div class="text-[11px] font-bold tracking-[0.20em] uppercase mb-3" style="color:#C84A1E;">
Brand-Portal · 02</div>
<div class="flex items-baseline gap-3 mb-2">
<span class="text-[28px] lg:text-[34px] font-bold tracking-[-0.8px] leading-none">
<x-web.brand-mark brand="businessportal24" variant="on-dark" />
</span>
</div>
<div class="text-[12.5px] tracking-[0.12em] uppercase font-semibold" style="color:#C84A1E;">
Wirtschaft &amp; Märkte · Live-Charakter
</div>
</div>
<div class="px-7 py-7">
<p class="text-[13.5px] leading-[1.6] text-ink-2 m-0">
Pressemitteilungen aus Wirtschaft, Märkten, Finanzen. Tageszeitlicher Rhythmus, Live-Ticker,
Branchen-fokussiert. Der Ort, an dem eine Mitteilung am Erscheinungstag die größte Sichtbarkeit
bekommt.
</p>
<hr class="rule my-5" />
<div class="grid gap-4 mb-5 grid-cols-2">
<div>
<div class="font-mono text-[18px] font-semibold text-ink leading-none tabular-nums">
{{ $fmtCount($hubStats['releases_businessportal']) }}</div>
<div class="text-[11px] text-ink-3 mt-1">Mitteilungen im Archiv</div>
</div>
<div>
<div class="font-mono text-[18px] font-semibold text-ink leading-none tabular-nums">
{{ $fmtCount($hubStats['newsrooms']) }}</div>
<div class="text-[11px] text-ink-3 mt-1">aktive Newsrooms</div>
</div>
</div>
<a href="{{ config('domains.domain_businessportal_url') }}"
class="inline-flex items-center gap-2 text-[13px] font-semibold hover:underline"
style="color:#C84A1E;">
Zur Plattform: <x-web.brand-mark brand="businessportal24" :serif="false"
class="font-semibold" />
<svg width="12" height="12" viewBox="0 0 12 12" fill="none">
<path d="M3 9L9 3M9 3H4M9 3v5" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
</div>
</article>
</div>
<div class="mt-7 px-6 py-5 bg-hub text-ink-on-dark-2 rounded-[4px] flex items-center gap-5">
<svg width="22" height="22" viewBox="0 0 24 24" fill="none"
class="text-hub-line flex-shrink-0">
<path d="M3 12c2-2 4-2 6 0M21 12c-2-2-4-2-6 0" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" />
<path d="M9 12h6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
</svg>
<div class="text-[13px] leading-[1.55]">
Pressemitteilungen, die Sie über <x-web.brand-mark brand="pressekonto" variant="on-dark"
:serif="false" /> einreichen, erscheinen auf <strong class="text-white font-semibold">beiden
Portalen</strong> — ohne Aufpreis, ohne doppelte Eingabe. Sie haben eine zentrale
Mitteilungs-Verwaltung und eine zentrale Reichweiten-Statistik.
</div>
</div>
</section>
<hr class="rule" />
{{-- ============== PLATTFORM IN ZAHLEN ============== --}}
<section class="max-w-layout mx-auto px-8 pt-12 lg:pt-16 pb-12 lg:pb-16">
<header class="mb-8 grid items-baseline gap-2 lg:gap-6 grid-cols-1 lg:grid-cols-[auto_1fr]">
<div class="section-eyebrow">Die Plattform in Zahlen</div>
<div class="text-[12px] text-ink-3 font-mono text-left lg:text-right">Stand
{{ now()->locale('de')->isoFormat('D. MMMM YYYY') }}</div>
</header>
<hr class="rule-strong mb-7" />
<div class="grid gap-10 grid-cols-1 lg:grid-cols-[2fr_1fr]">
<div>
<p class="text-[15px] lg:text-[16px] leading-[1.7] text-ink-2 m-0">
Über <x-web.brand-mark brand="pressekonto" :serif="false" /> veröffentlichen Unternehmen,
Verbände und öffentliche Einrichtungen aus Deutschland, Österreich und der Schweiz.
Jede Mitteilung durchläuft vor der Veröffentlichung unsere Inhaltsprüfung — die
Veröffentlichungen unterliegen unserem Qualitätsstandard und bleiben im Archiv
beider Portale dauerhaft auffindbar.
</p>
<p class="text-[13px] leading-[1.65] text-ink-3 m-0 mt-5">
Alle Kennzahlen stammen direkt aus der Plattform und werden laufend aktualisiert.
</p>
</div>
<aside class="bg-bg-card-warm border border-bg-rule-strong rounded-[4px] p-6">
<div class="eyebrow mb-4">Plattform im Überblick</div>
<hr class="rule mb-5" />
<dl class="space-y-4 m-0">
<div class="flex items-baseline justify-between gap-3">
<dt class="text-[12.5px] text-ink-3">Mitteilungen im Archiv</dt>
<dd class="font-mono text-[16px] font-semibold text-ink m-0 tabular-nums">{{ $fmtCount($hubStats['releases_total']) }}</dd>
</div>
<div class="flex items-baseline justify-between gap-3">
<dt class="text-[12.5px] text-ink-3">Aktive Newsrooms</dt>
<dd class="font-mono text-[16px] font-semibold text-ink m-0 tabular-nums">{{ $fmtCount($hubStats['newsrooms']) }}</dd>
</div>
<div class="flex items-baseline justify-between gap-3">
<dt class="text-[12.5px] text-ink-3">Branchen-Rubriken</dt>
<dd class="font-mono text-[16px] font-semibold text-ink m-0 tabular-nums">{{ $fmtCount($hubStats['categories']) }}</dd>
</div>
<div class="flex items-baseline justify-between gap-3">
<dt class="text-[12.5px] text-ink-3">Portale je Veröffentlichung</dt>
<dd class="font-mono text-[16px] font-semibold text-ink m-0 tabular-nums">2</dd>
</div>
</dl>
</aside>
</div>
</section>
{{-- ============== FAQ ============== --}}
<section id="faq" class="bg-bg-elev border-y border-bg-rule">
<div
class="max-w-layout mx-auto px-8 pt-12 lg:pt-16 pb-12 lg:pb-16 grid gap-10 lg:gap-12 grid-cols-1 lg:grid-cols-[1fr_2fr]">
<div>
<div class="section-eyebrow mb-4">Häufige Fragen</div>
<h2 class="text-[24px] lg:text-[28px] font-bold m-0 tracking-[-0.5px] text-ink leading-[1.2]">
Antworten zu Konto, Prüfung, Tarifen und Rechtlichem.
</h2>
<p class="text-[13px] text-ink-3 leading-[1.55] mt-4 m-0">
Sie finden hier nicht, was Sie suchen?
<button type="button" x-data @click="$dispatch('open-contact-modal')"
class="text-hub font-semibold underline underline-offset-[3px] decoration-hub/30 hover:decoration-hub cursor-pointer">Schreiben
Sie unserem Support</button> — wir antworten werktags.
</p>
</div>
<div>
<hr class="rule-strong" />
<details class="border-b border-bg-rule group" open>
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Was kostet ein
Konto?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Ein Konto selbst kostet nichts. Sie zahlen für die Pressemitteilungen, die Sie veröffentlichen —
entweder als Einzel-Pressemitteilung ohne Abo ({{ $fmtEuro($singlePmPriceCents) }}&nbsp;€ netto)
oder über einen Monats- bzw. Jahres-Tarif ab {{ $fmtEuro((int) $minPlanMonthlyCents) }}&nbsp;€ / Monat.
Die Prüfung und die Veröffentlichung auf beiden Portalen sind immer enthalten.
</div>
</details>
<details class="border-b border-bg-rule group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Wie läuft die
Prüfung?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Sobald Sie eine Mitteilung einreichen, wird sie auf formale Korrektheit, Quellenqualität,
Themenrelevanz und die Einhaltung unserer Veröffentlichungsrichtlinien geprüft — werktags
in der Regel am selben Tag. Bei einer Ablehnung erhalten Sie die Begründung direkt an der
Mitteilung und können eine Überprüfung verlangen; ein abgelehnter Beitrag verbraucht kein
Kontingent.
</div>
</details>
<details class="border-b border-bg-rule group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Auf welchen Portalen
erscheint meine Mitteilung?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Auf <strong class="text-ink font-semibold"><x-web.brand-mark brand="presseecho"
:serif="false" /></strong> und <strong
class="text-ink font-semibold"><x-web.brand-mark brand="businessportal24"
:serif="false" /></strong> — beide. Welche Sektion und welche Branchen-Rubrik die
Mitteilung erhält, wird automatisch aus Ihren Themen-Tags abgeleitet und in der Vorschau
angezeigt. Sie können bei Bedarf Hinweise hinzufügen.
</div>
</details>
<details class="border-b border-bg-rule group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Wie lange dauert die
Veröffentlichung?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Nach bestandener Inhaltsprüfung geht Ihre Mitteilung sofort live — werktags in der Regel
noch am selben Tag. Alternativ legen Sie einen Wunschtermin fest: Dann erscheint die
Mitteilung automatisch zum geplanten Zeitpunkt, geprüft und freigegeben ist sie bereits davor.
</div>
</details>
<details class="border-b border-bg-rule group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Welche Laufzeiten
haben die Tarife — und wie kündige ich?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Monatstarife verlängern sich monatlich und sind monatlich kündbar. Jahrestarife
verlängern sich um jeweils zwölf Monate und sind zum Ende der jeweiligen Laufzeit
kündbar. Kündigen können Sie direkt im Konto oder ohne
Anmeldung über <a
class="text-hub underline underline-offset-[3px] decoration-hub/30 hover:decoration-hub"
href="{{ route('kuendigung', ['edition' => 'de']) }}">unsere Kündigungsseite</a>.
Ihr Konto und Ihre Newsroom-Archive bleiben bestehen — auch nach Kündigung sind
veröffentlichte Mitteilungen weiter im Archiv auffindbar.
</div>
</details>
<details class="border-b border-bg-rule group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Wie steht es um DSGVO und
Datenverarbeitung?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Detaillierte Informationen zu Speicherdauer, Auftragsverarbeitung und Betroffenenrechten
finden Sie in unserer <a
class="text-hub underline underline-offset-[3px] decoration-hub/30 hover:decoration-hub"
href="{{ route('datenschutz', ['edition' => 'de']) }}">Datenschutzerklärung</a>. Für
Anfragen zu Ihren Daten nutzen Sie unser <button type="button" x-data
@click="$dispatch('open-contact-modal')"
class="text-hub underline underline-offset-[3px] decoration-hub/30 hover:decoration-hub cursor-pointer">Kontaktformular</button>.
</div>
</details>
<details class="border-b border-bg-rule group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Was passiert, wenn ich vom
Brand-Portal komme?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Wenn Sie über den „Publisher-Bereich"-Button auf <x-web.brand-mark brand="presseecho"
:serif="false" /> oder <x-web.brand-mark brand="businessportal24" :serif="false" />
hier ankommen, wird Ihnen oben angezeigt, woher Sie kommen — und dass Ihr Konto auf beiden
Portalen gilt. Sie können jederzeit zurück auf das ursprüngliche Portal, ohne Anmeldung zu
verlieren.
</div>
</details>
<details class="group">
<summary class="flex items-center justify-between gap-4 py-5">
<span class="text-[15.5px] font-semibold text-ink tracking-[-0.2px]">Gibt es eine API für meine
PR-Tools?</span>
<svg class="faq-chev text-ink-3 flex-shrink-0" width="14" height="14"
viewBox="0 0 16 16" fill="none">
<path d="M3 6l5 5 5-5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</summary>
<div class="pb-5 text-[13.5px] text-ink-2 leading-[1.65] max-w-[640px]">
Ja — eine Token-basierte REST-API zum Einreichen von Mitteilungen, Statusabfragen und
Bild-Upload. Die technische Dokumentation finden Sie auf unserer <a
class="text-hub underline underline-offset-[3px] decoration-hub/30 hover:decoration-hub"
href="{{ route('api', ['edition' => 'de']) }}">API-Seite</a>. Ihre API-Tokens
erstellen Sie direkt in Ihrem Konto — Voraussetzung ist eine aktive Buchung
(Tarif oder Einzel-Pressemitteilung).
</div>
</details>
</div>
</div>
</section>
{{-- ============== CTA-Wiederholung ============== --}}
<section class="max-w-layout mx-auto px-8 pt-12 lg:pt-16 pb-12 lg:pb-16">
<div
class="grid items-center gap-6 lg:gap-8 px-6 lg:px-10 py-10 lg:py-12 bg-hub-grad text-ink-on-dark rounded-[4px] relative overflow-hidden grid-cols-1 lg:grid-cols-[1fr_auto]">
<svg class="absolute inset-0 opacity-10 pointer-events-none" width="100%" height="100%"
preserveAspectRatio="none">
<defs>
<pattern id="hub-grid" x="0" y="0" width="48" height="48" patternUnits="userSpaceOnUse">
<path d="M48 0H0V48" stroke="white" stroke-width="0.5" fill="none" />
</pattern>
</defs>
<rect width="100%" height="100%" fill="url(#hub-grid)" />
</svg>
<div class="relative">
<div class="section-eyebrow on-dark mb-4">Loslegen</div>
<h2
class="text-[26px] lg:text-[34px] font-bold m-0 tracking-[-0.7px] text-white leading-[1.15] max-w-[680px]">
In zwei Minuten registriert. Veröffentlichen mit Tarif oder als Einzel-Pressemitteilung.
</h2>
<p class="text-[13.5px] lg:text-[14px] text-ink-on-dark-2 leading-[1.55] mt-4 m-0 max-w-[600px]">
Das Konto ist kostenlos. Tarife mit monatlicher oder jährlicher Laufzeit, Abrechnung sicher über Stripe.
</p>
</div>
<div class="relative flex flex-col gap-2.5">
@auth
<a href="{{ \App\Support\LoginRedirect::homeFor(auth()->user()) }}"
class="inline-flex items-center justify-center gap-2.5 px-7 py-3.5 text-[15px] font-semibold text-hub bg-white hover:bg-bg rounded-[6px] whitespace-nowrap transition-colors cursor-pointer">
Zum pressekonto
<svg width="13" height="13" viewBox="0 0 16 16" fill="none">
<path d="M3 13L13 3M13 3H6M13 3v7" stroke="currentColor" stroke-width="1.6"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
@else
<a href="{{ route('register') }}"
class="inline-flex items-center justify-center gap-2.5 px-7 py-3.5 text-[15px] font-semibold text-hub bg-white hover:bg-bg rounded-[6px] whitespace-nowrap transition-colors cursor-pointer">
Konto erstellen
<svg width="13" height="13" viewBox="0 0 16 16" fill="none">
<path d="M3 13L13 3M13 3H6M13 3v7" stroke="currentColor" stroke-width="1.6"
stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
<a href="{{ route('login') }}"
class="inline-flex items-center justify-center gap-2 px-7 py-3 text-[13px] font-medium text-white/85 hover:text-white whitespace-nowrap transition-colors cursor-pointer">
Bereits Konto? Anmelden →
</a>
@endauth
</div>
</div>
</section>
</main>
<x-web.hub.site-footer />
@endsection