/* Publikationen – naegler.hamburg. Follows the site design system: paper
   planes, hairlines instead of shadows, ink for neutral controls, the accent
   only as a marker on the left of an overview entry, mono for dates. */

.visually-hidden {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Overview ---------- */
.pub-series-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-m); }

.pub-series {
    position: relative;
    display: grid; grid-template-columns: 1fr; gap: var(--space-m);
    padding: clamp(var(--space-6), 3vw, var(--space-8));
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
    transition: border-color .15s ease;
}
/* The accent is a marker on the left of the entry, never a fill. */
.pub-series::before {
    content: ""; position: absolute; left: -1px; top: var(--space-6); bottom: var(--space-6);
    width: 3px; background: var(--accent); border-radius: 0 2px 2px 0;
}
.pub-series:hover { border-color: var(--ink-300); }
@media (min-width: 48rem) {
    .pub-series:has(.pub-series__media) { grid-template-columns: 14rem 1fr; }
}
.pub-series__media { display: block; align-self: start; border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: clip; background: var(--surface-2); }
.pub-series__media img { display: block; width: 100%; height: auto; aspect-ratio: 40 / 21; object-fit: cover; }
.pub-series__body { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.pub-series__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0; font-family: var(--font-mono); font-size: .75rem; color: var(--text-muted); }
.pub-series__title { font-size: var(--step-3); line-height: var(--leading-h2); letter-spacing: var(--tracking-h2); margin: 0; }
.pub-series__title a { color: var(--heading); text-decoration: none; }
.pub-series__title a:hover { text-decoration: underline; text-underline-offset: .2em; }
.pub-series__teaser { margin: 0; color: var(--text); max-width: var(--measure-lead); }

.pub-badge {
    display: inline-flex; align-items: center; padding: .1rem var(--space-2);
    border-radius: var(--radius-pill); font-family: var(--font-mono); font-size: .6875rem; white-space: nowrap;
}
.pub-badge--running { background: var(--accent-soft); color: var(--accent-fg); }
.pub-badge--soon { background: var(--bg-subtle); color: var(--ink-700); }

/* ---------- Part list (overview, series page, detail aside) ---------- */
.pub-parts { list-style: none; margin: var(--space-2) 0 0; padding: 0; border-top: 1px solid var(--border-soft); }
.pub-part {
    display: grid; grid-template-columns: 1.75rem 1fr auto; gap: var(--space-1) var(--space-3);
    align-items: baseline; padding: var(--space-3) 0; border-bottom: 1px solid var(--border-soft);
}
.pub-part__no {
    display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%;
    background: var(--ink-900); color: var(--bg); font-family: var(--font-mono); font-size: .75rem; line-height: 1;
    align-self: start; margin-top: .05rem;
}
.pub-part__main { min-width: 0; }
.pub-part__title { font-family: var(--font-head); font-weight: 600; color: var(--heading); text-decoration: none; overflow-wrap: anywhere; }
a.pub-part__title:hover { text-decoration: underline; text-underline-offset: .2em; }
.pub-part__teaser { margin: var(--space-1) 0 0; color: var(--text-muted); font-size: var(--step--1); max-width: var(--measure); }
.pub-part__date { font-family: var(--font-mono); font-size: .75rem; color: var(--text-muted); white-space: nowrap; }
.pub-part--announced .pub-part__no { background: transparent; color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--border); }
.pub-part--announced .pub-part__title { color: var(--text-muted); font-weight: 500; }
.pub-part--current .pub-part__title { color: var(--accent-fg); }
.pub-part--current .pub-part__no { background: var(--accent); color: var(--on-accent); }
/* Narrow contexts (phones, the detail aside): date moves under the title. */
@media (max-width: 36rem) {
    .pub-part { grid-template-columns: 1.75rem 1fr; }
    .pub-part__date { grid-column: 2; }
}

.pub-parts--compact .pub-part { padding: var(--space-2) 0; }

.pub-empty { color: var(--text-muted); margin: 0; }

