/*!
Theme Name:    colistic childtheme
Author:        colistic
Author URI:    https://colistic.de
Description:   colistic Theme
Version:       1.0
Template:      bb-theme
*/

/* ############################################# Scrollbar ############################################# */

::selection { background: var(--color-primary); color: var(--color-white); } 
::-moz-selection { background: var(--color-primary); color: var(--color-white); } 
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--color-secondary));}
::-webkit-scrollbar-thumb { background: var(--color-primary); border-radius: 5px;}
::-webkit-scrollbar-thumb:hover { background: var(--color-primary-hover); }

/*############################################# General Settings ############################################# */

/* montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/montserrat-v29-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/montserrat-v29-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/montserrat-v29-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/montserrat-v29-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/montserrat-v29-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/montserrat-v29-latin-900.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

:root {
  --grid-gap: 2rem;

  /* Schatten */
  --shadow-none: none;
  --shadow-sm: 0 0.5rem 1rem rgba(52, 58, 64, 0.25);
  --shadow: 0 1rem 2rem rgba(52, 58, 64, 0.5);
  --shadow-lg: 0 2rem 4rem rgba(52, 58, 64, 1);

  /* Ecken */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 1rem;

  /* Transitionen */
  --transition-fast: 0.15s ease-in-out;
  --transition-normal: 0.3s ease-in-out;
  --transition-slow: 0.5s ease-in-out;
	
  /* Abstände */
  --spacing-0: 0;
  --spacing-1: 0.5rem;
  --spacing-2: 1rem;
  --spacing-3: 1.5rem;
  --spacing-4: 2rem;
  --spacing-5: 3rem;
}
	

html,
body{
	font-family: 'Montserrat';
	color:var(--color-dark);
	font-size:16px;
	line-height: 1.4rem;
}

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

h1, h2, h3, h4, h5, h6{
	font-family: inherit;
	color:var(--color-primary);
	text-transform: uppercase;
	letter-spacing: 0em;
	font-weight: 900;
	margin-bottom:0;
}

h1 {
    font-size: clamp(1.75rem, 5vw, 4rem);
    line-height: 1.1;
}

h2 {
    font-size: clamp(1.5rem, 3.5vw, 2.5rem);
    line-height: 1.2;
}

h3 {
    font-size: clamp(1.25rem, 3vw, 2rem);
    line-height: 1.3;
}

h4 {
    font-size: clamp(1.125rem, 2.5vw, 1.75rem);
    line-height: 1.4;
}

h5 {
    font-size: clamp(1rem, 2vw, 1.5rem);
    line-height: 1.5;
}

h6 {
    font-size: 1rem;
    line-height: 1.6;
}

@media only screen and (max-width: 800px) {
	html,
	body{
		font-size:14px;
	}
}


p {
  margin-bottom: var(--spacing-2);
}

a {
  color: var(--color-primary);
  text-decoration: underline;
  transition: color var(--transition-fast);
}

a:hover,
a:focus {
  color: var(--color-primary-hover);
}


.fl-page-content .fl-module-photo img.fl-photo-img{
	border-radius: 1rem;
}

/* Grid */

.fl-row-fixed-width,
.fl-row-full-width .fl-row-fixed-width,
.fl-page-header-container,
.fl-page-bar-container,
.fl-page-footer-container{
    margin: 0 auto;
	width: 1400px;
	max-width: 100% !important;
    padding-left: calc(var(--grid-gap) / 2)!important;
	padding-right: calc(var(--grid-gap) / 2) !important;
	padding-top: calc(var(--grid-gap) / 2);
	padding-bottom: calc(var(--grid-gap) / 2);
	flex:unset;
}

.fl-row-full-width .fl-row-full-width{
    padding-left: calc(var(--grid-gap) / 2) !important;
	padding-right: calc(var(--grid-gap) / 2) !important;
	padding-top: calc(var(--grid-gap) / 2);
	padding-bottom: calc(var(--grid-gap) / 2);
}

.fl-col{
	padding:calc(var(--grid-gap) / 2);
}

.fl-col:first-child{
	padding-left:0;
}

