/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
*/
/**

    var(--theme-palette-color-1); you can use this as your primary brand colour.
    var(--theme-palette-color-2); alternative colour, used usually for the hover action 
    var(--theme-palette-color-3); colour used for general text paragraphs
    var(--theme-palette-color-4); colour used for headings, subheadings and titles 
    var(--theme-palette-color-5); colour used for borders
    var(--theme-palette-color-6); #778d7a;  colour used for subtle backgrounds (page hero, footer)
    var(--theme-palette-color-7); colour used for the site’s background
    var(--theme-palette-color-8); lighter alternative colour, to be used in header backgrounds

	Blocksy Querys:
	@media (max-width: 767px) {}
	@media (min-width: 768px) {}
	@media (max-width: 999px) {}

*/


				.otgs-development-site-front-end {
					display: none;
				}







	/* lose und freie Klassen 
	__________________________________________________________________________________*/

		/* https://www.joshwcomeau.com/shadow-palette/ */
		:root {
			  --shadow-color: 0deg 0% 71%;
			  --shadow-elevation-low:
				0.1px 0.2px 0.3px hsl(var(--shadow-color) / 0.35),
				0.5px 0.8px 1.1px -2.3px hsl(var(--shadow-color) / 0.38);
			  --shadow-elevation-medium:
				0.1px 0.2px 0.3px hsl(var(--shadow-color) / 0.33),
				0.7px 1.1px 1.5px -1.2px hsl(var(--shadow-color) / 0.35),
				2.5px 4.2px 5.6px -2.3px hsl(var(--shadow-color) / 0.37);
			  --shadow-elevation-high:
				0.1px 0.2px 0.3px hsl(var(--shadow-color) / 0.31),
				0.9px 1.5px 2px -0.5px hsl(var(--shadow-color) / 0.31),
				1.8px 3.1px 4.1px -0.9px hsl(var(--shadow-color) / 0.32),
				3.4px 5.7px 7.7px -1.4px hsl(var(--shadow-color) / 0.33),
				6.1px 10.4px 13.9px -1.8px hsl(var(--shadow-color) / 0.34),
				10.6px 17.8px 23.9px -2.3px hsl(var(--shadow-color) / 0.35);
			}
			.schatten-small { box-shadow: var(--shadow-elevation-low); }
			.schatten 		{ box-shadow: var(--shadow-elevation-medium); }	
			.schatten-large { box-shadow: var(--shadow-elevation-high); }


				/* @link https://utopia.fyi/type/calculator?c=320,17,1.2,1290,18,1.414,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 

				:root {
				  --step--2: clamp(0.5627rem, 0.7956rem + -0.289vw, 0.7378rem);
				  --step--1: clamp(0.7956rem, 0.915rem + -0.1481vw, 0.8854rem);
				  --step-0: clamp(1.0625rem, 1.0419rem + 0.1031vw, 1.125rem);
				  --step-1: clamp(1.275rem, 1.1708rem + 0.5208vw, 1.5908rem);
				  --step-2: clamp(1.53rem, 1.2927rem + 1.1865vw, 2.2493rem);
				  --step-3: clamp(1.836rem, 1.3924rem + 2.2178vw, 3.1805rem);
				  --step-4: clamp(2.2032rem, 1.4464rem + 3.7841vw, 4.4973rem);
				  --step-5: clamp(2.6438rem, 1.4182rem + 6.1284vw, 6.3592rem);
				}*/


				/* @link https://utopia.fyi/type/calculator?c=320,17,1.2,1290,18,1.38,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

:root {
  --step--2: clamp(0.5907rem, 0.7864rem + -0.2427cqi, 0.7378rem);
  --step--1: clamp(0.8152rem, 0.9086rem + -0.1158cqi, 0.8854rem);
  --step-0: clamp(1.0625rem, 1.0419rem + 0.1031cqi, 1.125rem);
  --step-1: clamp(1.275rem, 1.1835rem + 0.4577cqi, 1.5525rem);
  --step-2: clamp(1.53rem, 1.328rem + 1.0102cqi, 2.1425rem);
  --step-3: clamp(1.836rem, 1.4663rem + 1.8484cqi, 2.9566rem);
  --step-4: clamp(2.2032rem, 1.584rem + 3.0959cqi, 4.0801rem);
  --step-5: clamp(2.6438rem, 1.6585rem + 4.9265cqi, 5.6305rem);
}


	h1 { 
		word-wrap: break-word; /* Für ältere Browser */
 		overflow-wrap: break-word; /* Die moderne Eigenschaft */
		margin-top: 0 !important; 
		margin-bottom: 0.75em !important; 
		  text-shadow:
			-1px -1px 0 #ffffff,
			1px -1px 0 #ffffff,
			-1px 1px 0 #ffffff,
			1px 1px 0 #ffffff,
		   /* Schatten darunter */
			8px 8px 14px rgba(0, 0, 0, 0.8);
	}


