/* - main Box-Modell anpassen */
*,
*::before,
*::after {
  box-sizing: border-box;
}
:root {    
    --system-color: #007a72;
    --system-very-light: #f5f5f5;
    --system-tiles: #f0f0f0;
    --system-light: #eee;
	--system-medium: #aaa;
    --system-halfdark: #777;
    --system-dark: #444;
    --border-width: 1px;
}
html {
    scroll-padding-top:4rem;
}
body {    
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Noto Sans", "Liberation Sans", Roboto, sans-serif;
    font-size: 1.155rem;
    line-height: 1.6; 
    color: #1a1a1a;
    margin:0;    
}
main {	
    max-width:800px;
	margin: 0 auto;
	counter-reset: fn;
    padding:0 .4rem;
	}
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    /* Fallback für alte Browser */
    clip: rect(0, 0, 0, 0); 
    /* CSS3 */
    clip-path: inset(50%); 
    border: 0;
    white-space: nowrap;
}
figure,img {
	max-width:100%;
    height:auto;
    text-align:left;
}
img {
	border:1px solid black;
}
.fig-quote {
    margin:2rem .5rem;
	padding-left: .7rem;
	border-left: .1rem solid var(--system-medium);
}
.fig-block {
	text-align:left;
    margin:3em 0;
}
.fig-decor {
    border-left:none;
    text-align:right;
    margin:6rem 0 0 0;
}
.fig-float-left img,.fig-float-right img {
    margin-top:.8rem;
    }
figure blockquote, figcaption {
    margin: 0;
    padding: 0;
}
figcaption {
	font-size:.9em;
}
.fig-quote figcaption {
	text-align:right;
	padding-top:.5em;
    text-wrap:balance;
}
.fig-block figcaption {
	padding:0;
	margin:.5em 0 0 0;
	}
.fig-decor figcaption {
    border-left:none;
    text-align:right;
    margin:2rem 0 0 0;
}
.fig-parabel {
    margin: 2em 60px; 
    text-align: justify;
    hyphens: auto;    
}
.fn-ref {
    text-decoration: none;
    outline: none;
    display: inline;
    font-size:.9em;
    padding-left:.1em;
    color:var(--system-color);
	}
.fn-ref::before {
    counter-increment: fn;
    content: '[' counter(fn) ']';     
    vertical-align: super;
    font-size: 0.9em;
    line-height: 1;
    position: relative;
    top: -.050em;
}
.article-end-meta {
    max-width: 800px; 
    margin: 0 auto;
    display: block;
    padding: 6em 0 1em 0;
}
nav.nav-links {
    display:block;
    margin-top:3em;
    padding:0;
}
.metadata {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    font-size: 0.85em;
    color: var(--system-dark);
    margin-top: 2rem;
    padding-top: 1rem;
    gap:4rem;
}
.quoteme {
    flex: 1 1 60%;
    padding-right: 1rem;
}
.pubdate {
    flex: 0 1 auto;
    text-align: right;
    color: var(--system-dark);
}
/* Mobile Optimierung */
@media (max-width: 768px) {
    .pubdate {
        text-align: left;
        margin-top: 1rem;
        width: 100%;
    }
}
.footnotes-area {
    margin-top:4em;
}
.footnotes-area h2 {
    margin-top:1em
}
.footnotes-area:before {
    content: ""; /* Muss gesetzt werden */
    display: block;
    width: 150px;
    height: 2px;
    background-color: var(--system-medium);
    margin: 0;
}
.footnotes-area dt {
	font-weight:bold;
	margin-top:1em;
}
.footnotes-area dd {
	margin-top:.5em;
}
.first-char {
    font-size:140%;
    font-weight:bold;
    margin-top:2em;
    margin-bottom:1em;
}
.revlit {
    font-size:80%;
    font-weight:bold;
    color:var(--system-color);
    }
