:root {

    /* ===== PRIMARY ===== */
    --bs-primary:#353956;
   --bs-primary-rgb: 53, 57, 86;
     --bs-primary-color: 53, 57, 86;

    /* ===== SECONDARY (Bootstrap Yellow) ===== */
    --bs-secondary: #FFD700;
    --bs-secondary-rgb: 255, 215, 0;
    --bs-secondary-color: 255, 215, 0;

        /* Link Farbe */
    --bs-link-color: #0057B8;
    --bs-link-color-rgb: 0, 87, 184;
    
    --bs-body-color: #3e3f3a;
    --bs-body-color-rgb: 62, 63, 58;

    --bs-link-hover-color: #27496b;
    --bs-link-hover-color-rgb: 39, 73, 107;
    
    
    /* Navbar Text auf bg-primary */
    --bs-navbar-color: var(--bs-secondary);
    --bs-navbar-hover-color: var(--bs-secondary);
    --bs-navbar-active-color: var(--bs-secondary);

    --bs-navbar-brand-color: var(--bs-secondary);
    --bs-navbar-brand-hover-color: var(--bs-secondary);
    --bs-nav-link-color: var(--bs-secondary);
    --bs-body-font-size: 1.25rem;
    --bs-dropdown-link-color: --bs-body-color;
    --bs-heading-color: #353956;
}
[data-bs-theme="dark"] {
  --bs-body-color: #ffffff;
--bs-link-color: #FFD700;
--bs-link-color-rgb: 255, 215, 0;
 --bs-link-hover-color-rgb: 255, 215, 0;
 --bs-heading-color: #FFD700;
 .card-body {
    color: #ffffff;
    }
    .bg-secondary .card-body {
    color: #3e3f3a;
    .btn-primary {color:#fff !important}
    }
 .bg-secondary {
 color: #3e3f3a;
 --bs-heading-color: #353956;
 a {color:#353956}
 
 }
}
a {

    text-decoration: none;
}

    lead {
        font-size: 1.75rem;
    }
.btn-secondary {
    --bs-btn-color: #000;
    --bs-btn-bg: #FFD700;
    --bs-btn-border-color: #FFD700;

    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #e6c200;
    --bs-btn-hover-border-color: #d9b800;

    --bs-btn-focus-shadow-rgb: 255, 215, 0;

    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #d9b800;
    --bs-btn-active-border-color: #ccad00;

    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,.125);

    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #FFD700;
    --bs-btn-disabled-border-color: #FFD700;
}
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #353956;
    --bs-btn-border-color: #353956;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2e324b;
    --bs-btn-hover-border-color: #2a2d43;

    --bs-btn-focus-shadow-rgb: 53, 57, 86;

    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2a2d43;
    --bs-btn-active-border-color: #25283c;

    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,.125);

    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #353956;
    --bs-btn-disabled-border-color: #353956;
}

.navbar-brand img {
  max-height: 100px;
  width: auto;
}
/* NUR navbar mit bg-primary */
.dropdown-item {
    color: var(--bs-body-color);
    }
.navbar.bg-primary {
  --bs-navbar-color: var(--bs-secondary);
  --bs-navbar-hover-color: var(--bs-secondary);
  --bs-navbar-active-color: var(--bs-secondary);
  --bs-navbar-brand-color: var(--bs-secondary);
  --bs-navbar-brand-hover-color: var(--bs-secondary);
}

.breadcrumb, .btn, .dropdown-menu .dropdown-item, .nav-pills .nav-link, .nav-tabs .nav-link, .navbar .nav-link, .pagination, .sandstone, .tooltip {
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 22px;
    text-transform: uppercase;
    font-weight:500;
}
.navbar-brand {
    font-size: 3rem;
    }
img {
  width: 100%;
}
.video,
.img {
  position: relative;
  display: block;
  --w: 1;
  --h: 1;
  padding-bottom: calc(100% / var(--w) * var(--h));
  background: var(--color-black);
}
.img img,
.video iframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
}
.img[data-contain] img {
  object-fit: contain;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0;
    padding-bottom: 1.5rem;
}

