/* Basiskomponenten. Alle Werte aus der Lieferung v2.2. Stand 2.2.5 */

/* Buttons und Links */
.w-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--wcmb-control-min-height);padding:12px var(--wcmb-control-padding-x);border:1px solid transparent;border-radius:var(--wcmb-radius-control);font:600 16px/1.4 var(--wcmb-font-sans);text-align:center;text-decoration:none;background:var(--wcmb-action);color:var(--wcmb-on-action);cursor:pointer;transition:background-color var(--wcmb-motion-standard) var(--wcmb-motion-ease),color var(--wcmb-motion-standard) var(--wcmb-motion-ease),border-color var(--wcmb-motion-standard) var(--wcmb-motion-ease);max-width:100%;white-space:normal}
/* Textfarbe ist rollenfest: Hover und Aktiv aendern ausschliesslich Flaeche und Kontur.
   Primaer hell #FFFFFF, primaer dunkel #071724, sekundaer hell #08161F, sekundaer dunkel #FFFFFF. */
.w-button,.w-button:hover,.w-button:active,.w-button:focus,.w-button:visited,.w-button.is-hover,.w-button.is-active,.w-button.is-focus{color:var(--wcmb-on-action)}
.w-button:hover,.w-button.is-hover{background:var(--wcmb-action-hover);text-decoration:none}
.w-button:active,.w-button.is-active{background:var(--wcmb-action-active)}
.w-button.secondary,.w-button.secondary:hover,.w-button.secondary:active,.w-button.secondary:focus,.w-button.secondary:visited,.w-button.secondary.is-hover,.w-button.secondary.is-active,.w-button.secondary.is-focus{color:var(--wcmb-text)}
.w-button.secondary{background:transparent;border-color:var(--wcmb-control)}
.w-button.secondary:hover,.w-button.secondary.is-hover{background:var(--wcmb-subtle)}
.w-button.secondary:active,.w-button.secondary.is-active{background:var(--wcmb-subtle);border-color:var(--wcmb-action)}
.w-button.compact{min-height:var(--wcmb-control-compact-height)}
.w-button:disabled,.w-button[aria-disabled="true"],.w-button.secondary:disabled,.w-button.secondary[aria-disabled="true"]{background:var(--wcmb-disabled);color:var(--wcmb-on-disabled);border-color:transparent;cursor:not-allowed}
.w-button.is-focus{outline:var(--wcmb-control-focus-width) solid var(--wcmb-focus);outline-offset:var(--wcmb-control-focus-offset)}
.w-link{color:var(--wcmb-link);text-decoration:underline;text-underline-offset:4px}

/* Flaechen */
.w-card{border:1px solid var(--wcmb-line);background:var(--wcmb-surface);border-radius:var(--wcmb-radius-card);padding:20px;min-width:0;box-shadow:var(--wcmb-elevation-card)}
.w-card > * + *{margin-top:16px}
.w-tag{display:inline-flex;align-items:center;padding:4px 8px;background:var(--wcmb-selection);color:var(--wcmb-link);border-radius:var(--wcmb-radius-small);font-size:14px;font-weight:500}
.w-state{font:500 12px/1.5 var(--wcmb-font-sans);border-radius:2px;padding:2px 8px;color:var(--wcmb-link);background:var(--wcmb-selection)}
.w-state.improvement{color:var(--wcmb-success);background:var(--wcmb-success-bg)}
@media(min-width:768px){.w-card{padding:24px}}