/* ---------- Series + part detail ---------- */
.pub-crumbs { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0 0 var(--space-6); font-size: var(--step--1); color: var(--text-muted); }
.pub-crumbs a { color: var(--text-muted); }
.pub-crumbs a:hover { color: var(--heading); }

.pub-preview {
    margin: 0 0 var(--space-6); padding: var(--space-3) var(--space-4);
    border: 1px dashed var(--status-open); border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--status-open) 8%, var(--surface)); color: var(--ink-700);
}

.pub-detail__head .cb-pagehead__title { max-width: 24ch; font-size: var(--step-4); }
.pub-detail__facts { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin: var(--space-4) 0 0; font-family: var(--font-mono); font-size: .75rem; color: var(--text-muted); }
.pub-detail__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-6) 0 0; }

.pub-detail__grid { display: grid; gap: var(--space-xl); grid-template-columns: 1fr; }
.pub-detail__main { min-width: 0; max-width: var(--measure-lead); }
.pub-detail__subtitle { font-size: var(--step-2); margin: 0 0 var(--space-3); }
.pub-detail__subtitle a { color: var(--heading); text-decoration: none; }
.pub-detail__subtitle a:hover { text-decoration: underline; text-underline-offset: .2em; }
.pub-detail__text { margin: 0 0 var(--space-l); }
.pub-detail__text > :last-child { margin-bottom: 0; }
.pub-detail__parts { margin-top: var(--space-l); }
.pub-detail__cover { margin: 0; }
.pub-detail__cover img { display: block; width: 100%; height: auto; border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: var(--space-4); }

/* Same breakpoint as the blog: below it the inline table of contents and the
   header download button are shown, above it the sticky sidebar takes over. */
@media (min-width: 64rem) {
    .pub-detail__grid:has(> .pub-aside, > .pub-detail__cover) { grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; }
    .pub-only-narrow { display: none; }
}
@media (max-width: 63.99rem) {
    .pub-only-wide { display: none; }
}

/* ---------- Sidebar: cards come from the template (.aside-card, .onpage-nav) ---------- */
.pub-aside { display: flex; flex-direction: column; gap: var(--space-3); }
@media (min-width: 64rem) {
    .pub-aside {
        position: sticky; top: 6rem;
        max-height: calc(100vh - 7rem); overflow-y: auto; overscroll-behavior: contain;
        scrollbar-width: thin;
    }
}
.pub-aside__title { font-size: var(--step-0); line-height: var(--leading-h3); margin: 0 0 var(--space-2); }
.pub-aside__title a { color: var(--heading); text-decoration: none; }
.pub-aside__title a:hover { color: var(--accent-fg); }
.pub-aside__series .pub-parts { border-top-color: var(--border); }
.pub-aside__series .pub-part { border-bottom-color: var(--border); }
.pub-aside__series .pub-part:last-child { border-bottom: 0; padding-bottom: 0; }
.pub-aside .pub-part { grid-template-columns: 1.75rem 1fr; padding: var(--space-2) 0; font-size: var(--step--1); }
.pub-aside .pub-part__date { grid-column: 2; }

.pub-pager { display: grid; gap: var(--space-3); grid-template-columns: 1fr; margin-top: var(--space-l); padding-top: var(--space-l); border-top: 1px solid var(--border); }
@media (min-width: 40rem) { .pub-pager { grid-template-columns: 1fr 1fr; } }
.pub-pager__link {
    display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-4);
    border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface);
    color: var(--heading); text-decoration: none; transition: border-color .15s ease;
}
a.pub-pager__link:hover { border-color: var(--ink-900); }
.pub-pager__link--next { text-align: right; grid-column: -2; }
.pub-pager__link--soon { color: var(--text-muted); background: transparent; border-style: dashed; }
.pub-pager__dir { font-family: var(--font-mono); font-size: .75rem; color: var(--text-muted); }
.pub-pager__name { font-family: var(--font-head); font-weight: 600; }

