/* Custom Colors */
:root {
  --custom-color: #ed0f00;
  --custom-color-dark: #C70C00;
  --custom-color-darker: #990900;
  --custom-color-light: #ff3c2e;
}



/* Spacer class: for empty div */
.spacer {
  display: block;
  height: 3rem;
}



/* Custom Font */
.custom-font {
  font-family: 'Merriweather', serif;
}



/* Custom Shadow on-hover */
.custom-shadow-on-hover:hover {
  box-shadow: 0 5px 15px var(--custom-color-dark);
}



/* Custom Background Colors */
.bg-custom {
  background-color: var(--custom-color);
}
.bg-custom-dark {
  background-color: var(--custom-color-dark);
}
.bg-custom-light {
  background-color: var(--custom-color-light);
}
.bg-custom-gray {
    background-color: #cccccc;
}



/* Custom Text Colors */
.text-custom {
  color: var(--custom-color);
}
.text-custom-dark {
  color: var(--custom-color-dark);
}
.text-custom-light {
  color: var(--custom-color-light);
}



/* Custom Links */
.link-custom {
  color: var(--custom-color);
  text-decoration: none;
}
.link-custom:hover {
  color: var(--custom-color-light);
  text-decoration: underline;
}
.link-custom:active {
  color: var(--custom-color-light);
}
.link-custom:focus {
  color: var(--custom-color-light);
}

/* Custom Link-White */
.link-custom-white {
  color: var(--custom-color);
  text-decoration: none;
}
.link-custom-white:hover {
  color: white;
  text-decoration: underline;
}
.link-custom-white:active {
  color: white;
}
.link-custom-white:focus {
  color: white;
}



/* Custom Nav-Links */
.nav-link-custom {
  color: var(--custom-color);
  font-weight: 600; /* Bootstrap semibold */
  text-decoration: none;
}
.nav-link-custom:hover {
  color: var(--custom-color-light);
}
.nav-link-custom:active {
  color: var(--custom-color-light);
}
.nav-link-custom:focus {
  color: var(--custom-color-light);
}



/* Custom Dropdown-Links */
.dropdown-link-custom {
  color: var(--custom-color-dark);
  font-weight: 600; /* Bootstrap semibold */
  text-decoration: none;
}
.dropdown-link-custom:hover {
  color: #FFF;
  background-color: var(--custom-color);
}
.dropdown-link-custom:active {
  color: var(--custom-color-dark);
}
.dropdown-link-custom:focus {
  color: var(--custom-color-dark);                  
}



/* Custom Input */
.input-custom:focus {
  box-shadow: 0 0 0 .2rem var(--custom-color-light) !important;
  border-color: var(--custom-color)
}



/* Custom Button */
.btn-custom {
  color: #FFF;
  background-color: var(--custom-color);
  border-color: var(--custom-color)
}
.btn-custom:hover {
  color: #FFF;
  background-color: var(--custom-color-dark);
  border-color: var(--custom-color-darker)
}
.btn-custom:focus,
.btn-custom.focus {
  box-shadow: 0 0 0 .2rem var(--custom-color-light)
}
.btn-custom.disabled,
.btn-custom:disabled {
  color: #212529;
  background-color: var(--custom-color-darker);
  border-color: var(--custom-color-darker)
}
.btn-custom:not(:disabled):not(.disabled):active,
.btn-custom:not(:disabled):not(.disabled).active,
.show>.btn-custom.dropdown-toggle {
  color: #212529;
  background-color: var(--custom-color-dark);
  border-color: var(--custom-color-darker)
}
.btn-custom:not(:disabled):not(.disabled):active:focus,
.btn-custom:not(:disabled):not(.disabled).active:focus,
.show>.btn-custom.dropdown-toggle:focus {
  box-shadow: 0 0 0 .2rem var(--custom-color-light)
}

/* Custom Button Outline */
.btn-outline-custom {
  color: var(--custom-color-dark);
  background-color: transparent;
  background-image: none;
  border-color: var(--custom-color-dark)
}
.btn-outline-custom:hover {
  color: #FFF;
  background-color: var(--custom-color);
  border-color: var(--custom-color-dark)
}
.btn-outline-custom:focus,
.btn-outline-custom.focus {
  box-shadow: 0 0 0 .2rem var(--custom-color-light)
}
.btn-outline-custom.disabled,
.btn-outline-custom:disabled {
  color: var(--custom-color-darker);
  background-color: transparent
}
.btn-outline-custom:not(:disabled):not(.disabled):active,
.btn-outline-custom:not(:disabled):not(.disabled).active,
.show>.btn-outline-custom.dropdown-toggle {
  color: #212529;
  background-color: var(--custom-color-dark);
  border-color: var(--custom-color-darker)
}
.btn-outline-custom:not(:disabled):not(.disabled):active:focus,
.btn-outline-custom:not(:disabled):not(.disabled).active:focus,
.show>.btn-outline-custom.dropdown-toggle:focus {
  box-shadow: 0 0 0 .2rem var(--custom-color-light)
}

