@charset "UTF-8";
/* CSS Document */

/*
Theme Name: Essinger Wohnbau Custom
Author: Werbeagentur Hüper GmbH – Stefan Wiebel & Florian Auchter
Author URI: https://www.hueper.de/
Description: A custom template build especially for Essinger Wohnbau.
Version: 1.4
Text Domain: custom-essinger
Copyright: © 2026 by Stefan Wiebel & Florian Auchter – Werbeagentur Hüper GmbH
*/

/***** variables *****/
:root {
  /* --- Typescale Gen für responsive Fontsizes: @link https://utopia.fyi/type/calculator?c=360,16,1.2,1200,20,1.2,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6|8,2xl-4xl|xl-3xl|l-2xl|m-xl|s-l|xs-m|2xs-s|3xs-xs&g=s,l,xl,12 --- */
  /* --- Skala Major Third (1.25er Ratio) --- */
  --h1: clamp(
    2.4883rem,
    2.2217rem + 1.1849vw,
    3.1104rem
  ); /* 39.8131px → 49.7664px */
  --h2: clamp(
    2.0736rem,
    1.8514rem + 0.9874vw,
    2.592rem
  ); /* 33.1776px → 41.472px */
  --h3: clamp(1.728rem, 1.5429rem + 0.8229vw, 2.16rem); /* 27.648px → 34.56px */
  --h4: clamp(1.44rem, 1.2857rem + 0.6857vw, 1.8rem); /* 23.04px → 28.8px */
  --h5: clamp(1.2rem, 1.0714rem + 0.5714vw, 1.5rem); /* 19.2px → 24px */

  --text-normal: clamp(1rem, 0.8929rem + 0.4762vw, 1.25rem); /* 16px → 20px */
  --text-sm: clamp(
    0.8333rem,
    0.744rem + 0.3968vw,
    1.0417rem
  ); /* 13.3333px → 16.6667px */
  --text-xs: clamp(
    0.6944rem,
    0.62rem + 0.3307vw,
    0.8681rem
  ); /* 11.1111px → 13.8889px */

  /* --- Spacer Gen responsive (ebenfalls utopia) @link https://utopia.fyi/space/calculator?c=360,16,1.2,1200,20,1.2,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6|8,2xl-4xl|xl-3xl|l-2xl|m-xl|s-l|xs-m|2xs-s|3xs-xs&g=s,l,xl,12 --- */
  --xl: clamp(4rem, 1.4286rem + 11.4286vw, 10rem); /* 64px → 160px */
  --lg: clamp(3rem, 1.0714rem + 8.5714vw, 7.5rem); /* 48px → 120px */
  --md: clamp(1.5rem, 0.5357rem + 4.2857vw, 3.75rem); /* 24px → 60px */
  --sm: clamp(0.75rem, 0.2679rem + 2.1429vw, 1.875rem); /* 12px → 30px */
  --xs: clamp(0.25rem, -0.0446rem + 1.3095vw, 0.9375rem); /* 4px → 15px */

  /* -- Shadows -- */
  --shadow-xl: 0px 48px 100px 0px rgba(0, 0, 0, 0.15);
}

.shadow-xl {
  box-shadow: var(--shadow-xl);
}

/***** text mark colors *****/
::-moz-selection {
  color: #fff;
  background: #a50000;
}

::selection {
  color: #fff;
  background: #a50000;
}

/***** fonts *****/
/* TT Neoris Pro Light - normal */
@font-face {
  font-display: swap;
  font-family: "TT Neoris Pro";
  font-style: normal;
  font-weight: 300;
  src: url("assets/fonts/TT_Neoris_Pro_Light.woff2") format("woff2"),
    url("assets/fonts/TT_Neoris_Pro_Light.ttf") format("truetype");
}

/* TT Neoris Pro Light - italic */
@font-face {
  font-display: swap;
  font-family: "TT Neoris Pro";
  font-style: italic;
  font-weight: 300;
  src: url("assets/fonts/TT_Neoris_Pro_Light_Italic.woff2") format("woff2"),
    url("assets/fonts/TT_Neoris_Pro_Light_Italic.ttf") format("truetype");
}

/* TT Neoris Pro Regular - normal */
@font-face {
  font-display: swap;
  font-family: "TT Neoris Pro";
  font-style: normal;
  font-weight: 400;
  src: url("assets/fonts/TT_Neoris_Pro_Regular.woff2") format("woff2"),
    url("assets/fonts/TT_Neoris_Pro_Regular.ttf") format("truetype");
}

/* TT Neoris Pro Regular - italic */
@font-face {
  font-display: swap;
  font-family: "TT Neoris Pro";
  font-style: italic;
  font-weight: 400;
  src: url("assets/fonts/TT_Neoris_Pro_Regular_Italic.woff2") format("woff2"),
    url("assets/fonts/TT_Neoris_Pro_Regular_Italic.ttf") format("truetype");
}

/* TT Neoris Pro Medium - normal */
@font-face {
  font-display: swap;
  font-family: "TT Neoris Pro";
  font-style: normal;
  font-weight: 500;
  src: url("assets/fonts/TT_Neoris_Pro_Medium.woff2") format("woff2"),
    url("assets/fonts/TT_Neoris_Pro_Medium.ttf") format("truetype");
}

/* TT Neoris Pro Medium - italic */
@font-face {
  font-display: swap;
  font-family: "TT Neoris Pro";
  font-style: italic;
  font-weight: 500;
  src: url("assets/fonts/TT_Neoris_Pro_Medium_Italic.woff2") format("woff2"),
    url("assets/fonts/TT_Neoris_Pro_Medium_Italic.ttf") format("truetype");
}

/***** base *****/
/*** html & body ***/
html,
body {
  font-family: "TT Neoris Pro", sans-serif;
  font-weight: 300;
  font-style: normal;
  letter-spacing: 0.03rem;
  color: #2a2b2e;
  background-color: #fff;
  margin: 0px;
  padding: 0px;
  height: 100%;
}

html {
  scroll-behavior: smooth;
  scrollbar-gutter: stable; /* Fix für das springen des menü buttons */
}

