.visualisierung {background:var(--color-surface); border-bottom:1px solid var(--color-line)}
.vis-intro {display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16);align-items:start;margin-bottom:var(--space-12)}
.vis-title {font-family:var(--font-display);font-size:var(--text-2xl);font-weight:400;letter-spacing:-.025em;line-height:1.09}
.vis-title span {color:var(--color-primary)}
.vis-intro__copy p {margin-bottom:var(--space-4);max-width:58ch}
.vis-lead {font-size:var(--text-lg);font-weight:500;line-height:1.35}
.vis-textlink {display:inline-flex;align-items:center;gap:var(--space-3);color:var(--color-primary);text-underline-offset:6px;min-height:44px;font-weight:600}
.vis-showcase {border-block:1px solid var(--color-line);padding-top:var(--space-5)}
.vis-showcase__bar {display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5)}
.vis-smalltitle {font-weight:600;font-size:var(--text-sm)}
.vis-count {font-size:var(--text-xs);font-variant-numeric:tabular-nums;color:var(--color-text-muted)}
.vis-tabs {display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-6)}
.vis-tabs button {min-height:44px;padding:var(--space-2) var(--space-5);border:1px solid var(--color-line);border-radius:var(--radius-full);font-size:var(--text-sm);transition:background var(--transition-interactive),color var(--transition-interactive)}
.vis-tabs button[aria-selected="true"] {background:var(--color-primary);color:var(--color-bg);border-color:var(--color-primary)}
.vis-tabs button:hover:not([aria-selected="true"]) {background:var(--color-surface-2)}
.vis-tabs button:active {transform:translateY(1px)}
.vis-pair {display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.vis-photo {min-width:0}
.vis-photo figcaption {display:flex;gap:var(--space-3);align-items:baseline;padding-bottom:var(--space-3);font-size:var(--text-xs);color:var(--color-text-muted)}
.vis-photo figcaption span {font-size:var(--text-sm);color:var(--color-text);font-weight:600}
.vis-photo--after figcaption span {color:var(--color-primary)}
.vis-photo__image {width:100%;aspect-ratio:5/4;display:grid;place-items:center;background:var(--color-surface-2)}
.vis-photo__image img {width:100%;height:100%;max-height:100%;object-fit:contain}
.vis-caption {display:grid;grid-template-columns:1.4fr 1fr;gap:var(--space-10);padding-block:var(--space-6)}
.vis-caption h3 {font-size:var(--text-lg);line-height:1.3;margin-bottom:var(--space-2)}
.vis-caption p {font-size:var(--text-sm)}
.vis-note {font-size:var(--text-xs)!important;color:var(--color-text-muted);line-height:1.6}
.vis-service {display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--space-16);margin-block:var(--space-12)}
.vis-service h3,.vis-contact h3 {font-family:var(--font-display);font-size:var(--text-xl);font-weight:400;line-height:1.2;margin-bottom:var(--space-5)}
.vis-service__intro>p:last-child {color:var(--color-text-muted);max-width:45ch}
.vis-services>div {border-bottom:1px solid var(--color-line);padding-block:var(--space-5)}
.vis-services>div:first-child {padding-top:0}
.vis-services dt {font-weight:600;margin-bottom:var(--space-2)}
.vis-services dd {color:var(--color-text-muted);font-size:var(--text-sm)}
.vis-reel {border-block:1px solid var(--color-line)}
.vis-reel>summary {display:flex;align-items:center;justify-content:space-between;padding-block:var(--space-5);font-weight:600;cursor:pointer;list-style:none;gap:var(--space-6)}
.vis-reel>summary::-webkit-details-marker {display:none}
.vis-reel>summary>span {font-size:var(--text-lg);color:var(--color-primary)}
.vis-reel[open]>summary>span {transform:rotate(45deg)}
.vis-reel__body {display:grid;grid-template-columns:1fr;gap:var(--space-6);padding-block:var(--space-5) var(--space-8);align-items:start}
.vis-reel video {display:block;width:100%;max-width:1080px;height:auto;max-height:none;aspect-ratio:9/16;object-fit:contain;background:#152426;justify-self:center}
.vis-gallery-link {margin-top:var(--space-6)}
.vis-gallery-link .btn {white-space:normal}
.vis-gallery {padding-top:var(--space-12)}
.vis-gallery .vis-title {max-width:20ch}
.vis-gallery__intro {max-width:68ch;margin-block:var(--space-6)}
.vis-gallery-nav {display:flex;flex-wrap:wrap;gap:var(--space-3);margin-block:var(--space-8)}
.vis-gallery-nav a {padding:var(--space-3) var(--space-5);border:1px solid var(--color-line);border-radius:var(--radius-full);color:var(--color-primary)}
.vis-gallery .vis-reel {scroll-margin-top:100px;margin-bottom:var(--space-5)}
.vis-gallery .vis-reel>summary {font-size:var(--text-lg)}
.vis-reel__meta {display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center}
.vis-reel__meta a,.vis-reel__meta button {min-height:44px;display:inline-flex;align-items:center;color:var(--color-primary);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.vis-reel__meta button {padding:0;border:0;background:transparent;font:inherit}
.vis-reel__meta button[hidden] {display:none}
.vis-reel__body h3 {font-size:var(--text-lg);margin-bottom:var(--space-4)}
.vis-reel__body p {max-width:60ch;font-size:var(--text-sm);color:var(--color-text-muted)}
.vis-transcript {margin-top:var(--space-5)}
.vis-transcript summary {cursor:pointer;font-size:var(--text-sm);padding-block:var(--space-3);color:var(--color-primary)}
.vis-transcript p {padding-block:var(--space-3)}
.vis-contact {display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:var(--space-12);margin-top:var(--space-12);padding:var(--space-10);background:var(--color-surface-2)}
.vis-contact p:not(.eyebrow) {font-size:var(--text-sm);max-width:58ch}
.vis-contact__actions {display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3)}
.vis-contact__actions .btn {gap:var(--space-4);min-height:48px}
.vis-mail,.vis-phone {font-size:var(--text-sm);text-underline-offset:4px;min-height:32px;display:inline-flex;align-items:center}
.nav a.vis-nav-link {color:var(--color-primary);font-weight:600}
.header .brand {flex-shrink:0}
.header .brand__sub {white-space:nowrap}
@media(min-width:1201px) and (max-width:1550px) {
 .header .nav {gap:var(--space-3)}
 .header .nav a {font-size:var(--text-xs)}
}
.vis-skip {position:fixed;top:var(--space-2);left:var(--space-4);z-index:1000;transform:translateY(-180%);background:var(--color-bg);padding:var(--space-3);color:var(--color-text)}
.vis-skip:focus {transform:translateY(0)}
@media(min-width:721px) and (max-width:1200px) {
 .header .nav {display:none}
 .header .nav-toggle {display:grid}
 .header .nav.is-open {display:flex;flex-direction:column;align-items:flex-start;position:absolute;top:72px;left:0;right:0;background:var(--color-bg);padding:var(--space-6);gap:var(--space-4);max-height:calc(100dvh - 72px);overflow:auto}
 .header .nav__group {flex-direction:column;align-items:flex-start;gap:var(--space-3)}
 .header .nav__sub {position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:var(--space-2) var(--space-4)}
 .header .nav__caret {display:none}
}
@media(max-width:720px) {
 .nav.is-open {max-height:calc(100dvh - 72px);overflow:auto;overscroll-behavior:contain}
 .vis-intro,.vis-service,.vis-caption,.vis-contact {grid-template-columns:1fr;gap:var(--space-6)}
 .vis-intro {margin-bottom:var(--space-8)}
 .vis-title {font-size:var(--text-2xl)}
 .vis-tabs {gap:var(--space-2)}
 .vis-tabs button {padding-inline:var(--space-4)}
 .vis-pair {grid-template-columns:1fr;gap:var(--space-6)}
 .vis-photo__image {aspect-ratio:auto;min-height:0}
 .vis-photo__image img {height:auto;object-fit:contain}
 .vis-caption {padding-block:var(--space-6)}
 .vis-service {margin-block:var(--space-10)}
 .vis-contact {padding:var(--space-6)}
 .vis-reel__body {grid-template-columns:1fr}
 .vis-reel video {max-width:1080px;justify-self:center}
 .vis-mail,.vis-phone {min-height:44px}
}
@media(prefers-reduced-motion:reduce) {
 .visualisierung * {transition:none!important}
}

/* Beispiele: Bildpaare und Bildtafeln */
.vis-examples {margin-block:var(--space-10) var(--space-16)}
.vis-examples__head {max-width:64ch;margin-block:var(--space-12) var(--space-8)}
.vis-examples__head h2 {font-family:var(--font-display);font-size:var(--text-xl);font-weight:400;line-height:1.15;letter-spacing:-.02em;margin-block:var(--space-3) var(--space-4)}
.vis-examples__head p:not(.eyebrow) {color:var(--color-text-muted);max-width:58ch}
.vis-examples .vis-note {margin-top:var(--space-5)}
.vis-ex-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.vis-ex {margin:0}
.vis-ex figcaption,.vis-board figcaption {margin-top:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted)}
.vis-board figcaption span {display:block;color:var(--color-text);font-weight:600}
.vis-board-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8) var(--space-6)}
.vis-board-grid--portrait {grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px;margin-top:var(--space-8)}
.vis-board {margin:0}
.vis-board a {display:block;border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm);background:var(--color-surface-2);transition:transform var(--transition-base,.25s) ease,box-shadow .25s ease}
.vis-board a:hover {transform:translateY(-2px);box-shadow:var(--shadow-md)}
.vis-board img {display:block;width:100%;height:auto}
@media (max-width:960px) {.vis-ex-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px) {.vis-ex-grid,.vis-board-grid {grid-template-columns:1fr} .vis-board-grid--portrait {grid-template-columns:1fr 1fr}}