@font-face{
	font-family:'FontAwesome';
	font-display: swap;
	src:url("/assets/addons/be_style/fonts/fontawesome-webfont.eot?v=4.7.0");
	src:url("/assets/addons/be_style/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format('embedded-opentype'),
		url("/assets/addons/be_style/fonts/fontawesome-webfont.woff2?v=4.7.0") format('woff2'),
		url("/assets/addons/be_style/fonts/fontawesome-webfont.woff?v=4.7.0") format('woff'),
		url("/assets/addons/be_style/fonts/fontawesome-webfont.ttf?v=4.7.0") format('truetype'),
		url("/assets/addons/be_style/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format('svg');
}

/* =====================================================================
   Farbdefinitionen (Kaltenbach Markenfarben + Bootstrap-Overrides)
   ===================================================================== */
:root {
  /* Kaltenbach Markenfarben */
  --kb-green: #007d83;   /* Kaltenbach Gruen (Primaerfarbe) */
  --kb-green-dark: #00293b; /* Gruen dunkel (Hover/Active + Verlauf) */
  --kb-yellow: #ebab00;  /* Kaltenbach Gelb (Highlight ohne Text) */
  --kb-orange: #e4582c;  /* Kaltenbach Orange (Highlight mit Text) */
  --kb-dark: #00121a;    /* Dunkle Schrift/Flaeche */
  --kb-gray: #4c5457;    /* Neutralgrau (Text/Border) */
  --kb-white: #ffffff;   /* Weisse Schrift */
  --kb-black: #000000;   /* Schwarz (Schatten/Overlays) */
  --kb-white-rgb: 255, 255, 255;
  --kb-black-rgb: 0, 0, 0;
  --kb-header-rgb: 237, 237, 237;
  --c-rgb-33b5e5: 51, 181, 229;
  --kb-muted: #ededed;   /* Heller Grauton / Header-/Metanavi-Grau */
  --kb-line: #cccccc;    /* Neutrale Linien/Switch-off */
  --kb-disabled: #999999; /* Deaktiviert/Platzhalter */
  --kb-gradient: linear-gradient(30deg, var(--kb-green-dark), var(--kb-green)); /* Markenverlauf Gruen dunkel -> Kaltenbach Gruen, 30 Grad */

  --bs-primary: var(--kb-green);
  --bs-primary-rgb: 0, 125, 131;
  --bs-link-color: var(--kb-green);
  --bs-link-color-rgb: 0, 125, 131;
  --bs-link-hover-color: var(--kb-green-dark);
  --bs-link-hover-color-rgb: 0, 41, 59;
  --bs-body-font-family: 'Cairo', sans-serif;

  --kb-breadcrumb-h: 2.9rem; /* Hoehe der Breadcrumb-Leiste; Megamenue startet exakt darunter */
}

/* FontAwesome 4.7: Basisklasse + genutzte Glyphen (Frontend rendert .fa-icon-Icons) */
.fa-icon { font-family: 'FontAwesome'; font-style: normal; font-weight: normal; font-variant: normal; text-rendering: auto; line-height: 1; display: inline-block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.btn .fa-chevron-right { margin-left: .4rem; }
.fa-search:before { content: "\f002"; }
.fa-bars:before { content: "\f0c9"; }
.fa-times:before { content: "\f00d"; }
.fa-arrow-right:before { content: "\f061"; }
.fa-chevron-right:before { content: "\f054"; }
.fa-chevron-down:before { content: "\f078"; }
.fa-chevron-up:before { content: "\f077"; }
.fa-chevron-left:before { content: "\f053"; }
.fa-plus:before { content: "\f067"; }
.fa-phone:before { content: "\f095"; }
.fa-envelope:before { content: "\f0e0"; }
.fa-envelope-o:before { content: "\f003"; }
.fa-home:before { content: "\f015"; }
.fa-user:before { content: "\f007"; }
.fa-fax:before { content: "\f1ac"; }
.fa-file-pdf-o:before { content: "\f1c1"; }
.fa-list-ul:before { content: "\f0ca"; }
.fa-codepen:before { content: "\f1cb"; }
.fa-dropbox:before { content: "\f16b"; }
.fa-youtube:before { content: "\f167"; }
.fa-facebook:before { content: "\f09a"; }
.fa-google:before { content: "\f1a0"; }
.fa-instagram:before { content: "\f16d"; }
.fa-linkedin:before { content: "\f0e1"; }
.fa-link:before { content: "\f0c1"; }
.fa-mobile-alt:before { content: "\f10b"; }
.fa-house:before { content: "\f015"; }

/* Consent Manager */
.consent_manager-wrapper-inner div.consent_manager-show-details a.icon-info-circled::before {
  background-color: var(--kb-green);
}
.consent_manager-wrapper-inner .consent_manager-cookiegroup-checkbox input[type="checkbox"]:checked {
	accent-color: var(--kb-green);
	filter: none;
}
.consent_manager-wrapper-inner div.consent_manager-show-details a, .consent_manager-wrapper-inner div.consent_manager-show-details a:hover, .consent_manager-wrapper-inner div.consent_manager-show-details a:visited,
.consent_manager-wrapper-inner div.consent_manager-sitelinks a, .consent_manager-wrapper-inner div.consent_manager-sitelinks a:hover, .consent_manager-wrapper-inner div.consent_manager-sitelinks a:visited,
div.consent_manager-wrapper .consent_manager-wrapper-inner div.consent_manager-detail a, div.consent_manager-wrapper .consent_manager-wrapper-inner div.consent_manager-detail a:hover, div.consent_manager-wrapper .consent_manager-wrapper-inner div.consent_manager-detail a:visited {
	color: var(--kb-green);
}
div.consent_manager-show-details .icon-info-circled {
	color: var(--kb-green) !important;
}
div.consent_manager-show-details .icon-info-circled::before {
	background-color: var(--kb-green) !important;
}
div.consent_manager-wrapper, div.consent_manager-wrapper:focus-visible {
	border: none;
	outline: none;
}

/* required styles */
.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
  user-select: none;
	user-select: none;
	-webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg,
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(var(--c-rgb-33b5e5), 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
  user-select: none;
	user-select: none;
	-webkit-user-drag: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-tile {
	will-change: opacity;
	}
.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
.leaflet-zoom-anim .leaflet-zoom-animated {
	will-change: transform;
	}
.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: var(--kb-line);
	outline: 0;
	}
.leaflet-container a {
	color: var(--kb-green);
	}
.leaflet-container a.leaflet-active {
	outline: 2px solid orange;
	}
.leaflet-zoom-box {
	border: 2px dotted var(--kb-green);
	background: rgba(var(--kb-white-rgb), 0.5);
	}


/* general typography */
.leaflet-container {
	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(var(--kb-black-rgb), 0.65);
	border-radius: 4px;
	}
.leaflet-bar a,
.leaflet-bar a:hover {
	background-color: var(--kb-white);
	border-bottom: 1px solid var(--kb-line);
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover {
	background-color: var(--kb-muted);
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: var(--kb-muted);
	color: var(--kb-line);
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(var(--kb-black-rgb), 0.4);
	background: var(--kb-white);
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(images/layers.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(images/layers-2x.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: var(--kb-gray);
	background: var(--kb-white);
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid var(--kb-line);
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path {
	background-image: url(images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: var(--kb-white);
	background: rgba(var(--kb-white-rgb), 0.7);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: var(--kb-gray);
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover {
	text-decoration: underline;
	}
.leaflet-container .leaflet-control-attribution,
.leaflet-container .leaflet-control-scale {
	font-size: 11px;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid var(--kb-gray);
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	font-size: 11px;
	white-space: nowrap;
	overflow: hidden;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;

	background: var(--kb-white);
	background: rgba(var(--kb-white-rgb), 0.5);
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid var(--kb-gray);
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid var(--kb-gray);
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(var(--kb-black-rgb), 0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 19px;
	line-height: 1.4;
	}
.leaflet-popup-content p {
	margin: 18px 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: var(--kb-gray);
	box-shadow: 0 3px 14px rgba(var(--kb-black-rgb), 0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	padding: 4px 4px 0 0;
	border: none;
	text-align: center;
	width: 18px;
	height: 14px;
	font: 16px/14px Tahoma, Verdana, sans-serif;
	color: var(--kb-line);
	text-decoration: none;
	font-weight: bold;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover {
	color: var(--kb-disabled);
	}
.leaflet-popup-scrolled {
	overflow: auto;
	border-bottom: 1px solid var(--kb-line);
	border-top: 1px solid var(--kb-line);
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	zoom: 1;
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}
.leaflet-oldie .leaflet-popup-tip-container {
	margin-top: -1px;
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid var(--kb-disabled);
	}


/* div icon */

.leaflet-div-icon {
	background: var(--kb-white);
	border: 1px solid var(--kb-gray);
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: var(--kb-white);
	border: 1px solid var(--kb-white);
	border-radius: 3px;
	color: var(--kb-dark);
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
  user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(var(--kb-black-rgb), 0.4);
	}
.leaflet-tooltip.leaflet-clickable {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: var(--kb-white);
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: var(--kb-white);
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: var(--kb-white);
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: var(--kb-white);
	}


/* =====================================================================
   Bootstrap 5 Projekt-Anpassungen (Kaltenbach)
   Ersetzt die frueheren UIkit-Overrides. Bootstrap-Core kommt aus d2u_helper.
   ===================================================================== */
.btn-primary {
  --bs-btn-bg: var(--kb-green);
  --bs-btn-border-color: var(--kb-green);
  --bs-btn-hover-bg: var(--kb-green-dark);
  --bs-btn-hover-border-color: var(--kb-green-dark);
  --bs-btn-active-bg: var(--kb-green-dark);
  --bs-btn-active-border-color: var(--kb-green-dark);
  --bs-btn-disabled-bg: var(--kb-green);
  --bs-btn-disabled-border-color: var(--kb-green);
}
/* CTA-Button (ehem. Inline-Style Modul 100 "Button mit Link") */
.btn { border-radius: 0; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-size: .9rem; }
.form-control, .form-select { border-radius: 0; }
.dropdown-menu { border-radius: 0; }
.btn-cta { font-size: 1.5rem; font-weight: 700; padding: 0.75em 1.5em; }
/* Transparenter Button (ehem. .uk-button-transprent) */
.btn-transprent, .btn-transparent { background: transparent; border: 1px solid var(--kb-white); color: var(--kb-white); }
.btn-transprent:hover, .btn-transparent:hover { background: var(--kb-green); color: var(--kb-white); }
/* Outline-Buttons in Kaltenbach-Orange */
.btn-outline-secondary {
  --bs-btn-color: var(--kb-orange);
  --bs-btn-bg: var(--kb-white);
  --bs-btn-border-color: var(--kb-orange);
  --bs-btn-hover-color: var(--kb-white);
  --bs-btn-hover-bg: var(--kb-orange);
  --bs-btn-hover-border-color: var(--kb-orange);
  --bs-btn-active-color: var(--kb-white);
  --bs-btn-active-bg: var(--kb-orange);
  --bs-btn-active-border-color: var(--kb-orange); }
.btn-outline-primary {
  --bs-btn-color: var(--kb-white);
  --bs-btn-bg: var(--kb-orange);
  --bs-btn-border-color: var(--kb-orange);
  --bs-btn-hover-color: var(--kb-white);
  --bs-btn-hover-bg: var(--kb-green);
  --bs-btn-hover-border-color: var(--kb-green);
  --bs-btn-active-color: var(--kb-white);
  --bs-btn-active-bg: var(--kb-green);
  --bs-btn-active-border-color: var(--kb-green); }
/* Grauer Sektions-Hintergrund (ehem. .uk-section-muted) */
.section-muted { background: var(--kb-muted); }
/* Kicker / Eyebrow-Text (ehem. p.uk-text-small) */
.text-kicker { color: inherit; font-weight: 400; font-style: italic; }
/* Anker-Sprungpunkt (Modul 100): Platz fuer den sticky Header freihalten, sonst landet der
   Sprungziel-Anker beim Klick auf einen Weiterleitungs-Link/Fragment-Link (#anker) unsichtbar
   dahinter. scroll-margin-top wird vom nativen Browser-Sprungverhalten respektiert. */
.anchor {
  scroll-margin-top: 90px; /* Hoehe Mobile-Header + Puffer */
}
@media (min-width: 1200px) {
  .anchor {
    scroll-margin-top: 140px; /* Hoehe Desktop-Header (8rem) + Puffer */
  }
}

/* =====================================================================
   Projekt-CSS (aus theme/private/scss/app.scss kompiliert, ohne UIkit-Core
   und ohne uk-width-Utilities). Asset-Pfade: /assets/kaltenbach/
   ===================================================================== */
/* cairo-200 - latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 200;
  src: local(""), url("/assets/kaltenbach/fonts/cairo/cairo-v10-latin-200.woff2") format("woff2"); }
/* cairo-300 - latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 300;
  src: local(""), url("/assets/kaltenbach/fonts/cairo/cairo-v10-latin-300.woff2") format("woff2"); }
/* cairo-regular - latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  src: local(""), url("/assets/kaltenbach/fonts/cairo/cairo-v10-latin-regular.woff2") format("woff2"); }
/* cairo-600 - latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 600;
  src: local(""), url("/assets/kaltenbach/fonts/cairo/cairo-v10-latin-600.woff2") format("woff2"); }
/* cairo-700 - latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 700;
  src: local(""), url("/assets/kaltenbach/fonts/cairo/cairo-v10-latin-700.woff2") format("woff2"); }
/* cairo-900 - latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 900;
  src: local(""), url("/assets/kaltenbach/fonts/cairo/cairo-v10-latin-900.woff2") format("woff2"); }
/* GeomGraphic (OTF): Light 300, Regular 400, Semibold 600, Bold 700 + Italics */
@font-face { font-family: 'GeomGraphic'; font-style: normal; font-weight: 300; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Light.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: italic; font-weight: 300; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Light_Italic.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Regular.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: italic; font-weight: 400; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Regular_Italic.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Semibold.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: italic; font-weight: 600; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Semibold_Italic.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Bold.woff2") format("woff2"); }
@font-face { font-family: 'GeomGraphic'; font-style: italic; font-weight: 700; font-display: swap; src: url("/assets/kaltenbach/fonts/geomgraphic/GeomGraphic_Bold_Italic.woff2") format("woff2"); }
.ug-gallery-wrapper,
.ug-gallery-wrapper * {
  transition: all !important;
  -o-transition: all !important;
  -webkit-transition: all;
  -moz-transition: all !important;
  -ms-transition: all !important;
  max-width: none; }

.ug-gallery-wrapper {
  z-index: 0; }

.ug-item-wrapper img {
  width: auto;
  max-width: none;
  margin: 0px;
  padding: 0px; }

.ug-videoplayer-wrapper video {
  height: 100%;
  width: 100%;
  visibility: visible !important; }

.ug-rtl {
  direction: rtl; }

.ug-gallery-wrapper {
  overflow: hidden;
  position: relative;
  font-family: Arial, Helvetica, sans-serif; }

.ug-error-message {
  text-align: center;
  padding-top: 30px;
  padding-bottom: 30px;
  font-size: 20px;
  color: var(--kb-orange); }

.ug-error-message-wrapper {
  width: 100%;
  height: 100%;
  border: 1px solid black; }

.ug-gallery-wrapper .ug-canvas-pie {
  position: absolute;
  z-index: 4; }

.ug-gallery-wrapper .ug-progress-bar {
  position: absolute;
  overflow: hidden;
  z-index: 4; }

.ug-gallery-wrapper.ug-fullscreen {
  height: 100% !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important; }

.ug-gallery-wrapper.ug-fake-fullscreen {
  position: fixed !important;
  height: auto !important;
  width: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0px !important;
  padding: 0px !important;
  top: 0px !important;
  left: 0px !important;
  bottom: 0px !important;
  right: 0px !important;
  z-index: 999999 !important; }

.ug-body-fullscreen {
  overflow: hidden !important;
  height: 100% !important;
  width: 100% !important;
  margin: 0px !important;
  padding: 0px !important; }

.ug-gallery-wrapper .ug-preloader-trans {
  display: block;
  height: 35px;
  width: 32px;
  height: 32px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader_skype_trans.gif");
  background-repeat: no-repeat; }

.ug-gallery-wrapper .ug-slider-wrapper {
  position: absolute;
  overflow: hidden;
  z-index: 1;
  background-color: var(--kb-black); }

.ug-slider-wrapper .ug-slide-wrapper {
  position: absolute; }

.ug-slide-wrapper.ug-slide-clickable {
  cursor: pointer; }

.ug-slider-wrapper .ug-slider-inner {
  position: absolute;
  z-index: 0; }

.ug-slider-wrapper .ug-item-wrapper {
  position: absolute;
  overflow: hidden; }

.ug-slider-wrapper,
.ug-item-wrapper img {
  -webkit-user-select: none;
  /* make unselectable */
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  max-width: none !important;
  box-sizing: border-box; }

.ug-slider-wrapper .ug-slider-preloader {
  position: absolute;
  z-index: 1;
  border: 2px solid var(--kb-white);
  border-radius: 6px;
  background-color: var(--kb-white);
  background-position: center center;
  background-repeat: no-repeat; }

.ug-slider-preloader.ug-loader1 {
  width: 30px;
  height: 30px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white1.gif"); }

.ug-slider-preloader.ug-loader1.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black1.gif"); }

.ug-slider-preloader.ug-loader2 {
  width: 32px;
  height: 32px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white2.gif"); }

.ug-slider-preloader.ug-loader2.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black2.gif"); }

.ug-slider-preloader.ug-loader3 {
  width: 38px;
  height: 38px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white3.gif"); }

.ug-slider-preloader.ug-loader3.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black3.gif"); }

.ug-slider-preloader.ug-loader4 {
  width: 32px;
  height: 32px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white4.gif");
  background-color: white; }

.ug-slider-preloader.ug-loader4.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black4.gif"); }

.ug-slider-preloader.ug-loader5 {
  width: 60px;
  height: 8px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white5.gif");
  background-color: white;
  border: none;
  border-radius: 0px; }

.ug-slider-preloader.ug-loader5.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black5.gif");
  border: 2px solid var(--kb-black); }

.ug-slider-preloader.ug-loader6 {
  width: 32px;
  height: 32px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white6.gif"); }

.ug-slider-preloader.ug-loader6.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black6.gif"); }

.ug-slider-preloader.ug-loader7 {
  width: 32px;
  height: 10px;
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-white7.gif");
  border-width: 3px;
  border-radius: 3px; }

.ug-slider-preloader.ug-loader7.ug-loader-black {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black7.gif"); }

.ug-slider-preloader.ug-loader-black {
  border-color: var(--kb-black);
  background-color: var(--kb-black); }

.ug-slider-preloader.ug-loader-nobg {
  background-color: transparent; }

.ug-slider-wrapper .ug-button-videoplay {
  position: absolute;
  z-index: 2;
  cursor: pointer; }

.ug-slider-wrapper .ug-button-videoplay.ug-type-square {
  width: 86px;
  height: 66px;
  background-image: url("/assets/kaltenbach/images/unitegallery/play-button-square.png");
  background-position: 0px -66px; }

.ug-slider-wrapper .ug-button-videoplay.ug-type-square.ug-button-hover {
  background-position: 0px 0px; }

.ug-slider-wrapper .ug-button-videoplay.ug-type-round {
  width: 76px;
  height: 76px;
  background-image: url("/assets/kaltenbach/images/unitegallery/play-button-round.png");
  opacity: 0.9;
  filter: alpha(opacity=90);
  transition: all 0.3s ease 0s !important; }

.ug-slider-wrapper .ug-button-videoplay.ug-type-round.ug-button-hover {
  opacity: 1;
  filter: alpha(opacity=100);
  transition: all 0.3s ease 0s !important; }

.ug-gallery-wrapper .ug-videoplayer {
  position: absolute;
  z-index: 100;
  background-color: var(--kb-black);
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black1.gif");
  background-repeat: no-repeat;
  background-position: center center;
  box-sizing: border-box;
  -moz-box-sizing: border-box; }

.ug-videoplayer .ug-videoplayer-wrapper {
  width: 100%;
  height: 100%;
  background-color: var(--kb-black);
  background-image: url("/assets/kaltenbach/images/unitegallery/loader-black1.gif");
  background-repeat: no-repeat;
  background-position: center center; }

.ug-videoplayer .ug-videoplayer-button-close {
  position: absolute;
  height: 64px;
  width: 64px;
  background-image: url("/assets/kaltenbach/images/unitegallery/button-close.png");
  cursor: pointer;
  z-index: 1000; }

.ug-videoplayer .ug-videoplayer-button-close:hover {
  background-position: 0px -64px; }

.ug-gallery-wrapper .ug-thumbs-strip,
.ug-gallery-wrapper .ug-thumbs-grid {
  position: absolute;
  overflow: hidden;
  -webkit-user-select: none;
  /* make unselectable */
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* xbackground-color: green; */
  z-index: 10; }

.ug-gallery-wrapper .ug-thumbs-strip-inner,
.ug-gallery-wrapper .ug-thumbs-grid-inner {
  position: absolute; }

.ug-thumb-wrapper.ug-thumb-generated {
  position: absolute;
  overflow: hidden;
  -webkit-user-select: none;
  /* make unselectable */
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  box-sizing: border-box;
  -moz-box-sizing: border-box; }

.ug-thumb-wrapper.ug-thumb-generated .ug-thumb-loader,
.ug-thumb-wrapper.ug-thumb-generated .ug-thumb-error {
  position: absolute;
  top: 0px;
  left: 0px;
  background-repeat: no-repeat;
  background-position: center center; }

.ug-thumb-wrapper .ug-thumb-border-overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 4;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  border-style: solid; }

.ug-thumb-wrapper .ug-thumb-overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 3; }

.ug-thumb-wrapper.ug-thumb-generated .ug-thumb-loader-dark {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader.gif"); }

.ug-thumb-wrapper.ug-thumb-generated .ug-thumb-loader-bright {
  background-image: url("/assets/kaltenbach/images/unitegallery/loader_bright.gif"); }

.ug-thumb-wrapper.ug-thumb-generated .ug-thumb-error {
  background-image: url("/assets/kaltenbach/images/unitegallery/not_loaded.png"); }

.ug-thumb-wrapper.ug-thumb-generated img {
  position: absolute;
  z-index: 1;
  max-width: none !important; }

.ug-thumb-wrapper.ug-thumb-generated img.ug-thumb-image-overlay {
  position: absolute;
  z-index: 2;
  max-width: none !important; }

/* bw desaturate effect lightweight */
img.ug-bw-effect {
  filter: grayscale(100%);
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  /* Firefox 10+, Firefox on Android */
  -moz-filter: grayscale(100%);
  -webkit-filter: grayscale(100%); }

/* blur effect desaturate effect lightweight */
img.ug-blur-effect {
  filter: blur(0.8px);
  -webkit-filter: blur(0.8px);
  -moz-filter: blur(0.8px);
  -o-filter: blur(0.8px);
  -ms-filter: blur(0.8px);
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='blur'><feGaussianBlur stdDeviation='0.8' /></filter></svg>#blur");
  /* Firefox 10+, Firefox on Android */
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='0.8'); }

img.ug-sepia-effect {
  -webkit-filter: sepia(1);
  -webkit-filter: sepia(100%);
  -moz-filter: sepia(100%);
  -ms-filter: sepia(100%);
  -o-filter: sepia(100%);
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='sepia'><feColorMatrix values='0.14 0.45 0.05 0 0 0.12 0.39 0.04 0 0 0.08 0.28 0.03 0 0 0 0 0 1 0' /></filter></svg>#sepia");
  /* Firefox 10+, Firefox on Android */
  filter: sepia(100%);
  background-color: var(--kb-orange);
  filter: alpha(opacity=50);
  zoom: 1; }

.ug-gallery-wrapper .ug-bullets {
  position: absolute;
  top: 0px;
  left: 0px;
  margin: 0px;
  padding: 0px; }

.ug-gallery-wrapper .ug-bullets .ug-bullet {
  background-repeat: no-repeat;
  cursor: pointer;
  display: block;
  float: left;
  z-index: 2; }

.ug-gallery-wrapper .ug-bullets .ug-bullet:first-child {
  margin-left: 0px; }

.ug-gallery-wrapper .ug-textpanel {
  position: absolute;
  overflow: hidden; }

.ug-slider-wrapper .ug-textpanel {
  z-index: 2; }

.ug-gallery-wrapper .ug-textpanel-bg,
.ug-gallery-wrapper .ug-textpanel-title,
.ug-gallery-wrapper .ug-textpanel-description {
  display: block;
  position: absolute;
  margin: 0px;
  padding: 0px; }

.ug-gallery-wrapper .ug-textpanel-bg {
  background-color: var(--kb-black);
  opacity: 0.4;
  filter: alpha(opacity=40);
  z-index: 1; }

.ug-textpanel-textwrapper {
  overflow: hidden; }

.ug-gallery-wrapper .ug-textpanel-title {
  font-size: 16px;
  font-weight: bold;
  color: white;
  text-align: left;
  z-index: 2; }

.ug-gallery-wrapper .ug-textpanel-description {
  font-size: 14px;
  color: white;
  text-align: left;
  z-index: 3; }

.ug-slider-wrapper .ug-zoompanel {
  position: absolute;
  top: 200px;
  left: 100px; }

.ug-zoompanel .ug-zoompanel-button {
  background-repeat: no-repeat;
  cursor: pointer;
  display: block; }

.ug-gallery-wrapper .ug-arrow-left {
  position: absolute;
  background-repeat: no-repeat;
  display: block;
  cursor: pointer; }

.ug-gallery-wrapper .ug-arrow-right {
  position: absolute;
  background-repeat: no-repeat;
  cursor: pointer; }

.ug-gallery-wrapper .ug-grid-panel {
  position: absolute;
  background-color: var(--kb-black);
  /* xbackground-color: blue; */
  z-index: 2; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow {
  position: absolute;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 11; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow.ug-button-disabled {
  cursor: default; }

/* handle tip */
.ug-gallery-wrapper .ug-panel-handle-tip {
  position: absolute;
  z-index: 13;
  cursor: pointer; }

.ug-gallery-wrapper .ug-overlay-disabled {
  position: absolute;
  z-index: 100;
  width: 100%;
  height: 100%;
  background-color: var(--kb-black);
  opacity: 0.3;
  filter: alpha(opacity=30);
  background-image: url("/assets/kaltenbach/images/unitegallery/cover-grid.png"); }

.ug-gallery-wrapper .ug-strip-panel {
  position: absolute;
  background-color: var(--kb-black);
  z-index: 2; }

.ug-strip-panel .ug-strip-arrow {
  position: absolute;
  cursor: pointer; }

.ug-strip-panel .ug-strip-arrow.ug-button-disabled {
  cursor: default; }

.ug-strip-panel .ug-strip-arrow-tip {
  position: absolute; }

.ug-thumb-wrapper.ug-tile {
  display: block;
  position: absolute;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  overflow: hidden;
  padding: 0px;
  margin: 0px; }

.ug-tile .ug-tile-cloneswrapper {
  position: absolute;
  width: 0px;
  height: 0px;
  top: 0px;
  left: 0px;
  overflow: hidden;
  opacity: 0;
  filter: alpha(opacity=90); }

/* transit something */
/* transit fixed size items */
/* transit image overlay */
.ug-tiles-transit.ug-tiles-transition-active .ug-thumb-wrapper.ug-tile,
.ug-tiles-transit.ug-tiles-transition-active .ug-thumb-wrapper.ug-tile .ug-trans-enabled {
  transition: left 0.7s ease 0s, top 0.7s ease 0s, width 0.7s ease 0s, height 0.7s ease 0s !important; }

.ug-thumb-wrapper.ug-tile.ug-tile-clickable {
  cursor: pointer; }

.ug-thumb-wrapper.ug-tile .ug-image-container {
  position: absolute;
  overflow: hidden;
  z-index: 1;
  top: 0px;
  left: 0px; }

.ug-thumb-wrapper.ug-tile img.ug-thumb-image {
  -webkit-user-select: none;
  /* make unselectable */
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  max-width: none !important;
  max-height: none !important;
  display: block;
  border: none;
  padding: 0px !important;
  margin: 0px !important;
  width: auto;
  height: auto;
  position: absolute; }

.ug-thumb-wrapper.ug-tile .ug-tile-image-overlay {
  position: absolute;
  overflow: hidden;
  z-index: 2;
  top: 0px;
  left: 0px; }

.ug-thumb-wrapper.ug-tile .ug-tile-image-overlay img {
  width: 100%;
  max-width: none !important; }

.ug-tiletype-justified .ug-thumb-wrapper.ug-tile .ug-tile-image-overlay img {
  height: 100%;
  max-width: none !important; }

.ug-thumb-wrapper.ug-tile .ug-tile-icon {
  position: absolute;
  width: 38px;
  height: 38px;
  background-repeat: no-repeat;
  background-position: 0 0;
  /* xbackground-color: green; */
  z-index: 6;
  top: 1px;
  left: 1px;
  cursor: pointer; }

.ug-thumb-wrapper.ug-tile .ug-tile-icon.ug-icon-link {
  background-image: url("/assets/kaltenbach/images/unitegallery/icon-link32.png"); }

.ug-thumb-wrapper.ug-tile .ug-tile-icon.ug-icon-zoom {
  background-image: url("/assets/kaltenbach/images/unitegallery/icon-zoom32.png"); }

.ug-thumb-wrapper.ug-tile .ug-tile-icon.ug-icon-play {
  background-image: url("/assets/kaltenbach/images/unitegallery/icon-play32.png"); }

.ug-thumb-wrapper.ug-tile .ug-tile-icon:hover {
  background-position: 0 -38px; }

.ug-thumbs-grid .ug-tile-image-overlay img {
  width: auto;
  height: auto;
  position: absolute;
  max-width: none !important; }

/* text panel on tiles*/
.ug-tile .ug-textpanel {
  z-index: 5;
  cursor: default; }

.ug-tile.ug-tile-clickable .ug-textpanel {
  cursor: pointer; }

.ug-tile .ug-textpanel-title {
  font-size: 14px;
  font-weight: bold; }

.ug-gallery-wrapper .ug-carousel-wrapper {
  position: absolute;
  overflow: hidden; }

.ug-gallery-wrapper .ug-carousel-inner {
  position: absolute; }

.ug-gallery-wrapper.ug-lightbox {
  display: none;
  position: fixed;
  border: none;
  padding: 0px;
  margin: 0px;
  outline: invert none medium;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none !important;
  max-height: none !important;
  z-index: 999999; }

.ug-lightbox .ug-lightbox-top-panel {
  position: absolute;
  z-index: 2; }

.ug-lightbox .ug-lightbox-top-panel-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: var(--kb-black);
  opacity: 0.4;
  filter: alpha(opacity=40); }

.ug-lightbox .ug-lightbox-overlay {
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: var(--kb-black);
  opacity: 1; }

.ug-lightbox .ug-slider-wrapper {
  z-index: 1;
  /* xbackground-color: green; */
  background-color: transparent !important; }

.ug-lightbox .ug-textpanel {
  z-index: 2; }

.ug-lightbox .ug-lightbox-arrow-left,
.ug-lightbox .ug-lightbox-arrow-right {
  position: absolute;
  width: 50px;
  height: 55px;
  background-repeat: no-repeat;
  background-image: url("/assets/kaltenbach/images/unitegallery/lightbox-arrow-left.png");
  background-position: 0px 0px;
  z-index: 3;
  cursor: pointer; }

.ug-lightbox .ug-lightbox-arrow-right {
  background-image: url("/assets/kaltenbach/images/unitegallery/lightbox-arrow-right.png"); }

.ug-lightbox .ug-lightbox-button-close {
  position: absolute;
  width: 36px;
  height: 36px;
  background-repeat: no-repeat;
  background-image: url("/assets/kaltenbach/images/unitegallery/lightbox-icon-close.png");
  background-position: 0px 0px;
  z-index: 4;
  cursor: pointer; }

.ug-lightbox-compact .ug-lightbox-button-close {
  width: 45px;
  height: 41px;
  background-image: url("/assets/kaltenbach/images/unitegallery/lightbox-icon-close-compact2.png"); }

.ug-lightbox .ug-lightbox-arrow-left.ug-arrow-hover,
.ug-lightbox .ug-lightbox-arrow-right.ug-arrow-hover {
  background-position: 0px -55px; }

.ug-lightbox .ug-lightbox-button-close.ug-button-hover {
  background-position: 0px -35px; }

.ug-lightbox-compact .ug-lightbox-button-close.ug-button-hover {
  background-position: 0px -40px; }

.ug-lightbox .ug-lightbox-numbers {
  position: absolute;
  color: var(--kb-muted);
  font-size: 12px;
  top: 14px;
  left: 8px;
  z-index: 3; }

.ug-lightbox-compact .ug-lightbox-numbers {
  font-size: 14px;
  padding-right: 5px;
  padding-top: 7px; }

.ug-lightbox .ug-textpanel-title,
.ug-lightbox .ug-textpanel-description {
  font-size: 14px;
  font-weight: normal;
  color: var(--kb-muted); }

.ug-lightbox-compact .ug-textpanel-title,
.ug-lightbox-compact .ug-textpanel-description {
  color: var(--kb-muted);
  font-size: 16px; }

.ug-loadmore-wrapper {
  margin-top: 20px;
  text-align: center; }

.ug-loadmore-wrapper .ug-loadmore-button {
  display: inline-block;
  padding: 5px;
  border: 1px solid var(--kb-disabled);
  text-decoration: none;
  color: var(--kb-gray); }

.ug-loadmore-wrapper .ug-loadmore-error {
  color: red; }

.ug-loadmore-wrapper .ug-loadmore-button:hover {
  background-color: var(--kb-muted);
  color: var(--kb-gray); }

.ug-loadmore-wrapper .ug-loadmore-loader {
  color: var(--kb-gray); }

.ug-tabs-wrapper {
  margin-top: 0px;
  margin-bottom: 20px;
  text-align: center; }

.ug-tabs-wrapper a.ug-tab {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
  color: var(--kb-white);
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 6px;
  padding-bottom: 6px;
  margin-left: 5px;
  background-color: var(--kb-gray);
  border-radius: 3px;
  font-size: 12px;
  font-weight: normal;
  border: 1px solid var(--kb-disabled); }

.ug-tabs-wrapper a.ug-tab:hover {
  background-color: var(--kb-gray) !important; }

.ug-tabs-wrapper a.ug-tab.ug-tab-selected,
.ug-tabs-wrapper a.ug-tab.ug-tab-selected:hover {
  background-color: var(--kb-green) !important;
  cursor: default !important; }

.ug-tabs-wrapper a.ug-tab:first-child {
  margin-left: 0px !important; }

/* --- arrows -- */
.ug-arrow-left.ug-skin-default,
.ug-arrow-right.ug-skin-default {
  width: 15px;
  height: 30px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/slider_arrow_left.png");
  background-position: 0px 0px; }

.ug-arrow-right.ug-skin-default {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/slider_arrow_right.png"); }

.ug-arrow-left.ug-skin-default.ug-arrow-hover,
.ug-arrow-right.ug-skin-default.ug-arrow-hover {
  background-position: 0px -30px; }

.ug-arrow-left.ug-skin-default.ug-arrow-disabled,
.ug-arrow-right.ug-skin-default.ug-arrow-disabled {
  background-position: 0px -60px; }

/* --- bullets -- */
.ug-bullets.ug-skin-default .ug-bullet {
  width: 15px;
  height: 15px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/slider_bullets.png");
  background-position: top left;
  margin-left: 5px; }

.ug-bullets.ug-skin-default .ug-bullet.ug-bullet-active {
  background-position: bottom left; }

.ug-bullets.ug-skin-default.ug-bullets-gray .ug-bullet {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_bullets_gray.png"); }

.ug-bullets.ug-skin-default.ug-bullets-blue .ug-bullet {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_bullets_blue.png"); }

.ug-bullets.ug-skin-default.ug-bullets-brown .ug-bullet {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_bullets_brown.png"); }

.ug-bullets.ug-skin-default.ug-bullets-green .ug-bullet {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_bullets_green.png"); }

.ug-bullets.ug-skin-default.ug-bullets-red .ug-bullet {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_bullets_red.png"); }

.ug-button-tile-navigation {
  width: 36px;
  height: 36px;
  background-position: top left;
  cursor: pointer;
  float: left; }

.ug-button-tile-navigation.ug-button-tile-left {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_button_left.png"); }

.ug-button-tile-navigation.ug-button-tile-right {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_button_right.png"); }

.ug-button-tile-navigation:hover {
  background-position: bottom left; }

.ug-button-tile-navigation.ug-button-disabled {
  opacity: 0.6; }

.ug-button-tile-navigation.ug-button-disabled:hover {
  background-position: top left; }

.ug-button-tile-navigation.ug-button-tile-play {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/tile_button_play_pause.png");
  width: 35px; }

.ug-button-tile-navigation.ug-button-tile-play.ug-pause-icon {
  background-position: bottom left; }

.ug-button-tile-navigation.ug-button-tile-play:hover {
  background-position: top left; }

.ug-button-tile-navigation.ug-button-tile-play.ug-pause-icon:hover {
  background-position: bottom left; }

/* --- play button -- */
.ug-button-play.ug-skin-default {
  position: absolute;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/button_playpause.png");
  width: 14px;
  height: 17px;
  cursor: pointer;
  background-position: 0px 0px; }

.ug-button-play.ug-skin-default.ug-button-hover {
  background-position: 0px -17px; }

.ug-button-play.ug-skin-default.ug-stop-mode {
  background-position: 0px -34px; }

.ug-button-play.ug-skin-default.ug-stop-mode.ug-button-hover {
  background-position: 0px -51px; }

/* --- fullscreen button -- */
.ug-button-fullscreen.ug-skin-default {
  position: absolute;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/button_fullscreen.png");
  width: 16px;
  height: 16px;
  cursor: pointer;
  background-position: 0px 0px; }

.ug-button-fullscreen.ug-skin-default.ug-button-hover {
  background-position: 0px -16px; }

.ug-button-fullscreen.ug-skin-default.ug-fullscreenmode {
  background-position: 0px -32px; }

.ug-button-fullscreen.ug-skin-default.ug-fullscreenmode.ug-button-hover {
  background-position: 0px -48px; }

/* --- zoom panel --- */
.ug-zoompanel.ug-skin-default .ug-zoompanel-button {
  background-repeat: no-repeat;
  cursor: pointer;
  height: 23px;
  width: 23px;
  margin-top: 5px;
  background-position: 0px 0px; }

.ug-zoompanel.ug-skin-default .ug-zoompanel-plus {
  margin-top: 0px; }

.ug-zoompanel.ug-skin-default .ug-zoompanel-plus {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/icon_zoom_plus.png"); }

.ug-zoompanel.ug-skin-default .ug-zoompanel-minus {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/icon_zoom_minus.png"); }

.ug-zoompanel.ug-skin-default .ug-zoompanel-return {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/icon_zoom_back.png"); }

.ug-zoompanel.ug-skin-default .ug-zoompanel-button.ug-button-hover {
  background-position: 0px -23px; }

.ug-zoompanel.ug-skin-default .ug-zoompanel-button-disabled,
.ug-zoompanel.ug-skin-default .ug-zoompanel-button.ug-button-hover.ug-zoompanel-button-disabled {
  background-position: 0px -46px;
  cursor: default; }

/* --- Grid Panel Arrows -- */
/*--- down arrow ---*/
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-down.ug-skin-default {
  width: 30px;
  height: 15px;
  background-position: 0px 0px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/arrow_grid_down.png"); }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-down.ug-skin-default.ug-button-hover {
  background-position: 0px -15px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-down.ug-skin-default.ug-button-hover.ug-button-disabled,
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-down.ug-skin-default.ug-button-disabled {
  background-position: 0px -30px; }

/*--- up arrow ---*/
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-up.ug-skin-default {
  width: 30px;
  height: 15px;
  background-position: 0px 0px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/arrow_grid_up.png"); }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-up.ug-skin-default.ug-button-hover {
  background-position: 0px -15px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-up.ug-skin-default.ug-button-hover.ug-button-disabled,
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-up.ug-skin-default.ug-button-disabled {
  background-position: 0px -30px; }

/*--- left arrow ---*/
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left.ug-skin-default {
  width: 40px;
  height: 40px;
  background-position: 0px -40px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/grid_arrow_left.png"); }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left.ug-skin-default.ug-button-hover {
  background-position: 0px -0px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left.ug-skin-default.ug-button-hover.ug-button-disabled,
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left.ug-skin-default.ug-button-disabled {
  background-position: 0px -80px; }

/*--- right arrow ---*/
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right.ug-skin-default {
  width: 40px;
  height: 40px;
  background-position: 0px -40px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/grid_arrow_right.png"); }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right.ug-skin-default.ug-button-hover {
  background-position: 0px -0px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right.ug-skin-default.ug-button-hover.ug-button-disabled,
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right.ug-skin-default.ug-button-disabled {
  background-position: 0px -80px; }

/*--- left arrow - horizontal panel type ---*/
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left-hortype.ug-skin-default {
  width: 15px;
  height: 30px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/slider_arrow_left.png");
  background-position: 0px 0px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left-hortype.ug-skin-default.ug-button-hover {
  background-position: 0px -30px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left-hortype.ug-skin-default.ug-button-hover.ug-button-disabled,
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-left-hortype.ug-skin-default.ug-button-disabled {
  background-position: 0px -60px; }

/*--- right arrow - horizontal panel type ---*/
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right-hortype.ug-skin-default {
  width: 15px;
  height: 30px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/slider_arrow_right.png");
  background-position: 0px 0px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right-hortype.ug-skin-default.ug-button-hover {
  background-position: 0px -30px; }

.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right-hortype.ug-skin-default.ug-button-hover.ug-button-disabled,
.ug-gallery-wrapper .ug-grid-panel .grid-arrow-right-hortype.ug-skin-default.ug-button-disabled {
  background-position: 0px -60px; }

/* --- Strip Panel Arrows -- */
/* left and right arrows */
.ug-strip-panel .ug-strip-arrow-left.ug-skin-default,
.ug-strip-panel .ug-strip-arrow-right.ug-skin-default {
  width: 25px;
  height: 50px; }

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default .ug-strip-arrow-tip,
.ug-strip-panel .ug-strip-arrow-right.ug-skin-default .ug-strip-arrow-tip {
  background-position: 0px 0px;
  background-repeat: no-repeat;
  width: 4px;
  height: 7px; }

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default .ug-strip-arrow-tip {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/arrows_strip_left.png"); }

.ug-strip-panel .ug-strip-arrow-right.ug-skin-default .ug-strip-arrow-tip {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/arrows_strip_right.png"); }

.ug-strip-panel .ug-strip-arrow-left.ug-skin-default.ug-button-hover .ug-strip-arrow-tip,
.ug-strip-panel .ug-strip-arrow-right.ug-skin-default.ug-button-hover .ug-strip-arrow-tip {
  background-position: 0px -7px; }

/* up and down arrows */
.ug-strip-panel .ug-strip-arrow-up.ug-skin-default,
.ug-strip-panel .ug-strip-arrow-down.ug-skin-default {
  height: 25px;
  width: 50px; }

.ug-strip-panel .ug-strip-arrow-up.ug-skin-default .ug-strip-arrow-tip,
.ug-strip-panel .ug-strip-arrow-down.ug-skin-default .ug-strip-arrow-tip {
  background-position: 0px 0px;
  background-repeat: no-repeat;
  width: 7px;
  height: 4px; }

.ug-strip-panel .ug-strip-arrow-up.ug-skin-default .ug-strip-arrow-tip {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/arrows_strip_up.png"); }

.ug-strip-panel .ug-strip-arrow-down.ug-skin-default .ug-strip-arrow-tip {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/arrows_strip_down.png"); }

.ug-strip-panel .ug-strip-arrow-up.ug-skin-default.ug-button-hover .ug-strip-arrow-tip,
.ug-strip-panel .ug-strip-arrow-down.ug-skin-default.ug-button-hover .ug-strip-arrow-tip {
  background-position: -7px 0px; }

.ug-strip-panel .ug-strip-arrow.ug-skin-default.ug-button-disabled .ug-strip-arrow-tip {
  background-position: 0px 0px;
  opacity: 0.5;
  filter: alpha(opacity=50); }

/* --- Panel Handle Tip -- */
/* left and right handle */
.ug-gallery-wrapper .ug-handle-tip-left.ug-skin-default,
.ug-gallery-wrapper .ug-handle-tip-right.ug-skin-default {
  width: 22px;
  height: 36px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/grid_handle_black_left.png");
  background-repeat: no-repeat;
  background-position: 0px -36px; }

.ug-gallery-wrapper .ug-handle-tip-right.ug-skin-default {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/grid_handle_black_right.png");
  background-position: 0px -36px; }

.ug-gallery-wrapper .ug-handle-tip-left.ug-button-hover.ug-skin-default,
.ug-gallery-wrapper .ug-handle-tip-right.ug-button-hover.ug-skin-default {
  background-position: 0px -0px; }

.ug-gallery-wrapper .ug-handle-tip-left.ug-skin-default.ug-button-closed,
.ug-gallery-wrapper .ug-handle-tip-right.ug-skin-default.ug-button-closed {
  background-position: 0px -108px; }

.ug-gallery-wrapper .ug-handle-tip-left.ug-skin-default.ug-button-closed.ug-button-hover,
.ug-gallery-wrapper .ug-handle-tip-right.ug-skin-default.ug-button-closed.ug-button-hover {
  background-position: 0px -72px; }

/* top and bottom handle */
.ug-gallery-wrapper .ug-handle-tip-top.ug-skin-default,
.ug-gallery-wrapper .ug-handle-tip-bottom.ug-skin-default {
  width: 36px;
  height: 22px;
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/grid_handle_black_top.png");
  background-repeat: no-repeat;
  background-position: -36px 0px; }

.ug-gallery-wrapper .ug-handle-tip-bottom.ug-skin-default {
  background-image: url("/assets/kaltenbach/images/unitegallery/skins/default/grid_handle_black_bottom.png");
  background-position: -36px 0px; }

.ug-gallery-wrapper .ug-handle-tip-top.ug-skin-default.ug-button-hover,
.ug-gallery-wrapper .ug-handle-tip-bottom.ug-skin-default.ug-button-hover {
  background-position: 0px 0px; }

.ug-gallery-wrapper .ug-handle-tip-top.ug-skin-default.ug-button-closed,
.ug-gallery-wrapper .ug-handle-tip-bottom.ug-skin-default.ug-button-closed {
  background-position: -108px 0px; }

.ug-gallery-wrapper .ug-handle-tip-top.ug-skin-default.ug-button-closed.ug-button-hover,
.ug-gallery-wrapper .ug-handle-tip-bottom.ug-skin-default.ug-button-closed.ug-button-hover {
  background-position: -72px 0px; }

p.headline_downloads {
  font-weight: bold; }

ul.download {
  margin: 0 0 1rem 0; }
  ul.download li {
    width: 100%;
    display: inline-block;
    max-width: 90%; }
    ul.download li a {
      text-decoration: none !important;
      color: var(--kb-black) !important;
      font-size: 1rem;
      font-weight: bold; }
      ul.download li a:hover {
        background: none !important;
        color: var(--kb-orange) !important; }
    ul.download li span {
      font-weight: normal;
      padding-left: 1rem;
      font-size: 0.75rem; }

#sitemap ul {
  font-family: 'Cairo', sans-serif;
  vertical-align: text-bottom;
  font-weight: 300; }
  #sitemap ul li {
    vertical-align: text-bottom; }
    #sitemap ul li a {
      text-decoration: none;
      font-size: 1.4rem;
      color: var(--kb-gray); }
      #sitemap ul li a:hover {
        color: var(--kb-green); }
    #sitemap ul li ul {
      padding-left: 1rem; }
      #sitemap ul li ul li {
        padding-left: 0; }
        #sitemap ul li ul li:first-child {
          padding-top: 10px; }
        #sitemap ul li ul li:last-child {
          margin-bottom: 10px; }
        #sitemap ul li ul li a {
          font-weight: 700;
          font-size: 1.2rem; }
      #sitemap ul li ul ul {
        padding-left: 1.5rem; }
        #sitemap ul li ul ul li a {
          font-weight: 400;
          font-size: 1rem; }
        #sitemap ul li ul ul ul {
          padding-left: 2rem; }
          #sitemap ul li ul ul ul li a {
            font-weight: 400;
            font-size: 1rem; }
    #sitemap ul li a.article {
      font-style: italic;
      font-weight: 300;
      font-size: 1.4rem; }
#sitemap .warning strong {
  font-size: 10px;
  color: var(--kb-orange); }

.trenner {
  clear: both;
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  width: 100%; }
  .trenner span {
    position: relative;
    display: inline-block; }
    .trenner span:before, .trenner span:after {
      content: "";
      position: absolute;
      top: 50%;
      width: 9999em;
      height: 1px;
      background: transparent; }
    .trenner span:before {
      right: 100%;
      margin-right: -15px; }
    .trenner span:after {
      left: 100%;
      margin-left: -15px; }
  .trenner.line span:before, .trenner.line span:after {
    background: var(--kb-line) !important; }
  .trenner.image {
    position: relative;
    min-height: 30px; }
    .trenner.image span {
      height: 30px; }
  .trenner img {
    border: none !important; }
  .trenner.both span:before {
    position: absolute;
    top: 45%;
    margin-right: 50%; }
  .trenner.both span:after {
    position: absolute;
    top: 45%;
    margin-left: 15px; }

body {
  min-width: 320px;
  font-family: 'Cairo', sans-serif;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left); }

html {
  min-height: 100%;
  overflow-y: scroll;
  color: var(--kb-gray);
  font-family: 'Cairo', sans-serif;
  font-weight: 300;
  line-height: 1.9; }

a:hover {
  cursor: pointer; }

h4 {
  color: var(--kb-green);
  text-transform: uppercase;
  font-size: 1.25rem;
  font-weight: 600; }
  h3.headline30bold {
    font-size: 1.65rem; }

h5 {
  color: var(--kb-gray);
  font-size: 1.25rem;
  font-weight: 600; }

.breadcroumpwrapper {
  font-size: 0.95rem;
  font-weight: 200;
  width: auto; }
  .breadcroumpwrapper ul {
    display: inline-block !important;
    white-space: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    height: 2rem;
    padding-top: 1rem;
    padding-bottom: 2rem; }
    .breadcroumpwrapper ul li {
      display: inline-block;
      padding: 0 0.5rem 0 0;
      color: var(--kb-dark); }
      .breadcroumpwrapper ul li:before {
        margin: 0 0.5rem 0 0 !important; }
      .breadcroumpwrapper ul li:first-child {
        margin-left: 0;
        padding-left: 0; }
      .breadcroumpwrapper ul li a {
        color: var(--kb-dark) !important;
        font-size: 0.95rem; }
        .breadcroumpwrapper ul li a:hover {
          color: var(--kb-green) !important; }

.teaserboxen {
  padding-top: 3rem; }
  .teaserboxen .teaser a {
    background: var(--kb-muted);
    display: inline-block;
    width: 100%;
    height: 100%;
    padding: 4.5rem 0 3rem 0;
    border-bottom: 3px solid var(--kb-green);
    background-size: 0px !important; }
    .teaserboxen .teaser a .highlight {
      display: none; }
    .teaserboxen .teaser a h6 {
      padding: 0 0.5rem 0 0.5rem;
      font-size: 1rem;
      font-weight: 600; }
    .teaserboxen .teaser a .teaser-img-wrapper {
      height: 90px;
      width: 90px;
      border-radius: 50%;
      margin: 0 auto;
      text-align: center; }
    .teaserboxen .teaser a img {
      margin-top: 15px;
      margin-left: 5px;
      height: 60px;
      width: 60px; }
    .teaserboxen .teaser a:hover {
      text-decoration: none;
      color: var(--kb-white);
      background-size: 100% !important; }
      .teaserboxen .teaser a:hover .normal {
        display: none; }
      .teaserboxen .teaser a:hover .highlight {
        display: inline-block; }
      .teaserboxen .teaser a:hover .teaser-img-wrapper {
        background: rgba(var(--kb-black-rgb), 0.5); }
      .teaserboxen .teaser a:hover h6 {
        color: var(--kb-white); }
  .teaserboxen.experties a img {
    height: 80px;
    padding: 0.5rem;
    background: var(--kb-white); }
  .teaserboxen.experties a {
    text-decoration: none; }
  .teaserboxen.experties a h6 {
    margin-top: 1.25rem;
    font-size: 1rem;
    color: var(--kb-green); }
  .teaserboxen.experties a p.link {
    color: var(--kb-gray);
    font-weight: 200;
    text-decoration: underline;
    font-size: 0.95rem; }
  .teaserboxen.experties a:hover {
    border-bottom: 4px solid var(--kb-green);
    background: linear-gradient(to bottom, var(--kb-dark), var(--kb-green));
    background-repeat: no-repeat;
    background-size: 100% 100%; }
    .teaserboxen.experties a:hover .arrow-right {
      border-color: transparent transparent transparent var(--kb-green-dark); }
    .teaserboxen.experties a:hover img {
      background: var(--kb-green); }
    .teaserboxen.experties a:hover h6 {
      color: var(--kb-white); }
    .teaserboxen.experties a:hover p {
      color: var(--kb-black); }

.arrow-right {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 0 30px 20px;
  border-color: transparent transparent transparent var(--kb-muted); }

.teaserboxen.experties .arrow-right {
  position: absolute;
  top: 50%;
  right: -20px;
  transform: translateY(-50%); }

.newsteaser {
  background: linear-gradient(to bottom, var(--kb-muted), rgba(var(--kb-white-rgb), 0));
  background-repeat: no-repeat;
  background-size: 100% 100%; }
  .newsteaser .date {
    margin: 0 0 0.5rem 0;
    padding: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--kb-gray); }
  .newsteaser .newsheadline {
    margin: 0;
    padding: 0;
    font-weight: 600;
    color: var(--kb-dark); }
  .newsteaser .newstext {
    margin-top: 0; }

a.newslink {
  color: var(--kb-disabled);
  font-size: 1.65rem;
  font-weight: 600; }
  a.newslink span {
    color: var(--kb-green); }
  a.newslink:hover {
    text-decoration: none;
    color: var(--kb-green); }

.teaser-with-backgroundimage .teaser-bg {
  display: block;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }
/* CSP: Hintergrundbilder kommen per data-bg-image (JS), statische BG-Eigenschaften hier */
.contact-bar, .contact-bar-ips { background-position: center; background-size: cover; background-repeat: no-repeat; }
.teaserboxen .teaser a[data-bg-image] { background-position: center; background-size: cover; background-repeat: no-repeat; }
/* CSP: ehemalige statische Inline-Styles als Klassen */
.trenner.trenner-h80 { height: 80px; }
.trenner.trenner-h100 { height: 100px; }
.trenner span.trenner-top20 { top: 20px; }
.trenner span.trenner-top75 { top: 75px; }
.green-bg-behind { z-index: -2; position: relative; }
.download-disabled { color: var(--kb-disabled); cursor: default; display: inline-block; }
.teaser-with-backgroundimage .textcontainer {
  padding: 1rem; }
.teaser-with-backgroundimage h6 {
  color: var(--kb-white);
  font-size: 1.65rem;
  font-weight: 600; }
.teaser-with-backgroundimage p {
  color: var(--kb-white); }
.teaser-with-backgroundimage .linear-gardient {
  width: 100%;
  height: 350px;
  background: linear-gradient(to bottom, rgba(var(--kb-white-rgb), 0), rgba(var(--kb-black-rgb), 0.85));
  background-repeat: no-repeat;
  background-size: 100% 90%;
  background-position: bottom; }
.teaser-with-backgroundimage a:hover .linear-gardient {
  width: 100%;
  height: 350px;
  background: linear-gradient(to bottom, rgba(var(--kb-white-rgb), 0), black);
  background-repeat: no-repeat;
  background-size: 100% 125%;
  background-position: bottom; }
.teaser-with-backgroundimage a:hover span {
  color: var(--kb-white); }

.linkbox-stacked-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 400; font-style: italic; }
.linkbox-stacked-item { display: block; color: inherit; text-decoration: none; }
.linkbox-stacked-img { aspect-ratio: 4 / 3; object-fit: cover; border-radius: .25rem; }
.linkbox-stacked-text { margin-top: 1rem; }
.linkbox-stacked-head { font-weight: 700; color: var(--kb-dark); }
.linkbox-stacked-teaser { color: var(--kb-dark); text-align: justify; }
a.linkbox-stacked-item:hover .linkbox-stacked-head { color: var(--kb-orange); }
.linkbox-stacked-btn { border: 1px solid var(--kb-orange); color: var(--kb-orange); background: transparent; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
a.linkbox-stacked-item:hover .linkbox-stacked-btn, a.linkbox-stacked-item:focus .linkbox-stacked-btn { background: var(--kb-orange); color: var(--kb-white); }

.market li {
  border-bottom: 1px solid var(--kb-muted); }
  .market li:last-child {
    border: none; }
  .market li a {
    padding: 0.75rem 0 0.75rem 0;
    display: inline-block;
    color: var(--kb-dark); }
    .market li a .imgwrapper {
      float: left;
      width: 40px;
      height: 40px;
      margin-right: 1rem; }
    .market li a img {
      -webkit-filter: grayscale(1);
      filter: grayscale(1); }
    .market li a span {
      color: var(--kb-green); }
    .market li a:hover {
      font-weight: 600;
      text-decoration: none; }
      .market li a:hover img {
        -webkit-filter: grayscale(0);
        filter: grayscale(0); }

.product-teaser {
  border-bottom: 1px solid var(--kb-muted);
  padding-bottom: 1rem; }
  .product-teaser:last-child {
    border: none; }

#footer {
  margin-top: 0; }
  @media (min-width: 640px) {
    #footer .custom-margin-remove {
      margin: 0; } }
  #footer .footercontent p {
    line-height: 2; }
  #footer h5 {
    padding-bottom: 0.85rem;
    font-weight: 700; }
  #footer img {
    max-width: 225px; }
  #footer a {
    color: var(--kb-dark); }
    #footer a:hover,
    #footer a .active {
      text-decoration: none;
      color: var(--kb-green); }
    #footer a span {
      color: var(--kb-black);
      margin-right: 0.85rem; }
  #footer .border-top {
    border-top: 1px solid var(--kb-muted); }
  @media (min-width: 960px) {
    #footer ul.social-media {
      float: right; } }
  #footer ul.social-media li a {
    display: inline-block;
    color: var(--kb-green);
    padding: 0.75rem 0.85rem 0.75rem 0.85rem;
    border: 0; }
    #footer ul.social-media li a:hover {
      border: 0;
      background: var(--kb-muted); }
  #footer ul.social-media li:first-child {
    padding-left: 0; }
  #footer #footernavi {
    background: var(--kb-muted); }
    #footer #footernavi ul.footernavi {
      padding: 0; }
      #footer #footernavi ul.footernavi li {
        position: relative;
        list-style: none;
        padding: 0; }
        #footer #footernavi ul.footernavi li a {
          color: var(--kb-dark);
          text-decoration: none; }
          #footer #footernavi ul.footernavi li a.current, #footer #footernavi ul.footernavi li a:hover {
            color: var(--kb-green);
            text-decoration: none; }
        #footer #footernavi ul.footernavi li:before {
          position: absolute;
          top: 1px;
          left: -1.25rem; }
        #footer #footernavi ul.footernavi li:last-child {
          margin-top: 1.5rem; }
          #footer #footernavi ul.footernavi li:last-child:before {
            display: none; }
        @media (min-width: 1200px) {
          #footer #footernavi ul.footernavi li {
            padding-right: 0.75rem; }
            #footer #footernavi ul.footernavi li:before {
              position: absolute;
              left: -1.5rem; }
            #footer #footernavi ul.footernavi li:first-child:before {
              display: none; }
            #footer #footernavi ul.footernavi li:last-child {
              margin-top: 0 !important;
              padding-right: 0;
              float: right; } }
    @media (min-width: 1200px) {
      #footer #footernavi ul li {
        float: left;
        margin-right: 1rem; } }

