
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('/assets/fonts/open-sans-variable.b68160.woff2') format('woff2');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300 800;
  font-display: swap;
  src: url('/assets/fonts/open-sans-italic-variable.b3e5bd.woff2') format('woff2');
}

:root {
  --green:       #4b8246;   
  --green-light: #5c9a56;   
  --text:        #626262;   
  --muted:       #999999;
  --dot:         #8a8a8a;   
  --dot-aktiv:   #262626;   
  --border:      #c4c4c4;
  --line:        #e3e3e3;   
  --bg:          #fbfbfb;   
  --max-width:   1000px;
  --radius:      5px;     
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

html { scroll-behavior: smooth; }

:target,
h1[id], h2[id], h3[id] { scroll-margin-top: 124px; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Open Sans", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;   
  font-size: 15px;
  line-height: 1.6;   
}

.wrap {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 24px;
}

p, li, dd, dt, blockquote, figcaption, td, th {
  -webkit-hyphens: auto;
  hyphens: auto;
}

h1 {
  color: var(--green);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.3;
  margin: 1.2em 0 0.6em;
}

h2 {
  color: var(--green);
  font-size: 23px;
  font-weight: 400;
  line-height: 1.3;   
  margin: 2.2em 0 0.5em;
}

h3 {
  font-size: 18px; font-weight: 400; color: #4a4a4a;
  line-height: 1.3; margin: 1.5em 0 0.55em;
}
h1 a, h2 a, h3 a { color: inherit; }
h1 a:hover, h2 a:hover { color: var(--green-light); }
h3 a:hover { color: var(--green); }

.toc-titel, .kontakt-titel, .wand-titel, .spalten-titel, .kurs-voll,
.media-col h3, .media-col .media-heading, .media-col p.media-sub {
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
  color: var(--muted);
}

a { color: var(--green); text-decoration: none; }
a:hover { color: var(--green-light); text-decoration: underline; }

strong, b { font-weight: 700; }

p { margin: 0 0 1em; }

.muted, .report-muted, .contact-muted { color: var(--muted); }
.contact-muted a { color: var(--muted); }

.small { font-size: 13px; color: var(--muted); }
.small a { color: var(--muted); }
.small a:hover { color: var(--green); }

:root { --kopf: 104px; }

@media (max-width: 760px) {
  .dash-csv,
  .dash-bild,
  .dash-info { display: none; }
  
  .dash-kopf .dash-teilen { margin-left: auto; }
}

@media (max-width: 760px) { :root { --kopf: 64px; } }

.site-header {
  background: var(--bg);
  
  position: sticky;
  top: 0;
  z-index: 100;
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 104px;   
}

.logo img { display: block; height: 44px; width: auto; }

.main-nav .menu {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0;
}

.menu-item { position: relative; }

.menu-item > a,
.menu-item > span {
  display: block;
  padding: 10px 12px;
  color: var(--text);
  cursor: pointer;
  white-space: nowrap;
  font-size: 14px;      
  font-weight: 500;
}

.menu-item > a:hover, .menu-item > span:hover { color: var(--green); text-decoration: none; }
.menu-item.current > a, .menu-item.current > span { color: var(--green); }

.nav-toggle { display: none; }

.submenu {
  display: none;
  margin: 0;
  padding: 8px 0;
  list-style: none;
}

.submenu li a {
  display: block;
  padding: 6px 18px;
  color: var(--text);
  font-size: 14px;
}
.submenu li a:hover { color: var(--green); text-decoration: none; background: #f7f7f7; }

.submenu-group ul { list-style: none; margin: 0; padding: 0; }

.submenu-groups .submenu-heading {
  display: block;
  padding: 3px 8px;
  font-weight: 600;
  color: var(--green);
  font-size: 14px;
}
.submenu-groups .submenu-group ul li a { padding: 3px 8px 3px 24px; }

.submenu-tail { border-top: 1px solid var(--line); margin-top: 6px; }
.submenu-groups .submenu-tail a { font-weight: 600; padding: 8px 8px 3px; }

.lang-switch a { display: block; padding: 10px 12px; }

.lang-flag {
  display: block; width: 18px; height: auto; margin: 6px 0;
  border: 1px solid var(--line);
  filter: grayscale(1);
  transition: filter .2s ease;
}
.lang-switch a:hover .lang-flag,
.lang-switch a:focus-visible .lang-flag { filter: none; }

@media (min-width: 761px) {
  .submenu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 50;
    min-width: 260px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
  }

  
  .submenu:not(.submenu-groups) li a { white-space: nowrap; }

  .menu-item:hover > .submenu,
  .menu-item:focus-within > .submenu { display: block; }

  
  .header-inner { position: relative; }
  .menu-item.has-groups { position: static; }

  
  .menu-item.has-groups > a,
  .menu-item.has-groups > span { position: relative; }
  .menu-item.has-groups > a::after,
  .menu-item.has-groups > span::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 12px;
  }

  .submenu-groups {
    top: calc(50% + 22px);
    left: 50%;
    transform: translateX(-50%);
    width: min(920px, 92vw);
    padding: 18px 10px 12px;
  }

  .menu-item:hover > .submenu-groups,
  .menu-item:focus-within > .submenu-groups {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2px 8px;
  }

  .submenu-group { padding: 0 10px 10px; }
  .submenu-tail { grid-column: 1 / -1; }

  .lang-switch { border-left: 1px solid var(--line); margin-left: 8px; }
}

@media (min-width: 761px) and (max-width: 960px) {
  .menu-item:hover > .submenu-groups,
  .menu-item:focus-within > .submenu-groups { grid-template-columns: repeat(2, 1fr); }
}

.row {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 0 48px;
  align-items: start;
}

.row.gap-large { row-gap: 42px; }

.row > * { min-width: 0; }

.col-1  { grid-column: span 1; }
.col-2  { grid-column: span 2; }
.col-3  { grid-column: span 3; }
.col-4  { grid-column: span 4; }
.col-6  { grid-column: span 6; }
.col-8  { grid-column: span 8; }
.col-12 { grid-column: span 12; }

.report-thumb,
.media-col img.report-thumb {
  width: 100%;
  height: auto;
  border: 1pt solid var(--border);
  display: block;
}

.report-meta {
  font-size: 13px;
  line-height: 1.45;
  
  -webkit-hyphens: none; hyphens: none;
  margin: 6px 0 0;
}

.contact-box { text-align: center; }
.contact-box p { -webkit-hyphens: manual; hyphens: manual; }

.neon-portrait {
  width: 200px;
  max-width: 100%;
  
  background: #f2f2f2;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
  border-radius: 50%;
  border: 1px solid var(--border);
  display: inline-block;
}

.contact-name { margin: 0; font-weight: 600; line-height: 1.35; }
.contact-name .contact-muted { font-weight: 400; font-size: 13px; }

.contact-stack .contact-box + .contact-box { margin-top: 2.6em; }

.seiten-toc {
  font-size: 13px; line-height: 1.5;
  margin: 1.3em 0 0; padding-top: 1.3em;
  border-top: 1px solid var(--border);

}
.seiten-toc .toc-titel { margin: 0 0 .5em; }
.seiten-toc a { display: block; padding: .22em 0; }

.col-3 > .seiten-toc:first-child { margin-top: 0; border-top: 0; padding-top: 0; text-align: right; }

.seiten-toc-zeile { margin: 1.6em 0 0; padding-top: 0; border-top: 0; }
@media (min-width: 761px) {
  .seiten-toc-zeile { margin-bottom: 3em; }
}
.seiten-toc-zeile a { display: inline; padding: 0; }
.seiten-toc-zeile a + a::before { content: "\00B7"; display: inline-block; margin: 0 .6em; color: var(--muted); }
.team-person { scroll-margin-top: 124px; }