.wp-block-group > h1,
.wp-block-group > h2,
.entry-content > h2,
.wp-block-group > h3,
.wp-block-group > h4 { margin-top: 0em !important; }


			h2, .h2-groesse h1 { margin-top: 1em !important; margin-bottom: 0.75em !important; }
			h3 { margin-bottom: 0.5em !important; }
			h4 { margin-bottom: 1em;  }
			h5 { margin-bottom: 1em; }

			p { font-size: var(--step-0); margin-bottom: 0.875em !important; }
			.bottom-0 { margin-bottom: 0px !important; }
			.small { font-size: var(--step--1); }
			.xsmall { font-size: var( --step--2); }
			.large { font-size: var( --step-4); }
			.xlarge { font-size: var( --step-5); }

			hr.wp-block-separator.is-style-default {
				border-top: 1px solid #999;
				width: 100%;
				margin: 12px auto !important; }



			b, strong { font-weight: 500 !important; }

			.small { font-size: 0.875em; }
			.blocksatz { text-align: justify; hyphens: auto }

			/*.wp-block-quote p { 
				font-size: var(--step-4);
				line-height: 1.2em;
				} 
				.wp-block-quote cite { 
					font-size: var(--step-2) !important;
					text-align: right;
					line-height: 1em;
					} */

			.kolumnen div.stk-block-content,
			.kolumnen div.tpgb-column-inner,
			.kolumnen {
				column-count:  2;
				column-width: 400px;
				column-gap: 4em;
				column-rule: 1px solid rgba(0,0,0,0.15);
				display: block;
				hyphens: auto;
				}
				.margin-bottom-0 { margin-bottom: 0 !important; }


			.radius,
			.wp-block-image img,
			.blocks-gallery-item img,
			.wp-block-gallery img { 
				border-radius: 6px !important; 
			}



			figure.wp-block-image:not(.alignright):not(.alignleft) {
				margin-top: 3%;
				margin-bottom: 3%;
			}

			@media (max-width: 767px) {
				
				figure.wp-block-image.alignright,
				figure.wp-block-image.alignleft {
					max-width: 30%;
				}
			}
				

			figure.wp-block-gallery { margin-top: 2%; margin-bottom: 4%; }




			.wp-block-media-text.has-media-on-the-right {
				margin-bottom: 0.875em !important;
			}
			.wp-block-media-text figure {
				border-radius: 3px;
				min-height: 450px !important;
				}
				.wp-block-media-text .wp-block-media-text__content {
					padding: 0 12% 0 0;
				}
				.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
					margin-bottom: -0.875em !important;
				}
				@media (max-width: 600px) {
					.wp-block-media-text .wp-block-media-text__content {
						margin-top: 1em;
					}
				}







					/* Tabellen
					__________________________________________________________________________________*/

					/* Styling für die komplette Tabelle */

					.wp-block-table table {
						border-collapse: collapse;
						width: auto;
						table-layout: auto;
						border-spacing: 2px;
						border: none;
					}

					/* Tabellenkopf-Styling */
					.wp-block-table table thead {
						border: 0px;
					}

					.wp-block-table table thead tr {
						background-color: transparent;
						border-color: var(--theme-palette-color-6);
						border: 0px;
					}
					.wp-block-table table thead tr th {
						background-color: var(--theme-palette-color-2) ;
						color: var(--theme-palette-color-6) ;
						border-color: var(--theme-palette-color-6) ;
						border: 2px;
					}
					.wp-block-table table thead th:first-child {
						border-radius: 6px 0 0 6px;
					}
					.wp-block-table table thead th:last-child {
						border-radius: 0 6px 6px 0;
					}

					/* Stil für alle Zellen (Header und Daten) */
					.wp-block-table table th,
					.wp-block-table table td {
						border: 0 !important;
						border-right: 2px solid var(--theme-palette-color-6) !important;
						padding: 0.5em 1em; 
						vertical-align: top;
						line-height: 1.2em;
					}
					.wp-block-table table th:last-child,
					.wp-block-table table td:last-child {
						border-right: 0 !important;
					}

					/* Stil für die Teilem*/
					.wp-block-table table tr {
						border-radius: 6px;
						border: 2px solid var(--theme-palette-color-6);	
						background-color: var(--theme-palette-color-6);
					}

					/* Stil für die erste Spalte */
					.wp-block-table table th:first-child,
					.wp-block-table table td:first-child {
					}

					/* Styling für abwechselnde Zeilen */
					.wp-block-table table tbody tr:nth-of-type(even) {
						background-color: #D4D8D0;
					}
					/* Styling für abwechselnde Zeilen 
					.wp-block-table table tbody tr:nth-of-type(odd) {
						background-color: rgba(255,255,255,0.25);
					}
					*/

					/* Entferne den unteren Rahmen für die letzte Zeile */
					.wp-block-table table tbody tr:last-child td {
						border-bottom: none !important;
					}

					/* Hover-Effekt für die Zeilen */
					.wp-block-table table tbody tr:hover {
						background-color: rgba(145,103,29,0.5);
					}


					@media (max-width: 767px) { 

						/* Stil für alle Zellen (Header und Daten) */
							.wp-block-table table th,
							.wp-block-table table td,
							.wp-block-table table th:first-child, 
							.wp-block-table table td:first-child {
								padding: 0.5em 0.5em;  
								font-size: 0.8em;
							}
					}


				table tr.steinserie { 
						background-color: var(--theme-palette-color-4); 
						color: var(--theme-palette-color-6); 
						border-top: 12px solid;
						border-bottom: 24px solid;
						text-align: center
					}


				





	/* Header 
	__________________________________________________________________________________*/

		.default-logo {
			   transform-origin: center center;
			}

			.default-logo:hover {
			  animation: swing-elastic 0.8s forwards;
			}

			@keyframes swing-elastic {
			  0% {
				transform: rotate(0deg);
				filter: blur(0);
			  }
			  35% {
				transform: rotate(-6deg); /* gegen Uhrzeigersinn */
			  }
			  60% {
				transform: rotate(2deg); /* Überschwingen */
			  }
			  80% {
				transform: rotate(-1deg); /* kleines Nachschwingen zurück */
			  }
			  100% {
				transform: rotate(0deg); /* Startposition */
			  }
			}

			@media (min-width: 1000px) {

					#header [data-row*=top] [data-column=start],
					#header [data-row*=top] [data-column=end]{
						pointer-events: none;
						overflow: visible;
					}
			}

					#header [data-row*=top] .ct-container-fluid { 
						margin-left: 0; 
						margin-right: 0;
						height: 0;
						overflow: visible;
						width: 100%;
					}





			/* Hintergrundbild zum Logo-Container hinzufügen 
			_____________________________________________________________________*/

				[data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
						 pointer-events: auto;
						 margin: 12px 0 0 12px;
					}


			/* Logoanimation
			_____________________________________________________________________*/
				.site-branding {
				  background-image: url('/wp-content/uploads/2025/08/header_ecke-links.svg');
				  background-repeat: no-repeat;
				  background-position: left center; /* oder je nach Wunsch */
				  background-size: contain; /* oder cover, je nach Effekt */ 
				}

				.site-logo-container {
					filter: drop-shadow(6px 6px 26px rgba(0, 0, 0, 0.25));
				}




			/* Header rechts oben - Hintergrundbild und Anordnung der Elemente
			_____________________________________________________________________*/

				[data-header*="type-1"]  [data-column=end]>[data-items=primary] {	
					background-image: url('/wp-content/uploads/2025/08/header_ecke-rechts.svg');
					background-repeat: no-repeat;
					background-position: right center; /* oder je nach Wunsch */
					background-size: contain; /* oder cover, je nach Effekt */ 
				  }

					  /* Flexcontainer vertikal und rechtsbündig */
					  [data-column="end"] [data-items="primary"] {
						padding: 20px 48px 48px 48px;
						display: flex !important;
						flex-direction: column !important;
						align-items: flex-end !important; /* Rechtsbündig */
						width: 100%;
						padding-right: 15px; /* Abstand zum rechten Rand */
					  }

					  /* Sprache, Socials, Suche */
					  [data-column="end"] [data-items="primary"] > div,
					  [data-column="end"] [data-items="primary"] > button {
						width: auto; /* Nur so breit wie Inhalt */
						padding: 10px 0;
					  }

					  /* Linie unter Language Switcher und Social Box */
					  [data-column="end"] [data-items="primary"] > div:nth-child(1),
					  [data-column="end"] [data-items="primary"] > div:nth-child(2) {
						border-bottom: 1px solid var(--theme-palette-color-19);
						margin-bottom: 12px !important;
						padding-bottom: 12px;
					  }



					  /* Listenelemente mit Abstand */
					  .ct-language-switcher ul.ct-language li {
						  transform: scale(1.2);
					   pointer-events: all;
					   margin: 0 8px;
					  }

					  /* Social Icons nebeneinander mit Abstand */
					  .ct-header-search.ct-toggle  {
					   pointer-events: all
					  }
					  .ct-header-socials .ct-social-box a {
						margin: 0 12px;
						pointer-events: all
					  }	



						/* Animation der Icons rechts bei Mouse-Over
						_____________________________________________________________________*/
							header .ct-header-socials  a:hover,
							button.ct-header-search:hover,
							header ul.ct-language li:hover {
								transform: scale(1.2);
								transition: all 0.3s ease !important;
										}
							header ul.ct-language li:hover { transform: scale(1.4);  }




	/* Menü 
	__________________________________________________________________________________*/		


			#menu-hauptmenue .ct-toggle-dropdown-desktop { 
				display: none;
			}
			#menu-hauptmenue > li > a.ct-menu-link {
				flex-direction: column;
			}
			header .ct-icon-container {
				  margin-inline-end: 0 !important;
				  margin-bottom: 8px !important;
				  transform: scale(1.3);
				}