/* Formular */
.w-field{display:grid;gap:8px;min-width:0}
.w-field > label{font-size:16px;font-weight:600}
.w-input{width:100%;min-height:var(--wcmb-control-min-height);padding:12px;border:1px solid var(--wcmb-control);border-radius:var(--wcmb-radius-control);background:var(--wcmb-surface);color:var(--wcmb-text);font:400 16px/1.4 var(--wcmb-font-sans)}
.w-input::placeholder{color:var(--wcmb-muted);opacity:1}
textarea.w-input{min-height:128px;resize:vertical}
.w-input:disabled{background:var(--wcmb-disabled);color:var(--wcmb-on-disabled);cursor:not-allowed}
.w-input[readonly]{background:var(--wcmb-subtle)}
.w-input[aria-invalid="true"]{border:2px solid var(--wcmb-field-error)}
.w-error{color:var(--wcmb-field-error);font-size:14px}
.w-help{font-size:14px;color:var(--wcmb-muted)}
.w-check{display:flex;align-items:center;gap:12px;min-height:var(--wcmb-control-compact-height);font-size:16px;cursor:pointer}
.w-check input{accent-color:var(--wcmb-action);width:20px;height:20px;flex-shrink:0;margin:0}
.w-segment{display:flex;flex-wrap:wrap;gap:8px}
.w-segment button{font:600 14px var(--wcmb-font-sans);min-height:var(--wcmb-control-compact-height);padding:8px 16px;border:1px solid var(--wcmb-control);border-radius:var(--wcmb-radius-control);color:var(--wcmb-text);background:var(--wcmb-surface);cursor:pointer}
.w-segment button:hover{background:var(--wcmb-subtle)}
.w-segment button[aria-pressed="true"]{background:var(--wcmb-action);color:var(--wcmb-on-action);border-color:var(--wcmb-action)}
.w-segment button[aria-pressed="true"]:hover{background:var(--wcmb-action-hover);color:var(--wcmb-on-action)}

/* Meldungen */
.w-notice{padding:16px;border-radius:var(--wcmb-radius-control);background:var(--wcmb-info-bg);color:var(--wcmb-info);font-size:14px}
.w-notice.success{background:var(--wcmb-success-bg);color:var(--wcmb-success)}
.w-notice.warning{background:var(--wcmb-warning-bg);color:var(--wcmb-warning)}
.w-notice.error{background:var(--wcmb-error-bg);color:var(--wcmb-error)}

/* Tabellen */
.w-table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.w-table-wrap.w-panel{border:1px solid var(--wcmb-line);border-radius:6px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:12px 8px;border-bottom:1px solid var(--wcmb-line);vertical-align:top}
th{font-weight:500;color:var(--wcmb-muted)}
td.num{font-family:var(--wcmb-font-mono);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
th.num{text-align:right}
caption{text-align:left;padding-bottom:12px;font-size:14px;color:var(--wcmb-muted)}
.w-comparison{min-width:580px}
.w-comparison thead{background:var(--wcmb-subtle)}
.w-comparison .selected{background:var(--wcmb-selection);color:var(--wcmb-link)}
.w-comparison .total > *{border-top:2px solid var(--wcmb-control);font-weight:500}
@media(min-width:768px){th,td{padding:14px 12px}}

/* Kennzahlen */
.w-kpi-group{display:grid;grid-template-columns:1fr;border:1px solid var(--wcmb-line);border-radius:var(--wcmb-radius-card);background:var(--wcmb-surface);margin:0}
.w-kpi-group > div{padding:24px;min-width:0;display:flex;flex-direction:column}
.w-kpi-group > div + div{border-top:1px solid var(--wcmb-line-soft)}
.w-kpi-group dt{order:2;font-family:var(--wcmb-font-sans);font-size:14px;color:var(--wcmb-muted);margin-top:12px}
.w-kpi-group dd{order:1;margin:0;color:var(--wcmb-kpi);overflow-wrap:normal}
.w-kpi-group > div > p{order:3}
.w-delta{display:inline-flex;align-items:center;gap:8px;padding:4px 8px;border-radius:var(--wcmb-radius-small);font:400 .71875rem/1.5 var(--wcmb-font-mono);font-variant-numeric:tabular-nums;color:var(--wcmb-delta-pos);background:var(--wcmb-delta-pos-bg)}
.w-delta.negative{color:var(--wcmb-delta-neg);background:var(--wcmb-delta-neg-bg)}
.w-delta-pair{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
@media(min-width:1024px){.w-kpi-group{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}.w-kpi-group > div + div{border-top:0;border-left:1px solid var(--wcmb-line-soft)}
.w-kpi-group:has(> div:nth-child(4)){grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr))}
.w-kpi-group:has(> div:nth-child(4)) > div:nth-child(odd){border-left:0}
.w-kpi-group:has(> div:nth-child(4)) > div:nth-child(n+3){border-top:1px solid var(--wcmb-line-soft)}}
@media(min-width:1200px){.w-kpi-group:has(> div:nth-child(4)){grid-auto-flow:column;grid-template-columns:none}
.w-kpi-group:has(> div:nth-child(4)) > div:nth-child(n+3){border-top:0}
.w-kpi-group:has(> div:nth-child(4)) > div + div{border-left:1px solid var(--wcmb-line-soft)}}