@media (min-width: 761px) {
  .row:has(> .col-3 > .seiten-toc:first-child):not(:has(.toc-vorname)) { display: block; }
  .row:has(> .col-3 > .seiten-toc:first-child):not(:has(.toc-vorname)) .seiten-toc {
    position: static; text-align: left; margin-top: .3em;
  }
  .row:has(> .col-3 > .seiten-toc:first-child):not(:has(.toc-vorname)) .seiten-toc a { display: inline; padding: 0; }
  .row:has(> .col-3 > .seiten-toc:first-child):not(:has(.toc-vorname)) .seiten-toc a + a::before {
    content: "\00B7"; display: inline-block; margin: 0 .6em; color: var(--muted);
  }
}
.col-3 > .seiten-toc:first-child a:first-child { padding-top: 0; }

@media (max-width: 760px) {
}

.project-meta { margin: 0 0 1.2em; display: flex; align-items: flex-start; gap: 34px; }
.project-meta p { margin: 0; }
.project-meta .meta-text { flex: 1 1 auto; min-width: 0; }

.project-meta .auftraggeber {
  flex: 0 0 auto; margin: 0; justify-content: flex-end;
  max-width: 190px; gap: 12px 16px;
}
.project-meta .auftraggeber img { max-width: 190px; }
.project-meta .auftraggeber.viele {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 14px 18px; max-width: 240px; align-items: center; justify-items: center;
}
.project-meta .auftraggeber.viele img { max-width: 108px; }

.media-col h3, .media-col .media-heading { font-weight: 400; margin: 0 0 6px; }

.media-col .video-embed {
  position: relative;
  padding-top: 56.25%;
  border: 1pt solid var(--border);
}

.media-col .video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.media-col p.media-sub { margin: 1.5em 0 0.3em; }

.media-col > a:not(.stacked) > .report-thumb { margin-top: calc(1.5em - 6px); }

.media-col a.stacked img { margin-top: 18px; }
.media-col ul { margin: 0 0 0 1.1em; padding: 0; }
.media-col ul li { margin-bottom: 0.2em; }

h2 a { color: inherit; }

.kundenlogos {
  width: 100%;
  height: auto;
  display: block;
  margin: 20px 0 0;
  filter: grayscale(100%);
  transition: filter .5s ease-in-out;
}
.kundenlogos:hover { filter: grayscale(0); }

.pub-list p { margin: 0 0 0.9em; break-inside: avoid; }

.two-col { columns: 2; column-gap: 48px; }

@media (max-width: 760px) {
  .two-col { columns: 1; }
}

.ref-block { margin-bottom: 1.7em; }

.ref-block strong a { color: inherit; }
.ref-block strong a:hover { color: var(--green); }
.ref-block p { margin: 0; }

.bi-line {
  font-size: 20px;
  font-weight: 300;
  line-height: 1.45;
  color: #4a4a4a;
  margin: -0.2em 0 1em;
}

.top-row h3 { margin-top: 0; }

.prosa { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6em 34px; }
.prosa h3 { margin: 0 0 .55em; }

.prosa p { margin: 0; line-height: 1.55; hyphens: auto; }

.rail { border-left: 1px solid var(--line); padding-left: 26px; }

.rail-group + .rail-group { border-top: 1px solid var(--line); padding-top: 2.1em; margin-top: 2.1em; }
.rail-group h2 { margin: 0 0 .6em; }

.rail .t { color: var(--text); }
.rail .t:hover { color: var(--green); }
.rail ul { list-style: none; margin: 0; padding: 0; }
.rail li { padding: 9px 0; }
.rail li:first-child { padding-top: 0; }
.rail .d { font-size: 11px; color: var(--muted); display: block; }
.rail .t { display: block; line-height: 1.35; }
.rail .s { font-size: 11px; color: var(--muted); display: block; }
.rail .more { font-size: 13px; margin: .7em 0 0; }

.rail .more .arrow-link { color: var(--text); }
.rail .more .arrow-link:hover { color: var(--green); }

.abschnitt-intro { margin: 0 0 1.1em; }

