:root{
    --paper:#fafbfc;
    --ink:#0a0e14;
    --ink-2:#5a6470;
    --ink-3:#8a929c;
    --rule:#e6e9ee;
    --rule-2:#dde1e7;
    --accent:oklch(56% 0.18 255);    /* serious technical blue */
    --accent-soft:oklch(56% 0.18 255 / .08);
    --mint:oklch(78% 0.10 175);       /* secondary, used sparingly */
    --mint-soft:oklch(94% 0.04 175);
    --card:#ffffff;
    --gutter:24px;
    --btn-radius:8px;   /* einheitlicher Button-Radius (wie Navigations-Tabs) */
  }
  *{box-sizing:border-box}
  html,body{margin:0;background:var(--paper);color:var(--ink);
    font-family:"Inter",ui-sans-serif,system-ui,sans-serif;font-weight:400;
    -webkit-font-smoothing:antialiased;font-size:15px;line-height:1.5;
    letter-spacing:-.005em;min-height:100%;}
  html{scroll-behavior:smooth}
  body::before{
    content:"";position:fixed;inset:-30%;z-index:-1;pointer-events:none;
    background:
      radial-gradient(60% 60% at 18% 22%, oklch(92% 0.04 220 / .55) 0%, transparent 60%),
      radial-gradient(50% 60% at 84% 78%, oklch(94% 0.04 175 / .5) 0%, transparent 65%),
      radial-gradient(70% 70% at 50% 110%, oklch(95% 0.025 240 / .5) 0%, transparent 70%);
    opacity:.5;filter:blur(48px);
    animation:drift 32s ease-in-out infinite alternate;
  }
  @keyframes drift{
    0%{transform:translate(0,0) rotate(0deg)}
    100%{transform:translate(2%,-2%) rotate(2deg)}
  }
  .mono{font-family:"Inter",sans-serif;font-weight:400;letter-spacing:0}
  em.acc{font-style:normal;color:var(--accent);font-weight:500}
  b.acc{color:var(--accent)}

  .stage{min-height:100vh;display:flex;flex-direction:column}

  /* HEADER */
  header{display:grid;grid-template-columns:1fr auto 1fr;column-gap:var(--gutter);
    padding:18px max(28px, calc((100% - 1600px) / 2 + 28px));border-bottom:1px solid var(--rule);align-items:center;flex:0 0 auto;
    background:rgba(250,251,252,.86);backdrop-filter:blur(8px);position:sticky;top:0;z-index:10}
  .h-id{display:flex;align-items:center;gap:10px}
  .h-id .dot.orb{
    width:1.125rem;height:1.125rem;        /* 18×18 — заметнее, чем 7px */
    background-image:
      radial-gradient(circle at 35% 28%, rgba(255,255,255,.55) 0%, rgba(255,255,255,.1) 28%, transparent 55%),
      conic-gradient(from 220deg at 50% 50%,
        oklch(78% 0.16 230) 0deg,
        oklch(56% 0.18 255) 90deg,
        oklch(38% 0.06 175) 180deg,
        oklch(72% 0.18 165) 270deg,
        oklch(78% 0.16 230) 360deg);
    box-shadow:none;                       /* убираем старый glow — есть свой ::after */
  }
  .h-id .nm{font-weight:500;font-size:14px;letter-spacing:-.012em}
  .h-id .role{color:var(--ink-2);font-size:12px;margin-left:6px;padding-left:10px;border-left:1px solid var(--rule-2)}
  .h-contact{appearance:none;-webkit-appearance:none;font:inherit;font-family:"Inter",sans-serif;font-size:13px;font-weight:500;letter-spacing:-.005em;color:#fff;background:var(--accent);border:1px solid var(--accent);padding:6px 14px;border-radius:var(--btn-radius);cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .15s ease,box-shadow .18s ease}
  .h-contact:hover{background:oklch(50% 0.19 255);border-color:oklch(50% 0.19 255);transform:translateY(-1px);box-shadow:0 8px 20px oklch(56% 0.18 255 / .28)}
  .h-burger{display:none}
  body[data-tab="kontakt"] .h-contact{background:oklch(50% 0.19 255);border-color:oklch(50% 0.19 255);color:#fff}
  .h-tabs{display:flex;gap:2px;background:#fff;border:1px solid var(--rule);border-radius:9px;padding:3px}
  .h-tabs button{appearance:none;background:transparent;border:0;padding:7px 14px;cursor:pointer;
    font:inherit;color:var(--ink-2);font-size:14px;border-radius:6px;transition:.15s;font-weight:500;letter-spacing:-.005em;text-transform:none}
  .h-tabs button:hover{color:var(--ink)}
  .h-tabs button.on{color:#fff;background:var(--ink)}
  .h-tabs button .nr{font-family:"Inter",sans-serif;font-size:11px;margin-right:6px;opacity:.55}
  .h-meta{justify-self:end;display:flex;gap:18px;font-size:12px;color:var(--ink-2);align-items:center}
  .h-meta .live{color:var(--ink);font-weight:500;display:flex;align-items:center;gap:8px;padding:5px 10px;background:var(--mint-soft);border-radius:99px;font-size:12px}
  .h-meta .live::before{content:"";width:6px;height:6px;border-radius:50%;background:oklch(60% 0.15 165);box-shadow:0 0 0 3px oklch(60% 0.15 165 / .2)}

  /* MAIN */
  main{flex:1 1 auto;display:block;position:relative}
  .panel{display:none;animation:panelIn .25s ease}
  .panel.on{display:block}
  @keyframes panelIn{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}

  /* ─────── 01 START · bento ─────── */
  .bento{padding:14px 20px 28px;display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(180px,auto);gap:24px;min-height:calc(100vh - 4.75rem);max-width:1600px;width:100%;margin:0 auto}
  .tile{position:relative;border-radius:20px;padding:30px 32px;display:flex;flex-direction:column;gap:16px;
    text-decoration:none;color:inherit;overflow:hidden;border:1px solid var(--rule);background:#fff;
    transition:transform .55s cubic-bezier(.22,.61,.36,1), box-shadow .55s cubic-bezier(.22,.61,.36,1), border-color .4s ease}
  a.tile:hover{transform:translateY(-4px);box-shadow:0 22px 50px -18px rgba(10,14,20,.16);border-color:var(--rule-2)}
  .t-werke:hover{transform:translateY(-4px);box-shadow:0 30px 70px -30px rgba(0,0,0,.55);border-color:#2b3346}
  .tile .t-meta{display:flex;justify-content:space-between;align-items:center;font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
  .tile .t-meta .arr{font-family:"Inter",sans-serif;font-size:18px;color:var(--ink-2);letter-spacing:0}
  .tile:hover .t-meta .arr{color:var(--accent)}
  .tile .t-meta .avail-d{color:var(--accent);font-weight:500}
  .tile h3{font-family:"Instrument Serif",serif;font-weight:400;font-size:34px;line-height:1.05;letter-spacing:-.012em;margin:0;color:var(--ink)}
  .tile h3 em{font-style:italic}
  .tile .go{margin-top:auto;font-family:"Inter",sans-serif;font-size:14px;letter-spacing:.03em;color:var(--ink-2)}
  a.tile:hover .go{color:var(--accent)}

  /* Kachel klickbar (Position für innere Elemente) */
  a.tile{position:relative}

  /* Projekte-Block als Ganzes klickbar (öffnet Passwort-Popup) */
  .t-werke.clickable{cursor:pointer}
  .t-werke.clickable .wcase{cursor:pointer}
  .t-werke.clickable:focus-visible{outline:2px solid oklch(78% 0.16 230 / .6);outline-offset:3px}

  /* ─── Stimmen-Leiste (Start, hell) ─── */
  .hero-voices{max-width:1600px;margin:0 auto;padding:20px 20px 72px;width:100%}
  .hv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;border-top:1px solid var(--rule);padding-top:38px;margin-bottom:32px}
  .hv-title{display:flex;flex-direction:column;gap:8px}
  .hv-lab{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
  .hv-head h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:34px;line-height:1;letter-spacing:-.014em;color:var(--ink);margin:0}
  .hv-head h2 em{font-style:italic;color:var(--accent)}
  .hv-src{margin-left:auto;font-family:"Inter",sans-serif;font-size:12px;color:var(--ink-3);letter-spacing:-.005em}
  .hv-marquee{overflow:hidden;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);
    -webkit-mask:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
  .hv-track{display:flex;gap:18px;width:max-content;padding:0 20px}
  @media (prefers-reduced-motion: no-preference){ .hv-track{animation:hvMarq 55s linear infinite} }
  .hv-marquee:hover .hv-track,.hv-marquee:focus-within .hv-track{animation-play-state:paused}
  @keyframes hvMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .hv-card{flex:0 0 404px;margin:0;background:#fff;border:1px solid var(--rule);border-radius:18px;padding:30px 32px;display:flex;flex-direction:column;gap:20px;box-shadow:0 1px 2px rgba(10,14,20,.03)}
  .hv-card .nr{font-family:"Inter",sans-serif;font-size:12px;color:var(--accent);letter-spacing:.03em}
  .hv-card p{margin:0;font-size:14px;line-height:1.68;letter-spacing:-.005em;color:var(--ink-2)}
  .hv-card p::before{content:"„ ";color:var(--accent);font-weight:500}
  .hv-card .by{font-size:14px;color:var(--ink-3);font-family:"Inter",sans-serif;margin-top:auto;line-height:1.5}
  .hv-card .by b{color:var(--ink);font-family:"Inter",sans-serif;font-weight:500;font-size:14px;letter-spacing:-.005em;display:block;margin-bottom:1px}
  @media (prefers-reduced-motion: reduce){
    .hv-marquee{overflow-x:auto;-webkit-mask:none;mask:none}
    .hv-track{animation:none}
  }

  /* TILE 1 — positioning (dark, big) */
  .t-pos{grid-column:1/5;grid-row:1/3;background:#08111e;color:#e9edf2;border-color:#1c2230;padding:30px 32px;isolation:isolate}
  .t-pos > *:not(.pglow){position:relative;z-index:1}

  /* Bold Cyan Spotlight — single radial source from top-right corner */
  .pglow{
    position:absolute; inset:0; z-index:0;
    border-radius:18px; overflow:hidden;
    pointer-events:none;
  }
  .pglow::before{
    content:""; position:absolute; inset:0;
    background: radial-gradient(
      80% 90% at 100% 0%,
      oklch(55% 0.20 235 / .55) 0%,
      oklch(30% 0.12 230 / .15) 40%,
      transparent 75%
    );
    animation: pglow-breathe 14s ease-in-out infinite alternate;
    will-change: opacity, transform;
  }
  @keyframes pglow-breathe{
    0%   { opacity:.5;  transform: translate(0, 0) scale(1) }
    100% { opacity:.66; transform: translate(-2%, 2%) scale(1.05) }
  }
  @media (prefers-reduced-motion: reduce){
    .pglow::before{ animation: none }
  }
  .t-pos .t-meta{color:#7d8694}
  .t-pos h1{font-family:"Instrument Serif",serif;font-weight:400;font-size:clamp(44px,4.4vw,68px);line-height:1.02;letter-spacing:-.018em;margin:14px 0 0;color:#fff;text-wrap:balance}
  .t-pos h1 em{font-style:italic;color:oklch(78% 0.16 230);font-weight:400}
  .pos-lede{font-size:14px;font-weight:400;line-height:1.7;color:#9aa3b3;max-width:46ch;margin:0}
  .pos-lede em.acc{color:oklch(78% 0.16 230);font-style:normal;font-weight:500}
  .pos-id{display:flex;align-items:center;gap:14px;padding-top:14px;border-top:1px solid #1c2230}
  .pos-id .av{width:48px;height:48px;border-radius:50%;background:linear-gradient(160deg,#cdd5e0,#7d8694);display:grid;place-items:center;font-family:"Instrument Serif",serif;font-size:18px;font-style:italic;color:#0a0e14}
  .pos-id .nm{font-size:16px;font-weight:600;color:#fff;letter-spacing:-.005em}
  .pos-id .role{font-size:14px;color:#7d8694;margin-top:2px}
  .pos-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:auto}
  .pos-stats .it{display:flex;flex-direction:column;gap:4px}
  .pos-stats .v{font-family:"Instrument Serif",serif;font-size:40px;line-height:1;color:#fff;letter-spacing:-.02em}
  .pos-stats .k{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.15em;text-transform:uppercase}

  /* ── Positionierung · Mensch+KI Workflow + CTA (fills the lower area) ── */
  .pos-team{margin-top:auto;display:flex;flex-direction:column;gap:20px;padding-top:24px;border-top:1px solid #1c2230}
  .pos-team-lab{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:#7d8694}
  .pos-team-lab span{color:oklch(78% 0.16 230);font-weight:500}
  .pos-team-chain{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .pt-node{display:flex;flex-direction:column;gap:4px;flex:0 0 auto}
  .pt-node b{font-size:16px;font-weight:600;color:#fff;letter-spacing:-.01em}
  .pt-node small{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.15em;text-transform:uppercase}
  .pt-link{flex:1 1 20px;min-width:16px;height:1px;align-self:flex-start;margin-top:9px;
    background:linear-gradient(90deg,#1c2230,oklch(78% 0.16 230 / .55),#1c2230)}
  .pos-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
  .pos-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:var(--btn-radius);
    background:#1a2130;color:#eef2f7;font-weight:400;font-size:14px;letter-spacing:-.01em;
    text-decoration:none;transition:background .18s ease, color .18s ease, transform .15s ease, box-shadow .18s ease}
  .pos-btn:hover{background:oklch(78% 0.16 230);color:#06121f;transform:translateY(-1px);box-shadow:0 10px 28px oklch(78% 0.16 230 / .32)}
  .pos-cta-note{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.03em}
  .pos-cta-link{font-family:"Inter",sans-serif;font-size:12px;color:#cdd5e0;text-decoration:none;
    letter-spacing:.03em;padding:4px 0;border-bottom:1px solid #1c2230;transition:color .15s ease, border-color .15s ease}
  .pos-cta-link:hover{color:oklch(78% 0.16 230);border-color:oklch(78% 0.16 230 / .5)}
  /* in den schmalen Portrait-Varianten Kette untereinander statt nebeneinander */
  .t-pos[data-poslayout="portrait-left"] .pt-link,
  .t-pos[data-poslayout="portrait-right"] .pt-link{display:none}
  .t-pos[data-poslayout="portrait-left"] .pos-team-chain,
  .t-pos[data-poslayout="portrait-right"] .pos-team-chain{gap:14px 22px}

  /* ── Positionierung · layout variants (Tweaks) ─────────────────
     Default keeps the wrapper transparent (display:contents) so the
     original layout is byte-for-byte unchanged. Variants opt in via
     [data-poslayout]. */
  .t-pos .pos-main{display:contents}
  .t-pos .pos-main > *{position:relative;z-index:1}
  .t-pos .t-meta span{white-space:nowrap}
  .pos-id .av-photo{overflow:hidden}
  .pos-id .av-photo img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
  .t-pos .pos-portrait{display:none;position:relative;border-radius:16px;overflow:hidden;
    background:rgba(255,255,255,.03);border:1.5px dashed rgba(255,255,255,.16);
    align-items:center;justify-content:center;color:rgba(220,228,238,.5);
    font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase}
  .t-pos .pos-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

  /* A · portrait right */
  .t-pos[data-poslayout="portrait-right"]{display:grid;grid-template-columns:1.32fr .68fr;gap:36px;align-items:stretch}
  .t-pos[data-poslayout="portrait-right"] .pos-main{display:flex;flex-direction:column;gap:14px;justify-content:center;min-width:0}
  .t-pos[data-poslayout="portrait-right"] .pos-portrait{display:flex}

  /* B · portrait left */
  .t-pos[data-poslayout="portrait-left"]{display:grid;grid-template-columns:.68fr 1.32fr;gap:36px;align-items:stretch}
  .t-pos[data-poslayout="portrait-left"] .pos-main{display:flex;flex-direction:column;gap:14px;justify-content:center;min-width:0}
  .t-pos[data-poslayout="portrait-left"] .pos-portrait{display:flex;order:-1}

  /* C · centered (no photo restructure — wrapper stays contents) */
  .t-pos[data-poslayout="centered"]{align-items:center;justify-content:center}
  .t-pos[data-poslayout="centered"] .pos-main{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;max-width:640px}
  .t-pos[data-poslayout="centered"] .t-meta,
  .t-pos[data-poslayout="centered"] h1{width:100%}
  .t-pos[data-poslayout="centered"] .pos-lede{max-width:54ch}
  .t-pos[data-poslayout="centered"] .pos-id{flex-direction:column;gap:6px;border-top:0;padding-top:0}
  .t-pos[data-poslayout="centered"] .pos-id .role{margin-top:0}
  .t-pos[data-poslayout="centered"] .pos-portrait{display:flex;width:116px;height:116px;border-radius:50%;order:-1;flex:none}

  /* D · ohne Karte (borderless — frame removed, dark stays for legibility) */
  .t-pos[data-poslayout="borderless"]{border-color:transparent;box-shadow:none;border-radius:0;padding-left:6px;padding-right:6px}
  .t-pos[data-poslayout="borderless"] .pglow{display:none}

  /* TILE 2 — Über (top right) */
  .t-ueber{grid-column:5/7;grid-row:1/3}
  .jobs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;flex:1}
  .jobs li{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:9px 0;border-bottom:1px solid var(--rule);align-items:baseline;font-size:14px;position:relative}
  .jobs li:last-child{border-bottom:0}
  .jobs li b{font-weight:600;color:var(--ink);letter-spacing:-.005em}
  .jobs li small{grid-column:1/3;font-family:"Inter",sans-serif;font-size:11px;color:var(--ink-3);letter-spacing:.03em}
  .jobs li .now{color:oklch(60% 0.15 165);font-size:11px;align-self:start;margin-top:6px}

  /* TILE 3 — Werke (dark mid) */
  .t-werke{grid-column:1/4;grid-row:3/5;background:#06090f;color:#e9edf2;border-color:#141a26}
  .t-werke .t-meta.light{color:#7d8694}
  .t-werke h3.light{color:#fff;font-size:37px}
  .t-werke .go.light{color:#7d8694}
  .t-werke:hover .go.light{color:oklch(78% 0.16 230)}
  .wstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:1}
  .wphoto{border-radius:12px;overflow:hidden;position:relative;border:1px solid #1c2230;min-height:130px}
  .wphoto.p1{background:linear-gradient(160deg,#a8a3e8 0%,#9690d8 100%)}
  .wphoto.p2{background:linear-gradient(160deg,#c5b8e8 0%,#a89ad8 100%)}
  .wphoto.p3{background:linear-gradient(160deg,#3a2a1f 0%,#2a1f15 100%)}
  .wphoto.p4{background:linear-gradient(160deg,#4a4548 0%,#2e2a2c 100%)}
  .wphoto.p5{background:linear-gradient(160deg,#3e372e 0%,#2a2622 100%)}
  .wphoto.p6{background:linear-gradient(160deg,#a8835a 0%,#7d6240 100%)}
  .wphoto.more{background:#0a0e14;border-style:dashed;border-color:#2a3142;display:grid;place-items:center;font-family:"Inter",sans-serif;font-size:14px;font-weight:500;color:oklch(78% 0.16 230);letter-spacing:-.005em}

  /* Editorial-list layout for .t-werke (alternative to .wstrip) */
  .wlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;flex:1}
  .wlist .wrow{
    display:grid;grid-template-columns:30px 1fr auto;
    align-items:center;gap:14px;
    padding:9px 0;border-bottom:1px solid #1c2230;
    transition:padding-left .15s ease;
  }
  .wlist .wrow:last-child{border-bottom:0}
  .wlist .wrow .n{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.03em}
  .wlist .wrow .ttl{min-width:0}
  .wlist .wrow .t{font-size:14px;color:#fff;font-weight:500;letter-spacing:-.005em;line-height:1.2;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
  .wlist .wrow .c{font-size:12px;color:#9aa3b3;letter-spacing:-.005em;line-height:1.3;margin-top:2px}
  .wlist .wrow .y{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.03em;text-align:right}
  .wlist .wrow.nda .t::after{
    content:"NDA";margin-left:8px;
    font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.03em;
    color:oklch(78% 0.16 230);border:1px solid oklch(78% 0.16 230 / .35);
    padding:1px 5px;border-radius:3px;vertical-align:2px;font-weight:400;
  }
  a.tile.t-werke:hover .wrow{padding-left:4px}

  /* Disciplines as full-width table (V4 · Asymmetric Spotlight, simplified) */
  .wdisc{
    list-style:none;margin:6px 0 0;padding:0;
    display:flex;flex-direction:column;
  }
  .wdisc li{
    display:grid;grid-template-columns:1fr auto;
    align-items:baseline;
    padding:10px 0;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:14px;
  }
  .wdisc li:first-child{border-top:0}
  .wdisc .n{color:#fff;font-weight:500;letter-spacing:-.005em}
  .wdisc .c{font-family:"Inter",sans-serif;font-size:11px;color:oklch(78% 0.16 230);letter-spacing:.03em}

  /* ── Studio · animated wireframe iso-cube ── */
  .studio{flex:1;display:flex;align-items:center;min-height:0}
  .studio-inner{position:relative;width:100%;height:100%;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:32px}

  .studio-wire{position:relative;width:100%;height:100%;min-height:0}
  .studio-wire svg{width:100%;height:100%;overflow:visible;transform:scale(.8)}
  /* flat background like the reference — no aurora glow */
  .t-werke .wglow{display:none}
  /* soft aura behind the wireframe */
  .studio-wire::before{
    content:none;
  }
  /* node pulse + active-layer breathing */
  @media (prefers-reduced-motion: no-preference){
    .studio-wire .nd circle{transform-box:fill-box;transform-origin:center;animation:stPulse 3.4s ease-in-out infinite}
    .studio-wire .nd circle:nth-child(2){animation-delay:.5s}
    .studio-wire .nd circle:nth-child(3){animation-delay:.9s}
    .studio-wire .nd circle:nth-child(4){animation-delay:1.3s}
    .studio-wire .nd circle:nth-child(5){animation-delay:1.7s}
    .studio-wire .nd circle:nth-child(6){animation-delay:2.1s}
    .studio-wire .ly1{animation:stGlow 4s ease-in-out infinite}
    .studio-wire .tOut{animation:stRun 9s linear infinite}
  }
  @media (prefers-reduced-motion: reduce){ .studio-wire .trace{display:none} }
  .studio-wire .trace{fill:none;stroke-linecap:round;stroke-dasharray:18 82;opacity:.8}
  @keyframes stPulse{0%,100%{opacity:.55;transform:scale(.82)}50%{opacity:1;transform:scale(1.12)}}
  @keyframes stGlow{0%,100%{opacity:.85}50%{opacity:1}}
  @keyframes stRun{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}

  /* faint blueprint grid behind the wireframe */
  .t-werke .studio-grid{position:absolute;inset:0;z-index:0;border-radius:18px;pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:40px 40px;
    -webkit-mask:radial-gradient(120% 100% at 30% 46%,#000 34%,transparent 80%);mask:radial-gradient(120% 100% at 30% 46%,#000 34%,transparent 80%)}
  .t-werke .t-meta .acc-eye{color:oklch(78% 0.16 230)}
  .t-werke .t-meta span{white-space:nowrap}

  /* service labels — flex column filling the rest of the tile width */
  .studio-svcs{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:26px;padding-left:18px}
  .studio-svc{position:relative}
  .studio-svc b{display:block;font-weight:500;font-size:16px;color:#fff;letter-spacing:-.005em;line-height:1.15}
  .studio-svc small{display:block;font-family:"Inter",sans-serif;font-size:11px;color:#828b9b;letter-spacing:.03em;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* connector line pointing back toward the cube */
  .svc-line{position:absolute;left:-54px;top:9px;width:42px;height:1.5px;background:linear-gradient(90deg,transparent,oklch(78% 0.16 230));transition:width .3s ease,left .3s ease,opacity .3s ease;opacity:.8}
  a.tile.t-werke:hover .svc-line{width:50px;left:-62px;opacity:1}

  .studio-foot{
    margin-top:auto;
    display:flex;flex-direction:row;justify-content:space-between;align-items:flex-end;gap:16px;
    padding-top:16px;border-top:1px solid rgba(255,255,255,.08);
  }
  .studio-foot .sf-lede{
    margin:0;
    font-size:16px;line-height:1.2;letter-spacing:-.01em;
    color:#eef1f6;font-weight:500;
  }
  .studio-foot .sf-lede em{font-style:normal;color:oklch(78% 0.16 230);font-weight:600}
  .studio-foot .sf-go{
    font-family:"Inter",sans-serif;font-size:14px;letter-spacing:.03em;
    color:#7d8694;white-space:nowrap;cursor:pointer;
    padding:5px 9px;margin:-5px -9px;border-radius:7px;transition:color .2s ease,background .2s ease;
  }
  .studio-foot .sf-go:hover{color:oklch(82% 0.14 230);background:oklch(78% 0.16 230 / .12)}
  .studio-foot .sf-go:focus-visible{outline:2px solid oklch(78% 0.16 230 / .6);outline-offset:2px;color:oklch(82% 0.14 230)}
  a.tile.t-werke:hover .studio-foot .sf-go{color:oklch(78% 0.16 230)}

  /* ── Studio tile · featured real cases ── */
  .t-werke .studio-wire{display:none}
  .t-werke .studio-inner{display:block}
  .t-werke .studio{align-items:center}
  .wcases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;align-content:center}
  .wcase{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;
    background:#0a0e16;border:1px solid #1c2230;text-decoration:none;color:inherit}
  .wc-thumb{position:relative;aspect-ratio:16/10;overflow:hidden;background:#0d1220;display:block}
  .wc-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
  .wc-thumb image-slot{display:block;width:100%;height:100%}
  .wc-body{display:flex;flex-direction:column;justify-content:flex-end;flex:1;gap:5px;padding:14px 15px 16px}
  .wc-ttl{font-weight:500;font-size:14px;color:#c3cad7;letter-spacing:-.005em;line-height:1.5;
    display:inline-flex;align-items:baseline;gap:6px;text-decoration:none}
  a.wc-ttl{transition:color .2s ease}
  a.wc-ttl:hover{color:oklch(83% 0.12 230)}
  .wc-arr{transition:transform .2s ease;color:#828b9b}
  .wcase:hover .wc-arr{transform:translateX(3px);color:oklch(83% 0.12 230)}
  .wc-res{font-size:14px;line-height:1.4;color:#9aa3b2;font-weight:400}
  .wc-meta{font-family:"Inter",sans-serif;font-size:11px;font-weight:500;color:#828b9b;letter-spacing:.15em;text-transform:uppercase;margin-top:auto;padding-top:8px}
  .wc-thumb{position:relative}
  .wc-meta.over{position:absolute;top:10px;left:10px;margin:0;z-index:2;font-size:11px;
    color:#dfe4ec;padding:5px 10px;border-radius:99px;
    background:rgba(10,14,22,.55);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px)}
  @media (max-width:720px){ .wcases{grid-template-columns:1fr} }

  .wbottom{
    margin-top:auto;
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    padding-top:14px;
  }
  .wbottom .wfacts{
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;
    font-family:"Inter",sans-serif;font-size:11px;
    color:#9aa3b3;letter-spacing:.03em;
  }
  .wbottom .wfact sup{
    font-family:"Inter",sans-serif;font-size:11px;color:oklch(78% 0.16 230);
    top:-.45em;margin-left:1px;letter-spacing:0;
  }
  .wbottom .wsep{color:#3a455a}
  .wbottom .nda-pill{
    color:oklch(78% 0.16 230);
    padding:6px 12px;border:1px solid oklch(78% 0.16 230 / .45);
    border-radius:99px;
    font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.03em;
  }
  .whint{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:start;margin-top:6px}
  .whint-num{display:flex;align-items:baseline;gap:10px;padding-right:24px}
  .whint-num .big{
    font-family:"Instrument Serif",serif;font-weight:400;
    font-size:72px;line-height:1;letter-spacing:-.03em;color:#fff;
  }
  .whint-num .big sup{
    font-family:"Inter",sans-serif;font-weight:400;
    font-size:24px;color:oklch(78% 0.16 230);
    letter-spacing:0;margin-left:2px;top:-.55em;
  }
  .whint-num .sub{
    font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;
    color:#7d8694;text-transform:uppercase;line-height:1.5;
  }
  .whint-chips{display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start;padding-top:4px}
  .whint-chips .chip{
    display:inline-flex;align-items:baseline;gap:6px;
    padding:6px 11px;border:0;border-radius:99px;
    background:rgba(255,255,255,.05);
    font-size:12px;color:#cdd5e0;letter-spacing:-.005em;
    transition:background .15s,color .15s;
  }
  .whint-chips .chip b{font-weight:500;color:#fff;letter-spacing:-.005em}
  .whint-chips .chip i{
    font-style:normal;font-family:"Inter",sans-serif;
    font-size:11px;color:#7d8694;letter-spacing:.03em;
  }
  a.tile.t-werke:hover .whint-chips .chip{
    background:oklch(78% 0.16 230 / .14);
  }

  .whint-foot{
    margin-top:auto;
    display:flex;align-items:center;gap:10px;
    padding-top:14px;
    font-family:"Inter",sans-serif;font-size:11px;
    color:#9aa3b3;letter-spacing:.03em;
  }
  .whint-foot .wsep{color:#3a455a}
  .whint-foot .nda-pill{
    color:oklch(78% 0.16 230);
    padding:2px 7px;border:1px solid oklch(78% 0.16 230 / .45);
    border-radius:99px;font-size:11px;letter-spacing:.03em;
    margin-left:auto;
  }

  /* Button-style CTA inside .t-werke */
  .wcta{ margin-top:14px }
  .wcta-btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:11px 18px 11px 20px;
    background: oklch(78% 0.16 230);
    color:#0a0e14 !important;
    border-radius:99px;
    font-family:"Inter",sans-serif;
    font-size:13.5px; font-weight:500; letter-spacing:-.005em;
    text-transform:none;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
    box-shadow:
      0 8px 20px -6px oklch(78% 0.16 230 / .35),
      0 0 0 1px rgba(255,255,255,.08) inset;
    will-change: transform;
  }
  .wcta-btn .wcta-arr{
    display:inline-block;
    font-family:"Inter",sans-serif; font-size:15px; line-height:1;
    transition: transform .2s ease;
  }
  a.tile.t-werke:hover .wcta-btn{
    background: oklch(84% 0.14 225);
    transform: translateY(-1px);
    box-shadow:
      0 12px 26px -6px oklch(78% 0.16 230 / .5),
      0 0 0 1px rgba(255,255,255,.12) inset;
  }
  a.tile.t-werke:hover .wcta-btn .wcta-arr{ transform: translateX(3px) }

  /* Background mesh-gradient — flowing aurora in site colors (cyan + mint + deep navy) */
  .t-werke{ isolation:isolate }
  .t-werke > *:not(.wglow):not(.studio-grid){ position:relative; z-index:1 }
  .wglow{
    position:absolute; inset:0; z-index:0;
    border-radius:18px; overflow:hidden;
    pointer-events:none;
  }
  .wglow::before,
  .wglow::after{
    content:""; position:absolute; inset:-40%;
    border-radius:50%;
    filter: blur(70px);
    will-change: transform, opacity;
  }
  .wglow::before{
    background:
      radial-gradient(50% 50% at 50% 50%, oklch(58% 0.18 235 / .55) 0%, oklch(50% 0.15 220 / .15) 50%, transparent 75%);
    animation: wglow-a 22s ease-in-out infinite alternate;
  }
  .wglow::after{
    background:
      radial-gradient(50% 50% at 50% 50%, oklch(70% 0.15 220 / .42) 0%, oklch(48% 0.18 250 / .14) 55%, transparent 75%);
    animation: wglow-b 28s ease-in-out infinite alternate;
  }
  @keyframes wglow-a{
    0%   { transform: translate(-12%, -10%) scale(1);   opacity:.9 }
    50%  { transform: translate( 14%,  8%) scale(1.15); opacity:1 }
    100% { transform: translate(  6%, -4%) scale(1.05); opacity:.85 }
  }
  @keyframes wglow-b{
    0%   { transform: translate( 10%,  12%) scale(1.1); opacity:.7 }
    50%  { transform: translate(-14%,  -6%) scale(1);   opacity:.95 }
    100% { transform: translate(  4%,  10%) scale(1.2); opacity:.75 }
  }
  a.tile.t-werke:hover .wglow::before{ animation-duration: 16s }
  a.tile.t-werke:hover .wglow::after { animation-duration: 20s }

  @media (prefers-reduced-motion: reduce){
    .wglow::before, .wglow::after{ animation: none }
  }

  /* TILE 4 — Lab (now fills the full right column of the lower row) */
  .t-lab{grid-column:4/7;grid-row:3/5}
  .t-lab .sync{color:oklch(60% 0.15 165)}
  .notes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;flex:1}
  .notes li{display:grid;grid-template-columns:60px 1fr auto;gap:14px;align-items:baseline;padding:9px 0;border-bottom:1px dashed var(--rule);font-size:14px}
  .notes li:last-child{border-bottom:0}
  .notes .when{font-size:11px;color:var(--ink-3);letter-spacing:.03em}
  .notes .ttl{font-size:14px;color:var(--ink);font-weight:500;letter-spacing:-.005em;line-height:1.35}
  .notes .tag{font-family:"Inter",sans-serif;font-size:11px;color:var(--ink-3);background:rgba(0,0,0,.05);padding:2px 7px;border-radius:99px}

  /* TILE 5 — Kontakt */
  .t-kontakt{grid-column:4/7;grid-row:4/5;background:linear-gradient(160deg,#fff,#f1f5f9)}
  .ch-row{display:flex;justify-content:space-between;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--rule);font-size:14px}
  .ch-row:last-of-type{border-bottom:0}
  .ch-row span:first-child{font-weight:500;color:var(--ink)}
  .ch-row .mono{font-size:12px;color:var(--ink-2);letter-spacing:.03em}

  /* legacy split (unused now) */
  .start{padding:0;display:grid;grid-template-columns:1fr 1fr;min-height:100%;gap:0}
  .start::before{display:none}

  /* LEFT — dark positioning */
  .s-left{position:relative;background:#0a0e14;color:#e9edf2;padding:44px 48px 36px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;min-height:100%}
  .s-left::before{content:"";position:absolute;inset:-30%;pointer-events:none;
    background:radial-gradient(60% 50% at 20% 20%, oklch(40% 0.10 220 / .55) 0%, transparent 60%),
               radial-gradient(50% 60% at 80% 90%, oklch(45% 0.08 175 / .35) 0%, transparent 65%);
    filter:blur(20px)}
  .s-left > *{position:relative;z-index:1}

  .avail{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid #1f2638;border-radius:99px;font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;color:#cdd5e0;text-transform:uppercase;align-self:flex-start}
  .avail::before{content:"";width:7px;height:7px;border-radius:50%;background:oklch(72% 0.18 165);box-shadow:0 0 0 4px oklch(72% 0.18 165 / .2)}

  .s-left h1{font-family:"Instrument Serif","Times New Roman",serif;font-weight:400;
    font-size:clamp(48px,5.4vw,80px);line-height:1.02;letter-spacing:-.018em;margin:32px 0 20px;text-wrap:balance;color:#fff}
  .s-left h1 em{font-style:italic;color:oklch(78% 0.16 230);font-weight:400}

  .s-lede{font-family:"Inter",sans-serif;font-size:16.5px;line-height:1.55;color:#9aa3b3;max-width:38ch;margin:0 0 36px;letter-spacing:-.005em}

  .s-id{display:flex;align-items:center;gap:14px;margin-top:auto}
  .s-id .av{width:48px;height:48px;border-radius:50%;background:linear-gradient(160deg,#cdd5e0,#7d8694);display:grid;place-items:center;font-family:"Instrument Serif",serif;font-size:18px;font-style:italic;color:#0a0e14;letter-spacing:-.02em}
  .s-id .nm{font-size:15.5px;font-weight:600;color:#fff;letter-spacing:-.005em}
  .s-id .role{font-size:13.5px;color:#7d8694;margin-top:2px}

  .s-stats{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:24px;margin-top:32px;padding-top:24px;border-top:1px solid #1c2230}
  .s-stats .it{display:flex;flex-direction:column;gap:6px}
  .s-stats .v{font-family:"Instrument Serif",serif;font-weight:400;font-size:42px;line-height:1;letter-spacing:-.02em;color:#fff}
  .s-stats .k{font-family:"Inter",sans-serif;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#7d8694}
  .s-foot{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:#5a6470}
  .s-foot span:first-child::before{content:"// "}

  /* RIGHT — chat agent */
  .s-right{background:var(--paper);padding:44px 48px 28px;display:flex;flex-direction:column;min-height:100%;position:relative}
  .s-right .top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px}
  .s-right .top h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:clamp(34px,3.4vw,46px);line-height:1.05;letter-spacing:-.012em;margin:0;color:var(--ink);max-width:14ch}
  .s-right .top h2 em{font-style:italic;color:var(--accent)}
  .s-right .top .meta{text-align:right;font-family:"Inter",sans-serif;font-size:10.5px;color:var(--ink-3);letter-spacing:.03em;line-height:1.55}
  .s-right .top .meta b{color:var(--ink);font-weight:500;display:block;letter-spacing:.03em}

  .chat{flex:1;display:flex;flex-direction:column;gap:14px;padding:8px 0;overflow-y:auto;scrollbar-width:none}
  .chat::-webkit-scrollbar{display:none}
  .msg{max-width:78%;padding:14px 18px;border-radius:14px;font-size:15px;line-height:1.55;letter-spacing:-.005em}
  .msg.user{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:4px}
  .msg.bot{align-self:flex-start;background:#fff;border:1px solid var(--rule);color:var(--ink);border-bottom-left-radius:4px}
  .msg.bot .lab{display:flex;align-items:center;gap:8px;font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;font-weight:500}
  .msg.bot .lab::before{content:"";width:8px;height:8px;background:var(--accent);border-radius:2px}
  .msg.bot strong{font-weight:600}
  .msg.bot a{color:var(--accent);text-decoration:none;font-weight:500}
  .msg.bot a:hover{text-decoration:underline}
  .typing{align-self:flex-start;background:#fff;border:1px solid var(--rule);padding:14px 18px;border-radius:14px;border-bottom-left-radius:4px;display:flex;gap:5px}
  .typing span{width:6px;height:6px;border-radius:50%;background:var(--ink-3);animation:tp 1.2s infinite ease-in-out}
  .typing span:nth-child(2){animation-delay:.2s}
  .typing span:nth-child(3){animation-delay:.4s}
  @keyframes tp{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

  .composer{margin-top:18px;background:#fff;border:1px solid var(--rule);border-radius:14px;padding:14px 16px 12px;display:flex;flex-direction:column;gap:10px}
  .composer .row{display:flex;gap:10px;align-items:center}
  .composer input{flex:1;border:0;background:transparent;font:inherit;font-size:15px;color:var(--ink);outline:none;padding:4px 0;letter-spacing:-.005em}
  .composer input::placeholder{color:var(--ink-3)}
  .composer button.send{appearance:none;width:36px;height:36px;border:0;border-radius:var(--btn-radius);background:var(--ink);color:#fff;cursor:pointer;font-size:15px;display:grid;place-items:center}
  .composer button.send:hover{background:var(--accent)}
  .chips{display:flex;gap:8px;flex-wrap:wrap}
  .chip{appearance:none;border:1px solid var(--rule-2);background:transparent;border-radius:99px;padding:6px 12px;font:inherit;font-size:12px;color:var(--ink-2);cursor:pointer;letter-spacing:-.005em}
  .chip:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}

  /* ─────── 04 LAB — light, aligned to design system ─────── */
  .panel[data-p="lab"]{background:var(--paper);color:var(--ink)}
  .lab{padding:56px 56px 76px;max-width:1080px;margin:0 auto;display:flex;flex-direction:column;gap:44px;min-height:calc(100vh - 4.75rem)}
  .lab .lab-head{border-bottom:1px solid var(--rule);padding-bottom:24px}
  .lab .lab-head-main{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
  .lab .lab-lab{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
  .lab .lab-head h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:46px;letter-spacing:-.014em;line-height:1;color:var(--ink);margin:0}
  .lab .lab-head h2 em{font-style:italic;color:var(--accent)}
  .lab .lab-lede{font-family:"Inter",sans-serif;font-style:normal;font-size:16px;line-height:1.6;color:var(--ink-2);letter-spacing:-.005em;max-width:56ch;margin:4px 0 0}
  .lab-author{display:flex;align-items:center;gap:12px;margin-top:20px}
  .lab-author-photo{width:40px;height:40px;flex:none;border-radius:50%;overflow:hidden;display:block;border:1px solid var(--rule-2)}
  .lab-author-txt{display:flex;flex-direction:column;line-height:1.35}
  .lab-author-txt b{font-family:"Inter",sans-serif;font-weight:500;font-size:14px;color:var(--ink);letter-spacing:-.005em}
  .lab-author-txt span{font-family:"Inter",sans-serif;font-size:12px;color:var(--ink-3);letter-spacing:.03em}

  /* Themen-Chips zum Filtern */
  .lab-filter{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:-16px}
  .chip-filter{appearance:none;-webkit-appearance:none;font:inherit;font-family:"Inter",sans-serif;font-size:14px;letter-spacing:-.005em;color:var(--ink-2);background:transparent;border:1px solid var(--rule-2);padding:7px 15px;border-radius:99px;cursor:pointer;transition:background .2s var(--ease),color .2s ease,border-color .2s ease}
  .chip-filter:hover{border-color:var(--ink-3);color:var(--ink)}
  .chip-filter.on{background:var(--ink);border-color:var(--ink);color:#fff}

  /* Artikel-Karten */
  .lab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .acard{display:flex;flex-direction:column;gap:14px;padding:26px 26px 24px;border:1px solid var(--rule);border-radius:18px;background:var(--card);box-shadow:0 1px 2px rgba(10,14,20,.03);cursor:pointer;transition:transform .55s var(--ease),box-shadow .55s var(--ease),border-color .4s ease}
  .acard:hover{transform:translateY(-4px);box-shadow:0 22px 50px -18px rgba(10,14,20,.16);border-color:var(--rule-2)}
  .acard-top{display:flex;align-items:center;justify-content:flex-start;gap:12px}
  .acard-chips{display:flex;flex-wrap:wrap;gap:6px}
  .acard .chip,.art-top .chip{font-family:"Inter",sans-serif;font-size:11px;font-weight:400;letter-spacing:.03em;color:var(--ink-3);background:rgba(0,0,0,.05);border:0;padding:3px 10px;border-radius:99px;white-space:nowrap}
  .acard-date{font-family:"Inter",sans-serif;font-size:12px;color:var(--ink-3);letter-spacing:.03em;white-space:nowrap}
  .acard-head{display:flex;flex-direction:column;gap:7px}
  .acard h3{font-family:"Instrument Serif",serif;font-weight:400;font-size:24px;line-height:1.12;letter-spacing:-.012em;color:var(--ink);margin:0}
  .acard .acard-date{display:block}
  .acard p{margin:0;color:var(--ink-2);font-size:14px;line-height:1.7}
  .acard-go{font-family:"Inter",sans-serif;font-size:14px;letter-spacing:-.005em;color:var(--ink-3);display:inline-flex;align-items:center;white-space:nowrap}
  .acard-foot{margin-top:auto;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px}
  .acard-actions{display:flex;align-items:center;gap:16px}
  .acard-share{display:inline-flex;align-items:center;gap:3px;color:var(--ink-3);text-decoration:none;transition:color .2s ease}
  .acard-share:hover{color:#0A66C2}
  .acard-share .sh-arrow{opacity:.75}
  .acard-go .ln-arrow{margin-left:5px}
  .acard:hover .acard-go{color:var(--accent)}
  .acard:hover .acard-go .ln-arrow{transform:translateX(3px)}
  .acard[hidden]{display:none}

  /* Lese-Ansicht */
  .lab.reading .lab-head,
  .lab.reading .lab-filter,
  .lab.reading .lab-grid{display:none}
  .lab-article{max-width:680px;margin:0 auto;width:100%}
  .art-back{appearance:none;-webkit-appearance:none;background:transparent;border:0;font:inherit;font-family:"Inter",sans-serif;font-size:14px;letter-spacing:-.005em;color:var(--ink-3);display:inline-flex;align-items:center;gap:8px;cursor:pointer;padding:0;margin-bottom:36px;transition:color .2s ease}
  .art-back:hover{color:var(--accent)}
  .art-back .ln-arrow{width:1.05em;height:1.05em}
  .art-top{display:flex;align-items:center;gap:12px;margin-bottom:18px}
  .art-title{font-family:"Instrument Serif",serif;font-weight:400;font-size:44px;line-height:1.06;letter-spacing:-.018em;color:var(--ink);margin:0}
  .art-title em{font-style:italic;color:var(--accent)}
  .art-author{display:flex;align-items:center;gap:12px;margin:24px 0 0;padding-bottom:28px;border-bottom:1px solid var(--rule)}
  .art-body{margin-top:32px}
  .art-body p{font-size:17px;line-height:1.75;color:var(--ink);margin:0 0 22px;letter-spacing:-.005em}
  .art-outro{font-weight:500;margin-top:32px !important}
  .art-cta{margin:38px 0 0;padding:4px 0 4px 24px;border-left:2px solid var(--accent)}
  .art-cta-line{font-family:"Instrument Serif",serif;font-style:italic;font-size:24px;line-height:1.3;letter-spacing:-.012em;color:var(--ink);margin:0 0 18px !important}
  .art-cta-mail{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .art-cta-mail a{font-family:"Inter",sans-serif;font-size:16px;font-weight:500;color:var(--accent);text-decoration:none;letter-spacing:-.005em}
  .art-cta-mail a:hover{text-decoration:underline}
  .art-cta-copy{appearance:none;-webkit-appearance:none;font:inherit;font-family:"Inter",sans-serif;font-size:13px;letter-spacing:-.005em;color:var(--ink-2);background:transparent;border:1px solid var(--rule-2);padding:6px 13px;border-radius:99px;cursor:pointer;transition:background .2s var(--ease),color .2s ease,border-color .2s ease}
  .art-cta-copy:hover{border-color:var(--ink-3);color:var(--ink)}
  .art-cta-copy.done{background:var(--accent-soft);border-color:transparent;color:var(--accent)}
  .art-list{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:16px}
  .art-list li{position:relative;padding-left:30px;font-size:17px;line-height:1.7;color:var(--ink-2);letter-spacing:-.005em}
  .art-list li::before{content:"";position:absolute;left:0;top:calc(.72em - .85px);width:13px;height:1.7px;background:var(--accent)}
  .art-list li::after{content:"";position:absolute;left:5.65px;top:calc(.72em - 6.5px);width:1.7px;height:13px;background:var(--accent)}
  .art-quote{margin:32px 0;padding:0 0 0 24px;border-left:2px solid var(--accent);font-family:"Instrument Serif",serif;font-style:italic;font-size:26px;line-height:1.3;letter-spacing:-.012em;color:var(--ink)}
  .art-share{display:flex;align-items:center;gap:16px;margin-top:40px;padding-top:28px;border-top:1px solid var(--rule)}
  .art-share-btn{display:inline-flex;align-items:center;gap:9px;font-family:"Inter",sans-serif;font-size:14px;letter-spacing:-.005em;color:#fff;background:#0A66C2;border:1px solid #0A66C2;padding:9px 18px;border-radius:99px;text-decoration:none;transition:background .2s var(--ease),border-color .2s ease,transform .15s ease,box-shadow .18s ease}
  .art-share-btn svg{color:#fff}
  .art-share-btn:hover{background:#08528f;border-color:#08528f;transform:translateY(-1px);box-shadow:0 10px 24px rgba(10,102,194,.28)}

  /* ─────── 03 WERKE — dark, asymmetric 2-col offset ─────── */
  .panel[data-p="werke"]{background:#0a0e14;color:#e9edf2}
  .werke{padding:56px 56px 64px;max-width:1280px;margin:0 auto;display:flex;flex-direction:column;gap:36px;min-height:calc(100vh - 4.75rem)}
  .werke .lab-head{border-color:#1c2230}
  .werke .lab-head h2{color:#fff;margin:0}
  .werke .lab-head h2 em{font-style:italic;color:oklch(78% 0.16 230)}
  .werke .lab-head h2 b.acc{color:oklch(78% 0.16 230);font-weight:400;font-style:italic}
  .werke .lab-head .mono{color:#7d8694!important}
  .werke .lab-head .meta{color:#7d8694}
  .werke .lab-head .meta b{color:#fff;font-family:"Inter",sans-serif}
  .werke-grid{column-count:2;column-gap:20px}
  .pcard{cursor:pointer;min-width:0;break-inside:avoid;margin-bottom:20px;-webkit-column-break-inside:avoid;page-break-inside:avoid;position:relative}
  .pcard .img{width:100%;display:block}
  .pcard .img::after{content:"";position:absolute;left:0;right:0;bottom:0;height:60%;background:linear-gradient(0deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.22) 35%,transparent 70%);pointer-events:none;z-index:1;border-radius:0 0 18px 18px}
  .pcard .img::before{content:"";position:absolute;left:0;right:0;top:0;height:30%;background:linear-gradient(180deg,rgba(0,0,0,.32) 0%,transparent 100%);pointer-events:none;z-index:1;border-radius:18px 18px 0 0}
  .pcard:nth-child(1) .img{aspect-ratio:5/4}
  .pcard:nth-child(2) .img{aspect-ratio:4/5}
  .pcard:nth-child(3) .img{aspect-ratio:5/4}
  .pcard:nth-child(4) .img{aspect-ratio:1/1}
  .pcard:nth-child(5) .img{aspect-ratio:4/5}
  .pcard:nth-child(6) .img{aspect-ratio:5/4}
  .pcard:nth-child(7) .img{aspect-ratio:1/1}
  .pcard:nth-child(8) .img{aspect-ratio:5/4}
  .pcard .img{border:1px solid #1c2230;border-radius:18px;overflow:hidden;position:relative;transition:.25s}
  .pcard:hover .img{transform:translateY(-3px);border-color:#2a3042}
  .pcard .img.r-square{aspect-ratio:1/1}
  .pcard .img.r-portrait{aspect-ratio:4/5}
  .pcard .img.r-wide{aspect-ratio:5/4}
  .pcard .img .lock{position:absolute;top:20px;left:22px;right:22px;display:flex;align-items:baseline;gap:10px;z-index:2}
  .pcard .img .lock span{background:transparent;color:rgba(255,255,255,.85);font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase;padding:0;border-radius:0;font-weight:500;line-height:1;border:0}
  .pcard .img .lock span + span{color:rgba(255,255,255,.55);font-weight:400;letter-spacing:.03em}
  .pcard .img .lock span + span::before{content:"·";margin-right:10px;opacity:.6}
  .pcard .ttl{position:absolute;left:22px;right:22px;bottom:22px;z-index:2;font-family:"Inter",sans-serif;font-size:22px;font-weight:600;color:#fff;letter-spacing:-.018em;line-height:1.18;background:transparent;backdrop-filter:none;padding:0;border-radius:0;border:0;text-wrap:balance}
  .pcard .img.bg-1{background:linear-gradient(160deg,#a8a3e8 0%,#9690d8 100%)}
  .pcard .img.bg-2{background:linear-gradient(160deg,#c5b8e8 0%,#a89ad8 100%)}
  .pcard .img.bg-3{background:linear-gradient(160deg,#3a2a1f 0%,#2a1f15 100%)}
  .pcard .img.bg-4{background:linear-gradient(160deg,#4a4548 0%,#2e2a2c 100%)}
  .pcard .img.bg-5{background:linear-gradient(160deg,#3e372e 0%,#2a2622 100%)}
  .pcard .img.bg-6{background:linear-gradient(160deg,#a8835a 0%,#7d6240 100%)}
  .pcard .img.bg-7{background:#0a0e14;border-color:#1c2230;position:relative}
  .pcard .img.bg-7::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 36px,rgba(255,255,255,.04) 36px 37px),repeating-linear-gradient(90deg,transparent 0 36px,rgba(255,255,255,.04) 36px 37px)}
  .pcard .img .ph{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:"Instrument Serif",serif;font-style:italic;font-size:54px;color:rgba(255,255,255,.92);letter-spacing:-.02em;text-align:center;line-height:1;z-index:1}
  .pcard .img.bg-7 .ph{color:rgba(255,255,255,.78);font-size:72px;font-style:normal;font-family:"Inter",sans-serif;letter-spacing:-.04em;font-weight:600}
  .pcard .img.bg-3 .ph,.pcard .img.bg-4 .ph,.pcard .img.bg-5 .ph,.pcard .img.bg-6 .ph{color:rgba(255,255,255,.92)}

  /* ─────── 04 ÜBER — dark cards ─────── */
  .panel[data-p="ueber"]{background:#0a0e14;color:#e9edf2}
  .ueber{padding:56px 56px 64px;max-width:1320px;margin:0 auto;display:grid;grid-template-columns:repeat(12,1fr);column-gap:20px;row-gap:20px;min-height:calc(100vh - 4.75rem);align-content:start}
  .u-head{grid-column:1/13;display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #1c2230;padding-bottom:18px;margin-bottom:8px}
  .u-head h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:42px;color:#fff;margin:0;letter-spacing:-.012em;line-height:1}
  .u-head h2 em{font-style:italic;color:oklch(78% 0.16 230)}
  .u-head .meta{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;text-align:right;line-height:1.55}
  .u-head .meta b{color:#fff;font-family:"Inter",sans-serif;font-weight:500;font-size:14px;display:block;letter-spacing:-.005em}
  .ucard{background:linear-gradient(152deg,#0f1420 0%,#0b0f17 50%,#0a0e14 100%);border:1px solid rgba(255,255,255,.04);border-radius:20px;padding:28px;color:#e9edf2;position:relative;overflow:hidden}
  .ucard .h{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;color:#7d8694;text-transform:uppercase;margin:0 0 16px;display:flex;align-items:center;gap:8px}
  .ucard .h.icn::before{content:"";width:14px;height:14px;background:oklch(56% 0.18 255);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}

  /* hero card */
  .u-hero{grid-column:1/9;min-height:380px;padding:0;background:#0d1320;display:flex;flex-direction:column;justify-content:flex-end}
  .u-hero .av{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,19,32,.1) 0%,rgba(13,19,32,.92) 100%),repeating-linear-gradient(45deg,transparent 0 11px,rgba(255,255,255,.025) 11px 12px),radial-gradient(circle at 55% 32%,oklch(72% 0.12 230 / .35) 0%,transparent 55%);border-radius:22px}
  .u-hero .av-ph{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);font-family:"Inter",sans-serif;font-size:10px;letter-spacing:.15em;color:#5a6470;text-transform:uppercase;z-index:1}
  .u-hero .available{position:absolute;top:24px;left:24px;display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid rgba(255,255,255,.14);border-radius:99px;font-family:"Inter",sans-serif;font-size:13.5px;color:#cdd5e0;letter-spacing:-.005em;background:rgba(255,255,255,.04);backdrop-filter:blur(8px);z-index:2}
  .u-hero .available::before{content:"";width:7px;height:7px;border-radius:50%;background:oklch(72% 0.18 165);box-shadow:0 0 0 3px oklch(72% 0.18 165 / .25)}
  .u-hero .body{position:relative;z-index:2;padding:24px 30px 30px}
  .u-hero h3{font-family:"Instrument Serif",serif;font-weight:400;font-size:64px;line-height:1;letter-spacing:-.018em;color:#fff;margin:0}
  .u-hero .role{font-family:"Instrument Serif",serif;font-weight:400;font-size:20px;font-style:italic;color:#cdd5e0;margin-top:6px;letter-spacing:-.005em}
  .u-hero .skills{font-family:"Inter",sans-serif;font-size:15px;color:#7d8694;margin-top:14px;letter-spacing:-.005em}
  .u-hero .tags{display:flex;gap:8px;margin-top:24px}
  .u-hero .tags span{padding:7px 14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:99px;font-size:13.5px;color:#cdd5e0;backdrop-filter:blur(4px)}

  /* internationale */
  .u-intl{grid-column:9/13;padding:24px}
  .u-intl .row{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid #1c2230}
  .u-intl .row:last-of-type{border-bottom:0}
  .u-intl .flag{width:24px;height:18px;border-radius:3px;flex-shrink:0;margin-top:3px;overflow:hidden;position:relative}
  .u-intl .flag.de::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#000 0 33.3%,#dd0000 33.3% 66.6%,#ffce00 66.6% 100%)}
  .u-intl .flag.us{background:#bb0a30}
  .u-intl .flag.us::before{content:"";position:absolute;inset:0 60% 50% 0;background:#002868}
  .u-intl .body{flex:1;min-width:0}
  .u-intl .body b{font-weight:500;font-size:15px;color:#fff;display:flex;align-items:center;gap:8px;letter-spacing:-.005em}
  .u-intl .body b .pill{font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:0;background:oklch(56% 0.18 255 / .22);color:oklch(82% 0.14 230);padding:2px 9px;border-radius:99px;font-weight:500}
  .u-intl .body .sm{font-size:13.5px;color:#7d8694;margin-top:3px;letter-spacing:-.005em}
  .u-intl .foot{font-family:"Inter",sans-serif;font-size:14px;color:#7d8694;padding-top:14px;letter-spacing:-.005em}

  /* T-shaped */
  .u-tshape{grid-column:1/5;padding:24px}
  .u-tshape ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
  .u-tshape li{padding:13px 14px;border:1px solid #1c2230;border-radius:10px;font-size:15px;color:#cdd5e0;letter-spacing:-.005em}

  /* Werkzeuge */
  .u-tools{grid-column:5/13;padding:24px}
  .u-tools .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .u-tool{padding:12px 14px;border:1px solid #1c2230;border-radius:10px;display:flex;align-items:center;gap:12px}
  .u-tool .ic{width:32px;height:32px;border-radius:7px;display:grid;place-items:center;font-family:"Inter",sans-serif;font-weight:700;font-size:14px;color:#fff;flex-shrink:0;letter-spacing:-.02em}
  .u-tool .ic.figma{background:linear-gradient(180deg,#f24e1e 0%,#a259ff 100%)}
  .u-tool .ic.firefly{background:#ed2224}
  .u-tool .ic.hotjar{background:#ff3c00}
  .u-tool .ic.adobe{background:#fa0f00}
  .u-tool .ic.heygen{background:#0a0a0a;border:1px solid #444;color:#fff}
  .u-tool .ic.google{background:linear-gradient(135deg,#4285f4,#34a853)}
  .u-tool .ic.webflow{background:#4353ff}
  .u-tool .ic.claude{background:#cc785c}
  .u-tool .ic.midjourney{background:#0a0a0a;border:1px solid #2a2a2a;color:#fff}
  .u-tool .ic.sora{background:linear-gradient(135deg,#1a1a1a 0%,#000 100%);border:1px solid #333;color:#fff}
  .u-tool .ic.runway{background:linear-gradient(135deg,#ff4d4d 0%,#a020f0 100%)}
  .u-tool .ic.veo{background:linear-gradient(135deg,#4285f4 0%,#9b72cb 50%,#d96570 100%)}
  .u-tool .body{min-width:0}
  .u-tool b{display:block;font-weight:500;font-size:14.5px;color:#fff;letter-spacing:-.005em}
  .u-tool small{display:block;font-size:12.5px;color:#7d8694;margin-top:2px;letter-spacing:-.005em;line-height:1.3}

  /* Pilot */
  .u-pilot{grid-column:1/8;padding:0;aspect-ratio:16/10;background:linear-gradient(180deg,#3d6a8e 0%,#5e8aae 60%,#8eaec6 100%);position:relative;overflow:hidden}
  .u-pilot::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,rgba(0,0,0,.35) 0%,transparent 60%)}
  .u-pilot .label{position:absolute;top:16px;left:18px;font-family:"Inter",sans-serif;font-size:10px;color:rgba(255,255,255,.7);letter-spacing:.15em;text-transform:uppercase;z-index:2}
  .u-pilot .label::before{content:"// "}
  .u-pilot .ph{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:"Instrument Serif",serif;font-style:italic;font-size:36px;color:rgba(255,255,255,.88);text-align:center;line-height:1.1;letter-spacing:-.012em;z-index:1}
  .u-pilot .ph small{display:block;font-family:"Inter",sans-serif;font-size:10px;letter-spacing:.15em;font-style:normal;color:rgba(255,255,255,.55);margin-top:10px;text-transform:uppercase}

  /* Werte */
  .u-werte{grid-column:8/13;padding:28px;display:flex;flex-direction:column}
  .u-werte h4{font-family:"Inter",sans-serif;font-weight:500;font-size:22px;color:#fff;line-height:1.3;letter-spacing:-.012em;margin:0 0 22px;text-wrap:balance}
  .u-werte ul{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:10px}
  .u-werte ul li{font-size:15.5px;color:#cdd5e0;letter-spacing:-.005em;display:flex;gap:10px;align-items:baseline}
  .u-werte ul li::before{content:"→";color:oklch(78% 0.16 230);font-weight:500}
  .u-werte .pills{display:flex;gap:8px;margin-top:auto;flex-wrap:wrap}
  .u-werte .pills span{padding:7px 14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:99px;font-size:13.5px;color:#cdd5e0}

  /* Ladies Hamburg — Herzensprojekt */
  .u-ladies{grid-column:1/8;padding:28px;display:flex;flex-direction:column}
  .u-ladies .lad-top{display:flex;justify-content:space-between;align-items:baseline;gap:18px}
  .u-ladies h3{font-family:"Instrument Serif",serif;font-weight:400;font-size:34px;line-height:1;letter-spacing:-.014em;color:#fff;margin:0}
  .u-ladies h3 em{font-style:italic;color:oklch(78% 0.16 230)}
  .u-ladies .lad-stat{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;text-align:right;line-height:1.5;white-space:nowrap;letter-spacing:.03em}
  .u-ladies .lad-stat b{color:oklch(78% 0.16 230);font-family:"Inter",sans-serif;font-weight:500;font-size:19px;display:block;letter-spacing:-.01em}
  .u-ladies .lad-lede{font-size:16px;line-height:1.6;color:#cdd5e0;letter-spacing:-.005em;margin:14px 0 0;max-width:56ch}
  .u-ladies .lad-photos{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
  .u-ladies .lad-photos image-slot{width:100%;height:158px;display:block}
  .u-ladies .lad-mile{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid #1c2230;display:flex;flex-direction:column;gap:9px}
  .u-ladies .lad-mile li{font-size:14px;color:#cdd5e0;letter-spacing:-.005em;line-height:1.4;display:flex;gap:10px;align-items:baseline}
  .u-ladies .lad-mile li::before{content:"\2192";color:oklch(78% 0.16 230);font-weight:500}

  /* Was ich suche + Hobbys */
  .u-suche{grid-column:8/13;padding:28px;display:flex;flex-direction:column}
  .u-suche .such-lede{font-size:16px;line-height:1.6;color:#e9edf2;letter-spacing:-.005em;margin:0}
  .u-suche .such-list{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
  .u-suche .such-list li{font-size:14px;color:#cdd5e0;letter-spacing:-.005em;line-height:1.4;display:flex;gap:10px;align-items:baseline}
  .u-suche .such-list li::before{content:"\2192";color:oklch(78% 0.16 230);font-weight:500}
  .u-suche .such-div{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;color:#7d8694;text-transform:uppercase;margin:22px 0 14px;padding-top:20px;border-top:1px solid #1c2230}
  .u-suche .such-hobby{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
  .u-suche .such-hobby span{padding:7px 14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:99px;font-size:14px;color:#cdd5e0}

  /* Abschnitt "Ein bisschen mehr über mich" (nach den Stimmen) */
  .u-extra{background:var(--paper);color:var(--ink);padding:64px 56px 76px;position:relative;z-index:1;border-top:1px solid var(--rule)}
  .u-extra-inner{max-width:1320px;margin:0 auto}
  .u-extra-head{border-bottom:1px solid var(--rule);padding-bottom:20px;margin-bottom:26px;display:flex;flex-direction:column;gap:10px}
  .u-extra-head .ex-lab{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
  .u-extra-head h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:46px;line-height:1;letter-spacing:-.014em;color:var(--ink);margin:0}
  .u-extra-head h2 em{font-style:italic;color:var(--accent)}
  .u-extra-head .ex-lede{font-family:"Instrument Serif",serif;font-style:italic;font-size:21px;line-height:1.4;color:var(--ink-2);max-width:60ch;margin:2px 0 0}
  .u-extra-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;align-items:start}
  .u-extra .ucard{grid-column:auto;background:linear-gradient(152deg,#ffffff 0%,#f7f9fc 100%);border:1px solid var(--rule);color:var(--ink);box-shadow:0 1px 2px rgba(10,14,20,.04)}
  .u-extra .ucard .h{color:var(--ink-3)}
  .u-extra .u-ladies h3{color:var(--ink)}
  .u-extra .u-ladies h3 em{color:var(--accent)}
  .u-extra .u-ladies .lad-stat{color:var(--ink-3)}
  .u-extra .u-ladies .lad-stat b{color:var(--accent)}
  .u-extra .u-ladies .lad-lede{color:var(--ink-2)}
  .u-extra .u-ladies .lad-mile{border-top-color:var(--rule)}
  .u-extra .u-ladies .lad-mile li{color:var(--ink-2)}
  .u-extra .u-ladies .lad-mile li::before{color:var(--accent)}
  .u-extra .u-suche .such-lede{color:var(--ink)}
  .u-extra .u-suche .such-list li{color:var(--ink-2)}
  .u-extra .u-suche .such-list li::before{color:var(--accent)}
  .u-extra .u-suche .such-div{color:var(--ink-3);border-top-color:var(--rule)}
  .u-extra .u-suche .such-hobby span{background:#fff;border:1px solid var(--rule);color:var(--ink-2)}
  .u-extra .u-ladies .lad-photos image-slot{height:170px}
  .u-ladies .lad-photos img{width:100%;height:170px;object-fit:cover;border-radius:12px;display:block}
  @media (max-width:900px){
    .u-extra{padding:44px 24px 56px}
    .u-extra-grid{grid-template-columns:1fr}
    .u-extra-head h2{font-size:34px}
  }

  /* Stimmen */
  .stimmen{grid-column:1/13;border-top:1px solid #1c2230;padding-top:28px;margin-top:8px}
  .stim-h{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px;gap:32px}
  .stim-h .lab{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.15em;text-transform:uppercase}
  .stim-h h3{font-family:"Instrument Serif",serif;font-weight:400;font-size:36px;color:#fff;margin:0;letter-spacing:-.012em;line-height:1}
  .stim-h h3 em{font-style:italic;color:oklch(78% 0.16 230)}
  .stim-h h3 b.acc{color:oklch(78% 0.16 230);font-weight:400;font-style:italic}
  .stim-h .src{text-align:right;font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;line-height:1.55}
  .stim-h .src b{color:#fff;font-family:"Inter",sans-serif;font-weight:500;font-size:14px;display:block;letter-spacing:-.005em}
  .marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
  .mtrack{display:flex;gap:18px;width:max-content;animation:marq 60s linear infinite}
  .marquee:hover .mtrack{animation-play-state:paused}
  @keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .stim{flex:0 0 404px;background:#0d1320;border:1px solid #1c2230;border-radius:18px;padding:30px 32px;display:flex;flex-direction:column;gap:20px}
  .stim .nr{font-family:"Inter",sans-serif;font-size:11px;color:oklch(78% 0.16 230);letter-spacing:.03em}
  .stim p{margin:0;font-size:16px;line-height:1.68;letter-spacing:-.005em;color:#cdd5e0}
  .stim p::before{content:"„ ";color:oklch(78% 0.16 230);font-weight:500}
  .stim .by{font-size:11px;color:#7d8694;font-family:"Inter",sans-serif;margin-top:auto}
  .stim .by b{color:#fff;font-family:"Inter",sans-serif;font-weight:500;font-size:14px;letter-spacing:-.005em;display:block;margin-bottom:1px}

  /* ─────── 05 KONTAKT — dark, unified with site ─────── */
  .panel[data-p="kontakt"]{background:#0a0e14;color:#e9edf2}
  .kontakt{padding:56px 56px 64px;max-width:1280px;margin:0 auto;display:flex;flex-direction:column;gap:48px;min-height:calc(100vh - 4.75rem)}
  .kontakt .k-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #1c2230;padding-bottom:20px}
  .kontakt .k-head h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:64px;letter-spacing:-.018em;line-height:1;margin:0;color:#fff}
  /* Stacked Kontakt header: label above title, lede below, no rule */
  .kontakt .k-head-stacked{border-bottom:0;padding-bottom:0;align-items:start}
  .kontakt .k-head-stacked .k-head-main{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
  .kontakt .k-head-stacked .k-sub{margin:0}
  .kontakt .k-head-stacked .k-lede{margin:0;max-width:34ch}
  /* 2-column Kontakt: header left, channels right, top-aligned with H1 */
  .kontakt.kontakt-2col{display:grid;grid-template-columns:1fr min(58%,720px);gap:64px;align-items:start}
  .kontakt.kontakt-2col .k-head-main{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
  .kontakt.kontakt-2col .k-head-main h2{font-family:"Instrument Serif",serif;font-weight:400;font-size:46px;letter-spacing:-.014em;line-height:1;margin:0;color:#fff}
  .kontakt.kontakt-2col .k-head-main h2 em{font-style:italic;color:oklch(78% 0.16 230)}
  .kontakt.kontakt-2col .k-head-main .meta{text-align:left;margin-top:4px}
  .kontakt.kontakt-2col .channels{width:100%;margin:0}
  @media (max-width:860px){ .kontakt.kontakt-2col{grid-template-columns:1fr;gap:36px} }
  .kontakt .k-head h2 em{font-style:italic;color:oklch(78% 0.16 230)}
  .kontakt .k-head .meta{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;text-align:right;line-height:1.55;letter-spacing:.03em}
  .kontakt .k-head .meta b{display:block;color:#fff;font-family:"Inter",sans-serif;font-weight:500;font-size:14px;letter-spacing:-.005em}
  .kontakt .meta b{color:#fff;font-family:"Inter",sans-serif;font-weight:500;font-size:14px;letter-spacing:-.005em}
  .kontakt .k-body{display:block}
  .kontakt .k-body .channels{margin-left:auto;width:min(58%,720px)}
  .kontakt .k-lede{font-family:"Inter",sans-serif;font-size:16px;line-height:1.6;color:#cdd5e0;letter-spacing:-.005em;margin:0;max-width:32ch;text-wrap:balance}
  .kontakt .k-lede em{font-style:normal;color:oklch(78% 0.16 230)}
  .kontakt .k-sub{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.15em;text-transform:uppercase;margin-top:20px;display:block}
  .channels{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  .ch{position:relative;display:flex;flex-direction:column;aspect-ratio:1/1;padding:24px;border:1px solid rgba(255,255,255,.06);border-radius:18px;background:linear-gradient(152deg,#0f1420 0%,#0b0f17 55%,#0a0e14 100%);text-decoration:none;color:#e9edf2;transition:transform .55s var(--ease),box-shadow .55s var(--ease),border-color .4s ease}
  .ch .n{font-family:"Inter",sans-serif;font-size:11px;color:#7d8694;letter-spacing:.03em}
  .ch .l{margin-top:auto;font-family:"Inter",sans-serif;font-size:18px;font-weight:500;letter-spacing:-.012em;color:#fff;line-height:1.25;max-width:12ch}
  .ch .arr{position:absolute;top:22px;right:22px;color:#3a4252;transition:.2s ease;display:inline-flex;align-items:center}
  .ch .arr svg{width:20px;height:20px;display:block}
  .ch:hover{transform:translateY(-4px);box-shadow:0 30px 70px -30px rgba(0,0,0,.55);border-color:rgba(255,255,255,.12)}
  .ch:hover .l{color:oklch(78% 0.16 230)}
  .ch:hover .arr{color:oklch(78% 0.16 230);transform:translateX(4px)}

  /* ─── Kontakt · Aside (direkte Kanäle, kompakt) ─── */
  .k-aside{display:flex;flex-direction:column;gap:28px}
  .k-direct{display:flex;flex-direction:column;gap:2px}
  .k-direct .k-sub{margin:0 0 10px}
  .k-direct-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
    padding:11px 0;border-bottom:1px solid #1c2230;text-decoration:none;transition:.18s ease}
  .k-direct-row:first-of-type{border-top:1px solid #1c2230}
  .k-direct-row .dl{font-family:"Inter",sans-serif;font-size:15px;font-weight:500;color:#e9edf2;letter-spacing:-.01em}
  .k-direct-row .dv{font-family:"Inter",sans-serif;font-size:12px;color:#7d8694;letter-spacing:.03em}
  .k-direct-row:hover{padding-left:8px}
  .k-direct-row:hover .dl{color:oklch(78% 0.16 230)}
  .k-direct-row:hover .dv{color:#cdd5e0}

  /* ─── Kontakt · Formular ─── */
  .k-form{display:flex;flex-direction:column;gap:22px}
  .k-form .k-sub{margin:0}
  .kf-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .kf-field{display:flex;flex-direction:column;gap:8px}
  .kf-field.kf-span{grid-column:1/-1}
  .kf-lab{font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:#7d8694;display:flex;align-items:center;gap:8px}
  .kf-lab i{color:oklch(78% 0.16 230);font-style:normal}
  .kf-opt{font-family:"Inter",sans-serif;font-size:10px;font-style:normal;color:#5a6470;letter-spacing:0;text-transform:none}
  .kf-field input,.kf-field textarea{
    font-family:"Inter",sans-serif;font-size:15px;color:#fff;letter-spacing:-.005em;
    background:#0d121b;border:1px solid #1c2230;border-radius:10px;padding:13px 14px;
    transition:border-color .18s ease, background .18s ease;width:100%;resize:vertical}
  .kf-field textarea{min-height:108px;line-height:1.5}
  .kf-field input::placeholder,.kf-field textarea::placeholder{color:#4a525e}
  .kf-field input:focus,.kf-field textarea:focus{outline:none;border-color:oklch(78% 0.16 230);background:#0f1620}
  .kf-field input:user-invalid,.kf-field textarea:user-invalid{border-color:oklch(62% 0.17 25)}
  .kf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
  .kf-consent{display:flex;gap:11px;align-items:flex-start;cursor:pointer}
  .kf-consent input{margin-top:2px;width:17px;height:17px;flex:0 0 auto;accent-color:oklch(78% 0.16 230);cursor:pointer}
  .kf-consent span{font-family:"Inter",sans-serif;font-size:12.5px;line-height:1.5;color:#9aa3af;letter-spacing:-.003em}
  .kf-consent span i{color:oklch(78% 0.16 230);font-style:normal}
  .kf-consent .lnk{font:inherit;color:oklch(78% 0.16 230);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
  .kf-foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
  .kf-submit{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border:0;border-radius:var(--btn-radius);
    background:oklch(78% 0.16 230);color:#06121f;font-family:"Inter",sans-serif;font-weight:600;font-size:14.5px;
    letter-spacing:-.01em;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease}
  .kf-submit:hover{transform:translateY(-1px);box-shadow:0 10px 28px oklch(78% 0.16 230 / .32)}
  .kf-submit:active{transform:translateY(0)}
  .kf-submit:focus-visible{outline:2px solid oklch(78% 0.16 230);outline-offset:3px}
  .kf-submit:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
  .kf-note{font-family:"Inter",sans-serif;font-size:10.5px;color:#7d8694;letter-spacing:.03em}
  .kf-status{margin:0;font-family:"Inter",sans-serif;font-size:12.5px;letter-spacing:.03em;min-height:1px}
  .kf-status.ok{color:oklch(80% 0.14 165)}
  .kf-status.err{color:oklch(70% 0.16 25)}
  .k-form.sent .kf-grid,.k-form.sent .kf-consent,.k-form.sent .kf-foot{display:none}
  @media (prefers-reduced-motion: reduce){
    .kf-submit{transition:none}.kf-submit:hover{transform:none}
  }

/* ════════════════════════════════════════════════════════════════════
   LOADING SCREEN
   ════════════════════════════════════════════════════════════════════ */
.loader{
  position:fixed;inset:0;z-index:9999;
  background:var(--paper);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:2rem;
  opacity:1;
  transition:opacity .6s cubic-bezier(.22,.7,.3,1);
  pointer-events:auto;
}
.loader.gone{opacity:0;pointer-events:none}
.loader::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(60% 60% at 18% 22%, oklch(92% 0.04 220 / .55) 0%, transparent 60%),
    radial-gradient(50% 60% at 84% 78%, oklch(94% 0.04 175 / .5) 0%, transparent 65%);
  filter:blur(3rem);
}
/* ── Pixel avatar — стиль Mario ── */

/* Версия LOADER (компактная) — над именем, статичная позиция */
.loader-avatar.above{
  position:static;
  width:5rem;height:5rem;                  /* 80×80 — компактно */
  margin:0 auto -.5rem;
  animation:none;
}
.loader-avatar.above .av-body{
  width:100%;height:100%;
  animation:avatarStep .28s steps(2,end) infinite;
  transform-origin:50% 100%;
}
.loader-avatar.above .av-body img{
  width:100%;height:100%;object-fit:contain;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
}

/* Версия LOADER (бегущая, если когда-то снова понадобится) */
.loader-avatar{
  position:absolute;
  bottom:5.5rem;
  left:0;
  width:3rem;height:4rem;
  pointer-events:none;
  animation:avatarRun 5s linear infinite;
}
.loader-avatar .av-body{
  width:100%;height:100%;
  animation:avatarStep .26s steps(2,end) infinite;
  transform-origin:50% 100%;
}
.loader-avatar img{
  width:100%;height:100%;object-fit:contain;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
}
@keyframes avatarRun{
  0%   { left:-4rem; transform:scaleX(1); }
  48%  { left:calc(100% - 1rem); transform:scaleX(1); }
  50%  { left:calc(100% - 1rem); transform:scaleX(-1); }
  98%  { left:-3rem; transform:scaleX(-1); }
  100% { left:-4rem; transform:scaleX(1); }
}
@keyframes avatarStep{
  0%   { transform:translateY(0)         rotate(0deg);   }
  50%  { transform:translateY(-.1875rem) rotate(-2deg);  }
  100% { transform:translateY(0)         rotate(2deg);   }
}

/* Версия HEADER (рядом с именем) — фигурка во весь рост, без анимации */
.h-id .h-avatar{
  display:inline-block;
  width:2rem;height:2rem;                  /* 32×32 */
  flex-shrink:0;
  margin-top:-.25rem;margin-bottom:-.25rem;
}
.h-id .h-avatar img{
  width:100%;height:100%;
  object-fit:contain;
  display:block;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
}

/* Версия FOOTER (рядом с именем) — фигурка во весь рост, без анимации */
.brand-mark .brand-avatar{
  display:inline-block;
  width:2rem;height:2rem;                  /* 32×32 — тот же размер */
  flex-shrink:0;
}
.brand-mark .brand-avatar img{
  width:100%;height:100%;
  object-fit:contain;
  display:block;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
}

/* ── ORB — мягкий шар (для header и footer) ──
.orb{
  position:relative;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.55) 0%, rgba(255,255,255,.1) 28%, transparent 55%),
    conic-gradient(from 220deg at 50% 50%,
      oklch(78% 0.16 230) 0deg,
      oklch(56% 0.18 255) 90deg,
      oklch(38% 0.06 175) 180deg,
      oklch(72% 0.18 165) 270deg,
      oklch(78% 0.16 230) 360deg);
  /* Размытый край через radial mask */
  -webkit-mask-image:radial-gradient(circle, #000 50%, transparent 78%);
          mask-image:radial-gradient(circle, #000 50%, transparent 78%);
  filter:blur(.0625rem);
  animation:orbSpin 6s linear infinite;
}
.orb::after{
  content:"";position:absolute;inset:-25%;z-index:-1;
  border-radius:50%;
  background:radial-gradient(circle, oklch(78% 0.16 230 / .35) 0%, oklch(56% 0.18 255 / .15) 35%, transparent 65%);
  animation:orbBreathe 2.6s ease-in-out infinite;
  filter:blur(.5rem);
}

/* Большой орб в loader */
.loader-orb{
  width:6rem;height:6rem;                  /* 96×96 */
}
.loader-orb.orb{
  filter:blur(.125rem);                    /* чуть мягче для большого */
}
@keyframes orbSpin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
@keyframes orbBreathe{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(.94);opacity:.85}
}
.loader-text{
  position:relative;
  text-align:center;
  display:flex;flex-direction:column;
  gap:.375rem;
  opacity:0;
  animation:loaderFadeIn .8s .25s ease forwards;
}
@keyframes loaderFadeIn{to{opacity:1}}
.loader-text .ldr-name{
  font-family:"Instrument Serif",serif;
  font-weight:400;font-size:2.5rem;        /* 40px */
  letter-spacing:-.018em;line-height:1;
  color:var(--ink);
}
.loader-text .ldr-role{
  font-family:"Instrument Serif",serif;
  font-style:italic;font-weight:400;
  font-size:1.125rem;                      /* 18px */
  color:oklch(38% 0.06 175);
  letter-spacing:-.005em;
}
.loader-bar{
  position:relative;width:8rem;height:.125rem;  /* 128×2px */
  background:var(--rule);border-radius:99px;overflow:hidden;
}
.loader-bar::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,oklch(38% 0.06 175),transparent);
  animation:loaderProgress 1.6s ease-in-out infinite;
  transform:translateX(-100%);
}
@keyframes loaderProgress{
  0%{transform:translateX(-100%)}
  100%{transform:translateX(100%)}
}
.loader-foot{
  position:absolute;bottom:2rem;
  font-family:"Inter",sans-serif;
  font-size:.625rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-3);
}


/* ════════════════════════════════════════════════════════════════════
   WERKE PASSWORD GATE (NDA-protected)
   ════════════════════════════════════════════════════════════════════ */
/* Locked Werke — dark, structured two-column gate */
.panel[data-p="werke"][data-locked="true"]{background:#0a0e14;color:var(--ink)}
.werke-gate{
  position:relative;
  min-height:calc(100vh - 4.75rem);
  padding:56px 1.5rem 64px;
  display:grid;place-items:start center;
}
.werke-gate::before{
  content:none;
}
.gate-inner{
  position:relative;z-index:1;
  width:100%;max-width:58rem;
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(2rem,5vw,4rem);align-items:center;
}

/* ── Left: context ── */
.gate-intro{text-align:left}
.gate-intro .gate-sub{
  font-family:"Inter",sans-serif;
  font-size:.6875rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3);
  margin-bottom:1rem;
}
.gate-intro h3{
  font-family:"Instrument Serif",serif;
  font-weight:400;font-size:clamp(2.25rem,4.5vw,3rem);
  letter-spacing:-.018em;line-height:1.02;
  margin:0 0 1rem;color:#fff;
}
.gate-intro h3 em{font-style:italic;color:oklch(78% 0.16 230)}
.gate-intro p{
  font-size:.9375rem;line-height:1.6;
  color:var(--ink-2);max-width:38ch;margin:0;
  letter-spacing:-.005em;text-wrap:pretty;
}
.gate-list{
  list-style:none;margin:1.75rem 0 0;padding:0;
  border-top:.0625rem solid #1c2230;
}
.gate-list li{
  display:grid;grid-template-columns:6.5rem 1fr;align-items:baseline;gap:1rem;
  padding:.875rem 0;border-bottom:.0625rem solid #1c2230;
}
.gate-list .gl-k{
  font-family:"Inter",sans-serif;
  font-size:.6875rem;letter-spacing:.15em;text-transform:uppercase;
  color:oklch(78% 0.16 230);
}
.gate-list .gl-v{
  font-size:.875rem;color:var(--ink-2);letter-spacing:-.005em;
}

/* ── Right: access card ── */
.gate-card{
  background:#0d1320;
  border:.0625rem solid #1c2230;
  border-radius:1.25rem;
  padding:1.75rem;
  box-shadow:0 1.5rem 3.5rem rgba(0,0,0,.4);
}
.gc-head{
  display:flex;align-items:center;gap:.75rem;
  padding-bottom:1.25rem;margin-bottom:1.25rem;
  border-bottom:.0625rem solid #1c2230;
}
.gc-lock{
  flex:0 0 auto;width:2.25rem;height:2.25rem;border-radius:.625rem;
  display:grid;place-items:center;
  background:oklch(78% 0.16 230 / .12);
  border:.0625rem solid oklch(78% 0.16 230 / .28);
  color:oklch(82% 0.14 230);
}
.gc-title{font-weight:600;font-size:.9375rem;color:#fff;letter-spacing:-.01em}
.gc-note{font-size:.8125rem;color:var(--ink-3);letter-spacing:-.005em;margin-top:.125rem}
.gc-label{
  display:block;
  font-family:"Inter",sans-serif;
  font-size:.625rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:.5rem;
}
.gate-form{display:flex;flex-direction:column;gap:.625rem}
.gate-input{
  appearance:none;
  font:inherit;font-family:"Inter",sans-serif;
  background:#0a0e14;
  border:.0625rem solid #1c2230;
  color:#fff;
  font-size:.9375rem;letter-spacing:-.005em;text-align:left;
  padding:.9375rem 1.0625rem;border-radius:.75rem;
  transition:.18s;width:100%;
}
.gate-input::placeholder{color:#4a525e}
.gate-input:focus{
  outline:none;
  border-color:oklch(78% 0.16 230 / .55);
  box-shadow:0 0 0 .1875rem oklch(78% 0.16 230 / .14);
}
.gate-input.err{border-color:oklch(60% 0.2 25);animation:gateShake .35s ease}
@keyframes gateShake{
  0%,100%{transform:translateX(0)}
  20%,60%{transform:translateX(-.375rem)}
  40%,80%{transform:translateX(.375rem)}
}
.gate-submit{
  appearance:none;border:0;cursor:pointer;white-space:nowrap;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:#1a2130;color:#eef2f7;
  font:inherit;font-family:"Inter",sans-serif;
  font-weight:500;font-size:.9375rem;letter-spacing:-.005em;
  padding:.9375rem 1.0625rem;border-radius:var(--btn-radius);
  transition:background .18s ease,color .18s ease,transform .15s ease,box-shadow .18s ease;margin-top:.125rem;
}
.gate-submit:hover{
  background:oklch(78% 0.16 230);color:#06121f;
  transform:translateY(-1px);
  box-shadow:0 .625rem 1.75rem oklch(78% 0.16 230 / .32);
}
.gate-err{
  text-align:left;
  font-family:"Inter",sans-serif;font-size:.8125rem;
  color:oklch(70% 0.18 25);min-height:.25rem;letter-spacing:-.005em;
}
/* Caption under the password — link opens the request popup */
.gate-foot{
  font-size:.8125rem;color:var(--ink-2);letter-spacing:-.005em;
  margin-top:1.25rem;padding-top:1.25rem;border-top:.0625rem solid #1c2230;
}
.gate-reqlink{
  font:inherit;font-family:"Inter",sans-serif;color:oklch(78% 0.16 230);
  background:none;border:0;padding:0;cursor:pointer;text-decoration:none;letter-spacing:-.005em;
}
.gate-reqlink:hover{text-decoration:underline}
.gate-req-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ── Zugang-Popup (request password by work e-mail) ── */
.legal-modal .doc.doc-zugang{max-width:31rem;text-align:center}
.doc-zugang .sub{text-align:center}
.doc-zugang > p{max-width:38ch;margin:0 auto 1.5rem;color:var(--ink-2)}
.zg-form{display:flex;flex-direction:column;gap:.625rem;text-align:left}
.zg-input{
  appearance:none;font:inherit;font-family:"Inter",sans-serif;
  background:#fff;border:.0625rem solid var(--rule);color:var(--ink);
  font-size:1rem;letter-spacing:-.005em;
  padding:.9375rem 1.0625rem;border-radius:.75rem;width:100%;transition:.18s;
}
.zg-input::placeholder{color:var(--ink-3)}
.zg-input:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 .1875rem var(--accent-soft);
}
.zg-input.err{border-color:oklch(60% 0.2 25);animation:gateShake .35s ease}
.zg-submit{
  appearance:none;border:0;cursor:pointer;
  background:var(--ink);color:#fff;
  font:inherit;font-family:"Inter",sans-serif;font-weight:600;font-size:.9375rem;letter-spacing:-.005em;
  padding:.9375rem 1rem;border-radius:var(--btn-radius);transition:.18s;margin-top:.125rem;
}
.zg-submit:hover{background:var(--accent);transform:translateY(-1px)}
.zg-msg{
  font-family:"Inter",sans-serif;font-size:.8125rem;letter-spacing:-.005em;
  line-height:1.45;min-height:1rem;text-align:left;color:var(--ink-3);margin-top:.125rem;
}
.zg-msg.ok{color:oklch(52% 0.13 165)}
.zg-msg.err{color:oklch(58% 0.2 25)}
.zg-form.sent .zg-input,.zg-form.sent .zg-submit{display:none}

/* Werke-Panel zeigt immer die Vitrine; echter Schutz liegt serverseitig auf /works/ */

/* ─── RESPONSIVE for Loader + Gate ─── */
@media (max-width:40rem){
  /* Loader mobile */
  .loader{ gap:1.5rem; padding:0 1rem; }
  .loader-avatar{ width:2.5rem;height:3.375rem;bottom:4.5rem; }   /* 40×54 mobile */
  .loader-text .ldr-name{ font-size:2rem; }       /* 32px */
  .loader-text .ldr-role{ font-size:1rem; }       /* 16px */
  .loader-bar{ width:6rem; }                      /* 96px */
  .loader-foot{ bottom:1.5rem; font-size:.5625rem; }

  /* Werke gate mobile */
  .werke-gate{
    padding:2.5rem 1.25rem;
  }
  .gate-inner{
    grid-template-columns:1fr;
    gap:2rem;
    max-width:26rem;
  }
  .gate-intro h3{ font-size:2rem; }               /* 32px */
  .gate-intro p{ font-size:.875rem; max-width:none; }
  .gate-list{ margin-top:1.25rem; }
  .gate-card{ padding:1.5rem; }
  .gate-input,
  .gate-submit{
    font-size:1rem;                                /* 16px — критично для iOS (без zoom) */
  }
  .gate-foot{ font-size:.8125rem; }
}

/* ─────── FOOTER ─────── */
.site-foot{
  flex:0 0 auto;
  padding:1.75rem max(1.75rem, calc((100% - 1600px) / 2 + 1.75rem)) 1rem;
  border-top:.0625rem solid var(--rule);
  background:rgba(250,251,252,.86);
  backdrop-filter:blur(.5rem);
  font-family:"Inter",sans-serif;
  font-size:.8125rem;letter-spacing:-.005em;color:var(--ink-2);
  position:relative;z-index:10;
  display:flex;flex-direction:column;gap:1.25rem;
}

/* Minimal centered footer — nur Rechtliches + Copyright */
.site-foot.foot-minimal{align-items:center;text-align:center;gap:.7rem;padding-top:1.6rem;padding-bottom:1.3rem}
.foot-minimal .foot-legal{display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap}
.foot-minimal .foot-legal .lnk{appearance:none;background:transparent;border:0;padding:0;cursor:pointer;
  font-family:"Inter",sans-serif;font-size:.8125rem;letter-spacing:-.005em;color:var(--ink-2);transition:color .15s}
.foot-minimal .foot-legal .lnk:hover{color:var(--accent)}
.foot-minimal .foot-legal .dot{color:var(--ink-3);opacity:.5}
.foot-minimal .foot-copy{font-family:"Inter",sans-serif;font-size:.6875rem;letter-spacing:.03em;color:var(--ink-3);white-space:nowrap}
.foot-minimal .foot-social{display:flex;align-items:center;justify-content:center;gap:.6rem}
.foot-ic{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;color:var(--ink-2);border:1px solid var(--rule);transition:color .15s ease,border-color .15s ease,background .15s ease}
.foot-ic svg{width:17px;height:17px;fill:currentColor}
.foot-ic:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
/* 3-zone footer: name left · social center · legal right */
.site-foot.foot-3col{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;text-align:left}
.foot-3col .foot-name{justify-self:start;display:flex;flex-direction:column;gap:2px;font-family:"Inter",sans-serif;font-weight:600;font-size:.8125rem;color:var(--ink);letter-spacing:-.01em}
.foot-3col .foot-name small{font-family:"Inter",sans-serif;font-weight:400;font-size:12px;letter-spacing:.03em;color:var(--ink-3)}
.foot-3col .foot-social{justify-self:center}
.foot-3col .foot-legal{justify-self:end}
@media (max-width:640px){
  .site-foot.foot-3col{grid-template-columns:1fr;justify-items:center;text-align:center;gap:.9rem}
  .foot-3col .foot-name{justify-self:center;align-items:center}
  .foot-3col .foot-legal{justify-self:center}
}

/* Main row: 4 columns */
.foot-main{
  display:grid;
  grid-template-columns:1.6fr 1fr 1.1fr 1.3fr;
  gap:2.5rem;align-items:start;
}

/* Brand block */
.foot-brand{display:flex;align-items:flex-start;gap:.875rem;min-width:0}
.brand-mark{
  flex-shrink:0;color:var(--ink);
  display:inline-flex;align-items:center;
}
.brand-mark .bm-fish-mark{
  display:none;
}
.brand-mark .brand-orb{
  width:2.25rem;height:2.25rem;             /* 36×36px */
}
.brand-text{display:flex;flex-direction:column;gap:.125rem;min-width:0}
.brand-text b{
  font-family:"Inter",sans-serif;font-weight:600;font-size:.9375rem;
  color:var(--ink);letter-spacing:-.012em;
}
.brand-text span{font-size:.75rem;color:var(--ink-2);line-height:1.45}
.brand-text .mono{
  font-family:"Inter",sans-serif;font-size:.6875rem;
  letter-spacing:.03em;color:var(--ink-3);margin-top:.125rem;
}

/* Columns */
.foot-col{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.foot-h{
  font-family:"Inter",sans-serif;font-size:.6563rem;
  letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);
  margin-bottom:.25rem;
}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.375rem}
.foot-col ul li{display:flex;align-items:baseline;gap:.5rem;font-size:14px}
.foot-col a,
.foot-col button.lnk{
  appearance:none;background:transparent;border:0;padding:0;cursor:pointer;
  font:inherit;font-family:"Inter",sans-serif;color:var(--ink);
  font-size:14px;letter-spacing:-.005em;text-decoration:none;
  text-align:left;display:inline-flex;align-items:baseline;gap:.5rem;
  transition:color .15s;
}
.foot-col a:hover,
.foot-col button.lnk:hover{color:var(--accent)}
.foot-col .mono{
  font-family:"Inter",sans-serif;font-size:.625rem;
  color:var(--ink-3);letter-spacing:.03em;font-weight:400;
}
.foot-col .ext::after{content:" ↗";opacity:.5;margin-left:.125rem;font-size:.75em}
.foot-col .tbd{color:var(--accent);background:var(--accent-soft);padding:.0625rem .375rem;border-radius:.25rem}
.foot-meta{
  display:flex;flex-direction:column;gap:.1875rem;margin-top:.625rem;
  padding-top:.625rem;border-top:.0625rem dashed var(--rule);
}
.foot-meta span{
  font-family:"Inter",sans-serif;font-size:.625rem;
  letter-spacing:.03em;color:var(--ink-3);
}

/* Utility row */
.foot-util{
  display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;
  align-items:center;padding-top:1rem;
  border-top:.0625rem solid var(--rule);
  font-family:"Inter",sans-serif;font-size:.6875rem;
  letter-spacing:.03em;color:var(--ink-3);
}
.fu-col{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap}
.fu-col.center{justify-content:center}
.fu-col.right{justify-self:end}
.fu-col b{
  font-family:"Inter",sans-serif;font-weight:500;color:var(--ink);
  letter-spacing:-.005em;font-size:.75rem;
}
.fu-col .sep{color:var(--ink-3);opacity:.4}
.fu-col .pulse{
  display:inline-flex;align-items:center;gap:.5rem;
  color:var(--ink);font-family:"Inter",sans-serif;
  font-size:.75rem;letter-spacing:-.005em;font-weight:500;
  padding:.25rem .625rem;border-radius:99px;
  background:var(--mint-soft);
}
.fu-col .pulse::before{
  content:"";width:.375rem;height:.375rem;border-radius:50%;
  background:oklch(60% 0.15 165);
  box-shadow:0 0 0 .1875rem oklch(60% 0.15 165 / .22);
}

/* ─── COOKIE BANNER ─── */
.cookie-banner{
  position:fixed;left:1rem;bottom:1rem;z-index:90;
  width:min(26rem, calc(100vw - 2rem));
  background:#fff;border:.0625rem solid var(--rule);
  border-radius:1rem;padding:1.25rem 1.375rem 1.125rem;
  box-shadow:0 1.5rem 3rem rgba(10,14,20,.12), 0 .25rem .75rem rgba(10,14,20,.05);
  font-family:"Inter",sans-serif;font-size:.8125rem;line-height:1.55;
  color:var(--ink);letter-spacing:-.005em;
  display:none;
}
.cookie-banner.on{display:block}
.cookie-banner .cb-head{
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  margin-bottom:.625rem;
}
.cookie-banner .cb-head .sub{
  font-family:"Inter",sans-serif;font-size:.625rem;
  letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);
}
.cookie-banner .cb-head b{
  font-family:"Instrument Serif",serif;font-weight:400;
  font-size:1.375rem;letter-spacing:-.012em;line-height:1;color:var(--ink);
}
.cookie-banner p{margin:0 0 .875rem;color:var(--ink-2)}
.cookie-banner p a{color:var(--accent);text-decoration:none}
.cookie-banner p a:hover{text-decoration:underline}
.cookie-banner .cats{
  display:flex;flex-direction:column;gap:.5rem;
  padding:.75rem 0 1rem;border-top:.0625rem solid var(--rule);
  margin-top:.25rem;
}
.cookie-banner .cat{
  display:grid;grid-template-columns:1fr auto;gap:.25rem .75rem;align-items:center;
  font-size:.8125rem;
}
.cookie-banner .cat b{font-weight:500;color:var(--ink);letter-spacing:-.005em}
.cookie-banner .cat small{
  grid-column:1/3;font-size:.7188rem;color:var(--ink-2);line-height:1.5;letter-spacing:-.005em;
}
/* Toggle switch */
.cb-toggle{
  width:2.25rem;height:1.25rem;border-radius:99px;
  background:var(--rule-2);position:relative;cursor:pointer;
  transition:background .18s ease;flex-shrink:0;border:0;padding:0;
}
.cb-toggle::after{
  content:"";position:absolute;top:.125rem;left:.125rem;
  width:1rem;height:1rem;border-radius:50%;background:#fff;
  box-shadow:0 .0625rem .1875rem rgba(0,0,0,.18);
  transition:transform .18s ease;
}
.cb-toggle.on{background:var(--accent)}
.cb-toggle.on::after{transform:translateX(1rem)}
.cb-toggle.locked{background:oklch(60% 0.15 165);cursor:not-allowed;opacity:.7}
.cb-toggle.locked::after{transform:translateX(1rem)}
/* Buttons row */
.cookie-banner .cb-acts{
  display:grid;grid-template-columns:1fr 1fr;gap:.5rem;
}
.cookie-banner .cb-acts.three{grid-template-columns:1fr 1fr 1.4fr}
.cookie-banner button.cb-btn{
  appearance:none;border:.0625rem solid var(--rule-2);background:#fff;
  font:inherit;font-family:"Inter",sans-serif;font-weight:500;
  font-size:.8125rem;letter-spacing:-.005em;color:var(--ink);
  padding:.625rem .875rem;border-radius:var(--btn-radius);cursor:pointer;
  transition:.15s;
}
.cookie-banner button.cb-btn:hover{border-color:var(--ink);}
.cookie-banner button.cb-btn.primary{
  background:var(--ink);color:#fff;border-color:var(--ink);
}
.cookie-banner button.cb-btn.primary:hover{background:var(--accent);border-color:var(--accent)}
.cookie-banner .cb-foot{
  font-family:"Inter",sans-serif;font-size:.6563rem;
  color:var(--ink-3);letter-spacing:.03em;margin-top:.75rem;text-align:center;
}

/* ─── LEGAL MODAL (Impressum / Datenschutz) ─── */
.legal-modal{
  position:fixed;inset:0;z-index:100;display:none;
  background:rgba(10,14,20,.55);backdrop-filter:blur(.5rem);
  align-items:center;justify-content:center;padding:2rem;
}
.legal-modal.on{display:flex}
.legal-modal .doc{
  background:#fff;width:100%;max-width:44rem;max-height:88vh;overflow:auto;
  border-radius:1rem;border:.0625rem solid var(--rule);
  padding:2.5rem 2.75rem 2rem;position:relative;
  font-family:"Inter",sans-serif;font-size:.875rem;line-height:1.6;
  color:var(--ink);letter-spacing:-.005em;
  box-shadow:0 1.5rem 4rem rgba(10,14,20,.18);
}
.legal-modal .doc::-webkit-scrollbar{width:.375rem}
.legal-modal .doc::-webkit-scrollbar-thumb{background:var(--rule-2);border-radius:99px}
.legal-modal .doc .sub{
  font-family:"Inter",sans-serif;font-size:.6563rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:.5rem;
}
.legal-modal .doc h2{
  font-family:"Instrument Serif",serif;font-weight:400;font-size:2.25rem;
  letter-spacing:-.018em;line-height:1;margin:0 0 1.5rem;color:var(--ink);
}
.legal-modal .doc h2 em{font-style:italic;color:var(--accent)}
.legal-modal .doc h3{
  font-family:"Inter",sans-serif;font-weight:600;font-size:.9375rem;
  margin:1.75rem 0 .5rem;color:var(--ink);letter-spacing:-.005em;
}
.legal-modal .doc h3:first-of-type{margin-top:0}
.legal-modal .doc p{margin:0 0 .625rem;color:var(--ink-2)}
.legal-modal .doc a{color:var(--accent);text-decoration:none}
.legal-modal .doc a:hover{text-decoration:underline}
.legal-modal .doc .row{
  display:grid;grid-template-columns:10rem 1fr;gap:.5rem 1rem;
  font-size:.8125rem;padding:.5rem 0;border-bottom:.0625rem dashed var(--rule);
}
.legal-modal .doc .row:last-of-type{border-bottom:0}
.legal-modal .doc .row .k{
  font-family:"Inter",sans-serif;font-size:.6875rem;color:var(--ink-3);
  letter-spacing:.15em;text-transform:uppercase;align-self:center;
}
.legal-modal .doc .row .v{color:var(--ink)}
.legal-modal .doc .tbd{
  color:var(--accent);font-style:italic;font-family:"Inter",sans-serif;
  font-size:.75rem;background:var(--accent-soft);padding:.0625rem .375rem;
  border-radius:.25rem;letter-spacing:.03em;
}
.legal-modal .doc ul{margin:.25rem 0 .75rem;padding-left:1.25rem;color:var(--ink-2)}
.legal-modal .doc ul li{margin-bottom:.25rem}
.legal-modal .doc .foot{
  margin-top:1.5rem;padding-top:1rem;border-top:.0625rem solid var(--rule);
  font-family:"Inter",sans-serif;font-size:.6875rem;color:var(--ink-3);
  letter-spacing:.03em;
}
.legal-modal .x{
  position:absolute;top:1.25rem;right:1.25rem;
  appearance:none;background:#fff;border:.0625rem solid var(--rule);
  width:2rem;height:2rem;border-radius:50%;cursor:pointer;
  font-size:1rem;color:var(--ink-2);display:grid;place-items:center;
  transition:.15s;
}
.legal-modal .x:hover{border-color:var(--accent);color:var(--accent);transform:rotate(90deg)}

/* ════════════════════════════════════════════════════════════════════
   RESPONSIVE — Tablet ≤1024px / Mobile ≤640px
   ════════════════════════════════════════════════════════════════════ */

/* — Tablet (≤1024px) — */
@media (max-width:1024px){
  /* Header — compact, tabs scroll horizontally if needed */
  header{grid-template-columns:auto 1fr auto;padding:14px 20px;column-gap:16px}
  .h-meta{display:flex;justify-self:end}
  .h-meta .mono{display:none}
  .h-tabs{overflow-x:auto;scrollbar-width:none}
  .h-tabs::-webkit-scrollbar{display:none}
  .h-tabs button{padding:6px 10px;font-size:14px}
  .h-tabs button .nr{display:none}

  /* Bento — 2 columns */
  .bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:auto;padding:16px;gap:12px}
  .t-pos{grid-column:1/3;grid-row:auto;padding:28px 30px;min-height:380px}
  .t-pos h1{font-size:clamp(36px,5vw,52px)}
  .pos-stats{grid-template-columns:repeat(4,1fr);gap:14px}
  .pos-stats .v{font-size:34px}
  .t-ueber{grid-column:1/3;grid-row:auto}
  .t-werke{grid-column:1/3;grid-row:auto}
  .t-lab{grid-column:1/3;grid-row:auto}

  /* Lab */
  .lab{padding:40px 28px 56px;gap:32px}
  .lab .lab-head h2{font-size:38px}
  .lab-grid{grid-template-columns:1fr 1fr}

  /* Werke — single column on tablet */
  .werke{padding:40px 28px 56px}
  .werke-grid{column-count:2;column-gap:14px}
  .pcard{margin-bottom:14px}

  /* Über */
  .ueber{padding:40px 28px 56px;grid-template-columns:repeat(6,1fr);column-gap:14px;row-gap:14px}
  .u-head{grid-column:1/7}
  .u-head h2{font-size:34px}
  .u-hero{grid-column:1/7;min-height:340px}
  .u-hero h3{font-size:52px}
  .u-intl{grid-column:1/7}
  .u-tshape{grid-column:1/3}
  .u-tools{grid-column:3/7}
  .u-tools .grid{grid-template-columns:repeat(2,1fr)}
  .u-pilot{grid-column:1/7;aspect-ratio:16/9}
  .u-werte{grid-column:1/7}
  .u-ladies{grid-column:1/7}
  .u-suche{grid-column:1/7}
  .stimmen{grid-column:1/7}
  .stim-h{flex-direction:column;align-items:flex-start;gap:16px}
  .stim-h .src{text-align:left}
  .stim{flex-basis:300px}

  /* Kontakt */
  .kontakt{padding:40px 28px 56px;gap:32px}
  .kontakt .k-head h2{font-size:48px}
  .kontakt .k-body{grid-template-columns:1fr;gap:36px}
  .kontakt .k-body .channels{width:100%;margin-left:0}
  .channels{grid-template-columns:repeat(2,1fr)}
  .ch{padding:20px}
  .ch .l{font-size:16px}
}

/* — Mobile (≤640px) — */
@media (max-width:640px){
  html,body{font-size:14.5px}

  /* Header — Logo + Verfügbarkeit + Hamburger; Tabs im Dropdown */
  header{display:flex;align-items:center;gap:12px;grid-template-columns:none;row-gap:0;padding:12px 16px;flex-wrap:wrap;position:relative}
  .h-id{justify-content:flex-start;margin-right:auto}
  .h-id .role{display:none}
  .h-meta{display:flex;align-items:center;gap:12px;order:2}
  .h-meta .mono{font-size:11px;color:var(--ink-2);letter-spacing:.02em;white-space:nowrap}
  .h-meta .h-contact{display:none}
  .h-burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;padding:0 11px;order:3;background:transparent;border:1px solid var(--rule-2);border-radius:var(--btn-radius);cursor:pointer;transition:border-color .18s ease,background .18s ease}
  .h-burger span{display:block;height:1.5px;width:100%;background:var(--ink);border-radius:2px;transition:transform .22s ease,opacity .18s ease}
  header.nav-open .h-burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  header.nav-open .h-burger span:nth-child(2){opacity:0}
  header.nav-open .h-burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .h-tabs{order:4;flex-basis:100%;width:100%;overflow:visible;flex-direction:column;gap:2px;background:transparent;border:0;padding:0;box-shadow:none;
    display:none;margin-top:2px}
  header.nav-open .h-tabs{display:flex}
  .h-tabs button{justify-content:flex-start;padding:13px 14px;font-size:15px;white-space:nowrap;width:100%;border-radius:10px}
  header.nav-open .h-contact{display:inline-flex;order:5;flex-basis:100%;width:100%;justify-content:center;margin-top:4px;padding:13px 14px;font-size:15px}

  /* Bento — single column */
  .bento{grid-template-columns:1fr;padding:12px;gap:12px}
  .t-pos,.t-ueber,.t-werke,.t-lab{grid-column:1/-1;grid-row:auto;padding:24px 22px}
  .t-pos{min-height:auto;padding:30px 24px}
  /* Portrait-Varianten auf Mobile untereinander statt zwei Spalten */
  .t-pos[data-poslayout="portrait-right"],
  .t-pos[data-poslayout="portrait-left"]{display:flex;flex-direction:column;gap:20px;grid-template-columns:none}
  .t-pos[data-poslayout="portrait-right"] .pos-main,
  .t-pos[data-poslayout="portrait-left"] .pos-main{display:flex;flex-direction:column;gap:12px}
  .t-pos[data-poslayout="portrait-right"] .pos-portrait,
  .t-pos[data-poslayout="portrait-left"] .pos-portrait{order:0;width:100%;min-height:220px;max-height:300px}
  .t-pos h1{font-size:clamp(32px,8vw,42px);margin-top:12px}
  .pos-lede{font-size:14px}
  .pos-stats{grid-template-columns:repeat(4,1fr);gap:10px}
  .pos-stats .v{font-size:24px}
  .pos-stats .k{font-size:11px}
  .tile h3{font-size:24px}
  .hv-head h2{font-size:24px}
  .wstrip{grid-template-columns:repeat(3,1fr);gap:6px}
  .wphoto{min-height:90px}
  .notes li{grid-template-columns:54px 1fr;gap:10px;font-size:14px}
  .notes .tag{grid-column:2;justify-self:start;margin-top:4px}
  /* Lesbarkeit Mobile: Fließtext auf Material-Mindestgrößen anheben */
  .exp li b{font-size:15px}
  .exp li small{font-size:15px;line-height:1.55}
  .tile .go{font-size:15px}
  .notes .ttl,.wlist .wrow .t{font-size:15px}
  .wlist .wrow .c,.ch-row .mono{font-size:13px}
  .ch-row{font-size:15px}
  /* Micro-Labels nicht unter 11px */
  .tile .t-meta,.s-stats .k,.s-foot,.s-right .top .meta{font-size:11px}

  /* Studio tile — stack wireframe over services, CTA full width */
  .studio-inner{grid-template-columns:1fr;gap:18px}
  .studio-wire{min-height:150px;max-height:190px}
  .studio-svcs{gap:14px}
  .studio-foot{flex-direction:column;align-items:flex-start;gap:10px}
  .studio-foot .sf-go{align-self:stretch;text-align:center;background:oklch(78% 0.16 230 / .12);color:oklch(82% 0.14 230);padding:11px 14px;margin:0}

  /* Lab */
  .lab{padding:28px 16px 40px;gap:20px}
  .lab .lab-head h2{font-size:30px}
  .lab .lab-lede{font-size:18px}
  .lab-grid{grid-template-columns:1fr}

  /* Werke — single column */
  .werke{padding:28px 16px 40px;gap:24px}
  .werke-grid{column-count:1}
  .pcard{margin-bottom:14px}
  .pcard .img,.pcard:nth-child(n) .img{aspect-ratio:5/4}
  .pcard .ttl{font-size:18px;left:18px;right:18px;bottom:18px}
  .pcard .img .lock{top:16px;left:18px;right:18px}
  .pcard .img .lock span{font-size:10px}
  .pcard .img .ph{font-size:38px}

  /* Über — full stack */
  .ueber{padding:28px 16px 40px;grid-template-columns:1fr;gap:12px}
  .u-head{grid-column:1/-1;flex-direction:column;align-items:flex-start;gap:10px}
  .u-head h2{font-size:30px}
  .u-head .meta{text-align:left}
  .u-hero,.u-intl,.u-tshape,.u-tools,.u-pilot,.u-werte,.stimmen{grid-column:1/-1}
  .u-hero{min-height:300px}
  .u-hero h3{font-size:44px}
  .u-hero .body{padding:20px 22px 24px}
  .u-tools .grid{grid-template-columns:1fr}
  .u-pilot{aspect-ratio:4/3}
  .u-pilot .ph{font-size:24px}
  .ucard{padding:20px;border-radius:18px}
  .stim-h h3{font-size:24px}
  .stim{flex-basis:260px;padding:16px 18px}
  .stim p{font-size:14px}

  /* Kontakt */
  .kontakt{padding:28px 16px 40px;gap:24px}
  .kontakt .k-head{flex-direction:column;align-items:flex-start;gap:12px;padding-bottom:16px}
  .kontakt .k-head h2{font-size:38px}
  .kontakt .k-head .meta{text-align:left}
  .kontakt .k-lede{font-size:16px}
  .channels{grid-template-columns:repeat(2,1fr);gap:10px}
  .ch{padding:18px}
  .ch .l{font-size:15px}
  .kf-grid{grid-template-columns:1fr;gap:14px}
  .kf-foot{gap:12px}
  .kf-submit{width:100%;justify-content:center}
  .k-direct-row .dv{display:none}

  /* Footer mobile */
  .site-foot{padding:1.5rem 1rem 1rem;gap:1.5rem}
  .foot-main{grid-template-columns:1fr 1fr;gap:1.75rem}
  .foot-brand{grid-column:1/3}
  .foot-util{grid-template-columns:1fr;gap:.625rem;text-align:left}
  .fu-col.right,.fu-col.center{justify-self:start;justify-content:flex-start}
  .legal-modal{padding:1rem}
  .legal-modal .doc{padding:1.75rem 1.5rem 1.5rem}
  .legal-modal .doc h2{font-size:1.75rem}
  .legal-modal .doc .row{grid-template-columns:1fr;gap:.125rem .5rem;padding:.625rem 0}
  .legal-modal .doc .row .k{font-size:.625rem}
}

/* Alle Start-Kachel-Listen: voll sichtbar, kein Ausblenden/Weichzeichnen */
.t-ueber .jobs li{opacity:1;filter:none}

.t-lab .notes li{opacity:1;filter:none}

.t-kontakt .ch-row{opacity:1;filter:none}