/* Prozessfragment */
.w-artifact-grid{display:grid;grid-template-columns:1fr;gap:24px}
.w-artifact-fragment{border:1px solid var(--wcmb-line);border-radius:var(--wcmb-radius-card);background:var(--wcmb-surface);min-width:0;overflow:hidden}
.w-artifact-fragment > header{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--wcmb-line-soft);font-size:14px}
.w-artifact-fragment > header strong{font-weight:500}
.w-artifact-fragment dl{margin:0;padding:8px 20px}
.w-artifact-fragment dl > div{display:grid;grid-template-columns:1fr;gap:4px;padding:10px 0}
.w-artifact-fragment dt{font-size:14px;color:var(--wcmb-muted)}
.w-artifact-fragment dd{font:400 14px/1.5 var(--wcmb-font-mono);font-variant-numeric:tabular-nums;margin:0;text-align:left;overflow-wrap:anywhere}
@media(min-width:768px){.w-artifact-fragment dl > div{grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:12px;align-items:baseline}.w-artifact-fragment dd{text-align:right}}
.w-artifact-fragment > footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 20px;border-top:1px solid var(--wcmb-line);font-size:14px;color:var(--wcmb-muted)}
@media(min-width:768px){.w-artifact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Kriterienliste und Checkliste */
.w-editorial-list{list-style:none;padding:0;margin:0}
.w-editorial-list li{border-top:1px solid var(--wcmb-line);padding:12px 0 12px 24px;position:relative}
.w-editorial-list li::before{content:"";position:absolute;left:0;top:24px;width:12px;height:1px;background:var(--wcmb-link)}

/* Aufzählung — Marker auf festen Pixelwerten.
   Zeilenhöhe fest: body 16/24 px, small 14/21 px. Eintrag ohne Innenabstand oben, Marker relativ zum <li>.
   Punkt/Quadrat 7 px: top = (Zeilenhöhe − 7) / 2 → body (24−7)/2 = 8,5 → 9 px (optisch auf x-Höhe), small (21−7)/2 = 7 px.
   Nummer: Box in Zeilenhöhe, top 0 → sitzt immer auf der ersten Zeile. */
.w-bullets{list-style:none;padding:0;margin:0;display:grid;gap:12px;counter-reset:w-bullet;font-size:16px;line-height:24px}
.w-bullets > li{position:relative;padding:0 0 0 20px;min-width:0;counter-increment:w-bullet}
.w-bullets > li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--wcmb-action);border-radius:50%}
.w-bullets.is-square > li::before{border-radius:0}
.w-bullets.is-number > li{padding-left:32px}
.w-bullets.is-number > li::before{content:counter(w-bullet,decimal-leading-zero);top:0;width:auto;height:24px;background:none;border-radius:0;font:400 13px/24px var(--wcmb-font-mono);font-variant-numeric:tabular-nums;color:var(--wcmb-muted)}
.w-bullets.is-small{font-size:14px;line-height:21px;gap:8px}
.w-bullets.is-small > li::before{top:7px}
.w-bullets.is-small.is-number > li::before{top:0;height:21px;line-height:21px}
[data-surface="dark"] .w-bullets > li::before{background:var(--wcmb-brand-ice)}
[data-surface="dark"] .w-bullets.is-number > li::before{background:none;color:var(--wcmb-muted)}
/* 2.2.2: zweispaltige Aufzählung, zeilenweiser Lauf, nicht für is-number */
@media(min-width:768px){.w-bullets--2{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--wcmb-space-6)}}

/* Häkchenliste — Marker auf festen Pixelwerten, gleiche Rechnung wie Aufzählung.
   Feld 22 px, Icon 12 px (Lucide check, 1,5 px absolute Strichstärke), Einzug 22 + 12 = 34 px.
   Feld: top = (Zeilenhöhe − 22) / 2 → body (24−22)/2 = 1 px, small (21−22)/2 = −0,5 → 0 px.
   Icon: top = Feld-top + (22−12)/2 = Feld-top + 5 px, left 5 px. */