.topic-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: .5em 0 0; }
.topic-tile {
  display: flex; flex-direction: column; justify-content: center; gap: 3px;
  border: 1px solid var(--green); background: #fff; border-radius: var(--radius);
  padding: 9px 12px; color: var(--text); font-size: 15px; line-height: 1.25;
  transition: background .2s ease;
}
.topic-tile:hover { background: #f4f8f3; text-decoration: none; color: var(--green); }
.topic-tile .stich { font-size: 11px; color: var(--muted); line-height: 1.35; }

.kunden-slider { margin: 0 0 10px; }
.kunden-slider .slide { display: flex; }

.kunden-slider .slider-track { gap: 24px; }
.kunden-kachel {
  position: relative; flex: 1;
  display: flex; flex-direction: column;
  border: 1px solid var(--green); background: #fff; border-radius: var(--radius);
  padding: 16px 26px 18px;
}
.kunden-kachel h3 { margin: 0 0 .7em; }
.kachel-body { flex: 1; display: grid; grid-template-columns: 2fr 1fr; align-items: stretch; }
.kachel-text { border-left: 1px solid var(--line); padding: 0 34px 0 26px; }
.kachel-text p { margin: 0; }

.logo-cloud {
  display: flex; flex-wrap: wrap; align-items: center; align-content: space-evenly;
  justify-content: center; gap: 16px 26px; padding: 6px 20px 6px 0;
  min-height: 140px; max-width: 560px; margin: 0 auto;
}
.logo-cloud img {
  width: auto; object-fit: contain; display: block;
  filter: grayscale(1); opacity: .62;
  transition: filter .2s ease, opacity .2s ease;
}

.logo-cloud:hover img { filter: none; opacity: 1; }
.logo-cloud img.xl     { height: 62px; max-width: 200px; }
.logo-cloud img.gross  { height: 45px; max-width: 152px; }
.logo-cloud img.mittel { height: 32px; max-width: 112px; }
.logo-cloud img.klein  { height: 24px; max-width: 86px; }
.logo-cloud img:nth-child(2n) { transform: translateY(-6px); }
.logo-cloud img:nth-child(3n) { transform: translateY(7px); }
.logo-cloud img:nth-child(5n) { transform: translateY(-9px); }
.logo-cloud img:nth-child(7n) { transform: translateY(4px); }

.slider-arrow-in {
  position: absolute; top: 0; bottom: 0; width: 56px;
  display: flex; align-items: center; justify-content: center;
  color: var(--green); opacity: .28;
}
.slider-arrow-in.next { right: 0; }
.slider-arrow-in.prev { left: 0; }
.slider-arrow-in svg {
  width: 34px; height: 60%; max-height: 190px;
  fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.slider-arrow-in:hover:not(:disabled) { opacity: .6; color: var(--green); }
.slider-arrow-in:disabled { opacity: .07; cursor: default; }

.kontakt-row { margin-top: 1.4em; }
.kontakt-text p { margin: 0; }

.logo-wall {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 30px 44px;
  max-width: 820px;
  margin: 2.6em auto 3.2em;
}
.logo-wall img {
  width: auto;
  object-fit: contain;
  display: block;
  filter: grayscale(1);
  opacity: .62;
  transition: filter .2s ease, opacity .2s ease;
}

.logo-wall:hover img { filter: none; opacity: 1; }

.logo-wall.schmal {
  justify-content: center;
  gap: 24px 34px;
  max-width: none;
  margin: 2em 0 0;
  padding-right: 26px;
}
.wand-titel { margin: 1.9em 0 0; scroll-margin-top: 120px; }

.logo-wall img:nth-child(2n) { transform: translateY(-8px); }
.logo-wall img:nth-child(3n) { transform: translateY(9px); }
.logo-wall img:nth-child(5n) { transform: translateY(-11px); }
.logo-wall img:nth-child(7n) { transform: translateY(5px); }

.auftraggeber { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin: 0 0 1.3em; }
.auftraggeber img { max-width: 118px; width: auto; object-fit: contain; display: block; }

@media (max-width: 760px) {
  .logo-wall { gap: 22px 28px; margin: 1.6em 0 2.2em; justify-content: flex-start; }
  
  .media-row { margin-top: 3em; }

  
  .logo-wall.schmal { margin-bottom: 5em; }
  
  .logo-wall.schmal { gap: 18px 26px; padding-right: 0; }
  .logo-wall img { transform: none !important; filter: none; opacity: 1; }
  .auftraggeber img { max-width: 96px; }
}

h2.jahr {
  margin-top: 2em;
  padding-top: 1.8em;
  border-top: 1px solid var(--line);
}

h2.jahr:first-of-type { margin-top: 2.2em; border-top: 0; padding-top: 0; }

.pub-list a strong { color: var(--text); }
.pub-list a:hover strong { color: var(--green); }

h2.section {
  padding-top: 1.9em;
  margin-top: 2em;
  position: relative;
}
h2.section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 26px;
  right: 26px;
  border-top: 1px solid var(--line);
}

.arrow-link { color: var(--green); text-decoration: none; font-size: 16px; line-height: 1; }
.arrow-link:hover { color: var(--green-light); text-decoration: underline; }

.cta-button {
  display: block;
  background: var(--green);
  color: #fff;
  border: 1px solid #3a3a3a;
  text-decoration: none;
  text-align: center;
  padding: 13px 20px;
  border-radius: var(--radius);
  line-height: 1.3;
  margin-bottom: 10px;   
}
.cta-button:hover { background: var(--green-light); color: #fff; text-decoration: none; }

.center { text-align: center; }
.participants-heading { margin-top: 55px; }

.home-symbol { text-align: center; margin: 80px 0; }
.home-symbol img { width: 33%; min-width: 220px; height: auto; }

.team-person { margin-bottom: 3.6em; scroll-margin-top: 120px; }
.team-person h2 { margin: 0 0 1px; }

.team-portrait {
  background: #f2f2f2;
  width: 150px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
  border-radius: 50%;
  border: 1px solid var(--border);
  display: block;
  margin: 0 0 14px;
}

.team-meta { color: var(--muted); margin: 0 0 12px; }
.team-meta a { color: var(--muted); }
.team-meta a:hover { color: var(--green); }

.team-lists { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }

.team-lists-heading { margin: 0 0 3px; font-weight: 600; }

.team-refs { margin: 0 0 0 1.1em; padding: 0; font-size: 13px; color: var(--muted); }
.team-refs li { margin-bottom: 0.2em; }
.team-refs a { color: var(--muted); }
.team-refs a:hover { color: var(--green); }

.site-footer {
  margin-top: 70px;
  border-top: 1px solid var(--line);
  padding: 28px 0 40px;
  text-align: center;
  font-size: 14px;
}

.footer-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 28px;
}

.footer-menu a { color: var(--text); }
.footer-menu a:hover { color: var(--green); }

@media (min-width: 761px) and (max-width: 959px) {
  body { font-size: 13px; line-height: 20px; }
  .menu-item > a, .menu-item > span { font-size: 13px; }
}

@media (max-width: 760px) {
  body { font-size: 13px; line-height: 19px; }
  .menu-item > a, .menu-item > span { font-size: 13px; }

  .header-inner {
    flex-wrap: wrap;
    min-height: 64px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .nav-toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 10px;
    background: none;
    border: 0;
    cursor: pointer;
  }

  .nav-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--text);
    transition: transform .2s ease, opacity .2s ease;
  }

  body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
  body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  
  .main-nav { display: none; width: 100%; }
  body.nav-open .main-nav { display: block; }

  .main-nav .menu { flex-direction: column; gap: 0; padding-bottom: 10px; }

  .menu-item { border-top: 1px solid var(--line); }
  .menu-item > a, .menu-item > span { padding: 12px 4px; white-space: normal; }

  
  .menu-item.has-sub > a::after,
  .menu-item.has-sub > span::after {
    content: "▾";
    float: right;
    color: var(--muted);
    transition: transform .2s ease;
  }
  .menu-item.open > a::after,
  .menu-item.open > span::after { transform: rotate(180deg); }

  
  .submenu {
    padding: 0 0 10px 12px;
    border-left: 2px solid var(--line);
  }
  .menu-item.open > .submenu { display: block; }

  .submenu li a { padding: 9px 4px; }
  .submenu-group { padding: 0; }
  .submenu-groups .submenu-heading { padding: 9px 4px; }
  .submenu-groups .submenu-group ul li a { padding: 8px 4px 8px 18px; }
  .submenu-groups .submenu-tail a { padding: 9px 4px 2px; }

  
  .submenu-groups .submenu-group > ul { display: none; }
  .submenu-groups .submenu-group.open > ul { display: block; }
  .submenu-groups .submenu-heading::after {
    content: "▾";
    float: right;
    color: var(--muted);
    transition: transform .2s ease;
  }
  .submenu-groups .submenu-group.open > .submenu-heading::after { transform: rotate(180deg); }

  .lang-switch { border: 0; margin: 0; }

  
  .row { grid-template-columns: 1fr; gap: 0; }
  .col-1, .col-2, .col-3, .col-4, .col-6, .col-8, .col-12 { grid-column: span 1; }

  
  .contact-box { width: 200px; max-width: 100%; text-align: center; }

  
  .col-3:has(> .seiten-toc), .col-3:has(> .kurs-kontakt) { display: flex; align-items: center; gap: 20px; }
  
  .col-3 > .contact-box + .seiten-toc { text-align: right; }
  .col-3 > .kurs-kontakt { flex: 1 1 auto; min-width: 0; margin-top: 0; border-top: 0; padding-top: 0; }
  .col-3 > .contact-box + .seiten-toc,
  .col-3 > .seiten-toc { flex: 1 1 auto; min-width: 0; margin-top: 0; border-top: 0; padding-top: 0; }
  
  .col-3:has(> .seiten-toc) .contact-box, .col-3:has(> .kurs-kontakt) .contact-box { flex: 0 1 200px; min-width: 0; }

  
  .contact-stack { display: flex; align-items: flex-start; gap: 20px; }
  .contact-stack .contact-box { flex: 0 1 200px; min-width: 0; }
  .contact-stack .contact-box + .contact-box { margin-top: 0; }

  
  .team-person h2 { line-height: 1.25; margin-bottom: 5px; }
  .team-meta { margin-bottom: 16px; }

  
  .team-lists { gap: 0 14px; }
}

.report-slider { margin: 0 0 10px; }

.slider-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;          
  -ms-overflow-style: none;
}
.slider-track::-webkit-scrollbar { display: none; }
.slider-track:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }

@media (hover: hover) and (pointer: fine) {
  .slider-track, .dv-track { cursor: grab; }
}

.slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; }

@media (min-width: 761px) {
  .report-slider .slide-text { margin-left: -33px; }
}

.slide-title { margin: 0 0 2px; }
.slide-title a { color: inherit; }
.slide-title a:hover { color: var(--green); }
.slide-meta  { color: var(--muted); margin: 0 0 0.9em; }
.slide-blurb { margin: 0 0 1em; }

.col-8 .report-slider .row { gap: 0 24px; }
.col-8 .ref-slide .ref-block p { hyphens: auto; }

.ref-slide .slide-title { margin: 0 0 0.9em; }

.ref-slide .ref-block { margin-bottom: 0; }

.slide-card-meta { display: none; }

.slider-frame { display: flex; align-items: stretch; gap: 6px; }
.slider-frame .slider-track { flex: 1; min-width: 0; }

.slider-arrow {
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  color: var(--border);
  transition: color .2s ease, opacity .2s ease;
}
.slider-arrow:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }

