/* barlow-semi-condensed-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 100;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 200;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 500;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 600;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 800;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* barlow-semi-condensed-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Barlow Semi Condensed';
  font-style: normal;
  font-weight: 900;
  src: url('/assets/fonts/barlow-semi-condensed-v16-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




:root{
 /* -----------------------------------------------------------------------
 1) BASE COLORS (single source of truth)
 ----------------------------------------------------------------------- */
 --brand-primary: #876944;
 --brand-primary-rgb: 135,105,68;
 --brand-secondary: #c9b599;
 --brand-secondary-rgb: 201,181,153;
 --neutral-900: #565759;
 --neutral-900-rgb: 86,87,89;
 --neutral-0: #ffffff;
 --neutral-0-rgb: 255,255,255;

 /* -----------------------------------------------------------------------
 2) SEMANTIC TOKENS (use these in components)
 ----------------------------------------------------------------------- */
 --color-bg:        var(--neutral-0);
 --color-text:      var(--neutral-900);
 --color-muted:     color-mix(in oklab, var(--color-text) 65%, var(--neutral-0));
 --color-surface:   #f5f3f3; /* kann auch computed sein, wenn du willst */
 --color-surface-2: color-mix(in oklab, var(--color-surface) 88%, var(--neutral-0));
 --color-border:    color-mix(in oklab, var(--color-text) 16%, var(--neutral-0));
 --color-link:       var(--brand-primary);
 --color-link-hover: color-mix(in oklab, var(--brand-primary) 85%, black);

 /* -----------------------------------------------------------------------
 3) TYPO TOKENS
 ----------------------------------------------------------------------- */
 --font-base:     "Barlow Semi Condensed", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
 --font-headings: "Barlow Semi Condensed", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

 --font-size-base: 1.45rem;
 --font-weight-base: 400;
 --line-height-base: 1.25;
 --heading-weight: 300;

 /* -----------------------------------------------------------------------
 4) COMPUTED SCALES
 - brand scale: mix with white
 - neutral scale: mix neutral-900 towards white
 ----------------------------------------------------------------------- */

 /* Brand (Primary) scale */
 --primary-100: var(--brand-primary);
 --primary-90:  color-mix(in oklab, var(--brand-primary) 90%,  var(--neutral-0));
 --primary-80:  color-mix(in oklab, var(--brand-primary) 80%,  var(--neutral-0));
 --primary-70:  color-mix(in oklab, var(--brand-primary) 70%,  var(--neutral-0));
 --primary-60:  color-mix(in oklab, var(--brand-primary) 60%,  var(--neutral-0));
 --primary-50:  color-mix(in oklab, var(--brand-primary) 50%,  var(--neutral-0));
 --primary-40:  color-mix(in oklab, var(--brand-primary) 40%,  var(--neutral-0));
 --primary-30:  color-mix(in oklab, var(--brand-primary) 30%,  var(--neutral-0));
 --primary-20:  color-mix(in oklab, var(--brand-primary) 20%,  var(--neutral-0));
 --primary-10:  color-mix(in oklab, var(--brand-primary) 10%,  var(--neutral-0));
 
 /* Brand (Secondary) scale */
 --secondary-100: var(--brand-secondary);
 --secondary-90:  color-mix(in oklab, var(--brand-secondary) 90%,  var(--neutral-0));
 --secondary-80:  color-mix(in oklab, var(--brand-secondary) 80%,  var(--neutral-0));
 --secondary-70:  color-mix(in oklab, var(--brand-secondary) 70%,  var(--neutral-0));
 --secondary-60:  color-mix(in oklab, var(--brand-secondary) 60%,  var(--neutral-0));
 --secondary-50:  color-mix(in oklab, var(--brand-secondary) 50%,  var(--neutral-0));
 --secondary-40:  color-mix(in oklab, var(--brand-secondary) 40%,  var(--neutral-0));
 --secondary-30:  color-mix(in oklab, var(--brand-secondary) 30%,  var(--neutral-0));
 --secondary-20:  color-mix(in oklab, var(--brand-secondary) 20%,  var(--neutral-0));
 --secondary-10:  color-mix(in oklab, var(--brand-secondary) 10%,  var(--neutral-0));

 /* Neutral scale (from neutral-900 towards white) */
 --neutral-800: color-mix(in oklab, var(--neutral-900) 90%,  var(--neutral-0));
 --neutral-700: color-mix(in oklab, var(--neutral-900) 80%,  var(--neutral-0));
 --neutral-600: color-mix(in oklab, var(--neutral-900) 70%,  var(--neutral-0));
 --neutral-500: color-mix(in oklab, var(--neutral-900) 60%,  var(--neutral-0));
 --neutral-400: color-mix(in oklab, var(--neutral-900) 45%,  var(--neutral-0));
 --neutral-300: color-mix(in oklab, var(--neutral-900) 30%,  var(--neutral-0));
 --neutral-200: color-mix(in oklab, var(--neutral-900) 18%,  var(--neutral-0));
 --neutral-100: color-mix(in oklab, var(--neutral-900) 10%,  var(--neutral-0));
 --neutral-50:  color-mix(in oklab, var(--neutral-900) 6%,   var(--neutral-0));

 /* -----------------------------------------------------------------------
 5) BOOTSTRAP MAPPING (runtime overrides)
 ----------------------------------------------------------------------- */
 --bs-primary: var(--brand-primary);
 --bs-primary-rgb: var(--brand-primary-rgb);
 --bs-secondary: var(--brand-secondary);
 --bs-secondary-rgb: var(--brand-secondary-rgb);

 --bs-body-bg: var(--color-bg);
 --bs-body-color: var(--color-text);

 --bs-link-color: var(--color-link);
 --bs-link-hover-color: var(--color-link-hover);

 --bs-body-font-family: var(--font-base);
 --bs-body-font-size: var(--font-size-base);
 --bs-body-font-weight: var(--font-weight-base);
 --bs-body-line-height: var(--line-height-base);

 --bs-heading-font-family: var(--font-headings);
 --bs-heading-font-weight: var(--heading-weight);

 --bs-card-bg: var(--color-surface);
 --bs-card-cap-bg: var(--color-surface-2);

 --bs-border-color: var(--color-border);

 /* optional, falls du es im Theme brauchst */
 --global-navi-main-link-color: #ffffff;
 
 --footer-link-color: var(--primary-20);
}


