/* Über uns — Zeitleiste, FAQ-Chips, Team-Auswahl (Werte aus dem Design). */
[data-pane][hidden] { display: none !important; }
button.u-station, button.qa-chip, button.u-person { font: inherit; text-align: left; background: none; border: 0; color: inherit; }

/* Zeitleiste */
.u-track { position: relative; height: 2px; background: var(--border); margin-bottom: 32px; }
.u-track-bar { position: absolute; left: 0; top: 0; height: 2px; background: var(--petrol); width: 8px; transition: width .5s cubic-bezier(.22, 1, .36, 1); }
.u-stations { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 24px; }
.u-station { display: block; cursor: pointer; padding: 0; }
.u-dot { display: block; width: 16px; height: 16px; border-radius: 999px; margin: -41px 0 24px; background: var(--border-2); }
.u-station.done .u-dot, .u-station.on .u-dot { background: var(--petrol); }
.u-y { display: block; font-size: 34px; line-height: 1.18; letter-spacing: -.02em; font-weight: 700; color: var(--text); }
.u-station.on .u-y { color: var(--petrol); }
.u-s { display: block; font-size: 17px; line-height: 1.6; color: var(--text-2); }
.u-panel { display: grid; grid-template-columns: minmax(0, 1fr); max-width: 820px; align-items: start; }
[data-tabs="station"] .u-panel { margin-top: 72px; border-top: 1px solid var(--border); padding-top: 48px; }
[data-tabs="qa"] .u-panel { border-top: 1px solid var(--border); padding-top: 48px; }
.u-panel .lead { color: var(--text-2); }
.u-fig { margin: 32px 0 0; display: flex; flex-direction: column; gap: 12px; }

/* Häufig gefragt */
.qa-chips { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 48px; }
.qa-chip {
  cursor: pointer; height: 54px; display: inline-flex !important; align-items: center; padding: 0 32px !important;
  border-radius: 999px; font-size: 17px !important; font-weight: 700 !important;
  border: 1px solid var(--border) !important; background: var(--surface) !important; color: var(--text) !important;
}
.qa-chip.on { background: #1668CF !important; border-color: #1668CF !important; color: #fff !important; }
[data-theme="dark"] .qa-chip.on { background: #6FAAF0 !important; border-color: #6FAAF0 !important; color: #0A1220 !important; }
.qa-body { font-size: 21px; line-height: 1.6; max-width: 60ch; text-wrap: pretty; margin: 0; }

/* Team */
.u-team { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 72px; margin-top: 72px; align-items: start; }
.u-portrait {
  position: relative; overflow: hidden; width: 360px; height: 450px; border-radius: 14px;
  box-shadow: 0 10px 26px -12px var(--blue); background-color: var(--tint);
  background-size: cover; background-position: 50% 15%;
}
.u-contact { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 16px; }
.u-contact a { font-size: 17px; }
.u-contact a span { color: var(--text-2); }
.u-people { display: flex; flex-direction: column; gap: 8px; margin-top: 48px; border-top: 1px solid var(--border); padding-top: 24px; }
.u-person {
  cursor: pointer; display: grid !important; grid-template-columns: 6px minmax(0, 1fr) auto; gap: 16px; align-items: center;
  padding: 16px !important; border-radius: 6px; background: transparent;
}
.u-person.on { background: var(--tint) !important; }
.u-person .mk { width: 6px; height: 24px; border-radius: 999px; background: var(--border-2); }
.u-person.on .mk { background: var(--blue); }
.u-person .nm { font-size: 18px; line-height: 1.3; letter-spacing: -.01em; font-weight: 700; color: var(--text); }
.u-person.on .nm { color: var(--blue); }
.u-person .rl { font-size: 17px; line-height: 1.6; color: var(--text-2); }

@media (max-width: 1100px) {
  .u-stations { grid-template-columns: 1fr !important; row-gap: 0 !important; }
  .u-track { display: none !important; }
  .u-dot { margin: 0 0 8px !important; }
  .u-station { border-top: 1px solid var(--border); padding-top: 20px; }
  .u-team { grid-template-columns: 1fr !important; }
  .u-portrait { width: 100% !important; height: auto !important; aspect-ratio: .8 !important; }
}
@media (max-width: 700px) {
  .u-person { grid-template-columns: 6px minmax(0, 1fr); }
  .u-person .rl { grid-column: 2; }
}