/* Wichtig: hoch genug, damit Wrapper/Modules nicht überdecken */
html, body{
  background: #EEE9E6 !important;
  color: var(--kzt-text) !important;
}

/*h1, h2, h3, h4, h5, h6, p {
	color: #080808!important;
}*/

/* ================================
   GLOBAL STYLES – spargel-baecker
   ================================ */

/* 1. Root-Farben */
:root {
  /* Brand */
  --hl-green: #0B5A22;
  --hl-red: #E4062D;
  --hl-beige: #EEE9E6;
  --hl-white: #FFFFFF;
  --hl-dark-beige: #C5C5BA;

  /* Semantik (wichtig für Wiederverwendung!) */
  --color-primary: var(--hl-green);
  --color-secondary: var(--hl-red);
  --color-bg: var(--hl-beige);
  --color-text: #000000;
  --color-white: var(--hl-white);



     /* Fonts */
  --font-sans: 'TiemposHeadline-Regular', sans-serif;
  --font-regular: 'HelveticaNeue-Regular', sans-serif;
  --font-bold: 'HelveticaNeue-Bold', sans-serif;
  --font-fa: 'Font Awesome 7 Sharp Thin', sans-serif;
}


/* Erzwingt die richtige Familie für Thin */
i.fa-sharp.fa-thin,
span.fa-sharp.fa-thin {
  font-family: "Font Awesome 7 Sharp Thin" !important;
  font-weight: 100 !important;
  font-style: normal;
}



/* 3. Base Styles */


/*FB Tuning

html, body { height: 100%; overflow: hidden; }
body { user-select: none; -webkit-user-select: none; cursor: none; }
* { -webkit-tap-highlight-color: transparent; }
*/

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 100%;
  scroll-behavior: smooth;
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font-sans);

 
  color: var(--color-black);
  /*background-color: var(--color-black)!important;*/
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}


h2 {
/*
  hyphens: auto!important;
  -webkit-hyphens: auto!important;
  word-break: normal!important;*/
}




/* 4. Headings *
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-headline);
  font-weight: normal;
  color: var(--color-black);
  margin-bottom: 0.5em;
  
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }*/


/* 5. Links & Buttons */
a {
  color: var(--color-black);
  text-decoration: none;
  transition: all 0.3s ease;
}

a:hover {
  text-decoration: underline;
}

button,
.button {
 font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1rem;
  padding: 10px 25px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  background-color: var(--color-yellow);
  color: var(--color-black);
  transition: all 0.3s ease;
}

.button:hover {
  background-color: var(--color-black);
  color: var(--color-white);
  text-decoration: underline;
}

/* 6. Utility Classes */
.text-center { text-align: center; }
.text-white  { color: var(--color-white); }
.bg-yellow   { background-color: var(--color-yellow); }
.bg-black    { background-color: var(--color-black); }
.bg-gray     { background-color: var(--color-gray); }

/* 7. Responsive Basics */
@media (max-width: 768px) {
  h1 { font-size: 2rem; }
  h2 { font-size: 1.75rem; }
  h3 { font-size: 1.5rem; }
}

 
/* ============================
   KZT — NAV OFFSET (auto)
   ============================ */

:root {
  --kzt-nav-offset: 0px;
}

/* Wichtig: Header soll in sich „sauber“ layouten */
.site-header {
  box-sizing: border-box;
  width: 100%;
}

/* Falls deine Navi fixed/sticky ist, muss der Content gepusht werden.
   Wir nutzen dafür die gemessene Höhe (nicht nur --nav-height). */
body.has-nav-offset {
  padding-top: var(--kzt-nav-offset);
}

/* Optional: wenn du statt body einen Wrapper nutzt, nimm den:
.site-main,
main {
  padding-top: var(--kzt-nav-offset);
}
*/



/* ===== Header / Headroom ===== */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2000!important;
  background: var(--nav-bg) !important; /* kein Fallback mehr, Variable ist Pflicht */
  box-shadow: var(--nav-shadow, none);
  border-bottom: var(--nav-border, none);
  isolation: isolate;
}


body.has-fixed-nav .site-header {
  position: fixed;
  top: 0;
  left: 0;
}

/* ===== Mini-Navi ===== */
.mini-nav {
  position: absolute;
  top: var(--mini-top, 3px);
  right: var(--mini-right, 32px);
  z-index: 10;
  padding: 0.5rem 0; /* nur vertikal, horizontal via right */
  font-family: 'Roboto', sans-serif;
  font-size: 15px;
  color: #777;
}



.mini-nav ul {
  display: flex;
  gap: var(--mini-gap, 20px);
  list-style: none;
  margin: 0;
  padding: 0;
}

.mini-nav li a {
  color: #777;
  text-decoration: none;
  position: relative;
  padding: 2px 0;
  font-family: 'Roboto', sans-serif;
  transition: all 0.2s ease;
}

/* Letzter Link: gelber Button */
.mini-nav li:last-child a {
  background-color: var(--color-yellow);
  color: var(--color-black);
  border-radius: 5px;
  padding: 5px 10px;
  font-weight: 700;
}
.mini-nav li:last-child a:hover {
  background-color: var(--color-black);
  color: var(--color-white);
}

/* Hover-Effekt: */
.mini-nav li a:hover {
  color: var(--color-black);
}

/* ===== Content-Offset für fixed Header ===== */
main,
.content-wrapper {
  padding-top: var(--nav-height, 110px);
}

body.has-fixed-nav main,
body.has-fixed-nav .content-wrapper {
  padding-top: var(--nav-height, 110px);
}

/* ===== Main-Nav ===== */

/* Desktop-Default */
.site-header .main-nav .menu{ display:flex; }
.site-header .main-nav .nav-toggle{ display:none; }

/* Mobile-Override (via .bp-mobile) – hart durchsetzen */
.bp-mobile .site-header .main-nav .menu{ display:none !important; }
.bp-mobile .site-header .main-nav .nav-toggle{ display:inline-flex !important; }
.bp-mobile .site-header .main-nav .nav-lang{ display:none !important; }

/* Optional explizit für Desktop */
.bp-desktop .site-header .main-nav .nav-toggle{ display:none !important; }
.bp-desktop .site-header .main-nav .menu{ display:flex !important; }



.main-nav {
  display: flex;
  justify-content: space-between; /* Logo links, Menü rechts */
  align-items: center;
  /*background: #f5f5f5;*/
  gap: var(--nav-gap, 32px); /* Abstand Logo <> Menü */
  padding: var(--nav-py, 0) var(--nav-px, 32px) 0 var(--nav-px-left, 0);
}

/* Panel-Overrides */
.main-nav.logo-pos-center { justify-content: center; }
.main-nav.logo-pos-right  { justify-content: flex-end; }

/* ===== Logo ===== */
.main-nav .logo {
  display: flex;
  align-items: center;
  padding: var(--logo-py, 8px) 0;
  transform: translateX(var(--logo-offset-x, 0px));
  margin: 0;
}