/*	@group	XS devices (portrait phones, less than 576px), default styles	*/

/*	@group	Theme Structure	*/

body	{
 background-color:	var(--bg-body);
}

.page	{
 margin-bottom:	-2rem;
}

#topheader	{
 z-index:	1021;
 background-color:	var(--topheader-background-color);
 top:	0px;
}

.header	{
 background-color:	white;
}

.headeradress	{
 top:	-1rem;
 right:	15px;
 text-align:	right;
 font-size:	0.85rem;
 font-weight:	500;
 background-color:	var(--primary-10);
 border-bottom-left-radius:	0.25rem;
 border-bottom-right-radius:	0.25rem;
 line-height:	1em;
}

.headeradress a	{
 color:	var(--brand-secondary);
}

.logo	{
 width:	100%;
 -webkit-transition:	all 0.5s ease-in-out;
 -moz-transition:	all 0.5s ease-in-out;
 -ms-transition:	all 0.5s ease-in-out;
 -o-transition:	all 0.5s ease-in-out;
 transition:	all 0.5s ease-in-out;
}

.page-breadcrumb	{
}

footer	{
 margin-bottom:	-2rem;
}

/*	@end	*/

/*	@group	Typography	*/

body	{
 font-family:	 var(--font-base);
 font-size:	var(--font-size-base);
 line-height:var(--line-height-base);
 color:	var(--global-font-color);
 font-smoothing:	antialiased;
 font-weight:	var(--font-weight-base);
}

.hyphens {
 -webkit-hyphens:	auto;
 -webkit-hyphenate-limit-before:	3;
 -webkit-hyphenate-limit-after:	3;
 -webkit-hyphenate-limit-chars:	6 3 3;
 -webkit-hyphenate-limit-lines:	2;
 -webkit-hyphenate-limit-last:	always;
 -webkit-hyphenate-limit-zone:	8%;
 -moz-hyphens:	auto;
 -moz-hyphenate-limit-chars:	6 3 3;
 -moz-hyphenate-limit-lines:	2;
 -moz-hyphenate-limit-last:	always;
 -moz-hyphenate-limit-zone:	8%;
 -ms-hyphens:	auto;
 -ms-hyphenate-limit-chars:	6 3 3;
 -ms-hyphenate-limit-lines:	2;
 -ms-hyphenate-limit-last:	always;
 -ms-hyphenate-limit-zone:	8%;
 hyphens:	auto;
 hyphenate-limit-chars:	6 3 3;
 hyphenate-limit-lines:	2;
 hyphenate-limit-last:	always;
 hyphenate-limit-zone:	8%;
}

.footer	{
 font-size:	1.15rem;
 line-height:	1.25em;
 color:	var(--global-font-color);
}

h1,	h2,	h3,	h4,	h5,	h6,	h7,	.h1,	.h2,	.h3,	.h4,	.h5,	.h6,	.h7	{
 color:	var(--brand-primary);
 line-height:	1.15em;
 margin-bottom:	0.85rem;
 font-weight:	600;
}

/* Responsive Headings mit clamp() */
h1, .h1 {
  font-size: clamp(1.75rem, 4vw + 1rem, 3.5rem);
}

h2, .h2 {
  font-size: clamp(1.35rem, 1.5vw + 0.75rem, 2.75rem);
}

h3, .h3 {
  font-size: clamp(1.25rem, 1.5vw + 0.5rem, 2.25rem);
}

h4, .h4 {
  font-size: clamp(1.1rem, 1.5vw + 0.4rem, 1.75rem);
}

h5, .h5 {
  font-size: clamp(1rem, 1.5vw + 0.3rem, 1.375rem);
}

p	{
 margin-bottom:	0.55rem;
}

.footer p,	.footer ul	{
 color:	var(--footer-font-color);
}

ul	{
 padding-left:	0px;
 margin-bottom:	1.5rem;
 margin-top:	1rem;
}

ul ~ h2,	ul ~ .h2,	ul ~ h3,	ul ~ .h3	{
 padding-bottom:	0px !important;
 margin-bottom:	0px !important;
}

ul li {
 list-style: none;
 padding-left: 1.25rem;
 position: relative;
}