/* Footernavi mobil: mehr Abstand zwischen den gestapelten Links */
@media (max-width: 1199.98px) {
  #footer #footernavi ul.footernavi li { padding: 0.5rem 0; }
  #footer #footernavi ul.footernavi li:last-child { margin-top: 0.5rem; }
}
/* Back-to-Top Chevron exakt zentriert, keine rechte Margin, weiss wie Primary-Button */
#footer .footer-top .back-to-top .fa-icon { margin: 0; color: var(--kb-white); }

.center-image {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: auto; }

.chat {
  position: fixed;
  bottom: 5rem;
  right: 0.5rem;
  padding: 0.75rem;
  background: var(--kb-white);
  z-index: 10000;
  opacity: 0.6; }
  .chat:hover {
    cursor: pointer;
    opacity: 1; }

@media (min-width: 1200px) {
  .padding-left-l {
    padding-left: 3.5rem !important; } }

@media (min-width: 1200px) {
  .padding-right-l {
    padding-right: 3.5rem !important; } }

h2 {
  color: var(--kb-gray);
  font-size: 3.3rem; }
  h2.small30 {
    font-size: 1.65rem; }

h3 {
  color: var(--kb-disabled);
  font-size: 2.2rem;
  font-weight: 400; }
  h3.big-green {
    color: var(--kb-green);
    text-transform: uppercase;
    font-weight: 900; }
  h3.green30 {
    font-size: 1.65rem;
    color: var(--kb-green);
    font-weight: 400; }