.w-checks{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:16px;line-height:24px}
.w-checks > li{position:relative;padding:0 0 0 34px;min-width:0;min-height:24px}
.w-checks > li::before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:2px;background:var(--wcmb-selection)}
.w-checks > li::after{content:"";position:absolute;left:5px;top:6px;width:12px;height:12px;background:var(--wcmb-action);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px 12px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px 12px no-repeat}
.w-checks.is-small{font-size:14px;line-height:21px;gap:8px}
.w-checks.is-small > li{min-height:22px}
.w-checks.is-small > li::before{top:0}
.w-checks.is-small > li::after{top:5px}
[data-surface="dark"] .w-checks > li::before{background:var(--wcmb-subtle)}
[data-surface="dark"] .w-checks > li::after{background:var(--wcmb-brand-ice)}

/* Disclosure */
.w-accordion{border-top:1px solid var(--wcmb-line)}
.w-accordion details{border-bottom:1px solid var(--wcmb-line);padding:0}
.w-accordion summary{padding:20px 0;cursor:pointer;font-size:18px;font-weight:600;min-height:var(--wcmb-control-min-height);color:var(--wcmb-text)}
.w-accordion summary:hover{color:var(--wcmb-text);text-decoration:underline;text-underline-offset:4px}
.w-accordion details > div{padding:0 0 24px;max-width:var(--wcmb-layout-reading)}

/* Medien und Marke */
.w-photo{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--wcmb-radius-media)}
.w-photo.ratio-32{aspect-ratio:3/2}
.w-photo.ratio-11{aspect-ratio:1/1}
.w-photo.ratio-34{aspect-ratio:3/4}
.w-logo{width:128px;height:auto;display:block}
.w-icon{width:24px;height:24px;flex-shrink:0;color:var(--wcmb-link);stroke-width:1.5}
.w-icon.small{width:20px;height:20px}
.w-avatar{border-radius:var(--wcmb-radius-round);display:block}

/* Ueberlagerte Ebenen */
.w-header{position:sticky;top:0;z-index:var(--wcmb-layer-sticky);background:var(--wcmb-surface);border-bottom:1px solid var(--wcmb-line);box-shadow:var(--wcmb-elevation-header)}
.w-popover{z-index:var(--wcmb-layer-popover);box-shadow:var(--wcmb-elevation-overlay);background:var(--wcmb-surface);border-radius:var(--wcmb-radius-card)}
.w-dialog{padding:32px;border:1px solid var(--wcmb-line);border-radius:var(--wcmb-radius-card);box-shadow:var(--wcmb-elevation-overlay);background:var(--wcmb-surface);color:var(--wcmb-text);width:min(560px,calc(100% - 40px));max-height:calc(100% - 40px);overflow:auto}
.w-dialog::backdrop{background:rgba(7,23,36,.6)}
.w-dialog > * + *{margin-top:24px}

/* Sektionskopf: 8x8-Marker in der Aktionsfarbe, Kurzlabel, H2, optionaler Lead */
.w-section-head{display:grid;gap:16px}
.w-section-head > *{max-width:var(--wcmb-layout-reading)}
.w-section-head > :is(h1,h2,h3,h4){max-width:var(--wcmb-layout-heading)}
.w-section-head .w-kicker{display:flex;align-items:center;gap:12px;font:500 14px/1.4 var(--wcmb-font-sans);color:var(--wcmb-label);margin:0}
.w-section-head .w-kicker i{width:8px;height:8px;background:var(--wcmb-action);flex:0 0 auto;display:block}
.w-section-head h2{margin:0}
.w-section-head .w-lead{margin:0}

/* Trust-Leiste: vier Werte unter einer Oberlinie, kein Rahmen */
.w-trust{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;border-top:1px solid var(--wcmb-line);padding-top:20px;margin:0}
.w-trust > div{display:grid;gap:4px}
.w-trust dt{font-size:14px;color:var(--wcmb-muted);order:2}
.w-trust dd{margin:0;font:500 28px/1.15 var(--wcmb-font-mono);letter-spacing:-.02em;color:var(--wcmb-kpi);font-variant-numeric:tabular-nums;order:1}
.w-trust .w-trust-word{font:400 20px/1.3 var(--wcmb-font-sans);letter-spacing:-.01em;color:var(--wcmb-text)}
@media(min-width:768px){.w-trust{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}}

