183 lines
9.9 KiB
PHP
183 lines
9.9 KiB
PHP
@extends('web.layouts.web-master')
|
||
|
||
@section('title', 'Netzwerk & Ökosystem - B2in')
|
||
@section('meta_description', 'Das B2in-Netzwerk: Europäisches Einrichtungsnetzwerk, Fachhändler-Partnerschaften & Marken-Kooperationen – in Entwicklung.')
|
||
|
||
@section('content')
|
||
<div class="bg-background">
|
||
<livewire:web.components.ui.header />
|
||
|
||
<main class="variante-glass-flow">
|
||
@php
|
||
$hero = cms_theme_section('netzwerk_hero');
|
||
$teasers = cms_theme_section('netzwerk_teasers');
|
||
$cta = cms_theme_section('netzwerk_cta');
|
||
$cabinet = cms_theme_section('netzwerk_cabinet_partner');
|
||
$immobilienHint = cms_theme_section('netzwerk_immobilien_hint');
|
||
@endphp
|
||
|
||
{{-- Hero --}}
|
||
@if (!empty($hero))
|
||
<section class="section-padding flex items-center relative border-b border-border/30">
|
||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 bg-hero-container rounded-[20px] w-[95%]">
|
||
<div class="grid lg:grid-cols-2 gap-16 items-center">
|
||
<div class="space-y-8">
|
||
<div class="slide-right delay-300">
|
||
<h1 class="text-hero mb-6">
|
||
{!! $hero['title'] !!}
|
||
</h1>
|
||
<p class="text-lg text-muted-foreground max-w-md leading-relaxed">
|
||
{{ $hero['subtitle'] ?? '' }}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="relative">
|
||
<div class="relative rounded-3xl overflow-hidden shadow-elevated slide-left delay-300">
|
||
<x-web-picture
|
||
src="{{ theme_image_url($hero['image'] ?? '') }}"
|
||
alt="{{ $hero['image_alt'] ?? 'B2in Netzwerk & Ökosystem' }}"
|
||
class="w-full h-[500px] object-cover"
|
||
loading="" />
|
||
<div class="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
@endif
|
||
|
||
<livewire:web.components.sections.founder-bar />
|
||
|
||
{{-- Teaser-Kacheln --}}
|
||
@if (!empty($teasers))
|
||
<section class="section-padding">
|
||
<div class="container-padding">
|
||
<div class="text-center mb-12 slide-up delay-300">
|
||
<h2 class="text-section-title">{!! $teasers['title'] !!}</h2>
|
||
</div>
|
||
|
||
<div class="grid md:grid-cols-3 gap-8 max-w-5xl mx-auto">
|
||
@foreach ($teasers['cards'] ?? [] as $index => $card)
|
||
<div class="card-elevated rounded-2xl p-8 text-center slide-up delay-{{ 300 + $index * 100 }}">
|
||
<div class="inline-flex items-center justify-center w-16 h-16 rounded-full bg-secondary/10 text-secondary mb-6">
|
||
@svg('heroicon-o-' . ($card['icon'] ?? 'squares-2x2'), 'w-8 h-8')
|
||
</div>
|
||
<h3 class="text-lg font-semibold text-foreground mb-3">{{ $card['title'] ?? '' }}</h3>
|
||
<p class="text-sm text-muted-foreground leading-relaxed mb-6">{{ $card['description'] ?? '' }}</p>
|
||
@if (isset($card['status']))
|
||
<span class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full text-xs font-semibold bg-secondary/10 text-secondary">
|
||
<span class="w-1.5 h-1.5 rounded-full bg-secondary animate-pulse"></span>
|
||
{{ $card['status'] }}
|
||
</span>
|
||
@endif
|
||
</div>
|
||
@endforeach
|
||
</div>
|
||
</div>
|
||
</section>
|
||
@endif
|
||
<livewire:web.components.sections.image-break section="netzwerk_image_break" />
|
||
|
||
{{-- CABINET Premiumpartner --}}
|
||
@if (! empty($cabinet))
|
||
<section class="section-padding">
|
||
<div class="container-padding">
|
||
<div class="max-w-6xl mx-auto">
|
||
<div class="grid lg:grid-cols-2 gap-12 items-center">
|
||
<div class="space-y-6 slide-right delay-300">
|
||
@if (! empty($cabinet['badge'] ?? null))
|
||
<div class="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-secondary/10 text-secondary text-sm font-semibold">
|
||
<span class="w-2 h-2 rounded-full bg-secondary"></span>
|
||
{{ $cabinet['badge'] }}
|
||
</div>
|
||
@endif
|
||
@if (! empty($cabinet['title'] ?? null))
|
||
<h2 class="text-section-title">
|
||
{!! $cabinet['title'] !!}
|
||
</h2>
|
||
@endif
|
||
@if (! empty($cabinet['lead'] ?? null))
|
||
<p class="text-lg font-medium text-foreground">{{ $cabinet['lead'] }}</p>
|
||
@endif
|
||
@foreach ($cabinet['paragraphs'] ?? [] as $paragraph)
|
||
<p class="text-muted-foreground leading-relaxed">{{ $paragraph }}</p>
|
||
@endforeach
|
||
</div>
|
||
<div class="relative slide-left delay-300">
|
||
<div class="card-elevated rounded-3xl overflow-hidden p-10 flex items-center justify-center bg-white min-h-[300px]">
|
||
<img
|
||
src="{{ theme_image_url($cabinet['image'] ?? 'b2in/cabinet_logo.png') }}"
|
||
alt="{{ $cabinet['image_alt'] ?? 'CABINET' }}"
|
||
class="max-w-xs w-full object-contain"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
@endif
|
||
|
||
{{-- Immobilien-Vorteil Hinweis --}}
|
||
@if (! empty($immobilienHint))
|
||
<section class="section-padding bg-accent">
|
||
<div class="container-padding">
|
||
<div class="max-w-3xl mx-auto text-center slide-up delay-300">
|
||
<div class="inline-flex items-center justify-center w-14 h-14 rounded-full bg-secondary/10 text-secondary mb-6">
|
||
@svg('heroicon-o-building-office-2', 'w-7 h-7')
|
||
</div>
|
||
@if (! empty($immobilienHint['title'] ?? null))
|
||
<h2 class="text-section-title">{!! $immobilienHint['title'] !!}</h2>
|
||
@endif
|
||
@if (! empty($immobilienHint['description'] ?? null))
|
||
<p class="text-large text-muted-foreground mt-4 leading-relaxed">
|
||
{{ $immobilienHint['description'] }}
|
||
</p>
|
||
@endif
|
||
@if (! empty($immobilienHint['button_text'] ?? null))
|
||
<div class="mt-8">
|
||
<a href="{{ url($immobilienHint['button_link'] ?? '/immobilien') }}" class="btn-primary-accent px-8 py-4 text-lg">
|
||
{{ $immobilienHint['button_text'] }}
|
||
</a>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
</section>
|
||
@endif
|
||
|
||
{{-- CTA --}}
|
||
@if (!empty($cta))
|
||
<section class="section-padding">
|
||
<div class="container-padding">
|
||
<div class="max-w-3xl mx-auto text-center slide-up delay-300">
|
||
<h2 class="text-section-title">{!! $cta['title'] !!}</h2>
|
||
<p class="text-large text-muted-foreground mt-4 leading-relaxed">
|
||
{{ $cta['text'] ?? '' }}
|
||
</p>
|
||
@if (isset($cta['button_text']))
|
||
<div class="mt-8">
|
||
<a href="{{ $cta['button_link'] ?? '/contact' }}"
|
||
class="btn-primary-accent px-8 py-4 text-lg">
|
||
{{ $cta['button_text'] }}
|
||
</a>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
</section>
|
||
@endif
|
||
</main>
|
||
|
||
<livewire:web.components.ui.footer />
|
||
</div>
|
||
@endsection
|
||
|
||
@push('styles')
|
||
<style>
|
||
[x-cloak] {
|
||
display: none !important;
|
||
}
|
||
</style>
|
||
@endpush
|