h4 {
  font-size: 1.78rem;
  color: var(--kb-green);
  font-weight: 600;
  text-transform: none; }

.quote img {
  float: left; }
.quote .quote-icon {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(66%, -50%);
  width: 3rem;
  height: 3.25rem;
  font-size: 2rem;
  padding: 0.25rem 0 0 0.5rem;
  letter-spacing: 0.5rem;
  font-weight: 900;
  color: var(--kb-white);
  background: var(--kb-green);
  line-height: 1.5; }
.quote .quote-text-box {
  padding-left: 3rem; }
.quote .quote-text {
  font-size: 2.2rem;
  color: var(--kb-gray);
  font-weight: 700;
  line-height: 1.2;
  word-wrap: break-word; }
.quote .quote-small {
  font-size: 0.95rem;
  color: var(--kb-gray);
  font-weight: 200; }

blockquote {
  font-size: 4.5rem;
  color: var(--kb-gray);
  font-weight: 700;
  font-style: normal; }

.download_list h3 {
  padding-bottom: 0;
  margin-bottom: 0; }
.download_list li {
  padding-bottom: 0.5rem; }
  .download_list li a {
    display: inline-block;
    color: var(--kb-dark);
    font-size: 1rem;
    font-weight: 400 !important; }
    .download_list li a span {
      margin-right: 1rem;
      color: var(--kb-white);
      padding: 0.2rem; }
    .download_list li a:hover {
      text-decoration: none;
      color: var(--kb-green) !important; }

.modal-list h3 {
  padding-bottom: 0;
  margin-bottom: 0; }
.modal-list li {
  padding-bottom: 0.25rem; }
  .modal-list li a {
    display: inline-block;
    color: var(--kb-dark);
    font-size: 1rem;
    font-weight: 400 !important; }
    .modal-list li a span {
      margin-right: 0.5rem;
      color: var(--kb-white) !important;
      padding: 0.2rem;
      background: var(--kb-green); }
    .modal-list li a:hover {
      text-decoration: none;
      color: var(--kb-green) !important; }

#headerteaser {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center; }
  #headerteaser .canvas-height {
    display: inline-block;
    width: 100%;
    height: 40vW;
    max-height: 800px; }
  #headerteaser .contentbox {
    background: url("/assets/kaltenbach/images/teaser_back.png") no-repeat center center;
    background-size: cover;
    max-width: 500px; }

.contenboxx-small {
  background: url("/assets/kaltenbach/images/teaser_back.png") no-repeat center center;
  background-size: cover; }

.machine_teaser h5 {
  display: inline-block;
  font-size: 1rem;
  font-weight: 600;
  color: var(--kb-disabled);
  padding: 0;
  margin: 1.5rem 0 1rem 0 !important; }
.machine_teaser p {
  font-size: 0.81rem;
  color: var(--kb-dark); }
.machine_teaser span {
  display: inline-block;
  margin-top: 1.5rem;
  color: var(--kb-green); }
.machine_teaser:hover {
  text-decoration: none; }
  .machine_teaser:hover h5 {
    color: var(--kb-green); }

ul.switchertabs {
  margin-bottom: 0; }
  ul.switchertabs li a {
    font-weight: 600; }
  ul.switchertabs li.active > a {
    background: var(--kb-muted); }

.news_events_section {
  background: linear-gradient(to bottom, var(--kb-muted), rgba(var(--kb-white-rgb), 0));
  background-repeat: no-repeat;
  background-size: 100% 200%; }
  .news_events_section .newsteaser {
    background: transparent; }

.eventsteaser-all .event-date {
  margin: 0;
  padding: 0;
  font-size: 1rem;
  font-weight: 400;
  color: var(--kb-disabled); }
.eventsteaser-all .event-headline {
  margin: 0 0 0.5rem 0;
  padding: 0;
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--kb-dark); }
.eventsteaser-all .event-text {
  font-size: 0.95rem;
  color: var(--kb-dark);
  padding-bottom: 1rem; }

.contact-bar {
  background-color: var(--kb-muted); }
.contact-bar-image-col {
  padding-right: 2rem; }
.contact-bar-square-img {
  display: block;
  width: 100%;
  height: 365px;
  object-fit: cover; }
.contact-bar-button {
  margin-top: 2.5rem; }
.contact-bar-btn {
  display: inline-block;
  width: max-content;
  min-width: 10.5rem;
  border: 2px solid var(--kb-orange);
  border-radius: 0;
  text-align: center;
  padding: .6rem 1.25rem;
  font-weight: 600;
  font-size: .95rem;
  background: var(--kb-white);
  color: var(--kb-orange); }
  .contact-bar-btn:hover, .contact-bar-btn:focus {
    background: var(--kb-orange);
    border-color: var(--kb-orange);
    color: var(--kb-white); }
.contact-bar h3 {
  color: var(--kb-dark);
  font-weight: 700;
  font-size: 2.2rem;
  margin-bottom: 1.75rem; }
.contact-bar-contacts {
  display: flex;
  flex-direction: column;
  gap: 1rem; }
.contact-bar .contact-bar-links {
  display: flex;
  flex-direction: column;
  gap: 1rem; }