ul li::before {
 font-family: bootstrap-icons !important;
 font-style: normal;
 font-weight: 400;
 text-align: center;
 -moz-osx-font-smoothing: grayscale;
 content: "\F285";
 position: absolute;
 left: -0.25rem;
 color: var(--primary-100);
}

.footer ul li::before	{
 color:	#ffffff;
}

.portfolio	{
 display:	flex;
 flex-direction:	row;
 flex-wrap:	wrap;
 justify-content:	flex-start;
 align-items:	stretch;
 align-content:	normal;
 margin-left:	-0.25rem;
 margin-right:	-0.25rem;
 width:	100%;
 text-align:	center;
 margin-top:	1rem;
 margin-bottom:	1rem;
}

.portfolio li	{
 display:	grid;
 flex-grow:	0;
 flex-shrink:	1;
 flex-basis:	auto;
 align-items:	center;
 width:	calc(25% - 0.5rem);
 padding:	2rem;
 background-color:	white;
 border-radius:	0.25rem;
 margin-left:	0.25rem;
 margin-right:	0.25rem;
 margin-bottom:	0.5rem;
 text-align:	center;
 color:	var(--brand-secondary);
 font-weight:	600;
}

.portfolio li:before	{
 content:	"";
}

a	{
 color:	var(--primary-80);
 text-decoration:	none !important;
}

a:hover,	.nav-item.active a.nav-link	{
 color:	var(--primary-100);
 text-decoration:	none;
}

footer a	{
 color:	var(--footer-link-color) !important;
}

footer a:hover {
 color:	var(--footer-link-hover-color);
}

.readmore {

}

.readmore:before	{
 font-family:	bootstrap-icons;
 font-style:	normal;
 font-weight:	400;
 text-align:	center;
 -moz-osx-font-smoothing:	grayscale;
 content:	"\F285";
}

.anlauftext	{
 color:	var(--primary-100);
 font-weight:	500;
}

strong,	bold	, .fw-bold{
 font-weight:	500 !important;
}

small, .small	{
 font-size:	0.775rem;
}

.text-muted	{
 opacity:	0.6;
}

blockquote p	{
 position:	relative;
}

blockquote p::before	{
 content:	"„";
 color:	var(--primary-50);
 position:	absolute;
 top:	-1.6rem;
 left:	-0.55rem;
 font-size:	4rem;
}

blockquote p::after	{
 content:	"“";
 color:	var(--primary-50);
 position:	absolute;
 bottom:	-0.95rem;
 font-size:	4rem;
 margin-left:	0.25rem;
}

/*	@end	*/

/*	@group	Navigation	*/

.breadcrumb	{
 padding:	0.75rem	0;
 background-color:	transparent;
 border-radius:	0rem !important;
}

.breadcrumb a	{
 color:	var(--primary-60);
}

.breadcrumb-item + .breadcrumb-item::before	{
 display:	inline-block;
 padding-right:	0.5rem;
 color:white;
 content:	"/";
}

.subnavi ul	{

}

.subnavi ul li	{

}

.subnavi ul li::before {
 font-family: bootstrap-icons !important;
 font-style: normal;
 font-weight: 400;
 text-align: center;
 -moz-osx-font-smoothing: grayscale;
 content: "\F27B";
 position: absolute;
 top: 0rem;
 left: -0.75rem;
 color: var(--primary-100);
 font-size: 1.5rem;
}

.subnavi ul li a,	.subnavi ul li.active a	{
 color:	var(--primary-80);
}

.subnavi ul li a:hover	{
 color:	var(--primary-100);
}

/*.subnavi ul li.active a	{
font-weight:	700;
}*/

ul.mainnavi	{
 border-top:	1px	solid	 var(--secondary-40);
}

ul.mainnavi li	{
 border-bottom:	1px	solid	 var(--secondary-40);
 position:	relative;
 font-weight:	400;
}

ul.mainnavi li:before	{
 content:	"";
}

ul.mainnavi li ul li	{
 border-bottom:	none;
 font-weight:	300;
}

ul.mainnavi li a	{
 color:	var(--primary-80);
}

ul.mainnavi li a:hover,	ul.mainnavi li.active a	{
 color:	var(--primary-100);
}

ul.mainnavi a.collapsible.collapsed:after	{
 position:	absolute;
 top:	0.5rem;
 right:	0px;
 content:	"\f27b";
 font-family:	bootstrap-icons;
 font-style:	normal;
 font-weight:	400;
 text-decoration:	inherit;
 text-align:	center;
 transform:	rotate(90deg);
}

ul.mainnavi a.collapsible:after	{
 position:	absolute;
 top:	1rem;
 right:	0px;
 content:	"\f27b";
 font-family:	bootstrap-icons;
 font-style:	normal;
 font-weight:	400;
 text-decoration:	inherit;
 text-align:	center;
 transform:	rotate(-90deg);
}

.trigger {
 color:	var(--primary-60);
}

.trigger:hover {
 color:	var(--primary-100);
}

/*	@end	*/

/*	@group	Slider	*/

.slider	{
 position:	relative;
   margin-top: var(--sticky-offset);

}

#slider {
  height: calc(100vh - var(--sticky-offset));
  margin-top: var(--sticky-offset);
}

