/* ueber-uns.css — "Über uns" im VIDEO.TAXI Editorial-System (home-v2).
   Wrapped in .hv[data-hv="warm"]; nutzt HV-Primitives + .au_ Page-Klassen. */

/* ── Hero ─────────────────────────────────────────────────── */
.au_hero { padding: 56px 0 0; }
.au_hero-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(360px,460px); gap: clamp(32px,5vw,64px); align-items: start; }
.au_hero h1 { font-size: clamp(34px,4.4vw,58px); margin: 18px 0 24px; }
.au_hero h1 em { font-style: italic; color: var(--accent); }
.au_lede { font-size: clamp(17px,1.5vw,21px); line-height: 1.5; color: var(--ink-2); margin: 0 0 26px; max-width: 52ch; }
.au_punch { font-size: clamp(18px,1.5vw,23px); line-height: 1.42; color: var(--ink); margin: 0; padding-left: 20px; border-left: 2px solid var(--accent); max-width: 42ch; }

/* photo */
.au_figure { margin: 0; position: sticky; top: 92px; }
.au_imgwrap { position: relative; border-radius: 8px; overflow: hidden; background: #0a0d12; box-shadow: 0 32px 70px -28px rgba(35,32,27,0.45), 0 8px 22px -10px rgba(35,32,27,0.25); }
.au_img { width: 100%; height: auto; display: block; aspect-ratio: 600/397; object-fit: cover; }
.au_live { position: absolute; top: 14px; left: 14px; display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; background: rgba(10,13,18,0.78); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: #fff; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; border-radius: 3px; }
.au_dot { width: 7px; height: 7px; border-radius: 50%; background: #ff3b30; animation: au-pulse 1.6s ease-out infinite; }
@keyframes au-pulse { 0%{box-shadow:0 0 0 0 rgba(255,59,48,.55)} 70%{box-shadow:0 0 0 8px rgba(255,59,48,0)} 100%{box-shadow:0 0 0 0 rgba(255,59,48,0)} }
.au_cc { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); background: #000; padding: 9px 18px; max-width: calc(100% - 28px); text-align: center; }
.au_ccline { display: block; color: #fff; font-family: var(--sans); font-weight: 500; font-size: clamp(12px,1.2vw,15px); line-height: 1.34; white-space: nowrap; }
.au_caption { margin-top: 12px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); }

/* ── Stats band ───────────────────────────────────────────── */
.au_stats { list-style: none; margin: clamp(48px,6vw,80px) 0 0; padding: 40px 0 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: repeat(4,1fr); gap: clamp(20px,3vw,44px); }
.au_stat { display: flex; flex-direction: column; gap: 10px; }
.au_stat-b { font-family: var(--display); font-size: clamp(30px,3.2vw,46px); font-weight: 400; line-height: 1; letter-spacing: -0.01em; color: var(--ink); }
.au_stat-s { font-size: 14px; line-height: 1.4; color: var(--ink-2); max-width: 24ch; }

/* ── Bindeglied statement ─────────────────────────────────── */
.au_bind { margin: clamp(44px,5vw,72px) 0 0; font-family: var(--display); font-size: clamp(26px,3.4vw,46px); font-weight: 300; font-variation-settings: "opsz" 120, "wght" 320; line-height: 1.18; letter-spacing: -0.015em; color: var(--ink); max-width: 24ch; }
.au_bind em { font-style: italic; color: var(--accent); }

/* ── Chronik / timeline ───────────────────────────────────── */
.au_chron-head { max-width: 640px; display: grid; gap: 14px; margin-bottom: 40px; }
.au_chron-head h2 { font-size: clamp(27px,3.1vw,42px); }
.au_chron-head h2 em { font-style: italic; color: var(--accent); }
.au_chron-head p { margin: 0; font-size: 17px; line-height: 1.55; color: var(--ink-2); }
.au_rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.au_row { display: grid; grid-template-columns: 88px 1fr 84px; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--rule); align-items: baseline; }
.au_row--mark { border-left: 2px solid var(--accent); margin-left: -18px; padding-left: 16px; }
.au_year { font-family: var(--display); font-size: 24px; font-weight: 400; color: var(--ink); font-variation-settings: "opsz" 40; }
.au_row--mark .au_year { color: var(--accent); }
.au_rbody h3 { margin: 0 0 7px; font-family: var(--display); font-size: 19px; font-weight: 500; line-height: 1.2; }
.au_rbody p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); max-width: 60ch; }
.au_badge { font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; color: var(--accent); text-align: right; }
.au_chron-foot { margin-top: 26px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; color: var(--ink-3); }

/* ── Facts strip ──────────────────────────────────────────── */
.au_facts { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 10px; overflow: hidden; }
.au_fact { background: var(--surface); padding: 26px 24px; display: grid; gap: 8px; }
.au_fact dt { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3); }
.au_fact dd { margin: 0; font-family: var(--display); font-size: 19px; font-weight: 500; color: var(--ink); line-height: 1.2; }
.au_fact dd small { display: block; font-family: var(--sans); font-size: 13px; font-weight: 400; color: var(--ink-2); margin-top: 4px; }

@media (max-width: 1020px) {
  .au_hero-grid { grid-template-columns: 1fr; gap: 36px; }
  .au_figure { position: static; order: -1; }
  .au_stats { grid-template-columns: repeat(2,1fr); row-gap: 32px; }
  .au_facts { grid-template-columns: 1fr 1fr; }
  .au_bind { max-width: none; }
}
@media (max-width: 560px) {
  .au_stats, .au_facts { grid-template-columns: 1fr; }
  .au_row { grid-template-columns: 64px 1fr; }
  .au_badge { display: none; }
}