.contact-bar .contact-bar-links a {
  color: var(--kb-dark);
  font-weight: 600;
  font-size: 1.1rem;
  display: inline-block;
  text-decoration: none; }
  .contact-bar .contact-bar-links a span {
    color: var(--kb-orange);
    background: var(--kb-white);
    border: 1px solid var(--kb-orange);
    width: 2.5rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 1.5rem; }
  .contact-bar .contact-bar-links a:hover {
    text-decoration: none; }
    .contact-bar .contact-bar-links a:hover span {
      background: var(--kb-orange);
      color: var(--kb-white);
      border-color: var(--kb-orange); }

.border-all * {
  border: 1px solid red; }

.big-news {
  border-bottom: 4px solid var(--kb-green);
  background: linear-gradient(to bottom, var(--kb-dark), var(--kb-green));
  background-repeat: no-repeat;
  background-size: 100% 100%;
  height: 100% !important; }
  .big-news h3 {
    color: var(--kb-white);
    font-size: 4rem;
    line-height: 1.2;
    font-weight: 600; }
  .big-news .event-date {
    font-weight: 600;
    color: var(--kb-white); }
  .big-news button {
    color: var(--kb-white); }
    .big-news button span {
      color: var(--kb-white); }
    .big-news button:hover {
      background: var(--kb-white);
      color: var(--kb-black); }
      .big-news button:hover span {
        color: var(--kb-black); }

.paginate ul {
  padding: 0 1rem 0 1rem; }
  .paginate ul a {
    color: var(--kb-disabled); }
    .paginate ul a:hover {
      color: var(--kb-green); }
  .paginate ul li {
    padding: 10px; }
    .paginate ul li.active {
      border: 1px solid var(--kb-green);
      border-radius: 50%; }
      .paginate ul li.active a {
        background: var(--kb-green); }
    .paginate ul li a {
      background: var(--kb-disabled); }
      .paginate ul li a:hover {
        background: var(--kb-green); }

.jobs-nav {
  font-size: 1.2rem;
  max-width: 450px; }
  .jobs-nav a {
    color: var(--kb-gray) !important; }
  .jobs-nav .active a {
    color: var(--kb-green) !important; }

.jobs-small-text {
  font-size: 1rem;
  line-height: 1;
  color: var(--kb-gray); }
  @media (min-width: 1200px) {
    .jobs-small-text {
      text-align: right; } }
  .jobs-small-text button {
    padding: 0;
    margin: 0;
    border: none;
    color: var(--kb-gray);
    font-size: 1rem;
    text-transform: none;
    padding-left: 0.5rem; }

.job-title {
  color: var(--kb-dark);
  font-size: 1.4rem;
  line-height: 1.2;
  font-weight: 600;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0; }
.jobs-nav-title { display: block; font-weight: 700; color: var(--kb-dark); margin-bottom: .5rem; text-decoration: none; cursor: pointer; }
.jobs-nav-title .jobs-nav-caret { font-size: .8em; transition: transform .2s; }
.jobs-nav-title[aria-expanded="true"] .jobs-nav-caret { transform: rotate(180deg); }
.jobs-nav-sub { margin: 0 0 1rem; padding-left: 0; }
.jobs-nav-sub li { margin-bottom: .25rem; }
.jobs-nav a.current { color: var(--kb-green) !important; font-weight: 700; }
.job-lang-flag { height: .9em; width: auto; margin-right: .5rem; vertical-align: -0.05em; }
.job-text-preview { color: var(--kb-gray); }
.job-curtain { margin-top: .75rem; margin-bottom: 0; }
.jobs-apply-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }
.jobs-apply-btn:hover, .jobs-apply-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
/* z-index ueber den Leaflet-Kartensteuerelementen (.leaflet-top/.leaflet-bottom: z-index 1000),
   sonst liegt das aufgeklappte Dropdown hinter der Karte */
.d2u-address-country-menu { max-height: 350px; overflow-y: auto; z-index: 1010; }
.d2u-address-icon { color: var(--kb-orange); }
/* Search it: Pagination in Kaltenbach-Gruen */
.search-pagination { gap: .5rem; }
.search-pagination .page-item:not(:first-child) .page-link { margin-left: 0; }
.search-pagination .page-link { color: var(--kb-green); border-radius: 0; }
.search-pagination .page-item:first-child .page-link,
.search-pagination .page-item:last-child .page-link { border-radius: 0; }
.search-pagination .page-item.active .page-link { background: var(--kb-green); border-color: var(--kb-green); color: var(--kb-white); }
.search-pagination .page-link:hover, .search-pagination .page-link:focus { color: var(--kb-green-dark); background: var(--kb-muted); }

.job-text-gray {
  font-size: 1rem;
  color: var(--kb-line);
  text-transform: uppercase;
  line-height: 1.2;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0.5rem;
  margin-bottom: 0;
  font-weight: 600; }

@media (min-width: 1200px) {
  .jobs-left {
    padding-right: 3rem; } }

.download-list ul { display: grid; grid-auto-rows: 1fr; grid-template-columns: 1fr; row-gap: 2rem; column-gap: 3rem; }
@media (min-width: 768px) {
  .download-cols-2 ul, .download-cols-3 ul, .download-cols-4 ul { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) {
  .download-cols-3 ul { grid-template-columns: repeat(3, 1fr); }
  .download-cols-4 ul { grid-template-columns: repeat(4, 1fr); } }
.download-list ul li { margin-bottom: 0; }

/* Download-Karte: Bild (weiss, zentriert) oben, Textzeile mit gelbem Chevron links */
.download-item { display: flex; flex-direction: column; height: 100%; font-size: 1rem; color: var(--kb-dark); text-decoration: none; background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); }
.download-item-img { display: flex; align-items: center; justify-content: center; background: var(--kb-white); padding: 1rem; }
.download-item-img img { max-width: 100%; width: auto; height: 200px; object-fit: contain; display: block; }
.download-item-body { display: flex; align-items: stretch; flex-direction: row-reverse; background: var(--kb-white); margin-top: auto; min-height: 3.5rem; }
.download-item-arrow { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; background: var(--kb-yellow); color: var(--kb-white); }
.download-item-text { flex: 1 1 auto; align-self: center; padding: .5rem 1rem; }
.download-item:hover { color: var(--kb-green); text-decoration: none; }
.download-item:hover .download-item-arrow { background: var(--kb-green); }
.download-item.download-disabled { color: var(--kb-disabled); }

.partnerlogo {
  text-align: center;
  vertical-align: middle;
  max-height: 100px;
  padding: 0;
  margin: 0; }
  .partnerlogo img {
    padding-right: 1rem;
    padding-left: 0; }
  .partnerlogo.border {
    width: 0;
    margin: 0;
    margin-top: 25px;
    height: 50px;
    border-right: 1px solid var(--kb-disabled); }

.slider_cta_teaser_box h2 {
  color: var(--kb-white); }
.slider_cta_teaser_box p {
  color: var(--kb-white); }
.slider_cta_teaser_box .box-back {
  background: url("/assets/kaltenbach/images/slider_back.jpg") no-repeat center center;
  background-size: cover;
  margin-top: -300px; }

.big-slider-content {
  margin-top: 12rem;
  margin-left: 4rem; }
  .big-slider-content h4 {
    color: var(--kb-white);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    float: left;
    width: 100%; }
    .big-slider-content h4:before {
      position: absolute;
      top: 0.5rem;
      left: -2rem;
      content: '';
      width: 1rem;
      height: 1rem;
      display: inline-block;
      background: var(--kb-green); }
  .big-slider-content p {
    margin-top: 0;
    padding: 0.75rem 2rem 0.75rem 2rem;
    background: rgba(var(--kb-white-rgb), 0.5);
    display: inline-block;
    color: var(--kb-dark);
    font-size: 0.95rem; }
  @media (min-width: 1200px) {
    .big-slider-content {
      margin-left: 0;
      margin-top: 5rem; }
      .big-slider-content h4 {
        font-size: 3.35rem;
        float: none; }
        .big-slider-content h4:before {
          top: 1.5rem; } }

.cta-box-width {
  width: 100%; }

.slider-height {
  height: 700px; }

/* CTA-Box im Fluss (Container waechst mit) und im Vordergrund vor dem Slider */
.get-in-touch-slider .cta-box-width { position: relative !important; z-index: 3; }

/* Mobil: Overlap reduziert (Box ragt etwas in den Slider) und Slider niedriger */
@media (max-width: 1199.98px) {
  .get-in-touch-slider .slider_cta_teaser_box .box-back { margin-top: -6rem; }
  .get-in-touch-slider .slider-height { height: 380px; }
}

.k-back {
  background: var(--kb-muted); }

ul.accordion-list {
  width: 100% !important; }
  ul.accordion-list li {
    width: 100% !important;
    margin: 0 0 0.5rem 0 !important; }

/* ===== Print-Styles (aus theme/private/scss/print.scss) ===== */
/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print and (min-width: 1024px) {
  body {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact; }

  @page {
    size: A4 landscape;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-left: 16px !important;
    padding-right: 16px !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact; }
  #content {
    max-width: 1024px;
    width: 1024px !important;
    padding: 8px !important; }

  .container {
    width: 1024px; }

  #header,
  #footer,
  #headermeta,
  #top,
  .back {
    display: none !important; }

  h1 {
    font-size: 26px !important; }

  h2 {
    font-size: 22px !important; }

  h3 {
    font-size: 18px !important; }

  h4 {
    font-size: 16px !important; }

  p {
    font-size: 12px !important;
    line-height: 1.4; }

  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important; }

  *,
  *:before,
  *:after {
    background: transparent !important;
    color: var(--kb-black) !important;
    box-shadow: none !important;
    text-shadow: none !important; }

  a,
  a:visited {
    text-decoration: underline; }

  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: ""; }

  pre,
  blockquote {
    border: 1px solid var(--kb-disabled);
    page-break-inside: avoid; }

  thead {
    display: table-header-group; }

  tr,
  img {
    page-break-inside: avoid; }

  img {
    max-width: 100% !important; }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3; } }

/* Print-Helfer (ehem. hidden-print/show-print) */
.show-print { display: none; }
@media print { .hidden-print { display: none !important; } .show-print { display: block !important; } }

/* =====================================================================
   GetInTouchSlider (Bootstrap 5 Carousel)
   ===================================================================== */
.get-in-touch-slider .carousel-item { position: relative; min-height: 480px; }
.get-in-touch-slider .slider-cover { object-fit: cover; }
.get-in-touch-slider .slider-caption { position: absolute; inset: 0; display: flex; }
.get-in-touch-slider .big-slider-content { margin-left: auto; align-self: flex-start; max-width: 50%; padding: 2rem; color: var(--kb-white); }

/* =====================================================================
   Mega-Menu (3 Spalten mit Live-Vorschau)
   ===================================================================== */
#mainnavi .megamenu-item { position: static; }
#mainnavi .dropdown-menu.megamenu {
  /* 1px Ueberlappung, damit durch Sub-Pixel-Rundung nie eine sichtbare Fuge zur Breadcrumb-Leiste entsteht */
  width: 100%; left: 0; right: 0; top: calc(100% + var(--kb-breadcrumb-h) - 1px); border: 0; border-radius: 0;
  box-shadow: 0 8px 24px rgba(var(--kb-black-rgb), .12); padding: 0; margin-top: 0;
}
/* Unsichtbare Hover-Bruecke ueber der Luecke (Navi-Unterkante bis Unterkante Breadcrumb-Leiste), damit das Menu beim Hovern offen bleibt */
#mainnavi .dropdown-menu.megamenu::before {
  content: ""; position: absolute; top: calc(-1 * var(--kb-breadcrumb-h)); left: 0; right: 0; height: var(--kb-breadcrumb-h); }
/* Megamenue bereits beim Hover oeffnen (nur Desktop); :focus-within oeffnet per Tastatur */
@media (min-width: 1200px) {
  #mainnavi .megamenu-item:hover > .dropdown-menu.megamenu,
  #mainnavi .megamenu-item:focus-within > .dropdown-menu.megamenu,
  #mainnavi .megamenu-item.megamenu-hovered > .dropdown-menu.megamenu { display: block; }
}
.megamenu > .container { max-width: 100%; width: 100%; margin: 0; padding: 0; }
.megamenu .megamenu-main { padding: 0; }
/* Ueberschrift = Kategoriename (Ebene 1), Farbverlauf navy -> gruen, weisse Schrift.
   Der ganze Link ist als Ziel-Affordanz gebaut: Name links, gelber Pfeil-Chip
   rechts (Marken-Element wie news-box-arrow), dauerhaft sichtbar - damit erkennbar
   ist, dass die Ebene 1 anklickbar ist und auf ihre Uebersichtsseite fuehrt. */
.megamenu .megamenu-title {
  color: var(--kb-white); font-weight: 900; text-transform: uppercase;
  margin: 0 0 1rem 0; padding: 0;
  background: linear-gradient(90deg, var(--kb-green-dark) 0%, var(--kb-green) 100%); }
.megamenu .megamenu-title-link {
  display: flex; align-items: stretch; justify-content: space-between; gap: 0;
  color: inherit; text-decoration: none; transition: background-color .15s ease; }
.megamenu .megamenu-title-name {
  align-self: center; padding: 0.9rem 1rem 0.9rem 40px; transition: color .15s ease;
  font-family: 'Cairo', sans-serif; font-weight: 600; font-size: 24px; text-transform: none; }
.megamenu .megamenu-title-arrow {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 3rem; background: var(--kb-yellow); color: var(--kb-white);
  transition: background-color .15s ease; }
/* Hover/Focus: Band wird grau, Schrift dunkelgruen, keine Unterstreichung.
   Der Pfeil-Chip wechselt von Gelb auf Gruen. */
.megamenu .megamenu-title-link:hover,
.megamenu .megamenu-title-link:focus-visible { background: var(--kb-muted); }
.megamenu .megamenu-title-link:hover .megamenu-title-name,
.megamenu .megamenu-title-link:focus-visible .megamenu-title-name { color: var(--kb-green-dark); text-decoration: none; }
.megamenu .megamenu-title-link:hover .megamenu-title-arrow,
.megamenu .megamenu-title-link:focus-visible .megamenu-title-arrow { background: var(--kb-green); }
.megamenu .megamenu-col { min-height: 220px; }
/* Gruppen-Spalten: ausgeglichener Innenabstand, feiner grauer Trenner zwischen den 2 Spalten */
.megamenu .megamenu-col-groups { padding: 0.5rem 1.5rem; }
.megamenu .megamenu-col-divider { border-left: 1px solid var(--kb-muted); }
.megamenu .megamenu-group { margin-bottom: 1.25rem; }
.megamenu .megamenu-group:last-child { margin-bottom: 0; }
.megamenu .megamenu-link {
  display: block; padding: .4rem .75rem; color: #4C5457; text-decoration: none; cursor: pointer;
  transition: color .15s ease;
}
.megamenu .megamenu-link:hover, .megamenu .megamenu-link.active { color: #00293B; background: var(--kb-muted); font-weight: 600; }
/* Ebene 2 (Gruppen-Ueberschrift): Grossbuchstaben, fett, etwas groesser */
.megamenu .megamenu-group > .megamenu-link { text-transform: none; font-weight: 700; font-size: 1.05rem; }
/* Ebene 3: kleiner, leicht eingerueckt, direkt unter der Ebene 2 */
.megamenu .megamenu-lev3 { margin-top: .15rem; padding-left: .75rem; }
.megamenu .megamenu-lev3 .megamenu-link { font-size: 0.9rem; text-transform: none; font-weight: 400; }
/* Spalte 3: SEO-Bild oben, navy Titelband, darunter Meta-Description */
/* Spalte 3: kompletter Block navy, buendig rechts, kein Weiss */
.megamenu .megamenu-col-preview { background: var(--kb-green-dark); padding: 0; }
.megamenu .megamenu-preview { height: 100%; color: var(--kb-white); padding-bottom: 30px; }
.megamenu .megamenu-preview img { width: 100%; height: 180px; object-fit: cover; background: var(--kb-muted); display: block; }
.megamenu .megamenu-preview h4 {
  margin: 0; padding: 15px 1rem 5px; color: var(--kb-white);
  background: transparent; font-size: 1.15rem; text-transform: none;
  font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 600; font-style: italic; }
.megamenu .megamenu-preview p { color: var(--kb-white); font-size: .95rem; padding: 0.5rem 1rem 0; margin: 0; }

/* =====================================================================
   Template-Elemente (Bootstrap 5): Suche, Back-to-Top, Off-Canvas, Mobil-Nav
   ===================================================================== */
/* Mega-Menu: eigener Hover statt Caret */
#mainnavi .megamenu-item .dropdown-toggle::after { display: none; }

/* Suche-Icon im Formular (ehem. uk-form-icon) */
.search-submit-icon { position: absolute; top: 50%; right: .5rem; transform: translateY(-50%); color: var(--kb-green); cursor: pointer; z-index: 3; }
#search_it_main .form-control, #search_it_modal .form-control { padding-right: 2.25rem; }

/* Social-Media */
.footer-claim { color: var(--kb-green-dark); }
.social-youtube img { width: 2rem; height: 2rem; display: block; }

/* Back-to-Top */
.back-to-top { color: var(--kb-green); font-size: 1.25rem; }

/* Off-Canvas Hintergrundbild + Mobil-Navigation */
#offcanvas-navi { background: linear-gradient(to top right, var(--kb-green-dark), var(--kb-green)); }
#offcanvas-navi .offcanvas-body { position: relative; display: flex; flex-direction: column; }
#offcanvas-navi .offcanvas-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; opacity: .12; pointer-events: none; }
#offcanvas-navi .offcanvas-body > *:not(.offcanvas-bg) { position: relative; z-index: 1; }
#mainnavigation_small ul { list-style: none; padding-left: 0; margin: 0; }
#mainnavigation_small { display: flex; flex-direction: column; flex: 1 1 auto; }
#mainnavigation_small > ul.uk-nav { display: flex; flex-direction: column; flex: 1 1 auto; }
#mainnavigation_small li { position: relative; border-bottom: 0; }
#mainnavigation_small a { display: block; padding: .65rem 0; color: var(--kb-white); text-decoration: none; }
#mainnavigation_small > ul.uk-nav > li > a { font-weight: 700; }
#mainnavigation_small a:hover { color: var(--kb-yellow); }
#mainnavigation_small .uk-nav-sub { display: none; padding-left: 1rem; }
#mainnavigation_small a.childnav { position: absolute; top: 0; right: 0; width: 2.5rem; text-align: center; padding: .65rem 0; cursor: pointer; }
#mainnavigation_small a.childnav, #mainnavigation_small a.childnav:hover, #mainnavigation_small a.childnav:focus { color: var(--kb-white); }
/* Letzte zwei Navi-Elemente als Buttons, unten, nur so breit wie noetig, linksbuendig */
#mainnavigation_small > ul.uk-nav > li:nth-last-child(2) { margin-top: auto; }
#mainnavigation_small > ul.uk-nav > li:nth-last-child(2) > a,
#mainnavigation_small > ul.uk-nav > li:last-child > a { display: inline-block; width: max-content; min-width: 12rem; border: 2px solid var(--kb-white); border-radius: 0; text-align: center; padding: .75rem 1.5rem; margin-top: .75rem; font-weight: 700; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; }
#mainnavigation_small > ul.uk-nav > li:nth-last-child(2) > a,
#mainnavigation_small > ul.uk-nav > li:nth-last-child(2) > a:hover { background: var(--kb-green-dark); color: var(--kb-white); }
#mainnavigation_small > ul.uk-nav > li:last-child > a,
#mainnavigation_small > ul.uk-nav > li:last-child > a:hover { background: var(--kb-white); color: var(--kb-green-dark); }
/* Hamburger als Primary-Button (orange), quadratisch und gleich hoch wie Suche */
#burger .nav-link, #search-icon .nav-link { width: 2.75rem; height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
#burger .nav-link, #burger .nav-link:hover, #burger .nav-link:focus, #burger .nav-link:active { background: var(--kb-orange); color: var(--kb-white); border: 0; border-radius: 0; }
#burger .nav-link .fa-icon { color: var(--kb-white); }
/* Offen = Close im Secondary-Style (oranger Rand + orange Icon, transparent) */
#burger.is-open .nav-link, #burger.is-open .nav-link:hover, #burger.is-open .nav-link:focus { background: transparent; border: 2px solid var(--kb-orange); color: var(--kb-orange); }
#burger.is-open .nav-link .fa-icon { color: var(--kb-orange); }

/* Cover-Bilder (ehem. uk-cover / uk-cover-container) */
.cover-container { position: relative; overflow: hidden; }
.cover-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.scroll-indicator { position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%); z-index: 2; }

/* =====================================================================
   Header-Redesign (Bootstrap 5): Logo ueber beide Zeilen,
   Zeile 1 = Metanavi (hellgrau), Zeile 2 = Hauptnavi (weiss).
   Ueberschreibt die frueheren UIkit-Header-Regeln.
   ===================================================================== */
#header { background: var(--kb-muted); padding: 0; position: sticky; top: 0; z-index: 1030; }
#header .container { position: relative; }

/* Grid: Logo linke Spalte, rechts Metanavi (Zeile 1) + Hauptnavi (Zeile 2) */
#header .header-grid {
  display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto;
  column-gap: 2rem; align-items: center; position: relative; }
#header #logo {
  grid-column: 1; grid-row: 1; align-self: center; display: inline-block;
  background: url("/assets/kaltenbach/images/kaltenbach_logo.svg") no-repeat center center;
  background-size: contain; width: 108px; height: 72px; }

@media (min-width: 1200px) {
  /* Logo ueber beide Zeilen; grauer Verlauf oben (Zeile 1), weiss unten (Zeile 2, hoeher) */
  #header { background: linear-gradient(180deg, var(--kb-muted) 3.6rem, var(--kb-white) 3.6rem); }
  #header .header-grid { grid-template-rows: 3.6rem 4.4rem; }
  #header #logo { grid-row: 1 / 3; width: 126px; height: 85px; }
}
@media (min-width: 1700px) { #header #logo { width: 152px; height: 102px; } }
/* Mobil: nur die Logo-Marke (ohne Schriftzug), quadratisch, gleich hoch wie Buttons; Header weiss */
@media (max-width: 1199.98px) { #header { background: var(--kb-white); } #header #logo { background-image: url("/assets/kaltenbach/images/kaltenbach_logo_mark.svg"); width: 2.75rem; height: 2.75rem; margin-top: .6rem; margin-bottom: .6rem; } }

/* --- Zeile 1: Metanavi (hellgrau) --- */
#topbar { grid-column: 2; grid-row: 1; display: flex; align-items: center; }
#header #metanavi {
  display: flex; flex-direction: row; flex-wrap: nowrap;
  align-items: center; justify-content: flex-end;
  margin: 0; padding: 0.35rem 0; list-style: none; gap: 0.5rem; width: 100%; }
#header #metanavi > li { border: none; line-height: normal; }
#header #metanavi .nav-link {
  display: flex; align-items: center; gap: 0.35rem;
  color: var(--kb-dark); font-weight: 400; padding: 0.4rem 0.75rem; white-space: nowrap; }