/* Logowand: gleich hohe Zellen, Trennlinien statt Rahmen, keine Filter */
.w-logowall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--wcmb-line);border:1px solid var(--wcmb-line);border-radius:var(--wcmb-radius-card);overflow:hidden;list-style:none;padding:0;margin:0}
.w-logowall li{background:var(--wcmb-surface);display:flex;align-items:center;justify-content:center;padding:24px;min-height:96px}
.w-logowall img{max-width:100%;max-height:32px;width:auto;height:auto;display:block}
.w-logowall .w-logowall-text{font:500 16px/1.3 var(--wcmb-font-sans);color:var(--wcmb-muted);text-align:center;overflow-wrap:break-word;hyphens:auto}
@media(min-width:768px){.w-logowall{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}

/* Fusszeile */
.w-footer{border-top:1px solid var(--wcmb-line);background:var(--wcmb-band)}
.w-footer[data-surface="dark"]{background:var(--wcmb-canvas);border-top-color:var(--wcmb-line)}
.w-footer .w-footer-grid{display:grid;grid-template-columns:1fr;gap:32px;padding-block:48px}
.w-footer h3{font:500 14px/1.4 var(--wcmb-font-sans);color:var(--wcmb-label);margin:0 0 12px}
.w-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.w-footer a{font-size:16px}
.w-footer .w-footer-bottom{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;border-top:1px solid var(--wcmb-line-soft);padding-block:20px;font-size:14px;color:var(--wcmb-muted)}
@media(min-width:768px){.w-footer .w-footer-grid{grid-template-columns:2fr 1fr 1fr}}

/* Zertifizierungs-Box */
.w-cert-box{display:flex;flex-direction:column;gap:16px;align-items:flex-start;border:1px solid var(--wcmb-line);border-radius:var(--wcmb-radius-card);background:var(--wcmb-surface);padding:24px}
.w-cert-box img{width:108px;height:auto;flex:0 0 auto}
@media(min-width:768px){.w-cert-box{flex-direction:row;gap:24px}}

/* A4-Reportseite */
.w-report-page{width:210mm;max-width:100%;min-height:297mm;box-sizing:border-box;padding:20mm;background:var(--wcmb-surface);color:var(--wcmb-text);display:flex;flex-direction:column}
.w-report-page .w-report-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--wcmb-line);padding-bottom:8mm}
.w-report-page .w-report-head img{width:32mm}
.w-report-page .w-report-foot{margin-top:auto;display:flex;justify-content:space-between;gap:8mm;border-top:1px solid var(--wcmb-line);padding-top:6mm;font-size:12px;color:var(--wcmb-muted)}
@media print{.w-report-page{padding:20mm;min-height:0;height:297mm}}

/* Social-Master */
.w-social{box-sizing:border-box;display:flex;flex-direction:column;padding:72px;max-width:100%}
/* Ausgabeformate haben keinen Breakpoint: sie brechen nicht um, sondern werden als Ganzes
   skaliert. .w-canvas-fit haelt sie in schmalen Vorschauen innerhalb der Seitenbreite. */
.w-canvas-fit{max-width:100%;overflow:hidden}
.w-canvas-fit > *{transform-origin:top left;transform:scale(var(--wcmb-canvas-scale,1))}
.w-social .w-social-kicker{font:500 28px/1.3 var(--wcmb-font-sans);color:var(--wcmb-label);margin:0}
.w-social .w-social-statement{font:400 84px/1.05 var(--wcmb-font-sans);letter-spacing:-.03em;margin:0}
.w-social .w-social-kpi{font:500 120px/1 var(--wcmb-font-mono);letter-spacing:-.02em;color:var(--wcmb-kpi);font-variant-numeric:tabular-nums;margin:0}
.w-social .w-social-note{font:400 26px/1.45 var(--wcmb-font-sans);color:var(--wcmb-muted);margin:0;max-width:26ch}
.w-social .w-social-foot{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding-top:48px}
.w-social .w-social-foot img.w-social-logo{width:180px}