.fl-col:last-child{
	padding-right:0;
}

@media only screen and (max-width: 800px) {
	.fl-col{
		padding:calc(var(--grid-gutter-width) / 2) 0;
	}
}

/* NAV */

.fl-page-nav-right .fl-page-header-logo{
    padding-left: 0 !important;
	padding-right: 0 !important;
}

.fl-page-nav-right .fl-page-header-container{
	padding-bottom: 1rem;
}

.fl-page-nav-toggle-icon.fl-page-nav-toggle-visible-medium-mobile.fl-page-nav-right .fl-page-header-row .fl-page-header-logo{
	padding-bottom:0;
}

.fl-page-nav-toggle-icon.fl-page-nav-toggle-visible-medium-mobile .fl-page-nav .navbar-toggle {
	font-size: 1.5rem;
	padding: 1rem;
	right: 0;
	top: 0;
	color: var(--color-primary);
}

/* Buttons */
/* === BUTTON STYLING OVERRIDE === */
.fl-builder-content a.fl-button,
.fl-builder-content a.fl-button:visited,
.wpbf-navigation .wpbf-menu .wpbf-cta-menu-item a,
.wpbf-button,
input[type=submit],
.pp-infobox .pp-more-link,
.job-submit,
.jp-apply-button,
.apply-btn {
  background-color: var(--color-primary);
  color: var(--color-white);
  border: none;
  padding: var(--spacing-2) var(--spacing-3);
  font-size: var(--font-size-body);
  font-weight: 900;
  text-align: center;
  text-decoration: none;
  transition: all var(--transition-fast);
  position: relative;
  text-transform: uppercase;
	border-radius: 0.5rem;
}

.fl-builder-content a.fl-button *,
.fl-builder-content a.fl-button:visited * {
  color: inherit !important;
}

.fl-builder-content a.fl-button:hover,
.wpbf-button:hover,
input[type=submit]:hover,
.pp-infobox .pp-more-link:hover,
.job-submit:hover,
.jp-apply-button:hover,
.apply-btn:hover {
  background-color: var(--color-primary-hover) !important;
  color: var(--color-white) !important;
}

.fl-builder-content a.fl-button:focus,
.wpbf-button:focus,
input[type=submit]:focus,
.pp-infobox .pp-more-link:focus,
.job-submit:focus,
.jp-apply-button:focus,
.apply-btn:focus {
  outline: 2px solid var(--color-primary-hover);
  outline-offset: 2px;
}

.fl-builder-content a.fl-button:active,
.wpbf-button:active,
input[type=submit]:active,
.pp-infobox .pp-more-link:active,
.job-submit:active,
.jp-apply-button:active,
.apply-btn:active {
  background-color: var(--color-dark);
  border-color: var(--color-dark);
}

.fl-builder-content a.fl-button:disabled,
.wpbf-button:disabled,
input[type=submit]:disabled,
.pp-infobox .pp-more-link:disabled,
.job-submit:disabled,
.jp-apply-button:disabled,
.apply-btn:disabled {
  background-color: var(--color-primary-disabled);
  border: 1px solid var(--color-primary-disabled);
  border-radius: var(--radius-sm);
  border-color: var(--color-primary-disabled);
  color: var(--color-light-disabled);
  cursor: not-allowed;
  opacity: 0.65;
}

/* Tertiary Button (Text-Link mit Verstärkung) */
.button-tertiary,
.fl-button-tertiary {
  background-color: transparent;
  color: var(--color-primary);
  border: none;
  font-weight: var(--font-weight-bold);
  text-decoration: underline;
  padding: 0;
}

.button-tertiary:hover,
.fl-button-tertiary:hover {
  color: var(--color-primary-hover);
}

