/*
 Theme Name:   Custom Theme by KERNFUNKE
 Theme URI:    https://kernfunke.com/
 Description:  Custom Theme ...
 Author:       KERNFUNKE
 Author URI:   https://kernfunke.com/
 Template:     generatepress
 Version:      4.2
*/

/* ============================
   Montserrat Font Family Configuration
   ============================ */
 
 /* montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 200;
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-200.eot'); /* IE9 Compat Modes */
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-200.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-200.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-200.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* 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('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-500.eot'); /* IE9 Compat Modes */
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-500.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-600.eot'); /* IE9 Compat Modes */
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-600.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* 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('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-700.eot'); /* IE9 Compat Modes */
  src: url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/wp-content/themes/generatepress_child/fonts/montserrat-v26-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
}


/* ============================
CSS Variables
============================ */
:root {
 /* Font-size variables - T-shirt sizing method - Desktop  */
 --font-xs: 0.579rem;
 --font-sm: 0.694rem;
 --font-md: 0.833rem;
 --font-base: 1.1rem;
 --font-lg: 1.2rem;
 --font-xl: 1.44rem;
 --font-2xl: 1.728rem;
 --font-3xl: 1.2rem;
 --font-4xl: 1.44rem;
 --font-5xl: 1.728rem;
 --font-6xl: 1.728rem;
 --font-7xl: 3.583rem;
 --font-8xl: 4.300rem;
}
  
 /* Font-size variables - Mobile */
@media (max-width: 768px) {
 :root {
   /* Smaller font-size variables for mobile */
   --font-xs: 0.5rem;
   --font-sm: 0.6rem;
   --font-md: 0.75rem;
   --font-base: 1rem;
   --font-lg: 1rem;
   --font-xl: 1.1rem;
   --font-2xl: 1.1rem;
   --font-3xl: 1rem;
   --font-4xl: 1.1rem;
   --font-5xl: 1.1rem;
   --font-6xl: 1.6rem;
   --font-7xl: 2.4rem;
   --font-8xl: 2.8rem;
 }
}
  
:root {
 /* Spacing-related variables - T-shirt sizing method and Golden ratio */
 --space-xs: 5px;
 --space-sm: 8px;
 --space-md: 13px;
 --space-lg: 21px;
 --space-xl: 34px;
 --space-2xl: 55px;
 --space-3xl: 89px;
 --space-4xl: 144px;
 --nspace-xs: -5px;
 --nspace-sm: -8px;
 --nspace-md: -13px;
 --nspace-lg: -21px;
 --nspace-xl: -34px;
 --nspace-2xl: -55px;
 --nspace-3xl: -89px;
 --nspace-4xl: -144px;
 --nspace-5xl: -233px;
 --space-button-tb: 10px;
 --space-button-lr: 20px;

 /* Shadows */
 --shadow-box-base: 0 1px 4px 0 rgba(0, 0, 0, 0.2);

 /* Radius */
 --radius-button-base: 5px;
 --radius-box-base: 7px;

 /* ----------------------------
    Colors (Standard / Light Mode) 
    ---------------------------- */

 /* KF Primary Color 1 und Shades */
 --kf-shade-1-1: #D0D7DD;
 --kf-shade-1-2: #A4B2BE;
 --kf-shade-1-3: #8094A4;
 --kf-shade-1-4: #7893A5;
 --kf-shade-1-5: #1f5671;
 --kf-primary-color-1: #124E6F; /* KF Primary Color 1 */

 /* KF Primary Color 2 und Shades */
 --kf-shade-2-1: #f6f6f6;
 --kf-shade-2-2: #e7e7e7;
 --kf-shade-2-3: #C3C3C3;
 --kf-primary-color-2: #7C7C7C; /* KF Primary Color 2 */
 --kf-shade-2-4: #666666;
 --kf-shade-2-5: #4f4f4f;
 --kf-shade-2-6: #2B2B2B;

 /* KF Primary Color 3 und Shades */
 --kf-shade-3-1: #ffffff;
 --kf-shade-3-1-trans: rgba(255, 255, 255, 0.85);
 --kf-primary-color-3: #f8f8f8; /* KF Primary Color 3 */

 /* KF Secondary Color 4 und Shades */
 --kf-secondary-shade-4-1: #FFD448;
 --kf-secondary-color-4: #FFC403; /* KF Secondary Color 4 */
 --kf-secondary-shade-4-2: #e69603;
}

/* ============================
Custom Color and Font Definitions
============================ */