#header #metanavi .nav-link:hover { color: var(--kb-green); }
#header #metanavi .dropdown-menu {
  --bs-dropdown-link-active-bg: transparent;
  --bs-dropdown-link-active-color: var(--kb-dark);
  --bs-dropdown-link-hover-bg: var(--kb-muted);
  border-radius: 0; }
#header #metanavi .dropdown-menu .dropdown-item { color: var(--kb-dark); }
/* Such-Button: oranger Grund, weisse Schrift (eckig) */
#header #metanavi .btn-search {
  background: var(--kb-orange); color: var(--kb-white); border-radius: 0; padding: 0.45rem 0.8rem; }
#header #metanavi .btn-search .fa-icon { color: var(--kb-white); font-size: 1.05rem; }
#header #metanavi .btn-search:hover { background: var(--kb-green); color: var(--kb-white); }

/* --- Zeile 2: Hauptnavigation (weiss) --- */
#mainnav-bar { grid-column: 2; grid-row: 2; display: flex; align-items: center; }
/* Der Bootstrap-.navbar-Wrapper um #mainnavi muss die volle Breite von #mainnav-bar
   fuellen, sonst bleibt #mainnavi nur inhaltsbreit und margin-left:auto (letzte zwei
   Elemente rechts) hat keinen Freiraum. */
#mainnav-bar > .navbar { flex: 1 1 auto; width: 100%; padding: 0; }
/* Unter 1200px uebernimmt die Off-Canvas-Navigation; die Desktop-Hauptnavi (inkl. Megamenu) wird ausgeblendet */
@media (max-width: 1199.98px) { #header #mainnav-bar { display: none; } }
#header #mainnavi {
  display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;
  margin: 0; padding: 0; height: auto; list-style: none; width: 100%; }
#header #mainnavi > li { position: relative; border: none; }
/* Megamenu-Item ohne eigene Positionierung, damit das Dropdown die volle Containerbreite nutzt (offset parent = .header-grid) */
#header #mainnavi > li.megamenu-item { position: static; }
#header #mainnavi > li > a.nav-link {
  position: relative;
  color: var(--kb-dark); font-weight: 400; padding: 0.9rem 1rem; border: none; }
#header #mainnavi > li > a.nav-link:hover,
#header #mainnavi > li > a.nav-link.current { color: var(--kb-green); }
/* Aktives Element: gelber Balken unterhalb */
#header #mainnavi > li.active > a.nav-link::after,
#header #mainnavi > li > a.nav-link.current::after {
  content: ""; display: block; border: 0; margin: 0; position: absolute; left: 0.5rem; right: 0.5rem; bottom: 0.25rem;
  height: 4px; background: var(--kb-yellow); }
/* Hover / geoeffnetes Megamenu: gelber Balken (ausser die zwei Button-Elemente rechts) */
#header #mainnavi > li.megamenu-hovered:not(:nth-last-child(1)):not(:nth-last-child(2)) > a.nav-link::after,
#header #mainnavi > li:focus-within:not(:nth-last-child(1)):not(:nth-last-child(2)) > a.nav-link::after,
#header #mainnavi > li:hover:not(:nth-last-child(1)):not(:nth-last-child(2)) > a.nav-link::after {
  content: ""; display: block; border: 0; margin: 0; position: absolute; left: 0.5rem; right: 0.5rem; bottom: 0.25rem;
  height: 4px; background: var(--kb-yellow); }
/* Letzte zwei Elemente rechts ausgerichtet; die uebrigen Elemente dazwischen
   horizontal zentriert (zwei auto-Margins teilen den Freiraum gleich auf). */
#header #mainnavi > li:first-child { margin-left: auto; }
#header #mainnavi > li:nth-last-child(2) { margin-left: auto; }
/* Vorletztes Element: oranger Rahmen, weisser Grund, orange Schrift (eckig) */
#header #mainnavi > li:nth-last-child(2) > a.nav-link {
  border: 2px solid var(--kb-orange); color: var(--kb-orange); background: var(--kb-white);
  border-radius: 0; padding: 0.5rem 1rem; margin-right: 0.75rem; font-weight: 700; }
#header #mainnavi > li:nth-last-child(2) > a.nav-link:hover { background: var(--kb-orange); color: var(--kb-white); }
#header #mainnavi > li:nth-last-child(2) > a.nav-link::after { display: none; }
/* Letztes Element: oranger Grund, weisse Schrift, oranger Rahmen (eckig) */
#header #mainnavi > li:last-child > a.nav-link {
  border: 2px solid var(--kb-orange); background: var(--kb-orange); color: var(--kb-white);
  border-radius: 0; padding: 0.5rem 1rem; font-weight: 700; }
#header #mainnavi > li:last-child > a.nav-link:hover { background: var(--kb-green); border-color: var(--kb-green); color: var(--kb-white); }
#header #mainnavi > li:last-child > a.nav-link::after { display: none; }

/* =====================================================================
   BS5-Carousel (.kb-slider): gruene Steuerung + Punkt-/Timeline-Indikatoren
   Ersetzt fruehere UIkit-Slider (Referenzen, Produktionslinien, Videoplaylist)
   ===================================================================== */
.kb-slider { position: relative; }
.kb-slider .carousel-control-prev, .kb-slider .carousel-control-next { width: auto; opacity: 1; }
.kb-slider .carousel-control-prev { left: -0.5rem; justify-content: flex-start; }
.kb-slider .carousel-control-next { right: -0.5rem; justify-content: flex-end; }
/* Controls ausserhalb des Sliders (Produktionslinien-Slider) */
.kb-slider-outside .carousel-control-prev { left: -3.25rem; }
.kb-slider-outside .carousel-control-next { right: -3.25rem; }
@media (max-width: 991.98px) {
  .kb-slider-outside .carousel-control-prev { left: 0; }
  .kb-slider-outside .carousel-control-next { right: 0; }
}
.kb-slider .carousel-control-prev-icon, .kb-slider .carousel-control-next-icon {
  width: 2.75rem; height: 2.75rem; background-color: var(--kb-line); border-radius: 0;
  background-image: none; display: inline-flex; align-items: center; justify-content: center; }
.kb-slider .carousel-control-prev-icon::before, .kb-slider .carousel-control-next-icon::before {
  font-family: 'FontAwesome'; font-size: 1.15rem; color: var(--kb-dark); line-height: 1; }
.kb-slider .carousel-control-prev-icon::before { content: "\f053"; }
.kb-slider .carousel-control-next-icon::before { content: "\f054"; }
.partnerlogos .carousel-control-prev-icon, .partnerlogos .carousel-control-next-icon { border-radius: 0; }
/* Vollbreit-Logowand: Logos in Originalgroesse, dafuer mehr pro Reihe (responsiv bis 10) */
.partnerlogos-grid > .col { flex: 0 0 auto; width: 33.333%; }
@media (min-width: 576px)  { .partnerlogos-grid > .col { width: 25%; } }
@media (min-width: 768px)  { .partnerlogos-grid > .col { width: 16.666%; } }
@media (min-width: 992px)  { .partnerlogos-grid > .col { width: 12.5%; } }
@media (min-width: 1400px) { .partnerlogos-grid > .col { width: 10%; } }
.partnerlogos-grid img { width: 100%; max-width: 200px; height: auto; }
.kb-slider .carousel-control-prev:hover .carousel-control-prev-icon,
.kb-slider .carousel-control-next:hover .carousel-control-next-icon { background-color: var(--kb-line); }
/* Punkt-Indikatoren */
.kb-slider .carousel-indicators.dotnav { position: static; margin: 1rem 0 0; }
.kb-slider .carousel-indicators.dotnav [data-bs-target] {
  width: 12px; height: 12px; border-radius: 50%; border: 0; background: var(--kb-line); opacity: 1; margin: 0 4px; }
.kb-slider .carousel-indicators.dotnav .active { background: var(--kb-green); }
/* Timeline-Indikatoren (Namen) */
.kb-slider .carousel-indicators.timeline {
  position: static; margin: 1rem 0 0; flex-wrap: wrap; gap: 0.25rem 1rem; }
.kb-slider .carousel-indicators.timeline [data-bs-target] {
  width: auto; height: auto; text-indent: 0; background: transparent; border: 0;
  color: var(--kb-gray); font-weight: 600; opacity: 1; padding: 0.25rem 0; }
.kb-slider .carousel-indicators.timeline .active { color: var(--kb-green); border-bottom: 2px solid var(--kb-green); }
/* Video-Playlist: Thumbnail-Indikatoren */
.kb-slider .carousel-indicators.video-thumbs { position: static; margin: 1rem 0 0; flex-wrap: nowrap; gap: 0.5rem; overflow-x: auto; justify-content: flex-start; scrollbar-width: none; }
.kb-slider .carousel-indicators.video-thumbs::-webkit-scrollbar { display: none; }
.kb-slider .carousel-indicators.video-thumbs [data-bs-target] {
  flex: 0 0 auto; width: auto; height: auto; text-indent: 0; opacity: 0.6; border: 0; background: transparent; padding: 0; }
.kb-slider .carousel-indicators.video-thumbs .active { opacity: 1; }
.kb-slider .carousel-indicators.video-thumbs img { width: 120px; height: auto; display: block; cursor: pointer; }

/* Bildergalerie (Modul 031): Detailbild auf grossen Schirmen begrenzen und zentrieren */
@media (min-width: 992px) {
  .gallery-slider .carousel-item img,
  .gallery-slider > img { width: auto !important; max-width: min(900px, 100%); max-height: 600px; height: auto; margin-inline: auto; }
}

/* Headerteaser-Slider (Hero): Vollbild-Bild + Caption-Box */
.headerteaser-slider .headerteaser-slide { position: relative; }
.headerteaser-slider .headerteaser-img { width: 100%; height: 500px; object-fit: cover; display: block; }
.headerteaser-slider .headerteaser-link { display: block; color: inherit; text-decoration: none; }
.headerteaser-slider .headerteaser-slide .container {
  position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%;
  display: flex; align-items: center; }
.headerteaser-slider .headerteaser-box { background: var(--kb-green) url("/media/teaser_back.png") no-repeat center center; background-size: cover; color: var(--kb-white); padding: 2rem; max-width: 520px; }
.headerteaser-slider .headerteaser-title { font-size: 1.75rem; font-weight: 700; line-height: 1.2; }
.headerteaser-slider .headerteaser-teaser { margin-top: 0.5rem; }
.headerteaser-slider .carousel-indicators.dotnav { position: absolute; bottom: 1rem; margin: 0; }
.headerteaser-slider .carousel-control-prev { left: 0.5rem; }
.headerteaser-slider .carousel-control-next { right: 0.5rem; }
@media (max-width: 767.98px) {
  .headerteaser-slider .headerteaser-img { height: 360px; }
  .headerteaser-slider .headerteaser-box { max-width: 100%; padding: 1.25rem; }
}

/* Hero-Picture-Modul (130): Vollbreiten-Bild mit seitlichem Farbverlauf + ueberlappende weisse Box mit
   Ueberschrift/Unterueberschrift. Gleiches Muster wie .category-hero (D2U Maschinen Addon - Maschinen
   Hauptausgabe, print_category_hero()): .hero-picture-box-wrap haengt direkt (position:absolute) an
   .hero-picture, dessen einziges Flusskind .hero-picture-media ist - der margin-bottom von
   .hero-picture-media "entkommt" so nach aussen (Margin-Collapsing), .hero-picture bleibt also genauso
   hoch wie das Bild, und die Box ragt per bottom:0 + translateY(33.33%) tatsaechlich ins Bild statt
   mit Abstand darunter zu haengen. .hero-picture bricht dabei selbst per -50vw-Trick aus einem
   etwaigen Container aus (das Modul steht meist direkt im Template statt schon in einem eigenen
   .container wie die Kategorie-Detailseite); die horizontale Ausrichtung der Box kommt deshalb aus
   einem .container innerhalb von .hero-picture-box-wrap statt aus einem festen negativen Versatz wie
   bei .category-hero-box-wrap. */
.hero-picture { position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; }
.hero-picture-media { position: relative; overflow: hidden; line-height: 0; margin-bottom: 3.5rem; }
.hero-picture-img { display: block; width: 100%; height: auto; }
/* Farbverlauf/Fade ins Schwarze an den beiden aeusseren Raendern des Hero-Bilds. */
.hero-picture-media::before,
.hero-picture-media::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 28%;
  pointer-events: none;
  z-index: 1;
}
.hero-picture-media::before { left: 0; background: linear-gradient(to right, #000 0%, #000 25%, rgba(0, 0, 0, 0) 100%); }
.hero-picture-media::after { right: 0; background: linear-gradient(to left, #000 0%, #000 25%, rgba(0, 0, 0, 0) 100%); }
.hero-picture-box-wrap { position: absolute; left: 0; right: 0; bottom: 0; transform: translateY(33.33%); z-index: 2; }
.hero-picture-box { display: inline-block; background: var(--kb-white); padding: 2.25rem 4.5rem; }
.hero-picture-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 600; font-size: 2.75rem; }
.hero-picture-subheading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; margin-top: .5rem; font-size: 1.25rem; }
@media (max-width: 767.98px) {
  .hero-picture-box { padding: 1.25rem 2rem; }
  .hero-picture-heading { font-size: 1.75rem; }
}

/* Hero-Video-Modul: Vollbreiten-Video + ueberlappende Box mit 2 CTA-Boxen */
.hero-video { position: relative; }
.hero-video-media { width: 100%; overflow: hidden; line-height: 0; }
.hero-video-el { display: block; width: 100%; height: 60vh; max-height: 60vh; object-fit: cover; }
.hero-video-box { position: relative; background: var(--kb-white); padding: 0; margin-top: -6rem; }
.hero-video-heading { font-weight: 600; }
.hero-video-text { color: var(--kb-dark); }
.hero-video-box > .row { align-items: stretch; }
.hero-video-cta-col { display: flex; flex-direction: column; gap: 0; padding: 0; }
.hero-cta { display: flex; flex-direction: column; justify-content: center; flex: 1 1 auto; padding: 1.25rem 1.5rem; color: var(--kb-white); text-decoration: none; text-align: center; }
.hero-cta:hover { color: var(--kb-white); filter: brightness(0.95); }
.hero-cta .hero-cta-line { display: block; font-weight: 400; line-height: 1.2; }
.hero-cta .hero-cta-strong { display: block; font-weight: 700; font-size: 1.15rem; line-height: 1.2; }
/* Farbverlauf: dunkles Gruen (links) -> Kaltenbach-Gruen (rechts) */
.hero-cta-green { background: linear-gradient(90deg, var(--kb-green-dark) 0%, var(--kb-green) 100%); }
.hero-cta-orange { background: var(--kb-orange); }
@media (max-width: 767.98px) {
  .hero-video-box { margin-top: -3rem; padding: 1.5rem; }
}
/* Hero-Box auf Desktop 15% breiter (mittig) */
@media (min-width: 992px) {
  .hero-video-box { width: 115%; margin-left: -7.5%; }
}

/* Kategorie-Hero (D2U Maschinen: Anwendungsbild oben auf der Kategorie-Detailseite):
   gleiches Grundmuster wie .hero-video oben (Medium volle Breite, weisse Box ragt darueber),
   aber Bild statt Video, ohne CTA-Boxen (nur Kategoriename wiederholt) und Box nur so breit
   wie der Name selbst statt einer festen Spaltenbreite. .category-hero-media nutzt denselben
   -50vw-Trick wie .machine-cat-section/.machine-list-band, weil das Modul hier schon in einem
   .container steckt (anders als das eigenstaendige Hero-Video-Modul auf der Startseite).

   Abstand unter dem Bild: category-hero-media bekommt margin-bottom, die Box sitzt per
   position:absolute + transform: translateY(25%) auf der Naht zwischen Bild und diesem
   Abstand/dem folgenden print_category_intro() - dadurch ragt die Box unabhaengig von ihrer
   (textabhaengigen) Hoehe immer zu 2/3 ins Bild und nur zu 1/3 in den Bereich danach (33.33%
   statt 50% Y-Versatz), statt mit einem festen margin-top geraten zu werden. Horizontal ueber Flexbox
   (justify-content: flex-start) plus negativem left-Versatz auf .category-hero-box-wrap bewusst
   weiter links als der linke Rand von .category-hero (und damit weiter links als die
   Ueberschrift von print_category_intro() darunter), statt an dessen Flucht ausgerichtet oder
   zentriert zu sein. */
.category-hero { position: relative; }
.category-hero-media { position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; overflow: hidden; line-height: 0; margin-bottom: 3.5rem; }
.category-hero-img { display: block; width: 100%; height: auto; }
/* Farbverlauf/Fade ins Schwarze an den beiden aeusseren Raendern des Hero-Bilds. */
.category-hero-media::before,
.category-hero-media::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 28%;
  pointer-events: none;
  z-index: 1;
}
.category-hero-media::before { left: 0; background: linear-gradient(to right, #000 0%, #000 25%, rgba(0, 0, 0, 0) 100%); }
.category-hero-media::after { right: 0; background: linear-gradient(to left, #000 0%, #000 25%, rgba(0, 0, 0, 0) 100%); }
.category-hero-box-wrap { position: absolute; left: -3rem; right: 0; bottom: 0; transform: translateY(33.33%); z-index: 2; display: flex; justify-content: flex-start; }
.category-hero-box { display: inline-block; background: var(--kb-white); padding: 2.25rem 4.5rem; }
.category-hero-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 600; font-size: 2.75rem; }
@media (max-width: 767.98px) {
  .category-hero-box { padding: 1.25rem 2rem; }
  .category-hero-heading { font-size: 1.75rem; }
}

/* Kategorie-USPs (machine_usps_extension): Ueberschrift, dann 3 pro Reihe; je USP ein
   Icon in eigener Schatten-Box links und Ueberschrift+Text in eigener Schatten-Box rechts */
.usp-section { padding: 1rem 0 2.5rem; }
.usp-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
.usp-item { display: flex; gap: 1rem; align-items: stretch; height: 100%; }
.usp-icon-box { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 6.5rem; padding: 1.1rem; background: var(--kb-white); }
.usp-icon { display: block; max-width: 100%; height: auto; }
.usp-icon-dark { display: none; }
.usp-text-box { flex: 1 1 auto; padding: 1rem 1.25rem; background: var(--kb-white); font-size: 0.88rem; }
.usp-item-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; font-size: 1rem; }
@media (prefers-color-scheme: dark) {
  .usp-icon-light { display: none; }
  .usp-icon-dark { display: block; }
}
/* Beratungshilfe (category_consultation_extension): Intro + Boxen (Bild, Ueberschrift, Text, Link) */
.category-guide { margin-bottom: 1.5rem; }
.category-guide-text h1, .category-guide-text h2, .category-guide-text h3, .category-guide-text h4 { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; margin-bottom: 1rem; }
@media (min-width: 1200px) { .category-guide-text { max-width: 83.333%; } }
.consultation-section { margin-top: 3.5rem; }
.consultation-intro { margin-bottom: 1.5rem; }
@media (min-width: 992px) { .consultation-intro { max-width: 83.333%; } }
.consultation-grid { margin-bottom: 4rem; }
.consultation-card { display: flex; flex-direction: column; height: 100%; background: var(--kb-white); color: var(--kb-dark); text-decoration: none; }
.consultation-card, .consultation-card:hover, .consultation-card:focus { text-decoration: none; }
.consultation-card-img { display: block; width: 100%; height: auto; }
.consultation-card-body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.25rem 1.5rem; }
.consultation-card-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; color: var(--kb-green-dark); margin: 0 0 .75rem; font-size: 1.4rem; }
.consultation-card-text { margin-bottom: 1rem; }
.consultation-card-btn { align-self: flex-end; margin-top: auto; background: transparent; border-color: var(--kb-orange); color: var(--kb-orange); text-decoration: none; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
.consultation-card-btn:hover, .consultation-card-btn:focus { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); text-decoration: none; }
.consultation-card-link { color: var(--kb-dark); }
.consultation-card-link:hover .consultation-card-heading, .consultation-card-link:focus .consultation-card-heading { color: var(--kb-green); }
.consultation-card-arrow { color: var(--kb-orange); font-size: 1.1rem; }

/* D2U News: Karten-Grid (Bild oben, Text unten, grau->transparent Verlauf, gleiche Hoehe) */
.news-grid .news-card { background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); display: flex; flex-direction: column; height: 100%; }
.news-grid .news-card-img { width: 100%; height: 220px; object-fit: cover; display: block; }
.news-grid .news-card-body { padding: 1rem; display: flex; flex-direction: column; flex: 1 1 auto; background: transparent; }
.news-grid .news-card-body h3.news a { text-decoration: none; }
.news-grid .news-card-body time { color: var(--kb-disabled); font-size: .9rem; display: block; margin: .25rem 0 .5rem; }
.news-grid .news-card-body h3.news { font-size: 1.15rem; margin: 0; }
.news-grid .news-card-body .btn { align-self: flex-start; margin-top: auto; }

/* Maschinen-Hauptausgabe: Kategorie-Ansicht Maschinenkarten (Bild, Name, Teaser, feiner grauer Trenner) */
.machine-card-list .machine-card-col { border-right: 1px solid var(--kb-muted); border-bottom: 1px solid var(--kb-muted); }
.machine-card { display: block; height: 100%; padding: 1rem; color: var(--kb-dark); text-decoration: none; }
.machine-card:hover { color: var(--kb-green); }
.machine-card-img { display: block; width: 100%; height: auto; margin-bottom: .75rem; }
.machine-card-name { font-weight: 700; }
.machine-card-teaser { margin-top: .25rem; font-size: .9rem; color: var(--kb-gray); }