body {
  font-size: var(--text-normal);
  line-height: 1.5;
  padding-right: 0 !important; /* Fix für das springen des menü buttons */
}

/*** typography ***/
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-weight: 400;
  letter-spacing: 0.05rem;
  overflow-wrap: break-word; /* test statt -> hyphens: auto; */
  z-index: 1;
}

/* Skalierbare Typo
   - Basis-Schriftgröße: 1rem = 20px
   - Mindestgröße erreicht bei: 360px Viewport Width
   - Maximalgröße erreicht bei: 1200px Viewport Width (XL-Breakpoint) */

h1,
.h1 {
  font-size: var(--h1);
}
h2,
.h2 {
  font-size: var(--h2);
}
h3,
.h3 {
  font-size: var(--h3);
}
h4,
.h4 {
  font-size: var(--h4);
}
h5,
.h5 {
  font-size: var(--h5);
}

p {
  z-index: 1;
}

/* Letzter Absatz in einem Textblock bekommt keinen unteren Abstand */
.absatz p:last-of-type {
  margin-bottom: 0;
}

.small {
  font-size: var(--text-sm);
  line-height: 1.25;
}

.xsmall {
  font-size: var(--text-xs);
  line-height: 1.25;
}

b,
strong {
  font-weight: 500;
}

/*** links ***/
a {
  color: #a50000;
  text-decoration: none;
  transition: 0.2s ease-in-out;
  z-index: 1;
}

a:hover,
a:focus {
  color: #2a2b2e;
}

/*** color utilities ***/
.text-dark {
  color: #2a2b2e !important;
}

.text-primary {
  color: #a50000 !important;
}

.bg-ewb {
  background-color: #a50000;
}

.bg-sp {
  background-color: #bed6b7;
}

.bg-ritter {
  background-color: #9d8d5c;
}

.bg-stadtgarten {
  background-color: #5b6f58;
}

.bg-dark {
  background-color: #10191b;
}

