development 31-10-2025
This commit is contained in:
parent
7cf3558ba7
commit
fa2ebd457d
47 changed files with 2980 additions and 452 deletions
28
app/Livewire/Web/Components/Sections/BenefitsSection.php
Normal file
28
app/Livewire/Web/Components/Sections/BenefitsSection.php
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
<?php
|
||||
|
||||
namespace App\Livewire\Web\Components\Sections;
|
||||
|
||||
use Livewire\Component;
|
||||
|
||||
class BenefitsSection extends Component
|
||||
{
|
||||
public $content = [];
|
||||
public $layout = 'left'; // Standard-Layout
|
||||
public $bg = 'bg-background';
|
||||
public $section = 'card_section';
|
||||
|
||||
public function mount($layout = 'left', $bg = 'bg-background', $section = 'card_section')
|
||||
{
|
||||
$this->layout = $layout;
|
||||
$this->bg = $bg;
|
||||
$this->section = $section;
|
||||
$theme = config('app.theme', 'b2in');
|
||||
$this->content = config("content.themes.{$theme}.{$this->section}", []);
|
||||
}
|
||||
|
||||
|
||||
public function render()
|
||||
{
|
||||
return view('livewire.web.components.sections.benefits-section');
|
||||
}
|
||||
}
|
||||
27
app/Livewire/Web/Components/Sections/CardSection.php
Normal file
27
app/Livewire/Web/Components/Sections/CardSection.php
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
<?php
|
||||
|
||||
namespace App\Livewire\Web\Components\Sections;
|
||||
|
||||
use Livewire\Component;
|
||||
|
||||
class CardSection extends Component
|
||||
{
|
||||
public $content = [];
|
||||
public $layout = 'left'; // Standard-Layout
|
||||
public $bg = 'bg-background';
|
||||
public $section = 'card_section';
|
||||
|
||||
public function mount($layout = 'left', $bg = 'bg-background', $section = 'card_section')
|
||||
{
|
||||
$this->layout = $layout;
|
||||
$this->bg = $bg;
|
||||
$this->section = $section;
|
||||
$theme = config('app.theme', 'b2in');
|
||||
$this->content = config("content.themes.{$theme}.{$this->section}", []);
|
||||
}
|
||||
|
||||
public function render()
|
||||
{
|
||||
return view('livewire.web.components.sections.card-section');
|
||||
}
|
||||
}
|
||||
|
|
@ -28,12 +28,14 @@ class PartnerHero extends Component
|
|||
'icon' => 'award',
|
||||
],
|
||||
];
|
||||
public $section = 'partner_hero';
|
||||
|
||||
public $content = [];
|
||||
public function mount()
|
||||
public function mount($section = 'partner_hero')
|
||||
{
|
||||
$this->section = $section;
|
||||
$theme = config('app.theme', 'b2in');
|
||||
$this->content = config("content.themes.{$theme}.partner_hero", []);
|
||||
$this->content = config("content.themes.{$theme}.{$this->section}", []);
|
||||
}
|
||||
|
||||
public function render()
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@
|
|||
"license": "MIT",
|
||||
"require": {
|
||||
"php": "^8.2",
|
||||
"blade-ui-kit/blade-heroicons": "^2.6",
|
||||
"laravel/fortify": "^1.27",
|
||||
"laravel/framework": "^12.0",
|
||||
"laravel/sanctum": "^4.1",
|
||||
|
|
|
|||
152
composer.lock
generated
152
composer.lock
generated
|
|
@ -4,7 +4,7 @@
|
|||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "1e33735aa52141dba50b9dc390f3c2a0",
|
||||
"content-hash": "10a392ebee126b2fc1bc1946158acb90",
|
||||
"packages": [
|
||||
{
|
||||
"name": "bacon/bacon-qr-code",
|
||||
|
|
@ -60,6 +60,156 @@
|
|||
},
|
||||
"time": "2024-10-01T13:55:55+00:00"
|
||||
},
|
||||
{
|
||||
"name": "blade-ui-kit/blade-heroicons",
|
||||
"version": "2.6.0",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/driesvints/blade-heroicons.git",
|
||||
"reference": "4553b2a1f6c76f0ac7f3bc0de4c0cfa06a097d19"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/driesvints/blade-heroicons/zipball/4553b2a1f6c76f0ac7f3bc0de4c0cfa06a097d19",
|
||||
"reference": "4553b2a1f6c76f0ac7f3bc0de4c0cfa06a097d19",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"blade-ui-kit/blade-icons": "^1.6",
|
||||
"illuminate/support": "^9.0|^10.0|^11.0|^12.0",
|
||||
"php": "^8.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"orchestra/testbench": "^7.0|^8.0|^9.0|^10.0",
|
||||
"phpunit/phpunit": "^9.0|^10.5|^11.0"
|
||||
},
|
||||
"type": "library",
|
||||
"extra": {
|
||||
"laravel": {
|
||||
"providers": [
|
||||
"BladeUI\\Heroicons\\BladeHeroiconsServiceProvider"
|
||||
]
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"BladeUI\\Heroicons\\": "src"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Dries Vints",
|
||||
"homepage": "https://driesvints.com"
|
||||
}
|
||||
],
|
||||
"description": "A package to easily make use of Heroicons in your Laravel Blade views.",
|
||||
"homepage": "https://github.com/blade-ui-kit/blade-heroicons",
|
||||
"keywords": [
|
||||
"Heroicons",
|
||||
"blade",
|
||||
"laravel"
|
||||
],
|
||||
"support": {
|
||||
"issues": "https://github.com/driesvints/blade-heroicons/issues",
|
||||
"source": "https://github.com/driesvints/blade-heroicons/tree/2.6.0"
|
||||
},
|
||||
"funding": [
|
||||
{
|
||||
"url": "https://github.com/sponsors/driesvints",
|
||||
"type": "github"
|
||||
},
|
||||
{
|
||||
"url": "https://www.paypal.com/paypalme/driesvints",
|
||||
"type": "paypal"
|
||||
}
|
||||
],
|
||||
"time": "2025-02-13T20:53:33+00:00"
|
||||
},
|
||||
{
|
||||
"name": "blade-ui-kit/blade-icons",
|
||||
"version": "1.8.0",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/driesvints/blade-icons.git",
|
||||
"reference": "7b743f27476acb2ed04cb518213d78abe096e814"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/driesvints/blade-icons/zipball/7b743f27476acb2ed04cb518213d78abe096e814",
|
||||
"reference": "7b743f27476acb2ed04cb518213d78abe096e814",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"illuminate/contracts": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"illuminate/filesystem": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"illuminate/support": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"illuminate/view": "^8.0|^9.0|^10.0|^11.0|^12.0",
|
||||
"php": "^7.4|^8.0",
|
||||
"symfony/console": "^5.3|^6.0|^7.0",
|
||||
"symfony/finder": "^5.3|^6.0|^7.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"mockery/mockery": "^1.5.1",
|
||||
"orchestra/testbench": "^6.0|^7.0|^8.0|^9.0|^10.0",
|
||||
"phpunit/phpunit": "^9.0|^10.5|^11.0"
|
||||
},
|
||||
"bin": [
|
||||
"bin/blade-icons-generate"
|
||||
],
|
||||
"type": "library",
|
||||
"extra": {
|
||||
"laravel": {
|
||||
"providers": [
|
||||
"BladeUI\\Icons\\BladeIconsServiceProvider"
|
||||
]
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
"files": [
|
||||
"src/helpers.php"
|
||||
],
|
||||
"psr-4": {
|
||||
"BladeUI\\Icons\\": "src"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Dries Vints",
|
||||
"homepage": "https://driesvints.com"
|
||||
}
|
||||
],
|
||||
"description": "A package to easily make use of icons in your Laravel Blade views.",
|
||||
"homepage": "https://github.com/blade-ui-kit/blade-icons",
|
||||
"keywords": [
|
||||
"blade",
|
||||
"icons",
|
||||
"laravel",
|
||||
"svg"
|
||||
],
|
||||
"support": {
|
||||
"issues": "https://github.com/blade-ui-kit/blade-icons/issues",
|
||||
"source": "https://github.com/blade-ui-kit/blade-icons"
|
||||
},
|
||||
"funding": [
|
||||
{
|
||||
"url": "https://github.com/sponsors/driesvints",
|
||||
"type": "github"
|
||||
},
|
||||
{
|
||||
"url": "https://www.paypal.com/paypalme/driesvints",
|
||||
"type": "paypal"
|
||||
}
|
||||
],
|
||||
"time": "2025-02-13T20:35:06+00:00"
|
||||
},
|
||||
{
|
||||
"name": "brick/math",
|
||||
"version": "0.14.0",
|
||||
|
|
|
|||
183
config/blade-icons.php
Normal file
183
config/blade-icons.php
Normal file
|
|
@ -0,0 +1,183 @@
|
|||
<?php
|
||||
|
||||
return [
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Icons Sets
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| With this config option you can define a couple of
|
||||
| default icon sets. Provide a key name for your icon
|
||||
| set and a combination from the options below.
|
||||
|
|
||||
*/
|
||||
|
||||
'sets' => [
|
||||
|
||||
// 'default' => [
|
||||
//
|
||||
// /*
|
||||
// |-----------------------------------------------------------------
|
||||
// | Icons Path
|
||||
// |-----------------------------------------------------------------
|
||||
// |
|
||||
// | Provide the relative path from your app root to your SVG icons
|
||||
// | directory. Icons are loaded recursively so there's no need to
|
||||
// | list every sub-directory.
|
||||
// |
|
||||
// | Relative to the disk root when the disk option is set.
|
||||
// |
|
||||
// */
|
||||
//
|
||||
// 'path' => 'resources/svg',
|
||||
//
|
||||
// /*
|
||||
// |-----------------------------------------------------------------
|
||||
// | Filesystem Disk
|
||||
// |-----------------------------------------------------------------
|
||||
// |
|
||||
// | Optionally, provide a specific filesystem disk to read
|
||||
// | icons from. When defining a disk, the "path" option
|
||||
// | starts relatively from the disk root.
|
||||
// |
|
||||
// */
|
||||
//
|
||||
// 'disk' => '',
|
||||
//
|
||||
// /*
|
||||
// |-----------------------------------------------------------------
|
||||
// | Default Prefix
|
||||
// |-----------------------------------------------------------------
|
||||
// |
|
||||
// | This config option allows you to define a default prefix for
|
||||
// | your icons. The dash separator will be applied automatically
|
||||
// | to every icon name. It's required and needs to be unique.
|
||||
// |
|
||||
// */
|
||||
//
|
||||
// 'prefix' => 'icon',
|
||||
//
|
||||
// /*
|
||||
// |-----------------------------------------------------------------
|
||||
// | Fallback Icon
|
||||
// |-----------------------------------------------------------------
|
||||
// |
|
||||
// | This config option allows you to define a fallback
|
||||
// | icon when an icon in this set cannot be found.
|
||||
// |
|
||||
// */
|
||||
//
|
||||
// 'fallback' => '',
|
||||
//
|
||||
// /*
|
||||
// |-----------------------------------------------------------------
|
||||
// | Default Set Classes
|
||||
// |-----------------------------------------------------------------
|
||||
// |
|
||||
// | This config option allows you to define some classes which
|
||||
// | will be applied by default to all icons within this set.
|
||||
// |
|
||||
// */
|
||||
//
|
||||
// 'class' => '',
|
||||
//
|
||||
// /*
|
||||
// |-----------------------------------------------------------------
|
||||
// | Default Set Attributes
|
||||
// |-----------------------------------------------------------------
|
||||
// |
|
||||
// | This config option allows you to define some attributes which
|
||||
// | will be applied by default to all icons within this set.
|
||||
// |
|
||||
// */
|
||||
//
|
||||
// 'attributes' => [
|
||||
// // 'width' => 50,
|
||||
// // 'height' => 50,
|
||||
// ],
|
||||
//
|
||||
// ],
|
||||
|
||||
],
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Global Default Classes
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define some classes which
|
||||
| will be applied by default to all icons.
|
||||
|
|
||||
*/
|
||||
|
||||
'class' => '',
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Global Default Attributes
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define some attributes which
|
||||
| will be applied by default to all icons.
|
||||
|
|
||||
*/
|
||||
|
||||
'attributes' => [
|
||||
// 'width' => 50,
|
||||
// 'height' => 50,
|
||||
],
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Global Fallback Icon
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define a global fallback
|
||||
| icon when an icon in any set cannot be found. It can
|
||||
| reference any icon from any configured set.
|
||||
|
|
||||
*/
|
||||
|
||||
'fallback' => '',
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Components
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| These config options allow you to define some
|
||||
| settings related to Blade Components.
|
||||
|
|
||||
*/
|
||||
|
||||
'components' => [
|
||||
|
||||
/*
|
||||
|----------------------------------------------------------------------
|
||||
| Disable Components
|
||||
|----------------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to disable Blade components
|
||||
| completely. It's useful to avoid performance problems
|
||||
| when working with large icon libraries.
|
||||
|
|
||||
*/
|
||||
|
||||
'disabled' => false,
|
||||
|
||||
/*
|
||||
|----------------------------------------------------------------------
|
||||
| Default Icon Component Name
|
||||
|----------------------------------------------------------------------
|
||||
|
|
||||
| This config option allows you to define the name
|
||||
| for the default Icon class component.
|
||||
|
|
||||
*/
|
||||
|
||||
'default' => 'icon',
|
||||
|
||||
],
|
||||
|
||||
];
|
||||
|
|
@ -1,5 +1,7 @@
|
|||
<?php
|
||||
|
||||
use function PHPSTORM_META\map;
|
||||
|
||||
return [
|
||||
'themes' => [
|
||||
'b2in' => [
|
||||
|
|
@ -14,111 +16,124 @@ return [
|
|||
['label' => 'Contact', 'url' => '/contact'],
|
||||
]
|
||||
],
|
||||
'brand_worlds' => [
|
||||
'title' => 'Unsere Markenwelten',
|
||||
'subtitle' => 'Entdecken Sie die Welten von B2In – drei Bereiche, ein Ökosystem.',
|
||||
'worlds' => [
|
||||
[
|
||||
'image' => 'b2in/b2a.jpg',
|
||||
'title' => 'B2A',
|
||||
'description' => 'Business to administration, alles rund um die Immobilie.',
|
||||
'link' => '/b2a',
|
||||
],
|
||||
[
|
||||
'image' => 'b2in/stileigentum.jpg',
|
||||
'title' => 'Stileigentum',
|
||||
'description' => 'Exklusive Immobilien und anspruchsvolles Design.',
|
||||
'link' => '/stileigentum',
|
||||
],
|
||||
[
|
||||
'image' => 'b2in/style2own.jpg',
|
||||
'title' => 'Style2own',
|
||||
'description' => 'Exklusives Interior Design für Ihre Immobilie.',
|
||||
'link' => '/style2own',
|
||||
],
|
||||
],
|
||||
],
|
||||
'hero' => [
|
||||
'title' => 'Connecting Design<br> and <span class="text-secondary">Property</span>',
|
||||
'subtitle' => '<strong>B2In (Brigdes 2 International)</strong> ist das globale Ökosystem für Immobilieninvestoren, Makler und Designliebhaber.',
|
||||
'title' => 'Lokaler Handel trifft auf <span class="text-secondary">europäisches Design</span>',
|
||||
'subtitle' => '<strong>B2in (Brigdes 2 international)</strong> ist die zentrale B2B-Plattform, die kuratierte Möbel-Hersteller, lokale Fachexperten und kaufkräftige Kunden <strong>zum gegenseitigen Erfolg</strong> verbindet.',
|
||||
'image' => 'b2in/hero-room.jpg',
|
||||
'image_alt' => 'Modern international skyline showcasing architectural design',
|
||||
'cta1_text' => 'Ecosystem entdecken',
|
||||
'cta1_link' => '/ecosystem',
|
||||
'cta2_text' => 'Partner werden',
|
||||
'cta2_link' => '/partner',
|
||||
'cta1_text' => 'Für lokale Händler',
|
||||
'cta1_link' => '/services',
|
||||
'cta2_text' => 'Für Hersteller & Marken',
|
||||
'cta2_link' => '/beratung',
|
||||
'stats' => [
|
||||
'1.7K Nutzer',
|
||||
'500+ Projekte',
|
||||
'24/7 Platform'
|
||||
'Exklusive Auswahl',
|
||||
'Persönlicher Service',
|
||||
'Werte die bleiben'
|
||||
],
|
||||
'card_title' => 'B2In Ecosystem',
|
||||
'card_text' => 'Global<span class="text-sm text-muted-foreground"> vernetzt</span>'
|
||||
'card_title' => '',
|
||||
'card_text' => 'Connecting Design and <span class="text-secondary">Property</span>'
|
||||
],
|
||||
|
||||
|
||||
'ecosystem_core' => [
|
||||
'title' => 'Ein Ökosystem, drei Stärken',
|
||||
'subtitle' => 'Wir schaffen Synergien, die den Markt revolutionieren.',
|
||||
'pillars' => [
|
||||
[
|
||||
'icon' => 'globe-alt',
|
||||
'title' => 'Globaler Immobilienhandel',
|
||||
'description' => 'Direkter Zugang zu exklusiven Investments und internationalen Märkten mit professioneller Begleitung.',
|
||||
'icon' => 'cube-transparent',
|
||||
'title' => 'Kuratierter Marktplatz',
|
||||
'description' => 'Präsentieren Sie Ihre Möbel auf einer exklusiven Plattform, die gezielt designaffine Endkunden und Immobilienprofis anspricht – <strong>regional und überregional</strong>.',
|
||||
],
|
||||
[
|
||||
'icon' => 'building-office',
|
||||
'title' => 'Kuratierte Wohnkonzepte',
|
||||
'description' => 'Wertsteigerung durch professionelles Staging und durchdachte Design-Konzepte für Ihre Immobilien.',
|
||||
'icon' => 'truck',
|
||||
'title' => 'Intelligente Logistik & Service',
|
||||
'description' => 'Profitieren Sie von unserer <strong>Bündel-Logistik für Hersteller</strong> oder unserer direkten Anbindung an <strong>lokale Montageteams für Händler</strong>.',
|
||||
],
|
||||
[
|
||||
'icon' => 'user-group',
|
||||
'title' => 'Starkes Partnernetzwerk',
|
||||
'description' => 'Ein B2B-Arm für Lieferanten, Makler & den US-Export mit fairen Konditionen und digitalem Support.',
|
||||
'title' => ' Ein starkes Verkaufsnetzwerk',
|
||||
'description' => 'Werden Sie Teil eines Ökosystems aus Maklern, Händlern und Marken, das <strong>kontinuierlich neue, qualifizierte Verkaufschancen</strong> für Ihr Sortiment generiert.',
|
||||
],
|
||||
]
|
||||
],
|
||||
'vision_section' => [
|
||||
'title' => 'Gebaut auf Vertrauen',
|
||||
'paragraphs' => [
|
||||
'Unsere Basis ist Vertrauen, angetrieben von Technologie und Innovation. B2In ist nicht nur eine Holding, sondern ein aktiver Gestalter der Immobilienzukunft.',
|
||||
'Wir vereinfachen komplexe Prozesse durch eine zentrale digitale Plattform – das B2In-Portal – und schaffen dabei Transparenz, Qualität und Innovation in jedem Schritt unserer Zusammenarbeit.',
|
||||
'Unser Engagement für Exzellenz zeigt sich in der Art, wie wir Markenwerte leben und Partnerschaften aufbauen, die nachhaltigen Erfolg für alle Beteiligten schaffen.'
|
||||
'<strong>Unsere Mission ist es, eine Brücke zu bauen:</strong> Wir geben dem lokalen Fachexperten die digitalen Werkzeuge an die Hand, um seine Stärke auszuspielen.',
|
||||
'Gleichzeitig bieten wir visionären Herstellern einen kuratierten, direkten Zugang zu regionalen Märkten.',
|
||||
'Wir glauben an die Kraft der Synergie, nicht an den Wettbewerb zwischen Online und Offline.'
|
||||
],
|
||||
'image' => 'b2in/marcel-scheibe.jpg',
|
||||
'image_alt' => 'Professionelles Team in kollaborativem Meeting',
|
||||
'image_caption' => 'Marcel Scheibe, Gründer & CEO'
|
||||
],
|
||||
|
||||
'brand_worlds' => [
|
||||
'title' => '<span class="text-secondary">Unsere Markenwelten:</span><br> Qualifizierte Kunden für Ihr Möbel-Sortiment',
|
||||
'subtitle' => 'Unsere Endkunden-Plattformen style2own und stileigentum schaffen einen konstanten Strom an Kauf- und Mietabsichten. Diese qualifizierten Leads leiten wir in unser Ökosystem, direkt zu den passenden Möbel-Angeboten – Ihren.',
|
||||
'worlds' => [
|
||||
[
|
||||
'image' => 'b2in/b2a.jpg',
|
||||
'title' => 'B2A',
|
||||
'description' => 'Unsere Logistik-Power für den US-Markt. Wir ermöglichen Herstellern den Zugang zum transatlantischen Handel.',
|
||||
'link' => '/b2a',
|
||||
'logo' => 'img/logos/b2a-logo-positiv.svg',
|
||||
'logo_width' => 'w-18',
|
||||
],
|
||||
[
|
||||
'image' => 'b2in/stileigentum.jpg',
|
||||
'title' => 'Stileigentum',
|
||||
'description' => 'Der Magnet für das Premium-Segment. Diese Marke zieht kaufkräftige Kunden an, die exklusive und hochwertige Möbel suchen – Ihre.',
|
||||
'link' => '/stileigentum',
|
||||
'logo' => 'img/logos/stileigentum-logo-positiv.svg',
|
||||
'logo_width' => 'w-35',
|
||||
],
|
||||
[
|
||||
'image' => 'b2in/style2own.jpg',
|
||||
'title' => 'Style2own',
|
||||
'description' => 'Der Motor für den breiten Markt. Diese Marke begeistert lifestyle-orientierte Kunden und schafft durch flexible Mietmodelle eine hohe Nachfrage.',
|
||||
'link' => '/style2own',
|
||||
'logo' => 'img/logos/style2own-logo-positiv.svg',
|
||||
'logo_width' => 'w-28',
|
||||
],
|
||||
],
|
||||
],
|
||||
'integriertes_modell_b2in' => [
|
||||
'title' => '<span class="text-secondary">Das Beste aus zwei Welten:</span><br>in jeder Region',
|
||||
'paragraphs' => [
|
||||
'Unser einzigartiges Modell schafft einen Marktplatz, den es so vorher nicht gab. Der Kunde wählt seine Region und erhält eine integrierte Ansicht: Zuerst die Angebote der lokalen Fachexperten, ergänzt durch das exklusive Sortiment unserer europäischen Hersteller.',
|
||||
'Das Ergebnis ist <strong>maximale Auswahl für den Kunden</strong> und <strong>maximaler Erfolg für unsere Partner</strong>.',
|
||||
],
|
||||
'image' => 'b2in/integriertes-model.jpg',
|
||||
'image_alt' => 'Integriertes Modell',
|
||||
'image_caption' => 'Integriertes Modell'
|
||||
],
|
||||
'cta_section' => [
|
||||
'title' => 'Gestalten Sie die Zukunft <span class="text-primary">mit uns</span>',
|
||||
'subtitle' => 'Werden Sie Teil der Zukunft des Wohnens und Investierens. Entdecken Sie die Möglichkeiten unseres globalen Ökosystems.',
|
||||
'button_text' => 'Kontakt aufnehmen',
|
||||
'title' => ' Werden <span class="text-primary">Sie Partner</span><br>im führenden Möbel-Netzwerk',
|
||||
'subtitle' => 'Starten Sie jetzt und erschließen Sie neue Vertriebskanäle – ob als lokaler Händler oder als visionäre Herstellermarke.',
|
||||
'button_text' => 'Jetzt Partner werden',
|
||||
'button_link' => '/contact'
|
||||
],
|
||||
'faq' => [
|
||||
'title' => 'Häufig gestellte Fragen',
|
||||
'subtitle' => 'Hier finden Sie Antworten auf die häufigsten Fragen zu unserem B2In Ökosystem.',
|
||||
'subtitle' => 'Hier finden Sie Antworten auf die häufigsten Fragen zu unserem B2in Ökosystem.',
|
||||
'questions' => [
|
||||
[
|
||||
'question' => 'Was ist B2In und welche Services bieten Sie an?',
|
||||
'answer' => 'B2In (Bridges 2 International) ist ein globales Ökosystem für Immobilieninvestoren, Makler und Designliebhaber. Wir bieten drei Hauptbereiche: B2A für Business-to-Administration, Stileigentum für exklusive Immobilien und Style2Own für modernes Interior Design.'
|
||||
'question' => 'Was ist B2in und welche Services bieten Sie an?',
|
||||
'answer' => 'B2in (Bridges 2 International) ist ein globales Ökosystem für Immobilieninvestoren, Makler und Designliebhaber. Wir bieten drei Hauptbereiche: B2A für Business-to-Administration, Stileigentum für exklusive Immobilien und Style2Own für modernes Interior Design.'
|
||||
],
|
||||
[
|
||||
'question' => 'Wie kann ich Partner bei B2In werden?',
|
||||
'question' => 'Wie kann ich Partner bei B2in werden?',
|
||||
'answer' => 'Partner können Sie über unser Partnerportal werden. Wir bieten verschiedene Partnerschaftsmodelle für Makler, Lieferanten und andere Branchenexperten. Kontaktieren Sie uns für eine persönliche Beratung über die Vorteile einer strategischen Partnerschaft.'
|
||||
],
|
||||
[
|
||||
'question' => 'Welche Vorteile bietet das B2In Ökosystem?',
|
||||
'question' => 'Welche Vorteile bietet das B2in Ökosystem?',
|
||||
'answer' => 'Unser Ökosystem bietet direkten Zugang zu exklusiven Investments, professionelle Begleitung bei internationalen Märkten, kuratierte Wohnkonzepte für Wertsteigerung und ein starkes Partnernetzwerk mit fairen Konditionen und digitalem Support.'
|
||||
],
|
||||
[
|
||||
'question' => 'Wie funktioniert der globale Immobilienhandel bei B2In?',
|
||||
'question' => 'Wie funktioniert der globale Immobilienhandel bei B2in?',
|
||||
'answer' => 'Wir bieten direkten Zugang zu exklusiven Immobilieninvestments auf internationalen Märkten mit professioneller Begleitung. Unsere Expertise umfasst Marktanalysen, rechtliche Unterstützung und langfristige Betreuung Ihrer Investments.'
|
||||
],
|
||||
[
|
||||
'question' => 'Was macht B2In zu einem vertrauenswürdigen Partner?',
|
||||
'answer' => 'Unsere Basis ist Vertrauen, angetrieben von Technologie und Innovation. B2In ist nicht nur eine Holding, sondern ein aktiver Gestalter der Immobilienzukunft mit einer zentralen digitalen Plattform für Transparenz und Qualität.'
|
||||
'question' => 'Was macht B2in zu einem vertrauenswürdigen Partner?',
|
||||
'answer' => 'Unsere Basis ist Vertrauen, angetrieben von Technologie und Innovation. B2in ist nicht nur eine Holding, sondern ein aktiver Gestalter der Immobilienzukunft mit einer zentralen digitalen Plattform für Transparenz und Qualität.'
|
||||
]
|
||||
]
|
||||
],
|
||||
|
|
@ -188,12 +203,12 @@ return [
|
|||
]
|
||||
],
|
||||
'about_hero' => [
|
||||
'title' => 'Über <span class="text-secondary">B2In</span>',
|
||||
'quote' => '"Unsere Vision ist es, Unternehmen durch innovative Konnektivitätslösungen zu verbinden und nachhaltiges Wachstum in der digitalen Welt zu ermöglichen. Bei B2In schaffen wir nicht nur Verbindungen – wir bauen Brücken in die Zukunft."',
|
||||
'title' => 'Über <span class="text-secondary">B2in</span>',
|
||||
'quote' => '"Unsere Vision ist es, Unternehmen durch innovative Konnektivitätslösungen zu verbinden und nachhaltiges Wachstum in der digitalen Welt zu ermöglichen. Bei B2in schaffen wir nicht nur Verbindungen – wir bauen Brücken in die Zukunft."',
|
||||
'founder_name' => 'Marcel Scheibe',
|
||||
'founder_title' => 'Gründer & CEO, B2In',
|
||||
'founder_title' => 'Gründer & CEO, B2in',
|
||||
'image' => 'b2in/about-hero.jpg',
|
||||
'image_alt' => 'Marcel Scheibe, Gründer und CEO von B2In',
|
||||
'image_alt' => 'Marcel Scheibe, Gründer und CEO von B2in',
|
||||
'year' => '2024',
|
||||
'year_text' => 'Gründungsjahr'
|
||||
],
|
||||
|
|
@ -219,7 +234,7 @@ return [
|
|||
],
|
||||
[
|
||||
'title' => 'Qualifizierte Leads',
|
||||
'description' => 'Vorgefilterte, interessierte Kunden durch das B2In-Portal und Premium-Mitgliedschaften',
|
||||
'description' => 'Vorgefilterte, interessierte Kunden durch das B2in-Portal und Premium-Mitgliedschaften',
|
||||
'icon' => 'target',
|
||||
],
|
||||
[
|
||||
|
|
@ -230,29 +245,29 @@ return [
|
|||
]
|
||||
],
|
||||
'commitment_section' => [
|
||||
'title' => 'Was unsere <span class="text-secondary">Kunden</span> sagen',
|
||||
'subtitle' => 'Echte Meinungen von echten Partnern und Kunden. Ihr Vertrauen ist unser größter Ansporn.',
|
||||
'title' => 'Das <span class="text-secondary">Vertrauen</span> unserer Partner',
|
||||
'subtitle' => 'Echte Meinungen von echten Partnern. Ihr Erfolg ist unser größter Ansporn.',
|
||||
'testimonials' => [
|
||||
[
|
||||
'image' => 'b2in/testo-1.jpg',
|
||||
'rating' => 5,
|
||||
'quote' => 'Die Zusammenarbeit mit B2In hat unsere Erwartungen übertroffen. Professionell, effizient und immer lösungsorientiert.',
|
||||
'quote' => 'Die Zusammenarbeit mit B2in hat unsere Erwartungen übertroffen. Professionell, effizient und immer lösungsorientiert.',
|
||||
'author' => 'Max Mustermann',
|
||||
'author_title' => 'CEO, Beispiel AG'
|
||||
'author_title' => 'Möbelhersteller'
|
||||
],
|
||||
[
|
||||
'image' => 'b2in/testo-2.jpg',
|
||||
'rating' => 5,
|
||||
'quote' => 'Dank der B2In-Plattform konnten wir unsere Reichweite signifikant erhöhen und neue Märkte erschließen.',
|
||||
'quote' => 'Dank der B2in-Plattform konnten wir unsere Reichweite signifikant erhöhen und neue Märkte erschließen.',
|
||||
'author' => 'Erika Mustermann',
|
||||
'author_title' => 'Marketing Leiterin, Muster GmbH'
|
||||
'author_title' => 'lokaler Möbelhändler'
|
||||
],
|
||||
[
|
||||
'image' => 'b2in/testo-3.jpg',
|
||||
'rating' => 4,
|
||||
'quote' => 'Ein starker Partner für die digitale Transformation. Wir schätzen die Expertise und die partnerschaftliche Zusammenarbeit.',
|
||||
'rating' => 5,
|
||||
'quote' => 'Das B2in-Portal hat die Art, wie ich Immobilien vermarkte, revolutioniert. Das Staging wertet meine Objekte auf, und die Möbelprovision ist ein extrem attraktiver Zusatzverdienst.',
|
||||
'author' => 'John Doe',
|
||||
'author_title' => 'CTO, Tech Solutions'
|
||||
'author_title' => 'Immobilienmakler'
|
||||
]
|
||||
]
|
||||
],
|
||||
|
|
@ -272,8 +287,8 @@ return [
|
|||
'image_alt' => 'Luxury interior design'
|
||||
],
|
||||
'ecosystem_hero' => [
|
||||
'title' => 'B2In <span class="text-secondary">Ecosystem</span>',
|
||||
'subtitle' => 'Ein intelligentes Netzwerk, das Endkunden, Makler, Lieferanten und Technologie nahtlos miteinander verbindet. Jeder Teilnehmer profitiert vom gesamten System und schafft gemeinsam außergewöhnliche Möbel- und Immobilienerlebnisse.',
|
||||
'title' => 'B2in: Wie unser <span class="text-secondary">Ökosystem</span> Wachstum für alle <span class="text-secondary">Partner</span> generiert',
|
||||
'subtitle' => 'Ein intelligentes Netzwerk, das Endkunden, Händler, Lieferanten, Makler und Technologie nahtlos miteinander verbindet. Jeder Teilnehmer profitiert vom gesamten System und schafft gemeinsam außergewöhnliche Möbel- und Immobilienerlebnisse.',
|
||||
'features' => [
|
||||
[
|
||||
'title' => 'Endkunden',
|
||||
|
|
@ -298,10 +313,10 @@ return [
|
|||
],
|
||||
'image' => 'b2in/ecosystem-hero.jpg',
|
||||
'image_alt' => 'Ecosystem Hero Image',
|
||||
'card_title' => 'B2In Portal',
|
||||
'card_title' => 'B2in Portal',
|
||||
'card_text' => 'Zentrale Plattform',
|
||||
'hub' => [
|
||||
'title' => 'B2In Portal',
|
||||
'title' => 'B2in Portal',
|
||||
'subtitle' => 'Zentrale Plattform'
|
||||
],
|
||||
'connection_points' => [
|
||||
|
|
@ -317,26 +332,72 @@ return [
|
|||
'stats' => [
|
||||
[
|
||||
'number' => '1,7K+',
|
||||
'label' => 'Aktive Nutzer im Ecosystem',
|
||||
'label' => 'Partner & Experten im Netzwerk',
|
||||
'description' => 'Wachsende Community von Endkunden, Maklern und Lieferanten',
|
||||
],
|
||||
[
|
||||
'number' => '510+',
|
||||
'label' => 'Erfolgreiche Projekte',
|
||||
'label' => 'Realisierte Möbel-Projekte',
|
||||
'description' => 'Realisierte Immobilienprojekte durch unser Netzwerk',
|
||||
],
|
||||
[
|
||||
'number' => '98%',
|
||||
'label' => 'Zufriedenheitsrate',
|
||||
'label' => ' Partner-Zufriedenheit',
|
||||
'description' => 'Kundenzufriedenheit across alle Ecosystem-Teilnehmer',
|
||||
],
|
||||
[
|
||||
'number' => '24/7',
|
||||
'label' => 'Platform Verfügbarkeit',
|
||||
'label' => 'Partner-Support',
|
||||
'description' => 'Kontinuierliche Verfügbarkeit der digitalen Infrastruktur',
|
||||
],
|
||||
]
|
||||
],
|
||||
'ecosystem_start' => [
|
||||
'title' => 'Alles beginnt mit dem <span class="text-secondary">Kundenwunsch:</span>',
|
||||
'paragraphs' => [
|
||||
'Unser Ökosystem startet nicht bei Ihnen, sondern beim Endkunden.',
|
||||
'Unsere reichweitenstarken Marken <span class="text-secondary font-bold">style2own</span> und <span class="text-secondary font-bold">stileigentum</span> schaffen durch Inspiration und exklusive Konzepte eine kontinuierliche, kaufkräftige Nachfrage nach hochwertigen Möbeln.',
|
||||
],
|
||||
'image' => 'b2in/integriertes-model.jpg',
|
||||
'image_alt' => 'Die Marken',
|
||||
'image_caption' => 'Die Marken',
|
||||
'image_description' => 'Eine stilisierte Grafik, die zeigt, wie von den Logos style2own und stileigentum Pfeile in den nächsten Abschnitt führen.',
|
||||
],
|
||||
'ecosystem_hub' => [
|
||||
'title' => ' Im <span class="text-secondary">Hub trifft das Beste</span> aus zwei Welten aufeinander',
|
||||
'paragraphs' => [
|
||||
'Sobald ein Kunde seine Region wählt (z.B. Bielefeld), spielt unsere Plattform ihre Stärke aus. Dank der <span class="text-secondary font-bold">"Local First"-Logik</span> werden die Angebote unserer <span class="text-secondary font-bold">lokalen Händler</span> prominent platziert.',
|
||||
'Gleichzeitig wird das Sortiment durch die exklusiven Produkte unserer <span class="text-secondary font-bold">europäischen Hersteller</span> ergänzt. So entsteht eine unschlagbare Auswahl.',
|
||||
],
|
||||
'image' => 'b2in/integriertes-model.jpg',
|
||||
'image_alt' => 'Das B2In-Erlebnis',
|
||||
'image_caption' => 'Das B2In-Erlebnis',
|
||||
'image_description' => 'Eine klare Infografik, die zeigt: [Lokales Angebot] + [Überregionales Angebot] = Das B2In-Erlebnis..',
|
||||
],
|
||||
'ecosystem_result' => [
|
||||
'title' => 'Ein Kreislauf, in dem <span class="text-secondary">jeder gewinnt</span>',
|
||||
'paragraphs' => [
|
||||
'In diesem perfekten Zusammenspiel entstehen <span class="text-secondary font-bold">klare Vorteile</span> für jeden Teilnehmer:',
|
||||
],
|
||||
'list' => [
|
||||
[
|
||||
'icon' => 'building-storefront',
|
||||
'title' => 'Der lokale Händler gewinnt einen Online-Kunden, den er sonst nicht erreicht hätte, und stärkt seine Position vor Ort.'
|
||||
],
|
||||
[
|
||||
'icon' => 'building-office-2',
|
||||
'title' => 'Lokale Händler erhalten neue Kunden und erhöhen ihren Umsatz'
|
||||
],
|
||||
[
|
||||
'icon' => 'home-modern',
|
||||
'title' => 'Der Makler, der den Kunden ursprünglich vermittelt hat, erhält eine faire Provision und hat seinem Kunden einen unschätzbaren Mehrwert geboten.'
|
||||
],
|
||||
],
|
||||
'image' => 'b2in/integriertes-model.jpg',
|
||||
'image_alt' => 'style2own und stileigentum',
|
||||
'image_caption' => 'style2own und stileigentum',
|
||||
'image_description' => 'Eine stilisierte Grafik, die zeigt, wie von den Logos style2own und stileigentum Pfeile in den nächsten Abschnitt führen.',
|
||||
],
|
||||
'end_customer_section' => [
|
||||
'tag' => 'Für Endkunden',
|
||||
'title' => 'Exklusive <span class="text-secondary">Erlebnisse</span> für Sie',
|
||||
|
|
@ -380,8 +441,8 @@ return [
|
|||
'author_title' => 'General Manager'
|
||||
],
|
||||
'digital_core' => [
|
||||
'title' => 'Das digitale <span class="text-secondary">Herzstück</span>',
|
||||
'subtitle' => 'Unsere zentrale Plattform ist mehr als nur Technologie. Sie ist die Kommandozentrale für transparente Prozesse, datengestützte Entscheidungen und nahtlose Zusammenarbeit im gesamten Ökosystem.',
|
||||
'title' => 'Die Technologie, die diesen <span class="text-secondary">Kreislauf ermöglicht</span>',
|
||||
'subtitle' => 'Unsere zentrale Plattform ist mehr als nur Technologie. Sie ist das digitale Herzstück für transparente Prozesse, datengestützte Entscheidungen und nahtlose Zusammenarbeit im gesamten Ökosystem.',
|
||||
'features' => [
|
||||
[
|
||||
'title' => 'Maximale Zuverlässigkeit',
|
||||
|
|
@ -396,7 +457,7 @@ return [
|
|||
],
|
||||
[
|
||||
'title' => 'Zukunftsfähige Integration',
|
||||
'description' => 'Das B2In-Portal ist offen für die Zukunft. Es lässt sich nahtlos in andere Systeme integrieren und ist bereit für zukünftige Erweiterungen und Technologien.',
|
||||
'description' => 'Das B2in-Portal ist offen für die Zukunft. Es lässt sich nahtlos in andere Systeme integrieren und ist bereit für zukünftige Erweiterungen und Technologien.',
|
||||
'icon' => 'squares-2x2',
|
||||
],
|
||||
[
|
||||
|
|
@ -413,7 +474,7 @@ return [
|
|||
[
|
||||
'title' => 'Exzellente User Experience',
|
||||
'description' => 'Unsere Plattform ist für maximale Geschwindigkeit optimiert und bietet auf jedem Gerät – vom Desktop bis zum Smartphone – eine intuitive und flüssige Bedienung.',
|
||||
'icon' => 'zap',
|
||||
'icon' => 'users',
|
||||
'icon_style' => 'solid',
|
||||
],
|
||||
]
|
||||
|
|
@ -425,7 +486,7 @@ return [
|
|||
'cta_button' => 'Weitere Artikel entdecken'
|
||||
],
|
||||
'magazin_list' => [
|
||||
'title' => 'B2In <span class="text-secondary">Magazin</span>',
|
||||
'title' => 'B2in <span class="text-secondary">Magazin</span>',
|
||||
'subtitle' => 'Entdecken Sie die neuesten Trends, Insights und Geschichten aus der Welt der Business-Konnektivität und Innovation.',
|
||||
'read_more' => 'Weiterlesen',
|
||||
'load_more' => 'Weitere Artikel laden'
|
||||
|
|
@ -446,7 +507,7 @@ return [
|
|||
'description' => 'Heute sind wir stolz darauf, hunderte Unternehmen dabei zu unterstützen, ihre digitalen Ziele zu erreichen und neue Märkte zu erschließen.',
|
||||
],
|
||||
],
|
||||
'summary' => 'Was als Vision begann, traditionelle Geschäftsprozesse zu revolutionieren, ist heute eine bewährte Plattform für digitale Innovation. B2In schließt die Lücke zwischen traditionellen Unternehmen und modernen, digitalen Lösungen durch maßgeschneiderte Konnektivitätsservices, die Effizienz steigern und nachhaltiges Wachstum fördern.'
|
||||
'summary' => 'Was als Vision begann, traditionelle Geschäftsprozesse zu revolutionieren, ist heute eine bewährte Plattform für digitale Innovation. B2in schließt die Lücke zwischen traditionellen Unternehmen und modernen, digitalen Lösungen durch maßgeschneiderte Konnektivitätsservices, die Effizienz steigern und nachhaltiges Wachstum fördern.'
|
||||
],
|
||||
'our_values' => [
|
||||
'title' => 'Unsere <span class="text-secondary">Werte</span>',
|
||||
|
|
@ -491,7 +552,7 @@ return [
|
|||
],
|
||||
'partner_benefits' => [
|
||||
'title' => 'Warum Partner werden?',
|
||||
'subtitle' => 'Entdecken Sie die Vorteile einer Partnerschaft mit B2In und wie Sie von unserem innovativen Ecosystem profitieren können.',
|
||||
'subtitle' => 'Entdecken Sie die Vorteile einer Partnerschaft mit B2in und wie Sie von unserem innovativen Ecosystem profitieren können.',
|
||||
'broker' => [
|
||||
'tag' => 'Für Makler',
|
||||
'title' => 'Revolutionäres <span class="text-secondary">Provisionsmodell</span>',
|
||||
|
|
@ -546,8 +607,8 @@ return [
|
|||
]
|
||||
],
|
||||
'partner_cta' => [
|
||||
'title' => 'Wachsen Sie <br /><span class="text-primary">mit uns</span>',
|
||||
'subtitle' => 'Werden Sie Teil des B2In-Partnernetzwerks und erschließen Sie neue Geschäftsmöglichkeiten durch innovative Konnektivitätslösungen.',
|
||||
'title' => 'Wachsen Sie <span class="text-primary">mit uns</span>',
|
||||
'subtitle' => 'Werden Sie Teil des B2in-Partnernetzwerks und erschließen Sie neue Geschäftsmöglichkeiten durch innovative Konnektivitätslösungen.',
|
||||
'stats' => [
|
||||
[
|
||||
'number' => '500+',
|
||||
|
|
@ -562,33 +623,33 @@ return [
|
|||
'label' => 'Partner-Support',
|
||||
],
|
||||
],
|
||||
'button_text' => 'Werden Sie B2In Partner',
|
||||
'button_text' => 'Werden Sie B2in Partner',
|
||||
'button_link' => '/contact',
|
||||
'small_text' => 'Entdecken Sie die Vorteile einer strategischen Partnerschaft mit B2In'
|
||||
'small_text' => 'Entdecken Sie die Vorteile einer strategischen Partnerschaft mit B2in'
|
||||
],
|
||||
'partner_hero' => [
|
||||
'title' => 'Wachsen Sie mit uns.<br />Werden Sie <span class="text-secondary">B2In Partner</span>.',
|
||||
'subtitle' => 'Werden Sie Teil des B2In Ecosystems und profitieren Sie von innovativen Geschäftsmodellen, die nachhaltiges Wachstum und langfristigen Erfolg ermöglichen. Gemeinsam gestalten wir die Zukunft der Immobilienbranche.',
|
||||
'title' => 'Das Ökosystem für <span class="text-secondary">Ihren Erfolg.</span>',
|
||||
'subtitle' => 'Ob lokaler Möbel-Händler, europäische Marke oder Immobilienprofi – B2in ist die Plattform, die Ihr Geschäft mit designaffinen Kunden verbindet und neue Ertragsquellen erschließt.',
|
||||
'partner_types' => [
|
||||
[
|
||||
'title' => 'Makler',
|
||||
'description' => 'Lifetime-Vergütung',
|
||||
'icon' => 'trending-up',
|
||||
'title' => 'Hersteller & Marken',
|
||||
'description' => 'Kuratierter Marktzugang, intelligente Logistik',
|
||||
'icon' => 'building-office-2',
|
||||
],
|
||||
[
|
||||
'title' => 'Lieferanten',
|
||||
'description' => 'Globale Märkte',
|
||||
'icon' => 'globe',
|
||||
'title' => 'Lokale Händler',
|
||||
'description' => 'Digitale Reichweite, exklusives Sortiment',
|
||||
'icon' => 'building-storefront',
|
||||
],
|
||||
[
|
||||
'title' => 'Partnership',
|
||||
'description' => 'Faire Konditionen',
|
||||
'icon' => 'handshake',
|
||||
'title' => 'Makler & Bauträger',
|
||||
'description' => 'Mehrwert für Kunden, Zusatzertrag für Sie',
|
||||
'icon' => 'home-modern',
|
||||
],
|
||||
[
|
||||
'title' => 'Erfolg',
|
||||
'description' => 'Nachhaltiges Wachstum',
|
||||
'icon' => 'award',
|
||||
'title' => 'Unser Netzwerk',
|
||||
'description' => 'Gemeinsam wachsen, den Markt gestalten',
|
||||
'icon' => 'sparkles',
|
||||
],
|
||||
],
|
||||
'image' => 'b2in/partner-hero.jpg',
|
||||
|
|
@ -606,35 +667,169 @@ return [
|
|||
['name' => 'Qualität', 'subtext' => 'Premium Standards']
|
||||
]
|
||||
],
|
||||
'partner_card_section' => [
|
||||
'title' => 'Welcher <span class="text-secondary">Partner-Typ</span> sind Sie?',
|
||||
'subtitle' => 'Entdecken Sie die Vorteile einer Partnerschaft mit B2in und wie Sie von unserem innovativen Ecosystem profitieren können.',
|
||||
'cards' => [
|
||||
[
|
||||
'title' => 'Für lokale Händler & Fachexperten',
|
||||
'description' => 'Stärken Sie Ihr Geschäft vor Ort. Erhalten Sie Zugang zu Online-Kunden und einem exklusiven, überregionalen Sortiment.',
|
||||
'icon' => 'building-storefront',
|
||||
'button' => '#partner-benefits-retailer',
|
||||
'button_text' => 'Ihre Vorteile als Händler',
|
||||
],
|
||||
[
|
||||
'title' => 'Für Hersteller & europäische Marken',
|
||||
'description' => 'Erschließen Sie neue, kuratierte Vertriebskanäle in regionalen Märkten und profitieren Sie von unserer intelligenten Logistik.',
|
||||
'icon' => 'building-office-2',
|
||||
'button' => '#partner-benefits-supplier',
|
||||
'button_text' => 'Ihre Vorteile als Hersteller',
|
||||
],
|
||||
[
|
||||
'title' => 'Für Immobilienmakler & Bauträger',
|
||||
'description' => 'Bieten Sie Ihren Kunden einen einzigartigen Mehrwert, beschleunigen Sie die Vermarktung Ihrer Objekte und sichern Sie sich attraktive Zusatzprovisionen.',
|
||||
'icon' => 'home-modern',
|
||||
'button' => '#partner-benefits-broker',
|
||||
'button_text' => 'Ihre Vorteile als Makler',
|
||||
],
|
||||
]
|
||||
],
|
||||
'partner_benefits_retailer' => [
|
||||
'id' => 'partner-benefits-retailer',
|
||||
'tag' => 'Ihre Vorteile als lokaler Händler',
|
||||
'tag_icon' => 'building-storefront',
|
||||
'tag_title' => 'Werden <span class="text-secondary">Sie zum digitalen Champion</span> in Ihrer Region.',
|
||||
'features' => [
|
||||
[
|
||||
'title' => 'Digitale Reichweite',
|
||||
'description' => 'Wir bringen Ihnen die Online-Kunden, die Sie alleine nicht erreichen. Profitieren Sie von unseren reichweitenstarken Endkunden-Marken.',
|
||||
'icon' => 'signal',
|
||||
],
|
||||
[
|
||||
'title' => 'Sortiments-Erweiterung',
|
||||
'description' => 'Ergänzen Sie Ihr Angebot mit exklusiven Herstellermarken aus unserem Portfolio – ganz ohne eigenes Lagerrisiko.',
|
||||
'icon' => 'squares-plus',
|
||||
],
|
||||
[
|
||||
'title' => 'Stärkung gegen Online-Riesen',
|
||||
'description' => 'Mit "Local First" stärken wir gezielt Ihre Position im Markt. Der Kunde sieht Ihr Angebot immer zuerst.',
|
||||
'icon' => 'shield-check',
|
||||
],
|
||||
[
|
||||
'title' => 'Faire Konditionen',
|
||||
'description' => 'Unser Provisionsmodell ist transparent und darauf ausgelegt, dass wir nur dann verdienen, wenn Sie es auch tun.',
|
||||
'icon' => 'scale',
|
||||
],
|
||||
],
|
||||
'highlight' => [
|
||||
'value' => '+35%',
|
||||
'text' => 'Digitale Reichweite im ersten Jahr (Durchschnitt unserer Partner)'
|
||||
],
|
||||
'image' => 'b2in/partner-benefits-retailer.jpg',
|
||||
'image_alt' => 'Partner Benefits Retailer',
|
||||
],
|
||||
'partner_benefits_supplier' => [
|
||||
'id' => 'partner-benefits-supplier',
|
||||
'tag' => 'Ihre Vorteile als Hersteller & Marke',
|
||||
'tag_icon' => 'building-office-2',
|
||||
'tag_title' => 'Erschließen <span class="text-secondary">Sie neue Märkte</span> – intelligent und kuratiert.',
|
||||
'features' => [
|
||||
[
|
||||
'title' => 'Kuratierter Vertriebskanal',
|
||||
'description' => 'Statt sich im Rauschen großer Marktplätze zu verlieren, wird Ihre Marke gezielt designaffinen Kunden in kaufkräftigen Regionen präsentiert.',
|
||||
'icon' => 'eye',
|
||||
],
|
||||
[
|
||||
'title' => 'Effiziente Logistik',
|
||||
'description' => 'Unsere Bündel-Logistik senkt Ihre Vertriebskosten. Wir managen den Sammeltransport und die komplette Abwicklung.',
|
||||
'icon' => 'truck',
|
||||
],
|
||||
[
|
||||
'title' => 'Direkter Marktzugang',
|
||||
'description' => 'Überspringen Sie den klassischen Großhandel und bauen Sie eine direkte Beziehung zu regionalen Märkten und Endkunden auf.',
|
||||
'icon' => 'map-pin',
|
||||
],
|
||||
[
|
||||
'title' => 'Skalierbares Wachstum',
|
||||
'description' => 'Starten Sie mit uns in einer Region und wachsen Sie schrittweise in weitere europäische Hubs hinein.',
|
||||
'icon' => 'chart-bar-square',
|
||||
],
|
||||
],
|
||||
'highlight' => [
|
||||
'value' => '> 20',
|
||||
'text' => 'Kuratierte regionale Hubs als neue Vertriebskanäle in Europa'
|
||||
],
|
||||
'image' => 'b2in/partner-benefits-supplier.jpg',
|
||||
'image_alt' => 'Partner Benefits Supplier',
|
||||
],
|
||||
'partner_benefits_broker' => [
|
||||
'id' => 'partner-benefits-broker',
|
||||
'tag' => 'Ihre Vorteile als Makler & Immobilienprofi',
|
||||
'tag_icon' => 'home-modern',
|
||||
'tag_title' => 'Mehrwert für Ihre Kunden – <span class="text-secondary">Mehr Ertrag für Sie.</span>',
|
||||
'features' => [
|
||||
|
||||
[
|
||||
'title' => 'Schnellere Vermarktung durch Home Staging',
|
||||
'description' => 'Nutzen Sie unsere kuratierten Möbel-Pakete (stileigentum&style2own), um Ihre Immobilien professionell zu inszenieren. Beschleunigen Sie den Verkaufsprozess und erzielen Sie höhere Preise.',
|
||||
'icon' => 'rocket-launch',
|
||||
],
|
||||
[
|
||||
'title' => 'Einzigartiger Service nach dem Abschluss',
|
||||
'description' => 'Bieten Sie Ihren Käufern oder Mietern nach Vertragsunterzeichnung über unsere exklusive Login-Karte direkten Zugang zu einem kompletten Einrichtungsservice.',
|
||||
'icon' => 'gift',
|
||||
],
|
||||
[
|
||||
'title' => 'Attraktives Provisionsmodell',
|
||||
'description' => 'Profitieren Sie doppelt: Neben Ihrer klassischen Courtage erhalten Sie eine faire, lebenslange Provision auf alle Möbelumsätze, die Ihre Kunden über die Plattform generieren.',
|
||||
'icon' => 'currency-euro',
|
||||
],
|
||||
[
|
||||
'title' => 'Einfaches Handling',
|
||||
'description' => 'Unser digitales Makler-Portal macht es Ihnen leicht: Kunden einladen, Aktivitäten verfolgen und Provisionen transparent einsehen.',
|
||||
'icon' => 'finger-print',
|
||||
]
|
||||
],
|
||||
'highlight' => [
|
||||
'value' => '-25%',
|
||||
'text' => 'Kürzere Vermarktungszeit für mit B2in inszenierte Objekte'
|
||||
],
|
||||
'image' => 'b2in/partner-benefits-broker.jpg',
|
||||
'image_alt' => 'Partner Benefits Broker',
|
||||
],
|
||||
'partner_process' => [
|
||||
'title' => 'So werden Sie <span class="text-secondary">Partner</span>',
|
||||
'subtitle' => 'In nur drei einfachen Schritten werden Sie Teil des B2In Ecosystems und können von allen Vorteilen unserer Partnerschaft profitieren.',
|
||||
'subtitle' => 'In nur drei einfachen Schritten werden Sie Teil des B2in Ecosystems und können von allen Vorteilen unserer Partnerschaft profitieren.',
|
||||
'steps' => [
|
||||
[
|
||||
'step' => '1',
|
||||
'title' => 'Bewerben',
|
||||
'description' => 'Senden Sie uns Ihre Bewerbungsunterlagen und stellen Sie sich sowie Ihr Unternehmen vor. Wir prüfen Ihre Qualifikationen.',
|
||||
'icon' => 'file-text',
|
||||
'description' => 'Erzählen Sie uns Ihre Geschichte. Füllen Sie unser kurzes Kontaktformular aus und zeigen Sie uns, was Ihre Produkte oder Ihr Geschäft auszeichnet.',
|
||||
'icon' => 'envelope',
|
||||
'image' => 'b2in/room-1.jpg'
|
||||
],
|
||||
[
|
||||
'step' => '2',
|
||||
'title' => 'Prüfung',
|
||||
'description' => 'Unser Expertenteam überprüft Ihre Bewerbung sorgfältig. Bei positivem Ergebnis laden wir Sie zu einem persönlichen Gespräch ein.',
|
||||
'icon' => 'search',
|
||||
'description' => 'Wir prüfen jede Anfrage persönlich. Unser Ziel ist es, ein hochwertiges und komplementäres Netzwerk aufzubauen, von dem alle profitieren.',
|
||||
'icon' => 'check-circle',
|
||||
'image' => 'b2in/room-2.jpg'
|
||||
],
|
||||
[
|
||||
'step' => '3',
|
||||
'title' => 'Onboarding',
|
||||
'description' => 'Nach erfolgreicher Aufnahme erhalten Sie Zugang zu unserer Plattform und umfassende Schulungen für einen erfolgreichen Start.',
|
||||
'icon' => 'rocket',
|
||||
'description' => 'Willkommen an Bord! Wir schulen Sie persönlich im Umgang mit unserem Partner-Portal und stellen sicher, dass Sie vom ersten Tag an erfolgreich sind.',
|
||||
'icon' => 'rocket-launch',
|
||||
'image' => 'b2in/room-3.jpg'
|
||||
]
|
||||
],
|
||||
'cta' => [
|
||||
'button_text' => ' Zum Partner-Portal',
|
||||
'button_link' => '/contact'
|
||||
],
|
||||
'cta' => [
|
||||
'title' => 'Bereit für den nächsten <span class="text-secondary">Schritt</span>?',
|
||||
'subtitle' => 'Werden Sie noch heute Teil des B2In Ecosystems und profitieren Sie von innovativen Geschäftsmodellen und nachhaltigen Erfolgsstrategien.',
|
||||
'subtitle' => 'Werden Sie noch heute Teil des B2in Ecosystems und profitieren Sie von innovativen Geschäftsmodellen und nachhaltigen Erfolgsstrategien.',
|
||||
'button_text' => 'Jetzt Partner werden',
|
||||
'button_link' => '/contact'
|
||||
]
|
||||
|
|
@ -1052,7 +1247,7 @@ return [
|
|||
'title' => 'Follow us for<br /><span class="text-secondary font-medium">Industry Insights</span>',
|
||||
'subtitle' => 'Stay updated with European design trends and B2B news.',
|
||||
'platforms' => [
|
||||
['name' => 'LinkedIn', 'handle' => 'B2In Company Page', 'url' => 'https://linkedin.com/company/b2in'],
|
||||
['name' => 'LinkedIn', 'handle' => 'B2in Company Page', 'url' => 'https://linkedin.com/company/b2in'],
|
||||
]
|
||||
]
|
||||
],
|
||||
|
|
@ -1091,7 +1286,7 @@ return [
|
|||
'image_alt' => 'Moderne Architektur mit stilvollem Design',
|
||||
]
|
||||
],
|
||||
'card_title' => 'B2In Ecosystem',
|
||||
'card_title' => 'B2in Ecosystem',
|
||||
'card_text' => 'Global<span class="text-sm text-muted-foreground"> vernetzt</span>'
|
||||
],
|
||||
'vision_section' => [
|
||||
|
|
@ -1375,12 +1570,12 @@ return [
|
|||
'button_link' => '/contact'
|
||||
],
|
||||
'about_hero' => [
|
||||
'title' => 'Über <span class="text-secondary">B2In</span>',
|
||||
'quote' => '"Unsere Vision ist es, Unternehmen durch innovative Konnektivitätslösungen zu verbinden und nachhaltiges Wachstum in der digitalen Welt zu ermöglichen. Bei B2In schaffen wir nicht nur Verbindungen – wir bauen Brücken in die Zukunft."',
|
||||
'title' => 'Über <span class="text-secondary">B2in</span>',
|
||||
'quote' => '"Unsere Vision ist es, Unternehmen durch innovative Konnektivitätslösungen zu verbinden und nachhaltiges Wachstum in der digitalen Welt zu ermöglichen. Bei B2in schaffen wir nicht nur Verbindungen – wir bauen Brücken in die Zukunft."',
|
||||
'founder_name' => 'Marcel Scheibe',
|
||||
'founder_title' => 'Gründer & CEO, B2In',
|
||||
'founder_title' => 'Gründer & CEO, B2in',
|
||||
'image' => 'b2in/marcel-scheibe.jpg',
|
||||
'image_alt' => 'Marcel Scheibe, Gründer und CEO von B2In',
|
||||
'image_alt' => 'Marcel Scheibe, Gründer und CEO von B2in',
|
||||
'year' => '2024',
|
||||
'year_text' => 'Gründungsjahr'
|
||||
],
|
||||
|
|
@ -2052,7 +2247,7 @@ return [
|
|||
],
|
||||
[
|
||||
'title' => 'Personalisierung ist der Schlüssel',
|
||||
'content' => 'One-size-fits-all war gestern. Intelligente Plattformen wie das B2In-Portal ermöglichen es, Staging-Konzepte gezielt auf die demografische Zielgruppe des Käufers zuzuschneiden. Ob minimalistisch für den jungen Urbanisten oder elegant für die anspruchsvolle Familie – personalisiertes Staging trifft den Nerv und maximiert die Identifikation mit der Immobilie.',
|
||||
'content' => 'One-size-fits-all war gestern. Intelligente Plattformen wie das B2in-Portal ermöglichen es, Staging-Konzepte gezielt auf die demografische Zielgruppe des Käufers zuzuschneiden. Ob minimalistisch für den jungen Urbanisten oder elegant für die anspruchsvolle Familie – personalisiertes Staging trifft den Nerv und maximiert die Identifikation mit der Immobilie.',
|
||||
],
|
||||
],
|
||||
],
|
||||
|
|
@ -2067,7 +2262,7 @@ return [
|
|||
'readTime' => '8 min read',
|
||||
'author' => [
|
||||
'name' => 'David Chen',
|
||||
'bio' => 'Head of Global Market Analytics bei B2In. David analysiert internationale Marktdaten, um die Investment-Chancen von morgen zu identifizieren.',
|
||||
'bio' => 'Head of Global Market Analytics bei B2in. David analysiert internationale Marktdaten, um die Investment-Chancen von morgen zu identifizieren.',
|
||||
'avatar' => 'author-chen.jpg',
|
||||
],
|
||||
'content' => [
|
||||
|
|
@ -2098,7 +2293,7 @@ return [
|
|||
'readTime' => '5 min read',
|
||||
'author' => [
|
||||
'name' => 'Frank Miller',
|
||||
'bio' => 'CEO der Bridges2America Corp. (B2A), dem spezialisierten US-Möbel-Exportarm von B2In. Er ist ein Experte für transatlantische Handelsbeziehungen.',
|
||||
'bio' => 'CEO der Bridges2America Corp. (B2A), dem spezialisierten US-Möbel-Exportarm von B2in. Er ist ein Experte für transatlantische Handelsbeziehungen.',
|
||||
'avatar' => 'author-miller.jpg',
|
||||
],
|
||||
'content' => [
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 93 KiB After Width: | Height: | Size: 86 KiB |
BIN
public/img/assets/b2in/hero-room Kopie 2.jpg
Normal file
BIN
public/img/assets/b2in/hero-room Kopie 2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 217 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 217 KiB After Width: | Height: | Size: 126 KiB |
BIN
public/img/assets/b2in/integriertes-model.jpg
Normal file
BIN
public/img/assets/b2in/integriertes-model.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
public/img/assets/b2in/partner-benefits-broker.jpg
Normal file
BIN
public/img/assets/b2in/partner-benefits-broker.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 104 KiB |
BIN
public/img/assets/b2in/partner-benefits-retailer.jpg
Normal file
BIN
public/img/assets/b2in/partner-benefits-retailer.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
BIN
public/img/assets/b2in/partner-benefits-supplier.jpg
Normal file
BIN
public/img/assets/b2in/partner-benefits-supplier.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
BIN
public/img/assets/b2in/partner-hero Kopie 2.jpg
Normal file
BIN
public/img/assets/b2in/partner-hero Kopie 2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 139 KiB |
BIN
public/img/assets/b2in/partner-hero Kopie.jpg
Normal file
BIN
public/img/assets/b2in/partner-hero Kopie.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 169 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 169 KiB After Width: | Height: | Size: 139 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 91 KiB After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 82 KiB After Width: | Height: | Size: 93 KiB |
|
|
@ -1,21 +1,25 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 283.46 160.63">
|
||||
<svg id="Ebene_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 300 175">
|
||||
<!-- Generator: Adobe Illustrator 29.8.2, SVG Export Plug-In . SVG Version: 2.1.1 Build 3) -->
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
.st0 {
|
||||
fill: #2c9fda;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
.st1 {
|
||||
fill: #fff;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-1" d="M36.8,55.75C45.39,25.8,75.26,3.7,110.8,3.7s65.41,22.1,74,52.04h13.94C185.49,23.2,151.12,0,110.8,0S36.12,23.2,22.86,55.75h13.94Z"/>
|
||||
<g>
|
||||
<path class="cls-2" d="M0,160.63V60.03h39.61c7.33,0,13.44,1.11,18.33,3.34,4.89,2.23,8.56,5.28,10.99,9.15,2.43,3.87,3.65,8.33,3.65,13.37,0,3.96-.78,7.42-2.34,10.36-1.57,2.95-3.7,5.36-6.4,7.22-2.7,1.87-5.77,3.21-9.22,4.02v1.01c3.75.14,7.29,1.2,10.62,3.21,3.33,2,6.03,4.79,8.11,8.37,2.08,3.58,3.12,7.84,3.12,12.79,0,5.31-1.3,10.06-3.89,14.25-2.59,4.19-6.42,7.48-11.49,9.89-5.07,2.41-11.38,3.61-18.93,3.61H0ZM20.44,102.29h16.15c2.9,0,5.52-.53,7.84-1.59,2.32-1.06,4.14-2.57,5.46-4.52,1.32-1.96,1.98-4.29,1.98-6.99,0-3.65-1.29-6.62-3.85-8.91-2.57-2.3-6.24-3.44-11.02-3.44h-16.55v25.45ZM20.44,143.68h17.69c5.99,0,10.36-1.17,13.14-3.51,2.77-2.34,4.16-5.42,4.16-9.25,0-2.84-.68-5.34-2.04-7.53-1.36-2.18-3.29-3.89-5.8-5.13-2.5-1.24-5.47-1.86-8.91-1.86h-18.23v27.28Z"/>
|
||||
<path class="cls-2" d="M90.07,160.63v-14.85l35.38-33.42c3.04-2.97,5.59-5.66,7.67-8.07,2.08-2.41,3.66-4.77,4.76-7.09,1.09-2.32,1.64-4.83,1.64-7.53,0-3.01-.67-5.6-2.01-7.76-1.34-2.16-3.17-3.83-5.49-5-2.32-1.17-4.98-1.75-7.97-1.75s-5.79.63-8.11,1.89c-2.32,1.26-4.11,3.06-5.36,5.4s-1.88,5.15-1.88,8.44h-19.57c0-6.53,1.48-12.21,4.46-17.05,2.97-4.84,7.09-8.57,12.36-11.21,5.27-2.63,11.35-3.95,18.23-3.95s13.22,1.27,18.5,3.81c5.27,2.54,9.37,6.04,12.3,10.5,2.93,4.46,4.39,9.59,4.39,15.39,0,3.74-.73,7.43-2.18,11.07-1.45,3.65-4.05,7.73-7.77,12.25s-9.01,9.94-15.85,16.24l-15.08,14.99v.74h42.22v16.95h-70.63Z"/>
|
||||
<path class="cls-2" d="M207.81,160.63h-33.41v-12.72h10.4v-71.07h-10.4v-12.72h33.41v12.72h-10.51v71.07h10.51v12.72Z"/>
|
||||
<path class="cls-2" d="M269.53,160.63l-25.22-53.23-8.52-20.6h-.33v73.84h-11.95v-96.51h14.05l25.11,53.23,8.52,20.6h.33v-73.83h11.95v96.51h-13.94Z"/>
|
||||
<path class="st1" d="M0,175v-109.6h43.1c7.9,0,14.6,1.2,20,3.6,5.3,2.4,9.3,5.7,12,9.9,2.6,4.2,4,9.1,4,14.6s-.8,8-2.5,11.3c-1.7,3.2-4,5.8-7,7.8s-6.2,3.5-10.1,4.3v1.1c4.1,0,7.9,1.3,11.5,3.5s6.6,5.2,8.8,9.1,3.4,8.6,3.4,14-1.4,10.9-4.2,15.6c-2.9,4.6-7,8.1-12.5,10.8-5.5,2.6-12.4,3.9-20.6,3.9H0ZM22.2,111.5h17.6c3.2,0,6-.5,8.6-1.7,2.5-1.2,4.6-2.8,5.9-5,1.5-2.1,2.1-4.7,2.1-7.6s-1.4-7.2-4.2-9.7-6.8-3.7-12-3.7h-18v27.7h0ZM22.2,156.4h19.3c6.6,0,11.3-1.3,14.3-3.8s4.6-5.9,4.6-10.1-.7-5.8-2.2-8.1c-1.5-2.3-3.6-4.2-6.3-5.6-2.8-1.4-5.9-2-9.7-2h-20.1v29.6h.1Z"/>
|
||||
<path class="st1" d="M98,175v-16.2l38.5-36.4c3.3-3.3,6.1-6.1,8.4-8.8s4-5.2,5.2-7.7,1.8-5.3,1.8-8.1-.7-6.1-2.2-8.5-3.5-4.1-6-5.4-5.4-1.9-8.7-1.9-6.3.6-8.8,2-4.4,3.3-5.8,5.9c-1.4,2.5-2,5.6-2,9.2h-21.4c0-7.1,1.6-13.3,4.9-18.5,3.3-5.3,7.7-9.3,13.4-12.2,5.7-2.9,12.4-4.3,19.9-4.3s14.4,1.4,20.1,4.1c5.7,2.8,10.2,6.6,13.4,11.4,3.2,4.9,4.8,10.5,4.8,16.7s-.7,8-2.3,12.1c-1.6,4-4.4,8.5-8.5,13.3-4,5-9.8,10.8-17.2,17.7l-16.4,16.3v.8h45.9v18.4h-77Z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path class="st1" d="M199.2,174.7v-78.4h19.3v78.4h-19.3Z"/>
|
||||
<path class="st1" d="M252.2,174.7h-19.3v-78.4h19.3v13.2h.7c1.6-4.2,4.1-7.7,7.6-10.6s8.3-4.2,14.4-4.2,14.2,2.6,18.5,8,6.6,12.9,6.6,22.6v49.5h-19.3v-47.6c0-5.6-1-9.8-3-12.6-2-2.8-5.3-4.2-9.9-4.2s-5.1.5-7.5,1.4c-2.4,1-4.3,2.3-5.8,4.2-1.5,1.9-2.2,4.2-2.2,7v51.7h-.1Z"/>
|
||||
</g>
|
||||
<path class="st0" d="M208.8,58.5c2.6,0,5,.3,7,.8C201,24.6,163.9,0,120.6,0S39.3,25.3,24.8,60.6h15.2C49.3,28,81.9,4,120.5,4s70.5,23.5,80.2,55.6c2.3-.7,4.9-1.1,8.1-1.1Z"/>
|
||||
<path class="st1" d="M208.8,85.8c-3.9,0-6.8-1-8.6-2.8s-2.8-4.1-2.8-6.9v-3c0-2.8,1-5.1,2.8-6.9s4.7-2.8,8.6-2.8,6.8,1,8.6,2.8,2.8,4.1,2.8,6.9v3c0,2.8-1,5-2.8,6.9s-4.7,2.8-8.6,2.8Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2 KiB After Width: | Height: | Size: 2 KiB |
|
|
@ -1,21 +1,25 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 283.46 160.63">
|
||||
<svg id="Ebene_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 300 175">
|
||||
<!-- Generator: Adobe Illustrator 29.8.2, SVG Export Plug-In . SVG Version: 2.1.1 Build 3) -->
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #2c9fda;
|
||||
.st0 {
|
||||
fill: #314052;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #314052;
|
||||
.st1 {
|
||||
fill: #2c9fda;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-1" d="M36.8,55.75C45.39,25.8,75.26,3.7,110.8,3.7s65.41,22.1,74,52.04h13.94C185.49,23.2,151.12,0,110.8,0S36.12,23.2,22.87,55.75h13.94Z"/>
|
||||
<g>
|
||||
<path class="cls-2" d="M0,160.63V60.03h39.61c7.33,0,13.44,1.11,18.33,3.34,4.89,2.23,8.56,5.28,10.99,9.15,2.43,3.87,3.65,8.33,3.65,13.37,0,3.96-.78,7.42-2.34,10.36-1.57,2.95-3.7,5.36-6.4,7.22-2.7,1.87-5.77,3.21-9.22,4.02v1.01c3.75.14,7.29,1.2,10.62,3.21,3.33,2,6.03,4.79,8.11,8.37,2.08,3.58,3.12,7.84,3.12,12.79,0,5.31-1.3,10.06-3.89,14.25-2.59,4.19-6.42,7.48-11.49,9.89-5.07,2.41-11.38,3.61-18.93,3.61H0ZM20.44,102.29h16.15c2.9,0,5.52-.53,7.84-1.59,2.32-1.06,4.14-2.57,5.46-4.52,1.32-1.96,1.98-4.29,1.98-6.99,0-3.65-1.29-6.62-3.85-8.91-2.57-2.3-6.24-3.44-11.02-3.44h-16.55v25.45ZM20.44,143.68h17.69c5.99,0,10.36-1.17,13.14-3.51,2.77-2.34,4.16-5.42,4.16-9.25,0-2.84-.68-5.34-2.04-7.53-1.36-2.18-3.29-3.89-5.8-5.13-2.5-1.24-5.47-1.86-8.91-1.86h-18.23v27.28Z"/>
|
||||
<path class="cls-2" d="M90.07,160.63v-14.85l35.38-33.42c3.04-2.97,5.59-5.66,7.67-8.07,2.08-2.41,3.66-4.77,4.76-7.09,1.09-2.32,1.64-4.83,1.64-7.53,0-3.01-.67-5.6-2.01-7.76s-3.17-3.83-5.49-5c-2.32-1.17-4.98-1.75-7.97-1.75s-5.79.63-8.11,1.89c-2.32,1.26-4.11,3.06-5.36,5.4s-1.88,5.15-1.88,8.44h-19.57c0-6.53,1.48-12.21,4.46-17.05,2.97-4.84,7.09-8.57,12.36-11.21,5.27-2.63,11.35-3.95,18.23-3.95s13.22,1.27,18.5,3.81c5.27,2.54,9.37,6.04,12.3,10.5,2.93,4.46,4.39,9.59,4.39,15.39,0,3.74-.73,7.43-2.18,11.07-1.45,3.65-4.05,7.73-7.77,12.25s-9.01,9.94-15.85,16.24l-15.08,14.99v.74h42.22v16.95h-70.63Z"/>
|
||||
<path class="cls-2" d="M207.81,160.63h-33.41v-12.72h10.4v-71.07h-10.4v-12.72h33.41v12.72h-10.51v71.07h10.51v12.72Z"/>
|
||||
<path class="cls-2" d="M269.53,160.63l-25.22-53.23-8.52-20.6h-.33v73.84h-11.95v-96.51h14.05l25.11,53.23,8.52,20.6h.33v-73.83h11.95v96.51h-13.94Z"/>
|
||||
<path class="st0" d="M0,175v-109.6h43.1c7.9,0,14.6,1.2,20,3.6,5.3,2.4,9.3,5.7,12,9.9,2.6,4.2,4,9.1,4,14.6s-.8,8-2.5,11.3c-1.7,3.2-4,5.8-7,7.8s-6.2,3.5-10.1,4.3v1.1c4.1,0,7.9,1.3,11.5,3.5s6.6,5.2,8.8,9.1c2.2,3.9,3.4,8.6,3.4,14s-1.4,10.9-4.2,15.6c-2.9,4.6-7,8.1-12.5,10.8-5.5,2.6-12.4,3.9-20.6,3.9H0ZM22.2,111.5h17.6c3.2,0,6-.5,8.6-1.7,2.5-1.2,4.6-2.8,5.9-5,1.5-2.1,2.1-4.7,2.1-7.6s-1.4-7.2-4.2-9.7-6.8-3.7-12-3.7h-18v27.7h0ZM22.2,156.4h19.3c6.6,0,11.3-1.3,14.3-3.8s4.6-5.9,4.6-10.1-.7-5.8-2.2-8.1c-1.5-2.3-3.6-4.2-6.3-5.6-2.8-1.4-5.9-2-9.7-2h-20.1v29.6h.1Z"/>
|
||||
<path class="st0" d="M98.1,175v-16.2l38.5-36.4c3.3-3.3,6.1-6.1,8.4-8.8,2.2-2.6,4-5.2,5.2-7.7s1.8-5.3,1.8-8.1-.7-6.1-2.2-8.5-3.5-4.1-6-5.4-5.4-1.9-8.7-1.9-6.3.6-8.8,2-4.4,3.3-5.8,5.9c-1.4,2.5-2,5.6-2,9.2h-21.3c0-7.1,1.6-13.3,4.9-18.5,3.3-5.3,7.7-9.3,13.4-12.2,5.7-2.9,12.4-4.3,19.9-4.3s14.4,1.4,20.1,4.1c5.7,2.8,10.2,6.6,13.4,11.4,3.2,4.9,4.8,10.5,4.8,16.7s-.7,8-2.3,12.1c-1.6,4-4.4,8.5-8.5,13.3-4,5-9.8,10.8-17.2,17.7l-16.4,16.3v.8h45.9v18.4h-77.1Z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path class="st0" d="M199.2,174.7v-78.4h19.3v78.4h-19.3Z"/>
|
||||
<path class="st0" d="M252.2,174.7h-19.3v-78.4h19.3v13.2h.7c1.6-4.2,4.1-7.7,7.6-10.6s8.3-4.2,14.4-4.2,14.2,2.6,18.5,8,6.6,12.9,6.6,22.6v49.5h-19.3v-47.6c0-5.6-1-9.8-3-12.6-2-2.8-5.3-4.2-9.9-4.2s-5.1.5-7.5,1.4c-2.4,1-4.3,2.3-5.8,4.2s-2.2,4.2-2.2,7v51.7h-.1Z"/>
|
||||
</g>
|
||||
<path class="st1" d="M208.8,58.5c2.6,0,5,.3,7,.8C201,24.6,163.9,0,120.6,0S39.3,25.3,24.8,60.6h15.2C49.3,28,81.9,4,120.5,4s70.5,23.5,80.2,55.6c2.4-.7,5-1.1,8.1-1.1Z"/>
|
||||
<path class="st0" d="M208.8,85.8c-3.9,0-6.8-1-8.6-2.8s-2.8-4.1-2.8-6.9v-3c0-2.8,1-5.1,2.8-6.9s4.7-2.8,8.6-2.8,6.8,1,8.6,2.8,2.8,4.1,2.8,6.9v3c0,2.8-1,5-2.8,6.9s-4.7,2.8-8.6,2.8Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2 KiB After Width: | Height: | Size: 2 KiB |
1215
resources/css/web/exampels.css
Normal file
1215
resources/css/web/exampels.css
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -23,9 +23,10 @@ h1, h2, h3, h4, h5, h6 {
|
|||
font-family: var(--font-secondary, 'Inter'), var(--font-primary, 'Inter'), system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
/* Typography scales */
|
||||
.text-hero {
|
||||
font-size: clamp(3rem, 4vw, 6rem);
|
||||
font-size: clamp(2.6rem, 3.5vw, 3.6rem);
|
||||
line-height: 1.1;
|
||||
font-weight: 300;
|
||||
letter-spacing: -0.025em;
|
||||
|
|
@ -33,6 +34,7 @@ h1, h2, h3, h4, h5, h6 {
|
|||
|
||||
.text-section-title {
|
||||
font-size: clamp(1.6rem, 3vw, 3rem);
|
||||
line-height: 1.3em;
|
||||
font-weight: 300;
|
||||
letter-spacing: -0.025em;
|
||||
}
|
||||
|
|
@ -62,6 +64,11 @@ h1, h2, h3, h4, h5, h6 {
|
|||
/* Button styles */
|
||||
.btn-primary {
|
||||
background-color: hsl(var(--primary));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--primary)) 0%,
|
||||
hsl(var(--primary-light)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--primary-foreground));
|
||||
padding: 0.75rem 2rem;
|
||||
border-radius: 0.5rem;
|
||||
|
|
@ -74,11 +81,22 @@ h1, h2, h3, h4, h5, h6 {
|
|||
|
||||
.btn-primary:hover {
|
||||
background-color: hsl(var(--secondary));
|
||||
color: hsl(var(--secondary-foreground));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--primary-light)) 0%,
|
||||
hsl(var(--primary)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--secondary-lighter));
|
||||
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
|
||||
}
|
||||
|
||||
.btn-primary-accent {
|
||||
background-color: hsl(var(--primary));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--primary)) 0%,
|
||||
hsl(var(--primary-light)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--primary-foreground));
|
||||
border: 1px solid hsl(var(--border));
|
||||
padding: 0.75rem 2rem;
|
||||
|
|
@ -92,12 +110,22 @@ h1, h2, h3, h4, h5, h6 {
|
|||
|
||||
.btn-primary-accent:hover {
|
||||
background-color: hsl(var(--accent));
|
||||
color: hsl(var(--accent-foreground));
|
||||
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--primary-light)) 0%,
|
||||
hsl(var(--primary)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--secondary-lighter));
|
||||
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background-color: hsl(var(--secondary));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--secondary)) 0%,
|
||||
hsl(var(--secondary-dark)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--secondary-foreground));
|
||||
border: 1px solid hsl(var(--border));
|
||||
padding: 0.75rem 2rem;
|
||||
|
|
@ -111,11 +139,16 @@ h1, h2, h3, h4, h5, h6 {
|
|||
|
||||
.btn-secondary:hover {
|
||||
background-color: hsl(var(--primary));
|
||||
color: hsl(var(--primary-foreground));
|
||||
color: hsl(var(--primary-lighter));
|
||||
}
|
||||
|
||||
.btn-secondary-accent {
|
||||
background-color: hsl(var(--secondary));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--secondary)) 0%,
|
||||
hsl(var(--secondary-dark)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--secondary-foreground));
|
||||
border: 1px solid hsl(var(--border));
|
||||
padding: 0.75rem 2rem;
|
||||
|
|
@ -128,11 +161,21 @@ h1, h2, h3, h4, h5, h6 {
|
|||
|
||||
.btn-secondary-accent:hover {
|
||||
background-color: hsl(var(--accent));
|
||||
color: hsl(var(--accent-foreground));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--secondary-dark)) 0%,
|
||||
hsl(var(--secondary)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--primary-lighter));
|
||||
}
|
||||
|
||||
.btn-accent {
|
||||
background-color: hsl(var(--accent));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--accent)) 0%,
|
||||
hsl(var(--accent-dark)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--accent-foreground));
|
||||
padding: 0.75rem 2rem;
|
||||
border-radius: 0.5rem;
|
||||
|
|
@ -144,8 +187,12 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
|
||||
.btn-accent:hover {
|
||||
background-color: hsl(var(--secondary));
|
||||
color: hsl(var(--secondary-foreground));
|
||||
background: linear-gradient(
|
||||
145deg,
|
||||
hsl(var(--accent-dark)) 0%,
|
||||
hsl(var(--accent)) 100%
|
||||
) !important;
|
||||
color: hsl(var(--accent-foreground));
|
||||
box-shadow: var(--shadow-accent-glow);
|
||||
}
|
||||
|
||||
|
|
@ -267,7 +314,12 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
|
||||
.bg-secondary {
|
||||
background-color: hsl(var(--secondary));
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
hsl(var(--secondary)) 0%,
|
||||
hsl(var(--secondary), 0.4) 100%
|
||||
);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.text-secondary-foreground {
|
||||
|
|
@ -302,10 +354,13 @@ h1, h2, h3, h4, h5, h6 {
|
|||
background-color: hsl(var(--secondary) / 0.1);
|
||||
}
|
||||
|
||||
.bg-secondary\/15 {
|
||||
background-color: hsl(var(--secondary) / 0.15);
|
||||
}
|
||||
|
||||
.bg-secondary\/20 {
|
||||
background-color: hsl(var(--secondary) / 0.2);
|
||||
}
|
||||
|
||||
.bg-card\/95 {
|
||||
background-color: hsl(var(--card) / 0.95);
|
||||
}
|
||||
|
|
@ -406,8 +461,7 @@ h1, h2, h3, h4, h5, h6 {
|
|||
|
||||
/* TopBar specific styles */
|
||||
.topbar-normal {
|
||||
background-color: hsl(var(--muted) / 0.2);
|
||||
border-bottom: 1px solid hsl(var(--border) / 0.3);
|
||||
background-color: hsl(var(--muted));
|
||||
}
|
||||
|
||||
/* Sticky Header Verhalten */
|
||||
|
|
@ -426,6 +480,8 @@ h1, h2, h3, h4, h5, h6 {
|
|||
.header-normal {
|
||||
position: relative;
|
||||
transition: all 0.3s ease-in-out;
|
||||
border-bottom: 1px solid hsl(var(--border)/0.3);
|
||||
|
||||
}
|
||||
|
||||
.bg-muted\/20 {
|
||||
|
|
@ -435,3 +491,154 @@ h1, h2, h3, h4, h5, h6 {
|
|||
.border-border\/30 {
|
||||
border-color: hsl(var(--border) / 0.3);
|
||||
}
|
||||
.font-secondary {
|
||||
font-family: var(--font-secondary, 'Inter'), var(--font-primary, 'Inter'), system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
|
||||
|
||||
/* Premium Scroll Animations - Optimiert und subtil */
|
||||
.scroll-animate {
|
||||
opacity: 0;
|
||||
will-change: opacity, transform;
|
||||
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.scroll-animate.is-visible {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Fade In - Sanftes Einblenden */
|
||||
.fade-in {
|
||||
opacity: 0;
|
||||
will-change: opacity;
|
||||
transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.fade-in.is-visible {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Slide from Bottom - Subtiler */
|
||||
.slide-up {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
will-change: opacity, transform;
|
||||
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.slide-up.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.slide-down {
|
||||
opacity: 0;
|
||||
transform: translateY(-30px);
|
||||
will-change: opacity, transform;
|
||||
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.slide-down.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
/* Slide from Left - Subtiler */
|
||||
.slide-right {
|
||||
opacity: 0;
|
||||
transform: translateX(-30px);
|
||||
will-change: opacity, transform;
|
||||
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.slide-right.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* Slide from Right - Subtiler */
|
||||
.slide-left {
|
||||
opacity: 0;
|
||||
transform: translateX(30px);
|
||||
will-change: opacity, transform;
|
||||
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.slide-left.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
/* Scale In - Sehr subtil */
|
||||
.scale-in {
|
||||
opacity: 0;
|
||||
transform: scale(0.97);
|
||||
will-change: opacity, transform;
|
||||
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
.scale-in.is-visible {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
/* Staggered delays - Für gestaffelte Animationen */
|
||||
.delay-100 {
|
||||
transition-delay: 0.1s;
|
||||
}
|
||||
|
||||
.delay-200 {
|
||||
transition-delay: 0.2s;
|
||||
}
|
||||
|
||||
.delay-300 {
|
||||
transition-delay: 0.3s;
|
||||
}
|
||||
|
||||
.delay-400 {
|
||||
transition-delay: 0.4s;
|
||||
}
|
||||
|
||||
.delay-500 {
|
||||
transition-delay: 0.5s;
|
||||
}
|
||||
|
||||
.delay-600 {
|
||||
transition-delay: 0.6s;
|
||||
}
|
||||
|
||||
.delay-700 {
|
||||
transition-delay: 0.7s;
|
||||
}
|
||||
|
||||
.delay-800 {
|
||||
transition-delay: 0.8s;
|
||||
}
|
||||
|
||||
.delay-900 {
|
||||
transition-delay: 0.9s;
|
||||
}
|
||||
|
||||
.delay-1000 {
|
||||
transition-delay: 1s;
|
||||
}
|
||||
|
||||
/* Reduziere Motion für Nutzer mit Präferenz */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.scroll-animate,
|
||||
.fade-in,
|
||||
.slide-up,
|
||||
.slide-right,
|
||||
.slide-left,
|
||||
.scale-in {
|
||||
transition: none !important;
|
||||
opacity: 1 !important;
|
||||
transform: none !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -17,16 +17,23 @@
|
|||
|
||||
/* B2IN Theme Colors */
|
||||
--primary: 209 32% 25%; /* #2b3f51 - Anthracite */
|
||||
--primary-light: 209 32% 35%; /* #2b3f51 - Anthracite */
|
||||
--primary-lighter: 209 32% 85%; /* #2b3f51 - Anthracite */
|
||||
--primary-dark: 209 32% 20%; /* #2b3f51 - Anthracite */
|
||||
--primary-foreground: 0 25% 96%; /* #hsl(0 25% 96%) - Off White */
|
||||
|
||||
--secondary: 199 74% 49%; /* #20a0da - Dynamic Blue */
|
||||
--secondary-light: 199 74% 56%; /* #20a0da - Dynamic Blue */
|
||||
--secondary-lighter: 199 74% 75%; /* #20a0da - Dynamic Blue */
|
||||
--secondary-dark: 199 74% 42%; /* #20a0da - Dynamic Blue */
|
||||
--secondary-foreground: 0 25% 96%; /* hsl(0 25% 96%) - Off White */
|
||||
|
||||
/* Neutral colors */
|
||||
--muted: 0 0% 92%; /* hsl(0 0% 92%) - Light Muted */
|
||||
--muted-foreground: 199 50% 45%; /* #4a8bb5 - Muted Blue */
|
||||
--muted-foreground: 199 50% 35%; /* #4a8bb5 - Muted Blue */
|
||||
|
||||
--accent: 210 0% 94%; /* hsl(210 5.26% 92.55%) - Light Accent */
|
||||
--accent: 210 0% 90%; /* hsl(210 5.26% 92.55%) - Light Accent */
|
||||
--accent-dark: 210 0% 85%; /* hsl(210 5.26% 92.55%) - Light Accent */
|
||||
--accent-foreground: 20 14% 16%; /* #2a2a2a - Dark Gray */
|
||||
|
||||
/* Dark section colors */
|
||||
|
|
@ -45,7 +52,9 @@
|
|||
--radius: 0.75rem;
|
||||
|
||||
/* Hero container background */
|
||||
--hero-container: 0 0% 91%; /* #e8e8e8 - Light Gray */
|
||||
--hero-container: 0 0% 93%; /* #e8e8e8 - Light Gray */
|
||||
--hero-container-dark: 0 0% 85%; /* #e8e8e8 - Light Gray */
|
||||
--hero-container-light: 0 0% 95%; /* #e8e8e8 - Light Gray */
|
||||
|
||||
/* Consistent shadows */
|
||||
--shadow-warm: 0 10px 30px -15px hsl(var(--foreground) / 0.1);
|
||||
|
|
@ -62,7 +71,195 @@
|
|||
--font-secondary: 'IBM Plex Sans', 'Inter', system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
/* Shadow Effects - Updated for new primary color */
|
||||
.shadow-elegant {
|
||||
box-shadow: 0 10px 30px -10px rgba(0, 136, 204, 0.2);
|
||||
}
|
||||
|
||||
.shadow-elegant-white {
|
||||
box-shadow: 0 10px 30px -10px rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.shadow-white {
|
||||
box-shadow: 0 10px 30px -10px rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
.elegant-shadow-card {
|
||||
box-shadow:
|
||||
0 2px 8px -2px rgba(0, 0, 0, 0.08),
|
||||
0 4px 10px 0px rgba(0, 136, 204,1);
|
||||
}
|
||||
|
||||
.shadow-premium {
|
||||
box-shadow: 0 20px 60px -15px rgba(0, 136, 204, 0.3);
|
||||
}
|
||||
|
||||
/* Glow Effects - Inspired by Möbius band's luminous edge */
|
||||
.glow-soft {
|
||||
box-shadow:
|
||||
0 0 10px rgba(0, 155, 221, 0.15),
|
||||
0 0 20px rgba(0, 155, 221, 0.1),
|
||||
0 4px 10px -4px rgba(0, 136, 204, 0.2);
|
||||
}
|
||||
|
||||
.glow-medium {
|
||||
box-shadow:
|
||||
0 0 15px rgba(0, 155, 221, 0.25),
|
||||
0 0 30px rgba(0, 155, 221, 0.15),
|
||||
0 5px 10px -5px rgba(0, 136, 204, 0.3);
|
||||
}
|
||||
|
||||
.glow-strong {
|
||||
box-shadow:
|
||||
0 0 30px rgba(0, 155, 221, 0.35),
|
||||
0 0 60px rgba(0, 155, 221, 0.2),
|
||||
0 0 90px rgba(0, 113, 168, 0.1),
|
||||
0 10px 10px -10px rgba(0, 136, 204, 0.4);
|
||||
}
|
||||
.icon-secondary-linear {
|
||||
background-color: hsl(var(--secondary) / 0.1);
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(var(--secondary)) 0%,
|
||||
hsl(var(--secondary-dark)) 100%
|
||||
);
|
||||
color: hsl(var(--secondary-foreground)) !important;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.text-section-title {
|
||||
line-height: 0.95em;
|
||||
}
|
||||
.variante-glass-flow {
|
||||
|
||||
& * {
|
||||
will-change: auto;
|
||||
} section,
|
||||
& .section-container {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(var(--background)) 0%,
|
||||
hsl(var(--background)/90%) 100%
|
||||
);
|
||||
position: relative;
|
||||
}
|
||||
& section.bg-accent {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(var(--accent) /0.5) 0%,
|
||||
hsl(var(--accent-dark) / 0.5) 100%
|
||||
);
|
||||
position: relative;
|
||||
}
|
||||
& section.bg-secondary {
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(var(--secondary)) 0%,
|
||||
hsl(var(--secondary-dark)) 100%
|
||||
);
|
||||
position: relative;
|
||||
}
|
||||
& div.bg-hero-container {
|
||||
border: 1px solid rgba(255, 255, 255, 0.9);
|
||||
|
||||
background: linear-gradient(
|
||||
135deg,
|
||||
hsl(var(--hero-container)) 0%,
|
||||
hsl(var(--hero-container-dark)) 100%
|
||||
);
|
||||
box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.1);
|
||||
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
/* Cards - Multi-Layer-Schatten für Tiefe (Optimiert) */
|
||||
& .card,
|
||||
& [class*="card"],
|
||||
& .bg-card,
|
||||
& article {
|
||||
background:
|
||||
linear-gradient(
|
||||
145deg,
|
||||
hsl(0 0% 100%) 0%,
|
||||
hsl(0 0% 99.5%) 40%,
|
||||
hsl(0 0% 99%) 100%
|
||||
);
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(0, 0, 0, 0.03),
|
||||
0 1px 1px rgba(0, 0, 0, 0.02),
|
||||
0 2px 3px rgba(0, 0, 0, 0.025),
|
||||
0 4px 6px rgba(0, 0, 0, 0.03),
|
||||
0 8px 12px rgba(0, 0, 0, 0.04),
|
||||
0 12px 20px rgba(0, 0, 0, 0.045),
|
||||
inset 0 1px 2px rgba(255, 255, 255, 0.8),
|
||||
inset 0 -1px 1px rgba(0, 0, 0, 0.02);
|
||||
border: 1px solid rgba(255, 255, 255, 0.9);
|
||||
transition:
|
||||
transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
|
||||
box-shadow 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
|
||||
filter 0.3s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
|
||||
& .card:hover,
|
||||
& [class*="card"]:hover,
|
||||
& article:hover {
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(0, 0, 0, 0.04),
|
||||
0 2px 4px rgba(0, 0, 0, 0.03),
|
||||
0 4px 8px rgba(0, 0, 0, 0.04),
|
||||
0 8px 16px rgba(0, 0, 0, 0.05),
|
||||
0 16px 24px rgba(0, 0, 0, 0.07),
|
||||
0 24px 40px rgba(0, 0, 0, 0.08),
|
||||
0 32px 64px rgba(0, 0, 0, 0.06),
|
||||
inset 0 1px 3px rgba(255, 255, 255, 0.9),
|
||||
inset 0 -1px 2px rgba(0, 0, 0, 0.03);
|
||||
transform: translateY(-2px) scale(1.005);
|
||||
filter: brightness(1.01);
|
||||
}
|
||||
|
||||
& button,
|
||||
& .btn,
|
||||
& .btn-secondary,
|
||||
& a[class*="btn"],
|
||||
& [role="button"] {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
isolation: isolate;
|
||||
box-shadow:
|
||||
0 1px 2px rgba(0, 0, 0, 0.05),
|
||||
0 2px 4px rgba(0, 0, 0, 0.06),
|
||||
0 4px 8px rgba(0, 0, 0, 0.07),
|
||||
0 8px 16px rgba(0, 0, 0, 0.05);
|
||||
transition:
|
||||
transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
|
||||
box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1),
|
||||
filter 0.2s ease;
|
||||
}
|
||||
|
||||
& button:hover,
|
||||
& .btn:hover,
|
||||
& .btn-secondary:hover,
|
||||
& a[class*="btn"]:hover,
|
||||
& [role="button"]:hover {
|
||||
box-shadow:
|
||||
0 2px 4px rgba(0, 0, 0, 0.06),
|
||||
0 4px 8px rgba(0, 0, 0, 0.08),
|
||||
0 8px 16px rgba(0, 0, 0, 0.1),
|
||||
0 16px 32px rgba(0, 0, 0, 0.08),
|
||||
0 0 40px hsla(199, 74%, 49%, 0.3);
|
||||
transform: translateY(-2px);
|
||||
filter: brightness(1.08);
|
||||
}
|
||||
|
||||
/* Scroll-Optimierung für sanftere Animationen */
|
||||
& {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
}
|
||||
|
||||
@import "./shared-styles.css";
|
||||
|
|
|
|||
|
|
@ -1 +1,162 @@
|
|||
// App JS ohne Alpine-Initialisierung. Alpine wird von Livewire verwaltet.
|
||||
// Premium Scroll Animations with Intersection Observer
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
// Warte bis DOM vollständig geladen ist
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', initAnimations);
|
||||
} else {
|
||||
initAnimations();
|
||||
}
|
||||
|
||||
function initAnimations() {
|
||||
// Intersection Observer Konfiguration
|
||||
const observerOptions = {
|
||||
threshold: 0.15,
|
||||
rootMargin: '0px 0px -80px 0px'
|
||||
};
|
||||
|
||||
// Erstelle Observer
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
// Füge is-visible Klasse mit kleinem Delay hinzu für sanfteren Effekt
|
||||
setTimeout(() => {
|
||||
entry.target.classList.add('is-visible');
|
||||
}, 50);
|
||||
|
||||
// Observer beenden nach Animation für bessere Performance
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}, observerOptions);
|
||||
|
||||
// Finde alle Elemente mit Animation-Klassen
|
||||
const animatedElements = document.querySelectorAll(
|
||||
'.scroll-animate, .fade-in, .slide-up, .slide-right, .slide-left, .scale-in'
|
||||
);
|
||||
|
||||
// Beobachte jedes Element
|
||||
animatedElements.forEach(el => {
|
||||
observer.observe(el);
|
||||
});
|
||||
|
||||
// Smooth Scroll für Anchor-Links
|
||||
document.addEventListener('click', function(e) {
|
||||
const target = e.target.closest('a[href^="#"]');
|
||||
if (target && target.hash) {
|
||||
const targetElement = document.querySelector(target.hash);
|
||||
|
||||
if (targetElement) {
|
||||
e.preventDefault();
|
||||
const headerOffset = 80;
|
||||
const elementPosition = targetElement.getBoundingClientRect().top;
|
||||
const offsetPosition = elementPosition + window.pageYOffset - headerOffset;
|
||||
|
||||
window.scrollTo({
|
||||
top: offsetPosition,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Scroll Progress Indicator
|
||||
initScrollProgress();
|
||||
|
||||
// Premium Sticky Header
|
||||
initStickyHeader();
|
||||
}
|
||||
|
||||
function initStickyHeader() {
|
||||
const header = document.getElementById('main-header');
|
||||
if (!header) return;
|
||||
|
||||
let lastScrollTop = 0;
|
||||
let scrollTimeout = null;
|
||||
|
||||
function handleHeaderScroll() {
|
||||
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
||||
|
||||
// Add/Remove scrolled class for enhanced shadow
|
||||
if (scrollTop > 50) {
|
||||
header.classList.add('scrolled');
|
||||
} else {
|
||||
header.classList.remove('scrolled');
|
||||
}
|
||||
|
||||
// Optional: Hide header on scroll down, show on scroll up
|
||||
// Uncomment if you want auto-hide behavior
|
||||
/*
|
||||
if (scrollTop > lastScrollTop && scrollTop > 100) {
|
||||
// Scrolling down
|
||||
header.classList.add('hide');
|
||||
} else {
|
||||
// Scrolling up
|
||||
header.classList.remove('hide');
|
||||
}
|
||||
*/
|
||||
|
||||
lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;
|
||||
}
|
||||
|
||||
// Listen to scroll with throttling
|
||||
let headerTicking = false;
|
||||
window.addEventListener('scroll', function() {
|
||||
if (!headerTicking) {
|
||||
window.requestAnimationFrame(function() {
|
||||
handleHeaderScroll();
|
||||
headerTicking = false;
|
||||
});
|
||||
headerTicking = true;
|
||||
}
|
||||
});
|
||||
|
||||
// Initial check
|
||||
handleHeaderScroll();
|
||||
}
|
||||
|
||||
function initScrollProgress() {
|
||||
// Erstelle Progress Bar Element
|
||||
const progressBar = document.createElement('div');
|
||||
progressBar.className = 'scroll-progress-bar';
|
||||
document.body.appendChild(progressBar);
|
||||
|
||||
// Update Progress on Scroll
|
||||
function updateProgress() {
|
||||
const windowHeight = window.innerHeight;
|
||||
const documentHeight = document.documentElement.scrollHeight;
|
||||
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
||||
|
||||
// Berechne Progress (0-100%)
|
||||
const scrollPercentage = (scrollTop / (documentHeight - windowHeight)) * 100;
|
||||
|
||||
// Update Bar Width
|
||||
progressBar.style.width = `${Math.min(scrollPercentage, 100)}%`;
|
||||
|
||||
// Optional: Show/Hide basierend auf Scroll-Position
|
||||
if (scrollTop > 100) {
|
||||
progressBar.classList.add('visible');
|
||||
} else {
|
||||
progressBar.classList.remove('visible');
|
||||
}
|
||||
}
|
||||
|
||||
// Listen to scroll events mit Throttling für Performance
|
||||
let ticking = false;
|
||||
window.addEventListener('scroll', function() {
|
||||
if (!ticking) {
|
||||
window.requestAnimationFrame(function() {
|
||||
updateProgress();
|
||||
ticking = false;
|
||||
});
|
||||
ticking = true;
|
||||
}
|
||||
});
|
||||
|
||||
// Initial update
|
||||
updateProgress();
|
||||
}
|
||||
})();
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,146 @@
|
|||
<section class="section-padding {{ $bg }}" id="{{ $content['id'] }}">
|
||||
<div class="container-padding">
|
||||
@if(isset($content['title']))
|
||||
<div class="text-center mb-16">
|
||||
<h2 class="text-section-title text-foreground mb-6">
|
||||
{{ $content['title'] }}
|
||||
</h2>
|
||||
<p class="text-large text-muted-foreground max-w-3xl mx-auto">
|
||||
{{ $content['subtitle'] }}
|
||||
</p>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="grid lg:grid-cols-12 gap-16">
|
||||
@if ($layout === 'right')
|
||||
{{-- Layout Right: Bild zuerst, dann Text --}}
|
||||
{{-- Bild --}}
|
||||
<div class="space-y-8 col-span-8 lg:col-span-4 order-2 lg:order-1">
|
||||
<div class="relative h-full">
|
||||
<div class="sticky top-8">
|
||||
<div class="relative rounded-3xl overflow-hidden shadow-elevated slide-right delay-300">
|
||||
@if(isset($content['image']))
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] ?? 'Benefits Image' }}"
|
||||
class="w-full h-[400px] md:h-[500px] lg:h-[600px] object-cover" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent"></div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="bg-secondary/5 rounded-xl p-6 mt-6">
|
||||
<div class="text-center">
|
||||
<div class="text-3xl font-bold text-secondary mb-2">{{ $content['highlight']['value'] }}</div>
|
||||
<p class="text-sm text-muted-foreground">
|
||||
{{ $content['highlight']['text'] }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Text --}}
|
||||
<div class="space-y-8 col-span-8 order-1 lg:order-2">
|
||||
<div class="text-center lg:text-left slide-left delay-400">
|
||||
<div
|
||||
class="inline-flex items-center gap-2 bg-secondary/10 text-secondary px-4 py-2 rounded-full text-md font-medium mb-6">
|
||||
@svg('heroicon-o-'.$content['tag_icon'], 'w-4 h-4')
|
||||
{{ $content['tag'] }}
|
||||
</div>
|
||||
<h3 class="text-3xl font-light text-foreground mb-6">
|
||||
{!! $content['tag_title'] !!}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6">
|
||||
@foreach ($content['features'] as $index => $feature)
|
||||
<div class="card-elevated p-6 rounded-xl slide-left delay-{{ 500 + ($index * 100) }}">
|
||||
<div class="flex gap-4">
|
||||
<div
|
||||
class="flex-shrink-0 w-12 h-12 rounded-xl bg-secondary/10 flex items-center justify-center">
|
||||
@if (isset($feature['icon']))
|
||||
@svg('heroicon-o-'.$feature['icon'], 'w-6 h-6 text-secondary')
|
||||
|
||||
@endif
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-lg font-semibold text-foreground mb-2">
|
||||
{{ $feature['title'] }}
|
||||
</h4>
|
||||
<p class="text-muted-foreground">
|
||||
{{ $feature['description'] }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
{{-- Layout Left (Standard): Text zuerst, dann Bild --}}
|
||||
{{-- Text --}}
|
||||
<div class="space-y-8 col-span-8 order-1 lg:order-1">
|
||||
<div class="text-center lg:text-left slide-right delay-300">
|
||||
<div
|
||||
class="inline-flex items-center gap-2 bg-secondary/10 text-secondary px-4 py-2 rounded-full text-md font-medium mb-6">
|
||||
@svg('heroicon-o-'.$content['tag_icon'], 'w-4 h-4')
|
||||
{{ $content['tag'] }}
|
||||
</div>
|
||||
<h3 class="text-3xl font-light text-foreground mb-6">
|
||||
{!! $content['tag_title'] !!}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6">
|
||||
@foreach ($content['features'] as $index => $feature)
|
||||
<div class="card-elevated p-6 rounded-xl slide-right delay-{{ 400 + ($index * 100) }}">
|
||||
<div class="flex gap-4">
|
||||
<div
|
||||
class="flex-shrink-0 w-12 h-12 rounded-xl bg-secondary/10 flex items-center justify-center">
|
||||
@if (isset($feature['icon']))
|
||||
@svg('heroicon-o-'.$feature['icon'], 'w-6 h-6 text-secondary')
|
||||
|
||||
@endif
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-lg font-semibold text-foreground mb-2">
|
||||
{{ $feature['title'] }}
|
||||
</h4>
|
||||
<p class="text-muted-foreground">
|
||||
{{ $feature['description'] }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Bild --}}
|
||||
<div class="space-y-8 col-span-8 lg:col-span-4 order-2 lg:order-2">
|
||||
<div class="relative h-full">
|
||||
<div class="sticky top-8">
|
||||
<div class="relative rounded-3xl overflow-hidden shadow-elevated slide-left delay-300">
|
||||
@if(isset($content['image']))
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] ?? 'Benefits Image' }}"
|
||||
class="w-full h-[400px] md:h-[500px] lg:h-[600px] object-cover" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent"></div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="bg-secondary/5 rounded-xl p-6 mt-6">
|
||||
<div class="text-center">
|
||||
<div class="text-3xl font-bold text-secondary mb-2">{{ $content['highlight']['value'] }}</div>
|
||||
<p class="text-sm text-muted-foreground">
|
||||
{{ $content['highlight']['text'] }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1,27 +1,33 @@
|
|||
<section class="section-padding {{ $bg }}">
|
||||
<div class="container-padding">
|
||||
{{-- Section Title --}}
|
||||
<div class="text-center mb-16">
|
||||
<h2 class="text-section-title">{{ $title }}</h2>
|
||||
<p class="text-large text-muted-foreground mt-4 max-w-2xl mx-auto">
|
||||
{{ $subtitle }}
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title">{!! $title !!}</h2>
|
||||
<p class="text-large text-muted-foreground mt-4 max-w-3xl mx-auto">
|
||||
{!! $subtitle !!}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{{-- Brand Cards --}}
|
||||
<div class="grid md:grid-cols-3 gap-8">
|
||||
@foreach ($worlds as $world)
|
||||
<div class="card-elevated overflow-hidden group hover:shadow-elevated transition-all duration-300">
|
||||
<div class="card-elevated overflow-hidden group hover:shadow-elevated transition-all duration-300 flex flex-col slide-up delay-500">
|
||||
<div class="relative">
|
||||
<img src="{{ asset('img/assets/' . $world['image']) }}" alt="{{ $world['title'] }}"
|
||||
class="w-full h-64 object-cover group-hover:scale-105 transition-transform duration-500" />
|
||||
</div>
|
||||
|
||||
<div class="p-6 spacing-small">
|
||||
<h3 class="text-xl font-medium">{{ $world['title'] }}</h3>
|
||||
<p class="text-muted-foreground leading-relaxed">
|
||||
{{ $world['description'] }}
|
||||
</p>
|
||||
<div class="p-6 spacing-small flex flex-col justify-between flex-grow">
|
||||
<div class="mb-4">
|
||||
@if (isset($world['logo']))
|
||||
<img src="{{ asset($world['logo']) }}" alt="{{ $world['title'] }}"
|
||||
class="{{ $world['logo_width'] }} h-18 object-contain" />
|
||||
@else
|
||||
<h3 class="text-xl font-medium">{{ $world['title'] }}</h3>
|
||||
@endif
|
||||
<p class="text-muted-foreground leading-relaxed mt-2">
|
||||
{{ $world['description'] }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<a href="{{ $world['link'] }}"
|
||||
class="inline-flex items-center gap-2 text-secondary font-medium hover:gap-3 transition-all duration-300">
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
<section class="{{ $bg }} text-secondary-foreground section-padding">
|
||||
<div class="container-narrow text-center">
|
||||
<div class="spacing-section">
|
||||
<h2 class="text-section-title text-white">
|
||||
<h2 class="text-section-title text-white slide-up delay-300">
|
||||
{!! $content['title'] !!}
|
||||
</h2>
|
||||
|
||||
<p class="text-large text-secondary-foreground max-w-2xl mx-auto leading-relaxed">
|
||||
<p class="text-large text-secondary-foreground max-w-2xl mx-auto leading-relaxed slide-up delay-300">
|
||||
{{ $content['subtitle'] }}
|
||||
</p>
|
||||
|
||||
<div class="pt-4">
|
||||
<div class="pt-4 slide-up delay-500">
|
||||
<a
|
||||
href="{{ $content['button_link'] }}"
|
||||
class="btn-primary-accent px-8 py-4 text-lg"
|
||||
|
|
|
|||
|
|
@ -0,0 +1,69 @@
|
|||
<section class="section-padding {{ $bg }}">
|
||||
<div class="container-padding">
|
||||
{{-- Section Title --}}
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title">{!! $content['title'] !!}</h2>
|
||||
<p class="text-large text-muted-foreground mt-4 max-w-3xl mx-auto">
|
||||
{!! $content['subtitle'] !!}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{{-- Brand Cards --}}
|
||||
<div class="grid md:grid-cols-3 gap-8">
|
||||
@foreach ($content['cards'] as $index => $card)
|
||||
<div class="card-elevated overflow-hidden group hover:shadow-elevated transition-all duration-300 flex flex-col slide-up delay-{{ $index * 200 }}">
|
||||
|
||||
@if(isset($card['image']))
|
||||
<div class="relative">
|
||||
<img src="{{ asset('img/assets/' . $card['image']) }}" alt="{{ $card['title'] }}"
|
||||
class="w-full h-64 object-cover group-hover:scale-105 transition-transform duration-500" />
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if(isset($card['icon']))
|
||||
<div class="relative pt-12 pb-8">
|
||||
<div class="mx-auto w-20 h-20 icon-secondary-linear glow-soft group-hover:glow-medium rounded-2xl flex items-center justify-center transition-colors duration-300">
|
||||
@svg('heroicon-o-'.$card['icon'], 'w-10 h-10 text-secondary-foreground')
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="p-6 spacing-small flex flex-col justify-between flex-grow">
|
||||
<div class="mb-4">
|
||||
@if (isset($card['logo']))
|
||||
<img src="{{ asset($card['logo']) }}" alt="{{ $card['title'] }}"
|
||||
class="{{ $card['logo_width'] }} h-18 object-contain" />
|
||||
@endif
|
||||
@if(isset($card['title']))
|
||||
<h3 class="text-xl font-medium text-center">{{ $card['title'] }}</h3>
|
||||
@endif
|
||||
@if(isset($card['description']))
|
||||
<p class="text-muted-foreground leading-relaxed mt-2 text-center">
|
||||
{{ $card['description'] }}
|
||||
</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@if(isset($card['button']))
|
||||
<div class="flex flex-col sm:flex-row gap-4 slide-right delay-300 mx-auto pt-4">
|
||||
<a href="{{ $card['button'] }}" class="btn-primary-accent">
|
||||
{{ $card['button_text'] }}
|
||||
</a>
|
||||
</div>
|
||||
@endif
|
||||
@if(isset($card['link']))
|
||||
<a href="{{ $card['link'] }}"
|
||||
class="inline-flex items-center gap-2 text-secondary font-medium hover:gap-3 transition-all duration-300">
|
||||
Mehr erfahren
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7">
|
||||
</path>
|
||||
</svg>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
<section class="section-padding text-center">
|
||||
<div class="container-padding">
|
||||
<div class="text-center mb-16">
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title text-foreground mb-6">
|
||||
{!! $content['title'] !!}
|
||||
</h2>
|
||||
|
|
@ -10,8 +10,8 @@
|
|||
</div>
|
||||
|
||||
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
@foreach($content['testimonials'] as $testimonial)
|
||||
<div class="card-elevated rounded-2xl p-8 text-left space-y-6">
|
||||
@foreach($content['testimonials'] as $index => $testimonial)
|
||||
<div class="card-elevated rounded-2xl p-8 text-left space-y-6 slide-up delay-{{ $index * 200 }}">
|
||||
<div class="flex items-center gap-4">
|
||||
<img src="{{ asset('img/assets/' . $testimonial['image']) }}" alt="{{ $testimonial['author'] }}" class="w-16 h-16 rounded-full object-cover">
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -2,40 +2,54 @@
|
|||
<div class="container-padding">
|
||||
<div class="grid lg:grid-cols-2 gap-12 lg:gap-16 items-center">
|
||||
|
||||
@if($layout === 'right')
|
||||
@if ($layout === 'right')
|
||||
{{-- Layout Right: Image zuerst, dann Content --}}
|
||||
{{-- Image --}}
|
||||
<div class="relative lg:order-1">
|
||||
<div class="card-elevated rounded-3xl overflow-hidden">
|
||||
<img
|
||||
src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-[500px] object-cover"
|
||||
/>
|
||||
<div class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50">{{ $content['image_caption'] }}</div>
|
||||
<div class="card-elevated rounded-3xl overflow-hidden slide-left delay-400">
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}" alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-[500px] object-cover" />
|
||||
<div
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50 slide-left delay-500">
|
||||
{{ $content['image_caption'] }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Content --}}
|
||||
<div class="spacing-section lg:order-2">
|
||||
<div class="spacing-content">
|
||||
<h2 class="text-section-title">{{ $content['title'] }}</h2>
|
||||
<div class="spacing-content slide-right delay-300">
|
||||
<h2 class="text-section-title">{!! $content['title'] !!}</h2>
|
||||
<div class="spacing-small text-large text-muted-foreground leading-relaxed">
|
||||
@foreach($content['paragraphs'] as $paragraph)
|
||||
<p>{{ $paragraph }}</p>
|
||||
@foreach ($content['paragraphs'] as $paragraph)
|
||||
<p>{!! $paragraph !!}</p>
|
||||
@endforeach
|
||||
</div>
|
||||
@if(isset($content['list']))
|
||||
<div class="grid grid-cols-1 gap-6 border-t border-border/50 pt-8">
|
||||
@foreach ($content['list'] as $index => $item)
|
||||
<div class="flex gap-4 slide-up delay-{{ $index * 200 }} mb-4">
|
||||
<div class="flex-shrink-0 w-12 h-12 rounded-full bg-secondary/10 flex items-center justify-center">
|
||||
@svg('heroicon-o-'.$item['icon'], 'w-6 h-6 text-secondary')
|
||||
</div>
|
||||
<div>
|
||||
<p class="font-semibold text-muted-foreground">{{ $item['title'] }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
{{-- Layout Left (Standard): Content zuerst, dann Image --}}
|
||||
{{-- Content --}}
|
||||
<div class="spacing-section">
|
||||
<div class="spacing-content">
|
||||
<h2 class="text-section-title">{{ $content['title'] }}</h2>
|
||||
<div class="spacing-content slide-right delay-300">
|
||||
<h2 class="text-section-title">{!! $content['title'] !!}</h2>
|
||||
<div class="spacing-small text-large text-muted-foreground leading-relaxed">
|
||||
@foreach($content['paragraphs'] as $paragraph)
|
||||
<p>{{ $paragraph }}</p>
|
||||
@foreach ($content['paragraphs'] as $paragraph)
|
||||
<p>{!! $paragraph !!}</p>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -43,13 +57,12 @@
|
|||
|
||||
{{-- Image --}}
|
||||
<div class="relative">
|
||||
<div class="card-elevated rounded-3xl overflow-hidden">
|
||||
<img
|
||||
src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-[500px] object-cover"
|
||||
/>
|
||||
<div class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50">{{ $content['image_caption'] }}</div>
|
||||
<div class="card-elevated rounded-3xl overflow-hidden slide-left delay-400">
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}" alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-full object-cover" />
|
||||
<div
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50 slide-left delay-500">
|
||||
{{ $content['image_caption'] }}</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<section class="section-padding bg-background">
|
||||
<div class="container-padding">
|
||||
<div class="text-center mb-16">
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title mb-6">
|
||||
{!! $content['title'] !!}
|
||||
</h2>
|
||||
|
|
@ -12,29 +12,11 @@
|
|||
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
@foreach($content['features'] as $index => $feature)
|
||||
<div class="group {{ $index === 4 ? 'md:col-span-2 lg:col-span-1 lg:col-start-2' : '' }}">
|
||||
<div class="card-elevated p-8 rounded-3xl h-full hover:scale-105 transition-all duration-300 relative overflow-hidden">
|
||||
<div class="card-elevated p-8 overflow-hidden group hover:shadow-elevated transition-all duration-300 flex flex-col slide-up delay-{{ $index * 200 }}">
|
||||
<div class="text-center space-y-6">
|
||||
<div class="w-16 h-16 mx-auto rounded-xl bg-secondary/10 flex items-center justify-center mb-6">
|
||||
@if($feature['icon'] === 'cloud')
|
||||
<svg class="w-8 h-8 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
|
||||
</svg>
|
||||
@elseif($feature['icon'] === 'shield')
|
||||
<svg class="w-8 h-8 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/>
|
||||
</svg>
|
||||
@elseif($feature['icon'] === 'layers')
|
||||
<svg class="w-8 h-8 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/>
|
||||
</svg>
|
||||
@elseif($feature['icon'] === 'database')
|
||||
<svg class="w-8 h-8 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"/>
|
||||
</svg>
|
||||
@else
|
||||
<svg class="w-8 h-8 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z"/>
|
||||
</svg>
|
||||
<div class="mx-auto w-16 h-16 icon-secondary-linear glow-soft group-hover:glow-medium rounded-2xl flex items-center justify-center transition-colors duration-300">
|
||||
@if($feature['icon'])
|
||||
@svg('heroicon-o-'.$feature['icon'], 'w-8 h-8 text-secondary-foreground')
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,54 +1,56 @@
|
|||
{{-- Hero Icons Helper Function --}}
|
||||
@php
|
||||
function renderHeroIcon($iconName, $style = 'outline') {
|
||||
$iconPath = public_path("heroicons/optimized/24/{$style}/{$iconName}.svg");
|
||||
$fallbackPath = public_path("heroicons/optimized/24/outline/sparkles.svg");
|
||||
function renderHeroIcon($iconName, $style = 'outline', $color = 'text-secondary')
|
||||
{
|
||||
$iconPath = public_path("heroicons/optimized/24/{$style}/{$iconName}.svg");
|
||||
$fallbackPath = public_path('heroicons/optimized/24/outline/sparkles.svg');
|
||||
|
||||
if (file_exists($iconPath)) {
|
||||
$svg = file_get_contents($iconPath);
|
||||
// Add classes for styling
|
||||
return str_replace('<svg', '<svg class="w-10 h-10 text-secondary"', $svg);
|
||||
} elseif (file_exists($fallbackPath)) {
|
||||
$svg = file_get_contents($fallbackPath);
|
||||
return str_replace('<svg', '<svg class="w-10 h-10 text-secondary"', $svg);
|
||||
}
|
||||
if (file_exists($iconPath)) {
|
||||
$svg = file_get_contents($iconPath);
|
||||
// Add classes for styling
|
||||
return str_replace('<svg', '<svg class="w-10 h-10 ' . $color . '"', $svg);
|
||||
} elseif (file_exists($fallbackPath)) {
|
||||
$svg = file_get_contents($fallbackPath);
|
||||
return str_replace('<svg', '<svg class="w-10 h-10 ' . $color . '"', $svg);
|
||||
}
|
||||
|
||||
// Ultimate fallback - simple star icon
|
||||
return '<svg class="w-10 h-10 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
// Ultimate fallback - simple star icon
|
||||
return '<svg class="w-10 h-10 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M11.48 3.499a.562.562 0 011.04 0l2.125 5.111a.563.563 0 00.475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 00-.182.557l1.285 5.385a.562.562 0 01-.84.61l-4.725-2.885a.563.563 0 00-.586 0L6.982 20.54a.562.562 0 01-.84-.61l1.285-5.386a.563.563 0 00-.182-.557l-4.204-3.602a.563.563 0 01.321-.988l5.518-.442a.563.563 0 00.475-.345L11.48 3.5z"/>
|
||||
</svg>';
|
||||
}
|
||||
}
|
||||
@endphp
|
||||
|
||||
<section class="section-padding {{ $bg }}">
|
||||
<div class="container-padding">
|
||||
{{-- Section Title --}}
|
||||
<div class="text-center mb-16">
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title">{{ $content['title'] }}</h2>
|
||||
@if(isset($content['subtitle']))
|
||||
<p class="text-large text-muted-foreground mt-4 max-w-2xl mx-auto">
|
||||
{{ $content['subtitle'] }}
|
||||
</p>
|
||||
@if (isset($content['subtitle']))
|
||||
<p class="text-large text-muted-foreground mt-4 max-w-2xl mx-auto">
|
||||
{{ $content['subtitle'] }}
|
||||
</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{-- Pillars Grid --}}
|
||||
<div class="grid md:grid-cols-3 gap-8 lg:gap-12">
|
||||
@foreach($content['pillars'] as $index => $pillar)
|
||||
<div class="card-elevated rounded-2xl p-8 text-center">
|
||||
<div class="text-center spacing-content group">
|
||||
<div class="mx-auto w-20 h-20 bg-secondary/10 rounded-2xl flex items-center justify-center group-hover:bg-secondary/20 transition-colors duration-300">
|
||||
{!! renderHeroIcon($pillar['icon'], $pillar['icon_style'] ?? 'outline') !!}
|
||||
</div>
|
||||
<div class="grid md:grid-cols-3 gap-8 lg:gap-12 slide-up delay-400">
|
||||
@foreach ($content['pillars'] as $index => $pillar)
|
||||
<div class="card-elevated rounded-2xl p-8 text-center">
|
||||
<div class="text-center spacing-content group">
|
||||
<div
|
||||
class="mx-auto w-20 h-20 icon-secondary-linear glow-soft group-hover:glow-medium rounded-2xl flex items-center justify-center transition-colors duration-300">
|
||||
{!! renderHeroIcon($pillar['icon'], $pillar['icon_style'] ?? 'outline', 'text-secondary-foreground') !!}
|
||||
</div>
|
||||
|
||||
<div class="spacing-small">
|
||||
<h3 class="text-xl font-medium">{{ $pillar['title'] }}</h3>
|
||||
<p class="text-muted-foreground leading-relaxed">
|
||||
{{ $pillar['description'] }}
|
||||
</p>
|
||||
<div class="spacing-small">
|
||||
<h3 class="text-xl font-medium">{{ $pillar['title'] }}</h3>
|
||||
<p class="text-muted-foreground leading-relaxed">
|
||||
{!! $pillar['description'] !!}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<section class="section-padding flex items-center relative overflow-hidden">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 bg-[hsl(var(--hero-container))] rounded-[20px] w-[95%]">
|
||||
<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">
|
||||
<h1 class="text-hero">
|
||||
|
|
|
|||
|
|
@ -1,26 +1,25 @@
|
|||
<section class="section-padding bg-background">
|
||||
<div class="container-padding">
|
||||
<div class="text-center mb-16">
|
||||
<h2 class="text-section-title mb-6">
|
||||
{!! $content['title'] !!}
|
||||
</h2>
|
||||
<p class="text-large text-muted-foreground max-w-3xl mx-auto">
|
||||
{{ $content['subtitle'] }}
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title">{!! $content['title'] !!}</h2>
|
||||
<p class="text-large text-muted-foreground mt-4 max-w-3xl mx-auto">
|
||||
{!! $content['subtitle'] !!}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
|
||||
@foreach ($content['stats'] as $stat)
|
||||
<div class="card-elevated rounded-2xl p-8 text-center">
|
||||
<h2 class="text-4xl lg:text-5xl font-bold text-secondary mb-4">
|
||||
{{ $stat['number'] }}
|
||||
</h2>
|
||||
<h3 class="text-xl lg:text-2xl font-semibold text-foreground mb-3">
|
||||
{{ $stat['label'] }}
|
||||
</h3>
|
||||
<p class="text-md text-muted-foreground leading-relaxed">
|
||||
{{ $stat['description'] }}
|
||||
</p>
|
||||
@foreach ($content['stats'] as $index => $stat)
|
||||
|
||||
<div class="card-elevated p-8 text-center overflow-hidden group hover:shadow-elevated transition-all duration-300 flex flex-col slide-up delay-{{ $index * 200 }}">
|
||||
<h2 class="text-4xl lg:text-5xl font-bold text-secondary mb-4">
|
||||
{{ $stat['number'] }}
|
||||
</h2>
|
||||
<h3 class="text-xl lg:text-2xl font-semibold text-foreground mb-3">
|
||||
{{ $stat['label'] }}
|
||||
</h3>
|
||||
<p class="text-md text-muted-foreground leading-relaxed">
|
||||
{{ $stat['description'] }}
|
||||
</p>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<section class="section-padding flex items-center relative">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 card-elevated rounded-[20px] w-[95%]">
|
||||
<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-12 lg:gap-16 items-center">
|
||||
{{-- Left Content --}}
|
||||
<div class="space-y-8">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<section class="section-padding flex items-center relative">
|
||||
<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-12 lg:gap-16 items-center">
|
||||
{{-- Left Content --}}
|
||||
<div class="space-y-8">
|
||||
<div class="space-y-6">
|
||||
<div class="space-y-6 slide-right delay-200">
|
||||
<h1 class="text-hero">
|
||||
{!! $content['title'] !!}
|
||||
</h1>
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col sm:flex-row gap-4">
|
||||
<div class="flex flex-col sm:flex-row gap-4 slide-right delay-300">
|
||||
<a href="{{ $content['cta1_link'] }}" class="btn-primary-accent">
|
||||
{{ $content['cta1_text'] }}
|
||||
</a>
|
||||
|
|
@ -21,30 +21,31 @@
|
|||
</a>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center space-x-8 text-sm text-muted-foreground">
|
||||
<div class="flex flex-wrap items-center gap-6 pt-10 border-t border-border/80 slide-right delay-300">
|
||||
@foreach ($content['stats'] as $stat)
|
||||
<span>{{ $stat }}</span>
|
||||
@if (!$loop->last)
|
||||
<span>•</span>
|
||||
@endif
|
||||
<div class="flex items-center gap-2 text-md text-muted-foreground">
|
||||
@svg('heroicon-o-check-circle', 'w-6 h-6 text-secondary')
|
||||
<span>{{ $stat }}</span>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{{-- Right Image --}}
|
||||
<div class="relative">
|
||||
<div class="relative rounded-3xl overflow-hidden shadow-elevated">
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] }}"
|
||||
<div class="relative rounded-3xl overflow-hidden shadow-elevated slide-left delay-300">
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}" alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-[600px] object-cover" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
{{-- Floating info card --}}
|
||||
<div
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50">
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50 slide-left delay-400">
|
||||
<div class="text-sm text-muted-foreground">{{ $content['card_title'] }}</div>
|
||||
<div class="text-2xl font-medium">{!! $content['card_text'] !!}
|
||||
<div class="text-lg font-medium font-secondary">{!! $content['card_text'] !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
<section class="{{ $bg }} text-secondary-foreground section-padding">
|
||||
<div class="container-narrow text-center">
|
||||
<div class="spacing-section">
|
||||
<h2 class="text-section-title text-white">
|
||||
<h2 class="text-section-title text-white slide-up delay-300">
|
||||
{!! $content['title'] !!}
|
||||
</h2>
|
||||
|
||||
|
||||
<p class="text-large text-secondary-foreground max-w-2xl mx-auto leading-relaxed">
|
||||
<p class="text-large text-secondary-foreground max-w-2xl mx-auto leading-relaxed slide-up delay-300">
|
||||
{{ $content['subtitle'] }}
|
||||
</p>
|
||||
|
||||
<div class="grid md:grid-cols-3 gap-8 py-8">
|
||||
<div class="grid md:grid-cols-3 gap-8 py-8 slide-up delay-400">
|
||||
@foreach($content['stats'] as $stat)
|
||||
<div class="text-center space-y-3">
|
||||
<div class="text-4xl font-light text-secondary-foreground">{{ $stat['number'] }}</div>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
@endforeach
|
||||
</div>
|
||||
|
||||
<div class="spacing-content">
|
||||
<div class="spacing-content slide-up delay-500">
|
||||
<a href="{{ $content['button_link'] }}" class="btn-primary-accent">
|
||||
{{ $content['button_text'] }}
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -1,57 +1,37 @@
|
|||
<section class="section-padding flex items-center relative overflow-hidden">
|
||||
<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">
|
||||
<h1 class="text-hero">
|
||||
<div class="slide-right delay-300">
|
||||
<h1 class="text-hero mb-6">
|
||||
{!! $content['title'] !!}
|
||||
</h1>
|
||||
|
||||
<p class="text-lg text-muted-foreground max-w-md leading-relaxed">
|
||||
{{ $content['subtitle'] }}
|
||||
</p>
|
||||
|
||||
<div class="grid grid-cols-2 gap-6">
|
||||
@foreach ($content['partner_types'] as $partner)
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-12 h-12 rounded-full bg-secondary/10 flex items-center justify-center">
|
||||
@if ($partner['icon'] === 'trending-up')
|
||||
<svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" />
|
||||
</svg>
|
||||
@elseif($partner['icon'] === 'globe')
|
||||
<svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
@elseif($partner['icon'] === 'handshake')
|
||||
<svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M7 12l3-3 3 3 4-4M8 21l4-4 4 4M3 4h18M4 4h16v12a1 1 0 01-1 1H5a1 1 0 01-1-1V4z" />
|
||||
</svg>
|
||||
@else
|
||||
<svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z" />
|
||||
</svg>
|
||||
@endif
|
||||
</div>
|
||||
@if(isset($content['partner_types']))
|
||||
<div class="grid grid-cols-2 gap-6 mt-8 border-t border-border/50 pt-8">
|
||||
@foreach ($content['partner_types'] as $index => $partner)
|
||||
<div class="flex gap-4 slide-up delay-{{ $index * 200 }}">
|
||||
<div class="flex-shrink-0 w-12 h-12 rounded-full bg-secondary/10 flex items-center justify-center">
|
||||
@svg('heroicon-o-'.$partner['icon'], 'w-6 h-6 text-secondary')
|
||||
</div>
|
||||
<div>
|
||||
<p class="font-semibold text-foreground">{{ $partner['title'] }}</p>
|
||||
<p class="text-sm text-muted-foreground">{{ $partner['description'] }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<div class="relative">
|
||||
<div class="relative rounded-3xl overflow-hidden shadow-elevated">
|
||||
<div class="relative rounded-3xl overflow-hidden shadow-elevated slide-left delay-300">
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-[600px] object-cover" />
|
||||
|
|
@ -60,16 +40,8 @@
|
|||
|
||||
{{-- Floating info card --}}
|
||||
<div
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50">
|
||||
<div class="text-center">
|
||||
<div
|
||||
class="w-24 h-24 mx-auto rounded-full bg-secondary flex items-center justify-center mb-4">
|
||||
<svg class="w-12 h-12 text-white" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M7 12l3-3 3 3 4-4M8 21l4-4 4 4M3 4h18M4 4h16v12a1 1 0 01-1 1H5a1 1 0 01-1-1V4z" />
|
||||
</svg>
|
||||
</div>
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50 slide-left delay-400">
|
||||
<div class="text-center slide-left delay-400">
|
||||
<h3 class="text-xl font-semibold text-foreground">{{ $content['hub']['title'] }}</h3>
|
||||
<p class="text-sm text-muted-foreground">{{ $content['hub']['subtitle'] }}</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<section class="section-padding bg-accent">
|
||||
<div class="container-padding">
|
||||
<div class="text-center mb-16">
|
||||
<div class="text-center mb-16 slide-up delay-300">
|
||||
<h2 class="text-section-title text-foreground mb-6">
|
||||
{!! $content['title'] !!}
|
||||
</h2>
|
||||
|
|
@ -11,44 +11,19 @@
|
|||
|
||||
<div class="grid md:grid-cols-3 gap-8 mb-16">
|
||||
@foreach ($content['steps'] as $index => $step)
|
||||
<div class="card-elevated p-0 overflow-hidden group hover:shadow-elevated transition-all duration-300">
|
||||
<div class="relative overflow-hidden">
|
||||
<img src="{{ asset('img/assets/' . $step['image']) }}" alt="{{ $step['title'] }}"
|
||||
class="w-full h-64 object-cover group-hover:scale-105 transition-transform duration-300" />
|
||||
<div
|
||||
class="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300">
|
||||
<div class="card-elevated p-0 overflow-hidden group hover:shadow-elevated transition-all duration-300 slide-up delay-{{ $index * 200 }}">
|
||||
@if(isset($step['icon']))
|
||||
<div class="relative pt-12 pb-8">
|
||||
<div class="mx-auto w-20 h-20 icon-secondary-linear glow-soft group-hover:glow-medium rounded-2xl flex items-center justify-center transition-colors duration-300">
|
||||
@svg('heroicon-o-'.$step['icon'], 'w-10 h-10 text-secondary-foreground')
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Step Number Badge --}}
|
||||
<div
|
||||
class="absolute top-4 left-4 w-12 h-12 rounded-full bg-secondary text-white flex items-center justify-center font-bold text-lg">
|
||||
{{ $step['step'] }}
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="p-8">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-10 h-10 rounded-lg bg-secondary/10 flex items-center justify-center">
|
||||
@if ($step['icon'] === 'file-text')
|
||||
<svg class="w-5 h-5 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z">
|
||||
</path>
|
||||
</svg>
|
||||
@elseif($step['icon'] === 'search')
|
||||
<svg class="w-5 h-5 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
||||
</svg>
|
||||
@else
|
||||
<svg class="w-5 h-5 text-secondary" fill="none" stroke="currentColor"
|
||||
viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
||||
</svg>
|
||||
@endif
|
||||
<span class="text-lg font-bold text-secondary">{{ $index + 1 }}</span>
|
||||
</div>
|
||||
<h3 class="text-2xl font-medium text-foreground">
|
||||
{{ $step['title'] }}
|
||||
|
|
@ -60,9 +35,9 @@
|
|||
</p>
|
||||
|
||||
@if ($index === count($content['steps']) - 1)
|
||||
<a href="/contact">
|
||||
<button class="btn-secondary-accent w-full">
|
||||
Jetzt starten
|
||||
<a href="{{ $content['cta']['button_link'] }}">
|
||||
<button class="btn-secondary-accent w-full cursor-pointer">
|
||||
{{ $content['cta']['button_text'] }}
|
||||
</button>
|
||||
</a>
|
||||
@endif
|
||||
|
|
@ -70,22 +45,5 @@
|
|||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
{{-- CTA Section --}}
|
||||
<div class="text-center">
|
||||
<div class="card-elevated p-12 rounded-3xl bg-gradient-to-br from-secondary/10 to-secondary/5">
|
||||
<h3 class="text-3xl font-light text-foreground mb-6">
|
||||
{!! $content['cta']['title'] !!}
|
||||
</h3>
|
||||
<p class="text-large text-muted-foreground mb-8 max-w-2xl mx-auto">
|
||||
{{ $content['cta']['subtitle'] }}
|
||||
</p>
|
||||
<a href="{{ $content['cta']['button_link'] }}">
|
||||
<button class="btn-primary-accent">
|
||||
{{ $content['cta']['button_text'] }}
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -3,11 +3,11 @@
|
|||
<div class="grid lg:grid-cols-2 gap-12 lg:gap-16 items-center">
|
||||
{{-- Content --}}
|
||||
<div class="spacing-section">
|
||||
<div class="spacing-content">
|
||||
<div class="spacing-content slide-right delay-300">
|
||||
<h2 class="text-section-title">{{ $content['title'] }}</h2>
|
||||
<div class="spacing-small text-large text-muted-foreground leading-relaxed">
|
||||
@foreach($content['paragraphs'] as $paragraph)
|
||||
<p>{{ $paragraph }}</p>
|
||||
@foreach ($content['paragraphs'] as $paragraph)
|
||||
<p>{!! $paragraph !!}</p>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -15,14 +15,13 @@
|
|||
|
||||
{{-- Image --}}
|
||||
<div class="relative">
|
||||
<div class="card-elevated rounded-3xl overflow-hidden">
|
||||
<img
|
||||
src="{{ asset('img/assets/' . $content['image']) }}"
|
||||
alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-[500px] object-cover"
|
||||
/>
|
||||
<div class="card-elevated rounded-3xl overflow-hidden slide-left delay-400">
|
||||
<img src="{{ asset('img/assets/' . $content['image']) }}" alt="{{ $content['image_alt'] }}"
|
||||
class="w-full h-full object-cover" />
|
||||
|
||||
<div class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50">{{ $content['image_caption'] }}</div>
|
||||
<div
|
||||
class="absolute bottom-6 left-6 bg-card/95 backdrop-blur-sm rounded-xl p-4 shadow-lg border border-border/50">
|
||||
{{ $content['image_caption'] }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<div class="spacing-section">
|
||||
<div class="flex items-center justify-center">
|
||||
<img src="{{ asset(\App\Helpers\ThemeHelper::getLogoPath('negative')) }}"
|
||||
alt="{{ $domainName ?? 'B2In' }} Logo" class="h-12 w-auto" />
|
||||
alt="{{ $domainName ?? 'B2In' }} Logo" class="h-14 w-auto" />
|
||||
</div>
|
||||
|
||||
<div class="container-narrow spacing-content">
|
||||
|
|
@ -15,27 +15,25 @@
|
|||
</h2>
|
||||
</div>
|
||||
|
||||
<hr class="border-t border-dark-muted/30 mt-12 pt-4">
|
||||
<hr class="border-t border-dark-muted/30 mt-12 pt-4">
|
||||
</div>
|
||||
|
||||
{{-- Links --}}
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-left max-w-4xl mx-auto">
|
||||
<div class="spacing-small">
|
||||
<div class="spacing-small text-center">
|
||||
<a href="#" class="block hover-text-secondary transition-colors">Privacy Policy</a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="spacing-small">
|
||||
<div class="spacing-small text-center">
|
||||
<a href="#" class="block hover-text-secondary transition-colors">Terms of Service</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="spacing-small">
|
||||
<div class="spacing-small text-center">
|
||||
<a href="#" class="block hover-text-secondary transition-colors">Cookie Policy</a>
|
||||
</div>
|
||||
|
||||
<div class="spacing-small">
|
||||
<div class="spacing-small text-center">
|
||||
<a href="#" class="block hover-text-secondary transition-colors">Impressum</a>
|
||||
|
||||
</div>
|
||||
|
|
@ -52,17 +50,20 @@
|
|||
<div class="flex space-x-4">
|
||||
<a href="#" class="hover-text-secondary transition-colors" aria-label="Facebook">
|
||||
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/>
|
||||
<path
|
||||
d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="hover-text-secondary transition-colors" aria-label="Instagram">
|
||||
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M12.017 0C5.396 0 .029 5.367.029 11.987c0 6.62 5.367 11.987 11.988 11.987s11.987-5.367 11.987-11.987C24.004 5.367 18.637.001 12.017.001zM8.449 16.988c-1.297 0-2.448-.49-3.323-1.297C4.198 14.895 3.708 13.744 3.708 12.447s.49-2.448 1.418-3.323c.875-.807 2.026-1.297 3.323-1.297s2.448.49 3.323 1.297c.928.875 1.418 2.026 1.418 3.323s-.49 2.448-1.418 3.244c-.875.807-2.026 1.297-3.323 1.297zm7.83-9.281c-.49 0-.928-.175-1.297-.49-.368-.315-.49-.753-.49-1.243s.122-.928.49-1.243c.369-.315.807-.49 1.297-.49s.928.175 1.297.49c.368.315.49.753.49 1.243s-.122.928-.49 1.243c-.369.315-.807.49-1.297.49z"/>
|
||||
<path
|
||||
d="M12.017 0C5.396 0 .029 5.367.029 11.987c0 6.62 5.367 11.987 11.988 11.987s11.987-5.367 11.987-11.987C24.004 5.367 18.637.001 12.017.001zM8.449 16.988c-1.297 0-2.448-.49-3.323-1.297C4.198 14.895 3.708 13.744 3.708 12.447s.49-2.448 1.418-3.323c.875-.807 2.026-1.297 3.323-1.297s2.448.49 3.323 1.297c.928.875 1.418 2.026 1.418 3.323s-.49 2.448-1.418 3.244c-.875.807-2.026 1.297-3.323 1.297zm7.83-9.281c-.49 0-.928-.175-1.297-.49-.368-.315-.49-.753-.49-1.243s.122-.928.49-1.243c.369-.315.807-.49 1.297-.49s.928.175 1.297.49c.368.315.49.753.49 1.243s-.122.928-.49 1.243c-.369.315-.807.49-1.297.49z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="hover-text-secondary transition-colors" aria-label="LinkedIn">
|
||||
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
|
||||
<path
|
||||
d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,18 +3,16 @@
|
|||
<div class="flex items-center justify-between h-16">
|
||||
<a href="{{ $domainUrl }}" class="flex items-center">
|
||||
<img src="{{ asset(\App\Helpers\ThemeHelper::getLogoPath('positive')) }}"
|
||||
alt="{{ $domainName ?? 'B2IN' }} Logo" class="h-8 w-auto" />
|
||||
alt="{{ $domainName ?? 'B2IN' }} Logo" class="h-10 w-auto" />
|
||||
</a>
|
||||
|
||||
<nav class="hidden md:flex items-center space-x-8">
|
||||
@foreach($content['navigation'] as $navItem)
|
||||
@foreach ($content['navigation'] as $navItem)
|
||||
<a href="{{ $navItem['url'] }}"
|
||||
class="text-sm font-medium transition-colors relative
|
||||
@if($this->isActiveRoute($navItem['url']))
|
||||
text-secondary after:absolute after:bottom-[-4px] after:left-0 after:w-full after:h-0.5 after:bg-secondary after:rounded-full
|
||||
class="text-sm font-medium transition-colors relative
|
||||
@if ($this->isActiveRoute($navItem['url'])) text-secondary after:absolute after:bottom-[-4px] after:left-0 after:w-full after:h-0.5 after:bg-secondary after:rounded-full
|
||||
@else
|
||||
text-primary hover:text-secondary
|
||||
@endif">
|
||||
text-primary hover:text-secondary @endif">
|
||||
{{ $navItem['label'] }}
|
||||
</a>
|
||||
@endforeach
|
||||
|
|
@ -22,9 +20,9 @@
|
|||
|
||||
<div class="flex items-center space-x-4">
|
||||
<a href="{{ config('domains.domain_portal_url') }}"
|
||||
class=" md:block rounded-md px-3 py-2 text-sm font-medium bg-secondary hover-bg-primary hover-shadow-accent-glow text-white transition-all duration-200">
|
||||
{{ $content['portal_login'] }}
|
||||
</a>
|
||||
class=" md:block rounded-md px-3 py-2 text-sm font-medium bg-secondary hover-bg-primary glow-medium text-white transition-all duration-200">
|
||||
{{ $content['portal_login'] }}
|
||||
</a>
|
||||
<button wire:click="toggleMobileMenu"
|
||||
class="md:hidden w-5 h-5 text-muted-foreground hover:text-foreground transition-colors">
|
||||
@if ($this->isMobileMenuOpen)
|
||||
|
|
@ -46,14 +44,12 @@
|
|||
@if ($this->isMobileMenuOpen)
|
||||
<div class="md:hidden border-t border-border bg-background/95 backdrop-blur-sm">
|
||||
<nav class="px-4 py-6 space-y-4">
|
||||
@foreach($content['navigation'] as $navItem)
|
||||
@foreach ($content['navigation'] as $navItem)
|
||||
<a href="{{ $navItem['url'] }}"
|
||||
class="block text-sm font-medium transition-colors py-2 px-3 rounded-md
|
||||
@if($this->isActiveRoute($navItem['url']))
|
||||
text-secondary bg-secondary/10 border-l-2 border-secondary
|
||||
class="block text-sm font-medium transition-colors py-2 px-3 rounded-md
|
||||
@if ($this->isActiveRoute($navItem['url'])) text-secondary bg-secondary/10 border-l-2 border-secondary
|
||||
@else
|
||||
text-foreground hover:text-secondary hover:bg-muted/50
|
||||
@endif"
|
||||
text-foreground hover:text-secondary hover:bg-muted/50 @endif"
|
||||
wire:click="closeMobileMenu">
|
||||
{{ $navItem['label'] }}
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -4,29 +4,31 @@
|
|||
|
||||
@section('content')
|
||||
|
||||
<div class="bg-background">
|
||||
<livewire:web.components.ui.header />
|
||||
<div class="bg-background">
|
||||
<livewire:web.components.ui.header />
|
||||
|
||||
<main>
|
||||
<livewire:web.components.sections.hero />
|
||||
<livewire:web.components.sections.ecosystem-core />
|
||||
<livewire:web.components.sections.vision-section bg="bg-accent" />
|
||||
<livewire:web.components.sections.brand-worlds />
|
||||
<livewire:web.components.sections.c-t-a-section />
|
||||
</main>
|
||||
<main>
|
||||
<livewire:web.components.sections.hero />
|
||||
<livewire:web.components.sections.ecosystem-core />
|
||||
<livewire:web.components.sections.vision-section bg="bg-accent" />
|
||||
<livewire:web.components.sections.brand-worlds />
|
||||
<livewire:web.components.sections.content-section layout="right" bg="bg-accent"
|
||||
section="integriertes_modell_b2in" />
|
||||
<livewire:web.components.sections.c-t-a-section />
|
||||
</main>
|
||||
|
||||
<livewire:web.components.ui.footer />
|
||||
</div>
|
||||
<livewire:web.components.ui.footer />
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@push('styles')
|
||||
<style>
|
||||
[x-cloak] {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
[x-cloak] {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
@push('scripts')
|
||||
{{-- Alpine.js wird zentral im Layout geladen --}}
|
||||
{{-- Alpine.js wird zentral im Layout geladen --}}
|
||||
@endpush
|
||||
|
|
|
|||
|
|
@ -6,12 +6,15 @@
|
|||
<div class="bg-background">
|
||||
<livewire:web.components.ui.header />
|
||||
|
||||
<main>
|
||||
<livewire:web.components.sections.ecosystem-hero />
|
||||
<main class="variante-glass-flow">
|
||||
<livewire:web.components.sections.partner-hero section="ecosystem_hero" />
|
||||
<livewire:web.components.sections.ecosystem-stats />
|
||||
<livewire:web.components.sections.end-customer-section />
|
||||
<livewire:web.components.sections.broker-section />
|
||||
<livewire:web.components.sections.supplier-section />
|
||||
<livewire:web.components.sections.content-section layout="right" bg="bg-accent"
|
||||
section="ecosystem_start" />
|
||||
<livewire:web.components.sections.content-section layout="left" bg=""
|
||||
section="ecosystem_hub" />
|
||||
<livewire:web.components.sections.content-section layout="right" bg="bg-accent"
|
||||
section="ecosystem_result" />
|
||||
<livewire:web.components.sections.digital-core />
|
||||
<livewire:web.components.sections.partner-c-t-a />
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -6,11 +6,13 @@
|
|||
<div class="bg-background">
|
||||
<livewire:web.components.ui.header />
|
||||
|
||||
<main>
|
||||
<main class="variante-glass-flow">
|
||||
<livewire:web.components.sections.hero />
|
||||
<livewire:web.components.sections.ecosystem-core />
|
||||
<livewire:web.components.sections.vision-section bg="bg-accent" />
|
||||
<livewire:web.components.sections.brand-worlds />
|
||||
<livewire:web.components.sections.content-section layout="left" bg="bg-accent"
|
||||
section="integriertes_modell_b2in" />
|
||||
<livewire:web.components.sections.c-t-a-section />
|
||||
</main>
|
||||
|
||||
|
|
|
|||
|
|
@ -6,9 +6,12 @@
|
|||
<div class="bg-background">
|
||||
<livewire:web.components.ui.header />
|
||||
|
||||
<main>
|
||||
<main class="variante-glass-flow">
|
||||
<livewire:web.components.sections.partner-hero />
|
||||
<livewire:web.components.sections.partner-benefits />
|
||||
<livewire:web.components.sections.card-section bg="bg-accent" section="partner_card_section" />
|
||||
<livewire:web.components.sections.benefits-section section="partner_benefits_retailer" />
|
||||
<livewire:web.components.sections.benefits-section section="partner_benefits_supplier" layout="right" bg="bg-accent" />
|
||||
<livewire:web.components.sections.benefits-section section="partner_benefits_broker" />
|
||||
<livewire:web.components.sections.partner-process />
|
||||
<livewire:web.components.sections.commitment-section />
|
||||
<livewire:web.components.sections.partner-c-t-a />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue