/* Scoped article enhancement: all selectors start with .ee-article */
.ee-article {
  --ee-green: #1f6a32;
  --ee-green-dark: #174c26;
  --ee-green-soft: #f0f6ee;
  --ee-ink: #162033;
  --ee-muted: #56625b;
  --ee-line: #dfe5df;
  --ee-paper: #ffffff;
  color: var(--ee-ink);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.58;
}
.ee-article *, .ee-article *::before, .ee-article *::after { box-sizing: border-box; }
.ee-article a { color: var(--ee-green-dark); text-decoration-thickness: .08em; text-underline-offset: .14em; }
.ee-article h2, .ee-article h3 { font-family: Georgia, "Times New Roman", serif; color: var(--ee-ink); line-height: 1.17; }
.ee-article h2 { margin: 2.1rem 0 .7rem; font-size: clamp(1.55rem, 2.8vw, 2.05rem); }
.ee-article h3 { margin: 1.6rem 0 .5rem; font-size: clamp(1.25rem, 2.2vw, 1.55rem); }
.ee-article__hero { margin: 1.25rem 0 1.1rem; }
.ee-article__hero img { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:10px; }
.ee-article__hero figcaption { margin:.55rem 1rem 0; color:var(--ee-muted); font-size:.92rem; }
.ee-callout { display:grid; grid-template-columns:52px 1fr; gap:1rem; margin:1.35rem 0; padding:1.1rem 1.15rem; background:linear-gradient(100deg,#f7fbf4,#edf5ea); border:1px solid var(--ee-line); border-left:7px solid var(--ee-green); border-radius:0 10px 10px 0; }
.ee-callout__icon { width:48px; height:48px; color:var(--ee-green); }
.ee-callout h2, .ee-callout h3 { margin:0 0 .15rem; font-size:1.12rem; color:var(--ee-green-dark); }
.ee-callout p { margin:0; }
.ee-energy-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.8rem; margin:1.25rem 0 2rem; }
.ee-energy-card { display:flex; flex-direction:column; align-items:center; min-height:225px; padding:1rem .8rem .85rem; text-align:center; border:1px solid var(--ee-line); border-radius:10px; background:var(--ee-paper); box-shadow:0 6px 18px rgba(22,32,51,.045); }
.ee-energy-card img { width:58px; height:58px; color:var(--ee-green); margin:.05rem 0 .55rem; }
.ee-energy-card h3 { font-family:Arial,Helvetica,sans-serif; font-size:1.02rem; margin:0 0 .45rem; }
.ee-energy-card p { margin:0 0 .75rem; font-size:.88rem; color:#303a33; }
.ee-energy-card a { margin-top:auto; font-size:.88rem; font-weight:700; text-decoration:none; }
.ee-data-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:1rem; align-items:start; margin:1rem 0 2rem; }
.ee-chart { width:100%; height:auto; display:block; }
.ee-table-wrap { overflow-x:auto; border:1px solid var(--ee-line); border-radius:10px; background:#fff; }
.ee-article table { width:100%; border-collapse:collapse; margin:0; font-size:.92rem; }
.ee-article th, .ee-article td { padding:.72rem .75rem; border-bottom:1px solid var(--ee-line); vertical-align:top; text-align:left; }
.ee-article th { background:#f1f3f1; font-weight:700; }
.ee-article tbody tr:nth-child(even) { background:#fafcfa; }
.ee-article tbody tr:last-child td { border-bottom:0; }
.ee-compare { margin:1rem 0 1.2rem; }
.ee-compare__label { display:inline-flex; align-items:center; gap:.45rem; font-weight:700; }
.ee-compare__dot { width:.75rem; height:.75rem; border-radius:50%; background:var(--ee-green); flex:0 0 auto; }
.ee-conclusion { margin:2rem 0 1rem; padding:1rem 1.1rem; border:1px solid #cfe0cd; border-radius:10px; background:var(--ee-green-soft); color:var(--ee-green-dark); font-weight:700; }
.ee-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:1.5rem; align-items:start; }
.ee-toc { position:sticky; top:1rem; border:1px solid var(--ee-line); border-radius:10px; padding:1rem; background:#fff; max-height:calc(100vh - 2rem); overflow:auto; }
.ee-toc h2 { margin:0 0 .75rem; font-size:1.25rem; }
.ee-toc ul { list-style:none; margin:0; padding:0; }
.ee-toc li { margin:.4rem 0; }
.ee-toc a { display:block; padding:.22rem .35rem .22rem .75rem; border-left:3px solid transparent; text-decoration:none; font-size:.92rem; }
.ee-toc a:hover, .ee-toc a:focus { border-left-color:var(--ee-green); background:var(--ee-green-soft); }
@media (max-width:1050px) { .ee-energy-grid { grid-template-columns:repeat(3,1fr); } .ee-layout { grid-template-columns:1fr; } .ee-toc { position:static; max-height:none; order:-1; } }
@media (max-width:720px) { .ee-energy-grid { grid-template-columns:repeat(2,1fr); } .ee-data-grid { grid-template-columns:1fr; } .ee-callout { grid-template-columns:40px 1fr; } .ee-callout__icon { width:38px; height:38px; } }
@media (max-width:440px) { .ee-energy-grid { grid-template-columns:1fr; } .ee-energy-card { min-height:0; } }
@media print { .ee-toc { display:none; } .ee-layout { display:block; } .ee-energy-card { break-inside:avoid; box-shadow:none; } }

/* =========================================================
   NGO EE – Layoutkorrektur 2026-08-04
   Anpassung an die reale schmale Artikelsäule
   ========================================================= */

/* Hero wirklich über die gesamte Artikelsäule */

figure.ee-article__hero {
    display: block;
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
}

figure.ee-article__hero picture {
    display: block;
    width: 100%;
}

figure.ee-article__hero picture img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/*
 * Nicht mehr nach Browserbreite entscheiden.
 * Die Karten reagieren jetzt auf den tatsächlich verfügbaren Platz.
 */

.ee-energy-grid {
    grid-template-columns:
        repeat(auto-fit, minmax(135px, 1fr));
}

.ee-energy-card {
    min-width: 0;
}

/*
 * Diagramm und Tabelle stapeln sich automatisch,
 * sobald keine zwei sinnvollen Spalten mehr hineinpassen.
 */

.ee-data-grid {
    grid-template-columns:
        repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}

.ee-data-grid > * {
    min-width: 0;
}

.ee-chart {
    display: block;
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
}

/* Tatsächlich von Docutils erzeugtes Inhaltsverzeichnis */

.contents.topic {
    max-height: 34rem;
    overflow-y: auto;
    margin: 1.25rem 0 2rem;
    padding: 1rem 1.15rem;

    border: 1px solid #dfe5df;
    border-radius: 10px;

    background: #ffffff;
    box-shadow: 0 6px 18px rgba(22, 32, 51, 0.045);
}

.contents.topic .topic-title {
    margin: 0 0 0.75rem;
    color: #174c26;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.25rem;
}

.contents.topic ul {
    margin: 0;
    padding-left: 1.15rem;
}

.contents.topic ul ul {
    margin-top: 0.25rem;
}

.contents.topic li {
    margin: 0.32rem 0;
}

.contents.topic a {
    color: #174c26;
    text-decoration: none;
}

.contents.topic a:hover,
.contents.topic a:focus {
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

/* Kleine Bildschirme */

@media (max-width: 600px) {
    .ee-energy-grid {
        grid-template-columns:
            repeat(auto-fit, minmax(150px, 1fr));
    }

    .ee-data-grid {
        grid-template-columns: 1fr;
    }

    .contents.topic {
        max-height: 28rem;
    }
}