/* CE Weihnachts-Popup – Farben angelehnt an die Weihnachts-Section */
.cewp-popup {
	--cewp-navy: #1f4e79;
	--cewp-gelb: #f5c518;
	--cewp-gelb-hell: #fff6d6;
	--cewp-blau: #2f6fc0;
	--cewp-text: #5a5f66;

	position: fixed;
	z-index: 99999;
	width: 340px;
	max-width: calc(100vw - 32px);
	background: #fff;
	border-radius: 18px;
	box-shadow: 0 18px 50px rgba(15, 35, 60, 0.22), 0 2px 8px rgba(15, 35, 60, 0.08);
	overflow: hidden;
	font-family: inherit;
	text-align: left;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .45s ease, transform .45s cubic-bezier(.2, .9, .3, 1.15), visibility 0s linear .45s;
}

/* Positionen + Einflugrichtung */
.cewp-mitte        { left: 50%;   top: 50%;     width: 400px; transform: translate(-50%, calc(-50% + 24px)) scale(.97); }
.cewp-unten-rechts { right: 24px; bottom: 24px; transform: translateY(30px); }
.cewp-unten-links  { left: 24px;  bottom: 24px; transform: translateY(30px); }
.cewp-oben-rechts  { right: 24px; top: 24px;    transform: translateY(-30px); }
.cewp-oben-links   { left: 24px;  top: 24px;    transform: translateY(-30px); }

.cewp-popup.cewp-sichtbar {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
	transition: opacity .45s ease, transform .45s cubic-bezier(.2, .9, .3, 1.15), visibility 0s;
}
.cewp-mitte.cewp-sichtbar { transform: translate(-50%, -50%) scale(1); }

/* Leicht abgedunkelter Hintergrund (nur bei mittiger Position) */
.cewp-backdrop {
	position: fixed;
	inset: 0;
	z-index: 99998;
	background: rgba(15, 35, 60, 0.35);
	opacity: 0;
	visibility: hidden;
	transition: opacity .45s ease, visibility 0s linear .45s;
}
.cewp-backdrop.cewp-sichtbar {
	opacity: 1;
	visibility: visible;
	transition: opacity .45s ease, visibility 0s;
}