/* Body & Text */
body {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-base);
 line-height: 1.5;
 background-color: var(--kf-primary-color-3) !important;
 color: var(--kf-shade-2-6);
}

/* Links */
a {
 color: var(--kf-primary-color-1);
 font-size: var(--font-base);
 text-decoration: none;
}
a:hover {
 color: var(--kf-primary-color-2);
}

/* Buttons */
button {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-lg);
 font-weight: 500;
 line-height: 1;
 letter-spacing: 0.02em;
 color: var(--kf-shade-2-6);
 background-color: var(--kf-primary-color-1);
}

/* Primary Navigation */
.main-navigation a {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-lg);
 color: var(--kf-primary-color-1);
}
/* Secondary Navigation */
.sub-menu a {
  font-family: 'Montserrat', sans-serif;
  font-size: var(--font-lg);
  color: var(--kf-primary-color-1);
}

/* Headings */
h1 {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-8xl);
 font-weight: 700;
 line-height: 1.3;
 letter-spacing: 0.03em;
 color: var(--kf-primary-color-1);
 margin-bottom: 20px;
}

h2 {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-7xl);
 font-weight: 600;
 line-height: 1.3;
 letter-spacing: 0.03em;
 color: var(--kf-primary-color-1);
 margin-bottom: 2px;
}

h3 {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-6xl);
 font-weight: 200;
 line-height: 1.3;
 color: var(--kf-primary-color-1);
 margin-bottom: 20px;
}

h4 {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-5xl);
 line-height: 1.3;
 color: var(--kf-primary-color-1);
 margin-bottom: 20px;
}

h5 {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-4xl);
 font-weight: 400;
 color: var(--kf-primary-color-1);
}

h6 {
 font-family: 'Montserrat', sans-serif;
 font-size: var(--font-3xl);
 font-weight: 200;
 color: var(--kf-primary-color-1);
}


/* ============================
Dark Mode
============================ */

 /* ----------------------------
    Colors
    ---------------------------- */

[data-theme="dark"] {
 /* KF Primary Color 1 und Shades Variablen im Darkmode */
 --kf-shade-1-1: #8B9AA2;
 --kf-shade-1-2: #6D7F89;
 --kf-shade-1-3: #53636D;
 --kf-shade-1-4: #44515D;
 --kf-shade-1-5: #1A3C4C;
 --kf-primary-color-1: #FFFFFF; /* KF Dark Primary Color 1 */

 /* KF Primary Color 2 und Shades Variablen im Darkmode */
   --kf-shade-2-1: #2B2B2B;
 --kf-shade-2-2: #1F1F1F;
 --kf-shade-2-3: #232323;
 --kf-primary-color-2: #555555; /* KF Dark Primary Color 2 */
 --kf-shade-2-4: #808080;
 --kf-shade-2-5: #999999;
 --kf-shade-2-6: #f2f2f2;

 /* KF Primary Color 3 und Shades Variablen im Darkmode */
 --kf-shade-3-1: #0E374D;
 --kf-shade-3-1-trans: rgba(14, 55, 77, 0.7);
 --kf-primary-color-3: #0E374D; /* KF Dark Primary Color 3 */
 --kf-shade-3-2: #124E6F;

 /* KF Secondary Color 4 und Shades Variablen im Darkmode */
  --kf-secondary-shade-4-1: #FFC107;
  --kf-secondary-color-4: #FFC403; /* KF Dark Secondary Color 4 */
 --kf-secondary-shade-4-2: #E67E00;
}

 /* ----------------------------
    Customer Logo Styles 
    ---------------------------- */

 /*  Normal Layout (Light Mode) */

.customer_logo {
 filter: grayscale(100%);
 transition: filter 0.3s ease;
}

.customer_logo:hover {
 filter: none;
}

 /* Dark Mode */

[data-theme="dark"] .customer_logo {
 filter: grayscale(100%) invert(100%) brightness(150%);
}

[data-theme="dark"] .customer_logo:hover {
 filter: none;
}

/* Spezifische Anpassungen für problematische Logos */

/* ALUPRAX-Logo */
[data-theme="dark"] .customer_logo-aluprax {
 filter: grayscale(100%) invert(70%) brightness(140%) contrast(130%);
}

[data-theme="dark"] .customer_logo-aluprax:hover {
 filter: none;
}
 /*  Normal Layout (ALUPRAX) */

.customer_logo-aluprax {
 filter: grayscale(100%);
 transition: filter 0.3s ease;
}

.customer_logo-aluprax:hover {
 filter: none;
}