/*				header .ct-icon-container svg {
					fill: var(--theme-palette-color-2) !important;
				}
header .ct-icon-container:hover svg {
					fill: var(--theme-palette-color-16) !important;
				}*/
				#menu-hauptmenue .ct-icon-container.ct-left {
					  margin-inline-end: 0 !important;
					  margin-right: 0 !important;
					  margin-bottom: 0;
					  transform: scale(1);
					}
			#menu-hauptmenue li:hover .ct-icon-container.ct-left {
					  transform: scale(1.2);
					  margin-bottom: 16px;	
					}

			#offcanvas .ct-panel-content-inner {
				overflow: visible;
			}

			  header .ct-icon, 
			  header .ct-icon-container svg { height: auto !important;	}


@media (max-width: 999px) {
	
	#offcanvas .menu-item li a { padding: 8px 0; }
	#offcanvas .menu-item  li a.ct-column-heading { font-size: 1em;}	
	
}







	/* Inhalte
	__________________________________________________________________________________*/




					.wp-block-stackable-image.bild-gedreht-hintergrund .stk-img-wrapper {
					  position: relative;
					  display: inline-block; 
					  z-index: 0;
					  overflow: visible; /* wichtig */
					}

					.wp-block-stackable-image.bild-gedreht-hintergrund .stk-img-wrapper img {
					  border-radius: 8px; 
					  position: relative;
					  z-index: 2;
					}

					.wp-block-stackable-image.bild-gedreht-hintergrund .stk-img-wrapper::after {
					  content: "";
					  position: absolute;
					  top: 5px;
					  left: 25px;
					  width: 100%;
					  height: 100%;
					  background-color: var(--theme-palette-color-1);
					  opacity: 0.5;
					  border-radius: 8px;
					  transform: rotate(2deg);
					  transform-origin: top left;
					  z-index: 1;
					  pointer-events: none;
					  box-shadow: 10px 10px 10px rgba(0,0,0,0.2);
					}







				.infoblock  {
					padding: var(--wp--preset--spacing--60);
					border-radius: 6px;
					background-color: var(--theme-palette-color-18);
					}
					.infoblock figure.alignfull {
						margin-left: calc(var(--wp--preset--spacing--60) * -1);
						margin-right: calc(var(--wp--preset--spacing--60) * -1);
					}
					@media (max-width: 767px) {
						.infoblock  { padding: var(--wp--preset--spacing--30); }
						.infoblock figure.alignfull {
							margin-left: calc(var(--wp--preset--spacing--30) * -1);
							margin-right: calc(var(--wp--preset--spacing--30) * -1);
						}

			}

				.feature-box  {
				  transition: transform 0.3s ease, box-shadow 0.3s ease;
					}
				.feature-box:hover {	
					box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
					transform: scale(1.05);
				}



				


				.stempelkasten-startseite {
					transform: translateX(60%);
					max-width: 20vw;
				}
					@media (max-width: 999px) {
						.stempelkasten-startseite { 
							max-width: 35vw; 
						}
					}	





				/* Buttons für Wanderkaiserliste  
				_____________________________________________________________________*/

				/* Styling für alle Bildschirmgrößen (Standard: vertikal) */
				.navigationsbutton {
					display: block; 
					width: auto; 
					margin-bottom: 10px;
					text-align: center;
					padding: 1em;
					white-space: nowrap;
					}
					#kaiserliste .navigationsbutton {
						width: 100%; 
					}

				/* Anpassungen an den Blocksy-Button-Stilen */
				.navigationsbutton.ct-button {
					--theme-button-text-initial-color: var(--theme-button-background-initial-color);
					border-width: 2px;
					border-style: solid;
					color: var(--theme-button-text-initial-color);
					border-color: var(--theme-button-background-initial-color);
					background-color: rgba(0, 0, 0, 0);
					}
					.navigationsbutton.ct-button:hover {
						color: var(--theme-button-text-hover-color);
						border-color: var(--theme-button-background-hover-color);
						background-color: var(--theme-button-background-hover-color);
					}

				/* Styling für den aktuellen, aktiven Button */
				.navigationsbutton.is-current {
					background-color: var(--theme-palette-color-2) !important;
					border-color: var(--theme-palette-color-2);
					color: var(--theme-palette-color-6) !important;
					pointer-events: none;
				}

				/* --- Responsive Layout (Mobile Slider) ab 999px oder kleiner --- */
				@media (max-width: 999px) {
					/* Container für den Slider */
					.navigationsbutton-wrapper {
						display: flex;
						flex-wrap: nowrap;
						overflow-x: auto;
						-webkit-overflow-scrolling: touch;
						gap: 10px;
						padding-bottom: 20px;
					}

					/* Styling der Buttons im Slider */
					.navigationsbutton {
						flex: 0 0 auto;
						width: auto;
						display: inline-block;
						margin-bottom: 0;
						padding: 1em;
					}
				}




















	/* Footer 
	__________________________________________________________________________________*/



		/* Alle 4 Widget Areas als Flex-Container mit vertikaler Ausrichtung */
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-2"],
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-3"],
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-4"],
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-5"] {
					display: flex;
					flex-direction: column;
					height: 100%; /* Wichtig, damit Flexbox den verfügbaren Raum kennt */
				}

				/* Letztes Element jeder Widget Area nach unten schieben */
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-2"] > :last-child,
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-3"] > :last-child,
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-4"] > :last-child,
				[data-footer*="type-1"] .ct-footer [data-column="widget-area-5"] > :last-child {
					margin-top: auto;
				}





			footer h3 { 
				font-size: var( --step-1) !important; 
				margin-bottom: 0 0.5em 0 0 !important;
				color: var(--theme-palette-color-6);
				}   



				/* Buttons im Footer
				__________________________________________________________________________________*/

				footer .wp-block-buttons .wp-block-button.is-style-outline .wp-block-button__link {
					border-width: 1px;
					border-style: solid;
					color: var(--theme-palette-color-6) !important;
					border-color: var(--theme-palette-color-18);
					background-color: var(--theme-palette-color-2);
				}
				footer .wp-block-buttons .wp-block-button.is-style-outline .wp-block-button__link:hover {
					border-width: 1px;
					border-style: solid;
					color: var(--theme-palette-color-6) !important;
					border-color: var(--theme-palette-color-6);
					background-color: var(--theme-palette-color-1);
				}



					/* Suchbox im Footer
					__________________________________________________________________________________*/
							.ct-search-box.suche-footer {
								padding: 1px !important;
								background-color: var(--theme-palette-color-6);
								border-radius: 6px;
							}
							.ct-search-box.suche-footer button {
								background-color: var(--theme-palette-color-2);
								border-radius: 6px !important;
							}




					/* Aktuelles im Footer
					__________________________________________________________________________________*/
						#footer .ct-widget.is-layout-flow article {
							border-bottom: 1px solid var(--theme-palette-color-18);
							}

						#footer .ct-widget.is-layout-flow article:last-child {
							border-bottom: none;
							}









					/* Stache Kalender
					__________________________________________________________________________________*/

							footer .stec-widget-events-list {
								background-color: #ffffff00;
								font-family: var(--main-font-family);
								line-height: 1;
								padding: 0;
							}

							footer .stec-widget-events-list-event-preview {
								background-color: #ffffff00;
								padding: 1em 0;
								border-bottom: 1px solid var(--theme-palette-color-18) !important;
								}
								footer .stec-widget-events-list-event-preview:first-child {
									padding-top: 0;
									}
								footer .stec-widget-events-list-event-preview:last-child {
									border-bottom: none !important;
									padding-bottom: 0;
									}
								footer .stec-widget-events-list-event-preview:hover{
										background-color: #ffffff00;
										color: #fff;
									}

								footer .stec-widget-events-list-event-preview .stec-widget-events-list-event-preview-content .stec-widget-events-list-event-preview-content-primary .stec-widget-events-list-event-preview-content-title {
									color:  var(--theme-palette-color-6) !important;
									font-size: inherit;
									font-weight: inherit;
								}

								footer .stec-widget-events-list-event-preview .stec-widget-events-list-event-preview-content-secondary span, .stec-widget-events-list-event-preview .stec-widget-events-list-event-preview-content-secondary stec-span {
									color:  var(--theme-palette-color-6) !important;
									font-size: 0.875em;
									line-height: 1.5;
									margin-top: 5px;
									font-weight: 200;
									opacity: 0.7;
								}

								footer .stec-widget-events-list-event-preview .stec-widget-events-list-event-preview-content-secondary stec-span i {
									color:  var(--theme-palette-color-6) !important;
								}



					/* Suche im Footer
					-------------------------------------*/
						footer .ct-search-form input:focus~.ct-search-form-controls select, 
						footer .ct-search-form input:focus~.ct-search-form-controls [data-button*=inside] {
							background-color: var(--theme-palette-color-1);
						}



					/* Newsletteranmeldung im Footer
					-------------------------------------*/
						.newsletter-form {
						  display: flex;
						  background-color: var(--theme-palette-color-6);
						  padding: 2px;
						  border-radius: 6px;
						  width: 100%; /* Formular nimmt volle Breite des Containers ein */
						  max-width: 500px; /* optional, damit es nicht zu breit wird */
						  box-sizing: border-box;
						  margin-bottom: 0.25em !important;
						}

						.newsletter-form input[type="email"] {
						  flex: 1 1 auto; /* flexibel wachsen & schrumpfen, Standardbasis auto */
						  padding: 0.5em 1em;
						  border: none;
						  outline: none;
						  font-size: 0.875em;
						  background-color: var(--theme-palette-color-6);
						  color: #000000;
						  box-sizing: border-box;
						  min-width: 0; /* wichtig für korrektes Schrumpfen im Flex */
						}

						/* Optional: falls der Browser eigene Farbstile bei Fokus setzt */
						.newsletter-form input[type="email"]:focus {
						  color: #000000;
						}
						/* Optional: Auch für den Placeholder (damit er nicht weiß wird) */
						.newsletter-form input[type="email"]::placeholder {
						  color: #000; /* z.B. ein dunkles Grau */
						}

						.newsletter-form button {
						  background-color: var(--theme-palette-color-2);
						  color: var(--theme-palette-color-6);
						  border: none;
						  padding: 0.5em 1em;
						  transition: background-color 0.3s ease;
						  cursor: pointer;
						  font-weight: 500;
						  flex-shrink: 0; /* Button nicht schrumpfen lassen */
						}

						.newsletter-form button:hover,
						.newsletter-form button:focus {
						  background-color: var(--theme-palette-color-1);
						  transform: translate(0,0);
						}











	/* Plugins 
	__________________________________________________________________________________*/


			/* Blocksy
			-------------------------------------*/

			.ct-icon-container { margin-bottom: 2px; }

			.ct-popup { 
				-webkit-backdrop-filter: blur(6px);
				backdrop-filter: blur(6px);  	
			}




			[class*=ct-contact-info] li { grid-column-gap: 5px !important;	}

			.ct-shortcuts-container {
				z-index: 99 !important;
			}
			.ct-shortcuts-bar-items,
				[data-header*="type-1"] #offcanvas {
					-webkit-backdrop-filter: blur(6px);
					backdrop-filter: blur(6px);
				}







			/* Complianz
			-------------------------------------*/
				#cmplz-cookies-overview .cmplz-dropdown p, 
				#cmplz-document .cmplz-dropdown p, 
				#cmplz-document li, 
				#cmplz-document p, 
				#cmplz-document td {
					font-size: 1rem;
				}

				#cmplz-document.impressum h2, 
				#cmplz-document.impressum h3 {
					font-size: 1.5rem;
					margin-top: 1.5em;
					margin-bottom: 0 !important;			
					color: var(--theme-palette-color-3) !important;
					opacity: 1;
				}

				#cmplz-document a {	text-decoration: none; }
				#cmplz-document b { font-weight: 700; }
				#cmplz-document h2, #cmplz-document h3 { margin-top: 2em !important; margin-bottom: 0 !important; }











			/* Stackable Blocks 
			__________________________________________________________________________________*/

					.stackable-container {
						  padding-top: 8% !important;
						  padding-bottom: 8% !important;
						  }
						.stackable-container-oben { padding-top: 8% !important; }
						.stackable-container-unten {padding-bottom: 8% !important; }
							
								.stackable-container-halb {
									  padding-top: 4% !important;
									  padding-bottom: 4% !important;
								  }
								.stackable-container-oben-halb  { padding-top: 4% !important; }
								.stackable-container-unten-halb  {padding-bottom: 4% !important; }


				   .liste-mit-linien ul li {
						list-style: none; 
						border-bottom: 1px solid rgba(255, 255, 255, 30%) !important;
						margin: 0 -0.25em;
						padding: 1.25em 0.25em;
					   }
					.circle-content-inner ul  { padding-inline-start: 0; }
					.circle-content-inner ul li { padding: 0.5em 0.25em; }


				   .liste-mit-linien ul li:last-child {
							border-bottom: none !important;
					 }


				/*  Macht Italic Text in Icon Listen nur dünner und gerade, Z.B. bei den Steinserien ____________________________ */
				.stk-block-icon-list em {
					font-weight: 300;
					font-style: normal;
					font-size: 0.875em;
				}

					.stk-block-icon-list-item__marker::before {
						font-weight: 300;
					}







					/* Counter-Blöcke ____________________________ */

					.stk-block-count-up {
						
					}

					.stk-block-count-up__text {
						line-height: 0.5em !important;
						font-weight: 700;

					}
					.stk-block-count-up__text em {
						font-size: 1.3rem;
						font-style: normal;
						font-weight: 300 !important;
						text-box: trim-both cap alphabetic;
					}

					.stk-block-count-up__text span.small {
						font-size: 0.875rem;
						font-weight: 300;
					}



















			/* Meow Lightbox
			__________________________________________________________________________________*/
				
				.mwl.visible {
					-webkit-backdrop-filter: blur(12px);
					backdrop-filter: blur(12px); 
				}
				.mwl__slider__image__thumbnail img { border-radius: 3px;}
				.mwl__topbar__controls__control--fullscreen { visibility: hidden; }


			/* WP Lightbox
			__________________________________________________________________________________*/
			.wp-lightbox-overlay .scrim {
				background-color: rgba(0,0,0,0.80) !important;
				-webkit-backdrop-filter: blur(12px);
				backdrop-filter: blur(12px);
					}
			.wp-lightbox-overlay .close-button svg {
				fill: #fff;
			}