/* Einzelkennzahl */
.w-kpi-single{border:1px solid var(--wcmb-line);border-radius:var(--wcmb-radius-card);background:var(--wcmb-surface);padding:24px;margin:0;max-width:60ch}
.w-kpi-single dt{font-size:16px;color:var(--wcmb-muted);order:2;margin-top:12px}
.w-kpi-single dd{margin:0;order:1}
.w-kpi-single .w-kpi-single-inner{display:flex;flex-direction:column}
.w-kpi-single .w-kpi-meta{font-size:14px;color:var(--wcmb-muted);order:3;margin-top:8px}
.w-kpi-single .w-kpi-skeleton{display:block;width:180px;height:48px;border-radius:var(--wcmb-radius-control);background:var(--wcmb-subtle)}
.w-kpi-single .w-kpi-empty{font:400 24px/1.3 var(--wcmb-font-sans);color:var(--wcmb-muted)}

/* Breadcrumbs */
.w-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0;padding:0;font-size:14px}
.w-breadcrumb li{display:flex;align-items:center;gap:8px;color:var(--wcmb-muted)}
.w-breadcrumb svg{width:16px;height:16px;color:var(--wcmb-label)}
.w-breadcrumb a{color:var(--wcmb-link)}
.w-breadcrumb a:hover{text-decoration-thickness:2px}
/* Navigationsziele: Hover zeigt die Unterstreichung, die Farbe bleibt Textfarbe */
.w-nav-link{color:var(--wcmb-text);text-decoration:none;font-weight:500}
.w-nav-link:hover{color:var(--wcmb-text);text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.w-nav-link[aria-current="page"]{text-decoration:underline;text-underline-offset:6px}
.w-breadcrumb [aria-current="page"]{color:var(--wcmb-text)}

/* Balkenvergleich — mobil gestapelt, nicht proportional verkleinert */
.w-bars{display:grid;gap:16px}
.w-bars .w-bar-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center}
.w-bars .w-bar-label{font-size:14px;color:var(--wcmb-muted);min-width:0;overflow-wrap:break-word}
.w-bars .w-bar-track{grid-column:1 / -1;height:20px;background:var(--wcmb-subtle);border-radius:2px}
.w-bars .w-bar-fill{height:100%;border-radius:2px;background:var(--wcmb-data-1);transition:width var(--wcmb-motion-explain) var(--wcmb-motion-ease)}
.w-bars .w-bar-fill.comparison{background:var(--wcmb-data-2)}
.w-bars .w-bar-fill.third{background:var(--wcmb-data-3)}
.w-bars .w-bar-value{font-family:var(--wcmb-font-mono);font-variant-numeric:tabular-nums;font-size:14px;text-align:right;white-space:nowrap}
.w-bars .w-bar-axis{display:flex;justify-content:space-between;font-family:var(--wcmb-font-mono);font-size:12px;color:var(--wcmb-muted)}
@media(min-width:768px){
  .w-bars{gap:12px}
  .w-bars .w-bar-row{grid-template-columns:minmax(96px,0.9fr) minmax(0,3fr) minmax(44px,auto);gap:12px}
  .w-bars .w-bar-label{grid-area:1 / 1}
  .w-bars .w-bar-track{grid-area:1 / 2}
  .w-bars .w-bar-value{grid-area:1 / 3}
  .w-bars .w-bar-axis{padding-left:calc(0.9 / 3.9 * (100% - 68px) + 12px);padding-right:56px}
}

/* Stationslinie — mobil untereinander, ab 768 px nebeneinander */
.w-processline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0}
.w-processline li{padding:20px 0 0;border-top:1px solid var(--wcmb-line);position:relative;min-width:0}
.w-processline li + li{margin-top:20px}
.w-processline .w-processline-mark{position:absolute;top:-1px;left:0;width:24px;height:1px;background:var(--wcmb-action)}
@media(min-width:768px){
  .w-processline{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
  .w-processline li{padding-right:20px}
  .w-processline li + li{margin-top:0}
  .w-processline--3{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--wcmb-space-10)}
}
@media(min-width:1024px){
  .w-processline--3{grid-template-columns:repeat(3,minmax(0,1fr))}
}