.grid {
  --columns: 12;
  --gutter: 3rem;
  display: grid;
  grid-gap: var(--gutter);
  grid-template-columns: 1fr;
}
.grid > .column {
  margin-bottom: var(--gutter);
}

.autogrid {
  --gutter: 3rem;
  --min: 10rem;
  display: grid;
  grid-gap: var(--gutter);
  grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
  grid-auto-flow: dense;
}

@media screen and (min-width: 60rem) {
  body {
    --padding: 3rem;
  }

  .grid {
    grid-template-columns: repeat(12, 1fr);
  }
  .grid > .column {
    grid-column: span var(--columns);
  }

}

.pagination {
  display: flex;
  padding-top: 6rem;
}
.pagination > span {
  color: var(--color-text-grey);
}
.pagination > * {
  padding: .5rem;
  width: 3rem;
  text-align: center;
  border: 2px solid currentColor;
  margin-right: 1.5rem;
}
.pagination > a:hover {
  background: var(--color-black);
  color: var(--color-white);
  border-color: var(--color-black);
}

@media screen and (max-width: 60rem) {
 header.px-5 {padding: 0  !important; margin: 0 !important;}
 main.p-5 {padding: 1rem !important; }
 }
 
 .honeypot {
    position: absolute;
    left: -9999px;
}

abbr[title] {
    -webkit-text-decoration: none  !important;
     text-decoration: none !important; 
    cursor: auto  !important; 

}

/* 3. Ebene optisch einrücken */
.dropdown-lvl3-list .dropdown-item {
  padding-left: 2rem;
}

/* Toggle-Button rechts (nur Pfeil, ohne Extra-Text) */
.dropdown-lvl3-toggle {
  width: 2.5rem;
  text-align: center;
}

/* Pfeil anzeigen */
.dropdown-lvl3-toggle::after {
  content: "?";
  display: inline-block;
  line-height: 1;
}

/* Optional: im Offcanvas etwas mehr Luft */
.offcanvas .dropdown-lvl3-list .dropdown-item {
  padding-left: 2.25rem;
}



/* 3. Ebene optisch einrücken */
.dropdown-lvl3-list .dropdown-item {
  padding-left: 2rem;
}

/* 3.-Ebene Toggle als kleiner Pfeil-Button rechts */
.dropdown-lvl3-toggle {
  width: 2.25rem;
  padding: 0 .25rem;
  border: 0;
  background: transparent;
  line-height: 1;
}

/* 3. Ebene: Pfeil exakt wie Bootstrap dropdown-toggle */
.dropdown-lvl3-toggle::after {
  display: inline-block;
  margin-left: .255em;
  vertical-align: .255em;
  content: "";
  border-top: .3em solid;
  border-right: .3em solid transparent;
  border-bottom: 0;
  border-left: .3em solid transparent;
}

/* Optional: Pfeil drehen, wenn offen */
.dropdown-lvl3-toggle[aria-expanded="true"]::after {
  transform: rotate(180deg);
}
.navbar-toggler {

    background-color: var(--bs-secondary) !important;
    }
    
    .offcanvas-title {

    color: var(--bs-secondary) !important;
    }
.navbar-expand-md .offcanvas {

        background-color: var(--bs-primary) !important;
        }
/* Custom Hero Ratios */
.ratio-24x7 {
  --bs-aspect-ratio: calc(7 / 24 * 100%);
}

.ratio-32x9 {
  --bs-aspect-ratio: calc(9 / 32 * 100%);
}

.ratio-3x1 {
  --bs-aspect-ratio: calc(1 / 3 * 100%);
}

.ratio-5x1 {
  --bs-aspect-ratio: calc(1 / 5 * 100%);
}
.ratio-40x9 {
  --bs-aspect-ratio: calc(9 / 40 * 100%);
}

  .ratio > a,
  .ratio > a > img {
    width: 100%;
    height: 100%;
    display: block;
  }

  .ratio > a > img {
    object-fit: cover;
    object-position: center center;
  }