1247 lines
38 KiB
HTML
1247 lines
38 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>Zauberer NRW – Michael Peskov | Premium Magie & Shows</title>
|
||
<meta
|
||
name="description"
|
||
content="Premium Zaubershows in NRW & deutschlandweit. Close‑Up, Bühne, Pickpocket. Jetzt Show anfragen."
|
||
/>
|
||
<link rel="canonical" href="https://example.com/" />
|
||
<meta name="robots" content="index,follow" />
|
||
<meta name="theme-color" content="#0F1220" />
|
||
|
||
<!-- Open Graph / Twitter -->
|
||
<meta
|
||
property="og:title"
|
||
content="Zauberer NRW – Michael Peskov | Premium Magie & Shows"
|
||
/>
|
||
<meta
|
||
property="og:description"
|
||
content="Premium Zaubershows in NRW & deutschlandweit. Close‑Up, Bühne, Pickpocket. Jetzt Show anfragen."
|
||
/>
|
||
<meta property="og:type" content="website" />
|
||
<meta property="og:url" content="https://example.com/" />
|
||
<meta
|
||
property="og:image"
|
||
content="https://example.com/social-preview.jpg"
|
||
/>
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
|
||
<!-- Preload fonts (swap) -->
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link
|
||
rel="preload"
|
||
as="style"
|
||
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&family=Poppins:wght@700;800&display=swap"
|
||
/>
|
||
<link
|
||
rel="stylesheet"
|
||
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&family=Poppins:wght@700;800&display=swap"
|
||
media="print"
|
||
onload="this.media='all'"
|
||
/>
|
||
<noscript
|
||
><link
|
||
rel="stylesheet"
|
||
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&family=Poppins:wght@700;800&display=swap"
|
||
/></noscript>
|
||
|
||
<style>
|
||
/* Design tokens */
|
||
:root {
|
||
--bg-900: #0f1220;
|
||
--bg-800: #13162b;
|
||
--surface-700: #1a1f3a;
|
||
--surface-600: #20264a;
|
||
--text-100: #f5f7ff;
|
||
--text-300: #bdc3ea;
|
||
--text-500: #9aa1d2;
|
||
--primary-400: #7c5cff;
|
||
--primary-500: #6a4dff;
|
||
--primary-600: #5a3fff;
|
||
--accent-emerald: #3ce0a0;
|
||
--warning-amber: #ffc857;
|
||
--error-rose: #ff5c8a;
|
||
--glass: rgba(255, 255, 255, 0.06);
|
||
--shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
|
||
--radius-lg: 16px;
|
||
--radius-xl: 22px;
|
||
--radius-pill: 999px;
|
||
--maxw: 1200px;
|
||
--px: clamp(16px, 3.6vw, 28px);
|
||
}
|
||
|
||
/* Base */
|
||
* {
|
||
box-sizing: border-box;
|
||
}
|
||
html,
|
||
body {
|
||
height: 100%;
|
||
}
|
||
html {
|
||
scroll-behavior: smooth;
|
||
}
|
||
body {
|
||
margin: 0;
|
||
background: var(--bg-900);
|
||
color: var(--text-100);
|
||
font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto,
|
||
Helvetica, Arial, sans-serif;
|
||
line-height: 1.6;
|
||
}
|
||
a {
|
||
color: inherit;
|
||
text-decoration: none;
|
||
}
|
||
a:hover {
|
||
text-decoration: underline;
|
||
text-underline-offset: 3px;
|
||
}
|
||
img {
|
||
display: block;
|
||
max-width: 100%;
|
||
height: auto;
|
||
}
|
||
.container {
|
||
width: min(100%, var(--maxw));
|
||
margin-inline: auto;
|
||
padding-inline: var(--px);
|
||
}
|
||
.sr-only {
|
||
position: absolute !important;
|
||
width: 1px !important;
|
||
height: 1px !important;
|
||
padding: 0 !important;
|
||
margin: -1px !important;
|
||
overflow: hidden !important;
|
||
clip: rect(0, 0, 0, 0) !important;
|
||
white-space: nowrap !important;
|
||
border: 0 !important;
|
||
}
|
||
|
||
/* Subtle noise/texture */
|
||
body::before {
|
||
content: "";
|
||
position: fixed;
|
||
inset: 0;
|
||
pointer-events: none;
|
||
z-index: 0;
|
||
background-image: radial-gradient(
|
||
rgba(255, 255, 255, 0.03),
|
||
transparent 40%
|
||
),
|
||
repeating-linear-gradient(
|
||
90deg,
|
||
rgba(255, 255, 255, 0.01),
|
||
rgba(255, 255, 255, 0.01) 1px,
|
||
transparent 1px,
|
||
transparent 2px
|
||
);
|
||
mix-blend-mode: soft-light;
|
||
opacity: 0.7;
|
||
}
|
||
|
||
/* Focus */
|
||
:focus-visible {
|
||
outline: 3px solid var(--primary-500);
|
||
outline-offset: 2px;
|
||
border-radius: 10px;
|
||
}
|
||
|
||
/* Header/Nav */
|
||
header.nav {
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 40;
|
||
backdrop-filter: blur(8px) saturate(130%);
|
||
background: linear-gradient(
|
||
180deg,
|
||
rgba(19, 22, 43, 0.7),
|
||
rgba(19, 22, 43, 0.4)
|
||
);
|
||
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
|
||
}
|
||
.nav__row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
height: 68px;
|
||
}
|
||
.brand {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 12px;
|
||
font-family: Poppins, system-ui, sans-serif;
|
||
font-weight: 800;
|
||
letter-spacing: 0.02em;
|
||
}
|
||
.brand__logo {
|
||
width: 34px;
|
||
height: 34px;
|
||
border-radius: 10px;
|
||
background: linear-gradient(
|
||
135deg,
|
||
var(--primary-400),
|
||
var(--primary-600)
|
||
);
|
||
box-shadow: 0 10px 24px rgba(122, 92, 255, 0.35);
|
||
}
|
||
.brand__logo img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
border-radius: 10px;
|
||
display: block;
|
||
}
|
||
nav.links {
|
||
display: none;
|
||
gap: 18px;
|
||
}
|
||
.nav__cta {
|
||
display: none;
|
||
}
|
||
@media (min-width: 920px) {
|
||
nav.links {
|
||
display: flex;
|
||
}
|
||
.nav__cta {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 10px;
|
||
}
|
||
}
|
||
.link {
|
||
position: relative;
|
||
padding: 8px 10px;
|
||
border-radius: 10px;
|
||
color: var(--text-300);
|
||
}
|
||
.link.active::after {
|
||
content: "";
|
||
position: absolute;
|
||
left: 10px;
|
||
right: 10px;
|
||
bottom: 2px;
|
||
height: 2px;
|
||
background: var(--primary-500);
|
||
border-radius: var(--radius-pill);
|
||
}
|
||
|
||
.btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 10px;
|
||
font-weight: 700;
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
border-radius: var(--radius-pill);
|
||
padding: 12px 18px;
|
||
cursor: pointer;
|
||
transition: transform 0.18s ease, box-shadow 0.18s ease,
|
||
background 0.18s ease;
|
||
}
|
||
.btn--primary {
|
||
background: linear-gradient(
|
||
90deg,
|
||
var(--primary-500),
|
||
var(--primary-400)
|
||
);
|
||
color: #0b0d1a;
|
||
box-shadow: 0 0 0 6px rgba(122, 92, 255, 0.12);
|
||
}
|
||
.btn--primary:hover {
|
||
transform: translateY(-1px);
|
||
box-shadow: 0 0 0 6px rgba(122, 92, 255, 0.18);
|
||
}
|
||
.btn--ghost {
|
||
background: transparent;
|
||
color: var(--text-100);
|
||
}
|
||
|
||
/* Hero */
|
||
.hero {
|
||
position: relative;
|
||
padding-block: clamp(88px, 12vw, 140px);
|
||
isolation: isolate;
|
||
}
|
||
.hero .spotlight {
|
||
position: absolute;
|
||
inset: -10% -10% auto -10%;
|
||
height: 66vh;
|
||
z-index: -1;
|
||
background: radial-gradient(
|
||
900px 460px at 50% 0%,
|
||
rgba(122, 92, 255, 0.25),
|
||
transparent 60%
|
||
),
|
||
radial-gradient(
|
||
780px 400px at 10% 20%,
|
||
rgba(122, 92, 255, 0.12),
|
||
transparent 60%
|
||
),
|
||
linear-gradient(180deg, var(--bg-800), var(--bg-900));
|
||
}
|
||
.hero__grid {
|
||
display: grid;
|
||
gap: clamp(20px, 4vw, 36px);
|
||
}
|
||
@media (min-width: 980px) {
|
||
.hero__grid {
|
||
grid-template-columns: 1.1fr 0.9fr;
|
||
align-items: center;
|
||
}
|
||
}
|
||
.eyebrow {
|
||
display: inline-flex;
|
||
gap: 8px;
|
||
align-items: center;
|
||
padding: 6px 10px;
|
||
background: var(--glass);
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
border-radius: var(--radius-pill);
|
||
color: var(--text-500);
|
||
}
|
||
.h1 {
|
||
font-family: Poppins, system-ui, sans-serif;
|
||
font-weight: 800;
|
||
font-size: clamp(2.8rem, 5vw + 1rem, 4rem);
|
||
line-height: 1.06;
|
||
margin: 10px 0;
|
||
}
|
||
.lead {
|
||
max-width: 60ch;
|
||
color: var(--text-300);
|
||
}
|
||
.hero__media {
|
||
position: relative;
|
||
aspect-ratio: 16/9;
|
||
border-radius: var(--radius-xl);
|
||
overflow: hidden;
|
||
background: var(--surface-700);
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
.poster {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.play-overlay {
|
||
position: absolute;
|
||
inset: 0;
|
||
display: grid;
|
||
place-items: center;
|
||
background: linear-gradient(
|
||
180deg,
|
||
rgba(0, 0, 0, 0.25),
|
||
rgba(0, 0, 0, 0.5)
|
||
);
|
||
cursor: pointer;
|
||
}
|
||
.play-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 12px;
|
||
background: linear-gradient(
|
||
90deg,
|
||
var(--primary-500),
|
||
var(--primary-400)
|
||
);
|
||
color: #080a16;
|
||
font-weight: 800;
|
||
border-radius: var(--radius-pill);
|
||
padding: 12px 18px;
|
||
box-shadow: 0 0 0 6px rgba(122, 92, 255, 0.15);
|
||
}
|
||
|
||
/* Cards / sections */
|
||
.section {
|
||
padding-block: clamp(88px, 10vw, 120px);
|
||
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
||
}
|
||
.card {
|
||
background: var(--glass);
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
box-shadow: var(--shadow);
|
||
border-radius: var(--radius-lg);
|
||
padding: clamp(18px, 2.6vw, 26px);
|
||
}
|
||
.h2 {
|
||
font-family: Poppins, system-ui, sans-serif;
|
||
font-weight: 800;
|
||
font-size: clamp(1.8rem, 2.2vw + 0.8rem, 2.4rem);
|
||
margin: 0 0 16px;
|
||
}
|
||
|
||
/* About */
|
||
.about {
|
||
display: grid;
|
||
gap: 24px;
|
||
grid-template-columns: 1fr;
|
||
}
|
||
@media (min-width: 980px) {
|
||
.about {
|
||
grid-template-columns: 0.25fr 0.75fr;
|
||
}
|
||
}
|
||
.avatar {
|
||
width: 96px;
|
||
height: 96px;
|
||
border-radius: 50%;
|
||
border: 2px solid rgba(255, 255, 255, 0.2);
|
||
object-fit: cover;
|
||
}
|
||
.chips {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 10px;
|
||
margin-top: 12px;
|
||
}
|
||
.chip {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
padding: 6px 10px;
|
||
border-radius: var(--radius-pill);
|
||
background: rgba(255, 255, 255, 0.06);
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
color: var(--text-300);
|
||
}
|
||
|
||
/* Gallery */
|
||
.grid {
|
||
display: grid;
|
||
gap: clamp(16px, 2.4vw, 24px);
|
||
}
|
||
.grid--3 {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
@media (min-width: 900px) {
|
||
.grid--3 {
|
||
grid-template-columns: repeat(3, 1fr);
|
||
}
|
||
}
|
||
.gallery-item {
|
||
position: relative;
|
||
border-radius: var(--radius-lg);
|
||
overflow: hidden;
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
}
|
||
.gallery-item img {
|
||
transition: transform 0.25s ease;
|
||
}
|
||
.gallery-item:hover img {
|
||
transform: scale(1.04);
|
||
}
|
||
.gallery-item::after {
|
||
content: "";
|
||
position: absolute;
|
||
inset: 0;
|
||
pointer-events: none;
|
||
box-shadow: inset 0 0 0 0 rgba(122, 92, 255, 0.35);
|
||
transition: box-shadow 0.25s ease;
|
||
}
|
||
.gallery-item:hover::after {
|
||
box-shadow: inset 0 0 0 2px rgba(122, 92, 255, 0.45);
|
||
}
|
||
|
||
/* Video card */
|
||
.video-card {
|
||
position: relative;
|
||
border-radius: var(--radius-xl);
|
||
overflow: hidden;
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
box-shadow: var(--shadow);
|
||
background: var(--surface-700);
|
||
}
|
||
.ratio-16x9 {
|
||
aspect-ratio: 16/9;
|
||
}
|
||
|
||
/* Testimonials */
|
||
.testimonial {
|
||
position: relative;
|
||
background: var(--glass);
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
border-radius: var(--radius-lg);
|
||
box-shadow: var(--shadow);
|
||
padding: 18px;
|
||
}
|
||
.testimonial .quote {
|
||
position: absolute;
|
||
right: 12px;
|
||
top: 12px;
|
||
opacity: 0.15;
|
||
font-size: 24px;
|
||
}
|
||
.stars {
|
||
color: var(--warning-amber);
|
||
}
|
||
.rate {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
background: rgba(60, 224, 160, 0.16);
|
||
color: var(--accent-emerald);
|
||
border: 1px solid rgba(60, 224, 160, 0.35);
|
||
padding: 4px 8px;
|
||
border-radius: var(--radius-pill);
|
||
font-weight: 700;
|
||
}
|
||
|
||
/* Contact */
|
||
form .row {
|
||
display: grid;
|
||
gap: 14px;
|
||
grid-template-columns: 1fr;
|
||
}
|
||
@media (min-width: 900px) {
|
||
form .row {
|
||
grid-template-columns: 1fr 1fr;
|
||
}
|
||
}
|
||
label {
|
||
display: block;
|
||
color: var(--text-300);
|
||
font-size: 0.95rem;
|
||
margin-bottom: 6px;
|
||
}
|
||
input,
|
||
textarea {
|
||
width: 100%;
|
||
border-radius: 12px;
|
||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||
background: #151935;
|
||
color: var(--text-100);
|
||
padding: 12px 12px;
|
||
font: inherit;
|
||
}
|
||
textarea {
|
||
min-height: 120px;
|
||
}
|
||
.help {
|
||
color: var(--text-500);
|
||
font-size: 0.9rem;
|
||
}
|
||
.note {
|
||
color: var(--text-500);
|
||
}
|
||
.pills {
|
||
display: flex;
|
||
gap: 10px;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
/* Footer */
|
||
footer {
|
||
padding-block: 56px;
|
||
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
||
background: linear-gradient(180deg, var(--bg-800), var(--bg-900));
|
||
}
|
||
.foot {
|
||
display: grid;
|
||
gap: 20px;
|
||
grid-template-columns: 2fr 1fr 1fr;
|
||
}
|
||
@media (max-width: 900px) {
|
||
.foot {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
.social a {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 36px;
|
||
height: 36px;
|
||
border-radius: 10px;
|
||
background: rgba(255, 255, 255, 0.06);
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
}
|
||
.social a:hover {
|
||
background: rgba(122, 92, 255, 0.25);
|
||
border-color: rgba(122, 92, 255, 0.5);
|
||
transform: scale(1.06);
|
||
}
|
||
.crumbs {
|
||
margin-top: 8px;
|
||
color: var(--text-500);
|
||
font-size: 0.9rem;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<a class="sr-only" href="#main">Skip to content</a>
|
||
<header class="nav" role="banner">
|
||
<div class="container nav__row">
|
||
<a class="brand" href="#top" aria-label="Home">
|
||
<span class="brand__logo" aria-hidden="true"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="34"
|
||
height="34"
|
||
loading="eager"
|
||
/></span>
|
||
<span>Michael Peskov Magic</span>
|
||
</a>
|
||
<nav class="links" aria-label="Primary">
|
||
<a class="link active" href="#about">About</a>
|
||
<a class="link" href="/shows">Shows</a>
|
||
<a class="link" href="/gallery">Gallery</a>
|
||
<a class="link" href="/testimonials">Testimonials</a>
|
||
<a class="link" href="/contact">Contact</a>
|
||
</nav>
|
||
<div class="nav__cta">
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="https://www.instagram.com/"
|
||
aria-label="Instagram"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="20"
|
||
height="20"
|
||
loading="lazy"
|
||
/></a>
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="https://www.youtube.com/"
|
||
aria-label="YouTube"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="20"
|
||
height="20"
|
||
loading="lazy"
|
||
/></a>
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="https://www.tiktok.com/"
|
||
aria-label="TikTok"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="20"
|
||
height="20"
|
||
loading="lazy"
|
||
/></a>
|
||
<a class="btn btn--primary" href="#contact" aria-label="Book a Show"
|
||
>Book a Show</a
|
||
>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main id="main">
|
||
<!-- HERO -->
|
||
<section class="hero" id="top">
|
||
<div class="spotlight" aria-hidden="true"></div>
|
||
<div class="container hero__grid">
|
||
<div>
|
||
<span class="eyebrow">Premium • Modern • Live</span>
|
||
<h1 class="h1">
|
||
Zauberer NRW – Michael Peskov: The Young Illusionist
|
||
</h1>
|
||
<p class="lead">
|
||
Experience the wonder and excitement of magic with Michael Peskov,
|
||
a rising star in the world of illusion. With a unique blend of
|
||
classic techniques and modern flair, Michael captivates audiences
|
||
at corporate events, weddings, and private celebrations across NRW
|
||
and Germany.
|
||
</p>
|
||
<div
|
||
style="
|
||
display: flex;
|
||
gap: 12px;
|
||
flex-wrap: wrap;
|
||
margin-top: 12px;
|
||
"
|
||
>
|
||
<a
|
||
class="btn btn--primary"
|
||
href="#contact"
|
||
aria-label="Book a Show now"
|
||
>Book a Show</a
|
||
>
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="#showreel"
|
||
aria-label="Watch Showreel"
|
||
>Watch Showreel</a
|
||
>
|
||
</div>
|
||
</div>
|
||
<div class="hero__media">
|
||
<picture>
|
||
<source
|
||
type="image/webp"
|
||
srcset="
|
||
styles/img/michael-peskov-magier-taschendieb-453624.jpeg
|
||
"
|
||
/>
|
||
<img
|
||
class="poster"
|
||
src="styles/img/michael-peskov-magier-taschendieb-453624.jpeg"
|
||
alt="Michael Peskov performing on stage with audience in NRW"
|
||
width="1280"
|
||
height="720"
|
||
/>
|
||
</picture>
|
||
<div
|
||
class="play-overlay"
|
||
id="showreel"
|
||
role="button"
|
||
tabindex="0"
|
||
aria-label="Play showreel"
|
||
data-video="https://www.youtube-nocookie.com/embed/BGAXMeIzu3Q?autoplay=1"
|
||
>
|
||
<span class="play-btn">▶︎ Watch Showreel</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ABOUT -->
|
||
<section class="section" id="about">
|
||
<div class="container card about">
|
||
<div>
|
||
<img
|
||
class="avatar"
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-419186.jpeg"
|
||
alt="Portrait of Michael Peskov, magician based in NRW, Germany"
|
||
width="96"
|
||
height="96"
|
||
loading="lazy"
|
||
/>
|
||
</div>
|
||
<div>
|
||
<h2 class="h2">About Michael</h2>
|
||
<p>
|
||
Michael Peskov is a premium young magician from NRW, Germany.
|
||
Known for dynamic, interactive performances, he blends
|
||
sleight‑of‑hand, modern stagecraft, and tasteful humor to create
|
||
memorable moments for guests and organizers alike.
|
||
</p>
|
||
<p>
|
||
From intimate close‑up magic to high‑energy stage experiences,
|
||
Michael adapts seamlessly to corporate events, weddings, and
|
||
private parties. Expect clear communication, reliable planning,
|
||
and a smooth run of show.
|
||
</p>
|
||
<div class="chips">
|
||
<span class="chip">5/5 ★★★★★</span>
|
||
<span class="chip">100% recommendation</span>
|
||
<span class="chip"
|
||
>Seen on: SAT.1 • WDR • ZDF • Amazon Prime Video</span
|
||
>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- GALLERY -->
|
||
<section class="section" id="gallery">
|
||
<div class="container">
|
||
<h2 class="h2">Gallery</h2>
|
||
<div class="grid grid--3">
|
||
<figure class="gallery-item">
|
||
<picture>
|
||
<img
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-450253.jpeg"
|
||
alt="Michael Peskov performing close‑up magic in NRW"
|
||
width="640"
|
||
height="480"
|
||
loading="lazy"
|
||
/>
|
||
</picture>
|
||
</figure>
|
||
<figure class="gallery-item">
|
||
<img
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-450255.jpeg"
|
||
alt="Stage magic with audience reactions in Germany"
|
||
width="640"
|
||
height="480"
|
||
loading="lazy"
|
||
/>
|
||
</figure>
|
||
<figure class="gallery-item">
|
||
<img
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-450254.jpeg"
|
||
alt="Pickpocket act with respectful return, NRW"
|
||
width="640"
|
||
height="480"
|
||
loading="lazy"
|
||
/>
|
||
</figure>
|
||
<figure class="gallery-item">
|
||
<img
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-450256.jpeg"
|
||
alt="Corporate event magic – Lexus event"
|
||
width="640"
|
||
height="480"
|
||
loading="lazy"
|
||
/>
|
||
</figure>
|
||
<figure class="gallery-item">
|
||
<img
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-450258.jpeg"
|
||
alt="IHK corporate show, NRW"
|
||
width="640"
|
||
height="480"
|
||
loading="lazy"
|
||
/>
|
||
</figure>
|
||
<figure class="gallery-item">
|
||
<img
|
||
src="https://images.eventpeppers.com/sites/default/files/imagecache/lightbox-preview/images/13234/michael-peskov-magier-taschendieb-450257.jpeg"
|
||
alt="International corporate entertainment – Germany"
|
||
width="640"
|
||
height="480"
|
||
loading="lazy"
|
||
/>
|
||
</figure>
|
||
</div>
|
||
<p class="help" style="margin-top: 10px">
|
||
See more in the <a href="/gallery">gallery</a>.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- FEATURED VIDEO / SHOWREEL -->
|
||
<section class="section" id="video">
|
||
<div class="container">
|
||
<h2 class="h2">Showreel</h2>
|
||
<article class="video-card ratio-16x9" id="videoCard">
|
||
<picture>
|
||
<img
|
||
class="poster"
|
||
src="styles/img/michael-peskov-magier-taschendieb-453624.jpeg"
|
||
alt="Showreel poster – Michael Peskov on stage"
|
||
width="1280"
|
||
height="720"
|
||
loading="lazy"
|
||
/>
|
||
</picture>
|
||
<div
|
||
class="play-overlay"
|
||
role="button"
|
||
tabindex="0"
|
||
aria-label="Play showreel"
|
||
data-video="https://www.youtube-nocookie.com/embed/BGAXMeIzu3Q?autoplay=1"
|
||
>
|
||
<span class="play-btn">▶︎ Play Showreel</span>
|
||
</div>
|
||
</article>
|
||
<p class="help" style="margin-top: 8px">
|
||
As seen on WDR Lokalzeit Düsseldorf.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- TESTIMONIALS -->
|
||
<section class="section" id="testimonials">
|
||
<div class="container">
|
||
<h2 class="h2">Testimonials</h2>
|
||
<div class="grid grid--3">
|
||
<article class="testimonial">
|
||
<div class="quote">"</div>
|
||
<div style="display: flex; align-items: center; gap: 10px">
|
||
<img
|
||
src="https://api.dicebear.com/7.x/thumbs/svg?seed=a"
|
||
alt="Reviewer avatar"
|
||
width="44"
|
||
height="44"
|
||
style="border-radius: 50%"
|
||
loading="lazy"
|
||
/>
|
||
<div>
|
||
<div>
|
||
<strong>Anna K.</strong> •
|
||
<time date-time="2024-11-10">2024-11-10</time>
|
||
</div>
|
||
<div class="stars">★★★★★</div>
|
||
</div>
|
||
</div>
|
||
<p>
|
||
"Close‑Up Magie auf Top‑Niveau. Unsere Firmenfeier wurde zum
|
||
Gesprächsthema – jederzeit wieder."
|
||
</p>
|
||
<span class="rate">5.0</span>
|
||
</article>
|
||
<article class="testimonial">
|
||
<div class="quote">"</div>
|
||
<div style="display: flex; align-items: center; gap: 10px">
|
||
<img
|
||
src="https://api.dicebear.com/7.x/thumbs/svg?seed=b"
|
||
alt="Reviewer avatar"
|
||
width="44"
|
||
height="44"
|
||
style="border-radius: 50%"
|
||
loading="lazy"
|
||
/>
|
||
<div>
|
||
<div>
|
||
<strong>Jonas P.</strong> •
|
||
<time date-time="2024-05-18">2024-05-18</time>
|
||
</div>
|
||
<div class="stars">★★★★★</div>
|
||
</div>
|
||
</div>
|
||
<p>
|
||
"Grandioser Bühnenzauber mit viel Interaktion – unsere Hochzeit
|
||
hatte unvergessliche Momente."
|
||
</p>
|
||
<span class="rate">5.0</span>
|
||
</article>
|
||
<article class="testimonial">
|
||
<div class="quote">"</div>
|
||
<div style="display: flex; align-items: center; gap: 10px">
|
||
<img
|
||
src="https://api.dicebear.com/7.x/thumbs/svg?seed=c"
|
||
alt="Reviewer avatar"
|
||
width="44"
|
||
height="44"
|
||
style="border-radius: 50%"
|
||
loading="lazy"
|
||
/>
|
||
<div>
|
||
<div>
|
||
<strong>Maria L.</strong> •
|
||
<time date-time="2023-02-12">2023-02-12</time>
|
||
</div>
|
||
<div class="stars">★★★★★</div>
|
||
</div>
|
||
</div>
|
||
<p>
|
||
"Perfektes Zauber‑Event – professionell, sympathisch, absolut
|
||
empfehlenswert."
|
||
</p>
|
||
<span class="rate">5.0</span>
|
||
</article>
|
||
</div>
|
||
<p class="help" style="margin-top: 10px">
|
||
Read more <a href="/testimonials">testimonials</a>.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- CONTACT -->
|
||
<section class="section" id="contact">
|
||
<div class="container">
|
||
<h2 class="h2">Contact</h2>
|
||
<div class="card">
|
||
<form id="contactForm" novalidate>
|
||
<div class="row">
|
||
<div>
|
||
<label for="name">Name</label>
|
||
<input
|
||
id="name"
|
||
name="name"
|
||
placeholder="Your name"
|
||
required
|
||
/>
|
||
</div>
|
||
<div>
|
||
<label for="email">Email</label>
|
||
<input
|
||
id="email"
|
||
name="email"
|
||
type="email"
|
||
placeholder="you@example.com"
|
||
required
|
||
/>
|
||
</div>
|
||
<div>
|
||
<label for="subject">Subject</label>
|
||
<input
|
||
id="subject"
|
||
name="subject"
|
||
placeholder="Booking inquiry"
|
||
required
|
||
/>
|
||
</div>
|
||
<div>
|
||
<label for="hp" class="sr-only">Do not fill</label>
|
||
<input
|
||
id="hp"
|
||
name="hp"
|
||
tabindex="-1"
|
||
autocomplete="off"
|
||
style="position: absolute; left: -9999px"
|
||
aria-hidden="true"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<label for="message">Message</label>
|
||
<textarea
|
||
id="message"
|
||
name="message"
|
||
placeholder="Date, city, guests, occasion – any special requests?"
|
||
required
|
||
></textarea>
|
||
<div class="pills" style="margin-top: 12px">
|
||
<button
|
||
class="btn btn--primary"
|
||
type="submit"
|
||
aria-label="Send message"
|
||
>
|
||
Send
|
||
</button>
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="tel:+491234567890"
|
||
aria-label="Call phone"
|
||
>📞 Phone</a
|
||
>
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="https://wa.me/491234567890"
|
||
target="_blank"
|
||
rel="noopener"
|
||
aria-label="WhatsApp chat"
|
||
>💬 WhatsApp</a
|
||
>
|
||
<a
|
||
class="btn btn--ghost"
|
||
href="mailto:booking@michaelpeskov.de"
|
||
aria-label="Send email"
|
||
>📧 Email</a
|
||
>
|
||
</div>
|
||
<p class="note" style="margin-top: 6px">
|
||
Based in NRW • Travel radius > 1000 km • Response within 24
|
||
hours.
|
||
</p>
|
||
<div
|
||
id="formStatus"
|
||
role="status"
|
||
aria-live="polite"
|
||
class="help"
|
||
style="margin-top: 6px"
|
||
></div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Closing CTA -->
|
||
<section class="section">
|
||
<div
|
||
class="container card"
|
||
style="display: grid; gap: 12px; align-items: center"
|
||
>
|
||
<h3 class="h2" style="margin: 0">Ready to elevate your event?</h3>
|
||
<p class="help" style="margin: 0">
|
||
Book a Show or explore <a href="/shows">Shows</a> to find your
|
||
perfect format.
|
||
</p>
|
||
<div>
|
||
<a
|
||
class="btn btn--primary"
|
||
href="#contact"
|
||
aria-label="Book a Show now"
|
||
>Book a Show</a
|
||
>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer role="contentinfo">
|
||
<div class="container foot">
|
||
<div>
|
||
<div class="brand">
|
||
<span class="brand__logo" aria-hidden="true"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="34"
|
||
height="34"
|
||
loading="lazy"
|
||
/></span>
|
||
<span>Michael Peskov Magic</span>
|
||
</div>
|
||
<p class="help">
|
||
Young magician for NRW & Germany – close‑up, stage, and pickpocket
|
||
acts.
|
||
</p>
|
||
</div>
|
||
<div>
|
||
<div><a href="/shows">Shows</a></div>
|
||
<div><a href="/gallery">Gallery</a></div>
|
||
<div><a href="/testimonials">Testimonials</a></div>
|
||
<div><a href="/contact">Contact</a></div>
|
||
<div>
|
||
<a href="/impressum">Impressum</a> •
|
||
<a href="/datenschutz">Datenschutz</a>
|
||
</div>
|
||
</div>
|
||
<div class="social" aria-label="Social links">
|
||
<a href="https://www.instagram.com/" aria-label="Instagram"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="20"
|
||
height="20"
|
||
loading="lazy"
|
||
/></a>
|
||
<a href="https://www.youtube.com/" aria-label="YouTube"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="20"
|
||
height="20"
|
||
loading="lazy"
|
||
/></a>
|
||
<a href="https://www.tiktok.com/" aria-label="TikTok"
|
||
><img
|
||
src="styles/img/icon.png"
|
||
alt=""
|
||
width="20"
|
||
height="20"
|
||
loading="lazy"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<div class="container crumbs">
|
||
Home › Zauberer NRW – Michael Peskov • © 2025 Michael Peskov
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- SCHEMA: Person, LocalBusiness(EntertainmentBusiness), AggregateRating, Reviews, Website, BreadcrumbList -->
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@graph": [
|
||
{
|
||
"@type": "Person",
|
||
"name": "Michael Peskov",
|
||
"jobTitle": "Magician",
|
||
"url": "https://example.com/",
|
||
"sameAs": [
|
||
"https://www.instagram.com/",
|
||
"https://www.youtube.com/",
|
||
"https://www.tiktok.com/"
|
||
]
|
||
},
|
||
{
|
||
"@type": "EntertainmentBusiness",
|
||
"name": "Michael Peskov Magic",
|
||
"areaServed": ["North Rhine-Westphalia", "Germany", "Europe"],
|
||
"address": {
|
||
"@type": "PostalAddress",
|
||
"addressLocality": "Solingen",
|
||
"addressRegion": "NRW",
|
||
"postalCode": "42699",
|
||
"addressCountry": "DE"
|
||
},
|
||
"aggregateRating": {
|
||
"@type": "AggregateRating",
|
||
"ratingValue": "4.9",
|
||
"ratingCount": "27"
|
||
}
|
||
},
|
||
{
|
||
"@type": "WebSite",
|
||
"name": "Michael Peskov Magic",
|
||
"url": "https://example.com/"
|
||
},
|
||
{
|
||
"@type": "BreadcrumbList",
|
||
"itemListElement": [
|
||
{
|
||
"@type": "ListItem",
|
||
"position": 1,
|
||
"name": "Home",
|
||
"item": "https://example.com/"
|
||
}
|
||
]
|
||
},
|
||
{
|
||
"@type": "Review",
|
||
"author": { "@type": "Person", "name": "Anna" },
|
||
"datePublished": "2024-11-10",
|
||
"reviewRating": { "@type": "Rating", "ratingValue": "5" },
|
||
"reviewBody": "Close‑Up Magie auf Top‑Niveau. Unsere Firmenfeier wurde zum Gesprächsthema – jederzeit wieder."
|
||
},
|
||
{
|
||
"@type": "Review",
|
||
"author": { "@type": "Person", "name": "Jonas" },
|
||
"datePublished": "2024-05-18",
|
||
"reviewRating": { "@type": "Rating", "ratingValue": "5" },
|
||
"reviewBody": "Grandioser Bühnenzauber mit viel Interaktion – unsere Hochzeit hatte unvergessliche Momente."
|
||
},
|
||
{
|
||
"@type": "Review",
|
||
"author": { "@type": "Person", "name": "Maria" },
|
||
"datePublished": "2023-02-12",
|
||
"reviewRating": { "@type": "Rating", "ratingValue": "5" },
|
||
"reviewBody": "Perfektes Zauber‑Event – professionell, sympathisch, absolut empfehlenswert."
|
||
}
|
||
]
|
||
}
|
||
</script>
|
||
<!-- Event schema template (activate for real events)
|
||
{
|
||
"@context":"https://schema.org",
|
||
"@type":"Event",
|
||
"name":"Michael Peskov – Zaubershow NRW",
|
||
"eventAttendanceMode":"https://schema.org/OfflineEventAttendanceMode",
|
||
"location":{"@type":"Place","name":"NRW","address":{"@type":"PostalAddress","addressRegion":"NRW","addressCountry":"DE"}}
|
||
}
|
||
-->
|
||
|
||
<script>
|
||
// Click-to-play for hero/video overlays
|
||
function wirePlay(el) {
|
||
const url = el.getAttribute("data-video");
|
||
if (!url) return;
|
||
const container = el.parentElement;
|
||
el.addEventListener("click", () => {
|
||
container.innerHTML = `<iframe title="Showreel" src="${url}" width="100%" height="100%" allow="autoplay; encrypted-media; picture-in-picture" loading="lazy"></iframe>`;
|
||
});
|
||
el.addEventListener("keydown", (e) => {
|
||
if (e.key === "Enter" || e.key === " ") {
|
||
e.preventDefault();
|
||
el.click();
|
||
}
|
||
});
|
||
}
|
||
document.querySelectorAll(".play-overlay").forEach(wirePlay);
|
||
|
||
// Basic client-side validation + honeypot + time trap
|
||
const form = document.getElementById("contactForm");
|
||
if (form) {
|
||
const status = document.getElementById("formStatus");
|
||
const start = Date.now();
|
||
form.addEventListener("submit", (e) => {
|
||
e.preventDefault();
|
||
const hp = document.getElementById("hp");
|
||
if (hp && hp.value) {
|
||
status.textContent = "Spam detected.";
|
||
return;
|
||
}
|
||
if (Date.now() - start < 1500) {
|
||
status.textContent = "Please take a moment to complete the form.";
|
||
return;
|
||
}
|
||
const fd = new FormData(form);
|
||
// mailto fallback (replace with real endpoint later)
|
||
const subject = encodeURIComponent("Booking inquiry");
|
||
const body = encodeURIComponent(
|
||
Array.from(fd.entries())
|
||
.map(([k, v]) => `${k}: ${v}`)
|
||
.join("\n")
|
||
);
|
||
status.textContent = "Thanks! I'll get back to you within 24 hours.";
|
||
window.location.href = `mailto:booking@michaelpeskov.de?subject=${subject}&body=${body}`;
|
||
});
|
||
}
|
||
</script>
|
||
</body>
|
||
</html>
|