/* Custom Button with Image */
.btn-with-image {
  color: gray;
  background-color: transparent;
  background-image: none;
  border-color: gray;
}
.btn-with-image:hover {
  color: #FFF;
  background-color: lightblue;
  border-color: #494b4d
}
.btn-with-image:focus,
.btn-with-image.focus {
  box-shadow: 0 0 0 .2rem lightblue
}
.btn-with-image.disabled,
.btn-with-image:disabled {
  color: #494b4d;
  background-color: transparent
}
.btn-with-image:not(:disabled):not(.disabled):active,
.btn-with-image:not(:disabled):not(.disabled).active,
.show>.btn-with-image.dropdown-toggle {
  color: #212529;
  background-color: rgb(141, 176, 187);
  border-color: #2d3748
}
.btn-with-image:not(:disabled):not(.disabled):active:focus,
.btn-with-image:not(:disabled):not(.disabled).active:focus,
.show>.btn-with-image.dropdown-toggle:focus {
  box-shadow: 0 0 0 .2rem lightblue
}/* END Custom Buttons */



/* Custom V-Divider TOP */
.custom-divider-top {
  background-color: var(--custom-color); 
  /* Adjust the height for thickness*/
  margin-top: -9vw; 
  height: 18vw; 
  width: 100%;
  /* The clip-path creates the precise V-shape polygon points */
  clip-path: polygon(0 0, 50% 40%, 100% 0, 100% 60%, 50% 100%, 0 60%);
  /* Set position */
  position: relative;
  z-index: 10;
}
/* SM ≥ 576px */
@media (min-width: 576px) {
  .custom-divider-top {
    margin-top: -7vw;
    height: 14vw;
  }
}
/* MD ≥ 768px */
@media (min-width: 768px) {
  .custom-divider-top {
    margin-top: -6vw;
    height: 12vw;
  }
}
/* LG ≥ 992px */
@media (min-width: 992px) {
  .custom-divider-top {
    margin-top: -5vw;
    height: 10vw;
  }
}
/* XL ≥ 1200px */
@media (min-width: 1200px) {
  .custom-divider-top {
    margin-top: -4vw;
    height: 8vw;
  }
}

/* Custom V-Divider BOTTOM */
.custom-divider-bottom {
  background-color: var(--custom-color); 
  /* Adjust the height for thickness*/
  margin-bottom: -9vw; 
  height: 18vw; 
  width: 100%;
  /* The clip-path creates the precise V-shape polygon points */
  clip-path: polygon(0 0, 50% 40%, 100% 0, 100% 60%, 50% 100%, 0 60%);
  /* Set position */
  position: relative;
  z-index: 10;
}
/* SM ≥ 576px */
@media (min-width: 576px) {
  .custom-divider-bottom {
    margin-bottom: -7vw;
    height: 14vw;
  }
}
/* MD ≥ 768px */
@media (min-width: 768px) {
  .custom-divider-bottom {
    margin-bottom: -6vw;
    height: 12vw;
  }
}
/* LG ≥ 992px */
@media (min-width: 992px) {
  .custom-divider-bottom {
    margin-bottom: -5vw;
    height: 10vw;
  }
}
/* XL ≥ 1200px */
@media (min-width: 1200px) {
  .custom-divider-bottom {
    margin-bottom: -4vw;
    height: 8vw;
  }
}

/* Custom V-Divider CONTENT */
.divider-bottom-content {
  padding-top: 4rem;   
}
@media (min-width: 768px) {
  .divider-bottom-content {
    padding-top: 7rem;
  }
}/* END Custom V Dividers */




/* Accent Lines & Wrappers */
/* Vertical */
.accent-line-vertical {
  position: relative;
  padding-left: 1rem;
}
.accent-line-vertical::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 80%;
  width: 9px;
  background: var(--custom-color); 
}
/* Horizontal */
.accent-line-horizontal {
  position: relative;
  padding-bottom: .5rem;
}
.accent-line-horizontal::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 0.375rem;                         /* ~6px */
  width: clamp(7.8125rem, 15vw, 10.625rem); /* Mindestens 125px, skaliert mit 15vw, maximal 170px */
  background: var(--custom-color);
}


/* Accent Image Wrapper */
.accent-image-wrapper {
  position: relative;
  display: inline-block;
}
.accent-image-wrapper::before {
  content: "";
  position: absolute;
  top: -25px;               /* vertical offset */
  left: 25px;              /* horizontal offset */
  width: 100%;
  height: 100%;
  background: var(--custom-color);
  z-index: -1;
}/* END Accent Lines & Wrappers */




/* Custom Hero */
.hero {
  background-image: url("/img/background/index-header-lg.jpg");
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  min-height: 70vh;
}
/* Adjust for smaller screens */
@media (max-width: 992px) {
  .hero {
    background-image: url("/img/background/index-header-md.jpg");
    min-height: 50vh;
  }
}/* END Hero */