/* digitale-enteignung.de — zentrale Ergänzungen (v24.0)
   Wird nach dem seiteneigenen Inline-CSS geladen und gewinnt bei gleicher Spezifität.
   Globale Regeln gehören hierher, nicht in die einzelnen Seiten. */

:root{
  --text-muted:rgba(224,224,224,0.62);   /* ≈ #8B8B8B, Kontrast 6,2:1 auf Schwarz */
  --text-soft:rgba(224,224,224,0.72);    /* ≈ #A1A1A1, Kontrast 8,3:1 */
  --text-faint:rgba(224,224,224,0.5);    /* ≈ #707070, 4,2:1: nur ab 18px oder dekorativ */
}

/* Bewegung nur, wenn der Nutzer sie nicht abgeschaltet hat */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.001ms!important;animation-iteration-count:1!important;transition-duration:0.001ms!important;scroll-behavior:auto!important}
  .cursor,.pulse-dot{animation:none!important;opacity:1!important}
}

/* Systemlinks auf Palette */
.author-role a,.gl-def a,.article-body a:not([class]){color:var(--text);text-decoration-color:var(--red);text-underline-offset:3px}
.author-role a:hover,.article-body a:not([class]):hover{color:var(--white)}

/* Karten: Heroes sind 16:9, nicht 1200:630 */
.related-img{aspect-ratio:16/9}

/* Mobile-Autorenband im Hero der Startseite */
.hero-author-mobile{display:none}
@media (max-width:768px){
  .hero-author-mobile{display:flex;align-items:center;gap:0.9rem;margin:1.75rem 0 1.5rem;padding-top:1.25rem;border-top:1px solid var(--border)}
  .hero-author-mobile img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:none;box-shadow:0 0 0 1px rgba(255,42,42,.30), 0 0 10px 2px rgba(255,42,42,.16);flex-shrink:0}
  .hero-author-mobile .ham-name{font-weight:700;color:var(--white);font-size:1.05rem;line-height:1.2}
  .hero-author-mobile .ham-role{font-family:var(--mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-muted);margin-top:2px}
}

/* Datentabellen unter Grafiken */
.figure-data{margin:0.75rem 0 2rem;font-family:var(--mono);font-size:13px}
.figure-data summary{cursor:pointer;color:var(--text-muted);letter-spacing:0.06em;text-transform:uppercase;font-size:12px;padding:0.4rem 0}
.figure-data summary:hover{color:var(--text)}
.figure-data table{border-collapse:collapse;width:100%;margin:0.5rem 0 0.25rem;font-variant-numeric:tabular-nums}
.figure-data th,.figure-data td{text-align:left;padding:0.45rem 0.6rem;border-bottom:1px solid var(--border);vertical-align:top}
.figure-data th{color:var(--text-muted);font-weight:400;font-size:12px;letter-spacing:0.04em}
.figure-data td.num{text-align:right;white-space:nowrap}
.figure-data .src{color:var(--text-muted);font-size:12px;margin-top:0.4rem}
.figure-data .tbl-scroll{overflow-x:auto}

