/* ─── Tokens (Skribe-Design-System) ───────────────────────── */
    :root {
      --accent-500:oklch(42.1% 0.120 252); --accent-600:oklch(36.1% 0.101 252); --accent-700:oklch(29.4% 0.079 252);
      --accent-100:oklch(92.0% 0.017 252); --accent-050:oklch(95.9% 0.010 252);
      --ink-900:oklch(16.1% 0.005 252); --ink-800:oklch(22.7% 0.006 252); --ink-700:oklch(31.3% 0.008 252);
      --ink-500:oklch(54.8% 0.008 252); --ink-400:#8E9290; --ink-300:oklch(82.9% 0.005 252); --ink-100:oklch(93.8% 0.003 252);
      --paper-00:oklch(100% 0 0); --paper-10:oklch(98.7% 0.002 252); --paper-20:oklch(96.8% 0.003 252);
      --sand:oklch(95.9% 0.012 252); --mint:oklch(80.1% 0.105 160);
      --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

      --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
      --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

      --r-sm:6px; --r-md:12px; --r-pill:999px;
      --hairline: 1px solid var(--ink-100);
      --topbar-h: 72px;
    }

    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: var(--font-sans);
      font-size: 18px; line-height: 1.7;
      color: var(--ink-800);
      background: var(--paper-10);
      -webkit-font-smoothing: antialiased;
    }
    a { color: inherit; text-decoration: none; }
    :focus-visible { outline: 2px solid var(--accent-500); outline-offset: 2px; border-radius: 4px; }

    /* ─── Topbar (Goldstandard 3-Zonen-Layout) ────────────────── */
    header.nav {
      position: sticky; top: 0; z-index: 90;
      background: rgba(250,251,250,0.92);
      backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
      border-bottom: var(--hairline);
      height: var(--topbar-h);
    }
    .nav__row { max-width: none; margin: 0 auto; height: 100%; padding: 0 var(--s-5); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--s-5); }
    @media (min-width: 880px) { .nav__row { padding: 0 var(--s-5); } }

    .nav__links {
      display: none; gap: var(--s-5);
      justify-self: start;
    }
    @media (min-width: 880px) { .nav__links { display: flex; align-items: center; } }
    .nav__links a {
      font-family: var(--font-sans); font-size: 14px; font-weight: 500;
      color: var(--ink-700); white-space: nowrap;
      transition: color 120ms cubic-bezier(0.22,0.61,0.36,1);
      position: relative;
    }
    .nav__links a::after {
      content: ""; position: absolute; left: 0; right: 0; bottom: -4px;
      height: 2px; background: var(--accent-500);
      transform: scaleX(0); transform-origin: center;
      transition: transform 180ms cubic-bezier(0.22,0.61,0.36,1);
    }
    .nav__links a:hover { color: var(--ink-900); }
    .nav__links a:hover::after, .nav__links a.is-active::after { transform: scaleX(1); }
    .nav__links a.is-active { color: var(--ink-900); }

    .nav__wordmark--center {
      justify-self: center;
      font-family: var(--font-sans);
      font-weight: 700; font-size: 22px;
      letter-spacing: -0.035em; color: var(--ink-900);
    }
    .nav__wordmark--center em {
      color: var(--accent-500);
      font-family: var(--font-serif); font-style:normal;
    }
    .wordmark__svg { height: 24px; width: auto; display: block; }
    .nav .wordmark__svg { height: 44px; }

    .nav__right {
      display: flex; align-items: center; gap: var(--s-3);
      justify-self: end;
    }
    .nav__linkedin {
      display: none;
      align-items: center; gap: 6px;
      padding: 6px 12px; border-radius: var(--r-pill);
      background: var(--accent-050);
      border: 1px solid var(--accent-100);
      color: var(--accent-600);
      transition: background 160ms cubic-bezier(0.22,0.61,0.36,1), border-color 160ms, transform 160ms, box-shadow 160ms;
    }
    @media (min-width: 880px) { .nav__linkedin { display: inline-flex; } }
    .nav__linkedin__kicker {
      font-family: var(--font-serif); font-style:normal; font-weight: 400;
      font-size: 13px; line-height: 1; letter-spacing: -0.01em;
      color: var(--accent-600); white-space: nowrap;
    }
    .nav__linkedin svg { width: 18px; height: 18px; color: var(--accent-600); }
    .nav__linkedin:hover {
      transform: translateY(-1px);
      background: var(--accent-100);
      border-color: var(--accent-500);
      box-shadow: 0 2px 8px rgba(10,78,140,0.10);
    }
    .nav__linkedin:hover .nav__linkedin__kicker,
    .nav__linkedin:hover svg { color: var(--accent-700); }

    .nav__cta {
      padding: var(--s-2) var(--s-4);
      border-radius: var(--r-pill);
      background: var(--accent-500); color: var(--paper-10);
      font-size: 13px; font-weight: 500; white-space: nowrap;
      transition: background 120ms ease, transform 120ms ease;
    }
    .nav__cta:hover { background: var(--accent-600); transform: translateY(-1px); }

    .nav__hamburger {
      display: flex; align-items: center; justify-content: center;
      width: 44px; height: 44px;
      border: none; background: none; cursor: pointer;
      color: var(--ink-700); font-size: 22px; padding: 0;
    }
    @media (min-width: 880px) { .nav__hamburger { display: none; } }
    .nav__hamburger::before { content: "\2630"; line-height: 1; }
    .nav__hamburger[aria-expanded="true"]::before { content: "\2715"; }

    .nav__panel {
      display: none;
      position: absolute; top: var(--topbar-h); left: 0; right: 0;
      background: rgba(250,251,250,0.97);
      backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
      border-bottom: var(--hairline);
      padding: var(--s-5);
      z-index: 89;
    }
    .nav__panel.is-open { display: flex; flex-direction: column; gap: var(--s-3); }
    @media (min-width: 880px) { .nav__panel { display: none !important; } }
    .nav__panel a {
      padding: var(--s-3) 0; font-size: 16px; color: var(--ink-700);
      border-bottom: var(--hairline);
    }
    .nav__panel a:last-child { border-bottom: none; }

    /* ERLEDIGT-Bar */
    .erledigt-bar { background: var(--paper-20); border-bottom: var(--hairline); font-size: 12px; font-family: var(--font-mono); }
    .erledigt-bar__row { max-width: 1240px; margin: 0 auto; padding: var(--s-2) var(--s-5); display: flex; align-items: center; justify-content: center; gap: var(--s-3); color: var(--ink-700); flex-wrap: wrap; letter-spacing: 0.04em; }
    .erledigt-bar a { color: var(--ink-700); transition: color 120ms ease; }
    .erledigt-bar a:hover { color: var(--accent-600); }
    .erledigt-bar .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); display: inline-block; margin-right: var(--s-2); }
    .erledigt-bar .sep { color: var(--ink-300); }
    .erledigt-bar a.is-active { color: var(--ink-900); font-weight: 600; }

    /* ─── Memorandum Layout ───────────────────────────────────── */
    .memo {
      max-width: 680px; margin: 0 auto;
      padding: var(--s-9) var(--s-5) var(--s-10);
    }

    /* Memo-Header (oben, klein, Mono) */
    .memo-meta {
      display: flex; justify-content: space-between; align-items: baseline;
      padding-bottom: var(--s-5); margin-bottom: var(--s-9);
      border-bottom: var(--hairline);
      font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em;
      text-transform: uppercase; color: var(--ink-500);
      gap: var(--s-4); flex-wrap: wrap;
    }
    .memo-meta__label { color: var(--accent-600); font-weight: 600; }
    .memo-meta__center { color: var(--ink-700); }
    .memo-meta__right { color: var(--ink-500); }
    .memo-meta time { color: inherit; }

    /* Memo-Titel */
    .memo h1 {
      font-family: var(--font-sans);
      font-size: clamp(28px, 4vw, 38px);
      line-height: 1.15; font-weight: 600; letter-spacing: -0.02em;
      color: var(--ink-900);
      margin: 0 0 var(--s-5);
      text-wrap: balance;
      max-width: 28ch;
    }
    .memo__lede {
      font-family: var(--font-serif); font-style:normal; font-weight: 400;
      font-size: clamp(20px, 2.4vw, 24px); line-height: 1.45;
      color: var(--ink-700);
      max-width: 50ch;
      margin: 0 0 var(--s-9);
    }

    /* Memo-Sektionen */
    .memo-section {
      margin-bottom: var(--s-8);
    }
    .memo-section__num {
      display: block;
      font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em;
      text-transform: uppercase; color: var(--ink-400);
      margin-bottom: var(--s-3);
    }
    .memo-section h2 {
      font-family: var(--font-sans);
      font-size: clamp(22px, 2.8vw, 26px);
      line-height: 1.25; font-weight: 600; letter-spacing: -0.015em;
      color: var(--ink-900);
      margin: 0 0 var(--s-5);
      text-wrap: balance;
    }
    .memo-section p {
      margin: 0 0 var(--s-5);
      color: var(--ink-800);
    }
    .memo-section p:last-child { margin-bottom: 0; }
    .memo-section strong { color: var(--ink-900); font-weight: 600; }

    /* Memo-Anker (Anhang) */
    .memo-anchors {
      margin-top: var(--s-9); padding-top: var(--s-7);
      border-top: var(--hairline);
    }
    .memo-anchors h3 {
      font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.14em;
      text-transform: uppercase; color: var(--ink-500); font-weight: 600;
      margin: 0 0 var(--s-5);
    }
    .memo-anchors ul {
      list-style: none; margin: 0; padding: 0;
      display: flex; flex-direction: column; gap: var(--s-3);
    }
    .memo-anchors li {
      font-size: 15px; line-height: 1.55; color: var(--ink-700);
      padding-left: var(--s-4);
      border-left: 2px solid var(--accent-500);
    }
    .memo-anchors li strong { color: var(--ink-900); font-weight: 600; font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.02em; }
    .memo-anchors li .note { display: block; color: var(--ink-500); font-size: 14px; margin-top: 2px; }

    /* Memo-Signoff */
    .memo-signoff {
      margin-top: var(--s-9); padding-top: var(--s-7);
      border-top: var(--hairline);
      display: flex; flex-direction: column; gap: var(--s-1);
    }
    .memo-signoff__name {
      font-family: var(--font-serif); font-style:normal;
      font-size: 22px; color: var(--ink-900);
    }
    .memo-signoff__role {
      font-size: 14px; color: var(--ink-700);
    }
    .memo-signoff__address {
      font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em;
      color: var(--ink-500); margin-top: var(--s-2);
    }

    /* Related (am Schluss) */
    .memo-related {
      margin-top: var(--s-9); padding-top: var(--s-7);
      border-top: var(--hairline);
    }
    .memo-related h3 {
      font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.14em;
      text-transform: uppercase; color: var(--ink-500); font-weight: 600;
      margin: 0 0 var(--s-4);
    }
    .memo-related ul {
      list-style: none; margin: 0; padding: 0;
      display: flex; flex-direction: column; gap: var(--s-3);
    }
    .memo-related a {
      font-size: 16px; color: var(--ink-800); transition: color 120ms ease;
      display: inline-flex; align-items: baseline; gap: var(--s-2);
    }
    .memo-related a:hover { color: var(--accent-600); }
    .memo-related a::before { content: "→"; color: var(--ink-300); }

    /* ─── Footer (Skribe-Standard, reduziert) ─────────────────── */
    footer { background: var(--paper-20); border-top: var(--hairline); padding: var(--s-9) 0 var(--s-7); margin-top: var(--s-10); }
    .foot__row { max-width: 1240px; margin: 0 auto; padding: 0 var(--s-5); display: grid; grid-template-columns: 1fr; gap: var(--s-7); }
    @media (min-width: 880px) { .foot__row { grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--s-7); } }
    .foot__brand .tag { font-size: 14px; color: var(--ink-700); margin: 0 0 var(--s-4); max-width: 32ch; }
    .foot__brand .contact { display: flex; flex-direction: column; gap: 2px; font-family: var(--font-mono); font-size: 13px; color: var(--ink-700); }
    .foot__col h3 { font-size: 13px; font-weight: 600; color: var(--ink-900); margin: 0 0 var(--s-3); text-transform: uppercase; letter-spacing: 0.04em; font-family: var(--font-mono); }
    .foot__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s-2); }
    .foot__col a { font-size: 14px; color: var(--ink-700); transition: color 120ms ease; }
    .foot__col a:hover { color: var(--accent-600); }
    .foot__meta { max-width: 1240px; margin: var(--s-7) auto 0; padding: var(--s-5) var(--s-5) 0; border-top: var(--hairline); font-family: var(--font-mono); font-size: 12px; color: var(--ink-500); letter-spacing: 0.04em; display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--s-3); }
    .foot__meta a { color: var(--ink-500); }
    .foot__meta a:hover { color: var(--accent-600); }