.tx-ot-faq .accordion-button {
  font-size: 1.2rem;
}

.frame-option-weiss h1,
.frame-option-weiss h2 {
  color: rgb(255, 255, 255) !important;
}


.frame a {
  text-decoration: none;
}

.carousel-item-type-call_to_action .carousel-box {
  background-color: rgba(255, 255, 255, 0.603) !important
}

.frame-header>*:last-child {
    margin-bottom: 1rem;
}
.konstantinlayout h1, 
.konstantinlayout h2 {
  font-family: Lora, sans-serif !important;
  font-weight: 400 !important;
}
.konstantinlayout .tx-powermail h3 {
  font-family: Lora, sans-serif !important;
  font-size: 2.2425rem;
  padding-bottom: 1rem;
}
.garagekonstantinlayout h1, 
.garagekonstantinlayout h2,
.garagekonstantinlayout h3  {
  font-family: "Fira Sans Extra Condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.garagekonstantinlayout h2.accordion-header button {
  font-size: 1.2rem;
}

.garagekonstantinlayout h2 {
  font-size: 1.9rem;
}

.main-section .card-group-element img {
    border-radius: 5px;
}
.scroll-top {
  display: none;
}

.powermail-errors-list {
  padding-left: 0;
}
.frame-option-paddingtopbottom {
  padding: 5rem 0 8rem;
}

.footer-info-section {
  text-align: left;
  font-size: 0.9rem;
  color: #b2b2b2;
}
.footer-sociallinks .sociallinks-list {
  justify-content: left;
}
.footer-sociallinks {
  color: #FFF;
}
.sociallinks-link-icon {
  font-size: 2rem;
}
.footer-sociallinks .sociallinks-link {
  width: 3rem;
  height: 3rem;
}

@media (min-width: 1200px) {
  h1, .h1 {
    font-size: 2.8rem;
  }
}


@media (min-width: 768px) {
  .footer-copyright a {
    padding-left: 10px;
  }
}


.tx-powermail .container-fluid {
  padding: 0;
}

.image>a:focus-visible, .image>a:focus {
  outline-offset: 0px;
  outline: 0px solid;
}




.navbar-brand svg {
  min-width: 180px;
  min-height: 20px;
  fill: #FFF;
}

@media (max-width: 767px) {
  .gallery-item-size-2 {
  --gallery-columns: 1;
  }
  .gallery-item-size-3 {
    --gallery-columns: 1;
  }
  .navbar-brand svg {
    min-height: 17px;
  }
}

.subnav-nav {
  font-size:1rem;
  line-height: 1.25;
}

.main-section img {
  border-radius: 10px;
}

.tx-ns-instagram .gallery-image {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.nsinstagram-v1apiview .gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  grid-gap: 1rem;
}
.footer-section a,
.footer-section p {
  font-size: 0.95rem;
}
.footer-section a {
  text-decoration: none;
}
.footer-section-content {
  background: #323232;
  --frame-color: #ffffff;
  --frame-background: #323232;
  --frame-link-color: #eeeeee;
  --frame-link-hover-color: #bebebe;
}
.footer-section-meta {
  background: #323232;
  --frame-color: #ffffff;
  --frame-background: #323232;
  --frame-link-color: #eeeeee;
  --frame-link-hover-color: #bebebe;
}
.footer-section a {
  color: #FFF !important;
}
.footer-section a:hover {
  color: #ccc !important;
}

.section-default a:hover {
  text-decoration: underline;
}

.navbar-inverse {
  background-color: #000000 !important;
}
.navbar-inverse svg {
  fill: #FFF !important;
}

#c239 h2 {
  padding-bottom: 2rem;
}
/* Ab 768px (Bootstrap "md") nach links verschieben */
@media (min-width: 768px) {
  .dealer-logo-wrapper {
  transform: translateX(-24px);
  }
}
.dealer-header {
  height: 56px;
  background-color: #000; 
  z-index: 1050;
  position: relative;
  transition: padding 0.3s ease;
}

.garagekonstantinlayout .dealer-header,
.garagekonstantinlayout .dealer-header.sticky {
  background-color: #130132 !important; 
}

.dealer-header.sticky {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #000 !important; 
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}
#burgerToggle {
  border: none;
  box-shadow: none;
  outline: none;

}
.dealer-header .btn-menu svg,
.dealer-header .btn-menu {
  color: #fff; /* Weisses Burger-Icon */
}
.dealer-header .btn-menu span {
  vertical-align: -3px;
  color: #fff;
}