/* ---------- "Neueste Publikationen" element ---------- */
.pub-latest { margin-block: var(--space-xl); }
.pub-latest__title { font-size: var(--step-3); margin: 0 0 var(--space-4); }
.pub-latest__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
@media (min-width: 48rem) { .pub-latest__list { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); } }
.pub-latest__item { position: relative; }
.pub-latest__link {
    display: flex; flex-direction: column; gap: var(--space-1); height: 100%;
    padding: var(--space-4) var(--space-4) var(--space-4) calc(var(--space-4) + 3px);
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
    color: var(--text); text-decoration: none; transition: border-color .15s ease;
}
.pub-latest__link::before { content: ""; position: absolute; left: 0; top: var(--space-4); bottom: var(--space-4); width: 3px; background: var(--accent); }
.pub-latest__link:hover { border-color: var(--ink-300); }
.pub-latest__meta { font-family: var(--font-mono); font-size: .75rem; color: var(--text-muted); }
.pub-latest__name { font-family: var(--font-head); font-weight: 600; color: var(--heading); }
.pub-latest__series { font-size: var(--step--1); color: var(--text-muted); }
.pub-latest__item--announced .pub-latest__link { background: transparent; border-style: dashed; }
.pub-latest__item--announced .pub-latest__link::before { background: var(--border); }
.pub-latest__more { margin: var(--space-4) 0 0; }

/* ---------- Full text of a part (web version of the paper) ---------- */
.pub-detail__audience { margin: var(--space-3) 0 0; font-size: var(--step--1); color: var(--text); max-width: var(--measure-lead); }
.pub-detail__audience-label { display: inline-block; min-width: 2.5rem; font-size: .75rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-fg); }
.pub-download__button { gap: var(--space-3); }
.pub-download__meta { font-family: var(--font-mono); font-size: .75rem; font-weight: 400; opacity: .75; }
.pub-download__meta:empty { display: none; }

.pub-toc { margin: 0 0 var(--space-xl); }
.pub-toc__title { font-size: var(--step-2); margin: 0 0 var(--space-3); }
.pub-toc__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
.pub-toc__item a {
    display: grid; grid-template-columns: 1.75rem 1fr; gap: var(--space-3); align-items: baseline;
    padding: var(--space-3) 0; border-bottom: 1px solid var(--border);
    color: var(--heading); font-family: var(--font-head); font-weight: 600; text-decoration: none;
}
.pub-toc__item a:hover { color: var(--accent-fg); }
.pub-toc__num { color: var(--accent-fg); font-variant-numeric: tabular-nums; }
.pub-toc__item--plain a { font-weight: 400; color: var(--text); }

.pub-article { color: var(--text); }
.pub-article > :first-child { margin-top: 0; }
.pub-article [id] { scroll-margin-top: var(--space-8); }
.pub-article h2 {
    font-size: var(--step-4); line-height: var(--leading-h1); letter-spacing: var(--tracking-h1);
    margin: var(--space-xl) 0 var(--space-4); color: var(--heading);
}
.pub-article h2 .pub-num { color: var(--accent-fg); margin-right: .15em; }
.pub-article h3 { font-size: var(--step-1); margin: var(--space-l) 0 var(--space-3); color: var(--heading); }
.pub-article p, .pub-article li { line-height: 1.65; }
.pub-article .pub-lead { font-size: var(--step-1); line-height: 1.55; color: var(--text-muted); margin-bottom: var(--space-l); }
.pub-article .pub-note { font-size: var(--step--1); color: var(--text-muted); margin-top: calc(-1 * var(--space-2)); }
.pub-article ol, .pub-article ul { padding-left: 1.4rem; }
.pub-article li { margin: var(--space-2) 0; }
.pub-article li::marker { color: var(--accent-fg); font-weight: 600; }
.pub-article a { color: var(--accent-fg); text-underline-offset: .2em; }

/* Evidence labels – the reading key of the paper */
.pub-label {
    display: inline-flex; align-items: center; margin-right: var(--space-2); padding: .1rem .55rem;
    border-radius: var(--radius-pill); font-family: var(--font-body); font-size: .625rem; font-weight: 600;
    letter-spacing: .14em; text-transform: uppercase; line-height: 1.5; vertical-align: .12em; white-space: nowrap;
}
.pub-label--befund { background: var(--ink-900); color: var(--bg); }
.pub-label--praxis { border: 1px solid var(--accent); color: var(--accent-fg); background: transparent; }
.pub-label--einordnung { background: var(--bg-subtle); border: 1px solid var(--border); color: var(--ink-700); }
.pub-label--empfehlung { background: var(--accent-soft); color: var(--accent-fg); }

