/* =========================================================
   Fachmagazin „Praxis & Prävention“
   Zeitungstypografie: Newsreader (Serif) für Titel und Lesetext,
   Manrope/Inter für Kennzeichnungen und Metadaten
   ========================================================= */
@font-face { font-family: "Newsreader"; src: url("assets/fonts/newsreader-variable.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("assets/fonts/newsreader-variable-italic.woff2") format("woff2"); font-weight: 200 800; font-style: italic; font-display: swap; }

.mag { --serif: "Newsreader", "Iowan Old Style", Georgia, serif; --ink: #14232b; --paper: #fbfaf6; --rule: #d8d3c8; background: var(--paper); color: var(--ink); padding-bottom: clamp(3rem, 2rem + 4vw, 6rem); }
.mag a { color: inherit; }

/* ---------- Kopf (Zeitungstitel) ---------- */
.mh { padding-top: clamp(1rem, 0.5rem + 1.5vw, 2rem); }
.mh-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--rule); font: 600 0.75rem/1.2 var(--font-head); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.mh-top-r { display: flex; align-items: center; gap: 1rem; }
.mh-top a { text-decoration: none; }
.mh-search { display: flex; align-items: center; border-bottom: 1px solid var(--rule); }
.mh-search input { width: 9rem; border: 0; background: transparent; font: 500 0.875rem var(--font-body); color: var(--ink); padding: 0.25rem 0; text-transform: none; letter-spacing: 0; }
.mh-search input:focus { outline: none; width: 13rem; }
.mh-search button { border: 0; background: none; color: var(--petrol); cursor: pointer; padding: 0.25rem; }
.mh-title { display: block; margin-top: clamp(0.75rem, 0.5rem + 1vw, 1.5rem); text-align: center; text-decoration: none; font: 700 clamp(2.5rem, 1.2rem + 6vw, 5.75rem)/0.95 var(--serif); font-variation-settings: "opsz" 72; letter-spacing: -0.025em; color: var(--petrol); }
.mh-sub { margin: 0.55rem 0 0; text-align: center; font: italic 400 clamp(1rem, 0.9rem + 0.4vw, 1.25rem)/1.3 var(--serif); color: var(--muted); }
.mh-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.25rem 1.6rem; margin-top: clamp(1rem, 0.75rem + 1vw, 1.5rem); padding: 0.75rem 0; border-top: 3px double var(--ink); border-bottom: 1px solid var(--ink); font: 700 0.75rem/1.2 var(--font-head); letter-spacing: 0.12em; text-transform: uppercase; }
.mh-nav a { text-decoration: none; padding: 0.25rem 0; border-bottom: 2px solid transparent; transition: border-color 150ms ease, color 150ms ease; }
.mh-nav a[aria-current="page"] { border-color: var(--green); color: var(--green-700); }
@media (hover: hover) and (pointer: fine) { .mh-nav a:hover { color: var(--green-700); } }
@media (max-width: 720px) {
  .mh-top span:first-child { display: none; } .mh-top { justify-content: flex-end; }
  .mh-nav { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; gap: 1.25rem; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .mh-nav::-webkit-scrollbar { display: none; }
  .mh-nav a { white-space: nowrap; }
}

/* ---------- Kennzeichnung ---------- */
.kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; margin: 0 0 0.6rem; font: 800 0.6875rem/1.2 var(--font-head); letter-spacing: 0.14em; text-transform: uppercase; }
.k-type { color: var(--green-700); }
.k-type.k-reportage { color: #6a4fa3; } .k-type.k-interview { color: #b0601a; } .k-type.k-kurzmeldung { color: var(--petrol); } .k-type.k-praxistipp { color: var(--green-700); }
.k-cat { color: var(--muted); font-weight: 700; }
.k-cat::before { content: ""; display: inline-block; width: 1px; height: 0.8em; margin-right: 0.6rem; background: var(--rule); vertical-align: -1px; }
.meta { display: flex; flex-wrap: wrap; gap: 0.15rem 0.9rem; margin: 0.75rem 0 0; font: 500 0.8125rem/1.4 var(--font-body); color: var(--muted); }
.meta > * + *::before { content: "·"; margin-right: 0.9rem; }
.sec-title { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: clamp(2.25rem, 1.5rem + 2vw, 3.5rem) 0 1.25rem; padding-top: 0.6rem; border-top: 3px solid var(--ink); font: 800 0.8125rem/1.2 var(--font-head); letter-spacing: 0.14em; text-transform: uppercase; }
.sec-title a { font-weight: 700; letter-spacing: 0.04em; text-transform: none; font-size: 0.875rem; color: var(--green-700); text-decoration: none; }

/* ---------- Aufmacher ---------- */
.lead { display: grid; gap: clamp(1.25rem, 1rem + 2vw, 3rem); margin-top: clamp(1.5rem, 1rem + 2vw, 2.75rem); align-items: start; }
@media (min-width: 960px) { .lead { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); } }
.lead-img { display: block; overflow: hidden; aspect-ratio: 3 / 2; background: #e9e6dd; }
.lead-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .lead-img:hover img { transform: scale(1.025); } }
.lead-title { margin: 0; font: 700 clamp(2rem, 1.2rem + 3vw, 3.5rem)/1.04 var(--serif); font-variation-settings: "opsz" 60; letter-spacing: -0.02em; color: var(--ink); text-wrap: balance; }
.lead-title a, .card h3 a, .brief h3 a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size 300ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .lead-title a:hover, .card h3 a:hover, .brief h3 a:hover { background-size: 100% 1px; } }
.lead-sub { margin: 0.75rem 0 0; font: italic 400 1.25rem/1.4 var(--serif); color: var(--muted); }
.lead-teaser { margin: 1rem 0 0; font: 400 1.1875rem/1.6 var(--serif); color: #2a3a42; }
.lead-more { display: inline-block; margin-top: 1.1rem; font: 700 0.875rem var(--font-head); color: var(--green-700); text-decoration: none; }
.lead-more span { display: inline-block; transition: transform 200ms var(--ease-out); }
.lead-more:hover span { transform: translateX(3px); }

/* ---------- Titelseite: Raster ---------- */
.front { display: grid; gap: 0 clamp(2rem, 1.5rem + 2vw, 3.5rem); }
@media (min-width: 1000px) { .front { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } .front-side { border-left: 1px solid var(--rule); padding-left: clamp(1.5rem, 1rem + 1vw, 2.5rem); } }
.grid-2 { display: grid; gap: 2rem clamp(1.25rem, 1rem + 1vw, 2rem); }
.grid-3 { display: grid; gap: 2rem clamp(1.25rem, 1rem + 1vw, 2rem); }
@media (min-width: 700px) { .grid-2, .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.card { display: flex; flex-direction: column; gap: 0.9rem; }
.c-img { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #e9e6dd; }
.c-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .card:hover .c-img img { transform: scale(1.03); } }
.card h3 { margin: 0; font: 700 clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem)/1.18 var(--serif); letter-spacing: -0.01em; color: var(--ink); text-wrap: balance; }
.c-teaser { margin: 0.55rem 0 0; font: 400 1rem/1.55 var(--serif); color: #3a4a52; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.card.no-img:not(.card-row) { padding: 1.5rem 1.4rem 1.4rem; border-top: 3px solid var(--ink); background: rgb(18 54 74 / 0.045); }
.card.no-img:not(.card-row) h3 { font-size: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem); }
.card-mini h3 { font-size: 1.1875rem; }
.card-row { display: grid; gap: 1.25rem; padding: 1.5rem 0; border-bottom: 1px solid var(--rule); }
@media (min-width: 760px) { .card-row { grid-template-columns: 320px minmax(0, 1fr); gap: 2rem; } }
.card-row h3 { font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem); }

