/* Viva Blocks – [viva_sonntag_abend]  Nur Layout; Farben aus dem CD. */

/* Übergang Tag → Nacht: dieselbe sanfte Rundung wie beim Footer (heller Abschnitt wölbt sich ins Dunkel) */
.vk-evening {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	padding-top: calc(var(--vb-space) + clamp(34px, 5vw, 76px));
	background: var(--vb-dark) !important;
}
.vk-evening::before {
	content: ""; position: absolute; z-index: 1; top: -1px; left: 0; right: 0; height: clamp(34px, 5vw, 76px);
	background: var(--vb-bg-warm); /* Farbe des Abschnitts darüber */
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1440v8C1140 70 300 70 0 8z'/%3E%3C/svg%3E") top / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1440v8C1140 70 300 70 0 8z'/%3E%3C/svg%3E") top / 100% 100% no-repeat;
	pointer-events: none;
}
/* Abschnitt darüber weiss → Rundung weiss */
.pf-blockwrap:has(> .vb-section:not(.vb-section--warm)) + .pf-blockwrap > .vk-evening::before,
.vb-section:not(.vb-section--warm):not(.vb-section--dark) + .vk-evening::before { background: var(--vb-bg); }
/* Warmes Licht («Sonnenuntergang») hinter dem Inhalt */
.vk-evening__glow {
	position: absolute; z-index: -1;
	width: 900px; height: 900px; left: -300px; top: 80px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(var(--vb-primary-rgb), .22) 0%, rgba(var(--vb-accent-rgb), .18) 35%, transparent 70%);
	pointer-events: none;
}
.vk-evening .vb-h1 { font-size: var(--vb-fs-h2) !important; }
.vk-evening .vb-text { margin: 0 0 28px !important; }

.vk-evening__media { position: relative; }
.vk-evening__media .vb-img { aspect-ratio: 4 / 5; box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); }
.vk-evening__media .vb-img img { top: -6%; bottom: auto; height: 112% !important; }
.vk-evening__logo {
	position: absolute; right: -18px; bottom: -18px;
	width: 120px; height: 120px; padding: 18px;
	display: flex; align-items: center; justify-content: center;
	border-radius: var(--vb-radius);
	background: var(--vb-dark);
	box-shadow: 0 16px 40px -12px rgba(0,0,0,.7);
	border: 1px solid rgba(255,255,255,.12);
}
.vk-evening__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }

.vk-evening__links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.vk-evening__social {
	width: 50px; height: 50px; display: inline-flex; align-items: center; justify-content: center;
	border-radius: var(--vb-radius-btn);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
	color: var(--vb-on-dark) !important;
	transition: background .25s, color .25s;
}
.vk-evening__social svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vk-evening__social:hover { background: var(--vb-primary); color: var(--vb-on-primary) !important; box-shadow: none; }

.vk-evening__events { margin-top: calc(var(--vb-space) * .9); }

@media (max-width: 960px) {
	.vk-evening { padding-top: calc(var(--vb-space) + 80px); }
	.vk-evening__media .vb-img { aspect-ratio: 4 / 3; }
	.vk-evening__logo { width: 90px; height: 90px; right: 12px; bottom: -22px; padding: 12px; }
}