.sliderhead {
  font-size: clamp(2rem, -0.4531rem + 5.4321vw, 6.5rem);
  bottom: 30%;
  font-weight: 700;
  left: 6vw;
  color: var(--primary-100);
  background-color: transparent;
  padding: 0px;
}

.slidersubline {
  font-size: clamp(1.3rem, 0.4056rem + 2.2222vw, 3.25rem);
  font-weight: 500;
  left: 6vw;
  bottom: calc(20% - clamp(1.3rem, 0.4056rem + 2.2222vw, 3.25rem) + 2rem);
  color: var(--primary-100);
  background-color: transparent;
  padding: 0px;
}

.headerimage iframe	 {
 width:  100%;
 height: 100%;
}

.slider .carousel-item, .headerimage {
 background-position-y: center !important;
 background-size: cover !important;
 background-repeat: no-repeat !important;
}

.slider.container-fluid	{
 padding-right:	0;
 padding-left:	0;
}

.slider .carousel-inner, .slider .carousel-item, .slider .headerimage {
 height: 33vh;
}

.carousel-indicators button	{
 background-color:	var(--primary-20) !important;
}

.carousel-indicators button.active	{
 background-color:	var(--primary-50) !important;
}

/*	@end	*/

/*	@group	Tables	*/

table	 {
 border-color:	var(--secondary-20) !important;
}

.collapse table {
 border-color:	white !important;
}

caption	{
 font-weight:	600;
}

table.table-dark td	{
 border-top:	1px solid var(--secondary-40) !important;
 padding-left:	0px !important;
}

table.table-dark tr	{
 border-color:	var(--secondary-40) !important;
}

table.table-dark th,	table.table-dark td,	table.table-dark thead th	{
 border-top:	1px solid 	var(--secondary-40) !important;
 background-color:	transparent !important;
}

.table-dark	{
 background-color:	transparent !important;
}

table.table-dark tr:last-child td	{
 border-bottom:	1px solid 	var(--secondary-40) !important;
}

/*	@end	*/

/*	@group	Tab Navigation	*/

.nav.nav-tabs	{
 border-bottom:	2px solid var(--primary-30) !important;
 font-size:	1.15rem;
}

.nav-tabs .nav-item a	{
 color:	var(--primary-70) !important;
}

.nav-tabs .nav-item:hover a,	.nav-tabs .nav-link.active	{
 color:	var(--primary-100) !important;
}

.nav-tabs .nav-item	{
 margin-bottom:	-2px;
 position:	relative;
 display:	flex;
 cursor:	pointer;
}

.nav-tabs .nav-link	{
 border-top-style:	none;
 border-top-width:	0;
 border-right-width:	0;
 border-right-style:	none;
 border-bottom:	2px solid var(--primary-30);
 border-left-style:	none;
 border-left-width:	0;
 padding:	0.5rem;
 font-weight:	400;
}

.nav-tabs .nav-link:hover,	.nav-tabs .nav-link.active	{
 border-bottom:	2px solid var(--brand-secondary) !important;
 background-color:	transparent;
}

.nav-tabs .nav-link.active	{

}

.nav-tabs .nav-link.active:hover	{
 border-bottom:	2px solid var(--primary-100) !important;
}

.nav-tabs .nav-link.help	{
 border-bottom:	2px solid var(--brand-secondary) !important;
}

.nav-tabs .nav-link.help.collapsed	{
 border-bottom:	2px solid var(--primary-30) !important;
}

.tab-pane .nav-tabs	{
 font-size:	1rem;
}

.nomobile	{
 visibility:	hidden;
 display:	none;
}

.mobile	{
 visibility:	visible;
 display:	inline;
}

/*	@end	*/

/*	@group	Tab Content	*/

.tab-pane	{
 background-color:	var(--primary-10);
 margin-right:	0em;
 margin-bottom:	0;
 margin-left:	0em;
 border-radius:	0.28571429rem;
}

.tab-pane .tab-pane	{
 padding:	0;
 border-radius:	0px;
}

/*	@end	*/

/*	@group	Infoboxen	*/

.infobox-content	{
 border-radius:	0.5rem;
 background-color:	white;
}

.infobox .infobox-content	{
 padding:	1rem;
}

/*	@end	*/

/*	@group	Buttons	*/

button,	.btn,	.btn-secondary	{
 border:	0px;
}

.btn-primary	{
 background-color:	var(--primary-60);
}

.btn-primary:hover,	.btn-primary:focus,	.btn-primary:not(:disabled):not(.disabled):active,	.btn-primary:not(:disabled):not(.disabled).active,	.show > .btn-primary.dropdown-toggle, .mixitup-control-active	{
 background-color:	var(--brand-primary);
 color: white !important;
}

.btn-secondary	{
 background-color:	var(--secondary-60);
}

