:root{
    --spacing-small: clamp(1rem, 0.8rem + 1vw, 2rem);
    --spacing-middle: clamp(2rem, 1.6rem + 2vw, 5rem);
    --spacing-large: clamp(3rem, 2.3rem + 3.5vw, 7.5rem);
    --spacing-extra-large: clamp(7.5rem, 6.75rem + 3.75vw, 11.25rem);
    --h1: clamp(2.5rem, 1.978rem + 2.61vw, 4rem);
    --h2: clamp(1.75rem, 1.576rem + 0.87vw, 2.25rem);
    --h3: clamp(1.2rem, 1.096rem + 0.52vw, 1.5rem);
    --h4: clamp(1rem, 0.868rem + 0.66vw, 1.38rem);
}

.abstand-unten-small {
    margin-bottom: var(--spacing-small);
}
.abstand-unten-middle {
    margin-bottom: var(--spacing-middle);
}
.abstand-unten-large {
    margin-bottom: var(--spacing-large);
}
.abstand-unten-extra-large {
    margin-bottom: var(--spacing-extra-large);
}
.h1 h1 {
    font-size: var(--h1);
    font-weight: 900;
    text-transform: uppercase;
}
.h2 h2 {
    font-size: var(--h2);
    font-weight: 900;
    line-height: 3.25rem;
}
.h3 h3 {
    font-size: var(--h3);
    font-weight: 900;
    line-height: 2rem;
}
.h4 h4 {
    font-size: var(--h4);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 5.5px;
    line-height: 2rem;
}

.bullet-arrow {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
.bullet-arrow-fa {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.bullet-arrow li {
  position: relative;
  padding-left: 20px !important;
}
.bullet-arrow-fa li {
  position: relative;
  padding-left: 32px;
  margin-bottom: 8px;
}

/* Versteckt WPBakery-eigene Icons (falls vorhanden) */
.bullet-arrow li i,
.bullet-arrow li::marker,
.bullet-arrow li::before,
.bullet-arrow-fa li i,
.bullet-arrow-fa li::marker,
.bullet-arrow-fa li::before{
  display: none;
}


/* Setzt unser eigenes rotes ">" */
.bullet-arrow li::after {
  content: ">";
  color: red;
  font-weight: bold;
  position: absolute;
  left: 0;
  top: 0;
}
.bullet-arrow-fa li::after {
  font-family: "Font Awesome 5 Free"; /* oder 'Font Awesome 6 Free', je nach Version */
  content: "\f061"; /* Unicode für fa-arrow-right */
  font-weight: 900; /* solid style */
  position: absolute;
  left: 0;
  top: 0;
  color: red;
}

.filter-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    list-style: none;
    padding: 0;
    margin: 0;
    max-width: clamp(44rem, 32.241rem + 18.97vw, 55rem);
    justify-content: center;
}

.filter-list li {
    padding: 0.4rem 1rem;;
    border: 2px solid #7DBAF7; /* heller Blau-Ton */
    border-radius: 30px;
    color: #003366; /* dunkles Blau für Text */
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: white;
    white-space: nowrap;
}

/* Menu-Items beim hovern underlinen */
#primary-nav > li a:hover {
  text-decoration: underline;
}

/* Schatten von Buttons entfernen */
.btn-bordered:hover, .btn-solid:hover {
    box-shadow: unset !important;
}

/*JBR Headline Portfolio blau*/
.lqd-pf-item .lqd-pf-details h2, .lqd-pf-item .lqd-pf-details a {
    color: #00448B;
}

/* HWI - Portfolio Filter Mobil */
@media (max-width: 991px) {
    .filter-list {
        display: none !important;
    }
}

.filter-list li:hover {
    background-color: #e6f0fa;
    border-color: #00448B;
}

.filter-list li.active {
    background-color: #D6E9FA;
    border-color: #002B5C;
    color: #002B5C;
}

/* HWI - Portfolio Filter */
.filter-list-inline li,
.filter-list-inline li + li {
    margin-inline-start: unset;    
}


/* HWI - Pagination bei Portfolio Items */
.carousel-dots-mobile {
    display: block;
}
.carousel-dots-style4.carousel-dots-mobile .dot {
  width: 18px;
  height: 18px;
  background-color: #72B9F9;
}
.carousel-dots-style4.carousel-dots-mobile .dot.is-selected {
  width: 48px;
  background-color: #0781EF;
}
/* HWI - Contact Form */
.wpcf7-form .contact-field {
    border: 1px solid #333;
    border-radius: 4px !important;
    background: #f6f6f6;
}
.wpcf7-form .btn-submit {
    border-radius: 53px;
    background: #ef4023 !important;
}
.wpcf7-form .wpcf7-spinner {
    display: none;
}