.dealer-logo img {
  max-height: 30px;
  height: auto;
  display: block;
  filter: brightness(0) invert(1); /* Logo auf weiss invertieren (falls nötig) */
}

.dealer-kontakt-link {
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: 1rem;
}

.dealer-offcanvas {
  position: fixed;
  inset: 0;
  display: flex;
  z-index: 2000;
  height: 100vh;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  color-scheme: dark;
  flex-direction: row;
  overflow-y: auto;
}
.dealer-offcanvas a {
  color: #FFF !important;
  text-decoration: none;
}
.dealer-offcanvas a:hover {
  text-decoration: underline;
}
.dealer-offcanvas.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}


/* Linke Spalte – Hauptnavigation */
.menu-primary {
  width: 22rem;
  background: #000;
  color: #fff;
  padding: 4rem;
  overflow-y: auto;
  flex-shrink: 0;
}
.garagekonstantinlayout .menu-primary {
  background: #0a001c;
}

.menu-primary ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-primary li {
  padding: 0.75rem 1rem;
  cursor: pointer;
  border-radius: 8px;
  transition: background-color 0.2s ease;
}

.menu-primary li:hover,
.menu-primary li:focus {
  background-color: rgba(255, 255, 255, 0.1);
}

/* Rechte Spalte – Subnavigation */
.menu-secondary {
  flex-grow: 1;
  background: #111;
  color: #fff;
  padding: 6rem 4rem;
  overflow-y: auto;
  position: relative;
}
.garagekonstantinlayout .menu-secondary {
  background: rgba(5, 0, 15, 0.808) !important;
}

.menu-secondary h2,
.menu-secondary p,
.menu-secondary a {
  color: #fff;
}

.submenu-links {
  list-style: none;
  padding-left: 0;
}

.submenu-links li {
  margin-bottom: 0.75rem;
}

.submenu-links a {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
}

.submenu-links a:hover {
  text-decoration: underline;
}

#burgerToggle span {
  display: none;
}

@media (min-width: 768px) {
  .dealer-offcanvas .menu-primary,
  .dealer-offcanvas .menu-secondary {
  max-width: 50vw;
  }

  .dealer-offcanvas {
  justify-content: flex-start;
  }

  .dealer-offcanvas .menu-secondary {
  flex-grow: 1;
  min-width: 40%;
  }
  #burgerToggle span {
    display: inline;
  }
  
}

@media (max-width: 1023.98px) {
  .dealer-offcanvas {
  flex-direction: column; /* Mobile: oben/unten */
  }
  .menu-primary,
  .menu-secondary {
  width: 100% !important;
  height: 100vw;
  }
  .menu-secondary {
  padding: 3rem 4rem;
  display: none;
  }
}

/* Close-Button innerhalb der rechten Spalte */
.btn-close-menu {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 3.2rem;
  z-index: 10;
  cursor: pointer;
  padding: 0.5rem;
  line-height: 1;
}

.btn-close-menu:hover {
  color: #ccc;
}

@media (min-width: 768px) {
  .footer-section-content-column-left, .footer-section-content-column-middle {
    --section-colspan: 3;
  }
}
@media (min-width: 768px) {
  .footer-section-content-column-right {
    --section-colspan: 6;
  }
}



.powermail_legend {
  display: none;
}



#p3 .dealer-header {
  background-color: rgba(0, 0, 0, 0);
}
@media (min-width: 768px) {
  .fullscreen-content h1 {
  font-size: 3.5rem;
  }
}


.hero-video {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 1;
  margin-top: -94px;
}

.hero-video video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  object-fit: cover;
  z-index: 0;
}
.overlay-gradient {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 30vh;
  background: linear-gradient(to bottom, rgba(0,0,0,0.7), transparent);
  z-index: 1;
  pointer-events: none;
}
.hero-content {
  position: absolute;
  z-index: 2;
  text-align: center;
  color: white;
  bottom: 10rem;
  width: 100%;
  text-align: center;
}
.hero-content h1 { 
  font-size: 3.5rem;
  margin-bottom: 3rem; 
}
.hero-content .btn-primary {
  background: #fff; color: #000;
  border: none; padding: 0.75rem 1.5rem;
  font-size: 1rem; cursor: pointer;
}
.swiper-button-next, .swiper-button-prev {

  color: black !important;
}


.has-html5video .f-html {
  max-height: 90%;
  max-width: 90%;
}

#c277 iframe {
  border-radius: 10px;
}