/* Maschinen-Kategorien-Modul: Karte (Bild + weisse Namensbox mit gelbem Pfeil) */
.machine-cat-section { background: var(--kb-muted); position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; }
/* Fluid-Raster: zeigt alle Kategorien, Browser packt so viele Kacheln pro Zeile wie passen */
.machine-cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); gap: 1.5rem; }
.machine-cat-card { display: block; height: 100%; color: var(--kb-dark); text-decoration: none; background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); }
.machine-cat-card-img { display: block; width: 100%; height: auto; }
.machine-cat-card-label { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .75rem 1rem; min-height: 3.75rem; }
.machine-cat-card-name { font-weight: 700; }
.machine-cat-card-arrow { color: var(--kb-yellow); }
.machine-cat-card:hover .machine-cat-card-name { color: var(--kb-green); }

/* Maschinen-Hauptausgabe (Kategorie-Detailseite): Maschinenliste als vollbreites graues Band
   (inkl. Ueberschrift, full-bleed wie .machine-cat-section), pro Maschine weisse Karte
   (Name, Kurzbeschreibung, zwei gestapelte Buttons) links, Maschinenbild frei auf Grau rechts */
.machine-list-band { background: var(--kb-muted); position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; }
/* Helle Variante (Gebrauchtmaschinen-Liste): weisses Band, graue Karten */
.machine-list-band--light { background: var(--kb-white); }
.machine-list-band--light .machine-list-card { background: var(--kb-muted); }
/* "Explore our ... systems"-Ueberschrift: GeomGraphic wie .faq-heading statt Cairo */
.machine-list-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 400; font-style: italic; }
.machine-list-intro { font-size: 1.05rem; margin-bottom: 2.5rem; }
/* Eigenes "Maschinenliste Intro"-Feld (TinyMCE): Ueberschriften in GeomGraphic, Text wie der Intro */
.machine-list-intro-custom { font-size: 1.05rem; margin-bottom: 2.5rem; }
.machine-list-intro-custom h1, .machine-list-intro-custom h2, .machine-list-intro-custom h3, .machine-list-intro-custom h4 { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 400; font-style: italic; margin-bottom: 1rem; }
/* KD-Intro: Beschreibungstext unter der Kategorie-Ueberschrift genau so gross wie der Intro-Text
   auf der uebergeordneten Uebersichtsseite (print_overview_intro, dort ohne .lead, also normale
   body-Schriftgroesse 1rem statt Bootstraps .lead-Vergroesserung auf 1.25rem) */
.category-intro-text { font-size: 1rem; font-weight: 400; }
/* Intro-Block: Text links mit gesundem Abstand nach oben, Bild rechts so hoch wie der Text (Spaltenhoehe) */
.category-intro { margin-bottom: 3rem; }
.category-intro-text-col { padding-top: 3rem; }
.category-intro-img { display: block; width: 100%; height: auto; }
@media (min-width: 992px) {
  .category-intro-img-col { position: relative; }
  .category-intro-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
}
.machine-list-item + .machine-list-item { margin-top: 1.5rem; }
.machine-list-card { background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); padding: 1.75rem; }
.machine-list-card h3 { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-size: 1.35rem; }
.machine-list-actions { display: flex; flex-direction: column; gap: .75rem; margin-top: 1rem; }
/* Chevron unabhaengig von der Textlaenge immer am rechten Rand des Buttons (feste Distanz durch das
   normale Button-Padding), Text bleibt zentriert statt links auszurichten */
.machine-list-actions .btn { position: relative; text-align: center; }
.machine-list-actions .btn .fa-icon { position: absolute; top: 50%; right: var(--bs-btn-padding-x, .75rem); transform: translateY(-50%); }
/* "View Machine"-Button: Verlauf Gruen dunkel (links) -> Kaltenbach Gruen (rechts), statt Flaechenfarbe;
   bei Hover Vollton Kaltenbach-Gruen statt Verlauf. Ein Verlauf laesst sich per CSS nicht direkt in
   eine Flaechenfarbe ueberblenden (background-Transitions tweenen nicht zwischen Gradient und Solid),
   daher liegt der Vollton als ::before-Ebene darunter und wird per opacity weich eingeblendet
   (wie .btn-outline-secondary "Request Information" per background-color-Transition). */
.machine-list-btn-gradient { position: relative; z-index: 0; background: linear-gradient(90deg, var(--kb-green-dark) 0%, var(--kb-green) 100%); border-color: transparent; overflow: hidden; }
.machine-list-btn-gradient::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--kb-green); opacity: 0; transition: opacity .1s ease-in-out; }
.machine-list-btn-gradient:hover::before, .machine-list-btn-gradient:focus::before, .machine-list-btn-gradient:active::before { opacity: 1; }
.machine-list-btn-gradient:hover, .machine-list-btn-gradient:focus, .machine-list-btn-gradient:active { border-color: transparent; }
@media (min-width: 768px) { .machine-list-actions { margin-top: 0; } }
.machine-list-img-col { margin-top: 1.5rem; }
@media (min-width: 992px) { .machine-list-img-col { margin-top: 0; } }
/* Multiply-Blend: verrechnet weisse Produktfoto-Hintergruende mit dem grauen Band dahinter,
   sodass sie optisch wie var(--kb-muted) statt weiss wirken (ohne die Quellbilder anzufassen) */
.machine-list-img { display: block; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
/* Kompakt-horizontale Maschinenkarte: Ueberschrift oben ueber voller Breite, darunter Bild links + Text/Buttons rechts */
.machine-list-card-h { display: flex; flex-direction: column; height: 100%; background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); padding: 1.5rem; }
.machine-list-card-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-size: 1.3rem; margin-bottom: 1rem; }
.machine-list-card-row { display: flex; flex: 1 1 auto; gap: 1.25rem; }
.machine-list-card-img-col { flex: 0 0 40%; max-width: 40%; }
.machine-list-card-img-col .machine-list-img { height: 100%; object-fit: contain; }
.machine-list-card-body { flex: 1 1 auto; display: flex; flex-direction: column; }
.machine-list-card-teaser { margin-bottom: 0; }
.machine-list-actions-bar { flex-direction: row; flex-wrap: wrap; margin-top: 1.25rem; }
.machine-list-actions-bar .btn { flex: 1 1 150px; }
@media (max-width: 767.98px) {
  .machine-list-card-row { flex-direction: column; }
  .machine-list-card-img-col { flex-basis: auto; max-width: 100%; }
  .machine-list-card-img-col .machine-list-img { height: auto; }
}

/* Maschinen-Detail: Hero, Vorteilsliste, Tab-Flaeche */
.machine-hero { margin-top: 1rem; }
.machine-hero .btn { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
/* Marken-Ueberschrift: Logo-Mark links, Schriftzug + Maschinenname (grau, GeomGraphic) rechts */
.machine-hero-brand { display: flex; align-items: flex-start; gap: 1.25rem; margin-top: 2rem; }
.machine-hero-mark { flex: 0 0 auto; width: 5.4rem; height: auto; }
.machine-hero-brand-text { display: flex; flex-direction: column; min-width: 0; }
.machine-hero-wordmark { width: 22rem; max-width: 100%; height: auto; margin-bottom: .35rem; }
.machine-hero-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; color: var(--kb-gray); font-size: 1.75rem; line-height: 1.15; }
.machine-benefits-list { list-style: none; padding-left: 0; margin: 0; }
.machine-benefits-list li { position: relative; padding-left: 1.4rem; margin-bottom: .5rem; }
.machine-benefits-list li::before { content: ""; position: absolute; left: 0; top: .5em; width: .45rem; height: .45rem; background: var(--kb-orange); }
.machine-detail-tab-content { background: var(--kb-muted); padding: 2.75rem; }
.machine-detail-tab-content .featurepic { display: block; width: 100%; height: auto; }
@media (max-width: 575.98px) { .machine-detail-tab-content { padding: 1.5rem; } }
/* Maschinen-Detail: Features als grauer Block mit weissen Karten (Bild rechts, Name in GeomGraphic) */
/* Full-bleed graues Band ueber ::before, damit der Inhalt in Sektionsbreite bleibt und kein Reflow/Scrollbar entsteht */
.machine-features-block { position: relative; z-index: 0; padding: 2.75rem 0; margin-bottom: 6rem; }
.machine-features-block::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -50vw; width: 100vw; background: var(--kb-muted); z-index: -1; }
@media (max-width: 575.98px) { .machine-features-block { padding: 1.5rem 0; } }
/* "Nicht sicher?"-CTA: weisse Schatten-Box am unteren Rand, halb ueber dem grauen Block, halb darunter */
.machine-help-box-wrap { position: relative; z-index: 2; display: flex; justify-content: center; margin-top: 2.5rem; margin-bottom: -5rem; }
.machine-help-box { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; width: 100%; max-width: 760px; background: var(--kb-white); padding: 1.75rem 2.25rem; }
.machine-help-text { flex: 1 1 auto; }
.machine-help-heading { font-size: 1.25rem; font-weight: 600; }
.machine-help-btn { flex: 0 0 auto; background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); white-space: nowrap; padding-left: 1.75rem; padding-right: 1.75rem; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
.machine-help-btn:hover, .machine-help-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
.machine-features-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 400; font-style: italic; }
.machine-features-intro { margin-bottom: 1.5rem; }
.feature-card { background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); padding: 1.5rem; }
.feature-card-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-size: 1.2rem; }
.feature-card .featurepic { display: block; width: 100%; height: auto; }
/* YForm-Checkboxen site-weit als Switch-Schalter (nur Markup mit .form-helper, Cookie-Banner o.ae. unberuehrt) */
label:has(> input[type="checkbox"] + .form-helper) { display: block; position: relative; padding-left: 3.4rem; }
label > input[type="checkbox"]:has(+ .form-helper) { -webkit-appearance: none; appearance: none; position: absolute; left: 0; top: .1rem; margin: 0; width: 2.8rem; height: 1.5rem; background: var(--kb-line); border: 0; border-radius: 1rem; cursor: pointer; transition: background .2s; }
label > input[type="checkbox"]:has(+ .form-helper)::before { content: ""; position: absolute; top: .15rem; left: .15rem; width: 1.2rem; height: 1.2rem; background: var(--kb-white); border-radius: 50%; transition: left .2s; }
label > input[type="checkbox"]:has(+ .form-helper):checked { background: var(--kb-green); }
label > input[type="checkbox"]:has(+ .form-helper):checked::before { left: 1.45rem; }
label > input[type="checkbox"] + .form-helper { display: none; }
/* Anfrageformular: mehr Abstand zwischen den Feldern */
.machine-tab-request-content .form-group,
.machine-tab-request-content .checkbox,
.machine-request-content .form-group,
.machine-request-content .checkbox,
.form-field-spacing .form-group,
.form-field-spacing .checkbox { margin-bottom: 1.5rem; }

/* Kontaktformular (Artikel 749): schmalere, zentrierte Spalte statt linksbuendig */
/* body[id="749"] statt body#749, da CSS-ID-Selektoren nicht mit einer Ziffer beginnen duerfen */
body[id="749"] .form-field-spacing { max-width: 800px; margin-left: auto; margin-right: auto; margin-top: 2.5rem; float: none; }

/* Kontakt-Seite: Ueberschrift ueber den unsichtbaren Platzhalter legen (ab lg), statt Flusshoehe zu addieren,
   damit der Absatztext darunter exakt auf Hoehe der Karte (rechte Spalte) beginnt */
@media (min-width: 992px) {
	body[id="749"] .d2u-contact-heading-wrap { position: relative; }
	body[id="749"] .d2u-contact-heading-wrap h1 { position: absolute; top: 0; left: 0; margin: 0; }
}

/* History-Timeline als Slider: full-bleed graues Band, links Jahr+Text, rechts Bild */
.history-band { background: var(--kb-white); position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; }
.history-slider .history-text-box { background: var(--kb-muted); }
.history-slider .history-year { font-size: 3rem; font-weight: 700; line-height: 1; color: var(--kb-green); margin-bottom: .5rem; }
.history-slider .history-name { margin-bottom: .75rem; }
.history-slider .history-image { display: block; width: 100%; height: auto; object-fit: cover; }

/* Personenliste: 3/Reihe, vertikal Bild/Name/Position, Firmen-Zwischenueberschriften */
.staff-group-heading { margin-top: 1rem; margin-bottom: 1.5rem; }
.staff-card .staff-name { font-size: 1.05rem; }
.staff-card .staff-position { color: var(--kb-gray); }

/* News-Modul: gruener Verlaufs-Block + zwei News-Boxen (Block ragt in erste Box) */
.news-promo { background: var(--kb-gradient); color: var(--kb-white); padding: 2rem; position: relative; z-index: 1; }
.news-promo-title { color: var(--kb-white); font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; overflow-wrap: break-word; word-break: break-word; hyphens: auto; }
.news-promo-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }
.news-promo-btn:hover, .news-promo-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
@media (min-width: 992px) { .news-promo { width: calc(100% + 9rem); height: calc(100% + 0.6rem); margin-bottom: -0.6rem; } }
@media (min-width: 992px) { .news-promo-title { max-width: calc(100% - 9rem); } }
.news-promo-row .news-box { position: relative; z-index: 2; }
@media (min-width: 992px) { .news-promo-row .news-box { margin-top: 2rem; margin-bottom: 2rem; } }
.news-box { background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); }
.news-box-img { display: block; width: 100%; height: auto; }
.news-box-body { display: flex; align-items: stretch; justify-content: space-between; gap: 0; padding: 0; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; }
.news-box-title { font-size: 1.1rem; align-self: stretch; min-height: 3.9rem; padding: .4rem 0 .4rem 1rem; display: flex; align-items: center; }
.news-box-title a { color: var(--kb-dark); text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-box-title a:hover { color: var(--kb-green); }

/* Modul 015: TinyMCE mit Bildern und Icons (grauer Block, Bild ragt links/unten heraus) */
.module015 { position: relative; }
.module015-img { display: block; width: 100%; height: auto; }
.module015-icon { display: flex; align-items: center; gap: 1rem; padding: .75rem 0; }
.module015-icon-img { max-width: 50px; max-height: 50px; width: auto; height: auto; flex: 0 0 auto; }
.module015-icon-label { font-weight: 700; }
.module015-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }
.module015-btn:hover, .module015-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
.module015-rightimg { display: block; width: 100%; height: auto; }
/* Modul 016: Icon + Text rechts */
.module016-icon-img { max-width: 56px; max-height: 56px; width: auto; height: auto; }
.module016-item-head { font-weight: 700; }
.module016-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }
.module016-btn:hover, .module016-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
@media (min-width: 992px) {
  .module015-imgcol { --m015-bleed: min(calc(50vw - 50%), 8rem); }
  .module015-img { max-width: none; margin-left: calc(-1 * var(--m015-bleed)); width: calc(100% + var(--m015-bleed)); margin-bottom: -3rem; }
  .module015-rightimg { width: 100%; height: 20rem; object-fit: cover; }
}

/* D2U Branchen: ein weisser Block je Branche, links Name + Beschreibung, rechts Bild */
.industry-sectors-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 400; font-style: italic; }
@media (min-width: 1200px) { .markets-intro-text { max-width: 83.333%; } }
.industry-sector-item { background: var(--kb-white); margin-bottom: 1.5rem; }
.industry-sector-item:last-child { margin-bottom: 0; }
.industry-sector-text { padding: 1rem 1.5rem; }
.industry-sector-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 550; font-style: italic; font-size: 1.5rem; margin-bottom: .5rem; }
.industry-sector-description { flex: 1 1 auto; min-width: 0; }
.industry-sector-btn { margin-top: .25rem; }
.industry-sector-img { aspect-ratio: 4 / 1; object-fit: cover; }
@media (max-width: 991.98px) {
  .industry-sector-text { padding: 1rem 1.25rem; }
}

/* D2U Branchen: optionale CTA-Box unter der Branchenliste ("Not sure which market
   applies to you?") - weisse Karte wie .industry-sector-item, aber schmaler/zentriert
   (per col-lg-8 im Output) statt voller Breite. */
.industry-sector-cta { background: var(--kb-white); padding: 1.75rem 2rem; position: relative; z-index: 2; }
.industry-sector-cta-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 550; font-style: italic; font-size: 1.15rem; margin-bottom: .25rem; }
.industry-sector-cta-btn { white-space: nowrap; padding-left: 1.75rem; padding-right: 1.75rem; }
/* Zusaetzlicher Abstand unter der CTA-Box, oben drauf auf das pb-5 im Output - damit
   zwischen der CTA-Box und dem, was danach kommt, spuerbar Platz bleibt. */
.industry-sector-cta-row { margin-bottom: 2rem; }
/* Wenn der Block grauen Hintergrund hat (siehe output.php): das Grau endet erst nach der
   Branchenliste (pb-5 = 3rem) PLUS diesem zusaetzlichen Puffer auf dem grauen Wrapper,
   macht zusammen 7.5rem Grau - die CTA-Box steckt bereits im naechsten (weissen)
   Container und wird per negativem margin-top darueber gezogen (.industry-sector-cta-row-overlap),
   so dass sie bis zu ihrer eigenen Mitte im Grau steht und trotzdem spuerbar Abstand zum
   letzten Branchen-Block bleibt, statt direkt daran zu kleben (gleiches Prinzip wie
   .green-sidebox/.hero-video-box weiter oben). */
.industry-sector-grey-wrap-pad { padding-bottom: 4.5rem; }
.industry-sector-cta-row-overlap { margin-top: -3.5rem; }

/* D2U Referenzen (Scroll-Snap-Slider mit Peek): graue Box links, Bild rechts */
.reference-slider { overflow: hidden; margin-right: calc(50% - 50vw); }
.reference-track { display: flex; gap: 2rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; padding-right: 2rem; }
.reference-track::-webkit-scrollbar { display: none; }
.reference-item { flex: 0 0 100%; scroll-snap-align: start; }
@media (min-width: 992px)  { .reference-item { flex-basis: 936px; } }
@media (min-width: 1200px) { .reference-item { flex-basis: 1116px; } }
@media (min-width: 1400px) { .reference-item { flex-basis: 1296px; } }
.reference-box { padding: 2.5rem; }
.reference-img-col { position: relative; }
.reference-img { display: block; width: 100%; height: auto; }
@media (min-width: 992px) {
  .reference-img { height: 100%; object-fit: cover; }
  .reference-box { margin-top: 1.5rem; margin-bottom: 1.5rem; }
}
@media (max-width: 991.98px) {
  .reference-box { max-width: calc(100% - 2rem); margin-left: auto; margin-right: auto; }
}
.reference-controls { display: flex; }
.reference-nav-btn { width: 2.75rem; height: 2.75rem; border-radius: 0; background: var(--kb-line); color: var(--kb-dark); border: 0; margin-left: .5rem; }
.reference-nav-btn:hover, .reference-nav-btn:focus { background: var(--kb-line); color: var(--kb-dark); }
.reference-dots { display: flex; justify-content: center; gap: 10px; margin: 1.5rem 0 0; }
.reference-dots button { width: 14px; height: 14px; border-radius: 50%; background: transparent; border: 2px solid var(--kb-green); padding: 0; }
.reference-dots button.active { background: var(--kb-green); }
.reference-overview-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }
.reference-overview-btn:hover, .reference-overview-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
/* Verwandte Maschinen (Alternative / Ergaenzende) als Tabs mit gelbem Aktiv-Balken wie die Navigation */
.machine-related-tabs { border-bottom: 1px solid var(--kb-line); gap: .5rem; flex-wrap: wrap; }
.machine-related-tabs .nav-link { position: relative; border: 0; border-radius: 0; background: transparent; color: var(--kb-dark); font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; font-size: 1.5rem; padding: .5rem 1rem; }
.machine-related-tabs .nav-link:hover, .machine-related-tabs .nav-link:focus { color: var(--kb-green); }
.machine-related-tabs .nav-link.active { color: var(--kb-green); background: transparent; }
.machine-related-tabs .nav-link.active::after { content: ""; position: absolute; left: 1rem; right: 1rem; bottom: -1px; height: 4px; background: var(--kb-yellow); }
.machine-related-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; font-size: 1.65rem; }
/* Related-Karussell bleibt in Content-Breite: kein rechtes Ausbluten, kein Peek */
.machine-related-slider { margin-right: 0; }
.machine-related-slider .reference-item { flex-basis: 100%; }
/* Automation-Block: Text + Button links, Bild rechts; Bild so hoch wie der Text (gleiche Spaltenhoehe).
   Bild absolut, damit seine Eigenhoehe nicht die Zeilenhoehe treibt -> Hoehe = Textspalte. */
.machine-automation-img-col { position: relative; }
.machine-automation-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 767.98px) {
  .machine-automation-img-col { position: static; margin-top: 1.5rem; }
  .machine-automation-img { position: static; height: auto; }
}
.machine-automation-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; padding-left: 1.5rem; padding-right: 1.5rem; }
.machine-automation-btn:hover, .machine-automation-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }

/* Applications-Block (machine_applications_extension): Kicker in GeomGraphic, grauer Textblock (ohne Schatten)
   links, Anwendungsbild der Kategorie rechts; Bild ragt links in die graue Box hinein */
.machine-applications-kicker { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; font-size: 1.25rem; }
.machine-applications-intro { margin-bottom: 1.5rem; }
.machine-applications-box { background: var(--kb-muted); padding: 1.75rem 2.25rem; }
.machine-applications-img { display: block; width: 100%; height: auto; }
@media (min-width: 768px) {
  .machine-applications-img-col { position: relative; z-index: 2; }
  .machine-applications-img { width: calc(100% + 4rem); max-width: none; box-shadow: 0 4px 18px rgba(var(--kb-black-rgb), .18); }
  .machine-applications-box { padding-left: 7rem; }
}

/* Help-Block (machine_applications_extension): vollbreites gruenes Verlaufs-Band (full-bleed ueber ::before,
   Verlauf wie die mobile Navigation), Text in Weiss, oranger "Ask an Expert"-Button rechts */
.machine-help-band { position: relative; z-index: 0; padding: 2.75rem 0; }
.machine-help-band::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -50vw; width: 100vw; background: linear-gradient(to top right, var(--kb-green-dark), var(--kb-green)); z-index: -1; }
.machine-help-band-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; max-width: 960px; margin-left: auto; margin-right: auto; }
.machine-help-green-text { flex: 1 1 320px; color: var(--kb-white); }
.machine-help-green-text * { color: var(--kb-white); }