.main-nav .logo a {
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.main-nav .logo .logo-img {
  display: block;
  height: auto;
  max-height: var(--logo-h, 48px);
  width: auto;
  max-width: var(--logo-w, none);
  object-fit: contain;
  image-rendering: -webkit-optimize-contrast;
}

/* Logo auf Mobile ausblenden (Panel-Toggle) */
.main-nav .logo[data-hide-mobile="true"] { display: flex; }
@media (max-width: 768px) {
  .main-nav .logo[data-hide-mobile="true"] { display: none; }
}

/* ===== Menü ===== */
.menu ul {
  display: flex;
  gap: var(--menu-gap, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: flex-end;
}

.menu a {
  font-weight: 500;
  color: var(--color-black);
  text-decoration: none;
  position: relative;
}

.menu a[aria-current="page"] {
  text-decoration: underline;
  font-weight: 700;
}

/* ===== Headroom States ===== */
.headroom {
  transition: transform 0.3s ease-in-out;
  will-change: transform;
}
.headroom--unpinned { transform: translateY(-100%); }
.headroom--pinned   { transform: translateY(0); }
.headroom--not-top  { box-shadow: 0 4px 10px rgba(0,0,0,0.05); }

/* ===== Responsive Feinschliff ===== */
@media (max-width: 1024px) {
  :root { --nav-height: 96px; }
}

@media (max-width: 768px) {
  :root { --nav-height: 84px; }

  .main-nav {
    gap: 1rem;
    padding-right: 1rem;
  }

  .menu ul {
    gap: 1rem;
  }
}

/* ================================
   SIMPLE NAVIGATION (rfcp)
   ================================ */

.glass-list {
  display: flex;
  gap: var(--menu-gap, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
}

.glass-link {
  font-family: "Roboto Mono", monospace;
  font-weight: 400;
  font-size: clamp(11px, 0.9vw, 15px);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .06em;

  color: #000;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  transition: color .2s ease;
}

/* Hover + Active */
.glass-link:hover,
.glass-link:focus {
  color: #555;
}

.menu a[aria-current="page"].glass-link {
  color: #d00; /* Aktiver Link in Rot, kannst du anpassen */
}

/* Falls globales Menülink-Styling reinfunkt: neutralisieren */
.menu a.glass-link {
  text-decoration: none;
}

/* ================================
   SUBMENU
   ================================ */
 
  

/* Dynamischer Breakpoint aus dem Panel für Toggle/Desk-Menu */
@media (max-width: <?= $breakpoint ?>px) {
  .site-header .main-nav .menu { display: none; }
  .site-header .main-nav .nav-toggle { display: inline-flex; }
  .site-header .main-nav .nav-lang { display: none; }
}
@media (min-width: <?= $breakpoint + 1 ?>px) {
  .site-header .main-nav .nav-toggle { display: none; }

  .site-header .main-nav {
    display: flex;
    align-items: center;
    gap: var(--nav-gap);
  }
  .site-header .main-nav .menu {
    flex: 1 1 auto;
    display: flex;
    justify-content: var(--menu-jc);
  }
  .site-header .main-nav .menu .glass-list {
    display: flex;
    gap: var(--menu-gap);
    align-items: center;
    justify-content: var(--menu-jc);
    margin: 0;
    padding: 0;
  }
  .site-header .main-nav .nav-lang {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
  }
}



/* Optionaler Fade unten (Glass) */
.site-header[data-glass-fade="1"]::before {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: var(--nav-glass-fade-h);
  pointer-events: none;
  background: linear-gradient(to bottom, var(--nav-bg) 0%, rgba(0,0,0,0) 100%);
}

/* Inhalt paddings */
.site-header .main-nav {
  min-height: var(--nav-height);
  padding: var(--nav-py) var(--nav-px);
  padding-left: calc(var(--nav-px-left));
}

/* ===== Menü-Link-Base-Stile ===== */
.site-header .main-nav .menu .glass-list > li { position: relative; }

.site-header .main-nav .menu .glass-list .glass-link,
.site-header .main-nav .menu .glass-list .glass-toggle {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  padding: var(--menu-py) var(--menu-px);
  cursor: pointer;
  background: transparent;
  border: 0;
}

.site-header .main-nav .menu .glass-list .label {
  font-size: var(--menu-fs-m);
  line-height: 1.2;
  font-weight: var(--menu-fw);
  letter-spacing: var(--menu-ls);
  text-transform: var(--menu-tt);
  color: var(--menu-col);
  transition: color .2s ease, text-decoration-color .2s ease, opacity .2s ease;
}

.site-header .main-nav .menu .glass-list .glass-link:hover .label,
.site-header .main-nav .menu .glass-list .glass-toggle:hover .label {
  color: var(--menu-col-hover);
}
.site-header .main-nav .menu .glass-list .glass-link[aria-current="page"] .label {
  color: var(--menu-col-active);
}

/* Unterstreich-Logik per Data-Attribut */
.site-header[data-underline="hover"] .main-nav .menu .glass-list .glass-link:hover .label,
.site-header[data-underline="hover"] .main-nav .menu .glass-list .glass-toggle:hover .label { 
  text-decoration: underline; text-underline-offset: 0.18em; 
}
.site-header[data-underline="active"] .main-nav .menu .glass-list .glass-link[aria-current="page"] .label { 
  text-decoration: underline; text-underline-offset: 0.18em;
}
.site-header[data-underline="both"] .main-nav .menu .glass-list .glass-link:hover .label,
.site-header[data-underline="both"] .main-nav .menu .glass-list .glass-link[aria-current="page"] .label,
.site-header[data-underline="both"] .main-nav .menu .glass-list .glass-toggle:hover .label {
  text-decoration: underline; text-underline-offset: 0.18em;
}

/* Tablet-Größe bis Breakpoint */
@media (min-width: 768px) and (max-width: <?= $breakpoint ?>px) {
  .site-header .main-nav .menu .glass-list .label { font-size: var(--menu-fs-t); }
}

/* Desktop-Größe */
@media (min-width: <?= $breakpoint + 1 ?>px) {
  .site-header .main-nav .menu .glass-list .label { font-size: var(--menu-fs-d); }
}

/* Language-Pills im Overlay (Burger) */
#mobile-overlay .overlay-lang { margin-top: 1rem; }
#mobile-overlay .overlay-lang .lang-switcher ul {
  display: flex; gap: .5rem; flex-wrap: wrap; margin: 0; padding: 0; list-style: none;
  font-family: var(--font-mono, 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
}
#mobile-overlay .overlay-lang .lang-switcher li a,
#mobile-overlay .overlay-lang .lang-switcher li span {
  padding: .35rem .6rem; font-size: 13px; border: 1px solid rgba(0,0,0,.15); border-radius: 999px; line-height: 1; text-decoration: none;
}
#mobile-overlay .overlay-lang .lang-switcher li.is-active span { background: #111; color: #fff; border-color: #111; }

/* Language Switcher Sichtbarkeit im Header (per Panel steuerbar) */
@media (min-width: <?= $breakpoint + 1 ?>px) {
  .site-header .main-nav .nav-lang { display: <?= $showLangD ? 'inline-flex' : 'none' ?>; }
}
@media (max-width: <?= $breakpoint ?>px) {
  .site-header .main-nav .nav-lang { display: <?= $showLangM ? 'inline-flex' : 'none' ?>; }
}



/* ============================
   SUBMENÜ — FIX: nicht fixed (Headroom-transform!), sondern absolute
   ============================ */

/* Wichtig: Anchor für absolute Position */
.site-header .main-nav .menu .glass-list > li {
  position: relative;
}

/* Panel sitzt unter dem Toggle – zentriert wie vorher */
.submenu-panel{
  position: absolute;              /* <-- FIX */
  top: calc(100% + 14px);          /* Abstand unter dem Button */
  left: 50%!important;
  transform: translateX(-50%)!important;

  z-index: 2100;
  background:#fff;
  border:1px solid #dbdbdb;
  box-shadow:0 24px 80px rgba(0,0,0,.25),0 2px 6px rgba(0,0,0,.08);
  border-radius:0;
  overflow:hidden;
  box-sizing:border-box;

  width:clamp(820px,56vw,1040px)!important;
  min-width:820px!important;
  max-width:1040px!important;

  --g:24px;
  --pad-x:22px;
  --pad-y:20px;
  --icon-size:20px;
  --card-bg:#fff;
  --card-bg-hover:#020202;
  --card-color:#0b1225;
  --card-color-hover:#f5f5f5;
}

/* falls irgendwo overflow hidden greift: */
.site-header,
.site-header .nav-wrap,
.site-header .main-nav,
.site-header .menu {
  overflow: visible;
}

.submenu-panel,
.submenu-panel *{text-align:left!important;}
.submenu-panel[hidden]{display:none;}

.submenu-list{
  display:grid!important;
  grid-template-columns:1fr 1fr;
  grid-auto-rows:1fr;
  gap:var(--g);
  margin:0!important;
  padding:var(--g)!important;
  list-style:none;
  box-sizing:border-box;
}
.submenu-list li{margin:0!important;}

.submenu-link{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:14px;
  width:100%!important;
  height:100%;
  margin:0!important;
  padding:var(--pad-y) var(--pad-x)!important;
  background:var(--card-bg);
  box-shadow:inset 0 0 0 1px #dbdbdb!important;
  border-radius:0;
  text-decoration:none;
  color:var(--card-color);
  font-family:var(--font-sans)!important;
  font-size:16px!important;
  line-height:1.35;
  white-space:nowrap;
  overflow:visible;
  text-overflow:ellipsis;
  transition:background-color .18s ease,color .18s ease,box-shadow .18s ease;
}
.submenu-link i,
.submenu-link .icon,
.submenu-link svg{
  width:var(--icon-size);
  height:var(--icon-size);
  flex:0 0 var(--icon-size);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:currentColor!important;
  fill:currentColor!important;
  opacity:.9;
}
.submenu-link:not(:hover) i,
.submenu-link:not(:hover) .icon,
.submenu-link:not(:hover) svg{opacity:.85;}
.submenu-link .label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.submenu-link:hover,
.submenu-link:focus-visible{
  background:var(--card-bg-hover)!important;
  color:var(--card-color-hover)!important;
  box-shadow:inset 0 0 0 1px #dbdbdb!important;
  outline:none;
}
.submenu-list li+li .submenu-link,
.submenu-list li+li .submenu-link::before{
  border-top:none!important;
  content:none!important;
}


/* =========================================================
   ACTIVE für Parent-Menüpunkte mit Sub-Navigation (RFCP)
   Voraussetzung: navigation.php setzt li.is-active-parent
   ========================================================= */

/* Parent-Toggle rot (Label) */
.site-header .main-nav .menu .glass-list > li.is-active-parent > .glass-toggle .label{
  color: var(--menu-col-active);
}

/* optional: underline passend zum underline-mode */
.site-header[data-underline="active"] .main-nav .menu .glass-list > li.is-active-parent > .glass-toggle .label,
.site-header[data-underline="both"]   .main-nav .menu .glass-list > li.is-active-parent > .glass-toggle .label{
  text-decoration: underline;
  text-underline-offset: 0.18em;
}


/* ============================
   FUNKTIONIERENDER CHEVRON — alter, sicherer Stand
   ============================ */

/* Parent-Toggle layouten */
.glass-toggle{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:6px;
  position:relative;
  padding-right:18px;
  overflow:visible;
}

/* Chevron sichtbar & farblich steuerbar */
.glass-toggle .chev{
  display:inline-block!important;
  width:18px;
  height:18px;
  margin-left:6px;
  opacity:.85;
  transform-origin:center;
  transition:transform .2s ease;
  pointer-events:none;
  color:currentColor;
  fill:currentColor;
}

/* Rotation bei offenem Zustand */
.has-open>.glass-toggle .chev,
.is-open>.glass-toggle .chev{
  transform:rotate(180deg);
}

/* ============================
   Backdrop & Header Defaults
   ============================ */
.submenu-backdrop{
  position:fixed;inset:0;
  backdrop-filter:blur(16px)saturate(1.1);
  -webkit-backdrop-filter:blur(16px)saturate(1.1);
  background:rgba(10,16,30,.35);
  z-index:1100;
  opacity:0;pointer-events:none;
  transition:opacity .18s ease;
}
body.has-submenu-open .submenu-backdrop{opacity:1;pointer-events:all;}

.site-header+main,
.site-header+.site-main,
.site-header+#content{margin-top:0;padding-top:0;}
.site-header .main-nav .menu{display:flex;}
.site-header .main-nav .nav-toggle{display:none;}
.bp-mobile .site-header .main-nav .menu{display:none;}
.bp-mobile .site-header .main-nav .nav-toggle{display:inline-flex;}
.bp-mobile .site-header .main-nav .nav-lang{display:none;}
.bp-desktop .site-header .main-nav .nav-toggle{display:none;}
.bp-desktop .site-header .main-nav .menu{display:flex;}

/* ============================
   Responsive
   ============================ */
@media(max-width:960px){
  .submenu-panel{
    left:8px!important;
    right:8px!important;
    transform:none!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
  }
  .submenu-list{grid-template-columns:1fr;}
}

/* ============================
   Motion-Reduce
   ============================ */
@media(prefers-reduced-motion:reduce){
  .submenu-backdrop,
  .glass-toggle .chev,
  .submenu-link{transition:none;}
}


/* ================================
   HERO-SLIDER (Swiper)
   ================================ */

.hero-slider {
  position: relative;
  width: 100%;
  overflow: hidden;

  --hero-max: 1760px;
  --hero-pad: 20px;
  --hero-bottom: clamp(48px, 6vw, 110px);

  --hero-edge: max(var(--hero-pad, 20px), calc((100vw - var(--hero-max, 1760px)) / 2));
}

/* Höhe wenn NICHT Fullscreen (per Variablen aus hero.php) */
.hero-slider:not(.is-fullscreen) { height: var(--hero-height-desktop, 480px) !important; }
.hero-slider:not(.is-fullscreen) .swiper { height: 100% !important; }
.hero-slider:not(.is-fullscreen) .swiper-wrapper { height: 100% !important; }
.hero-slider:not(.is-fullscreen) .swiper-slide { height: var(--hero-height-desktop, 480px) !important; }

/* Tablet */
@media (max-width: 1024px) {
  .hero-slider:not(.is-fullscreen) { height: var(--hero-height-tablet, 400px) !important; }
  .hero-slider:not(.is-fullscreen) .swiper { height: 100% !important; }
  .hero-slider:not(.is-fullscreen) .swiper-wrapper { height: 100% !important; }
  .hero-slider:not(.is-fullscreen) .swiper-slide { height: var(--hero-height-tablet, 400px) !important; }
}

/* Mobile */
@media (max-width: 767px) {
  .hero-slider:not(.is-fullscreen) { height: var(--hero-height-mobile, 320px) !important; }
  .hero-slider:not(.is-fullscreen) .swiper { height: 100% !important; }
  .hero-slider:not(.is-fullscreen) .swiper-wrapper { height: 100% !important; }
  .hero-slider:not(.is-fullscreen) .swiper-slide { height: var(--hero-height-mobile, 320px) !important; }

  .hero-slider { --hero-pad: 20px; }
}

/* Fullscreen-Mode */
.hero-slider.is-fullscreen { height: 100dvh !important; min-height: 100svh !important; }
.hero-slider.is-fullscreen .swiper,
.hero-slider.is-fullscreen .swiper-wrapper,
.hero-slider.is-fullscreen .swiper-slide,
.hero-slider.is-fullscreen .hero-media-wrapper { height: 100% !important; }

.hero-slider .swiper { height: 100%; }

/* =========================================================
   Full-bleed Wrapper nur wenn Grid-Background = BLEED
   ========================================================= */
.hero-slider.hero-bg-bleed > .grid {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Sicherheit: Swiper full width (nur bei BLEED nötig) */
.hero-slider.hero-bg-bleed .hero-swiper,
.hero-slider.hero-bg-bleed .swiper,
.hero-slider.hero-bg-bleed .swiper-wrapper,
.hero-slider.hero-bg-bleed .swiper-slide {
  width: 100% !important;
}

/* Slide = Positionierungs-Context */
.hero-slider .swiper-slide {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* =========================================================
   Overlay-Gradient: kein ::before, nur DOM-Layer
   ========================================================= */
.hero-slider .swiper-slide::before {
  content: none !important;
  display: none !important;
}

/* =========================================================
   Media-Layer (Bild & Video)
   ========================================================= */
.hero-media-wrapper {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;

  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform;
}

.hero-img,
.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;

  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Blur-Up (nur Bild) */
.hero-img.blurred {
  filter: blur(20px);
  transform: translateZ(0) scale(1.05);
  z-index: 0;
  opacity: 1;
  transition: opacity 0.35s ease;
  will-change: opacity, transform, filter;
}

.hero-img.full,
.hero-video {
  opacity: 0;
  z-index: 0;
  transition: opacity 0.35s ease;
  will-change: opacity;
}

.hero-img.full.loaded,
.hero-video.loaded { opacity: 1; }

/* Robust: Sobald Slide geladen ist, Blur weg */
.hero-slider .swiper-slide.is-loaded .hero-img.blurred {
  opacity: 0 !important;
}

/* Globaler S/W-Filter */
.hero-slider.is-bw .hero-img.full,
.hero-slider.is-bw .hero-img.blurred,
.hero-slider.is-bw .hero-video { filter: grayscale(100%); }

/* =========================================================
   Fade-Layer als echtes Element
   ========================================================= */
.hero-slider .hero-fade-layer{
  position:absolute;
  inset:0;
  z-index: 1;
  pointer-events:none;

  background: linear-gradient(
    to top,
    var(--hero-fade-from, rgba(0,0,0,.5)) 0%,
    rgba(0,0,0,0) var(--hero-fade-end, 60%)
  );

  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform;
}

/* ================================
   Bottom Edge SVG (Overlay)
   ================================ */
.hero-edge {
  position: absolute;
  bottom: var(--edge-offset, 0px);
  left: var(--edge-padding-left, 0px);
  right: var(--edge-padding-right, 0px);
  height: var(--edge-height, 120px);

  background-image: var(--edge-image);
  background-position: center bottom;
  background-repeat: var(--edge-repeat, no-repeat);
  background-size: 100% auto;

  z-index: 2;
  pointer-events: none;

  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Mobile edge vars */
@media (max-width: 767px) {
  .hero-edge {
    height: var(--edge-height-mobile, var(--edge-height, 120px));
    left: var(--edge-padding-left-mobile, var(--edge-padding-left, 0px));
    right: var(--edge-padding-right-mobile, var(--edge-padding-right, 0px));
  }
}

/* Edge auf Grid-Breite deckeln (Background bleibt full) */
.hero-slider.hero-edge--grid .hero-edge {
  background-image: none !important;
}

.hero-slider.hero-edge--grid .hero-edge::before {
  content: "";
  position: absolute;
  inset: 0;

  width: min(calc(100vw - (2 * var(--hero-pad, 20px))), var(--hero-max, 1760px));
  margin-left: auto;
  margin-right: auto;

  background-image: var(--edge-image);
  background-position: center bottom;
  background-repeat: var(--edge-repeat, no-repeat);
  background-size: 100% auto;
}

.hero-slider.hero-edge--grid .hero-edge[style*="--edge-repeat: repeat-x"]::before {
  background-size: auto 100%;
}

/* ================================
   Content (Base)
   ================================ */
.hero-content {
  position: relative;
  z-index: 3;
  text-align: center;
  color: var(--color-white, #fff);
  padding: 0 40px;
  max-width: 800px;
  margin: 0 auto;
}

/* Bottom-left Content (bündig wie Navi) */
.hero-slider .hero-content.hero-bottom-left {
  position: absolute;
  left: var(--hero-edge) !important;
  right: auto !important;
  bottom: calc(var(--hero-bottom) + var(--edge-height, 0px));
  z-index: 3;

  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
  text-align: left;

  display: block;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;

  transform: translateZ(0);
  backface-visibility: hidden;
}

.hero-slider .hero-content.hero-bottom-left .hero-inner {
  width: min(calc(100vw - (2 * var(--hero-pad, 20px))), var(--hero-max, 1760px)) !important;
  max-width: var(--hero-max, 1760px) !important;
  margin: 0 !important;
  padding: 0;
  box-sizing: border-box !important;
}

/* Typo für 2-zeilige Headline */
.hero-slider .hero-title-block {
  font-family: var(--font-mono, "Roboto Mono", monospace);
  text-transform: uppercase;
  line-height: 1.05;
  letter-spacing: 0;
  text-align: left;
}
.hero-slider .hero-title-block .hero-line {
  display: block;
  white-space: nowrap;
  text-align: left;
}
.hero-slider .hero-title-block .hero-name,
.hero-slider .hero-title-block .hero-model {
  font-weight: 100 !important;
  margin: 0;
}
.hero-slider .hero-title-block .hero-name {
  font-size: clamp(14px, 1.2vw, 20px);
  opacity: .98;
  margin-bottom: .35em;
}
.hero-slider .hero-title-block .hero-model {
  font-size: clamp(28px, 5vw, 72px);
}

/* Optischer Shift */
.hero-slider .hero-line.hero-model{
  --hero-model-optical-shift: -0.06em;
  position: relative;
  left: var(--hero-model-optical-shift);
}
@media (max-width: 768px){
  .hero-slider .hero-line.hero-model{
    --hero-model-optical-shift: -0.045em;
  }
}

/* Fließtext */
.hero-slider .hero-desc {
  margin-top: .9rem;
  max-width: 60ch;
  font-size: clamp(14px, 1.1vw, 18px);
  line-height: 1.35;
  opacity: .95;
}

/* ================================
   Hero Button (Panel-Variablen)
   ================================ */
.hero-slider .hero-content.hero-bottom-left a.hero-button {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  white-space: nowrap;

  text-decoration: none !important;

  background: var(--hero-btn-bg, #C3002F) !important;
  color: var(--hero-btn-color, #fff) !important;

  border-style: solid !important;
  border-width: var(--hero-btn-border-width, 0px) !important;
  border-color: var(--hero-btn-border-color, transparent) !important;
  border-radius: var(--hero-btn-radius, 0px) !important;

  font-size: var(--hero-btn-fs-d, 15px) !important;
  padding: var(--hero-btn-py-d, 12px) var(--hero-btn-px-d, 30px) !important;

  margin-top: 1rem !important;
}

.hero-slider .hero-content.hero-bottom-left a.hero-button .label,
.hero-slider .hero-content.hero-bottom-left a.hero-button i{
  text-decoration: none !important;
  color: inherit !important;
}

.hero-slider .hero-content.hero-bottom-left a.hero-button i {
  font-size: 0.75em;
  line-height: 1;
  opacity: .9;
  transition: transform .25s ease, opacity .25s ease;
}

/* Hover/Focus: EIN Unterstrich (über Label + Gap + Icon) */
.hero-slider .hero-content.hero-bottom-left a.hero-button:hover,
.hero-slider .hero-content.hero-bottom-left a.hero-button:focus-visible{
  background: var(--hero-btn-bg-hover, #000) !important;
  color: var(--hero-btn-color-hover, #fff) !important;
  border-color: var(--hero-btn-border-color-hover, var(--hero-btn-border-color, transparent)) !important;

  text-decoration: none !important;
}

/* Der Unterstrich sitzt auf einem inneren Flex-Container, der alles umfasst */
.hero-slider .hero-content.hero-bottom-left a.hero-button{
  position: relative;
}

.hero-slider .hero-content.hero-bottom-left a.hero-button::after{
  content: "";
  position: absolute;
  left: var(--hero-btn-px-d, 30px);
  right: var(--hero-btn-px-d, 30px);

  bottom: calc(var(--hero-btn-py-d, 12px) - 0px);
  height: 1px;
  background: currentColor;

  opacity: 0;
  transform: scaleX(0.98);
  transform-origin: left;
  transition: opacity .18s ease, transform .18s ease;
}

.hero-slider .hero-content.hero-bottom-left a.hero-button:hover::after,
.hero-slider .hero-content.hero-bottom-left a.hero-button:focus-visible::after{
  opacity: 1;
  transform: scaleX(1);
}

.hero-slider .hero-content.hero-bottom-left a.hero-button:hover i,
.hero-slider .hero-content.hero-bottom-left a.hero-button:focus-visible i{
  transform: translateX(6px);
  opacity: 1;
}

/* Tablet Button */
@media (max-width: 1024px) {
  .hero-slider .hero-content.hero-bottom-left a.hero-button {
    font-size: var(--hero-btn-fs-t, var(--hero-btn-fs-d, 15px)) !important;
    padding: var(--hero-btn-py-t, var(--hero-btn-py-d, 12px)) var(--hero-btn-px-t, var(--hero-btn-px-d, 30px)) !important;
  }

  .hero-slider .hero-content.hero-bottom-left a.hero-button::after{
    left: var(--hero-btn-px-t, var(--hero-btn-px-d, 30px));
    right: var(--hero-btn-px-t, var(--hero-btn-px-d, 30px));
    bottom: calc(var(--hero-btn-py-t, var(--hero-btn-py-d, 12px)) - 2px);
  }
}

/* Mobile Button + Position */
@media (max-width: 767px) {
  .hero-slider .hero-content.hero-bottom-left {
    bottom: calc(
      16px
      + var(--edge-height-mobile, 0px)
      + var(--hero-mobile-bottom-extra, 22px)
    );
  }

  .hero-slider .hero-content.hero-bottom-left a.hero-button {
    font-size: var(--hero-btn-fs-m, var(--hero-btn-fs-d, 15px)) !important;
    padding: var(--hero-btn-py-m, var(--hero-btn-py-d, 12px)) var(--hero-btn-px-m, var(--hero-btn-px-d, 30px)) !important;
  }

  .hero-slider .hero-content.hero-bottom-left a.hero-button::after{
    left: var(--hero-btn-px-m, var(--hero-btn-px-d, 30px));
    right: var(--hero-btn-px-m, var(--hero-btn-px-d, 30px));
    bottom: calc(var(--hero-btn-py-m, var(--hero-btn-py-d, 12px)) - 2px);
  }
}

/* ================================
   Pagination / Bullets (Panel-Variablen)
   ================================ */
.hero-slider .hero-swiper--scoped .hero-pagination--scoped{
  position:absolute;
  left:0;
  right:0;

  display:flex;
  justify-content:center;
  align-items:center;

  gap: var(--hero-bullet-gap, 8px);
  bottom: var(--hero-pagination-bottom, 40px);

  z-index: 50;

  pointer-events: none;
  transform: translateZ(0);
}

.hero-slider .hero-swiper--scoped .hero-pagination--scoped .swiper-pagination-bullet{
  width: var(--hero-bullet-size, 10px);
  height: var(--hero-bullet-size, 10px);
  border-radius: var(--hero-bullet-radius, 999px);

  background: var(--hero-bullet-color, rgba(255,255,255,.4));
  opacity: 1;

  transition: transform .2s ease, background-color .2s ease, opacity .2s ease;

  pointer-events: auto;
  position: relative;
}

.hero-slider .hero-swiper--scoped .hero-pagination--scoped .swiper-pagination-bullet-active{
  background: var(--hero-bullet-color-active, #fff);
  transform: scale(var(--hero-bullet-active-scale, 1.2));
}

@media (max-width: 768px){
  .hero-slider .hero-content.hero-bottom-left{
    padding-bottom: calc(var(--hero-gutter, 20px) + var(--hero-mobile-bottom-extra, 22px));
  }

  .hero-slider .hero-swiper--scoped .hero-pagination--scoped{
    bottom: var(--hero-pagination-bottom-mobile, var(--hero-pagination-bottom, 40px));
    gap: var(--hero-bullet-gap-mobile, var(--hero-bullet-gap, 8px));
  }

  .hero-slider .hero-swiper--scoped .hero-pagination--scoped .swiper-pagination-bullet{
    width: var(--hero-bullet-size-mobile, var(--hero-bullet-size, 10px));
    height: var(--hero-bullet-size-mobile, var(--hero-bullet-size, 10px));
  }

  .hero-slider .hero-swiper--scoped .hero-pagination--scoped .swiper-pagination-bullet::after{
    content:"";
    position:absolute;
    inset:-8px;
  }
}

/* ================================
   Parallax
   ================================ */
.hero-slider [data-parallax-layer] {
  will-change: transform;
  transform: translate3d(0,0,0);
  transition: transform 0.08s linear;
}

@media (prefers-reduced-motion: reduce) {
  .hero-slider [data-parallax-layer] { transform: none !important; transition: none !important; }
}




/* ================================
   INTRO / INFO BLOCK + ICON SLIDER
================================ */

/* Section */
.intro-block {
  padding-top: 0px;
  /* KEIN text-align hier – steuern wir pro .intro-inner */
}

/* Inner-Wrapper steuert Breite & Ausrichtung */
.intro-block .intro-inner {
  width: var(--intro-width, 100%);
}

/* Modul-Ausrichtung über Margins */
.intro-block .intro-inner.align-left   { margin-right: auto; margin-left: 0; }
.intro-block .intro-inner.align-center { margin-left: auto; margin-right: auto; }
.intro-block .intro-inner.align-right  { margin-left: auto; margin-right: 0; }

/* Textausrichtung – höhere Spezifität, damit es sicher greift */
.intro-block .intro-inner.ta-left   { text-align: left; }
.intro-block .intro-inner.ta-center { text-align: center; }
.intro-block .intro-inner.ta-right  { text-align: right; }

/* Farbe & Typo via Custom-Props (falls im Panel gesetzt) */
.intro-block .subheadline {
  font-size: 15px;
  
  font-family: var(--font-sans);
  color: var(--color-red);
  margin-bottom: 30px;
}

.intro-block .headline {
  font-family: var(--font-headline);
  font-size: var(--intro-headline-size, var(--h2-size));
  color: var(--intro-headline-color, var(--color-black));
  margin-bottom: 1rem;
}

/* .text: zentrierende Margins nur bei center; bei left/right kein auto-centern */
.intro-block .intro-inner.ta-center .text,
.intro-block .intro-inner.ta-left .text,
.intro-block .intro-inner.ta-right .text {
  margin: 0;
}


.intro-block .text {

  max-width: 700px;
  font-family: var(--font-sans);
  font-size: var(--intro-body-size, var(--body-size));
  color: var(--intro-text-color, var(--color-text));
}

/* Wenn kein Text vorhanden: etwas mehr vertikaler Raum */
.intro-block.no-text {
  padding: 6rem 0;
}

/* Icon-Slider */
.icon-swiper {
  margin-top: 4rem;
  padding: 0 !important;
}

.icon-swiper .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .15rem !important;
  text-align: center;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  color: var(--color-black);
}

.icon-swiper i {
  font-size: var(--h3-size);
  color: var(--color-yellow);
}

.icon-title {
  color: var(--color-black);
  text-decoration: none;
  position: relative;
  display: inline-block;
  padding-bottom: 3px;
}

/* Mobile: optional 100% Breite erzwingen */
@media (max-width: 768px) {
  .intro-block .intro-inner.mobile-full {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .intro-block .text {
    max-width: 100%;
  }
}

/* ================================
   INTRO — SEO (optional global CSS)
   Hinweis: Der Block funktioniert auch ohne diesen CSS,
   weil die Kernstyles inline im Snippet stehen.
================================ */

.intro-seo-block .seo-headline,
.intro-seo-block .seo-text {
  /* falls du global etwas vereinheitlichen willst */
   font-family: var(--font-headline);
}

.intro-seo-block[data-merged="1"] .seo-text {
  /* Merge-Mode (visuell ein Block) – als Backup */
}

@media (max-width: 768px) {
  .intro-seo-block .intro-seo-inner.mobile-full {
    width: 100% !important;
  }
}



/* ================================
   Modul 4 – Highlight Section + Column-Slider
   ================================ */

.highlight-header-btn {
  font-family: var(--font-headline, 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  /*text-transform: uppercase;*/
}

.highlight-section {
  position: relative;
  overflow: hidden;
  z-index: 0;
}

/* Topline (Line-Height jetzt unitless via --lh-topline inline) */
.highlight-topline {
  font-family: var(--font-mono);
  font-weight: 500;
  line-height: var(--lh-topline, 1.2);
  display: block;
  opacity: .95;
}

/* Überschrift (Line-Height unitless via --lh-section inline) */
.highlight-headline {
  font-family: var(--font-headline);
  text-align: left;
  margin-left: 0;
  margin-bottom: 3rem;
}

/* Grunge */
.highlight-section .grunge-top,
.highlight-section .grunge-bottom {
  background-color: var(--color-white);
  position: absolute;
  left: 0;
  width: 100%;
  display: block;
  z-index: 1;
  pointer-events: none;
}
.highlight-section .grunge-top { top: 0; }
.highlight-section .grunge-bottom { bottom: 0; }

/* Rahmen-Wrapper */
.column-slider-frame {
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 0 auto;
  background: transparent;
}
.column-slider-frame::before,
.column-slider-frame::after { content: none; }

/* Swiper */
.column-slider {
  position: relative;
  width: 100%;
  background: transparent;
  z-index: 2;
}

/* Card */
.column-slider .swiper-slide.column-slide {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--card-bg, #fff);
  border: 1px solid var(--card-bc, var(--divider, #ccc));
  border-radius: var(--highlight-card-radius, 8px);
  overflow: hidden;
  padding: 0;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  height: 400px; /* runtime via inline überschrieben */
  transition: border-color .2s ease, box-shadow .2s ease;
}

/* Bild-Wrapper */
.column-slider .column-slide-media {
  position: relative;
  display: block;
  overflow: hidden;
  border-top-left-radius: var(--highlight-card-radius, 8px);
  border-top-right-radius: var(--highlight-card-radius, 8px);
  line-height: 0;
}

/* Bild */
.column-slider .column-slide-image {
  display: block;
  width: 100%;
  height: var(--img-h);
  object-fit: cover;
  transform: scale(1);
  transition: transform .35s ease;
  will-change: transform;
}

/* Zoom-Effekt */
.column-slider .column-slide:hover .column-slide-image,
.column-slider .column-slide-media:focus-visible .column-slide-image {
  transform: scale(1.04);
}

/* Textbereich – line-height unitless via --lh-body inline */
.highlight-section .column-slide-text { line-height: var(--lh-body, 1.5); }
.highlight-section .column-slide-text p {
  font-size: inherit;
  line-height: inherit;
  margin: var(--space-ht, 10px) 0 var(--space-tb, 15px);
}
@media (max-width: 1023px){
  .highlight-section .column-slide-text { padding: var(--card-pad-t, 18px); }
}
@media (max-width: 767px) {
  .highlight-section .column-slide-text {
    --space-ht-effective: var(--space-ht-mobile, 8px);
    --space-tb-effective: var(--space-tb-mobile, 12px);
    padding: var(--card-pad-m, 16px);
  }
  .highlight-section .column-slide-text p {
    margin: var(--space-ht-mobile, 8px) 0 var(--space-tb-mobile, 12px);
  }
}

/* Button */
.column-slide-button {
  display: inline-block;
  padding: 8px 20px;
  text-decoration: none;
  font-family: var(--font-sans, 'Roboto Sans');
  /*text-transform: uppercase;*/
}
.column-slide-button:focus-visible {
  outline: 2px solid rgba(0,0,0,.3);
  outline-offset: 2px;
}

/* Controls */
.highlight-controls {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  margin-top: 22px;
  gap: 12px;
  z-index: 7;
}

/* Bullets rechteckig */
.highlight-controls .swiper-pagination { position: relative; justify-self: center; text-align: center; }
.highlight-controls .swiper-pagination-bullet {
  width: 6px; height: 6px; background-color: rgba(0,0,0,0.5);
  opacity: .5; border-radius: 15; margin: 0 4px !important;
}
.highlight-controls .swiper-pagination-bullet-active { background-color: var(--color-black); opacity: 1; }

/* Pfeile */
.highlight-prev, .highlight-next {
  appearance: none; border: none; background: transparent; font: inherit; line-height: 1; cursor: pointer;
  padding: 0; height: 44px; width: 44px; display: grid; place-items: center; color: var(--color-black); opacity: .85;
  transition: transform .2s ease, opacity .2s ease;
}
.highlight-prev { justify-self: start; }
.highlight-next { justify-self: end; }
.highlight-prev:hover, .highlight-next:hover { opacity: 1; }
.highlight-prev i, .highlight-next i { font-size: 40px; }
@media (max-width: 767px){
  .highlight-prev i, .highlight-next i { font-size: 30px; }
}

/* Kleine Pfeile am Card-Button – optional */
.column-slider [data-card-arrows="on"] .column-slide-button i.fa-arrow-right {
  display: inline-block; font-size: 0.95em; line-height: 1; margin-left: .45em;
  transform: translateX(0); transition: transform .2s ease, opacity .2s ease; opacity: .9;
}
.column-slider [data-card-arrows="on"] .column-slide-button:hover i.fa-arrow-right {
  transform: translateX(3px); opacity: 1;
}

/* Panel-Top-Right Info im Content-Tab */
.k-field-name-overview .k-field-info { display: flex; justify-content: flex-end; margin-top: -2px; }
.kzt-overview-button {
  display: inline-block; padding: 7px 12px; border-radius: 8px; text-decoration: none;
  border: 1px solid var(--color-border, #ddd); background: var(--color-background, #fff); font-weight: 600; line-height: 1;
}
.kzt-overview-button:hover { border-color: var(--color-primary-500, #000); color: var(--color-primary-500, #000); }




/* ================================
   Modul 5 – Events Section + Column-Slider
   ================================ */

/* Section (Padding per module-spacing Variablen) */
.events-slider {
  position: relative;
  overflow: hidden;
  z-index: 0;
  padding-top: var(--mod-pt-desktop, 60px);
  padding-bottom: var(--mod-pb-desktop, 60px);
}
@media (max-width: 1023px) {
  .events-slider {
    padding-top: var(--mod-pt-tablet, 40px);
    padding-bottom: var(--mod-pb-tablet, 40px);
  }
}
@media (max-width: 767px) {
  .events-slider {
    padding-top: var(--mod-pt-mobile, 24px);
    padding-bottom: var(--mod-pb-mobile, 24px);
  }
}

/* Grunge-Grafiken */
.events-slider .grunge-top,
.events-slider .grunge-bottom {
  background-color: var(--color-white);
  position: absolute;
  left: 0;
  width: 100%;
  display: block;
  z-index: 1;
  pointer-events: none;
}
.events-slider .grunge-top { top: 0; }
.events-slider .grunge-bottom { bottom: 0; }

/* Swiper-Wrapper */
.events-swiper {
  position: relative;
  z-index: 2;
  width: 100%;
}

/* Slides (Fallbacks – Details kommen scoped aus PHP) */
.event-slide {
  position: relative;
  height: 600px; /* Fallback */
  background-size: cover;
  background-position: center;
  border-radius: 0px; /* Fallback */
  overflow: hidden;
  color: var(--color-white);
  display: flex;
  align-items: flex-end;
}
.event-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(30,30,30,0.75), transparent);
  z-index: 1;
}
.event-content {
  position: relative;
  z-index: 2;
  font-family: 'Roboto', sans-serif;
}
.event-content h3 {
  margin: 0 0 10px;
  color: var(--color-white);
 
}
.event-content p {
  margin: 0;
  color: var(--color-white);
}

/* Header: Topline + Headline + Button */
.events-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin: 0 auto var(--events-header-gap, 24px);
  flex-wrap: wrap;
}
@media (max-width: 767px) {
  .events-header {
    gap: 16px;
    margin: 0 auto var(--events-header-gap, 16px);
  }
}
.events-header-left { min-width: 0; max-width: 100%; }
.events-header.align-left .events-header-left   { text-align: left;  margin-right: auto; margin-left: 0; }
.events-header.align-center .events-header-left { text-align: center;margin-left: auto; margin-right: auto; }
.events-header.align-right .events-header-left  { text-align: right; margin-left: auto; margin-right: 0; }

.events-topline-wrap { display: block; margin-bottom: 0; }
.events-topline,
.events-topline-prefix {
  font-family: var(--font-mono, 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  line-height: 1.2; display: inline-block; vertical-align: baseline;
}
.events-topline-prefix { opacity: .75; }

.events-title {
  font-family: var(--font-headline, 'Panton Rust Black');
  color: var(--color-black);
  /* feste line-height hier optional entfernen – wird scoped gesetzt */
  /* line-height: 1.1; */
  margin: 0;
}

/* Header-Button */
.events-button {
  padding: 0px 0px!important;
  /*border: 1px solid #303030;*/
  color: var(--color-black);
  text-decoration: none;
  transition: all .25s ease;
  font-size: 18px!important;
  margin-left: auto;
  white-space: nowrap;
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  gap: .5em;
  font-family: var(--font-headline, 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  /*text-transform: uppercase;*/
  /*letter-spacing: 0.1em;*/
}
.events-button:hover { background: none; color: var(--color-black); }

/* Buttons in Karten – Basis (Details via scoped CSS) */
.kzt-module.events-slider .event-card-btn {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  border: 1px solid transparent;
  border-radius: 9999px;
  line-height: 1;
  text-decoration: none;
  font-size: 12px; /* Fallback */
  font-family: var(--font-sans, 'Roboto', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  /*text-transform: uppercase;*/
}

/* Varianten */
.kzt-module.events-slider .event-card-btn[data-variant="secondary"] { background:#fff; color:#000; }
.kzt-module.events-slider .event-card-btn[data-variant="outline"]    { background:transparent; border-color: currentColor; }
.kzt-module.events-slider .event-card-btn[data-variant="ghost"]      { background:transparent; }

/* Controls */
.events-controls {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  margin-top: 30px;
  gap: 12px;
}
.events-controls .swiper-pagination {
  position: relative;
  justify-self: center;
  text-align: center;
}
.events-controls .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0.5;
  border-radius: 15;
  margin: 0 4px !important;
}
.events-controls .swiper-pagination-bullet-active {
  background-color: var(--color-black);
  opacity: 1;
}
.events-prev,
.events-next {
  appearance: none;
  border: none;
  background: transparent;
  font: inherit;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  height: 44px;
  width: 44px;
  display: grid;
  place-items: center;
  color: var(--color-black);
  opacity: 0.85;
  transition: transform .2s ease, opacity .2s ease;
}
.events-prev { justify-self: start; }
.events-next { justify-self: end; }
.events-prev:hover,
.events-next:hover { opacity: 1; transform: scale(1.04); }
.events-prev i,
.events-next i { font-size: 36px; display: block; }

@media (max-width: 767px) {
  .events-prev i, .events-next i { font-size: 30px; }
  .events-button { margin-top: 8px; }
}



/* ===================================
   Accordion
   =================================== */

.accordion-content strong {
  font-family: 'HelveticaNowDisplay-Bold' !important;
  color: inherit !important;
}

.accordion-section{
  background: var(--acc-bg, var(--color-yellow, #FFD00A));
  padding-top: var(--acc-pt-d, 120px);
  padding-bottom: var(--acc-pb-d, 120px);
  text-align: left;
  position: relative;
  overflow: hidden;
}

@media (max-width:1024px){
  .accordion-section{
    padding-top: var(--acc-pt-t, 90px);
    padding-bottom: var(--acc-pb-t, 90px);
  }
}
@media (max-width:640px){
  .accordion-section{
    padding-top: var(--acc-pt-m, 60px);
    padding-bottom: var(--acc-pb-m, 60px);
  }
}

/* Grunge */
.accordion-section .grunge-top,
.accordion-section .grunge-bottom{
  background: var(--acc-gr-bg, var(--color-white, #fff));
  position: absolute;
  left: 0;
  width: 100%;
  height: auto;
  display: block;
  z-index: 0;
  pointer-events: none;
}
.accordion-section .grunge-top{ top: 0; }
.accordion-section .grunge-bottom{ bottom: 0; }

/* Layout */
.accordion-layout{
  position: relative;
  z-index: 2;
}

.accordion-layout.has-side-text{
  display: grid;
  grid-template-columns: minmax(0, var(--acc-split-text-col-d, 50%)) minmax(0, var(--acc-split-acc-col-d, 50%));
  gap: var(--acc-split-gap-d, 60px);
}

.accordion-layout.has-side-text.side-right{
  grid-template-columns: minmax(0, var(--acc-split-acc-col-d, 50%)) minmax(0, var(--acc-split-text-col-d, 50%));
}

.accordion-layout.has-side-text.valign-top{ align-items: start; }
.accordion-layout.has-side-text.valign-center{ align-items: center; }
.accordion-layout.has-side-text.valign-bottom{ align-items: end; }

.accordion-main,
.accordion-side{
  min-width: 0;
}

/* Im Split-Modus ganze Spalte nutzen */
.accordion-layout.has-side-text .accordion-box{
  width: 100%;
  max-width: none;
  margin: 0;
}

/* Side Text */
.accordion-side-headline{
  margin: 0 0 1rem;
  font-family: var(--font-headline, inherit);
  font-size: var(--acc-side-head-d, 24px);
  line-height: var(--acc-side-head-lh-d, 1.15);
  color: var(--acc-side-head-color, var(--color-white, #fff));
}

.accordion-side-text{
  font-size: var(--acc-side-body-d, 22px);
  line-height: var(--acc-side-body-lh-d, 1.45);
  color: var(--acc-side-text-color, rgba(255,255,255,.82));
}

.accordion-side-text p,
.accordion-side-text li,
.accordion-side-text a,
.accordion-side-text strong,
.accordion-side-text em,
.accordion-side-text blockquote,
.accordion-side-text figcaption{
  color: inherit;
}

.accordion-side-text a{
  color: var(--acc-side-link-color, var(--color-white, #fff));
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.accordion-side-text > *:first-child{ margin-top: 0; }
.accordion-side-text > *:last-child{ margin-bottom: 0; }

/* Headline */
.accordion-headline{
  font-size: var(--acc-head-d, var(--h3-size, 40px));
  line-height: var(--acc-head-lh-d, 1.1);
  font-family: var(--font-headline, inherit);
  color: var(--acc-head-color, var(--color-black, #000));
  margin: 0 0 2rem;
}

/* Box */
.accordion-box{
  background: var(--acc-box-bg, transparent);
  border-radius: var(--acc-box-radius, 20px);
  padding: var(--acc-box-pad, 30px);
  width: var(--acc-box-w, 100%);
  max-width: var(--acc-box-maxw, 1080px);
  margin: var(--acc-box-margin, 0 auto);
}

/* Accordion Item */
.accordion-box details.accordion-item{
  background: var(--acc-item-bg, var(--color-white, #fff));
  border: var(--acc-border-w, 1px) solid var(--acc-border-color, #ddd);
  border-radius: var(--acc-item-radius, 20px);
  overflow: hidden;
  margin: 0;
}

.accordion-box details.accordion-item + details.accordion-item{
  margin-top: var(--acc-item-gap, 14px);
}

/* Marker kill */
.accordion-box summary::-webkit-details-marker{
  display: none;
}
.accordion-box summary::marker{
  content: "";
}

/* Header */
.accordion-box summary.accordion-header{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  padding: 15px 20px;
  background: transparent;

  font-size: var(--acc-title-d, var(--h4-size, 18px));
  line-height: var(--acc-title-lh-d, 1.2);
  color: var(--acc-title-color, var(--color-black, #000));
}

/* Title */
.accordion-title{
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  font-family: var(--font-sans);
  color: inherit;
}

.accordion-box details[open] .accordion-title,
.accordion-box .accordion-title:hover {
	text-decoration: underline;
}

.accordion-box .accordion-title:hover,
.accordion-box details[open] .accordion-title{
  color: inherit;
}

.accordion-title p,
.accordion-title *{
  margin: 0 !important;
}

/* Chevron */
.accordion-chevron{
  width: var(--acc-chev-size, 34px);
  height: var(--acc-chev-size, 34px);
  flex: 0 0 var(--acc-chev-size, 34px);
  margin-left: auto;

  background-color: var(--acc-chev-color, var(--color-black, #000));

  -webkit-mask-image: var(--acc-chev, url('/assets/img/chevron-up.svg'));
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;

  mask-image: var(--acc-chev, url('/assets/img/chevron-up.svg'));
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;

  transition: transform .2s ease;
}

details[open] > summary.accordion-header .accordion-chevron{
  transform: rotate(180deg);
}

/* Content */
.accordion-content{
  padding: 0 20px 20px;
  margin-top: 0;
  background: transparent;

  font-size: var(--acc-body-d, 16px);
  line-height: var(--acc-body-lh-d, 1.55);
  color: var(--acc-body-color, var(--color-black, #000));

  animation: none !important;
  transition: none !important;
}

.accordion-content p,
.accordion-content li,
.accordion-content a,
.accordion-content strong,
.accordion-content em,
.accordion-content blockquote,
.accordion-content figcaption{
  color: inherit;
}

.accordion-content > *:first-child{ margin-top: 0; }
.accordion-content > *:last-child{ margin-bottom: 0; }

.accordion-content ul,
.accordion-content ol{
  padding-left: 1.2em;
}

.accordion-content li + li{
  margin-top: 0.35em;
}

/* Tablet */
@media (max-width:1024px){
  .accordion-layout.has-side-text{
    grid-template-columns: 1fr;
    gap: var(--acc-split-gap-t, 40px);
  }

  .accordion-headline{
    font-size: var(--acc-head-t, var(--h3-size, 36px));
    line-height: var(--acc-head-lh-t, 1.1);
  }

  .accordion-box summary.accordion-header{
    font-size: var(--acc-title-t, var(--h4-size, 18px));
    line-height: var(--acc-title-lh-t, 1.2);
  }

  .accordion-content{
    font-size: var(--acc-body-t, 16px);
    line-height: var(--acc-body-lh-t, 1.55);
  }

  .accordion-side-headline{
    font-size: var(--acc-side-head-t, 22px);
    line-height: var(--acc-side-head-lh-t, 1.15);
  }

  .accordion-side-text{
    font-size: var(--acc-side-body-t, 19px);
    line-height: var(--acc-side-body-lh-t, 1.45);
  }
}

/* Mobile */
@media (max-width:640px){
  .accordion-layout.has-side-text{
    gap: var(--acc-split-gap-m, 24px);
  }

  .accordion-headline{
    font-size: var(--acc-head-m, var(--h3-size, 30px));
    line-height: var(--acc-head-lh-m, 1.15);
  }

  .accordion-box{
    padding: 0;
  }

  .accordion-box summary.accordion-header{
    padding: 14px 16px;
    font-size: var(--acc-title-m, var(--h4-size, 17px));
    line-height: var(--acc-title-lh-m, 1.25);
  }

  .accordion-content{
    padding: 0 16px 16px;
    font-size: var(--acc-body-m, 15px);
    line-height: var(--acc-body-lh-m, 1.6);
  }

  .accordion-side-headline{
    font-size: var(--acc-side-head-m, 20px);
    line-height: var(--acc-side-head-lh-m, 1.2);
  }

  .accordion-side-text{
    font-size: var(--acc-side-body-m, 17px);
    line-height: var(--acc-side-body-lh-m, 1.55);
  }
}


/* ===================================
   Verkaufsstände Accordion
   =================================== */

.sales-accordion-section{
  background: var(--sales-bg, var(--color-bg, #EEE9E6));
  padding-top: var(--sales-pt-d, 120px);
  padding-bottom: var(--sales-pb-d, 120px);
  position: relative;
  overflow: hidden;
}

@media (max-width:1024px){
  .sales-accordion-section{
    padding-top: var(--sales-pt-t, 90px);
    padding-bottom: var(--sales-pb-t, 90px);
  }
}
@media (max-width:640px){
  .sales-accordion-section{
    padding-top: var(--sales-pt-m, 60px);
    padding-bottom: var(--sales-pb-m, 60px);
  }
}

/* Grunge */
.sales-accordion-section .grunge-top,
.sales-accordion-section .grunge-bottom{
  background: var(--sales-gr-bg, var(--color-white, #fff));
  position: absolute;
  left: 0;
  width: 100%;
  height: auto;
  display: block;
  z-index: 0;
  pointer-events: none;
}
.sales-accordion-section .grunge-top{ top: 0; }
.sales-accordion-section .grunge-bottom{ bottom: 0; }


/* Underline  */
.sales-accordion-title{
  text-decoration: none;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* Hover */
.sales-accordion-header:hover .sales-accordion-title{
  text-decoration: underline;
}

/* Open State */
.sales-accordion-item[open] .sales-accordion-title{
  text-decoration: underline;
}

/* Box */
.sales-accordion-box{
  position: relative;
  z-index: 2;
  width: var(--sales-box-w, 100%);
  max-width: var(--sales-box-maxw, 1460px);
  margin: var(--sales-box-margin, 0 auto);
  background: var(--sales-box-bg, transparent);
  border-radius: var(--sales-box-radius, 0);
  padding: var(--sales-box-pad-d, 0);
}

@media (max-width:1024px){
  .sales-accordion-box{
    padding: var(--sales-box-pad-t, 0);
  }
}
@media (max-width:640px){
  .sales-accordion-box{
    padding: var(--sales-box-pad-m, 0);
  }

  .sales-accordion-section[style*="--sales-mobile-full-width: 1"] .sales-accordion-box{
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
}

/* Intro */
.sales-accordion-eyebrow{
  margin: 0 0 22px;
  color: var(--sales-eyebrow-color, var(--color-primary, #0B5A22));
  font-size: 15px;
  line-height: 1.2;
}

.sales-accordion-headline{
  margin: 0 0 34px;
  color: var(--sales-head-color, var(--color-primary, #0B5A22));
  font-family: var(--font-headline, inherit);
  font-size: var(--sales-head-d, 72px);
  line-height: var(--sales-head-lh-d, 1.05);
  text-wrap: balance;
}

.sales-accordion-intro{
  margin: 0 0 56px;
  color: var(--sales-text-color, var(--color-primary, #0B5A22));
  font-size: var(--sales-intro-d, 28px);
  line-height: var(--sales-intro-lh-d, 1.35);
  max-width: 1180px;
}

.sales-accordion-intro p,
.sales-accordion-intro li,
.sales-accordion-intro a,
.sales-accordion-intro strong,
.sales-accordion-intro em{
  color: inherit;
}

.sales-accordion-intro > *:first-child{ margin-top: 0; }
.sales-accordion-intro > *:last-child{ margin-bottom: 0; }

/* List */
.sales-accordion-list{
  display: flex;
  flex-direction: column;
  gap: var(--sales-item-gap, 14px);
}

/* Item */
.sales-accordion-item{
  margin: 0;
  background: var(--sales-item-bg, var(--color-white, #fff));
  border: var(--sales-border-w, 1px) solid var(--sales-border-color, #d8d3cf);
  border-radius: var(--sales-item-radius, 20px);
  overflow: hidden;
}

.sales-accordion-item summary::-webkit-details-marker{ display: none; }
.sales-accordion-item summary::marker{ content: ""; }

.sales-accordion-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  cursor: pointer;
  padding:
    var(--sales-item-pad-y-d, 18px)
    var(--sales-item-pad-x-d, 28px);
  background: transparent;
}

.sales-accordion-title{
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: var(--sales-title-color, var(--color-primary, #0B5A22));
  font-family: var(--font-headline, inherit);
  font-size: var(--sales-title-d, 24px);
  line-height: var(--sales-title-lh-d, 1.15);
}

.sales-accordion-chevron{
  width: var(--sales-chev-size, 28px);
  height: var(--sales-chev-size, 28px);
  flex: 0 0 var(--sales-chev-size, 28px);
  margin-left: auto;
  background-color: var(--sales-chev-color, var(--color-primary, #0B5A22));

  -webkit-mask-image: var(--sales-chev, url('/assets/img/chevron-up.svg'));
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;

  mask-image: var(--sales-chev, url('/assets/img/chevron-up.svg'));
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;

  transition: transform .2s ease;
}

.sales-accordion-item[open] > .sales-accordion-header .sales-accordion-chevron{
  transform: rotate(180deg);
}

/* Content */
.sales-accordion-content{
  padding:
    6px
    var(--sales-item-pad-x-d, 28px)
    var(--sales-item-pad-y-d, 18px);
  background: transparent;
  color: var(--sales-content-color, var(--color-black, #111));
  font-size: var(--sales-content-d, 18px);
  line-height: var(--sales-content-lh-d, 1.45);
}

.sales-location-list{
  display: flex;
  flex-direction: column;
}

.sales-location-item{
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 40px;
  padding: 22px 0;
  font-family: var(--font-regular, inherit);
}

.sales-location-item + .sales-location-item{
  margin-top: 10px;
  padding-top: 26px;
}

.sales-location-item + .sales-location-item::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--sales-border-color, #d8d3cf);
}

.sales-location-col{
  min-width: 0;
}

.sales-location-heading{
  margin: 0 0 8px;
  font-family: var(--font-bold, inherit);
  color: var(--sales-content-color, var(--color-black, #111));
}

.sales-location-address,
.sales-location-hours-text{
  font-family: var(--font-regular, inherit);
  color: var(--sales-content-color, var(--color-black, #111));
  white-space: normal;
}

.sales-meta-row{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--sales-payment-color, var(--color-black, #111));
}

.sales-meta-row + .sales-meta-row{
  margin-top: 0px;
}

@media (max-width:640px){
  .sales-location-meta{
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .sales-meta-row{
    gap: 8px;
    align-items: center;
    line-height: 1.2;
  }

  .sales-meta-row + .sales-meta-row{
    margin-top: 0;
  }

  .sales-meta-icon{
    margin-top: 0;
    font-size: 15px;
    width: 15px;
    min-width: 15px;
  }
}

.sales-meta-icon{
  width: 18px;
  min-width: 18px;
  margin-top: 0.15em;
  font-size: 18px;
  line-height: 1;
}

.sales-meta-status.is-open{
  color: var(--sales-status-open, #1E7A35);
}

.sales-meta-status.is-closed{
  color: var(--sales-status-closed, #E4062D);
}

/* Tablet */
@media (max-width:1024px){
  .sales-accordion-headline{
    font-size: var(--sales-head-t, 56px);
    line-height: var(--sales-head-lh-t, 1.08);
  }

  .sales-accordion-intro{
    margin-bottom: 40px;
    font-size: var(--sales-intro-t, 24px);
    line-height: var(--sales-intro-lh-t, 1.35);
  }

  .sales-accordion-header{
    padding:
      var(--sales-item-pad-y-t, 16px)
      var(--sales-item-pad-x-t, 24px);
  }

  .sales-accordion-title{
    font-size: var(--sales-title-t, 22px);
    line-height: var(--sales-title-lh-t, 1.15);
  }

  .sales-accordion-content{
    padding:
      4px
      var(--sales-item-pad-x-t, 24px)
      var(--sales-item-pad-y-t, 16px);
    font-size: var(--sales-content-t, 17px);
    line-height: var(--sales-content-lh-t, 1.45);
  }

  .sales-location-item{
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }

  .sales-location-meta{
    grid-column: 1 / -1;
  }
}

/* Mobile */
@media (max-width:640px){
  .sales-accordion-eyebrow{
    margin-bottom: 16px;
  }

  .sales-accordion-headline{
    margin-bottom: 22px;
    font-size: var(--sales-head-m, 40px);
    line-height: var(--sales-head-lh-m, 1.1);
  }

  .sales-accordion-intro{
    margin-bottom: 28px;
    font-size: var(--sales-intro-m, 20px);
    line-height: var(--sales-intro-lh-m, 1.4);
  }

  .sales-accordion-header{
    padding:
      var(--sales-item-pad-y-m, 14px)
      var(--sales-item-pad-x-m, 16px);
  }

  .sales-accordion-title{
    font-size: var(--sales-title-m, 20px);
    line-height: var(--sales-title-lh-m, 1.2);
  }

  .sales-accordion-content{
    padding:
      2px
      var(--sales-item-pad-x-m, 16px)
      var(--sales-item-pad-y-m, 14px);
    font-size: var(--sales-content-m, 16px);
    line-height: var(--sales-content-lh-m, 1.5);
  }

  .sales-location-item{
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 16px 0;
  }

  .sales-meta-icon{
    font-size: 16px;
    width: 16px;
    min-width: 16px;
  }
}

/* =========================================================
   Marquee Module
   ========================================================= */

.marquee-section{
  position: relative;
  padding-top: var(--mq-space-top-d, 120px) !important;
  padding-bottom: var(--mq-space-bot-d, 120px) !important;
}

@media (max-width: 1024px){
  .marquee-section{
    padding-top: var(--mq-space-top-t, 90px) !important;
    padding-bottom: var(--mq-space-bot-t, 90px) !important;
  }
}

@media (max-width: 640px){
  .marquee-section{
    padding-top: var(--mq-space-top-m, 60px) !important;
    padding-bottom: var(--mq-space-bot-m, 60px) !important;
  }
}

/* Full-bleed BG bewusst im inneren Shell-Container */
.marquee-shell{
  background: var(--mq-bg, #F5F5F5);
  color: var(--mq-text, #111111);
  width: 100%;
}

.marquee-section.has-border-top .marquee-shell{
  border-top: 1px solid var(--mq-border, #DDDDDD);
}

.marquee-section.has-border-bottom .marquee-shell{
  border-bottom: 1px solid var(--mq-border, #DDDDDD);
}

.marquee-wrap{
  position: relative;
}

.marquee-viewport{
  position: relative;
  overflow: hidden;
  min-height: var(--mq-height-d, 72px);
  display: flex;
  align-items: center;
}

.marquee-track{
  display: flex;
  align-items: center;
  width: max-content;
  min-width: max-content;
  gap: var(--mq-gap-d, 28px);
  will-change: transform;
  animation-name: kzt-marquee-scroll-left;
  animation-duration: var(--mq-duration-d, 26s);
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.marquee-section.is-right .marquee-track{
  animation-name: kzt-marquee-scroll-right;
}

.marquee-section.is-hover-pause:hover .marquee-track{
  animation-play-state: paused;
}

.marquee-group{
  display: flex;
  align-items: center;
  gap: var(--mq-gap-d, 28px);
  flex: 0 0 auto;
  min-width: max-content;
}

.marquee-item,
.marquee-separator{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: var(--mq-height-d, 72px);
}

.marquee-label,
.marquee-link,
.marquee-separator{
  font-size: var(--mq-fz-d, 20px);
  line-height: var(--mq-lh-d, 1.1);
  letter-spacing: var(--mq-ls-d, 0);
  text-transform: var(--mq-transform, none);
  font-weight: var(--mq-weight, 600);
  white-space: nowrap;
}

.marquee-label{
  color: var(--mq-text, #111111);
}

.marquee-link{
  color: var(--mq-link, var(--mq-text, #111111));
  text-decoration: none;
  transition: opacity .2s ease, text-decoration-color .2s ease;
}

.marquee-link:hover,
.marquee-link:focus-visible{
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.marquee-item.is-highlight .marquee-label,
.marquee-item.is-highlight .marquee-link{
  color: var(--mq-highlight, #000000);
}

.marquee-separator{
  color: var(--mq-text, #111111);
  opacity: .6;
}

@keyframes kzt-marquee-scroll-left{
  0%{
    transform: translate3d(0,0,0);
  }
  100%{
    transform: translate3d(-50%,0,0);
  }
}

@keyframes kzt-marquee-scroll-right{
  0%{
    transform: translate3d(-50%,0,0);
  }
  100%{
    transform: translate3d(0,0,0);
  }
}

@media (max-width: 1024px){
  .marquee-viewport{
    min-height: var(--mq-height-t, 64px);
  }

  .marquee-track{
    gap: var(--mq-gap-t, 22px);
    animation-duration: var(--mq-duration-t, 24s);
  }

  .marquee-group{
    gap: var(--mq-gap-t, 22px);
  }

  .marquee-item,
  .marquee-separator{
    min-height: var(--mq-height-t, 64px);
  }

  .marquee-label,
  .marquee-link,
  .marquee-separator{
    font-size: var(--mq-fz-t, 18px);
    line-height: var(--mq-lh-t, 1.1);
    letter-spacing: var(--mq-ls-t, 0);
  }
}

@media (max-width: 640px){
  .marquee-viewport{
    min-height: var(--mq-height-m, 56px);
  }

  .marquee-track{
    gap: var(--mq-gap-m, 16px);
    animation-duration: var(--mq-duration-m, 20s);
  }

  .marquee-group{
    gap: var(--mq-gap-m, 16px);
  }

  .marquee-item,
  .marquee-separator{
    min-height: var(--mq-height-m, 56px);
  }

  .marquee-label,
  .marquee-link,
  .marquee-separator{
    font-size: var(--mq-fz-m, 16px);
    line-height: var(--mq-lh-m, 1.1);
    letter-spacing: var(--mq-ls-m, 0);
  }
}

@media (prefers-reduced-motion: reduce){
  .marquee-track{
    animation: none !important;
    transform: none !important;
  }

  .marquee-group[aria-hidden="true"]{
    display: none;
  }
}


/* ===================================
   Gallery Slider — #kzt-card-slider-reset
   =================================== */

.gallery-section{
  width:100%;

  /* Individuell (wenn gesetzt) schlägt Global */
  padding-top: var(
    --kzt-gallery-pt-d,
    var(--kzt-space-module-top-d,
      var(--kzt-space-section-top-d,
        var(--kzt-space-y-d, 96px)
      )
    )
  );

  padding-bottom: var(
    --kzt-gallery-pb-d,
    var(--kzt-space-module-bottom-d,
      var(--kzt-space-section-bottom-d,
        var(--kzt-space-y-d, 96px)
      )
    )
  );

  background: var(--color-white);
}

@media (max-width:1023px){
  .gallery-section{
    padding-top: var(
      --kzt-gallery-pt-t,
      var(--kzt-space-module-top-t,
        var(--kzt-space-section-top-t,
          var(--kzt-space-y-t, 72px)
        )
      )
    );

    padding-bottom: var(
      --kzt-gallery-pb-t,
      var(--kzt-space-module-bottom-t,
        var(--kzt-space-section-bottom-t,
          var(--kzt-space-y-t, 72px)
        )
      )
    );
  }
}

@media (max-width:767px){
  .gallery-section{
    padding-top: var(
      --kzt-gallery-pt-m,
      var(--kzt-space-module-top-m,
        var(--kzt-space-section-top-m,
          var(--kzt-space-y-m, 56px)
        )
      )
    );

    padding-bottom: var(
      --kzt-gallery-pb-m,
      var(--kzt-space-module-bottom-m,
        var(--kzt-space-section-bottom-m,
          var(--kzt-space-y-m, 56px)
        )
      )
    );
  }
}

.gallery-swiper{
  width:100%;
}

.gallery-swiper .swiper-slide{
  height: var(--kzt-gallery-h-d, 354px);
}

@media (max-width:1023px){
  .gallery-swiper .swiper-slide{
    height: var(--kzt-gallery-h-t, 300px);
  }
}

@media (max-width:767px){
  .gallery-swiper .swiper-slide{
    height: var(--kzt-gallery-h-m, 240px);
  }
}

.gallery-swiper .swiper-slide img{
  height:100%;
  width:100%;
  object-fit:cover;
  border-radius: var(--kzt-gallery-radius, 5px);
  display:block;
}

/* Pagination (wenn aktiv) */
.gallery-pagination{
  margin-top:20px;
  text-align:center;
  position:relative;
}

.gallery-pagination .swiper-pagination-bullet{
  background:#000;
  opacity:.3;
  width:10px;
  height:10px;
  margin:0 4px;
  border-radius:50%;
  transition:opacity .3s ease;
}

.gallery-pagination .swiper-pagination-bullet-active{
  opacity:1;
}

/* ===================================
   Gallery Slider — #kzt-card-slider-reset (Premium Final + Active Enhance)
   =================================== */

.gallery-section{
  width:100%;
  padding-top: var(
    --kzt-gallery-pt-d,
    var(--kzt-space-module-top-d,
      var(--kzt-space-section-top-d,
        var(--kzt-space-y-d, 96px)
      )
    )
  );
  padding-bottom: var(
    --kzt-gallery-pb-d,
    var(--kzt-space-module-bottom-d,
      var(--kzt-space-section-bottom-d,
        var(--kzt-space-y-d, 96px)
      )
    )
  );
  background: var(--color-white);
}

@media (max-width:1023px){
  .gallery-section{
    padding-top: var(
      --kzt-gallery-pt-t,
      var(--kzt-space-module-top-t,
        var(--kzt-space-section-top-t,
          var(--kzt-space-y-t, 72px)
        )
      )
    );
    padding-bottom: var(
      --kzt-gallery-pb-t,
      var(--kzt-space-module-bottom-t,
        var(--kzt-space-section-bottom-t,
          var(--kzt-space-y-t, 72px)
        )
      )
    );
  }
}

@media (max-width:767px){
  .gallery-section{
    padding-top: var(
      --kzt-gallery-pt-m,
      var(--kzt-space-module-top-m,
        var(--kzt-space-section-top-m,
          var(--kzt-space-y-m, 56px)
        )
      )
    );
    padding-bottom: var(
      --kzt-gallery-pb-m,
      var(--kzt-space-module-bottom-m,
        var(--kzt-space-section-bottom-m,
          var(--kzt-space-y-m, 56px)
        )
      )
    );
  }
}

.gallery-swiper{ width:100%; }

.gallery-swiper .swiper-slide{
  height: var(--kzt-gallery-h-d, 354px);
  transition: transform .35s ease;
  transform: scale(1);
  opacity: 1;
}

@media (max-width:1023px){
  .gallery-swiper .swiper-slide{ height: var(--kzt-gallery-h-t, 300px); }
}
@media (max-width:767px){
  .gallery-swiper .swiper-slide{ height: var(--kzt-gallery-h-m, 240px); }
}

/* Fixed Width Mode */
.gallery-swiper.is-fixed-width .swiper-slide{ width: var(--kzt-gallery-w-d, 640px); }
@media (max-width:1023px){
  .gallery-swiper.is-fixed-width .swiper-slide{ width: var(--kzt-gallery-w-t, 520px); }
}
@media (max-width:767px){
  .gallery-swiper.is-fixed-width .swiper-slide{ width: var(--kzt-gallery-w-m, 360px); }
}

/* Optional Active Scale */
.gallery-swiper.has-active-scale .swiper-slide{
  transform: scale(var(--kzt-gallery-scale-inactive-d, 0.96));
}
.gallery-swiper.has-active-scale .swiper-slide.swiper-slide-active{
  transform: scale(var(--kzt-gallery-scale-active-d, 1));
}
@media (max-width:1023px){
  .gallery-swiper.has-active-scale .swiper-slide{
    transform: scale(var(--kzt-gallery-scale-inactive-t, 0.96));
  }
  .gallery-swiper.has-active-scale .swiper-slide.swiper-slide-active{
    transform: scale(var(--kzt-gallery-scale-active-t, 1));
  }
}
@media (max-width:767px){
  .gallery-swiper.has-active-scale .swiper-slide{
    transform: scale(var(--kzt-gallery-scale-inactive-m, 0.96));
  }
  .gallery-swiper.has-active-scale .swiper-slide.swiper-slide-active{
    transform: scale(var(--kzt-gallery-scale-active-m, 1));
  }
}

/* Figure / media */
.gallery-figure{
  margin:0;
  height:100%;
  display:flex;
  flex-direction:column;
}

.gallery-media{
  position:relative;
  height:100%;
}

.gallery-media img{
  height:100%;
  width:100%;
  object-fit:cover;
  border-radius: var(--kzt-gallery-radius, 5px);
  display:block;
  transition: filter .35s ease;
  filter: none;
}

/* Active Enhance: only active slide gets filter */
.gallery-swiper.has-active-enhance .swiper-slide.swiper-slide-active .gallery-media img{
  filter:
    contrast(var(--kzt-gallery-enh-contrast-d, 1.05))
    saturate(var(--kzt-gallery-enh-saturate-d, 1.08))
    brightness(var(--kzt-gallery-enh-brightness-d, 1.02));
}

@media (max-width:1023px){
  .gallery-swiper.has-active-enhance .swiper-slide.swiper-slide-active .gallery-media img{
    filter:
      contrast(var(--kzt-gallery-enh-contrast-t, 1.05))
      saturate(var(--kzt-gallery-enh-saturate-t, 1.08))
      brightness(var(--kzt-gallery-enh-brightness-t, 1.02));
  }
}

@media (max-width:767px){
  .gallery-swiper.has-active-enhance .swiper-slide.swiper-slide-active .gallery-media img{
    filter:
      contrast(var(--kzt-gallery-enh-contrast-m, 1.03))
      saturate(var(--kzt-gallery-enh-saturate-m, 1.06))
      brightness(var(--kzt-gallery-enh-brightness-m, 1.01));
  }
}

/* Inactive overlay */
.gallery-swiper.has-inactive-overlay .swiper-slide .gallery-media::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius: var(--kzt-gallery-radius, 5px);
  background: var(--kzt-gallery-inactive-overlay-color, #000);
  opacity: var(--kzt-gallery-inactive-overlay-opacity, .45);
  transition: opacity .35s ease;
  pointer-events:none;
}
.gallery-swiper.has-inactive-overlay .swiper-slide.swiper-slide-active .gallery-media::after{
  opacity: 0;
}

/* Caption */
.gallery-caption{
  margin-top: 10px;
  line-height: 1.4;
  opacity: .85;
  font-weight: var(--kzt-gallery-caption-weight, 400);
}

/* Pagination Abstand D/T/M */
.gallery-pagination{
  margin-top: var(--kzt-gallery-pg-mt-d, 20px);
  text-align:center;
  position:relative;
}
@media (max-width:1023px){
  .gallery-pagination{ margin-top: var(--kzt-gallery-pg-mt-t, 20px); }
}
@media (max-width:767px){
  .gallery-pagination{ margin-top: var(--kzt-gallery-pg-mt-m, 20px); }
}

/* Pagination Bullets */
.gallery-pagination .swiper-pagination-bullet{
  background: var(--kzt-gallery-pg-color, #000);
  opacity: var(--kzt-gallery-pg-opacity, .3);
  width: var(--kzt-gallery-pg-size, 10px);
  height: var(--kzt-gallery-pg-size, 10px);
  margin: 0 var(--kzt-gallery-pg-gap, 4px) !important;
  border-radius: var(--kzt-gallery-pg-radius, 999px);
  transition: opacity .3s ease;
}
.gallery-pagination .swiper-pagination-bullet-active{
  opacity: var(--kzt-gallery-pg-active-opacity, 1);
}



/* ===================================
   MODUL 8 – INFO SECTION
   =================================== */
.info-section {
  background-color: var(--color-yellow);
  position: relative;
  padding: 8rem 0rem 8rem;
  overflow: hidden;
  text-align: center;
}

.info-section .grunge-top {
  background-color: var(--color-white);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}

.info-box {
  background: var(--color-white);
  border-radius: 5px;
  padding: 40px;
  max-width: 850px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.info-headline {
  font-size: var(--h4-size);
  font-family: var(--font-headline);
  color: var(--color-black);
  margin-bottom: 1.5rem;
}

.info-text {
  /*font-size: var(--body-size);
  line-height: 1;*/
  color: var(--color-black);
  margin-bottom: 2rem;
}

.social-icons {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.social-icons img {
  width: 32px;
  height: 32px;
  transition: transform 0.3s ease;
}

.social-icons a:hover img {
  transform: scale(1.1);
}

/* Berni Grafik */
.berni {
  position: absolute;
  top: 150px;
  bottom: 0;
  left: 0;
  width: 180px;
  z-index: 3;
}

/* ===================================
   FOOTER 
   =================================== */
  
/* Footer-Root darf niemals selbst Grid-Container-Regeln bekommen */
.site-footer.grid,
.site-footer.fluid,
.site-footer.fluid-no-padding{
  max-width: none !important;
  margin: 0 !important;
  padding-inline: 0 !important;
  width: 100% !important;
}

.site-footer{
  color: var(--color-white);
  padding-top: 5rem;
  padding-bottom: 2.5rem;
  padding-left: 0;
  padding-right: 0;

  /* Defaults – werden von PHP überschrieben */
  --footer-phone-d: 72px;
  --footer-phone-t: 56px;
  --footer-phone-m: 40px;

  --footer-email-d: 72px;
  --footer-email-t: 56px;
  --footer-email-m: 40px;

  --footer-small-d: 16px;
  --footer-small-t: 15px;
  --footer-small-m: 14px;

  /* Footer-Background */
  --footer-bg: var(--color-primary, #000);

  /* ===========================
     Footer Padding D/T/M
     =========================== */
  --footer-pad-w: var(--kzt-grid-pad, 20px);
  --footer-pad-d: var(--kzt-grid-pad, 20px);
  --footer-pad-t: var(--kzt-grid-pad, 20px);
  --footer-pad-m: var(--kzt-grid-pad, 20px);

  /* EIN Token, das die Layouts nutzen */
  --footer-pad: var(--footer-pad-d);

  /* Footer Grid Max (optional via PHP inline var) */
  --footer-grid-max: var(--kzt-grid-max, 1760px);

  /* ===========================
     Legal Typo separat
     =========================== */
  --footer-legal-d: var(--footer-text-d, 14px);
  --footer-legal-t: var(--footer-text-t, 14px);
  --footer-legal-m: var(--footer-text-m, 14px);
  --footer-legal-transform: none;

  /* ===========================
     PRE-FOOTER
     =========================== */
  --pre-divider-color: #c5c5ba;

  --pre-text-d: 18px;
  --pre-text-t: 18px;
  --pre-text-m: 18px;

  --pre-gap-divider-text-d: 30px;
  --pre-gap-divider-text-t: 30px;
  --pre-gap-divider-text-m: 30px;

  --pre-gap-text-headline-d: 60px;
  --pre-gap-text-headline-t: 60px;
  --pre-gap-text-headline-m: 60px;

  --pre-gap-footer-d: 30px;
  --pre-gap-footer-t: 30px;
  --pre-gap-footer-m: 30px;

  --pre-head-size-d: auto;
  --pre-head-size-t: auto;
  --pre-head-size-m: auto;

  --pre-head-lh-d: 1.20;
  --pre-head-lh-t: 1.20;
  --pre-head-lh-m: 1.20;

  --pre-head-min: 30px;
  --pre-head-fluid: 6vw;
  --pre-head-max: 56px;

  position: relative;
  isolation: isolate;
  overflow: visible;
}

/* Tablet/Mobile switch für --footer-pad */
@media (max-width:1023px){
  .site-footer{ --footer-pad: var(--footer-pad-t); }
}
@media (max-width:767px){
  .site-footer{ --footer-pad: var(--footer-pad-m); }
}

@media (min-width:1761px){
  .site-footer{
    --footer-pad: var(--footer-pad-w);
  }
}

/* ===== Background-Mode ===== */
.site-footer.bg-inner{
  background: transparent;
}
.site-footer.bg-inner .footer-inner{
  background: var(--footer-bg);
}

/* Full-bleed Background über pseudo layer */
.site-footer.bg-full{
  background: var(--footer-bg);
}

/*.site-footer.bg-full::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50vw);
  background: var(--footer-bg);
  pointer-events:none;
}*/

/* Root overflow-x safety */
html, body{
  max-width: 100%;
  overflow-x: clip;
}

/* ===== Footer Inner = eigener Container (keine globalen .inner Side-Effects) ===== */
.site-footer .footer-inner{
  box-sizing: border-box;
  margin: 0;
  width: 100%;
}

/* GRID: nutzt globales Grid – und optional Footer-Override */
.site-footer .footer-inner.grid{
  max-width: var(--footer-grid-max, var(--kzt-grid-max, 1760px));
  margin: 0 auto;
  /*padding-inline: var(--footer-pad) !important;*/
}

/* FLUID: volle Breite mit Padding (BÜNDIG!) */
.site-footer .footer-inner.fluid{
  max-width: none;
  margin: 0;
  padding-inline: var(--footer-pad) !important;
}

/* FULL: volle Breite ohne Padding */
.site-footer .footer-inner.fluid-no-padding{
  max-width: none;
  margin: 0;
  padding-inline: 0 !important;
}

/* ===================================
   PRE-FOOTER
   =================================== */

.site-footer .footer-pre{
  margin-bottom: var(--pre-gap-footer-d);
}

.site-footer .footer-pre-divider{
  width: 100%;
  height: 1px;
  background: var(--pre-divider-color, #c5c5ba);
  margin-bottom: var(--pre-gap-divider-text-d);
}

.site-footer .footer-pre-text{
  color: var(--color-white);
  font-family: var(--font-sans, 'TiemposHeadline-Regular', sans-serif);
  font-size: var(--pre-text-d);
  line-height: 1.2;
  margin-bottom: var(--pre-gap-text-headline-d);
}

.site-footer .footer-pre-headline{
  margin: 0;
  color: var(--color-white);
  font-family: var(--font-sans, 'TiemposHeadline-Regular', sans-serif);
  font-weight: 400;
  line-height: var(--pre-head-lh-d);
  letter-spacing: 0;
}

/* bevorzugt fixer D-Wert, falls gesetzt – sonst Clamp */
.site-footer .footer-pre-headline{
  font-size: clamp(
    var(--pre-head-min),
    var(--pre-head-fluid),
    var(--pre-head-max)
  );
}

.site-footer[style*="--pre-head-size-d:auto"] .footer-pre-headline{
  font-size: clamp(
    var(--pre-head-min),
    var(--pre-head-fluid),
    var(--pre-head-max)
  );
}

/* Desktop-Wert, wenn explizit gesetzt */
.site-footer:not([style*="--pre-head-size-d:auto"]) .footer-pre-headline{
  font-size: var(--pre-head-size-d);
}

@media (max-width:1023px){
  .site-footer .footer-pre{
    margin-bottom: var(--pre-gap-footer-t);
  }

  .site-footer .footer-pre-divider{
    margin-bottom: var(--pre-gap-divider-text-t);
  }

  .site-footer .footer-pre-text{
    font-size: var(--pre-text-t);
    margin-bottom: var(--pre-gap-text-headline-t);
  }

  .site-footer .footer-pre-headline{
    line-height: var(--pre-head-lh-t);
  }

  .site-footer:not([style*="--pre-head-size-t:auto"]) .footer-pre-headline{
    font-size: var(--pre-head-size-t);
  }
}

@media (max-width:767px){
  .site-footer .footer-pre{
    margin-bottom: var(--pre-gap-footer-m);
  }

  .site-footer .footer-pre-divider{
    margin-bottom: var(--pre-gap-divider-text-m);
  }

  .site-footer .footer-pre-text{
    font-size: var(--pre-text-m);
    margin-bottom: var(--pre-gap-text-headline-m);
  }

  .site-footer .footer-pre-headline{
    line-height: var(--pre-head-lh-m);
  }

  .site-footer:not([style*="--pre-head-size-m:auto"]) .footer-pre-headline{
    font-size: var(--pre-head-size-m);
  }
}

/* ===== TOP ===== */
.footer-top{
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 4rem;
  align-items: start;
  margin-bottom: 10rem !important;
}
@media (max-width:1023px){
  .footer-top{ grid-template-columns: 1fr; gap: 2rem; }
}

/* Topline */
.footer-topline{
  letter-spacing: 0.06rem;
  font-size: 15px;
  text-transform: uppercase;
  display: inline-flex;
  align-items: baseline;
  color: var(--color-white);
  font-family: var(--font-regular, inherit);
  margin-bottom: 30px;
  opacity: .9;
}

/* Big lines */
.footer-big p{
  margin: 0 0 .2em 0;
  line-height: 1;
  letter-spacing: .2px;
  color: var(--color-white);
  font-family: var(--font-headline);
}
.footer-big a{ color: inherit; text-decoration: underline; }
.footer-big a:hover{ text-decoration: none; }

.footer-big .phone{ font-size: var(--footer-phone-d); }
.footer-big .email{
  font-size: var(--footer-email-d);
  font-family: var(--font-sans, 'TiemposHeadline-Regular', sans-serif);
}
.footer-big .email a{
  font-family: var(--font-sans, 'TiemposHeadline-Regular', sans-serif);
}

@media (max-width:1023px){
  .footer-big .phone{ font-size: var(--footer-phone-t); }
  .footer-big .email{ font-size: var(--footer-email-t); }
}
@media (max-width:767px){
  .footer-big .phone{ font-size: var(--footer-phone-m); }
  .footer-big .email{ font-size: var(--footer-email-m); }
}

/* Right column */
.footer-right{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem 3rem;
}
@media (max-width:767px){
  .footer-right{ grid-template-columns: 1fr; margin-top: 30px; }
}

/* Separator */
.footer-separator{
  border: none;
  border-top: 1px solid #c5c5ba;
  margin-top: 4rem !important;
  margin-bottom: 0.5rem !important;
}

/* ===== BOTTOM ===== */
.footer-bottom{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 1.25rem 2rem;
  padding-top: .25rem;
}

.footer-left{
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  min-width: 0;
}

.footer-left .copyright,
.site-footer .footer-claim{
  margin: 0;
  padding: .3rem 0 1rem;
  line-height: 1.2;
}

/* Links */
.site-footer .footer-links{
  display: flex;
  flex-wrap: wrap;
  gap: .6rem 1.1rem;
}
.site-footer .footer-links a{
  color: var(--color-yellow) !important;
  font-weight: 500;
  text-decoration: none;
}
.site-footer .footer-links a:hover{
  color: var(--color-black) !important;
  text-decoration: underline;
}

/* Right bottom */
.site-footer .footer-right-bottom{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  /*gap: .75rem;*/
  min-width: 0;
  text-align:right;
}

.site-footer .footer-claim{
  font-family: var(--font-headline, sans-serif);
  font-size: clamp(14px, 1.4vw, 20px);
  letter-spacing: .02em;
  white-space: nowrap;
  min-width: 0;
}

/* Social */
.site-footer .footer-social{
  display:flex;
  align-items:center;
  gap:.6rem;
}
.site-footer .footer-social img{
  display:block;
  width:20px;
  height:20px;
}

/* Mobile bottom: stacked */
@media (max-width:640px){
  .footer-bottom{
    grid-template-columns: 1fr;
    align-items: start;
    gap: .9rem;
  }

  .site-footer .footer-right-bottom{
    justify-content: flex-start;
    text-align: left;
    flex-wrap: wrap;
    row-gap: .5rem;
  }

  .site-footer .footer-claim{
    font-size: 17px; 
    white-space: normal;
    line-height: 1.15;
  }
}

/* ================================
   FOOTER TYPO
   Text & Links D/T/M via CSS Vars
   ================================ */

/* Defaults – werden von PHP überschrieben */
.site-footer{
  --footer-text-d: 14px;
  --footer-text-t: 14px;
  --footer-text-m: 14px;
}

/* Rechts: Adresse/Kontakt + Links */
.footer-right p,
.footer-right a,
.footer-right li{
  color: var(--color-white);
  font-family: var(--font-regular, 'HelveticaNeue-Regular', sans-serif);
  line-height: 1.2;
  margin: 0 0 .4rem 0;
  font-size: var(--footer-text-d);
}

/* Tablet */
@media (max-width:1023px){
  .footer-right p,
  .footer-right a,
  .footer-right li{
    font-size: var(--footer-text-t);
  }
}

/* Mobile */
@media (max-width:767px){
  .footer-right p,
  .footer-right a,
  .footer-right li{
    font-size: var(--footer-text-m);
  }
}

/* ===================================
   Legal Links (unten links)
   Größe separat + Uppercase steuerbar
   =================================== */

.site-footer .footer-legal{
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .75rem;
}

.site-footer .footer-legal a{
  color: var(--color-white);
  font-family: var(--font-bold);
  font-size: var(--footer-legal-d);
  text-decoration: none;
  text-transform: var(--footer-legal-transform, none);
}

.site-footer .footer-legal a:hover{
  text-decoration: underline;
}

.site-footer .footer-legal-sep{
  color: rgba(255,255,255,.6);
  line-height: 1;
  user-select: none;
}

/* Tablet */
@media (max-width:1023px){
  .site-footer .footer-legal a{
    color: var(--color-white);
    font-size: var(--footer-legal-t);
  }
}

/* Mobile – HARTE Farbe, überschreibt globale a{} Regeln */
@media (max-width:767px){
  .site-footer .footer-legal a{
    color: var(--color-white) !important;
    font-size: var(--footer-legal-m);
  }
}


/* ===================================
   MODDUL 10 – BREADCRUMP
   =================================== */

.breadcrumb {
  font-size: var(--body-size);
  margin-bottom: 1em;
  color: var(--breadcrumb-color);
}

.breadcrumb ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
}

.breadcrumb li + li::before {
  content: "›";
  margin: 0 0.5em;
  color: var(--breadcrumb-separator);
}

.breadcrumb a {
  text-decoration: none;
  color: var(--breadcrumb-color);
}

.breadcrumb li:last-child {
  opacity: 0.6;
}




/* ============================
   BILD / TEXT
   ============================ */

.bild-text-block {
  position: relative;
  overflow: visible;
  padding-top: var(--bt-space-top-d, 60px);
  padding-bottom: var(--bt-space-bot-d, 60px);
}

.bild-text-block .inner {
  display: flex;
  gap: 40px;
  align-items: flex-start;
}

.bild-text-block.left .bild  { order: 1; }
.bild-text-block.left .text  { order: 2; }
.bild-text-block.right .bild { order: 2; }
.bild-text-block.right .text { order: 1; }

.bild-text-block .bild,
.bild-text-block .text { box-sizing: border-box; }

.bild-text-block .bild { width: var(--img-width); }

.bild-text-block .text {
  width: var(--text-width);
  padding: 0;
  text-align: left;
}

.bild-text-block.left .text  { padding-left: 30px; }
.bild-text-block.right .text { padding-right: 30px; }

.bild-text-block .text.align-top    { align-self: flex-start; }
.bild-text-block .text.align-center { align-self: center; }
.bild-text-block .text.align-bottom { align-self: flex-end; }

.bild-text-block .bild img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: var(--bt-img-radius, 5px);
}

.bild-text-block .bild.has-border img {
  border: var(--bt-img-border-w, 1px) solid var(--bt-img-border-c, #000);
}

.bild-text-block .text .headline {
  margin-bottom: var(--bt-head-gap-d, 16px);
  font-size: var(--bt-head-d, 28px);
  line-height: var(--bt-head-lh-d, 1.15);
  color: var(--bt-head-color, #000);
}

.bild-text-block .text-content {
  font-size: var(--bt-text-d, 17px);
  line-height: var(--bt-text-lh-d, 1.6);
  color: var(--bt-text-color, #000);
}

.bild-text-block .text-content > *:first-child { margin-top: 0; }
.bild-text-block .text-content > *:last-child  { margin-bottom: 0; }

/* PDF Download Link */
.bild-text-pdf-wrap { margin-top: 14px; }

.bild-text-pdf {
  display: inline-block;
  color: var(--bt-pdf-link-color, #C7032E);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(199, 3, 46, 0.85);
  transition: opacity 0.2s ease, text-decoration-color 0.2s ease;
}

.bild-text-pdf:hover {
  opacity: 0.85;
  text-decoration-color: transparent;
}

/* Grunge-Grafiken */
.grunge-wrapper.top,
.grunge-wrapper.bottom {
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.grunge-wrapper.top { margin-bottom: -20px; }
.grunge-wrapper.bottom { margin-top: -20px; }

.grunge-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}

.bild-text-block summary.accordion-header:hover .acc-title,
.bild-text-block details[open] > summary.accordion-header .acc-title {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  text-decoration-color: currentColor;
}

/* ============================
   ACCORDION PRO
============================ */

.bild-text-accordion-box {
  max-width: 1080px;
  margin: 20px auto 0;
  background: var(--bt-acc-box-bg, transparent);
  border-radius: var(--bt-acc-radius, 12px);
}

/* Details */
.bild-text-accordion-box details {
  position: relative;
  overflow: hidden;
  border-radius: var(--bt-acc-radius, 12px);
}

.bild-text-accordion-box details + details {
  margin-top: var(--bt-acc-gap, 10px);
}

/* Background-Layer */
.bild-text-accordion-box details::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--bt-acc-item-bg, var(--bt-acc-item-bg-default, #fff));
  z-index: 0;
  pointer-events: none;
}

.bild-text-accordion-box summary,
.bild-text-accordion-box .accordion-content {
  position: relative;
  z-index: 1;
}

/* Header */
.bild-text-accordion-box summary.accordion-header {
  list-style: none;
  cursor: pointer;

  display: flex;
  align-items: center;
  gap: 8px;

  padding: var(--bt-acc-pad-head-d, 10px);

  font-size: var(--bt-acc-head-size-d, 17px);
  line-height: var(--bt-acc-head-lh-d, 1.2);
  color: var(--color-black, #000);

  justify-content: flex-start; /* wichtig für inline */
}

.bild-text-accordion-box summary::-webkit-details-marker { display: none; }

/* Titel */
.bild-text-accordion-box .acc-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* INLINE Titel: zwingend inline layout */
.bild-text-accordion-box .acc-title-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Chevron */
.bild-text-accordion-box .chevron {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  transition: transform 0.25s ease;
}

/* Rotate */
.bild-text-accordion-box details[open] .chevron {
  transform: rotate(180deg);
}

/* Chevron Position — RIGHT */
.bild-text-accordion-box.chev-right summary.accordion-header {
  justify-content: space-between;
}

.bild-text-accordion-box.chev-right .chevron {
  margin-left: auto;
}

/* Chevron Position — INLINE (direkt hinter Titel) */
.bild-text-accordion-box.chev-inline summary.accordion-header {
  justify-content: flex-start;
}

.bild-text-accordion-box.chev-inline .chevron {
  margin-left: 0 !important;
}

/* Content */
.bild-text-accordion-box .accordion-content {
  /* Abstand Header → Content (nur nach oben!) */
  padding-top: var(--bt-acc-content-gap-d, 10px);

  /* Body Padding LR + Bottom */
  padding-right: var(--bt-acc-pad-body-d, 10px);
  padding-bottom: var(--bt-acc-pad-body-d, 10px);
  padding-left: var(--bt-acc-pad-body-d, 10px);

  font-size: var(--bt-acc-text-size-d, 17px);
  line-height: var(--bt-acc-text-lh-d, 1.6);
}

.bild-text-accordion-box .accordion-content > *:first-child { margin-top: 0; }
.bild-text-accordion-box .accordion-content > *:last-child  { margin-bottom: 0; }

/* ============================
   TABLET
============================ */

@media (max-width: 1024px) {
  .bild-text-block .text .headline {
    margin-bottom: var(--bt-head-gap-t, 16px);
    font-size: var(--bt-head-t, 24px);
  }

  .bild-text-accordion-box summary.accordion-header {
    padding: var(--bt-acc-pad-head-t, 10px);
    font-size: var(--bt-acc-head-size-t, 17px);
    line-height: var(--bt-acc-head-lh-t, 1.2);
  }

  .bild-text-accordion-box .accordion-content {
    padding-top: var(--bt-acc-content-gap-t, 10px);

    padding-right: var(--bt-acc-pad-body-t, 10px);
    padding-bottom: var(--bt-acc-pad-body-t, 10px);
    padding-left: var(--bt-acc-pad-body-t, 10px);

    font-size: var(--bt-acc-text-size-t, 17px);
    line-height: var(--bt-acc-text-lh-t, 1.6);
  }
}

/* ============================
   MOBILE
============================ */

@media (max-width: 768px) {
  .bild-text-block .inner {
    flex-direction: column;
  }

  .bild-text-block .bild,
  .bild-text-block .text {
    width: 100% !important;
    padding: 0 !important;
  }

  /*  NEU: Abstand Bild ↔ Text (Panel gesteuert) */
  .bild-text-block .bild {
    margin-bottom: var(--bt-img-text-gap-m, 30px);
  }
  .bild-text-block.mobile-reverse .bild {
    margin-bottom: 0;
    margin-top: var(--bt-img-text-gap-m, 30px);
  }

  .bild-text-block .text .headline {
    margin-bottom: var(--bt-head-gap-m, 14px);
    font-size: var(--bt-head-m, 22px);
  }

  .bild-text-accordion-box summary.accordion-header {
    padding: var(--bt-acc-pad-head-m, 10px);
    font-size: var(--bt-acc-head-size-m, 17px);
    line-height: var(--bt-acc-head-lh-m, 1.2);
  }

  .bild-text-accordion-box .accordion-content {
    padding-top: var(--bt-acc-content-gap-m, 10px);

    padding-right: var(--bt-acc-pad-body-m, 10px);
    padding-bottom: var(--bt-acc-pad-body-m, 10px);
    padding-left: var(--bt-acc-pad-body-m, 10px);

    font-size: var(--bt-acc-text-size-m, 17px);
    line-height: var(--bt-acc-text-lh-m, 1.6);
  }
}


/* ================================
   MODUL 12 Fullscreen Cover
   ================================ */

.fullscreen-cover {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fullscreen-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-size: cover;
  background-position: center;
  z-index: 0;
}

.fullscreen-content {
  position: relative;
  z-index: 1;
  max-width: 90vw;
  text-align: center;
  padding: 2rem;
}

/* Text-Ausrichtung */
.align-left   { text-align: left; }
.align-center { text-align: center; }
.align-right  { text-align: right; }

/* Vertikale Ausrichtung */
.valign-top    { align-self: flex-start; margin-top: 10vh; }
.valign-center { align-self: center; }
.valign-bottom { align-self: flex-end; margin-bottom: 10vh; }

.scroll-arrow {
  position: absolute;
  bottom: 2rem;
  z-index: 2;
  animation: bounce 2s infinite;
}

.scroll-left {
  left: 2rem;
  transform: none;
}
.scroll-center {
  left: 50%;
  transform: translateX(-50%);
}
.scroll-right {
  right: 2rem;
  transform: none;
}

@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(8px); }
}

pre {
  background: rgba(0,0,0,0.6);
  padding: 1rem;
  overflow: auto;
  margin-top: 2rem;
  border-radius: 4px;
  text-align: left;
}


/* ============================
   MODUL 13 — DIVIDER
============================ */

.divider-section {
  text-align: left;
}

.divider-above,
.divider-below {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: var(--body-size);
  color: var(--color-text);
}


.divider-line-wrap {
  display: flex;
  align-items: center;
  /*margin: 1rem 0;*/
}

.divider-line {
  margin: 0 auto;
  display: block;
}


.divider-text {
  font-size: var(--body-size);
  color: var(--color-text);
}

.divider-link {
  font-size: var(--body-size);
  color: var(--color-link, var(--color-text));
  text-decoration: underline;
  transition: color 0.3s;
}

.divider-link:hover {
  color: var(--color-link-hover, var(--color-black));
}


.divider-link:hover {
  color: var(--color-link-hover, var(--color-black));
}




/* ============================
   MODUL 14 — BURGERLOOP
============================ */

/* === Burger-Loop === */
.burger-loop { padding: 2rem 0; }
.burger-loop-headline { margin-bottom: 0.5rem; }
.burger-loop-intro { max-width: 800px; margin: 0 0 1.5rem; }

.burger-loop-filter {
  display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 1.5rem;
}
.burger-loop-filter .bl-filter-btn {
  border: 1px solid #ddd; padding: .5rem .8rem; border-radius: 999px;
  font-size: .9rem; cursor: pointer; background: #fff;
}
.burger-loop-filter .bl-filter-btn.is-active { border-color: #000; }

.burger-loop-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem;
}
@media (max-width: 900px) {
  .burger-loop-grid { grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 600px) {
  .burger-loop-grid { grid-template-columns: repeat(2, 1fr); }
}
.burger-card { grid-column: span 4; }
@media (max-width: 900px){ .burger-card { grid-column: span 6; } }
@media (max-width: 600px){ .burger-card { grid-column: span 2; } }

.burger-card-inner {
  background: #fff; border: 1px solid #eee; border-radius: 12px; overflow: hidden;
  display: flex; flex-direction: column; height: 100%;
  transition: transform .15s ease, box-shadow .15s ease;
}
.burger-card-inner:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.06); }

.burger-image img { display: block; width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; }

.burger-content { padding: 1rem; display: flex; flex-direction: column; gap: .5rem; }
.burger-title-row { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.burger-title { font-size: 1.1rem; margin: 0; }
.burger-price { font-weight: 700; white-space: nowrap; }

.burger-badges { display: flex; gap: .4rem; flex-wrap: wrap; list-style: none; padding: 0; margin: .25rem 0 .25rem; }
.burger-badges .badge { font-size: .75rem; border: 1px solid #eee; padding: .2rem .5rem; border-radius: 999px; background: #fafafa; }
.badge-vegetarisch, .badge-veggie { background: #e9f7ec; border-color: #d0efda; }
.badge-vegan { background: #e6f5ea; border-color: #caebd3; }
.badge-scharf { background: #fff1f0; border-color: #ffd5d1; }
.badge-neu { background: #eef3ff; border-color: #d7e0ff; }
.badge-bestseller { background: #fff7e6; border-color: #ffe7b8; }

.burger-desc p { margin: 0 0 .5rem; }
.burger-meta { display: flex; gap: .5rem; flex-wrap: wrap; }
.meta-chip { font-size: .75rem; padding: .2rem .5rem; border-radius: 6px; background: #f5f5f5; }
.meta-unavailable { background: #ffecec; }

.burger-card.is-unavailable .burger-card-inner {
  opacity: .65; filter: grayscale(40%);
}


/* ============================
   MODUL 15 — BURGERDISPLAY
============================ */

/* ===== Wrapper ===== */
.fb-display-loop {
  background: var(--fb-bg, #fb0435);
  color: #fff;
}
.fb-display-loop .fluid-no-padding {
  padding-left: 0;
  padding-right: 0;
}

.fb-display-stage {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-items: center;
  overflow: hidden;
}

/* Optional: dezente Headline oben */
.fb-display-headline {
  position: absolute;
  top: 24px;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 600;
  letter-spacing: .02em;
  opacity: .9;
}

/* ===== Swiper Sizing ===== */
.fb-display-swiper {
  width: 100%;
  height: 100%;
  padding-left: var(--peek, 14%);
  padding-right: var(--peek, 14%);
  overflow: visible; /* Peeks sichtbar lassen */
}

/* Desktop/Default */
.fb-display-swiper .swiper-slide {
  position: relative;
  width: clamp(var(--slide-min, 320px), var(--slide-w, 42vw), var(--slide-max, 820px));
  height: auto;
  display: grid;
  place-items: center;
  transition: transform .45s ease, filter .45s ease, opacity .45s ease;
  will-change: transform, filter, opacity;
}


/* ===== Bild ===== */
.fb-display-figure { position: relative; margin: 0; z-index: 1; }
.fb-display-figure img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  transform-origin: center;
  transition: transform .6s ease;
}

/* ===== Peeks (Neben-Slides) ===== */
.fb-display-swiper .swiper-slide:not(.swiper-slide-active) {
  filter: blur(var(--blur, 5px)) brightness(.9);
  opacity: .65;
  transform: scale(.92);
}

/* Active-Slide: scharf + leichter Punch */
.fb-display-swiper .swiper-slide.swiper-slide-active {
  filter: none;
  opacity: 1;
  transform: scale(1);
}
.fb-display-swiper .swiper-slide.swiper-slide-active .fb-display-figure img {
  transform: scale(1.02);
}

/* ======================================
   DELUXE NAME REVEAL (Box + Text)
====================================== */

/* Namebox-Container (keine Optik hier) */
.fb-display-namebox {
  position: absolute;
  left: 50%;
  bottom: 90px;                 /* näher am Bild */
  transform: translate(-50%, 0);
  z-index: 2;
  pointer-events: none;
}

/* Clip/Mask: Box baut sich von unten auf */
.fb-namebox-clip {
  background: var(--name-bg, rgba(0,0,0,.65));
  color: var(--name-color, #fff);
  padding-inline: 1.1rem;
  padding-block: .82rem .42rem; /* top | bottom */
  /*padding: .7rem 1.1rem;*/
  /* border-radius: 12px;  // falls du wieder Radius willst */
  backdrop-filter: saturate(1.2) blur(4px);
  overflow: hidden;

  /* Startzustand */
  opacity: 0;
  clip-path: inset(100% 0 0 0);            /* „geschlossen“ von unten */
  transform: translateY(6px);              /* sanfterer Start */
  transition:
    opacity .6s cubic-bezier(.2,.85,.18,1),
    clip-path .7s cubic-bezier(.2,.85,.18,1),
    transform .7s cubic-bezier(.2,.85,.18,1);
  will-change: clip-path, transform, opacity;
}

/* Text: slidet verzögert aus der Box nach oben ein */
.fb-display-name {
  display: block;
  font-size: var(--name-size, 48px);
  line-height: 1;
  font-weight: 800;
  letter-spacing: .01em;
  white-space: nowrap;
}
.fb-name-line {
  display: inline-block;
  transform: translateY(110%);
  transition: transform .65s cubic-bezier(.2,.85,.18,1) .12s; /* leichte Verzögerung für Staging */
  will-change: transform;
}

/* Aktivierung rein über Swiper-Klasse (kein JS nötig) */
.swiper-slide-active .fb-namebox-clip {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transform: translateY(0);
}
.swiper-slide-active .fb-name-line {
  transform: translateY(0);
}

/* ===== Hardening ===== */
.fb-display-loop,
.fb-display-stage,
.fb-display-swiper { overflow: hidden; }

/* ===== Responsive ===== */
@media (max-width: 720px) {
  .fb-display-swiper { padding-left: 10%; padding-right: 10%; }
  .fb-display-swiper .swiper-slide { width: clamp(260px, 70vw, 420px); }
  .fb-display-name { font-size: clamp(24px, 6vw, var(--name-size, 48px)); }
}

/* ===== Reduced Motion Respect ===== */
@media (prefers-reduced-motion: reduce) {
  .fb-namebox-clip, .fb-name-line,
  .fb-display-figure img {
    transition: none !important;
    animation: none !important;
  }
}

/* === Display-Font anwenden === */
.fb-display-name,
.fb-display-headline {

  text-transform: uppercase;
  font-family: var(--fb-font-display);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Ken-Burns nur für aktiven Slide */
@keyframes fbKenBurns {
  from { transform: scale(1.0); }
  to   { transform: scale(1.038); } /* 1–1.5 % ist sweet spot */
}
.fb-display-swiper .swiper-slide.swiper-slide-active .fb-display-figure img {
  animation: fbKenBurns var(--interval, 5000ms) linear forwards;
}

/* sanfter Versatz, nur wahrnehmbar beim Wechsel */
.swiper-slide-active .fb-namebox-clip {
  transition-delay: .06s; /* Box */
}
.swiper-slide-active .fb-name-line {
  transition-delay: .14s; /* Text */
}

.fb-autoplay-progress {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 2px;
  background: rgba(255,255,255,.15);
  overflow: hidden;
}
.fb-autoplay-progress::after {
  content: "";
  display: block;
  height: 100%;
  width: 0%;
  background: currentColor;
  opacity: .85;
  animation: fbBar var(--interval, 5000ms) linear infinite;
}
@keyframes fbBar {
  from { width: 0%; }
  to   { width: 100%; }
}

/* Brand Logo Overlay */
.fb-brand-logo {
  position: absolute;
  z-index: 5;                 /* über Headline/Namebox */
  width: var(--logo-w, 220px);
  opacity: var(--logo-opacity, 1);
  pointer-events: none;
}
.fb-brand-logo img { display:block; width:100%; height:auto; }

/* Positionen */
.fb-brand-logo.pos-tl { top: var(--logo-y,24px); left: var(--logo-x,24px); }
.fb-brand-logo.pos-tc { top: var(--logo-y,24px); left: 50%; transform: translateX(-50%); }
.fb-brand-logo.pos-tr { top: var(--logo-y,24px); right: var(--logo-x,24px); }

.fb-brand-logo.pos-bl { bottom: var(--logo-y,24px); left: var(--logo-x,24px); }
.fb-brand-logo.pos-bc { bottom: var(--logo-y,24px); left: 50%; transform: translateX(-50%); }
.fb-brand-logo.pos-br { bottom: var(--logo-y,24px); right: var(--logo-x,24px); }


/* ============================
   BLOCK — COUNTERS
============================ */
.counters-module {
  background: var(--cm-bg, #111);
  color: var(--cm-txt, #fff);
}
.counters-module .inner {}
.counters-module.align-center { text-align: center; }
.counters-module.align-right  { text-align: right; }

.counters-grid {
  display: grid;
  gap: 28px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1100px) {
  .counters-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .counters-grid { grid-template-columns: 1fr; }
}

.counter-card {
  position: relative;
  border-bottom-right-radius: 0px;
  padding:22px 0px;
  background: color-mix(in srgb, var(--cm-bg) 90%, #0000);
  box-shadow: inset 0 -1px rgba(0,0,0,0.2);
}

.counter-number {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  line-height: .9;
  letter-spacing: -0.02em;
}

.counter-value {
  font-family: var(--font-headline);
  font-weight: 800;
  font-size: var(--cm-num, clamp(32px, 7vw, 112px));
}

/* Affix (Suffix/Prefix) gleich groß wie Zahl */
.counter-affix {
  font-weight: 800;
  font-size: var(--cm-num, clamp(32px, 7vw, 112px));
  line-height: .9;
}

.counter-label {
  margin-top: 12px;
  font-size: var(--cm-lbl, clamp(13px, 2.6vw, 18px));
  opacity: .85;
}

@media (prefers-reduced-motion: reduce) {
  .counter-card,
  .counter-number,
  .counter-value { transition: none !important; }
}


/* ============================
   BACKGROUND IMAGE (KZT)
============================ */

:root {
  --content-max: 1200px;
  --page-padding: clamp(16px, 4vw, 48px);
}

/* Block-Breite/Container + Hintergrundfarbe */
.bgimage-block {
  width: 100%;
  margin-inline: auto;
  background-color: var(--bg-color, transparent);
  border-radius: var(--rad-tl) var(--rad-tr) var(--rad-br) var(--rad-bl);
  overflow: hidden;
}
.bgimage-block.grid { max-width: var(--content-max); }
.bgimage-block.fluid,
.bgimage-block.fluid-no-padding { max-width: none; }

/* Surface: Bild + Gaps seitlich (inset) & oben/unten (neu) */
.bgimage-surface {
  position: relative;
  min-height: var(--min-h);
  background-image: var(--bg-url, none);
  background-size: cover;
  background-position: var(--bg-pos, center center);

  /* pad für Body-Positionierungen */
  --pad: clamp(16px, 3vw, 40px);

  /* seitlicher Inset über margin-inline, vertikale Gaps NEU */
  --block-inset-base: 0px;
  margin-inline: calc(var(--block-inset-base) + var(--block-inset-extra, 0px));
  margin-top: var(--surface-gap-top, 0px);
  margin-bottom: var(--surface-gap-bottom, 0px);
}

/* Layout steuert Einrückung des Backgrounds */
.bgimage-block.grid .bgimage-surface { --block-inset-base: 0px; }
.bgimage-block.fluid .bgimage-surface { --block-inset-base: var(--page-padding); }
.bgimage-block.fluid-no-padding .bgimage-surface { --block-inset-base: 0px; }

/* Overlay */
.bgimage-block.has-overlay .bgimage-surface::after {
  content:""; position:absolute; inset:0;
  background: var(--overlay-color); opacity: var(--overlay-opacity);
  pointer-events:none; z-index:1;
}

/* Innenbereich füllt die Surface */
.bgimage-inner { position: absolute; inset: 0; padding: var(--pad); z-index: 2; }

/* Titel */
.bgimage-title {
  position: absolute; top: var(--pad);
  margin: 0; color: var(--title-color, #fff); line-height: 1.1; z-index: 2;
}
.bgimage-block.title-left  .bgimage-title  { left: var(--pad); text-align: left; }
.bgimage-block.title-center .bgimage-title { left: 50%; transform: translateX(-50%); text-align: center; }
.bgimage-block.title-right .bgimage-title  { right: var(--pad); text-align: right; }
.bgimage-block.title-sm .bgimage-title { font-size: clamp(22px, 3vw, 34px); }
.bgimage-block.title-md .bgimage-title { font-size: clamp(28px, 5vw, 48px); }
.bgimage-block.title-lg .bgimage-title { font-size: clamp(34px, 7vw, 64px); }
.bgimage-block.title-xl .bgimage-title { font-size: clamp(38px, 9vw, 84px); }
.bgimage-block.title-shadow .bgimage-title { text-shadow: 0 1px 12px rgba(0,0,0,.35); }

/* Body – Grundstil */
.bgimage-body{
  position: absolute;
  inset: var(--body-top, auto) var(--body-right, var(--pad)) var(--body-bottom, var(--pad)) var(--body-left, auto);
  transform: translate(var(--body-tx, 0), var(--body-ty, 0));
  text-align: left;
  color: var(--body-color, #fff);
  line-height: 1.5;
  padding: clamp(10px, 2vw, 18px);
  border-radius: 12px;
  z-index: 2;
  box-sizing: border-box;

  /* Max. Breite erzwingen + Fontsize-Override */
  width: min(100%, var(--body-max, 560px)) !important;
  max-width: var(--body-max, 560px) !important;
  font-size: var(--body-fs, clamp(16px, 2.2vw, 18px)) !important;
}
.bgimage-body * { font-size: inherit !important; line-height: inherit; text-align: inherit; }
.bgimage-block.body-shadow .bgimage-body { box-shadow: 0 10px 30px rgba(0,0,0,.18); }

/* Harte Ankerung der Text-Position (klassenbasiert) */
.bgimage-block.body-tl .bgimage-body{ top:var(--pad)!important; left:var(--pad)!important; right:auto!important; bottom:auto!important; transform:translate(0,0)!important; }
.bgimage-block.body-tc .bgimage-body{ top:var(--pad)!important; left:50%!important; right:auto!important; bottom:auto!important; transform:translate(-50%,0)!important; }
.bgimage-block.body-tr .bgimage-body{ top:var(--pad)!important; right:var(--pad)!important; left:auto!important; bottom:auto!important; transform:translate(0,0)!important; }
.bgimage-block.body-bl .bgimage-body{ bottom:var(--pad)!important; left:var(--pad)!important; top:auto!important; right:auto!important; transform:translate(0,0)!important; }
.bgimage-block.body-bc .bgimage-body{ bottom:var(--pad)!important; left:50%!important; top:auto!important; right:auto!important; transform:translate(-50%,0)!important; }
.bgimage-block.body-br .bgimage-body{ bottom:var(--pad)!important; right:var(--pad)!important; top:auto!important; left:auto!important; transform:translate(0,0)!important; }

/* Modul-Außenabstände (wie gehabt) */
.kzt-module { padding-top: var(--mod-mt-desktop,0px); padding-bottom: var(--mod-mb-desktop,0px); }
@media (max-width:1023px){
  .kzt-module{
    padding-top: var(--mod-mt-tablet, var(--mod-mt-desktop,0px));
    padding-bottom: var(--mod-mb-tablet, var(--mod-mb-desktop,0px));
  }
}
@media (max-width:767px){
  .kzt-module{
    padding-top: var(--mod-mt-mobile, var(--mod-mt-tablet, var(--mod-mt-desktop,0px)));
    padding-bottom: var(--mod-mb-mobile, var(--mod-mb-tablet, var(--mod-mb-desktop,0px)));
  }
}

/* ============================
   Mobile-Gutter für Body-Text
   (gleicher seitlicher Abstand wie Titel)
============================ */
@media (max-width: 767px) {
  /* Seitliche "Gasse": 2× var(--pad) insgesamt */
  .bgimage-block .bgimage-body {
    width: min(calc(100% - 2 * var(--pad)), var(--body-max, 560px)) !important;
  }

  /* Zentrierte Varianten behalten Centering bei */
  .bgimage-block.body-tc .bgimage-body,
  .bgimage-block.body-bc .bgimage-body {
    left: 50% !important;
    transform: translate(-50%, 0) !important;
  }

  /* Linke/rechte Varianten bleiben am jeweiligen Rand mit Pad verankert */
  .bgimage-block.body-tl .bgimage-body,
  .bgimage-block.body-bl .bgimage-body {
    left: var(--pad) !important;
    right: auto !important;
  }
  .bgimage-block.body-tr .bgimage-body,
  .bgimage-block.body-br .bgimage-body {
    right: var(--pad) !important;
    left: auto !important;
  }
}


/* ============================
   ICONBOXES (KZT) — CLEAN BLOCK + FA7 FIX (Safari/Brave)
   Strategie: Sharp immer auf vorhandene "Font Awesome 7 Sharp Thin" mappen
   ============================ */

/* Section */
.iconboxes-section {
  width: 100%;
  padding-top: 0rem;
  padding-bottom: 0rem;
}

/* Section-Header */
.iconboxes-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.iconboxes-header .left  { padding-left:  var(--ib-header-pl, 0px); }
.iconboxes-header .right { padding-right: var(--ib-header-pr, 0px); }

.iconboxes-header .topline {
  font-size: var(--ib-topline-size, clamp(12px, 1.2vw, 14px));
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 6px;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}
.iconboxes-header .topline .topline-prefix { font-weight: 600; opacity: .85; }
.iconboxes-header .headline {
  font-size: var(--ib-headline-size, clamp(22px, 3.2vw, 34px));
  line-height: 1.1;
  margin: 0;
}

/* Button */
.iconboxes-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border: 1px solid #000;
  text-decoration: none;
  font-weight: 500;
  border-radius: 0;
  transition: transform .12s ease, background-color .12s ease, color .12s ease;
}
.iconboxes-button:hover { transform: translateY(-1px); }

/* Grid */
.iconboxes-grid {
  display: grid;
  grid-template-columns: repeat(var(--ib-cols, 2), minmax(0, 1fr));
  border-top: 1px solid var(--divider, #ccc);
  border-left: 1px solid var(--divider, #ccc);
}
.iconbox {
  border-right: 1px solid var(--divider, #ccc);
  border-bottom: 1px solid var(--divider, #ccc);
}
.iconbox-inner { padding: var(--ib-pad, 28px); }

/* Box-Layout */
.iconbox-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  column-gap: clamp(14px, 4vw, 36px);
  row-gap: 10px;
  align-items: start;
  min-width: 0;
}

/* Icon oben links */
.iconbox-icon {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  font-size: var(--ib-icon, 36px);
  line-height: 1;
}
.iconbox-icon i { display: inline-block; }

/* Headline unten links */
.iconbox-title {
  grid-column: 1 / 2;
  grid-row: 2 / 3;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.15;
  margin: 0;
  white-space: nowrap;
}

/* Text unten rechts */
.iconbox-right {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
  text-align: right;
  justify-self: end;
  align-self: start;
  min-width: 0;
  width: 100%;
}
.iconbox-text {
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.6;
  opacity: .9;
  max-width: 60ch;
  margin-left: auto;
  text-align: left;
}

/* ============================
   Icon Style Vars (size/color)
   ============================ */
.iconboxes-section .iconbox i,
.iconboxes-section .iconbox .fa,
.iconboxes-section .iconbox [class^="fa-"],
.iconboxes-section .iconbox [class*=" fa-"] {
  color: var(--icon-color, currentColor);
  font-size: var(--icon-size, 36px);
  line-height: 1;
}

/* ============================
   FONT AWESOME 7 — WEIGHT MAPPING + SAFE FALLBACK
   Ziel: wieder "wie vorher", aber ohne Kästchen (Safari/Brave safe)
   ============================ */

/* Grund-Hardening */
.iconboxes-section .iconbox-icon i[class*="fa-"] {
  font-style: normal;
  line-height: 1;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.iconboxes-section .iconbox-icon i[class*="fa-"]::before {
  display: inline-block;
}

/* ---------- SHARP: Default-Fallback (Thin) ---------- */
.iconboxes-section .iconbox-icon i.fa-sharp,
.iconboxes-section .iconbox-icon i[class*="fa-sharp"] {
  font-family: "Font Awesome 7 Sharp Thin" !important;
  font-weight: 100 !important;
}

/* ---------- SHARP: Gewicht sauber mappen (wenn Fonts existieren) ---------- */
/* THIN */
.iconboxes-section .iconbox-icon i.fa-sharp.fa-thin,
.iconboxes-section .iconbox-icon i[class*="fa-sharp"][class*="fa-thin"] {
  font-family: "Font Awesome 7 Sharp Thin" !important;
  font-weight: 100 !important;
}

/* LIGHT */
.iconboxes-section .iconbox-icon i.fa-sharp.fa-light,
.iconboxes-section .iconbox-icon i[class*="fa-sharp"][class*="fa-light"] {
  font-family: "Font Awesome 7 Sharp Light" !important;
  font-weight: 300 !important;
}

/* REGULAR */
.iconboxes-section .iconbox-icon i.fa-sharp.fa-regular,
.iconboxes-section .iconbox-icon i[class*="fa-sharp"][class*="fa-regular"] {
  font-family: "Font Awesome 7 Sharp Regular" !important;
  font-weight: 400 !important;
}

/* SOLID */
.iconboxes-section .iconbox-icon i.fa-sharp.fa-solid,
.iconboxes-section .iconbox-icon i[class*="fa-sharp"][class*="fa-solid"] {
  font-family: "Font Awesome 7 Sharp Solid" !important;
  font-weight: 900 !important;
}

/* ---------- BRANDS (nur wenn geladen) ---------- */
.iconboxes-section .iconbox-icon i.fa-brands,
.iconboxes-section .iconbox-icon i[class*="fa-brands"] {
  font-family: "Font Awesome 7 Brands" !important;
  font-weight: 400 !important;
}


/* ============================
   Responsive
   ============================ */
@media (max-width: 1024px) {
  .iconboxes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
  .iconbox-row {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    row-gap: 8px;
  }
  .iconbox-icon  { grid-column: 1; grid-row: 1; }
  .iconbox-title { grid-column: 1; grid-row: 2; }
  .iconbox-right { grid-column: 1; grid-row: 3; text-align: left; justify-self: start; }
}

@media (max-width: 640px) {
  .iconboxes-header { flex-direction: column; align-items: flex-start; }
  .iconboxes-grid { grid-template-columns: 1fr; }
}




/* ==========================================
   KZT — Modul-Abstände global (nur Top/Bottom)
   ========================================== */
.kzt-module {
  padding-top: var(--mod-pt-desktop, 0px);
  padding-bottom: var(--mod-pb-desktop, 0px);
}
@media (max-width: 1023px){
  .kzt-module {
    padding-top: var(--mod-pt-tablet, var(--mod-pt-desktop, 0px));
    padding-bottom: var(--mod-pb-tablet, var(--mod-pb-desktop, 0px));
  }
}
@media (max-width: 767px){
  .kzt-module {
    padding-top: var(--mod-pt-mobile, var(--mod-pt-tablet, var(--mod-pt-desktop, 0px)));
    padding-bottom: var(--mod-pb-mobile, var(--mod-pb-tablet, var(--mod-pb-desktop, 0px)));
  }
}

/* ==========================================
   Vollbreite (ohne Padding)
   - L/R = 0
   - T/B = bleiben aus Variablen erhalten (HARTE Absicherung gegen padding:0)
   ========================================== */
.kzt-module.fluid-no-padding {
  padding-left: 0 !important;
  padding-right: 0 !important;
  /* Hard-override: falls irgendwo padding:0 gesetzt wurde */
  padding-top: var(--mod-pt-desktop, 0px) !important;
  padding-bottom: var(--mod-pb-desktop, 0px) !important;
}
@media (max-width: 1023px){
  .kzt-module.fluid-no-padding {
    padding-top: var(--mod-pt-tablet, var(--mod-pt-desktop, 0px)) !important;
    padding-bottom: var(--mod-pb-tablet, var(--mod-pb-desktop, 0px)) !important;
  }
}
@media (max-width: 767px){
  .kzt-module.fluid-no-padding {
    padding-top: var(--mod-pt-mobile, var(--mod-pt-tablet, var(--mod-pt-desktop, 0px))) !important;
    padding-bottom: var(--mod-pb-mobile, var(--mod-pb-tablet, var(--mod-pb-desktop, 0px))) !important;
  }
}

/* ==========================================
   KZT — Jobs Modul
   ========================================== */
.kzt-module.jobs-section { width: 100%; }
.kzt-module.jobs-section .jobs-inner { width: 100%; }

/* Fluid mit Seitenabstand (aus Block) */
.kzt-module.jobs-section.fluid .jobs-inner{
  padding-left: var(--fluid-pad-x, 32px);
  padding-right: var(--fluid-pad-x, 32px);
}

/* Topline */
.kzt-module.jobs-section .jobs-topline{
  font-size: 14px;
  text-transform: uppercase;
  padding-left: var(--jobs-top-pad-d, var(--jobs-col-pad-d, 30px));
  padding-right: var(--jobs-top-pad-d, var(--jobs-col-pad-d, 30px));
}
@media (max-width: 1023px){
  .kzt-module.jobs-section .jobs-topline{
    padding-left: var(--jobs-top-pad-t, var(--jobs-top-pad-d, 30px));
    padding-right: var(--jobs-top-pad-t, var(--jobs-top-pad-d, 30px));
  }
}
@media (max-width: 767px){
  .kzt-module.jobs-section .jobs-topline{
    padding-left: var(--jobs-top-pad-m, var(--jobs-top-pad-t, 24px));
    padding-right: var(--jobs-top-pad-m, var(--jobs-top-pad-t, 24px));
  }
}

/* Headline */
.kzt-module.jobs-section .jobs-headline{ 
  font-family: var(--font-headline);
  padding-left: var(--jobs-head-pad-d, var(--jobs-col-pad-d, 30px));
  padding-right: var(--jobs-head-pad-d, var(--jobs-col-pad-d, 30px));
}
@media (max-width: 1023px){
  .kzt-module.jobs-section .jobs-headline{ 
    font-size: var(--hsize-tab, 32px) !important;
    line-height: var(--jobs-hline-t, var(--jobs-hline-d)) !important;
    padding-left: var(--jobs-head-pad-t, var(--jobs-head-pad-d, 30px));
    padding-right: var(--jobs-head-pad-t, var(--jobs-head-pad-d, 30px));
  }
}
@media (max-width: 767px){
  .kzt-module.jobs-section .jobs-headline{ 
    font-size: var(--hsize-mob, 26px) !important;
    line-height: var(--jobs-hline-m, var(--jobs-hline-t)) !important;
    padding-left: var(--jobs-head-pad-m, var(--jobs-head-pad-t, 24px));
    padding-right: var(--jobs-head-pad-m, var(--jobs-head-pad-t, 24px));
  }
}

/* Header/Rows: links & rechts Padding (CTA bündig zur Innenkante) */
.kzt-module.jobs-section .jobs-header,
.kzt-module.jobs-section .job-row{
  padding-left: var(--jobs-col-pad-d, 30px);
  padding-right: var(--jobs-col-pad-d, 30px);
}
@media (max-width: 1023px){
  .kzt-module.jobs-section .jobs-header,
  .kzt-module.jobs-section .job-row{
    padding-left: var(--jobs-col-pad-t, var(--jobs-col-pad-d, 30px));
    padding-right: var(--jobs-col-pad-t, var(--jobs-col-pad-d, 30px));
  }
}
@media (max-width: 767px){
  .kzt-module.jobs-section .jobs-header,
  .kzt-module.jobs-section .job-row{
    padding-left: var(--jobs-col-pad-m, var(--jobs-col-pad-t, 24px));
    padding-right: var(--jobs-col-pad-m, var(--jobs-col-pad-t, 24px));
  }
}

/* Tabellen-Header */
.kzt-module.jobs-section .jobs-header{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr minmax(var(--jobs-cta-min, 140px), max-content);
  align-items: end;
  gap: 20px;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--muted, #888);
  margin-bottom: 8px;
}
.kzt-module.jobs-section .jobs-header > div{ text-align:left }
.kzt-module.jobs-section .jobs-header > div:last-child{ text-align:right }

/* Rows */
.kzt-module.jobs-section .jobs-rows{ border-top: 1px solid var(--divider, #e5e5e5); }

.kzt-module.jobs-section .job-row{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr minmax(var(--jobs-cta-min, 140px), max-content);
  align-items: center;
  gap: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--divider, #e5e5e5);
  color: inherit;
  text-decoration: none;
  transition: background-color .2s ease;
  border-radius: 0;
}
.kzt-module.jobs-section .job-row:hover{
  background: var(--jobs-hover, rgba(0,0,0,.05));
}

.kzt-module.jobs-section .job-row .title{ font-family: var(--font-headline, inherit); font-size: 18px; }
.kzt-module.jobs-section .job-row .location,
.kzt-module.jobs-section .job-row .type{ font-size: 16px; }

/* CTA Zelle */
.kzt-module.jobs-section .job-row .jobs-cta { justify-self: end; }

/* CTA Button (Variablen + Fallbacks) */
.jobs-cta .job-apply {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  /* Desktop Padding */
  padding: var(--cta-pad-y, 14px) var(--cta-pad-x, 20px);

  border: var(--cta-border-w, 1px) solid var(--cta-border-color, currentColor);
  border-radius: var(--cta-radius, 0);

  font-family: var(--font-sans, 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  /*text-transform: uppercase;*/
  white-space: nowrap;

  font-size: var(--cta-text-d, 14px);
  letter-spacing: var(--cta-letter, 0);
  color: var(--cta-color, currentColor);

  transition: all .25s ease;
}

.jobs-cta .job-apply .ext{ width:16px; height:16px }

/* Hover aus Panel (Fallbacks) */
.jobs-cta .job-apply:hover {
  color: var(--cta-hover-text, inherit);
  background: var(--cta-hover-bg, transparent);
  border-color: var(--cta-hover-border, currentColor);
  text-decoration: underline;
}

/* Responsive Button-Textgröße */
@media (max-width: 1023px){
  .jobs-cta .job-apply{ font-size: var(--cta-text-t, var(--cta-text-d, 14px)); }
}
@media (max-width: 767px){
  .jobs-cta .job-apply{ font-size: var(--cta-text-m, var(--cta-text-t, var(--cta-text-d, 14px))); }
}

/* Responsive Button-Paddings */
@media (max-width: 1023px){
  .jobs-cta .job-apply{
    padding: var(--cta-pad-y-t, var(--cta-pad-y, 14px))
             var(--cta-pad-x-t, var(--cta-pad-x, 20px));
  }
}
@media (max-width: 767px){
  .jobs-cta .job-apply{
    padding: var(--cta-pad-y-m, var(--cta-pad-y-t, var(--cta-pad-y, 14px)))
             var(--cta-pad-x-m, var(--cta-pad-x-t, var(--cta-pad-x, 20px)));
  }
}

/* Mobile Layout: CTA links unter dem Text */
@media (max-width: 767px){
  .kzt-module.jobs-section .jobs-header{ display:none }

  .kzt-module.jobs-section .job-row{
    grid-template-columns: 1fr;      /* einspaltig */
    row-gap: 10px;
    padding-top: 16px; 
    padding-bottom: 16px;
  }
  .kzt-module.jobs-section .job-row .title{ grid-column: 1/-1 }
  .kzt-module.jobs-section .job-row .location,
  .kzt-module.jobs-section .job-row .type{
    grid-column: 1/-1; font-size: 14px; opacity: .85;
  }
  .kzt-module.jobs-section .job-row .jobs-cta{
    grid-column: 1/-1; 
    justify-self: start;             /* linksbündig */
    margin-top: 4px;
  }
}

/* Dark-Theme Feinheiten */
.bg-dark .kzt-module.jobs-section .jobs-header{ color: rgba(255,255,255,.7); }
.bg-dark .kzt-module.jobs-section .jobs-rows,
.bg-dark .kzt-module.jobs-section .job-row{ border-color: rgba(255,255,255,.12); }
.bg-dark .kzt-module.jobs-section .job-row:hover{ background: var(--jobs-hover, rgba(255,255,255,.08)); }


/* ================================
   Modul 18 – 3 Column Grid
   ================================ */

/* Wrapper (Layout) */
.three-col-grid .tcg-wrap.grid{
  max-width: var(--kzt-grid-max, 1760px);
  margin: 0 auto;
  padding-left: 0;  /* ✅ FIX: kein seitlicher Gap im Grid */
  padding-right: 0; /* ✅ FIX: kein seitlicher Gap im Grid */
  box-sizing: border-box;
}
.three-col-grid .tcg-wrap.fluid{
  max-width: none;
  margin: 0;
  padding-left: var(--kzt-grid-pad, 20px);
  padding-right: var(--kzt-grid-pad, 20px);
  box-sizing: border-box;
}
.three-col-grid .tcg-wrap.fluid-no-padding{
  max-width: none;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}

/* Header */
.three-col-grid .tcg-header { display: grid; gap: .6rem; }
.three-col-grid .tcg-header.align-left   { text-align: left;   justify-items: start; }
.three-col-grid .tcg-header.align-center { text-align: center; justify-items: center; }
.three-col-grid .tcg-header.align-right  { text-align: right;  justify-items: end; }

.three-col-grid .tcg-topline { margin: 0; }

/* Section-Headline responsive: Größe + Line-Height via Vars */
.three-col-grid .tcg-headline {
  margin: 0;
  font-size: var(--tcg-sec-title-d, 32px);
  line-height: var(--tcg-sec-lh-d, 1.1);
}
@media (max-width: 1024px){
  .three-col-grid .tcg-headline {
    font-size: var(--tcg-sec-title-t, 28px);
    line-height: var(--tcg-sec-lh-t, 1.1);
  }
}
@media (max-width: 720px){
  .three-col-grid .tcg-headline {
    font-size: var(--tcg-sec-title-m, 24px);
    line-height: var(--tcg-sec-lh-m, 1.1);
  }
}

/* Grid */
.three-col-grid .tcg-grid {
  display: grid;
  gap: var(--tcg-gap, 24px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 1024px){
  .three-col-grid .tcg-grid.tcg-tablet-1 { grid-template-columns: 1fr; }
  .three-col-grid .tcg-grid.tcg-tablet-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .three-col-grid .tcg-grid.tcg-tablet-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px){
  .three-col-grid .tcg-grid.tcg-mobile-1 { grid-template-columns: 1fr; }
  .three-col-grid .tcg-grid.tcg-mobile-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Cards */
.three-col-grid .tcg-card{
  border: var(--tcg-card-bw, 1px) solid var(--tcg-card-bc, #e5e5e5);
  border-radius: var(--tcg-radius, 8px);
  overflow: hidden;
  background: var(--tcg-card-bg, #fff);
  color: var(--tcg-card-col, #000);
  display: flex; flex-direction: column;
  box-shadow: var(--tcg-card-shadow, none);
}
.three-col-grid .tcg-card.tcg-equal .tcg-content { flex: 1 1 auto; }
.three-col-grid .tcg-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Card content & text (responsive padding & sizes) */
.three-col-grid .tcg-content {
  padding: var(--tcg-card-py-d,16px) var(--tcg-card-px-d,16px);
  font-size: var(--tcg-c-size-d,16px);
}
.three-col-grid .tcg-title {
  margin: 0 0 var(--tcg-ht-d,10px);
  font-size: var(--tcg-title-d, 18px);
  line-height: 1.15;
}
.three-col-grid .tcg-text  {
  margin: 0 0 var(--tcg-tb-d,15px);
  font-size: inherit;
  line-height: 1.5;
}

@media (max-width: 1024px){
  .three-col-grid .tcg-content { padding: var(--tcg-card-py-t,14px) var(--tcg-card-px-t,14px); font-size: var(--tcg-c-size-t,15px); }
  .three-col-grid .tcg-title   { margin-bottom: var(--tcg-ht-t,9px); font-size: var(--tcg-title-t, 17px); }
  .three-col-grid .tcg-text    { margin-bottom: var(--tcg-tb-t,13px); }
}
@media (max-width: 720px){
  .three-col-grid .tcg-content { padding: var(--tcg-card-py-m,12px) var(--tcg-card-px-m,12px); font-size: var(--tcg-c-size-m,14px); }
  .three-col-grid .tcg-title   { margin-bottom: var(--tcg-ht-m,8px); font-size: var(--tcg-title-m, 16px); }
  .three-col-grid .tcg-text    { margin-bottom: var(--tcg-tb-m,12px); }
}

/* Buttons (inkl. responsive Font-Size) */
.three-col-grid .tcg-btn{
  display:inline-block;
  text-decoration:none;
  background: var(--cb-bg, transparent);
  color: var(--cb-col, #000);
  border: var(--cb-bw,1px) solid var(--cb-bc,currentColor);
  border-radius: var(--cb-r, 9999px);
  padding: var(--cb-py,10px) var(--cb-px,16px);
  letter-spacing: var(--cb-ls, 0);
  line-height: 1;
  font-size: var(--cb-size-d, 14px);
}

@media (max-width: 1024px){
  .three-col-grid .tcg-btn{ font-size: var(--cb-size-t, 13px); }
}
@media (max-width: 720px){
  .three-col-grid .tcg-btn{ font-size: var(--cb-size-m, 12px); }
}

.three-col-grid .tcg-title.underline-on-hover a:hover,
.three-col-grid .tcg-btn.underline-on-hover:hover {
  text-decoration: underline;
  text-underline-offset: .15em;
}

/* Font Awesome Arrow an Card-Buttons */
.three-col-grid .tcg-btn::after{
  content: "\f061";                /* fa-arrow-right */
  display: inline-block;
  margin-left: .5em;
  vertical-align: 0.1em;
  transition: transform .2s ease;
  font-family: "Font Awesome 7 Pro","Font Awesome 6 Pro","Font Awesome 6 Free","Font Awesome 5 Pro", sans-serif;
  font-weight: 400;
  font-size: .65em;
  line-height: 1;
}
.three-col-grid .tcg-btn:hover::after{
  transform: translateX(3px);
}

/* === Patch: Nur Bild zoomen, keinen Kartenschatten === */

/* 1) Karte nicht mehr liften & keinen Schatten */
.three-col-grid .tcg-card{
  box-shadow: none !important;
  transition: none !important;
}
.three-col-grid .tcg-card:hover{
  transform: none !important;
  box-shadow: none !important;
}

/* 2) Bild-Container (Overflow für Zoom) */
.three-col-grid .tcg-media{
  position: relative;
  overflow: hidden;
}

/* 3) Nur das Bild zoomen */
.three-col-grid .tcg-media img{
  transform: scale(1);
  transition: transform .45s ease, filter .45s ease;
  will-change: transform;
}

/* Hover/Fokus: Zoom NUR auf dem Bild */
.three-col-grid .tcg-card:hover .tcg-media img,
.three-col-grid .tcg-media-link:focus img{
  transform: scale(1.06);
}

/* Optional: dezenter Glow-Overlay (ohne Schatten der Karte) */
.three-col-grid .tcg-media::after{
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background:
    radial-gradient(120% 80% at 50% 20%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 40%),
    linear-gradient(to bottom, rgba(0,0,0,0) 60%, rgba(0,0,0,.12) 100%);
  opacity: 0;
  transition: opacity .35s ease;
}
.three-col-grid .tcg-card:hover .tcg-media::after,
.three-col-grid .tcg-media-link:focus::after{
  opacity: 1;
}

/* Tastaturfokus sichtbar belassen */
.three-col-grid .tcg-media-link:focus{
  outline: 2px solid currentColor;
  outline-offset: -2px;
}




/* ================================
   Modul – Two Column Text
   ================================ */

.two-col-text {
  background: rgb(var(--bg-rgba));

  /* responsive Modul-Abstände:
     wir mappen die breakpoint-spezifischen Variablen
     (--mt-*, --mb-*) auf --mst / --msb und nutzen die dann. */
  --mst: var(--mt-m);
  --msb: var(--mb-m);
  padding-top: var(--mst, 0);
  padding-bottom: var(--msb, 0);
}

/* Breakpoint-Mapping für Modul-Abstände */
@media (min-width: 768px) {
  .two-col-text { --mst: var(--mt-t); --msb: var(--mb-t); }
}
@media (min-width: 1024px) {
  .two-col-text { --mst: var(--mt-d); --msb: var(--mb-d); }
}

/* Innerer Wrapper */
.two-col-text .tct-inner {
  display: grid;
  gap: var(--gap, 24px);
}

/* Layout-Modi */
.two-col-text.grid .tct-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}
.two-col-text.fluid .tct-inner {
  max-width: 1600px;
  margin: 0 auto;
  padding-left: var(--container-pad-x, 24px);
  padding-right: var(--container-pad-x, 24px);
}
.two-col-text.full .tct-inner {
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

/* Spalten & Inhalte */
.two-col-text .tct-col .tct-headline { margin: 0 0 .6rem 0; }
.two-col-text .tct-col .tct-content > *:first-child { margin-top: 0; }
.two-col-text .tct-col .tct-content > *:last-child { margin-bottom: 0; }

/* Mobile: untereinander */
@media (max-width: 767px) {
  .two-col-text .tct-inner { grid-template-columns: 1fr; }
}

/* Tablet + Desktop: 2 Spalten */
@media (min-width: 768px) {
  .two-col-text .tct-inner { grid-template-columns: 1fr 1fr; }
}

/* D/T/M – typografische Variablen via data-type */
@media (max-width: 767px) {
  .two-col-text[data-type="dtm"] .tct-col.col-1 .tct-content,
  .two-col-text[data-type="dtm"] .tct-col.col-1 .tct-headline {
    font-size: var(--l-fs-m); line-height: var(--l-lh-m);
  }
  .two-col-text[data-type="dtm"] .tct-col.col-2 .tct-content,
  .two-col-text[data-type="dtm"] .tct-col.col-2 .tct-headline {
    font-size: var(--r-fs-m); line-height: var(--r-lh-m);
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .two-col-text[data-type="dtm"] .tct-col.col-1 .tct-content,
  .two-col-text[data-type="dtm"] .tct-col.col-1 .tct-headline {
    font-size: var(--l-fs-t); line-height: var(--l-lh-t);
  }
  .two-col-text[data-type="dtm"] .tct-col.col-2 .tct-content,
  .two-col-text[data-type="dtm"] .tct-col.col-2 .tct-headline {
    font-size: var(--r-fs-t); line-height: var(--r-lh-t);
  }
}
@media (min-width: 1024px) {
  .two-col-text[data-type="dtm"] .tct-col.col-1 .tct-content,
  .two-col-text[data-type="dtm"] .tct-col.col-1 .tct-headline {
    font-size: var(--l-fs-d); line-height: var(--l-lh-d);
  }
  .two-col-text[data-type="dtm"] .tct-col.col-2 .tct-content,
  .two-col-text[data-type="dtm"] .tct-col.col-2 .tct-headline {
    font-size: var(--r-fs-d); line-height: var(--r-lh-d);
  }
}

/* Clamp-Modus */
.two-col-text[data-type="clamp"] .tct-col.col-1 .tct-content,
.two-col-text[data-type="clamp"] .tct-col.col-1 .tct-headline {
  font-size: var(--l-fs); line-height: var(--l-lh);
}
.two-col-text[data-type="clamp"] .tct-col.col-2 .tct-content,
.two-col-text[data-type="clamp"] .tct-col.col-2 .tct-headline {
  font-size: var(--r-fs); line-height: var(--r-lh);
}

/* PDF-Link */
.two-col-text .tct-pdf-wrap { margin-top: 1rem; }
.two-col-text .tct-pdf {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  text-decoration: none;
  border-bottom: 2px solid currentColor;
  padding-bottom: 2px;
}
.two-col-text .tct-pdf.underline-hover { border-bottom-color: transparent; }
.two-col-text .tct-pdf.underline-hover:hover { border-bottom-color: currentColor; }
.two-col-text .tct-pdf-ic { flex: 0 0 auto; }


/* ===================================
   Modul – Bild/Tabelle
   =================================== */
.image-table-block.itb {
  --it-sidepad: 24px;
  --it-max: 1200px;
  --it-fluid-max: 1600px;
  --it-gap: 2rem;
  --it-border: 2px solid #000;
  --it-radius: 6px;
  --it-box-bg: #fff;
  --it-box-bg-dark: #f7f7f7;

  /* Tabellen-Typo Vars (per PHP gesetzt) */
  --it-table-fs-d: 16px;
  --it-table-fs-t: 15px;
  --it-table-fs-m: 14px;
}

/* Außenabstände via Variablen */
.image-table-block.itb{
  margin-top: var(--msp-top-d);
  margin-bottom: var(--msp-bottom-d);
}
@media (max-width: 1024px){
  .image-table-block.itb{
    margin-top: var(--msp-top-t);
    margin-bottom: var(--msp-bottom-t);
  }
}
@media (max-width: 860px){
  .image-table-block.itb{
    margin-top: var(--msp-top-m);
    margin-bottom: var(--msp-bottom-m);
  }
}

/* Container-Modi */
.image-table-block.itb.grid {
  max-width: var(--it-max);
  margin-left: auto; margin-right: auto;
  padding-left: 20px; padding-right: 20px;
}
.image-table-block.itb.fluid {
  max-width: var(--it-fluid-max);
  margin-left: auto; margin-right: auto;
}
.image-table-block.itb.fluid.has-sidepad {
  padding-left: var(--it-sidepad);
  padding-right: var(--it-sidepad);
}

/* Inneres Layout – Flex, damit Split-Classes sauber greifen */
.image-table-block.itb .itb-inner {
  display: flex;
  gap: var(--it-gap);
  align-items: flex-start;
}
.image-table-block.itb.img-left .itb-media { order: 1; }
.image-table-block.itb.img-left .itb-table { order: 2; }
.image-table-block.itb.img-right .itb-media { order: 2; }
.image-table-block.itb.img-right .itb-table { order: 1; }

/* Spaltenbreiten per Split-Klassen */
.image-table-block.itb .itb-col { min-width: 0; flex: 1 1 0; }
.image-table-block.itb.1-1   .itb-media.col-6 { flex-basis: 50%; }
.image-table-block.itb.1-1   .itb-table.col-6 { flex-basis: 50%; }
.image-table-block.itb.3-2   .itb-media.col-7 { flex-basis: 58.333%; }
.image-table-block.itb.3-2   .itb-table.col-5 { flex-basis: 41.667%; }
.image-table-block.itb.2-3   .itb-media.col-5 { flex-basis: 41.667%; }
.image-table-block.itb.2-3   .itb-table.col-7 { flex-basis: 58.333%; }
.image-table-block.itb.2-1   .itb-media.col-8 { flex-basis: 66.666%; }
.image-table-block.itb.2-1   .itb-table.col-4 { flex-basis: 33.333%; }
.image-table-block.itb.1-2   .itb-media.col-4 { flex-basis: 33.333%; }
.image-table-block.itb.1-2   .itb-table.col-8 { flex-basis: 66.666%; }

/* Bild */
.itb-figure { margin: 0; }
.itb-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--it-radius);
}

/* -----------------------------
   Tabelle: Schriftgrößen
   ----------------------------- */

/* clamp()-Variante: skaliert zwischen Mobile und Desktop */
.image-table-block.itb.clamp-on .itb-table {
  font-size: clamp(
    var(--it-table-fs-m),
    calc( var(--it-table-fs-m) + (var(--it-table-fs-d) - var(--it-table-fs-m)) * ((100vw - 375px) / (1200 - 375)) ),
    var(--it-table-fs-d)
  );
}

/* Breakpoint-Variante (wenn clamp aus) */
.image-table-block.itb.clamp-off .itb-table { font-size: var(--it-table-fs-d); }
@media (max-width: 1024px){
  .image-table-block.itb.clamp-off .itb-table { font-size: var(--it-table-fs-t); }
}
@media (max-width: 860px){
  .image-table-block.itb.clamp-off .itb-table { font-size: var(--it-table-fs-m); }
}

/* Tabelle mit Außenrahmen + Spalten-Trennern */
.itb-table-title { margin: .25rem 0 .75rem; }
.itb-table-wrap { overflow-x: auto; }
.itb-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
}
.itb-table th,
.itb-table td {
  border: var(--it-border);
  padding: .65rem .9rem;
  vertical-align: top;
}
.itb-table th {
  width: 40%;
  text-align: left;
  font-weight: 100!important;
  white-space: nowrap;
}
/* optional runde Ecken:
.itb-table { border-radius: var(--it-radius); overflow: hidden; }
*/

/* Info-Box */
.itb-infobox {
  margin-top: 1.25rem;
  padding: 1.25rem 1.25rem;
  border: var(--it-border);
  border-radius: var(--it-radius);
  background: var(--it-box-bg);
  font-family: var(--font-sans);
}
.itb-box-title { font-weight: 600; margin-bottom: .35rem; }
.itb-box-text p { margin: .25rem 0 .5rem; }

.itb-price-line {
  margin-top: .5rem;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  display: flex;
  gap: .5rem;
  align-items: baseline;
}
.itb-price-label { opacity: .8; }
.itb-price-value { font-weight: 700; }

.itb-contact {
  margin-top: .75rem;
  font-size: .95rem;
}
.itb-contact a { text-decoration: underline; }
.itb-contact .itb-sep { opacity: .6; margin: 0 .25rem; }

/* Mobile Layout */
@media (max-width: 860px) {
  .image-table-block.itb .itb-inner { display: grid; grid-template-columns: 1fr; }
  .image-table-block.itb .itb-col { flex-basis: auto !important; }

  .image-table-block.itb.m-img-first .itb-media { order: 1; }
  .image-table-block.itb.m-img-first .itb-table { order: 2; }
  .image-table-block.itb.m-tbl-first .itb-table { order: 1; }
  .image-table-block.itb.m-tbl-first .itb-media { order: 2; }

  .itb-table th { width: 45%; }
}

/* Dark-ish Background Support */
:root.dark-mode .itb-infobox { background: var(--it-box-bg-dark); }


/* =======================
   Submenue Adds 	       
   ======================= */

/* Scroll sperren, wenn Submenü offen ist */
body.has-submenu-open {
  overflow: hidden;
}

/* iOS: verhindert „Gummiband“-Scrollen auf dem Backdrop */
.submenu-backdrop {
  touch-action: none;
}



/* ================================
   Modul — Headline + Text (2-Column)
   ================================ */

/* Struktur/BG/Spacing – FIX: Global-Spacings immer über --module-mt/mb (D/T/M) */
.headline-text-section {
  --ht-col-gap: 40px;
  --ht-breakpoint: 1024px;
  --ht-maxw: 1200px;
}

.headline-text-section.bg-white { background:#fff; color: var(--color-text,#1a1a1a); }
.headline-text-section.bg-gray  { background:#f5f5f5; color: var(--color-text,#1a1a1a); }
.headline-text-section.bg-dark  { background:#1a1a1a; color:#fff; }
.headline-text-section.bg-transparent { background:transparent; }

.headline-text-section.grid .ht-inner { margin:0 auto; max-width:var(--ht-maxw); }
.headline-text-section.fluid .ht-inner { margin:0 auto; max-width:100%; padding-left: clamp(16px,3vw,40px); padding-right: clamp(16px,3vw,40px); }
.headline-text-section.fluid-no-padding .ht-inner { margin:0; max-width:100%; padding-left:0; padding-right:0; }

/* WICHTIG: Container-Queries/Units aktivieren */
.headline-text-section .ht-inner { container-type: inline-size; }

/* Außenabstände — FIX
   -> egal ob global/custom: PHP setzt immer --module-mt/mb-* korrekt */
.headline-text-section { padding-top: var(--module-mt-d,0); padding-bottom: var(--module-mb-d,0); }
@media (max-width:1024px){
  .headline-text-section { padding-top: var(--module-mt-t, var(--module-mt-d,0)); padding-bottom: var(--module-mb-t, var(--module-mb-d,0)); }
}
@media (max-width:640px){
  .headline-text-section { padding-top: var(--module-mt-m, var(--module-mt-t,0)); padding-bottom: var(--module-mb-m, var(--module-mb-t,0)); }
}

/* Grid */
.ht-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--ht-col-gap); align-items:start; }
@media (max-width:1024px){ .ht-grid { grid-template-columns:1fr; gap: clamp(16px,4vw,var(--ht-col-gap)); } }

/* Mobile order */
.headline-text-section.mobile-text-first .ht-left { order:2; }
.headline-text-section.mobile-text-first .ht-right { order:1; }

/* Resets */
.ht-headline { margin:0; }
.ht-headline__inner { display:block; }
.ht-text p { margin:0 0 1em 0; }
.ht-text p:last-child { margin-bottom:0; }

/*HT Text Link Style*/

.ht-text a {color: #c7002b!important;}


/* =========================================================
   IMAGE CAPTION GRID (GCS)
   Komplett – clean & konsolidiert (RFCP)
   ========================================================= */

@media (min-width: 1024px){
  .kzt-icg__media--video.is-portrait video{
    object-fit: contain !important;
  }
}

.kzt-icg {
  position: relative;
  background: transparent;

  /* Outer spacing (kommt vom spacing-presets Snippet) */
  padding-top: var(--kzt-icg-space-top-d, 0px);
  padding-bottom: var(--kzt-icg-space-bot-d, 0px);
}

/* Backgrounds */
.kzt-icg.bg-white { background: #ffffff; }
.kzt-icg.bg-gray { background: #f5f5f5; }
.kzt-icg.bg-dark { background: #000000; color: #ffffff; }
.kzt-icg.bg-transparent { background: transparent; }
.kzt-icg.bg-custom { background: var(--kzt-icg-bg, transparent); }

@media (max-width: 1023px) {
  .kzt-icg {
    padding-top: var(--kzt-icg-space-top-t, 0px);
    padding-bottom: var(--kzt-icg-space-bot-t, 0px);
  }
}

@media (max-width: 767px) {
  .kzt-icg {
    padding-top: var(--kzt-icg-space-top-m, 0px);
    padding-bottom: var(--kzt-icg-space-bot-m, 0px);
  }
}

/* =========================================================
   Container / Inner
   ========================================================= */

.kzt-icg__container { width: 100%; }

.kzt-icg__inner {
  padding: var(--kzt-icg-pad-d, 0px);
}
@media (max-width: 1023px) {
  .kzt-icg__inner { padding: var(--kzt-icg-pad-t, 0px); }
}
@media (max-width: 767px) {
  .kzt-icg__inner { padding: var(--kzt-icg-pad-m, 0px); }
}

/* =========================================================
   Grid
   ========================================================= */

.kzt-icg__grid {
  display: grid;
  grid-template-columns: repeat(var(--kzt-icg-cols-d, 3), minmax(0, 1fr));
  gap: var(--kzt-icg-gap-d, 24px);
}

@media (max-width: 1023px) {
  .kzt-icg__grid {
    grid-template-columns: repeat(var(--kzt-icg-cols-t, 2), minmax(0, 1fr));
    gap: var(--kzt-icg-gap-t, 18px);
  }
}

@media (max-width: 767px) {
  .kzt-icg__grid {
    grid-template-columns: repeat(var(--kzt-icg-cols-m, 1), minmax(0, 1fr));
    gap: var(--kzt-icg-gap-m, 14px);
  }
}

.kzt-icg__item {
  margin: 0;
  min-width: 0;
}

.kzt-icg__item-inner {
  min-width: 0;
}

/* =========================================================
   Split vs Stack (kommt aus PHP: is-split / is-stack)
   ========================================================= */

.kzt-icg.is-stack .kzt-icg__item-inner {
  display: block;
}

.kzt-icg.is-split .kzt-icg__item-inner {
  display: grid;
  grid-template-columns:
    var(--kzt-icg-split-left, 50%)
    var(--kzt-icg-split-right, 50%);
  gap: var(--kzt-icg-gap-d, 24px);
  align-items: start;
}

@media (max-width: 1023px) {
  .kzt-icg.is-split .kzt-icg__item-inner {
    gap: var(--kzt-icg-gap-t, 18px);
  }
}

@media (max-width: 767px) {
  .kzt-icg.is-split .kzt-icg__item-inner {
    grid-template-columns: 1fr;
    gap: var(--kzt-icg-gap-m, 14px);
  }

  .kzt-icg.is-split.mobile-text-first .kzt-icg__media-wrap { order: 2; }
  .kzt-icg.is-split.mobile-text-first .kzt-icg__content    { order: 1; }

  .kzt-icg.is-split.mobile-media-first .kzt-icg__media-wrap { order: 1; }
  .kzt-icg.is-split.mobile-media-first .kzt-icg__content    { order: 2; }
}

/* =========================================================
   Media (Overflow/Radius FIX – auch wenn <a>)
   ========================================================= */

.kzt-icg__media {
  display: block;                 /* FIX: <a> darf nicht inline bleiben */
  position: relative;
  width: 100%;
  overflow: hidden;               /* FIX: bleibt auch im Link-Fall aktiv */
  border-radius: var(--kzt-icg-radius, 0px);
  -webkit-mask-image: -webkit-radial-gradient(white, black); /* Safari rounding-guard */
}

.kzt-icg__media picture {
  display: block;                 /* FIX: picture inline -> overflow wirkt komisch */
  width: 100%;
  height: 100%;
}

.kzt-icg__media img,
.kzt-icg__media video,
.kzt-icg__poster {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: var(--kzt-icg-fit, cover);
  object-position: center center;
  border-radius: inherit;
}

/* =========================================================
   Aspect Ratios – Desktop
   ========================================================= */

.kzt-icg.is-auto   .kzt-icg__media { aspect-ratio: auto; }
.kzt-icg.is-square .kzt-icg__media { aspect-ratio: 1 / 1; }
.kzt-icg.is-4-3    .kzt-icg__media { aspect-ratio: 4 / 3; }
.kzt-icg.is-16-9   .kzt-icg__media { aspect-ratio: 16 / 9; }
.kzt-icg.is-3-4    .kzt-icg__media { aspect-ratio: 3 / 4; }
.kzt-icg.is-9-16   .kzt-icg__media { aspect-ratio: 9 / 16; }
.kzt-icg.is-4-5    .kzt-icg__media { aspect-ratio: 4 / 5; }
.kzt-icg.is-5-4    .kzt-icg__media { aspect-ratio: 5 / 4; }

/* =========================================================
   Aspect Ratios – Mobile
   ========================================================= */

@media (max-width: 767px) {
  .kzt-icg.is-m-auto   .kzt-icg__media { aspect-ratio: auto; }
  .kzt-icg.is-m-square .kzt-icg__media { aspect-ratio: 1 / 1; }
  .kzt-icg.is-m-4-3    .kzt-icg__media { aspect-ratio: 4 / 3; }
  .kzt-icg.is-m-3-4    .kzt-icg__media { aspect-ratio: 3 / 4; }
  .kzt-icg.is-m-4-5    .kzt-icg__media { aspect-ratio: 4 / 5; }
  .kzt-icg.is-m-16-9   .kzt-icg__media { aspect-ratio: 16 / 9; }
  .kzt-icg.is-m-9-16   .kzt-icg__media { aspect-ratio: 9 / 16; }
  .kzt-icg.is-m-5-4    .kzt-icg__media { aspect-ratio: 5 / 4; }
}

/* =========================================================
   Hover Zoom + Dimm (nur Desktop Pointer)
   ========================================================= */

@media (hover: hover) and (pointer: fine) {

  .kzt-icg.has-hover-zoom .kzt-icg__media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: rgba(0,0,0,0);
    transition: background 240ms ease;
    border-radius: inherit;
  }

  .kzt-icg.has-hover-zoom .kzt-icg__media img,
  .kzt-icg.has-hover-zoom .kzt-icg__media video {
    transform: scale(1);
    transition: transform 240ms ease, filter 240ms ease;
    will-change: transform;
  }

  .kzt-icg.has-hover-zoom .kzt-icg__media:hover img,
  .kzt-icg.has-hover-zoom .kzt-icg__media:hover video {
    transform: scale(var(--kzt-icg-zoom-scale, 1.03));
    filter: brightness(0.9);
  }

  .kzt-icg.has-hover-zoom .kzt-icg__media:hover::after {
    background: rgba(0,0,0,0.12);
  }
}

/* =========================================================
   Video
   ========================================================= */

.kzt-icg__media--video { cursor: pointer; }

.kzt-icg__poster-fallback{
  width: 100%;
  padding-top: 56.25%;
  background: rgba(0,0,0,.08);
  border-radius: var(--kzt-icg-radius, 0px);
}

/* Play button */
.kzt-icg__play{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
}
.kzt-icg__play-icon{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  backdrop-filter: blur(6px);
  background: rgba(0,0,0,.35);
  position: relative;
}
.kzt-icg__play-icon::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-40%, -50%);
  width: 0;
  height: 0;
  border-left: 14px solid rgba(255,255,255,.95);
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
}

/* =========================================================
   Caption / Text
   ========================================================= */

.kzt-icg__cap,
.kzt-icg__text,
.kzt-icg__pdf { text-align: var(--kzt-icg-align, left);}


.kzt-icg__cap {}



.kzt-icg__cap {
  margin: 0;
  margin-top: var(--kzt-icg-cap-gap-d, 10px);
  font-size: var(--kzt-icg-cap-size-d, 16px);
  line-height: var(--kzt-icg-cap-lh-d, 1.3);
  font-weight: var(--kzt-icg-cap-weight, 600);
  letter-spacing: var(--kzt-icg-cap-ls-d, 0em);
  color: var(--kzt-icg-cap-color, inherit);
}

@media (max-width: 1023px) {
  .kzt-icg__cap {
    margin-top: var(--kzt-icg-cap-gap-t, 8px);
    font-size: var(--kzt-icg-cap-size-t, 15px);
    line-height: var(--kzt-icg-cap-lh-t, 1.3);
    letter-spacing: var(--kzt-icg-cap-ls-t, 0em);
  }
}

@media (max-width: 767px) {
  .kzt-icg__cap {
    margin-top: var(--kzt-icg-cap-gap-m, 6px);
    font-size: var(--kzt-icg-cap-size-m, 14px);
    line-height: var(--kzt-icg-cap-lh-m, 1.3);
    letter-spacing: var(--kzt-icg-cap-ls-m, 0em);
  }
}

/* Caption link */
.kzt-icg__cap-link{
  color: inherit;
  text-decoration: none;
  text-underline-offset: 3px;
}
@media (hover:hover) and (pointer:fine){
  .kzt-icg__cap-link:hover{
    text-decoration: underline;
  }
}

/* Text */
.kzt-icg__text {
  margin-top: var(--kzt-icg-text-gap-d, 6px);
  font-size: var(--kzt-icg-text-size-d, 14px);
  line-height: var(--kzt-icg-text-lh-d, 1.5);
  font-weight: var(--kzt-icg-text-weight, 400);
  letter-spacing: var(--kzt-icg-text-ls-d, 0em);
  color: var(--kzt-icg-text-color, inherit);
}
.kzt-icg__text p { margin: 0; }
.kzt-icg__text p + p { margin-top: 8px; }

/* PDF */
.kzt-icg__pdf { margin-top: 10px; }

.kzt-icg__pdf-link {
  color: currentColor;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}



/* ============================
   MODUL — TEXT/TEXT 
   ============================ */

.text-text-block {
  position: relative;
  overflow: clip;

  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

  padding-top: var(--tt-space-top-d, 60px);
  padding-bottom: var(--tt-space-bot-d, 60px);
}

/* Wrapper bekommt nur Grid/Fluid Klassen (dein KZT Layout-System) */
.text-text-block .text-text-wrap {
  width: 100%;
}

/* Das ist die echte Spalten-Row — hier MUSS gap greifen */
.text-text-block .tt-inner {
  display: flex;
  gap: var(--tt-gap-d, 40px);
  align-items: center;
}

/* Vertikale Ausrichtung (Row) */
.text-text-block.align-top .tt-inner { align-items: flex-start; }
.text-text-block.align-center .tt-inner { align-items: center; }
.text-text-block.align-bottom .tt-inner { align-items: flex-end; }

/* Text Align */
.text-text-block.text-left   .tt-col { text-align: left; }
.text-text-block.text-center .tt-col { text-align: center; }
.text-text-block.text-right  .tt-col { text-align: right; }

/* Columns */
.text-text-block .tt-col { box-sizing: border-box; min-width: 0; }
.text-text-block .tt-col-left  { width: var(--tt-left-w, 50%); }
.text-text-block .tt-col-right { width: var(--tt-right-w, 50%); }

/* Divider */
.text-text-block .tt-divider {
  flex: 0 0 auto;
  align-self: stretch;
  width: var(--tt-div-w, 1px);
  background: var(--tt-div-c, #dddddd);
}
.text-text-block:not(.has-divider) .tt-divider { display: none; }

/* ============================
   TYPO + FARBEN
   ============================ */

/* Headline */
.text-text-block .headline {
  font-family: var(--tt-head-ff, var(--font-bold));
  margin: 0 0 var(--tt-ht-gap-d, 18px) 0;
  font-size: var(--tt-head-d, 44px);
  line-height: var(--tt-head-lh-d, 1.1);
  color: var(--tt-head-c, currentColor);
}

/* Text */
.text-text-block .text-content {
  font-family: var(--font-sans);
  font-size: var(--tt-text-d, 17px);
  color: var(--tt-text-c, currentColor);
}

/* Linkfarbe (Content + “Button”-Textlink) */
.text-text-block .text-content a,
.text-text-block .tt-btn {
  color: var(--tt-link-c, inherit);
}

/* “Button” als Textlink */
.text-text-block .tt-btn-wrap { margin-top: 18px; }

.text-text-block .tt-btn {
  text-decoration: underline;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
}
.text-text-block .tt-btn:hover,
.text-text-block .tt-btn:focus-visible {
  text-decoration: none;
}

/* ============================
   LISTEN: eingerückt + robust
   ============================ */

.text-text-block .text-content ul,
.text-text-block .text-content ol {
  margin: 0;
  padding-left: 1.25em;
  list-style-position: outside;
}

.text-text-block .text-content ul { margin-top: 0.6em; }
.text-text-block .text-content ol { margin-top: 0.6em; }

.text-text-block .text-content li { margin: 0.25em 0; }

/* LISTEN: iOS-Safari Fix */
.text-text-block .text-content li > p {
  margin: 0;
  display: block;
}

.text-text-block .text-content li > p + p {
  margin-top: 0.35em;
}

/* ============================
   TABLET
   ============================ */

@media (max-width: 1024px) {
  .text-text-block {
    padding-top: var(--tt-space-top-t, 50px);
    padding-bottom: var(--tt-space-bot-t, 50px);
  }

  .text-text-block .tt-inner {
    gap: var(--tt-gap-t, 30px);
  }

  .text-text-block .headline {
    margin-bottom: var(--tt-ht-gap-t, 16px);
    font-size: var(--tt-head-t, 36px);
    line-height: var(--tt-head-lh-t, 1.1);
  }

  .text-text-block .text-content {
    font-size: var(--tt-text-t, 17px);
  }
}

/* ============================
   MOBILE
   ============================ */

@media (max-width: 768px) {

  /* FIX iOS Safari: bullets werden bei overflow:clip gerne weggeclippt */
  .text-text-block {
    overflow: visible;
  }

  .text-text-block {
    padding-top: var(--tt-space-top-m, 40px);
    padding-bottom: var(--tt-space-bot-m, 40px);
  }

  .text-text-block .tt-inner {
    flex-direction: column;
    gap: 0;
    align-items: stretch;
  }

  /* Abstand zwischen den beiden Textblöcken (Mobile) */
  .text-text-block .tt-col-left {
    margin-bottom: var(--tt-block-gap-m, 28px);
  }

  /* Mobile Reverse */
  .text-text-block.mobile-reverse .tt-inner {
    flex-direction: column-reverse;
  }

  .text-text-block.mobile-reverse .tt-col-left {
    margin-bottom: 0;
  }

  .text-text-block.mobile-reverse .tt-col-right {
    margin-bottom: var(--tt-block-gap-m, 28px);
  }

  .text-text-block .tt-col-left,
  .text-text-block .tt-col-right {
    width: 100%;
  }

  .text-text-block .tt-divider {
    display: none;
  }

  .text-text-block .headline {
    margin-bottom: var(--tt-ht-gap-m, 14px);
    font-size: var(--tt-head-m, 30px);
    line-height: var(--tt-head-lh-m, 1.1);
  }

  .text-text-block .text-content {
    font-size: var(--tt-text-m, 17px);
  }
}

/* ============================
   #kzt #ftype — wie intro.php
   ============================ */

.text-text-block[data-ft-head="1"] .headline {
  font-size: var(--tt-head-override, clamp(
    var(--tt-head-m, 30px),
    calc(
      var(--tt-head-m, 30px) + (var(--tt-head-d, 44px) - var(--tt-head-m, 30px))
      * ((100vw - var(--tt-ft-vw-min, 1024px)) / (var(--tt-ft-vw-max, 1760px) - var(--tt-ft-vw-min, 1024px)))
    ),
    var(--tt-head-d, 44px)
  ));
}

.text-text-block[data-ft-text="1"] .text-content {
  font-size: var(--tt-text-override, clamp(
    var(--tt-text-m, 17px),
    calc(
      var(--tt-text-m, 17px) + (var(--tt-text-d, 17px) - var(--tt-text-m, 17px))
      * ((100vw - var(--tt-ft-vw-min, 1024px)) / (var(--tt-ft-vw-max, 1760px) - var(--tt-ft-vw-min, 1024px)))
    ),
    var(--tt-text-d, 17px)
  ));
}

/*Dark/Light-Mode Switch*/


.kzt-theme-toggle{ 
  font-family: var(--font-fa)!important;
  appearance: none !important;
  
  background: transparent !important;
  color: var(--menu-col, currentColor) !important;

  line-height: 1 !important;
  padding: 7px 10px !important;

  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
}




/* ============================
   Image-Slider
   ============================ */

.image-slider {
  padding-top: var(--mod-pt, 0px) !important;
  padding-bottom: var(--mod-pb, 0px) !important;
}

.image-slider .image-slider-viewport {
  width: 100%;
  overflow: hidden;
  position: relative;
  touch-action: pan-y;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
}

.image-slider .image-slider-viewport.is-dragging {
  cursor: grabbing;
}

.image-slider .image-slider-track {
  display: flex;
  align-items: stretch;
  gap: var(--is-gap-d);
  width: max-content;
  will-change: transform;
  transform: translate3d(0, 0, 0);
}

.image-slider .image-slider-set {
  display: flex;
  align-items: stretch;
  gap: var(--is-gap-d);
  flex-shrink: 0;
}

.image-slider .image-slider-card {
  width: var(--is-slide-w-d);
  height: var(--is-slide-h-d);
  margin: 0;
  overflow: hidden;
  border-radius: var(--is-radius);
  background: #f2f2f2;
  flex-shrink: 0;
}

.image-slider .image-slider-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--is-object-position);
  pointer-events: none;
}

.image-slider:not(.is-ready) .image-slider-track {
  opacity: 0;
}

.image-slider.is-ready .image-slider-track {
  opacity: 1;
  transition: opacity 0.2s ease;
}

@media (max-width: 1023px) {
  .image-slider {
    padding-top: var(--mod-pt-t, var(--mod-pt, 0px)) !important;
    padding-bottom: var(--mod-pb-t, var(--mod-pb, 0px)) !important;
  }

  .image-slider .image-slider-track,
  .image-slider .image-slider-set {
    gap: var(--is-gap-t);
  }

  .image-slider .image-slider-card {
    width: var(--is-slide-w-t);
    height: var(--is-slide-h-t);
  }
}

@media (max-width: 767px) {
  .image-slider {
    padding-top: var(--mod-pt-m, var(--mod-pt-t, var(--mod-pt, 0px))) !important;
    padding-bottom: var(--mod-pb-m, var(--mod-pb-t, var(--mod-pb, 0px))) !important;
  }

  .image-slider .image-slider-track,
  .image-slider .image-slider-set {
    gap: var(--is-gap-m);
  }

  .image-slider .image-slider-card {
    width: var(--is-slide-w-m);
    height: var(--is-slide-h-m);
  }
}


/* =========================
   Kontakt / Premium Formular
   ========================= */

.contact-page{
  background: #EEE9E6;
  color: #0B5A22;
}

.contact-hero{
  padding-top: 180px;
  padding-bottom: 60px;
}

.contact-hero__inner{
  max-width: 1200px;
}

.contact-hero__eyebrow{
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.2;
  color: #0B5A22;
}

.contact-hero__title{
  margin: 0;
  font-size: clamp(52px, 6vw, 96px);
  line-height: 0.95;
  letter-spacing: -0.03em;
  color: #0B5A22;
}

.contact-hero__text{
  max-width: 1180px;
  margin-top: 42px;
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.25;
  color: #0B5A22;
}

.contact-form-section{
  padding-bottom: 120px;
}

.premium-application{
  width: 100%;
}

.premium-application__inner{
  width: 100%;
}

.premium-form__grid{
  display: grid;
  gap: 26px;
}

.premium-card{
  background: rgba(255,255,255,0.32);
  border: 1px solid rgba(11, 90, 34, 0.10);
  border-radius: 22px;
  padding: 28px;
  backdrop-filter: blur(6px);
}

.premium-card--split{
  padding-bottom: 30px;
}

.premium-card__head{
  margin-bottom: 22px;
}

.premium-card__head h2{
  margin: 0;
  font-size: clamp(28px, 2vw, 34px);
  line-height: 1.05;
  color: #0B5A22;
}

.premium-card__head p{
  margin: 10px 0 0;
  font-size: 16px;
  line-height: 1.45;
  color: rgba(11, 90, 34, 0.78);
}

.premium-fields{
  display: grid;
  gap: 18px;
}

.premium-fields--2col{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.premium-field{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.premium-field--full{
  grid-column: 1 / -1;
}

.premium-field label{
  font-size: 15px;
  line-height: 1.2;
  color: #0B5A22;
}

.premium-field input,
.premium-field textarea{
  width: 100%;
  appearance: none;
  border: 1px solid transparent;
  border-radius: 16px;
  background: rgba(255,255,255,0.72);
  padding: 18px 20px;
  font-size: 17px;
  line-height: 1.3;
  color: #0B5A22;
  font-family: inherit;
  font-weight: inherit;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}


.premium-field textarea{
  min-height: 220px;
  resize: vertical;
  font-family: inherit;
}

/*.contact-page,*/
.contact-page input,
.contact-page textarea
/*.contact-page button,*/
/*.contact-page select*/{
  font-family: var(--font-regular, inherit);
}

.premium-field input::placeholder,
.premium-field textarea::placeholder{
  color: rgba(11, 90, 34, 0.45);
}

.premium-field input:focus,
.premium-field textarea:focus{
  outline: none;
  background: rgba(255,255,255,0.95);
  border-color: rgba(11, 90, 34, 0.25);
  box-shadow: 0 0 0 4px rgba(11, 90, 34, 0.08);
}

.choice-group{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.choice-chip{
  appearance: none;
  border: 1px solid rgba(11, 90, 34, 0.14);
  background: rgba(255,255,255,0.68);
  color: #0B5A22;
  border-radius: 999px;
  padding: 14px 18px;
  min-height: 52px;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .18s ease, box-shadow .2s ease;
}

.choice-chip:hover{
  transform: translateY(-1px);
  border-color: rgba(11, 90, 34, 0.25);
  background: rgba(255,255,255,0.92);
}

.choice-chip.is-active{
  background: #0B5A22;
  color: #fff;
  border-color: #0B5A22;
  box-shadow: 0 8px 20px rgba(11, 90, 34, 0.12);
}

.choice-chip--small{
  min-width: 52px;
  justify-content: center;
  padding-inline: 16px;
}

.availability-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.availability-card{
  background: rgba(255,255,255,0.52);
  border: 1px solid rgba(11, 90, 34, 0.08);
  border-radius: 18px;
  padding: 18px;
  transition: transform .18s ease, border-color .2s ease, background .2s ease;
}

.availability-card:hover{
  transform: translateY(-2px);
  border-color: rgba(11, 90, 34, 0.18);
}

.availability-card__title{
  margin-bottom: 14px;
  font-size: 22px;
  line-height: 1.1;
  color: #0B5A22;
}

.availability-card__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.choice-chip--availability{
  min-width: 140px;
}

.premium-card--final{
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.premium-checkbox{
  display: inline-flex;
  align-items: flex-start;
  gap: 14px;
  cursor: pointer;
}

.premium-checkbox input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.premium-checkbox__box{
  position: relative;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  margin-top: 1px;
  border-radius: 7px;
  border: 1px solid rgba(11, 90, 34, 0.22);
  background: rgba(255,255,255,0.72);
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.premium-checkbox input:checked + .premium-checkbox__box{
  background: #0B5A22;
  border-color: #0B5A22;
}

.premium-checkbox input:checked + .premium-checkbox__box::after{
  content: "";
  position: absolute;
  left: 8px;
  top: 4px;
  width: 6px;
  height: 11px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}

.premium-checkbox__text{
  font-size: 18px;
  line-height: 1.4;
  color: #0B5A22;
}

.premium-submit{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

.premium-submit__button{
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: #ED1C2E;
  color: #fff;
  min-height: 52px;
  padding: 0 28px;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .2s ease, opacity .2s ease;
  font-family: var(--font-regular, inherit);
}

.premium-submit__button:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(237, 28, 46, 0.18);
}

.premium-submit__info{
  margin: 0;
  font-size: 15px;
  line-height: 1.45;
  color: #0B5A22;
}

.form-notice{
  border-radius: 22px;
  padding: 28px;
  margin-bottom: 24px;
}

.form-notice--success{
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(11, 90, 34, 0.12);
  color: #0B5A22;
}

.form-notice--error{
  background: rgba(237, 28, 46, 0.06);
  border: 1px solid rgba(237, 28, 46, 0.16);
  color: #8B1320;
}

.form-notice h2,
.form-notice p{
  margin: 0;
}

.form-notice h2{
  margin-bottom: 8px;
  font-size: 30px;
  line-height: 1.05;
}

.field-error{
  display: inline-block;
  font-size: 14px;
  line-height: 1.35;
  color: #B31628;
}

.field-error--block{
  margin-top: 10px;
}

.is-error .choice-chip,
.premium-field.is-error input,
.premium-field.is-error textarea,
.premium-privacy.is-error .premium-checkbox__box,
.premium-card.is-error{
  border-color: rgba(179, 22, 40, 0.42);
}

.honeypot{
  position: absolute !important;
  left: -9999px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Responsive */

@media (max-width: 1024px){
  .contact-hero{
    padding-top: 150px;
    padding-bottom: 48px;
  }

  .premium-fields--2col{
    grid-template-columns: 1fr;
  }

  .availability-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px){
  .contact-hero{
    padding-top: 120px;
    padding-bottom: 38px;
  }

  .contact-hero__text{
    margin-top: 24px;
    font-size: 20px;
  }

  .premium-card{
    padding: 20px;
    border-radius: 18px;
  }

  .availability-grid{
    grid-template-columns: 1fr;
  }

  .availability-card__title{
    font-size: 20px;
  }

  .choice-chip{
    width: 100%;
    justify-content: center;
  }

  .choice-chip--availability{
    min-width: 0;
  }

  .premium-checkbox__text{
    font-size: 16px;
  }

  .premium-submit__button{
    width: 100%;
    justify-content: center;
  }
}

/* Advanced Form Styling*/

.premium-field input:focus,
.premium-field textarea:focus{
  transform: translateY(-1px);
}

.choice-chip{
  position: relative;
}

.choice-chip:active{
  transform: scale(0.97);
}
	
.availability-card:hover{
  box-shadow: 0 12px 30px rgba(11, 90, 34, 0.08);
}

.premium-submit__button{
  font-weight: 600;
  letter-spacing: 0.02em;
}



.contact-page.kzt-module{
  padding-top: var(--kzt-space-top, 0) !important;
  padding-bottom: var(--kzt-space-bot, 0) !important;
}