/* Shared layout rules. Fonts and brand colors are maintained in Porto Theme Options. */
:root {
    --bendex-brand: var(--porto-primary-color, #27486d);
    --bendex-ink: var(--porto-secondary-color, #000850);
    --bendex-surface: #fafbfb;
    --bendex-surface-muted: #f3f4f7;
    --bendex-section-space: 80px;
    --bendex-hero-space: 158px;
    --bendex-card-radius: 32px;
}
.vc_section.bendex-section { padding-top: var(--bendex-section-space); padding-bottom: var(--bendex-section-space); }
.vc_section.bendex-hero { min-height: 75vh; padding-top: var(--bendex-hero-space); padding-bottom: var(--bendex-hero-space); }
.vc_section.bendex-hero--compact { min-height: 70vh; }
.vc_section.bendex-hero--plain { min-height: 0; padding-top: var(--bendex-hero-space); padding-bottom: var(--bendex-section-space); }
.bendex-hero--top { background-position: top !important; }
.bendex-hero--bottom { background-position: bottom !important; }
.bendex-hero--center { background-position: center !important; }
.bendex-hero--graphic { background-size: 38% !important; }
/* Footer text links stay plain until hovered or focused with the keyboard. */
#footer .footer-section .wpb_text_column a:is(:hover, :focus-visible) { text-decoration: underline; }
/* One checklist style for native Text Blocks, saved templates and Porto Price Boxes.
   The class can be set on the Text Block (Extra class name) or directly on its ul. */
:is(ul.bendex-feature-list, .bendex-feature-list ul) {
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    text-align: start;
}
.bendex-feature-list ul:last-child { margin-bottom: 0; }
:is(ul.bendex-feature-list, .bendex-feature-list ul) > li {
    position: relative;
    padding: 0;
    padding-inline-start: 26px;
    margin: 0 0 8px;
    line-height: 1.5;
}
:is(ul.bendex-feature-list, .bendex-feature-list ul) > li:last-child { margin-bottom: 0; }
:is(ul.bendex-feature-list, .bendex-feature-list ul) > li::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: .75em;
    transform: translateY(-50%);
    width: 16px;
    height: 12px;
    background: url("../images/icon-check-green.svg") center / contain no-repeat;
}

/* Native Porto Price Boxes, shared by every product comparison in both languages. */
.bendex-price-comparison { background: var(--bendex-surface-muted); color: var(--bendex-brand); }
.bendex-price-comparison > .container > .row { margin-bottom: 0; }
.bendex-price-comparison .porto-price-boxes { margin: 32px 0; }
.bendex-price-comparison .porto-price-boxes > .row { align-items: stretch; row-gap: 24px; margin-right: -12px; margin-left: -12px; }
.bendex-price-comparison .porto-price-boxes > .row > div { display: flex; padding-right: 12px; padding-left: 12px; }
.bendex-price-comparison .porto-price-box.plan {
    display: flex; flex-direction: column; width: 100%; margin: 0; padding: 0 0 28px;
    border: 0; border-radius: var(--bendex-card-radius); background: #fff;
    box-shadow: 0 15px 25px -5px #23347f26; overflow: hidden;
}
.bendex-price-comparison .porto-price-box.plan > h3 {
    display: flex; flex-direction: column; min-height: 340px; margin: 0;
    color: var(--bendex-ink); border: 0; border-radius: 0; text-align: center;
}
.bendex-price-comparison .porto-price-box.plan > h3 strong { display: block; min-height: 120px; }
.bendex-price-comparison .porto-price-box.plan .desc { display: block; min-height: 56px; margin: 24px 0; font-style: normal; }
.bendex-price-comparison .porto-price-box.plan .plan-price { display: flex; flex-direction: row; align-items: baseline; justify-content: center; gap: 4px; min-height: 64px; margin: auto 0 0; padding: 0; border: 0; box-shadow: none; width: 100%; height: auto; text-align: center; white-space: nowrap; }
.bendex-price-comparison .porto-price-box.plan :is(.price, .price-unit, .price-label) { position: static; padding: 0; margin: 0; }
.bendex-price-comparison .porto-price-box.plan :is(.price, .price-label) { display: block; }
.bendex-price-comparison .porto-price-box.plan .price-unit { display: inline; vertical-align: baseline; }
.bendex-price-comparison .porto-price-box.plan .price-label { text-transform: none; letter-spacing: normal; }
.bendex-price-comparison .porto-price-box.plan > ul { flex: 1; margin: 0 0 24px; border-top: 2px solid var(--bendex-surface-muted); }
.bendex-price-comparison .porto-price-box.plan > ul > li { border: 0; font-size: 16px; }
.bendex-price-comparison .porto-price-box.plan > .btn { align-self: center; position: static; margin: 0 20px; border-radius: 999px; }
.bendex-price-comparison .porto-price-box.plan > .btn:not(:hover) { background-image: none; }
.bendex-price-comparison .bendex-price-featured { outline: 2px solid var(--bendex-brand); outline-offset: -2px; }

@media (max-width: 991px) {
    :root { --bendex-section-space: 48px; --bendex-hero-space: 80px; }
    .vc_section.bendex-hero { min-height: 0; height: auto; background-image: none !important; }
    .bendex-price-comparison .porto-price-boxes > .row > div { max-width: 620px; margin: 0 auto; }
    .bendex-price-comparison .porto-price-box.plan > h3 { min-height: 0; }
    .bendex-price-comparison .porto-price-box.plan > h3 strong,
    .bendex-price-comparison .porto-price-box.plan .desc { min-height: 0; }
    .bendex-price-comparison .porto-price-box.plan .plan-price { min-height: 0; margin-top: 0; }
}

/* Shared existing components, grouped by page layout. Page-specific exceptions remain in WPBakery Custom CSS. */
@media (max-width: 992px){:where(.home) .banner-image-container img{min-height: 100vh;}}
:where(.home) :is(.features-section, .counter-section, .partner-program-container, .bendex-web-section) .row { justify-content: center; }
:where(.home) .partner-program-content-column{border-top-left-radius: 2rem;
 border-bottom-left-radius: 2rem;}
:where(.home) .partner-program-image-column{border-top-right-radius: 2rem;
 border-bottom-right-radius: 2rem;}
:where(.home, .bendex-layout-overview) .bendex-web-section-image{background-position: bottom right !important;}
@media (max-width: 1419px){:where(.bendex-layout-overview) :is(.info-section, .carousel-section, .vorteile-section, .custom-section){padding-left: 24px !important;
  padding-right: 24px !important;}}
:where(.bendex-layout-overview) :is(.info-section, .carousel-section, .support-section) > .row,
:where(.bendex-layout-overview) .vorteile-section .row,
:where(.bendex-layout-overview) :is(#lohnfertiger-id, #hersteller-id, #spengler-id, #hallenbau-id) > .row { justify-content: center; }
:where(.bendex-layout-overview) .support-section .porto-inner-container .porto-wrap-container .row{width: 100%;}
:where(.bendex-layout-overview) .support-section .porto-inner-container .porto-wrap-container{display: flex;
 justify-content: center;}
@media (max-width: 767px) {
    :where(.bendex-layout-overview) :is(#lohnfertiger-id, #spengler-id, #kanal-id) .vc_row .container .row { flex-direction: column-reverse; }
    :where(.bendex-layout-overview) :is(#lohnfertiger-id, #hersteller-id, #spengler-id, #hallenbau-id, #kanal-id) .vc_row .container .row .vc_column_container { padding-left: unset; padding-right: unset; }
}
:where(.bendex-layout-overview) .banner-column-container .wpb_wrapper{position: relative;
 display: flex;
 justify-content: center;
 flex-direction: column;}
:where(.bendex-layout-overview) .banner-column-container h2{z-index: 1;}
/* Contact and registration share field styling; CF7 markup owns wrapper layout. */
:where(.bendex-layout-content) .contact-form-section form { display: flex; flex-direction: column; }
:where(.bendex-layout-content) .contact-form-section :is(.form-labels-wrapper p, .message-box, .message-box label, .message-box label span) { display: flex; }
:where(.bendex-layout-content) .contact-form-section :is(.form-labels-wrapper p, .form-labels-wrapper p label, .message-box label, .message-box label span, .message-box label span textarea) { flex: 1; }
:where(.bendex-layout-content) .contact-form-section .form-labels-wrapper p { margin-bottom: 1rem !important; }
:where(.bendex-layout-content) .contact-form-section .form-labels-wrapper p label span { display: flex; flex-direction: column; }
:where(.bendex-layout-content) .contact-form-section .message-box { width: 100%; }
/* Porto Theme Options > Skin > Form Style owns field colors, borders, radius,
   font size and input height. CF7 fields use the native form-control class. */
.wpcf7 :is(input, textarea).form-control { padding: 12px 14px; font-family: inherit; }
.wpcf7 input.form-control { padding-block: 0; }
.wpcf7 textarea.form-control { height: auto; min-height: 84px; }
.wpcf7 .form-control:focus { outline: 2px solid var(--porto-primary-color); outline-offset: 1px; }
:where(.bendex-layout-content) .contact-form-section form p .btn { color: #fff; background-color: var(--bendex-brand); border-radius: 2rem; }
:where(.bendex-layout-content) .contact-form-section .wpcf7-form-control-wrap .wpcf7-list-item { margin-right: 0; }
:where(.bendex-layout-content) :is(.contact-form-section .row, .routes-section .vc_row, .imprint-section .row, .terms-and-conditions-section .row, .privacy-policy-section .row) { justify-content: center; }
:where(.bendex-layout-content) .routes-section h4{color: var(--bendex-brand);}
:where(.bendex-layout-content) .routes-section p{color: var(--bendex-ink);}
/* Native Porto Posts Grid and parent single-post template. */
.bendex-news-grid, .single-post .entry-content { color: var(--bendex-brand); }
.bendex-news-grid .porto-post-title a, .single-post .entry-title { color: var(--bendex-ink); }
.single-post .main-content { padding-top: var(--bendex-section-space); padding-bottom: var(--bendex-section-space); }
:where(.bendex-layout-content) .privacy-policy-section a{color: blue;}
@media (max-width: 768px) {
    :where(.bendex-layout-overview) .partner-section :is(.container .row, .wpb_single_image .wpb_wrapper) { display: flex; }
    :where(.bendex-layout-overview) .partner-logo .wpb_wrapper { position: relative !important; top: 0 !important; }
}
:where(.bendex-layout-overview) .partner-logo .wpb_wrapper{position: absolute;
 top: 20px;}

/* Small reusable badges; typography and colors follow Porto. */
.bendex-badge {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px; background: #fff;
    color: var(--bendex-brand); font-size: 13px; line-height: 1.4; font-weight: 500;
}
.bendex-badge--new { border: 1px solid #e6eaf0; padding-inline-start: 8px; }
.bendex-badge__icon {
    display: inline-grid; place-items: center; flex: 0 0 22px; width: 22px; height: 22px;
    border-radius: 50%; background: var(--bendex-brand); color: #fff; font-size: 17px;
}

/* One new-item badge for Porto's desktop/mobile menu tip and popup heading. */
.bendex-new-badge,
#header .bendex-ai-link .tip {
    display: inline-flex; align-items: center; justify-content: center;
    position: relative; top: auto; flex: 0 0 auto; vertical-align: middle;
    margin: 0; padding: 4px 10px; border: 0; border-radius: 999px;
    background: #8fb4e3; color: var(--bendex-ink);
    font-family: var(--porto-body-ff), sans-serif;
    font-size: 12px; line-height: 16px; font-weight: 700;
    letter-spacing: normal; text-transform: uppercase; white-space: nowrap;
}
#header .bendex-ai-link .tip::before,
#header .bendex-ai-link .tip::after { display: none; }

/* AI presentation uses native rows, headings, buttons, images and galleries. */
.vc_section.bendex-ai-hero { padding-top: clamp(80px, 8vw, 96px); padding-bottom: 16px; }
.bendex-ai-intro { max-width: 720px; margin: 0 auto 28px; text-align: center; }
.vc_section.bendex-ai-video-section { padding-top: 24px; }
.bendex-ai-video-column { max-width: 1040px; margin-inline: auto; }
.bendex-ai-video { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; border-radius: 24px; background: #eef2f7; box-shadow: 0 24px 48px -24px #14285055; }
.bendex-ai-chapters { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.bendex-ai-chapters button { font: inherit; font-size: 14px; line-height: 1.4; border: 1px solid #e1e6ee; background: #fff; color: var(--bendex-brand); border-radius: 999px; padding: 8px 14px; cursor: pointer; }
.bendex-ai-chapters button:hover { background: var(--bendex-brand); color: #fff; }
.bendex-ai-chapters button:focus-visible { outline: 2px solid var(--bendex-brand); outline-offset: 3px; }
.bendex-ai-overview-figure { padding: 18px; border-radius: 24px; background: #fff; box-shadow: 0 15px 25px -5px #23347f26; }
.bendex-ai-overview-figure figure { margin: 0; }
.bendex-ai-overview-figure img { display: block; width: 100%; height: auto; }
.bendex-ai-overview-figure figcaption { margin-top: 12px; text-align: center; font-size: 13px; line-height: 1.5; }
.vc_section.bendex-ai-feature-section { padding-block: 56px; }
.bendex-ai-feature-section + .bendex-ai-feature-section { border-top: 1px solid #27486d1f; }
.bendex-ai-feature-heading > .wpb_wrapper { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-bottom: 24px; }
.bendex-ai-feature-heading h2,
.bendex-ai-feature-heading .wpb_text_column,
.bendex-ai-feature-heading p { margin-bottom: 0; }
@media (max-width: 767px) {
    .bendex-ai-video { border-radius: 16px; }
    .bendex-ai-chapters button { font-size: 13px; padding: 7px 10px; }
    .bendex-ai-feature-heading > .wpb_wrapper { gap: 8px 14px; }
}

/* Shared native Porto slider controls for image galleries, cards and logos. */
.bendex-slider.owl-carousel .owl-nav:not(.disabled) { display: flex; justify-content: center; gap: 12px; margin-top: 18px; }
.bendex-slider.owl-carousel.rounded-nav .owl-nav button,
.bendex-slider.owl-carousel.rounded-nav .owl-nav button:hover {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; padding: 0; margin: 0;
    border: 1px solid var(--bendex-brand); border-radius: 50%;
    color: var(--bendex-brand); font-size: 20px; line-height: 1;
}
.bendex-slider.owl-carousel .owl-nav button:focus-visible,
.bendex-slider.owl-carousel .owl-dot:focus-visible { outline: 2px solid var(--bendex-brand); outline-offset: 3px; }
.bendex-slider.owl-carousel .owl-nav button.disabled { opacity: .35; }
.bendex-slider.owl-carousel .owl-dots { margin-top: 8px; text-align: center; }
.bendex-slider.owl-carousel .owl-dot { min-width: 20px; min-height: 30px; }
.bendex-slider.owl-carousel .owl-dot span { width: 8px; height: 8px; margin: 5px 6px; border: 0; background: #c7d1df; }
.bendex-slider.owl-carousel .owl-dot.active span,
.bendex-slider.owl-carousel .owl-dot:hover span { background: var(--bendex-brand); }
.bendex-slider--images > .owl-stage-outer { border-radius: 16px; background: #fff; box-shadow: 0 15px 25px -5px #23347f26; }
.bendex-slider--images figure { margin: 0; }
.bendex-slider--images img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: contain; background: #fff; }
/* Let the longest product card set the height; shorter cards stretch to match. */
.bendex-slider--cards .owl-stage { display: flex; align-items: stretch; }
.bendex-slider--cards .owl-item { display: flex; }
.bendex-slider--cards .system-carousel-item { width: 100%; background: var(--bendex-surface); border-radius: 16px; }

/* Shared dimensions for website actions; native Porto/WPB settings own colors and links.
   Empty size/padding fields inherit this standard, including newly inserted buttons. */
:is(#header, #main, #footer, #popup-builder, .bendex-video-teaser) .vc_btn3.btn,
.bendex-price-comparison .porto-price-box.plan > .btn,
.wpcf7 .wpcf7-submit.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    box-sizing: border-box; min-height: 48px; height: auto; max-width: 100%;
    padding: 10px 24px; border-width: 2px; border-style: solid; border-radius: 999px;
    font-family: var(--porto-body-ff), sans-serif; font-size: 16px; font-weight: 600;
    line-height: 24px; letter-spacing: normal; text-transform: none;
    text-align: center; vertical-align: middle; white-space: normal; overflow-wrap: anywhere;
}
.vc_btn3-container { max-width: 100%; }
/* Native button icons use absolute positioning; flex keeps both sides aligned
   without separate text offsets or extra padding for each icon direction. */
:is(#header, #main, #footer, #popup-builder, .bendex-video-teaser) .vc_btn3.btn > .vc_btn3-icon {
    position: static !important; transform: none !important; margin: 0 !important;
    display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 auto; box-sizing: border-box; width: 1em; height: 1em;
    padding: 0; font-size: 16px; line-height: 1;
}