.ce-col .frame-container {
  padding: 0;
}
.frame-background-dark blockquote {
  padding: 2rem 1.5rem;
  border-left: 4px solid rgba(255, 255, 255, 0.125);
}
blockquote p {
  font-family: Lora, sans-serif !important;
  font-size: 1.5rem;
  font-style: italic;
}

#c289 ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem; /* Abstand zwischen den Punkten */
  list-style: none;
  padding: 0 0 0 1rem;
  margin: 0;
}

#c289 li {
  display: inline-block;
}

#c289 a {
  text-decoration: none;
  padding: 0.5rem 0.5rem;
  display: block;
  background-color: #f5f5f5; /* optionales Styling */
  border-radius: 4px;
  transition: background-color 0.3s;
}

#c289 a:hover {
  background-color: #e0e0e0;
}

#c289 ul.is-sticky {
  position: fixed;
  top: 0px; /* Abstand zum oberen Rand */
  width: 100%;
  z-index: 1000;
  background-color: #e9e9e9;
  padding: 1rem;
}

#c4 .card-group-element-item {
  text-align: center;
}
.card-title {
  font-size: 1.75rem;
  padding-bottom: 1rem;
  padding-top: 1rem;
}

.personnel .card-body {
  min-height: 224px;
}
.responsibility {
  margin-bottom: 8px;
}



.personnel .card {
  margin-bottom: 24px; /* vertikaler Abstand zwischen den Karten */
}

.filter-buttons {
  margin-bottom: 1rem;
}
.filter-buttons button {
  border: 1px solid black;
  border-radius: 4px;
  margin-right: 0.5rem;
  margin-bottom: 10px;
  padding: 0.5rem 1rem;
  cursor: pointer;
  font-size: 0.9rem;
  color: #000;
}
.filter-buttons .is-checked {
  background: #000;
  color: #fff;
}





.card figure {
  flex-shrink: 0;
  margin: 0;
}

.card figure img {
  width: 150px; /* oder eine andere feste Breite */
  height: auto;
  border-radius: 4px;
  object-fit: cover;
}

.card-body {
  flex: 1;
}

@media (min-width: 1024px) {
  #close-mobile {
    display: none !important;
  }
}

#c328 .ce-col .frame-group-container {
  background: rgba(203, 203, 203, 0.7);
  padding: 0;
}
#c328 .ce-col .frame {
  padding-top: 0;
}
#c328 {
  padding-top: 6rem;
  padding-bottom: 3rem;
}
#c349 {
  text-align: center !important;
}
@media (min-width: 1200px) {
  h1, .h1 {
    font-size: 2.8rem;
  }
  .frame-option-maxtextwidth .frame-inner {
    max-width: 80%;
    margin: 0 auto;
  }
}

.frame-background-dark a {
  color: #FFF !important;
}
.frame-background-dark a:hover {
  text-decoration: underline;
}
.shoplistimage {
  padding: 1rem !important;
  border-bottom: 1px solid #ccc
}

.typo3-messages {
  list-style: none;
  padding-left: 0;
}

.products-list-items h3 {
  font-weight: 300;
}
.products-list-items h3.card-title  {
  font-size: 1.5rem;
}

.product-header dd,
.product-header dt {
  overflow-x: hidden;
}
.frame-option-sticky .frame {
  padding-bottom: 0 !important;
}
.frame-option-sticky.is-fixed {
  position: fixed;
  top: 20px;
  z-index: 1030;
}

.ButtonText {
  font-size: 1.2rem !important;
}
.winterIcon img {
  max-width: 50px;
  height: auto !important;
  text-align: center;
  margin: 0 auto;
  display: block;
}
.winterleft {
  border-right-width: 4px;
  border-right-style: solid;
  border-right-color: rgb(149, 149, 149);
}
.winterNumber {
  text-align: center;
  font-size: 2.4em;
}
.frame-layout-hero, .frame-layout-maxhero{
    font-size: 1.2rem;
}
.frame-layout-hero .btn  {
    font-size: 1.2rem;
}
.frame-layout-hero h1, .frame-layout-maxhero h1 {
    font-size: calc(1.5rem * var(--hero-font-scale));
}

@media (min-width: 992px) {
    .garagekonstantinlayout .carousel-item-type-text .carousel-text-inner {
        width: 100%;
    }
}
.powermail_message_error,
.powermail_message_error ol,
.powermail_message_error h2,
.powermail_message_error ul { display: none; }

#c805 .tx-powermail h3 {
  display: none;
}

.powermail_field_error {
  border: 1px solid red !important;
}