/* Editor-friendly content classes. Redakteure setzen diese Klassen über das Format-Menü
   im WPBakery-Texteditor; es ist kein SVG- oder Inline-CSS-Markup im Inhalt nötig. */

/* Pfeil-Symbole an Links, Buttons und Listenzeilen (ersetzt eingebettete SVGs). */
.bx-ico::after{content:"";flex:none;display:block;width:12px;height:12px;background-color:currentColor;-webkit-mask:var(--bx-ico-mask,var(--bx-ico-ne)) center/contain no-repeat;mask:var(--bx-ico-mask,var(--bx-ico-ne)) center/contain no-repeat;transition:transform var(--bx-dur-2) var(--bx-ease-out)}
:root{--bx-ico-ne:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M4 10L10 4M5 4h5v5'/%3E%3C/svg%3E");--bx-ico-e:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M2.5 7h9M8 3.5L11.5 7 8 10.5'/%3E%3C/svg%3E");--bx-ico-s:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M7 2.5v9M3.5 8L7 11.5 10.5 8'/%3E%3C/svg%3E")}
.bx-ico--e{--bx-ico-mask:var(--bx-ico-e)}
.bx-ico--s{--bx-ico-mask:var(--bx-ico-s)}
.bx-btn.bx-ico::after,.bx-row.bx-ico::after{width:14px;height:14px}
.bx-link:hover.bx-ico--ne::after,.bx-btn:hover.bx-ico--ne::after,.bx-plan:hover .bx-link.bx-ico--ne::after{transform:translate(2px,-2px)}
.bx-link:hover.bx-ico--e::after,.bx-btn:hover.bx-ico--e::after{transform:translateX(3px)}
.bx-link:hover.bx-ico--s::after,.bx-btn:hover.bx-ico--s::after{transform:translateY(2px)}
.bx-row.bx-ico::after{background-color:var(--bx-on-surface-soft);transition:transform var(--bx-dur-3) var(--bx-ease-out),background-color var(--bx-dur-2)}
.bx-row:hover.bx-ico::after,.bx-row.is-on.bx-ico::after{transform:translate(3px,-3px);background-color:var(--bx-primary)}
.bx-sec--night .bx-row:hover.bx-ico::after{background-color:#fff}

/* Benannte Varianten statt wiederholter Inline-Styles. */
.bx-anchor-offset{position:relative!important;top:-120px!important}
.bx-row--button{width:100%!important;border:0!important;background:none!important;text-align:left!important;font:inherit!important}
.bx-mb-18{margin-bottom:18px!important}
.bx-finder__eyebrow{margin:0!important;color:#93a4bd!important}

/* Contact Form 7 im Bendex-Formulardesign (Formular „Bendex Kontakt“). */
.bx-chips--cf7 .wpcf7-form-control-wrap,.bx-chips--cf7 .wpcf7-radio{display:contents}
.bx-chips--cf7 .wpcf7-list-item{margin:0}
.bx-chips--cf7 .wpcf7-list-item>label{position:relative;display:block;margin:0}
.bx-field .wpcf7-form-control-wrap{display:block}
body.bendex-native :is(#main,#footer) .bx-consent--cf7{display:block}
.bx-consent--cf7 .wpcf7-list-item{margin:0}
body.bendex-native :is(#main,#footer) .bx-consent--cf7 label{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;margin:0;font:inherit;color:inherit}
.bx-consent--cf7 .wpcf7-list-item-label{font-size:14px}
.bx-finder-sum{padding:18px 20px;gap:6px}
.bx-finder-sum b{color:var(--bx-ink)}
.bx-finder-sum span{white-space:pre-line;font-size:14.5px}
.bx-form .wpcf7-not-valid-tip{font-size:13.5px;color:var(--bx-error);margin-top:6px}
.bx-form .bx-field.invalid .wpcf7-not-valid-tip{display:none}
.wpcf7 form.bx-form .wpcf7-response-output{margin:0;padding:12px 16px;border:1px solid var(--bx-error);border-radius:var(--bx-r-m);color:var(--bx-error);font-size:14px}
.bx-form .wpcf7-spinner{margin:0 0 0 12px}

/* Kundenlogos: Porto Carousel (Block „Kundenlogos – Karussell“) im Bendex-Kacheldesign. */
.bx-logo-carousel{margin-bottom:0!important}
/* Use the full section width, excluding the browser's vertical scrollbar. */
.vc_section:has(.bx-logos-host){container-type:inline-size}
.bx-logos-host{width:100cqw;margin-left:calc(50% - 50cqw)}
.bx-logo-carousel .bx-logo-tile{margin:0 12px 0 0!important;width:150px;height:64px}
.bx-logos--lg .bx-logo-carousel .bx-logo-tile{width:clamp(180px,16vw,236px);height:clamp(92px,9vw,120px);margin:0!important;border-right:1px solid var(--bx-line)}
body.bendex-native #main .bx-logo-carousel .bx-logo-tile{display:flex;align-items:center;justify-content:center}
.bendex-native #main .bx-logo-carousel .bx-logo-tile>.wpb_wrapper,.bendex-native #main .bx-logo-carousel .bx-logo-tile .vc_single_image-wrapper{display:flex!important;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0}
.bx-logo-carousel .owl-stage{transition-timing-function:linear!important}
.bx-logo-carousel .owl-stage-outer{padding:0!important}
.bx-logo-carousel .bx-logo-tile img{width:auto!important;height:auto!important;max-width:120px;max-height:40px;object-fit:contain;filter:grayscale(1);opacity:.62;transition:opacity var(--bx-dur-3),filter var(--bx-dur-3),transform var(--bx-dur-3) var(--bx-ease-out)}
.bx-logos--lg .bx-logo-carousel .bx-logo-tile img{max-width:62%;max-height:calc(clamp(92px,9vw,120px)*.46);opacity:.55}
.bx-logo-carousel .bx-logo-tile:hover img{opacity:1;filter:none;transform:scale(1.04)}
body.bendex-native #main .vc_custom_heading.bx-logos__label{font-size:11.5px!important;font-weight:600!important;line-height:1.65!important;min-height:24px;letter-spacing:.14em!important;text-transform:uppercase;color:var(--bx-on-surface-soft)!important;margin:0 0 18px!important}
body.bendex-native #main .bx-sec--logos .vc_custom_heading.bx-logos__label{margin-bottom:clamp(20px,2.5vw,32px)!important}
body.bendex-native #main .bx-logos--lg~* ,body.bendex-native #main .vc_custom_heading.bx-logos__label+.bx-logos--lg{margin-top:0}
.bx-logos--lg .bx-logo-carousel{border-top:1px solid var(--bx-line);border-bottom:1px solid var(--bx-line);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.bx-logo-carousel:not(.bx-logos--lg *){-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
/* Keep the explicitly enabled logo belt smooth in reduced-motion mode as well. */
body.bendex-native :is(#main,#footer) .bx-logo-carousel .owl-stage{transition-duration:var(--bendex-logo-speed,0s)!important}

/* Ordinary photos/screenshots share the logo's subtle 4px design radius.
   Demo, intro and technical animation surfaces retain their own rendering. */
:is(#main,#header .popup) img:not(:where(.bx-logo-tile *,.bx-logo *,.bx-aisim *,.bendex-ai-demo *,[data-motion] *,[data-studio] *,.bx-hero__vis *,.bx-glyph *,.bx-process *,.bx-intro *,.bx-demo *)){border-radius:var(--bx-r-s)}

/* News-Filter: Porto Sort Filters im Bendex-Chip-Design. */
body.bendex-native #main .bx-sort .sort-source{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;padding:0;border:0}
body.bendex-native #main .bx-sort .sort-source>li{margin:0;list-style:none}
body.bendex-native #main .bx-sort .sort-source>li>a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--bx-line);background:var(--bx-raise);font-size:14.5px;font-weight:400;line-height:1;text-transform:none;letter-spacing:0;color:var(--bx-on-surface-strong);text-decoration:none;transition:background var(--bx-dur-2),border-color var(--bx-dur-2),color var(--bx-dur-2)}
body.bendex-native #main .bx-sort .sort-source>li>a:hover{border-color:var(--bx-on-surface-strong)}
body.bendex-native #main .bx-sort .sort-source>li.active>a{background:var(--bx-primary);border-color:var(--bx-primary);color:#fff}
body.bendex-native #main .porto-sort-container.bx-news{display:block;border-top:1px solid var(--bx-line)}
body.bendex-native #main .porto-sort-container.bx-news>.row{margin:0}
body.bendex-native #main .porto-sort-container.bx-news .bx-news__entry{padding:0}

/* Shared native Porto fragments keep their existing grid/layout context. */
.bendex-native #main .porto-block.bendex-shared-fragment{display:contents}
/* Shared expand control: page clips, menu previews and the home contact video. */
.bendex-video-preview{display:block;position:relative;height:100%}
:is(body.bendex-native #main,#footer,#header,#popup-builder) .bendex-video-expand{position:absolute;top:12px;right:12px;z-index:4;display:grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:rgb(12 30 54/.6);color:#fff;cursor:pointer;backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity var(--bx-dur-2)}
:is(body.bendex-native #main,#footer,#header,#popup-builder) :is(.bx-clip,.bendex-video-preview):hover>.bendex-video-expand,
:is(body.bendex-native #main,#footer,#header,#popup-builder) .bendex-video-expand:focus-visible{opacity:1;pointer-events:auto}
:is(body.bendex-native #main,#footer,#header,#popup-builder) .bendex-video-expand:focus-visible{outline:none;border-radius:50%;box-shadow:var(--bx-focus)}
:is(body.bendex-native #main,#footer,#header,#popup-builder) .bx-clip:has(>.bx-clip__ctrl)>.bendex-video-expand{top:auto;bottom:12px;right:56px}
/* The home popup's close control occupies the screen's top-right corner. */
:is(body.bendex-native #main,#footer,#header,#popup-builder) .bendex-video-preview .bendex-video-expand{right:auto;left:12px}
.bendex-video-expand svg{width:12px;height:12px;pointer-events:none}