/* =====================================================================
   Modul 016 "TinyMCE mit Bild und unterem CTA-Banner"
   Aufbau (ab md), drei ineinandergreifende Ebenen:
     1. vollbreiter grauer Streifen (.imgtext-cta-band)
     2. Bild buendig an der Viewportkante, ragt oben UEBER die Graukante hinaus
        (negatives margin-top gegen die obere Polsterung des Streifens)
     3. gruener CTA-Kasten, zentriert, ragt von unten UEBER die untere Graukante
        (negatives margin-top gegen die untere Polsterung des Streifens)
   Die grosszuegige Polsterung des Streifens (ab md 4rem oben wie unten) ist genau der
   Puffer, aus dem sich Bild und CTA-Kasten ihren Ueberstand "herausziehen", ohne mit
   dem Textblock in der Mitte zu kollidieren.
   ===================================================================== */
.imgtext-cta { padding-top: 3rem; padding-bottom: 3rem; }
.imgtext-cta-band { background: var(--kb-muted); padding: 2rem 0 3rem; }

/* Bild: ohne Spaltenpolsterung, damit es an der Viewportkante klebt. Festes 2:1-Format
   (wie .industry-sector-img), damit das Layout unabhaengig vom hochgeladenen Bild sitzt. */
.imgtext-cta-media { padding: 0; }
.imgtext-cta-media img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; }

/* Textspalte: Marken-Dunkelblau statt dem generischen, grossen h2-Grau. */
.imgtext-cta-text { color: var(--kb-green-dark); padding: 2rem 1.5rem 0; }
.imgtext-cta-text > *:last-child { margin-bottom: 0; }
/* Klassenselektor schlaegt die globale h2-Regel (grau, 1.818rem) - hier Marken-Dunkelblau
   und das groessere Verhaeltnis zum Fliesstext aus der Vorlage. */
.imgtext-cta-heading { color: var(--kb-green-dark); font-size: 2.25rem; font-weight: 400; line-height: 1.25; }

/* Alle Regeln unten haengen an .imgtext-cta--has-image: ohne Bild bleibt es ein normaler,
   vollbreiter Textblock (col-md-12), sonst wuerde die 45%-Breite die Spalte schmal halten. */
@media (min-width: 768px) {
  .imgtext-cta-band { padding: 4rem 0; }
  /* 3rem sichtbarer Abstand zum Modul darueber + 5rem Reserve fuer den Bildueberstand,
     den sich das Bild per negativem Margin nach oben "herausnimmt" (sonst wuerde es in
     das Modul darueber ragen). Nur ab md noetig, darunter steht das Bild normal im Fluss
     und die 3rem der Basisregel genuegen. */
  .imgtext-cta--has-image { padding-top: 8rem; }
  /* flex-start + negatives margin-top: 9rem Zug minus 4rem Polsterung = 5rem Ueberstand
     ueber die obere Graukante (= das padding-top von .imgtext-cta--has-image). */
  .imgtext-cta-media { align-self: flex-start; margin-top: -9rem; }
  .imgtext-cta-text { padding-top: 0; }
  /* 55/45 statt der Bootstrap-Siebtel/Fuenftel: Bildkante und Textanfang sitzen damit
     auf den Werten der Vorlage. */
  .imgtext-cta--has-image .imgtext-cta-media { width: 55%; }
  .imgtext-cta--has-image .imgtext-cta-text { width: 45%; }
  /* Bild links -> Text rechtsbuendig mit Luft zur rechten Viewportkante (und umgekehrt) */
  .imgtext-cta--has-image.imgtext-cta--img-left .imgtext-cta-text { text-align: right; padding-left: 4%; padding-right: 8%; }
  .imgtext-cta--has-image.imgtext-cta--img-right .imgtext-cta-text { text-align: left; padding-left: 8%; padding-right: 4%; }
}

/* CTA-Kasten: gruener Markenverlauf, zentriert, oberes Stueck liegt im Grau. */
.imgtext-cta-banner-wrap { position: relative; z-index: 2; margin-top: -2.5rem; }
.cta-banner-box { background: linear-gradient(to top right, var(--kb-green-dark), var(--kb-green)); color: var(--kb-white); padding: 1.75rem 2.25rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; }
.cta-banner-box * { color: var(--kb-white); }
.cta-banner-text { flex: 1 1 320px; }
.cta-banner-text > *:last-child { margin-bottom: 0; }
.cta-banner-heading { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 700; font-style: italic; letter-spacing: .03em; font-size: 1.05rem; }
.cta-banner-btn { flex: 0 0 auto; white-space: nowrap; }

/* Modul 017 "CTA Banner": gleicher Kasten, aber frei stehend statt ueber eine Graukante
   gezogen - daher normaler vertikaler Abstand anstelle des negativen margin-top von
   .imgtext-cta-banner-wrap. */
.cta-banner-standalone { padding-top: 3rem; padding-bottom: 3rem; }
/* Der Editor liefert <p>-Bloecke; ohne diese Regel haengt unter dem letzten Absatz
   dessen margin-bottom im Kasten (.cta-banner-text greift nur auf den Wrapper). */
.cta-banner-body > *:last-child { margin-bottom: 0; }

/* Produktionslinien-Slider (nutzt Referenzen-Scroll-Snap-Mechanik) */
.prodline-item-inner { height: 100%; background: var(--kb-white); border-top: 2px solid var(--kb-green-dark); box-shadow: 0 2px 14px rgba(var(--kb-black-rgb), .16); padding: 2rem; }
/* kleiner Innenabstand je Slide, damit der linke Schatten sichtbar bleibt */
.prodline-track .reference-item { padding-left: 10px; }
.prodline-track { padding-bottom: 1.5rem; padding-top: .5rem; }
.prodline-nav-side { position: absolute; top: 50%; transform: translate(-50%, -50%); margin-left: 0; z-index: 3; }
.prodline-nav-prev { left: 0; }
.prodline-nav-next { left: auto; right: 0; transform: translate(50%, -50%); }
/* Marker auf dem Produktionslinien-Bild + Vorschau rechts */
.prodline-marker-stage { position: relative; width: 100%; line-height: 0; }
.prodline-marker { position: absolute; transform: translate(-50%, -50%); width: 2rem; height: 2rem; border-radius: 50%; background: var(--kb-yellow); color: var(--kb-dark); border: 0; box-shadow: 0 1px 4px rgba(var(--kb-black-rgb), .35); display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer; z-index: 2; line-height: 1; }
.prodline-marker .prodline-marker-icon-active { display: none; }
.prodline-marker.active { background: var(--kb-orange); color: var(--kb-white); }
.prodline-marker.active .prodline-marker-icon-default { display: none; }
.prodline-marker.active .prodline-marker-icon-active { display: inline-block; }
.prodline-preview { height: 100%; color: var(--kb-white); background: var(--kb-gradient); padding: 0; font-size: .9rem; }
.prodline-preview-body { padding: 1.25rem; }
.prodline-preview-img { display: block; width: 100%; height: auto; margin-bottom: 0; }
.prodline-preview-name { font-size: 1.1rem; margin-bottom: .5rem; color: var(--kb-white); }
.news-box-arrow { flex: 0 0 auto; align-self: stretch; display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; background: var(--kb-yellow); color: var(--kb-white); text-decoration: none; }
.news-box-arrow:hover, .news-box-arrow:focus { background: var(--kb-green); color: var(--kb-white); }
/* Tab-Header: eckig, grosszuegige Abstaende; aktiv grau, inaktiv graue Schrift, ANFRAGE orange */
.subhead-nav .nav-pills { gap: .5rem; margin-bottom: 0; }
.subhead-nav .nav-link { border-radius: 0; padding: 1rem 1.9rem; background: transparent; color: var(--kb-gray); }
.subhead-nav .nav-link:hover, .subhead-nav .nav-link:focus { color: var(--kb-dark); }
.subhead-nav .nav-link.active { background: var(--kb-muted); color: var(--kb-dark); }
.subhead-nav .nav-link.machine-tab-request,
.subhead-nav .nav-link.machine-tab-request.active { border-radius: 0; background: var(--kb-orange); color: var(--kb-white); font-weight: 700; }
.subhead-nav .nav-link.machine-tab-request:hover, .subhead-nav .nav-link.machine-tab-request:focus { color: var(--kb-white); opacity: .9; }

/* D2U News und Messen: Tabs im Kaltenbach-Stil (eckig, korrekte Farben) */
.d2u-news-tabs { --bs-nav-pills-border-radius: 0; gap: .25rem; margin-bottom: 1.5rem; }
.d2u-news-tabs .nav-link { border-radius: 0; color: var(--kb-dark); background: var(--kb-muted); font-weight: 700; text-transform: uppercase; }
.d2u-news-tabs .nav-link:hover, .d2u-news-tabs .nav-link:focus { color: var(--kb-green); background: var(--kb-muted); }
.d2u-news-tabs .nav-link.active { background: var(--kb-green); color: var(--kb-white); }
.d2u-news-tabs .nav-link.active:hover, .d2u-news-tabs .nav-link.active:focus { color: var(--kb-white); }

/* D2U Linkbox: Pfeil im Bild-Overlay weiss (statt geerbtem Gruen) */
.teaser-with-backgroundimage .fa-chevron-right { color: var(--kb-white); }

/* Footer-Redesign: grau oben/unten, weiss (Claim), 4-Spalten-Sitemap */
#footer { background: var(--kb-muted); }
#footer .footer-top { background: var(--kb-muted); }
#footer .footer-claim { background: var(--kb-white); }
#footer .footer-bottom { background: var(--kb-muted); }
#footer .footer-sitemap { columns: 4; column-gap: 2rem; margin-bottom: 1.5rem; }
#footer .footer-sitemap a { text-decoration: none; }
#footer .footer-sitemap > .footer-sitemap-group { break-inside: avoid; display: inline-block; width: 100%; margin-bottom: 1rem; }
#footer .footer-sitemap .footer-sitemap-lev1 { font-weight: 700; display: block; margin-bottom: 0.25rem; }
#footer .footer-sitemap .footer-sitemap-sub { padding-left: 0; margin: 0; }
#footer .footer-sitemap .footer-sitemap-sub > li { margin-bottom: 0.2rem; }
#footer .footer-sitemap .footer-sitemap-sub3 { padding-left: 0.75rem; margin: 0.1rem 0 0.35rem; font-size: 0.9rem; }
#footer .footer-sitemap li { break-inside: avoid; margin-bottom: 0.35rem; }
#footer .footer-claim .social-media a img { border: 0; }
#footer .footer-top .back-to-top.btn { color: var(--kb-white); font-size: 1rem; width: 2.75rem; height: 2.75rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 991.98px) { #footer .footer-sitemap { columns: 2; } }
@media (max-width: 575.98px) { #footer .footer-sitemap { columns: 1; } }

/* Get-in-Touch-Block: Beratungsbild links (fluid, volle Hoehe, kein Repeat), graues Band, weisse CTA-Box mit Schatten. Bild wird inline aus den D2U-Einstellungen gesetzt. */
.get-in-touch { background-color: var(--kb-muted); background-repeat: no-repeat; background-position: left center; background-size: auto 100%; margin-bottom: 3rem; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.get-in-touch-box { background: var(--kb-white); padding: 2.5rem; box-shadow: 0 8px 24px rgba(var(--kb-black-rgb), .15); }
.get-in-touch-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }
.get-in-touch-btn:hover, .get-in-touch-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }

/* Modul 100: oranger CTA-Button, GeomGraphic italic */
.module100-btn { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
.module100-btn:hover, .module100-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }

/* Modul 011: Titel optional in GeomGraphic (Option im Modul) */
.module011-heading-geom { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; }

/* Modul 011: dunkelgruener Hintergrund-Streifen (Farbverlauf), heller Text.
   Bullets bleiben orange (Markenakzent, guter Kontrast auf Dunkelgruen). */
.module011-band-green { background: var(--kb-gradient); color: var(--kb-white); }
.module011-band-green h2, .module011-band-green .text-kicker, .module011-band-green p, .module011-band-green li, .module011-band-green a:not(.btn) { color: var(--kb-white); }

/* Modul 011: Bildtitel aus dem Medienpool als abgesetzter grauer Block unter dem Bild.
   Figure ist eine Flex-Column: Bildbereich fuellt die an die Texthoehe angeglichene Box
   (object-fit-cover, overflow-hidden -> kein Scrollbalken), der Titel sitzt als Block darunter. */
.module011-figure { display: flex; flex-direction: column; margin: 0; }
.module011-figure--natural { align-self: center; max-width: 100%; }
.module011-figure-img { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.module011-figure-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.module011-caption { display: block; flex: 0 0 auto; background: var(--kb-muted); color: var(--kb-dark); padding: .6rem 1rem; font-size: .9rem; }

/* Editor-Listen (Module 011/015 u.a.): kleine orange Bullets (wie Feature-Liste) */
.editor-list { list-style: none; padding-left: 0; }
.editor-list li { position: relative; padding-left: 1.4rem; margin-bottom: .5rem; }
.editor-list li::before { content: ""; position: absolute; left: 0; top: .5em; width: .45rem; height: .45rem; background: var(--kb-orange); }

/* D2U Linkbox Typ 9: Karussell ueber volle Bildschirmbreite, Karten wie Maschinen-Kategorienliste */
.linkbox-carousel-wrap { position: relative; }
.linkbox-carousel-wrap::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -50vw; width: 100vw; background: var(--kb-muted); z-index: -1; }
.linkbox-carousel { overflow: hidden; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); width: 100vw; }
.linkbox-carousel-track { display: flex; gap: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; padding: .5rem 1rem 1.5rem; }
.linkbox-carousel-track::-webkit-scrollbar { display: none; }
.linkbox-carousel-item { flex: 0 0 80%; scroll-snap-align: start; }
@media (min-width: 576px)  { .linkbox-carousel-item { flex-basis: 45%; } }
@media (min-width: 768px)  { .linkbox-carousel-item { flex-basis: 30%; } }
@media (min-width: 992px)  { .linkbox-carousel-item { flex-basis: 22%; } }
@media (min-width: 1200px) { .linkbox-carousel-item { flex-basis: 18%; } }
.linkbox-carousel-btn { width: 2.75rem; height: 2.75rem; border-radius: 0; background: var(--kb-line); color: var(--kb-dark); border: 0; margin-left: .5rem; }
.linkbox-carousel-btn:hover, .linkbox-carousel-btn:focus { background: var(--kb-line); color: var(--kb-dark); }

/* D2U Linkbox Typ 10: graues Band, weisse Boxen mit Schatten, Icon links, Titel (Geom) + Text rechts */
.linkbox-iconbox-wrap { position: relative; z-index: 0; }
.linkbox-iconbox-wrap::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -50vw; width: 100vw; background: var(--kb-muted); z-index: -1; }
.linkbox-iconbox { display: flex; align-items: center; gap: 2rem; height: 100%; padding: 1.5rem 1.75rem; background: var(--kb-white); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); color: var(--kb-dark); text-decoration: none; }
a.linkbox-iconbox:hover, a.linkbox-iconbox:focus { color: var(--kb-dark); }
.linkbox-iconbox-icon { flex: 0 0 auto; width: 5.25rem; }
.linkbox-iconbox-icon img { display: block; width: 100%; height: auto; }
.linkbox-iconbox-body { flex: 1 1 auto; }
.linkbox-iconbox-title { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; font-size: 1.3rem; margin: 0 0 .5rem; }
a.linkbox-iconbox:hover .linkbox-iconbox-title { color: var(--kb-green); }
.linkbox-iconbox-text { color: var(--kb-dark); }

/* Stellenkacheln: Kategorie-Buttons gelb, GeomGraphic italic */
.jobs-cat-btn { background: var(--kb-yellow); border-color: var(--kb-yellow); color: var(--kb-dark); font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; font-weight: 400; }
.jobs-cat-btn:hover, .jobs-cat-btn:focus { background: var(--kb-green-dark); border-color: var(--kb-green-dark); color: var(--kb-white); }
/* Mobil: Hintergrundbild aus, stattdessen echtes Bild oben im Fluss, Box darunter */
@media (max-width: 991.98px) {
  .get-in-touch { background-image: none !important; }
}

/* Globale Ueberschriftengroessen */
h1, .h1 { font-size: 2.25rem; }
h2, .h2 { font-size: 2rem; }
h3, .h3 { font-size: 1.75rem; }
h4, .h4 { font-size: 1.5rem; }
h5, .h5 { font-size: 1.25rem; }
h6, .h6 { font-size: 1.1rem; }
/* Modul 034 Hero Video: Ueberschrift + CTA-Zeile 2 kursiv */
.hero-video-heading { font-style: italic; }
.hero-cta-strong { font-style: italic; }

/* Consent-Dialog (consent_manager) im Kaltenbach-Stil: Markenverlauf, weisse Schrift, angepasste Buttons */
#consent_manager-background { align-items: flex-end !important; padding: 0 !important; }
#consent_manager-wrapper { background: var(--kb-gradient) !important; color: var(--kb-white) !important; border: 0 !important; max-width: 100% !important; width: 100% !important; }
/* Bootstrap-5-Variante: Card-Header/Body transparent, Texte weiss */
#consent_manager-wrapper .card-header,
#consent_manager-wrapper .card-body,
#consent_manager-wrapper .card-footer { background: transparent !important; border-color: rgba(var(--kb-white-rgb), .3) !important; max-width: 1320px; width: 100%; margin-left: auto !important; margin-right: auto !important; }
#consent_manager-wrapper .card-title,
#consent_manager-wrapper .text-muted,
#consent_manager-wrapper .consent_manager-headline,
#consent_manager-wrapper p.consent_manager-text,
#consent_manager-wrapper .consent_manager-cookiegroups label,
#consent_manager-wrapper .consent_manager-cookiegroup-checkbox span,
#consent_manager-wrapper .consent_manager-show-details a,
#consent_manager-wrapper .consent_manager-sitelinks a,
#consent_manager-wrapper a { color: var(--kb-white) !important; }
#consent_manager-wrapper .consent_manager-sitelinks a,
#consent_manager-wrapper a { text-decoration: underline; }
/* Close-Button (BS5 btn-close) weiss einfaerben */
#consent_manager-wrapper .btn-close { filter: brightness(0) invert(1); opacity: 1; }
#consent_manager-wrapper .consent_manager-close-box { color: var(--kb-white) !important; border-color: var(--kb-white) !important; }
/* Buttons: alle gleichwertig (kein Dark Pattern) - Secondary im Orange, eckig */
#consent_manager-accept-all,
#consent_manager-save-selection,
#consent_manager-accept-none { background: var(--kb-white) !important; border: 2px solid var(--kb-orange) !important; color: var(--kb-orange) !important; border-radius: 0 !important; font-weight: 700; box-shadow: none !important; }
#consent_manager-accept-all:hover,
#consent_manager-accept-all:focus,
#consent_manager-save-selection:hover,
#consent_manager-save-selection:focus,
#consent_manager-accept-none:hover,
#consent_manager-accept-none:focus { background: var(--kb-orange) !important; border-color: var(--kb-orange) !important; color: var(--kb-white) !important; }
/* Button-Zeile: alle gleich breit (= breitester Button), rechtsbuendig */
#consent_manager-wrapper .row:has(#consent_manager-accept-all) { display: grid !important; grid-auto-flow: column !important; grid-auto-columns: 1fr !important; width: -moz-fit-content !important; width: fit-content !important; margin-left: auto !important; margin-right: auto !important; gap: .5rem !important; }
#consent_manager-wrapper .row:has(#consent_manager-accept-all) > [class*="col"] { width: auto !important; max-width: none !important; padding: 0 !important; display: flex !important; }
#consent_manager-accept-all,
#consent_manager-save-selection,
#consent_manager-accept-none { width: 100% !important; height: 100% !important; }
/* Checkboxen als Switcher */
#consent_manager-wrapper .form-check { min-height: auto; padding-left: 3em; }
#consent_manager-wrapper .form-check-input[type="checkbox"] { margin-left: -3em; width: 2.25em; height: 1.25em; border-radius: 2em !important; background-color: rgba(var(--kb-white-rgb), .3); border-color: rgba(var(--kb-white-rgb), .6); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e"); background-position: left center; background-repeat: no-repeat; transition: background-position .15s ease-in-out; }
#consent_manager-wrapper .form-check-input[type="checkbox"]:checked { background-color: var(--kb-orange); border-color: var(--kb-orange); background-position: right center; }
/* Show/Hide-Details-Button + weitere Texte weiss */
#consent_manager-wrapper .btn-link,
#consent_manager-wrapper .text-secondary { color: var(--kb-white) !important; }
/* Detailbereich/Accordion: transparent, weisse Schrift, Rahmen zur Abgrenzung */
#consent_manager-wrapper .bg-white,
#consent_manager-wrapper .bg-light { background: transparent !important; }
#consent_manager-wrapper .card-details,
#consent_manager-wrapper .accordion,
#consent_manager-wrapper .accordion-item,
#consent_manager-wrapper .accordion-header,
#consent_manager-wrapper .accordion-button,
#consent_manager-wrapper .accordion-body,
#consent_manager-wrapper .accordion-collapse { background: transparent !important; color: var(--kb-white) !important; }
#consent_manager-wrapper .card-details,
#consent_manager-wrapper .accordion-item { border: 1px solid rgba(var(--kb-white-rgb), .3) !important; }
#consent_manager-wrapper .accordion-button { box-shadow: none !important; }
#consent_manager-wrapper .accordion-button::after { filter: brightness(0) invert(1); }

/* Editor-Ueberschrift (WYSIWYG): Grundgewicht normal, Fett kommt aus <strong> */
.editor-heading { font-weight: 400; }

/* Referenzen-Karusell: Kicker fett */
.reference-box .text-kicker { font-weight: 700; }

/* Modul 090: responsives IFrame (16:9) */
.iFrameWrapper { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; }
.iFrameWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Referenzen-Karusell: Read-more-Button mit Verlauf wie mobile Navi */
.reference-readmore-btn { background: linear-gradient(to top right, var(--kb-green-dark), var(--kb-green)); border: 0; color: var(--kb-white); }
.reference-readmore-btn:hover, .reference-readmore-btn:focus { color: var(--kb-white); filter: brightness(1.05); }

