.cases .reference-tabs,.cases .reference-tab-fallback{display:flex;justify-content:center;gap:32px;max-width:var(--wrap);margin:0 auto 32px;border-bottom:1px solid var(--line);scroll-margin-top:100px}
.cases .reference-tabs[hidden]{display:none!important}
.cases .reference-tabs button,.cases .reference-tab-fallback a{appearance:none;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;box-shadow:none;color:var(--ink-soft);font:560 16px/1.3 Geist,Arial,sans-serif;padding:13px 1px 15px;min-height:48px;text-decoration:none;cursor:pointer}
.cases .reference-tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--cyan-ink)}
.cases .reference-tabs button:hover,.cases .reference-tab-fallback a:hover{color:var(--cyan-ink)}
.cases .reference-tabs button:focus-visible,.cases .reference-tab-fallback a:focus-visible,.cases .reference-study a:focus-visible{outline:3px solid var(--cyan-ink);outline-offset:4px}
.cases .reference-tab-fallback{margin-top:0}
.cases.references-enhanced .reference-tab-fallback{display:none}
.cases .reference-panel[hidden]{display:none!important}
.cases .reference-panel{scroll-margin-top:160px}
.cases .reference-studies{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:38px;max-width:var(--wrap);margin:0 auto;padding:0 var(--spur-rand,0px)}
.cases .reference-study{min-width:0}
.cases .reference-study__image{display:block;aspect-ratio:16/10;background:#161815;overflow:hidden;margin:0 0 20px}
.cases .reference-study__image picture,.cases .reference-study__image img{display:block;width:100%;height:100%}
.cases .reference-study__image img{object-fit:cover;object-position:top}
.cases .reference-study__image:focus-visible{outline-offset:-4px}
.cases .reference-study__category{font-size:10px;font-weight:650;letter-spacing:.1em;line-height:1.4;text-transform:uppercase;color:var(--cyan-ink);margin:0 0 7px}
.cases .reference-study h3{font-size:clamp(24px,2.05vw,30px);line-height:1.12;letter-spacing:-.035em;margin:0 0 11px}
.cases .reference-study__description{font-size:15px;line-height:1.5;color:var(--ink-soft);margin:0;max-width:44ch;min-height:3em}
.cases .reference-study__result{display:flex;align-items:baseline;gap:12px;margin:18px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.cases .reference-study__result strong{font-size:27px;letter-spacing:-.035em;font-weight:650;white-space:nowrap;color:var(--ink);line-height:1.2}
.cases .reference-study__result span{font-size:12px;line-height:1.45;color:var(--ink-soft)}
.cases .reference-study__result span small{display:block;font-size:11px;color:var(--ink-soft);margin-top:3px}
.cases .reference-study__link{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:650;color:var(--cyan-ink);text-decoration:none;gap:8px;margin-top:7px}
.cases .reference-study__link::after{content:'→'}
.cases .reference-study__link:hover{text-decoration:underline;text-underline-offset:5px}
.cases .reference-study__period{margin:0;font-size:10px;line-height:1.5;color:var(--ink-soft)}
.cases .reference-study-controls{display:none}
.cases .reference-study-status{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* The four preview links wrap to two rows on narrow phones. */
@media(max-width:360px){body.web:has(.preview-bar){padding-bottom:104px}}
/* GongZheng: use one gap after the list instead of three accumulated margins. */
@media(min-width:701px){
 .cases .projekt--gongzheng .case__points{margin-bottom:0}
 .cases .projekt--gongzheng .case__points li:last-child{margin-bottom:0}
 .cases .projekt--gongzheng .case__links{margin-top:16px}
}
.cases .reference-study--wide{grid-column:1/-1;display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:38px}
.cases .reference-study--wide .reference-study__image{aspect-ratio:1600/775;margin:0;background:transparent}
.cases .reference-study--wide .reference-study__image img{object-fit:contain}
.cases .reference-study--wide .reference-study__description{min-height:0}
@media(max-width:900px){.cases .reference-study--wide{grid-template-columns:1fr;gap:20px}.cases .reference-study--wide .reference-study__description{max-width:60ch}}
@media(max-width:1000px) and (min-width:701px){.cases .reference-studies{padding-inline:0;gap:26px}.cases .reference-study__description{min-height:4.5em}}
@media(max-width:700px){
 .cases .reference-tabs,.cases .reference-tab-fallback{gap:26px;margin-bottom:23px;scroll-margin-top:80px}
 .cases .reference-tabs button,.cases .reference-tab-fallback a{font-size:14px;padding-block:11px 13px}
 .cases .reference-panel{scroll-margin-top:140px}
 .cases .reference-studies{grid-template-columns:1fr;gap:34px;padding:0;max-width:460px}
 .cases .reference-study__image,.cases .reference-study--wide .reference-study__image{aspect-ratio:16/10;margin-bottom:16px}
 .cases .reference-study--reifen .reference-study__image img{object-position:center 44%}
 .cases .reference-study--plotter .reference-study__image img{object-fit:cover;object-position:center 71%}
 .cases .reference-study h3{font-size:26px;margin-bottom:9px}
 .cases .reference-study__description{font-size:14px;min-height:0}
 .cases .reference-study__result{padding-top:12px;margin-top:13px}
 .cases .reference-study__result strong{font-size:26px}
 .cases .reference-study__result span{font-size:12px}
 .cases .reference-study__link{margin-top:4px;font-size:13px}
 /* Same frame, inset and peek as the original Auftritte track. Without JS the cards stay stacked. */
 .cases .reference-studies.is-carousel{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:100%;grid-template-columns:none;gap:12px;max-width:none;padding:16px 26px 18px;border-block:1px solid var(--line);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-behavior:auto}
 .cases .reference-studies.is-carousel::-webkit-scrollbar{display:none}
 .cases .reference-studies.is-carousel .reference-study{display:block;grid-column:auto;padding:0 16px;scroll-snap-align:center;opacity:.5;transition:opacity .2s ease}
 .cases .reference-studies.is-carousel .reference-study.is-current{opacity:1}
 .cases .reference-studies.is-carousel .reference-study__image{margin-inline:-16px}
 .cases .reference-studies.is-carousel .reference-study--wide .reference-study__image{background:var(--white)}
 .cases .reference-study-controls:not([hidden]){display:flex;align-items:center;justify-content:center;gap:12px;margin-top:6px}
 .cases .reference-study-controls .reference-study-arrow{position:static;display:grid;transform:none;flex:0 0 44px}
 .cases .reference-study-controls .reference-study-arrow:hover{transform:scale(1.12)}
 .cases .reference-study-dots{display:flex;gap:0}
 .cases .reference-study-dots button{display:grid;place-items:center;width:44px;height:44px;padding:0;background:none;border:0;cursor:pointer}
 .cases .reference-study-dots button::before{content:'';width:7px;height:7px;border-radius:50%;background:#7b8a9a}
 .cases .reference-study-dots button[aria-current=true]::before{background:var(--cyan-ink);transform:scale(1.25)}
 .cases .reference-study-controls button:focus-visible,.cases .reference-studies.is-carousel:focus-visible{outline:3px solid var(--cyan-ink);outline-offset:2px}
 @media(max-height:780px){.cases .reference-studies.is-carousel{padding-top:8px;padding-bottom:10px}}
 @media(prefers-reduced-motion:reduce){.cases .reference-studies.is-carousel .reference-study,.cases .reference-study-controls .reference-study-arrow{transition:none}}
}