.quote-indent {
    margin-left:1.5em;
    margin-top:1em;
    margin-bottom:1em;
}
.invalid_url {
    color:#0000ff;
    text-decoration:line-through;
    font-weight:bold;
}
dd {
    margin-top:0;
    margin-bottom: .2em;
    margin-left: 1em;
}
.chronologie dt {
    font-weight:bold;
    margin:2em 0 .5em 0;
}
dl.ns-liste dt {
    font-weight: bold;
    margin-top:2rem;
    margin-bottom:0;
}
hr.trenner {
    margin:2em 0;
    border-top: 1px solid var(--system-dark);
}
.gotop {
	display:block;
	max-width:800px;
	margin:0 auto;
	padding:3em 0 3em 0;
}
.show-on-mobile {
background:#fff;
display:block;
}
#cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background-color:var(--system-very-light);
    border-top: 2px solid #ccc;
    padding: 1.5rem;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
    text-align: center;
}
#cookie-banner a.button-yes {
    display:inline-block;
    background: green;
    color: white;
    padding: 5px 15px;
    border:1px solid black;
    width:30%;
    margin-right:10%;
}
#cookie-banner a.button-no {
    display:inline-block;
    background: var(--system-dark);
    color: white;
    padding: 5px 10px;
    width:30%;
}
#cookie-banner p {
    line-height:1.4;
    font-size:90%;
}
/* nav */
.menu-checkbox {
    position: absolute;
    width: 44px;
    height: 44px;
    opacity: 0;
    cursor: pointer;
    z-index: 10;
}
.menu-checkbox:focus + #menu-toggle {
    outline: 2px solid var(--system-color);
    outline-offset: -2px;
}
.nav-container {
    margin:0;
}
nav {
    margin:0 auto;
    padding:1rem;
}
#menu-toggle {
    display: block; 
    border: 1px solid var(--system-dark);
    color: var(--system-dark);
    font-size: 24px;
    padding: 5px 10px;
    cursor: pointer;
    line-height: 1;
    width:100%;
    display:inline;
}
#main-menu-list {
    line-height:1rem;
    list-style: none;
    padding: 0;
    margin: 0;    
    display:none;
    width: 100%;     
    position: absolute; 
    top: 100%; 
    left: 0; 
    z-index: 1000;
    background-color:var(--system-tiles);
}
#main-menu-list li {
    margin:0;    
}
#menu-state:checked ~ #main-menu-list {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--system-dark);
}
#menu-state:focus ~ #menu-toggle {
    outline: 2px solid var(--system-color);
}
#main-menu-list li a {
    display: block;
    padding: 25px 15px;
    text-decoration: none;
    color: var(--system-color);
    border: var(--border-width) solid transparent; 
    border-bottom: var(--border-width) solid #000;
}
#main-menu-list li a:hover {
    background-color: var(--system-color);
	color: white;    
    border-bottom: var(--border-width) solid var(--system-color);
}
.skip-link {
    position: absolute;
    top: -100px;
    left: 0;
    background: #990000;
    color: white;
    padding: 8px 15px;
    z-index: 10000;
    text-decoration: none;
    font-weight: bold;
    border-radius: 0 0 5px 0;
    transition: top 0.2s;
}
.skip-link.abc-skip {
    white-space: nowrap;    
    width:auto !important; 
    height:auto;    
    line-height: normal;
}
.skip-link:focus {
    top: 0;
}
#main-content {
    outline: none;
    display: block;
    height: 0;
    overflow: hidden;
}
.abc-skip:focus {
    background: var(--system-very-light);
    left: 200px;
    color:#1a1a1a;    
}
#menu-toggle:focus {
    outline: none;
}
#main-menu-list li a:focus {    
    background-color: var(--system-light);
    color: var(--system-color);    
    border: var(--border-width) solid var(--system-color);    
    outline: none;
}
/* header */
header {
    margin:0;
    padding:0;
}
.header-wrapper {
    position: sticky;
    top: 0;
    z-index: 1000;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width:100%;    
    padding-left:.4rem;
    text-align:center;
    background:#eee;
}
.site-name-title {
    font-size: 1.4rem;
    display:block;
	color: var(--system-color);
	margin: 0;
    padding-top:0;
}
.site-name-subtitle {
	display: none; /* Untertitel standardmäßig (Mobile-First) unsichtbar */
	}