/* Contactform 7
__________________________________________________________________________________*/


.wpcf7 label:not(.wpcf7-form-control-wrap) {
    font-size: 1em !important;
    font-weight: 400 !important;
}


	.wpcf7 input,
	.wpcf7 textarea { 	
		padding: 35px 15px 15px 15px !important;
	}

	.wpcf7 input:focus,
	.wpcf7 textarea:focus { 
                      border: 1px solid var(--theme-palette-color-1) !important;
                      box-shadow:  0 1px 1px rgba(0,0,0,0.11), 
                                    0 2px 2px rgba(0,0,0,0.11), 
                                    0 4px 4px rgba(0,0,0,0.11), 
                                    0 6px 8px rgba(0,0,0,0.11),
                                    0 8px 16px rgba(0,0,0,0.11) !important;
                      transform: scale(1.01);
                }


.wpcf7 .wpcf7-submit { 
    padding: 12px 24px 12px 24px !important;
	float: right !important;
      }


.wpcf7 form.sent .wpcf7-response-output {
    border-color: #46b450;
    border-radius: 6px;
    padding: 4%;
    text-align: center;
}




/* CONTAINER: Das äußere DIV ist der Positionierungs-Container */
.form-float-group {
    position: relative;
    margin-bottom: 24px; /* Abstand zum nächsten Feld */
}