.slider-arrow-side {
  flex: 0 0 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--green);
  opacity: .28;
}
.slider-arrow-side svg {
  width: 26px;
  height: 60%;
  max-height: 220px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.slider-arrow-side:hover:not(:disabled) { opacity: .6; }
.slider-arrow-side:disabled { opacity: .07; cursor: default; }

.slider-dots {
  display: flex;
  gap: 4px;
  margin: 10px 0 0 -8px;   
  padding: 0;
  list-style: none;
}

.slider-dots button {
  display: block;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.slider-dots button::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  margin: 8px auto;
  border-radius: 50%;
  background: var(--border);
  transition: background .2s ease;
}
.slider-dots button[aria-selected="true"]::before { background: var(--dot-aktiv); }
.slider-dots button:hover::before { background: var(--dot); }
.slider-dots button[aria-selected="true"]:hover::before { background: var(--dot-aktiv); }

.slider-tabs { gap: 4px 22px; margin-left: 0; flex-wrap: wrap; }
.slider-tabs button {
  width: auto; height: auto; padding: 4px 0;
  font-size: 13px; color: var(--muted);
  border-bottom: 2px solid transparent;
}
.slider-tabs button::before { content: none; }
.slider-tabs button:hover { color: var(--dot-aktiv); }
.slider-tabs button[aria-selected="true"] {
  color: var(--green); border-bottom-color: var(--green);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  .slider-track { scroll-behavior: auto; }
}

@media (max-width: 760px) {
  
  .slide-text { display: none; }
  .slide-card-meta { display: block; margin-top: 0; flex: 1 1 auto; min-width: 0; }

  
  .slide .col-3 { display: flex; align-items: flex-start; gap: 14px; }
  .slide .col-3 > a { flex: 0 0 180px; max-width: 48%; }

  
  .slider-arrow-side,
  .slider-arrow-in { display: none; }

  
  .prosa { grid-template-columns: 1fr; row-gap: 1.6em; }
  .prosa h3 { margin-top: 0; }
  
  .rail {
    border-left: 0; padding-left: 0; margin-top: 0.8em;
    
    border-top: 1px solid var(--line); padding-top: 2em;
    display: grid; grid-template-columns: 1fr 1fr; gap: 0 26px;
  }
  .rail-group + .rail-group { margin-top: 0; border-top: 0; padding-top: 0; }
  .topic-tiles { grid-template-columns: repeat(2, 1fr); }
  .kunden-kachel { padding: 16px 18px 18px; }
  .kachel-body { grid-template-columns: 1fr; }
  .kachel-text { border-left: 0; padding: 0; margin-top: 1.1em; }
  .logo-cloud {
    gap: 16px 22px; padding: 0; min-height: 0; max-width: none;
    justify-content: flex-start;
  }
  .logo-cloud img { transform: none !important; filter: none; opacity: 1; }
  .logo-cloud img.xl { height: 48px; }
  .logo-cloud img.gross { height: 38px; }
  .logo-cloud img.mittel { height: 29px; }
  .logo-cloud img.klein { height: 23px; }
  .kontakt-text { margin-bottom: 1.6em; }
  
  .kontakt-row { grid-template-columns: 1fr 1fr; gap: 0 20px; }
  .kontakt-row .kontakt-text { grid-column: span 2; }
  h2.section::before { left: 0; right: 0; }
}

.intro { margin-bottom: 1.4em; }

.facts-list { display: grid; grid-template-columns: max-content 1fr; column-gap: 28px;
  row-gap: 4px; margin: 0 0 1.4em; }
.facts-list dt { color: var(--muted); }
.facts-list dd { margin: 0; }

.teilnehmer-logos {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 16px 22px;
}

.kurs-kontakt {
  margin-top: 1.3em; padding-top: 1.3em;
  border-top: 1px solid var(--border);
  font-size: 13px; line-height: 1.55;
}
.kurs-kontakt p { margin: 0; }
.kurs-kontakt .kontakt-titel { margin: 0 0 .5em; }

.testimonial-reihe { margin-top: 1.6em; }

.testimonial-reihe .testimonial:nth-child(n+4) { display: none; }
.testimonial p { margin: 0; font-size: 15px; line-height: 1.55; color: #4a4a4a; }
.testimonial > p:first-child {
  display: inline;
  background: #e4efe2;
  padding: 2px 5px;
  border-radius: 3px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  line-height: 1.75;
}
.testimonial p.testimonial-autor {
  
  margin-top: 9px; font-size: 12px; line-height: 1.5; color: var(--text);
  
  -webkit-hyphens: none; hyphens: none;
}
.testimonial .ta-org { color: var(--muted); }

.studien-wand { row-gap: 28px; }

.studien-thumb { position: relative; }
.studien-thumb img { transition: filter .2s ease, opacity .2s ease; }
.studien-thumb .thumb-links {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 16px; font-size: 21px; white-space: nowrap;
  opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
@media (hover: hover) {
  .studien-thumb:hover img { filter: grayscale(1); opacity: .15; }
  .studien-thumb:hover .thumb-links { opacity: 1; pointer-events: auto; }
}

@media (max-width: 760px) {
  .studien-wand { grid-template-columns: 1fr 1fr; gap: 24px 14px; }
  .studien-wand .studien-karte { grid-column: span 1; }
}

.teilnehmer-slider { margin-top: 1.1em; display: none; }
.col-8 .teilnehmer-intro { margin: 0.4em 0 0; }

.intro-row { column-gap: 28px; }
.intro-row .kurs-kopf { grid-column: 1 / span 8; grid-row: 1; }
.intro-row .kurs-teiln { grid-column: 1 / span 8; grid-row: 2; }
.intro-row .kurs-rand { grid-column: 10 / span 3; grid-row: 1 / span 2; }

.kurs-toc-v a { line-height: 1.4; padding: .3em 0; }

.kurs-toc-v .toc-termin { display: inline-block; width: 100%; font-size: 11px; color: var(--muted); }

.kurs-block { padding-top: 2.4em; border-top: 1px solid var(--line); margin-top: 2.4em; }
.kurs-block > h2 { margin: 0 0 0.5em; }
.kurs-block .course-meta { margin: 0 0 2px; }
.kurs-blurb-voll { margin: 0 0 1.6em; }
.kurs-raster { display: grid; grid-template-columns: 1fr 1fr 265px; gap: 0 44px; align-items: start; }
.spalten-titel { margin: 0 0 .7em; }
.kurs-themen { margin: 0 0 0 1.1em; padding: 0; }
.kurs-themen li { margin-bottom: 0.42em; }

.bess-viewer {
  width: 100%; height: 980px;
  border: 1px solid var(--border); border-radius: var(--radius);
  margin: 4px 0 1.6em;
}
.bess-viewer.bess-preview { height: 760px; }
@media (max-width: 760px) {
  
  .bess-viewer { display: none; }
}

.kurs-voll {
  display: inline-block; margin-left: 8px; padding: 0 8px;
  border: 1px solid var(--border); border-radius: var(--radius);
}

.kurs-fotowand {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 12px; margin: 40px 0 8px;
}
.kurs-fotowand img {
  width: 100%; height: 170px; object-fit: cover;
  border-radius: var(--radius); display: block;
}

.kurs-wolke { padding-top: 6px; }
.wolke-zeile { display: flex; justify-content: center; align-items: center; gap: 20px 26px; margin-bottom: 20px; }

.kurs-wolke img { filter: grayscale(1); opacity: .72; transition: filter .2s ease, opacity .2s ease; }
.kurs-wolke:hover img { filter: none; opacity: 1; }

.doc-viewer { margin: 0; }
.doc-stage {
  position: relative; border-radius: var(--radius); overflow: hidden; background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .16);
}
.dv-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.dv-track::-webkit-scrollbar { display: none; }
.dv-track img {
  flex: 0 0 100%;
  width: 100%;
  height: auto;
  display: block;
  scroll-snap-align: start;
}
.dv-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 34px; height: 34px; border-radius: 50%; border: 0;
  background: rgba(0, 0, 0, .45); color: #fff; font-size: 14px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .2s ease;
}
.doc-stage:hover .dv-arrow, .doc-stage:focus-within .dv-arrow { opacity: 1; }
.dv-prev { left: 8px; }
.dv-next { right: 8px; }
.dv-arrow:disabled { opacity: 0 !important; cursor: default; }
.dv-counter {
  position: absolute; right: 8px; top: 8px;
  background: rgba(0, 0, 0, .55); color: #fff;
  font-size: 11px; padding: 2px 8px; border-radius: 10px;
}
.dv-dots { display: flex; justify-content: center; gap: 6px; margin-top: 8px; }
.dv-dots button {
  width: 7px; height: 7px; border-radius: 50%; border: 0; padding: 0;
  background: #c4c4c4; cursor: pointer;
}
.dv-dots button[aria-selected="true"] { background: var(--green); }
.pdf-inline-link { margin: 8px 0 0; font-size: 14px; text-align: center; }
.kurs-cta { position: relative; text-align: center; margin: 1.8em 0 0; }
.kurs-cta .cta-inline {
  display: inline-flex; align-items: center; box-sizing: border-box;
  height: 40px; padding: 0 60px; font-size: 17px;
}

.kurs-cta .cta-scholar {
  display: inline-flex; align-items: center; box-sizing: border-box;
  height: 40px; padding: 0 18px; font-size: 13px; color: var(--text);
}
.kurs-cta .cta-inline + .cta-scholar {
  position: absolute; top: 50%; transform: translateY(-50%); margin-left: 10px;
}
.kurs-cta .cta-scholar:hover { color: var(--text); }

@media (max-width: 760px) {
  .kurs-raster { grid-template-columns: 1fr; gap: 1.6em; }
  .kurs-block .doc-viewer { max-width: 320px; }
  
  .kurs-wolke, .kurs-raster div:has(> .kurs-wolke) { display: none; }
}

.teilnehmer-slider .kunden-kachel {
  border: 0; background: transparent;
  padding: 14px 0; justify-content: center;
  min-width: 0; overflow: hidden;
}

.teilnehmer-slider .teilnehmer-logos {
  display: flex; flex-wrap: wrap;
  justify-content: space-between; align-items: center; gap: 22px 30px;
}

.teilnehmer-slider .teilnehmer-logos img {
  filter: grayscale(1); opacity: .72;
  transition: filter .2s ease, opacity .2s ease;
}
.teilnehmer-slider .teilnehmer-logos:hover img { filter: none; opacity: 1; }

@media (max-width: 760px) {
  
  .teilnehmer-slider { display: block; }
  
  .teilnehmer-slider .teilnehmer-logos {
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 12px 18px;
  }
  .teilnehmer-slider .teilnehmer-logos img {
    height: auto !important; max-height: 17px; max-width: 84px;
    object-fit: contain;
  }
  .teilnehmer-slider .kunden-kachel { padding: 10px 6px; }

  
  .intro-row .kurs-kopf { grid-row: auto; grid-column: span 1; order: 1; }
  .intro-row .kurs-rand { grid-row: auto; grid-column: span 1; order: 2; flex-wrap: wrap; }
  .intro-row .kurs-teiln { grid-row: auto; grid-column: span 1; order: 3; margin-top: 1.8em; }
  .kurs-rand .kurs-toc-v { flex: 1 1 100%; margin-top: 1.2em; }
  
  .intro-row .kurs-rand .contact-box { flex: 0 1 150px; }
  .kurs-rand .kurs-kontakt { flex: 1 1 0; min-width: 0; overflow-wrap: anywhere; }
  
  .kurs-fotowand { grid-template-columns: 1fr 1fr; }
  .kurs-fotowand img { height: 110px; }
  
  .testimonial-reihe { margin-bottom: 2em; row-gap: 1.5em; }
  .testimonial-reihe .testimonial:nth-child(n+3) { display: none; }
  
  .testimonial-reihe .testimonial-kurz { order: 9; }
}

.cta-inline {
  display: inline-block;
  background: var(--green);
  color: #fff;
  padding: 3px 14px;
  border: 1px solid #3a3a3a;
  border-radius: var(--radius);
  line-height: 1.5;
  white-space: nowrap;
}
.cta-inline:hover { background: var(--green-light); color: #fff; text-decoration: none; }

.cta-scholar {
  display: inline-block;
  background: #eef5ee;
  color: #000;
  padding: 3px 14px;
  border: 1px dashed #8fbc8f;
  border-radius: var(--radius);
  line-height: 1.5;
  white-space: nowrap;
}
.cta-scholar:hover { background: #e0eee0; color: #000; text-decoration: none; }

.contact-cta { text-align: center; margin: 1.2em 0 0; }

@media (max-width: 760px) {
  
  .facts-list { column-gap: 16px; row-gap: 3px; font-size: 13px; }
}

.zahlenstrahl {
  display: flex;
  margin: 0.4em 0 1.5em;
  padding: 1.35em 0 1.55em;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.zahlenstrahl > div {
  flex: 1 1 0;
  text-align: center;
  border-right: 1px solid var(--line);
  padding: 0 0.8em;
}
.zahlenstrahl > div:last-child { border-right: none; }
.zahlenstrahl .zs-num { font-size: 29px; font-weight: 400; color: var(--green); line-height: 1.05; }
.zahlenstrahl .zs-num.zs-dark { color: #4a4a4a; }
.zahlenstrahl .zs-label { font-size: 11px; color: var(--muted); margin-top: 0.2em; white-space: nowrap; }
@media (max-width: 760px) {
  .zahlenstrahl { display: block; padding: 0.4em 0; }
  .zahlenstrahl > div {
    display: flex;
    align-items: baseline;
    gap: 0.7em;
    text-align: left;
    border-right: none;
    border-bottom: 1px solid var(--line);
    padding: 0.55em 0;
  }
  .zahlenstrahl > div:last-child { border-bottom: none; }
  .zahlenstrahl .zs-num { font-size: 22px; flex: 0 0 4em; text-align: right; }
  .zahlenstrahl .zs-label { font-size: 11px; margin-top: 0; white-space: normal; }
}

.zahlenstrahl.zs-nur-desktop > div { padding: 0 0.4em; }
.zahlenstrahl .zs-label a { color: inherit; text-decoration: none; }
.zahlenstrahl .zs-label a:hover { text-decoration: underline; }
.zahlenstrahl .zs-num a { color: inherit; text-decoration: none; }
.zahlenstrahl .zs-num a:hover { text-decoration: underline; }
@media (max-width: 1040px) {
  .zahlenstrahl.zs-nur-desktop .zs-num { font-size: 26px; }
  .zahlenstrahl.zs-nur-desktop .zs-label { font-size: 11px; }
  .zahlenstrahl.zs-nur-desktop > div { padding: 0 0.4em; }
}
@media (max-width: 860px) {
  .zahlenstrahl.zs-nur-desktop { display: none; }
}

@media (max-width: 760px) {
  .kurs-cta { display: flex; justify-content: center; align-items: center; gap: 10px; }
  .kurs-cta .cta-inline { height: 38px; padding: 0 32px; }
  .kurs-cta .cta-scholar { height: 38px; padding: 0 12px; font-size: 13px; }
  .kurs-cta .cta-inline + .cta-scholar { position: static; transform: none; margin-left: 0; }
  
  .intro-row .kurs-rand { align-items: center; }
  
  .contact-stack { margin-top: 1.8em; }
  .col-3:has(> .seiten-toc) { margin-top: 1.8em; }
}

.webinar-block { margin-top: 2.6em; }
.webinar-grid { display: flex; gap: 24px; margin-top: 1.2em; }
.webinar-card { flex: 1; min-width: 0; }

.webinar-start {
  display: block; position: relative; width: 100%; padding: 0; border: 0;
  background: #000; cursor: pointer; aspect-ratio: 16 / 9;
  border-radius: var(--radius); overflow: hidden;
}
.webinar-start img { width: 100%; height: 100%; object-fit: cover; display: block; }
.webinar-start:hover img { opacity: .88; }
.webinar-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.webinar-play::before { content: ""; width: 40px; height: 40px; background: rgba(0,0,0,.55); border-radius: 50%; }
.webinar-play::after { content: ""; position: absolute; border-style: solid; border-width: 8px 0 8px 13px; border-color: transparent transparent transparent #fff; margin-left: 4px; }
.webinar-video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: #000; }
.webinar-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.video-embed .webinar-start, .video-embed .webinar-video { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; border-radius: 0; }
@media (max-width: 760px) {
  
  .webinar-block { margin-top: 2.2em; }
  .webinar-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
}

@media (max-width: 760px) {
  
  .row:has(> .col-3 > .seiten-toc:first-child) { grid-template-columns: 1fr auto; column-gap: 16px; }
  .row:has(> .col-3 > .seiten-toc:first-child) > .col-1 { display: none; }
  .row:has(> .col-3 > .seiten-toc:first-child) > .col-3 { margin-top: 0; }
}

a.bild-zoom { display: block; cursor: zoom-in; }
a.bild-zoom img { display: block; }

a.bild-zoom.zoom-rund { display: inline-block; }

.lightbox {
  position: fixed; inset: 0; z-index: 200;   
  display: none; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, .82);
  padding: 40px 56px;
}
.lightbox.offen { display: flex; }
body.lb-offen { overflow: hidden; }

.lb-figur { margin: 0; text-align: center; max-width: 100%; max-height: 100%; }
.lb-figur img {
  display: block; margin: 0 auto;
  max-width: 100%; max-height: calc(100vh - 130px);
  width: auto; height: auto;
  border-radius: var(--radius);
  background: #f2f2f2;                       
  box-shadow: 0 6px 30px rgba(0, 0, 0, .45);
}

.lb-figur.rund img { width: 400px; max-width: 76vmin; height: auto; border-radius: 50%; }
.lb-figur figcaption { color: #fff; font-size: .88em; margin-top: 14px; opacity: .85; }

.lb-schliessen, .lb-pfeil {
  position: absolute; background: none; border: 0; color: #fff;
  cursor: pointer; line-height: 1; padding: 8px 12px; opacity: .7;
  transition: opacity .15s ease;
}
.lb-schliessen:hover, .lb-pfeil:hover, .lb-schliessen:focus-visible, .lb-pfeil:focus-visible { opacity: 1; }
.lb-schliessen { top: 10px; right: 14px; font-size: 34px; }
.lb-pfeil { top: 50%; transform: translateY(-50%); font-size: 40px; }
.lb-vor { right: 6px; }
.lb-zurueck { left: 6px; }
.lb-zaehler { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; color: #fff; font-size: .8em; opacity: .6; }

@media (max-width: 760px) {
  .lightbox { padding: 30px 8px; }
  .lb-pfeil { font-size: 30px; }
  .lb-figur img { max-height: calc(100vh - 110px); }
}

.dash-titelzeile { display: flex; align-items: baseline; gap: 4px 22px; flex-wrap: wrap; }
.dash-titelzeile .seiten-toc { margin: 0; padding-top: 0; border-top: 0; }

.dash-nav {
  position: sticky; top: var(--kopf); z-index: 90;
  display: flex; align-items: center; justify-content: space-between;
  gap: 4px 22px; flex-wrap: wrap;
  background: var(--bg); padding: 6px 0 7px;
  border-bottom: 1px solid var(--line); margin-bottom: 1.4em;
}
.dash-nav .seiten-toc { margin: 0; padding-top: 0; border-top: 0; }

.dash-abschnitt[id] { scroll-margin-top: calc(var(--kopf) + 62px); }

.dash-raster {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 22px 34px; padding: 16px;
}

.dash-raster.lang { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 820px) { .dash-raster.lang { grid-template-columns: 1fr; } }
.dash-mini-titel { font-size: 13px; color: #4a4a4a; display: block; margin-bottom: 1px; }

.dash-mini-zelle { position: relative; }
.dash-mini-links {
  position: absolute; top: -1px; right: 0;
  display: inline-flex; gap: 9px; white-space: nowrap;
  background: #fff; padding: 0 0 2px 8px;
}
.dash-mini-links a { font-size: 12px; }
.dash-mini-links .dash-csv { margin-left: 0; }

.dash-mini-zelle[hidden] { display: none; }
.dash-mini { position: relative; width: 100%; }
.dash-mini svg { display: block; width: 100%; height: auto; }

.dash-mini .dash-daylab,
.dash-mini .dash-balkenwert { font-size: 10px; }

.dash-spur { fill: rgba(0, 0, 0, .05); }

.dash-bar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 0 0 20px; }
.dash-stand { font-size: 13px; color: var(--muted); }
.dash-stand b { font-weight: 600; color: var(--text); }

.dash-tabs {
  display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; background: #fff;
}
.dash-tabs button, .dash-tabs a {
  appearance: none; border: 0; background: #fff; color: var(--text); cursor: pointer;
  font: inherit; font-size: 13px; padding: 4px 14px; border-right: 1px solid var(--line);
  text-decoration: none; display: inline-block;
}
.dash-tabs button:last-child, .dash-tabs a:last-child { border-right: 0; }
.dash-tabs button:hover, .dash-tabs a:hover { color: var(--green); text-decoration: none; }
.dash-tabs button[aria-selected="true"], .dash-tabs a[aria-current="page"] {
  background: #eef5ee; color: #000;
}
.dash-tabs button:focus-visible, .dash-tabs a:focus-visible {
  outline: 2px solid var(--green-light); outline-offset: -2px;
}

.dash-tabs button:disabled { color: var(--muted); background: #fafafa; cursor: default; }
.dash-tabs button:disabled:hover { color: var(--muted); }

.dash-panel {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 10px 14px 6px; margin-bottom: 14px;
}

.dash-kopf { display: flex; align-items: baseline; gap: 4px 12px; flex-wrap: wrap; }

.dash-panel { container-type: inline-size; }
.dash-kopf .dash-kappen { order: 0; white-space: nowrap; }
.dash-kopf h4 { margin: 0; font-size: 16px; font-weight: 400; color: #4a4a4a;
                white-space: normal; min-width: 0; }
.dash-abschnitt { margin: 1.7em 0 .6em; }

.dash-unterabschnitt {
  font-size: 15px; font-weight: 600; color: #4a4a4a;
  letter-spacing: .02em; margin: 1.6em 0 .7em;
}
.dash-unterabschnitt[id] { scroll-margin-top: calc(var(--kopf) + 62px); }
.dash-abschnittszeile { display: flex; align-items: baseline; gap: 6px 18px; flex-wrap: wrap; }
.dash-abschnittszeile .dash-abschnitt { margin-bottom: 0; }
.dash-abschnittszeile { margin-bottom: 16px; }
.dash-zeile { display: flex; align-items: baseline; gap: 6px 16px; flex-wrap: wrap; }
.dash-zeile .dash-csv { margin-left: auto; }
.dash-zeile p { margin: 0; }
.dash-variante { font-size: 13px; color: var(--muted); text-decoration: none; }
.dash-variante:hover { color: var(--green); }
.dash-csv { margin-left: auto; font-size: 13px; color: var(--muted); text-decoration: none; }
.dash-csv:hover { color: var(--green); }

.dash-bild { font-size: 13px; color: var(--muted); text-decoration: none; cursor: pointer; }
.dash-bild:hover { color: var(--green); }

.dash-info { font-size: 13px; color: var(--muted); text-decoration: none; cursor: pointer; }
.dash-info:hover { color: var(--green); }

.dash-teilen { font-size: 13px; color: var(--muted); text-decoration: none; cursor: pointer; }
.dash-teilen:hover { color: var(--green); }

@media (min-width: 761px) { .dash-teilen { display: none; } }

.dash-teilen-menue {
  position: fixed; z-index: 300;
  background: #fff; border: 1px solid #ddd; border-radius: 4px;
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
  padding: 4px 0; display: flex; flex-direction: column; min-width: 170px;
}
.dash-teilen-menue button {
  background: none; border: 0; text-align: left; cursor: pointer;
  font: inherit; font-size: 13px; color: #4a4a4a; padding: 6px 14px;
}
.dash-teilen-menue button:hover { background: #eef5ee; color: #000; }

.dash-panel.dash-ziel, .dash-mini-zelle.dash-ziel {
  outline: 2px solid var(--green); outline-offset: 2px;
}

.dash-tabs button[aria-pressed="true"] { background: #eef5ee; color: #000; }
@media (max-width: 820px) { .dash-breitwahl { display: none; } }

@media (hover: hover) and (pointer: fine) {
  .dash-panel .dash-csv,
  .dash-panel .dash-bild,
  .dash-panel .dash-info {
    opacity: 0;
    transition: opacity .12s ease;
  }
  .dash-panel:hover .dash-csv,
  .dash-panel:hover .dash-bild,
  .dash-panel:hover .dash-info,
  .dash-panel .dash-csv:focus-visible,
  .dash-panel .dash-bild:focus-visible,
  .dash-panel .dash-info:focus-visible {
    opacity: 1;
  }
  
  
  .dash-mini-links { opacity: 0; transition: opacity .12s ease; }
  .dash-mini-zelle:hover .dash-mini-links,
  .dash-mini-links:focus-within { opacity: 1; }
  .dash-mini-links .dash-csv,
  .dash-mini-links .dash-bild,
  .dash-mini-links .dash-info { opacity: 1; }
}

.dash-kopf .dash-legend,
.dash-kopf .dash-reihen,
.dash-kopf .dash-laender { flex: 1 0 100%; order: 5; }

.dash-kopf .dash-reihen { order: 6; }

.dash-kopf .dash-tabszeile { flex: 1 0 100%; order: 5; }
.dash-kopf .dash-csv,
.dash-kopf .dash-bild,
.dash-kopf .dash-teilen { order: 1; }

.dash-kopf .dash-info { order: 2; }

.dash-legend { display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: 13px; color: var(--muted); }
.dash-legend span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.dash-legend i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; flex: none; }
.dash-legend i.ln { height: 0; border-top: 2px solid currentColor; border-radius: 0; }
.dash-legend i.ln.gestr { border-top-style: dashed; }

.dash-chart { position: relative; width: 100%; margin-top: 4px; }
.dash-chart svg { display: block; width: 100%; height: auto; overflow: visible; }

.dash-grid line { stroke: var(--line); stroke-width: 1; }
.dash-zero line { stroke: var(--border); stroke-width: 1; }
.dash-ax text { fill: var(--muted); font-size: 11px; }
.dash-ax .dash-unit {
  paint-order: stroke fill; stroke: #fff; stroke-width: 3px; stroke-linejoin: round;
}
.dash-xachse { stroke: #3f3f3f; stroke-width: 1; }
.dash-tick { stroke: #3f3f3f; stroke-width: 1; }
.dash-daysep { stroke: var(--line); stroke-width: 1; stroke-dasharray: 3 3; }
.dash-daylab, .dash-hour { fill: var(--muted); font-size: 11px; }
.dash-balkenwert { fill: #4a4a4a; font-size: 11px; font-variant-numeric: tabular-nums; }
.dash-linienlabel { font-size: 12px; paint-order: stroke fill; stroke: #fff;
                    stroke-width: 3px; stroke-linejoin: round; }
.dash-wip { fill: #bdbdbd; font-size: 13px; }

.dash-hinweis { fill: #bdbdbd; font-size: 10px; }

.dash-kappen { font-size: 13px; color: var(--muted); display: inline-flex;
               align-items: center; gap: 5px; cursor: pointer; }

.dash-reihen { display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 11px;
                color: var(--muted); }
.dash-reihen label { display: inline-flex; align-items: center; gap: 3px; cursor: pointer; }
.dash-reihen input { margin: 0; accent-color: #a8bda3; transform: scale(.82);
                     transform-origin: center; }

.dash-laender { display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 13px; }
.dash-laender label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.dash-laender input { margin: 0; accent-color: var(--green); }
.dash-zonen-knoepfe { display: inline-flex; gap: 10px; }
.dash-zonen-knoepfe button { border: 0; background: none; padding: 0; font-size: 13px;
  color: var(--muted); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.dash-zonen-knoepfe button:hover { color: var(--green); }
.dash-cross { stroke: var(--border); stroke-width: 1; }

.dash-zone { stroke: #cfcfcf; stroke-width: .9; }
.dash-zone:hover { stroke: #1c1c1c; stroke-width: 2; }
.dash-zone-wert {
  text-anchor: middle; dominant-baseline: central; pointer-events: none;
  font-variant-numeric: tabular-nums; paint-order: stroke; stroke-width: 4;
  stroke-linejoin: round;
}

.dash-tt {
  position: absolute; pointer-events: none; opacity: 0; transition: opacity .1s;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 7px 9px; font-size: 13px; line-height: 1.4; color: var(--text);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .09); z-index: 5; min-width: 150px; top: 2px;
}
.dash-tt .h { font-size: 11px; color: var(--muted); margin-bottom: 4px; display: block; }
.dash-tt table { border-collapse: collapse; width: 100%; }
.dash-tt td { padding: 1px 0; vertical-align: baseline; }
.dash-tt td.v { text-align: right; padding-left: 14px; font-variant-numeric: tabular-nums; color: #4a4a4a; }
.dash-tt i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; margin-right: 6px; }
.dash-tt tr.sum td { border-top: 1px solid var(--line); padding-top: 3px; }

.dash-tt .dash-tt-klein { display: block; margin-top: 3px; font-size: 11px;
                          color: var(--muted); white-space: nowrap; }

.dash-fehler {
  border: 1px solid #d26a5e; border-radius: var(--radius); padding: 10px 14px;
  font-size: 13px; color: #d26a5e; background: #fff; margin-bottom: 14px;
}
.dash-fehler b { font-weight: 600; }

.dash-quellen { font-size: 10px; line-height: 1.45; color: #d4d4d4; margin-top: 12px; }
.dash-quellen a { color: #d4d4d4; }
.dash-quellen a:hover { color: var(--green); }

.dash-raster3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 14px; margin-bottom: 14px; }
.dash-raster3 .dash-panel { margin-bottom: 0; height: 100%; }
.dash-raster2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 14px; margin-bottom: 14px; }
.dash-raster2 .dash-panel { margin-bottom: 0; height: 100%; }
.dash-schmal .dash-titelzeile { gap: 6px 18px; }

.dash-raster2 > .dash-panel:not(.breit) .dash-legend,
.dash-raster3 > .dash-panel:not(.breit) .dash-legend { display: none; }
.dash-raster2 > .dash-panel:not(.breit) .dash-kopf h4,
.dash-raster3 > .dash-panel:not(.breit) .dash-kopf h4 { font-size: 15px; }

.dash-raster2 > .dash-panel.breit,
.dash-raster3 > .dash-panel.breit { grid-column: 1 / -1; }
@media (max-width: 1200px) { .dash-raster3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 820px)  { .dash-raster3, .dash-raster2 { grid-template-columns: 1fr; } }

@media (max-width: 760px) {
  .dash-kopf h4 { font-size: 15px; }
}
@media print { .dash-tabs, .dash-csv { display: none; } }

.dash-dialog {
  border: 1px solid var(--border); border-radius: 8px; padding: 0;
  max-width: 640px; width: calc(100% - 32px); max-height: 80vh;
  color: var(--text); background: #fff;
}
.dash-dialog::backdrop { background: rgba(0, 0, 0, .28); }
.dash-dialog-innen { padding: 20px 24px 24px; overflow-y: auto; max-height: 80vh; }
.dash-dialog h3 { margin: 0 0 2px; font-size: 17px; font-weight: 400; }
.dash-dialog h4 { margin: 16px 0 3px; font-size: 13px; font-weight: 600;
                  letter-spacing: .02em; text-transform: uppercase; color: var(--muted); }
.dash-dialog p, .dash-dialog li { font-size: 14px; line-height: 1.5; margin: 0 0 6px; }
.dash-dialog ul { margin: 0 0 6px; padding-left: 18px; }
.dash-dialog-zu { position: absolute; top: 10px; right: 14px; border: 0; background: none;
                  font-size: 20px; line-height: 1; color: var(--muted); cursor: pointer; }
.dash-dialog-zu:hover { color: var(--green); }

.dash-alert { margin-bottom: 8px; }
.dash-alert .dash-abschnittszeile { margin-bottom: 6px; }
.dash-alert .dash-info { margin-left: auto; }
.dash-alert-liste { list-style: none; margin: 0 0 6px; padding: 0; font-size: 13px; line-height: 1.55; }
.dash-alert-liste li { margin: 0; padding: 1px 0; }
.dash-alert-tag { color: var(--muted); margin-right: 4px; }

.dash-alert-knapp { color: #D26A5E; }
.dash-alert-ueber { color: #4061A4; }
.dash-alert-neutral { color: #595959; }
.dash-alert-liste b { font-weight: 600; }
.dash-alert-ruhig { color: var(--muted); }

.da-panel {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 16px; margin: 0 0 14px;
}
.da-panel h2 { margin: 0 0 .6em; font-size: 17px; }
.da-panel p { margin: 0; }
.da-status { color: var(--muted); margin: 0 0 12px; }
.da-status b { color: var(--text); }
.da-trenner { margin: 0 .55em; color: var(--border); }

.da-zahlen { display: flex; flex-wrap: wrap; gap: 10px 34px; margin-bottom: 14px; }
.da-zahlen > div { display: flex; flex-direction: column; }
.da-zahlen strong { font-size: 34px; font-weight: 600; line-height: 1.15; display: inline; }
.da-zahlen .da-einheit { font-size: 14px; color: var(--muted); }
.da-zahlen > div > .da-einheit { margin-top: -6px; }
.da-mini { font-size: 13px; color: var(--muted); }
.da-panel .da-mini { margin-top: .6em; }
.da-ok { color: var(--green); font-weight: 600; }
.da-plus { color: var(--green); }
.da-minus { color: #b8402f; }

.da-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.da-form input {
  font: inherit; font-size: 21px; padding: 7px 10px; width: 100%; max-width: 230px;
  border: 1px solid var(--border); border-radius: var(--radius); color: var(--text);
}
.da-form input:focus { outline: 2px solid var(--green-light); border-color: var(--green); }
.da-form button {
  font: inherit; font-size: 17px; font-weight: 600; padding: 9px 20px; border: 0;
  border-radius: var(--radius); background: var(--green); color: #fff; cursor: pointer;
}
.da-form button:hover { background: var(--green-light); }
.da-leise {
  font: inherit; font-size: 13px; padding: 5px 12px; cursor: pointer;
  background: #fff; color: var(--green);
  border: 1px solid var(--green); border-radius: var(--radius);
}
.da-leise:hover { color: var(--green-light); border-color: var(--green-light); }

.da-fehler {
  background: #fbeae7; color: #b8402f; padding: 8px 12px;
  border-radius: var(--radius); margin: 0 0 12px;
}

.da-panel svg { width: 100%; height: auto; display: block; }
.da-scroll { overflow-x: auto; }
.da-panel table { width: 100%; border-collapse: collapse; font-size: 14px; }
.da-panel th, .da-panel td {
  padding: 5px 6px; text-align: right; white-space: nowrap;
  border-bottom: 1px solid var(--line);
}
.da-panel th {
  font-weight: 600; font-size: 12px; color: var(--muted);
  letter-spacing: .03em; text-transform: uppercase;
}
.da-panel th:first-child, .da-panel td:first-child { text-align: left; }
.da-panel tr.da-ich td { background: #eef5ed; font-weight: 600; }
.da-panel tr.da-aus td { color: var(--muted); }
.da-panel h2 + .da-scroll + h2 { margin-top: 1.4em; }

.da-form input[type="number"] { appearance: textfield; -moz-appearance: textfield; }
.da-form input::-webkit-outer-spin-button,
.da-form input::-webkit-inner-spin-button { appearance: none; margin: 0; }

.da-verlust  { color: #b8402f; font-weight: 600; }
.da-entgangen { color: #4061A4; font-weight: 600; }
.da-blass    { color: var(--muted); }
.da-glueck   { color: var(--muted); font-size: 12px; white-space: normal; }
.da-panel td { font-variant-numeric: tabular-nums; }
.da-panel tr.da-preiszeile td { color: var(--text); border-bottom: 1px solid var(--border); }
.da-panel tr.da-preiszeile td:first-child { color: var(--muted); font-size: 12px; }

.da-regel-zeile { margin: 0 0 12px; }
.da-dialog {
  max-width: 40em; margin: auto; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 18px 22px; color: var(--text); background: #fff;
}
.da-dialog::backdrop { background: rgba(0, 0, 0, .35); }
.da-dialog h2 { margin: 0 0 .6em; font-size: 19px; color: var(--green); }
.da-dialog p { margin: 0 0 .9em; }
.da-dialog p:last-child { margin: 1.2em 0 0; }

.form { max-width: 34rem; margin: 22px 0 8px; }

.form-feld { margin-bottom: 16px; }

.form-feld label {
  display: block;
  margin-bottom: 4px;
  font-size: 15px;
  color: var(--text);
}

.form-optional { color: var(--muted); font-size: 13px; }

.form input[type="text"],
.form input[type="email"],
.form select,
.form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: #fff;
  font: inherit;
  font-size: 15px;
  color: var(--text);
}

.form textarea { resize: vertical; min-height: 88px; }

.form input:focus-visible,
.form select:focus-visible,
.form textarea:focus-visible {
  outline: none;
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(75, 130, 70, .16);
}

.form-honig {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.form-fuss { display: flex; align-items: center; gap: 12px; margin-top: 20px; }

.form-knopf {
  padding: 9px 18px;
  border: 0;
  border-radius: var(--radius);
  background: var(--green);
  color: #fff;
  font: inherit;
  font-size: 15px;
  cursor: pointer;
  transition: background .15s;
}

.form-knopf:hover { background: var(--green-light); }
.form-knopf:focus-visible { outline: 2px solid var(--dot-aktiv); outline-offset: 2px; }

.form-lauft, .form-hinweis { color: var(--muted); font-size: 14px; }

.form-antwort {
  margin: 18px 0;
  padding: 10px 14px;
  border-left: 3px solid var(--border);
  background: var(--bg);
  border-radius: 0 var(--radius) var(--radius) 0;
}

.form-antwort.gut { border-left-color: var(--green); }
.form-antwort.schlecht { border-left-color: #c0574b; }

.form-fehler { margin: 4px 0 0; font-size: 14px; color: #c0574b; }

.form-gruppe {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 0;
  padding: 22px 0 4px;
}

.form-gruppe:first-of-type { border-top: 0; padding-top: 0; }

.form-gruppe legend {
  padding: 0;
  margin-bottom: 4px;
  font-size: 18px;
  color: #4a4a4a;
}

.form-pflicht { color: var(--green); }

.form-kurs {
  display: flex;
  gap: 10px;
  align-items: baseline;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  padding: 10px 12px;
  margin-bottom: 6px;
  cursor: pointer;
}

.form-kurs:hover { border-color: var(--green-light); }
.form-kurs:has(input:checked) { border-color: var(--green); background: var(--bg); }
.form-kurs input { margin: 0; flex: 0 0 auto; }
.form-kurs-text { color: var(--text); font-size: 15px; }
.form-kurs-termin { display: block; color: var(--muted); font-size: 13px; }

.form-zeile { display: flex; gap: 14px; flex-wrap: wrap; }
.form-zeile .form-feld { flex: 1 1 11rem; }
.form-feld-plz { flex: 0 1 7rem; }

.form-radios { display: flex; gap: 22px; flex-wrap: wrap; }

.form-radios label {
  display: flex;
  gap: 7px;
  align-items: baseline;
  margin: 0;
  font-size: 15px;
  color: var(--text);
}

.form-bedingungen {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px 16px;
  font-size: 13px;
}

.form-bedingungen p { margin: 0 0 10px; }
.form-bedingungen p:last-child { margin-bottom: 0; }

.form-haken { display: flex; gap: 9px; align-items: baseline; margin-top: 12px; }
.form-haken input { margin: 0; flex: 0 0 auto; }

.form-haken label {
  margin: 0;
  font-size: 15px;
  color: var(--text);
}

.form-fertig {
  border: 1px solid var(--green);
  border-radius: var(--radius);
  background: var(--bg);
  padding: 16px 18px;
  margin: 22px 0;
  max-width: 34rem;
}

.form-fertig h2 { margin-top: 0; }
.form-fertig p:last-child { margin-bottom: 0; }

.form-datenschutz { margin-top: 18px; max-width: 34rem; }

.form-liste { display: grid; gap: 10px; margin: 12px 0 8px; max-width: 42rem; }

.form-eintrag {
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  
  overflow-wrap: anywhere;
}

.form-eintrag-kopf {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

.form-eintrag-kopf strong { color: var(--green); }
.form-eintrag-zeit { color: var(--muted); font-size: 13px; white-space: nowrap; }
.form-eintrag-zeile { font-size: 15px; color: var(--text); }
.form-eintrag-anmerkung { margin-top: 4px; white-space: pre-wrap; }