/* Schließen-Button – mit !important gegen globale Theme-/Elementor-Button-Stile abgesichert */
.cewp-popup .cewp-close {
	position: absolute !important;
	top: 10px !important;
	right: 10px !important;
	left: auto !important;
	bottom: auto !important;
	z-index: 3 !important;
	width: 32px !important;
	height: 32px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: #ffffff !important;
	color: #1f4e79 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: 0 !important;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
	transition: transform .2s ease !important;
}
.cewp-popup .cewp-close .cewp-x,
.cewp-popup .cewp-close .cewp-x::before,
.cewp-popup .cewp-close .cewp-x::after {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}
.cewp-popup .cewp-close .cewp-x { width: 0 !important; height: 0 !important; background: none !important; }
.cewp-popup .cewp-close .cewp-x::before,
.cewp-popup .cewp-close .cewp-x::after {
	content: "" !important;
	width: 15px !important;
	height: 2.2px !important;
	border-radius: 2px !important;
	background: #1f4e79 !important;
}
.cewp-popup .cewp-close .cewp-x::before { transform: translate(-50%, -50%) rotate(45deg) !important; }
.cewp-popup .cewp-close .cewp-x::after  { transform: translate(-50%, -50%) rotate(-45deg) !important; }
.cewp-popup .cewp-close:hover,
.cewp-popup .cewp-close:focus { background: #ffffff !important; color: #1f4e79 !important; transform: rotate(90deg); }
.cewp-popup .cewp-close:focus-visible { outline: 2px solid #2f6fc0 !important; outline-offset: 2px !important; }

/* Bild */
.cewp-bild { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.cewp-bild img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 6s ease;
}
.cewp-sichtbar .cewp-bild img { transform: scale(1.06); }

/* Dezenter Schneefall über dem Bild */
.cewp-schnee { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.cewp-schnee span {
	position: absolute;
	top: -10px;
	border-radius: 50%;
	background: #fff;
	opacity: 0;
	filter: blur(.4px);
	box-shadow: 0 0 4px rgba(255, 255, 255, 0.8);
	animation-name: cewp-fallen;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
@keyframes cewp-fallen {
	0%   { transform: translate(0, 0); opacity: 0; }
	10%  { opacity: .85; }
	50%  { transform: translate(10px, 120px); }
	90%  { opacity: .7; }
	100% { transform: translate(-6px, 250px); opacity: 0; }
}

/* Inhalt */
.cewp-inhalt { padding: 18px 22px 22px; }
.cewp-mitte .cewp-inhalt { padding: 22px 26px 26px; }

.cewp-badge {
	display: inline-block;
	margin-bottom: 8px;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--cewp-gelb-hell);
	color: #c99a00;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.cewp-titel {
	margin: 0 0 6px !important;
	color: var(--cewp-navy);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
}
.cewp-mitte .cewp-titel { font-size: 23px; }

.cewp-text {
	margin: 0 0 16px !important;
	color: var(--cewp-text);
	font-size: 14.5px;
	line-height: 1.5;
}

.cewp-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 22px;
	border-radius: 999px;
	background: var(--cewp-blau);
	color: #fff !important;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
	transition: background .2s ease, gap .2s ease;
}
.cewp-button:hover { background: var(--cewp-navy); gap: 12px; }
.cewp-button:focus-visible { outline: 2px solid var(--cewp-gelb); outline-offset: 3px; }

/* Smartphone */
@media (max-width: 600px) {
	.cewp-mitte { width: calc(100vw - 32px); }
	.cewp-mitte .cewp-inhalt { padding: 16px 18px 20px; }
	.cewp-mitte .cewp-titel { font-size: 19px; }
	.cewp-mitte .cewp-text { font-size: 14px; }

	/* Eck-Varianten werden zur kompakten Leiste */
	.cewp-popup:not(.cewp-mitte) {
		left: 16px !important;
		right: 16px !important;
		width: auto;
		max-width: none;
		display: flex;
		align-items: stretch;
		border-radius: 14px;
	}
	.cewp-unten-rechts, .cewp-unten-links { bottom: 16px; }
	.cewp-oben-rechts, .cewp-oben-links { top: 16px; }
	.cewp-popup:not(.cewp-mitte) .cewp-bild { flex: 0 0 34%; aspect-ratio: auto; }
	.cewp-popup:not(.cewp-mitte) .cewp-inhalt { padding: 14px 40px 14px 14px; }
	.cewp-popup:not(.cewp-mitte) .cewp-badge,
	.cewp-popup:not(.cewp-mitte) .cewp-text { display: none; }
	.cewp-popup:not(.cewp-mitte) .cewp-titel { font-size: 16px; }
	.cewp-popup:not(.cewp-mitte) .cewp-button { padding: 8px 16px; font-size: 14px; }
	.cewp-popup .cewp-close { top: 8px !important; right: 8px !important; width: 30px !important; height: 30px !important; }
}

/* Mittiges Popup darf nie höher als der Bildschirm werden */
.cewp-mitte {
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow-y: auto;
	overscroll-behavior: contain;
}

/* Niedrige Bildschirme (Handy quer): Bild links, Text rechts */
@media (max-height: 600px) and (min-width: 480px) {
	.cewp-mitte {
		width: min(620px, calc(100vw - 32px));
		display: flex;
		align-items: stretch;
	}
	.cewp-mitte .cewp-bild { flex: 0 0 42%; aspect-ratio: auto; }
	.cewp-mitte .cewp-inhalt { padding: 18px 22px; display: flex; flex-direction: column; justify-content: center; }
	.cewp-mitte .cewp-badge { margin-bottom: 6px; align-self: flex-start; }
	.cewp-mitte .cewp-titel { font-size: 19px; }
	.cewp-mitte .cewp-text { font-size: 13.5px; margin-bottom: 12px !important; }
	.cewp-mitte .cewp-button { align-self: flex-start; padding: 9px 18px; font-size: 14px; }
}

/* Touch-Geräte: größere Tipp-Fläche fürs X */
@media (pointer: coarse) {
	.cewp-popup .cewp-close { width: 38px !important; height: 38px !important; top: 8px !important; right: 8px !important; }
	.cewp-popup .cewp-close:hover, .cewp-popup .cewp-close:focus { transform: none; }
	.cewp-popup .cewp-close .cewp-x::before, .cewp-popup .cewp-close .cewp-x::after { width: 16px !important; }
}

/* Weniger Bewegung, wenn im System so eingestellt */
@media (prefers-reduced-motion: reduce) {
	.cewp-popup, .cewp-popup.cewp-sichtbar, .cewp-bild img { transition: opacity .2s ease, visibility 0s; }
	.cewp-bild img, .cewp-sichtbar .cewp-bild img { transform: none; }
	.cewp-schnee { display: none; }
}

/* Pfeil im Button gegen Theme-Stile absichern */
.cewp-popup .cewp-button svg { display: inline-block !important; width: 16px !important; height: 16px !important; flex: 0 0 16px; }
.cewp-popup .cewp-button svg path { fill: none !important; stroke: #ffffff !important; stroke-width: 2 !important; }