.form-float-group.abstand-oben {
    margin-top: 48px;
}


/* WICHTIG: Stellt sicher, dass der CF7-Span (Eltern des Inputs) block-level ist */
.wpcf7-form-control-wrap {
    display: block;
}

/* Input-Feld: Basis-Styles und Padding */
.form-float-group .form-control {
    width: 100%;
    box-sizing: border-box;
    transition: all 0.2s ease;
}

/* LABEL: Positioniert das Label initial im DIV */
.form-float-group label {
    position: absolute;
    left: 15px;
    top: 0;
    transform: translateY(12px);     
    z-index: 2;
    pointer-events: none;
    transition: all 0.2s ease;
    font-size: 1em;
	font-weight: 400;
    color: #000;
}

/* LABEL-HOCHSCHALTEN: Tritt ein, wenn JS die Klasse .float-active zum DIV hinzufügt */
.form-float-group.float-active label {
    transform: translateY(4px);
	font-size: 0.8em !important;
    color: var(--theme-palette-color-1)
}





/* Charla Chatbot
__________________________________________________________________________________*/
charla-widget .widget.right,
.ng-tns-c3830281902-0 {
    right: 70px !important;
	bottom: 70px !important;
}





	/* Animationen 
	__________________________________________________________________________________*/	
		input,
		textarea,
		input[type=submit],
		select,
		label,
		tr,
		.linktext,
		.ugb-card__image,
		.ugb-card__description,
		.ugb-card .ugb-card__subtitle,
		.ugb-card .ugb-card__title,
		.tpgb-featured-image img,
		.wp-block-image img,
		.ct-icon-container,
		.card,
		.box,
		.mwl,
		.mwl__slider__image__thumbnail__high-res landscape,
		.animiert,
		.animiert div {		
			transition: all 0.3s ease !important;
			}





.pulse{-webkit-animation:pulsate-bck 4s ease-in-out infinite both;animation:pulsate-bck 4s ease-in-out infinite both}
/* ----------------------------------------------
 * Generated by Animista on 2025-10-2 9:15:31
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

@-webkit-keyframes pulsate-bck{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(.9);transform:scale(.9)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulsate-bck{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(.9);transform:scale(.9)}100%{-webkit-transform:scale(1);transform:scale(1)}}