/* Fokus sichtbar halten */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* Redaktionsblock (Kontakt) und Angebot (Über mich) */
.press-block{margin-top:3rem;padding:1.5rem 1.75rem;border:1px solid var(--border);background:rgba(255,255,255,0.02)}
.press-block h2,.press-block h3{color:var(--white);margin:0 0 0.75rem}
.press-block .press-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-top:1rem}
.press-block .press-item{border-left:2px solid var(--red);padding-left:0.9rem}
.press-block .press-item b{display:block;color:var(--white);margin-bottom:0.25rem}
.press-block .press-item p{margin:0;color:var(--text-soft);font-size:0.95rem}
.press-block .press-bio{margin-top:1.25rem;font-size:0.95rem;color:var(--text-soft)}
.press-block .press-bio p{margin:0.5rem 0}
.press-block .press-note{font-family:var(--mono);font-size:12px;letter-spacing:0.04em;color:var(--text-muted);margin-top:1rem}
.press-block .press-photo{display:inline-flex;align-items:center;gap:0.75rem;margin-top:1rem;color:var(--text);text-decoration:none;border:1px solid var(--border);padding:0.5rem 0.9rem;font-family:var(--mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase}
.press-block .press-photo img{width:36px;height:36px;border-radius:50%}
.press-block .press-photo:hover{border-color:var(--red)}

/* Footer: fünf Links müssen auf 390px umbrechen dürfen */
.footer-links{flex-wrap:wrap;row-gap:0.6rem;max-width:100%}
@media (max-width:768px){
  footer{flex-direction:column;align-items:flex-start;gap:1.25rem}
  .footer-links{justify-content:flex-start}
}

/* Navigation: sieben Punkte bei 12px auf schmalen Desktops in einer Zeile halten */
@media (min-width:769px) and (max-width:1120px){
  .nav-links{gap:1.1rem}
  .nav-links a{letter-spacing:0.06em}
}

section.press-block{margin:0 2.5rem 3.5rem}
@media (max-width:768px){section.press-block{margin:0 1.25rem 2.5rem}}
.press-block a{color:var(--text);text-decoration-color:var(--red);text-underline-offset:3px}
.press-block a:hover{color:var(--white)}
.press-block a.btn-red,.press-block a.press-photo{text-decoration:none}
.press-block a.btn-red{color:var(--white)}
.article-wrap{min-width:0}
.article-body{min-width:0;max-width:100%}
/* v27.14: Lesebreite der Artikel. Die frühere Zeile setzte max-width:100% auch auf
   .article-wrap und hob damit die 800px des Seiten-CSS auf; auf breiten Bildschirmen
   liefen die Absätze über die ganze Fensterbreite (186 bis 210 Zeichen je Zeile). */
.article-wrap{max-width:720px}
@media (max-width:768px){.article-wrap{max-width:100%}}
/* v27.14: Die Regel nav{position:sticky;...} im Seiten-CSS greift auf JEDES nav-Element,
   also auch auf die Brotkrume der Artikel. Die klebte dadurch oben und verdeckte die
   Hauptnavigation vollständig. Hier zurückgesetzt. */
nav.breadcrumb{position:static;height:auto;display:block;background:none;backdrop-filter:none;border-bottom:0;padding:0;z-index:auto;justify-content:flex-start}
/* v27.14: Breite Bauteile duerfen aus der Lesespalte ausbrechen, damit die Lesebreite
   den Datenwerkzeugen nicht die Luft nimmt (etwa die MiCA-Lizenztabelle). */
@media (min-width:769px){
  .article-wrap .md-wrap{width:min(1100px,calc(100vw - 5rem));margin-left:50%;transform:translateX(-50%)}
}

/* ============================================================
   v27.14, Teil 3: Typografie und Erkennungsmerkmal
   ============================================================ */

/* Leseschrift fuer den Fliesstext der Artikel. Barlow Semi Condensed ist eine
   schmallaufende Auszeichnungsschrift; bei 656 px standen damit 89 Zeichen in der
   Zeile. Newsreader liegt seit v27.8 selbst gehostet vor und wird auf der
   Verkaufsseite verwendet. Ueberschriften, Navigation, Kennzeichnungen und
   Datenbauteile bleiben unveraendert. */
.article-body > p,
.article-body > ul > li,
.article-body > ol > li,
.article-body > blockquote p{
  font-family:'Newsreader',Georgia,'Times New Roman',serif;
  color:rgba(224,224,224,0.85);
}
.article-body > p{font-size:1.125rem;line-height:1.7;margin-bottom:1.4rem}
.article-body > ul > li,.article-body > ol > li{font-size:1.0625rem;line-height:1.65}
.article-body > p strong,.article-body > p b,
.article-body > ul > li strong,.article-body > ol > li strong{font-weight:600;color:var(--white)}
.article-body > p em,.article-body > p i{font-style:italic}
@media (max-width:768px){
  .article-body > p{font-size:1.0625rem;line-height:1.65}
}

/* Befund: Erkennungsmerkmal am Kopf jedes Artikels. Traegt den Kernsatz des
   Beitrags in Tobis Wortlaut (vormals .article-lead), den Stand und die Zahl der
   im Quellenverzeichnis gelisteten Quellen. Der rote Kreis ist das Markensymbol. */
.befund{margin:0 0 2.25rem;padding:1.3rem 1.6rem;border-left:2px solid var(--red);background:rgba(255,42,42,0.04)}
.befund-head{display:flex;align-items:center;gap:0.6rem;margin-bottom:0.8rem}
.befund-mark{width:17px;height:17px;flex:0 0 auto;display:block}
.befund-label{font-family:var(--mono);font-size:11.5px;letter-spacing:0.18em;text-transform:uppercase;color:var(--red)}
.befund-text{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:1.1875rem;line-height:1.6;color:rgba(224,224,224,0.92);margin:0}
.befund-meta{margin-top:0.9rem;font-family:var(--mono);font-size:11.5px;letter-spacing:0.06em;color:var(--text-muted)}
@media (max-width:768px){
  .befund{padding:1.1rem 1.2rem}
  .befund-text{font-size:1.0625rem}
}

/* Glossaruebersicht: Sprungleiste bleibt ueber 16.000 px Lauflaenge erreichbar,
   ab 1100 px zwei Spalten, Definitionen in der Leseschrift statt in der Monoschrift. */
@media (min-width:769px){
  .gl-bar{position:sticky;top:56px;z-index:50;background:rgba(0,0,0,0.96);backdrop-filter:blur(12px);padding:0.7rem 2rem;max-width:none;justify-content:center;border-bottom:1px solid var(--border)}
}
.gl-term{line-height:1.25}
.gl-def{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:1.0625rem;line-height:1.65;color:rgba(224,224,224,0.85)}
.gl-letter{scroll-margin-top:118px}
.gl-entry{scroll-margin-top:118px}
/* Ab 1100 px steht der Begriff links, die Definition rechts. Das haelt die
   alphabetische Reihenfolge in einer Spalte (anders als ein Zweispaltensatz, der
   die Liste in A bis O und P bis Z zerlegt) und kuerzt die Lauflaenge deutlich. */
@media (min-width:1100px){
  .gl-wrap{max-width:1180px}
  .gl-entry{display:grid;grid-template-columns:240px minmax(0,660px);column-gap:3rem;align-items:start}
  .gl-term{grid-column:1;grid-row:1;margin:0}
  .gl-def{grid-column:2;grid-row:1}
  .gl-entry > .gl-link{grid-column:2;grid-row:2;margin-top:0.5rem}
  .gl-letter{max-width:1180px}
}

.article-body .data-table,.figure-data{max-width:100%;overflow-x:auto}
.article-body .data-table table{min-width:520px}

/* v27.14, Teil 4: Glossar-Einzelseiten, Fliesstext in der Leseschrift wie in den
   Artikeln. Erkennung ueber die Dachzeile .gl-eyebrow direkt unter main; die
   Uebersicht /glossar hat keine Fliesstextabsaetze und bleibt unberuehrt. Der Block
   "Begriff und Synonyme", Quellen und Zitierhinweis bleiben in der Monoschrift. */
main:has(> .gl-eyebrow) > p:not([class]),
main:has(> .gl-eyebrow) > ul > li,
main:has(> .gl-eyebrow) .nw-feld p,
main:has(> .gl-eyebrow) .nw-feld ul > li,
main:has(> .gl-eyebrow) .nw-abgrenzung p{
  font-family:'Newsreader',Georgia,'Times New Roman',serif;
  font-size:1.125rem;line-height:1.7;color:rgba(224,224,224,0.85);
}
main:has(> .gl-eyebrow) > p.gl-def{font-size:1.125rem;line-height:1.7}
main:has(> .gl-eyebrow) > p:not([class]) strong,
main:has(> .gl-eyebrow) .nw-feld p strong,
main:has(> .gl-eyebrow) .nw-abgrenzung p strong{font-weight:600;color:var(--white)}
@media (max-width:768px){
  main:has(> .gl-eyebrow) > p:not([class]),
  main:has(> .gl-eyebrow) > ul > li,
  main:has(> .gl-eyebrow) .nw-feld p,
  main:has(> .gl-eyebrow) .nw-feld ul > li,
  main:has(> .gl-eyebrow) .nw-abgrenzung p,
  main:has(> .gl-eyebrow) > p.gl-def{font-size:1.0625rem;line-height:1.65}
}

/* ============================================================
   v27.15: Druckstil. Die Lizenz erlaubt Ausdruck und Ablage im Vorgang;
   die Seiten sollen gedruckt lesbar und zitierfaehig sein.
   ============================================================ */
@media print{
  @page{margin:16mm 16mm 22mm 16mm}
  *,*::before,*::after{background:transparent!important;color:#000!important;text-shadow:none!important;box-shadow:none!important;-webkit-text-fill-color:#000!important}
  html,body{background:#fff!important}
  body{font-size:10.5pt;line-height:1.45;padding-bottom:10mm}
  nav,.nav-toggle,.skip-link,.gl-bar,.li-cta,.nl-inline,.nl-inline-wrap,.nw-werk,.related-wrap,.article-back,
  .en-more,.lb,.footer-links,form,.press-photo,.gl-back,.crumbs,.breadcrumb,.article-hero-wrap,.article-hero,
  .hero-author,.hero-author-mobile,.btn-red,.btn,.cursor,.pulse-dot{display:none!important}
  main,.article-wrap,.gl-wrap,.wrap{max-width:100%!important;padding:0!important;margin:0!important;width:auto!important}
  .article-wrap .md-wrap{width:auto!important;margin-left:0!important;transform:none!important}
  h1{font-size:20pt;line-height:1.15;margin:0 0 6pt}
  h2{font-size:13.5pt;break-after:avoid;page-break-after:avoid;margin-top:14pt}
  h3{font-size:11.5pt;break-after:avoid;page-break-after:avoid}
  p,li{orphans:3;widows:3}
  .article-body > p,.gl-def,main:has(> .gl-eyebrow) > p:not([class]),.nw-feld p,.nw-abgrenzung p{font-size:10.5pt!important;line-height:1.45!important}
  a{text-decoration:none!important}
  .article-body a[href^="http"]::after,.gl-def a[href^="http"]::after,.nw-feld a[href^="http"]::after,.fn a[href^="http"]::after{content:" (" attr(href) ")";font-size:8.5pt}
  img,figure,table,.stats-grid,.befund,.gl-cite,.note-box{break-inside:avoid;page-break-inside:avoid}
  img{max-width:100%!important;height:auto!important;filter:grayscale(1)}
  .befund{border:1px solid #000!important;border-left:4px solid #000!important;padding:8pt 10pt!important;margin-bottom:12pt!important}
  .befund-mark circle{stroke:#000!important}
  .gl-cite,.nw-begriff{border:1px solid #000!important;padding:6pt 8pt!important}
  .stats-grid{border:1px solid #000!important;gap:0!important}
  .stat-box{border-right:1px solid #000!important}
  .md-table th,.md-table td,.figure-data th,.figure-data td{border-bottom:1px solid #999!important}
  details{display:block}
  details > summary{list-style:none}
  footer{border-top:1px solid #000;margin-top:14pt;padding-top:6pt;font-size:8.5pt}
  .footer-logo{display:block}
  body::after{content:"Quelle: " attr(data-url) "   ·   Stand " attr(data-stand) "   ·   Tobias Kremp, unabhängiger Autor (Art. 5 GG), keine behördliche Stellungnahme";
    display:block;margin-top:10pt;font-family:'JetBrains Mono',monospace;font-size:7.5pt;line-height:1.3;
    border-top:1px solid #000;padding-top:3pt;background:#fff!important}
  footer{display:none!important}
  li{font-size:10.5pt!important;line-height:1.45!important}
  ol,ul{padding-left:1.6em!important;margin-left:0!important}
  li::marker{color:#000!important}
  .nw-feld li::before,.article-body li::before{background:#000!important;color:#000!important;border-color:#000!important}
  body:not([data-stand])::after{content:"Quelle: " attr(data-url) "   ·   Tobias Kremp, unabhängiger Autor (Art. 5 GG), keine behördliche Stellungnahme"}
}

/* v27.15: Startseite. Der Hero war auf 90vh Mindesthoehe gesetzt und lief bei
   1440 x 900 mit rund 200 px Leerraum ueber und unter dem Inhalt; die erste
   Publikation war ohne Scrollen nicht sichtbar. */
@media (min-width:769px){
  .hero{min-height:0}
  .hero-left{padding:4.25rem 3rem 3.75rem 2.5rem}
  .hero-right{padding:2.5rem 2rem}
}

/* v27.15: Fragen und Antworten an den Glossareintraegen (sichtbar, aufklappbar;
   Schema FAQPage im Kopf der Seite). Antworten sind Absaetze des Eintrags. */
.gl-faq{margin:2.6rem 0 2.2rem;padding-top:1.4rem;border-top:1px solid var(--border)}
.gl-faq-title{font-family:var(--mono);font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--red);font-weight:700;margin:0 0 0.9rem}
.gl-faq-item{border-bottom:1px solid rgba(255,255,255,0.08)}
.gl-faq-item summary{cursor:pointer;list-style:none;padding:0.85rem 1.6rem 0.85rem 0;position:relative;font-family:var(--display);font-weight:700;font-size:1.05rem;color:var(--white);line-height:1.35}
.gl-faq-item summary::-webkit-details-marker{display:none}
.gl-faq-item summary::after{content:"+";position:absolute;right:0.2rem;top:0.75rem;font-family:var(--mono);font-size:16px;color:var(--red)}
.gl-faq-item[open] summary::after{content:"\2212"}
.gl-faq-item summary:hover{color:var(--red)}
.gl-faq-item p{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:1.0625rem;line-height:1.65;color:rgba(224,224,224,0.85);margin:0 0 1rem;max-width:66ch}
@media print{
  .gl-faq-item summary::after{display:none}
  .gl-faq-item summary{font-size:11pt}
}

/* v27.15: Kontrast. Weiss auf dem Markenrot #FF2A2A liegt bei 3,7:1 und verfehlt
   AA fuer 12-px-Text; Schaltflaechen bekommen ein um eine Stufe tieferes Rot (4,7:1),
   das Markenrot bleibt fuer Linien, Marken und Auszeichnungen. Rote Kennzeichnungen
   in grauen Kaesten (#333) lagen bei 3,4:1; die Kaesten werden nahezu schwarz. */
.btn-red,.li-btn,.nl-inline-btn,.nw-werk-links a.primary,button.btn-red{background:#E31B1B;border-color:#E31B1B}
.btn-red:hover,.li-btn:hover,.nl-inline-btn:hover,.nw-werk-links a.primary:hover{background:#FF2A2A;border-color:#FF2A2A}
.nl-inline,.nw-werk{background:#101010}
.li-cta-btn{color:#5AA5EA;border-color:rgba(90,165,234,0.45)}
.li-cta-btn:hover{color:#fff;border-color:#5AA5EA}
.gl-sub a{color:var(--text);text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px}
.gl-sub a:hover{color:var(--white)}
/* v27.15: Ziel des Skip-Links nimmt den Fokus an, ohne selbst einen Ring zu zeigen */
main:focus{outline:none}
/* Skip-Link zentral, damit auch die vier Hilfsseiten ihn haben */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;background:#101010;color:var(--white);padding:0.75rem 1rem;font-family:var(--mono);font-size:12px;text-decoration:none;letter-spacing:0.1em;z-index:200}
.skip-link:focus{position:fixed;left:0.75rem;top:0.75rem;width:auto;height:auto;outline:2px solid var(--red);outline-offset:3px}

/* v27.15: Der Umschlag auf der Verkaufsseite liegt absolut rechts im Hero; die
   nachfolgend animierten Textbloecke (h1) lagen im Stapel darueber und fingen die
   Klicks ab, die Lightbox war mit der Maus nicht erreichbar. */
.hero-cover{z-index:3}