.btn-secondary:hover,	.btn-secondary:focus,	.btn-secondary:not(:disabled):not(.disabled):active,	.btn-secondary:not(:disabled):not(.disabled).active,	.show > .btn-secondary.dropdown-toggle	{
 background-color:	var(--brand-secondary);
 color: white !important;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus,	.btn-secondary:not(:disabled):not(.disabled).active:focus,	.show > .btn-secondary.dropdown-toggle:focus	{
 box-shadow:	none;
}

.btn-primary:not(:disabled):not(.disabled):active,	.btn-primary:not(:disabled):not(.disabled).active,	.show > .btn-primary.dropdown-toggle	{
 background-color:	var(--brand-80);
}

.btn-xs,	.btn-group-xs > .btn	{
 padding:	0.25rem;
 font-size:	0.75rem;
 line-height:	0.75rem;
 border-radius:	0.15rem;
}

.btn-circle {
 width: 45px;
 height: 45px;
 line-height: 45px;
 text-align: center;
 padding: 0;
 border-radius: 50% !important;
}

.btn-circle i {
 position: relative;
 top: -1px;
}

.btn-circle-lg {
 width: 35px;
 height: 35px;
 line-height: 35px;
 font-size: 1.25rem;
}

.labels .btn	{
 margin-bottom:	0.25em;
}

.btn.icon	{
 padding-right:	0.5rem;
 padding-left:	0.5rem;
}

.btn-sm.icon i,	.btn-danger.icon i	{
 margin-right:	0px;
}

button.icon.dots	{
 padding-left:	0px;
 padding-right:	0px;
}

.dots svg	{
 margin-right:	0px !important;
}

.btn.collapsed svg	{
 rotate:	180deg;
}

.btn.toggleclass.active	{
 background-color:	var(--primary-60) !important;
}

/*	@end	*/

/*	@group	Dropdown	*/

.dropdown-toggle.btn-circle::after	{
 display:	none;
}

.dropdown-toggle i.icon	{
 padding:	0;
 margin:	0;
}

.dropdown-menu	{
 box-shadow:	0	8px	10px	rgba(0,	0,	0,	0.2);
}

.dropdown-menu-center	{
 right:	auto;
 left:	50%;
 -webkit-transform:	translate(-50%, 0);
 -o-transform:	translate(-50%, 0);
 transform:	translate(-50%, 0);
}

.dropdown-item	{
 padding-left:	1rem;
 padding-right:	1rem;
}

.dropdown-submenu	{
 position:	relative;
}

.dropdown-submenu a::after	{
 transform:	rotate(-90deg);
 position:	absolute;
 right:	6px;
 top:	.8em;
}

.dropdown-submenu .dropdown-menu	{
 top:	0;
 left:	100%;
 margin-left:	.1rem;
 margin-right:	.1rem;
}

/*@media (min-width: 992px) {
.animate {
animation-duration: 0.3s;
-webkit-animation-duration: 0.3s;
animation-fill-mode: both;
-webkit-animation-fill-mode: both;
}
}

@keyframes slideIn {
0% {
transform: translateY(1rem);
opacity: 0;
}
100% {
transform:translateY(0.5rem);
opacity: 1;
}
0% {
transform: translateY(1rem);
opacity: 0;
}
}

@-webkit-keyframes slideIn {
0% {
-webkit-transform: transform;
-webkit-opacity: 0;
}
100% {
-webkit-transform: translateY(0.5);
-webkit-opacity: 1;
}
0% {
-webkit-transform: translateY(1rem);
-webkit-opacity: 0;
}
}

.slideIn {
-webkit-animation-name: slideIn;
animation-name: slideIn;
}*/

/*	@end	*/

/*	@group	Accordion	*/

h2.collapsible.collapsed 	{
 cursor:	pointer;
 position:	relative;
 background-color:	var(--secondary-20)	;
 -webkit-transition:	all 0.2s ease-in-out;
 -moz-transition:	all 0.2s ease-in-out;
 -ms-transition:	all 0.2s ease-in-out;
 -o-transition:	all 0.2s ease-in-out;
 transition:	all 0.2s ease-in-out;
}

h2.collapsible, h2.collapsible.collapsed:hover 	{
 background-color:	var(--primary-20)	;
}

h2.collapsible:last-of-type.collapsed	 {
}

h2.accordion-header.collapsed::after {
 position: absolute;
 top: calc(50% - 1rem);
 right: 1rem;
 content: "\F286";
 font-family: bootstrap-icons;
 font-style: normal;
 font-weight: 400;
 text-decoration: inherit;
 text-align: center;
 transform: rotate(180deg);
}

h2.accordion-header::after	{
 position:	absolute;
 top: calc(50% - 1rem);
 right: 1rem;
 content:	"\F286";
 font-family:	bootstrap-icons;
 font-style:	normal;
 font-weight:	400;
 text-decoration:	inherit;
 text-align:	center;
 -webkit-transition:	all 0.2s ease-in-out;
 -moz-transition:	all 0.2s ease-in-out;
 -ms-transition:	all 0.2s ease-in-out;
 -o-transition:	all 0.2s ease-in-out;
 transition:	all 0.2s ease-in-out;
}

.accordion .textblock	{
 background-color:	rgba(255,	255,	255,	0.55);
 border-bottom-left-radius:	0.25rem;
 border-bottom-right-radius:	0.25rem;
}

ul.acc	{
 display:	table;
}

ul.acc li	{
 padding:	0.25rem	1rem	0.25rem	1.5rem;
 border-radius:	0.25rem;
 background-color:	var(--secondary-10);
 margin-bottom:	1px;
}

ul.acc li div	{
 padding-bottom:	0.5rem;
}

ul.acc li::before	{
 top:	0.25rem;
 left:	0.5rem;
}

/*	@end	*/

/*	@group	Icons	*/

i.icon.circular.invers	{
 border-style:	none;
 background-color:	var(--primary-100);
 color:	white;
 box-shadow:	none;
}

/*	@end	*/

/*	@group	Tooltips	*/

.custom-tooltip	{
 --bs-tooltip-bg:	var(--primary-100);
}

/*	@end	*/

/*	@group	Cards	*/

.card	{
 border:	none !important;
}

.card-header	{
 background-color:	var(--brand-secondary);
 border-bottom:	none;
}

.card-footer	{
 background-color:	var(--secondary-10);
 border-top:	none;
}

.card.team .card-body	{
 padding-top:	8rem;
}

.card.team .portrait	{
 border-radius:	50%;
 overflow:	hidden;
 width:	10rem;
 height:	10rem;
 position:	absolute;
 left:	calc(50% - 5rem);
 top:	-2.25rem;
 border:	8px solid white;
 background-color:	var(--primary-50);
}

.card.team .portrait img	{
 width:	100%;
}

/*	@end	*/

/*	@group	Images 	*/

#lightgallery a	{
 position:	relative;
 cursor:	pointer;
}

