
/* 3S ERP Relaunch – gemeinsame, responsive Bausteine (06.11.2026) */
*,*::before,*::after {box-sizing:border-box}
/* Bilder: definierte Originalbreiten respektieren, aber nie aus dem Container ragen lassen. */
.article-body img,.entry-content img{max-width:100%!important;height:auto!important}
.article-body img:not([width]):not(.video-poster-img),.entry-content img:not([width]):not(.video-poster-img){width:auto!important}
.article-body img[width="150"],.entry-content img[width="150"]{width:min(150px,100%)!important}
.article-body img[width="200"],.entry-content img[width="200"]{width:min(200px,100%)!important}
.article-body img[width="189"],.entry-content img[width="189"]{width:min(189px,100%)!important}
.article-body img[width="263"],.entry-content img[width="263"]{width:min(263px,100%)!important}
.article-body .wp-block-image,.entry-content .wp-block-image{max-width:100%}
.article-body figure,.entry-content figure{max-width:100%}
/* WordPress noscript images are fallback only, never a second visible copy. */
.article-body noscript,.entry-content noscript{display:none!important}
/* Show and center sidebar heading icons. */
.side .infotitle{display:flex!important;align-items:center!important;gap:10px!important;margin-bottom:10px}
.side .infotitle h2{margin:0!important;line-height:1.3!important}
.side .infotitle > span,.side .infotitle > svg{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 23px;width:23px;height:23px;line-height:1!important;font-size:22px!important;color:#154194}
.sidebox .sidenav a[aria-current="page"]{font-weight:700;color:#154194}
/* Shared notification design: full-width text over a subtle original icon. */
:is(.article-body,.entry-content) .stk-block-notification{position:relative!important;isolation:isolate;max-width:100%;overflow:hidden!important;background:#154194!important;color:#fff!important;border:0!important;border-radius:10px!important;padding:clamp(24px,4vw,40px)!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-notification__content{position:static!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;width:100%!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-notification__content > .stk-block-content{position:static!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:22px!important;padding:0!important;margin:0!important;width:100%!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-notification__content > .stk-block-content > :not(.stk-block-icon){position:relative!important;z-index:1;min-width:0!important;max-width:100%!important;width:auto!important;margin:0!important;padding:0!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-icon{position:absolute!important;inset:-38px auto auto -32px!important;float:none!important;transform:rotate(-12deg)!important;margin:0!important;padding:0!important;width:240px!important;height:240px!important;opacity:.17!important;z-index:0!important;pointer-events:none!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-icon :is(.stk--svg-wrapper,.stk--inner-svg){display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:100%!important;background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;margin:0!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-icon svg:last-child{display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-icon svg:not(:last-child){position:absolute!important;width:0!important;height:0!important;overflow:hidden!important}
:is(.article-body,.entry-content) .stk-block-notification .stk-block-icon svg path{fill:#fff!important;stroke:none!important;opacity:1!important}
:is(.article-body,.entry-content) .stk-block-notification :is(h2,h3,h4,p,li,.stk-block-heading__text){color:#fff!important;max-width:100%;overflow-wrap:break-word}
:is(.article-body,.entry-content) .stk-block-notification :is(p,.stk-block-heading__text){margin:0!important}
:is(.article-body,.entry-content) .stk-block-notification a{color:#fff!important;text-decoration:underline!important;text-underline-offset:3px}
@media(max-width:630px){
 :is(.article-body,.entry-content) .stk-block-notification .stk-block-icon{width:180px!important;height:180px!important;inset:-25px auto auto -30px!important;opacity:.13!important}
 :is(.article-body,.entry-content) .stk-block-notification .stk-block-notification__content > .stk-block-content{gap:18px!important}
}
/* Wide tables never overflow the sidebar or mobile viewport. */
.article-body .wp-block-table,.entry-content .wp-block-table{display:block!important;overflow-x:auto!important;max-width:100%!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.article-body .wp-block-table table,.entry-content .wp-block-table table{width:max-content;min-width:100%;border-collapse:collapse}
.article-body table td,.entry-content table td{overflow-wrap:normal}
/* Decorative separators should not overlap content. */
.article-body .stk-has-top-separator,.entry-content .stk-has-top-separator{position:relative;isolation:isolate}
.article-body .stk-has-top-separator>.stk-separator__top,.entry-content .stk-has-top-separator>.stk-separator__top{pointer-events:none!important;z-index:0!important}
.article-body .stk-has-top-separator>.stk-row,.entry-content .stk-has-top-separator>.stk-row{position:relative!important;z-index:2!important;padding-top:52px!important}
/* Reusable video tile: poster + centered, familiar YouTube play rectangle. */
.s3-video{width:100%;max-width:860px;margin:18px auto 26px;clear:both;font-family:inherit}
.s3-video-trigger{position:relative!important;display:block!important;width:100%!important;aspect-ratio:16/9;overflow:hidden;border:0!important;border-radius:13px!important;padding:0!important;background:linear-gradient(145deg,#163e7b,#0c2345)!important;cursor:pointer!important;box-shadow:0 8px 26px #122e5326;isolation:isolate}
.s3-video-trigger .s3-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s3-video-trigger .s3-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,15,37,.68),rgba(4,15,37,.04) 65%);z-index:1}
.s3-video-trigger .s3-brand{position:absolute;top:17px;left:19px;z-index:2;font-size:12px;letter-spacing:.11em;font-weight:800;color:#fff;text-transform:uppercase}
.s3-video-trigger .s3-inside-title{position:absolute;left:19px;bottom:19px;right:19px;z-index:2;color:#fff;font-weight:700;font-size:clamp(15px,2.2vw,23px);text-align:left;text-shadow:0 1px 4px #000b}
.s3-video-trigger .s3-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;display:grid;place-items:center;width:80px;height:57px;border-radius:15px;background:rgba(26,27,31,.90);box-shadow:0 5px 22px #0005;transition:background .18s,transform .18s}
.s3-video-trigger .s3-play::before{content:"";width:0;height:0;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:23px solid #fff;margin-left:5px}
.s3-video-trigger:hover .s3-play,.s3-video-trigger:focus-visible .s3-play{background:#ef7d00;transform:translate(-50%,-50%) scale(1.07)}
.s3-video-trigger:focus-visible{outline:3px solid #ef7d00!important;outline-offset:3px}
.s3-video iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:13px}
.s3-video-meta{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:11px 2px;flex-wrap:wrap}
.s3-video-meta strong{font-size:clamp(16px,1.6vw,19px);color:inherit}
.s3-video-meta a{font-size:13px;white-space:nowrap;color:#154194;text-decoration:underline}
.s3-video.is-dark .s3-video-meta a{color:#fff!important}
.s3-video.is-dark .s3-video-meta strong{color:#fff!important}
.s3-bde-diagram{margin:22px 0;width:100%;max-width:100%;clear:both}
.s3-bde-diagram img{display:block;width:100%!important;max-width:100%!important;height:auto!important;border-radius:12px;border:1px solid #d9e4f1}
.s3-bde-diagram figcaption{margin:10px 0;font-size:14px;color:#586a7e}
.s3-bde-diagram a{display:block;cursor:zoom-in}
/* CRM dual responsive image and the original two-column relationship */
.entry-content .stk--hide-mobile{display:block!important}
.entry-content .stk--hide-desktop.stk--hide-tablet{display:none!important}
.entry-content .stk-block-image.alignright{float:right!important;width:min(44%,390px)!important;max-width:44%!important;margin:0 0 20px 25px!important}
.entry-content .stk-block-image.alignright img{width:100%!important;height:auto!important}
.crm-video-section{position:relative;overflow:hidden;padding:24px!important;margin:32px 0!important;background:#154194!important;color:#fff!important;border-radius:16px}
.crm-video-section .stk-separator{display:none!important}
.crm-video-section h2,.crm-video-section h3,.crm-video-section p{color:#fff!important}
.crm-video-section .stk-row{position:relative!important;z-index:1!important;display:flex!important;gap:24px;align-items:flex-start;padding:12px 0!important}
.crm-video-section .stk-row>.stk-column{flex:1 1 0!important;min-width:0!important;margin:0!important}
.crm-video-section .s3-video{margin:0 auto 10px}
/* Semantic footer shared by all pages */
footer.s3-footer{background:#102b56!important;color:#eaf2ff!important;margin-top:60px!important;padding:36px 0!important;clear:both}
footer.s3-footer .s3-footer-inner{width:min(1180px,calc(100% - 36px));margin:auto;display:flex;gap:25px;flex-wrap:wrap;align-items:center;justify-content:space-between}
footer.s3-footer .s3-footer-links{display:flex;gap:16px;flex-wrap:wrap}
footer.s3-footer a{color:#fff!important;text-decoration:underline;text-underline-offset:3px}
@media(max-width:720px){
 .entry-content .stk-block-image.alignright{float:none!important;width:min(100%,550px)!important;max-width:100%!important;margin:12px auto 20px!important}
 .entry-content .stk--hide-mobile{display:none!important}
 .entry-content .stk--hide-desktop.stk--hide-tablet{display:block!important}
 .crm-video-section .stk-row{flex-direction:column!important;display:flex!important}
 .crm-video-section .stk-row>.stk-column{width:100%!important;flex:auto!important}
 .article-body .stk-has-top-separator>.stk-row,.entry-content .stk-has-top-separator>.stk-row{padding-top:65px!important}
 .s3-video-meta a{white-space:normal}
}


/* Semantic warning/error variants retain the shared layout and readable contrast. */
:is(.article-body,.entry-content) .stk-block-notification.stk--is-error{background:#9f2635!important}
:is(.article-body,.entry-content) .stk-block-notification.stk--is-warning{background:#984600!important}

/* Small editorial illustration: wrap copy beside it, then use the full width. */
.article-body .s3-inline-illustration{display:flow-root;margin-block:28px}
.article-body .s3-inline-illustration > figure{float:left;width:150px;max-width:100%;margin:0 24px 12px 0!important}
.article-body .s3-inline-illustration > h2{margin-top:0;clear:none!important}
@media(max-width:630px){
 .article-body .s3-inline-illustration > figure{float:none;margin:0 0 18px!important}
}

.article-body .s3-inline-illustration-right > figure{float:right;margin:0 0 12px 24px!important}
@media(max-width:630px){.article-body .s3-inline-illustration-right > figure{float:none;margin:0 0 18px!important}}

/* Extra separation after the configurator notification. */
.article-body .s3-configurator-intro{margin-top:60px}

/* A heading already provides spacing before an illustrated list. */
.article-body :is(h2,h3) + .s3-inline-illustration{margin-top:0}
.article-body .s3-inline-illustration > figure + :is(ol,ul){margin-top:0}
.article-body .s3-inline-illustration > figure + :is(ol,ul) > li:first-child{margin-top:0}

/* Introductory paragraphs and plain lists form one compact content group. */
:is(.article-body,.entry-content) p:has(+ :is(ul,ol):not(.has-background)){margin-bottom:12px!important}
:is(.article-body,.entry-content) p + :is(ul,ol):not(.has-background){margin-top:0!important}
:is(.article-body,.entry-content) p + :is(ul,ol):not(.has-background) > li:first-child{margin-top:0!important}

/* Consistent editorial image/text columns: reserve only the space images need. */
:is(.article-body,.entry-content) .s3-media-row{display:grid!important;grid-template-columns:minmax(0,22%) minmax(0,1fr)!important;gap:24px!important;align-items:start!important}
:is(.article-body,.entry-content) .s3-media-row.s3-media-right{grid-template-columns:minmax(0,1fr) minmax(0,22%)!important}
:is(.article-body,.entry-content) .s3-media-row > :is(.s3-media-picture,.s3-media-copy){float:none!important;min-width:0!important;width:auto!important;max-width:100%!important;margin:0!important;padding:0!important;flex:none!important}
:is(.article-body,.entry-content) .s3-media-row > .s3-media-picture{grid-column:1;grid-row:1}
:is(.article-body,.entry-content) .s3-media-row > .s3-media-copy{grid-column:2;grid-row:1}
:is(.article-body,.entry-content) .s3-media-right > .s3-media-picture{grid-column:2}
:is(.article-body,.entry-content) .s3-media-right > .s3-media-copy{grid-column:1}
:is(.article-body,.entry-content) .s3-media-row > .stk-column > .stk-column-wrapper{width:100%!important;margin:0!important;padding:0!important}
:is(.article-body,.entry-content) .s3-media-picture figure{margin:0!important}
:is(.article-body,.entry-content) .s3-media-copy > :is(h2,h3,ol,ul):first-child{margin-top:0!important}
:is(.article-body,.entry-content) .s3-media-copy > :is(ol,ul):first-child > li:first-child{margin-top:0!important}
@media(max-width:720px){
 :is(.article-body,.entry-content) .s3-media-row,:is(.article-body,.entry-content) .s3-media-row.s3-media-right{grid-template-columns:minmax(0,1fr)!important;gap:18px!important}
 :is(.article-body,.entry-content) .s3-media-row > .s3-media-picture{grid-column:1;grid-row:1}
 :is(.article-body,.entry-content) .s3-media-row > .s3-media-copy{grid-column:1;grid-row:2}
}

/* Video preview: one centered 16:9 image with a centered play control. */
:is(.article-body,.entry-content) .s3-video{width:100%!important;max-width:790px;margin:20px auto!important;text-align:center;background:transparent!important}
:is(.article-body,.entry-content) .s3-video-trigger{aspect-ratio:16/9!important;height:auto!important;min-height:0!important;background:transparent!important}
:is(.article-body,.entry-content) .s3-video .s3-video-trigger > img.s3-poster{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.s3-video .s3-shade,.s3-video .s3-brand,.s3-video .s3-inside-title{display:none!important}
.s3-video .s3-video-meta{justify-content:center;flex-direction:column;gap:6px;text-align:center}
:is(.article-body,.entry-content) figure:has(> .s3-video){width:100%;margin-inline:auto!important;background:transparent!important}
:is(.article-body,.entry-content) :is(h2,h3):has(+ .s3-video),
:is(.article-body,.entry-content) :is(h2,h3):has(+ figure > .s3-video){text-align:center!important}

/* Terminology comparisons fit the article; each mobile row becomes a labelled card. */
.article-body .s3-terms-table{overflow:visible!important;margin:24px 0 30px}
.article-body .s3-terms-table table{width:100%!important;min-width:0!important;table-layout:fixed;font-size:16px;line-height:1.55;border-collapse:collapse}
.article-body .s3-terms-table :is(th,td){padding:12px 14px;border:1px solid #d3deeb;white-space:normal!important;overflow-wrap:anywhere!important;hyphens:auto;vertical-align:top;text-align:left}
.article-body .s3-terms-table th{background:#edf3fb;color:#173b70;font-weight:700}
.article-body .s3-terms-table tbody tr:nth-child(even){background:#f7f9fc}
.article-body .s3-terms-comparison th:first-child{width:44%}
.article-body .s3-terms-comparison th:nth-child(2){width:24%}
.article-body .s3-terms-comparison th:last-child{width:32%}
.article-body .s3-terms-comparison td:last-child{font-weight:650;color:#154194}
.article-body .s3-terms-names th:first-child{width:60%}
.s3-terms-table .s3-cell-label{display:none}
@media(max-width:630px){
 .article-body .s3-terms-table table,.article-body .s3-terms-table tbody{display:block}
 .article-body .s3-terms-table thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .article-body .s3-terms-table tbody tr{display:block;margin:0 0 14px;border:1px solid #d3deeb;border-radius:10px;overflow:hidden;background:#fff}
 .article-body .s3-terms-table td{display:block;width:100%;border:0;padding:10px 14px}
 .article-body .s3-terms-table td+td{border-top:1px solid #e3eaf3}
 .s3-terms-table .s3-cell-label{display:block;margin-bottom:3px;font-size:13px;font-weight:700;color:#53657b}
 .article-body .s3-terms-comparison td:last-child{background:#edf3fb}
}

/* Shared video frame. New videos: wrap heading + .s3-video in .s3-video-panel.
   Change these variables once to restyle every frame; set --s3-video-wave: none
   and --s3-video-wave-height: 0px for straight edges. No separator HTML needed. */
:root{
 --s3-video-panel-color:#154194;
 --s3-video-wave-height:44px;
 --s3-video-wave:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201600%20200%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22%23ccc%22%20opacity%3D%22.5%22%20d%3D%22M1135.1%20214.2c-125.1-8.8-287.8-45.1-403.6-67.4-130.5-25.2-188-114.3-420.2-90.9C143.1%2071.1-7.1%209-7.1%209v200.4l1142.2%204.8z%22%2F%3E%3Cpath%20fill%3D%22%23ccc%22%20opacity%3D%22.5%22%20d%3D%22M1610%20207V96.4s-176.1-14.9-340.9%2021.2c-166%2036.4-255.1%2045-330.4%2030.6-75.3-14.3-195.4-62.3-515.8-11.3-189%2030-349.8%2050.8-450.9%2070.1h1638z%22%2F%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M1610%20209.7v-51.2s-81.4-33.3-241.4-23.1c-157.4%2010-247.9%2049.6-340.9%2049.4-93.1-.1-121-14.6-174.2-33.6-75.7-27.1-166.9-27.2-185.5-25.1-18.7%202.1-67.8%205.5-106-19.3-38.2-24.7-94.8-55.4-209.2-43.1C238.1%2076.3%2080%20111.8-10%2055.7v154h1620z%22%2F%3E%3C%2Fsvg%3E");
}
:is(.article-body,.entry-content) .s3-video-panel{position:relative!important;isolation:isolate;padding:calc(var(--s3-video-wave-height) + 32px) 32px calc(var(--s3-video-wave-height) + 20px)!important;margin:32px 0!important;background:var(--s3-video-panel-color)!important;color:#fff!important;overflow:hidden!important;border-radius:0!important}
:is(.article-body,.entry-content) .s3-video-panel::before,
:is(.article-body,.entry-content) .s3-video-panel::after{content:""!important;position:absolute;left:0;right:0;width:100%;height:var(--s3-video-wave-height);background:var(--s3-video-wave) center / 100% 100% no-repeat;z-index:2;pointer-events:none}
:is(.article-body,.entry-content) .s3-video-panel::before{top:0;transform:scaleY(-1)}
:is(.article-body,.entry-content) .s3-video-panel::after{bottom:0}
:is(.article-body,.entry-content) .s3-video-panel > .stk-row{position:relative!important;z-index:1!important;padding:0!important;margin:0!important;width:100%!important;max-width:100%!important}
:is(.article-body,.entry-content) .s3-video-panel:not(.crm-video-section) > .stk-row > .stk-column{left:0!important;right:auto!important;margin:0!important;padding:0!important;min-width:0!important;width:100%!important;max-width:100%!important;flex:0 0 100%!important}
:is(.article-body,.entry-content) .s3-video-panel .stk-column-wrapper{margin:0!important;padding:0!important;width:100%!important}
:is(.article-body,.entry-content) .s3-video-panel :is(h2,h3){text-align:center!important;color:#fff!important;margin:0 0 20px!important}
:is(.article-body,.entry-content) .s3-video-panel .wp-block-spacer{display:none!important}
:is(.article-body,.entry-content) .s3-video-panel .s3-video-meta strong{display:none}
@media(max-width:630px){:is(.article-body,.entry-content) .s3-video-panel{padding:calc(var(--s3-video-wave-height) + 20px) 16px calc(var(--s3-video-wave-height) + 12px)!important}}