.brief { padding: 1rem 0; border-bottom: 1px solid var(--rule); }
.brief:first-of-type { padding-top: 0; }
.brief h3 { margin: 0; font: 600 1.125rem/1.3 var(--serif); }
.brief .meta { margin-top: 0.4rem; font-size: 0.75rem; }
.side-about { margin-top: 1.75rem; padding: 1.25rem; background: var(--petrol); color: #dbe5e8; }
.side-about p { margin: 0 0 0.6rem; font: 400 0.9375rem/1.55 var(--serif); }
.side-about .sa-title { font: 700 1.375rem/1.1 var(--serif); color: #fff; }
.side-about a { color: var(--green-300); font: 700 0.8125rem var(--font-head); text-decoration: none; }
.all-link { text-align: center; margin-top: 3rem; }
.empty-note { color: var(--muted); font-family: var(--serif); font-size: 1.125rem; }
.mag-empty, .mag-404 { padding-block: clamp(3rem, 2rem + 4vw, 6rem); max-width: 46rem; }
.mag-empty h1, .mag-404 h1 { font: 700 clamp(2rem, 1.5rem + 2vw, 3rem)/1.1 var(--serif); margin: 0 0 1rem; }
.mag-empty p, .mag-404 p { font: 400 1.1875rem/1.6 var(--serif); color: #3a4a52; }

/* ---------- Übersicht ---------- */
.list-head { padding-top: clamp(1.75rem, 1.25rem + 2vw, 3rem); }
.list-head h1 { margin: 0; font: 700 clamp(2.25rem, 1.5rem + 3vw, 3.75rem)/1.05 var(--serif); letter-spacing: -0.02em; }
.list-desc { max-width: 46rem; margin: 0.75rem 0 0; font: 400 1.1875rem/1.55 var(--serif); color: #3a4a52; }
.type-filter { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ink); }
.type-filter a { padding: 0.4rem 0.85rem; border: 1px solid var(--rule); border-radius: 999px; font: 600 0.8125rem/1 var(--font-head); text-decoration: none; background: #fff; }
.type-filter a[aria-current="page"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.pager { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 2rem; font: 600 0.875rem var(--font-head); }
.pager a { color: var(--green-700); text-decoration: none; }

/* ---------- Beitrag ---------- */
.read-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 100; pointer-events: none; }
.read-progress span { display: block; height: 100%; width: 100%; background: var(--green); transform-origin: 0 50%; transform: scaleX(0); }
.preview-bar { position: sticky; top: 0; z-index: 90; padding: 0.55rem 1rem; background: #fff3cd; color: #5c4708; text-align: center; font: 600 0.875rem var(--font-head); border-bottom: 1px solid #ecd9a0; }
.art-head { max-width: 1240px; padding-top: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.art-crumb { margin-bottom: 1.25rem; font: 600 0.8125rem var(--font-head); color: var(--muted); }
.art-crumb a { text-decoration: none; color: var(--muted); }
.art-crumb a:hover { color: var(--green-700); }
.art h1 { margin: 0; font: 700 clamp(2.25rem, 1.3rem + 3.6vw, 4rem)/1.04 var(--serif); font-variation-settings: "opsz" 72; letter-spacing: -0.022em; color: var(--ink); text-wrap: balance; }
.art-sub { margin: 0.85rem 0 0; font: italic 400 clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem)/1.35 var(--serif); color: var(--muted); }
.art-lead { margin: 1.5rem 0 0; font: 600 clamp(1.1875rem, 1.1rem + 0.35vw, 1.375rem)/1.55 var(--serif); color: var(--ink); }
.art-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.5rem; margin-top: 1.75rem; padding: 1rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); }
.art-byline > div:first-child { margin-right: auto; }
.by-name { margin: 0; font: 700 0.9375rem var(--font-head); }
.by-role { margin: 0.1rem 0 0; font: 400 0.8125rem var(--font-body); color: var(--muted); }
.by-meta { margin: 0; font: 500 0.8125rem var(--font-body); color: var(--muted); }
.share { display: flex; align-items: center; gap: 0.35rem; }
.share > span { font: 700 0.6875rem var(--font-head); letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin-right: 0.25rem; }
.share a, .share button { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--rule); border-radius: 50%; background: #fff; color: var(--petrol); cursor: pointer; transition: border-color 150ms ease, color 150ms ease, transform 160ms var(--ease-out); }
.share a:active, .share button:active { transform: scale(0.94); }
.share .is-done { border-color: var(--green); color: var(--green-700); }
@media (hover: hover) and (pointer: fine) { .share a:hover, .share button:hover { border-color: var(--petrol); } }

.art-cover { margin: clamp(1.75rem, 1.25rem + 2vw, 3rem) auto 0; max-width: 1240px; }
.art-cover img { width: 100%; height: auto; display: block; }
.art-cover figcaption, .mag-fig figcaption, .mag-gallery figcaption, .mag-table figcaption, .art-herocap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; margin-top: 0.6rem; font: 400 0.875rem/1.45 var(--font-body); color: var(--muted); }
.mag-credit { font-size: 0.75rem; letter-spacing: 0.02em; color: #8a958f; }

/* Reportage: großes Titelbild mit Überschrift */
.art-herohead { position: relative; min-height: clamp(26rem, 60vh, 44rem); display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: var(--ink); }
.art-herohead img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.art-herohead::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(10 20 26 / 0) 30%, rgb(10 20 26 / 0.82) 100%); }
.art-herotext { position: relative; z-index: 1; padding-block: clamp(2rem, 1.5rem + 3vw, 4rem); max-width: 980px; }
.art-herotext h1 { color: #fff; font-size: clamp(2.5rem, 1.4rem + 4.4vw, 5rem); }
.art-herotext .art-sub { color: #e2e9ea; }
.art-herotext .k-type, .art-herotext .k-cat { color: var(--green-300); }
.art-hero .art-head { padding-top: 0.5rem; max-width: 860px; }
.art-herocap { margin-top: 0.6rem; }

.art-layout { display: grid; max-width: 1240px; margin-top: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
@media (min-width: 1180px) { .art-layout.has-toc { grid-template-columns: 220px minmax(0, 1fr); gap: 3rem; } }
.art-toc { display: none; }
@media (min-width: 1180px) {
  .art-toc { display: block; position: sticky; top: calc(var(--header-h, 76px) + 1.5rem); align-self: start; font: 500 0.875rem/1.45 var(--font-body); }
  .art-toc p { margin: 0 0 0.75rem; font: 800 0.6875rem var(--font-head); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
  .art-toc ol { list-style: none; margin: 0; padding: 0 0 0 0.9rem; border-left: 1px solid var(--rule); display: grid; gap: 0.6rem; }
  .art-toc a { text-decoration: none; color: var(--muted); display: block; transition: color 150ms ease; }
  .art-toc a.is-active { color: var(--ink); font-weight: 600; }
}
.art-body { max-width: none; width: 100%; margin-inline: auto; font: 400 clamp(1.0625rem, 1rem + 0.3vw, 1.21875rem)/1.72 var(--serif); font-variation-settings: "opsz" 16; color: #1d2b33; hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }
.has-toc .art-body { margin-inline: 0 auto; }
@media (min-width: 1180px) { .has-toc .art-body { margin-inline: auto; } }
.art-body > * + * { margin-top: 1.15em; }
.art-body p { margin-bottom: 0; }
.art-body a { color: var(--green-700); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.art-body strong { font-weight: 650; color: var(--ink); }
.has-dropcap .mag-first::first-letter { float: left; margin: 0.08em 0.12em 0 0; font: 700 4.6em/0.78 var(--serif); font-variation-settings: "opsz" 72; color: var(--petrol); }
.art-body h2 { margin-top: 2.2em; font: 700 clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem)/1.2 var(--serif); letter-spacing: -0.01em; color: var(--ink); scroll-margin-top: calc(var(--header-h, 76px) + 1rem); hyphens: manual; }
.art-body h2::before { content: ""; display: block; width: 42px; height: 3px; margin-bottom: 0.75rem; background: var(--green); }
.art-body h3 { margin-top: 1.8em; font: 700 1.25rem/1.3 var(--font-head); color: var(--petrol); hyphens: manual; }
.art-body ul { padding-left: 1.2em; list-style: disc; }
.art-body ol { padding-left: 1.4em; list-style: decimal; }
.art-body li + li { margin-top: 0.35em; }
.art-body li::marker { color: var(--green); }

.mag-fig { margin-inline: 0; }
.mag-fig img { width: 100%; height: auto; display: block; background: #e9e6dd; }
.mag-fig.is-wide { width: 100%; }
@media (min-width: 760px) { .mag-fig.is-half { float: right; width: 48%; margin: 0.4em 0 1em 1.75rem; } .mag-fig.is-half + * { margin-top: 0; } }
.mag-gallery { margin-inline: 0; }
.mag-gal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.4rem; }
.mag-gallery[data-count="2"] .mag-gal-grid { grid-template-columns: 1fr 1fr; }
.mag-gallery[data-count="3"] .mag-gal-grid { grid-template-columns: repeat(3, 1fr); }
.mag-gal-item { display: block; aspect-ratio: 1; overflow: hidden; background: #e9e6dd; cursor: zoom-in; }
.mag-gal-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .mag-gal-item:hover img { transform: scale(1.04); } }
.mag-quote { margin: 2em 0; padding: 1.4em 0 1.2em; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); text-align: left; position: relative; }
.mag-quote::before { content: "„"; position: absolute; top: -0.12em; left: 0; transform: translateY(-58%); padding-right: 0.15em; background: var(--paper); font: 700 4rem/1 var(--serif); color: var(--green); }
.mag-quote p { margin: 0; font: italic 500 clamp(1.375rem, 1.2rem + 0.8vw, 1.875rem)/1.35 var(--serif); color: var(--ink); hyphens: manual; }
.mag-quote cite { display: block; margin-top: 0.85rem; font: 700 0.8125rem/1.3 var(--font-head); font-style: normal; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.mag-box { padding: 1.25rem 1.4rem; background: #fff; border-left: 4px solid var(--petrol); font-size: 0.95em; box-shadow: 0 1px 0 var(--rule); }
.mag-box.is-tip { border-color: var(--green); background: #f3f8ee; }
.mag-box.is-warn { border-color: #c47f0a; background: #fff8e8; }
.mag-box-label { margin: 0 0 0.35rem !important; font: 800 0.6875rem var(--font-head); letter-spacing: 0.14em; text-transform: uppercase; color: var(--petrol); }
.mag-box.is-tip .mag-box-label { color: var(--green-700); } .mag-box.is-warn .mag-box-label { color: #8a5a00; }
.mag-box h4, .mag-facts h4 { margin: 0 0 0.5rem; font: 700 1.125rem/1.3 var(--font-head); color: var(--ink); }
.mag-box > * + * { margin-top: 0.6em; }
.mag-facts { padding: 1.4rem 1.5rem; background: var(--petrol); color: #e6eef0; font-size: 0.95em; }
.mag-facts h4 { color: #fff; }
.mag-facts ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.6rem; }
.mag-facts li { position: relative; padding-left: 1.6rem; }
.mag-facts li::before { content: ""; position: absolute; left: 0; top: 0.45em; width: 0.9rem; height: 0.5rem; border-left: 2px solid var(--green-300); border-bottom: 2px solid var(--green-300); transform: rotate(-45deg); }
.mag-facts a { color: var(--green-300); }
.mag-table { margin-inline: 0; }
.mag-table-scroll { overflow-x: auto; }
.mag-table table { width: 100%; border-collapse: collapse; font: 400 0.9375rem/1.45 var(--font-body); }
.mag-table th { text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--ink); font-weight: 700; color: var(--ink); white-space: nowrap; }
.mag-table td { padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--rule); vertical-align: top; }
.mag-qa .mag-q { font: 700 1.0625rem/1.5 var(--font-head); color: var(--green-700); }
.mag-qa .mag-a, .mag-qa p + p { margin-top: 0.5em; }

.art-end { clear: both; margin-top: 3rem !important; display: grid; gap: 1.5rem; }
.end-mark { display: block; width: 12px; height: 12px; background: var(--green); margin-top: -2.2rem; }
.author-box { padding: 1.25rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); }
.ab-label { margin: 0 !important; font: 800 0.6875rem var(--font-head); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.ab-name { margin: 0.3rem 0 0 !important; font: 700 1.25rem/1.3 var(--serif); }
.ab-role { margin: 0.15rem 0 0 !important; font: 400 0.875rem var(--font-body); color: var(--muted); }
.more { margin-top: clamp(2rem, 1.5rem + 2vw, 3.5rem); }

/* Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 1rem; background: rgb(8 16 20 / 0.92); animation: lbIn 200ms ease; }
.lightbox[hidden] { display: none; }
.lightbox figure { margin: 0; max-width: min(1400px, 100%); max-height: 100%; display: grid; gap: 0.6rem; }
.lightbox img { max-width: 100%; max-height: calc(100dvh - 7rem); object-fit: contain; margin: 0 auto; }
.lightbox figcaption { color: #d5dcde; font: 400 0.9375rem/1.4 var(--font-body); text-align: center; }
.lightbox button { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgb(255 255 255 / 0.12); color: #fff; font-size: 1.5rem; cursor: pointer; }
.lb-close { top: 1rem; right: 1rem; } .lb-prev { left: 1rem; top: 50%; } .lb-next { right: 1rem; top: 50%; }
@keyframes lbIn { from { opacity: 0; } }

@media print {
  .site-header, .topbar, .site-footer, .mh-top, .mh-nav, .share, .read-progress, .more, .art-toc, .preview-bar { display: none !important; }
  .mag { background: #fff; } .art-body { max-width: none; font-size: 11pt; }
  .art h1 { font-size: 26pt; } .art-herohead { min-height: 0; color: #000; background: none; } .art-herohead::after, .art-herohead img { display: none; } .art-herotext h1, .art-herotext .art-sub { color: #000; }
}
@media (prefers-reduced-motion: reduce) { .lead-img img, .c-img img, .mag-gal-item img, .share a, .share button { transition: none; } .lightbox { animation: none; } }