#lightgallery a::before	{
 font-family:	'Icons';
 content:	"\f00e";
 opacity:	0;
 font-style:	normal;
 font-weight:	normal;
 text-decoration:	inherit;
 text-align:	center;
 speak:	none;
 font-smoothing:	antialiased;
 -moz-osx-font-smoothing:	grayscale;
 -webkit-font-smoothing:	antialiased;
 -webkit-backface-visibility:	hidden;
 backface-visibility:	hidden;
 position:	absolute;
 font-size:	2rem;
 color:	white;
 top:	calc(50% - 1rem);
 left:	calc(50% - 1rem);
 -webkit-transition:	all 0.5s ease-in-out;
 -moz-transition:	all 0.5s ease-in-out;
 -ms-transition:	all 0.5s ease-in-out;
 -o-transition:	all 0.5s ease-in-out;
 transition:	all 0.5s ease-in-out;
 z-index:	99;
}

#lightgallery a:hover:before	{
 opacity:	1;
}

#lightgallery a img	{
 opacity:	1;
 -webkit-transition:	all 0.5s ease-in-out;
 -moz-transition:	all 0.5s ease-in-out;
 -ms-transition:	all 0.5s ease-in-out;
 -o-transition:	all 0.5s ease-in-out;
 transition:	all 0.5s ease-in-out;
 border-radius:	0.5rem;
 overflow:	hidden;
}

#lightgallery a:hover img	{
 opacity:	0.6;
}

.zoom	{
 opacity:	0.6;
 -webkit-transition:	all 0.5s ease-in-out;
 -moz-transition:	all 0.5s ease-in-out;
 -ms-transition:	all 0.5s ease-in-out;
 -o-transition:	all 0.5s ease-in-out;
 transition:	all 0.5s ease-in-out;
 cursor:	pointer;
}

.zoom:hover	{
 opacity:	1;
 transform-origin:	top right;
 transform:	scale(1.2);
}

/*	@end	*/

/*	@group	Forms	*/

.form-control, .form-select {
 background-color:	var(--secondary-20);
}

.btn-primary.disabled,	.btn-primary:disabled	{
 background-color:	var(--secondary-40);
 border-color:	var(--secondary-40);
}

.custom-control-input:checked ~ .custom-control-label::before	{
 border-color:	var(--primary-100);
 background-color:	var(--primary-100);
}

.form-check-input:checked	{
 background-color:	var(--primary-100);
 border-color:	var(--primary-100);
}

.form-label, .form-check-label {
  font-size: clamp(0.875rem, 1vw + 0.25rem, 1.25rem);
}

/*	@end	*/

/*	@group	additional helper classes 	*/

.pt-8,	.py-8	{
 padding-top:	3rem !important;
}

.pb-8,	.pb-8	{
 padding-bottom:	3rem !important;
}

.mce-content-body {
 padding: 2rem;
}

/*	@end	*/

/*	@group	Contact Widget	*/

.contact-widget	{
 z-index:	999;
 right:	4vw;
 bottom:	4vw;
 width:	4rem;
 height:	4rem;
 cursor:	pointer;
}

.contact-widget .btn	{
 box-shadow:	1px	1px	8px	rgba(0,	0,	0,	0.45);
 width:	4rem;
 height:	4rem;
}

.contact-widget i	{
 font-size:	2rem;
}

.contact-widget .chatoptions	{
 -webkit-transition:	all 0.5s ease-in-out;
 -moz-transition:	all 0.5s ease-in-out;
 -ms-transition:	all 0.5s ease-in-out;
 -o-transition:	all 0.5s ease-in-out;
 transition:	all 0.5s ease-in-out;
 bottom:	4.25rem;
}

.contact-widget [class^="bi-"]::before,	.contact-widget [class*=" bi-"]::before	{
 vertical-align:	-.2em;
}

/*	@end	*/

/* @group Card Slider */

.card-slider__viewport {
  overflow: hidden;
}

.card-slider__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: .25rem;
  align-items: stretch; /* gleiche Höhe */
  -webkit-overflow-scrolling: touch;
}

.card-slider__track::-webkit-scrollbar {
  display: none;
}

.card-slider__track {
  scrollbar-width: none;
}