/* Maschinen manuelle Auswahl: Bild max. Boxbreite, gelber Chevron rechts (News-Stil) */
.machine-manual-list .bluebox { text-decoration: none; background: var(--kb-white); display: block; height: 100%; box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); }
.machine-manual-list .box img { max-width: 100%; width: auto; height: auto; display: block; margin-inline: auto; }
.machine-manual-list .machine-manual-title { display: flex; align-items: stretch; justify-content: space-between; min-height: 3.5rem; }
.machine-manual-list .machine-manual-name { align-self: center; padding: .5rem 1rem; }
.machine-manual-list .machine-manual-arrow { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; background: var(--kb-yellow); color: var(--kb-white); }
.machine-manual-list .bluebox:hover .machine-manual-arrow { background: var(--kb-green); }
.machine-manual-list .teaser { padding: 0 1rem 1rem; }

/* Modul 014: gruene Sidebox mit Navi-Verlauf */
.green-sidebox { background: var(--kb-gradient); color: var(--kb-white); position: relative; z-index: 2; }
@media (min-width: 768px) { .green-sidebox { margin-left: -3rem; margin-top: 3rem; width: calc(100% + 3rem); } }
.green-sidebox a { color: var(--kb-white); }
.green-sidebox h1, .green-sidebox h2, .green-sidebox h3,
.green-sidebox h4, .green-sidebox h5, .green-sidebox h6 { color: var(--kb-white); font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; }

/* Modul 015: wie Modul 011 (Bild + Text nebeneinander), aber der Text steckt in einer
   grauen Box, die bis zum Viewport-Rand reicht und das Bild deutlich ueber dessen Mitte
   hinaus ueberlappt. .editor-overlap-outer bricht dafuer per -50vw-Trick (wie
   .category-hero-media) aus einem etwaigen .container aus, damit die Box wirklich den
   Seitenrand erreicht statt nur den Rand der Modul-Spalte. Innen ein simples 2-spaltiges
   CSS-Grid (Text-Spalte/Bild-Spalte, grid-template-columns kommt inline aus output.php,
   abhaengig von der Bildbreiten-Auswahl) - die Box bekommt aber unten eine FESTE Breite
   von 70vw statt einfach ihre Spalte auszufuellen (Grid-Default waere "stretch"), ragt
   dadurch ueber die Spaltengrenze hinaus ins Bild (der Grid-Container schneidet
   ueberstehende Kinder nicht ab) und das ergibt den Ueberlapp-Effekt, ganz ohne eigene
   Ueberlapp-Spalte. Der groessere Innenabstand auf der aeusseren (Viewport-Rand-)Seite
   kommt aus den Modifiern .box-outer-left/.box-outer-right weiter unten. */
.editor-overlap-outer { position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; margin-bottom: 3rem; }
@media (max-width: 767.98px) {
  .editor-overlap-outer { margin-bottom: 2rem; }
}
.editor-overlap-grid { display: none; align-items: stretch; }
@media (min-width: 768px) {
  .editor-overlap-grid { display: grid; }
}
/* Die Bildhoehe (img) ist bewusst auf 88% begrenzt und zentriert: eine Prozenthoehe
   traegt bei der automatischen Grid-Zeilenhoehe nicht bei (wird dort wie "auto"
   behandelt), die Zeilenhoehe kommt also allein aus dem Textinhalt der Box - das Bild
   wird danach auf die resultierende Zeilenhoehe gestreckt, bleibt aber dank der 88%
   immer sichtbar kleiner als die Box, statt sie exakt auszufuellen. */
.editor-overlap-media { position: relative; z-index: 1; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.editor-overlap-media img { display: block; width: 100%; height: 88%; }
/* Auf der Seite, die am Viewport-Rand liegt (box-outer-left/-right, siehe output.php),
   deutlich mehr Innenabstand als auf der Seite, die ins Bild hineinragt (Details zum
   genauen Wert in deren eigenem Kommentar weiter unten). Hintergrund ist halbtransparent
   (--kb-header-rgb ist dasselbe Grau wie --kb-muted, nur als r,g,b-Tripel fuer rgba())
   statt deckend, damit das darunterliegende Bild im Ueberlappungsbereich leicht
   durchscheint statt komplett verdeckt zu werden. */
/* Schatten wie bei den anderen Karten-artigen Design-Elementen im Projekt (.news-card,
   .machine-list-card, .news-box, .machine-manual-list .bluebox, .download-item - alle
   nutzen denselben dezenten Schatten). */
.editor-overlap-box { position: relative; z-index: 2; background: rgba(var(--kb-header-rgb), .93); box-shadow: 0 2px 8px rgba(var(--kb-black-rgb), .08); padding: 2.5rem 2rem; display: flex; flex-direction: column; justify-content: center; }
/* Feste 70vw-Breite (statt der vollen Grid-Spalte) + Ausrichtung per justify-self an
   genau dem Rand, der aussen liegt - so bleibt die Box insgesamt auf 70% des Viewports
   begrenzt und ragt trotzdem vom aeusseren Rand her ins Bild hinein.

   Der Innenabstand auf dieser aeusseren Seite ist keine frei geschaetzte Zahl mehr,
   sondern rechnet exakt den Abstand nach, den Bootstraps echter .container an der
   jeweiligen Breakpoint-Stufe hat (calc((100vw - Container-max-width) / 2) plus den
   halben Standard-Gutter von .75rem) - der Text soll ja buendig mit dem Text in den
   anderen (normal in einem .container liegenden) Bloecken wie Modul 011 beginnen, nicht
   an einem eigenen, frei erfundenen Abstand. Box-outer-left/-right liegt selbst am
   Viewport-Rand (x=0 bzw. x=100vw), daher ist 100vw hier dieselbe Bezugsgroesse wie fuer
   einen echten Container. Deshalb vier Stufen statt eines einzelnen Werts/einer
   vw-Formel: Bootstraps Container-Breite macht an jedem Breakpoint einen Sprung
   (540/720/960/1140/1320px), kein stetiges Wachstum. */
@media (min-width: 768px) {
  .editor-overlap-box.box-outer-left { width: 70vw; justify-self: start; padding-left: calc((100vw - 720px) / 2 + .75rem); padding-right: 1.5rem; }
  .editor-overlap-box.box-outer-right { width: 70vw; justify-self: end; padding-right: calc((100vw - 720px) / 2 + .75rem); padding-left: 1.5rem; }
}
@media (min-width: 992px) {
  .editor-overlap-box.box-outer-left { padding-left: calc((100vw - 960px) / 2 + .75rem); }
  .editor-overlap-box.box-outer-right { padding-right: calc((100vw - 960px) / 2 + .75rem); }
}
@media (min-width: 1200px) {
  .editor-overlap-box.box-outer-left { padding-left: calc((100vw - 1140px) / 2 + .75rem); }
  .editor-overlap-box.box-outer-right { padding-right: calc((100vw - 1140px) / 2 + .75rem); }
}
@media (min-width: 1400px) {
  .editor-overlap-box.box-outer-left { padding-left: calc((100vw - 1320px) / 2 + .75rem); }
  .editor-overlap-box.box-outer-right { padding-right: calc((100vw - 1320px) / 2 + .75rem); }
}
@media (max-width: 767.98px) {
  .editor-overlap-box { padding: 1.75rem 2rem; }
}

/* GeomGraphic fuer ausgewaehlte Elemente (Rest bleibt Cairo) */
.hero-video-heading,
.hero-cta-strong,
.text-kicker,
.jobs-apply-btn,
.news-promo-btn,
.module015-btn,
.module016-btn,
.reference-overview-btn,
.get-in-touch-btn,
.faq-cta-btn,
.h4-footer,
.partner-heading,
.get-in-touch-heading,
.machine-cat-card-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; }
.h4-footer { font-style: italic; }
.partner-heading { font-weight: 400; font-style: italic; }
.get-in-touch-heading { font-weight: 400; font-style: italic; text-transform: uppercase; }

/* Breadcrumbs (globales Template): GeomGraphic wie Kicker, schwarz, ohne Unterstreichung; aktuelle Seite fett */
/* Duenne Leiste im hellen Metanavi-Grau */
/* Module bauen ihren vertikalen Abstand nur ueber Bottom-Padding auf (py-5 pt-0 etc.) und */
/* verlassen sich auf Abstand vom vorherigen Element. Die Breadcrumb-Leiste liefert sonst keinen -> */
/* Kicker/Ueberschrift kleben direkt an der Leiste, wenn das erste Modul auf der Seite pt-0 nutzt. */
.breadcroumpwrapper {
  background: var(--kb-muted);
  margin-bottom: 0; }
.breadcroumpwrapper .container .breadcrumb {
  min-height: var(--kb-breadcrumb-h);
  align-items: center;
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 0;
  font-size: 0.85rem;
  line-height: 1.4; }
.breadcroumpwrapper .breadcrumb,
.breadcroumpwrapper .breadcrumb .breadcrumb-item,
.breadcroumpwrapper .breadcrumb .breadcrumb-item a,
.breadcroumpwrapper .breadcrumb .breadcrumb-item strong,
.breadcroumpwrapper .breadcrumb .breadcrumb-item b {
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-weight: 300;
  font-style: italic;
  color: var(--kb-black);
  text-decoration: none; }
.breadcroumpwrapper .breadcrumb .breadcrumb-item a:hover,
.breadcroumpwrapper .breadcrumb .breadcrumb-item a:focus {
  color: var(--kb-black);
  text-decoration: none; }
/* Trenner "|" statt "/" */
.breadcroumpwrapper .breadcrumb {
  --bs-breadcrumb-divider: '|'; }
.breadcroumpwrapper .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: '|';
  font-weight: 300;
  font-style: italic; }
/* Nur das letzte Element (= aktuelle Seite) fett */
.breadcroumpwrapper .breadcrumb .breadcrumb-item:last-child,
.breadcroumpwrapper .breadcrumb .breadcrumb-item:last-child a,
.breadcroumpwrapper .breadcrumb .breadcrumb-item:last-child strong,
.breadcroumpwrapper .breadcrumb .breadcrumb-item:last-child b {
  font-weight: 500; }

/* Schriftgroessen: Body 16px, Rest in Relation reduziert; Navi bleibt auf voriger Groesse */
body { font-size: 1rem; }                  /* 16px */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { color: var(--kb-green-dark); }
h1, .h1 { font-size: 1.964rem; }           /* ~31.4px */
h2, .h2 { font-size: 1.818rem; }           /* ~29.1px */
#header #mainnavi > li > a.nav-link { font-size: 1.105rem; }        /* beibehalten */
#header #mainnavi > li:nth-last-child(2) > a.nav-link,
#header #mainnavi > li:last-child > a.nav-link { font-size: 0.997rem; }  /* beibehalten */
#metanavi .dropdown-toggle,
#metanavi #search-icon .nav-link,
#search-icon .nav-link { font-size: 0.839rem; }   /* beibehalten */
.text-kicker { font-size: 1.182rem; }      /* ~18.9px */
.hero-video-text { font-size: 1.182rem; font-weight: 600; }  /* ~18.9px, Semibold */
.hero-video-text strong, .hero-video-text b { font-weight: 600; }
.hero-cta-line { font-size: 0.991rem; }    /* ~15.9px */
.hero-cta-strong { font-size: 1.223rem; }  /* ~19.6px */
.machine-cat-card-label { font-size: 0.909rem; font-weight: 600; }  /* Semibold ~14.5px */
.get-in-touch-btn,
.news-promo-btn,
.module015-btn,
.module016-btn,
.reference-overview-btn,
.faq-cta-btn,
.jobs-apply-btn { font-size: 0.855rem; font-style: italic; }  /* ~13.7px */
.prodline-preview-name { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 600; font-style: italic; font-size: 1.205rem; }  /* +25% ~19.3px */
.prodline-preview-teaser { font-size: 0.915rem; }  /* +25% ~14.6px */
.prodline-preview-link { font-family: 'GeomGraphic', 'Cairo', sans-serif; font-weight: 400; font-style: italic; font-size: 0.705rem; }  /* +25% ~11.3px */

/* =====================================================================
   FAQ-Modul (110): natives <details>-Akkordeon + Tag-Filter
   ===================================================================== */
.faq-module { position: relative; z-index: 0; }
.faq-module::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -50vw; width: 100vw; background: var(--kb-muted); z-index: -1; }
/* .faq-inner ist ein Bootstrap .container -> Container-Breite beibehalten (nicht fluid). */
.faq-inner > * { max-width: 83.333%; margin-left: 0; margin-right: auto; }
@media (max-width: 991.98px) { .faq-inner > * { max-width: 100%; } }
/* Kategorie-Kontaktbox (machine_applications_extension): weisse Schatten-Box, ragt zur Haelfte ueber das
   graue FAQ-Band (Verlaufs-/Orange-CTAs wie im Hero-Modul) */
.category-contact-wrap { position: relative; z-index: 2; margin-top: 3rem; margin-bottom: -5.5rem; }
.category-contact-box { display: flex; flex-wrap: wrap; align-items: stretch; background: var(--kb-white); }
.category-contact-text { flex: 1 1 320px; padding: 2rem 2.25rem; }
.category-contact-actions { flex: 0 0 auto; display: flex; flex-direction: column; min-width: 17rem; }
.category-contact-btn { flex: 1 1 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.75rem; color: var(--kb-white); text-decoration: none; font-family: 'GeomGraphic', 'Cairo', sans-serif; font-style: italic; }
.category-contact-btn:hover, .category-contact-btn:focus { color: var(--kb-white); filter: brightness(1.05); }
.category-contact-btn-green { background: linear-gradient(to top right, var(--kb-green-dark), var(--kb-green)); }
.category-contact-btn-orange { background: var(--kb-orange); }
.category-contact-wrap + .faq-module { padding-top: 8.5rem !important; }
@media (max-width: 575.98px) {
  .category-contact-wrap { margin-bottom: -3rem; }
  .category-contact-wrap + .faq-module { padding-top: 6rem !important; }
}
.faq-heading {
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-weight: 400;
  font-style: italic;
  color: var(--kb-green-dark);
}

/* Tag-Chips: gruener Umriss (nicht befuellt); aktiv = Farbverlauf dunkelgruen -> Kaltenbach-Gruen */
.faq-tags { display: flex; flex-wrap: wrap; gap: .5rem; }
.faq-tag {
  border: 1px solid var(--kb-green);
  background: transparent;
  color: var(--kb-green);
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-style: italic;
  font-size: .855rem;
  line-height: 1.2;
  padding: .55rem 1.1rem;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s, border-color .15s, color .15s;
}
.faq-tag:hover { background: var(--kb-green); color: var(--kb-white); }
.faq-tag:focus { outline: none; }
.faq-tag:focus-visible { outline: 2px solid var(--kb-green-dark); outline-offset: 2px; }
.faq-tag.is-active {
  border-color: var(--kb-green-dark);
  color: var(--kb-white);
  background: linear-gradient(90deg, var(--kb-green-dark), var(--kb-green));
}

/* Frage/Antwort als weisser Block auf grauem Grund */
.faq-item {
  background: var(--kb-white);
  margin-bottom: .75rem;
  box-shadow: 0 1px 4px rgba(var(--kb-black-rgb), .06);
}
.faq-item[hidden] { display: none; }
.faq-q {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.25rem;
  cursor: pointer;
  list-style: none;
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-weight: 600;
  color: var(--kb-green-dark);
}
.faq-q::-webkit-details-marker { display: none; }
.faq-q::marker { content: ""; }
.faq-q:hover { color: var(--kb-green); }
/* Chevron links, schwarz, duenn (CSS-gezeichnet); zu = nach rechts, offen = nach unten */
.faq-chevron {
  flex: 0 0 auto;
  width: .5em;
  height: .5em;
  border-right: 1.5px solid var(--kb-black);
  border-bottom: 1.5px solid var(--kb-black);
  transform: rotate(-45deg);
  transition: transform .2s ease;
}
.faq-item[open] .faq-chevron { transform: rotate(45deg); }
/* Antwort buendig unter dem Fragetext beginnen (Chevron-Breite + Gap einruecken) */
.faq-a { padding: 0 1.25rem 1.25rem calc(1.25rem + .5em + .75rem); }
.faq-a-inner { max-width: none; }

/* Kontakt-Block unter den FAQ: zwei weisse Bloecke mit schmaler grauer Fuge */
.faq-cta {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-top: 3rem;
}
/* Eigener weisser Bereich fuer das grosse Fragezeichen.
   Groesse/Hoehe wird per JS an den Textblock daneben angeglichen (custom.js);
   die Werte hier greifen als Fallback und im umgebrochenen Zustand. */
.faq-cta-icon {
  flex: 0 0 auto;
  width: 7rem;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--kb-white);
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-weight: 300;
  font-style: italic;
  font-size: 3.75rem;
  line-height: 1.15;
  box-shadow: 0 1px 4px rgba(var(--kb-black-rgb), .06);
}
/* Fragezeichen mit Farbverlauf dunkelgruen (links) -> Kaltenbach-Gruen (rechts).
   Symmetrisches Padding: gibt der kursiven Glyphe rechts Platz, ohne sie aus der Mitte zu ruecken. */
.faq-cta-icon > span { display: inline-block; padding: 0 .2em; color: var(--kb-green); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .faq-cta-icon > span {
    background: linear-gradient(90deg, var(--kb-green-dark), var(--kb-green));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
}
.faq-cta-main {
  flex: 1 1 280px;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding: 1.5rem;
  background: var(--kb-white);
  box-shadow: 0 1px 4px rgba(var(--kb-black-rgb), .06);
}
.faq-cta-text { flex: 1 1 260px; }
.faq-cta-title {
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-weight: 700;
  color: var(--kb-green-dark);
  margin: 0 0 .35rem;
}
.faq-cta-body { margin: 0; max-width: 60ch; }
/* Button im "Career"-Stil, aber nicht gefuellt (oranger Umriss) */
.faq-cta-btn { flex: 0 0 auto; background: transparent; border-color: var(--kb-orange); color: var(--kb-orange); }
.faq-cta-btn:hover,
.faq-cta-btn:focus { background: var(--kb-orange); border-color: var(--kb-orange); color: var(--kb-white); }

@media (max-width: 575.98px) {
  .faq-q { font-size: .95rem; }
  .faq-cta-icon { width: 5rem; font-size: 3rem; }
}

/* ===== Stellenmarkt (D2U Stellenmarkt - Stellen): Filter + Grid ===== */
.jobs-buttons { display: flex; flex-wrap: wrap; }
.jobs-filter-group { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.jobs-filter-label {
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-style: italic;
  color: var(--kb-green-dark);
  margin-right: .25rem;
}
/* Tag-Chips: identisch zum FAQ-Modul (gruener Umriss, aktiv = Farbverlauf) */
.jobs-tags { display: flex; flex-wrap: wrap; gap: .5rem; }
.jobs-tag {
  border: 1px solid var(--kb-green);
  background: transparent;
  color: var(--kb-green);
  font-family: 'GeomGraphic', 'Cairo', sans-serif;
  font-style: italic;
  font-size: .855rem;
  line-height: 1.2;
  padding: .55rem 1.1rem;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s, border-color .15s, color .15s;
}
.jobs-tag:hover { background: var(--kb-green); color: var(--kb-white); }
.jobs-tag:focus { outline: none; }
.jobs-tag:focus-visible { outline: 2px solid var(--kb-green-dark); outline-offset: 2px; }
.jobs-tag.is-active {
  border-color: var(--kb-green-dark);
  color: var(--kb-white);
  background: linear-gradient(90deg, var(--kb-green-dark), var(--kb-green));
}

/* Job-Karten nutzen das Maschinen-Grid-Layout (machine-list-*), 2 pro Reihe. */
.jobs-grid-col[hidden] { display: none; }
/* Stellentitel in Cairo (Body-Font), Ort bleibt Geom. */
.jobs-card-name { font-family: 'Cairo', sans-serif; font-style: normal; }
.jobs-card-city { font-family: 'GeomGraphic', 'Cairo', sans-serif; }
/* Teaser: Hoehe deckeln und nur die letzte Zeile weich ausblenden (Opacity-Verlauf). */
.jobs-teaser-fade {
  max-height: 10.5em;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, var(--kb-black) calc(100% - 50px), transparent 100%);
  mask-image: linear-gradient(to bottom, var(--kb-black) calc(100% - 50px), transparent 100%);
}
.jobs-empty { font-style: italic; color: var(--kb-green-dark); }
/* Hero-Video-Box im Stellen-Detail: kein Video darueber -> negativen Ueberlapp-Margin
   und den Video-Ueberbreiten-Trick zuruecknehmen, sonst deckt der Inhalt oben die Box ab. */
.jobs-hero-box { margin-top: 2rem !important; width: auto !important; margin-left: 0 !important; }
/* E-Mail- und Bewerbungs-Button in den Hero-CTA-Boxen: als Button erkennbar, zentriert */
.jobs-hero-btn { align-self: center; margin-top: .5rem; }
/* Kontakt-Frage im Hero-Block kleiner halten (hero-video-heading ist sonst sehr gross) */
.jobs-hero-question { font-size: 1.25rem; font-family: 'Cairo', sans-serif; font-style: normal; }
/* Linke Hero-Spalte: vertikal mittig, Text in Cairo (nicht Geom) und nicht kursiv */
.jobs-hero-left, .jobs-hero-left .hero-video-text { font-family: 'Cairo', sans-serif; font-style: normal; }
/* Bewerbungsformular in grauer Box: Abstand zwischen den Feldern */
.jobs-apply-box .form-group,
.jobs-apply-box .rex-form-group,
.jobs-apply-box .checkbox,
.jobs-apply-box .form-check { margin-bottom: 1.25rem; }
/* Bildspalte schmaler halten, damit der Teaser links mehr Platz bekommt;
   Button sitzt unter dem Bild in derselben Spalte. */
.jobs-card-img-col { flex: 0 0 32%; max-width: 32%; display: flex; flex-direction: column; gap: .75rem; }
.jobs-card-img-col .machine-list-img { flex: 0 0 auto; height: auto; }
.jobs-card-btn { margin-top: auto; }
/* Sprachflagge im Read-More-Button (Gradient-Button) sichtbar halten */
.jobs-card-btn .job-lang-flag { height: 1em; width: auto; margin-right: .4rem; vertical-align: -.1em; }
@media (max-width: 767.98px) {
  .jobs-card-img-col { flex-basis: auto; max-width: 100%; }
}