/* SJØØRN Spirits-Logo */
[data-theme="dark"] .customer_logo-sjoorn {
 filter: grayscale(100%) brightness(150%) contrast(120%);
 opacity: 0.8;
}

[data-theme="dark"] .customer_logo-sjoorn:hover {
 filter: none;
}
 /*  Normal Layout (Spirits) */

.customer_logo-sjoorn {
 filter: grayscale(100%);
 transition: filter 0.3s ease;
}

.customer_logo-sjoorn:hover {
 filter: none;
}

/* BALZER-Logo */
[data-theme="dark"] .customer_logo-balzer {
 filter: grayscale(100%) brightness(180%) contrast(120%) invert(100%);
 transition: brightness 0.3s ease, contrast 0.3s ease; /* Nur Helligkeit und Kontrast transition */
}

[data-theme="dark"] .customer_logo-balzer:hover {
 filter: none;
}

 /*  Normal Layout (BALZER) */
.customer_logo-balzer {
 filter: grayscale(100%);
 transition: filter 0.3s ease;
}

.customer_logo-balzer:hover {
 filter: none;
}

/* ============================
 Toggle Switch Styling
 ============================ */
.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
  margin-left: 10px;
  vertical-align: middle;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--kf-primary-color-1);
  transition: .4s;
  border-radius: 20px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 14px;
  width: 14px;
  left: 3px;
  bottom: 3px;
  background-color: var(--kf-shade-3-1);
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: var(--kf-primary-color-1);
}

input:checked + .slider:before {
  transform: translateX(20px);
}

/* Im mobilen Menü nach oben verschieben */
@media (max-width: 768px) {
 .dark-mode-toggle-item {
   order: -1;
   padding-top: 20px;
 }
}

/* ============================
 Contactformular Sub-Contact-Container Animation
 ============================ */
 .direct_contact_container {
   transition: transform 0.3s ease;
 }
 
 .direct_contact_container:hover {
   transform: translateY(-30px);
 }
 
 [data-theme="dark"] .direct_contact_container .contact_icon {
   filter: invert(100%) brightness(200%);
 }
 
 .direct_contact_container:hover .contact_icon {
   filter: invert(70%) sepia(90%) saturate(530%) hue-rotate(354deg) brightness(99%) contrast(103%);
 }

/* ============================
 Team-Kontaktseiten Sub-Contact-Container Animation
 ============================ */
 
[data-theme="dark"] .direct_contact_container .team_contact_icon {
   filter: invert(100%) brightness(200%);
}

.direct_contact_container:hover .team_contact_icon {
 filter: invert(70%) sepia(90%) saturate(530%) hue-rotate(354deg) brightness(99%) contrast(103%);
}

/* ----------------------------
  JetFormBuilder Styles
  ---------------------------- */

/* Input-Feld Styles */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
textarea {
   width: 100%;
   padding: 10px;
   border: 1px solid #124E6F; 
   border-radius: 30px; 
   font-size: 16px;
   margin-bottom: 20px;
   outline: none;
}

/* Fokus-Effekte für alle Felder */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
textarea:focus {
   border-color: #124E6F;
   box-shadow: 0 0 5px rgba(0, 124, 158, 0.5);
}

/* Checkbox Styles */
.jet-form-builder__field-wrap.checkboxes-wrap.checkradio-wrap label.jet-form-builder__field-label.for-checkbox input[type="checkbox"] + span::before {
   width: 22px;
   height: 22px;
   border: 2px solid #FFC403;
   margin-right: 10px;
   border-radius: 3px;
}

.jet-form-builder__field-wrap.checkboxes-wrap.checkradio-wrap label.jet-form-builder__field-label.for-checkbox input[type="checkbox"]:checked + span::before {
   background-color: #FFC403;
   border: 2px solid #FFC403;
}

/* Button Styles */
.jet-form-builder__action-button {
   border-radius: 30px;
   border: none;
   color: white;
   background-color: var(--kf-primary-color-1);
   padding: 15px 35px;
   text-align: center;
   position: relative;
   cursor: pointer;
   font-size: 16px;
   color: var(--kf-primary-color-3);
}

.jet-form-builder__action-button::after {
   content: '';
   display: inline-block;
   width: 16px;
   height: 16px;
   background-size: cover;
   background-repeat: no-repeat;
   position: absolute;
   right: 10px;
   top: 50%;
   transform: translateY(-50%);
}

/* Submit-Button Wrapper Styles */
.jet-form-builder__submit-wrap {
   display: flex;
   justify-content: flex-end;
   align-items: center;
   padding: 0;
}