.card-slider__item {
  scroll-snap-align: start;
  flex: 0 0 100%; /* mobile: 1 sichtbar */
  display: flex;
}

@media (min-width: 768px) {
  .card-slider__item { flex-basis: calc(50% - .5rem); } /* md: 2 */
}

@media (min-width: 992px) {
  .card-slider__item { flex-basis: calc(33.333% - .666rem); } /* lg: 3 */
}

/* optional xl: 4 */
/* @media (min-width: 1200px){
  .card-slider__item{ flex-basis: calc(25% - .75rem); }
} */

/* Controls */
.card-slider__control {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  z-index: 2;
}

.card-slider__control--prev { left: .25rem; }
.card-slider__control--next { right: .25rem; }

.card-slider__control > span {
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

/* Indicators */
.card-slider__indicators {
  display: flex;
  justify-content: center;
  gap: .5rem;
  margin-top: .75rem;
  padding-bottom: .5rem;
}

.card-slider__dot {
  width: .6rem;
  height: .6rem;
  border-radius: 999px;
  border: 0;
  padding: 0;
  background: rgba(0, 0, 0, .25);
  opacity: .35;
  transition: opacity .2s ease, transform .2s ease, background-color .2s ease;
}

/* optional: sichtbare Dots NICHT dunkler, nur falls du sie überhaupt markieren willst */
.card-slider__dot.is-visible {
  opacity: .35;
}

/* nur EIN Dot ist "current" */
.card-slider__dot.is-current,
.card-slider__dot[aria-current="location"] {
  opacity: 1;
  background: rgba(0, 0, 0, .65);
  transform: scale(1.15);
}


/* Basis – keine klassische Border */
.card-slider__item .card, .listview-item .card {
  position: relative;
  border: 0;
  overflow: hidden;
  transition: transform .35s cubic-bezier(.4,0,.2,1);
}

/* Subtile innere Struktur */
.card-slider__item .card::after, .listview-item .card::after {
  content:"";
  position:absolute;
  inset:0;
  box-shadow: inset 0 0 0 0px rgba(0,0,0,.06);
  pointer-events:none;
  transition: box-shadow .35s cubic-bezier(.4,0,.2,1);
}

/* Akzentlinie oben */
/*.card-slider__item .card::before, .listview-item .card::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background: var(--primary-100);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}*/

/* Hover / Focus */
.card-slider__item:hover .card::before,
.card-slider__item:focus-within .card::before, .listview-item:hover .card::before {
  transform: scaleX(1);
}

.card-slider__item:hover .card::after,
.card-slider__item:focus-within .card::after, .listview-item:hover .card::after {
  box-shadow:
    inset 0 0 0 0px rgba(0,0,0,.10),
    inset 0 -80px 120px rgba(0,0,0,.03);
}

/* Titel subtil akzentuieren */
.card-slider__item .card-title a, .listview-item .card-title a {
  transition: color .25s ease;
}

.card-slider__item:hover .card-title a,
.card-slider__item:focus-within .card-title a, .listview-item:hover .card-title a {
  color: var(--primary-100);
}


/* @end */

/*	@end	*/

@media (min-width: 576px)	{

}

@media (min-width: 768px)	{
 /*	@group	Theme Structure	*/

 body.scrolling .logo	{
  width:	60%;
 }

 .custom-header-img	{
  margin-right:	-1.5rem;
  margin-left:	-1.5rem;
  margin-top:	-1.5rem;
 }

 /*	@end	*/

 /*	@group	Slider	*/

 .slider	{
  position:	relative;
 }

.sliderhead {
  font-size: clamp(1rem, -0.4531rem + 5.4321vw, 6.5rem);
  bottom: 40%;
  font-weight: 700;
  left: 6vw;
  color: var(--primary-100);
  background-color: transparent;
  padding: 0px;
}

.slidersubline {
  font-size: clamp(1rem, 0.4056rem + 2.2222vw, 3.25rem);
  font-weight: 500;
  left: 10vw;
  bottom: calc(40% - clamp(1rem, -0.4531rem + 5.4321vw, 6.5rem) + 1rem);
  color: var(--primary-100);
  background-color: transparent;
  padding: 0px;
}

 .slider.container-fluid	{
  padding-right:	0;
  padding-left:	0;
 }

 .slider .carousel-inner,	.slider .carousel-item,	.slider .headerimage	{
  height:	50vh;
 }

 .slider .carousel-item,	.headerimage	{
  background-position-x:	center !important;
 }

 /*	@end	*/

 /*	@group	Typography	*/

 body	{

 }


 ul	{
  padding-left:	0rem;
 }

 .anlauftext	{
 }

 /*	@end	*/

 /*	@group	Navigation	*/

 .navbar-nav .nav-item .nav-link	{
  padding-left:	0rem;
  padding-right:	0rem;
  padding-top:	0px;
  padding-bottom:	0.5rem !important;
  line-height:	1rem;
  margin-bottom:	-0.5rem;
 }

 .navbar-nav .nav-item .nav-link:before	{
  display:	inline-block;
  /*		padding-right: 1rem;*/
  color:	var(--secondary-20);
  /*		content: "/";*/
 }

 .navbar-nav .nav-item:first-child .nav-link:before	{
  padding-right:	0px;
  content:	"";
 }

 .navbar-nav .nav-item.dropdown .dropdown-menu	{
  background-color:	var(--primary-100) !important;
  padding:	0	0px	0px	!important;
  margin:	0px !important;
  top:	calc(100% + 0.5rem);
  left:	1rem;
 }

 .navbar-nav .nav-item:first-child.dropdown .dropdown-menu	{
  left:	0rem;
 }

 /*	.navbar-nav .nav-item:last-child.dropdown .dropdown-menu {
 right:	0rem;
 left:	inherit;
}*/

 .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item	{
  padding:	0.25rem 1rem 0.25px !important;
  color:	hsla(0,0%,100%,.8) !important;
  background:	transparent;
 }

 .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item:first-child	{
  padding:	1rem	1rem	0rem	!important;
 }

 .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item:last-child	{
  padding-right:	1rem !important;
  padding-bottom:	1rem !important;
  padding-left:	1rem !important;
 }

 .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item:hover	{
  color:	hsla(0,0%,100%,1.0) !important;
  background:	transparent;
 }

 /*	@end	*/

 /*	@group	Tab Navigation	*/

 .nav-tabs .nav-link	{
  padding:	0.5rem 0.75rem;
 }

 /*	@end	*/

 /*	@group	Badges	*/

 .badge-circle	{
  font-size:	0.7rem;
  padding:	0.4em;
  min-width:	1.8em;
  height:	1.8em;
  text-indent:	0;
  margin-left:	0rem;
  margin-top:	-0.45rem;
 }

 /*	@end	*/

 /*	@group	Cards	*/

 .row.card-footer	{
  margin-left:	-1.5rem;
  margin-right:	-1.5rem;
  margin-bottom:	-1.5rem;
 }

 /*	@end	*/

 /*	@group	Contact Widget	*/

 .contact-widget	{
  right:	2vw;
  bottom:	2vw;
 }

 /*	@end	*/
}

@media (min-width: 992px)	{
 /*	@group	Typography	*/

 .headline h1	{
  font-size:	48px !important;
  line-height:	48px;
 }

 .headline	{
  color:	white;
  line-height:	72px;
  font-size:	72px !important;
  bottom:	10vh;
  left:	5vw;
 }

 .subline	{
  font-size:	36px !important;
  line-height:	36px;
  bottom:	calc(25vh - 3rem - 40px);
  left:	25vw;
 }

 /*	@end	*/

 /*	@group	Slider 	*/

 /*	@end	*/

 /*	@group	Buttons	*/

 .btn-circle {
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  padding: 0;
  border-radius: 50% !important;
 }

 .btn-circle i {
  position: relative;
  top: -1px;
 }

 .btn-circle-sm {
  width: 35px;
  height: 35px;
  line-height: 35px;
  font-size: 0.9rem;
 }

 .btn-circle-lg {
  width: 55px;
  height: 55px;
  line-height: 55px;
  font-size: 2rem;
 }

@media (min-width: 992px) {
  .btn-circle-xl {
    width: 70px;
    height: 70px;
    line-height: 70px;
    font-size: 2.5rem;
  }
}

 /*	@end	*/
}

@media (min-width: 1200px)	{

}

@media (min-width: 1600px)	{

 /*	@group	Slider 	*/ 

 /*	@end	*/

}

@media (min-width: 2024px)	{

}


/* --- Search ----------------------------------------------------------- */
/* Container */
#search{
  display: flex;
  align-items: center;
  width: 45px;
  height: 45px;
  border: 1px solid #dee2e6;
  border-radius: 999px;
  overflow: hidden;
  transition: width .35s cubic-bezier(.4,0,.2,1);
  cursor: text;
 background-color:	var(--secondary-40);
}