/***** layout *****/
/*** container ***/
/* small container for variation */
.container-small {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

@media (min-width: 576px) {
  .container-small {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 768px) {
  .container-small {
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 992px) {
  .container-small {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1200px) {
  .container-small {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1400px) {
  .container-small {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Container ist quasi ein BS-XXXL-Container */
@media (min-width: 1600px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl,
  .container-xxl {
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 576px) {
  .container {
    padding-left: calc(var(--bs-gutter-x) * 0.5 + 7px);
    padding-right: calc(var(--bs-gutter-x) * 0.5 + 7px);
  }
}

/* Fullscreen Container (ca. wie px-4) */
.container-edge {
  --bs-gutter-x: 3rem; /* 24px links + 24px rechts */
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (max-width: 576px) {
  .container-edge {
    --bs-gutter-x: 1.5rem;
    padding-left: calc(var(--bs-gutter-x) * 0.5 + 7px);
    padding-right: calc(var(--bs-gutter-x) * 0.5 + 7px);
  }
}

/*** aspect ratios ***/
.ratio-32x9 {
  --bs-aspect-ratio: 28.125%;
}

@media (max-width: 1599.98px) {
  /* wird 21x9 */
  .ratio-32x9 {
    --bs-aspect-ratio: 42.857%;
  }
}

@media (max-width: 991.98px) {
  /* wird 16x9 */
  .ratio-32x9 {
    --bs-aspect-ratio: 56.25%;
  }
}

@media (max-width: 566.98px) {
  /* wird 4x3 */
  .ratio-32x9 {
    --bs-aspect-ratio: 75%;
  }
}

@media (max-width: 566.98px) {
  /* wird 4x3 */
  .ratio-21x9 {
    --bs-aspect-ratio: 75%;
  }
}

@media (max-width: 991.98px) {
  .ratio-16x9 {
    --bs-aspect-ratio: 75%; /* wird 4x3 */
  }
}

.ratio-4x5 {
  --bs-aspect-ratio: calc(5 / 4 * 100%);
}

/*** object position ***/
.object-position-center {
  object-position: center;
}

.object-position-top {
  object-position: top;
}

.object-position-bottom {
  object-position: bottom;
}

/*** spacer ***/
/* Bootstrap-Erweiterung: pt-6 = 6rem, pt-7 = 8rem, responsive über alle Breakpoints */
.pt-6 {
  padding-top: 6rem !important;
}
.mt-6 {
  margin-top: 6rem !important;
}
.pt-7 {
  padding-top: 8rem !important;
}
.mt-7 {
  margin-top: 8rem !important;
}

@media (min-width: 576px) {
  .pt-sm-6 {
    padding-top: 6rem !important;
  }
  .mt-sm-6 {
    margin-top: 6rem !important;
  }
  .pt-sm-7 {
    padding-top: 8rem !important;
  }
  .mt-sm-7 {
    margin-top: 8rem !important;
  }
}

@media (min-width: 768px) {
  .pt-md-6 {
    padding-top: 6rem !important;
  }
  .mt-md-6 {
    margin-top: 6rem !important;
  }
  .pt-md-7 {
    padding-top: 8rem !important;
  }
  .mt-md-7 {
    margin-top: 8rem !important;
  }
}

@media (min-width: 992px) {
  .pt-lg-6 {
    padding-top: 6rem !important;
  }
  .mt-lg-6 {
    margin-top: 6rem !important;
  }
  .pt-lg-7 {
    padding-top: 8rem !important;
  }
  .mt-lg-7 {
    margin-top: 8rem !important;
  }
}

@media (min-width: 1200px) {
  .pt-xl-6 {
    padding-top: 6rem !important;
  }
  .mt-xl-6 {
    margin-top: 6rem !important;
  }
  .pt-xl-7 {
    padding-top: 8rem !important;
  }
  .mt-xl-7 {
    margin-top: 8rem !important;
  }
}

@media (min-width: 1400px) {
  .pt-xxl-6 {
    padding-top: 6rem !important;
  }
  .mt-xxl-6 {
    margin-top: 6rem !important;
  }
  .pt-xxl-7 {
    padding-top: 8rem !important;
  }
  .mt-xxl-7 {
    margin-top: 8rem !important;
  }
}

/* Responsive Spacer auf Basis der utopia-Spacevariablen */
.spacer-xl {
  padding-top: var(--xl);
}
.spacer-lg {
  padding-top: var(--lg);
}
.spacer-md {
  padding-top: var(--md);
}
.spacer-sm {
  padding-top: var(--sm);
}
.spacer-xs {
  padding-top: var(--xs);
}

.spacer-overlap-xl {
  margin-bottom: calc(var(--xl) * -1);
}

/***** navigation *****/
/*** basics ***/
/* Items breite */
.nav-size {
  width: 100%;
  max-width: 600px;
}

/* Navigation Listen */
.navigation .sub-menu {
  margin: 0;
  padding: 0;
  letter-spacing: 0.05rem;
}

/* Navigation Listenelemente */
.navigation .sub-menu li {
  display: block;
  list-style: none !important;
  padding: 0.75rem;
}

/* Navigation Links */
.navigation .sub-menu a,
.navigation .accordion-button,
.navigation .accordion-link {
  color: #2a2b2e;
  font-weight: 300;
  transition: color 0.2s ease-in-out;
}

.accordion-button::after {
  width: 1.75rem;
  height: 1.75rem;
  background-size: 1.75rem;
}

/* Hover & Fokus */
.navigation .sub-menu a:hover,
.navigation .sub-menu a:focus,
.navigation .accordion-button:hover,
.navigation .accordion-button:focus,
.navigation .accordion-link:hover,
.navigation .accordion-link:focus {
  color: #a50000;
}

/* Aktive Menüpunkte (Klassen sitzen jetzt auf .accordion-item statt direkt am <a>) */
.navigation .sub-menu .current-menu-item > a,
.navigation .accordion-item.current-menu-item .accordion-button,
.navigation .accordion-item.current-menu-item .accordion-link,
.navigation .accordion-item.current-menu-parent .accordion-button,
.navigation .accordion-item.current_page_parent .accordion-button,
.navigation .accordion-item.current-menu-ancestor .accordion-button {
  color: #a50000 !important;
}

/*** ebene 1: Accordion (Top-Level) ***/
#mainAccordion {
  width: max-content;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
  --bs-accordion-bg: transparent;
  --bs-accordion-active-bg: transparent;
  --bs-accordion-active-color: #2a2b2e;
  --bs-accordion-border-width: 0;
  --bs-accordion-btn-focus-border-color: transparent;
  --bs-accordion-btn-focus-box-shadow: none;
}

.navigation .accordion-item {
  background: transparent;
}

/* .accordion-button (Trigger) und .accordion-link (Link ohne Kinder) optisch identisch */
.navigation .accordion-button,
.navigation .accordion-link {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.75rem;
  font-size: var(--h3);
  font-weight: 300;
  line-height: 1.25;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}

.navigation .accordion-link {
  text-decoration: none;
}

/*** ebene 2: Accordion-Body ***/
.navigation .accordion-body {
  padding: 0 0 0.75rem 0.75rem;
}

.navigation .sub-menu {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.navigation .sub-menu a {
  display: flex;
  align-items: center;
  font-size: var(--h5);
  line-height: 1.25;
}

/*** navbar container ***/
.navbar {
  display: block !important;
  padding: 8px 0;
}

/*** navbar toggle ***/
.navbar-toggle {
  position: absolute;
  top: 64px;
  right: 64px;
  z-index: 1046; /* über Bootstraps Offcanvas (1045), bleibt klick-/sichtbar wenn Menü offen ist */
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border: none;
  color: #2a2b2e;
  background: rgba(255, 255, 255, 0.7);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-shadow: 5px 5px 32px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  transform-origin: center center;
  will-change: transform;
  /* Verhindert Subpixel-Flimmern beim Scale-Transform */
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* pointer-events: none verhindert, dass Klicks auf Text/Icon den Button-Click blockieren */
.navbar-toggle .text-uppercase,
.menu-icon-morph {
  pointer-events: none;
}

.navbar-toggle .text-uppercase {
  font-weight: 300;
}

.navbar-toggle:hover,
.navbar-toggle:focus-visible {
  color: #a50000;
  transform: scale(0.92) translateZ(0);
}

/* Hamburger Icon */
.menu-icon-morph {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}

.menu-icon-morph span {
  position: absolute;
  width: 20px;
  height: 2px;
  background-color: currentColor;
  transition: transform 0.3s ease-in-out;
}

.menu-icon-morph span:nth-child(1) {
  transform: translateY(-4px);
}

.menu-icon-morph span:nth-child(2) {
  transform: translateY(4px);
}

/* Morpht die zwei Linien zu einem X */
#main.showing ~ .navbar-toggle-wrap .menu-icon-morph span:nth-child(1),
#main.show:not(.hiding)
  ~ .navbar-toggle-wrap
  .menu-icon-morph
  span:nth-child(1) {
  transform: translateY(0) rotate(45deg);
}

#main.showing ~ .navbar-toggle-wrap .menu-icon-morph span:nth-child(2),
#main.show:not(.hiding)
  ~ .navbar-toggle-wrap
  .menu-icon-morph
  span:nth-child(2) {
  transform: translateY(0) rotate(-45deg);
}

/*** navigation icons ***/
.menu-icons a {
  position: unset;
}

.menu-icons a i {
  position: absolute;
  bottom: 35px;
  left: 50%;
  color: #000;
  font-size: var(--h4);
  transform: translateY(-50%);
  transition: 0.2s ease-in-out;
}

.menu-icons a i:hover,
.menu-icons a i:focus {
  color: #fff;
}

/*** offcanvas (fullscreen Menü-Panel) ***/
/* Eigene Breite/Höhe/Slide-Richtung statt Bootstraps offcanvas-start/end/top/bottom */
.offcanvas-fullscreen {
  --bs-offcanvas-height: 100vh;
  --bs-offcanvas-height: 100dvh;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(255, 255, 255, 0.85) 100%
  );
  -webkit-backdrop-filter: blur(26px);
  backdrop-filter: blur(26px);
  box-shadow: 5px 5px 32.1px 0 rgba(0, 0, 0, 0.1);
}

/* Safari Backdropfilter Bugfix: eigenes Compositing-Layer */
.offcanvas-fullscreen::before {
  content: "";
  position: absolute;
  inset: -35px;
  z-index: 0;
}

.offcanvas-fullscreen > * {
  position: relative;
  z-index: 1;
}

/* Flex-Wrapper ums Menü: zentriert solange Platz ist, sonst oben ausgerichtet + scrollbar */
.nav-menu-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: safe center;
  height: 100%;
  overflow-y: auto;
}

/*** responsive ***/
@media (max-width: 768px) {
  .navbar-toggle {
    top: 48px;
    right: 48px;
  }
}

@media (max-width: 576px) {
  .navbar-toggle {
    top: 36px;
    right: 36px;
    padding: 14px;
  }

  .navigation .sub-menu li,
  .navigation .accordion-button,
  .navigation .accordion-link {
    padding: 0.5rem;
  }
}

/***** logo *****/
.nav-logo {
  width: 100%;
  height: auto;
  display: block;
}

/* z-index: -1 verhindert, dass das Brand-Element Klicks auf darunterliegende Elemente blockt */
.navbar-brand {
  z-index: -1;
}

/* clamp: 168px auf 576px Viewport – 256px auf 1200px Viewport */
.logo {
  width: clamp(10.5rem, 5.4231rem + 14.1026vw, 16rem);
  position: absolute;
  z-index: 1;
  top: 64px;
  left: 64px;
}

@media (max-width: 768px) {
  .logo {
    top: 48px;
    left: 48px;
  }
}

@media (max-width: 576px) {
  .logo {
    top: 35px;
    left: 35px;
  }
}

/***** hero *****/
/*** video hero ***/
.video-hero {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
}

/* margin-bottom negativ: hebt den Rahmenabstand nach unten wieder auf (kein stackender Abstand) */
.video-wrapper {
  --bs-gutter: 3rem; /* 24px links + 24px rechts */
  padding: calc(var(--bs-gutter) * 0.5);
  margin-right: auto;
  margin-left: auto;
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: calc(var(--bs-gutter) * -0.5);
}

@media (max-width: 576px) {
  .video-wrapper {
    --bs-gutter: 1.5rem;
    padding: calc(var(--bs-gutter) * 0.5 + 7px);
    margin-bottom: calc((var(--bs-gutter) * -0.5) - 7px);
  }
}


/*** youtube video ***/
.video-container {
  position: relative;
  padding-bottom: calc(var(--aspect-ratio, 0.5625) * 100%);
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/*** image hero ***/
.image-wrapper {
  --bs-gutter: 3rem; /* 24px links + 24px rechts */
  padding: calc(var(--bs-gutter) * 0.5);
  padding-bottom: 0px !important;
  margin-right: auto;
  margin-left: auto;
}

@media (max-width: 576px) {
  .image-wrapper {
    --bs-gutter: 1.5rem;
    padding: calc(var(--bs-gutter) * 0.5 + 7px);
  }
}

/***** buttons *****/
@media (max-width: 576px) {
  .btn {
    display: flex;
    justify-content: center;
  }
}

/* Primärer Button (dark) */
.btn-custom,
.frm_button_submit,
.wp-block-button__link,
.wp-block-button__link:visited,
.post-password-form input[type="submit"] {
  background-color: #10191b;
  text-align: center !important;
  padding: 12px 45px 11px !important;
  color: #fff !important;
  transition: 0.2s ease-in-out !important;
  border: solid 1px #10191b !important;
  font-size: var(--text-normal) !important;
  border-radius: 0px !important;
  font-weight: 300 !important;
}

.btn-custom:hover,
.btn-custom:focus,
.wp-block-button__link:hover,
.wp-block-button__link:focus,
.post-password-form input[type="submit"]:hover,
.post-password-form input[type="submit"]:focus {
  background-color: #fff !important;
  color: #10191b !important;
  text-decoration: none !important;
  border: solid 1px #10191b;
  cursor: pointer !important;
  box-shadow: none !important;
}

/* Sekundärer Button (rot) */
.btn-custom-secondary,
.forminator-button-submit {
  background-color: #a50000 !important;
  text-align: center !important;
  padding: 12px 45px 11px !important;
  color: #fff !important;
  transition: 0.2s ease-in-out !important;
  border: solid 1px #a50000 !important;
  font-size: var(--text-normal) !important;
  border-radius: 0px !important;
  font-weight: 300 !important;
}

.btn-custom-secondary:hover,
.btn-custom-secondary:focus,
.forminator-button-submit:hover,
.forminator-button-submit:focus {
  background-color: #fff !important;
  color: #a50000 !important;
  text-decoration: none !important;
  border: solid 1px #a50000 !important;
  cursor: pointer !important;
}

/* Zurück-Link */
.btn-back {
  color: #a50000 !important;
  text-align: center !important;
  transition: 0.2s ease-in-out !important;
  font-size: var(--text-normal) !important;
  border-radius: 0px !important;
  font-weight: 300 !important;
}

/* Kleine Button-Variante */
.btn-sm {
  padding: 12px 24px 12px !important;
  font-size: var(--text-sm) !important;
  font-weight: 300 !important;
}

/* nav-pills als Button-Gruppe */
.nav-pills .nav-link {
  background-color: transparent;
  text-align: center !important;
  padding: 12px 24px 12px !important;
  color: #10191b !important;
  transition: 0.2s ease-in-out !important;
  border: solid 1px #10191b;
  font-size: var(--text-sm) !important;
  border-radius: 0px !important;
  font-weight: 300 !important;
}

.nav-pills .nav-link:hover {
  background-color: #10191b;
  color: #fff !important;
  border: solid 1px #10191b;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: #10191b;
  text-align: center !important;
  padding: 12px 24px 12px !important;
  color: #fff !important;
  transition: 0.2s ease-in-out !important;
  border: solid 1px #10191b !important;
  font-size: var(--text-sm) !important;
  border-radius: 0px !important;
  font-weight: 300 !important;
}

/***** cards *****/
/* :focus-within stellt gleiche Optik bei Tastatur-Navigation sicher (stretched-link) */
.card {
  border-radius: 0px !important;
  box-shadow: 0px 48px 100px 0px rgba(0, 0, 0, 0.15);
  transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover,
.card:focus-within {
  transform: translateY(-6px);
  box-shadow: 0px 48px 100px 0px rgba(0, 0, 0, 0.2);
}

/* Badge */
.badge {
  background-color: #a50000;
  font-size: var(--text-sm);
  border-radius: 0;
  font-weight: 400;
  line-height: 1.2;
}

.badge-dark {
  background-color: #10191b;
}

/***** kompetenzen *****/
/* :focus-within stellt gleiche Optik bei Tastatur-Navigation sicher (stretched-link) */
.kompetenzen-card {
  min-height: 200px;
  border: 1px solid rgba(0, 0, 0, 0);
  transition: all 0.3s ease;
}

.kompetenzen-card:hover,
.kompetenzen-card:focus-within {
  background-color: #a50000 !important;
  border-color: #a50000;
  color: #fff;
}

.kompetenzen-card:hover .kompetenz-index,
.kompetenzen-card:focus-within .kompetenz-index {
  color: #fff !important;
}

.kompetenzen-card:hover .kompetenz-arrow,
.kompetenzen-card:focus-within .kompetenz-arrow {
  color: #fff !important;
}

.kompetenz-arrow {
  color: #a50000;
  transition: transform 0.3s ease;
}

.kompetenzen-card:hover .kompetenz-arrow,
.kompetenzen-card:focus-within .kompetenz-arrow {
  transform: translateX(6px);
}

/***** team *****/
/* isolation: isolate verhindert, dass der Blur-Effekt aus dem Stack ausbricht */
.team-overlay-glass {
  position: relative;
  background-color: rgba(165, 0, 0, 0.75);
  isolation: isolate;
}

/* Blur-Effekt */
.team-overlay-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  backdrop-filter: blur(10.8px);
  -webkit-backdrop-filter: blur(10.8px);
}

.team-overlay-glass a {
  color: #fff !important;
  display: inline-block;
  transition: color 0.2s ease;
}

.team-overlay-glass a:hover {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* Pseudo-Elemente des globalen Link-Stylings deaktivieren */
.team-overlay-glass a::before,
.team-overlay-glass a::after {
  content: none;
}

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

.team-img-grayscale:hover {
  filter: grayscale(0%) contrast(100%);
}

/* Chevron rotiert wenn Collapse geöffnet */
.team-overlay-glass .d-flex[data-bs-toggle="collapse"] i.fa-chevron-down {
  transition: transform 0.3s ease-in-out;
}

.team-overlay-glass .d-flex[aria-expanded="true"] i.fa-chevron-down {
  transform: rotate(180deg);
}

/***** projekte *****/
/* Logo-Container mit quadratischem Seitenverhältnis, clamp: 108px–192px */
.projekte-logo {
  width: clamp(6.75rem, 5.2258rem + 6.7742vw, 12rem);
  height: clamp(6.75rem, 5.2258rem + 6.7742vw, 12rem);
  padding: clamp(1rem, 0.1429rem + 3.8095vw, 1.5rem);
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.projekte-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.projekt-card {
  padding: 3rem;
}

@media (max-width: 1599.98px) {
  .projekt-card {
    padding: 3rem;
    padding-top: 6rem;
  }
}

@media (max-width: 991.98px) {
  .projekt-card {
    padding: 1.5rem;
    padding-top: 6rem;
  }
}

@media (max-width: 767.98px) {
  .projekt-card {
    padding: 1.5rem;
    padding-top: 4.5rem;
  }
}

.projekt-disabled {
  pointer-events: none;
  user-select: none;
}

/***** expose *****/

/*** modal (global – greift auch auf .lb-expose) ***/
.modal {
  background: #ffffffb5;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.modal-content {
  border: none;
  border-radius: 0;
}

.modal-header,
.modal-footer {
  border: none;
}

/*** tabelle (global – greift auch auf .lb-wohnungen) ***/
.table {
  --bs-table-bg: transparent;
  --bs-table-hover-bg: transparent;
  --bs-table-border-color: transparent;
}

.table > :not(caption) > * > * {
  border-bottom-width: 0;
}

th {
  font-weight: 500;
}

/*** lageplan – hotspots ***/
/* Hotspot-Reset + Desktop-Position via CSS-Variablen */
.lb-hotspot {
  position: absolute;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  z-index: 2;
  left: var(--x-desk);
  top: var(--y-desk);
}

/* Unter lg auf Mobile-Koordinaten umschalten */
@media (max-width: 991.98px) {
  .lb-hotspot {
    left: var(--x-mob);
    top: var(--y-mob);
  }
}

/* Koordinate = Pin-Mittelpunkt */
.lb-hotspot--pin {
  transform: translate(-50%, -50%);
}

.lb-hotspot--pin .lb-hotspot__label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(2.75rem, 2.2143rem + 2.381vw, 4rem);
  height: clamp(2.75rem, 2.2143rem + 2.381vw, 4rem);
  border: 1px solid #1b1b1b;
  background: #1b1b1b;
  color: #fff;
  line-height: 1;
  transition: background 0.15s ease, color 0.15s ease;
}

.lb-hotspot--pin:hover .lb-hotspot__label,
.lb-hotspot--pin:focus-visible .lb-hotspot__label {
  background: #fff;
  color: #1b1b1b;
}

/*** lageplan – bild ***/
/* Desktop 16:10, Mobile 3:4 */
.lb-lageplan__bg {
  object-fit: cover;
  width: 100%;
}

@media (min-width: 992px) {
  .lb-lageplan__bg {
    aspect-ratio: 16 / 10;
  }
}

@media (max-width: 991.98px) {
  .lb-lageplan__bg {
    aspect-ratio: 3 / 4;
  }
}

/*** modal – etagen-pills ***/
/* Floor-Pills: quadratisch, weißer Grund (block-scoped) */
.lb-lageplan .lb-floor-pill {
  width: clamp(2.75rem, 2.2143rem + 2.381vw, 4rem);
  height: clamp(2.75rem, 2.2143rem + 2.381vw, 4rem);
  flex-shrink: 0;
  border-radius: 0;
}

.lb-lageplan .btn-outline-dark {
  background-color: #fff;
  color: #000;
}

/* Aktive Etage schwarz – überstimmt btn-outline-dark */
.lb-lageplan .lb-floor-pill.active {
  background-color: #1b1b1b;
  color: #fff;
}

/* Pills überlappen das darunterliegende Bild leicht */
@media (min-width: 992px) {
  .lb-floor-pills {
    margin-bottom: -36px;
  }
}

/*** modal – etagen-panes ***/
/* Panes überlagern (Grid) → Höhe des größten Panes, Crossfade ohne Sprung */
.lb-floor-panes {
  display: grid;
  width: 100%;
  min-width: 0;
}

.lb-floor-pane {
  grid-area: 1 / 1;
  width: 100%;
  min-width: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

.lb-floor-pane.is-active {
  opacity: 1;
  visibility: visible;
}

.lb-floor-pane__inner {
  width: 100%;
  overflow: hidden;
}

.lb-floor-pane__inner img {
  max-width: 100% !important;
  height: auto;
  display: block;
}

/*** bildformate ***/
.img-cover-16x10 {
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.img-cover-1x1 {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/*** berater-footer ***/
.lb-berater__logo {
  width: 240px;
  height: 240px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Überlapp erst, wenn das Grid nebeneinander steht (xl) – darunter im Flow */
@media (min-width: 1200px) {
  .lb-berater__logo {
    margin-top: -120px;
  }
}

.lb-berater__logo img {
  width: auto;
  max-height: 100%;
  object-fit: contain;
}

/*** theming ***/
/* Nicht-Button-Links erben die Textfarbe des (eingefärbten) Bereichs */
.lb-lageplan .modal-body a:not(.btn),
.lb-lageplan .lb-static a:not(.btn),
.lb-lageplan .lb-berater a:not(.btn) {
  color: inherit;
}

/* Verfügbarkeits-Icons: Default-Farben ohne Theme */
.lb-avail--yes {
  color: #1d9e75;
}
.lb-avail--no {
  color: #d85a30;
}

/* Im eingefärbten Modal erben auch die Icons die Textfarbe */
.lb-lageplan .text-white .lb-avail--yes,
.lb-lageplan .text-white .lb-avail--no {
  color: inherit !important;
}

/* Tabelle im dunklen Theme lesbar halten */
.lb-lageplan .text-white .table,
.lb-lageplan .text-white .table th,
.lb-lageplan .text-white .table td {
  --bs-table-color: #ffffff;
  --bs-table-bg: transparent;
  --bs-table-border-color: rgba(255, 255, 255, 0.2);
  color: var(--bs-table-color) !important;
}

/*** popover ***/
.popover {
  background-color: #fff;
  text-align: center;
  padding: 12px 45px 11px;
  border: solid 1px #fff;
  font-size: 1rem;
  border-radius: 0;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.popover-body {
  padding: 0;
}

/***** faq *****/
.faq-item {
  transition: all 0.3s ease;
}

.faq-toggle {
  font-size: var(--text-normal);
  background-color: #e7e8e8 !important;
}

.faq-toggle .faq-icon {
  transition: all 0.3s ease;
  color: #a50000;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Chevron rotiert wenn Collapse geöffnet */
.faq-toggle[aria-expanded="true"] .faq-icon {
  transform: rotate(180deg);
}

/* Focus-Ring für Tastatur-Navigation */
.faq-item .btn-link:focus,
.faq-item .btn-link:focus-visible {
  box-shadow: 0 0 0 0.25rem rgb(165, 0, 0, 0.25);
  position: relative;
  z-index: 1;
}

/***** carousel *****/
.link-arrow-left,
.link-arrow-right {
  background-color: #ffffff;
  color: #a50000 !important;
  padding: 20px;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
}

.carousel-control-prev,
.carousel-control-next {
  width: auto;
  padding: 0px 40px 0px 40px;
}

@media (max-width: 768px) {
  .link-arrow-left,
  .link-arrow-right {
    padding: 12px;
  }
}

@media (max-width: 768px) {
  .carousel-control-prev,
  .carousel-control-next {
    padding: 0px 24px 0px 24px;
  }
}

@media (max-width: 576px) {
  .carousel-control-prev,
  .carousel-control-next {
    padding: 0px 17px 0px 17px;
  }
}

/***** immos *****/
/* hyphens: none verhindert unschöne Zeilenumbrüche in Immo-Titeln */
/* .inx-property-list-item__title {
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  word-wrap: break-word;
} */

.immo-card-body {
  padding: 36px 36px 48px 36px;
}

/*** pagination ***/
.pagination .page-link,
.pagination .page-item span {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 44px;
  height: 44px;
  padding: 0 16px;
  line-height: normal;
}

.page-link,
.page-link:hover {
  color: #a50000;
}

.active > .page-link,
.page-link.active {
  background-color: #a50000;
  border-color: #a50000;
}

.active > .page-link,
.page-link.active:hover {
  color: #fff;
}

.page-item:first-child .page-link,
.page-item:last-child .page-link {
  border-radius: 0;
}

/*** filter dropdown ***/
.form-select {
  background-color: #dcdcdc !important;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 24px;
  border: 0px;
  border-radius: 0;
  font-size: var(--text-sm);
  font-weight: 300;
}

/*** range slider ***/
.range-filter {
  width: 100%;
}

/* Feste Höhe entspricht der Dropdown-Höhe für optische Ausrichtung */
.range-slider {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 49px !important;
  box-sizing: border-box !important;
  padding: 8px 0 0 0 !important;
}

.range-filter .inx-range-slider__nouislider {
  order: 1 !important;
  width: 100% !important;
}

.range-filter .inx-range-slider__label-value {
  order: 2 !important;
  width: 100% !important;
  text-align: center !important;
}

.range-filter .inx-range-slider__value {
  display: block !important;
  width: 100% !important;
  font-size: var(--text-sm) !important;
  line-height: 1 !important;
}

/* noUiSlider Track */
.range-slider .noUi-target {
  box-sizing: border-box !important;
  height: 1px !important;
}

.range-slider .noUi-connect {
  background: #a50000 !important;
  border: none !important;
}

/* Handle: top/right-Werte zentrieren den kreisförmigen Handle auf der 2px-Schiene */
.range-slider .noUi-horizontal .noUi-handle {
  width: 18px !important;
  height: 18px !important;
  top: -9px !important;
  right: -9px !important;
  cursor: pointer !important;
  border: none !important;
  border-radius: 50% !important;
  background: #a50000 !important;
  box-shadow: none !important;
  transition: transform 0.15s ease-in-out !important;
}

.inx-form-element .inx-range-slider .inx-range-slider__nouislider .noUi-connect,
.inx-form-element
  .inx-range-slider
  .inx-range-slider__nouislider
  .noUi-connects {
  height: 4px !important;
}

/* Dekorative Striche innerhalb des Handles entfernen */
.range-slider .noUi-handle::before,
.range-slider .noUi-handle::after {
  display: none !important;
}

.range-slider .noUi-handle:hover,
.range-slider .noUi-handle:active {
  transform: scale(1.1) !important;
}

/***** kontaktformular *****/
.kontakt {
  padding: var(--lg) 0px var(--lg) 0px;
}

/*** forminator felder ***/
.forminator-input,
.forminator-textarea,
.forminator-select--field,
.forminator-select2,
.select2-selection,
.select2-selection--single,
.forminator-select-dropdown-container--open
  .forminator-dropdown--flat
  .select2-results
  .select2-results__options
  .select2-results__option.select2-results__option--selected,
.forminator-multi-upload {
  width: 100% !important;
  padding: 13px 20px !important;
  border-radius: 0px !important;
  border: none !important;
  background-color: #efefef !important;
  margin-top: 6px !important;
  color: #707070 !important;
  font-weight: inherit;
}

.forminator-multi-upload {
  padding: 20px !important;
}

.select2-selection,
.select2-selection--single {
  padding: 15px;
}

.forminator-row {
  margin-bottom: 25px !important;
}

/* Pflichtfeld-Sternchen */
.forminator-required {
  color: #a50000 !important;
}

/*** labels ***/
.forminator-label,
.forminator-checkbox__label {
  color: #2a2b2e !important;
  font-family: "TT Neoris Pro", sans-serif !important;
  font-weight: 300 !important;
}

.forminator-label,
.forminator-checkbox__label,
.forminator-checkbox__label p {
  margin: 0 !important;
  padding: 0 !important;
}

/*** consent & checkbox ***/
/* display: inline-block verhindert, dass der Label-Block die volle Breite einnimmt */
.forminator-consent__label {
  display: inline-block !important;
}

.forminator-consent__label p,
.forminator-consent__label a,
.forminator-checkbox__label p,
.forminator-checkbox__label a {
  font-family: "TT Neoris Pro", sans-serif !important;
  font-weight: 300 !important;
  line-height: 1.5 !important;
  color: #2a2b2e !important;
}

.forminator-checkbox__wrapper {
  align-items: center !important;
}

.forminator-checkbox input {
  height: 1.5rem !important;
  width: 1.5rem !important;
}

/* Komplett eigenes Checkbox-Styling via appearance: none */
.forminator-checkbox input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  color: #2a2b2e !important;
  width: 1.5rem !important;
  height: 1.5rem !important;
  margin: 0 0.5rem 0 0 !important;
  border: 0 !important;
  background: #efefef !important;
  flex: 0 0 1.5rem !important;
  cursor: pointer !important;
}

.forminator-checkbox input[type="checkbox"]:checked {
  background-color: #a50000 !important;
}

/* Checkmark via border-Trick (kein Icon, kein SVG) */
.forminator-checkbox input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 45%;
  width: 0.45rem;
  height: 0.8rem;
  border: solid #fff;
  border-width: 0 0.15rem 0.15rem 0;
  transform: translate(-50%, -50%) rotate(45deg);
}

/*** fehlermeldungen & erfolg ***/
.forminator-error-message {
  background-color: #ff7369 !important;
  color: #fff !important;
  width: 100% !important;
  display: inline-block !important;
  padding: 10px 15px !important;
  font-size: 0.8rem !important;
}

.forminator-design--flat .forminator-response-message.forminator-success {
  background-color: #bed6b7 !important;
}

.forminator-design--flat .forminator-response-message.forminator-success,
.forminator-design--flat .forminator-response-message.forminator-success p {
  color: #2a2b2e !important;
  padding: 8px 10px !important;
}

.forminator-ui
  .forminator-design--basic
  .forminator-response-message.forminator-success {
  background-color: #bed6b7 !important;
  box-shadow: unset !important;
  color: #2a2b2e;
}

/*** select2 ***/
.select2-selection__arrow {
  color: #2a2b2e !important;
}

.select2-selection__arrow:hover,
.select2-selection__arrow:focus {
  color: #bed6b7 !important;
}

.select2-selection__rendered {
  color: #2a2b2e !important;
}

/* Dropdown */
.forminator-select-dropdown-container--open .forminator-dropdown--flat {
  background-color: #fff !important;
  border-radius: 0px !important;
}

.forminator-select-dropdown-container--open
  .forminator-dropdown--flat
  .select2-results
  .select2-results__options
  .select2-results__option:not(
    .select2-results__option--selected
  ).select2-results__option--highlighted,
.forminator-select-dropdown-container--open
  .forminator-dropdown--flat
  .select2-results
  .select2-results__options
  .select2-results__option:not(
    .select2-results__option--selected
  ).select2-results__option--highlighted
  span:not(.forminator-checkbox-box) {
  background-color: #fff !important;
  color: #2a2b2e !important;
}

/* Ausgewählte Option im Dropdown */
.forminator-select-dropdown-container--open
  .forminator-dropdown--basic
  .select2-results
  .select2-results__options
  .select2-results__option:not(
    .select2-results__option--selected
  ).select2-results__option--highlighted,
.forminator-select-dropdown-container--open
  .forminator-dropdown--basic
  .select2-results
  .select2-results__options
  .select2-results__option:not(
    .select2-results__option--selected
  ).select2-results__option--highlighted
  span:not(.forminator-checkbox-box) {
  background-color: #a50000 !important;
  color: #fff !important;
}

.forminator-select-dropdown-container--open .forminator-dropdown--basic {
  border-color: #efefef !important;
  background-color: #efefef !important;
  box-shadow: 3px 12px 26px -3px rgba(186, 186, 186, 0.5) !important;
  -webkit-box-shadow: 3px 12px 26px -3px rgba(186, 186, 186, 0.5) !important;
}

.forminator-select-dropdown-container--open
  .forminator-dropdown--basic
  .select2-results
  .select2-results__options
  .select2-results__option.select2-results__option--selected,
.forminator-select-dropdown-container--open
  .forminator-dropdown--basic
  .select2-results
  .select2-results__options
  .select2-results__option.select2-results__option--selected
  span:not(.forminator-checkbox-box) {
  background-color: #bed6b7 !important;
  color: #2a2b2e !important;
}

/***** lightbox *****/
/* smoothBlur: animiert Hintergrund und Backdrop-Filter beim Öffnen */
@keyframes smoothBlur {
  0% {
    background: rgba(255, 255, 255, 0);
    backdrop-filter: blur(0px) brightness(100%);
    -webkit-backdrop-filter: blur(0px) brightness(100%);
  }
  100% {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px) brightness(66%);
    -webkit-backdrop-filter: blur(10px) brightness(66%);
  }
}

.uk-lightbox {
  z-index: 9999 !important;
}

.uk-lightbox.uk-open {
  background: rgba(255, 255, 255, 0.7) !important;
  -webkit-backdrop-filter: blur(10px) brightness(66%);
  backdrop-filter: blur(10px) brightness(66%);
  animation: smoothBlur 0.3s ease forwards !important;
}

/*** controls (pfeile & schliessen) ***/
.uk-lightbox .uk-slidenav,
.uk-lightbox .uk-lightbox-close {
  background-color: #ffffff;
  color: #a50000 !important;
  padding: 20px;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
}

/* Standard UIkit-SVGs ausblenden, eigene FA-Icons einblenden */
.uk-lightbox .uk-slidenav svg,
.uk-lightbox .uk-lightbox-close svg {
  display: none !important;
}

.uk-lightbox .uk-slidenav::before,
.uk-lightbox .uk-lightbox-close::before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  font-size: 18px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uk-lightbox .uk-slidenav-next::before {
  content: "\f178";
}
.uk-lightbox .uk-slidenav-previous::before {
  content: "\f177";
}
.uk-lightbox .uk-lightbox-close::before {
  content: "\f00d";
}

/*** positionen ***/
/* margin: 0 überschreibt uk-position-small, exakte Abstände via top/right/left */
.uk-lightbox .uk-position-top-right {
  margin: 0 !important;
  top: 64px !important;
  right: 64px !important;
}

.uk-lightbox .uk-position-center-right {
  margin: 0 !important;
  right: 64px;
}

.uk-lightbox .uk-position-center-left {
  margin: 0 !important;
  left: 64px;
}

/* Pfeile auf Touch-Geräten ausblenden (Swipe-Gesten übernehmen die Navigation) */
@media (hover: none) and (pointer: coarse) {
  .uk-lightbox .uk-slidenav {
    display: none !important;
  }
}

/*** caption ***/
.uk-lightbox .uk-lightbox-caption {
  background-color: #ffffff;
  color: #333333;
  padding: 12px 45px 11px;
  box-shadow: var(--shadow-xl);
  font-size: var(--text-normal);
  position: absolute;
  bottom: 64px !important;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: max-content;
  max-width: 85vw;
  text-align: center;
  white-space: normal;
}

/* transition statt transform: verhindert das UIkit-Ruckeln beim Ein-/Ausblenden */
.uk-lightbox .uk-lightbox-caption {
  transition: opacity 0.4s ease, visibility 0.4s ease !important;
  transform: none !important;
}

.uk-lightbox-panel:not(.uk-active) .uk-lightbox-caption {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: none !important;
}

/***** footer *****/
#footer {
  background-color: #10191b;
}

/* opacity: 0.33 dämpft das Logo zu einem subtilen Wasserzeichen */
#footer-logo {
  display: block;
  width: 480px;
  opacity: 0.33;
}

@media (max-width: 992px) {
  #footer-logo {
    width: 100%;
  }
}

#footer a,
.copy-links a {
  transition: 0.2s ease-in-out;
  color: #fff;
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
  text-decoration-color: transparent;
}

#footer a:hover,
#footer a:focus,
#footer a:active,
.copy-links a:hover,
.copy-links a:focus,
.copy-links a:active {
  text-decoration: underline;
  text-decoration-color: #fff;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

#footer .copyright p,
#footer .copyright a,
#footer .copyright ul {
  font-size: var(--text-sm) !important;
  line-height: 1.4rem;
  color: #fff;
}

/* Social Icons */
.social-links-footer a i {
  font-size: var(--h3);
  transition: all 0.2s ease;
}

.social-links-footer a:hover {
  opacity: 0.8;
}

#menu-footer li {
  display: inline-block;
  list-style-type: none;
}

/***** 404 *****/
/* absolut zentriert im Viewport */
.error {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#error-text:hover,
#error-text:focus {
  color: #112e57;
  text-decoration: none;
}

#error-text #footer-logo {
  padding-top: 50px;
  margin-right: 10px;
}