/* Ghost Button */
/* Ghost-Button-Stil für Beaver Builder Buttons */
.fl-builder-content .fl-button.button-ghost,
.fl-builder-content a.fl-button.button-ghost,
.fl-page a.fl-button.button-ghost,
.fl-builder-content .fl-button.button-ghost *,
.fl-page .fl-button.button-ghost * {
  background-color: transparent !important;
  color: var(--color-primary) !important;
  border: 1px solid var(--color-primary) !important;
  border-radius: var(--radius-sm) !important;
  padding: var(--spacing-1) var(--spacing-2) !important;
  font-weight: var(--font-weight-bold) !important;
  font-size: var(--font-size-body) !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

/* Hover-Zustand */
.fl-builder-content .fl-button.button-ghost:hover,
.fl-page .fl-button.button-ghost:hover {
  background-color: var(--color-primary) !important;
  color: var(--color-white) !important;
  border-color: var(--color-primary) !important;
}

/* Disabled-Zustand */
.fl-builder-content .fl-button.button-ghost:disabled,
.fl-page .fl-button.button-ghost:disabled,
.fl-builder-content .fl-button.button-ghost.disabled,
.fl-page .fl-button.button-ghost.disabled {
  background-color: transparent !important;
  color: var(--color-primary-disabled) !important;
  border-color: var(--color-primary-disabled) !important;
  cursor: not-allowed !important;
  opacity: 0.65 !important;
}


.fl-builder-content .button-ghost:disabled,
.fl-builder-content .fl-button-ghost:disabled,
.fl-page .button-ghost:disabled,
.fl-page .fl-button-ghost:disabled {
  background-color: transparent !important;
  color: var(--color-primary-disabled) !important;
  border-color: var(--color-primary-disabled) !important;
  opacity: 0.65;
  cursor: not-allowed;
}

/* Icon-only Button */
.button-icon,
.fl-button-icon {
  background-color: var(--color-primary);
  color: var(--color-white);
  border: none;
  border-radius: 50%;
  width: 2.5rem;
  height: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  transition: background-color var(--transition-fast);
}

.button-icon:hover,
.fl-button-icon:hover {
  background-color: var(--color-primary-hover);
}

/* Beaver Theme Default Button Style Override */
.fl-page a.fl-button *,
.fl-responsive-preview-content a.fl-button * {
  color: inherit !important;
}

/* Form Fields */
.fl-form-field input,
.fl-form-field textarea,
.fl-form-field select {
  width: 100%;
  padding: var(--spacing-1);
  font-size: var(--font-size-body);
  border: 1px solid var(--color-secondary);
  border-radius: var(--radius-sm);
  font-family: var(--font-family-base);
  transition: border-color var(--transition-fast);
}

.fl-form-field input:focus,
.fl-form-field textarea:focus,
.fl-form-field select:focus {
  outline: none;
  border-color: var(--color-primary);
}


/* Header Styling */

.fl-logo-img{
	max-width:100px;
	max-height:95px !important;
}

.fl-page-header-logo{
	z-index:999999;
}

.fl-page-nav-collapse{
	border-bottom:2px solid var(--color-secondary);
	transition: border 0.5s;
	position:relative;
}

.fl-shrink-header .fl-page-nav-collapse{
	border-bottom:0;
}

.fl-page-nav ul.sub-menu {
    background-color: var(--color-light);
    font-size: 1rem;
	padding:2rem 1rem !important;
	border-top:2px solid var(--color-secondary);
}

.fl-page-nav ul.sub-menu ul.sub-menu {
    margin-top: 0px;
		padding:unset !important;
}

.fl-page-nav ul.sub-menu li a{
	color:var(--color-primary) !important;
	text-decoration: none;
}

.fl-page-nav .mega-menu a[href="#"]:hover, 
.fl-page-nav .mega-menu a[href="#"]:focus,
.fl-page-nav ul.sub-menu li a:hover{
	color:var(--color-secondary) !important;
	text-decoration: underline;
}

.fl-page-nav-wrap .navbar-nav li.current-menu-ancestor>a, 
.fl-page-nav-wrap .navbar-nav li.current-menu-parent>a, 
.fl-page-nav-wrap .navbar-nav li.current-menu-item>a{
	color:var(--color-secondary) !important;
	text-decoration: none;
}


.fl-page-nav .navbar-nav>li>a.nav-link{
	color: var(--color-light);
	font-size:1rem;
	text-transform:uppercase;
	font-weight:900;
	font-family: 'Montserrat';
	text-decoration:none;
}

.fl-page-nav {
	padding: 0 calc(1rem + 10px);
}

.fl-page-nav .navbar-nav{
	width:100%;
}

.fl-page-nav .navbar-nav>li{
	float:left !important;
}

.fl-page-nav .navbar-nav>li.right{
	float:right !important;
}

.fl-page-nav .navbar-nav>li.fl-logo-centered-inline{
	float:none;
  position: absolute;
  left: calc(50% - 100px);
  right: calc(50% - 100px);
}

.fl-shrink-header .fl-page-header-container.container{
	padding-top:0.5rem;
	padding-bottom:0;
}

.fl-page-header-container.container{
	padding-bottom:0;
}

.fl-page-nav .navbar-nav>li:hover a,
.current-menu-item a{
	color:var(--color-secondary);
}

/* Sketch Marker */
u {
  position: relative;
  display: inline-block;
  font-style: normal;
  text-decoration:none;
	z-index:1;
}

u svg {
  position: absolute;
  top: -5px;
  left: -8px;
  width: calc(100% + 16px);
  height: calc(100% + 8px);
  pointer-events: none;
	z-index:-1;
}

u.line svg {
  top: -11px;
  left: -4px;
  width: calc(100% + 8px);
	transform:rotate(-1deg);
}

u.circle svg {
	transform:rotate(-3deg);
}


u path {
  stroke: var(--color-secondary);
  stroke-width: 1rem;
  stroke-dasharray: 1500 1500;
	opacity:0;
}

u.animation path {
	animation: draw 2s forwards;
	animation-play-state: running;
	opacity:1;
}

@keyframes draw {
  0% {stroke-dasharray: 0 1500;}
  100% {stroke-dasharray: 1500 1500;}
}

/* Content Post Grid */

.pp-content-grid-post {
	background-color:var(--color-white);
	border-radius:1rem;
}

.pp-content-grid-post *{
	color:var(--color-primary) !important;
	text-decoration:none;
}

.pp-content-grid-post-image{
	overflow: hidden;
}

.pp-content-grid-post .pp-content-grid-post-image img{
	transition: all var(--transition-fast);
	transform:scale(1.0);
}

.pp-content-grid-post:hover .pp-content-grid-post-image img{
	transform:scale(1.1);
}

.pp-content-grid-post-text {
    padding: 2rem;
}

.pp-content-grid-post-meta{
	padding:1rem 0 2rem 0;
}

.pp-content-grid-post-meta,
.pp-content-grid-post-more-link{
	font-weight:600;
}

.pp-content-grid-post-more-link a{
	color:var(--color-secondary) !important;
	text-transform:uppercase;
}


/* Content Post Grid Partner*/

.pp-content-grid-post.partner  {
	border-radius:0rem;
}

.pp-content-grid-post-logo img{
	width:80%;
}

.pp-content-grid-post-logo{
	text-align:center;
}

.pp-content-post-grid:has(.type-partner){
	align-items:center;
}

.pp-content-carousel-post.partner .pp-content-grid-post-logo {
    text-align: center;
    display: grid;
    align-items: center;
    height: 100%;
}

.emoji{
	width:1rem;
}

.fl-page-nav-collapse{
	border:0;
}

/* Filter */
.pp-post-filters-toggle{
	padding:0.5rem 0;
}

ul.pp-post-filters li {
	border-bottom: 1px solid var(--color-primary) !important;
}

/* Paginierung */
ul.page-numbers .page-numbers{
    height: 2.5rem;
    width: 2.5rem;
    padding: 0 !important;
    align-content: center;
    text-align: center;
	text-decoration: none;
}

ul.page-numbers .page-numbers.current,
ul.page-numbers .page-numbers:hover{
    font-weight: 600;
}

ul.page-numbers .page-numbers.next,
ul.page-numbers .page-numbers.prev{
	width: auto;
	font-weight: 500;
	padding: 0 1rem !important;
}


/* Person Item */
.pp-content-grid-person{
	overflow:hidden;
}

.pp-content-grid-person-text{
	position:absolute;
	bottom:-1rem;
	background:rgba(0,0,0,0.75);
	left:0;
	width:101%;
	padding:2rem 2rem 3rem 2rem;
	transform:scale(1) rotate(-1.5deg);
	transition:all var(--transition-fast);
}

.pp-content-post:hover  .pp-content-grid-person-text{
	transform:scale(1.05) rotate(-2.5deg);
	background:rgba(0,0,0,0.85);
}

.pp-content-grid-person-text p{
	margin:0;
	color:var(--color-white) !important;
	line-height: 120%;
	font-size: 0.75rem;
}

.pp-content-grid-person-title{
	font-size:1.5rem;
	line-height: 120%;
	color:var(--color-white) !important;
}

.pp-content-grid-person-number{
	font-size:1.5rem;
	font-weight:600;
	position:absolute;
	top:-1.5rem;
	right:1.5rem;
	background:var(--color-secondary);
	border-radius:100%;
	height:3rem;
	width:3rem;
	text-align:center;
	line-height:3rem;
}

.pp-content-grid-person-position{
	font-weight:600;
}

.pp-content-grid-person-position a{
	color:var(--color-white) !important;
}

.pp-content-grid-person-position .person-email:before,
.pp-content-grid-person-position .person-telefon:before{
	font-family: dashicons;
	content:"\f465";
	display:inline;
	color:var(--color-secondary);
	margin-right:0.5rem;
}

.pp-content-grid-person-position .person-telefon:before{
	content:"\f525";
}

.pp-content-grid-person-image{
	background-position: center;
	background-size: cover;
}

.pp-content-grid-person-image img{
	opacity:1;
	transition:transform var(--transition-fast);
	height:450px;
	width:400px;
	object-fit:cover;
}

.pp-content-post:hover .pp-content-grid-person-image img{
	transform:scale(1.1);
}


/* Hero Video */
.pp-video-wrapper:not(.pp-video-has-lightbox) .pp-video-image-overlay img{
	display:none;
}


/* Store Locator */
.wpsl-locations-details{
	display:none;
}

.fl-module .wpsl-locations-details{
	display:block;
}

.wpsl-gmap-canvas{
	margin-bottom:0;
	height:40vh !important;
	min-height:350px;
}

/* single-mannschaften */
.fl-row-full-width .fl-row-full-width{
	padding-top:0 !important;
	padding-bottom:0 !important;
	padding-left:0 !important;
	padding-right:0 !important;
}

.fl-row-full-width  .fl-col{
	padding:0 !important;
}

/* Responsive */

@media (max-width: 991px) {
	.fl-nav-mobile-offcanvas.fl-responsive-nav-enabled header[class*=" fl-page-nav-toggle-visible-"].fl-page-header .fl-nav-offcanvas-collapse{
		box-shadow: none;
	}

	.fl-page-header .fl-page-nav-collapse ul.navbar-nav>li{
		width: 100%;
	}

	.fl-page-nav-toggle-icon.fl-page-nav-toggle-visible-medium-mobile .fl-page-nav ul.sub-menu li a{
		color: var(--white) !important;
	}
	
	.fl-page-header-logo {
		flex:1;
	}
	
	.fl-page-nav-toggle-icon.fl-page-nav-toggle-visible-medium-mobile .fl-page-nav .navbar-toggle{
		height:100%;
	}
	
	.fl-page-nav ul.sub-menu{
		padding: 0 !important;
	}
	
    .fl-page-nav-toggle-icon.fl-page-nav-toggle-visible-medium-mobile .fl-page-nav ul.sub-menu li {
        border-top: 1px solid #373737;
    }
	
	.fl-logo-img{
		max-width:70px;
	}
	
	.fl-page-header{
		z-index:900;
	}
	
	.fl-row-bg-overlay .fl-row-content-wrap:after{
		background: rgba(0,0,0,0.5) !important;
	}
	
	.pp-content-grid-person-title{
		font-size:1.0rem;
	}
	
	.pp-content-grid-person-image img{
		height:300px;
	}
	
	.pp-content-grid-person-text{
		padding:1.5rem 1rem 2.5rem 1rem;
	}
}