/* Key statement */
.pub-article blockquote {
    margin: var(--space-l) 0; padding: var(--space-4) var(--space-6);
    background: var(--surface); border-left: 3px solid var(--accent); border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    font-size: var(--step-1); line-height: 1.5; color: var(--heading);
}
.pub-article blockquote > :first-child { margin-top: 0; }
.pub-article blockquote > :last-child { margin-bottom: 0; }

/* Tables */
.pub-table { overflow-x: auto; margin: var(--space-4) 0 var(--space-l); -webkit-overflow-scrolling: touch; }
.pub-table table { width: 100%; min-width: 34rem; border-collapse: collapse; font-size: var(--step--1); }
.pub-table th {
    text-align: left; padding: 0 var(--space-3) var(--space-2) 0; border-bottom: 1.5px solid var(--ink-900);
    font-size: .6875rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-fg);
}
.pub-table td { padding: var(--space-3) var(--space-3) var(--space-3) 0; border-bottom: 1px solid var(--border); vertical-align: top; line-height: 1.5; }
.pub-table td:first-child { font-weight: 600; color: var(--heading); }
.pub-table--plain td:first-child { font-weight: 400; color: var(--text); }

/* Boxes: recommendation lists, legend, contact, check questions */
.pub-box { margin: var(--space-l) 0; padding: var(--space-6); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.pub-box > :first-child { margin-top: 0; }
.pub-box > :last-child { margin-bottom: 0; }
.pub-box h3 { margin-top: 0; font-size: var(--step-1); }
.pub-box--check { background: var(--accent-soft); border-color: transparent; }
.pub-box--check h3 { color: var(--accent-fg); }
.pub-box--legend { background: transparent; }

.pub-article ul.pub-checklist { list-style: none; padding-left: 0; }
.pub-article .pub-checklist li { position: relative; padding-left: 1.9rem; }
.pub-article .pub-checklist li::before {
    content: ""; position: absolute; left: 0; top: .3em; width: 1rem; height: 1rem;
    border: 1.5px solid var(--accent-fg); border-radius: 3px; background: var(--surface);
}

.pub-article ul.pub-contact { list-style: none; padding-left: 0; display: grid; gap: var(--space-2); }
.pub-article .pub-contact li { margin: 0; display: grid; grid-template-columns: 6rem 1fr; gap: var(--space-3); }
.pub-article .pub-contact strong { font-size: .6875rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-fg); }

/* Footnotes and sources */
.pub-article sup.pub-ref { line-height: 0; font-size: .7em; }
.pub-article sup.pub-ref a { font-weight: 700; text-decoration: none; padding: 0 .1em; }
.pub-article sup.pub-ref a:hover { text-decoration: underline; }
.pub-article ol.pub-sources { font-size: var(--step--1); }
.pub-article ol.pub-sources li { overflow-wrap: anywhere; }
.pub-article ol.pub-sources li:target { background: var(--accent-soft); outline: 4px solid var(--accent-soft); border-radius: 2px; }

.pub-download {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4);
    margin: var(--space-xl) 0 0; padding: var(--space-6); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
}
.pub-download__title { font-size: var(--step-1); margin: 0 0 var(--space-1); }
.pub-download__text { margin: 0; font-size: var(--step--1); color: var(--text-muted); }
.pub-article ol.pub-sources + .pub-note { margin-top: var(--space-6); }
/* Long German compounds ("Erreichbarkeitsvereinbarung") must not overflow on phones. */
.pub-detail h1, .pub-article h2, .pub-article h3, .pub-series__title, .pub-toc__item a { overflow-wrap: break-word; hyphens: auto; }
.pub-preview--inline { margin: 0; padding: var(--space-1) var(--space-3); font-size: var(--step--1); }