/* Approved A content styles. Original navigation is exclusively defined by original-header.css. */
@font-face { font-family: "DM Sans"; src: url("/assets/fonts/dm-sans.woff2") format("woff2"); font-weight: 100 1000; font-style: normal; font-display: swap; }
:root{color-scheme: dark; --bg: #090b0c; --surface: #131718; --input: #3c4444; --text: #f3f5f4; --muted: #afb8b5; --line: #2b3231; --accent: #b6f1d5; --button: #b6f1d5; --button-text: #0d241b; --danger: #ffc2b5; --ease: cubic-bezier(.16,1,.3,1); --gutter: clamp(20px,6.55vw,100px); --measure: 70ch;}
:root[data-theme="light"]{color-scheme: light; --bg: #f6f7f4; --surface: #e8eeea; --input: #7c8982; --text: #14241c; --muted: #4d6055; --line: #b9c8bf; --accent: #215c41; --button: #b6f1d5; --button-text: #0d241b; --danger: #9a281a;}
*,::before,::after{box-sizing: border-box;}
html{scroll-padding-top: 96px;}
body{margin: 0px; background: var(--bg); color: var(--text); font-family: "DM Sans", sans-serif; font-size: 17px; line-height: 1.65; -webkit-font-smoothing: antialiased;}
button,input,textarea,select{font: inherit;}
button,a,input,summary,select,textarea{-webkit-tap-highlight-color: transparent;}
a{color: inherit; text-underline-offset: 4px;}
button,summary{cursor: pointer;}
button{color: inherit;}
img{max-width: 100%; height: auto; display: block;}
svg{width: 22px; height: 22px; flex: 0 0 auto; fill: none; stroke: currentcolor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;}
.icon{fill: currentcolor; stroke: none;}
button{border: 0px;}
button:disabled{cursor: default; opacity: 0.48;}
[hidden]{display: none !important;}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline: 2px solid var(--accent); outline-offset: 5px;}
.wrap{width: calc(100% - var(--gutter)*2); max-width: 1316px; margin-inline: auto;}
.skip-link{position: fixed; top: 10px; left: 16px; transform: translateY(-180%); z-index: 100; background: var(--button); color: var(--button-text); padding: 10px 20px; border-radius: 6px;}
.skip-link:focus{transform: none;}
h1,h2,h3,h4,p,figure,blockquote,dl{margin: 0px;}
h1,h2,h3,h4{font-weight: 550; line-height: 1.2; letter-spacing: -0.025em; text-wrap: balance;}
h2{font-size: clamp(30px, 2.4vw, 38px);}
h3{font-size: 24px;}
h4{font-size: 20px;}
p{max-width: var(--measure);}
.button{display: inline-flex; align-items: center; justify-content: center; gap: 16px; background: var(--button); color: var(--button-text); padding: 12px 25px; min-height: 48px; border-radius: 100px; font-size: 15px; line-height: 1.4; text-decoration: none; font-weight: 550; transition: transform 120ms var(--ease),background 180ms var(--ease);}
.button:active{transform: scale(0.97);}
.text-action{display: inline-flex; align-items: center; gap: 12px; font-size: 15px; min-height: 48px; text-decoration: none; color: var(--muted);}
.text-action svg{width: 20px;}
.button svg{width: 20px;}
.enterprise-footer .wordmark{font-size: 28px; line-height: 1; letter-spacing: -0.025em; font-weight: 500; text-decoration: none; white-space: nowrap;}
.hero{position: relative; min-height: 450px; isolation: isolate; overflow: hidden; border-bottom: 1px solid var(--line);}
.hero-image{position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; object-position: 50% 16%; z-index: -2;}
.hero::after{content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgb(9, 11, 12) 0%, rgba(9, 11, 12, 0.94) 20%, rgba(9, 11, 12, 0.48) 43%, transparent 62%); z-index: -1;}
:root[data-theme="light"] .hero::after{background: linear-gradient(90deg, rgb(246, 247, 244) 0%, rgba(246, 247, 244, 0.98) 28%, rgba(246, 247, 244, 0.78) 42%, transparent 65%);}
.hero-inner{min-height: 450px; display: flex; align-items: center;}
.hero-copy{padding: 48px 0px 56px; max-width: 620px;}
.hero h1{font-size: clamp(42px, 4vw, 61px); font-weight: 600; line-height: 1.08; letter-spacing: -0.03em; margin-bottom: 18px;}
.hero h1 span{display: block;}
.hero-lead{font-size: 22px; line-height: 1.55; max-width: 515px; color: var(--muted);}
.hero-actions{display: flex; align-items: center; flex-wrap: wrap; gap: 12px 25px; margin-top: 22px;}
.hero--de-agenturen h1,.hero--de-erp h1{font-size: clamp(39px, 3.7vw, 56px);}
.problem{padding-block: 40px 38px; border-bottom: 1px solid var(--line);}
.problem h2{margin-bottom: 22px;}
.scenario-choices{display: flex; gap: 20px; flex-wrap: wrap; margin-bottom: 26px;}
.scenario-choice{display: flex; align-items: center; gap: 19px; min-height: 52px; padding: 11px 25px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font-size: 15px; line-height: 1.4; transition: background 180ms var(--ease),color 180ms var(--ease); min-width: 222px; justify-content: flex-start;}
.scenario-choice[aria-pressed="true"]{background: var(--button); color: var(--button-text); border-color: transparent;}
.scenario-choice .icon{width: 25px; height: 25px;}
.example-label{display: block; font-size: 14px; color: var(--muted); margin-bottom: 10px;}
.flow{display: grid; grid-template-columns: minmax(220px, 325px) 94px minmax(240px, 360px); align-items: center; max-width: 780px; gap: 0px;}
.flow-node{display: flex; align-items: center; gap: 24px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 15px 25px; min-height: 76px;}
.flow-node > .icon{width: 29px; height: 29px;}
.flow-node strong{display: block; font-size: 15px; line-height: 1.4; font-weight: 550;}
.flow-node span{font-size: 13px; line-height: 1.4; color: var(--muted); display: block; margin-top: 4px;}
.flow-path{height: 36px; display: flex; align-items: center; justify-content: center; position: relative; color: var(--muted);}
.flow-path::before{content: ""; height: 1px; background: currentcolor; width: calc(100% - 26px); position: absolute;}
.flow-path .icon{width: 22px; background: var(--bg); position: absolute; right: 10px;}
.flow-token{width: 7px; height: 7px; border-radius: 50%; position: absolute; left: 10px; background: var(--accent); opacity: 0;}
.flow-node[data-state="checked"]{border-color: var(--accent);}
.flow-node[data-state="error"]{border-color: var(--danger);}
.flow-controls{margin-top: 24px; display: flex; align-items: center; gap: 10px 22px; flex-wrap: wrap;}
.flow-controls button{background: transparent; color: var(--text); display: inline-flex; align-items: center; gap: 9px; min-height: 40px; padding: 5px 0px; font-size: 14px;}
.flow-controls .flow-start{background: var(--surface); padding: 8px 16px; border: 1px solid var(--line); border-radius: 100px;}
.fault-option{display: inline-flex; align-items: center; gap: 9px; font-size: 13px; color: var(--muted); min-height: 40px; cursor: pointer;}
.fault-option input{width: 17px; height: 17px; accent-color: var(--accent);}
.flow-status{font-size: 14px; color: var(--muted); min-height: 24px; margin-top: 8px; max-width: 76ch;}
.flow-status[data-error="true"]{color: var(--danger);}
.flow-repair{text-decoration: underline; color: var(--accent) !important;}
.no-js-note{font-size: 14px; color: var(--muted); margin-top: 16px;}
.interactive-only{display: none;}
.js .interactive-only{display: flex;}
.js .flow-status{display: block;}
.toc-bar{padding-block: 18px; border-bottom: 1px solid var(--line);}
.toc-layout{display: flex; align-items: center; justify-content: space-between; gap: 24px;}
.chapter-menu{max-width: 540px; position: relative; z-index: 12;}
.chapter-menu > summary{display: flex; align-items: center; justify-content: space-between; gap: 38px; list-style: none; font-size: 14px; min-height: 40px;}
.chapter-menu > summary::-webkit-details-marker{display: none;}
.chapter-menu[open] .toc-links{display: grid;}
.toc-links{position: absolute; top: 46px; left: 0px; min-width: 360px; max-height: 60dvh; overflow: auto; background: var(--surface); padding: 14px 22px; border: 1px solid var(--line); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 40px;}
.toc-links a{font-size: 14px; line-height: 1.45; padding: 10px 0px; text-decoration: none; max-width: 440px;}
.toc-links a:hover{text-decoration: underline;}
.toc-aside{font-size: 13px; color: var(--muted);}
.chapter{padding-block: 76px; border-bottom: 1px solid var(--line); position: relative;}
.chapter-anchor{scroll-margin-top: 96px;}
.chapter h2{max-width: 26ch;}
.chapter-head{display: grid; grid-template-columns: minmax(0px, 0.95fr) minmax(0px, 1.05fr); gap: 72px; margin-bottom: 36px;}
.chapter-head h2{align-self: start;}
.chapter-body{max-width: 100%; min-width: 0px;}
.reading{max-width: var(--measure);}
.reading > * + *,.editorial-copy > * + *{margin-top: 24px;}
.reading h3,.editorial-copy h3{margin-top: 42px; margin-bottom: 12px;}
.reading h4{margin-top: 30px;}
.reading h3 + p,.reading h4 + p,.editorial-copy h3 + p{margin-top: 12px;}
.reading p,.editorial-copy p{color: var(--muted);}
.reading strong,.editorial-copy strong{color: var(--text); font-weight: 550;}
.reading a,.editorial-copy a{color: var(--text); text-decoration-color: var(--input);}
.reading a:hover,.editorial-copy a:hover{text-decoration-color: var(--accent);}
.chapter-layout{display: grid; grid-template-columns: minmax(0px, 0.95fr) minmax(0px, 1.05fr); gap: 72px;}
.chapter-title{align-self: start;}
.chapter-title h2{margin-bottom: 22px;}
.chapter-title p{color: var(--muted);}
.editorial{display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 60px; align-items: start;}
.editorial h2{margin-bottom: 24px;}
.editorial-copy{padding-block: 8px;}
.editorial-image{position: relative;}
.editorial-image img{width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px;}
.editorial-image figcaption{font-size: 13px; color: var(--muted); margin-top: 12px; line-height: 1.5;}
.lead-copy{margin-bottom: 30px;}
.lead-copy > * + *{margin-top: 16px;}
.lead-copy figure{margin-top: 25px;}
.reading figure{margin-top: 34px;}
.reading figure img{width: 100%; border-radius: 12px; max-height: 500px; object-fit: contain; background: var(--surface);}
.reading figcaption{font-size: 14px; line-height: 1.6; margin-top: 12px; color: var(--muted);}
.content-caption{font-size: 14px; line-height: 1.6; color: var(--muted); margin-top: 14px !important;}
.reading ul,.reading ol,.editorial-copy ul,.editorial-copy ol{padding-left: 24px; color: var(--muted);}
li + li{margin-top: 12px;}
.reading dl{display: grid; grid-template-columns: minmax(100px, 0.5fr) minmax(0px, 1fr); gap: 15px 24px; margin-block: 28px;}
.reading dt{font-weight: 550; line-height: 1.5;}
.reading dd{margin: 0px; color: var(--muted);}
.reading blockquote{font-size: 25px; line-height: 1.5; letter-spacing: -0.02em; color: var(--text); padding-block: 10px 20px; max-width: 40ch;}
.reading details{padding-block: 20px; border-top: 1px solid var(--line);}
.reading details:last-child{border-bottom: 1px solid var(--line);}
.reading details > summary{font-size: 19px; font-weight: 500; line-height: 1.5; min-height: 44px; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 24px;}
.reading details > summary::after{content: "+"; font-size: 25px; font-weight: 400; flex: 0 0 auto;}
.reading details[open] > summary::after{content: "−";}
.reading details > summary::-webkit-details-marker{display: none;}
.reading details > p{margin-top: 16px;}
.reading details > div{margin-top: 16px;}
.wide-reading{max-width: none;}
.wide-reading > p,.wide-reading > h3,.wide-reading > h4,.wide-reading > ul,.wide-reading > ol,.wide-reading > dl,.wide-reading > blockquote,.wide-reading > details{max-width: var(--measure);}
.table-wrap{max-width: 100%; overflow-x: auto; margin-block: 30px; background: var(--surface); border-radius: 12px; scrollbar-color: var(--input) var(--surface);}
table{border-collapse: collapse; width: 100%; min-width: 610px; font-size: 15px; line-height: 1.55; text-align: left;}
th,td{padding: 20px 24px; vertical-align: top; border-bottom: 1px solid var(--line);}
th{font-weight: 550; color: var(--text);}
td{color: var(--muted);}
thead{background: var(--surface);}
tbody tr:last-child > *{border-bottom: 0px;}
tbody tr[data-focus="true"]{background: color-mix(in srgb,var(--accent) 9%,var(--surface));}
tbody tr[data-focus="true"] > :first-child{color: var(--accent);}
.comparison-tools{display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 25px;}
.comparison-tools button,.scope-choice{background: transparent; border: 1px solid var(--line); padding: 9px 16px; min-height: 42px; border-radius: 100px; font-size: 13px; text-align: left;}
.comparison-tools button[aria-pressed="true"],.scope-choice[aria-pressed="true"]{background: var(--button); color: var(--button-text); border-color: transparent;}
.comparison-hint{color: var(--muted); font-size: 13px !important; margin-top: 10px !important;}
.material-break{display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); align-items: center; gap: 70px; margin-block: 46px 0px;}
.material-break img{width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px;}
.material-break p{font-size: 24px; line-height: 1.5; letter-spacing: -0.02em; color: var(--text);}
.scope-tool{margin-top: 34px; padding: 26px; background: var(--surface); border-radius: 12px;}
.scope-tool h3{margin: 0px 0px 18px; font-size: 22px;}
.scope-choices{display: flex; gap: 9px; flex-wrap: wrap;}
.scope-output{margin-top: 20px; font-size: 15px; color: var(--muted); min-height: 50px;}
.related{padding-block: 68px; border-bottom: 1px solid var(--line);}
.related h2{margin-bottom: 30px;}
.related-links{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 0px 64px;}
.related-links a{display: flex; align-items: center; justify-content: space-between; gap: 25px; padding-block: 23px; border-top: 1px solid var(--line); text-decoration: none; font-size: 21px; letter-spacing: -0.02em;}
.related-links a svg{transition: transform 200ms var(--ease); color: var(--muted);}
.closing{padding-block: 90px;}
.closing h2{max-width: 24ch; font-size: clamp(36px, 3.5vw, 54px); line-height: 1.12;}
.closing p{margin-top: 25px; color: var(--muted); max-width: 65ch;}
.closing .button{margin-top: 28px;}
.synq-contact{padding-block: 76px 90px; gap: 70px;}
.synq-contact .contact-intro{position: static;}
.contact-eyebrow{display: none;}
.synq-contact form{border: 0px;}
.synq-contact h2{font-weight: 550;}
.synq-contact .button{border-radius: 100px;}
.enterprise-footer{border-top: 1px solid var(--line); padding-top: 55px;}
.enterprise-footer .footer-bottom{display: flex; justify-content: space-between; border-top: 1px solid var(--line);}
.enterprise-footer .footer-bottom nav{display: flex;}
.cookie-settings{background: transparent; color: var(--muted); border: 0px; padding: 0px; cursor: pointer;}
.footer-brand .wordmark{font-size: 28px;}
.enterprise-footer .footer-brand p{font-size: 23px;}
.footer-contact{color: var(--text);}
.enterprise-footer .footer-contact svg{stroke: currentcolor; fill: none;}
.footer-bottom{font-size: 13px; color: var(--muted);}
.footer-bottom p{margin: 0px;}
.flow-node,.scope-output{will-change: auto;}
@media (hover: hover) and (pointer: fine){.button:hover{background: rgb(201, 247, 226);}
.scenario-choice:hover:not([aria-pressed="true"]),.comparison-tools button:hover:not([aria-pressed="true"]),.scope-choice:hover:not([aria-pressed="true"]){background: var(--input);}
.related-links a:hover svg{transform: translate(4px, -4px);}
.text-action:hover{color: var(--text);}}
@media (max-width: 1023px){.chapter-layout,.chapter-head{gap: 38px;}
.editorial{gap: 35px;}
.hero-copy{max-width: 560px;}
.hero-lead{max-width: 430px; font-size: 20px;}
.hero h1{font-size: 49px;}
.hero--de-agenturen h1,.hero--de-erp h1{font-size: 45px;}
.scenario-choices{gap: 12px;}
.scenario-choice{min-width: 0px; flex: 1 1 0%; padding: 12px 16px; gap: 12px;}
.chapter{padding-block: 58px;}
.synq-contact{gap: 35px;}
.footer-directory{grid-template-columns: repeat(3, minmax(0px, 1fr));}}
@media (max-width: 767px){:root{--gutter: 24px;}
.hero-inner{min-height: 0px; display: block;}
.hero{display: flex; flex-direction: column; min-height: 0px; overflow: visible;}
.hero-copy{padding-block: 42px 28px; max-width: 100%;}
.hero h1,.hero--de-agenturen h1,.hero--de-erp h1{font-size: clamp(36px, 7vw, 49px); line-height: 1.1; margin-bottom: 18px;}
.hero-lead{font-size: 19px; max-width: 40ch;}
.hero-actions{gap: 9px 20px; margin-top: 24px;}
.hero .hero-image{position: relative; order: 2; width: 100%; height: 260px; object-position: 50% 45%; z-index: 0;}
.hero::after{display: none;}
.hero .hero-inner{order: 1;}
.problem{padding-block: 32px;}
.problem h2{font-size: 29px;}
.scenario-choices{display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 22px;}
.scenario-choice{min-height: 50px; padding: 11px 16px; gap: 16px;}
.scenario-choice .icon{width: 23px; height: 23px;}
.flow{grid-template-columns: 1fr; gap: 0px;}
.flow-node{padding: 16px 20px; gap: 18px; min-height: 78px;}
.flow-path{height: 37px; width: 50px; margin-left: 29px; transform: rotate(90deg);}
.flow-path::before{width: 30px;}
.flow-path .icon{right: 0px;}
.flow-node strong{font-size: 16px;}
.flow-node span{font-size: 14px;}
.flow-controls{gap: 8px 20px; margin-top: 18px;}
.flow-status{min-height: 44px; font-size: 14px;}
.fault-option{width: 100%; font-size: 14px;}
.toc-layout{display: block;}
.toc-aside{display: none;}
.chapter-menu{max-width: none;}
.chapter-menu > summary{width: 100%;}
.toc-links{min-width: 0px; width: calc(100vw - var(--gutter)*2); max-width: 500px;}
.chapter{padding-block: 44px;}
.chapter-head,.chapter-layout{display: block;}
.chapter-head{margin-bottom: 25px;}
.chapter-title h2,.chapter-head h2{margin-bottom: 26px;}
.chapter-title p{margin-bottom: 26px;}
.editorial{display: flex; flex-direction: column; gap: 30px;}
.editorial-copy{padding: 0px;}
.editorial-image{width: 100%;}
.editorial-image img{aspect-ratio: 4 / 3;}
.reading,.editorial-copy{font-size: 17px;}
.reading h3,.editorial-copy h3{font-size: 23px; margin-top: 32px;}
.reading dl{grid-template-columns: 1fr; gap: 8px;}
.reading dd{margin-bottom: 15px;}
.reading blockquote{font-size: 23px;}
.reading details > summary{font-size: 18px;}
.table-wrap{margin-block: 23px;}
th,td{padding: 16px 20px;}
.material-break{grid-template-columns: 1fr; gap: 24px; margin-top: 32px;}
.material-break p{font-size: 22px;}
.scope-tool{padding: 22px;}
.scope-output{min-height: 80px;}
.related{padding-block: 44px;}
.related-links{grid-template-columns: 1fr;}
.related-links a{font-size: 20px; padding-block: 20px;}
.closing{padding-block: 58px;}
.closing h2{font-size: 36px;}
.synq-contact{padding-block: 48px 58px; display: block;}
.synq-contact .contact-intro{margin-bottom: 28px;}
.synq-contact form{padding: 24px;}
.synq-contact h2{font-size: 34px;}
.footer-intro{display: block; padding-bottom: 28px;}
.footer-contact{margin-top: 24px;}
.enterprise-footer .footer-contact strong{font-size: 22px;}
.footer-directory{grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 32px 24px;}
.enterprise-footer .footer-bottom{display: block;}
.enterprise-footer .footer-bottom nav{margin-top: 14px; gap: 5px 20px;}
.enterprise-footer{padding-top: 40px;}
.enterprise-footer .footer-group a{font-size: 14px;}}
@media (max-width: 359px){:root{--gutter: 20px;}
.hero h1,.hero--de-agenturen h1,.hero--de-erp h1{font-size: 35px;}
.hero-actions{display: grid; gap: 8px; justify-content: start;}
.hero .hero-image{height: 220px;}
.hero-copy{padding-top: 34px;}
.flow-node{padding: 14px; gap: 14px;}
.footer-directory{grid-template-columns: 1fr;}
.synq-contact form{padding: 20px;}}
.skip-link:not(:focus){width: 1px; height: 1px; padding: 0px; overflow: hidden; clip-path: inset(50%);}
.chapter-continuation{margin-top: 38px; margin-left: auto; max-width: calc(52.5% - 37.8px);}
.chapter-context{color: var(--muted); align-self: center;}
.scope-tool{display: block;}
.working-example{padding: 26px; margin-block: 30px; background: var(--surface); border-radius: 12px; min-width: 0px; border: 0px;}
.working-example legend{float: left; width: 100%; padding: 0px; font-size: 22px; line-height: 1.4; font-weight: 550; margin-bottom: 14px; letter-spacing: -0.02em;}
.working-example legend + p{clear: both;}
.working-example h3{font-size: 22px; margin: 0px 0px 16px !important;}
.working-example > p{font-size: 15px;}
.example-checks{display: grid; gap: 13px; margin-block: 22px;}
.example-checks label{display: flex; align-items: flex-start; gap: 12px; font-size: 15px; cursor: pointer;}
.example-checks input{width: 19px; height: 19px; margin: 3px 0px 0px; flex: 0 0 auto; accent-color: var(--accent);}
.working-example .example-result{font-size: 15px; line-height: 1.55; min-height: 26px; margin-top: 20px;}
.working-example .button{margin-top: 20px; font-size: 14px;}
.example-tabs{display: flex; gap: 9px; flex-wrap: wrap; margin-block: 20px;}
.example-tabs button,.example-action{background: transparent; color: var(--text); min-height: 44px; padding: 9px 15px; border: 1px solid var(--line); border-radius: 100px; font-size: 14px;}
.example-tabs button[aria-pressed="true"]{background: var(--button); color: var(--button-text); border-color: transparent;}
.working-example .example-action{margin-block: 16px 0px;}
.working-example label[for]{display: block; font-size: 15px; margin-block: 20px 8px;}
.working-example select{background: var(--bg); color: var(--text); border: 1px solid var(--input); border-radius: 8px; padding: 10px 14px; width: 100%; max-width: 350px; font-size: 16px; min-height: 46px;}
.working-example dl{font-size: 15px;}
.working-example details{margin-top: 22px;}
.reading summary > *{min-width: 0px;}
.reading summary > span{display: block;}
.reading ol:has(li > span){list-style: none; padding-left: 0px;}
.reading li > span:first-child{display: block; font-size: 14px; color: var(--accent); margin-bottom: 6px;}
.example-result[data-error="true"]{color: var(--danger);}
@media (max-width: 1023px) and (min-width: 768px){.chapter-continuation{max-width: calc(52.5% - 19.95px);}}
@media (max-width: 767px){.chapter-continuation{margin-top: 28px; max-width: none;}
.working-example{padding: 22px;}
.reading details > summary{display: block; position: relative; padding-right: 32px;}
.reading details > summary::after{position: absolute; right: 0px; top: 0px;}
.reading details > summary > * + *{margin-top: 10px;}
.working-example .button{width: 100%;}}
@media (max-width: 767px){table{min-width: 0px; font-size: 15px;}
table,tbody,tr{display: block;}
thead{position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%);}
tbody tr{padding: 18px 20px; border-bottom: 1px solid var(--line);}
tbody tr:last-child{border-bottom: 0px;}
tbody th,tbody td{display: block; padding: 8px 0px; border: 0px; width: 100%;}
tbody th:first-child,tbody td:first-child{font-weight: 550; color: var(--text); font-size: 17px;}
tbody td:not(:first-child)::before,tbody th:not(:first-child)::before{content: attr(data-label); display: block; font-size: 13px; color: var(--muted); font-weight: 550; margin-bottom: 5px;}
.table-wrap{overflow: visible;}}
.transfer-caption{display: grid; grid-template-columns: auto minmax(90px, 1fr) auto; gap: 20px; align-items: center; padding: 18px 0px; border-block: 1px solid var(--line); margin-top: 24px; font-size: 16px; max-width: 450px;}
.transfer-caption > span:first-child,.transfer-caption > span:last-child{font-weight: 550; color: var(--text);}
.transfer-verb{display: flex; align-items: center; justify-content: center; gap: 14px; font-size: 13px; color: var(--muted);}
.system-handoff{list-style: none; color: var(--muted); padding: 0px !important;}
.system-handoff > li{margin: 0px;}
.system-handoff .system-node{border: 1px solid var(--line); border-radius: 12px; padding: 22px 24px; background: var(--surface);}
.system-handoff .system-node > div > div{display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 20px;}
.system-handoff .system-node > div > div:first-child{margin-bottom: 14px;}
.system-handoff .system-node strong{font-size: 20px;}
.system-handoff .system-node p{margin-bottom: 15px;}
.system-handoff .system-node span{font-size: 14px;}
.system-handoff .system-edge{display: flex; align-items: center; gap: 15px; min-height: 64px; padding: 14px 24px; font-size: 14px; color: var(--muted);}
.system-edge .icon{transform: rotate(90deg); color: var(--accent);}
.system-edge > span{margin: 0px !important; color: var(--muted) !important;}
.retainer-bridge{font-size: 24px; color: var(--text) !important; margin-top: 14px !important;}
.retainer-split{display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding-block: 28px; margin-block: 28px; border-block: 1px solid var(--line);}
.retainer-split h4{font-size: 20px; margin: 0px 0px 20px !important;}
.retainer-split dl{display: block; margin: 0px;}
.retainer-split dl > div + div{margin-top: 18px;}
.retainer-split dt{font-size: 14px;}
.retainer-split dd{margin-top: 6px;}
.decision-questions{padding-left: 22px !important; list-style: disc !important;}
.decision-questions li + li{margin-top: 20px;}
.decision-questions p{margin: 0px;}
.scope-boundary{font-size: 15px;}
.reading details > summary:has(h3){display: grid; grid-template-columns: minmax(0px, 1fr) 22px; gap: 12px 24px; position: relative; padding-right: 0px;}
.reading details > summary:has(h3) > *{grid-column: 1; min-width: 0px; margin: 0px;}
.reading details > summary:has(h3) h3{font-size: 22px; max-width: none;}
.reading details > summary:has(h3) > span{font-size: 17px; font-weight: 400; color: var(--muted);}
.reading details > summary:has(h3)::after{position: static; grid-area: 1 / 2; align-self: start;}
.quote-process{list-style: none; padding: 0px !important;}
.quote-process > li{padding: 24px 0px; border-top: 1px solid var(--line);}
.quote-process h4{margin: 0px 0px 13px; font-size: 20px; line-height: 1.4;}
.quote-process .step-name{color: var(--muted); font-weight: 400;}
.quote-process p{margin: 0px;}
[data-quote-next]{border-top: 1px solid var(--line); padding-top: 22px; font-size: 15px;}
[data-quote-next] strong,[data-quote-next] > span{display: block;}
[data-quote-next] > span{margin-top: 10px;}
@media (min-width: 1024px){.hero--de-erp .hero-copy{max-width: 660px;}
.hero--de-erp h1{font-size: clamp(46px, 3.5vw, 54px); white-space: nowrap;}}
@media (max-width: 767px){.retainer-split{grid-template-columns: 1fr; gap: 28px;}
.transfer-caption{gap: 14px;}
.system-handoff .system-node{padding: 20px;}
.system-handoff .system-node > div > div{align-items: flex-start;}
.system-handoff .system-node > div > div:first-child{display: grid; gap: 6px;}
.system-handoff .system-edge{padding-inline: 20px;}
.reading details > summary:has(h3){gap: 10px 18px;}
.reading details > summary:has(h3) h3{font-size: 21px;}
.quote-process h4{font-size: 20px;}}
@media (prefers-reduced-motion: reduce){*,::before,::after{scroll-behavior: auto !important; transition: none !important; animation: auto ease 0s 1 normal none running none !important;}
.flow-token{display: none;}}