/* fc-box */
.fact-check-box {
	box-shadow: 0px 4px 18px rgba(0, 0, 0, 0.61);
	margin-bottom: 3em;
	padding:1.5em;
	background-color: #fafafa;
}
.claim-label::before {
    content: "\274C"; 
    color: #a0522d;
    margin-right: 10px;
    font-weight: bold;
}
.fact-label::before {
    content: "✅";
    color: #008000;
    margin-right: 10px;
}
.claim-label {
    background-color:#f5deb3;
    color: #8b4513;
    padding: 5px 10px;
	font-weight: bold;
	letter-spacing:1px;
}
.fact-label {
    background-color: #f0fff0;
    color: #006400;
    padding: 5px 10px;
	font-weight: bold;
	letter-spacing:1px;
    margin-top:1em;
}
.claim-text, .fact-text {
	margin-top: 1em;
}
/* footer */
.static-footer {
    border-top: 1px solid var(--system-color);
    padding:0;    
    font-size:85%;
}
.footer-content {    
    max-width: 800px;
    margin: 0 auto;
    text-align:center;
    padding-bottom:3rem;    
}
.footer-content p {
    margin-bottom:.2rem;
}
.footer-content p.footer-topic {
    margin-top:2em;
    margin-bottom:0;
    letter-spacing:.1rem;
    color:#555;
    font-weight:bold;
}
.footer-content a {
    display:inline-block;
    margin:0 .5rem;
    color:var(--system-dark);
    text-decoration:none;
}
.footer-content a:hover {
    text-decoration:underline;
}
/* text-styles */
h1,h2,h3,.subtitle,.subtitle-home,.site-name-title {
    font-family: "Iowan Old Style", "Palatino Linotype", "URW Palladio L", "P052", "Georgia", "Times New Roman", serif;
    font-weight:normal;
}
#intro-wrapper {
    margin-top: 3rem;
    margin-bottom: 2rem;
}
h1 {
    margin: 0;
    padding: 0;
    text-wrap: balance;
    hyphens: auto;
    color: #000;
}
.h1first {
    display: block;
    font-family:Arial, Helvetica, sans-serif;
    font-size: clamp(1.1rem, 5vw, 1.2rem);
    letter-spacing: 0.12em;
    color:var(--system-dark); 
    margin-bottom: 1rem;
}
.h1second,.h1single,.main-title {    
    display: block;
    font-size: clamp(1.6rem, 5vw, 2.1rem);
    padding-right: 0.05em;
}
.subtitle,.subtitle-home {
    margin-top:.5em;
    padding:0;
    letter-spacing:.4px;
    color:var(--system-dark);    
}
.subtitle {
        font-size: clamp(.9rem, 5vw, 1rem);
}
.subtitle-home {
    font-size:1.3rem;
}
h2 {
	font-size: clamp(1.3rem, 5vw, 1.7rem);
	margin:3em 0 1em 0;
    letter-spacing:1px;
}
h3 {
	font-size:110%;
    margin:2em 0 1em 0;
    letter-spacing:.3px;
    }
.right {
    text-align:right;
}
.center {
    text-align:center;
}

.extern:after {
    content: "\2197"; /* = Pfeil NE */
    display: inline-block;
    margin-left: 0em; 
    font-size: .8em;
    vertical-align: top;
}
.quelle:after {
    content: "\1F4D6";
    display: inline-block;
    margin-left: 0.1em; 
    font-size: 0.9em;
    color: #666; /* Willkommen im Verschwörungshauptquartier */
    vertical-align: top;
}
a {
    color: var(--system-color);
    text-decoration: underline;
    text-underline-offset: 0.3rem;
}
a cite {
	font-style:normal;
}
a:hover, a:focus {
	    text-decoration: none; 
	}
a:focus {    
    outline: none;
    box-shadow: 0 0 0 2px var(--system-color); 
}
q {
    font-style: normal;
    quotes:none;
}
.cat {    
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.4em;
    margin-top: 4em;
    margin-bottom: 0;
    text-align:right;  
    }
.nav-unit {
    white-space: nowrap;
}
.rel-headline {
    letter-spacing:.05em;
    font-variant:small-caps;
}
.source p {
font-family:monospace;
}
.source hr {
    border: 0;
    border-top: 1px dashed #999;    
    height: 0;
    margin:1em 0;
}
.trigger-note {
    border-left: 4px solid #990000;
    padding-left: 1em;
    margin-bottom: 2em;
    font-style: italic;
}
.footnotes-list li:not(:has(a)) {
    font-style: italic;
    color:var(--system-dark);
}

audio {
    margin-top:1em;
    display:block;
}
.transkript {    
    cursor: pointer;
    border: 1px solid #555;
    font-weight: normal;    
    display: block; 
    background:#eee;
    padding:1rem;
    margin:1rem 0;
}
.transkript .details-content {
background:#eee;
}
.nav-item a {
padding:0 .2rem;
display:inline;
white-space: nowrap;
}
 .nav-item:not(:has(a)) {
    color:var(--system-dark);
}
.personen-indizes {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1em 2em;
    padding: 0.6rem 0;
    border-top: 1px solid var(--system-medium);
    border-bottom: 1px solid var(--system-medium);
    margin: 2rem 0;
}
.section-spacer {
    margin: 3em 0;
    display: flow-root;
}
s {
  text-decoration-thickness: 2px;
}
.fig-container {
display: flex;
    flex-wrap: wrap;       /* Erlaubt den Figures, in die nächste Zeile zu springen */
    gap: 20px;             /* Der Abstand zwischen den Bildern (horizontal & vertikal) */
    justify-content: flex-start; /* Richtet die Elemente linksbündig aus */
    margin: 2em 0;
}
.fig-container figure.fig-flex {
    margin: 0;             /* Setzt die Standard-Browser-Margins zurück */
    display: flex;
    flex-direction: column;
    /* Flex-Basis definiert die Wunschbreite am PC (z.B. ca. 30% für 3 nebeneinander) */
    /* flex: 1 1 calc(33.333% - 20px); */
    min-width: 250px;      /* Verhindert, dass die Bilder auf kleinen Displays zu gequetscht werden */
    max-width: 100%;       /* Schutz für sehr kleine Displays */
}