/* ============ NEWS — Übersicht (Figma große Ansicht 583:14 · Liste 562:5) und Artikel (563:2); Mobil N-M1/N-M2/N-M3, 13.10. ============
   Filterzeile und Umschalter wie Work. Schriften aus typo.css (Rollen), Maße in Design-Pixeln var(--u). */
.seitenkopf{padding-left:var(--rand);padding-right:var(--rand)}

.n-werke{padding-bottom:calc(150 * var(--u))}
.n-werke [hidden]{display:none}

/* Leiste: Filter ab der Kerbe (x 200), Umschalter rechts; 80 unter der H1 */
.n-leiste{display:flex;justify-content:space-between;align-items:flex-start;height:calc(24 * var(--u));margin-top:calc(80 * var(--u));padding-left:calc(170 * var(--u))}
.n-leiste button{background:none;border:0;padding:0;font:inherit;color:var(--gedaempft);cursor:pointer;transition:color .15s}
.n-leiste button:hover,.n-leiste button[aria-pressed="true"]{color:var(--ink)}
.n-leiste button:focus-visible{outline:1.5px solid var(--ink);outline-offset:calc(4 * var(--u));border-radius:calc(2 * var(--u))}
.n-filter{display:flex;gap:calc(40 * var(--u));margin-top:calc(1 * var(--u))}
.n-filter button{display:inline-flex;align-items:flex-start;font-family:var(--font-b);font-weight:600;font-size:var(--fs-label);line-height:var(--lh-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.n-filter button[aria-pressed="true"] .n-fname{text-decoration:underline;text-decoration-thickness:1.25px;text-underline-offset:calc(2 * var(--u))}
.n-fzahl{font:600 calc(10 * var(--u))/calc(12 * var(--u)) var(--font-b);letter-spacing:0;color:var(--gedaempft);margin-left:calc(4 * var(--u));position:relative;top:-4px}
.n-ansichten{display:flex;gap:calc(12 * var(--u));margin-right:-4px}
.n-leiste .n-ansicht{position:relative;display:flex;align-items:flex-start;height:calc(24 * var(--u));padding:0 calc(4 * var(--u))}
.n-ansicht svg{display:block}
.n-ansicht::after{content:"";position:absolute;left:calc(4 * var(--u));top:calc(21 * var(--u));width:calc(16 * var(--u));height:1.5px;background:currentColor;opacity:0}
.n-ansicht[aria-pressed="true"]::after{opacity:1}

.n-buehne{transition:opacity .12s ease}
.n-buehne.blende{opacity:0}
@media (prefers-reduced-motion:reduce){.n-buehne{transition:none}}

/* ---------- große Ansicht: Zeile 442 hoch, Bild 670 × 394 · Text (x 730, Titel 540) · Pfeil (x 1382) ---------- */
.n-gross{margin-top:calc(31 * var(--u));border-bottom:1px solid rgba(26,26,26,.18)}
.n-reihe{display:grid;grid-template-columns:minmax(0,670fr) minmax(0,622fr) calc(28 * var(--u));column-gap:calc(30 * var(--u));align-items:stretch;padding:calc(23 * var(--u)) 0 calc(24 * var(--u));border-top:1px solid rgba(26,26,26,.18)}
.n-bild{aspect-ratio:670/394;border-radius:var(--radius);overflow:hidden;isolation:isolate}
.n-bild img,.n-zbild img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.n-reihe:hover .n-bild img{transform:scale(1.03)}
.n-text{display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.n-titel{max-width:calc(540 * var(--u));margin-top:calc(7 * var(--u));font-family:var(--font-h);font-weight:500;font-size:var(--fs-titel-s);line-height:var(--lh-titel-s);letter-spacing:var(--ls-titel-s)}
.n-meta{display:flex;gap:calc(21 * var(--u));margin-bottom:calc(1 * var(--u));font-family:var(--font-b);font-weight:600;font-size:var(--fs-meta);line-height:var(--lh-meta);letter-spacing:var(--ls-meta);text-transform:uppercase}
.n-meta time,.n-zdatum,.n-artmeta time{color:var(--gedaempft)}
.n-pfeil{justify-self:end;margin-top:calc(4 * var(--u));font-family:var(--font-h);font-weight:500;font-size:calc(28 * var(--u));line-height:calc(32 * var(--u));transition:transform .25s ease}
.n-reihe:hover .n-pfeil,.n-zeile:hover .n-pfeil{transform:translateX(calc(6 * var(--u)))}

/* ---------- Liste: Zeile 140 hoch, Bild 160 × 100 · Kategorie + Titel (x 200) · Datum (x 1080) · Pfeil ---------- */
.n-liste{margin-top:calc(31 * var(--u));border-bottom:1px solid rgba(26,26,26,.18)}
.n-zeile{display:grid;grid-template-columns:calc(170 * var(--u)) 880fr 302fr calc(28 * var(--u));align-items:start;min-height:calc(140 * var(--u));padding:calc(19 * var(--u)) 0 calc(20 * var(--u));border-top:1px solid rgba(26,26,26,.18)}
.n-zeile .n-pfeil{margin-top:0}
.n-zbild{width:calc(160 * var(--u));height:calc(100 * var(--u));border-radius:var(--radius);overflow:hidden;isolation:isolate}
.n-zeile:hover .n-zbild img{transform:scale(1.04)}
.n-zkat,.n-zdatum{display:block;font-family:var(--font-b);font-weight:600;font-size:var(--fs-label);line-height:var(--lh-label);letter-spacing:var(--ls-label);text-transform:uppercase;padding-top:calc(3 * var(--u))}
.n-ztitel{font-family:var(--font-h);font-weight:500;font-size:var(--fs-zeile);line-height:var(--lh-zeile);letter-spacing:var(--ls-zeile);margin-top:calc(11 * var(--u));max-width:min(calc(840 * var(--u)), calc(100% - calc(30 * var(--u))))}

/* ---------- Artikel: Kategorie + Datum 33 unter der H1, Bild 1380 × 776 (+48), Lead (+123), Absätze 49/25, 150 bis zum Footer ---------- */
article{padding-bottom:calc(150 * var(--u))}
.n-artmeta{display:flex;gap:calc(34 * var(--u));margin-top:calc(33 * var(--u));padding:0 var(--rand) 0 calc(var(--rand) + 170 * var(--u));font-family:var(--font-b);font-weight:600;font-size:var(--fs-label);line-height:var(--lh-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.n-artbild{margin:calc(48 * var(--u)) var(--rand) 0;aspect-ratio:1380/776;border-radius:var(--radius);overflow:hidden}
.n-arttext{padding:calc(123 * var(--u)) var(--rand) 0 calc(var(--rand) + 170 * var(--u))}
.n-arttext p{max-width:calc(760 * var(--u));font-family:var(--font-b);font-weight:400;font-size:var(--fs-text-l);line-height:var(--lh-text-l);letter-spacing:var(--ls-text-l);color:rgba(26,26,26,.78)}
.n-arttext .n-lead{font-size:var(--fs-lead);line-height:var(--lh-lead);letter-spacing:var(--ls-lead);color:var(--ink)}
.n-arttext p + p{margin-top:calc(25 * var(--u))}
.n-arttext .n-lead + p{margin-top:calc(49 * var(--u))}
/* Link im Artikeltext (erstmals Pop-up-News, Figma 1898:8 / 1898:44): Ink statt Textgrau, unterstrichen; Linie wie Figma knapp 0,18 em unter der Grundlinie */
.n-arttext a{color:var(--ink);text-decoration:underline;text-underline-offset:.18em}
.n-weiteres{margin-top:calc(100 * var(--u))}

/* Tablet (noch nicht designt): Leiste ohne Kerbe, Liste kompakter, Artikeltext ab dem Rand */
@media (max-width:1100px){
  .n-leiste{padding-left:0;margin-top:calc(56 * var(--u))}
  .n-filter{gap:calc(24 * var(--u))}
  .n-reihe{grid-template-columns:minmax(0,1fr) minmax(0,1fr) calc(28 * var(--u));column-gap:calc(20 * var(--u))}
  .n-zeile{grid-template-columns:calc(120 * var(--u)) 1fr calc(28 * var(--u));column-gap:calc(16 * var(--u))}
  .n-zbild{width:calc(120 * var(--u));height:calc(75 * var(--u))}
  .n-zdatum{grid-column:2;grid-row:2;padding-top:calc(8 * var(--u))}
  .n-zeile .n-pfeil{grid-column:3;grid-row:1}
  .n-artmeta,.n-arttext{padding-left:var(--rand)}
}

/* Mobil: N-M1 Kacheln wie die News auf Home (Bild 350 × 206, Titel +12, Kategorie + Datum +8, 64 Abstand), N-M2 wie der Work-Index, N-M3 Artikel */
@media (max-width:760px){
  .n-leiste{margin-top:39px}
  .n-fzahl{margin-left:5px}
  /* Trefferflächen der Filter (B8, Optik unverändert): unsichtbare Fläche ::before, 44 hoch (Liste 32 darunter), die 24er-Lücke je zur Hälfte */
  .n-filter button{position:relative}
  .n-filter button::before{content:"";position:absolute;inset:-15.5px -12px}
  .n-werke{padding-bottom:80px}
  .n-gross{margin-top:32px;border-bottom:0}
  .n-reihe{display:block;padding:0;border-top:0}
  .n-reihe + .n-reihe{margin-top:64px}
  .n-text{display:block}
  .n-titel{margin-top:12px;max-width:none}
  .n-meta{margin:8px 0 0;gap:20px}
  .n-pfeil{display:none}
  .n-liste{margin-top:32px}
  .n-zeile{grid-template-columns:96px minmax(0,1fr) auto;column-gap:12px;min-height:0;padding:15px 0 16px}
  .n-zbild{grid-column:1;grid-row:1;width:96px;height:60px}
  .n-ztext{grid-column:2 / 4;grid-row:1}
  .n-zdatum{grid-column:3;grid-row:1;justify-self:end;padding-top:0}
  .n-zkat{padding-top:0;padding-right:90px}
  .n-ztitel{margin-top:6px;max-width:none}
  article{padding-bottom:80px}
  .n-artmeta{margin-top:24px;gap:20px}
  .n-artbild{margin-top:40px;aspect-ratio:16/9}
  .n-arttext{padding-top:80px}
  .n-arttext p + p{margin-top:20px}
  .n-arttext .n-lead + p{margin-top:32px}
  .n-weiteres{margin-top:64px}
}
/* DE (/de/news/): „UNTERNEHMEN“ ist länger als „COMPANY“ — unter 375 px stieße die Filterzeile sonst an den Ansicht-Umschalter; EN unverändert */
@media (max-width:374px){html[lang="de"] .n-filter{gap:16px}html[lang="de"] .n-filter button::before{left:-8px;right:-8px}}