/* Icon: fester Slot, zentriert */
#search i{
  flex: 0 0 45px;          /* fix: verhindert Springen */
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  font-size: 1rem;
  opacity: .75;
  pointer-events: none;
  transition: opacity .2s ease;
  color: var(--primary-60);
}

/* Input: initial unsichtbar */
#search .form-control{
  flex: 1 1 auto;          /* nimmt Restbreite, wenn offen */
  width: 0;                /* zu, solange Container klein ist */
  min-width: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  transform: translateX(-8px);
  pointer-events: none;
  transition:
  opacity .25s ease,
    transform .35s cubic-bezier(.4,0,.2,1),
    padding .35s cubic-bezier(.4,0,.2,1);
}

/* Hover / Focus: Container wird breiter */
#search:hover,
#search:focus-within{
  width: 120px; /* offene Breite */
}

@media (min-width: 992px) {
#search:hover,
#search:focus-within{
  width: 250px; /* offene Breite */
}

}

/* Input sichtbar + Padding nur im Input (kein Layout-Shift am Icon) */
#search:hover .form-control,
#search:focus-within .form-control {
  width: auto;
  padding: 0 .75rem 0 .75rem;  /* links etwas kleiner wegen Icon */
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
  background-color: transparent !important;
}

/* Icon aktiver */
#search:hover i,
#search:focus-within i{
  opacity: 1;
}

/* Bootstrap Focus deaktivieren */
#search .form-control:focus{
  box-shadow: none !important;
  border-color: transparent !important;
  outline: none !important;
}

#content mark.we-search-hit{
  padding: .05em .2em;
  border-radius: .25rem;
}